/* Reference-led scene. All lettering and story content remain in index.html. */
:root{--lavender:#f4bcf7;--muted:#e0d9ee;--line:#ebbcff4d}
body{background:#071330;isolation:isolate;text-shadow:0 2px 9px #030a29}
body:before{content:"";position:fixed;inset:0;z-index:-5;pointer-events:none;background:linear-gradient(90deg,#050c2829,transparent 62%),url("images/romantic-landscape-v2.png") center center/cover no-repeat}
body:after{content:"";position:fixed;inset:0;z-index:-4;pointer-events:none;background:linear-gradient(180deg,#03071f0d 20%,transparent 60%,#080b3212);box-shadow:inset 0 0 130px #060b2a40}
#universe{z-index:0}
main,.site-footer{position:relative;z-index:1}
.site-header{position:relative;z-index:2;max-width:none;padding-top:21px;padding-bottom:21px;background:linear-gradient(#020c285c,transparent)}
.nebula{z-index:-3;inset:-8%;background:radial-gradient(ellipse at 16% 68%,#fa8bc32a,transparent 35%),radial-gradient(ellipse at 85% 35%,#8182fd19,transparent 40%);animation:clouds-drift 22s ease-in-out infinite alternate}
.grain{opacity:.013}
.wordmark{color:#fff;font-size:23px;text-shadow:0 0 18px #d7baff8c}
.spark{font-size:38px;color:#f8c6f3;filter:drop-shadow(0 0 7px #ec9deb)}
.wordmark-en{color:#e4d9f0}
nav{font-family:var(--serif);font-size:14px;color:#f8efff}
.nav-last{background:linear-gradient(110deg,#d57be64a,#7971db45);border-color:#efbaff91;box-shadow:inset 0 0 13px #edb7ff2e,0 0 16px #e5a6f336}
.nav-last span{color:#ffd6ee}
.hero{padding-top:10px;padding-bottom:100px;min-height:calc(100svh - 94px);max-height:1050px}
.hero h1{font-family:"KaiTi","STKaiti",var(--serif);font-size:clamp(56px,6.1vw,92px);line-height:1.25;letter-spacing:4px;color:#fff5ff;text-shadow:0 0 8px #fac2ff70,0 0 25px #dcb4ff45,0 3px 16px #071331;margin-top:25px;margin-bottom:24px}
.hero h1 em{background:none;color:#ffe3fa;-webkit-text-fill-color:#ffe3fa;filter:drop-shadow(0 0 12px #ed9be596)}
.hero-description{color:#fff1ff;font-family:var(--serif);font-size:18px;line-height:2;letter-spacing:1px;text-shadow:0 2px 8px #060d2f,0 0 20px #0b113b}
.eyebrow{color:#f5dbff;text-shadow:0 1px 8px #14133e}
.hero .text-link{color:#fff2fb;font-size:14px;text-shadow:0 1px 5px #050b25}
.circle-arrow{border-color:#ffccf7a1;box-shadow:0 0 13px #fca4ed42;background:#5a366b30}
.dedication{color:#ede0f5}.dedication i{background:#f7d8ff70}
.portrait-universe{height:550px}
.portrait{border:2px solid #e8ecffcd;border-radius:10px;box-shadow:0 0 0 1px #bab9ff77,0 0 20px #95b5ff72,0 18px 45px #07102d8c}
.portrait-left,.portrait-right{height:365px;width:43%;top:80px}
.portrait-center{top:48px;height:385px;width:55%;left:23%;border-color:#fff3ff;box-shadow:0 0 12px #d4d8ffb3,0 0 35px #deb6ff63,0 22px 50px #07102d99}
.portrait-center img{object-position:64% center}
.portrait>span{background:linear-gradient(transparent,#131537d4);color:#fff6ff;text-shadow:0 1px 5px #0e1039}
.portrait-center>span{font-size:18px;padding-top:70px}
.portrait small{color:#f0d7ff}
.orbit{border-color:#e4b4f37a;box-shadow:0 0 10px #bca3ff16;transform:rotate(-24deg)}
.orbit-two{border-color:#b7c7ff4d;transform:rotate(29deg)}
.orbit-one:before{width:8px;height:8px;background:#fff3fd;box-shadow:0 0 9px #fff,0 0 24px #ff9ae1;offset-path:ellipse(50% 50% at 50% 50%);offset-distance:0%;left:0;top:0;animation:orbit-travel 18s linear infinite}
.orbit-two:after{content:"";position:absolute;inset:auto;left:0;top:0;width:5px;height:5px;border-radius:50%;background:white;box-shadow:0 0 15px #f4b3ff;offset-path:ellipse(50% 50% at 50% 50%);animation:orbit-travel 27s linear infinite reverse}
.orbit-star{color:#ffe4f8;text-shadow:0 0 10px #fff,0 0 24px #f59ed6}
.photo-note{color:#ffe4f8;text-shadow:0 0 9px #10204c}
.photo-caption{color:white}.photo-caption>span{color:#ead5f3}.photo-caption i{background:#f9d7ff7a}
.scroll-cue,.hero-coordinate{color:#f6defb;text-shadow:0 1px 6px #06112b}.scroll-cue span{background:linear-gradient(#ffd5f3,transparent)}
.moments,.letter-section,.question,.together{width:calc(100% - 10%);max-width:1230px;padding-left:4%;padding-right:4%;margin-bottom:55px;border:1px solid #d7b9ff70;border-radius:28px;background:linear-gradient(115deg,#11204cbe,#141c46ac 48%,#241d51ac);box-shadow:inset 0 0 25px #a3b4ff13,0 0 24px #8299ff1d,0 15px 50px #030b283d;backdrop-filter:blur(9px)}
.moments{padding-top:42px;padding-bottom:55px}.section-top{padding-top:0;border-top:0}.section-top>span{color:#dec9ed}.section-heading{margin-top:30px}.section-heading>p{color:#eee2fa}.memory h3{color:#fff4fd}.memory>p:last-child{color:#ded4eb}.memory-label{color:#ffcaef}.memory-marker span{color:#f4c5ec}.memory-marker i{background:linear-gradient(90deg,#fbb7e78c,#b6abff33)}.memory-marker i:before{background:#ffe9ff;box-shadow:0 0 12px #f1a1e9}.interlude{color:#e7d1ef;margin-top:60px}.interlude span{color:#ffe5f5;text-shadow:0 0 14px #f4a0d961}
h2{color:#fff2ff;text-shadow:0 0 16px #b493e54f}h2 em{color:#ffb8e5;text-shadow:0 0 18px #f19be96b}
.letter-section{padding-top:65px;padding-bottom:65px}.letter-intro>p:not(.eyebrow){color:#e9def7}.handwritten{color:#ffc0e8;text-shadow:0 0 18px #ff9ee65e}
.envelope{background:linear-gradient(145deg,#9d7dbb9c,#4e54889e);border-color:#f8caf0b5;box-shadow:0 0 35px #e5abf138,0 25px 55px #020f3299;border-radius:12px}.envelope-to{color:#fff0fc}.envelope-sub{color:#f1dbf3}.envelope-star{color:#ffe4f4;text-shadow:0 0 25px #ffbcfc}.envelope:before,.envelope:after{border-color:#ffd6ee7a}.envelope-bottom{color:#f4d8f8}.seal{border-color:#ffd4f6;background:linear-gradient(110deg,#f5c1e6,#b3a3e5);color:#35254d;text-shadow:none;box-shadow:0 0 22px #f9b2e780}.seal:hover{background:linear-gradient(110deg,#ffe1f5,#c8b7fd);box-shadow:0 0 35px #f5adff9c}.letter-paper{border-radius:9px;text-shadow:none;box-shadow:0 0 28px #e5b5ff4f,0 25px 55px #020f3280}
.question{padding-top:85px;padding-bottom:65px;background:radial-gradient(ellipse at 50% 45%,#8654904f,transparent 65%),linear-gradient(120deg,#0d1c44c2,#211b45b5)}.question-prelude{color:#ffe0f4}.question-description{color:#f3e1f5}.question-orbit{border-color:#efb9ee57;box-shadow:0 0 22px #ebafff10}.question-orbit:after{border-color:#b3baff30}.question-orbit>span{color:#ffd7f4;text-shadow:0 0 15px #f9b1e3}.yes-button{position:relative;isolation:isolate;background:linear-gradient(110deg,#f889de,#bf7bfa 48%,#807cf4);color:#fff;font-weight:600;border:1px solid #ffe2ff;box-shadow:inset 0 0 20px #ffe8ff47,0 0 13px #ffa7ed,0 0 34px #bb7cfc7a;text-shadow:0 0 6px #ffffff47;animation:answer-glow 3.5s ease-in-out infinite}.yes-button:before{content:"";position:absolute;inset:-11px -28px;z-index:-1;pointer-events:none;border:1px solid #ffd0f6a6;border-radius:50%;transform:rotate(-7deg);box-shadow:0 0 10px #fdadf352;animation:halo-breathe 5s ease-in-out infinite}.yes-button:hover{box-shadow:inset 0 0 20px #fff3,0 0 20px #ffb2f8,0 0 65px #e898ffa8}.later-button{color:#f0d7ee;text-decoration-color:#f7d2f786}.gentle-note{color:#d7c7e6}.answer-message{color:#ffe1f5}.next-chapter p{color:#e0cde9}.next-chapter>span{color:#ffd3f1;text-shadow:0 0 15px #f5a6f3}
.together{padding-top:65px;padding-bottom:70px}.together-heading>p:last-child{color:#ffe5f6}.together-heart{color:#ffb7e8;text-shadow:0 0 20px #fb87d7,0 0 60px #dba4ff}.couple-photo{border:1px solid #fce4ff;box-shadow:0 0 16px #dcb1ff70,0 20px 45px #01092780;text-shadow:none}.composite-note{color:#e8d7f0}.future-list p{color:#fff0fb}.future-list span{color:#ffc4eb}.together>.text-link{color:#f1d4ec}
.site-footer{border-color:#e6c9ff3d;color:#ebd4f1;background:linear-gradient(transparent,#0b143864);padding-top:25px}.motion-toggle{background:#1b2554b5;border-color:#f0bbf275;color:#ffe3fa;box-shadow:0 0 14px #cf9af52b}.motion-icon{color:#ffd5f4}#progress{background:linear-gradient(90deg,#a1b6ff,#ffade6);box-shadow:0 0 6px #ffd0f3}
.motion-paused:before,.motion-paused:after,.motion-paused .nebula,.motion-paused .orbit:before,.motion-paused .orbit:after,.motion-paused .yes-button,.motion-paused .yes-button:before{animation-play-state:paused!important}
@keyframes clouds-drift{from{translate:-1% 0;opacity:.6}to{translate:2% -1%;opacity:1}}
@keyframes orbit-travel{to{offset-distance:100%}}
@keyframes answer-glow{50%{box-shadow:inset 0 0 25px #fff5,0 0 18px #ffa7ed,0 0 50px #bb7cfcb3}}
@keyframes halo-breathe{50%{transform:rotate(4deg) scale(1.04);opacity:.5}}
@media(max-width:1050px){.hero h1{font-size:65px}.hero-description{font-size:16px}.portrait-universe{height:480px}.portrait-left,.portrait-right{height:310px}.portrait-center{height:330px;top:60px}.portrait-center>span{font-size:15px}}
@media(max-width:760px){.site-header{padding:22px 6%;background:linear-gradient(#08113766,transparent)}.wordmark{font-size:16px}.spark{font-size:30px}.hero{padding-top:28px;padding-bottom:80px;min-height:auto}.hero-copy{filter:drop-shadow(0 0 12px #081135bb)}.hero h1{font-size:clamp(47px,11vw,69px);line-height:1.3;letter-spacing:3px}.hero-description{font-size:16px;line-height:1.9}.hero .text-link{font-size:12px}.hero .eyebrow{font-size:8px}.portrait-universe{height:440px;margin-top:45px;width:87%}.portrait-left,.portrait-right{top:65px;height:290px}.portrait-center{height:305px;top:40px}.portrait-center>span{font-size:14px}.portrait{border-width:1.5px}.photo-caption{bottom:0}.photo-caption p{font-size:14px}.moments,.letter-section,.question,.together{width:90%;padding-left:6%;padding-right:6%;border-radius:20px;margin-bottom:32px;backdrop-filter:blur(7px)}.moments{padding-top:28px;padding-bottom:38px}.section-top>span{font-size:9px}.section-heading{margin-top:26px}.section-heading>p{font-size:14px}.interlude{margin-top:35px;font-size:18px}.letter-section{padding-top:36px;padding-bottom:37px}.letter-section:before{display:none}.letter-intro>p:not(.eyebrow){font-size:14px}.envelope{min-height:300px}.question{padding-top:55px;padding-bottom:42px}.question h2{font-size:clamp(27px,6.9vw,45px)}.question-description{font-size:13px}.question-orbit{height:340px;top:75px}.answer-buttons{gap:20px;flex-wrap:wrap}.yes-button{padding:14px 28px}.yes-button:before{inset:-8px -17px}.next-chapter{margin-top:32px}.next-chapter p{font-size:10px}.gentle-note{font-size:10px}.together{padding-top:40px;padding-bottom:45px}.together h2{font-size:26px}.future-list p{font-size:16px}.composite-note{font-size:11px}.site-footer{margin-top:10px}.motion-toggle{font-size:9px}.couple-gallery{max-width:300px}}
@media(prefers-reduced-motion:reduce){.nebula,.orbit:before,.orbit:after,.yes-button,.yes-button:before{animation:none!important}}
