/* The original cover stays intact; these paper layers appear only on entry. */
.envelope-reveal{display:none;position:fixed;inset:0;place-items:center;pointer-events:none;z-index:3;perspective:1200px}
.envelope-opening .envelope-reveal{display:grid;animation:envelope-appear .28s ease-out both}
.envelope-scene{position:relative;width:min(460px,82vw,76svh);aspect-ratio:1.5;perspective:1000px;transform:translateY(12%);isolation:isolate;animation:envelope-settle 1.9s cubic-bezier(.22,.7,.22,1) both}
.envelope-back,.envelope-pocket{position:absolute;inset:0;border-radius:5px}
.envelope-back{z-index:0;background:linear-gradient(145deg,#481526,#7b2c40);border:1px solid #b68b4b;box-shadow:0 30px 65px #0006}
.envelope-pocket{z-index:3;background:linear-gradient(32deg,transparent 49.5%,#b9875555 50%,transparent 50.5%),linear-gradient(-32deg,transparent 49.5%,#b9875555 50%,transparent 50.5%),linear-gradient(155deg,#9a485b,#682137 65%);clip-path:polygon(0 0,50% 55%,100% 0,100% 100%,0 100%);border:1px solid #d0ab6c99}
.envelope-pocket:after{content:'';position:absolute;inset:9px;border:1px solid #eacb8544;border-radius:2px}
.envelope-flap{position:absolute;inset:0 0 43%;z-index:5;transform-origin:50% 0;backface-visibility:visible;background:linear-gradient(170deg,#aa5868,#783046);clip-path:polygon(0 0,100% 0,50% 100%);animation:envelope-unfold .8s cubic-bezier(.32,.05,.24,1) .3s both}
.envelope-flap:after{content:'';position:absolute;inset:0;background:linear-gradient(151deg,transparent 49%,#f3d79744 50%,transparent 51%)}
.envelope-seal{position:absolute;left:50%;top:51%;z-index:6;width:clamp(44px,12vw,65px);aspect-ratio:1;display:grid;place-items:center;border-radius:50%;transform:translate(-50%,-50%);background:radial-gradient(circle at 30% 25%,#ffedbd,#d8ae60 56%,#98632e);color:#623822;border:3px double #e5c78c;box-shadow:0 4px 10px #24071066,inset 0 0 0 3px #8e5b3044;font-family:Georgia,serif;font-size:clamp(15px,4vw,21px);animation:envelope-unseal .4s ease .12s both}
.envelope-seal span span{font-style:italic;font-size:.65em;margin:0 1px}
.envelope-letter{position:absolute;inset:7% 6% 5%;z-index:2;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:clamp(9px,3vw,17px);padding:15px;text-align:center;border:1px solid #d2b77f;outline:1px solid #c6a96f88;outline-offset:-10px;background:linear-gradient(135deg,#fffaf0,#f2e4c9);box-shadow:0 0 15px #16060922;color:#6c2538;animation:envelope-letter-rise 1s cubic-bezier(.22,.7,.22,1) .85s both}
.envelope-letter strong{font-family:Georgia,serif;font-size:clamp(22px,6vw,35px);font-weight:400;line-height:1.25}
.envelope-letter strong em{color:#aa7b37;font-size:.75em}
.envelope-letter>span{font-size:clamp(8px,2vw,11px);letter-spacing:.16em;color:#96703a}
.envelope-letter>span:first-child{font-size:20px}
.envelope-letter>i{font:italic clamp(12px,3vw,16px) Georgia,serif;color:#987651}
.opening.envelope-opening{transition:opacity .4s ease}
.opening.envelope-opening .cover-wrap{transition:none!important;transform:none!important;opacity:1!important}
.opening.envelope-opening .invitation-card,.opening.envelope-opening .devotional-invocation{opacity:0!important;animation:none!important;pointer-events:none;transition:opacity .2s ease!important}
.envelope-opening .opening-options{position:fixed;bottom:max(24px,env(safe-area-inset-bottom));left:0;right:0;z-index:4}
.envelope-opening #openSilent{visibility:hidden;position:absolute;pointer-events:none}
.envelope-opening #skipIntro{color:#f7e6bd;opacity:1;min-height:44px}
@keyframes envelope-appear{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
@keyframes envelope-settle{0%{transform:translateY(18%) rotate(-3deg) scale(.9)}35%{transform:translateY(12%) rotate(0) scale(1)}100%{transform:translateY(25%) rotate(0) scale(1.02)}}
@keyframes envelope-unseal{0%{opacity:1;transform:translate(-50%,-50%) scale(1)}100%{opacity:0;transform:translate(-50%,-38%) scale(1.18)}}
@keyframes envelope-unfold{0%{transform:rotateX(0);z-index:5}49%{z-index:5}50%,100%{z-index:1}100%{transform:rotateX(175deg)}}
@keyframes envelope-letter-rise{0%{transform:translateY(0)}100%{transform:translateY(-70%) rotate(-2deg)}}
@media(prefers-reduced-motion:reduce){.envelope-reveal{display:none!important}}
