*{box-sizing:border-box}html{background:#071e18;color:#f1f0e7}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo",sans-serif;word-break:keep-all;overscroll-behavior:none}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible{outline:2px solid #dddfb9;outline-offset:7px}#stage{position:fixed;inset:0;z-index:0;background:radial-gradient(ellipse at 65% 40%,#153a2b 0,#071e18 70%)}#stage canvas{width:100%;height:100%;display:block}header{position:fixed;z-index:10;top:0;left:0;width:100%;padding:27px 4.5vw;display:flex;justify-content:space-between;align-items:center;pointer-events:none}.brand,#skip{pointer-events:auto}.brand{display:flex;align-items:center;gap:12px;font-weight:650;font-size:18px;letter-spacing:-.4px}.brand img{width:39px;height:39px;object-fit:contain;background:#faf9ed;border-radius:50%;padding:5px}#skip{border:1px solid #c6d7c234;border-radius:30px;background:#0d2d2280;padding:11px 18px;font-size:14px;backdrop-filter:blur(14px)}#skip span{margin-left:15px}#journey{height:850vh}.overlay{position:fixed;z-index:2;pointer-events:none}.intro{left:9vw;top:29vh;max-width:660px}.eyebrow{font-size:14px;letter-spacing:.08em;color:#b1c6b4;font-weight:550;margin:0 0 23px}h1,h2,p{margin-top:0}h1{font-size:clamp(40px,4.5vw,78px);font-weight:550;line-height:1.24;letter-spacing:-.055em;margin-bottom:30px}.lead{font-size:17px;line-height:1.85;color:#b4c9bb}.caption{left:7vw;bottom:15vh;opacity:0;max-width:550px}.caption h2{font-size:clamp(27px,3vw,46px);line-height:1.35;letter-spacing:-.04em;font-weight:500;margin-bottom:17px}.caption p:not(.eyebrow){color:#b1c9b9;font-size:16px}.legend{display:flex;gap:19px;font-size:14px;color:#b1c9b9;flex-wrap:wrap}.legend span{display:flex;align-items:center;gap:6px}.legend i{width:7px;height:7px;border-radius:50%;background:#f1ecdb}.legend i.oxygen{background:#75aaa0}#scrollHint{position:fixed;bottom:42px;left:9vw;z-index:3;display:flex;align-items:center;gap:13px;color:#b6c9b7;font-size:14px}.scroll-line{display:block;width:1px;height:35px;background:linear-gradient(transparent,#b6c9b7)}.timeline{position:fixed;bottom:38px;right:4.5vw;display:flex;gap:14px;z-index:10;padding-bottom:12px}.timeline button{background:none;border:0;padding:6px 8px;min-width:36px;min-height:36px;color:#99ae9e;font-size:12px;font-variant-numeric:tabular-nums}.timeline button.active{color:#fff}.timeline:after{content:"";position:absolute;left:8px;right:8px;bottom:0;height:1px;background:#c5d2ba30}#progressLine{position:absolute;left:8px;bottom:0;height:1px;background:#ced9c0;z-index:1;transform-origin:left;width:calc(100% - 16px);transform:scaleX(0)}#axisLabels{position:fixed;inset:0;pointer-events:none;z-index:3;opacity:0}#axisLabels span{position:absolute;font-size:14px;color:#c6deca;white-space:nowrap;text-shadow:0 1px 7px #071e18}#lambda{color:#ede3b1!important}#profile{inset:0;opacity:0;background:linear-gradient(110deg,#0c271df2,#0c271dea 70%,#0c271dce);display:flex;align-items:center;padding:110px 9vw 100px}.profile-inner{max-width:1240px;margin:auto;display:grid;grid-template-columns:minmax(240px,380px) 1fr;gap:7vw;align-items:center;width:100%}.profile-photo{height:min(61vh,650px);overflow:hidden;border-radius:2px}.profile-photo img{height:100%;width:100%;object-fit:cover;object-position:center 24%}.profile-copy h2{font-size:clamp(32px,3.4vw,56px);font-weight:500;line-height:1.3;letter-spacing:-.045em}.profile-description{font-size:17px;line-height:1.85;color:#c2d2c5}.credentials{font-size:14px;color:#a6bba9;display:flex;flex-wrap:wrap;gap:9px 23px;margin:27px 0}.services{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid #cbd8c332;border-bottom:1px solid #cbd8c332;margin-top:32px;gap:15px}.services a{padding:20px 0;font-size:16px;display:flex;justify-content:space-between}.services a:hover{color:#caddb0}.services span{color:#8da38e}#fallback{position:fixed;z-index:20;top:40%;left:10%;background:#173e2d;padding:30px;border-radius:10px}#fallback button{background:none;border:1px solid #fff7;padding:10px 20px}#fallback[hidden]{display:none}@media(prefers-reduced-motion:reduce){#journey{height:120vh}#stage{opacity:.3}.intro,.caption,#scrollHint,.timeline{display:none}#profile{opacity:1!important;transform:none!important}}

#atomLabels{position:fixed;inset:0;z-index:3;opacity:0;pointer-events:none}#atomLabels span{position:absolute;transform:translate(-50%,-50%);font-size:19px;color:#efeade;text-shadow:0 2px 6px #071e18}#atomO{color:#e9ac91!important}.legend i.oxygen{background:#ca795a}#performance{position:fixed;z-index:30;left:24px;top:100px;padding:10px 14px;background:#061b15dd;border:1px solid #62877544;border-radius:8px;font-size:13px;color:#c5d8c8;pointer-events:auto}#performance[hidden]{display:none}#performance strong,#performance small{display:block;line-height:1.7}#performance a{display:inline-block;margin-top:4px;text-decoration:underline}

#sectionLabels{position:fixed;inset:0;pointer-events:none;z-index:3;opacity:0}#sectionLabels span{position:absolute;transform:translate(-50%,-50%);font-size:15px;color:#c6deca;white-space:nowrap;text-shadow:0 1px 7px #071e18}#sectionCaption{bottom:12vh}#sectionCaption h2{font-size:clamp(25px,2.6vw,38px)}

#benchmark{display:block;margin:6px 0;padding:5px 8px;border:1px solid #6e8a77;background:transparent;border-radius:4px;font-size:12px}

/* Scroll-controlled studio → underwater → midnight palette. No background animation. */
html{background:#e8edef;color:#243735}
body{--ink:#243735;--muted:#596e6e;color:var(--ink)}
#stage{--night:0;--deep:0;background:radial-gradient(ellipse at 70% 33%,#fff 0%,#edf1f2 36%,#d4dee2 100%);isolation:isolate}
#stage:before,#stage:after{content:"";position:absolute;inset:0;pointer-events:none}
#stage:before{background:radial-gradient(ellipse at 64% 35%,#254457 0%,#122638 48%,#07121f 100%);opacity:var(--night)}
#stage:after{background:radial-gradient(ellipse at 70% 24%,#152d46 0%,#081523 55%,#040b13 100%);opacity:var(--deep)}
#stage canvas{position:relative;z-index:1}
.brand,.timeline button.active{color:var(--ink)}
.eyebrow,.lead,.caption p:not(.eyebrow),#scrollHint,.timeline button{color:var(--muted)}
#skip{color:var(--ink);background:transparent;border-color:currentColor;backdrop-filter:none}
.scroll-line{background:linear-gradient(transparent,var(--muted))}
.timeline:after{background:var(--muted);opacity:.24}
#progressLine{background:var(--ink)}
#profile{background:#f4f2eb;color:#243735}
#profile .eyebrow{color:#376959}
.profile-description{color:#4e625e}.credentials{color:#5c6e69}
.services{border-color:#c8d0c9}.services a:hover,.services span{color:#487c68}
.profile-photo{border-radius:3px}
#axisLabels span,#sectionLabels span{color:#c3dce8;text-shadow:0 1px 7px #040b13}
#atomLabels span{text-shadow:0 2px 6px #07121f}
#waveCaption{text-shadow:0 2px 16px #040b13,0 1px 4px #040b13}
#waveCaption .eyebrow{color:#d1e1e9}
#performance{background:#101e2ae8;border-color:#90adb944;color:#d6e2e8}
#benchmark{border-color:#728997}
#fallback{background:#1b3448;color:#f2f6fa}
@media(prefers-reduced-motion:reduce){body{--ink:#243735;--muted:#596e6e}}

/* The pearl environment arrives before the portrait; no opaque sliding page. */
#profileLight{position:absolute;inset:0;z-index:2;background:var(--surface-pearl,#edf1f2);opacity:0;pointer-events:none}
#profile{background:transparent}
#waveScience{right:7vw;top:20vh;opacity:0;color:#d5e7ec;text-shadow:0 2px 14px #07121f;max-width:560px}
.science-kicker{font-size:15px;letter-spacing:.09em;color:#a6c7d1;margin-bottom:14px}
.science-equation{font-family:Georgia,"Times New Roman",serif;font-size:clamp(23px,2.1vw,36px);margin-bottom:18px;letter-spacing:.015em}
.science-relations{display:flex;gap:28px;font-family:Georgia,"Times New Roman",serif;font-size:19px}
.science-decay{font-size:16px;color:#adc5cf;margin-top:17px}
#waveMeasures{position:fixed;inset:0;z-index:3;pointer-events:none;opacity:0}
#waveMeasures svg{width:100%;height:100%;overflow:visible}
#waveMeasures line,#waveMeasures path{stroke:#b8d6df;stroke-width:1;fill:none}
#wavelengthGuides{stroke-dasharray:3 5;opacity:.35}
#waveMeasures text{fill:#d5e7ec;font:16px -apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo",sans-serif;text-anchor:middle}
.mobile-equation,#mobileStage{display:none}
.scrub-label{display:block;margin-top:7px}#debugProgress{display:block;width:180px}

@media(prefers-reduced-motion:reduce){#profileLight{opacity:1!important}#stage{opacity:1}#waveScience,#waveMeasures{display:none}}
