/* Five genuinely different premium art directions. The same scene is used in admin and published gifts. */
.quick-experience{--quick-accent:#f5c98e;position:relative;isolation:isolate;overflow:hidden;display:grid;place-items:center;min-height:clamp(410px,65vh,690px);width:100%;background:#111528;color:#fdf7ff;border-radius:22px;text-align:center;box-sizing:border-box;font-family:inherit}
.quick-experience :where(button){font-family:inherit}.quick-world,.quick-background-media,.quick-shade{position:absolute;inset:0;pointer-events:none;overflow:hidden}.quick-world{background:radial-gradient(ellipse at 63% 25%,#594370 0%,#1b183a 45%,#080f27 100%)}
.quick-background-media img,.quick-background-media video{width:100%;height:100%;object-fit:cover;filter:saturate(.85)}
.quick-shade{background:linear-gradient(180deg,#08061922,#0b09246c 45%,#09061acd)}
.quick-spark{position:absolute;top:calc(9% + mod(var(--i)*41,82)*1%);left:calc(7% + mod(var(--i)*23,86)*1%);width:3px;height:3px;border-radius:50%;background:#fff8e9;box-shadow:0 0 10px 2px #fff8f8c9;opacity:.65;animation:quick-twinkle calc(2s + var(--i)*.24s) ease-in-out infinite alternate}
.quick-moon{position:absolute;width:140px;aspect-ratio:1;border-radius:50%;top:8%;right:12%;box-shadow:inset -24px 10px 0 -2px #f9dda9,0 0 60px #edca9150;transform:rotate(22deg);opacity:.8}
.quick-stage{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;max-width:min(90%,660px);padding:48px 24px;animation:quick-reveal .8s cubic-bezier(.2,.8,.2,1) both}
.quick-kicker{letter-spacing:.22em;color:var(--quick-accent);font-weight:700;font-size:.8rem}.quick-title{font-size:clamp(1.6rem,5vw,3.5rem);font-weight:800;line-height:1.45;max-width:17ch;margin:0;color:#fff9f4;text-shadow:0 6px 30px #0c0424b5}
.quick-action{border:1px solid #fae2ac91;background:linear-gradient(120deg,#f8d59b,#d39ecc);color:#2b163b;padding:14px 28px;border-radius:999px;font-weight:850;font-size:1rem;min-height:48px;cursor:pointer;box-shadow:0 12px 34px #110b3091;transition:transform .2s}.quick-action:hover{transform:translateY(-3px)}.quick-action:focus-visible{outline:3px solid #fff;outline-offset:3px}
.quick-steps{display:flex;gap:8px;position:absolute;bottom:20px;z-index:3}.quick-steps span{width:27px;height:4px;border-radius:10px;background:#ffffff45}.quick-steps .active{background:var(--quick-accent)}.quick-sound{position:absolute;z-index:3;top:16px;left:16px;border:1px solid #ffffff75;color:#fff;background:#19112b9a;padding:8px 12px;border-radius:100px;cursor:pointer}
.quick-letter-paper{max-width:min(100%,530px);max-height:42vh;overflow:auto;padding:clamp(20px,5vw,45px);border-radius:10px;background:#f7eee0;color:#3c2634;box-shadow:0 30px 80px #070417b0,0 0 0 1px #d5b98c;transform-origin:top;animation:quick-paper 1s ease both}.quick-letter-eyebrow{font-size:.8rem;color:#936b63}.quick-letter-title{font-size:clamp(1.4rem,3vw,2rem);color:#593747}.quick-letter-body{white-space:pre-wrap;overflow-wrap:anywhere;line-height:2;font-size:clamp(.93rem,2.3vw,1.15rem)}.quick-signature{font-size:1.25rem;color:var(--quick-accent)}.quick-heart-symbol{font-size:clamp(6rem,22vw,12rem);color:#f39bbf;filter:drop-shadow(0 0 35px #f785c7);animation:quick-beat 1.8s infinite}.quick-heart-meter{width:min(80vw,280px);height:12px;border-radius:30px;border:1px solid #f9d6f1;background:#241b36;overflow:hidden}.quick-heart-fill{height:100%;display:block;background:linear-gradient(90deg,#ed70a5,#ffe4b6);transition:width .25s}
.quick-experience[data-preset="love-letter"] .quick-world{background:radial-gradient(ellipse at 35% 23%,#b88177,#643e52 48%,#1e1a2c)}.quick-experience[data-preset="love-letter"] .quick-shade{background:linear-gradient(#fff4dd15,#2f13223d)}.quick-envelope{width:min(70vw,270px);aspect-ratio:1.5;background:linear-gradient(140deg,#f4d6bd,#b7848f);clip-path:polygon(0 0,100% 0,100% 100%,0 100%);border-radius:6px;box-shadow:0 18px 50px #0a0614b9;display:grid;place-items:center;font-size:clamp(4rem,12vw,7rem);color:#6c394e;transform:rotate(-5deg);animation:quick-envelope 2s ease-in-out infinite alternate}
.quick-experience[data-preset="moon-stars"] .quick-world{background:radial-gradient(ellipse at 40% 40%,#364c91,#171d55 50%,#080e2b)}.quick-experience[data-preset="moon-stars"] .quick-moon{box-shadow:inset -20px 9px 0 #fff4d3,0 0 80px #d5ddf596;top:12%;right:21%}.quick-star-glyph{font-size:5rem;color:#ffe4a7;filter:drop-shadow(0 0 30px #ffdf82);animation:quick-twinkle 2s infinite alternate}
.quick-experience[data-preset="memory-album"] .quick-world{background:radial-gradient(ellipse at 50% 20%,#bb9b80,#6f6374 55%,#292639)}.quick-album{display:flex;gap:0;align-items:center;justify-content:center;max-width:min(88vw,450px);min-height:150px}.quick-polaroid{background:#fff7eb;border:8px solid #fff7eb;border-bottom-width:25px;color:#433547;box-shadow:0 12px 26px #17102485;width:135px;height:155px;transform:rotate(calc((var(--photo-index,0) - 2)*7deg));margin-inline:-20px;animation:quick-reveal .8s both;display:flex;flex-direction:column;justify-content:space-between}.quick-photo-media{height:120px;overflow:hidden}.quick-photo-media :is(img,video){height:100%;width:100%;object-fit:cover}.quick-photo-caption{font-size:.75rem;color:#463245}.quick-placeholder{justify-content:center;line-height:2;font-weight:bold}
.quick-experience[data-preset="elegant-invite"]{color:#483b2c}.quick-experience[data-preset="elegant-invite"] .quick-world{background:radial-gradient(ellipse at 50% 25%,#fffaf0,#d9c6a5 65%,#9c8167)}.quick-experience[data-preset="elegant-invite"] .quick-shade{background:linear-gradient(#fff8e518,#fff9e823)}.quick-experience[data-preset="elegant-invite"] .quick-title{color:#533f34;text-shadow:none;font-family:Georgia,'Times New Roman',serif}.quick-experience[data-preset="elegant-invite"] .quick-stage{border:1px solid #b6985e;box-shadow:inset 0 0 0 8px #d4bf9680;padding:45px;border-radius:3px;background:#fff8ecdd}.quick-experience[data-preset="elegant-invite"] .quick-kicker{color:#866234}.quick-experience[data-preset="elegant-invite"] .quick-moon,.quick-experience[data-preset="elegant-invite"] .quick-spark{display:none}.quick-seal{font-size:4rem;color:#b18b48;animation:quick-reveal 2s both}
@keyframes quick-reveal{from{opacity:0;transform:translateY(20px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes quick-twinkle{to{opacity:.18;transform:scale(.55)}}@keyframes quick-beat{50%{transform:scale(1.07)}}@keyframes quick-paper{from{opacity:0;transform:perspective(600px) rotateX(42deg) translateY(-25px)}to{opacity:1;transform:perspective(600px) rotateX(0) translateY(0)}}@keyframes quick-envelope{to{transform:rotate(1deg) translateY(-7px)}}
@media(max-width:600px){.quick-experience{min-height:520px;border-radius:16px}.quick-stage{gap:16px;padding:40px 18px}.quick-letter-paper{max-height:48vh}.quick-moon{width:90px}}@media(prefers-reduced-motion:reduce){.quick-experience *, .quick-experience *::before{animation:none!important;transition:none!important}}

.quick-polaroid{cursor:pointer;transition:transform .55s cubic-bezier(.2,.8,.2,1)}.quick-polaroid.flipped{transform:rotate(0) translateY(-20px) scale(1.22);z-index:2}

/* Art direction refinement: layered world, realistic folding stationery, filled heart. */
.quick-world .quick-spark{top:auto;left:auto;width:2px;height:2px}
.quick-horizon{position:absolute;inset:auto -8% -32% -8%;height:52%;border-radius:50% 50% 0 0;background:radial-gradient(ellipse at 50% 0%,#38356380,#070a21 70%);filter:blur(15px);opacity:.8}
.quick-streak{position:absolute;width:120px;height:1px;top:18%;left:-30%;background:linear-gradient(90deg,transparent,#e4c7ffad,transparent);transform:rotate(-15deg);animation:quick-comet 14s ease-in-out infinite;opacity:0}
.quick-streak:nth-of-type(2){animation-delay:5s;top:40%;width:70px}.quick-streak:nth-of-type(3){animation-delay:9s;top:65%;width:160px}
@keyframes quick-comet{0%,12%{left:-30%;opacity:0}20%{opacity:.6}34%,100%{left:110%;opacity:0}}
.quick-experience[data-preset="love-letter"] .quick-envelope{position:relative;display:block;width:clamp(190px,45vw,295px);height:clamp(133px,27vw,196px);aspect-ratio:auto;transform:rotate(-4deg);background:transparent;clip-path:none;border-radius:0;box-shadow:none;animation:quick-envelope 2s ease-in-out infinite alternate;transform-style:preserve-3d;perspective:800px}
.quick-envelope-back,.quick-envelope-front,.quick-envelope-flap,.quick-envelope-paper{position:absolute;inset:0;border-radius:5px}
.quick-envelope-back{background:linear-gradient(135deg,#e9c6bc,#fbe9d8);box-shadow:0 22px 65px #1706179c}
.quick-envelope-front{background:linear-gradient(165deg,#dab0ad 0%,#f0d0ba 58%,#d8aaa8);clip-path:polygon(0 15%,50% 64%,100% 15%,100% 100%,0 100%);z-index:3;border-bottom:2px solid #d9a1a8}
.quick-envelope-flap{background:linear-gradient(#f5d5c4,#ddb3b1);clip-path:polygon(0 0,100% 0,50% 65%);z-index:4;transform-origin:50% 0;transition:transform .75s cubic-bezier(.15,.85,.2,1);backface-visibility:hidden}
.quick-envelope-paper{inset:15px 25px 10px;background:#fff6e7;color:#ac7890;z-index:2;font-size:1rem;font-family:Georgia,serif;font-style:italic;display:grid;place-items:center;transition:transform .75s .12s;border:1px solid #bfa28a}
.quick-envelope-seal{position:absolute;top:45%;left:calc(50% - 18px);z-index:5;display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:radial-gradient(circle at 30% 20%,#bd617e,#822b55);color:#ffe5c2;font-size:17px;box-shadow:0 3px 12px #61334c;font-weight:bold;transition:transform .65s,opacity .65s}
.quick-envelope.opened{animation:none}.quick-envelope.opened .quick-envelope-flap{transform:rotateX(170deg);z-index:1}.quick-envelope.opened .quick-envelope-paper{transform:translateY(-70px)}.quick-envelope.opened .quick-envelope-seal{opacity:0;transform:scale(.4)}
.quick-heart-symbol{background:linear-gradient(to top,#f179a6 0%,#f179a6 var(--heart-fill,0%),#ddbadc66 var(--heart-fill,0%),#ddbadc66 100%);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 0 18px #f785c780);transition:background .3s}
.quick-experience[data-preset="elegant-invite"] .quick-stage:before,.quick-experience[data-preset="elegant-invite"] .quick-stage:after{content:'❧';position:absolute;color:#b18c56;font-size:2rem;opacity:.75}.quick-experience[data-preset="elegant-invite"] .quick-stage:before{top:13px;left:18px}.quick-experience[data-preset="elegant-invite"] .quick-stage:after{bottom:13px;right:18px;transform:rotate(180deg)}
@media(prefers-reduced-motion:reduce){.quick-streak{display:none}}

/* Distinct premium moods; night romance has floating lantern-glows, not the moon-stars sky. */
.quick-experience[data-preset="night-romance"] .quick-moon,.quick-experience[data-preset="memory-album"] .quick-moon,.quick-experience[data-preset="love-letter"] .quick-moon{display:none}
.quick-experience[data-preset="night-romance"] .quick-world{background:radial-gradient(ellipse at 22% 23%,#852f65a3,transparent 39%),radial-gradient(ellipse at 80% 79%,#81407e7d,transparent 40%),linear-gradient(155deg,#10122c,#201030 63%,#090b23)}
.quick-experience[data-preset="night-romance"] .quick-horizon{background:radial-gradient(ellipse at 50% 0%,#5b285a9c,#070a21 70%)}
.quick-experience[data-preset="night-romance"] .quick-title{font-family:Georgia,'Times New Roman',serif;font-weight:700;color:#fff6e9}
.quick-experience[data-preset="memory-album"] .quick-stage{max-width:700px}
.quick-placeholder{position:relative;transform:rotate(calc((var(--photo-index,0) - 1)*10deg));justify-content:space-evenly;background:linear-gradient(145deg,#fff5e7,#e7c9b6);font-size:.78rem}
.quick-placeholder-emblem{display:grid;place-items:center;color:#bd788a;background:linear-gradient(140deg,#e7c9b6,#fdf0da);box-shadow:inset 0 0 0 2px #fff9e4;width:100%;height:99px;font-size:3rem}
.quick-placeholder .quick-photo-caption{white-space:normal;font-size:.7rem;padding:4px}
.quick-experience[data-preset="memory-album"] .quick-album{margin:10px auto 18px}
.quick-experience[data-preset="moon-stars"] .quick-world:before{content:'';position:absolute;inset:0;background:radial-gradient(circle at 30% 74%,#9caee048,transparent 25%),radial-gradient(circle at 65% 50%,#6171bc69,transparent 40%);animation:quick-twinkle 7s ease-in-out infinite alternate}
.quick-experience[data-preset="love-letter"] .quick-spark{opacity:.25}

/* The quick experience owns its entire screen when opened as a guest gift. No double envelope, no inherited letter styles. */
.story-frame[data-experience="very-simple"]{padding:0;border:0;min-height:0;box-shadow:none;background:transparent;overflow:visible}
.story-frame[data-experience="very-simple"]::after{display:none}
.story-frame[data-experience="very-simple"]>.story-world,.story-frame[data-experience="very-simple"]>.story-foreground{display:none}
.story-frame[data-experience="very-simple"] .story-body{display:block;width:100%;max-width:none;max-height:none;overflow:visible;padding:0;background:transparent;transform:none;box-shadow:none;text-shadow:none;border:0}
.story-frame[data-experience="very-simple"] .quick-title{max-width:17ch;color:#fff9f4;font-size:clamp(1.6rem,5vw,3.5rem)}
.story-frame[data-experience="very-simple"] .quick-letter-body{white-space:pre-wrap;background:none!important;color:#3c2634!important;border:0;padding:0;max-width:none}
.story-frame[data-experience="very-simple"] .quick-letter-title{color:#593747!important}
.story-frame[data-experience="very-simple"] .quick-signature{color:var(--quick-accent);background:none!important;max-width:none}
.story-frame[data-experience="very-simple"] .quick-experience{min-height:clamp(430px,65vh,690px);border-radius:22px}
.story-frame[data-experience="very-simple"] .quick-experience[data-preset="elegant-invite"] .quick-title{color:#533f34}