:root{--wood:#b98a52;--wood-d:#8f663a;--ink:#5a4632;--cream:#f6efdc;--barn:#c96a63;--fd:'Fredoka',sans-serif;--hand:'Caveat',cursive;--body:'Nunito',sans-serif}
*{box-sizing:border-box}html,body{margin:0;padding:0}
body{font-family:var(--body);color:var(--ink);background:linear-gradient(180deg,#bfe6f2,#e7f0d6);overflow-x:hidden;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%}
html{scrollbar-width:none;-ms-overflow-style:none}html::-webkit-scrollbar,body::-webkit-scrollbar{display:none;width:0;height:0}.film{position:relative}
.stage{position:sticky;top:0;height:100svh;overflow:hidden;background:linear-gradient(180deg,#cdeaf5,#e7f0d6 70%,#dcebc6)}
.shot{position:absolute;inset:0;opacity:0;visibility:hidden;will-change:opacity}
.bg{position:absolute;inset:-8%;background-size:cover;background-position:center;filter:blur(26px) brightness(.9);transform:scale(1.12);background-image:var(--dbg)}
@media(max-width:820px){.bg{background-image:var(--mbg)}}
.media{position:absolute;inset:0;display:grid;place-items:center}
.frame{position:relative;will-change:transform}
.frame.cover{width:100%;height:100%}
.frame.cover picture,.frame.cover img{width:100%;height:100%}
.frame.cover img{object-fit:cover;object-position:center}
.frame.contain{aspect-ratio:var(--arD);max-width:100%;max-height:100%;margin:auto}
@media(max-width:820px){.frame.contain{aspect-ratio:var(--arM)}}
.frame.contain picture,.frame.contain img{width:100%;height:100%}
.frame.contain img{object-fit:contain}
.hotspot{position:absolute;cursor:pointer;border-radius:40px;-webkit-tap-highlight-color:transparent;display:block}
.hotspot::after{content:"";position:absolute;inset:0;border-radius:inherit;animation:hint 2.6s ease-in-out infinite}
.hotspot:hover::after{box-shadow:0 0 0 3px rgba(255,255,255,.7)}
@keyframes hint{0%,100%{box-shadow:0 0 0 0 rgba(255,249,239,0)}50%{box-shadow:0 0 0 4px rgba(255,249,239,.5)}}
.only-m{display:none}@media(max-width:820px){.only-d{display:none}.only-m{display:block}}
.gcard{position:absolute;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;text-align:center;color:var(--wood-d);text-decoration:none;padding:4px}
.gcard .ic{font-size:clamp(1.6rem,7vw,2.2rem);line-height:1}
.gcard .nm{font-family:var(--fd);font-weight:600;font-size:clamp(.85rem,3.6vw,1rem);color:var(--ink)}
.gcard .pr{font-family:var(--body);font-weight:700;font-size:clamp(.75rem,3.2vw,.9rem)}
.gcard .go{margin-top:3px;background:var(--wood-d);color:#fff9ef;font-family:var(--fd);font-size:.75rem;padding:4px 12px;border-radius:20px}
.hero-cue{position:absolute;left:0;right:0;bottom:5%;text-align:center;color:var(--wood-d);font-family:var(--hand);font-size:clamp(1.3rem,4.5vw,1.9rem);text-shadow:0 1px 6px rgba(255,255,255,.6)}
.hero-cue .chev{display:block;width:26px;height:26px;margin:2px auto 0;animation:bob 1.8s ease-in-out infinite}
@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(8px)}}
.finalmsg{position:absolute;left:0;right:0;top:12%;text-align:center;padding:0 8vw}
.finalmsg .t{font-family:var(--hand);font-size:clamp(1.7rem,7vw,2.4rem);color:var(--wood-d);line-height:1.15}
.finalmsg .h{font-family:var(--fd);color:var(--barn);font-size:clamp(1.1rem,5vw,1.4rem);margin-top:.3rem}
.warm{position:fixed;inset:0;z-index:20;pointer-events:none;opacity:0;background:radial-gradient(120% 80% at 70% 15%,rgba(255,236,180,.5),rgba(255,214,150,0) 60%),linear-gradient(180deg,rgba(255,224,170,.25),rgba(255,200,150,.12))}
.vignette{position:fixed;inset:0;z-index:21;pointer-events:none;box-shadow:inset 0 0 140px 20px rgba(90,70,50,.22)}
.grain{position:fixed;inset:0;z-index:22;pointer-events:none;opacity:.05;mix-blend-mode:multiply}
.particles{position:fixed;inset:0;z-index:23;pointer-events:none;overflow:hidden}
.pt{position:absolute;width:8px;height:8px;border-radius:50%;background:radial-gradient(circle,#fff7d8,rgba(255,247,216,0));animation:rise linear infinite}
@keyframes rise{0%{transform:translateY(105vh);opacity:0}10%{opacity:.9}90%{opacity:.7}100%{transform:translateY(-10vh) translateX(30px);opacity:0}}
.cbfly{position:fixed;z-index:24;width:34px;pointer-events:none;left:0;top:0;opacity:0;transition:opacity .4s}
.progress{position:fixed;top:0;left:0;height:4px;width:0;z-index:40;background:linear-gradient(90deg,var(--barn),#f2d27f)}
.rail{position:fixed;right:12px;top:50%;transform:translateY(-50%);z-index:40;display:flex;flex-direction:column;gap:13px;align-items:center}
.dot{width:11px;height:11px;border-radius:50%;border:2px solid rgba(255,255,255,.85);background:rgba(143,102,58,.35);cursor:pointer;transition:.35s;position:relative}
.dot.active{background:var(--barn);border-color:#fff;transform:scale(1.35);box-shadow:0 0 0 4px rgba(201,106,99,.25)}
.dot .tip{position:absolute;right:20px;top:50%;transform:translateY(-50%);background:var(--cream);color:var(--ink);font-family:var(--fd);font-size:.72rem;padding:3px 9px;border-radius:20px;white-space:nowrap;opacity:0;transition:.25s;box-shadow:0 4px 14px rgba(90,70,50,.18)}
.dot:hover .tip{opacity:1}
.sound{position:fixed;left:14px;bottom:14px;z-index:40;width:44px;height:44px;border-radius:50%;border:none;cursor:pointer;background:var(--cream);color:var(--wood-d);box-shadow:0 6px 18px rgba(90,70,50,.2);display:grid;place-items:center}.sound svg{width:20px;height:20px}
.rsvp-card{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:min(410px,86vw);max-height:82svh;overflow:auto;scrollbar-width:none;background:linear-gradient(180deg,rgba(255,255,255,.5),rgba(255,255,255,.12)),repeating-linear-gradient(180deg,var(--wood) 0 20px,var(--wood-d) 20px 22px);border-radius:20px;padding:clamp(.9rem,3.2vw,1.3rem);color:#fff9ef;box-shadow:0 20px 50px rgba(60,45,30,.4),inset 0 0 0 5px rgba(255,249,239,.16);z-index:3}
.rsvp-card h2{font-family:var(--fd);font-weight:600;text-align:center;margin:.1rem 0;font-size:clamp(1.05rem,4.2vw,1.35rem);text-shadow:0 2px 6px rgba(0,0,0,.25)}
.rsvp-card::-webkit-scrollbar{display:none}.rsvp-card .sub{text-align:center;font-family:var(--hand);font-size:1.15rem;color:#ffe9b0;margin:0 0 .45rem}
.field{margin-bottom:7px}.field label{font-family:var(--fd);font-weight:500;font-size:.82rem;display:block;margin:0 0 3px 3px}
.field input,.field textarea{width:100%;font-family:var(--body);font-size:1rem;color:var(--ink);background:var(--cream);border:2px solid rgba(255,249,239,.4);border-radius:12px;padding:9px 12px;outline:none}
.field textarea{resize:vertical;min-height:40px}.two{display:flex;gap:10px}.two .field{flex:1}
.stepper{display:flex;background:var(--cream);border-radius:12px;overflow:hidden}
.stepper button{border:none;background:transparent;width:38px;height:40px;font-size:1.3rem;color:var(--wood-d);cursor:pointer;font-family:var(--fd)}
.stepper input{border:none;text-align:center;width:100%;background:transparent;font-size:1.05rem;color:var(--ink);-moz-appearance:textfield}
.stepper input::-webkit-outer-spin-button,.stepper input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.btn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;margin-top:8px;cursor:pointer;font-family:var(--fd);font-weight:600;font-size:1.05rem;color:#fff9ef;background:var(--barn);border:none;padding:10px;border-radius:40px;margin-top:2px;box-shadow:0 8px 20px rgba(150,70,60,.4)}
.rsvp-done{display:none;text-align:center}.rsvp-done.show{display:block;animation:pop .6s cubic-bezier(.2,1.4,.4,1)}
@keyframes pop{0%{transform:scale(.85);opacity:0}100%{transform:scale(1);opacity:1}}
.rsvp-done .h{font-size:3.2rem;animation:beat 1.1s ease-in-out infinite}
@keyframes beat{0%,100%{transform:scale(1)}22%{transform:scale(1.16)}42%{transform:scale(1)}}
.endline{position:absolute;left:0;right:0;bottom:9%;text-align:center;opacity:0;z-index:4}
.endline .n{font-family:var(--hand);font-weight:700;font-size:clamp(2.4rem,9vw,4rem);color:var(--wood-d);text-shadow:0 2px 0 rgba(255,255,255,.6)}
.endline .y{font-family:var(--fd);color:var(--barn);font-size:clamp(1.1rem,4vw,1.5rem)}
.polaroid{position:absolute;transform:translate(-50%,-50%) rotate(var(--rot,0deg));background:#fffdf7;padding:8px 8px 0;border-radius:5px;box-shadow:0 16px 34px rgba(60,45,30,.4);z-index:4;animation:floaty 5s ease-in-out infinite}.polaroid img{width:100%;display:block;border-radius:3px}.polaroid .cap{display:block;text-align:center;font-family:var(--hand);font-weight:700;font-size:1.5rem;color:var(--ink);padding:5px 0 9px}@keyframes floaty{0%,100%{transform:translate(-50%,-50%) rotate(var(--rot,0deg))}50%{transform:translate(-50%,calc(-50% - 8px)) rotate(var(--rot,0deg))}}.scene-head{position:absolute;left:0;right:0;top:9%;text-align:center;z-index:4;padding:0 8vw}.scene-head .sh-t{font-family:var(--hand);font-size:clamp(1.3rem,5vw,2rem);color:var(--wood-d)}.scene-head .sh-n{font-family:var(--hand);font-weight:700;font-size:clamp(2.2rem,9vw,3.6rem);color:var(--ink);line-height:1;text-shadow:0 2px 0 rgba(255,255,255,.6)}.detail-seal{position:absolute;left:50%;top:55%;transform:translate(-50%,-50%);width:min(400px,84%);background:linear-gradient(180deg,#fbf3dd,#f0e2bf);border:5px solid var(--wood);border-radius:16px;padding:15px 18px;box-shadow:0 16px 40px rgba(60,45,30,.35);z-index:3}.detail-seal .ds-head{font-family:var(--fd);font-weight:600;text-align:center;color:var(--wood-d);font-size:.85rem;letter-spacing:.4px;margin-bottom:6px}.detail-seal .ds-row{display:flex;align-items:center;gap:10px;margin:7px 0;text-align:left}.detail-seal .ds-row span{font-size:1.3rem}.detail-seal .ds-row b{font-family:var(--fd);font-weight:600;color:var(--ink);display:block;font-size:1.05rem}.detail-seal .ds-row small{color:var(--wood-d);font-size:.82rem;line-height:1.25;display:block}.detail-seal .ds-btn{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:10px;background:var(--wood-d);color:#fff9ef;font-family:var(--fd);font-weight:600;text-decoration:none;padding:11px;border-radius:30px;font-size:1rem}.reduced .film{height:auto!important}.reduced .stage{position:static;height:auto}.reduced .shot{position:relative;inset:auto;opacity:1!important;visibility:visible!important;height:100svh}.reduced .frame{transform:none!important}.reduced .particles,.reduced .cbfly{display:none}