@font-face{font-family:'Pixelify Sans';font-weight:400 700;font-display:swap;src:url(/fonts/pixelify.woff2) format('woff2')}
@font-face{font-family:'Atkinson Hyperlegible';font-weight:400;font-display:swap;src:url(/fonts/atkinson-400.woff2) format('woff2')}
@font-face{font-family:'Atkinson Hyperlegible';font-weight:700;font-display:swap;src:url(/fonts/atkinson-700.woff2) format('woff2')}
@font-face{font-family:'Atkinson Hyperlegible';font-style:italic;font-weight:400;font-display:swap;src:url(/fonts/atkinson-400i.woff2) format('woff2')}

:root{--night:#0e0b1f;--panel:#17122e;--line:rgba(243,236,255,.14);--ink:#f3ecff;--muted:#b6aad6;--ember:#ffb347;--ember-hot:#ff6a2b;--ember-deep:#8a2a14;--crystal:#7fe6f2;
--f-display:'Pixelify Sans','Courier New',ui-monospace,monospace;--f-body:'Atkinson Hyperlegible',system-ui,-apple-system,'Segoe UI',sans-serif;color-scheme:dark}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:radial-gradient(120% 50% at 80% 0%,#241a42,transparent 60%),var(--night);color:var(--ink);font-family:var(--f-body);font-size:18px;line-height:1.7}
a{color:var(--ember)}
a:hover{color:#ffc266}
:focus-visible{outline:3px solid var(--ink);outline-offset:3px}
img{max-width:100%;height:auto}
.top{position:sticky;top:0;z-index:5;display:flex;align-items:center;gap:20px;flex-wrap:wrap;padding:14px clamp(16px,4vw,48px);background:rgba(14,11,31,.94);border-bottom:1px solid var(--line)}
.brand{font-family:var(--f-display);font-weight:700;font-size:22px;letter-spacing:.06em;color:var(--ember);text-decoration:none;text-shadow:2px 2px 0 var(--ember-deep)}
.top nav{display:flex;gap:6px 18px;flex-wrap:wrap;margin-left:auto}
.top nav a{color:var(--ink);text-decoration:none;font-size:15px;opacity:.85}
.top nav a:hover,.top nav a[aria-current="page"]{opacity:1;color:var(--ember)}
.play{font-family:var(--f-display);font-weight:700;font-size:15px;padding:7px 14px;border-radius:4px;background:var(--ember);color:#2a0d14!important;text-decoration:none;box-shadow:0 3px 0 var(--ember-deep)}
main{padding:clamp(28px,6vw,64px) clamp(16px,4vw,48px) 64px}
article{max-width:72ch;margin:0 auto}
.kicker{font-family:var(--f-display);font-weight:500;font-size:14px;letter-spacing:.14em;text-transform:uppercase;color:var(--crystal)}
h1{margin:.2em 0 .4em;font-family:var(--f-display);font-weight:700;font-size:clamp(36px,6vw,58px);line-height:1.02;color:var(--ember);text-shadow:4px 4px 0 var(--ember-deep);text-wrap:balance}
h2{margin:2em 0 .5em;font-family:var(--f-display);font-weight:700;font-size:clamp(25px,3.4vw,32px);line-height:1.15;color:var(--ink);text-wrap:balance}
h3{margin:1.6em 0 .3em;font-family:var(--f-display);font-weight:700;font-size:21px;color:var(--ember)}
.lead{font-size:1.15em;color:var(--ink)}
.meta{font-size:14px;color:var(--muted)}
p,li{color:#e4dcf6}
ul,ol{padding-left:1.3em}
li{margin:.25em 0}
figure{margin:1.6em 0}
figure img{display:block;border-radius:4px;border:1px solid var(--line)}
figcaption{font-size:14px;color:var(--muted);margin-top:.5em}
table{width:100%;border-collapse:collapse;font-size:16px;font-variant-numeric:tabular-nums}
.tbl{overflow-x:auto;margin:1.2em 0}
th,td{text-align:left;padding:8px 10px;border-bottom:1px solid var(--line);vertical-align:top}
th{font-family:var(--f-display);font-weight:600;color:var(--crystal);font-size:15px}
.box{background:var(--panel);border:1px solid var(--line);border-radius:6px;padding:18px 22px;margin:1.6em 0}
.box p:first-child{margin-top:0}.box p:last-child{margin-bottom:0}
.toc{columns:2;column-gap:28px;padding-left:1.1em}
@media (max-width:600px){.toc{columns:1}}
kbd{font-family:var(--f-display);font-size:.85em;background:rgba(243,236,255,.08);border:1px solid var(--line);border-bottom-width:2px;border-radius:3px;padding:0 6px}
mark.pend{background:#ffd23f;color:#2a0d14;padding:0 4px;border-radius:2px;font-weight:700}
.cta{display:inline-block;margin-top:.5em;font-family:var(--f-display);font-weight:700;font-size:18px;padding:11px 22px;border-radius:4px;background:var(--ember);color:#2a0d14;text-decoration:none;box-shadow:0 4px 0 var(--ember-deep)}
.more{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px;margin-top:1em}
.more a{display:block;padding:14px 16px;border:1px solid var(--line);border-radius:6px;background:var(--panel);text-decoration:none;color:var(--ink)}
.more a strong{display:block;font-family:var(--f-display);color:var(--ember)}
.more a span{font-size:15px;color:var(--muted)}
footer{border-top:1px solid var(--line);background:rgba(14,11,31,.94);padding:28px clamp(16px,4vw,48px);font-size:14px;color:var(--muted)}
footer .cols{display:flex;flex-wrap:wrap;gap:10px 28px;justify-content:space-between;max-width:1100px;margin:0 auto}
footer nav{display:flex;flex-wrap:wrap;gap:6px 16px}
footer a{color:var(--muted)}
footer a:hover{color:var(--ember)}
