/* LES DESSINS DE FAÇADE — une feuille partagée (11/09).
   La pastille d'identité, le plan, la maquette et l'élévation en lecture se
   dessinent dans l'app ET dans l'exemple public (exemple.html) : la page
   publique ne charge pas toute la feuille de l'app pour quatre dessins.
   Les règles de CONTEXTE (la maquette dans le volume, le plan dans une
   fiche…) restent dans espace-app.css, chargée APRÈS celle-ci : elles
   gagnent comme avant. Les règles sont venues telles quelles et dans leur
   ordre ; seul leur fichier a changé. */

/* --- L'identite de facade : la meme facade se reconnait partout ------------ */
/* Voir CAHIER_DES_CHARGES_ESPACE_2026-08-18.md, partie 4. La couleur porte
   l'exposition solaire (teal au nord, pollen plein sud) ; la lettre porte
   l'orientation. Les deux variables --fac-couleur / --fac-encre sont posees
   en ligne par assets/js/facade-identite.js : la teinte est une donnee
   calculee, pas un choix de feuille de style. */

.fac-pastille{display:inline-grid;place-items:center;min-width:26px;height:22px;padding:0 6px;
  border-radius:999px;background:var(--fac-couleur,var(--teal));color:var(--fac-encre,var(--evergreen));
  font-size:.75rem;font-weight:850;letter-spacing:.04em;line-height:1;vertical-align:middle;
  box-shadow:inset 0 0 0 1px rgba(12,29,21,.16)}
.fac-pastille--inconnue{background:rgba(12,29,21,.1);color:rgba(12,29,21,.55)}
.fac-pastille--vedette{box-shadow:inset 0 0 0 1px rgba(12,29,21,.16),0 0 0 2px var(--evergreen)}

/* Le plan enregistre, redessine. Le contour dort dans la base depuis la
   creation ; sans ce bloc il n'avait aucun endroit ou s'afficher. */
.fac-plan{margin:0;display:grid;gap:8px}
.fac-plan svg{width:100%;height:var(--fac-plan-h,190px);display:block;
  background:rgba(151,175,154,.09);border:1px solid rgba(12,29,21,.12);border-radius:10px}
.fac-plan-sol{fill:rgba(12,29,21,.06);stroke:none}
.fac-plan-mur{stroke-linecap:round;transition:opacity .15s}
.fac-plan-mur--orphelin{stroke:rgba(12,29,21,.25);stroke-dasharray:2 3}
.fac-plan-mur--eteint{opacity:.22}
.fac-plan-mur--vedette{filter:drop-shadow(0 0 3px rgba(12,29,21,.45))}
.fac-plan [data-plan-facade]{cursor:pointer}
.fac-plan [data-plan-facade]:focus-visible{outline:2px solid var(--evergreen);outline-offset:2px}
.fac-plan-pastille{pointer-events:none}
.fac-plan-pastille--eteinte{opacity:.28}
.fac-plan-nord circle{fill:rgba(255,253,244,.9);stroke:rgba(12,29,21,.22);stroke-width:.4}
.fac-plan-nord path{fill:var(--tangerine)}
.fac-plan-nord text{fill:rgba(12,29,21,.65);font-weight:800}

/* La maquette : le contour extrude, en axonometrie. Les epaisseurs de trait
   sont en pixels ecran (non-scaling-stroke) et non en unites du dessin : un
   pavillon de 12 m et une barre de 200 m rendent sinon deux traits sans
   rapport, alors que c'est le meme objet a l'ecran. */
.fac-maquette{margin:0;display:grid;gap:8px}
.fac-maquette svg{width:100%;height:var(--fac-maq-h,260px);display:block;
  background:rgba(151,175,154,.09);border:1px solid rgba(12,29,21,.12);border-radius:10px}
.fac-maquette :is(polygon,line,circle){vector-effect:non-scaling-stroke}
.fac-maq-sol{fill:rgba(12,29,21,.09);stroke:none}
.fac-maq-mur{stroke:rgba(12,29,21,.42);stroke-width:1;stroke-linejoin:round;transition:opacity .15s}
.fac-maq-mur--orphelin{fill:rgba(12,29,21,.1);stroke-dasharray:3 3}
.fac-maq-mur--eteint{opacity:.25}
.fac-maq-toit{fill:rgba(233,228,205,.92);stroke:rgba(12,29,21,.42);stroke-width:1;stroke-linejoin:round;
  pointer-events:none}
.fac-maq-plancher{stroke:rgba(12,29,21,.18);stroke-width:1;pointer-events:none}
.fac-maq-fenetre{stroke:rgba(12,29,21,.45);stroke-width:1;pointer-events:none}
.fac-maquette [data-maquette-facade]{cursor:pointer}
.fac-maquette [data-maquette-facade]:hover{filter:brightness(1.08)}
.fac-maquette [data-maquette-facade]:focus-visible{outline:2px solid var(--evergreen);outline-offset:2px}
.fac-maq-nord{pointer-events:none}
.fac-maq-nord circle{fill:rgba(255,253,244,.92);stroke:rgba(12,29,21,.22);stroke-width:1}
.fac-maq-nord path{fill:var(--tangerine)}
.fac-maq-nord text{fill:rgba(12,29,21,.7);font-weight:800}
.fac-maquette figcaption{color:rgba(12,29,21,.6);font-size:.75rem}

/* L'elevation en lecture : les fenetres posees a la creation, rendues. */
.fac-elev{margin:0;display:grid;gap:4px}
.fac-elev svg{width:100%;max-height:120px;display:block}
.fac-elev-mur{fill:rgba(233,228,205,.75);stroke:rgba(12,29,21,.3);stroke-width:.06}
.fac-elev-plancher{stroke:rgba(12,29,21,.16);stroke-width:.04}
.fac-elev-sol{stroke:rgba(12,29,21,.45);stroke-width:.08}
.fac-elev-fenetre{stroke:rgba(12,29,21,.4);stroke-width:.04}
.fac-elev-prot{fill:rgba(12,29,21,.42)}
.fac-elev figcaption{color:rgba(12,29,21,.6);font-size:.75rem}

/* Les voisins en gris, le toit à deux pans (studio façades, lot C). Un voisin
   dont la BD TOPO ignore la hauteur se dessine en pointillé : six mètres
   supposés, pas mesurés. */
.fac-maq-voisin{fill:rgba(12,29,21,.13);stroke:rgba(12,29,21,.3);stroke-width:1;stroke-linejoin:round}
.fac-maq-toit--voisin{fill:rgba(12,29,21,.06);stroke:rgba(12,29,21,.3);stroke-width:1;stroke-linejoin:round}
.fac-maq-voisin--estime{stroke-dasharray:4 3}
.fac-maq-pan{fill:#c9b894;stroke:rgba(12,29,21,.42);stroke-width:1;stroke-linejoin:round}
.fac-maq-pignon{stroke:rgba(12,29,21,.42);stroke-width:1;stroke-linejoin:round}

/* Les pastilles du volume, dans la grammaire du plan. */
.fac-maq-pastille{pointer-events:none}
.fac-maq-pastille--eteinte{opacity:.28}
.fac-maq-mur{stroke-width:1.2}

/* La coche d'une façade validée, la façade en vedette. */
.fac-maq-coche{fill:#2c8a4f;stroke:#fff;stroke-width:1}
.fac-maq-mur--vedette{stroke:var(--evergreen);stroke-width:3;filter:drop-shadow(0 0 4px rgba(255,206,59,.9))}

/* Les masses arborées de l'îlot : un volume, pas un arbre. */
.fac-maq-arbre{fill:rgba(72,120,74,.42);stroke:rgba(46,86,50,.5);stroke-width:1;stroke-linejoin:round}
.fac-maq-arbre--cime{fill:rgba(96,146,92,.55)}
/* « Je le passe en vert » (24/08) : le mur d'une facade VALIDEE porte un
   trait vert — la couleur d'exposition reste, c'est elle qui dit le soleil. */
.fac-maq-mur--validee{stroke:#2c7a4b !important;stroke-width:1.6}
/* Un arbre qui se clique le dit : curseur, et il s'allume au survol. */
.fac-maq-arbre--cliquable{cursor:pointer}
.fac-maq-arbre:not(.fac-maq-arbre--cliquable){pointer-events:none}
.fac-maq-arbre--cliquable:hover,.fac-maq-arbre--cliquable:focus-visible{fill:rgba(72,120,74,.62);outline:none}
/* Une détection non relue est un contexte, pas une alerte : plus pâle hors
   du mode arbres, puis lisible et sélectionnable quand ce mode est ouvert. */
.fac-maq-arbre--hypothese:not(.fac-maq-arbre--cliquable){fill:rgba(96,146,92,.18);stroke:rgba(72,120,74,.28);stroke-dasharray:2.5 2}
/* Un caduc se dessine plus clair : il laisse passer l'hiver. */
.fac-maq-arbre--caduc{fill:rgba(122,158,96,.26);stroke:rgba(96,132,74,.45);stroke-dasharray:2 1.4}
.fac-maq-arbre--caduc.fac-maq-arbre--cime{fill:rgba(140,172,110,.34)}
/* Un voisin lointain compte dans l'ombre, pas dans le regard : plus pale. */
.fac-maq-voisin--lointain{fill-opacity:.45;stroke-opacity:.4}