/* Live game page */

.scorebug { position: sticky; top: 0; z-index: 50; }

/* ── Score animation ── */
.score-num { transition: all 0.3s ease; }
.score-num.changed { animation: scorePop 0.4s ease-out; }
@keyframes scorePop {
    0%   { transform: scale(1.3); color: #f97316; }
    100% { transform: scale(1); }
}

/* ── Live pulse ── */
.pulse-live { animation: pulseLive 1.5s ease-in-out infinite; }
@keyframes pulseLive { 0%, 100% { opacity: 1; } 50% { opacity: 0.3; } }

/* ── Play feed ── */
.play-entry { animation: slideIn 0.3s ease-out; }
@keyframes slideIn {
    from { opacity: 0; transform: translateX(-20px); }
    to   { opacity: 1; transform: translateX(0); }
}

/* ── Row flash on score update ── */
.row-flash { animation: rowFlash 0.8s ease-out; }
@keyframes rowFlash {
    0%   { background-color: rgba(249, 115, 22, 0.3); }
    100% { background-color: transparent; }
}

/* ── Alert banner ── */
.alert-banner { animation: alertSlide 0.4s ease-out; }
@keyframes alertSlide {
    from { transform: translateY(-100%); opacity: 0; }
    to   { transform: translateY(0); opacity: 1; }
}

.alert-exit { animation: alertExit 0.4s ease-in forwards; }
@keyframes alertExit { to { transform: translateY(-100%); opacity: 0; } }

/* ── Tab states ── */
.tab-active   { border-bottom: 2px solid #f97316; color: white; }
.tab-inactive { border-bottom: 2px solid transparent; color: #9ca3af; }