/* A little universe: foundations */
:root{color-scheme:dark;--ink:#fff8fb;--muted:#d9d3dc;--pink:#ffc3d3;--violet:#d9b7ff;--ease:cubic-bezier(.22,1,.36,1);--safe-top:env(safe-area-inset-top,0px);--safe-bottom:env(safe-area-inset-bottom,0px)}
*{box-sizing:border-box}
html{min-height:100%;background:#050509}
body{margin:0;min-width:320px;min-height:100vh;min-height:100dvh;overflow:hidden;background:#050509;color:var(--ink);font-family:'DM Sans',sans-serif;-webkit-font-smoothing:antialiased}
button{font:inherit;color:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}
button:focus-visible,a:focus-visible{outline:2px solid var(--pink);outline-offset:5px}
.skip-link{position:fixed;z-index:100;left:16px;top:-80px;padding:10px 16px;background:#1b1422;color:var(--ink)}
.skip-link:focus{top:16px}
::selection{background:#a66790;color:white}

/* The sky remains in place while the story changes. */
.world,.story,.scene,.petal-layer{position:fixed;inset:0}
.world{z-index:0;overflow:hidden;pointer-events:none;background:radial-gradient(ellipse 62% 46% at 50% 89%,rgba(62,34,73,.12),transparent 80%),#050509;transition:background 2s ease}
.world::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(5,5,9,.2),transparent 45%,rgba(5,5,9,.55));pointer-events:none}
.world-glow{position:absolute;inset:-12%;opacity:.07;background:radial-gradient(ellipse 34% 33% at 53% 42%,#a86cba,transparent 80%),radial-gradient(ellipse 37% 30% at 21% 84%,#633f75,transparent 85%);filter:blur(38px);transform:translate3d(var(--glow-x,0px),var(--glow-y,0px),0);transition:opacity 2s ease}
#starfield{position:absolute;inset:0;width:100%;height:100%;opacity:.12;transition:opacity 2.5s ease}
.star-fallback{display:none;position:absolute;inset:0;background-image:radial-gradient(1px 1px at 12% 18%,#fff8fb 99%,transparent),radial-gradient(1px 1px at 63% 29%,#fff8fb 99%,transparent),radial-gradient(1px 1px at 81% 64%,#fff8fb 99%,transparent),radial-gradient(1px 1px at 28% 71%,#fff8fb 99%,transparent)}
.film-grain{position:absolute;inset:-50%;opacity:.11;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='.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.21'/%3E%3C/svg%3E");pointer-events:none}
body[data-scene='2'] #starfield,body[data-scene='6'] #starfield{opacity:.91}
body[data-scene='3'] #starfield,body[data-scene='4'] #starfield,body[data-scene='5'] #starfield{opacity:.58}
body[data-scene='3'] #starfield{animation:skyFollow 5.2s .4s ease-in-out both}
body[data-scene='2'] .world-glow,body[data-scene='6'] .world-glow{opacity:.31}
body[data-scene='4'] .world-glow,body[data-scene='5'] .world-glow{opacity:.22}

/* Shared scene grammar */
.story{z-index:1;isolation:isolate}
.scene{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;min-height:100dvh;overflow:hidden;opacity:0;visibility:hidden;transform:translate3d(0,18px,0) scale(1.015);transition:opacity 1.25s ease,transform 1.5s var(--ease),visibility 1.25s;pointer-events:none}
.scene-active{opacity:1;visibility:visible;transform:translate3d(0,0,0) scale(1);pointer-events:auto}
.scene-exit{opacity:0;visibility:hidden;transform:translate3d(0,-20px,0) scale(.99);pointer-events:none}
.eyebrow,.scene-label,.scene-index,.letter-overline{font-size:.59rem;line-height:1.4;font-weight:500;letter-spacing:.32em;text-transform:uppercase;color:rgba(238,217,236,.52)}
.scene-label{position:absolute;z-index:2;top:calc(42px + var(--safe-top));left:50%;width:max-content;max-width:calc(100% - 50px);margin:0;transform:translateX(-50%);text-align:center}
.scene-index{position:absolute;bottom:calc(25px + var(--safe-bottom));left:50%;display:flex;align-items:center;gap:13px;margin:0;transform:translateX(-50%);color:rgba(238,217,236,.35);font-size:.56rem;letter-spacing:.19em}
.scene-index span{display:block;width:28px;height:1px;background:rgba(255,219,238,.27)}
.story-line{margin:0;font-family:'Cormorant Garamond',Georgia,serif;font-weight:400;letter-spacing:-.026em;text-wrap:balance}
.glass-button{display:inline-flex;align-items:center;justify-content:center;gap:34px;min-width:149px;min-height:49px;padding:12px 19px;border:1px solid rgba(255,227,240,.27);border-radius:2px;background:rgba(255,239,250,.045);box-shadow:inset 0 1px rgba(255,255,255,.08),0 8px 40px rgba(103,63,113,.08);backdrop-filter:blur(14px);color:#f7eaf0;font-size:.68rem;letter-spacing:.12em;text-transform:lowercase;transition:background .4s,border-color .4s,box-shadow .4s,transform .3s}
.glass-button:hover{background:rgba(255,239,250,.1);border-color:rgba(255,227,240,.5);box-shadow:0 0 32px rgba(255,157,183,.16)}
.glass-button:active{transform:scale(.97)}
.glass-button span{font-size:.95rem;font-weight:300}

/* 01 — Almost darkness, then a single invitation. */
.scene-intro{background:radial-gradient(circle at 50% 48%,rgba(136,83,148,.075),transparent 28%)}
.intro-center{position:relative;display:flex;flex-direction:column;align-items:center;width:min(100% - 44px,780px);margin-top:-3vh;text-align:center}
.first-light{position:absolute;top:-51px;left:50%;width:5px;height:5px;border-radius:50%;background:#ffe9f5;box-shadow:0 0 11px 4px rgba(255,207,230,.5),0 0 55px 17px rgba(193,142,218,.22);transform:translateX(-50%) scale(0);animation:firstLight 2.1s .16s forwards}
.intro-kicker{margin:0 0 23px;opacity:0;animation:softReveal 1.5s 1.4s forwards}
.scene-intro h1{margin:0;font-family:'Cormorant Garamond',Georgia,serif;font-size:clamp(3.55rem,10.5vw,8.1rem);font-weight:400;line-height:.95;letter-spacing:-.057em;text-shadow:0 5px 55px rgba(255,202,226,.15);opacity:0;transform:translateY(12px);animation:softReveal 2s 1.1s forwards}
.soft-ellipsis{color:#d7a5c5}
.intro-subtitle{margin:24px 0 0;color:rgba(255,248,251,.68);font-family:'Cormorant Garamond',Georgia,serif;font-size:clamp(1.45rem,3.6vw,2.1rem);font-style:italic;font-weight:400;letter-spacing:.013em;opacity:0;animation:softReveal 1.8s 2.45s forwards}
.light-button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;width:160px;min-height:132px;margin-top:50px;padding:10px;border:0;background:transparent;opacity:0;animation:softReveal 1.5s 3.65s forwards}
.light-orb{position:relative;display:block;width:27px;height:27px;border-radius:50%;background:radial-gradient(circle at 37% 32%,#fff,#ffe7f4 31%,#d9a5cd 65%,#a978b4);box-shadow:0 0 0 10px rgba(255,185,219,.035),0 0 23px 5px rgba(255,192,224,.52),0 0 76px 14px rgba(205,142,213,.24);animation:orbBreathe 3.7s ease-in-out infinite;transition:transform .45s var(--ease),box-shadow .45s}
.light-button:hover .light-orb,.light-button:focus-visible .light-orb{transform:scale(1.2);box-shadow:0 0 0 13px rgba(255,185,219,.055),0 0 32px 9px rgba(255,192,224,.72),0 0 100px 23px rgba(205,142,213,.3)}
.light-label{color:rgba(255,237,245,.76);font-size:.73rem;letter-spacing:.18em;text-transform:lowercase}
.intro-index{opacity:0;animation:softReveal 1.5s 4.2s forwards}
.light-ripple{position:fixed;z-index:8;left:50%;top:50%;width:20px;height:20px;border:1px solid rgba(255,221,240,.8);border-radius:50%;box-shadow:0 0 45px 10px rgba(255,200,227,.28),inset 0 0 28px rgba(255,238,248,.2);pointer-events:none;opacity:0;transform:translate(-50%,-50%) scale(.2)}
.light-ripple.ripple-active{animation:lightRipple 1.45s var(--ease) forwards}

/* 02 — A letter written across the sky. */
.constellation-wrap{position:absolute;top:8%;left:50%;width:min(94vw,900px);height:min(70vh,690px);height:min(70dvh,690px);transform:translate3d(calc(-50% + var(--constellation-x,0px)),var(--constellation-y,0px),0);opacity:0;transition:opacity 1.8s}
.scene-universe.scene-active .constellation-wrap,.scene-finale.scene-active .constellation-wrap{opacity:1}
.constellation-wrap svg{width:100%;height:100%;overflow:visible}
.constellation-line{fill:none;stroke:rgba(255,207,231,.59);stroke-width:1.2;stroke-linecap:round;filter:drop-shadow(0 0 5px rgba(255,181,217,.52));stroke-dasharray:1;stroke-dashoffset:1;opacity:0}
.constellation-line.reveal{opacity:1;animation:drawLine 1.45s var(--ease) forwards}
.constellation-point{opacity:0;transition:opacity 1.2s}
.constellation-point.visible{opacity:1}
.constellation-point .aura{fill:#f8d9ee;opacity:.33}
.constellation-point .core{fill:#fff6f9}
.cosmic-copy{position:absolute;z-index:2;bottom:clamp(100px,13vh,170px);width:min(90%,720px);text-align:center}
.cosmic-copy .story-line{font-size:clamp(1.75rem,5vw,3.5rem);line-height:1.08;opacity:0;transform:translateY(12px);transition:opacity 1.8s,transform 1.8s var(--ease)}
.cosmic-copy .line-one{color:rgba(255,248,251,.78)}
.cosmic-copy .line-two{margin-top:8px;color:#fff8fb;font-style:italic;font-size:clamp(2.25rem,6.3vw,4.5rem)}
.cosmic-copy .show{opacity:1;transform:translateY(0)}

/* 03 — The descent is quiet. */
.scene-falling{background:linear-gradient(180deg,transparent 40%,rgba(30,21,40,.19) 77%,rgba(4,5,8,.65))}
.horizon{position:absolute;top:79%;left:-10%;width:120%;height:1px;background:linear-gradient(90deg,transparent,rgba(197,151,189,.13) 33%,rgba(240,200,227,.29) 50%,rgba(197,151,189,.13) 67%,transparent);box-shadow:0 0 30px 4px rgba(177,126,192,.08)}
.falling-star{position:absolute;z-index:2;top:22%;left:50%;width:10px;height:10px;border-radius:50%;background:#fff9fa;box-shadow:0 0 17px 4px rgba(255,225,242,.9),0 0 65px 13px rgba(223,166,224,.47);opacity:0;transform:translate3d(-50%,0,0)}
.falling-star::before{content:'';position:absolute;left:50%;bottom:7px;width:1px;height:90px;background:linear-gradient(0deg,rgba(255,218,241,.52),transparent);filter:blur(1px);transform:translateX(-50%)}
.falling-star i{position:absolute;inset:-22px;border-radius:50%;background:rgba(255,218,240,.21);filter:blur(18px)}
.scene-falling.scene-active .falling-star{animation:starFall 4.6s .55s cubic-bezier(.46,.02,.43,.94) forwards}
.ground-glow{position:absolute;z-index:1;top:79%;left:50%;width:10px;height:10px;border-radius:50%;background:#fff3fa;box-shadow:0 0 35px 10px rgba(255,196,226,.6),0 0 115px 36px rgba(171,114,190,.3);opacity:0;transform:translate(-50%,-50%) scale(.2)}
.scene-falling.scene-active .ground-glow{animation:groundPulse 1.8s 4.55s ease-out forwards}
.falling-copy{position:absolute;bottom:calc(12% + var(--safe-bottom));width:90%;margin:0;color:rgba(240,222,234,.78);font-family:'Cormorant Garamond',Georgia,serif;font-size:clamp(1.45rem,4vw,2.15rem);font-style:italic;text-align:center;opacity:0;transform:translateY(8px)}
.scene-falling.scene-active .falling-copy{animation:softReveal 1.5s 4.55s forwards}

/* 04 — The flower is one SVG, shared by later scenes. */
.scene-flower{background:radial-gradient(ellipse 39% 37% at 50% 72%,rgba(102,62,99,.095),transparent 88%)}
.flower-copy{position:absolute;z-index:3;top:clamp(76px,12vh,125px);width:min(90%,730px);text-align:center;pointer-events:none}
.flower-copy .story-line{font-size:clamp(1.55rem,4vw,2.9rem);line-height:1.1;opacity:0;transform:translateY(12px);transition:opacity 1.8s,transform 1.8s var(--ease)}
.flower-copy .flower-line-one{color:rgba(255,240,246,.78)}
.flower-copy .flower-line-two{margin-top:12px;color:#fff9fc;font-style:italic;font-size:clamp(2rem,5.3vw,3.8rem)}
.flower-copy .show{opacity:1;transform:translateY(0)}
.flower-art{position:fixed;z-index:3;left:50%;bottom:19%;width:min(60vw,330px);aspect-ratio:360/500;padding:0;border:0;background:transparent;opacity:0;visibility:hidden;pointer-events:none;transform:translateX(-50%) scale(.94);transform-origin:50% 100%;transition:left 1.5s var(--ease),bottom 1.5s var(--ease),width 1.5s var(--ease),opacity 1.5s,transform 1.5s var(--ease),visibility 1.5s;filter:drop-shadow(0 0 18px rgba(223,152,205,.13))}
body[data-scene='4'] .flower-art,body[data-scene='5'] .flower-art,body[data-scene='6'] .flower-art{opacity:1;visibility:visible;pointer-events:auto;transform:translateX(-50%) scale(1)}
body[data-scene='5'] .flower-art{left:calc(50% + min(29vw,290px));bottom:13%;width:min(32vw,190px);opacity:.74}
body[data-scene='6'] .flower-art{left:50%;bottom:17%;width:min(42vw,240px);opacity:.92}
.flower-art:hover .flower-halo,.flower-art:focus-visible .flower-halo,.flower-art.flower-pulse .flower-halo{opacity:.75;transform:translate(-50%,-50%) scale(1.14)}
.flower-art.flower-pulse{filter:drop-shadow(0 0 31px rgba(255,197,230,.55))}
.flower-halo{position:absolute;z-index:-1;top:37%;left:50%;width:90%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,rgba(239,166,216,.17),rgba(195,139,208,.055) 48%,transparent 71%);filter:blur(15px);opacity:.42;transform:translate(-50%,-50%);transition:opacity .7s,transform 1s var(--ease)}
.flower-svg{display:block;width:100%;height:100%;overflow:visible;transform-origin:50% 100%}
.flower-lavender .flower-svg{filter:hue-rotate(24deg)}
.flower-bloomed .flower-svg{animation:flowerIdle 6s ease-in-out infinite alternate}
.stem-shadow,.stem-main{fill:none;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:405;stroke-dashoffset:405}
.stem-shadow{stroke:#263f3d;stroke-width:10;opacity:.46}
.stem-main{stroke:url(#stem-gradient);stroke-width:5.2;filter:drop-shadow(0 0 5px rgba(189,214,201,.16))}
.leaf{opacity:0;fill:url(#leaf-gradient);stroke:rgba(229,233,215,.25);stroke-width:1.1}
.leaf-left{transform-origin:184px 369px;transform:scale(.12) rotate(25deg)}
.leaf-right{transform-origin:188px 299px;transform:scale(.12) rotate(-25deg)}
.leaf-vein{fill:none;stroke:rgba(235,246,232,.32);stroke-width:1}
.bud{opacity:0;transform:scale(.2);transform-origin:180px 155px}
.petal-stage{opacity:0;transform:scale(.17) rotate(-17deg);transform-origin:180px 145px;filter:drop-shadow(0 3px 7px rgba(76,34,76,.2))}
.outer-petals{fill:url(#petal-outer-gradient);stroke:rgba(255,239,247,.28);stroke-width:.8}
.middle-petals{fill:url(#petal-inner-gradient);stroke:rgba(255,247,250,.3);stroke-width:.8}
.inner-petals{fill:#f7cadb;stroke:rgba(255,249,250,.3);stroke-width:.7}
.center-aura,.flower-center,.center-spark{opacity:0}
.center-aura{fill:#ffe6d2}
.flower-center{fill:url(#flower-center-gradient);filter:drop-shadow(0 0 8px rgba(255,234,206,.65))}
.center-spark{fill:#fff}
.flower-blooming .stem-shadow,.flower-blooming .stem-main{animation:growStem 2.25s .1s cubic-bezier(.27,.54,.38,1) forwards}
.flower-blooming .leaf-left{animation:openLeftLeaf 1.4s 1.7s var(--ease) forwards}
.flower-blooming .leaf-right{animation:openRightLeaf 1.4s 2.35s var(--ease) forwards}
.flower-blooming .bud{animation:openPetals .8s 2.8s var(--ease) forwards}
.flower-blooming .outer-petals{animation:openPetals 2.3s 3.15s var(--ease) forwards}
.flower-blooming .middle-petals{animation:openPetals 2s 4.05s var(--ease) forwards}
.flower-blooming .inner-petals{animation:openPetals 1.6s 4.65s var(--ease) forwards}
.flower-blooming .center-aura,.flower-blooming .flower-center,.flower-blooming .center-spark{animation:centerGlow 2s 5.35s ease forwards}
.petal-layer{z-index:5;overflow:hidden;pointer-events:none}
.petal{position:absolute;top:0;left:0;width:var(--size);height:var(--petal-height);border-radius:72% 7% 75% 16%;background:linear-gradient(145deg,rgba(255,249,249,.9),rgba(247,176,213,.82) 50%,rgba(177,139,213,.55));box-shadow:0 0 8px rgba(245,169,218,.18);opacity:0;filter:blur(var(--blur));transform-origin:50% 45%;animation:petalFall var(--duration) linear forwards}
.petal.rising{animation:petalRise var(--duration) cubic-bezier(.13,.44,.28,1) forwards}
.bloom-mote{position:absolute;top:0;left:0;width:var(--size);height:var(--size);border-radius:50%;background:#fff2f9;box-shadow:0 0 8px 3px rgba(255,205,232,.55);opacity:0;animation:moteRise var(--duration) ease-out forwards}

/* 05 — The letter. */
.scene-letter{background:radial-gradient(ellipse 42% 42% at 50% 45%,rgba(69,42,72,.11),transparent 88%)}
.letter-invitation{z-index:2;margin-top:-12vh;text-align:center}
.letter-invitation .eyebrow{margin:0 0 18px}
.letter-invitation h2,.finale-copy h2{margin:0;font-family:'Cormorant Garamond',Georgia,serif;font-size:clamp(3.25rem,8vw,6.6rem);font-weight:400;line-height:1;letter-spacing:-.05em;text-wrap:balance}
.letter-invitation .glass-button{margin-top:37px}
.letter-overlay{position:fixed;z-index:20;inset:0;display:flex;align-items:center;justify-content:center;padding:calc(28px + var(--safe-top)) 14px calc(24px + var(--safe-bottom));background:rgba(4,4,9,.82);backdrop-filter:blur(15px);opacity:0;visibility:hidden;pointer-events:none;transition:opacity .8s,visibility .8s}
.letter-overlay.letter-opening,.letter-overlay.letter-open{opacity:1;visibility:visible;pointer-events:auto}
.letter-close{position:absolute;z-index:25;top:calc(16px + var(--safe-top));right:18px;width:44px;height:44px;border:1px solid rgba(255,235,246,.2);border-radius:50%;background:rgba(255,255,255,.035);font-family:Georgia,serif;font-size:1.8rem;font-weight:300;line-height:1;transition:background .3s,transform .3s}
.letter-close:hover{background:rgba(255,255,255,.1);transform:rotate(90deg)}
.envelope{position:absolute;z-index:2;width:min(70vw,310px);height:205px;filter:drop-shadow(0 20px 36px rgba(0,0,0,.35));opacity:0;transform:translateY(45px) scale(.9);perspective:900px}
.letter-opening .envelope{animation:envelopeEnter .8s .1s var(--ease) forwards}
.letter-open .envelope{opacity:0;transform:translateY(30px) scale(.9);transition:opacity .6s,transform .6s}
.envelope-back,.envelope-front,.envelope-flap,.envelope-paper-mini{position:absolute;inset:0}
.envelope-back{background:#b693aa;border:1px solid rgba(255,238,246,.28)}
.envelope-paper-mini{top:15px;left:8%;width:84%;height:85%;background:#f8f1ee;transform:translateY(0);box-shadow:0 -3px 8px rgba(44,23,42,.13)}
.letter-opening .envelope-paper-mini{animation:paperRise 1.2s 1.55s var(--ease) forwards}
.envelope-front{clip-path:polygon(0 0,50% 55%,100% 0,100% 100%,0 100%);background:linear-gradient(155deg,#c7a9bb,#a984a6 77%);box-shadow:inset 0 0 50px rgba(255,249,248,.11)}
.envelope-flap{height:56%;background:linear-gradient(180deg,#d4b7c7,#ad8ca9);clip-path:polygon(0 0,100% 0,50% 100%);transform-origin:50% 0}
.letter-opening .envelope-flap{animation:flapOpen 1.1s .92s var(--ease) forwards}
.envelope-seal{position:absolute;z-index:2;top:47%;left:50%;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:#dfbed0;color:#fff9f8;font-size:.77rem;transform:translate(-50%,-50%);box-shadow:0 2px 7px rgba(49,19,45,.23)}
.letter-opening .envelope-seal{animation:sealFade .3s .94s forwards}
.letter-sheet{position:relative;z-index:3;width:min(100%,580px);max-height:min(790px,calc(100dvh - 48px - var(--safe-top) - var(--safe-bottom)));background:#f6f0ed;color:#4d3e49;box-shadow:0 35px 100px rgba(0,0,0,.45),0 0 0 1px rgba(255,255,255,.25),inset 0 0 80px rgba(204,174,188,.14);opacity:0;visibility:hidden;transform:translateY(28px) scale(.82);transition:opacity .9s var(--ease),transform 1s var(--ease),visibility .9s;overflow:hidden}
.letter-sheet::before{content:'';position:absolute;inset:0;pointer-events:none;opacity:.21;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='.49' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.2'/%3E%3C/svg%3E")}
.letter-open .letter-sheet{opacity:1;visibility:visible;transform:translateY(0) scale(1)}
.letter-scroll{position:relative;max-height:inherit;overflow-y:auto;overscroll-behavior:contain;padding:clamp(26px,5.3vh,49px) clamp(26px,8vw,70px) 37px;scrollbar-width:thin;scrollbar-color:#cbb4c0 transparent}
.letter-overline{margin:0 0 23px;color:#a4869a;font-size:.55rem}
.letter-sheet h2{margin:0 0 19px;font-family:'Cormorant Garamond',Georgia,serif;font-size:clamp(2.5rem,6vw,3.65rem);font-weight:500;letter-spacing:-.045em;line-height:1}
.letter-body p{margin:0 0 16px;color:#564a54;font-family:'Cormorant Garamond',Georgia,serif;font-size:clamp(1.34rem,3.1vw,1.75rem);font-weight:500;line-height:1.17;letter-spacing:.002em}
.letter-body .letter-last{margin-top:23px;color:#4e3848;font-style:italic}
.letter-signature{margin:25px 0 0;font-family:'Cormorant Garamond',Georgia,serif;font-size:clamp(1.7rem,4vw,2.3rem);font-style:italic}
.postscript{display:block;min-height:44px;margin:8px 0 19px;padding:0;border:0;background:transparent;color:#927b8b;font-family:'Cormorant Garamond',Georgia,serif;font-size:1.17rem;font-style:italic;text-align:left;transition:color .3s}
.postscript:hover{color:#b678a1}
.postscript span{margin-left:7px;color:#c694b6;font-style:normal}
.keep-button{min-width:182px;border-color:#bba2b2;background:rgba(160,107,142,.05);color:#644a5d;box-shadow:none}
.keep-button:hover{border-color:#a17997;background:rgba(160,107,142,.1);box-shadow:0 0 18px rgba(174,107,158,.1)}

/* 06 — Keep the world awake. */
.scene-finale{background:radial-gradient(ellipse 45% 31% at 50% 88%,rgba(101,62,106,.14),transparent 88%)}
.finale-copy{position:absolute;z-index:4;top:clamp(72px,11vh,125px);width:90%;text-align:center}
.finale-copy .eyebrow{margin:0 0 15px}
.finale-copy h2{font-size:clamp(3.45rem,9vw,7rem)}
.finale-copy .period{color:#d1a0c7}
.finale-copy>p:last-child{margin:17px 0 0;color:rgba(243,228,240,.75);font-family:'Cormorant Garamond',Georgia,serif;font-size:clamp(1.35rem,3vw,1.9rem);font-style:italic;line-height:1.15}
.scene-finale .constellation-wrap{top:15%;width:min(88vw,780px);height:min(53dvh,530px);opacity:.44;pointer-events:none}
.scene-finale.scene-active .constellation-wrap{opacity:.44}
.finale-footer{position:absolute;bottom:calc(70px + var(--safe-bottom));display:flex;flex-direction:column;align-items:center;gap:15px;color:rgba(234,216,232,.5);font-size:.62rem;letter-spacing:.18em}
.finale-symbol{color:#ffd9e9;font-size:1rem;text-shadow:0 0 13px rgba(255,203,229,.75);animation:orbBreathe 4s ease-in-out infinite}

/* Small details and audio control */
.music-toggle{position:fixed;z-index:10;top:calc(15px + var(--safe-top));right:16px;display:grid;place-items:center;width:44px;height:44px;border:1px solid rgba(255,230,244,.13);border-radius:50%;background:rgba(16,12,24,.29);backdrop-filter:blur(10px);color:rgba(255,239,246,.76);transition:opacity .5s,border-color .3s,background .3s}
.music-toggle[hidden]{display:none}
.music-toggle:hover{border-color:rgba(255,230,244,.4);background:rgba(55,34,63,.35)}
.music-toggle svg{width:19px;height:19px}
.music-toggle .music-on-icon{display:none}
.music-toggle[aria-pressed='true'] .music-on-icon{display:block}
.music-toggle[aria-pressed='true'] .music-off-icon{display:none}
.cursor-glow{position:fixed;z-index:30;top:0;left:0;width:72px;height:72px;border-radius:50%;background:radial-gradient(circle,rgba(255,205,231,.13),transparent 70%);filter:blur(4px);pointer-events:none;opacity:0;transform:translate3d(-50%,-50%,0);transition:width .4s,height .4s,opacity .4s}
.cursor-glow.cursor-visible{opacity:1}
.cursor-glow.cursor-hover{width:114px;height:114px}
.hidden-message,.secret-message{position:fixed;z-index:31;left:50%;width:min(90%,600px);text-align:center;pointer-events:none;opacity:0;transform:translate(-50%,10px);transition:opacity 1s,transform 1s var(--ease)}
.hidden-message{top:10%;padding:12px 16px;color:#fff5f9;font-family:'Cormorant Garamond',Georgia,serif;font-size:clamp(1.7rem,5vw,2.65rem);font-style:italic;line-height:1.1;text-shadow:0 0 25px rgba(255,188,222,.55)}
.secret-message{bottom:calc(84px + var(--safe-bottom));display:flex;flex-direction:column;gap:4px;color:#fbe9f2;font-family:'Cormorant Garamond',Georgia,serif;font-size:1.4rem;font-style:italic;text-shadow:0 0 25px rgba(255,188,222,.38)}
.secret-message small{font-size:.94rem;color:#d5bbc9}
.hidden-message.show,.secret-message.show{opacity:1;transform:translate(-50%,0)}

/* Motion */
@keyframes firstLight{0%{opacity:0;transform:translateX(-50%) scale(0)}40%{opacity:1}100%{opacity:1;transform:translateX(-50%) scale(1)}}
@keyframes skyFollow{0%{transform:translateY(0)}80%{transform:translateY(-11px)}100%{transform:translateY(-8px)}}
@keyframes softReveal{to{opacity:1;transform:translateY(0)}}
@keyframes orbBreathe{50%{opacity:.75;filter:brightness(1.27)}}
@keyframes lightRipple{0%{opacity:.85;transform:translate(-50%,-50%) scale(.2)}100%{opacity:0;transform:translate(-50%,-50%) scale(65)}}
@keyframes drawLine{to{stroke-dashoffset:0}}
@keyframes starFall{0%{opacity:0;transform:translate3d(-50%,0,0) scale(.8)}12%{opacity:1}68%{opacity:1}93%{opacity:.95;transform:translate3d(calc(-50% + 2vw),56dvh,0) scale(.82)}100%{opacity:0;transform:translate3d(-50%,57dvh,0) scale(.14)}}
@keyframes groundPulse{0%{opacity:0;transform:translate(-50%,-50%) scale(.2)}30%{opacity:.9}100%{opacity:0;transform:translate(-50%,-50%) scale(12)}}
@keyframes growStem{to{stroke-dashoffset:0}}
@keyframes openLeftLeaf{to{opacity:1;transform:scale(1) rotate(0)}}
@keyframes openRightLeaf{to{opacity:1;transform:scale(1) rotate(0)}}
@keyframes openPetals{0%{opacity:0;transform:scale(.17) rotate(-17deg)}38%{opacity:1}100%{opacity:1;transform:scale(1) rotate(0)}}
@keyframes centerGlow{0%{opacity:0}100%{opacity:1}}
@keyframes flowerIdle{50%{transform:rotate(.8deg)}100%{transform:rotate(-.75deg)}}
@keyframes petalFall{0%{opacity:0;transform:translate3d(var(--start-x),var(--start-y),0) rotate(var(--rotation)) scale(.7)}12%{opacity:var(--opacity)}80%{opacity:var(--opacity)}100%{opacity:0;transform:translate3d(calc(var(--start-x) + var(--sway)),calc(var(--start-y) + var(--travel)),0) rotate(var(--end-rotation)) scale(1)}}
@keyframes petalRise{0%{opacity:0;transform:translate3d(var(--start-x),var(--start-y),0) rotate(var(--rotation)) scale(.7)}17%{opacity:var(--opacity)}72%{opacity:var(--opacity)}100%{opacity:0;transform:translate3d(calc(var(--start-x) + var(--sway)),calc(var(--start-y) - var(--travel)),0) rotate(var(--end-rotation)) scale(.55)}}
@keyframes moteRise{0%{opacity:0;transform:translate3d(var(--start-x),var(--start-y),0) scale(.3)}20%{opacity:var(--opacity)}75%{opacity:var(--opacity)}100%{opacity:0;transform:translate3d(calc(var(--start-x) + var(--sway)),calc(var(--start-y) - var(--travel)),0) scale(.2)}}
@keyframes envelopeEnter{to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes flapOpen{to{transform:rotateX(180deg)}}
@keyframes paperRise{to{transform:translateY(-85px)}}
@keyframes sealFade{to{opacity:0}}

/* Small screens, short screens, and motion preferences */
@media(max-width:600px){
  .intro-center{margin-top:-3vh}.intro-kicker{margin-bottom:20px}.scene-intro h1{font-size:clamp(3.25rem,13.4vw,5.3rem)}.intro-subtitle{margin-top:18px}.light-button{margin-top:37px}
  .scene-label{top:calc(62px + var(--safe-top));font-size:.52rem;letter-spacing:.24em}
  .constellation-wrap{top:17%;left:50%;width:115vw;height:52dvh}
  .cosmic-copy{bottom:calc(95px + var(--safe-bottom))}.cosmic-copy .story-line{font-size:clamp(1.7rem,7vw,2.7rem)}.cosmic-copy .line-two{font-size:clamp(2.1rem,8vw,3.1rem)}
  .flower-art{bottom:16%;width:min(69vw,270px)}body[data-scene='5'] .flower-art{left:77%;bottom:10%;width:145px;opacity:.58}body[data-scene='6'] .flower-art{bottom:18%;width:min(48vw,200px)}
  .flower-copy{top:calc(83px + var(--safe-top))}.flower-copy .story-line{font-size:clamp(1.48rem,6vw,2.2rem)}.flower-copy .flower-line-two{font-size:clamp(1.95rem,7vw,2.75rem)}
  .letter-invitation{margin-top:-14vh}.letter-invitation h2{font-size:clamp(3.15rem,11vw,4.7rem)}
  .letter-sheet{max-height:calc(100dvh - 42px - var(--safe-top) - var(--safe-bottom))}.letter-scroll{padding:26px 28px 29px}.letter-overline{margin-bottom:20px}.letter-sheet h2{margin-bottom:17px}.letter-body p{font-size:clamp(1.26rem,5.3vw,1.54rem);margin-bottom:13px}.letter-body .letter-last{margin-top:19px}.letter-signature{margin-top:20px}.desktop-break{display:none}
  .scene-finale .constellation-wrap{top:24%;width:114vw;height:42dvh}.finale-copy{top:calc(78px + var(--safe-top))}.finale-copy h2{font-size:clamp(3.5rem,12vw,5.3rem)}.finale-footer{bottom:calc(69px + var(--safe-bottom))}
}
@media(max-height:700px){.intro-kicker{margin-bottom:12px}.light-button{margin-top:21px;min-height:108px}.flower-art{width:min(56vw,245px);bottom:14%}.flower-copy{top:62px}.flower-copy .story-line{font-size:clamp(1.5rem,3.6vw,2.25rem)}.flower-copy .flower-line-two{font-size:clamp(2rem,4.6vw,2.9rem)}.finale-copy{top:62px}.finale-footer{bottom:47px}.scene-index{bottom:17px}}
@media(hover:none),(pointer:coarse){.cursor-glow{display:none}}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-delay:0ms!important;transition-duration:.2s!important}
  .scene-intro h1,.intro-subtitle,.intro-kicker,.light-button,.intro-index{opacity:1;transform:none}.first-light{transform:translateX(-50%) scale(1)}
  .flower-svg{animation:none!important}.petal{display:none}.cursor-glow{display:none}
}
