:root{
  --bg:#0E0D0B; --surface:#171512; --raised:#221F1B; --line:#36312B;
  --text:#F5F2EB; --muted:#A9A193; --accent:#FF5B14; --on-accent:#0E0D0B;
  --sans:-apple-system,BlinkMacSystemFont,"Segoe UI Variable Text","Segoe UI",Inter,Roboto,"Helvetica Neue",Arial,sans-serif;
  --mono:ui-monospace,"SF Mono","Cascadia Mono","Segoe UI Mono",Menlo,Consolas,"DejaVu Sans Mono",monospace;
  --gutter:clamp(20px,4vw,64px); --max:1312px; --section:clamp(72px,9vw,152px);
  --r-2:8px; --r-3:14px; --pill:999px;
  --ease:cubic-bezier(.2,.9,.1,1);
  color-scheme:dark;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--text);font:400 clamp(1rem,.96rem + .2vw,1.125rem)/1.6 var(--sans);letter-spacing:-.006em;-webkit-font-smoothing:antialiased}
a{color:inherit;text-underline-offset:.18em;text-decoration-thickness:1px}
a:hover{color:var(--accent)}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:4px}
svg{display:block}
.wrap{width:min(100% - 2*var(--gutter),var(--max));margin-inline:auto}
.label{font:500 .75rem/1.4 var(--mono);text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin:0}
.label b{color:var(--accent);font-weight:inherit}
.band h2.label{font:500 .75rem/1.4 var(--mono);letter-spacing:.08em;margin:0;max-width:none}
.nw{white-space:nowrap}
.skip{position:absolute;left:-9999px}.skip:focus{left:16px;top:16px;z-index:9;background:var(--accent);color:var(--on-accent);padding:8px 16px}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.nav{border-bottom:1px solid var(--line);position:relative;z-index:2}
.nav .wrap{display:flex;align-items:center;gap:28px;height:72px}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;margin-right:auto}
.brand svg{width:32px;height:32px}
.brand b{display:block;font-weight:750;font-size:1.0625rem;letter-spacing:-.02em;line-height:1.15}
.brand small{display:block;font-size:.75rem;color:var(--muted);font-weight:500}
.nav ul{display:flex;gap:24px;list-style:none;margin:0;padding:0}
.nav ul a{text-decoration:none;font-size:.875rem;font-weight:500;color:var(--muted);white-space:nowrap}
.nav ul a:hover{color:var(--text)}
.btn{display:inline-flex;align-items:center;justify-content:space-between;gap:14px;min-height:52px;padding:0 24px;border-radius:var(--pill);
  border:1.5px solid var(--line);font-weight:640;text-decoration:none;transition:transform .12s var(--ease)}
.btn:hover{transform:translateX(3px);color:var(--text)}
.btn.primary{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}
.btn.primary:hover{color:var(--on-accent)}
.btn.sm{min-height:40px;padding:0 16px;font-size:.875rem;white-space:nowrap;justify-content:center;gap:8px}
.btn i{font-style:normal;font-family:var(--mono)}
.hero{position:relative;overflow:hidden;border-bottom:1px solid var(--line)}
.stream{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;
  -webkit-mask-image:linear-gradient(90deg,transparent 5%,#000 55%);mask-image:linear-gradient(90deg,transparent 5%,#000 55%)}
.stream g{animation:drift 9s linear infinite}
@keyframes drift{from{transform:translateX(-120px)}to{transform:translateX(120px)}}
.hero .wrap{position:relative;padding-block:clamp(48px,8vw,112px) clamp(48px,6vw,88px)}
.hero h1{font-size:clamp(2.125rem,.9rem + 4.9vw,5.25rem);font-weight:850;line-height:1.02;letter-spacing:-.042em;margin:22px 0 0;max-width:15.5em}
.hero h1 .speed{color:var(--accent)}
.cursor{display:inline-block;width:.42em;height:.78em;background:var(--accent);vertical-align:-.04em;margin-left:.08em;animation:blink 1.1s steps(1) infinite}
@keyframes blink{50%{opacity:0}}
.hero .row{display:flex;flex-wrap:wrap;align-items:center;gap:14px;margin-top:clamp(32px,4vw,56px)}
.hero .by{margin:0 0 0 8px;font-size:.875rem;color:var(--muted)}
.hero .by b{color:var(--text);font-weight:640}
section{scroll-margin-top:16px}
.band{padding-block:var(--section);border-bottom:1px solid var(--line)}
.band h2{font-size:clamp(1.75rem,1.3rem + 1.9vw,2.75rem);font-weight:780;line-height:1.12;letter-spacing:-.028em;margin:14px 0 0;max-width:22em}
.thesis{background:var(--surface)}
.thesis blockquote{margin:16px 0 0;font-size:clamp(2rem,1.2rem + 3.6vw,4.25rem);font-weight:800;line-height:1.06;letter-spacing:-.04em;max-width:17em}
.thesis blockquote p{margin:0}
.thesis blockquote p::before{content:"\201C";color:var(--accent)}.thesis blockquote p::after{content:"\201D";color:var(--accent)}
.thesis cite{display:block;margin-top:20px;font:500 .875rem var(--sans);color:var(--muted);letter-spacing:0}
.def{display:grid;grid-template-columns:auto 1fr;gap:20px;margin-top:clamp(40px,5vw,72px);padding-top:28px;border-top:1px solid var(--line);max-width:62rem}
.def .bar{width:6px;border-radius:3px;background:var(--accent)}
.def h3{margin:0 0 10px;font:500 .75rem/1.4 var(--mono);text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}
.def p{margin:0;font-size:clamp(1.125rem,1.05rem + .4vw,1.375rem);line-height:1.5}
.def a{display:inline-block;margin-top:12px;font:500 .875rem var(--mono);color:var(--accent);text-decoration:none}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:40px;list-style:none;padding:0}
.card{position:relative;display:flex;flex-direction:column;gap:12px;padding:36px 24px 24px;border:1px solid var(--line);border-radius:var(--r-3);background:var(--surface)}
.card::before{content:"";position:absolute;top:0;left:24px;width:calc((100% - 48px) * var(--lane,.33));height:4px;border-radius:0 0 4px 4px;background:var(--accent)}
.card .n{font:600 .875rem var(--mono);color:var(--accent)}
.card h3{margin:0;font-size:clamp(1.375rem,1.2rem + .8vw,1.75rem);font-weight:780;line-height:1.12;letter-spacing:-.025em}
.card p{margin:0;color:var(--muted)}
.card ul{margin:0;padding-left:1.1em;color:var(--muted)}
.card .fact{margin-top:auto;padding-top:16px;border-top:1px solid var(--line);font-weight:640}
.card .fact small{display:block;font-weight:400;color:var(--muted);font-size:.875rem}
.card a.go{font:600 .875rem var(--mono);color:var(--accent);text-decoration:none}
.card a.go:hover{text-decoration:underline}
.mani{position:relative;overflow:hidden}
.mani .title{font-size:clamp(3.5rem,.8rem + 11vw,10.5rem);font-weight:900;letter-spacing:-.055em;line-height:.9;margin:18px 0 0}
.mani .title em{font-style:normal;color:var(--accent)}
.mani .grid{display:grid;grid-template-columns:220px minmax(0,1fr);gap:64px;margin-top:clamp(40px,5vw,72px)}
.mani .intro{margin:0;color:var(--muted);font-size:.9375rem;line-height:1.55}
.mani .text{margin:0;max-width:34em;font-size:clamp(1.25rem,1.05rem + .9vw,1.75rem);line-height:1.5;font-weight:500;letter-spacing:-.012em}
.mani .text p{margin:0 0 1em}
.sig{display:flex;align-items:center;gap:16px;margin-top:40px}
.sig span{width:72px;height:3px;background:var(--accent)}
.sig cite{font-style:normal;font-size:clamp(1.25rem,1.1rem + .6vw,1.75rem);font-weight:850;letter-spacing:-.025em}
.formula{background:var(--surface)}
.eq{margin:20px 0 0;font:800 clamp(1.75rem,.4rem + 4.6vw,4.5rem)/1.05 var(--mono);letter-spacing:-.04em;word-spacing:-.12em}
.eq .op{color:var(--accent)}
.mix{display:flex;gap:4px;height:56px;margin-top:40px;border-radius:var(--r-2);overflow:hidden;max-width:62rem}
.mix .hi,.mix .ai{display:flex;align-items:center;padding:0 16px;font:700 .875rem var(--mono);white-space:nowrap}
.mix .hi{background:var(--text);color:var(--bg);width:46%;animation:mix 10s var(--ease) infinite alternate}
.mix .ai{background:var(--accent);color:var(--on-accent);flex:1;justify-content:flex-end}
@keyframes mix{0%{width:64%}50%{width:30%}100%{width:46%}}
.formula .key{max-width:44em;margin:20px 0 0;color:var(--muted)}
.formula .key b{color:var(--text)}
.guide h2{max-width:20em}
.guide .lead{max-width:40em;margin:20px 0 0;color:var(--muted);font-size:clamp(1.0625rem,1rem + .3vw,1.25rem)}
.textlink{display:inline-block;margin-top:8px;color:var(--text);font-weight:560;text-decoration:underline;text-decoration-color:var(--line);text-decoration-thickness:2px;text-underline-offset:.3em}
.textlink:hover{color:var(--text);text-decoration-color:var(--text)}
.aq{margin:28px 0 0;padding-left:20px;border-left:2px solid var(--line);max-width:44em}
.aq p{margin:0;font-size:clamp(1.0625rem,1rem + .45vw,1.375rem);line-height:1.45;font-style:italic;font-weight:500;color:var(--text)}
.aq p::before{content:"\201C"}.aq p::after{content:"\201D"}
.aq cite{display:block;margin-top:8px;font:500 .875rem var(--sans);font-style:normal;color:var(--muted)}
.aq cite::before{content:"\2014\00a0"}
footer.site{padding-block:56px 40px;font-size:.875rem;color:var(--muted)}
footer.site .top{display:flex;flex-wrap:wrap;justify-content:space-between;gap:24px;align-items:flex-start}
footer.site .brand b{color:var(--text)}
footer.site ul{display:flex;flex-wrap:wrap;align-items:center;gap:8px 24px;list-style:none;margin:0;padding:0;color:var(--text)}
footer.site ul a{text-decoration:none;color:var(--text)}
footer.site .legal{margin-top:32px;padding-top:24px;border-top:1px solid var(--line);display:grid;gap:8px;max-width:62rem}
footer.site .legal p{margin:0}
footer.site .f{font-family:var(--mono)}
@media (prefers-reduced-motion:reduce){.stream g,.cursor,.mix .hi{animation:none}.btn{transition:none}html{scroll-behavior:auto}}
@media (max-width:1000px){
  .nav ul{gap:16px}
  .cards{grid-template-columns:1fr}.card{min-height:0}
  .mani .grid{grid-template-columns:1fr;gap:16px}
}
@media (max-width:640px){
  .nav .wrap{height:64px;gap:12px}.nav ul{display:none}.hide-sm{display:none}
  .hero h1{letter-spacing:-.036em;line-height:1.05}
  .hero .row .btn{width:100%}.hero .by{margin:6px 0 0}
  .def{grid-template-columns:4px 1fr;gap:16px}
  .mix{height:44px}
}
@media print{.stream,.cursor{display:none}body{background:#fff;color:#000}}
