@font-face{font-family:Airthay;src:url('assets/a7bc646ab62ba9a2-s.p.woff2')}@font-face{font-family:Quattro;src:url('assets/b79a6faa8c663794-s.p.woff2')}@font-face{font-family:Quattro;src:url('assets/3aa8a054af396297-s.p.woff2');font-weight:700}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#aaa;color:#252525;font-family:Quattro,Georgia,serif}body.sealed{overflow:hidden}button,a,input,select{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}a{color:inherit}button:focus-visible,a:focus-visible{outline:3px solid #295c73;outline-offset:5px}main{max-width:450px;margin:auto;background:white;overflow:hidden;box-shadow:0 0 30px #0001}h1,h2,footer p{font-family:Airthay,cursive;font-weight:400}h2{color:#96afc8;font-size:56px;line-height:1.3;margin:10px 0 25px}h3{font-size:20px;font-weight:700;margin:10px 0 24px}p{font-size:17px;line-height:1.6;margin:20px 0}section{padding:60px 30px;position:relative;text-align:center}section+section:before{content:"";position:absolute;top:-1px;left:0;width:100%;height:30px;background:url('assets/divisor-inverse.png') center top/100% 100% no-repeat;pointer-events:none}.blue{background:#96afc8}.blue h2{color:#fff}.hero{padding:36px 0 70px}.monogram{position:relative;width:300px;height:300px;margin:auto;display:grid;place-items:center}.ring{position:absolute;width:100%;height:100%;object-fit:contain}.monogram h1{font-size:53px;line-height:.95;color:#9eb3c4;text-align:center;z-index:1;margin:0}.monogram h1 span{font-family:Quattro,serif;font-size:34px;line-height:1.6}.leaf{position:absolute;width:125px;z-index:2;pointer-events:none}.leaf-one{top:0;left:-8px}.leaf-two{bottom:0;right:-8px}.cover{position:relative}.cover>img{width:100%;display:block;filter:grayscale(1)}.torn:before,.torn:after{content:"";position:absolute;z-index:1;left:0;width:100%;height:35px;background:url('assets/divisor-line-inverse.png') center/100% 100%}.torn:before{top:-1px}.torn:after{bottom:-1px;transform:rotate(180deg)}.intro{padding-top:45px}.smallcaps{letter-spacing:3px;text-transform:uppercase;font-size:20px}.date{font-size:29px;letter-spacing:4px;color:#819eb9}.quote{font-size:22px}.sprig{width:100px;height:90px;object-fit:contain;margin:10px auto}.venue{width:100%;max-height:260px;object-fit:cover;border-radius:48% 48% 2px 2px}.time{font-size:23px}.icon-link{border:0;background:none;text-decoration:none;display:flex;align-items:center;flex-direction:column;gap:10px;font-size:14px;margin:25px auto 0;color:inherit}.icon-link img{height:45px;width:45px;object-fit:contain}.icon{height:80px;width:90px;object-fit:contain;margin:14px auto}.corner{position:absolute;top:0;left:-45px;width:110px;pointer-events:none}.dress h2{font-size:49px}.timeline{list-style:none;padding:0;margin:25px auto 0;max-width:280px;text-align:left}.timeline li{display:flex;gap:30px;align-items:center;padding:15px 0;position:relative}.timeline img{height:65px;width:65px;object-fit:contain}.timeline li div{display:flex;flex-direction:column;gap:7px}.timeline time{font-size:21px}.gallery{height:470px;position:relative;background:#e7edf2}.gallery>img{width:100%;height:100%;object-fit:cover}.gallery button{position:absolute;top:45%;background:#ffffffbd;border:0;border-radius:50%;width:38px;height:38px;font-size:28px}.gallery #prev{left:15px}.gallery #next{right:15px}#photo-count{position:absolute;bottom:15px;left:50%;transform:translateX(-50%);background:#0006;color:white;border-radius:20px;padding:5px 15px;font-size:13px}.account{border:1px solid #ffffff90;background:#ffffff30;padding:20px 12px;border-radius:5px;line-height:1.8;width:100%;font-size:16px}.account strong{font-size:21px;letter-spacing:1px}.account span{display:block;font-size:12px}.countdown{display:flex;justify-content:center;gap:20px;margin-top:25px}.countdown strong{display:block;font-size:29px;font-weight:400}.countdown span{font-size:12px}.qr{display:block;width:144px;background:white;padding:12px;margin:30px auto}.qr img{width:120px;height:120px;display:block}footer{text-align:center;padding:25px 20px 55px}footer p{font-size:43px;color:#96afc8;margin:8px}footer span{font-size:14px;letter-spacing:3px}.envelope{position:fixed;top:0;bottom:0;left:50%;transform:translateX(-50%);width:min(450px,100%);height:100dvh;min-height:500px;border:0;padding:0;background:#bbd7e8;z-index:10;overflow:hidden;color:#35444c;transition:transform 1.1s ease,opacity .9s}.envelope.opened{transform:translate(-50%,-110%);opacity:0;pointer-events:none}.env-back{position:absolute;inset:0;background:linear-gradient(42deg,transparent 49.7%,#8ba3b1 50%,transparent 50.3%),linear-gradient(-42deg,transparent 49.7%,#8ba3b1 50%,transparent 50.3%)}.flap{position:absolute;inset:0 0 45%;background:#bbd7e8;clip-path:polygon(0 0,100% 0,100% 42%,50% 100%,0 42%);filter:drop-shadow(0 5px 3px #0003)}.sender{position:absolute;top:8%;width:100%;left:0;font-family:Airthay,cursive;font-size:55px;line-height:1.25}.stamp{position:absolute;width:115px;top:44%;left:50%;transform:translateX(-50%);filter:drop-shadow(0 3px 3px #0004)}.open-hint{position:absolute;top:78%;width:100%;left:0;font-size:17px;line-height:1.4}.music{position:fixed;bottom:20px;right:max(20px,calc((100vw - 450px)/2 + 20px));border:0;width:42px;height:42px;border-radius:50%;background:#555a;color:#fff;font-size:24px;z-index:3}#player{position:fixed;width:1px;height:1px;overflow:hidden;left:-100px}dialog{border:0;border-radius:12px;padding:30px;width:min(420px,calc(100% - 28px));max-height:90dvh;box-shadow:0 20px 80px #0005}dialog::backdrop{background:#0008}dialog h2{font-size:41px;margin:0 0 22px}dialog label{display:block;font-size:15px;margin:16px 0 0}dialog input:not([type=radio]),dialog select{display:block;width:100%;padding:11px;border:1px solid #b8c7d0;border-radius:4px;font:inherit;margin-top:7px}fieldset{border:0;padding:0;display:flex;gap:28px}fieldset label{display:inline-block}legend{font-size:16px;margin-bottom:8px}.close{position:absolute;right:10px;top:6px;border:0;background:none;font-size:29px}.submit{width:100%;padding:14px;border:0;background:#64859d;color:white;border-radius:4px}.form-note{font-size:13px;line-height:1.5}#form-status{font-size:14px}@media(max-width:360px){h2{font-size:45px}.monogram{width:270px;height:270px}.countdown{gap:15px}section{padding-left:22px;padding-right:22px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.envelope{transition:none}}
.swatches{display:flex;justify-content:center;align-items:center;gap:8px;margin:8px auto 0}.swatches span{display:block;width:24px;height:24px;border:1px solid #6d6d6d;border-radius:50%;background:var(--swatch)}#player{position:static;left:auto;width:100%;height:auto;overflow:visible}#player:empty{display:none}#player iframe{display:block;border:0;width:100%;height:220px}#wedding-audio{width:100%;margin:14px 0}.audio-picker{display:block;padding:12px;background:#edf2f6;border-radius:5px}.audio-picker input{max-width:100%}.youtube-link{display:inline-block;margin-top:8px}
/* Botanical movement and the original handwritten introduction. */
@font-face{font-family:Parisienne;src:url('assets/853cd61280ac34e1-s.p.ttf') format('truetype');font-display:swap}
.intro{padding:42px 20px 44px;background:#fff}
.intro .smallcaps{font-size:23px;letter-spacing:0;margin:10px 0 0}
.intro .date{color:#414141;font-size:22px;letter-spacing:3px;margin:0 0 35px}
.quote-sprig{height:76px;display:flex;justify-content:flex-end;margin:0 -20px 12px 0;transform:translateX(20px) rotate(-40deg)}
.quote-sprig img{width:118px;height:88px;object-fit:contain;transform-origin:100% 55%;animation:branch-breeze 5s ease-in-out infinite}
.intro .quote,.vow-band .quote{font-family:Parisienne,cursive;font-weight:400;font-size:30px;line-height:1.2;margin:14px 0 0}
.intro .quote{max-width:410px;margin-left:auto;margin-right:auto}
.vow-band{background:#93b4d4;color:#fff;padding:108px 22px 110px;isolation:isolate}
.vow-band:before,.vow-band:after{content:"";position:absolute;left:0;width:100%;height:90px;background:url('assets/divisor-inverse.png') center/100% 100% no-repeat;pointer-events:none;z-index:-1}
.vow-band:before{top:-1px}
.vow-band:after{bottom:-1px;transform:rotate(180deg)}
.vow-band+section:before{display:none}
.vow-band .quote{margin:0}
.leaf,.corner,footer .sprig,section>.sprig{transform-origin:65% 80%;animation:botanical-sway 6s ease-in-out infinite}
.leaf-two{animation-delay:-2.5s;animation-duration:7s}
.corner{animation-delay:-1.8s}
footer .sprig,section>.sprig{animation-delay:-3s}
.ring{animation:ring-breathe 9s ease-in-out infinite}
.motion-ready .reveal{opacity:0;translate:0 22px;transition:opacity 1.1s ease,translate 1.1s cubic-bezier(.2,.65,.25,1);transition-delay:var(--reveal-delay,0ms)}
.motion-ready .reveal.is-visible{opacity:1;translate:0 0}
@keyframes branch-breeze{0%,100%{transform:rotate(-3deg) translate(0,0)}25%{transform:rotate(3deg) translate(2px,-3px)}50%{transform:rotate(-1deg) translate(-2px,2px)}75%{transform:rotate(2deg) translate(1px,-1px)}}
@keyframes botanical-sway{0%,100%{transform:rotate(-2deg) translateY(0)}50%{transform:rotate(3deg) translateY(-4px)}}
@keyframes ring-breathe{0%,100%{transform:rotate(-1deg) scale(1)}50%{transform:rotate(1deg) scale(1.015)}}
@media(max-width:360px){.intro .date{font-size:20px;letter-spacing:2px}.intro .quote,.vow-band .quote{font-size:29px}}
@media(prefers-reduced-motion:reduce){.leaf,.corner,footer .sprig,section>.sprig,.quote-sprig img,.ring{animation:none}.motion-ready .reveal{opacity:1;translate:none;transition:none}}