/* All motion is object-local. Never transform a screen or an IP-bearing parent. */
.motion-art{position:absolute;display:block;pointer-events:none;transform-origin:50% 65%}
.motion-art>img{display:block;width:100%;height:100%;object-fit:fill}
.motion-ready .band{z-index:8}.screen--entry.motion-ready .entry__start{z-index:7}
.motion-spark{position:absolute;width:9px;height:20px;z-index:12;pointer-events:none;background:linear-gradient(#fff0a2,#c7a2ff);border-radius:2px;box-shadow:0 0 12px #fff6}
.motion-halo::before{content:'';position:absolute;inset:5px;border-radius:25%;border:3px solid #fff9;animation:motion-ring 2.8s ease-out infinite;pointer-events:none}
@keyframes motion-ring{0%{scale:.9;opacity:0}30%{opacity:.8}90%,100%{scale:1.28;opacity:0}}
.case-card.is-playing{box-shadow:0 0 0 3px #e2ceff,0 10px 40px #725bba55}
.booth__card .motion-card-skin{position:absolute;inset:0;border-radius:inherit;background:inherit;pointer-events:none;z-index:0}
.booth__card>*:not(.motion-card-skin){z-index:1}
.screen--intro .intro-film{position:absolute;inset:0;width:720px;height:1280px;object-fit:contain;background:#8c86c6}
@media(prefers-reduced-motion:reduce){.motion-halo::before{animation:none;display:none}}

.motion-party{position:absolute;left:0;top:0;width:720px;height:1987px;overflow:hidden;pointer-events:none;z-index:0}
.motion-wave{position:absolute;left:0;top:1987px;width:720px;height:358px;pointer-events:none;z-index:0}
.motion-balloon::after{content:'';position:absolute;top:96%;left:51%;width:2px;height:130px;border-left:1px solid #a6a3ad;border-radius:50%;transform:rotate(-9deg);transform-origin:50% 0}
@media(prefers-reduced-motion:no-preference){
 .screen--loading .loading__moon{animation:motion-load-bounce 1.3s ease-in-out infinite;transform-origin:50% 100%}
 .screen--loading .loading__fill{transition:transform .4s cubic-bezier(.2,.8,.2,1);box-shadow:0 0 16px #ebc491}
}
@keyframes motion-load-bounce{0%,100%{translate:0 0;scale:1.12 .88}45%{translate:0 -46px;scale:.91 1.1}65%{translate:0 -36px;scale:1 1}}
.booth__card.is-active .motion-card-skin{background:#fff!important}
.booth__card:not(.is-active) .motion-card-skin{background:#2b421f!important}

.float-cta[data-motion-ip]{transform:none!important;scale:none!important;translate:none!important;rotate:none!important}

.motion-glint{position:absolute;z-index:7;width:18px;height:27px;background:linear-gradient(#fff,#fff3b7);clip-path:polygon(50% 0,62% 39%,100% 50%,62% 61%,50% 100%,38% 61%,0 50%,38% 39%);pointer-events:none;animation:motion-glint 2.8s ease-in-out infinite}
@keyframes motion-glint{0%,75%,100%{scale:.15;opacity:0;rotate:-15deg}35%{scale:1;opacity:.95;rotate:15deg}}
@media(prefers-reduced-motion:reduce){.motion-glint{display:none;animation:none}}

/* Supporting artwork and protected IP stay together, including during pointer press. */
.entry__start[data-motion-ip]{transform:translateX(-50%)!important;scale:none!important;translate:none!important;rotate:none!important}
.wheel-celebration{position:absolute;inset:0;overflow:visible;pointer-events:none;z-index:4}
/* Two foil cannons burst into the foreground; every layer remains click-through. */
.wheel-confetti{position:absolute;width:13px;height:30px;border-radius:2px;pointer-events:none;background:linear-gradient(125deg,#fff8,var(--confetti-color) 30%,var(--confetti-color) 72%,#fff9);box-shadow:1px 3px 2px #4d32752b;will-change:translate,rotate,scale,opacity}
.wheel-confetti:nth-child(3n){width:20px;height:13px}
.wheel-confetti.is-near{width:24px;height:43px;filter:blur(.3px)}
.wheel-confetti.is-streamer{width:45px;height:165px;border-radius:0;background:none;box-shadow:none;transform-origin:50% 100%;filter:drop-shadow(2px 3px 1px #6a419340)}
.wheel-confetti.is-streamer>svg{display:block;width:100%;height:100%;overflow:visible}
.wheel-impact-glow{position:absolute;left:51px;top:18px;width:640px;height:640px;border-radius:50%;background:radial-gradient(circle,#fff1bd00 30%,#fff6c8a0 52%,#fce0ff00 72%);pointer-events:none}
.wheel-impact-ring{position:absolute;left:71px;top:38px;width:600px;height:600px;border-radius:50%;border:5px solid #fff5cf;box-shadow:0 0 18px #fff4c8,inset 0 0 12px #ffe5fc;pointer-events:none}

.motion-spark{width:12px;height:25px;box-shadow:0 0 14px #fff8}
.motion-spark.is-star{width:24px;height:30px;clip-path:polygon(50% 0,64% 35%,100% 50%,64% 65%,50% 100%,36% 65%,0 50%,36% 35%)}
.motion-click-ring{position:absolute;width:170px;height:170px;margin:-85px;border:4px solid #fff3b5;border-radius:50%;box-shadow:0 0 20px #ead3ff;z-index:11;pointer-events:none}
.cake__slice.is-selected{filter:drop-shadow(0 18px 10px #5b357455)}

/* Foil turns catch light independently of each particle's wind path. */
.wheel-confetti:not(.is-streamer){background:none;box-shadow:none}
.confetti-foil{position:absolute;inset:0;border-radius:inherit;background:linear-gradient(120deg,var(--confetti-color) 8%,#fff8 28%,var(--confetti-color) 45%,var(--confetti-color) 80%,#fff9);box-shadow:1px 2px 2px #4d32752b;animation:foil-tumble var(--flutter-duration) ease-in-out var(--flutter-phase) infinite alternate}
.wheel-confetti.is-streamer>svg{animation:ribbon-billow var(--flutter-duration) ease-in-out var(--flutter-phase) infinite alternate;transform-origin:50% 20%}
@keyframes foil-tumble{0%{transform:perspective(180px) rotateX(-35deg) rotateY(-55deg)}50%{transform:perspective(180px) rotateX(28deg) rotateY(15deg)}100%{transform:perspective(180px) rotateX(58deg) rotateY(70deg)}}
@keyframes ribbon-billow{from{transform:perspective(300px) rotateY(-35deg) skewX(-9deg) scaleY(.90)}to{transform:perspective(300px) rotateY(35deg) skewX(9deg) scaleY(1.08)}}

/* The opening never runs until a deliberate tap. Only the separate 3D gift rig shakes.
   The two films are different renders (see js/gift-film.js), so the release fades in over the
   still-running loop instead of a hard cut; the loop is hidden only once the fade has finished. */
.intro-film--open{visibility:hidden;opacity:0}
[data-gift-state="requested"] .intro-film--open{visibility:visible;opacity:0}
[data-gift-state="opening"] .intro-film--open{visibility:visible;opacity:1;transition:opacity 180ms linear}
[data-gift-fade="done"] .intro-film--idle{visibility:hidden}
@media(prefers-reduced-motion:reduce){[data-gift-state="opening"] .intro-film--open{transition:none}}
.gift-invitation{position:absolute;left:50%;top:1121px;translate:-50% 0;z-index:8;display:flex;align-items:center;gap:13px;white-space:nowrap;padding:9px 27px;border:2px solid #fff8;border-radius:38px;background:linear-gradient(145deg,#eae0ffed,#8c73cbe8 22%,#6558a8ed 76%,#ac96e4);box-shadow:0 4px 0 #c9b7e8,0 8px 22px #4b33734d,inset 0 1px 5px #fff9;color:#fff;font:800 27px/1.4 "PingFang TC",system-ui;letter-spacing:2px;text-shadow:0 2px 2px #564083;pointer-events:none;animation:gift-invite 1.5s ease-in-out infinite;transition:opacity .18s ease,scale .18s ease}
.gift-invitation__touch{font-size:33px;color:#fff4cd;display:inline-block;animation:gift-touch 1.5s ease-in-out infinite}
[data-gift-state="opening"] .gift-invitation,[data-gift-state="requested"] .gift-invitation{opacity:0;scale:.88;animation:none}
@keyframes gift-invite{0%,100%{box-shadow:0 4px 0 #c9b7e8,0 8px 22px #4b33734d,inset 0 1px 5px #fff9}45%{box-shadow:0 4px 0 #c9b7e8,0 0 26px #fff2bb85,inset 0 1px 5px #fff9}}
@keyframes gift-touch{0%,100%{translate:0 2px;rotate:-6deg}45%{translate:0 -7px;rotate:4deg}}
@media(prefers-reduced-motion:reduce){.gift-invitation,.gift-invitation__touch{animation:none}}

.motion-click-effects{position:absolute;inset:0;pointer-events:none;z-index:12;clip-path:inset(96px 0 0)}
.wheel-celebration{clip-path:inset(-217px -100px -50px)}

/* Reuse the supplied pearl glove artwork, cropping its existing caption with CSS. */
.gift-invitation__touch{position:relative;display:block;flex:0 0 54px;width:54px;height:58px;overflow:hidden}
.gift-invitation__touch>img{position:absolute;width:136px;height:auto;max-width:none;left:-38px;top:-12px}

.gift-prompt-particles{position:absolute;inset:0;z-index:9;pointer-events:none}
.gift-prompt-fragment{position:absolute;pointer-events:none}
.gift-invitation--fragment{opacity:1!important;scale:1!important;animation:none!important;transition:none!important}
.gift-invitation--fragment .gift-invitation__touch{animation:none!important}
[data-gift-state="requested"]>.gift-invitation,[data-gift-state="opening"]>.gift-invitation{visibility:hidden}