/* A quieter frame for a more physical, cinematic world. */
:root{--paper:#eae8de;--ink:#1c251f;--accent:#d9ed9d;background:var(--paper)}
body{color:var(--ink)}
#backdrop:after{background:radial-gradient(ellipse at 48% 38%,#ffffff26,transparent 60%),radial-gradient(ellipse at 50% 45%,transparent 45%,#070a1615 100%)}
.header{border-bottom:0;height:108px;padding:0 5%}
.brand{font-size:32px;letter-spacing:-1.8px}.brand sup{display:none}
.header nav{gap:40px}.header nav a{font-size:14px}
.nav-cta{border-color:#1c251f40;background:#ffffff0a;padding:14px 21px;gap:36px}
.hero h1{font-weight:850;color:#253127;letter-spacing:-.078em}
.cinematic .hero .chapter-frame{padding:132px 5% 110px}
.hero-topline{font-weight:450;font-size:12px;letter-spacing:.14em}
.hero-bottom{left:5%;right:5%;bottom:125px}
.hero-bottom p,.world-bottom p{font-weight:400;font-size:clamp(24px,2.25vw,38px);letter-spacing:-.045em}
.drag-hint{opacity:.45;font-size:12px;letter-spacing:.1em;bottom:107px}
.cinematic .story .chapter-frame,.cinematic .meet .chapter-frame{padding-left:7%;padding-right:7%}
.cinematic .chapter-copy{padding-top:4vh;padding-bottom:104px}
.chapter-copy h2{font-size:clamp(52px,6.3vw,106px);font-weight:500;letter-spacing:-.065em;line-height:1.04;margin:26px 0}
.chapter-copy h2 em{font-family:Georgia,'Times New Roman',serif;font-weight:400;font-style:italic;letter-spacing:-.065em;color:#706083}
.meet .chapter-copy h2 em{color:#cfd8ab}.ice .chapter-copy h2 em{color:#386c78}.gravity .chapter-copy h2 em{color:#aec5d1}.bloom .chapter-copy h2 em{color:#955a54}.stardust .chapter-copy h2 em{color:#b7a6ca}
.split-line{padding:.14em .08em;margin:-.14em -.08em}
.chapter-copy p{font-size:17px;line-height:1.6;max-width:330px;opacity:.75}
.eyebrow{font-weight:450;letter-spacing:.13em;font-size:12px;opacity:.7}
.text-link{font-size:14px;font-weight:450;gap:45px;padding-bottom:13px;border-color:currentColor}
.text-link span{font-size:19px}
.vertical-note{display:none}
.chapter-number{font-family:Georgia,serif;font-style:italic;font-size:68px;opacity:.18;bottom:108px}
.cinematic .world .chapter-frame{padding-top:12vh}
.world h2{font-weight:800;letter-spacing:-.076em;font-size:16.8vw}
.world-bottom{bottom:126px;left:5%;right:5%}
.world-caption{bottom:94px;opacity:.55;letter-spacing:.13em;font-size:12px}
.again{border-color:#1c251f40;font-size:14px;padding:17px 25px}
.cinematic .rail{left:4%;right:4%;bottom:20px;height:62px;border:1px solid #ffffff24;border-radius:40px;padding:0 22px;background:#131916e8;backdrop-filter:blur(24px);box-shadow:0 12px 40px #0d10121a;overflow:hidden}
.cinematic .rail:before{top:auto;bottom:0;height:1px;opacity:.5;background:#d9ed9d}
.cinematic .chapters{gap:7px}.cinematic .chapters a{width:34px;height:34px;border-radius:50%;font-size:12px;opacity:.45;transition:background .3s,color .3s,opacity .3s,transform .3s}
.cinematic .chapters a.active{background:#e9eddf;color:#18231c;opacity:1}.chapters a.active:after{display:none}
.cinematic .rail-note{font-size:12px;letter-spacing:.13em;opacity:.7}
.cinematic .rail button{font-size:12px;padding:12px 4px 12px 18px;gap:8px}
.cinematic .rail a:focus-visible,.cinematic .rail button:focus-visible{outline-offset:2px}
.cinema-shade{opacity:calc(var(--travel,0)*.45);background:radial-gradient(ellipse at center,transparent 40%,#080a1b80 100%)}
.cinema-shade:before,.cinema-shade:after{height:calc(var(--travel,0)*5vh);background:#090c12;opacity:.85}
.cinema-shade:after{bottom:0}
.moment-caption{top:11vh}.moment-caption span{font-size:12px;font-weight:400;letter-spacing:.19em;opacity:.6;margin-bottom:15px}.moment-caption strong{font-family:Georgia,serif;font-style:italic;font-weight:400;font-size:clamp(32px,4vw,56px);letter-spacing:-.045em}
@media(min-width:1600px){.cinematic .hero .chapter-frame{padding-top:150px}.chapter-copy h2{font-size:6.3vw}}
@media(max-width:1000px){.cinematic .rail-note{display:none}.cinematic .rail{left:3%;right:3%}}
@media(max-width:700px){
 .header{height:85px;padding:0 6%}.brand{font-size:29px}.nav-cta{font-size:14px;gap:16px;padding:12px 16px}
 .cinematic .hero .chapter-frame{padding:114px 6% 115px}.hero h1{font-size:29vw}
 .hero-topline{font-size:12px;letter-spacing:.04em}.hero-bottom{bottom:127px;left:6%;right:6%}.hero-bottom p{font-size:24px}.drag-hint{bottom:91px;font-size:12px}
 .cinematic .chapter-copy,.cinematic .meet .chapter-copy{padding:46px 0 0;width:100%}
 .cinematic .chapter-copy h2{font-size:clamp(39px,11.5vw,59px);line-height:1.05;margin:23px 0}
 .cinematic .chapter-copy p{font-size:16px;line-height:1.5;max-width:92%}.cinematic .chapter-copy h2 em{white-space:normal}
 .eyebrow{font-size:12px;letter-spacing:.05em}.chapter-number{font-size:44px;bottom:90px}
 .cinematic .world .chapter-frame{padding-top:71px}.world h2{font-size:16.3vw}.world-bottom{bottom:132px;left:6%;right:6%}.world-bottom p{font-size:21px}.again{font-size:12px;padding:13px 15px}
 .world-caption{bottom:91px;font-size:12px;letter-spacing:.015em}
 .cinematic .rail{left:12px;right:12px;bottom:13px;height:53px;padding:0 10px;border-radius:30px}
 .cinematic .chapters{gap:0;flex:1;justify-content:space-between}.cinematic .chapters a{width:29px;height:29px;font-size:12px}
 .cinematic .rail button{padding:10px 3px 10px 12px}.cinematic .motion-label{display:none}
 .moment-caption{top:13vh;padding:0 20px}.moment-caption strong{font-size:36px}.moment-caption span{font-size:12px;letter-spacing:.1em}
 .cinematic .stardust .chapter-copy h2{font-size:clamp(37px,10.8vw,53px)}
}
@media(max-width:360px){.cinematic .chapters a{width:25px;height:28px}.cinematic .rail{padding:0 8px}.cinematic .rail button{padding-left:8px}.cinematic .chapter-copy h2{font-size:38px}}
@media(max-height:720px) and (max-width:700px){.cinematic .chapter-copy{padding-top:28px}.cinematic .chapter-copy h2{font-size:35px;margin:16px 0}.cinematic .chapter-copy p{font-size:16px}.world-bottom{bottom:117px}}