:root{--b:#070707;--w:#eee9df;--g:#ba9b62;--line:rgba(238,233,223,.14);--mx:50vw;--my:50vh}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none}*::selection{background:transparent;color:inherit}html,body{width:100%;max-width:100%;overflow-x:clip}html{background:var(--b);scrollbar-width:thin;scrollbar-color:#6b5a3d #080808}body{margin:0;background:var(--b);color:var(--w);font-family:Inter,sans-serif;touch-action:pan-y}body.loading{overflow:hidden}button,input{font:inherit}button:focus:not(:focus-visible){outline:none}img{display:block;max-width:100%;-webkit-user-drag:none}.cursor-dot,.cursor-ring{display:none}
.auth-locked{overflow:hidden}.auth-gate{position:fixed;inset:0;z-index:250;display:grid;place-items:center;overflow:hidden;padding:max(1.2rem,env(safe-area-inset-top)) max(1.2rem,env(safe-area-inset-right)) max(1.2rem,env(safe-area-inset-bottom)) max(1.2rem,env(safe-area-inset-left));background:radial-gradient(circle at 50% 42%,#1a150d 0,#0b0a08 30%,#050505 68%);transition:opacity .9s ease,visibility .9s}.auth-gate[hidden]{display:none}.auth-gate:before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(115deg,transparent 42%,rgba(186,155,98,.035) 50%,transparent 58%);animation:authLight 8s ease-in-out infinite}@keyframes authLight{50%{transform:translateX(14%)}}body:not(.auth-locked) .auth-gate{opacity:0;visibility:hidden;pointer-events:none}.auth-orbit{position:absolute;border:1px solid rgba(186,155,98,.1);border-radius:50%;pointer-events:none}.auth-orbit.one{width:min(76vw,680px);aspect-ratio:1;animation:authOrbit 32s linear infinite}.auth-orbit.two{width:min(55vw,490px);aspect-ratio:1;border-style:dashed;animation:authOrbit 42s linear infinite reverse}@keyframes authOrbit{to{transform:rotate(360deg)}}.auth-card{position:relative;z-index:2;width:min(100%,440px);padding:clamp(2rem,5vw,3.7rem);border:1px solid rgba(186,155,98,.22);background:linear-gradient(145deg,rgba(24,21,16,.92),rgba(7,7,7,.88));box-shadow:0 45px 140px rgba(0,0,0,.68),inset 0 1px rgba(255,255,255,.035);backdrop-filter:blur(18px);text-align:center}.auth-monogram{width:48px;height:48px;margin:0 auto 1.7rem;display:flex;align-items:center;justify-content:center;gap:.12rem;border:1px solid rgba(186,155,98,.4);border-radius:50%;font:1rem Italiana;color:#eee5d6}.auth-monogram span{color:var(--g);opacity:.55}.auth-card .kicker{margin-bottom:1rem;font-size:.48rem}.auth-card h1{margin:0 0 .8rem;font:italic 300 clamp(3.2rem,8vw,4.8rem)/.8 "Cormorant Garamond";letter-spacing:-.045em}.auth-card>p{max-width:290px;margin:0 auto 2rem;font:italic 1.15rem/1.35 "Cormorant Garamond";color:#9f978a}.auth-form{text-align:left}.auth-form label{display:block;margin:.9rem 0 .42rem;font-size:.46rem;letter-spacing:.23em;color:#9e8d70}.auth-form input{display:block;width:100%;height:48px;border:1px solid rgba(238,233,223,.15);border-radius:0;outline:0;background:rgba(255,255,255,.025);color:var(--w);padding:0 .9rem;font-size:.85rem;letter-spacing:.06em;user-select:text;-webkit-user-select:text;transition:border-color .25s,background .25s}.auth-form input:focus{border-color:rgba(186,155,98,.7);background:rgba(186,155,98,.045)}.auth-password{position:relative}.auth-password input{padding-right:4.4rem}.auth-reveal{position:absolute;z-index:2;right:.35rem;top:50%;transform:translateY(-50%);border:0;background:none;color:#9f8c69;padding:.65rem;font-size:.44rem;letter-spacing:.16em;cursor:pointer}.auth-submit{position:relative;width:100%;height:50px;margin-top:1.35rem;border:1px solid var(--g);background:var(--w);color:#0b0a08;overflow:hidden;font-size:.52rem;letter-spacing:.2em;cursor:pointer;transition:color .3s,background .3s}.auth-submit:disabled{opacity:.55}.auth-submit:after{content:"";position:absolute;inset:0;background:var(--g);transform:translateX(-102%);transition:transform .35s}.auth-submit:hover:after,.auth-submit:focus-visible:after{transform:none}.auth-submit span{position:relative;z-index:1}.auth-status{min-height:1.2rem;padding-top:.65rem;text-align:center;font:italic .9rem "Cormorant Garamond";color:#c69082}.auth-status.ok{color:#c8b181}.auth-card>small{display:block;margin-top:1.2rem;font-size:.43rem;letter-spacing:.16em;color:#625c52}.auth-card.shake{animation:authShake .38s ease}@keyframes authShake{25%{transform:translateX(-7px)}50%{transform:translateX(6px)}75%{transform:translateX(-3px)}}.auth-gate.authorized .auth-card{transform:scale(.97);opacity:0;transition:.7s}.auth-gate.authorized .auth-orbit{opacity:0;transform:scale(1.1);transition:.8s}@media(max-width:520px){.auth-card{padding:2rem 1.4rem}.auth-orbit.one{width:130vw}.auth-orbit.two{width:92vw}.auth-card h1{font-size:3.6rem}.auth-card>p{margin-bottom:1.4rem}.auth-form input{height:46px}.auth-submit{height:48px}}@media(prefers-reduced-motion:reduce){.auth-gate:before,.auth-orbit{animation:none}}
#space,#fx{position:fixed;inset:0;width:100%;height:100%;pointer-events:none}#space{z-index:0}#fx{z-index:30}.grain{position:fixed;inset:-70%;z-index:60;pointer-events:none;opacity:.05;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 160 160' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='4'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.8'/%3E%3C/svg%3E");animation:grain .18s steps(2) infinite}@keyframes grain{25%{transform:translate(3%,-2%)}50%{transform:translate(-2%,3%)}75%{transform:translate(4%,2%)}100%{transform:translate(-3%,-4%)}}.light{position:fixed;z-index:3;left:var(--mx);top:var(--my);width:38rem;height:38rem;transform:translate(-50%,-50%);border-radius:50%;pointer-events:none;background:radial-gradient(circle,rgba(190,155,91,.09),transparent 67%)}
.loader{position:fixed;inset:0;z-index:100;display:grid;place-items:center;background:radial-gradient(circle at 50% 45%,#17130d,#070707 45%);transition:1s}.loader.hide{opacity:0;visibility:hidden}.load{text-align:center;padding:2rem}.lottie{position:relative;width:58px;height:58px;margin:auto}.lottie>*{opacity:0}.lottie:before,.lottie:after{content:"";position:absolute;border-radius:50%}.lottie:before{inset:5px;border:1px solid rgba(186,155,98,.28)}.lottie:after{inset:5px;border-top:1px solid var(--g);animation:orbit 1.8s linear infinite}@keyframes orbit{to{transform:rotate(360deg)}}.load strong{display:block;font:300 clamp(3rem,8vw,5rem) "Cormorant Garamond";margin:.3rem}.loader-note{font:italic 1.1rem "Cormorant Garamond";color:#aaa;margin:0 0 1.4rem}.bar{width:180px;height:1px;margin:auto;background:#29251f;overflow:hidden}.bar i{display:block;width:0;height:100%;background:var(--g);box-shadow:0 0 12px var(--g);transition:width .3s}.count{margin-top:1rem;color:var(--g);font-size:.55rem;letter-spacing:.25em}.start{margin-top:1.8rem;padding:1rem 1.6rem;border:1px solid var(--g);background:rgba(186,155,98,.08);color:var(--w);font-size:.6rem;letter-spacing:.24em;opacity:0;visibility:hidden;transform:translateY(12px);transition:.5s;cursor:pointer}.loader.ready .start{opacity:1;visibility:visible;transform:none}.loader.ready .bar,.loader.ready .count{opacity:.25}
.top{position:fixed;z-index:50;inset:0 0 auto;display:flex;justify-content:space-between;padding:max(1rem,env(safe-area-inset-top)) max(1.2rem,env(safe-area-inset-right)) 1rem max(1.2rem,env(safe-area-inset-left));mix-blend-mode:difference}.mark{font:1.2rem Italiana}.sound{border:0;background:none;color:white;font-size:.56rem;letter-spacing:.22em;cursor:pointer}.rail{position:fixed;z-index:51;left:0;top:0;width:0;height:1px;background:var(--g)}
main{position:relative;z-index:2;width:100%}.scene{position:relative;min-height:100vh;display:grid;place-items:center;padding:8vw;isolation:isolate}.copy{position:relative;z-index:4;width:100%;max-width:850px;text-align:center}.kicker{font-size:.58rem;letter-spacing:.3em;color:var(--g);text-transform:uppercase;margin-bottom:1.7rem}h1,h2,p{margin-top:0}h1{font:300 clamp(4.5rem,14vw,12rem)/.7 "Cormorant Garamond";letter-spacing:-.055em}h1 small{display:block;font:300 .085em Inter;letter-spacing:.3em;text-transform:uppercase;margin-bottom:1.8rem}h2{font:300 clamp(3rem,8vw,7.7rem)/.88 "Cormorant Garamond";letter-spacing:-.04em}.lead{font:300 clamp(1.25rem,2.4vw,2rem)/1.5 "Cormorant Garamond";color:#d2ccc1}
.hero{height:145vh;background:radial-gradient(circle at 50% 38%,rgba(120,94,48,.09),transparent 40%)}.hero .copy{position:sticky;top:31vh}.enter{position:absolute;bottom:8vh;text-align:center;font-size:.52rem;letter-spacing:.3em;color:#aaa}.enter b{display:block;color:#e5ddd0;font:italic 1.15rem "Cormorant Garamond";letter-spacing:.04em;margin-bottom:.6rem}.enter:after{content:"";display:block;width:1px;height:60px;margin:1rem auto;background:linear-gradient(var(--g),transparent)}
.first{height:220vh}.sticky{position:sticky;top:0;height:100vh;width:100%;display:grid;place-items:center;overflow:hidden}.star{position:absolute;width:7px;height:7px;border-radius:50%;background:white;box-shadow:0 0 70px 25px rgba(255,239,202,.45)}.first img{position:absolute;width:min(360px,40vw);height:min(66vh,620px);object-fit:cover;opacity:0;filter:blur(20px) brightness(.3);transform:scale(.2);box-shadow:0 35px 120px #000}.first .sticky:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(7,7,7,.82),transparent 33%,transparent 67%,rgba(7,7,7,.82));pointer-events:none}.first .copy{position:absolute;inset:0;z-index:3;max-width:none;padding:9vh 7vw;opacity:0;text-align:left;text-shadow:0 3px 24px #000}.first .kicker{position:absolute;top:8vh;left:50%;transform:translateX(-50%);white-space:nowrap}.date{position:absolute;left:7vw;top:34%;font:300 clamp(4.5rem,9vw,8.5rem)/.75 "Cormorant Garamond";color:#f5efe4;text-shadow:0 4px 32px #000}.date span{display:block;font:300 clamp(.65rem,1.1vw,.85rem)/1 Inter;letter-spacing:.55em;margin:1.2rem 0;color:var(--g)}.first-story{position:absolute;right:6vw;bottom:12vh;width:min(34vw,430px)}.first-story h2{font-size:clamp(2.8rem,5vw,5.3rem);margin-bottom:1rem}.first-story .lead{font-size:clamp(1.1rem,1.8vw,1.6rem)}
.breath{min-height:90vh}.moment{min-height:140vh;position:relative;display:grid;align-items:center;padding:10vw;overflow:hidden}.moment img{width:min(44vw,550px);height:75vh;object-fit:cover;box-shadow:0 45px 130px #000}.moment .words{position:absolute;z-index:3;max-width:440px}.words p{font:italic 300 clamp(1.8rem,3.3vw,3.1rem)/1.2 "Cormorant Garamond"}.moment.left img{justify-self:12%}.moment.left .words{right:11%}.moment.right img{justify-self:end;margin-right:9%}.moment.right .words{left:9%}.tag{font-size:.55rem;letter-spacing:.25em;color:var(--g);margin-bottom:1rem}
.voice{height:220vh;background:linear-gradient(transparent,#0d0c0a 20%,#0d0c0a 82%,transparent)}.voice .sticky{grid-template-columns:.8fr 1.2fr;gap:6vw;padding:4vh 9vw;overflow:visible}.voice-img{position:relative;z-index:2;width:100%;height:72vh;object-fit:cover;filter:saturate(.82) brightness(.76);box-shadow:0 40px 130px #000,0 0 0 1px rgba(186,155,98,.28)}.voice-copy{position:relative;z-index:4}.voice h2{font-size:clamp(2.35rem,4.5vw,4.8rem);margin-bottom:.4rem}#wave{width:100%;height:82px}.controls{position:relative;z-index:8;display:flex;align-items:center;gap:1rem;min-height:64px}.play{display:grid;place-items:center;width:58px;height:58px;flex:none;border:1px solid #ead9b8;border-radius:50%;background-color:#eee7da;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 14'%3E%3Cpath fill='%230a0908' d='M1 1l10 6-10 6z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:54% 50%;background-size:12px 14px;box-shadow:0 0 0 7px rgba(186,155,98,.08),0 8px 28px rgba(0,0,0,.6);cursor:pointer}.play.playing{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 14'%3E%3Crect fill='%230a0908' x='1' y='1' width='3' height='12'/%3E%3Crect fill='%230a0908' x='8' y='1' width='3' height='12'/%3E%3C/svg%3E");background-position:center}.seek{height:3px;flex:1;background:#3a342a;cursor:pointer}.seek i{display:block;width:0;height:100%;background:var(--g);box-shadow:0 0 12px var(--g)}.volume{width:70px;accent-color:var(--g)}.notes{display:grid;grid-template-columns:1fr 1fr;gap:.65rem;margin:.65rem 0}.notes button{display:flex;align-items:center;gap:.7rem;min-width:0;border:1px solid var(--line);background:rgba(255,255,255,.025);color:#d4cec2;padding:.75rem .8rem;cursor:pointer;text-align:left}.notes button:before{content:"";display:block;flex:none;width:28px;height:28px;border-radius:50%;background-color:var(--g);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 14'%3E%3Cpath fill='%23090807' d='M1 1l10 6-10 6z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:54% 50%;background-size:8px 10px}.notes button.playing:before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 14'%3E%3Crect fill='%23090807' x='1' y='1' width='3' height='12'/%3E%3Crect fill='%23090807' x='8' y='1' width='3' height='12'/%3E%3C/svg%3E");background-position:center}.notes .active{color:white;border-color:var(--g);background:rgba(186,155,98,.08)}.after{font:italic 1.25rem/1.3 "Cormorant Garamond";color:#aaa;margin:.7rem 0}
.confess{height:210vh}.confess .sticky{isolation:isolate}.pair{position:absolute;inset:0}.pair img{position:absolute;top:19%;width:min(30vw,410px);height:62vh;object-fit:cover;box-shadow:0 40px 120px #000}.pair img:first-child{left:8%}.pair img:last-child{right:8%}.orbit{position:absolute;width:min(68vw,850px);aspect-ratio:1;border:1px solid rgba(186,155,98,.18);border-radius:50%}.confess .copy{mix-blend-mode:difference}
.portrait{min-height:160vh;display:grid;place-items:center;overflow:hidden}.portrait-wrap{position:relative;width:min(72vw,760px);height:100vh;display:grid;place-items:center}.portrait img{width:100%;height:82vh;object-fit:cover;box-shadow:0 50px 150px #000}.portrait p{position:absolute;inset:auto -20% 8%;font:italic 300 clamp(3rem,7vw,7rem)/.9 "Cormorant Garamond";text-align:center;mix-blend-mode:difference}
.favourite{height:340vh;background:#050505}.fav-light{position:absolute;width:65vw;height:65vw;border-radius:50%;background:radial-gradient(circle,rgba(202,169,106,.2),transparent 67%);opacity:0}.fav-photo{position:absolute;width:min(52vw,520px);height:min(76vh,740px);object-fit:cover;opacity:0;filter:blur(25px) brightness(.25);transform:scale(.72);box-shadow:0 45px 160px #000}.fav-text{position:absolute;z-index:3;text-align:center;opacity:0;mix-blend-mode:difference}.fav-text.one{top:45%}.fav-text.two{top:68%}.fav-text p{font:300 clamp(2.1rem,4.4vw,4.5rem)/1.05 "Cormorant Garamond"}
.birthday{height:210vh}.birthday>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:brightness(.26) saturate(.72)}.birthday:after{content:"";position:absolute;inset:0;background:linear-gradient(#070707 0%,transparent 22%,rgba(0,0,0,.14) 56%,#070707 100%)}.birthday .copy{position:sticky;top:8vh}.birthday h2{font-size:clamp(4rem,10vw,9rem);margin-bottom:1rem}.birthday-date{font-size:.65rem;letter-spacing:.35em;color:#dfc58f;margin-bottom:1.2rem}.age{font:300 clamp(8rem,24vw,20rem)/.7 "Cormorant Garamond";color:transparent;-webkit-text-stroke:1px rgba(238,233,223,.68);text-shadow:0 0 60px rgba(186,155,98,.2);margin-bottom:2rem}.age small{display:block;font:300 .055em/1 Inter;color:var(--w);-webkit-text-stroke:0;letter-spacing:.42em;text-transform:uppercase;margin-top:1.6rem}.gesture{position:relative;z-index:5;width:max-content;max-width:88vw;margin:1rem auto 0;padding:.7rem 1rem;border:1px solid rgba(186,155,98,.3);background:rgba(7,7,7,.46);backdrop-filter:blur(10px);font-size:.55rem;letter-spacing:.18em;text-align:center;color:#d8c9ad;animation:pulse 2s ease-in-out infinite}@keyframes pulse{50%{opacity:.48}}
.letter-scene{min-height:150vh;background:#dcd4c5;color:#171512}.letter{position:relative;max-width:760px;padding:9vw 6vw;background:#e8e0d3;box-shadow:0 50px 140px rgba(0,0,0,.45);transform:rotate(-1deg)}.letter p{white-space:pre-line;font:clamp(1.35rem,2.5vw,1.9rem)/1.55 "La Belle Aurore"}.signature{font:2rem "La Belle Aurore";color:#6d5734}
.finale{height:220vh}.heart{position:absolute;width:min(60vw,630px)}.heart path{fill:none;stroke:var(--g);stroke-width:.45;stroke-dasharray:1 9;stroke-linecap:round;filter:drop-shadow(0 0 6px var(--g))}.shoot{position:absolute;width:180px;height:1px;background:linear-gradient(90deg,transparent,#fff);transform:rotate(-24deg);opacity:0}.final-copy{opacity:0}.hint{position:fixed;z-index:70;left:50%;bottom:5vh;transform:translate(-50%,20px);width:max-content;max-width:88vw;padding:.8rem 1.2rem;background:var(--w);color:#171512;font:1.2rem/1.25 "Cormorant Garamond";text-align:center;opacity:0;pointer-events:none}
#voiceAudio{position:absolute;width:0;height:0;opacity:0;pointer-events:none}#wave{display:block;position:relative;z-index:1;pointer-events:none;margin-bottom:.35rem}.notes{position:relative;z-index:2}.controls{position:relative;z-index:30;isolation:isolate;margin-top:.35rem}.play{position:relative;z-index:40;pointer-events:auto;touch-action:manipulation}.play:before{content:"";position:absolute;inset:-14px;border-radius:50%}.game-start,.game-again,.game-close{border:1px solid var(--g);color:white;background:rgba(186,155,98,.1);padding:1rem 1.4rem;font-size:.58rem;letter-spacing:.2em;cursor:pointer}.game-start{background:var(--w);color:#11100e}.pop-game{position:fixed;inset:0;z-index:110;display:none;background:radial-gradient(circle at 50% 42%,#17130d,#050505 58%);color:var(--w);overflow:hidden}.pop-game.active{display:block}.game-active{overflow:hidden}.game-active #fx{z-index:120;pointer-events:auto;touch-action:none}.game-head{position:absolute;z-index:130;inset:max(1.2rem,env(safe-area-inset-top)) max(1.2rem,env(safe-area-inset-right)) auto max(1.2rem,env(safe-area-inset-left));display:flex;justify-content:space-between;align-items:flex-start;gap:1rem;pointer-events:none}.game-head span{display:block;color:var(--g);font-size:.52rem;letter-spacing:.28em;margin-bottom:.65rem}.game-head strong{display:block;max-width:380px;font:italic 1.25rem/1.25 "Cormorant Garamond";color:#cfc7ba}.game-close{pointer-events:auto;background:rgba(7,7,7,.7)}.game-score{position:absolute;z-index:130;left:50%;top:50%;transform:translate(-50%,-50%);text-align:center;pointer-events:none}.game-score b{display:block;font:300 clamp(6rem,20vw,13rem)/.72 "Cormorant Garamond";color:rgba(238,233,223,.09)}.game-score span{font-size:.52rem;letter-spacing:.32em;color:rgba(186,155,98,.55)}.game-finish{position:absolute;z-index:135;inset:0;display:grid;place-content:center;text-align:center;padding:8vw;background:radial-gradient(circle,#17130d 0%,rgba(7,7,7,.97) 48%,#050505 75%);opacity:0;visibility:hidden;transform:scale(1.04);transition:.9s;pointer-events:none}.pop-game.finished .game-finish{opacity:1;visibility:visible;transform:none;pointer-events:auto}.game-finish h2{font-size:clamp(3.5rem,10vw,8rem)}.game-finish p{font:italic 1.8rem "Cormorant Garamond";color:var(--g)}
@media(pointer:fine) and (min-width:900px){html,body,button,input,a,select,.seek,.photo{cursor:none!important}.cursor-dot,.cursor-ring{display:block;position:fixed;z-index:300;left:0;top:0;border-radius:50%;pointer-events:none;will-change:transform;opacity:.85}.cursor-dot{width:6px;height:6px;margin:-3px;background:var(--w);box-shadow:0 0 10px rgba(238,233,223,.45)}.cursor-ring{width:34px;height:34px;margin:-17px;border:1px solid rgba(238,233,223,.55);transition:width .25s,height .25s,margin .25s,border-color .25s,opacity .25s}.cursor-ring.hover{width:54px;height:54px;margin:-27px;border-color:var(--g);opacity:1}}
@media(max-width:900px){h1{font-size:clamp(4rem,16vw,8rem)}h2{font-size:clamp(2.7rem,9vw,5.5rem)}.scene{padding:14vw 7vw}.moment img{width:58vw}.voice .sticky{padding-inline:6vw;gap:4vw}.voice h2{font-size:clamp(2.1rem,5.5vw,3.5rem)}.first img{width:min(390px,52vw)}.date{left:5vw}.first-story{right:4vw}}
@media(max-width:600px){.top{padding:1rem}.mark{font-size:1rem}.hero{height:120vh}.hero .copy{top:27vh}.enter{bottom:5vh}.scene{padding:18vw 7vw}.first{height:180vh}.first img{width:74vw;height:58vh;top:16vh}.first .sticky:after{background:linear-gradient(180deg,#070707 0%,transparent 22%,transparent 58%,#070707 86%)}.first .copy{padding:0 6vw;text-align:center}.first .kicker{top:7vh;font-size:.5rem}.date{left:6vw;right:6vw;top:26vh;font-size:19vw;text-align:center}.date span{font-size:.62rem;margin:.8rem}.first-story{left:8vw;right:8vw;bottom:7vh;width:auto;text-align:center}.first-story h2{font-size:12vw;margin-bottom:.6rem}.first-story .lead{font-size:1.15rem}.breath{min-height:75vh}.moment{min-height:105vh;padding:8vw;align-items:start}.moment img{width:84vw;height:68vh;justify-self:center!important;margin:7vh 0 0!important}.moment .words{left:7vw!important;right:7vw!important;bottom:4vh;text-align:center}.words p{font-size:2rem}.voice{height:auto;min-height:150vh;padding:10vh 0}.voice .sticky{position:relative;top:auto;height:auto;min-height:130vh;display:flex;flex-direction:column;padding:0 7vw;overflow:visible}.voice-img{position:relative;inset:auto;width:72vw;height:48vh;opacity:1;margin:0 auto 2rem}.voice-copy{padding:0}.voice h2{font-size:2.45rem}.voice .kicker{line-height:1.5}.notes{grid-template-columns:1fr}.notes button{padding:.75rem}.controls{min-height:58px}.play{width:50px;height:50px}.volume{display:none}.after{font-size:1.15rem}.confess{height:170vh}.pair img{top:22%;width:57vw;height:48vh}.pair img:first-child{left:-18%}.pair img:last-child{right:-18%}.confess .copy{padding:0 7vw}.confess .copy h2{font-size:12vw}.portrait{min-height:120vh}.portrait-wrap{width:88vw;height:90vh}.portrait img{height:70vh}.portrait p{inset:auto -2vw 5%;font-size:13vw}.favourite{height:210vh}.fav-photo{width:82vw;height:68vh}.fav-text{left:7vw;right:7vw}.fav-text.one{top:42%}.fav-text.two{top:70%}.fav-text p{font-size:9vw}.birthday{height:180vh}.birthday .copy{top:10vh}.birthday h2{font-size:15vw}.age{font-size:42vw}.letter-scene{padding:12vw 5vw}.letter{padding:18vw 8vw}.final-copy{padding:0 7vw}.final-copy h2{font-size:12vw}.heart{width:92vw}}
@media(max-width:600px){.game-head{align-items:flex-start}.game-head strong{font-size:1.05rem;max-width:230px}.game-close{padding:.8rem;font-size:.5rem}.game-score b{font-size:34vw}.game-finish{padding:10vw 7vw}.game-finish h2{font-size:14vw}.game-invite .game-start{width:100%}}
@media(max-width:600px){.favourite{height:300vh}.birthday{height:190vh}.birthday .copy{top:max(1rem,env(safe-area-inset-top));height:calc(100vh - max(2rem,env(safe-area-inset-top)));max-height:100vh;padding:2vh 4vw;display:flex;flex-direction:column;align-items:center;justify-content:center}.birthday-date{margin:0 0 .6rem;font-size:.56rem}.birthday .kicker{margin-bottom:.7rem;font-size:.5rem;line-height:1.5}.birthday .age{font-size:min(36vw,10rem);margin:0 0 1.1rem;line-height:.68}.birthday .age small{margin-top:.9rem;font-size:.06em}.birthday h2{font-size:min(13vw,4.2rem);margin-bottom:.6rem}.birthday .lead{max-width:90vw;margin-bottom:.2rem;font-size:1.08rem;line-height:1.25}.gesture{margin-top:.7rem;font-size:.48rem}.hint{white-space:normal}}
@media(max-width:380px), (max-width:600px) and (max-height:680px){.hero h1{font-size:17vw}.first-story{bottom:4vh}.first-story h2{font-size:10vw}.voice{padding-top:6vh}.voice-img{height:40vh;margin-bottom:1rem}.voice h2{font-size:2rem}.voice #wave{height:45px}.birthday-date{font-size:.5rem}.birthday .kicker{font-size:.45rem}.birthday .age{font-size:29vw;margin-bottom:.7rem}.birthday h2{font-size:11vw}.birthday .lead{font-size:.95rem;margin-bottom:2.2rem}.fav-text p{font-size:8vw}}
.mark{border:0;background:none;color:inherit;font:1.2rem Italiana;letter-spacing:.05em;cursor:pointer}
.mark:after{content:"";display:inline-block;width:3px;height:3px;margin:0 0 .35rem .4rem;border-radius:50%;background:var(--g);animation:pulse 2.6s ease-in-out infinite}
.archive{position:fixed;inset:0;z-index:150;display:none;grid-template-rows:auto auto auto minmax(0,1fr);background:linear-gradient(#0a0908,#050505);color:var(--w)}
.archive.active{display:grid}
.archive-open{overflow:hidden}
.arc-head{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem;padding:max(1.3rem,env(safe-area-inset-top)) max(1.3rem,env(safe-area-inset-right)) 1rem max(1.3rem,env(safe-area-inset-left));border-bottom:1px solid var(--line)}
.arc-head .kicker{margin-bottom:.6rem}
.arc-head strong{display:block;max-width:420px;font:italic 300 1.35rem/1.2 "Cormorant Garamond";color:#d7d0c4}
.arc-actions{display:flex;align-items:center;gap:.55rem}.arc-close,.arc-tools-toggle{flex:none;border:1px solid var(--line);background:rgba(255,255,255,.03);color:#ddd6ca;padding:.7rem .95rem;font-size:.5rem;letter-spacing:.18em;cursor:pointer}
.arc-close:hover,.arc-tools-toggle:hover{border-color:var(--g);color:white}
.arc-tools-toggle{display:flex;align-items:center;gap:.7rem}.arc-tools-toggle i{width:7px;height:7px;border-right:1px solid var(--g);border-bottom:1px solid var(--g);transform:rotate(45deg) translateY(-2px);transition:transform .25s}.archive.tools-open .arc-tools-toggle i{transform:rotate(225deg) translate(-1px,-1px)}
.arc-legend{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:.7rem max(1.3rem,env(safe-area-inset-left));font-size:.48rem;letter-spacing:.22em;color:#7d7568;border-bottom:1px solid var(--line)}
.arc-legend .her:before,.arc-legend .mine:after{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;vertical-align:middle}
.arc-legend .her:before{margin-right:.5rem;background:rgba(238,233,223,.35)}
.arc-legend .mine:after{margin-left:.5rem;background:var(--g)}
.arc-tools{position:relative;display:none;grid-template-columns:minmax(260px,1.2fr) minmax(250px,.8fr) minmax(150px,.45fr) auto;align-items:end;gap:.7rem;padding:.8rem max(1.3rem,env(safe-area-inset-left));border-bottom:1px solid var(--line);background:rgba(255,255,255,.015)}.archive.tools-open .arc-tools{display:grid;animation:arcDrop .25s ease-out}@keyframes arcDrop{from{opacity:0;transform:translateY(-8px)}}
.arc-field label{display:block;margin-bottom:.38rem;font-size:.43rem;letter-spacing:.2em;color:#897f6d}
.arc-field>div{display:flex;min-width:0}
.arc-field input{width:100%;min-width:0;height:36px;border:1px solid var(--line);border-right:0;border-radius:0;background:#0d0c0a;color:var(--w);padding:0 .7rem;font:400 .72rem Inter;outline:none;user-select:text;-webkit-user-select:text;color-scheme:dark}
.arc-field input:focus{border-color:rgba(186,155,98,.58);box-shadow:inset 0 0 0 1px rgba(186,155,98,.08)}
.arc-field input::placeholder{color:#665f54}
.arc-search-clear,.arc-date-go,.arc-search-prev,.arc-search-next{height:36px;flex:none;border:1px solid var(--line);background:rgba(186,155,98,.08);color:#cbb892;padding:0 .75rem;font-size:.44rem;letter-spacing:.16em;cursor:pointer}.arc-search-prev,.arc-search-next{position:relative;width:36px;padding:0}.arc-search-prev i,.arc-search-next i{position:absolute;inset:0;margin:auto;width:7px;height:7px;border-top:1px solid var(--g);border-left:1px solid var(--g)}.arc-search-prev i{transform:rotate(-45deg)}.arc-search-next i{transform:rotate(135deg)}.arc-search-prev:disabled,.arc-search-next:disabled{opacity:.3}
.arc-results{align-self:center;min-width:92px;font-size:.44rem;letter-spacing:.16em;color:var(--g);text-align:right}
.arc-body{position:relative;min-height:0;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;touch-action:pan-y;padding:1.6rem max(1.3rem,env(safe-area-inset-left));scrollbar-width:thin;scrollbar-color:#6b5a3d #080808}
.arc-body::-webkit-scrollbar{width:7px}.arc-body::-webkit-scrollbar-track{background:#080808}.arc-body::-webkit-scrollbar-thumb{background:#6b5a3d;border-radius:8px}
.arc-state{padding:3rem 0;text-align:center;font:italic 1.2rem "Cormorant Garamond";color:#8d8578}
.arc-empty{padding:18vh 1rem;text-align:center;font:italic 1.35rem "Cormorant Garamond";color:#8d8578}
.arc-list{max-width:760px;margin:auto}
.arc-day{display:flex;align-items:center;gap:1rem;margin:2rem 0 1.3rem;font-size:.46rem;letter-spacing:.28em;color:var(--g)}
.arc-day:before,.arc-day:after{content:"";flex:1;height:1px;background:var(--line)}
.msg{display:flex;margin-bottom:.5rem}
.msg.mine{justify-content:flex-end}
.bub{position:relative;max-width:min(78%,470px);padding:.6rem .8rem .5rem;border:1px solid rgba(238,233,223,.09);background:rgba(255,255,255,.035)}
.msg.mine .bub{border-color:rgba(186,155,98,.28);background:rgba(186,155,98,.1)}
.msg.search-hit .bub{border-color:var(--g);box-shadow:0 0 0 1px rgba(186,155,98,.22),0 0 32px rgba(186,155,98,.12)}
.bub p{margin:0;font:400 .92rem/1.45 Inter;color:#e6e0d5;white-space:pre-wrap;overflow-wrap:anywhere}
.bub mark{background:rgba(186,155,98,.3);color:#fff4dc;padding:0 .08em}
.bub p.del{font-style:italic;color:#7f776a}
.bub .chip+p{margin-top:.5rem}
.mtime{display:block;margin-top:.3rem;font-size:.46rem;letter-spacing:.14em;color:#7b7367;text-align:right}
.chip{display:inline-flex;align-items:center;gap:.55rem}
.chip em{font-style:normal;font-size:.46rem;letter-spacing:.2em;color:#a99c82}
.chip .cbox{position:relative;width:42px;height:42px;flex:none;border:1px solid rgba(186,155,98,.35);border-radius:5px;background:radial-gradient(circle at 50% 40%,rgba(186,155,98,.16),rgba(255,255,255,.02))}
.chip .cbox:after{content:"";position:absolute;inset:0;margin:auto;width:11px;height:11px;background:var(--g);opacity:.75;clip-path:polygon(50% 0,61% 35%,98% 35%,68% 57%,79% 91%,50% 70%,21% 91%,32% 57%,2% 35%,39% 35%)}
.chip.image .cbox:after,.chip.video .cbox:after,.chip.gif .cbox:after,.chip.document .cbox:after{width:15px;height:12px;clip-path:polygon(0 100%,32% 44%,54% 74%,72% 52%,100% 100%)}
.chip.audio{min-width:150px}
.chip .cplay{position:relative;width:24px;height:24px;flex:none;border-radius:50%;background:var(--g)}
.chip .cplay:after{content:"";position:absolute;inset:0;margin:auto;width:0;height:0;border-left:7px solid #0a0908;border-top:4.5px solid transparent;border-bottom:4.5px solid transparent;transform:translateX(1px)}
.chip .cwave{display:flex;align-items:center;gap:2px;height:20px}
.chip .cwave b{width:2px;border-radius:2px;background:rgba(200,170,110,.55)}
.arc-jump{width:100%;height:36px;border:1px solid var(--line);background:#0d0c0a;color:#ddd6ca;padding:0 .5rem;font-size:.5rem;letter-spacing:.12em;cursor:pointer}
@media(max-width:600px){.arc-head strong{font-size:1.1rem;max-width:205px}.arc-head .kicker{font-size:.46rem;margin-bottom:.45rem}.arc-actions{flex-direction:column;align-items:stretch}.arc-tools-toggle{justify-content:center;font-size:0;padding:.65rem}.arc-tools-toggle:before{content:"FIND";font-size:.44rem;letter-spacing:.18em}.arc-close{padding:.65rem}.arc-tools{grid-template-columns:1fr;padding:.65rem .9rem;gap:.55rem}.arc-search,.arc-date,.arc-month{grid-column:1}.arc-results{position:absolute;right:.9rem;margin-top:-1.35rem;min-width:0}.arc-field input,.arc-jump{height:34px}.arc-search-clear,.arc-date-go,.arc-search-prev,.arc-search-next{height:34px}.arc-search-clear,.arc-date-go{padding:0 .58rem}.arc-body{padding:1.1rem .9rem}.bub{max-width:86%}.bub p{font-size:.88rem}.arc-legend{font-size:.44rem;letter-spacing:.16em;padding:.6rem .9rem}}
.grain,.light,.rail,.hint,#space,#fx,.heart,.shoot,.orbit,.star,.fav-light,#wave,.first .sticky:after,.birthday:after,.portrait p,.fav-text{pointer-events:none}
button{position:relative;z-index:8;touch-action:manipulation}
.controls,.notes,.load,.copy,.game-head>div{position:relative;z-index:12}
.sound:before,.start:before,.game-start:before,.game-close:before,.game-again:before,.mark:before,.arc-close:before{content:"";position:absolute;inset:-12px}
.game-invite{position:relative;z-index:20;min-height:100vh;background:radial-gradient(circle at 50% 45%,rgba(120,94,48,.1),transparent 45%)}
.game-invite .copy{position:relative;z-index:22}
.game-invite .game-start{position:relative;z-index:24;pointer-events:auto;touch-action:manipulation;-webkit-appearance:none;appearance:none}
.game-invite h2{font-size:clamp(2.6rem,7vw,6rem)}
.game-invite .game-start{margin-top:2.6rem}
@media(prefers-reduced-motion:reduce){.grain,.lottie:after,.gesture{animation:none}}