/* Stitch 信封外觀；僅作用於開場，不覆寫原喜帖版面。 */
:root{--inv-envelope-ready:1}
.envelope-nav{position:relative;z-index:10}
.inv-envelope[hidden]{display:none!important}
html.envelope-active,html.envelope-active body{overflow:hidden}
.inv-envelope{--invitation-font-family:"Home Serif TC",serif;position:fixed;inset:0;z-index:1000;overflow:auto;background:#f7f3ec;color:#363330;font-family:var(--invitation-font-family);font-size:16px;line-height:1.5;overscroll-behavior:contain}
.envelope-nav{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:16px max(16px,env(safe-area-inset-right)) 16px max(16px,env(safe-area-inset-left));min-height:76px;border-bottom:1px solid #e8dfd3;background:#fcf8f2;color:#912c37}
.envelope-nav a,.envelope-nav button{min-height:44px;display:inline-flex;align-items:center;justify-content:center;gap:8px;font:inherit;color:inherit;text-decoration:none}
.envelope-nav button{border:1px solid #912c37;border-radius:24px;padding:8px 16px;background:transparent;cursor:pointer}
#envelope-title{font-size:clamp(18px,2vw,26px);letter-spacing:.1em}
.envelope-nav :focus-visible,.envelope-open:focus-visible{outline:3px solid #912c37;outline-offset:5px}
.envelope-scene{min-height:calc(100svh - 76px);display:flex;flex-direction:column;align-items:center;justify-content:center;padding:56px 24px 24px;background:radial-gradient(ellipse at center,#efe5d755,transparent 68%)}
.envelope-assembly{position:relative;width:min(640px,100%);height:min(650px,calc(100svh - 180px));min-height:350px;perspective:1200px;isolation:isolate;animation:envelope-arrive 650ms cubic-bezier(.2,.7,.2,1) both}
.envelope-back,.envelope-pocket{position:absolute;inset:0;border:1px solid #e4d5c1;border-radius:8px;background:#fffdf9;box-shadow:0 20px 50px #60462d22}
.envelope-back{background:#ecdfcf;z-index:0}
.envelope-pocket{z-index:3;background:linear-gradient(145deg,transparent 49.7%,#e8dccb 50%,transparent 50.3%) left bottom/50% 57% no-repeat,linear-gradient(215deg,transparent 49.7%,#e8dccb 50%,transparent 50.3%) right bottom/50% 57% no-repeat,#fffdf9;clip-path:polygon(0 0,50% 39%,100% 0,100% 100%,0 100%)}
.envelope-flap{position:absolute;inset:0 0 auto;height:40%;background:linear-gradient(155deg,#fffdf9,#eee4d6);clip-path:polygon(0 0,100% 0,50% 100%);transform-origin:50% 0;z-index:4;backface-visibility:visible}
.envelope-open{position:absolute;inset:0;z-index:5;border:0;border-radius:8px;background:transparent;font:inherit;color:#363330;cursor:pointer;display:flex;align-items:center;flex-direction:column;padding:28px 16px 20px;-webkit-tap-highlight-color:transparent;touch-action:manipulation}
.envelope-english{font-family:var(--invitation-font-family);font-size:clamp(12px,2vw,20px);letter-spacing:.22em;color:#91703e;margin-top:2%}
.envelope-botanical{color:#ac8e5d;font-size:38px;position:absolute;right:12%;top:38%;transform:rotate(-28deg)}
.envelope-seal{position:absolute;top:42%;left:50%;width:84px;height:84px;transform:translate(-50%,-50%);display:grid;place-items:center;background:linear-gradient(135deg,#ad4552,#7f2132);border:4px double #c06e77;border-radius:25%;box-shadow:0 5px 12px #6c28384d,inset 0 0 0 5px #912c37;overflow:hidden}
.envelope-seal svg{width:54px;height:44px;fill:#f8d5d7;filter:drop-shadow(0 2px 1px #641725)}
.envelope-seal svg path+path{fill:#fff2ee;stroke:#912c37;stroke-width:1.5}
.envelope-seal:after{content:"";position:absolute;inset:-50%;background:linear-gradient(110deg,transparent 40%,#fff5 50%,transparent 60%);animation:envelope-shine 1100ms 700ms both}
.envelope-recipient{margin-top:auto;font-size:clamp(22px,3vw,32px);letter-spacing:.12em;border-bottom:1px solid #d4c3a8;padding-bottom:12px}
.envelope-prompt{font-size:15px;color:#806459;margin-top:18px;letter-spacing:.08em}
.envelope-regards{font-size:13px;color:#8b7e74;margin-top:24px;letter-spacing:.25em}
.envelope-paper{position:absolute;inset:5% 5% 3%;z-index:2;background:#f7f3ec;border:1px solid #e1cfb4;box-shadow:0 3px 16px #654b3422;overflow:hidden;visibility:hidden}
.envelope-paper-window{transform-origin:top left;pointer-events:none}
.envelope-status{min-height:24px;margin:20px 0 0;font-size:14px;letter-spacing:.16em;color:#806459}
.envelope-petal{position:absolute;z-index:6;width:14px;height:22px;background:#c7818c;border-radius:80% 15% 70% 25%;opacity:0;pointer-events:none}
.petal-one{left:-2%;top:20%;--drift:-30px}.petal-two{right:-2%;top:5%;--drift:25px}.petal-three{right:4%;top:70%;--drift:15px}
.inv-envelope[data-state=opening] .envelope-flap{animation:envelope-unfold 650ms ease-in-out forwards}
.inv-envelope[data-state=opening] .envelope-paper{visibility:visible;animation:envelope-extract 1250ms 400ms cubic-bezier(.2,.6,.2,1) both}
.inv-envelope[data-state=opening] .envelope-seal{animation:envelope-unseal 400ms ease-out forwards}
.inv-envelope[data-state=opening] .envelope-open>span:not(.envelope-seal){animation:envelope-ink-fade 350ms ease-out forwards}
.inv-envelope[data-state=opening] .envelope-petal{animation:envelope-petal 1100ms 500ms ease-out both}
.inv-envelope[data-state=opening]{animation:envelope-exit 250ms 1500ms ease-in forwards}
@keyframes envelope-arrive{from{opacity:0;transform:translateY(-18px) rotate(-1deg)}to{opacity:1;transform:none}}
@keyframes envelope-shine{from{transform:translateX(-100%)}to{transform:translateX(100%)}}
@keyframes envelope-unfold{0%{transform:rotateX(0);z-index:4}60%{z-index:4}100%{transform:rotateX(180deg);z-index:1}}
@keyframes envelope-unseal{to{opacity:0;transform:translate(-50%,-85%) rotate(-10deg) scale(1.08)}}
@keyframes envelope-ink-fade{to{opacity:0}}
@keyframes envelope-extract{0%{transform:translateY(0)}100%{transform:translateY(-24%)}}
@keyframes envelope-petal{0%{opacity:0;transform:translateY(-10px) rotate(0)}25%{opacity:.7}100%{opacity:0;transform:translate(var(--drift),90px) rotate(80deg)}}
@keyframes envelope-exit{to{opacity:0}}
@media(max-width:600px){.envelope-nav{gap:8px;padding-block:10px;min-height:66px}.envelope-home span:last-child{display:none}.envelope-nav button{font-size:14px;padding:8px 12px}.envelope-scene{min-height:calc(100svh - 66px);padding:48px 20px 20px}.envelope-assembly{height:min(490px,calc(100svh - 180px))}.envelope-seal{width:68px;height:68px}.envelope-seal svg{width:46px}.envelope-open{padding-top:24px}.envelope-botanical{font-size:30px}.envelope-recipient{letter-spacing:.07em}.envelope-regards{margin-top:20px}}
@media(max-height:500px){.envelope-scene{padding-top:32px;justify-content:flex-start}.envelope-assembly{min-height:300px;max-width:460px}.envelope-regards{margin-top:12px}.envelope-prompt{margin-top:10px}}
@media(prefers-reduced-motion:reduce){.inv-envelope,.inv-envelope *,.inv-envelope :after{animation:none!important;transition:none!important}.envelope-petal{display:none}}
@media print{.inv-envelope{display:none!important}html.envelope-active,html.envelope-active body{overflow:visible}}

/* 標題是閱讀定位點，移交焦點時不繪製瀏覽器預設藍框。 */
main .inv-cover h1[tabindex="-1"]:focus{outline:none}