/* Release 243: sportsbook-style game cards (owner: "like DraftKings or Fanatics cards, simple and clear like Stripe").
   Team rows × Spread / Total / Moneyline tiles; one thin model line; quiet header with no explainer boxes. */
.bt-page .bt-hero { padding: 4px 0 14px; }
.bt-page .bt-hero h1 { margin: 0 0 6px; }
.bt-page .bt-lead { max-width: 56ch; font-size: .9375rem; }
.bt-page .dw-view-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 0 0 10px; }
.bt-page .dw-view-heading .bt-views { margin: 0; }
.bt-page .bt-alert { display: block; margin: 6px 0 2px; padding: 0; border: 0; background: none; border-radius: 0; }
.bt-page .bt-alert .bt-alert-icon { display: none; }
.bt-page .bt-alert h2 { font-size: .9375rem; font-weight: 600; }
.bt-page .bt-alert p:empty { display: none; }
.bt-page .bt-alert p { font-size: .8125rem; }
.bt-page .bt-fresh { margin: 0 0 12px; }
.gx-fresh { font-size: .75rem; color: #63636b; }
.gx-fresh.is-stale { color: #92400e; }

.bt-g.gx { padding: 12px 16px 10px; border-radius: 12px; box-shadow: none; }
.bt-g.gx + .bt-g.gx { margin-top: 0; }
.gx-head { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; font-size: .75rem; color: #63636b; margin: 0 0 8px; }
.gx-head .bt-badge { font-size: .6875rem; font-weight: 500; padding: 1px 7px; border-radius: 999px; box-shadow: none; }
.gx-head .bt-badge.is-disagree { background: #f5f3ff; color: #6d28d9; border: 1px solid #ede9fe; }
.gx-head .bt-badge.is-value { background: #ecfdf5; color: #047857; border: 1px solid #d1fae5; }
.gx-head .bt-badge.is-amber { background: #fffbeb; color: #92400e; border: 1px solid #fef3c7; }
.gx-open { margin-left: auto; color: #18181b; font-weight: 500; text-decoration: none; white-space: nowrap; }
.gx-open:hover { text-decoration: underline; text-underline-offset: 3px; }

.gx-grid { display: grid; gap: 6px; }
.gx-row { display: grid; grid-template-columns: minmax(0, 1fr) repeat(3, minmax(84px, 128px)); gap: 6px; align-items: stretch; }
.gx-row.is-head { align-items: end; font-size: .6875rem; color: #63636b; text-align: center; }
.gx-row.is-head > span:first-child { text-align: left; }
.gx-team { display: flex; align-items: center; min-width: 0; font-size: .9375rem; font-weight: 500; color: #09090b; }
.gx-team .gx-full, .gx-team .gx-short { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gx-short { display: none; }
.gx-row > span[role="cell"] { display: grid; min-width: 0; }
.bt-tile.gx-tile { min-height: 46px; padding: 4px 6px; gap: 0; border: 0; border-radius: 8px; background: #f4f4f5; color: #09090b; text-decoration: none; line-height: 1.2; transition: background-color .12s ease; }
a.bt-tile.gx-tile:hover { background: #e4e4e7; }
a.bt-tile.gx-tile:focus-visible { outline: 2px solid #18181b; outline-offset: 2px; }
.bt-tile.gx-tile i { font-size: .75rem; color: #52525b; }
.bt-tile.gx-tile b { font-size: .875rem; font-weight: 600; }
.bt-tile.gx-tile small { font-size: .625rem; color: #63636b; }
.bt-tile.gx-tile.is-empty { background: #fafafa; }
.bt-tile.gx-tile.is-empty b { color: #d4d4d8; font-weight: 400; }
.gx-blank { display: block; }
.bt-g.gx.is-stale .bt-tile.gx-tile b { color: #a1a1aa; }

.gx-foot { display: flex; align-items: center; justify-content: space-between; gap: 8px 12px; margin-top: 8px; min-height: 32px; }
.gx-model { display: flex; flex-wrap: wrap; gap: 2px 14px; margin: 0; font-size: .75rem; color: #52525b; font-variant-numeric: tabular-nums; }
.gx-model b { font-weight: 600; color: #18181b; margin-right: 2px; }
.bt-track.gx-save { margin-left: auto; min-height: 32px; padding: 0 10px; border: 1px solid #e4e4e7; border-radius: 8px; background: #fff; font-size: .75rem; font-weight: 500; color: #18181b; cursor: pointer; }
.bt-track.gx-save:hover { background: #f4f4f5; }
.dw-rule-line.gx-rule { margin: 6px 0 0; padding-top: 6px; border-top: 1px solid #f4f4f5; font-size: .75rem; }

/* filter bar: toggle and sort on one line */
.bt-page .bt-bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 16px; }
@media (max-width: 600px) {
  .bt-page .dw-view-heading { flex-direction: row; align-items: center; flex-wrap: nowrap; }
  .bt-page .dw-view-heading .bt-views[data-bt-views] { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .bt-page .dw-view-heading .bt-views { flex: 1 1 auto; min-width: 0; }
  .bt-page .dw-view-heading .bt-linkbtn { flex: none; white-space: nowrap; font-size: .8125rem; }
  .bt-page .bt-bar { flex-wrap: nowrap; }
  .bt-page .bt-bar .bt-mini select { min-width: 0; }
  .bt-g.gx { padding: 10px 12px 8px; }
  .gx-row { grid-template-columns: minmax(0, 1fr) repeat(3, 66px); gap: 4px; }
  .gx-grid { gap: 4px; }
  .gx-full { display: none; }
  .gx-short { display: inline; }
  .gx-team { font-size: .875rem; }
  .bt-tile.gx-tile { min-height: 44px; padding: 3px 2px; }
  .bt-tile.gx-tile b { font-size: .8125rem; }
  .bt-tile.gx-tile i { font-size: .6875rem; }
  .bt-tile.gx-tile small { font-size: .5625rem; }
}
@media (max-width: 360px) {
  .gx-row { grid-template-columns: minmax(0, 1fr) repeat(3, 58px); }
}
@media (prefers-reduced-motion: reduce) { .bt-tile.gx-tile { transition: none; } }
.bt-page .dw-view-heading [hidden] { display: none !important; }
/* release 244: settings row names your book; a better price elsewhere is shown where you look, and the badge says what to do */
.bt-page .dw-settings > summary [data-bt-settings-sum] b { font-weight: 600; color: #18181b; }
.bt-page .dw-settings > summary [data-bt-settings-sum] { color: #52525b; }
.bt-page .dw-settings > summary .gx-change { margin-left: 4px; color: #18181b; text-decoration: underline; text-underline-offset: 3px; }
.bt-page .dw-settings:not(.has-book) > summary [data-bt-settings-sum] b { color: #1d4ed8; }
.bt-tile.gx-tile .gx-better { color: #047857; font-weight: 600; }
.bt-tile.gx-tile.has-better { box-shadow: inset 0 0 0 1px #a7f3d0; }
a.gx-badge-go { text-decoration: none; }
a.gx-badge-go:hover { text-decoration: underline; text-underline-offset: 2px; }
a.gx-badge-go span { font-weight: 400; opacity: .8; }
@media (max-width: 600px) {
  .bt-tile.gx-tile .gx-better { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
}
/* release 245: other sports use the same card; one market column */
.gx-row.is-one { grid-template-columns: minmax(0, 1fr) minmax(96px, 148px); }
button.bt-tile.gx-tile { width: 100%; font: inherit; cursor: pointer; }
button.bt-tile.gx-tile:hover:not(:disabled) { background: #e4e4e7; }
button.bt-tile.gx-tile:disabled { cursor: default; }
button.gx-open { background: none; border: 0; padding: 0; font: inherit; font-weight: 500; cursor: pointer; text-decoration: none; }
button.gx-open:hover { text-decoration: underline; text-underline-offset: 3px; }
button.gx-badge-go { font: inherit; font-size: .6875rem; font-weight: 500; cursor: pointer; }
button.gx-badge-go:hover { text-decoration: underline; text-underline-offset: 2px; }
.bt-g.gx.mo-card .gx-team .gx-short { display: none; }
@media (max-width: 600px) {
  .gx-row.is-one { grid-template-columns: minmax(0, 1fr) 110px; }
  .bt-g.gx.mo-card .gx-team .gx-full { display: inline; white-space: normal; }
}
/* release 246: Mitra's rule state as a coloured tag (Qualifies green, Pass grey, Not checked/Check/Not judged amber) */
.mx-tag { display: inline-flex; align-items: center; gap: 5px; margin-right: 4px; padding: 1px 8px 1px 7px; border-radius: 999px; font-size: .6875rem; font-weight: 600; line-height: 1.6; vertical-align: 1px; white-space: nowrap; border: 1px solid transparent; }
.mx-tag i { width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.mx-tag.is-yes { background: #ecfdf5; border-color: #a7f3d0; color: #047857; }
.mx-tag.is-pass { background: #f4f4f5; border-color: #e4e4e7; color: #52525b; }
.mx-tag.is-wait { background: #fffbeb; border-color: #fde68a; color: #92400e; }
.dw-rule-line b { font-weight: 600; color: #18181b; }
.dw-rule-line small { display: block; margin-top: 2px; color: #63636b; }
/* release 246: game page tables: numeric headers line up with their numbers */
.bt .gp-table thead th:nth-child(n+3) { text-align: right; }
.gp-num [data-gp-roll], .gp-table [data-gp-roll], .gp-bar [data-gp-roll] { font-variant-numeric: tabular-nums; }
/* release 247: a very large forecast-vs-market gap says what it usually means */
.gx-model .gx-gap { color: #92400e; font-weight: 500; cursor: help; }
/* release 323 (owner: "collapsed by default, users don't know where to click"): the settings bar looks like a control —
   a bordered bar with a chevron, blue while no sportsbook is picked — and its selects show their arrow */
.bt-page .dw-settings > summary { display: flex; align-items: center; gap: 8px; min-height: 44px; padding: 10px 14px; border: 1px solid #d4d4d8; border-radius: 10px; background: #fff; list-style: none; font-size: .875rem; }
.bt-page .dw-settings > summary::-webkit-details-marker { display: none; }
.bt-page .dw-settings > summary::after { content: ""; flex: none; margin-left: auto; width: .5rem; height: .5rem; border: solid #52525b; border-width: 0 1.75px 1.75px 0; transform: translateY(-2px) rotate(45deg); transition: transform .15s; }
.bt-page .dw-settings[open] > summary::after { transform: translateY(2px) rotate(-135deg); }
.bt-page .dw-settings > summary:hover { border-color: #a1a1aa; }
.bt-page .dw-settings > summary:focus-visible { outline: 2px solid #1d4ed8; outline-offset: 2px; }
.bt-page .dw-settings:not(.has-book) > summary { border-color: #93c5fd; background: #eff6ff; }
.bt-page .dw-settings:not(.has-book) > summary::after { border-color: #1d4ed8; }
.bt-page .dw-settings .bt-field select { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2371717a' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") !important; background-repeat: no-repeat !important; background-position: right .6rem center !important; padding-right: 2rem !important; }

/* release 346: the whole game card opens the game (a tap outside its prices and buttons) */
.bt-page article.bt-g.gx { cursor: pointer; -webkit-tap-highlight-color: transparent; transition: border-color .15s ease, box-shadow .15s ease; }
@media (hover: hover) { .bt-page article.bt-g.gx:hover { border-color: #d4d4d8; box-shadow: 0 1px 3px rgba(8, 17, 28, .06); } }
.bt-page article.bt-g.gx:active { border-color: #a1a1aa; }

/* release 350: other sports, priced events first; the unpriced ones fold into one line */
.bt .bt-later-h { margin: 28px 0 0; font-size: 1rem; font-weight: 600; color: #18181b; }
.bt .bt-fold { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 16px; max-width: 46rem; margin: 16px 0 0; padding: 12px 14px; border: 1px dashed #d4d4d8; border-radius: .5rem; background: #fafafa; font-size: .875rem; color: #52525b; }
.bt .bt-fold p { margin: 0; flex: 1 1 18rem; }
.bt .bt-fold b { color: #18181b; font-weight: 600; }

/* release 358: outside the US, a note when a list or game still shows the US apps */
.bt .bt-intl { max-width: 46rem; margin: 12px 0 0; padding: 10px 14px; border-radius: .5rem; background: rgba(25,239,174,.10); border: 1px solid rgba(25,239,174,.45); color: #08111C; font-size: .875rem; line-height: 1.45; }
.bt .bt-intl[hidden] { display: none; }
.bt .bt-intl .bt-linkbtn { margin-left: 4px; }

/* release 359 (20-bettor review: "no game until the second screen" on phones; the explainer and the gap line) */
.bt .bt-quick-sum { display: none; }
.bt .gx-why { margin: 6px 0 0; font-size: 13px; line-height: 1.4; color: #52525b; }
.bt .bt-suggest { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 16px; margin: 0 0 14px; padding: 12px 14px; border: 1px solid #e4e4e7; border-radius: 12px; background: #fff; }
.bt .bt-suggest[hidden] { display: none; }
.bt .bt-suggest p { margin: 0; flex: 1 1 260px; }
.bt .bt-suggest div { display: flex; flex-wrap: wrap; gap: 8px; }
@media (max-width: 640px) {
  body:has(main.bt) #sx-signin { padding: 10px 12px; }
  body:has(main.bt) #sx-signin .sxs-line { display: none; }
  .bt .bt-hero .bt-lead, .bt .dw-view-heading .bt-linkbtn { display: none; }
  .bt .bt-hero h1 { font-size: 22px; line-height: 1.2; margin-bottom: 2px; }
  .bt .bt-quick { margin-top: 6px; padding-top: 8px; }
  .bt .bt-quick-sum { display: flex; width: 100%; align-items: center; justify-content: space-between; gap: 12px; min-height: 44px; padding: 8px 12px;
    border: 1px solid #e4e4e7; border-radius: 10px; background: #fff; color: #18181b; font: 500 14px/1.3 Inter, system-ui, sans-serif; text-align: left; cursor: pointer; }
  .bt .bt-quick-sum span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .bt .bt-quick-sum b { flex: none; text-decoration: underline; text-decoration-color: #19EFAE; text-decoration-thickness: 2px; text-underline-offset: 3px; }
  .bt .bt-quick:not(.is-open) > .bt-field, .bt .bt-quick:not(.is-open) > .bt-qmore { display: none; }
}

/* release 359 (owner: "forecasts only, no betting" mode): no sportsbooks, prices, odds or betting tools anywhere on Games */
.bt.is-nobet .bt-views, .bt.is-nobet .bt-bar, .bt.is-nobet [data-bt-book], .bt.is-nobet .bt-field:has([data-bt-book]),
.bt.is-nobet .bt-field:has([data-bt-odds]), .bt.is-nobet .bt-qmore, .bt.is-nobet [data-bt-intl], .bt.is-nobet .gx-rule,
.bt.is-nobet [data-gp-tab="odds"], .bt.is-nobet [data-gp-panel="odds"] { display: none !important; }
.bt .nb-title { margin: 4px 0 8px; font-size: 16px; font-weight: 600; }
.bt .nb-title span { color: #63636b; font-weight: 400; }
.bt .nb-cap { margin: 0 0 6px; font-size: 12px; color: #63636b; text-transform: uppercase; letter-spacing: .04em; }
.bt .nb-row { display: grid; grid-template-columns: minmax(90px, 1fr) 2fr auto; align-items: center; gap: 12px; padding: 6px 0; }
.bt .nb-bar { height: 8px; border-radius: 4px; background: #f4f4f5; overflow: hidden; }
.bt .nb-bar i { display: block; height: 100%; border-radius: 4px; background: #08111C; }
.bt .nb-num { text-align: right; min-width: 64px; }
.bt .nb-num b { display: block; font-size: 16px; }
.bt .nb-num small { display: block; color: #63636b; font-size: 12px; }

/* release 370 (design panel): tap targets. The card's "Open game", "How accurate?", the back link and the Pro lock get a 44px hit
   area (negative margins keep the cards the same height); inline note links get at least 24px. */
.bt a.gx-open, .bt button.gx-open { display: inline-flex; align-items: center; min-height: 44px; margin-block: -13px; padding-inline: 4px; margin-inline-end: -4px; }
.bt a.gx-rec { display: inline-flex; align-items: center; min-height: 44px; margin-block: -13px; }
.bt .gp-back { margin: 6px 0 0; }
.bt .gp-back a { display: inline-flex; align-items: center; gap: 4px; min-height: 44px; padding-inline-end: 8px; }
/* the Pro lock keeps its plan-chip look (sx_system.css paints it): the chip itself is 24px tall and an invisible layer around it
   makes the touch area 44px, so the row does not grow */
.bt a.bt-lock { position: relative; min-height: 24px; box-sizing: border-box; }
.bt a.bt-lock::after { content: ""; position: absolute; left: -2px; right: -2px; top: 50%; height: 44px; transform: translateY(-50%); }
.bt .bt-note a, .bt .dw-source a, .bt .dw-rule-line a { display: inline-block; padding-block: 5px; margin-block: -5px; }
@media (max-width: 640px), (pointer: coarse) {
  .bt .bt-fams button { min-height: 44px; }
}
/* release 370 (design panel): the "Model and market disagree" note goes under the forecast line on narrow cards, not beside it */
.bt .gx-foot { flex-wrap: wrap; }
.bt .gx-foot > .gx-model { flex: 1 1 auto; min-width: 0; }
.bt .gx-foot > .gx-why { order: 3; flex: 1 1 100%; margin: 0; }
/* release 370 (design panel): book names at 12px or more; capture times at 4.5:1 or better */
.bt-tile.gx-tile small, .bt .bt-tile small { font-size: 12px; line-height: 1.25; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
@media (max-width: 600px) { .bt-tile.gx-tile small { font-size: 12px; } .gx-row { grid-template-columns: minmax(0, 1fr) repeat(3, 72px); } }
@media (max-width: 360px) { .gx-row { grid-template-columns: minmax(0, 1fr) repeat(3, 64px); } }
.bt td.bt-muted, .bt .bt-table .bt-muted { color: #63636b; }
.bt .dw-game-table td small, .bt .dw-game-table th small { font-size: 12px; }
/* release 370 (design panel): the game page's every-book table sits open under the best-price block */
.bt .gp-books { margin: 14px 0 6px; scroll-margin-top: 76px; }
.bt .gp-books h2 { margin: 0 0 6px; font-size: 1rem; font-weight: 600; }
.bt .gp-books h2 small { font-size: 12px; font-weight: 400; color: #63636b; margin-left: 6px; }
.bt .gp-books .bt-table th[scope="row"] { font-size: 14px; }
/* release 370: reserve the game's height while it loads, so the page does not jump when it arrives (CLS) */
.bt-gp [data-gp-panel="odds"] > .bt-skeleton { height: 520px; }
.bt-gp [data-ph]:not(:has(svg)):not(:has(.ph-empty)) { min-height: 460px; }
@media (max-width: 640px) {
  .bt-gp select, .bt-gp input:not([type="checkbox"]):not([type="radio"]) { font-size: 16px !important; }
}
/* release 370: the game's header gets its date, both names and the capture time after the data arrives; its usual height is kept
   from the start so the prices below do not jump */
.bt-gp .gp-head { min-height: 104px; }
@media (max-width: 640px) { .bt-gp .gp-head { min-height: 141px; } }
/* release 370 (design panel: "no account banner on Games"; it also pushed the page down 130px after load): Games and the game
   page keep sign-in in the header only. The body margin is set here, in the page's first stylesheets, so the page does not
   move 8px when the site styles arrive. */
body.bt-page #sx-signin { display: none !important; }
body.bt-page { margin: 0; }