:root{
  --paper:#FCFBF9; --ground:#F4F1EB; --surface:#FFFFFF; --ink:#16130F; --ink-2:#3A342C;
  --muted:#6E665A; --faint:#928A7C; --rule:#E3DCD1; --rule-2:#CDC4B5; --rule-3:#B4A996;
  --accent:#C93A16; --accent-soft:#FBEDE8;
  --ud1:#1B5A78; --ud2:#A8442A; --ud3:#4C6A2E; --ud4:#6A4A85; --fin:#16130F;
  --ud1-s:#E7F0F4; --ud2-s:#F8EAE5; --ud3-s:#ECF1E4; --ud4-s:#F0EBF4; --fin-s:#EDEAE4;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --paper:#141210; --ground:#1B1815; --surface:#1F1C18; --ink:#F2EDE4; --ink-2:#D6CEC1;
  --muted:#9C9284; --faint:#7A7164; --rule:#2E2A24; --rule-2:#413B32; --rule-3:#57503F;
  --accent:#F26B42; --accent-soft:#33211A;
  --ud1:#6FB3D0; --ud2:#E28565; --ud3:#96BC67; --ud4:#B393CC; --fin:#F2EDE4;
  --ud1-s:#152A33; --ud2-s:#331F17; --ud3-s:#1E2A16; --ud4-s:#261E30; --fin-s:#26221D;
}}
:root[data-theme="dark"]{
  --paper:#141210; --ground:#1B1815; --surface:#1F1C18; --ink:#F2EDE4; --ink-2:#D6CEC1;
  --muted:#9C9284; --faint:#7A7164; --rule:#2E2A24; --rule-2:#413B32; --rule-3:#57503F;
  --accent:#F26B42; --accent-soft:#33211A;
  --ud1:#6FB3D0; --ud2:#E28565; --ud3:#96BC67; --ud4:#B393CC; --fin:#F2EDE4;
  --ud1-s:#152A33; --ud2-s:#331F17; --ud3-s:#1E2A16; --ud4-s:#261E30; --fin-s:#26221D;
}
*{box-sizing:border-box}
body{margin:0;background:var(--paper);color:var(--ink);
  font-family:"Newsreader",ui-serif,Georgia,serif;-webkit-font-smoothing:antialiased}
h1,h2,h3{font-family:"Archivo",system-ui,sans-serif;margin:0;font-weight:700;
  letter-spacing:-.02em;line-height:1.1;text-wrap:balance}
p{margin:0} ul,ol{margin:0;padding:0}
button{font-family:"Archivo",sans-serif;cursor:pointer}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.ink-ud1{--c:var(--ud1);--cs:var(--ud1-s)} .ink-ud2{--c:var(--ud2);--cs:var(--ud2-s)}
.ink-ud3{--c:var(--ud3);--cs:var(--ud3-s)} .ink-ud4{--c:var(--ud4);--cs:var(--ud4-s)}
.ink-fin{--c:var(--fin);--cs:var(--fin-s)}

/* ── barra ───────────────────────────────────────────────────────────── */
.bar{position:fixed;inset:0 0 auto 0;height:52px;z-index:50;display:flex;align-items:center;
  gap:14px;padding:0 16px;background:var(--paper);border-bottom:1px solid var(--rule)}
.bar b{font-family:"Archivo",sans-serif;font-size:12px;font-weight:800;letter-spacing:.02em}
.bar .sep{width:1px;height:20px;background:var(--rule-2);flex:none}
.bar-t{font-family:"Archivo",sans-serif;font-size:12.5px;font-weight:600;color:var(--muted);
  flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bar-c{font-family:"IBM Plex Mono",monospace;font-size:11px;color:var(--faint);
  font-variant-numeric:tabular-nums;white-space:nowrap}
.bt{background:none;border:1px solid var(--rule-2);color:var(--muted);font-size:11px;
  font-weight:600;padding:5px 10px;border-radius:99px;white-space:nowrap;transition:.12s}
.bt:hover{border-color:var(--ink);color:var(--ink)}
.bt.pri{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.bt[disabled]{opacity:.35;cursor:default}

/* ── índice ──────────────────────────────────────────────────────────── */
.ix{padding:80px clamp(16px,4vw,52px) 90px;max-width:1280px;margin:0 auto}
.ix-h{margin-bottom:34px}
.ix-h .eyeb{color:var(--accent)}
.ix-h h1{font-size:clamp(28px,4.4vw,44px);font-weight:800;letter-spacing:-.035em;margin-top:10px;
  max-width:18ch}
.ix-h p{font-size:16px;color:var(--muted);max-width:64ch;margin-top:12px;line-height:1.55}
.keys{display:flex;gap:7px;flex-wrap:wrap;margin-top:18px}
.keys span{font-family:"IBM Plex Mono",monospace;font-size:10px;color:var(--faint);
  border:1px solid var(--rule);padding:3px 8px;border-radius:3px}
.keys kbd{font-family:"IBM Plex Mono",monospace;color:var(--ink);font-weight:600}
.ixw{margin-top:26px}
.ixw-h{display:flex;gap:11px;align-items:baseline;border-bottom:1.5px solid var(--ink);
  padding-bottom:6px}
.ixw-n{font-family:"Archivo",sans-serif;font-weight:800;font-size:12px}
.ixw-r{font-family:"IBM Plex Mono",monospace;font-size:10.5px;color:var(--muted)}
.ixg{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:9px;margin-top:11px}
.ixc{text-align:left;background:var(--surface);border:1px solid var(--rule);
  border-left:3px solid var(--c);padding:12px 14px;border-radius:3px;display:grid;
  grid-template-columns:auto 1fr;gap:2px 10px;transition:.12s;color:var(--ink)}
.ixc:hover{border-color:var(--c);background:var(--cs);transform:translateY(-1px)}
.ixc-n{font-family:"Archivo",sans-serif;font-weight:800;font-size:16px;color:var(--c);
  grid-row:span 2;line-height:1}
.ixc-e{position:absolute;margin-left:-14px;color:var(--accent);font-size:9px}
.ixc-t{font-family:"Archivo",sans-serif;font-weight:600;font-size:13px;letter-spacing:-.012em;
  line-height:1.25}
.ixc-m{font-family:"IBM Plex Mono",monospace;font-size:9.5px;color:var(--faint)}

/* ── escenario ───────────────────────────────────────────────────────── */
.play{position:fixed;inset:52px 0 0 0;display:flex;align-items:center;justify-content:center;
  background:var(--ground);padding:16px}
.stage{position:relative;width:min(100%,calc((100vh - 100px) * 16 / 9));aspect-ratio:16/9;
  background:var(--paper);border:1px solid var(--rule-2);container-type:size;overflow:hidden}
.deck[hidden]{display:none}
.sl{position:absolute;inset:0;padding:6.2cqw 7cqw 5.4cqw;display:none;
  flex-direction:column;justify-content:center;gap:2.4cqh}
.sl:has(.nota){padding-bottom:12cqh}
.sl.on{display:flex}
.sl::after{content:"";position:absolute;left:0;top:0;width:100%;height:.55cqh;background:var(--c)}
.mid{margin:auto 0;display:flex;flex-direction:column;gap:2cqh}

.eyeb{font-family:"IBM Plex Mono",monospace;font-size:1.45cqw;letter-spacing:.16em;
  text-transform:uppercase;color:var(--faint)}
.sl h1{font-size:5.1cqw;font-weight:800;letter-spacing:-.035em;max-width:19ch}
.sl h2{font-size:3.7cqw;font-weight:700;letter-spacing:-.028em;max-width:24ch;color:var(--ink)}
.sl h3{font-size:2.1cqw;font-weight:700;letter-spacing:-.01em;color:var(--c)}
.nota{position:absolute;left:7cqw;right:7cqw;bottom:4.4cqh;margin:0;
  font-size:1.75cqw;color:var(--muted);font-style:italic;
  border-top:1px solid var(--rule);padding-top:1.5cqh;line-height:1.45;max-width:74ch}

/* portada */
.pt-ud{font-family:"IBM Plex Mono",monospace;font-size:1.5cqw;letter-spacing:.14em;
  text-transform:uppercase;color:var(--c)}
.pt-r{display:flex;gap:2.6cqw;align-items:flex-start}
.pt-n{font-family:"Archivo",sans-serif;font-weight:800;font-size:8.5cqw;color:var(--c);
  line-height:.82;letter-spacing:-.05em;flex:none}
.pt-m{font-family:"IBM Plex Mono",monospace;font-size:1.85cqw;color:var(--muted);
  border-top:1px solid var(--rule);padding-top:1.8cqh}
.pt-t{font-family:"IBM Plex Mono",monospace;font-size:1.6cqw;color:var(--faint)}
.pt-ent{font-family:"Archivo",sans-serif;font-size:1.7cqw;font-weight:700;letter-spacing:.06em;
  text-transform:uppercase;color:var(--accent)}

/* idea y pregunta */
.idea-t{font-family:"Archivo",sans-serif;font-size:5.2cqw;font-weight:700;letter-spacing:-.035em;
  line-height:1.08;max-width:20ch;text-wrap:balance}
.preg-t{font-family:"Archivo",sans-serif;font-size:4.3cqw;font-weight:700;letter-spacing:-.03em;
  line-height:1.1;max-width:22ch;color:var(--c)}
.idea-s{font-size:2.3cqw;color:var(--ink-2);max-width:52ch;line-height:1.5}

/* listas */
.big,.bul,.num,.chk,.ref{list-style:none;display:flex;flex-direction:column}
.big li,.bul li,.num li,.chk li,.ref li{position:relative}
.d1{gap:1.9cqh;font-size:2.55cqw}
.d2{gap:1.45cqh;font-size:2.15cqw}
.d3{display:block;columns:2;column-gap:3.2cqw;font-size:1.92cqw}
.d3 li{break-inside:avoid;margin-bottom:1.15cqh}
.d3 li:last-child{margin-bottom:0}
.big li,.bul li,.num li,.chk li{padding-left:2.5cqw;line-height:1.38;color:var(--ink-2);max-width:52ch}
.d3 li{max-width:none}
.big.d3,.bul.d3,.chk.d3,.num.d3{display:block}
.bul li::before{content:"";position:absolute;left:0;top:.62em;width:1.3cqw;height:.14cqw;
  background:var(--c)}
.big li::before{content:"";position:absolute;left:0;top:.55em;width:.9cqw;height:.9cqw;
  border-radius:50%;background:var(--c)}
.chk li::before{content:"";position:absolute;left:0;top:.34em;width:1.2cqw;height:1.2cqw;
  border:.16cqw solid var(--c);border-radius:.2cqw}
.num{counter-reset:s}
.num li{padding-left:3.2cqw}
.num li::before{content:counter(s,decimal-leading-zero);counter-increment:s;position:absolute;
  left:0;top:.16em;font-family:"IBM Plex Mono",monospace;font-size:.66em;color:var(--c);font-weight:600}
.ref li{padding-left:0;display:flex;flex-direction:column;gap:.25cqh}
.ref b{font-family:"Archivo",sans-serif;font-weight:700;color:var(--ink);
  display:flex;align-items:baseline;gap:.8cqw;flex-wrap:wrap}
.ref b a{color:var(--ink);text-decoration:none;border-bottom:.12cqw solid var(--c)}
.ref b a:hover{color:var(--c)}
.ref-u{font-family:"IBM Plex Mono",monospace;font-size:.62em;font-style:normal;color:var(--faint);
  font-weight:400}
.ref span{font-size:.78em;color:var(--muted);line-height:1.35}

/* dos columnas */
.two{display:grid;grid-template-columns:1fr 1fr;gap:3.4cqw}
.cl ul{list-style:none;display:flex;flex-direction:column;gap:1.2cqh;margin-top:1.6cqh}
.cl li{font-size:2.05cqw;color:var(--ink-2);line-height:1.38;padding-left:2.2cqw;position:relative}
.cl li::before{content:"";position:absolute;left:0;top:.62em;width:1.1cqw;height:.14cqw;
  background:var(--rule-3)}
.cie .cl h3{color:var(--ink)}
.cie .cl:last-child h3{color:var(--accent)}

/* tabla */
.tb{overflow:hidden}
.tb table{border-collapse:collapse;width:100%}
.tb th,.tb td{text-align:left;padding:.9cqh 1.4cqw;border-bottom:1px solid var(--rule);
  vertical-align:top;line-height:1.32}
.tb thead th{font-family:"Archivo",sans-serif;letter-spacing:.06em;text-transform:uppercase;
  color:var(--faint);font-weight:700;border-bottom:.2cqw solid var(--c);white-space:nowrap}
.tb tbody td:first-child{font-family:"Archivo",sans-serif;font-weight:700;color:var(--ink)}
.t1 th,.t1 td{font-size:2.05cqw} .t1 thead th{font-size:1.5cqw}
.t2 th,.t2 td{font-size:1.8cqw} .t2 thead th{font-size:1.35cqw}
.t3 th,.t3 td{font-size:1.55cqw;padding:.62cqh 1.2cqw} .t3 thead th{font-size:1.2cqw}

/* ejercicio */
.enc{font-size:2.4cqw;color:var(--ink-2);max-width:50ch;line-height:1.4}
.ejr{display:grid;grid-template-columns:1.55fr 1fr;gap:3cqw;margin-top:1cqh;
  border-top:1px solid var(--rule);padding-top:2cqh}
.ejr ul{list-style:none;display:flex;flex-direction:column;gap:1cqh;margin-top:1.1cqh}
.ejr li{font-size:1.9cqw;color:var(--ink-2);padding-left:2cqw;position:relative;line-height:1.35}
.ejr li::before{content:"—";position:absolute;left:0;color:var(--c)}
.lb{font-family:"IBM Plex Mono",monospace;font-size:1.3cqw;letter-spacing:.12em;
  text-transform:uppercase;color:var(--faint)}
.ejm{display:flex;flex-direction:column;gap:2.2cqh}
.ejm p{font-family:"Archivo",sans-serif;font-weight:700;font-size:2.15cqw;margin-top:.7cqh;
  color:var(--c);letter-spacing:-.015em;line-height:1.2}

/* barra de progreso */
.prog{position:fixed;left:0;bottom:0;height:3px;background:var(--c,var(--accent));z-index:60;
  transition:width .18s}
.hint{position:fixed;right:14px;bottom:12px;z-index:55;font-family:"IBM Plex Mono",monospace;
  font-size:10px;color:var(--faint);background:var(--paper);padding:3px 8px;border-radius:3px;
  border:1px solid var(--rule)}

@media (max-width:720px){
  .bar{gap:8px;padding:0 10px} .bar-t{display:none}
  .stage{width:100%}
  .d3{columns:1}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}

@media print{
  @page{size:A4 landscape;margin:9mm}
  .bar,.prog,.hint,.ix{display:none!important}
  .play{position:static;display:block;padding:0;background:#fff;inset:auto}
  .stage{width:100%;border:0;aspect-ratio:auto;container-type:inline-size}
  .deck[hidden]{display:none}
  .sl{position:static;display:flex!important;break-after:page;border:1px solid #ccc;
    aspect-ratio:16/9;margin-bottom:6mm;background:#fff;color:#000}
  .sl:last-child{break-after:auto}
}