@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700;800;900&family=JetBrains+Mono:wght@600;800&display=swap');

:root {
  color-scheme: light;
  --page: #eef4fb; --panel: #ffffff; --panel-2: #f8fafc; --panel-3: #edf5ff;
  --ink: #0f172a; --muted: #475569; --soft: #64748b; --line: #cbd5e1;
  --brand: #2563eb; --brand-2: #0891b2;
  --good: #16a34a; --bad: #dc2626; --hot: #f97316; --yellow: #b45309;
  --shadow: rgba(15,23,42,.10); --focus: #38bdf8;
  --grid-lo: #dbeafe; --grid-hi: #b91c1c; --chip-ink: #ffffff;
  /* Chip/badge tones are darkened for light mode: --good at 11px on white
     measured 3.15:1, under the 4.5 floor. These clear it in both themes. */
  --good-d: #15803d; --brand-d: #1d4ed8; --brand2-d: #0e7490;
  --hot-d: #c2410c; --yellow-d: #a16207; --bad-d: #b91c1c;
  /* Advantage highlighting: green = batter won it, blue = pitcher won it.
     Held apart from --brand so UI chrome is never mistaken for a verdict. */
  --edge-b-bg: #dcfce7; --edge-b-ink: #14532d; --edge-b-line: #86efac;
  --edge-p-bg: #dbeafe; --edge-p-ink: #1e3a8a; --edge-p-line: #93c5fd;
}
html.nyce-dark, body.nyce-dark {
  color-scheme: dark;
  --page: #070b12; --panel: #101722; --panel-2: #151e2b; --panel-3: #182436;
  --ink: #f8fafc; --muted: #cbd5e1; --soft: #94a3b8; --line: #2b3a4f;
  --brand: #60a5fa; --brand-2: #22d3ee;
  --good: #34d399; --bad: #fb7185; --hot: #fb923c; --yellow: #fbbf24;
  --shadow: rgba(0,0,0,.38); --focus: #67e8f9;
  --grid-lo: #1e293b; --grid-hi: #f87171; --chip-ink: #06121f;
  /* On dark panels the bright tones already clear 8:1, so they stay bright. */
  --good-d: #34d399; --brand-d: #60a5fa; --brand2-d: #22d3ee;
  --hot-d: #fb923c; --yellow-d: #fbbf24; --bad-d: #fb7185;
  --edge-b-bg: #0f2a1d; --edge-b-ink: #6ee7b7; --edge-b-line: #15803d;
  --edge-p-bg: #12233d; --edge-p-ink: #93c5fd; --edge-p-line: #1d4ed8;
}
* { box-sizing: border-box; }
body {
  margin: 0; min-height: 100vh; background: var(--page); color: var(--ink);
  font-family: Inter, system-ui, sans-serif; -webkit-font-smoothing: antialiased;
}
button, input, select { font: inherit; color: inherit; }
button { cursor: pointer; }
button:focus-visible, a:focus-visible, input:focus-visible {
  outline: 3px solid var(--focus); outline-offset: 2px;
}

/* ---------- top bar ---------- */
.lab-top {
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  padding: 14px 22px; border-bottom: 1px solid var(--line); background: var(--panel);
  position: sticky; top: 0; z-index: 30;
}
.lab-brand { display: flex; align-items: center; gap: 10px; font-weight: 900; letter-spacing: .02em; }
.lab-mark {
  width: 30px; height: 30px; border-radius: 9px; display: grid; place-items: center;
  background: var(--brand); color: #fff; font-weight: 900; font-size: 15px;
}
.lab-brand small {
  display: block; font-weight: 700; font-size: 11px; color: var(--soft);
  letter-spacing: .09em; text-transform: uppercase;
}
.top-actions { display: flex; align-items: center; gap: 10px; }
.chip {
  border: 1px solid var(--line); background: var(--panel-2); color: var(--muted);
  border-radius: 999px; padding: 6px 13px; font-size: 12px; font-weight: 700;
}
.theme-btn {
  border: 1px solid var(--line); background: var(--panel-2);
  border-radius: 10px; width: 38px; height: 34px; font-size: 15px;
}

.lab-shell { display: grid; grid-template-columns: 312px minmax(0,1fr); align-items: start; }

/* ---------- rail ---------- */
.rail {
  border-right: 1px solid var(--line); background: var(--panel);
  height: calc(100vh - 61px); position: sticky; top: 61px;
  display: flex; flex-direction: column; min-height: 0;
}
.rail-head { padding: 15px 16px 11px; border-bottom: 1px solid var(--line); }
.rail-head h2 {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  margin: 0 0 3px; font-size: 12px; letter-spacing: .13em; text-transform: uppercase;
  color: var(--soft); font-weight: 800;
}
.rail-head h2 em {
  font-style: normal; letter-spacing: .06em; color: var(--brand-d);
  font-size: 10px; white-space: nowrap;
}
.rail-head p { margin: 0 0 10px; font-size: 13px; color: var(--muted); font-weight: 600; }
.slate-controls {
  display: grid; grid-template-columns: minmax(0,1fr) auto auto; gap: 6px;
  margin-bottom: 8px;
}
.slate-controls input,
.slate-controls button {
  min-width: 0; border: 1px solid var(--line); background: var(--panel-2);
  border-radius: 9px; padding: 7px 8px; font-size: 11.5px; font-weight: 800;
}
.slate-controls button {
  background: var(--panel); color: var(--muted); white-space: nowrap;
}
.slate-controls button:hover { border-color: var(--brand); color: var(--brand-d); }
.rail-search {
  width: 100%; border: 1px solid var(--line); background: var(--panel-2);
  border-radius: 10px; padding: 8px 11px; font-size: 13px; font-weight: 600;
}
.rail-search::placeholder { color: var(--soft); }
/* basis 0, not auto: with an auto basis the list's own content height made it
   claim the whole rail and squeezed the filter panel above it to a sliver. */
.rail-list { overflow-y: auto; flex: 1 1 0; min-height: 168px; padding: 6px; }
.rail-row {
  width: 100%; text-align: left; display: grid;
  grid-template-columns: 4px 26px minmax(0,1fr) auto; gap: 10px; align-items: center;
  border: 1px solid transparent; background: none; border-radius: 11px;
  padding: 8px 9px 8px 0; margin-bottom: 2px;
}
.rail-row:hover { background: var(--panel-3); }
.rail-row.on { background: var(--panel-3); border-color: var(--brand); }
.rail-spine { width: 4px; height: 38px; border-radius: 3px; background: var(--soft); }
.rail-rank {
  /* --soft measured 4.33:1 here at 11px; --muted clears the 4.5 floor. */
  font-size: 11px; font-weight: 800; color: var(--muted); text-align: right;
  font-family: 'JetBrains Mono', monospace;
}
.rail-name {
  display: block; font-size: 13.5px; font-weight: 800;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.rail-vs {
  display: block; font-size: 11.5px; color: var(--muted); font-weight: 600;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin-top: 1px;
}
.rail-right { display: flex; flex-direction: column; align-items: flex-end; gap: 3px; padding-right: 4px; }
.rail-rc { font-size: 13px; font-weight: 800; font-family: 'JetBrains Mono', monospace; }
/* ---------- slate-wide player search results ----------
   Sits under the ranked rail, inside the same scroll container. Held visually
   apart from .rail-row because these are NOT ranked candidates -- they are
   players found anywhere on the slate, which is the whole point of the box. */
.find-block {
  margin: 10px 4px 6px; padding: 10px 10px 4px;
  border-top: 1px dashed var(--line);
}
.find-block h4 {
  margin: 0 0 2px; font-size: 11px; font-weight: 900; letter-spacing: .08em;
  text-transform: uppercase; color: var(--brand-d);
}
.find-note { margin: 0 0 9px; font-size: 11.5px; font-weight: 600; color: var(--muted); }
.find-card {
  border: 1px solid var(--line); border-radius: 11px; background: var(--panel-2);
  padding: 9px 10px; margin-bottom: 7px;
}
.find-card-top { display: flex; align-items: center; gap: 8px; justify-content: space-between; }
.find-name {
  font-size: 13.5px; font-weight: 800; color: var(--ink);
  min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.find-meta {
  margin: 2px 0 0; font-size: 11.5px; font-weight: 600; color: var(--muted);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.find-status {
  margin: 4px 0 8px; font-size: 11px; font-weight: 800; color: var(--brand2-d);
  font-family: 'JetBrains Mono', monospace;
}
.find-actions { display: flex; gap: 6px; }
.find-btn {
  flex: 1 1 0; border: 1px solid var(--line); background: var(--panel);
  color: var(--ink); border-radius: 9px; padding: 6px 8px;
  font-size: 11.5px; font-weight: 800;
}
.find-btn:hover:not(:disabled) { border-color: var(--brand); color: var(--brand-d); }
/* --chip-ink, not #fff: in dark mode --brand is a LIGHT blue, and white on it
   measured 2.54:1. --chip-ink flips to dark ink there and clears the floor in
   both themes. */
.find-btn.primary { background: var(--brand); border-color: var(--brand); color: var(--chip-ink); }
.find-btn.primary:hover {
  background: var(--brand-d); border-color: var(--brand-d); color: var(--chip-ink);
}
/* Disabled must still be readable -- it is the label that says the player is
   already on the slate, so it carries information, not just an off state. */
.find-btn:disabled { color: var(--muted); background: var(--panel-3); cursor: default; }

.empty-slate {
  min-height: 190px; display: grid; align-content: center; gap: 8px;
  padding: 28px; text-align: center;
}
.empty-slate h1 {
  margin: 0; font-size: 34px; line-height: 1; font-weight: 900;
}
.empty-slate p {
  margin: 0 auto; max-width: 560px; color: var(--muted);
  font-size: 13px; font-weight: 650; line-height: 1.45;
}

/* The DEFAULT background is load-bearing. The live board grades on
   elite/good/neutral/bad, an earlier snapshot used strong/solid/average, and a
   tier with no matching class fell through to no background at all — white chip
   ink on a white panel, measured 1.0:1 and completely invisible. Any unknown
   tier now lands on --soft and stays readable. */
.gchip {
  border-radius: 7px; padding: 2px 7px; font-size: 11px; font-weight: 900;
  color: var(--chip-ink); font-family: 'JetBrains Mono', monospace;
  background: var(--soft);
}
.g-elite { background: var(--good-d); }
.g-good, .g-strong { background: var(--brand2-d); }
.g-solid { background: var(--brand-d); }
.g-neutral, .g-average, .g-avg { background: var(--yellow-d); }
.g-bad { background: var(--bad-d); }
.g-fade, .g-weak, .g-soft { background: var(--soft); }

/* ---------- main ---------- */
.lab-main { padding: 18px 22px 60px; display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.card {
  background: var(--panel); border: 1px solid var(--line); border-radius: 15px;
  box-shadow: 0 1px 3px var(--shadow);
}
.card-h {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 11px 15px; border-bottom: 1px solid var(--line);
}
.card-h h3 {
  margin: 0; font-size: 11.5px; letter-spacing: .13em; text-transform: uppercase;
  color: var(--soft); font-weight: 800;
}
.card-h .note { font-size: 11.5px; color: var(--soft); font-weight: 600; }
.card-b { padding: 14px 15px; }

/* ============================ today's lineup BvP ========================== */
.bvp-card {
  overflow: hidden;
}

.bvp-toolbar-nyce {
  display: grid;
  grid-template-columns: auto minmax(240px, 1fr);
  gap: 10px;
  align-items: center;
  padding: 12px 15px;
  border-bottom: 1px solid var(--line);
  background: var(--panel-2);
}

.bvp-live-label,
.bvp-select-label {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: var(--soft);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .1em;
  text-transform: uppercase;
  white-space: nowrap;
}

.pulse-dot {
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: var(--bad);
  box-shadow: 0 0 10px color-mix(in srgb, var(--bad) 50%, transparent);
}

.bvp-game-ticker {
  display: flex;
  gap: 8px;
  min-width: 0;
  overflow-x: auto;
  padding: 2px 2px 6px;
  scroll-snap-type: x proximity;
}

.bvp-game-tile {
  flex: 0 0 184px;
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 7px 9px;
  align-items: center;
  min-height: 92px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  color: var(--ink);
  padding: 10px;
  text-align: left;
  scroll-snap-align: start;
  box-shadow: 0 1px 2px var(--shadow);
}

.bvp-game-tile:hover,
.bvp-game-tile.on {
  border-color: var(--brand);
  background: var(--panel-3);
}

.bvp-game-tile.on {
  box-shadow: inset 0 0 0 2px color-mix(in srgb, var(--brand) 35%, transparent);
}

.bvp-game-time {
  color: var(--soft);
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px;
  font-weight: 800;
}

.bvp-game-teams {
  grid-column: 1 / -1;
  display: grid;
  gap: 5px;
}

.bvp-team-mini {
  display: grid;
  grid-template-columns: 21px minmax(0, 1fr) auto auto;
  gap: 6px;
  align-items: center;
  min-width: 0;
}

.bvp-team-mini img {
  width: 21px;
  height: 21px;
  object-fit: contain;
}

.bvp-team-mini b {
  overflow: hidden;
  font-size: 13px;
  font-weight: 900;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.bvp-team-mini small {
  font-size: 10px;
  font-weight: 900;
  white-space: nowrap;
}

.bvp-team-mini small.hot { color: var(--hot-d); }
.bvp-team-mini small.cold { color: var(--edge-p-ink); }

.bvp-game-meta {
  min-width: 0;
}

.bvp-game-meta b,
.bvp-game-meta small {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.bvp-game-meta b {
  font-size: 11px;
  font-weight: 900;
}

.bvp-game-meta small {
  margin-top: 2px;
  color: var(--soft);
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
}

.bvp-game-heat {
  justify-self: end;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--panel-2);
  color: var(--muted);
  padding: 3px 7px;
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px;
  font-weight: 900;
  white-space: nowrap;
}

.bvp-game-heat.hot {
  border-color: var(--hot-d);
  color: var(--hot-d);
}

.bvp-game-heat.cold {
  border-color: var(--edge-p-line);
  color: var(--edge-p-ink);
}

/* A game on the slate whose BvP has not been built. Dashed to read as "not
   filled in yet" rather than as a zero, and --muted so it never sinks into the
   tile behind it. */
.bvp-game-heat.pending {
  border-style: dashed;
  border-color: var(--soft);
  color: var(--muted);
  font-weight: 800;
}
.bvp-game-tile.pending { border-style: dashed; }
.bvp-game-tile.pending.on { border-style: solid; }

.bvp-filter-groups,
.bvp-filter-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-start;
}

.bvp-filter-groups {
  grid-column: 1 / -1;
  width: 100%;
  padding-top: 10px;
  border-top: 1px solid var(--line);
}

.bvp-filter-group {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  flex: 1 1 230px;
  gap: 5px;
  min-height: 32px;
}

.bvp-filter-group span {
  color: var(--soft);
  font-size: 9.5px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
  white-space: nowrap;
}

.bvp-filter {
  min-height: 32px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--panel);
  color: var(--muted);
  padding: 0 11px;
  font-size: 11px;
  font-weight: 800;
}

.bvp-filter.on {
  border-color: var(--ink);
  background: var(--ink);
  color: var(--panel);
}

.bvp-card-body {
  padding: 0;
}

.nyce-bvp-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 14px 15px;
  border-bottom: 1px solid var(--line);
}

.nyce-bvp-title {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  min-width: 0;
}

.nyce-bvp-title b {
  font-size: 18px;
  font-weight: 900;
  line-height: 1.1;
  overflow-wrap: anywhere;
}

.nyce-bvp-score {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 50px;
  min-height: 30px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel-2);
  font-family: 'JetBrains Mono', monospace;
  font-size: 13px;
  font-weight: 800;
}

.nyce-bvp-status {
  color: var(--brand2-d);
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
}

.nyce-bvp-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  justify-content: flex-end;
}

.bvp-chip {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel-2);
  color: var(--muted);
  padding: 0 10px;
  font-size: 11px;
  font-weight: 800;
  white-space: nowrap;
}

.bvp-chip.hot {
  border-color: var(--hot-d);
  background: color-mix(in srgb, var(--hot-d) 12%, var(--panel));
  color: var(--hot-d);
}

.bvp-chip.cold {
  border-color: var(--edge-p-line);
  background: var(--edge-p-bg);
  color: var(--edge-p-ink);
}

.nyce-bvp-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.nyce-bvp-side {
  min-width: 0;
  border-right: 1px solid var(--line);
}

.nyce-bvp-side:last-child {
  border-right: 0;
}

.nyce-bvp-side-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(180px, auto);
  justify-content: space-between;
  gap: 10px;
  padding: 11px 15px;
  border-bottom: 1px solid var(--line);
  background: var(--panel-2);
}

.bvp-side-team {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  gap: 9px;
  align-items: center;
  min-width: 0;
}

.bvp-side-team img {
  width: 34px;
  height: 34px;
  object-fit: contain;
}

.bvp-side-team b,
.bvp-side-starter b {
  display: block;
  font-size: 13.5px;
  font-weight: 900;
  line-height: 1.2;
  overflow-wrap: anywhere;
}

.bvp-side-team small,
.bvp-side-starter small {
  display: block;
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
  line-height: 1.35;
}

.bvp-side-starter {
  display: grid;
  gap: 2px;
  justify-items: end;
  min-width: 0;
  text-align: right;
}

.bvp-side-starter em {
  color: var(--brand);
  font-style: normal;
}

.pitcher-strength {
  display: inline-flex;
  justify-content: center;
  min-height: 24px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--panel);
  color: var(--muted);
  padding: 4px 8px;
  font-size: 10px;
  font-weight: 900;
  line-height: 1;
  white-space: nowrap;
}

.pitcher-strength.weak {
  border-color: color-mix(in srgb, var(--bad) 45%, var(--line));
  background: color-mix(in srgb, var(--bad) 10%, var(--panel));
  color: var(--bad-d);
}

.pitcher-strength.strong {
  border-color: color-mix(in srgb, var(--good) 45%, var(--line));
  background: color-mix(in srgb, var(--good) 11%, var(--panel));
  color: var(--good-d);
}

.pitcher-strength.neutral {
  border-color: color-mix(in srgb, var(--brand) 34%, var(--line));
  color: var(--brand-d);
}

.nyce-bvp-lineup {
  display: grid;
}

.nyce-bvp-row {
  display: grid;
  grid-template-columns: 28px minmax(130px, 1fr) minmax(220px, .95fr);
  gap: 10px;
  align-items: center;
  min-height: 72px;
  border: 0;
  border-bottom: 1px solid var(--line);
  background: var(--panel);
  color: var(--ink);
  padding: 9px 15px;
  text-align: left;
}

.nyce-bvp-row:last-child {
  border-bottom: 0;
}

.nyce-bvp-row:hover,
.nyce-bvp-row.on {
  background: var(--panel-3);
}

.nyce-bvp-row.hot {
  box-shadow: inset 3px 0 0 var(--hot-d);
}

.nyce-bvp-row.cold {
  box-shadow: inset 3px 0 0 var(--edge-p-line);
}

.bvp-order {
  display: grid;
  place-items: center;
  width: 26px;
  height: 26px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--panel-2);
  color: var(--muted);
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px;
  font-weight: 800;
}

.bvp-batter {
  min-width: 0;
}

.bvp-batter b {
  display: flex;
  align-items: center;
  gap: 6px;
  overflow: hidden;
  color: var(--ink);
  font-size: 13px;
  font-weight: 900;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.bvp-batter b > .bvp-grade-chip,
.bvp-batter b > .bvp-analyze-hint,
.bvp-batter b > .bvp-hand-badge {
  flex: 0 0 auto;
}

.bvp-hand-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 17px;
  height: 17px;
  padding: 0 3px;
  border-radius: 4px;
  font-family: 'JetBrains Mono', monospace;
  font-size: 9.5px;
  font-weight: 900;
  font-style: normal;
  line-height: 1;
  background: var(--panel-2);
  color: var(--brand);
  border: 1px solid var(--line);
}

.bvp-grade-chip,
.bvp-analyze-hint {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 28px;
  min-height: 21px;
  border: 1px solid var(--line);
  border-radius: 7px;
  padding: 2px 6px;
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px;
  font-weight: 900;
  line-height: 1;
}

.bvp-analyze-hint {
  color: var(--muted);
  background: var(--panel-2);
}

.bvp-grade-chip {
  color: var(--chip-ink);
  background: var(--soft);
}

.bvp-grade-chip.g-elite { background: var(--good-d); border-color: var(--good-d); }
.bvp-grade-chip.g-good { background: var(--brand2-d); border-color: var(--brand2-d); }
.bvp-grade-chip.g-neutral { background: var(--yellow-d); border-color: var(--yellow-d); }
.bvp-grade-chip.g-bad { background: var(--bad-d); border-color: var(--bad-d); }
.bvp-grade-chip.loading {
  color: var(--muted);
  background: var(--panel-2);
}

.bvp-batter span {
  display: block;
  margin-top: 3px;
  color: var(--soft);
  font-family: 'JetBrains Mono', monospace;
  font-size: 10.5px;
  font-weight: 700;
}

.bvp-statline {
  min-width: 0;
}

.bvp-mini-stats {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  align-items: baseline;
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
}

.bvp-mini-stats b {
  color: var(--ink);
  font-family: 'JetBrains Mono', monospace;
  font-weight: 800;
}

.bvp-mini-stats b.hot {
  color: var(--hot-d);
}

.bvp-mini-stats b.cold {
  color: var(--edge-p-ink);
}

.bvp-no-history {
  color: var(--soft);
  font-size: 11.5px;
  font-style: italic;
  font-weight: 700;
}

/* Today's live/final line, under the career BvP line. Reads during the game and
   after it; the tag carries the verdict so the result is legible at a glance
   without relying on colour alone. */
.bvp-today {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  align-items: baseline;
  margin-top: 4px;
  padding-top: 4px;
  border-top: 1px dashed var(--line);
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
}

.bvp-today b {
  color: var(--ink);
  font-family: 'JetBrains Mono', monospace;
  font-weight: 800;
}

.bvp-today-tag {
  color: var(--soft);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.bvp-today.hit .bvp-today-tag { color: var(--good-d); }
.bvp-today.miss .bvp-today-tag { color: var(--bad-d); }
.bvp-today.hit b { color: var(--good-d); }

.bvp-verdict {
  margin-left: 5px;
  font-size: 11px;
  line-height: 1;
  vertical-align: baseline;
}

.bvp-ops-track {
  height: 5px;
  border-radius: 999px;
  background: var(--line);
  overflow: hidden;
  margin-top: 7px;
}

.bvp-ops-track i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: var(--soft);
}

.bvp-ops-track i.hot {
  background: var(--hot-d);
}

.bvp-ops-track i.cold {
  background: var(--edge-p-line);
}

.bvp-detail {
  border-top: 1px solid var(--line);
  padding: 13px 15px;
  background: var(--panel-2);
}

.bvp-detail-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
}

.bvp-detail-head b {
  font-size: 14px;
  font-weight: 900;
}

.bvp-detail-head span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
}

.bvp-detail-grid {
  display: grid;
  grid-template-columns: repeat(8, minmax(0, 1fr));
  gap: 8px;
}

.bvp-detail-stat {
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: var(--panel);
  padding: 8px;
}

.bvp-detail-stat span {
  display: block;
  color: var(--soft);
  font-size: 9.5px;
  font-weight: 800;
  text-transform: uppercase;
}

.bvp-detail-stat b {
  display: block;
  margin-top: 3px;
  font-family: 'JetBrains Mono', monospace;
  font-size: 15px;
  font-weight: 800;
  overflow-wrap: anywhere;
}

.bvp-market-row {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-top: 10px;
}

/* header strip */
.hero { padding: 16px 18px; }
.hero-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; flex-wrap: wrap; }
.pair { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.pair-side h1 { margin: 0; font-size: 24px; font-weight: 900; letter-spacing: -.01em; line-height: 1.15; }
.pair-side p { margin: 3px 0 0; font-size: 12.5px; color: var(--muted); font-weight: 700; }
.pair-vs { font-size: 12px; font-weight: 900; color: var(--soft); letter-spacing: .12em; }
.grade-big {
  min-width: 86px; text-align: center; border-radius: 14px; padding: 9px 14px;
  color: var(--chip-ink); font-family: 'JetBrains Mono', monospace;
  background: var(--soft);   /* same invisible-chip guard as .gchip */
}
.grade-big b { display: block; font-size: 30px; line-height: 1; font-weight: 800; }
.grade-big span {
  display: block; font-size: 10.5px; font-weight: 800; letter-spacing: .1em;
  text-transform: uppercase; margin-top: 4px;
}

.statrow { display: grid; grid-template-columns: repeat(5, minmax(0,1fr)); gap: 10px; margin-top: 15px; }
.stat { background: var(--panel-2); border: 1px solid var(--line); border-radius: 12px; padding: 10px 12px; }
.stat .lbl {
  font-size: 10.5px; letter-spacing: .1em; text-transform: uppercase;
  color: var(--soft); font-weight: 800;
}
.stat .val {
  font-size: 21px; font-weight: 800; font-family: 'JetBrains Mono', monospace;
  margin-top: 3px; line-height: 1.1;
}
.stat .val small { font-size: 12px; font-weight: 700; color: var(--muted); }
.stat .sub { font-size: 11px; color: var(--muted); font-weight: 600; margin-top: 3px; }
.stat.est { border-style: dashed; }
.meter { height: 5px; border-radius: 3px; background: var(--line); margin-top: 7px; overflow: hidden; }
.meter i { display: block; height: 100%; border-radius: 3px; background: var(--brand); }

/* zone row */
.zone-controls {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between;
  gap: 10px; margin-bottom: 14px;
}
.zone-control-group {
  display: inline-flex; flex-wrap: wrap; align-items: center; gap: 6px;
}
.zone-chip {
  appearance: none; border: 1px solid var(--line); border-radius: 8px;
  background: var(--panel-2); color: var(--muted); padding: 7px 10px;
  font-size: 11px; font-weight: 900; text-transform: uppercase; letter-spacing: .04em;
  cursor: pointer;
}
.zone-chip[aria-pressed="true"] {
  background: var(--ink); border-color: var(--ink); color: var(--panel);
}
.grade-big>small{display:block;margin-bottom:4px;font-size:7.5px;font-weight:950;letter-spacing:.08em;text-transform:uppercase;line-height:1.15}
.nyce-dark .zone-chip[aria-pressed="true"] {
  background: var(--brand); border-color: var(--brand); color: var(--chip-ink);
}
.zone-history-controls {
  display: flex; flex-wrap: wrap; align-items: center; gap: 8px;
  margin: -2px 0 14px; padding: 9px 10px; border: 1px solid var(--line);
  border-radius: 9px; background: var(--panel-2);
}
.zone-history-title {
  color: var(--ink); font-size: 10px; font-weight: 900; letter-spacing: .08em;
  text-transform: uppercase;
}
.zone-history-controls label {
  display: inline-flex; align-items: center; gap: 5px; color: var(--muted);
  font-size: 10px; font-weight: 800; text-transform: uppercase;
}
.zone-history-controls select,
.zone-history-load {
  border: 1px solid var(--line); border-radius: 7px; background: var(--panel);
  color: var(--ink); min-height: 30px; padding: 5px 8px; font: inherit;
}
.zone-history-load {
  cursor: pointer; color: var(--chip-ink); background: var(--brand); border-color: var(--brand);
  font-size: 10px; font-weight: 900; letter-spacing: .04em; text-transform: uppercase;
}
.zone-history-status {
  flex: 1 1 260px; color: var(--soft); font-size: 10px; font-weight: 750;
}
.zone-row { display: grid; grid-template-columns: minmax(158px,.72fr) minmax(260px,1fr) minmax(158px,.72fr); gap: 16px; align-items: start; }
.zone-profile {
  border: 1px solid var(--line); border-radius: 10px; background: var(--panel-2);
  padding: 12px; min-width: 0;
}
.zone-avatar { text-align: center; padding-bottom: 10px; border-bottom: 1px solid var(--line); }
.zone-avatar img {
  width: 74px; height: 74px; border-radius: 50%; object-fit: cover;
  border: 3px solid var(--line); background: var(--panel); display: block; margin: 0 auto 8px;
}
.zone-avatar b { display: block; font-size: 12.5px; font-weight: 900; overflow-wrap: anywhere; }
.zone-avatar span { display: block; font-size: 10.5px; color: var(--muted); font-weight: 800; margin-top: 2px; }
.zone-profile-kicker {
  margin: 9px 0; color: var(--brand-d); font-size: 10.5px; font-weight: 900;
  text-align: center; text-transform: uppercase; letter-spacing: .08em;
}
.zone-grade-panel {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 8px;
  align-items: center;
  margin: 0 0 10px;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
}
.zone-grade-panel.winner {
  border-color: color-mix(in srgb, var(--good) 46%, var(--line));
  box-shadow: inset 3px 0 0 var(--good);
}
.zone-grade-chip {
  display: grid;
  place-items: center;
  min-width: 54px;
  min-height: 46px;
  border-radius: 8px;
  background: var(--panel-2);
  color: var(--ink);
}
.zone-grade-chip small,
.zone-grade-edge small {
  display: block;
  color: var(--soft);
  font-size: 8.5px;
  font-weight: 900;
  letter-spacing: .06em;
  text-transform: uppercase;
}
.zone-grade-chip b {
  font-family: 'JetBrains Mono', monospace;
  font-size: 18px;
  font-weight: 900;
}
.zone-grade-chip.g-elite { background: var(--good); color: var(--chip-ink); }
.zone-grade-chip.g-good { background: color-mix(in srgb, var(--brand) 18%, var(--panel)); color: var(--brand-d); }
.zone-grade-chip.g-bad { background: color-mix(in srgb, var(--bad) 12%, var(--panel)); color: var(--bad); }
.zone-grade-edge {
  min-width: 0;
}
.zone-grade-edge b {
  display: block;
  color: var(--ink);
  font-size: 11px;
  font-weight: 900;
}
.zone-grade-edge.tone-batter b { color: var(--good); }
.zone-grade-edge.tone-pitcher b { color: var(--bad); }
.zone-stat-list { display: grid; gap: 7px; }
.zone-stat {
  display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 7px 9px;
  align-items: baseline; padding: 2px 0;
}
.zone-stat span {
  color: var(--muted); font-size: 10px; font-weight: 900; text-transform: uppercase;
}
.zone-stat b {
  color: var(--ink); font-family: 'JetBrains Mono', monospace; font-size: 13px; font-weight: 900;
  text-align: right;
}
.zone-stat small {
  grid-column: 1 / -1; color: var(--soft); font-size: 9.5px; font-weight: 800;
  text-align: right; margin-top: -5px;
}
.shot { text-align: center; }
.shot img {
  width: 108px; height: 108px; border-radius: 50%; object-fit: cover;
  border: 3px solid var(--line); background: var(--panel-2); display: block; margin: 0 auto 8px;
}
.shot b { display: block; font-size: 13px; font-weight: 800; }
.shot span { display: block; font-size: 11.5px; color: var(--muted); font-weight: 700; margin-top: 2px; }

.zone-wrap { display: flex; flex-direction: column; align-items: center; gap: 8px; }
.zgrid { display: grid; grid-template-columns: repeat(3, 74px); grid-template-rows: repeat(3, 58px); gap: 4px; }
.zcell {
  appearance: none; padding: 0; cursor: pointer; font: inherit;
  border-radius: 9px; display: flex; flex-direction: column; align-items: center;
  justify-content: center; border: 1px solid var(--line); position: relative;
}
.zcell:hover { transform: translateY(-1px); }
.zcell:focus-visible { outline: 3px solid color-mix(in srgb, var(--brand) 55%, transparent); outline-offset: 2px; }
.zcell.selected {
  outline: 3px solid var(--brand); outline-offset: 2px;
  box-shadow: 0 0 0 5px color-mix(in srgb, var(--brand) 20%, transparent);
}
.zcell b { font-size: 17px; font-weight: 800; font-family: 'JetBrains Mono', monospace; line-height: 1; }
.zcell span { max-width: 70px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 9px; font-weight: 700; margin-top: 3px; }
.zcell i {
  position: absolute; top: 3px; left: 5px; font-size: 9px; font-style: normal;
  font-weight: 800; opacity: .55;
}
.zplot { display: grid; grid-template-columns: auto auto; gap: 4px 8px; align-items: center; }
.zrows { display: grid; grid-template-rows: repeat(3, 58px); gap: 4px; }
.zrows span {
  display: flex; align-items: center; justify-content: flex-end;
  font-size: 10px; font-weight: 800; letter-spacing: .06em;
  text-transform: uppercase; color: var(--soft);
}
.zlegend { display: flex; align-items: center; gap: 8px; font-size: 11px; color: var(--soft); font-weight: 700; }
.zbar { width: 92px; height: 7px; border-radius: 4px; background: linear-gradient(90deg, var(--grid-lo), var(--grid-hi)); }
.zone-layer-label {
  display: inline-flex; align-items: center; gap: 7px;
  border: 1px solid var(--line); border-radius: 999px; background: var(--panel-2);
  padding: 5px 10px;
}
.zone-layer-label b {
  font-family: 'JetBrains Mono', monospace; font-size: 11px; font-weight: 900; color: var(--brand-d);
}
.zone-layer-label span {
  color: var(--muted); font-size: 10px; font-weight: 900; text-transform: uppercase;
}
.zone-quote {
  width: 100%; max-width: 620px; margin: 4px 0 0; padding: 10px 12px;
  border: 1px solid var(--line); border-radius: 8px; background: var(--panel-2);
  color: var(--ink); font-size: 12px; font-weight: 800; line-height: 1.45; text-align: center;
}
.zone-threat-evidence {
  margin-top: 14px; padding: 14px; border: 1px solid var(--line); border-radius: 11px;
  background: linear-gradient(135deg, color-mix(in srgb, var(--brand) 7%, var(--panel)), var(--panel));
}
.zone-threat-evidence > p {
  margin: 0; color: var(--muted); font-size: 11px; font-weight: 800; text-align: center;
}
.zone-threat-head {
  display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 12px;
  align-items: center;
}
.zone-threat-score {
  display: grid; grid-template-columns: auto auto; align-items: baseline; column-gap: 3px;
  min-width: 112px; padding: 9px 11px; border: 1px solid var(--line); border-radius: 10px;
  background: var(--panel-2); color: var(--ink);
}
.zone-threat-score small { grid-column: 1 / -1; color: var(--muted); font-size: 8.5px; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.zone-threat-score strong { font: 900 28px/1 'JetBrains Mono', monospace; }
.zone-threat-score span { color: var(--soft); font-size: 10px; font-weight: 900; }
.zone-threat-score.g-elite { border-color: color-mix(in srgb, var(--good) 65%, var(--line)); box-shadow: inset 4px 0 0 var(--good); }
.zone-threat-score.g-good { border-color: color-mix(in srgb, var(--brand) 65%, var(--line)); box-shadow: inset 4px 0 0 var(--brand); }
.zone-threat-score.g-bad { border-color: color-mix(in srgb, var(--bad) 65%, var(--line)); box-shadow: inset 4px 0 0 var(--bad); }
.zone-threat-copy { min-width: 0; }
.zone-threat-copy b { color: var(--ink); font-size: 12px; font-weight: 950; }
.zone-threat-copy p { margin: 3px 0; color: var(--muted); font-size: 11px; font-weight: 750; line-height: 1.4; }
.zone-threat-copy small { color: var(--soft); font-size: 9px; font-weight: 800; }
.zone-threat-confidence {
  display: grid; place-items: center; min-width: 76px; min-height: 54px; padding: 7px;
  border: 1px solid var(--line); border-radius: 9px; background: var(--panel-2);
  color: var(--brand-d); font: 900 17px/1 'JetBrains Mono', monospace;
}
.zone-threat-confidence small { margin-top: 4px; color: var(--soft); font: 800 8px/1.15 inherit; text-align: center; text-transform: uppercase; }
.zone-threat-stats {
  display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 7px; margin-top: 12px;
}
.zone-threat-stat { min-width: 0; padding: 8px; border: 1px solid var(--line); border-radius: 8px; background: var(--panel-2); }
.zone-threat-stat span, .zone-threat-stat small { display: block; color: var(--soft); font-size: 8px; font-weight: 850; text-transform: uppercase; }
.zone-threat-stat b { display: block; margin: 3px 0; color: var(--ink); font: 900 13px/1.1 'JetBrains Mono', monospace; }
.zone-threat-stat small { overflow-wrap: anywhere; text-transform: none; line-height: 1.25; }
.zone-overlap-list { margin-top: 12px; }
.zone-overlap-list h4 { display: flex; justify-content: space-between; gap: 8px; margin: 0 0 6px; color: var(--ink); font-size: 10px; font-weight: 950; letter-spacing: .06em; text-transform: uppercase; }
.zone-overlap-list h4 small { color: var(--soft); font-size: 9px; }
.zone-overlap-row {
  display: grid; grid-template-columns: auto minmax(0, 1fr) minmax(150px, auto); gap: 9px;
  align-items: center; padding: 7px 0; border-top: 1px solid var(--line);
}
.zone-overlap-rank { display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; background: var(--brand); color: var(--chip-ink); font: 900 10px/1 'JetBrains Mono', monospace; }
.zone-overlap-row b, .zone-overlap-row small { display: block; }
.zone-overlap-row b { color: var(--ink); font-size: 10px; font-weight: 900; }
.zone-overlap-row small { margin-top: 2px; color: var(--soft); font-size: 9px; font-weight: 750; }
.zone-overlap-rates { text-align: right; }
.zone-threat-method { display: grid; gap: 3px; margin-top: 10px; padding-top: 9px; border-top: 1px solid var(--line); }
.zone-threat-method b { color: var(--muted); font-size: 9.5px; font-weight: 900; }
.zone-threat-method span { color: var(--soft); font-size: 8.5px; font-weight: 700; line-height: 1.35; }

.metricstrip {
  display: flex; flex-wrap: wrap; gap: 8px; margin-top: 15px;
  padding-top: 14px; border-top: 1px solid var(--line);
}
.metric {
  background: var(--panel-2); border: 1px solid var(--line); border-radius: 9px;
  padding: 6px 11px; font-size: 12px; font-weight: 700; color: var(--muted);
}
.metric b { color: var(--ink); font-family: 'JetBrains Mono', monospace; font-weight: 800; margin-left: 5px; }

/* panel rows */
.trio { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 14px; align-items: start; }
.quad { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 14px; align-items: start; }

table.t { width: 100%; border-collapse: collapse; font-size: 12px; }
table.t th {
  text-align: right; font-size: 10px; letter-spacing: .08em; text-transform: uppercase;
  color: var(--soft); font-weight: 800; padding: 0 0 7px; border-bottom: 1px solid var(--line);
}
table.t th:first-child, table.t td:first-child { text-align: left; }
table.t td {
  padding: 7px 0; text-align: right; border-bottom: 1px solid var(--line);
  font-weight: 700; font-family: 'JetBrains Mono', monospace;
}
table.t td:first-child { font-family: Inter, sans-serif; font-weight: 700; color: var(--muted); }
table.t tr:last-child td { border-bottom: 0; }
.dash { color: var(--soft); font-weight: 700; }

.kv {
  display: flex; align-items: baseline; justify-content: space-between; gap: 10px;
  padding: 7px 0; border-bottom: 1px solid var(--line); font-size: 12.5px;
}
.kv:last-child { border-bottom: 0; }
.kv span { color: var(--muted); font-weight: 700; }
.kv b { font-family: 'JetBrains Mono', monospace; font-weight: 800; }

.reasons { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 8px; }
.reasons li {
  font-size: 12.5px; font-weight: 600; color: var(--muted);
  padding-left: 15px; position: relative; line-height: 1.45;
}
.reasons li::before {
  content: ''; position: absolute; left: 0; top: 7px;
  width: 6px; height: 6px; border-radius: 50%; background: var(--brand);
}
.badges { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 12px; }
.badge {
  border-radius: 999px; padding: 4px 10px; font-size: 11px; font-weight: 800;
  border: 1px solid var(--line); color: var(--muted); background: var(--panel-2);
}
.badge.elite { border-color: var(--good-d); color: var(--good-d); }
.badge.hot { border-color: var(--hot-d); color: var(--hot-d); }
.badge.good { border-color: var(--brand-d); color: var(--brand-d); }

/* ---------- two-column body: panels left, bullpen card on the pitcher's side */
.lab-cols { display: grid; grid-template-columns: minmax(0,1fr) 268px; gap: 14px; align-items: start; }
.lab-col-main { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
/* Taller than the viewport on a short window, so cap it and let the order
   scroll inside rather than dragging the card off the top of the screen. */
.lab-col-side {
  position: sticky; top: 75px;
  max-height: calc(100vh - 90px); display: flex; flex-direction: column;
}
.lab-col-side .pen-card { display: flex; flex-direction: column; min-height: 0; }
.lab-col-side .pen-card-b { overflow-y: auto; min-height: 0; }

/* bullpen as a lineup card: a numbered vertical order, not a grid of tiles */
.pen-card { overflow: hidden; }
.pen-card-b { padding: 0; }
.pen-strip {
  display: flex; align-items: baseline; justify-content: space-between; gap: 8px;
  padding: 9px 13px; background: var(--panel-2); border-bottom: 1px solid var(--line);
  font-size: 11px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--soft);
}
.pen-strip b { font-family: 'JetBrains Mono', monospace; font-size: 12.5px; color: var(--ink); letter-spacing: 0; }

.arm {
  display: grid; grid-template-columns: 24px minmax(0,1fr) auto; gap: 9px; align-items: center;
  width: 100%; text-align: left; background: none; border: 0;
  border-bottom: 1px solid var(--line); padding: 9px 13px 9px 10px; position: relative;
}
.arm:last-of-type { border-bottom: 0; }
.arm:hover { background: var(--panel-3); }
.arm.on { background: var(--panel-3); }
.arm.on::before {
  content: ''; position: absolute; left: 0; top: 0; bottom: 0;
  width: 3px; background: var(--brand);
}
.arm-no {
  width: 24px; height: 24px; border-radius: 7px; display: grid; place-items: center;
  background: var(--panel-2); border: 1px solid var(--line);
  font-family: 'JetBrains Mono', monospace; font-size: 11px; font-weight: 800; color: var(--muted);
}
.arm.on .arm-no { background: var(--brand); border-color: var(--brand); color: var(--chip-ink); }
.arm-id { min-width: 0; }
.arm-id b {
  display: block; font-size: 12.5px; font-weight: 800;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.arm-line {
  display: block; font-size: 10.5px; color: var(--muted); font-weight: 700; margin-top: 2px;
  font-family: 'JetBrains Mono', monospace;
}
.arm-role {
  font-size: 9.5px; font-weight: 800; letter-spacing: .06em;
  text-transform: uppercase; color: var(--muted); display: block; margin-bottom: 3px;
}
.arm-right { display: flex; flex-direction: column; align-items: flex-end; gap: 4px; }
.arm-pct { font-family: 'JetBrains Mono', monospace; font-size: 11.5px; font-weight: 800; }
.arm-pct b{display:block;color:var(--ink)}
.arm-pct small{display:block;color:var(--soft);font-family:Inter,system-ui,sans-serif;font-size:7.5px;font-weight:900;letter-spacing:.05em;text-transform:uppercase}
.cap-track { width: 46px; height: 5px; border-radius: 3px; background: var(--line); overflow: hidden; }
.cap-track i { display: block; height: 100%; background: var(--brand-2); border-radius: 3px; }
.pen-foot { padding: 10px 13px; font-size: 11px; color: var(--muted); font-weight: 600; line-height: 1.45; }

.repoint {
  display: flex; align-items: center; gap: 10px; padding: 9px 14px; border-radius: 11px;
  background: var(--panel-3); border: 1px solid var(--brand);
  font-size: 12.5px; font-weight: 700; color: var(--ink);
}
.repoint button {
  border: 1px solid var(--brand); background: var(--panel); color: var(--brand);
  border-radius: 8px; padding: 4px 10px; font-size: 11.5px; font-weight: 800;
}
/* the re-point notice inside the narrow pen card stacks instead of sitting inline */
.pen-repoint {
  display: block; margin: 0; border-radius: 0; border: 0;
  border-bottom: 1px solid var(--brand); background: var(--panel-3);
  padding: 10px 13px; font-size: 11.5px; line-height: 1.45;
}
.pen-repoint button { margin-top: 8px; width: 100%; }

/* confidence breakdown */
.conf-line { display: grid; grid-template-columns: 122px 1fr 40px; gap: 9px; align-items: center; font-size: 11.5px; }
.conf-line span { color: var(--muted); font-weight: 700; }
.conf-line em {
  font-style: normal; text-align: right; font-family: 'JetBrains Mono', monospace;
  font-weight: 800; font-size: 11px;
}
.conf-track { height: 6px; border-radius: 4px; background: var(--line); overflow: hidden; }
.conf-track i { display: block; height: 100%; background: var(--brand); border-radius: 4px; }
.conf-detail { font-size: 11px; color: var(--soft); font-weight: 600; margin: 2px 0 9px 131px; }

.mockbar {
  background: var(--yellow); color: var(--chip-ink); padding: 7px 22px;
  font-size: 12px; font-weight: 800;
}
.spray-weather-shell {
  display: grid;
  gap: 10px;
}

.spray-model-controls {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
  align-items: end;
  padding: 9px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: color-mix(in srgb, var(--panel-2) 90%, transparent);
}

.spray-model-controls label { display: grid; gap: 4px; min-width: 0; }
.spray-model-controls label > span,
.spray-model-controls > small {
  color: var(--soft); font-size: 9px; font-weight: 900;
  letter-spacing: .06em; text-transform: uppercase;
}
.spray-model-controls select,
.spray-model-controls button {
  appearance: none; min-width: 0; min-height: 32px; border: 1px solid var(--line);
  border-radius: 8px; background: var(--panel); color: var(--ink);
  padding: 6px 8px; font-size: 10px; font-weight: 900;
}
.spray-model-controls button {
  cursor: pointer; border-color: var(--brand); background: var(--brand); color: var(--chip-ink);
  text-transform: uppercase;
}
.spray-model-controls button:disabled { cursor: wait; opacity: .62; }
.spray-model-controls > small { grid-column: 1 / -1; }

.spray-summary,
.spray-legend {
  display: flex; flex-wrap: wrap; gap: 7px; margin-top: 10px;
}
.spray-stat {
  display: inline-grid; gap: 2px; min-width: 48px; padding: 5px 7px;
  border: 1px solid var(--line); border-radius: 8px; background: var(--panel-2);
}
.spray-stat small { color: var(--soft); font-size: 8px; font-weight: 900; text-transform: uppercase; }
.spray-stat b { color: var(--ink); font-family: 'JetBrains Mono', monospace; font-size: 10px; font-weight: 900; }
.spray-legend { font-size: 10px; font-weight: 800; color: var(--muted); }
.spray-hotspot { fill: var(--hot); stroke: color-mix(in srgb, var(--hot) 72%, white); stroke-width: 1.2; }

.spray-stage {
  position: relative;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: color-mix(in srgb, var(--panel) 82%, var(--brand) 18%);
}

.spray-svg { width: 100%; height: auto; display: block; }

@media (max-width: 560px) {
  .spray-model-controls { grid-template-columns: 1fr; }
}

.spray-weather-controls {
  display: grid;
  gap: 8px;
  padding: 9px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: color-mix(in srgb, var(--panel-2) 90%, transparent);
}

.spray-weather-controls.compact {
  display: flex;
  align-items: center;
  justify-content: flex-start;
}

.weather-toggle-row {
  display: grid;
  grid-template-columns: auto minmax(150px, 1fr);
  gap: 8px;
  align-items: center;
}

.weather-toggle-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 34px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  color: var(--muted);
  cursor: pointer;
  padding: 7px 10px;
  text-align: left;
}

.weather-toggle-btn::before {
  content: "";
  width: 9px;
  height: 9px;
  border-radius: 999px;
  background: var(--soft);
}

.weather-toggle-btn.on {
  border-color: color-mix(in srgb, var(--good) 55%, var(--line));
  background: color-mix(in srgb, var(--good) 10%, var(--panel));
  color: var(--ink);
}

.weather-toggle-btn.on::before {
  background: var(--good);
  box-shadow: 0 0 10px color-mix(in srgb, var(--good) 55%, transparent);
}

.weather-toggle-btn b,
.weather-toggle-btn span {
  display: block;
}

.weather-toggle-btn b {
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.weather-toggle-btn span {
  color: var(--soft);
  font-size: 10px;
  font-weight: 800;
}

.weather-time-select-wrap {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.weather-time-select-wrap span {
  color: var(--soft);
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.weather-time-select {
  min-height: 34px;
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  color: var(--ink);
  font-size: 11px;
  font-weight: 900;
  padding: 6px 9px;
}

.weather-timebar,
.weather-filterbar,
.weather-stat-grid {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
}

.weather-filterbar > span {
  color: var(--soft);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.weather-time-btn,
.weather-filter-btn {
  appearance: none;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  color: var(--muted);
  cursor: pointer;
  font-size: 11px;
  font-weight: 900;
  min-height: 28px;
  padding: 6px 9px;
}

.weather-time-btn[aria-pressed="true"],
.weather-filter-btn[aria-pressed="true"] {
  border-color: var(--brand);
  background: var(--brand);
  color: var(--chip-ink);
}

.weather-chip {
  display: inline-grid;
  grid-template-columns: auto auto;
  gap: 4px;
  align-items: baseline;
  min-height: 27px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  padding: 5px 8px;
  color: var(--ink);
}

.weather-chip small {
  color: var(--soft);
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.weather-chip b {
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px;
  font-weight: 900;
}

.weather-chip.muted,
.weather-filter-note {
  color: var(--soft);
  font-size: 11px;
  font-weight: 800;
}

.spray-weather-layer {
  pointer-events: none;
}

.spray-weather-layer rect {
  fill: rgba(55, 133, 247, .08);
}

.spray-weather-layer.hot rect,
.spray-weather-layer.boost rect {
  fill: rgba(245, 158, 11, .13);
}

.spray-weather-layer.cold rect,
.spray-weather-layer.drag rect {
  fill: rgba(59, 130, 246, .13);
}

.spray-weather-layer.indoor rect {
  fill: rgba(148, 163, 184, .11);
}

.wind-streak {
  stroke: color-mix(in srgb, var(--brand) 68%, white);
  stroke-width: 1.6;
  stroke-linecap: round;
  opacity: 0;
  /* Travels along the wind vector the overlay sets, rather than marching a dash
     pattern in place -- the old version shimmered but never actually moved. */
  animation: bvp-wind-drift var(--wind-cycle, 1.8s) linear infinite;
}

@media (prefers-reduced-motion: reduce) {
  .wind-streak { animation: none; opacity: .45; }
}

.spray-weather-layer.drag .wind-streak,
.spray-weather-layer.cold .wind-streak {
  stroke: color-mix(in srgb, #2563eb 70%, white);
}

.spray-weather-layer.boost .wind-streak,
.spray-weather-layer.hot .wind-streak {
  stroke: color-mix(in srgb, #f59e0b 75%, white);
}

.wind-arrow {
  fill: none;
  stroke: var(--ink);
  stroke-width: 2.3;
  stroke-linecap: round;
  opacity: .72;
}

.wind-label {
  fill: var(--ink);
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .02em;
}

@keyframes bvp-wind-drift {
  from { transform: translate(0, 0); opacity: 0; }
  18%  { opacity: .62; }
  78%  { opacity: .52; }
  to   { transform: translate(var(--wind-dx, 30px), var(--wind-dy, -18px)); opacity: 0; }
}

@media (max-width: 560px) {
  .weather-toggle-row {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 1320px) {
  .lab-cols { grid-template-columns: 1fr; }
  .lab-col-side { position: static; }
}
@media (max-width: 1180px) {
  .quad { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .statrow { grid-template-columns: repeat(3, minmax(0,1fr)); }
  .bvp-detail-grid { grid-template-columns: repeat(4, minmax(0,1fr)); }
  .zone-threat-stats { grid-template-columns: repeat(3, minmax(0,1fr)); }
}
@media (max-width: 920px) {
  .lab-shell { grid-template-columns: 1fr; }
  .rail { height: auto; position: static; border-right: 0; border-bottom: 1px solid var(--line); }
  .rail-list { max-height: 280px; }
  .trio, .quad { grid-template-columns: 1fr; }
  .zone-row { grid-template-columns: 1fr; }
  .zone-threat-head { grid-template-columns: auto minmax(0,1fr); }
  .zone-threat-confidence { grid-column: 1 / -1; grid-template-columns: auto auto; min-height: 38px; gap: 6px; }
  .nyce-bvp-grid,
  .bvp-toolbar-nyce,
  .nyce-bvp-head { grid-template-columns: 1fr; }
  .bvp-game-ticker {
    margin-right: -2px;
  }
  .bvp-game-tile {
    flex-basis: 172px;
  }
  .nyce-bvp-side-head {
    grid-template-columns: 1fr;
  }
  .bvp-side-starter {
    justify-items: start;
    text-align: left;
  }
  .nyce-bvp-side { border-right: 0; border-bottom: 1px solid var(--line); }
  .nyce-bvp-side:last-child { border-bottom: 0; }
  .bvp-filter-groups,
  .bvp-filter-pills,
  .nyce-bvp-badges { justify-content: flex-start; }
}

@media (max-width: 680px) {
  .nyce-bvp-row {
    grid-template-columns: 26px minmax(0, 1fr);
  }

  .bvp-statline {
    grid-column: 2;
  }

  .bvp-detail-grid {
    grid-template-columns: repeat(2, minmax(0,1fr));
  }

  .bvp-game-tile {
    flex-basis: 164px;
  }

  .zone-threat-head { grid-template-columns: 1fr; }
  .zone-threat-score { width: 100%; }
  .zone-threat-stats { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .zone-overlap-row { grid-template-columns: auto minmax(0,1fr); }
  .zone-overlap-rates { grid-column: 2; text-align: left; }
}

/* ============================ head-to-head play log ======================== */
.log-controls {
  display: flex; flex-wrap: wrap; align-items: center; gap: 8px;
  padding: 12px 15px; border-bottom: 1px solid var(--line); background: var(--panel-2);
}
.log-controls select {
  border: 1px solid var(--line); background: var(--panel); border-radius: 9px;
  padding: 6px 10px; font-size: 12.5px; font-weight: 700; max-width: 280px;
}
.log-controls .sep { flex: 1 1 auto; }
.fchip {
  border: 1px solid var(--line); background: var(--panel); color: var(--muted);
  border-radius: 999px; padding: 5px 12px; font-size: 12px; font-weight: 700;
}
.fchip[aria-pressed="true"] { background: var(--panel-3); border-color: var(--brand); color: var(--ink); }

/* who-owns-what legend */
.edge-key { display: flex; align-items: center; gap: 12px; font-size: 11.5px; font-weight: 700; }
.edge-key span { display: inline-flex; align-items: center; gap: 6px; color: var(--muted); }
.edge-key i {
  width: 11px; height: 11px; border-radius: 3px; display: inline-block; border: 1px solid;
}
.edge-key .kb { background: var(--edge-b-bg); border-color: var(--edge-b-line); }
.edge-key .kp { background: var(--edge-p-bg); border-color: var(--edge-p-line); }

/* summary strip */
.sum-strip { display: grid; grid-template-columns: repeat(auto-fit, minmax(120px,1fr)); gap: 0; }
.sum-cell { padding: 11px 14px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.sum-cell:last-child { border-right: 0; }
.sum-cell .k { font-size: 10px; letter-spacing: .1em; text-transform: uppercase; color: var(--soft); font-weight: 800; }
.sum-cell .v { font-size: 18px; font-weight: 800; font-family: 'JetBrains Mono', monospace; margin-top: 3px; }
.sum-cell .v2 { font-size: 12px; font-weight: 700; color: var(--muted); font-family: 'JetBrains Mono', monospace; margin-top: 2px; }

.log-scroll { overflow-x: auto; }
table.log { width: 100%; border-collapse: collapse; font-size: 12px; min-width: 900px; }
table.log th {
  position: sticky; top: 0; z-index: 2; background: var(--panel-2);
  text-align: left; font-size: 10px; letter-spacing: .07em; text-transform: uppercase;
  color: var(--muted); font-weight: 800; padding: 8px 10px; border-bottom: 1px solid var(--line);
  white-space: nowrap;
}
table.log td {
  padding: 7px 10px; border-bottom: 1px solid var(--line); white-space: nowrap;
  font-weight: 600; color: var(--ink);
}
table.log td.num { font-family: 'JetBrains Mono', monospace; font-weight: 700; text-align: right; }
table.log tbody tr:hover td { background: var(--panel-2); }
table.log tr.pa-row td { font-weight: 800; }
table.log tr.pa-row td:first-child { box-shadow: inset 3px 0 0 var(--soft); }

/* the two verdict tints */
.edge-b { background: var(--edge-b-bg); color: var(--edge-b-ink); }
.edge-p { background: var(--edge-p-bg); color: var(--edge-p-ink); }
td.edge-b, td.edge-p { font-weight: 800; }
tr.pa-b td:first-child { box-shadow: inset 3px 0 0 var(--edge-b-line); }
tr.pa-p td:first-child { box-shadow: inset 3px 0 0 var(--edge-p-line); }

.pill {
  display: inline-block; border-radius: 6px; padding: 2px 7px; font-size: 11px; font-weight: 800;
  border: 1px solid transparent;
}
.pill.b { background: var(--edge-b-bg); color: var(--edge-b-ink); border-color: var(--edge-b-line); }
.pill.p { background: var(--edge-p-bg); color: var(--edge-p-ink); border-color: var(--edge-p-line); }
.pill.n { background: var(--panel-2); color: var(--muted); border-color: var(--line); }

.evb {
  display: inline-block; min-width: 34px; text-align: center; border-radius: 5px;
  padding: 1px 5px; font-family: 'JetBrains Mono', monospace; font-size: 11px; font-weight: 800;
}

.log-empty { padding: 26px 18px; text-align: center; }
.log-empty b { display: block; font-size: 14px; margin-bottom: 6px; }
.log-empty p { margin: 0 auto; max-width: 560px; font-size: 12.5px; color: var(--muted); font-weight: 600; line-height: 1.55; }
.log-foot { padding: 11px 15px; font-size: 11.5px; color: var(--muted); font-weight: 600; line-height: 1.5; }
.warnbar {
  padding: 9px 15px; font-size: 12px; font-weight: 700;
  background: var(--panel-3); border-bottom: 1px solid var(--line); color: var(--ink);
}

.h2h-model-panel,
.h2h-form-panel {
  border-bottom: 1px solid var(--line);
  background: var(--panel);
}
.h2h-model-head {
  display: flex; align-items: baseline; justify-content: space-between; gap: 12px; flex-wrap: wrap;
  padding: 10px 15px; border-bottom: 1px solid var(--line); background: var(--panel-2);
}
.h2h-model-head b {
  font-size: 12px; font-weight: 900; letter-spacing: .08em; text-transform: uppercase;
}
.h2h-model-head span {
  display: inline-flex; align-items: center; gap: 7px; color: var(--muted);
  font-size: 11px; font-weight: 800; text-transform: uppercase;
}
.h2h-dot {
  width: 9px; height: 9px; border-radius: 999px; display: inline-block;
}
.h2h-dot.hist { background: var(--soft); }
.h2h-dot.proj { background: var(--brand); }
.h2h-prop-grid {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(250px,1fr)); gap: 0;
}
.h2h-prop-row {
  display: grid; grid-template-columns: minmax(0,1fr) minmax(120px,.9fr) auto; gap: 10px;
  align-items: center; padding: 10px 15px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line);
}
.h2h-prop-label { min-width: 0; }
.h2h-prop-label b {
  display: block; font-size: 12.5px; font-weight: 900; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.h2h-prop-label span {
  display: block; margin-top: 2px; color: var(--muted); font-size: 10.5px; font-weight: 700;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.h2h-prop-bars { display: grid; gap: 5px; }
.h2h-bar {
  height: 7px; border-radius: 999px; background: var(--line); overflow: hidden;
}
.h2h-bar i {
  display: block; height: 100%; border-radius: inherit;
}
.h2h-bar.hist i { background: var(--soft); }
.h2h-bar.proj i { background: var(--brand); }
.h2h-prop-values {
  display: grid; gap: 3px; min-width: 72px; text-align: right;
  font-family: 'JetBrains Mono', monospace; font-size: 10.5px; font-weight: 900; color: var(--muted);
}
.h2h-prop-values span:last-child { color: var(--brand-d); }

.pitch-type-matchup { background: var(--panel); }
.pitch-type-grid {
  display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 0;
}
.pitch-type-card {
  min-width: 0; border-right: 1px solid var(--line);
}
.pitch-type-card:last-child { border-right: 0; }
.pitch-type-card header {
  display: flex; align-items: baseline; justify-content: space-between; gap: 10px; flex-wrap: wrap;
  padding: 9px 15px; border-bottom: 1px solid var(--line);
}
.pitch-type-card header b {
  font-size: 12px; font-weight: 900; letter-spacing: .04em; text-transform: uppercase;
}
.pitch-type-card header span {
  color: var(--muted); font-size: 10.5px; font-weight: 800; text-transform: uppercase;
}
.pitch-type-dot {
  display: inline-block; width: 9px; height: 9px; margin-right: 7px;
  border-radius: 999px; vertical-align: middle;
}
table.log.compact th,
table.log.compact td { padding: 8px 10px; }
table.log td.tone-good {
  background: var(--edge-b-bg); color: var(--edge-b-ink); font-weight: 900;
}
table.log td.tone-bad {
  background: #fee2e2; color: #991b1b; font-weight: 900;
}
.empty-cell {
  text-align: center !important; color: var(--muted); padding: 16px !important;
}

.h2h-game-chart {
  min-height: 160px; display: grid; grid-auto-flow: column; grid-auto-columns: minmax(86px,1fr);
  align-items: end; gap: 10px; padding: 16px 15px 14px; overflow-x: auto;
}
.h2h-game-col {
  min-height: 126px; display: grid; grid-template-rows: 1fr auto auto auto; gap: 4px; align-items: end;
  text-align: center;
}
.h2h-game-bar {
  width: 30px; min-height: 18px; justify-self: center; display: flex; align-items: end;
  border-radius: 7px 7px 4px 4px; background: var(--panel-3); border: 1px solid var(--line); overflow: hidden;
}
.h2h-game-bar i {
  width: 100%; display: block; background: linear-gradient(180deg, var(--good), var(--brand-2));
}
.h2h-game-col b {
  font-size: 10.5px; font-weight: 900; font-family: 'JetBrains Mono', monospace;
}
.h2h-game-col span,
.h2h-game-col small {
  display: block; font-size: 10px; color: var(--muted); font-weight: 800; line-height: 1.25;
}

.h2h-pa-log { min-width: 1280px; }
.h2h-pa-log small {
  margin-left: 2px; color: var(--soft); font-size: 9px; text-transform: uppercase;
}
.hard-cell {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 46px; border-radius: 5px; padding: 2px 7px;
  font-size: 10.5px; font-weight: 900; text-transform: uppercase;
}
.hard-cell.hard { background: var(--edge-b-bg); color: var(--edge-b-ink); border: 1px solid var(--edge-b-line); }
.hard-cell.soft { background: #fee2e2; color: #991b1b; border: 1px solid #fecaca; }
.hard-cell.none { background: var(--panel-2); color: var(--soft); border: 1px solid var(--line); }

@media (max-width: 680px) {
  .h2h-prop-row { grid-template-columns: 1fr; }
  .h2h-prop-values { grid-auto-flow: column; justify-content: space-between; text-align: left; }
  .pitch-type-grid { grid-template-columns: 1fr; }
  .pitch-type-card { border-right: 0; border-bottom: 1px solid var(--line); }
  .pitch-type-card:last-child { border-bottom: 0; }
}

/* ============================ projection / monte carlo ==================== */
.pool-bar {
  display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap;
  padding: 10px 15px; border-bottom: 1px solid var(--line); background: var(--panel-2);
  font-size: 12px; font-weight: 600; color: var(--muted); line-height: 1.5;
}
.pool-tag {
  border-radius: 999px; padding: 3px 11px; font-size: 11px; font-weight: 800;
  color: var(--chip-ink); font-family: 'JetBrains Mono', monospace; white-space: nowrap;
}
.pool-good { background: var(--good-d); }
.pool-fair { background: var(--yellow-d); }
.pool-thin, .pool-none { background: var(--soft); }

.mc-grid { display: grid; grid-template-columns: minmax(0,1.25fr) minmax(0,1fr); gap: 0; align-items: start; }
.mc-left { border-right: 1px solid var(--line); }
@media (max-width: 1100px) { .mc-grid { grid-template-columns: 1fr; } .mc-left { border-right: 0; } }

table.cmp { width: 100%; border-collapse: collapse; font-size: 12px; }
table.cmp th {
  text-align: right; font-size: 10px; letter-spacing: .07em; text-transform: uppercase;
  color: var(--muted); font-weight: 800; padding: 9px 10px; border-bottom: 1px solid var(--line);
  background: var(--panel-2); white-space: nowrap;
}
table.cmp th:first-child { text-align: left; }
table.cmp td {
  padding: 7px 10px; text-align: right; border-bottom: 1px solid var(--line);
  font-family: 'JetBrains Mono', monospace; font-weight: 700;
}
table.cmp td:first-child {
  text-align: left; font-family: Inter, sans-serif; font-weight: 800; color: var(--ink);
}
table.cmp tr:last-child td { border-bottom: 0; }
table.cmp tr.total td { border-top: 2px solid var(--line); }
.delta-up { color: var(--good-d); }
.delta-dn { color: var(--bad); }

.mc-head {
  padding: 11px 15px; font-size: 10.5px; letter-spacing: .1em; text-transform: uppercase;
  color: var(--muted); font-weight: 800; border-bottom: 1px solid var(--line); background: var(--panel-2);
}
.mc-row { padding: 11px 15px; border-bottom: 1px solid var(--line); }
.mc-row:last-child { border-bottom: 0; }
.mc-top { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
.mc-top b { font-size: 13px; font-weight: 800; }
.mc-top span { font-size: 11.5px; color: var(--muted); font-weight: 700; font-family: 'JetBrains Mono', monospace; }
.mc-bars { display: flex; gap: 6px; margin-top: 8px; }
.mc-bar { flex: 1; }
.mc-bar .lab {
  display: flex; justify-content: space-between; font-size: 10px; font-weight: 800;
  color: var(--muted); margin-bottom: 3px; font-family: 'JetBrains Mono', monospace;
}
.mc-bar .track { height: 6px; border-radius: 4px; background: var(--line); overflow: hidden; }
.mc-bar .track i { display: block; height: 100%; background: var(--brand); border-radius: 4px; }

.odds-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(118px,1fr)); }
.odds-cell { padding: 11px 14px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.odds-cell:last-child { border-right: 0; }
.odds-cell .k { font-size: 10px; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); font-weight: 800; }
.odds-cell .v { font-size: 19px; font-weight: 800; font-family: 'JetBrains Mono', monospace; margin-top: 3px; }
.odds-cell .v2 { font-size: 12px; font-weight: 700; color: var(--muted); font-family: 'JetBrains Mono', monospace; margin-top: 2px; }

/* ============================ where the edge is =========================== */
.bal-wrap { padding: 15px 18px 4px; }
.bal-top {
  display: flex; align-items: baseline; justify-content: space-between;
  gap: 12px; margin-bottom: 9px; font-size: 12px; font-weight: 800;
}
.bal-side { display: flex; align-items: baseline; gap: 7px; }
.bal-side .who { font-size: 13.5px; font-weight: 900; }
.bal-side .cnt {
  font-family: 'JetBrains Mono', monospace; font-size: 11.5px; font-weight: 800;
  border-radius: 6px; padding: 2px 7px;
}
.bal-b .cnt { background: var(--edge-b-bg); color: var(--edge-b-ink); }
.bal-p .cnt { background: var(--edge-p-bg); color: var(--edge-p-ink); }
.bal-verdict {
  font-size: 11px; font-weight: 800; letter-spacing: .08em;
  text-transform: uppercase; color: var(--muted); text-align: center;
}
.bal-track {
  display: flex; height: 12px; border-radius: 7px; overflow: hidden;
  border: 1px solid var(--line); background: var(--panel-2);
}
.bal-track i { display: block; height: 100%; }
.bal-track .bb { background: var(--edge-b-line); }
.bal-track .pp { background: var(--edge-p-line); }
.bal-track .nn { background: var(--line); }
.bal-scale {
  display: flex; justify-content: space-between; font-size: 10.5px;
  font-weight: 700; color: var(--muted); margin-top: 5px;
}

.edge-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 0; margin-top: 13px; }
.edge-col { border-top: 1px solid var(--line); }
.edge-col:first-child { border-right: 1px solid var(--line); }
.edge-col h4 {
  margin: 0; padding: 9px 15px; font-size: 10.5px; letter-spacing: .1em;
  text-transform: uppercase; font-weight: 800; background: var(--panel-2);
  border-bottom: 1px solid var(--line);
}
.edge-col.b h4 { color: var(--edge-b-ink); background: var(--edge-b-bg); }
.edge-col.p h4 { color: var(--edge-p-ink); background: var(--edge-p-bg); }
.edge-item {
  display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 10px;
  align-items: baseline; padding: 8px 15px; border-bottom: 1px solid var(--line);
  font-size: 12.5px;
}
.edge-item:last-child { border-bottom: 0; }
.edge-item .lab { font-weight: 700; }
.edge-item .lab small { display: block; font-size: 11px; color: var(--muted); font-weight: 600; margin-top: 2px; }
.edge-item .mag { font-family: 'JetBrains Mono', monospace; font-weight: 800; font-size: 12px; white-space: nowrap; }
.edge-col.b .mag { color: var(--edge-b-ink); }
.edge-col.p .mag { color: var(--edge-p-ink); }
.edge-none { padding: 14px 15px; font-size: 12px; color: var(--muted); font-weight: 600; }
.edge-foot {
  padding: 11px 15px; border-top: 1px solid var(--line);
  font-size: 11.5px; color: var(--muted); font-weight: 600; line-height: 1.55;
}
.edge-foot b { color: var(--ink); }
@media (max-width: 900px) {
  .edge-cols { grid-template-columns: 1fr; }
  .edge-col:first-child { border-right: 0; }
}

/* ============================ matchup summary ============================ */
.sum-scroll { overflow-x: auto; }
table.sum { width: 100%; border-collapse: collapse; font-size: 12.5px; min-width: 1120px; }
table.sum th {
  text-align: right; font-size: 10px; letter-spacing: .08em; text-transform: uppercase;
  color: var(--muted); font-weight: 800; padding: 9px 12px;
  border-bottom: 1px solid var(--line); background: var(--panel-2); white-space: nowrap;
}
table.sum th:first-child { text-align: left; }
table.sum td {
  padding: 9px 12px; text-align: right; border-bottom: 1px solid var(--line);
  font-family: 'JetBrains Mono', monospace; font-weight: 800; white-space: nowrap;
}
table.sum td:first-child {
  text-align: left; font-family: Inter, sans-serif; font-weight: 800; color: var(--ink);
}
table.sum td:first-child small {
  display: block; font-size: 11px; font-weight: 600; color: var(--muted); margin-top: 2px;
}
table.sum tr:last-child td { border-bottom: 0; }
table.sum tr.earned td { color: var(--muted); }
table.sum tr.proj td { background: var(--panel-3); }
table.sum tr.proj td:first-child { box-shadow: inset 3px 0 0 var(--brand); }
.nyce-pred-wrap {
  border-top: 1px solid var(--line);
  background: var(--panel);
}
.nyce-pred-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  padding: 11px 15px 8px;
}
.nyce-pred-head b {
  font-size: 12.5px;
  font-weight: 900;
}
.nyce-pred-head span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
}
.nyce-pred-scroll {
  overflow-x: auto;
  padding: 0 15px 12px;
}
table.nyce-pred {
  width: 100%;
  min-width: 620px;
  border-collapse: collapse;
  table-layout: fixed;
  border: 1px solid var(--line);
  font-size: 13px;
}
table.nyce-pred th,
table.nyce-pred td {
  border: 1px solid var(--line);
  padding: 8px 9px;
  text-align: center;
  font-family: 'JetBrains Mono', monospace;
  font-weight: 800;
  white-space: nowrap;
}
table.nyce-pred th {
  background: var(--panel-2);
  color: var(--ink);
  font-size: 12px;
  text-transform: uppercase;
}
table.nyce-pred th:first-child,
table.nyce-pred td:first-child {
  width: 132px;
  text-align: left;
  font-family: Inter, sans-serif;
  font-size: 13px;
  font-weight: 900;
}
table.nyce-pred tr.prediction td {
  background: color-mix(in srgb, #fef08a 58%, var(--panel));
}
.nyce-pred-prob {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 50px;
  min-height: 24px;
  border-radius: 4px;
  background: var(--brand);
  color: #fff;
}
.nyce-pred-good,
.nyce-pred-bad,
.nyce-pred-flat {
  display: block;
  margin: -8px -9px;
  padding: 8px 9px;
}
.nyce-pred-good {
  background: color-mix(in srgb, #22c55e 33%, var(--panel));
  color: #064e3b;
}
.nyce-pred-bad {
  background: color-mix(in srgb, #ef4444 30%, var(--panel));
  color: #7f1d1d;
}
.nyce-pred-flat {
  background: var(--panel);
  color: var(--ink);
}
.nyce-pred-note {
  margin: 0;
  padding: 0 15px 12px;
  color: var(--muted);
  font-size: 11.5px;
  font-weight: 600;
  line-height: 1.45;
}
.nyce-profile-wrap {
  border-top: 1px solid var(--line);
  background: var(--panel);
}
.nyce-profile-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  padding: 11px 15px 8px;
}
.nyce-profile-head b {
  font-size: 12.5px;
  font-weight: 900;
}
.nyce-profile-head span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
}
.nyce-profile-badges {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(126px, 1fr));
  gap: 8px;
  padding: 0 15px 12px;
}
.nyce-profile-chip {
  min-height: 52px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 8px 10px;
  background: var(--panel-2);
}
.nyce-profile-chip small {
  display: block;
  color: var(--muted);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.nyce-profile-chip b {
  display: block;
  margin-top: 4px;
  color: var(--ink);
  font-size: 13px;
  font-weight: 900;
  line-height: 1.2;
}
.nyce-profile-chip.tone-hot {
  border-color: color-mix(in srgb, var(--hot) 45%, var(--line));
  background: color-mix(in srgb, var(--hot) 13%, var(--panel));
}
.nyce-profile-chip.tone-good {
  border-color: color-mix(in srgb, var(--good) 42%, var(--line));
  background: color-mix(in srgb, var(--good) 12%, var(--panel));
}
.nyce-profile-chip.tone-risk {
  border-color: color-mix(in srgb, var(--bad) 40%, var(--line));
  background: color-mix(in srgb, var(--bad) 10%, var(--panel));
}
.nyce-profile-reasons {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 8px;
  margin: 0;
  padding: 0 15px 12px;
  list-style: none;
}
.nyce-profile-reasons li {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 9px 10px;
  background: var(--panel-2);
}
.nyce-profile-reasons b {
  display: block;
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}
.nyce-profile-reasons span {
  display: block;
  margin-top: 3px;
  color: var(--muted);
  font-size: 11.5px;
  font-weight: 650;
  line-height: 1.4;
}
.nyce-profile-reasons li.tone-good {
  border-color: color-mix(in srgb, var(--good) 40%, var(--line));
}
.nyce-profile-reasons li.tone-risk {
  border-color: color-mix(in srgb, var(--bad) 36%, var(--line));
}
.sum-foot {
  padding: 11px 15px; border-top: 1px solid var(--line);
  font-size: 11.5px; color: var(--muted); font-weight: 600; line-height: 1.55;
}
.sum-foot b { color: var(--ink); }

/* ═══ Deck filter ═════════════════════════════════════════════════════════
   Sits inside the rail, above the list it filters. It was a fixed sheet over
   the page, which meant using it hid the very list it was changing. Every
   colour comes from the page's own tokens so it holds contrast in both modes. */

.deck-open {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  width: 100%; margin-top: 8px; padding: 8px 11px;
  border: 1px solid var(--line); border-radius: 10px;
  background: var(--panel-2); color: var(--ink);
  font: 800 11px/1 inherit; letter-spacing: .08em; text-transform: uppercase;
  cursor: pointer;
}
.deck-open:hover { border-color: var(--brand); }
.deck-open b {
  font-size: 11px; font-weight: 700; letter-spacing: 0; text-transform: none;
  color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.deck-open.is-filtered { border-color: var(--brand); }
.deck-open.is-filtered b { color: var(--brand-d); }

/* In-flow panel: it takes its share of the rail and the list keeps the rest.
   max-height caps it on short viewports so the list is never squeezed away. */
.deck-panel {
  display: flex; flex-direction: column;
  /* flex-shrink stays on and min-height is 0, so on a short rail the panel gives
     way instead of squeezing the list it exists to filter down to nothing. */
  flex: 0 1 auto; min-height: 0; max-height: 46vh;
  border-bottom: 1px solid var(--line);
  background: var(--panel-2);
}
.deck-panel[hidden] { display: none; }

.deck-head {
  display: flex; align-items: baseline; justify-content: space-between;
  gap: 8px; padding: 12px 16px 8px;
}
.deck-head h3 {
  margin: 0; font-size: 11px; font-weight: 900;
  letter-spacing: .09em; text-transform: uppercase; color: var(--ink);
}
.deck-head p { margin: 0; font-size: 11px; font-weight: 700; color: var(--muted); white-space: nowrap; }

.deck-body { overflow-y: auto; min-height: 0; padding: 0 16px 12px; }

.deck-group { margin-bottom: 11px; }
.deck-group h4 {
  margin: 0 0 6px; font-size: 10px; font-weight: 900;
  letter-spacing: .09em; text-transform: uppercase; color: var(--soft);
}
.deck-group-head { display: flex; align-items: baseline; justify-content: space-between; }
.deck-group-head b { font-size: 11px; font-weight: 800; color: var(--ink); }

/* Kept short on purpose: the game list is the tallest control, and letting it
   run long pushed hand/playing-time/conviction off the panel entirely. */
.deck-games { display: grid; gap: 3px; max-height: 148px; overflow-y: auto; }

.deck-game {
  display: flex; align-items: center; gap: 8px;
  padding: 6px 8px; border-radius: 8px;
  background: var(--panel); cursor: pointer;
}
.deck-game:hover { background: var(--panel-3); }
.deck-game input { width: 14px; height: 14px; margin: 0; accent-color: var(--good); flex: none; }
.deck-game .dg-name { font-size: 12px; font-weight: 800; color: var(--ink); }
.deck-game .dg-time { font-size: 10.5px; font-weight: 700; color: var(--soft); }
.deck-game .dg-count { margin-left: auto; font-size: 11px; font-weight: 800; color: var(--muted); }
.deck-game.is-off .dg-name { color: var(--soft); }

.deck-seg { display: flex; gap: 4px; flex-wrap: wrap; }
.deck-seg button {
  flex: 1 1 auto; padding: 7px 6px;
  border: 1px solid var(--line); border-radius: 8px;
  background: var(--panel); color: var(--muted);
  font: 800 11.5px/1 inherit; cursor: pointer; white-space: nowrap;
}
.deck-seg button:hover { color: var(--ink); }
/* The selected state sets its ink WITH its fill, never one without the other. */
.deck-seg button.on { background: var(--brand); border-color: var(--brand); color: var(--chip-ink); }

.deck-body input[type="range"] { width: 100%; accent-color: var(--brand); }
.deck-scale {
  display: flex; justify-content: space-between;
  margin-top: 1px; font-size: 10px; font-weight: 700; color: var(--soft);
}

.deck-toggle {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  padding: 9px 10px; border-radius: 9px; background: var(--panel);
  font-size: 11.5px; font-weight: 800; color: var(--ink); cursor: pointer;
}
.deck-toggle em { display: block; margin-top: 2px; font: 600 10.5px/1.3 inherit; color: var(--soft); font-style: normal; }
.deck-toggle input { width: 15px; height: 15px; margin: 0; accent-color: var(--brand); flex: none; }

.deck-foot {
  display: flex; gap: 8px; padding: 10px 16px 12px;
  border-top: 1px solid var(--line); background: var(--panel-2);
}
.deck-reset {
  padding: 9px 14px; border: 1px solid var(--line); border-radius: 9px;
  background: var(--panel); color: var(--muted);
  font: 800 11.5px/1 inherit; cursor: pointer;
}
.deck-reset:hover { color: var(--ink); }
.deck-apply {
  flex: 1; padding: 9px 12px; border: 0; border-radius: 9px;
  background: var(--good); color: var(--chip-ink);
  font: 900 11.5px/1 inherit; cursor: pointer;
}
.deck-apply:hover { filter: brightness(1.06); }

/* ═══ Arsenal clone ═══════════════════════════════════════════════════════
   Toggleable pitch chips over the batter's line against that exact mix. Every
   colour is a page token, and each selected state sets its ink WITH its fill so
   nothing can land on its own background. */

.ars-head {
  display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap;
  margin-bottom: 9px;
}
.ars-head b { font-size: 13.5px; font-weight: 900; color: var(--ink); }
.ars-head span { font-size: 11.5px; font-weight: 700; color: var(--muted); }

.ars-chips { display: flex; flex-wrap: wrap; gap: 5px; margin-bottom: 10px; }
.ars-chip {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 5px 9px; border: 1px solid var(--line); border-radius: 999px;
  background: var(--panel-2); color: var(--soft);
  font: 800 11px/1 inherit; cursor: pointer;
}
.ars-chip i { width: 7px; height: 7px; border-radius: 2px; flex: none; opacity: .45; }
.ars-chip:hover { color: var(--ink); }
.ars-chip.on { background: var(--panel-3); border-color: var(--brand); color: var(--ink); }
.ars-chip.on i { opacity: 1; }

.ars-verdict {
  display: flex; align-items: baseline; justify-content: space-between; gap: 10px;
  padding: 8px 11px; border-radius: 9px; margin-bottom: 10px;
  background: var(--panel-2);
}
.ars-verdict b { font-size: 12.5px; font-weight: 900; }
.ars-verdict span { font-size: 11px; font-weight: 700; color: var(--muted); }
.ars-verdict.good { background: var(--edge-b-bg); }
.ars-verdict.good b { color: var(--edge-b-ink); }
.ars-verdict.bad { background: var(--edge-p-bg); }
.ars-verdict.bad b { color: var(--edge-p-ink); }
.ars-verdict.neutral b { color: var(--ink); }

.ars-grid {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(78px, 1fr));
  gap: 5px; margin-bottom: 9px;
}
.ars-stat {
  padding: 7px 8px; border-radius: 8px; background: var(--panel-2);
}
.ars-stat span {
  display: block; font-size: 9.5px; font-weight: 800; letter-spacing: .05em;
  text-transform: uppercase; color: var(--soft);
}
.ars-stat b {
  display: block; margin-top: 2px; font-size: 13px; font-weight: 900; color: var(--ink);
  font-family: 'JetBrains Mono', monospace;
}

.ars-foot { margin: 0 0 10px; font-size: 11px; font-weight: 600; color: var(--soft); }
.ars-foot em { color: var(--hot-d); font-style: normal; font-weight: 800; }

/* Deselected pitches stay legible -- dimmed, not hidden, so the arsenal still
   reads as a whole while a subset drives the panel above. */
.ars-dim { opacity: .38; }

/* ─────────────────────────────────────────────── historical platoon card
   Same visual weight as its neighbours (BvP Highlights / Projected Outcomes).
   Tone is carried by small text colour and a thin left border, never a filled
   cell, so the card stays readable in both themes. */
.pl-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  justify-content: space-between;
  margin-bottom: 8px;
}

.pl-tabgroup {
  display: inline-flex;
  gap: 2px;
  padding: 2px;
  border: 1px solid var(--line);
  border-radius: 7px;
}

.pl-tab {
  border: 0;
  background: transparent;
  color: var(--soft);
  font: inherit;
  font-size: 10.5px;
  font-weight: 800;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  padding: 3px 8px;
  border-radius: 5px;
  cursor: pointer;
}

.pl-tab:hover { color: var(--ink); }

.pl-tab.on {
  background: var(--brand-d);
  color: #fff;
}

.pl-t {
  width: 100%;
  border-collapse: collapse;
  font-size: 12px;
}

.pl-t th {
  text-align: right;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: var(--soft);
  padding: 0 0 5px;
  border-bottom: 1px solid var(--line);
}

.pl-t th:first-child { text-align: left; }
.pl-t th.pl-live { color: var(--brand-d); }

.pl-t td { padding: 4px 0; vertical-align: top; }

.pl-k {
  color: var(--muted);
  font-size: 10.5px;
  font-weight: 800;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  white-space: nowrap;
}

.pl-v {
  text-align: right;
  font-family: 'JetBrains Mono', monospace;
  font-weight: 800;
  color: var(--ink);
  padding-left: 10px !important;
}

.pl-v em {
  display: block;
  font-family: inherit;
  font-style: normal;
  font-size: 9.5px;
  font-weight: 700;
  color: var(--soft);
  margin-top: 1px;
}

/* Subtle only: colour the number, plus a hairline marker. */
.pl-v.good { color: var(--good-d); border-right: 2px solid var(--good-d); padding-right: 5px; }
.pl-v.bad  { color: var(--bad-d);  border-right: 2px solid var(--bad-d);  padding-right: 5px; }

.pl-edge {
  margin-top: 9px;
  padding: 7px 9px;
  border-radius: 7px;
  border-left: 3px solid var(--line);
  background: var(--edge-bg, rgba(148, 163, 184, 0.10));
}

.pl-edge.batter  { border-left-color: var(--good-d); }
.pl-edge.pitcher { border-left-color: var(--brand-d); }

.pl-edge-h {
  display: block;
  font-size: 9.5px;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--soft);
}

.pl-edge b {
  display: block;
  font-size: 13px;
  font-weight: 800;
  color: var(--ink);
  margin: 1px 0 2px;
}

.pl-why {
  display: block;
  font-size: 11px;
  font-weight: 600;
  line-height: 1.35;
  color: var(--muted);
}

.pl-more {
  margin-top: 8px;
  border: 1px solid var(--line);
  background: transparent;
  color: var(--muted);
  font: inherit;
  font-size: 10.5px;
  font-weight: 800;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  padding: 4px 10px;
  border-radius: 6px;
  cursor: pointer;
}

.pl-more:hover { color: var(--ink); border-color: var(--brand-d); }

.pl-more-body {
  margin-top: 8px;
  padding-top: 8px;
  border-top: 1px dashed var(--line);
}

.pl-foot {
  margin: 8px 0 0;
  font-size: 10.5px;
  font-weight: 600;
  line-height: 1.4;
  color: var(--soft);
}

@media (max-width: 560px) {
  .pl-tabs { justify-content: flex-start; }
  .pl-t { font-size: 11.5px; }
  .pl-v { padding-left: 6px !important; }
  .pl-k { font-size: 10px; }
}
/* Pitcher Profile: skill, matchup, evidence and realistic strikeout tails. */
.pitcher-outlook-card{overflow:hidden}
.pitcher-outlook-shell{padding:16px;background:linear-gradient(135deg,var(--panel-3),var(--panel));border-top:1px solid color-mix(in srgb,var(--brand) 24%,var(--line))}
.pitcher-outlook-lead{display:flex;align-items:center;gap:15px;padding:14px;border:1px solid color-mix(in srgb,var(--brand) 28%,var(--line));border-radius:14px;background:var(--panel)}
.outlook-score{width:82px;height:82px;flex:0 0 82px;border-radius:50%;display:flex;align-items:baseline;justify-content:center;padding-top:20px;box-sizing:border-box;border:5px solid var(--brand);box-shadow:0 0 22px color-mix(in srgb,var(--brand) 22%,transparent);background:var(--panel-2)}
.outlook-score span{font-size:28px;font-weight:950;line-height:1;color:var(--ink)}
.outlook-score small{font-size:10px;font-weight:900;color:var(--soft)}
.outlook-verdict b,.outlook-verdict strong{display:block;text-transform:uppercase;letter-spacing:.075em}
.outlook-verdict b{font-size:18px;color:var(--ink)}
.outlook-verdict strong{font-size:11px;color:var(--brand-d);margin-top:5px}
.outlook-verdict p{margin:7px 0 0;color:var(--muted);font-size:11px;line-height:1.45;font-weight:650}
.outlook-strong .outlook-score,.outlook-dominant .outlook-score,.outlook-favorable .outlook-score{border-color:var(--good);box-shadow:0 0 24px color-mix(in srgb,var(--good) 24%,transparent)}
.outlook-strong .outlook-verdict strong,.outlook-dominant .outlook-verdict strong,.outlook-favorable .outlook-verdict strong{color:var(--good-d)}
.outlook-risk .outlook-score,.outlook-blowup .outlook-score,.outlook-vulnerable .outlook-score{border-color:var(--bad);box-shadow:0 0 24px color-mix(in srgb,var(--bad) 22%,transparent)}
.outlook-risk .outlook-verdict strong,.outlook-blowup .outlook-verdict strong,.outlook-vulnerable .outlook-verdict strong{color:var(--bad-d)}
.outlook-core-metrics{display:grid;grid-template-columns:repeat(auto-fit,minmax(118px,1fr));gap:8px;margin:10px 0}
.outlook-core-metrics>div{min-height:70px;border:1px solid var(--line);border-radius:10px;background:var(--panel);padding:10px;display:flex;flex-direction:column;justify-content:center}
.outlook-core-metrics small,.outlook-tail small{font-size:9px;text-transform:uppercase;letter-spacing:.08em;color:var(--soft);font-weight:850}
.outlook-core-metrics b{margin-top:5px;color:var(--ink);font-size:17px}
.outlook-core-metrics span{margin-top:3px;color:var(--soft);font-size:9px;font-weight:700}
.outlook-evidence{padding:12px;margin:0 0 10px;border:1px solid var(--line);border-radius:12px;background:var(--panel)}
.outlook-title-row{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:10px}
.outlook-title-row.compact{align-items:center}.outlook-title-row.compact .outlook-title{margin:0}
.outlook-title-row p{margin:3px 0 0;color:var(--muted);font-size:10px;line-height:1.4}
.outlook-grade{flex:0 0 auto;padding:5px 8px;border:1px solid var(--line);border-radius:999px;background:var(--panel-2);color:var(--muted);font-size:9px;font-weight:900;letter-spacing:.05em}
.grade-strong{color:var(--good-d)!important;border-color:color-mix(in srgb,var(--good) 48%,var(--line))!important;background:color-mix(in srgb,var(--good) 9%,var(--panel))!important}
.grade-favorable{color:var(--brand-d)!important;border-color:color-mix(in srgb,var(--brand) 48%,var(--line))!important;background:color-mix(in srgb,var(--brand) 9%,var(--panel))!important}
.grade-vulnerable,.grade-risk{color:var(--bad-d)!important;border-color:color-mix(in srgb,var(--bad) 48%,var(--line))!important;background:color-mix(in srgb,var(--bad) 8%,var(--panel))!important}
.outlook-proof-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px}
.outlook-proof{min-width:0;padding:8px 9px;border:1px solid var(--line);border-left-width:3px;border-radius:8px;background:var(--panel-2)}
.outlook-proof>div{display:flex;align-items:center;justify-content:space-between;gap:8px}.outlook-proof span{font-size:9.5px;font-weight:800;color:var(--muted)}.outlook-proof b{font-size:12px;color:var(--ink);white-space:nowrap}
.outlook-proof small{display:block;margin-top:4px;color:var(--soft);font-size:8.5px;line-height:1.35}
.proof-strong{border-left-color:var(--good)}.proof-favorable{border-left-color:var(--brand)}.proof-neutral{border-left-color:var(--yellow)}.proof-vulnerable,.proof-risk{border-left-color:var(--bad)}
.pitcher-outlook-detail{display:grid;grid-template-columns:1.3fr 1fr;gap:10px}
.pitcher-outlook-detail>div{padding:12px;border:1px solid var(--line);border-radius:12px;background:var(--panel)}
.outlook-title{text-transform:uppercase;letter-spacing:.09em;color:var(--muted);font-size:10px;font-weight:900;margin-bottom:10px}
.outlook-component{margin:8px 0}
.outlook-component>div:first-child{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:10.5px;color:var(--muted);font-weight:750}
.outlook-component b{color:var(--ink)}
.outlook-track{height:5px;margin-top:4px;border-radius:999px;background:var(--panel-3);overflow:hidden}
.outlook-track i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--brand),var(--good))}
.outlook-tail-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.outlook-tail{padding:9px 6px;text-align:center;border-radius:9px;background:var(--panel-2);border:1px solid color-mix(in srgb,var(--brand) 25%,var(--line))}
.outlook-tail b{display:block;margin-top:4px;color:var(--ink);font-size:14px}
.outlook-ceiling{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:10px;padding-top:10px;border-top:1px solid var(--line)}
.outlook-ceiling b{color:var(--good-d);font-size:14px}.outlook-ceiling span{color:var(--soft);font-size:10px;font-weight:700;text-align:right}
.outlook-foot{margin:8px 0 0;color:var(--soft);font-size:10px;line-height:1.4}
.outlook-zone-threat{display:grid;grid-template-columns:150px minmax(0,1fr);gap:12px;align-items:stretch;margin-top:10px;padding:12px;border:1px solid color-mix(in srgb,var(--brand) 34%,var(--line));border-radius:12px;background:color-mix(in srgb,var(--brand) 5%,var(--panel))}
.outlook-zone-score{display:flex;flex-direction:column;justify-content:center;padding:10px;border-right:1px solid var(--line)}.outlook-zone-score small{text-transform:uppercase;letter-spacing:.07em;color:var(--muted);font-size:9px;font-weight:900}.outlook-zone-score>b{margin:6px 0 4px;color:var(--ink);font-size:25px}.outlook-zone-score em{color:var(--soft);font-size:10px;font-style:normal}.outlook-zone-score strong{align-self:flex-start;padding:4px 7px;border:1px solid var(--line);border-radius:999px;font-size:9px;letter-spacing:.05em}
.outlook-zone-copy p{margin:0 0 8px;color:var(--muted);font-size:10.5px;line-height:1.45;font-weight:650}.outlook-zone-copy>small{display:block;margin-top:8px;color:var(--soft);font-size:9px;font-weight:700}
.outlook-zone-chips{display:flex;flex-wrap:wrap;gap:6px}.outlook-zone-chip{display:flex;gap:5px;align-items:center;padding:5px 7px;border:1px solid var(--line);border-left-width:3px;border-radius:7px;background:var(--panel);font-size:9px}.outlook-zone-chip b{color:var(--ink)}.outlook-zone-chip small{color:var(--soft);font-weight:800}
.outlook-signals{list-style:none;padding:0;margin:10px 0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
.outlook-signals li{padding:8px 10px;border-radius:8px;font-size:10.5px;line-height:1.35;font-weight:700;border:1px solid var(--line);background:var(--panel)}
.outlook-signals .positive{color:var(--good-d);border-color:color-mix(in srgb,var(--good) 35%,var(--line))}
.outlook-signals .positive:before{content:'✓ ';color:var(--good)}
.outlook-signals .caution{color:var(--bad-d);border-color:color-mix(in srgb,var(--bad) 35%,var(--line))}
.outlook-signals .caution:before{content:'! ';color:var(--bad)}
.outlook-alert,.outlook-method{display:flex;gap:10px;align-items:flex-start;padding:9px 10px;border-radius:9px;font-size:10px;line-height:1.4}
.outlook-alert{margin-top:8px;color:var(--yellow-d);background:color-mix(in srgb,var(--yellow) 8%,var(--panel));border:1px solid color-mix(in srgb,var(--yellow) 30%,var(--line))}
.outlook-alert b{white-space:nowrap}.outlook-alert span{color:var(--muted)}
.outlook-method{color:var(--soft);background:var(--panel);border:1px solid var(--line)}
.outlook-method b{color:var(--muted);white-space:nowrap}.outlook-method span{font-weight:650}
.history-fallback{display:flex;flex-direction:column;gap:4px;margin-top:10px;padding:10px;border-radius:9px;background:color-mix(in srgb,var(--brand) 9%,var(--panel));border:1px solid color-mix(in srgb,var(--brand) 35%,var(--line));color:var(--muted);font-size:10.5px;line-height:1.4}
.history-fallback b{color:var(--brand-d);text-transform:uppercase;letter-spacing:.06em;font-size:10px}.history-fallback small{color:var(--soft)}.history-fallback.pending{border-style:dashed;opacity:.78}
@media(max-width:1050px){.outlook-proof-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:720px){.pitcher-outlook-detail{grid-template-columns:1fr}.outlook-core-metrics,.outlook-proof-grid{grid-template-columns:repeat(2,1fr)}.outlook-zone-threat{grid-template-columns:1fr}.outlook-zone-score{border-right:0;border-bottom:1px solid var(--line)}.outlook-signals{grid-template-columns:1fr}.pitcher-outlook-lead{align-items:flex-start}.outlook-score{width:68px;height:68px;flex-basis:68px;padding-top:15px}.outlook-score span{font-size:23px}}
@media(max-width:440px){.outlook-proof-grid{grid-template-columns:1fr}.outlook-title-row{flex-direction:column}.outlook-grade{align-self:flex-start}}

/* The spray-chart weather row is an explanation of the current game window,
   not a second filter system. Every colour is a theme token so light mode and
   dark mode carry the same meaning. */
.weather-impact-report{padding:11px 12px;border:1px solid var(--line);border-left:4px solid var(--brand);border-radius:11px;background:var(--panel);color:var(--ink)}
.weather-impact-report.boost{border-left-color:var(--good);background:color-mix(in srgb,var(--good) 8%,var(--panel))}
.weather-impact-report.drag{border-left-color:var(--bad);background:color-mix(in srgb,var(--bad) 7%,var(--panel))}
.weather-impact-report.indoor{border-left-color:var(--yellow);background:color-mix(in srgb,var(--yellow) 8%,var(--panel))}
.weather-impact-lead{display:flex;align-items:center;justify-content:space-between;gap:10px}
.weather-impact-lead span{font-size:9.5px;font-weight:950;letter-spacing:.08em;color:var(--muted)}
.weather-impact-lead strong{font:900 16px/1 'JetBrains Mono',monospace;color:var(--ink)}
.weather-impact-equation{display:flex;align-items:center;flex-wrap:wrap;gap:6px;margin:9px 0 6px}
.weather-impact-equation b{padding:5px 7px;border:1px solid var(--line);border-radius:7px;background:var(--panel-2);font-size:9.5px;color:var(--ink)}
.weather-impact-equation i{font-style:normal;color:var(--soft);font-weight:900}
.weather-impact-report p{margin:0;color:var(--muted);font-size:10.5px;font-weight:700;line-height:1.45}
.weather-impact-report>small{display:block;margin-top:5px;color:var(--soft);font-size:9px;line-height:1.4}

/* Baseline, opportunity and zone threat use the same compact evidence cards in
   Confidence and Hitter Profile. */
.conf-model-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin-bottom:10px}
.conf-model-card{padding:10px;border:1px solid var(--line);border-left:3px solid var(--brand);border-radius:10px;background:var(--panel-2)}
.conf-model-card.tone-elite,.conf-model-card.tone-good{border-left-color:var(--good)}
.conf-model-card.tone-bad{border-left-color:var(--bad)}
.conf-model-card>span{display:block;color:var(--muted);font-size:9px;font-weight:950;letter-spacing:.08em;text-transform:uppercase}
.conf-model-card>div{display:flex;align-items:baseline;gap:3px;margin-top:4px}.conf-model-card strong{font-size:23px;color:var(--ink)}.conf-model-card>div small{color:var(--soft);font-size:9px;font-weight:850}
.conf-model-card>b{display:block;margin-top:4px;color:var(--ink);font-size:9.5px;line-height:1.35}.conf-model-card p{margin:5px 0 0;color:var(--muted);font-size:9px;line-height:1.4}
.conf-model-note{margin:0 0 14px;padding:8px 10px;border-radius:8px;background:color-mix(in srgb,var(--brand) 7%,var(--panel));color:var(--muted);font-size:10px;line-height:1.5}

.hitter-profile-shell{background:linear-gradient(135deg,var(--panel-3),var(--panel))}
.hitter-profile-pad{padding:0 15px 14px}
.hitter-profile-lead{display:flex;align-items:center;gap:15px;padding:14px;border:1px solid color-mix(in srgb,var(--brand) 30%,var(--line));border-radius:14px;background:var(--panel)}
.hitter-profile-score{width:78px;height:78px;flex:0 0 78px;padding-top:20px;box-sizing:border-box;border:5px solid var(--brand);border-radius:50%;text-align:center;background:var(--panel-2);box-shadow:0 0 22px color-mix(in srgb,var(--brand) 20%,transparent)}
.hitter-profile-score span{font-size:25px;font-weight:950;color:var(--ink)}.hitter-profile-score small{font-size:9px;font-weight:900;color:var(--soft)}
.hitter-profile-lead h3{margin:0;color:var(--ink);font-size:20px;letter-spacing:.02em}.hitter-profile-lead b{display:block;margin-top:3px;color:var(--brand-d);font-size:11px;text-transform:uppercase}.hitter-profile-lead p{margin:6px 0 0;color:var(--muted);font-size:10.5px;line-height:1.45}
.hitter-core-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin:10px 0}
.hitter-profile-detail{display:grid;grid-template-columns:1fr 1.35fr;gap:10px}.hitter-profile-detail>div{padding:12px;border:1px solid var(--line);border-radius:12px;background:var(--panel)}
.hitter-proof-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.hitter-proof{padding:8px;border:1px solid var(--line);border-left:3px solid var(--brand);border-radius:8px;background:var(--panel-2)}
.hitter-proof>div{display:flex;justify-content:space-between;gap:8px}.hitter-proof span{font-size:9px;font-weight:800;color:var(--muted)}.hitter-proof b{font-size:11px;color:var(--ink)}.hitter-proof small{display:block;margin-top:4px;color:var(--soft);font-size:8.5px;line-height:1.35}
.hitter-context-row{display:flex;flex-wrap:wrap;gap:7px;margin:10px 0}.hitter-context-chip{padding:7px 9px;border:1px solid var(--line);border-radius:8px;background:var(--panel-2)}.hitter-context-chip small{display:block;color:var(--soft);font-size:8px;font-weight:900;text-transform:uppercase}.hitter-context-chip b{display:block;margin-top:2px;color:var(--ink);font-size:10px}

.outlook-likely-range{display:grid;grid-template-columns:1fr auto;align-items:end;gap:2px 8px;padding:9px 10px;margin-bottom:8px;border:1px solid color-mix(in srgb,var(--brand) 35%,var(--line));border-radius:9px;background:color-mix(in srgb,var(--brand) 7%,var(--panel-2))}.outlook-likely-range small{grid-column:1/-1;color:var(--muted);font-size:8px;font-weight:900;text-transform:uppercase}.outlook-likely-range b{font-size:20px;color:var(--ink)}.outlook-likely-range span{color:var(--soft);font-size:9px;font-weight:800}
.outlook-performance{margin-top:10px;padding:9px;border:1px solid var(--line);border-left:3px solid var(--brand);border-radius:9px;background:var(--panel-2)}.outlook-performance.performance-over{border-left-color:var(--good)}.outlook-performance.performance-under{border-left-color:var(--bad)}.outlook-performance>b{font-size:10px;color:var(--ink);letter-spacing:.06em}.outlook-performance ul{margin:6px 0;padding-left:16px}.outlook-performance li,.outlook-performance p,.outlook-performance small{color:var(--muted);font-size:8.8px;line-height:1.4}.outlook-performance p{margin:5px 0 0}.outlook-performance small{display:block;color:var(--soft)}

.mc-bar-action{margin:4px 0}.mc-slip-btn{border:1px solid color-mix(in srgb,var(--brand) 45%,var(--line));border-radius:7px;background:color-mix(in srgb,var(--brand) 9%,var(--panel));color:var(--brand-d);padding:4px 7px;font-size:8.5px;font-weight:900;cursor:pointer}.mc-slip-btn:hover,.mc-slip-btn.added{background:var(--good);border-color:var(--good);color:#06251a}.odds-cell .mc-slip-btn{margin-top:7px;width:100%;padding:6px}

@media(max-width:760px){.conf-model-grid,.hitter-core-metrics,.hitter-profile-detail{grid-template-columns:1fr}.hitter-proof-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.weather-impact-lead{align-items:flex-start;flex-direction:column}.hitter-profile-lead{align-items:flex-start}.hitter-profile-score{width:66px;height:66px;flex-basis:66px;padding-top:15px}.hitter-profile-score span{font-size:21px}}

/* Matchup analysis workspace and professional spray field. */
:root{
  --field-canvas:#f6f9fc;--field-grass:#dff3e6;--field-grass-inner:#eaf8ef;
  --field-track:#d7c2a0;--field-dirt:#dec6a1;--field-line:#17324d;
  --field-grid:#8aa1b6;--field-label-bg:#f6f9fc;
}
html.nyce-dark,body.nyce-dark{
  --field-canvas:#0b1320;--field-grass:#163a31;--field-grass-inner:#1b473a;
  --field-track:#574a36;--field-dirt:#604b34;--field-line:#d7e3ef;
  --field-grid:#698099;--field-label-bg:#0b1320;
}

.matchup-analysis-grid{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
  grid-template-areas:"spray spray" "history arsenal";gap:14px;align-items:start;
}
.matchup-analysis-grid>.card,.matchup-evidence-grid>.card{min-width:0;overflow:hidden}
.spray-analysis-card{grid-area:spray}.history-analysis-card{grid-area:history}.arsenal-analysis-card{grid-area:arsenal}
.spray-analysis-card .card-h{align-items:flex-start;flex-wrap:wrap;gap:5px 12px}
.spray-analysis-card .card-h .note{max-width:68%;text-align:right;line-height:1.3;overflow-wrap:anywhere}
.spray-analysis-card .card-b{padding:12px}
.matchup-evidence-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;align-items:start}

.spray-model-controls{
  grid-template-columns:repeat(3,minmax(0,1fr)) minmax(110px,auto);gap:8px;padding:10px;
}
.spray-model-controls>*{min-width:0}.spray-model-controls select{width:100%;font-size:11px}
.spray-model-controls button{white-space:nowrap;padding-inline:13px}
.spray-model-controls>small{grid-column:1/-1;line-height:1.35;white-space:normal}

.spray-stage{
  border:1px solid color-mix(in srgb,var(--field-line) 34%,var(--line));border-radius:14px;
  background:var(--field-canvas);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--panel) 65%,transparent);
  width:min(100%,760px);margin-inline:auto;overflow:hidden;
}
.spray-svg{aspect-ratio:720/600;max-height:560px;background:var(--field-canvas)}
.field-canvas{fill:var(--field-canvas)}
.field-warning-track{fill:var(--field-track);stroke:none}
.field-grass{fill:var(--field-grass);stroke:none}
.field-infield-dirt{fill:var(--field-dirt);stroke:none}
.field-infield-grass{fill:var(--field-grass-inner);stroke:none}
.field-boundary,.field-inner-boundary,.field-infield-line,.field-foul-line,.field-home-plate{
  fill:none;stroke:var(--field-line);stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke
}
.field-boundary{stroke-width:3}.field-inner-boundary{stroke-width:1.35;stroke-dasharray:6 5;opacity:.78}
.field-infield-line{stroke-width:1.55}.field-foul-line{stroke-width:2.2}.field-home-plate{fill:var(--panel);stroke-width:1.8}
.field-centre-guide{stroke:var(--field-grid);stroke-width:1;stroke-dasharray:5 7;opacity:.52}
.field-dimension-line{stroke:var(--field-grid);stroke-width:1.25;stroke-dasharray:4 5;vector-effect:non-scaling-stroke}
.field-dimension-pin{fill:var(--field-line);stroke:var(--field-label-bg);stroke-width:2}
.field-dimension-label{
  fill:var(--field-line);stroke:var(--field-label-bg);stroke-width:7;paint-order:stroke fill;
  font:900 14px 'JetBrains Mono',monospace;letter-spacing:.02em
}
.spray-point{stroke:var(--field-label-bg);stroke-width:1.35;vector-effect:non-scaling-stroke;cursor:pointer;transition:r .12s ease,stroke-width .12s ease}
.spray-point-out{stroke-width:.8}.spray-point-hit{filter:drop-shadow(0 1px 1px rgba(15,23,42,.25))}
.spray-point:hover,.spray-point:focus,.spray-point.selected{stroke:var(--hot);stroke-width:3;outline:none;filter:drop-shadow(0 0 5px color-mix(in srgb,var(--hot) 55%,transparent))}
.spray-hotspot{stroke-width:2;filter:drop-shadow(0 2px 4px rgba(185,28,28,.2))}

.field-compass{filter:drop-shadow(0 2px 4px rgba(15,23,42,.12))}
.compass-ring{fill:color-mix(in srgb,var(--panel) 90%,transparent);stroke:var(--field-line);stroke-width:1.6}
.compass-inner{fill:none;stroke:var(--field-grid);stroke-width:1;stroke-dasharray:3 3}
.compass-axis{stroke:var(--field-grid);stroke-width:1}
.compass-north{stroke:var(--bad);stroke-width:2.4}
.compass-arrow-head{fill:var(--bad)}
.compass-cardinal{fill:var(--field-line);font:900 11px 'JetBrains Mono',monospace}
.compass-bearing{fill:var(--muted);font:900 10px 'JetBrains Mono',monospace;letter-spacing:.06em}

.spray-weather-layer rect{fill:none}
.wind-vector-card rect{fill:color-mix(in srgb,var(--panel) 94%,transparent);stroke:var(--line);stroke-width:1.3}
.wind-vector-card.boost rect,.wind-vector-card.hot rect{stroke:color-mix(in srgb,var(--good) 65%,var(--line))}
.wind-vector-card.drag rect,.wind-vector-card.cold rect{stroke:color-mix(in srgb,var(--brand) 65%,var(--line))}
.wind-vector-kicker{fill:var(--soft);font:900 9px Inter,system-ui,sans-serif;letter-spacing:.11em}
.wind-vector-card .wind-label{font-size:11px;fill:var(--ink)}
.wind-vector-ring{fill:color-mix(in srgb,var(--panel-2) 88%,transparent);stroke:var(--line);stroke-width:1.2}
.wind-vector-card .wind-arrow{stroke-width:3;opacity:1}
.wind-vector-card.boost .wind-arrow,.wind-vector-card.hot .wind-arrow{stroke:var(--good)}
.wind-vector-card.drag .wind-arrow,.wind-vector-card.cold .wind-arrow{stroke:#2563eb}
.wind-vector-card.neutral .wind-arrow,.wind-vector-card.indoor .wind-arrow{stroke:var(--yellow)}
.wind-arrow-head.boost{fill:var(--good)}.wind-arrow-head.drag{fill:#2563eb}.wind-arrow-head.neutral{fill:var(--yellow)}
.wind-streak{stroke-width:1.35;opacity:0}

.spray-focus-ring{fill:none;stroke:var(--hot);stroke-width:3;filter:drop-shadow(0 0 4px color-mix(in srgb,var(--hot) 48%,transparent))}
.spray-focus-pointer{stroke:var(--hot);stroke-width:4;stroke-linecap:round;filter:drop-shadow(0 2px 3px rgba(15,23,42,.28))}
.focus-arrow-head{fill:var(--hot)}
.spray-focus-label-bg{fill:color-mix(in srgb,var(--panel) 95%,transparent);stroke:var(--hot);stroke-width:1.4}
.spray-focus-kicker{fill:var(--soft);font:900 8px Inter,system-ui,sans-serif;letter-spacing:.1em}
.spray-focus-label{fill:var(--ink);font:900 11px 'JetBrains Mono',monospace}

.spray-readout{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;flex-wrap:wrap}
.spray-readout .spray-summary,.spray-readout .spray-legend{margin-top:0}
.spray-readout .spray-legend{padding-top:7px;justify-content:flex-end}
.spray-caption{margin:0;color:var(--soft);font-size:11px;font-weight:650;line-height:1.48}
.spray-weather-controls{gap:7px;padding:10px}
.weather-stat-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px}
.weather-stat-grid .weather-chip{display:grid;grid-template-columns:1fr;align-content:center;gap:2px;min-width:0}
.weather-stat-grid .weather-chip b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

.spray-control-group{display:grid;gap:5px;min-width:0}.spray-control-group>span,.spray-outcome-filter>span,.weather-time-buttons>span{color:var(--soft);font-size:9px;font-weight:950;letter-spacing:.07em;text-transform:uppercase}
.spray-control-group>div,.spray-outcome-filter>div,.weather-time-buttons>div,.park-period-buttons{display:flex;flex-wrap:wrap;gap:5px}
.spray-control-group button,.spray-outcome-filter button,.weather-time-buttons button,.park-period-buttons button{appearance:none;min-height:30px;padding:6px 9px;border:1px solid var(--line);border-radius:8px;background:var(--panel);color:var(--muted);font-size:9.5px;font-weight:900;cursor:pointer}
.spray-control-group button[aria-pressed="true"],.weather-time-buttons button[aria-pressed="true"],.park-period-buttons button[aria-pressed="true"]{border-color:var(--brand);background:var(--brand);color:var(--chip-ink)}
.spray-model-controls{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr) auto}.spray-model-controls>.spray-control-group{align-self:stretch}.spray-model-controls>[data-spray-build]{align-self:end}
.spray-model-controls>.spray-layer-help{grid-column:1/-1;margin:0;padding:9px 11px;border:1px solid var(--line);border-radius:8px;background:var(--panel);color:var(--muted);font-size:11px;line-height:1.45}.spray-layer-help b{color:var(--ink)}
.spray-control-group button[data-spray-layer-btn="bvp"].empty,.spray-control-group button[data-spray-layer-btn="bvp"].empty[aria-pressed="true"]{border-color:var(--line);background:var(--panel-2);color:var(--soft)}.spray-model-controls>.spray-layer-help.empty{background:var(--panel-2);color:var(--soft)}
.spray-ball-filter{display:grid;gap:6px;margin-top:10px}.spray-ball-filter>span{color:var(--soft);font-size:9px;font-weight:950;letter-spacing:.07em;text-transform:uppercase}.spray-ball-filter>div{display:flex;flex-wrap:wrap;gap:5px}.spray-ball-filter button{appearance:none;min-height:30px;padding:6px 9px;border:1px solid var(--line);border-radius:8px;background:var(--panel);color:var(--muted);font-size:9.5px;font-weight:900;cursor:pointer}.spray-ball-filter button[aria-pressed="true"]{border-color:var(--brand);background:var(--brand);color:var(--chip-ink)}.spray-ball-filter small{color:var(--soft);font-size:9px;line-height:1.35}
.spray-region-panel{display:grid;gap:9px;margin-top:11px;padding:11px;border:1px solid var(--line);border-radius:10px;background:var(--panel-2)}.spray-region-panel>div:first-child{display:grid;gap:3px}.spray-region-panel>div:first-child>b{color:var(--ink);font-size:11px;text-transform:uppercase;letter-spacing:.06em}.spray-region-panel>div:first-child>span,.spray-region-panel>p{color:var(--muted);font-size:10px;line-height:1.4}.spray-region-panel>p{margin:0}.spray-region-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}.spray-region{display:grid;align-content:start;gap:5px;min-width:0;padding:9px;border:1px solid var(--line);border-radius:8px;background:linear-gradient(135deg,color-mix(in srgb,var(--good) var(--batter-heat),var(--panel)) 0%,color-mix(in srgb,var(--hot) var(--pitcher-heat),var(--panel)) 100%)}.spray-region>b{color:var(--ink);font-size:13px}.spray-region>span{color:var(--ink);font-size:10px;line-height:1.35}.spray-region>small{color:var(--muted);font-size:9px;line-height:1.3}.spray-region>em{width:max-content;max-width:100%;padding:2px 5px;border-radius:4px;font-size:8px;font-style:normal;font-weight:900;text-transform:uppercase}.spray-region>em.hot{color:var(--good);background:color-mix(in srgb,var(--good) 13%,var(--panel))}.spray-region>em.cold{color:var(--hot);background:color-mix(in srgb,var(--hot) 13%,var(--panel))}
.spray-region-panel.collapsed{padding:0;overflow:hidden}.spray-region-toggle{appearance:none;display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;padding:13px;border:0;border-radius:9px;background:var(--panel);color:var(--ink);text-align:left;cursor:pointer}.spray-region-toggle span{display:grid;gap:3px}.spray-region-toggle b{font-size:12px;text-transform:uppercase;letter-spacing:.05em}.spray-region-toggle small{font-size:9px;color:var(--muted);line-height:1.35}.spray-region-toggle strong{flex-shrink:0;color:var(--brand-d);font-size:10px}.spray-region-toggle:focus-visible,.spray-region-tabs button:focus-visible{outline:2px solid var(--brand);outline-offset:2px}.spray-region-content{display:grid;gap:10px}.spray-region-tabs{display:flex;flex-wrap:wrap;gap:6px}.spray-region-tabs button{appearance:none;min-height:31px;padding:6px 10px;border:1px solid var(--line);border-radius:8px;background:var(--panel);color:var(--muted);font-size:10px;font-weight:850;cursor:pointer}.spray-region-tabs button[aria-pressed="true"]{border-color:var(--brand);background:var(--brand);color:var(--chip-ink)}.spray-region-panel .spray-region-explain,.spray-region-panel .spray-region-count,.spray-region-panel .spray-region-caveat{margin:0;color:var(--muted);font-size:10px;line-height:1.45}.spray-fan-wrap{width:100%;max-width:720px;margin:auto;overflow:hidden}.spray-fan-svg{display:block;width:100%;height:auto;overflow:visible}.spray-fan-wedge{stroke:var(--panel);stroke-width:3}.spray-fan-value,.spray-fan-count,.spray-fan-field{text-anchor:middle;fill:var(--ink);font-family:'JetBrains Mono',monospace;font-weight:950}.spray-fan-value{font-size:19px}.spray-fan-count{font-size:12px;fill:var(--muted)}.spray-fan-field{font-size:15px;fill:var(--muted)}.spray-fan-home{fill:var(--ink)}.spray-region-matchup{display:grid;gap:3px;padding:9px;border:1px solid var(--line);border-radius:8px;background:var(--panel)}.spray-region-matchup b,.spray-region-content h4{margin:0;color:var(--ink);font-size:11px;text-transform:uppercase;letter-spacing:.04em}.spray-region-matchup span{color:var(--muted);font-size:10px;line-height:1.4}.spray-questions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.spray-questions article{display:grid;align-content:start;gap:5px;padding:10px;border:1px solid var(--line);border-radius:8px;background:var(--panel)}.spray-questions b{color:var(--ink);font-size:10px}.spray-questions span{color:var(--muted);font-size:10px;line-height:1.4}
@media(max-width:700px){.spray-region-grid{grid-template-columns:1fr}}
@media(max-width:560px){.spray-questions{grid-template-columns:1fr}.spray-fan-value{font-size:17px}.spray-fan-count{font-size:11px}.spray-region-toggle{align-items:flex-start}.spray-region-toggle strong{max-width:95px;text-align:right}}
.spray-outcome-filter{display:grid;gap:5px}.spray-outcome-filter button{display:inline-flex;align-items:center;gap:5px}.spray-outcome-filter button i{width:8px;height:8px;border-radius:50%;background:var(--result-color)}.spray-outcome-filter button[aria-pressed="true"]{border-color:var(--result-color);box-shadow:inset 0 0 0 1px var(--result-color);color:var(--ink)}
.spray-point-detail{display:grid;gap:8px;padding:10px;border:1px solid color-mix(in srgb,var(--brand) 36%,var(--line));border-radius:10px;background:color-mix(in srgb,var(--brand) 6%,var(--panel));align-items:center}.spray-point-detail>header{display:flex;align-items:center;justify-content:space-between;gap:8px}.spray-point-detail>header>b{font-size:12px;color:var(--ink)}.spray-point-detail>header>button{border:0;background:transparent;color:var(--muted);cursor:pointer;font-size:18px}.spray-point-detail>section{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px}.spray-point-detail>section>span{display:grid;gap:2px;min-width:0;padding:6px;border:1px solid var(--line);border-radius:7px;background:var(--panel)}.spray-point-detail>section small{font-size:8px;color:var(--soft);font-weight:900;text-transform:uppercase}.spray-point-detail>section strong{font:850 9px 'JetBrains Mono',monospace;color:var(--ink);overflow-wrap:anywhere}.spray-point-detail>footer{color:var(--muted);font-size:9px;font-weight:700}.spray-point-detail.empty{display:flex;justify-content:center;gap:8px;color:var(--muted)}.spray-point-detail.empty span{font-size:10px}

.weather-time-buttons{display:grid;gap:5px;min-width:0}.weather-time-buttons button{min-height:34px}.weather-time-buttons button[aria-pressed="true"]{background:var(--brand)}
.park-factor-panel{display:grid;gap:8px;padding:10px;border:1px solid var(--line);border-radius:10px;background:var(--panel)}.park-factor-head{display:flex;align-items:center;justify-content:space-between;gap:10px}.park-factor-head b{font-size:12px;color:var(--ink)}.park-factor-head span{font-size:10px;color:var(--soft);font-weight:800}.park-factor-head strong{font-size:10px;color:var(--brand-d);text-transform:uppercase}.park-period-buttons button{min-height:26px;padding:4px 7px;font-size:8.5px}.park-factor-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}.park-factor-stats>div,.weather-hand-card{display:grid;gap:2px;padding:8px;border:1px solid var(--line);border-radius:8px;background:var(--panel-2);min-width:0}.park-factor-stats small,.weather-hand-card span{color:var(--soft);font-size:8px;font-weight:950;text-transform:uppercase}.park-factor-stats b,.weather-hand-card b{color:var(--ink);font:900 13px 'JetBrains Mono',monospace}.park-factor-stats span,.weather-hand-card small{color:var(--muted);font-size:8.5px;line-height:1.35}.weather-hand-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}.weather-hand-card.current{border-color:var(--brand);background:color-mix(in srgb,var(--brand) 8%,var(--panel-2))}.park-factor-panel>p{margin:0;color:var(--soft);font-size:8.5px;line-height:1.4}
.zone-facing-note{display:grid;gap:2px;margin:7px 0;padding:7px;border:1px solid var(--line);border-radius:7px;background:var(--panel-2)}.zone-facing-note b{font-size:9px;color:var(--ink)}.zone-facing-note span{font-size:8px;color:var(--muted);line-height:1.35}
.metric-info,.profile-info-button{appearance:none;border:1px solid var(--line);border-radius:999px;background:var(--panel-2);color:var(--brand-d);font-size:10px;font-weight:950;cursor:pointer}.metric-info{width:18px;height:18px;padding:0;margin-left:3px}.profile-info-button{width:30px;height:30px;font-size:14px}
.profile-method-section{display:grid;gap:9px;margin:10px 0;padding:11px;border:1px solid var(--line);border-radius:12px;background:var(--panel)}.profile-method-head{display:flex;align-items:center;justify-content:space-between;gap:10px}.profile-method-head>div{display:grid;gap:2px}.profile-method-head b{color:var(--ink);font-size:12px;text-transform:uppercase;letter-spacing:.05em}.profile-method-head span{color:var(--soft);font-size:9px;font-weight:750}.profile-method-section>.profile-axis-grid,.profile-method-section>.opportunity-axis-grid,.profile-method-section>p{display:none}.profile-method-section.show-method>.profile-axis-grid,.profile-method-section.show-method>.opportunity-axis-grid{display:grid}.profile-method-section.show-method>p{display:block}.profile-method-section>p{margin:0;color:var(--soft);font-size:9px;line-height:1.45}
.profile-axis-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}.profile-axis-grid>article,.opportunity-axis-grid>article{padding:9px;border:1px solid var(--line);border-radius:9px;background:var(--panel-2);min-width:0}.profile-axis-grid header{display:grid;grid-template-columns:1fr auto;gap:2px 8px;margin-bottom:6px}.profile-axis-grid header b{color:var(--ink);font-size:10px;text-transform:uppercase}.profile-axis-grid header strong{grid-row:1/3;grid-column:2;color:var(--brand-d);font:950 18px 'JetBrains Mono',monospace}.profile-axis-grid header small{color:var(--soft);font-size:8px}.profile-input-row{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:5px;padding:4px 0;border-top:1px solid color-mix(in srgb,var(--line) 70%,transparent);align-items:center}.profile-input-row span{font-size:8.5px;color:var(--muted);font-weight:750}.profile-input-row b{font:850 9px 'JetBrains Mono',monospace;color:var(--ink)}.profile-input-row em{font-style:normal;font-size:7.5px;color:var(--soft);font-weight:900}.profile-axis-grid article>p{margin:5px 0 0;color:var(--soft);font-size:8px;line-height:1.35}
.opportunity-axis-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.opportunity-axis-grid article header{display:grid;grid-template-columns:1fr auto auto;gap:8px;align-items:baseline}.opportunity-axis-grid header b{font-size:9.5px;color:var(--ink);text-transform:uppercase}.opportunity-axis-grid header em{font-style:normal;color:var(--soft);font-size:8px;font-weight:900}.opportunity-axis-grid header strong{font:950 16px 'JetBrains Mono',monospace;color:var(--brand-d)}.opportunity-axis-grid article p{margin:5px 0 0;color:var(--muted);font-size:8.5px;line-height:1.4}

/* Baseline and Opportunity are single score cards with nested model details. */
.profile-score-card{padding:0;overflow:hidden;align-self:start}.profile-score-card.expanded{grid-column:1/-1}
.profile-score-toggle{appearance:none;display:grid;width:100%;gap:4px;padding:11px;border:0;background:transparent;color:var(--ink);text-align:left;cursor:pointer}
.profile-score-toggle>span:first-child{color:var(--muted);font-size:9px;font-weight:950;letter-spacing:.08em;text-transform:uppercase}
.profile-score-value{display:flex;align-items:baseline;gap:3px}.profile-score-value strong{font-size:23px;color:var(--ink)}.profile-score-value small{color:var(--soft);font-size:9px;font-weight:850}
.profile-score-toggle>b{font-size:9.5px;line-height:1.35}.profile-score-toggle>p{margin:0;color:var(--muted);font-size:9px;line-height:1.4}.profile-score-toggle>em{justify-self:end;color:var(--brand-d);font-size:8px;font-style:normal;font-weight:950;text-transform:uppercase}
.profile-score-toggle:focus-visible,.profile-axis-summary:focus-visible{outline:2px solid var(--brand);outline-offset:-2px}
.profile-score-card>.profile-score-detail{display:none;padding:11px;border-top:1px solid var(--line);background:color-mix(in srgb,var(--brand) 3%,var(--panel))}.profile-score-card.expanded>.profile-score-detail{display:block}
.profile-axis-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.profile-axis-card{overflow:hidden;border:1px solid var(--line);border-radius:9px;background:var(--panel-2)}
.profile-axis-summary{appearance:none;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 9px;width:100%;padding:9px;border:0;background:transparent;color:var(--ink);text-align:left;cursor:pointer}
.profile-axis-title{display:grid;gap:2px}.profile-axis-title>b{font-size:10px;letter-spacing:.04em;text-transform:uppercase}.profile-axis-title>small{color:var(--soft);font-size:8px;font-weight:800}
.profile-axis-summary>strong{font:950 18px 'JetBrains Mono',monospace;color:var(--brand-d)}.profile-axis-summary>strong small{font-size:8px;color:var(--soft)}
.profile-axis-track{align-self:center;height:6px;overflow:hidden;border-radius:999px;background:color-mix(in srgb,var(--line) 65%,transparent)}.profile-axis-track>i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--brand),var(--good))}
.profile-axis-summary>em{align-self:center;color:var(--soft);font-size:7.5px;font-style:normal;font-weight:900;text-transform:uppercase}
.profile-axis-inputs{display:none;padding:0 9px 9px}.profile-axis-card.expanded>.profile-axis-inputs{display:block}.profile-axis-inputs>p{margin:0;padding-top:7px;border-top:1px solid var(--line);color:var(--muted);font-size:8.5px;line-height:1.45}
.zone-threat-build{margin-top:8px;padding:7px 10px;border:1px solid color-mix(in srgb,var(--brand) 55%,var(--line));border-radius:8px;background:color-mix(in srgb,var(--brand) 9%,var(--panel));color:var(--brand-d);font:inherit;font-size:9px;font-weight:950;cursor:pointer}.zone-threat-build:hover{background:color-mix(in srgb,var(--brand) 16%,var(--panel))}.zone-threat-build:focus-visible{outline:2px solid var(--brand);outline-offset:2px}
.profile-score-note{margin:9px 0 0;color:var(--soft);font-size:8.5px;line-height:1.45}
.zone-layer-summary{display:grid;gap:9px;margin-bottom:10px;padding:10px;border:1px solid color-mix(in srgb,var(--brand) 38%,var(--line));border-radius:11px;background:var(--panel)}
.zone-layer-head{display:flex;align-items:flex-start;justify-content:space-between;gap:9px}.zone-layer-head>div{display:grid;gap:2px}.zone-layer-head b{color:var(--ink);font-size:10.5px}.zone-layer-head span,.zone-layer-status{color:var(--soft);font-size:8.5px;font-weight:750;line-height:1.35}.zone-layer-status{padding:4px 7px;border:1px solid var(--line);border-radius:999px;white-space:nowrap;background:var(--panel-2)}
.zone-layer-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}.zone-layer-grid article{display:grid;gap:3px;padding:8px;border:1px solid var(--line);border-radius:8px;background:var(--panel-2)}.zone-layer-grid article.combined{border-color:color-mix(in srgb,var(--brand) 55%,var(--line));background:color-mix(in srgb,var(--brand) 7%,var(--panel-2))}.zone-layer-grid span{color:var(--soft);font-size:8px;font-weight:950;text-transform:uppercase}.zone-layer-grid b{font:950 18px 'JetBrains Mono',monospace;color:var(--ink)}.zone-layer-grid b small{font-size:8px;color:var(--soft)}.zone-layer-grid em{font-style:normal;color:var(--muted);font-size:8px;font-weight:750;line-height:1.3}
.zone-exposure-track{display:flex;height:7px;overflow:hidden;border-radius:999px;background:color-mix(in srgb,var(--line) 70%,transparent)}.zone-exposure-track i{height:100%;background:var(--brand)}.zone-exposure-track span{flex:1;background:var(--good)}
.zone-pen-damage{display:grid;gap:7px;padding:10px;border:1px solid color-mix(in srgb,var(--good) 42%,var(--line));border-radius:9px;background:color-mix(in srgb,var(--good) 5%,var(--panel-2))}
.zone-pen-damage-head{display:flex;justify-content:space-between;align-items:center;gap:9px}.zone-pen-damage-head>div{display:grid;gap:2px}.zone-pen-damage-head b{font-size:10px;text-transform:uppercase;letter-spacing:.05em;color:var(--ink)}.zone-pen-damage-head span,.zone-pen-damage>small{font-size:8px;color:var(--soft);line-height:1.4}.zone-pen-damage-head strong{font:950 17px 'JetBrains Mono',monospace;color:var(--good)}
.zone-pen-damage>p{margin:0;font-size:8.5px;line-height:1.4;color:var(--muted)}.zone-pen-damage-rows{display:grid;gap:4px;max-height:198px;overflow:auto}.zone-pen-arm{display:flex;justify-content:space-between;align-items:center;gap:8px;width:100%;padding:7px 8px;border:1px solid var(--line);border-radius:7px;background:var(--panel);color:var(--ink);text-align:left;cursor:pointer}.zone-pen-arm:hover,.zone-pen-arm.on{border-color:var(--brand);background:color-mix(in srgb,var(--brand) 7%,var(--panel))}.zone-pen-arm:focus-visible{outline:2px solid var(--brand);outline-offset:2px}.zone-pen-arm>span{display:grid;gap:2px;min-width:0}.zone-pen-arm>span:last-child{text-align:right;flex-shrink:0}.zone-pen-arm b{font-size:9px}.zone-pen-arm strong{font:900 13px 'JetBrains Mono',monospace}.zone-pen-arm strong small{font-size:7px}.zone-pen-arm small,.zone-pen-arm em{font-size:7.5px;color:var(--soft);font-style:normal;line-height:1.35}
.zone-bvp-label{margin:0;color:var(--muted);font-size:8.5px;line-height:1.45}.zone-bvp-label b{color:var(--ink)}
.zone-offense-readout{display:grid;gap:9px;margin:0 0 10px;padding:10px;border:1px solid color-mix(in srgb,var(--brand) 46%,var(--line));border-radius:11px;background:linear-gradient(135deg,color-mix(in srgb,var(--brand) 8%,var(--panel)),var(--panel))}.zone-offense-readout.pending{color:var(--soft)}
.zone-offense-readout>header{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}.zone-offense-readout>header>div{display:grid;gap:2px}.zone-offense-readout>header b{color:var(--ink);font-size:11px;text-transform:uppercase;letter-spacing:.06em}.zone-offense-readout>header span{color:var(--soft);font-size:8px;font-weight:750}.zone-offense-readout>header strong{font:950 21px 'JetBrains Mono',monospace;color:var(--brand-d)}.zone-offense-readout>header strong small{font-size:8px;color:var(--soft);text-transform:uppercase}
.zone-offense-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}.zone-offense-kpis>span,.zone-offense-outcomes>span{display:grid;gap:2px;padding:7px;border:1px solid var(--line);border-radius:8px;background:var(--panel-2);min-width:0}.zone-offense-kpis small,.zone-offense-outcomes small{color:var(--soft);font-size:7.5px;font-weight:900;text-transform:uppercase}.zone-offense-kpis b,.zone-offense-outcomes b{color:var(--ink);font:900 12px 'JetBrains Mono',monospace}.zone-offense-outcomes{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:5px}.zone-offense-outcomes em{font-size:7px;font-style:normal;font-weight:900;color:var(--soft)}.zone-offense-outcomes .tone-good{border-color:color-mix(in srgb,var(--good) 43%,var(--line))}.zone-offense-outcomes .tone-good em{color:var(--good)}.zone-offense-outcomes .tone-risk{border-color:color-mix(in srgb,var(--bad) 38%,var(--line))}.zone-offense-outcomes .tone-risk em{color:var(--bad)}.zone-offense-readout>p{margin:0;color:var(--muted);font-size:8px;line-height:1.45}
.form-regression-card{display:grid;gap:7px;margin-top:10px;padding:10px;border:1px solid color-mix(in srgb,var(--brand) 35%,var(--line));border-left:3px solid var(--brand);border-radius:10px;background:var(--panel)}.form-regression-card.tone-contact_backed_bounce_back,.form-regression-card.tone-damage_trending_up{border-left-color:var(--good)}.form-regression-card.tone-results_ahead_of_contact{border-left-color:var(--bad)}.form-regression-card>div:first-child{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:8px;align-items:baseline}.form-regression-card>div:first-child b{color:var(--ink);font-size:10px}.form-regression-card>div:first-child span{color:var(--soft);font-size:8px;font-weight:900;text-transform:uppercase}.form-regression-card>div:first-child strong{font:950 17px 'JetBrains Mono',monospace;color:var(--brand-d)}.form-regression-card>div:first-child strong small{font-size:8px;color:var(--soft)}.form-regression-card>p{margin:0;color:var(--muted);font-size:8.5px;line-height:1.45}.form-regression-signals{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}.form-regression-signals>span{display:grid;gap:2px;padding:7px;border:1px solid var(--line);border-radius:7px;background:var(--panel-2)}.form-regression-signals small{color:var(--soft);font-size:7.5px;font-weight:900;text-transform:uppercase}.form-regression-signals b{color:var(--ink);font:850 9px 'JetBrains Mono',monospace}.form-regression-warning{color:var(--soft)!important}

.bvp-damage-lanes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;margin-bottom:10px}
.bvp-damage-lane{display:grid;gap:3px;padding:11px;border:1px solid var(--line);border-radius:10px;background:var(--panel-2)}
.bvp-damage-lane.hunt{border-color:color-mix(in srgb,var(--good) 48%,var(--line));background:color-mix(in srgb,var(--good) 8%,var(--panel))}
.bvp-damage-lane.avoid{border-color:color-mix(in srgb,var(--bad) 38%,var(--line));background:color-mix(in srgb,var(--bad) 6%,var(--panel))}
.bvp-damage-lane small,.bvp-context-metric small{color:var(--soft);font-size:8.5px;font-weight:900;letter-spacing:.07em;text-transform:uppercase}
.bvp-damage-lane b{color:var(--ink);font-size:15px}.bvp-damage-lane span{font:850 11px 'JetBrains Mono',monospace;color:var(--muted)}
.bvp-pitcher-context{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}
.bvp-context-metric{display:grid;gap:2px;padding:9px;border:1px solid var(--line);border-radius:9px;background:var(--panel-2);min-width:0}
.bvp-context-metric b{font:900 15px 'JetBrains Mono',monospace;color:var(--ink)}
.bvp-context-metric span{color:var(--soft);font-size:8.5px;font-weight:700;line-height:1.25}
.bvp-context-note{margin:10px 0 0;color:var(--soft);font-size:10.5px;font-weight:650;line-height:1.45}

@media(max-width:1180px){
  .weather-stat-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
  .zone-offense-outcomes{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:920px){
  .matchup-analysis-grid{grid-template-columns:1fr;grid-template-areas:"spray" "history" "arsenal"}
  .matchup-evidence-grid{grid-template-columns:1fr}
}
@media(max-width:700px){
  .matchup-analysis-grid{grid-template-columns:1fr;grid-template-areas:"spray" "history" "arsenal"}
  .spray-model-controls{grid-template-columns:repeat(2,minmax(0,1fr))}
  .spray-model-controls button{min-height:34px}.weather-stat-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .bvp-damage-lanes{grid-template-columns:1fr}.bvp-pitcher-context{grid-template-columns:repeat(2,minmax(0,1fr))}
  .spray-analysis-card .card-h .note{max-width:100%;text-align:left}
  .spray-model-controls{grid-template-columns:1fr}.park-factor-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.spray-point-detail>section{grid-template-columns:repeat(2,minmax(0,1fr))}
  .profile-axis-grid,.opportunity-axis-grid,.profile-axis-list,.zone-layer-grid{grid-template-columns:1fr}
  .zone-offense-kpis,.zone-offense-outcomes{grid-template-columns:repeat(2,minmax(0,1fr))}
  .form-regression-signals{grid-template-columns:repeat(2,minmax(0,1fr))}.form-regression-card>div:first-child{grid-template-columns:1fr auto}.form-regression-card>div:first-child span{grid-column:1/-1}
}
@media(max-width:430px){.hitter-proof-grid{grid-template-columns:1fr}.mc-bars{flex-wrap:wrap}.mc-bar{min-width:42%}}

/* Matchup filter controls keep the rail's existing responsive width. */
.deck-group select {width:100%;max-width:100%;padding:10px;border:1px solid var(--line);border-radius:10px;background:var(--panel-2);color:var(--ink);font:inherit;margin:6px 0 12px}
#deckDataNote,.metric-detail {font-size:12px;line-height:1.5;color:var(--muted)}
.metric-info {min-width:26px;min-height:26px}
.h2h-games {max-height:420px;overflow:auto}