/* Shared scene geometry; recipes supply illustrated materials and motion. */
.envelope-decoration { position:absolute; inset:0; pointer-events:none; overflow:hidden; }
.envelope-decoration > span, .envelope-closure > span { position:absolute; inset:0; background-position:center; background-size:contain; background-repeat:no-repeat; pointer-events:none; }
.envelope-closure { position:absolute; inset:0; z-index:110; pointer-events:none; }
.envelope-closure .envelope-twine { z-index:110; transform-origin:50% 63%; }
.envelope-twine > span { position:absolute; inset:0; background:var(--experience-twine) center / contain no-repeat; transform-origin:50% 63%; }
.envelope-twine-left { clip-path:inset(0 50% 0 0); }
.envelope-twine-right { clip-path:inset(0 0 0 50%); }
.envelope-closure :is(.envelope-wax-left,.envelope-wax-right,.envelope-crack) { inset:67% auto auto 43%; width:14%; height:auto; aspect-ratio:1; z-index:121; opacity:0; background-image:var(--experience-seal); }
.envelope-closure .envelope-wax-left { clip-path:polygon(0 0,48% 0,55% 25%,44% 39%,56% 49%,43% 62%,51% 79%,45% 100%,0 100%); }
.envelope-closure .envelope-wax-right { clip-path:polygon(48% 0,100% 0,100% 100%,45% 100%,51% 79%,43% 62%,56% 49%,44% 39%,55% 25%); }
.envelope-closure .envelope-crack { background-image:var(--experience-crack); z-index:122; }
.envelope-decoration .envelope-light { inset:15% 8% 12%; z-index:30; opacity:0; background:radial-gradient(ellipse,var(--experience-light),transparent 67%); mix-blend-mode:screen; }
.envelope-decoration .envelope-desk-shadow { inset:68% 7% 4%; z-index:5; opacity:.22; background:radial-gradient(ellipse,#24150c80,transparent 66%); }
.envelope-decoration .envelope-flap-shadow { inset:35% 10% 49%; z-index:80; opacity:.16; transform-origin:50% 0; background:radial-gradient(ellipse at 50% 0,#24150c70,transparent 72%); }
.envelope-decoration .envelope-particles { z-index:45; overflow:visible; }
.envelope-particle { position:absolute; height:auto; opacity:0; pointer-events:none; }
#recipient-reveal[data-envelope-experience] .recipient-stage { isolation:isolate; }
#recipient-reveal[data-envelope-experience] #recipient-envelope { z-index:20; }
#recipient-reveal[data-envelope-experience] #recipient-open-prompt { z-index:170; }
.envelope-atmosphere { position:absolute; display:block; pointer-events:none; background:transparent; }
.envelope-atmosphere--rear { z-index:5; }
.envelope-atmosphere--front { z-index:165; }
#recipient-reveal[data-envelope-experience] #recipient-back { clip-path:inset(35.5% 0 0); }
#recipient-reveal[data-envelope-experience] #recipient-flap { top:0; transform-origin:50% 36%; }
#recipient-reveal[data-envelope-experience] #recipient-pocket { background-position:center; }
#recipient-reveal[data-envelope-experience] #recipient-seal { left:43%; top:67%; width:14%; }
#recipient-reveal[data-envelope-experience] #recipient-motion-card { top:43%; }
#recipient-reveal[data-envelope-experience] #recipient-card-viewport { height:90%; }
.envelope-plane { position:absolute; overflow:clip; pointer-events:none; }
.envelope-rear-plane { z-index:20; }
.envelope-front-plane { z-index:90; }
.envelope-plane-material { position:absolute; perspective:1400px; pointer-events:none; }
#recipient-reveal[data-envelope-experience] #recipient-motion-card { transform-origin:0 0; }
#recipient-reveal[data-envelope-experience] #recipient-final-zone[data-card-design] { width:min(660px,96vw); background:none; }
#recipient-reveal[data-envelope-experience] #recipient-final-zone[data-card-orientation=portrait] { width:min(560px,96vw); }
#recipient-reveal[data-envelope-experience] #recipient-final-zone[data-card-design] .recipient-final-image { left:3%; top:50%; width:94%; transform:translateY(-50%); }
#recipient-reveal[data-envelope-experience] #recipient-final-zone::after { display:none; }
.recipient-skip { position:absolute; left:50%; top:calc(55% + clamp(175px,26vw,255px)); transform:translateX(-50%); z-index:170; min-height:44px; padding:10px 16px; border:1px solid var(--line); border-radius:4px; background:var(--surface); color:var(--ink); text-shadow:none; font:14px/1.4 var(--font-body); text-decoration:underline; text-underline-offset:4px; cursor:pointer; }
.recipient-skip[hidden] { display:none; }
.envelope-send-dialog { position:fixed; inset:0; margin:0; width:100%; max-width:none; height:100%; max-height:none; border:0; border-radius:0; padding:24px; color:var(--setting-ink); background-color:var(--desk); background-image:linear-gradient(to bottom,transparent 83%,var(--desk)),var(--setting-image); background-size:100% calc(var(--setting-width) * var(--setting-ratio)),var(--setting-width) auto; background-position:center top; background-repeat:no-repeat; overflow:auto; }
.envelope-send-dialog::backdrop { background:#24180e50; }
.envelope-send-content { min-height:100%; width:min(780px,100%); margin:auto; display:flex; flex-direction:column; justify-content:center; align-items:center; gap:12px; }
#envelope-send-caption { margin:0; font:clamp(27px,4vw,38px)/1.2 var(--font-display); text-shadow:var(--setting-text-shadow); }
.envelope-send-stage { position:relative; width:100%; aspect-ratio:3 / 2; perspective:1400px; isolation:isolate; }
.envelope-send-stage > :is(.experience-back,.experience-pocket,.experience-flap) { position:absolute; inset:0; background-position:center; background-size:contain; background-repeat:no-repeat; }
.experience-back { background-image:var(--experience-back); z-index:10; clip-path:inset(35.5% 0 0); }
.experience-pocket { background-image:var(--experience-pocket); z-index:90; }
.experience-flap { background-image:var(--experience-flap); z-index:10; transform-origin:50% 36%; opacity:1; transform:rotateX(-169deg); }
.experience-seal { position:absolute; left:43%; top:67%; width:14%; aspect-ratio:1; z-index:120; opacity:0; background:var(--experience-wax) center / contain no-repeat; }
.experience-stamp { position:absolute; inset:0; opacity:0; background:var(--experience-stamp) center / contain no-repeat; }
.experience-letter-viewport { position:absolute; inset:0; height:90%; clip-path:inset(-2000px -2000px 0 -2000px); z-index:50; }
.experience-letter { position:absolute; left:18%; top:7%; width:64%; aspect-ratio:7 / 5; z-index:50; transform-style:preserve-3d; transform-origin:center; }
.experience-letter img { position:absolute; inset:0; width:100%; height:auto; transform-origin:50% 50%; }
.experience-letter-bottom { clip-path:inset(50% 0 0); }
.experience-letter-top { clip-path:inset(0 0 50%); backface-visibility:hidden; }
.envelope-send-skip { min-height:44px; padding:10px 16px; border:0; background:transparent; color:var(--setting-ink); text-shadow:var(--setting-text-shadow); font:14px/1.4 var(--font-body); text-decoration:underline; text-underline-offset:4px; cursor:pointer; }
:is(.envelope-send-skip,.recipient-skip):focus-visible { outline:2px solid currentColor; outline-offset:3px; }
@media(prefers-reduced-motion:reduce) { .envelope-decoration :is(.envelope-particles,.envelope-light) { display:none; } }