@font-face{font-family:Cormorant;src:url('../assets/fonts/cormorant.woff2');font-display:swap}@font-face{font-family:Inter;src:url('../assets/fonts/inter.woff2');font-display:swap}
:root{--bg:#070b14;--secondary:#0e1628;--text:#f5f1e8;--muted:rgba(245,241,232,.68);--accent:#d8b98a;--rose:#c98fa4;--line:rgba(216,185,138,.18)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,Arial,sans-serif;font-size:17px;line-height:1.75;overflow-x:clip}body.locked{overflow:hidden}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer;border:0}button:focus-visible,a:focus-visible{outline:2px solid var(--accent);outline-offset:5px}[hidden]{display:none!important}h1,h2,h3,p{margin:0}h1,h2,h3{font-family:Cormorant,Georgia,serif;font-weight:400;line-height:1.12}h2{font-size:clamp(36px,7vw,64px)}h3{font-size:32px}p{color:var(--muted)}#sky{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:-1}.grain{position:fixed;inset:0;pointer-events:none;z-index:8;opacity:.035;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 150 150' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23fff' filter='url(%23n)' d='M0 0h150v150H0z'/%3E%3C/svg%3E")}.masthead{position:absolute;top:calc(27px + env(safe-area-inset-top));left:24px;right:24px;display:flex;justify-content:space-between;z-index:3}.masthead a{text-decoration:none;color:var(--text);font-size:10px;letter-spacing:2.8px;line-height:1.8}.masthead a span{display:block;color:var(--muted);font-size:8px;letter-spacing:2px;margin-top:6px}.edition{display:none;font-size:9px;letter-spacing:2px;color:var(--muted)}.full{min-height:100dvh}.opening{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:120px 24px;background:radial-gradient(ellipse at 50% 60%,#24314744,transparent 60%)}.eyebrow{font-size:10px;letter-spacing:2.6px;color:var(--accent);text-transform:uppercase}.opening .eyebrow{position:relative;margin-bottom:32px;font-size:8px;letter-spacing:3px}#opening-tap{background:none;width:100%;max-width:650px;min-height:160px;position:relative;z-index:2}.opening h1{font-size:52px;letter-spacing:-1px}.opening h1.long{font-size:clamp(32px,7.7vw,50px)}#tap-hint{display:block;font-size:11px;letter-spacing:.6px;color:var(--muted);margin-top:36px;animation:hint 1s 1s both}#tap-hint b{color:var(--accent);padding-left:12px}.orbit{position:absolute;width:300px;height:300px;border:1px solid #d8b98a17;border-radius:50%;transform:rotate(-35deg);pointer-events:none}.orbit:after{content:'';position:absolute;inset:-65px;border:1px solid #d8b98a09;border-radius:50%}.orbit i{position:absolute;width:5px;height:5px;border-radius:50%;background:var(--accent);box-shadow:0 0 18px 4px #d8b98a40;left:calc(50% - 2px);top:-3px}.orbit i+i{top:auto;bottom:-3px;background:#e9edf6}.opening-footer{position:absolute;bottom:calc(28px + env(safe-area-inset-bottom));left:24px;right:24px;display:flex;justify-content:space-between;font-size:7px;letter-spacing:1.6px;color:var(--muted)}.button{display:inline-flex;align-items:center;justify-content:space-between;gap:40px;min-height:56px;padding:12px 24px;border:1px solid var(--line);background:#d8b98a0f;border-radius:2px;font-size:13px}.button span{color:var(--accent)}#start{position:relative;z-index:2;margin-top:18px}#sound{position:fixed;right:16px;top:calc(16px + env(safe-area-inset-top));z-index:9;width:48px;height:48px;border:1px solid var(--line);border-radius:50%;background:#070b14d9;color:var(--accent);font-size:20px}#sound[aria-pressed=false]{color:var(--muted)}.chapter{padding:100px 24px;position:relative;max-width:100%}.chapter-heading{max-width:620px;margin:0 auto 56px;text-align:center}.chapter-heading .eyebrow{margin-bottom:22px}.chapter-heading p:not(.eyebrow){margin-top:24px}.story-line{min-height:48dvh;display:flex;align-items:center;justify-content:center;text-align:center;max-width:580px;margin:auto;padding:44px 0;font-family:Cormorant,Georgia,serif;font-size:clamp(30px,7vw,48px);line-height:1.35;color:var(--text)}.story-line.emphasis{font-size:clamp(64px,14vw,100px);min-height:80dvh}.points{position:relative;height:260px;max-width:560px;margin:40px auto 65px}.point{position:absolute;left:15%;top:70%;width:7px;height:7px;border-radius:50%;background:#f4e1bf;box-shadow:0 0 22px 8px #d8b98a25}.point+.point{left:auto;right:15%;top:28%;background:#e7ecff;box-shadow:0 0 22px 8px #abbfe525}.point span{position:absolute;top:22px;left:-12px;font:9px Inter,sans-serif;letter-spacing:2px;color:var(--muted);white-space:nowrap}.counter{text-align:center;font-family:Cormorant,Georgia,serif;font-size:72px;color:var(--accent)}.counter small{font:12px Inter,sans-serif;letter-spacing:3px}.warm{background:linear-gradient(180deg,transparent,#64423120,transparent)}.rail{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;padding:8px 24px 30px;margin:0 -24px;scrollbar-width:thin;scrollbar-color:var(--line) transparent}.rail>*{flex:0 0 82vw;max-width:430px;scroll-snap-align:center}.shared-card{min-height:330px;text-align:left;padding:30px;background:linear-gradient(150deg,#182032a0,#0b101b);border:1px solid var(--line);border-radius:3px;display:flex;flex-direction:column;justify-content:space-between}.card-no{font-size:10px;letter-spacing:2px;color:var(--accent)}.shared-card h3{max-width:240px}.card-action{font-size:11px;color:var(--muted);display:flex;justify-content:space-between}.symbol{font-family:Cormorant,serif;font-size:54px;color:var(--accent);opacity:.6}.swipe-hint{text-align:center;margin-top:16px;font-size:11px;letter-spacing:1px}.notes{display:flex;flex-direction:column;gap:18px;max-width:550px;margin:auto}.note{display:flex;align-items:center;gap:22px;text-align:left;min-height:150px;padding:24px;border:1px solid var(--line);background:#d8b98a05}.note:nth-child(even){transform:rotate(1deg)}.note:nth-child(odd){transform:rotate(-1deg)}.note h3{font-size:28px;flex:1}.note>span:last-child{color:var(--accent)}.memory-sky{height:65dvh;min-height:430px;position:relative;max-width:680px;margin:auto}.memory-star{position:absolute;background:transparent;width:48px;height:48px;padding:0;transform:translate(-50%,-50%)}.memory-star:before{content:'';display:block;width:5px;height:5px;border-radius:50%;background:var(--accent);box-shadow:0 0 18px 5px #d8b98a25;margin:auto}.memory-star:nth-child(3n):before{width:7px;height:7px;background:var(--text)}.memory-star:after{content:attr(data-number);font-size:8px;position:absolute;top:33px;left:33px;color:#d8b98a66}.secret-star{right:4%;bottom:8%;width:48px;height:48px;position:absolute;background:none;color:#c98fa480;font-size:14px}.dark{background:linear-gradient(180deg,transparent,#03060b 20%,#03060b 80%,transparent)}.dark .points{opacity:.4;animation:flicker 4s infinite}.mistake{min-height:55dvh;flex-basis:85vw;max-width:480px;display:flex;flex-direction:column;justify-content:space-between;background:#0d1420;border:1px solid var(--line);padding:32px;text-align:left;transition:background .4s}.mistake.flipped{background:#191b20}.mistake-text{font-family:Cormorant,Georgia,serif;font-size:36px;line-height:1.3}.chat{max-width:520px;margin:auto;min-height:65dvh}.chat-heading{border-bottom:1px solid var(--line);padding:0 0 20px;display:flex;gap:16px;align-items:center;margin-bottom:28px;font-size:12px}.chat-dot{width:8px;height:8px;background:var(--accent);border-radius:50%}.bubble{background:#151e2d;border:1px solid #ffffff08;border-radius:15px 15px 3px 15px;padding:18px 22px;margin:14px 0 14px auto;max-width:92%;font-size:17px;color:var(--text)}.typing{letter-spacing:6px;color:var(--accent);padding:14px;text-align:right}.chat .button{margin-top:24px}.change{max-width:600px;min-height:75dvh;margin:0 auto 24px;padding:50px 28px;display:flex;flex-direction:column;justify-content:center;border-top:1px solid var(--line)}.change .card-no{margin-bottom:30px}.change h3{font-size:clamp(44px,11vw,80px);overflow-wrap:anywhere;color:var(--accent);margin-bottom:28px}.change p{font-size:19px;max-width:380px}.future-scene{min-height:100dvh;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:65px 24px}.future-scene p{max-width:430px;white-space:pre-line;font-size:21px}.future-scene h3{margin:28px 0;font-size:40px}.scene-art{width:240px;height:180px;stroke:var(--accent);fill:none;stroke-width:1;opacity:.7}.letter-section{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:36px;text-align:center}.envelope{width:180px;height:115px;border:1px solid #d8b98a60;position:relative;background:#d8b98a04}.envelope:after,.envelope:before{content:'';position:absolute;top:0;width:106px;height:1px;background:#d8b98a60}.envelope:before{left:0;transform:rotate(32deg);transform-origin:left}.envelope:after{right:0;transform:rotate(-32deg);transform-origin:right}.envelope span{position:absolute;left:calc(50% - 4px);top:51%;width:8px;height:8px;background:var(--accent);border-radius:50%}.final-end{text-align:center;min-height:100dvh;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:60px 24px;position:relative}.final-end .points{width:100%;height:180px;margin:0 auto 40px}.final-end .final-end .point{left:38%;top:50%}.final-end .point+.point{right:38%;left:auto;top:50%}.final-end p{font-size:12px;margin-top:35px;letter-spacing:1px}.stay-button{background:none;min-height:56px;border-bottom:1px solid var(--line);font-size:12px;color:var(--muted);letter-spacing:1px}.stay-mode #sound{display:none}.stay-mode .final-end{position:fixed;inset:0;z-index:10;background:radial-gradient(ellipse at center,#14203760,transparent 70%)}.stay-mode .stay-button{display:none}.stay-mode .final-end p{opacity:0;transition:opacity .8s}.stay-mode .final-end p.visible{opacity:1}.stay-exit{position:absolute;right:20px;top:calc(20px + env(safe-area-inset-top));background:none;width:48px;height:48px;font-size:24px;color:var(--muted)}dialog{color:var(--text);background:#101827;border:1px solid var(--line);width:100%;max-width:620px;max-height:85dvh;margin:auto auto 0;border-radius:22px 22px 0 0;padding:24px 24px calc(30px + env(safe-area-inset-bottom));box-shadow:0 -20px 70px #0005}dialog::backdrop{background:#03060bc9;backdrop-filter:blur(5px)}dialog.note-modal{height:100dvh;max-height:100dvh;border-radius:0;max-width:none}dialog.note-modal[open]{display:flex;flex-direction:column;justify-content:center}dialog.letter-modal{width:calc(100% - 32px);max-width:520px;height:94dvh;max-height:94dvh;margin:auto;border-radius:3px;background:#eee7da;color:#302a24;padding:24px}.dialog-top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:22px}#close-detail{width:48px;height:48px;flex-shrink:0;background:none;font-size:30px;color:var(--accent)}#detail-scroll{overflow-y:auto;max-height:65dvh;overscroll-behavior:contain}#detail-title{font-size:38px;margin:0 0 28px}#detail-body p{margin:0 0 24px}#detail-body img{width:100%;height:auto;border-radius:4px}#detail-body audio{width:100%;margin-top:20px}.note-modal #detail-scroll{width:100%;max-width:520px;margin:0 auto}.letter-modal #detail-scroll{max-height:calc(94dvh - 150px)}.letter-modal #detail-body p{font-family:Cormorant,Georgia,serif;font-size:25px;line-height:1.6;color:#443b32}.letter-modal .eyebrow,.letter-modal #close-detail{color:#786140}#reading{display:flex;gap:15px;align-items:center;margin-top:18px;font-size:10px;color:#786140;letter-spacing:2px}progress{height:2px;width:100%;accent-color:#786140}@keyframes hint{from{opacity:0}to{opacity:1}}@keyframes flicker{49%,52%{opacity:.4}50%{opacity:.15}}@media(min-width:768px){.masthead{left:50px;right:50px;top:40px}.edition{display:block;margin-right:40px}.opening .eyebrow{font-size:10px}.opening h1{font-size:88px}.orbit{width:400px;height:400px}.orbit:after{inset:-90px}.opening-footer{left:50px;right:50px;bottom:40px;font-size:9px}#opening-tap{min-height:190px}.chapter{padding:130px 48px}.rail{margin:0 -48px;padding-left:max(48px,calc((100vw - 1000px)/2));padding-right:48px;gap:24px}.shared-card{min-height:380px}#sound{right:32px;top:30px}.story-line{min-height:55dvh}.note-modal .dialog-top{width:520px;max-width:100%;margin:0 auto 24px}.future-scene p{font-size:24px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}}
html{overflow-x:hidden}.opening{overflow:hidden}a.button{text-decoration:none;color:var(--text)}
.stay-mode main,.stay-mode .masthead{visibility:hidden}.stay-mode .final-end{visibility:visible}.stay-mode .final-end p{visibility:visible}

.point{transform:translate(-50%,-50%);z-index:1}.connection-line{position:absolute;height:1px;transform-origin:0 50%;pointer-events:none;background:linear-gradient(90deg,#d8b98a90,#d8b98a35,#d8b98a90)}



.auto-scrolling{scroll-behavior:auto}
.journey-playback{position:fixed;z-index:9;bottom:calc(12px + env(safe-area-inset-bottom));left:16px;right:16px;display:flex;flex-direction:column;align-items:center;gap:6px;pointer-events:none}
.playback-note{font-size:10px;letter-spacing:.4px;color:var(--muted);padding:3px 10px;background:#070b14e8;border-radius:3px}
.playback-button{pointer-events:auto;background:#0e1628f5;min-width:210px;justify-content:center;min-height:52px;box-shadow:0 4px 18px #0004}
.stay-mode .journey-playback{display:none}