/* ---------- tokens : paleta verde de eficiencia energética ---------- */
  :root{
    --bg:#F2F7F2;
    --surface:#FFFFFF;
    --surface-2:#EAF4EC;
    --border:#DAE9DD;
    --border-strong:#BBD8C2;
    --text:#152218;
    --text-muted:#54685A;
    --text-faint:#87998C;
    --navy:#12603F;
    --gold:#C97A2E;
    --gold-dark:#A6621F;
    --gold-tint:#FBEEDD;
    --success:#2FA968;
    --success-tint:#E2F4E9;
    --critical:#C1432B;
    --critical-tint:#FBE7E1;
    --pending:#6E7D72;
    --pending-tint:#EAF0EC;
    --focus:#2E7DA6;
    --shadow:rgba(18,60,40,0.08);
    --header-bg:#0E3D28;
    --header-bg-2:#166B45;
    --header-text:#F1F8F2;
    --header-text-muted:#B9D8C4;
    --header-border:#1F6B45;
    color-scheme:light;
  }
  @media (prefers-color-scheme: dark){
    :root:not([data-theme="light"]){
      --bg:#0A150F;
      --surface:#0F1F17;
      --surface-2:#152B1F;
      --border:#213B2C;
      --border-strong:#2F5340;
      --text:#E6F1E8;
      --text-muted:#A6C1AC;
      --text-faint:#729079;
      --gold:#E0994B;
      --gold-dark:#C97A2E;
      --gold-tint:#332411;
      --success:#3FBE7C;
      --success-tint:#123420;
      --critical:#E2735A;
      --critical-tint:#33170F;
      --pending:#93A69A;
      --pending-tint:#182A1F;
      --focus:#5CA6D9;
      --shadow:rgba(0,0,0,0.45);
      color-scheme:dark;
    }
  }
  :root[data-theme="dark"]{
    --bg:#0A150F;
    --surface:#0F1F17;
    --surface-2:#152B1F;
    --border:#213B2C;
    --border-strong:#2F5340;
    --text:#E6F1E8;
    --text-muted:#A6C1AC;
    --text-faint:#729079;
    --gold:#E0994B;
    --gold-dark:#C97A2E;
    --gold-tint:#332411;
    --success:#3FBE7C;
    --success-tint:#123420;
    --critical:#E2735A;
    --critical-tint:#33170F;
    --pending:#93A69A;
    --pending-tint:#182A1F;
    --focus:#5CA6D9;
    --shadow:rgba(0,0,0,0.45);
    color-scheme:dark;
  }

  *{box-sizing:border-box;}
  html,body{margin:0;padding:0;}
  body{
    background:var(--bg);
    color:var(--text);
    font-family:Arial,"Segoe UI",system-ui,sans-serif;
    -webkit-font-smoothing:antialiased;
    padding-inline:0;
  }
  .mono{font-family:Consolas,"Courier New",monospace;font-variant-numeric:tabular-nums;}
  h1,h2,h3{text-wrap:balance;margin:0;}
  button{font-family:inherit;}
  :focus-visible{outline:2px solid var(--focus);outline-offset:2px;border-radius:4px;}

  /* ---------- layout shell ---------- */
  .app{max-width:1180px;margin:0 auto;padding-inline:20px;}


  .topbar{
    background:linear-gradient(180deg,var(--header-bg),var(--header-bg-2));
    border-bottom:1px solid var(--header-border);
  }
  .topbar-inner{
    max-width:1180px;margin:0 auto;padding:16px 20px;
    display:flex;align-items:center;gap:20px;flex-wrap:wrap;
  }
  .brand{display:flex;align-items:center;gap:10px;margin-right:auto;}
  .brand-mark{
    width:34px;height:34px;border-radius:8px;flex:none;
    background:linear-gradient(135deg,var(--gold),var(--gold-dark));
    display:flex;align-items:center;justify-content:center;
    color:var(--header-bg);font-weight:700;font-size:14px;letter-spacing:.02em;
  }
  .brand-text{display:flex;flex-direction:column;line-height:1.15;}
  .brand-text strong{color:var(--header-text);font-size:15px;letter-spacing:.02em;}
  .brand-text span{color:var(--header-text-muted);font-size:12px;}
  .back-portal{
    color:var(--header-text);text-decoration:none;font-size:13px;font-weight:700;
    border:1px solid rgba(255,255,255,.28);border-radius:8px;padding:8px 11px;
  }
  .back-portal:hover{background:rgba(255,255,255,.1);}

  .tabs{display:flex;gap:4px;background:rgba(255,255,255,0.06);padding:4px;border-radius:10px;}
  .tab{
    appearance:none;border:none;background:transparent;color:var(--header-text-muted);
    padding:8px 14px;border-radius:7px;font-size:13.5px;font-weight:500;cursor:pointer;
    display:flex;align-items:center;gap:8px;transition:background .15s,color .15s;
  }
  .tab svg{width:15px;height:15px;flex:none;}
  .tab[aria-selected="true"]{background:var(--surface);color:var(--navy);}
  .tab:not([aria-selected="true"]):hover{color:var(--header-text);}

  .demo-badge{
    font-size:11px;font-weight:600;letter-spacing:.08em;color:var(--header-bg);
    background:var(--gold);padding:5px 10px;border-radius:100px;
  }
  .version-proof{
    font-size:11px;font-weight:700;letter-spacing:.06em;color:#fff;
    background:#0f766e;border:1px solid rgba(255,255,255,.28);
    padding:7px 11px;border-radius:100px;white-space:nowrap;
  }
  /* En un teléfono de 360 px esta etiqueta se salía 7 px y empujaba la página
     entera de lado. Es la única pastilla del sitio con `nowrap`; en pantalla
     chica se deja partir en dos líneas. */
  @media (max-width:480px){
    .version-proof{white-space:normal;}
  }

  /* LOS CAMPOS NO BAJAN DE 44 px CUANDO SE USA CON EL DEDO.
     Medido a 360 px: los 40 controles de esta pantalla quedaban entre 33 y 35
     px de alto, menos que la yema de un dedo. Es la pantalla con más campos
     del sitio, así que se nota más acá que en ninguna otra.

     Va contra `pointer:coarse` y no contra el ancho: con mouse 35 px está bien
     y la planilla cunde más apretada. Una ventana angosta en un computador no
     tiene por qué agrandar los campos. */
  @media (pointer:coarse){
    input,select,textarea,button{min-height:44px;}
    /* El de volver es el único camino de salida de esta pantalla: tampoco
       puede quedar chico. Se nombra aparte y no con un `a` a secas, porque eso
       engordaría también los enlaces dentro de los párrafos. */
    .back-portal{min-height:44px;display:inline-flex;align-items:center;}
  }
  /* Y en pantalla chica el texto de los campos sube a 16 px: bajo eso, Safari
     de iPhone y iPad hace zoom solo al tocar un campo y descuadra la pantalla.
     Acá el formulario ya va en una columna, así que el texto más grande entra. */
  @media (pointer:coarse) and (max-width:640px){
    input,select,textarea{font-size:16px;}
  }

  main{padding-block:28px 40px;}
  .panel{display:flex;flex-direction:column;gap:22px;}
  .panel[hidden]{display:none;}

  .panel-head{display:flex;flex-direction:column;gap:6px;max-width:640px;}
  .eyebrow{
    font-size:11.5px;font-weight:600;letter-spacing:.09em;color:var(--gold-dark);
    text-transform:uppercase;
  }
  .panel-head h1{font-size:24px;font-weight:700;color:var(--text);}
  .panel-head p{margin:0;color:var(--text-muted);font-size:14.5px;line-height:1.5;}

  /* ---------- stepper ---------- */
  .stepper{display:flex;gap:0;border:1px solid var(--border);border-radius:12px;background:var(--surface);overflow:hidden;}
  .step{
    flex:1;display:flex;align-items:center;gap:10px;padding:12px 16px;
    border-right:1px solid var(--border);position:relative;
  }
  .step:last-child{border-right:none;}
  .step-num{
    width:24px;height:24px;border-radius:50%;flex:none;display:flex;align-items:center;justify-content:center;
    font-size:12px;font-weight:600;background:var(--surface-2);color:var(--text-faint);border:1px solid var(--border-strong);
    transition:background .2s,color .2s,border-color .2s;
  }
  .step-label{font-size:12.5px;color:var(--text-faint);font-weight:500;transition:color .2s;}
  .step.is-done .step-num{background:var(--success);border-color:var(--success);color:#fff;}
  .step.is-done .step-label{color:var(--text-muted);}
  .step.is-active .step-num{background:var(--navy);border-color:var(--navy);color:#fff;}
  .step.is-active .step-label{color:var(--text);font-weight:600;}
  @media (max-width:640px){ .step-label{display:none;} .step{padding:12px;justify-content:center;} }

  /* ---------- grid & cards ---------- */
  .grid-2{display:grid;grid-template-columns:280px 1fr;gap:18px;align-items:start;}
  /* La columna lateral de 280px solo tiene sentido si al lado queda ancho suficiente para la tabla
     de elementos (7 columnas). Bajo 1100px se pasa a una sola columna: así la tabla usa todo el
     ancho y no aparece una barra horizontal al final de la página. */
  @media (max-width:1100px){ .grid-2{grid-template-columns:1fr;} }

  .card{
    background:var(--surface);border:1px solid var(--border);border-radius:12px;
    padding:18px;box-shadow:0 1px 2px var(--shadow);
  }
  .card-title{font-size:13px;font-weight:600;color:var(--text);margin-bottom:4px;}
  .card-sub{font-size:12.5px;color:var(--text-muted);margin:0 0 14px;line-height:1.45;}

  .field{display:flex;flex-direction:column;gap:6px;margin-bottom:14px;}
  .field label{font-size:12px;font-weight:600;color:var(--text-muted);}
  .field select,.field input{
    font:inherit;font-size:13.5px;padding:9px 10px;border-radius:8px;border:1px solid var(--border-strong);
    background:var(--surface);color:var(--text);width:100%;
  }
  .field select:focus,.field input:focus{border-color:var(--focus);}
  .field-row{display:grid;grid-template-columns:1fr 1fr;gap:8px;}
  /* Las columnas de grid tienen min-width:auto, así que un contenido ancho (una fila de campos,
     una tabla) estira la columna en vez de encogerse: en móvil eso empujaba la tarjeta fuera de
     la pantalla. Con min-width:0 la columna puede achicarse, y bajo 640px los pares de campos
     pasan a una sola columna para que las etiquetas no queden cortadas. */
  .grid-2 > *, .field-row > *{min-width:0;}
  .field input, .field select{max-width:100%;}
  @media (max-width:640px){
    .field-row{grid-template-columns:1fr;}
  }

  .zone-badge{
    display:flex;align-items:center;justify-content:space-between;gap:10px;
    background:var(--surface-2);border:1px dashed var(--border-strong);border-radius:9px;
    padding:10px 12px;margin-bottom:14px;
  }
  .zone-badge .k{font-size:11px;color:var(--text-faint);text-transform:uppercase;letter-spacing:.05em;}
  .zone-badge .v{font-size:13px;font-weight:600;color:var(--navy);}

  .btn{
    appearance:none;border-radius:9px;border:1px solid var(--border-strong);background:var(--surface);
    color:var(--text);font-size:13.5px;font-weight:600;padding:10px 14px;cursor:pointer;
    display:inline-flex;align-items:center;justify-content:center;gap:8px;width:100%;margin-bottom:8px;
    transition:background .15s,border-color .15s,opacity .15s,transform .1s;
  }
  .btn svg{width:15px;height:15px;flex:none;}
  .btn:last-child{margin-bottom:0;}
  .btn:hover{border-color:var(--border-strong);background:var(--surface-2);}
  .btn:active{transform:translateY(1px);}
  .btn-primary{background:var(--navy);border-color:var(--navy);color:#fff;}
  .btn-primary:hover{background:var(--header-bg-2);}
  .btn-gold{background:var(--gold);border-color:var(--gold);color:var(--header-bg);}
  .btn-gold:hover{background:var(--gold-dark);border-color:var(--gold-dark);}
  .btn-sm{width:auto;padding:7px 12px;font-size:12.5px;margin:0;}
  .btn[disabled]{opacity:.45;cursor:not-allowed;}
  .btn[disabled]:hover{background:var(--surface);border-color:var(--border-strong);}

  /* ---------- KPI cards ---------- */
  .kpi-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;}
  @media (max-width:820px){ .kpi-grid{grid-template-columns:repeat(2,1fr);} }
  .kpi{
    background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:14px 16px;
    display:flex;flex-direction:column;gap:6px;box-shadow:0 1px 2px var(--shadow);
  }
  .kpi .icon{width:26px;height:26px;border-radius:7px;display:flex;align-items:center;justify-content:center;background:var(--surface-2);color:var(--navy);margin-bottom:2px;}
  .kpi .icon svg{width:15px;height:15px;}
  .kpi .val{font-size:22px;font-weight:700;font-family:"IBM Plex Mono",monospace;letter-spacing:-0.01em;}
  .kpi .lbl{font-size:12px;color:var(--text-muted);font-weight:500;}
  .kpi .sub{font-size:11px;color:var(--text-faint);}
  .kpi.accent .val{color:var(--navy);}
  .kpi.warn .val{color:var(--critical);}
  .kpi.idle .val{color:var(--text-faint);}

  .eff-scale{position:relative;height:7px;border-radius:100px;margin-top:9px;}
  .eff-scale[hidden]{display:none;}
  .eff-track{position:absolute;inset:0;border-radius:100px;background:linear-gradient(90deg, var(--critical) 0%, var(--gold) 42%, var(--success) 72%, var(--navy) 100%);}
  .eff-marker{position:absolute;top:-3px;width:3px;height:13px;background:var(--text);border-radius:2px;transform:translateX(-50%);transition:left .5s ease;left:0%;}

  /* ---------- table ---------- */
  /* Sin barra horizontal, nunca: la tabla usa table-layout:fixed, así que sus columnas siempre
     caben en el ancho del contenedor y el contenido largo se parte en varias líneas. El
     overflow queda en hidden solo para que un desborde de 1px por el borde redondeado no dibuje
     una barra: no hay contenido real que se pueda ocultar. */
  .table-wrap{overflow-x:hidden;border:1px solid var(--border);border-radius:12px;background:var(--surface);}
  table{width:100%;border-collapse:collapse;}
  /* Sin ancho mínimo: ninguna tabla obliga a desplazar la pantalla. Las que no caben se apilan
     solas (ver apilarSiNoCabe), incluida la de capas del panel de detalle. */
  .table-wrap table{min-width:0;}
  /* Ancho FIJO al contenedor: con table-layout:fixed las columnas se reparten el 100% disponible y
     el contenido no puede estirar la tabla, por largo que sea el nombre de un tipo o de un
     material. Los textos largos se parten en varias líneas en vez de empujar la tabla fuera de la
     pantalla, así que nunca aparece una barra horizontal. */
  #table-ifc{table-layout:fixed;width:100%;}
  #table-ifc th,#table-ifc td{overflow-wrap:anywhere;word-break:break-word;}
  #table-ifc col.c-tog{width:38px;} #table-ifc col.c-fam{width:24%;} #table-ifc col.c-mat{width:30%;}
  #table-ifc col.c-cant{width:11%;} #table-ifc col.c-u{width:17%;} #table-ifc col.c-est{width:12%;}
  #table-ifc col.c-del{width:46px;}
  .capas-table{table-layout:fixed;width:100%;}
  .capas-table td,.capas-table th,.capas-table caption{overflow-wrap:anywhere;word-break:break-word;}
  .capas-table col.k-mat{width:38%;} .capas-table col.k-e{width:16%;} .capas-table col.k-l{width:14%;}
  .capas-table col.k-r{width:14%;} .capas-table col.k-ed{width:18%;}
  .capas-table .layer-select{max-width:100%;}
  /* En teléfono la tabla principal se reduce a lo esencial (elemento, U y estado): con el ancho
     mínimo de escritorio quedaban columnas cortadas a mitad de dígito y había que desplazar para
     leer el resultado, que es justo lo que se va a mirar. El detalle completo sigue disponible al
     tocar la fila. */
  @media (max-width:820px){
    .table-wrap{overflow-x:visible;}
    .table-wrap table{min-width:0;}
    #table-ifc thead{display:none;}
    /* LA TABLA ENTERA SALE DEL MODO TABLA, NO SOLO LAS FILAS.
       Poner `display:grid` en un <tr> lo saca del contexto de tabla, pero el
       <table> y el <tbody> siguen siendo tabla: el navegador envuelve esa fila
       suelta en una celda anónima que se encoge al contenido. Medido a 390 px
       con una fila real: la tabla medía 333 px y la FILA 38, con «Muro exterior
       2x6» dentro de una celda de 10 px. O sea que la vista de tarjetas del
       teléfono —que es como se elige la envolvente— no se podía leer.
       Con table y tbody en bloque, cada fila es un bloque que ocupa el ancho. */
    #table-ifc,#table-ifc tbody{display:block;width:100%;}
    #table-ifc tbody tr{display:grid;grid-template-columns:28px 1fr auto;gap:4px 8px;padding:10px 12px;border-bottom:1px solid var(--border);}
    #table-ifc tbody td{display:block;border:none;padding:0;font-size:12.5px;}
    #table-ifc tbody td:nth-child(2){font-weight:600;}
    #table-ifc tbody td:nth-child(3){grid-column:2 / span 2;color:var(--text-muted);font-size:11.5px;}
    #table-ifc tbody td:nth-child(4),#table-ifc tbody td:nth-child(5){grid-column:2;font-size:11.5px;}
    #table-ifc tbody td:nth-child(6),#table-ifc tbody td:nth-child(7){grid-column:3;justify-self:end;}
    /* LA FILA DE UNA SOLA CELDA TIENE QUE OCUPAR TODO EL ANCHO.
       Al volver la fila una grilla, el `colspan="7"` deja de valer: es un
       atributo de tabla y acá ya no hay tabla. El estado vacío —«Sin
       elementos», el aviso de que hay que volver a cargar el IFC— caía en la
       primera columna, que mide 28 px. Medido a 390 px: la celda quedaba en
       28 px y el mensaje en 40.
       `grid-column:1/-1` es lo que el colspan significaba, dicho en grilla. */
    #table-ifc tbody td[colspan]{grid-column:1 / -1;}
  }
  thead th{
    text-align:left;font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--text-faint);
    font-weight:600;padding:11px 14px;background:var(--surface-2);border-bottom:1px solid var(--border);white-space:nowrap;
  }
  tbody td{padding:12px 14px;border-bottom:1px solid var(--border);font-size:13px;vertical-align:top;}
  tbody tr:last-child td{border-bottom:none;}
  .cell-primary{font-weight:600;color:var(--text);}
  .cell-sub{display:block;font-size:11.5px;color:var(--text-faint);font-weight:400;margin-top:2px;}
  .num{font-family:"IBM Plex Mono",monospace;white-space:nowrap;}
  .delta-ok{color:var(--success);}
  .delta-bad{color:var(--critical);}

  .row-toggle{
    appearance:none;border:1px solid var(--border-strong);background:var(--surface);border-radius:6px;
    width:22px;height:22px;display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--text-muted);
    transition:transform .15s,background .15s;
  }
  .row-toggle svg{width:12px;height:12px;transition:transform .15s;}
  .row-toggle[aria-expanded="true"] svg{transform:rotate(90deg);}
  .row-toggle:hover{background:var(--surface-2);}
  .detail-row{display:none;background:var(--surface-2);}
  .detail-row.is-open{display:table-row;}
  .detail-row td{padding:16px;border-bottom:1px solid var(--border);}
  .detail-inner{display:flex;flex-direction:column;gap:12px;}
  .detail-flag{
    display:flex;gap:8px;align-items:flex-start;font-size:12.5px;background:var(--critical-tint);color:var(--critical);
    border-radius:8px;padding:9px 11px;
  }
  .detail-flag svg{width:14px;height:14px;flex:none;margin-top:1px;}

  .capas-table{width:100%;border-collapse:collapse;font-size:12.5px;}
  .capas-table caption{
    text-align:left;font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;
    background:var(--navy);color:#fff;padding:8px 10px;border-radius:8px 8px 0 0;
  }
  .capas-table th{background:var(--surface);border:1px solid var(--border);padding:6px 9px;text-align:left;font-weight:600;color:var(--text-muted);font-size:11px;}
  .capas-table td{background:var(--surface);border:1px solid var(--border);padding:6px 9px;}
  .capas-table tfoot td{font-weight:700;}
  .capas-table .rt-row td{background:var(--gold-tint);color:var(--gold-dark);}
  .capas-table .u-row td{background:var(--navy);color:#fff;}

  .material-add{
    display:flex;gap:8px;align-items:flex-end;flex-wrap:wrap;background:var(--surface);border:1px dashed var(--border-strong);
    border-radius:9px;padding:10px;
  }
  .material-add .mf{display:flex;flex-direction:column;gap:4px;}
  .material-add .mf label{font-size:10.5px;color:var(--text-faint);text-transform:uppercase;letter-spacing:.04em;}
  .material-add input{font:inherit;font-size:12.5px;padding:7px 8px;border-radius:6px;border:1px solid var(--border-strong);background:var(--surface);color:var(--text);}
  .material-add input[data-role="mat"]{min-width:220px;}
  .material-add input[data-role="e"]{width:90px;}
  .added-tag{font-size:11px;color:var(--success);display:flex;align-items:center;gap:5px;}
  .added-tag svg{width:12px;height:12px;}

  .pill{
    display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:600;padding:4px 9px;border-radius:100px;white-space:nowrap;
  }
  .pill svg{width:11px;height:11px;}
  .pill-ok{background:var(--success-tint);color:var(--success);}
  .pill-warn{background:var(--critical-tint);color:var(--critical);}
  .pill-pending{background:var(--pending-tint);color:var(--pending);}
  .pill-crit{background:var(--critical-tint);color:var(--critical);}

  .empty-state{
    display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;text-align:center;
    padding:36px 20px;color:var(--text-muted);
  }
  .empty-state .icon{width:40px;height:40px;border-radius:10px;background:var(--surface-2);display:flex;align-items:center;justify-content:center;color:var(--text-faint);}
  .empty-state .icon svg{width:20px;height:20px;}
  .empty-state strong{color:var(--text);font-size:13.5px;}
  .empty-state span{font-size:12.5px;max-width:320px;}

  /* ---------- file list ---------- */
  .dropzone{
    border:1.5px dashed var(--border-strong);border-radius:10px;padding:18px;text-align:center;
    color:var(--text-muted);font-size:12.5px;margin-bottom:12px;
  }
  .dropzone strong{display:block;color:var(--text);font-size:13.5px;margin-bottom:3px;}
  .file-list{display:flex;flex-direction:column;gap:8px;}
  .file-item{
    display:flex;align-items:center;gap:10px;padding:9px 11px;border:1px solid var(--border);border-radius:8px;background:var(--surface-2);
    font-size:12.5px;
  }
  .file-item .icon{width:22px;height:22px;border-radius:6px;background:var(--surface);border:1px solid var(--border);display:flex;align-items:center;justify-content:center;color:var(--navy);flex:none;}
  .file-item .icon svg{width:12px;height:12px;}
  .file-item .name{font-weight:500;color:var(--text);flex:1;}
  .file-item .tag{font-size:10.5px;color:var(--text-faint);font-family:"IBM Plex Mono",monospace;}

  /* ---------- observations / verified areas ---------- */
  .chips{display:flex;gap:8px;margin-bottom:14px;}
  .chip{
    border:1px solid var(--border-strong);background:var(--surface);color:var(--text-muted);
    font-size:12px;font-weight:600;padding:6px 12px;border-radius:100px;cursor:pointer;
  }
  .chip[aria-pressed="true"]{background:var(--navy);border-color:var(--navy);color:#fff;}

  .obs-item{
    display:flex;gap:10px;padding:12px;border:1px solid var(--border);border-radius:9px;margin-bottom:8px;background:var(--surface-2);
  }
  .obs-item:last-child{margin-bottom:0;}
  .obs-item .icon{width:20px;height:20px;border-radius:6px;flex:none;display:flex;align-items:center;justify-content:center;margin-top:1px;}
  .obs-item.crit .icon{background:var(--critical-tint);color:var(--critical);}
  .obs-item.obs .icon{background:var(--gold-tint);color:var(--gold-dark);}
  .obs-item .icon svg{width:11px;height:11px;}
  .obs-item .body p{margin:0;font-size:13px;color:var(--text);line-height:1.45;}
  .obs-item .body .fix{margin-top:4px;font-size:12px;color:var(--text-muted);}
  .obs-item .body .fix b{color:var(--text);font-weight:600;}

  .check-list{display:flex;flex-direction:column;gap:9px;}
  .check-row{display:flex;align-items:center;gap:10px;font-size:13px;color:var(--text);}
  .check-row .dot{width:16px;height:16px;border-radius:50%;flex:none;display:flex;align-items:center;justify-content:center;}
  .check-row .dot svg{width:10px;height:10px;}
  .check-row.ok .dot{background:var(--success-tint);color:var(--success);}
  .check-row.warn .dot{background:var(--gold-tint);color:var(--gold-dark);}
  .check-row.pending .dot{background:var(--pending-tint);color:var(--pending);}
  .check-row .status{margin-left:auto;font-size:11.5px;color:var(--text-faint);}

  .result-banner{
    display:flex;align-items:center;gap:12px;padding:14px 16px;border-radius:10px;margin-bottom:14px;
    background:var(--surface-2);border:1px solid var(--border);
  }
  .result-banner .icon{width:32px;height:32px;border-radius:8px;flex:none;display:flex;align-items:center;justify-content:center;}
  .result-banner .icon svg{width:16px;height:16px;}
  .result-banner.pending .icon{background:var(--pending-tint);color:var(--pending);}
  .result-banner.mixed .icon{background:var(--gold-tint);color:var(--gold-dark);}
  .result-banner strong{display:block;font-size:14px;color:var(--text);}
  .result-banner span{font-size:12.5px;color:var(--text-muted);}

  /* ---------- asistente compacto MINVU ---------- */
  .assistant-card{border-color:var(--border-strong);box-shadow:0 8px 28px rgba(18,96,63,.07);}
  .assistant-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;flex-wrap:wrap;}
  .assistant-head .copy{min-width:220px;flex:1;}
  .assistant-badge{display:inline-flex;align-items:center;gap:6px;padding:5px 9px;border-radius:999px;background:var(--success-tint);color:var(--success);font-size:11.5px;font-weight:700;white-space:nowrap;}
  .assistant-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:14px 0;}
  .assistant-stat{border:1px solid var(--border);border-radius:9px;padding:10px 11px;background:var(--surface-2);}
  .assistant-stat b{display:block;font-size:18px;color:var(--text);line-height:1.15;}
  .assistant-stat span{font-size:11.5px;color:var(--text-muted);}
  .assistant-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap;}
  .assistant-actions .btn{width:auto;margin:0;}
  .assistant-config{margin-top:12px;border-top:1px solid var(--border);padding-top:12px;}
  .assistant-config summary,.compact-details summary{cursor:pointer;font-size:13px;font-weight:700;color:var(--navy);list-style-position:outside;margin-left:16px;}
  .assistant-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px 12px;margin-top:12px;}
  .assistant-grid .field{margin:0;}
  .assistant-grid .field-wide{grid-column:span 2;}
  .dv-row{display:grid;grid-template-columns:1fr 1.2fr 1fr;gap:8px;}
  .assistant-result{margin-top:12px;border-radius:10px;padding:11px 12px;border:1px solid var(--border);font-size:12.5px;line-height:1.5;}
  .assistant-result.ok{background:var(--success-tint);color:var(--text);}
  .assistant-result.warn{background:var(--gold-tint);color:var(--text);}
  .assistant-result ul{margin:7px 0 0;padding-left:18px;}
  .source-minvu{display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:700;color:var(--navy);background:var(--surface-2);border:1px solid var(--border-strong);padding:3px 7px;border-radius:999px;}
  .original-note{border-left:3px solid var(--border-strong);padding-left:10px;color:var(--text-muted);font-size:12px;line-height:1.5;}
  @media (max-width:760px){
    .assistant-summary{grid-template-columns:1fr;}
    .assistant-grid{grid-template-columns:1fr;}
    .assistant-grid .field-wide{grid-column:auto;}
    .dv-row{grid-template-columns:1fr;}
    .assistant-actions .btn{width:100%;}
  }

  /* ---------- sun exposure ---------- */
  /* La exposición solar se muestra dentro de la columna angosta de la tarjeta de ubicación, donde
     una tabla de cuatro columnas no cabe y quedaba cortada. Se presenta como bloques apilados:
     una fecha por bloque, con sus valores en pares etiqueta/valor que se ajustan a cualquier ancho. */
  .sun-fecha{border-bottom:1px solid var(--border);padding:8px 0;}
  .sun-fecha:last-of-type{border-bottom:none;}
  .sun-fecha .nom{font-size:12.5px;font-weight:700;margin-bottom:4px;}
  .sun-fecha .datos{display:flex;flex-wrap:wrap;gap:4px 14px;}
  .sun-fecha .dato{display:flex;gap:5px;font-size:11.5px;color:var(--text-muted);}
  .sun-fecha .dato b{color:var(--text);font-weight:600;font-family:"IBM Plex Mono",monospace;}
  .sun-legend{display:flex;gap:16px;font-size:11.5px;color:var(--text-muted);margin-bottom:10px;}
  .sun-legend span{display:flex;align-items:center;gap:6px;}
  .sun-legend i{width:10px;height:10px;border-radius:3px;display:inline-block;}
  .sun-row{display:flex;align-items:center;gap:10px;margin-bottom:8px;flex-wrap:wrap;}
  .sun-row .lbl{width:64px;font-size:12px;color:var(--text-muted);flex:none;}
  @media (max-width:820px){ .sun-row{gap:4px;} .sun-row .lbl{width:100%;} .sun-row .track{flex:1 1 100%;} }
  .sun-row .track{flex:1;display:flex;gap:3px;height:16px;}
  .sun-row .seg{border-radius:4px;display:flex;align-items:center;justify-content:flex-end;padding-right:5px;color:#fff;font-size:10px;font-weight:600;font-family:"IBM Plex Mono",monospace;white-space:nowrap;min-width:2px;}

  /* ---------- notice ---------- */
  .notice{
    display:flex;gap:12px;align-items:flex-start;background:var(--gold-tint);border:1px solid var(--gold);
    border-radius:12px;padding:14px 16px;margin-top:6px;
  }
  .notice .icon{width:22px;height:22px;border-radius:6px;flex:none;display:flex;align-items:center;justify-content:center;color:var(--gold-dark);}
  .notice .icon svg{width:16px;height:16px;}
  .notice p{margin:0;font-size:12.75px;line-height:1.55;color:var(--text);}
  .notice strong{color:var(--gold-dark);}

  footer{border-top:1px solid var(--border);padding:16px 0 32px;margin-top:6px;}
  .footer-inner{max-width:1180px;margin:0 auto;padding-inline:20px;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;color:var(--text-faint);font-size:12px;}

  /* ---------- modal ---------- */
  .modal-backdrop{
    position:fixed;inset:0;background:rgba(10,16,24,0.55);display:flex;align-items:center;justify-content:center;
    padding:20px;z-index:50;
  }
  .modal-backdrop[hidden]{display:none;}
  .modal{
    background:var(--surface);border-radius:14px;max-width:560px;width:100%;max-height:85vh;overflow:auto;
    box-shadow:0 20px 60px rgba(0,0,0,.35);border:1px solid var(--border);
  }
  /* El informe usa todo el ancho útil de la pantalla (hasta 1120px): con 920px la tabla de
     condensaciones, que tiene 8 columnas, quedaba con scroll horizontal incluso en un notebook. */
  .modal.modal-wide{max-width:1120px;}
  .modal-head{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid var(--border);position:sticky;top:0;background:var(--surface);}
  .modal-head h2{font-size:15px;font-weight:700;}
  .modal-close{background:none;border:none;color:var(--text-muted);cursor:pointer;font-size:18px;line-height:1;padding:4px;}
  .modal-body{padding:20px;}
  /* Nada del informe se lee desplazando una barra horizontal: las tablas caben siempre en el ancho
     disponible. En pantallas anchas se ven como tabla normal; bajo 760px cada fila se convierte en
     un bloque con la etiqueta de la columna delante del dato, que es legible en un teléfono y
     sigue siendo mostrable a un cliente sin explicar nada. */
  .rpt-table-wrap{max-width:100%;margin-bottom:10px;}
  .rpt-table-wrap table{margin-bottom:0;}
  .rpt table{table-layout:auto;}
  .rpt table th,.rpt table td{overflow-wrap:anywhere;}
  /* Franja intermedia (tablet / ventana angosta): la tabla sigue siendo tabla, pero se aprieta
     tipografía y espaciado para que las de más columnas —condensaciones, con nueve— entren
     completas sin barra de desplazamiento. */
  @media (max-width:1000px){
    .rpt table{font-size:11px;}
    .rpt table th,.rpt table td{padding:5px 5px;}
  }
  /* Modo apilado: se aplica tabla por tabla, solo a las que no caben en el ancho disponible (lo
     decide apilarTablasQueNoCaben al generar el informe y al cambiar el tamaño de la ventana).
     Así una tabla de 4 columnas se sigue viendo como tabla incluso en el teléfono, y una de 14
     columnas se apila incluso en un notebook: nunca hay que arrastrar nada para leer un dato. */
  table.apilada,table.apilada thead,table.apilada tbody,
  table.apilada tr,table.apilada th,table.apilada td{display:block;width:auto;}
  table.apilada thead{display:none;}
  table.apilada tbody tr{
    border:1px solid var(--border);border-radius:10px;
    padding:6px 10px;margin-bottom:8px;background:var(--surface);
  }
  table.apilada tbody td{
    display:flex;align-items:flex-start;justify-content:space-between;gap:12px;
    border:none;border-bottom:1px solid var(--border);padding:6px 0;text-align:right;font-size:12.5px;
  }
  table.apilada tbody tr td:last-child{border-bottom:none;}
  table.apilada tbody td::before{
    content:attr(data-col);flex:0 0 42%;text-align:left;
    font-weight:600;color:var(--text-muted);font-size:11.5px;
  }
  table.apilada tbody td[data-col=""]{font-weight:700;text-align:left;}
  table.apilada tbody td[data-col=""]::before{display:none;}
  @media (max-width:760px){
    .modal-backdrop{padding:8px;}
    .modal{max-height:92vh;}
    .modal-body{padding:14px;}
  }
  @media print{
    .rpt-table-wrap{overflow:visible;}
  }
  .modal-body h3{font-size:12px;text-transform:uppercase;letter-spacing:.05em;color:var(--text-faint);margin:0 0 8px;}
  .modal-body .row{display:flex;justify-content:space-between;font-size:13px;padding:7px 0;border-bottom:1px solid var(--border);}
  .modal-body .row:last-child{border-bottom:none;}
  .modal-body .row span:first-child{color:var(--text-muted);}
  .modal-body .row span:last-child{font-weight:600;font-family:"IBM Plex Mono",monospace;}
  .modal-block{margin-bottom:18px;}
  .modal-foot{display:flex;gap:10px;padding:16px 20px;border-top:1px solid var(--border);}
  .modal-foot .btn{margin:0;}

  /* ---------- report document (paper look, intentionally theme-fixed) ---------- */
  .rpt{background:#FFFFFF;color:#1B1F24;font-family:"IBM Plex Sans",sans-serif;font-size:12.5px;line-height:1.55;}
  .rpt h2.rpt-title{font-size:18px;font-weight:700;color:#12343B;margin:0 0 2px;}
  .rpt .rpt-sub{color:#5B6472;font-size:12.5px;margin:0 0 18px;}
  .rpt .rpt-sec{margin:26px 0 10px;font-size:13.5px;font-weight:700;color:#12343B;border-bottom:2px solid #3E9AA6;padding-bottom:5px;}
  .rpt .rpt-sec:first-of-type{margin-top:6px;}
  .rpt .rpt-sub-h{font-size:12.5px;font-weight:700;color:#1B1F24;margin:14px 0 6px;}
  .rpt p{margin:0 0 10px;}
  .rpt table{width:100%;border-collapse:collapse;font-size:11.8px;margin-bottom:14px;}
  .rpt th{background:#3E9AA6;color:#fff;text-align:left;padding:6px 9px;font-weight:600;border:1px solid #2F7A83;}
  .rpt td{padding:6px 9px;border:1px solid #DCE2E6;}
  .rpt .rpt-rt td{background:#F5A93F;color:#3A2A00;font-weight:700;}
  .rpt .rpt-u td{background:#12343B;color:#fff;font-weight:700;}
  .rpt .ok-cell{background:#DCF0E2;color:#1F7A3D;font-weight:600;}
  .rpt .bad-cell{background:#FBE1E1;color:#B23B3B;font-weight:600;}
  .rpt .formula{text-align:center;font-family:"IBM Plex Mono",monospace;font-size:13.5px;background:#F6F7F9;border:1px solid #E1E5E9;border-radius:6px;padding:10px;margin:10px 0;}
  .rpt .rpt-note{background:#FCF3DA;border:1px solid #E9C766;border-radius:6px;padding:9px 11px;font-size:11.8px;margin:8px 0 14px;}
  .rpt .rpt-note b{color:#8A621A;}
  .rpt .rpt-pending{background:#F0F1F3;border:1px dashed #B9C0C9;border-radius:6px;padding:9px 11px;font-size:11.8px;color:#5B6472;margin:8px 0 14px;font-style:italic;}
  .rpt .sig-box{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:18px;}
  .rpt .sig-box div{border-top:1px solid #1B1F24;padding-top:6px;font-size:11.5px;color:#5B6472;}
  .rpt .glaser-verdict{font-size:12px;font-weight:600;margin-top:4px;}
  .rpt .glaser-verdict.ok{color:#1F7A3D;}
  .rpt .glaser-verdict.bad{color:#B23B3B;}
  .rpt .sol-box{border:1px solid #3E9AA6;border-radius:6px;overflow:hidden;margin:6px 0 14px;}
  .rpt .sol-box-h{background:#BEE3E7;color:#12343B;font-weight:700;font-size:11.5px;letter-spacing:.03em;padding:6px 10px;text-align:center;}
  .rpt .sol-box-b{padding:9px 11px;font-size:11.8px;background:#F3FAFB;}
  .rpt .fuera-cell{background:#E7E9EC;color:#4A525C;font-weight:600;}
  .rpt .ficha-cell{background:#EAF3EE;border:1px dashed #8FBF9E;border-radius:6px;padding:9px 11px;font-size:11.8px;color:#2C5A3C;margin:8px 0 14px;}

  /* Informe formal PDAO: reproduce la lógica documental de la memoria térmica válida aportada.
     El diagnóstico exhaustivo permanece en la aplicación y el PDF se organiza en hojas con
     una finalidad clara, cuadros breves y esquemas técnicos. */
  .rpt-formal{background:#edf0f2;padding:18px 0;font-family:Arial,sans-serif;color:#111;counter-reset:rptpage;}
  .rpt-formal .rpt-page{
    box-sizing:border-box;width:216mm;min-height:330mm;margin:0 auto 18px;padding:15mm 15mm 18mm;
    background:#fff;box-shadow:0 4px 22px rgba(15,23,42,.12);position:relative;overflow:hidden;
    counter-increment:rptpage;
  }
  .rpt-formal .rpt-page-head{display:flex;justify-content:flex-end;min-height:8mm;margin-bottom:8mm;color:#777;font-size:8px;letter-spacing:.08em;text-transform:uppercase;}
  .rpt-formal .rpt-page-foot{position:absolute;left:15mm;right:15mm;bottom:7mm;display:flex;justify-content:space-between;border-top:1px solid #ddd;padding-top:3mm;color:#777;font-size:8px;}
  .rpt-formal .rpt-kicker{font-size:8px;letter-spacing:.12em;text-transform:uppercase;color:#555;margin:0 0 2mm;}
  .rpt-formal h1{font-size:17px;line-height:1.25;text-align:center;margin:22mm 0 3mm;color:#000;text-transform:uppercase;letter-spacing:.04em;}
  .rpt-formal .rpt-cover-sub{text-align:center;font-size:11px;font-weight:700;text-transform:uppercase;margin:0 0 13mm;}
  .rpt-formal h2{font-size:12px;line-height:1.3;color:#000;margin:0 0 5mm;text-transform:uppercase;letter-spacing:.025em;}
  .rpt-formal h3{font-size:10px;line-height:1.3;color:#000;margin:5mm 0 2.5mm;text-transform:uppercase;}
  .rpt-formal p{font-size:9.3px;line-height:1.48;margin:0 0 3.5mm;text-align:justify;}
  .rpt-formal table{width:100%;border-collapse:collapse;table-layout:fixed;font-size:8.3px;margin:0 0 5mm;}
  .rpt-formal th,.rpt-formal td{border:1px solid #a9a9a9;padding:2.2mm 2.4mm;vertical-align:middle;overflow-wrap:anywhere;}
  .rpt-formal th{background:#55b4c8;color:#111;font-weight:700;text-align:center;}
  .rpt-formal .rpt-label{width:31%;font-weight:700;background:#f4f4f4;}
  .rpt-formal .rpt-center{text-align:center;}
  .rpt-formal .rpt-result{font-weight:700;text-align:center;background:#e2f0d9;color:#285b22;}
  .rpt-formal .rpt-result.bad{background:#fce4e4;color:#8f2424;}
  .rpt-formal .rpt-result.pending{background:#fff1d6;color:#8b5700;}
  .rpt-formal .rpt-formula{font-family:"Courier New",monospace;text-align:center;font-size:12px;font-weight:700;margin:8mm 0;padding:4mm 3mm;}
  .rpt-formal .rpt-solution{border:1px solid #8aa8ad;margin:0 0 4mm;}
  .rpt-formal .rpt-solution strong{display:block;background:#bfeaf0;text-align:center;padding:2mm;font-size:8.5px;text-transform:uppercase;}
  .rpt-formal .rpt-solution span{display:block;padding:3mm;font-size:9px;text-align:center;}
  .rpt-formal .rpt-layer-strip{display:grid;height:42mm;margin:3mm 0 5mm;border:1px solid #777;overflow:hidden;}
  .rpt-formal .rpt-layer{min-width:0;border-right:1px solid #777;display:flex;align-items:center;justify-content:center;padding:1.5mm;background:#dedede;}
  .rpt-formal .rpt-layer:last-child{border-right:none;}
  .rpt-formal .rpt-layer span{font-size:7px;line-height:1.15;text-align:center;writing-mode:vertical-rl;transform:rotate(180deg);max-height:38mm;overflow:hidden;}
  .rpt-formal .rpt-layer.aislante{background:#f4d64f;}
  .rpt-formal .rpt-layer.estructura{background:#c8a26a;}
  .rpt-formal .rpt-layer.terminacion{background:#e8e8e8;}
  .rpt-formal .rpt-layer.barrera{background:#9fd3e7;}
  .rpt-formal .rpt-layer.camara{background:#eef7fb;}
  .rpt-formal .rpt-conclusion{font-size:10px;font-weight:700;margin-top:4mm;}
  .rpt-formal .rpt-pending-line{color:#a35300;font-weight:700;font-size:8.8px;margin:3mm 0;}
  .rpt-formal .rpt-index{columns:2;column-gap:12mm;margin-top:5mm;}
  .rpt-formal .rpt-index p{break-inside:avoid;text-align:left;margin-bottom:2mm;font-size:8.8px;}
  .rpt-formal .rpt-diagram-grid{display:grid;grid-template-columns:1fr 1fr;gap:7mm;margin:5mm 0;}
  .rpt-formal .rpt-detail{border:1px solid #bbb;padding:4mm;min-height:52mm;position:relative;}
  .rpt-formal .rpt-detail-title{font-size:8px;font-weight:700;text-transform:uppercase;margin-bottom:3mm;}
  .rpt-formal .door-diagram{width:34mm;height:42mm;background:#d6ae7f;border:4px solid #eee;outline:1px solid #777;margin:2mm auto;box-shadow:0 0 0 3px #d74334;}
  .rpt-formal .eave-diagram{height:38mm;margin:4mm 5mm;position:relative;border-left:9mm solid #c79d64;border-bottom:8mm solid #ddd;transform:skewY(-4deg);}
  .rpt-formal .eave-diagram:before{content:"";position:absolute;left:-9mm;right:-4mm;top:0;border-top:5mm solid #d6ae7f;transform:rotate(-12deg);transform-origin:left top;}
  .rpt-formal .eave-diagram:after{content:"Sello continuo";position:absolute;left:18mm;top:14mm;color:#c7382b;font-size:7px;border-top:2px solid #c7382b;padding-top:1mm;transform:skewY(4deg);}
  .rpt-formal .rpt-facades{display:grid;grid-template-columns:1fr 1fr;gap:5mm;margin-top:5mm;}
  .rpt-formal .rpt-facade{border:1px solid #aaa;padding:3mm;text-align:center;}
  .rpt-formal .rpt-house{height:24mm;background:#eee;border:1px solid #777;border-top:4mm solid #666;display:flex;align-items:flex-end;justify-content:space-evenly;padding:0 5mm 2mm;}
  .rpt-formal .rpt-house i{display:block;width:9mm;height:12mm;background:#b77a61;border:1px solid #6d4b3c;}
  .rpt-formal .rpt-facade b{display:block;font-size:8px;margin-top:2mm;}
  .rpt-formal .rpt-sun-bars{margin-top:5mm;}
  .rpt-formal .rpt-sun-row{display:grid;grid-template-columns:24mm 1fr;align-items:center;gap:3mm;margin:2.5mm 0;font-size:8px;}
  .rpt-formal .rpt-sun-track{height:6mm;background:#eee;display:flex;overflow:hidden;}
  .rpt-formal .rpt-sun-track i{display:block;height:100%;}
  .rpt-formal .rpt-signature{margin:18mm auto 0;width:70mm;text-align:center;border-top:1px solid #222;padding-top:3mm;font-size:9px;line-height:1.45;}
  @media(max-width:850px){
    .rpt-formal{padding:8px;overflow:auto;}
    .rpt-formal .rpt-page{width:100%;min-height:auto;margin-bottom:12px;padding:24px 18px 48px;}
    .rpt-formal .rpt-page-foot{left:18px;right:18px;bottom:14px;}
  }

  /* IMPRESIÓN / PDF
     Antes se ocultaba con visibility:hidden, que deja el espacio ocupado: por eso salía una primera
     hoja en blanco y decenas de páginas vacías. Ahora lo que no es el informe se quita del flujo con
     display:none, el informe se imprime desde el inicio de la hoja, y las tablas apiladas vuelven a
     su forma de tabla porque en papel sí hay ancho. */
  @media print{
    @page{size:216mm 330mm;margin:0;}
    @page{ margin:14mm 12mm; }
    html,body{background:#fff !important;height:auto !important;}
    body > *{display:none !important;}
    body > .modal-backdrop{
      display:block !important;position:static !important;inset:auto !important;
      background:none !important;padding:0 !important;margin:0 !important;z-index:auto !important;
    }
    .modal-backdrop[hidden]{display:none !important;}
    .modal{
      position:static !important;max-height:none !important;max-width:100% !important;width:100% !important;
      overflow:visible !important;box-shadow:none !important;border:none !important;border-radius:0 !important;
      background:#fff !important;
    }
    .modal-head,.modal-foot{display:none !important;}
    .modal-body{padding:0 !important;}
    .rpt-table-wrap{overflow:visible !important;margin-bottom:8px;}
    /* en papel no hace falta el modo apilado: vuelve a leerse como tabla */
    table.apilada,table.apilada thead,table.apilada tbody,table.apilada tr,table.apilada th,table.apilada td{display:revert !important;}
    table.apilada thead{display:table-header-group !important;}
    table.apilada tbody tr{border:none !important;border-radius:0 !important;padding:0 !important;margin:0 !important;background:none !important;}
    table.apilada tbody td{display:table-cell !important;text-align:left;border-bottom:1px solid #ddd !important;padding:5px 6px !important;}
    table.apilada tbody td::before{display:none !important;}
    thead{display:table-header-group;}
    tr,.rpt-sub-h,.detail-flag{break-inside:avoid;page-break-inside:avoid;}
    .rpt-sec{break-after:avoid;page-break-after:avoid;break-inside:avoid;}
    .rpt table{font-size:10.5px !important;}
    .rpt table th,.rpt table td{padding:4px 5px !important;}
    .rpt-formal{background:#fff !important;padding:0 !important;}
    .rpt-formal .rpt-page{width:216mm !important;min-height:330mm !important;margin:0 !important;padding:15mm 15mm 18mm !important;box-shadow:none !important;break-after:page;page-break-after:always;overflow:hidden !important;}
    .rpt-formal .rpt-page:last-child{break-after:auto;page-break-after:auto;}
    .rpt-formal table{font-size:8.3px !important;}
    .rpt-formal table th,.rpt-formal table td{padding:2.2mm 2.4mm !important;}
  }
  @media (prefers-reduced-motion: reduce){
    *{transition-duration:0.001ms !important;animation-duration:0.001ms !important;}
  }

  /* =====================================================================
     PASOS EN PESTAÑAS (19-10-2026)
     Antes todo iba en una sola página de 3.600 px —antecedentes, mapa,
     ventilación, asistente, tabla— y en la vista del proyecto esa página
     vivía dentro de un marco de alto fijo con su propio scroll: una ventana
     dentro de otra, con todo amontonado. Ahora el módulo se abre a pantalla
     completa, cada paso muestra solo lo suyo usando todo el ancho, y la
     barra de pasos con los indicadores queda fija arriba.
     ===================================================================== */
  .app,.topbar-inner,.footer-inner{max-width:1480px;}
  main{padding-block:18px 40px;}
  /* Sin esta regla, .btn (inline-flex) le ganaba al atributo hidden: «Terminar perímetro» o
     «Deshacer soluciones aprobadas» seguían a la vista cuando el motor los ocultaba. Es la misma
     regla base que ya tienen las demás hojas del sitio. */
  [hidden]{display:none !important;}
  /* Botones de una fila de acciones: a su ancho, no uno por renglón a todo lo ancho. */
  #card-antecedentes .btn,#btn-empl-buscar{width:auto;margin:0;}
  /* La celda de U es .num (sin cortes de línea): el aviso «Condensación intersticial: requiere
     control de vapor» se salía encima de la columna Estado y tapaba el botón Solucionar. */
  #table-ifc .delta-bad,#table-ifc .delta-ok{white-space:normal;}

  .pasos-barra{
    position:sticky;top:0;z-index:40;background:var(--bg);
    border-bottom:1px solid var(--border);box-shadow:0 2px 10px var(--shadow);
  }
  .pasos-barra-in{
    max-width:1480px;margin:0 auto;padding:8px 20px;
    display:flex;align-items:center;gap:12px;flex-wrap:wrap;
  }
  .pasos{
    display:flex;gap:4px;flex:1 1 560px;min-width:0;
    background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:4px;
  }
  .paso-tab{
    appearance:none;border:0;background:transparent;flex:1 1 0;min-width:0;
    display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:9px;cursor:pointer;
    color:var(--text-muted);font:inherit;font-size:13px;font-weight:600;text-align:left;
    transition:background .15s,color .15s;
  }
  .paso-tab:hover{background:var(--surface-2);color:var(--text);}
  .paso-tab[aria-selected="true"]{background:var(--navy);color:#fff;}
  .paso-num{
    width:22px;height:22px;border-radius:50%;flex:none;display:flex;align-items:center;justify-content:center;
    font-size:12px;background:var(--surface-2);border:1px solid var(--border-strong);color:var(--text-muted);
  }
  .paso-tab[aria-selected="true"] .paso-num{background:#fff;border-color:#fff;color:var(--navy);}
  .paso-txt{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
  .paso-txt .corto{display:none;}

  /* Los cuatro indicadores, en chico, al lado de los pasos */
  .pasos-barra .kpi-grid{flex:0 1 420px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;}
  .pasos-barra .kpi{padding:5px 10px;gap:0;border-radius:9px;box-shadow:none;min-width:0;}
  .pasos-barra .kpi .icon,.pasos-barra .kpi .sub{display:none;}
  .pasos-barra .kpi .val{font-size:16px;line-height:1.25;}
  .pasos-barra .kpi .lbl{font-size:10.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
  .pasos-barra .eff-scale{height:4px;margin-top:3px;}
  .pasos-barra .eff-marker{top:-2px;height:8px;}

  /* Cada paso */
  .paso{display:flex;flex-direction:column;gap:18px;}
  .paso[hidden]{display:none;}
  .paso-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;align-items:start;}
  .paso-grid-lateral{grid-template-columns:minmax(0,1fr) minmax(0,1.45fr);}
  .paso-col{display:flex;flex-direction:column;gap:18px;min-width:0;}
  .paso-fila{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,460px),1fr));gap:18px;align-items:start;}
  .paso-grid > *,.paso-fila > *{min-width:0;}
  @media (max-width:1100px){ .paso-grid,.paso-grid-lateral{grid-template-columns:minmax(0,1fr);} }
  .paso-pie{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;}
  .paso-pie .btn{width:auto;margin:0;padding-inline:16px;}
  .paso-pie .btn-primary{margin-left:auto;}

  .card .field-row > .zone-badge{align-self:end;}
  .campos-auto{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,190px),1fr));gap:0 10px;}
  .nota-plegada{margin-top:10px;}
  .nota-plegada summary{cursor:pointer;font-size:12.5px;color:var(--text-muted);}

  /* Emplazamiento: el mapa crece con el ancho que ahora tiene */
  #empl-map{height:480px;}
  .empl-coords{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;gap:8px;align-items:end;margin-bottom:8px;}
  .empl-coords .btn,.empl-acciones .btn{width:auto;margin:0;}
  .empl-acciones{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:8px;}
  .empl-acciones #btn-empl-reset{margin-left:auto;}
  .empl-medidas{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:12px;}
  .empl-medidas > *{min-width:0;}

  /* Informe en la página */
  .informe-cabecera{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;}
  .informe-cabecera .btn{width:auto;margin:0;padding-inline:16px;}
  .informe-vacio{
    display:flex;flex-direction:column;gap:6px;align-items:center;text-align:center;
    padding:42px 20px;border:1px dashed var(--border-strong);border-radius:12px;color:var(--text-muted);font-size:13px;
  }
  .informe-vacio strong{color:var(--text);font-size:14px;}
  .informe-vacio[hidden]{display:none;}
  @media screen{
    .modal-backdrop.informe-en-linea{position:static;inset:auto;background:none;padding:0;display:block;z-index:auto;}
    .modal-backdrop.informe-en-linea[hidden]{display:none;}
    .informe-en-linea .modal{max-width:none;max-height:none;overflow:visible;box-shadow:0 1px 2px var(--shadow);border-radius:12px;}
    .informe-en-linea .modal-head{position:static;}
    .informe-en-linea .modal-close,.informe-en-linea #modal-cancel{display:none;}
    .informe-en-linea .modal-foot{
      position:sticky;top:var(--alto-barra,64px);z-index:5;background:var(--surface);
      border-top:0;border-bottom:1px solid var(--border);padding:10px 20px;flex-wrap:wrap;
    }
    .informe-en-linea .modal-foot .btn{width:auto;}
  }

  /* El aviso largo queda plegado al final */
  details.notice{display:block;}
  details.notice > summary{cursor:pointer;display:flex;align-items:center;gap:8px;font-size:12.75px;color:var(--text);list-style:none;}
  details.notice > summary::-webkit-details-marker{display:none;}
  details.notice > p{margin:10px 0 0;}

  @media (max-width:1100px){ .pasos-barra .kpi-grid{flex:1 1 100%;} }
  @media (max-width:900px){
    .paso-txt .largo{display:none;}
    .paso-txt .corto{display:inline;}
  }
  @media (max-width:640px){
    .app{padding-inline:12px;}
    .pasos-barra-in{padding:6px 10px;gap:6px;}
    .paso-tab{flex-direction:column;gap:2px;padding:6px 2px;font-size:11.5px;text-align:center;}
    .pasos-barra .kpi{padding:4px 6px;}
    .pasos-barra .kpi .val{font-size:14px;}
    .pasos-barra .kpi .lbl{font-size:10px;}
    .empl-coords,.empl-medidas{grid-template-columns:minmax(0,1fr);}
    .empl-acciones #btn-empl-reset{margin-left:0;}
    #empl-map{height:320px;}
    .paso-pie .btn{flex:1 1 100%;}
  }

  /* Impresión del informe en la página: se muestra solo el informe, esté en
     el paso que esté el usuario al pedir imprimir. */
  @media print{
    body > .app{display:block !important;max-width:none !important;padding:0 !important;margin:0 !important;}
    .app main{padding:0 !important;}
    .app main > *:not(#panel-ifc){display:none !important;}
    #panel-ifc{display:block !important;}
    #panel-ifc > .paso:not(#paso-4){display:none !important;}
    #paso-4{display:block !important;}
    #paso-4 > *:not(#modal){display:none !important;}
    #modal.informe-en-linea:not([hidden]){
      display:block !important;position:static !important;background:none !important;padding:0 !important;margin:0 !important;
    }
  }