/* Reference client — the odds-portal LAYOUT (a sports sidebar, Live / Scheduled, bookmakers as rows, outcomes as columns,
   best highlighted, payout, average) in the console's skin: graphite panels, bone ink, one amber accent, Barlow Condensed
   for headings, IBM Plex Mono for every price and count, IBM Plex Sans for the prose. */
:root {
  --bg: #101418; --panel: #181d23; --panel2: #1e242b; --ink: #eef1f3; --ash: #8a95a1; --line: #262d35; --line2: #333c46;
  --amber: #f0b429; --moss: #3ecf8e; --ember: #f26d6d; --ice: #79b8ff;
  --link: var(--ice); --up: var(--moss); --down: var(--ember); --susp: var(--amber); --live: var(--ember);
  --display: "Barlow Condensed", "Arial Narrow", system-ui, sans-serif;
  --mono: "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  --sans: "IBM Plex Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --r: 6px;
}
* { box-sizing: border-box; }
html, body { margin: 0; background: var(--bg); color: var(--ink); font: 13px/1.45 var(--sans); }
a { color: var(--link); text-decoration: none; }
a:hover { text-decoration: underline; }
.muted { color: var(--ash); }
.mono { font-family: var(--mono); }
.num { font-family: var(--mono); font-variant-numeric: tabular-nums; text-align: right; }
:focus-visible { outline: 2px solid var(--amber); outline-offset: 1px; }

/* the bar */
.top { display: flex; align-items: stretch; gap: 0; height: 46px; background: var(--panel); border-bottom: 1px solid var(--line); position: sticky; top: 0; z-index: 5; }
.brand { font: 700 20px/1 var(--display); letter-spacing: .02em; text-transform: uppercase; color: var(--ink); display: flex; align-items: center; padding: 0 18px; border-right: 1px solid var(--line); }
.brand:hover { text-decoration: none; }
.brand span { color: var(--amber); }
.top nav { display: flex; }
.top nav a { display: inline-flex; align-items: center; padding: 0 14px; color: var(--ash); font: 600 14px/1 var(--display); letter-spacing: .1em; text-transform: uppercase; border-bottom: 2px solid transparent; }
.top nav a.active { color: var(--ink); border-bottom-color: var(--amber); }
.top nav a:hover { color: var(--ink); text-decoration: none; }
.spacer { flex: 1; }
.top .chip, .top .relay, .top .plan { align-self: center; margin-right: 12px; }
.chip { background: var(--panel2); color: var(--ink); border: 1px solid var(--line2); border-radius: 5px; padding: 3px 10px; font: 500 12px/1.2 var(--sans); cursor: pointer; }
.chip:hover { border-color: var(--amber); }
.chip.on { color: var(--ink); border-color: var(--amber); background: color-mix(in srgb, var(--amber) 14%, transparent); }
.relay { font: 500 12px/1 var(--mono); color: var(--ash); }
.relay.open { color: var(--moss); }
.relay.closed { color: var(--ember); }
.plan { font: 500 11px/1 var(--mono); color: var(--ash); }

/* the page: sidebar + main */
.layout { display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: 16px; max-width: 1400px; margin: 0 auto; padding: 16px 18px 90px; }
.side { background: var(--panel); border: 1px solid var(--line); border-radius: var(--r); align-self: start; position: sticky; top: 60px; max-height: calc(100vh - 76px); overflow: auto; }
.side h3 { margin: 0; padding: 10px 12px; font: 600 11px/1 var(--display); letter-spacing: .16em; text-transform: uppercase; color: var(--ash); border-bottom: 1px solid var(--line); }
.side a { display: flex; justify-content: space-between; align-items: center; padding: 7px 12px; color: var(--ink); border-bottom: 1px solid var(--line); font-size: 13px; }
.side a:hover { background: color-mix(in srgb, var(--amber) 7%, transparent); text-decoration: none; }
.side a.on { background: color-mix(in srgb, var(--amber) 13%, transparent); box-shadow: inset 3px 0 0 var(--amber); color: var(--ink); }
.side a .n { color: var(--ash); font: 500 11px/1 var(--mono); }
.side a.league { padding-left: 24px; font: 600 12px/1.2 var(--display); letter-spacing: .08em; text-transform: uppercase; color: var(--ash); }
.side a.league.on { color: var(--ink); }
main { min-width: 0; }
h1 { font: 700 22px/1.1 var(--display); letter-spacing: .03em; text-transform: uppercase; margin: 0 0 10px; }
h1 .muted { font: 400 12px/1.3 var(--sans); letter-spacing: 0; text-transform: none; }
.error { color: var(--ember); padding: 12px; border: 1px solid var(--ember); border-radius: var(--r); background: var(--panel); }

/* sections: LIVE / SCHEDULED */
.section { margin: 0 0 18px; }
.section > h2 { margin: 0 0 8px; font: 700 15px/1 var(--display); letter-spacing: .1em; text-transform: uppercase; color: var(--ash); display: flex; align-items: center; gap: 8px; }
.section > h2 .muted { font: 500 11px/1 var(--mono); }
.section > h2 .live-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--live); display: inline-block; box-shadow: 0 0 0 3px color-mix(in srgb, var(--live) 25%, transparent); }
.league { background: var(--panel); border: 1px solid var(--line); border-radius: var(--r); margin-bottom: 10px; overflow: hidden; }
.league .lh { display: flex; align-items: baseline; gap: 8px; padding: 8px 12px; border-bottom: 1px solid var(--line); font: 700 14px/1 var(--display); letter-spacing: .06em; text-transform: uppercase; }
.league .lh .sport { color: var(--ash); font-weight: 500; }
.league .lh .n { margin-left: auto; color: var(--ash); font: 500 11px/1 var(--mono); }
table.games { width: 100%; border-collapse: collapse; }
table.games th { font: 600 11px/1.2 var(--display); letter-spacing: .14em; text-transform: uppercase; color: var(--ash); padding: 6px 10px; border-bottom: 1px solid var(--line); text-align: center; }
table.games th.l { text-align: left; }
table.games td { padding: 6px 10px; border-bottom: 1px solid var(--line); vertical-align: middle; white-space: nowrap; }
table.games tr:last-child td { border-bottom: 0; }
table.games tr:hover td { background: color-mix(in srgb, var(--amber) 6%, transparent); }
table.games td.time { width: 100px; color: var(--ash); font: 500 12px/1.3 var(--mono); }
table.games td.time .live { color: var(--live); font: 700 11px/1 var(--display); letter-spacing: .1em; }
table.games td.match a { color: var(--ink); }
table.games td.match .sep { color: var(--ash); margin: 0 6px; }
table.games td.match .stage { font: 500 10px/1 var(--mono); color: var(--ash); margin-left: 6px; }
table.games td.px { width: 92px; text-align: center; font: 600 15px/1.2 var(--sans); font-variant-numeric: tabular-nums; color: var(--ink); }
table.games td.px .book { display: block; font: 400 10px/1.4 var(--sans); color: var(--ash); letter-spacing: 0; text-transform: none; }
table.games td.px.best { box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--amber) 60%, transparent); border-radius: 4px; }
table.games td.px.best .book { color: var(--amber); }
table.games td.bs { width: 48px; text-align: center; color: var(--ash); font: 500 12px/1 var(--mono); }
table.games td.meta { text-align: right; color: var(--ash); font-size: 11px; }
.tag { display: inline-block; font: 600 10px/1.5 var(--display); letter-spacing: .1em; text-transform: uppercase; padding: 0 6px; border-radius: 3px; background: color-mix(in srgb, var(--ink) 10%, transparent); color: var(--ash); margin-left: 6px; vertical-align: 1px; }
.tag.live { background: color-mix(in srgb, var(--live) 18%, transparent); color: var(--live); }
.empty { padding: 14px; color: var(--ash); background: var(--panel); border: 1px solid var(--line); border-radius: var(--r); }

/* the event page */
.evhead { background: var(--panel); border: 1px solid var(--line); border-top: 3px solid var(--amber); border-radius: var(--r); padding: 12px 14px; margin-bottom: 10px; }
.evhead h1 { margin: 0; }
.evhead h1 .sep { color: var(--ash); font-weight: 400; margin: 0 10px; }
.evhead .sub { color: var(--ash); font-size: 12px; margin-top: 6px; display: flex; gap: 14px; flex-wrap: wrap; }
.evhead .ids { font: 500 11px/1.3 var(--mono); color: var(--ash); }
.tabs { display: flex; gap: 2px; flex-wrap: wrap; border-bottom: 1px solid var(--line2); margin-bottom: 10px; }
.tabs a { padding: 8px 12px; color: var(--ash); font: 600 14px/1 var(--display); letter-spacing: .1em; text-transform: uppercase; border-bottom: 2px solid transparent; margin-bottom: -1px; }
.tabs a.on { color: var(--ink); border-bottom-color: var(--amber); }
.tabs a:hover { text-decoration: none; color: var(--ink); }
.tabs a .n { font: 500 11px/1 var(--mono); color: var(--amber); margin-left: 6px; padding: 1px 5px; border-radius: 3px; background: color-mix(in srgb, var(--amber) 14%, transparent); }
.block { background: var(--panel); border: 1px solid var(--line); border-radius: var(--r); margin-bottom: 10px; overflow: hidden; }
.block .bh { display: flex; align-items: center; gap: 8px; padding: 7px 12px; border-bottom: 1px solid var(--line); font: 700 14px/1 var(--display); letter-spacing: .06em; text-transform: uppercase; }
.block .bh .muted { font-weight: 500; }
.block .bh .chip { margin-left: auto; font-size: 11px; text-transform: none; letter-spacing: 0; }
table.odds { width: 100%; border-collapse: collapse; }
table.odds th { font: 600 11px/1.2 var(--display); letter-spacing: .14em; text-transform: uppercase; color: var(--ash); padding: 6px 12px; border-bottom: 1px solid var(--line); text-align: center; }
table.odds th.l { text-align: left; }
table.odds td { padding: 4px 12px; border-bottom: 1px solid var(--line); text-align: center; white-space: nowrap; }
table.odds td.l { text-align: left; }
table.odds td.book { font-weight: 600; }
table.odds td.book a { color: var(--ink); text-decoration: underline dotted; text-underline-offset: 3px; }
table.odds td.pay { color: var(--ash); font: 500 12px/1.3 var(--mono); }
table.odds tr.avg td { background: color-mix(in srgb, var(--ink) 5%, transparent); color: var(--ash); border-bottom: 0; font-family: var(--mono); }
table.odds tr.avg td.l { font: 600 11px/1.2 var(--display); letter-spacing: .14em; text-transform: uppercase; }
.cell { display: inline-block; min-width: 68px; padding: 3px 8px; border-radius: 5px; border: 1px solid color-mix(in srgb, var(--ink) 14%, transparent); background: color-mix(in srgb, var(--ink) 6%, var(--panel)); font: 600 14px/18px var(--sans); font-variant-numeric: tabular-nums; color: var(--ink); transition: background .8s; }
.cell.best { border-color: color-mix(in srgb, var(--amber) 70%, transparent); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--amber) 35%, transparent); }
.cell.susp { color: var(--susp); border-color: var(--susp); text-decoration: line-through; }
.cell.closed { color: var(--ash); opacity: .6; text-decoration: line-through; }
.cell.none { color: var(--ash); border-color: transparent; background: transparent; }
.cell.up { background: color-mix(in srgb, var(--up) 22%, var(--panel)); }
.cell.down { background: color-mix(in srgb, var(--down) 22%, var(--panel)); }
.cell.up::after { content: '▲'; color: var(--up); font-size: 9px; margin-left: 5px; }
.cell.down::after { content: '▼'; color: var(--down); font-size: 9px; margin-left: 5px; }
.cell.stale { border-bottom-style: dotted; border-bottom-color: var(--susp); }
.player { margin: 16px 0 6px; display: flex; align-items: baseline; gap: 8px; }
.player b { font: 700 15px/1.2 var(--display); letter-spacing: .04em; text-transform: uppercase; }
.player .muted { font-size: 12px; }

/* the props screener */
.filters { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin-bottom: 10px; color: var(--ash); }
.filters select, .filters input { background: var(--panel2); color: var(--ink); border: 1px solid var(--line2); border-radius: 5px; padding: 4px 8px; font: 500 12px/1.2 var(--sans); }
table.screener { width: 100%; border-collapse: collapse; background: var(--panel); border: 1px solid var(--line); border-radius: var(--r); }
table.screener th, table.screener td { padding: 5px 10px; border-bottom: 1px solid var(--line); text-align: right; font-size: 12px; white-space: nowrap; }
table.screener th { font: 600 11px/1.2 var(--display); letter-spacing: .14em; text-transform: uppercase; color: var(--ash); position: sticky; top: 46px; background: var(--panel); }
table.screener th:first-child, table.screener td:first-child, table.screener th:nth-child(2), table.screener td:nth-child(2), table.screener th:nth-child(3), table.screener td:nth-child(3) { text-align: left; }
table.screener td.num { font-family: var(--mono); }
table.screener tr:hover td { background: color-mix(in srgb, var(--amber) 6%, transparent); }

/* findings */
.findings-btn { position: fixed; right: 16px; bottom: 16px; z-index: 6; background: var(--panel); color: var(--ink); border: 1px solid var(--line2); border-radius: 999px; padding: 8px 14px; font: 600 13px/1 var(--display); letter-spacing: .08em; text-transform: uppercase; cursor: pointer; box-shadow: 0 8px 24px rgba(0,0,0,.45); }
.findings-btn b { color: var(--amber); margin-left: 6px; font-family: var(--mono); }
.findings { position: fixed; right: 16px; bottom: 60px; width: min(560px, 92vw); max-height: 60vh; overflow: auto; background: var(--panel); border: 1px solid var(--line2); border-top: 3px solid var(--amber); border-radius: var(--r); z-index: 6; box-shadow: 0 16px 48px rgba(0,0,0,.5); }
.findings-head { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-bottom: 1px solid var(--line); position: sticky; top: 0; background: var(--panel); }
.findings-head strong { font: 700 15px/1 var(--display); letter-spacing: .06em; text-transform: uppercase; }
.findings-head .muted { flex: 1; font-size: 12px; }
.finding { padding: 8px 12px; border-bottom: 1px solid var(--line); font-size: 12px; }
.finding b { font-family: var(--mono); color: var(--amber); }
.finding .n { float: right; color: var(--ash); font-family: var(--mono); }
.finding .ex { color: var(--ash); font-family: var(--mono); font-size: 11px; white-space: pre-wrap; word-break: break-all; margin-top: 3px; }

/* ---------------------------------------------------------------- phones and small tablets (6 Sep 2026)
   The same page, one column: the sidebar is a sticky strip of chips under the bar, every table scrolls inside its own
   panel with its first column pinned, the bar wraps instead of overflowing, the findings drawer is a bottom sheet, and
   anything a thumb hits is at least 40 px tall. Nothing here changes what is rendered — only how it lays out. */
body { -webkit-tap-highlight-color: transparent; }
a, button, select, input { touch-action: manipulation; }

@media (max-width: 860px) {
  .layout { display: block; padding: 0 10px 96px; }
  main { padding-top: 10px; }
  /* the sidebar as chips: sports, then leagues, one scrolling row */
  .side { position: sticky; top: 46px; z-index: 4; display: flex; gap: 6px; padding: 8px 10px; margin: 0 -10px; max-height: none; overflow-x: auto; overflow-y: hidden;
          border: 0; border-bottom: 1px solid var(--line); border-radius: 0; scrollbar-width: none; -webkit-overflow-scrolling: touch; scroll-snap-type: x proximity; }
  .side::-webkit-scrollbar { display: none; }
  .side h3 { display: none; }
  .side a, .side a.league { flex: 0 0 auto; display: inline-flex; gap: 6px; align-items: center; min-height: 34px; padding: 0 12px; border: 1px solid var(--line2); border-radius: 999px;
                            background: var(--panel2); color: var(--ink); font: 600 12px/1 var(--display); letter-spacing: .06em; text-transform: uppercase; white-space: nowrap; scroll-snap-align: start; }
  .side a.on, .side a.league.on { box-shadow: none; border-color: var(--amber); background: color-mix(in srgb, var(--amber) 16%, var(--panel2)); color: var(--ink); }
  .side a .n { font-size: 11px; }
  /* the bar wraps; the plan line goes */
  .top { height: auto; min-height: 46px; flex-wrap: wrap; }
  .brand { padding: 0 12px; height: 46px; }
  .top nav { flex: 1; overflow-x: auto; scrollbar-width: none; }
  .top nav a { padding: 0 10px; white-space: nowrap; min-height: 46px; }
  .top .plan { display: none; }
  .top .chip, .top .relay { margin-right: 10px; min-height: 30px; display: inline-flex; align-items: center; }
  .top .chip { padding: 3px 8px; margin-right: 8px; }
  .top .relay { max-width: 58px; overflow: hidden; white-space: nowrap; }
  h1 { font-size: 19px; }
  /* every table scrolls inside its panel, the first column pinned */
  .league, .block { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  table.games td.time { width: auto; min-width: 58px; font-size: 11px; white-space: normal; }
  table.games td.match { white-space: normal; min-width: 150px; line-height: 1.3; }
  table.games td.match .sep { display: block; margin: 0; height: 0; overflow: hidden; }
  table.games td.match .stage { display: block; margin: 2px 0 0; }
  /* the live score on its own line between the two names, instead of splitting the second one */
  table.games td.match .score { display: block; width: max-content; margin: 3px 0; }
  table.games td.px { width: 62px; padding: 6px 4px; font-size: 14px; }
  table.games td.px .book { font-size: 9px; }
  table.games td.meta, table.games td.bs { display: none; }
  table.games th.bs, table.games th.meta { display: none; }
  table.games td { padding: 8px 6px; }
  table.games tr td.match a { display: inline-block; min-height: 24px; }
  table.odds td.l, table.odds th.l { position: sticky; left: 0; z-index: 1; background: var(--panel); }
  table.odds td { padding: 5px 8px; }
  .cell { min-width: 58px; padding: 5px 6px; font-size: 13px; }
  .tabs { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; margin: 0 -10px 10px; padding: 0 10px; }
  .tabs::-webkit-scrollbar { display: none; }
  .tabs a { white-space: nowrap; padding: 11px 12px; }
  .evhead { padding: 10px 12px; }
  .evhead h1 { font-size: 18px; line-height: 1.15; }
  .evhead h1 .sep { margin: 0 6px; }
  .score.big { font-size: 16px; line-height: 24px; margin: 0 8px; padding: 0 8px; }
  .player { flex-wrap: wrap; gap: 4px 8px; }
  /* the screener: its own scroll, the sticky header off (the bar's height varies when it wraps) */
  .filters { gap: 6px; }
  .filters select, .filters input { min-height: 36px; font-size: 13px; }
  table.screener { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  table.screener tbody, table.screener thead { display: table; width: max-content; min-width: 100%; }
  table.screener th { position: static; }
  table.screener th:first-child, table.screener td:first-child { position: sticky; left: 0; z-index: 1; background: var(--panel); }
  table.screener th, table.screener td { padding: 7px 8px; }
  /* the findings drawer as a bottom sheet */
  .findings-btn { right: 12px; bottom: 12px; padding: 10px 14px; }
  .findings { left: 0; right: 0; bottom: 0; width: 100%; max-height: 70vh; border-radius: var(--r) var(--r) 0 0; box-shadow: 0 -12px 40px rgba(0,0,0,.5); }
  .findings-head .chip { min-height: 32px; }
}
@media (max-width: 480px) {
  html, body { font-size: 14px; }
  .brand { font-size: 18px; padding: 0 10px; }
  .top nav a { font-size: 13px; padding: 0 8px; }
  .top .relay { font-size: 11px; }
  .top nav a .long { display: none; }

  table.games td.px { width: 56px; font-size: 13px; }
  .cell { min-width: 52px; }
}

/* the live score, between the teams */
.score { display: inline-block; margin: 0 10px; padding: 0 8px; border-radius: 4px; background: color-mix(in srgb, var(--live) 16%, transparent); color: var(--ink); font: 700 13px/20px var(--mono); font-variant-numeric: tabular-nums; }
.score i { font-style: normal; color: var(--ash); margin: 0 2px; }
.score.big { font-size: 20px; line-height: 28px; margin: 0 14px; padding: 0 12px; vertical-align: 2px; }

/* ---- Live PBP (2 Oct 2026): the 4th-quarter fouls screen */
.pbp-h { margin: 14px 12px 6px; font: 700 20px/1 var(--display); letter-spacing: .04em; text-transform: uppercase; }
.pbp-h .muted { font: 500 13px/1 var(--sans); letter-spacing: 0; text-transform: none; margin-left: 8px; }
.pbp-bar { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; padding: 6px 12px 10px; }
.pbp-bar .chip input[type=checkbox] { margin: 0 4px 0 0; vertical-align: -1px; }
.pbp-bar .chip input[type=number] { background: transparent; color: var(--ink); border: 0; border-bottom: 1px solid var(--line2); font: inherit; }
.pbp-bar select.chip { appearance: auto; }
.pbp-bar .spacer { flex: 1; }
.pad { padding: 8px 12px; } .small { font-size: 11.5px; }
table.pbp td.team .nm { font: 600 14px/1.2 var(--display); letter-spacing: .02em; }
table.pbp td.team.lead .nm { color: var(--amber); }
table.pbp td.team .sub { font: 500 11px/1.4 var(--mono); color: var(--ash); }
table.pbp td.team .sub b { color: var(--ink); }
table.pbp td.score { font: 600 15px/1.2 var(--mono); }
table.pbp td.diff { font: 600 15px/1.2 var(--mono); }
table.pbp td.time .lg { font: 500 10.5px/1.2 var(--sans); white-space: normal; max-width: 120px; display: inline-block; }
table.pbp td.msg { white-space: normal; max-width: 260px; font-size: 11.5px; }
table.pbp tr.hit td { background: color-mix(in srgb, var(--moss) 12%, transparent); }
table.pbp tr.hit:hover td { background: color-mix(in srgb, var(--moss) 18%, transparent); }
table.pbp tr.open td { box-shadow: inset 3px 0 0 var(--amber); }
table.pbp tr.flash td { animation: pbpflash 1.4s ease-out; }
@keyframes pbpflash { from { background: color-mix(in srgb, var(--amber) 22%, transparent); } to { background: transparent; } }
.tag.bonus { background: color-mix(in srgb, var(--ember) 22%, transparent); color: var(--ember); }
.tag.bonus2 { background: var(--ember); color: #fff; }
.poss { color: var(--amber); font-size: 10px; }
.sig { display: inline-block; font: 600 10px/1.6 var(--display); letter-spacing: .08em; padding: 0 5px; margin: 1px; border-radius: 3px; border: 1px solid var(--line2); color: var(--ash); }
.sig.on { color: var(--moss); border-color: var(--moss); }
.pbp-detail { margin: 10px 12px 20px; background: var(--panel); border: 1px solid var(--line); border-radius: 8px; padding: 10px 12px; }
.pbp-detail-head { margin-bottom: 8px; }
.pbp-cols { display: grid; grid-template-columns: minmax(280px, 1fr) minmax(280px, 1fr); gap: 16px; }
@media (max-width: 800px) { .pbp-cols { grid-template-columns: 1fr; } }
.pbp-detail h4 { margin: 8px 0 4px; font: 600 11px/1.2 var(--display); letter-spacing: .14em; text-transform: uppercase; color: var(--ash); }
.pbp-log { list-style: none; margin: 0; padding: 0; max-height: 420px; overflow: auto; font: 12px/1.5 var(--sans); }
.pbp-log li { padding: 2px 0; border-bottom: 1px solid var(--line); }
.pbp-log li.t251 { color: var(--ember); } .pbp-log li.t234, .pbp-log li.t233 { color: var(--amber); } .pbp-log li.t237, .pbp-log li.t252, .pbp-log li.t235 { color: var(--ice); }
table.stats td.l { color: var(--ash); }

table.pbp td.edge { font: 500 12px/1.3 var(--mono); white-space: nowrap; }
table.pbp td.edge.good { color: var(--moss); } table.pbp td.edge.ok { color: var(--ink); } table.pbp td.edge.bad { color: var(--ember); }
table.pbp td.edge .ed { font-size: 11px; opacity: .85; }
.sig.proxy { color: var(--amber); border-color: var(--amber); }
.pbp-detail .now { background: color-mix(in srgb, var(--amber) 25%, transparent); padding: 0 3px; border-radius: 3px; }
/* ---- Live PBP, larger and brighter (the owner, 2 Oct: "I can barely see some stuff") */
table.pbp { font-size: 14px; }
table.pbp th { font-size: 12.5px; color: #c9d1d9; padding: 8px 12px; }
table.pbp td { padding: 10px 12px; border-bottom: 1px solid var(--line2); }
table.pbp td.time { width: 128px; }
table.pbp td.time .live { font-size: 15px; color: #ffd166; }
table.pbp td.time .lg { font-size: 12px; color: #c9d1d9; }
table.pbp td.team .nm { font: 700 18px/1.2 var(--display); letter-spacing: .02em; color: #f4f6f8; }
table.pbp td.team.lead .nm { color: #ffd166; }
table.pbp td.team .sub { font: 600 13px/1.5 var(--mono); color: #d6dde4; }
table.pbp td.team .sub b { color: #ffffff; font-size: 14px; }
table.pbp td.team .sub .muted { color: #a9b4bf; }
table.pbp td.score { font: 700 22px/1.15 var(--mono); color: #ffffff; }
table.pbp td.diff { font: 700 20px/1.15 var(--mono); color: #ffffff; }
table.pbp td.diff .muted, table.pbp td.tt .muted, table.pbp td.tot .muted { color: #c9d1d9; font-size: 12.5px; }
table.pbp td.tt, table.pbp td.tot { font: 600 16px/1.3 var(--mono); color: #f4f6f8; }
table.pbp td.edge { font: 600 14px/1.35 var(--mono); }
table.pbp td.edge b { font-size: 17px; }
table.pbp td.edge .ed { font-size: 13px; opacity: 1; }
table.pbp td.edge .muted { color: #b8c2cc; font-size: 12.5px; }
table.pbp td.edge.good { color: #5ee6a6; } table.pbp td.edge.bad { color: #ff8585; }
table.pbp td.msg { font-size: 13px; color: #c9d1d9; max-width: 320px; }
.tag.bonus { background: color-mix(in srgb, var(--ember) 32%, transparent); color: #ffb3b3; font-size: 11px; }
.tag.bonus2 { background: #ff5c5c; color: #fff; font-size: 11px; }
.poss { color: #ffd166; font-size: 13px; }
.sig { font-size: 11.5px; padding: 1px 6px; color: #a9b4bf; border-color: #4a5560; }
.sig.on { color: #5ee6a6; border-color: #5ee6a6; background: color-mix(in srgb, var(--moss) 14%, transparent); }
.pbp-bar .chip { font-size: 13px; padding: 6px 10px; }
.pbp-bar #pbp-status { color: #c9d1d9; font-size: 13px; }
table.pbp tr.hit td { background: color-mix(in srgb, var(--moss) 16%, transparent); }
.pbp-detail { font-size: 14px; }
.pbp-detail .mono.small { font-size: 13px; color: #d6dde4; }
.pbp-log { font-size: 13.5px; max-height: 520px; }
.pbp-log li { padding: 4px 0; color: #d6dde4; }
.pbp-log li.t251 { color: #ff8585; } .pbp-log li.t234, .pbp-log li.t233 { color: #ffd166; } .pbp-log li.t237, .pbp-log li.t252, .pbp-log li.t235 { color: #8fcbff; }
table.stats td, table.stats th { font-size: 13.5px; }
table.stats td.l { color: #c9d1d9; }
.pbp-h { font-size: 24px; }
.pbp-h .muted { color: #c9d1d9; font-size: 14px; }
p.muted.pad.small { color: #a9b4bf; font-size: 12.5px; }

table.pbp td.edge .roi { font-size: 12.5px; color: #ffd166; margin-left: 2px; }
table.pbp td.edge .ref { font: 600 10.5px/1.6 var(--display); letter-spacing: .06em; color: #8fcbff; border: 1px solid #3b5b7a; border-radius: 3px; padding: 0 4px; margin-left: 4px; vertical-align: 1px; }

table.pbp td.time .clk.run { color: #5ee6a6; }
table.pbp td.time .clk.stop { color: #ffd166; }
html { scrollbar-gutter: stable; }

/* ---- who scored, and the court strip (2 Oct evening) */
table.pbp td.score .scored { color: #5ee6a6; text-shadow: 0 0 10px color-mix(in srgb, var(--moss) 70%, transparent); }
table.pbp td.score .scored small { font-size: 12px; margin-left: 4px; color: #5ee6a6; vertical-align: top; }
.court { margin: 0 0 10px; background: #0b0e12; border: 1px solid var(--line2); border-radius: 8px; overflow: hidden; }
.court-top { display: flex; justify-content: space-between; align-items: center; padding: 6px 14px; background: #14181d; }
.court-clock { font: 700 16px/1 var(--mono); color: #fff; }
.court-clock [data-clock] { color: #fff; }
.dots { display: inline-flex; gap: 5px; }
.dots .dot { width: 9px; height: 9px; border-radius: 50%; border: 1.5px solid #8a95a1; background: transparent; }
.dots .dot.on { background: #e8edf2; border-color: #e8edf2; }
.dots .dot.on.bonus { background: #ff5c5c; border-color: #ff5c5c; }
.court-svg { display: block; width: 100%; height: auto; }
.court-svg .wood { fill: #b07a4b; }
.court-svg .ln { fill: none; stroke: #f1e6d8; stroke-width: 1.5; }
.court-svg .rim { fill: none; stroke: #ff7a3d; stroke-width: 2; }
.court-svg .ball { fill: #e8562a; stroke: #2a1407; stroke-width: 1.5; }
.court-bottom { padding: 6px 14px; background: #14181d; font-size: 13.5px; color: #e8edf2; }
.court-bottom .poss-ball { display: inline-block; width: 10px; height: 10px; border-radius: 50%; background: #e8562a; vertical-align: -1px; margin-right: 4px; }
.court-bottom .to { color: #ffd166; font-weight: 700; letter-spacing: .08em; }

/* ---- Live PBP: the column grid (2 Oct, late) — fixed layout from an explicit colgroup, no row ever reflows */
.pbp-wrap { overflow-x: auto; }
table.pbp { table-layout: fixed; width: 100%; min-width: 1960px; }
table.pbp col.c-clock { width: 150px; } table.pbp col.c-team { width: 250px; } table.pbp col.c-score { width: 66px; } table.pbp col.c-diff { width: 72px; }
table.pbp col.c-tt { width: 84px; } table.pbp col.c-tot { width: 132px; } table.pbp col.c-court { width: 310px; }   /* 6 Oct: the tracker's court (290 px) */ table.pbp col.c-edge { width: 255px; } table.pbp col.c-sig { width: 205px; } table.pbp col.c-msg { width: auto; }
table.pbp tbody tr.pbp-row { height: 84px; }
table.pbp tbody td { height: 84px; box-sizing: border-box; padding-top: 8px; padding-bottom: 8px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; vertical-align: middle; contain: layout paint; }
table.pbp td.team .nm, table.pbp td.msg .msgtxt, table.pbp td.team .sub { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
table.pbp td.time .lg { display: block; max-width: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
table.pbp td.sigs { white-space: normal; line-height: 1.25; }
table.pbp td.edge.waiting { text-align: center; font: 500 13px/1.3 var(--mono); color: #8a95a1; }
table.pbp td.edge .e1 { font: 600 15px/1.35 var(--mono); }
table.pbp td.edge .e1 b { font-size: 17px; }
table.pbp td.edge .e2 { font: 500 12.5px/1.4 var(--mono); color: #c9d1d9; }
table.pbp td.edge .lbl { font: 600 10.5px/1 var(--display); letter-spacing: .1em; text-transform: uppercase; color: #8a95a1; margin-right: 2px; }
table.pbp td.edge .ref { margin-left: 6px; }
table.pbp td.court-cell { padding: 6px 8px; vertical-align: top; }
table.pbp td.court-cell canvas.hbcourt { display: block; }
.court.court-bb { background: transparent; border: 0; display: flex; justify-content: center; padding: 4px 0 8px; }
.court.court-bb canvas.hbcourt { border-radius: 6px; }
.mini-court { display: block; width: 134px; height: 42px; }
.mini-court .wood { fill: #b07a4b; } .mini-court .ln { fill: none; stroke: #f1e6d8; stroke-width: 1.2; }
.mini-court .fd { fill: transparent; stroke: #a9b4bf; stroke-width: 1.2; } .mini-court .fd.on { fill: #e8edf2; stroke: #e8edf2; } .mini-court .fd.on.bonus { fill: #ff5c5c; stroke: #ff5c5c; }
.mini-court .ball { fill: #e8562a; stroke: #2a1407; stroke-width: 1.2; } .mini-court .to { font: 700 8px var(--display); fill: #ffd166; letter-spacing: .08em; }
table.pbp tr.flash td { animation: pbpflash 1.4s ease-out; }
.pbp-paused { margin: 6px 12px; padding: 10px 12px; background: color-mix(in srgb, var(--amber) 16%, transparent); border: 1px solid var(--amber); border-radius: 8px; color: #fff; display: flex; gap: 12px; align-items: center; }

/* ---- the Live tab takes the whole width (2 Oct, late): no sidebar, no 1400 px cap, the grid fits a wide screen without scrolling */
body.live-full .layout { grid-template-columns: minmax(0, 1fr); max-width: none; padding-left: 16px; padding-right: 16px; }
body.live-full .side { display: none; }
table.pbp td.sigs .sig { margin: 1px 2px 1px 0; }

/* ---- taller rows (the owner, 2 Oct late): the team line wraps to two lines instead of truncating; the court and the edge get air */
table.pbp td.team .sub { white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; line-height: 1.45; }
table.pbp td.team .nm { margin-bottom: 2px; }
.mini-court { width: 140px; height: 44px; }
table.pbp td.edge .e1 { margin-bottom: 2px; }
table.pbp td.sigs { padding-top: 10px; }

/* ---- the court lives, the digit flickers (the owner, 2 Oct late) */
.mini-court .hidden { display: none; }
.mini-court .ball { transition: cx .55s cubic-bezier(.4,0,.2,1); }
.mini-court .rim { fill: none; stroke: #ff7a3d; stroke-width: 1.4; }
.mini-court .rim.lit { stroke: #5ee6a6; stroke-width: 2.2; filter: drop-shadow(0 0 3px #5ee6a6); }
.mini-court .fx-ring { fill: none; stroke: #5ee6a6; stroke-width: 2; opacity: 0; }
.mini-court .fx-txt { font: 700 11px var(--mono); fill: #5ee6a6; opacity: 0; }
.mini-court .fx.go .fx-ring { animation: courtring 1.6s ease-out forwards; }
.mini-court .fx.go .fx-txt { animation: courttxt 2.4s ease-out forwards; }
@keyframes courtring { 0% { opacity: 1; r: 6; } 100% { opacity: 0; r: 18; } }
@keyframes courttxt { 0% { opacity: 0; transform: translateY(4px); } 15% { opacity: 1; transform: translateY(0); } 80% { opacity: 1; } 100% { opacity: 0; } }
table.pbp td.score { position: relative; overflow: visible; }
table.pbp td.score .sc { display: block; position: relative; width: 100%; text-align: center; line-height: 1.15; }
table.pbp td.score .sc.scored { color: #ffd166; animation: bulb 1.1s steps(1, end); text-shadow: 0 0 10px #ffd166; }
@keyframes bulb { 0% { opacity: .15; } 12% { opacity: 1; } 24% { opacity: .25; } 36% { opacity: 1; } 50% { opacity: .4; } 62% { opacity: 1; } 100% { opacity: 1; } }
table.pbp td.score .plus { position: absolute; left: 100%; top: 2px; margin-left: 6px; font: 700 12px/1 var(--mono); color: #5ee6a6; white-space: nowrap; animation: courttxt 2.4s ease-out forwards; }
table.pbp td.score .scored small { display: none; }
table.pbp td.score .plus { display: inline; }

table.pbp td.edge .lbl { margin-right: 3px; } table.pbp td.edge .e2 { letter-spacing: -.01em; }

/* ---- the pin (the owner, 2 Oct late): keeps a game on screen whatever the filters say */
table.pbp col.c-pin { width: 44px; }
table.pbp td.pin { padding: 0 4px; text-align: center; }
.pinbtn { background: transparent; border: 0; color: #6f7a86; font-size: 22px; line-height: 1; cursor: pointer; padding: 6px; border-radius: 6px; }
.pinbtn:hover { color: #ffd166; background: color-mix(in srgb, var(--amber) 12%, transparent); }
.pinbtn.on { color: #ffd166; text-shadow: 0 0 8px color-mix(in srgb, var(--amber) 60%, transparent); }
table.pbp { min-width: 2004px; }

/* ---- play by play in the row and the detail, the pace line, FINAL (2 Oct, late) */
table.pbp col.c-msg { width: 330px; }
table.pbp { min-width: 2180px; }
table.pbp td.pbp { padding-top: 6px; padding-bottom: 6px; white-space: nowrap; }
.play { display: flex; align-items: center; gap: 6px; font: 500 12.5px/1.45 var(--sans); color: #b8c2cc; overflow: hidden; }
.play.newest { color: #f4f6f8; font-weight: 600; }
.play .who { font: 600 11px/1 var(--display); letter-spacing: .04em; text-transform: uppercase; color: #8a95a1; min-width: 58px; max-width: 76px; overflow: hidden; text-overflow: ellipsis; }
.play.home .who { color: #8fcbff; } .play.away .who { color: #ffb86b; }
.play .what { overflow: hidden; text-overflow: ellipsis; }
.pi { display: inline-flex; align-items: center; justify-content: center; width: 18px; height: 18px; border-radius: 4px; font: 700 11px/1 var(--mono); flex: 0 0 18px; background: #262d35; color: #c9d1d9; }
.pi.pt { background: #1f4d38; color: #5ee6a6; } .pi.pt3 { background: #1f4d38; color: #5ee6a6; box-shadow: inset 0 0 0 1px #5ee6a6; }
.pi.ftm { background: #1c3550; color: #8fcbff; } .pi.ftx { background: #3a2a2a; color: #ff8585; } .pi.fta { background: #1c3550; color: #8fcbff; }
.pi.foul { background: #4a1f1f; color: #ff8585; } .pi.to { background: #4a3a14; color: #ffd166; } .pi.per, .pi.race, .pi.misc { background: #262d35; color: #a9b4bf; }
table.pbp td.tot .pace { display: block; font: 500 11.5px/1.3 var(--mono); color: #c9d1d9; }
table.pbp td.tot .pace b { color: #ffd166; }
table.pbp td.tot .pace .lbl { font: 600 9.5px/1 var(--display); letter-spacing: .1em; text-transform: uppercase; color: #8a95a1; margin: 0 2px 0 4px; }
table.pbp td.time .final { color: #ff8585; letter-spacing: .12em; }
.pbp-log li.play { padding: 3px 0; border-bottom: 1px solid var(--line); }
.pbp-log li.play .ord { margin-left: auto; font: 500 11px/1 var(--mono); }
.pbp-log li.play .who { min-width: 120px; max-width: 160px; }

/* ---- the grid rebalanced so the play by play fits a 2,160 px screen (2 Oct, late) */
table.pbp col.c-clock { width: 140px; } table.pbp col.c-team { width: 236px; } table.pbp col.c-diff { width: 64px; } table.pbp col.c-tt { width: 80px; } table.pbp col.c-tot { width: 150px; } table.pbp col.c-court { width: 140px; } table.pbp col.c-edge { width: 240px; } table.pbp col.c-sig { width: 180px; } table.pbp col.c-msg { width: auto; }
table.pbp { min-width: 2080px; }
table.pbp td.tot .pace { font-size: 11px; line-height: 1.25; }
table.pbp td.tot .pace .lbl { margin-left: 0; }
.mini-court { width: 128px; height: 40px; }

/* ---- MelBet's line under BetMGM's (2 Oct, late) */
table.pbp .mb { display: inline-block; font: 600 11px/1.3 var(--mono); color: #ffd166; letter-spacing: .01em; }

/* ---- a disputed clock (3 Oct) */
table.pbp .clk.disputed { color: #ffb86b; }

/* ---- the big court and the leagues sidebar (3 Oct) */
table.pbp col.c-team { width: 210px; } table.pbp col.c-court { width: 302px; } table.pbp col.c-edge { width: 225px; } table.pbp col.c-sig { width: 150px; }
table.pbp { min-width: 2070px; }
table.pbp tbody tr.pbp-row { height: 100px; } table.pbp tbody td { height: 100px; }
table.pbp td.court-cell { padding: 2px 6px; }
.mini-court.big { width: 290px; height: 96px; display: block; }
.mini-court.big .wood { fill: #a8723f; } .mini-court.big .ln { fill: none; stroke: #f3e7d6; stroke-width: 1.1; } .mini-court.big .bb { stroke: #f3e7d6; stroke-width: 2.2; }
.mini-court.big .tn { font: 700 9px var(--display); fill: #c9d1d9; letter-spacing: .05em; text-transform: uppercase; } .mini-court.big .tn.poss { fill: #ffd166; }
.mini-court.big .bonus-tag { font: 800 8px var(--display); fill: #ff5c5c; letter-spacing: .14em; }
.mini-court.big .fd { fill: transparent; stroke: #a9b4bf; stroke-width: 1.2; } .mini-court.big .fd.on { fill: #e8edf2; stroke: #e8edf2; } .mini-court.big .fd.on.bonus { fill: #ff5c5c; stroke: #ff5c5c; }
.mini-court.big .ball { fill: #e8562a; stroke: #2a1407; stroke-width: 1.2; transition: cx .55s cubic-bezier(.4,0,.2,1); }
.mini-court.big .miss line { stroke: #ff5c5c; stroke-width: 2.4; stroke-linecap: round; }
.mini-court.big .mk.fg { fill: #5ee6a6; } .mini-court.big .mk.ft { fill: #8fcbff; } .mini-court.big .mk.x { font: 800 11px var(--mono); fill: #ff5c5c; }
.mini-court.big .rim { fill: none; stroke: #ff7a3d; stroke-width: 1.6; } .mini-court.big .rim.lit { stroke: #5ee6a6; stroke-width: 2.4; filter: drop-shadow(0 0 3px #5ee6a6); }
.mini-court.big .to { font: 800 12px var(--display); fill: #ffd166; letter-spacing: .14em; paint-order: stroke; stroke: #2a1407; stroke-width: 3px; }
.mini-court.big .fx-txt { font: 800 13px var(--mono); }
.mini-court.big .lastplay { font: 600 10.5px var(--sans); fill: #e8edf2; }
.mini-court.big .lastplay.pt, .mini-court.big .lastplay.pt3 { fill: #5ee6a6; } .mini-court.big .lastplay.ftm, .mini-court.big .lastplay.fta { fill: #8fcbff; }
.mini-court.big .lastplay.ftx, .mini-court.big .lastplay.foul { fill: #ff8585; } .mini-court.big .lastplay.to { fill: #ffd166; }
.pbp-layout { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; align-items: start; }
.pbp-layout.side-open { grid-template-columns: 196px minmax(0, 1fr); }
.pbp-side { display: none; position: sticky; top: 60px; background: var(--panel); border: 1px solid var(--line); border-radius: var(--r); padding: 8px 6px; max-height: calc(100vh - 80px); overflow: auto; }
.pbp-layout.side-open .pbp-side { display: block; }
.pbp-side h4 { margin: 2px 6px 8px; font: 700 11px var(--display); letter-spacing: .14em; text-transform: uppercase; color: #8a95a1; }
.pbp-side .lrow { display: flex; align-items: center; gap: 6px; width: 100%; text-align: left; background: transparent; border: 0; color: #c9d1d9; font: 500 13px/1.3 var(--sans); padding: 6px 8px; border-radius: 6px; cursor: pointer; }
.pbp-side .lrow:hover { background: #1b2229; } .pbp-side .lrow.on { background: #22303a; color: #fff; } .pbp-side .lrow.idle { opacity: .55; }
.pbp-side .lrow .nm { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .pbp-side .lrow .ct { font: 600 11px var(--mono); color: #8a95a1; } .pbp-side .lrow.on .ct { color: #e8edf2; }
.pbp-side .lrow .sg { width: 7px; height: 7px; border-radius: 50%; background: #5ee6a6; box-shadow: 0 0 5px #5ee6a6; flex: 0 0 7px; }
.pbp-side .side-note { padding: 4px 8px; }
.pbp-main { min-width: 0; }

/* ---- with the leagues sidebar open on a screen under 2,330 px the play-by-play column yields (the last play is on the court, the log in the detail) */
@media (max-width: 2329px) { .pbp-layout.side-open table.pbp { min-width: 1866px; } .pbp-layout.side-open table.pbp col.c-msg { width: 0; visibility: collapse; } .pbp-layout.side-open table.pbp td.pbp, .pbp-layout.side-open table.pbp thead th:last-child { display: none; } }

/* ---- the lead-TT column wide enough for MelBet's line (3 Oct) */
table.pbp col.c-tt { width: 104px; }
table.pbp { min-width: 2094px; }
@media (max-width: 2329px) { .pbp-layout.side-open table.pbp { min-width: 1890px; } }

/* ---- pace / late as projected finals, in both total cells (3 Oct) */
table.pbp td .pace { display: block; font: 500 11px/1.25 var(--mono); color: #c9d1d9; }
table.pbp td .pace .lbl { font: 600 9.5px/1 var(--display); letter-spacing: .1em; text-transform: uppercase; color: #8a95a1; margin: 0 4px 0 0; }
table.pbp td .pace b { color: #ffd166; font-size: 12px; }
table.pbp td .pace.over b { color: #5ee6a6; } table.pbp td .pace.under b { color: #ff8585; }

/* ---- the foul count at the limit (the opponent has the bonus) */
table.pbp td.team .sub b.overlimit { color: #ff5c5c; }

/* ---- a suspended line, greyed (3 Oct) */
table.pbp td .susp { color: #6f7a86; } table.pbp td .susp small { font: 600 9.5px/1 var(--display); letter-spacing: .1em; text-transform: uppercase; color: #b98a3a; }

/* ---- the book whose line the edge is priced on (3 Oct) */
table.pbp td.edge .bk { display: inline-block; font: 700 9.5px/1 var(--display); letter-spacing: .08em; padding: 2px 4px; border-radius: 3px; margin-right: 5px; background: #262d35; color: #c9d1d9; vertical-align: 1px; }
table.pbp td.edge .bk.melbet { color: #ffd166; }

/* ---------------------------------------------------------------- live football (3 Oct 2026) */
.fb-top h2 { margin: 4px 0 6px; font: 600 22px/1.1 'Barlow Condensed', sans-serif; letter-spacing: .02em; }
.fb-top h2 .muted { font: 400 13px/1 'IBM Plex Sans', sans-serif; margin-left: 8px; }
.fb-status { font-size: 13px; margin-bottom: 8px; } .fb-status .ok { color: #4cd38a; } .fb-status .warn { color: #ffd166; }
.fb-tools { display: flex; gap: 8px; align-items: flex-start; flex-wrap: wrap; margin-bottom: 6px; }
.fb-q { background: #0b0e12; border: 1px solid var(--line2); color: inherit; border-radius: 6px; padding: 5px 9px; width: 130px; font: inherit; }
.fb-chips { display: flex; gap: 6px; flex-wrap: wrap; } .fb-chips .chip.on { background: #1f6f4a; border-color: #2f9e6b; color: #fff; }
.fb-legend { font-size: 12px; line-height: 1.45; max-width: 1200px; margin-bottom: 10px; }
.fb-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(400px, 1fr)); gap: 12px; align-items: start; }
.fb-card { background: #12161b; border: 1px solid var(--line2); border-radius: 10px; padding: 10px 12px 10px; cursor: pointer; min-width: 0; }
.fb-card.val { border-color: #3f6f9e; } .fb-card.sig-arm { border-color: #b88a2a; } .fb-card.sig-on { border-color: #35c27a; box-shadow: 0 0 0 1px #35c27a, 0 0 18px rgba(53,194,122,.18); }
.fb-head { display: flex; gap: 10px; align-items: baseline; font-size: 12px; color: #9aa7b4; }
.fb-head .fb-per { margin-left: auto; color: #e8edf2; font-weight: 600; } .fb-clock { font: 700 17px/1 var(--mono); color: #fff; min-width: 46px; text-align: right; } .fb-clock.run { color: #7ee2a8; }
.fb-teams { margin: 6px 0 6px; } .fb-team { display: flex; align-items: center; gap: 8px; font-size: 15px; line-height: 1.5; }
.fb-team .fb-nm { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .fb-team.poss .fb-nm { color: #fff; font-weight: 600; }
.fb-pb { display: inline-block; width: 11px; height: 7px; border-radius: 50%; background: #a8632c; border: 1px solid #f1e6d8; margin-right: 6px; vertical-align: 1px; }
.fb-to { color: #ffd166; font-size: 9px; letter-spacing: 1px; } .fb-pts { font: 700 18px/1 var(--mono); color: #fff; min-width: 28px; text-align: right; }
.fb-field { border-radius: 6px; overflow: hidden; border: 1px solid #0a2c17; }
.fb-svg { display: block; width: 100%; height: auto; }
.fb-svg .grass { fill: #1f7a3d; } .fb-svg .ez { fill: #17602f; }
.fb-svg .yl { stroke: rgba(255,255,255,.55); stroke-width: 1; } .fb-svg .yl5 { stroke: rgba(255,255,255,.18); stroke-width: .7; }
.fb-svg .yn { fill: rgba(255,255,255,.6); font: 600 9px var(--mono); } .fb-svg .ezt { fill: rgba(255,255,255,.75); font: 700 9px 'Barlow Condensed', sans-serif; letter-spacing: .08em; }
.fb-svg .rz { fill: rgba(220,50,50,.22); transition: opacity .4s; } .fb-svg .drive { fill: rgba(255,214,10,.28); transition: all .9s ease; }
.fb-svg .los { stroke: #3aa0ff; stroke-width: 2; transition: all .9s ease; } .fb-svg .fd { stroke: #ffd60a; stroke-width: 2; transition: all .9s ease; }
.fb-svg .ballg { transition: transform .9s cubic-bezier(.3,.8,.3,1), opacity .3s; } .fb-svg .ball { fill: #8a4b1f; stroke: #f6e7d2; stroke-width: 1.2; } .fb-svg .lace { stroke: #fff; stroke-width: 1; }
.fb-svg .dir { fill: #fff; font-size: 9px; transition: all .9s ease; }
.fb-dd { font-size: 13px; margin: 6px 0 4px; min-height: 18px; }
.fb-sig { border-radius: 7px; padding: 6px 8px; margin: 6px 0; font-size: 12.5px; line-height: 1.45; background: #2a2412; border: 1px solid #6e5a1e; }
.fb-sig.on { background: #10301f; border-color: #2f9e6b; } .fb-sig-h { font-weight: 700; letter-spacing: .02em; color: #fff; }
.fb-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: #ffd166; margin-right: 6px; } .fb-sig.on .fb-dot { background: #35c27a; animation: fbpulse 1.2s infinite; }
@keyframes fbpulse { 0%, 100% { opacity: 1; } 50% { opacity: .35; } }
.fb-state { float: right; font: 600 10.5px/1.6 var(--mono); color: #ffd166; } .fb-sig.on .fb-state { color: #7ee2a8; }
.fb-out { font-size: 12.5px; margin: 4px 0; } .fb-bets { margin: 4px 0; } .fb-bet, .fb-sig-b { font: 12.5px/1.5 var(--mono); }
.fb-pos { color: #4cd38a; font-weight: 700; } .fb-flat { color: #e8edf2; } .fb-neg { color: #e06c6c; }
table.fb-lines { width: 100%; table-layout: fixed; border-collapse: collapse; font: 11.5px/1.6 var(--mono); margin-top: 8px; border-top: 1px solid var(--line2); }
table.fb-lines th { text-align: left; color: #9aa7b4; font-weight: 500; padding: 2px 0; white-space: nowrap; } table.fb-lines th:first-child { width: 74px; }
table.fb-lines td { padding: 2px 0; white-space: nowrap; overflow: hidden; } table.fb-lines tr + tr td, table.fb-lines tr + tr th { border-top: 1px solid rgba(255,255,255,.05); }
.fb-qt { display: grid; grid-template-columns: 42px 36px 36px; column-gap: 2px; } .fb-qt b { color: #fff; } .fb-qt span { color: #c9d3dd; }
.fb-betrow { display: grid; grid-template-columns: 34px minmax(0, 1fr) 62px 70px 58px; column-gap: 4px; align-items: baseline; }
.fb-betrow .w { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .fb-betrow .r { text-align: right; } .fb-betrow .p b { color: #fff; }
.fb-cards { grid-template-columns: repeat(auto-fill, minmax(430px, 1fr)); }
.fb-last { font-size: 12px; margin-top: 5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .fb-recent { font-size: 12px; margin-top: 6px; border-top: 1px solid var(--line2); padding-top: 5px; line-height: 1.5; }

/* live football: the play on the field, the drive, the log (3 Oct 2026, 15:45) */
.fb-svg .big { fill: #fff; font: italic 800 19px 'Barlow Condensed', sans-serif; letter-spacing: .04em; paint-order: stroke; stroke: rgba(0,0,0,.45); stroke-width: 3px; opacity: .92; }
.fb-svg .big.play { fill: #ffe9a8; font-size: 23px; animation: fbplay .5s ease-out; }
.fb-svg .big.k-touchdown, .fb-svg .big.k-fieldgoal, .fb-svg .big.k-pat { fill: #7ef0a6; } .fb-svg .big.k-turnover, .fb-svg .big.k-loss, .fb-svg .big.k-penalty { fill: #ff9a8a; } .fb-svg .big.k-first { fill: #ffd60a; }
@keyframes fbplay { 0% { opacity: 0; transform: translateY(6px); } 100% { opacity: 1; transform: translateY(0); } }
.fb-svg .sub { fill: rgba(255,255,255,.82); font: 600 8.5px var(--mono); letter-spacing: .06em; paint-order: stroke; stroke: rgba(0,0,0,.35); stroke-width: 2px; }
.fb-svg .chip2 { fill: #c9f5d8; font: 600 8.5px var(--mono); letter-spacing: .05em; paint-order: stroke; stroke: rgba(0,0,0,.4); stroke-width: 2px; }
.fb-svg .band { fill: rgba(255,255,255,.10); transition: all .9s ease; }
.fb-log { margin: 4px 0 6px; font: 12px/1.55 var(--mono); border-left: 2px solid var(--line2); padding-left: 8px; min-height: 18px; }
.fb-play { display: grid; grid-template-columns: 62px minmax(0, 1fr); column-gap: 6px; } .fb-play .t { color: #7d8a97; } .fb-play .x { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #d5dde5; }
.fb-play:first-child .x { color: #fff; } .fb-play.k-touchdown .x, .fb-play.k-fieldgoal .x { color: #7ef0a6; } .fb-play.k-turnover .x, .fb-play.k-penalty .x { color: #ff9a8a; } .fb-play.k-first .x { color: #ffd60a; } .fb-play.k-period .x, .fb-play.k-timeout .x { color: #9aa7b4; }
.fb-qt { grid-template-columns: 38px 33px 33px auto; } .fb-qt.old b, .fb-qt.old span { color: #6f7b87; } .fb-qt i { font-style: normal; font-size: 9.5px; color: #b88a2a; }
table.fb-lines th:first-child { width: 64px; }
.fb-cards { grid-template-columns: repeat(auto-fill, minmax(520px, 1fr)); }

table.fb-lines th:first-child { width: 80px; } /* fb label col */

.fb-hint { font-size: 12px; color: #b8a15a; margin: 2px 0 6px; }

.fb-svg .tvg { transition: opacity .3s; opacity: 0; } .fb-svg .tvbg { fill: rgba(8,12,16,.78); stroke: #6e5a1e; stroke-width: 1; } .fb-svg .tvt { fill: #ffd166; font: 700 9.5px var(--mono); letter-spacing: .06em; }
.fb-svg .tvg.tv .tvbg { fill: rgba(60,10,10,.86); stroke: #e0564a; } .fb-svg .tvg.tv .tvt { fill: #ffb3a8; } .fb-svg .tvg.to .tvt { fill: #fff; }
.fb-card.tv-break .fb-clock { color: #ff9a8a; }

.fb-warn { color: #ffb347; font-weight: 600; }

.fb-sig.watch { background: #15202b; border-color: #3f6f9e; } .fb-sig.watch .fb-dot { background: #6aa9e0; } .fb-sig.watch .fb-state { color: #9cc7ee; }
.fb-sig-n { font-size: 11.5px; margin-top: 2px; } .fb-sig-b.dim { opacity: .6; } .fb-card.sig-watch { border-color: #3f6f9e; }

.fb-watch { font-size: 12px; line-height: 1.45; color: #9fb4c8; margin: 4px 0; padding-left: 8px; border-left: 2px solid #3f6f9e; } .fb-watch b { color: #cfe2f3; font-weight: 600; }

.fb-fired { margin: 6px 0; border: 1px solid var(--line2); border-radius: 7px; padding: 5px 8px; background: #0f1418; }
.fb-fired-h { font: 600 10.5px/1.6 var(--mono); letter-spacing: .08em; color: #8fa0b0; }
.fb-fired-row { padding: 3px 0; font: 12px/1.45 var(--mono); border-top: 1px solid rgba(255,255,255,.05); opacity: .85; } .fb-fired-row:first-of-type { border-top: 0; }
.fb-fired-row.act { opacity: 1; } .fb-fired-row .h { display: grid; grid-template-columns: 112px minmax(0, 1fr) auto; column-gap: 6px; color: #9aa7b4; } .fb-fired-row .h .l { color: #e8edf2; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fb-fired-row .st { color: #b88a2a; } .fb-fired-row.act .st { color: #4cd38a; } .fb-fired-row.won .st { color: #4cd38a; font-weight: 700; } .fb-fired-row.lost .st { color: #e06c6c; font-weight: 700; } .fb-fired-row .b { font-size: 11px; }

/* a card that holds still (3 Oct 2026, 17:20) */
.fb-status1 { font-size: 12px; line-height: 1.45; color: #b8a15a; height: 35px; overflow: hidden; margin: 2px 0 4px; } .fb-status1 b { color: #e8edf2; font-weight: 600; } .fb-status1.on { color: #cfeedd; }
.fb-log { height: 76px; overflow: hidden; } .fb-card.open .fb-log { height: auto; }
.fb-out { min-height: 36px; }
.fb-fired-row.act { background: rgba(53,194,122,.10); border-radius: 4px; padding-left: 4px; padding-right: 4px; }

/* live football as a table, like the basketball tab (3 Oct 2026, 17:55) */
.fb-layout { display: grid; grid-template-columns: minmax(0, 1fr); gap: 14px; align-items: start; }
.fb-layout.has-sel { grid-template-columns: minmax(0, 1fr) 540px; }
.fb-detail { position: sticky; top: 8px; display: none; max-height: calc(100vh - 16px); overflow: auto; } .fb-layout.has-sel .fb-detail { display: block; }
.fb-detail .fb-card { cursor: default; } .fb-nosel { padding: 14px; border: 1px dashed var(--line2); border-radius: 8px; font-size: 12.5px; }
/* 6 Oct (one display for every sport): basketball's open game in the same right-hand panel — its stats and its log one above the other */
.fb-detail .pbp-detail { margin: 0; } .fb-detail .pbp-cols { grid-template-columns: minmax(0, 1fr); }
table.fb-table { table-layout: fixed; width: 100%; min-width: 1760px; }
table.fb-table td { padding: 6px 10px; vertical-align: top; height: 108px; overflow: hidden; white-space: normal; line-height: 1.4; }
table.fb-table tr.fb-row { cursor: pointer; }
table.fb-table td.pin { text-align: center; padding: 6px 2px; } table.fb-table button.pin { background: none; border: 0; color: #7d8a97; font-size: 17px; cursor: pointer; padding: 2px; } table.fb-table button.pin.on { color: #ffd166; }
table.fb-table td.time .live { font: 700 17px/1.2 var(--mono); color: #fff; } table.fb-table td.time .live.run [data-clock] { color: #7ee2a8; } table.fb-table td.time .per { color: #ffd166; font-size: 13px; }
table.fb-table td.time .lg { font-size: 11.5px; color: #9aa7b4; margin-top: 2px; }
.fb-stop { font: 600 10.5px/1.3 var(--mono); margin-top: 5px; color: #ffd166; min-height: 14px; } .fb-stop.tv { color: #ff9a8a; } .fb-stop.to { color: #fff; }
table.fb-table td.team .nm { font: 700 17px/1.25 var(--display); letter-spacing: .02em; color: #f4f6f8; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
table.fb-table td.team .sub { margin-top: 4px; }
table.fb-table td.score .sc { font: 700 21px/1.15 var(--mono); color: #fff; text-align: center; white-space: nowrap; } table.fb-table td.score .sep { color: #7d8a97; margin: 0 3px; } table.fb-table td.score .mg { font: 11px/1.3 var(--mono); color: #9aa7b4; text-align: center; margin-top: 5px; }
td.fbc-ball .bd { font: italic 800 19px/1.1 'Barlow Condensed', sans-serif; color: #fff; letter-spacing: .03em; min-height: 21px; } td.fbc-ball .sp { font-size: 12.5px; margin-top: 3px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } td.fbc-ball .dr { font: 11px/1.4 var(--mono); color: #9aa7b4; margin-top: 4px; }
table.fb-table td.fbc-field { padding: 5px 6px; } td.fbc-field .fb-field { width: 274px; }
td.fbc-play { font: 11.5px/1.55 var(--mono); } .fb-pl { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #aeb9c4; } .fb-pl .t { color: #7d8a97; margin-right: 6px; } .fb-pl:first-child { color: #fff; } .fb-pl b { font-weight: 600; }
.fb-pl.k-touchdown, .fb-pl.k-fieldgoal { color: #7ef0a6; } .fb-pl.k-turnover, .fb-pl.k-penalty { color: #ff9a8a; } .fb-pl.k-first { color: #ffd60a; }
.fb-ol { color: #b8a15a; font-size: 11px; margin-top: 3px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .fb-ol b { color: #e8edf2; }
.fb-bk { display: grid; grid-template-columns: 32px 40px 35px 35px auto; column-gap: 2px; font: 11.5px/1.6 var(--mono); white-space: nowrap; } .fb-bk i { font-style: normal; color: #9aa7b4; } .fb-bk b { color: #fff; } .fb-bk span { color: #c9d3dd; }
.fb-bk.old b, .fb-bk.old span { color: #6f7b87; } .fb-bk em { font-style: normal; font-size: 9.5px; color: #b88a2a; }
.fb-st { font-size: 12px; line-height: 1.35; color: #b8a15a; height: 33px; overflow: hidden; margin-bottom: 3px; } .fb-st b { color: #e8edf2; font-weight: 600; } .fb-st.on { color: #cfeedd; }
.fb-kb { display: grid; grid-template-columns: 60px 28px minmax(0, 1fr) 52px 46px; column-gap: 4px; font: 11.5px/1.6 var(--mono); color: #aeb9c4; white-space: nowrap; padding: 0 3px; }
.fb-kb .w { overflow: hidden; text-overflow: ellipsis; } .fb-kb .t { color: #7d8a97; } .fb-kb .r { text-align: right; color: #4cd38a; } .fb-kb .st { text-align: right; color: #b88a2a; }
.fb-kb.act { color: #fff; background: rgba(53,194,122,.16); border-radius: 3px; } .fb-kb.act .st, .fb-kb.won .st { color: #4cd38a; font-weight: 700; } .fb-kb.lost .st { color: #e06c6c; font-weight: 700; }

/* fb laptop */
table.fb-table { min-width: 1482px; }
td.fbc-field .fb-field { width: 232px; }
table.fb-table td { height: 108px; }
@media (max-width: 1779px) { table.fb-table col.c-play { width: 0; visibility: collapse; } table.fb-table th.c-play, table.fb-table td.fbc-play { display: none; } }
@media (min-width: 1780px) { table.fb-table { min-width: 1760px; } }
.fb-layout.has-sel { grid-template-columns: minmax(0, 1fr) 500px; }
@media (max-width: 2100px) { .fb-layout.has-sel { grid-template-columns: minmax(0, 1fr); } .fb-layout.has-sel .fb-detail { position: static; max-height: none; order: -1; max-width: 560px; } }

/* live football: the bets view (3 Oct 2026, 19:10) */
.fb-views { display: flex; gap: 6px; margin: 2px 0 8px; } .fb-views .chip { font-size: 13px; padding: 5px 12px; } .fb-views .chip.on { background: #1f6f4a; border-color: #2f9e6b; color: #fff; }
.fb-bets-top { margin-bottom: 8px; } .fb-recs { display: flex; gap: 18px; flex-wrap: wrap; margin: 8px 0 4px; font: 13px/1.5 var(--mono); } .fb-rec i { font-style: normal; color: #9aa7b4; margin-right: 4px; } .fb-bets-note { font-size: 12px; }
table.fb-bets-table { font-size: 13px; } table.fb-bets-table td { padding: 6px 10px; white-space: nowrap; vertical-align: top; font-family: var(--mono); } table.fb-bets-table td.l { font-family: inherit; }
table.fb-bets-table td .muted { font-size: 11.5px; } table.fb-bets-table td.st { font-weight: 700; color: #b88a2a; }
tr.fb-betline.won td.st { color: #4cd38a; } tr.fb-betline.lost td.st { color: #e06c6c; } tr.fb-betline.act td.st { color: #4cd38a; } tr.fb-betline.act td { background: rgba(53,194,122,.08); }
tr.fb-betline.won td:first-child { box-shadow: inset 3px 0 0 #35c27a; } tr.fb-betline.lost td:first-child { box-shadow: inset 3px 0 0 #e06c6c; }

.fb-imp { font: 11px/1 var(--mono); color: #8fb3d9; margin-left: 6px; }

/* fb signal column, large */
table.fb-table { min-width: 1490px; }
td.fbc-field .fb-field { width: 192px; }
table.fb-table td.fbc-sig { overflow: visible; white-space: normal; padding: 8px 12px; background: rgba(255,255,255,.015); border-left: 1px solid var(--line2); border-right: 1px solid var(--line2); }
#fb-layout table.fb-table th:nth-child(6), #bd-layout table.fb-table th:nth-child(8) { color: #fff; font-size: 13.5px; }
.fb-st { font-size: 14px; line-height: 1.4; height: auto; max-height: none; overflow: visible; color: #d9c98a; margin-bottom: 6px; } .fb-st b { color: #fff; font-weight: 700; } .fb-st.on { color: #dff5e8; font-size: 15px; } .fb-st .fb-pos { font-size: 15px; letter-spacing: .04em; padding: 1px 7px; border-radius: 4px; background: #1f6f4a; color: #fff; margin-right: 4px; }
.fb-kb { grid-template-columns: 64px 32px minmax(0, 1fr) 58px 54px; font: 13px/1.7 var(--mono); padding: 1px 5px; margin-top: 2px; white-space: normal; }
.fb-kb .w { overflow: visible; text-overflow: clip; white-space: normal; color: #e8edf2; } .fb-kb.act .w { color: #fff; font-weight: 600; } .fb-kb .st { font-weight: 700; }
table.fb-table td.team .nm { font-size: 15.5px; } td.fbc-ball .bd { font-size: 17px; } td.fbc-ball .sp, td.fbc-ball .dr { white-space: normal; }
.fb-bk { grid-template-columns: 30px 38px 33px 33px auto; font-size: 11px; }

/* every system in the row's signal cell (4 Oct): one line each; the observed greyed */
.fb-sigline { font-size: 13px; line-height: 1.5; margin: 1px 0; } .fb-sigline.watch { color: #c9d3dc; } .fb-sigline.arming { color: #8b97a3; }
.fb-sigline.obs { color: #7d8a97; font-size: 12px; } .fb-obs { font: 700 10px/1 var(--mono); letter-spacing: .04em; color: #7d8a97; border: 1px solid #44505c; border-radius: 3px; padding: 1px 4px; margin-right: 4px; }
.fb-kb.obs, .fb-fired-row.obs { opacity: .55; }
/* wide screens (32", 4 Oct): the spare width goes to the columns that truncate, not to "last plays" — only while no card is open beside the table */
@media (min-width: 2200px) {
  #fb-layout:not(.has-sel) table.fb-table { min-width: 2200px; }
  #fb-layout:not(.has-sel) table.fb-table colgroup col:nth-child(2) { width: 130px !important; }
  #fb-layout:not(.has-sel) table.fb-table colgroup col:nth-child(3), #fb-layout:not(.has-sel) table.fb-table colgroup col:nth-child(5) { width: 190px !important; }
  #fb-layout:not(.has-sel) table.fb-table colgroup col:nth-child(4) { width: 96px !important; }
  #fb-layout:not(.has-sel) table.fb-table colgroup col:nth-child(6) { width: 560px !important; }
  #fb-layout:not(.has-sel) table.fb-table colgroup col:nth-child(7) { width: 160px !important; }
  #fb-layout:not(.has-sel) table.fb-table colgroup col:nth-child(8) { width: 270px !important; }
  #fb-layout:not(.has-sel) table.fb-table colgroup col:nth-child(9), #fb-layout:not(.has-sel) table.fb-table colgroup col:nth-child(10) { width: 190px !important; }
  #fb-layout:not(.has-sel) td.fbc-field .fb-field { width: 256px; }
  #fb-layout:not(.has-sel) table.fb-table td.team .nm { font-size: 16.5px; }
}
/* the boards' row on wide screens (6 Oct): the court keeps its 304 px; the teams, the ball and the rules take the spare width in shares, the
   last plays the rest — the court near the middle at any width (2,200 px: ~52 %; 3,700 px: ~44 %) */
@media (min-width: 2200px) {
  #bd-layout:not(.has-sel) table.fb-table colgroup col:nth-child(2) { width: 150px !important; }
  #bd-layout:not(.has-sel) table.fb-table colgroup col:nth-child(3), #bd-layout:not(.has-sel) table.fb-table colgroup col:nth-child(5) { width: 12% !important; }
  #bd-layout:not(.has-sel) table.fb-table colgroup col:nth-child(4) { width: 110px !important; }
  #bd-layout:not(.has-sel) table.fb-table colgroup col:nth-child(6) { width: 8% !important; }
  #bd-layout:not(.has-sel) table.fb-table colgroup col:nth-child(8) { width: 20% !important; }   /* the odds (col 9) take the rest (6 Oct) */
  #bd-layout:not(.has-sel) table.fb-table td.team .nm { font-size: 16.5px; }
}

/* 6 Oct: the compact results view (the owner: "compact it to how it previously was … for other sports too") — the boards' and football's */
.bdk table { width: 100%; border-collapse: collapse; font: 12.5px/1.35 'IBM Plex Mono', monospace; }
.bdk th { text-align: left; color: #7f8892; font-weight: 500; border-bottom: 1px solid #2a3038; padding: 5px 8px; white-space: nowrap; }
.bdk td { border-bottom: 1px solid #1d2229; padding: 5px 8px; vertical-align: top; }
.bdk .muted { color: #7f8892; } .bdk .won { color: #5fd07a; font-weight: 600; } .bdk .lost { color: #ff7a7a; font-weight: 600; } .bdk .unsure { color: #d9b25a; } .bdk .pos { color: #5fd07a; }
.bdk .rec { display: flex; flex-wrap: wrap; gap: 10px; margin: 6px 0 14px; }
.bdk .rec > div { background: #151a20; border: 1px solid #232a32; border-radius: 8px; padding: 8px 12px; min-width: 170px; } .bdk .rec b { font: 600 18px 'Barlow Condensed', sans-serif; }
.bdk .wrap { overflow-x: auto; } .bdk tr.obs td { opacity: .6; }

/* 6 Oct (one display for every sport): where the open game cannot sit beside the table (under 2100 px) it spans the page above it, split —
   the court / field / rink and the score on the left, the log, the rules and the bets (basketball: its stats, lines and log) on the right */
.fb-detail .fb-log { max-height: 420px; overflow: auto; }
@media (max-width: 2100px) {
  .fb-layout.has-sel .fb-detail { max-width: none; }
  .fb-detail > .fb-card.open { display: grid; grid-template-columns: minmax(0, 540px) minmax(0, 1fr); grid-template-rows: repeat(4, min-content) 1fr; column-gap: 18px; align-items: start; }
  .fb-detail > .fb-card.open > * { grid-column: 1; } .fb-detail > .fb-card.open > .fb-rest { grid-column: 2; grid-row: 1 / -1; }
  .fb-detail > .pbp-detail { display: grid; grid-template-columns: minmax(0, 560px) minmax(0, 1fr); grid-template-rows: repeat(2, min-content) 1fr; column-gap: 18px; align-items: start; }
  .fb-detail > .pbp-detail > * { grid-column: 1; } .fb-detail > .pbp-detail > .pbp-cols { grid-column: 2; grid-row: 1 / -1; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
}

/* 6 Oct (the owner: "SEPARATE COLUMNS LIKE YOU HAVE | SIGNAL | SPREAD | TOTAL | TEAM TOTAL"): the odds columns ruled like the signal's */
#bd-layout table.fb-table td.fbc-odds { border-right: 1px solid var(--line2); padding: 8px 12px; background: rgba(255,255,255,.015); }
#bd-layout table.fb-table thead th:nth-child(n+8) { border-left: 1px solid var(--line2); padding-left: 12px; }
#bd-layout table.fb-table thead th:last-child { border-right: 1px solid var(--line2); }

/* 7 Oct (the owner: "give each column vertical lines"): the basketball live table, a rule between every column */
table.pbp th, table.pbp td { border-right: 1px solid var(--line2); }
table.pbp th:last-child, table.pbp td:last-child { border-right: 0; }

/* 7 Oct (the owner): the filters in a dropdown, the leagues as pills in the bar, the BET mark, the handicap column */
.pbp-bar { position: relative; }
.pbp-filters { position: relative; }
.pbp-filters > summary { list-style: none; cursor: pointer; user-select: none; }
.pbp-filters > summary::-webkit-details-marker { display: none; }
.pbp-filters[open] > summary { background: #22303a; color: #fff; }
.pbp-filter-menu { position: absolute; z-index: 20; top: calc(100% + 6px); left: 0; display: flex; flex-direction: column; gap: 6px; min-width: 280px; padding: 10px; background: var(--panel); border: 1px solid var(--line); border-radius: 10px; box-shadow: 0 10px 30px rgba(0,0,0,.45); }
.pbp-filter-menu .chip { justify-content: flex-start; }
.pbp-leagues { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.pbp-leagues .chip.lg { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; padding: 5px 9px; }
.pbp-leagues .chip.lg.on { background: #22303a; color: #fff; border-color: #3a4a58; }
.pbp-leagues .chip.lg.idle { opacity: .55; }
.pbp-leagues .chip.lg .ct { font: 600 10.5px var(--mono); color: #8a95a1; } .pbp-leagues .chip.lg.on .ct { color: #e8edf2; }
.pbp-leagues .chip.lg .sg { width: 7px; height: 7px; border-radius: 50%; background: #5ee6a6; box-shadow: 0 0 5px #5ee6a6; flex: 0 0 7px; }
table.pbp td.sigs .sig.bet.on { background: #7a3a00; border-color: #ff9a2a; color: #ffd9a8; font-weight: 700; letter-spacing: .06em; }
table.pbp col.c-sp { width: 150px; }
table.pbp td.sp { font: 600 13px/1.3 var(--mono); white-space: nowrap; }
table.pbp td.team .sub.lg { display: block; font: 500 10.5px/1.3 var(--sans); color: var(--ash); margin-top: 2px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 240px; }

/* 7 Oct (the owner: "unless i hover over i have no clue what you took"): the bet on its chip */
table.pbp td.sigs .sig.bet.on { display: inline-block; margin: 1px 3px 1px 0; letter-spacing: 0; font: 600 11px/1.5 var(--mono); }
table.pbp td.sigs .sig.bet.on i { font-style: normal; color: #ffc98a; opacity: .85; margin-left: 2px; }
table.pbp td.sigs { white-space: normal; }
/* 7 Oct, later (the owner: "a clear dodge signal … color the teams red, no bet"): the league gate's call from 4:15 left in the last period —
   NO BET: both names red, the row tinted; WAIT: the spread can still come; GO: a quote passes the gate now. Ungated games (college, NBA) keep the signal. */
table.pbp tr.dodge td { background: color-mix(in srgb, #ff5d5d 9%, transparent); }
/* 10 Oct (the owner: "it says it's open at 30.5 but its not"): the kept line is gone, the rule is on elsewhere — amber, the hover says where */
.fb-kb .st.moved, span.moved { color: #ffb04d; cursor: help; }
/* 10 Oct (the owner: "you have bet badge and grayed out next to it"): a market with a bet kept — framed in the bet chip's amber, never struck */
table.pbp td.edge.taken { box-shadow: inset 0 0 0 1px #d97a1e; background: color-mix(in srgb, #d97a1e 8%, transparent); }
/* 10 Oct (the owner: free throws "before and mid"): the side at the line — amber, a slow pulse while the attempts are still to come */
.tag.ftl { background: color-mix(in srgb, #ffb04d 22%, transparent); color: #ffb04d; font-size: 11px; animation: ftl-pulse 1.4s ease-in-out infinite; }
@keyframes ftl-pulse { 50% { opacity: .55; } }
/* 9 Oct (the owner: "if its finished remove it but not in a way that's annoying"): a finished game fades out where it stands, then leaves */
table.pbp tr.leaving td { opacity: 0; transition: opacity .6s ease; pointer-events: none; }
table.pbp tr.dodge td.team .nm { color: #ff6b6b; }
table.pbp tr.dodge td.team .nm::after { content: ' · NO BET'; font: 700 10px/1 var(--mono); color: #ff6b6b; letter-spacing: .04em; }
table.pbp td.sigs .sig.vd { font: 700 11px/1.5 var(--mono); letter-spacing: .04em; cursor: help; }
table.pbp td.sigs .sig.vd.go { color: #0b2016; background: #5ee6a6; border-color: #5ee6a6; }
table.pbp td.sigs .sig.vd.wait { color: #ffd166; border-color: #ffd166; background: color-mix(in srgb, #ffd166 12%, transparent); }
table.pbp td.sigs .sig.vd.dodge { color: #fff; background: #b3261e; border-color: #ff6b6b; }
table.pbp td.edge.nobet { opacity: .38; }
table.pbp td.edge.nobet .e1 b, table.pbp td.edge.nobet .roi { text-decoration: line-through; }

/* 10 Oct 2026, live.oddscontrol.org (server LIVE_ONLY=1): the live tabs only — no Games / Props, no feed socket status */
body.live-only [data-nav=games], body.live-only [data-nav=props], body.live-only #relay, body.live-only #plan { display: none; }
