.invite-cover{position:fixed;inset:0;margin:auto;width:min(400px,90vw,60svh);height:auto;aspect-ratio:2/3;max-height:90svh;padding:0;border:0;overflow:visible;background:transparent;color:#786e5d;-webkit-perspective:1400px;perspective:1400px}
.invite-cover::backdrop{background:#ede8dff5;transition:background 1.2s ease}
.invite-cover.opening::backdrop{background:#ede8df00}
.invite-door{position:absolute;top:0;bottom:0;width:50%;background-image:url('invitation-ivory.webp');background-size:200% 100%;background-repeat:no-repeat;-webkit-backface-visibility:hidden;backface-visibility:hidden;transform:translateZ(0);will-change:transform,opacity;box-shadow:0 14px 35px #49392020;transition:transform 1.3s cubic-bezier(.3,.05,.2,1),opacity 1.3s ease}
.invite-door.left{left:0;background-position:left;transform-origin:left center;border-right:1px solid #b9ac9430}
.invite-door.right{right:0;background-position:right;transform-origin:right center}
.opening .invite-door.left{transform:rotateY(-105deg);opacity:0}
.opening .invite-door.right{transform:rotateY(105deg);opacity:0}
.invite-content{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:14%;transition:opacity .2s ease}
.opening .invite-content{opacity:0;pointer-events:none}
.invite-names{font-family:Batang,'Noto Serif KR',Georgia,serif;font-size:clamp(23px,5vw,30px);font-weight:400;letter-spacing:5px;line-height:1.7;word-break:keep-all;color:#766a56;text-shadow:0 1px 0 #fff}
.invite-names span{display:block;font-size:14px;letter-spacing:0;color:#a1967f;margin:5px 0}
.invite-date{font-size:11px;letter-spacing:1px;line-height:2;margin-top:24px;color:#8c806c;white-space:pre-line}
.invite-open{margin-top:42px;padding:10px 24px;font:inherit;font-size:11px;letter-spacing:1px;color:#776c59;background:#fffdf340;border:1px solid #a89b8059;border-radius:24px;cursor:pointer;box-shadow:0 1px 0 #fff9,inset 0 1px 0 #fff9;min-height:42px}
.invite-open:hover{background:#fffdf3b0}.invite-open:focus-visible{outline:2px solid #99866b;outline-offset:5px}
body>nav{gap:10px;align-items:center}.invite-reopen{font:inherit;font-size:11px;background:#fffdf5dd;border:0;color:#776e5c;padding:8px 12px;cursor:pointer;border-radius:2px}
html.invite-showing{overflow:hidden}
/* The explicitly requested opening gesture remains visible on phones. */
@media(prefers-reduced-motion:reduce){.invite-cover .invite-door{transition:transform 1.3s cubic-bezier(.3,.05,.2,1),opacity 1.3s ease!important}.invite-cover .invite-content{transition:opacity .2s ease!important}.invite-cover::backdrop{transition:background 1.2s ease!important}}