/* ─── Keyframes ──────────────────────────────────────────────────────────── */
@keyframes tr-shimmer {
    0%   { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

@keyframes tr-bounce-scale {
    0%   { transform: scale(1); }
    30%  { transform: scale(1.4); }
    60%  { transform: scale(0.9); }
    100% { transform: scale(1); }
}

@keyframes tr-particle-burst {
    0%   { opacity: 1; transform: translate(0,0) scale(1); }
    100% { opacity: 0; transform: translate(var(--dx), var(--dy)) scale(0); }
}

@keyframes tr-fade-in {
    from { opacity: 0; transform: translateY(10px); }
    to   { opacity: 1; transform: translateY(0); }
}

@keyframes tr-fade-in-up {
    from { opacity: 0; transform: translateY(20px); }
    to   { opacity: 1; transform: translateY(0); }
}

@keyframes tr-slide-in-left {
    from { opacity: 0; transform: translateX(-20px); }
    to   { opacity: 1; transform: translateX(0); }
}

@keyframes tr-pulse {
    0%, 100% { opacity: 1; }
    50%       { opacity: 0.5; }
}

@keyframes tr-spin {
    to { transform: rotate(360deg); }
}

@keyframes tr-glow-pulse {
    0%, 100% { box-shadow: 0 0 8px rgba(255,215,0,0.2); }
    50%       { box-shadow: 0 0 24px rgba(255,215,0,0.5); }
}

/* ─── Utilities ──────────────────────────────────────────────────────────── */
.tr-fade-in     { animation: tr-fade-in 0.35s ease both; }
.tr-fade-in-up  { animation: tr-fade-in-up 0.4s ease both; }
.tr-slide-left  { animation: tr-slide-in-left 0.35s ease both; }
.tr-pulse       { animation: tr-pulse 2s ease-in-out infinite; }

/* Staggered entrance for grid children */
.tr-feed .tr-video-card,
.tr-talent-grid .tr-talent-card,
.tr-leaderboard-list .tr-leaderboard-row {
    animation: tr-fade-in-up 0.4s ease both;
}
.tr-feed .tr-video-card:nth-child(1),
.tr-talent-grid .tr-talent-card:nth-child(1) { animation-delay: 0.05s; }
.tr-feed .tr-video-card:nth-child(2),
.tr-talent-grid .tr-talent-card:nth-child(2) { animation-delay: 0.1s; }
.tr-feed .tr-video-card:nth-child(3),
.tr-talent-grid .tr-talent-card:nth-child(3) { animation-delay: 0.15s; }
.tr-feed .tr-video-card:nth-child(4),
.tr-talent-grid .tr-talent-card:nth-child(4) { animation-delay: 0.2s; }
.tr-feed .tr-video-card:nth-child(n+5),
.tr-talent-grid .tr-talent-card:nth-child(n+5) { animation-delay: 0.25s; }

/* ─── Reaction bounce ────────────────────────────────────────────────────── */
.tr-reaction-btn.tr-animating {
    animation: tr-bounce-scale 0.4s cubic-bezier(0.36, 0.07, 0.19, 0.97) both;
}

/* Emoji particle */
.tr-particle {
    position: fixed;
    pointer-events: none;
    font-size: 20px;
    z-index: 9999;
    animation: tr-particle-burst 0.6s ease-out forwards;
}

/* ─── Sidebar entrance ───────────────────────────────────────────────────── */
.tr-sidebar { animation: tr-slide-in-left 0.3s ease; }

/* ─── Video card hover glow ──────────────────────────────────────────────── */
.tr-video-card:hover .tr-video-card__badge { animation: tr-glow-pulse 2s ease-in-out infinite; }

/* ─── Button press ───────────────────────────────────────────────────────── */
.tr-btn:active:not(:disabled) { transform: scale(0.97); }

/* ─── Page transitions ───────────────────────────────────────────────────── */
.tr-main { animation: tr-fade-in 0.3s ease; }

/* ─── Podium bars ────────────────────────────────────────────────────────── */
.tr-podium__bar { animation: tr-fade-in-up 0.6s ease both; }
.tr-podium__item--Gold .tr-podium__bar    { animation-delay: 0.1s; }
.tr-podium__item--Silver .tr-podium__bar  { animation-delay: 0.2s; }
.tr-podium__item--Bronze .tr-podium__bar  { animation-delay: 0.3s; }

/* ─── Season banner countdown flash ─────────────────────────────────────── */
.tr-countdown--urgent { animation: tr-pulse 1s ease-in-out infinite; color: var(--tr-danger) !important; }

/* ─── Spinner ────────────────────────────────────────────────────────────── */
.tr-spinner {
    display: inline-block;
    width: 20px;
    height: 20px;
    border: 2px solid var(--tr-border);
    border-top-color: var(--tr-primary);
    border-radius: 50%;
    animation: tr-spin 0.8s linear infinite;
}

/* ─── Auth card entrance ─────────────────────────────────────────────────── */
.tr-auth-card { animation: tr-fade-in-up 0.45s ease; }
.tr-role-card  { animation: tr-fade-in-up 0.4s ease both; }
.tr-role-card:nth-child(2) { animation-delay: 0.08s; }