/* SongDrop Live Voting Control */
.sd-voting-state {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr);
    gap: 11px;
    align-items: center;
    margin: 0 0 14px;
    padding: 12px 14px;
    border: 1px solid rgba(117, 224, 255, .18);
    border-radius: 16px;
    background: rgba(3, 13, 24, .62);
}
.sd-voting-state__icon {
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    border-radius: 12px;
    font-size: 16px;
    font-weight: 950;
}
.sd-voting-state span:last-child { display: grid; gap: 3px; }
.sd-voting-state strong { color: var(--text, #eaf8ff); font-size: 13px; font-weight: 950; }
.sd-voting-state small { color: var(--muted, #8da6b8); font-size: 11px; line-height: 1.45; }
.sd-voting-state.is-open { border-color: rgba(34, 255, 154, .34); background: linear-gradient(90deg, rgba(34,255,154,.10), rgba(0,217,255,.045)), rgba(3,13,24,.62); }
.sd-voting-state.is-open .sd-voting-state__icon { color: #001219; background: linear-gradient(135deg, var(--cyan, #00d9ff), var(--green, #22ff9a)); }
.sd-voting-state.is-closed { border-color: rgba(255, 211, 106, .25); background: linear-gradient(90deg, rgba(255,211,106,.07), transparent), rgba(3,13,24,.62); }
.sd-voting-state.is-closed .sd-voting-state__icon { color: #ffeab6; border: 1px solid rgba(255,211,106,.26); background: rgba(255,211,106,.08); }
.vote-btn.is-voting-locked { color: rgba(234,248,255,.58); border-color: rgba(141,166,184,.22); background: rgba(141,166,184,.08); box-shadow: none; }
.vote-btn.is-voting-locked .vote-icon::before { content: '🔒'; }
.vote-btn.is-voting-locked .vote-icon { font-size: 0; }
.vote-btn.is-voting-locked .vote-icon::before { font-size: 12px; }
@media (max-width: 680px) { .sd-voting-state { align-items: start; } }


/* Live reveal: Wird automatisch ausgelöst, wenn das Admincenter Voting freigibt. */
.sd-voting-live-notice {
    position: fixed;
    z-index: 1200;
    left: 50%;
    top: max(18px, env(safe-area-inset-top));
    width: min(560px, calc(100% - 28px));
    display: grid;
    grid-template-columns: 46px minmax(0, 1fr);
    gap: 12px;
    align-items: center;
    padding: 14px 16px;
    color: #001219;
    border: 1px solid rgba(234, 255, 250, .52);
    border-radius: 20px;
    background: linear-gradient(100deg, #00d9ff, #22ff9a);
    box-shadow: 0 20px 60px rgba(0, 217, 255, .26), 0 0 36px rgba(34, 255, 154, .28);
    transform: translate(-50%, -18px) scale(.96);
    opacity: 0;
    pointer-events: none;
    transition: opacity .24s ease, transform .34s cubic-bezier(.2, .9, .2, 1);
}
.sd-voting-live-notice.is-showing {
    transform: translate(-50%, 0) scale(1);
    opacity: 1;
}
.sd-voting-live-notice__icon {
    width: 46px;
    height: 46px;
    display: grid;
    place-items: center;
    border-radius: 15px;
    color: #eaffff;
    background: rgba(0, 18, 25, .20);
    box-shadow: inset 0 0 0 1px rgba(234, 255, 250, .34);
    font-size: 22px;
}
.sd-voting-live-notice strong,
.sd-voting-live-notice span { display: block; }
.sd-voting-live-notice strong {
    margin-bottom: 2px;
    font-size: 15px;
    font-weight: 950;
    letter-spacing: .01em;
}
.sd-voting-live-notice span { font-size: 12px; font-weight: 800; line-height: 1.35; }

.sd-voting-state.is-live-reveal {
    animation: sdVotingStateReveal 1.05s cubic-bezier(.2,.8,.2,1) both;
}
.sd-voting-state.is-live-locked { animation: sdVotingLocked .6s ease both; }
.sd-ranking-panel.is-voting-live-reveal,
.playlist-panel.is-voting-live-reveal {
    animation: sdVotingPanelReveal 1.15s ease both;
}
.sd-voting-opening .vote-btn:not(.is-voted):not(.is-voting-locked) {
    animation: sdVoteButtonReady .92s ease both;
}

@keyframes sdVotingStateReveal {
    0% { transform: scale(.96); filter: brightness(.86); }
    35% { transform: scale(1.018); filter: brightness(1.28); box-shadow: 0 0 0 1px rgba(34,255,154,.52), 0 0 42px rgba(34,255,154,.42); }
    100% { transform: scale(1); filter: none; }
}
@keyframes sdVotingPanelReveal {
    0% { box-shadow: 0 0 0 rgba(34,255,154,0); }
    35% { box-shadow: 0 0 0 2px rgba(34,255,154,.18), 0 0 66px rgba(34,255,154,.19); }
    100% { box-shadow: 0 0 0 rgba(34,255,154,0); }
}
@keyframes sdVoteButtonReady {
    0% { transform: scale(.94); filter: brightness(.9); }
    55% { transform: scale(1.08); filter: brightness(1.34); box-shadow: 0 0 30px rgba(34,255,154,.46); }
    100% { transform: scale(1); filter: none; }
}
@keyframes sdVotingLocked {
    0%,100% { transform: translateX(0); }
    25% { transform: translateX(-4px); }
    50% { transform: translateX(4px); }
    75% { transform: translateX(-2px); }
}
@media (max-width:680px) {
    .sd-voting-live-notice { grid-template-columns: 40px minmax(0,1fr); padding: 12px 13px; border-radius: 16px; }
    .sd-voting-live-notice__icon { width: 40px; height: 40px; border-radius: 13px; font-size: 19px; }
    .sd-voting-live-notice strong { font-size: 13px; }
    .sd-voting-live-notice span { font-size: 11px; }
}