:root{
  --ink:#0a0c18;
  --panel:#13172c;
  --panel-2:#1b2140;
  --bone:#ebe6f4;
  --fog:#8e95bf;
  --neon:#ff2e88;
  --sodium:#f6a623;
  --f-display:"Dela Gothic One","Arial Black",Impact,sans-serif;
  --f-letter:"Shantell Sans","Comic Sans MS","Segoe Print",cursive;
  --f-body:"Atkinson Hyperlegible","Segoe UI",system-ui,sans-serif;
  --f-mono:"IBM Plex Mono",ui-monospace,Consolas,monospace;
  color-scheme:dark;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--ink);color:var(--bone);font-family:var(--f-body);font-size:17px;line-height:1.6}
body::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:0;opacity:.07;
  background-image:radial-gradient(var(--bone) 1px,transparent 1.4px);background-size:7px 7px}
[hidden]{display:none!important}
:focus-visible{outline:3px solid var(--sodium);outline-offset:3px}
a{color:var(--sodium)}
.wrap{position:relative;z-index:1;max-width:840px;margin:0 auto;padding:28px 16px 72px}
.back{font-family:var(--f-letter);font-weight:800;text-decoration:none}
.kicker{font-family:var(--f-mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--sodium);margin:18px 0 0}
h1{font-family:var(--f-display);font-weight:400;font-size:clamp(36px,7vw,64px);line-height:.98;margin:8px 0 0;text-wrap:balance}
.lead{color:var(--fog);font-size:18px;max-width:62ch}
.sosbar{display:flex;flex-wrap:wrap;gap:10px 14px;align-items:center;margin:22px 0;padding:12px 14px;background:var(--sodium);color:var(--ink);border:3px solid var(--bone)}
.sosbar b{font-family:var(--f-display);font-weight:400;font-size:32px;line-height:1}
.sosbar span{flex:1 1 200px}
.sosbar a{color:var(--ink);font-family:var(--f-letter);font-weight:800}
.rail{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0 22px}
.rail a{font-family:var(--f-letter);font-weight:700;font-size:14.5px;text-decoration:none;color:var(--bone);border:2px solid var(--bone);border-radius:999px;padding:6px 12px}
.rail a[aria-current="page"],.rail a:hover{background:var(--sodium);border-color:var(--sodium);color:var(--ink)}
.block{background:var(--panel);border:3px solid var(--bone);padding:18px;margin:14px 0;display:grid;gap:10px}
.block h2{font-family:var(--f-display);font-weight:400;font-size:clamp(22px,3vw,30px);line-height:1.15;margin:0}
.block p,.block li{margin:0}
.block ul,.block ol{margin:0;padding-left:20px;display:grid;gap:8px}
.note{color:var(--fog);font-size:15px}
.train{border-color:var(--sodium)}
.choices{display:flex;flex-wrap:wrap;gap:8px}
.choices button,.btn{cursor:pointer;font-family:var(--f-letter);font-weight:800;font-size:15px;background:transparent;color:var(--bone);border:2px solid var(--bone);border-radius:999px;padding:8px 14px}
.choices button[aria-pressed="true"]{background:var(--sodium);border-color:var(--sodium);color:var(--ink)}
.btn{background:var(--bone);color:var(--ink);border-color:var(--ink);border-radius:10px;box-shadow:3px 3px 0 var(--sodium)}
.btn:active{transform:translate(2px,2px);box-shadow:1px 1px 0 var(--sodium)}
.clock{font-family:var(--f-display);font-size:64px;line-height:1;color:var(--sodium);margin:0}
.chosen{font-family:var(--f-letter);font-size:18px;margin:0}
.warn{background:var(--bone);color:var(--ink);padding:12px 14px;border-left:6px solid var(--sodium)}
.grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media (max-width:700px){.grid{grid-template-columns:1fr}}
.tema{display:grid;gap:6px;text-decoration:none;color:inherit;background:var(--panel);border:3px solid var(--bone);padding:16px;min-height:100%}
.tema:hover{border-color:var(--sodium)}
.tema h2{font-family:var(--f-display);font-weight:400;font-size:28px;margin:0;line-height:1.1}
.tema p{margin:0;color:var(--fog)}
.foot{margin-top:28px;color:var(--fog);font-size:14px;display:grid;gap:8px}
.foot nav{display:flex;flex-wrap:wrap;gap:14px}
.say{width:100%;background:var(--ink);color:var(--bone);border:2px solid var(--bone);border-radius:10px;padding:8px 12px;font:inherit}