:root{--night:#061327;--night-2:#0a2340;--ink:#f7edcf;--muted:#b7c5d4;--gold:#f4c46d;--amber:#ff9d45;--line:rgba(244,196,109,.24);--serif:'Gilda Display',serif;--sans:'Be Vietnam Pro',sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth;background:var(--night)}body{margin:0;color:var(--ink);font-family:var(--sans);background:var(--night);overflow-x:hidden}.grain{position:fixed;inset:0;pointer-events:none;z-index:90;opacity:.14;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.95' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.35'/%3E%3C/svg%3E")}.progress{position:fixed;z-index:100;left:0;right:0;top:0;height:2px;background:rgba(255,255,255,.08)}.progress span{display:block;width:0;height:100%;background:linear-gradient(90deg,var(--amber),#fff1a8);box-shadow:0 0 12px var(--gold)}
.topbar{height:82px;position:fixed;inset:0 0 auto;z-index:70;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:0 4.5vw;color:#fff;mix-blend-mode:screen;transition:background .5s,backdrop-filter .5s}.topbar.scrolled{background:rgba(3,12,25,.66);backdrop-filter:blur(18px)}.monogram{color:inherit;text-decoration:none;font:1.2rem var(--serif);letter-spacing:.12em}.monogram span{color:var(--gold);font-size:.8em;margin:0 .18em}.topbar p{margin:0;text-transform:uppercase;letter-spacing:.24em;font-size:.68rem;color:rgba(255,255,255,.72)}.sound{justify-self:end;border:0;background:none;color:inherit;display:flex;align-items:center;gap:10px;cursor:pointer;font-family:inherit}.sound b{font-size:.67rem;letter-spacing:.16em;text-transform:uppercase;font-weight:500}.sound-bars{height:15px;display:flex;align-items:center;gap:2px}.sound-bars i{display:block;width:2px;height:5px;background:var(--gold);animation:sound 1s infinite alternate;animation-play-state:paused}.sound[aria-pressed=true] i{animation-play-state:running}.sound-bars i:nth-child(2){animation-delay:.25s;height:12px}.sound-bars i:nth-child(3){animation-delay:.5s;height:8px}@keyframes sound{to{height:14px}}
.scene{position:relative;min-height:100vh;padding:130px 8vw;overflow:hidden}.hero{display:flex;align-items:center;isolation:isolate}.hero-bg{position:absolute;inset:-8%;z-index:-3;background:linear-gradient(90deg,rgba(3,12,26,.83) 0%,rgba(3,12,26,.36) 48%,rgba(3,12,26,.08) 70%),url('assets/trung-thu-night.png') center/cover no-repeat;transform:scale(1.08);will-change:transform}.hero:after{content:"";position:absolute;inset:auto 0 0;height:32%;z-index:-1;background:linear-gradient(transparent,var(--night))}.aurora{position:absolute;z-index:-2;width:70vw;height:70vw;left:-26vw;top:-35vw;background:radial-gradient(circle,rgba(44,126,165,.3),transparent 64%);filter:blur(40px);animation:breathe 7s ease-in-out infinite alternate}@keyframes breathe{to{transform:scale(1.22);opacity:.55}}
.stars span{position:absolute;border-radius:50%;background:#fff4c5;box-shadow:0 0 8px #fff;animation:twinkle 2.2s ease-in-out infinite alternate}@keyframes twinkle{to{opacity:.15;transform:scale(.5)}}.hero-copy{max-width:760px;margin-top:5vh}.eyebrow,.section-kicker{display:block;color:var(--gold);font-size:.72rem;letter-spacing:.28em;text-transform:uppercase;margin-bottom:28px}.hero h1,.scene h2,.wish-card h2{font-family:var(--serif);font-weight:400;margin:0;line-height:1.02;letter-spacing:-.035em}.hero h1{font-size:clamp(3rem,7.2vw,7.3rem)}em{font-style:italic;color:var(--gold)}.hero-copy>p{max-width:570px;font-weight:300;line-height:1.8;color:#d2dce4;font-size:clamp(1rem,1.25vw,1.15rem);margin:34px 0 0}.scroll-hint{position:absolute;bottom:38px;left:8vw;color:#dbe2e8;text-decoration:none;display:flex;align-items:center;gap:16px;font-size:.67rem;letter-spacing:.18em;text-transform:uppercase}.scroll-hint i{display:block;width:62px;height:1px;background:linear-gradient(90deg,var(--gold),transparent);animation:pulse 2s infinite}@keyframes pulse{50%{transform:scaleX(.6);transform-origin:left}}
.lantern{position:absolute;width:28px;height:37px;border-radius:46% 46% 40% 40%;background:radial-gradient(circle at 45% 40%,#ffe299,#f19637 50%,#833511);box-shadow:0 0 25px rgba(255,166,67,.65);opacity:.75;animation:float 7s ease-in-out infinite}.lantern:before,.lantern:after{content:"";position:absolute;left:50%;transform:translateX(-50%);width:14px;height:3px;background:#7d3b1b}.lantern:before{top:-2px}.lantern:after{bottom:-2px}.l1{left:42%;top:23%;animation-delay:-2s}.l2{left:64%;top:61%;transform:scale(.6);animation-delay:-5s}.l3{left:87%;top:32%;transform:scale(.4);animation-delay:-3s}@keyframes float{50%{translate:8px -25px;rotate:3deg}}
.reveal{opacity:0;transform:translateY(42px);transition:opacity 1s cubic-bezier(.2,.7,.2,1),transform 1s cubic-bezier(.2,.7,.2,1)}.reveal.active{opacity:1;transform:none}.letter{background:linear-gradient(180deg,var(--night) 0%,#0c2740 48%,#091d35 100%);display:flex;flex-direction:column;justify-content:center}.letter-grid{display:grid;grid-template-columns:1.15fr .7fr;gap:9vw;align-items:start}.scene h2{font-size:clamp(2.6rem,5.2vw,5.8rem)}.letter-copy{border-left:1px solid var(--line);padding-left:38px}.letter-copy p{font:clamp(1.02rem,1.3vw,1.22rem)/1.9 var(--sans);font-weight:300;color:#c6d3df;margin:0 0 24px}.signature{display:flex;align-items:center;gap:22px;margin-top:90px;font:1rem var(--serif);letter-spacing:.1em;color:#e8dcbd}.signature i{width:min(220px,20vw);height:1px;background:linear-gradient(90deg,var(--gold),transparent)}.orbit-moon{position:absolute;width:460px;height:460px;right:-130px;top:-120px;border:1px solid rgba(255,255,255,.06);border-radius:50%;animation:spin 30s linear infinite}.orbit-moon span{position:absolute;width:18px;height:18px;left:80px;top:46px;border-radius:50%;background:var(--gold);box-shadow:0 0 28px var(--gold)}@keyframes spin{to{transform:rotate(360deg)}}
.memories{background:#08192d;display:flex;flex-direction:column;justify-content:center}.memories:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 80% 20%,rgba(20,88,119,.28),transparent 34%),linear-gradient(115deg,transparent 40%,rgba(244,196,109,.035) 40.2%,transparent 40.4%);pointer-events:none}.moments{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin-top:90px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.moment{padding:44px 5vw 52px 0;position:relative;min-height:270px}.moment+ .moment{border-left:1px solid var(--line);padding-left:5vw}.moment>span{position:absolute;top:22px;right:22px;color:#8396a9;font-size:.68rem;letter-spacing:.2em}.moment-icon{font:2.1rem var(--serif);color:var(--gold);margin-bottom:44px}.moment h3{font:400 1.65rem var(--serif);margin:0 0 16px}.moment p{color:#aebdcc;line-height:1.7;font-weight:300;margin:0;max-width:270px}.moment:nth-child(2){transition-delay:.12s}.moment:nth-child(3){transition-delay:.24s}
.promise{min-height:110vh;display:grid;place-items:center;text-align:center;background:radial-gradient(circle at 50% 35%,#173e5f 0%,#091b31 42%,#050f20 85%)}.promise-inner{max-width:930px;position:relative;z-index:2}.promise .section-kicker{margin-bottom:32px}.promise p{max-width:670px;margin:38px auto;color:#c4d0dc;font-weight:300;font-size:1.08rem;line-height:1.9}.wish-button{border:1px solid rgba(244,196,109,.55);background:rgba(244,196,109,.07);color:var(--ink);border-radius:100px;padding:7px 8px 7px 26px;display:inline-flex;align-items:center;gap:24px;font:500 .77rem var(--sans);letter-spacing:.12em;text-transform:uppercase;cursor:pointer;transition:transform .3s,background .3s,box-shadow .3s}.wish-button i{display:grid;place-items:center;width:48px;height:48px;border-radius:50%;background:var(--gold);color:#172137;font-style:normal}.wish-button:hover{transform:translateY(-4px);background:rgba(244,196,109,.14);box-shadow:0 12px 40px rgba(244,196,109,.15)}.ribbon{position:absolute;width:130vw;height:130vw;border:1px solid rgba(244,196,109,.08);border-radius:45%;animation:spin 70s linear infinite}.ribbon:before,.ribbon:after{content:"";position:absolute;inset:9%;border:inherit;border-radius:48%}.ribbon:after{inset:18%}.fireflies span{position:absolute;width:4px;height:4px;background:#ffd77f;border-radius:50%;box-shadow:0 0 12px #ffc04f;animation:fly 8s ease-in-out infinite}@keyframes fly{0%,100%{transform:translate(0,0);opacity:.2}40%{opacity:1}50%{transform:translate(42px,-80px)}}
.wish-modal{position:fixed;inset:0;z-index:200;display:grid;place-items:center;background:rgba(1,7,15,.8);backdrop-filter:blur(16px);opacity:0;visibility:hidden;transition:.55s}.wish-modal.open{opacity:1;visibility:visible}.modal-glow{position:absolute;width:55vw;height:55vw;border-radius:50%;background:radial-gradient(circle,rgba(244,196,109,.18),transparent 68%);transform:scale(.4);transition:transform 1s}.wish-modal.open .modal-glow{transform:scale(1)}.wish-card{position:relative;width:min(720px,calc(100% - 34px));padding:78px 72px;text-align:center;background:linear-gradient(145deg,rgba(18,47,72,.97),rgba(5,20,37,.98));border:1px solid rgba(244,196,109,.35);box-shadow:0 40px 120px #000;border-radius:4px;transform:translateY(40px) scale(.96);transition:.65s cubic-bezier(.2,.8,.2,1);overflow:hidden}.wish-card:before{content:"";position:absolute;inset:12px;border:1px solid rgba(244,196,109,.12);pointer-events:none}.wish-modal.open .wish-card{transform:none}.wish-card h2{font-size:clamp(2.2rem,5vw,4rem)}.wish-card>p:not(.eyebrow){color:#c8d4df;line-height:1.8;max-width:520px;margin:28px auto}.close{position:absolute;top:24px;right:28px;border:0;background:none;color:#dbe5ec;font-size:2rem;font-weight:200;cursor:pointer}.modal-moon{display:block;font:3rem var(--serif);color:var(--gold);margin-bottom:20px}.modal-sign{font-family:var(--serif);margin-top:38px;color:#e7dcc2}.modal-sign strong{color:var(--gold);font-weight:400;margin-left:6px}footer{padding:34px 5vw;background:#030b18;border-top:1px solid rgba(255,255,255,.06);display:flex;justify-content:space-between;gap:30px;color:#8595a7;font-size:.72rem;letter-spacing:.08em}footer p{margin:0}footer span{text-transform:uppercase;letter-spacing:.18em}
@media(max-width:800px){.topbar{height:68px;padding:0 20px}.topbar>p{display:none}.scene{padding:105px 24px}.hero{align-items:flex-end;padding-bottom:120px}.hero-bg{inset:-3%;background-position:62% center}.hero h1{font-size:clamp(3.05rem,14vw,5rem)}.hero-copy>p{line-height:1.7}.scroll-hint{left:24px}.l1{left:22%;top:18%}.l2{left:72%}.letter-grid{grid-template-columns:1fr;gap:45px}.letter-copy{padding-left:24px}.signature{margin-top:64px;gap:10px;flex-wrap:wrap}.signature i{width:50px}.moments{grid-template-columns:1fr;margin-top:55px}.moment{padding:36px 20px;min-height:auto}.moment+.moment{border-left:0;border-top:1px solid var(--line);padding-left:20px}.moment-icon{margin-bottom:20px}.promise{min-height:100vh}.wish-card{padding:65px 28px}.wish-button{font-size:.66rem;gap:12px;padding-left:18px}footer{flex-direction:column;text-align:center}.orbit-moon{width:300px;height:300px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.reveal{opacity:1;transform:none}}

/* Motion-rich edition */
.intro-curtain{position:fixed;inset:0;z-index:300;background:#030b18;display:grid;place-items:center;transition:clip-path 1.4s cubic-bezier(.7,0,.2,1) .35s;clip-path:circle(150% at 50% 50%)}
.intro-curtain.leave{clip-path:circle(0% at 50% 50%);pointer-events:none}
.intro-moon{width:82px;height:82px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff8c9,var(--gold) 55%,#c77731);box-shadow:0 0 70px rgba(244,196,109,.58);animation:introPulse 1.4s ease-in-out infinite}
.intro-curtain i{position:absolute;width:150px;height:1px;background:linear-gradient(90deg,transparent,var(--gold),transparent);animation:introLine 1.2s ease-in-out infinite}
@keyframes introPulse{50%{transform:scale(1.14);box-shadow:0 0 110px rgba(244,196,109,.75)}}
@keyframes introLine{50%{width:250px;opacity:.25}}
.cursor-glow{position:fixed;z-index:1;width:380px;height:380px;border-radius:50%;pointer-events:none;background:radial-gradient(circle,rgba(92,176,208,.12),transparent 66%);transform:translate(-50%,-50%);left:50%;top:50%;transition:opacity .3s;mix-blend-mode:screen}
.scene:not(.hero)::after{content:"";position:absolute;inset:auto 8vw 0;height:1px;background:linear-gradient(90deg,transparent,var(--line),transparent);transform:scaleX(.05);transform-origin:center;transition:transform 1.2s cubic-bezier(.2,.8,.2,1)}
.scene.in-view:not(.hero)::after{transform:scaleX(1)}
.cloud{position:absolute;z-index:-1;width:48vw;height:110px;border-radius:50%;background:radial-gradient(ellipse,rgba(179,207,222,.11),transparent 70%);filter:blur(16px);will-change:transform}
.cloud-a{top:23%;left:-22%;animation:cloudDrift 24s linear infinite}
.cloud-b{top:48%;right:-25%;animation:cloudDrift 31s linear infinite reverse}
@keyframes cloudDrift{to{transform:translateX(145vw) scale(1.2)}}
.shooting-stars span{position:absolute;width:110px!important;height:1px!important;background:linear-gradient(90deg,transparent,#fff6ca);transform:rotate(-28deg);filter:drop-shadow(0 0 5px var(--gold));animation:shoot 6s ease-in infinite;opacity:0}
@keyframes shoot{0%,72%{transform:translate(0,0) rotate(-28deg);opacity:0}75%{opacity:1}88%,100%{transform:translate(-42vw,27vw) rotate(-28deg);opacity:0}}
.reveal{filter:blur(7px);clip-path:inset(0 0 24% 0);transform:translateY(52px) scale(.98);transition:opacity 1.05s cubic-bezier(.2,.7,.2,1),transform 1.05s cubic-bezier(.2,.7,.2,1),filter 1s,clip-path 1.05s}
.reveal.active{filter:none;clip-path:inset(0)}
.signature i{animation:signatureGlow 2.4s ease-in-out infinite}
@keyframes signatureGlow{50%{box-shadow:0 0 18px var(--gold);transform:scaleX(.76)}}
.orbit-moon span{animation:moonBeat 2.8s ease-in-out infinite}
@keyframes moonBeat{50%{transform:scale(1.7);box-shadow:0 0 58px var(--gold)}}
.moment-icon{animation:iconFloat 3.8s ease-in-out infinite}.moment:nth-child(2) .moment-icon{animation-delay:-1.3s}.moment:nth-child(3) .moment-icon{animation-delay:-2.6s}
@keyframes iconFloat{50%{transform:translateY(-12px) rotate(10deg);text-shadow:0 0 22px var(--gold)}}
.moment{transition-property:opacity,transform,filter,clip-path,background}.moment:hover{background:rgba(244,196,109,.045);transform:translateY(-10px)}
.wish-modal.open .wish-card{animation:cardBreathe 4.5s ease-in-out infinite alternate}
@keyframes cardBreathe{to{box-shadow:0 40px 140px #000,0 0 60px rgba(244,196,109,.13)}}
.modal-sparks span{position:absolute;z-index:0;left:50%;top:50%;width:5px;height:5px;border-radius:50%;background:var(--gold);box-shadow:0 0 14px var(--gold);animation:sparkBurst 1.5s cubic-bezier(.1,.7,.2,1) both;animation-delay:var(--delay)}
@keyframes sparkBurst{0%{transform:translate(-50%,-50%) scale(0);opacity:1}100%{transform:translate(calc(-50% + var(--x)),calc(-50% + var(--y))) scale(.2);opacity:0}}
@media(pointer:coarse){.cursor-glow{display:none}}
@media(prefers-reduced-motion:reduce){.intro-curtain,.cursor-glow{display:none}.reveal{filter:none;clip-path:none}.cloud,.shooting-stars{display:none}}

.lottie-scene{position:absolute;pointer-events:none;z-index:-1;opacity:.86;filter:drop-shadow(0 0 24px rgba(244,196,109,.28));will-change:transform}
.lottie-hero{width:min(46vw,720px);height:min(46vw,720px);right:0;top:1vh;animation:lottieHover 7s ease-in-out infinite alternate}
.lottie-scene svg,.lottie-wish svg{overflow:visible!important}
@keyframes lottieHover{to{transform:translate3d(-22px,18px,0) rotate(3deg) scale(1.035);filter:drop-shadow(0 0 42px rgba(244,196,109,.4))}}
.lottie-wish{position:absolute;inset:50% auto auto 50%;width:min(125%,720px);aspect-ratio:1;transform:translate(-50%,-50%);pointer-events:none;opacity:.48;z-index:0;mix-blend-mode:screen}
.wish-card>*:not(.lottie-wish):not(.modal-sparks){position:relative;z-index:2}
.wish-modal.open .lottie-wish{animation:lottieWishIn 1.1s cubic-bezier(.2,.8,.2,1) both}
@keyframes lottieWishIn{from{opacity:0;transform:translate(-50%,-50%) scale(.25) rotate(-24deg)}to{opacity:.48;transform:translate(-50%,-50%) scale(1) rotate(0)}}
@media(max-width:800px){.lottie-hero{width:88vw;height:88vw;right:-28vw;top:8vh;opacity:.72}.lottie-wish{width:155%}}
@media(prefers-reduced-motion:reduce){.lottie-scene,.lottie-wish{display:none}}

/* Youthful visual refresh */
:root{--night:#090d2c;--night-2:#17144a;--ink:#fffaf4;--muted:#c7c8e9;--gold:#ffd166;--amber:#ff795f;--pink:#ff6daf;--purple:#9276ff;--line:rgba(255,255,255,.14);--serif:'Be Vietnam Pro',sans-serif}
body{background:var(--night);font-family:'Be Vietnam Pro',sans-serif}
.grain{opacity:.06}
.progress{height:3px;background:rgba(255,255,255,.06)}.progress span{background:linear-gradient(90deg,var(--purple),var(--pink),var(--gold));box-shadow:0 0 18px var(--pink)}
.intro-curtain{background:radial-gradient(circle at 50% 48%,#34286e,#111538 48%,#080b25)}
.intro-blob{width:90px;height:90px;background:linear-gradient(135deg,var(--pink),var(--amber),var(--gold));border-radius:42% 58% 66% 34% / 38% 45% 55% 62%;box-shadow:0 0 80px rgba(255,109,175,.55);animation:blobPop 1.8s ease-in-out infinite alternate}
@keyframes blobPop{to{transform:rotate(35deg) scale(1.16);border-radius:65% 35% 42% 58% / 55% 62% 38% 45%;box-shadow:0 0 110px rgba(255,209,102,.62)}}
.topbar{height:76px;padding:0 3vw}.topbar.scrolled{background:rgba(12,13,45,.62);backdrop-filter:blur(22px) saturate(150%);border-bottom:1px solid rgba(255,255,255,.08)}
.monogram{font-family:'Be Vietnam Pro',sans-serif;font-weight:800;letter-spacing:-.04em;font-size:1.05rem;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.12);padding:10px 14px;border-radius:999px}.monogram span{color:var(--pink)}
.topbar p{font-weight:600;letter-spacing:.17em;color:rgba(255,255,255,.78)}
.sound{background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.12);padding:9px 13px;border-radius:999px}.sound-bars i{background:var(--pink)}
.hero-bg{background:linear-gradient(90deg,rgba(7,9,35,.88) 0%,rgba(10,12,47,.5) 45%,rgba(13,10,47,.05) 76%),url('assets/trung-thu-youthful.png') center/cover no-repeat;filter:saturate(1.08)}
.hero:after{height:40%;background:linear-gradient(transparent,var(--night))}
.aurora{background:radial-gradient(circle,rgba(255,86,173,.38),rgba(112,96,255,.12) 42%,transparent 68%);filter:blur(54px)}
.hero-copy{max-width:830px}.hero h1{font-family:'Be Vietnam Pro',sans-serif;font-weight:800;font-size:clamp(3rem,6.5vw,6.9rem);line-height:1.02;letter-spacing:-.065em;text-wrap:balance}.hero h1 em{font-style:normal;background:linear-gradient(90deg,#fff2a8,var(--gold) 26%,#ff93c6 72%,#c2a7ff);background-clip:text;-webkit-background-clip:text;color:transparent}.hero-copy>p{font-weight:400;color:#e3e3f5;max-width:620px;line-height:1.75}
.eyebrow,.section-kicker{display:inline-flex;align-items:center;width:max-content;padding:9px 14px;border-radius:999px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.13);color:#ffe4f2;font-weight:600;letter-spacing:.13em;margin-bottom:28px;backdrop-filter:blur(12px)}
.scroll-hint{background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.11);padding:12px 17px;border-radius:999px;backdrop-filter:blur(10px);letter-spacing:.1em}.scroll-hint i{background:linear-gradient(90deg,var(--pink),transparent)}
.lottie-hero{right:-2vw;top:0;opacity:.74;filter:drop-shadow(0 0 34px rgba(255,109,175,.38))}
.scene h2{font-family:'Be Vietnam Pro',sans-serif;font-weight:700;letter-spacing:-.055em;line-height:1.06}.scene h2 em{font-style:normal;color:#ff91c5}
.letter{background:radial-gradient(circle at 88% 16%,rgba(137,108,255,.24),transparent 35%),linear-gradient(180deg,var(--night),#151747)}
.letter-grid{padding:52px;border:1px solid rgba(255,255,255,.12);border-radius:36px;background:linear-gradient(135deg,rgba(255,255,255,.1),rgba(255,255,255,.045));backdrop-filter:blur(22px);box-shadow:0 28px 90px rgba(3,4,20,.28)}
.letter-copy{border-left:2px solid rgba(255,109,175,.48)}.letter-copy p{color:#dcddf1;font-weight:400}.signature{font-family:'Be Vietnam Pro',sans-serif;font-weight:600}.signature i{background:linear-gradient(90deg,var(--pink),var(--gold),transparent)}
.orbit-moon{border-color:rgba(255,255,255,.09)}.orbit-moon span{background:var(--pink);box-shadow:0 0 34px var(--pink)}
.memories{background:radial-gradient(circle at 10% 90%,rgba(255,105,174,.18),transparent 35%),#10123a}.moments{gap:18px;border:0}.moment,.moment+.moment{border:1px solid rgba(255,255,255,.11);border-radius:28px;padding:34px;min-height:290px;background:linear-gradient(145deg,rgba(255,255,255,.105),rgba(255,255,255,.04));box-shadow:0 24px 70px rgba(4,4,22,.24);backdrop-filter:blur(16px)}.moment:hover{background:linear-gradient(145deg,rgba(255,109,175,.2),rgba(146,118,255,.1));border-color:rgba(255,160,204,.4);transform:translateY(-12px) rotate(-1deg)}.moment h3{font-family:'Be Vietnam Pro',sans-serif;font-weight:700;letter-spacing:-.03em}.moment p{color:#c9cae7;font-weight:400}.moment-icon{width:56px;height:56px;display:grid;place-items:center;border-radius:18px;background:linear-gradient(135deg,var(--pink),var(--purple));color:white;box-shadow:0 12px 35px rgba(255,109,175,.3)}
.promise{background:radial-gradient(circle at 50% 38%,rgba(146,118,255,.4),transparent 30%),radial-gradient(circle at 75% 70%,rgba(255,109,175,.2),transparent 28%),linear-gradient(180deg,#11143d,#090d2b)}
.promise p{color:#d8d9ee;font-weight:400}.wish-button{border:0;background:linear-gradient(90deg,var(--pink),#ff826b);box-shadow:0 18px 50px rgba(255,109,175,.32);font-weight:700;padding-left:28px}.wish-button i{background:#fff;color:#fd659f}.wish-button:hover{background:linear-gradient(90deg,#ff82bb,#ff947d);box-shadow:0 22px 62px rgba(255,109,175,.45)}
.ribbon{border-color:rgba(171,144,255,.14)}
.wish-card{border:1px solid rgba(255,255,255,.15);border-radius:34px;background:linear-gradient(145deg,rgba(45,39,103,.98),rgba(17,18,58,.98));box-shadow:0 40px 130px rgba(0,0,0,.58),0 0 90px rgba(255,109,175,.15)}.wish-card:before{border-radius:25px;border-color:rgba(255,255,255,.08)}.wish-card h2{font-family:'Be Vietnam Pro',sans-serif;font-weight:700;letter-spacing:-.05em}.wish-card h2 em{font-style:normal;color:#ff9dca}.modal-moon{display:none}.modal-sign{font-family:'Be Vietnam Pro',sans-serif}.modal-sign strong{color:#ff98c8}.close{width:40px;height:40px;border-radius:50%;background:rgba(255,255,255,.09);display:grid;place-items:center;font-size:1.6rem}
.lottie-wish{opacity:.58;filter:drop-shadow(0 0 20px rgba(255,109,175,.45))}
footer{background:#060820;color:#aeb0d3;border-color:rgba(255,255,255,.08)}
@media(max-width:800px){.topbar{padding:0 15px}.sound b{display:none}.hero-bg{background-position:61% center}.hero h1{font-size:clamp(2.9rem,13vw,4.8rem)}.hero-copy>p{color:#f0effa}.letter-grid{padding:26px;border-radius:26px}.moments{gap:14px}.moment,.moment+.moment{padding:28px 24px;border-radius:24px}.lottie-hero{right:-30vw;top:4vh}}

/* Responsive fixes */
.topbar{grid-template-columns:auto 1fr auto}
.monogram{justify-self:start;width:max-content;min-width:0;white-space:nowrap}
.topbar>p{justify-self:center}.sound{justify-self:end}
.lottie-hero{display:none!important}
@media(max-width:800px){.hero-bg{background-position:86% center}.topbar{grid-template-columns:auto 1fr auto}.monogram{width:max-content;padding:9px 13px}.hero-copy{max-width:100%}}
@media(max-width:480px){.hero-bg{background-position:82% center}.hero h1{font-size:clamp(2.75rem,13.5vw,4rem)}.eyebrow{font-size:.64rem;letter-spacing:.1em}}