@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;1,400;1,500&family=DM+Sans:wght@400;500;600;700&display=swap');
:root{color-scheme:dark;--bg:#0d1021;--cream:#f5eee5;--muted:#b0aebe;--pink:#efb7c7;--gold:#dfc59b;--line:rgba(238,209,180,.17)}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--cream);font-family:'DM Sans',sans-serif;overflow-x:hidden}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}button:focus-visible,a:focus-visible,article:focus-visible{outline:2px solid var(--gold);outline-offset:7px}button{color:inherit}#sky,.grain{position:fixed;inset:0;width:100%;height:100%;pointer-events:none}#sky{z-index:-2}.grain{z-index:-1;background:radial-gradient(ellipse at 50% 35%,transparent 20%,#0d102177 100%);opacity:.7}header{height:105px;position:relative;z-index:10;display:flex;align-items:center;justify-content:space-between;padding:0 5.3vw}a.brand{color:var(--cream);text-decoration:none;font-size:10px;letter-spacing:3px;display:flex;align-items:center;gap:12px}.brand-star{color:var(--gold);font-size:26px;line-height:1}.sound{border:1px solid var(--line);border-radius:30px;background:#15162980;display:flex;align-items:center;gap:8px;padding:10px 16px;font-size:11px;color:var(--muted)}#sound-icon{font-size:17px;color:var(--gold)}main{min-height:calc(100svh - 175px);position:relative}.scene{min-height:calc(100svh - 175px);max-width:1500px;margin:auto;padding:35px 7vw 50px;display:flex;align-items:center;justify-content:space-between;gap:25px;animation:arrive 1s ease both}.scene[hidden]{display:none!important}.eyebrow{font-size:9px;letter-spacing:3px;color:var(--gold);font-weight:500;line-height:1.8;margin:0 0 27px}h1,h2,h3,.final-script{font-family:'Cormorant Garamond',Georgia,serif;font-weight:400}h1{font-size:clamp(60px,7.1vw,104px);line-height:1.02;letter-spacing:-3.7px;margin:0 0 28px}h2{font-size:clamp(45px,5.1vw,78px);line-height:1.07;letter-spacing:-2px;margin:0 0 24px}em{font-weight:400;color:var(--pink)}.lead{color:var(--muted);font-size:14px;line-height:1.9;margin:0 0 32px}.primary{display:inline-flex;align-items:center;justify-content:center;gap:35px;position:relative;background:var(--cream);border:1px solid var(--cream);color:#292234;font-size:12px;font-weight:600;padding:18px 25px;min-height:57px;border-radius:3px;transition:background .2s,transform .2s;overflow:hidden}.primary:hover{background:#f1d8dc;transform:translateY(-2px)}.primary span:last-of-type{font-size:19px;font-weight:400}.footnote{font-size:10px;color:#838397;margin:21px 0 0;letter-spacing:.4px}.welcome{position:relative;justify-content:center;text-align:center;padding-top:56px;padding-bottom:110px}.welcome-content{position:relative;z-index:2}.welcome .eyebrow{margin-bottom:30px}.welcome .lead{font-size:15px;margin-bottom:36px}.intro-orbit{position:absolute;width:min(660px,82vw);aspect-ratio:1;border:1px solid #d0b7a312;border-radius:50%;top:44%;left:50%;transform:translate(-50%,-50%);box-shadow:0 0 160px #c2678a08,inset 0 0 130px #d79fbb05}.intro-orbit:before,.intro-orbit:after{content:'';position:absolute;border-radius:50%;inset:32px;border:1px solid #d0b7a30a}.intro-orbit:after{inset:-32px}.intro-orbit i{position:absolute;inset:0;border-radius:50%;animation:orbit 70s linear infinite}.intro-orbit i:before{content:'';position:absolute;top:10%;left:19%;height:6px;width:6px;border-radius:50%;background:var(--gold);box-shadow:0 0 17px #edc98d}.intro-orbit b,.intro-orbit>span{position:absolute;font-weight:400;color:var(--gold)}.intro-orbit b{font-size:34px;top:18%;right:6%;animation:twinkle 3s infinite alternate}.intro-orbit>span{font-size:22px;bottom:16%;left:4%;animation:twinkle 4s infinite alternate}.welcome-bottom{position:absolute;bottom:28px;display:flex;align-items:center;gap:22px;font-size:8px;letter-spacing:2px;color:#77788e}.thin-line{width:60px;height:1px;background:var(--line)}footer{height:70px;display:flex;align-items:center;justify-content:center;padding:0 5.3vw;position:relative;z-index:10}.steps{display:flex;align-items:center;gap:13px}.step{width:5px;height:5px;padding:0;border:0;background:#69657b;border-radius:50%;position:relative}.step:before{content:'';position:absolute;inset:-12px}.step.selected{width:21px;border-radius:5px;background:var(--gold)}.chapter-count{position:absolute;right:5.3vw;font-size:9px;letter-spacing:2px;color:#8a879e}.back{position:absolute;left:5.3vw;border:0;background:none;font-size:19px;color:#a6a1b8;padding:10px 0}.back span{font-size:10px;margin-left:8px}.copy{max-width:560px;position:relative;z-index:3}.hint{font-size:10px;line-height:1.9;color:#8d899f;margin:5px 0 30px}.tiny-star{color:var(--gold);font-size:17px;vertical-align:middle;margin-right:7px}.heart-art{width:48%;max-width:580px;aspect-ratio:1;position:relative;flex-shrink:0}.heart-lines{width:100%;height:100%;overflow:visible;animation:breathe 4s ease-in-out infinite}.heart-lines path{stroke:url(#heart-gradient);fill:none;stroke-width:.6;opacity:.23;stroke-dasharray:1400;stroke-dashoffset:1400;animation:draw 4s ease forwards}.heart-center{position:absolute;left:0;right:0;top:36%;text-align:center;pointer-events:none}.heart-center>span{display:block;font-family:'Cormorant Garamond',Georgia,serif;font-style:italic;font-size:72px;color:#f1cdd7}.heart-center small{font-size:7px;letter-spacing:2px;color:#b68ba4}.wish-star{position:absolute;width:42px;height:42px;background:transparent;border:0;font-size:25px;color:var(--gold);text-shadow:0 0 20px #f2c99466;transition:transform .3s;animation:twinkle 3s ease-in-out infinite alternate}.wish-star:hover{transform:scale(1.5)}.star-0{top:13%;left:27%}.star-1{top:20%;right:13%}.star-2{top:50%;right:5%}.star-3{bottom:15%;right:31%}.star-4{top:49%;left:5%}.wish-star.visited{color:#f5bbd3}.note{position:absolute;bottom:-25px;left:7%;width:86%;text-align:center;min-height:75px}.note>span{color:var(--gold);font-size:17px}.note p{font-family:'Cormorant Garamond',Georgia,serif;color:#d7c3d3;font-size:19px;line-height:1.4;margin:7px 0}.note.changed{animation:arrive .7s ease}.cake-art{position:relative;width:48%;max-width:530px;height:460px;display:flex;align-items:center;justify-content:center}.cake-aura{position:absolute;inset:0;background:radial-gradient(ellipse,#e6a7ae12,transparent 68%)}.cake{width:270px;height:210px;position:relative;transform:translateY(27px);filter:drop-shadow(0 25px 45px #0003)}.cake-body{position:absolute;top:49px;left:0;width:270px;height:142px;border-radius:0 0 50% 50% / 0 0 20% 20%;background:linear-gradient(90deg,#b87c92,#f0bfd0 38%,#f2c9d5 65%,#b67a95);box-shadow:inset 0 -12px 18px #6e3b6d26}.cake-body:after{content:'';position:absolute;bottom:12px;left:9px;right:9px;height:13px;border-bottom:3px dotted #ebafc4aa;border-radius:50%}.cake-body>span{position:absolute;top:61px;left:35px;transform:rotate(-5deg);font-family:'Cormorant Garamond',Georgia,serif;font-size:27px;font-style:italic;color:#784765}.cake-top{position:absolute;top:20px;left:0;width:270px;height:72px;z-index:4;border-radius:50%;background:radial-gradient(ellipse at 40% 35%,#ffdee6,#e5adc4 80%);border:3px solid #f0bfd0;box-shadow:inset 0 0 0 7px #ffd9e655}.icing{position:absolute;top:53px;left:0;right:0;height:51px;z-index:5;border-radius:0 0 50% 50% / 0 0 26px 26px;display:flex;justify-content:space-around;align-items:flex-start}.icing i{background:linear-gradient(#eebbd0,#f9d1df);width:25px;height:43px;border-radius:0 0 20px 20px;box-shadow:1px 4px 3px #97577318}.icing i:nth-child(even){height:29px}.candles{position:absolute;left:53px;right:50px;top:-36px;z-index:8;display:flex;justify-content:space-between;align-items:flex-end;height:93px}.candle{height:64px;width:8px;position:relative;border-radius:3px 3px 1px 1px;background:repeating-linear-gradient(150deg,#f9e7c4 0px,#f9e7c4 7px,#d2ac77 7px,#d2ac77 10px);box-shadow:2px 0 3px #775a6b55}.candle:nth-child(2n){height:78px}.candle:nth-child(3){height:88px}.flame{position:absolute;top:-29px;left:-3px;width:14px;height:25px;border-radius:65% 35% 50% 50%;background:radial-gradient(ellipse at 50% 80%,#fffcea 10%,#ffdc86 40%,#ec9955 85%);box-shadow:0 0 17px 6px #fac68144,0 0 55px 16px #efac6422;transform-origin:center bottom;animation:flicker .8s infinite alternate}.candle:nth-child(2n) .flame{animation-delay:-.5s}.cake-base{position:absolute;bottom:10px;left:-2px;right:-2px;height:26px;border-radius:50%;background:#c591a8;z-index:-1}.cake-plate{position:absolute;bottom:-7px;left:-35px;width:340px;height:54px;background:linear-gradient(10deg,#8a7c9b,#d9c7d9 55%,#b7a3ba);border-radius:50%;z-index:-2;box-shadow:0 8px 0 #625979,0 11px 0 #8c7893}.sunflower{width:49px;height:49px;position:absolute;z-index:7}.sunflower i{position:absolute;background:linear-gradient(#ffe095,#d4993c);width:11px;height:29px;left:19px;top:-4px;border-radius:65% 65% 45% 45%;transform-origin:5.5px 29px}.sunflower:after{content:'';position:absolute;width:24px;height:24px;border-radius:50%;background:radial-gradient(#654631 1px,transparent 1.3px),#705031;background-size:4px 4px;left:12px;top:13px;border:2px solid #b8843e;box-shadow:0 0 5px #825c35}.flower-a{top:26px;left:12px;transform:rotate(-12deg)}.flower-b{top:16px;right:19px;transform:scale(.82) rotate(22deg)}.flower-c{top:113px;right:7px;transform:scale(.9)}.cake-caption{position:absolute;bottom:17px;letter-spacing:2.4px;font-size:8px;color:#8c7e94}.floating-spark{position:absolute;color:var(--gold);animation:float 5s ease-in-out infinite}.spark-a{top:50px;right:70px;font-size:33px}.spark-b{top:120px;left:45px;font-size:20px;animation-delay:-2s}.candle-button{gap:28px;user-select:none;touch-action:none;-webkit-user-select:none}.candle-button #hold-label{font-size:12px;font-weight:600;z-index:1}.candle-button>span{z-index:1}.candle-button>i{position:absolute;left:0;top:0;bottom:0;width:0;background:#e9bfcc;transition:width .07s linear}.candle-button.holding{transform:none}.hold-hint{margin-top:15px}.blown .flame{animation:extinguish .5s ease forwards}.blown .cake-aura{opacity:.5}.text-button{background:none;border:0;border-bottom:1px solid var(--line);color:var(--gold);font-size:11px;padding:12px 0;display:inline-flex;gap:20px;align-items:center}.after-wish{margin-top:15px}.letter-art{width:48%;max-width:560px;display:flex;align-items:center;justify-content:center;position:relative;min-height:420px}.envelope{position:relative;background:none;border:0;width:340px;height:235px;transform:rotate(-7deg);transition:transform .5s}.envelope:hover{transform:rotate(-3deg) translateY(-7px)}.envelope-back{position:absolute;inset:0;background:#d9c0c7;border-radius:4px}.envelope-back:before{content:'';position:absolute;inset:0;background:#efdae0;clip-path:polygon(0 0,100% 0,50% 63%)}.envelope-front{position:absolute;inset:0;background:linear-gradient(130deg,#f4e7e7,#d6bac5);clip-path:polygon(0 0,50% 57%,100% 0,100% 100%,0 100%);border-radius:4px;box-shadow:0 20px 60px #0003}.seal{position:absolute;left:calc(50% - 23px);top:103px;width:46px;height:46px;display:grid;place-items:center;font-size:25px;background:linear-gradient(130deg,#a86982,#723b59);border-radius:50%;color:#e9c3cc;box-shadow:1px 3px 5px #48233e55;border:3px double #bb8196}.envelope-paper{position:absolute;inset:-19px 20px 30px;background:#f3e9dc;color:#8e6378;font-family:'Cormorant Garamond',Georgia,serif;font-size:23px;padding-top:30px;box-shadow:0 -5px 40px #0001}.letter{width:100%;max-height:65svh;overflow:auto;background:#f4ede3;color:#65505b;padding:38px 40px;border-radius:3px;box-shadow:0 25px 100px #0004;transform:rotate(1deg);animation:unfold .9s ease;scrollbar-color:#baa6ad #f4ede3;scrollbar-width:thin}.letter-date{font:8px 'DM Sans',sans-serif;letter-spacing:1.8px;color:#a08189;margin-bottom:25px!important}.letter h3{font-size:35px;font-style:italic;margin:0 0 22px;color:#895c71}.letter p{font-family:'Cormorant Garamond',Georgia,serif;font-size:19px;line-height:1.45;margin:0 0 15px}.letter .signature{margin-top:25px}.signature span{display:block;margin-top:6px;font-size:27px;font-style:italic}.letter-next{margin-top:20px}.letter-scene.opened #open-letter{display:none}.finale{justify-content:center;text-align:center;flex-direction:column;gap:0;padding-top:55px;padding-bottom:60px;position:relative}.finale .eyebrow{margin-bottom:40px}.final-script{font-size:clamp(38px,4vw,63px);font-style:italic;margin:0 0 5px;color:var(--gold)}.finale h2{font-size:clamp(66px,8vw,125px);letter-spacing:-4px;margin-bottom:25px}.finale .lead{margin-bottom:33px}.final-buttons{display:flex;align-items:center;gap:25px}.final-love{margin:45px 0 0;font-family:'Cormorant Garamond',Georgia,serif;font-style:italic;font-size:18px;color:#b29eaf}.final-halo{position:absolute;width:500px;height:500px;max-width:95vw;border:1px solid #dfc59b12;border-radius:50%;top:45%;left:50%;transform:translate(-50%,-50%);pointer-events:none;box-shadow:0 0 140px #f2b4cb09,inset 0 0 100px #f2b4cb06}.final-halo:before{content:'✦';position:absolute;top:9%;right:14%;font-size:28px;color:var(--gold)}[hidden]{display:none!important}@keyframes arrive{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}@keyframes unfold{from{opacity:0;transform:translateY(35px) rotate(-4deg)}to{opacity:1;transform:translateY(0) rotate(1deg)}}@keyframes orbit{to{transform:rotate(360deg)}}@keyframes twinkle{from{opacity:.4}to{opacity:1}}@keyframes breathe{50%{transform:scale(1.035)}}@keyframes draw{to{stroke-dashoffset:0}}@keyframes flicker{from{transform:rotate(-5deg) scale(.93)}to{transform:rotate(5deg) scale(1.05)}}@keyframes float{50%{transform:translateY(-14px) rotate(12deg)}}@keyframes extinguish{to{opacity:0;transform:scale(.1) translateY(-40px)}}
@media(min-width:1450px){.scene{padding-left:100px;padding-right:100px}.welcome{padding-top:65px}}@media(max-width:760px){header{height:78px;padding:0 7vw}.brand{letter-spacing:2px!important;font-size:8px!important}.sound{font-size:10px;padding:8px 12px}main{min-height:calc(100svh - 138px)}.scene{min-height:calc(100svh - 138px);padding:28px 8vw 30px;flex-direction:column;justify-content:center;gap:15px}.welcome{padding-top:35px;padding-bottom:87px}.welcome .eyebrow{font-size:8px;letter-spacing:2px;margin-bottom:24px}h1{font-size:clamp(54px,13vw,78px);letter-spacing:-2px}h2{font-size:clamp(40px,10vw,60px);letter-spacing:-1.4px}.welcome .lead,.lead{font-size:12px;line-height:1.8}.welcome .lead{margin-bottom:28px}.primary{font-size:11px;padding:16px 22px;min-height:54px;gap:25px}.footnote{font-size:9px;max-width:240px;margin:19px auto}.welcome-bottom{font-size:6px;letter-spacing:1.4px;gap:13px;bottom:24px}.welcome-bottom .thin-line{width:25px}.intro-orbit{width:88vw;top:43%}.intro-orbit b{top:6%;right:21%;font-size:26px}.copy{width:100%;text-align:center}.eyebrow{font-size:8px;letter-spacing:2px;margin-bottom:19px}.heart-scene{gap:2px;justify-content:flex-start;padding-top:22px}.heart-scene .copy{display:contents}.heart-scene .copy h2{order:1;margin-bottom:10px}.heart-scene .eyebrow{order:0}.heart-scene .lead{order:2;margin-bottom:0}.heart-art{order:3;width:min(340px,88vw);height:300px;flex-shrink:0;aspect-ratio:auto;margin:0 -10px 18px}.heart-lines{height:300px}.heart-center{top:32%}.heart-center>span{font-size:57px}.heart-center small{font-size:6px;letter-spacing:1.5px}.note{bottom:-10px;min-height:50px}.note>span{display:none}.note p{font-size:16px;margin:0}.heart-scene .hint{order:4;font-size:9px;margin:6px 0 12px;text-align:center}.heart-scene .next{order:5;align-self:center}.wish-star{font-size:22px}.star-3{bottom:12%}.cake-scene{gap:0;justify-content:flex-start;padding-top:22px}.cake-scene .copy{display:contents}.cake-scene .eyebrow{order:0}.cake-scene h2{order:1;margin-bottom:12px;text-align:center}.cake-scene .lead{order:2;text-align:center;margin-bottom:0}.cake-art{order:3;width:100%;height:295px}.cake{transform:translateY(22px) scale(.8)}.cake-caption{font-size:6px;bottom:4px}.spark-a{top:25px;right:25px;font-size:25px}.spark-b{top:80px;left:14px}.candle-button{order:4;align-self:center;margin-top:8px}.hold-hint{order:5;text-align:center;font-size:9px;margin:12px 0 0}.after-wish{order:6;align-self:center}.letter-scene{gap:22px;justify-content:flex-start;padding-top:22px}.letter-scene h2{margin-bottom:15px}.letter-scene .lead{margin-bottom:20px}.letter-art{width:100%;min-height:230px}.envelope{width:280px;height:195px;transform:rotate(-5deg) scale(.95);margin-top:25px}.envelope .seal{top:82px}.letter-scene.opened .lead{display:none}.letter-scene.opened h2{font-size:37px;margin-bottom:8px}.letter-scene.opened .eyebrow{margin-bottom:12px}.letter-scene.opened .copy{display:contents}.letter-scene.opened .letter-art{order:2}.letter-scene.opened .letter-next{order:3;margin-top:0}.letter{padding:28px;max-height:54svh;transform:rotate(.6deg)}.letter p{font-size:18px}.letter h3{font-size:31px}.finale{padding-top:40px;padding-bottom:40px}.finale .eyebrow{font-size:7px;letter-spacing:1.7px;margin-bottom:35px}.final-script{font-size:37px}.finale h2{font-size:clamp(61px,14.8vw,90px);letter-spacing:-2.7px}.final-buttons{flex-direction:column;gap:12px}.final-love{margin-top:30px;font-size:16px}footer{height:60px}.chapter-count{font-size:7px;right:7vw}.back{left:7vw;font-size:17px}.back span{font-size:8px}.steps{gap:12px}.final-halo{width:90vw;height:90vw;top:42%}}
@media(max-width:760px) and (max-height:740px){header{height:65px}.scene{min-height:calc(100svh - 120px);padding-top:15px}.heart-art{height:250px;width:285px;margin-bottom:13px}.heart-lines{height:260px}.heart-scene h2,.cake-scene h2{font-size:38px}.heart-scene .lead,.cake-scene .lead{font-size:11px}.heart-center{top:30%}.heart-center>span{font-size:50px}.heart-scene .eyebrow,.cake-scene .eyebrow{margin-bottom:12px}.cake-art{height:255px}.cake{transform:translateY(23px) scale(.7)}.cake-caption{bottom:0}.welcome-bottom{bottom:10px}.letter-scene.opened .letter{max-height:47svh}footer{height:55px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.heart-lines path{stroke-dashoffset:0}}
:root{--safe-top:env(safe-area-inset-top,0px);--safe-bottom:env(safe-area-inset-bottom,0px);--header-size:calc(90px + var(--safe-top));--footer-size:calc(65px + var(--safe-bottom))}body{min-height:100svh;min-height:100dvh}header{height:var(--header-size);padding-top:var(--safe-top);padding-left:max(5.3vw,env(safe-area-inset-left));padding-right:max(5.3vw,env(safe-area-inset-right))}main,.scene{min-height:calc(100svh - var(--header-size) - var(--footer-size));min-height:calc(100dvh - var(--header-size) - var(--footer-size))}footer{height:var(--footer-size);padding-bottom:var(--safe-bottom)}button{touch-action:manipulation}.welcome h1{font-size:clamp(53px,6.4vw,98px)}.welcome .start{background:#f3ce85;border-color:#f3ce85}.welcome:after{content:'';position:absolute;width:110px;height:110px;background:url('assets/cotton-sunflower.webp') center/contain no-repeat;bottom:25px;right:9%;transform:rotate(16deg);filter:drop-shadow(0 0 25px #efad3440);animation:float 6s ease-in-out infinite}
.garden-scene{display:grid;grid-template-columns:minmax(250px,.85fr) minmax(350px,1.15fr);grid-template-rows:1fr auto;gap:0 40px;padding-top:0;padding-bottom:20px}.garden-copy{grid-column:1;align-self:center}.garden-copy h2{font-size:clamp(42px,4.5vw,69px)}.garden-copy .lead{margin-bottom:18px}.garden-instruction{font-size:11px;line-height:1.8;color:#c5b78e;max-width:300px}.garden-wrap{grid-column:2;grid-row:1 / 3;position:relative;width:100%;max-width:650px;margin:auto}.garden-aura{position:absolute;inset:5% -5% -5%;background:radial-gradient(ellipse at 50% 47%,#d6b4551b,transparent 66%);pointer-events:none}.garden{width:100%;aspect-ratio:440 / 500;position:relative;isolation:isolate}.garden-svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}.garden-ground{position:absolute;bottom:0;left:9%;right:9%;height:11%;border-radius:50%;background:radial-gradient(ellipse,#47764c99,#23393250 48%,transparent 72%);filter:blur(8px);z-index:-1}.stem{stroke:url(#stemColor);stroke-width:7;stroke-linecap:round;fill:none;stroke-dasharray:1;stroke-dashoffset:1}.stem-fuzz{stroke:#bdd799;stroke-width:10;filter:url(#felt);opacity:.18}.stem-thread{stroke:#d2dfaa;stroke-width:1;opacity:.6}.growing .stem{animation:stem-grow 2.8s cubic-bezier(.25,.5,.3,1) var(--delay) both}.unfold-leaf{transform:scale(0);opacity:0}.growing .unfold-leaf{animation:leaf-open 1.35s cubic-bezier(.2,.8,.3,1.2) var(--leaf-delay) both}.bloom{opacity:0;transform:scale(.04) rotate(-35deg)}.growing .bloom{animation:cotton-bloom 1.8s cubic-bezier(.16,.7,.26,1.15) var(--bloom-delay) both}.cotton-head{filter:drop-shadow(0 0 8px #ffc34755)}.bloom-glow{opacity:.13;filter:blur(18px)}.photo-string{opacity:0}.growing .photo-string{animation:arrive 1s var(--heart-delay) both}.photo-heart{position:absolute;width:18.2%;aspect-ratio:1;z-index:4;border:0;background:transparent;padding:0;opacity:0;transform:scale(.2);filter:drop-shadow(0 0 5px #f5bc8a77) drop-shadow(0 9px 12px #0008);transition:filter .2s}.photo-heart svg{display:block;width:100%;height:100%;overflow:visible}.growing .photo-heart{animation:heart-appear 1.1s cubic-bezier(.2,.8,.3,1.3) var(--heart-delay) both,heart-sway 6s ease-in-out calc(var(--heart-delay) + 1.1s) infinite}.photo-heart:hover{filter:drop-shadow(0 0 12px #ffdea5);z-index:6}.photo-heart:focus-visible{outline:2px solid #ffe8b8;outline-offset:6px;border-radius:35%}.garden-actions{grid-column:1;display:flex;align-items:flex-start;flex-direction:column;gap:18px;align-self:start;margin-bottom:30px}.garden-actions .primary{background:#f3ce85;border-color:#f3ce85}.garden-actions .text-button{font-size:10px}.fireflies{position:absolute;inset:0;pointer-events:none}.fireflies i{position:absolute;width:3px;height:3px;border-radius:50%;background:#ffdfa0;box-shadow:0 0 9px 3px #f5c97655;animation:pollen var(--float-time) ease-in-out var(--float-delay) infinite}
.questions-scene{justify-content:center;text-align:center}.question-card{width:100%;max-width:540px;position:relative;padding:15px 20px 25px}.question-card>.eyebrow{margin-bottom:10px}.question-flower{position:relative;width:88px;height:88px;margin:0 auto 18px;filter:drop-shadow(0 0 22px #ffc14b33)}.question-flower img{width:100%;height:100%;object-fit:contain;animation:slow-sway 7s ease-in-out infinite}.question-flower span{position:absolute;inset:0;display:grid;place-items:center;font-size:32px;text-shadow:0 1px 5px #000;color:#fff0cf}.question-flower.celebrate{animation:happy-flower 1s ease both}.question-count{font-size:8px;letter-spacing:2px;color:#c2af8c;display:flex;justify-content:space-between;margin:0 0 10px}.question-progress{height:2px;background:#fff1;margin-bottom:30px;border-radius:10px;overflow:hidden}.question-progress i{display:block;height:100%;width:0;background:#ebc174;box-shadow:0 0 10px #ebc174;transition:width .7s}.question-card h2{font-size:clamp(41px,4.5vw,61px);line-height:1.1;margin-bottom:14px;min-height:1.2em}.question-card .lead{font-size:12px;margin-bottom:22px;min-height:22px}.question-choices{display:grid;gap:10px}.answer-choice{border:1px solid #eac58744;background:linear-gradient(110deg,#f2d8b10b,#f0bfc405);color:#e9dcc8;min-height:52px;border-radius:12px;font-size:12px;padding:13px 18px;transition:background .2s,border-color .2s,transform .2s}.answer-choice:hover{background:#f2d8b11c;border-color:#eac58799;transform:translateY(-2px)}.answer-choice:disabled{opacity:.42;cursor:default}.answer-choice.chosen{opacity:1;border-color:#f4cb85;background:#e7ba721f;color:#ffe5ba}.answer-reveal{animation:arrive .5s ease}.answer-reveal p{font-size:14px;line-height:1.7;color:#efd5bf;margin:20px 0}.answer-reveal .primary{min-height:48px;padding:13px 22px;background:#f3ce85;border-color:#f3ce85}#skip-questions{font-size:10px;margin-top:13px;color:#a8a0ab}.question-footnote{font-size:9px;color:#8f8495;letter-spacing:.6px;margin-top:20px}.age-topper{position:absolute;left:103px;top:-44px;color:#f7d59a;font:italic 57px 'Cormorant Garamond',Georgia,serif;z-index:9;text-shadow:0 0 15px #ffc64e66;transform:rotate(-6deg);pointer-events:none}.candles{left:33px;right:30px}.candle:nth-child(3){visibility:hidden}.cake-body>span{left:78px}.finale .final-script{font-size:clamp(30px,4vw,57px)}.final-love{max-width:90%}.modal-open{overflow:hidden}#photo-dialog{position:fixed;margin:auto;background:#171526;color:#f4e6d7;border:1px solid #b38b5d77;border-radius:20px;padding:20px;max-width:min(92vw,470px);max-height:calc(100dvh - 40px - var(--safe-top) - var(--safe-bottom));overflow:auto;box-shadow:0 15px 100px #000a}#photo-dialog::backdrop{background:#080c1cdd;backdrop-filter:blur(10px)}#full-photo{width:100%;max-height:60dvh;object-fit:contain;border-radius:12px;display:block;background:#0f1020}#close-photo{position:absolute;right:25px;top:25px;z-index:2;width:44px;height:44px;border:1px solid #fffa;border-radius:50%;background:#131221b0;color:#fff;font-size:26px;backdrop-filter:blur(8px)}#photo-message{font-family:'Cormorant Garamond',Georgia,serif;font-size:23px;line-height:1.4;text-align:center;margin:20px 6px 8px}.photo-count{text-align:center;font-size:9px;color:#b59b7f;letter-spacing:3px;margin:10px}.photo-nav{display:flex;justify-content:center;gap:24px}.photo-nav button{width:48px;height:44px;border-radius:30px;border:1px solid #eac58755;background:#f2d8b109;font-size:20px}header .sound{min-height:44px}.letter p{font-family:'DM Sans',sans-serif;font-size:13px;line-height:1.85}.letter .signature{font-family:'Cormorant Garamond',Georgia,serif;font-size:22px}
@keyframes stem-grow{to{stroke-dashoffset:0}}@keyframes leaf-open{from{transform:scale(.05) rotate(-25deg);opacity:0}to{transform:scale(1) rotate(0);opacity:1}}@keyframes cotton-bloom{0%{opacity:0;transform:scale(.04) rotate(-35deg)}55%{opacity:1;transform:scale(.65) rotate(-10deg)}100%{opacity:1;transform:scale(1) rotate(0)}}@keyframes heart-appear{from{opacity:0;transform:translateY(-16px) scale(.2)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes heart-sway{0%,100%{transform:rotate(calc(var(--sway) * -1))}50%{transform:rotate(var(--sway))}}@keyframes pollen{0%,100%{opacity:.1;transform:translate(0,10px)}50%{opacity:.9;transform:translate(8px,-18px)}}@keyframes slow-sway{50%{transform:rotate(12deg)}}@keyframes happy-flower{50%{transform:scale(1.18) rotate(20deg)}}
@media(max-width:760px){:root{--header-size:calc(72px + var(--safe-top));--footer-size:calc(56px + var(--safe-bottom))}header{padding-left:max(6vw,env(safe-area-inset-left));padding-right:max(6vw,env(safe-area-inset-right))}.scene{padding-left:max(6vw,env(safe-area-inset-left));padding-right:max(6vw,env(safe-area-inset-right))}.welcome{padding-bottom:90px}.welcome h1{font-size:clamp(49px,12.4vw,70px);line-height:1.08}.welcome:after{width:67px;height:67px;right:calc(50% - 33px);bottom:43px;opacity:.8}.welcome .eyebrow{font-size:8px}.welcome .lead{font-size:13px}.welcome .footnote{max-width:265px;line-height:1.7}.welcome-bottom{bottom:10px}.garden-scene{display:flex;flex-direction:column;gap:0;padding-top:10px;padding-bottom:8px;justify-content:flex-start;overflow:hidden}.garden-copy{text-align:center;width:100%}.garden-copy .eyebrow{font-size:7px;margin-bottom:9px;letter-spacing:1.9px}.garden-copy h2{font-size:clamp(34px,9vw,43px);line-height:1.04;margin-bottom:9px}.garden-copy .lead{font-size:10px;margin-bottom:5px}.garden-instruction{font-size:9px;line-height:1.6;max-width:330px;margin:6px auto 0;min-height:28px}.garden-wrap{width:min(100%,440px);margin:-8px auto -6px;flex-shrink:0}.garden-actions{flex-direction:row;justify-content:center;align-items:center;gap:18px;margin:0;flex-wrap:wrap}.garden-actions .primary{font-size:10px;gap:15px;min-height:46px;padding:12px 15px}.garden-actions .text-button{font-size:9px;min-height:44px}.questions-scene{padding-top:6px;padding-bottom:14px}.question-card{padding:0 2px 10px;max-width:440px}.question-card>.eyebrow{font-size:7px;margin-bottom:6px}.question-flower{width:70px;height:70px;margin-bottom:12px}.question-card h2{font-size:clamp(35px,9.2vw,45px);letter-spacing:-1.2px}.question-progress{margin-bottom:22px}.question-count{font-size:7px}.question-card .lead{font-size:11px;line-height:1.7;margin-bottom:17px}.answer-choice{font-size:11px;min-height:49px}.answer-reveal p{font-size:12px;margin:15px 4px}.answer-reveal .primary{font-size:11px;min-height:46px}.question-footnote{margin-top:14px}#photo-dialog{padding:14px;border-radius:16px}#photo-message{font-size:21px}#close-photo{top:19px;right:19px}.letter{max-height:calc(100dvh - var(--header-size) - var(--footer-size) - 175px);padding:24px}.letter p{font-size:12px;line-height:1.9}.letter-scene.opened h2{font-size:33px}.finale .final-script{font-size:30px}.chapter-count{right:6vw}.back{left:6vw}.steps{gap:12px}.back span{display:none}.cake-scene h2{font-size:42px}.cake-art{height:280px}}
@media(max-width:760px) and (max-height:780px){.garden-wrap{width:min(85%,350px)}.garden-copy h2{font-size:33px}.garden-copy .lead{display:none}.garden-instruction{margin-top:3px}.question-flower{width:53px;height:53px;margin-bottom:10px}.question-card h2{font-size:34px}.question-card .lead{margin-bottom:12px}.answer-choice{min-height:44px;padding:11px}.question-choices{gap:8px}.question-progress{margin-bottom:17px}.answer-reveal p{margin:12px 0;font-size:11px}.question-footnote{display:none}.cake-art{height:245px}.welcome:after{width:55px;height:55px;right:calc(50% - 27px)}}
@media(prefers-reduced-motion:reduce){.growing .stem{stroke-dashoffset:0!important}.growing .bloom,.growing .unfold-leaf,.growing .photo-heart,.growing .photo-string{animation-delay:0s!important;transform:none!important;opacity:1!important}.fireflies{display:none}}

.letter .letter-date{font-family:"DM Sans",sans-serif;font-size:8px;line-height:1.8;letter-spacing:1.6px}.photo-heart:active{filter:drop-shadow(0 0 15px #ffdea5)}