/* ==========================================================================
   Previously Sports — NFL hub identity · "NFL REWIND" · v20261006a
   --------------------------------------------------------------------------
   Per-league identity layer for /sports/nfl/. Loads AFTER hubs.css and
   hubs-elevated.css. Desert Golden Hour (cream/paper/espresso) + Previously brand red, condensed Oswald
   display type, scoreboard strip, division tables. Desktop-first; collapses
   cleanly to phone.

   TRADEMARK-SAFE "REWIND" SUB-BRAND (James, 2026-10-02 — PERMANENT): league
   hubs never brand as the league itself. Our brand follows the league name:
   "NFL REWIND", with our own custom rewind logo mark (our drawing — the
   double-chevron motif shared across the Rewind family;never the NFL shield
   or anything echoing it, no red/white/blue shield motifs). Official TEAM
   logos stay per his 2026-10-01 decision — this rule covers OUR hub/
   league-level branding only.

   Pattern for future leagues: hub-identity-{mlb,nhl,...}.css — same hooks,
   different palette/type/motifs. Shared template stays untouched.
   ========================================================================== */

/* ==========================================================================
   DESERT GOLDEN HOUR (James, 2026-10-06 — PERMANENT): converted
   UNCONDITIONALLY — no prefers-color-scheme anywhere in this file. Cream
   page #FAF6EE, white cards, espresso ink #2A1C11, burnt-orange depth
   #92400E. League accents kept, darkened where needed to clear AA on
   paper. Photo scrims/veils stay dark (warmed to espresso) because the
   hero is a dark photo — media wells stay dark, like YouTube in light
   mode. On-photo text (hero kicker/lede/updated, rewind wordmark) keeps
   the original bright accent values, flagged with an on-photo comment.
   ========================================================================== */

/* ---- self-hosted condensed display face (no third-party origins) ---- */
@font-face{
  font-family: 'Oswald';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url('./fonts/oswald-var-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
    U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191,
    U+2193, U+2215, U+FEFF, U+FFFD;
}.nfl-hub{
  --nfl-black: var(--desert-bg);
  --nfl-coal: var(--desert-card);
  --nfl-coal2: var(--desert-pressed);
  --nfl-red: var(--desert-accent);
  --nfl-red-bright: var(--desert-accent);
  --nfl-bone: var(--desert-ink);
  --nfl-dim: rgba(var(--desert-ink-rgb), .68);
  --nfl-faint: rgba(var(--desert-ink-rgb), .52);
  --nfl-line: rgba(var(--desert-ink-rgb), .14);
  --nfl-card: var(--desert-card);
  --nfl-display: 'Oswald', 'Arial Narrow', 'Helvetica Neue', sans-serif;
  max-width: 1400px;
  background:
    radial-gradient(1100px 380px at 12% -4%, rgba(var(--desert-accent-rgb), .08), transparent 62%),
    radial-gradient(900px 340px at 88% 2%, rgba(var(--desert-accent-rgb), .05), transparent 60%),
    var(--nfl-black);
  border-radius: 24px;
  padding-left: 28px; padding-right: 28px;
  border: 1px solid var(--nfl-line);
}/* ============ HERO — night-game photo, giant gridiron type ============ */
.nfl-hub .hub-hero.hero-art{
  min-height: 440px;
  border-radius: 18px;
  border: 1px solid var(--nfl-line);
  background-position: center 30%;
}.nfl-hub .hero-veil{
  background: linear-gradient(100deg,
    rgba(var(--desert-ink-rgb), .90) 0%, rgba(var(--desert-ink-rgb), .64) 34%,
    rgba(var(--desert-ink-rgb), .14) 62%, rgba(var(--desert-ink-rgb), .32) 100%),
    linear-gradient(0deg, rgba(var(--desert-ink-rgb), .94) 0%, transparent 42%);
}.nfl-hub .hero-inner{ padding: 64px 40px 30px; max-width: 760px; }.nfl-hub .hub-hero .kicker{
  font-family: var(--nfl-display); font-weight: 600; font-size: 15px;
  letter-spacing: 6px; color: var(--desert-accent); margin-bottom: 12px; /* on-photo: original bright accent for the dark hero photo */
}/* ---- REWIND lockup: our own brand. Custom rewind glyph (drawn here,
   never a league mark) + "NFL REWIND" wordmark. ---- */
.nfl-hub .hub-hero h1.rewind-lockup{
  display: flex; align-items: center; gap: .18em;
  font-family: var(--nfl-display); font-weight: 700;
  font-size: clamp(44px, 8.5vw, 104px); line-height: 1;
  letter-spacing: .01em; margin: 0 0 14px;
  text-shadow: 0 4px 34px rgba(var(--desert-shadow-rgb), .65);
}.nfl-hub .rewind-mark{ display: inline-flex; flex: 0 0 auto; width: 1.02em; }.nfl-hub .rewind-mark svg{ width: 100%; height: auto; display: block;
  filter: drop-shadow(0 3px 10px rgba(var(--desert-shadow-rgb), .5)); }.nfl-hub .rewind-word{ color: var(--desert-card); white-space: nowrap; }.nfl-hub .rewind-word .rw{ color: var(--desert-accent); /* on-photo */ }/* solid red rule — single line, never a league-echoing mark */
.rewind-rule{ height: 8px; width: 210px; border-radius: 4px;
  background: linear-gradient(180deg, var(--nfl-red-bright), var(--nfl-red));
  margin: 0 0 18px;
  box-shadow: 0 2px 12px rgba(var(--desert-shadow-rgb), .28); }.nfl-hub .hub-hero .lede{ color: var(--desert-bg); /* on-photo */ font-size: 17px; max-width: 560px; }.nfl-hub .hub-hero .updated{ color: rgba(var(--desert-bg-rgb), .72); /* on-photo */ }.nfl-hub .hub-hero .updated b{ color: var(--desert-card); }.nfl-hub .art-credit{ color: rgba(var(--desert-pressed-rgb), .6); }/* ============ section headers — condensed, athletic ============ */
.nfl-hub .hub-sec > .sec-head{ align-items: center; gap: 14px; margin-bottom: 18px; }.nfl-hub .hub-sec > .sec-head::before{
  width: 6px; height: 26px; border-radius: 3px;
  background: linear-gradient(180deg, var(--nfl-red-bright), var(--nfl-red));
  box-shadow: 0 0 14px rgba(var(--desert-accent-rgb), .45);
}.nfl-hub .hub-sec > .sec-head h2{
  font-family: var(--nfl-display); font-weight: 700; font-size: 30px;
  letter-spacing: .04em; text-transform: uppercase; color: var(--desert-ink);
}.nfl-hub .hub-sec > .sec-head .kicker{
  font-family: var(--nfl-display); font-weight: 500; font-size: 13px;
  letter-spacing: 3.5px; color: var(--nfl-red-bright);
}.nfl-hub .hub-sub{
  font-family: var(--nfl-display); font-weight: 600; font-size: 16px;
  letter-spacing: 2px; color: var(--nfl-dim);
}/* ============ SCOREBOARD STRIP — horizontal rail ============ */
.nfl-hub .nfl-scores .ggrid{
  display: flex; gap: 14px; overflow-x: auto; padding: 4px 4px 14px;
  scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch;
  scrollbar-width: thin; scrollbar-color: var(--nfl-faint) transparent;
}.nfl-hub .nfl-scores .gcard{
  flex: 0 0 320px; scroll-snap-align: start;
  background: linear-gradient(165deg, var(--nfl-coal2), var(--nfl-card));
  border: 1px solid var(--nfl-line); border-radius: 16px;
  transition: transform .2s ease, border-color .2s ease;
}@media (hover: hover){.nfl-hub .nfl-scores .gcard:hover{ transform: translateY(-3px); border-color: var(--nfl-red); }
}.nfl-hub .nfl-scores .gcard.is-live{
  border-color: var(--nfl-red); box-shadow: 0 0 0 1px var(--nfl-red), 0 8px 28px rgba(var(--desert-accent-rgb), .25);
}.nfl-hub .live-flag{
  background: var(--nfl-red); color: var(--desert-card); border-radius: 999px;
  padding: 5px 11px 5px 9px; top: 14px; right: 14px;
  box-shadow: 0 2px 10px rgba(var(--desert-accent-rgb), .45);
}.nfl-hub .live-flag .pulse{ background: var(--desert-card); }.nfl-hub .gteam b{ color: var(--nfl-bone); font-weight: 700; }.nfl-hub .gscore{ font-family: var(--nfl-display); font-weight: 700; font-size: 24px; }.nfl-hub .gmeta{ color: var(--nfl-dim); }.nfl-hub .gmeta .gvenue{ color: var(--nfl-faint); }/* ============ DESKTOP GRID — main column + sticky rail ============ */
@media (min-width: 1024px){
  .nfl-hub .hub-grid { display: grid; grid-template-columns: minmax(0,1fr) 372px;
    gap: 36px; align-items: start; }
  .nfl-hub .hub-rail { position: sticky; top: 18px; display: grid; gap: 40px; }
  .nfl-hub .hub-rail .hub-sec { margin-bottom: 0; }
}/* ============ standings — division tables ============ */
.nfl-hub .twrap{ background: var(--nfl-card); border-color: var(--nfl-line); border-radius: 16px; }.nfl-hub .twrap th{
  background: var(--nfl-coal); color: var(--nfl-red-bright);
  font-family: var(--nfl-display); font-weight: 600; font-size: 12px; letter-spacing: 2px;
}.nfl-hub .twrap td{ border-bottom-color: var(--nfl-line); color: var(--nfl-bone); }.nfl-hub .twrap tbody tr:hover td{ background: rgba(var(--desert-accent-rgb), .08); }.nfl-hub .twrap td.rk{ color: var(--nfl-faint); font-family: var(--nfl-display); font-weight: 600; }.nfl-hub .hub-empty{ color: var(--nfl-dim); background: var(--nfl-card);
  border: 1px dashed var(--nfl-line); border-radius: 14px; padding: 22px; font-size: 14.5px; }/* ============ news — lead + cards in gridiron colors ============ */
.nfl-hub .pg-lead{ border-color: var(--nfl-line); border-radius: 16px; background: var(--nfl-coal); }.nfl-hub .pg-tag{ background: var(--nfl-red); color: var(--desert-card); border-radius: 4px;
  font-family: var(--nfl-display); font-weight: 600; letter-spacing: 2.5px; }.nfl-hub .pg-lead-head{ font-family: var(--nfl-display); font-weight: 600;
  letter-spacing: .02em; text-transform: none; }.nfl-hub .pg-src{ color: var(--nfl-red-bright); }.nfl-hub .pg-card{ background: var(--nfl-card); border-color: var(--nfl-line); border-radius: 14px; }.nfl-hub .pg-head{ color: var(--nfl-bone); }@media (hover: hover){.nfl-hub a.pg-card:hover{ border-color: var(--nfl-red); box-shadow: 0 18px 44px rgba(var(--desert-shadow-rgb), .25); }
}@media (min-width: 700px){.nfl-hub .pg-grid{ grid-template-columns: 1fr 1fr; } }/* ============ video / clips / poll ============ */
.nfl-hub .vspot-card, .nfl-hub .clip-card, .nfl-hub .poll-card{
  background: var(--nfl-card); border-color: var(--nfl-line); }.nfl-hub .vspot-title, .nfl-hub .clip-title, .nfl-hub .poll-q{ color: var(--nfl-bone); }.nfl-hub .vspot-kicker{ color: var(--nfl-red-bright); font-family: var(--nfl-display);
  font-weight: 600; letter-spacing: 2.5px; }.nfl-hub .vplay span{ background: rgba(var(--desert-accent-rgb), .95); color: var(--desert-card); }.nfl-hub .poll-opt{ background: var(--nfl-black); border-color: var(--nfl-line); color: var(--nfl-bone); }.nfl-hub .poll-opt:active{ border-color: var(--nfl-red); }.nfl-hub .poll-bar{ background: var(--nfl-coal2); }.nfl-hub .poll-fill{ background: var(--nfl-red); }.nfl-hub .poll-top .pct{ color: var(--nfl-red-bright); }/* ============ teams ============ */
.nfl-hub .team-tile{ background: var(--nfl-card); border-color: var(--nfl-line); border-radius: 16px; }.nfl-hub a.team-tile:hover{ border-color: var(--nfl-red); box-shadow: 0 10px 26px rgba(var(--desert-accent-rgb), .20); }.nfl-hub .team-tile .tname{ color: var(--nfl-bone); }.nfl-hub .team-tools input{ background: var(--nfl-card); border-color: var(--nfl-line); color: var(--desert-ink); }.nfl-hub .team-tools input:focus{ border-color: var(--nfl-red); outline: none; }.nfl-hub .follow{ border-color: var(--nfl-line); color: var(--nfl-dim); }.nfl-hub .follow[aria-pressed="true"]{ border-color: var(--nfl-red); color: var(--nfl-red-bright); }/* ============ loading / error states ============ */
.nfl-hub .hub-note{ color: var(--nfl-faint); font-size: 13px; margin-top: 14px; letter-spacing: .02em; }.nfl-hub .hub-skel span{
  background: linear-gradient(100deg, var(--nfl-coal) 40%, var(--nfl-coal2) 50%, var(--nfl-coal) 60%);
  background-size: 200% 100%;
}.nfl-hub .hub-error{ background: var(--desert-card); border-color: rgba(var(--desert-accent-rgb), .35); color: var(--desert-accent-deep); }.nfl-hub .hub-error button{ background: var(--nfl-red); color: var(--desert-card); }/* ============ breadcrumb ============ */
.nfl-hub .crumb a{ color: var(--nfl-dim); }.nfl-hub .crumb a:hover{ color: var(--desert-ink); }.nfl-hub .crumb a .back-arrow{ color: var(--nfl-red-bright); }/* ============ phone ============ */
@media (max-width: 640px){
  .nfl-hub { padding-left: 14px; padding-right: 14px; border-radius: 18px; }
  .nfl-hub .hub-hero.hero-art { min-height: 340px; }
  .nfl-hub .hero-inner { padding: 40px 22px 20px; }
  .nfl-hub .hub-sec > .sec-head h2 { font-size: 24px; }
  .nfl-hub .nfl-scores .gcard { flex-basis: 272px; }
}@media (prefers-reduced-motion: reduce){.nfl-hub .nfl-scores .gcard{ transition: none; }
}

/* ==========================================================================
   Elevated-layer overrides — the bright "game-day" layer forces light cards
   with !important; the desert theme answers in kind (cream page, paper cards, espresso ink).
   Scoped to .nfl-hub only;other hubs keep the bright theme.
   ========================================================================== */
body:has(.nfl-hub){ background: var(--desert-bg) !important; color: var(--desert-ink) !important; }.nfl-hub .crumb a{ color: var(--nfl-dim) !important; }.nfl-hub .crumb a:hover{ color: var(--desert-ink) !important; }.nfl-hub .hero-veil{
  background: linear-gradient(100deg,
    rgba(var(--desert-ink-rgb), .90) 0%, rgba(var(--desert-ink-rgb), .64) 34%,
    rgba(var(--desert-ink-rgb), .14) 62%, rgba(var(--desert-ink-rgb), .32) 100%),
    linear-gradient(0deg, rgba(var(--desert-ink-rgb), .94) 0%, transparent 42%) !important;
}.nfl-hub .hub-skel span{
  background: linear-gradient(100deg, var(--nfl-coal) 40%, var(--nfl-coal2) 50%, var(--nfl-coal) 60%) !important;
  background-size: 200% 100% !important;
}.nfl-hub .gcard{
  background: linear-gradient(165deg, var(--nfl-coal2), var(--nfl-card)) !important;
  border: 1px solid var(--nfl-line) !important;
}.nfl-hub .gcard.is-live{
  border: 1px solid var(--nfl-red) !important;
  box-shadow: 0 0 0 1px var(--nfl-red), 0 8px 28px rgba(var(--desert-accent-rgb), .25) !important;
}.nfl-hub .gmeta{ color: var(--nfl-dim) !important; border-top: 1px solid var(--nfl-line) !important; }.nfl-hub .vspot-card, .nfl-hub .clip-card{
  background: var(--nfl-card) !important; border: 1px solid var(--nfl-line) !important;
}/* failed/slow thumbnails still hold a proper 16:9 frame */
.nfl-hub .vthumb{ display: block; background: linear-gradient(135deg, var(--nfl-coal), var(--nfl-black)); }/* spotlight meta stacks: kicker / title / source */
.nfl-hub .vspot-meta > span{ display: block; }.nfl-hub .vspot-kicker{ margin-bottom: 8px; }.nfl-hub .vspot-title{ margin-bottom: 8px; }.nfl-hub .vspot-title, .nfl-hub .clip-title{ color: var(--nfl-bone) !important; }.nfl-hub .vspot-kicker{ color: var(--nfl-red-bright) !important; }.nfl-hub .vspot-sub{ color: var(--nfl-dim) !important; }.nfl-hub .poll-card{ background: var(--nfl-card) !important; border: 1px solid var(--nfl-line) !important; }.nfl-hub .poll-q{ color: var(--nfl-bone) !important; }.nfl-hub .poll-opt{
  background: var(--nfl-black) !important; border: 1px solid var(--nfl-line) !important;
  color: var(--nfl-bone) !important;
}.nfl-hub .poll-opt:hover{ border-color: var(--nfl-red) !important; }.nfl-hub .poll-note{ color: var(--nfl-faint) !important; }/* ---- elevated newsroom cards (rendered by hub-elevated.js as .elv-*) ---- */
.nfl-hub .elv-nlead{ border: 1px solid var(--nfl-line); border-radius: 16px; }.nfl-hub .elv-nlead .nshade{
  background: linear-gradient(180deg, rgba(var(--desert-ink-rgb), 0) 20%, rgba(var(--desert-ink-rgb), .45) 55%, rgba(var(--desert-ink-rgb), .92) 100%);
}.nfl-hub .elv-ntag{ background: var(--nfl-red); color: var(--desert-card); border-radius: 4px;
  font-family: var(--nfl-display); font-weight: 600; letter-spacing: 2.5px; }.nfl-hub .elv-nlead-body h3{ font-family: var(--nfl-display); font-weight: 600; letter-spacing: .02em; }.nfl-hub .elv-ngrid{ grid-template-columns: 1fr; }@media (min-width: 700px){.nfl-hub .elv-ngrid{ grid-template-columns: 1fr 1fr; } }.nfl-hub .elv-ncard{ background: var(--nfl-card); border: 1px solid var(--nfl-line); }.nfl-hub .elv-ncard:hover{ border-color: var(--nfl-red); }.nfl-hub .elv-ncard .nart{ background: var(--nfl-coal); }.nfl-hub .elv-ncard .nsrc{ color: var(--nfl-red-bright); }.nfl-hub .elv-ncard h4{ font-family: var(--nfl-display); font-weight: 600; letter-spacing: .02em; color: var(--nfl-bone); }.nfl-hub .elv-ncard .nmeta{ color: var(--nfl-faint); }/* ============ small screens: room for the wrapping photo credit ============ */
@media (max-width: 700px){
  /* the absolute .art-credit wraps to 3 lines on narrow phones — keep it
     from overlapping the "updated" line above it */
  .nfl-hub .hero-inner { padding-bottom: 78px; }
  .nfl-hub .rewind-lockup { font-size: clamp(44px, 15vw, 76px); }
}

/* ============ COMING UP — matchup cards (James, 2026-10-02) ============
   Replaces the plain score pills for the "Coming up" group with compact
   matchup cards: AWAY @ HOME + records, date/time, network · venue city,
   team-color duel bar. Still swipeable in the .ggrid rail. Rendered by
   js/hub-nfl-matchups.js;hub.js pills remain as the no-JS fallback. */
.nfl-hub .gcard.mcard{
  display: flex; flex-direction: column; gap: 9px;
  padding: 14px 16px 13px;
  min-height: 0;
}.nfl-hub .mcard-duel{
  display: block; height: 4px; border-radius: 2px;
  background: linear-gradient(90deg, var(--m-away, var(--desert-ink-dim)), var(--m-home, var(--desert-ink-dim)));
  box-shadow: 0 0 10px rgba(var(--desert-accent-rgb), .25);
}.nfl-hub .mcard-teams{
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
}.nfl-hub .mcard-team{ display: flex; align-items: center; gap: 8px; min-width: 0; flex: 1 1 0; }.nfl-hub .mcard-team b{
  font-family: var(--nfl-display); font-weight: 700; font-size: 21px;
  letter-spacing: .03em; color: var(--desert-ink);
  /* Audit 2026-10-03: long names ("Indianapolis Colts") pushed the card
     past the 390px viewport. Truncate instead of overflowing. */
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0;
}.nfl-hub .mcard-team i{
  font-style: normal; font-size: 12px; font-weight: 600;
  letter-spacing: .06em; color: var(--nfl-dim);
}.nfl-hub .mcard-at{
  font-family: var(--nfl-display); font-weight: 600; font-size: 12px;
  letter-spacing: 1px; color: var(--nfl-faint);
}.nfl-hub .mcard-crest{ position: relative; flex: none; width: 30px; height: 30px; }.nfl-hub .mcard-crest-fb{
  position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
  font-family: var(--nfl-display); font-weight: 700; font-size: 11px; letter-spacing: .04em;
  color: var(--desert-accent); /* chip stays dark badge art */ background: var(--desert-pressed); border: 1px solid var(--nfl-line);
  border-radius: 7px;
}.nfl-hub .mcard-crest img{
  position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain;
  background: var(--desert-pressed); border-radius: 7px;
}.nfl-hub .mcard-when{
  font-size: 13.5px; font-weight: 600; letter-spacing: .02em; color: var(--nfl-bone);
}.nfl-hub .mcard-meta{
  font-size: 12px; letter-spacing: .04em; color: var(--nfl-dim);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}