/* MilkyWay Live alien (live-alien.js): living 3D alien on the join / request buttons and its finger-press reaction. */
.mwx-alien{display:block;width:100%;height:100%;perspective:140px;pointer-events:none}
.mwx-alien svg{display:block;width:100%!important;height:100%!important;overflow:visible;fill:none;stroke:none;transform-origin:50% 100%;filter:drop-shadow(0 2px 2px rgba(0,0,0,.45)) drop-shadow(0 0 6px rgba(120,255,170,.35));transition:transform .13s cubic-bezier(.3,.7,.4,1)}
.mwx-alien g,.mwx-alien path,.mwx-alien ellipse,.mwx-alien circle{transform-box:view-box}
.mwxa-body{transform-origin:32px 63px;animation:mwxa-breathe 3.2s ease-in-out infinite}
.mwxa-head{transform-origin:32px 48px;animation:mwxa-look 7.5s ease-in-out infinite}
.mwxa-shadow{transform-origin:32px 61.5px;animation:mwxa-shadow 3.2s ease-in-out infinite}
.mwxa-antenna-l{transform-origin:24.5px 13.5px;animation:mwxa-sway 2.6s ease-in-out infinite}
.mwxa-antenna-r{transform-origin:39.5px 13.5px;animation:mwxa-sway 2.6s ease-in-out -1.3s infinite reverse}
.mwxa-orb{animation:mwxa-orb 1.8s ease-in-out infinite}
.mwxa-lid{transform-origin:32px 21px;transform:scaleY(0);animation:mwxa-blink 4.8s ease-in-out infinite}
.mwxa-shine{animation:mwxa-glint 7.5s ease-in-out infinite}
.mwxa-arm{transform-origin:43px 53px;animation:mwxa-raise 1.5s ease-in-out infinite}
.mwxa-hand{transform-origin:53px 33px;animation:mwxa-wave 1.5s ease-in-out infinite}
@keyframes mwxa-breathe{0%,100%{transform:scale(1,1)}50%{transform:scale(.985,1.035)}}
@keyframes mwxa-shadow{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(.92);opacity:.8}}
@keyframes mwxa-look{0%,18%,100%{transform:rotate(0) translateX(0)}28%,40%{transform:rotate(-5deg) translateX(-.6px)}52%,60%{transform:rotate(0)}70%,82%{transform:rotate(4deg) translateX(.6px)}}
@keyframes mwxa-glint{0%,18%,52%,60%,100%{transform:translateX(0)}28%,40%{transform:translateX(-.8px)}70%,82%{transform:translateX(.8px)}}
@keyframes mwxa-sway{0%,100%{transform:rotate(-7deg)}50%{transform:rotate(7deg)}}
@keyframes mwxa-orb{0%,100%{opacity:1}50%{opacity:.6}}
@keyframes mwxa-blink{0%,90%,100%{transform:scaleY(0)}94%{transform:scaleY(1)}}
@keyframes mwxa-raise{0%,100%{transform:rotate(0)}50%{transform:rotate(-7deg)}}
@keyframes mwxa-wave{0%,100%{transform:rotate(-12deg)}50%{transform:rotate(14deg)}}

/* Touch: bends back under the finger and squints; release: steps back, then springs up */
.mwx-alien-touch{touch-action:manipulation;-webkit-tap-highlight-color:transparent}
.mwx-alien-touch.is-touched .mwx-alien svg{transform:rotateX(26deg) translateY(2px) scale(.9,.82)}
.mwx-alien-touch.is-touched .mwxa-lid,.mwx-alien-touch.is-recoil .mwxa-lid{animation:none;transform:scaleY(.6)}
.mwx-alien-touch.is-touched .mwxa-mouth{transform-origin:32px 40px;transform:scale(.7,1.6)}
.mwx-alien-touch.is-recoil .mwx-alien svg{animation:mwxa-recoil .58s cubic-bezier(.25,.8,.35,1.15) both}
.mwx-alien-touch.is-recoil .mwxa-antenna-l,.mwx-alien-touch.is-recoil .mwxa-antenna-r{animation:mwxa-boing .58s ease-out both}
.mwx-alien-touch::after{content:"";position:absolute;inset:-4px;border-radius:50%;border:2px solid rgba(190,255,215,.9);opacity:0;pointer-events:none;transform:scale(.6)}
.mwx-alien-touch.is-recoil::after{animation:mwxa-ripple .55s ease-out both}
@keyframes mwxa-recoil{0%{transform:rotateX(26deg) translateY(2px) scale(.9,.82)}28%{transform:rotateX(14deg) translateY(-1px) translateZ(-26px) scale(.86)}58%{transform:rotateX(-6deg) translateY(-3px) scale(1.07,1.05)}80%{transform:rotateX(2deg) scale(.98,1)}100%{transform:none}}
@keyframes mwxa-boing{0%{transform:rotate(-20deg)}35%{transform:rotate(18deg)}65%{transform:rotate(-9deg)}100%{transform:rotate(0)}}
@keyframes mwxa-ripple{0%{opacity:.9;transform:scale(.6)}100%{opacity:0;transform:scale(1.35)}}

/* Seat badge (bottom-left of the open guest seat): enlarged so the alien reads clearly; cyan for guests, gold for the host */
@keyframes mwxa-beckon{0%,100%{box-shadow:0 0 0 2px rgba(2,6,23,.6),0 0 10px rgba(34,211,238,.45)}50%{box-shadow:0 0 0 2px rgba(2,6,23,.6),0 0 22px rgba(34,211,238,.85)}}

/* Side "join the stage" button uses the same alien */
.mw-live-actions #mwLiveRequest{width:48px;height:48px;min-height:48px!important;padding:2px!important;overflow:visible}
.mw-live-actions #mwLiveRequest>.mwx-alien{width:44px;height:44px}
.mwx-live .mw-live-actions #mwLiveRequest[data-pending="true"]{background:rgba(250,204,21,.35)!important}

/* Auto-accept switch (Go LIVE form and the host's live settings) */
.mwx-auto-accept span{display:flex;flex-direction:column;gap:2px}
.mwx-auto-accept small{opacity:.75;font-size:.74rem}
.mwx-live-auto{display:flex;align-items:center;gap:12px;margin:10px 0;padding:12px 14px;border-radius:16px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.18);cursor:pointer}
.mwx-live-auto span{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.mwx-live-auto b{font-size:.92rem}
.mwx-live-auto small{opacity:.8;font-size:.76rem;line-height:1.3}
.mwx-live-auto input{appearance:none;-webkit-appearance:none;position:relative;flex:0 0 48px;width:48px!important;height:28px!important;min-height:28px!important;margin:0;border-radius:14px;background:rgba(148,163,184,.45);border:1px solid rgba(255,255,255,.3);cursor:pointer;transition:background .2s ease}
.mwx-live-auto input::after{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#fff;box-shadow:0 2px 6px rgba(0,0,0,.35);transition:transform .2s cubic-bezier(.3,.8,.4,1.2)}
.mwx-live-auto input:checked{background:linear-gradient(135deg,#22c55e,#14b8a6)}
.mwx-live-auto input:checked::after{transform:translateX(20px)}
.mwx-live-auto input:focus-visible{outline:2px solid #67e8f9;outline-offset:2px}
.mwx-live-auto input:disabled{opacity:.55;cursor:wait}
#mwLiveLayoutControls .mwx-admission-native{display:none}

/* "Tap anywhere to hear" chip when the browser blocked autoplay sound */
.mwx-tap-hear{position:absolute;z-index:12;left:50%;top:calc(120px + var(--safe-top,0px));transform:translateX(-50%);display:flex;align-items:center;gap:8px;padding:9px 16px;border:1px solid rgba(255,255,255,.3);border-radius:999px;background:rgba(15,23,42,.55);color:#fff;font:inherit;font-size:.84rem;font-weight:700;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 8px 24px rgba(0,0,0,.35);cursor:pointer;animation:mwxa-orb 1.8s ease-in-out infinite}
.mwx-tap-hear[hidden]{display:none}
.mwx-tap-hear svg{width:18px;height:18px}

@media(prefers-reduced-motion:reduce){.mwx-alien *,.mwx-alien svg,.mwx-tap-hear,.mwx-alien-touch::after{animation:none!important}.mwxa-lid{transform:scaleY(0)}}
.mwx-auto-accept[hidden],.mwx-live-auto[hidden]{display:none!important}

.mwx-seat[data-state="empty"] .mwx-seat-face>.mwx-alien{display:none}
.mw-live-actions #mwLiveHostAlien{width:48px;height:48px;min-height:48px!important;padding:2px!important;overflow:visible;background:radial-gradient(circle at 35% 30%,rgba(254,240,138,.7),rgba(180,83,9,.8) 72%)!important;border-color:rgba(250,204,21,.7)!important}
.mw-live-actions #mwLiveHostAlien[hidden]{display:none!important}
.mw-live-actions #mwLiveHostAlien>.mwx-alien{width:44px;height:44px}
.mw-live-actions #mwLiveHostAlien .mwx-alien-count{position:absolute;top:-8px;right:-4px;min-width:19px;height:19px;padding:0 5px;box-sizing:border-box;border-radius:10px;display:grid;place-items:center;background:#FF2D55;color:#fff;font-size:.64rem;font-weight:900;box-shadow:0 0 0 2px rgba(2,6,23,.7)}
.mw-live-actions #mwLiveHostAlien .mwx-alien-count[hidden]{display:none}
.mw-live-actions #mwLiveHostAlien[data-pending]:not([data-pending="0"]){animation:mwxa-beckon 2.8s ease-in-out infinite}
/* Multi-guest layouts hide the decorative seat aliens; the docked join / request alien must stay visible in every layout */
#mwLiveStage .mw-live-actions .mwx-alien{display:block!important}
.mw-live-actions #mwLiveRequest>.mwx-alien{position:relative;clip:auto;overflow:visible}
