/* ==========================================================================
   nba-seo-game.css — the NBA game view for a pairing that is not on today's
   slate (/nba/game/<visitor>-<home>: static/js/nba/nbaSeoGameView.js).

   Linked by templates/_nba_game_seo.html only, and only on an off-slate
   pairing (the one case that view draws), so it costs nothing anywhere else.

   §1 is the NFL game page's own rules (static/css/nfl/nfl-game-detail.css)
   for the parts this view renders -- tokens, chassis, back link, matchup
   card, tabs, controls, position pills, empty state, the context panels and
   the comparison rows -- with `#nfl-game-detail` re-scoped to
   `#nba-seo-game-view` and nothing else changed but the pill row's four
   columns (All G F C). Media queries and source order are the NFL sheet's,
   because the look depends on both (the <=1000px block is the phone layer on
   the 980px canvas). Copied, not linked: the NFL sheet is scoped to its own
   page id, which this view must not claim (NFL modules resolve their DOM by
   it). Keep the two in step by hand when the NFL shell changes.

   §2 is the two NBA-only panels (Season series, Key players) in the same
   panel voice, and the stack that holds them beside Defense vs. position.
   ========================================================================== */

/* ── 1. the NFL game page shell, re-scoped ─────────────────────────────── */

#nba-seo-game-view {
  --ngd-accent:        rgb(var(--theme-accent-rgb, 0, 211, 189));
  --ngd-accent-70:     rgba(var(--theme-accent-rgb, 0, 211, 189), .70);
  --ngd-accent-28:     rgba(var(--theme-accent-rgb, 0, 211, 189), .28);
  --ngd-accent-14:     rgba(var(--theme-accent-rgb, 0, 211, 189), .14);
  --ngd-accent-08:     rgba(var(--theme-accent-rgb, 0, 211, 189), .08);
  --ngd-ink-050:  #0B0C0C;
  --ngd-ink-100:  #131515;
  --ngd-ink-150:  #1A1D1D;
  --ngd-line:      #1F2323;
  --ngd-line-soft: #171A1A;
  --ngd-line-hi:   #2C3232;
  --ngd-fg:       #F2F5F4;
  --ngd-fg-dim:   #8A9391;
  --ngd-fg-mute:  #59615F;
  --ngd-fg-faint: #414847;
  --ngd-side-l: var(--ngd-accent-70);
  --ngd-side-r: #4A7FBF;
  --ngd-sans: "Inter", "Inter Tight", -apple-system, BlinkMacSystemFont,
              "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --ngd-mono: "IBM Plex Mono", ui-monospace, "SF Mono", Menlo, Consolas,
              monospace;
  --ngd-r:  14px;
}
#nba-seo-game-view {
  flex: 1 1 auto;
  min-width: 0;
  width: 100%;
  max-width: 1560px;
  margin: 0 auto;
  padding: 12px 20px 56px;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  gap: 18px;
  font-family: var(--ngd-sans);
  font-size: 15px;
  font-weight: 400;
  line-height: 1.5;
  color: var(--ngd-fg);
  -webkit-font-smoothing: antialiased;
}
#nba-seo-game-view *,
#nba-seo-game-view *::before,
#nba-seo-game-view *::after {
  box-sizing: border-box;
}
#nba-seo-game-view h3,
#nba-seo-game-view h4,
#nba-seo-game-view p,
#nba-seo-game-view ul,
#nba-seo-game-view li {
  margin: 0;
  padding: 0;
}
#nba-seo-game-view ul {
  list-style: none;
}
#nba-seo-game-view button {
  font: inherit;
  color: inherit;
  background: none;
  border: 0;
  padding: 0;
  margin: 0;
  cursor: pointer;
  text-align: inherit;
  letter-spacing: inherit;
}
#nba-seo-game-view button:disabled {
  cursor: default;
  opacity: .55;
}
#nba-seo-game-view :focus-visible {
  outline: 2px solid var(--ngd-accent);
  outline-offset: 2px;
  border-radius: 4px;
}
#nba-seo-game-view .num {
  font-variant-numeric: tabular-nums;
  letter-spacing: .02em;
}
#nba-seo-game-view [hidden] {
  display: none !important;
}
#nba-seo-game-view[hidden] {
  display: none !important;
}
#nba-seo-game-view .ngd-topbar {
  display: flex;
  align-items: center;
  gap: 14px;
  min-height: 34px;
}
#nba-seo-game-view .ngd-back {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 4px 6px 4px 0;
  background: transparent;
  border: none;
  color: var(--ngd-accent);
  font-family: inherit;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  transition: color .15s ease, transform .15s ease;
}
#nba-seo-game-view .ngd-back:hover {
  transform: translateX(-1px);
}
#nba-seo-game-view .ngd-back svg {
  flex: none;
}
@media (min-width: 1001px) {
  #nba-seo-game-view .ngd-topbar {
    min-height: 0;
    margin: 6px 0 -6px;
  }
  #nba-seo-game-view .ngd-back {
    gap: 8px;
    padding: 6px 8px 6px 0;
    font-size: 15px;
    line-height: 1.2;
  }
  #nba-seo-game-view .ngd-back svg {
    width: 18px;
    height: 18px;
  }
}
#nba-seo-game-view .ngd-body {
  display: flex;
  flex-direction: column;
  gap: 26px;
}
#nba-seo-game-view .ngd-props {
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-width: 0;
}
#nba-seo-game-view .nsg-list {
  min-width: 0;
}
#nba-seo-game-view .nsg-context {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
#nba-seo-game-view .nsg-context:empty {
  display: none;
}
#nba-seo-game-view .ngd-empty {
  padding: 40px 18px;
  text-align: center;
  font-size: 13px;
  color: var(--ngd-fg-mute);
  background: var(--ngd-ink-050);
  border: 1px solid var(--ngd-line-soft);
  border-radius: var(--ngd-r);
}
#nba-seo-game-view .ngd-gamecard {
  background: var(--ngd-ink-050);
  border: 1px solid var(--ngd-line-soft);
  border-radius: var(--ngd-r);
}
#nba-seo-game-view .ngd-gc-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  align-items: start;
  gap: 18px;
  padding: 20px 26px 22px;
}
#nba-seo-game-view .ngd-team {
  display: flex;
  align-items: center;
  gap: 14px;
  min-width: 0;
}
#nba-seo-game-view .ngd-team-home {
  flex-direction: row-reverse;
  text-align: right;
}
#nba-seo-game-view .ngd-crest {
  flex: none;
  width: 44px;
  height: 44px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  border: 1px solid var(--ngd-line);
  background-color: var(--c, #1f2a37);
  background-image: linear-gradient(158deg, rgba(0, 0, 0, .42), rgba(0, 0, 0, .74));
  overflow: visible;
}
#nba-seo-game-view .ngd-crest img {
  width: 30px;
  height: 30px;
  object-fit: contain;
  display: block;
}
#nba-seo-game-view .ngd-crest b {
  font-size: 12.5px;
  font-weight: 800;
  letter-spacing: .02em;
  color: var(--ngd-fg);
}
#nba-seo-game-view .ngd-team-id {
  display: flex;
  flex-direction: column;
  min-width: 0;
}
#nba-seo-game-view .ngd-team-city {
  font-size: 9.5px;
  font-weight: 600;
  letter-spacing: .17em;
  text-transform: uppercase;
  color: var(--ngd-fg-mute);
  line-height: 1.2;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
#nba-seo-game-view .ngd-team-code {
  display: none;
}
#nba-seo-game-view .ngd-team-name {
  font-size: 26px;
  font-weight: 800;
  letter-spacing: -.032em;
  line-height: 1.06;
  margin-top: 2px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
#nba-seo-game-view .ngd-gc-tot {
  margin-top: 10px;
}
#nba-seo-game-view .ngd-gc-tot-l {
  font-size: 9.5px;
  font-weight: 600;
  letter-spacing: .17em;
  text-transform: uppercase;
  color: var(--ngd-fg-mute);
  line-height: 1.2;
}
#nba-seo-game-view .ngd-gc-tot-l b {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: -.01em;
  color: var(--ngd-fg);
  font-variant-numeric: tabular-nums;
  margin-left: 5px;
}
#nba-seo-game-view .ngd-gc-tot-l.is-empty {
  letter-spacing: .04em;
  text-transform: none;
  font-size: 11.5px;
}
#nba-seo-game-view .ngd-gc-mid {
  text-align: center;
  min-width: 0;
  padding: 0 4px;
}
#nba-seo-game-view .ngd-gc-at {
  font-size: 14px;
  color: var(--ngd-fg-mute);
  line-height: 1.1;
}
#nba-seo-game-view .ngd-gc-meta {
  font-size: 11.5px;
  color: var(--ngd-fg-mute);
  line-height: 1.3;
  margin-top: 5px;
  white-space: nowrap;
}
@media (min-width: 1001px) {
  #nba-seo-game-view .ngd-gc-head {
    padding: 12px 18px;
  }
  #nba-seo-game-view .ngd-team {
    gap: 18px;
  }
  #nba-seo-game-view .ngd-crest {
    width: 122px;
    height: 122px;
    border-radius: 21px;
  }
  #nba-seo-game-view .ngd-crest img {
    width: 102px;
    height: 102px;
  }
  #nba-seo-game-view .ngd-team-name {
    font-size: 25px;
  }
  #nba-seo-game-view .ngd-team-city {
    font-size: 9px;
  }
  #nba-seo-game-view .ngd-gc-mid {
    padding: 0 15px;
  }
  #nba-seo-game-view .ngd-gc-at {
    font-size: 17px;
  }
  #nba-seo-game-view .ngd-gc-meta {
    font-size: 14px;
    margin-top: 5px;
  }
  #nba-seo-game-view .ngd-gc-tot {
    margin-top: 6px;
  }
  #nba-seo-game-view .ngd-gc-tot-l {
    font-size: 13px;
    letter-spacing: .12em;
  }
  #nba-seo-game-view .ngd-gc-tot-l b {
    font-size: 18px;
    margin-left: 9px;
  }
}
#nba-seo-game-view .ngd-controls {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}
#nba-seo-game-view .ngd-group {
  display: flex;
  gap: 2px;
  padding: 3px;
  background: var(--ngd-ink-050);
  border: 1px solid var(--ngd-line-soft);
  border-radius: 9px;
}
#nba-seo-game-view .ngd-group button {
  padding: 6px 12px;
  font-size: 12px;
  font-weight: 600;
  color: var(--ngd-fg-mute);
  border-radius: 6px;
  white-space: nowrap;
  transition: color .14s, background .14s;
}
#nba-seo-game-view .ngd-group button:hover {
  color: var(--ngd-fg-dim);
}
#nba-seo-game-view .ngd-group button.is-on {
  background: var(--ngd-ink-150);
  color: var(--ngd-fg);
}
#nba-seo-game-view .ngd-two {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(440px, 1fr));
  gap: 10px;
  align-items: start;
}
#nba-seo-game-view .ngd-panel {
  background: var(--ngd-ink-050);
  border: 1px solid var(--ngd-line-soft);
  border-radius: var(--ngd-r);
  padding: 16px 18px 14px;
  min-width: 0;
}
#nba-seo-game-view .ngd-panel h3 {
  font-size: 13px;
  font-weight: 700;
  letter-spacing: -.01em;
  margin-bottom: 3px;
}
#nba-seo-game-view .ngd-sub {
  font-size: 11.5px;
  color: var(--ngd-fg-mute);
  margin-bottom: 14px;
  line-height: 1.45;
}
#nba-seo-game-view .ngd-cmp-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 148px minmax(0, 1fr);
  gap: 12px;
  padding-bottom: 9px;
  border-bottom: 1px solid var(--ngd-line);
}
#nba-seo-game-view .ngd-cmp-head span {
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .13em;
  text-transform: uppercase;
  color: var(--ngd-fg-mute);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
#nba-seo-game-view .ngd-cmp-head span:first-child {
  text-align: right;
}
#nba-seo-game-view .ngd-cmp-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 148px minmax(0, 1fr);
  align-items: center;
  gap: 12px;
  padding: 9px 0;
  border-bottom: 1px solid var(--ngd-line-soft);
}
#nba-seo-game-view .ngd-cmp-row:last-child {
  border-bottom: 0;
}
#nba-seo-game-view .ngd-cmp-v {
  display: flex;
  align-items: baseline;
  gap: 8px;
  font-size: 13.5px;
  font-weight: 600;
  color: var(--ngd-fg-mute);
  min-width: 0;
}
#nba-seo-game-view .ngd-cmp-v.is-l {
  justify-content: flex-end;
}
#nba-seo-game-view .ngd-cmp-v.is-r {
  justify-content: flex-start;
}
#nba-seo-game-view .ngd-cmp-v.is-win {
  color: var(--ngd-fg);
}
#nba-seo-game-view .ngd-cmp-rank {
  font-style: normal;
  font-family: var(--ngd-mono);
  font-size: 10px;
  font-weight: 500;
  color: var(--ngd-fg-faint);
  background: var(--ngd-ink-100);
  border-radius: 4px;
  padding: 1px 5px;
  flex: none;
}
#nba-seo-game-view .ngd-cmp-v.is-l .ngd-cmp-rank {
  order: -1;
}
#nba-seo-game-view .ngd-cmp-v.is-win .ngd-cmp-rank {
  color: var(--ngd-fg-dim);
}
#nba-seo-game-view .ngd-cmp-mid {
  min-width: 0;
}
#nba-seo-game-view .ngd-cmp-lab {
  font-size: 11px;
  color: var(--ngd-fg-mute);
  text-align: center;
  line-height: 1.3;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
#nba-seo-game-view .ngd-cmp-bar {
  display: block;
  height: 5px;
  border-radius: 3px;
  margin-top: 6px;
  background: var(--ngd-side-r);
}
#nba-seo-game-view .ngd-cmp-bar i {
  display: block;
  height: 100%;
  width: var(--l, 50%);
  border-radius: 3px 0 0 3px;
  background: var(--ngd-side-l);
}
@media (max-width: 1040px) {
  #nba-seo-game-view {
    padding-left: 14px;
    padding-right: 14px;
  }
  #nba-seo-game-view .ngd-two {
    grid-template-columns: minmax(0, 1fr);
  }
  #nba-seo-game-view .ngd-cmp-head,
  #nba-seo-game-view .ngd-cmp-row {
    grid-template-columns: minmax(0, 1fr) 130px minmax(0, 1fr);
  }
  #nba-seo-game-view .ngd-team-name {
    font-size: 22px;
  }
  #nba-seo-game-view .ngd-gc-head {
    padding: 14px 18px 13px;
  }
}
@media (prefers-reduced-motion: reduce) {
  #nba-seo-game-view .ngd-back {
    transition: none;
  }
}
@media (max-width: 1000px) {
  #nba-seo-game-view {
    padding: 16px 35px 200px;
    gap: 45px;
    font-size: 37px;
    line-height: 1.45;
  }
  #nba-seo-game-view :focus-visible {
    outline-width: 4px;
    outline-offset: 4px;
    border-radius: 10px;
  }
  #nba-seo-game-view .ngd-body {
    gap: 62px;
  }
  #nba-seo-game-view .ngd-props {
    gap: 30px;
  }
  #nba-seo-game-view .nsg-context {
    gap: 22px;
  }
  #nba-seo-game-view .ngd-empty {
    padding: 96px 40px;
    font-size: 31px;
    border-radius: 34px;
  }
  #nba-seo-game-view .ngd-topbar {
    gap: 26px;
    min-height: 110px;
    margin-bottom: -33px;
  }
  #nba-seo-game-view .ngd-back {
    gap: 14px;
    min-height: 110px;
    padding: 0 14px 0 0;
    font-size: 33px;
  }
  #nba-seo-game-view .ngd-back svg {
    width: 34px;
    height: 34px;
  }
  #nba-seo-game-view .ngd-gamecard {
    border-radius: 34px;
  }
  #nba-seo-game-view .ngd-gc-head {
    gap: 18px;
    padding: 34px 28px 30px;
  }
  #nba-seo-game-view .ngd-team {
    gap: 18px;
  }
  #nba-seo-game-view .ngd-crest {
    width: 84px;
    height: 84px;
    border-radius: 24px;
  }
  #nba-seo-game-view .ngd-crest img {
    width: 58px;
    height: 58px;
  }
  #nba-seo-game-view .ngd-crest b {
    font-size: 26px;
  }
  #nba-seo-game-view .ngd-team-city {
    font-size: 19px;
    letter-spacing: .14em;
  }
  #nba-seo-game-view .ngd-team-name {
    font-size: 38px;
    margin-top: 4px;
  }
  #nba-seo-game-view .ngd-gc-mid {
    max-width: 210px;
    padding: 0;
  }
  #nba-seo-game-view .ngd-gc-at {
    font-size: 30px;
  }
  #nba-seo-game-view .ngd-gc-meta {
    font-size: 24px;
    line-height: 1.35;
    margin-top: 8px;
    white-space: normal;
  }
  #nba-seo-game-view .ngd-controls {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: 16px;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    -ms-overflow-style: none;
    padding: 4px 35px;
    margin: 0 -35px;
  }
  #nba-seo-game-view .ngd-controls::-webkit-scrollbar {
    display: none;
  }
  #nba-seo-game-view .ngd-group {
    flex: 0 0 auto;
    gap: 5px;
    padding: 6px;
    border-radius: 24px;
  }
  #nba-seo-game-view .ngd-group button {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 98px;
    padding: 0 30px;
    font-size: 29px;
    border-radius: 18px;
  }
  #nba-seo-game-view .ngd-two {
    grid-template-columns: minmax(0, 1fr);
    gap: 20px;
  }
  #nba-seo-game-view .ngd-panel {
    padding: 34px 30px 30px;
    border-radius: 34px;
  }
  #nba-seo-game-view .ngd-panel h3 {
    font-size: 33px;
    margin-bottom: 8px;
  }
  #nba-seo-game-view .ngd-sub {
    font-size: 26px;
    margin-bottom: 28px;
  }
  #nba-seo-game-view .ngd-cmp-head,
  #nba-seo-game-view .ngd-cmp-row {
    grid-template-columns: minmax(0, 1fr) 210px minmax(0, 1fr);
    gap: 20px;
  }
  #nba-seo-game-view .ngd-cmp-head {
    padding-bottom: 18px;
  }
  #nba-seo-game-view .ngd-cmp-head span {
    font-size: 21px;
    letter-spacing: .10em;
  }
  #nba-seo-game-view .ngd-cmp-row {
    padding: 18px 0;
  }
  #nba-seo-game-view .ngd-cmp-v {
    gap: 14px;
    font-size: 32px;
  }
  #nba-seo-game-view .ngd-cmp-rank {
    font-size: 22px;
    padding: 3px 11px;
    border-radius: 8px;
  }
  #nba-seo-game-view .ngd-cmp-lab {
    font-size: 24px;
  }
  #nba-seo-game-view .ngd-cmp-bar {
    height: 11px;
    border-radius: 6px;
    margin-top: 12px;
  }
  #nba-seo-game-view .ngd-cmp-bar i {
    border-radius: 6px 0 0 6px;
  }
  #nba-seo-game-view .ngd-tabs {
    display: flex;
    justify-content: center;
    gap: 0;
    margin: -24px 0 0;
    border-bottom: 1px solid var(--ngd-line-soft);
  }
  #nba-seo-game-view .ngd-tab {
    flex: 0 1 auto;
    min-height: 108px;
    padding: 14px 46px;
    background: none;
    border: 0;
    border-bottom: 4px solid transparent;
    color: var(--ngd-fg-mute);
    font-size: 32px;
    font-weight: 600;
    cursor: pointer;
  }
  #nba-seo-game-view .ngd-tab.is-on {
    color: rgb(var(--theme-accent-rgb, 0, 211, 189));
    border-bottom-color: rgb(var(--theme-accent-rgb, 0, 211, 189));
  }
  #nba-seo-game-view .ngd-controls--pos {
    flex-wrap: wrap;
    justify-content: flex-start;
    gap: 0;
    overflow: visible;
    margin: -20px 0 0;
    padding: 6px 0 6px;
  }
  #nba-seo-game-view .ngd-controls--pos .ngd-posrow {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    flex: 1 1 auto;
    width: 100%;
    gap: 16px;
    padding: 0;
    background: none;
    border: 0;
    border-radius: 0;
  }
  #nba-seo-game-view .ngd-controls--pos .ngd-posrow button {
    position: relative;
    width: 100%;
    min-width: 0;
    min-height: 96px;
    padding: 0 8px;
    background: var(--ngd-ink-050);
    border: 1px solid var(--ngd-line-hi);
    border-radius: 24px;
    color: var(--ngd-fg-dim);
    font-size: 29px;
    font-weight: 600;
    transition: color .14s, border-color .14s;
  }
  #nba-seo-game-view .ngd-controls--pos .ngd-posrow button::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: -7px;
    bottom: -7px;
  }
  #nba-seo-game-view .ngd-controls--pos .ngd-posrow button:hover {
    color: var(--ngd-fg);
  }
  #nba-seo-game-view .ngd-controls--pos .ngd-posrow button.is-on {
    background: var(--ngd-ink-050);
    border-color: var(--ngd-accent);
    color: var(--ngd-accent);
  }
}
@media (prefers-reduced-motion: reduce) {
  #nba-seo-game-view .ngd-tab {
    transition: none;
  }
  #nba-seo-game-view .ngd-controls--pos .ngd-posrow button {
    transition: none;
  }
}

/* ── 2. NBA-only: season series, key players ───────────────────────────── */

#nba-seo-game-view a { color: inherit; text-decoration: none; }
#nba-seo-game-view .nsg-stack { display: flex; flex-direction: column; gap: 10px; min-width: 0; }

#nba-seo-game-view .nsg-srow {
  display: grid;
  grid-template-columns: 110px minmax(0, 1fr) auto;
  align-items: baseline;
  gap: 12px;
  padding: 9px 0;
  border-bottom: 1px solid var(--ngd-line-soft);
  font-size: 12.5px;
}
#nba-seo-game-view .nsg-srow:last-child { border-bottom: 0; }
#nba-seo-game-view .nsg-sdate { color: var(--ngd-fg-mute); }
#nba-seo-game-view .nsg-sgame { color: var(--ngd-fg); font-weight: 600; }
#nba-seo-game-view .nsg-sgame:hover { color: var(--ngd-accent); }
#nba-seo-game-view .nsg-stag {
  font-size: 10px;
  font-weight: 700;
  padding: 3px 7px;
  border-radius: 5px;
  background: var(--ngd-ink-150);
  color: var(--ngd-fg-dim);
  white-space: nowrap;
}
#nba-seo-game-view .nsg-srow.is-me .nsg-stag {
  background: var(--ngd-accent-08);
  box-shadow: inset 0 0 0 1px var(--ngd-accent-28);
  color: var(--ngd-accent);
}

#nba-seo-game-view .nsg-kgrid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
#nba-seo-game-view .nsg-khead {
  display: flex;
  align-items: center;
  gap: 8px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--ngd-line-soft);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--ngd-fg-mute);
}
#nba-seo-game-view .nsg-khead img { width: 18px; height: 18px; object-fit: contain; }
#nba-seo-game-view .nsg-krow {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 9px 0;
  border-bottom: 1px solid var(--ngd-line-soft);
}
#nba-seo-game-view .nsg-krow:last-child { border-bottom: 0; }
#nba-seo-game-view .nsg-kname { font-size: 12.5px; font-weight: 600; color: var(--ngd-fg); }
#nba-seo-game-view .nsg-krow:hover .nsg-kname { color: var(--ngd-accent); }
#nba-seo-game-view .nsg-kname i {
  margin-left: 6px;
  font-style: normal;
  font-weight: 400;
  font-size: 11px;
  color: var(--ngd-fg-mute);
}
#nba-seo-game-view .nsg-kline { font-size: 12px; color: var(--ngd-fg-dim); }
#nba-seo-game-view .nsg-kline b { font-weight: 700; color: var(--ngd-fg); }
#nba-seo-game-view .nsg-ksub { font-size: 11px; color: var(--ngd-fg-faint); }

@media (max-width: 1000px) {
  #nba-seo-game-view .nsg-stack { gap: 20px; }
  #nba-seo-game-view .nsg-srow {
    grid-template-columns: 200px minmax(0, 1fr) auto;
    gap: 20px;
    padding: 20px 0;
    font-size: 29px;
  }
  #nba-seo-game-view .nsg-stag { font-size: 22px; padding: 6px 12px; border-radius: 10px; }
  #nba-seo-game-view .nsg-kgrid { grid-template-columns: 1fr; gap: 28px; }
  #nba-seo-game-view .nsg-khead { gap: 14px; padding-bottom: 14px; font-size: 21px; }
  #nba-seo-game-view .nsg-khead img { width: 36px; height: 36px; }
  #nba-seo-game-view .nsg-krow { gap: 6px; padding: 18px 0; }
  #nba-seo-game-view .nsg-kname { font-size: 30px; }
  #nba-seo-game-view .nsg-kname i { margin-left: 12px; font-size: 25px; }
  #nba-seo-game-view .nsg-kline { font-size: 27px; }
  #nba-seo-game-view .nsg-ksub { font-size: 23px; }
}

/* ── 3. the workbench stays down while this view is up ─────────────────── */
/* (NBA batch 1 fixer.) The view now reveals the route as it mounts
   (nbaSeoGameView.js standUp), which drops the shell's is-pb-game hold --
   the rule that kept #content-section hidden. The research tools' route
   syncs (nbaPropCorrelation / nbaShotCharts / nbaPlayerStats / ... hide())
   reset its inline display as they boot, ~1 s later, and the empty flex:1
   section then squeezed this view until gameDetailNBA put it down again
   (two 0.33 shifts on desktop). Keyed to the view being in the DOM: the
   template's sync() removes it as soon as the path leaves the game, so this
   can never strand the workbench on an SPA hop. */
body:has(#nba-seo-game-view) #content-section { display: none !important; }

/* -- 4. the games column (founder 2026-10-15: games always show) --------- */
/* The page beside its own day's games, as the app's game page sits beside
   its column (#nba-gd-shell, core/style.css "GAME PAGES"): the same track,
   gap, side gutters and top inset (the column's head starts where the top
   bar does: 12px root padding + 6px here = the app's --gp-col-top 18px).
   The cards are the shared .nba-games-rail rules, and that column is
   display:none up to 1000px, so a phone keeps the page alone, unchanged:
   .nsg-main carries the root's own flex stack and inherits its gap. Only
   an island with a day (seo_content._day_games) adds the column. */
#nba-seo-game-view .nsg-main {
  display: flex;
  flex-direction: column;
  gap: inherit;
  min-width: 0;
}
#nba-seo-game-view .nsg-rail a.gc {
  display: block;
  color: inherit;
  text-decoration: none;
}
@media (min-width: 1001px) {
  #nba-seo-game-view.nsg-has-rail {
    --gp-col-top: 6px;
    display: grid;
    grid-template-columns: var(--gp-col-w) minmax(0, 1fr);
    gap: var(--gp-col-gap);
    align-items: start;
    max-width: 1920px;
    padding-left: 20px;
    padding-right: 20px;
  }
  #nba-seo-game-view.nsg-has-rail .nsg-main { gap: 18px; }
}

/* -- 5. the wide control bar (founder 2026-10-15) ------------------------- */
/* The app page's one-row bar (gameDetailNBA.js controlsHtml, the markup
   nbaSeoGameView.js draws): the Board / By player view first, in the accent,
   then the filters with one neutral active style, Over / Under included.
   nfl-game-detail.css section 14.2, re-scoped to this view as section 1 is
   (this view does not load that sheet); keep the two in step. Desktop only:
   the phone draws its position row (.ngd-controls--pos) instead. */
@media (min-width: 1001px) {
  #nba-seo-game-view .ngd-controls:not(.ngd-controls--pos) {
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: stretch;
    gap: 12px;
  }
  /* Every filter group, Over / Under included: one active style. Active and
     inactive share weight 500, so a click never reflows the row. */
  #nba-seo-game-view .ngd-filters { display: flex; flex-wrap: wrap; gap: 8px; }
  #nba-seo-game-view .ngd-filters .ngd-group button {
    /* 9px a side keeps the one row on one line from 1366 (NFL) / 1440 (NBA,
       more markets); narrower, it wraps to a second line. */
    padding: 5px 9px;
    font-size: 13px;
    font-weight: 500;
    color: var(--ngd-fg-dim);
  }
  #nba-seo-game-view .ngd-filters .ngd-group button:hover { color: var(--ngd-fg); }
  #nba-seo-game-view .ngd-filters .ngd-group button.is-on { background: var(--ngd-ink-150); color: var(--ngd-fg); }
  /* The view is where you are, not a filter: it leads the row and wears the
     accent (an accent edge, the active view on an accent wash), a step apart
     from the filters. Both buttons are 600, so a switch never reflows. */
  #nba-seo-game-view .ngd-filters .ngd-group[data-group="view"] {
    margin-right: 8px;
    border-color: var(--ngd-accent-28);
  }
  #nba-seo-game-view .ngd-filters .ngd-group[data-group="view"] button { font-weight: 600; }
  #nba-seo-game-view .ngd-filters .ngd-group[data-group="view"] button.is-on {
    background: var(--ngd-accent-14);
    color: var(--ngd-accent);
  }
}

/* -- 6. the wide tab bar (founder 2026-10-15, MLB's tab policy) ----------- */
/* Props | Matchup | Injuries at every width, as on the app page: the
   desktop tab bar in nfl-game-detail.css's wide block (the one the live
   shell put on desktop), re-scoped to this view; keep the two in step. The
   phone keeps its own, in the max-width: 1000px block. */
@media (min-width: 1001px) {
  #nba-seo-game-view .ngd-tabs {
    display: flex;
    gap: 2px;
    border-bottom: 1px solid var(--ngd-line-soft);
  }
  #nba-seo-game-view .ngd-tab {
    padding: 12px 16px 9px;
    margin-bottom: -1px;
    font-size: 13.5px;
    font-weight: 600;
    color: var(--ngd-fg-mute);
    border-bottom: 2px solid transparent;
    cursor: pointer;
    transition: color .15s;
  }
  #nba-seo-game-view .ngd-tab:hover { color: var(--ngd-fg-dim); }
  #nba-seo-game-view .ngd-tab.is-on {
    color: var(--ngd-accent);
    border-bottom-color: var(--ngd-accent);
  }
}
@media (min-width: 1001px) and (prefers-reduced-motion: reduce) {
  #nba-seo-game-view .ngd-tab { transition: none; }
}

/* -- 7. the tab strip in the game card (founder 2026-10-15) --------------- */
/* nfl-game-detail.css section 15.1 re-scoped to this view (MLB's masthead
   rail): the card gives up its bottom edge to the strip under it, centred.
   The negative margin is this root's flex gap. Wide only. */
@media (min-width: 1001px) {
  #nba-seo-game-view .ngd-gamecard:has(+ .ngd-tabs) {
    border-bottom: 0;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
  }
  #nba-seo-game-view .ngd-gamecard + .ngd-tabs {
    margin-top: -18px;
    justify-content: center;
    gap: 34px;
    padding: 3px 10px 0;
    background: var(--ngd-ink-050);
    border: 1px solid var(--ngd-line-soft);
    border-top: 0;
    border-radius: 0 0 var(--ngd-r) var(--ngd-r);
  }
  #nba-seo-game-view .ngd-gamecard + .ngd-tabs .ngd-tab {
    padding: 10px 8px 9px;
    margin-bottom: 0;
    border-bottom: 0;
  }
  #nba-seo-game-view .ngd-gamecard + .ngd-tabs .ngd-tab.is-on { font-weight: 700; }
}