@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;1,500&family=Marck+Script&display=swap');
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#061329}body{color:#fff;font-family:"Cormorant Garamond",Georgia,serif}.app{position:relative;width:min(100vw,430px);height:100dvh;min-height:100svh;margin:auto;overflow:hidden;background:#07162e;touch-action:pan-y}.scene{position:absolute;inset:0;overflow:hidden;opacity:0;visibility:hidden;pointer-events:none}.scene.active{opacity:1;visibility:visible;pointer-events:auto}.shade{position:absolute;inset:0;z-index:2;background:linear-gradient(#05133030,transparent 54%,#05133038)}
/* scene 1 — keeps the approved living hero */
.s1-camera{position:absolute;inset:-2%;z-index:0;animation:s1Zoom 16s ease-in-out infinite alternate}.s1-camera img,.s2-camera img{width:100%;height:100%;object-fit:cover}.s1-copy{position:absolute;z-index:25;left:50%;top:13%;transform:translateX(-50%);width:min(88vw,390px);text-align:center;text-shadow:0 2px 12px #0007}.kicker{font:500 12px Georgia;letter-spacing:.28em;line-height:1.65;margin-bottom:12px;opacity:0;animation:rise .9s .35s forwards}.monogram{font:italic clamp(82px,26vw,120px)/.9 Georgia;color:#fff0cf;margin:0 0 16px;opacity:0;animation:rise 1.1s .7s forwards}.prompt{font:italic clamp(20px,6vw,27px)/1.45 Georgia;margin:0 auto 16px;max-width:330px;opacity:0;animation:rise 1s 1.1s forwards}.openBtn{width:86px;height:86px;border-radius:50%;border:1.5px solid #ffe7b6;background:#08173247;backdrop-filter:blur(4px);color:#ffe7b6;font-size:38px;cursor:pointer;box-shadow:0 0 24px #ffe2a526;animation:pulse 2.4s ease-in-out infinite}.tap{font:500 10px Georgia;letter-spacing:.2em;margin-top:10px}.spark{position:absolute;z-index:4;color:#fff3cf;opacity:.7;animation:twinkle 2.4s ease-in-out infinite}.petal{position:absolute;z-index:5;top:-8vh;width:10px;height:16px;border-radius:70% 20% 70% 20%;background:#ffdae2b8;animation:fall linear infinite}.gate{position:absolute;z-index:40;top:0;width:51%;height:100%;opacity:0;pointer-events:none;background:linear-gradient(90deg,#06142ef5,#17233be8);border-color:#d8b36b55}.gate:after{content:"";position:absolute;top:0;bottom:0;width:2px;background:linear-gradient(transparent,#e8c47c99 20%,#e8c47c99 80%,transparent)}.gate-l{left:0;border-right:1px solid #d8b36b55}.gate-l:after{right:0}.gate-r{right:0;border-left:1px solid #d8b36b55;background:linear-gradient(-90deg,#06142ef5,#17233be8)}.gate-r:after{left:0}.gate span{position:absolute;left:16%;right:16%;top:18%;bottom:18%;border:1px solid #d8b36b2e;border-radius:48% 48% 8% 8%}.gate-light{position:absolute;z-index:39;inset:0;opacity:0;background:radial-gradient(ellipse at 50% 50%,#fff9df 0,#ffd77eaa 28%,transparent 68%)}.s1.leaving .s1-copy{animation:copyOut .7s forwards}.s1.leaving .gate{opacity:1}.s1.leaving .gate-l{animation:gateL 2s cubic-bezier(.68,0,.2,1) forwards}.s1.leaving .gate-r{animation:gateR 2s cubic-bezier(.68,0,.2,1) forwards}.s1.leaving .gate-light{animation:gateLight 2.1s forwards}
/* scene 2 */
.s2{background:#07162e}.s2-camera{position:absolute;z-index:0;inset:-5%;transform:scale(1.065)}.s2.playing .s2-camera{animation:camera2 15s ease-out forwards}.s2-shade{position:absolute;z-index:2;inset:0;background:linear-gradient(#02081466 0%,#02081408 35%,#02081408 70%,#02081455 100%)}.s2-copy{position:absolute;z-index:80;top:4.5%;left:6%;right:6%;height:25%;text-align:center;text-shadow:0 3px 16px #000,0 1px 3px #000}.s2-copy>*{opacity:0;transform:translateY(10px)}.once{font-family:"Marck Script",cursive;color:#f7d78d;font-size:clamp(38px,10.5vw,52px);line-height:.98}.story{margin-top:8px;font-size:clamp(23px,6.1vw,30px);line-height:1.05}.names{color:#f8e0aa;font-size:clamp(29px,7.6vw,38px);font-style:italic;line-height:1}.sub{margin-top:7px;color:#f2d9a5;font-size:clamp(16px,4.2vw,20px);font-style:italic}.s2.playing .once{animation:copyIn .9s 5s forwards}.s2.playing .story{animation:copyIn .65s 6s forwards}.s2.playing .names{animation:copyIn .65s 6.25s forwards}.s2.playing .sub{animation:copyIn .65s 6.5s forwards}.couple-wrap{position:absolute;z-index:23;left:50%;top:28%;width:62%;height:43%;transform:translateX(-50%);pointer-events:none}.couple{position:absolute;left:50%;bottom:0;width:100%;max-height:100%;object-fit:contain;object-position:center bottom;opacity:0;transform:translate(-50%,36px) scale(.88);filter:blur(7px) drop-shadow(0 14px 24px #0009)}.s2.playing .couple{animation:coupleIn 1.35s 3s forwards,coupleLive 5s 4.6s ease-in-out infinite}.book-wrap{position:absolute;z-index:30;left:50%;bottom:5.5%;width:82%;height:29%;transform:translateX(-50%);pointer-events:none}.book{position:absolute;left:50%;bottom:0;object-fit:contain;opacity:0;filter:drop-shadow(0 14px 18px #0009)}.closed{width:57%;transform:translate(-50%,100px) scale(.78)}.opened{width:84%;transform:translate(-50%,15px) scale(.72)}.s2.playing .closed{animation:closedRise .95s 1s forwards,closedTilt .38s 1.9s forwards,closedGone .2s 2.18s forwards}.s2.playing .opened{animation:openReveal .65s 2.12s forwards,bookFloat 4s 3.1s ease-in-out infinite}.under-glow{position:absolute;left:50%;bottom:-4%;width:74%;height:78%;transform:translateX(-50%) scale(.3);opacity:0;border-radius:50%;background:radial-gradient(ellipse,#fffbdc 0,#ffd66caa 24%,#f2a72c44 48%,transparent 72%);filter:blur(7px)}.s2.playing .under-glow{animation:lightBurst 1.05s 1.92s forwards,lightPulse 3s 3.1s ease-in-out infinite}.flare{position:absolute;left:50%;bottom:24%;width:18%;aspect-ratio:1;transform:translate(-50%,50%) scale(.2);opacity:0;border-radius:50%;background:#fff9db;box-shadow:0 0 35px 15px #ffd66d,0 0 90px 35px #f2a52d88}.s2.playing .flare{animation:flare .7s 1.95s forwards}.dust{position:absolute;z-index:36;inset:0;pointer-events:none}.dust i{position:absolute;width:3px;height:3px;border-radius:50%;background:#fff0b5;box-shadow:0 0 10px #ffd267;opacity:0}.s2.playing .dust i{animation:dust var(--dur) var(--delay) linear infinite}.bfly{position:absolute;z-index:45;width:19%;opacity:0;filter:drop-shadow(0 0 8px #ffd56d);pointer-events:none}.b1{left:2%;top:48%}.b2{right:1%;top:52%;transform:scaleX(-1)}.b3{right:8%;bottom:21%;width:14%}.s2.playing .b1{animation:flyOutL 1.3s 4s forwards,liveL 4.8s 5.3s ease-in-out infinite}.s2.playing .b2{animation:flyOutR 1.45s 4.25s forwards,liveR 5.2s 5.7s ease-in-out infinite}.s2.playing .b3{animation:flyOutB 1.2s 4.5s forwards,liveB 4s 5.7s ease-in-out infinite}.swipe{position:absolute;z-index:90;left:50%;bottom:max(8px,env(safe-area-inset-bottom));transform:translateX(-50%);font-size:9px;letter-spacing:.18em;color:#f5deb2;white-space:nowrap;opacity:0;text-shadow:0 2px 8px #000}.swipe span{display:block;text-align:center;font-size:22px}.s2.ready .swipe{animation:copyIn .7s forwards}.s2.ready .swipe span{animation:bob 1.5s infinite}.exit-glow{position:absolute;z-index:110;inset:0;opacity:0;pointer-events:none;background:radial-gradient(circle at 76% 53%,#fffdf0 0,#ffd877 25%,#f2a72ca8 50%,transparent 74%)}.s2.leaving .b2{animation:toCamera 2s cubic-bezier(.2,.8,.2,1) forwards!important}.s2.leaving .exit-glow{animation:exitGlow 2s ease forwards}
@keyframes s1Zoom{to{transform:scale(1.035)}}@keyframes rise{from{opacity:0;transform:translateY(15px)}to{opacity:1;transform:none}}@keyframes pulse{50%{transform:scale(1.08);box-shadow:0 0 38px #ffe2a54d}}@keyframes twinkle{50%{opacity:.15;transform:scale(.6)}}@keyframes fall{to{transform:translate(60px,115vh) rotate(420deg)}}@keyframes copyOut{to{opacity:0;transform:translate(-50%,-10px) scale(.98)}}@keyframes gateL{0%{transform:translateX(0)}100%{transform:translateX(-102%)}}@keyframes gateR{0%{transform:translateX(0)}100%{transform:translateX(102%)}}@keyframes gateLight{0%{opacity:0}45%{opacity:.15}80%{opacity:.9}100%{opacity:1}}@keyframes camera2{from{transform:scale(1.065) translateY(.6%)}to{transform:scale(1.01) translateY(-.5%)}}@keyframes closedRise{to{opacity:1;transform:translate(-50%,0) scale(1)}}@keyframes closedTilt{to{opacity:1;transform:translate(-50%,0) perspective(500px) rotateX(10deg) rotateZ(-2deg) scale(.98)}}@keyframes closedGone{to{opacity:0}}@keyframes openReveal{0%{opacity:0;transform:translate(-50%,15px) scale(.72) rotateX(12deg)}100%{opacity:1;transform:translate(-50%,0) scale(1) rotateX(0)}}@keyframes bookFloat{50%{transform:translate(-50%,-3px) scale(1.01)}}@keyframes lightBurst{to{opacity:.9;transform:translateX(-50%) scale(1)}}@keyframes lightPulse{50%{opacity:.58;transform:translateX(-50%) scale(1.09)}}@keyframes flare{0%{opacity:0;transform:translate(-50%,50%) scale(.2)}45%{opacity:1;transform:translate(-50%,50%) scale(1.7)}100%{opacity:0;transform:translate(-50%,50%) scale(3)}}@keyframes coupleIn{to{opacity:1;transform:translate(-50%,0) scale(1);filter:blur(0) drop-shadow(0 14px 24px #0009)}}@keyframes coupleLive{50%{transform:translate(-50%,-3px) scale(1.008)}}@keyframes copyIn{to{opacity:1;transform:none}}@keyframes dust{0%{opacity:0;transform:translateY(0) scale(.5)}15%{opacity:.8}100%{opacity:0;transform:translateY(-42vh) translateX(var(--drift)) scale(1.15)}}@keyframes flyOutL{from{opacity:0;transform:translate(28vw,26vh) scale(.25)}to{opacity:.9;transform:none}}@keyframes flyOutR{from{opacity:0;transform:translate(-28vw,23vh) scaleX(-1) scale(.25)}to{opacity:.9;transform:scaleX(-1)}}@keyframes flyOutB{from{opacity:0;transform:translate(-15vw,18vh) scale(.25)}to{opacity:.9;transform:none}}@keyframes liveL{50%{transform:translate(9px,-14px) rotate(-5deg)}}@keyframes liveR{50%{transform:translate(-10px,-13px) scaleX(-1) rotate(5deg)}}@keyframes liveB{50%{transform:translate(-7px,-11px) rotate(-7deg)}}@keyframes bob{50%{transform:translateY(5px)}}@keyframes toCamera{0%{opacity:.9;transform:scaleX(-1)}45%{opacity:1;transform:translate(-18vw,-10vh) scaleX(-1) scale(2.8)}100%{opacity:1;transform:translate(-29vw,-17vh) scaleX(-1) scale(11)}}@keyframes exitGlow{0%,35%{opacity:0}100%{opacity:1}}
@media(min-width:700px){.app{box-shadow:0 0 80px #000a}}

.openStory{position:relative;z-index:100;display:flex;flex-direction:column;align-items:center;margin:0 auto;padding:0 18px 14px;border:0;background:transparent;color:inherit;font:inherit;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent}.openStory .prompt{display:block;margin:0 auto 16px}.openStory .openBtn{display:grid;place-items:center;position:relative;z-index:101;pointer-events:none}.openStory .tap{display:block}.s1-copy{pointer-events:auto}.openStory:focus{outline:none}

/* v3 mobile tap hardening */
#openStory{position:relative!important;z-index:9999!important;pointer-events:auto!important;-webkit-user-select:none;user-select:none;}
#openStory::before{content:"";position:absolute;inset:-18px -12px;z-index:-1;}
.s1.pressed .openBtn{transform:scale(.9);filter:brightness(1.5);transition:.12s ease;}
.gate,.gate-light,.spark,.petal,.shade,.s1-camera{pointer-events:none!important;}

.s1.active{cursor:pointer;touch-action:manipulation;}
/* === SCREEN 3 ONLY — verified rebuild. Screens 1-2 above remain untouched. === */
.s3{background:#07162e}.s3-camera{position:absolute;inset:-2%;z-index:0;transform:scale(1.055);pointer-events:none}.s3-camera img{width:100%;height:100%;object-fit:cover}.s3.playing .s3-camera{animation:s3Cam 17s ease-out forwards}.s3-vignette{position:absolute;inset:0;z-index:2;background:linear-gradient(#02081720,transparent 34%,#02081716 68%,#02081778 100%);pointer-events:none}
.s3-cloud{position:absolute;z-index:8;width:92%;opacity:0;pointer-events:none}.cloud-a{left:-48%;bottom:-5%}.cloud-b{right:-52%;top:24%;transform:scale(.52)}.s3.playing .cloud-a{animation:cloudA 2s .2s forwards,cloudAfloat 13s 2.2s ease-in-out infinite}.s3.playing .cloud-b{animation:cloudB 2s .2s forwards,cloudBfloat 16s 2.2s ease-in-out infinite}
.europe-group{position:absolute;z-index:20;left:3%;top:38%;width:45%;height:24%;pointer-events:none}.lm{position:absolute;opacity:0;transform-origin:50% 100%;object-fit:contain;will-change:transform,opacity}.eiffel{width:40%;left:39%;bottom:30%}.colosseum{width:62%;left:-4%;bottom:-2%}.sagrada{width:49%;right:-4%;bottom:-2%}.eurocastle{width:42%;left:0%;bottom:45%}.s3.playing .eiffel{animation:lmIn .6s 1.3s forwards,lmLive 4s 2.1s ease-in-out infinite}.s3.playing .colosseum{animation:lmIn .6s 1.7s forwards,lmLive 4.2s 2.5s ease-in-out infinite}.s3.playing .sagrada{animation:lmIn .6s 2.1s forwards,lmLive 4s 2.9s ease-in-out infinite}.s3.playing .eurocastle{animation:lmIn .6s 2.5s forwards,lmLive 4.4s 3.3s ease-in-out infinite}
.japan{position:absolute;z-index:19;right:1%;top:43%;width:38%;opacity:0;transform:translate(15px,15px) scale(.84);transform-origin:70% 80%;object-fit:contain;will-change:transform,opacity}.s3.playing .japan{animation:japanIn .85s 6.3s forwards,japanLive 5s 7.3s ease-in-out infinite}
.flight-route{position:absolute;z-index:26;inset:0;width:100%;height:100%;pointer-events:none;filter:drop-shadow(0 0 4px #ffd36f) drop-shadow(0 0 9px #f5aa2c)}.flight-route path{fill:none;stroke:#ffe5a1;stroke-width:2;stroke-linecap:round;stroke-dasharray:900;stroke-dashoffset:900}.s3.playing .flight-route path{animation:routeDraw 3.8s 3.2s ease-in-out forwards}.plane3{position:absolute;z-index:30;left:20%;top:43%;width:14%;opacity:0;object-fit:contain}.s3.playing .plane3{animation:planeGo 3.8s 3.15s cubic-bezier(.42,.05,.35,1) forwards}
.s3-copy{position:absolute;z-index:60;left:5%;right:5%;top:5.2%;text-align:center;text-shadow:0 3px 14px #000}.s3-copy>*{opacity:0;transform:translateY(8px)}.world{font-family:"Marck Script",cursive;color:#f6d58c;font-size:clamp(34px,9.2vw,47px);line-height:1}.travel{margin-top:8px;font-size:clamp(17px,4.7vw,23px);line-height:1.08;text-shadow:0 2px 3px #020916,0 0 8px #020916,0 0 16px #020916}.directions{margin-top:6px;color:#ffe4a9;font-size:clamp(17px,4.5vw,22px);font-style:italic;text-shadow:0 2px 3px #020916,0 0 9px #020916,0 0 17px #020916}.s3.playing .world{animation:copyIn .65s 8.0s forwards}.s3.playing .travel{animation:copyIn .55s 8.45s forwards}.s3.playing .directions{animation:copyIn .55s 8.85s forwards}
.carriage-shell{position:absolute;z-index:52;left:43%;top:82%;width:29%;height:12%;transform:translate(-50%,-50%);pointer-events:none;will-change:left,top,width,transform}.carriage3{position:absolute;left:50%;bottom:0;width:100%;opacity:0;transform:translate(-50%,70px) scale(.78);object-fit:contain;will-change:transform,opacity}.lamp-glow{position:absolute;left:50%;bottom:31%;width:68%;height:42%;opacity:0;transform:translateX(-50%);background:radial-gradient(circle at 25% 50%,#fffbd4 0,#ffc449 10%,transparent 26%),radial-gradient(circle at 75% 50%,#fffbd4 0,#ffc449 10%,transparent 26%);filter:blur(2px)}.s3.playing .lamp-glow{animation:lampIn .55s 9.6s forwards,lampPulse 1.7s 10.3s ease-in-out infinite}.s3.playing .carriage3{animation:carriageEnter .9s 10s forwards,carriageRest 2.4s 11s ease-in-out infinite}
.s3-bfly{position:absolute;z-index:40;width:7%;opacity:0}.sb1{left:4%;top:66%}.sb2{right:3%;top:30%;transform:scaleX(-1)}.s3.ready .sb1{animation:bfL 6s ease-in-out infinite}.s3.ready .sb2{animation:bfR 7s .5s ease-in-out infinite}.s3-swipe{position:absolute;z-index:75;left:50%;bottom:max(8px,env(safe-area-inset-bottom));transform:translateX(-50%);font-size:9px;letter-spacing:.18em;color:#f5deb2;white-space:nowrap;opacity:0;text-shadow:0 2px 8px #000}.s3-swipe span{display:block;text-align:center;font-size:22px}.s3.ready .s3-swipe{animation:copyIn .6s forwards}.s3.ready .s3-swipe span{animation:bob 1.5s infinite}
/* Swipe transition: road and carriage begin first. Castle is a small destination near the END of the road. */
.fairy-road{position:absolute;z-index:83;inset:0;width:100%;height:100%;opacity:0;pointer-events:none;filter:drop-shadow(0 0 5px #ffd36f) drop-shadow(0 0 13px #f4a52e)}.fairy-road path{fill:none;stroke:#fff0b3;stroke-width:3;stroke-linecap:round;stroke-dasharray:720;stroke-dashoffset:720}.far-castle{position:absolute;z-index:82;width:36%;left:78%;top:41%;opacity:0;transform:translate(-50%,-50%) scale(.7);transform-origin:50% 100%;object-fit:contain;will-change:opacity,transform}
.s3.leaving .s3-copy,.s3.leaving .s3-swipe,.s3.leaving .plane3{animation:fadeAway .35s forwards}.s3.leaving .flight-route{opacity:.52;transition:opacity .45s ease}.s3.leaving .flight-route path{stroke:#f7d890;stroke-width:1.55}.s3.leaving .fairy-road{opacity:1}.s3.leaving .fairy-road path{animation:roadDraw 3.3s cubic-bezier(.3,.05,.2,1) forwards}.s3.leaving .carriage-shell{z-index:92;animation:carriageJourney 3.3s cubic-bezier(.28,.04,.2,1) forwards}.s3.leaving .carriage3{opacity:1;animation:none;transform:translate(-50%,0) scale(1)}.s3.leaving .lamp-glow{opacity:.95;animation:lampPulse 1s infinite}.s3.leaving .far-castle{animation:castleFarIn .7s 1.9s forwards,castleGlow 1s 2.5s ease-in-out infinite}
.s3-goldout{position:absolute;z-index:110;inset:0;opacity:0;pointer-events:none;background:radial-gradient(circle at 78% 43%,#fffbe7 0,#ffd36e 22%,#f2a62fbb 45%,transparent 72%)}.s3.leaving .s3-goldout{animation:goldFinish 3.55s forwards}
@keyframes s3Cam{from{transform:scale(1.055) translateY(1%)}to{transform:scale(1.01) translateY(-1%)}}@keyframes cloudA{to{opacity:.43;transform:translateX(12%)}}@keyframes cloudB{to{opacity:.21;transform:translateX(-10%) scale(.52)}}@keyframes cloudAfloat{50%{transform:translateX(18%) translateY(-6px)}}@keyframes cloudBfloat{50%{transform:translateX(-16%) translateY(7px) scale(.54)}}@keyframes lmIn{0%{opacity:0;transform:translateY(16px) scale(.74)}100%{opacity:1;transform:none}}@keyframes lmLive{50%{transform:translateY(-2px) scale(1.008)}}@keyframes japanIn{to{opacity:1;transform:none}}@keyframes japanLive{50%{transform:translate(-2px,-3px) scale(1.008)}}@keyframes routeDraw{to{stroke-dashoffset:0}}@keyframes planeGo{0%{opacity:0;left:19%;top:43%;transform:rotate(14deg) scale(.75)}8%{opacity:1}30%{left:36%;top:39%;transform:rotate(20deg) scale(.82)}52%{left:47%;top:45%;transform:rotate(4deg) scale(.84)}75%{left:63%;top:42%;transform:rotate(18deg) scale(.76)}92%{opacity:1;left:75%;top:50%;transform:rotate(28deg) scale(.65)}100%{opacity:0;left:78%;top:52%;transform:rotate(30deg) scale(.58)}}@keyframes lampIn{to{opacity:1}}@keyframes lampPulse{50%{opacity:.58;filter:blur(4px)}}@keyframes carriageEnter{to{opacity:1;transform:translate(-50%,0) scale(1)}}@keyframes carriageRest{50%{transform:translate(-50%,-3px) rotate(-.4deg) scale(1.008)}}@keyframes bfL{0%,100%{opacity:.12;transform:translate(0,0) scale(.65)}35%{opacity:.7}55%{transform:translate(16px,-20px) scale(.75)}}@keyframes bfR{0%,100%{opacity:.1;transform:scaleX(-1) translate(0,0) scale(.62)}45%{opacity:.65;transform:scaleX(-1) translate(13px,-18px) scale(.72)}}@keyframes fadeAway{to{opacity:0}}@keyframes roadDraw{to{stroke-dashoffset:0}}@keyframes castleFarIn{0%{opacity:0;transform:translate(-50%,-50%) scale(.55)}100%{opacity:.9;transform:translate(-50%,-50%) scale(1)}}@keyframes castleGlow{50%{filter:drop-shadow(0 0 10px #ffd36f99)}}
@keyframes carriageJourney{0%{left:43%;top:82%;width:29%;transform:translate(-50%,-50%) rotate(0)}18%{left:49%;top:73%;width:26%;transform:translate(-50%,-50%) rotate(-2deg)}38%{left:57%;top:66%;width:22%;transform:translate(-50%,-50%) rotate(-1deg)}58%{left:65%;top:59%;width:18%;transform:translate(-50%,-50%) rotate(1deg)}76%{left:71%;top:52%;width:14%;transform:translate(-50%,-50%) rotate(0)}90%{left:75%;top:47%;width:10%;transform:translate(-50%,-50%) rotate(0)}100%{left:78%;top:43%;width:7%;transform:translate(-50%,-50%) rotate(0);opacity:.78}}
@keyframes goldFinish{0%,91%{opacity:0}100%{opacity:1}}

/* === SCREEN 4 ONLY. Screens 1–3 above are frozen. === */
.s4{background:#07162e}.s4-camera{position:absolute;inset:-2%;z-index:0;transform:scale(1.045);pointer-events:none}.s4-camera img{width:100%;height:100%;object-fit:cover}.s4.playing .s4-camera{animation:s4Cam 10s ease-out forwards}.s4-vignette{position:absolute;inset:0;z-index:2;background:linear-gradient(#06142e18 0%,transparent 35%,#07142b24 67%,#04102278 100%);pointer-events:none}
.s4-arrival{position:absolute;z-index:24;left:12%;bottom:12%;width:53%;height:35%;pointer-events:none;transform-origin:50% 100%;opacity:0;transform:translateX(-38%) scale(.82)}.s4-arrival img{position:absolute;left:0;bottom:0;width:100%;height:100%;object-fit:contain;object-position:left bottom;filter:drop-shadow(0 12px 18px #0009)}.s4-carriage-open{display:none!important}.s4.playing .s4-arrival{animation:s4CarriageArrive 1.65s .15s cubic-bezier(.25,.75,.25,1) forwards,s4CarriageRest 2.4s 1.9s ease-in-out infinite}.s4.playing .s4-carriage-closed{opacity:1}
.s4-exit-couple{position:absolute;z-index:34;left:49%;bottom:8%;width:64%;max-height:58%;object-fit:contain;object-position:center bottom;opacity:0;transform:translate(-50%,18px) scale(.92);filter:drop-shadow(0 14px 22px #0009);pointer-events:none}.s4.playing .s4-exit-couple{animation:s4ExitIn .72s 2.65s forwards,s4ExitOut .55s 4.65s forwards}
.s4-back-couple{position:absolute;z-index:32;left:50%;bottom:8%;width:54%;max-height:53%;object-fit:contain;object-position:center bottom;opacity:0;transform:translate(-50%,20px) scale(1.08);filter:drop-shadow(0 14px 22px #0009);pointer-events:none}.s4.playing .s4-back-couple{animation:s4WalkIn .8s 4.75s forwards,s4WalkAway 3.5s 5.45s ease-out forwards}
.s4-copy{position:absolute;z-index:55;left:6%;right:6%;top:6%;text-align:center;text-shadow:0 3px 12px #061127,0 0 22px #061127}.s4-copy>*{opacity:0;transform:translateY(9px)}.s4-line{font-size:clamp(23px,6vw,30px);font-style:italic;line-height:1.12;color:#fff4df}.s4-together{margin-top:2px;font-family:"Marck Script",cursive;font-size:clamp(48px,13vw,64px);line-height:1;color:#f6d58c}.s4.playing .s4-line{animation:copyIn .7s 6.45s forwards}.s4.playing .s4-together{animation:copyIn .85s 7.05s forwards}
.s4-particles{position:absolute;z-index:45;inset:0;pointer-events:none}.s4-particles i{position:absolute;width:3px;height:3px;border-radius:50%;background:#fff1b7;box-shadow:0 0 9px #ffc95c;opacity:0}.s4.playing .s4-particles i{animation:s4Dust var(--dur) var(--delay) ease-in-out infinite}.s4-swipe{position:absolute;z-index:70;left:50%;bottom:max(8px,env(safe-area-inset-bottom));transform:translateX(-50%);font-size:9px;letter-spacing:.18em;color:#f5deb2;white-space:nowrap;opacity:0;text-shadow:0 2px 8px #000}.s4-swipe span{display:block;text-align:center;font-size:22px}.s4.ready .s4-swipe{animation:copyIn .6s forwards}.s4.ready .s4-swipe span{animation:bob 1.5s infinite}
@keyframes s4Cam{from{transform:scale(1.045) translateY(.8%)}to{transform:scale(1.015) translateY(-.5%)}}@keyframes s4CarriageArrive{0%{opacity:0;transform:translateX(-42%) scale(.8)}12%{opacity:1}100%{opacity:1;transform:translateX(0) scale(1)}}@keyframes s4CarriageRest{50%{transform:translateY(-2px) rotate(-.25deg)}}@keyframes s4ClosedOut{to{opacity:0}}@keyframes s4OpenIn{from{opacity:0}to{opacity:1}}@keyframes s4ExitIn{to{opacity:1;transform:translate(-50%,0) scale(1)}}@keyframes s4ExitOut{to{opacity:0;transform:translate(-50%,-6px) scale(.98)}}@keyframes s4WalkIn{to{opacity:1;transform:translate(-50%,0) scale(1)}}@keyframes s4WalkAway{0%{opacity:1;bottom:8%;transform:translate(-50%,0) scale(1)}100%{opacity:1;bottom:21%;transform:translate(-50%,0) scale(.74)}}@keyframes s4Dust{0%,100%{opacity:0;transform:translate(0,8px) scale(.6)}30%{opacity:.75}65%{opacity:.4;transform:translate(var(--drift),-24px) scale(1)}}

/* v3: cinematic scene handoff. The next scene is mounted only while this veil is fully opaque. */
.scene-veil{position:absolute;inset:0;z-index:999;pointer-events:none;opacity:0;visibility:hidden;background:radial-gradient(circle at 50% 48%,#fffbe8 0%,#f7d98b 24%,#dca84c 54%,#785526 100%);transition:opacity .72s cubic-bezier(.22,.61,.36,1);will-change:opacity}
.scene-veil.covering{visibility:visible;opacity:1}
.scene-veil.revealing{visibility:visible;opacity:0;transition-duration:.95s}
/* Once the couple has left the carriage, remove it completely from the final composition. */
.s4.playing .s4-arrival{animation:s4CarriageArrive 1.65s .15s cubic-bezier(.25,.75,.25,1) forwards,s4CarriageRest 2.4s 1.9s ease-in-out infinite,s4CarriageGone .55s 4.55s forwards}
@keyframes s4CarriageGone{to{opacity:0;visibility:hidden;transform:translateX(-6%) scale(.96)}}

/* === SCREEN 5 — PROPOSAL. Screens 1–4 remain visually frozen. === */
.s5{background:#07162e}.s5-camera{position:absolute;inset:-2%;z-index:0;transform:scale(1.055);pointer-events:none}.s5-camera img{width:100%;height:100%;object-fit:cover;object-position:center center}.s5.playing .s5-camera{animation:s5Cam 13s ease-out forwards}.s5-vignette{position:absolute;inset:0;z-index:2;background:linear-gradient(#04112635 0%,transparent 32%,transparent 68%,#04102072 100%);pointer-events:none}
.s5-copy{position:absolute;z-index:58;left:6%;right:6%;top:5.5%;text-align:center;text-shadow:0 3px 14px #061127,0 0 22px #061127}.s5-copy>*{opacity:0;transform:translateY(10px)}.s5-magic{font-family:"Marck Script",cursive;font-size:clamp(35px,9.2vw,46px);line-height:1.02;color:#f7d891}.s5-question{margin-top:12px;font-size:clamp(22px,5.8vw,29px);line-height:1.08;color:#fff4df;font-style:italic}.s5.playing .s5-magic{animation:copyIn .85s 1.25s forwards}.s5.playing .s5-question{animation:copyIn .75s 2.65s forwards}
.s5-proposal{position:absolute;z-index:30;left:50%;bottom:4.5%;width:92%;max-height:68%;object-fit:contain;object-position:center bottom;opacity:0;transform:translate(-50%,24px) scale(.94);filter:drop-shadow(0 16px 24px #0009);pointer-events:none}.s5.playing .s5-proposal{animation:s5ProposalIn 1s 3.55s forwards,s5ProposalHold 2.4s 4.65s ease-in-out infinite,s5ProposalOut .65s 7.15s forwards}
.s5-ring-glow{position:absolute;z-index:44;left:45%;top:59%;width:9%;aspect-ratio:1;border-radius:50%;opacity:0;transform:translate(-50%,-50%) scale(.3);background:radial-gradient(circle,#fff 0 7%,#fff0b8 13%,#ffd36c99 30%,transparent 68%);filter:blur(.2px);pointer-events:none}.s5.playing .s5-ring-glow{animation:s5Ring 1.4s 5.7s ease-in-out forwards}
.s5-yes-couple{position:absolute;z-index:35;left:50%;bottom:0;width:94%;max-height:72%;object-fit:contain;object-position:center bottom;opacity:0;transform:translate(-50%,18px) scale(.96);filter:drop-shadow(0 16px 24px #0009);pointer-events:none}.s5.playing .s5-yes-couple{animation:s5YesIn .9s 7.55s forwards,s5YesLive 3.2s 8.6s ease-in-out infinite}
.s5-yes{position:absolute;z-index:70;left:50%;top:8%;transform:translate(-50%,10px);opacity:0;font-family:"Marck Script",cursive;font-size:clamp(66px,18vw,88px);line-height:.88;color:#f8d990;text-shadow:0 3px 14px #061127,0 0 26px #d89d3c66;white-space:nowrap}.s5-yes span{display:block;text-align:center;font-family:Georgia,serif;font-size:.46em;line-height:1;margin-top:5px}.s5.playing .s5-yes{animation:s5YesText .9s 8.35s forwards}
.s5-particles{position:absolute;z-index:46;inset:0;pointer-events:none}.s5-particles i{position:absolute;width:3px;height:3px;border-radius:50%;background:#fff2b8;box-shadow:0 0 10px #ffc85a;opacity:0}.s5.playing .s5-particles i{animation:s5Dust var(--dur) var(--delay) ease-in-out infinite}.s5-swipe{position:absolute;z-index:80;left:50%;bottom:max(8px,env(safe-area-inset-bottom));transform:translateX(-50%);font-size:9px;letter-spacing:.18em;color:#f5deb2;white-space:nowrap;opacity:0;text-shadow:0 2px 8px #000}.s5-swipe span{display:block;text-align:center;font-size:22px}.s5.ready .s5-swipe{animation:copyIn .6s forwards}.s5.ready .s5-swipe span{animation:bob 1.5s infinite}
/* Exit of screen 4 completes before the veil mounts screen 5. */
.s4.leaving .s4-copy,.s4.leaving .s4-swipe{animation:s5PreFade .65s forwards}.s4.leaving .s4-back-couple{animation:s4ToGarden 1.45s cubic-bezier(.22,.61,.36,1) forwards}.s4.leaving .s4-camera{animation:s4ExitPush 1.55s ease-in forwards}
@keyframes s5Cam{from{transform:scale(1.055) translateY(.6%)}to{transform:scale(1.015) translateY(-.6%)}}@keyframes s5ProposalIn{to{opacity:1;transform:translate(-50%,0) scale(1)}}@keyframes s5ProposalHold{50%{transform:translate(-50%,-2px) scale(1.005)}}@keyframes s5ProposalOut{to{opacity:0;transform:translate(-50%,-8px) scale(.985);filter:blur(3px) drop-shadow(0 16px 24px #0009)}}@keyframes s5Ring{0%{opacity:0;transform:translate(-50%,-50%) scale(.3)}35%{opacity:1;transform:translate(-50%,-50%) scale(1.7)}70%{opacity:.8;transform:translate(-50%,-50%) scale(.9)}100%{opacity:0;transform:translate(-50%,-50%) scale(2.5)}}@keyframes s5YesIn{to{opacity:1;transform:translate(-50%,0) scale(1)}}@keyframes s5YesLive{50%{transform:translate(-50%,-3px) scale(1.008)}}@keyframes s5YesText{to{opacity:1;transform:translate(-50%,0)}}@keyframes s5Dust{0%,100%{opacity:0;transform:translate(0,8px) scale(.55)}30%{opacity:.8}65%{opacity:.35;transform:translate(var(--drift),-28px) scale(1)}}@keyframes s5PreFade{to{opacity:0}}@keyframes s4ToGarden{0%{opacity:1}100%{opacity:.35;bottom:27%;transform:translate(-50%,-5px) scale(.62);filter:blur(1px) drop-shadow(0 14px 22px #0009)}}@keyframes s4ExitPush{to{transform:scale(1.085) translateY(-1.5%)}}

/* v2 polish: screen 5 copy phases never overlap. */
.s5.playing .s5-copy{animation:s5CopyPhaseOut .72s 6.55s ease forwards}
@keyframes s5CopyPhaseOut{to{opacity:0;transform:translateY(-8px);filter:blur(2px);visibility:hidden}}
.s5.playing .s5-proposal{animation:s5ProposalIn 1s 3.55s forwards,s5ProposalHold 2.4s 4.65s ease-in-out infinite,s5ProposalOut .72s 7.18s forwards}
.s5.playing .s5-yes-couple{animation:s5YesIn .95s 7.95s forwards,s5YesLive 3.2s 9s ease-in-out infinite}
.s5.playing .s5-yes{animation:s5YesText .9s 8.8s forwards}

/* v2 polish: 4 -> 5 is a camera lift, not a second walk cycle. */
.s4.leaving .s4-back-couple{animation:s4CoupleLeaveFrame 1.25s cubic-bezier(.4,0,.2,1) forwards}
.s4.leaving .s4-camera{animation:s4LiftToSky 1.9s cubic-bezier(.22,.61,.36,1) forwards}
.s4.leaving .s4-particles{animation:s4MagicGather 1.75s ease-in forwards}
@keyframes s4CoupleLeaveFrame{0%{opacity:1;transform:translate(-50%,0) scale(.74)}55%{opacity:.72}100%{opacity:0;transform:translate(-50%,18px) scale(.72);filter:blur(2px) drop-shadow(0 14px 22px #0009)}}
@keyframes s4LiftToSky{0%{transform:scale(1.015) translateY(-.5%)}100%{transform:scale(1.08) translateY(10%)}}
@keyframes s4MagicGather{0%{opacity:1;filter:none}65%{opacity:1;filter:brightness(1.45)}100%{opacity:.35;filter:brightness(2.2) blur(1px)}}

/* === SCREEN 6 — HEROES + INVITATION. Screens 1–5 frozen. === */
.s6{background:#170d08}.s6-camera{position:absolute;inset:-2%;z-index:0;transform:scale(1.055);pointer-events:none}.s6-camera img{width:100%;height:100%;object-fit:cover;object-position:center center}.s6.playing .s6-camera{animation:s6Cam 14s ease-out forwards}.s6-vignette{position:absolute;inset:0;z-index:2;background:linear-gradient(#13090538 0%,transparent 27%,transparent 66%,#1209057a 100%);pointer-events:none}.s6-text-shade{position:absolute;z-index:8;left:5%;right:5%;top:3%;height:37%;opacity:0;border-radius:45%;background:radial-gradient(ellipse at 50% 38%,#140b08b8 0%,#140b0878 42%,transparent 76%);filter:blur(8px);pointer-events:none}.s6.playing .s6-text-shade{animation:s6ShadeIn .8s 4.6s forwards}
.s6-couple{position:absolute;z-index:25;left:50%;bottom:-1%;width:77%;max-height:62%;object-fit:contain;object-position:center bottom;opacity:0;transform:translate(-50%,24px) scale(.94);filter:drop-shadow(0 18px 28px #000a);pointer-events:none}.s6.playing .s6-couple{animation:s6CoupleIn 1.2s 2.15s forwards,s6CoupleLive 4s 3.6s ease-in-out infinite}
.s6-heroes,.s6-invite{position:absolute;z-index:55;left:6%;right:6%;top:5.2%;text-align:center;text-shadow:0 3px 14px #160b07,0 0 24px #160b07}.s6-heroes{opacity:0;transform:translateY(10px)}.s6-hero-kicker{font-size:clamp(22px,5.8vw,29px);font-style:italic;color:#fff3df;line-height:1.05}.s6-names,.s6-invite-names{font-family:"Marck Script",cursive;color:#f3d08a;font-size:clamp(48px,12.8vw,64px);line-height:1;margin-top:7px}.s6.playing .s6-heroes{animation:s6HeroesIn .85s 4.35s forwards,s6HeroesOut .7s 6.55s forwards}
.s6-invite{opacity:0;transform:translateY(10px)}.s6-kingdom{font-size:clamp(20px,5.2vw,26px);color:#fff0d8}.s6-invite-names{margin-top:0}.s6-honour{font-size:clamp(18px,4.7vw,23px);line-height:1.08;color:#fff5e7;margin-top:7px}.s6-rule{color:#e9c16f;font-size:17px;margin:7px 0 3px}.s6-date{font-size:clamp(25px,6.5vw,32px);color:#f7deb0}.s6.playing .s6-invite{animation:s6InviteIn .9s 7.15s forwards}
.s6-particles{position:absolute;z-index:42;inset:0;pointer-events:none}.s6-particles i{position:absolute;width:3px;height:3px;border-radius:50%;background:#fff1b5;box-shadow:0 0 10px #ffc85a;opacity:0}.s6.playing .s6-particles i{animation:s6Dust var(--dur) var(--delay) ease-in-out infinite}.s6-swipe{position:absolute;z-index:75;left:50%;bottom:max(8px,env(safe-area-inset-bottom));transform:translateX(-50%);font-size:9px;letter-spacing:.18em;color:#f5deb2;white-space:nowrap;opacity:0;text-shadow:0 2px 8px #000}.s6-swipe span{display:block;text-align:center;font-size:22px}.s6.ready .s6-swipe{animation:copyIn .6s forwards}.s6.ready .s6-swipe span{animation:bob 1.5s infinite}
/* 5 -> 6: the ring becomes the transition source; scene 6 is mounted only under full gold cover. */
.s5.leaving .s5-yes,.s5.leaving .s5-swipe{animation:s6PreFade .55s forwards}.s5.leaving .s5-camera{animation:s5ExitBlur 1.95s ease-in forwards}.s5.leaving .s5-yes-couple{animation:s5RingPush 1.95s cubic-bezier(.22,.61,.36,1) forwards}.s5.leaving:after{content:"";position:absolute;z-index:130;left:42%;top:55%;width:16%;aspect-ratio:1;border-radius:50%;opacity:0;transform:scale(.2);background:radial-gradient(circle,#fff 0 6%,#fff6d7 14%,#ffd56f 34%,#e5a93b9c 54%,transparent 73%);box-shadow:0 0 45px #ffd36d,0 0 100px #e7a53f99;animation:s5RingTransition 2.05s ease-in forwards;pointer-events:none}
@keyframes s6Cam{from{transform:scale(1.055) translateY(.5%)}to{transform:scale(1.018) translateY(-.5%)}}@keyframes s6ShadeIn{to{opacity:1}}@keyframes s6CoupleIn{to{opacity:1;transform:translate(-50%,0) scale(1)}}@keyframes s6CoupleLive{50%{transform:translate(-50%,-3px) scale(1.006)}}@keyframes s6HeroesIn{to{opacity:1;transform:none}}@keyframes s6HeroesOut{to{opacity:0;transform:translateY(-8px);filter:blur(2px);visibility:hidden}}@keyframes s6InviteIn{to{opacity:1;transform:none}}@keyframes s6Dust{0%,100%{opacity:0;transform:translate(0,8px) scale(.55)}30%{opacity:.78}65%{opacity:.32;transform:translate(var(--drift),-27px) scale(1)}}@keyframes s6PreFade{to{opacity:0}}@keyframes s5ExitBlur{to{transform:scale(1.08);filter:blur(3px);opacity:.6}}@keyframes s5RingPush{0%{opacity:1;transform:translate(-50%,0) scale(1)}100%{opacity:.65;transform:translate(-50%,3px) scale(1.08);filter:blur(2px) drop-shadow(0 16px 24px #0009)}}@keyframes s5RingTransition{0%{opacity:0;transform:scale(.2)}18%{opacity:1}58%{opacity:1;transform:scale(2.2)}100%{opacity:1;transform:scale(15)}}

/* === SCREEN 7 — VENUE. Screens 1–6 frozen. === */
.s7{background:#120b08;perspective:1100px;overflow:hidden}.s7-camera{position:absolute;inset:-3%;z-index:0;transform:scale(1.08);pointer-events:none}.s7-camera img{width:100%;height:100%;object-fit:cover;object-position:center center}.s7.playing .s7-camera{animation:s7WalkIn 5.5s 7.2s cubic-bezier(.2,.7,.2,1) forwards}.s7-vignette{position:absolute;inset:0;z-index:4;background:linear-gradient(#0b08052b,transparent 28%,transparent 65%,#1009068a);pointer-events:none}.s7-light{position:absolute;z-index:12;left:50%;top:44%;width:14%;height:58%;transform:translate(-50%,-50%) scaleX(.12);opacity:0;background:radial-gradient(ellipse,#fff7d7 0%,#ffd878b8 22%,#e8a9404d 48%,transparent 72%);filter:blur(9px);pointer-events:none}.s7.playing .s7-light{animation:s7Light 2.3s 6.35s ease-out forwards}
.s7-door-stage{position:absolute;z-index:25;inset:0;pointer-events:none;transform-style:preserve-3d}.s7-door{position:absolute;top:-1%;height:102%;width:54%;object-fit:cover;filter:drop-shadow(0 8px 22px #0009);backface-visibility:hidden}.s7-door-left{right:50%;object-position:right center;transform-origin:100% 50%;transform:translateX(0) rotateY(0deg) scaleX(1.08)}.s7-door-right{left:50%;object-position:left center;transform-origin:0 50%;transform:translateX(0) rotateY(0deg) scaleX(1.08)}.s7.playing .s7-door-left{animation:s7OpenLeft 2.15s 6.7s cubic-bezier(.45,.05,.18,1) forwards}.s7.playing .s7-door-right{animation:s7OpenRight 2.15s 6.7s cubic-bezier(.45,.05,.18,1) forwards}
.s7-opening-copy{position:absolute;z-index:45;left:8%;right:8%;top:34%;text-align:center;font-family:"Marck Script",cursive;font-size:clamp(38px,10vw,50px);line-height:1.06;color:#f5d898;text-shadow:0 3px 16px #160c08,0 0 24px #160c08;opacity:0;transform:translateY(7px)}.s7.playing .s7-opening-copy{animation:s7OpeningCopy 5.7s .45s ease forwards}
.s7-place{position:absolute;z-index:55;left:5%;right:5%;top:5.5%;padding:18px 10px 22px;text-align:center;opacity:0;transform:translateY(8px);text-shadow:0 3px 14px #160b07,0 0 24px #160b07}.s7-place:before{content:"";position:absolute;z-index:-1;inset:-8% -2%;border-radius:45%;background:radial-gradient(ellipse,#160c09ba 0%,#160c0978 48%,transparent 78%);filter:blur(7px)}.s7-kicker{font-size:clamp(15px,4vw,20px);letter-spacing:.18em;text-transform:uppercase;color:#fff2df}.s7-name{font-family:Georgia,"Times New Roman",serif;font-size:clamp(48px,12.5vw,64px);line-height:.9;letter-spacing:.035em;text-transform:uppercase;color:#f4d18c;margin-top:12px}.s7-rule{color:#e8bf6d;font-size:16px;margin:8px 0 5px}.s7-address{font-size:clamp(16px,4.1vw,20px);line-height:1.2;color:#fff5e7;margin-top:7px}.s7.playing .s7-place{animation:s7PlaceIn .48s 9.05s forwards}
.s7-particles{position:absolute;z-index:42;inset:0;pointer-events:none}.s7-particles i{position:absolute;width:3px;height:3px;border-radius:50%;background:#fff0b3;box-shadow:0 0 10px #ffc85a;opacity:0}.s7.playing .s7-particles i{animation:s7Dust var(--dur) var(--delay) ease-in-out infinite}.s7-swipe{position:absolute;z-index:70;left:50%;bottom:max(8px,env(safe-area-inset-bottom));transform:translateX(-50%);font-size:9px;letter-spacing:.18em;color:#f5deb2;white-space:nowrap;opacity:0;text-shadow:0 2px 8px #000}.s7-swipe span{display:block;text-align:center;font-size:22px}.s7.ready .s7-swipe{animation:copyIn .6s forwards}.s7.ready .s7-swipe span{animation:bob 1.5s infinite}
/* 6 -> 7: no replay/re-animation of the couple. The frame itself becomes a luminous portal. */
.s6.leaving .s6-heroes,.s6.leaving .s6-invite,.s6.leaving .s6-swipe{animation:s7PreFade .42s forwards}.s6.leaving:before{content:"";position:absolute;z-index:125;left:8%;right:8%;top:7%;bottom:5%;border:2px solid #f2cf82;border-radius:46% 46% 10% 10%;opacity:0;box-shadow:0 0 10px #ffe8a8,0 0 34px #e9b95e, inset 0 0 24px #f8d78355;pointer-events:none;animation:s7PortalFrame 1.35s .15s ease-in forwards}.s6.leaving:after{content:"";position:absolute;z-index:124;inset:0;opacity:0;background:radial-gradient(ellipse at 50% 48%,#fffbe9 0%,#f7d98c 22%,#dca84bba 48%,transparent 76%);pointer-events:none;animation:s7PortalGlow 1.45s .35s ease-in forwards}
@keyframes s7PreFade{to{opacity:0;filter:blur(1px)}}@keyframes s7PortalFrame{0%{opacity:0;transform:scale(.97)}25%{opacity:1}75%{opacity:1;box-shadow:0 0 25px #fff0b6,0 0 75px #e8b457, inset 0 0 55px #f8d78388}100%{opacity:.15;transform:scale(1.035);filter:brightness(1.8)}}@keyframes s7PortalGlow{0%{opacity:0}45%{opacity:.45}100%{opacity:1}}
@keyframes s7OpeningCopy{0%{opacity:0;transform:translateY(7px)}9%{opacity:1;transform:none}78%{opacity:1;transform:none}100%{opacity:0;transform:translateY(-4px)}}@keyframes s7Light{0%{opacity:0;transform:translate(-50%,-50%) scaleX(.08)}28%{opacity:.95}70%{opacity:.78;transform:translate(-50%,-50%) scaleX(2.8)}100%{opacity:0;transform:translate(-50%,-50%) scaleX(5.5)}}@keyframes s7OpenLeft{0%{transform:translateX(0) rotateY(0deg) scaleX(1.08)}100%{transform:translateX(-76%) rotateY(-54deg) scaleX(.94);opacity:.72}}@keyframes s7OpenRight{0%{transform:translateX(0) rotateY(0deg) scaleX(1.08)}100%{transform:translateX(76%) rotateY(54deg) scaleX(.94);opacity:.72}}@keyframes s7WalkIn{0%{transform:scale(1.08)}100%{transform:scale(1.22) translateY(1.2%)}}@keyframes s7PlaceIn{to{opacity:1;transform:none}}@keyframes s7Dust{0%,100%{opacity:0;transform:translate(0,8px) scale(.55)}30%{opacity:.76}65%{opacity:.3;transform:translate(var(--drift),-26px) scale(1)}}

/* === v5 BALANCED POLISH: stable v3 base + typography/readability only === */
/* Readability veils */
.s1-copy:before,.s2-copy:before,.s3-copy:before,.s6-heroes:before,.s6-invite:before,.s7-opening-copy:before{content:"";position:absolute;z-index:-1;inset:-18% -7%;border-radius:45%;background:radial-gradient(ellipse,#0611279e 0%,#0611275e 50%,transparent 80%);filter:blur(8px);pointer-events:none}
.s1-copy,.s2-copy,.s3-copy,.s6-heroes,.s6-invite,.s7-opening-copy{isolation:isolate}
.s1-copy{text-shadow:0 3px 12px #020817,0 0 24px #02081799}.s2-copy{text-shadow:0 3px 14px #020817,0 0 24px #020817aa}.s3-copy{text-shadow:0 3px 14px #061127,0 0 22px #061127aa}.s5-copy,.s5-yes{text-shadow:0 3px 14px #061127,0 0 24px #061127cc}.s6-heroes,.s6-invite{text-shadow:0 3px 14px #100704,0 0 26px #100704dd}
/* Typography */
.monogram{font-family:"Marck Script",cursive;font-style:normal;font-weight:400;font-size:clamp(76px,23vw,108px);line-height:.92;color:#f8d990;text-shadow:0 3px 14px #071229,0 0 20px #d9a84b55}.kicker{font-family:"Cormorant Garamond",Georgia,serif;font-weight:500}.s2 .story{font-family:"Cormorant Garamond",Georgia,serif;font-weight:400}.s2 .names{font-family:"Marck Script",cursive;font-style:normal;font-size:clamp(34px,9vw,44px);color:#f6d58c;text-shadow:0 3px 12px #020817,0 0 20px #020817}.s2 .sub{font-family:"Cormorant Garamond",Georgia,serif;font-weight:500}
.s6-honour,.s6-date{font-family:"Cormorant Garamond",Georgia,serif;font-weight:400;text-shadow:0 3px 12px #100704,0 0 22px #100704}.s6-honour{font-size:clamp(19px,5vw,24px)}.s6-date{font-size:clamp(26px,6.8vw,33px)}
.s7-name{font-family:"Marck Script",cursive;font-size:clamp(54px,14vw,70px);line-height:.92;letter-spacing:0;text-transform:none;color:#f5d38e;text-shadow:0 3px 14px #100704,0 0 22px #100704}.s7-kicker,.s7-address{font-family:"Cormorant Garamond",Georgia,serif;font-weight:500}.s7-address{text-shadow:0 3px 12px #100704,0 0 22px #100704}
/* Screen 5 yes position */
.s5-yes{top:17%}
/* Balanced image entrances: smooth, not abrupt. Preserve original narrative timing/state swaps. */
.s2.playing .couple{animation:coupleIn .85s 3s cubic-bezier(.22,.61,.36,1) forwards,coupleLive 5s 4.05s ease-in-out infinite}
.s3.playing .eiffel{animation:lmIn .7s 1.1s forwards,lmLive 4s 1.9s ease-in-out infinite}.s3.playing .colosseum{animation:lmIn .7s 1.5s forwards,lmLive 4.2s 2.3s ease-in-out infinite}.s3.playing .sagrada{animation:lmIn .7s 1.9s forwards,lmLive 4s 2.7s ease-in-out infinite}.s3.playing .eurocastle{animation:lmIn .7s 2.3s forwards,lmLive 4.4s 3.1s ease-in-out infinite}.s3.playing .japan{animation:japanIn .8s 6.1s forwards,japanLive 5s 7.05s ease-in-out infinite}
/* Screen 4: keep carriage removal and correct single walk state */
.s4.playing .s4-arrival{animation:s4CarriageArrive 1.15s .15s cubic-bezier(.25,.75,.25,1) forwards,s4CarriageRest 2.4s 1.45s ease-in-out infinite,s4CarriageGone .55s 4.55s forwards}.s4.playing .s4-exit-couple{animation:s4ExitIn .72s 2.65s forwards,s4ExitOut .55s 4.65s forwards}.s4.playing .s4-back-couple{animation:s4WalkIn .8s 4.75s forwards,s4WalkAway 3.5s 5.45s ease-out forwards}
/* Screen 5: restore approved proposal -> final ring portrait swap */
.s5.playing .s5-proposal{animation:s5ProposalIn .8s 3.45s cubic-bezier(.22,.61,.36,1) forwards,s5ProposalHold 2.4s 4.4s ease-in-out infinite,s5ProposalOut .72s 7.18s forwards}.s5.playing .s5-yes-couple{animation:s5YesIn .82s 7.95s cubic-bezier(.22,.61,.36,1) forwards,s5YesLive 3.2s 8.9s ease-in-out infinite}.s5.playing .s5-yes{animation:s5YesText .52s 8.78s forwards}
/* Text should arrive crisply, not crawl. */
.s2.playing .once{animation:copyIn .55s 5s forwards}.s2.playing .story{animation:copyIn .48s 5.9s forwards}.s2.playing .names{animation:copyIn .48s 6.15s forwards}.s2.playing .sub{animation:copyIn .48s 6.4s forwards}.s4.playing .s4-line{animation:copyIn .5s 6.45s forwards}.s4.playing .s4-together{animation:copyIn .55s 6.95s forwards}.s5.playing .s5-magic{animation:copyIn .5s 1.25s forwards}.s5.playing .s5-question{animation:copyIn .48s 2.55s forwards}.s6.playing .s6-heroes{animation:s6HeroesIn .55s 4.35s forwards,s6HeroesOut .6s 6.55s forwards}.s6.playing .s6-invite{animation:s6InviteIn .55s 7.15s forwards}
/* Screen 7: concise intro, graceful doors, readable venue block */
.s7.playing .s7-opening-copy{animation:s7OpeningCopyBalanced 3.0s .45s ease forwards}.s7.playing .s7-light{animation:s7Light 1.8s 3.35s ease-out forwards}.s7.playing .s7-door-left{animation:s7OpenLeft 1.75s 3.65s cubic-bezier(.45,.05,.18,1) forwards}.s7.playing .s7-door-right{animation:s7OpenRight 1.75s 3.65s cubic-bezier(.45,.05,.18,1) forwards}.s7.playing .s7-camera{animation:s7WalkIn 4.4s 4.15s cubic-bezier(.2,.7,.2,1) forwards}.s7.playing .s7-place{animation:s7PlaceIn .55s 5.75s forwards}.s7-place:before{inset:-12% -4%;background:radial-gradient(ellipse,#100807d1 0%,#10080791 48%,transparent 80%);filter:blur(9px)}
@keyframes s7OpeningCopyBalanced{0%{opacity:0;transform:translateY(7px)}14%{opacity:1;transform:none}78%{opacity:1;transform:none}100%{opacity:0;transform:translateY(-4px)}}

/* === SCREEN 8 — COUNTDOWN + FINALE (isolated) === */
.s8{background:#061329;overflow:hidden}.s8-camera{position:absolute;inset:0;transform:scale(1.035);opacity:0;transition:opacity .8s ease,transform 11s ease}.s8-camera img{width:100%;height:100%;object-fit:cover;display:block}.s8.playing .s8-camera{opacity:1;transform:scale(1)}
.s8-vignette{position:absolute;inset:0;background:radial-gradient(circle at 50% 42%,transparent 28%,rgba(1,8,23,.18) 72%,rgba(1,7,20,.42) 100%);pointer-events:none}.s8-text-shade{position:absolute;left:7%;right:7%;top:7%;height:45%;background:radial-gradient(ellipse at center,rgba(3,10,25,.58),rgba(3,10,25,.22) 55%,transparent 76%);filter:blur(10px);opacity:0;transition:opacity .55s ease}.s8.playing .s8-text-shade{opacity:1;transition-delay:.45s}
.s8-fireworks{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;opacity:0;transition:opacity .7s ease}.s8.final-stage .s8-fireworks{opacity:1}.s8-stars{position:absolute;inset:0;pointer-events:none}.s8-stars i{position:absolute;width:2px;height:2px;border-radius:50%;background:#ffe6a8;box-shadow:0 0 7px #ffd477;animation:s8twinkle 2.6s ease-in-out infinite alternate}@keyframes s8twinkle{to{opacity:.2;transform:scale(.55)}}
.s8-countdown-wrap{position:absolute;z-index:5;left:8%;right:8%;top:10%;text-align:center;color:#fff1d3;text-shadow:0 2px 12px rgba(0,0,0,.85),0 0 20px rgba(0,0,0,.45);opacity:0;transform:translateY(10px);transition:opacity .5s ease,transform .65s cubic-bezier(.2,.8,.2,1)}.s8.playing .s8-countdown-wrap{opacity:1;transform:none;transition-delay:.75s}.s8-kicker{font-family:'Cormorant Garamond',Georgia,serif;font-size:clamp(22px,6.2vw,30px);font-style:italic;line-height:1.12;margin-bottom:22px}.s8-countdown{display:flex;justify-content:center;gap:22px}.s8-countdown div{min-width:68px}.s8-countdown strong{display:block;font-family:'Cormorant Garamond',Georgia,serif;font-weight:500;font-size:clamp(42px,12vw,58px);line-height:.9;color:#ffda91}.s8-countdown span{display:block;margin-top:9px;font-family:Georgia,serif;font-size:11px;letter-spacing:.12em;text-transform:uppercase}.s8-message{margin-top:28px;font-family:'Cormorant Garamond',Georgia,serif;font-size:clamp(18px,5vw,23px);line-height:1.25;opacity:0;transform:translateY(8px);transition:opacity .5s ease,transform .55s ease}.s8.message-stage .s8-message{opacity:1;transform:none}.s8-message span{color:#ffd77d}
.s8-couple{position:absolute;z-index:4;left:50%;bottom:-2%;width:72%;max-height:58%;object-fit:contain;object-position:bottom center;transform:translate(-50%,18px) scale(.97);opacity:0;transition:opacity .85s ease,transform .95s cubic-bezier(.2,.75,.2,1);filter:drop-shadow(0 8px 16px rgba(0,0,0,.38))}.s8.couple-stage .s8-couple{opacity:1;transform:translate(-50%,0) scale(1)}
.s8.final-stage .s8-countdown-wrap{opacity:0;transform:translateY(-12px);transition-delay:0s}.s8-final{position:absolute;z-index:7;left:7%;right:7%;top:10%;text-align:center;color:#ffe1a0;opacity:0;transform:translateY(9px);transition:opacity .65s ease,transform .7s ease;text-shadow:0 2px 14px rgba(0,0,0,.9),0 0 22px rgba(0,0,0,.45)}.s8.final-stage .s8-final{opacity:1;transform:none;transition-delay:.25s}.s8-ever{font-family:'Marck Script','Brush Script MT',cursive;font-size:clamp(34px,10vw,49px);line-height:1.05}.s8-heart{font-size:29px;margin-top:8px}.s8-thanks{margin-top:13px;font-family:'Cormorant Garamond',Georgia,serif;font-size:16px;color:#fff0d0}.s8-date{margin-top:10px;font-family:Georgia,serif;font-size:13px;letter-spacing:.08em;color:#eac989}
.s7.leaving-to-final .s7-place,.s7.leaving-to-final .s7-swipe{opacity:0!important;transition:opacity .45s ease!important}.s7.leaving-to-final .s7-camera{transform:scale(1.07) translateY(5%);transition:transform 2.2s cubic-bezier(.2,.65,.25,1)!important}.s7.leaving-to-final:after{content:'';position:absolute;z-index:90;inset:0;background:linear-gradient(to bottom,rgba(3,12,32,0) 0%,rgba(3,12,32,.2) 28%,#07162e 75%);opacity:0;animation:s7to8veil 2.2s ease forwards;pointer-events:none}@keyframes s7to8veil{45%{opacity:.25}100%{opacity:1}}

/* v17 finale polish — only requested local timing/scene 8 changes */
/* Scene 6: bring the heroes in sooner and keep the entrance soft, not sluggish. */
.s6.playing .s6-couple{animation:s6CoupleIn .78s 1.35s cubic-bezier(.2,.78,.2,1) forwards,s6CoupleLive 4s 2.35s ease-in-out infinite}
.s6.playing .s6-heroes{animation:s6HeroesIn .55s 2.35s forwards,s6HeroesOut .6s 4.55s forwards}
.s6.playing .s6-text-shade{animation:s6ShadeIn .65s 2.15s forwards}
.s6.playing .s6-invite{animation:s6InviteIn .55s 5.15s forwards}

/* Scene 8: cinematic entrance + subtle living motion and refined typography. */
.s8-couple{bottom:-2%;width:72%;max-height:58%;opacity:0;transform:translate(-50%,64px) scale(.955);transition:none;filter:drop-shadow(0 10px 20px rgba(0,0,0,.42));will-change:transform,opacity,filter}
.s8.couple-stage .s8-couple{animation:s8CoupleEntrance 1.35s cubic-bezier(.16,.78,.2,1) forwards,s8CoupleBreath 5.4s 1.4s ease-in-out infinite}
.s8.couple-stage.final-stage .s8-couple{animation:s8CoupleEntrance 1.35s cubic-bezier(.16,.78,.2,1) forwards,s8CoupleBreath 5.4s 1.4s ease-in-out infinite,s8FireworkGlow 4.8s 2.1s ease-in-out infinite}
@keyframes s8CoupleEntrance{0%{opacity:0;transform:translate(-50%,64px) scale(.955);filter:drop-shadow(0 10px 20px rgba(0,0,0,.3)) brightness(.92)}65%{opacity:1}100%{opacity:1;transform:translate(-50%,0) scale(1);filter:drop-shadow(0 10px 20px rgba(0,0,0,.42)) brightness(1)}}
@keyframes s8CoupleBreath{0%,100%{transform:translate(-50%,0) scale(1)}50%{transform:translate(-50%,-3px) scale(1.004)}}
@keyframes s8FireworkGlow{0%,72%,100%{filter:drop-shadow(0 10px 20px rgba(0,0,0,.42)) brightness(1)}78%{filter:drop-shadow(0 10px 24px rgba(255,206,118,.28)) brightness(1.08)}84%{filter:drop-shadow(0 10px 20px rgba(0,0,0,.42)) brightness(1)}}
.s8-final{top:8.5%;left:9%;right:9%}
.s8-ever{font-family:'Cormorant Garamond',Georgia,serif;font-style:italic;font-weight:500;font-size:clamp(36px,9.5vw,48px);line-height:1.02;letter-spacing:.01em;color:#f6d895;text-shadow:0 3px 14px rgba(0,0,0,.92),0 0 22px rgba(21,11,5,.75)}
.s8-thanks{font-family:'Cormorant Garamond',Georgia,serif;font-size:clamp(17px,4.5vw,21px);font-weight:400;line-height:1.18;color:#fff1d8}
.s8-date{font-family:'Cormorant Garamond',Georgia,serif;font-size:clamp(14px,3.7vw,17px);font-weight:500;letter-spacing:.14em;color:#e9c982}
.s8.final-stage .s8-final{transition-delay:.55s}

/* === v3 targeted polish: screens 3, 4 and 8 only === */
/* Screen 3: copy now arrives with the map, while travel animation continues. */
.s3.playing .world{animation:copyIn .50s .50s forwards!important}
.s3.playing .travel{animation:copyIn .48s 1.00s forwards!important}
.s3.playing .directions{animation:copyIn .48s 1.48s forwards!important}

/* Screen 3: keep the original journey order, but remove the dead wait before the carriage. */
.s3.playing .lamp-glow{animation:lampIn .50s 6.90s forwards,lampPulse 1.7s 7.55s ease-in-out infinite!important}
.s3.playing .carriage3{animation:carriageEnter .82s 7.20s forwards,carriageRest 2.4s 8.10s ease-in-out infinite!important}

/* Screen 4: one coherent arrival sequence — carriage, couple, carriage leaves, then one walk to the castle. */
.s4.playing .s4-arrival{animation:s4CarriageArrive 1.15s .15s cubic-bezier(.25,.75,.25,1) forwards,s4CarriageRest 1.35s 1.40s ease-in-out infinite,s4CarriageGone .50s 2.80s forwards!important}
.s4.playing .s4-exit-couple{animation:s4ExitIn .70s 1.62s forwards,s4ExitOut .50s 2.90s forwards!important}
.s4.playing .s4-back-couple{animation:s4WalkIn .70s 3.00s forwards,s4WalkAway 3.35s 3.58s ease-out forwards!important}
.s4.playing .s4-line{animation:copyIn .50s 4.55s forwards!important}
.s4.playing .s4-together{animation:copyIn .55s 5.05s forwards!important}

/* Screen 8: lighter editorial typography for the closing Russian copy. */
.s8-thanks{font-family:'Cormorant Garamond','Times New Roman',serif!important;font-size:clamp(16px,4.25vw,20px)!important;font-weight:400!important;font-style:italic;line-height:1.24!important;letter-spacing:.018em;color:#fff3df!important;text-shadow:0 2px 10px rgba(0,0,0,.88),0 0 20px rgba(0,0,0,.48)}
.s8-date{font-family:'Cormorant Garamond','Times New Roman',serif!important;font-size:clamp(13px,3.45vw,16px)!important;font-weight:500!important;letter-spacing:.17em!important;color:#edce8d!important;text-shadow:0 2px 9px rgba(0,0,0,.86),0 0 18px rgba(0,0,0,.42)}

/* === v5 scroll edition: screen 1 is the entrance; screens 2–8 are one scrollable story === */
html{height:auto;min-height:100%;background:#061329}
body{min-height:100%;height:auto;overflow:hidden;background:#061329}
body.story-open{overflow-x:hidden;overflow-y:auto;-webkit-overflow-scrolling:touch}
.app{width:min(100vw,430px);height:auto;min-height:100dvh;overflow:visible;touch-action:pan-y}
.s1{position:fixed;inset:0;margin:auto;width:min(100vw,430px);height:100dvh;z-index:500}
body.story-open .s1{display:none}
.scene:not(.s1){position:relative;inset:auto;width:100%;height:100dvh;min-height:100svh;opacity:0;visibility:hidden;pointer-events:none}
body.story-open .scene:not(.s1){opacity:1;visibility:visible;pointer-events:auto}
body.story-open .app{scroll-snap-type:y proximity}
body.story-open .scene:not(.s1){scroll-snap-align:start;scroll-snap-stop:normal}
/* Veil belongs only to the opening transition in scroll mode. */
.scene-veil{position:fixed!important;z-index:450!important}