@font-face{font-family:InvitationSerif;src:url('/fonts/serif.woff') format('woff');font-display:swap;font-weight:400}
@font-face{font-family:InvitationSerif;src:url('/fonts/serif-italic.woff') format('woff');font-style:italic;font-display:swap;font-weight:400}
@font-face{font-family:Pinyon;src:url('/fonts/pinyon-script.ttf') format('truetype');font-display:swap;font-weight:400}
:root{--paper:#f4efe5;--ink:#564d3d;--sage:#737a61;--gold:#aa864f;--line:#b39a714f;--fade:2200ms;--serif:InvitationSerif,'Times New Roman',serif;--script:Pinyon,InvitationSerif,serif;--ease:cubic-bezier(.25,.7,.25,1)}
*{box-sizing:border-box}html,body{height:100%;width:100%;margin:0;overflow:hidden;overscroll-behavior:none}body{background:radial-gradient(ellipse at 50% 32%,#58624b,#2e352a);font-family:var(--serif);color:var(--ink);-webkit-font-smoothing:antialiased}button,a{-webkit-tap-highlight-color:transparent;font:inherit}button{cursor:pointer}button:disabled{cursor:default}[hidden]{display:none!important}button:focus-visible,a:focus-visible{outline:2px solid #a78653;outline-offset:5px}h1:focus,h2:focus{outline:none}svg{display:block}.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}
.stage{position:relative;isolation:isolate;height:100vh;height:100dvh;width:min(100%,600px);margin:auto;overflow:hidden;overflow:clip;background:var(--paper);box-shadow:0 0 100px #14190f50;perspective:1700px}.ivory-ground{position:absolute;inset:0;z-index:-1;background:var(--paper) url('/art/ivory-stationery.png') center/cover no-repeat}.daylight{position:absolute;z-index:1;inset:-30%;background:linear-gradient(112deg,transparent 32%,#fff7 48%,transparent 67%);opacity:.2;pointer-events:none;animation:daylight 25s ease-in-out infinite alternate}
.scene{position:absolute;inset:0;z-index:2;display:grid;place-items:center;padding:72px 28px 100px;opacity:0;visibility:hidden;pointer-events:none;transition:opacity var(--fade) ease,visibility 0s linear var(--fade);overflow:hidden;overflow:clip}.scene.is-current{z-index:3;opacity:1;visibility:visible;pointer-events:auto;transition:opacity var(--fade) ease,visibility 0s}.scene-content{width:100%;max-width:400px;text-align:center;position:relative}.scene:not(.is-current){user-select:none}.eyebrow{margin:0;font:10px/1.6 Arial,Helvetica,sans-serif;letter-spacing:.25em;color:#6a6957;text-transform:uppercase}.entrance{opacity:0;transform:translateY(12px);transition:opacity 1.8s ease,transform 2.5s var(--ease)}.is-current .entrance{opacity:1;transform:translateY(0)}.is-current .delay-1{transition-delay:450ms}.is-current .delay-2{transition-delay:750ms}.is-current .delay-3{transition-delay:1050ms}.is-current .delay-4{transition-delay:1250ms}.is-current .delay-5{transition-delay:1450ms}
.name-content{padding-top:20px}.resting-butterfly{position:relative;width:130px;height:105px;margin:0 auto 18px;filter:drop-shadow(2px 8px 7px #635f4023);animation:hover-soft 9s ease-in-out infinite}.butterfly{position:relative;width:100%;height:100%;perspective:450px}.butterfly img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}.left-wing{clip-path:polygon(0 0,50% 0,50% 100%,0 100%);transform-origin:50% 50%;animation:left-wing 2.3s ease-in-out infinite}.right-wing{clip-path:polygon(50% 0,100% 0,100% 100%,50% 100%);transform-origin:50% 50%;animation:right-wing 2.3s ease-in-out infinite}.butterfly-body{clip-path:polygon(35% 0,65% 0,53% 44%,53% 100%,47% 100%,47% 44%)}.names{font:400 clamp(90px,24vw,128px)/.83 var(--script);margin:27px 0 21px;color:#5b634d;text-shadow:0 1px #fff9}.names>span{display:block}.names>span:first-child{padding-right:16px}.names>span:last-child{padding-left:15px;font-size:1.13em}.names i{display:block;font:400 35px/1.35 var(--serif);color:#a88957;margin:0}.fine-ornament{display:flex;align-items:center;justify-content:center;gap:12px;margin:24px auto 23px;color:var(--gold)}.fine-ornament>span{width:52px;height:1px;background:linear-gradient(90deg,transparent,#b59a69)}.fine-ornament>span:last-child{transform:scaleX(-1)}.fine-ornament svg{width:25px;fill:none;stroke:currentColor;stroke-width:.8}.inviting-copy{font:italic 400 18px/1.55 var(--serif);margin:0;color:#655c4e}.small-date{font:10px/1.4 Arial,sans-serif;letter-spacing:.3em;color:#81714f;margin:27px 0 0}
.date-content{padding-top:5px}.date-heading{font-weight:400;margin:24px 0 0}.weekday{display:block;font:400 41px/1.2 var(--script);color:#9a7b50}.day{display:block;font:400 102px/.92 var(--serif);letter-spacing:-.035em;color:#797c61;margin:9px auto 6px}.month{display:block;font:400 32px/1.4 var(--serif)}.month b{font-weight:400}.arrival{width:200px;margin:25px auto 0;padding:21px 0 17px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.arrival>span{display:block;font:9px/1.3 Arial,sans-serif;letter-spacing:.23em}.arrival strong{display:block;font:400 33px/1.5 var(--serif);color:#6a654f;margin-top:7px}.arrival small{display:block;font:italic 13px/1.3 var(--serif);color:#837862}.countdown-block{margin-top:28px}.countdown-label{font-size:8px;letter-spacing:.22em;color:#7c705a}.countdown{display:flex;justify-content:center;margin-top:14px;gap:0}.countdown>div{width:72px;position:relative}.countdown>div+div:before{content:':';position:absolute;left:-2px;top:1px;color:#bda884;font:20px/1.2 var(--serif)}.countdown strong{display:block;font:400 29px/1.2 var(--serif);font-variant-numeric:tabular-nums;color:#6a6752}.countdown span{display:block;font:7px/1.4 Arial,sans-serif;letter-spacing:.12em;margin-top:5px;color:#83745e}.soft-copy{font:italic 15px/1.5 var(--serif);margin:28px 0 0;color:#82765e}
.venue-content{padding-top:9px}.venue-content>.eyebrow{font-size:9px;letter-spacing:.22em}.venue-ornament{margin:23px auto 18px;width:90px;height:45px}.venue-ornament svg{height:100%;fill:none;stroke:#a68a59;stroke-width:1}.venue-title{font:400 40px/1.08 var(--serif);color:#60664f;margin:0}.venue-title>span{display:block;font:400 19px/1.4 var(--serif);color:#6e6350;margin:0 0 14px}.venue-title em{display:block;font:400 55px/1 var(--script);margin-top:10px;color:#9a7b50}.location{font:italic 18px/1.5 var(--serif);color:#7c725e;margin:14px 0 0}.venue-reminder{font:14px/1.5 var(--serif);margin:18px 0 0;letter-spacing:.01em}.venue-reminder>span{padding:0 7px;color:#9d8559}.map-button{display:flex;align-items:center;justify-content:center;gap:13px;width:min(100%,290px);margin:32px auto 0;border:1px solid #b69a65;border-radius:3px;padding:16px 15px;background:linear-gradient(115deg,#7c8369,#626c53);color:#fff9ec;text-decoration:none;box-shadow:0 10px 28px #444e3020;transition:transform .3s,filter .3s}.map-button:hover{filter:brightness(1.07);transform:translateY(-2px)}.map-button>span{font:16px/1.2 var(--serif)}.map-button svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.2}.map-button svg:last-child{width:14px;height:14px}.map-caption{font:7px/1.4 Arial,sans-serif;letter-spacing:.2em;color:#8c816b;margin:10px 0 0}.closing{font:italic 17px/1.5 var(--serif);color:#7b725f;margin:35px 0 0}.signature{font:400 46px/1.3 var(--script);margin:5px 0 0;color:#72785f}.signature span{font:400 21px/1.3 var(--serif);color:#a38759;padding:0 5px}
.envelope{position:absolute;z-index:8;inset:0;perspective:1700px;transform-style:preserve-3d;pointer-events:auto}.envelope-lining{position:absolute;inset:0;background:var(--sage) url('/art/sage-paper.png') center/100% 100% no-repeat}.fold{position:absolute;inset:0;backface-visibility:hidden;transform-style:preserve-3d;will-change:transform}.paper-surface{position:absolute;inset:0;background:var(--sage) url('/art/sage-paper.png') center/100% 100% no-repeat}.paper-surface:after{content:'';position:absolute;inset:0;opacity:.55}.fold-top{z-index:5;clip-path:polygon(0 0,100% 0,50% 52.4%);transform-origin:center top}.fold-top .paper-surface:after{background:linear-gradient(180deg,#ffffff20,transparent 24%,#252c214a 54%)}.fold-left{z-index:3;clip-path:polygon(0 0,50% 52.4%,0 100%);transform-origin:left center}.fold-left .paper-surface:after{background:linear-gradient(95deg,#ffffff18,#19221950)}.fold-right{z-index:3;clip-path:polygon(100% 0,50% 52.4%,100% 100%);transform-origin:right center}.fold-right .paper-surface:after{background:linear-gradient(265deg,#ffffff08,#1c201554)}.fold-bottom{z-index:4;clip-path:polygon(0 100%,50% 52.4%,100% 100%);transform-origin:center bottom}.fold-bottom .paper-surface:after{background:linear-gradient(0deg,#f3e9bc18,#25311a40)}.seams{position:absolute;inset:0;width:100%;height:100%;z-index:6;pointer-events:none;fill:none}.seam-shadow{stroke:#333c2b99;stroke-width:2}.seam-light{stroke:#ded3a96b;stroke-width:.8}.envelope-heading{position:absolute;z-index:7;top:18%;left:0;right:0;text-align:center;color:#f4ecda;text-shadow:0 2px 3px #3a402540}.envelope-heading p{font:8px/1.3 Arial,sans-serif;letter-spacing:.27em;margin:0 0 12px}.envelope-heading>span{font:400 45px/1.3 var(--script);display:block}.envelope-heading i{font:400 22px/1.3 var(--serif);padding:0 3px;color:#e5d6af}.seal-button{position:absolute;z-index:9;top:52.3%;left:50%;transform:translate(-50%,-50%);width:158px;height:158px;padding:0;border:none;background:none;filter:drop-shadow(0 12px 9px #1a211847);transition:filter .5s ease}.seal-button:hover{filter:drop-shadow(0 15px 10px #1a21185f) brightness(1.08)}.seal{width:100%;height:100%}.seal-engraving{filter:drop-shadow(.5px 1px 0 #f8e4aacc)}.envelope-caption{position:absolute;z-index:7;top:74%;left:0;right:0;text-align:center;color:#f3ebd7}.tiny-rule{display:block;width:29px;height:1px;background:#e6d4a399;margin:0 auto 18px}.envelope-caption p{margin:0;font:8px/1.5 Arial,sans-serif;letter-spacing:.23em}.envelope-caption small{display:block;margin-top:13px;font:italic 18px/1.4 var(--serif);color:#eee2c7}.flight{position:absolute;z-index:15;top:52%;left:50%;width:146px;height:118px;transform:translate(-50%,-50%);opacity:0;pointer-events:none;filter:drop-shadow(6px 12px 7px #63583b25)}.flight .left-wing,.flight .right-wing{animation-duration:.8s}
.stage.has-opened .envelope{animation:envelope-away 8.4s linear forwards}.stage.has-opened .envelope-lining{animation:lining-away 8.4s linear forwards}.stage.has-opened .seal-button{animation:seal-lift 2.5s var(--ease) forwards;pointer-events:none}.stage.has-opened .envelope-heading,.stage.has-opened .envelope-caption{animation:cover-copy-away 1.8s ease forwards}.stage.has-opened .seams{animation:cover-copy-away 1.6s ease .8s forwards}.stage.has-opened .fold-top{animation:flap-open 5.7s var(--ease) 1.1s forwards}.stage.has-opened .fold-left{animation:left-open 4.5s var(--ease) 2.8s forwards}.stage.has-opened .fold-right{animation:right-open 4.5s var(--ease) 2.8s forwards}.stage.has-opened .fold-bottom{animation:bottom-open 4.5s var(--ease) 2.8s forwards}.stage.has-opened .flight{animation:butterfly-flight 8.8s ease-in-out 1.3s both}
.playback-top{position:absolute;z-index:20;top:max(14px,env(safe-area-inset-top));left:18px;right:18px;display:flex;align-items:center;justify-content:space-between;opacity:0;transition:opacity 1.5s ease;pointer-events:none}.stage[data-phase='playing'] .playback-top{opacity:1;pointer-events:auto}.playback-top button{background:#faf7efae;border:1px solid #bda77b28;border-radius:999px;display:flex;align-items:center;gap:6px;color:#716951;padding:9px 11px;font:10px/1.3 Arial,sans-serif;min-height:44px;backdrop-filter:blur(8px)}.playback-top svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.2}.play-symbol{display:none}.stage[data-paused='true'] .pause-symbol{display:none}.stage[data-paused='true'] .play-symbol{display:block}
.scene-nav{position:absolute;z-index:20;bottom:0;left:0;right:0;min-height:86px;padding:12px 17px max(17px,env(safe-area-inset-bottom));display:flex;gap:10px;align-items:center;justify-content:center;background:linear-gradient(0deg,#f4efe5ed,#f4efe5b3 78%,transparent);opacity:0;transition:opacity 1.4s ease}.stage[data-phase='playing'] .scene-nav{opacity:1}.nav-arrow{flex:none;border:1px solid #ab926245;border-radius:50%;background:#fffdf641;color:#7d745d;width:40px;height:40px;display:grid;place-items:center;transition:opacity .5s}.nav-arrow svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:1.1}.nav-arrow:disabled{opacity:.22}.steps{display:flex;flex:1;max-width:255px;gap:12px;padding:0 5px}.step{position:relative;flex:1;min-width:0;padding:14px 0 9px;color:#918774;border:0;background:none;font:10px/1.4 Arial,sans-serif;letter-spacing:.035em}.track{display:block;overflow:hidden;height:1px;background:#bcaa853d;margin-bottom:9px}.track i{display:block;height:100%;background:#aa8e57;width:100%;transform:scaleX(0);transform-origin:left}.step.is-complete .track i{transform:scaleX(1)}.step[aria-current='step']{color:#5c634e}.step[aria-current='step'] .track i{transform:scaleX(var(--progress,0))}.stage[data-paused='true'] *,.stage.tab-hidden *{animation-play-state:paused!important}
.no-script{position:absolute;inset:0;z-index:50;background:var(--paper);display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center}.no-script a{color:#657251}
@keyframes seal-lift{0%{transform:translate(-50%,-50%) scale(1);opacity:1}40%{transform:translate(-50%,-59%) scale(1.06) rotate(-5deg);opacity:1}100%{transform:translate(-50%,-68%) scale(.85) rotate(-11deg);opacity:0}}
@keyframes cover-copy-away{to{opacity:0;transform:translateY(-7px)}}
@keyframes flap-open{0%{transform:rotateX(0)}70%{transform:rotateX(105deg)}100%{transform:rotateX(170deg);opacity:0}}
@keyframes left-open{to{transform:translateX(-95%) rotateY(-24deg);opacity:0}}
@keyframes right-open{to{transform:translateX(95%) rotateY(24deg);opacity:0}}
@keyframes bottom-open{to{transform:translateY(85%) rotateX(-17deg);opacity:0}}
@keyframes lining-away{0%,28%{opacity:1}68%,100%{opacity:0}}
@keyframes envelope-away{0%,68%{opacity:1}90%,100%{opacity:0;visibility:hidden}}
@keyframes butterfly-flight{0%{opacity:0;left:50%;top:53%;transform:translate(-50%,-50%) scale(.45) rotate(-8deg)}12%{opacity:1;left:49%;top:44%;transform:translate(-50%,-50%) scale(.68) rotate(-17deg)}36%{opacity:1;left:23%;top:29%;transform:translate(-50%,-50%) scale(.86) rotate(-24deg)}61%{left:70%;top:15%;transform:translate(-50%,-50%) scale(.7) rotate(18deg);opacity:1}81%{left:42%;top:20%;transform:translate(-50%,-50%) scale(.65) rotate(-4deg);opacity:1}100%{left:49%;top:16%;transform:translate(-50%,-50%) scale(.55);opacity:0}}
@keyframes left-wing{0%,100%{transform:rotateY(0)}45%{transform:rotateY(52deg)}70%{transform:rotateY(8deg)}}
@keyframes right-wing{0%,100%{transform:rotateY(0)}45%{transform:rotateY(-52deg)}70%{transform:rotateY(-8deg)}}
@keyframes hover-soft{50%{transform:translateY(-6px) rotate(2deg)}}
@keyframes daylight{to{transform:translateX(8%) rotate(3deg)}}
@media(min-width:760px){.stage{max-width:min(600px,65dvh)}.scene{padding-inline:35px}}
@media(max-height:740px){.scene{padding-top:57px;padding-bottom:82px}.resting-butterfly{width:100px;height:76px;margin-bottom:12px}.name-content{padding-top:9px}.names{font-size:90px;margin:21px 0 15px}.names i{font-size:27px;line-height:1.2}.fine-ornament{margin:18px auto}.inviting-copy{font-size:17px}.small-date{margin-top:21px}.date-heading{margin-top:18px}.day{font-size:83px}.weekday{font-size:33px}.month{font-size:29px}.arrival{padding:14px 0 12px;margin-top:19px}.arrival strong{font-size:29px;line-height:1.4}.countdown-block{margin-top:21px}.soft-copy{margin-top:21px;font-size:14px}.venue-ornament{margin:14px auto;width:73px;height:36px}.venue-title{font-size:36px}.venue-title em{font-size:48px}.map-button{margin-top:25px;padding:14px}.closing{margin-top:24px}.signature{font-size:39px}.envelope-heading{top:16%}.seal-button{width:139px;height:139px}}
@media(max-height:610px){.scene{padding:53px 23px 77px}.eyebrow{font-size:8px}.resting-butterfly{width:70px;height:57px;margin-bottom:6px}.names{font-size:73px;margin:15px 0 11px}.names i{font-size:23px;line-height:1.15}.fine-ornament{margin:13px auto}.inviting-copy{font-size:15px;line-height:1.4}.small-date{margin-top:17px;font-size:8px}.date-content{padding-top:0}.date-heading{margin-top:12px}.day{font-size:69px;margin-top:3px}.weekday{font-size:30px}.month{font-size:26px}.arrival{margin-top:13px;padding:10px 0 9px}.arrival>span{font-size:8px}.arrival strong{font-size:26px;margin-top:3px}.arrival small{font-size:11px}.countdown-block{margin-top:17px}.countdown{margin-top:9px}.countdown strong{font-size:24px}.soft-copy{margin-top:16px;font-size:12px}.venue-ornament{height:26px;margin:10px auto}.venue-title{font-size:32px}.venue-title>span{font-size:16px;margin-bottom:9px}.venue-title em{font-size:41px;margin-top:6px}.location{font-size:16px;margin-top:9px}.venue-reminder{font-size:12px;margin-top:12px}.map-button{margin-top:19px;padding:12px}.map-button>span{font-size:14px}.closing{font-size:14px;margin-top:20px}.signature{font-size:35px}.scene-nav{min-height:72px;padding-top:6px;padding-bottom:12px}.playback-top{top:10px}.envelope-heading>span{font-size:37px}.envelope-caption small{font-size:16px}.seal-button{width:126px;height:126px}.envelope-caption p{font-size:7px;letter-spacing:.18em}}
@media(max-width:350px){.scene{padding-inline:18px}.scene-nav{padding-inline:12px;gap:5px}.steps{gap:8px}.venue-content>.eyebrow{font-size:8px}.venue-title{font-size:32px}.inviting-copy{font-size:15px}}
@media(orientation:landscape) and (max-height:520px){.stage{max-width:100%;width:100%}.scene{padding:42px 25px 69px}.scene-content{max-width:660px}.ivory-ground{background-size:cover;background-position:center}.resting-butterfly{position:absolute;left:9%;top:24%;width:105px;height:85px}.name-content{padding:0 0 0 60px}.names{font-size:67px;margin:12px 0;display:flex;align-items:center;justify-content:center;gap:16px}.names>span:first-child,.names>span:last-child{padding:0}.names i{font-size:29px}.names>span:last-child{font-size:1em}.fine-ornament{margin:12px auto}.inviting-copy{font-size:15px}.inviting-copy br{display:none}.small-date{margin-top:14px}.date-content{display:grid;grid-template-columns:1fr 1fr;column-gap:30px;align-items:center}.date-content>.eyebrow{grid-column:1/-1}.date-heading{grid-row:2/4;margin:6px 0}.day{font-size:76px}.arrival{margin:12px auto 0;padding:9px 0}.countdown-block{margin-top:15px}.countdown strong{font-size:24px}.countdown-label{font-size:7px}.countdown>div{width:60px}.soft-copy{grid-column:1/-1;margin-top:13px}.venue-content{display:grid;grid-template-columns:1fr 1fr;column-gap:20px;align-items:center}.venue-content>.eyebrow{grid-column:1/-1;margin-bottom:10px}.venue-ornament{display:none}.venue-title{grid-column:1;grid-row:2/6;font-size:33px}.venue-title em{font-size:43px}.venue-title>span{font-size:15px}.location{grid-column:2;margin:5px 0;font-size:14px}.venue-reminder{grid-column:2;margin:4px 0}.map-button{grid-column:2;margin-top:12px;padding:12px}.map-caption{grid-column:2}.closing{grid-column:1/-1;margin-top:18px;font-size:13px}.signature{grid-column:1/-1;font-size:29px;line-height:1.1;margin:4px 0 0}.envelope-heading{top:12%}.envelope-heading>span{font-size:33px}.envelope-caption{top:77%}.envelope-caption .tiny-rule{display:none}.seal-button{width:108px;height:108px}.envelope-caption small{margin-top:7px}}
@media(prefers-reduced-motion:reduce){:root{--fade:250ms}.stage *{animation-duration:.01ms!important;animation-delay:0ms!important;transition-duration:.15s!important;transition-delay:0s!important}.flight{display:none}.entrance{transform:none}}

.ivory-ground{transform:scale(1.016);animation:paper-breath 30s ease-in-out infinite alternate}
@keyframes paper-breath{to{transform:scale(1.033) translateY(-2px)}}

.soft-copy{max-width:230px;margin-left:auto;margin-right:auto}
@media(orientation:landscape) and (max-height:520px){.soft-copy{max-width:none}}
