/* xPEKT College portal (owner 2026-10-20/21): soft grey page (dark mode below), white cards, quiet tables, green/red only for clear gaps */
:root {
  /* light (owner 2026-10-21, after contra.com): a soft cool-grey page, white cards with hairline borders, blue-black ink */
  --bg: #F2F4F7; --card: #FFFFFF; --ink: #14171F; --ink2: #677084; --ink3: #6E7687; --line: #E5E7EB; --line2: #D0D4DC;
  --fill: #F2F4F7; --good: #2f7d32; --bad: #b3261e; --accent: #14171F;
  --seg: #E4E7EC; --seg-on: #FFFFFF;   /* switch track and its picked button: a step darker than the page, so each switch reads as one control (owner 2026-10-27) */
  --sans: -apple-system, BlinkMacSystemFont, "Inter", "Helvetica Neue", Arial, sans-serif;
}
/* dark (owner 2026-10-21, after cosmos.network): true black, charcoal surfaces a step up, white type at three strengths, hairline lines.
   Set by the moon / sun button or the device (js/theme.js -> <html data-theme>) */
:root[data-theme="dark"] { --bg: #000000; --card: #161616; --ink: #FFFFFF; --ink2: rgba(255, 255, 255, 0.76); --ink3: rgba(255, 255, 255, 0.58);
  --line: rgba(255, 255, 255, 0.09); --line2: rgba(255, 255, 255, 0.18); --fill: #1E1F20; --good: #5cc46a; --bad: #ff7b72; --accent: #FFFFFF; --seg: #161616; --seg-on: #333436; color-scheme: dark; }
* { box-sizing: border-box; }
html, body { margin: 0; background: var(--bg); color: var(--ink); font: 14px/1.45 var(--sans); }
a { color: inherit; }
.cb-top { position: sticky; top: 0; z-index: 5; display: flex; align-items: center; gap: 18px; padding: 10px 20px; background: color-mix(in srgb, var(--card) 90%, transparent);
  backdrop-filter: blur(10px); border-bottom: 1px solid var(--line); }
.cb-nav { display: flex; gap: 4px; }
.cb-nav a { text-decoration: none; padding: 7px 12px; border-radius: 999px; font-weight: 600; color: var(--ink2); }
.cb-nav a.on { background: var(--school-accent, var(--accent)); color: var(--school-on, var(--bg)); }
.cb-who { margin-left: auto; display: flex; align-items: center; gap: 10px; }
.cb-who select { font: inherit; padding: 6px 10px; border-radius: 999px; border: 1px solid var(--line2); background: var(--card); color: var(--ink); }
.cb-acct { display: inline-flex; align-items: center; gap: 6px; text-decoration: none; color: var(--ink2); font-weight: 600; }
.cb-acct .ti { font-size: 20px; }
.cb-main { max-width: 1120px; margin: 0 auto; padding: 18px 20px 48px; }
.cb-head h1, .cb-player h1 { font-size: 24px; font-weight: 700; margin: 8px 0 4px; letter-spacing: -0.02em; }
.cb-lede { color: var(--ink2); margin: 0 0 16px; max-width: 52em; }
.cb-card { background: var(--card); border: 1px solid var(--line); border-radius: 16px; padding: 16px 18px; margin: 0 0 14px; }
.cb-card h2 { font-size: 15px; margin: 0 0 8px; }
.cb-dim { color: var(--ink3); font-weight: 500; font-size: 12.5px; margin-left: 6px; }
.cb-note { color: var(--ink3); font-size: 12px; margin: 8px 0 0; }
.cb-pad { margin: 4px 0; }
.cb-empty { padding: 60px 0; text-align: center; color: var(--ink2); }
table { width: 100%; border-collapse: collapse; font-size: 13.5px; }
th { text-align: right; font-size: 11.5px; font-weight: 600; color: var(--ink3); padding: 6px 8px; white-space: nowrap; user-select: none; }
th:first-child, td:first-child { text-align: left; }
th.sortable { cursor: pointer; }
th.on { color: var(--ink); }
th.on::after { content: " ↓"; }
td { padding: 9px 8px; border-top: 0.5px solid var(--line); white-space: nowrap; }
td.num { text-align: right; font-variant-numeric: tabular-nums; }
td.big { font-weight: 700; font-size: 15px; }
td.dim { color: var(--ink3); }
td.good { color: var(--good); font-weight: 700; }
td.bad { color: var(--bad); font-weight: 700; }
.cb-board { padding: 6px 0; overflow-x: auto; }   /* no side padding: the pinned name column sits flush (owner 2026-10-21); edge cells carry it */
.cb-board tbody tr { cursor: pointer; }
.cb-board tbody tr:hover td { background: color-mix(in srgb, var(--fill) 70%, var(--card)); }
.cb-back { display: inline-flex; align-items: center; gap: 2px; text-decoration: none; color: var(--ink2); font-weight: 600; margin: 2px 0 6px; }
.cb-player { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.cb-player .cb-dim { margin: 0; }
.cb-kpis { display: flex; gap: 8px; flex-wrap: wrap; }
.cb-kpis div { background: var(--card); border: 0.5px solid var(--line); border-radius: 12px; padding: 8px 14px; min-width: 84px; text-align: center; }
.cb-kpis.left div { text-align: left; }
.cb-kpis b { display: block; font-size: 20px; font-variant-numeric: tabular-nums; }
.cb-kpis span { font-size: 11.5px; color: var(--ink3); }
.cb-card .cb-kpis div { border: 0; background: var(--fill); }
.cb-levers { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.cb-levers li { display: flex; gap: 10px; align-items: flex-start; font-size: 14.5px; line-height: 1.4; }
.cb-levers .ti { font-size: 18px; flex: none; margin-top: 1px; }
.cb-levers .up .ti { color: var(--good); }
.cb-levers .down .ti { color: var(--bad); }
.cb-two { display: grid; grid-template-columns: minmax(300px, 380px) 1fr; gap: 14px; align-items: start; }
.cb-two .cb-card { margin: 0; overflow-x: auto; }
@media (max-width: 860px) { .cb-two { grid-template-columns: 1fr; } }
.cb-move { width: 100%; max-width: 340px; display: block; margin: 0 auto; }
.cb-move .g { stroke: var(--line); stroke-width: 1; }
.cb-move .z { stroke: var(--line2); }
.cb-move .ax { font-size: 10px; fill: var(--ink3); }
.cb-legend { display: flex; flex-wrap: wrap; gap: 6px 12px; justify-content: center; margin-top: 6px; font-size: 12px; color: var(--ink2); }
.cb-legend i, .cb-dot { display: inline-block; width: 9px; height: 9px; border-radius: 50%; margin-right: 6px; vertical-align: 0; }
.cb-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.cb-seg { display: inline-flex; background: var(--seg); border-radius: 10px; padding: 3px; }
.cb-seg button { font: inherit; font-weight: 600; font-size: 13px; border: 0; background: transparent; color: var(--ink2); padding: 6px 12px; border-radius: 8px; cursor: pointer; }
.cb-seg button.on { background: var(--seg-on); color: var(--ink); box-shadow: 0 1px 2px rgba(0, 0, 0, 0.08); }
.cb-zone { display: flex; flex-direction: column; align-items: center; gap: 10px; margin: 10px 0 4px; }
.zg { display: grid; grid-template-columns: repeat(3, 84px); grid-template-rows: repeat(3, 70px); gap: 3px; padding: 3px; border: 2px solid var(--ink2); border-radius: 4px; }
.zc { display: flex; flex-direction: column; align-items: center; justify-content: center; border-radius: 3px; }
.zc b { font-size: 16px; font-variant-numeric: tabular-nums; }
.zc span { font-size: 10.5px; color: var(--ink3); }
.zc.small { background: repeating-linear-gradient(45deg, transparent 0 6px, var(--fill) 6px 7px) !important; }
.zo { font-size: 13px; color: var(--ink2); }
.cb-drop { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 26px; margin: 0 0 14px; border: 1.5px dashed var(--line2); border-radius: 14px;
  background: var(--card); cursor: pointer; text-align: center; }
.cb-drop .ti { font-size: 28px; color: var(--ink2); }
.cb-drop.over { border-color: var(--good); background: color-mix(in srgb, var(--good) 8%, var(--card)); }
.cb-flags { margin: 10px 0 0; padding-left: 1.1rem; color: var(--ink2); }
.cb-flags .ok { color: var(--good); list-style: none; margin-left: -1.1rem; }
.cb-auth { min-height: 80vh; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 22px; }
.cb-auth-brand { display: flex; flex-direction: column; align-items: center; gap: 8px; }
.cb-auth-brand svg { height: 40px; width: auto; color: var(--ink); }
.cb-form { display: flex; flex-direction: column; gap: 12px; width: 100%; max-width: 340px; }
.cb-form.narrow { max-width: 420px; }
.cb-form label { display: flex; flex-direction: column; gap: 5px; font-size: 12.5px; font-weight: 600; color: var(--ink2); }
.cb-form input { font: inherit; font-size: 16px; padding: 10px 12px; border-radius: 10px; border: 1px solid var(--line2); background: var(--card); color: var(--ink); }
.cb-form button, .cb-link { font: inherit; font-weight: 650; padding: 11px 12px; border-radius: 10px; border: 0; background: var(--school-accent, var(--accent)); color: var(--school-on, var(--bg)); cursor: pointer; }
.cb-link { background: transparent; color: var(--ink2); padding: 8px 0; }
.cb-err { min-height: 1.2em; font-size: 13px; color: var(--bad); }
.cb-err.ok { color: var(--good); }
@media (max-width: 640px) {
  .cb-top { gap: 10px; padding: 8px 12px; flex-wrap: wrap; }
  .cb-acct span { display: none; }
  .cb-main { padding: 12px 12px 40px; }
  .zg { grid-template-columns: repeat(3, 70px); grid-template-rows: repeat(3, 60px); }
}
/* boards on a phone: the name column stays put while the numbers scroll; pitch / PA counts step aside */
.cb-board th:first-child, .cb-board td:first-child { position: sticky; left: 0; background: var(--card); z-index: 1; }
.cb-board tbody tr:hover td:first-child { background: color-mix(in srgb, var(--fill) 70%, var(--card)); }
@media (max-width: 640px) { .cb-board td.dim, .cb-board th[data-k="xw"], .cb-board th[data-k="pitches"], .cb-board th[data-k="pa"] { display: none; } }
/* phones: the board scrolls sideways, so the name column needs its own width (fixed layout gave it 0 and names ran over the grades) */
@media (max-width: 640px) { .cb-board th:first-child { width: 150px; } .cb-board td:first-child { overflow: hidden; text-overflow: ellipsis; } }

/* grades-first boards and player pages (owner 2026-10-20) */
th.txt { text-align: left; }
td.pill { cursor: pointer; }
td.pill:hover { text-decoration: underline; text-underline-offset: 3px; }
.cb-na { color: var(--ink3); font-size: 12px; font-weight: 500; }
.cb-hero { text-align: right; }
.cb-hero b { display: block; font-size: 44px; line-height: 1; letter-spacing: -0.02em; font-variant-numeric: tabular-nums; }
.cb-hero span { font-size: 12px; font-weight: 650; letter-spacing: 0.08em; text-transform: uppercase; color: var(--ink3); }
.cb-pills { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
@media (max-width: 640px) { .cb-pills { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.cb-pill { font: inherit; text-align: left; display: flex; flex-direction: column; gap: 4px; padding: 10px 12px; border-radius: 12px; border: 0.5px solid var(--line);
  background: var(--fill); color: var(--ink); cursor: pointer; }
.cb-pill:hover { border-color: var(--line2); }
.cb-pill.on { background: var(--card); border-color: var(--ink); box-shadow: 0 0 0 1px var(--ink) inset; }
.cb-pill[disabled] { cursor: default; opacity: 0.6; }
.cb-pill .ph { font-size: 12px; font-weight: 650; color: var(--ink2); }
.cb-pill b { font-size: 24px; font-variant-numeric: tabular-nums; }
.pbar { position: relative; height: 4px; border-radius: 2px; background: var(--line); overflow: visible; }
.pbar i { position: absolute; left: 0; top: 0; bottom: 0; border-radius: 2px; background: var(--ink2); }
.pbar em { position: absolute; left: 50%; top: -3px; width: 1px; height: 10px; background: var(--ink3); }   /* MLB average */
.cb-drill { margin-top: 12px; padding-top: 10px; border-top: 0.5px solid var(--line); }
.cb-drill .ch { font-weight: 700; margin-bottom: 4px; }
.cb-std summary { display: flex; align-items: baseline; gap: 10px; cursor: pointer; list-style: none; }
.cb-std summary::-webkit-details-marker { display: none; }
.cb-std summary h2 { margin: 0; }
.cb-std summary::after { content: "Show"; margin-left: auto; font-size: 12.5px; font-weight: 650; color: var(--ink2); }
.cb-std[open] summary::after { content: "Hide"; }
.cb-std[open] summary .cb-dim { display: none; }
.cb-std .cb-kpis { margin-top: 12px; }
.cb-pills { scroll-margin-top: 84px; }   /* opened from a board grade: land below the sticky top bar */
/* zone map: 2 x 2 or 3 x 3, his inside / away marked; the signal line on Glitch+ */
.zwrap { display: flex; align-items: center; gap: 10px; }
.zlab { font-size: 11px; font-weight: 650; letter-spacing: 0.08em; text-transform: uppercase; color: var(--ink3); writing-mode: vertical-rl; transform: rotate(180deg); min-width: 14px; }
.zg.n2 { grid-template-columns: repeat(2, 120px); grid-template-rows: repeat(2, 100px); }
.zg.n3 { grid-template-columns: repeat(3, 84px); grid-template-rows: repeat(3, 70px); }
.zc span { font-size: 10.5px; color: var(--ink3); }
.cb-seg button:focus { outline: none; }
.cb-seg button:focus-visible { outline: 2px solid var(--ink2); outline-offset: 1px; }
.cb-signal { display: flex; flex-wrap: wrap; gap: 4px 10px; align-items: baseline; padding: 10px 12px; margin: 6px 0 8px; border-radius: 10px; background: var(--fill); }
.cb-signal span { color: var(--ink2); font-size: 13px; }
td.wrap { white-space: normal; color: var(--ink2); }
.cb-est { font-size: 9.5px; font-weight: 650; letter-spacing: 0.06em; text-transform: uppercase; color: var(--ink3); margin-left: 3px; vertical-align: 2px; }
/* Glitch+: arm angle + signal arrow beside its description */
.cb-glitch { display: flex; align-items: center; gap: 14px; margin: 6px 0 8px; padding: 6px 12px; border-radius: 12px; background: var(--fill); }
.cb-glitch .cb-signal { background: transparent; margin: 0; padding: 0; }
.cb-signal.col { flex-direction: column; align-items: flex-start; gap: 4px; }
.cb-arm { width: 260px; flex: none; }
.cb-arm .gnd { stroke: var(--line2); stroke-width: 1; }
.cb-arm .body { fill: none; stroke: var(--ink3); stroke-width: 2; }
.cb-arm .bodyl { stroke: var(--ink3); stroke-width: 2.5; stroke-linecap: round; }
.cb-arm .armline { stroke: var(--ink); stroke-width: 3.5; stroke-linecap: round; }
.cb-arm .rel { fill: var(--ink); stroke: var(--card); stroke-width: 2; }
.cb-arm .arrow { stroke: #b3261e; stroke-width: 3; stroke-linecap: round; }
.cb-arm .ahead { fill: #b3261e; }
.cb-arm .arrow.weak { stroke: var(--ink3); }
.cb-arm .ahead.weak { fill: var(--ink3); }
.cb-arm .sd { font-size: 13px; font-weight: 700; fill: var(--ink); }
.cb-arm .cap { font-size: 10px; fill: var(--ink3); }
@media (max-width: 640px) { .cb-glitch { flex-direction: column; align-items: flex-start; } }
.cb-glitch { flex-direction: column; align-items: flex-start; gap: 4px; padding: 10px 14px 12px; }   /* drawing, then its description below */
/* movement chart: arm-slot line + Glitch+ signal arrow (owner 2026-10-20) */
.cb-move .slotl { stroke: var(--ink2); stroke-width: 2; stroke-dasharray: 5 4; }
.cb-move .slotp { fill: var(--card); stroke: var(--ink2); stroke-width: 2; }
.cb-move .sigl { stroke: #b3261e; stroke-width: 3; stroke-linecap: round; }
.cb-move .sigh { fill: #b3261e; }
.cb-move .sigl.weak { stroke: var(--ink3); }
.cb-move .sigh.weak { fill: var(--ink3); }
.cb-move .sigt { font-size: 11px; font-weight: 700; fill: #b3261e; paint-order: stroke; stroke: var(--card); stroke-width: 3px; }
.cb-signal a { color: var(--ink); font-weight: 600; }
/* bat sensors */
.cb-mini { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 600; color: var(--ink2); }
.cb-mini select, .cb-row select { font: inherit; font-size: 13px; padding: 5px 8px; border-radius: 8px; border: 0.5px solid var(--line2); background: var(--card); color: var(--ink); }
.cb-btn { display: inline-flex; align-items: center; padding: 7px 12px; border-radius: 10px; background: var(--school-accent, var(--accent)); color: var(--school-on, var(--bg)); font-weight: 650; font-size: 13px; cursor: pointer; }
.cb-match { display: flex; flex-wrap: wrap; gap: 8px 14px; align-items: center; padding: 10px 12px; margin: 4px 0 10px; border-radius: 10px; background: var(--fill); font-size: 13px; }
.cb-sens { margin-top: 10px; }
.cb-sens .ch { font-weight: 700; margin-bottom: 4px; }
/* Grid v1 */
.cb-banner { font-size: 12.5px; color: var(--ink2); background: var(--fill); border-radius: 10px; padding: 8px 12px; margin: 0 0 12px; }
.cb-gridctl { display: flex; flex-wrap: wrap; gap: 10px 16px; align-items: center; }
.cb-chips { display: flex; flex-wrap: wrap; gap: 6px; width: 100%; }
.cb-chip { font: inherit; font-size: 12.5px; padding: 5px 10px; border-radius: 999px; border: 0.5px solid var(--line2); background: var(--card); color: var(--ink2); cursor: pointer; }
.cb-chip.on { background: var(--school-accent, var(--accent)); color: var(--school-on, var(--bg)); border-color: var(--accent); }
.cb-gridwrap { overflow-x: auto; padding: 6px; }
.cb-grid { border-collapse: separate; border-spacing: 2px; width: auto; }
.cb-grid th { font-size: 12px; font-weight: 650; color: var(--ink); text-align: center; padding: 6px 8px; white-space: nowrap; }
.cb-grid th a { color: inherit; text-decoration: none; }
.cb-grid th span { display: block; font-size: 10.5px; font-weight: 500; color: var(--ink3); }
.cb-grid th.txt { text-align: left; position: sticky; left: 0; background: var(--card); z-index: 1; }
.cb-grid th.corner { font-size: 10.5px; color: var(--ink3); font-weight: 600; }
.cb-grid td { text-align: center; font-variant-numeric: tabular-nums; font-weight: 650; font-size: 13px; padding: 8px 10px; border-radius: 6px; border: 0; min-width: 54px; }

/* pillar colors: css/pillars.css (one place, every college page) */
.cb-pill { background: var(--card); border-top: 4px solid var(--pc, var(--line)); }
.cb-pill .pbar i { background: var(--pc, var(--ink2)); }
.cb-pill.on { border-color: var(--pc, var(--ink)); box-shadow: 0 0 0 1px var(--pc, var(--ink)) inset; border-top-width: 4px; }
.cb-drill.pl-damage_plus, .cb-drill.pl-stuff_plus, .cb-drill.pl-decision_plus, .cb-drill.pl-location_plus,
.cb-drill.pl-contact_plus, .cb-drill.pl-arsenal_plus, .cb-drill.pl-swing_plus, .cb-drill.pl-glitch_plus { border-top: 2px solid var(--pc); }
.cb-drill .cb-signal { border-left: 4px solid var(--pc, var(--line2)); }
/* boards: every grade column the same width (the name column takes the rest); each pillar's color line stops short of its neighbours */
.cb-board table { table-layout: fixed; width: 100%; }
.cb-board th.gcol { width: 118px; }
.cb-board th:last-child:not(.gcol) { width: 96px; }
.cb-board th.plc { position: relative; color: var(--ink); }
/* (pillar-color underlines removed from the boards, owner 2026-10-21) */
/* Glitch+ content (the signal on the arm / movement chart) wears Glitch+'s color */
.cb-arm .ahead, .cb-move .sigh { fill: var(--pl-d) !important; }
.cb-move .sigt { fill: var(--pl-d-ink) !important; }
/* ---- Data tab: one tile per source (owner 2026-10-20) */
.cb-sources { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 12px; }
.cb-source { position: relative; display: grid; grid-template-columns: 44px 1fr 20px; grid-template-rows: auto auto auto; column-gap: 12px; row-gap: 2px;
  padding: 16px; border-radius: 14px; border: 0.5px solid var(--line2); background: var(--card); color: var(--ink); text-decoration: none; }
.cb-source:hover { border-color: var(--ink); }
.cb-source > .ti:first-child { grid-row: 1 / span 3; font-size: 26px; width: 44px; height: 44px; border-radius: 12px; background: var(--fill); display: flex;
  align-items: center; justify-content: center; }
.cb-source .sn { font-weight: 700; font-size: 16px; }
.cb-source .ss { color: var(--ink2); font-size: 13px; }
.cb-source .st { color: var(--ink3); font-size: 12.5px; margin-top: 4px; }
.cb-source .sa { grid-column: 2; justify-self: start; margin-top: 6px; font-size: 12px; font-weight: 650; color: #b3261e; background: rgba(179, 38, 30, .08);
  padding: 3px 8px; border-radius: 999px; }
.cb-source .go { grid-column: 3; grid-row: 1 / span 3; align-self: center; color: var(--ink3); font-size: 18px; }
.cb-source.off .sn, .cb-source.off > .ti:first-child { color: var(--ink3); }
.cb-steps { margin: 4px 0 12px; padding-left: 20px; line-height: 1.6; }
.cb-steps li { margin-bottom: 4px; }
.cb-state { display: inline-flex; align-items: center; gap: 8px; font-size: 14px; padding: 6px 12px; border-radius: 999px; background: var(--fill); margin-bottom: 8px; }
.cb-state.off { color: var(--ink2); }
.cb-state .ti { font-size: 18px; }
.cb-theme { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 50%; border: 0.5px solid var(--line2);
  background: transparent; color: var(--ink2); cursor: pointer; font-size: 18px; }
.cb-theme:hover { color: var(--ink); border-color: var(--ink); }
:root[data-theme="dark"] .cb-source .sa { color: #ff7b72; background: rgba(255, 123, 114, .12); }
/* brand lockup (owner 2026-10-20: "looks kinda cheap with college"): COLLEGE set small under the wordmark, spread to its width; then the
   school's own logo + name after a hairline (when the school has sent one) */
.cb-brand { display: flex; align-items: center; text-decoration: none; }
.cb-lock { display: inline-flex; flex-direction: column; gap: 4px; }
.cb-logo svg { height: 21px; width: auto; display: block; color: var(--ink); }
.cb-sub { display: flex; justify-content: space-between; padding: 0 1px; font-size: 8.5px; font-weight: 600; line-height: 1; color: var(--ink3); letter-spacing: 0; text-transform: none; }
.cb-sub i { font-style: normal; }
.cb-school { display: flex; align-items: center; gap: 10px; padding-left: 16px; border-left: 1px solid var(--line2); height: 34px; }
.cb-school[hidden] { display: none; }
.cb-school img { height: 32px; width: auto; display: block; }
.cb-school img[hidden] { display: none; }
.cb-school span { font-weight: 650; font-size: 14.5px; color: var(--ink); white-space: nowrap; }
@media (max-width: 900px) { .cb-school span { display: none; } }
/* the school's logo, large and faded behind the portal's pages (not the Grid: it needs a clean page) */
/* a watermark over the page, like a mark printed on paper: faint enough to read through, under the top bar and any pop-up */
.cb-watermark { position: fixed; inset: 0; pointer-events: none; z-index: 2; background-repeat: no-repeat; background-position: center 60%;
  background-size: min(54vw, 580px) auto; opacity: 0.045; mix-blend-mode: multiply; }
:root[data-theme="dark"] .cb-watermark { opacity: 0.06; mix-blend-mode: screen; }
.cb-main { position: relative; z-index: 1; }

/* boards, like the MLB leaderboards (owner 2026-10-21): the sorted column wears a light tint; the arrow says which way; a short
   definition when the mouse rests on a column title (mouse only - a tap sorts); a finger on a row highlights it; Show more */
.cb-board th.on::after { content: none; }
.cb-board th.on, .cb-board td.cb-on { background: color-mix(in srgb, var(--fill) 60%, var(--card)); }
.cb-board th.on { border-radius: 10px 10px 0 0; }
:root[data-theme="dark"]:not(:has(.grid-wrap.hc)) .cb-board th.on, :root[data-theme="dark"]:not(:has(.grid-wrap.hc)) .cb-board td.cb-on { background: rgba(255, 255, 255, 0.07); }
.cb-board tbody tr:active td { background: color-mix(in srgb, var(--fill) 70%, var(--card)); }
.cb-board tbody tr:hover td.cb-on, .cb-board tbody tr:active td.cb-on { background: color-mix(in srgb, var(--fill) 100%, var(--card)); }
.cb-board th[data-tip] { position: relative; }
@media (hover: hover) {
  .cb-board th[data-tip]::after { content: attr(data-tip); position: absolute; right: 0; top: calc(100% + 4px); z-index: 30; width: 220px;
    padding: 8px 10px; border-radius: 8px; font-size: 12px; font-weight: 400; line-height: 1.45; text-align: left; white-space: normal;
    text-transform: none; letter-spacing: 0; background: var(--ink); color: var(--card); box-shadow: 0 4px 14px rgba(0, 0, 0, 0.18);
    opacity: 0; pointer-events: none; transform: translateY(-2px); transition: opacity 0.12s, transform 0.12s; }
  .cb-board th[data-tip]:hover::after { opacity: 1; transform: none; transition-delay: 0.3s; }
  .cb-board th.txt[data-tip]::after { left: 0; right: auto; }
}
.cb-more { display: flex; gap: 8px; justify-content: center; margin: 12px 0 4px; }
.cb-more button { border: 0; border-radius: 999px; padding: 8px 14px; background: var(--fill); color: var(--ink); font: 600 13px inherit; cursor: pointer; }

/* Data page: the export for the school's own platform (owner 2026-10-21) */
.cb-export { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 14px; }
.cb-export p { margin: 4px 0 0; font-size: 13.5px; max-width: 560px; }
.cb-export .cb-game { flex: none; text-decoration: none; }
@media (max-width: 640px) { .cb-export { flex-direction: column; align-items: flex-start; } }

/* Pitchers page: By pitcher / By pitch (owner 2026-10-21) */
/* owner 2026-10-27 ("clunky ... two buttons are picked in the same row"): the two switches sit on one line at the same height, each in its
   own visible track, with room between them so they read as two choices */
.cb-head > .cb-row { margin: 14px 0 6px; justify-content: flex-start; gap: 10px 20px; }
.cb-board th.ncol { width: 84px; }   /* By pitch: number columns keep a width, so phones scroll sideways instead of squeezing */
.cb-board th:first-child, .cb-board td:first-child { padding-left: 18px; }
.cb-board th:last-child, .cb-board td:last-child { padding-right: 18px; }
@media (max-width: 640px) { .cb-board th:first-child, .cb-board td:first-child { padding-left: 7px; } .cb-board th:last-child, .cb-board td:last-child { padding-right: 12px; } }

/* data sources (owner 2026-10-22: modular sources, TrackMan API) */
.cb-source.on .st { color: var(--ink2); }
.cb-dot { display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: #2f7d32; margin-right: 6px; vertical-align: 1px; }
.cb-state.on { color: #2f7d32; }
.src-form { display: grid; gap: 10px; max-width: 420px; margin-top: 12px; }
.src-form.row { display: flex; flex-direction: row; flex-wrap: wrap; align-items: flex-end; gap: 10px; max-width: none; }
.src-form label { display: flex; flex-direction: column; gap: 4px; font-size: 13px; font-weight: 600; color: var(--ink2); }
.src-form input { font: inherit; font-weight: 500; padding: 8px 10px; border-radius: 8px; border: 1px solid var(--line2, rgba(0,0,0,.2)); background: var(--card, #fff); color: var(--ink); min-width: 0; }
.src-btn { font: inherit; font-size: 14px; font-weight: 650; display: inline-flex; align-items: center; gap: 6px; padding: 8px 14px; border-radius: 999px;
  border: 1px solid var(--school-accent, var(--ink)); background: var(--school-accent, var(--ink)); color: var(--school-on, var(--bg, #fff)); cursor: pointer; justify-self: start; }
.src-btn.ghost { background: transparent; color: var(--ink); border-color: var(--line2, rgba(0,0,0,.25)); }
.cb-prog { height: 8px; border-radius: 999px; background: var(--fill); overflow: hidden; margin: 6px 0; }
.cb-prog span { display: block; height: 100%; background: var(--ink); transition: width .6s ease; }
.cb-warn { color: #b3261e; font-weight: 600; }
/* pitcher page video (owner 2026-10-22: Edgertronic) */
.cb-vid { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: 12px; }
.cb-vid video { width: 100%; border-radius: 10px; background: #000; max-height: 420px; }
.cb-vlist { display: flex; flex-direction: column; gap: 6px; max-height: 420px; overflow-y: auto; }
.cb-vitem { text-align: left; font: inherit; padding: 8px 10px; border-radius: 10px; border: 1px solid var(--line, rgba(0,0,0,.12)); background: var(--card); color: var(--ink); cursor: pointer; display: flex; flex-direction: column; gap: 2px; }
.cb-vitem span { font-size: 12px; color: var(--ink3); }
.cb-vitem.on { border-color: var(--school-accent, var(--ink)); box-shadow: inset 0 0 0 1px var(--school-accent, var(--ink)); }
@media (max-width: 700px) { .cb-vid { grid-template-columns: 1fr; } .cb-vlist { max-height: 220px; } }

/* coach scouting reads (2026-10-23) */
.cb-form.wide { max-width: 640px; }
.cb-form textarea { font: inherit; font-size: 16px; padding: 10px 12px; border-radius: 10px; border: 1px solid var(--line2); background: var(--card); color: var(--ink); resize: vertical; }
.cb-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
@media (max-width: 640px) { .cb-form-row { grid-template-columns: 1fr; } }
.cb-row-btns { display: flex; gap: 10px; flex-wrap: wrap; }
.cb-row-btns button.ghost, .cb-form button.ghost { background: transparent; color: var(--ink2); border: 1px solid var(--line2); }
.cb-warn-line { color: var(--ink2); font-size: 13px; margin: 0; min-height: 1em; }
.cb-scout-cta { display: flex; gap: 14px; align-items: center; justify-content: space-between; flex-wrap: wrap; }
.cb-scout-cta > div { flex: 1 1 320px; }
.cb-scout-name { font-size: 22px; margin: 0 0 2px; }
.cb-tag { display: inline-block; margin-top: 6px; font-size: 11px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; padding: 3px 8px;
  border-radius: 999px; background: var(--fill); color: var(--ink2); }
.cb-scout-comps { margin: 12px 0 0; }
.cb-scout-got { margin: 10px 0; font-size: 13.5px; }
.cb-scout-got ul { margin: 6px 0 0; padding-left: 18px; color: var(--ink2); }
.cb-scout-q { margin: 8px 0 14px; padding-left: 20px; }
.cb-scout-q li { margin: 4px 0; }
.cb-rate { width: 70px; font: inherit; font-size: 16px; padding: 6px 8px; border-radius: 8px; border: 1px solid var(--line2); background: var(--card); color: var(--ink); text-align: center; }
.cb-rate.bad { border-color: #d22d49; }
tr.click { cursor: pointer; }

/* "early read" (owner 2026-10-24): a pitch under the sample its type needs for Stuff+ to settle */
.cb-early { display: inline-block; margin-left: 6px; padding: 1px 6px; border-radius: 999px; font: 600 10.5px/1.5 var(--font-sans, inherit); color: var(--ink3); background: color-mix(in oklab, var(--ink3) 14%, transparent); vertical-align: 1px; white-space: nowrap; }

/* the MLB site's Hot Zones player maps on the portal pages (owner 2026-10-25): /shared-css/zones.css draws them with the MLB tokens; map ours onto them */
.cb-zbridge { --color-text-primary: var(--ink); --color-text-secondary: var(--ink2); --color-text-tertiary: var(--ink3); --color-bg-primary: var(--card);
  --color-bg-secondary: var(--bg); --color-bg-tertiary: var(--fill); --color-border-tertiary: var(--line); --color-border-secondary: var(--line2);
  --ui-fill: var(--fill); --ui-ink: var(--ink); --ui-on-ink: var(--card); --font-sans: var(--sans); }
.cb-zbridge .mx-panel-card { background: transparent; border: 0; padding: 0; margin: 0; }
.cb-zbridge .mx-note { font-size: 11px; color: var(--ink3); line-height: 1.5; margin-top: 4px; }

/* league scope + Transfer Portal + Getting started (owner 2026-10-26) */
.cb-scope { display: inline-flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.cb-scope select { font: inherit; font-size: 13px; padding: 6px 8px; border-radius: 8px; border: 0.5px solid var(--line2); background: var(--card); color: var(--ink); max-width: 240px; }
.cb-head .cb-row { justify-content: flex-start; margin-top: 8px; }
.cb-filters { margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--line); display: flex; flex-direction: column; gap: 10px; }
.cb-filters .ch { font-size: 12px; font-weight: 700; color: var(--ink3); text-transform: uppercase; letter-spacing: 0.06em; }
.cb-filters .cb-row { justify-content: flex-start; }
.cb-filters select { font: inherit; font-size: 13px; padding: 6px 8px; border-radius: 8px; border: 0.5px solid var(--line2); background: var(--card); color: var(--ink); max-width: 220px; }
.cb-filters .cb-mini { flex-wrap: wrap; gap: 10px; }
.cb-filters .cb-mini label { display: inline-flex; align-items: center; gap: 5px; }
.cb-filters input[type="number"] { font: inherit; font-size: 13px; width: 64px; padding: 5px 6px; border-radius: 8px; border: 0.5px solid var(--line2); background: var(--card); color: var(--ink); }
.cb-filters .cb-chips { align-items: center; }
.cb-row-btns button { font: inherit; font-weight: 650; font-size: 13px; padding: 8px 14px; border-radius: 10px; border: 0; background: var(--school-accent, var(--accent)); color: var(--school-on, var(--bg)); cursor: pointer; }
.cb-picks { list-style: none; padding: 0; margin: 12px 0 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 12px; counter-reset: pick; }
.cb-picks > li { position: relative; display: flex; flex-direction: column; gap: 6px; padding: 14px 16px 14px 44px; margin: 0; counter-increment: pick; }
.cb-picks > li::before { content: counter(pick); position: absolute; left: 14px; top: 14px; width: 22px; height: 22px; border-radius: 50%; display: grid; place-items: center;
  font-size: 12px; font-weight: 700; background: var(--fill); color: var(--ink2); }
.cb-picks a { color: var(--ink); text-decoration: none; font-size: 15px; }
.cb-picks a:hover { text-decoration: underline; }
.cb-picks ul { margin: 2px 0; padding-left: 16px; font-size: 13px; color: var(--ink2); display: flex; flex-direction: column; gap: 3px; }
.cb-pick-g { display: flex; align-items: baseline; gap: 8px; }
.cb-pick-g b { font-size: 24px; font-weight: 700; letter-spacing: -0.02em; }
.cb-pick-g span { font-size: 12.5px; color: var(--ink3); }
.cb-plist { list-style: none; padding: 0; margin: 8px 0; display: flex; flex-direction: column; gap: 4px; font-size: 13.5px; }
.cb-plist a { color: var(--ink); }
.cb-steps { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 12px; }
.cb-step { display: flex; gap: 14px; align-items: flex-start; margin: 0; }
.cb-step .n { flex: none; width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; font-weight: 700; font-size: 13px; background: var(--fill); color: var(--ink2); }
.cb-step.done .n { background: var(--school-accent, var(--accent)); color: var(--school-on, var(--bg)); }
.cb-step h2 { margin-top: 3px; }
.cb-step p { margin: 6px 0; font-size: 14px; }
.cb-form .cb-seg button { background: transparent; color: var(--ink2); padding: 6px 12px; font-size: 13px; border-radius: 8px; }
.cb-form .cb-seg button.on { background: var(--seg-on); color: var(--ink); box-shadow: 0 1px 2px rgba(0, 0, 0, 0.08); }
.cb-years { margin: 0 0 12px; }
.cb-years a { font-weight: 600; font-size: 13px; color: var(--ink2); padding: 6px 12px; border-radius: 8px; text-decoration: none; }
.cb-years a.on { background: var(--card); color: var(--ink); box-shadow: 0 1px 2px rgba(0, 0, 0, 0.08); }
.cb-board .cb-l2 { display: block; margin: 2px 0 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 360px; }
.cb-board .cb-l2 .cb-early { margin-left: 6px; }

/* player pages: Pitch Movement / Pitch Optimization / Hot Zones tabs, the MLB player page's style (owner 2026-10-26) */
.cb-card.cb-drops { padding: 6px; }
.cb-dtabs { display: flex; gap: 2px; background: var(--fill); border-radius: 12px; padding: 3px; }
.cb-dtab { flex: 1; border: 0; background: transparent; padding: 9px 4px; font: inherit; font-size: 13px; font-weight: 600; color: var(--ink2); border-radius: 9px; cursor: pointer; }
.cb-dtab.on { background: var(--card); color: var(--ink); box-shadow: 0 1px 2px rgba(0, 0, 0, 0.08); }
.cb-dtab:focus-visible { outline: 2px solid var(--ink2); outline-offset: 1px; }

/* Front page for signed-out visitors (owner 2026-10-27): what it is, Sign in, Get in touch */
.cb-welcome { max-width: 980px; margin: 0 auto; padding: 18px 16px 64px; }
.cb-w-top { display: flex; align-items: center; justify-content: flex-end; }
.cb-w-hero .cb-w-brand { display: flex; justify-content: center; margin: 0 0 28px; }
.cb-w-hero .cb-w-lock svg { height: clamp(52px, 8vw, 76px); }
.cb-w-hero .cb-w-lock .cb-sub { font-size: clamp(13px, 1.7vw, 16px); padding: 0 6px; }
.cb-w-lock { gap: 7px; }
.cb-w-lock svg { height: 32px; width: auto; display: block; color: var(--ink); }
.cb-w-lock .cb-sub { font-size: 12px; font-weight: 600; color: var(--ink3); padding: 0 4px; }
.cb-w-signin { font-weight: 650; font-size: 14px; color: var(--ink); text-decoration: none; padding: 9px 14px; border-radius: 10px; border: 1px solid var(--line2); background: var(--card); }
.cb-w-hero { text-align: center; padding: 40px 0 40px; }
.cb-w-hero h1 { font-size: clamp(28px, 5vw, 44px); line-height: 1.12; letter-spacing: -0.02em; margin: 0 auto 14px; max-width: 720px; }
.cb-w-hero p { font-size: 17px; color: var(--ink2); margin: 0 auto 26px; max-width: 560px; line-height: 1.5; }
.cb-w-cta { display: flex; justify-content: center; gap: 10px; flex-wrap: wrap; }
.cb-w-primary { font-weight: 650; font-size: 15px; text-decoration: none; padding: 12px 24px; border-radius: 10px; background: var(--accent); color: var(--bg); }
.cb-w-primary:hover, .cb-w-signin:hover { opacity: 0.88; }
.cb-w-feat { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.cb-w-feat .cb-card { padding: 18px; }
.cb-w-feat h3 { margin: 0 0 6px; font-size: 15px; }
.cb-w-feat p { margin: 0; font-size: 13.5px; color: var(--ink2); line-height: 1.45; }
@media (max-width: 860px) { .cb-w-feat { grid-template-columns: 1fr 1fr; } }
@media (max-width: 520px) { .cb-w-feat { grid-template-columns: 1fr; } .cb-w-hero { padding: 44px 0 28px; } }
.cb-w-note { text-align: center; font-size: 13px; color: var(--ink3); margin: 18px 0 0; }
.cb-w-iq { margin: 64px auto 0; max-width: 640px; scroll-margin-top: 20px; }
.cb-w-iq h2 { font-size: 24px; margin: 0 0 6px; }
.cb-w-iq .cb-lede { margin: 0 0 16px; }
.cb-w-iq .cb-form { max-width: none; padding: 20px; }
.cb-form select { font: inherit; font-size: 16px; padding: 10px 12px; border-radius: 10px; border: 1px solid var(--line2); background: var(--card); color: var(--ink); }
.cb-w-iq input, .cb-w-iq select, .cb-w-iq textarea { font-weight: 400; font-size: 15px; color: var(--ink); }
.cb-opt { font-weight: 400; color: var(--ink3); }
.cb-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.cb-w-thanks { padding: 24px; text-align: center; }
.cb-w-thanks h3 { margin: 0 0 6px; }
.cb-w-thanks p { margin: 0; color: var(--ink2); }
.cb-w-small { font-size: 13px; color: var(--ink2); margin: 0; }
.cb-w-small a, a.cb-auth-brand { color: inherit; }
a.cb-auth-brand { text-decoration: none; }

/* Defense pocket cards (owner 2026-10-27): 3x5 in, four to a letter page, dashed cut lines; + a coach sheet */
.cc-link { float: right; margin-top: 4px; }
.cc-cards { display: grid; grid-template-columns: repeat(2, 3in); gap: 0.25in; justify-content: center; margin: 16px 0; }
.cc-card { width: 3in; height: 5in; box-sizing: border-box; border: 1px dashed #9aa1ad; border-radius: 6px; padding: 0.1in; background: #fff; color: #111;
  display: flex; flex-direction: column; font: 7.5pt/1.25 var(--sans); break-inside: avoid; position: relative; }
.cc-top { display: flex; justify-content: space-between; align-items: baseline; border-bottom: 1.5px solid #111; padding-bottom: 3px; margin-bottom: 3px; }
.cc-top b { font-size: 16pt; } .cc-top span { font-size: 8pt; font-weight: 600; }
.cc-card table, .cc-sheet table { width: 100%; border-collapse: collapse; }
.cc-card th, .cc-card td { text-align: left; padding: 1.5px 2px; border-bottom: 0.5px solid #ddd; white-space: nowrap; }
.cc-card th { font-size: 6.5pt; color: #555; }
.cc-card td:nth-child(2) { max-width: 1.05in; overflow: hidden; text-overflow: ellipsis; }
.cc-card td:nth-child(4), .cc-card td:nth-child(5) { font-weight: 700; }
.cc-bench td { color: #555; }
.cc-key { margin-top: auto; font-size: 6pt; color: #555; padding-top: 3px; }
.cc-brand { position: absolute; right: 0.1in; bottom: 0.05in; font: 700 6pt var(--sans); color: #999; letter-spacing: 0.1em; }
.cc-sheet { background: #fff; color: #111; padding: 16px; border-radius: 10px; margin: 16px 0; break-before: page; font: 8.5pt var(--sans); }
.cc-sheet th, .cc-sheet td { padding: 2px 4px; border-bottom: 0.5px solid #ddd; text-align: left; white-space: nowrap; }
.cc-sheet tr.cc-l td { border-bottom: 1px solid #bbb; }
@media print {
  @page { size: letter; margin: 0.35in; }
  #top, .cc-noprint, .cb-back { display: none !important; }
  body, #screen { background: #fff !important; }
  .cc-cards { gap: 0.2in; margin: 0; }
}

/* spray cards (2026-10-27) */
.cc-card td { vertical-align: middle; }
.cc-fan { display: block; }
.cc-card .cc-fan { margin: -1px 0; }
.cc-pct { font: 700 9px/1 var(--sans); fill: #111; text-anchor: middle; }
.cc-sw { display: inline-block; width: 8px; height: 8px; border-radius: 2px; vertical-align: -1px; margin: 0 2px 0 4px; }
.cc-sub { margin: 0 0 6px; color: #555; }
.cc-sheet td { vertical-align: middle; }
.cc-sheet .cc-fan { width: 170px; }
@media print {
  .cc-sheet { padding: 0; margin: 0; }
  .cc-sheet h2 { font-size: 12pt; margin: 0 0 2px; }
  .cc-sheet .cc-sub { font-size: 7pt; margin: 0 0 3px; }
  .cc-sheet td, .cc-sheet th { padding: 1px 3px; }
  .cc-sheet .cc-fan { width: 1.3in; height: auto; }
}
/* hitter page Spray Chart tab (owner 2026-10-27): vs RHP and vs LHP, expected next to his balls in play; stacks at phone width */
.cb-sp { display: grid; grid-template-columns: 1fr 1fr; gap: 14px 22px; }
.cb-sp-hand h3 { font-size: 13.5px; margin: 0 0 6px; }
.cb-sp-hand h3 .cb-dim { margin-left: 4px; }
.cb-sp-pair { display: flex; gap: 12px; flex-wrap: wrap; }
.cb-sp-pair figure { margin: 0; flex: 1 1 150px; max-width: 200px; min-width: 0; }
.cb-sp-pair figcaption { font-size: 11.5px; font-weight: 600; color: var(--ink2); margin-bottom: 4px; }
.cb-sp-pair .cc-fan { width: 100%; max-width: 200px; height: auto; }
.cb-sp-none { color: var(--ink2); margin: 4px 0 0; }
@media (max-width: 860px) { .cb-sp { grid-template-columns: 1fr; } }
@media (max-width: 420px) { .cb-sp-pair { flex-direction: column; } .cb-sp-pair figure { flex: none; width: 100%; max-width: 240px; } .cb-sp-pair .cc-fan { max-width: 240px; } }

/* Transfer Portal list (owner 2026-10-28): the list first - pitchers / hitters, position, hand, conference, pillar filters */
.cb-plist-card { padding-bottom: 6px; }
.cb-lfilters { display: flex; flex-direction: column; gap: 10px; margin-bottom: 6px; }
.cb-lfilters .cb-row { justify-content: flex-start; }
.cb-lsel select { font: inherit; font-size: 13px; padding: 6px 8px; border-radius: 8px; border: 0.5px solid var(--line2); background: var(--card); color: var(--ink); max-width: 220px; }
.cb-lq { font: inherit; font-size: 13px; padding: 7px 10px; border-radius: 8px; border: 0.5px solid var(--line2); background: var(--card); color: var(--ink); min-width: 0; flex: 1 1 180px; max-width: 280px; }
.cb-ltops label { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 650; color: var(--ink2); padding: 2px 2px 2px 10px; border-radius: 9px; border: 0.5px solid var(--line); }
.cb-ltops label.on { border-color: var(--ink); color: var(--ink); }
.cb-ltops label select { border: 0; padding: 4px 6px; background: transparent; }
.cb-lclear { font: inherit; font-size: 12.5px; font-weight: 650; border: 0; background: transparent; color: var(--ink2); text-decoration: underline; cursor: pointer; padding: 4px 6px; }
.cb-lcount { margin: 8px 0 0; }
.cb-plist-card .cb-board { margin: 0 -18px; }
@media (max-width: 600px) { .cb-lq { max-width: none; flex-basis: 100%; } }
.cb-plist-card .cb-board th:first-child { width: 230px; }
.cb-plist-card .cb-board th:nth-child(2) { width: 66px; }
.cb-plist-card .cb-board th:nth-child(3) { width: 62px; }
.cb-plist-card .cb-board th.gcol { width: 100px; }
.cb-plist-card .cb-board td:first-child .cb-l2 { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
@media (max-width: 640px) { .cb-plist-card .cb-board th:first-child { width: 150px; } .cb-plist-card .cb-board th:nth-child(3) { width: 48px; } }
.cb-ltops .cb-lmin input { font: inherit; font-size: 13px; width: 58px; padding: 4px 6px; border: 0; background: transparent; color: var(--ink); font-weight: 700; }

/* Scouting (owner 2026-10-28): pick a team -> its pitchers and hitters */
.cb-scoutpick { display: flex; flex-direction: column; gap: 12px; }
.cb-teampick { font: inherit; font-size: 15px; font-weight: 600; padding: 10px 12px; border-radius: 10px; border: 0.5px solid var(--line2); background: var(--card); color: var(--ink); max-width: 420px; width: 100%; }
.cb-sched { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.cb-sched > .cb-dim { font-size: 12.5px; font-weight: 650; margin-right: 4px; }
.cb-sched .cb-chip { text-decoration: none; }
.cb-sched .cb-chip:hover { border-color: var(--ink); color: var(--ink); }
.cb-btn.ghost { background: transparent; color: var(--ink); border: 0.5px solid var(--line2); text-decoration: none; }
.cb-head .cb-row-btns { display: flex; gap: 8px; flex-wrap: wrap; }
.cb-sec { font-size: 17px; margin: 18px 0 8px; }
.cb-sec .cb-dim { font-size: 13px; font-weight: 500; }
.cb-scoutbtn { font-size: 12px; font-weight: 700; padding: 4px 10px; border-radius: 999px; border: 0.5px solid var(--ink); color: var(--ink); white-space: nowrap; }
.cb-early.cb-scouted { color: var(--ink); background: color-mix(in oklab, var(--good) 18%, transparent); }
.cb-calib { border: 1px solid var(--ink); }
.cb-locked { opacity: 0.55; pointer-events: none; }
.cb-scoutteam .cb-board th:first-child { width: 240px; }
/* coach grades on the 100 scale (owner 2026-10-28): every pillar, its D1 range under / above it */
.cb-gboxes .ch { font-weight: 700; margin-bottom: 6px; }
.cb-gboxrow { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; }
.cb-gbox { display: flex; flex-direction: column; gap: 4px; font-size: 13px; font-weight: 650; }
.cb-gbox input { font: inherit; font-size: 16px; font-weight: 700; padding: 8px 10px; border-radius: 9px; border: 0.5px solid var(--line2); background: var(--card); color: var(--ink); width: 100%; box-sizing: border-box; }
.cb-gbox em { font-style: normal; font-size: 11.5px; font-weight: 500; color: var(--ink3); }
.cb-gbox input.bad, .cb-rate.bad { border-color: var(--bad); box-shadow: 0 0 0 1px var(--bad) inset; }
.cb-ratewrap { overflow-x: auto; }
.cb-ratetab th { font-size: 12px; font-weight: 700; text-align: center; white-space: nowrap; }
.cb-ratetab th span { display: block; font-weight: 500; color: var(--ink3); font-size: 11px; }
.cb-ratetab td.txt .cb-dim { display: block; font-size: 12px; }
.cb-ratetab .cb-rate { width: 62px; font: inherit; font-size: 14px; padding: 5px 6px; border-radius: 8px; border: 0.5px solid var(--line2); background: var(--card); color: var(--ink); text-align: center; }
.cb-tpick { position: relative; max-width: 440px; width: 100%; }
.cb-tpick > .ti { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); color: var(--ink3); pointer-events: none; }
.cb-tpick .cb-teampick { padding-left: 36px; box-sizing: border-box; }
.cb-tlist { position: absolute; z-index: 30; left: 0; right: 0; top: calc(100% + 4px); max-height: 340px; overflow-y: auto; background: var(--card); border: 0.5px solid var(--line2); border-radius: 12px; box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12); padding: 4px; }
.cb-tlist .gh { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; color: var(--ink3); padding: 8px 10px 4px; }
.cb-tlist button { display: flex; justify-content: space-between; gap: 10px; width: 100%; text-align: left; font: inherit; font-size: 14px; border: 0; background: transparent; color: var(--ink); padding: 8px 10px; border-radius: 8px; cursor: pointer; }
.cb-tlist button span { color: var(--ink3); font-size: 12px; }
.cb-tlist button.on, .cb-tlist button:hover { background: var(--fill); }
.cb-thin { margin-top: 10px; }
.cb-thin .ch { font-weight: 700; margin-bottom: 8px; }
.cb-thin ul { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 6px 16px; }
.cb-thin li { display: flex; align-items: center; gap: 8px; padding: 6px 0; border-bottom: 0.5px solid var(--line); }
.cb-thin li .cb-dim { font-size: 12.5px; margin-right: auto; }
.cb-thin a.cb-scoutbtn { text-decoration: none; }
.cb-rateseg { margin: 4px 0 12px; }
.cb-rateseg button .cb-dim { font-weight: 500; margin-left: 4px; }
.cb-bsearch { margin-left: auto; }
@media (max-width: 600px) { .cb-bsearch { margin-left: 0; } }

/* Series packet (owner 2026-10-28, redesigned: the player pages' own charts, minimal copy; js/packet.js): one card per player, cut on
   the dashed lines - pitchers two to a letter page, hitters three. Always light ink on white, whatever the site theme */
.pk-key { font-size: 12px; color: var(--ink2); margin: 4px 0 10px; text-align: center; }
.pk-cards { display: flex; flex-direction: column; align-items: center; gap: 0.2in; margin: 0 0 0.2in; }
.pk-card { --bg: #F2F4F7; --card: #FFFFFF; --ink: #14171F; --ink2: #677084; --ink3: #6E7687; --line: #E5E7EB; --line2: #D0D4DC; --fill: #F2F4F7;
  --good: #2f7d32; --bad: #b3261e; color-scheme: light;
  width: 7.6in; box-sizing: border-box; border: 1px dashed #9aa1ad; border-radius: 6px; padding: 0.1in 0.12in; background: #fff; color: #14171F;
  font: 8pt/1.25 var(--sans); break-inside: avoid; overflow: hidden; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
.pk-p { height: 4.9in; }
.pk-hc { height: 3.05in; }
.pk .pk-card .zones-card.pz-card, .pk-card .pk-z .zones-card.pz-card { --z-hot: #e34948; --z-cold: #2a78d6; --z-mid: #f0efec; --z-dot: #1c1f24; --z-dot-ring: #fff; }
.pk-card .pk-mv .mv-card.mv-card { --mv-sig: #d0342c; }
.pk-top { display: flex; align-items: baseline; gap: 10px; border-bottom: 1.5px solid #111; padding-bottom: 3px; margin-bottom: 4px; }
.pk-top b { font-size: 14pt; }
.pk-top span { font-size: 8pt; color: #555; }
.pk-top .pk-team { margin-left: auto; font-weight: 700; color: #999; letter-spacing: .04em; }
.pk-lim { font-style: normal; font-weight: 700; color: #b45309; }
.pk-none { color: #999; font-size: 7.5pt; }
.pk-h { font: 700 8pt/1.2 var(--sans); margin: 0 0 1px; }
/* trim the player-page cards to their pictures */
.pk-card .mx-panel-card { padding: 0; margin: 0; border: 0; background: none; box-shadow: none; }
.pk-card .mx-note, .pk-card .zlines, .pk-card .zdetail, .pk-card .pz-show, .pk-card .zpitches, .pk-card .zkey, .pk-card .mv-head, .pk-card .mv-signal,
.pk-card .mv-legend, .pk-card .mv-pop, .pk-card .zmap figcaption span, .pk-card .zheatkey { display: none !important; }
.pk-card .zmaps { display: grid !important; grid-template-columns: repeat(3, 1fr); gap: 0 6px; }
.pk-card .zmap { gap: 0; }
.pk-card .zmap svg { max-width: none; }
.pk-card .zmap figcaption { font-size: 7.5pt; line-height: 1.1; }
/* pitcher: movement chart left, Hot Zones right, the arsenal across the bottom */
.pk-body { display: grid; grid-template-columns: 2.9in 1fr; gap: 4px 0.12in; align-items: center; }
.pk-mv .mv-svg { width: 2.9in; max-width: none; }
.pk-zs { display: flex; flex-direction: column; gap: 3px; }
.pk-zs .zmap svg { width: 100%; }
.pk-ars { grid-column: 1 / -1; }
.pk-card .mv-table { font-size: 7.5pt; }
.pk-card .mv-table th { font-size: 6.5pt; padding: 2px 3px; }
.pk-card .mv-table td { padding: 1px 3px; }
.pk-card .mv-table td small { display: inline; margin: 0 0 0 3px; font-size: 6.5pt; }
/* hitter: per hand - expected and actual spray, then Hot Zones */
.pk-hrow { display: grid; grid-template-columns: 0.42in 1.2in 1.2in 1fr; gap: 0 0.08in; align-items: center; }
.pk-hrow + .pk-hrow { border-top: 0.5px solid #ddd; padding-top: 2px; margin-top: 2px; }
.pk-hl { font: 700 8.5pt/1.1 var(--sans); }
.pk-sp { margin: 0; text-align: center; }
.pk-sp figcaption { font-size: 7.5pt; font-weight: 600; }
.pk-sp .cc-fan { width: 1.2in; height: auto; }
.pk-hrow .pk-z .pk-h { display: none; }
.pk-hrow .zmap svg { width: 1.38in; }
@media print {
  .pk-key { margin: 0 0 0.08in; font-size: 8pt; color: #555; }
  .pk-cards { gap: 0.15in; margin: 0; }
  .pk-hcards { break-before: page; }
}

/* the hex spray chart (2026-10-28, /shared/spray.js sprayHexSvg) */
.pk-hrow.pk-hx { grid-template-columns: 0.42in 1.3in 1fr; }
.pk-sp .sp-hex { width: 1.3in; }
.pk-sp figcaption { font-weight: 400; color: #555; }
.cc-sheet .sp-hex { width: 230px; }
.cb-sp .sp-hex { max-width: 420px; border-radius: 8px; }
.cb-sp-hand h3 .cb-dim { font-weight: 400; }
h2 .sp-zt { margin-left: 10px; font-weight: 400; }
/* hitter card: jersey number, the short line vs each hand, the switch hitter's divider (owner 2026-10-28) */
.pk-top .pk-num, .pk-num { display: inline-block; background: #1d4ed8; color: #fff; font-size: 14pt; font-weight: 800; line-height: 1; padding: 2px 6px 1px; margin-top: -4px; margin-bottom: -4px;
  border-radius: 5px; margin-right: 6px; vertical-align: 1px; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
.pk-sums { display: flex; flex-wrap: wrap; gap: 2px 18px; font-size: 9pt; margin: 0 0 4px; }
.pk-sum b { margin-right: 4px; }
.pk-div { font-size: 8pt; color: #555; border-top: 0.75px solid #bbb; padding-top: 2px; margin-top: 3px; }
.pk-div + .pk-hrow { border-top: 0 !important; margin-top: 0 !important; }
/* room for the summary line and the switch divider: three hitter cards still fit a letter page (10.3in usable) */
.pk-hc { height: 3.25in; }
.pk-hc .pk-sp .sp-hex { width: 1.12in; }
.pk-hc .pk-hrow.pk-hx { grid-template-columns: 0.42in 1.2in 1fr; }
.pk-hc .pk-hrow .zmap svg { width: 1.28in; }
/* a switch hitter's card carries two divider lines: slightly smaller pictures so it stays the same size */
.pk-hc.pk-sw .pk-sp .sp-hex { width: 1.02in; }
.pk-hc.pk-sw .pk-hrow.pk-hx { grid-template-columns: 0.42in 1.2in 1fr; }
.pk-hc.pk-sw .pk-hrow .zmap svg { width: 1.08in; }
/* the batter figure in the packet (owner 2026-10-28: "the batter is pretty small, so its tough at a glance to tell which way hes facing"):
   solid dark ink instead of the pages' faint gray, and darker IN / AWAY - packet only */
.pk-card .zmap .zbatter { fill: #3a3f4a; opacity: 1; }
.pk-card .zmap .zside { fill: #3a3f4a; font-weight: 700; }
.pk-z.pk-few { font-size: 9pt; color: #666; padding: 14px 6px; }
.pk-z.pk-few .pk-h { color: #111; font-weight: 700; font-size: 9.5pt; margin-bottom: 4px; }
.pk-top .pk-mark { display: inline-flex; align-self: center; color: #111; margin-left: 8px; padding-left: 8px; border-left: 1px solid #ccc; }
.pk-top .pk-mark svg { height: 13px; width: auto; display: block; }
.pk-top .pk-plus { color: #111; font-size: 10pt; font-weight: 800; }
.pk-top .pk-plus.up { color: var(--good); } .pk-top .pk-plus.dn { color: var(--bad); }
.pk-plus { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
/* hitter cards (owner 2026-10-28): each hand's line above its own maps, no label column, bigger maps */
.pk-rh { display: flex; align-items: baseline; gap: 6px; font-size: 9pt; border-top: 0.75px solid #bbb; padding-top: 2px; margin-top: 3px; }
.pk-top + .pk-rh { border-top: 0; margin-top: 0; padding-top: 0; }
.pk-rh i { margin-left: auto; font-style: normal; font-size: 8pt; color: #555; white-space: nowrap; }
.pk-rh + .pk-hrow { border-top: 0 !important; margin-top: 0 !important; padding-top: 0 !important; }
/* hitter cards the pitcher cards' size, two to a page (owner 2026-10-28: "these hitter cards can be slightly bigger ... they are much
   smaller than the pitcher cards"), with bigger pictures */
.pk-hc .pk-hrow.pk-hx { grid-template-columns: 1.7in 1fr; }
.pk-hc .pk-sp .sp-hex { width: 1.7in; }
.pk-hc .pk-hrow .zmap svg { width: 1.8in; }
.pk-hc { height: 4.9in; }
/* standard stats across the bottom of every card (owner 2026-10-28) */
.pk-hc, .pk-p { display: flex; flex-direction: column; }
.pk-stats { margin-top: auto; display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; gap: 3px; padding-top: 3px; }
.pk-stats div { background: #f2f4f7; border-radius: 4px; padding: 2px 5px; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
.pk-stats b { display: block; font-size: 10pt; line-height: 1.15; }
.pk-stats span { display: block; font-size: 6.5pt; color: #677084; line-height: 1.1; }
/* the packet's print picker (owner 2026-10-28): who prints and in what order */
.pk-pick { border: 1px solid var(--line); background: var(--card); border-radius: 12px; padding: 10px 12px; margin: 8px 0 14px; }
.pk-pick-head { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; margin-bottom: 8px; }
.pk-pick-head [data-pk-reset] { margin-left: auto; }
.pk-pick-cols { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 12px; }
.pk-pick-gh { display: flex; align-items: baseline; gap: 8px; margin-bottom: 4px; }
.pk-pick-gh button { font: inherit; font-size: 12px; border: 1px solid var(--line2); background: transparent; color: inherit; border-radius: 6px; padding: 1px 8px; cursor: pointer; }
.pk-pick-gh span { margin-right: auto; }
.pk-pick ol { list-style: none; margin: 0; padding: 0; counter-reset: pk; }
.pk-pick li { display: flex; align-items: center; gap: 8px; padding: 4px 6px; border-radius: 8px; cursor: grab; font-size: 13px; }
.pk-pick li:not(.off) { counter-increment: pk; }
.pk-pick li::before { content: counter(pk); width: 18px; text-align: right; color: var(--ink2); font-size: 11px; }
.pk-pick li.off::before { content: "–"; }
.pk-pick li:hover { background: var(--fill); }
.pk-pick li.off .pk-pick-n, .pk-pick li.off .pk-pick-g { opacity: .45; }
.pk-pick li.over { box-shadow: inset 0 2px 0 var(--accent); }
.pk-pick li.drag { opacity: .4; }
.pk-pick-n { flex: 1; font-weight: 600; }
.pk-pick-g { color: var(--ink2); font-size: 12px; }
.pk-pick li button { font: inherit; border: 1px solid var(--line2); background: transparent; color: inherit; border-radius: 6px; width: 26px; height: 24px; cursor: pointer; }
.pk-pick li button:disabled { opacity: .3; cursor: default; }
.pk-card.pk-off { opacity: .3; }
@media print { .pk-card.pk-off, .pk-cards.pk-alloff { display: none !important; } }
/* pocket cards, two hitters across (owner 2026-10-28: bigger fields, small zones, jersey # visible) */
.cc-card2 { display: flex; flex-direction: column; }
.cc-card2 .cc-top b { font-size: 12pt; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.cc-how { font-size: 6.5pt; color: #555; margin: 0 0 3px; }
.cc-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 3px 0.08in; }
.cc-h { min-width: 0; border-bottom: 0.5px solid #ddd; padding-bottom: 2px; }
.cc-hn { display: flex; align-items: baseline; gap: 3px; font-size: 7.5pt; line-height: 1.2; white-space: nowrap; }
.cc-hn i { font-style: normal; font-weight: 700; color: #555; }
.cc-hn .cc-num { background: #1d4ed8; color: #fff; border-radius: 3px; padding: 0 3px; font-size: 7.5pt; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
.cc-hn span { overflow: hidden; text-overflow: ellipsis; font-weight: 600; min-width: 0; }
.cc-hn em { margin-left: auto; font-style: normal; font-weight: 700; }
.cc-f { display: grid; grid-template-columns: 1fr 1fr; gap: 2px; }
.cc-f figure { margin: 0; position: relative; }
.cc-f .sp-hex { width: 100%; height: auto; display: block; }
.cc-f figcaption { position: absolute; top: 0; left: 1px; font-size: 6pt; font-weight: 700; color: #555; }
.cc-card2 .cc-key { margin-top: auto; }
.pk-pick-opt { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; margin-left: auto; }
.pk-pick-head .pk-pick-opt + [data-pk-reset] { margin-left: 0; }
.pk-pocket .cc-cards { margin-top: 0.2in; }
@media print { .pk-pocket { break-before: page; } .pk-pocket[hidden] { display: none !important; } }
.cc-mark { bottom: 0.06in; line-height: 0; } .cc-mark svg { height: 0.22in; width: auto; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
/* one card per pitcher hand (owner 2026-10-28) */
.cc-vs { font: 800 11pt/1.1 var(--sans); margin: 0 0 3px; }
.cc-grid3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 4px 0.06in; }
.cc-grid3 .cc-hn { font-size: 7pt; gap: 2px; }
.cc-grid3 .cc-hn .cc-num { font-size: 7pt; padding: 0 2px; }
.cc-grid3 .sp-hex { width: 100%; height: auto; display: block; }
.cc-grid3 figure { margin: 0; position: relative; }
.cc-grid3 figcaption { position: absolute; top: 1px; left: 2px; font-size: 6pt; font-weight: 700; color: #555; }
.cc-side { text-align: center; font-size: 12px; color: var(--ink2); margin: 4px 0 0; }
@media print { .cc-backs { break-before: page; } }
/* 4x6 pocket cards (owner 2026-10-28), one to a printed page */
.cc-cards.cc-pair { grid-template-columns: repeat(2, 4in); }
.cc-card.cc-card3 { width: 4in; height: 6in; padding: 0.14in; }
.cc-card3 .cc-top b { font-size: 15pt; } .cc-card3 .cc-top span { font-size: 9pt; }
.cc-card3 .cc-vs { font-size: 14pt; margin-bottom: 5px; }
.cc-card3 .cc-grid3 { gap: 7px 0.08in; }
.cc-card3 .cc-grid3 .cc-hn, .cc-card3 .cc-grid3 .cc-hn .cc-num { font-size: 8.5pt; }
.cc-card3 .cc-grid3 figcaption { font-size: 7pt; }
.cc-card3 .cc-key { font-size: 7pt; }
.cc-card3 .cc-mark svg { height: 0.28in; }
@media print { .cc-cards.cc-pair { display: block; margin: 0; } .cc-pair .cc-card3 { margin: 0 auto; break-after: page; } }
@media (max-width: 900px) { .cc-cards.cc-pair { grid-template-columns: 4in; } }
.cc-card3 .cc-grid3.cc-full { flex: 1; align-content: space-evenly; }
/* coach notes (owner 2026-10-28) */
.cb-notebtn { font: inherit; font-size: 13px; font-weight: 600; border: 1px solid var(--line2); background: transparent; color: var(--ink2); border-radius: 999px; padding: 4px 12px; cursor: pointer; white-space: nowrap; margin-left: 6px; }
.cb-notebtn:hover { color: var(--ink); border-color: var(--ink2); }
.cb-notebtn.has { color: var(--ink); border-color: var(--accent); }
.cb-notes textarea { width: 100%; box-sizing: border-box; font: inherit; font-size: 14px; padding: 8px 10px; border: 1px solid var(--line2); border-radius: 10px; background: var(--card); color: var(--ink); resize: vertical; }
.cb-note-add .cb-row { margin-top: 6px; }
.cb-note-list { list-style: none; margin: 12px 0 0; padding: 0; }
.cb-note-list li { border-top: 1px solid var(--line); padding: 10px 0; }
.cb-note-list p { margin: 0 0 4px; white-space: normal; }
.cb-note-meta { display: flex; align-items: center; gap: 10px; font-size: 12px; color: var(--ink2); }
.cb-note-meta button { font: inherit; font-size: 12px; border: 0; background: none; color: var(--ink2); text-decoration: underline; cursor: pointer; padding: 0; }
.cb-note-dlg { width: min(560px, calc(100vw - 32px)); border: 1px solid var(--line); border-radius: 14px; padding: 16px; background: var(--card); color: var(--ink); }
.cb-note-dlg::backdrop { background: rgba(0, 0, 0, 0.35); }
.cb-note-dhead { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 10px; }
.cb-note-dhead h2 { margin: 0; font-size: 18px; }
/* staff notes page in the series packet (owner 2026-10-28) */
.pk-notes { display: flex; justify-content: center; margin: 0 0 0.2in; }
.pk-npage { width: 7.6in; box-sizing: border-box; border: 1px dashed #9aa1ad; border-radius: 6px; padding: 0.15in 0.2in; background: #fff; color: #14171F;
  font: 9.5pt/1.35 var(--sans); --good: #2f7d32; --bad: #b3261e; color-scheme: light; }
.pk-npage h3 { font-size: 11pt; margin: 10px 0 4px; border-bottom: 0.75px solid #bbb; padding-bottom: 2px; }
.pk-nplayer { padding: 5px 0; border-bottom: 0.5px solid #e3e3e3; break-inside: avoid; }
.pk-nname b { font-size: 11pt; } .pk-nname span:not(.pk-num) { font-size: 8.5pt; color: #555; }
.pk-nname .pk-num { font-size: 10pt; padding: 1px 5px; vertical-align: 1px; }
.pk-nnote { margin: 3px 0 0 0.12in; }
.pk-nnote p { margin: 0; }
.pk-nnote span { font-size: 8pt; color: #666; }
.pk-nnone { text-align: center; }
@media print { .pk-notes { break-before: page; display: block; } .pk-npage { margin: 0 auto; border: 0; } .pk-notes.pk-noprint { display: none !important; } }
/* card stats colored vs D1 regulars (owner 2026-10-29): green = better for him, red = worse, by half a regular's spread or more */
/* owner 2026-10-29: "make sure its the pill that is getting the color, not the number, it will be white" */
.pk-stats .pk-st.up { background: var(--good); } .pk-stats .pk-st.dn { background: var(--bad); }
.pk-stats .pk-st.up b, .pk-stats .pk-st.up span, .pk-stats .pk-st.dn b, .pk-stats .pk-st.dn span { color: #fff; }
.pk-stats { flex: none; }
/* an early read on a pitch = the Grid's caution mark, not the words (owner 2026-10-29: "to save room on these cards") */
.pk-card .pk-warn { display: inline-block; width: 9px; height: 9px; margin-left: 4px; vertical-align: -1px; fill: #111; }
.pk-key .pk-warn { display: inline-block; width: 10px; height: 10px; vertical-align: -1px; fill: #111; }
.pk-miss { color: var(--bad, #b3261e); font-weight: 600; }

/* coach grades by pillar (2026-10-29): the "what you're grading" guide + "not sure" boxes */
.cb-pguide { margin: 4px 0 14px; display: flex; flex-direction: column; gap: 2px; }
.cb-pguide .ch { font-weight: 700; margin-bottom: 4px; }
.cb-pguide details { border-top: 0.5px solid var(--line2); padding: 6px 0; font-size: 13.5px; }
.cb-pguide summary { cursor: pointer; list-style: none; color: var(--ink2); }
.cb-pguide summary::-webkit-details-marker { display: none; }
.cb-pguide summary::before { content: "+"; display: inline-block; width: 14px; color: var(--ink3); font-weight: 700; }
.cb-pguide details[open] summary::before { content: "–"; }
.cb-pguide summary b { color: var(--ink); margin-right: 4px; }
.cb-pdef { padding: 4px 0 2px 14px; color: var(--ink2); font-size: 13px; }
.cb-pdef p { margin: 4px 0; }
.cb-pdef ul { margin: 4px 0; padding-left: 18px; }
.cb-pdef li { margin: 2px 0; }
.cb-ns { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; font-weight: 500; color: var(--ink3); cursor: pointer; }
.cb-ns input { width: auto; margin: 0; }
.cb-ns.mini { display: flex; justify-content: center; font-size: 10.5px; margin-top: 3px; white-space: nowrap; }
.cb-gbox input:disabled, .cb-rate:disabled { opacity: 0.45; }
.cb-gbox span i { font-style: normal; font-weight: 500; }
.cb-texthint { display: block; font-weight: 500; font-size: 12.5px; margin: 2px 0 6px; }
.cb-form label.cb-ns { flex-direction: row; align-items: center; gap: 6px; font-size: 12px; font-weight: 500; color: var(--ink3); }
.cb-form .cb-ns input { padding: 0; width: auto; }
.cb-desc { display: flex; flex-direction: column; }
.cb-desc .ch { font-weight: 700; font-size: 13.5px; color: var(--ink); }
.cb-desc .ch .cb-dim { font-weight: 500; margin-left: 4px; }
.cb-form-row[hidden] { display: none; }

/* a coach's scouting read in a player's grades (owner 2026-10-29, scout_feed.py) */
.cb-scmark { display: inline-block; margin-left: 3px; padding: 0 3px; border-radius: 3px; font-size: 9px; font-weight: 750; line-height: 13px; vertical-align: super;
  color: var(--ink); background: color-mix(in oklab, var(--good) 22%, transparent); cursor: help; }
.cb-scnote { display: block; margin-top: 2px; font-style: normal; font-size: 11px; font-weight: 650; color: var(--ink3); cursor: help; }
.cb-thin-g { margin-right: 6px; font-variant-numeric: tabular-nums; cursor: help; }
.pk-sc { font-size: 7pt; margin-left: 1px; }

/* series packet: one letter page per player (owner 2026-10-29, js/packet.js) - each pitcher with the hitting coach's table (velo range,
   shape word, usage by side, strikeouts), each hitter with first-pitch swings and two-strike chase vs each pitcher hand */
.pk-card.pk-page { height: 9.4in; }   /* + the key above the first card still fits a letter page (10.3in inside the margins) */
.pk-p.pk-page .pk-body { grid-template-columns: 3.5in 1fr; align-items: start; }
.pk-p.pk-page .pk-mv .mv-svg { width: 3.5in; }
.pk-sheet { width: 100%; border-collapse: collapse; font-size: 10pt; margin: 6px 0 2px; font-variant-numeric: tabular-nums; }
.pk-sheet th { font-size: 7.5pt; font-weight: 700; color: #555; background: #f2f4f7; padding: 2px 4px; text-align: center; border-bottom: 0.75px solid #bbb;
  -webkit-print-color-adjust: exact; print-color-adjust: exact; }
.pk-sheet td { padding: 3px 4px; text-align: center; border-bottom: 0.5px solid #e3e3e3; }
.pk-sheet .pk-sl { border-left: 0.75px solid #bbb; }
.pk-sheet td.pk-pn { text-align: left; font-weight: 700; white-space: nowrap; }
.pk-sheet td.pk-shape { text-align: left; }
.pk-sheet td.pk-top1 { font-weight: 800; }
.pk-sheet .pk-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; margin-right: 4px; vertical-align: 0;
  -webkit-print-color-adjust: exact; print-color-adjust: exact; }
.pk-kline { display: flex; flex-wrap: wrap; gap: 2px 18px; font-size: 10pt; margin: 4px 0 8px; }
.pk-kline > b { margin-right: -10px; }
.pk-p.pk-page .pk-ars { margin-top: 2px; }
.pk-p.pk-page .pk-ars .mv-table { font-size: 8.5pt; }
.pk-p.pk-page .pk-ars .mv-table th { font-size: 7pt; }
.pk-p.pk-page .pk-sums { font-size: 10pt; }
.pk-hc.pk-page { height: 9.4in; }
.pk-hc.pk-page .pk-hrow.pk-hx { grid-template-columns: 2.7in 1fr; }
.pk-hc.pk-page .pk-sp .sp-hex { width: 2.7in; }
.pk-hc.pk-page .pk-hrow .zmap svg { width: 100%; }
.pk-splits { display: grid; grid-template-columns: repeat(3, 1fr); gap: 4px; align-items: center; margin: 3px 0 4px; }
.pk-splits .pk-st { background: #f2f4f7; border-radius: 4px; padding: 2px 6px; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
.pk-splits .pk-st b { display: block; font-size: 10.5pt; line-height: 1.15; }
.pk-splits .pk-st span { display: block; font-size: 7pt; color: #677084; line-height: 1.1; }
.pk-splits .pk-st.up { background: var(--good); } .pk-splits .pk-st.dn { background: var(--bad); } .pk-splits .pk-st.agg { background: #1d4ed8; }
.pk-splits .pk-st.up b, .pk-splits .pk-st.up span, .pk-splits .pk-st.dn b, .pk-splits .pk-st.dn span, .pk-splits .pk-st.agg b, .pk-splits .pk-st.agg span { color: #fff; }
.pk-splits .pk-st.pat { background: #bfdbfe; } .pk-splits .pk-st.pat span { color: #1e3a5f; }
.pk-key .pk-agg, .pk-key .pk-pat { display: inline-block; width: 10px; height: 10px; border-radius: 2px; vertical-align: -1px; }

/* ---- spot-code pocket cards (owner 2026-10-29; js/spotcodes.js) */
.sc-grass { fill: #dfeedd; } .sc-ingrass { fill: #dfeedd; } .sc-dirt { fill: #ead9c2; }
.sc-line, .sc-path { fill: none; stroke: #fff; stroke-width: 1.2; } .sc-wall { fill: none; stroke: #7a8a78; stroke-width: 2; }
.sc-base { fill: #fff; stroke: #9aa1ad; stroke-width: 0.5; }
.sc-set h2 .cb-dim, .sc-clear { font-weight: 500; }
.sc-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.sc-fields figure { margin: 0; } .sc-fields figcaption { font-weight: 700; margin: 0 0 4px; }
@media (max-width: 700px) { .sc-fields { grid-template-columns: 1fr; } }
svg.sc-team { width: 100%; height: auto; display: block; border-radius: 10px; background: var(--fill); touch-action: none; user-select: none; }
.sc-f { cursor: grab; touch-action: none; } .sc-f.drag { cursor: grabbing; }
.sc-f circle { fill: #1d4ed8; stroke: #fff; stroke-width: 2; } .sc-f.drag circle { fill: #b3261e; }
.sc-f:focus { outline: none; } .sc-f:focus-visible circle { stroke: #111; stroke-width: 3; }
.sc-fp { font: 700 10px var(--sans); fill: #fff; text-anchor: middle; pointer-events: none; }
.sc-fc { font: 800 14px var(--sans); fill: #111; text-anchor: middle; paint-order: stroke; stroke: #fff; stroke-width: 3px; pointer-events: none; }
.sc-ghosts circle { fill: #1d4ed8; opacity: 0.35; pointer-events: none; }
.sc-rename { justify-content: flex-start; margin: 10px 0 0; } .sc-rename input { font: inherit; width: 8em; padding: 5px 8px; border: 1px solid var(--line2); border-radius: 8px; background: var(--card); color: var(--ink); }
.sc-acts { justify-content: flex-start; margin: 10px 0 0; }
.sc-clear { float: right; font-size: 12.5px; }
.sc-gridwrap { overflow-x: auto; margin-top: 6px; }
.sc-grid { border-collapse: collapse; width: auto; }
.sc-grid th { text-align: center; padding: 3px 4px; } .sc-grid th.sc-gp { border-left: 1px solid var(--line2); }
.sc-grid td { padding: 2px 3px; } .sc-grid td.sc-hn { text-align: left; font-weight: 600; }
.sc-hn i { font-style: normal; color: var(--ink3); margin-right: 4px; } .sc-hn em { font-style: normal; color: var(--ink3); font-weight: 500; }
.sc-hn .cc-num, .sc-n .cc-num { background: #1d4ed8; color: #fff; border-radius: 3px; padding: 0 3px; margin-right: 4px; font-size: 11px; }
.sc-grid tr.sc-bench td.sc-hn { color: var(--ink2); font-weight: 500; }
.sc-grid td.sc-e:nth-child(2n) { border-left: 1px solid var(--line2); }
.sc-e input { font: 600 12.5px var(--sans); padding: 4px 5px; border: 1px solid var(--line2); border-radius: 6px; background: var(--card); color: var(--ink); width: 4.6em; text-align: center; }
.sc-e.sc-ed input { background: #fef3c7; color: #78350f; border-color: #f59e0b; }
.sc-log { margin-top: 10px; font-size: 12.5px; } .sc-log ul { margin: 6px 0 0; padding-left: 18px; } .sc-log li { margin: 2px 0; }
.sc-card .cc-top { margin-bottom: 2px; }
.sc-pos { display: flex; align-items: baseline; gap: 6px; margin: 0 0 3px; } .sc-pos b { font: 800 20pt/1 var(--sans); }
.sc-pos span { font-weight: 700; font-size: 9pt; } .sc-pos em { margin-left: auto; font-style: normal; font-size: 7pt; color: #555; }
.sc-t { width: 100%; border-collapse: collapse; font-size: 9.5pt; color: #111; }
.sc-t th { font-size: 7pt; color: #555; text-align: left; padding: 0 3px 1px; border-bottom: 1px solid #111; }
.sc-t th:nth-child(4), .sc-t th:nth-child(5) { text-align: center; }
.sc-t td { padding: 1.5px 3px; border-top: 0; border-bottom: 0.5px solid #ddd; line-height: 1.15; }
.sc-t td.sc-o { color: #555; font-weight: 700; width: 0.16in; } .sc-t td.sc-b { color: #555; width: 0.18in; }
.sc-t td.sc-n { max-width: 1.75in; overflow: hidden; text-overflow: ellipsis; font-weight: 600; }
.sc-t .cc-num { -webkit-print-color-adjust: exact; print-color-adjust: exact; font-size: 8pt; }
.sc-t td.sc-c { text-align: center; font-weight: 800; font-size: 11pt; width: 0.75in; }
.sc-t td.sc-c.sc-mv { outline: 1.5px solid #111; outline-offset: -2px; border-radius: 3px; }
.sc-t tr.sc-bench td.sc-n { color: #555; }
.sc-keywrap { margin-top: auto; padding-top: 4px; } .sc-key { width: 100%; height: 1.25in; display: block; border-radius: 4px; background: #f4f6f4; }
.sc-key .sc-dot { fill: #1d4ed8; } .sc-key .sc-lab { font-family: var(--sans); font-weight: 800; fill: #111; text-anchor: middle; paint-order: stroke; stroke: #fff; stroke-width: 0.9px; }
.sc-key .sc-home { font-family: var(--sans); fill: #666; text-anchor: start; }
.sc-key, .sc-team { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
.sc-foot { font-size: 6.5pt; color: #555; margin-top: 2px; }

/* series packet round 2 (owner 2026-10-29): stats across the bottom grouped by tendency, one row per hand; strikeout pitch beside the
   movement chart; main fastball velo stands out; bigger Hot Zones on the pitcher page (js/packet.js handGrid / kLines) */
.pk-hg { margin-top: auto; flex: none; display: grid; gap: 2px 3px; padding-top: 4px; }
.pk-hgg { margin-left: 5px; font: 700 7.5pt/1.2 var(--sans); text-transform: uppercase; letter-spacing: .04em; color: #222; border-bottom: 1px solid #999; padding-bottom: 1px; }
.pk-hgl { font-size: 6.5pt; line-height: 1.1; color: #555; align-self: end; }
.pk-hg .g0 { margin-left: 5px; }
.pk-hgs { display: flex; flex-direction: column; justify-content: center; font-size: 8.5pt; line-height: 1.15; }
.pk-hgs span { font-size: 7pt; color: #555; }
.pk-hg .pk-st { background: #f2f4f7; border-radius: 4px; padding: 2px 4px; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
.pk-hg .pk-st b { display: block; font-size: 10pt; line-height: 1.15; }
.pk-hg .pk-st span { display: block; font-size: 6.5pt; color: #677084; line-height: 1.1; }
.pk-hg .pk-st.up { background: var(--good); } .pk-hg .pk-st.dn { background: var(--bad); } .pk-hg .pk-st.agg { background: #1d4ed8; }
.pk-hg .pk-st.up b, .pk-hg .pk-st.up span, .pk-hg .pk-st.dn b, .pk-hg .pk-st.dn span, .pk-hg .pk-st.agg b, .pk-hg .pk-st.agg span { color: #fff; }
.pk-hg .pk-st.pat { background: #bfdbfe; } .pk-hg .pk-st.pat span { color: #1e3a5f; }
.pk-zs .pk-kline { display: block; font-size: 9.5pt; line-height: 1.35; margin: 8px 0 0; padding-top: 4px; border-top: 0.75px solid #bbb; }
.pk-zs .pk-kh { font-weight: 800; font-size: 9pt; text-transform: uppercase; letter-spacing: .04em; margin-bottom: 1px; }
.pk-sheet td.pk-fbv { font-weight: 800; font-size: 11pt; }
.pk-top .pk-fbh { color: #111; font-size: 10pt; font-weight: 800; }
.pk-top .pk-fba { color: #555; }
.pk-p.pk-page .pk-body { grid-template-columns: 3.0in 1fr; }   /* owner 2026-10-29: "[heat maps] can make these a little bigger" */
.pk-p.pk-page .pk-mv .mv-svg { width: 3.0in; }
.pk-p.pk-page .pk-zs .zmap figcaption { font-size: 8pt; }
.pk-hg .pk-st span { white-space: nowrap; font-size: 6pt; }
.pk-hg .pk-st { padding: 2px 3px; }
/* pitcher page (owner 2026-10-29): the one-line reads sit under the heat maps, above the strikeout pitch, so the charts move up */
.pk-sums.pk-sums-side { display: block; font-size: 8.5pt; margin: 6px 0 2px; border-top: 0.75px solid #bbb; padding-top: 4px; }
.pk-sums.pk-sums-side .pk-sum { margin: 0 0 2px; }
/* pitcher page uses the whole page (owner 2026-10-29: "a lot of empty space"): movement chart + reads + strikeout pitch on the left,
   his Hot Zones vs RHH and vs LHH as two tall columns of three maps on the right */
.pk-p.pk-page .pk-body.pk-tall { grid-template-columns: 3.1in 1fr 1fr; align-items: start; gap: 4px 0.14in; }
.pk-p.pk-page .pk-tall .pk-mv .mv-svg { width: 3.1in; }
.pk-p.pk-page .pk-tall .pk-zcol .zmaps { grid-template-columns: 1fr; gap: 6px 0; }
.pk-p.pk-page .pk-tall .pk-zcol .zmap svg { width: 100%; }
.pk-p.pk-page .pk-tall .pk-zcol .pk-h { text-align: center; }
/* the stats grid grows into any room left on the page (owner 2026-10-29: "dead space here where the bottom stats could be bigger"):
   packet.js sets --hgs from 1 up while the page still fits */
.pk-page .pk-hg { --hgs: 1; gap: calc(2px * var(--hgs)) 3px; }
.pk-page .pk-hgg { font-size: calc(7.5pt * var(--hgs)); }
.pk-page .pk-hgl { font-size: calc(6.5pt * var(--hgs)); }
.pk-page .pk-hgs { font-size: calc(8.5pt * var(--hgs)); }
.pk-page .pk-hgs span { font-size: calc(7pt * var(--hgs)); }
.pk-page .pk-hg .pk-st { padding: calc(2px * var(--hgs)) 3px; }
.pk-page .pk-hg .pk-st b { font-size: calc(10pt * var(--hgs)); }
.pk-page .pk-hg .pk-st span { font-size: calc(6pt * var(--hgs)); }
/* hitter page maps bigger (owner 2026-10-29: "can make these bigger on the hitter pages?"): the three maps sit two to a row beside the
   spray chart, so each is about half again as big and the hand's rows use their full height */
.pk-hc.pk-page .pk-hrow .zmaps { grid-template-columns: 1fr 1fr !important; gap: 4px 8px; }
.pk-hc.pk-page .pk-hrow .zmap svg { width: 100%; }
/* owner 2026-10-29: "where he swings as top middle and damage and s&m as the bottom two" */
.pk-hc.pk-page .pk-hrow .zmaps > :nth-child(1) { grid-column: 1 / -1; justify-self: center; width: calc(50% - 4px); }