@import "https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@400;500;600;700&family=DM+Sans:wght@400;500;600&family=Noto+Naskh+Arabic:wght@400;500;600;700&display=swap";:root{color:#fff8f0;font-synthesis:none;text-rendering:optimizelegibility;background:#250713;font-family:DM Sans,sans-serif}*{box-sizing:border-box}body{background:#250713;min-width:320px;min-height:100vh;margin:0}button{font:inherit;color:inherit;cursor:pointer;border:0}.experience{isolation:isolate;background:radial-gradient(circle at 50% 42%,#69142e 0%,#370a1b 40%,#18040d 100%);min-height:100svh;position:relative;overflow:hidden}.experience:before{content:"";z-index:-1;pointer-events:none;background:linear-gradient(130deg,#ffccd50f,#0000 34%,#d4af770d 70%,#0000);position:absolute;inset:0}.scene{z-index:2;text-align:center;justify-content:center;align-items:center;min-height:100svh;padding:104px 22px 50px;display:flex;position:relative}.topbar{z-index:10;padding:24px max(22px,env(safe-area-inset-left)) 12px;letter-spacing:.22em;color:#d4af77;justify-content:space-between;align-items:center;font-size:10px;display:flex;position:absolute;top:0;left:0;right:0}.brand-mark{align-items:center;gap:7px;display:flex}.progress{gap:5px;display:flex;position:absolute;left:50%;transform:translate(-50%)}.progress span{background:#fff8f033;border-radius:9px;width:18px;height:2px;transition:all .5s}.progress span.active{background:#d4af77}.sound-toggle{color:#ffccd5;background:#fff8f00b;border:1px solid #fff8f026;border-radius:50%;place-items:center;width:42px;height:42px;display:grid}.ambient{z-index:0;pointer-events:none;position:absolute;inset:0;overflow:hidden}.particle{opacity:.45;background:#ffd98e;border-radius:50%;width:3px;height:3px;animation:8s ease-in-out infinite float;position:absolute;box-shadow:0 0 12px 3px #d4af7788}.p0{animation-delay:-2s;top:18%;left:8%}.p1{animation-delay:-5s;top:71%;left:23%}.p2{animation-delay:-1s;top:15%;left:38%}.p3{animation-delay:-3s;top:26%;left:60%}.p4{animation-delay:-6s;top:62%;left:79%}.p5{animation-delay:-4s;top:19%;left:89%}.p6{animation-delay:-7s;top:81%;left:67%}.p7{animation-delay:-1.5s;top:48%;left:13%}.particle:nth-child(n+9){opacity:.2;transform:scale(.6)}.petal{color:#ffccd5;opacity:.4;left:calc((var(--i) * 13%));top:calc(15% + (var(--i) * 9%));animation:12s linear infinite drift;animation-delay:calc(var(--i) * -1.3s);font-size:10px;position:absolute}h1,h2,p{margin:0}h1,h2{font-family:Cormorant Garamond,serif;font-weight:500;line-height:.95}h1{letter-spacing:-.055em;font-size:clamp(3.4rem,15vw,7.6rem)}h2{letter-spacing:-.045em;font-size:clamp(2.65rem,11vw,5.4rem)}em{color:#ffccd5;font-style:italic}.eyebrow{text-transform:uppercase;letter-spacing:.25em;color:#d4af77;margin-bottom:22px;font-size:10px}.lead,.subcopy,.message-copy,.garden-copy,.roses-copy,.final-copy{color:#ffccd5;font-size:clamp(.98rem,3.8vw,1.15rem);line-height:1.8}.lead{margin:25px 0 32px}.lead strong{color:#fff8f0;font-weight:500}.primary-button{color:#250713;letter-spacing:.03em;background:#d4af77;border-radius:99px;justify-content:center;align-items:center;gap:9px;min-height:50px;padding:0 19px;font-size:11px;font-weight:600;transition:transform .25s,box-shadow .25s;display:inline-flex;box-shadow:0 10px 30px #d4af7722}.primary-button:active{transform:scale(.96)}.secondary-button{color:#fff8f0;background:0 0;border:1px solid #d4af7799}.halo{filter:blur(2px);z-index:-1;background:radial-gradient(circle,#f8c56c22 0,#0000 67%);border-radius:50%;width:min(76vw,450px);height:min(76vw,450px);position:absolute;top:22%;left:50%;transform:translate(-50%)}.intro-scene,.cake-scene,.garden-scene,.message-scene,.envelope-scene,.letter-scene,.roses-scene,.final-scene{width:100%;max-width:650px}.portrait-orbit{background:linear-gradient(135deg,#d4af77,#ff4d6d,#d4af77);border-radius:50%;width:78px;height:78px;margin:0 auto 27px;padding:3px;position:relative;box-shadow:0 0 30px #d4af7755}.portrait-orbit img{object-fit:cover;filter:grayscale()contrast(1.1);border-radius:50%;width:100%;height:100%}.intro-candles{justify-content:center;align-items:end;gap:24px;height:110px;margin-bottom:16px;display:flex}.mini-candle{background:linear-gradient(90deg,#6e2038,#e2a6a6 48%,#6e2038);border-radius:5px 5px 3px 3px;width:17px;height:55px;display:block;position:relative;box-shadow:0 10px 25px #ffbd6840}.mini-candle:nth-child(2){height:76px}.mini-candle:nth-child(3){height:96px}.mini-candle:nth-child(4){height:68px}.mini-candle:nth-child(5){height:48px}.mini-candle i,.flame{background:#ffcb69;border-radius:60% 40%;width:11px;height:20px;animation:1.3s ease-in-out infinite flicker;position:absolute;top:-23px;left:50%;transform:translate(-50%);box-shadow:0 0 18px 6px #ff9e2d99}.cake-scene h2{margin-bottom:14px}.cake-scene .subcopy{margin-bottom:10px}.cake-wrap{filter:drop-shadow(0 28px 25px #0b0105aa);width:min(78vw,290px);height:250px;margin:0 auto 12px;position:relative}.cake-plate{background:linear-gradient(#fff4e3,#d9b9a2);border-radius:50%;width:94%;height:19px;position:absolute;bottom:18px;left:3%;box-shadow:0 8px #8a344b}.cake-tier{background:linear-gradient(90deg,#be5370,#ffe1d5 45%,#d3607d 100%);border-radius:16px 16px 9px 9px;position:absolute;left:50%;transform:translate(-50%);box-shadow:inset 0 -8px #a13d5b,inset 0 8px #fff0e5}.base-tier{width:89%;height:75px;bottom:34px}.middle-tier{width:72%;height:60px;bottom:99px}.top-tier{width:54%;height:54px;bottom:151px}.cake-tier span{background:#a4133c;border-radius:50%;width:13px;height:13px;position:absolute;bottom:13px}.cake-tier span:first-child{left:20%}.cake-tier span:nth-child(2){left:48%}.cake-tier span:nth-child(3){left:76%}.candle{z-index:2;background:0 0;width:58px;height:100px;position:absolute;bottom:200px;left:50%;transform:translate(-50%)}.wax{background:linear-gradient(90deg,#fff0da,#d4af77,#fff6e9);border-radius:3px;width:16px;height:52px;position:absolute;bottom:8px;left:21px}.wick{background:#250713;width:2px;height:10px;position:absolute;bottom:59px;left:28px}.flame{background:#ffd56f;border-radius:55% 0 55% 55%;width:18px;height:29px;animation:.8s infinite alternate flicker;top:10px;left:29px;transform:translate(-50%)rotate(45deg)}.flame b{opacity:.8;background:#fff1b0;border-radius:50%;position:absolute;inset:5px}.candle.blown .flame{animation:.6s forwards snuff}.candle.blown:after{content:"";background:linear-gradient(90deg,#0000,#fff8f044,#0000);border-radius:50%;width:30px;height:70px;animation:2.7s ease-out forwards smoke;position:absolute;top:5px;left:30px}.tap-hint{color:#ffccd5;border:1px solid #ffccd53b;border-radius:99px;padding:10px 18px;font-size:11px;animation:1.7s infinite pulse;display:inline-block}.wish-reveal{color:#ffe5a8;justify-content:center;align-items:center;gap:9px;font-family:Cormorant Garamond,serif;font-size:18px;display:flex}.garden-scene h2{margin-bottom:30px}.garden{max-width:370px;height:255px;margin:auto;position:relative}.flower{transform-origin:bottom;position:absolute;bottom:8px;left:50%}.flower-0{transform:translate(-50%)scale(.95)}.flower-1{left:25%;transform:scale(.72)rotate(-8deg)}.flower-2{left:72%;transform:scale(.83)rotate(12deg)}.flower-3{left:8%;transform:scale(.48)rotate(-18deg)}.flower-4{left:88%;transform:scale(.55)rotate(22deg)}.stem{transform-origin:bottom;background:linear-gradient(#58703d,#273920);width:3px;height:180px;position:absolute;bottom:0;left:50%;transform:rotate(3deg)}.bloom{background:#9d173b;border-radius:50%;width:76px;height:76px;position:relative;box-shadow:inset 0 0 0 9px #be3754,0 0 30px #ff4d6d55}.bloom i{transform-origin:100% 100%;background:#c93158;border-radius:50% 0 50% 50%;width:42px;height:42px;position:absolute;top:17px;left:17px}.bloom i:first-child{transform:rotate(0)}.bloom i:nth-child(2){transform:rotate(72deg)}.bloom i:nth-child(3){transform:rotate(144deg)}.bloom i:nth-child(4){transform:rotate(216deg)}.bloom i:nth-child(5){transform:rotate(288deg)}.bloom:after{content:"";background:#7c1230;border-radius:50%;position:absolute;inset:28px;box-shadow:0 0 8px #d4af77}.garden-copy{margin:5px 0 26px}.message-scene{position:relative}.quote-mark{color:#d4af7717;font-family:Georgia,serif;font-size:180px;line-height:1;position:absolute;top:-70px;left:50%;transform:translate(-50%)}.message-scene h2{margin-bottom:22px}.message-copy{color:#fff8f0;font-family:Cormorant Garamond,serif;font-size:22px;line-height:1.5}.message-copy.soft{color:#ffccd5;margin-bottom:28px;font-size:20px}.message-divider,.final-divider{color:#d4af77;justify-content:center;align-items:center;gap:12px;margin:27px auto;display:flex}.message-divider span{background:#d4af7755;width:50px;height:1px;display:block}.envelope-scene h2{margin-bottom:40px}.envelope{perspective:900px;filter:drop-shadow(0 28px 24px #0c0108cc);background:0 0;width:min(84vw,355px);height:235px;margin:auto;transition:transform .5s;position:relative}.envelope:active{transform:translateY(4px)}.envelope-back,.envelope-front{background:linear-gradient(145deg,#7d1939,#3a071d);border-radius:5px;position:absolute;inset:0;overflow:hidden}.envelope-back:after,.envelope-front:before{content:"";background:#69132f;width:74%;height:140%;position:absolute;top:10%;transform:rotate(45deg)}.envelope-back:after{left:-33%}.envelope-front:before{right:-33%}.envelope-front{z-index:3;clip-path:polygon(0 38%,50% 76%,100% 38%,100% 100%,0 100%);background:linear-gradient(130deg,#4f0b25,#84183b)}.flap{z-index:4;clip-path:polygon(0 0,100% 0,50% 80%);transform-origin:top;backface-visibility:hidden;background:linear-gradient(145deg,#6f1434,#9c2348);width:100%;height:73%;transition:transform 1s cubic-bezier(.2,.7,.2,1);position:absolute;top:0;left:0}.is-open .flap{transform:rotateX(175deg)}.seal{z-index:7;color:#ffe5a8;background:radial-gradient(circle at 35% 25%,#e6bd6d,#a46c2f);border:2px solid #f0d18e99;border-radius:50%;place-items:center;width:54px;height:54px;transition:opacity .5s,transform 1s;display:grid;position:absolute;top:48%;left:50%;transform:translate(-50%,-50%);box-shadow:0 4px 14px #20000d88}.is-open .seal{opacity:0;transform:translate(-50%,-50%)scale(1.5)rotate(20deg)}.envelope-label{z-index:8;color:#ffddd5;width:100%;font-family:Cormorant Garamond,serif;font-size:21px;position:absolute;bottom:24px;left:50%;transform:translate(-50%)}.letter-peek{color:#a4133c;background:#fff8f0;place-items:start center;height:98%;padding-top:21px;font-family:Cormorant Garamond,serif;font-size:22px;transition:transform 1.2s .3s;display:grid;position:absolute;bottom:5px;left:10%;right:10%}.is-open .letter-peek{transform:translateY(-145px)}.envelope-hint{color:#d4af77;letter-spacing:.08em;margin-top:22px;font-size:11px}.letter-scene{flex-direction:column;align-items:center;max-width:590px;display:flex}.letter-paper{text-align:left;color:#421326;background:linear-gradient(135deg,#fff8f0,#f4e3ce);border:1px solid #d4af7788;width:min(100%,570px);max-height:56svh;padding:27px 22px 25px;position:relative;overflow-y:auto;box-shadow:0 25px 60px #10010888}.letter-paper:before{content:"";pointer-events:none;border:1px solid #d4af7755;position:absolute;inset:7px}.letter-corner{color:#bd9152;position:absolute;top:15px;right:18px}.letter-heading{direction:ltr;border-bottom:1px solid #d4af7777;align-items:center;gap:12px;margin:0 13px 19px;padding-bottom:12px;display:flex}.letter-heading img{object-fit:cover;filter:grayscale();border-radius:50%;width:42px;height:42px}.letter-heading span{letter-spacing:.2em;color:#a76d43;font-size:8px}.letter-heading h2{color:#671530;margin-top:3px;font-size:22px;line-height:1.1}.letter-paper article{padding:0 11px;font-family:Noto Naskh Arabic,serif;font-size:16px;line-height:1.8}.letter-paper article p{margin:0 0 13px}.letter-opening{color:#8f2348;font-weight:600;font-size:19px!important}.letter-highlight{color:#8c2044;text-align:center;font-family:Cormorant Garamond,Noto Naskh Arabic,serif;font-size:19px!important;line-height:1.45!important}.letter-sign{color:#8c2044;direction:ltr;justify-content:flex-end;align-items:center;gap:7px;margin:11px 15px 0;font-family:Cormorant Garamond,serif;font-size:18px;display:flex}.letter-scene>.primary-button{margin-top:20px}.roses-scene h2{margin-bottom:12px}.bouquet{width:min(100%,370px);height:270px;margin:0 auto;position:relative}.bouquet .flower{bottom:22px;transform:scale(.62)}.bouquet .flower:first-child{left:42%;transform:scale(.9)rotate(-10deg)}.bouquet .flower:nth-child(2){bottom:3px;left:18%}.bouquet .flower:nth-child(3){bottom:8px;left:66%}.bouquet .flower:nth-child(4){bottom:33px;left:4%}.bouquet .flower:nth-child(5){bottom:30px;left:82%}.bouquet:after{content:"";clip-path:polygon(8% 0,92% 0,100% 100%,0 100%);background:linear-gradient(130deg,#8b1c40,#d17684,#7c1230);width:60%;height:45px;position:absolute;bottom:5px;left:20%;box-shadow:0 15px 20px #16020a66}.roses-copy{margin-bottom:22px}.final-scene{flex-direction:column;align-items:center;display:flex}.final-portrait{border-radius:50%;width:92px;height:92px;margin-bottom:28px;padding:4px;position:relative}.final-portrait img{object-fit:cover;filter:grayscale();border-radius:50%;width:100%;height:100%}.portrait-ring{border:1px solid #d4af7799;border-radius:50%;animation:14s linear infinite spin;position:absolute;inset:-8px}.final-heart{color:#ff4d6d;filter:drop-shadow(0 0 18px #ff4d6d99);margin-bottom:22px;animation:2s ease-in-out infinite heartbeat}.final-scene h1{margin-bottom:21px}.final-copy{margin-bottom:2px}.final-divider{margin:26px auto 17px}.final-divider span{color:#d4af77;font-size:11px}.final-note{color:#ffccd5;font-family:Cormorant Garamond,serif;font-size:22px;font-style:italic}.replay-button{color:#d4af77;letter-spacing:.08em;background:0 0;border-bottom:1px solid #d4af7755;align-items:center;gap:8px;margin-top:28px;padding:8px 2px;font-size:11px;display:inline-flex}.sr-only{clip:rect(0 0 0 0);width:1px;height:1px;position:absolute;overflow:hidden}@keyframes flicker{0%,to{transform:translate(-50%)rotate(42deg)scale(1)}50%{transform:translate(-50%)rotate(49deg)scale(.86)}75%{transform:translate(-50%)rotate(38deg)scale(1.07)}}@keyframes snuff{to{opacity:0;transform:translate(-50%)rotate(30deg)scale(.1)}}@keyframes smoke{0%{opacity:.1;transform:translateY(0)scale(.4)}40%{opacity:.6}to{opacity:0;transform:translate(-16px,-80px)scale(1.5)}}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-18px)}}@keyframes drift{0%{transform:translate(0)rotate(0)}to{transform:translate(60px,100px)rotate(180deg)}}@keyframes pulse{0%,to{box-shadow:0 0 #ffccd500}50%{box-shadow:0 0 0 9px #ffccd51a}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes heartbeat{0%,to{transform:scale(1)}50%{transform:scale(1.1)}}@media (width>=700px){.scene{padding-top:115px}.topbar{padding-left:45px;padding-right:45px}.letter-paper{max-height:65svh;padding:35px 40px}.letter-paper article{font-size:18px}.letter-paper article p{margin-bottom:16px}.primary-button{min-height:54px;padding:0 22px}.cake-wrap{transform:scale(1.08)}.garden{margin-bottom:22px;transform:scale(1.12)}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}n+.real-bouquet{background:#250713;border:1px solid #d4af7788;margin:0 auto;position:relative;overflow:hidden;box-shadow:0 22px 45px #0e0209aa,0 0 0 8px #fff8f00a}.real-bouquet img{object-fit:cover;filter:saturate(1.12)contrast(1.04);width:100%;height:100%;display:block}.garden-bouquet{border-radius:48% 48% 18px 18px;width:min(82vw,330px);height:245px;transform:rotate(-2deg)}.garden-bouquet:after{content:"";pointer-events:none;background:linear-gradient(160deg,#fff8f01a,#0000 35%,#25071340);position:absolute;inset:0}.photo-glint{pointer-events:none;background:linear-gradient(105deg,#0000 42%,#fff8f044 48%,#0000 54%);animation:5s ease-in-out infinite photo-shimmer;position:absolute;inset:-30% -80%;transform:translate(-45%)}.roses-bouquet{border-radius:50% 50% 22px 22px;width:min(82vw,360px);height:270px;transform:rotate(2deg);box-shadow:0 25px 52px #100108aa,0 0 0 9px #fff8f00a}.roses-bouquet img{object-position:center 46%}.bouquet-ribbon{color:#ffe5a8;letter-spacing:.08em;z-index:2;background:linear-gradient(#9a2345,#5d0d29);border:1px solid #d4af7777;padding:7px 22px;font-family:Cormorant Garamond,serif;font-size:17px;position:absolute;bottom:14px;left:50%;transform:translate(-50%)rotate(-3deg);box-shadow:0 5px 12px #18020a88}@keyframes photo-shimmer{0%,55%{opacity:0;transform:translate(-55%)}65%{opacity:1}to{opacity:0;transform:translate(55%)}}