:root{
  --paper:#fffdf9;--white:#fff;--cream:#fff8f2;--blush:#fff0f5;--blush-2:#ffe0eb;
  --pink:#ef2c78;--rani:#c7115b;--rose:#f9acbe;--wine:#59142c;--plum:#42122c;
  --gold:#daa133;--lightgold:#ffe5a0;--saffron:#ffaf51;--teal:#0e9c85;
  --ink:#4a2131;--muted:#86546b;--border:#efced0;
  --gold-foil:linear-gradient(130deg,#fff6d0,#e8ba57 28%,#af7019 50%,#f8dc8d 74%,#c28b2f);
  --shadow:0 18px 45px rgba(139,49,79,.12),0 3px 9px rgba(100,27,52,.06);
}
*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}
html{scroll-behavior:smooth;max-width:100%;overflow-x:clip}
html.lock,html.lock body{overflow:hidden;height:100%}
body{position:relative;min-height:100vh;max-width:100%;overflow-x:clip;
  background:radial-gradient(ellipse at 55% 0,#fff0f4 0,#fffdfa 43%,#fff9f3 100%);
  font:400 17px/1.65 'Outfit',system-ui,sans-serif;color:var(--ink);
  padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
body::before{content:"";position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.12;
 background-image:url("assets/sparkle-field-gold.svg");background-size:460px 460px}
body::after{content:"";position:fixed;inset:0;z-index:60;pointer-events:none;opacity:.15;
 background-image:radial-gradient(#c38c6e .6px,transparent .8px);background-size:15px 15px}
main,header,.mq{isolation:isolate}
h1,h2,h3{font-family:'Rozha One',Georgia,serif;line-height:1.13;font-weight:400}
.script{font-family:'Caveat',cursive;font-weight:700}
button,a{touch-action:manipulation}
button{font:inherit}
:focus-visible{outline:3px solid #007f6c;outline-offset:4px}
.skip-link{position:fixed;left:12px;top:-60px;padding:10px 16px;background:var(--wine);color:#fff;z-index:400;border-radius:12px}
.skip-link:focus{top:12px}
.noscript{position:fixed;bottom:0;left:0;right:0;background:var(--wine);color:#fff;padding:1rem;text-align:center;z-index:300}
.blob{position:fixed;z-index:-1;border-radius:50%;filter:blur(65px);pointer-events:none;opacity:.45;animation:drift 19s ease-in-out infinite alternate}
.b1{width:40vw;height:40vw;top:-12vw;left:-17vw;background:#ffc9de}.b2{width:40vw;height:40vw;right:-18vw;top:40vh;background:#ffe0a0;animation-delay:-9s}
.b3{width:35vw;height:35vw;bottom:-18vw;left:12vw;background:#ffd7de;animation-delay:-4s}
.b4{width:26vw;height:26vw;top:50vh;left:43vw;background:#fff2d5;animation-delay:-7s}
@keyframes drift{to{transform:translate(7vw,5vw) scale(1.18)}}
.petal-wash{position:fixed;inset:0;background:radial-gradient(circle at 17% 25%,rgba(255,208,226,.16),transparent 26%),radial-gradient(circle at 84% 75%,rgba(255,217,152,.2),transparent 29%);pointer-events:none}
#fx{position:fixed;inset:0;width:100%;height:100%;z-index:260;pointer-events:none}
#prog{position:fixed;left:0;top:0;height:5px;width:0;background:linear-gradient(90deg,#ef2c78,#ffe8a2,#ca8d29,#ee407d);box-shadow:0 0 12px #d58868;z-index:280}
.grad{background:linear-gradient(125deg,#751a3a 0%,#e62370 50%,#be6b22 95%);
 -webkit-background-clip:text;background-clip:text;color:transparent;display:inline-block}
.tag{display:inline-flex;align-items:center;justify-content:center;gap:.4em;padding:.38rem 1rem;
 border-radius:100px;border:1px solid #fff2d7;
 background:linear-gradient(120deg,#f94085,#c81761);box-shadow:0 3px 0 #d8a54e,0 7px 17px #f19ab37e;
 color:white;font-weight:700;font-size:.76rem;letter-spacing:.09em;line-height:1.5}
.cta{display:inline-flex;justify-content:center;align-items:center;gap:.6rem;position:relative;
 margin-top:1.4rem;max-width:100%;padding:.85rem 1.45rem;border:2px solid #ffe7a8;border-radius:100px;
 color:#fff;text-decoration:none;font:700 1rem/1.35 'Outfit',sans-serif;
 background:linear-gradient(120deg,#bf0e52,#f3307b 55%,#aa104c);box-shadow:0 6px 0 #b17b22,0 11px 24px #ce488e55;
 cursor:pointer;transition:transform .2s,box-shadow .2s}
.cta:hover{transform:translateY(-2px);box-shadow:0 8px 0 #b17b22,0 15px 28px #ce488e69}
.cta:active{transform:translateY(4px);box-shadow:0 1px 0 #b17b22}
.mq{position:relative;z-index:5;margin:.4rem 0;transform:rotate(-.8deg);
 background:linear-gradient(90deg,#ffe59a,#ffce65,#ffecb8,#f8b94d);color:#68233b;
 border-block:2px solid #d4a13e;box-shadow:0 4px 17px #c68d3455;white-space:nowrap;overflow:hidden;
 padding:.43rem 0;font:700 .93rem/1.7 'Outfit',sans-serif;letter-spacing:.06em}
.mq div{width:max-content;animation:marquee 26s linear infinite}
.mq.r{transform:rotate(.8deg);margin-top:-.15rem;background:linear-gradient(90deg,#f81b72,#f06fa1,#d10d5b,#ff6fa1);
 border-color:#ffd7a1;color:#fff;box-shadow:0 4px 18px #f2749c77}
.mq.r div{animation-direction:reverse}
@keyframes marquee{to{transform:translateX(-50%)}}
.hero{position:relative;width:100%;min-height:85svh;max-width:1200px;margin:0 auto;
 display:flex;flex-direction:column;justify-content:center;padding:3.5rem max(20px,4vw) 4.2rem;overflow:hidden}
.hero-layout{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:clamp(15px,3vw,50px);align-items:center;position:relative;z-index:2;width:100%;max-width:1080px;margin:0 auto}
.hero-kicker{z-index:2;position:relative;display:block;align-self:center;margin-bottom:1.7rem;
 letter-spacing:.19em;font-size:.78rem;text-transform:uppercase;font-weight:700;color:#b7637b}
.hero-deco{position:absolute;width:clamp(135px,24vw,270px);z-index:1;pointer-events:none;filter:drop-shadow(0 7px 13px #d98e9c44)}
.hdl{top:-1%;left:-2%}.hdr{top:-1%;right:-2%}
.hero-lan{position:absolute;width:clamp(75px,10vw,140px);z-index:1;pointer-events:none;animation:hang 4s ease-in-out infinite alternate}
.hl1{left:7%;top:5%;transform-origin:50% 0}.hl2{right:6%;top:10%;animation-delay:-2s}
@keyframes hang{to{transform:rotate(4deg)}}
.giant{position:absolute;top:0;left:50%;transform:translateX(-50%);white-space:nowrap;
 font-family:'Playfair Display',serif;font-size:clamp(5rem,19vw,18rem);font-weight:800;
 color:transparent;-webkit-text-stroke:1.5px #e5b68c55;z-index:0;pointer-events:none}
.stage3{position:relative;z-index:2;perspective:1200px;display:flex;justify-content:center;padding:1.1rem .7rem 1.2rem}
.tilt{position:relative;width:clamp(205px,28vw,320px);aspect-ratio:4/5;transform-style:preserve-3d;
 animation:sway 8s ease-in-out infinite;transition:transform .13s ease;will-change:transform}
@keyframes sway{0%,100%{transform:rotateY(-7deg) rotateX(2deg)}50%{transform:rotateY(7deg) rotateX(-2deg)}}
.tilt.live{animation:none}
.tilt .frame{position:absolute;inset:0;padding:8px;background:var(--gold-foil);
 border-radius:48% 48% 17px 17px / 27% 27% 17px 17px;
 box-shadow:0 0 0 3px #fff9e7,0 12px 0 #e9b9a4,0 22px 45px #81264a4a;overflow:hidden}
.tilt .frame::before{content:"";position:absolute;inset:4px;border:1.5px dashed #f9f3d5;border-radius:inherit;z-index:2;pointer-events:none}
.tilt img{width:100%;height:100%;object-fit:cover;object-position:50% 27%;display:block;
 border-radius:48% 48% 12px 12px / 27% 27% 12px 12px;background:#ffedf5}
.tilt .st{position:absolute;z-index:4;padding:.25rem .7rem;font:700 1.13rem 'Caveat',cursive;
 border:1px solid #fae7b2;border-radius:11px;color:#fff;background:linear-gradient(120deg,#ec2a71,#bc1355);
 box-shadow:0 3px 0 #ad7135,0 7px 13px #9e315c48;white-space:nowrap;transform:translateZ(45px) rotate(var(--r))}
.s1{top:9%;left:-13%;--r:-10deg}.tilt .s2{background:linear-gradient(120deg,#0cab97,#057f74);bottom:15%;right:-12%;--r:8deg}
.tilt .s3{background:linear-gradient(120deg,#ffe59a,#d5a036);color:#683327;bottom:-5%;left:10%;--r:-5deg}
.hero-copy{position:relative;z-index:3;min-width:0;text-align:left;padding:1.4rem .5rem}
.little-flourish{font-size:.8rem;letter-spacing:.14em;font-weight:700;color:#a56b68}
.hero-copy h1{font:italic 700 clamp(3.4rem,6.3vw,6.3rem)/1.08 'Playfair Display',serif;letter-spacing:-.05em;margin:.8rem 0}
.hero-underline{width:54px;height:54px;object-fit:contain;display:block}
.hero .sub{max-width:34ch;font-size:1.18rem;color:#783d58;font-weight:500;margin-top:.6rem}
.hero-note{display:block;margin-top:1.2rem;color:#aa6d79;font:600 .8rem 'Outfit',sans-serif}
.hero-corner-present,.hero-corner-diya{position:absolute;z-index:1;pointer-events:none;width:clamp(95px,13vw,170px)}
.hero-corner-present{bottom:0;left:2%}.hero-corner-diya{bottom:0;right:3%}
.content-grid{max-width:1190px;margin:0 auto;padding:25px 20px 8px;display:grid;grid-template-columns:1fr 1fr;gap:24px}
section{position:relative;min-width:0;padding:1.75rem 1.6rem 2rem}
.ornate{border:1.5px solid #f4d9c3;border-radius:27px;background:linear-gradient(155deg,#fffefd,#fff8f8 90%);
 box-shadow:var(--shadow);isolation:isolate}
.ornate::before,.ornate::after{position:absolute;content:"";pointer-events:none;width:49px;height:49px;
 background:url("assets/floral-corner-tl.svg") center/contain no-repeat;z-index:-1}
.ornate::before{top:-17px;left:-17px}.ornate::after{bottom:-18px;right:-18px;transform:rotate(180deg)}
section h2{font-size:clamp(2.1rem,3.6vw,3.1rem);margin:.75rem 0 .32rem}
.lead{font-size:1.02rem;line-height:1.6;color:#86506a;margin-bottom:1.3rem;max-width:52ch}
.term{border:2px solid #b96379;border-radius:20px;overflow:hidden;background:#220a22;
 box-shadow:0 7px 0 #e3a54b,0 18px 30px #63304b45}
.term .bar{display:flex;gap:8px;padding:.7rem .9rem;background:linear-gradient(120deg,#5d1646,#300d32)}
.term .bar i{display:block;width:12px;height:12px;border-radius:50%;background:#f1467b}
.term .bar i:nth-child(2){background:#ffd560}.term .bar i:nth-child(3){background:#20d8b4}
.term pre{padding:1.05rem;min-height:19rem;white-space:pre-wrap;overflow-wrap:anywhere;font:400 clamp(.74rem,1.2vw,.87rem)/1.68 ui-monospace,Menlo,Consolas,monospace;color:#fcf5ec}
.term .ok{color:#76f5bd}.term .wr{color:#fdd67a}.term .er{color:#ff86af}.term .cm{color:#cc9ec1}
.gallery-shell{border-radius:22px;position:relative;overflow:hidden;border:1px solid #f6d8c7;
 background:radial-gradient(ellipse at 50% 65%,#ffe3ed,#fffefa 65%);min-width:0}
.gallery-shell::before{content:"";position:absolute;inset:-10% auto auto 50%;transform:translateX(-50%);width:80%;height:95%;
 background:url("assets/arch-floral.svg") center/contain no-repeat;opacity:.35;pointer-events:none}
.ringwrap{perspective:1100px;height:clamp(315px,32vw,420px);touch-action:pan-y;cursor:grab;
 position:relative;overflow:hidden;user-select:none;-webkit-user-select:none;overscroll-behavior-x:contain}
.ringwrap:active{cursor:grabbing}
.photo-ring{position:absolute;left:50%;top:50%;transform-style:preserve-3d;will-change:transform}
.pan{position:absolute;left:0;top:0;border:3px solid #f4c36c;border-radius:17px;overflow:hidden;
 background:#ffe9ed;backface-visibility:hidden;box-shadow:0 12px 28px #66234265;cursor:zoom-in}
.pan img{width:100%;height:100%;object-fit:cover;display:block;pointer-events:none;-webkit-user-drag:none}
.pan::after{content:"✦ tap to view";position:absolute;bottom:7px;left:50%;transform:translateX(-50%);
 border-radius:100px;background:#7f1a4cbb;color:#fff;font:600 .65rem 'Outfit',sans-serif;
 padding:.26rem .65rem;white-space:nowrap;opacity:0;transition:opacity .2s;pointer-events:none}
.pan.is-front::after{opacity:1}
.gal-controls{display:flex;align-items:center;justify-content:center;gap:1rem;max-width:90%;margin:-.1rem auto 0;position:relative;z-index:2}
.gal-controls button{flex:0 0 42px;width:42px;height:42px;display:grid;place-items:center;border:1px solid #fff3c5;border-radius:50%;
 background:linear-gradient(130deg,#f74484,#bb1255);box-shadow:0 3px 0 #d6a24d;color:white;font-size:1.7rem;cursor:pointer}
.cap{min-height:2.4rem;font:italic 700 clamp(1.18rem,2vw,1.6rem)/1.25 'Playfair Display',serif;text-align:center;max-width:70%;overflow-wrap:anywhere}
.hintm{padding:.6rem 1rem 1.2rem;text-align:center;color:#86506a;font-size:.81rem;line-height:1.45}
.flips{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px}
.flip{perspective:900px;height:170px;min-width:0;border:0;padding:0;background:none;text-align:left;cursor:pointer;color:inherit}
.fi{position:relative;width:100%;height:100%;transform-style:preserve-3d;transition:transform .7s cubic-bezier(.25,.85,.3,1)}
.flip.on .fi{transform:rotateY(180deg)}
.fa,.fb{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;
 border-radius:17px;border:2px solid #e6b45d;padding:1rem;display:flex;flex-direction:column;justify-content:center;
 box-shadow:0 5px 0 #e6bdd0,0 10px 16px #a55f7d26}
.fa{background:linear-gradient(150deg,#a81650,#6d1742);color:white}
.fa::before{content:"✦";position:absolute;top:9px;right:12px;color:#ffdb8b}
.fa b{font:400 clamp(1.2rem,2vw,1.65rem)/1.12 'Rozha One',serif;color:#ffe29b}
.fa small{font-size:.78rem;margin-top:.8rem;line-height:1.4;color:#ffe5eb}
.fb{transform:rotateY(180deg);background:linear-gradient(140deg,#ffefb6,#fff8de);color:#61203e;
 font-weight:600;font-size:.94rem;line-height:1.45;border-color:#d8a246}
.heat{text-align:center;position:relative;height:100%;min-height:100%;padding:.4rem .2rem 1.4rem}
.heat-section h2{font-size:clamp(1.95rem,3.4vw,2.8rem)}
.heat .lead{margin:.6rem auto 1rem}
.temp{font:400 clamp(3rem,6vw,4.2rem) 'Rozha One',serif;color:#e82274}
.meter{border:2px solid #d7a148;border-radius:100px;background:#fff2ef;max-width:400px;height:20px;overflow:hidden;margin:.6rem auto 1rem;
 box-shadow:0 0 0 4px #fff5dc}
.meter i{display:block;height:100%;width:6%;background:linear-gradient(90deg,#13b996,#ffc03f,#f86a40,#f31b70);
 transition:width .6s ease}
.heat .m{margin:0 auto;min-height:3.5rem;color:#7b3b58;font-size:.94rem;max-width:40ch}
.heat .cta{margin-top:.8rem}
.heat-diya{position:absolute;bottom:-18px;left:-12px;width:88px;pointer-events:none;opacity:.77}
.wishes{max-width:1150px;margin:26px auto 10px;padding:2.5rem 2rem}
.wishes .lead{margin-bottom:.6rem}
.wish-layout{display:grid;grid-template-columns:1.25fr 1fr;gap:28px;align-items:center}
.diyas{display:flex;justify-content:center;align-items:flex-end;flex-wrap:wrap;gap:clamp(4px,1.5vw,12px);padding:1.4rem 0 .55rem}
.diya{position:relative;width:clamp(64px,8vw,90px);padding:0;background:none;border:0;color:#68243c;cursor:pointer;transition:transform .15s}
.diya:hover{transform:translateY(-4px)}
.flame{display:block;height:26px;font-size:1.35rem;opacity:0;transform:scale(.3);transition:opacity .4s,transform .4s}
.bowl{display:block;height:56px;width:100%;background:url("assets/diya-royal.svg") center/contain no-repeat;
 filter:grayscale(1) brightness(.98) drop-shadow(0 5px 4px #d7a99f);transition:filter .4s}
.diya.on .flame{opacity:1;transform:scale(1);animation:flame-dance 1.7s ease-in-out infinite alternate}
.diya.on .bowl{filter:drop-shadow(0 4px 5px #e9a13b80)}
@keyframes flame-dance{to{transform:scale(1.13) rotate(-5deg)}}
.diya small{display:block;margin-top:.25rem;color:#6d2a44;font:600 .77rem/1.35 'Outfit',sans-serif;white-space:normal}
.hint{text-align:center;color:#aa2d61;margin:1rem auto 0;font-size:.89rem;font-weight:700}
.card{border:2px solid #eac070;border-radius:26px;background:linear-gradient(145deg,#fffefb,#fff1f6);
 box-shadow:0 8px 20px #a8597f24;padding:1.6rem}
.reveal{text-align:center;min-height:175px;display:flex;justify-content:center;align-items:center;flex-direction:column;position:relative}
.reveal::before{content:"";position:absolute;inset:8px;border:1px dashed #e5b56b;border-radius:20px;pointer-events:none}
.reveal h3{font-size:1.7rem;color:#cb245e}.reveal p{max-width:39ch;color:#773b54;margin-top:.6rem;font-size:.96rem}
.wishes-flower{position:absolute;pointer-events:none;width:125px;bottom:-28px;z-index:1}
.wl{left:-41px}.wishes-flower.wr{right:-41px}
.finale{max-width:1150px;margin:28px auto 40px;min-height:380px;text-align:center;padding:2.6rem 9rem 4rem;
 background:radial-gradient(ellipse at 50% 0,#ffedf5,#fffdfb 72%)}
.finale h2{font:italic 700 clamp(2.5rem,5vw,4.5rem)/1.1 'Playfair Display',serif;margin-top:.9rem;letter-spacing:-.05em}
.finale p.t{margin:1.2rem auto 0;max-width:42ch;color:#7d3e59}
.finale .fine{margin:1.15rem auto;color:#9b6076;font-size:.85rem;max-width:54ch}
.finale .sign{margin-top:1.5rem;font-size:1.6rem;color:#b51b56}
.sign span{display:block;font-size:2.65rem;margin-top:.05rem}
.final-flower{position:absolute;bottom:0;width:160px;pointer-events:none}
.ff1{left:0}.ff2{right:0}
.final-gift,.final-sweet{position:absolute;pointer-events:none;bottom:5px;width:115px}
.final-gift{left:3%}.final-sweet{right:3%}
/* intro */
#intro{position:fixed;inset:0;z-index:200;background:linear-gradient(160deg,#fff8f8,#fffef9);overflow:hidden}
.cur{position:absolute;top:0;bottom:0;width:50.2%;background:
 radial-gradient(ellipse at 50% 25%,#fff9f9,#ffe4ee 61%,#f9bdd1);transition:transform 1.24s .32s cubic-bezier(.7,0,.18,1)}
.cl{left:0;border-right:2px solid #e1b76d}.cr{right:0;border-left:2px solid #e1b76d}
#intro.go .cl{transform:translateX(-102%)}#intro.go .cr{transform:translateX(102%)}
.pets{position:absolute;inset:0;overflow:hidden;pointer-events:none}
.pet{position:absolute;top:-28px;border-radius:80% 0 80% 0;opacity:.87;animation:fall linear infinite}
@keyframes fall{to{transform:translate3d(var(--dx),115vh,0) rotate(620deg)}}
.ic{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;
 padding:calc(env(safe-area-inset-top,0px) + 75px) 14px calc(env(safe-area-inset-bottom,0px) + 11px)}
#intro.go .ic{transform:scale(2.25);opacity:0;transition:transform 1.02s cubic-bezier(.6,0,.9,.4),opacity .8s .2s}
.fr{position:absolute;inset:calc(env(safe-area-inset-top,0px) + 10px) 10px calc(env(safe-area-inset-bottom,0px) + 10px);
 pointer-events:none;border:2px solid #dfb44f;border-radius:23px;box-shadow:inset 0 0 38px #efb8c65d}
.fr.f2{inset:calc(env(safe-area-inset-top,0px) + 18px) 18px calc(env(safe-area-inset-bottom,0px) + 18px);
 border:1px dashed #d6a958;box-shadow:none}
.deco{transition:filter 1.1s,opacity 1.1s}
#intro:not(.lit) .deco{filter:saturate(.42);opacity:.62}
.lights{position:absolute;left:0;top:0;width:100%;height:72px;z-index:0}
.bh,.bc{animation:twinkle 1.5s ease-in-out infinite alternate}
@keyframes twinkle{to{opacity:.35}}
.toran{position:absolute;top:0;left:0;right:0;height:62px;display:flex;justify-content:space-around;z-index:1}
.toran::before{content:"";position:absolute;top:8px;left:0;right:0;height:2px;background:#d2a53a}
.sd{display:flex;flex-direction:column;align-items:center;padding-top:8px;animation:hang 3s ease-in-out infinite alternate;animation-delay:calc(var(--i)*-.3s);transform-origin:50% 0}
.th{display:block;width:2px;height:var(--h);background:#bd812e}.mf{display:block;width:14px;height:14px;border-radius:50%;background:radial-gradient(circle,#fff2ad,#e5a33e)}
.lf{display:block;width:12px;height:18px;margin-top:5px;background:#6c9b6e;clip-path:polygon(50% 100%,100% 25%,65% 0,35% 0,0 25%)}
.lan{position:absolute;z-index:2;top:55px;width:clamp(63px,14vw,95px);height:auto;filter:drop-shadow(0 4px 10px #d39a5270);
 animation:hang 3.7s ease-in-out infinite alternate;transform-origin:50% 0}
.l1{left:4%}.l2{right:4%;animation-delay:-1.7s}
.intro-flower{position:absolute;z-index:2;top:0;width:clamp(130px,24vw,220px);pointer-events:none}
.intro-flower-l{left:0}.intro-flower-r{right:0}
.ihead{position:relative;z-index:3;text-align:center;width:100%}
.eyebrow{display:block;font-size:.66rem;letter-spacing:.24em;color:#ab6f76;font-weight:700;margin-bottom:.2rem}
.ishine{font-size:clamp(2.6rem,9vw,4.8rem);color:#a91d58;text-shadow:0 3px 0 #ffe0a2;font-weight:400}
.isub{font-size:clamp(1.1rem,4vw,1.6rem);color:#b32b68;line-height:1.3;margin-top:.18rem;max-width:37ch}
.stage{--sz:min(84vw,39svh);flex:1;position:relative;min-height:0;width:100%;display:grid;place-items:center;perspective:950px}
.glow{position:absolute;top:50%;left:50%;width:var(--sz);height:var(--sz);border-radius:50%;
 transform:translate(-50%,-50%) scale(.3);opacity:0;transition:transform 1.2s,opacity 1.2s;
 background:radial-gradient(circle,#ffe28daa,rgba(255,215,112,.22) 48%,transparent 70%);pointer-events:none}
#intro.lit .glow{transform:translate(-50%,-50%) scale(1.35);opacity:1}
.floor{width:var(--sz);height:var(--sz);transform:rotateX(64deg) translateY(13%)}
.floor svg{width:100%;height:100%;overflow:visible}
.gd{fill:none;stroke:#d8a54b;stroke-width:1.6;stroke-dasharray:2 6}
.pt{transform:scale(.08);opacity:0;transform-box:fill-box;transform-origin:50% 100%}
#intro.lit .pt{transform:none;opacity:1;transition:transform .85s cubic-bezier(.3,1.5,.5,1) var(--d),opacity .5s var(--d)}
.dt{opacity:0}#intro.lit .dt{opacity:1;transition:opacity .7s var(--d)}
.idiya{position:absolute;left:50%;top:50%;width:min(48vw,210px);border:0;background:none;padding:0;
 transform:translate(-50%,-68%);cursor:pointer;filter:drop-shadow(0 9px 16px #bb72475c)}
.idiya img{display:block;width:100%;height:auto;filter:grayscale(.82) brightness(.83);transition:filter 1s}
#intro.lit .idiya img{filter:drop-shadow(0 0 13px #ffcd6c)}
.ring-pulse{position:absolute;top:50%;left:50%;width:85%;aspect-ratio:1;border-radius:50%;border:2px solid #e5ad48;
 transform:translate(-50%,-50%);animation:pulse 1.8s infinite}
@keyframes pulse{to{opacity:0;transform:translate(-50%,-50%) scale(1.45)}}
#intro.lit .ring-pulse{display:none}
.bot{position:relative;z-index:4;display:flex;flex-direction:column;align-items:center;text-align:center;
 width:100%;min-height:144px;justify-content:flex-start}
.ihint{position:absolute;top:0;color:#9b295d;border:1px solid #ecc780;background:#fffaefbd;padding:.3rem .8rem;border-radius:100px;
 font-size:.92rem;font-weight:600}
#intro.lit .ihint{opacity:0;visibility:hidden;transition:opacity .3s}
.fing{display:inline-block;animation:tap 1.2s infinite}
@keyframes tap{50%{transform:translateY(-4px)}}
.ilines p{font:400 clamp(.93rem,3.2vw,1.13rem)/1.4 'Rozha One',serif;color:#7f3152;animation:rise .7s both;margin:.19rem 0;max-width:45ch}
.ilines p:first-child{font-size:clamp(1.25rem,5vw,1.7rem);color:#b3205a}
#open{display:none;margin-top:.55rem}
#intro.ready #open{display:inline-flex;animation:rise .6s both}
#skip{position:absolute;z-index:5;right:27px;top:calc(env(safe-area-inset-top,0px) + 70px);
 border:1px solid #e8bfae;color:#9b3664;background:#fff8f2;padding:.32rem .8rem;border-radius:100px;font-size:.83rem;font-weight:600;cursor:pointer}
#intro.go #skip{display:none}
@keyframes rise{from{opacity:0;transform:translateY(21px)}to{opacity:1;transform:none}}
body:not(.in) .hero-layout,body:not(.in) .hero-kicker{opacity:0}
body.in .hero-layout{animation:rise .8s both}
body.in .hero-kicker{animation:rise .8s .2s both}
/* gallery lightbox */
.lb{position:fixed;inset:0;z-index:300;display:flex;flex-direction:column;opacity:0;pointer-events:none;
 background:rgba(37,9,27,.96);transition:opacity .28s;overscroll-behavior:contain}
.lb.on{opacity:1;pointer-events:auto}
.lbtop{display:flex;justify-content:space-between;align-items:center;
 padding:calc(env(safe-area-inset-top,0px) + 12px) 14px 8px}
.lbtop span{font:400 1.3rem 'Rozha One',serif;color:#ffe1a2}
.lbx,.lbnav{background:#8d275b;border:2px solid #f6c778;color:white;border-radius:50%;width:44px;height:44px;
 display:grid;place-items:center;font-size:1.5rem;cursor:pointer;box-shadow:0 3px 12px #0006}
.lbnav{position:absolute;top:46%;z-index:4;transform:translateY(-50%);width:46px;height:46px}
.lp{left:9px}.ln{right:9px}
.lbv{flex:1;min-height:0;overflow:hidden;touch-action:pan-y;cursor:grab}
.lbt{display:flex;height:100%;transition:transform .48s cubic-bezier(.2,.8,.2,1)}
.lbs{flex:0 0 100%;height:100%;min-width:0;display:grid;place-items:center;padding:8px 12px;overflow:hidden}
.lbs img{width:auto;height:auto;max-width:100%;max-height:100%;border:3px solid #f7c36c;
 border-radius:18px;object-fit:contain;box-shadow:0 14px 37px #000a;transition:transform .35s;
 transform-origin:var(--ox,50%) var(--oy,50%);user-select:none;-webkit-user-drag:none;cursor:zoom-in}
.lbs.z img{transform:scale(2.1);cursor:zoom-out}
.lbcap{text-align:center;color:#ffdf9c;font:italic 700 1.4rem 'Playfair Display',serif;padding:4px}
.lbth{display:flex;justify-content:flex-start;gap:9px;overflow-x:auto;padding:12px 15px calc(env(safe-area-inset-bottom,0px) + 15px);scrollbar-width:none}
.lbth::-webkit-scrollbar{display:none}
.lbth button{flex:0 0 54px;width:54px;height:65px;border:2px solid transparent;border-radius:10px;overflow:hidden;padding:0;background:none;cursor:pointer;opacity:.54}
.lbth button.on{border-color:#ffe2a0;opacity:1;transform:translateY(-2px)}
.lbth img{display:block;width:100%;height:100%;object-fit:cover}
/* responsive */
@media(max-width:900px){
 .hero{min-height:0;padding:3.3rem 16px 3.3rem}
 .hero-layout{display:flex;flex-direction:column;gap:0}
 .stage3{margin:5px auto 0}
 .tilt{width:min(62vw,290px)}
 .hero-copy{text-align:center;padding:1.4rem 12px 0;display:flex;flex-direction:column;align-items:center}
 .hero-copy h1{font-size:clamp(3.0rem,9vw,4.5rem);max-width:100%}
 .hero .sub{font-size:1.05rem}
 .hero-note{font-size:.74rem}
 .hero-lan{top:10%}
 .content-grid{grid-template-columns:1fr;max-width:720px;gap:22px}
 .wishes,.finale{margin-left:20px;margin-right:20px}
}
@media(max-width:600px){
 body{font-size:16px}
 .hero{padding:2.3rem 13px 2.7rem}
 .hero-deco{width:135px}.hero-lan{width:72px;top:5%}
 .hl1{left:-3%}.hl2{right:-3%}
 .hero-kicker{margin-bottom:.6rem;font-size:.64rem;letter-spacing:.12em}
 .hero-copy h1{font-size:clamp(2.65rem,11vw,3.85rem)}
 .tilt{width:min(64vw,270px)}
 .hero-corner-present,.hero-corner-diya{width:76px}
 .content-grid{padding:17px 12px 0}
 section{padding:1.45rem 1.05rem 1.75rem}
 section h2{font-size:clamp(2.05rem,9vw,3.05rem)}
 .lead{font-size:.98rem}
 .flips{gap:11px}
 .flip{height:155px}
 .fa,.fb{padding:.85rem}
 .fa b{font-size:1.24rem}
 .fa small{font-size:.7rem}
 .fb{font-size:.79rem}
 .ringwrap{height:350px}
 .wish-layout{grid-template-columns:1fr;gap:14px}
 .wishes{margin:20px 12px 0;padding:1.6rem 1rem}
 .diyas{gap:2px;flex-wrap:nowrap}
 .diya{width:20%;min-width:0}
 .bowl{height:46px}
 .diya small{font-size:.66rem}
 .reveal{min-height:150px}
 .wishes-flower{width:78px}
 .wl{left:-18px}.wishes-flower.wr{right:-18px}
 .finale{margin:20px 12px 25px;padding:2.4rem 1.1rem 4rem}
 .finale h2{font-size:clamp(2.5rem,10vw,3.6rem)}
 .final-flower{width:100px}
 .final-gift,.final-sweet{width:72px}
 .finale .sign{margin-top:2.4rem}
 .ic{padding-top:calc(env(safe-area-inset-top,0px) + 90px)}
 .intro-flower{width:130px}
 .lan{width:54px}
 .stage{--sz:min(85vw,36svh)}
 .bot{min-height:142px}
 .ilines p{font-size:.93rem}
 .ilines p:first-child{font-size:1.3rem}
 .ihint{font-size:.82rem}
 .eyebrow{font-size:.58rem;letter-spacing:.1em}
 #skip{top:calc(env(safe-area-inset-top,0px) + 66px);right:24px}
 .lbnav{width:38px;height:38px;font-size:1.35rem}
 .lp{left:3px}.ln{right:3px}
}
@media(max-width:360px){
 .flip{height:145px}
 .fa b{font-size:1.1rem}
 .flips{gap:9px}
 .hero-copy h1{font-size:2.6rem}
 .tag{font-size:.7rem}
 .stage{--sz:min(84vw,32svh)}
 .bot{min-height:128px}
 .ic{padding-top:calc(env(safe-area-inset-top,0px) + 79px)}
 .isub{font-size:1.05rem}
}
@media(max-height:680px){
 .ic{padding-top:calc(env(safe-area-inset-top,0px) + 61px)}
 .stage{--sz:min(78vw,29svh)}
 .ishine{font-size:clamp(2.15rem,8vw,3.5rem)}
 .bot{min-height:123px}
 .ilines p{margin:.08rem 0}
 #skip{top:calc(env(safe-area-inset-top,0px) + 54px)}
}
@media(prefers-reduced-motion:reduce){
 html{scroll-behavior:auto}
 .blob,.mq div,.tilt,.lan,.sd,.pet,.ring-pulse,.fing,.bh,.bc,.diya.on .flame{animation:none!important}
 .fi,.lbt,.cur,.ic,.glow,.pt,.dt{transition-duration:.01ms!important}
}

/* Animated introduction flame: active only after the visitor lights the diya. */
.intro-flame{position:absolute;left:50%;top:9%;height:38%;width:21%;transform:translateX(-50%) scale(.15);
 transform-origin:50% 100%;opacity:0;pointer-events:none;filter:drop-shadow(0 0 10px #ffad41)}
.intro-flame::before{content:"";position:absolute;inset:0;border-radius:70% 10% 65% 65% / 75% 15% 65% 70%;
 background:linear-gradient(125deg,#fffcea 15%,#ffdf61 48%,#ffab34 75%,#f46920);transform:rotate(45deg)}
#intro.lit .intro-flame{opacity:.93;animation:intro-flicker 1.6s .2s ease-in-out infinite alternate}
@keyframes intro-flicker{0%,100%{transform:translateX(-50%) scale(.82) rotate(-4deg)}
 50%{transform:translateX(-50%) scale(1.04) rotate(4deg)}}
@media(prefers-reduced-motion:reduce){#intro.lit .intro-flame{animation:none;transform:translateX(-50%) scale(1)}}

/* Final visual QA: richer royal festival layering while keeping the light canvas breathable. */
.skip-link{position:absolute;left:12px;top:-120px}
.skip-link:focus{position:fixed;top:12px}
.hero::before{content:"";position:absolute;inset:0 0 auto;height:118px;pointer-events:none;
 background:url("assets/toran-marigold.svg") repeat-x center top/400px 130px;opacity:.33;z-index:0}
.hero-copy::before{content:"";position:absolute;right:3%;top:0;width:110px;height:150px;pointer-events:none;z-index:-1;
 background:url("assets/paisley-rose.svg") center/contain no-repeat;opacity:.16;transform:rotate(19deg)}
#gal .gallery-shell::after{content:"";position:absolute;bottom:-90px;right:-70px;width:190px;height:190px;
 pointer-events:none;opacity:.15;background:url("assets/mandala-pink.svg") center/contain no-repeat}
.wishes .wish-layout{position:relative}
.wishes .wish-layout::before{content:"";position:absolute;z-index:-1;left:15%;top:-15%;width:260px;height:260px;
 pointer-events:none;background:url("assets/rangoli-blush.svg") center/contain no-repeat;opacity:.095}
.finale::before{width:175px;height:175px;top:0;left:-25px;bottom:auto;right:auto;
 background:url("assets/paisley-champagne.svg") center/contain no-repeat;opacity:.24}
.finale::after{width:175px;height:175px;top:0;right:-25px;left:auto;bottom:auto;
 background:url("assets/paisley-mango.svg") center/contain no-repeat;opacity:.24}
@media(max-width:600px){
 .hero::before{background-size:260px 100px;height:100px;opacity:.25}
 .hero-copy::before{width:72px;height:100px;opacity:.12}
 .wishes .wish-layout::before{width:170px;height:170px;opacity:.08}
 .finale::before,.finale::after{width:92px;height:92px;opacity:.16}
}


/* Premium sound dock: always accessible, visually unobtrusive, mobile-safe. */
.sounddock{
 position:fixed;z-index:285;right:max(15px,env(safe-area-inset-right,0px));
 bottom:calc(15px + env(safe-area-inset-bottom,0px));
 display:flex;flex-direction:column;align-items:flex-end;
 gap:10px;max-width:min(342px,calc(100vw - 26px));font-family:"Outfit",system-ui,sans-serif;
}
.sounddock-row{display:flex;align-items:center;justify-content:flex-end;gap:6px}
.sound-toggle,.sound-settings{
 min-height:48px;border:1.5px solid #f5cd77;color:#6d1b41;
 border-radius:100px;background:linear-gradient(145deg,#fffaf6,#ffe6f0 75%,#ffeaba);
 box-shadow:0 5px 0 #dba14a,0 10px 24px #9d507366;cursor:pointer;
 transition:transform .18s,box-shadow .18s;touch-action:manipulation;
}
.sound-toggle{display:inline-flex;align-items:center;gap:8px;padding:8px 15px;font:700 .83rem/1 "Outfit",sans-serif}
.sound-settings{display:grid;place-items:center;min-width:48px;font-size:1.4rem}
.sound-toggle:hover,.sound-settings:hover{transform:translateY(-2px);box-shadow:0 7px 0 #dba14a,0 12px 26px #9d50736e}
.sound-toggle:active,.sound-settings:active{transform:translateY(3px);box-shadow:0 1px 0 #dba14a}
.sound-icon{font-size:1.24rem}
.sound-led{width:8px;height:8px;background:#e9a339;border-radius:50%;box-shadow:0 0 0 4px #e9a33922}
.sounddock[data-sound="on"] .sound-led{background:#059f7e;box-shadow:0 0 0 4px #059f7e2b,0 0 7px #23a88e}
.sounddock[data-sound="off"] .sound-led{background:#c6a1aa;box-shadow:none}
.sound-panel{
 width:min(318px,calc(100vw - 26px));display:flex;flex-direction:column;
 gap:11px;padding:17px 18px 16px;border-radius:23px;border:2px solid #f0c876;
 background:linear-gradient(154deg,#fffefa,#fff0f5);
 box-shadow:0 8px 0 #e9bf82,0 17px 32px #70304d55;
 color:#5c2140;text-align:left
}
.sound-panel[hidden]{display:none!important}
.sound-panel h3{font:400 1.48rem/1.1 "Rozha One",Georgia,serif;color:#b3205a}
.sound-panel .volume-label{display:flex;justify-content:space-between;font-weight:700;font-size:.85rem}
.sound-panel input[type="range"]{width:100%;min-height:28px;accent-color:#dd2471;cursor:pointer}
.sound-panel .audio-check{display:flex;align-items:center;gap:9px;font-size:.89rem;font-weight:600;cursor:pointer;line-height:1.4}
.sound-panel input[type="checkbox"]{width:18px;height:18px;flex:0 0 18px;accent-color:#df216e;cursor:pointer}
.sound-panel #soundstatus{font-size:.76rem;color:#925775;min-height:1.15rem;line-height:1.4}
@media(max-width:600px){
 .sounddock{right:11px;bottom:calc(11px + env(safe-area-inset-bottom,0px))}
 .sound-toggle{padding:8px 12px;font-size:.75rem;min-height:44px}
 .sound-settings{min-width:44px;min-height:44px}
 .sound-panel{padding:14px}
}
@media(prefers-reduced-motion:reduce){
 .sound-toggle,.sound-settings{transition:none!important}
}


/* During the intro, keep the sound button away from the lower "Open Surprise"
   CTA, especially on 320px phones. The control moves back after entering. */
html.lock .sounddock{
 top:calc(12px + env(safe-area-inset-top,0px));
 bottom:auto;left:max(12px,env(safe-area-inset-left,0px));right:auto;
 align-items:flex-start
}
html.lock .sounddock-row{justify-content:flex-start}
@media(max-width:400px){
 html.lock .sound-toggle .sound-label{display:none}
 html.lock .sound-toggle{padding:8px 10px}
}