:root{--paper:light-dark(#f4f6f9,#0e1622);--ink:light-dark(#14243a,#e6ecf3);--ink-2:light-dark(#3d4f66,#b4c0cf);--muted:light-dark(#5b6b80,#8494a8);--line:light-dark(#c5cfdc,#2b3a4e);--line-soft:light-dark(#dde4ec,#1e2a3a);--diagram-stroke:light-dark(#8fa3bc,#55697f);--brand:light-dark(#1a5276,#7fb3d9);--accent:#f2a23a;--accent-text:light-dark(#b86a0b,#f2a23a);--event:light-dark(#3f7cac,#6fa8d6);--ok:light-dark(#1f5c46,#5fbf95);--hover-soft:light-dark(#e6edf4,#1b2636);--grid-dot:light-dark(#d3dbe6,#1d2939);--selection-fg:#14243a;--split-1:light-dark(#14243a,#e6ecf3);--split-2:light-dark(#1a5276,#a9c4dc);--split-3:light-dark(#3f7cac,#6fa8d6);--split-4:light-dark(#8fb3d1,#3f7cac);--split-5:light-dark(#c5d6e6,#24476b);--frame-bg:light-dark(#ffffff8c,#ffffff08);--chip-bg:light-dark(#fff9,#ffffff0a);--box-fill:light-dark(#fff,#121c2b);--card-hover:light-dark(#fff,#15202f);--header-bg:light-dark(#f4f6f9d1,#0e1622d1);--gutter:clamp(20px, 4vw, 48px);--gutter-rail:clamp(72px, 10vw, 140px);--section-gap:clamp(80px, 12vh, 140px);--header-h:56px;--container:1180px;--text-body:clamp(16px, 1.25vw, 18px)}*,:before,:after{box-sizing:border-box}html{color-scheme:light dark;scrollbar-gutter:stable}html[data-theme=light]{color-scheme:light}html[data-theme=dark]{color-scheme:dark}@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}body{background-color:var(--paper);min-height:100vh;color:var(--ink);font-family:var(--font-display);-webkit-font-smoothing:antialiased;margin:0;overflow-x:clip}body:before{--edge:max(0px, calc((100vw - var(--container)) / 2));content:"";z-index:-1;pointer-events:none;background-image:radial-gradient(var(--grid-dot) 1px, transparent 1px);mask-image:linear-gradient(to right, #000 0, #000 calc(var(--edge) * .35), transparent calc(var(--edge) + 96px), transparent calc(100% - var(--edge) - 96px), #000 calc(100% - var(--edge) * .35), #000 100%);background-size:28px 28px;position:fixed;inset:0}@media (width<=720px),(prefers-contrast:more){body:before{display:none}}a{color:var(--brand)}a:hover{color:var(--ink)}::selection{background:var(--accent);color:var(--selection-fg)}h1,h2,h3,h4,p,ul{margin:0}ul{padding:0;list-style:none}svg{display:block}.mono{font-family:var(--font-mono)}.label{font-family:var(--font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);font-size:11px}.label--ink{color:var(--ink)}.label--accent{color:var(--accent-text)}.label--plain{text-transform:none}.caption{font-family:var(--font-mono);letter-spacing:.04em;color:var(--muted);font-size:11px}.body{font-size:var(--text-body);color:var(--ink-2);line-height:1.6}.pretty{text-wrap:pretty}.section{padding:0 0 var(--section-gap)}.section__title{letter-spacing:-.035em;text-wrap:pretty;font-size:clamp(34px,4.6vw,60px);font-weight:500;line-height:1.02}.section__title--narrow{max-width:22ch}.btn{border-radius:999px;align-items:center;gap:10px;padding:14px 22px;font-size:15px;font-weight:500;text-decoration:none;transition:background-color .2s,color .2s;display:inline-flex}.btn__aux{font-family:var(--font-mono)}.btn--primary{background:var(--ink);color:var(--paper)}.btn--primary:hover{background:var(--brand);color:var(--paper)}.btn--secondary{border:1px solid var(--ink);color:var(--ink);padding:13px 22px}.btn--secondary:hover{background:var(--hover-soft);color:var(--ink)}.btn--secondary.btn--invert:hover{background:var(--ink);color:var(--paper)}.card-grid{gap:1px;padding:1px;display:grid}.card-grid>*{box-shadow:0 0 0 1px var(--line)}.two-col{grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));align-items:start;gap:clamp(24px,4vw,64px);display:grid}@media (width<=720px){:root{--gutter-rail:20px}}@media (width>=1440px){:root{--container:1280px}}.diagram text{font-family:var(--font-mono);fill:var(--diagram-stroke)}.diagram__row{letter-spacing:1px;font-size:9px}.diagram__note{letter-spacing:.5px;font-size:9px}.diagram__wire{fill:none;stroke:var(--diagram-stroke);stroke-width:1.25px}.diagram__wire--dash{stroke-dasharray:3 3}.diagram__wire--thin{stroke-width:1px}.diagram__box rect{fill:var(--box-fill);stroke:var(--ink);stroke-width:1.25px}.diagram__box text{fill:var(--ink);text-anchor:middle;dominant-baseline:middle;font-size:12px}.diagram__box--main rect{fill:var(--ink)}.diagram__box--main text{fill:var(--paper)}.diagram__packet{fill:var(--accent);opacity:0}.diagram__packet--event{fill:var(--event)}@media (width<=720px){.diagram__row,.diagram__note{font-size:10px}}.legend{flex-wrap:wrap;gap:16px 20px;display:flex}.legend__cmd{color:var(--accent-text)}.legend__event{color:var(--event)}
