/* Misma paleta y misma regla que el formulario: los colores viven aquí, con su piel clara y su oscura. */
:root{
  --brand:#009fdd;
  --ink:#12232e; --quiet:#5a6b78; --line:#dae3ea; --ground:#f2f6f9; --card:#ffffff;
  --accent:#0077a8; --accent-soft:#e4f5fc; --warm:#8a4b12; --warm-soft:#fdf1e2;
  color-scheme:light dark;
}
@media (prefers-color-scheme:dark){
  :root{
    --brand:#3fb6e8;
    --ink:#e9eff4; --quiet:#9aaebc; --line:#28394b; --ground:#0d1620; --card:#16222e;
    --accent:#3fb6e8; --accent-soft:#10303f; --warm:#f0b37a; --warm-soft:#33240f;
  }
  .limites{background:#241a10}
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--ground);color:var(--ink);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  font-size:17px;line-height:1.55;-webkit-text-size-adjust:100%}
body{max-width:760px;margin:0 auto;padding:20px 18px 60px}
.tapa{border-bottom:2px solid var(--accent);padding-bottom:18px;margin-bottom:8px}
.marca{margin:0;font-size:14px;letter-spacing:.12em;text-transform:uppercase;color:var(--accent)}
h1{font-size:31px;line-height:1.15;margin:10px 0 10px;letter-spacing:-.4px}
.lead{margin:0;color:var(--quiet);font-size:17px}
.sello{margin:16px 0 0;font-size:14px;color:var(--quiet)}
.imprimir{font:inherit;font-size:14px;border:1px solid var(--accent);background:var(--card);color:var(--accent);
  border-radius:999px;padding:7px 15px;cursor:pointer}
section{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:18px 20px;margin:16px 0;
  box-shadow:0 8px 22px rgba(27,36,52,.05)}
h2{font-size:21px;margin:2px 0 12px;letter-spacing:-.2px}
h3{font-size:17px;margin:20px 0 6px;color:var(--accent)}
p{margin:10px 0}
ul,ol{margin:10px 0;padding-left:22px}
li{margin:7px 0}
li::marker{color:var(--accent)}
b{font-weight:600}
.resumen{background:var(--accent-soft);border-color:#c9d3ef}
.resumen h2{color:var(--accent)}
.rapido li{margin:10px 0}
.nota{background:var(--warm-soft);color:var(--warm);border-radius:14px;padding:12px 15px;font-size:16px}
.dos{columns:2;column-gap:28px}
.dos li{break-inside:avoid}
table{width:100%;border-collapse:collapse;margin:14px 0;font-size:16px}
th,td{text-align:left;vertical-align:top;padding:9px 10px;border-bottom:1px solid var(--line)}
th{font-size:14px;letter-spacing:.06em;text-transform:uppercase;color:var(--quiet);font-weight:600}
td:first-child{width:52%}
.limites{background:var(--warm-soft);border-color:var(--line)}
.limites h2{color:var(--warm)}
footer{margin-top:22px;color:var(--quiet);font-size:14px;padding:0 4px}
@media (max-width:620px){
  .dos{columns:1}
  td:first-child{width:50%}
  h1{font-size:27px}
}
@media print{
  html,body{background:#fff;color:#000;font-size:11.5pt}
  body{max-width:none;padding:0}
  .imprimir{display:none}
  section{box-shadow:none;border:1px solid #ccc;margin:10px 0;padding:12px 14px}
  h2,h3{break-after:avoid}
  .resumen,.limites,.nota{background:#fff;color:#000}
  section{color:#000}
  h2{font-size:15pt}
  a[href]:after{content:""}
}

/* Capturas de la app: rejilla que da dos columnas en el teléfono y cuatro en la computadora. */
.aviso-datos{margin:8px 0 0;font-size:14px;color:var(--quiet)}
.indice{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:14px 20px;margin:16px 0}
.indice h2{font-size:17px;margin:2px 0 6px;color:var(--quiet);text-transform:uppercase;letter-spacing:.08em}
.indice ol{columns:2;column-gap:28px;margin:6px 0}
.indice li{margin:4px 0;break-inside:avoid}
a{color:var(--accent)}
.pantallas{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:16px 14px;margin:16px 0 8px}
.pantallas.una{grid-template-columns:repeat(auto-fill,minmax(130px,170px))}
.pantallas figure{margin:0}
.pantallas img{display:block;width:100%;height:auto;border-radius:14px;border:1px solid var(--line);
  box-shadow:0 6px 16px rgba(27,36,52,.10);cursor:zoom-in;background:#fff}
.pantallas figcaption{font-size:13.5px;line-height:1.35;color:var(--quiet);margin-top:7px}
.pantallas figcaption b{color:var(--ink)}
.ampliar{border:0;padding:0;background:transparent;max-width:min(94vw,470px);max-height:96vh;overflow:visible}
.ampliar:focus,.ampliar:focus-visible{outline:none}
.ampliar::backdrop{background:rgba(8,14,20,.84)}
.ampliar img{display:block;width:100%;height:auto;max-height:90vh;object-fit:contain;border-radius:16px;cursor:zoom-out}
.ampliar p{margin:8px 0 0;color:#e9eff4;font-size:14px;text-align:center}
@media (max-width:620px){.indice ol{columns:1}}
@media print{
  .indice{display:none}
  .aviso-datos{color:#000}
  .pantallas{grid-template-columns:repeat(4,1fr);gap:8px}
  .pantallas.una{grid-template-columns:repeat(4,1fr)}
  .pantallas img{box-shadow:none;border:1px solid #bbb}
  .pantallas figure{break-inside:avoid}
  .pantallas figcaption,.pantallas figcaption b{color:#000;font-size:9pt}
}