.invitation-entrance{--envelope-width:min(76vw, 510px);--envelope-height:calc(var(--envelope-width) * .6458);--envelope-center:54%;--tilt-x:0deg;--tilt-y:0deg;z-index:100;isolation:isolate;-webkit-user-select:none;user-select:none;overflow-anchor:none;color:#435873;position:fixed;inset:0;overflow:clip}.invitation-backdrop{background:radial-gradient(at 18% 85%,#dedfed80,#0000 48%),radial-gradient(at 85% 20%,#e3ecf5b3,#0000 45%),radial-gradient(at 50% 45%,#f8f9fd,#e8eef6 80%);transition:opacity 1.5s;position:absolute;inset:0}.invitation-backdrop:after{content:"";border:1px solid #8da4bf25;border-radius:3px;position:absolute;inset:22px}.invitation-halo{aspect-ratio:1;width:min(90vw,820px);left:50%;top:var(--envelope-center);background:radial-gradient(#ffffffc9 15%,#d6e1f34d 48%,#0000 70%);border-radius:50%;transition:opacity 1s;position:absolute;transform:translate(-50%,-50%)}.invitation-intro{z-index:4;text-align:center;pointer-events:none;width:100%;transition:opacity .5s,transform .7s;position:absolute;top:clamp(52px,10vh,110px)}.invitation-kicker{letter-spacing:.16em;color:var(--primary);font-size:.75rem}.invitation-intro h2{letter-spacing:-.025em;margin:18px 0 17px;font-size:clamp(2rem,4.1vw,3.75rem);line-height:1.08}.invitation-intro h2 span{color:var(--primary)}.invitation-intro p{letter-spacing:.06em;font-size:.875rem}.invitation-intro p span{color:#9caec5;margin:0 9px}.envelope-canvas{z-index:2;pointer-events:none;position:absolute;inset:0}.envelope-canvas canvas{width:100%;height:100%;display:block}.envelope-hit-area{z-index:3;top:var(--envelope-center);width:var(--envelope-width);height:var(--envelope-height);cursor:pointer;-webkit-tap-highlight-color:transparent;perspective:1100px;touch-action:manipulation;background:0 0;border-radius:6px;position:absolute;left:50%;transform:translate(-50%,-50%)}.envelope-hit-area:focus-visible{outline:none}[data-keyboard=true] .envelope-hit-area[aria-disabled=false]:focus-visible{outline-offset:14px;outline:2px solid #52678080}.envelope-hit-area[aria-disabled=true]{cursor:default;outline:none}.paper-envelope{transform-style:preserve-3d;transform:rotateX(var(--tilt-x)) rotateY(var(--tilt-y)) rotateZ(-2deg);filter:drop-shadow(8px 24px 24px #42567533);transition:transform .22s ease-out,opacity .35s;display:block;position:absolute;inset:0}[data-model-ready=true] .paper-envelope{opacity:0}.paper-envelope-back,.paper-envelope-folds,.paper-envelope-flap{border-radius:3px;display:block;position:absolute;inset:0}.paper-envelope-back{background:#c6d3e4}.paper-envelope-folds{background:linear-gradient(35deg,#acbfd7 49.7%,#8199b5 50%,#0000 50.4%) 0 100%/50% 100% no-repeat,linear-gradient(-35deg,#b5c7dd 49.7%,#8ca1bb 50%,#0000 50.4%) 100% 100%/50% 100% no-repeat,#b4c6dc}.paper-envelope-flap{transform-origin:top;clip-path:polygon(0 0,100% 0,58% 85%,50% 99%,42% 85%);background:radial-gradient(at var(--shine-x,25%) var(--shine-y,20%), #d1dfef, #a9bfd8);height:64%;transform-style:preserve-3d;box-shadow:inset 0 2px 2px #fff8}.paper-envelope-seal{aspect-ratio:1;width:14%;font-family:var(--font-monogram);color:#667c99;border-radius:46% 51% 48% 53%;justify-content:center;align-items:center;gap:2px;font-size:clamp(18px,3vw,27px);display:flex;position:absolute;top:51%;left:50%;transform:translate(-50%,-50%)translateZ(12px)}.paper-seal-piece{border-radius:inherit;background:radial-gradient(at 30% 25%,#fff,#c7d1df);border:4px solid #e4e8ef;justify-content:center;align-items:center;display:flex;position:absolute;inset:0;box-shadow:inset 0 0 0 1px #a3b1c4}.paper-seal-piece small{font-size:.6em}.paper-seal-cracks{stroke:#5d6580;stroke-width:1px;stroke-dasharray:100;stroke-dashoffset:100px;opacity:0;border-radius:50%;width:86%;height:86%;position:absolute;inset:7%;overflow:hidden}.seal-dust-grain{background:var(--dust-color);width:4px;height:4px;box-shadow:0 0 5px var(--dust-color);opacity:0;animation:seal-colored-dust 1.1s calc(.82s + var(--delay)) ease-out both;border-radius:50%;position:absolute;top:50%;left:50%}.invitation-prompt{z-index:4;text-align:center;pointer-events:none;width:100%;transition:opacity .4s,transform .6s;position:absolute;bottom:10%}.invitation-touch-icon{color:#8a9fb9;font-size:25px;animation:3s ease-in-out infinite invitation-sparkle;display:inline-block}.invitation-prompt p{margin:2px 0 12px;font-size:1.25rem;font-weight:500}.invitation-open-hint{letter-spacing:.06em;color:var(--primary);font-size:.75rem}.invitation-skip{z-index:6;color:#526780;cursor:pointer;padding:6px 0;font-size:.875rem;transition:color .2s;position:absolute;top:37px;right:44px}.invitation-skip span{margin-left:7px;transition:transform .2s;display:inline-block}.invitation-skip:hover span{transform:translate(2px,-2px)}.flying-letter{z-index:4;opacity:0;pointer-events:none;transform-origin:50%;will-change:transform, opacity;position:fixed;top:0;left:0}[data-invitation-open=false] #invitation-letter{visibility:hidden}.keepsake-invitation{flex-direction:column;align-items:center;padding:40px 0;display:flex;position:relative}.letter-card{aspect-ratio:102/142;width:min(80vw,430px);position:relative;container-type:inline-size}#invitation-letter{touch-action:pan-y pinch-zoom;-webkit-user-select:none;user-select:none;cursor:grab}#invitation-letter:active{cursor:grabbing}.letter-paper-content{color:#405571;transform-style:preserve-3d;transform:perspective(1200px) rotateX(var(--letter-tilt-x,0deg)) rotateY(var(--letter-tilt-y,0deg));background:linear-gradient(125deg,#fbfbfd,#e9eef6);border:1px solid #d1d8e2;border-radius:10px;transition:opacity .3s,transform .18s ease-out;position:absolute;inset:0;box-shadow:2px 3px #c2c9d7,4px 5px #d8dce4,9px 21px 35px -13px #3d526944,inset 0 0 35px #ffffffa6}.letter-paper-content:before,.letter-paper-content:after{content:"";pointer-events:none;border-radius:6px;position:absolute}.letter-paper-content:before{border:1px solid #c8b794;inset:3%}.letter-paper-content:after{border:1px solid #b2c0d43b;inset:3.8%}[data-letter-ready=true] .letter-paper-content{opacity:0}.letter-crest{color:#b39d77;text-align:center;width:100%;font:7cqw Georgia,serif;position:absolute;top:9.5%;left:0}.letter-crest span{margin-left:-.32em}.letter-heading{letter-spacing:.12em;text-align:center;width:100%;font-size:max(.6875rem,3.5cqw);position:absolute;top:26.4%;transform:translateY(-50%)}.letter-names{font-family:var(--font-display);margin:0;font-size:16cqw;font-weight:500;line-height:1;position:absolute;inset:0}.letter-names>span{text-align:center;width:100%;position:absolute;left:0;transform:translateY(-50%)}.letter-names>span:first-child{top:39.1%}.letter-names>span:last-child{top:58.7%}.letter-names .letter-ampersand{font-family:var(--font-script);color:#93a6c0;font-size:14cqw;top:49.1%}.letter-date{text-align:center;letter-spacing:.04em;width:100%;font-size:5.2cqw;position:absolute;top:74%;transform:translateY(-50%)}.letter-date span{color:#8195af;padding:0 .45em}.letter-place{text-align:center;width:100%;font-size:max(.75rem,3.8cqw);line-height:1.3;position:absolute;top:82%}.letter-promise{text-align:center;width:100%;color:var(--primary);font-size:max(.75rem,4cqw);position:absolute;top:92%}.letter-floral-watermark{object-fit:contain;pointer-events:none;opacity:.32;width:72.55%;height:52.11%;position:absolute;bottom:2.82%;right:3.92%}.flying-letter .letter-card{width:100%}.keepsake-invitation>a{transition:opacity .7s}[data-invitation-open=false] .keepsake-invitation>a{opacity:0}.invitation-program{background:var(--primary);color:var(--primary-foreground);border-radius:999px;align-items:center;gap:8px;margin-top:48px;padding:12px 28px;font-size:1rem;font-weight:600;transition:transform .2s;display:inline-flex}a.invitation-program:hover{transform:scale(1.02)}.invitation-particles{left:50%;top:calc(var(--envelope-center) - 5%);z-index:5;pointer-events:none;position:absolute}.invitation-particle{width:var(--size);height:var(--size);opacity:0;animation:invitation-dust 2.5s var(--delay) cubic-bezier(.1, .65, .3, 1) both;background:#c6b68f;border-radius:50%;position:absolute;box-shadow:0 0 6px 2px #fff8,0 0 15px #c3d0e8}.invitation-particle.is-heart{box-shadow:none;color:#8d82ad;font-size:var(--size);text-shadow:0 0 12px #ffffffb3;background:0 0}.invitation-particle:nth-child(3n).is-heart{color:#6d8dae}.invitation-particle.is-star{box-shadow:none;color:#bca479;font-size:var(--size);text-shadow:0 0 8px #fff;background:0 0}.invitation-entrance:not([data-stage=closed]) .invitation-intro{opacity:0;transform:translateY(-18px)}.invitation-entrance:not([data-stage=closed]) .invitation-prompt{opacity:0;transform:translateY(14px)}.invitation-entrance:not([data-stage=closed]) .paper-envelope-flap{animation:1.75s cubic-bezier(.45,0,.25,1) .9s both paper-unfold}.invitation-entrance:not([data-stage=closed]) .paper-envelope{transition:opacity .35s}.invitation-entrance:not([data-stage=closed]) .paper-seal-piece{animation:1.15s ease-in-out .38s both seal-piece-dissolve}.invitation-entrance:not([data-stage=closed]) .paper-seal-cracks{animation:.75s linear .12s both seal-crack-trace}@keyframes paper-unfold{0%{transform:rotateX(0)}35%{border-radius:3px 3px 28% 28%;transform:rotateX(42deg)scaleY(.96)}68%{border-radius:3px 3px 18% 18%;transform:rotateX(125deg)scaleY(.94)}to{border-radius:3px;transform:rotateX(174deg)}}@keyframes seal-crack-trace{0%{stroke-dashoffset:100px;opacity:0}15%{opacity:1}65%{stroke-dashoffset:0;opacity:1}to{stroke-dashoffset:0;opacity:0}}@keyframes seal-piece-dissolve{0%{opacity:1;transform:translate(0)}28%{transform:translate(calc(var(--piece-x) * .08), calc(var(--piece-y) * .08));opacity:1}65%{opacity:.9;filter:blur()}to{transform:translate(var(--piece-x), var(--piece-y)) rotate(var(--piece-spin));background:var(--dust-color);opacity:0;filter:blur(2px)}}@keyframes seal-colored-dust{0%{opacity:0;transform:translate(0)scale(0)}15%{opacity:1}to{transform:translate(calc(var(--dx) * .35), calc(var(--dy) * .32)) scale(.2);opacity:0}}[data-stage=flying] .invitation-backdrop,[data-stage=flying] .invitation-halo{opacity:0}[data-stage=gone].invitation-entrance{z-index:10;pointer-events:none}[data-stage=flying] .envelope-hit-area,[data-stage=settling] .envelope-hit-area{pointer-events:none}[data-stage=settling] .invitation-backdrop,[data-stage=settling] .invitation-halo{opacity:0}[data-stage=flying] .invitation-skip{opacity:.65}@keyframes invitation-sparkle{0%,to{opacity:.5;transform:scale(.85)}50%{opacity:1;transform:scale(1.08)}}@keyframes invitation-dust{0%{opacity:0;transform:translate(0)scale(.2)}12%{opacity:.95}65%{opacity:.8}to{transform:translate(var(--dx), var(--dy)) rotate(var(--spin)) scale(.45);opacity:0}}@media (width<=639px){.invitation-entrance{--envelope-width:84vw;--envelope-center:53%}.invitation-backdrop:after{inset:12px}.invitation-intro{top:12%}.invitation-intro h2{margin-block:10px}.invitation-skip{top:23px;right:26px}.invitation-prompt{bottom:10%}}@media (height<=650px) and (width>=640px){.invitation-entrance{--envelope-width:min(45vw, 350px);--envelope-center:56%}.invitation-intro{top:5%}.invitation-intro h2{margin:8px 0;font-size:34px}.invitation-intro h2 br{display:none}.invitation-intro h2 span:before{content:" "}.invitation-prompt{bottom:4%}.invitation-prompt p{margin:0;font-size:16px}.invitation-touch-icon{display:none}}@media (height<=420px){.invitation-entrance{--envelope-width:min(36vw, 270px);--envelope-center:55%}.invitation-intro h2{font-size:26px}.invitation-kicker,.invitation-intro p{display:none}.invitation-skip{top:18px;right:25px}}@media (prefers-reduced-motion:reduce){.invitation-touch-icon,.invitation-particle{animation:none}.paper-envelope,.letter-paper-content{transform:none}}
