:root{--bg:#0a0b0d;--ink:#e9eaec;--muted:#828a94;--faint:#2c3038;--hair:#1a1d22;--accent:#7ad0c0;--accent-bright:#36e8d2;--serif:"Instrument Serif", Georgia, serif;--mono:"JetBrains Mono", ui-monospace, monospace;--gutter:max(clamp(28px,7vw,120px), 50vw - 230px)}*{box-sizing:border-box;margin:0;padding:0}html,body{height:100%;overflow:hidden}body{background:var(--bg);color:var(--ink);font-family:var(--mono);-webkit-font-smoothing:antialiased;font-weight:300;line-height:1.6}body:before{content:"";pointer-events:none;z-index:0;background-image:linear-gradient(var(--hair) 1px,transparent 1px), linear-gradient(90deg,var(--hair) 1px,transparent 1px);opacity:.5;background-size:64px 64px;position:fixed;inset:0;-webkit-mask-image:radial-gradient(90% 70%,#000 35%,#0000 80%);mask-image:radial-gradient(90% 70%,#000 35%,#0000 80%)}body:after{content:"";pointer-events:none;z-index:1;opacity:.035;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");position:fixed;inset:0}.tetra-stage{z-index:2;pointer-events:none;justify-content:center;align-items:flex-start;height:100vh;padding-top:clamp(8px,5vh,72px);display:flex;position:fixed;top:0;left:0;right:0}.tetra-stage canvas{opacity:.3;width:min(74vmin,94vw);height:min(74vmin,94vw);display:block}.scroller{z-index:3;-webkit-overflow-scrolling:touch;scrollbar-color:var(--faint) transparent;height:100vh;position:relative;overflow:auto hidden}.scroller::-webkit-scrollbar{height:8px}.scroller::-webkit-scrollbar-track{background:0 0}.scroller::-webkit-scrollbar-thumb{background:var(--faint);border-radius:8px}.scroller::-webkit-scrollbar-thumb:hover{background:#3a3f48}.track{width:max-content;height:100vh;padding:0 clamp(28px,7vw,120px) 0 var(--gutter);align-items:center;gap:clamp(8px,2vw,40px);display:flex}.panel{width:max(min(78vw,1040px),50vw + 230px);height:100vh;padding-top:50vh;padding-bottom:5vh;padding-left:var(--px,0);padding-right:var(--px,0);flex:none;align-items:flex-start;display:flex;position:relative}.panel.hero{width:max(min(72vw,960px),50vw + 230px)}.panel-inner{max-width:48ch}.nav{z-index:5;padding-left:var(--gutter);position:fixed;top:calc(50vh - 76px);left:0;right:0;overflow:hidden}.nav-track{white-space:nowrap;will-change:transform;align-items:center;display:inline-flex;position:relative}.nav-item{cursor:pointer;font-family:var(--mono);letter-spacing:.28em;text-transform:uppercase;color:var(--muted);background:0 0;border:0;flex:none;padding:4px 0;font-size:11px;font-weight:400;transition:color .25s}.nav-item:hover{color:var(--ink)}.nav-item.active{color:var(--ink);font-weight:500}.nav-item:not(:last-of-type):after{content:"·";color:var(--faint);margin:0 16px;font-weight:300}.nav-item .lbl{padding-bottom:6px;display:inline-block}.nav-underline{background:var(--accent);pointer-events:none;width:0;height:1.5px;transition:transform .3s linear,width .3s linear;position:absolute;top:0;left:0}.hero h1{font-family:var(--serif);letter-spacing:-.01em;font-size:clamp(40px,6vw,76px);font-weight:400;line-height:.96}.hero h1 .cap{color:var(--ink);display:block}.panel .body p{color:#c4c9d0;max-width:46ch;font-size:15px}.panel .body p+p{margin-top:14px}.panel .body strong{color:var(--ink);font-weight:500}.panel .body em{color:var(--accent);font-style:normal}.links{flex-wrap:wrap;gap:14px 30px;margin-top:26px;display:flex}a.link{color:var(--ink);border-bottom:1px solid var(--faint);padding-bottom:2px;font-size:15px;text-decoration:none;transition:all .25s}a.link:hover{color:var(--accent);border-color:var(--accent)}a.link span{color:var(--muted);margin-right:8px;font-size:12px}.colophon{left:var(--px,0);right:var(--px,0);max-width:46ch;position:absolute;bottom:5vh}.colophon .disc{color:var(--muted);margin-top:14px;font-size:12px;line-height:1.7}.colophon .mark{letter-spacing:.12em;color:var(--muted);font-size:11px}.scroll-hint{color:var(--muted);letter-spacing:.2em;text-transform:uppercase;align-items:center;gap:12px;margin-top:32px;font-size:11px;display:flex}.scroll-hint .line{background:var(--faint);width:48px;height:1.5px;position:relative;overflow:hidden}.scroll-hint .line:after{content:"";background:var(--accent);animation:2.6s ease-in-out infinite sweep;position:absolute;inset:0;transform:translate(-100%)}@keyframes sweep{0%{transform:translate(-100%)}55%,to{transform:translate(100%)}}.progress{z-index:4;background:var(--hair);width:100%;height:2px;position:fixed;bottom:0;left:0}.progress .bar{background:var(--accent);opacity:.7;transform-origin:0;width:100%;height:100%;transform:scaleX(0)}.fade{opacity:0;animation:.9s cubic-bezier(.2,.7,.2,1) forwards rise;transform:translateY(14px)}.d1{animation-delay:50ms}.d2{animation-delay:.18s}.d3{animation-delay:.32s}.d4{animation-delay:.46s}@keyframes rise{to{opacity:1;transform:none}}@media (width<=720px){.track{gap:0;padding:0 48px 0 0}.nav{padding-left:26px;top:calc(45vh - 68px);left:0;right:0}.nav-item{letter-spacing:.18em}.nav-item:not(:last-of-type):after{margin:0 12px}.panel,.panel.hero{--px:26px;width:calc(100vw - 48px);padding-top:45vh}.panel-inner{max-width:none}.tetra-stage canvas{width:min(80vmin,400px);height:min(80vmin,400px)}.hero h1{font-size:clamp(36px,11vw,60px)}.panel .body p{max-width:none;font-size:16px;line-height:1.65}.scroll-hint{margin-top:28px}}@media (prefers-reduced-motion:reduce){.fade{opacity:1;animation:none;transform:none}.scroll-hint .line:after{animation:none}}