/* ===========================================================================
   gameday.css - THE GAME PAGE, REBUILT (Sept 20)

   A game card with crests and conditions, crests in the box score, a Recap
   for finished games in cards, the count as a card, the catcher's view as a
   card, pitch rows with the movement drawn, the league comparisons as cards,
   and the plate appearance log as a stack of result cards.
   Loaded after style.css; every rule is scoped to .game-page.
   =========================================================================== */
.game-page{ --board: linear-gradient(180deg, #0c1016, #121a24); --board-line: rgba(255,255,255,.12); --bulb: #F2C14E; }

/* ---------- the game card ---------- */
.game-page .gh{
  display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 18px; align-items: stretch;
  padding: 18px 20px; border-radius: 20px; background: var(--board); border: 1px solid var(--board-line); box-shadow: 0 14px 34px rgba(0,0,0,.35); color: #F6F3EC;
}
@media (max-width: 860px){ .game-page .gh{ grid-template-columns: 1fr; } }
.game-page .gh__teams{ display: grid; gap: 8px; }
.game-page .gh__side{ display: grid; grid-template-columns: 64px minmax(0, 1fr) auto; gap: 14px; align-items: center; padding: 10px 14px; border-radius: 14px;
  background: rgba(255,255,255,.05); border: 1px solid transparent; text-decoration: none; color: inherit; transition: border-color .15s ease; }
.game-page .gh__side:hover{ border-color: var(--board-line); }
.game-page .gh__side.is-winner{ background: linear-gradient(90deg, rgba(242,193,78,.16), rgba(255,255,255,.04)); border-color: rgba(242,193,78,.45); }
.game-page .gh__side.is-loser{ opacity: .72; }
.game-page .gh__logo{ width: 58px; height: 58px; object-fit: contain; filter: drop-shadow(0 2px 6px rgba(0,0,0,.5)); }
.game-page .gh__nm{ display: grid; gap: 2px; min-width: 0; }
.game-page .gh__where{ font-weight: 800; font-size: .9rem; text-transform: uppercase; letter-spacing: .08em; color: rgba(246,243,236,.7); }
.game-page .gh__team{ font-family: var(--display-big); font-weight: 900; font-size: clamp(1.5rem, 2.4vw, 2.1rem); text-transform: uppercase; line-height: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.game-page .gh__runs{ font-family: var(--display-big); font-weight: 900; font-size: clamp(2.8rem, 4.6vw, 3.8rem); line-height: .9; color: #FFE7A3; min-width: 1.4ch; text-align: right; }
.game-page .gh__side.is-winner .gh__runs{ color: var(--bulb); }
.game-page .gh__meta{ display: grid; align-content: center; gap: 10px; }
.game-page .gh__status{ justify-self: start; font-family: var(--display-big); font-weight: 900; font-size: 1.5rem; text-transform: uppercase; letter-spacing: .04em; padding: 6px 16px; border-radius: 999px; background: #F6F3EC; color: #16121C; line-height: 1; }
.game-page .gh__status.is-live{ background: #ff5a4a; color: #fff; box-shadow: 0 0 18px rgba(255,90,74,.55); }
.game-page .gh__date{ font-weight: 800; font-size: 1.02rem; color: rgba(246,243,236,.85); }
.game-page .gh__conds{ display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.game-page .gh__cond{ display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 12px; background: rgba(255,255,255,.06); border: 1px solid var(--board-line); min-width: 0; }
.game-page .gh__condW{ display: grid; gap: 2px; min-width: 0; }
.game-page .gh__condW b{ font-family: var(--display-big); font-weight: 900; font-size: 1.3rem; line-height: 1.05; text-transform: uppercase; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.game-page .gh__condW span{ font-weight: 800; font-size: .88rem; text-transform: uppercase; letter-spacing: .05em; color: rgba(246,243,236,.75); }
.game-page .gh__wind{ flex: none; display: grid; place-items: center; width: 36px; height: 36px; border-radius: 50%; background: rgba(90,216,242,.18); color: #5ad8f2;
  font-weight: 900; font-size: 1.3rem; transform: rotate(var(--deg, 0deg)); }
.game-page .gh__note{ margin: 0; font-weight: 700; color: rgba(246,243,236,.85); }

/* crests in the box score */
.bx-linescore__logo{ width: 24px; height: 24px; object-fit: contain; flex: none; }
.bx-linescore__team{ display: inline-flex !important; align-items: center; gap: 8px; }

/* ---------- recap / pitch by pitch ---------- */
.game-page .gview{ display: flex; gap: 6px; padding: 6px; margin-top: 12px; border-radius: 16px; background: var(--board); border: 1px solid var(--board-line); }
.game-page .gview__btn{ flex: 1; display: grid; justify-items: center; gap: 2px; padding: 10px 14px; border-radius: 12px; cursor: pointer; border: 1px solid transparent; background: transparent; color: #F6F3EC; transition: background .15s ease; }
.game-page .gview__btn:hover{ background: rgba(255,255,255,.06); }
.game-page .gview__btn.is-on{ background: linear-gradient(180deg, var(--accent-hot), var(--accent)); color: var(--accent-ink); }
.game-page .gview__label{ font-family: var(--display-big); font-weight: 900; font-size: 1.45rem; text-transform: uppercase; line-height: 1; }
.game-page .gview__note{ font-weight: 800; font-size: .9rem !important; text-transform: uppercase; letter-spacing: .06em; opacity: .8; }
.game-page .gamerecap[hidden], .game-page #gamenow[hidden], .game-page #askpanel[hidden]{ display: none !important; }
.game-page .gamerecap{ display: grid; gap: 16px; margin-top: 16px; }

.rc-story{ display: grid; gap: 14px; padding: 18px 20px; border-radius: 20px; background: linear-gradient(135deg, color-mix(in srgb, var(--accent) 22%, var(--surface)), var(--surface) 65%); border: 1px solid var(--line); border-top: 6px solid var(--bulb); }
.rc-story__head{ display: flex; align-items: center; gap: 18px; }
.rc-story__logo{ width: 84px; height: 84px; object-fit: contain; flex: none; filter: drop-shadow(0 3px 10px rgba(0,0,0,.5)); }
.rc-story__hw{ display: grid; gap: 6px; min-width: 0; }
.game-page .rc-story__kicker{ font-family: var(--display-big) !important; font-weight: 900; font-size: 1rem !important; text-transform: uppercase; letter-spacing: .08em !important; color: var(--bulb); }
.game-page .rc-story__title{ margin: 0; font-family: var(--display-big) !important; font-weight: 900 !important; font-size: clamp(2.4rem, 4.4vw, 3.6rem) !important; text-transform: uppercase; line-height: .9; color: var(--ink); }
.game-page .rc-story__line{ margin: 0; font-weight: 800 !important; font-size: 1.18rem !important; line-height: 1.35; color: var(--ink) !important; }
.rc-story__chips{ display: flex; flex-wrap: wrap; gap: 8px; }
.rc-chip{ display: inline-flex; align-items: baseline; gap: 8px; padding: 8px 14px; border-radius: 12px; background: var(--board); border: 1px solid var(--board-line); }
.rc-chip b{ font-family: var(--display-big); font-weight: 900; font-size: 1.5rem; line-height: 1; color: var(--bulb); white-space: nowrap; }
.rc-chip span{ font-weight: 800; font-size: .95rem; text-transform: uppercase; letter-spacing: .04em; color: #F6F3EC; }

.rc-grid{ display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 16px; align-items: start; }
@media (max-width: 980px){ .rc-grid{ grid-template-columns: 1fr; } }
.rc-side{ display: grid; gap: 16px; }
.rc-card{ display: grid; gap: 12px; padding: 16px 18px; border-radius: 18px; background: var(--surface); border: 1px solid var(--line); }
.game-page .rc-card__title{ margin: 0; font-family: var(--display-big) !important; font-weight: 900 !important; text-transform: uppercase; font-size: 1.7rem !important; line-height: 1; color: var(--ink) !important; letter-spacing: .01em !important; }
.rc-sup > .rc-card__title{ margin-bottom: 12px; }

.rc-moments__list{ display: grid; gap: 8px; }
.rc-moment{ display: grid; grid-template-columns: 58px minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 10px 12px; border-radius: 14px; text-decoration: none; color: var(--ink);
  background: var(--surface-2); border: 1px solid var(--line); border-left: 5px solid var(--k, var(--accent)); transition: transform .12s ease, border-color .15s ease; }
.rc-moment:hover{ transform: translateX(3px); border-color: var(--k, var(--accent)); }
.rc-moment--hr{ --k: var(--bulb); } .rc-moment--hit{ --k: #46e58a; } .rc-moment--walk{ --k: #5ad8f2; } .rc-moment--out{ --k: #9aa6b4; } .rc-moment--k{ --k: #ff6f5f; }
.rc-moment.is-goahead{ background: linear-gradient(90deg, rgba(242,193,78,.18), var(--surface-2) 60%); border-color: rgba(242,193,78,.6); }
.rc-moment__when{ display: grid; justify-items: center; padding: 6px 4px; border-radius: 10px; background: var(--board); border: 1px solid var(--board-line); }
.rc-moment__when b{ font-weight: 900; font-size: .85rem; text-transform: uppercase; letter-spacing: .06em; color: rgba(246,243,236,.8); }
.rc-moment__when span{ font-family: var(--display-big); font-weight: 900; font-size: 1.4rem; line-height: 1; color: #F6F3EC; }
.rc-moment__words{ display: grid; gap: 3px; min-width: 0; }
.rc-moment__top{ display: flex; align-items: center; gap: 8px; }
.game-page .rc-moment__event{ font-family: var(--display-big); font-weight: 900; font-size: 1.3rem; text-transform: uppercase; line-height: 1; color: var(--k, var(--ink)); }
.rc-moment__flag{ font-weight: 900; font-size: .82rem; text-transform: uppercase; letter-spacing: .06em; padding: 3px 8px; border-radius: 999px; background: var(--bulb); color: #16121C; }
.game-page .rc-moment__desc{ margin: 0; font-weight: 700 !important; font-size: 1rem !important; line-height: 1.3; color: var(--ink) !important; }
.rc-moment__score{ display: grid; justify-items: end; gap: 4px; }
.rc-moment__runs{ font-family: var(--display-big); font-weight: 900; font-size: 1.5rem; line-height: 1; color: var(--k, var(--bulb)); }
.rc-moment__after{ display: inline-flex; align-items: center; gap: 5px; }
.rc-moment__after b{ font-family: var(--display-big); font-weight: 900; font-size: 1.2rem; }
.rc-mini{ width: 22px; height: 22px; object-fit: contain; flex: none; }
.rc-empty{ margin: 0; font-weight: 800; }

.rc-people{ display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
@media (max-width: 520px){ .rc-people{ grid-template-columns: 1fr; } }
.rc-person{ display: flex; align-items: center; gap: 10px; padding: 10px; border-radius: 14px; background: var(--surface-2); border: 1px solid var(--line); min-width: 0; }
.rc-face{ flex: none; width: 56px; height: 56px; border-radius: 50%; overflow: hidden; background: var(--surface-3); border: 2px solid var(--line); }
.rc-face img{ width: 100%; height: 100%; object-fit: cover; display: block; }
.rc-person__w{ display: grid; gap: 4px; min-width: 0; }
.rc-person__name{ display: flex; align-items: center; gap: 6px; min-width: 0; }
.game-page .rc-person__link{ font-family: var(--display-big); font-weight: 900; font-size: 1.15rem; text-transform: uppercase; line-height: 1.05; color: var(--ink); text-decoration: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.game-page .rc-person__link:hover{ color: var(--accent-hot); }
.game-page .rc-person__line{ font-weight: 900; font-size: 1.02rem; color: var(--bulb); }

.rc-staff{ display: grid; gap: 6px; }
.rc-staff__head{ display: flex; align-items: center; gap: 8px; font-family: var(--display-big); font-weight: 900; font-size: 1.15rem; text-transform: uppercase; }
.rc-arms{ display: grid; gap: 4px; }
.rc-arm{ display: grid; grid-template-columns: minmax(0, 1fr) repeat(4, 42px) 64px; gap: 6px; align-items: center; padding: 7px 10px; border-radius: 10px; background: var(--surface-2); }
.rc-arm--head{ background: none; padding-top: 0; padding-bottom: 0; }
.rc-arm--head span{ font-weight: 900; font-size: .85rem; text-transform: uppercase; letter-spacing: .05em; color: var(--ink-soft); text-align: center; }
.rc-arm b{ text-align: center; font-family: var(--display-big); font-weight: 900; font-size: 1.2rem; color: var(--ink); }
.rc-arm.is-starter{ background: color-mix(in srgb, var(--accent) 14%, var(--surface-2)); }
.rc-arm__who{ display: flex; align-items: center; gap: 6px; min-width: 0; }
.game-page .rc-arm__link{ font-weight: 800; font-size: 1rem; color: var(--ink); text-decoration: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rc-arm__tag{ flex: none; font-style: normal; font-weight: 900; font-size: .84rem; text-transform: uppercase; padding: 2px 6px; border-radius: 999px; background: var(--accent); color: var(--accent-ink); }

.rc-sup__grid{ display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
@media (max-width: 980px){ .rc-sup__grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.rc-fig{ --c: var(--accent); display: grid; gap: 4px; padding: 14px 16px; border-radius: 16px; background: var(--surface); border: 1px solid var(--line); border-top: 5px solid var(--c); }
.rc-fig--ev{ --c: #ff6f5f; } .rc-fig--dist{ --c: var(--bulb); } .rc-fig--velo{ --c: #5ad8f2; } .rc-fig--pa{ --c: #b494ff; }
.rc-fig__v{ display: flex; align-items: baseline; gap: 6px; }
.rc-fig__v b{ font-family: var(--display-big); font-weight: 900; font-size: 3rem; line-height: .9; color: var(--ink); }
.rc-fig__v span{ font-family: var(--display-big); font-weight: 900; font-size: 1.2rem; text-transform: uppercase; color: var(--c); }
.game-page .rc-fig__label{ font-family: var(--display-big) !important; font-weight: 900; font-size: 1.1rem !important; text-transform: uppercase; letter-spacing: .03em !important; color: var(--c) !important; }
.game-page .rc-fig__who{ font-weight: 900; font-size: 1.05rem; color: var(--ink); text-decoration: none; }
.game-page .rc-fig__line{ font-weight: 700; font-size: .98rem !important; color: var(--ink-soft); }

.rc-tape__top{ display: flex; align-items: center; justify-content: space-between; }
.rc-tape__logo{ width: 48px; height: 48px; object-fit: contain; }
.rc-tape__vs{ font-family: var(--display-big); font-weight: 900; font-size: 1.3rem; color: var(--bulb); }
.rc-tape__row{ display: grid; grid-template-columns: 70px minmax(0, 1fr) 70px; gap: 12px; align-items: center; }
.rc-tape__row > b{ font-family: var(--display-big); font-weight: 900; font-size: 1.7rem; text-align: center; color: var(--ink-soft); }
.rc-tape__row > b.is-up{ color: var(--ink); }
.rc-tape__mid{ display: grid; gap: 4px; justify-items: center; }
.rc-tape__mid > span{ font-weight: 900; font-size: .95rem; text-transform: uppercase; letter-spacing: .05em; color: var(--ink-soft); }
.rc-tape__bar{ display: flex; width: 100%; height: 10px; border-radius: 999px; overflow: hidden; background: rgba(0,0,0,.3); gap: 2px; }
.rc-tape__a{ background: var(--accent); } .rc-tape__b{ background: #5ad8f2; }

/* ---------- the count, as a card ---------- */
.game-page .cc{ display: grid; gap: 10px; min-width: 230px; padding: 14px 16px; border-radius: 18px; background: var(--board); border: 1px solid var(--board-line); color: #F6F3EC; box-shadow: 0 10px 24px rgba(0,0,0,.3); }
.game-page .cc__top{ display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.game-page .cc__status{ font-weight: 900; font-size: .9rem; text-transform: uppercase; letter-spacing: .08em; padding: 4px 10px; border-radius: 999px; background: rgba(255,255,255,.12); }
.game-page .cc__status:empty{ display: none; }
.game-page .cc__status.is-live{ background: #ff5a4a; color: #fff; }
.game-page .cc__inning{ font-family: var(--display-big); font-weight: 900; font-size: 1.4rem; text-transform: uppercase; color: var(--bulb); }
.game-page .cc__count{ display: flex; align-items: flex-start; justify-content: center; gap: 10px; }
.game-page .cc__digit{ display: grid; justify-items: center; gap: 2px; }
.game-page .cc__digit b{ font-family: var(--display-big); font-weight: 900; font-size: 4rem; line-height: .85; }
.game-page .cc__digit.is-balls b{ color: #46e58a; }
.game-page .cc__digit.is-strikes b{ color: #ff6f5f; }
.game-page .cc__digit span{ font-weight: 900; font-size: .85rem; text-transform: uppercase; letter-spacing: .08em; color: rgba(246,243,236,.8); }
.game-page .cc__dash{ font-family: var(--display-big); font-weight: 900; font-size: 3rem; line-height: .95; color: rgba(246,243,236,.5); }
.game-page .cc__bottom{ display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.game-page .cc__outs{ display: grid; gap: 4px; }
.game-page .cc__lights{ display: flex; gap: 6px; }
.game-page .cc__lights i{ width: 18px; height: 18px; border-radius: 50%; background: rgba(255,255,255,.1); border: 2px solid rgba(255,255,255,.25); }
.game-page .cc__lights i.is-on{ background: var(--bulb); border-color: var(--bulb); box-shadow: 0 0 10px rgba(242,193,78,.7); }
.game-page .cc__outsWord{ font-weight: 900; font-size: .95rem; text-transform: uppercase; letter-spacing: .05em; }
.game-page .cc__bases{ width: 76px; height: 62px; }
.game-page .cc__bases rect{ fill: rgba(255,255,255,.08); stroke: rgba(255,255,255,.5); stroke-width: 2; }
.game-page .cc__bases rect.is-on{ fill: var(--bulb); stroke: var(--bulb); filter: drop-shadow(0 0 5px rgba(242,193,78,.8)); }

/* ---------- the catcher's view, as a card ---------- */
.game-page .cview{ display: grid; gap: 8px; padding: 12px; border-radius: 16px; background: var(--board); border: 1px solid var(--board-line); align-content: start; }
.game-page .cview__head{ display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.game-page .cview__title{ font-family: var(--display-big); font-weight: 900; font-size: 1.3rem; text-transform: uppercase; color: #F6F3EC; }
.game-page .cview__key{ font-weight: 900; font-size: .85rem; text-transform: uppercase; letter-spacing: .05em; padding: 3px 8px; border-radius: 999px; border: 1px solid rgba(255,255,255,.35); color: rgba(246,243,236,.85); }

/* ---------- the pitch rows ---------- */
.game-page .pitchtable{ gap: 6px; }
.game-page .pitchrow{
  grid-template-columns: 40px 66px minmax(7.5rem, 1fr) 70px 150px minmax(9rem, 1.3fr) !important;
  align-items: center !important; gap: 10px !important; padding: 8px 10px !important; border-radius: 12px !important;
  border-left: 5px solid var(--fam, var(--line)) !important; white-space: normal !important; font-family: var(--body) !important;
}
.game-page .pitchrow--head{ padding: 0 10px !important; border-left-color: transparent !important; }
.game-page .pitchrow--head span{ font-family: var(--display-big) !important; font-weight: 900 !important; font-size: 1rem !important; text-transform: uppercase; letter-spacing: .06em; color: var(--ink-soft) !important; }
.game-page .pitchrow:not(.pitchrow--head) .pitchrow__n{ display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: var(--fam, var(--surface-3)); color: #16121C; font-family: var(--display-big); font-weight: 900; font-size: 1.2rem; }
.game-page .pitchrow:not(.pitchrow--head) .pitchrow__count{ display: inline-flex; justify-content: center; align-items: baseline; gap: 2px; padding: 4px 8px; border-radius: 10px; background: var(--board); border: 1px solid var(--board-line); color: #F6F3EC; font-family: var(--display-big) !important; font-size: 1.35rem !important; }
.game-page .pitchrow__balls{ color: #46e58a; } .game-page .pitchrow__strikes{ color: #ff6f5f; }
.game-page .pitchrow:not(.pitchrow--head) .pitchrow__type{ font-family: var(--display-big) !important; font-weight: 900 !important; font-size: 1.25rem !important; text-transform: uppercase; line-height: 1.05; color: var(--ink) !important; }
.game-page .pitchrow:not(.pitchrow--head) .pitchrow__velo{ font-family: var(--display-big) !important; font-weight: 900 !important; font-size: 1.6rem !important; text-align: right; color: var(--ink) !important; }
.game-page .pitchrow:not(.pitchrow--head) .pitchrow__shape{ display: flex; align-items: center; gap: 8px; }
.game-page .mvdot{ width: 34px; height: 34px; flex: none; border-radius: 8px; background: var(--board); }
.game-page .mvdot__axis{ stroke: rgba(255,255,255,.2); stroke-width: 1.4; }
.game-page .mvdot__arm{ stroke: var(--fam, #fff); stroke-width: 2.4; stroke-linecap: round; }
.game-page .mvdot__ball{ fill: var(--fam, #fff); stroke: #fff; stroke-width: 1.4; }
.game-page .pitchrow__shapeWords{ display: grid; grid-template-columns: auto auto; column-gap: 5px; row-gap: 0; align-items: baseline; }
.game-page .pitchrow__shapeWords b{ font-family: var(--display-big); font-weight: 900; font-size: 1.05rem; color: var(--ink); }
.game-page .pitchrow__shapeWords span{ font-weight: 800; font-size: .8rem; text-transform: uppercase; letter-spacing: .04em; color: var(--ink-soft); }
.game-page .pitchrow:not(.pitchrow--head) .pitchrow__call{ font-weight: 900 !important; font-size: 1.05rem !important; color: var(--ink) !important; }
.game-page .pitchrow--ball .pitchrow__call{ color: #46e58a !important; }
.game-page .pitchrow--strike .pitchrow__call{ color: #ff8a7d !important; }
.game-page .pitchrow--foul .pitchrow__call{ color: #ffc85c !important; }
.game-page .pitchrow--inplay{ background: linear-gradient(90deg, rgba(242,193,78,.14), var(--surface-2) 70%) !important; }
.game-page .pitchrow--inplay .pitchrow__result{ font-family: var(--display-big); font-weight: 900; font-size: 1.2rem; text-transform: uppercase; color: var(--bulb); }
.game-page .pitchrow__hit{ font-weight: 800; font-size: .95rem !important; color: var(--ink-soft); }
@media (max-width: 760px){
  .game-page .pitchrow{ grid-template-columns: 34px 58px 1fr 56px !important; }
  .game-page .pitchrow__shape, .game-page .pitchrow__call{ grid-column: 1 / -1 !important; padding-left: 0 !important; }
  .game-page .pitchrow--head .pitchrow__shape, .game-page .pitchrow--head .pitchrow__call{ display: none !important; }
}

/* ---------- the league comparisons, as cards ---------- */
.game-page .vm{ display: grid; gap: 10px; padding: 14px 16px; border-radius: 16px; background: var(--surface); border: 1px solid var(--line); border-top: 4px solid var(--accent); }
.game-page .vm__label{ font-family: var(--display-big) !important; font-weight: 900; font-size: 1.15rem !important; text-transform: uppercase; letter-spacing: .03em !important; color: var(--ink) !important; }
.game-page .vm__big{ display: flex; align-items: baseline; gap: 6px; }
.game-page .vm__big b{ font-family: var(--display-big); font-weight: 900; font-size: 2.8rem; line-height: .9; color: var(--ink); }
.game-page .vm__unit{ font-family: var(--display-big); font-weight: 900; font-size: 1.2rem; text-transform: uppercase; color: var(--accent); }
.game-page .vm__big em{ margin-left: auto; font-style: normal; font-weight: 900; font-size: .85rem; text-transform: uppercase; letter-spacing: .06em; padding: 3px 8px; border-radius: 999px; background: var(--accent); color: var(--accent-ink); }
.game-page .vm__track{ position: relative; height: 38px; margin: 18px 4px 4px; border-radius: 999px; background: linear-gradient(180deg, rgba(0,0,0,.25), rgba(0,0,0,.35)); }
.game-page .vm__band{ position: absolute; top: 0; bottom: 0; border-radius: 999px; background: rgba(90,216,242,.2); border: 1px solid rgba(90,216,242,.55); display: grid; place-items: center; overflow: hidden; }
.game-page .vm__bandLabel{ font-weight: 900; font-size: .84rem !important; text-transform: uppercase; letter-spacing: .05em; color: #5ad8f2; white-space: nowrap; }
.game-page .vm__pin{ position: absolute; top: -18px; bottom: -2px; width: 3px; margin-left: -1.5px; border-radius: 2px; background: #F6F3EC; }
.game-page .vm__pin.is-his{ background: var(--bulb); }
.game-page .vm__pinN{ position: absolute; top: -2px; left: 50%; transform: translate(-50%, -100%); font-family: var(--display-big); font-weight: 900; font-size: .95rem; white-space: nowrap; color: #F6F3EC; padding: 0 4px; border-radius: 6px; background: var(--surface); }
.game-page .vm__pin.is-his .vm__pinN{ color: var(--bulb); transform: translate(-50%, 0); top: auto; bottom: -22px; }
.game-page .vm__dot{ position: absolute; top: 50%; width: 22px; height: 22px; margin: -11px 0 0 -11px; border-radius: 50%; background: var(--accent); border: 3px solid #fff; box-shadow: 0 0 12px var(--accent); }
.game-page .vm__keys{ display: grid; grid-template-columns: repeat(auto-fit, minmax(90px, 1fr)); gap: 6px; margin-top: 14px; }
.game-page .vm__key{ display: flex; align-items: center; gap: 8px; padding: 7px 9px; border-radius: 10px; background: var(--surface-2); }
.game-page .vm__key i{ flex: none; width: 12px; height: 12px; border-radius: 50%; background: var(--accent); }
.game-page .vm__key.is-league i{ width: 4px; height: 18px; border-radius: 2px; background: #F6F3EC; }
.game-page .vm__key.is-his i{ width: 4px; height: 18px; border-radius: 2px; background: var(--bulb); }
.game-page .vm__key > div{ display: grid; gap: 0; }
.game-page .vm__key b{ font-family: var(--display-big); font-weight: 900; font-size: 1.15rem; line-height: 1; color: var(--ink); }
.game-page .vm__key span{ font-weight: 800; font-size: .84rem !important; text-transform: uppercase; letter-spacing: .04em; color: var(--ink-soft); }

/* ---------- every plate appearance, as result cards ---------- */
.game-page .playlog{ display: grid; gap: 6px; }
.game-page .playlog__half{ display: flex; align-items: center; gap: 10px; margin: 14px 0 4px !important; padding: 8px 12px; border-radius: 12px; background: var(--board); border: 1px solid var(--board-line); color: #F6F3EC; }
.game-page .playlog__crest{ width: 28px; height: 28px; object-fit: contain; }
.game-page .playlog__inn{ font-family: var(--display-big); font-weight: 900; font-size: 1.35rem; text-transform: uppercase; color: var(--bulb); }
.game-page .playlog__club{ font-weight: 800; font-size: 1rem; text-transform: uppercase; letter-spacing: .04em; }
.game-page .playrow{ --k: var(--line); border-radius: 14px !important; background: var(--surface) !important; border: 1px solid var(--line) !important; border-left: 5px solid var(--k) !important; overflow: hidden; }
.game-page .playrow--hr{ --k: var(--bulb); } .game-page .playrow--hit{ --k: #46e58a; } .game-page .playrow--walk{ --k: #5ad8f2; }
.game-page .playrow--k{ --k: #ff6f5f; } .game-page .playrow--out{ --k: #7d8896; }
.game-page .playrow.is-scoring{ background: linear-gradient(90deg, rgba(242,193,78,.12), var(--surface) 55%) !important; }
.game-page .playrow__summary{ grid-template-columns: 150px 44px minmax(0, 1fr) auto !important; align-items: center !important; gap: 12px !important; padding: 10px 14px !important; }
.game-page .playrow__summary:hover{ background: var(--surface-2); }
.game-page .playrow__event{ font-family: var(--display-big) !important; font-weight: 900 !important; font-size: 1.3rem !important; text-transform: uppercase; line-height: 1; color: var(--k) !important; }
.game-page .playrow--out .playrow__event{ color: var(--ink) !important; }
.game-page .playrow__who{ grid-column: 2; grid-row: 1; }
.game-page .playrow__who .face{ width: 40px !important; height: 40px !important; border-radius: 50% !important; }
.game-page .playrow__desc{ font-weight: 700 !important; font-size: 1.02rem !important; color: var(--ink) !important; line-height: 1.3; }
.game-page .playrow__tail{ gap: 10px !important; align-items: center !important; font-family: var(--body) !important; }
.game-page .playrow__count{ display: inline-flex; gap: 1px; padding: 3px 8px; border-radius: 8px; background: var(--board); color: #F6F3EC; font-family: var(--display-big); font-weight: 900; font-size: 1.15rem; }
.game-page .playrow__pitches{ font-weight: 800; font-size: .92rem !important; color: var(--ink-soft) !important; white-space: nowrap; }
.game-page .playrow__score{ font-family: var(--display-big); font-weight: 900; font-size: 1.15rem; padding: 3px 8px; border-radius: 8px; background: var(--bulb); color: #16121C !important; }
@media (max-width: 760px){
  .game-page .playrow__summary{ grid-template-columns: 44px minmax(0, 1fr) !important; }
  .game-page .playrow__who{ grid-column: 1; grid-row: 1 / span 2; }
  .game-page .playrow__event, .game-page .playrow__desc, .game-page .playrow__tail{ grid-column: 2; }
}
.rc-people{ grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); }
.rc-arm{ grid-template-columns: minmax(0, 1fr) repeat(4, 36px) 56px; }
.game-page .rc-person__line{ line-height: 1.25; }
/* the figure rail runs two across so it is not three times the height of the reading beside it */
.game-page .askanswer--split .figstrip{ grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 8px !important; }
.game-page .askanswer--split .figstrip__cell{ display: grid !important; gap: 2px !important; padding: 10px 12px !important; }
.game-page .askanswer--split .figstrip__label{ text-align: left !important; }
.game-page .askrail{ display: grid; gap: 10px; align-content: start; }

/* ===== SEPT 21: preview cards (What Decides It) and lineups ===== */
.gp .gpw-grid{ display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); gap: 14px; }
.gp .gpw{ --k: var(--accent); display: grid; gap: 10px; align-content: start; padding: 16px 18px; border-radius: 18px; background: var(--surface-2); border: 1px solid var(--line); border-top: 4px solid var(--k); }
.gp .gpw--runs{ --k: #46e58a; } .gp .gpw--the-park{ --k: #ffc94d; } .gp .gpw--form{ --k: #ff8a5c; } .gp .gpw--the-stakes{ --k: #ff6b8a; } .gp .gpw--the-season-series{ --k: #5cc8ff; }
.gp .gpw .gpw__label{ font-weight: 900; font-size: .8rem !important; text-transform: uppercase; letter-spacing: .08em; color: var(--k) !important; }
.gp .gpw .gpw__head{ margin: 0; font-family: var(--display-big, var(--display)); font-weight: 900; text-transform: uppercase; font-size: 1.45rem; line-height: 1.05; color: var(--ink); }
.gp .gpw__figs{ display: grid; grid-template-columns: repeat(auto-fit, minmax(110px, 1fr)); gap: 8px; }
.gp .gpw__fig{ display: grid; justify-items: center; gap: 4px; padding: 10px 8px; border-radius: 14px; background: rgba(0,0,0,.25); border: 1px solid var(--line); text-align: center; }
.gp .gpw__crest{ width: 26px; height: 26px; object-fit: contain; }
.gp .gpw__fig .gpw__v{ font-family: var(--display-big, var(--display)); font-weight: 900; font-size: 1.9rem; line-height: 1; color: var(--ink); }
.gp .gpw__fig .gpw__k{ font-weight: 900 !important; font-size: .84rem !important; text-transform: uppercase; letter-spacing: .05em; line-height: 1.2; color: var(--ink-soft) !important; }
.gp ul.gpw__points{ list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.gp .gpw__point{ position: relative; padding: 8px 10px 8px 26px; border-radius: 10px; background: rgba(255,255,255,.04); font-weight: 600; font-size: 1rem !important; line-height: 1.4; color: var(--ink); }
.gp .gpw__point::before{ content: ""; position: absolute; left: 11px; top: 15px; width: 7px; height: 7px; border-radius: 2px; background: var(--k); transform: rotate(45deg); }

.gp .gpl{ padding: 14px; border-radius: 18px; background: var(--surface-2); border: 1px solid var(--line); }
.gp .gpl__head{ display: flex; align-items: center; gap: 10px; padding-bottom: 10px; margin-bottom: 8px; border-bottom: 1px solid var(--line); }
.gp .gpl__logo{ width: 34px; height: 34px; object-fit: contain; }
.gp .gpl__team{ margin: 0; font-family: var(--display-big, var(--display)); font-weight: 900; text-transform: uppercase; font-size: 1.3rem; color: var(--ink); }
.gp ol.gpl__list{ list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.gp .gpl__row{ display: grid; grid-template-columns: 32px minmax(0, 1fr) auto; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 12px; background: rgba(0,0,0,.2); }
.gp .gpl__spot{ display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; background: var(--accent); color: var(--accent-ink, #120a24); font-family: var(--display-big, var(--display)); font-weight: 900; font-size: 1rem; }
.gp .gpl__who{ display: flex; align-items: center; gap: 8px; min-width: 0; }
.gp .gpl__name{ font-weight: 800; font-size: 1.02rem; color: var(--ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gp .gpl__pos{ flex: none; padding: 2px 7px; border-radius: 6px; background: rgba(255,255,255,.08); font-weight: 900; font-size: .84rem !important; letter-spacing: .04em; color: var(--ink-soft); }
.gp .gpl__stats{ display: flex; gap: 6px; }
.gp .gpl__stat{ display: grid; justify-items: center; min-width: 40px; }
.gp .gpl__stat b{ font-family: var(--display-big, var(--display)); font-weight: 900; font-size: 1.02rem; line-height: 1; color: var(--ink); }
.gp .gpl__stat span{ font-weight: 900; font-size: .84rem !important; letter-spacing: .06em; color: var(--ink-soft); }
@media (max-width: 560px){ .gp .gpl__row{ grid-template-columns: 30px minmax(0,1fr); } .gp .gpl__stats{ grid-column: 2; } }

/* SEPT 21: pitch key under every strike zone */
.pkey{ display: grid; gap: 8px; margin-top: 10px; }
.pkey__legend{ display: flex; flex-wrap: wrap; gap: 12px; }
.pkey__leg{ display: inline-flex; align-items: center; gap: 6px; font-weight: 900; font-size: .84rem !important; text-transform: uppercase; letter-spacing: .05em; color: var(--ink-soft); }
.pkey__leg i{ width: 12px; height: 12px; border-radius: 50%; }
.pkey__leg.is-strike i{ background: #ff5a5f; }
.pkey__leg.is-ball i{ border: 3px solid #3ddc84; box-sizing: border-box; }
.pkey__leg.is-inplay i{ background: #5cc8ff; }
.pkey__list{ display: flex; flex-wrap: wrap; gap: 6px; }
.pkey__chip{ display: inline-flex; align-items: center; gap: 6px; padding: 4px 9px 4px 4px; border-radius: 999px; background: rgba(0,0,0,.25); border: 1px solid var(--line); }
.pkey__n{ display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; font-weight: 900; font-size: .84rem; color: #0d0b1a; background: #9aa4b8; box-sizing: border-box; }
.pkey__chip.is-strike .pkey__n{ background: #ff5a5f; }
.pkey__chip.is-inplay .pkey__n{ background: #5cc8ff; }
.pkey__chip.is-ball .pkey__n{ background: transparent; border: 3px solid #3ddc84; color: #3ddc84; }
.pkey__type{ font-weight: 800; font-size: .86rem !important; color: var(--ink); white-space: nowrap; }
.pkey__velo{ font-family: var(--display-big, var(--display)); font-weight: 900; font-size: .9rem; color: var(--ink-soft); }

/* ===== SEPT 21: the Last Pitch card, rebuilt as the site's cards ===== */
.game-page .asksubject.asksubject{ display: grid !important; grid-template-columns: 150px minmax(0, 1fr) !important; grid-template-areas: "count line" "count who" "result result" "next next" "back back"; gap: 10px 18px !important; align-items: center;
  padding: 18px 20px !important; border-radius: 18px !important; background: var(--board) !important; border: 1px solid var(--board-line) !important; }
.game-page .asksubject .asksubject__dot{ display: none !important; }
.game-page .asksubject .asksubject__count{ grid-area: count; display: grid !important; justify-items: center; align-content: center; gap: 6px; height: 100%; min-height: 120px; padding: 12px; border-radius: 16px; background: rgba(255,255,255,.05); border: 1px solid var(--board-line); }
.game-page .asksubject .asksubject__countFig{ font-family: var(--display-big) !important; font-weight: 900; font-size: 3.4rem !important; line-height: .9; display: flex; gap: 4px; }
.game-page .asksubject .asksubject__countFig b:first-child{ color: #46e58a; } .game-page .asksubject .asksubject__countFig b:last-child{ color: #ff6b6b; }
.game-page .asksubject .asksubject__countFig i{ font-style: normal; color: var(--ink-soft); }
.game-page .asksubject .asksubject__countCap{ font-weight: 900 !important; font-size: .8rem !important; letter-spacing: .08em !important; text-transform: uppercase; color: var(--ink-soft) !important; }
.game-page .asksubject .asksubject__line{ grid-area: line; display: flex !important; flex-wrap: wrap; align-items: baseline; gap: 8px 14px; margin: 0 !important; }
.game-page .asksubject .asksubject__name{ font-family: var(--display-big) !important; font-weight: 900 !important; font-size: clamp(1.8rem, 3vw, 2.4rem) !important; text-transform: uppercase; line-height: 1; color: var(--ink); }
.game-page .asksubject .asksubject__velo{ display: inline-flex; align-items: baseline; gap: 4px; padding: 4px 12px; border-radius: 999px; background: var(--bulb); color: #16121C; }
.game-page .asksubject .asksubject__veloNum{ font-family: var(--display-big) !important; font-weight: 900; font-size: 1.5rem !important; line-height: 1; color: #16121C !important; }
.game-page .asksubject .asksubject__veloUnit{ font-style: normal; font-weight: 900; font-size: .8rem !important; text-transform: uppercase; color: #16121C !important; }
.game-page .asksubject .asksubject__seq{ padding: 4px 10px; border-radius: 999px; border: 1px solid var(--board-line); font-weight: 800 !important; font-size: .85rem !important; text-transform: uppercase; letter-spacing: .05em; color: var(--ink-soft) !important; }
.game-page .asksubject .asksubject__who{ grid-area: who; display: flex !important; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0 !important; }
.game-page .asksubject .asksubject__whoName{ font-weight: 800 !important; font-size: 1.15rem !important; color: var(--ink) !important; }
.game-page .asksubject .asksubject__whoJoin{ font-weight: 700 !important; font-size: .95rem !important; color: var(--ink-soft) !important; }
.game-page .asksubject .asksubject__whoWhen{ padding: 3px 10px; border-radius: 999px; background: rgba(255,255,255,.08); font-weight: 900 !important; font-size: .8rem !important; text-transform: uppercase; letter-spacing: .06em; color: var(--ink) !important; }
.game-page .asksubject .asksubject__result{ grid-area: result; display: flex !important; flex-wrap: wrap; align-items: center; gap: 10px; margin: 0 !important; padding: 12px 14px; border-radius: 14px; background: rgba(255,255,255,.05); border-left: 4px solid var(--bulb); }
.game-page .asksubject .asksubject__resultCap{ font-weight: 900 !important; font-size: .78rem !important; letter-spacing: .08em !important; text-transform: uppercase; color: var(--bulb) !important; }
.game-page .asksubject .asksubject__call{ font-family: var(--display-big) !important; font-weight: 900; font-size: 1.35rem !important; text-transform: uppercase; color: var(--ink); }
.game-page .asksubject .asksubject__ended{ font-weight: 800 !important; font-size: 1.05rem !important; color: var(--ink) !important; }
.game-page .asksubject .asksubject__next{ grid-area: next; margin: 0 !important; }
.game-page .asksubject .asksubject__back{ grid-area: back; justify-self: start; }
@media (max-width: 640px){ .game-page .asksubject.asksubject{ grid-template-columns: 1fr !important; grid-template-areas: "count" "line" "who" "result" "next" "back"; } }

/* the figures under an answer: number, then label, then note, never side by side */
.game-page .figstrip{ display: grid !important; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)) !important; gap: 10px !important; }
.game-page .askanswer--split .figstrip{ grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)) !important; }
.game-page .figstrip .figstrip__cell{ display: grid !important; grid-template-columns: 1fr !important; justify-items: start; gap: 4px !important; padding: 12px 14px !important; border-radius: 14px; background: var(--surface-2); border: 1px solid var(--line); border-top: 3px solid var(--bulb); }
.game-page .figstrip .figstrip__value{ margin: 0; font-family: var(--display-big) !important; font-weight: 900; font-size: 1.9rem !important; line-height: 1; color: var(--ink); white-space: nowrap; }
.game-page .figstrip .figstrip__unit{ margin-left: 3px; font-family: var(--body) !important; font-weight: 800; font-size: .85rem !important; color: var(--ink-soft); }
.game-page .figstrip .figstrip__label{ font-weight: 900 !important; font-size: .8rem !important; text-transform: uppercase; letter-spacing: .06em !important; color: var(--bulb) !important; text-align: left !important; }
.game-page .figstrip .figstrip__note{ font-weight: 600 !important; font-size: .92rem !important; line-height: 1.35; color: var(--ink) !important; }

/* ===== SEPT 21: the whole ask panel in the site's card language ===== */
.game-page .askpanel{ display: grid; gap: 16px; padding: 22px 24px !important; border-radius: 22px !important; background: var(--surface) !important; border: 1px solid var(--line) !important; border-top: 4px solid var(--bulb) !important; box-shadow: 0 10px 30px rgba(0,0,0,.22); }
.game-page .askpanel__head{ display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 12px; }
.game-page .askpanel .askpanel__title{ margin: 0; font-family: var(--display-big) !important; font-weight: 900 !important; text-transform: uppercase; font-size: clamp(1.8rem, 3vw, 2.4rem) !important; line-height: 1; color: var(--ink); }
.game-page .askpanel__tabs{ display: inline-flex; padding: 4px; gap: 4px; border-radius: 999px; background: rgba(0,0,0,.3); border: 1px solid var(--line); }
.game-page .askpanel__tab{ padding: 9px 18px; border: 0; border-radius: 999px; background: transparent; color: var(--ink-soft); font: inherit; font-weight: 900; font-size: .9rem; text-transform: uppercase; letter-spacing: .05em; cursor: pointer; }
.game-page .askpanel__tab.is-on{ background: var(--bulb); color: #16121C; }
/* the questions: big tappable cards, not small pills */
.game-page .askq{ display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 14px; margin: 4px 0 2px; }
.game-page .askq__group{ --q: var(--bulb); padding: 14px; border-radius: 18px; background: var(--surface-2); border: 1px solid var(--line); border-top: 4px solid var(--q); }
.game-page .askq__group--bat{ --q: #4DA3FF; }
.game-page .askq__head{ margin: 0 0 10px !important; font-family: var(--display-big, var(--display)) !important; font-weight: 900 !important; font-size: 1.15rem !important; text-transform: uppercase; letter-spacing: .02em; line-height: 1; color: var(--q) !important; }
.game-page .askchips{ display: grid !important; grid-template-columns: 1fr; gap: 8px !important; }
.game-page .askchip{ display: grid !important; grid-template-columns: 34px 1fr; align-items: center; gap: 12px; width: 100%; min-height: 56px; padding: 10px 14px 10px 10px !important; border-radius: 14px !important; border: 1px solid var(--line) !important; background: var(--surface, var(--bg)) !important; color: var(--ink) !important; font: inherit; text-align: left; cursor: pointer; transition: transform .12s ease, border-color .12s ease, background .12s ease; }
.game-page .askchip:hover{ transform: translateX(3px); border-color: var(--q) !important; }
.game-page .askchip:focus-visible{ outline: 2px solid var(--q); outline-offset: 2px; }
.game-page .askchip__num{ display: grid; place-items: center; width: 34px; height: 34px; border-radius: 10px; background: color-mix(in srgb, var(--q) 16%, transparent); color: var(--q); font-family: var(--display-big, var(--display)); font-weight: 900; font-size: 1.1rem; line-height: 1; }
.game-page .askchip__body{ display: grid; gap: 3px; min-width: 0; }
.game-page .askchip__tag{ font-weight: 800 !important; font-size: .78rem !important; letter-spacing: .06em; text-transform: uppercase; color: var(--muted, var(--ink)) !important; opacity: .85; }
.game-page .askchip__q{ font-weight: 800 !important; font-size: 1.12rem !important; line-height: 1.2; color: var(--ink) !important; }
.game-page .askchip.is-on{ background: color-mix(in srgb, var(--q) 14%, var(--surface-2)) !important; border-color: var(--q) !important; box-shadow: inset 4px 0 0 var(--q); }
.game-page .askchip.is-on .askchip__num{ background: var(--q); color: #16121C; }
.game-page .askchip.is-on .askchip__tag{ color: var(--q) !important; opacity: 1; }
.game-page .askpanel__tip{ display: inline-flex; align-items: center; gap: 10px; justify-self: start; margin: 0; padding: 7px 14px; border-radius: 999px; background: rgba(255,255,255,.05); border: 1px solid var(--line); font-weight: 700 !important; font-size: .95rem !important; color: var(--ink) !important; }
.game-page .askpanel__tip b{ padding: 2px 8px; border-radius: 999px; background: var(--bulb); color: #16121C; font-weight: 900; font-size: .72rem; text-transform: uppercase; letter-spacing: .06em; }
/* the answer */
.game-page .askanswer{ display: grid; gap: 16px; }
.game-page .askanswer--split{ grid-template-columns: minmax(0, 1.5fr) minmax(280px, 1fr) !important; align-items: start; }
.game-page .askanswer--split > .askmoment2, .game-page .askanswer--split > .askverdict, .game-page .askanswer--split > .askanswer__source{ grid-column: 1 / -1; }
@media (max-width: 900px){ .game-page .askanswer--split{ grid-template-columns: 1fr !important; } }
.game-page .askverdict{ display: flex !important; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 12px; padding: 16px 18px !important; border-radius: 18px !important; background: var(--surface-2) !important; border: 1px solid var(--line) !important; border-left: 5px solid var(--bulb) !important; }
.game-page .askverdict .askverdict__label{ margin: 0; font-family: var(--display-big) !important; font-weight: 900 !important; text-transform: uppercase; font-size: 1.7rem !important; line-height: 1; color: var(--ink) !important; }
.game-page .askverdict .askverdict__call{ margin: 4px 0 0; font-weight: 800 !important; font-size: 1.02rem !important; color: var(--ink-soft) !important; }
.game-page .asktags{ display: flex; flex-wrap: wrap; gap: 6px; }
.game-page .asktag{ padding: 6px 12px !important; border-radius: 999px !important; background: rgba(255,255,255,.06) !important; border: 1px solid var(--line) !important; font-weight: 900 !important; font-size: .78rem !important; text-transform: uppercase; letter-spacing: .06em !important; color: var(--ink) !important; }
.game-page .askanswer__prose.is-cards{ display: grid; gap: 12px; }
.game-page .askcard{ display: grid; gap: 8px; padding: 16px 18px !important; border-radius: 18px !important; background: var(--surface-2) !important; border: 1px solid var(--line) !important; border-top: 4px solid var(--line) !important; }
.game-page .askcard.is-main{ border-top-color: var(--bulb) !important; background: linear-gradient(160deg, color-mix(in srgb, var(--bulb) 12%, var(--surface-2)), var(--surface-2) 60%) !important; }
.game-page .askcard .askcard__title{ margin: 0; font-family: var(--display-big) !important; font-weight: 900 !important; text-transform: uppercase; font-size: 1.35rem !important; line-height: 1; color: var(--bulb) !important; letter-spacing: .01em; }
.game-page .askcard:not(.is-main) .askcard__title{ color: var(--ink) !important; }
.game-page .askcard .askcard__text{ margin: 0; font-weight: 600 !important; font-size: 1.05rem !important; line-height: 1.5; color: var(--ink) !important; }
.game-page .askanswer__fig{ font-family: var(--display-big); font-weight: 900; font-size: 1.12em; color: var(--bulb); }
.game-page .askanswer__source{ justify-self: start; margin: 0; padding: 6px 12px; border-radius: 999px; background: rgba(0,0,0,.25); border: 1px solid var(--line); font-weight: 800 !important; font-size: .8rem !important; text-transform: uppercase; letter-spacing: .05em; color: var(--ink-soft) !important; }
/* the situation card */
.game-page .askmoment2{ display: grid; gap: 12px; padding: 16px 18px !important; border-radius: 18px !important; background: var(--surface-2) !important; border: 1px solid var(--line) !important; border-left: 5px solid #ffc94d !important; }
.game-page .askmoment2 .askmoment2__cap{ font-family: var(--display-big) !important; font-weight: 900 !important; text-transform: uppercase; font-size: 1.3rem !important; color: #ffc94d !important; letter-spacing: .01em !important; }
.game-page .askmoment2__tiles{ display: grid !important; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 8px; }
.game-page .askmoment2__tile{ display: grid; gap: 4px; padding: 10px 12px; border-radius: 12px; background: rgba(0,0,0,.22); border: 1px solid var(--line); }
.game-page .askmoment2__value{ font-family: var(--display-big) !important; font-weight: 900; font-size: 1.5rem !important; line-height: 1; text-transform: uppercase; color: var(--ink); }
/* the count grid and the pitch picker in Any Count mode */
.game-page .countgrid{ display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)) !important; gap: 8px !important; }
.game-page .countgrid__cell{ padding: 14px 0 !important; border-radius: 12px !important; border: 1px solid var(--line) !important; background: var(--surface-2) !important; color: var(--ink) !important; font-family: var(--display-big) !important; font-weight: 900 !important; font-size: 1.5rem !important; cursor: pointer; }
.game-page .countgrid__cell.is-on{ background: var(--bulb) !important; color: #16121C !important; border-color: var(--bulb) !important; }
.game-page .askpicker{ display: flex; align-items: center; gap: 10px; }
.game-page .askpicker .askpicker__label{ font-weight: 900 !important; font-size: .82rem !important; text-transform: uppercase; letter-spacing: .06em !important; color: var(--bulb) !important; }
.game-page .askpicker__select{ padding: 10px 14px; border-radius: 12px; border: 1px solid var(--line); background: var(--surface-2); color: var(--ink); font: inherit; font-weight: 800; font-size: 1rem; }
.game-page .figstrip .figstrip__label, .game-page .figstrip .figstrip__label .term{ justify-self: start !important; text-align: left !important; display: inline-block; }
.game-page .figstrip .figstrip__cell > *{ justify-self: start; }
.game-page .game__hint{ display: none; }
.game-page .askverdict p.askverdict__label.askverdict__label{ font-family: var(--display-big) !important; font-size: 1.8rem !important; letter-spacing: .01em !important; }

/* Preview: club tiles and probable pitchers (Sept 21) */
.game-page .gp-club__facts{ grid-template-columns: repeat(3, 1fr) !important; gap: 8px !important; }
.game-page .gp-club__fact{ display: grid !important; gap: 4px; align-content: start; padding: 10px 12px !important; }
.game-page .gp-club__factValue{ font-family: var(--display-big, var(--display)) !important; font-weight: 900 !important; font-size: 1.6rem !important; line-height: 1; }
.game-page .gp-club__factLabel{ font-weight: 800 !important; font-size: .82rem !important; letter-spacing: .06em; white-space: nowrap; color: var(--ink) !important; opacity: .8; }
.game-page .gp-arm{ display: grid !important; gap: 10px; align-content: start; padding: 16px 18px !important; border-radius: 16px !important; }
.game-page .gp-arm__top{ display: flex; align-items: center; gap: 10px; }
.game-page .gp-arm__logo{ width: 30px; height: 30px; object-fit: contain; }
.game-page .gp-arm__club{ font-weight: 900 !important; font-size: .9rem !important; letter-spacing: .06em; text-transform: uppercase; color: var(--ink) !important; opacity: .85; }
.game-page .gp-arm__name{ font-family: var(--display-big, var(--display)) !important; font-weight: 900 !important; font-size: 1.8rem !important; text-transform: uppercase; line-height: 1; color: var(--ink) !important; }
.game-page .gp-arm__none{ justify-self: start; padding: 5px 12px; border-radius: 999px; background: color-mix(in srgb, #F2C14E 18%, var(--surface-2)); border: 1px solid color-mix(in srgb, #F2C14E 45%, var(--line)); color: var(--ink) !important; font-weight: 800 !important; font-size: .92rem !important; }
.game-page .gp-arm__line{ display: grid; grid-template-columns: repeat(5, 1fr); gap: 6px; }
.game-page .gp-arm__cell{ display: grid; gap: 2px; padding: 8px 10px; border-radius: 10px; background: var(--surface-2); text-align: center; }
.game-page .gp-arm__value{ font-family: var(--display-big, var(--display)); font-weight: 900; font-size: 1.3rem; }

/* The Last Pitch card is dark in both themes, so its text stays light in both. */
.game-page .asksubject.asksubject{ --ink: #F2F5EC; --ink-soft: #C3D1BD; --board-line: rgba(242,245,236,.18); color: #F2F5EC; }
.game-page .asksubject .asksubject__whoWhen{ background: rgba(255,255,255,.1); }
.game-page .askpanel__tip b{ white-space: nowrap; flex-shrink: 0; }
.game-page .asksubject .asksubject__nextCap, .game-page .asksubject .asksubject__nextNote{ color: #C3D1BD !important; }