:root{color-scheme:light;--plane:#f6f3ec;--surface-1:#fffdf8;--text-primary:#1c2833;--text-secondary:#4a5765;
--muted:#7f8c9b;--border:#e2dac9;--hair:#ece4d6;--gold:#9a8535;--navy:#1a2a5e;--accent-wash:#efe6d2;
--shadow:0 1px 2px rgba(27,58,92,.06),0 2px 10px rgba(27,58,92,.07);
--display:"Space Grotesk",Inter,-apple-system,sans-serif;--body:Inter,-apple-system,system-ui,"Segoe UI",sans-serif;
--serif:"Newsreader","Iowan Old Style",Palatino,Georgia,serif;--mono:"JetBrains Mono",ui-monospace,"SF Mono",Menlo,monospace}
:root[data-theme="dark"]{color-scheme:dark;--plane:#14161a;--surface-1:#1b1e24;--text-primary:#e7e3da;
--text-secondary:#b3aea3;--muted:#8b8579;--border:#2c3037;--hair:#24272d;--gold:#c2a54e;--navy:#7ea3d8;
--accent-wash:#2b3a4a;--shadow:0 1px 2px rgba(0,0,0,.3),0 2px 10px rgba(0,0,0,.25)}
*{box-sizing:border-box}
body{margin:0;background:var(--plane);color:var(--text-primary);font:16px/1.6 var(--body)}
.wrap{max-width:1080px;margin:0 auto;padding:28px 20px 60px}
a{color:var(--navy)}
header.top{display:flex;justify-content:space-between;align-items:flex-start;gap:16px}
.eyebrow{font-family:var(--display);font-size:11px;font-weight:600;letter-spacing:.09em;text-transform:uppercase;
color:var(--gold);margin:0 0 5px}
h1{font-family:var(--display);font-weight:600;font-size:30px;line-height:1.2;margin:0 0 8px}
h1 a{color:inherit;text-decoration:none}
h2{font-family:var(--display);font-weight:600;font-size:21px;line-height:1.3;margin:0 0 10px}
h3{font-family:var(--display);font-weight:600;font-size:17px;margin:18px 0 6px}
.rule::before{content:"";display:block;width:46px;height:3px;background:var(--gold);margin-bottom:11px;border-radius:1px}
.byline{color:var(--text-secondary);font-size:14.5px;margin:0 0 14px}
.stat{font-family:var(--mono);font-size:13px;color:var(--text-secondary);margin:0 0 14px}
nav.tabs{display:flex;gap:6px;flex-wrap:wrap;border-bottom:1px solid var(--border);margin:18px 0 22px}
nav.tabs a,nav.tabs span{font-family:var(--display);font-size:14px;font-weight:600;padding:8px 14px;text-decoration:none;
color:var(--text-secondary);border-bottom:3px solid transparent;margin-bottom:-1px}
nav.tabs span{color:var(--text-primary);border-bottom-color:var(--gold)}
.caveat{background:var(--accent-wash);border-left:3px solid var(--gold);padding:10px 14px;font-size:14.5px;margin:0 0 22px}
section.card{background:var(--surface-1);border:1px solid var(--hair);box-shadow:var(--shadow);border-radius:6px;
padding:22px 24px;margin:0 0 22px}
.card p{margin:0 0 10px}
figure{margin:12px 0 8px}
figure img{width:100%;height:auto;border:1px solid var(--hair);border-radius:4px;background:#fcf6ea}
.num,code,td.n{font-family:var(--mono)}
.num{font-size:.94em}
blockquote{border-left:3px solid var(--gold);padding-left:16px;margin:10px 0;font-family:var(--serif);font-size:16.5px;line-height:1.55}
.howto{background:var(--plane);border:1px solid var(--hair);border-radius:6px;padding:14px 18px;margin:12px 0}
.howto ol{margin:6px 0 0 18px;padding:0}
.howto li{margin:0 0 6px}
details{margin:10px 0}
summary{cursor:pointer;font-family:var(--display);font-weight:600;color:var(--navy)}
table{border-collapse:collapse;width:100%;font-size:14px;margin:8px 0 14px}
th,td{text-align:left;padding:6px 8px;border-bottom:1px solid var(--hair);vertical-align:top}
th{font-family:var(--display);font-weight:600;font-size:13px;color:var(--text-secondary)}
td.n{text-align:right;white-space:nowrap}
.tablewrap{overflow-x:auto}
pre.term{background:#10141a;color:#d7dde4;font:13px/1.5 var(--mono);padding:14px 16px;border-radius:6px;overflow-x:auto}
pre.term .p{color:#7ee08a}
.icons{display:flex;gap:6px}
.icons button,.icons a{font:13px var(--mono);background:var(--surface-1);border:1px solid var(--border);color:var(--text-secondary);
border-radius:4px;padding:5px 8px;cursor:pointer;text-decoration:none}
footer.credit{border-top:1px solid var(--border);margin-top:34px;padding-top:16px;font-size:14px;color:var(--text-secondary)}
.codebook h1{font-size:24px}.codebook h2{font-size:19px;margin-top:22px}
.codebook table{display:block;overflow-x:auto}
@media (max-width:640px){h1{font-size:24px}section.card{padding:16px}header.top{flex-direction:column}
nav.tabs a,nav.tabs span{padding:8px 9px;font-size:13px}td,th{padding:5px}}