:root{font-family:DM Sans,sans-serif;color:#f7eae5;background:#170b13;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-optical-sizing:auto;font-weight:400;--ivory:#f7eae5;--muted:#c6a9ad;--wine:#4f1c32;--rose:#d9879c;--gold:#e8c8a5}*{box-sizing:border-box}html,body,#root{margin:0;width:100%;min-width:320px;min-height:100%;height:100%;overflow:hidden}button{font:inherit;color:inherit}.scene{position:relative;width:100%;height:100dvh;min-height:600px;overflow:hidden;isolation:isolate;background:radial-gradient(ellipse 58% 65% at 50% 61%,#341828,#24101c 48%,#170b13);display:grid;place-items:center}.scene:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;z-index:-1;background:linear-gradient(180deg,rgba(9,5,9,.27),transparent 36%,rgba(9,5,9,.28));pointer-events:none}.ambient{position:absolute;pointer-events:none;border-radius:50%;filter:blur(85px);opacity:.25}.ambient-one{width:36vw;height:36vw;min-width:320px;min-height:320px;background:#862d55;left:-12%;top:26%}.ambient-two{width:35vw;height:35vw;min-width:300px;min-height:300px;background:#704241;right:-15%;bottom:-9%;opacity:.17}.grain{position:absolute;top:-50%;right:-50%;bottom:-50%;left:-50%;z-index:8;pointer-events:none;opacity:.065;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='.87' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.4'/%3E%3C/svg%3E");animation:grain .25s steps(3) infinite}.star-field{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.star-field span{position:absolute;width:var(--spark-size);height:var(--spark-size);border-radius:50%;background:#f8d9c5;box-shadow:0 0 8px 1px #d495aa;opacity:0;animation:twinkle 5.5s ease-in-out infinite;animation-delay:var(--spark-delay)}.moon-glow{position:absolute;width:min(52vw,680px);aspect-ratio:1;border-radius:50%;left:50%;top:47%;transform:translate(-50%,-50%);background:radial-gradient(circle,rgba(176,98,123,.12),rgba(176,98,123,.035) 42%,transparent 70%);pointer-events:none}.opening{position:relative;z-index:2;text-align:center;width:min(92%,700px);padding:24px 20px 34px}.eyebrow{font-size:9px;letter-spacing:.28em;color:#d6aeb3;font-weight:500}.opening h1{font-family:Playfair Display,serif;font-size:clamp(52px,8vw,92px);font-weight:400;line-height:1.01;letter-spacing:-.05em;margin:30px 0 19px;color:#fbf1eb}.opening h1 em{font-weight:400;color:#df9bad}.intro-copy{font-family:Playfair Display,serif;font-style:italic;font-size:17px;line-height:1.8;color:#d0b3b6;margin:0 0 6px}.opening-note{font-family:Playfair Display,serif;font-size:14px;font-style:italic;color:#b78a94;margin:0 0 28px}.open-button{position:relative;display:inline-flex;align-items:center;gap:22px;border:1px solid rgba(235,194,193,.42);background:#f6dedb0e;border-radius:2px;padding:15px 19px;font-size:10px;letter-spacing:.09em;cursor:pointer;transition:background .3s,border-color .3s,box-shadow .3s}.open-button:hover{background:#f6dedb1f;border-color:#ebc2c1b8;box-shadow:0 0 35px #b66b8030}.opening-flower{position:absolute;width:70px;height:70px;right:12%;top:8%;filter:drop-shadow(0 0 18px #dc8ba377);opacity:.6}.opening-flower span{position:absolute;width:28px;height:46px;background:linear-gradient(180deg,#eb9bae,#a74e72);border-radius:90% 90% 45% 45%;left:21px;top:-5px;transform-origin:50% 40px;transform:rotate(calc(var(--i)*72deg));mix-blend-mode:screen}.opening-flower span:nth-child(1){--i:0}.opening-flower span:nth-child(2){--i:1}.opening-flower span:nth-child(3){--i:2}.opening-flower span:nth-child(4){--i:3}.opening-flower span:nth-child(5){--i:4}.opening-flower i{position:absolute;width:13px;height:13px;background:#f1d0a3;border-radius:50%;left:29px;top:28px;box-shadow:0 0 14px #f1d0a3}.hint{position:absolute;bottom:-14vh;left:50%;transform:translate(-50%);display:flex;align-items:center;gap:9px;color:#9e8087;font-size:8px;letter-spacing:.23em}.hint-spark{color:#d7a68d;font-size:10px}.garden{position:relative;width:100%;height:100%;min-height:600px;display:flex;align-items:center;flex-direction:column;padding:clamp(28px,5vh,54px) 22px 20px}.garden-header{z-index:2;width:min(100%,800px);display:flex;justify-content:space-between;align-items:center}.edition{font-size:9px;color:#a98b94;letter-spacing:.12em}.bouquet-art{position:absolute;top:4%;left:50%;margin-left:max(-390px,-43vw);width:min(86vw,780px);aspect-ratio:800/620;translate:var(--cursor-x,0px) var(--cursor-y,0px);transition:translate .5s ease;filter:drop-shadow(0 15px 24px #08030b55);will-change:translate;animation:bouquetEnter var(--entry-duration,.8s) ease both}.bouquet-svg{display:block;width:100%;height:100%;overflow:visible}.bouquet-glow{fill:#e19aaf;opacity:.2;filter:url(#softGlow);animation:glowPulse 5s ease-in-out infinite}.stem-path{fill:none;stroke:url(#stemGrad);stroke-width:5;stroke-linecap:round;stroke-dasharray:700;stroke-dashoffset:700;animation:stemDraw 2s cubic-bezier(.2,.75,.25,1) forwards;animation-delay:var(--stem-delay)}.leaf-unit{opacity:0;transform-box:fill-box;transform-origin:0 100%;animation:leafUnfold .8s cubic-bezier(.2,.75,.25,1) forwards;animation-delay:var(--leaf-delay)}.leaf-shape{fill:url(#leafGrad);stroke:#b7b58b;stroke-opacity:.34;stroke-width:1}.leaf-vein{fill:none;stroke:#d1ca9c;stroke-opacity:.62;stroke-width:1.15;stroke-linecap:round}.flower-head{opacity:0;transform-box:view-box;animation:headArrive .75s cubic-bezier(.2,.8,.25,1) forwards;animation-delay:var(--bloom-delay);transform-origin:center}.bloom-scale{transform-box:fill-box;transform-origin:center;animation:headSettle .85s cubic-bezier(.2,.8,.25,1) both;animation-delay:var(--bloom-delay)}.svg-petal{opacity:0;animation:petalFade .55s ease both;animation-delay:calc(var(--bloom-delay) + var(--petal-delay))}.petal-shape{stroke:#fff4e8;stroke-opacity:.42;stroke-width:.8;stroke-linejoin:round}.tone-rose .petal-shape{fill:url(#rosePetal)}.tone-blush .petal-shape{fill:url(#blushPetal)}.tone-coral .petal-shape{fill:url(#coralPetal)}.tone-ivory .petal-shape{fill:url(#ivoryPetal)}.petal-highlight{fill:none;stroke:#fff7e8;stroke-opacity:.4;stroke-width:1.1;stroke-linecap:round}.tone-rose .petal-highlight{stroke:#ffe3e6}.tone-coral .petal-highlight{stroke:#ffebe1}.sepal{fill:#59734e;stroke:#b8b880;stroke-opacity:.5;stroke-width:.8}.rose-inner path{fill:#cf7b91;stroke:#f2bdc1;stroke-opacity:.55;stroke-width:.8}.tone-blush .rose-inner path{fill:#e5a0ad}.tone-coral .rose-inner path{fill:#dc8a83}.tone-ivory .rose-inner path{fill:#e8cdb5}.flower-heart circle{fill:url(#coreGrad);stroke:#fff0cb;stroke-width:.7;stroke-opacity:.75}.flower-heart .center-ring{fill:none;stroke:#956a4f;stroke-opacity:.55;stroke-width:.65}.flower-heart path{fill:#865e43;stroke:#f7d9a4;stroke-width:.45}.pollen circle{fill:#fff0bd}.bouquet-wrap{transform-origin:400px 400px;animation:wrapSettle 1.1s cubic-bezier(.2,.7,.25,1) both;animation-delay:2.05s}.ribbon-band{fill:#dba4a3;stroke:#f5d4bc;stroke-width:1.4}.ribbon-tail{fill:#c4878e;stroke:#f2c5b3;stroke-width:1}.ribbon-knot{fill:#efc5ac;stroke:#fff0d8;stroke-width:1.5}.garden-footer{position:absolute;top:75%;left:50%;margin-left:max(-260px,-47vw);width:min(94%,520px);display:flex;flex-direction:column;align-items:center;text-align:center;z-index:3}.garden-message{font-family:Playfair Display,serif;font-size:clamp(16px,2vw,21px);font-style:italic;color:#f2d9d3;margin:0 0 15px;text-shadow:0 2px 20px #2a111d}.letter-button{padding:12px 18px;border:1px solid rgba(224,157,172,.52);background:#541e333d;color:#f2d9d3;font-family:Playfair Display,serif;font-size:13px;font-style:italic;letter-spacing:.025em;cursor:pointer;transition:background .25s,border-color .25s,box-shadow .25s,transform .25s}.letter-button:hover{background:#b75f7a33;border-color:#e7b1bc;box-shadow:0 0 24px #e98ea733;transform:translateY(-2px)}.controls{display:flex;align-items:center;gap:30px;margin-top:15px}.icon-button,.replay-button{display:flex;align-items:center;gap:8px;padding:7px 0;border:0;background:transparent;color:#c7aeb2;font-size:9px;letter-spacing:.12em;cursor:pointer;transition:color .2s}.icon-button:hover,.replay-button:hover{color:#fff0eb}.signature{display:block;margin-top:8px;font-family:Playfair Display,serif;font-size:11px;color:#b88d98;font-style:italic;letter-spacing:.06em}.petal-drift{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:4;overflow:hidden}.petal-drift span{position:absolute;top:-30px;left:var(--left);width:9px;height:14px;border-radius:80% 0;background:linear-gradient(135deg,#f0bfbe,#a85571);opacity:0;filter:drop-shadow(0 0 5px #eaa4b65a);animation:fall var(--fall-duration) linear var(--fall-delay) infinite;transform:rotate(30deg)}.petal-drift span:nth-child(2n){width:6px;height:10px;background:linear-gradient(135deg,#f6dfc6,#c78690)}.frame-corner{position:absolute;width:40px;height:40px;z-index:6;opacity:.2;pointer-events:none}.top-left{top:30px;left:30px;border-left:1px solid #d4a9a3;border-top:1px solid #d4a9a3}.bottom-right{bottom:30px;right:30px;border-right:1px solid #d4a9a3;border-bottom:1px solid #d4a9a3}.letter-overlay{position:absolute;top:0;right:0;bottom:0;left:0;z-index:20;display:grid;place-items:center;padding:22px;background:#0c050aad;-webkit-backdrop-filter:blur(9px);backdrop-filter:blur(9px)}.letter-card{position:relative;width:min(100%,520px);height:min(760px,86dvh);min-height:420px;display:flex;flex-direction:column;overflow:hidden;padding:clamp(26px,5vw,46px) clamp(23px,7vw,58px) 20px;background:radial-gradient(circle at 50% 0%,#fff6e9,#f6e4d5 58%,#edcfca);color:#4a2133;border:1px solid rgba(255,241,220,.8);box-shadow:0 30px 100px #09030b99,0 0 55px #e396aa2b;transform-origin:50% 85%}.letter-close{position:absolute;right:16px;top:15px;width:34px;height:34px;border:1px solid #98647855;background:transparent;color:#754259;display:grid;place-items:center;cursor:pointer;z-index:2;transition:background .2s}.letter-close:hover{background:#e8ccd0}.letter-ornament{position:absolute;top:18px;left:50%;transform:translate(-50%);display:flex;gap:18px;color:#bd8290;font-size:12px;opacity:.75}.letter-ornament span:nth-child(2){font-size:15px}.letter-scroll{overflow-y:auto;overscroll-behavior:contain;padding:18px 2px 20px;scrollbar-width:thin;scrollbar-color:#bd829066 transparent}.letter-scroll h2{font-family:Playfair Display,serif;font-size:clamp(30px,7vw,43px);font-weight:400;line-height:1.06;letter-spacing:-.035em;text-align:center;color:#5b293c;margin:20px 0 15px}.letter-scroll h2 em{color:#a45670;font-weight:400}.letter-rule{width:42px;height:1px;background:#c89098;margin:0 auto 22px}.letter-photo{width:min(48%,150px);margin:0 auto 18px;text-align:center}.letter-photo img{display:block;width:100%;height:auto;border:5px solid #fff9ef;outline:1px solid #bd8992;box-shadow:0 8px 24px #56283a24;transform:rotate(-1.2deg)}.letter-photo figcaption{margin-top:10px;font-family:Playfair Display,serif;font-size:12px;font-style:italic;color:#985d70}.letter-copy{white-space:pre-line;font-family:Playfair Display,serif;font-size:clamp(14px,3.7vw,16px);line-height:1.72;color:#533240;margin:0}.letter-bottom{flex:0 0 auto;display:flex;align-items:center;justify-content:space-between;gap:10px;padding-top:14px;border-top:1px solid #98647833;font-family:Playfair Display,serif;font-style:italic;font-size:13px;color:#93586b}.letter-bottom button{display:flex;align-items:center;gap:6px;padding:8px 0;border:0;background:none;color:#78445a;font-family:DM Sans,sans-serif;font-size:10px;letter-spacing:.03em;cursor:pointer}.letter-bottom button:hover{color:#b25070}.heart-confetti{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;overflow:hidden}.heart-confetti span{position:absolute;left:calc(8% + var(--heart-i)*12%);bottom:-15px;width:9px;height:9px;opacity:0;background:#cf8293;transform:rotate(45deg);animation:heartRise 3.8s ease-out infinite;animation-delay:calc(var(--heart-i)*.22s)}.heart-confetti span:before,.heart-confetti span:after{content:"";position:absolute;width:9px;height:9px;border-radius:50%;background:inherit}.heart-confetti span:before{left:-5px}.heart-confetti span:after{top:-5px}.letter-card>*:not(.heart-confetti){z-index:1}@keyframes bouquetEnter{0%{opacity:0;translate:0 14px}to{opacity:1;translate:var(--cursor-x,0px) var(--cursor-y,0px)}}@keyframes twinkle{0%,to{opacity:0;transform:scale(.6)}45%{opacity:.65;transform:scale(1)}60%{opacity:.22}}@keyframes fall{0%{opacity:0;transform:translate3d(0,-5vh,0) rotate(0)}8%{opacity:.8}50%{transform:translate3d(28px,55vh,0) rotate(180deg)}92%{opacity:.65}to{opacity:0;transform:translate3d(-15px,110vh,0) rotate(390deg)}}@keyframes grain{0%{transform:translate(0)}25%{transform:translate(-2%,1%)}50%{transform:translate(1%,-2%)}75%{transform:translate(2%,2%)}to{transform:translate(-1%,-1%)}}@keyframes stemDraw{to{stroke-dashoffset:0}}@keyframes leafUnfold{0%{opacity:0;scale:.05 .1}70%{opacity:1;scale:1.08 1}to{opacity:1;scale:1 1}}@keyframes headArrive{to{opacity:1}}@keyframes headSettle{0%{scale:.25;rotate:-10deg}76%{scale:1.025;rotate:2deg}to{scale:1;rotate:0deg}}@keyframes petalFade{0%{opacity:0}to{opacity:1}}@keyframes wrapSettle{0%{opacity:0;scale:.94 1.05}to{opacity:1;scale:1 1}}@keyframes glowPulse{0%,to{opacity:.13;scale:.96}50%{opacity:.26;scale:1.04}}@keyframes heartRise{0%{opacity:0;translate:0 0;rotate:45deg}12%{opacity:.55}to{opacity:0;translate:12px -420px;rotate:115deg}}@media(max-width:700px){.scene{min-height:560px}.opening{padding-inline:13px}.opening h1{font-size:clamp(45px,12vw,67px);margin:26px 0 14px}.opening h1 em{font-size:.87em}.intro-copy{font-size:15px}.opening-note{font-size:13px;margin-bottom:24px}.opening-flower{right:3%;top:6%;transform:scale(.72)}.hint{bottom:-11vh}.garden{min-height:560px;padding:26px 15px 12px}.garden-header{padding-inline:7px}.edition{font-size:8px}.bouquet-art{top:8.5%;margin-left:-52vw;width:104vw}.garden-footer{top:58%;margin-left:-47vw;width:94%}.garden-message{font-size:16px;margin-bottom:11px}.letter-button{padding:11px 15px;font-size:12px}.controls{margin-top:10px;gap:25px}.signature{margin-top:5px}.frame-corner{width:24px;height:24px}.top-left{top:17px;left:17px}.bottom-right{bottom:17px;right:17px}.letter-overlay{padding:13px}.letter-card{height:min(790px,91dvh);min-height:400px;padding:24px 23px 15px}.letter-scroll{padding-top:10px}.letter-scroll h2{margin-top:27px;margin-bottom:12px}.letter-copy{font-size:14px;line-height:1.65}.letter-bottom{font-size:12px}.letter-bottom button{font-size:9px}}@media(max-height:680px)and (min-width:701px){.garden{padding-top:22px}.bouquet-art{top:1%;width:min(73vw,670px)}.garden-footer{top:72%}.garden-message{margin-bottom:9px}.controls{margin-top:9px}.signature{margin-top:3px}}@media(max-width:380px){.garden-footer{top:56%}.bouquet-art{top:8.5%;margin-left:-52vw;width:104vw}.garden-message{font-size:15px}.letter-button{font-size:11px}.letter-copy{font-size:13px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-delay:0ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}.star-field span{opacity:.3}.petal-drift span{display:none}.stem-path{stroke-dashoffset:0}.leaf-unit,.flower-head{opacity:1}.svg-petal{scale:1 1}.bouquet-glow{opacity:.18}}
