:root{--acid:#b9dffa;--ink:#0b1521;--paper:#e8f0f8}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--ink);color:var(--paper);font-family:Arial,'Helvetica Neue',sans-serif}button,a,select,input{-webkit-tap-highlight-color:transparent}button,a{color:inherit}button,select{font:inherit}button{cursor:pointer}a{text-decoration:none}button:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible{outline:3px solid #ff8860;outline-offset:5px}header{position:absolute;top:0;left:0;z-index:8;width:100%;display:flex;align-items:center;justify-content:space-between;padding:26px 32px}.brand{font-weight:900;font-size:35px;letter-spacing:-5px}.header-label{font-size:10px;letter-spacing:2px}header button{font:10px monospace;background:#0b152166;border:1px solid #ffffff50;padding:13px 16px}header button span{margin-left:24px}.journey{height:380vh}.stage{height:100svh;position:sticky;top:0;overflow:hidden;background:#0b1521}.reel{position:absolute;inset:0;will-change:transform}#visual{width:100%;height:100%;display:block}.shade{position:absolute;inset:0;background:linear-gradient(0deg,#060b0caa,transparent 65%)}.topline{position:absolute;top:116px;left:32px;right:32px;display:flex;justify-content:space-between;font:10px monospace;letter-spacing:1px;color:#c9dcec}.topline span:last-child{color:var(--acid)}h1{position:absolute;left:22px;bottom:52px;margin:0;font-size:clamp(105px,23vw,390px);font-weight:900;line-height:.76;letter-spacing:-.085em;color:var(--acid);transform-origin:left bottom;display:flex;will-change:transform,opacity}h1 span{display:inline-block}h1 sup{font-size:16px;letter-spacing:0;margin:6px 0 0 22px}.hero-note{position:absolute;right:4%;bottom:100px;font-size:19px;line-height:1.18}.stage-bottom{position:absolute;bottom:22px;left:32px;right:32px;display:flex;justify-content:space-between;font:9px monospace;letter-spacing:1px}.live-dot{display:inline-block;width:6px;height:6px;background:var(--acid);margin-right:8px}.intro{position:absolute;left:48%;top:34%;opacity:0;transform:translateY(40px);max-width:490px;pointer-events:none}.intro h2{font-size:clamp(36px,5vw,76px);font-weight:500;line-height:1.2;letter-spacing:-.06em;margin:22px 0}.intro p{font-size:13px;line-height:2;color:#e8f0f8}.eyebrow{font:10px monospace;letter-spacing:2px}.intro a{display:flex;justify-content:space-between;width:270px;background:var(--acid);color:var(--ink);padding:17px;font:10px monospace;margin-top:30px}.collage{position:absolute;inset:0;display:grid;grid-template-columns:1fr 1fr;gap:15px;opacity:0}.collage i{background:repeating-linear-gradient(125deg,transparent 0 60px,#8ef4d9 61px,transparent 64px),radial-gradient(ellipse at 20% 70%,#246669,#071616 60%)}.collage i:nth-child(2){background:repeating-radial-gradient(ellipse at 80% 20%,#e0b576 0 1px,#20100b 3px 40px)}.collage i:nth-child(3){background:repeating-linear-gradient(35deg,#170e23 0 40px,#b6a2eb 41px,#170e23 44px)}.collage i:nth-child(4){background:repeating-radial-gradient(circle at 40% 70%,#1b2d40 0 35px,#b9dffa 36px,#1b2d40 39px)}.studies{background:var(--paper);color:var(--ink);padding:32px 32px 64px}.section-line{display:flex;justify-content:space-between;font:10px monospace;letter-spacing:1px;border-bottom:1px solid #aec4d6;padding-bottom:24px}.section-heading{display:flex;justify-content:space-between;align-items:end;margin:60px 0 48px}.section-heading h2{font-size:clamp(40px,5.6vw,88px);line-height:.99;font-weight:500;letter-spacing:-.065em;margin:0}.section-heading p{font-size:12px;line-height:2;margin-right:7%}.study-grid{display:grid;grid-template-columns:repeat(5,1fr)}.study-grid button{min-height:240px;padding:20px;text-align:left;display:flex;flex-direction:column;justify-content:space-between;border:0;background:#b9dffa;color:#0b1521;transition:transform .25s,filter .25s}.study-grid button:nth-child(2){background:#99c5e5}.study-grid button:nth-child(3){background:#76a2c2}.study-grid button:nth-child(4){background:#355d7a;color:#fff}.study-grid button:nth-child(5){background:#213e57;color:#fff}.study-grid button:hover{transform:translateY(-12px);filter:brightness(1.1)}.study-grid span,.study-grid small{font:10px monospace}.study-grid strong{font-size:clamp(18px,2.5vw,38px);letter-spacing:-1px;font-weight:500}#study-description{font-size:12px;line-height:1.9;min-height:46px;margin:26px 0 0}.playground{position:relative;min-height:650px;padding:55px 32px;background:#0b1521;overflow:hidden}.playground h2{font-size:clamp(80px,13vw,200px);line-height:.9;letter-spacing:-.07em;font-weight:400;margin:70px 0 30px}.playground em{font-style:normal;color:var(--acid)}.playground p{font-size:12px;line-height:2;position:absolute;bottom:70px;right:9%}.coordinate{position:absolute;right:32px;top:55px;font:10px monospace;color:#a6bed2}footer{padding:35px 32px;display:flex;align-items:center;justify-content:space-between;border-top:1px solid #31465b}footer>a{font-size:35px;letter-spacing:-2px}footer p{font:10px/1.8 monospace;color:#a6bed2}footer button{font:10px monospace;background:none;border:0}#pixels{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:9}#loader{position:fixed;inset:0;background:#e8f0f8;z-index:30;color:#0b1521}#loader canvas{width:100%;height:100%}.load-center{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:20px;font:9px monospace;letter-spacing:1px}.load-icon{font:bold 30px Arial;background:#e8f0f8;padding:8px}#load-count{background:#e8f0f8;padding:15px;min-width:55px}#skip{position:absolute;bottom:25px;right:32px;background:#e8f0f8;border:0;padding:12px;font:11px monospace}#controls{position:fixed;z-index:20;right:24px;top:85px;width:300px;padding:22px;background:#e8f0f8;color:#0b1521;box-shadow:0 20px 80px #0006}#controls[hidden]{display:none}.panel-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:25px;font:12px monospace}.panel-head button{border:0;background:none;font-size:24px}#controls>button{display:block;width:100%;padding:13px;margin-top:10px;background:transparent;border:1px solid #8aa5ba;text-align:left;font-size:12px}#controls label{display:flex;align-items:center;justify-content:space-between;font-size:12px;margin-top:18px}#controls select{padding:8px;background:transparent}#controls p{font:10px/2 monospace;margin-top:24px}#controls .check{justify-content:start;gap:10px}.noscript{position:fixed;inset:0;z-index:100;background:#e8f0f8;color:#111;padding:50px}body.loading{overflow:hidden}@media(max-width:700px){header{padding:20px}.header-label{display:none}.topline{left:20px;right:20px;top:95px;font-size:8px;gap:25px}.topline span:last-child{text-align:right}h1{left:14px;bottom:125px;font-size:26vw}h1 sup{font-size:10px;margin-left:10px}.hero-note{bottom:62px;right:20px;font-size:14px}.stage-bottom{left:20px;right:20px;font-size:7px}.stage-bottom>span:nth-child(2){display:none}.intro{left:25%;right:18px;top:30%}.intro h2{font-size:40px}.intro p{font-size:11px}.intro a{width:230px}.studies{padding:26px 20px}.section-line{font-size:8px;gap:20px}.section-heading{display:block;margin:40px 0}.section-heading p{margin-top:25px}.study-grid{grid-template-columns:1fr 1fr}.study-grid button{min-height:170px}.study-grid button:last-child{grid-column:1/-1;min-height:140px}.study-grid strong{font-size:30px}.playground{padding:35px 20px;min-height:600px}.coordinate{top:65px;right:20px}.playground p{bottom:40px;left:20px}.playground h2{margin-top:100px}footer{padding:25px 20px;flex-wrap:wrap;gap:20px}footer p{font-size:8px}.load-center{gap:10px}.load-center>span:nth-child(2){max-width:140px;line-height:1.8}#controls{right:15px;width:min(300px,calc(100vw - 30px))}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important}}

/* Navigation, audio and research controls have independent responsibilities. */
:root{--header-height:88px}
header{position:fixed;height:var(--header-height);z-index:16;background:linear-gradient(#0b1521e6,#0b152199);padding:20px 32px}
.header-actions{display:flex;align-items:center;gap:12px}.header-actions #menu-toggle{min-width:104px;text-align:center}.header-actions #sound-toggle{border:0;padding:12px 0;font-size:10px;white-space:nowrap}#sound-toggle:disabled{cursor:not-allowed;color:#b2c9dc}#sound-status{font-size:10px;color:#b2c9dc;margin-right:12px}
.mega-menu{position:fixed;z-index:15;top:var(--header-height);left:32px;right:32px;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));background:var(--acid);color:var(--ink);padding:24px 8px;opacity:0;visibility:hidden;transform:translateY(-22px);pointer-events:none;transition:opacity .28s .12s,transform .38s .08s,visibility 0s .46s;box-shadow:0 18px 35px #0003;max-height:calc(100svh - var(--header-height) - 16px);overflow:auto}
.mega-menu.is-open{opacity:1;visibility:visible;transform:translateY(0);pointer-events:auto;transition:opacity .3s,transform .42s cubic-bezier(.2,.7,.2,1),visibility 0s}
.menu-column{display:flex;flex-direction:column;gap:18px;padding:4px 24px;border-right:1px solid #0b152133;opacity:0;transform:translateY(-10px);transition:opacity .18s,transform .22s;transition-delay:calc((4 - var(--i)) * 35ms)}.menu-column:last-child{border:0}.is-open .menu-column{opacity:1;transform:translateY(0);transition-delay:calc(90ms + var(--i) * 55ms)}.menu-column span{font:9px monospace;letter-spacing:1px}.menu-column strong{white-space:nowrap;font-size:clamp(16px,2vw,38px);font-weight:500;letter-spacing:-1px}.menu-column small{font-size:11px}.menu-column[href]:hover strong{text-decoration:underline;text-underline-offset:6px}.unavailable{color:#405971;cursor:not-allowed}
.lab-launcher{position:fixed;bottom:20px;right:20px;z-index:21;border:1px solid #b9dffa66;background:#0b1521;color:var(--acid);padding:12px 15px;font:10px monospace;letter-spacing:2px}#controls{top:auto;bottom:70px;max-height:calc(100svh - 160px);overflow:auto}.stage-bottom{right:100px}#studies{scroll-margin-top:var(--header-height)}footer{padding-bottom:85px}.reduced-motion .mega-menu,.reduced-motion .menu-column{transition:none}
@media(max-width:700px){:root{--header-height:76px}header{padding:14px 20px}.header-actions{gap:8px;position:relative;padding-bottom:12px}.header-actions #menu-toggle{min-width:85px;padding:12px 8px}.header-actions #sound-toggle{font-size:9px}#sound-status{position:absolute;left:0;bottom:-1px;font-size:9px;margin:0}.mega-menu{left:12px;right:12px;grid-template-columns:1fr;padding:8px 18px}.menu-column{padding:14px 4px;gap:6px;border-right:0;border-bottom:1px solid #0b152133}.menu-column strong{font-size:25px}.menu-column span{font-size:8px}.menu-column small{font-size:10px}.lab-launcher{bottom:16px;right:15px}.stage-bottom{right:90px}}

@media(min-width:701px) and (max-width:1100px){.menu-column{padding-inline:10px}.menu-column span{letter-spacing:0}}

/* One title persists beyond the sticky hero; no duplicate header logo. */
#word{position:fixed;z-index:17;transform-origin:left top;pointer-events:none;opacity:1;will-change:transform,color}
.brand-space{width:30px;flex-shrink:0}
.about{padding:40px 32px 70px;background:var(--paper);color:var(--ink);scroll-margin-top:var(--header-height)}
.about-copy{max-width:490px}.about-copy p{margin-right:0;line-height:2.2}
@media(max-width:700px){.about{padding:32px 20px 45px}.about-copy{margin-top:30px}}

/* Pointer motion belongs only to these inner layers; scroll owns their parents. */
#word #word-motion{display:flex;transform:translate3d(0,0,0);will-change:transform;transition:none}
.reel{overflow:hidden}
#reel-motion{position:absolute;inset:-22px;will-change:transform;transition:none}

#reel-motion::after{content:"";position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(to bottom,#00000016 0 1px,transparent 1px 4px)}

#controls .diagnostics{margin:22px 0 0;padding:14px 0 0;border:0;border-top:1px solid #8aa5ba}#controls .diagnostics legend{font:11px monospace;padding-right:10px}#controls .diagnostics>select{width:100%;font-size:11px;margin-top:8px}#controls .diagnostics p{margin:10px 0;font-size:10px}#controls .diagnostics small{display:block;font-size:10px;line-height:1.6;color:#405971}#motion-stats{white-space:pre-wrap;font:10px/1.7 monospace;background:#d3e3f0;padding:10px;min-height:150px}#controls .diagnostics .check{line-height:1.5}

#controls{overscroll-behavior-y:contain}#wheel-decay{display:block;width:100%;margin:14px 0;accent-color:#355d7a;touch-action:pan-x}#glide-value{font:12px monospace;white-space:nowrap}

/* Editorial update: one unbroken title at every scroll position. */
#word{font-size:9vw;letter-spacing:-.065em;line-height:.85;bottom:120px;white-space:nowrap}
#word sup{display:none}
.header-label{display:none}.header-actions{margin-left:auto}
.hero-note{right:32px;bottom:64px;margin:0;font-family:'Hiragino Kaku Gothic ProN','Yu Gothic',sans-serif;font-size:clamp(16px,1.5vw,24px);line-height:1.6;letter-spacing:.12em}
.intro{left:46%;right:32px;top:27%;max-width:650px}
.intro h2{font-family:'Hiragino Kaku Gothic ProN','Yu Gothic',sans-serif;font-size:clamp(30px,4.1vw,62px);font-weight:600;letter-spacing:-.04em;line-height:1.4}
.intro p{font-family:'Hiragino Kaku Gothic ProN','Yu Gothic',sans-serif;font-size:clamp(13px,1.1vw,16px);line-height:2;max-width:36em;line-break:strict;overflow-wrap:anywhere}
@media(max-width:700px){
 #word{left:14px;bottom:148px;font-size:9vw}
 .hero-note{right:20px;bottom:94px;font-size:16px}
 .intro{left:20px;right:20px;top:23%;max-width:none}
 .intro h2{font-size:clamp(27px,6.8vw,42px);margin:16px 0}
 .intro p{font-size:13px;line-height:1.9}
 .intro a{margin-top:20px}
}
@media(max-height:500px){.intro{top:23%;left:42%}.intro h2{font-size:26px;margin:10px 0}.intro p{font-size:11px;line-height:1.6}.intro a{margin-top:12px;padding:12px}.hero-note{bottom:55px}#word{bottom:100px}}

/* Both lines remain a single block throughout the scroll. */
#word{font-size:7.425vw;line-height:.88;height:1.76em}
#word #word-motion{position:relative;display:block;height:100%}
#title-first{display:block}
#title-second{position:absolute;left:0;top:0;transform:translate3d(0,.88em,0);transition:none}
@media(max-width:700px){#word{font-size:7.425vw}}

#header-word{position:fixed;z-index:17;left:32px;top:0;height:var(--header-height);display:flex;align-items:center;font-family:Arial,'Helvetica Neue',sans-serif;font-weight:900;letter-spacing:-.065em;line-height:.88;white-space:nowrap;color:#fff;opacity:0;pointer-events:none;transition:none}
@media(max-width:700px){#header-word{left:20px}}

/* Hide only the document scrollbar, not scrolling or scrollable LAB/menu panels. */
html{scrollbar-width:none;scrollbar-gutter:auto;overflow-x:clip}
html::-webkit-scrollbar,body::-webkit-scrollbar{display:none;width:0;height:0}
