/* ==========================================================================
   Previously Sports — WNBA hub identity · "WNBA REWIND" · v20261006a
   --------------------------------------------------------------------------
   Per-league identity layer for /sports/wnba/. Loads AFTER hubs.css and
   hubs-elevated.css. Desert Golden Hour (cream/paper/espresso) + WNBA orange, condensed
   Oswald display type. 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:
   "WNBA REWIND", with our own custom rewind logo mark (our drawing — the
   double-chevron motif shared across the Rewind family;never the WNBA logo or anything echoing it). Official TEAM logos stay per
   his 2026-10-01 decision — this rule covers OUR hub/league-level branding.
   ========================================================================== */

/* ==========================================================================
   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;
}.wnba-hub{
  --wnba-black: var(--desert-bg);
  --wnba-coal: var(--desert-card);
  --wnba-coal2: var(--desert-pressed);
  --wnba-orange: var(--desert-accent-ember);
  --wnba-bright: var(--desert-accent);
  --wnba-bone: var(--desert-ink);
  --wnba-dim: rgba(var(--desert-ink-rgb), .68);
  --wnba-faint: rgba(var(--desert-ink-rgb), .52);
  --wnba-line: rgba(var(--desert-ink-rgb), .14);
  --wnba-card: var(--desert-card);
  --wnba-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), .04), transparent 60%),
    var(--wnba-black);
  border-radius: 24px;
  padding-left: 28px; padding-right: 28px;
  border: 1px solid var(--wnba-line);
}/* ============ HERO — courtside photo, giant arena type ============ */
.wnba-hub .hub-hero.hero-art{
  min-height: 440px;
  border-radius: 18px;
  border: 1px solid var(--wnba-line);
  background-position: center 30%;
}.wnba-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%);
}.wnba-hub .hero-inner{ padding: 64px 40px 30px; max-width: 760px; }.wnba-hub .hub-hero .kicker{
  font-family: var(--wnba-display); font-weight: 600; font-size: 15px;
  letter-spacing: 6px; color: var(--color-warn); 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) + "WNBA REWIND" wordmark. ---- */
.wnba-hub .hub-hero h1.rewind-lockup{
  display: flex; align-items: center; gap: .18em;
  font-family: var(--wnba-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);
}.wnba-hub .rewind-mark{ display: inline-flex; flex: 0 0 auto; width: 1.02em; }.wnba-hub .rewind-mark svg{ width: 100%; height: auto; display: block;
  filter: drop-shadow(0 3px 10px rgba(var(--desert-shadow-rgb), .5)); }.wnba-hub .rewind-word{ color: var(--desert-card); white-space: nowrap; }.wnba-hub .rewind-word .rw{ color: var(--color-warn); /* on-photo */ }/* solid orange rule — single line, never a league-echoing mark */
.rewind-rule{ height: 8px; width: 210px; border-radius: 4px;
  background: linear-gradient(180deg, var(--wnba-bright), var(--wnba-orange));
  margin: 0 0 18px;
  box-shadow: 0 2px 12px rgba(var(--desert-shadow-rgb), .28); }.wnba-hub .hub-hero .lede{ color: var(--desert-bg); /* on-photo */ font-size: 17px; max-width: 560px; }.wnba-hub .hub-hero .updated{ color: rgba(var(--desert-bg-rgb), .72); /* on-photo */ }.wnba-hub .hub-hero .updated b{ color: var(--desert-card); }.wnba-hub .art-credit{ color: rgba(var(--desert-pressed-rgb), .6); }/* ============ section headers — condensed, courtside ============ */
.wnba-hub .hub-sec > .sec-head{ align-items: center; gap: 14px; margin-bottom: 18px; }.wnba-hub .hub-sec > .sec-head::before{
  width: 6px; height: 26px; border-radius: 3px;
  background: linear-gradient(180deg, var(--wnba-bright), var(--wnba-orange));
  box-shadow: 0 0 14px rgba(var(--color-warn-rgb), .45);
}.wnba-hub .hub-sec > .sec-head h2{
  font-family: var(--wnba-display); font-weight: 700; font-size: 30px;
  letter-spacing: .04em; text-transform: uppercase; color: var(--desert-ink);
}.wnba-hub .hub-sec > .sec-head .kicker{
  font-family: var(--wnba-display); font-weight: 500; font-size: 13px;
  letter-spacing: 3.5px; color: var(--wnba-bright);
}.wnba-hub .hub-sub{
  font-family: var(--wnba-display); font-weight: 600; font-size: 16px;
  letter-spacing: 2px; color: var(--wnba-dim);
}/* ============ SCOREBOARD STRIP — horizontal rail ============ */
.wnba-hub .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(--wnba-faint) transparent;
}.wnba-hub .gcard{
  flex: 0 0 320px; scroll-snap-align: start;
  background: linear-gradient(165deg, var(--wnba-coal2), var(--wnba-card));
  border: 1px solid var(--wnba-line); border-radius: 16px;
  transition: transform .2s ease, border-color .2s ease;
}@media (hover: hover){.wnba-hub .gcard:hover{ transform: translateY(-3px); border-color: var(--wnba-orange); }
}.wnba-hub .gcard.is-live{
  border-color: var(--wnba-orange); box-shadow: 0 0 0 1px var(--wnba-orange), 0 8px 28px rgba(var(--color-warn-rgb), .25);
}.wnba-hub .live-flag{
  background: var(--wnba-orange); color: var(--desert-card); border-radius: 999px;
  padding: 5px 11px 5px 9px; top: 14px; right: 14px;
  box-shadow: 0 2px 10px rgba(var(--color-warn-rgb), .45);
}.wnba-hub .live-flag .pulse{ background: var(--desert-card); }.wnba-hub .gteam b{ color: var(--wnba-bone); font-weight: 700; }.wnba-hub .gscore{ font-family: var(--wnba-display); font-weight: 700; font-size: 24px; }.wnba-hub .gmeta{ color: var(--wnba-dim); }.wnba-hub .gmeta .gvenue{ color: var(--wnba-faint); }/* ============ DESKTOP GRID — main column + sticky rail ============ */
@media (min-width: 1024px){
  .wnba-hub .hub-grid { display: grid; grid-template-columns: minmax(0,1fr) 372px;
    gap: 36px; align-items: start; }
  .wnba-hub .hub-rail { position: sticky; top: 18px; display: grid; gap: 40px; }
  .wnba-hub .hub-rail .hub-sec { margin-bottom: 0; }
}/* ============ standings ============ */
.wnba-hub .twrap{ background: var(--wnba-card); border-color: var(--wnba-line); border-radius: 16px; }.wnba-hub .twrap th{
  background: var(--wnba-coal); color: var(--wnba-bright);
  font-family: var(--wnba-display); font-weight: 600; font-size: 12px; letter-spacing: 2px;
}.wnba-hub .twrap td{ border-bottom-color: var(--wnba-line); color: var(--wnba-bone); }.wnba-hub .twrap tbody tr:hover td{ background: rgba(var(--desert-accent-rgb), .08); }.wnba-hub .twrap td.rk{ color: var(--wnba-faint); font-family: var(--wnba-display); font-weight: 600; }.wnba-hub .hub-empty{ color: var(--wnba-dim); background: var(--wnba-card);
  border: 1px dashed var(--wnba-line); border-radius: 14px; padding: 22px; font-size: 14.5px; }/* ============ news ============ */
.wnba-hub .elv-nlead{ border: 1px solid var(--wnba-line); border-radius: 16px; }.wnba-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%);
}.wnba-hub .elv-ntag{ background: var(--wnba-orange); color: var(--desert-card); border-radius: 4px;
  font-family: var(--wnba-display); font-weight: 600; letter-spacing: 2.5px; }.wnba-hub .elv-nlead-body h3{ font-family: var(--wnba-display); font-weight: 600; letter-spacing: .02em; }.wnba-hub .elv-ngrid{ grid-template-columns: 1fr; }@media (min-width: 700px){.wnba-hub .elv-ngrid{ grid-template-columns: 1fr 1fr; } }.wnba-hub .elv-ncard{ background: var(--wnba-card); border: 1px solid var(--wnba-line); }.wnba-hub .elv-ncard:hover{ border-color: var(--wnba-orange); }.wnba-hub .elv-ncard .nart{ background: var(--wnba-coal); }.wnba-hub .elv-ncard .nsrc{ color: var(--wnba-bright); }.wnba-hub .elv-ncard h4{ font-family: var(--wnba-display); font-weight: 600; letter-spacing: .02em; color: var(--wnba-bone); }.wnba-hub .elv-ncard .nmeta{ color: var(--wnba-faint); }/* ============ video / clips / poll ============ */
.wnba-hub .vspot-card, .wnba-hub .clip-card, .wnba-hub .poll-card{
  background: var(--wnba-card); border-color: var(--wnba-line); }.wnba-hub .vspot-title, .wnba-hub .clip-title, .wnba-hub .poll-q{ color: var(--wnba-bone); }.wnba-hub .vspot-kicker{ color: var(--wnba-bright); font-family: var(--wnba-display);
  font-weight: 600; letter-spacing: 2.5px; }.wnba-hub .vplay span{ background: rgba(var(--color-warn-rgb), .95); color: var(--desert-card); }.wnba-hub .poll-opt{ background: var(--wnba-black); border-color: var(--wnba-line); color: var(--wnba-bone); }.wnba-hub .poll-opt:active{ border-color: var(--wnba-orange); }.wnba-hub .poll-bar{ background: var(--wnba-coal2); }.wnba-hub .poll-fill{ background: var(--wnba-orange); }.wnba-hub .poll-top .pct{ color: var(--wnba-bright); }.wnba-hub .poll-note{ color: var(--wnba-faint); }/* ============ teams ============ */
.wnba-hub .team-tile{ background: var(--wnba-card); border-color: var(--wnba-line); border-radius: 16px; }.wnba-hub a.team-tile:hover{ border-color: var(--wnba-orange); box-shadow: 0 10px 26px rgba(var(--color-warn-rgb), .20); }.wnba-hub .team-tile .tname{ color: var(--wnba-bone); }.wnba-hub .team-tools input{ background: var(--wnba-card); border-color: var(--wnba-line); color: var(--desert-ink); }.wnba-hub .team-tools input:focus{ border-color: var(--wnba-orange); outline: none; }.wnba-hub .follow{ border-color: var(--wnba-line); color: var(--wnba-dim); }.wnba-hub .follow[aria-pressed="true"]{ border-color: var(--wnba-orange); color: var(--wnba-bright); }/* ============ loading / error states ============ */
.wnba-hub .hub-note{ color: var(--wnba-faint); font-size: 13px; margin-top: 14px; letter-spacing: .02em; }.wnba-hub .hub-skel span{
  background: linear-gradient(100deg, var(--wnba-coal) 40%, var(--wnba-coal2) 50%, var(--wnba-coal) 60%);
  background-size: 200% 100%;
}.wnba-hub .hub-error{ background: var(--desert-card); border-color: rgba(var(--desert-accent-rgb), .35); color: var(--desert-accent-deep); }.wnba-hub .hub-error button{ background: var(--wnba-orange); color: var(--desert-card); }/* ============ breadcrumb ============ */
.wnba-hub .crumb a{ color: var(--wnba-dim); }.wnba-hub .crumb a:hover{ color: var(--desert-ink); }.wnba-hub .crumb a .back-arrow{ color: var(--wnba-bright); }/* ============ phone ============ */
@media (max-width: 640px){
  .wnba-hub { padding-left: 14px; padding-right: 14px; border-radius: 18px; }
  .wnba-hub .hub-hero.hero-art { min-height: 340px; }
  .wnba-hub .hero-inner { padding: 40px 22px 78px; }
  .wnba-hub .hub-sec > .sec-head h2 { font-size: 24px; }
  .wnba-hub .gcard { flex-basis: 272px; }
  .wnba-hub .rewind-lockup { font-size: clamp(44px, 15vw, 76px); }
}@media (prefers-reduced-motion: reduce){.wnba-hub .gcard{ transition: none; }
}/* ============ COMING UP — matchup cards (Rewind family) ============ */
.wnba-hub .gcard.mcard{
  display: flex; flex-direction: column; gap: 9px;
  padding: 14px 16px 13px;
  min-height: 0;
}.wnba-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(--color-warn-rgb), .25);
}.wnba-hub .mcard-teams{
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
}.wnba-hub .mcard-team{ display: flex; align-items: center; gap: 8px; min-width: 0; }.wnba-hub .mcard-team b{
  font-family: var(--wnba-display); font-weight: 700; font-size: 21px;
  letter-spacing: .03em; color: var(--desert-ink);
}.wnba-hub .mcard-team i{
  font-style: normal; font-size: 12px; font-weight: 600;
  letter-spacing: .06em; color: var(--wnba-dim);
}.wnba-hub .mcard-at{
  font-family: var(--wnba-display); font-weight: 600; font-size: 12px;
  letter-spacing: 1px; color: var(--wnba-faint);
}.wnba-hub .mcard-crest{ position: relative; flex: none; width: 30px; height: 30px; }.wnba-hub .mcard-crest-fb{
  position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
  font-family: var(--wnba-display); font-weight: 700; font-size: 11px; letter-spacing: .04em;
  color: var(--color-warn); /* chip stays dark badge art */ background: var(--desert-ink); border: 1px solid var(--wnba-line);
  border-radius: 7px;
}.wnba-hub .mcard-crest img{
  position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain;
  background: var(--desert-ink); border-radius: 7px;
}.wnba-hub .mcard-when{
  font-size: 13.5px; font-weight: 600; letter-spacing: .02em; color: var(--wnba-bone);
}.wnba-hub .mcard-meta{
  font-size: 12px; letter-spacing: .04em; color: var(--wnba-dim);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}

/* ============ HOUSE ADS — seamlessly placed, never deceptive ============
   Standing principle (James, 2026-10-02): ads sit native inside the hub's
   design language — glass cards, league accents — clearly labeled
   "Advertisement", space reserved so fills never shift layout. Slots carry
   data-ad-slot hooks for AdSense IDs when they land;until then they show
   our own house promos (first-party, never fake third-party ads). */
.wnba-hub .hub-ad{
  position: relative;
  border: 1px solid var(--wnba-line); border-radius: 16px;
  background: linear-gradient(165deg, var(--desert-card), var(--desert-pressed));
  backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
  min-height: 132px; /* reserved: zero layout shift when a fill arrives */
  display: flex; align-items: center;
  padding: 30px 22px 18px; margin: 8px 0;
  overflow: hidden;
}.wnba-hub .hub-ad::before{
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: radial-gradient(420px 120px at 8% 0%, rgba(var(--desert-accent-rgb), .08), transparent 70%);
}.wnba-hub .hub-ad__label{
  position: absolute; top: 10px; left: 18px;
  font-family: var(--wnba-display); font-weight: 500; font-size: 10px;
  letter-spacing: 3px; text-transform: uppercase; color: var(--wnba-faint);
}.wnba-hub .hub-ad__promo{
  position: relative; display: flex; align-items: center; gap: 16px;
  text-decoration: none; width: 100%;
}.wnba-hub .hub-ad__mark{
  flex: none; width: 46px; height: 46px; border-radius: 12px;
  display: flex; align-items: center; justify-content: center;
  background: linear-gradient(160deg, var(--wnba-bright), var(--wnba-orange));
  color: var(--desert-card); font-family: var(--wnba-display); font-weight: 700; font-size: 22px;
  box-shadow: 0 4px 18px rgba(var(--color-warn-rgb), .35);
}.wnba-hub .hub-ad__body b{
  display: block; color: var(--wnba-bone); font-size: 16px; letter-spacing: .01em;
}.wnba-hub .hub-ad__body span{
  display: block; color: var(--wnba-dim); font-size: 13px; margin-top: 3px;
}.wnba-hub .hub-ad__cta{
  margin-left: auto; flex: none;
  font-family: var(--wnba-display); font-weight: 600; font-size: 13px; letter-spacing: 2px;
  color: var(--wnba-bright); border: 1px solid var(--wnba-line); border-radius: 999px;
  padding: 9px 16px;
}.wnba-hub .hub-ad--rail{ min-height: 280px; }.wnba-hub .hub-ad--rail .hub-ad__promo{ flex-direction: column; align-items: flex-start; gap: 12px; }.wnba-hub .hub-ad--rail .hub-ad__cta{ margin-left: 0; }

/* ==========================================================================
   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 .wnba-hub only.
   ========================================================================== */
body:has(.wnba-hub){ background: var(--desert-bg) !important; color: var(--desert-ink) !important; }.wnba-hub .crumb a{ color: var(--wnba-dim) !important; }.wnba-hub .crumb a:hover{ color: var(--desert-ink) !important; }.wnba-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;
}.wnba-hub .hub-skel span{
  background: linear-gradient(100deg, var(--wnba-coal) 40%, var(--wnba-coal2) 50%, var(--wnba-coal) 60%) !important;
  background-size: 200% 100% !important;
}.wnba-hub .gcard{
  background: linear-gradient(165deg, var(--wnba-coal2), var(--wnba-card)) !important;
  border: 1px solid var(--wnba-line) !important;
}.wnba-hub .gcard.is-live{
  border: 1px solid var(--wnba-orange) !important;
  box-shadow: 0 0 0 1px var(--wnba-orange), 0 8px 28px rgba(var(--color-warn-rgb), .25) !important;
}.wnba-hub .gmeta{ color: var(--wnba-dim) !important; border-top: 1px solid var(--wnba-line) !important; }.wnba-hub .vspot-card, .wnba-hub .clip-card{
  background: var(--wnba-card) !important; border: 1px solid var(--wnba-line) !important;
}.wnba-hub .vthumb{ display: block; background: linear-gradient(135deg, var(--wnba-coal), var(--wnba-black)); }.wnba-hub .vspot-meta > span{ display: block; }.wnba-hub .vspot-kicker{ margin-bottom: 8px; }.wnba-hub .vspot-title{ margin-bottom: 8px; }.wnba-hub .vspot-title, .wnba-hub .clip-title{ color: var(--wnba-bone) !important; }.wnba-hub .vspot-kicker{ color: var(--wnba-bright) !important; }.wnba-hub .vspot-sub{ color: var(--wnba-dim) !important; }.wnba-hub .poll-card{ background: var(--wnba-card) !important; border: 1px solid var(--wnba-line) !important; }.wnba-hub .poll-q{ color: var(--wnba-bone) !important; }.wnba-hub .poll-opt{
  background: var(--wnba-black) !important; border: 1px solid var(--wnba-line) !important;
  color: var(--wnba-bone) !important;
}.wnba-hub .poll-opt:hover{ border-color: var(--wnba-orange) !important; }.wnba-hub .poll-note{ color: var(--wnba-faint) !important; }