:root{--paper:#e9e3e9;--ink:#65576b;--quiet:#8e7f91;--shadow:#af9fb1;--ease:cubic-bezier(.22,1,.36,1);--cover-art:url('assets/sculpted-envelope.png');--paper-art:url('assets/sculpted-paper.png')}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-snap-type:y proximity;background:#d5cbd7}body{margin:0;color:var(--ink);font-family:'Cormorant Garamond',Georgia,serif;overflow:hidden}button,a{-webkit-tap-highlight-color:transparent;touch-action:manipulation}button{font:inherit;color:inherit;cursor:pointer}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible{outline:1px solid #78617f;outline-offset:6px}button{border:0}.ambient{position:fixed;inset:0;background:radial-gradient(ellipse at 20% 18%,#f0eaf2,transparent 55%),radial-gradient(ellipse at 82% 83%,#b7a8be,transparent 55%),#d4c9d7;z-index:-1}.ambient:after{content:'';position:absolute;inset:0;background:url('assets/paper-grain.png');opacity:.22}.suite{position:relative;width:min(100%,620px);margin:0 auto;background:var(--paper);box-shadow:0 0 100px #58415f29;isolation:isolate}.desktop-wordmark{position:fixed;left:calc((100vw - 620px)/4);top:43%;transform:translateX(-50%);text-align:center;color:#8a7591;text-shadow:0 1px 0 #ffffffbb;font-family:'Pinyon Script',cursive;font-size:65px;letter-spacing:-10px}.desktop-wordmark i{font-size:35px;font-weight:400;position:relative;top:13px;padding:0 7px}.desktop-wordmark small{display:block;font:6px 'DM Sans',sans-serif;letter-spacing:3px;margin-top:25px}.desktop-caption{position:fixed;right:calc((100vw - 620px)/4);bottom:11%;transform:translateX(50%);font:7px/2.1 'DM Sans',sans-serif;letter-spacing:3px;color:#89738f}.light{position:fixed;top:0;bottom:0;left:50%;transform:translateX(-50%);width:min(100vw,620px);background:radial-gradient(ellipse at var(--lx,25%) var(--ly,10%),#fff7,transparent 65%);opacity:.18;mix-blend-mode:soft-light;pointer-events:none;z-index:15}.page{height:100svh;min-height:660px;position:relative;scroll-snap-align:start;display:grid;place-items:center;overflow:hidden;background:var(--paper)}.relief{position:absolute;inset:0;background-image:var(--paper-art);background-size:100% 100%;background-position:center;pointer-events:none}.letter .relief{transform:rotate(180deg)}.card-content{position:relative;z-index:2;width:70%;margin:0 auto;text-align:center;padding:15px 0 30px;opacity:0;transform:translateY(12px);transition:opacity 1.5s var(--ease),transform 1.5s var(--ease)}.page.in-view .card-content{opacity:1;transform:none}.tiny{font:6px/2 'DM Sans',sans-serif;font-weight:400;letter-spacing:2.6px;margin:0 0 25px;color:#88768d}.introduction{font:italic 19px/1.45 'Cormorant Garamond',serif;margin:0 0 26px;color:#8b7a90}.couple{font:400 clamp(78px,18vw,112px)/1.04 'Pinyon Script',cursive;margin:0;color:#736179;text-shadow:0 1px 0 #ffffffe0,0 -1px 0 #a58faa60;display:flex;flex-direction:column}.couple>span{display:block;padding-right:12px}.couple i{font:400 48px/1.15 'Pinyon Script',cursive;margin:3px 0 7px;color:#9a879e}.ornament{color:#a18ba5;font-size:30px;line-height:1;margin:22px 0 16px;text-shadow:0 1px #fff}.formal{font:italic 20px/1.4 'Cormorant Garamond',serif;color:#8b7891;margin:0}.wedding-caption{font:5px 'DM Sans',sans-serif;letter-spacing:3px;color:#9c8a9f;margin:23px 0 0}.turn{position:absolute;bottom:8.2%;left:50%;transform:translateX(-50%);z-index:3;display:flex;align-items:center;flex-direction:column;gap:12px;color:#a08ba4}.turn span{font:5px 'DM Sans',sans-serif;letter-spacing:2.4px}.turn i{font-style:normal;font-size:19px;animation:breath 3s infinite}.page-number{position:absolute;bottom:3.2%;left:0;right:0;text-align:center;font-size:8px;letter-spacing:2px;color:#a995ad;z-index:2}.script{font-family:'Pinyon Script',cursive;font-weight:400}.salutation{font-size:49px;margin:0 0 20px;text-shadow:0 1px #fff}.letter .card-content{width:68%;padding-bottom:20px}.letter .tiny{margin-bottom:31px;font-size:5px;letter-spacing:2px}.letter-lead{font-size:29px;line-height:1.2;letter-spacing:-.4px;margin:0 0 25px}.letter-lead em{font-weight:400;color:#917c98}.body-copy{font:400 17px/1.7 'Cormorant Garamond',serif;color:#8a798e;margin:0 0 20px}.signature{font-size:26px;line-height:1.5;color:#917999;margin:25px 0 0}.signature span{font-size:32px}.cameo{margin:10px auto 30px;width:78px;height:100px;border:1px solid #ac97b066;border-radius:50%;box-shadow:inset 0 1px 2px #fff,0 1px 1px #fff,inset 0 -2px 4px #b9a8bd55;display:flex;align-items:center;justify-content:center;position:relative;font-family:'Pinyon Script',cursive;font-size:41px;color:#a28aa9;letter-spacing:-10px;padding-right:9px;text-shadow:0 1px #fff,0 -1px #a28aa955}.cameo:after{content:'';position:absolute;inset:5px;border:1px solid #b4a0ba55;border-radius:inherit}.cameo i{font-size:20px;font-weight:400;padding:0 3px;position:relative;top:8px}.occasion-title{font-size:45px;line-height:1.14;margin:0 0 23px}.occasion .tiny{font-size:5px;letter-spacing:2px;margin-bottom:26px}.occasion .body-copy{font-size:16px;margin-bottom:28px}.details{width:88%;margin:0 auto 23px}.details>div{border-bottom:1px solid #b39bb738;padding:13px 0;display:flex;justify-content:space-between;gap:8px;align-items:center}.details>div:first-child{border-top:1px solid #b39bb738}.details dt{font-size:17px}.details dd{font-size:15px;font-style:italic;color:#9b86a1;margin:0;text-align:right}.fine-note{font:italic 12px/1.6 'Cormorant Garamond',serif;color:#a18da7;margin:0}.closing-seal{width:135px;height:135px;object-fit:contain;margin:8px auto 28px;display:block}.closing-line{font:400 35px/1.2 'Cormorant Garamond',serif;letter-spacing:-.5px;margin:0 0 24px}.closing-line em{font-weight:400;color:#927a9b}.farewell .tiny{font-size:5px;letter-spacing:1.9px;margin-bottom:20px}.farewell .body-copy{font-size:16px}.farewell-names{font-size:39px;line-height:1.5;color:#93769c;margin:20px 0}.paper-button{font:5px 'DM Sans',sans-serif;letter-spacing:1.8px;background:transparent;border-bottom:1px solid #a68cab66;padding:14px 8px;color:#8a6f94;min-height:42px}.paper-button span{margin-left:15px}.quiet-button{font:italic 14px 'Cormorant Garamond',serif;color:#a28ca8;background:none;padding:13px 10px;margin-top:11px}#shareStatus{margin-top:10px;min-height:16px}.last-folio{font:5px 'DM Sans',sans-serif;letter-spacing:3px;bottom:4%}.cover{position:fixed;top:0;bottom:0;left:50%;transform:translateX(-50%);width:min(100vw,620px);z-index:10;perspective:1400px;isolation:isolate;overflow:hidden}.cover-back{position:absolute;inset:0;background:var(--cover-art) center/100% 100%;transition:opacity .2s 1.1s}.panel{position:absolute;inset:0;background:var(--cover-art) center/100% 100%;backface-visibility:hidden;will-change:transform;transition:transform 2.2s var(--ease),opacity 1.8s var(--ease)}.panel-bottom{clip-path:polygon(0 100%,50% 49%,100% 100%);transform-origin:center bottom;z-index:2;transition-delay:.95s}.panel-left{clip-path:polygon(0 0,50% 49%,0 100%);transform-origin:left center;z-index:3;transition-delay:.7s}.panel-right{clip-path:polygon(100% 0,50% 49%,100% 100%);transform-origin:right center;z-index:3;transition-delay:.8s}.flap-wrap{position:absolute;inset:0;transform-style:preserve-3d;transform-origin:center top;z-index:4;transition:transform 2s cubic-bezier(.4,0,.15,1) .35s}.panel-flap{clip-path:polygon(0 0,100% 0,50% 49%);z-index:1}.flap-lining{position:absolute;inset:0;background:linear-gradient(135deg,#d0c0d3,#eee6f0);clip-path:polygon(0 0,100% 0,50% 49%);transform:rotateY(180deg);backface-visibility:hidden}.cover-vellum{position:absolute;inset:0;z-index:5;background:radial-gradient(ellipse at 25% 10%,#fff2,transparent 60%);pointer-events:none;transition:opacity .6s}.cover-top{position:absolute;top:9%;width:100%;text-align:center;z-index:6;transition:opacity .6s}.cover-top .tiny{font-size:5px;letter-spacing:2px;color:#9c88a3;text-shadow:0 1px #fff7}.seal{position:absolute;top:49%;left:50%;transform:translate(-50%,-50%);width:34%;aspect-ratio:1;background:none;border:0;padding:0;z-index:8;isolation:isolate;outline-offset:-15px!important}.seal img{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:contain;transition:transform 1.3s var(--ease),opacity 1.1s var(--ease),filter .7s;pointer-events:none}.seal-whole{z-index:2}.seal-fragment{z-index:3;opacity:0;clip-path:polygon(52% 0,46% 24%,53% 42%,45% 61%,53% 77%,47% 100%,100% 100%,100% 0)}.seal-glow{position:absolute;inset:15%;border-radius:50%;box-shadow:0 0 30px #fff8;opacity:0;transition:opacity .6s}.seal:hover .seal-whole{transform:scale(1.045) rotate(-3deg)}.seal:hover .seal-glow{opacity:1}.seal:active .seal-whole{transform:scale(.98)}.seal-outline{position:absolute;inset:10%;border:1px solid #ffffff66;border-radius:50%;animation:seal-breathe 4s 2s infinite;pointer-events:none;opacity:0}.cover-address{position:absolute;top:66%;left:10%;width:80%;text-align:center;z-index:6;transition:opacity .6s,transform 1.5s var(--ease)}.addressed{font-size:26px;color:#a18ca7;margin:0 0 18px;text-shadow:0 1px #fff8}.cover-address .tiny{font-size:5px;letter-spacing:2.5px;margin-bottom:10px;color:#a48fa9}.cover-names{font-size:44px;color:#8c7396;text-shadow:0 1px #ffffffe6,0 -1px #90789955;margin:0}.cover-instruction{position:absolute;left:0;right:0;bottom:6%;text-align:center;z-index:6;color:#96829e;transition:opacity .5s}.instruction-line{display:block;width:1px;height:25px;background:linear-gradient(transparent,#a78dae77);margin:0 auto 15px}.cover-instruction>p{font:5px 'DM Sans',sans-serif;letter-spacing:2.8px;margin:0 0 9px}.sound-invitation{font:italic 13px 'Cormorant Garamond',serif;color:#ac98b1}.opening .cover{pointer-events:none}.opening .seal-whole{clip-path:polygon(0 0,52% 0,46% 24%,53% 42%,45% 61%,53% 77%,47% 100%,0 100%);transform:translate(-22%,-8%) rotate(-17deg);opacity:0}.opening .seal-fragment{animation:break-seal 1.3s var(--ease) both}.opening .seal-outline{animation:none;opacity:0}.opening .flap-wrap{transform:rotateX(160deg) translateY(-12%)}.opening .panel-left{transform:perspective(1200px) rotateY(-100deg) translateX(-8%);opacity:0}.opening .panel-right{transform:perspective(1200px) rotateY(100deg) translateX(8%);opacity:0}.opening .panel-bottom{transform:rotateX(-100deg) translateY(25%);opacity:0}.opening .cover-back{opacity:0}.opening .cover-vellum,.opening .cover-top,.opening .cover-address,.opening .cover-instruction{opacity:0}.opening .cover-address{transform:translateY(35px)}.opening .seal-glow{opacity:0}.opened{overflow:auto}.opened .cover{display:none}.page-nav{position:fixed;top:50%;right:max(calc((100vw - 620px)/2 + 17px),17px);transform:translateY(-50%);z-index:16;display:flex;flex-direction:column;gap:13px}.page-nav[hidden]{display:none}.page-nav a{display:block;width:4px;height:4px;border:1px solid #927b9d99;border-radius:50%;position:relative}.page-nav a:before{content:'';position:absolute;inset:-7px}.page-nav a[aria-current=true]{background:#927b9d;box-shadow:0 0 0 3px #c4b4ca55}.controls{position:fixed;bottom:max(15px,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);width:min(100vw,620px);padding:0 20px;display:flex;align-items:center;justify-content:space-between;z-index:20;pointer-events:none}.controls button{pointer-events:auto}.sound{display:flex;align-items:center;gap:8px;border:1px solid #9b83a533;border-radius:40px;padding:10px 12px;font:6px 'DM Sans',sans-serif;letter-spacing:.8px;color:#8d7697;background:#eee8eece;min-height:33px}.bars{display:flex;height:11px;gap:2px;align-items:center;width:13px}.bars i{width:1px;height:3px;background:#a68cae}.sound[aria-pressed=true] .bars i{animation:bars 1s ease-in-out infinite alternate}.bars i:nth-child(2){animation-delay:-.5s}.bars i:nth-child(3){animation-delay:-.2s}.bars i:nth-child(4){animation-delay:-.8s}.credit-button{font-size:21px;background:#eee8ee88;color:#ad97b5;border-radius:50%;height:33px;width:33px}.opening .dedication .card-content{transition-delay:.9s}.dedication .card-content{padding-top:0}.page:before{content:'';position:absolute;inset:0;box-shadow:inset 0 0 20px #ad99b315;pointer-events:none;z-index:1}dialog{border:1px solid #baa6c2;background:#eee6ef;color:#7c6787;width:min(90%,430px);padding:42px 30px;box-shadow:0 20px 100px #55406044}dialog::backdrop{background:#5c466566}dialog h2{font-size:37px;margin:0 0 23px}dialog p{font:16px/1.6 'Cormorant Garamond',serif}dialog a{text-decoration:underline}#closeCredits{position:absolute;right:12px;top:9px;background:none;font-size:25px;color:#9d83a7}.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}.no-script{position:fixed;inset:0;background:var(--paper);padding:30vh 15%;z-index:50;font-size:25px;text-align:center}@keyframes breath{50%{transform:translateY(5px);opacity:.5}}@keyframes bars{to{height:11px}}@keyframes seal-breathe{0%{opacity:0;transform:scale(.9)}30%{opacity:.7}100%{opacity:0;transform:scale(1.25)}}@keyframes break-seal{from{opacity:1;transform:scale(1)}to{opacity:0;transform:translate(30%,12%) rotate(23deg) scale(1.06)}}
@media(min-width:1000px){.suite,.cover,.light,.controls{max-width:600px}.cover,.light,.controls{width:600px}.page-nav{right:calc((100vw - 600px)/2 + 17px)}.couple{font-size:110px}.cover-names{font-size:51px}.cover-instruction{bottom:7%}.page .card-content{width:69%}}@media(max-width:900px){.desktop-wordmark,.desktop-caption{display:none}}@media(max-width:480px){.suite,.cover,.light,.controls{width:100%;max-width:none}.page{min-height:650px}.card-content{width:72%;padding-bottom:25px}.tiny{font-size:5px;letter-spacing:1.7px;margin-bottom:23px}.introduction{font-size:17px;margin-bottom:24px}.couple{font-size:88px}.couple i{font-size:43px;line-height:1.1}.formal{font-size:18px}.wedding-caption{font-size:4px;letter-spacing:2px;margin-top:20px}.ornament{font-size:25px;margin-top:20px;margin-bottom:13px}.cover-names{font-size:39px}.addressed{font-size:24px;margin-bottom:16px}.cover-instruction>p{font-size:5px;letter-spacing:2.3px}.cover-top .tiny{font-size:4px;letter-spacing:1.4px}.seal{width:38%}.letter .card-content{width:69%}.letter .tiny{font-size:4px;letter-spacing:1.8px;margin-bottom:27px}.salutation{font-size:43px}.letter-lead{font-size:26px}.body-copy{font-size:16px;line-height:1.65;margin-bottom:18px}.signature{font-size:24px;margin-top:22px}.signature span{font-size:30px}.occasion-title{font-size:40px}.occasion .tiny{font-size:4px;letter-spacing:1.6px}.cameo{width:65px;height:85px;margin-bottom:26px;font-size:36px}.occasion .body-copy{font-size:15px}.details{width:92%}.details dt{font-size:16px}.details dd{font-size:14px}.fine-note{font-size:11px}.closing-seal{width:115px;height:115px;margin-bottom:27px}.closing-line{font-size:29px}.farewell .tiny{font-size:4px;letter-spacing:1.5px}.farewell-names{font-size:34px}.farewell .body-copy{font-size:15px}.page-nav{right:12px}.turn{bottom:8.7%}.page-number{bottom:4.5%}.controls{padding:0 13px}.controls .sound{font-size:5px;padding:9px 10px}.last-folio{bottom:5%}}@media(max-height:730px){.page{min-height:100svh}.card-content{transform:scale(.9);padding:0}.page.in-view .card-content{transform:scale(.9)}.couple{font-size:83px}.tiny{margin-bottom:17px}.introduction{margin-bottom:18px}.couple i{font-size:35px;margin:0}.ornament{margin:13px 0}.formal{font-size:17px}.wedding-caption{margin-top:15px}.turn{bottom:7.5%;gap:7px}.turn span{font-size:4px}.turn i{font-size:16px}.cover-names{font-size:35px}.addressed{font-size:22px;margin-bottom:10px}.cover-address .tiny{margin-bottom:6px}.cover-instruction{bottom:7.5%}.instruction-line{height:15px;margin-bottom:10px}.cover-instruction>p{font-size:4px}.sound-invitation{font-size:11px}.letter .tiny{margin-bottom:20px}.salutation{font-size:38px;margin-bottom:15px}.letter-lead{font-size:25px;margin-bottom:18px}.body-copy{font-size:15px;line-height:1.5;margin-bottom:15px}.signature{margin-top:17px;font-size:22px}.signature span{font-size:27px}.cameo{height:68px;width:54px;margin:0 auto 16px;font-size:31px}.occasion-title{font-size:34px;margin-bottom:18px}.occasion .body-copy{margin-bottom:20px}.details>div{padding:11px 0}.details{margin-bottom:15px}.occasion .tiny{margin-bottom:19px}.closing-seal{width:95px;height:95px;margin:5px auto 20px}.closing-line{font-size:28px;margin-bottom:18px}.farewell-names{font-size:32px;margin:17px 0}.quiet-button{margin-top:4px}.paper-button{padding:10px 5px}.farewell .tiny{margin-bottom:12px}}@media(max-height:550px){.card-content{scale:.78}.cover-names{font-size:29px}.cover-address .tiny{font-size:4px}.addressed{font-size:19px;margin-bottom:6px}.cover-instruction{bottom:9%}.sound-invitation{display:none}.instruction-line{display:none}.seal{width:28%}.page-nav{gap:12px}.controls{bottom:10px}.turn{bottom:8%}.page-number{bottom:3%}}
.seal{top:61%}.cover-top{top:27%}.cover-address{top:75%}.panel-bottom{clip-path:polygon(0 100%,50% 62%,100% 100%)}.panel-left{clip-path:polygon(0 36.5%,50% 62%,0 100%)}.panel-right{clip-path:polygon(100% 36.5%,50% 62%,100% 100%)}.panel-flap,.flap-lining{clip-path:polygon(0 0,100% 0,100% 36.5%,50% 62%,0 36.5%)}
:root{--suite-width:min(100vw,calc(100svh * .69),600px)}.suite,.cover,.light,.controls{width:var(--suite-width);max-width:none}.page-nav{right:calc((100vw - var(--suite-width))/2 + 12px)}
.couple{font-size:clamp(62px,calc(var(--suite-width) * .20),110px)}.cover-names{font-size:clamp(27px,calc(var(--suite-width) * .10),51px)}.tiny,.letter .tiny,.occasion .tiny,.farewell .tiny{font-size:7px;letter-spacing:1.7px}.cover-top .tiny,.cover-address .tiny{font-size:6px;letter-spacing:1.6px}.cover-instruction>p{font-size:6px;letter-spacing:1.7px}
.page{grid-template-rows:minmax(0,1fr)}.letter-lead{font-size:clamp(20px,calc(var(--suite-width) * .064),29px)}
@media(max-height:550px){.letter .card-content{width:74%}.letter .tiny{margin-bottom:12px;font-size:6px}.salutation{font-size:31px;margin-bottom:12px}.letter-lead{font-size:21px;line-height:1.12;margin-bottom:15px}.letter .body-copy{font-size:13px;line-height:1.4;margin-bottom:12px}.signature{font-size:19px;margin-top:12px}.signature span{font-size:25px}}
.ribbon-stage{position:absolute;inset:0;z-index:9;pointer-events:none}.ribbon-band{position:absolute;top:61%;height:5.3%;margin-top:-2.65%;width:52%;background:linear-gradient(0deg,#ac8fae,#d1bcd2 5%,#bba0bd 13%,#d5c0d6 25%,#f0e1ef 40%,#cfb8d1 55%,#b79aba 80%,#d9c6db 94%,#9f7ba5);box-shadow:0 4px 5px #6b4d7222,inset 0 1px #fff7,inset 0 -1px #8e6b9644;transition:transform 1.6s var(--ease) .15s,opacity 1.2s .25s}.band-left{left:0;transform-origin:left center}.band-right{right:0;transform-origin:right center}.ribbon-bow{position:absolute;left:50%;top:61%;transform:translate(-50%,-50%);width:74%;aspect-ratio:1;background:none;border:0;padding:0;pointer-events:auto;outline-offset:-30px!important}.ribbon-bow img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;pointer-events:none;transition:transform 1.4s var(--ease),opacity 1.05s .3s}.bow-left{clip-path:polygon(0 0,51% 0,49% 100%,0 100%)}.bow-right{clip-path:polygon(49% 0,100% 0,100% 100%,51% 100%)}.ribbon-bow:hover img{filter:brightness(1.04)}.ribbon-touch{position:absolute;left:43%;top:43%;width:14%;height:14%;border:1px solid #f7eaf577;border-radius:50%;animation:seal-breathe 4s infinite;opacity:0;pointer-events:none}.ribbon-salutation{position:absolute;top:35%;left:5%;right:5%;text-align:center;font-size:clamp(28px,calc(var(--suite-width) * .10),47px);color:#917999;text-shadow:0 1px #fff9;margin:0;z-index:6;transition:opacity .7s}.cover:not([aria-hidden=true]) .cover-address{opacity:0;transition:opacity 1s}.cover .seal{opacity:0;transition:opacity 1s .6s}.untying .band-left{transform:translateX(-115%) rotate(-5deg);opacity:0}.untying .band-right{transform:translateX(115%) rotate(5deg);opacity:0}.untying .bow-left{transform:translate(-65%,-8%) rotate(-26deg);opacity:0}.untying .bow-right{transform:translate(65%,10%) rotate(27deg);opacity:0}.untying .ribbon-bow{pointer-events:none}.untying .ribbon-touch{animation:none;opacity:0}.untying .ribbon-salutation{opacity:0}.untying .cover .seal{opacity:1}.untying .cover .cover-address{opacity:1;transition-delay:.65s}.ribbon-released .ribbon-stage{display:none}.opening .cover .cover-address{opacity:0;transition-delay:0s}
.ribbon-bow{transform:translate(-50%,-31%)}.ribbon-band{top:63.5%}
.cover .seal{opacity:1;z-index:11;width:22%;transition:none}.seal-whole,.seal-fragment{transition:transform 1.3s var(--ease),opacity 1.1s var(--ease)}.seal-broken .seal-whole{clip-path:polygon(0 0,52% 0,46% 24%,53% 42%,45% 61%,53% 77%,47% 100%,0 100%);transform:translate(-33%,-12%) rotate(-20deg);opacity:0}.seal-broken .seal-fragment{animation:break-seal 1.3s var(--ease) both}.seal-broken .seal-outline{animation:none;opacity:0}.ribbon-bow:disabled{cursor:default}.ribbon-bow:disabled:hover img{filter:none}.seal-broken .cover .seal{pointer-events:none}.untying .cover .seal{opacity:0}.seal-broken .ribbon-touch{animation:seal-breathe 3s infinite}.ribbon-touch{animation:none;opacity:0}.untying .ribbon-touch{animation:none;opacity:0}
/* Each object has its own quiet scene: seal, then ribbon, then paper. */
.ribbon-stage{opacity:0;visibility:hidden;transform:translateY(16px) scale(.975);transition:opacity 2.6s ease,transform 3s var(--ease),visibility 0s 2.6s}.cover .seal{width:33%;transition:opacity 1.6s ease}.seal-whole,.seal-fragment{transition:transform 3.1s cubic-bezier(.2,.6,.2,1),opacity 2.7s ease .25s}.seal-broken .seal-whole{transform:translate(-27%,-10%) rotate(-15deg)}.seal-broken .seal-fragment{animation:slow-seal-part 3.2s cubic-bezier(.2,.6,.2,1) both}.bow-scene .cover .seal{visibility:hidden;opacity:0}.bow-scene .ribbon-stage{opacity:1;visibility:visible;transform:none;transition:opacity 2.6s ease,transform 3s var(--ease),visibility 0s}.ribbon-bow img{transition:transform 4s cubic-bezier(.2,.6,.2,1),opacity 3.7s ease .35s}.ribbon-band{transition:transform 4.1s cubic-bezier(.2,.6,.2,1) .15s,opacity 3.5s ease .4s}.untying .bow-left{transform:translate(-90%,-12%) rotate(-31deg)}.untying .bow-right{transform:translate(90%,14%) rotate(32deg)}.flap-wrap{transition:transform 4.3s cubic-bezier(.3,0,.15,1) .5s}.panel{transition:transform 4.5s cubic-bezier(.2,.6,.2,1),opacity 3.8s ease}.panel-left{transition-delay:.8s}.panel-right{transition-delay:1.15s}.panel-bottom{transition-delay:1.4s}.cover-back{transition:opacity 2s ease 1.4s}.cover-top,.cover-vellum,.cover-address,.cover-instruction{transition:opacity 2.2s ease,transform 2.5s var(--ease)}.card-content{transition:opacity 2.7s ease,transform 3.2s var(--ease)}.opening .dedication .card-content{transition-delay:2s}.untying .cover .cover-address{transition-delay:2.3s}.seal-broken .ribbon-touch{animation:none;opacity:0}.bow-scene:not(.untying) .ribbon-touch{animation:seal-breathe 6s 2s infinite}.cover-instruction>p{transition:opacity 1.2s}.sound[aria-pressed=true] .bars i{animation-duration:1.8s}@keyframes slow-seal-part{0%{opacity:1;transform:none}30%{opacity:1}100%{opacity:0;transform:translate(31%,10%) rotate(18deg)}}
.seal-whole,.seal-fragment{transition:transform 1.05s cubic-bezier(.2,.6,.2,1),opacity .8s ease .1s}.seal-broken .seal-fragment{animation:slow-seal-part 1.05s cubic-bezier(.2,.6,.2,1) both}.bow-scene .ribbon-stage{transition:opacity 1s ease,transform 1.4s var(--ease),visibility 0s}.satin-flow{position:absolute;inset:0;width:100%;height:100%;z-index:5;pointer-events:none;display:none}.satin-flow.running{display:block}.untying .ribbon-bow img,.untying .ribbon-band{visibility:hidden;transition:none;opacity:0}.flap-wrap{transition:transform 2.8s cubic-bezier(.3,0,.15,1) .15s}.panel{transition:transform 2.7s cubic-bezier(.2,.6,.2,1),opacity 2.4s ease}.panel-left{transition-delay:.35s}.panel-right{transition-delay:.55s}.panel-bottom{transition-delay:.75s}.cover-back{transition:opacity 1.3s ease .75s}.cover-top,.cover-vellum,.cover-address,.cover-instruction{transition:opacity 1.3s ease,transform 1.8s var(--ease)}.card-content{transition:opacity 1.7s ease,transform 2s var(--ease)}.opening .dedication .card-content{transition-delay:1s}.untying .cover .cover-address{transition-delay:1.8s}
/* The marriage monogram is one unbroken medallion, through every scene. */
.suite>.seal{position:fixed;left:50%;top:61%;width:calc(var(--suite-width) * .33);transform:translate(-50%,-50%);z-index:25;opacity:1;visibility:visible;transition:none;perspective:700px}.seal-fragment{display:none!important}.seal-whole,.seal-raised .seal-whole,.opening .seal-whole,.seal-broken .seal-whole{clip-path:none!important;opacity:1!important;transform:none!important;animation:none!important}.suite>.seal:before{content:'';position:absolute;inset:-8%;border:1px solid #bda9c577;border-radius:48% 52% 48% 52%;background:linear-gradient(140deg,#f5eef5,#dbcfdf);box-shadow:inset 0 2px 2px #fff9,inset 0 -2px 4px #a28baa55,0 1px 1px #fff8;z-index:-1;opacity:0;transition:opacity .7s ease 1.6s}.seal-raised .suite>.seal{top:9%;width:min(82px,calc(var(--suite-width) * .17));animation:keepsake-lift 2.1s cubic-bezier(.4,0,.2,1) both;pointer-events:none}.seal-raised .suite>.seal:before{opacity:1}.seal-raised .seal-outline,.seal-raised .seal-glow{opacity:0;animation:none}.suite>.seal:after{content:'';position:absolute;inset:9%;border-radius:50%;background:linear-gradient(115deg,transparent 25%,#fff8 48%,transparent 70%);opacity:0;pointer-events:none;transform:translateX(-80%)}.seal-raised .suite>.seal:after{animation:pearl-light 1.25s ease both}.untying .suite>.seal,.opening .suite>.seal,.opened .suite>.seal{opacity:1;visibility:visible;display:block}.opened .suite>.seal:after{display:none}
@keyframes keepsake-lift{0%{top:61%;width:calc(var(--suite-width) * .33);transform:translate(-50%,-50%) rotateX(0) rotateZ(0);filter:drop-shadow(0 2px 2px #61446d22)}22%{top:58%;width:calc(var(--suite-width) * .33);transform:translate(-50%,-50%) rotateX(-23deg) rotateZ(-7deg);filter:drop-shadow(0 16px 10px #61446d44)}73%{top:10%;width:min(86px,calc(var(--suite-width) * .18));transform:translate(-50%,-50%) rotateX(7deg) rotateZ(4deg);filter:drop-shadow(0 5px 4px #61446d33)}100%{top:9%;width:min(82px,calc(var(--suite-width) * .17));transform:translate(-50%,-50%) rotateX(0) rotateZ(0);filter:drop-shadow(0 2px 2px #61446d22)}}
@keyframes pearl-light{0%{opacity:0;transform:translateX(-50%)}28%{opacity:.7}80%{opacity:.2}100%{opacity:0;transform:translateX(50%)}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto;scroll-snap-type:none}*,*:before,*:after{animation:none!important;transition-duration:.01ms!important;transition-delay:0s!important}.card-content{opacity:1;transform:none}.satin-flow{display:none!important}}

/* Once opened, the keepsake belongs to the first card and scrolls with it. */
.opened .suite>.seal{position:absolute;top:9svh;left:50%;width:min(82px,calc(var(--suite-width) * .17));transform:translate(-50%,-50%);animation:none;z-index:8}