.dance-invite{display:flex;align-items:center;gap:14px;width:100%;padding:13px 18px;margin:0 0 16px;border:1px solid #d0a4f0;border-radius:16px;background:linear-gradient(110deg,#582286,#25214b);color:#fff;text-align:left;box-shadow:0 5px 18px #63408b25}.dance-invite-icon{font-size:32px;color:#ffdf83}.dance-invite>span:nth-child(2){flex:1}.dance-invite b{display:block;font-size:16px}.dance-invite small{display:block;font-size:11px;color:#ecd6ff;margin-top:4px}.dance-invite>strong{font-size:12px;background:#ffd075;color:#623524;border-radius:12px;padding:9px 14px}
.daylight .dance-dialog{width:min(1240px,calc(100% - 24px));max-width:1240px;max-height:95dvh;overflow:auto;background:linear-gradient(135deg,#211a3c,#151b35);border:1px solid #bd8ed2;color:#f5e9ff;padding:26px;box-shadow:0 20px 100px #140c3e99}.dance-dialog .dialog-close{color:#ffe4b3}.dance-heading{text-align:center;margin-bottom:20px}.dance-heading>span{font-size:10px;letter-spacing:1.4px;color:#ffd48e}.dance-heading h2{font-size:32px;color:#fff0d4;margin:8px 0}.dance-heading p{font-size:12px;color:#d5bfec;margin:6px}.dance-layout{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:20px}.dance-main{min-width:0}.dance-now{display:flex;align-items:center;gap:10px;justify-content:space-between;padding:10px 12px;background:#ffffff0a;border:1px solid #ffffff18;border-radius:14px 14px 0 0;font-size:10px;color:#ecd4ff}.dance-now b{flex:1;text-align:center;color:#ffe2a7;font-size:13px}
.dance-stage{min-height:390px;position:relative;overflow:hidden;border:1px solid #d5a4ff66;background:radial-gradient(ellipse at 50% 80%,#783da9 0,#302052 50%,#171b35 100%);isolation:isolate;border-radius:0 0 22px 22px}.dance-stage:after{content:'';position:absolute;inset:62% -20% -30%;z-index:-1;background:repeating-linear-gradient(0deg,transparent 0 38px,#f1b4ff44 39px 40px),repeating-linear-gradient(90deg,#452663 0 58px,#e6adff66 59px 60px);transform:perspective(250px) rotateX(35deg);box-shadow:0 -5px 70px #d286ff44}.dance-lights{position:absolute;inset:0;z-index:-1;background:conic-gradient(from -35deg at 15% -20%,transparent 0deg,#ff84c933 18deg,transparent 35deg),conic-gradient(from -35deg at 85% -20%,transparent 0deg,#76f1ff33 18deg,transparent 35deg)}.is-dancing .dance-lights{animation:dance-lights calc(var(--beat)*8) ease-in-out infinite alternate}.dance-disco{position:absolute;top:16px;left:calc(50% - 20px);font-size:40px;color:#ffda85;text-shadow:0 0 30px #ffb8ec}.is-dancing .dance-disco{animation:dance-disco calc(var(--beat)*4) linear infinite}.dance-speaker{position:absolute;bottom:22px;background:#191828;border:3px solid #8c6eaa;border-radius:12px;padding:8px 4px;font-size:30px;line-height:1.2;color:#9b69b8;box-shadow:0 0 18px #e49af133}.speaker-left{left:12px}.speaker-right{right:12px}.is-dancing .dance-speaker{animation:dance-boom var(--beat) ease-out infinite}
.dance-people{position:relative;display:flex;justify-content:center;align-items:flex-end;flex-wrap:wrap;gap:15px;padding:84px 62px 45px;min-height:390px;max-height:55dvh;overflow:auto}.dance-person{text-align:center;width:108px;position:relative}.dance-figure{position:relative;width:108px;height:142px;transform-origin:50% 100%;filter:drop-shadow(0 10px 5px #08071b77)}.dance-figure img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}.dance-up{visibility:hidden}.is-dancing .dance-figure{animation:dance-noodle calc(var(--beat)*2) ease-in-out infinite;animation-delay:var(--phase)}.is-dancing [data-move=shoulder] .dance-figure{animation-name:dance-shoulder}.is-dancing [data-move=crab] .dance-figure{animation-name:dance-crab}.is-dancing [data-move=spin] .dance-figure{animation-name:dance-spin;animation-duration:calc(var(--beat)*4)}.is-dancing .dance-up{animation:dance-hand calc(var(--beat)*2) steps(1,end) infinite;animation-delay:var(--phase)}.is-dancing .dance-down{animation:dance-hand-down calc(var(--beat)*2) steps(1,end) infinite;animation-delay:var(--phase)}.dance-name{display:block;font-size:11px;color:#fff1ca;background:#170f2e99;border:1px solid #a678c855;border-radius:20px;padding:5px 7px;overflow-wrap:anywhere}.is-me .dance-name{border-color:#ffdd86;color:#ffe5a0}.dance-person small{display:block;font-size:9px;color:#e6c0fa;margin-top:5px}.dance-empty{position:absolute;inset:120px 50px auto;text-align:center;pointer-events:none}.dance-empty strong{display:block;font-size:20px;color:#ffe6a8}.dance-empty span{display:block;margin-top:12px;font-size:12px;color:#dac1ed}.dance-stage-label{position:absolute;bottom:10px;left:0;right:0;text-align:center;pointer-events:none;font-size:8px;letter-spacing:1.5px;color:#e6c1f2}.dance-reactions{position:absolute;inset:0;pointer-events:none;overflow:hidden}.dance-reactions span{position:absolute;bottom:10%;font-size:42px;animation:dance-heart 3.5s ease-out forwards}
.dance-membership{display:flex;align-items:center;flex-wrap:wrap;justify-content:center;gap:8px;margin:15px 0 8px}.dance-dialog button{border:1px solid #b789ca55;border-radius:11px;padding:9px 12px;background:#4a2d6f;color:#fff1d0;font-weight:600;font-size:12px}.dance-dialog button:disabled{opacity:.45;cursor:not-allowed}.dance-dialog #dance-join,.dance-dialog #dance-play{background:linear-gradient(110deg,#ffd67d,#ffab78);color:#5b2943;border-color:#ffe9ac}.dance-dialog .dialog-close{position:absolute;top:9px;right:12px;background:none;border:0;font-size:25px;padding:4px 10px}.dance-membership label{display:flex;align-items:center;gap:6px;font-size:10px;color:#d5c0e6}.dance-membership input{width:85px;accent-color:#e5a1fd}#dance-status{text-align:center;min-height:18px;color:#ddc9ed;font-size:11px;line-height:1.6}.dance-moves,.dance-emojis{display:flex;gap:7px;flex-wrap:wrap;justify-content:center}.dance-moves button{font-size:11px;background:#ffffff09}.dance-moves button[aria-pressed=true]{background:#9760be;color:#fff2c8;border-color:#ffd681}.dance-emojis{margin-top:10px}.dance-emojis button{font-size:22px;padding:6px 13px}.dance-playlist{background:#ffffff08;border:1px solid #be8bdd44;border-radius:20px;padding:18px;align-self:start}.dance-playlist h3{margin:0 0 8px;font-size:21px;color:#ffe3a7}.dance-playlist p{font-size:11px;color:#d9c4eb;line-height:1.8}.dance-playlist label{font-size:11px;color:#e0c5ef}.dance-playlist select{display:block;width:100%;background:#352247;color:#ffe6b4;padding:10px;border:1px solid #9a70b5;border-radius:10px;margin:8px 0 12px;font-size:12px}.dance-playlist select:disabled{opacity:.65}.dance-dj-buttons{display:flex;gap:7px;flex-wrap:wrap}.dance-rules{margin-top:20px;border-top:1px solid #ffffff15;padding-top:15px}.dance-rules b{font-size:12px;color:#ffdda2}.dance-dialog [hidden]{display:none!important}
@keyframes dance-noodle{0%,100%{transform:rotate(-9deg) translateY(0)}50%{transform:rotate(9deg) translateY(-13px) scaleY(1.04)}}@keyframes dance-shoulder{0%,100%{transform:rotate(-14deg) skewX(-5deg)}50%{transform:rotate(14deg) skewX(5deg) translateY(-5px)}}@keyframes dance-crab{0%,100%{transform:translateX(-13px) rotate(-5deg) scaleY(.94)}50%{transform:translateX(13px) rotate(5deg) scaleY(.94)}}@keyframes dance-spin{0%{transform:rotate(-8deg) scaleX(1)}25%{transform:rotate(8deg) scaleX(.35) translateY(-12px)}50%{transform:rotate(-8deg) scaleX(-1)}75%{transform:rotate(8deg) scaleX(-.35) translateY(-12px)}100%{transform:rotate(-8deg) scaleX(1)}}@keyframes dance-hand{0%{visibility:hidden}50%{visibility:visible}}@keyframes dance-hand-down{0%{visibility:visible}50%{visibility:hidden}}@keyframes dance-boom{0%{transform:scale(1.04);box-shadow:0 0 25px #ee92d855}100%{transform:scale(1)}}@keyframes dance-lights{to{transform:scaleX(-1)}}@keyframes dance-disco{to{transform:rotate(360deg)}}@keyframes dance-heart{to{transform:translateY(-330px) rotate(20deg);opacity:0}}
@media(max-width:850px){.dance-layout{grid-template-columns:1fr}.daylight .dance-dialog{padding:22px 12px}.dance-heading h2{font-size:23px}.dance-heading>span{font-size:8px}.dance-people{padding:65px 34px 40px;gap:8px;min-height:300px}.dance-stage{min-height:300px}.dance-person{width:82px}.dance-figure{width:82px;height:111px}.dance-speaker{font-size:20px;padding:5px 1px}.speaker-left{left:5px}.speaker-right{right:5px}.dance-now{flex-wrap:wrap}.dance-now b{min-width:70%;order:3}.dance-empty{inset:100px 30px auto}.dance-empty strong{font-size:17px}.dance-invite{padding:10px;gap:9px}.dance-invite b{font-size:13px}.dance-invite small{font-size:9px}.dance-invite>strong{font-size:10px;padding:8px}.dance-playlist{padding:13px}}
/* Joining the dance explicitly opts into character motion. The player can turn it off. */
.dance-dialog:not(.dance-motion-on) .dance-figure,.dance-dialog:not(.dance-motion-on) .dance-figure img,.dance-dialog:not(.dance-motion-on) .dance-lights,.dance-dialog:not(.dance-motion-on) .dance-disco,.dance-dialog:not(.dance-motion-on) .dance-speaker,.dance-dialog:not(.dance-motion-on) .dance-reactions span{animation:none!important}
.dance-dialog:not(.dance-motion-on) .dance-up{display:none}
@media(prefers-reduced-motion:reduce){.dance-dialog:not(.dance-motion-on) *{animation:none!important}}


/* Temporarily hide dance entry points while the visual effects are revised. */
#dance-open[hidden],#dance-open-small[hidden]{display:none!important}