:root{color-scheme:dark;--ivory:#f8f3e9;--muted:#e4dbcb;--gold:#d3b88a}*{box-sizing:border-box}html,body{margin:0;background:#29251f}html{scrollbar-width:thin;scrollbar-color:#aaa08e #29251f}body{font-family:Manrope,Arial,sans-serif;color:var(--ivory)}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:2px solid #fff;outline-offset:7px}button{border:0;background:none}a{color:inherit;text-decoration:none}.story{height:620svh}.stage{position:sticky;top:0;height:100svh;min-height:480px;overflow:hidden}.scene,.shade{position:absolute;inset:0}.scene canvas,.fallback{display:block;width:100%;height:100%;object-fit:cover}.fallback{display:none;position:absolute;inset:0}.shade{pointer-events:none;background:linear-gradient(90deg,rgba(19,18,14,.56) 0%,rgba(24,20,16,.24) 44%,rgba(21,18,14,.02) 75%),linear-gradient(180deg,rgba(20,18,14,.3),transparent 27%,transparent 60%,rgba(21,18,14,.65));transition:opacity 1s}.header{position:absolute;left:4.6vw;right:4.6vw;top:34px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #ffffff30;padding-bottom:25px;z-index:3}.wordmark{font-family:'Cormorant Garamond',Georgia,serif;font-size:38px;font-weight:500;line-height:.9;letter-spacing:-1.5px}.wordmark-dot{color:var(--gold)}.wordmark small{display:block;font:500 8px Manrope,sans-serif;letter-spacing:2.3px;margin-top:13px}.skip{font-size:11px;letter-spacing:.4px;padding:11px 0 11px 24px}.skip span{margin-left:24px;font-size:23px;font-weight:400;display:inline-block;transition:transform .25s}.skip:hover span{transform:translate(3px,-3px)}.chapter{position:absolute;left:7.4vw;top:50%;transform:translateY(calc(-43% + var(--offset,0px)));max-width:760px;opacity:0;pointer-events:none;will-change:opacity,transform}.chapter.active{pointer-events:auto}.eyebrow{font-size:9px;font-weight:600;letter-spacing:2.5px;color:#f1e6d4;display:flex;align-items:center;gap:14px;margin:0 0 24px}.eyebrow>span{width:24px;height:1px;background:var(--gold)}h1,h2{font-family:'Cormorant Garamond',Georgia,serif;font-weight:400;letter-spacing:-3.5px;line-height:.98;margin:0;text-wrap:balance;text-shadow:0 2px 28px #25170b18}h1{font-size:clamp(65px,7.7vw,124px)}h2{font-size:clamp(58px,6.3vw,100px)}em{font-weight:400;color:#f6e4c5}.description{font-size:12px;font-weight:400;line-height:1.9;color:var(--muted);margin:26px 0 0;letter-spacing:.1px}.start{display:flex;align-items:center;gap:15px;font-size:10px;letter-spacing:.5px;margin-top:31px;padding:0}.arrow-circle{display:grid;place-items:center;width:39px;height:39px;border:1px solid #ffffff60;border-radius:50%;font-size:18px;transition:transform .25s,background .25s}.start:hover .arrow-circle{transform:translateY(4px);background:#ffffff18}.chapter-detail{top:auto;bottom:145px;transform:translateY(var(--offset,0px))}.chapter-detail h2{font-size:clamp(56px,5.6vw,92px)}.chapter-final{top:47%}.replay{font-size:11px;display:flex;align-items:center;gap:35px;margin-top:29px;border-bottom:1px solid #ffffff65;padding:0 0 12px}.replay span{font-size:20px}.side-note{position:absolute;right:4.5vw;top:46%;writing-mode:vertical-rl;font-size:8px;letter-spacing:3px;color:#fff9;transform:rotate(180deg)}.bottom{position:absolute;bottom:35px;left:4.6vw;right:4.6vw;display:flex;align-items:center;justify-content:space-between;gap:30px;height:45px}.stage-label{font-size:8px;letter-spacing:1.8px;display:flex;align-items:center;gap:14px;min-width:185px}.stage-label>#counter{font-size:22px;font-family:'Cormorant Garamond',Georgia,serif;letter-spacing:0}.separator{color:#fff6}.steps{display:flex;gap:9px}.steps button{padding:12px 0;min-width:65px;position:relative}.steps button>span{display:block;width:100%;height:2px;background:#fff4;transition:background .3s}.steps button.selected>span{background:var(--gold)}.steps button small{display:block;text-align:left;font-size:8px;font-weight:400;letter-spacing:.2px;margin-top:10px;color:#fffb;transition:color .3s}.steps button.selected small{color:white}.steps button:hover>span{background:#fff}.motion{display:flex;align-items:center;gap:9px;min-width:185px;justify-content:flex-end;font-size:9px;letter-spacing:.4px;padding:10px 0}.progress{position:absolute;left:0;right:0;bottom:0;height:2px;background:#ffffff10}.progress div{height:100%;width:100%;transform:scaleX(0);transform-origin:left;background:var(--gold)}.loading{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:20px;background:#29251f;font-size:10px;letter-spacing:2px;z-index:9;transition:opacity .5s}.loading span{height:1px;width:80px;background:var(--gold);animation:pulse 1s ease infinite alternate}.loading.done{opacity:0;pointer-events:none}@keyframes pulse{to{transform:scaleX(.3);opacity:.4}}@media(min-width:1800px){.chapter{left:9vw}.header{top:46px}}@media(max-width:700px){.story{height:550svh}.stage{min-height:520px}.header{top:24px;left:25px;right:25px;padding-bottom:21px}.wordmark{font-size:34px}.wordmark small{font-size:6px;letter-spacing:1.7px}.skip{font-size:10px}.skip span{margin-left:10px;font-size:20px}.chapter{left:27px;right:27px;top:43%;max-width:520px;transform:translateY(calc(-28% + var(--offset,0px)))}.eyebrow{font-size:7px;letter-spacing:1.5px;gap:9px;margin-bottom:20px}h1{font-size:clamp(54px,12.8vw,85px);letter-spacing:-2px;line-height:1.02}h2{font-size:65px;letter-spacing:-2px}.description{font-size:11px;line-height:1.9;margin-top:23px}.start{margin-top:28px}.chapter-detail{top:auto;bottom:169px;transform:translateY(var(--offset,0px))}.chapter-detail h2{font-size:clamp(47px,11.5vw,77px)}.chapter-final{top:44%}.side-note{display:none}.bottom{left:25px;right:25px;bottom:27px;height:90px;align-items:flex-start;gap:12px;flex-wrap:wrap}.stage-label{min-width:0;height:24px;font-size:7px;gap:12px}.stage-label>#counter{font-size:20px}.motion{min-width:0;height:24px;padding:0;font-size:9px;order:1}.steps{order:2;width:100%;gap:8px;justify-content:space-between}.steps button{min-width:0;flex:1;padding:10px 0 0}.steps button small{font-size:8px;margin-top:10px}.shade{background:linear-gradient(90deg,#19161169,transparent 100%),linear-gradient(180deg,#17140f66,transparent 35%,#17140f22 45%,#17140fbb 100%)}.replay{font-size:10px;gap:22px}.chapter-final h2{font-size:clamp(60px,14vw,90px)}}@media(max-height:630px) and (min-width:701px){.header{top:20px;padding-bottom:15px}.chapter{top:47%}h1{font-size:75px}.eyebrow{margin-bottom:14px}.description{margin-top:16px}.start{margin-top:19px}.chapter-detail{top:auto;bottom:115px}.chapter-detail h2{font-size:62px}.bottom{bottom:22px}}@media(prefers-reduced-motion:reduce){.loading span{animation:none}*{scroll-behavior:auto!important}}
