:root{color-scheme:dark;--bg:#080c12;--panel:#101923;--line:#304455;--ink:#e0e8ef;--muted:#a0b1bf;--cyan:#a9cfe7}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 20% 0%,#21334880,transparent 50%),var(--bg);color:var(--ink);font:15px/1.7 system-ui,sans-serif}main{max-width:1240px;margin:auto;padding:40px 24px 100px}a{color:var(--cyan)}a:hover{color:white}.explanation-nav{display:flex;gap:24px;flex-wrap:wrap;border-bottom:1px solid var(--line);padding:14px 0;margin-bottom:30px;font-size:13px}.home{margin-right:auto}[aria-current=page]{text-decoration:underline;text-underline-offset:6px}.eyebrow,.tag,code,pre{font-family:ui-monospace,Consolas,monospace}.eyebrow{text-transform:uppercase;letter-spacing:.08em;color:var(--cyan);font-size:13px}h1{font-size:clamp(34px,5.2vw,60px);line-height:1.05;letter-spacing:-.05em;margin:12px 0 20px}h1 .accent{color:var(--cyan)}.lead{max-width:900px;font-size:18px;color:#c2d0db}.meta{display:flex;gap:10px;flex-wrap:wrap;margin:24px 0 32px}.tag{border:1px solid var(--line);border-radius:99px;padding:6px 14px;font-size:12px}.layout{display:grid;grid-template-columns:1.22fr .98fr;gap:22px;margin:24px 0}.card{min-width:0;background:linear-gradient(145deg,#172331,#0c1118);border:1px solid var(--line);border-radius:16px;padding:24px;box-shadow:0 20px 60px #0005}.card h2{font-size:21px;margin:0 0 12px}.sub,figcaption{color:var(--muted);font-size:13px}.screen-container{background:#03070b;padding:12px;border:1px solid var(--line);border-radius:12px}canvas{display:block;width:100%;height:auto;image-rendering:pixelated}label{display:block;margin:12px 0}input[type=range]{width:100%;accent-color:#a9cfe7}button,select{background:#213246;color:var(--ink);border:1px solid #526d83;border-radius:6px;padding:8px 12px;font:inherit}button{cursor:pointer}pre{overflow:auto;background:#070c12;padding:16px;border-radius:8px;font-size:13px}.review-note{border-left:3px solid #7eabc8;padding:12px 18px;color:var(--muted)}.flow-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.flow-grid div{padding:16px;background:#172331;border:1px solid var(--line);border-radius:10px}.flow-grid b{display:block;color:var(--cyan)}a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid white;outline-offset:4px}@media(max-width:800px){.layout{grid-template-columns:1fr}.flow-grid{grid-template-columns:1fr 1fr}main{padding:20px 14px 60px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto}}
