/* Race TV view — full-screen, dark, large type */
.tv-page {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    font-variant-numeric: tabular-nums;
    font-family: 'Inter', system-ui, sans-serif;
}

.tv-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: clamp(12px, 1.5vw, 24px) clamp(16px, 2vw, 32px);
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    gap: 16px;
}
.tv-header__title { font-size: clamp(18px, 2vw, 32px); font-weight: 600; letter-spacing: 0.02em; }
.tv-header__meta  { display: flex; align-items: center; gap: 16px; font-size: clamp(14px, 1.4vw, 22px); color: #cbd5e1; }

.tv-status {
    padding: 0.25em 0.75em;
    border-radius: 999px;
    font-size: clamp(12px, 1.2vw, 18px);
    font-weight: 600;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}
.tv-status--scheduled { background: #3f3f46; color: #f5f5f5; }
.tv-status--running   { background: #dc2626; color: #fff; animation: tv-pulse 1.4s ease-in-out infinite; }
.tv-status--stopped   { background: #f59e0b; color: #1a1a1a; }
.tv-status--final     { background: #16a34a; color: #fff; }
.tv-status--cancelled { background: #525252; color: #f5f5f5; }
@keyframes tv-pulse {
    0%, 100% { opacity: 1; }
    50%      { opacity: 0.55; }
}

.tv-body { flex: 1; padding: clamp(8px, 1vw, 16px) clamp(16px, 2vw, 32px); overflow: hidden; }

.tv-leaderboard {
    width: 100%;
    border-collapse: collapse;
    font-size: clamp(20px, 2.2vw, 36px);
}
.tv-leaderboard th {
    text-align: left;
    font-size: clamp(12px, 1.2vw, 16px);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: #94a3b8;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    padding: 8px 12px;
}
.tv-leaderboard td {
    padding: 10px 12px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.04);
}
.tv-leaderboard tr { transition: transform 300ms ease; }
.tv-row--pos1 .tv-cell--pos { color: var(--accent); font-weight: 700; }
.tv-cell--pos   { width: 3ch; }
.tv-cell--num   { width: 4ch; color: #94a3b8; }
.tv-cell--racer { font-weight: 600; }
.tv-cell--laps  { width: 5ch;  text-align: right; }
.tv-cell--last  { width: 10ch; text-align: right; }
.tv-cell--best  { width: 10ch; text-align: right; color: #a3e635; }
.tv-cell--gap   { width: 10ch; text-align: right; color: #cbd5e1; }

.tv-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 12px;
}
.tv-grid__row {
    background: #18181b;
    border-radius: 8px;
    padding: 14px 16px;
    display: flex;
    align-items: baseline;
    gap: 12px;
    font-size: clamp(18px, 1.6vw, 24px);
}
.tv-grid__num { color: var(--accent); font-weight: 700; min-width: 3ch; }

.tv-ticker {
    margin-top: auto;
    padding: clamp(10px, 1.2vw, 18px) clamp(16px, 2vw, 32px);
    background: #18181b;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
    font-size: clamp(18px, 1.6vw, 26px);
    transition: background 200ms;
}
.tv-ticker--flash { background: var(--accent); color: #1a1a1a; }
.tv-ticker__label { font-size: 0.7em; letter-spacing: 0.1em; text-transform: uppercase; color: #94a3b8; margin-right: 12px; }

.tv-reconnect {
    position: fixed;
    bottom: 12px;
    right: 12px;
    padding: 8px 14px;
    background: rgba(245, 158, 11, 0.9);
    color: #1a1a1a;
    border-radius: 6px;
    font-size: 14px;
    z-index: 10;
}

.tv-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 70vh;
    color: #94a3b8;
    font-size: clamp(20px, 2vw, 32px);
    gap: 16px;
}

.tv-badge {
    display: inline-block;
    padding: 2px 8px;
    margin-right: 6px;
    border-radius: 4px;
    font-size: 0.7em;
    font-weight: 600;
    letter-spacing: 0.05em;
    line-height: 1.4;
}
.tv-badge--penalty {
    background: #b91c1c;
    color: #fff;
}
.tv-penalties {
    display: inline-flex;
    flex-wrap: wrap;
    gap: 4px;
}