/* ===================== CIMIENTO · App · estilos ===================== */
:root{
  --ground:#EEF1F4; --panel:#FFFFFF; --panel-2:#F5F7F9; --ink:#14171B; --ink-2:#4A535D; --ink-3:#828B95;
  --line:#DCE1E6; --line-2:#E9EDF1; --field:#F3F5F8;
  --brand:#1C5E9E; --brand-2:#123f6c; --brand-soft:#E4EDF6;
  --verde:#1C7C46; --verde-soft:#E4F1EA; --verde-line:#B7DCC4;
  --rojo:#BC3838; --rojo-soft:#F8E6E6; --rojo-line:#EEC3C3;
  --amber:#A96C10; --amber-soft:#F7EDD8; --amber-line:#E0C489;
  --conc:#EDEFF0; --steel:#1C5E9E;
  --sans: system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --mono: ui-monospace,"Cascadia Code",Consolas,"Liberation Mono",monospace;
}
@media (prefers-color-scheme:dark){ :root{
  --ground:#0E1115; --panel:#171B21; --panel-2:#1E242C; --ink:#E9ECEF; --ink-2:#A7AFB9; --ink-3:#727B85;
  --line:#2A313A; --line-2:#20272F; --field:#1E242C;
  --brand:#5C9CE0; --brand-2:#8fbaea; --brand-soft:#16293C;
  --verde:#54B47F; --verde-soft:#12271C; --verde-line:#26482E;
  --rojo:#E17070; --rojo-soft:#2A1719; --rojo-line:#482525;
  --amber:#D89C48; --amber-soft:#291F0F; --amber-line:#463819;
  --conc:#222833; --steel:#5C9CE0;
}}
*{ box-sizing:border-box; }
html,body{ margin:0; }
body{ background:var(--ground); color:var(--ink); font-family:var(--sans); line-height:1.5;
  -webkit-font-smoothing:antialiased; -webkit-tap-highlight-color:transparent; }
.app{ max-width:520px; margin:0 auto; min-height:100vh; display:flex; flex-direction:column; }

/* Header */
.hdr{ display:flex; align-items:center; gap:.6rem; padding:.9rem 1rem; background:var(--panel);
  border-bottom:1px solid var(--line); position:sticky; top:0; z-index:5; }
.logo{ width:26px; height:26px; border-radius:7px; background:var(--brand); position:relative; flex:0 0 auto; }
.logo::after{ content:""; position:absolute; inset:6px 10px 5px; border-left:2.5px solid #fff; border-bottom:2.5px solid #fff; }
.hdr .name{ font-weight:800; font-size:1.05rem; letter-spacing:-.01em; }
.hdr .slo{ font-size:.66rem; color:var(--ink-3); font-family:var(--mono); }
.hdr .back{ margin-left:auto; background:var(--field); border:1px solid var(--line); color:var(--ink-2);
  border-radius:8px; padding:.4rem .7rem; font-size:.8rem; cursor:pointer; display:none; }
.hdr .back.show{ display:inline-block; }
.offline-dot{ margin-left:.4rem; font-size:.6rem; font-family:var(--mono); color:var(--verde); }

/* Screens */
main{ flex:1; padding:1rem 1rem 6rem; }
.screen{ display:none; }
.screen.active{ display:block; animation:fade .25s ease both; }
@keyframes fade{ from{opacity:0; transform:translateY(6px);} to{opacity:1; transform:none;} }

h1.title{ font-size:1.3rem; margin:.2rem 0 .1rem; letter-spacing:-.02em; }
.subtitle{ color:var(--ink-2); font-size:.9rem; margin:0 0 1.2rem; }

/* Question groups */
.q{ margin-bottom:1.1rem; }
.q > label{ display:block; font-weight:650; font-size:.92rem; margin-bottom:.5rem; }
.q .hint{ font-weight:400; color:var(--ink-3); font-size:.78rem; }
.opts{ display:flex; gap:.5rem; flex-wrap:wrap; }
.opt{ flex:1 1 auto; min-width:70px; text-align:center; padding:.7rem .5rem; border-radius:10px;
  background:var(--field); border:1.5px solid var(--line); color:var(--ink-2); font-size:.9rem; cursor:pointer;
  user-select:none; transition:.12s; }
.opt:active{ transform:scale(.97); }
.opt.on{ background:var(--brand-soft); border-color:var(--brand); color:var(--brand-2); font-weight:650; }
input[type=text], input[list], select{ width:100%; padding:.7rem .8rem; border:1.5px solid var(--line);
  border-radius:10px; background:var(--field); color:var(--ink); font-family:var(--sans); font-size:1rem; }
.slider-row{ display:flex; align-items:center; gap:.8rem; }
input[type=range]{ flex:1; accent-color:var(--brand); }
.slider-val{ font-family:var(--mono); font-weight:700; color:var(--brand-2); min-width:64px; text-align:right; }
.muni-read{ font-family:var(--mono); font-size:.76rem; color:var(--brand-2); margin-top:.4rem; }
.muni-read.warn{ color:var(--rojo); }

/* Primary button (sticky) */
.actionbar{ position:fixed; left:0; right:0; bottom:0; padding:.8rem 1rem calc(.8rem + env(safe-area-inset-bottom));
  background:linear-gradient(to top, var(--ground) 70%, transparent); }
.actionbar .inner{ max-width:520px; margin:0 auto; }
.btn{ display:block; width:100%; text-align:center; padding:.95rem; border-radius:12px; border:none;
  font-size:1rem; font-weight:700; cursor:pointer; font-family:var(--sans); }
.btn.primary{ background:var(--brand); color:#fff; }
.btn.ghost{ background:transparent; color:var(--brand); border:1.5px solid var(--brand); }
.btn.wa{ background:var(--verde); color:#fff; }
.btn:active{ transform:scale(.99); }
.btn + .btn{ margin-top:.6rem; }

/* Verdict */
.verdict{ border-radius:14px; padding:1.1rem; display:flex; gap:.9rem; align-items:flex-start; margin-bottom:1rem; }
.verdict.green{ background:var(--verde-soft); border:1px solid var(--verde-line); }
.verdict.red{ background:var(--rojo-soft); border:1px solid var(--rojo-line); }
.light{ width:34px; height:34px; border-radius:50%; flex:0 0 auto; margin-top:2px; }
.light.green{ background:var(--verde); box-shadow:0 0 0 5px var(--verde-soft),0 0 14px var(--verde); }
.light.red{ background:var(--rojo); box-shadow:0 0 0 5px var(--rojo-soft),0 0 14px var(--rojo); }
.verdict .lbl{ font-family:var(--mono); font-size:.64rem; letter-spacing:.1em; text-transform:uppercase; }
.verdict.green .lbl{ color:var(--verde); } .verdict.red .lbl{ color:var(--rojo); }
.verdict .msg{ font-weight:800; font-size:1.15rem; margin:.1rem 0; }
.verdict .why{ font-size:.86rem; color:var(--ink-2); }

.advis{ background:var(--amber-soft); border:1px solid var(--amber-line); color:var(--amber);
  border-radius:12px; padding:.8rem .9rem; font-size:.84rem; margin-bottom:1rem; }

/* Ficha */
.ficha{ display:grid; grid-template-columns:1fr 1fr; gap:.7rem; margin-bottom:1rem; }
.fi{ background:var(--panel); border:1px solid var(--line); border-radius:12px; padding:.8rem .9rem; }
.fi.wide{ grid-column:1/-1; }
.fi .t{ font-family:var(--mono); font-size:.62rem; letter-spacing:.05em; text-transform:uppercase; color:var(--brand-2); margin-bottom:.4rem; }
.fi .r{ font-size:.8rem; color:var(--ink-2); display:flex; justify-content:space-between; gap:.6rem; margin:.15rem 0; }
.fi .r b{ color:var(--ink); font-family:var(--mono); font-weight:600; text-align:right; }
.svgbox{ background:var(--panel-2); border:1px solid var(--line-2); border-radius:10px; padding:.5rem; margin-top:.6rem; }
svg text{ font-family:var(--mono); fill:var(--ink-2); }

.sectitle{ font-family:var(--mono); font-size:.66rem; letter-spacing:.06em; text-transform:uppercase;
  color:var(--ink-3); margin:1.4rem 0 .5rem; }

/* Aviso legal */
.legal{ margin-top:1.6rem; background:var(--panel); border:1px solid var(--line); border-radius:12px; padding:.4rem .9rem; }
.legal summary{ cursor:pointer; font-weight:650; font-size:.85rem; color:var(--ink-2); padding:.5rem 0; }
.legal p{ font-size:.78rem; color:var(--ink-2); line-height:1.5; margin:.4rem 0; }
.legal .legal-src{ color:var(--ink-3); font-family:var(--mono); font-size:.68rem; }

/* Print lámina */
#lamina{ display:none; }
@media print{
  @page{ size:A4 landscape; margin:9mm; }
  body{ background:#fff; } .app{ max-width:none; }
  .hdr,.actionbar,#screen-captura,.verdict,.advis,.ficha,.sectitle,.btn{ display:none !important; }
  #lamina{ display:block !important; color:#111; }
  #lamina svg rect{ fill:#EDEFF0 !important; stroke:#111 !important; }
  #lamina svg line, #lamina svg path{ stroke:#1C5E9E !important; }
  #lamina svg text{ fill:#222 !important; }
}
.lam{ border:2px solid #111; padding:12px; background:#fff; color:#111; font-family:var(--sans); }
.lam .lh{ display:flex; justify-content:space-between; border-bottom:2px solid #111; padding-bottom:6px; margin-bottom:10px; }
.lam .tt{ font-weight:800; } .lam .ss{ font-family:var(--mono); font-size:.6rem; color:#333; }
.lam .bd{ font-family:var(--mono); font-size:.56rem; border:1px solid #1C7C46; color:#1C7C46; border-radius:4px; padding:2px 6px; }
.lam .lg{ display:grid; grid-template-columns:repeat(3,1fr); gap:8px; }
.lam .lb{ border:1px solid #999; padding:6px 8px; } .lam .lb .k{ font-family:var(--mono); font-size:.54rem; text-transform:uppercase; color:#1C5E9E; }
.lam .lb .rw{ font-size:.68rem; display:flex; justify-content:space-between; } .lam .lb .rw b{ font-family:var(--mono); }
.lam .rot{ margin-top:10px; border:2px solid #111; display:grid; grid-template-columns:1.4fr 1fr 1fr; }
.lam .rot>div{ padding:6px 8px; border-right:1px solid #999; font-size:.62rem; } .lam .rot>div:last-child{ border-right:0; }
.lam .rot .k{ font-family:var(--mono); font-size:.5rem; color:#666; text-transform:uppercase; }
.lam .disc{ grid-column:1/-1; border-top:1px solid #999; border-right:0; background:#F4F1E8; }
.lam .disc .d{ font-size:.56rem; color:#5a4a20; line-height:1.35; }
.mat-in{ border:none; border-bottom:1px solid #111; font-family:var(--mono); font-size:.66rem; width:120px; background:transparent; }