:root{--bg: #070b14;--accent: #5fd4ff;--accent2: #a78bfa;--text: #c9d4e3;--dim: #77839a;--font-display: "Michroma", sans-serif;--font-body: "Jura", sans-serif;--font-mono: "Share Tech Mono", monospace}*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}html,body{height:100%}body{background:var(--bg);color:var(--text);font-family:var(--font-body);font-weight:400;overflow:hidden;transition:background 1.4s ease;-webkit-font-smoothing:antialiased}::selection{background:color-mix(in srgb,var(--accent) 40%,transparent);color:#fff}#stage{position:fixed;inset:0;width:100%;height:100%;display:block;z-index:1}body.no-webgl{background:radial-gradient(1200px 700px at 30% 20%,color-mix(in srgb,var(--accent) 14%,transparent),transparent 70%),radial-gradient(900px 600px at 75% 80%,color-mix(in srgb,var(--accent2) 12%,transparent),transparent 70%),var(--bg)}.vignette{position:fixed;inset:0;z-index:4;pointer-events:none;background:radial-gradient(ellipse 105% 90% at 50% 46%,transparent 58%,rgba(0,0,0,.55) 100%)}.scanlines{position:fixed;inset:0;z-index:4;pointer-events:none;opacity:.05;background:repeating-linear-gradient(0deg,rgba(255,255,255,.35) 0 1px,transparent 1px 3px);mix-blend-mode:overlay}.mono{font-family:var(--font-mono)}#loader{position:fixed;inset:0;z-index:100;background:var(--bg);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:22px;transition:opacity .9s ease,visibility .9s}#loader.done{opacity:0;visibility:hidden}.loader-hexes{position:relative;width:120px;height:110px}.loader-hexes svg{position:absolute;inset:0;width:100%;height:100%;fill:none;stroke:var(--accent);stroke-width:1.4;stroke-dasharray:200;stroke-dashoffset:200;animation:hexdraw 2.4s ease-in-out infinite;filter:drop-shadow(0 0 8px color-mix(in srgb,var(--accent) 60%,transparent))}.loader-hexes svg:nth-child(1){animation-delay:0s;opacity:.35}.loader-hexes svg:nth-child(2){animation-delay:.35s;opacity:.6;transform:scale(.78);transform-origin:center}.loader-hexes svg:nth-child(3){animation-delay:.7s;opacity:1;transform:scale(.56);transform-origin:center}@keyframes hexdraw{0%{stroke-dashoffset:200}55%{stroke-dashoffset:0}to{stroke-dashoffset:-200}}.loader-label{font-family:var(--font-display);font-size:15px;letter-spacing:.55em;text-indent:.55em;color:#fff;text-transform:lowercase}.loader-bar{width:220px;height:2px;background:#ffffff14;overflow:hidden}.loader-bar i{display:block;height:100%;width:0%;background:linear-gradient(90deg,var(--accent2),var(--accent));box-shadow:0 0 12px var(--accent);transition:width .3s ease}.loader-sub{font-family:var(--font-mono);font-size:10px;letter-spacing:.4em;color:var(--dim);text-transform:lowercase}.noscript{position:fixed;inset:auto 0 50%;z-index:200;text-align:center;padding:20px;font-family:var(--font-mono);color:var(--accent)}.ch-prose::-webkit-scrollbar{width:4px}.ch-prose::-webkit-scrollbar-track{background:#ffffff0a}.ch-prose::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--accent) 45%,transparent)}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.2s!important}}#hud-top{position:fixed;top:0;left:0;right:0;z-index:20;display:flex;justify-content:space-between;align-items:center;padding:20px 28px;pointer-events:none}#hud-top a,#hud-top button,#hud-top nav{pointer-events:auto}.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:#e8eef7;font-family:var(--font-body);font-weight:600;font-size:13px;letter-spacing:.42em;text-transform:lowercase;transition:color .3s,text-shadow .3s}.brand:hover{color:var(--accent);text-shadow:0 0 14px color-mix(in srgb,var(--accent) 70%,transparent)}.brand-hex{width:17px;height:19px;fill:#ffffff0a;stroke:var(--accent);stroke-width:2;filter:drop-shadow(0 0 6px color-mix(in srgb,var(--accent) 60%,transparent))}.hud-right{display:flex;align-items:center;gap:20px}#chapter-index{font-size:11px;letter-spacing:.3em;color:var(--dim)}#chapter-pips{display:flex;gap:9px}.pip{background:none;border:none;cursor:pointer;padding:2px;line-height:0}.pip svg{width:11px;height:13px;fill:transparent;stroke:var(--dim);stroke-width:2.4;transition:stroke .3s,filter .3s}.pip:hover svg{stroke:var(--accent2)}.pip.active svg{stroke:var(--accent);fill:color-mix(in srgb,var(--accent) 25%,transparent);filter:drop-shadow(0 0 5px var(--accent))}#hud-bottom{position:fixed;bottom:0;left:0;right:0;z-index:20;display:flex;justify-content:space-between;align-items:flex-end;padding:18px 28px;pointer-events:none}.nav-center{position:absolute;left:50%;bottom:18px;transform:translate(-50%);display:flex;align-items:center;gap:16px;pointer-events:auto}.hex-btn{position:relative;width:46px;height:52px;background:none;border:none;cursor:pointer;padding:0}.hex-btn svg{position:absolute;inset:0;width:100%;height:100%;fill:#ffffff08;stroke:color-mix(in srgb,var(--accent) 65%,transparent);stroke-width:1.6;transition:stroke .25s,fill .25s,filter .25s,transform .25s}.hex-btn:hover svg{stroke:var(--accent);fill:color-mix(in srgb,var(--accent) 14%,transparent);filter:drop-shadow(0 0 10px color-mix(in srgb,var(--accent) 70%,transparent));transform:scale(1.06)}.hex-btn .glyph{position:absolute;inset:0;display:grid;place-items:center;font-family:var(--font-mono);font-size:20px;color:var(--text);transition:color .25s}.hex-btn:hover .glyph{color:#fff}#chapter-label{min-width:230px;text-align:center;font-size:12px;letter-spacing:.34em;text-indent:.34em;color:var(--text);text-transform:lowercase;text-shadow:0 0 12px color-mix(in srgb,var(--accent) 35%,transparent)}.hud-corner{display:flex;gap:10px;pointer-events:auto}.pill-btn{font-size:10px;letter-spacing:.28em;text-indent:.28em;text-transform:lowercase;padding:9px 14px 8px;background:#ffffff0a;border:1px solid color-mix(in srgb,var(--accent) 25%,transparent);color:var(--dim);cursor:pointer;transition:all .25s}.pill-btn:hover{color:var(--text);border-color:color-mix(in srgb,var(--accent) 55%,transparent)}.pill-btn.on{color:var(--accent);border-color:var(--accent);background:color-mix(in srgb,var(--accent) 12%,transparent);box-shadow:0 0 14px color-mix(in srgb,var(--accent) 30%,transparent)}.side-nav{position:fixed;top:50%;transform:translateY(-50%);z-index:20;width:52px;height:96px;background:none;border:none;cursor:pointer;padding:10px 6px;opacity:.55;transition:opacity .25s,filter .25s,transform .25s}.side-nav svg{width:100%;height:100%;fill:none;stroke:color-mix(in srgb,var(--accent) 70%,transparent);stroke-width:2;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 0 8px color-mix(in srgb,var(--accent) 40%,transparent));transition:stroke .25s}.side-nav:hover{opacity:1;transform:translateY(-50%) scale(1.12);filter:drop-shadow(0 0 12px color-mix(in srgb,var(--accent) 60%,transparent))}.side-nav:hover svg{stroke:var(--accent)}.side-prev{left:14px}.side-next{right:14px}@media (max-width: 1200px){.side-nav{width:40px;height:76px}.side-prev{left:6px}.side-next{right:6px}}@media (max-width: 900px){.side-nav{display:none}}@media (max-width: 900px){#hud-top,#hud-bottom{padding:14px 16px}#chapter-index{display:none}#chapter-label{min-width:0;font-size:10px;max-width:34vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.hex-btn{width:38px;height:43px}.brand{font-size:11px;letter-spacing:.3em}}@media (max-width: 560px){#chapter-pips{display:none}.nav-center{bottom:14px;gap:10px}.hud-corner{position:absolute;right:16px;bottom:76px;flex-direction:column;align-items:flex-end;gap:8px}}#overlay{position:fixed;inset:0;z-index:10;pointer-events:none}.chapter{height:100%}.ch-inner{height:100%;max-width:1560px;margin:0 auto;display:grid;grid-template-columns:minmax(300px,430px) minmax(0,1fr);gap:clamp(24px,4vw,64px);align-items:center;padding:86px 5vw 110px}.ch-text{pointer-events:auto;position:relative;min-height:0;max-height:calc(100dvh - 196px);display:flex;flex-direction:column;background:linear-gradient(90deg,color-mix(in srgb,var(--bg) 78%,transparent) 62%,transparent);padding:10px 18px 10px 14px;margin-left:-14px}.ch-demo{pointer-events:auto;min-height:0;max-height:calc(100dvh - 200px);overflow-y:auto;overflow-x:hidden;padding-right:6px;scrollbar-width:thin;scrollbar-color:color-mix(in srgb,var(--accent) 45%,transparent) rgba(255,255,255,.04)}.ch-num{position:absolute;top:-46px;left:-20px;z-index:-1;font-family:var(--font-display);font-size:clamp(80px,9vw,128px);line-height:1;color:color-mix(in srgb,var(--accent) 9%,transparent);user-select:none}.ch-kicker{font-family:var(--font-mono);font-size:10.5px;letter-spacing:.32em;text-transform:lowercase;color:var(--accent);margin-bottom:12px;text-shadow:0 0 12px color-mix(in srgb,var(--accent) 45%,transparent)}.ch-title{font-family:var(--font-display);font-weight:400;font-size:clamp(22px,3vw,38px);letter-spacing:.05em;color:#fff;margin-bottom:20px;text-shadow:0 0 24px color-mix(in srgb,var(--accent) 30%,transparent)}.ch-prose{overflow-y:auto;overflow-x:hidden;padding-right:14px;font-weight:300;font-size:14.5px;line-height:1.78;scrollbar-width:thin;scrollbar-color:color-mix(in srgb,var(--accent) 45%,transparent) rgba(255,255,255,.04)}.ch-prose p{margin-bottom:14px;text-shadow:0 1px 10px rgba(0,0,0,.65)}.ch-prose strong{color:#fff;font-weight:600}.ch-prose em{color:var(--accent2);font-style:normal}.cards{display:grid;gap:10px;margin:18px 0}.card{border:1px solid color-mix(in srgb,var(--accent) 18%,transparent);background:color-mix(in srgb,var(--accent) 5%,transparent);backdrop-filter:blur(6px);padding:12px 14px;transition:border-color .3s,background .3s}.card:hover{border-color:color-mix(in srgb,var(--accent) 45%,transparent);background:color-mix(in srgb,var(--accent) 9%,transparent)}.card h4{font-family:var(--font-mono);font-weight:400;font-size:11px;letter-spacing:.24em;text-transform:lowercase;color:var(--accent);margin-bottom:6px}.card p{font-size:13px;line-height:1.6;margin:0;text-shadow:0 1px 8px rgba(0,0,0,.55)}.formula{font-family:var(--font-mono);font-size:12.5px;letter-spacing:.04em;color:var(--accent2);border-left:2px solid color-mix(in srgb,var(--accent) 55%,transparent);background:#ffffff08;padding:9px 14px;margin:14px 0;overflow-x:hidden;white-space:normal;line-height:1.55}.demo-hint{font-family:var(--font-mono);font-size:10.5px;letter-spacing:.14em;line-height:1.7;color:var(--dim);margin-top:auto;padding-top:14px;border-top:1px dashed color-mix(in srgb,var(--accent) 25%,transparent)}.demo-hint:before{content:"▸ interact ";color:var(--accent);letter-spacing:.2em}.chapter--home .ch-inner{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;grid-template-columns:none;pointer-events:auto}.portal{width:min(52vw,440px);margin-bottom:8px;filter:drop-shadow(0 0 30px color-mix(in srgb,var(--accent) 35%,transparent))}.portal .frame{fill:#060a128c;stroke:var(--accent);stroke-width:1.6}.portal .frame2{fill:none;stroke:color-mix(in srgb,var(--accent) 40%,transparent);stroke-width:1}.portal .core{fill:color-mix(in srgb,var(--accent) 10%,transparent);stroke:var(--accent2);stroke-width:1;opacity:.85}.portal-brand{cursor:pointer}.portal .pb-the,.portal .pb-101{text-anchor:middle;fill:#fff;pointer-events:auto}.portal .pb-the{font-family:var(--font-mono);font-size:21px;letter-spacing:.62em;fill:var(--accent2);opacity:.92}.portal .pb-101{font-family:var(--font-display);font-size:58px;letter-spacing:.16em;filter:drop-shadow(0 0 16px color-mix(in srgb,var(--accent) 55%,transparent));transition:fill .3s}.portal-brand:hover .pb-101{fill:var(--accent)}@media (prefers-reduced-motion: no-preference){.portal-brand{animation:brandPulse 4.6s ease-in-out infinite}@keyframes brandPulse{0%,to{opacity:.78}50%{opacity:1}}}.home-title{font-family:var(--font-display);font-weight:400;font-size:clamp(26px,4.6vw,52px);letter-spacing:.32em;text-indent:.32em;color:#fff;text-transform:lowercase;text-shadow:0 0 34px color-mix(in srgb,var(--accent) 55%,transparent);margin:10px 0 14px}.home-sub{font-weight:300;font-size:15px;line-height:1.8;color:var(--text);max-width:600px;margin-bottom:30px;padding:16px 28px;background:color-mix(in srgb,var(--bg) 68%,transparent);border:1px solid color-mix(in srgb,var(--accent) 16%,transparent);backdrop-filter:blur(9px);-webkit-backdrop-filter:blur(9px);text-shadow:0 1px 10px rgba(0,0,0,.8)}.home-sub em{color:var(--accent2);font-style:normal}.enter-btn{font-family:var(--font-mono);font-size:12px;letter-spacing:.42em;text-indent:.42em;text-transform:lowercase;color:#fff;background:color-mix(in srgb,var(--accent) 14%,transparent);border:none;padding:17px 52px;cursor:pointer;clip-path:polygon(9% 0,91% 0,100% 32%,100% 68%,91% 100%,9% 100%,0 68%,0 32%);transition:background .3s,text-shadow .3s,filter .3s;filter:drop-shadow(0 0 16px color-mix(in srgb,var(--accent) 30%,transparent))}.enter-btn:hover{background:color-mix(in srgb,var(--accent) 32%,transparent);text-shadow:0 0 12px #fff;filter:drop-shadow(0 0 26px color-mix(in srgb,var(--accent) 60%,transparent))}.home-meta{font-family:var(--font-mono);font-size:10px;letter-spacing:.34em;color:#b9c4d4;margin-top:22px;text-transform:lowercase;text-shadow:0 1px 8px rgba(0,0,0,.9)}.chapter--colophon .ch-inner{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;grid-template-columns:none;pointer-events:auto}.chapter--colophon .ch-inner{background:radial-gradient(ellipse 70% 60% at 50% 42%,color-mix(in srgb,var(--bg) 70%,transparent),transparent 70%)}.colo-title{font-family:var(--font-display);font-weight:400;font-size:clamp(20px,2.6vw,32px);letter-spacing:.28em;text-indent:.28em;color:#fff;margin-bottom:8px;text-shadow:0 0 24px rgba(0,0,0,.85)}.colo-role{font-family:var(--font-mono);font-size:11px;letter-spacing:.3em;color:var(--accent);margin-bottom:34px;text-shadow:0 1px 12px rgba(0,0,0,.8)}.colo-grid{display:grid;grid-template-columns:auto auto;gap:12px 56px;text-align:left;margin-bottom:34px}.colo-grid section h5{font-family:var(--font-mono);font-weight:400;font-size:10px;letter-spacing:.3em;color:var(--accent2);margin-bottom:10px;text-transform:lowercase}.colo-grid section p,.colo-grid section a{display:block;font-size:13.5px;font-weight:300;line-height:1.9;color:#e8eef7;text-decoration:none;text-shadow:0 1px 10px rgba(0,0,0,.85)}.colo-grid section a{border-bottom:1px solid color-mix(in srgb,var(--accent) 30%,transparent);transition:color .25s,border-color .25s;width:fit-content}.colo-grid section a:hover{color:var(--accent);border-color:var(--accent);text-shadow:0 0 10px color-mix(in srgb,var(--accent) 50%,transparent)}.colo-lines{font-family:var(--font-mono);font-size:10px;letter-spacing:.32em;line-height:2.3;color:#c3cad6;text-transform:lowercase;text-shadow:0 1px 10px rgba(0,0,0,.85)}.colo-lines .bright{color:var(--accent)}.colo-tech{font-family:var(--font-mono);font-size:10px;letter-spacing:.18em;color:#b8c2d2;margin-top:26px;max-width:640px;line-height:1.9;text-shadow:0 1px 10px rgba(0,0,0,.85)}@media (max-width: 900px){#overlay{overflow-y:auto;overflow-x:hidden}.chapter{height:auto;min-height:100%}.ch-inner{height:auto;min-height:100%;grid-template-columns:1fr;align-items:start;gap:22px;padding:74px 6vw 130px}.ch-text{max-height:none}.ch-num{top:-30px;font-size:64px}.ch-prose{overflow:visible}.demo-hint{margin-top:16px}.colo-grid{grid-template-columns:1fr;gap:22px}.portal{width:min(70vw,300px)}}.demo-frame{position:relative;background:#04080dbd;backdrop-filter:blur(10px);border:1px solid color-mix(in srgb,var(--accent) 22%,transparent);box-shadow:0 0 46px color-mix(in srgb,var(--accent) 10%,transparent),inset 0 0 30px #00000080;padding:14px 16px 16px;clip-path:polygon(16px 0,calc(100% - 16px) 0,100% 16px,100% calc(100% - 16px),calc(100% - 16px) 100%,16px 100%,0 calc(100% - 16px),0 16px)}.demo-head{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:10px}.demo-title{font-family:var(--font-mono);font-size:11px;letter-spacing:.3em;text-transform:lowercase;color:var(--accent)}.demo-status{font-family:var(--font-mono);font-size:10px;letter-spacing:.14em;color:var(--dim);text-align:right}.demo-canvas{display:block;width:100%;background:#00000061;border:1px solid rgba(255,255,255,.06);touch-action:none}.demo-canvas--wide{aspect-ratio:21 / 9}.demo-canvas--std{aspect-ratio:16 / 8}.demo-canvas--sq{aspect-ratio:1 / .82}.demo-controls{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;margin-top:12px}.dbtn{font-family:var(--font-mono);font-size:10.5px;letter-spacing:.2em;text-transform:lowercase;padding:8px 14px;background:#ffffff0b;border:1px solid color-mix(in srgb,var(--accent) 26%,transparent);color:var(--text);cursor:pointer;transition:all .2s}.dbtn:hover{color:var(--accent);border-color:var(--accent)}.dbtn.active{background:color-mix(in srgb,var(--accent) 20%,transparent);color:#fff;border-color:var(--accent);box-shadow:0 0 12px color-mix(in srgb,var(--accent) 35%,transparent)}.dslider{display:flex;align-items:center;gap:8px}.dslider label{font-family:var(--font-mono);font-size:9.5px;letter-spacing:.16em;text-transform:lowercase;color:var(--dim);white-space:nowrap}.dslider input[type=range]{accent-color:var(--accent);width:104px;cursor:pointer}.demo-readout{font-family:var(--font-mono);font-size:10.5px;letter-spacing:.1em;color:var(--dim);margin-top:10px;display:flex;flex-wrap:wrap;gap:4px 20px}.demo-readout b{color:var(--accent2);font-weight:400}.qcard{border:1px solid color-mix(in srgb,var(--accent) 20%,transparent);background:#ffffff05;padding:14px 16px;margin-top:12px}.qstep{font-family:var(--font-mono);font-size:9.5px;letter-spacing:.26em;color:var(--accent2);text-transform:lowercase;margin-bottom:8px}.qtext{font-size:16px;font-weight:500;color:#fff}.qbtns{display:flex;gap:10px;margin-top:14px}.qbtn{font-family:var(--font-mono);font-size:11px;letter-spacing:.24em;text-indent:.24em;text-transform:lowercase;padding:10px 30px;background:#ffffff0b;border:1px solid color-mix(in srgb,var(--accent) 30%,transparent);color:var(--text);cursor:pointer;transition:all .2s}.qbtn:hover{color:#fff;border-color:var(--accent);background:color-mix(in srgb,var(--accent) 16%,transparent);box-shadow:0 0 14px color-mix(in srgb,var(--accent) 30%,transparent)}.bars{margin-top:10px}.bar-row{display:flex;align-items:center;gap:10px;margin:7px 0}.bar-label{font-family:var(--font-mono);font-size:9.5px;letter-spacing:.08em;color:var(--dim);width:168px;text-align:right;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.bar-track{flex:1;height:9px;background:#ffffff0f;position:relative;overflow:hidden}.bar-fill{position:absolute;inset:0 auto 0 0;width:0%;background:linear-gradient(90deg,var(--accent2),var(--accent));box-shadow:0 0 10px color-mix(in srgb,var(--accent) 50%,transparent);transition:width .7s cubic-bezier(.2,.8,.2,1)}.bar-fill.alt{background:linear-gradient(90deg,#5a6a85,#8fa3c4);box-shadow:none}.bar-val{font-family:var(--font-mono);font-size:10px;color:var(--accent2);width:44px}.ati-wrap{display:flex;gap:14px;flex-wrap:wrap;align-items:flex-start;margin-top:12px}.ati-side{flex:1;min-width:200px}.tooltip-card{font-size:13px;font-weight:300;line-height:1.7;color:var(--text);min-height:52px;margin-top:12px;padding-top:10px;border-top:1px dashed color-mix(in srgb,var(--accent) 25%,transparent)}.tooltip-card b{color:var(--accent);font-family:var(--font-mono);font-weight:400;font-size:11px;letter-spacing:.2em;display:block;margin-bottom:4px}@media (max-width: 900px){.demo-canvas--wide,.demo-canvas--std{aspect-ratio:16 / 10}.bar-label{width:118px;font-size:8.5px}}