/* LineScout UI polish layer (design pass, Oct 2026). Loaded LAST on both sport pages (after app.css / nhl.css)
   so NFL and NHL stay identical. Visual only: no markup, data or behaviour changes. Uses tokens.css. */

/* ---------- page width: one desktop grid for every tab ---------- */
@media (min-width: 1100px) {
  .wrap { max-width: 1200px; }
  .layout { grid-template-columns: minmax(0, 1fr) 340px; gap: var(--sp-6); }
  .games:has(> .card:only-of-type) { grid-template-columns: 1fr; }   /* one game: no empty half */
}

/* ---------- depth over borders ---------- */
.card { border-color: transparent; box-shadow: var(--sh-1), inset 0 0 0 1px var(--line); }
.st { border-color: transparent; box-shadow: inset 0 0 0 1px var(--line); }

/* ---------- top nav + header buttons: 44px hit areas ---------- */
.spnav a { position: relative; }
.spnav a::after { content: ""; position: absolute; inset: -5px -2px; }
.hnav, .hi { min-width: 40px; min-height: 40px; position: relative; }
/* bigger tap area on the round icon buttons only (2026-10-15: this used to be on .hnav itself, an invisible layer
   over the whole bar that swallowed every click on the sport pages) */
.hnav .hi { position: relative; }
.hi::after { content: ""; position: absolute; inset: -2px; }
/* the page-layout rule ".main { order: 1 }" (wide screens) also matched the My bets button (class "main"), moving it last */
.hnav .hb.main { order: 0; }

/* ---------- tabs: one quiet segmented style ---------- */
.btabs { background: var(--surface-1); border-color: transparent; box-shadow: inset 0 0 0 1px var(--line); }
.btabs .btab { min-height: var(--tap); font-size: var(--fs-14); color: var(--text-3); transition: color var(--t-fast) var(--ease), background var(--t-fast) var(--ease); }
.btabs .btab:hover { color: var(--text); }
.btabs .btab.on { background: var(--surface-3); color: var(--text); box-shadow: var(--sh-1); }
.btabs .btab.on::after { display: none; }
.weektabs { border-color: transparent; box-shadow: inset 0 0 0 1px var(--line); }
.wtab .wn { color: var(--text-4); }
.wtab.on .wn { color: #334155; }

/* ---------- Our Picks tiles + Trends tiles: one selected style ---------- */
.op-tile, .tr-pill { border-color: transparent !important; background: var(--surface-2); box-shadow: inset 0 0 0 1px var(--line);
  min-height: 56px; transition: background var(--t-fast) var(--ease), box-shadow var(--t-fast) var(--ease); }
.op-tile:hover, .tr-pill:hover { background: var(--surface-3); }
.op-tile .op-ti { color: var(--opc, var(--text-3)); font-size: var(--fs-16); }
.op-tile small, .tr-pill small { color: var(--text-3); }
.op-tile.on, .tr-pill.on { background: var(--text) !important; box-shadow: none !important; }
.op-tile.on b, .op-tile.on .op-tn, .tr-pill.on b { color: var(--bg) !important; }
.op-tile.on small, .tr-pill.on small { color: #7C8BA1; }
.op-tile.on .op-ti { color: var(--bg); }
.tr-pill b .ic { color: var(--text-3); margin-right: 2px; } .tr-pill.on b .ic { color: var(--bg); }
.op-tile.op-parlays { --opc: var(--info); }

/* ---------- pick row: bet → chance + price → one reason ---------- */
.row { gap: var(--sp-3); padding: var(--sp-3) var(--sp-4); transition: background var(--t-fast) var(--ease); }
.row:hover { background: rgba(255,255,255,.025); }
.row.sel { background: var(--win-dim); box-shadow: inset 3px 0 0 var(--win); }
.row .pill { font-size: var(--fs-11); padding: 2px 8px; letter-spacing: .02em; justify-self: start; }
.row .bet { font-size: var(--fs-16); font-weight: 650; color: var(--text); line-height: 1.3; }
.row .why { font-size: var(--fs-12); color: var(--text-3); line-height: 1.4; margin-top: 2px;
  display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; }
.row.open .why { -webkit-line-clamp: unset; display: block; }
.row .pct { font-size: var(--fs-20); font-weight: 750; letter-spacing: -.01em; }
.row .prob .bar { height: 3px; }
.row .odds { font-size: var(--fs-14); color: var(--text); }
.row .odds small { color: var(--text-4); font-size: var(--fs-11); }
.row .add { width: 32px; height: 32px; border: 0; background: var(--surface-4); color: var(--text-2); font-size: var(--fs-16); }
.row .add:hover { background: var(--win-dim); color: var(--win); }
.row.sel .add, .row .add.on { background: var(--win); color: var(--bg); }
.row .whybtn { font-size: var(--fs-12); color: var(--text-3); border-color: var(--line-strong); }
.row .reasons { background: var(--surface-1); border: 0; }
.row + .row { box-shadow: 0 -1px 0 var(--line); }
.row.sel + .row { box-shadow: 0 -1px 0 var(--line); }
.op-it > .row, .op-it > .sl-r { border-top: 0 !important; }
.op-it + .op-it > .row { box-shadow: 0 -1px 0 var(--line); }
@media (min-width: 1100px) { .row:not(.graded) { grid-template-columns: 64px minmax(0, 1fr) 104px 76px 32px; } }
@media (max-width: 1099px) { .row:not(.graded) > .prob .pct { font-size: var(--fs-20); } }

/* ---------- icons inside labels ---------- */
.ic { opacity: .9; }
.rb-ic .ic, .rp-t .ic, .pg-t .ic, .card-t .ic { color: var(--text-3); margin-right: 2px; }
.ask-ic .ic { width: 20px; height: 20px; color: var(--win); }

/* ---------- empty states ---------- */
.empty { color: var(--text-3); font-size: var(--fs-14); line-height: 1.55; padding: var(--sp-8) var(--sp-6); }
.op-tiles, .op-tiles.n6 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 520px) { .op-tiles, .op-tiles.n6 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.op-tile b { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* ---------- Our Picks filters + game group header ---------- */
.op-dd { border: 0 !important; box-shadow: inset 0 0 0 1px var(--line); min-height: 40px; }
.op-dd span { color: var(--text-3); }
.op-gh { border-bottom-color: var(--line) !important; }
.op-gh b, .op-gh strong { white-space: nowrap; }
.op-m { border-top-color: var(--line) !important; color: var(--text-3); }
@media (max-width: 520px) {
  .op-bar { display: grid !important; grid-template-columns: 1fr 1fr 1fr; gap: 6px; }
  .op-dd { flex: initial !important; flex-direction: column; align-items: stretch; gap: 0; border-radius: var(--r-md); padding: 6px 8px; min-width: 0; }
  .op-dd span { font-size: var(--fs-11); letter-spacing: .08em; }
  .op-dd select { width: 100%; min-width: 0; padding: 2px 0; text-overflow: ellipsis; }
  .op-gh { flex-wrap: wrap; row-gap: 2px; }
  .op-gh .op-n { margin-left: 0; flex-basis: 100%; }
}

/* ---------- board glance tiles (mobile): record is the headline, full width, no empty half ---------- */
@media (max-width: 1099px) {
  .glance .gk-record { grid-column: 1 / -1; }
  .glance .gl-row { border: 0 !important; box-shadow: inset 0 0 0 1px var(--line); }
}

/* ---------- fewer borders: chips, badges, groups use tone instead ---------- */
.fchip { border-color: transparent !important; background: var(--surface-3); color: var(--text-2); transition: background var(--t-fast) var(--ease), color var(--t-fast) var(--ease); }
.fchip:hover { background: var(--surface-4); color: var(--text); }
.fchip.on { background: var(--text) !important; color: var(--bg) !important; }
.seg { border-color: transparent; background: var(--surface-1); box-shadow: inset 0 0 0 1px var(--line); }
.whybtn { border: 0 !important; background: var(--surface-3) !important; color: var(--text-2) !important; text-decoration: none; min-height: 28px; }
.row:hover .whybtn, .whybtn:hover { background: var(--surface-4) !important; color: var(--text) !important; }
.row.open .whybtn { background: var(--win-dim) !important; color: var(--win) !important; }
.bk { border-color: transparent !important; background: var(--surface-3); }
.shop { border-color: transparent !important; background: var(--info-dim); }
.ovt { border-color: transparent; background: var(--surface-3); }
.ovt .v { font-size: var(--fs-24); }
.pg { border: 0 !important; border-left: 3px solid var(--pgc) !important; background: var(--surface-1); box-shadow: none; }
.subh { border-top-color: var(--line) !important; color: var(--text-3); }

/* ---------- bet slip (NFL .slip + NHL .nslip look the same) ---------- */
.slip, .nslip.docked { border-color: transparent !important; }
.slip .note, .ns-empty { color: var(--text-3); font-size: var(--fs-13); line-height: 1.5; }
.slip-eic { display: block; width: 22px; height: 22px; margin-bottom: 6px; color: var(--text-4); }
.empty-slip .note, .ns-empty { padding: 4px 0 2px; }
.slip-x { min-width: 44px; min-height: 44px; margin: -10px -12px -10px 0; border: 0; border-radius: var(--r-sm); background: none; color: var(--text-3); font-size: 24px; line-height: 1; cursor: pointer; }
.slip-x:hover { background: var(--surface-4); color: var(--text); }
.slip .tile { border-color: transparent !important; background: var(--surface-3); }
.slip .tile .v { font-family: var(--mono); font-variant-numeric: tabular-nums; }
.legs .x { min-width: 32px; min-height: 32px; border-radius: var(--r-pill); }

/* ---------- Results ---------- */
.rs-tile { border-color: transparent !important; background: var(--surface-3); transition: background var(--t-fast) var(--ease); }
.rs-tile:hover { background: var(--surface-4); }
.rs-tile.on { background: var(--surface-4); box-shadow: inset 0 0 0 1.5px var(--text) !important; }
.rs-tile .rs-tt .ic { color: var(--text-3); }
.rs-rec { font-family: var(--mono); font-variant-numeric: tabular-nums; letter-spacing: -.01em; }
.rs-rec small { white-space: nowrap; }
.rs-scope { flex-wrap: nowrap !important; overflow-x: auto; scrollbar-width: none; }
.rs-scope::-webkit-scrollbar { display: none; }
.rs-scope > * { flex: none; }
.rb { border-top: 0 !important; border-right: 0 !important; border-bottom: 0 !important; background: var(--surface-2); }
.rb-ic .ic { color: var(--text-4); }
.rp-day { border-top-color: var(--line) !important; }
.rp-up { border-color: transparent !important; background: var(--warn-dim); }
.cal { border-color: transparent !important; background: var(--surface-1); }
.cal-w { color: var(--text-3); }
.cal-d { border-color: transparent !important; background: var(--surface-2); }
.cal-d i { color: var(--text-3); }
.cal-d.g { background: rgba(78,238,82,.07); box-shadow: inset 0 -2px 0 rgba(78,238,82,.5); }
.cal-d.r { background: rgba(251,113,133,.06); box-shadow: inset 0 -2px 0 rgba(251,113,133,.45); }
.cal-d.n { background: var(--surface-2); }
.cal-d.on { outline: 2px solid var(--text); }
.uh-b { border-color: transparent !important; }
.uh-r { border-top-color: var(--line) !important; }
.uh-a, .uh-x, .uh-e, .cal-k, .rb-s { color: var(--text-3); }
@media (max-width: 600px) {
  .rs-tiles, .rs-tiles.n5 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .rs-tiles.n5 > :first-child { grid-column: 1 / -1; }
  .cal { margin-left: 10px; margin-right: 10px; padding: 8px; }
  .cal-g { gap: 3px; }
  .cal-d { min-height: 48px; padding: 4px; }
  .cal-d b { font-size: var(--fs-12); }
}
.rs-rec { white-space: nowrap; }
@media (max-width: 600px) {
  .rs-tile .rs-rec { font-size: var(--fs-20); }
  .rs-tiles.n5 > :first-child .rs-rec { font-size: var(--fs-24); }
  .rs-tile .rs-rec small { display: block; margin: 2px 0 0; }
}

/* ---------- player page: the chance first, chart sized sanely ---------- */
.rhead .card-b { display: flex; flex-direction: column; }
.rhead .card-b > .lspred { order: 1; }
.rhead .card-b > .rchart, .rhead .card-b > .empty { order: 2; }
.rhead .card-b > .summary, .rhead .card-b > :not(.rh):not(.rchips):not(.rctl):not(.lspred):not(.rchart):not(.empty) { order: 3; }
.rhead .card-b > .rh, .rhead .card-b > .rchips, .rhead .card-b > .rctl { order: 0; }
.rchart { max-height: 260px; }
.lspred { border-color: transparent !important; background: var(--win-dim); }
.lspred .lsp-row b { font-size: var(--fs-24); }
.rchips { flex-wrap: nowrap !important; overflow-x: auto; scrollbar-width: none;
  -webkit-mask-image: linear-gradient(90deg, #000 85%, transparent); mask-image: linear-gradient(90deg, #000 85%, transparent); }
.rchips::-webkit-scrollbar { display: none; }
.rchips > * { flex: none; }

/* ---------- team page: header never overflows; tabs in one row ---------- */
.th-id { min-width: 0; } .th-id > div { min-width: 0; }
.th-chips .chip, .ss-chip { white-space: normal; max-width: 100%; }
.th-next { border-color: transparent !important; background: var(--surface-3); }
.t-tabs { flex-wrap: nowrap !important; overflow-x: auto; scrollbar-width: none; }
.t-tabs::-webkit-scrollbar { display: none; }
.t-tabs > * { flex: none; }

/* ---------- Trends ---------- */
.hv-x { color: var(--text-3) !important; opacity: 1 !important; }
.tr-pills { gap: var(--sp-2); }
@media (max-width: 520px) { .tr-pills, .tr-pills.n4, .tr-pills.n3 { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } }
.sc-f select, .sc-f input { min-height: 40px; }

/* ---------- mobile tab bar + top nav (matches the home page's bar in hub.css) ---------- */
@media (max-width: 1099px) {
  #tabbar { border-top-color: var(--line); background: rgba(4,8,13,.9); }
  .tb { color: var(--text-3); font-size: var(--fs-11); gap: 4px; min-height: 52px; transition: color var(--t-fast) var(--ease); }
  .tb svg { width: 22px; height: 22px; stroke-width: 1.7; padding: 3px 12px; box-sizing: content-box; border-radius: var(--r-pill); transition: background var(--t-fast) var(--ease); }
  .tb.on { color: var(--text); }
  .tb.on svg { stroke: var(--win); background: var(--win-dim); }
  .badge { top: 0; left: calc(50% + 10px); font-size: var(--fs-11); }
}
.spnav a { min-height: 36px; display: inline-flex; align-items: center; }
.spnav a:not(.on):hover { background: var(--surface-3); }
.hi { border-color: transparent !important; background: var(--surface-3) !important; }
.hi:hover { background: var(--surface-4) !important; }
.brand { border-bottom-color: var(--line); }

/* ---------- QA pass: tap targets (36px visible, 44px hit area) ---------- */
.fchip.sm, .seg button, .gtabs .fchip, .rp-win button { min-height: 36px; }
.gl-add, .linkbtn.gl-add { min-height: 36px; display: inline-flex; align-items: center; padding: 0 12px; }
.add, .row .add { position: relative; }
.add::after { content: ""; position: absolute; inset: -6px; }
footer a, .foot a, .legal a { display: inline-block; padding: 8px 4px; }
.whybtn { min-height: 32px; }
.mono small, .pct small { font-size: max(11px, .85em); }
.jump a { min-height: 36px; display: inline-flex; align-items: center; }
.linkbtn { min-height: 32px; }
.th .seg button, .t-tabs + * .seg button { min-height: 36px; }
small { font-size: max(11px, .85em); }
.gbd-links a { display: inline-flex; align-items: center; min-height: 32px; }
.ov-key { margin: 8px 0 4px; font-size: var(--fs-12); color: var(--text-3); line-height: 1.5; } .ov-key b { color: var(--text-2); font-weight: 600; }

/* ---------- polish pass 2 ---------- */
/* boot skeleton shaped like the board (search, record tiles, tabs, game cards) */
.boot-sk { display: grid; gap: var(--sp-3); padding-top: var(--sp-2); }
.boot-tiles { display: grid; grid-template-columns: 1fr 1fr; gap: var(--sp-3); }
@media (min-width: 1100px) { .boot-sk { max-width: 836px; } }

/* Hot Bets rows: name + bet on one line, game on the next; no 4-line wraps on phones */
.hot2-r { box-shadow: 0 -1px 0 var(--line); border: 0 !important; }
.hot2-b > b, .hot2-b .hot2-m { white-space: nowrap; }
.hot2-b small { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: var(--text-3); }
@media (max-width: 760px) { .hot2-b { min-width: 0; overflow: hidden; } .hot2-b > b { display: inline; } }

/* Screener: borderless table, zebra rows, sticky header */
.sc-t .sc-r { border-top: 0 !important; }
.sc-t .sc-r:not(.sc-hd):nth-child(even) { background: rgba(255,255,255,.02); }
.sc-t .sc-hd { position: sticky; top: 64px; z-index: 2; background: var(--surface-2); box-shadow: 0 1px 0 var(--line); }
@media (min-width: 1100px) { .sc-t .sc-hd { top: 82px; } }

/* Season table rows: full 44px tap height */
.ss-r { min-height: var(--tap); }

/* NHL player: stacked section header, chip row hints that it scrolls */
.pp-hero ~ .card > .card-h { flex-wrap: wrap; row-gap: 2px; }
.pp-hero ~ .card > .card-h .card-r { flex-basis: 100%; margin-left: 0; text-align: left; }
.pp-hero ~ .card .chips { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none;
  -webkit-mask-image: linear-gradient(90deg, #000 85%, transparent); mask-image: linear-gradient(90deg, #000 85%, transparent); }
.pp-hero ~ .card .chips::-webkit-scrollbar { display: none; }
.pp-hero ~ .card .chips > * { flex: none; }

/* ---------- "How LineScout works" guide (NFL #guide, NHL #nguide) ---------- */
@keyframes gd-in { from { opacity: 0; transform: translateY(12px) scale(.985); } to { opacity: 1; transform: none; } }
#guide .gd, #nguide .nm-box { background: var(--surface-1); border: 0; box-shadow: var(--sh-3), inset 0 0 0 1px var(--line-strong); border-radius: 20px; animation: gd-in var(--t-slow) var(--ease) both; }
#guide .gd { width: min(600px, 100%); overflow: hidden; }
#guide .gd-h { padding: 20px 22px 6px; }
#guide .gd-h h2 { font-size: var(--fs-24); font-weight: 750; letter-spacing: -.01em; }
#guide .gd-x { width: 44px; height: 44px; color: var(--text-3); }
#guide .gd-x:hover { background: var(--surface-3); color: var(--text); }
#guide .gd-b { padding: 0 22px 8px; }
.gd-lede { margin: 0 0 var(--sp-4); font-size: var(--fs-14); color: var(--text-3); line-height: 1.5; }
.gd-g { background: var(--surface-2); border-radius: var(--r-lg); padding: var(--sp-3) var(--sp-4) var(--sp-1); margin-bottom: var(--sp-3); box-shadow: inset 0 0 0 1px var(--line); }
#guide .gd-sec { margin: 0 0 2px; color: var(--text-3); letter-spacing: .12em; }
#guide .gd-i { padding: 10px 0 12px; border-bottom: 0; }
#guide .gd-i + .gd-i { box-shadow: 0 -1px 0 var(--line); }
#guide .gd-i b { font-size: var(--fs-16); font-weight: 650; }
#guide .gd-i p { color: var(--text-2); line-height: 1.55; max-width: 62ch; }
#guide .gd-legal { color: var(--text-3); padding: 0 2px; }
#guide .gd-f { padding: 12px 22px 20px; box-shadow: 0 -1px 0 var(--line); background: var(--surface-1); }
#guide .gd-ok { background: linear-gradient(135deg, #4EEE52, #1FAF2E); border-radius: var(--r-md); min-height: 48px; }
@media (max-width: 640px) {
  #guide { place-items: end center; padding: 0; }
  #guide .gd { width: 100%; max-height: 92dvh; border-radius: 20px 20px 0 0; }
  #guide .gd-f { padding-bottom: calc(16px + env(safe-area-inset-bottom)); }
  #guide .gd-h { padding: 14px 18px 4px; }
  #guide .gd-h::before { content: ""; position: absolute; top: 7px; left: 50%; width: 36px; height: 4px; margin-left: -18px; border-radius: 4px; background: var(--line-strong); }
  #guide .gd-b { padding: 0 16px 8px; }
}
/* NHL guide: same card look */
#nguide .nm-box { width: min(600px, 100%); }
#nguide .nc-h { padding: 18px 20px 6px; font-size: var(--fs-20); }
#nguide .nc-h button { min-width: 44px; min-height: 44px; border-radius: var(--r-md); }
#nguide .nm-body.guide { gap: 0; padding: 4px 16px 18px; }
#nguide .guide p { background: var(--surface-2); padding: 12px 14px; margin: 0 0 8px; border-radius: var(--r-md); box-shadow: inset 0 0 0 1px var(--line); line-height: 1.55; }
@media (max-width: 640px) { #nguide { place-items: end center; padding: 0; } #nguide .nm-box { border-radius: 20px 20px 0 0; max-height: 92dvh; } }

/* ---------- Results view (resultsview.js, NFL + NHL): record = Picks only ---------- */
.rv-hero { display: grid; grid-template-columns: minmax(0, 340px) minmax(0, 1fr); gap: var(--sp-6); align-items: center; padding: var(--sp-6); margin-bottom: 0; }
.rv-k { font-size: var(--fs-11); font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--text-3); }
.rv-big { font-family: var(--mono); font-variant-numeric: tabular-nums; font-size: 48px; font-weight: 750; letter-spacing: -.02em; line-height: 1.05; margin: 6px 0 4px; }
.rv-hero .pos, .rv-sec .pos, .rv-proof .pos { color: var(--win); } .rv-hero .neg, .rv-sec .neg, .rv-proof .neg { color: var(--loss); } .rv-hero .flat, .rv-sec .flat { color: var(--text-2); }
.rv-sub { font-size: var(--fs-14); color: var(--text-2); } .rv-sub b { font-family: var(--mono); font-weight: 650; }
.rv-plain { margin-top: var(--sp-3); font-size: var(--fs-14); color: var(--text-2); background: var(--surface-3); border-radius: var(--r-md); padding: var(--sp-3) var(--sp-4); }
.rv-plain b { font-family: var(--mono); }
.rv-rec, .rv-rule { margin-top: var(--sp-3); font-size: var(--fs-13); color: var(--text-3); } .rv-rec b { color: var(--text-2); font-family: var(--mono); font-weight: 600; }
.rv-rule { margin-top: 6px; }
.rv-chart { position: relative; min-height: 180px; }
.rv-chart svg { display: block; width: 100%; overflow: visible; touch-action: pan-y; }
.rv-chart .zero { stroke: var(--line-strong); stroke-dasharray: 3 4; } .rv-chart .grid { stroke: var(--line); }
.rv-chart .ax { fill: var(--text-3); font: 11px var(--mono); }
.rv-chart .ln { fill: none; stroke-width: 2.25; stroke-linejoin: round; stroke-linecap: round; }
.rv-chart .dd { fill: rgba(251,113,133,.035); } .rv-chart .dot { stroke: var(--bg); stroke-width: 2; }
.rv-tip { position: absolute; pointer-events: none; transform: translate(-50%, -115%); background: var(--surface-4); box-shadow: var(--sh-2); border-radius: var(--r-sm);
  padding: 6px 10px; font-size: var(--fs-12); white-space: nowrap; opacity: 0; transition: opacity var(--t-fast) var(--ease); }
.rv-tip.on { opacity: 1; } .rv-tip b { font-family: var(--mono); }
.rv-key { display: flex; flex-wrap: wrap; gap: var(--sp-4); margin-top: var(--sp-2); font-size: var(--fs-12); color: var(--text-3); }
.rv-key span { display: inline-flex; align-items: center; gap: 6px; }
.rv-key i { display: inline-block; width: 12px; height: 12px; border-radius: 50%; }
.rv-key .k-line { border-radius: 3px; background: var(--win); } .rv-key .k-line.neg { background: var(--loss); } .rv-key .k-dd { border-radius: 3px; background: rgba(251,113,133,.18); }
.rv-key .k-said { box-shadow: inset 0 0 0 2px var(--text-2); } .rv-key .k-hit { background: var(--win); } .rv-key .k-under { background: var(--loss); } .rv-key .k-same { background: var(--surface-4); }
.rv-sec { margin-top: var(--sp-8); }
.rv-sec h2 { margin: 0 0 4px; font-size: var(--fs-20); font-weight: 700; color: var(--text); }
.rv-lede { margin: 0 0 var(--sp-4); font-size: var(--fs-14); color: var(--text-3); max-width: 62ch; }
.rv-two { display: grid; grid-template-columns: 1fr 1fr; gap: var(--sp-6); }
.rv-empty { padding: var(--sp-6); text-align: center; color: var(--text-3); font-size: var(--fs-14); }
.rv-mt { padding: var(--sp-2) 0; margin: 0; }
.rv-mr { display: grid; grid-template-columns: minmax(0, 1.3fr) 72px minmax(110px, 1.4fr) 72px; gap: var(--sp-3); align-items: center; padding: 12px var(--sp-4); min-height: var(--tap); }
.rv-mr + .rv-mr { box-shadow: 0 -1px 0 var(--line); }
.rv-n { font-weight: 650; font-size: var(--fs-14); display: flex; align-items: center; gap: 8px; color: var(--text); } .rv-n .ic { color: var(--text-3); }
.rv-n small { display: block; font-weight: 500; color: var(--text-3); font-size: var(--fs-12); }
.rv-wl { font-family: var(--mono); font-size: var(--fs-13); color: var(--text-2); text-align: right; }
.rv-u { font-family: var(--mono); font-size: var(--fs-16); font-weight: 700; text-align: right; }
.rv-div { position: relative; height: 10px; }
.rv-div::before { content: ""; position: absolute; left: 50%; top: -4px; bottom: -4px; width: 1px; background: var(--line-strong); }
.rv-div i { position: absolute; top: 0; height: 10px; border-radius: 3px; } .rv-div i.p { left: 50%; background: var(--win); } .rv-div i.m { right: 50%; background: var(--loss); }
.rv-roi { font-size: var(--fs-11); color: var(--text-3); text-align: center; margin-top: 4px; font-family: var(--mono); }
.rv-sv { padding: var(--sp-4); margin: 0; }
.rv-sr { display: grid; grid-template-columns: 112px minmax(0, 1fr) 76px; gap: var(--sp-3); align-items: center; min-height: 40px; }
.rv-sn { font-size: var(--fs-13); font-weight: 600; color: var(--text-2); }
.rv-sp { font-family: var(--mono); font-size: var(--fs-13); color: var(--text); text-align: right; } .rv-sp small { color: var(--text-3); }
.rv-track { position: relative; height: 20px; }
.rv-track .seg { position: absolute; top: 9px; height: 2px; background: rgba(78,238,82,.5); } .rv-track .seg.under { background: rgba(251,113,133,.5); }
.rv-track .said, .rv-track .hit { position: absolute; top: 4px; width: 12px; height: 12px; margin-left: -6px; border-radius: 50%; }
.rv-track .said { background: var(--surface-1); box-shadow: inset 0 0 0 2px var(--text-2); } .rv-track .hit { background: var(--win); } .rv-track .hit.under { background: var(--loss); }
.rv-scale { display: flex; justify-content: space-between; margin: 6px 88px 0 124px; font: 11px var(--mono); color: var(--text-3); }
.rv-proof { display: flex; align-items: center; gap: var(--sp-6); padding: var(--sp-4) var(--sp-6); margin-top: var(--sp-6); }
.rv-proof .rv-big { font-size: var(--fs-32); margin: 0; }
.rv-pb { flex: 1; min-width: 0; } .rv-pb p { margin: 0; font-size: var(--fs-14); color: var(--text-2); max-width: 70ch; } .rv-pb p b { color: var(--text); }
.rv-clv { display: flex; gap: 2px; height: 10px; border-radius: 5px; overflow: hidden; margin-top: var(--sp-3); }
.rv-clv i { display: block; height: 100%; } .rv-clv .cb { background: var(--win); } .rv-clv .cs { background: var(--surface-4); } .rv-clv .cw { background: var(--loss); }
.rv-weeks { display: flex; gap: var(--sp-2); overflow-x: auto; scrollbar-width: none; padding: 2px 0 var(--sp-3); }
.rv-weeks::-webkit-scrollbar { display: none; }
.rv-wk { flex: none; min-width: 104px; min-height: 56px; border: 0; border-radius: var(--r-md); padding: 8px 12px; text-align: left; cursor: pointer; color: var(--text); font: inherit;
  background: var(--surface-2); box-shadow: inset 0 0 0 1px var(--line); transition: background var(--t-fast) var(--ease); }
.rv-wk:hover { background: var(--surface-3); }
.rv-wk b { display: block; font-size: var(--fs-13); } .rv-wk span { font-family: var(--mono); font-size: var(--fs-13); font-weight: 650; }
.rv-wk.up { box-shadow: inset 0 -3px 0 rgba(78,238,82,.55), inset 0 0 0 1px var(--line); } .rv-wk.dn { box-shadow: inset 0 -3px 0 rgba(251,113,133,.5), inset 0 0 0 1px var(--line); }
.rv-wk .pos { color: var(--win); } .rv-wk .neg { color: var(--loss); } .rv-wk .flat { color: var(--text-2); }
.rv-wk.on { background: var(--text); color: var(--bg); } .rv-wk.on span { color: var(--bg); }
.rv-fl { display: flex; gap: var(--sp-2); margin: var(--sp-2) 0 var(--sp-3); }
.rv-day { margin: 0 0 var(--sp-3); overflow: hidden; padding: 0; }
.rv-dh { display: flex; align-items: baseline; justify-content: space-between; gap: var(--sp-3); padding: 12px var(--sp-4); background: var(--surface-3); }
.rv-dh b { font-size: var(--fs-14); color: var(--text); } .rv-dh span { font-family: var(--mono); font-size: var(--fs-13); color: var(--text-3); }
.rv-dh em { font-style: normal; font-weight: 700; margin-left: 8px; } .rv-dh .pos { color: var(--win); } .rv-dh .neg { color: var(--loss); }
.rv-br { display: grid; grid-template-columns: minmax(0, 1fr) 64px 64px 72px; gap: var(--sp-3); align-items: center; padding: 10px var(--sp-4); min-height: var(--tap); }
.rv-br + .rv-br { box-shadow: 0 -1px 0 var(--line); }
.rv-b { font-size: var(--fs-14); font-weight: 600; color: var(--text); overflow-wrap: anywhere; }
.rv-b small { display: block; font-size: var(--fs-12); color: var(--text-3); font-weight: 500; }
.rv-nir { color: var(--warn); font-weight: 600; }
.rv-o, .rv-uu { font-family: var(--mono); font-size: var(--fs-13); text-align: right; } .rv-o { color: var(--text-2); } .rv-uu { font-weight: 700; }
.rv-uu.pos { color: var(--win); } .rv-uu.neg { color: var(--loss); } .rv-uu.flat { color: var(--text-3); }
.rv-res { justify-self: center; } .rv-res:not(.win):not(.loss) { background: var(--line); color: var(--text-2); }
.rv-more { width: 100%; margin-top: var(--sp-2); } .rv-more-n { padding: 10px var(--sp-4); font-size: var(--fs-12); color: var(--text-3); box-shadow: 0 -1px 0 var(--line); }
@media (max-width: 860px) {
  .rv-hero { grid-template-columns: 1fr; padding: var(--sp-4); gap: var(--sp-4); } .rv-big { font-size: 40px; }
  .rv-two { grid-template-columns: 1fr; gap: 0; }
}
@media (max-width: 520px) {
  .rv-mr { grid-template-columns: minmax(0, 1fr) 64px 64px; padding: 12px var(--sp-3); } .rv-wl { display: none; }
  .rv-sr { grid-template-columns: 88px minmax(0, 1fr) 64px; } .rv-scale { margin: 6px 76px 0 100px; }
  .rv-br { grid-template-columns: minmax(0, 1fr) 56px 60px; padding: 10px var(--sp-3); } .rv-o { display: none; }
  .rv-proof { flex-direction: column; align-items: flex-start; gap: var(--sp-2); padding: var(--sp-4); }
}

/* Results: closing-line value and the learning review (resultsview.js, NBA / CFB / UFC) */
.rv-close { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px 12px; padding: 10px 0; border-top: 1px solid var(--line, rgba(255,255,255,.06)); }
.rv-close:first-of-type { border-top: 0; }
.rv-close > div b { display: block; font-size: var(--fs-14, 14px); }
.rv-close small { color: var(--text-3); font-size: 12px; }
.rv-close > span { font-size: 20px; font-weight: 700; text-align: right; }
.rv-close > small.mono { grid-column: 2; text-align: right; }
.rv-learn { margin: 0; padding-left: 18px; color: var(--text-2); font-size: var(--fs-14, 14px); line-height: 1.55; overflow-wrap: anywhere; }
.rv-learn li + li { margin-top: 6px; }
.rv-learn .rv-st { color: var(--text-3); }

/* Legal footer: keep the 16px side gutter on phones (every sport page) */
footer.legal { padding: 0 16px; box-sizing: border-box; }

/* Check a slip sheet on NBA / CFB / UFC (slipcheck.js): same frame as the NFL sheet (#guide) */
#sc-sheet { position: fixed; inset: 0; z-index: 90; display: grid; place-items: center; padding: 16px; }
#sc-sheet[hidden] { display: none; }
#sc-sheet .sc-tip { margin: 6px 0 8px; }

/* Free tier (tier.js): the Pro lock where a number was removed, the note on top, the "What Pro adds" sheet */
.ls-prolock { display: inline-flex; align-items: center; min-height: 24px; padding: 0 8px; border-radius: 100px; border: 1px solid var(--win-line, rgba(78,238,82,.3));
  background: var(--win-dim, rgba(78,238,82,.08)); color: var(--win, #4EEE52); font: 700 11px/1 inherit; letter-spacing: .04em; cursor: pointer; vertical-align: middle; }
.ls-freebar { max-width: 1240px; margin: 8px auto 0; padding: 10px 16px; box-sizing: border-box; display: flex; flex-wrap: wrap; gap: 4px 10px; align-items: center;
  font-size: 13px; color: var(--text-2, #CBD5E1); border-bottom: 1px solid var(--line, rgba(255,255,255,.06)); }
.ls-freebar b { color: var(--text, #F1F5F9); }
#ls-pro-sheet { position: fixed; inset: 0; z-index: 95; display: grid; place-items: center; padding: 16px; }
#ls-pro-sheet[hidden] { display: none; }
.ls-pro-list { margin: 0 0 12px; padding-left: 18px; color: var(--text-2, #CBD5E1); line-height: 1.55; font-size: 14px; }
.ls-pro-list li + li { margin-top: 8px; }

/* ---------- How LineScout works: a tour (sections rail + one pane at a time) ---------- */
#guide .gd.gd2 { width: min(860px, 100%); max-height: min(88dvh, 640px); }
.gd2 .gd-h { align-items: flex-start; padding: 22px 24px 14px; border-bottom: 1px solid var(--line); }
.gd2-k { font-size: 11px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--green); margin-bottom: 4px; }
.gd2-wrap { display: grid; grid-template-columns: 210px minmax(0, 1fr); min-height: 0; min-width: 0; flex: 1; }
.gd2-wrap > * { min-width: 0; }
#guide .gd.gd2 { max-width: 100%; min-width: 0; }
.gd2-nav { display: flex; flex-direction: column; gap: 2px; padding: 14px 10px; border-right: 1px solid var(--line); overflow: auto; }
.gd2-tab { display: flex; align-items: center; gap: 10px; min-height: 40px; padding: 0 12px; border: 0; border-radius: 10px; background: none; cursor: pointer;
  font: 600 13.5px/1.2 inherit; font-family: inherit; color: var(--text-3, #94A3B8); text-align: left; transition: background .2s, color .2s; }
.gd2-tab svg { width: 17px; height: 17px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.gd2-tab:hover { background: var(--surface-3); color: var(--text, #F1F5F9); }
.gd2-tab.on { background: var(--green-dim, rgba(78,238,82,.08)); color: var(--text, #F1F5F9); box-shadow: inset 3px 0 0 var(--green); }
.gd2-tab.on svg { stroke: var(--green); }
.gd2-tab:focus-visible, .gd2-prev:focus-visible { outline: 2px solid var(--green); outline-offset: 2px; }
.gd2-body { overflow: auto; padding: 22px 26px 18px; min-height: 0; }
.gd2-pane { animation: gd2In .35s cubic-bezier(.16,1,.3,1) both; }
@keyframes gd2In { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
.gd2-pane h3 { margin: 0 0 6px; font-size: 22px; font-weight: 750; letter-spacing: -.01em; color: var(--text, #F1F5F9); }
.gd2-lede { margin: 0 0 18px; max-width: 58ch; font-size: 14.5px; line-height: 1.55; color: var(--text-2, #CBD5E1); }
.gd2-cards { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.gd2-card { display: flex; gap: 12px; padding: 14px; border-radius: 14px; background: var(--surface-2); box-shadow: inset 0 0 0 1px var(--line); }
.gd2-ic { display: grid; place-items: center; flex: none; width: 34px; height: 34px; border-radius: 10px; background: var(--green-dim, rgba(78,238,82,.08)); box-shadow: inset 0 0 0 1px var(--green-line, rgba(78,238,82,.25)); }
.gd2-ic svg { width: 17px; height: 17px; fill: none; stroke: var(--green); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.gd2-card b { display: block; font-size: 14px; color: var(--text, #F1F5F9); }
.gd2-card p { margin: 3px 0 0; font-size: 13px; line-height: 1.5; color: var(--text-3, #94A3B8); }
.gd2-ex { margin: 0 0 16px; padding: 16px; border-radius: 16px; background: var(--bg, #04080D); box-shadow: inset 0 0 0 1px var(--line); }
.gd2-f { display: flex; align-items: center; gap: 10px; padding: 14px 24px 18px; border-top: 1px solid var(--line); }
.gd2-step { margin-right: auto; font: 600 12px var(--mono, ui-monospace, monospace); color: var(--text-3, #64748B); font-variant-numeric: tabular-nums; }
.gd2-f .gd-ok { width: auto; min-width: 120px; padding: 0 24px; }
.gd2-prev { min-height: 46px; padding: 0 18px; border-radius: var(--r-md, 10px); border: 0; background: none; box-shadow: inset 0 0 0 1px var(--line-strong); color: var(--text, #F1F5F9); font: 600 15px inherit; font-family: inherit; cursor: pointer; }
.gd2-prev:hover { background: var(--surface-3); }
.gd2 .gd-legal { margin-top: 18px; }
/* examples */
.gx-pick { display: grid; gap: 8px; }
.gx-top { display: flex; justify-content: space-between; gap: 12px; } .gx-top b { font-size: 14px; color: var(--text, #F1F5F9); }
.gx-odds { font: 700 14px var(--mono, ui-monospace, monospace); color: var(--text, #F1F5F9); }
.gx-bar { height: 5px; border-radius: 5px; background: rgba(255,255,255,.07); overflow: hidden; } .gx-bar i { display: block; height: 100%; background: var(--green); border-radius: 5px; }
.gx-row { display: flex; justify-content: space-between; font-size: 12.5px; color: var(--text-3, #94A3B8); }
.gx-row em, .gx-slip b { font-style: normal; font-family: var(--mono, ui-monospace, monospace); font-weight: 700; color: var(--text, #F1F5F9); }
.gx-verdict { justify-self: start; padding: 4px 10px; border-radius: 100px; font-size: 12px; font-weight: 600; color: var(--green); background: var(--green-dim, rgba(78,238,82,.08)); box-shadow: inset 0 0 0 1px var(--green-line, rgba(78,238,82,.3)); }
.gx-tiers { display: flex; flex-wrap: wrap; gap: 6px; }
.gx-tiers span { padding: 6px 12px; border-radius: 100px; font-size: 12.5px; font-weight: 600; color: var(--text-3, #94A3B8); box-shadow: inset 0 0 0 1px var(--line-strong); }
.gx-tiers span.on { color: #04130c; background: var(--green); box-shadow: none; } .gx-tiers small { margin-left: 6px; font-weight: 500; opacity: .75; }
.gx-slip { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.gx-slip div { padding: 10px 12px; border-radius: 12px; background: var(--surface-2); box-shadow: inset 0 0 0 1px var(--line); }
.gx-slip small { display: block; font-size: 11px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--text-3, #64748B); margin-bottom: 4px; }
.gx-slip b { font-size: 20px; } .gx-slip b.ok { color: var(--green); }
@media (max-width: 720px) {
  #guide .gd.gd2 { max-height: 92dvh; }
  .gd2-wrap { grid-template-columns: 1fr; grid-template-rows: auto minmax(0, 1fr); }
  .gd2-nav { flex-direction: row; padding: 10px 12px; border-right: 0; border-bottom: 1px solid var(--line); scrollbar-width: none; }
  .gd2-nav::-webkit-scrollbar { display: none; }
  .gd2-tab { flex: none; min-height: 36px; border-radius: 100px; }
  .gd2-tab.on { box-shadow: inset 0 0 0 1px var(--green-line, rgba(78,238,82,.35)); }
  .gd2-body { padding: 18px 16px 14px; } .gd2-cards { grid-template-columns: 1fr; }
  .gd2-f { padding: 12px 16px 16px; }
}
@media (prefers-reduced-motion: reduce) { .gd2-pane { animation: none; } }
#guide { grid-template-columns: minmax(0, 1fr); }

/* ---------- NFL context panels (nflctx.js): Game day, player role, team profile. Shared by Pro and Free ---------- */
.nx { display: grid; gap: var(--sp-5); container-type: inline-size; }
.nx-sec { display: grid; gap: var(--sp-3); }
.nx-sec + .nx-sec { padding-top: var(--sp-5); border-top: 1px solid var(--line); }
.nx-h { display: flex; align-items: baseline; justify-content: space-between; gap: var(--sp-3); flex-wrap: wrap; }
.nx-h h4 { margin: 0; font-size: var(--fs-11); font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--text-3); }
.nx-h span { font-size: var(--fs-12); color: var(--text-4); }
.nx-h-s { margin-top: var(--sp-2); }
.nx-2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sp-3); }
.nx-logo { width: 22px; height: 22px; border-radius: 6px; flex: none; }
.nx-empty, .nx-ok { margin: 0; font-size: var(--fs-13); color: var(--text-3); }
.nx-ok { color: var(--green); }
.nx-src { margin: 0; font-size: var(--fs-12); line-height: 1.5; color: var(--text-4); }
.nx-load { display: flex; gap: 6px; padding: var(--sp-4) 0; }
.nx-load i { width: 6px; height: 6px; border-radius: 50%; background: var(--text-4); animation: nxDot 1s var(--ease) infinite; }
.nx-load i:nth-child(2) { animation-delay: .15s; } .nx-load i:nth-child(3) { animation-delay: .3s; }
@keyframes nxDot { 50% { opacity: .25; transform: translateY(-2px); } }
/* availability */
.nx-team { background: var(--surface-2); border-radius: var(--r-md); box-shadow: inset 0 0 0 1px var(--line); padding: var(--sp-3); display: grid; gap: 2px; align-content: start; min-width: 0; }
.nx-team-h { display: flex; align-items: center; gap: var(--sp-2); padding-bottom: var(--sp-2); margin-bottom: 2px; border-bottom: 1px solid var(--line); }
.nx-team-h b { font-size: var(--fs-14); color: var(--text); }
.nx-team-h span { margin-left: auto; font-size: var(--fs-12); color: var(--text-3); text-align: right; }
.nx-team-h .nx-bad { color: var(--red); font-weight: 600; }
.nx-inj { display: grid; grid-template-columns: 86px minmax(0, 1fr) auto; align-items: center; gap: var(--sp-2); padding: 7px 0; }
.nx-inj + .nx-inj { border-top: 1px solid var(--line); }
.nx-inj .pill { justify-self: start; font-size: var(--fs-11); }
.nx-inj-m { display: grid; min-width: 0; }
.nx-inj-m b { font-size: var(--fs-13); color: var(--text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.nx-inj-m span { font-size: var(--fs-12); color: var(--text-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.nx-inj-m em { font-style: normal; color: var(--text-2); font-weight: 600; }
.nx-pr { font: 600 var(--fs-11) var(--mono); padding: 2px 7px; border-radius: var(--r-pill); color: var(--text-3); box-shadow: inset 0 0 0 1px var(--line-strong); }
.nx-pr-dnp { color: var(--red); box-shadow: inset 0 0 0 1px var(--red-line); }
.nx-pr-limited { color: var(--amber); box-shadow: inset 0 0 0 1px var(--amber-line); }
.nx-pr-full { color: var(--green); box-shadow: inset 0 0 0 1px var(--green-line); }
.nx-more summary { cursor: pointer; padding: 6px 0 2px; font-size: var(--fs-12); color: var(--text-3); list-style: none; }
.nx-more summary::-webkit-details-marker { display: none; }
.nx-more summary::before { content: "+ "; } .nx-more[open] summary::before { content: "\2212  "; }
.nx-more summary:hover { color: var(--text); }
/* matchup meters */
.nx-m { display: grid; gap: 6px; padding: var(--sp-3); border-radius: var(--r-md); background: var(--surface-2); box-shadow: inset 0 0 0 1px var(--line); }
.nx-m-h { display: flex; justify-content: space-between; align-items: baseline; font-size: var(--fs-13); color: var(--text-2); }
.nx-m-h b { font-size: var(--fs-12); font-weight: 700; color: var(--text-3); }
.nx-m-h .nx-edge { color: var(--green); }
.nx-m-row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(80px, 1.2fr) minmax(0, 1fr); align-items: center; gap: var(--sp-3); }
.nx-m-s { display: grid; min-width: 0; } .nx-m-s.r { text-align: right; }
.nx-m-s span { font-size: var(--fs-12); color: var(--text-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.nx-m-s b { font: 700 var(--fs-16) var(--mono); color: var(--text); font-variant-numeric: tabular-nums; }
.nx-m-s small { font-size: var(--fs-11); color: var(--text-4); }
.nx-m-bar { position: relative; display: grid; grid-template-columns: 1fr 1fr; height: 8px; border-radius: var(--r-pill); background: var(--surface-3); overflow: hidden; }
.nx-m-bar::after { content: ""; position: absolute; left: 50%; top: -2px; bottom: -2px; width: 1px; background: var(--line-strong); }
.nx-m-bar i { display: block; height: 100%; }
.nx-m-bar .a { justify-self: end; background: var(--blue); border-radius: var(--r-pill) 0 0 var(--r-pill); }
.nx-m-bar .b { justify-self: start; background: var(--amber); border-radius: 0 var(--r-pill) var(--r-pill) 0; }
.nx-m-bar .a, .nx-m-bar .b { animation: nxGrow var(--t-slow) var(--ease) both; }
.nx-m-bar .a { transform-origin: right; } .nx-m-bar .b { transform-origin: left; }
@keyframes nxGrow { from { transform: scaleX(0); } }
.nx-pace { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sp-3); }
.nx-pace > div { display: grid; gap: 2px; padding: var(--sp-3); border-radius: var(--r-md); background: var(--surface-2); box-shadow: inset 0 0 0 1px var(--line); }
.nx-pace span { display: flex; align-items: center; gap: 6px; font-size: var(--fs-12); color: var(--text-3); }
.nx-pace .nx-logo { width: 18px; height: 18px; }
.nx-pace b { font: 700 var(--fs-20) var(--mono); color: var(--text); }
.nx-pace small { font-size: var(--fs-12); color: var(--text-3); }
/* rest, travel, officials */
.nx-rest { display: grid; grid-template-columns: auto 1fr; gap: var(--sp-2) var(--sp-3); align-items: center; padding: var(--sp-3); border-radius: var(--r-md); background: var(--surface-2); box-shadow: inset 0 0 0 1px var(--line); }
.nx-rest > div:nth-child(2) { display: grid; }
.nx-rest b { font-size: var(--fs-14); color: var(--text); }
.nx-rest span { font-size: var(--fs-12); color: var(--text-3); }
.nx-tags { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 6px; }
.nx-tag { font-size: var(--fs-12); font-weight: 600; padding: 3px 9px; border-radius: var(--r-pill); color: var(--text-3); box-shadow: inset 0 0 0 1px var(--line-strong); }
.nx-tag.a { color: var(--amber); background: var(--amber-dim); box-shadow: inset 0 0 0 1px var(--amber-line); }
.nx-tag.g { color: var(--green); background: var(--green-dim); box-shadow: inset 0 0 0 1px var(--green-line); }
.nx-venue { margin: 0; font-size: var(--fs-12); color: var(--text-3); }
.nx-ref { display: grid; grid-template-columns: 1.2fr 1fr 1fr; gap: var(--sp-3); }
.nx-ref > div { display: grid; align-content: center; gap: 2px; padding: var(--sp-3); border-radius: var(--r-md); background: var(--surface-2); box-shadow: inset 0 0 0 1px var(--line); }
.nx-ref-n span { font-size: var(--fs-11); font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--text-4); }
.nx-ref-n b { font-size: var(--fs-16); color: var(--text); }
.nx-ref-s b { font-size: var(--fs-20); color: var(--text); font-variant-numeric: tabular-nums; }
.nx-ref-s span { font-size: var(--fs-12); line-height: 1.35; color: var(--text-3); }
.nx-ref-s small { color: var(--text-4); }
/* tiles (player role, team profile) */
.nx-tiles { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--sp-3); }
.nx-tile { display: grid; gap: 3px; padding: var(--sp-3) var(--sp-4); border-radius: var(--r-md); background: var(--surface-2); box-shadow: inset 0 0 0 1px var(--line); min-width: 0; }
.nx-tile > span { font-size: var(--fs-11); font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--text-4); }
.nx-tile b { font-size: var(--fs-24); font-weight: 700; color: var(--text); font-variant-numeric: tabular-nums; line-height: 1.1; }
.nx-tile small { font-size: var(--fs-12); color: var(--text-3); line-height: 1.4; }
.nx-rk { display: inline-block; font: 700 var(--fs-11) var(--mono); padding: 1px 6px; margin-right: 4px; border-radius: var(--r-pill); color: var(--text-2); background: var(--surface-3); }
.nx-rk.g { color: var(--green); background: var(--green-dim); } .nx-rk.r { color: var(--red); background: var(--red-dim); }
.nx-tr { font-style: normal; font-weight: 700; color: var(--text-4); } .nx-tr.up { color: var(--green); } .nx-tr.dn { color: var(--red); }
.nx-pinj { padding: 0 var(--sp-3); border-radius: var(--r-md); background: var(--surface-2); box-shadow: inset 0 0 0 1px var(--line); }
.nx-spark { display: flex; align-items: flex-end; gap: 8px; height: 56px; padding: 0 2px; }
.nx-spark > div { display: grid; justify-items: center; align-content: end; gap: 4px; flex: 1; max-width: 34px; height: 100%; }
.nx-spark i { width: 100%; border-radius: 4px 4px 1px 1px; background: linear-gradient(180deg, var(--green), var(--green-dim)); animation: nxRise var(--t-slow) var(--ease) both; transform-origin: bottom; }
.nx-spark span { font: 600 var(--fs-11) var(--mono); color: var(--text-4); }
@keyframes nxRise { from { transform: scaleY(0); } }
@media (max-width: 720px) {
  .nx-2, .nx-pace { grid-template-columns: 1fr; }
  .nx-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .nx-ref { grid-template-columns: 1fr 1fr; } .nx-ref-n { grid-column: 1 / -1; }
  .nx-inj { grid-template-columns: 84px minmax(0, 1fr) auto; }
}
/* the panel's own width decides (it sits in a narrow column on the game page, full width elsewhere) */
@container (max-width: 620px) {
  .nx-2, .nx-pace { grid-template-columns: 1fr; }
  .nx-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .nx-ref { grid-template-columns: 1fr 1fr; } .nx-ref-n { grid-column: 1 / -1; }
}
@media (prefers-reduced-motion: reduce) { .nx-load i, .nx-m-bar .a, .nx-m-bar .b, .nx-spark i { animation: none; } }

/* Game day v2 (2026-10-15): takeaways first, availability grouped by status, matchups as one table, one-line rest/officials */
.nx-tk { padding: var(--sp-4); border-radius: var(--r-md); background: var(--surface-2); box-shadow: inset 3px 0 0 var(--green), inset 0 0 0 1px var(--line); }
.nx-tk-h { margin-bottom: var(--sp-2); font-size: var(--fs-11); font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--green); }
.nx-tk ul { margin: 0; padding: 0; list-style: none; display: grid; gap: 6px; }
.nx-tk li { position: relative; padding-left: 16px; font-size: var(--fs-14); line-height: 1.45; color: var(--text-2); }
.nx-tk li::before { content: ""; position: absolute; left: 2px; top: .6em; width: 5px; height: 5px; border-radius: 50%; background: var(--text-4); }
.nx-tk li b { color: var(--text); }
.nx-team-h .nx-good { margin-left: auto; font-size: var(--fs-12); color: var(--green); font-weight: 600; }
.nx-grp { display: grid; padding: 6px 0 2px; }
.nx-grp + .nx-grp { border-top: 1px solid var(--line); margin-top: 4px; padding-top: 8px; }
.nx-grp-h { display: flex; justify-content: space-between; margin-bottom: 4px; font-size: var(--fs-11); font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--text-3); }
.nx-grp-h.r { color: var(--red); } .nx-grp-h.a { color: var(--amber); }
.nx-grp-h span { font-family: var(--mono); letter-spacing: 0; color: var(--text-4); }
.nx-pl { display: flex; align-items: baseline; flex-wrap: wrap; column-gap: 6px; row-gap: 0; padding: 4px 0; font-size: var(--fs-13); }
.nx-pl b { color: var(--text); font-weight: 600; }
.nx-dot { flex: none; width: 7px; height: 7px; border-radius: 50%; background: var(--text-4); transform: translateY(-1px); }
.nx-dot.r { background: var(--red); } .nx-dot.a { background: var(--amber); }
.nx-pl-pos { font: 600 var(--fs-11) var(--mono); color: var(--text-3); }
.nx-st { font-size: var(--fs-11); font-weight: 700; color: var(--text-2); padding: 0 6px; border-radius: var(--r-pill); background: var(--surface-3); }
.nx-pl-note { flex-basis: 100%; padding-left: 13px; font-size: var(--fs-12); color: var(--text-3); }
.nx-full { margin: 8px 0 0; padding-top: 8px; border-top: 1px solid var(--line); font-size: var(--fs-12); color: var(--text-4); }
/* matchup table */
.nx-mt { display: grid; border-radius: var(--r-md); background: var(--surface-2); box-shadow: inset 0 0 0 1px var(--line); padding: 4px var(--sp-3); }
.nx-mt-h, .nx-mr { display: grid; grid-template-columns: minmax(0, 1.6fr) 72px minmax(70px, 1fr) 72px 54px; align-items: center; gap: var(--sp-3); }
.nx-mt-h { padding: 8px 0 6px; font-size: var(--fs-12); font-weight: 700; color: var(--text-2); border-bottom: 1px solid var(--line); }
.nx-mt-h span { display: flex; align-items: center; gap: 6px; } .nx-mt-h .r { justify-content: flex-end; }
.nx-mt-h .nx-logo { width: 18px; height: 18px; }
.nx-key { width: 10px; height: 4px; border-radius: 2px; } .nx-key.a { background: var(--blue); } .nx-key.b { background: var(--amber); }
.nx-mr { padding: 10px 0; } .nx-mr + .nx-mr { border-top: 1px solid var(--line); }
.nx-mr-l { font-size: var(--fs-13); color: var(--text-2); } .nx-mr-l em { font-style: normal; color: var(--text-4); }
.nx-mr-s { display: grid; } .nx-mr-s.r { text-align: right; }
.nx-mr-s b { font: 700 var(--fs-14) var(--mono); color: var(--text); } .nx-mr-s small { font-size: var(--fs-11); color: var(--text-4); white-space: nowrap; }
.nx-mr-e { text-align: right; }
.nx-edge { font-size: var(--fs-12); font-weight: 700; color: var(--green); } .nx-edge::before { content: "Edge "; font-weight: 600; color: var(--text-3); }
.nx-even { font-size: var(--fs-12); color: var(--text-4); }
.nx-pace-line { display: flex; flex-wrap: wrap; gap: var(--sp-2) var(--sp-5); margin-top: var(--sp-3); font-size: var(--fs-13); color: var(--text-2); }
.nx-pace-line span { display: inline-flex; align-items: center; gap: 6px; } .nx-pace-line b { color: var(--text); } .nx-pace-line small { color: var(--text-4); }
.nx-pace-line .nx-logo { width: 18px; height: 18px; }
/* one-line rows */
.nx-line { display: flex; align-items: center; flex-wrap: wrap; gap: 6px var(--sp-3); padding: 10px var(--sp-3); border-radius: var(--r-md); background: var(--surface-2); box-shadow: inset 0 0 0 1px var(--line); font-size: var(--fs-13); color: var(--text-3); }
.nx-line + .nx-line { margin-top: 6px; } .nx-line > b { color: var(--text); font-size: var(--fs-14); }
.nx-line .nx-logo { width: 20px; height: 20px; }
.nx-ref { margin-top: 6px; display: flex; grid-template-columns: none; } .nx-ref span b { color: var(--text); }
.nx-ref-k { font-size: var(--fs-11); font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--text-4); }
@container (max-width: 620px) {
  .nx-mt-h { display: none; }
  .nx-mr { grid-template-columns: 1fr 1fr; row-gap: 6px; }
  .nx-mr-l { grid-column: 1 / -1; } .nx-m-bar { grid-column: 1 / -1; order: 3; } .nx-mr-e { grid-column: 1 / -1; order: 4; text-align: left; }
}

/* player page: This week card (one table for every line) */
.wk { display: grid; gap: var(--sp-4); }
.wk-mu { display: grid; gap: 2px; padding: var(--sp-3) var(--sp-4); border-radius: var(--r-md); background: var(--surface-2); box-shadow: inset 3px 0 0 var(--text-4), inset 0 0 0 1px var(--line); }
.wk-mu.g { box-shadow: inset 3px 0 0 var(--green), inset 0 0 0 1px var(--line); } .wk-mu.r { box-shadow: inset 3px 0 0 var(--red), inset 0 0 0 1px var(--line); }
.wk-mu b { font-size: var(--fs-14); color: var(--text); } .wk-mu span { font-size: var(--fs-12); color: var(--text-3); }
.wk-t { padding: 0; } .wk-t .pd-r > span:first-child { display: grid; text-align: left; }
.wk-sim { font-size: var(--fs-11); color: var(--text-4); font-weight: 500; }
.wk-t button.pd-r.on { box-shadow: inset 3px 0 0 var(--green); padding-left: 10px; }
.hr-hi { color: var(--green); } .hr-lo { color: var(--red); }
.wk-td { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.wk-picks { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; } .wk-picks > span:first-child { font-size: var(--fs-11); font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--text-4); margin-right: 4px; }
.wk-pick { font-size: var(--fs-13); padding: 4px 10px; border-radius: var(--r-pill); color: var(--text); background: var(--green-dim); box-shadow: inset 0 0 0 1px var(--green-line); } .wk-pick b { color: var(--green); }
.rfoot { margin: -6px 0 4px; }

/* team page polish (2026-10-15): tiles, trends for the next game, game log, quarter bars */
.t-body .tt { gap: 6px; padding: 14px 16px; background: var(--surface-2); border: 0; box-shadow: inset 0 0 0 1px var(--line); transition: box-shadow var(--t-fast) var(--ease); }
.t-body .tt:hover { box-shadow: inset 0 0 0 1px var(--line-strong); }
.t-body .tt-l { font-size: var(--fs-11); font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--text-4); }
.t-body .tt-v { font-size: var(--fs-24); font-weight: 700; color: var(--text); font-variant-numeric: tabular-nums; line-height: 1.1; }
.t-body .tt-s { font-size: var(--fs-12); color: var(--text-3); }
.t-body .t-sec h3 { display: flex; align-items: baseline; gap: 8px; font-size: var(--fs-11); letter-spacing: .14em; color: var(--text-3); }
.t-tabs .fchip { transition: background var(--t-fast) var(--ease), color var(--t-fast) var(--ease); }
.tr-bar { display: block; height: 4px; border-radius: var(--r-pill); background: var(--surface-3); overflow: hidden; }
.tr-bar i { display: block; height: 100%; border-radius: inherit; background: var(--green); animation: nxGrow var(--t-slow) var(--ease) both; transform-origin: left; }
.trn-g { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 10px; }
.trn { display: grid; gap: 8px; padding: 14px 16px; border-radius: var(--r-md); background: var(--surface-2); box-shadow: inset 3px 0 0 var(--green), inset 0 0 0 1px var(--line); }
.trn-h { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.trn-bet { font-size: var(--fs-12); font-weight: 700; color: var(--green); padding: 2px 9px; border-radius: var(--r-pill); background: var(--green-dim); box-shadow: inset 0 0 0 1px var(--green-line); }
.trn-bet b { color: var(--text); font-weight: 600; } .trn-h .linkbtn { font-size: var(--fs-12); }
.trn-m { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; } .trn-m b { font-size: var(--fs-14); color: var(--text); line-height: 1.35; }
.trn-m span { font-size: var(--fs-16); font-weight: 700; color: var(--green); }
.trn-sp { display: flex; flex-wrap: wrap; gap: 6px; } .trn-sp span { font-size: var(--fs-11); color: var(--text-3); padding: 2px 8px; border-radius: var(--r-pill); background: var(--surface-3); }
.trn-sp span b { color: var(--text-2); } .trn-sp .sp-up b { color: var(--green); } .trn-sp .sp-dn b { color: var(--red); }
.tr-t { gap: 8px; }
.tr-log { display: grid; border-radius: var(--r-md); background: var(--surface-2); box-shadow: inset 0 0 0 1px var(--line); padding: 2px 14px; }
.tr-lr { display: grid; grid-template-columns: 64px minmax(0, 1fr) 96px 72px 56px; align-items: center; gap: 10px; padding: 9px 0; font-size: var(--fs-13); color: var(--text-2); }
.tr-lr + .tr-lr { border-top: 1px solid var(--line); } .tr-lr > :nth-child(n+3) { text-align: center; justify-self: center; }
.tr-lh { font-size: var(--fs-11); font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--text-4); }
.tr-lr b { color: var(--text); font-weight: 600; } .tr-w { color: var(--green); } .tr-l { color: var(--red); }
.tr-m { display: inline-grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; font-size: 12px; font-weight: 700; }
.tr-m.y { color: var(--green); background: var(--green-dim); } .tr-m.n { color: var(--red); background: var(--red-dim); } .tr-m.p { color: var(--text-4); background: var(--surface-3); }
.tr-q { display: grid; gap: 8px; max-width: 520px; }
.tr-qr { display: grid; grid-template-columns: 28px 1fr 44px; align-items: center; gap: 10px; font-size: var(--fs-13); color: var(--text-3); }
.tr-qr i { display: block; height: 10px; border-radius: var(--r-pill); background: var(--surface-3); overflow: hidden; }
.tr-qr em { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--green-dim), var(--green)); animation: nxGrow var(--t-slow) var(--ease) both; transform-origin: left; }
.tr-qr b { text-align: right; color: var(--text); }
@media (max-width: 560px) { .tr-lr { grid-template-columns: 52px minmax(0, 1fr) 78px 30px 30px; gap: 6px; } .tr-lh span:nth-child(4), .tr-lh span:nth-child(5) { font-size: 0; } }
.trn-sp span { display: inline-flex; align-items: baseline; gap: 4px; white-space: nowrap; }

/* Free pages in the Pro style */
.trn-act { display: inline-flex; align-items: center; gap: 8px; }
.tr-lr.tr-lr-f { grid-template-columns: 70px minmax(0, 1fr) 110px; }
.lsf-wk.pd-r { grid-template-columns: minmax(0, 1fr) 44px 44px 50px 70px 56px 34px; }
.lsf-wk-lock { font-size: var(--fs-12); justify-self: end; }
@media (max-width: 700px) { .lsf-wk.pd-r { grid-template-columns: minmax(0, 1.4fr) 34px 34px 40px 52px 32px; } .lsf-wk.pd-r > :nth-child(6) { display: none; } }
.lsf-splits { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 560px) { .lsf-splits { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* UFC Fight day */
.nx-hs { width: 30px; height: 30px; border-radius: 50%; object-fit: cover; background: var(--surface-3); }
.nx-fx { display: flex; flex-wrap: wrap; gap: 6px; padding: 8px 0 4px; } .nx-fx span { font-size: var(--fs-12); color: var(--text-2); padding: 3px 9px; border-radius: var(--r-pill); background: var(--surface-3); }
.nx-l3 { display: grid; gap: 4px; margin-top: 6px; } .nx-l3 span { display: flex; gap: 8px; align-items: baseline; font-size: var(--fs-13); color: var(--text-2); }
.nx-l3 b { width: 16px; } .nx-l3 .w b { color: var(--green); } .nx-l3 .l b { color: var(--red); } .nx-l3 small { margin-left: auto; color: var(--text-4); font-size: var(--fs-11); }
.nx-sr { display: grid; grid-template-columns: 64px minmax(0, 1fr) 64px; align-items: center; gap: var(--sp-3); padding: 9px 0; }
.nx-sr + .nx-sr { border-top: 1px solid var(--line); } .nx-sr .r { text-align: right; }
.nx-sr b { font-size: var(--fs-14); color: var(--text-2); } .nx-sr b.nx-win { color: var(--green); }
.nx-sr-m { display: grid; gap: 5px; } .nx-sr-m span { text-align: center; font-size: var(--fs-12); color: var(--text-3); }
.nx-sr-h { font-size: var(--fs-12); font-weight: 700; color: var(--text-2); padding: 8px 0 6px; } .nx-sr-h span { display: flex; align-items: center; gap: 6px; } .nx-sr-h .r { justify-content: flex-end; }
.nx-sr-h { grid-template-columns: 1fr auto 1fr; }

/* Our Picks redesign (2026-10-15): one segmented switch, one chip row with a sort toggle */
.nop { margin: 4px 0 14px; }
.nop-seg { display: flex; gap: 4px; padding: 4px; background: var(--surface-2); border-radius: 12px; box-shadow: inset 0 0 0 1px var(--line); overflow-x: auto; scrollbar-width: none; }
.nop-seg::-webkit-scrollbar { display: none; }
.nop-seg button { flex: 1 0 auto; display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 40px; padding: 0 14px; border: 0; border-radius: 9px;
  background: transparent; color: var(--text-2); font: 600 var(--fs-14)/1 inherit; cursor: pointer; transition: background var(--t-fast) var(--ease), color var(--t-fast) var(--ease); white-space: nowrap; }
.nop-seg button:hover { color: var(--text); background: var(--surface-3); }
.nop-seg button.on { background: var(--text); color: var(--bg); }
.nop-seg button span { font-size: var(--fs-12); color: var(--text-4); }
.nop-seg button.on span { color: #7C8BA1; }
.nop-seg button:focus-visible, .nop-sort button:focus-visible { outline: 2px solid var(--info); outline-offset: 2px; }
.nop-why { margin: 10px 2px 12px; color: var(--text-3); font-size: var(--fs-13); line-height: 1.45; }
.nop-bar { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.nop-chips { display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; min-width: 0; }
.nop-chips::-webkit-scrollbar { display: none; }
.nop-chips .fchip { flex: 0 0 auto; }
.nop-sort { flex: 0 0 auto; display: inline-flex; padding: 3px; border-radius: 10px; background: var(--surface-2); box-shadow: inset 0 0 0 1px var(--line); }
.nop-sort button { border: 0; background: transparent; color: var(--text-3); font: 600 var(--fs-12)/1 inherit; padding: 8px 10px; border-radius: 7px; cursor: pointer; min-height: 32px; }
.nop-sort button.on { background: var(--surface-4); color: var(--text); }
@media (max-width: 560px) { .nop-bar { flex-direction: column-reverse; align-items: stretch; } .nop-sort { align-self: flex-end; } .nop-seg button { padding: 0 12px; } }

/* Player panel polish (2026-10-15): tiles fill each row, the snap chart spreads across the card, injury line hugs its content */
.nx-tiles { grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); }
.nx-tile { align-content: start; }
.nx-tile small .nx-rk { margin-right: 2px; }
.nx-pinj { display: block; width: fit-content; max-width: 100%; justify-self: start; margin-bottom: var(--sp-3); }
.nx-spark-w { height: auto; gap: var(--sp-2); padding: var(--sp-3) var(--sp-3) var(--sp-2); border-radius: var(--r-md); background: var(--surface-2); box-shadow: inset 0 0 0 1px var(--line); }
.nx-spark-w > div { max-width: none; height: 78px; gap: 5px; }
.nx-spark-w i { max-width: 44px; }
.nx-spark-w b { font: 700 var(--fs-12) var(--mono); color: var(--text-2); }
.nx .nx-h-s { margin-top: var(--sp-4); margin-bottom: var(--sp-2); }
.nx .nx-src { margin-top: var(--sp-3); }

/* One header on every page (2026-10-15): the same layout as Home (hub.css .top-in) so nothing jumps when you
   switch pages: logo + tagline left (40px mark, 20px wordmark), sports centred, account buttons right, 64px tall. */
@media (min-width: 901px) {
  .brand, .nhl .brand { grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) !important; column-gap: 20px !important; padding: 12px 22px !important; min-height: 64px; }
  .brand .brandgrp { gap: 12px; }
  .brand .bm { height: 40px !important; width: auto !important; }
  .brand .bw { display: flex; flex-direction: column; gap: 5px; }
  .brand .bw img { height: 20px !important; width: auto !important; }
  .brand .tag { font-size: var(--fs-11); letter-spacing: .24em; }
  .brand .spnav { justify-self: center; }
  .brand .hnav { justify-self: end; }
}
@media (min-width: 901px) and (max-width: 1280px) {
  .brand .tag { display: none; }
  .brand .hnav .hb span { display: none; }
  .brand .hnav .hb { width: 40px; padding: 0; justify-content: center; }
}

/* LineScout lockup: mark and wordmark centred on each other, no tagline */
.brandlink, .top .brand, .lsf-brand { align-items: center !important; }
.brandlink .bw, .top .brand .bw { padding: 0; gap: 0; justify-content: center; }