:root{
  --paper:#EEF0EC; --card:#F8F9F6; --ink:#14181D; --muted:#4A535C; --line:#C9CEC6;
  --accent:#1D4F91; --accent-ink:#F8F9F6; --tile:#1B2229; --tile-ink:#E9EEF2; --tile-dim:#9FB0BE;
  --go:#1E7A3C; --go-bg:#DCEFE1; --warn:#8A5A00; --warn-bg:#F6E7C4; --stop:#A32222; --stop-bg:#F5D9D6;
  --code:#E3E6E0;
  --display:"Bricolage Grotesque", "Avenir Next", "Helvetica Neue", sans-serif;
  --body:"IBM Plex Sans", "Helvetica Neue", Helvetica, sans-serif;
  --mono:"IBM Plex Mono", ui-monospace, Menlo, monospace;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  color-scheme:dark; --paper:#121519; --card:#1A1F25; --ink:#E6E9EC; --muted:#A3ADB7; --line:#2F3740;
  --accent:#7FAEEA; --accent-ink:#0E1216; --tile:#0B0E11; --tile-ink:#E9EEF2; --tile-dim:#8A9AA8;
  --go:#6FD08F; --go-bg:#173022; --warn:#F0C062; --warn-bg:#352A12; --stop:#F08A80; --stop-bg:#3A1A18; --code:#232A31;
}}
:root[data-theme="dark"]{
  color-scheme:dark; --paper:#121519; --card:#1A1F25; --ink:#E6E9EC; --muted:#A3ADB7; --line:#2F3740;
  --accent:#7FAEEA; --accent-ink:#0E1216; --tile:#0B0E11; --tile-ink:#E9EEF2; --tile-dim:#8A9AA8;
  --go:#6FD08F; --go-bg:#173022; --warn:#F0C062; --warn-bg:#352A12; --stop:#F08A80; --stop-bg:#3A1A18; --code:#232A31;
}
*{box-sizing:border-box}
body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.5 var(--body);padding-inline:clamp(16px,4vw,56px);padding-block:28px 72px}
main{max-width:1180px;margin-inline:auto}
a{color:var(--accent);text-underline-offset:3px}
a:focus-visible,button:focus-visible{outline:3px solid var(--accent);outline-offset:3px;border-radius:4px}
h1,h2,h3{font-family:var(--display);line-height:1.15;margin:0}
h2{font-size:clamp(1.35rem,2.4vw,1.75rem);margin:48px 0 14px;font-weight:700}
h3{font-size:1.1rem;margin:26px 0 8px}
.crumb{font:500 13px/1 var(--mono);color:var(--muted);margin:0 0 14px}
.tile{background:var(--tile);color:var(--tile-ink);border-radius:6px;padding:clamp(22px,4vw,44px);position:relative;overflow:hidden}
.tile::after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(0deg,rgba(255,255,255,.025) 0 1px,transparent 1px 3px);pointer-events:none}
.osd{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font:500 13px/1 var(--mono);color:var(--tile-dim);margin-bottom:22px;letter-spacing:.04em}
.osd .rec::before{content:"";display:inline-block;width:9px;height:9px;border-radius:50%;background:#E5483B;margin-right:8px;vertical-align:0}
.answer{font:700 clamp(1.7rem,4.4vw,3.1rem)/1.12 var(--display);margin:0;max-width:24ch}
.answer em{font-style:normal;color:#8CC2FF}
.sub{margin:18px 0 0;color:var(--tile-dim);max-width:60ch;font-size:1.02rem}
.btns{display:flex;flex-wrap:wrap;gap:10px;margin-top:26px;position:relative;z-index:1}
.btn{display:inline-flex;align-items:center;min-height:44px;padding:0 18px;border-radius:4px;font-weight:600;text-decoration:none;border:1.5px solid #5B6B79;color:var(--tile-ink)}
.btn.primary{background:#E9EEF2;color:#14181D;border-color:#E9EEF2}
.btn:hover{border-color:#E9EEF2}
.tablewrap{overflow-x:auto;border:1px solid var(--line);border-radius:6px;background:var(--card)}
table{border-collapse:collapse;width:100%;min-width:640px}
th,td{text-align:left;padding:12px 14px;border-bottom:1px solid var(--line);vertical-align:top}
th{font:600 12px/1.2 var(--mono);color:var(--muted);letter-spacing:.06em;text-transform:uppercase}
tr:last-child td{border-bottom:0}
td.num{font-variant-numeric:tabular-nums;font-family:var(--mono);white-space:nowrap}
.light{display:inline-block;font:600 13px/1 var(--body);padding:6px 10px;border-radius:3px;white-space:nowrap}
.go{background:var(--go-bg);color:var(--go)} .warn{background:var(--warn-bg);color:var(--warn)} .stop{background:var(--stop-bg);color:var(--stop)}
.tag{display:inline-block;font:600 11px/1 var(--mono);letter-spacing:.06em;padding:4px 6px;border-radius:3px;border:1px solid var(--line);color:var(--muted);vertical-align:1px;margin-right:6px;text-transform:uppercase}
.tag.fact{border-color:var(--go);color:var(--go)} .tag.inf{border-color:var(--warn);color:var(--warn)} .tag.sec{border-color:var(--accent);color:var(--accent)}
ul.lines,ol.steps{padding:0;margin:0;list-style:none;display:grid;gap:10px}
ul.lines li,ol.steps li{background:var(--card);border:1px solid var(--line);border-radius:6px;padding:12px 14px;max-width:100%}
ol.steps{counter-reset:s}
ol.steps li{counter-increment:s;display:grid;grid-template-columns:2.2rem 1fr;gap:10px;align-items:start}
ol.steps li::before{content:counter(s);font:700 1.3rem/1 var(--display);color:var(--accent)}
.check li{display:flex;gap:12px;align-items:flex-start}
.box{flex:none;width:20px;height:20px;border:2px solid var(--muted);border-radius:3px;margin-top:2px}
.note{color:var(--muted);font-size:.92rem;margin:10px 0 0}
code{font-family:var(--mono);font-size:.88em;background:var(--code);padding:1px 5px;border-radius:3px;overflow-wrap:anywhere}
pre{background:var(--code);padding:14px;border-radius:6px;overflow-x:auto;font:14px/1.5 var(--mono)}
pre code{background:none;padding:0}
.sources{columns:2 360px;column-gap:28px;padding-left:1.2em;margin:0}
.sources li{break-inside:avoid;margin:0 0 8px;overflow-wrap:anywhere}
.doc{max-width:900px}
.doc p,.doc li{max-width:75ch}
.doc ul,.doc ol{padding-left:1.3em}
.doc li{margin:0 0 10px;overflow-wrap:anywhere}
.doc li a{overflow-wrap:anywhere}
.doc h1{font-size:clamp(1.8rem,4vw,2.6rem);margin:22px 0 10px}
footer{margin-top:56px;color:var(--muted);font:13px/1.4 var(--mono)}
@media (prefers-reduced-motion: reduce){*{transition:none!important;animation:none!important}}
