.call-workspace--modern { position: relative; }
.call-workspace--modern .call-stage { position: relative; }
.call-halloween-mascot {
    position: absolute;
    z-index: 24;
    width: clamp(58px, 7vw, 88px);
    height: clamp(58px, 7vw, 88px);
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: transparent;
    cursor: pointer;
    filter: drop-shadow(0 0 10px rgba(249, 174, 89, .32));
    animation: call-halloween-float 2.8s ease-in-out infinite;
    transition: filter .2s ease, scale .2s ease;
}
.call-halloween-mascot:hover:not(:disabled),
.call-halloween-mascot:focus-visible { filter: drop-shadow(0 0 18px rgba(255, 191, 113, .72)); scale: 1.14; }
.call-halloween-mascot:focus-visible { outline: 2px solid #d2a6ff; outline-offset: 4px; }
.call-halloween-mascot:disabled { cursor: wait; filter: drop-shadow(0 0 18px rgba(183, 146, 255, .76)); }
.call-halloween-mascot svg { display: block; width: 100%; height: 100%; overflow: visible; }
.call-halloween-mixer {
    display: inline-grid;
    grid-template-columns: auto auto minmax(58px, 92px) auto;
    align-items: center;
    gap: 7px;
    min-height: 34px;
    padding: 4px 10px;
    border: 1px solid var(--color-border-subtle);
    border-radius: var(--radius-md);
    color: var(--color-text-secondary);
    background: color-mix(in srgb, var(--color-bg-surface) 88%, transparent);
    font-size: 12px;
}
.call-halloween-mixer[hidden], .call-halloween-mixer.hidden { display: none; }
.call-halloween-mixer > span:first-child { color: #d7aeff; font-size: 16px; }
.call-halloween-mixer input { width: 100%; min-width: 58px; accent-color: #b895ff; }
.call-halloween-mixer output { min-width: 32px; color: var(--color-text-primary); font-variant-numeric: tabular-nums; text-align: right; }
@container (max-width: 760px) {
    .call-halloween-mixer { grid-template-columns: auto minmax(52px, 76px) auto; gap: 5px; padding-inline: 7px; }
    .call-halloween-mixer-label { display: none; }
}
.call-workspace--modern.halloween-party-dancing [data-avatar-frame] > .avatar-costume-art svg {
    transform-box: fill-box;
    transform-origin: 50% 76%;
    animation: call-halloween-dance var(--halloween-dance-duration, 2.1s) ease-in-out var(--halloween-dance-delay, 0s) infinite;
}
@keyframes call-halloween-float {
    0%, 100% { translate: 0 0; rotate: -3deg; }
    50% { translate: 0 -8px; rotate: 4deg; }
}
@keyframes call-halloween-dance {
    0%, 100% { transform: rotate(-7deg) scale(.96); }
    25% { transform: rotate(6deg) scale(1.06); }
    50% { transform: rotate(9deg) scale(.94); }
    75% { transform: rotate(-5deg) scale(1.08); }
}
@media (prefers-reduced-motion: reduce) {
    .call-halloween-mascot, .call-workspace--modern.halloween-party-dancing [data-avatar-frame] > .avatar-costume-art svg { animation-duration: 7s; }
}