:root{color-scheme:light;font-family:'DM Sans',sans-serif;color:#4b2934;background:#f8eff2;font-synthesis:none}*{box-sizing:border-box}body{margin:0;min-height:100svh;display:grid;place-items:center;padding:40px 24px;background:radial-gradient(ellipse at 85% 10%,#fffafb 0,transparent 65%),#f8eff2}.gift{width:min(1020px,100%);display:grid;grid-template-columns:1fr 1fr;overflow:hidden;background:#fffafb;box-shadow:0 24px 80px #68213914;border:1px solid #fff;border-radius:3px}.flowers{margin:0;min-width:0;background:#ead5dc}.flowers img{width:100%;height:100%;min-height:620px;display:block;object-fit:cover}.note{text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:55px 35px}.eyebrow{font-size:12px;letter-spacing:.3em;margin:0 0 35px;color:#845665}.heart{font-family:Georgia,serif;font-size:33px;color:#a94b67;margin-bottom:25px}h1,.wish{font-family:'Cormorant Garamond',Georgia,serif;font-weight:400;font-size:clamp(30px,3.3vw,40px);line-height:1.2;margin:0}.wish{margin-top:24px;font-size:clamp(32px,3.7vw,44px)}em{font-weight:400;color:#902e49}.signature{margin-top:46px}.signature span{display:block;width:34px;height:1px;background:#dbb6c3;margin:0 auto 20px}.signature p{font-family:'Cormorant Garamond',Georgia,serif;font-style:italic;font-size:23px;margin:0;color:#845665}@media(max-width:650px){body{padding:20px 16px}.gift{max-width:430px;grid-template-columns:1fr}.flowers{height:auto;aspect-ratio:1/1}.flowers img{min-height:0;object-position:50% 58%}.note{padding:28px 20px 34px}.eyebrow{margin-bottom:12px;font-size:12px}.heart{font-size:25px;margin-bottom:12px}h1{font-size:30px}.wish{font-size:34px;margin-top:16px}.signature{margin-top:25px}.signature span{margin-bottom:14px}.signature p{font-size:22px}}@media(prefers-reduced-motion:no-preference){.note{animation:appear 1.2s ease both}@keyframes appear{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}}

/* The copied project's heart slide now opens a single flower keepsake. */
[hidden]{display:none!important}button{font:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}button:focus-visible{outline:3px solid #b5657e;outline-offset:5px}.is-wrapped{overflow:hidden}.gift-controls{position:fixed;top:max(18px,env(safe-area-inset-top));right:20px;z-index:20}.gift-controls button{width:42px;height:42px;border:1px solid #d8bcc7;background:#fffafbeb;border-radius:50%;color:#902e49;font-size:21px}.gift-controls .playing{background:#902e49;color:#fff}.gift-cover{position:fixed;inset:0;z-index:10;display:grid;place-items:center;overflow:hidden;background:#341722;transform-origin:left center;perspective:1400px}.cover-photo{position:absolute;inset:-3%;background:url('assets/bouquet.webp') center 56%/cover no-repeat;filter:blur(2px);transform:scale(1.02)}.cover-shade{position:absolute;inset:0;background:linear-gradient(180deg,#2a101b55,#2a101b9e 40%,#210c18e6)}.cover-copy{position:relative;width:min(355px,calc(100% - 48px));text-align:center;color:#fff0e8;padding:60px 0}.cover-eyebrow{letter-spacing:.3em;font-size:12px;margin:0 0 28px}.cover-copy h2{font:400 clamp(54px,12vw,76px)/1.06 'Cormorant Garamond',Georgia,serif;margin:0}.cover-copy h2 em{color:#f2b7cd}.cover-rule{margin:28px 0;font:32px Georgia,serif}.swipe-track{height:66px;position:relative;border:1px solid #d7ae78;border-radius:50px;background:linear-gradient(120deg,#321722,#140b10);box-shadow:0 12px 28px #11070d55;overflow:hidden;--progress:0}.swipe-label{position:absolute;inset:0 12px 0 58px;display:flex;align-items:center;justify-content:center;font-size:12px;letter-spacing:.09em;color:#f7e4cd;opacity:calc(1 - var(--progress));pointer-events:none}.heart-handle{position:absolute;left:6px;top:6px;width:52px;height:52px;border:1px solid #ddb58666;border-radius:50%;color:#f5d4ac;background:#6b3546;font-size:28px;touch-action:none;user-select:none;box-shadow:0 0 20px #eab1c02e}.heart-handle.returning{transition:transform .4s cubic-bezier(.2,.8,.2,1)}#swipe-help{font-size:14px;color:#edcdd9;margin:17px 0 0}.rewrap{border:0;background:transparent;color:#845665;padding:16px;font-size:14px;display:block;margin:0 auto}.gift:focus{outline:none}body:not(.is-wrapped){grid-template-rows:1fr auto}.gift-cover.opening{pointer-events:none;animation:unwrap 1.05s cubic-bezier(.55,.05,.25,1) both}.gift-cover.opening .cover-copy{transition:opacity .3s;opacity:0}body.is-revealing .gift{animation:gift-arrives 1.2s ease both}body.is-revealing .note{animation:appear 1.2s .65s ease both}@keyframes unwrap{0%{transform:perspective(1600px) rotateY(0);opacity:1}75%{opacity:1}100%{transform:perspective(1600px) rotateY(-100deg);opacity:0}}@keyframes gift-arrives{from{opacity:.1;transform:translateY(20px) scale(.96)}to{opacity:1;transform:none}}@media(min-width:700px){.cover-photo{background-size:contain;background-repeat:no-repeat;background-color:#341722;filter:blur(1px)}}@media(prefers-reduced-motion:reduce){*,*:before{animation:none!important;transition:none!important}}
/* A luminous, layered message in place of the second-page photograph. */
body{background:#f8eaf0}body:not(.is-wrapped){display:block;padding:0}.gift{position:relative;width:100%;min-height:100svh;display:grid;place-items:center;overflow:hidden;border:0;border-radius:0;box-shadow:none;background:radial-gradient(ellipse at 82% 12%,#fffef0 0,#fff7e940 35%,transparent 58%),linear-gradient(145deg,#f6e2eb,#fff8f1 48%,#e9d9ed);perspective:1100px;isolation:isolate}.dreamscape{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:-1}.sun-halo{position:absolute;top:-130px;right:-90px;width:460px;height:460px;border-radius:50%;background:radial-gradient(circle,#fffffff5,#fff3baa0 25%,#ffe6a444 47%,transparent 70%);filter:blur(12px);animation:sun-breathe 7s ease-in-out infinite alternate}.sun-rays{position:absolute;width:180vmax;height:180vmax;top:-90vmax;right:-80vmax;background:repeating-conic-gradient(from 0deg,#fff9d755 0deg,transparent 9deg,transparent 20deg,#fff8d750 24deg,transparent 30deg);filter:blur(9px);opacity:.65;animation:sun-turn 95s linear infinite}.bloom{position:absolute;width:clamp(240px,48vw,580px);height:clamp(300px,65vw,720px);background:url('assets/floral-frame.webp') center/contain no-repeat;opacity:.22;filter:saturate(.65) hue-rotate(325deg);transform-origin:bottom center;mask-image:linear-gradient(transparent,#000 45%);animation:flower-bloom 3s cubic-bezier(.16,1,.3,1) both}.bloom-left{left:-14%;bottom:-16%;rotate:-20deg}.bloom-right{right:-15%;bottom:-20%;rotate:20deg;animation-delay:.35s}.message-depth{width:min(760px,100%);padding:95px 24px 110px;transform-style:preserve-3d;transform:rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg));will-change:transform}.note{padding:25px 12px;background:none;transform-style:preserve-3d}.note .eyebrow{color:#8d5a69;letter-spacing:.32em;transform:translateZ(20px)}.note .heart{color:#aa5472;transform:translateZ(42px);text-shadow:0 0 25px #f6a7c3}.note h1{font-size:clamp(34px,6vw,59px);line-height:1.17;color:#633146;transform:translateZ(45px);text-shadow:0 1px 0 #dbaab8,0 2px 0 #d5a2b1,0 3px 0 #cd98a9,0 7px 16px #74374a20,0 0 28px #ffffff}.note .wish{font-size:clamp(39px,7vw,67px);line-height:1.13;transform:translateZ(70px);margin-top:32px;color:#633146;text-shadow:0 1px 0 #e4b6c7,0 2px 0 #d7a4b8,0 3px 0 #cd96ac,0 12px 24px #69213b20}.note .wish em{color:#a33f64;text-shadow:0 1px 0 #edc3d0,0 2px 0 #dba6ba,0 3px 0 #cb8da7,0 0 24px #ffc5d580}.note .signature{transform:translateZ(30px);margin-top:43px}.note .signature p{font-size:26px}.is-revealing .note{animation:message-bloom 1.8s .3s both!important}.is-revealing .note .wish{animation:words-glow 4s 1.6s ease-in-out infinite alternate}.spark{position:absolute;width:var(--size);height:var(--size);left:var(--left);top:110%;border-radius:50%;background:#fffdf0;box-shadow:0 0 9px 3px #ffd5a26e;animation:float-light var(--duration) var(--delay) linear infinite}.butterfly{position:absolute;left:var(--left);top:var(--top);width:var(--size);height:var(--size);color:var(--color);opacity:.75;filter:drop-shadow(0 3px 5px #80335220);animation:butterfly-flight var(--duration) var(--delay) ease-in-out infinite alternate}.butterfly svg{width:100%;height:100%;overflow:visible}.wing-left{transform-origin:30px 28px;animation:wing-beat .32s ease-in-out infinite alternate}.wing-right{transform-origin:30px 28px;animation:wing-beat .32s .08s ease-in-out infinite alternate}.tilt-toggle{position:absolute;bottom:64px;left:50%;transform:translateX(-50%);padding:10px 16px;border:1px solid #d4a7b8;border-radius:30px;background:#fff8f1b8;color:#85445c;font-size:13px;white-space:nowrap}.rewrap{position:relative;z-index:2;margin:-52px auto 8px;color:#85445c}.gift-controls{display:flex;gap:8px}#effects-toggle{font-size:16px}.effects-paused *,.effects-paused *:before{animation-play-state:paused!important}.effects-paused .message-depth{transform:none!important}@keyframes message-bloom{from{opacity:0;filter:blur(12px);transform:translateY(24px) scale(.9)}to{opacity:1;filter:blur(0);transform:none}}@keyframes words-glow{to{filter:drop-shadow(0 0 14px #efabc266)}}@keyframes sun-breathe{to{transform:scale(1.16);opacity:.65}}@keyframes sun-turn{to{transform:rotate(360deg)}}@keyframes flower-bloom{from{opacity:0;transform:scale(.5) rotate(-10deg)}to{opacity:.22;transform:scale(1) rotate(0)}}@keyframes float-light{from{transform:translate(0,0);opacity:0}15%{opacity:.8}85%{opacity:.7}to{transform:translate(65px,-115vh);opacity:0}}@keyframes butterfly-flight{0%{transform:translate(0,0) rotate(-15deg)}35%{transform:translate(38px,-50px) rotate(10deg)}65%{transform:translate(-25px,-90px) rotate(-12deg)}100%{transform:translate(35px,-145px) rotate(18deg)}}@keyframes wing-beat{from{transform:scaleX(1)}to{transform:scaleX(.3)}}@media(max-width:650px){.note h1{font-size:clamp(31px,8vw,43px)}.note .wish{font-size:clamp(37px,9.6vw,51px)}.message-depth{padding:85px 22px 115px}.note .signature{margin-top:35px}.bloom{opacity:.2}.note .eyebrow{margin-bottom:20px}.note .heart{margin-bottom:20px}}@media(prefers-reduced-motion:reduce){.message-depth{transform:none!important}.is-revealing .note{animation:none!important}.spark{display:none}.butterfly{animation:none}.sun-rays{animation:none}}

.gift{max-width:none}.bloom{mix-blend-mode:multiply}.note .wish em{display:inline-block}@media(max-width:650px){.message-depth{width:100%}.note .wish{font-size:clamp(35px,8.6vw,49px)}}
/* Sculpted lettering: clean pearl faces, rose edges, and restrained depth. */
.note h1{font-weight:500;color:#763d55;text-shadow:0 1px 0 #fff8fb,0 2px 0 #ddb1c1,0 3px 0 #c78da3,0 8px 12px #72364b16;font-size:clamp(33px,5.4vw,53px);line-height:1.22}.note .wish{font-size:clamp(42px,7.5vw,76px);line-height:1.12;color:#8b4a62;text-shadow:0 1px 0 #fff4f9,0 2px 0 #dfafc2,0 3px 0 #c98aa3,0 4px 0 #b47790,0 12px 20px #60223b20}.note .wish em{font-weight:500;display:block;margin-top:12px;color:#923c61;background:linear-gradient(165deg,#fff5fb 0%,#f6d4e3 20%,#a64c76 45%,#813357 53%,#dea0bb 78%,#fff0f8 100%);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(0 1px 0 #b47794) drop-shadow(0 2px 0 #9a5877) drop-shadow(0 10px 10px #6c264033);text-shadow:none}.note .wish{margin-top:35px}.note .signature{margin-top:38px}.is-revealing .note{animation:clear-reveal 1.5s .25s both!important}.is-revealing .note .wish{animation:none!important}.message-depth{transition:filter .3s}.note .eyebrow{color:#805363}.note .heart{font-size:30px;color:#ac5a7c;text-shadow:0 1px 0 #fff,0 2px 0 #d3a1b8,0 7px 12px #a04f7130}@keyframes clear-reveal{from{opacity:0;transform:translateY(18px) scale(.96)}to{opacity:1;transform:none}}@media(max-width:650px){.note h1{font-size:clamp(30px,7.2vw,39px)}.note .wish{font-size:clamp(39px,10vw,57px)}.note .wish em{max-width:11em;margin:14px auto 0}.message-depth{padding-left:20px;padding-right:20px}.note{padding-left:0;padding-right:0}}@media(prefers-reduced-motion:reduce){.is-revealing .note{animation:none!important}}
/* A single warm flash replaces the hinged book opening. */
.gift-cover.opening{transform-origin:center;animation:flash-cover-out .8s ease-out both}.gift-cover.opening .cover-copy{transition:opacity .18s;opacity:0}.gift-flash{position:fixed;inset:0;z-index:30;pointer-events:none;opacity:0;background:radial-gradient(ellipse at center,#fffef8 0%,#fff9e9 46%,#ffe5dc 100%)}.gift-flash.burst{animation:gift-flash 1.25s ease-out both}body.is-revealing .gift{animation:flash-gift-in 1.2s ease-out both}.is-revealing .note{animation:clear-reveal 1.3s .4s both!important}@keyframes gift-flash{0%{opacity:0;transform:scale(.96)}16%{opacity:.96;transform:scale(1)}32%{opacity:.93}100%{opacity:0;transform:scale(1)}}@keyframes flash-cover-out{0%,18%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(1.045)}}@keyframes flash-gift-in{from{opacity:0;transform:scale(.985)}to{opacity:1;transform:scale(1)}}@media(prefers-reduced-motion:reduce){.gift-flash{display:none!important}.gift-cover.opening{animation:none!important}.is-revealing .note{animation:none!important}}
/* Each butterfly has its own velocity; wing flutter remains independent. */
.butterfly{left:0;top:0;animation:none;will-change:transform}.effects-paused .butterfly{will-change:auto}@media(prefers-reduced-motion:reduce){.butterfly{left:var(--left);top:var(--top);transform:none!important}}
.gift{touch-action:pinch-zoom;user-select:none;-webkit-user-select:none}.glow-heart{position:relative;border:0;background:transparent;min-width:64px;min-height:64px;display:grid;place-items:center;cursor:pointer;touch-action:none;--charge:0}.glow-heart:before{content:'';position:absolute;inset:-18px;border-radius:50%;pointer-events:none;background:radial-gradient(circle,#fffbd9,#ffd48480 35%,#ef94b94d 55%,transparent 72%);opacity:var(--charge);transform:scale(calc(.7 + var(--charge)*1.1));transition:opacity .2s;z-index:-1}.note .glow-heart{font-size:38px;margin-bottom:14px;transition:color .2s}.glow-heart.charging{color:#a43262;text-shadow:0 0 15px #ffecae,0 0 35px #ffc38f}.touch-bursts{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:5}.touch-spark,.touch-petal{position:absolute;display:block;pointer-events:none}.touch-spark{width:6px;height:6px;border-radius:50%;background:#fff9c8;box-shadow:0 0 7px 2px #eab54ba1}.touch-petal{width:28px;height:32px;background-size:contain;background-repeat:no-repeat;background-position:center;filter:drop-shadow(0 2px 3px #86466322)}.play-hint{position:absolute;bottom:62px;left:20px;right:20px;text-align:center;font-size:12px;line-height:1.7;color:#805363;margin:0;pointer-events:none}.message-depth{padding-bottom:150px}@media(prefers-reduced-motion:reduce){.touch-bursts{display:none}.glow-heart:before{display:none}}
/* Mobile touch surfaces: no selection handles, image dragging, or long-press menus. */
html,body,body *{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent}img,svg{-webkit-user-drag:none}.gift-cover{touch-action:pinch-zoom}.heart-handle,.glow-heart{touch-action:none}.gift-controls button,.rewrap{touch-action:manipulation;min-width:44px;min-height:44px}

.wing-left{animation-duration:var(--flap,.32s);animation-delay:var(--flap-offset,0s)}.wing-right{animation-duration:var(--flap,.32s);animation-delay:calc(var(--flap-offset,0s) + .06s)}
/* The message is sculpted from flowers; native text remains accessible. */
.accessible-message{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip-path:inset(50%)!important;white-space:nowrap!important;border:0!important}.floral-message{display:block;width:min(100%,520px);height:auto;max-height:64svh;object-fit:contain;transform:translateZ(48px);filter:drop-shadow(0 10px 15px #78334b12);pointer-events:none}.note .signature{margin-top:8px}.message-depth{padding:75px 22px 85px}.note{padding:0}.note .eyebrow{margin-bottom:5px}.note .glow-heart{margin-bottom:0}.is-revealing .floral-message{animation:floral-unfold 2.1s .25s cubic-bezier(.16,1,.3,1) both}@keyframes floral-unfold{from{opacity:0;transform:translateZ(48px) scale(.85)}to{opacity:1;transform:translateZ(48px) scale(1)}}@media(max-width:650px){.message-depth{padding:70px 12px 75px}.floral-message{width:100%;max-height:62svh}.note .signature p{font-size:24px}}@media(prefers-reduced-motion:reduce){.is-revealing .floral-message{animation:none!important}}
/* Generated transparent wing textures, hinged along the butterfly body. */
.butterfly{opacity:.92;perspective:160px;filter:drop-shadow(0 4px 4px #65374c26)}.texture-left,.texture-right{position:absolute;top:0;width:50%;height:100%;background-image:var(--texture);background-size:200% 100%;background-repeat:no-repeat;animation:textured-flap var(--flap,.3s) var(--flap-offset,0s) ease-in-out infinite alternate;backface-visibility:visible}.texture-left{left:0;background-position:left center;transform-origin:right center}.texture-right{right:0;background-position:right center;transform-origin:left center;animation-name:textured-flap-right}@keyframes textured-flap{from{transform:rotateY(0)}to{transform:rotateY(-62deg)}}@keyframes textured-flap-right{from{transform:rotateY(0)}to{transform:rotateY(62deg)}}@media(prefers-reduced-motion:reduce){.texture-left,.texture-right{animation:none!important}}
/* Live 3D flower lettering, with a readable fallback for unsupported devices. */
#floral-stage{position:relative;width:min(100%,650px);aspect-ratio:104/98;max-height:62svh;transform:translateZ(35px)}#floral-stage canvas{position:absolute;inset:0;width:100%;height:100%;display:block;pointer-events:none}.floral-fallback{font:500 clamp(22px,5.7vw,36px)/1.25 'Cormorant Garamond',Georgia,serif;color:#934361;padding:18px 4px}.floral-fallback span{display:block;margin:20px 0 12px}.floral-fallback strong{font-size:1.45em;font-weight:500}.webgl-ready:not(.webgl-fallback) .floral-fallback{visibility:hidden}.webgl-fallback canvas{display:none}.note .signature{margin-top:12px}.message-depth{padding:78px 28px 80px;width:min(760px,100%)}.note .eyebrow{margin-bottom:8px}.note .glow-heart{margin-bottom:2px}#butterflies{opacity:0;transition:opacity 1.6s ease}#butterflies.is-active{opacity:1}.texture-left,.texture-right{width:100%;background-size:100% 100%;transform-origin:50% 50%;left:0;right:auto}.texture-left{clip-path:polygon(0 0,44% 0,44% 100%,0 100%)}.texture-right{clip-path:polygon(56% 0,100% 0,100% 100%,56% 100%)}.texture-body{position:absolute;inset:0;background:var(--texture) center/100% 100% no-repeat;clip-path:polygon(44% 0,56% 0,56% 100%,44% 100%);pointer-events:none}.sun-rays{animation-duration:140s;opacity:.35;filter:none}.spark{opacity:.45}@media(max-width:650px){.message-depth{padding:76px 25px 85px}#floral-stage{max-height:60svh}.note .signature p{font-size:24px}.butterfly{width:calc(var(--size)*.8);height:calc(var(--size)*.8)}}
/* Phase-continuous wing strokes; body heading has unrestricted 360-degree travel. */
.natural-flight .texture-left,.natural-flight .texture-right{animation:none!important}.natural-flight .texture-left{transform:rotateY(calc(-1 * var(--wing-angle,20deg)))}.natural-flight .texture-right{transform:rotateY(var(--wing-angle,20deg))}
.cover-background-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;pointer-events:none}.gift-cover{background:#321722}@media(min-aspect-ratio:9/12){.cover-background-video{object-fit:contain}}
/* Foreground butterflies remain click-through so taps reach the flowers. */
#butterflies{position:absolute;inset:0;z-index:8;pointer-events:none;overflow:hidden;isolation:isolate}.gift-controls{z-index:20}

/* Give the flower-only message the space previously occupied by the heart. */
.message-depth{width:min(1000px,100%);padding:68px 12px 76px}.note{width:100%;padding:0}#floral-stage{width:100%;aspect-ratio:100/70;max-height:76svh}
@media(max-width:650px){.message-depth{padding:68px 8px 76px}#floral-stage{max-height:76svh}}

/* Four independently sized floral rows fill the portrait canvas. */
#floral-stage{height:min(76svh,900px);aspect-ratio:auto;max-height:none}.message-depth{padding-top:64px;padding-bottom:70px}

.sender-signature{position:absolute;bottom:58px;left:16px;right:16px;margin:0;text-align:center;font-family:"DM Sans",sans-serif;font-size:16px;font-weight:400;letter-spacing:.04em;color:#85445c;z-index:9;pointer-events:none}
