@font-face{font-family:Cormorant;src:url('assets/cormorant-garamond.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:GreatVibes;src:url('assets/great-vibes.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap}
:root{--wine:#642438;--deep:#381c28;--gold:#c6a76e;--cream:#f9f1df;--ink:#642738;--serif:Cormorant,Georgia,serif;--script:GreatVibes,'Snell Roundhand',cursive}
*{box-sizing:border-box}html{min-height:100%;background:var(--deep)}body{margin:0;min-height:100svh;color:var(--cream);font-family:var(--serif);background:radial-gradient(ellipse at 50% 30%,#784052 0%,#4f2537 45%,#2b1722 100%);overflow-x:hidden}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:2px solid #edcd8a;outline-offset:5px}button:disabled{cursor:default;opacity:.4}[hidden]{display:none!important}h1,h2,p{margin:0}h2:focus{outline:none}.ambient{position:fixed;inset:0;background-image:url('assets/mandap.webp');background-size:cover;background-position:center;filter:blur(55px);opacity:.075;pointer-events:none}.invitation{position:relative;width:min(94vw,calc((100svh - 184px)*.5625),490px);min-width:min(280px,94vw);margin:0 auto;padding:14px 0 16px}.masthead{height:38px;display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}.monogram{font-family:var(--script);font-size:26px;line-height:1}.monogram span{font-size:20px;margin:0 3px;color:var(--gold)}.sound-button{display:flex;align-items:center;gap:7px;min-height:40px;padding:5px 2px 5px 12px;background:transparent;border:0;color:#f4e4c4;font-family:Georgia,serif;font-size:14px;letter-spacing:.02em}.sound-icon{width:20px;height:20px}.slash{display:none}.sound-button[aria-pressed=false] .waves{display:none}.sound-button[aria-pressed=false] .slash{display:block}.stage{position:relative;aspect-ratio:9/16;width:100%;background:var(--cream);color:var(--ink);overflow:hidden;isolation:isolate;container-type:inline-size;box-shadow:0 22px 65px #140c1766,0 0 0 1px #d4b58170,0 0 0 5px #b18d6022;border-radius:2px}.scene{position:absolute;inset:0;opacity:0;pointer-events:none;z-index:1;transition:opacity .75s ease}.scene.is-active{opacity:1;pointer-events:auto;z-index:2}.scene.leaving{opacity:0;z-index:3;pointer-events:none}.scene-inner{position:absolute;inset:0;transform:scale(1.014);transform-origin:center;overflow:hidden}.scene.is-active .scene-inner{animation:arrive 2.2s cubic-bezier(.2,.5,.3,1) both}.cover .scene-inner{animation-duration:3s!important}.art{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;user-select:none;-webkit-user-drag:none}.light{position:absolute;inset:0;background:radial-gradient(ellipse at 78% 3%,#fff1b95c,transparent 40%),linear-gradient(145deg,transparent 17%,#ffda8230 24%,transparent 37%);mix-blend-mode:screen;pointer-events:none;animation:light-drift 11s ease-in-out infinite alternate;opacity:.7}.script{font-family:var(--script);font-weight:400}.cover-copy{position:absolute;top:19%;width:100%;text-align:center;padding:0 12%}.eyebrow{font-family:Georgia,serif;font-size:3.2cqw;text-transform:uppercase;letter-spacing:.23em;margin-bottom:5cqw}.cover h1{font-size:13cqw;line-height:1.05;font-weight:400}.cover h1 span{font-size:.68em}.ornament{display:flex;align-items:center;justify-content:center;gap:3cqw;width:29%;height:2cqw;margin:5.5cqw auto;color:#b3935a}.ornament:before,.ornament:after{content:"";height:1px;background:currentColor;flex:1;opacity:.6}.ornament{background:linear-gradient(45deg,transparent 40%,#b3935a 40%,#b3935a 60%,transparent 60%) center/1.2cqw 1.2cqw no-repeat}.begin-button{display:inline-flex;justify-content:center;align-items:center;min-height:44px;padding:12px 24px;border:1px solid #795132;color:var(--cream);background:var(--wine);border-radius:2px;font-size:clamp(16px,4.4cqw,21px);box-shadow:0 4px 18px #4f1f2420}.begin-button:hover{background:#7a3045}.copy{position:absolute;left:9%;width:82%;text-align:center}.copy h2,.copy p{font-size:6.15cqw;line-height:1.18;font-weight:400}.opening-copy{top:24%}.opening-copy .second-line{margin-top:8cqw;font-size:5.9cqw}.opening-copy .ornament{margin-top:6.5cqw}.family-copy{top:25%}.family-copy h2{font-size:7.5cqw;font-weight:600}.couple-copy{top:21.5%}.couple-copy h2{font-size:12.5cqw;line-height:1.12}.couple-copy .ornament{margin-top:4cqw}.celebration-copy{top:21.6%}.celebration-copy h2{font-size:7.2cqw;line-height:1.5}.celebration-copy strong{font-size:7.8cqw}.diya-flame{position:absolute;left:71.07%;top:77.45%;width:7.9%;height:7.3%;object-fit:fill;transform-origin:51% 95%;animation:flame-flicker .55s ease-in-out infinite alternate;pointer-events:none;mix-blend-mode:normal}.opening.is-active .second-line{animation:words-arrive 1s ease both .35s}.envelope-video{opacity:0;z-index:1}.envelope-video.playing{opacity:1}.envelope .light{z-index:2}.envelope-prompt{position:absolute;top:17%;left:10%;right:10%;text-align:center;font-size:5.3cqw;z-index:3}.seal-button{position:absolute;left:41.7%;top:49.1%;width:16.6%;height:9.3%;border:0;border-radius:50%;background:transparent;z-index:5;min-width:44px;min-height:44px}.seal-ring{position:absolute;inset:8%;border:1px solid #ffdaa5b5;border-radius:50%;box-shadow:0 0 20px #ffdf9f60;animation:seal-pulse 2.2s ease-in-out infinite}.seal-caption{position:absolute;top:83%;width:100%;text-align:center;font-size:4.3cqw;z-index:3}.envelope.opening-envelope .seal-button,.envelope.is-open .seal-button,.envelope.opening-envelope .seal-caption,.envelope.is-open .seal-caption,.envelope.opening-envelope .envelope-prompt,.envelope.is-open .envelope-prompt{opacity:0;pointer-events:none;transition:opacity .25s}.letter-copy{position:absolute;inset:37% 17% auto;text-align:center;z-index:4;opacity:0;transform:translateY(5px);transition:opacity .85s,transform .85s}.letter-copy h2{font-size:11.5cqw;line-height:1.18}.letter-copy p{font-size:5.8cqw;line-height:1.3;margin-top:7cqw}.letter-copy .ornament{width:35%}.envelope.is-open .letter-copy{opacity:1;transform:translateY(0)}.date-copy{position:absolute;top:17.1%;left:10%;right:10%;text-align:center}.calendar-tile{width:25cqw;height:25cqw;position:relative;margin:0 auto 4.5cqw;border:1px solid #af9054;border-radius:3px;background:#fcf7e9e0;color:var(--ink);font:400 10cqw var(--serif);display:grid;place-items:center;padding-top:3cqw}.calendar-tile:before{content:"";position:absolute;inset:20% 0 auto;height:1px;background:#b9986459}.calendar-tile:after{content:"";position:absolute;top:-2cqw;left:24%;width:1.4cqw;height:3.6cqw;border-radius:2px;background:#ad8d51;box-shadow:11cqw 0 0 #ad8d51}.calendar-ring{position:absolute;left:16%;top:28%;width:68%;aspect-ratio:1;border:1.5px solid #b29456;border-radius:50%;transform:rotate(-9deg)}.date-scene.is-active .calendar-ring{animation:circle-reveal 1.3s ease both .6s}.date-copy .names{font-size:8.8cqw;line-height:1.3;white-space:nowrap}.date-copy .ornament{margin:3.8cqw auto 4.7cqw;width:31%}.wedding-date{font-size:8.9cqw;line-height:1.18;white-space:nowrap}.wedding-date span{font-size:15.5cqw}.date-copy .closing{font-size:clamp(16px,5.3cqw,26px);line-height:1.2;white-space:nowrap}.date-copy .wedding-date+.ornament{margin-top:6cqw;margin-bottom:3.4cqw}.controls{padding-top:11px}.chapter-track{display:flex;justify-content:center;gap:6px;margin:0 auto 5px;max-width:210px}.chapter-track button{height:26px;min-width:26px;flex:1;background:transparent;border:0;position:relative;padding:0}.chapter-track button:before{content:"";position:absolute;height:2px;left:0;right:0;top:10px;background:#dfbd8940;border-radius:2px;transition:background .4s,box-shadow .4s}.chapter-track button[aria-current=step]:before{background:#f1d9a3;box-shadow:0 0 7px #f1d9a344}.chapter-track button.visited:before{background:#bb9664}.action-row{display:flex;align-items:center;justify-content:center;gap:12px;min-height:44px}.back-button{width:44px;height:44px;border:1px solid #cfab7550;background:transparent;color:#f6dfb5;display:grid;place-items:center;border-radius:50%}.back-button svg{width:18px;height:18px}.primary-button{min-height:44px;min-width:160px;padding:9px 18px;white-space:nowrap;border:1px solid #d4b683;background:#f8edda;color:#602638;font-size:18px;line-height:1;border-radius:2px;transition:background .2s}.primary-button:hover{background:#fff9ec}.replay-button{min-height:44px;background:transparent;border:0;border-bottom:1px solid #bfa16d60;color:#efdab7;padding:6px 8px;font-size:16px}.opening-note{text-align:center;font-size:14px;font-style:italic;color:#edd9b8b0;margin-top:18px}.sparkles{position:absolute;inset:0;z-index:5;pointer-events:none;overflow:hidden}.sparkles i{position:absolute;width:3px;height:3px;border-radius:50%;background:#fffbd7;box-shadow:0 0 7px 2px #fff0ae;left:7%;top:20%;animation:sparkle 7s ease-in-out infinite;opacity:0}.sparkles i:nth-child(2){left:94%;top:35%;animation-delay:-2s}.sparkles i:nth-child(3){left:15%;top:75%;animation-delay:-4s;width:2px;height:2px}.sparkles i:nth-child(4){left:88%;top:82%;animation-delay:-1s}.sparkles i:nth-child(5){left:8%;top:50%;animation-delay:-5s}.sparkles i:nth-child(6){left:83%;top:11%;animation-delay:-3s}.sparkles i:nth-child(7){left:30%;top:7%;animation-delay:-6s}.sparkles i:nth-child(8){left:75%;top:91%;animation-delay:-2.5s}.transition-light{position:absolute;inset:0;pointer-events:none;z-index:6;opacity:0;background:radial-gradient(ellipse at 20% 15%,#fff4cfcc,transparent 70%)}.stage.transitioning .transition-light{animation:gold-wash .9s ease}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.noscript{padding:30px;text-align:center}.noscript a{color:#f3d2a0}
@keyframes arrive{from{transform:scale(1)}to{transform:scale(1.014)}}@keyframes words-arrive{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}@keyframes flame-flicker{0%{transform:scale(.93,1) skewX(-2deg);filter:brightness(1)}45%{transform:scale(1.02,.91) skewX(1.5deg);filter:brightness(1.08)}100%{transform:scale(.98,1.05) skewX(-1deg);filter:brightness(.98)}}@keyframes seal-pulse{0%,100%{transform:scale(.94);opacity:.45}50%{transform:scale(1.08);opacity:.85}}@keyframes sparkle{0%,100%{opacity:0;transform:translate(0,10px) scale(.6)}30%{opacity:.55}65%{opacity:.08;transform:translate(9px,-30px) scale(1)}}@keyframes light-drift{from{transform:translateX(-3%);opacity:.45}to{transform:translateX(3%);opacity:.8}}@keyframes gold-wash{0%,100%{opacity:0}38%{opacity:.48}}@keyframes circle-reveal{from{clip-path:inset(0 100% 0 0);opacity:0}to{clip-path:inset(0);opacity:1}}
@media(min-width:850px){.invitation{padding-top:20px}.masthead{margin-bottom:15px}.stage{box-shadow:0 30px 90px #0e071890,0 0 0 1px #d4b58170,0 0 0 7px #b18d6018}.ambient{background-size:auto 130%;background-repeat:repeat-x;filter:blur(75px);opacity:.11}}
@media(max-width:380px){.sound-button{font-size:14px}.masthead{margin-bottom:7px}.invitation{padding-top:10px}.controls{padding-top:6px}.opening-note{font-size:13px;margin-top:14px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.scene-inner{transform:none}.diya-flame{transform:none}.sparkles{display:none}.light{opacity:.35}.calendar-ring{clip-path:none}}

/* Keep the final typography in the clear fabric area of the mandap. */
.date-copy{inset:0;text-align:center}
.date-copy .calendar-tile{position:absolute;left:50%;top:17.4%;transform:translateX(-50%);width:21cqw;height:22.7cqw;margin:0;font-size:9cqw}
.date-copy .calendar-tile:after{box-shadow:9.4cqw 0 0 #ad8d51}
.date-copy .names{position:absolute;top:31.5%;left:7%;width:86%;font-size:8.8cqw;line-height:1.3}
.date-copy>.ornament{position:absolute;left:35%;width:30%;margin:0!important}
.date-copy>.ornament:nth-of-type(1){top:39.1%}
.date-copy>.ornament:nth-of-type(2){top:58.4%}
.date-copy .wedding-date{position:absolute;inset:0;font-size:8.9cqw;pointer-events:none}
.wedding-date .date-day{position:absolute;top:42.1%;left:0;width:100%;font-size:15.5cqw;line-height:1.05}
.wedding-date .date-month{position:absolute;top:51.1%;left:0;width:100%;font-size:8.9cqw;line-height:1.18}
.date-copy .closing{position:absolute;top:60.1%;left:8%;width:84%;font-size:clamp(16px,5.3cqw,26px);line-height:1.2}

@media(max-width:300px){body{overflow-x:auto}.invitation{width:280px;min-width:280px;margin-inline:10px}}
