/* ═══════════════════════════════════════════════════════════════════════════
   Montana vs Brady (football) — supplemental styles
   Football-specific controls only. Shared design system in shared/style.css.
   Class names mirror the basketball matchup (team-presented-as-individuals).
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── Venue toggle group ───────────────────────────────────────────────────── */
.venue-toggle-group .toggle {
    font-size: 11px;
    letter-spacing: 0.10em;
    padding: 11px 4px;
    line-height: 1.5;
}

/* ── Inline venue specs panel ─────────────────────────────────────────────── */
.venue-specs {
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--border);
}
.venue-specs-name {
    font-size: 11px; font-weight: 700; letter-spacing: 0.13em;
    text-transform: uppercase; color: var(--white); margin-bottom: 2px;
}
.venue-specs-location {
    font-size: 11px; letter-spacing: 0.06em; color: var(--dim);
    text-transform: uppercase; margin-bottom: 10px;
}
.venue-specs-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 16px; }
.venue-spec-item { display: flex; flex-direction: column; gap: 2px; }
.venue-spec-item.venue-spec-full { grid-column: 1 / -1; }
.venue-spec-label { font-size: 10px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--dim); }
.venue-spec-val { font-family: var(--mono); font-size: 12px; color: var(--white); letter-spacing: 0.02em; line-height: 1.5; }

/* ── Weather controls (WIND / CONDITIONS rows) ───────────────────────────── */
.control-group-tight { margin-top: 10px; }
.weather-note {
    margin-top: 8px;
    font-size: 11px;
    letter-spacing: 0.04em;
    line-height: 1.5;
    color: var(--dim);
    text-transform: uppercase;
}
.weather-note .weather-note-strong { color: var(--white); }

/* ── Team info strip (controls panel) ────────────────────────────────────── */
.team-strip { display: flex; flex-direction: column; gap: 10px; }
.team-row { display: flex; align-items: baseline; justify-content: space-between; }
.team-name-link {
    font-size: 15px; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase;
    color: var(--white); text-decoration: none; transition: color 0.1s;
}
.team-name-link:hover { color: var(--yellow); }
.team-detail { font-size: 12px; letter-spacing: 0.08em; color: var(--dim); text-transform: uppercase; }
.team-divider { height: 1px; background: var(--border); }
.matchup-note { font-size: 12px; letter-spacing: 0.06em; color: var(--dim); text-transform: uppercase; line-height: 1.6; margin-top: 4px; }

/* ── Rule set info block (locked, not user-selectable) ───────────────────── */
.rule-set-block { display: flex; flex-direction: column; gap: 5px; }
.rule-set-item { display: flex; align-items: baseline; gap: 10px; }
.rule-set-dot { font-size: 10px; color: var(--yellow); flex-shrink: 0; }
.rule-set-text { font-size: 12px; letter-spacing: 0.06em; text-transform: uppercase; color: var(--dim); line-height: 1.5; }

/* ── Football condition flag (broadcast frame: quarter · clock · score line) ─ */
/* Applied to #result-condition via conditionFlag.cls = 'is-football' */
.result-legality.is-football {
    color: var(--dim);
    white-space: pre-line;
    line-height: 1.9;
    transition: color 150ms ease;
}
/* Emphasised beat — a score (TD / FG) or a turnover during the reveal */
.result-legality.is-football.is-run {
    color: var(--yellow);
    animation: fb-score-flash 650ms ease;
}
@keyframes fb-score-flash {
    0%   { background: rgba(255, 204, 0, 0.16); }
    100% { background: rgba(255, 204, 0, 0.00); }
}
