/* Tipografías con fallback del sistema — sin CDN (la app corre 100% offline).
   Para recuperar la tipografía exacta, empaquetar las fuentes en lib/fonts/ y
   declararlas con @font-face local. */
:root{
  --paper:#E9E6DD;--panel:#F4F2EB;--ink:#20272B;--soft:#5C6469;--line:#C7C1B4;
  --ochre:#B5852C;--ochre-d:#8A6212;--green:#2F7D4E;--amber:#C2870C;--red:#BC3B36;
  --grey:#9AA0A3;--teal:#2C6E7F;--purple:#6E4FA3;
}
*{box-sizing:border-box}
body{margin:0;background:var(--paper);color:var(--ink);font-family:"Space Grotesk",system-ui,sans-serif;line-height:1.45;
  background-image:linear-gradient(rgba(0,0,0,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(0,0,0,.025) 1px,transparent 1px);
  background-size:26px 26px}
#app{max-width:1140px;margin:0 auto;padding:24px 20px 70px}
a{color:var(--ochre-d);text-decoration:none}
h1{font-size:25px;font-weight:600;margin:0;letter-spacing:-.01em}
h1 span{color:var(--soft);font-weight:400}
.eyebrow{font-family:"IBM Plex Mono",monospace;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--ochre-d);margin:0 0 5px}
h2{font-size:12px;font-family:"IBM Plex Mono",monospace;letter-spacing:.16em;text-transform:uppercase;color:var(--soft);margin:0 0 14px;font-weight:600}
.card{background:var(--panel);border:1px solid var(--line);border-radius:10px}
.pad{padding:18px}
.lede{color:var(--soft);font-size:15px;max-width:46ch} .lede2{color:var(--soft);font-size:14px}
.hint{font-size:12px;color:var(--soft);margin-top:12px;line-height:1.55}
.empty{font-size:13.5px;color:var(--soft);background:rgba(0,0,0,.02);border:1px dashed var(--line);border-radius:8px;padding:14px;margin:0 0 14px}

header.top{display:flex;flex-wrap:wrap;align-items:flex-end;gap:14px;justify-content:space-between;
  border-bottom:2px solid var(--ink);padding-bottom:13px;margin-bottom:20px}
.rollup{display:flex;gap:8px;flex-wrap:wrap;align-items:center;font-family:"IBM Plex Mono",monospace;font-size:12px}
.pill{display:inline-flex;align-items:center;gap:6px;background:var(--panel);border:1px solid var(--line);border-radius:20px;padding:5px 11px}

.hero{margin-bottom:18px}
.form{padding:20px;max-width:560px}
.frow{display:flex;flex-direction:column;gap:6px;margin-bottom:16px}
.frow > label{font-size:13px;font-weight:500}
.chk{flex-direction:row!important;align-items:center;gap:9px;font-weight:400!important;font-size:13.5px}
.chk input{width:18px;height:18px;accent-color:var(--teal)}
input,select{font-family:"IBM Plex Mono",monospace;font-size:14px;color:var(--ink);background:var(--paper);border:1px solid var(--line);border-radius:6px;padding:9px 10px}
select.full,input{width:100%}
input[type=range]{padding:0;accent-color:var(--ochre)} input[type=checkbox]{width:auto}
.seg{display:flex;gap:6px;flex-wrap:wrap}
.seg button{flex:1;min-width:64px;font-family:"IBM Plex Mono",monospace;font-size:13px;background:var(--paper);border:1px solid var(--line);border-radius:6px;padding:9px 6px;cursor:pointer;color:var(--ink)}
.seg button[aria-pressed=true]{background:var(--ink);color:var(--paper);border-color:var(--ink)}
:focus-visible{outline:2px solid var(--ochre);outline-offset:1px}

.btn{display:inline-block;width:100%;text-align:center;background:var(--ink);color:var(--paper);border:none;border-radius:8px;
  padding:12px;font-family:"Space Grotesk",sans-serif;font-size:14px;font-weight:600;cursor:pointer;margin-top:6px}
.btn.ghost{background:transparent;color:var(--ink);border:1px solid var(--line)}
.btn.sm{width:auto;padding:7px 13px;font-size:12.5px;margin:0}

.hubgrid{display:grid;grid-template-columns:1fr 300px;gap:18px}
@media(max-width:860px){.hubgrid{grid-template-columns:1fr}}
.stage{padding:8px 4px} svg{width:100%;height:auto;display:block}
.comp{cursor:pointer} .comp .face{stroke:#000;stroke-opacity:.2}
.comp:hover .face{stroke:var(--ochre);stroke-width:1.5;stroke-opacity:1}
.comp.sel .face{stroke:var(--ochre);stroke-width:2;stroke-opacity:1}
.lead{stroke:var(--soft);stroke-width:.8;stroke-dasharray:2 2;opacity:.5}
.lbl{font-family:"IBM Plex Mono",monospace;font-size:11px;fill:var(--ink)}
.lblsoft{font-family:"IBM Plex Mono",monospace;font-size:9px;fill:var(--soft)}
.compchips{display:flex;flex-direction:column;gap:7px}
.compchip{display:flex;align-items:center;gap:9px;width:100%;text-align:left;background:var(--paper);border:1px solid var(--line);
  border-radius:8px;padding:10px 12px;cursor:pointer;font-family:inherit;font-size:13.5px;color:var(--ink)}
.compchip:hover{border-color:var(--ochre)} .compchip span{flex:1} .compchip b{font-family:"IBM Plex Mono",monospace;font-size:11px;color:var(--soft)}

.compgrid,.solgrid{display:grid;grid-template-columns:1fr 320px;gap:18px}
@media(max-width:860px){.compgrid,.solgrid{grid-template-columns:1fr}}
.solrow{display:flex;flex-direction:column;gap:3px;width:100%;text-align:left;background:var(--paper);border:1px solid var(--line);
  border-radius:9px;padding:13px 14px;cursor:pointer;margin-bottom:10px;font-family:inherit;color:var(--ink)}
.solrow:hover{border-color:var(--ochre)}
.solhead{display:flex;align-items:center;gap:9px;font-size:14.5px} .solhead b{font-weight:600}
.solmeta{font-family:"IBM Plex Mono",monospace;font-size:11.5px;color:var(--soft);padding-left:19px}
.badge{font-style:normal;font-family:"IBM Plex Mono",monospace;font-size:10px;background:var(--green);color:#fff;padding:2px 7px;border-radius:10px}
.rule{display:flex;gap:9px;align-items:flex-start;font-size:13px;margin-bottom:9px}
.rule .b{color:var(--ochre-d);font-weight:700} .rule em{color:var(--soft)}
.cite{margin-top:14px;font-family:"IBM Plex Mono",monospace;font-size:11px;color:var(--soft);border-top:1px solid var(--line);padding-top:10px;line-height:1.6}
.cite .warn{color:var(--ochre-d);font-weight:600}

.editable input{font-family:"Space Grotesk",sans-serif;font-size:22px;font-weight:600;border:none;background:transparent;padding:2px 0;border-bottom:1px dashed var(--line);width:100%}
.modetab{display:flex;gap:6px;margin-bottom:18px;background:var(--paper);border:1px solid var(--line);border-radius:8px;padding:4px}
.modetab button{flex:1;border:none;background:transparent;padding:9px;border-radius:6px;cursor:pointer;font-family:inherit;font-size:13px;color:var(--soft)}
.modetab button.on{background:var(--ink);color:var(--paper);font-weight:600}
.ctrl{margin-bottom:15px} .ctrl > label{display:block;font-size:13px;font-weight:500;margin-bottom:6px}
.ctrl label b{font-family:"IBM Plex Mono",monospace;color:var(--ochre-d)}
.ctrl.two{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.verdict{position:sticky;top:14px}
.lamp{border-radius:10px;padding:16px 18px;color:#fff;margin-bottom:14px}
.lamp .st{font-family:"IBM Plex Mono",monospace;font-size:11px;letter-spacing:.18em;text-transform:uppercase;opacity:.92}
.lamp .u{font-size:38px;font-weight:700;font-family:"IBM Plex Mono",monospace;line-height:1.1}
.lamp .u small{font-size:14px;font-weight:500;opacity:.85;margin-left:5px}
.lamp .cmp{font-size:12.5px;opacity:.92}
.bks{display:flex;flex-direction:column;gap:7px;margin-bottom:12px}
.bk{display:flex;justify-content:space-between;font-size:12.5px;color:var(--soft);border-bottom:1px dotted var(--line);padding-bottom:6px}
.bk b{font-family:"IBM Plex Mono",monospace;color:var(--ink)}
.advice{font-size:13.5px;border-left:3px solid var(--ochre);background:rgba(181,133,44,.08);padding:11px 13px;border-radius:0 8px 8px 0}
.acre{margin-top:10px;font-size:13px;color:var(--green);font-weight:600}
.umaxinfo{font-family:"IBM Plex Mono",monospace;font-size:13px;color:var(--ink);background:var(--paper);border:1px solid var(--line);border-radius:6px;padding:9px 11px}
.umaxinfo b{color:var(--ochre-d)} .umaxinfo small{color:var(--soft)}
.zonaval{margin-top:14px;background:rgba(44,110,127,.07);border:1px solid rgba(44,110,127,.25);border-radius:8px;padding:11px 13px}
.zonaval h3{font-family:"IBM Plex Mono",monospace;font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--teal);margin:0 0 8px}
.zv{display:flex;justify-content:space-between;align-items:baseline;font-size:12.5px;color:var(--soft);padding:3px 0}
.zv b{font-family:"IBM Plex Mono",monospace;color:var(--ink);font-size:13px}
.condblock{margin:12px 0;background:rgba(0,0,0,.02);border:1px solid var(--line);border-radius:8px;padding:11px 13px}
.condblock h3{font-family:"IBM Plex Mono",monospace;font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--soft);margin:0 0 8px}
.cv{display:flex;justify-content:space-between;align-items:baseline;font-size:13px;color:var(--soft);padding:2px 0}
.cv b{font-family:"IBM Plex Mono",monospace;font-size:12.5px}
.cmsg{font-size:12px;color:var(--soft);margin-top:7px;line-height:1.5;border-top:1px dotted var(--line);padding-top:7px}
.remedio{margin-top:10px;background:rgba(181,133,44,.10);border:1px solid rgba(181,133,44,.35);border-radius:8px;padding:11px 12px;display:flex;flex-direction:column;gap:9px}
.remtxt{font-size:12.5px;line-height:1.45} .remtxt b{color:var(--ochre-d)} .remtxt span{color:var(--soft)}
.compos{margin-top:14px;border-top:1px solid var(--line);padding-top:12px}
.compos h3{font-family:"IBM Plex Mono",monospace;font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--soft);margin:0 0 8px}
.cl{display:flex;justify-content:space-between;align-items:center;font-size:12.5px;color:var(--ink);padding:4px 0;border-bottom:1px dotted var(--line)}
.cl.bar{color:var(--teal)} .cl .rmbar{background:none;border:none;color:var(--red);cursor:pointer;font-size:12px}
.side{display:flex;flex-direction:column}

/* ---- Corte del muro (sección capa a capa, reutilizable) ---- */
.cortewrap{background:var(--paper);border:1px solid var(--line);border-radius:8px;padding:6px}
.cortesvg{width:100%;height:auto;display:block}
.cortesvg .ct-num{font-family:"IBM Plex Mono",monospace;font-size:7px;fill:#00000088}
.cortesvg .ct-leg{font-family:"IBM Plex Mono",monospace;font-size:7.5px;fill:var(--ink)}
.cortesvg .ct-side{font-family:"IBM Plex Mono",monospace;font-size:7px;letter-spacing:.1em;fill:var(--soft)}
.ct-ais{font-size:12.5px;color:var(--soft);margin:8px 0 0} .ct-ais b{font-family:"IBM Plex Mono",monospace;color:var(--ochre-d)}

/* ---- Aviso de zona térmica automática (ficha) ---- */
.zonaauto{font-size:12px;color:var(--soft);line-height:1.5;margin-top:2px}
.zonaauto b{font-family:"IBM Plex Mono",monospace;color:var(--ochre-d)}
.zonaauto .warn{color:var(--red);display:block;margin-top:4px}

/* ---- Tabla-resumen de resultados + sellos (Lote 2) ---- */
.resumen{margin-top:18px}
.resumen-head{display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between;margin-bottom:4px}
.resumen-head h2{margin:0}
.sellos{display:flex;gap:7px;flex-wrap:wrap}
.sello{font-family:"IBM Plex Mono",monospace;font-size:11px;letter-spacing:.04em;padding:5px 11px;border-radius:20px;border:1px solid var(--line);font-weight:600}
.sello-ok{background:rgba(47,125,78,.12);color:var(--green);border-color:rgba(47,125,78,.45)}
.sello-verif{background:rgba(110,79,163,.12);color:var(--purple);border-color:rgba(110,79,163,.45)}
.sello-no{background:rgba(188,59,54,.12);color:var(--red);border-color:rgba(188,59,54,.45)}
.sello-na{background:rgba(0,0,0,.03);color:var(--soft)}
.sello-trace{background:rgba(44,110,127,.10);color:var(--teal);border-color:rgba(44,110,127,.40)}
.tablewrap{overflow-x:auto}
.restab{width:100%;border-collapse:collapse;font-size:13px;margin-top:6px}
.restab th{font-family:"IBM Plex Mono",monospace;font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--soft);
  text-align:left;font-weight:600;padding:8px 10px;border-bottom:2px solid var(--ink)}
.restab td{padding:10px;border-bottom:1px dotted var(--line);vertical-align:middle}
.restab td.mono{font-family:"IBM Plex Mono",monospace;font-size:12.5px;color:var(--ink)}
.restab tr:hover td{background:rgba(181,133,44,.05)}
.restab .verdcol{white-space:nowrap;background:rgba(0,0,0,.015)}
.vchip{display:inline-block;color:#fff;font-family:"IBM Plex Mono",monospace;font-size:11px;font-weight:600;padding:3px 9px;border-radius:6px}
.restab .esp{font-family:"IBM Plex Mono",monospace;font-size:12px;color:var(--soft);margin-left:6px}
.restab .empty2{color:var(--soft);font-size:13px;text-align:center;padding:18px 10px}

/* ---- VISTA PLANO (Fase 1, Inc.1) ---- */
.plgrid{display:grid;grid-template-columns:1fr 340px;gap:18px}
@media(max-width:900px){.plgrid{grid-template-columns:1fr}}
.plbar{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:6px 8px 10px}
.plbtn{font-family:"IBM Plex Mono",monospace;font-size:12.5px;background:var(--paper);border:1px solid var(--line);border-radius:6px;padding:8px 12px;cursor:pointer;color:var(--ink)}
.plbtn:hover{border-color:var(--ochre)} .plbtn.on{background:var(--ink);color:var(--paper);border-color:var(--ink)}
/* botón "Interior (sin fachada)": ancho completo, gris neutro cuando está activo */
.plbtn.full{width:100%;box-sizing:border-box;text-align:center}
.plbtn.plint.on{background:#9aa0a4;color:#fff;border-color:#7d8388}
.plbtn:disabled{opacity:.45;cursor:not-allowed}
.plesc{font-family:"IBM Plex Mono",monospace;font-size:12px;color:var(--soft);margin-left:auto}
/* lienzo: el SVG entra COMPLETO (alto acotado a la ventana) y se centra */
.plcanvas{background:#dcd8cd;border:1px solid var(--line);border-radius:8px;overflow:hidden;
  display:flex;align-items:center;justify-content:center;height:74vh;min-height:380px}
.plsvg{width:100%;height:100%;max-height:74vh;display:block;touch-action:none}
.plsvg.crosshair{cursor:crosshair} .plsvg.grab{cursor:grab} .plsvg.grabbing{cursor:grabbing}
.plmuro{cursor:pointer} .plmuro:hover{stroke-opacity:.75}
.plmuro.sel{filter:drop-shadow(0 0 2px rgba(0,0,0,.4))}
.plmlbl{font-family:"IBM Plex Mono",monospace;font-weight:700;paint-order:stroke;stroke:#fff;stroke-width:3px;stroke-linejoin:round}
.ordot{display:inline-block;width:9px;height:9px;border-radius:2px;margin-right:6px;vertical-align:baseline}
/* --- muros del DXF como poché (rectángulo relleno) --- */
.plpoche{cursor:pointer}
.plpoche:hover{fill:#3a4248}
.plpoche.sel{filter:drop-shadow(0 0 3px rgba(181,133,44,.7))}
/* muros INTERIORES (tabiques): poché gris con rayas, no son fachada.
   Conserva el patrón al pasar el mouse (solo se resalta con un leve sombreado). */
.plpoche.interior{fill:url(#plInteriorHatch)}
.plpoche.interior:hover{filter:brightness(.92)}
.plmuro.interior,.plabre.interior{opacity:.85}
/* recuadro de selección por arrastre */
.plselbox{fill:rgba(181,133,44,.12);stroke:var(--ochre-d);stroke-width:1.2;stroke-dasharray:5 4;pointer-events:none}
/* --- dial del norte --- */
.nortewrap{display:flex;gap:14px;align-items:center;margin-top:6px}
.nortedial{flex:none;width:84px;height:84px}
.nortectrl{flex:1;min-width:0}
.nortectrl label{font-size:12px;color:var(--soft);font-family:"IBM Plex Mono",monospace}
.nortectrl label b{color:var(--ochre-d)}
.nortectrl input[type=range]{width:100%;margin:6px 0;box-sizing:border-box}
.norteqr{display:grid;grid-template-columns:1fr 1fr;gap:5px;margin-top:4px}
.norteqr .plbtn{font-size:11px;padding:5px 4px;text-align:center}
/* --- ventanas del muro (Incremento 2) --- */
.vent{margin-top:12px;border-top:1px solid var(--line);padding-top:10px}
.venthd{display:flex;align-items:center;justify-content:space-between;gap:8px}
.venthd label{font-size:12px;color:var(--soft);font-family:"IBM Plex Mono",monospace}
.btn.ghost.sm{width:auto;display:inline-block;font-size:12px;padding:5px 10px}
.vlist{margin-top:8px;display:flex;flex-direction:column;gap:6px}
.vrow{display:flex;align-items:center;gap:6px}
.vrow .vnum{font-family:"IBM Plex Mono",monospace;font-size:11px;color:var(--soft);min-width:24px}
.vrow input{width:72px;padding:6px 8px;font-size:13px}
.vrow .vx{color:var(--soft)}
.vrow .vdel{background:transparent;border:1px solid var(--line);border-radius:6px;color:var(--soft);cursor:pointer;font-size:12px;padding:4px 8px;margin-left:auto}
.vrow .vdel:hover{border-color:var(--red);color:var(--red)}
/* fila de orientación con muro+vidrio+% */
.zv.zv2{flex-wrap:wrap;gap:2px 8px}
.zv2 .zvmid{flex:1;font-size:11px;color:var(--soft)}
.zv2 .zvpct{color:var(--ink)}
.vved{font-family:"IBM Plex Mono",monospace;font-size:10.5px;border-radius:10px;padding:1px 7px;width:100%;text-align:right}
.vved.ok{color:var(--green)} .vved.no{color:var(--red)} .vved.warn{color:var(--amber)}

/* --- panel de capas del DXF importado --- */
.dxflist{display:flex;flex-direction:column;gap:4px;margin-top:6px;max-height:340px;overflow:auto}
.dxfrow{display:flex;align-items:center;gap:7px;padding:3px 2px;border-bottom:1px solid var(--line)}
.dxfvis{display:flex;align-items:center;margin:0}
.dxfvis input{margin:0;cursor:pointer}
.dxfname{flex:1;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dxfn{font-family:"IBM Plex Mono",monospace;font-size:10.5px;color:var(--soft);min-width:28px;text-align:right}
.dxftag{font-family:"IBM Plex Mono",monospace;font-size:9.5px;border-radius:9px;padding:1px 6px;color:var(--paper)}
.dxftag.muro{background:var(--ink)} .dxftag.vent{background:var(--ochre)}
.dxfrole{display:flex;gap:3px}
.dxfrole button{font-family:"IBM Plex Mono",monospace;font-size:11px;width:24px;padding:3px 0;background:var(--paper);border:1px solid var(--line);border-radius:5px;cursor:pointer;color:var(--ink)}
.dxfrole button.on{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.dxfrole .dxf_w.on{background:var(--ochre);border-color:var(--ochre)}
.dxftag.pta{background:var(--teal)}
.dxfrole .dxf_p.on{background:var(--teal);border-color:var(--teal)}

/* --- controles de zoom en la barra del lienzo --- */
.plzoom{display:inline-flex;align-items:center;gap:4px}
.plbtn.smz{padding:5px 9px;font-size:13px;min-width:30px;text-align:center}
.plzlbl{font-family:"IBM Plex Mono",monospace;font-size:11px;color:var(--soft);min-width:38px;text-align:center}

/* --- aberturas (puertas/ventanas) seleccionables sobre el plano --- */
.plabre{cursor:pointer} .plabre:hover{filter:brightness(1.12)}
.plabre.sel{filter:drop-shadow(0 0 3px rgba(181,133,44,.85))}

/* --- leyenda de colores por orientación, bajo el lienzo --- */
.plleg{display:flex;flex-wrap:wrap;gap:6px 14px;padding:8px 10px 2px;font-size:11.5px;color:var(--soft)}
.plleg-i{display:inline-flex;align-items:center;gap:5px;font-family:"IBM Plex Mono",monospace}
.plleg-i i{display:inline-block;width:12px;height:12px;border-radius:3px;border:1px solid rgba(0,0,0,.15)}

/* --- bloques colapsables (Norte y Ajustes del plano) --- */
.plnorte,.plcfg{border:1px solid var(--line);border-radius:10px;background:var(--panel);margin-bottom:12px}
.plnorte>summary,.plcfg>summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:12px 14px;font-family:"IBM Plex Mono",monospace;font-size:12px;letter-spacing:.04em;color:var(--ink);user-select:none}
.plnorte>summary::-webkit-details-marker,.plcfg>summary::-webkit-details-marker{display:none}
.plnorte>summary::after,.plcfg>summary::after{content:"▸";color:var(--soft);transition:transform .15s}
.plnorte[open]>summary::after,.plcfg[open]>summary::after{transform:rotate(90deg)}
.plnorte>summary b,.plcfg>summary b{color:var(--ochre-d)}
.plnorte-mini{display:inline-flex;align-items:center}
.plnorte-body{padding:0 14px 14px} .plcfg-body{padding:4px 12px 12px}
.plcfg-body .card{margin-bottom:12px} .plcfg-body .card:last-child{margin-bottom:0}
.plcfg .plnorte{margin-bottom:12px}

/* --- HUD COMPACTO de la vista plano (punto 4): que selección + detalle +
   resumen por orientación entren de un vistazo, sin tener que deslizar.
   Todo va scopeado a .plgrid .side para NO afectar las otras vistas. --- */
.plgrid .side .card.pad{padding:11px 13px}
.plgrid .side .card{margin-bottom:9px!important}
.plgrid .side h2{margin:0 0 8px}
.plgrid .side .ctrl{margin-bottom:9px}
.plgrid .side .ctrl > label{margin-bottom:4px;font-size:12px}
.plgrid .side .hint{margin-top:5px;font-size:11.5px;line-height:1.4}
.plgrid .side .seg button{padding:6px 5px;font-size:12px;min-width:0}
.plgrid .side .umaxinfo{padding:7px 9px;font-size:12px}
.plgrid .side .lamp{padding:11px 13px;margin-bottom:9px}
.plgrid .side .lamp .u{font-size:30px}
.plgrid .side .cortewrap{padding:4px}
.plgrid .side .advice{padding:8px 10px;font-size:12.5px}
.plgrid .side .zonaval{margin-top:9px;padding:9px 11px}
.plgrid .side .vent{margin-top:9px;padding-top:8px}
.plgrid .side .btn{padding:9px;font-size:13px}
.plgrid .side .plnorte,.plgrid .side .plcfg{margin-bottom:9px}
.plgrid .side .plnorte>summary,.plgrid .side .plcfg>summary{padding:9px 12px}
/* el panel lateral se queda pegado arriba al deslizar el lienzo, y si aún así
   no cupiera, hace su propio scroll en vez de empujar toda la página */
.plgrid .side{align-self:start;position:sticky;top:10px;max-height:calc(100vh - 20px);overflow-y:auto;padding-right:2px}
.plgrid .side::-webkit-scrollbar{width:7px}
.plgrid .side::-webkit-scrollbar-thumb{background:var(--line);border-radius:4px}

@media(prefers-reduced-motion:reduce){*{transition:none!important}}

/* ===== Axonométrica: estilo "línea técnica" + contexto urbano ===== */
.axo-toolbar{display:flex;align-items:center;gap:8px;padding:4px 10px 0}
.axo-toollbl{font-family:"IBM Plex Mono",monospace;font-size:11px;color:var(--soft);letter-spacing:.08em;text-transform:uppercase}
.axo-seg button{font-size:12px;padding:4px 12px;border:1px solid var(--line);background:var(--panel);cursor:pointer}
.axo-seg button:first-child{border-radius:7px 0 0 7px}
.axo-seg button:last-child{border-radius:0 7px 7px 0;margin-left:-1px}
.axo-seg button[aria-pressed="true"]{background:var(--ink,#2b2b26);color:#fff;border-color:var(--ink,#2b2b26)}
.axo-leyenda{display:flex;gap:18px;align-items:center;padding:2px 12px 8px;font-family:"IBM Plex Mono",monospace;font-size:11px;color:var(--soft)}
.axo-leyenda span{display:flex;align-items:center;gap:6px}
.axo-leyenda .jl{display:inline-block;width:26px;background:#2f2f2a;flex:none}
.axo-leyenda .j1{height:2.2px}
.axo-leyenda .j2{height:1.2px;background:#55554e}
.axo-leyenda .j3{height:1px;background:#a09a8c;transform:scaleY(.6)}

/* contexto urbano: SIEMPRE trazo terciario (fino), no compite con la casa */
#axo .ctx line, #axo .ctx polygon, #axo .ctx circle{fill:none;stroke:#a09a8c;stroke-width:.6}
#axo .ctx .eje{stroke-dasharray:7 5;stroke-width:.5}
#axo .ctx .deslinde{stroke-dasharray:3 3;stroke-width:.7}
#axo.est-lineas .ctx line, #axo.est-lineas .ctx polygon, #axo.est-lineas .ctx circle{stroke:#8d887c}

/* estilo LÍNEAS: monocromo, superficies blancas, jerarquía de 3 grosores
   (los fill de abajo GANAN a los atributos fill="" inline del SVG) */
#axo.est-lineas .face{fill:#fdfdfa;stroke:#2f2f2a;stroke-width:1.7;stroke-opacity:1;stroke-linejoin:round}
#axo.est-lineas .det{fill:#fff;stroke:#55554e;stroke-width:1;stroke-opacity:1}
#axo.est-lineas .vidrio{fill:#9FC4D0;fill-opacity:.14;stroke:#55606a;stroke-width:1;stroke-opacity:1}
#axo.est-lineas polyline, #axo.est-lineas g.comp line:not(.lead){stroke:#55554e}
#axo.est-lineas .sombra{opacity:.04}
/* interactividad se conserva: hover/selección resaltan igual que siempre */
#axo.est-lineas .comp:hover .face{stroke:var(--ochre);stroke-width:2}