
  :root{
    --bg: #0A0D12;
    --surface: #000000;
    --surface-2: #0D1117;
    --border: #252C36;
    --text: #ECEFF2;
    --text-muted: #8B96A3;
    --accent: #0EE23F;
    --accent-ink: #06120A;
    --field: #22C55E;
    --danger: #FF5A5F;
    --danger-bg: #3A1518;
    --good: #0EE23F;
    --good-bg: #12291B;
    --warn: #F2B705;
    --warn-bg: #332B0C;
    --radius: 8px;
    --shadow-sm: 0 1px 2px rgba(0,0,0,0.45), 0 3px 12px rgba(0,0,0,0.40);
    --shadow-md: 0 6px 20px rgba(0,0,0,0.55), 0 1px 3px rgba(0,0,0,0.45);
  }
  @media (prefers-color-scheme: dark){
    :root:not([data-theme="light"]){
      --bg: #0A0D12; --surface: #000000; --surface-2: #0D1117; --border: #252C36;
      --text: #ECEFF2; --text-muted: #8B96A3; --accent: #0EE23F; --accent-ink: #06120A;
      --field: #22C55E; --danger: #FF5A5F; --danger-bg: #3A1518; --good: #0EE23F; --good-bg: #12291B;
      --warn: #F2B705; --warn-bg: #332B0C;
      --shadow-sm: 0 1px 2px rgba(0,0,0,0.45), 0 3px 12px rgba(0,0,0,0.40);
      --shadow-md: 0 6px 20px rgba(0,0,0,0.55), 0 1px 3px rgba(0,0,0,0.45);
    }
  }
  :root[data-theme="dark"]{
    --bg: #0A0D12; --surface: #000000; --surface-2: #0D1117; --border: #252C36;
    --text: #ECEFF2; --text-muted: #8B96A3; --accent: #0EE23F; --accent-ink: #06120A;
    --field: #22C55E; --danger: #FF5A5F; --danger-bg: #3A1518; --good: #0EE23F; --good-bg: #12291B;
    --warn: #F2B705; --warn-bg: #332B0C;
    --shadow-sm: 0 1px 2px rgba(0,0,0,0.45), 0 3px 12px rgba(0,0,0,0.40);
    --shadow-md: 0 6px 20px rgba(0,0,0,0.55), 0 1px 3px rgba(0,0,0,0.45);
  }

  *{ box-sizing: border-box; }
  html,body{ margin:0; padding:0; }
  body{
    background: var(--bg); color: var(--text);
    font-family: 'Inter', system-ui, sans-serif;
    font-feature-settings: "tnum" 1, "lnum" 1;
    line-height: 1.5; min-height: 100vh;
  }
  h1,h2,h3,.display{
    font-family: 'Oswald', 'Inter', sans-serif; font-weight: 600;
    text-transform: uppercase; letter-spacing: 0.02em; margin: 0;
  }
  a{ color: inherit; }
  button{ font-family: inherit; }
  ::selection{ background: var(--accent); color: var(--accent-ink); }

  .skip-link{ position:absolute; left:-9999px; top:0; background:var(--accent); color:var(--accent-ink); padding:8px 14px; z-index:100; }
  .skip-link:focus{ left:8px; top:8px; }

  header.topbar{
    position: sticky; top:0; z-index: 20;
    background: var(--surface); border-bottom: 1px solid var(--border);
    box-shadow: var(--shadow-sm);
    display:flex; align-items:center; justify-content:space-between;
    padding: 14px 24px; flex-wrap: wrap; gap: 12px;
  }
  .brand{ display:flex; align-items:baseline; gap:10px; }
  .brand .mark{ font-family:'Oswald',sans-serif; font-weight:700; font-size:1.5rem; letter-spacing:0.03em; }
  .brand .mark .dash{ color: var(--accent); }
  .brand .tag{ color: var(--text-muted); font-size:0.78rem; }
  nav.tabs{ display:flex; gap:2px; background: var(--surface-2); border-radius: var(--radius); padding:4px; max-width:100%; overflow-x:auto; -webkit-overflow-scrolling:touch; scrollbar-width:none; }
  nav.tabs::-webkit-scrollbar{ display:none; }
  /* On narrow screens these tab bars scroll horizontally with no scrollbar -- fade both edges so it's
     obvious there's more to swipe to, instead of looking like the bar just ends. */
  @media (max-width:620px){
    nav.tabs, nav.subtabs{
      -webkit-mask-image: linear-gradient(to right, transparent, black 16px, black calc(100% - 16px), transparent);
      mask-image: linear-gradient(to right, transparent, black 16px, black calc(100% - 16px), transparent);
    }
  }
  nav.tabs button{
    border:none; background:transparent; color:var(--text-muted); position:relative; flex-shrink:0; white-space:nowrap;
    padding: 9px 18px; font-size:0.92rem; font-weight:600; cursor:pointer; border-radius: 6px;
    font-family:'Oswald',sans-serif; letter-spacing:0.03em; text-transform:uppercase;
    transition: background-color 0.15s ease, color 0.15s ease;
  }
  @media (max-width:620px){ nav.tabs button{ padding:9px 13px; font-size:0.8rem; } }
  nav.tabs button:hover:not([aria-selected="true"]){ background: rgba(127,127,127,0.12); color: var(--text); }
  nav.tabs button[aria-selected="true"]{ background: var(--field); color: #fff; box-shadow: var(--shadow-sm); }
  nav.tabs button .dot{ display:inline-block; width:6px; height:6px; border-radius:50%; background:var(--accent); margin-left:6px; }
  nav.tabs button:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible{
    outline: 2px solid var(--accent); outline-offset: 2px;
  }
  nav.subtabs{ display:flex; gap:4px; padding:10px 24px; background:var(--surface-2); border-bottom:1px solid var(--border); overflow-x:auto; }
  nav.subtabs button{ border:none; background:transparent; color:var(--text-muted); padding:8px 14px; font-family:'Oswald',sans-serif; font-weight:600; letter-spacing:0.02em; text-transform:uppercase; font-size:0.8rem; border-radius:6px; cursor:pointer; white-space:nowrap; transition: background-color 0.12s ease, color 0.12s ease; }
  nav.subtabs button:hover{ background: rgba(127,127,127,0.14); color:var(--text); }
  nav.subtabs button.active{ background:var(--field); color:#fff; }
  @media (max-width:620px){ nav.subtabs{ padding:8px 14px; } }

  main{ max-width: 1680px; margin: 0 auto; padding: 30px 20px 80px; }
  section.view{ display:none; }
  section.view.active{ display:block; }

  .panel{ background: var(--surface); border:1px solid var(--border); border-radius: var(--radius); padding: 22px 24px; margin-bottom: 22px; box-shadow: var(--shadow-sm); }
  .panel-head{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:14px; flex-wrap:wrap; }
  .panel-head h2{ font-size:1.05rem; }
  .hint{ color: var(--text-muted); font-size:0.85rem; margin: 4px 0 14px; max-width: 68ch; }

  .row{ display:flex; gap:16px; flex-wrap:wrap; align-items:flex-end; }
  .field{ display:flex; flex-direction:column; gap:4px; min-width: 90px; }
  .field label{ font-size:0.72rem; color:var(--text-muted); text-transform:uppercase; letter-spacing:0.04em; }
  input[type=text], input[type=number], select, textarea{
    background: var(--bg); border:1px solid var(--border); color:var(--text);

    padding:9px 11px; border-radius:6px; font-size:0.9rem; font-family:inherit; width:100%;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
  }
  input[type=text]:hover, input[type=number]:hover, select:hover, textarea:hover{ border-color: var(--field); }
  textarea{ resize: vertical; min-height: 90px; }
  input[type=file]{ font-size:0.85rem; color:var(--text-muted); }

  .toggle-group{ display:inline-flex; border:1px solid var(--field); border-radius: var(--radius); overflow:hidden; }
  .toggle-group button{ border:none; background:var(--surface); color:var(--text); padding:9px 16px; cursor:pointer; font-weight:600; font-family:'Oswald',sans-serif; letter-spacing:0.02em; transition: background-color 0.15s ease, color 0.15s ease; }
  .toggle-group button:hover:not(.active):not(:disabled){ background: var(--surface-2); }
  .toggle-group button.active{ background:var(--field); color:#fff; }
  .toggle-group button:disabled{ opacity:0.4; cursor:not-allowed; }
  .cap-readout{ font-family:'Oswald',sans-serif; font-size:1.15rem; }
  .cap-readout .num{ color: var(--accent); }

  .btn{ border:1px solid var(--field); background:var(--field); color:#fff; padding:10px 20px; border-radius:6px; cursor:pointer; font-weight:600; font-family:'Oswald',sans-serif; letter-spacing:0.02em; text-transform:uppercase; font-size:0.85rem; transition: transform 0.12s ease, box-shadow 0.12s ease, filter 0.12s ease; }
  .btn:hover:not(:disabled){ filter: brightness(1.08); transform: translateY(-1px); box-shadow: var(--shadow-sm); }
  .btn:active:not(:disabled){ transform: translateY(0); filter: brightness(0.97); }
  .btn.secondary{ background:transparent; color:var(--text); border-color:var(--border); }
  .btn.secondary:hover:not(:disabled){ background: var(--surface-2); border-color: var(--field); }
  .btn.accent{ background:var(--accent); border-color:var(--accent); color:var(--accent-ink); }
  .btn.danger{ background:transparent; border-color:var(--danger); color:var(--danger); }
  .btn.danger:hover:not(:disabled){ background: var(--danger-bg); }
  .btn:disabled{ opacity:0.5; cursor:not-allowed; }
  .btn-row{ display:flex; gap:10px; flex-wrap:wrap; margin-top: 14px; }
  .editor-toolbar{ display:flex; gap:6px; flex-wrap:wrap; align-items:center; margin-bottom:8px; }
  .editor-toolbar .btn{ padding:7px 11px; font-size:0.8rem; }
  .editor-toolbar-sep{ width:1px; align-self:stretch; background:var(--border); margin:2px 4px; }

  table{ width:100%; border-collapse:collapse; font-size:0.87rem; }
  th{ text-align:left; font-family:'Oswald',sans-serif; font-weight:500; letter-spacing:0.03em; color:var(--text-muted); background: var(--surface-2); border-bottom:2px solid var(--field); padding:10px 8px; white-space:nowrap; }
  td{ padding:8px; border-bottom:1px solid var(--border); vertical-align:middle; }
  td.num, th.num{ text-align:right; font-variant-numeric: tabular-nums; }
  .table-wrap{ overflow-x:auto; border-radius: var(--radius); }
  tbody tr{ transition: background-color 0.1s ease; }
  tbody tr:hover{ background: var(--surface-2); }
  td input, td select{ padding:5px 6px; font-size:0.85rem; min-width: 56px; border-radius:4px; }
  td input.name-input{ min-width: 130px; }
  .team-cell{ display:flex; align-items:center; gap:6px; }
  .pill{ display:inline-block; padding:2px 8px; border-radius:10px; font-size:0.72rem; font-weight:600; letter-spacing:0.02em; }

  /* ---- Prop research card system ---- */
  .prop-card{ display:flex; align-items:center; gap:14px; flex-wrap:wrap; padding:16px 18px; border:1px solid var(--border); border-radius:14px; margin-bottom:12px; background:var(--surface); box-shadow:var(--shadow-sm); transition: box-shadow 0.15s ease, transform 0.15s ease; }
  .rating-ring{ display:inline-flex; align-items:center; justify-content:center; position:relative; width:46px; height:46px; flex-shrink:0; }
  .rating-ring svg{ width:100%; height:100%; transform:rotate(-90deg); }
  .rating-ring .ring-num{ position:absolute; font-family:'Oswald',sans-serif; font-weight:700; font-size:0.85rem; }
  .prop-table-wrap{ overflow-x:auto; }
  .prop-table{ width:100%; border-collapse:separate; border-spacing:0 8px; font-size:0.84rem; min-width:920px; }
  .prop-table th{ text-align:left; padding:0 10px 6px; font-size:0.68rem; text-transform:uppercase; letter-spacing:0.04em; color:var(--text-muted); font-weight:700; }
  .prop-table td{ padding:10px; background:var(--surface); border-top:1px solid var(--border); border-bottom:1px solid var(--border); vertical-align:middle; }
  .prop-table tr.data-row td:first-child{ border-left:1px solid var(--border); border-radius:10px 0 0 10px; }
  .prop-table tr.data-row td:last-child{ border-right:1px solid var(--border); border-radius:0 10px 10px 0; }
  .prop-table tr.chart-row td{ background:var(--surface-2); border:1px solid var(--border); border-top:none; border-radius:0 0 10px 10px; padding:14px 18px; }
  .matchup-badge{ display:inline-flex; flex-direction:column; align-items:center; gap:2px; padding:4px 10px; border-radius:8px; font-size:0.72rem; font-weight:700; min-width:64px; }

  /* ---- Tier board (drag-and-drop rankings) ---- */
  .tier-row{ border:1px solid var(--border); border-radius:12px; margin-bottom:12px; overflow:hidden; background:var(--surface); }
  .tier-header{ display:flex; align-items:center; gap:10px; padding:9px 14px; background:var(--surface-2); border-bottom:1px solid var(--border); }
  .tier-header .tier-name{ font-family:'Oswald',sans-serif; font-weight:700; font-size:0.95rem; background:transparent; border:none; color:var(--text); width:150px; }
  .tier-header .tier-count{ margin-left:auto; font-size:0.72rem; color:var(--text-muted); }
  .tier-chips{ display:flex; flex-direction:column; gap:6px; padding:12px 14px; min-height:46px; }
  .tier-chip{ display:flex; align-items:center; gap:10px; padding:8px 12px; border-radius:9px; background:var(--surface-2); border:1px solid var(--border); cursor:grab; font-size:0.85rem; user-select:none; flex-wrap:wrap; color:var(--text); }
  .tier-chip .chip-rank{ font-family:'Oswald',sans-serif; font-weight:800; font-size:0.95rem; color:var(--accent); min-width:22px; text-align:right; }
  /* Publishing (blog New Post / Edit / Delete) is owner-only -- hidden by default and revealed only once
     the real Supabase profile check confirms canEditSite (body.owner-mode), never shown by default while
     that check is still resolving. */
  .owner-only-blog{ display:none; }
  body.owner-mode .owner-only-blog{ display:inline-block; }
  .owner-only-panel{ display:none; }
  body.owner-mode .owner-only-panel{ display:block; }
  .tier-chip .chip-name{ font-weight:600; min-width:150px; }
  .tier-chip .chip-vs{ font-size:0.78rem; color:var(--text-muted); display:flex; align-items:center; gap:4px; }
  .tier-chip .chip-dvp{ margin-left:auto; }
  .tier-chip:active{ cursor:grabbing; }
  .tier-chip .chip-remove{ cursor:pointer; color:var(--text-muted); font-size:0.7rem; padding-left:2px; }
  .tier-chip .chip-remove:hover{ color:var(--danger); }
  .sortable-ghost{ opacity:0.35; }
  .sortable-drag{ box-shadow:var(--shadow-md); }

  /* ---- Player detail modal ---- */
  .modal-backdrop{ position:fixed; inset:0; background:rgba(0,0,0,0.6); z-index:200; display:none; align-items:flex-start; justify-content:center; overflow-y:auto; padding:40px 16px; }
  .modal-backdrop.show{ display:flex; }
  .modal-panel{ background:var(--surface); border:1px solid var(--border); border-radius:16px; max-width:640px; width:100%; padding:24px; box-shadow:var(--shadow-md); position:relative; }
  .modal-close{ position:absolute; top:14px; right:16px; z-index:5; cursor:pointer; font-size:1.1rem; line-height:1; color:var(--text-muted); background:none; border:none; }
  /* Banners (the player card's team-color header) bleed right up to the modal's edges and can paint over
     a plain close button, so give it a backdrop that stays visible against any team color, not just the
     page's own surface color. */
  .player-modal .modal-close, .modal-panel .modal-close{ width:28px; height:28px; border-radius:50%; display:flex; align-items:center; justify-content:center; background:rgba(0,0,0,0.4); color:#fff; }
  .modal-close:hover{ color:var(--text); }
  .clickable-name{ cursor:pointer; text-decoration:none; padding:1px 5px; margin:-1px -5px; border-radius:4px; transition:background-color .12s ease, color .12s ease; }
  .clickable-name:hover{ background:var(--good-bg); color:var(--good); }
  .modal-stat-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(130px,1fr)); gap:10px; margin:16px 0; }

  /* ---- Player detail modal ---- */
  .player-modal-backdrop{ position:fixed; inset:0; background:rgba(0,0,0,0.6); z-index:200; display:none; align-items:flex-start; justify-content:center; overflow-y:auto; padding:40px 16px; }
  .player-modal-backdrop.show{ display:flex; }
  .player-modal{ background:var(--surface); border:1px solid var(--border); border-radius:16px; max-width:640px; width:100%; padding:24px; box-shadow:var(--shadow-md); }
  .player-modal-close{ float:right; cursor:pointer; font-size:1.3rem; color:var(--text-muted); line-height:1; }
  .player-modal-close:hover{ color:var(--text); }
  .chip-name.clickable, .compare-name-click{ cursor:pointer; text-decoration:underline; text-decoration-style:dotted; text-underline-offset:3px; }
  .chip-name.clickable:hover, .compare-name-click:hover{ color:var(--accent); }
  .prop-card:hover{ box-shadow:var(--shadow-md); transform: translateY(-1px); }
  .prop-card-id{ display:flex; flex-direction:column; gap:5px; min-width:180px; }
  .prop-card-name{ font-family:'Oswald',sans-serif; font-weight:600; font-size:1.02rem; letter-spacing:0.01em; display:flex; align-items:center; gap:7px; flex-wrap:wrap; }
  .prop-card-meta{ font-size:0.78rem; color:var(--text-muted); display:flex; align-items:center; gap:6px; flex-wrap:wrap; }
  .prop-card-tiles{ display:flex; gap:9px; flex-wrap:wrap; flex:1; justify-content:flex-start; }
  .stat-tile{ background:var(--surface-2); border:1px solid var(--border); border-radius:11px; padding:9px 13px; text-align:center; min-width:98px; }
  .stat-tile-label{ font-size:0.6rem; text-transform:uppercase; letter-spacing:0.05em; color:var(--text-muted); font-weight:700; margin-bottom:5px; }
  .stat-tile-value{ font-family:'Oswald',sans-serif; font-size:0.98rem; font-weight:600; color:var(--text); line-height:1.1; }
  .stat-tile-badge{ display:inline-block; margin-top:6px; padding:2px 9px; border-radius:7px; font-size:0.66rem; font-weight:700; letter-spacing:0.01em; }
  .stat-tile-badge.tier-good{ background:var(--good-bg); color:var(--good); }
  .stat-tile-badge.tier-warn{ background:var(--warn-bg); color:var(--warn); }
  .stat-tile-badge.tier-danger{ background:var(--danger-bg); color:var(--danger); }
  .stat-tile-badge.tier-flat{ background:var(--surface); color:var(--text-muted); border:1px solid var(--border); }
  /* Whole-tile grading (green = good, yellow = mid, red = bad) for at-a-glance scanning -- used across the
     player profile's Advanced Stats grid and the Advanced tab's matchup grid. */
  .stat-tile.grade-good{ background:var(--good-bg); border-color:var(--good); }
  .stat-tile.grade-mid{ background:var(--warn-bg); border-color:var(--warn); }
  .stat-tile.grade-bad{ background:var(--danger-bg); border-color:var(--danger); }
  .stat-tile.grade-good .stat-tile-value{ color:var(--good); }
  .stat-tile.grade-mid .stat-tile-value{ color:var(--warn); }
  .stat-tile.grade-bad .stat-tile-value{ color:var(--danger); }
  .pm-section{ margin-top:22px; }
  .pm-section-head{ display:flex; align-items:center; gap:8px; margin-bottom:10px; padding-bottom:8px; border-bottom:2px solid var(--border); }
  .pm-section-head h3{ margin:0; font-family:'Oswald',sans-serif; text-transform:uppercase; letter-spacing:0.04em; font-size:0.98rem; }
  .pm-section-head .hint{ margin:0 0 0 auto; }
  .pm-legend-grade{ display:flex; gap:12px; font-size:0.68rem; color:var(--text-muted); margin:0 0 0 auto; }
  .pm-legend-grade span{ display:inline-flex; align-items:center; gap:4px; }
  .pm-legend-grade i{ width:9px; height:9px; border-radius:50%; display:inline-block; }
  /* PropFinder-style matchup grid (Advanced tab, per-team detail) -- real per-week split defense metrics,
     one colored cell per position/metric, ranked across the whole league for that window. */
  .dvp-matrix{ width:100%; border-collapse:separate; border-spacing:4px; margin-top:10px; }
  .dvp-matrix th{ font-size:0.62rem; text-transform:uppercase; letter-spacing:0.03em; color:var(--text-muted); padding:4px 6px; font-weight:700; }
  .dvp-matrix td{ padding:0; }
  .dvp-matrix td:first-child, .dvp-matrix th:first-child{ text-align:left; padding-left:6px; }
  .dvp-cell{ background:var(--surface-2); border:1px solid var(--border); border-radius:9px; padding:7px 4px; text-align:center; min-width:56px; }
  .dvp-cell.grade-good{ background:var(--good-bg); border-color:var(--good); box-shadow:0 0 0 1px var(--good) inset; }
  .dvp-cell.grade-mid{ background:var(--warn-bg); border-color:var(--warn); box-shadow:0 0 0 1px var(--warn) inset; }
  .dvp-cell.grade-bad{ background:var(--danger-bg); border-color:var(--danger); box-shadow:0 0 0 1px var(--danger) inset; }
  .dvp-cell-val{ font-family:'Oswald',sans-serif; font-weight:800; font-size:0.92rem; }
  .dvp-cell.grade-good .dvp-cell-val{ color:var(--good); }
  .dvp-cell.grade-mid .dvp-cell-val{ color:var(--warn); }
  .dvp-cell.grade-bad .dvp-cell-val{ color:var(--danger); }
  .dvp-cell-rank{ font-size:0.6rem; color:var(--text-muted); margin-top:1px; }
  .dvp-matrix tr.pm-own-row td:first-child{ position:relative; font-weight:800; color:var(--accent); }
  .dvp-matrix tr.pm-own-row td:first-child::before{ content:''; position:absolute; left:-4px; top:2px; bottom:2px; width:3px; border-radius:2px; background:var(--accent); }
  .pm-category-block{ margin-bottom:18px; }
  .pm-category-block:last-of-type{ margin-bottom:0; }
  .pm-category-head{ margin:0 0 6px; font-size:0.78rem; text-transform:uppercase; letter-spacing:0.04em; color:var(--text-muted); }
  .dvp-window-tabs{ display:flex; gap:4px; margin:10px 0 2px; }
  .dvp-window-tabs button{ border:1px solid var(--border); background:var(--surface-2); color:var(--text-muted); padding:4px 11px; border-radius:7px; font-size:0.7rem; font-weight:700; cursor:pointer; text-transform:uppercase; letter-spacing:0.02em; }
  .dvp-window-tabs button.active{ background:var(--field); color:#fff; border-color:var(--field); }
  /* One-game-at-a-time page layout (Advanced + TD Matchups): a game dropdown up top, then the selected
     game fills the rest of the page instead of stacking every game one after another. A plain <select>
     (not a horizontally-scrolling chip strip) so every game in the week is reachable, not just whichever
     ones fit on screen. */
  .game-picker-select-wrap{ margin-bottom:14px; }
  .game-picker-select{ width:100%; max-width:420px; font-size:0.88rem; font-weight:600; padding:10px 12px; }
  .game-page{ border:1px solid var(--border); border-radius:16px; padding:22px; background:linear-gradient(180deg, var(--surface-2), var(--surface) 140px); }
  /* Wide data tables here have a real min-width (.prop-table: 920px). Fitting two side by side needs
     ~960px each plus a gap -- well more than this column ever actually gets given main's own max-width --
     so side-by-side was always just squeezing each table well under its real min-width and forcing an
     internal horizontal scrollbar per table (the "cramped, cut off" look). Away/home now stack full-width
     instead, so every table renders at its real size with nothing to scroll. */
  .game-page-cols{ display:grid; grid-template-columns:1fr; gap:24px; }
  /* A grid item won't shrink below its content's own min-content width by default (here, .prop-table's
     own 920px min-width) -- min-width:0 overrides that so THIS column can go narrower than 920px, letting
     .table-wrap's overflow-x:auto actually do its job on a small screen instead of the whole page
     overflowing horizontally. */
  .game-page-col{ min-width:0; }
  .game-page-col h4{ margin:0 0 10px; font-size:0.85rem; font-weight:700; text-transform:uppercase; letter-spacing:0.02em; color:var(--text-muted); }
  .game-page-grid-section{ margin-top:26px; padding-top:20px; border-top:1px solid var(--border); }
  @media (max-width:640px){ .game-page{ padding:14px; } }

  /* Team header cards + VS panel -- the game's real identity up top, team-colored, logo watermarked. */
  .tdm-header-row{ display:grid; grid-template-columns:1fr auto 1fr; gap:14px; align-items:stretch; margin-bottom:22px; }
  .tdm-team-card{ position:relative; overflow:hidden; display:flex; align-items:center; gap:14px; padding:16px 18px; border-radius:14px; border:2px solid var(--team-c1); background:linear-gradient(120deg, color-mix(in srgb, var(--team-c1) 24%, var(--surface)), var(--surface) 75%); box-shadow:0 4px 14px rgba(0,0,0,0.25); }
  .tdm-team-home{ flex-direction:row-reverse; text-align:right; }
  .tdm-team-card-logo{ position:absolute; top:50%; right:-12%; width:68%; height:220%; transform:translateY(-50%) rotate(-6deg); background-size:contain; background-repeat:no-repeat; background-position:center; opacity:0.16; pointer-events:none; }
  .tdm-team-home .tdm-team-card-logo{ right:auto; left:-12%; transform:translateY(-50%) rotate(6deg); }
  .tdm-team-card .team-badge{ position:relative; z-index:1; width:54px; height:54px; font-size:0.98rem; flex-shrink:0; }
  .tdm-team-card-info{ position:relative; z-index:1; min-width:0; }
  .tdm-team-card-name{ font-family:'Oswald',sans-serif; font-weight:800; font-size:1.4rem; letter-spacing:0.02em; line-height:1.1; }
  .tdm-team-card-sub{ font-size:0.68rem; text-transform:uppercase; letter-spacing:0.07em; color:var(--text-muted); margin-top:4px; font-weight:700; }
  .tdm-vs-card{ display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px; padding:14px 22px; border-radius:14px; border:1px solid var(--border); background:var(--surface); min-width:130px; }
  .tdm-vs-week{ font-family:'Oswald',sans-serif; font-size:0.66rem; letter-spacing:0.09em; color:var(--text-muted); text-transform:uppercase; font-weight:700; }
  .tdm-vs-big{ font-family:'Oswald',sans-serif; font-weight:800; font-size:1.8rem; color:var(--accent); letter-spacing:0.03em; line-height:1; }
  .tdm-vs-sub{ font-size:0.64rem; color:var(--text-muted); text-align:center; white-space:nowrap; }
  .tdm-vs-meta{ display:flex; gap:5px; flex-wrap:wrap; justify-content:center; }
  @media (max-width:700px){ .tdm-header-row{ grid-template-columns:1fr; } .tdm-vs-card{ order:-1; flex-direction:row; flex-wrap:wrap; gap:8px 14px; } .tdm-team-home{ flex-direction:row; text-align:left; } .tdm-team-home .tdm-team-card-logo{ right:-12%; left:auto; transform:translateY(-50%) rotate(-6deg); } }

  /* Icon+title section headers used across the Advanced page's sub-panels. */
  .tdm-section-head{ display:flex; align-items:center; gap:9px; margin-bottom:12px; padding-bottom:10px; border-bottom:1px solid var(--border); flex-wrap:wrap; }
  .tdm-section-icon{ width:26px; height:26px; border-radius:8px; display:flex; align-items:center; justify-content:center; background:var(--field); font-size:0.85rem; flex-shrink:0; }
  .tdm-section-head h3{ margin:0; font-family:'Oswald',sans-serif; text-transform:uppercase; font-size:0.88rem; letter-spacing:0.03em; }
  .tdm-section-head .hint{ margin:0 0 0 auto; }
  .tdm-mini-panel{ background:var(--surface-2); border:1px solid var(--border); border-radius:12px; padding:14px 16px; margin-bottom:14px; }

  .tdm-insights{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:8px; }
  .tdm-insights li{ padding:10px 13px; border-radius:9px; background:var(--surface-2); border:1px solid var(--border); font-size:0.82rem; line-height:1.4; }
  .tdm-insights li.tdm-good{ border-color:var(--good); background:var(--good-bg); color:var(--good); }
  .tdm-insights li.tdm-bad{ border-color:var(--danger); background:var(--danger-bg); color:var(--danger); }
  .tdm-key-advantage{ margin-top:18px; border:2px solid var(--accent); border-radius:14px; padding:16px; background:linear-gradient(120deg, color-mix(in srgb, var(--accent) 12%, var(--surface-2)), var(--surface-2)); }
  .tdm-key-label{ font-family:'Oswald',sans-serif; text-transform:uppercase; letter-spacing:0.05em; font-size:0.74rem; color:var(--accent); margin-bottom:12px; font-weight:800; text-align:center; }
  .tdm-key-row{ display:flex; align-items:center; justify-content:center; gap:16px; flex-wrap:wrap; }
  .tdm-key-badge{ display:flex; flex-direction:column; align-items:center; gap:4px; padding:12px 18px; border:2px solid var(--border); border-radius:12px; background:var(--surface); min-width:150px; }
  .tdm-key-badge .team-badge{ width:44px; height:44px; font-size:0.85rem; }
  .tdm-key-badge-title{ font-family:'Oswald',sans-serif; font-weight:700; font-size:0.88rem; text-align:center; }
  .tdm-key-badge-sub{ font-size:0.66rem; color:var(--text-muted); text-align:center; }
  .tdm-key-vs{ font-family:'Oswald',sans-serif; color:var(--accent); font-size:1rem; font-weight:800; }
  .prop-card-signal{ margin-left:auto; text-align:center; min-width:128px; padding-left:10px; border-left:1px solid var(--border); }
  .prop-card-signal .score-num{ font-family:'Oswald',sans-serif; font-size:1.7rem; font-weight:700; line-height:1; }
  .prop-card-signal .score-label{ margin-top:4px; }
  @media (max-width: 720px){
    .prop-card{ padding:14px; }
    .prop-card-signal{ margin-left:0; border-left:none; padding-left:0; width:100%; padding-top:10px; border-top:1px solid var(--border); display:flex; align-items:center; justify-content:space-between; text-align:left; }
  }
  .pill.pos-QB{ background:#3B5BA5; color:#fff; }
  .pill.pos-RB{ background:#2E7D4F; color:#fff; }
  .pill.pos-WR{ background:#B8790A; color:#fff; }
  .pill.pos-TE{ background:#7A4FA0; color:#fff; }
  .pill.pos-DST{ background:#555; color:#fff; }
  .pill.pos-K{ background:#7A6A2E; color:#fff; }
  .pill.pos-MVP{ background:var(--accent); color:var(--accent-ink); }
  .inj-tag{ font-size:0.7rem; font-weight:700; color:var(--danger); border:1px solid var(--danger); border-radius:4px; padding:1px 5px; }
  .value-badge{ font-family:'Oswald',sans-serif; font-weight:600; }
  .icon-btn{ border:none; background:transparent; color:var(--danger); cursor:pointer; font-size:1rem; line-height:1; padding:4px 7px; border-radius:5px; transition: background-color 0.12s ease; }
  .icon-btn:hover{ background: var(--danger-bg); }
  .copy-row-btn{ border:none; background:transparent; color:var(--text-muted); cursor:pointer; font-size:0.85rem; line-height:1; padding:4px 7px; border-radius:5px; transition: background-color 0.12s ease, color 0.12s ease; flex-shrink:0; }
  .copy-row-btn:hover{ background: var(--surface-2); color: var(--field); }
  .status-btn{ border:none; background:transparent; cursor:pointer; font-size:0.95rem; padding:3px 6px; border-radius:5px; opacity:0.35; transition: opacity 0.12s ease, background-color 0.12s ease; }
  .status-btn:hover{ opacity:0.75; background: var(--surface-2); }
  .status-btn.active{ opacity:1; }
  tr.row-locked{ background: var(--good-bg); }
  tr.row-excluded{ background: var(--danger-bg); opacity:0.55; }
  tr.row-excluded .ptitle, tr.row-excluded input.name-input{ text-decoration: line-through; }

  .team-badge{
    display:inline-flex; align-items:center; justify-content:center; flex-shrink:0;
    width:24px; height:24px; border-radius:50%; color:#fff; vertical-align:middle;
    font-family:'Oswald',sans-serif; font-weight:700; font-size:0.56rem; letter-spacing:0.01em;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,0.35), 0 1px 2px rgba(0,0,0,0.25);
    text-shadow: 0 1px 1px rgba(0,0,0,0.45);
  }
  .team-badge.lg{ width:40px; height:40px; font-size:0.78rem; }
  .team-badge.md{ width:30px; height:30px; font-size:0.62rem; }

  details.disclosure{ border-top:1px solid var(--border); margin-top:14px; padding-top:12px; }
  details.disclosure summary{ cursor:pointer; font-weight:600; font-family:'Oswald',sans-serif; letter-spacing:0.02em; text-transform:uppercase; font-size:0.85rem; color:var(--text-muted); }
  details.disclosure[open] summary{ margin-bottom:12px; }

  .empty{ color:var(--text-muted); font-style:italic; padding: 18px 4px; }

  /* Official lineup card */
  .lineup-card{ border:1px solid var(--border); border-radius:10px; overflow:hidden; box-shadow: var(--shadow-md); }
  .lineup-grid{ display:grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap:14px; align-items:start; }
  @media (max-width: 820px){ .lineup-grid{ grid-template-columns: 1fr; } }
  .lineup-card-head{
    background: linear-gradient(135deg, var(--field), color-mix(in srgb, var(--field) 70%, black));
    color:#fff; padding:11px 14px; display:flex; justify-content:space-between; align-items:center; gap:14px; flex-wrap:wrap;
  }
  .lineup-card-head .title-block h2{ color:#fff; font-size:1.02rem; letter-spacing:0.03em; }
  .lineup-card-head .title-block .sub{ font-size:0.68rem; opacity:0.85; margin-top:1px; letter-spacing:0.04em; text-transform:uppercase; }
  .seal{
    display:flex; align-items:center; gap:5px; background:rgba(255,255,255,0.12); border:1px solid rgba(255,255,255,0.4);
    border-radius:20px; padding:4px 9px; font-size:0.64rem; font-weight:700; letter-spacing:0.05em; text-transform:uppercase;
  }
  .seal .checkmark{ color: var(--accent); font-size:0.8rem; }
  .lineup-card-body{ padding:10px 14px; background:var(--surface); }
  .lineup-row{ display:flex; align-items:center; gap:9px; padding:6px 0; border-bottom:1px solid var(--border); font-size:0.86rem; }
  .news-row{ display:flex; align-items:flex-start; gap:12px; padding:14px 4px; border-bottom:1px solid var(--border); }
  .news-row:last-child{ border-bottom:none; }
  .status-chip{ flex-shrink:0; color:#fff; font-family:'Oswald',sans-serif; font-weight:700; font-size:0.68rem; text-transform:uppercase; letter-spacing:0.03em; padding:4px 9px; border-radius:5px; white-space:nowrap; margin-top:2px; }
  .news-body{ flex:1; min-width:0; }
  .news-title{ font-weight:600; margin-bottom:2px; }
  .news-note{ color:var(--text-muted); font-size:0.88rem; margin:4px 0 6px; }
  .lineup-row:last-child{ border-bottom:none; }
  .lineup-row .slot-pill{ width:36px; text-align:center; flex-shrink:0; font-size:0.66rem; padding:1px 6px; }
  .lineup-row .player-info{ flex:1; min-width:0; }
  .lineup-row .player-name{ font-weight:600; }
  .lineup-row .player-meta{ color:var(--text-muted); font-size:0.7rem; }
  .lineup-row .pm-line{ font-size:0.68rem; }
  .lineup-row .stat-block{ text-align:right; flex-shrink:0; min-width:52px; }
  .lineup-row .stat-block .stat-num{ font-family:'Oswald',sans-serif; font-weight:600; font-size:0.9rem; }
  .lineup-row .stat-block .stat-label{ font-size:0.58rem; color:var(--text-muted); text-transform:uppercase; }
  .lineup-row .team-badge{ width:20px; height:20px; }

  .totals-strip{ display:flex; gap:26px; flex-wrap:wrap; margin-top:14px; padding-top:14px; border-top:2px solid var(--field); }
  .totals-strip .stat{ display:flex; flex-direction:column; }
  .totals-strip .stat .label{ font-size:0.72rem; color:var(--text-muted); text-transform:uppercase; letter-spacing:0.03em; }
  .totals-strip .stat .val{ font-family:'Oswald',sans-serif; font-size:1.3rem; }
  .totals-strip .stat .val.accent{ color:var(--accent); }

  .exposure-cell{ display:flex; align-items:center; gap:8px; min-width:140px; }
  .exposure-bar-track{ flex:1; height:8px; background:var(--surface-2); border-radius:4px; overflow:hidden; }
  .exposure-bar-fill{ height:100%; background:var(--accent); }
  .exposure-pct{ font-family:'Oswald',sans-serif; font-weight:600; font-size:0.82rem; min-width:38px; text-align:right; }

  @keyframes reveal{ from{ opacity:0; transform:translateY(6px); } to{ opacity:1; transform:translateY(0); } }
  .reveal{ animation: reveal 0.35s ease-out; }
  @media (prefers-reduced-motion: reduce){ .reveal{ animation:none; } }

  /* Blog */
  .blog-toolbar{ display:flex; justify-content:space-between; align-items:center; gap:12px; flex-wrap:wrap; margin-bottom:18px; }
  .cat-filters{ display:flex; gap:6px; flex-wrap:wrap; }
  .cat-filters button{ border:1px solid var(--border); background:var(--surface); color:var(--text-muted); padding:7px 13px; border-radius:16px; font-size:0.8rem; cursor:pointer; font-weight:600; transition: background-color 0.12s ease, border-color 0.12s ease; }
  .cat-filters button:hover:not(.active){ background: var(--surface-2); border-color: var(--field); }
  .cat-filters button.active{ background:var(--field); border-color:var(--field); color:#fff; }
  .post-list{ display:grid; grid-template-columns:repeat(auto-fill, minmax(260px,1fr)); gap:18px; }
  .post-row{ display:flex; flex-direction:column; width:100%; max-width:320px; border:1px solid var(--border); border-radius:12px; overflow:hidden; cursor:pointer; background:var(--surface-2); transition: transform 0.15s ease, box-shadow 0.15s ease; }
  .post-row:hover{ transform:translateY(-3px); box-shadow:0 6px 18px rgba(0,0,0,0.28); }
  .post-thumb-wrap{ position:relative; width:100%; aspect-ratio:16/9; background:#000; overflow:hidden; flex-shrink:0; }
  .post-thumb{ width:100%; height:100%; object-fit:contain; display:block; }
  .post-thumb-noimg{ width:100%; height:100%; display:flex; align-items:center; justify-content:center; font-size:2.4rem; background:var(--field); }
  .post-row .post-body{ padding:12px 14px 14px; min-width:0; }
  .post-row .ptitle{ display:block; font-family:'Oswald',sans-serif; font-size:1.2rem; font-weight:800; margin:6px 0 4px; line-height:1.25; }
  .post-row .pmeta, .blog-preview-card .pmeta{ color:var(--text-muted); font-size:0.78rem; white-space:nowrap; }
  .post-row .pexcerpt{ display:block; color:var(--text-muted); font-size:0.85rem; margin-top:3px; }
  .blog-hero{ padding: 10px 4px 20px; }
  .blog-hero h1{ font-size:1.7rem; margin-bottom:8px; }
  .reader-hero-image{ width:100%; max-height:340px; object-fit:cover; border-radius:10px; margin-bottom:18px; }
  .blog-preview-card{ display:flex; flex-direction:column; width:100%; max-width:320px; border:1px solid var(--border); border-radius:10px; overflow:hidden; cursor:pointer; margin-bottom:14px; transition: transform 0.15s ease, box-shadow 0.15s ease; }
  .blog-preview-card:last-child{ margin-bottom:0; }
  .blog-preview-card:hover{ transform:translateY(-2px); box-shadow:0 6px 16px rgba(0,0,0,0.26); }
  .blog-preview-thumb-wrap{ position:relative; width:100%; aspect-ratio:16/9; background:#000; overflow:hidden; }
  .blog-preview-card img{ width:100%; height:100%; object-fit:contain; display:block; }
  .blog-preview-noimg{ width:100%; height:100%; display:flex; align-items:center; justify-content:center; font-size:2.2rem; background:var(--field); }
  .blog-preview-body{ padding:10px 12px 12px; }
  .blog-preview-card .ptitle{ display:block; font-family:'Oswald',sans-serif; font-size:1.2rem; font-weight:800; margin:6px 0 4px; line-height:1.25; }
  .cat-tag{ display:inline-block; padding:3px 9px; border-radius:5px; font-size:0.68rem; text-transform:uppercase; letter-spacing:0.03em; font-weight:700; margin-right:8px; }
  .cat-tag.Waiver{ background:#2E7D4F; color:#fff; }
  .cat-tag.StartSit{ background:#3B5BA5; color:#fff; }
  .cat-tag.Trade{ background:#B8790A; color:#fff; }
  .cat-tag.General{ background:#555; color:#fff; }
  .cat-tag.Injury{ background:#A6362F; color:#fff; }
  .cat-tag.GameRecap{ background:#6B4FA0; color:#fff; }

  .reader{ display:none; }
  .reader.show{ display:block; }
  .reader-head{ margin-bottom:16px; }
  .reader-head h2{ font-size:1.6rem; margin-bottom:6px; }
  .reader-body{ font-size:1rem; max-width: 74ch; }
  .reader-body p{ margin: 0 0 1em; }
  .reader-body strong{ color: var(--text); }
  .reader-actions{ display:flex; gap:10px; margin-top:22px; }

  .editor{ display:none; }
  .editor.show{ display:block; }
  .editor .field{ margin-bottom:14px; min-width: unset; }

  footer.foot{ text-align:center; color:var(--text-muted); font-size:0.78rem; padding: 30px 20px 50px; }

  /* Trial / paywall */
  .trial-pill{ font-size:0.72rem; font-weight:700; letter-spacing:0.03em; text-transform:uppercase; color:var(--text-muted); white-space:nowrap; background: var(--surface-2); border:1px solid var(--border); padding:6px 12px; border-radius:14px; }
  .trial-pill.warn{ color: var(--danger); background: var(--danger-bg); border-color: transparent; }
  .trial-pill.good{ color: var(--good); background: var(--good-bg); border-color: transparent; }

  .topbar-right{ display:flex; align-items:center; gap:10px; flex-shrink:0; }
  .social-links{ display:flex; align-items:center; gap:8px; }
  .twitter-link{ display:flex; align-items:center; justify-content:center; width:30px; height:30px; border-radius:50%; background:var(--surface-2); border:1px solid var(--border); color:var(--text); font-size:0.92rem; text-decoration:none; flex-shrink:0; }
  .twitter-link:hover{ border-color:var(--accent); color:var(--accent); }
  .twitter-follow-card{ display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; background:var(--surface-2); border:1px solid var(--border); border-radius:12px; padding:18px 20px; }
  .twitter-follow-text p{ margin:0; color:var(--text-muted); }

  /* Home */
  .home-hero{
    position: relative; overflow: hidden;
    padding: 72px 32px 56px; margin: -4px -4px 24px; border-radius: 14px;
    background: #05070a;
    box-shadow: var(--shadow-md);
    color: #fff;
    text-align: center;
  }
  .home-hero::after{
    content:''; position:absolute; inset:0; z-index:0; pointer-events:none;
    background: radial-gradient(ellipse 70% 40% at 50% 0%, color-mix(in srgb, var(--accent) 6%, transparent), transparent 70%);
  }
  #home-sims-panel{ border:1px solid var(--accent); box-shadow:0 0 0 1px rgba(0,255,100,.12), 0 10px 40px -18px var(--accent); background:linear-gradient(135deg, rgba(0,255,100,.07), transparent 60%), var(--panel, transparent); }
  #home-sims-panel{ border:1px solid rgba(34,230,90,.55) !important; }
  #home-sims-panel .feature-grid{ grid-template-columns:repeat(2, minmax(0,1fr)); }
  @media (max-width:1100px){ #home-sims-panel .feature-grid{ grid-template-columns:repeat(2, minmax(0,1fr)); } }
  @media (max-width:560px){ #home-sims-panel .feature-grid{ grid-template-columns:1fr; } }
  .home-sims-chips{ display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin:2px 0 16px; }
  .home-sims-chips button img, #home-sims-panel .feature-icon img{ object-fit:contain; vertical-align:middle; }
  #subtabs-sims button{ display:inline-flex; align-items:center; gap:8px; } #subtabs-sims .sport-logo{ width:20px; height:20px; }
  img[src$="/img/nhl.png"]{ filter:drop-shadow(0 0 1px rgba(255,255,255,.9)) drop-shadow(0 0 3px rgba(255,255,255,.28)); }
  .home-sims-chips button{ display:inline-flex; align-items:center; gap:8px; font:inherit; font-weight:700; padding:8px 18px; border-radius:999px; border:1px solid var(--accent); background:transparent; color:var(--accent); cursor:pointer; }
  .home-sims-chips button:hover{ background:var(--accent); color:#000; }
  .home-sims-chips span{ color:var(--text-muted); font-size:.85rem; }
  .home-hero-text{ position:relative; z-index:1; max-width: 620px; margin: 0 auto; display:flex; flex-direction:column; align-items:center; }
  .home-hero .eyebrow{ color: var(--accent); font-family:'Oswald',sans-serif; font-weight:600; letter-spacing:0.08em; text-transform:uppercase; font-size:0.78rem; margin-bottom:14px; }
  .home-hero h1{ font-size:2rem; line-height:1.2; letter-spacing:0.01em; margin-bottom:10px; color:#fff; }
  .home-lede{ color: rgba(255,255,255,0.72); font-size:0.98rem; max-width:48ch; margin: 0 auto 26px; }
  .hero-stats{ display:flex; gap:32px; margin-top:30px; padding-top:22px; border-top:1px solid rgba(255,255,255,0.14); flex-wrap:wrap; justify-content:center; }
  .hero-stat-num{ font-family:'Oswald',sans-serif; font-weight:700; font-size:1.6rem; color: var(--accent); }
  .hero-stat-label{ font-size:0.75rem; color: rgba(255,255,255,0.6); text-transform:uppercase; letter-spacing:0.03em; margin-top:2px; }
  .home-hero .btn.secondary{ color:#fff; border-color:rgba(255,255,255,0.45); }
  .home-hero .btn.secondary:hover:not(:disabled){ background: rgba(255,255,255,0.14); border-color:#fff; }
  .feature-grid{ display:grid; grid-template-columns: repeat(2, 1fr); gap:16px; }
  @media (max-width: 620px){
    .feature-grid{ grid-template-columns: 1fr; }
    .home-hero{ padding:44px 20px; border-radius:10px; margin:-2px -2px 20px; }
    .home-hero h1{ font-size:1.5rem; }
    .hero-stats{ gap:22px; }
  }
  .feature-card{ border:1px solid var(--border); border-radius:10px; padding:18px; background:var(--surface-2); transition: transform 0.15s ease, box-shadow 0.15s ease; }
  .feature-card:hover{ transform: translateY(-2px); box-shadow: var(--shadow-sm); }
  .feature-icon{ font-size:1.4rem; margin-bottom:8px; }
  .feature-title{ font-family:'Oswald',sans-serif; font-weight:600; text-transform:uppercase; letter-spacing:0.02em; margin-bottom:6px; color:var(--field); }
  .feature-card p{ margin:0; color:var(--text-muted); font-size:0.88rem; }

  .pricing-card{ border:2px solid var(--field); border-radius:12px; padding:26px; max-width:340px; margin:0 auto; box-shadow: var(--shadow-md); }
  .pricing-top{ display:flex; align-items:baseline; justify-content:space-between; margin-bottom:16px; }
  .pricing-amount{ font-family:'Oswald',sans-serif; font-size:2.2rem; font-weight:700; }
  .pricing-amount span{ font-size:1rem; color:var(--text-muted); font-weight:400; }
  .pricing-badge{ background:var(--accent); color:var(--accent-ink); font-size:0.72rem; font-weight:700; text-transform:uppercase; letter-spacing:0.03em; padding:4px 10px; border-radius:12px; }
  .pricing-list{ list-style:none; padding:0; margin:0 0 20px; display:flex; flex-direction:column; gap:10px; font-size:0.9rem; }
  .pricing-list li{ padding-left:22px; position:relative; }
  .pricing-list li::before{ content:'✓'; position:absolute; left:0; color:var(--good); font-weight:700; }

  @media (max-width: 620px){
    header.topbar{ padding:12px 14px; }
    main{ padding: 18px 12px 60px; }
    .panel{ padding:14px; }
    .totals-strip{ gap:16px; }
    .lineup-card-head{ padding:14px 16px; }
  }
@media print{
  .topbar, .subtabs, .trial-pill{ display:none !important; }
  #view-rankings .row, #view-rankings .cat-filters, #view-rankings .btn-row,
  #view-rankings #rankings-add-form-wrap, #view-rankings #rankings-filter-note,
  .chip-remove, .icon-btn{ display:none !important; }
  #view-rankings .panel{ box-shadow:none; border:1px solid #ccc; }
  .tier-chip{ cursor:default; background:#f4f4f4 !important; color:#111 !important; border:1px solid #ccc; }
  .tier-chip .chip-vs, .tier-chip .hint{ color:#444 !important; }
  body{ background:#fff; color:#111; }
}

  /* ---- Start/Sit Scorer + Tier Board (added tools) ---- */
  .ss-weights{ display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:14px 22px; margin:6px 0 18px; }
  .ss-weights label{ display:flex; justify-content:space-between; font-size:0.72rem; color:var(--text-muted); text-transform:uppercase; letter-spacing:0.04em; margin-bottom:4px; }
  .ss-weights label b{ font-family:'Oswald',sans-serif; color:var(--text); font-size:0.85rem; }
  .ss-weights input[type=range]{ width:100%; accent-color:var(--field); padding:0; }
  .ss-verdict{ border:1px solid var(--border); border-left:4px solid var(--accent); background:var(--surface-2); border-radius:var(--radius); padding:12px 16px; margin-bottom:18px; }
  .ss-verdict b{ font-family:'Oswald',sans-serif; text-transform:uppercase; letter-spacing:0.02em; }
  .ss-cards{ display:grid; grid-template-columns:repeat(auto-fit,minmax(270px,1fr)); gap:16px; }
  .ss-card{ position:relative; border:1px solid var(--border); border-radius:12px; padding:16px; background:var(--surface); box-shadow:var(--shadow-sm); }
  .ss-card.winner{ border-color:var(--good); box-shadow:0 0 0 1px var(--good), var(--shadow-md); }
  .ss-card .ss-name{ width:100%; background:transparent; border:none; border-bottom:1px solid var(--border); border-radius:0; font-family:'Oswald',sans-serif; font-weight:600; font-size:1.15rem; padding:4px 0; margin-bottom:12px; }
  .ss-grid{ display:grid; grid-template-columns:1fr 1fr; gap:8px 10px; }
  .ss-grid label{ font-size:0.66rem; color:var(--text-muted); text-transform:uppercase; letter-spacing:0.04em; display:block; margin-bottom:2px; }
  .ss-score{ display:flex; align-items:baseline; gap:8px; margin:16px 0 8px; flex-wrap:wrap; }
  .ss-score .ss-num{ font-family:'Oswald',sans-serif; font-weight:700; font-size:2.4rem; line-height:1; }
  .ss-tag{ font-size:0.66rem; font-weight:700; letter-spacing:0.03em; text-transform:uppercase; padding:3px 9px; border-radius:10px; background:var(--surface-2); color:var(--text-muted); border:1px solid var(--border); }
  .ss-card.winner .ss-tag.start{ background:var(--good-bg); color:var(--good); border-color:transparent; }
  .ss-factor{ margin:9px 0; font-size:0.76rem; }
  .ss-factor .ss-row{ display:flex; justify-content:space-between; gap:8px; color:var(--text-muted); }
  .ss-factor .ss-row b{ font-family:'Oswald',sans-serif; color:var(--text); }
  .ss-bar{ height:8px; background:var(--surface-2); border-radius:4px; overflow:hidden; margin-top:4px; }
  .ss-bar i{ display:block; height:100%; border-radius:4px; background:var(--field); }
  .ss-bar i.good{ background:var(--good); } .ss-bar i.warn{ background:var(--warn); } .ss-bar i.danger{ background:var(--danger); }
  .ss-rm{ position:absolute; top:8px; right:10px; }


  /* ---- Projections, player detail, defense vs position, tier board v2 ---- */
  .mu{ display:inline-block; min-width:40px; text-align:center; padding:2px 8px; border-radius:6px; font-family:'Oswald',sans-serif; font-weight:600; font-size:0.78rem; border:1px solid var(--border); color:var(--text); cursor:help; }
  .d-up{ color:var(--good); font-weight:600; } .d-dn{ color:var(--danger); font-weight:600; }
  .clickable-name{ font-weight:600; }
  .heat-legend{ display:flex; align-items:center; gap:10px; font-size:0.75rem; color:var(--text-muted); margin:10px 0 14px; flex-wrap:wrap; }
  .heat-legend .bar{ height:10px; width:220px; border-radius:5px; border:1px solid var(--border); background:linear-gradient(90deg,color-mix(in srgb,var(--danger) 55%,var(--surface)),var(--surface),color-mix(in srgb,var(--good) 55%,var(--surface))); }
  #dvp-table th[data-dsort]{ cursor:pointer; user-select:none; }
  #dvp-table th.sorted{ color:var(--text); border-bottom-color:var(--accent); }
  .dvp-cell{ text-align:center; font-variant-numeric:tabular-nums; }
  .dvp-cell small{ color:var(--text-muted); margin-left:4px; }
  /* Sleeper-style player banner: full-bleed team-color gradient, a big faded team logo watermarked across
     it, the real cutout photo bleeding off the bottom edge (no white circle, no boxed thumbnail), and the
     name/meta sitting in white text over the color instead of in a separate plain row. */
  .pm-head{
    position:relative; overflow:hidden; display:flex; align-items:flex-end; gap:16px;
    margin:-24px -24px 18px; padding:18px 20px 16px 150px; min-height:185px; border-radius:16px 16px 0 0;
  }
  .pm-head-logo{
    position:absolute; top:50%; right:-8%; width:75%; height:230%; transform:translateY(-50%) rotate(-8deg);
    background-size:contain; background-repeat:no-repeat; background-position:center;
    opacity:0.25; filter:saturate(1.3) brightness(1.15); pointer-events:none;
  }
  /* Absolutely positioned (not a flex child) so its top offset is exact and doesn't depend on how tall the
     name/meta text next to it is. Inset a real margin on every side -- flush against the banner's top edge
     read as a rendering glitch (a photo with a hard-cropped corner looks "crooked" right where the rounded
     banner corner and the square photo corner meet) -- and a clear left gap before the text column so a
     long name can never overlap the photo. */
  .pm-head-photo{
    position:absolute; z-index:1; left:20px; top:16px; bottom:20px; width:112px; overflow:hidden;
    border-radius:10px;
  }
  .pm-headshot{ display:block; width:100%; height:100%; object-fit:cover; object-position:top center; background:transparent; border:none; box-shadow:none; }
  @media (max-width:640px){ .pm-head{ padding-left:118px; min-height:165px; } .pm-head-photo{ width:84px; bottom:18px; } }
  .pm-head-info{ position:relative; z-index:1; color:#fff; padding-bottom:2px; flex:1; min-width:0; }
  .pm-head h2{ font-size:1.5rem; color:#fff; text-shadow:0 1px 3px rgba(0,0,0,0.5); margin-bottom:8px; }
  .pm-head-meta{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin-bottom:10px; }
  .pm-head-team{ color:rgba(255,255,255,0.85); font-weight:600; font-size:0.85rem; }
  .pm-head-bio{ display:flex; gap:16px; flex-wrap:wrap; margin-bottom:10px; }
  .pm-head-bio span{ color:rgba(255,255,255,0.75); font-size:0.68rem; text-transform:uppercase; letter-spacing:0.03em; display:flex; flex-direction:column; gap:2px; }
  .pm-head-bio b{ color:#fff; font-size:0.95rem; font-family:'Oswald',sans-serif; letter-spacing:normal; text-transform:none; }
  .pm-head .fmt-toggle{ margin-top:2px; }
  .adv-sample{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin:6px 0 12px; } .adv-sample-label{ font-size:0.72rem; font-weight:800; letter-spacing:0.08em; text-transform:uppercase; color:var(--text-muted); }
  .adv-sample .dvp-window-tabs{ margin:0; }
  .pm-outbanner{ margin:0 0 10px; padding:9px 14px; border-radius:10px; background:var(--danger-bg, rgba(166,54,47,0.16)); border:1px solid var(--danger); color:var(--text); font-size:0.84rem; line-height:1.4; } .pm-outbanner b{ color:var(--danger); text-transform:uppercase; letter-spacing:0.04em; }
  .pm-rank{ margin-top:4px; font-size:0.68rem; font-weight:700; color:var(--text-muted); } .pm-rank.up{ color:var(--good); } .pm-rank.dn{ color:var(--danger); }
  .pm-barcell{ width:34%; } .pm-bar{ display:block; height:8px; border-radius:5px; background:var(--text-muted); } .pm-bar.up{ background:var(--good); } .pm-bar.dn{ background:var(--danger); }
  .pm-tiles{ display:grid; grid-template-columns:repeat(auto-fit,minmax(125px,1fr)); gap:10px; margin:14px 0; }
  .pm-tiles .stat-tile{ min-width:0; }
  /* Player profile subtabs -- sections render once and are shown/hidden by data-pm-tab, so switching
     tabs is instant (no re-render) and each tab keeps its own scroll state. */
  /* Research-opened profile: a big, wide screen (not the normal ~860px fantasy card) so the real-stat
     tabs -- Opponent's matchup grid, Player Props' book comparisons, Advanced Stats -- have real room,
     closer to a dedicated research-tool page than a modal. */
  #pl-modal.research-mode #pl-panel{ max-width:1240px !important; }
  .pm-research-badge{ display:inline-flex; align-items:center; gap:5px; background:rgba(255,255,255,0.16); color:#fff; font-size:0.62rem; font-weight:800; text-transform:uppercase; letter-spacing:0.04em; padding:3px 9px; border-radius:20px; }
  .pm-tabbar{ display:flex; gap:2px; overflow-x:auto; margin:0 -24px 18px; padding:0 20px; background:var(--surface-2); border-bottom:1px solid var(--border); -webkit-overflow-scrolling:touch; }
  .pm-tabbar::-webkit-scrollbar{ display:none; }
  .pm-tab-btn{ flex-shrink:0; border:none; background:transparent; color:var(--text-muted); padding:11px 14px; font-family:'Oswald',sans-serif; font-weight:600; letter-spacing:0.02em; text-transform:uppercase; font-size:0.74rem; cursor:pointer; border-bottom:2px solid transparent; margin-bottom:-1px; white-space:nowrap; }
  .pm-tab-btn:hover{ color:var(--text); }
  .pm-tab-btn.active{ color:var(--accent); border-bottom-color:var(--accent); }
  @media (max-width:640px){ .pm-tabbar{ padding:0 14px; } .pm-tab-btn{ padding:10px 11px; font-size:0.7rem; } }
  .pm-sub{ font-family:'Oswald',sans-serif; text-transform:uppercase; letter-spacing:0.03em; font-size:0.85rem; color:var(--text-muted); margin:18px 0 8px; }
  .pm-legend{ display:flex; gap:14px; font-size:0.75rem; color:var(--text-muted); margin-bottom:4px; }
  .pm-legend i{ display:inline-block; width:10px; height:10px; border-radius:2px; margin-right:5px; vertical-align:-1px; }
  .pm-svg{ width:100%; height:auto; display:block; }
  .pm-p{ fill:var(--field); opacity:0.45; } .pm-a{ fill:var(--accent); }
  .pm-txt{ fill:var(--text-muted); font-size:10px; font-family:Inter,sans-serif; }
  .pm-grid{ stroke:var(--border); stroke-width:1; }
  tr.pm-bye td{ color:var(--text-muted); font-style:italic; }
  .pm-dnp{ color:var(--danger); font-weight:700; letter-spacing:0.02em; }
  tr.pm-future td{ color:var(--text-muted); }
  .pm-line{ font-size:0.78rem; color:var(--text-muted); }
  /* PropFinder-style prop drill-down: a row of prop tabs (each showing its own real hit%), and below,
     one full-width detail block for whichever prop is selected -- big labeled bar chart plus the
     Season/L3/L5/L10(/H2H) hit-rate table -- instead of several small side-by-side mini graphs. */
  .pm-prop-tabs{ display:flex; gap:6px; flex-wrap:wrap; margin:10px 0 16px; }
  .pm-prop-tab{ display:flex; flex-direction:column; align-items:flex-start; gap:2px; border:1px solid var(--border); background:var(--surface-2); color:var(--text-muted); padding:7px 12px; border-radius:9px; cursor:pointer; font-family:Inter,sans-serif; }
  .pm-prop-tab:hover{ border-color:var(--accent); color:var(--text); }
  .pm-prop-tab.active{ background:var(--field); border-color:var(--field); color:#fff; }
  .pm-prop-tab-label{ font-size:0.76rem; font-weight:700; }
  .pm-prop-tab-pct{ font-size:0.68rem; font-weight:800; padding:1px 6px; border-radius:5px; background:var(--surface); }
  .pm-prop-tab-pct.grade-good{ color:var(--good); } .pm-prop-tab-pct.grade-mid{ color:var(--warn); } .pm-prop-tab-pct.grade-bad{ color:var(--danger); }
  .pm-prop-tab.active .pm-prop-tab-pct{ background:rgba(255,255,255,0.18); color:#fff; }
  .pm-prop-detail{ background:var(--surface-2); border:1px solid var(--border); border-radius:12px; padding:14px 16px; }
  .pm-prop-detail-head{ display:flex; justify-content:space-between; align-items:baseline; gap:10px; margin-bottom:8px; flex-wrap:wrap; }
  .pm-prop-detail-head b{ font-family:'Oswald',sans-serif; font-size:1rem; letter-spacing:0.01em; }
  .pm-prop-detail-line{ font-size:0.8rem; color:var(--text-muted); }
  .pm-prop-detail .dvp-matrix{ margin-top:14px; }
  /* Player Props tab: one real sportsbook-comparison card per market, instead of a single blended tile --
     matches how a real odds-comparison site presents a prop (book, line, price, side by side). */
  .pm-props-market{ background:var(--surface-2); border:1px solid var(--border); border-radius:12px; padding:14px 16px; margin-bottom:14px; }
  .pm-props-market:last-child{ margin-bottom:0; }
  .pm-props-market-head{ display:flex; justify-content:space-between; align-items:baseline; gap:10px; margin-bottom:10px; }
  .pm-props-market-head b{ font-family:'Oswald',sans-serif; font-size:1rem; letter-spacing:0.01em; }
  .pm-props-table td:first-child{ text-align:left; font-weight:600; }
  .pm-book-link{ color:var(--sx-mint,var(--accent)); text-decoration:none; }
  .pm-book-link:hover{ text-decoration:underline; }
  .pm-best-price{ color:var(--good); font-weight:800; position:relative; }
  .pm-best-price::after{ content:'best'; display:block; font-size:0.56rem; font-weight:700; text-transform:uppercase; letter-spacing:0.03em; color:var(--good); opacity:0.8; }
  .proj-num{ font-family:'Oswald',sans-serif; font-weight:600; }
  .game-info{ display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:10px; margin:0 0 16px; }
  .gi-item{ background:var(--surface-2); border:1px solid var(--border); border-radius:10px; padding:10px 12px; }
  .gi-label{ font-size:0.66rem; text-transform:uppercase; letter-spacing:0.05em; color:var(--text-muted); font-weight:700; margin-bottom:4px; }
  .gi-value{ font-family:'Oswald',sans-serif; font-weight:600; font-size:1rem; }
  .tb-wx{ font-size:0.78rem; background:var(--surface); border:1px solid var(--border); border-radius:6px; padding:0 6px; cursor:help; white-space:nowrap; }

  .sb-two{ display:grid; grid-template-columns:repeat(auto-fit,minmax(320px,1fr)); gap:18px; }
  .sb-scatter circle{ fill-opacity:0.78; stroke:var(--surface); stroke-width:0.6; cursor:pointer; }
  .sb-scatter circle:hover{ stroke:var(--text); stroke-width:1.6; }
  .sb-scatter .sb-diag{ stroke:var(--text-muted); stroke-width:1; stroke-dasharray:4 4; fill:none; }
  .pm-legend i.sq{ border-radius:50%; }
  .ss-why{ font-size:0.78rem; color:var(--text-muted); margin:6px 0 0; }

  .tb-add{ display:flex; gap:10px; flex-wrap:wrap; align-items:flex-end; margin-bottom:12px; }
  .tb-tier{ display:flex; border:1px solid var(--border); border-radius:12px; margin-bottom:10px; overflow:hidden; background:var(--surface); }
  .tb-label{
    width:88px; flex:none; display:flex; flex-direction:column; align-items:center; justify-content:center;
    gap:2px; text-align:center; padding:6px 4px; font-family:'Oswald',sans-serif; color:#fff;
    text-shadow:0 1px 2px rgba(0,0,0,0.35);
  }
  .tb-label-letter{ font-weight:700; font-size:1.4rem; line-height:1; }
  .tb-label-text{ font-weight:600; font-size:0.62rem; text-transform:uppercase; letter-spacing:0.02em; line-height:1.15; }
  @media (max-width:640px){ .tb-label{ width:64px; } .tb-label-letter{ font-size:1.15rem; } .tb-label-text{ font-size:0.55rem; } }
  .tb-drop{ flex:1; min-height:62px; padding:10px; display:flex; flex-wrap:wrap; gap:8px; align-content:flex-start; transition:background-color 0.12s ease; }
  .tb-drop.over{ background:var(--surface-2); }
  .tb-pool{ border:1px dashed var(--border); border-radius:12px; margin-top:16px; }
  .tb-pool h3{ margin:12px 14px 0; font-size:0.8rem; color:var(--text-muted); }
  .tb-chip{ display:flex; align-items:center; gap:7px; padding:5px 9px; border-radius:9px; background:var(--surface-2); border:1px solid var(--border); cursor:grab; font-size:0.83rem; user-select:none; }
  .tb-chip:active{ cursor:grabbing; }
  .tb-chip .tb-nm{ font-weight:600; cursor:pointer; text-decoration:underline; text-decoration-style:dotted; text-underline-offset:3px; }
  .tb-label .tb-tsort{ margin-top:6px; font:inherit; font-size:0.58rem; font-weight:800; letter-spacing:0.03em; padding:2px 7px; border-radius:999px; border:1px solid rgba(255,255,255,0.6); background:rgba(0,0,0,0.25); color:#fff; cursor:pointer; line-height:1.2; }
  .tb-label .tb-tsort:hover{ background:rgba(0,0,0,0.45); }
  #view-tierboard.read-only .tb-tsort{ display:none !important; }
  .tb-chip .tb-rk{ flex:none; min-width:20px; height:20px; padding:0 5px; display:inline-grid; place-items:center; border-radius:6px; background:var(--bg); color:var(--text-muted); font-size:0.7rem; font-weight:800; font-variant-numeric:tabular-nums; }
  .tb-chip .tb-nm:hover{ color:var(--accent); }
  .tb-chip .tb-tm{ font-size:0.68rem; color:var(--text-muted); }
  .tb-chip .tb-pr{ font-family:'Oswald',sans-serif; font-size:0.72rem; background:var(--surface); border:1px solid var(--border); border-radius:5px; padding:0 5px; color:var(--field); white-space:nowrap; cursor:help; }
  .tb-chip .tb-pr small{ color:var(--text-muted); font-weight:400; }
  .tb-chip .tb-note{ cursor:pointer; font-size:0.78rem; opacity:0.4; }
  .tb-chip .tb-note.has{ opacity:1; }
  .tb-chip .tb-x{ cursor:pointer; color:var(--text-muted); font-size:0.7rem; }

  /* ---- trade analyzer ---- */
  .trade-grid{ display:grid; grid-template-columns:1fr auto 1fr; gap:18px; align-items:start; margin-top:10px; }
  .trade-side h3{ font-family:'Oswald',sans-serif; text-transform:uppercase; letter-spacing:0.03em; font-size:0.9rem; color:var(--text-muted); margin:0 0 10px; }
  .trade-side .ss-cards{ grid-template-columns:1fr; margin-bottom:10px; }
  .trade-vs{ display:flex; align-items:center; justify-content:center; font-size:1.4rem; color:var(--text-muted); padding-top:34px; }
  .trade-verdict{ display:flex; align-items:center; gap:18px; flex-wrap:wrap; border:1px solid var(--border); border-left:4px solid var(--accent); background:var(--surface-2); border-radius:var(--radius); padding:14px 18px; margin:18px 0; }
  .trade-grade{ font-family:'Oswald',sans-serif; font-weight:700; font-size:2.6rem; line-height:1; min-width:64px; text-align:center; border-radius:12px; padding:6px 10px; }
  .trade-grade.good{ background:var(--good-bg); color:var(--good); }
  .trade-grade.warn{ background:var(--surface); color:var(--text-muted); border:1px solid var(--border); }
  .trade-grade.danger{ background:var(--danger-bg); color:var(--danger); }
  @media (max-width: 720px){ .trade-grid{ grid-template-columns:1fr; } .trade-vs{ padding-top:0; } }

  /* ---- tier board / rankings: read-only for everyone but the site owner ---- */
  #view-tierboard.read-only #tb-sortproj, #view-tierboard.read-only #tb-sync, #view-tierboard.read-only #tb-push,
  #view-tierboard.read-only #tb-clear, #view-tierboard.read-only .disclosure, #view-tierboard.read-only .tb-x,
  #view-tierboard.read-only .tb-note, #view-tierboard.read-only #tb-stream{ display:none !important; }
  #view-tierboard.read-only .tb-chip{ cursor:default; }
  .owner-badge{ display:inline-flex; align-items:center; gap:5px; font-size:0.72rem; font-weight:700; text-transform:uppercase; letter-spacing:0.03em; padding:3px 9px; border-radius:999px; background:var(--good-bg); color:var(--good); margin-left:8px; }
  .readonly-note{ font-size:0.78rem; color:var(--text-muted); background:var(--surface-2); border:1px solid var(--border); border-radius:8px; padding:8px 12px; margin-bottom:12px; }

  /* ---- practice report ---- */
  .practice-status{ display:inline-block; min-width:64px; text-align:center; padding:2px 8px; border-radius:6px; font-family:'Oswald',sans-serif; font-weight:600; font-size:0.72rem; text-transform:uppercase; letter-spacing:0.02em; }
  .practice-status.full{ background:var(--good-bg); color:var(--good); }
  .practice-status.limited{ background:color-mix(in srgb, var(--warn, #B8A10A) 22%, var(--surface)); color:var(--warn, #B8A10A); }
  .practice-status.dnp{ background:var(--danger-bg); color:var(--danger); }
  .prac-summary{ display:flex; gap:8px; flex-wrap:wrap; margin:6px 0 12px; }
  .prac-chip{ font:inherit; font-size:0.78rem; display:inline-flex; align-items:center; gap:6px; padding:6px 12px; border-radius:999px; border:1px solid var(--border); background:var(--surface-2); color:var(--text-muted); cursor:pointer; }
  .prac-chip b{ font-size:1rem; color:var(--text); font-variant-numeric:tabular-nums; }
  .prac-chip.dnp b{ color:var(--danger); } .prac-chip.limited b{ color:var(--warn, #d9a520); } .prac-chip.full b{ color:var(--good); }
  .prac-chip.on{ border-color:var(--accent); background:color-mix(in srgb, var(--accent) 14%, var(--surface-2)); color:var(--text); }
  .prac-note{ max-width:38ch; font-size:0.78rem; color:var(--text-muted); line-height:1.35; } .prac-note b{ color:var(--text); }
  .prac-last{ margin-top:16px; border-top:1px solid var(--border); padding-top:12px; } .prac-last > summary{ cursor:pointer; font-weight:700; font-size:0.9rem; color:var(--accent); }
  .prac-last .hint{ margin:8px 0; }
  @media (max-width:640px){ .prac-hide-sm{ display:none; } }
  .practice-dot{ display:inline-block; width:9px; height:9px; border-radius:50%; margin-right:4px; vertical-align:1px; }
  .practice-dot.full{ background:var(--good); }
  .practice-dot.limited{ background:var(--warn, #B8A10A); }
  .practice-dot.dnp{ background:var(--danger); }
  .tb-headshot{ width:22px; height:22px; border-radius:50%; object-fit:cover; background:#fff; border:1.5px solid var(--accent); flex-shrink:0; vertical-align:middle; }
  .tb-chip .tb-x:hover{ color:var(--danger); }
  #tb-out{ display:none; margin-top:12px; min-height:170px; font-family:ui-monospace,Consolas,monospace; font-size:0.8rem; }

  /* ---- waiver wire: Top 5 Adds ---- */
  .wa5-row{ display:grid; grid-template-columns:44px minmax(190px,1.3fr) minmax(300px,1.6fr) 150px minmax(160px,1fr); gap:14px; align-items:center; padding:12px 10px; border:1px solid var(--border); border-radius:14px; background:var(--surface-2); margin-bottom:10px; }
  .wa5-row.empty{ grid-template-columns:44px 1fr; opacity:0.92; }
  .wa5-rank{ font-family:'Oswald',sans-serif; font-weight:800; font-size:1.7rem; color:var(--accent); text-align:center; line-height:1; }
  .wa5-row:first-of-type .wa5-rank{ text-shadow:0 0 12px color-mix(in srgb, var(--accent) 55%, transparent); }
  .wa5-who{ display:flex; align-items:center; gap:10px; }
  .wa5-who .tb-headshot{ width:46px; height:46px; }
  .wa5-name{ font-weight:800; font-size:1rem; }
  .wa5-ctl{ margin-left:auto; display:flex; gap:2px; }
  .wa5-ctl .icon-btn{ padding:3px 7px; font-size:0.72rem; }
  .wa5-ctl .icon-btn[disabled]{ opacity:0.3; cursor:default; }
  .wa5-input{ width:100%; margin-top:8px; }
  .wa5-row.empty .wa5-input{ margin-top:0; }
  .wa5-metrics{ display:grid; grid-template-columns:repeat(5,1fr); gap:6px; }
  .wa5-m{ display:flex; flex-direction:column; align-items:center; gap:2px; text-align:center; }
  .wa5-m b{ font-family:'Oswald',sans-serif; font-size:1.15rem; }
  .wa5-m span{ font-size:0.6rem; text-transform:uppercase; letter-spacing:0.05em; color:var(--text-muted); }
  .wa5-spark{ display:flex; align-items:center; justify-content:center; }
  .wa5-note textarea{ width:100%; resize:vertical; font:inherit; font-size:0.8rem; padding:6px 8px; border-radius:8px; border:1px solid var(--border); background:var(--field-bg, var(--surface)); color:var(--text); }
  .wa5-note-txt{ font-size:0.82rem; font-style:italic; color:var(--text-muted); }
  .wa5-suggest{ display:flex; flex-wrap:wrap; gap:6px; align-items:center; margin:4px 0 10px; }
  .wa5-chip{ border:1px solid var(--border); background:var(--surface); color:var(--text); border-radius:999px; padding:3px 10px; font-size:0.76rem; font-weight:600; cursor:pointer; }
  .wa5-chip:hover{ border-color:var(--accent); color:var(--accent); }
  @media (max-width:1100px){ .wa5-row{ grid-template-columns:44px 1fr; } .wa5-row > .wa5-metrics, .wa5-row > .wa5-spark, .wa5-row > .wa5-note{ grid-column:2; } .wa5-spark{ justify-content:flex-start; } }

  /* ---- trade analyzer: charts and proof ---- */
  .tr-spark{ width:132px; height:54px; display:block; }
  .tr-card-top{ display:flex; align-items:flex-end; justify-content:space-between; gap:10px; }
  .tr-mini{ display:flex; gap:14px; margin-top:8px; font-size:0.72rem; color:var(--text-muted); } .tr-mini b{ color:var(--text); font-family:'Oswald',sans-serif; font-size:0.95rem; }
  .tr-verdict-main{ flex:1; min-width:240px; }
  .tr-headline{ font-family:'Oswald',sans-serif; font-size:1.35rem; font-weight:700; letter-spacing:0.01em; }
  .tr-nums{ display:flex; flex-wrap:wrap; gap:4px 18px; margin-top:6px; font-size:0.82rem; color:var(--text-muted); } .tr-nums b{ color:var(--text); font-family:'Oswald',sans-serif; font-size:1rem; } .tr-nums .d-up b{ color:var(--good); } .tr-nums .d-dn b{ color:var(--danger); }
  .tr-gauge{ margin:-4px 0 16px; }
  .tr-gauge-track{ position:relative; display:flex; height:14px; border-radius:999px; overflow:hidden; border:1px solid var(--border); }
  .tr-gauge-track i{ display:block; height:100%; } .tr-gauge-track .z-bad{ flex:0 0 45%; background:var(--danger-bg); } .tr-gauge-track .z-even{ flex:0 0 10%; background:var(--surface-2); border-left:1px solid var(--border); border-right:1px solid var(--border); } .tr-gauge-track .z-good{ flex:1; background:var(--good-bg); }
  .tr-gauge-track b{ position:absolute; top:-3px; width:6px; height:20px; margin-left:-3px; border-radius:3px; background:var(--accent); box-shadow:0 0 0 2px var(--surface); }
  .tr-gauge-labels{ display:flex; justify-content:space-between; font-size:0.66rem; text-transform:uppercase; letter-spacing:0.06em; color:var(--text-muted); margin-top:5px; }
  .tr-chart{ border:1px solid var(--border); background:var(--surface-2); border-radius:14px; padding:14px 16px; margin-bottom:14px; min-width:0; }
  .tr-chart h4{ margin:0 0 10px; font-family:'Oswald',sans-serif; text-transform:uppercase; letter-spacing:0.04em; font-size:0.85rem; display:flex; gap:10px; align-items:baseline; flex-wrap:wrap; }
  .tr-two{ display:grid; grid-template-columns:1fr 1fr; gap:14px; } .tr-two .tr-chart{ margin-bottom:14px; }
  @media (max-width:1000px){ .tr-two{ grid-template-columns:1fr; } }
  .tr-why{ list-style:none; margin:0; padding:0; display:grid; gap:7px; }
  .tr-why li{ display:flex; gap:10px; align-items:flex-start; font-size:0.9rem; line-height:1.4; }
  .tr-why li i{ font-style:normal; font-size:0.7rem; margin-top:4px; width:16px; flex-shrink:0; text-align:center; }
  .tr-why li.good i{ color:var(--good); } .tr-why li.bad i{ color:var(--danger); }
  .tr-vrow{ display:grid; grid-template-columns:72px 1fr 64px; gap:10px; align-items:center; margin-bottom:8px; }
  .tr-vlabel{ font-size:0.78rem; font-weight:700; color:var(--text-muted); text-transform:uppercase; letter-spacing:0.04em; }
  .tr-vbar{ display:flex; gap:2px; height:30px; } .tr-seg{ display:flex; align-items:center; justify-content:center; border-radius:6px; color:#fff; font-size:0.7rem; font-weight:700; overflow:hidden; white-space:nowrap; min-width:3px; text-shadow:0 1px 2px rgba(0,0,0,0.4); }
  .tr-vtotal{ font-family:'Oswald',sans-serif; font-weight:700; font-size:1.2rem; text-align:right; } .tr-vtotal.good{ color:var(--good); }
  .tr-legend{ display:flex; gap:14px; flex-wrap:wrap; align-items:center; margin-top:8px; font-size:0.72rem; color:var(--text-muted); } .tr-legend i{ display:inline-block; width:10px; height:10px; border-radius:3px; margin-right:5px; vertical-align:-1px; }
  .tr-key.give{ background:var(--text-muted); } .tr-key.get{ background:var(--accent); }
  .tr-svg{ width:100%; height:auto; display:block; }
  .tr-grid{ stroke:var(--border); stroke-width:1; } .tr-svg .pm-txt{ fill:var(--text-muted); font-size:10px; }
  .tr-line{ fill:none; stroke-width:2.6; stroke-linecap:round; stroke-linejoin:round; } .tr-line.give{ stroke:var(--text-muted); stroke-dasharray:6 4; } .tr-line.get{ stroke:var(--accent); }
  .tr-dot.give{ fill:var(--text-muted); } .tr-dot.get{ fill:var(--accent); }
  .tr-end{ font-size:11px; font-weight:700; } .tr-end.give{ fill:var(--text-muted); } .tr-end.get{ fill:var(--accent); }
  .tr-gap.good{ fill:var(--good); opacity:0.16; } .tr-gap.bad{ fill:var(--danger); opacity:0.16; }
  .tr-bar.give{ fill:var(--text-muted); opacity:0.75; } .tr-bar.get{ fill:var(--accent); }
  table.tr-tape{ width:100%; border-collapse:collapse; font-size:0.84rem; }
  .tr-tape th{ text-align:left; font-size:0.66rem; text-transform:uppercase; letter-spacing:0.06em; color:var(--text-muted); padding:6px 8px; border-bottom:1px solid var(--border); }
  .tr-tape td{ padding:7px 8px; border-bottom:1px solid color-mix(in srgb, var(--border) 55%, transparent); vertical-align:middle; }
  .tr-cat{ font-weight:600; }
  .tr-barwrap{ display:flex; align-items:center; gap:8px; min-width:150px; } .tr-num{ width:52px; font-family:'Oswald',sans-serif; font-size:0.95rem; text-align:right; flex-shrink:0; }
  .tr-hbar{ display:block; height:10px; border-radius:5px; background:var(--text-muted); opacity:0.45; } .tr-hbar.get{ background:var(--accent); opacity:0.55; } .tr-hbar.win{ opacity:1; }
  .tr-edge{ font-weight:800; font-size:0.78rem; white-space:nowrap; color:var(--text-muted); } .tr-edge.good{ color:var(--good); } .tr-edge.bad{ color:var(--danger); }

  /* ---- homepage: Top 5 Adds strip ---- */
  .h5-grid{ display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:12px; }
  @media (max-width:1100px){ .h5-grid{ grid-template-columns:repeat(3,minmax(0,1fr)); } }
  @media (max-width:700px){ .h5-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
  @media (max-width:440px){ .h5-grid{ grid-template-columns:1fr; } }
  .h5-card{ display:flex; flex-direction:column; gap:10px; padding:14px; border:1px solid var(--border); border-radius:14px; background:var(--surface-2); cursor:pointer; transition:transform 0.12s ease, border-color 0.12s ease, box-shadow 0.12s ease; }
  .h5-card:hover{ transform:translateY(-2px); border-color:var(--accent); box-shadow:0 8px 22px rgba(0,0,0,0.28); }
  .h5-card:first-child{ border-color:var(--accent); box-shadow:0 0 0 1px var(--accent) inset; }
  .h5-top{ display:flex; align-items:center; gap:9px; min-width:0; }
  .h5-rank{ font-family:'Oswald',sans-serif; font-weight:800; font-size:1.5rem; color:var(--accent); line-height:1; width:20px; text-align:center; flex-shrink:0; }
  .h5-hs{ width:42px; height:42px; border-radius:50%; object-fit:cover; object-position:top; background:#fff; border:2px solid var(--accent); flex-shrink:0; }
  .h5-who{ min-width:0; }
  .h5-name{ font-weight:800; font-size:0.95rem; line-height:1.2; overflow-wrap:anywhere; }
  .h5-sub{ display:flex; align-items:center; gap:5px; flex-wrap:wrap; margin-top:3px; font-size:0.7rem; color:var(--text-muted); }
  .h5-stats{ display:grid; grid-template-columns:repeat(3,1fr); gap:4px; padding-top:8px; border-top:1px solid var(--border); text-align:center; }
  .h5-stats b{ display:block; font-family:'Oswald',sans-serif; font-size:1.1rem; }
  .h5-stats span{ font-size:0.58rem; text-transform:uppercase; letter-spacing:0.05em; color:var(--text-muted); }
  .h5-note{ font-size:0.76rem; font-style:italic; color:var(--text-muted); line-height:1.35; }
  /* mobile: long tier-board chips (name + weather + status) were wider than the screen and pushed the page sideways */
  .tb-drop{ min-width:0; } .tb-chip{ max-width:100%; flex-wrap:wrap; min-width:0; }
  /* ---- DFS: floor/ceiling board, live waiver tables ---- */
  .fc-top{ display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:18px; }
  .fc-col h3{ font-family:'Oswald',sans-serif; text-transform:uppercase; letter-spacing:0.03em; font-size:0.85rem; color:var(--text-muted); margin:0 0 10px; }
  .fc-cards{ display:flex; flex-direction:column; gap:8px; }
  .fc-card{ border:1px solid var(--border); border-radius:10px; padding:10px 12px; background:var(--surface-2); display:flex; align-items:center; flex-wrap:wrap; gap:2px 14px; }
  .fc-card-name{ font-weight:600; flex:1; min-width:140px; }
  .fc-card-num{ font-family:'Oswald',sans-serif; font-weight:700; font-size:1.3rem; color:var(--accent); }
  #wa-adds td, #wa-drops td{ vertical-align:middle; }

  /* ---- DFS Player Pool: Optimize Lineup is the only button that belongs here -- the pool already
     auto-loads on first visit and auto-refreshes itself when stale (see ensureFreshSlate), so the manual
     Load/Clear buttons are redundant clutter, not a second way in. ---- */
  #pool-load-slate, #pool-clear-btn, button[onclick="loadWeek2()"]{ display:none !important; }

  /* ---- site-wide score ticker: every real game this week, scrolling continuously, visible on every
     view (not just Home) -- fixed to the bottom so it never displaces page content. Built from the same
     real SCHEDULE/TEAM_LOGOS data as the rest of the site in renderScoreTicker() (snippet2.js). ---- */
  body{ padding-bottom:40px; }
  .score-ticker{
    position:fixed; left:0; right:0; bottom:0; z-index:21; height:40px;
    background:#000; border-top:1px solid var(--border); overflow:hidden;
    display:flex; align-items:center;
    /* The ticker scrolls continuously, so whatever game is mid-transit at either edge gets clipped
       mid-logo/mid-number at a hard line -- fade both edges to black instead so that reads as "more
       content, keep watching" rather than a broken/cut-off rendering glitch. */
    -webkit-mask-image: linear-gradient(to right, transparent 0, #000 28px, #000 calc(100% - 28px), transparent 100%);
    mask-image: linear-gradient(to right, transparent 0, #000 28px, #000 calc(100% - 28px), transparent 100%);
  }
  .score-ticker-track{ display:flex; align-items:center; white-space:nowrap; will-change:transform; }
  @media (prefers-reduced-motion: no-preference){
    .score-ticker-track{ animation-name:scoreTickerScroll; animation-timing-function:linear; animation-iteration-count:infinite; }
    .score-ticker:hover .score-ticker-track{ animation-play-state:paused; }
    @keyframes scoreTickerScroll{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }
  }
  @media (prefers-reduced-motion: reduce){
    .score-ticker{ overflow-x:auto; }
  }
  .ticker-item{
    display:inline-flex; align-items:center; gap:7px; padding:0 18px; height:40px;
    border-right:1px solid var(--border); flex-shrink:0;
  }
  /* phones: the big sticky header slides away while you scroll down and returns the moment you scroll up (see snippet-ticker.js) */
  @media (max-width:640px){
    header.topbar{ transition:transform .22s ease; will-change:transform; }
    header.topbar.tb-hide{ transform:translateY(-100%); }
  }
  @media (prefers-reduced-motion:reduce){ header.topbar{ transition:none; } }
  /* touch feel: taps register instantly (no double-tap-zoom wait) and buttons don't flash grey on iOS/Android */
  button, a, [role="tab"], select, summary, label{ touch-action:manipulation; }
  *{ -webkit-tap-highlight-color:transparent; }
  .ticker-item img{ height:22px; width:22px; object-fit:contain; flex-shrink:0; }
  .ticker-team{ font-family:'Oswald',sans-serif; font-weight:700; font-size:0.78rem; letter-spacing:0.02em; color:var(--text); }
  .ticker-at{ color:var(--text-muted); font-size:0.72rem; }
  .ticker-meta{ color:var(--text-muted); font-size:0.74rem; margin-left:6px; white-space:nowrap; }
  .ticker-odds{ color:var(--accent); font-weight:700; font-size:0.78rem; margin-left:8px; white-space:nowrap; }
  .ticker-score{ font-family:'Oswald',sans-serif; font-weight:700; font-size:0.9rem; color:var(--text-muted); margin-left:-2px; }
  .ticker-score.win{ color:var(--text); }
  .ticker-final{ color:var(--accent); font-weight:700; font-size:0.7rem; letter-spacing:0.06em; margin-left:6px; white-space:nowrap; }
  /* sport tag that opens each block of the strip (NFL | NHL | NBA) */
  .ticker-sport{ display:inline-flex; align-items:center; height:40px; padding:0 4px 0 14px; flex-shrink:0; border-right:1px solid var(--border); }
  .ticker-sport span{ font-family:'Oswald',sans-serif; font-weight:700; font-size:0.7rem; letter-spacing:0.14em; padding:3px 9px; border-radius:6px; background:var(--accent); color:#000; }
  .ticker-sport.nhl span{ background:#4aa8ff; } .ticker-sport.nba span{ background:#ff8a3d; }
  .ticker-final.live{ color:#ff5a4a; } .ticker-item-live .ticker-score{ color:var(--text); }
  @media (max-width:640px){
    .ticker-sport{ height:36px; padding:0 2px 0 10px; }
    body{ padding-bottom:36px; }
    .score-ticker{ height:36px; }
    .ticker-item{ height:36px; padding:0 12px; gap:5px; }
    .ticker-item img{ height:19px; width:19px; }
  }

  /* ---- Advanced + TD Matchups "stat lines": one card per category, headshot player cells, and a bar behind
     every number sized against the best on that team so leaders read at a glance ---- */
  .sl-team-head{ display:flex; align-items:center; gap:10px; margin:0 0 12px; font-family:'Oswald',sans-serif; font-size:1rem !important; letter-spacing:0.04em; color:var(--text) !important; }
  .sl-card{ border:1px solid var(--border); border-radius:14px; background:var(--surface); overflow:hidden; margin-bottom:16px; box-shadow:0 2px 10px rgba(0,0,0,0.18); }
  .sl-card-head{ display:flex; align-items:center; gap:9px; padding:10px 14px; background:var(--surface-2); border-bottom:1px solid var(--border); flex-wrap:wrap; }
  .sl-card-head h5{ margin:0; font-family:'Oswald',sans-serif; font-size:0.86rem; letter-spacing:0.07em; text-transform:uppercase; }
  .sl-card-head .sl-ico{ width:26px; height:26px; border-radius:8px; display:flex; align-items:center; justify-content:center; background:var(--field); font-size:0.85rem; flex-shrink:0; }
  .sl-card-head .hint{ margin:0 0 0 auto; font-size:0.7rem; }
  .sl-card .table-wrap{ margin:0; }
  table.stat-lines{ width:100%; min-width:0; border-collapse:collapse; font-size:0.86rem; }
  .stat-lines th{ padding:9px 10px; font-size:0.64rem; letter-spacing:0.06em; text-transform:uppercase; color:var(--text-muted); font-weight:700; text-align:right; white-space:nowrap; border-bottom:1px solid var(--border); background:var(--surface); }
  .stat-lines th:first-child{ text-align:left; padding-left:14px; }
  .stat-lines th[onclick]:hover{ color:var(--text); }
  .stat-lines td{ padding:8px 10px; border-bottom:1px solid color-mix(in srgb, var(--border) 55%, transparent); vertical-align:middle; font-variant-numeric:tabular-nums; background:transparent; border-top:none; }
  .stat-lines tbody tr:last-child td{ border-bottom:none; }
  .stat-lines tr.sl-row{ cursor:pointer; transition:background-color 0.12s ease; }
  .stat-lines tr.sl-row:hover td{ background:color-mix(in srgb, var(--surface-2) 70%, transparent); }
  .stat-lines tr.sl-row td:first-child{ border-left:3px solid var(--pc, #555); border-radius:0; }
  .stat-lines tr.sl-row.sl-open td{ background:var(--surface-2); }
  .stat-lines tr.pos-QB{ --pc:#4F74C9; } .stat-lines tr.pos-RB{ --pc:#3FA46A; } .stat-lines tr.pos-WR{ --pc:#D9961A; } .stat-lines tr.pos-TE{ --pc:#9B6AD0; }
  .sl-pwrap{ display:flex; align-items:center; gap:10px; min-width:150px; }
  .sl-avatar{ width:36px; height:36px; border-radius:50%; object-fit:cover; object-position:top; background:var(--surface-2); flex-shrink:0; box-shadow:0 0 0 2px var(--pc, #555); }
  .sl-initials{ display:flex; align-items:center; justify-content:center; font-size:0.72rem; font-weight:800; color:var(--text-muted); }
  .sl-pname{ min-width:0; line-height:1.25; }
  .sl-pname .clickable-name{ font-weight:700; }
  .sl-sub{ display:flex; align-items:center; gap:7px; margin-top:2px; font-size:0.7rem; color:var(--text-muted); }
  .sl-sub .pill{ padding:1px 7px; font-size:0.62rem; }
  td.sl-bar{ background-image:linear-gradient(90deg, color-mix(in srgb, var(--pc, #888) 22%, transparent) var(--bar), transparent var(--bar)); background-repeat:no-repeat; background-size:100% 56%; background-position:left center; }
  td.sl-bar span{ position:relative; }
  td.sl-lead span{ font-weight:800; color:var(--text); }
  td.sl-null{ color:var(--text-muted); }
  td.sl-chev{ color:var(--text-muted); font-size:0.7rem; width:28px; text-align:center; }
  .stat-lines tr.sl-open + tr td{ background:var(--surface-2) !important; padding:14px 16px; border-left:3px solid var(--pc, #555); }
  /* Away and home side by side on wide screens (no more scrolling past one whole team to reach the other);
     stacked below that so each table keeps the room it needs. */
  @media (min-width:900px){
    .game-page-cols{ grid-template-columns:minmax(0,1fr) minmax(0,1fr); align-items:start; gap:18px; }
    .stat-lines td, .stat-lines th{ padding-left:4px; padding-right:4px; }
    .stat-lines th:first-child{ padding-left:10px; }
    td.sl-chev{ width:20px; padding-left:2px; padding-right:6px; }
    .sl-pwrap{ min-width:0; gap:8px; }
    .sl-avatar{ width:30px; height:30px; }
    .stat-lines th{ white-space:normal; line-height:1.15; font-size:0.58rem; letter-spacing:0.03em; }
    .stat-lines{ font-size:0.8rem; }
    .sl-card-head .hint{ display:none; }
    .game-page-col .dvp-matrix{ border-spacing:3px; }
    .game-page-col .dvp-matrix th{ padding:3px 2px; font-size:0.56rem; letter-spacing:0; }
    .game-page-col .dvp-cell{ min-width:0; padding:5px 1px; border-radius:7px; }
    .game-page-col .dvp-cell-val{ font-size:0.82rem; }
    .game-page-col .dvp-cell-rank{ font-size:0.54rem; }
  }
  @media (min-width:1400px){
    .stat-lines td, .stat-lines th{ padding-left:8px; padding-right:8px; }
    .sl-pwrap{ min-width:140px; }
    .sl-avatar{ width:36px; height:36px; }
    .stat-lines{ font-size:0.86rem; }
    .sl-card-head .hint{ display:block; }
    .game-page-col .dvp-matrix{ border-spacing:4px; }
    .game-page-col .dvp-matrix th{ padding:4px 6px; font-size:0.62rem; }
    .game-page-col .dvp-cell{ min-width:56px; padding:7px 4px; border-radius:9px; }
    .game-page-col .dvp-cell-val{ font-size:0.92rem; }
    .game-page-col .dvp-cell-rank{ font-size:0.6rem; }
  }
  @media (max-width:640px){ .sl-pwrap{ min-width:120px; } .sl-avatar{ width:30px; height:30px; } .stat-lines td, .stat-lines th{ padding-left:7px; padding-right:7px; } }

  .pm-alt-lines{ margin:8px 0 2px; font-size:0.8rem; }
  .pm-alt-lines summary{ cursor:pointer; color:var(--text-muted); font-weight:600; padding:4px 0; }
  .pm-alt-lines[open] summary{ color:var(--text); }

  /* ---- brand: real logo, real team logos, help/about pages ---- */
  .brand-logo{ height:28px; width:auto; display:block; }
  .team-badge.has-logo{ background:#fff; padding:3px; box-shadow: 0 0 0 2px var(--accent), 0 1px 4px rgba(0,0,0,0.45); }
  .team-badge.lg.has-logo{ padding:4px; }
  .team-badge.has-logo img{ width:100%; height:100%; object-fit:contain; border-radius:0; display:block; }
  /* keep the real logo squarely on the text baseline wherever it sits next to a name/label -- DFS Player Pool,
     Best Value, and the lineup card all pair a badge with text inline, so give every pairing the same recipe. */
  .team-cell{ min-height:30px; }
  .team-cell input{ height:30px; padding:4px 8px; }
  td .team-badge, .lineup-row .team-badge{ vertical-align:middle; }
  .lineup-row .team-badge{ align-self:center; }
  .app-icon-mark{ height:22px; width:22px; border-radius:6px; vertical-align:-5px; margin-right:6px; }
  .soon-badge{ display:inline-block; font-size:10px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; padding:1px 6px; border-radius:999px; background:var(--surface-2); color:var(--muted); margin-left:4px; vertical-align:middle; }

  /* ---- homepage hero: logo, free-tier callouts, social entry buttons ---- */
  .hero-logo{ height:120px; width:auto; display:block; margin:0 auto 18px; }
  .free-tier-badge{ display:inline-flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:center; background:rgba(255,255,255,0.07); border:1px solid rgba(255,255,255,0.18); color:rgba(255,255,255,0.85); font-size:0.82rem; padding:8px 16px; border-radius:999px; margin-bottom:24px; }
  .free-tier-badge b{ color:var(--accent); }
  .free-tier-badge .dot{ opacity:0.4; }
  .social-login-row{ display:flex; gap:10px; flex-wrap:wrap; margin-top:14px; justify-content:center; }
  .social-btn{ display:inline-flex; align-items:center; gap:8px; background:rgba(255,255,255,0.08); border:1px solid rgba(255,255,255,0.3); color:#fff; padding:9px 16px; border-radius:8px; font-size:0.86rem; font-weight:600; cursor:pointer; transition:background-color 0.12s ease, border-color 0.12s ease; }
  .social-btn:hover{ background:rgba(255,255,255,0.16); border-color:#fff; }
  .social-btn .social-glyph{ font-size:1rem; line-height:1; width:18px; text-align:center; flex-shrink:0; }
  .email-gate-form{ display:flex; gap:8px; flex-wrap:wrap; width:100%; justify-content:center; }
  .email-gate-form input{ flex:1; min-width:220px; max-width:320px; padding:10px 14px; border-radius:8px; border:1px solid rgba(255,255,255,0.3); background:rgba(255,255,255,0.08); color:#fff; font-size:0.9rem; }
  .email-gate-form input::placeholder{ color:rgba(255,255,255,0.5); }
  .email-gate-form input:focus{ outline:none; border-color:var(--accent); }
  @media (max-width: 640px){ .hero-logo{ height:76px; } .social-login-row{ flex-direction:column; width:100%; } .free-tier-badge{ flex-direction:column; gap:4px; } .free-tier-badge .dot{ display:none; } }

  /* ---- consumer mode: only the site owner can upload rosters/CSVs or hand-edit pool & rankings rows ---- */
  body.consumer-mode #pool-editor-tools,
  body.consumer-mode #pool-clear-btn,
  body.consumer-mode #rankings-editor-tools,
  body.consumer-mode #rankings-add-form-wrap,
  body.consumer-mode #rankings-owner-toolbar,
  body.consumer-mode #rosters-file-input,
  body.consumer-mode .rankings-drag-handle,
  body.consumer-mode #tb-sortproj,
  body.consumer-mode .tb-tsort,
  body.consumer-mode .rk-tsort,
  body.consumer-mode #tb-sync,
  body.consumer-mode #tb-push,
  body.consumer-mode #tb-copy,
  body.consumer-mode #tb-png,
  body.consumer-mode #tb-story,
  body.consumer-mode #tb-clear{ display:none !important; }
  body.consumer-mode #pool-table select,
  body.consumer-mode #pool-table input{ pointer-events:none; background:transparent; border:none; color:inherit; appearance:none; -webkit-appearance:none; }
  body.consumer-mode #pool-table .icon-btn{ display:none; }
  body.consumer-mode .tb-chip{ cursor:default; }
  .consumer-note{ font-size:0.78rem; color:var(--text-muted); background:var(--surface-2); border:1px solid var(--border); border-radius:8px; padding:8px 12px; margin-bottom:12px; display:none; }
  body.consumer-mode .consumer-note{ display:block; }

  .about-hero{ display:flex; align-items:center; gap:18px; flex-wrap:wrap; margin-bottom:8px; }
  .about-hero img{ height:56px; width:auto; }
  .help-toc{ display:flex; flex-wrap:wrap; gap:8px; margin:10px 0 4px; }
  .help-toc a{ text-decoration:none; background:var(--surface-2); border:1px solid var(--border); color:var(--text); padding:6px 12px; border-radius:16px; font-size:0.82rem; font-weight:600; }
  .help-toc a:hover{ border-color:var(--field); }
  .help-section{ border-top:1px solid var(--border); padding-top:16px; margin-top:16px; }
  .help-section:first-of-type{ border-top:none; margin-top:0; padding-top:0; }
  .help-section h3{ font-family:'Oswald',sans-serif; font-size:1.05rem; margin-bottom:8px; color:var(--field); }
  .help-section p{ margin:0 0 8px; color:var(--text-muted); font-size:0.9rem; max-width:74ch; }
  .help-section ul{ margin:0 0 8px; padding-left:20px; color:var(--text-muted); font-size:0.9rem; }
  .help-section li{ margin-bottom:4px; }
  .source-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:10px; margin-top:10px; }
  .source-card{ border:1px solid var(--border); border-radius:10px; padding:12px 14px; background:var(--surface-2); }
  .source-card b{ display:block; font-family:'Oswald',sans-serif; margin-bottom:4px; }
  .source-card span{ font-size:0.8rem; color:var(--text-muted); }
  footer.foot .foot-brand{ display:flex; align-items:center; justify-content:center; gap:8px; margin-bottom:8px; }
  footer.foot .foot-brand img{ height:18px; width:auto; opacity:0.85; }
  footer.foot .foot-links{ display:flex; gap:14px; justify-content:center; flex-wrap:wrap; margin-top:6px; }
  footer.foot .foot-links button{ background:none; border:none; color:var(--text-muted); font-size:0.78rem; cursor:pointer; text-decoration:underline; text-decoration-style:dotted; padding:0; }
  footer.foot .foot-links button:hover{ color:var(--field); }

  /* ---- sitewide player search (header) ---- */
  .site-search{ position:relative; flex:1 1 220px; max-width:280px; }
  .site-search input{ width:100%; padding:8px 12px; border-radius:20px; border:1px solid var(--border); background:var(--surface-2); color:var(--text); font-size:0.84rem; }
  .site-search input:focus{ outline:none; border-color:var(--field); }
  .site-search-results{ display:none; position:absolute; top:calc(100% + 6px); left:0; right:0; background:var(--surface); border:1px solid var(--border); border-radius:10px; box-shadow:var(--shadow-md); max-height:340px; overflow-y:auto; z-index:50; }
  .site-search-row{ display:flex; align-items:center; gap:8px; padding:8px 12px; cursor:pointer; font-size:0.85rem; }
  .site-search-row:hover{ background:var(--surface-2); }
  .site-search-empty{ padding:12px; color:var(--text-muted); font-size:0.85rem; }
  @media (max-width:640px){ .site-search{ order:99; flex-basis:100%; max-width:none; } }

  /* ---- DFS Player Pool: cleaner, less spreadsheet-y ---- */
  #pool-table{ font-size:0.84rem; }
  #pool-table th{ padding:10px 10px; font-size:0.72rem; }
  #pool-table td{ padding:9px 10px; }
  #pool-table tbody tr:nth-child(even){ background:rgba(255,255,255,0.02); }
  #pool-table tbody tr:hover{ background:var(--surface-2); }
  #pool-table .clickable-name{ font-weight:600; }
  #pool-table input[type=number]::-webkit-inner-spin-button,
  #pool-table input[type=number]::-webkit-outer-spin-button{ -webkit-appearance:none; margin:0; }
  #pool-table input[type=number]{ -moz-appearance:textfield; }
  #pool-table .status-btn{ border-radius:6px; }
  body.consumer-mode #pool-table td{ vertical-align:middle; }
  body.consumer-mode #pool-table .team-cell{ gap:8px; }

  /* Mobile: a 13-column table can't fit a 375px screen no matter the font size. Keep the columns you need
     to make a quick call (pos/name/team/opp/injury/salary/proj/lock) always visible; the more analytical
     ones (spread/total/matchup/usage/adj.pts) are still there via horizontal scroll, not lost. */
  @media (max-width:640px){
    /* Was a solid-color ::before/::after block painted on top of whichever column happened to sit at the
       scroll boundary -- fine on the dense Player Pool table this was designed for (narrow columns, only
       ever clips a sliver), but on wide-celled tables like the DVP grid (each cell ~70px, a big bold
       number) that same 22px opaque block ate a third of a cell and looked like missing/broken data, not
       a scroll hint. A mask-image fades the table's own content to transparent at both edges instead of
       painting over it -- a number at the boundary now fades out smoothly rather than getting chopped by
       a hard rectangle, and it never looks like data went missing. */
    .table-wrap{
      -webkit-mask-image: linear-gradient(to right, transparent 0, #000 14px, #000 calc(100% - 14px), transparent 100%);
      mask-image: linear-gradient(to right, transparent 0, #000 14px, #000 calc(100% - 14px), transparent 100%);
    }
    #pool-table th:nth-child(8), #pool-table td:nth-child(8),
    #pool-table th:nth-child(9), #pool-table td:nth-child(9),
    #pool-table th:nth-child(10), #pool-table td:nth-child(10),
    #pool-table th:nth-child(11), #pool-table td:nth-child(11),
    #pool-table th:nth-child(12), #pool-table td:nth-child(12){ display:none; }
  }

  .plan-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:16px; align-items:stretch; }
  .plan-grid .pricing-card{ max-width:none; margin:0; display:flex; flex-direction:column; }
  .plan-grid .pricing-card.featured{ border-color:var(--accent); box-shadow:0 0 0 1px var(--accent), var(--shadow-md); }
  .pricing-plan-name{ font-family:'Oswald',sans-serif; font-weight:700; text-transform:uppercase; letter-spacing:0.03em; font-size:1rem; color:var(--field); margin-bottom:10px; }
  .plan-grid .pricing-list{ flex:1; }

  /* ---- homepage visual polish pass ---- */
  .home-hero{
    background:
      radial-gradient(ellipse 60% 50% at 15% -10%, color-mix(in srgb, var(--accent) 16%, transparent), transparent 60%),
      radial-gradient(ellipse 50% 40% at 100% 110%, color-mix(in srgb, var(--field) 14%, transparent), transparent 65%),
      linear-gradient(180deg, #05070a 0%, #060a08 100%);
    border:1px solid rgba(255,255,255,0.06);
  }
  .home-hero::after{
    background-image:
      linear-gradient(rgba(255,255,255,0.035) 1px, transparent 1px),
      linear-gradient(90deg, rgba(255,255,255,0.035) 1px, transparent 1px);
    background-size: 34px 34px;
    mask-image: radial-gradient(ellipse 70% 60% at 50% 0%, #000 0%, transparent 75%);
    -webkit-mask-image: radial-gradient(ellipse 70% 60% at 50% 0%, #000 0%, transparent 75%);
  }
  .hero-eyebrow{
    display:inline-flex; align-items:center; gap:6px;
    font-family:'Oswald',sans-serif; font-weight:600; letter-spacing:0.1em; text-transform:uppercase;
    font-size:0.72rem; color:var(--accent); background:color-mix(in srgb, var(--accent) 12%, transparent);
    border:1px solid color-mix(in srgb, var(--accent) 35%, transparent); padding:6px 14px; border-radius:999px;
    margin-bottom:16px;
  }
  .home-hero h1{
    background:linear-gradient(180deg, #fff 0%, rgba(255,255,255,0.82) 100%);
    -webkit-background-clip:text; background-clip:text; color:transparent;
    font-size:2.3rem;
  }
  .home-hero .btn.accent{
    padding:14px 30px; font-size:0.92rem;
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--accent) 50%, transparent), 0 8px 28px color-mix(in srgb, var(--accent) 35%, transparent);
  }
  .home-hero .btn.accent:hover:not(:disabled){
    box-shadow: 0 0 0 1px var(--accent), 0 10px 34px color-mix(in srgb, var(--accent) 50%, transparent);
  }
  .hero-stats{ gap:0; }
  .hero-stat{ padding:0 28px; position:relative; }
  .hero-stat + .hero-stat::before{ content:''; position:absolute; left:0; top:2px; bottom:2px; width:1px; background:rgba(255,255,255,0.14); }

  .feature-grid{ grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); }
  .feature-card{ position:relative; overflow:hidden; border-color:rgba(255,255,255,0.08); }
  .feature-card::before{
    content:''; position:absolute; top:0; left:0; right:0; height:2px;
    background:linear-gradient(90deg, var(--accent), transparent);
    opacity:0; transition:opacity 0.15s ease;
  }
  .feature-card:hover::before{ opacity:1; }
  .feature-card:hover{ box-shadow:0 10px 28px rgba(0,0,0,0.35), 0 0 0 1px color-mix(in srgb, var(--accent) 25%, transparent); border-color:transparent; }
  .feature-icon{
    display:inline-flex; align-items:center; justify-content:center;
    width:40px; height:40px; border-radius:10px;
    background:color-mix(in srgb, var(--accent) 14%, transparent);
    font-size:1.2rem; margin-bottom:12px;
  }

  .plan-grid .pricing-top{ flex-wrap:wrap; row-gap:8px; }
  .plan-grid .pricing-card.featured{ position:relative; }
  .plan-grid .pricing-card.featured::before{
    content:'Most Popular'; position:absolute; top:-11px; left:50%; transform:translateX(-50%);
    background:var(--accent); color:var(--accent-ink); font-family:'Oswald',sans-serif; font-weight:700;
    font-size:0.68rem; letter-spacing:0.06em; text-transform:uppercase; padding:4px 14px; border-radius:999px;
    box-shadow:0 2px 10px rgba(0,0,0,0.35);
  }

  #view-home .panel-head h2{ position:relative; padding-left:14px; }
  #view-home .panel-head h2::before{
    content:''; position:absolute; left:0; top:2px; bottom:2px; width:3px; border-radius:2px; background:var(--accent);
  }

  @media (max-width:640px){
    .hero-stat + .hero-stat::before{ display:none; }
    .hero-stats{ gap:18px; }
    .home-hero h1{ font-size:1.5rem; }
  }

  /* ---- homepage motion pass: load-in choreography, scroll reveal, small live touches ----
     Everything here is wrapped in prefers-reduced-motion so a visitor who's asked for less motion gets
     the finished, fully-visible layout immediately with no animation at all. */
  @media (prefers-reduced-motion: no-preference){
    @keyframes heroFadeUp{ from{ opacity:0; transform:translateY(18px); } to{ opacity:1; transform:translateY(0); } }
    .home-hero-text > *{ opacity:0; animation: heroFadeUp 0.7s cubic-bezier(.16,.84,.44,1) forwards; }
    .home-hero-text > *:nth-child(1){ animation-delay:0.02s; }
    .home-hero-text > *:nth-child(2){ animation-delay:0.10s; }
    .home-hero-text > *:nth-child(3){ animation-delay:0.18s; }
    .home-hero-text > *:nth-child(4){ animation-delay:0.26s; }
    .home-hero-text > *:nth-child(5){ animation-delay:0.34s; }
    .home-hero-text > *:nth-child(6){ animation-delay:0.42s; }
    .home-hero-text > *:nth-child(7){ animation-delay:0.50s; }
    .home-hero-text > *:nth-child(8){ animation-delay:0.50s; }
    .home-hero-text > *:nth-child(9){ animation-delay:0.58s; }

    @keyframes ctaPulse{
      0%,100%{ box-shadow:0 0 0 1px color-mix(in srgb, var(--accent) 50%, transparent), 0 8px 28px color-mix(in srgb, var(--accent) 35%, transparent); }
      50%{ box-shadow:0 0 0 1px color-mix(in srgb, var(--accent) 68%, transparent), 0 10px 36px color-mix(in srgb, var(--accent) 55%, transparent); }
    }
    .home-hero .btn.accent{ animation: heroFadeUp 0.7s cubic-bezier(.16,.84,.44,1) forwards, ctaPulse 2.6s ease-in-out 0.9s infinite; }

    /* scroll-reveal: panels (and their feature cards, staggered) fade/slide up once as they enter view --
       toggled by a tiny IntersectionObserver in snippet2.js adding .in-view the first time each is seen */
    #view-home .panel{ opacity:0; transform:translateY(28px); transition:opacity 0.7s cubic-bezier(.16,.84,.44,1), transform 0.7s cubic-bezier(.16,.84,.44,1); }
    #view-home .panel.in-view{ opacity:1; transform:none; }
    .feature-card{ opacity:0; transform:translateY(16px); transition:opacity 0.5s ease, transform 0.5s ease, box-shadow 0.15s ease, border-color 0.15s ease; }
    #view-home .panel.in-view .feature-card{ opacity:1; transform:none; }
    #view-home .panel.in-view .feature-card:hover{ transform:translateY(-2px); }
    #view-home .panel.in-view .feature-card:nth-child(1){ transition-delay:0.04s; }
    #view-home .panel.in-view .feature-card:nth-child(2){ transition-delay:0.09s; }
    #view-home .panel.in-view .feature-card:nth-child(3){ transition-delay:0.14s; }
    #view-home .panel.in-view .feature-card:nth-child(4){ transition-delay:0.19s; }
    #view-home .panel.in-view .feature-card:nth-child(5){ transition-delay:0.24s; }
    #view-home .panel.in-view .feature-card:nth-child(6){ transition-delay:0.29s; }

    /* a fresh coat on every view switch, sitewide -- a quick fade instead of a hard cut */
    @keyframes viewFadeIn{ from{ opacity:0; } to{ opacity:1; } }
    section.view.active{ animation: viewFadeIn 0.3s ease; }

    .btn{ transition: transform 0.12s ease, box-shadow 0.12s ease, filter 0.12s ease; }
    .btn:active:not(:disabled){ transform:scale(0.97); }
  }

  .live-dot{
    display:inline-block; width:8px; height:8px; border-radius:50%; background:var(--accent);
    margin-right:7px; vertical-align:middle; position:relative; top:-1px;
  }
  @media (prefers-reduced-motion: no-preference){
    .live-dot{ animation: liveDotPulse 1.8s ease-out infinite; }
    @keyframes liveDotPulse{
      0%{ box-shadow:0 0 0 0 color-mix(in srgb, var(--accent) 55%, transparent); }
      70%{ box-shadow:0 0 0 8px rgba(0,0,0,0); }
      100%{ box-shadow:0 0 0 0 rgba(0,0,0,0); }
    }
  }

  /* ================= homepage + header redesign: stronger, more "real sports media brand" look =================
     Nav goes from pill-buttons to plain text-links with an underline, the logo gets more room, the sign-in
     pill becomes a real "Start Free" CTA when signed out, and the hero becomes a real two-column layout
     (copy left, photo right) instead of one centered block. Everything below is additive/override, loaded
     after the rest of the stylesheet, so it wins the cascade without needing to touch the base rules. */

  /* ---- header ---- */
  .brand-logo{ height:34px; }
  .social-links{ display:none; }
  header.topbar{ gap:18px; }
  nav.tabs{ background:transparent; padding:0; gap:2px; flex:1 1 auto; justify-content:center; }
  nav.tabs button{
    padding:10px 15px; border-radius:0; text-transform:none; font-family:'Inter',sans-serif;
    font-weight:600; letter-spacing:normal; font-size:0.92rem; color:var(--text-muted);
    border-bottom:2px solid transparent;
  }
  nav.tabs button:hover:not([aria-selected="true"]){ background:transparent; color:#fff; }
  nav.tabs button[aria-selected="true"]{ background:transparent; color:#fff; box-shadow:none; border-bottom-color:var(--accent); }
  .site-search{ flex:0 1 190px; }
  .site-search input{ border-radius:999px; background:var(--surface-2); font-size:0.82rem; padding:8px 16px; }
  #trial-pill{ cursor:pointer; }
  .trial-pill.start-cta{
    background:var(--accent); color:var(--accent-ink); border-color:var(--accent);
    font-family:'Oswald',sans-serif; font-weight:700; letter-spacing:0.02em;
    padding:10px 20px; border-radius:8px; font-size:0.85rem;
  }
  .trial-pill.start-cta:hover{ filter:brightness(1.08); }
  @media (max-width:900px){ nav.tabs{ justify-content:flex-start; } }

  /* ---- hero: two columns, real photo on the right ---- */
  .home-hero{ display:flex; align-items:stretch; padding:0; text-align:left; }
  .home-hero::after{ display:none; }
  .home-hero-text{
    flex:1 1 54%; max-width:none; margin:0; align-items:flex-start; text-align:left;
    padding:60px 48px;
  }
  .home-hero h1{ text-align:left; }
  .home-lede{ text-align:left; margin:0 0 26px; max-width:46ch; }
  .hero-accent-line{ color:var(--accent); }
  .home-hero .btn-row{ justify-content:flex-start; }
  .home-hero-media{ flex:1 1 46%; position:relative; overflow:hidden; background:#05070a; }
  @media (max-width:900px){
    .home-hero{ flex-direction:column; }
    .home-hero-text{ padding:40px 24px 32px; align-items:center; text-align:center; }
    .home-hero h1, .home-lede{ text-align:center; }
    .home-hero .btn-row{ justify-content:center; }
    .home-hero-media{ min-height:260px; width:100%; }
  }

  /* ---- featured-game promo: real next-game matchup (teams, colors, logos, spread/total) rendered
     into .home-hero-media by renderFeaturedGameHero() in snippet2.js -- always the real next game on the
     real schedule, so this never goes stale the way a hardcoded photo/graphic would week to week. ---- */
  .matchup-promo{ position:absolute; inset:0; display:flex; }
  .matchup-side{ flex:1; display:flex; align-items:center; justify-content:center; position:relative; }
  .matchup-side.away{ background-image:radial-gradient(circle at 35% 50%, rgba(255,255,255,0.22), transparent 62%); }
  .matchup-side.home{ background-image:radial-gradient(circle at 65% 50%, rgba(255,255,255,0.22), transparent 62%); }
  .matchup-side img{ width:72%; max-width:230px; height:auto; filter:drop-shadow(0 10px 24px rgba(0,0,0,0.6)); }
  .matchup-vs{
    position:absolute; top:40%; left:50%; transform:translate(-50%,-50%); z-index:2;
    font-family:'Oswald',sans-serif; font-weight:800; font-size:1.5rem; color:#fff; letter-spacing:0.02em;
    background:rgba(0,0,0,0.55); border:2px solid rgba(255,255,255,0.35); border-radius:50%;
    width:60px; height:60px; display:flex; align-items:center; justify-content:center;
    text-shadow:0 2px 10px rgba(0,0,0,0.7);
  }
  .matchup-info{
    position:absolute; left:0; right:0; bottom:0; padding:18px 18px 16px;
    background:linear-gradient(0deg, rgba(0,0,0,0.92) 0%, rgba(0,0,0,0.75) 55%, transparent 100%);
    text-align:center; color:#fff;
  }
  .matchup-date{
    font-family:'Oswald',sans-serif; font-weight:700; letter-spacing:0.05em; text-transform:uppercase;
    font-size:0.86rem; color:#fff; text-shadow:0 1px 6px rgba(0,0,0,0.8);
  }
  .matchup-odds{
    font-family:'Oswald',sans-serif; font-weight:800; font-size:1.4rem; margin-top:6px; color:var(--accent);
    text-shadow:0 1px 6px rgba(0,0,0,0.8);
  }
  .matchup-odds .dot{ margin:0 12px; opacity:0.6; color:#fff; }

  /* ---- trust strip: real feature row under the hero ---- */
  .home-trust-strip{
    display:flex; flex-wrap:wrap; margin:0 0 22px; padding:20px 32px;
    background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); box-shadow:var(--shadow-sm);
  }
  .trust-item{ display:flex; align-items:center; gap:12px; flex:1 1 190px; padding:6px 20px; position:relative; }
  .trust-item + .trust-item::before{ content:''; position:absolute; left:0; top:4px; bottom:4px; width:1px; background:var(--border); }
  .trust-icon{ font-size:1.5rem; flex-shrink:0; }
  .trust-title{ font-family:'Oswald',sans-serif; font-weight:600; font-size:0.9rem; }
  .trust-sub{ color:var(--text-muted); font-size:0.76rem; margin-top:2px; }
  @media (max-width:900px){ .trust-item + .trust-item::before{ display:none; } .home-trust-strip{ padding:16px 20px; } }

  /* ---- section headers: eyebrow + bigger, bolder title ---- */
  .section-eyebrow{
    font-family:'Oswald',sans-serif; font-weight:700; letter-spacing:0.12em; text-transform:uppercase;
    font-size:0.72rem; color:var(--accent); margin-bottom:6px;
  }
  #view-home .panel-head h2{ font-size:1.4rem; text-transform:uppercase; letter-spacing:0.01em; padding-left:0; }
  #view-home .panel-head h2::before{ display:none; }
  #pricing-panel > h2{ font-size:1.4rem; text-transform:uppercase; letter-spacing:0.01em; margin-bottom:10px; }

  /* ---- tools grid: clickable cards straight into the real tool, one clean row on desktop ---- */
  #home-tools-panel .feature-card{ cursor:pointer; }
  #home-tools-panel .feature-grid{ grid-template-columns:repeat(6, 1fr); gap:14px; }
  @media (max-width:1100px){ #home-tools-panel .feature-grid{ grid-template-columns:repeat(3, 1fr); } }
  @media (max-width:640px){ #home-tools-panel .feature-grid{ grid-template-columns:1fr; } }

  /* ---- blog preview: real vertical cards with image/category/excerpt/date ---- */
  #home-blog-preview{ display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:16px; }
  #home-blog-preview .blog-preview-card{ flex-direction:column; align-items:stretch; border:1px solid var(--border); border-radius:12px; overflow:hidden; padding:0; gap:0; }
  #home-blog-preview .blog-preview-card img,
  #home-blog-preview .blog-preview-noimg{ width:100%; height:140px; object-fit:cover; border-radius:0; border:none; display:block; margin:0; }
  #home-blog-preview .blog-preview-noimg{ display:flex; align-items:center; justify-content:center; font-size:2rem; background:var(--surface-2); }
  #home-blog-preview .blog-preview-body{ padding:14px 16px 16px; }
  #home-blog-preview .ptitle{ display:block; margin:8px 0 6px; }
  #home-blog-preview .pexcerpt{ display:block; color:var(--text-muted); font-size:0.84rem; }
  #home-blog-preview .blog-preview-meta{ margin-top:10px; font-size:0.74rem; color:var(--text-muted); }

  /* ---- blog + pricing combined row ---- */
  .home-blog-pricing-row{ display:grid; grid-template-columns:1.6fr 1fr; gap:20px; align-items:start; }
  .home-blog-pricing-row > .panel{ margin-bottom:0; height:100%; }
  @media (max-width:1000px){ .home-blog-pricing-row{ grid-template-columns:1fr; } }

  /* ---- pricing panel: intro + checklist, then the two real plan cards side by side ---- */
  .pricing-check-list{ list-style:none; padding:0; margin:0 0 20px; display:flex; flex-direction:column; gap:8px; font-size:0.86rem; }
  .pricing-check-list li{ padding-left:22px; position:relative; }
  .pricing-check-list li::before{ content:'✓'; position:absolute; left:0; color:var(--good); font-weight:700; }
  .pricing-cards-row{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
  .pricing-cards-row .pricing-card{ max-width:none; margin:0; padding:16px; }
  .pricing-cards-row .pricing-plan-name{ margin-bottom:8px; font-size:0.88rem; }
  .pricing-cards-row .pricing-amount{ font-size:1.5rem; }
  .pricing-cards-row .pricing-card.featured{ position:relative; }
  .pricing-cards-row .pricing-card.featured::before{
    content:'Best Value'; position:absolute; top:-11px; left:50%; transform:translateX(-50%);
    background:var(--accent); color:var(--accent-ink); font-family:'Oswald',sans-serif; font-weight:700;
    font-size:0.64rem; letter-spacing:0.06em; text-transform:uppercase; padding:4px 12px; border-radius:999px;
    box-shadow:0 2px 10px rgba(0,0,0,0.35); white-space:nowrap;
  }
  @media (max-width:640px){ .pricing-cards-row{ grid-template-columns:1fr; } }

  /* ---- My Picks (pick'em) ---- */
  .pk-tiles{ display:grid; grid-template-columns:repeat(auto-fit,minmax(130px,1fr)); gap:10px; }
  .pk-tile{ background:var(--surface-2); border:1px solid var(--border); border-radius:12px; padding:12px 14px; }
  .pk-tile-label{ font-size:0.66rem; text-transform:uppercase; letter-spacing:0.06em; color:var(--text-muted); font-weight:700; }
  .pk-tile-val{ font-family:'Oswald',sans-serif; font-weight:700; font-size:1.7rem; line-height:1.15; margin-top:2px; }
  .pk-tile-val.good{ color:var(--good); } .pk-tile-val.bad{ color:var(--danger); }
  .pk-tile-sub{ font-size:0.72rem; color:var(--text-muted); margin-top:2px; }
  .pk-weeks{ margin-top:12px; } .pk-weeks summary{ cursor:pointer; color:var(--text-muted); font-weight:600; padding:4px 0; }

  .pk-favbar{ display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin:4px 0 8px; padding:10px 12px; background:var(--surface-2); border:1px solid var(--border); border-radius:12px; }
  .pk-fav-title{ font-family:'Oswald',sans-serif; font-weight:600; text-transform:uppercase; letter-spacing:0.03em; font-size:0.8rem; margin-right:4px; }
  .pk-fav-chip{ display:inline-flex; align-items:center; gap:6px; background:color-mix(in srgb, var(--accent) 16%, var(--surface)); border:1px solid var(--accent); color:var(--text); padding:3px 10px; border-radius:999px; font-size:0.8rem; font-weight:700; text-decoration:none; cursor:pointer; }
  .pk-fav-chip span{ font-weight:500; color:var(--text-muted); font-size:0.72rem; }
  .pk-filter{ margin-left:auto; padding:5px 12px; font-size:0.78rem; }
  .pk-filter.on{ border-color:var(--accent); color:var(--accent); }

  .pk-day{ margin:18px 0 10px; font-family:'Oswald',sans-serif; font-size:0.95rem; letter-spacing:0.04em; text-transform:uppercase; color:var(--text-muted); border-bottom:1px solid var(--border); padding-bottom:6px; }
  .pk-grid{ display:grid; grid-template-columns:1fr; gap:14px; }
  @media (min-width:900px){ .pk-grid{ grid-template-columns:1fr 1fr; } }
  @media (min-width:1500px){ .pk-grid{ grid-template-columns:1fr 1fr 1fr; } }

  .pk-card{ background:var(--surface); border:1px solid var(--border); border-radius:16px; padding:12px; box-shadow:0 2px 10px rgba(0,0,0,0.18); }
  .pk-card.locked{ opacity:0.96; }
  .pk-head{ display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:10px; min-height:22px; }
  .pk-time{ font-size:0.76rem; font-weight:700; color:var(--text-muted); letter-spacing:0.03em; }
  .pk-badge{ font-size:0.62rem; font-weight:800; letter-spacing:0.06em; padding:2px 9px; border-radius:999px; background:var(--field); color:#fff; white-space:nowrap; }
  .pk-badge.fin{ background:var(--surface-2); color:var(--text); border:1px solid var(--border); }
  .pk-badge.live{ background:var(--warn-bg, #3a2f10); color:var(--warn, #e0a82e); border:1px solid var(--warn, #e0a82e); }
  .pk-badge.dirty{ background:var(--accent); color:var(--accent-ink); }
  .pk-badge.saved{ background:var(--good-bg); color:var(--good); border:1px solid var(--good); }

  .pk-sides{ display:grid; grid-template-columns:minmax(0,1fr) 22px minmax(0,1fr); align-items:stretch; gap:4px; }
  .pk-at{ display:flex; align-items:center; justify-content:center; color:var(--text-muted); font-weight:800; font-size:0.8rem; }
  .pk-side{ position:relative; }
  .pk-side-btn{ width:100%; height:100%; display:flex; flex-direction:column; align-items:center; gap:2px; padding:14px 8px 10px; border-radius:14px; border:2px solid var(--border); background:linear-gradient(180deg, color-mix(in srgb, var(--tc) 14%, var(--surface-2)), var(--surface-2)); color:var(--text); cursor:pointer; font-family:inherit; transition:transform 0.1s ease, border-color 0.12s ease, box-shadow 0.12s ease; }
  .pk-side-btn:hover:not(:disabled){ border-color:var(--tc); transform:translateY(-1px); }
  .pk-side-btn:disabled{ cursor:default; }
  .pk-side.sel .pk-side-btn{ border-color:var(--tc); box-shadow:0 0 0 2px var(--tc), 0 6px 18px color-mix(in srgb, var(--tc) 35%, transparent); background:linear-gradient(180deg, color-mix(in srgb, var(--tc) 34%, var(--surface-2)), color-mix(in srgb, var(--tc) 14%, var(--surface-2))); }
  .pk-side.win .pk-side-btn{ border-color:var(--good); box-shadow:0 0 0 2px var(--good); }
  .pk-side.loss .pk-side-btn{ border-color:var(--danger); box-shadow:0 0 0 2px var(--danger); }
  .pk-side.push .pk-side-btn{ border-color:var(--text-muted); box-shadow:0 0 0 2px var(--text-muted); }
  .pk-side.disabled:not(.sel) .pk-side-btn{ opacity:0.82; }
  .pk-team{ font-family:'Oswald',sans-serif; font-weight:700; font-size:1.15rem; letter-spacing:0.02em; margin-top:6px; }
  .pk-nick{ font-size:0.68rem; color:var(--text-muted); text-align:center; }
  .pk-line{ font-family:'Oswald',sans-serif; font-weight:800; font-size:1.55rem; margin-top:6px; line-height:1; }
  .pk-ml{ font-size:0.7rem; color:var(--text-muted); }
  .pk-tag{ min-height:14px; font-size:0.6rem; font-weight:800; letter-spacing:0.08em; color:var(--accent); margin-top:4px; }
  .pk-side.win .pk-tag{ color:var(--good); } .pk-side.loss .pk-tag{ color:var(--danger); }
  .pk-star{ position:absolute; top:6px; right:8px; z-index:2; border:none; background:transparent; color:var(--text-muted); font-size:1.25rem; line-height:1; padding:2px 4px; cursor:pointer; border-radius:6px; }
  .pk-star:hover{ color:var(--accent); background:rgba(127,127,127,0.14); }
  .pk-star.on{ color:var(--accent); text-shadow:0 0 8px color-mix(in srgb, var(--accent) 55%, transparent); }

  .pk-ou{ display:grid; grid-template-columns:1fr auto 1fr; gap:8px; align-items:stretch; margin-top:10px; }
  .pk-ou-btn{ display:flex; align-items:center; justify-content:center; gap:8px; padding:10px 8px; border-radius:12px; border:2px solid var(--border); background:var(--surface-2); color:var(--text); font-family:inherit; cursor:pointer; transition:border-color 0.12s ease; }
  .pk-ou-btn:hover:not(:disabled){ border-color:var(--accent); }
  .pk-ou-btn:disabled{ cursor:default; }
  .pk-ou-btn.sel{ border-color:var(--accent); background:color-mix(in srgb, var(--accent) 18%, var(--surface-2)); box-shadow:0 0 0 2px var(--accent); }
  .pk-ou-btn.win{ border-color:var(--good); box-shadow:0 0 0 2px var(--good); background:var(--good-bg); }
  .pk-ou-btn.loss{ border-color:var(--danger); box-shadow:0 0 0 2px var(--danger); background:var(--danger-bg); }
  .pk-ou-btn.push{ border-color:var(--text-muted); box-shadow:0 0 0 2px var(--text-muted); }
  .pk-ou-dir{ font-family:'Oswald',sans-serif; font-weight:700; letter-spacing:0.05em; font-size:0.9rem; }
  .pk-ou-num{ font-family:'Oswald',sans-serif; font-weight:800; font-size:1.05rem; color:var(--text-muted); }
  .pk-ou-btn.sel .pk-ou-num{ color:var(--accent); }
  .pk-ou-mid{ display:flex; flex-direction:column; align-items:center; justify-content:center; font-size:0.6rem; text-transform:uppercase; letter-spacing:0.06em; color:var(--text-muted); min-width:64px; }
  .pk-ou-mid b{ font-family:'Oswald',sans-serif; font-size:1.1rem; color:var(--text); letter-spacing:0; }

  .pk-info{ display:flex; flex-wrap:wrap; gap:6px 14px; margin-top:12px; padding-top:10px; border-top:1px solid var(--border); font-size:0.74rem; color:var(--text-muted); }
  .pk-info b{ color:var(--text); font-weight:700; margin-right:4px; text-transform:uppercase; font-size:0.62rem; letter-spacing:0.05em; }
  .pk-results{ display:flex; flex-wrap:wrap; gap:6px; margin-top:10px; }
  .pk-res{ font-size:0.74rem; font-weight:800; padding:3px 10px; border-radius:999px; border:1px solid var(--border); }
  .pk-res.win{ color:var(--good); border-color:var(--good); background:var(--good-bg); }
  .pk-res.loss{ color:var(--danger); border-color:var(--danger); background:var(--danger-bg); }
  .pk-res.push, .pk-res.none{ color:var(--text-muted); }
  .pk-foot{ margin-top:10px; font-size:0.76rem; } .pk-foot a{ color:var(--accent); font-weight:700; text-decoration:none; }

  .pk-savebar{ position:sticky; bottom:46px; z-index:20; display:flex; align-items:center; justify-content:flex-end; gap:10px; margin-top:14px; padding:10px 14px; background:var(--surface); border:1px solid var(--border); border-radius:14px; box-shadow:0 6px 24px rgba(0,0,0,0.35); }
  .pk-savebar.dirty{ border-color:var(--accent); }
  .pk-save-note{ margin-right:auto; font-size:0.82rem; color:var(--text-muted); font-weight:600; }
  .pk-savebar.dirty .pk-save-note{ color:var(--accent); }
  .pk-savebar .btn[disabled]{ opacity:0.5; cursor:default; }
  @media (max-width:520px){ .pk-line{ font-size:1.3rem; } .pk-team{ font-size:1rem; } .pk-ou-mid{ min-width:52px; } }

  /* ---- Research > Player Stats ---- */
  .ps-chiprow{ display:flex; flex-wrap:wrap; gap:10px 18px; align-items:center; margin:12px 0 4px; }
  .ps-opt{ border:1px solid var(--border); background:var(--surface-2); color:var(--text-muted); border-radius:999px; padding:5px 12px; font-size:0.78rem; font-weight:700; cursor:pointer; }
  .ps-opt.on{ border-color:var(--accent); color:var(--accent); }
  .ps-strip{ display:flex; flex-wrap:wrap; gap:10px; align-items:stretch; margin:14px 0 6px; }
  .ps-strip-team{ display:flex; align-items:center; gap:10px; padding:8px 14px; border:1px solid var(--border); background:var(--surface-2); border-radius:12px; } .ps-strip-team b{ font-family:'Oswald',sans-serif; font-size:1.2rem; } .ps-strip-team span{ font-size:0.66rem; text-transform:uppercase; letter-spacing:0.06em; color:var(--text-muted); }
  .ps-tile{ min-width:104px; padding:8px 14px; border:1px solid var(--border); background:var(--surface-2); border-radius:12px; text-align:center; }
  .ps-tile-l{ font-size:0.62rem; text-transform:uppercase; letter-spacing:0.06em; color:var(--text-muted); font-weight:700; } .ps-tile-v{ font-family:'Oswald',sans-serif; font-size:1.35rem; line-height:1.2; } .ps-tile-s{ font-size:0.62rem; color:var(--text-muted); }
  .ps-wrap{ margin-top:10px; max-height:none; }
  table.ps-table{ width:100%; border-collapse:separate; border-spacing:0; font-size:0.84rem; min-width:0; }
  .ps-table th{ position:sticky; top:0; z-index:2; padding:9px 9px; font-size:0.62rem; letter-spacing:0.05em; text-transform:uppercase; color:var(--text-muted); font-weight:700; text-align:right; white-space:nowrap; background:var(--surface); border-bottom:1px solid var(--border); cursor:pointer; }
  .ps-table th.sorted{ color:var(--accent); } .ps-table th:hover{ color:var(--text); }
  .ps-table th.ps-th-player, .ps-table td.ps-player{ position:sticky; left:0; z-index:3; text-align:left; cursor:default; background:var(--surface); min-width:170px; }
  .ps-table th.ps-th-player{ z-index:4; }
  .ps-table td{ padding:7px 9px; border-bottom:1px solid color-mix(in srgb, var(--border) 55%, transparent); vertical-align:middle; font-variant-numeric:tabular-nums; background:transparent; }
  .ps-table td.ps-player{ background:var(--surface); }
  .ps-row{ cursor:pointer; } .ps-row:hover td{ background:color-mix(in srgb, var(--surface-2) 70%, transparent); } .ps-row:hover td.ps-player{ background:var(--surface-2); }
  .ps-row.open td, .ps-row.open td.ps-player{ background:var(--surface-2); }
  td.ps-cell{ white-space:nowrap; text-align:right; }
  td.ps-bar{ background-image:linear-gradient(90deg, color-mix(in srgb, var(--accent) 17%, transparent) var(--bar), transparent var(--bar)); background-repeat:no-repeat; background-size:100% 62%; background-position:left center; }
  .ps-v{ position:relative; font-weight:600; }
  .ps-d{ display:block; font-size:0.62rem; font-weight:800; line-height:1.1; } .ps-d.up{ color:var(--good); } .ps-d.dn{ color:var(--danger); }
  .ps-pwrap{ display:flex; align-items:center; gap:9px; }
  .ps-hs{ width:34px; height:34px; border-radius:50%; object-fit:cover; object-position:top; background:#fff; border:2px solid var(--accent); flex-shrink:0; } .ps-hs-ph{ display:inline-block; background:var(--surface-2); border-color:var(--border); }
  .ps-sub{ display:flex; align-items:center; gap:5px; margin-top:2px; font-size:0.66rem; color:var(--text-muted); } .ps-sub .pill{ padding:1px 6px; font-size:0.58rem; }
  .ps-detail > td{ background:var(--surface-2) !important; padding:14px 16px; border-bottom:1px solid var(--border); }
  .ps-sparks{ display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:10px; margin-bottom:12px; }
  .ps-sp{ border:1px solid var(--border); background:var(--surface); border-radius:12px; padding:8px 12px; }
  .ps-sp-l{ font-size:0.62rem; text-transform:uppercase; letter-spacing:0.06em; color:var(--text-muted); font-weight:700; } .ps-sp-v{ font-family:'Oswald',sans-serif; font-size:1.05rem; } .ps-sp-v span{ font-family:inherit; font-size:0.6rem; color:var(--text-muted); text-transform:uppercase; letter-spacing:0.05em; }
  .ps-spark{ width:100%; max-width:130px; height:34px; display:block; } .ps-sline{ fill:none; stroke:var(--accent); stroke-width:2; stroke-linejoin:round; stroke-linecap:round; } .ps-sdot{ fill:var(--surface-2); stroke:var(--accent); stroke-width:1.4; } .ps-sdot.last{ fill:var(--accent); }
  table.ps-mini{ width:100%; border-collapse:collapse; font-size:0.78rem; min-width:0; }
  .ps-mini th{ position:static; background:transparent; cursor:default; padding:6px 8px; } .ps-mini td{ padding:5px 8px; border-bottom:1px solid color-mix(in srgb, var(--border) 45%, transparent); text-align:right; } .ps-mini td:first-child, .ps-mini td:nth-child(2){ text-align:left; }
  .ps-mini tr.ps-season td{ font-weight:800; color:var(--accent); border-top:1px solid var(--border); }
  .ps-weeks-head{ display:flex; flex-wrap:wrap; gap:10px; align-items:center; margin:8px 0; } .ps-weeks-head label{ font-size:0.7rem; text-transform:uppercase; letter-spacing:0.06em; font-weight:700; color:var(--text-muted); } .ps-weeks-head select{ min-width:220px; }
  td.ps-hm{ text-align:center; font-weight:700; } td.ps-season-c{ color:var(--accent); } .ps-matrix td.num{ vertical-align:middle; }
  @media (max-width:700px){ .ps-table th.ps-th-player, .ps-table td.ps-player{ min-width:136px; } .ps-hs{ width:28px; height:28px; } }

  /* ---- NBA (owner-only) ---- */
  .nba-private{ color:var(--accent); font-weight:700; }
  .nba-chiprow{ display:flex; flex-wrap:wrap; gap:10px 18px; align-items:center; margin:12px 0 6px; }
  .nba-badge{ display:inline-flex; align-items:center; justify-content:center; border-radius:50%; background:#fff; overflow:hidden; box-shadow:0 0 0 2px var(--c, var(--border)); vertical-align:middle; flex-shrink:0; font-size:0.6rem; font-weight:800; color:#222; }
  .nba-badge img{ width:82%; height:82%; object-fit:contain; }
  .nba-hs{ width:36px; height:36px; border-radius:50%; object-fit:cover; object-position:top; background:#fff; border:2px solid var(--accent); flex-shrink:0; display:inline-block; }
  .nba-hs.lg{ width:64px; height:64px; } .nba-hs-ph{ background:var(--surface-2); border-color:var(--border); }
  .nba-wrap{ margin-top:10px; }
  table.nba-table{ width:100%; border-collapse:separate; border-spacing:0; font-size:0.84rem; min-width:0; }
  .nba-table th{ position:sticky; top:0; z-index:2; padding:9px 9px; font-size:0.62rem; letter-spacing:0.05em; text-transform:uppercase; color:var(--text-muted); font-weight:700; text-align:left; white-space:nowrap; background:var(--surface); border-bottom:1px solid var(--border); }
  .nba-table th.num, .nba-table td.num{ text-align:right; }
  .nba-table th[data-nsort]{ cursor:pointer; } .nba-table th.sorted{ color:var(--accent); }
  .nba-table td{ padding:7px 9px; border-bottom:1px solid color-mix(in srgb, var(--border) 55%, transparent); vertical-align:middle; font-variant-numeric:tabular-nums; background:transparent; }
  .nba-table th.nba-th-player, .nba-table td.nba-player{ position:sticky; left:0; z-index:3; background:var(--surface); min-width:190px; }
  .nba-table th.nba-th-player{ z-index:4; }
  .nba-row{ cursor:pointer; } .nba-row:hover td{ background:color-mix(in srgb, var(--surface-2) 70%, transparent); } .nba-row:hover td.nba-player{ background:var(--surface-2); } .nba-row.open td, .nba-row.open td.nba-player{ background:var(--surface-2); }
  td.nba-cell{ white-space:nowrap; }
  td.nba-bar{ background-image:linear-gradient(90deg, color-mix(in srgb, var(--accent) 17%, transparent) var(--bar), transparent var(--bar)); background-repeat:no-repeat; background-size:100% 62%; background-position:left center; }
  .nba-v{ position:relative; font-weight:600; }
  .nba-d{ display:block; font-size:0.62rem; font-weight:800; line-height:1.1; } .nba-d.up, .nba-up{ color:var(--good); } .nba-d.dn, .nba-dn{ color:var(--danger); }
  .nba-pwrap{ display:flex; align-items:center; gap:9px; }
  .nba-name{ font-weight:700; }
  .nba-sub{ display:flex; align-items:center; gap:6px; margin-top:2px; font-size:0.68rem; color:var(--text-muted); }
  .nba-pos{ font-weight:700; letter-spacing:0.03em; }
  .nba-new{ font-size:0.56rem; font-weight:800; letter-spacing:0.06em; padding:1px 6px; border-radius:999px; background:color-mix(in srgb, var(--accent) 22%, var(--surface)); color:var(--accent); }
  .nba-tm{ font-size:0.74rem; color:var(--text-muted); font-weight:700; }
  .nba-inj{ display:inline-block; margin-left:6px; font-size:0.58rem; font-weight:800; letter-spacing:0.05em; text-transform:uppercase; padding:1px 7px; border-radius:999px; border:1px solid var(--border); vertical-align:middle; }
  .nba-inj.out{ background:var(--danger-bg); color:var(--danger); border-color:var(--danger); } .nba-inj.doubt{ background:color-mix(in srgb, var(--warn, #B8A10A) 20%, var(--surface)); color:var(--warn, #B8A10A); border-color:var(--warn, #B8A10A); } .nba-inj.dtd{ background:var(--surface-2); color:var(--text-muted); }
  .nba-counts{ display:flex; gap:8px; flex-wrap:wrap; margin:6px 0 10px; } .nba-counts .nba-inj{ margin-left:0; font-size:0.7rem; padding:3px 10px; }
  .nba-note{ max-width:340px; font-size:0.78rem; color:var(--text-muted); }
  tr.nba-out td{ opacity:0.6; }
  .nba-detail > td{ background:var(--surface-2) !important; padding:14px 16px; }
  .nba-detail-in{ display:grid; grid-template-columns:minmax(180px,1fr) minmax(260px,1.3fr) minmax(220px,1fr); gap:18px; align-items:start; }
  @media (max-width:900px){ .nba-detail-in{ grid-template-columns:1fr; } }
  .nba-bio{ font-size:0.84rem; line-height:1.6; } .nba-injnote{ margin-top:6px; font-size:0.78rem; color:var(--text-muted); }
  table.nba-mini{ width:100%; border-collapse:collapse; font-size:0.78rem; min-width:0; } .nba-mini th{ position:static; background:transparent; padding:5px 8px; } .nba-mini td{ padding:4px 8px; border-bottom:1px solid color-mix(in srgb, var(--border) 45%, transparent); }
  .nba-tiles{ display:grid; grid-template-columns:repeat(3,1fr); gap:8px; }
  .nba-tile{ border:1px solid var(--border); background:var(--surface); border-radius:12px; padding:8px 12px; text-align:center; }
  .nba-tile-l{ font-size:0.6rem; text-transform:uppercase; letter-spacing:0.06em; color:var(--text-muted); font-weight:700; } .nba-tile-v{ font-family:'Oswald',sans-serif; font-size:1.25rem; } .nba-tile-s{ font-size:0.6rem; color:var(--text-muted); }
  .nba-strip{ display:flex; flex-wrap:wrap; gap:10px; align-items:stretch; margin:12px 0 14px; }
  .nba-strip .nba-tile{ min-width:100px; background:var(--surface-2); }
  .nba-strip-team{ display:flex; align-items:center; gap:12px; padding:8px 16px; border:1px solid var(--border); background:var(--surface-2); border-radius:12px; } .nba-strip-team b{ font-family:'Oswald',sans-serif; font-size:1.2rem; display:block; } .nba-strip-team span{ font-size:0.64rem; text-transform:uppercase; letter-spacing:0.06em; color:var(--text-muted); }
  .nba-chart{ border:1px solid var(--border); background:var(--surface-2); border-radius:14px; padding:14px 16px; margin-bottom:14px; min-width:0; }
  .nba-chart h4{ margin:0 0 10px; font-family:'Oswald',sans-serif; text-transform:uppercase; letter-spacing:0.04em; font-size:0.85rem; display:flex; gap:10px; align-items:baseline; flex-wrap:wrap; }
  .nba-starters{ display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:10px; } @media (max-width:900px){ .nba-starters{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
  .nba-start{ display:flex; flex-direction:column; align-items:center; gap:4px; text-align:center; padding:12px 8px; border:1px solid var(--border); background:var(--surface); border-radius:14px; }
  .nba-start-pos{ font-family:'Oswald',sans-serif; font-weight:800; font-size:0.8rem; letter-spacing:0.08em; color:var(--accent); } .nba-start-name{ font-weight:800; font-size:0.9rem; line-height:1.2; } .nba-start-sub{ font-size:0.68rem; color:var(--text-muted); }
  .nba-mstack{ display:flex; height:34px; border-radius:8px; overflow:hidden; gap:1px; background:var(--border); } .nba-mseg{ display:flex; align-items:center; justify-content:center; color:#fff; font-size:0.66rem; font-weight:800; overflow:hidden; white-space:nowrap; text-shadow:0 1px 2px rgba(0,0,0,0.45); }
  .nba-mcell{ min-width:150px; } .nba-mbar{ position:relative; height:20px; background:color-mix(in srgb, var(--border) 50%, transparent); border-radius:6px; overflow:hidden; } .nba-mbar i{ display:block; height:100%; background:color-mix(in srgb, var(--accent) 55%, transparent); } .nba-mbar b{ position:absolute; left:8px; top:0; line-height:20px; font-size:0.74rem; }
  .nba-role{ font-size:0.6rem; font-weight:800; letter-spacing:0.05em; text-transform:uppercase; padding:2px 8px; border-radius:999px; background:var(--surface-2); color:var(--text-muted); border:1px solid var(--border); white-space:nowrap; }
  .nba-role.start{ background:var(--good-bg); color:var(--good); border-color:var(--good); } .nba-role.sixth{ background:color-mix(in srgb, var(--accent) 20%, var(--surface)); color:var(--accent); border-color:var(--accent); } .nba-role.out{ background:var(--danger-bg); color:var(--danger); border-color:var(--danger); }
  .nba-moves{ display:grid; gap:6px; font-size:0.84rem; line-height:1.5; }
  @media (max-width:700px){ .nba-table th.nba-th-player, .nba-table td.nba-player{ min-width:140px; } .nba-hs{ width:28px; height:28px; } }

  /* ---- NBA rankings / draft guide ---- */
  .nba-lbl{ font-size:0.7rem; text-transform:uppercase; letter-spacing:0.06em; font-weight:700; color:var(--text-muted); margin-right:6px; }
  .nba-punt{ display:flex; align-items:center; flex-wrap:wrap; gap:5px; }
  .nba-pchip{ border:1px solid var(--border); background:var(--surface-2); color:var(--text-muted); border-radius:999px; padding:3px 10px; font-size:0.72rem; font-weight:800; cursor:pointer; }
  .nba-pchip.on{ background:var(--danger-bg); color:var(--danger); border-color:var(--danger); text-decoration:line-through; }
  .nba-table th.punted, .nba-table td.punted{ opacity:0.35; }
  tr.nba-tier td{ background:color-mix(in srgb, var(--accent) 14%, var(--surface)); color:var(--accent); font-family:'Oswald',sans-serif; font-weight:700; letter-spacing:0.08em; text-transform:uppercase; font-size:0.72rem; padding:4px 10px; }
  .nba-tierpill{ font-size:0.62rem; font-weight:800; padding:1px 7px; border-radius:999px; background:var(--surface-2); border:1px solid var(--border); color:var(--text-muted); }
  td.nba-z{ text-align:center; font-weight:700; font-size:0.78rem; }
  .nba-two{ display:grid; grid-template-columns:1fr 1fr; gap:18px; } @media (max-width:900px){ .nba-two{ grid-template-columns:1fr; } }
  .nba-chart h5{ margin:0 0 8px; font-family:'Oswald',sans-serif; text-transform:uppercase; letter-spacing:0.04em; font-size:0.78rem; }
  .nba-bullets{ margin:0; padding-left:18px; display:grid; gap:7px; font-size:0.88rem; line-height:1.5; }
  .nba-clock{ display:flex; flex-wrap:wrap; gap:18px 30px; align-items:center; margin-bottom:14px; padding:10px 14px; background:var(--surface); border:1px solid var(--border); border-radius:12px; } .nba-clock b{ font-family:'Oswald',sans-serif; font-size:1.5rem; margin:0 6px; } .nba-clock-l{ display:block; font-size:0.62rem; text-transform:uppercase; letter-spacing:0.06em; color:var(--text-muted); font-weight:700; }
  .nba-picks{ display:flex; flex-wrap:wrap; gap:6px; }
  .nba-pick{ display:inline-flex; align-items:center; gap:7px; padding:5px 10px; border-radius:10px; border:1px solid var(--border); background:var(--surface); color:var(--text); cursor:pointer; font-size:0.8rem; text-align:left; }
  .nba-pick:hover{ border-color:var(--accent); } .nba-pickn{ font-family:'Oswald',sans-serif; font-weight:800; color:var(--accent); min-width:22px; text-align:center; } .nba-pickname{ font-weight:700; } .nba-pickmeta{ font-size:0.66rem; color:var(--text-muted); }
  .nba-find{ width:100%; max-width:340px; }
  .nba-myteam{ display:grid; gap:4px; font-size:0.84rem; margin-bottom:10px; } .nba-myrow{ padding:4px 8px; border-radius:8px; background:var(--surface); border:1px solid var(--border); }
  .nba-needs{ display:grid; gap:5px; } .nba-need{ display:grid; grid-template-columns:42px 1fr 44px; gap:8px; align-items:center; font-size:0.74rem; font-weight:700; }
  .nba-needbar{ position:relative; height:12px; background:color-mix(in srgb, var(--border) 50%, transparent); border-radius:6px; } .nba-needbar i{ position:absolute; top:0; bottom:0; border-radius:6px; } .nba-needbar i.pos{ background:var(--good); } .nba-needbar i.neg{ background:var(--danger); } .nba-need b{ text-align:right; }
  .nba-tiers{ display:grid; gap:6px; } .nba-tierrow{ display:grid; grid-template-columns:44px 1fr; gap:10px; align-items:start; padding:6px 0; border-bottom:1px solid color-mix(in srgb, var(--border) 50%, transparent); }
  .nba-tiern{ font-family:'Oswald',sans-serif; font-weight:800; color:var(--accent); } .nba-tierp{ display:flex; flex-wrap:wrap; gap:5px; }
  .nba-tp{ font-size:0.76rem; font-weight:700; padding:3px 9px; border-radius:999px; background:var(--surface); border:1px solid var(--border); } .nba-tp i{ font-style:normal; font-size:0.58rem; color:var(--text-muted); margin-left:5px; } .nba-tp.gone{ opacity:0.3; text-decoration:line-through; }
  .nba-gap{ display:flex; justify-content:space-between; gap:10px; padding:5px 0; border-bottom:1px solid color-mix(in srgb, var(--border) 45%, transparent); font-size:0.82rem; } .nba-gap i{ font-style:normal; font-weight:800; }
  .nba-scar{ display:grid; grid-template-columns:repeat(5,1fr); gap:12px; } .nba-scol{ display:flex; flex-direction:column; align-items:center; gap:4px; text-align:center; } .nba-scol > b{ font-family:'Oswald',sans-serif; font-size:1.1rem; }
  .nba-sbars{ display:flex; gap:4px; align-items:flex-end; height:130px; width:100%; justify-content:center; } .nba-sbar{ position:relative; flex:1; max-width:34px; height:100%; display:flex; align-items:flex-end; justify-content:center; } .nba-sbar i{ display:block; width:100%; background:color-mix(in srgb, var(--accent) 65%, transparent); border-radius:5px 5px 0 0; } .nba-sbar em{ position:absolute; top:-2px; font-style:normal; font-size:0.6rem; font-weight:800; transform:translateY(-100%); } .nba-sbar span{ position:absolute; bottom:-16px; font-size:0.54rem; color:var(--text-muted); } .nba-scol{ padding-bottom:6px; } .nba-sbars{ margin-bottom:18px; }
  /* ---- NBA DFS ---- */
  .nba-games{ display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:10px; margin:12px 0; }
  .nba-game{ display:grid; grid-template-columns:auto 1fr; gap:6px 12px; align-items:center; padding:10px 14px; border:1px solid var(--border); background:var(--surface-2); border-radius:14px; }
  .nba-game-teams{ display:flex; align-items:center; gap:6px; } .nba-at{ color:var(--text-muted); font-weight:800; }
  .nba-game-names b{ display:block; font-family:'Oswald',sans-serif; } .nba-game-names span, .nba-game-line span{ font-size:0.72rem; color:var(--text-muted); }
  .nba-game-line{ grid-column:1 / -1; display:flex; gap:12px; align-items:baseline; } .nba-game-line b{ color:var(--accent); } .nba-game-inj{ grid-column:1 / -1; font-size:0.7rem; color:var(--danger); font-weight:700; }
  /* ---- schedule: finals, live scores, box score window ---- */
  .nba-game-box{ cursor:pointer; transition:border-color .15s, transform .15s; } .nba-game-box:hover, .nba-game-box:focus-visible{ border-color:var(--accent); transform:translateY(-1px); outline:none; }
  .nba-game-res{ grid-column:1 / -1; display:flex; flex-wrap:wrap; gap:6px 14px; align-items:center; }
  .nbsc-score{ display:flex; gap:14px; font-family:'Oswald',sans-serif; } .nbsc-score i{ font-style:normal; color:var(--text-muted); font-size:.95rem; } .nbsc-score i b{ font-size:1.25rem; color:var(--text); } .nbsc-score i.w, .nbsc-score i.w b{ color:var(--accent); }
  .nbsc-tag{ font-size:.68rem; font-weight:800; letter-spacing:.06em; padding:2px 8px; border-radius:999px; background:var(--surface); border:1px solid var(--border); color:var(--text-muted); } .nbsc-tag.live{ color:#fff; background:var(--danger); border-color:var(--danger); } .nbsc-tag.final{ color:var(--text); }
  .nbsc-box{ margin-left:auto; font-size:.74rem; font-weight:700; color:var(--accent); }
  body.nbsc-lock{ overflow:hidden; }
  .nbsc-modal{ position:fixed; inset:0; z-index:1200; background:rgba(0,0,0,.7); display:flex; align-items:flex-start; justify-content:center; padding:4vh 12px; overflow-y:auto; } .nbsc-modal[hidden]{ display:none; }
  .nbsc-card{ position:relative; width:min(980px,100%); background:var(--surface); border:1px solid var(--border); border-radius:18px; padding:20px 18px 16px; box-shadow:0 24px 60px rgba(0,0,0,.5); }
  .nbsc-x{ position:absolute; top:8px; right:12px; background:none; border:0; color:var(--text-muted); font-size:1.8rem; line-height:1; cursor:pointer; } .nbsc-x:hover{ color:var(--text); }
  .nbsc-big{ display:flex; align-items:center; justify-content:center; gap:26px; } .nbsc-big em{ font-style:normal; color:var(--text-muted); font-weight:800; }
  .nbsc-bt{ display:flex; align-items:center; gap:10px; font-family:'Oswald',sans-serif; color:var(--text-muted); } .nbsc-bt span{ font-size:1.2rem; } .nbsc-bt b{ font-size:2.4rem; color:var(--text); } .nbsc-bt.w b{ color:var(--accent); }
  .nbsc-st{ text-align:center; margin:6px 0 10px; }
  .nbsc-lines{ margin:0 auto; border-collapse:collapse; font-size:.85rem; } .nbsc-lines th, .nbsc-lines td{ padding:5px 12px; text-align:center; color:var(--text-muted); } .nbsc-lines th{ font-size:.7rem; font-weight:700; } .nbsc-lines td.nbsc-ln-t{ text-align:left; color:var(--text); } .nbsc-lines td.nbsc-ln-f{ color:var(--text); font-weight:800; } .nbsc-lines td.nbsc-ln-f.w{ color:var(--accent); } .nbsc-ln-t b{ font-family:'Oswald',sans-serif; margin-left:4px; }
  .nbsc-tabs{ display:flex; gap:8px; margin:14px 0 8px; flex-wrap:wrap; } .nbsc-tabs button{ display:flex; align-items:center; gap:6px; padding:7px 14px; border-radius:999px; border:1px solid var(--border); background:var(--surface-2); color:var(--text); font-weight:700; cursor:pointer; } .nbsc-tabs button.active{ border-color:var(--accent); background:color-mix(in srgb, var(--accent) 18%, var(--surface)); }
  .nbsc-tbl{ width:100%; border-collapse:collapse; font-size:.82rem; } .nbsc-tbl th{ font-size:.66rem; color:var(--text-muted); font-weight:700; text-align:right; padding:6px 7px; border-bottom:1px solid var(--border); white-space:nowrap; } .nbsc-tbl td{ text-align:right; padding:6px 7px; border-bottom:1px solid color-mix(in srgb, var(--border) 60%, transparent); white-space:nowrap; font-variant-numeric:tabular-nums; }
  .nbsc-tbl th.nbsc-pl, .nbsc-tbl td.nbsc-pl{ text-align:left; position:sticky; left:0; background:var(--surface); min-width:150px; } .nbsc-pl{ display:table-cell; } .nbsc-tbl td.nbsc-pl span{ display:inline-flex; flex-direction:column; vertical-align:middle; line-height:1.15; } .nbsc-tbl td.nbsc-pl img{ width:26px; height:26px; border-radius:50%; object-fit:cover; background:var(--surface-2); vertical-align:middle; margin-right:8px; } .nbsc-tbl td.nbsc-pl small{ color:var(--text-muted); font-size:.62rem; }
  .nbsc-tbl td.pts{ font-weight:800; color:var(--text); } .nbsc-tbl tr.tot td{ font-weight:800; border-top:1px solid var(--border); } .nbsc-tbl tr.nbsc-sep td{ text-align:left; font-size:.64rem; letter-spacing:.08em; text-transform:uppercase; color:var(--text-muted); padding-top:10px; }
  .nbsc-dnp{ margin:8px 2px 0; } .nbsc-fine{ margin:12px 2px 0; }
  .nbsc-cmp{ margin-top:16px; } .nbsc-cmp h4{ margin:0 0 6px; } .nbsc-cr{ display:grid; grid-template-columns:1fr 1.6fr 1fr; gap:8px; padding:5px 4px; border-bottom:1px solid color-mix(in srgb, var(--border) 60%, transparent); font-size:.85rem; text-align:center; } .nbsc-cr span{ color:var(--text-muted); font-size:.76rem; } .nbsc-cr b:first-child{ text-align:left; } .nbsc-cr b:last-child{ text-align:right; }
  @media (max-width:640px){ .nbsc-big{ gap:12px; } .nbsc-bt b{ font-size:1.8rem; } .nbsc-card{ padding:16px 10px 12px; } .nbsc-lines th, .nbsc-lines td{ padding:4px 7px; } }
  .nba-upload{ display:flex; flex-wrap:wrap; gap:10px; align-items:center; margin-top:6px; font-size:0.84rem; }
  .nba-lk{ white-space:nowrap; } .nba-lkb{ border:1px solid var(--border); background:var(--surface-2); border-radius:8px; padding:2px 6px; cursor:pointer; opacity:0.45; font-size:0.8rem; } .nba-lkb.on{ opacity:1; border-color:var(--accent); background:color-mix(in srgb, var(--accent) 20%, var(--surface)); }
  .nba-est{ color:var(--accent); font-weight:800; }
  .nba-lus{ display:grid; grid-template-columns:repeat(auto-fit,minmax(380px,1fr)); gap:14px; margin-top:12px; } .nba-lus > .hint, .nba-lus > .empty, .nba-lus > .nba-chart{ grid-column:1 / -1; }
  .nba-lu{ border:1px solid var(--border); background:var(--surface-2); border-radius:14px; padding:12px; }
  .nba-lu-head{ display:flex; justify-content:space-between; gap:10px; flex-wrap:wrap; margin-bottom:8px; font-size:0.84rem; } .nba-lu-head b:first-child{ font-family:'Oswald',sans-serif; text-transform:uppercase; letter-spacing:0.04em; }
  .nba-lu-row{ display:grid; grid-template-columns:42px 30px 1fr auto 46px 62px; gap:8px; align-items:center; padding:4px 0; border-bottom:1px solid color-mix(in srgb, var(--border) 45%, transparent); font-size:0.82rem; }
  .nba-lu-row .nba-hs{ width:28px; height:28px; } .nba-lu-slot{ font-family:'Oswald',sans-serif; font-weight:800; font-size:0.74rem; color:var(--accent); } .nba-lu-name{ font-weight:700; } .nba-lu-meta{ font-size:0.68rem; color:var(--text-muted); text-align:right; } .nba-lu-proj{ text-align:right; font-weight:800; } .nba-lu-sal{ text-align:right; color:var(--text-muted); }
  .nba-exp{ display:grid; gap:5px; } .nba-exprow{ display:grid; grid-template-columns:180px 1fr 44px; gap:10px; align-items:center; font-size:0.8rem; } .nba-exprow b{ text-align:right; }
  @media (max-width:520px){ .nba-lus{ grid-template-columns:1fr; } .nba-lu-row{ grid-template-columns:38px 1fr auto 56px; } .nba-lu-row .nba-hs, .nba-lu-meta{ display:none; } }
  #nba-gd-body, #nba-rk-body, #nba-pl-body{ margin-top:16px; }

  /* ---- Football / Basketball switch ---- */
  /* Fantasy / Research / DFS: the Football sections row, directly under the sport tabs */
  nav.subtabs.sport-cats{ display:none; gap:6px; padding-top:8px; padding-bottom:8px; background:var(--surface); }
  body.sport-fb:not(.sport-nba) nav.subtabs.sport-cats#subtabs-football{ display:flex; }
  body.sport-nba nav.subtabs.sport-cats#subtabs-nba-cats{ display:flex; }
  nav.subtabs.sport-cats button{ font-size:0.92rem; padding:9px 20px; font-weight:700; letter-spacing:0.04em; border:1px solid transparent; }
  nav.subtabs.sport-cats button[aria-selected="true"]{ background:var(--field); color:#fff; box-shadow:var(--shadow-sm); }
  nav.subtabs.sport-cats button:hover:not([aria-selected="true"]){ background:rgba(127,127,127,0.14); color:var(--text); }
  nav.tabs button.sport-tab{ border:1px solid var(--border); margin:0 2px; }
  nav.tabs button.sport-tab[aria-selected="true"]{ border-color:var(--accent); }
  body:not(.consumer-mode) #tab-basketball .soon-badge{ display:none; }
  /* ---- NBA profile ---- */
  [data-nplayer]{ cursor:pointer; } [data-nplayer]:hover{ color:var(--accent); text-decoration:underline; }
  .nbp-pos{ background:var(--surface); color:var(--text); font-weight:800; }
  .nbp-chart{ margin:8px 0 14px; } .nbp-w{ fill:var(--good); background:var(--good); } .nbp-l{ fill:var(--danger); background:var(--danger); } .nbp-avg{ stroke:var(--accent); stroke-width:1.4; stroke-dasharray:5 3; }
  .nbp-legend{ display:flex; gap:14px; font-size:0.7rem; color:var(--text-muted); margin-top:4px; } .nbp-legend i{ display:inline-block; width:10px; height:10px; border-radius:3px; margin-right:5px; vertical-align:-1px; }
  .nbp-tools{ display:flex; flex-wrap:wrap; gap:10px 18px; margin:6px 0 12px; }
  table.nbp-table{ width:100%; border-collapse:collapse; font-size:0.8rem; min-width:0; }
  .nbp-table th{ padding:7px 8px; font-size:0.62rem; letter-spacing:0.05em; text-transform:uppercase; color:var(--text-muted); font-weight:700; text-align:left; white-space:nowrap; border-bottom:1px solid var(--border); background:var(--surface); position:sticky; top:0; }
  .nbp-table th.num, .nbp-table td.num{ text-align:right; } .nbp-table td{ padding:6px 8px; border-bottom:1px solid color-mix(in srgb, var(--border) 50%, transparent); white-space:nowrap; font-variant-numeric:tabular-nums; }
  .nbp-sum td{ background:var(--surface-2); font-weight:700; color:var(--accent); } .nbp-post td{ background:color-mix(in srgb, var(--accent) 7%, transparent); }
  .nbp-grp td{ background:var(--surface-2); font-family:'Oswald',sans-serif; text-transform:uppercase; letter-spacing:0.06em; font-size:0.7rem; color:var(--text-muted); }
  .nbp-tag{ font-size:0.55rem; font-weight:800; padding:1px 5px; border-radius:6px; margin-left:4px; background:var(--surface-2); border:1px solid var(--border); } .nbp-tag.td{ background:color-mix(in srgb, var(--accent) 25%, var(--surface)); color:var(--accent); border-color:var(--accent); }
  .nbp-bio{ display:flex; flex-wrap:wrap; gap:8px 22px; margin:6px 0 12px; font-size:0.84rem; } .nbp-bio span{ display:block; font-size:0.62rem; text-transform:uppercase; letter-spacing:0.06em; color:var(--text-muted); font-weight:700; }
  .nbp-inj{ padding:10px 14px; border:1px solid var(--border); background:var(--surface-2); border-radius:12px; margin-bottom:12px; font-size:0.86rem; }
  .nbp-cats{ display:grid; gap:6px; max-width:520px; }
  #pl-modal .nba-need{ grid-template-columns:42px 1fr 44px; }
  nav.tabs button.sport-tab{ display:inline-flex; align-items:center; gap:7px; }
  .sport-logo{ width:22px; height:22px; object-fit:contain; flex-shrink:0; }

  /* ---- NBA league views / tools ---- */
  td.nba-rk{ text-align:center; } td.nba-rk b{ display:block; font-size:0.84rem; } td.nba-rk span{ font-size:0.6rem; color:var(--text-muted); }
  .nba-b2b{ font-size:0.6rem; font-weight:800; padding:1px 7px; border-radius:999px; background:color-mix(in srgb, var(--accent) 22%, var(--surface)); color:var(--accent); }
  .nba-leads{ display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:8px; margin-bottom:14px; }
  .nba-lead{ display:grid; gap:2px; padding:8px 12px; border:1px solid var(--border); background:var(--surface-2); border-radius:12px; } .nba-lead span{ font-size:0.6rem; text-transform:uppercase; letter-spacing:0.06em; color:var(--text-muted); font-weight:700; } .nba-lead b{ font-size:0.86rem; cursor:pointer; } .nba-lead i{ font-style:normal; font-family:'Oswald',sans-serif; font-size:1.2rem; color:var(--accent); }
  .nba-gcount{ display:flex; gap:12px; align-items:flex-start; padding:6px 0; border-bottom:1px solid color-mix(in srgb, var(--border) 45%, transparent); } .nba-gcount > b{ font-family:'Oswald',sans-serif; font-size:1.4rem; color:var(--accent); min-width:26px; } .nba-gcount > div{ display:flex; flex-wrap:wrap; gap:5px; }
  tr.nba-playin td{ opacity:0.85; background:color-mix(in srgb, var(--accent) 6%, transparent); }
  .nba-leadlist{ display:grid; gap:4px; margin-top:8px; } .nba-leadrow{ display:flex; align-items:center; gap:10px; padding:4px 0; border-bottom:1px solid color-mix(in srgb, var(--border) 40%, transparent); } .nba-leadrow .nba-hs{ width:30px; height:30px; } .nba-lname{ min-width:210px; display:flex; flex-direction:column; } .nba-lname i{ font-style:normal; font-size:0.66rem; color:var(--text-muted); } .nba-leadv{ min-width:56px; text-align:right; font-family:'Oswald',sans-serif; }
  .nba-news{ display:flex; gap:12px; padding:10px 0; border-bottom:1px solid color-mix(in srgb, var(--border) 50%, transparent); text-decoration:none; color:var(--text); } .nba-news img{ width:112px; height:64px; object-fit:cover; border-radius:8px; flex-shrink:0; } .nba-news b{ display:block; font-size:0.9rem; line-height:1.3; } .nba-news p{ margin:3px 0; font-size:0.78rem; color:var(--text-muted); line-height:1.35; } .nba-news span{ font-size:0.66rem; color:var(--text-muted); } .nba-news:hover b{ color:var(--accent); }
  .nba-best{ color:var(--good); font-weight:800; background:color-mix(in srgb, var(--good) 12%, transparent); }
  .nba-cmp-h{ text-align:center !important; min-width:150px; } .nba-cmp td.num{ text-align:center; }
  .nba-verdict{ display:grid; gap:6px; font-size:0.9rem; } .nba-role.sit{ background:var(--danger-bg); color:var(--danger); border-color:var(--danger); }
  .nba-fa{ background:var(--surface-2); color:var(--text-muted); box-shadow:0 0 0 2px var(--border); }
  /* ---- NBA Spread Model: charts, game cards, projections, analytics ---- */
  .nbm-chart{ margin:6px 0 4px; } .nbm-chart svg{ width:100%; height:auto; display:block; overflow:visible; }
  .nbm-grid{ stroke:var(--border); stroke-width:1; opacity:0.55; } .nbm-avg{ stroke:var(--text-muted); stroke-width:1; stroke-dasharray:4 4; opacity:0.55; }
  .nbm-trend{ stroke:var(--accent); stroke-width:2; opacity:0.9; }
  .nbm-ax{ fill:var(--text-muted); font-size:10.5px; } .nbm-axt{ fill:var(--text-muted); font-size:11.5px; font-weight:700; letter-spacing:0.04em; }
  .nbm-lab{ fill:var(--text); font-size:10.5px; font-weight:600; paint-order:stroke; stroke:var(--surface); stroke-width:3px; stroke-linejoin:round; } .nbm-val{ fill:var(--text); font-size:11px; font-weight:800; }
  .nbm-legrow{ display:flex; flex-wrap:wrap; gap:6px 18px; align-items:center; margin:2px 0 6px; } .nbm-leg i{ display:inline-block; width:10px; height:10px; border-radius:50%; margin:0 4px 0 10px; vertical-align:-1px; }
  .nbm-stat{ font-size:0.74rem; font-weight:600; color:var(--text-muted); margin-left:8px; } .nbm-stat b{ color:var(--accent); }
  .nbm-games{ display:grid; grid-template-columns:repeat(auto-fit,minmax(460px,1fr)); gap:14px; margin-top:14px; }
  .nbm-game{ border:1px solid var(--border); background:var(--surface-2); border-radius:14px; padding:14px; }
  .nbm-game-head{ display:flex; flex-wrap:wrap; gap:12px 18px; align-items:center; justify-content:space-between; }
  .nbm-nums{ display:flex; gap:18px; } .nbm-nums > div{ display:grid; gap:1px; text-align:center; } .nbm-nums label{ font-size:0.6rem; text-transform:uppercase; letter-spacing:0.08em; color:var(--text-muted); font-weight:700; } .nbm-nums b{ font-family:'Oswald',sans-serif; font-size:1.05rem; } .nbm-nums span{ font-size:0.7rem; color:var(--text-muted); }
  .nbm-wp{ display:flex; align-items:center; gap:10px; margin:12px 0 8px; font-size:0.74rem; font-weight:700; } .nbm-wpbar{ flex:1; display:flex; height:9px; border-radius:6px; overflow:hidden; background:var(--surface); } .nbm-wpbar i{ display:block; height:100%; opacity:0.9; }
  .nbm-picks{ display:flex; flex-wrap:wrap; gap:8px; align-items:center; } .nbm-pick{ border:1px solid var(--border); border-radius:10px; padding:5px 10px; font-size:0.8rem; background:var(--surface); } .nbm-pick b{ text-transform:uppercase; font-size:0.66rem; letter-spacing:0.06em; margin-right:4px; } .nbm-pick i{ color:var(--text-muted); font-style:normal; font-size:0.72rem; }
  .nbm-pick.good{ border-color:var(--good); background:color-mix(in srgb, var(--good) 14%, var(--surface)); } .nbm-pick.good b{ color:var(--good); } .nbm-pick.warn{ border-color:var(--accent); } .nbm-pick.warn b{ color:var(--accent); }
  .nbm-why{ margin-top:10px; } .nbm-why summary{ cursor:pointer; font-size:0.78rem; color:var(--text-muted); font-weight:700; } .nbm-whygrid{ display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-top:8px; }
  .nbm-facs h5{ margin:0 0 6px; font-family:'Oswald',sans-serif; text-transform:uppercase; letter-spacing:0.05em; font-size:0.78rem; display:flex; align-items:center; gap:6px; } .nbm-facs h5 i{ font-style:normal; font-size:0.6rem; color:var(--text-muted); }
  .nbm-fac{ display:flex; justify-content:space-between; gap:10px; font-size:0.78rem; padding:3px 0; border-bottom:1px solid color-mix(in srgb, var(--border) 45%, transparent); } .nbm-fac span{ color:var(--text-muted); } .nbm-fac-t{ border-bottom:0; font-weight:800; } .nbm-fac-t span{ color:var(--text); }
  .nbm-method p{ margin:0 0 10px; font-size:0.88rem; line-height:1.55; max-width:980px; }
  .nbm-conf{ font-size:0.55rem; font-weight:800; padding:1px 5px; border-radius:6px; border:1px solid var(--border); } .nbm-cA{ color:var(--good); border-color:var(--good); } .nbm-cB{ color:var(--accent); border-color:var(--accent); } .nbm-cC{ color:var(--text-muted); }
  .nbm-rng{ color:var(--text-muted); font-size:0.78rem; }
  @media (max-width:560px){ .nbm-games{ grid-template-columns:1fr; } .nbm-whygrid{ grid-template-columns:1fr; } .nbm-nums{ gap:12px; } }
  /* mobile: leader rows were a fixed 210px name column + bar + value and pushed the whole page sideways */
  @media (max-width:560px){ .nba-lname{ min-width:0; flex:1 1 0; } .nba-leadrow .nba-needbar{ display:none; } .nba-leadrow{ gap:8px; } .nba-leadv{ min-width:48px; } }
  .nba-leadrow > *{ min-width:0; } .nba-lname b, .nba-lname i{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .nba-two > *{ min-width:0; }   /* grid children containing wide tables otherwise force the whole page wider than a phone */
  /* home: NBA launch panel */
  #home-nba-panel{ border-color:color-mix(in srgb, var(--accent) 55%, var(--border)); background:linear-gradient(135deg, color-mix(in srgb, var(--accent) 9%, var(--surface)), var(--surface) 55%); }
  #home-nba-panel .feature-grid{ grid-template-columns:repeat(6, 1fr); gap:14px; } @media (max-width:1100px){ #home-nba-panel .feature-grid{ grid-template-columns:repeat(3, 1fr); } } @media (max-width:640px){ #home-nba-panel .feature-grid{ grid-template-columns:1fr; } }
  .nba-eyebrow{ display:flex; align-items:center; gap:7px; } .nba-eyebrow img{ border-radius:50%; background:#fff; }
  .nba-search-pill{ background:var(--accent); color:#04120a; font-weight:800; font-size:0.62rem; }
  #home-x-feed{ min-height:120px; max-width:760px; } #home-x-feed .twitter-timeline{ color:var(--text-muted); }
  .hx-admin{ display:flex; flex-wrap:wrap; gap:10px; align-items:center; margin:0 0 14px; } .hx-admin input{ flex:1 1 320px; min-width:0; padding:10px 12px; background:var(--surface-2); border:1px solid var(--border); border-radius:8px; color:var(--text); font-size:0.9rem; }
  .hx-grid{ display:grid; grid-template-columns:repeat(auto-fill, minmax(320px, 1fr)); gap:16px; align-items:start; } .hx-item{ position:relative; min-width:0; } .hx-item .twitter-tweet{ margin:0 !important; }
  .hx-del{ position:absolute; top:6px; right:6px; z-index:3; border:0; border-radius:50%; width:26px; height:26px; background:rgba(0,0,0,0.7); color:#fff; cursor:pointer; }
  /* X posts: equal-size cards so mixed-length posts line up in a tidy grid (long posts scroll inside their card) */
  .hx-grid{ grid-template-columns:repeat(auto-fill, minmax(340px, 1fr)); align-items:stretch; }
  .hx-item{ height:470px; overflow-y:auto; overflow-x:hidden; border:1px solid var(--border); border-radius:14px; background:var(--surface-2); padding:6px; display:flex; justify-content:center; align-items:flex-start; scrollbar-width:thin; }
  .hx-item .twitter-tweet, .hx-item .twitter-tweet-rendered, .hx-item iframe{ width:100% !important; max-width:100% !important; margin:0 auto !important; }
  @media (max-width:420px){ .hx-grid{ grid-template-columns:1fr; } }
  /* X posts are fixed in place: no scrolling inside a card, anything that doesn't fit is simply cropped */
  .hx-item{ overflow:hidden !important; position:relative; }
  .hx-item::after{ content:""; position:absolute; left:0; right:0; bottom:0; height:34px; background:linear-gradient(to bottom, transparent, var(--surface-2)); pointer-events:none; border-radius:0 0 14px 14px; }/* ---------- NBA Player Props ---------- */
.nbpr-sum{ font-size:0.82rem; color:var(--text-muted); margin:0 0 12px; line-height:1.5; } .nbpr-sum b{ color:var(--text); }
.nbp-games{ padding-top:0; } .nbp-games button em{ font-style:normal; font-size:0.68rem; opacity:0.75; }
#nbp-mkts button .nbp-n{ font-style:normal; font-size:0.66rem; background:var(--surface-2); border-radius:9px; padding:1px 6px; margin-left:4px; color:var(--text-muted); }
#nbp-mkts button.active .nbp-n{ background:rgba(255,255,255,0.22); color:#fff; }
.nbp-table td small{ display:block; color:var(--text-muted); font-size:0.66rem; font-weight:400; }
.nbp-row{ cursor:pointer; } .nbp-row:hover td{ background:color-mix(in srgb, var(--accent) 6%, transparent); } .nbp-row.open td{ background:color-mix(in srgb, var(--accent) 10%, transparent); }
.nbp-who{ display:flex; align-items:center; gap:10px; min-width:200px; } .nbp-who .nba-hs{ width:32px; height:32px; }
.nbp-who small{ display:flex !important; align-items:center; gap:4px; }
.nbp-line{ font-family:'Oswald',sans-serif; font-size:1rem; color:var(--accent); }
.nbp-lean b{ font-size:0.82rem; } .nbp-time{ min-width:76px; }
.nbp-detail td{ background:var(--surface-2); padding:12px 14px !important; white-space:normal !important; }
.nbp-dgrid{ display:grid; grid-template-columns:repeat(auto-fit, minmax(260px, 1fr)); gap:18px; }
.nbp-dgrid h4{ margin:0 0 6px; font-size:0.72rem; letter-spacing:0.06em; text-transform:uppercase; color:var(--text-muted); }
.nbp-mini{ width:100%; border-collapse:collapse; font-size:0.78rem; }
.nbp-mini th, .nbp-mini td{ padding:5px 8px; border-top:1px solid var(--border); text-align:left; white-space:nowrap; }
.nbp-mini thead th{ border-top:0; font-size:0.64rem; text-transform:uppercase; color:var(--text-muted); } .nbp-mini .num{ text-align:right; }
.nbp-mini small{ display:block; font-size:0.62rem; color:var(--text-muted); }
.nbp-rate{ display:inline-flex; align-items:center; justify-content:center; min-width:30px; height:22px; padding:0 7px; margin-right:7px; border-radius:11px; font-family:'Oswald',sans-serif; font-size:0.82rem; font-weight:700; background:var(--surface-2); color:var(--text-muted); vertical-align:middle; }
.nbp-rate.hi{ background:var(--accent); color:#04130a; } .nbp-rate.mid{ background:rgba(255,194,51,0.22); color:#ffd166; border:1px solid rgba(255,194,51,0.5); } .nbp-rate.lo{ background:var(--surface-2); color:var(--text-muted); }
.nbp-rate.big{ min-width:54px; height:54px; border-radius:50%; font-size:1.45rem; margin:0; padding:0; flex:none; }
.nbr-how{ margin:0 0 14px; border:1px solid var(--border); border-radius:12px; padding:10px 14px; background:var(--surface-2); } .nbr-how summary{ cursor:pointer; font-weight:700; } .nbr-how div{ font-size:0.86rem; line-height:1.55; color:var(--text-muted); } .nbr-how ul{ margin:6px 0; padding-left:18px; } .nbr-how li{ margin:4px 0; } .nbr-how b{ color:var(--text); }
.nbr-h{ margin:22px 0 10px; font-family:'Oswald',sans-serif; font-size:1.15rem; letter-spacing:0.02em; } .nbr-h small{ font-family:inherit; font-size:0.74rem; font-weight:400; color:var(--text-muted); margin-left:8px; letter-spacing:0; }
.nbr-grid{ display:grid; grid-template-columns:repeat(auto-fill, minmax(310px, 1fr)); gap:12px; }
.nbr-card{ border:1px solid var(--border); border-radius:14px; padding:14px; background:var(--surface); display:flex; flex-direction:column; gap:10px; }
.nbr-top{ display:flex; align-items:center; gap:12px; } .nbr-who{ display:flex; align-items:center; gap:9px; min-width:0; } .nbr-who b{ display:block; } .nbr-who small{ display:flex; align-items:center; gap:4px; flex-wrap:wrap; font-size:0.72rem; color:var(--text-muted); }
.nbr-pick{ display:flex; justify-content:space-between; align-items:baseline; gap:10px; padding:8px 10px; border-radius:10px; background:color-mix(in srgb, var(--accent) 10%, transparent); border:1px solid color-mix(in srgb, var(--accent) 35%, transparent); } .nbr-pick b{ font-size:1rem; } .nbr-pick span{ font-weight:700; } .nbr-pick em{ font-style:normal; font-weight:400; font-size:0.72rem; color:var(--text-muted); }
.nbr-stats{ display:grid; grid-template-columns:repeat(6, 1fr); gap:4px; text-align:center; } .nbr-stats i{ display:block; font-style:normal; font-size:0.6rem; text-transform:uppercase; letter-spacing:0.05em; color:var(--text-muted); } .nbr-stats b{ font-size:0.86rem; }
.nbr-why{ margin:0; padding-left:16px; font-size:0.78rem; line-height:1.45; color:var(--text-muted); } .nbr-why li{ margin:3px 0; }
.nbr-act{ display:flex; gap:8px; flex-wrap:wrap; margin-top:auto; } .nbr-act .btn{ padding:6px 12px; font-size:0.78rem; }
.nbr-games{ display:grid; grid-template-columns:repeat(auto-fill, minmax(290px, 1fr)); gap:12px; } .nbr-game{ border:1px solid var(--border); border-radius:12px; padding:10px 12px; background:var(--surface); }
.nbr-game h4{ margin:0 0 6px; font-size:0.9rem; } .nbr-game h4 small{ color:var(--text-muted); font-weight:400; margin-left:6px; } .nbr-game ul{ list-style:none; margin:0; padding:0; } .nbr-game li{ display:flex; align-items:center; gap:4px; padding:5px 0; border-top:1px solid var(--border); font-size:0.82rem; cursor:pointer; } .nbr-game li:first-child{ border-top:0; } .nbr-game li:hover{ color:var(--accent); } .nbr-px{ margin-left:auto; font-weight:700; }
#view-nba-research .nhl-sel{ flex-wrap:nowrap; } @media (max-width:700px){ #view-nba-research .nhl-sel{ flex-wrap:wrap; } }
.nbr-altrow{ cursor:pointer; } .nbr-altrow:hover td{ background:color-mix(in srgb, var(--accent) 6%, transparent); }
@media (max-width:700px){ .nbr-grid, .nbr-games{ grid-template-columns:1fr; } .nbr-stats{ grid-template-columns:repeat(3, 1fr); row-gap:6px; } }
@media (max-width:700px){ .nbp-table:not(.nbr-alt) tr:not(.nbp-detail) > :nth-child(2), .nbp-table:not(.nbr-alt) tr:not(.nbp-detail) > :nth-child(7), .nbp-table:not(.nbr-alt) tr:not(.nbp-detail) > :nth-child(10), .nbp-table:not(.nbr-alt) tr:not(.nbp-detail) > :nth-child(11){ display:none; } .nbp-who{ min-width:150px; } #view-nba-props #nbp-q{ width:100%; min-height:44px; font-size:16px; } }

/* ---------- NBA Hit Rates ---------- */
.nbh-pill{ display:inline-flex; align-items:baseline; gap:5px; padding:2px 8px; border-radius:9px; background:var(--surface-2); font-variant-numeric:tabular-nums; } .nbh-pill b{ font-size:0.86rem; } .nbh-pill i{ font-style:normal; font-size:0.7rem; color:var(--text-muted); }
.nbh-pill.hi{ background:color-mix(in srgb, var(--accent) 18%, transparent); } .nbh-pill.hi b{ color:var(--accent); } .nbh-pill.mid{ background:rgba(255,194,51,0.16); } .nbh-pill.mid b{ color:#ffd166; } .nbh-pill.lo{ background:rgba(255,93,93,0.15); } .nbh-pill.lo b{ color:#ff7a7a; }
.nbh-none{ color:var(--text-muted); } .nbh-note{ margin:0 0 10px; padding:8px 12px; border-radius:10px; border:1px solid rgba(255,194,51,0.45); background:rgba(255,194,51,0.08); color:#ffe29a; font-size:0.82rem; }
.nbh-spark i.push{ background:#8fa0b2; } .nbh-table td{ white-space:nowrap; }

/* ---------- NBA Season Predictor ---------- */
.nbd-bar{ display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin:10px 0; } .nbd-bar .btn.on{ border-color:var(--accent); color:var(--accent); }
.nbd-total{ margin:0 0 12px; font-size:0.84rem; color:#ffd166; } .nbd-total.ok{ color:var(--accent); }
.nbd-grid{ display:grid; grid-template-columns:1fr 1fr; gap:16px; } .nbd-conf h3{ margin:0 0 8px; font-family:'Oswald',sans-serif; letter-spacing:0.04em; }
.nbd-rows{ display:grid; gap:4px; }
.nbd-div{ margin:8px 0 2px; font-size:0.66rem; letter-spacing:0.12em; font-weight:800; color:var(--text-muted); } .nbd-div.po{ color:var(--accent); } .nbd-div.pi{ color:#ffd166; }
.nbd-row{ display:grid; grid-template-columns:26px 14px auto minmax(0, 1fr) auto auto; gap:8px; align-items:center; padding:6px 8px; border-radius:10px; border:1px solid var(--border); background:var(--surface); cursor:grab; }
.nbd-row.po{ border-left:3px solid var(--accent); } .nbd-row.pi{ border-left:3px solid #ffc233; } .nbd-row.lo{ border-left:3px solid #55606c; opacity:0.92; }
.nbd-row.drag{ opacity:0.4; } .nbd-row.over{ outline:2px dashed var(--accent); }
.nbd-seed{ font-family:'Oswald',sans-serif; font-size:1.05rem; color:var(--text-muted); text-align:center; } .nbd-grip{ color:var(--text-muted); font-size:0.8rem; letter-spacing:-2px; }
.nbd-name{ min-width:0; } .nbd-name b{ display:block; font-size:0.9rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } .nbd-name small{ color:var(--text-muted); font-size:0.66rem; }
.nbd-wl{ display:flex; align-items:center; gap:4px; } .nbd-wl input{ width:52px; padding:5px 6px; text-align:center; font-weight:700; border:1px solid var(--border); border-radius:8px; background:var(--surface-2); color:var(--text); } .nbd-wl i{ font-style:normal; color:var(--text-muted); } .nbd-wl i::before{ content:'–'; margin-right:4px; } .nbd-wl small{ display:none; }
.nbd-wl input.nbd-l{ color:var(--text-muted); font-weight:600; } .nbd-wl input.nbd-l::before{ content:'–'; }
.nbd-ov{ color:var(--accent); font-weight:800; } .nbd-un{ color:#ff7a7a; font-weight:800; }
.nbd-auto{ display:inline-flex; align-items:center; gap:6px; font-size:0.82rem; color:var(--text-muted); cursor:pointer; } .nbd-auto input{ accent-color:var(--accent); width:18px; height:18px; }
.nbd-mv{ display:flex; gap:2px; } .nbd-mv button{ width:26px; height:26px; border-radius:7px; border:1px solid var(--border); background:var(--surface-2); color:var(--text-muted); cursor:pointer; padding:0; } .nbd-mv button:disabled{ opacity:0.3; cursor:default; } .nbd-mv button:hover:not(:disabled){ color:var(--text); }
.nbd-champs{ margin:18px 0 6px; } .nbd-champs h3{ margin:0 0 8px; font-family:'Oswald',sans-serif; } .nbd-cgrid{ display:grid; grid-template-columns:repeat(auto-fit, minmax(220px, 1fr)); gap:10px; } .nbd-cgrid label{ display:grid; gap:4px; font-size:0.78rem; color:var(--text-muted); } .nbd-cgrid select{ padding:8px; border-radius:8px; border:1px solid var(--border); background:var(--surface-2); color:var(--text); }
.nbd-stagewrap{ position:fixed; left:-10000px; top:0; width:720px; height:900px; pointer-events:none; }
@media (max-width:820px){ .nbd-grid{ grid-template-columns:1fr; } .nbd-row{ grid-template-columns:22px auto minmax(0, 1fr) auto auto; } .nbd-grip{ display:none; } }
/* the exported picture (720x900) */
.nbd-stage{ position:relative; width:720px; height:900px; box-sizing:border-box; padding:22px 26px 14px; display:flex; flex-direction:column; overflow:hidden; background:#0a0e14; color:#f2f6fb; font-family:Inter,sans-serif; }
.nbd-stage *{ box-sizing:border-box; } .nbd-sbg{ position:absolute; inset:0; background:radial-gradient(700px 320px at 10% -10%, color-mix(in srgb, var(--accent) 22%, transparent), transparent 70%), radial-gradient(600px 360px at 100% 110%, color-mix(in srgb, var(--accent) 12%, transparent), transparent 70%), repeating-linear-gradient(90deg, rgba(255,255,255,0.025) 0 1px, transparent 1px 60px); }
.nbd-stage > *:not(.nbd-sbg){ position:relative; }
.nbd-stop{ display:flex; align-items:center; gap:14px; margin-bottom:12px; } .nbd-stop img{ height:44px; width:auto; } .nbd-stop h2{ margin:0; font-family:'Oswald',sans-serif; font-size:27px; letter-spacing:0.05em; line-height:1; } .nbd-stop span{ display:block; margin-top:3px; font-size:10px; letter-spacing:0.18em; color:#9fb0c2; }
.nbd-champ{ margin-left:auto; text-align:center; background:var(--accent); color:#04130a; border-radius:10px; padding:5px 12px; } .nbd-champ small{ display:block; font-size:8px; letter-spacing:0.14em; font-weight:800; } .nbd-champ b{ font-family:'Oswald',sans-serif; font-size:15px; }
.nbd-scols{ flex:1; min-height:0; display:grid; grid-template-columns:1fr 1fr; gap:14px; } .nbd-sc h4{ margin:0 0 5px; font-family:'Oswald',sans-serif; font-size:16px; letter-spacing:0.16em; color:var(--accent); }
.nbd-sr{ display:grid; grid-template-columns:20px 26px 1fr auto; gap:7px; align-items:center; height:44px; padding:0 9px; margin-bottom:3px; border-radius:8px; background:rgba(255,255,255,0.05); border-left:3px solid #55606c; }
.nbd-sr.po{ border-left-color:var(--accent); } .nbd-sr.pi{ border-left-color:#ffc233; } .nbd-sr .n{ font-family:'Oswald',sans-serif; font-size:15px; color:#9fb0c2; text-align:center; } .nbd-sr img{ width:26px; height:26px; object-fit:contain; } .nbd-sr b{ font-size:13px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } .nbd-sr em{ font-style:normal; font-family:'Oswald',sans-serif; font-size:15px; }
.nbd-sc u, .nbd-sc s{ display:block; height:2px; margin:2px 0 4px; background:repeating-linear-gradient(90deg, #ffc233 0 6px, transparent 6px 10px); text-decoration:none; } .nbd-sc s{ background:repeating-linear-gradient(90deg, #55606c 0 6px, transparent 6px 10px); }
.nbd-sfoot{ text-align:center; margin-top:4px; font-family:'Oswald',sans-serif; font-size:26px; letter-spacing:0.12em; color:var(--accent); text-transform:uppercase; line-height:1; }

/* ---------- NBA season switch (2026-27 / 2025-26) ---------- */
.nba-seasonbar{ display:flex; flex-wrap:wrap; gap:10px 14px; align-items:center; margin:8px 0 12px; padding:8px 12px; border-radius:12px; border:1px solid var(--border); background:var(--surface-2); }
.nba-seasonbar .toggle-group button{ font-weight:800; } .nba-snote{ font-size:0.8rem; color:var(--text-muted); line-height:1.4; flex:1 1 280px; }
/* hit-rate dropdowns + profile tab */
.nbh-top{ margin-bottom:6px; } .nbh-lab{ display:grid; gap:3px; font-size:0.68rem; letter-spacing:0.05em; text-transform:uppercase; color:var(--text-muted); } .nbh-lab select{ text-transform:none; letter-spacing:0; }
.nhl-sel select.nbh-lab-sel, .nbh-lab select{ border:1px solid var(--border); background:var(--surface); color:var(--text); border-radius:10px; padding:7px 10px; font-size:0.82rem; }
select.nbh-line{ border:1px solid var(--border); background:var(--surface-2); color:var(--text); border-radius:8px; padding:4px 6px; font-size:0.84rem; font-weight:700; font-family:'Oswald',sans-serif; color:var(--accent); max-width:150px; }
.nph-tools{ display:flex; flex-wrap:wrap; gap:10px 16px; align-items:flex-end; margin:6px 0 10px; }
/* ---- NBA player profile: locked tabs for non-members ---- */
.pm-tab-btn.pm-tab-locked{ opacity:.72; } .pm-tab-btn.pm-tab-locked.active{ opacity:1; }
.nbp-lock{ text-align:center; padding:34px 18px 30px; margin:14px 6px; border:1px dashed var(--border); border-radius:14px; background:var(--surface-2); }
.nbp-lock-ic{ font-size:2.2rem; } .nbp-lock h3{ margin:8px 0 6px; } .nbp-lock p{ max-width:46ch; margin:0 auto 14px; color:var(--text-muted); font-size:.88rem; line-height:1.45; }
/* ---- bigger hit-rate bar graph: taller bars with each game's number on top, the line drawn across ---- */
.nhl-spark.nbh-spark{ height:78px; gap:5px; padding:15px 4px 0; min-width:150px; box-sizing:border-box; }
.nbh-spark i{ position:relative; width:15px; border-radius:3px 3px 0 0; }
.nbh-spark i em{ position:absolute; bottom:100%; left:50%; transform:translateX(-50%); margin-bottom:2px; font-style:normal; font-size:.64rem; font-weight:700; color:var(--text-muted); line-height:1; white-space:nowrap; }
.nbh-spark i.hit em{ color:var(--good); } .nbh-spark i.miss em{ color:var(--danger); }
.nbh-spark u{ border-top-width:2px; opacity:.9; }
.nbh-table td{ vertical-align:middle; }
@media (max-width:640px){ .nhl-spark.nbh-spark{ min-width:132px; height:70px; } .nbh-spark i{ width:12px; } }
/* ---- player profile Hit Rates: prop chips + one big labeled chart (NFL style) ---- */
.nph-chips{ display:flex; flex-wrap:wrap; gap:8px; margin:4px 0 12px; }
.nph-chip{ display:inline-flex; flex-direction:column; align-items:flex-start; gap:3px; min-width:92px; padding:9px 12px 8px; border-radius:12px; border:1px solid var(--border); background:var(--surface-2); color:var(--text); font-family:inherit; font-size:.8rem; font-weight:700; cursor:pointer; }
.nph-chip i{ font-style:normal; font-size:.74rem; padding:1px 8px; border-radius:7px; background:rgba(127,127,127,.18); color:var(--text-muted); } .nph-chip i.hi{ background:color-mix(in srgb, var(--accent) 20%, transparent); color:var(--good); } .nph-chip i.lo{ background:rgba(255,90,90,.2); color:var(--danger); } .nph-chip i.mid{ background:rgba(255,194,51,.2); color:#e0a800; }
.nph-chip.on{ background:var(--accent); border-color:var(--accent); color:#04130a; } .nph-chip.on i{ background:rgba(0,0,0,.2); color:#04130a; }
.nph-card{ border:1px solid var(--border); border-radius:16px; background:var(--surface-2); padding:16px 16px 14px; margin:6px 0 10px; }
.nph-head{ display:flex; justify-content:space-between; align-items:baseline; gap:10px; flex-wrap:wrap; margin-bottom:8px; } .nph-head b{ font-family:'Oswald',sans-serif; font-size:1.2rem; letter-spacing:.02em; } .nph-head span{ color:var(--text-muted); font-size:.86rem; font-weight:600; }
.nph-svg{ width:100%; height:auto; display:block; }
.nph-grid{ stroke:var(--border); stroke-width:1; opacity:.7; } .nph-tick{ fill:var(--text-muted); } .nph-opp{ fill:var(--text); font-weight:700; } .nph-dt{ fill:var(--text-muted); }
.nph-bar.hit{ fill:var(--good); } .nph-bar.miss{ fill:var(--danger); opacity:.9; } .nph-bar.push{ fill:#8fa0b2; }
.nph-val{ font-weight:800; fill:var(--text); } .nph-val.hit{ fill:var(--good); } .nph-val.miss{ fill:var(--danger); }
.nph-line{ stroke:#ffc233; stroke-width:2.5; stroke-dasharray:7 5; } .nph-linebg{ fill:#ffc233; } .nph-linelab{ fill:#201700; font-weight:800; }
.nph-legend{ margin-top:6px; }
.nph-sum{ display:grid; grid-template-columns:repeat(3, 1fr); gap:10px; margin-top:12px; }
.nph-hr{ display:flex; flex-direction:column; align-items:center; gap:5px; padding:10px 6px; border-radius:12px; background:rgba(127,127,127,.08); } .nph-hr small{ font-size:.68rem; letter-spacing:.07em; text-transform:uppercase; color:var(--text-muted); font-weight:700; } .nph-hr span{ font-size:.74rem; color:var(--text-muted); text-align:center; }
.nph-hr .nbh-pill{ font-size:1rem; padding:6px 14px; }
@media (max-width:640px){ .nph-sum{ grid-template-columns:1fr; } .nph-chip{ min-width:0; flex:1 1 30%; } .nph-card{ padding:12px 10px; } }

/* ---- Hit Rates page rows: bigger bars, opponent under each bar ---- */
.nhl-spark.nbh-spark{ height:92px; gap:30px; padding:16px 14px 22px; min-width:330px; }
.nbh-spark i{ width:30px; }
.nbh-spark i b{ position:absolute; top:100%; left:50%; transform:translateX(-50%); margin-top:5px; font-size:.74rem; font-weight:700; font-style:normal; color:var(--text-muted); letter-spacing:.04em; white-space:nowrap; }
.nbh-spark i em{ font-size:.82rem; }
@media (max-width:640px){ .nhl-spark.nbh-spark{ min-width:250px; height:84px; gap:20px; padding:16px 10px 22px; } .nbh-spark i{ width:24px; } }

/* in-depth tracking: rating breakdown bars, opportunity profile, card chips */
.nbp-dgrid3{ grid-template-columns:repeat(auto-fit, minmax(230px, 1fr)); }
.nbp-bd{ display:flex; flex-direction:column; gap:5px; } .nbp-bd-r{ display:grid; grid-template-columns:92px 1fr 40px; align-items:center; gap:8px; font-size:.76rem; }
.nbp-bd-bar{ position:relative; height:8px; border-radius:99px; background:var(--surface-2); } .nbp-bd-bar::after{ content:''; position:absolute; left:50%; top:-2px; bottom:-2px; width:1px; background:var(--border); }
.nbp-bd-bar i{ position:absolute; top:0; bottom:0; border-radius:99px; } .nbp-bd-bar i.pos{ background:var(--accent); } .nbp-bd-bar i.neg{ background:#ff6b6b; }
.nbp-bd-r b{ text-align:right; font-variant-numeric:tabular-nums; } .nbp-bd-t{ margin-top:4px; font-size:.7rem; color:var(--text-muted); }
.nbp-opp td small{ display:inline; margin-left:4px; } .nbp-opp tr.lead td:first-child{ font-weight:700; } .nbp-opp tr.lead{ background:color-mix(in srgb, var(--accent) 7%, transparent); }
.nbp-up{ color:var(--accent); font-style:normal; font-size:.7rem; margin-left:4px; } .nbp-dn{ color:#ff6b6b; font-style:normal; font-size:.7rem; margin-left:4px; }
.nbp-trk-line{ margin:8px 0 0; font-size:.76rem; line-height:1.5; } .nbp-trk-line small{ color:var(--text-muted); }
.nbr-trk{ display:flex; flex-wrap:wrap; gap:6px; margin:8px 0 4px; } .nbr-trk span{ font-size:.7rem; padding:3px 8px; border-radius:8px; background:var(--surface-2); border:1px solid var(--border); color:var(--text-muted); } .nbr-trk b{ color:var(--text); }
.nbr-chips{ display:flex; flex-wrap:wrap; gap:5px; margin:2px 0 6px; } .nbr-chips span{ font-size:.66rem; font-weight:700; padding:2px 8px; border-radius:99px; border:1px solid var(--border); cursor:help; }
.nbr-chips span.pos{ color:var(--accent); border-color:color-mix(in srgb, var(--accent) 55%, var(--border)); } .nbr-chips span.neg{ color:#ff8a8a; border-color:rgba(255,107,107,.45); }
.nbp-dgrid3{ grid-template-columns:repeat(2, minmax(0, 1fr)); } .nbp-alt-scroll{ max-height:340px; overflow:auto; border:1px solid var(--border); border-radius:10px; } .nbp-alt-scroll .nbp-mini{ margin:0; }
@media (max-width:760px){ .nbp-dgrid3{ grid-template-columns:minmax(0, 1fr); } }
.nbp-moved{ display:inline-block; margin-left:6px; padding:1px 7px; border-radius:99px; font-size:.62rem; font-weight:800; letter-spacing:.03em; color:#ffd23a; border:1px solid rgba(255,210,58,.5); vertical-align:middle; cursor:help; }
/* Group by game: a header row opens each game's props */
.nbp-table tr.nbp-gamehead td{ padding:14px 12px 8px; background:var(--surface-2); border-top:2px solid color-mix(in srgb, var(--accent) 45%, var(--border)); border-bottom:1px solid var(--border); }
.nbp-table tr.nbp-gamehead td > b{ display:inline-flex; align-items:center; gap:6px; font-family:'Oswald',sans-serif; font-size:1.02rem; letter-spacing:.03em; text-transform:uppercase; }
.nbp-table tr.nbp-gamehead td > span{ margin-left:12px; color:var(--text-muted); font-size:.82rem; font-weight:600; } .nbp-table tr.nbp-gamehead td > i{ margin-left:10px; font-style:normal; font-size:.7rem; color:var(--text-muted); padding:1px 8px; border-radius:99px; border:1px solid var(--border); }
@media (max-width:700px){ .nbp-table tr.nbp-gamehead td{ display:block; padding:12px 6px 6px; } }
/* ---------- NBA First Basket Simulator ---------- */
.nfb-games button i, .nhl-dates button i{ font-style:normal; }
.nfb-card{ border:1px solid var(--border); border-radius:16px; background:var(--surface-2); padding:16px 18px 6px; margin:12px 0; }
.nfb-match{ display:flex; align-items:center; justify-content:center; gap:22px; flex-wrap:wrap; }
.nfb-tm{ display:flex; align-items:center; gap:10px; font-family:'Oswald',sans-serif; font-size:1.15rem; text-transform:uppercase; letter-spacing:.02em; }
.nfb-vs{ display:flex; flex-direction:column; align-items:center; color:var(--text-muted); } .nfb-vs span{ font-family:'Oswald',sans-serif; font-size:1.3rem; } .nfb-vs small{ font-size:.74rem; }
.nfb-tip{ display:flex; height:30px; border-radius:999px; overflow:hidden; margin:14px 0 8px; font-weight:800; font-size:.8rem; color:#fff; text-shadow:0 1px 2px rgba(0,0,0,.5); }
.nfb-tip span{ display:flex; align-items:center; padding:0 14px; white-space:nowrap; min-width:0; transition:width .4s; } .nfb-tip span:last-child{ justify-content:flex-end; }
.nfb-tipnote{ margin:0 0 10px !important; }
.nfb-ctl{ display:flex; flex-wrap:wrap; align-items:flex-end; gap:12px; margin:6px 0 12px; }
.nfb-ctl label{ display:flex; flex-direction:column; gap:4px; font-size:.7rem; letter-spacing:.06em; text-transform:uppercase; color:var(--text-muted); font-weight:700; }
.nfb-prog{ margin-left:auto; color:var(--text-muted); font-size:.84rem; font-variant-numeric:tabular-nums; align-self:center; }
.nfb-h{ margin:24px 0 8px; font-size:1.05rem; }

/* the ranked list: bars drawn from a shared scale (the leader fills the track), one line per player */
.nfb-list{ display:flex; flex-direction:column; gap:8px; }
.nfb-row{ border:1px solid var(--border); border-radius:14px; background:var(--surface-2); overflow:hidden; transition:border-color .15s; }
.nfb-row.open{ border-color:color-mix(in srgb, var(--accent) 55%, var(--border)); }
.nfb-main{ display:grid; grid-template-columns:34px 44px minmax(120px, 210px) 1fr 92px; align-items:center; gap:12px; padding:10px 14px; cursor:pointer; }
.nfb-rank{ font-family:'Oswald',sans-serif; font-size:1.5rem; font-weight:700; color:var(--text-muted); text-align:center; } .nfb-row[data-nfb-rank="1"] .nfb-rank, .nfb-row[data-nfb-rank="2"] .nfb-rank, .nfb-row[data-nfb-rank="3"] .nfb-rank{ color:var(--accent); }
.nfb-who{ display:flex; flex-direction:column; min-width:0; } .nfb-who b{ font-size:.98rem; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .nfb-who small{ color:var(--text-muted); font-size:.74rem; display:flex; align-items:center; gap:5px; }
.nfb-barwrap{ height:22px; border-radius:11px; background:rgba(127,127,127,.14); overflow:hidden; }
.nfb-bar{ display:block; height:100%; border-radius:11px; min-width:4px; transition:width .25s ease-out; }
.nfb-p{ text-align:right; } .nfb-p b{ display:block; font-family:'Oswald',sans-serif; font-size:1.25rem; font-variant-numeric:tabular-nums; } .nfb-p small{ color:var(--text-muted); font-size:.78rem; font-variant-numeric:tabular-nums; }
.nfb-more{ padding:4px 16px 16px; border-top:1px solid var(--border); }
.nfb-sum{ margin:12px 0 10px; font-weight:600; font-size:.92rem; line-height:1.45; }
.nfb-tiles{ display:grid; grid-template-columns:repeat(6, 1fr); gap:8px; margin-bottom:12px; }
.nfb-tiles > div{ background:var(--surface); border:1px solid var(--border); border-radius:12px; padding:8px 6px; text-align:center; } .nfb-tiles small{ display:block; font-size:.64rem; letter-spacing:.06em; text-transform:uppercase; color:var(--text-muted); font-weight:700; } .nfb-tiles b{ display:block; font-family:'Oswald',sans-serif; font-size:1.15rem; margin-top:2px; } .nfb-tiles i{ display:block; font-style:normal; font-size:.66rem; color:var(--text-muted); }
.nfb-why{ list-style:none; margin:0 0 12px; padding:0; display:grid; gap:6px; }
.nfb-why li{ display:grid; grid-template-columns:96px 1fr; gap:10px; padding:8px 10px; border-radius:10px; background:var(--surface); border-left:4px solid var(--border); font-size:.84rem; line-height:1.45; }
.nfb-why li b{ font-size:.72rem; letter-spacing:.06em; text-transform:uppercase; color:var(--text-muted); } .nfb-why li.good{ border-left-color:var(--good); } .nfb-why li.bad{ border-left-color:var(--danger); }
.nfb-bookrow{ display:flex; flex-wrap:wrap; align-items:center; gap:12px; } .nfb-bookrow label{ display:flex; flex-direction:column; gap:3px; font-size:.7rem; letter-spacing:.06em; text-transform:uppercase; color:var(--text-muted); font-weight:700; }
.nfb-book{ width:130px; padding:8px 10px; border-radius:10px; border:1px solid var(--border); background:var(--surface); color:var(--text); font-size:.95rem; }
.nfb-ev{ display:inline-block; padding:4px 10px; border-radius:999px; font-weight:800; font-size:.8rem; background:rgba(127,127,127,.18); } .nfb-ev.pos{ background:color-mix(in srgb, var(--accent) 22%, transparent); color:var(--good); } .nfb-ev.neg{ background:rgba(255,90,90,.18); color:var(--danger); }
.nfb-stats{ display:grid; grid-template-columns:repeat(5, 1fr); gap:10px; }
.nfb-stats > div{ border:1px solid var(--border); border-radius:12px; background:var(--surface-2); padding:10px 12px; } .nfb-stats small{ display:block; font-size:.66rem; letter-spacing:.06em; text-transform:uppercase; color:var(--text-muted); font-weight:700; } .nfb-stats b{ font-family:'Oswald',sans-serif; font-size:1.4rem; } .nfb-stats i{ display:block; font-style:normal; font-size:.7rem; color:var(--text-muted); }
.nfb-replay{ border:1px solid var(--border); border-radius:14px; background:var(--surface-2); padding:12px 16px; }
.nfb-replay ol{ list-style:none; margin:0; padding:0; display:grid; gap:6px; }
.nfb-replay li{ display:flex; align-items:flex-start; gap:10px; font-size:.9rem; line-height:1.4; animation:nfbIn .3s ease; }
@keyframes nfbIn{ from{ opacity:0; transform:translateY(6px); } to{ opacity:1; transform:none; } }
.nfb-dot{ flex:none; width:9px; height:9px; margin-top:6px; border-radius:50%; background:var(--text-muted); } .nfb-replay li.make .nfb-dot{ background:var(--good); box-shadow:0 0 0 4px color-mix(in srgb, var(--accent) 25%, transparent); } .nfb-replay li.miss .nfb-dot{ background:var(--danger); } .nfb-replay li.tip .nfb-dot{ background:#ffc233; } .nfb-replay li.make{ font-weight:800; }
.nfb-winner{ margin-top:10px; padding:10px 14px; border-radius:12px; background:color-mix(in srgb, var(--accent) 14%, transparent); border:1px solid var(--accent); font-size:1rem; }
.nfb-edit{ margin:18px 0 6px; border:1px solid var(--border); border-radius:12px; background:var(--surface-2); padding:10px 14px; } .nfb-edit summary{ cursor:pointer; font-size:.84rem; color:var(--text-muted); font-weight:600; }
.nfb-lus{ display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-top:10px; } .nfb-lu h4{ margin:0 0 6px; font-size:.9rem; display:flex; align-items:center; gap:6px; } .nfb-lu select{ display:block; width:100%; margin-bottom:6px; padding:7px 9px; border-radius:9px; border:1px solid var(--border); background:var(--surface); color:var(--text); }

@media (max-width:760px){
  .nfb-main{ grid-template-columns:26px 36px 1fr 74px; gap:8px; padding:10px; } .nfb-barwrap{ grid-column:1 / -1; grid-row:2; height:16px; }
  .nfb-rank{ font-size:1.2rem; } .nfb-p b{ font-size:1.1rem; }
  .nfb-tiles{ grid-template-columns:repeat(3, 1fr); } .nfb-why li{ grid-template-columns:1fr; gap:2px; }
  .nfb-stats{ grid-template-columns:repeat(2, 1fr); } .nfb-lus{ grid-template-columns:1fr; }
  .nfb-tm{ font-size:.95rem; } .nfb-match{ gap:12px; }
}
/* lineup status pills (confirmed / expected / projected) */
.nfb-lps{ display:flex; flex-wrap:wrap; gap:8px; justify-content:center; margin:2px 0 8px; }
.nfb-lpill{ display:inline-block; padding:4px 12px; border-radius:999px; font-size:.74rem; font-weight:800; letter-spacing:.02em; background:rgba(127,127,127,.2); color:var(--text-muted); }
.nfb-lpill.ok{ background:color-mix(in srgb, var(--accent) 20%, transparent); color:var(--good); } .nfb-lpill.exp{ background:rgba(255,194,51,.2); color:#e0a800; }
/* ---------- "Watch the sim" show window ---------- */
.nfs-wrap{ position:fixed; inset:0; z-index:9500; display:none; align-items:center; justify-content:center; padding:12px; background:rgba(0,0,0,.86); backdrop-filter:blur(4px); }
.nfs-wrap.show{ display:flex; }
.nfs-card{ position:relative; width:100%; max-width:1180px; max-height:100%; overflow:auto; border-radius:18px; background:#080b11; border:1px solid color-mix(in srgb, var(--accent) 55%, #222); box-shadow:0 24px 80px rgba(0,0,0,.7); color:#ecf0f4; }
.nfs-x{ position:absolute; top:10px; right:12px; z-index:3; width:34px; height:34px; border-radius:50%; border:0; background:rgba(0,0,0,.6); color:#fff; font-size:1rem; cursor:pointer; }
.nfs-stage{ position:relative; width:100%; background:#000; border-radius:18px 18px 0 0; overflow:hidden; }
.nfs-stage canvas{ display:block; width:100%; height:auto; aspect-ratio:16 / 9; }
.nfs-load{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center; background:rgba(0,0,0,.85); font-family:'Oswald',sans-serif; font-size:1.2rem; letter-spacing:.04em; }
.nfs-bar{ padding:12px 16px 14px; }
.nfs-bar input[type=range]{ width:100%; accent-color:var(--accent); margin:0 0 10px; }
.nfs-btns{ display:flex; flex-wrap:wrap; gap:8px; } .nfs-btns .btn{ min-height:38px; padding:7px 14px; font-size:.82rem; }
.nfs-note{ margin:10px 0 0 !important; color:#97a3b2 !important; font-size:.8rem; }
body.nfs-open{ overflow:hidden; }
@media (max-width:640px){ .nfs-wrap{ padding:0; align-items:flex-end; } .nfs-card{ border-radius:18px 18px 0 0; } .nfs-btns .btn{ flex:1 1 44%; } }

.nfs-speed{ display:inline-flex; align-items:center; gap:6px; font-size:.82rem; font-weight:600; color:#c9d3df; margin-right:4px; } .nfs-speed select{ min-height:38px; padding:6px 10px; border-radius:10px; border:1px solid rgba(255,255,255,.18); background:rgba(255,255,255,.07); color:#fff; font:inherit; font-weight:700; cursor:pointer; }

/* ---- First Basket: the chance column (big number + small %, fair price underneath) and a thicker, cleaner bar ---- */
.nfb-main{ grid-template-columns:34px 44px minmax(120px, 210px) 1fr 112px; }
.nfb-barwrap{ height:14px; border-radius:7px; background:rgba(127,127,127,.16); } .nfb-bar{ border-radius:7px; }
.nfb-p{ display:flex; flex-direction:column; align-items:flex-end; gap:3px; }
.nfb-p b{ display:inline-flex; align-items:baseline; justify-content:flex-end; min-width:84px; padding:3px 12px 3px 14px; border-radius:12px; background:rgba(127,127,127,.14); font-family:'Oswald',sans-serif; font-size:1.45rem; font-weight:700; line-height:1.15; letter-spacing:.01em; }
.nfb-p b u{ text-decoration:none; font-size:.8rem; font-weight:600; margin-left:1px; opacity:.7; }
.nfb-p small{ font-size:.7rem; letter-spacing:.05em; text-transform:uppercase; color:var(--text-muted); } .nfb-p small em{ font-style:normal; font-weight:800; color:var(--text); letter-spacing:.02em; font-size:.8rem; }
.nfb-row[data-nfb-rank="1"] .nfb-p b, .nfb-row[data-nfb-rank="2"] .nfb-p b, .nfb-row[data-nfb-rank="3"] .nfb-p b{ background:color-mix(in srgb, var(--accent) 20%, transparent); color:var(--accent); }
@media (max-width:760px){ .nfb-main{ grid-template-columns:26px 36px 1fr auto; } .nfb-p b{ min-width:0; font-size:1.25rem; padding:2px 10px; } }

/* ---- First Basket list v2: team-colored cards, a gradient meter with the chance inside it, the fair price as a chip ---- */
.nfb-row{ border:1px solid color-mix(in srgb, var(--tc, #4f9dff) 38%, var(--border)); border-left:5px solid var(--tc, #4f9dff); background:linear-gradient(100deg, color-mix(in srgb, var(--tc, #4f9dff) 12%, var(--surface-2)), var(--surface-2) 55%); }
.nfb-row.open{ border-color:color-mix(in srgb, var(--tc, #4f9dff) 70%, var(--border)); border-left-width:5px; }
.nfb-main{ grid-template-columns:34px 58px minmax(120px, 210px) 1fr 104px; gap:14px; }
.nfb-ph{ display:inline-flex; width:54px; height:54px; border-radius:50%; padding:2px; border:3px solid var(--tc, #4f9dff); background:var(--surface); box-shadow:0 0 0 0 transparent; overflow:hidden; }
.nfb-ph img, .nfb-ph .nba-hs{ width:100% !important; height:100% !important; border-radius:50%; object-fit:cover; }
.nfb-row[data-nfb-rank="1"] .nfb-ph, .nfb-row[data-nfb-rank="2"] .nfb-ph, .nfb-row[data-nfb-rank="3"] .nfb-ph{ box-shadow:0 0 14px color-mix(in srgb, var(--tc, #4f9dff) 65%, transparent); }
.nfb-meter{ height:34px; border-radius:17px; background:rgba(127,127,127,.16); overflow:hidden; }
.nfb-meter .nfb-bar{ height:100%; min-width:92px; border-radius:17px; display:flex; align-items:center; justify-content:flex-end; padding:0 14px 0 10px; background:linear-gradient(90deg, color-mix(in srgb, var(--tc, #4f9dff) 55%, #000), var(--tc, #4f9dff)); box-shadow:inset 0 1px 0 rgba(255,255,255,.22); transition:width .25s ease-out; }
.nfb-pin{ display:inline-flex; align-items:baseline; font-family:'Oswald',sans-serif; font-size:1.3rem; font-weight:700; color:#fff; text-shadow:0 1px 3px rgba(0,0,0,.65); font-variant-numeric:tabular-nums; } .nfb-pin u{ text-decoration:none; font-size:.8rem; margin-left:1px; opacity:.85; }
.nfb-p{ display:flex; flex-direction:column; align-items:flex-end; gap:3px; } .nfb-p small{ font-size:.6rem; letter-spacing:.1em; font-weight:800; color:var(--text-muted); }
.nfb-p em{ font-style:normal; font-family:'Oswald',sans-serif; font-size:1.05rem; font-weight:600; padding:3px 12px; border-radius:999px; border:1px solid color-mix(in srgb, var(--tc, #4f9dff) 70%, transparent); background:color-mix(in srgb, var(--tc, #4f9dff) 14%, transparent); font-variant-numeric:tabular-nums; }
@media (max-width:760px){ .nfb-main{ grid-template-columns:26px 46px 1fr auto; gap:10px; } .nfb-ph{ width:44px; height:44px; } .nfb-meter{ grid-column:1 / -1; grid-row:2; height:30px; } .nfb-pin{ font-size:1.15rem; } }

/* ---- First Basket: compare with a sportsbook ---- */
.nfb-odds summary{ cursor:pointer; font-weight:700; } .nfb-odds summary i{ font-style:normal; color:var(--accent); font-weight:600; }
.nfb-odds-row{ display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin-bottom:8px; }
.nfb-odds textarea{ width:100%; padding:10px 12px; border-radius:12px; border:1px solid var(--border); background:var(--surface); color:var(--text); font:inherit; font-size:.95rem; resize:vertical; }
.nfb-best{ border:1px solid var(--accent); border-radius:16px; padding:14px 16px; margin:0 0 12px; background:linear-gradient(120deg, color-mix(in srgb, var(--accent) 16%, var(--surface-2)), var(--surface-2) 70%); box-shadow:0 12px 36px -20px var(--accent); }
.nfb-best.none{ border-color:var(--border); background:var(--surface-2); box-shadow:none; display:flex; flex-direction:column; gap:3px; } .nfb-best.none span{ color:var(--text-muted); font-size:.86rem; }
.nfb-best-tag{ display:inline-block; padding:3px 10px; border-radius:999px; background:var(--accent); color:#000; font-size:.7rem; font-weight:800; letter-spacing:.08em; } .nfb-best > b{ display:block; font-family:'Oswald',sans-serif; font-size:1.6rem; margin:6px 0 8px; }
.nfb-best-n{ display:flex; flex-wrap:wrap; gap:8px; } .nfb-best-n > div{ min-width:84px; padding:8px 12px; border-radius:12px; background:var(--surface); border:1px solid var(--border); text-align:center; } .nfb-best-n small{ display:block; font-size:.62rem; letter-spacing:.07em; text-transform:uppercase; color:var(--text-muted); font-weight:700; } .nfb-best-n b{ font-family:'Oswald',sans-serif; font-size:1.25rem; } .nfb-best-n .up{ border-color:var(--accent); background:color-mix(in srgb, var(--accent) 16%, var(--surface)); } .nfb-best-n .up b{ color:var(--accent); }
.nfb-best p{ margin:8px 0 0; font-size:.85rem; color:var(--text-muted); }
.nfb-cmp{ display:inline-block; margin-top:3px; padding:2px 9px; border-radius:999px; font-size:.7rem; font-weight:700; white-space:nowrap; background:rgba(127,127,127,.16); color:var(--text-muted); } .nfb-cmp b{ color:var(--text); } .nfb-cmp.pos{ background:color-mix(in srgb, var(--accent) 22%, transparent); color:var(--accent); } .nfb-cmp.pos b{ color:var(--accent); } .nfb-cmp u{ text-decoration:none; font-weight:900; }
.nfb-row.evpos{ box-shadow:0 0 0 2px color-mix(in srgb, var(--accent) 70%, transparent), 0 10px 30px -16px var(--accent); }
.nfb-main{ grid-template-columns:34px 58px minmax(120px, 210px) 1fr 150px; }
@media (max-width:760px){ .nfb-main{ grid-template-columns:26px 46px 1fr auto; } }
/* ---- Spread Score page ---- */
.ss-controls{ display:flex; flex-direction:column; gap:10px; margin:14px 0 14px; }
.ss-row{ display:flex; flex-wrap:wrap; align-items:center; gap:8px; }
.ss-sp{ flex:1 1 20px; }
.ss-q{ min-width:190px; padding:9px 14px; border-radius:999px; border:1px solid var(--border, rgba(255,255,255,.18)); background:rgba(255,255,255,.05); color:inherit; font:inherit; }
.ss-table td, .ss-table th{ white-space:nowrap; } .ss-table td.l{ white-space:normal; }
.ss-sub{ display:block; color:var(--text-muted, #97a3b2); font-size:.74rem; margin-top:1px; }
.ss-rk{ color:var(--text-muted, #97a3b2); font-weight:700; }
.ss-score{ font-size:1.12rem; color:var(--accent); }
.ss-range{ color:var(--text-muted, #97a3b2); }
.ss-whys{ min-width:220px; }
.ss-why{ display:inline-block; margin:2px 6px 2px 0; padding:2px 9px; border-radius:999px; font-size:.74rem; font-weight:700; border:1px solid currentColor; }
.ss-why.pos{ color:#22d65a; } .ss-why.neg{ color:#ff6b6b; }
.ss-why-none{ color:var(--text-muted, #97a3b2); font-size:.78rem; }
.ss-rec td small{ color:var(--text-muted, #97a3b2); font-weight:500; } .ss-best{ color:var(--accent); font-weight:800; }
.ss-fgrid{ display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:12px; margin-top:10px; }
.ss-f{ border:1px solid var(--border, rgba(255,255,255,.12)); border-radius:12px; padding:12px 14px; background:rgba(255,255,255,.03); }
.ss-f h4{ margin:0 0 8px; font-size:1rem; } .ss-f h4 small{ font-weight:500; color:var(--text-muted, #97a3b2); font-size:.74rem; margin-left:6px; }
.ss-f ul{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:5px; }
.ss-f li{ display:flex; justify-content:space-between; gap:8px; font-size:.8rem; } .ss-f li b.pos{ color:#22d65a; } .ss-f li b.neg{ color:#ff6b6b; }
@media (max-width:1000px){ .ss-fgrid{ grid-template-columns:repeat(2, minmax(0,1fr)); } }
@media (max-width:560px){ .ss-fgrid{ grid-template-columns:1fr; } .ss-q{ flex:1 1 100%; } }
/* ---- Game dropdown (snippet-gamedd.js) ---- */
.gdd{ position:relative; margin:10px 0 12px; max-width:640px; z-index:5; }
.gdd-btn{ width:100%; display:flex; align-items:center; gap:12px; text-align:left; padding:12px 16px; min-height:54px; border-radius:14px; border:1px solid var(--border, rgba(255,255,255,.16)); background:var(--surface, #12161d); color:var(--text, #fff); font:inherit; cursor:pointer; }
.gdd-btn:hover, .gdd.open .gdd-btn{ border-color:var(--accent, var(--accent)); }
.gdd-cur{ flex:1 1 auto; min-width:0; display:flex; align-items:center; flex-wrap:wrap; gap:6px 10px; }
.gdd-t{ display:inline-flex; align-items:center; gap:8px; min-width:0; } .gdd-t b{ font-family:'Oswald',sans-serif; font-weight:600; font-size:1rem; letter-spacing:.01em; }
.gdd em{ font-style:normal; color:var(--text-muted, #97a3b2); font-weight:700; }
.gdd-logo{ width:26px; height:26px; object-fit:contain; flex-shrink:0; }
.gdd img[src$="nhl/ANA.png"], .gdd img[src*="/img/nhl/"]{ filter:drop-shadow(0 0 1px rgba(255,255,255,.55)); }
.gdd-all{ font-family:'Oswald',sans-serif; font-weight:600; font-size:1rem; }
.gdd-meta{ flex:0 0 auto; color:var(--text-muted, #97a3b2); font-size:.8rem; white-space:nowrap; }
.gdd-car{ color:var(--text-muted, #97a3b2); transition:transform .15s; } .gdd.open .gdd-car{ transform:rotate(180deg); }
.gdd-list{ display:none; position:absolute; left:0; right:0; top:calc(100% + 6px); max-height:min(62vh, 520px); overflow:auto; border-radius:14px; border:1px solid var(--accent, var(--accent)); background:var(--surface, #12161d); box-shadow:0 18px 50px -10px rgba(0,0,0,.7); padding:6px; }
.gdd.open .gdd-list{ display:block; }
.gdd-row{ width:100%; display:flex; align-items:center; gap:12px; text-align:left; padding:10px 12px; min-height:52px; border:0; border-radius:10px; background:none; color:var(--text, #fff); font:inherit; cursor:pointer; }
.gdd-row:hover, .gdd-row:focus-visible{ background:rgba(255,255,255,.07); } .gdd-row.on{ background:color-mix(in srgb, var(--accent, var(--accent)) 16%, transparent); }
.gdd-row.lock{ opacity:.8; }
.gdd-main{ flex:1 1 auto; min-width:0; display:flex; align-items:center; flex-wrap:wrap; gap:4px 10px; }
.gdd-abbr{ display:none; }
@media (max-width:640px){
  .gdd{ max-width:none; }
  /* phones: short team codes (CLE @ PHI), one tidy line per game; the start time sits under it, the caret stays at the right */
  .gdd-full{ display:none; } .gdd-abbr{ display:inline; }
  .gdd-t{ gap:6px; flex:0 0 auto; } .gdd-t b{ font-size:1.12rem; letter-spacing:.03em; } .gdd-logo{ width:30px; height:30px; }
  .gdd-btn{ display:grid; grid-template-columns:1fr auto; align-items:center; gap:2px 10px; padding:10px 14px; min-height:60px; }
  .gdd-cur{ grid-column:1; flex-wrap:nowrap; gap:8px; } .gdd-car{ grid-column:2; grid-row:1; font-size:1.1rem; }
  .gdd-btn .gdd-meta{ grid-column:1 / -1; grid-row:2; white-space:normal; font-size:.78rem; }
  .gdd-row{ min-height:58px; padding:8px 10px; } .gdd-row .gdd-main{ flex-wrap:nowrap; gap:8px; } .gdd-row .gdd-meta{ font-size:.74rem; text-align:right; max-width:42%; white-space:normal; }
  .gdd-list{ position:fixed; left:8px; right:8px; top:auto; bottom:calc(var(--ab-h, 58px) + var(--ab-safe, 0px) + 40px); max-height:64vh; z-index:70; }
  .gdd.open::before{ content:''; position:fixed; inset:0; background:rgba(0,0,0,.5); z-index:69; }
}
/* ---- Star games (snippet-stars.js) ---- */
.star-badge{ display:inline-flex; align-items:center; padding:2px 8px; border-radius:999px; font:800 .72rem 'Oswald',sans-serif; letter-spacing:.08em; color:#1a1300; background:linear-gradient(135deg,#ffd84d,#ffb300); box-shadow:0 0 0 1px rgba(255,200,0,.5), 0 4px 14px -4px rgba(255,190,0,.55); white-space:nowrap; }
.star-badge.s3{ background:linear-gradient(135deg,#fff1a8,#ffc400 60%,#ff9d00); }
.star-strip{ display:flex; flex-wrap:wrap; gap:8px; margin:0 0 12px; max-width:900px; }
.star-head{ flex:1 1 100%; display:flex; flex-wrap:wrap; align-items:baseline; gap:4px 10px; } .star-head b{ font-family:'Oswald',sans-serif; letter-spacing:.04em; color:#ffc400; } .star-head span{ color:var(--text-muted); font-size:.78rem; }
.star-chip{ flex:1 1 240px; display:grid; grid-template-columns:auto 1fr; gap:0 10px; align-items:center; text-align:left; padding:10px 12px; border-radius:12px; border:1px solid rgba(255,196,0,.45); background:linear-gradient(135deg, rgba(255,196,0,.1), transparent 70%), var(--surface-2); color:var(--text); font:inherit; cursor:pointer; }
.star-chip:hover{ border-color:#ffc400; }
.star-n{ grid-row:1 / span 2; font:800 .95rem 'Oswald',sans-serif; letter-spacing:.08em; color:#ffc400; } .star-chip b{ font-family:'Oswald',sans-serif; font-size:1rem; } .star-chip small{ grid-column:2; color:var(--text-muted); font-size:.74rem; line-height:1.3; }
.nbh-star{ margin:8px auto 0; max-width:34ch; text-align:center; } .nbh-star b{ display:block; color:#ffc400; font:800 .86rem 'Oswald',sans-serif; letter-spacing:.06em; text-transform:uppercase; } .nbh-star span{ display:block; font-size:.74rem; line-height:1.3; opacity:.85; }

.star-share{ margin-left:auto; font:700 .72rem 'Oswald',sans-serif; letter-spacing:.06em; text-transform:uppercase; padding:4px 12px; border-radius:999px; border:1px solid #ffc400; color:#ffc400 !important; text-decoration:none; }
.star-share:hover{ background:#ffc400; color:#000 !important; }
/* ---- NBA Prop Lab (snippet-nba-lab.js) ---- */
.nlab-filters{ display:flex; flex-wrap:wrap; align-items:flex-end; gap:10px; margin:8px 0; }
.nlab-chk{ flex-direction:row !important; align-items:center; gap:6px !important; padding-bottom:10px; }
.nlab-wrap{ max-height:none; }
.nlab-table th{ cursor:pointer; user-select:none; white-space:nowrap; } .nlab-table th.on{ color:var(--accent); }
.nlab-table td{ white-space:nowrap; } .nlab-table tr[data-nlab-open]{ cursor:pointer; } .nlab-table tr[data-nlab-open]:hover{ background:rgba(255,255,255,.05); }
.nlab-pl b{ display:block; } .nlab-pl small, .nlab-table td small{ display:block; color:var(--text-muted); font-size:.72rem; font-weight:500; }
.nlab-pill{ display:inline-flex; align-items:baseline; gap:5px; padding:2px 9px; border-radius:999px; background:rgba(127,127,127,.16); font-size:.8rem; white-space:nowrap; } .nlab-pill b{ font-weight:700; } .nlab-pill i{ font-style:normal; color:var(--text-muted); font-size:.74rem; }
.nlab-pill.hi{ background:color-mix(in srgb, var(--good) 26%, transparent); } .nlab-pill.mid{ background:color-mix(in srgb, var(--good) 13%, transparent); } .nlab-pill.lo{ background:color-mix(in srgb, var(--danger) 20%, transparent); }
.nlab-none{ color:var(--text-muted); }
.nlab-dv{ display:inline-flex; align-items:baseline; gap:4px; padding:2px 9px; border-radius:999px; background:rgba(127,127,127,.14); font-weight:700; font-size:.8rem; } .nlab-dv i{ font-style:normal; font-weight:500; font-size:.68rem; color:var(--text-muted); }
.nlab-dv.soft{ background:color-mix(in srgb, var(--good) 26%, transparent); color:var(--good); } .nlab-dv.tough{ background:color-mix(in srgb, var(--danger) 22%, transparent); color:var(--danger); }
.nlab-go{ min-height:32px !important; padding:4px 12px !important; font-size:.78rem !important; }
/* deep dive window */
.nlab-modal{ display:none; position:fixed; inset:0; z-index:200; background:rgba(0,0,0,.72); overflow-y:auto; padding:20px 12px 40px; }
.nlab-modal.show{ display:block; } body.nlab-open{ overflow:hidden; }
.nlab-card-w{ position:relative; max-width:1000px; margin:0 auto; background:var(--surface, #12161d); border:1px solid var(--border, rgba(255,255,255,.14)); border-radius:18px; padding:20px 22px 26px; }
.nlab-x{ position:absolute; top:12px; right:14px; width:40px; height:40px; border-radius:50%; border:1px solid var(--border); background:var(--surface-2); color:inherit; font-size:1.1rem; cursor:pointer; z-index:2; }
.nlab-head{ display:flex; flex-wrap:wrap; align-items:center; gap:14px 28px; padding-right:48px; margin-bottom:14px; }
.nlab-who{ display:flex; align-items:center; gap:12px; } .nlab-who h2{ margin:0; font-size:1.5rem; } .nlab-who small{ color:var(--text-muted); }
.nlab-top{ display:flex; flex-wrap:wrap; gap:10px; margin-left:auto; } .nlab-top > div{ min-width:84px; padding:8px 12px; border-radius:12px; background:var(--surface-2); border:1px solid var(--border); text-align:center; }
.nlab-top small, .nlab-sum small{ display:block; font-size:.62rem; letter-spacing:.07em; text-transform:uppercase; color:var(--text-muted); font-weight:700; } .nlab-top b, .nlab-sum b{ font-family:'Oswald',sans-serif; font-size:1.15rem; }
.nlab-chips{ display:flex; flex-wrap:wrap; gap:6px; margin:6px 0 10px; }
.nlab-tools{ display:flex; flex-wrap:wrap; align-items:flex-end; gap:10px 14px; margin-bottom:12px; }
.nlab-step{ display:inline-flex; align-items:center; border:1px solid var(--border); border-radius:12px; overflow:hidden; } .nlab-step button{ width:40px; height:42px; background:var(--surface-2); border:0; color:inherit; font-size:1.2rem; cursor:pointer; } .nlab-step input{ width:74px; height:42px; text-align:center; border:0; background:var(--surface); color:inherit; font-size:1rem; font-weight:700; }
.nlab-card{ border:1px solid var(--border); border-radius:14px; background:var(--surface-2); padding:12px 14px; }
.nlab-sum{ display:flex; flex-wrap:wrap; gap:10px; margin-top:8px; } .nlab-sum > div{ min-width:90px; padding:6px 12px; border-radius:10px; background:var(--surface); border:1px solid var(--border); text-align:center; }
.nlab-h3{ margin:22px 0 8px; font-size:1.05rem; } .nlab-h3 small{ font-weight:500; color:var(--text-muted); font-size:.78rem; margin-left:6px; } .nlab-h4{ margin:0 0 6px; font-size:.92rem; }
.nlab-split td, .nlab-lines td{ white-space:nowrap; } .nlab-grp td{ background:rgba(255,255,255,.05); font-weight:800; font-size:.74rem; letter-spacing:.06em; text-transform:uppercase; color:var(--text-muted); }
.nlab-lines tr[data-nlab-line]{ cursor:pointer; } .nlab-lines tr.nlab-cur td{ background:color-mix(in srgb, var(--accent) 14%, transparent); }
.nlab-mus{ display:grid; grid-template-columns:repeat(auto-fill, minmax(104px, 1fr)); gap:8px; } .nlab-mu{ padding:8px 10px; border-radius:12px; background:var(--surface-2); border:1px solid var(--border); text-align:center; } .nlab-mu small{ display:block; font-size:.64rem; letter-spacing:.07em; color:var(--text-muted); font-weight:700; } .nlab-mu b{ font-family:'Oswald',sans-serif; font-size:1.1rem; } .nlab-mu i{ display:block; font-style:normal; font-size:.72rem; color:var(--text-muted); }
.nlab-mu.soft{ border-color:var(--good); background:color-mix(in srgb, var(--good) 14%, var(--surface-2)); } .nlab-mu.tough{ border-color:var(--danger); background:color-mix(in srgb, var(--danger) 12%, var(--surface-2)); }
.nlab-tsb{ margin:8px 0 0; font-size:.82rem; color:var(--text-muted); display:flex; flex-wrap:wrap; gap:4px 14px; } .nlab-tsb b{ color:var(--text); }
.nlab-cols{ display:grid; grid-template-columns:1.2fr 1fr; gap:18px; }
.nlab-part{ display:grid; grid-template-columns:130px 1fr 52px; align-items:center; gap:8px; font-size:.82rem; margin-bottom:4px; } .nlab-part i{ display:block; height:10px; border-radius:5px; } .nlab-part i.pos{ background:var(--good); } .nlab-part i.neg{ background:var(--danger); } .nlab-part b{ text-align:right; } .nlab-part b.pos{ color:var(--good); } .nlab-part b.neg{ color:var(--danger); }
.nlab-mates{ list-style:none; margin:0 0 6px; padding:0; display:grid; gap:6px; } .nlab-mates li{ padding:7px 10px; border-radius:10px; background:var(--surface-2); border:1px solid var(--border); font-size:.86rem; } .nlab-mates small{ display:block; color:var(--text-muted); font-size:.72rem; }
.nlab-adv{ display:flex; flex-wrap:wrap; gap:6px 14px; margin-top:10px; font-size:.82rem; color:var(--text-muted); } .nlab-adv b{ color:var(--text); }
.nlab-act{ display:flex; flex-wrap:wrap; gap:8px; margin:18px 0 4px; }
@media (max-width:760px){
  .nlab-modal{ padding:0; } .nlab-card-w{ border-radius:0; min-height:100vh; padding:16px 12px calc(30px + var(--ab-h, 58px)); } .nlab-who h2{ font-size:1.25rem; } .nlab-top{ margin-left:0; width:100%; } .nlab-top > div{ flex:1 1 28%; min-width:0; }
  .nlab-cols{ grid-template-columns:1fr; } .nlab-part{ grid-template-columns:96px 1fr 46px; } .nlab-filters .nbh-lab{ flex:1 1 44%; } .nlab-step{ order:-1; }
  .nlab-card-w .btn{ min-height:44px; }
}

.nlab-chk{ align-self:center; } .nlab-chk input{ width:20px; height:20px; }
.nlab-table, .nlab-split, .nlab-lines{ min-width:640px; }

/* ---- Deep dive v2: bigger window, two-column layout, shared by the big window and the profile "Research" tab ---- */
.nlab-card-w{ max-width:1400px; width:min(97vw, 1400px); padding:26px 30px 34px; border-radius:20px; }
.nlab-modal{ padding:24px 8px 48px; }
.nlab-page{ container-type:inline-size; }
.nlab-page .nph-svg{ width:100%; height:auto; display:block; }
/* hit-rate pill on the chart (class fills, no color-mix, so the PNG export keeps them) */
.nph-hrbg{ fill:var(--text-muted); fill-opacity:.16; stroke:var(--text-muted); stroke-opacity:.7; stroke-width:1; } .nph-hrlab{ fill:var(--text); font-weight:700; font-family:'Oswald',sans-serif; letter-spacing:.02em; }
.nph-hrbg.good{ fill:var(--good); fill-opacity:.2; stroke:var(--good); } .nph-hrbg.bad{ fill:var(--danger); fill-opacity:.2; stroke:var(--danger); } .nph-hrbg.mid{ fill:var(--warn, #f5b942); fill-opacity:.2; stroke:var(--warn, #f5b942); }
.nph-hrlab.good{ fill:var(--good); } .nph-hrlab.bad{ fill:var(--danger); }
.nph-small{ display:block; margin:2px 0 6px; font-size:.74rem; color:var(--text-muted); }
.nlab-head{ display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:12px 28px; padding-right:52px; margin-bottom:12px; }
.nlab-page.profile .nlab-head{ padding-right:0; }
.nlab-who h2{ font-size:1.9rem; line-height:1.1; } .nlab-who .nba-hs{ width:64px; height:64px; }
.nlab-next{ display:flex; flex-direction:column; align-items:flex-end; padding:8px 16px; border-radius:14px; background:var(--surface-2); border:1px solid var(--border); } .nlab-next small{ font-size:.64rem; letter-spacing:.08em; text-transform:uppercase; color:var(--text-muted); font-weight:700; } .nlab-next b{ font-family:'Oswald',sans-serif; font-size:1.25rem; } .nlab-next span{ font-size:.8rem; color:var(--text-muted); }
.nlab-bar{ display:flex; flex-direction:column; gap:10px; padding:10px 0 12px; margin-bottom:6px; border-bottom:1px solid var(--border); }
.nlab-modal .nlab-bar{ position:sticky; top:0; z-index:4; background:var(--surface, #12161d); }
.nlab-chips{ display:flex; flex-wrap:wrap; gap:6px; margin:0; } .nlab-chips .nph-chip{ display:inline-flex; align-items:center; gap:7px; }
.nlab-rt{ font-style:normal; font-size:.7rem; font-weight:800; padding:1px 7px; border-radius:999px; background:rgba(127,127,127,.25); } .nlab-rt.good, .nlab-rt.hi, .nlab-rt.great{ background:var(--good); color:#000; }
.nlab-grid{ display:grid; grid-template-columns:1fr; gap:18px; align-items:start; margin-top:14px; }
@container (min-width: 880px){ .nlab-grid{ grid-template-columns:minmax(0, 1.6fr) minmax(320px, 1fr); } .nlab-side{ position:sticky; top:84px; } .nlab-page.profile .nlab-side{ top:12px; } }
.nlab-main, .nlab-side{ display:flex; flex-direction:column; gap:16px; min-width:0; }
.nlab-box{ border:1px solid var(--border); border-radius:16px; background:var(--surface-2); padding:14px 16px 16px; min-width:0; }
.nlab-box .nlab-h3{ margin:0 0 10px; font-size:1.05rem; } .nlab-box .table-wrap{ border:0; }
.nlab-ch{ display:flex; justify-content:space-between; align-items:baseline; }
.nlab-sum{ gap:10px; } .nlab-sum > div{ flex:1 1 90px; background:var(--surface-3, var(--surface)); }
.nlab-sum b{ font-size:1.3rem; }
.nlab-pickc{ border:1px solid var(--accent); border-radius:16px; padding:14px 16px; background:linear-gradient(130deg, color-mix(in srgb, var(--accent) 14%, var(--surface-2)), var(--surface-2) 70%); }
.nlab-pickc.none{ border-color:var(--border); background:var(--surface-2); display:flex; flex-direction:column; gap:3px; } .nlab-pickc.none small{ text-transform:uppercase; letter-spacing:.08em; font-size:.66rem; color:var(--text-muted); font-weight:700; } .nlab-pickc.none b{ font-family:'Oswald',sans-serif; font-size:1.3rem; } .nlab-pickc.none span{ color:var(--text-muted); font-size:.84rem; }
.nlab-pk-top{ display:flex; align-items:center; gap:14px; } .nlab-pk-top small{ display:block; font-size:.64rem; letter-spacing:.08em; text-transform:uppercase; color:var(--text-muted); font-weight:700; } .nlab-pk-top b:not(.nbp-rate){ font-family:'Oswald',sans-serif; font-size:1.45rem; line-height:1.15; display:block; } .nlab-pk-top span{ color:var(--text-muted); font-size:.86rem; }
.nlab-pk-n{ display:grid; grid-template-columns:repeat(4, 1fr); gap:8px; margin-top:12px; } .nlab-pk-n > div{ padding:7px 6px; border-radius:12px; background:var(--surface); border:1px solid var(--border); text-align:center; } .nlab-pk-n small{ display:block; font-size:.6rem; letter-spacing:.07em; text-transform:uppercase; color:var(--text-muted); font-weight:700; } .nlab-pk-n b{ font-family:'Oswald',sans-serif; font-size:1.15rem; }
.nlab-mu.cur{ outline:2px solid var(--accent); }
.nlab-mus{ grid-template-columns:repeat(auto-fill, minmax(92px, 1fr)); }
.nlab-act{ margin-top:18px; }
@media (max-width:760px){ .nlab-card-w{ padding:16px 12px calc(30px + var(--ab-h, 58px)); border-radius:0; width:100%; } .nlab-who h2{ font-size:1.4rem; } .nlab-who .nba-hs{ width:52px; height:52px; } .nlab-next{ align-items:flex-start; } .nlab-pk-n{ grid-template-columns:repeat(2, 1fr); } .nlab-box{ padding:12px 10px 14px; } }

.nlab-page.profile .nlab-who{ display:none; } .nlab-page.profile .nlab-head{ justify-content:flex-end; margin-bottom:4px; }
.nlab-page.profile .nlab-bar{ padding-top:2px; }

/* ---- Deep Dive: intro callout and bigger buttons ---- */
.dd-intro{ display:flex; gap:14px; align-items:flex-start; margin:10px 0 14px; padding:14px 16px; border:1px solid var(--accent); border-radius:14px; background:linear-gradient(120deg, color-mix(in srgb, var(--accent) 13%, var(--surface-2)), var(--surface-2) 75%); font-size:.92rem; line-height:1.5; }
.dd-intro .dd-ic{ font-size:1.6rem; line-height:1; } .dd-intro b{ color:var(--accent); }
.nbr-dive-btn{ min-height:50px !important; font-size:1.05rem !important; font-weight:800 !important; padding:12px 24px !important; flex:1 1 auto; }
.nbr-act{ gap:10px; } .nbr-act .btn{ min-height:46px; }
.nlab-go{ min-height:44px !important; padding:8px 20px !important; font-size:.92rem !important; font-weight:800 !important; background:var(--accent) !important; color:#000 !important; border-color:var(--accent) !important; }
.nbr-name, .nhl-name, .nlab-pl b{ cursor:pointer; } .nbr-name:hover, .nhl-name:hover, .nlab-pl b:hover{ color:var(--accent); text-decoration:underline; text-underline-offset:3px; }
.nbr-altrow, .nbr-game li[data-nbr-dive]{ cursor:pointer; }
@media (max-width:640px){ .dd-intro{ padding:12px; font-size:.86rem; } .nbr-dive-btn{ width:100%; } }

.nbr-card > .nbr-dive-btn{ width:100%; margin:2px 0 10px; }

.nbr-card > .nbr-dive-btn{ flex:none !important; height:54px; min-height:54px !important; align-self:stretch; font-size:1.1rem !important; }

/* ---- Deep Dive search bar ---- */
.dd-search-w{ position:relative; margin:12px 0 14px; }
.dds-box{ position:relative; display:flex; align-items:center; gap:10px; padding:0 16px; min-height:56px; border:2px solid var(--accent); border-radius:16px; background:var(--surface-2); box-shadow:0 10px 34px -18px var(--accent); }
.dds-box:focus-within{ box-shadow:0 0 0 3px color-mix(in srgb, var(--accent) 35%, transparent), 0 10px 34px -14px var(--accent); }
.dds-ic{ font-size:1.5rem; line-height:1; }
.dds-in{ flex:1; min-width:0; height:54px; border:0; outline:0; background:transparent; color:var(--text); font:inherit; font-size:1.1rem; font-weight:600; }
.dds-in::placeholder{ color:var(--text-muted); font-weight:500; }
.dds-list{ position:absolute; left:-2px; right:-2px; top:calc(100% + 6px); z-index:60; max-height:420px; overflow:auto; border:1px solid var(--accent); border-radius:14px; background:var(--surface, #12161d); box-shadow:0 18px 50px -10px rgba(0,0,0,.75); padding:6px; }
.dds-row{ width:100%; display:flex; align-items:center; gap:12px; text-align:left; padding:10px 12px; min-height:54px; border:0; border-radius:10px; background:none; color:var(--text); font:inherit; cursor:pointer; }
.dds-row:hover, .dds-row.on{ background:color-mix(in srgb, var(--accent) 16%, transparent); }
.dds-n{ flex:1; min-width:0; display:flex; flex-direction:column; } .dds-n b{ font-size:1rem; } .dds-n small{ color:var(--text-muted); font-size:.78rem; }
.dds-go{ color:var(--accent); font-weight:800; font-size:.82rem; white-space:nowrap; }
.dds-none{ padding:14px; color:var(--text-muted); }
.dds-chips{ display:flex; gap:6px; margin-top:8px; } .dds-chips button{ padding:6px 14px; border-radius:999px; border:1px solid var(--border); background:var(--surface-2); color:var(--text); font:inherit; font-size:.82rem; font-weight:700; cursor:pointer; min-height:34px; } .dds-chips button.on{ background:var(--accent); color:#000; border-color:var(--accent); }
.dd-search.big .dds-box{ min-height:64px; } .dd-search.big .dds-in{ height:62px; font-size:1.2rem; }
/* ---- compact vertical Top Plays ---- */
.nbr-list{ display:flex; flex-direction:column; gap:8px; }
.nbr-row{ display:grid; grid-template-columns:52px minmax(190px, 1.3fr) minmax(150px, 1fr) minmax(190px, .9fr) 150px; align-items:center; gap:10px 16px; padding:10px 14px; border:1px solid var(--border); border-radius:14px; background:var(--surface-2); }
.nbr-row:hover{ border-color:color-mix(in srgb, var(--accent) 55%, var(--border)); }
.nbr-row .nbp-rate.big{ width:46px; height:46px; font-size:1.2rem; }
.nbr-row .nbr-who{ display:flex; align-items:center; gap:10px; min-width:0; } .nbr-row .nbr-who b{ display:block; font-size:1rem; } .nbr-row .nbr-who small{ display:flex; align-items:center; gap:5px; color:var(--text-muted); font-size:.74rem; }
.nbr-row .nbr-pick{ display:flex; flex-direction:column; gap:1px; padding:0; border:0; background:none; } .nbr-row .nbr-pick b{ font-size:1rem; } .nbr-row .nbr-pick span{ color:var(--text-muted); font-size:.82rem; } .nbr-row .nbr-pick em{ font-style:normal; }
.nbr-mini3{ display:flex; gap:18px; } .nbr-mini3 span{ display:flex; flex-direction:column; align-items:center; } .nbr-mini3 i{ font-style:normal; font-size:.6rem; letter-spacing:.08em; text-transform:uppercase; color:var(--text-muted); font-weight:700; } .nbr-mini3 b{ font-family:'Oswald',sans-serif; font-size:1.1rem; }
.nbr-row .nbr-dive-btn{ width:100%; height:44px; min-height:44px !important; font-size:.95rem !important; padding:0 14px !important; }
@media (max-width:900px){ .nbr-row{ grid-template-columns:48px 1fr auto; } .nbr-row .nbr-pick{ grid-column:2; } .nbr-mini3{ grid-column:3; grid-row:2; gap:12px; } .nbr-row .nbr-dive-btn{ grid-column:1 / -1; } }
@media (max-width:560px){ .dds-in{ font-size:1rem; } .dd-search.big .dds-in{ font-size:1.05rem; } .dds-go{ display:none; } .nbr-mini3{ grid-column:2 / -1; grid-row:3; justify-content:space-between; } .nbr-row .nbr-pick{ grid-column:2 / -1; } }

/* =====================================================================
   Prop Research polish: quieter chrome, one clear hierarchy, ghost buttons, tidy filters.
   (later rules on purpose: they override the first pass above)
   ===================================================================== */
/* intro + search: an info strip and one clean search field instead of two loud green boxes */
.dd-intro{ gap:12px; align-items:center; margin:12px 0 10px; padding:11px 14px; border:1px solid var(--border); border-left:3px solid var(--accent); border-radius:12px; background:var(--surface-2); font-size:.84rem; line-height:1.5; color:var(--text-muted); }
.dd-intro .dd-ic{ font-size:1.25rem; opacity:.9; } .dd-intro b{ color:var(--text); }
.dd-search-w{ margin:0 0 14px; }
.dds-box{ min-height:52px; padding:0 16px; border:1px solid var(--border); border-radius:14px; background:var(--surface-2); box-shadow:none; transition:border-color .15s ease, box-shadow .15s ease; }
.dds-box:hover{ border-color:color-mix(in srgb, var(--accent) 45%, var(--border)); }
.dds-box:focus-within{ border-color:var(--accent); box-shadow:0 0 0 3px color-mix(in srgb, var(--accent) 22%, transparent); }
.dds-ic{ font-size:1.2rem; opacity:.85; } .dds-in{ height:50px; font-size:1rem; }
.dd-search.big .dds-box{ min-height:54px; } .dd-search.big .dds-in{ height:52px; font-size:1.05rem; }
.dds-list{ border-color:var(--border); border-radius:14px; }
/* "how the rating works" */
.nbr-how{ margin:0 0 16px; padding:0; border-radius:12px; overflow:hidden; }
.nbr-how summary{ padding:12px 14px; font-weight:700; font-size:.9rem; list-style:none; display:flex; align-items:center; gap:8px; color:var(--text); }
.nbr-how summary::-webkit-details-marker{ display:none; } .nbr-how summary::after{ content:'+'; margin-left:auto; color:var(--accent); font-size:1.2rem; line-height:1; }
.nbr-how[open] summary::after{ content:'–'; } .nbr-how > div{ padding:0 14px 12px; }
/* section headings */
.nbr-h{ display:flex; align-items:baseline; flex-wrap:wrap; gap:4px 10px; margin:26px 0 12px; font-size:1.2rem; letter-spacing:.03em; text-transform:uppercase; }
.nbr-h::before{ content:''; align-self:center; width:4px; height:18px; border-radius:3px; background:var(--accent); }
.nbr-h small{ margin:0; font-family:Inter,system-ui,sans-serif; font-size:.74rem; text-transform:none; letter-spacing:0; }
/* date tabs, market pills and dropdowns */
#view-nba-research .nhl-dates{ gap:8px; margin:6px 0 12px; }
#view-nba-research .cat-filters{ gap:6px; }
#view-nba-research .cat-filters button, #view-nba-research .nhl-dates button{ font-size:.8rem; padding:6px 13px; min-height:34px; }
#view-nba-research .nhl-ctl{ gap:10px 14px; }
#view-nba-research select, .nlab-filters select, .nlab-tools select{ appearance:none; -webkit-appearance:none; height:40px; min-width:150px; padding:0 34px 0 13px; border:1px solid var(--border); border-radius:10px; background:var(--surface-2) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%238fa0b2' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 12px center; color:var(--text); font:inherit; font-size:.84rem; font-weight:600; cursor:pointer; text-overflow:ellipsis; }
#view-nba-research select:hover, .nlab-filters select:hover, .nlab-tools select:hover{ border-color:color-mix(in srgb, var(--accent) 45%, var(--border)); }
#view-nba-research select:focus-visible, .nlab-filters select:focus-visible{ outline:0; border-color:var(--accent); box-shadow:0 0 0 3px color-mix(in srgb, var(--accent) 22%, transparent); }
#view-nba-research .nhl-sel select{ min-width:170px; }
.nlab-filters{ gap:12px 14px; margin:10px 0 8px; padding:12px 14px; border:1px solid var(--border); border-radius:14px; background:var(--surface-2); }
.nbh-lab{ font-size:.64rem !important; font-weight:800; letter-spacing:.08em !important; }
.nlab-filters input[type=text], .nlab-filters input[type=search]{ height:40px; border-radius:10px; padding:0 14px; border:1px solid var(--border); background:var(--surface); color:var(--text); min-width:220px; }
.nlab-chk input{ accent-color:var(--accent); }
/* rating badge: a ring, not a solid blob */
.nbp-rate{ box-sizing:border-box; border:1.5px solid transparent; }
.nbp-rate.hi{ background:color-mix(in srgb, var(--accent) 16%, transparent); border-color:var(--accent); color:var(--accent); }
.nbp-rate.mid{ background:rgba(255,194,51,.14); border-color:rgba(255,194,51,.7); color:#ffc233; }
.nbp-rate.lo{ background:rgba(127,127,127,.12); border-color:rgba(127,127,127,.35); color:var(--text-muted); }
.nbp-rate.big{ box-shadow:0 0 0 4px color-mix(in srgb, currentColor 10%, transparent); border-width:2px; }
/* Top plays rows */
.nbr-list{ gap:8px; }
.nbr-row{ position:relative; gap:10px 18px; padding:12px 16px 12px 18px; border-radius:14px; background:var(--surface-2); transition:border-color .15s ease, transform .15s ease, background .15s ease; overflow:hidden; }
.nbr-row::before{ content:''; position:absolute; left:0; top:0; bottom:0; width:3px; background:rgba(127,127,127,.35); }
.nbr-row:has(.nbp-rate.hi)::before{ background:var(--accent); } .nbr-row:has(.nbp-rate.mid)::before{ background:#ffc233; }
.nbr-row:hover{ background:color-mix(in srgb, var(--accent) 5%, var(--surface-2)); transform:translateY(-1px); }
.nbr-row .nbr-who b{ font-weight:700; letter-spacing:.005em; } .nbr-row .nbr-pick b{ font-family:'Oswald',sans-serif; font-size:1.1rem; letter-spacing:.02em; font-weight:600; }
.nbr-row .nbr-pick span{ font-size:.8rem; } .nbr-row .nbr-pick span em{ color:var(--text-muted); opacity:.9; }
.nbr-mini3{ gap:8px; } .nbr-mini3 span{ min-width:62px; padding:5px 10px; border-radius:10px; background:var(--surface); border:1px solid var(--border); }
.nbr-mini3 i{ font-size:.58rem; } .nbr-mini3 b{ font-size:1.05rem; line-height:1.2; }
/* buttons: quiet by default, filled on hover */
.nbr-dive-btn, .nbr-row .nbr-dive-btn, .nlab-go{ background:transparent !important; color:var(--accent) !important; border:1px solid color-mix(in srgb, var(--accent) 60%, transparent) !important; border-radius:10px !important; font-weight:700 !important; letter-spacing:.01em; box-shadow:none !important; transition:background .15s ease, color .15s ease, border-color .15s ease; }
.nbr-dive-btn:hover, .nlab-go:hover{ background:var(--accent) !important; color:#04130a !important; border-color:var(--accent) !important; }
.nbr-row .nbr-dive-btn{ height:38px; min-height:38px !important; font-size:.86rem !important; }
.nlab-go{ min-height:34px !important; padding:4px 14px !important; font-size:.8rem !important; }
/* the research board */
.nlab-wrap{ border:1px solid var(--border); border-radius:14px; overflow:auto; background:var(--surface); }
.nlab-table{ border-collapse:separate; border-spacing:0; }
.nlab-table thead th{ position:sticky; top:0; z-index:2; background:var(--surface-2); font-size:.66rem; letter-spacing:.08em; text-transform:uppercase; padding:11px 10px; color:var(--text-muted); border-bottom:1px solid var(--border); }
.nlab-table th.on{ color:var(--accent); box-shadow:inset 0 -2px 0 var(--accent); }
.nlab-table tbody td{ padding:10px; border-bottom:1px solid color-mix(in srgb, var(--border) 70%, transparent); vertical-align:middle; }
.nlab-table tbody tr:nth-child(even) td{ background:color-mix(in srgb, var(--surface-2) 45%, transparent); }
.nlab-table tbody tr:hover td{ background:color-mix(in srgb, var(--accent) 7%, transparent) !important; }
.nlab-table tbody tr:last-child td{ border-bottom:0; }
.nlab-pill, .nlab-dv{ font-variant-numeric:tabular-nums; }
.nlab-pl b{ font-weight:700; }
/* panel header: a live dot on the timestamp */
#view-nba-research .nhl-asof{ display:inline-flex; align-items:center; gap:7px; padding:5px 12px; border-radius:999px; background:var(--surface-2); border:1px solid var(--border); font-size:.74rem; color:var(--text-muted); white-space:nowrap; }
#view-nba-research .nhl-asof::before{ content:''; width:7px; height:7px; border-radius:50%; background:var(--accent); box-shadow:0 0 0 3px color-mix(in srgb, var(--accent) 22%, transparent); }
/* best-by-game cards */
.nbr-game{ border-radius:14px; padding:12px 14px; background:var(--surface-2); }
.nbr-game h4{ font-family:'Oswald',sans-serif; letter-spacing:.03em; font-size:.98rem; }
.nbr-game li{ gap:8px; padding:8px 0; } .nbr-game li:hover{ color:var(--text); background:color-mix(in srgb, var(--accent) 6%, transparent); }
.nbr-game .nbp-rate{ min-width:28px; height:22px; margin-right:2px; }
/* Deep Dive window */
.nlab-box{ border-radius:16px; } .nlab-box .nlab-h3, .nlab-h3{ font-family:'Oswald',sans-serif; letter-spacing:.03em; text-transform:uppercase; font-size:.98rem; }
.nlab-h3 small{ font-family:Inter,system-ui,sans-serif; text-transform:none; letter-spacing:0; }
.nlab-side .nlab-lines{ min-width:0; font-size:.76rem; } .nlab-side .nlab-lines th, .nlab-side .nlab-lines td{ padding:8px 6px; } .nlab-side .nlab-lines th{ font-size:.6rem; white-space:normal; line-height:1.2; }
.nlab-side .nlab-lines td small{ font-size:.62rem; }
.nlab-pickc{ box-shadow:0 14px 40px -26px var(--accent); }
.nlab-pk-n > div, .nlab-sum > div, .nlab-top > div{ border-radius:12px; }
.nlab-modal{ backdrop-filter:blur(3px); }
/* phones */
@media (max-width:900px){
  #view-nba-research .nhl-dates, #view-nba-research .cat-filters{ flex-wrap:nowrap; overflow-x:auto; scrollbar-width:none; -webkit-overflow-scrolling:touch; margin-left:-2px; padding-bottom:4px; }
  #view-nba-research .nhl-ctl{ display:flex; flex-direction:column; align-items:stretch; min-width:0; max-width:100%; } #view-nba-research .nhl-dates, #view-nba-research .cat-filters{ max-width:100%; min-width:0; }
  #view-nba-research .panel, #view-nba-research #nbr-body{ min-width:0; max-width:100%; }
  #view-nba-research .nhl-dates::-webkit-scrollbar, #view-nba-research .cat-filters::-webkit-scrollbar{ display:none; }
  #view-nba-research .nhl-dates button, #view-nba-research .cat-filters button{ flex:none; white-space:nowrap; }
  #view-nba-research .nhl-sel{ display:grid; grid-template-columns:1fr 1fr; gap:8px; width:100%; } #view-nba-research .nhl-sel select{ min-width:0; width:100%; } #view-nba-research #nbr-game{ grid-column:1 / -1; }
  .nlab-filters{ padding:10px; gap:10px; } .nlab-filters .nbh-lab{ flex:1 1 44%; } .nlab-filters select, .nlab-filters input[type=text]{ min-width:0; width:100%; }
}
@media (max-width:560px){
  .nbr-row{ grid-template-columns:50px minmax(0, 1fr); gap:6px 12px; padding:12px 12px 12px 15px; }
  .nbr-row > .nbp-rate{ grid-row:1 / 3; align-self:start; margin-top:2px; }
  .nbr-row .nbr-who{ grid-column:2; grid-row:1; } .nbr-row .nbr-pick{ grid-column:2; grid-row:2; flex-direction:row; align-items:baseline; flex-wrap:wrap; gap:2px 10px; }
  .nbr-row .nbr-pick b{ font-size:1.05rem; }
  .nbr-mini3{ grid-column:1 / -1; grid-row:3; justify-content:stretch; gap:6px; } .nbr-mini3 span{ flex:1 1 0; min-width:0; flex-direction:row; justify-content:space-between; align-items:baseline; padding:6px 10px; }
  .nbr-row .nbr-dive-btn{ grid-column:1 / -1; grid-row:4; width:100%; height:40px; min-height:40px !important; }
  .nbr-h{ font-size:1.05rem; margin:22px 0 10px; }
}
.nlab-chk{ display:inline-flex !important; align-items:center; gap:8px !important; height:40px; padding:0 12px !important; border:1px solid var(--border); border-radius:10px; background:var(--surface); font-size:.78rem; text-transform:none !important; letter-spacing:0 !important; color:var(--text) !important; cursor:pointer; align-self:flex-end !important; }
.nlab-chk input{ appearance:none; -webkit-appearance:none; width:18px !important; height:18px !important; margin:0; border:1.5px solid var(--text-muted); border-radius:5px; background:transparent; display:grid; place-content:center; cursor:pointer; }
.nlab-chk input:checked{ background:var(--accent); border-color:var(--accent); } .nlab-chk input:checked::after{ content:''; width:9px; height:5px; border-left:2px solid #04130a; border-bottom:2px solid #04130a; transform:rotate(-45deg) translate(1px,-1px); }
.nlab-filters .btn{ height:40px; align-self:flex-end; margin-left:auto; border-radius:10px; }
/* phone: the NBA board keeps the five columns that decide a bet (rating, player, pick, EV, last 10) and fits the screen; tap a row for the rest in the Deep Dive */
@media (max-width:700px){
  #nbr-lab .nlab-wrap{ overflow-x:auto; border-radius:12px; }
  #nbr-lab .nlab-table{ min-width:0 !important; width:100%; table-layout:auto; }
  #nbr-lab .nlab-table tr > *:nth-child(n){ display:none; }
  #nbr-lab .nlab-table tr > *:nth-child(1), #nbr-lab .nlab-table tr > *:nth-child(2), #nbr-lab .nlab-table tr > *:nth-child(3), #nbr-lab .nlab-table tr > *:nth-child(7), #nbr-lab .nlab-table tr > *:nth-child(9){ display:table-cell; }
  #nbr-lab .nlab-table td{ white-space:normal; padding:10px 4px; } #nbr-lab .nlab-table th{ padding:10px 4px; font-size:.6rem; } #nbr-lab .nlab-table td:first-child, #nbr-lab .nlab-table th:first-child{ padding-left:8px; } #nbr-lab .nlab-table td .nbp-rate{ margin-right:0; }
  #nbr-lab .nlab-table td:nth-child(3){ min-width:78px; }
  #nbr-lab .nlab-table td:nth-child(2) small{ display:none; } #nbr-lab .nlab-table td:nth-child(2) b{ font-size:.86rem; } #nbr-lab .nlab-pill{ padding:2px 7px; font-size:.74rem; }
}
.nlab-filters select{ min-width:120px; } .nlab-filters input[type=text], .nlab-filters input[type=search]{ flex:1 1 200px; min-width:180px; } .nlab-filters .btn{ margin-left:0; }
/* markets with book prices only (no game history): dashed chips */
.nph-chip.po{ border-style:dashed; font-weight:600; } .nph-chip.po.on{ border-style:solid; }
/* NFL Primetime Sim page (the show modal reuses the .nfs-* styles from snippet-nba-fb.css) */
.nsim-chips{ display:grid; grid-template-columns:repeat(auto-fill,minmax(210px,1fr)); gap:10px; margin:14px 0 16px; }
.nsim-chip{ display:flex; flex-direction:column; align-items:center; gap:4px; padding:10px 8px; border-radius:12px; border:1px solid var(--border); background:var(--surface-2); color:var(--text); cursor:pointer; font-family:inherit; }
.nsim-chip:hover{ border-color:var(--accent); }
.nsim-chip.active{ border-color:var(--accent); box-shadow:0 0 0 1px var(--accent) inset; background:color-mix(in srgb, var(--accent) 10%, var(--surface-2)); }
.nsim-slot{ font:800 .68rem/1 'Oswald',sans-serif; letter-spacing:.14em; color:var(--accent); }
.nsim-ch-t{ display:flex; align-items:center; gap:6px; font:700 1.02rem/1 'Oswald',sans-serif; } .nsim-ch-t em{ font-style:normal; opacity:.55; font-size:.8rem; }
.nsim-ch-w{ font-size:.74rem; color:var(--text-muted); }
.nsim-wait{ padding:46px 12px; text-align:center; } #nsim-prog{ max-width:420px; margin:0 auto; } #nsim-prog span{ display:block; margin-top:10px; color:var(--text-muted); font-size:.88rem; }
.nsim-progbar{ height:10px; border-radius:99px; background:var(--surface-2); overflow:hidden; border:1px solid var(--border); } .nsim-progbar i{ display:block; height:100%; background:var(--accent); transition:width .12s; }
.nsim-card{ border:1px solid var(--border); border-radius:16px; background:linear-gradient(160deg, var(--surface-2), var(--surface)); padding:18px 16px 16px; }
.nsim-mu{ display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:10px; }
.nsim-tm{ display:flex; flex-direction:column; align-items:center; gap:4px; text-align:center; } .nsim-tm b{ font:700 1.08rem/1.1 'Oswald',sans-serif; } .nsim-tm span{ font-size:.78rem; color:var(--text-muted); }
.nsim-tm img{ object-fit:contain; filter:drop-shadow(0 4px 10px rgba(0,0,0,.35)); }
.nsim-vs{ display:flex; flex-direction:column; align-items:center; gap:3px; text-align:center; } .nsim-vs em{ font:800 .8rem/1.1 'Oswald',sans-serif; font-style:normal; letter-spacing:.12em; text-transform:uppercase; color:var(--accent); } .nsim-vs span{ font-size:.76rem; color:var(--text-muted); }
.nsim-win{ margin:16px 0 4px; } .nsim-wb{ display:flex; height:40px; border-radius:10px; overflow:hidden; border:1px solid var(--border); }
.nsim-wb i{ display:flex; align-items:center; font-style:normal; min-width:0; } .nsim-wb i.a{ justify-content:flex-start; padding-left:12px; } .nsim-wb i.h{ justify-content:flex-end; padding-right:12px; }
.nsim-wb b{ color:#fff; font:700 1rem/1 'Oswald',sans-serif; text-shadow:0 1px 3px rgba(0,0,0,.6); white-space:nowrap; overflow:hidden; }
.nsim-mkw{ margin-top:6px; font-size:.78rem; color:var(--text-muted); text-align:center; }
.nsim-nums{ display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin:14px 0 4px; }
.nsim-nums > div{ border:1px solid var(--border); border-radius:12px; padding:10px 12px; background:rgba(255,255,255,.02); display:flex; flex-direction:column; gap:2px; }
.nsim-nums span{ font-size:.7rem; letter-spacing:.08em; text-transform:uppercase; color:var(--text-muted); } .nsim-nums b{ font:700 1.2rem/1.15 'Oswald',sans-serif; } .nsim-nums small{ font-size:.74rem; color:var(--text-muted); }
.nsim-acts{ display:flex; flex-wrap:wrap; gap:10px; margin-top:14px; }
.nsim-sec{ margin-top:22px; } .nsim-sec h3{ margin:0 0 10px; font:700 1.1rem/1.2 'Oswald',sans-serif; letter-spacing:.02em; }
.nsim-t{ width:100%; border-collapse:collapse; font-size:.86rem; } .nsim-t th{ text-align:right; font-weight:700; font-size:.7rem; letter-spacing:.06em; text-transform:uppercase; color:var(--text-muted); padding:6px 8px; border-bottom:1px solid var(--border); }
.nsim-t td{ padding:7px 8px; text-align:right; border-bottom:1px solid color-mix(in srgb, var(--border) 60%, transparent); font-variant-numeric:tabular-nums; } .nsim-t .l{ text-align:left; } .nsim-t img{ vertical-align:middle; }
.nsim-edges td{ vertical-align:top; padding:11px 10px; } .nsim-side{ text-align:left !important; } .nsim-side b{ display:block; font-size:.98rem; } .nsim-side span{ display:block; color:var(--text-muted); font-size:.8rem; } .nsim-side i{ display:block; font-style:normal; font-size:.78rem; margin-top:2px; }
.nsim-side.pick{ background:color-mix(in srgb, var(--accent) 9%, transparent); border-radius:8px; } .nsim-side.pick i{ color:var(--accent); font-weight:700; }
.nsim-lean{ text-align:left !important; } .nsim-lean b{ display:block; } .nsim-edge{ display:inline-block; margin-top:3px; font-size:.74rem; padding:2px 8px; border-radius:99px; border:1px solid var(--border); color:var(--text-muted); } .nsim-edge.on{ border-color:var(--accent); color:var(--accent); font-weight:700; }
.nsim-props td small{ color:var(--text-muted); font-size:.72rem; } .nsim-edge-c{ font-weight:700; } .nsim-edge-c.hot{ color:var(--accent); }
.nsim-line{ max-width:420px; } .nsim-box2{ display:grid; grid-template-columns:minmax(260px,330px) 1fr; gap:18px; margin-top:14px; align-items:start; }
.nsim-stats .k{ text-align:center; color:var(--text-muted); font-size:.8rem; } .nsim-stats .v{ font-weight:600; width:30%; } .nsim-stats .v.hi{ color:var(--accent); font-weight:800; }
.nsim-pls{ display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:16px; } .nsim-pls > *{ min-width:0; } .nsim-pl .table-wrap{ overflow-x:auto; max-width:100%; } @media (max-width:1180px){ .nsim-pls{ grid-template-columns:minmax(0, 1fr); } } .nsim-pl h4{ margin:0 0 6px; font:700 .98rem/1.2 'Oswald',sans-serif; display:flex; align-items:center; gap:8px; } .nsim-pl .nsim-t{ margin-bottom:8px; } .nsim-k{ font-size:.76rem; color:var(--text-muted); margin:2px 0 0; }
.nsim-hist{ display:flex; align-items:flex-end; gap:3px; height:120px; padding:6px 0; border-bottom:1px solid var(--border); } .nsim-hist i{ flex:1; border-radius:3px 3px 0 0; min-height:2px; background:var(--text-muted); }
.nsim-hist i.a{ background:#6aa7ff; } .nsim-hist i.h{ background:var(--accent); } .nsim-hist i.m{ background:#e5e7eb; } .nsim-hist-l{ display:flex; justify-content:space-between; font-size:.74rem; color:var(--text-muted); margin-top:4px; }
.nsim-how p{ margin:0; color:var(--text-muted); font-size:.88rem; line-height:1.55; }
@media (max-width:760px){
  .nsim-chips{ grid-template-columns:1fr; } .nsim-chip{ flex-direction:row; justify-content:space-between; padding:10px 12px; }
  .nsim-nums{ grid-template-columns:1fr 1fr; } .nsim-mu{ grid-template-columns:1fr 1fr; } .nsim-vs{ grid-column:1 / -1; order:3; } .nsim-tm img{ width:64px; height:64px; }
  .nsim-box2{ grid-template-columns:1fr; } .nsim-pls{ grid-template-columns:1fr; } .nsim-edges td{ display:block; } .nsim-edges tr{ display:block; padding:6px 0; border-bottom:1px solid var(--border); }
}

/* ---- First Touchdown: our pick + EV highlight ---- */
.ftd-pick{ border:1px solid var(--border); border-radius:16px; padding:14px 16px; margin:0 0 14px; background:var(--surface-2); display:grid; grid-template-columns:minmax(180px, 1fr) auto; gap:8px 20px; align-items:center; }
.ftd-pick.ev{ border-color:var(--accent); background:linear-gradient(120deg, color-mix(in srgb, var(--accent) 16%, var(--surface-2)), var(--surface-2) 70%); box-shadow:0 0 0 1px color-mix(in srgb, var(--accent) 40%, transparent), 0 12px 36px -18px var(--accent); }
.ftd-pick-l{ display:flex; flex-direction:column; gap:2px; } .ftd-pick-l b{ font-family:'Oswald',sans-serif; font-size:1.6rem; line-height:1.1; } .ftd-pick-l small{ color:var(--text-muted); }
.ftd-pick-tag{ display:inline-block; align-self:flex-start; padding:3px 10px; border-radius:999px; background:rgba(255,255,255,.1); font-size:.7rem; font-weight:800; letter-spacing:.08em; } .ftd-pick.ev .ftd-pick-tag{ background:var(--accent); color:#000; }
.ftd-pick-n{ display:flex; flex-wrap:wrap; gap:8px; } .ftd-pick-n > div{ min-width:84px; padding:8px 12px; border-radius:12px; background:var(--surface); border:1px solid var(--border); text-align:center; }
.ftd-pick-n small{ display:block; font-size:.62rem; letter-spacing:.07em; text-transform:uppercase; color:var(--text-muted); font-weight:700; } .ftd-pick-n b{ display:block; font-family:'Oswald',sans-serif; font-size:1.3rem; } .ftd-pick-n i{ display:block; font-style:normal; font-size:.66rem; color:var(--text-muted); }
.ftd-pick-n .ev-up{ border-color:var(--accent); background:color-mix(in srgb, var(--accent) 16%, var(--surface)); } .ftd-pick-n .ev-up b{ color:var(--accent); }
.ftd-pick p{ grid-column:1 / -1; margin:2px 0 0; font-size:.86rem; color:var(--text-muted); line-height:1.45; }
.nsim-ftd tr.ftd-pos > td{ background:color-mix(in srgb, var(--accent) 9%, transparent); }
.nsim-ftd tr.ftd-isPick > td{ background:color-mix(in srgb, var(--accent) 20%, transparent); font-weight:700; } .nsim-ftd tr.ftd-isPick > td:first-child{ box-shadow:inset 4px 0 0 var(--accent); }
.ftd-evtag{ display:inline-block; padding:1px 7px; border-radius:6px; background:var(--accent); color:#000; font-size:.66rem; font-weight:900; letter-spacing:.04em; }
.ftd-ev.pos{ color:var(--accent); font-weight:800; } .ftd-ev.neg{ color:var(--text-muted); }
@media (max-width:640px){ .ftd-pick{ grid-template-columns:1fr; } .ftd-pick-l b{ font-size:1.4rem; } .ftd-pick-n > div{ flex:1 1 40%; } }
/* ---- NBA DFS: position pills and pool details (the rest reuses the NFL DFS styles) ---- */
.pill.pos-PG{ background:#3B5BA5; color:#fff; }
.pill.pos-SG{ background:#2E7D4F; color:#fff; }
.pill.pos-SF{ background:#B8790A; color:#fff; }
.pill.pos-PF{ background:#7A4FA0; color:#fff; }
.pill.pos-C{ background:#A04F4F; color:#fff; }
.pill.pos-UTIL{ background:#555; color:#fff; }
#nbd-table td small{ display:block; font-size:.62rem; color:var(--text-muted); }
#nbd-table .nbp-who, #nbd-value .nbp-who{ display:flex; align-items:center; gap:8px; }
#nbd-table .nba-hs, #nbd-value .nba-hs{ width:28px; height:28px; border-radius:50%; object-fit:cover; background:var(--surface-2); flex-shrink:0; }
#nbd-table .team-cell, #nbd-value .team-cell{ display:flex; align-items:center; gap:6px; }
#nbd-table tr.row-excluded td{ opacity:.45; }
.nbd-link{ cursor:pointer; } .nbd-link:hover{ color:var(--accent); text-decoration:underline; }
/* NBA Game Sim page (shares the .nsim-* styles with the NFL Primetime Sim in snippet-nfl-sim.css; the show modal reuses .nfs-* from snippet-nba-fb.css) */
.nbsim-chips{ grid-template-columns:repeat(auto-fill,minmax(210px,1fr)); }
.nbsim-t{ font-size:.8rem; } .nbsim-t th, .nbsim-t td{ padding:6px 5px; } .nbsim-t td.l{ white-space:nowrap; } .nbsim-t td small{ color:var(--text-muted); font-size:.64rem; margin-left:3px; }
.nbsim-t tr.st td.l b{ color:var(--text); } .nbsim-t tr:not(.st):not(.tot) td{ color:var(--text-muted); } .nbsim-t tr:not(.st):not(.tot) td b{ color:var(--text); } .nbsim-t tr.tot td{ border-top:2px solid var(--border); font-weight:700; }
.nbsim-pl .table-wrap{ overflow-x:auto; }
.nsim-t td small{ display:block; color:var(--text-muted); font-size:.64rem; font-weight:500; } .nsim-t td.l small{ display:inline; }
.nsim-t td.nsim-mk{ background:color-mix(in srgb, var(--accent) 10%, transparent); }
.nbsim-t td small.nbsim-r, .nsim-t td small.nbsim-r{ color:var(--accent); font-weight:800; border:1px solid var(--accent); border-radius:4px; padding:0 3px; font-size:.58rem; }
.nbsim-box .nsim-box2{ display:block; } .nbsim-box .nsim-stats{ max-width:460px; margin:0 auto 18px; }
.nbsim-box .nsim-pls{ grid-template-columns:1fr; gap:22px; } .nbsim-t td, .nbsim-t th{ white-space:nowrap; }

  /* ---- Rankings: game-by-game ranker ---- */
  .rkg-modebar{ display:flex; flex-wrap:wrap; gap:10px; align-items:center; margin-bottom:14px; }
  .rkg-progress{ display:flex; flex-wrap:wrap; justify-content:space-between; gap:6px 18px; align-items:center; font-size:0.84rem; color:var(--text-muted); margin-bottom:12px; } .rkg-progress b{ color:var(--text); }
  .rkg-pbar{ flex:1 1 220px; max-width:420px; height:8px; border-radius:6px; background:var(--surface-2); overflow:hidden; border:1px solid var(--border); } .rkg-pbar i{ display:block; height:100%; background:linear-gradient(90deg, var(--accent), #6ee7a0); transition:width .25s ease; }
  .rkg-gstrip{ display:flex; gap:10px; overflow-x:auto; padding:2px 2px 12px; scrollbar-width:thin; scroll-snap-type:x proximity; }
  .rkg-gcard{ flex:0 0 150px; scroll-snap-align:start; display:grid; gap:3px; justify-items:center; text-align:center; padding:10px 8px 9px; border-radius:12px; border:1px solid var(--border); background:var(--surface-2); color:var(--text); cursor:pointer; font-family:inherit; transition:border-color .12s ease, transform .12s ease, background-color .12s ease; }
  .rkg-gcard:hover{ transform:translateY(-1px); border-color:color-mix(in srgb, var(--accent) 55%, var(--border)); }
  .rkg-gcard.on{ border-color:var(--accent); background:color-mix(in srgb, var(--accent) 13%, var(--surface-2)); box-shadow:0 0 0 1px var(--accent); }
  .rkg-gcard.done{ opacity:0.78; } .rkg-gcard.done .rkg-gp{ color:var(--good); font-weight:800; }
  .rkg-gt{ display:flex; align-items:center; gap:6px; } .rkg-gt i{ font-style:normal; font-size:0.7rem; color:var(--text-muted); }
  .rkg-gcard b{ font-family:'Oswald',sans-serif; letter-spacing:0.03em; font-size:0.86rem; } .rkg-gw{ font-size:0.68rem; color:var(--text-muted); }
  .rkg-gbar{ width:100%; height:5px; border-radius:4px; background:var(--surface); overflow:hidden; margin-top:3px; } .rkg-gbar i{ display:block; height:100%; background:var(--accent); } .rkg-gp{ font-size:0.68rem; color:var(--text-muted); }
  .rkg-ghead{ display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:12px 22px; padding:14px 16px; border:1px solid var(--border); border-radius:14px; background:linear-gradient(135deg, color-mix(in srgb, var(--accent) 9%, var(--surface-2)), var(--surface-2) 60%); margin:2px 0 14px; }
  .rkg-gteams{ display:flex; align-items:center; gap:12px; } .rkg-gteams > span{ color:var(--text-muted); } .rkg-gteams b{ display:block; font-family:'Oswald',sans-serif; font-size:1.25rem; letter-spacing:0.03em; } .rkg-gteams small{ color:var(--text-muted); font-size:0.78rem; }
  .rkg-gmeta{ display:flex; gap:22px; flex-wrap:wrap; font-weight:700; } .rkg-gmeta label{ display:block; font-size:0.6rem; text-transform:uppercase; letter-spacing:0.08em; color:var(--text-muted); font-weight:700; }
  .rkg-gnav{ display:flex; gap:8px; }
  .rkg-layout{ display:grid; grid-template-columns:minmax(300px, 380px) 1fr; gap:16px; align-items:start; }
  @media (max-width:860px){ .rkg-layout{ grid-template-columns:1fr; } }
  .rkg-pool{ border:1px dashed var(--border); border-radius:14px; background:var(--surface); position:sticky; top:12px; max-height:calc(100vh - 24px); display:flex; flex-direction:column; }
  @media (max-width:860px){ .rkg-pool{ position:static; max-height:none; } }
  .rkg-pool.over{ border-color:var(--accent); background:color-mix(in srgb, var(--accent) 6%, var(--surface)); }
  .rkg-pool-h{ padding:12px 12px 8px; display:grid; gap:8px; border-bottom:1px solid var(--border); } .rkg-pool-h h3{ margin:0; font-size:0.82rem; text-transform:uppercase; letter-spacing:0.06em; color:var(--text-muted); } .rkg-pool-h h3 span{ color:var(--accent); margin-left:4px; }
  .rkg-pool-h input[type=text]{ padding:8px 10px; background:var(--surface-2); border:1px solid var(--border); border-radius:8px; color:var(--text); font-size:0.85rem; min-width:0; }
  .rkg-tog{ font-size:0.74rem; color:var(--text-muted); display:flex; align-items:center; gap:6px; cursor:pointer; } .rkg-tog i{ font-style:normal; }
  .rkg-pool-list{ padding:8px; display:grid; gap:6px; overflow-y:auto; align-content:start; min-height:80px; }
  .rkg-chip{ position:relative; display:flex; align-items:center; gap:10px; padding:7px 10px; border-radius:11px; background:var(--surface-2); border:1px solid var(--border); cursor:grab; user-select:none; transition:border-color .1s ease, box-shadow .1s ease, opacity .1s ease; flex-wrap:wrap; }
  .rkg-chip:hover{ border-color:color-mix(in srgb, var(--accent) 50%, var(--border)); } .rkg-chip:active{ cursor:grabbing; }
  .rkg-chip.sel{ border-color:var(--accent); box-shadow:0 0 0 2px color-mix(in srgb, var(--accent) 40%, transparent); background:color-mix(in srgb, var(--accent) 10%, var(--surface-2)); }
  .rkg-chip.dragging{ opacity:0.35; }
  .rkg-hs{ width:38px; height:38px; border-radius:50%; object-fit:cover; background:var(--surface); flex:none; border:1px solid var(--border); } .rkg-hs-ph{ display:inline-block; }
  .rkg-who{ display:grid; gap:2px; min-width:0; flex:1 1 110px; } .rkg-nm{ font-size:0.88rem; font-weight:700; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .rkg-sub{ display:flex; align-items:center; gap:6px; font-size:0.68rem; color:var(--text-muted); } .rkg-sub .pill{ font-size:0.56rem; padding:1px 6px; }
  .rkg-inj{ font-size:0.58rem; font-weight:800; padding:1px 5px; border-radius:5px; background:var(--danger-bg); color:var(--danger); }
  .rkg-stats{ display:flex; align-items:center; gap:7px; flex:none; } .rkg-pts{ font-family:'Oswald',sans-serif; font-size:1.05rem; font-weight:700; color:var(--accent); min-width:34px; text-align:right; } .rkg-pts.none{ color:var(--text-muted); }
  .rkg-mu{ font-size:0.62rem; font-weight:800; padding:2px 6px; border-radius:6px; }
  .rkg-quick{ display:flex; gap:5px; flex:1 1 100%; padding-top:4px; border-top:1px dashed var(--border); } .rkg-quick button{ flex:1; min-width:0; padding:5px 0; border:0; border-radius:8px; background:var(--c, var(--surface)); color:#fff; font-weight:800; cursor:pointer; text-shadow:0 1px 1px rgba(0,0,0,0.35); font-family:'Oswald',sans-serif; } .rkg-quick button:hover{ filter:brightness(1.15); } .rkg-quick button.x{ background:var(--surface); color:var(--text-muted); border:1px solid var(--border); text-shadow:none; }
  .rkg-tiers{ display:grid; gap:10px; }
  .rkg-tier{ display:flex; border:1px solid var(--border); border-radius:14px; overflow:hidden; background:var(--surface); }
  .rkg-tlabel{ width:62px; flex:none; display:flex; flex-direction:column; align-items:center; justify-content:center; color:#fff; text-shadow:0 1px 2px rgba(0,0,0,0.4); font-family:'Oswald',sans-serif; } .rkg-tlabel b{ font-size:1.7rem; line-height:1; } .rkg-tlabel small{ font-size:0.54rem; letter-spacing:0.12em; opacity:0.9; }
  .rkg-slot{ flex:1; min-height:74px; padding:9px; display:grid; grid-template-columns:repeat(auto-fill, minmax(250px, 1fr)); gap:8px; align-content:start; transition:background-color .12s ease; }
  .rkg-slot.over{ background:color-mix(in srgb, var(--accent) 9%, var(--surface)); outline:2px dashed var(--accent); outline-offset:-4px; }
  .rkg-empty{ grid-column:1 / -1; align-self:center; text-align:center; color:var(--text-muted); font-size:0.78rem; border:1px dashed var(--border); border-radius:10px; padding:18px 8px; opacity:0.75; }
  .rkg-tother{ width:34px; flex:none; display:flex; align-items:center; justify-content:center; font-size:0.66rem; font-weight:700; color:var(--text-muted); border-left:1px solid var(--border); background:var(--surface-2); }
  .rkg-tactions{ display:flex; justify-content:center; }
  .rkg-keys{ margin:14px 2px 0; } .rkg-keys kbd{ display:inline-block; min-width:18px; text-align:center; padding:0 5px; margin:0 1px; border:1px solid var(--border); border-bottom-width:2px; border-radius:5px; background:var(--surface-2); font-size:0.72rem; font-family:inherit; color:var(--text); }
  @media (max-width:520px){ .rkg-slot{ grid-template-columns:1fr; } .rkg-gcard{ flex-basis:132px; } .rkg-gmeta{ gap:14px; } }

  /* ---- Rankings player card (public tiers, game ranker, numbered list) ---- */
  .rkc{ position:relative; display:grid; grid-template-columns:auto minmax(0, 1fr) auto; gap:12px; align-items:center; width:100%; text-align:left; }
  .rkc-l{ display:flex; flex-direction:column; align-items:center; gap:5px; }
  .rkc-hs{ width:56px; height:56px; border-radius:50%; object-fit:cover; background:var(--surface); border:2px solid var(--border); display:block; } .rkc-hs-ph{ background:var(--surface); }
  .rkc-rk{ text-align:center; line-height:1.05; } .rkc-rank{ display:block; font-family:'Oswald',sans-serif; font-weight:800; font-size:1.1rem; color:var(--accent); background:none; border:0; padding:0; margin:0 auto; } button.rkc-rank.edit{ cursor:text; border-bottom:1px dashed var(--accent); } .rkc-rank-in{ width:54px; padding:3px 4px; background:var(--surface); border:1px solid var(--accent); border-radius:6px; color:var(--text); font-weight:800; text-align:center; } .rkc-rk small{ display:block; font-size:0.6rem; color:var(--text-muted); font-weight:700; }
  .rkc-name{ display:flex; flex-wrap:wrap; align-items:center; gap:6px; } .rkc-nm{ font-size:1rem; font-weight:800; } .rkc-name .pill{ font-size:0.58rem; } .rkc-tm{ font-size:0.7rem; color:var(--text-muted); font-weight:700; }
  .rkc-tiles{ display:grid; grid-template-columns:repeat(auto-fit, minmax(74px, 1fr)); gap:6px; margin:8px 0 7px; }
  .rkc-tile{ background:var(--surface); border:1px solid var(--border); border-radius:9px; padding:5px 8px 6px; display:grid; gap:1px; } .rkc-tile label{ font-size:0.54rem; text-transform:uppercase; letter-spacing:0.07em; color:var(--text-muted); font-weight:700; white-space:nowrap; } .rkc-tile b{ font-family:'Oswald',sans-serif; font-size:1rem; line-height:1.1; }
  .rkc-bar{ display:block; height:3px; border-radius:2px; background:var(--surface-2); overflow:hidden; margin-top:2px; } .rkc-bar i{ display:block; height:100%; border-radius:2px; }
  .rkc-form{ display:flex; align-items:center; flex-wrap:wrap; gap:6px 12px; margin:0 0 7px; font-size:0.74rem; } .rkc-form span{ display:inline-flex; align-items:baseline; gap:4px; } .rkc-form label{ font-size:0.56rem; color:var(--text-muted); font-weight:800; letter-spacing:0.08em; } .rkc-form b{ font-family:'Oswald',sans-serif; font-size:0.95rem; }
  .rkc-trend{ font-weight:800; color:var(--text-muted); } .rkc-trend.up{ color:var(--good); } .rkc-trend.dn{ color:var(--danger); }
  .rkc-spark{ margin-left:auto; display:block; } .rkc-sl{ font-size:6.5px; fill:var(--text-muted); }
  .rkc-chips{ display:flex; flex-wrap:wrap; gap:5px; } .rkc-chip{ display:inline-flex; align-items:center; gap:4px; font-size:0.66rem; font-weight:700; padding:2px 7px; border-radius:6px; background:var(--surface); border:1px solid var(--border); white-space:nowrap; } .rkc-chip.bye{ color:var(--warn); border-color:var(--warn); }
  .rkc-proj{ text-align:center; min-width:78px; padding-left:12px; border-left:1px solid var(--border); display:grid; gap:1px; } .rkc-proj label{ font-size:0.54rem; letter-spacing:0.09em; color:var(--text-muted); font-weight:800; } .rkc-proj b{ font-family:'Oswald',sans-serif; font-size:1.9rem; line-height:1; color:var(--accent); } .rkc-proj b.none{ color:var(--text-muted); font-size:1.3rem; } .rkc-proj small{ font-size:0.62rem; color:var(--text-muted); font-weight:700; } .rkc-proj span{ font-size:0.6rem; color:var(--text-muted); white-space:nowrap; }
  .rkc-x{ position:absolute; top:-4px; right:-2px; cursor:pointer; color:var(--text-muted); font-size:0.72rem; }
  .rkc.compact .rkc-hs{ width:46px; height:46px; } .rkc.compact .rkc-proj b{ font-size:1.45rem; } .rkc.compact .rkc-proj{ min-width:64px; padding-left:9px; } .rkc.compact .rkc-tiles{ grid-template-columns:repeat(3, 1fr); gap:5px; margin:6px 0 5px; } .rkc.compact .rkc-tile{ padding:3px 6px 4px; } .rkc.compact .rkc-tile b{ font-size:0.88rem; }
  @media (max-width:560px){ .rkc{ grid-template-columns:auto minmax(0,1fr); } .rkc-proj{ grid-column:1 / -1; border-left:0; border-top:1px solid var(--border); padding:6px 0 0; display:flex; align-items:baseline; justify-content:center; gap:8px; } }
  /* public tier board: cards in a grid */
  .tier-chips{ display:grid !important; grid-template-columns:repeat(auto-fill, minmax(440px, 1fr)); gap:10px !important; }
  @media (max-width:520px){ .tier-chips{ grid-template-columns:1fr; } }
  .tier-chip.rk-card-chip{ display:block; padding:12px 14px; border-radius:14px; position:relative; }
  /* ranker uses cards too */
  .rkg-chip{ display:block; padding:9px 10px; } .rkg-layout{ grid-template-columns:minmax(340px, 440px) 1fr; } .rkg-slot{ grid-template-columns:repeat(auto-fill, minmax(360px, 1fr)); }
  @media (max-width:860px){ .rkg-layout{ grid-template-columns:1fr; } } @media (max-width:520px){ .rkg-slot{ grid-template-columns:1fr; } }
  .rkg-quick{ margin-top:7px; }
  /* numbered list */
  .rkn-bar{ display:flex; flex-wrap:wrap; gap:10px; align-items:center; margin-bottom:10px; } .rkn-bar input[type=text]{ padding:8px 10px; background:var(--surface-2); border:1px solid var(--border); border-radius:8px; color:var(--text); font-size:0.85rem; min-width:180px; }
  /* per-tier "order by projected points" button (all Rankings views) */
  .rk-tsort{ flex:none; font:inherit; font-size:0.66rem; font-weight:800; letter-spacing:0.04em; text-transform:none; padding:3px 9px; border-radius:999px; border:1px solid color-mix(in srgb, var(--accent) 55%, var(--border)); background:color-mix(in srgb, var(--accent) 10%, transparent); color:var(--accent); cursor:pointer; line-height:1.2; }
  .rk-tsort:hover{ background:color-mix(in srgb, var(--accent) 22%, transparent); }
  .rkn-tier{ display:flex; align-items:center; gap:10px; }
  .rkg-tlabel .rk-tsort{ margin-top:5px; padding:2px 6px; font-size:0.56rem; color:#fff; border-color:rgba(255,255,255,0.55); background:rgba(0,0,0,0.22); text-shadow:none; }
  .rkn-tier{ margin:16px 0 7px; font-family:'Oswald',sans-serif; text-transform:uppercase; letter-spacing:0.08em; color:var(--c); border-bottom:2px solid var(--c); padding-bottom:4px; font-size:0.85rem; }
  .rkn-row{ position:relative; display:flex; align-items:center; gap:12px; border:1px solid var(--border); border-left:5px solid var(--c); border-radius:14px; background:var(--surface); padding:9px 14px; margin-bottom:7px; }
  .rkn-row[draggable="true"]{ cursor:grab; } .rkn-row.dragging{ opacity:0.35; } .rkn-row.over{ outline:2px dashed var(--accent); outline-offset:2px; }
  .rkn-num{ font-family:'Oswald',sans-serif; font-weight:800; font-size:1.7rem; width:48px; text-align:center; color:var(--c); flex:none; }
  .rkn-ctl{ display:flex; flex-direction:column; gap:3px; flex:none; } .rkn-ctl input{ width:58px; padding:3px 4px; background:var(--surface-2); border:1px solid var(--border); border-radius:6px; color:var(--text); text-align:center; font-weight:700; } .rkn-ctl button{ border:1px solid var(--border); background:var(--surface-2); color:var(--text-muted); border-radius:6px; font-size:0.62rem; padding:1px 0; cursor:pointer; line-height:1.3; } .rkn-ctl button:hover{ color:var(--text); border-color:var(--accent); }
  .rkn-card{ flex:1; min-width:0; } .rkn-row .rkc-rk{ display:none; }
  @media (max-width:560px){ .rkn-row{ flex-wrap:wrap; padding:8px; } .rkn-num{ font-size:1.3rem; width:34px; } }
  @media print{ .rkc-spark, .rkc-tile .rkc-bar{ display:none; } }
  /* card refinements: one row of four tiles, small team badges, quieter chips */
  .rkc .team-badge{ width:20px !important; height:20px !important; font-size:0.46rem !important; flex:none; }
  .rkc-tiles{ grid-template-columns:repeat(4, minmax(0, 1fr)); gap:5px; } .rkc.compact .rkc-tiles{ grid-template-columns:repeat(3, minmax(0, 1fr)); }
  .rkc-tile label{ font-size:0.5rem; overflow:hidden; text-overflow:ellipsis; } .rkc-tile b{ font-size:0.95rem; }
  .rkc-form{ flex-wrap:nowrap; gap:10px; } .rkc-spark{ width:104px; height:auto; flex:none; }
  .rkc.compact .rkc-chips .rkc-chip:nth-child(n+4){ display:none; }
  .rkc-hs{ align-self:center; }
  .rkc-tiles{ grid-template-columns:repeat(4, minmax(0, 150px)); } .rkc.compact .rkc-tiles{ grid-template-columns:repeat(3, minmax(0, 1fr)); }
  .rkn-bar input[type=text]{ width:240px; flex:none; } .rkn-card{ max-width:980px; }
  .rkc-trend{ white-space:nowrap; } .rkc-tile label{ letter-spacing:0.03em; font-size:0.52rem; text-overflow:clip; }
  /* ---------- polish: fewer, calmer blocks; one place for each thing ---------- */

  /* Home: the trust strip, the hero tag line and the second "follow on X" card only repeated things already on the page */
  #view-home .home-trust-strip{ display:none; }
  #view-home .hero-eyebrow.promo{ cursor:pointer; }
  #home-twitter-panel{ display:none; }

  /* Home: panels quieter and tighter */
  #view-home .panel{ padding:20px 22px; margin-bottom:16px; box-shadow:none; background:var(--surface); border-color:rgba(255,255,255,0.07); }
  #view-home .panel-head{ margin-bottom:12px; }
  #view-home .panel-head h2{ font-size:1.2rem; }
  #view-home .section-eyebrow{ margin-bottom:4px; }
  #home-nba-panel{ border-color:rgba(255,255,255,0.07); background:var(--surface); }
  #home-nba-panel .panel-head{ margin-bottom:12px; }

  /* Home: tool cards become a tidy list of links (icon + name) instead of two walls of paragraphs */
  #home-nba-panel .feature-card p, #home-tools-panel .feature-card p{ display:none; }
  #home-nba-panel .feature-grid, #home-tools-panel .feature-grid{ grid-template-columns:repeat(3, minmax(0, 1fr)); gap:10px; }
  #home-nba-panel .feature-card, #home-tools-panel .feature-card{ display:flex; align-items:center; gap:12px; padding:12px 14px; cursor:pointer; }
  #home-nba-panel .feature-icon, #home-tools-panel .feature-icon{ margin:0; flex:none; }
  #home-nba-panel .feature-title, #home-tools-panel .feature-title{ margin:0; font-size:0.92rem; }
  @media (max-width:640px){
    #home-nba-panel .feature-grid, #home-tools-panel .feature-grid{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
    #home-nba-panel .feature-card, #home-tools-panel .feature-card{ padding:10px 11px; gap:9px; }
    #home-nba-panel .feature-title, #home-tools-panel .feature-title{ font-size:0.8rem; }
  }

  /* Basketball: the Blog section button repeated the Blog tab in the main menu */
  #subtabs-nhl-cats{ display:none !important; }   /* hockey has one section: no category row needed (basketball now has Betting / Players / Season / News) */

  /* Charts: side captions on the green / red bars, and a collapsible table so a chart and its table don't stack */
  .nbm-hd{ font-size:10.5px; font-weight:700; letter-spacing:0.05em; text-transform:uppercase; }
  .nbm-hd-neg{ fill:var(--danger); } .nbm-hd-pos{ fill:var(--good); }
  .nbm-fold{ padding:0; }
  .nbm-fold > summary{ cursor:pointer; list-style:none; padding:12px 16px; font-family:'Oswald',sans-serif; font-weight:600; letter-spacing:0.02em; text-transform:uppercase; font-size:0.85rem; color:var(--text); }
  .nbm-fold > summary::-webkit-details-marker{ display:none; }
  .nbm-fold > summary::before{ content:'\25B8'; display:inline-block; margin-right:8px; color:var(--text-muted); transition:transform .15s ease; }
  .nbm-fold[open] > summary::before{ transform:rotate(90deg); }
  .nbm-fold > :not(summary){ margin:0 16px 14px; }

  /* ---------- section tabs (after clicking Football / Basketball): one light bar, not two heavy rows ---------- */
  nav.subtabs{ gap:2px; padding:0 24px; background:var(--surface); border-bottom:1px solid var(--border); scrollbar-width:none; }
  nav.subtabs::-webkit-scrollbar{ display:none; }
  /* row 2: Fantasy / DFS / Research as small pills */
  nav.subtabs.sport-cats{ padding:12px 24px 4px; gap:8px; border-bottom:0; }
  nav.subtabs.sport-cats button{ font-family:Inter,sans-serif; text-transform:none; letter-spacing:0; font-size:0.84rem; font-weight:600; padding:6px 16px; border-radius:999px; border:1px solid var(--border); background:transparent; color:var(--text-muted); box-shadow:none; }
  nav.subtabs.sport-cats button:hover:not([aria-selected="true"]){ background:rgba(127,127,127,0.1); color:var(--text); }
  nav.subtabs.sport-cats button[aria-selected="true"]{ background:color-mix(in srgb, var(--accent) 14%, transparent); color:var(--accent); border-color:color-mix(in srgb, var(--accent) 45%, transparent); box-shadow:none; }
  /* row 3: the pages, as quiet underline tabs in normal case */
  nav.subtabs:not(.sport-cats) button{ font-family:Inter,sans-serif; text-transform:none; letter-spacing:0; font-size:0.88rem; font-weight:600; padding:12px 14px; border-radius:0; background:transparent; color:var(--text-muted); position:relative; }
  nav.subtabs:not(.sport-cats) button:hover{ background:transparent; color:var(--text); }
  nav.subtabs:not(.sport-cats) button.active{ background:transparent; color:var(--text); }
  nav.subtabs:not(.sport-cats) button.active::after{ content:''; position:absolute; left:12px; right:12px; bottom:-1px; height:2px; border-radius:2px; background:var(--accent); }
  @media (max-width:620px){
    nav.subtabs{ padding:0 12px; }
    nav.subtabs.sport-cats{ padding:10px 12px 2px; }
    nav.subtabs:not(.sport-cats) button{ padding:11px 11px; font-size:0.84rem; }
  }
  /* sub tabs: smaller so every page is visible without scrolling; on narrow screens they wrap onto a second line */
  nav.subtabs:not(.sport-cats) button{ font-size:0.8rem; padding:10px 9px; }
  nav.subtabs:not(.sport-cats) button.active::after{ left:9px; right:9px; }
  @media (max-width:900px){
    nav.subtabs:not(.sport-cats){ flex-wrap:wrap; overflow-x:visible; padding:2px 10px 0; gap:0; }
    nav.subtabs:not(.sport-cats) button{ font-size:0.76rem; padding:8px 8px; }
    nav.subtabs:not(.sport-cats) button.active::after{ left:8px; right:8px; }
  }
  /* Our Record: season and week blocks */
  .pk-rec-h{ margin:16px 0 8px; font-family:'Oswald',sans-serif; font-size:0.95rem; letter-spacing:0.03em; text-transform:uppercase; }
  .pk-rec-h:first-of-type{ margin-top:4px; }
  .pk-rec-h span{ font-family:Inter,sans-serif; font-size:0.74rem; font-weight:500; text-transform:none; letter-spacing:0; color:var(--text-muted); margin-left:6px; }
  /* ranker: "game saved, on to the next" banner */
  .rkg-note{ flex:1 1 100%; order:5; padding:8px 12px; border-radius:8px; background:color-mix(in srgb, var(--good) 14%, transparent); border:1px solid color-mix(in srgb, var(--good) 40%, transparent); color:var(--good); font-size:0.84rem; font-weight:600; }
  /* ranker: players ranked from other games stay in the tiers, dimmed, with their game tagged */
  .rkg-chip.rkg-other{ opacity:0.62; border-style:dashed; }
  .rkg-chip.rkg-other:hover, .rkg-chip.rkg-other.sel{ opacity:1; }
  .rkg-gtag{ position:absolute; top:-8px; right:10px; z-index:2; padding:1px 7px; border-radius:999px; background:var(--surface); border:1px solid var(--border); font-size:0.62rem; font-weight:700; letter-spacing:0.04em; color:var(--text-muted); }
  .rkg-pool-h{ row-gap:6px; }
  /* ---------- finished rankings list: 1 to N, one line per player, position rank on every row ---------- */
  .rkf-tabs button{ display:inline-flex; align-items:center; gap:6px; }
  .rkf-tabs button i{ font-style:normal; font-size:0.7rem; font-weight:700; padding:1px 6px; border-radius:999px; background:rgba(127,127,127,0.2); }
  .rkf-tabs button.active i{ background:rgba(0,0,0,0.25); }
  .rkf-head{ display:grid; grid-template-columns:76px minmax(0,1.7fr) minmax(0,1.3fr) 96px; gap:12px; padding:6px 14px 6px 19px; font-size:0.66rem; font-weight:700; letter-spacing:0.07em; text-transform:uppercase; color:var(--text-muted); }
  .rkf-row{ position:relative; display:grid; grid-template-columns:76px minmax(0,1.7fr) minmax(0,1.3fr) 96px; align-items:center; gap:12px; padding:9px 14px; margin-bottom:5px; background:var(--surface); border:1px solid var(--border); border-left:4px solid var(--c); border-radius:12px; }
  .rkf-row:hover{ border-color:color-mix(in srgb, var(--c) 55%, var(--border)); }
  .rkf-row[draggable="true"]{ cursor:grab; } .rkf-row.dragging{ opacity:0.35; } .rkf-row.over{ outline:2px dashed var(--accent); outline-offset:2px; }
  .rkf-n{ display:flex; flex-direction:column; align-items:center; gap:2px; }
  .rkf-n b{ font-family:'Oswald',sans-serif; font-size:1.7rem; line-height:1; color:var(--c); }
  .rkf-pr{ font-size:0.7rem; font-weight:800; letter-spacing:0.04em; padding:1px 8px; border-radius:999px; background:rgba(127,127,127,0.18); color:var(--text); }
  .rkf-sub{ font-size:0.66rem; font-weight:600; color:var(--text-muted); white-space:nowrap; }
  .rkf-pl{ display:flex; align-items:center; gap:10px; min-width:0; } .rkf-pl .rkc-hs{ width:44px; height:44px; flex:none; }
  .rkf-id{ min-width:0; } .rkf-name{ display:flex; align-items:center; flex-wrap:wrap; gap:6px; } .rkf-name b{ font-size:0.98rem; }
  .rkf-row .rkc-chips{ margin-top:4px; }
  .rkf-stats{ display:flex; align-items:center; flex-wrap:wrap; gap:6px 14px; }
  .rkf-st{ display:flex; flex-direction:column; line-height:1.15; } .rkf-st label{ font-size:0.6rem; font-weight:700; letter-spacing:0.06em; text-transform:uppercase; color:var(--text-muted); } .rkf-st b{ font-size:0.92rem; }
  .rkf-proj{ display:flex; flex-direction:column; align-items:flex-end; line-height:1.1; } .rkf-proj label{ font-size:0.6rem; font-weight:700; letter-spacing:0.06em; color:var(--text-muted); } .rkf-proj b{ font-family:'Oswald',sans-serif; font-size:1.55rem; color:var(--good); } .rkf-proj b.none{ color:var(--text-muted); font-size:1.1rem; } .rkf-proj small{ font-size:0.66rem; color:var(--text-muted); }
  .rkf-row .rkn-ctl{ position:absolute; right:12px; bottom:6px; opacity:0; transition:opacity .12s ease; } .rkf-row:hover .rkn-ctl{ opacity:1; }
  .rkf-row .rkc-x{ position:absolute; top:6px; right:8px; }
  @media (max-width:860px){
    .rkf-head{ display:none; }
    .rkf-row{ grid-template-columns:58px minmax(0,1fr) auto; grid-template-areas:'n pl proj' 'n st st'; gap:6px 10px; padding:9px 10px; }
    .rkf-n{ grid-area:n; } .rkf-pl{ grid-area:pl; } .rkf-proj{ grid-area:proj; } .rkf-stats{ grid-area:st; }
    .rkf-n b{ font-size:1.4rem; } .rkf-pl .rkc-hs{ width:38px; height:38px; }
    .rkf-row .rkn-ctl{ position:static; opacity:1; grid-column:1 / -1; }
  }
  /* visitors get the list without the owner's upload instructions */
  body:not(.owner-mode) #view-rankings .consumer-note + p.hint, body:not(.owner-mode) #rankings-roster-banner{ display:none; }
  /* public rankings: no owner-only notes, tighter rows on phones */
  body:not(.owner-mode) #view-rankings .consumer-note{ display:none; }
  @media (max-width:560px){
    .rkf-row{ grid-template-columns:50px minmax(0,1fr) auto; padding:8px 9px; gap:4px 8px; }
    .rkf-n b{ font-size:1.25rem; } .rkf-pr, .rkf-sub{ font-size:0.62rem; padding:0 6px; }
    .rkf-pl{ gap:8px; } .rkf-pl .rkc-hs{ width:34px; height:34px; }
    .rkf-name{ gap:4px; } .rkf-name b{ font-size:0.9rem; } .rkf-name .rkc-tm{ display:none; }
    .rkf-row .rkc-chips{ flex-wrap:nowrap; gap:4px; overflow:hidden; } .rkf-row .rkc-chips .rkc-chip:nth-child(n+3){ display:none; }
    .rkf-stats{ gap:2px 10px; } .rkf-st b{ font-size:0.82rem; } .rkf-st:nth-child(3), .rkf-stats .rkc-trend{ display:none; }
    .rkf-proj b{ font-size:1.25rem; }
    .rkn-bar{ flex-wrap:wrap; } .rkn-bar input[type=text]{ width:100%; }
  }
/* ---------- community: Discord + free-year giveaway ---------- */
#view-home .hero-eyebrow.giveaway-pill{ display:inline-block; text-decoration:none; margin-left:8px; background:rgba(255,194,51,0.14); border-color:rgba(255,194,51,0.6); color:#ffd166; font-weight:700; }
#view-home .hero-eyebrow.giveaway-pill:hover{ background:rgba(255,194,51,0.24); }
.community-card{ display:flex; align-items:center; gap:18px; flex-wrap:wrap; margin:0 0 16px; padding:16px 20px; border-radius:16px; border:1px solid rgba(255,194,51,0.55); background:linear-gradient(115deg, rgba(255,194,51,0.14), color-mix(in srgb, var(--accent) 8%, transparent) 60%, transparent), var(--surface, #121a25); box-shadow:0 8px 28px rgba(0,0,0,0.18); }
.community-card .cc-badge{ flex:none; font-family:'Oswald',sans-serif; letter-spacing:0.14em; font-size:0.9rem; color:#1a1300; background:#ffc233; border-radius:999px; padding:6px 16px; font-weight:700; }
.community-card .cc-main{ flex:1 1 280px; min-width:0; }
.community-card h3{ margin:0 0 3px; font-family:'Oswald',sans-serif; font-size:1.35rem; letter-spacing:0.02em; }
.community-card p{ margin:0; color:var(--text-muted); font-size:0.92rem; line-height:1.45; }
.community-card .cc-btn{ flex:none; display:inline-flex; align-items:center; gap:8px; text-decoration:none; white-space:nowrap; }
#tab-discord{ color:#7289ff; }
@media (max-width:640px){ .community-card{ padding:14px; gap:12px; } .community-card .cc-btn{ width:100%; justify-content:center; } #view-home .hero-eyebrow.giveaway-pill{ margin:6px 0 0; } }
/* ---------- brand v2 (2026-10-17): neon-green S emblem + stacked wordmark; page background matches the logo art ---------- */
html{ background:#060706; }
body{ background:transparent !important; }
body::before{ content:''; position:fixed; inset:0; z-index:-1; pointer-events:none;
  background:
    radial-gradient(1200px 700px at 0% 0%, rgba(30,130,16,0.42), transparent 68%),
    radial-gradient(1100px 650px at 100% 100%, rgba(22,100,12,0.32), transparent 70%),
    url('/assets/bg-tile.webp') 0 0 / 348px 348px repeat,
    #070807; }
.panel{ background-color:rgba(0,0,0,0.74); }

.foot-brand{ gap:14px !important; }
.foot-brand img{ height:58px !important; width:auto; opacity:1 !important; }
.foot-brand img.foot-emblem{ border-radius:50%; box-shadow:0 0 18px color-mix(in srgb, var(--accent) 35%, transparent); }
.about-hero img{ height:84px; width:auto; border-radius:50%; box-shadow:0 0 22px color-mix(in srgb, var(--accent) 35%, transparent); }
.tdr-st-brand img{ height:58px; width:auto; display:block; }
.sst-brand img{ height:42px; width:auto; display:block; }
.tall .sst-brand img{ height:54px; }
header.topbar .brand .brand-logo{ height:88px !important; filter:drop-shadow(0 0 14px color-mix(in srgb, var(--accent) 22%, transparent)); }
@media (max-width:640px){ header.topbar .brand .brand-logo{ height:60px !important; } }

.community-card .gw-line{ margin-top:4px; font-size:0.9rem; color:var(--text); } .community-card .gw-rules{ margin-top:6px; font-size:0.82rem; color:var(--text-muted); } .community-card .gw-rules summary{ cursor:pointer; color:#ffd166; } .community-card .gw-rules p{ margin:6px 0 0; }

/* ---------- big Membership section on the home page ---------- */
#view-home .mship{ position:relative; overflow:hidden; padding:34px 34px 22px; margin-bottom:20px; border:1px solid color-mix(in srgb, var(--accent) 55%, transparent); border-radius:20px;
  background:radial-gradient(900px 380px at 0% 0%, rgba(30,130,16,0.40), transparent 70%), radial-gradient(700px 320px at 100% 100%, rgba(255,194,51,0.10), transparent 70%), rgba(0,0,0,0.82); box-shadow:0 18px 60px rgba(0,0,0,0.55), 0 0 50px color-mix(in srgb, var(--accent) 10%, transparent); }
.mship-eyebrow{ display:inline-block; font-family:'Oswald',sans-serif; letter-spacing:0.22em; font-size:0.85rem; color:#04130a; background:var(--accent); border-radius:999px; padding:5px 16px; font-weight:700; }
#view-home .mship h2{ margin:14px 0 8px; font-family:'Oswald',sans-serif; font-size:clamp(2rem, 5vw, 3.5rem); line-height:1.05; text-transform:uppercase; letter-spacing:0.01em; }
#view-home .mship h2 span{ color:var(--accent); display:inline-block; }
.mship-head p{ margin:0 0 20px; max-width:62ch; color:var(--text-muted); font-size:1.05rem; line-height:1.5; }
.mship-grid{ display:grid; grid-template-columns:1.05fr 1fr; gap:22px; align-items:stretch; }
.mship-plans{ display:grid; gap:14px; }
.mship-plan{ position:relative; border:1px solid var(--border); border-radius:16px; padding:20px 22px 18px; background:rgba(13,17,13,0.9); display:flex; flex-direction:column; gap:6px; }
.mship-plan.main{ border-color:var(--accent); box-shadow:0 0 0 1px color-mix(in srgb, var(--accent) 50%, transparent), 0 10px 34px color-mix(in srgb, var(--accent) 14%, transparent); }
.mship-plan.best{ border-color:rgba(255,194,51,0.6); }
.mship-tag{ position:absolute; top:-12px; left:20px; font-family:'Oswald',sans-serif; letter-spacing:0.14em; font-size:0.78rem; font-weight:700; color:#04130a; background:var(--accent); border-radius:999px; padding:4px 14px; } .mship-tag.gold{ background:#ffc233; color:#1a1300; }
.mship-name{ font-family:'Oswald',sans-serif; font-size:1.05rem; letter-spacing:0.12em; text-transform:uppercase; color:var(--text-muted); margin-top:4px; }
.mship-price b{ font-family:'Oswald',sans-serif; font-size:3.4rem; line-height:1; } .mship-price span{ color:var(--text-muted); font-size:0.95rem; margin-left:8px; }
.mship-plan ul{ list-style:none; margin:4px 0 8px; padding:0; display:grid; gap:5px; font-size:0.95rem; } .mship-plan li{ position:relative; padding-left:24px; } .mship-plan li::before{ content:'✓'; position:absolute; left:0; color:var(--accent); font-weight:800; }
.mship-cta{ width:100%; padding:15px 18px; font-size:1.1rem; letter-spacing:0.02em; }
.mship-plan.main .mship-cta{ box-shadow:0 0 30px color-mix(in srgb, var(--accent) 45%, transparent); animation:mshipglow 2.6s ease-in-out infinite; }
@keyframes mshipglow{ 0%,100%{ box-shadow:0 0 18px color-mix(in srgb, var(--accent) 35%, transparent); } 50%{ box-shadow:0 0 38px color-mix(in srgb, var(--accent) 65%, transparent); } }
@media (prefers-reduced-motion:reduce){ .mship-plan.main .mship-cta{ animation:none; } }
.mship-compare{ border:1px solid var(--border); border-radius:16px; overflow:hidden; background:rgba(13,17,13,0.9); display:flex; flex-direction:column; }
.mc-row{ display:grid; grid-template-columns:1fr 112px 112px; gap:8px; align-items:center; padding:11px 16px; border-top:1px solid rgba(255,255,255,0.06); font-size:0.9rem; line-height:1.3; } .mc-row:first-child{ border-top:0; }
.mc-row span:not(:first-child){ text-align:center; color:var(--text-muted); } .mc-row span.on{ color:var(--accent); font-weight:800; } .mc-row span.no{ opacity:0.8; }
.mc-hd{ background:rgba(255,255,255,0.04); font-family:'Oswald',sans-serif; letter-spacing:0.14em; text-transform:uppercase; font-size:0.85rem; } .mc-hd span.on{ background:var(--accent); color:#04130a; border-radius:8px; padding:4px 0; }
.mship-fine{ margin:16px 0 0; font-size:0.78rem; color:var(--text-muted); text-align:center; }
@media (max-width:960px){ .mship-grid{ grid-template-columns:1fr; } #view-home .mship{ padding:26px 18px 18px; } .mship-price b{ font-size:2.8rem; } .mc-row{ grid-template-columns:1fr 84px 84px; padding:10px 12px; font-size:0.84rem; } }
.home-blog-pricing-row{ grid-template-columns:1fr !important; }
#tab-membership{ color:var(--accent) !important; font-weight:700; } #tab-membership::after{ content:'30 days free'; margin-left:8px; font-size:0.62rem; font-weight:800; letter-spacing:0.06em; text-transform:uppercase; color:#04130a; background:var(--accent); border-radius:999px; padding:2px 8px; vertical-align:middle; }
@media (max-width:640px){ #tab-membership::after{ display:none; } }
#view-home .home-hero .btn.gold-cta{ background:#ffc233; color:#1a1300; border-color:#ffc233; font-weight:700; }
  /* ---------- TD Research: Spread TD Rating ---------- */
  .tdr-wrap{ margin:4px 0 18px; }
  .tdr-loading{ padding:26px; text-align:center; color:var(--text-muted); border:1px dashed var(--border); border-radius:12px; }
  .tdr-top{ display:flex; justify-content:space-between; gap:18px; flex-wrap:wrap; margin-bottom:10px; }
  .tdr-top h3{ font-family:'Oswald',sans-serif; font-size:1.35rem; text-transform:uppercase; letter-spacing:0.02em; margin:0 0 4px; }
  .tdr-top h3 span{ font-family:Inter,sans-serif; font-size:0.72rem; font-weight:700; text-transform:uppercase; letter-spacing:0.06em; color:var(--accent); border:1px solid color-mix(in srgb, var(--accent) 45%, transparent); border-radius:999px; padding:2px 9px; margin-left:8px; vertical-align:middle; }
  .tdr-top p{ margin:0; max-width:640px; color:var(--text-muted); font-size:0.88rem; }
  .tdr-ctl{ display:flex; flex-direction:column; gap:8px; align-items:flex-end; }
  .tdr-ctl input{ width:200px; }
  .tdr-legend{ display:flex; flex-wrap:wrap; gap:14px; align-items:center; font-size:0.74rem; color:var(--text-muted); margin:6px 0 12px; }
  .tdr-legend i{ display:inline-block; width:10px; height:10px; border-radius:50%; margin-right:5px; } .tdr-legend i.g{ background:var(--good); } .tdr-legend i.y{ background:var(--warn); } .tdr-legend i.r{ background:var(--danger); }
  .tdr-stamp{ margin-left:auto; }
  .tdr-row{ border:1px solid var(--border); border-left:4px solid var(--border); border-radius:14px; background:var(--surface); margin-bottom:8px; overflow:hidden; transition:border-color .15s ease; }
  .tdr-row.open{ border-color:color-mix(in srgb, var(--accent) 55%, var(--border)); border-left-color:var(--accent); }
  .tdr-head{ display:grid; grid-template-columns:34px minmax(0,2.2fr) minmax(0,1.3fr) 76px 118px 22px; gap:12px; align-items:center; padding:10px 14px; cursor:pointer; }
  .tdr-head:hover{ background:rgba(127,127,127,0.06); }
  .tdr-rk{ font-family:'Oswald',sans-serif; font-size:1.2rem; color:var(--text-muted); text-align:center; }
  .tdr-pl{ display:flex; align-items:center; gap:10px; min-width:0; } .tdr-pl .rkc-hs{ width:46px; height:46px; flex:none; }
  .tdr-id{ min-width:0; } .tdr-name{ display:flex; align-items:center; flex-wrap:wrap; gap:6px; } .tdr-name b{ font-size:1rem; }
  .tdr-mini{ display:flex; gap:14px; } .tdr-mini div{ display:flex; flex-direction:column; line-height:1.15; } .tdr-mini label{ font-size:0.58rem; font-weight:700; letter-spacing:0.06em; text-transform:uppercase; color:var(--text-muted); } .tdr-mini b{ font-size:0.95rem; }
  .tdr-rate{ display:flex; flex-direction:column; align-items:center; gap:2px; } .tdr-rate span{ font-size:0.56rem; font-weight:800; letter-spacing:0.08em; text-transform:uppercase; color:var(--text-muted); }
  .tdr-prob{ display:flex; flex-direction:column; align-items:flex-end; line-height:1.15; text-align:right; } .tdr-prob b{ font-family:'Oswald',sans-serif; font-size:1.45rem; } .tdr-prob span{ font-size:0.6rem; font-weight:700; letter-spacing:0.05em; text-transform:uppercase; color:var(--text-muted); } .tdr-prob em{ font-style:normal; font-size:0.68rem; font-weight:700; color:var(--text-muted); white-space:nowrap; }
  .tdr-prob em.up, .tdr-defstats .up b, .tdr-st-prob em.up{ color:var(--good); } .tdr-prob em.dn, .tdr-defstats .dn b, .tdr-st-prob em.dn{ color:var(--danger); }
  .tdr-chev{ color:var(--text-muted); font-size:0.8rem; text-align:center; }
  /* gauge */
  .tdr-gauge{ position:relative; width:var(--s); height:var(--s); flex:none; }
  .tdr-gauge svg{ width:100%; height:100%; } .tdr-g-bg{ fill:none; stroke:rgba(127,127,127,0.22); stroke-width:10; } .tdr-g-fg{ fill:none; stroke:var(--c); stroke-width:10; stroke-linecap:round; }
  .tdr-gauge b{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center; font-family:'Oswald',sans-serif; font-size:calc(var(--s) * 0.38); color:var(--c); }
  .tdr-gauge i{ position:absolute; left:0; right:0; bottom:-2px; text-align:center; font-style:normal; font-size:calc(var(--s) * 0.075); font-weight:800; letter-spacing:0.1em; color:var(--text-muted); }
  /* expanded body */
  .tdr-body{ padding:6px 14px 14px; border-top:1px solid var(--border); background:color-mix(in srgb, var(--surface-2) 70%, var(--surface)); }
  .tdr-grid-body{ display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:12px; margin-top:10px; }
  .tdr-panel{ background:var(--surface); border:1px solid var(--border); border-radius:12px; padding:12px 14px; min-width:0; }
  .tdr-panel.tdr-wide{ grid-column:1 / -1; }
  .tdr-panel h5{ margin:0 0 8px; font-family:'Oswald',sans-serif; font-size:0.92rem; letter-spacing:0.03em; text-transform:uppercase; display:flex; flex-wrap:wrap; align-items:center; gap:6px; }
  .tdr-panel h5 small{ font-family:Inter,sans-serif; font-size:0.68rem; font-weight:500; text-transform:none; letter-spacing:0; color:var(--text-muted); }
  /* component bars */
  .tdr-bars{ display:flex; flex-direction:column; gap:7px; }
  .tdr-bar{ display:grid; grid-template-columns:minmax(0,1.5fr) minmax(0,1.6fr) 54px; gap:12px; align-items:center; }
  .tdr-bar-l{ display:flex; flex-direction:column; min-width:0; } .tdr-bar-l b{ font-size:0.84rem; } .tdr-bar-l span{ font-size:0.68rem; color:var(--text-muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .tdr-bar-t{ position:relative; height:14px; background:rgba(127,127,127,0.14); border-radius:7px; }
  .tdr-bar-t .mid{ position:absolute; left:50%; top:-3px; bottom:-3px; width:2px; background:var(--text-muted); opacity:.7; }
  .tdr-bar-t .fill{ position:absolute; top:0; bottom:0; border-radius:7px; } .tdr-bar-t .fill.up{ background:var(--good); } .tdr-bar-t .fill.dn{ background:var(--danger); }
  .tdr-bar-v{ font-family:'Oswald',sans-serif; font-size:1.05rem; text-align:right; } .tdr-bar-v small{ font-family:Inter,sans-serif; font-size:0.6rem; color:var(--text-muted); margin-left:4px; } .tdr-bar-v.up{ color:var(--good); } .tdr-bar-v.dn{ color:var(--danger); }
  .tdr-bar-note{ font-size:0.68rem; color:var(--text-muted); margin-top:2px; }
  .tdr-why{ list-style:none; margin:10px 0 0; padding:0; display:flex; flex-direction:column; gap:5px; font-size:0.8rem; }
  .tdr-why li{ padding:6px 10px; border-radius:8px; border-left:3px solid var(--text-muted); background:rgba(127,127,127,0.08); } .tdr-why li.up{ border-left-color:var(--good); } .tdr-why li.dn{ border-left-color:var(--danger); }
  /* target map */
  .tdr-map{ width:100%; height:auto; max-height:340px; display:block; }
  .tdr-map-v{ font-family:'Oswald',sans-serif; font-size:17px; fill:var(--text); } .tdr-map-v.hi{ fill:#fff; }
  .tdr-map-ax, .tdr-ax{ font-size:10.5px; fill:var(--text-muted); } .tdr-map-leg{ font-size:9.5px; fill:var(--text-muted); }
  .tdr-grid{ stroke:var(--border); stroke-dasharray:3 3; } .tdr-avg{ stroke:var(--accent); stroke-width:1.6; stroke-dasharray:5 3; }
  .tdr-rzs{ width:100%; height:auto; display:block; }
  /* routes */
  .tdr-rt{ display:grid; grid-template-columns:108px minmax(0,1fr) 40px auto; gap:8px; align-items:center; margin:5px 0; font-size:0.8rem; }
  .tdr-rt > div{ height:12px; background:rgba(127,127,127,0.14); border-radius:6px; overflow:hidden; } .tdr-rt i{ display:block; height:100%; border-radius:6px; }
  .tdr-rt b{ text-align:right; } .tdr-rt em{ font-style:normal; font-size:0.68rem; color:var(--text-muted); white-space:nowrap; }
  /* defense */
  .tdr-mz{ display:grid; grid-template-columns:auto 1fr auto; gap:8px; align-items:center; font-size:0.78rem; font-weight:700; margin-bottom:8px; }
  .tdr-mz > div{ height:14px; border-radius:7px; background:color-mix(in srgb, var(--accent) 38%, rgba(127,127,127,0.2)); overflow:hidden; } .tdr-mz i{ display:block; height:100%; background:var(--warn); }
  .tdr-shells{ display:grid; grid-template-columns:repeat(4, 1fr); gap:6px; margin-bottom:8px; } .tdr-shells div{ background:rgba(127,127,127,0.1); border-radius:8px; padding:6px 4px; text-align:center; display:flex; flex-direction:column; } .tdr-shells b{ font-family:'Oswald',sans-serif; font-size:1.05rem; } .tdr-shells span{ font-size:0.62rem; color:var(--text-muted); }
  .tdr-defstats{ display:grid; grid-template-columns:repeat(3, 1fr); gap:8px; } .tdr-defstats div{ background:rgba(127,127,127,0.1); border-radius:8px; padding:8px; display:flex; flex-direction:column; } .tdr-defstats b{ font-family:'Oswald',sans-serif; font-size:1.2rem; } .tdr-defstats span{ font-size:0.62rem; color:var(--text-muted); line-height:1.25; }
  .tdr-foot{ font-size:0.66rem; color:var(--text-muted); margin:6px 0 0; }
  .tdr-tiles{ display:grid; grid-template-columns:repeat(6, minmax(0,1fr)); gap:8px; } .tdr-tiles div{ background:rgba(127,127,127,0.1); border-radius:10px; padding:9px 10px; display:flex; flex-direction:column; } .tdr-tiles label{ font-size:0.6rem; font-weight:700; letter-spacing:0.06em; text-transform:uppercase; color:var(--text-muted); } .tdr-tiles b{ font-family:'Oswald',sans-serif; font-size:1.3rem; } .tdr-tiles small{ font-size:0.62rem; color:var(--text-muted); }
  .tdr-actions{ display:flex; flex-wrap:wrap; gap:8px; margin-top:12px; }
  details.tdr-old{ margin-top:14px; border:1px solid var(--border); border-radius:12px; padding:0 14px; } details.tdr-old > summary{ cursor:pointer; padding:12px 0; font-family:'Oswald',sans-serif; text-transform:uppercase; letter-spacing:0.03em; font-size:0.88rem; }
  @media (max-width:900px){
    .tdr-head{ grid-template-columns:28px minmax(0,1fr) 62px 22px; grid-template-areas:'rk pl rate chev' '. mini prob prob'; gap:6px 10px; padding:9px 10px; }
    .tdr-rk{ grid-area:rk; } .tdr-pl{ grid-area:pl; } .tdr-rate{ grid-area:rate; } .tdr-chev{ grid-area:chev; } .tdr-mini{ grid-area:mini; } .tdr-prob{ grid-area:prob; }
    .tdr-grid-body{ grid-template-columns:1fr; } .tdr-tiles{ grid-template-columns:repeat(3, 1fr); } .tdr-bar{ grid-template-columns:minmax(0,1fr) 54px; } .tdr-bar-t{ grid-column:1 / 2; } .tdr-bar-l{ grid-column:1 / -1; } .tdr-stamp{ margin-left:0; }
    .tdr-ctl{ align-items:stretch; width:100%; } .tdr-ctl input{ width:100%; }
  }

  /* ---------- video mode: a 1280x720 stage (exports at 1920x1080, records to WebM) ---------- */
  .tdr-stage-wrap{ display:none; position:fixed; inset:0; z-index:9999; background:radial-gradient(1200px 700px at 50% 0%, #0d1520, #05070a); flex-direction:column; align-items:center; overflow:hidden; } .tdr-stage-wrap.show{ display:flex; }
  body.tdr-staging{ overflow:hidden; }
  .tdr-stage-bar{ position:relative; display:flex; gap:14px; align-items:center; padding:10px 16px; width:100%; justify-content:center; flex-wrap:wrap; background:rgba(8,12,18,0.92); border-bottom:1px solid #1e2630; backdrop-filter:blur(6px); }
  .tdr-sb-g{ display:flex; gap:6px; align-items:center; } .tdr-sb-g span{ color:#9aa7b4; font-size:0.82rem; min-width:48px; text-align:center; font-weight:600; }
  .tdr-stage-bar button, .tdr-stage-bar select{ background:#141b25; color:#e8eef5; border:1px solid #2a3544; border-radius:999px; padding:7px 15px; font-weight:700; font-size:0.82rem; cursor:pointer; font-family:Inter,sans-serif; transition:border-color .12s ease, color .12s ease, background .12s ease; }
  .tdr-stage-bar button:hover:not(:disabled), .tdr-stage-bar button.on{ border-color:var(--accent); color:var(--accent); } .tdr-stage-bar button:disabled{ opacity:.55; cursor:default; }
  .tdr-stage-bar button.on[data-tdrs="star"]{ color:#ffc233; border-color:#ffc233; background:rgba(255,194,51,0.1); }
  .tdr-sb-out button[data-tdrs="video"]{ background:var(--accent); color:#04130a; border-color:var(--accent); } .tdr-sb-out button[data-tdrs="video"]:disabled{ background:#1b3a26; color:#9ee8b4; }
  .tdr-sb-dots{ display:flex; gap:6px; } .tdr-sb-dots i{ width:9px; height:9px; border-radius:50%; background:#2a3544; cursor:pointer; } .tdr-sb-dots i.on{ background:var(--accent); transform:scale(1.25); }
  .tdr-sb-x{ margin-left:auto; } .tdr-sb-prog{ position:absolute; left:0; right:0; bottom:-1px; height:3px; background:transparent; } .tdr-sb-prog i{ display:block; height:100%; background:var(--accent); animation:tdrProg 8s linear forwards; }
  @keyframes tdrProg{ from{ width:0 } to{ width:100% } }
  .tdr-stage-fit{ width:1280px; height:720px; transform-origin:top center; flex:none; margin-top:8px; }
  .tdr-stage{ position:relative; width:1280px; height:720px; box-sizing:border-box; padding:22px 32px 18px; display:flex; flex-direction:column; color:#f2f6fb; font-family:Inter,sans-serif; overflow:hidden; border-radius:14px; background:#0a0e14;
    --text:#f2f6fb; --text-muted:#93a4b6; --border:#2a3646; --surface:#121a25; --good:#18e255; --danger:#ff5d5d; --warn:#ffc233; --accent:#18e255; }
  .tdr-st-bg{ position:absolute; inset:0; background:
      linear-gradient(115deg, color-mix(in srgb, var(--ta) 52%, #0a0e14) 0%, rgba(10,14,20,0.2) 38%, rgba(10,14,20,0.2) 62%, color-mix(in srgb, var(--tb) 40%, #0a0e14) 100%),
      radial-gradient(900px 420px at 50% 110%, color-mix(in srgb, var(--accent) 14%, transparent), transparent 70%),
      repeating-linear-gradient(90deg, rgba(255,255,255,0.025) 0 1px, transparent 1px 64px); }
  .tdr-st-logo{ position:absolute; right:-70px; top:40px; width:560px; height:560px; object-fit:contain; opacity:0.07; filter:grayscale(0.2); pointer-events:none; }
  .tdr-stage > *:not(.tdr-st-bg):not(.tdr-st-logo){ position:relative; z-index:1; }
  .tdr-st-head{ display:flex; justify-content:space-between; align-items:center; margin-bottom:10px; }
  .tdr-st-brand{ font-family:'Oswald',sans-serif; font-size:27px; letter-spacing:0.05em; } .tdr-st-brand span{ color:var(--accent); }
  .tdr-st-wk{ font-family:'Oswald',sans-serif; font-size:18px; letter-spacing:0.16em; color:#b6c3d1; }
  .tdr-st-count{ font-family:'Oswald',sans-serif; font-size:24px; background:rgba(0,0,0,0.35); border:1px solid #2a3646; border-radius:999px; padding:2px 16px; } .tdr-st-count small{ color:#8fa0b2; font-size:15px; }
  .tdr-st-main{ flex:1; display:grid; grid-template-columns:340px 1fr 392px; gap:24px; min-height:0; }
  .tdr-st-l{ display:flex; flex-direction:column; align-items:center; text-align:center; }
  .tdr-st-rank{ font-family:'Oswald',sans-serif; font-size:14px; letter-spacing:0.14em; color:var(--accent); background:color-mix(in srgb, var(--accent) 10%, transparent); border:1px solid color-mix(in srgb, var(--accent) 45%, transparent); border-radius:999px; padding:3px 14px; margin-bottom:10px; }
  .tdr-st-hs{ width:156px; height:156px; border-radius:50%; overflow:hidden; background:#1a2330; border:4px solid var(--accent); box-shadow:0 0 0 6px color-mix(in srgb, var(--accent) 12%, transparent), 0 12px 40px rgba(0,0,0,0.5); } .tdr-st-hs img{ width:100%; height:100%; object-fit:cover; }
  .tdr-st-l h2{ font-family:'Oswald',sans-serif; font-size:40px; text-transform:uppercase; margin:12px 0 2px; line-height:1.02; text-shadow:0 3px 18px rgba(0,0,0,0.55); }
  .tdr-st-sub{ font-size:19px; color:#c6d2de; display:flex; align-items:center; gap:8px; } .tdr-st-sub b{ color:#fff; }
  .tdr-st-gauge{ margin-top:14px; } .tdr-st-gauge .tdr-gauge b{ text-shadow:0 2px 14px rgba(0,0,0,0.5); }
  .tdr-st-prob{ margin-top:14px; display:flex; flex-direction:column; align-items:center; line-height:1.1; } .tdr-st-prob b{ font-family:'Oswald',sans-serif; font-size:50px; color:#fff; } .tdr-st-prob span{ font-size:12px; letter-spacing:0.14em; font-weight:700; color:#8fa0b2; }
  .tdr-st-prob em{ font-style:normal; margin-top:6px; font-size:14px; font-weight:800; letter-spacing:0.06em; padding:3px 12px; border-radius:999px; background:rgba(255,255,255,0.08); color:#c6d2de; } .tdr-st-prob em.up{ background:color-mix(in srgb, var(--accent) 16%, transparent); color:var(--accent); } .tdr-st-prob em.dn{ background:rgba(255,93,93,0.16); color:#ff7b7b; }
  .tdr-st-m{ display:flex; flex-direction:column; min-width:0; }
  .tdr-st-mapwrap{ flex:1; min-height:0; } .tdr-st-mapwrap .tdr-panel{ height:100%; background:rgba(12,18,27,0.78); border-color:#2a3646; display:flex; flex-direction:column; } .tdr-st-mapwrap .tdr-panel h5{ font-size:16px; } .tdr-st-mapwrap .tdr-panel h5 small{ display:none; }
  .tdr-st-mapwrap .tdr-map{ flex:1; min-height:0; max-height:none; } .tdr-st-mapwrap .tdr-map-v{ font-size:22px; } .tdr-st-mapwrap .tdr-map-ax{ font-size:12.5px; } .tdr-st-mapwrap .tdr-map-leg{ font-size:11px; }
  .tdr-st-chips{ display:grid; grid-template-columns:repeat(5, 1fr); gap:8px; margin-top:10px; } .tdr-st-chips div{ background:rgba(12,18,27,0.85); border:1px solid #2a3646; border-radius:12px; padding:8px 4px; text-align:center; display:flex; flex-direction:column; } .tdr-st-chips label{ font-size:11px; font-weight:700; letter-spacing:0.08em; text-transform:uppercase; color:#8fa0b2; } .tdr-st-chips b{ font-family:'Oswald',sans-serif; font-size:27px; } .tdr-st-chips small{ font-size:10px; color:#8fa0b2; margin-top:-3px; }
  .tdr-st-r{ background:rgba(12,18,27,0.78); border:1px solid #2a3646; border-radius:14px; padding:12px 16px; display:flex; flex-direction:column; justify-content:center; }
  .tdr-st-rt{ font-family:'Oswald',sans-serif; font-size:16px; letter-spacing:0.14em; color:#8fa0b2; margin-bottom:8px; }
  .tdr-st-r .tdr-bars{ gap:11px; } .tdr-st-r .tdr-bar{ grid-template-columns:152px minmax(0,1fr) 56px; gap:10px; } .tdr-st-r .tdr-bar-l span{ display:none; } .tdr-st-r .tdr-bar-l b{ font-size:14.5px; line-height:1.15; } .tdr-st-r .tdr-bar-t{ height:19px; border-radius:10px; } .tdr-st-r .tdr-bar-t .fill{ border-radius:10px; } .tdr-st-r .tdr-bar-v{ font-size:23px; }
  .tdr-st-foot{ display:flex; justify-content:space-between; gap:16px; align-items:center; font-size:14.5px; color:#c6d2de; padding-top:10px; margin-top:10px; border-top:1px solid #243040; } .tdr-st-foot b{ color:#fff; margin-right:4px; } .tdr-st-url{ font-family:'Oswald',sans-serif; letter-spacing:0.08em; color:var(--accent); font-size:17px; }
  /* entrance animation when a slide is drawn (switched off for image / video capture) */
  .tdr-stage.anim .tdr-st-l, .tdr-stage.anim .tdr-st-m, .tdr-stage.anim .tdr-st-r, .tdr-stage.anim .tdr-st-foot{ animation:tdrUp .55s cubic-bezier(.16,.84,.44,1) both; }
  .tdr-stage.anim .tdr-st-m{ animation-delay:.08s; } .tdr-stage.anim .tdr-st-r{ animation-delay:.16s; } .tdr-stage.anim .tdr-st-foot{ animation-delay:.28s; }
  .tdr-stage.anim .tdr-bar-t .fill{ animation:tdrGrow .8s cubic-bezier(.16,.84,.44,1) both; animation-delay:var(--d, .2s); }
  .tdr-stage.anim .tdr-g-fg{ animation:tdrSweep 1.1s cubic-bezier(.16,.84,.44,1) both .15s; }
  @keyframes tdrUp{ from{ opacity:0; transform:translateY(16px) } to{ opacity:1; transform:none } }
  @keyframes tdrGrow{ from{ width:0 } to{ width:var(--w) } }
  @keyframes tdrSweep{ from{ stroke-dashoffset:var(--len) } to{ stroke-dashoffset:var(--off) } }
  .tdr-stage.still *{ animation:none !important; transition:none !important; }
  /* the page's own position filter + search belong to the old raw tables (now folded away); the rated list has its own */
  #view-tdmatchup > .panel > .row{ display:none; }
  .tdr-gauge i{ bottom:19%; }

  /* stars, tracking tiles, route tags, data-source line */
  .tdr-rk{ display:flex; flex-direction:column; align-items:center; gap:2px; } .tdr-rk span{ font-family:'Oswald',sans-serif; font-size:1.05rem; color:var(--text-muted); line-height:1; }
  .tdr-star{ background:transparent; border:0; cursor:pointer; font-size:1.25rem; line-height:1; color:var(--text-muted); padding:2px; transition:transform .12s ease, color .12s ease; } .tdr-star:hover{ color:#ffc233; transform:scale(1.18); } .tdr-star.on{ color:#ffc233; }
  .tdr-row.starred{ border-left-color:#ffc233; }
  .tdr-seg button i{ font-style:normal; font-size:0.7rem; font-weight:800; padding:1px 7px; border-radius:999px; background:rgba(255,194,51,0.18); color:#ffc233; margin-left:4px; }
  .tdr-src{ display:flex; flex-wrap:wrap; gap:6px 10px; margin-top:12px; font-size:0.68rem; color:var(--text-muted); } .tdr-src span{ padding:2px 10px; border-radius:999px; border:1px solid var(--border); } .tdr-src span.old{ border-style:dashed; }
  .tdr-trk{ grid-template-columns:repeat(5, minmax(0,1fr)); } .tdr-trk .up b{ color:var(--good); } .tdr-trk .dn b{ color:var(--danger); }
  .tdr-sep{ margin-top:10px; } .tdr-sep > span{ font-size:0.7rem; color:var(--text-muted); } .tdr-sepsvg{ width:100%; max-width:420px; height:auto; display:block; }
  .tdr-rt{ grid-template-columns:108px minmax(0,1fr) 40px auto 44px; } .tdr-rt u{ text-decoration:none; font-size:0.66rem; font-weight:800; text-transform:uppercase; letter-spacing:0.05em; padding:1px 7px; border-radius:999px; text-align:center; background:rgba(127,127,127,0.16); color:var(--text-muted); } .tdr-rt u.up{ background:color-mix(in srgb, var(--good) 20%, transparent); color:var(--good); } .tdr-rt u.dn{ background:color-mix(in srgb, var(--danger) 20%, transparent); color:var(--danger); }
  .tdr-defstats.tdr-two{ grid-template-columns:repeat(2, 1fr); margin-top:8px; }
  @media (max-width:900px){ .tdr-trk{ grid-template-columns:repeat(2, minmax(0,1fr)); } .tdr-rt{ grid-template-columns:92px minmax(0,1fr) 36px 44px; } .tdr-rt em{ display:none; } }
  /* football-field target map */
  .tdr-field{ width:100%; height:auto; max-height:560px; display:block; }
  .tdr-fld-n{ font-size:9.5px; font-weight:700; fill:#9fb7a6; } .tdr-fld-n.los{ fill:#ffd23f; font-size:10px; }
  .tdr-fld-pct{ font-family:'Oswald',sans-serif; font-size:13px; fill:#fff; }
  .tdr-fld-adot{ font-size:9.5px; font-weight:800; fill:#0a2a13; }
  .tdr-fld-td{ font-size:6.2px; font-weight:900; fill:#3a2500; }
  .tdr-fieldpanel .tdr-map-leg{ fill:var(--text-muted); font-size:9.5px; }
  .tdr-st-m{ overflow:hidden; display:grid; grid-template-columns:minmax(0,1fr) 128px; grid-template-rows:minmax(0,1fr); gap:12px; min-height:0; } .tdr-st-mapwrap{ height:100%; min-height:0; }
  .tdr-st-chips{ grid-template-columns:1fr; margin-top:0; gap:8px; align-content:stretch; } .tdr-st-chips div{ justify-content:center; } .tdr-st-chips b{ font-size:30px; }
  .tdr-st-mapwrap{ overflow:hidden; } .tdr-st-mapwrap .tdr-fieldpanel{ overflow:hidden; }
  .tdr-st-mapwrap .tdr-field{ flex:1 1 0; min-height:0; height:0; width:100%; max-height:none; } .tdr-st-mapwrap .tdr-fieldpanel{ padding:8px 12px; } .tdr-st-mapwrap .tdr-fld-n{ font-size:11px; } .tdr-st-mapwrap .tdr-fld-pct{ font-size:15px; }
/* ---------- readability pass ---------- */
.tdr-legend i.l{ background:#9bd65a; }
.tdr-colhead{ display:grid; grid-template-columns:34px minmax(0,2.2fr) minmax(0,1.3fr) 76px 118px 22px; gap:12px; padding:0 14px 6px 18px; font-size:0.64rem; font-weight:800; letter-spacing:0.08em; text-transform:uppercase; color:var(--text-muted); }
.tdr-colhead span:nth-child(4){ text-align:center; } .tdr-colhead span:nth-child(5){ text-align:right; }
.tdr-word{ font-size:0.62rem !important; letter-spacing:0.1em; }
.tdr-name b{ font-size:1.02rem; }
.tdr-mini label{ font-size:0.62rem !important; } .tdr-mini b{ font-size:1.02rem !important; }
.tdr-prob b{ font-size:1.6rem !important; } .tdr-prob em{ font-size:0.72rem !important; font-style:normal; font-weight:600; }
.tdr-row{ box-shadow:0 1px 0 rgba(255,255,255,0.03); } .tdr-row:hover{ border-color:color-mix(in srgb, var(--accent) 35%, var(--border)); }
.tdr-panel{ border-radius:14px; } .tdr-panel h5{ font-size:0.8rem; letter-spacing:0.06em; } .tdr-panel h5 small{ display:block; margin-top:3px; font-size:0.72rem; font-weight:400; text-transform:none; letter-spacing:0; }
.tdr-bar-l b{ font-size:0.86rem; } .tdr-bar-l span{ font-size:0.74rem; }
.tdr-bar-t{ height:12px !important; border-radius:7px !important; } .tdr-bar-t .fill{ border-radius:7px !important; }
@media (max-width:900px){ .tdr-colhead{ display:none; } }
/* ---------- field map redesign ---------- */
.tdr-fieldgrid{ display:grid; grid-template-columns:minmax(300px, 460px) minmax(0, 1fr); gap:22px; align-items:start; }
.tdr-fieldsvg .tdr-field{ width:100%; height:auto; display:block; background:none; padding:0; }
.tdr-zpct{ fill:#fff; font-family:'Oswald',sans-serif; font-weight:700; paint-order:stroke; stroke:rgba(0,0,0,0.5); stroke-width:3px; }
.tdr-zname{ fill:var(--text); font-family:'Oswald',sans-serif; font-size:13px; font-weight:700; letter-spacing:0.06em; } .tdr-zsub{ fill:var(--text-muted); font-size:11px; }
.tdr-fld-n.big{ fill:var(--text-muted); font-size:13px; font-weight:700; } .tdr-fld-n.los{ fill:#ffd23f; font-size:11px; font-weight:800; letter-spacing:0.05em; }
.tdr-fld-td{ font-size:9.5px; font-weight:800; fill:#2b1d00; } .tdr-fld-adot{ font-size:12px; font-weight:800; fill:#0b3a1a; }
.tdr-depth h6{ margin:0 0 8px; font-size:0.78rem; letter-spacing:0.08em; text-transform:uppercase; color:var(--text-muted); }
.tdr-dz{ display:grid; grid-template-columns:96px minmax(60px, 1fr) 58px 76px; align-items:center; gap:10px; padding:9px 0; border-top:1px solid var(--border); }
.tdr-dzh b{ display:block; font-family:'Oswald',sans-serif; letter-spacing:0.05em; font-size:0.9rem; } .tdr-dzh span, .tdr-dzn small, .tdr-dzc small{ display:block; font-size:0.68rem; color:var(--text-muted); }
.tdr-dzb{ height:12px; border-radius:7px; background:var(--surface-2); overflow:hidden; } .tdr-dzb i{ display:block; height:100%; border-radius:7px; background:linear-gradient(90deg, #2fbf71, #6fd79a); }
.tdr-dzn, .tdr-dzc{ text-align:right; } .tdr-dzn b, .tdr-dzc b{ font-size:1.05rem; font-variant-numeric:tabular-nums; } .tdr-dzc.up b{ color:var(--good); } .tdr-dzc.dn b{ color:var(--danger); }
.tdr-take{ margin-top:12px; padding:12px 14px; border-radius:12px; background:var(--surface-2); font-size:0.84rem; line-height:1.55; } .tdr-take p{ margin:0 0 6px; } .tdr-take p:last-child{ margin:0; }
.tdr-fkey{ display:flex; flex-wrap:wrap; align-items:center; gap:6px 16px; margin-top:12px; font-size:0.78rem; color:var(--text-muted); }
.tdr-fkey i{ display:inline-flex; align-items:center; justify-content:center; width:18px; height:18px; border-radius:50%; margin-right:6px; font-style:normal; font-size:0.62rem; font-weight:800; vertical-align:-4px; }
.tdr-fkey i.c{ background:#fff; border:1.5px solid #0b3a1a; } .tdr-fkey i.x{ color:#ff8f8f; font-size:0.9rem; } .tdr-fkey i.t{ background:#ffc233; color:#2b1d00; width:22px; height:22px; border:2px solid #fff; }
.tdr-fkey i.soft, .tdr-fkey i.tough{ border-radius:4px; width:16px; height:12px; background:none; } .tdr-fkey i.soft{ border:2px dashed #ffe14d; } .tdr-fkey i.tough{ border:2px solid #ff6b6b; }
.tdr-fkey .note{ flex:1 1 100%; font-size:0.72rem; }
@media (max-width:900px){ .tdr-fieldgrid{ grid-template-columns:1fr; } .tdr-dz{ grid-template-columns:84px minmax(50px, 1fr) 52px 70px; gap:8px; } }.tdr-st-mapwrap .tdr-fieldgrid{ display:flex; flex:1 1 0; min-height:0; } .tdr-st-mapwrap .tdr-depth, .tdr-st-mapwrap .tdr-fkey{ display:none; }
.tdr-st-mapwrap .tdr-fieldsvg{ flex:1; min-height:0; display:flex; justify-content:center; } .tdr-st-mapwrap .tdr-fieldsvg .tdr-field{ height:100% !important; width:auto !important; max-width:100%; flex:none; }.tdr-fieldgrid{ grid-template-columns:minmax(300px, 44%) minmax(0, 1fr) !important; }
.tdr-sepsvg, .tdr-rzs{ max-width:520px; margin:0 auto; display:block; }
@media (max-width:900px){ .tdr-fieldgrid{ grid-template-columns:1fr !important; } .tdr-fieldsvg{ max-width:440px; margin:0 auto; } }@media (max-width:520px){ .tdr-dz{ grid-template-columns:78px 1fr 1fr !important; } .tdr-dzb{ display:none; } .tdr-dzn, .tdr-dzc{ text-align:right; } }
/* ---------- TD Research: run game (running backs + quarterbacks) ---------- */
.tdr-fld-adot2{ font-size:10.5px; font-weight:800; fill:#fff; paint-order:stroke; stroke:rgba(0,0,0,0.65); stroke-width:3px; }
.tdr-fld-n{ fill:#cfe5d6; }
.tdr-runfield .tdr-zname{ font-size:12px; } .tdr-runfield .tdr-zsub{ font-size:10px; }
.tdr-fkey i.g{ background:#fff; border:2.5px solid #2fe08a; width:22px; height:22px; font-size:0.5rem; color:#0b3a1a; }
.tdr-lz{ display:grid; grid-template-columns:62px minmax(34px, 1fr) 56px 74px 84px; align-items:center; gap:8px; padding:8px 0; border-top:1px solid var(--border); }
.tdr-lz.tdr-lzh{ border-top:0; padding:0 0 4px; font-size:0.6rem; font-weight:700; letter-spacing:0.06em; text-transform:uppercase; color:var(--text-muted); }
.tdr-lz.tdr-lzh span:nth-child(n+3){ text-align:right; }
.tdr-dza{ text-align:right; } .tdr-dza b{ display:block; font-size:1.02rem; font-variant-numeric:tabular-nums; } .tdr-dza small{ display:block; font-size:0.62rem; color:var(--text-muted); text-transform:uppercase; letter-spacing:0.05em; font-weight:700; }
.tdr-dza.soft b, .tdr-dza.soft small{ color:var(--good); } .tdr-dza.tough b, .tdr-dza.tough small{ color:var(--danger); }
.tdr-runtiles{ grid-template-columns:repeat(5, minmax(0,1fr)); }
.tdr-runtiles div.up b{ color:var(--good); } .tdr-runtiles div.dn b{ color:var(--danger); }
.tdr-runstats{ grid-template-columns:repeat(4, minmax(0,1fr)); } .tdr-runstats div{ min-width:0; } .tdr-runstats b{ font-size:1.25rem; } .tdr-runstats small, .tdr-runsit small{ font-size:0.62rem; color:var(--text-muted); line-height:1.25; margin-top:2px; }
.tdr-runsit{ grid-template-columns:repeat(4, minmax(0,1fr)); margin-top:10px; } .tdr-runsit b{ font-size:1.15rem; } .tdr-runsit .up b{ color:var(--good); } .tdr-runsit .dn b{ color:var(--danger); }
.tdr-lanestrip{ margin:14px 0 4px; padding:12px 12px 10px; border-radius:12px; background:var(--surface-2); }
.tdr-ls-h{ font-size:0.74rem; font-weight:700; letter-spacing:0.04em; text-transform:uppercase; margin-bottom:8px; } .tdr-ls-h small{ font-weight:400; text-transform:none; letter-spacing:0; color:var(--text-muted); margin-left:6px; }
.tdr-ls-row{ display:grid; grid-template-columns:repeat(7, minmax(0,1fr)); gap:6px; }
.tdr-ls{ display:flex; flex-direction:column; align-items:center; gap:2px; padding:6px 2px 7px; border-radius:10px; border:2px solid transparent; text-align:center; }
.tdr-ls.used{ border-color:rgba(255,255,255,0.55); } .tdr-ls.soft.used{ border-color:#ffe14d; } .tdr-ls.tough.used{ border-color:#ff6b6b; }
.tdr-ls-v{ font-size:0.74rem; font-weight:800; font-variant-numeric:tabular-nums; } .tdr-ls.soft .tdr-ls-v{ color:var(--good); } .tdr-ls.tough .tdr-ls-v{ color:var(--danger); }
.tdr-ls-b{ position:relative; width:100%; max-width:34px; height:78px; background:rgba(127,127,127,0.12); border-radius:6px; overflow:hidden; }
.tdr-ls-b u{ position:absolute; left:0; right:0; top:50%; height:1px; background:rgba(127,127,127,0.55); }
.tdr-ls-b i{ position:absolute; left:15%; right:15%; border-radius:3px; } .tdr-ls-b i.up{ background:var(--good); } .tdr-ls-b i.dn{ background:var(--danger); }
.tdr-ls b{ font-family:'Oswald',sans-serif; font-size:0.85rem; letter-spacing:0.05em; } .tdr-ls small{ font-size:0.62rem; color:var(--text-muted); } .tdr-ls em{ font-style:normal; font-size:0.58rem; color:var(--text-muted); line-height:1.15; }
@media (max-width:900px){ .tdr-runtiles{ grid-template-columns:repeat(3, minmax(0,1fr)); } .tdr-runstats{ grid-template-columns:repeat(2, minmax(0,1fr)); } .tdr-lz{ grid-template-columns:54px minmax(28px, 1fr) 52px 66px 74px; gap:6px; } }
@media (max-width:520px){ .tdr-runtiles{ grid-template-columns:repeat(2, minmax(0,1fr)); } .tdr-runsit{ grid-template-columns:repeat(2, minmax(0,1fr)); } .tdr-ls-row{ gap:3px; } .tdr-ls em{ display:none; } .tdr-ls-b{ height:62px; } .tdr-lz{ grid-template-columns:44px minmax(20px, 1fr) 46px 58px 62px; gap:5px; } .tdr-lz .tdr-dzh span{ display:none; } }@media (max-width:520px){
  .tdr-runfield .tdr-zname{ font-size:17px; } .tdr-runfield .tdr-zsub{ display:none; } .tdr-runfield .tdr-fld-n{ font-size:13px; } .tdr-runfield .tdr-fld-adot2{ font-size:13px; } .tdr-ls-v{ font-size:0.6rem; letter-spacing:-0.02em; }
  .tdr-lz{ grid-template-columns:44px minmax(0,1fr) minmax(0,1fr) minmax(0,1fr); gap:6px; } .tdr-lz .tdr-dzb{ display:none; } .tdr-lz.tdr-lzh span:nth-child(3){ display:none; } .tdr-lz .tdr-dzn{ text-align:left; } .tdr-lz.tdr-lzh span:nth-child(2){ text-align:left; } .tdr-lz .tdr-dzn small{ font-size:0.6rem; } .tdr-lz.tdr-lzh{ font-size:0.54rem; }
}

  /* ---------- game-day injury board ---------- */
  .injl .panel-head h2{ display:flex; align-items:center; gap:10px; }
  .injl-live{ font-family:Inter,sans-serif; font-size:0.62rem; font-weight:800; letter-spacing:0.1em; color:#04130a; background:var(--good); border-radius:999px; padding:2px 9px; animation:injlPulse 2s ease-in-out infinite; }
  @keyframes injlPulse{ 0%,100%{ opacity:1 } 50%{ opacity:.55 } }
  .injl-seg{ display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin-bottom:12px; } .injl-count{ margin-left:auto; font-size:0.78rem; color:var(--text-muted); } .injl-count b{ color:var(--text); }
  .injl-games{ display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:12px; }
  .injl-game{ border:1px solid var(--border); border-radius:12px; background:var(--surface); overflow:hidden; }
  .injl-gh{ display:flex; justify-content:space-between; align-items:center; gap:8px; padding:9px 14px; background:var(--surface-2); border-bottom:1px solid var(--border); } .injl-gh b{ font-family:'Oswald',sans-serif; letter-spacing:0.03em; }
  .injl-g{ font-size:0.68rem; font-weight:700; color:var(--text-muted); } .injl-g.live{ color:var(--warn); } .injl-g.fin{ color:var(--text-muted); text-decoration:line-through; text-decoration-color:transparent; }
  .injl-cols{ display:grid; grid-template-columns:1fr 1fr; } .injl-col{ padding:10px 12px; min-width:0; } .injl-col + .injl-col{ border-left:1px solid var(--border); }
  .injl-col h4{ margin:0 0 8px; font-family:'Oswald',sans-serif; font-size:0.9rem; letter-spacing:0.03em; display:flex; align-items:center; gap:6px; }
  .injl-p{ padding:6px 0; border-top:1px solid color-mix(in srgb, var(--border) 60%, transparent); } .injl-p:first-of-type{ border-top:0; }
  .injl-ph{ display:flex; flex-wrap:wrap; align-items:center; gap:6px; } .injl-ph b{ font-size:0.88rem; } .injl-ph time{ margin-left:auto; font-size:0.62rem; color:var(--text-muted); white-space:nowrap; }
  .injl-chip{ font-size:0.6rem; font-weight:800; letter-spacing:0.06em; padding:1px 7px; border-radius:999px; } .injl-chip.out{ background:color-mix(in srgb, var(--danger) 22%, transparent); color:var(--danger); } .injl-chip.out.off{ background:var(--danger); color:#fff; }
  .injl-chip.dbt{ background:color-mix(in srgb, #ff9a3c 22%, transparent); color:#ff9a3c; } .injl-chip.q{ background:color-mix(in srgb, var(--warn) 22%, transparent); color:var(--warn); }
  .injl-note{ margin-top:3px; font-size:0.72rem; color:var(--text-muted); line-height:1.35; } .injl-none{ margin:0; font-size:0.74rem; color:var(--text-muted); }
  details.injl-old{ margin-top:14px; border:1px solid var(--border); border-radius:12px; padding:0 14px; } details.injl-old > summary{ cursor:pointer; padding:12px 0; font-family:'Oswald',sans-serif; text-transform:uppercase; letter-spacing:0.03em; font-size:0.88rem; }
  @media (max-width:900px){ .injl-games{ grid-template-columns:1fr; } .injl-count{ margin-left:0; width:100%; } }
  @media (max-width:520px){ .injl-cols{ grid-template-columns:1fr; } .injl-col + .injl-col{ border-left:0; border-top:1px solid var(--border); } }/* ---------- injury opportunity ratings (NFL, NBA, NHL injury pages) + shared injury card styles ---------- */
.opp-box{ margin-top:12px; padding:10px 12px; border-radius:12px; background:var(--surface-2); }
.opp-box h5{ margin:0 0 8px; font-size:0.68rem; text-transform:uppercase; letter-spacing:0.06em; color:var(--text-muted); }
.opp-box h5 small{ text-transform:none; letter-spacing:0; font-weight:400; margin-left:4px; }
.opp-row{ display:grid; grid-template-columns:minmax(90px, 1.1fr) minmax(60px, 1fr) 28px minmax(78px, auto); align-items:center; gap:8px; padding:4px 0; font-size:0.78rem; }
.opp-row b{ font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; cursor:pointer; }
.opp-row small{ color:var(--text-muted); font-size:0.68rem; text-align:right; white-space:nowrap; }
.opp-bar{ height:8px; border-radius:5px; background:var(--surface); overflow:hidden; display:block; }
.opp-bar i{ display:block; height:100%; border-radius:5px; background:var(--text-muted); }
.opp-bar i.hi, .opp-score.hi{ background:var(--good); color:#fff; } .opp-bar i.mh{ background:#8fcf7a; } .opp-bar i.mid{ background:var(--text-muted); } .opp-bar i.ml{ background:#e5a04a; }
.opp-score{ font-weight:800; font-size:0.78rem; text-align:center; border-radius:8px; padding:2px 0; background:var(--surface); }
.opp-score.hi{ background:var(--good); color:#fff; } .opp-score.mh{ background:#8fcf7a; color:#14230f; } .opp-score.mid{ background:var(--surface); color:var(--text); } .opp-score.ml{ background:#e5a04a; color:#2a1a05; }
.opp-count{ font-style:normal; font-size:0.66rem; font-weight:600; color:var(--text-muted); margin-left:6px; }
.opp-out{ display:flex; flex-wrap:wrap; gap:6px; margin-bottom:2px; }
.injl-opp{ margin-top:16px; }
.nba-name.opp-n{ cursor:pointer; }

/* the team-card layout shared by every injury page */
.nhl-injgrid{ display:grid; grid-template-columns:repeat(auto-fill, minmax(min(100%, 380px), 1fr)); gap:14px; }
.nhl-injteam{ border:1px solid var(--border); border-radius:12px; padding:12px 14px; background:var(--surface); min-width:0; }
.nhl-injteam h4{ margin:0 0 8px; font-size:0.9rem; }
.nhl-injrow{ display:grid; grid-template-columns:1fr auto; gap:2px 8px; padding:7px 0; border-top:1px solid var(--border); font-size:0.8rem; }
.nhl-injrow small{ color:var(--text-muted); }
.nhl-injnote{ grid-column:1 / -1; font-size:0.73rem; color:var(--text-muted); line-height:1.4; }
.nhl-chip{ display:inline-block; font-size:0.64rem; font-weight:700; letter-spacing:0.03em; padding:2px 7px; border-radius:8px; background:var(--warn-bg, rgba(184,134,11,0.15)); color:var(--warn); }
.nhl-chip.out{ background:var(--danger-bg, rgba(166,54,47,0.14)); color:var(--danger); } .nhl-chip.dbt{ background:rgba(230,126,34,0.16); color:#d9731a; }
@media (max-width: 640px){ .opp-row{ grid-template-columns:minmax(80px, 1fr) 54px 26px; } .opp-row small{ grid-column:1 / -1; text-align:left; margin-top:-3px; } }

/* ---------- betting labs ---------- */
.lab-tabs{ margin:6px 0 10px; }
.lab-tip{ font-size:0.84rem; line-height:1.55; color:var(--text-muted); margin:0 0 12px; max-width:900px; } .lab-tip b{ color:var(--text); }
.lab-frame{ border:1px solid var(--border); border-radius:14px; background:var(--surface); padding:6px; overflow:hidden; }
.lab-frame statyx-widget{ display:block; width:100%; }
.lab-pill{ display:inline-block; min-width:46px; padding:3px 7px; border-radius:9px; font-weight:700; font-size:0.78rem; text-align:center; font-variant-numeric:tabular-nums; background:var(--surface-2); color:var(--text-muted); }
.lab-pill small{ display:block; font-weight:400; font-size:0.6rem; opacity:0.85; }
.lab-pill.hi{ background:var(--good); color:#fff; } .lab-pill.mh{ background:color-mix(in srgb, var(--good) 38%, var(--surface-2)); color:var(--text); } .lab-pill.ml{ background:color-mix(in srgb, var(--danger) 30%, var(--surface-2)); color:var(--text); } .lab-pill.lo{ background:var(--danger); color:#fff; }
.lab-tbl td small{ display:block; font-size:0.62rem; color:var(--text-muted); font-weight:400; } .lab-tbl td.num{ white-space:nowrap; }
.lab-us{ display:grid; grid-template-columns:repeat(auto-fill, minmax(min(100%, 520px), 1fr)); gap:14px; }
.lab-us-card{ border:1px solid var(--border); border-radius:14px; background:var(--surface); padding:12px 14px; min-width:0; }
.lab-us-h{ display:flex; align-items:center; flex-wrap:wrap; gap:8px; margin-bottom:6px; } .lab-us-h small{ color:var(--text-muted); font-size:0.7rem; margin-left:auto; }
.lab-us-row{ display:grid; grid-template-columns:minmax(100px, 1.2fr) 24px 56px 40px minmax(100px, auto) minmax(90px, auto) minmax(90px, auto); align-items:center; gap:8px; padding:5px 0; border-top:1px solid var(--border); font-size:0.78rem; }
.lab-us-row b{ font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .lab-us-row small{ color:var(--text-muted); font-size:0.66rem; } .lab-us-s{ font-size:0.72rem; white-space:nowrap; color:var(--text-muted); }
.opp-bar i.hi{ background:var(--good); } .opp-bar i.mh{ background:#8fcf7a; } .opp-bar i.mid{ background:var(--text-muted); }
@media (max-width:760px){ .lab-us-row{ grid-template-columns:minmax(90px, 1fr) 54px 38px minmax(96px, auto); } .lab-us-row small, .hide-s{ display:none; } .lab-us-row .lab-us-s:not(.hide-s){ grid-column:auto; } }
/* ---------- betting lab: game by game + locked state ---------- */
.lab-weeks{ margin:2px 0 10px; }
.lab-game{ border:1px solid var(--border); border-radius:16px; background:var(--surface); padding:18px; margin-top:4px; }
.lab-gh{ display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:12px; padding-bottom:14px; border-bottom:1px solid var(--border); margin-bottom:16px; }
.lab-gh > div:not(.lab-mid){ display:flex; align-items:center; gap:10px; font-size:1.25rem; font-family:'Oswald',sans-serif; } .lab-gh > div:last-child{ justify-content:flex-end; flex-direction:row-reverse; }
.lab-gh .team-badge, .lab-gh img{ width:44px; height:44px; }
.lab-mid{ text-align:center; display:flex; flex-direction:column; gap:3px; } .lab-mid span{ font-weight:700; font-size:0.9rem; } .lab-mid small{ color:var(--text-muted); font-size:0.76rem; }
.lab-defs{ display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-bottom:20px; }
.lab-def{ border:1px solid var(--border); border-radius:14px; padding:14px 16px; background:var(--bg); min-width:0; }
.lab-def h4{ margin:0 0 10px; font-size:0.95rem; } .lab-def h4 small{ color:var(--text-muted); font-weight:400; font-size:0.74rem; margin-left:4px; }
.lab-stack{ display:flex; height:30px; border-radius:9px; overflow:hidden; background:var(--surface-2); }
.lab-stack i{ display:flex; align-items:center; justify-content:center; font-style:normal; font-size:0.7rem; font-weight:800; color:#fff; text-shadow:0 1px 2px rgba(0,0,0,0.45); min-width:0; overflow:hidden; }
.lab-key{ display:flex; flex-wrap:wrap; gap:4px 12px; margin:8px 0 12px; font-size:0.72rem; color:var(--text-muted); } .lab-key i{ display:inline-block; width:9px; height:9px; border-radius:3px; margin-right:5px; }
.lab-lanes{ display:grid; grid-template-columns:repeat(7, 1fr); gap:5px; }
.lab-lanes div{ border-radius:9px; text-align:center; padding:6px 0 5px; background:var(--surface-2); } .lab-lanes small{ display:block; font-size:0.62rem; letter-spacing:0.05em; color:var(--text-muted); font-weight:700; } .lab-lanes b{ font-size:0.92rem; font-variant-numeric:tabular-nums; }
.lab-lanehint{ font-size:0.68rem; color:var(--text-muted); margin:6px 0 8px; }
.lab-notes{ margin:0; padding-left:18px; font-size:0.8rem; line-height:1.55; } .lab-notes li{ margin-bottom:3px; }
.lab-pcols{ display:grid; grid-template-columns:1fr 1fr; gap:16px; } .lab-ps h4{ margin:0 0 8px; font-size:0.92rem; }
.lab-lock{ max-width:640px; margin:30px auto; text-align:center; padding:40px 26px; border:1px dashed var(--border); border-radius:18px; background:var(--surface); }
.lab-lock-ic{ font-size:2.6rem; margin-bottom:8px; } .lab-lock h2{ margin:0 0 10px; } .lab-lock p{ color:var(--text-muted); line-height:1.6; margin:0 0 18px; }
.lab-lock-row{ display:flex; gap:10px; justify-content:center; flex-wrap:wrap; }
@media (max-width:860px){ .lab-defs, .lab-pcols{ grid-template-columns:1fr; } .lab-gh{ grid-template-columns:1fr; justify-items:center; } .lab-gh > div:last-child{ justify-content:center; flex-direction:row; } .lab-game{ padding:12px; } }.lab-tbl tr.lab-first td{ border-top:1px solid var(--border); } .lab-tbl tr:not(.lab-first) td{ border-top:1px dashed color-mix(in srgb, var(--border) 50%, transparent); }
.lab-ln{ font-weight:700; color:var(--accent); margin-left:3px; }
.lab-pill{ min-width:52px; } .lab-pill small{ font-size:0.62rem; }@media (max-width:700px){ .lab-x, .lab-avg{ display:none; } .lab-pill{ min-width:46px; padding:3px 4px; } .lab-tbl th, .lab-tbl td{ padding:7px 6px !important; } .lab-tbl td.nhl-pl{ min-width:74px; white-space:normal; } }.lab-tbl tr.lab-ph td{ background:var(--surface-2); padding:6px 10px !important; border-top:1px solid var(--border); font-size:0.86rem; } .lab-tbl tr.lab-ph small{ display:inline; color:var(--text-muted); }
.lab-tbl td.lab-pr{ white-space:normal; } .lab-tbl td.lab-pr small{ display:inline; margin-left:6px; }
/* ---------- NBA Betting Lab: team picker + cleaner cards ---------- */
.lab-teams{ display:grid; grid-template-columns:repeat(auto-fill, minmax(76px, 1fr)); gap:7px; margin:6px 0 14px; }
.lab-team{ position:relative; display:flex; flex-direction:column; align-items:center; gap:3px; padding:9px 4px 7px; border-radius:12px; border:1px solid var(--border); background:var(--surface-2); color:var(--text); cursor:pointer; font-family:inherit; font-size:.72rem; font-weight:700; letter-spacing:.04em; transition:border-color .15s, background .15s, transform .15s; }
.lab-team:hover{ transform:translateY(-1px); border-color:color-mix(in srgb, var(--accent) 55%, var(--border)); }
.lab-team.on{ border-color:var(--accent); background:color-mix(in srgb, var(--accent) 12%, var(--surface-2)); box-shadow:0 0 0 1px var(--accent) inset; }
.lab-team i{ position:absolute; top:4px; right:5px; font-style:normal; font-size:.6rem; color:var(--text-muted); font-weight:600; }
.lab-th{ display:flex; align-items:center; gap:12px; margin:2px 0 12px; padding:12px 14px; border-radius:14px; background:linear-gradient(90deg, color-mix(in srgb, var(--accent) 10%, var(--surface-2)), var(--surface-2)); border:1px solid var(--border); }
.lab-th .team-badge, .lab-th .nba-badge{ transform:scale(1.35); margin:0 8px 0 6px; }
.lab-th b{ font-family:'Oswald',sans-serif; font-size:1.15rem; letter-spacing:.02em; text-transform:uppercase; } .lab-th small{ display:block; color:var(--text-muted); font-size:.78rem; margin-top:2px; }
.lab-us-card{ border-left:3px solid var(--accent); box-shadow:0 1px 0 rgba(0,0,0,.15); }
.lab-us-h b{ font-size:1rem; }
.lab-us-row{ border-top:1px solid color-mix(in srgb, var(--border) 60%, transparent); }
.lab-cta{ margin:10px 0 4px; }
@media (max-width:640px){
  .lab-teams{ display:flex; overflow-x:auto; gap:6px; padding-bottom:4px; scrollbar-width:none; -webkit-overflow-scrolling:touch; } .lab-teams::-webkit-scrollbar{ display:none; }
  .lab-team{ flex:0 0 68px; } .lab-th{ padding:10px 12px; }
  .lab-us{ grid-template-columns:1fr; }
}
/* ---------- Hockey (NHL) research ---------- */
.nhl-panel{ padding-top:18px; }
.nhl-asof{ font-size:0.74rem; color:var(--text-muted); border:1px solid var(--border); border-radius:12px; padding:3px 10px; white-space:nowrap; }
.nhl-fine{ font-size:0.74rem; color:var(--text-muted); line-height:1.5; margin:14px 0 0; max-width:900px; }
.nhl-logo{ width:20px; height:20px; object-fit:contain; vertical-align:-5px; flex:none; }
.nhl-logo.lg{ width:44px; height:44px; vertical-align:middle; }
.nhl-pos{ color:var(--good); font-weight:700; } .nhl-neg{ color:var(--danger); font-weight:700; }

/* date chips */
.nhl-dates{ display:flex; gap:6px; overflow-x:auto; padding:2px 0 12px; margin:0 -2px; scrollbar-width:thin; }
.nhl-dates button{ flex:none; border:1px solid var(--border); background:var(--surface); color:var(--text-muted); padding:7px 12px; border-radius:16px; font-size:0.8rem; font-weight:600; cursor:pointer; display:inline-flex; align-items:center; gap:7px; }
.nhl-dates button i{ font-style:normal; font-size:0.68rem; background:var(--surface-2); border-radius:9px; padding:1px 7px; color:var(--text-muted); }
.nhl-dates button.active{ background:var(--field); border-color:var(--field); color:#fff; }
.nhl-dates button.active i{ background:rgba(255,255,255,0.22); color:#fff; }

/* controls */
.nhl-ctl{ display:flex; flex-wrap:wrap; gap:10px 14px; align-items:center; justify-content:space-between; margin:4px 0 14px; }
.nhl-sel{ display:flex; flex-wrap:wrap; gap:8px; align-items:center; }
.nhl-sel select, .nhl-sel input[type=search]{ border:1px solid var(--border); background:var(--surface); color:var(--text); border-radius:10px; padding:7px 10px; font-size:0.82rem; max-width:210px; }

/* game cards */
.nhl-games{ display:grid; grid-template-columns:repeat(auto-fill, minmax(min(100%, 520px), 1fr)); gap:14px; }
.nhl-game{ border:1px solid var(--border); background:var(--surface); border-radius:14px; padding:14px 16px 12px; min-width:0; }
.nhl-gh{ display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:10px; }
.nhl-side{ display:flex; align-items:center; gap:10px; min-width:0; }
.nhl-side.home{ flex-direction:row-reverse; text-align:right; }
.nhl-side b{ display:block; font-size:0.95rem; line-height:1.2; overflow-wrap:anywhere; }
.nhl-tl{ display:block; font-size:0.72rem; color:var(--text-muted); margin-top:2px; }
.nhl-tl em{ font-style:normal; font-weight:700; font-size:0.66rem; padding:1px 6px; border-radius:8px; margin-left:4px; }
.nhl-tl em.b2b{ background:var(--danger-bg, rgba(166,54,47,0.12)); color:var(--danger); }
.nhl-tl em.rst{ background:var(--good-bg, rgba(46,125,79,0.12)); color:var(--good); }
.nhl-mid{ text-align:center; display:flex; flex-direction:column; align-items:center; gap:4px; min-width:84px; }
.nhl-st{ font-size:0.72rem; font-weight:700; letter-spacing:0.03em; color:var(--text-muted); }
.nhl-st.live{ color:var(--danger); } .nhl-st.live::before{ content:''; display:inline-block; width:7px; height:7px; border-radius:50%; background:var(--danger); margin-right:5px; animation:nhlPulse 1.4s ease-in-out infinite; }
.nhl-st.fin{ color:var(--text); }
@keyframes nhlPulse{ 50%{ opacity:0.25; } }
.nhl-score{ display:flex; align-items:center; gap:8px; font-size:1.5rem; font-weight:800; line-height:1; }
.nhl-score span{ color:var(--text-muted); font-weight:400; }
.nhl-sog{ font-size:0.7rem; color:var(--text-muted); }
.nhl-proj{ display:flex; flex-wrap:wrap; justify-content:space-between; gap:4px 12px; font-size:0.78rem; color:var(--text-muted); margin:12px 0 8px; padding:8px 10px; background:var(--surface-2); border-radius:10px; }
.nhl-proj b{ color:var(--text); }
.nhl-venue{ opacity:0.8; }
.nhl-noline{ margin:6px 0; }

.nhl-mkt{ width:100%; border-collapse:collapse; font-size:0.8rem; }
.nhl-mkt th, .nhl-mkt td{ padding:6px 6px; border-top:1px solid var(--border); text-align:left; vertical-align:middle; }
.nhl-mkt thead th{ border-top:0; font-size:0.68rem; text-transform:uppercase; letter-spacing:0.04em; color:var(--text-muted); font-weight:600; }
.nhl-mkt tbody th{ font-size:0.74rem; color:var(--text-muted); font-weight:600; white-space:nowrap; width:1%; }
.nhl-mkt td small, .nhl-props td small, .nhl-pl small{ display:block; color:var(--text-muted); font-size:0.68rem; font-weight:400; }
.nhl-mkt td b{ margin-left:4px; }
.nhl-mkt td.num, .nhl-props td.num, .nhl-tbl td.num{ text-align:right; font-variant-numeric:tabular-nums; }
.nhl-mkt th.num, .nhl-props th.num, .nhl-tbl th.num{ text-align:right; }
.nhl-edge{ display:inline-block; min-width:42px; text-align:center; padding:2px 7px; border-radius:8px; font-weight:700; font-size:0.74rem; background:var(--surface-2); color:var(--text-muted); font-variant-numeric:tabular-nums; }
.nhl-edge.up{ background:var(--good-bg, rgba(46,125,79,0.14)); color:var(--good); }
.nhl-edge.dn{ background:var(--danger-bg, rgba(166,54,47,0.14)); color:var(--danger); }
.nhl-val{ font-style:normal; font-size:0.6rem; font-weight:800; letter-spacing:0.05em; color:var(--accent-ink, #14100A); background:var(--accent); border-radius:6px; padding:2px 5px; margin-left:5px; vertical-align:2px; }

.nhl-more{ margin-top:10px; border-top:1px solid var(--border); padding-top:8px; }
.nhl-more summary{ cursor:pointer; font-size:0.8rem; font-weight:600; color:var(--text-muted); list-style:none; }
.nhl-more summary::before{ content:'▸ '; } .nhl-more[open] summary::before{ content:'▾ '; }
.nhl-cmps{ margin:10px 0; }
.nhl-cmphead, .nhl-cmp{ display:grid; grid-template-columns:70px 1fr 70px; align-items:center; text-align:center; gap:8px; padding:4px 0; font-size:0.8rem; }
.nhl-cmphead b{ font-size:0.78rem; }
.nhl-cmp span{ font-size:0.72rem; color:var(--text-muted); }
.nhl-cmp b{ font-variant-numeric:tabular-nums; font-weight:500; padding:2px 0; border-radius:6px; }
.nhl-cmp b.lead{ background:var(--good-bg, rgba(46,125,79,0.14)); color:var(--good); font-weight:700; }
.nhl-injcols{ display:grid; grid-template-columns:1fr 1fr; gap:14px; margin:12px 0; }
.nhl-injcols h5{ margin:0 0 6px; font-size:0.74rem; text-transform:uppercase; letter-spacing:0.05em; color:var(--text-muted); }
.nhl-inj{ font-size:0.78rem; padding:3px 0; } .nhl-inj small{ color:var(--text-muted); margin-left:4px; }
.nhl-chip{ display:inline-block; font-size:0.64rem; font-weight:700; letter-spacing:0.03em; padding:2px 7px; border-radius:8px; background:var(--warn-bg, rgba(184,134,11,0.15)); color:var(--warn); }
.nhl-chip.out{ background:var(--danger-bg, rgba(166,54,47,0.14)); color:var(--danger); }
.nhl-chip.dbt{ background:rgba(230,126,34,0.16); color:#d9731a; }
.nhl-linkrow{ margin-top:6px; }

/* props */
.nhl-props, .nhl-tbl{ width:100%; border-collapse:collapse; font-size:0.8rem; }
.nhl-props th, .nhl-props td, .nhl-tbl th, .nhl-tbl td{ padding:7px 8px; border-top:1px solid var(--border); text-align:left; white-space:nowrap; vertical-align:middle; }
.nhl-props thead th, .nhl-tbl thead th{ border-top:0; font-size:0.68rem; text-transform:uppercase; letter-spacing:0.04em; color:var(--text-muted); font-weight:600; position:sticky; top:0; background:var(--surface); }
.nhl-tbl thead th[data-nhlp-sort], .nhl-tbl thead th[data-nhlt-sort]{ cursor:pointer; }
.nhl-tbl thead th.sorted{ color:var(--text); }
.nhl-tbl td.strong{ font-weight:700; }
.nhl-pl b{ font-weight:600; }
.nhl-heat{ text-align:right; }
.nhl-spark{ position:relative; display:inline-flex; align-items:flex-end; gap:2px; height:30px; padding:0 2px; }
.nhl-spark i{ display:block; width:6px; border-radius:2px 2px 0 0; min-height:3px; }
.nhl-spark i.hit{ background:var(--good); } .nhl-spark i.miss{ background:var(--danger); opacity:0.85; }
.nhl-spark u{ position:absolute; left:0; right:0; height:0; border-top:1px dashed var(--text-muted); opacity:0.7; }
.nhl-props sup{ color:var(--text-muted); cursor:help; }

/* players */
.nhl-leads{ display:grid; grid-template-columns:repeat(auto-fit, minmax(210px, 1fr)); gap:12px; margin:0 0 16px; }
.nhl-lead{ border:1px solid var(--border); border-radius:12px; padding:10px 12px; background:var(--surface); }
.nhl-lead h4{ margin:0 0 6px; font-size:0.74rem; text-transform:uppercase; letter-spacing:0.05em; color:var(--text-muted); } .nhl-lead h4 small{ text-transform:none; letter-spacing:0; font-weight:400; }
.nhl-lead > div{ display:flex; align-items:center; gap:7px; padding:3px 0; font-size:0.8rem; }
.nhl-lead > div span{ width:12px; color:var(--text-muted); font-size:0.7rem; }
.nhl-lead > div b{ font-weight:600; flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.nhl-lead > div em{ font-style:normal; font-size:0.68rem; color:var(--text-muted); }
.nhl-lead > div strong{ font-variant-numeric:tabular-nums; min-width:34px; text-align:right; }
.nhl-grp{ margin:18px 0 8px; font-size:0.95rem; }

/* injuries */
.nhl-injgrid{ display:grid; grid-template-columns:repeat(auto-fill, minmax(min(100%, 380px), 1fr)); gap:14px; }
.nhl-injteam{ border:1px solid var(--border); border-radius:12px; padding:12px 14px; background:var(--surface); }
.nhl-injteam h4{ margin:0 0 8px; font-size:0.9rem; } .nhl-injteam h4 em{ font-style:normal; font-size:0.66rem; color:var(--accent); font-weight:700; margin-left:6px; }
.nhl-injrow{ display:grid; grid-template-columns:1fr auto; gap:2px 8px; padding:7px 0; border-top:1px solid var(--border); font-size:0.8rem; }
.nhl-injrow small{ color:var(--text-muted); }
.nhl-injnote{ grid-column:1 / -1; font-size:0.73rem; color:var(--text-muted); line-height:1.4; }

/* guide + tools */
.nhl-guide{ display:grid; gap:12px; max-width:880px; }
.nhl-gsec{ border:1px solid var(--border); border-radius:12px; background:var(--surface); padding:0 16px; }
.nhl-gsec summary{ cursor:pointer; padding:13px 0; font-weight:700; font-size:0.98rem; }
.nhl-gsec > div{ padding:0 0 14px; font-size:0.88rem; line-height:1.6; color:var(--text); }
.nhl-gsec ul{ margin:0; padding-left:18px; } .nhl-gsec li{ margin:0 0 8px; }
.nhl-tools{ display:grid; grid-template-columns:repeat(auto-fit, minmax(min(100%, 380px), 1fr)); gap:14px; }
.nhl-tool{ border:1px solid var(--border); border-radius:14px; background:var(--surface); padding:14px 16px; }
.nhl-tool h3{ margin:0 0 2px; font-size:1rem; } .nhl-tool .hint{ margin:0 0 10px; }
.nhl-f{ display:flex; flex-wrap:wrap; gap:10px; margin-bottom:10px; }
.nhl-f label{ display:flex; flex-direction:column; gap:4px; font-size:0.72rem; color:var(--text-muted); font-weight:600; flex:1 1 90px; min-width:90px; }
.nhl-f input{ border:1px solid var(--border); background:var(--bg); color:var(--text); border-radius:9px; padding:8px 10px; font-size:0.92rem; width:100%; box-sizing:border-box; }
.nhl-legs label{ flex:1 1 80px; min-width:80px; }
.nhl-res{ font-size:0.86rem; line-height:1.65; padding:10px 12px; background:var(--surface-2); border-radius:10px; min-height:20px; }

/* home panel + hockey tab */
#home-nhl-panel .feature-grid{ display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:10px; }
#home-nhl-panel .feature-card{ display:flex; align-items:center; gap:12px; padding:12px 14px; cursor:pointer; }
#home-nhl-panel .feature-card p{ display:none; }
#home-nhl-panel .feature-icon{ margin:0; flex:none; }
#home-nhl-panel .feature-title{ margin:0; font-size:0.92rem; }
nav.tabs button#tab-hockey{ border:1px solid var(--border); margin:0 2px; display:inline-flex; align-items:center; gap:7px; }
nav.tabs button#tab-hockey[aria-selected="true"]{ border-color:var(--accent); }
nav.tabs button#tab-hockey .sport-logo{ width:22px; height:22px; object-fit:contain; flex-shrink:0; }

@media (max-width: 640px){
  #home-nhl-panel .feature-grid{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
  #home-nhl-panel .feature-card{ padding:10px 11px; gap:9px; } #home-nhl-panel .feature-title{ font-size:0.8rem; }
  .nhl-gh{ grid-template-columns:1fr; justify-items:stretch; gap:8px; }
  .nhl-side.home{ flex-direction:row; text-align:left; }
  .nhl-mid{ flex-direction:row; justify-content:center; gap:12px; order:-0; }
  .nhl-gh .nhl-mid{ order:2; } .nhl-gh .nhl-side.home{ order:3; }
  .nhl-injcols{ grid-template-columns:1fr; }
  .nhl-game{ padding:12px; }
  .nhl-ctl{ flex-direction:column; align-items:stretch; }
  .nhl-sel select, .nhl-sel input[type=search]{ max-width:none; flex:1 1 140px; }
}

/* ---------- goal research + profiles ---------- */
.nhl-name{ cursor:pointer; } .nhl-name:hover{ color:var(--accent); text-decoration:underline; }
.nhg-games{ display:grid; gap:18px; }
.nhg-game{ border:1px solid var(--border); border-radius:16px; background:var(--surface); padding:16px; min-width:0; }
.nhg-gh{ display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:10px; margin-bottom:12px; }
.nhg-gh > div{ display:flex; align-items:center; gap:10px; font-size:1rem; } .nhg-gh > div:last-child{ justify-content:flex-end; text-align:right; flex-direction:row-reverse; }
.nhg-gh > span{ text-align:center; display:flex; flex-direction:column; gap:3px; } .nhg-gh small{ color:var(--text-muted); font-size:0.72rem; }
.nhg-teams{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.nhg-team{ border:1px solid var(--border); border-radius:12px; padding:12px 14px; background:var(--bg); min-width:0; }
.nhg-th{ display:flex; align-items:center; gap:10px; margin-bottom:8px; } .nhg-th b{ display:block; } .nhg-th span{ font-size:0.76rem; color:var(--text-muted); }
.nhg-th em, .nhg-edges em{ font-style:normal; font-weight:700; }
.nhg-team h5, .nhg-edges h5{ margin:12px 0 5px; font-size:0.68rem; text-transform:uppercase; letter-spacing:0.06em; color:var(--text-muted); }
.nhg-tags{ display:flex; flex-wrap:wrap; gap:6px; }
.nhg-tag{ font-size:0.7rem; font-weight:700; padding:3px 9px; border-radius:10px; } .nhg-tag i{ font-style:normal; opacity:0.8; margin-left:4px; }
.nhg-tag.good{ background:var(--good-bg, rgba(46,125,79,0.16)); color:var(--good); } .nhg-tag.bad{ background:var(--danger-bg, rgba(166,54,47,0.16)); color:var(--danger); }
.nhg-bar{ display:grid; grid-template-columns:minmax(96px, 150px) 1fr 30px; align-items:center; gap:8px; padding:3px 0; font-size:0.76rem; }
.nhg-bar > div{ height:8px; border-radius:5px; background:var(--surface-2); overflow:hidden; } .nhg-bar i{ display:block; height:100%; border-radius:5px; }
.nhg-bar b{ text-align:right; font-variant-numeric:tabular-nums; }
.hi{ --c:var(--good); } .mh{ --c:#8fcf7a; } .mid{ --c:var(--text-muted); } .ml{ --c:#e5a04a; } .lo{ --c:var(--danger); }
.nhg-bar i, .nhg-badge{ background:var(--c, var(--text-muted)); } .nhg-bar b, .nhg-th em{ color:var(--c, var(--text)); }
/* Goal Research reads green = target, red = fade, grey = neutral */
.nhg-call{ display:inline-block; margin-left:6px; font-size:0.58rem; font-weight:800; letter-spacing:0.07em; padding:1px 6px; border-radius:6px; vertical-align:middle; }
.nhg-call.hi{ background:var(--good-bg); color:var(--good); } .nhg-call.lo{ background:var(--danger-bg); color:var(--danger); }
.nhg-badge.mid{ background:color-mix(in srgb, var(--text-muted) 60%, var(--bg)); }
.nhg-legend{ display:flex; flex-wrap:wrap; align-items:center; gap:6px 16px; margin:0 0 12px; padding:9px 12px; border:1px solid var(--border); border-radius:10px; background:var(--surface); font-size:0.8rem; }
.nhg-legend i{ display:inline-block; width:12px; height:12px; border-radius:50%; background:var(--c, var(--text-muted)); margin-right:6px; vertical-align:-1px; }
.nhg-legend b{ font-weight:700; } .nhg-legend small{ flex-basis:100%; color:var(--text-muted); font-size:0.72rem; }
.nhg-team h5 small{ text-transform:none; letter-spacing:0; font-weight:500; opacity:0.85; margin-left:4px; }
.nhg-edges{ margin:14px 0 4px; padding:10px 14px; border:1px dashed var(--border); border-radius:12px; font-size:0.8rem; line-height:1.55; }
.nhg-edges div{ padding:2px 0; } .nhg-edges i{ font-style:normal; color:var(--text-muted); }
.nhg-lists{ display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-top:16px; }
.nhg-side h4{ margin:0 0 8px; font-size:0.9rem; }
.nhg-row{ border:1px solid var(--border); border-radius:12px; margin-bottom:7px; background:var(--surface); overflow:hidden; }
.nhg-main{ width:100%; display:grid; grid-template-columns:20px 36px minmax(0, 1fr) 46px 62px 74px 56px auto 14px; align-items:center; gap:9px; padding:8px 10px; background:none; border:0; color:var(--text); font:inherit; text-align:left; cursor:pointer; }
.nhg-main:hover{ background:var(--surface-2); }
.nhg-i{ font-size:0.72rem; color:var(--text-muted); text-align:center; }
.nhg-hs{ width:36px; height:36px; border-radius:50%; object-fit:cover; object-position:top; background:var(--surface-2); display:block; }
.nhg-n b{ display:block; font-size:0.86rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } .nhg-n small{ color:var(--text-muted); font-size:0.7rem; }
.nhg-badge{ display:grid; place-items:center; width:42px; height:42px; border-radius:50%; font-size:0.95rem; color:#fff; box-shadow:0 0 0 3px color-mix(in srgb, var(--c, #888) 22%, transparent); }
.nhg-badge b{ color:#fff; font-weight:800; }
.nhg-c{ text-align:center; line-height:1.2; } .nhg-c b{ display:block; font-size:0.86rem; } .nhg-c small{ display:block; color:var(--text-muted); font-size:0.64rem; }
.nhg-chev{ font-style:normal; color:var(--text-muted); transition:transform .15s; } .nhg-row.open .nhg-chev{ transform:rotate(180deg); }
.nhg-detail{ border-top:1px solid var(--border); padding:12px 14px; display:grid; grid-template-columns:1.2fr 1fr; gap:16px; background:var(--bg); }
.nhg-comp{ display:grid; grid-template-columns:minmax(110px, 1fr) 118px 1fr 40px; align-items:center; gap:8px; padding:3px 0; font-size:0.76rem; } .nhg-comp small{ color:var(--text-muted); font-size:0.68rem; }
.nhg-cbar{ position:relative; height:8px; background:var(--surface-2); border-radius:5px; } .nhg-cbar::after{ content:''; position:absolute; left:50%; top:-2px; bottom:-2px; width:1px; background:var(--text-muted); opacity:0.5; }
.nhg-cbar i{ position:absolute; top:0; bottom:0; border-radius:4px; } .nhg-cbar i.pos{ background:var(--good); } .nhg-cbar i.neg{ background:var(--danger); }
.nhg-comp b{ text-align:right; font-variant-numeric:tabular-nums; }
.nhg-notes p{ margin:0 0 6px; font-size:0.78rem; line-height:1.5; }
.nhg-chips{ display:flex; flex-wrap:wrap; gap:6px; margin:8px 0 10px; } .nhg-chips span{ font-size:0.68rem; padding:3px 8px; border-radius:9px; background:var(--surface-2); color:var(--text-muted); }
.nhg-slate > div{ margin-bottom:6px; } .nhg-gt{ display:block; font-size:0.66rem; color:var(--text-muted); text-transform:uppercase; letter-spacing:0.05em; margin:6px 0 3px 4px; }
.nhg-cell{ background:color-mix(in srgb, var(--c, transparent) 26%, transparent); color:var(--text); font-weight:600; } .nhg-cell small{ display:block; font-weight:400; font-size:0.62rem; color:var(--text-muted); }
.nhg-grid thead th.grp{ border-left:1px solid var(--border); } .nhg-grid td, .nhg-grid th{ padding:6px 7px; }
.nhg-prof{ display:flex; align-items:center; gap:14px; margin:6px 0 14px; }
.nhp-svg{ width:100%; height:auto; display:block; }
.nhp-head .pm-head-logo{ opacity:0.14; }

@media (max-width: 760px){
  .nhg-teams, .nhg-lists, .nhg-detail{ grid-template-columns:1fr; }
  .nhg-gh{ grid-template-columns:1fr; justify-items:center; } .nhg-gh > div:last-child{ justify-content:center; flex-direction:row; text-align:left; }
  .nhg-main{ grid-template-columns:18px 32px minmax(0, 1fr) 40px 52px auto 12px; gap:7px; padding:8px; }
  .nhg-main .nhl-spark, .nhg-hide{ display:none; } .nhg-hs{ width:32px; height:32px; }
  .nhg-badge{ width:38px; height:38px; font-size:0.86rem; }
  .nhg-comp{ grid-template-columns:minmax(96px, 1fr) 1fr 38px; } .nhg-comp small{ display:none; }
  .nhg-bar{ grid-template-columns:minmax(88px, 120px) 1fr 28px; }
  .nhg-game{ padding:12px; }
}
/* ---------- goal research: cleaner layout ---------- */
.nhg-game{ padding:22px 24px; border-radius:18px; }
.nhg-gh{ margin-bottom:16px; padding-bottom:14px; border-bottom:1px solid var(--border); }
.nhg-gh > div{ font-family:'Oswald',sans-serif; font-size:1.2rem; letter-spacing:0.01em; }
.nhg-strips{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.nhg-strip{ display:flex; gap:14px; align-items:center; padding:12px 14px; border-radius:14px; background:var(--bg); border:1px solid var(--border); }
.nhg-strip > div > b{ display:block; font-size:0.95rem; margin-bottom:5px; }
.nhg-sc{ display:flex; gap:16px; font-size:0.78rem; color:var(--text-muted); margin-bottom:7px; } .nhg-sc em{ font-style:normal; font-weight:800; font-size:1.05rem; color:var(--c, var(--text)); margin-left:3px; }
.nhg-edges{ margin:14px 0 8px; border:0; background:var(--surface-2); border-radius:12px; padding:11px 14px; } .nhg-edges h5{ margin-top:0; }
.nhg-fullbtn{ display:block; margin:8px 0 14px; background:none; border:0; color:var(--accent); font:inherit; font-size:0.8rem; font-weight:600; cursor:pointer; padding:4px 0; } .nhg-fullbtn:hover{ text-decoration:underline; }
.nhg-listhead{ display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap; margin:10px 0 8px; } .nhg-listhead h4{ margin:0; font-size:1.05rem; }
.nhg-cols, .nhg-main{ grid-template-columns:24px 40px minmax(0, 1.5fr) 46px minmax(100px, 1fr) 84px 58px 16px; }
.nhg-cols{ display:grid; gap:12px; padding:0 14px 6px; font-size:0.62rem; font-weight:800; letter-spacing:0.08em; text-transform:uppercase; color:var(--text-muted); }
.nhg-cols span:nth-child(4), .nhg-cols span:nth-child(6), .nhg-cols span:nth-child(7){ text-align:center; }
.nhg-list{ display:grid; gap:6px; }
.nhg-row{ margin:0; border-radius:14px; border:1px solid var(--border); }
.nhg-row.open{ border-color:color-mix(in srgb, var(--accent) 50%, var(--border)); }
.nhg-main{ gap:12px; padding:10px 14px; }
.nhg-n small{ display:flex; align-items:center; gap:5px; margin-top:2px; }
.nhg-n small .nhl-logo{ width:14px; height:14px; vertical-align:-3px; }
.nhg-ch{ display:flex; align-items:center; gap:9px; } .nhg-ch b{ font-size:0.95rem; min-width:36px; font-variant-numeric:tabular-nums; }
.nhg-cb{ flex:1; height:9px; border-radius:6px; background:var(--surface-2); overflow:hidden; } .nhg-cb i{ display:block; height:100%; border-radius:6px; background:linear-gradient(90deg, #2fbf71, #8fd36a); }
.nhg-bk, .nhg-ed{ text-align:center; line-height:1.2; } .nhg-bk b{ display:block; font-size:0.9rem; } .nhg-bk small{ display:block; font-size:0.64rem; color:var(--text-muted); }
.nhg-detail{ grid-template-columns:1.1fr 1fr; gap:22px; padding:16px 18px; }
.nhg-dh{ font-size:0.68rem; font-weight:800; letter-spacing:0.08em; text-transform:uppercase; color:var(--text-muted); margin-bottom:8px; }
.nhg-shots{ margin:10px 0 12px; } .nhg-shots > span{ font-size:0.7rem; color:var(--text-muted); } .nhg-shots i{ font-style:normal; opacity:0.8; }
.nhg-shots > div{ display:flex; align-items:flex-end; gap:5px; height:58px; margin-top:6px; }
.nhg-shots b{ flex:1; max-width:26px; border-radius:5px 5px 2px 2px; background:var(--text-muted); opacity:0.55; position:relative; min-height:8px; } .nhg-shots b.g{ background:var(--good); opacity:1; }
.nhg-shots em{ position:absolute; top:-15px; left:0; right:0; text-align:center; font-style:normal; font-size:0.62rem; color:var(--text-muted); }
@media (max-width:760px){
  .nhg-strips{ grid-template-columns:1fr; } .nhg-game{ padding:14px 12px; }
  .nhg-cols{ display:none; }
  .nhg-main{ grid-template-columns:20px 34px minmax(0, 1fr) 42px 82px 14px; gap:9px; padding:9px 10px; }
  .nhg-bk, .nhg-ed{ display:none; } .nhg-ch b{ min-width:30px; font-size:0.85rem; } .nhg-cb{ display:none; }
  .nhg-ch{ justify-content:center; } .nhg-main > .nhg-ch{ grid-column:5; }
}@media (max-width:760px){
  .nhg-detail{ grid-template-columns:1fr !important; gap:14px; padding:14px 12px; }
  .nhg-main{ grid-template-columns:18px 32px minmax(0, 1fr) 40px 42px 12px !important; gap:8px !important; padding:9px 8px !important; }
  .nhg-n b{ font-size:0.84rem; } .nhg-n small{ font-size:0.66rem; flex-wrap:wrap; }
  .nhg-detail .btn{ white-space:nowrap; }
  .nhg-comp{ grid-template-columns:minmax(110px, 1fr) 1fr 40px !important; }
}
/* phones: Home + Football + Basketball + Hockey must all fit on one row */
@media (max-width:640px){
  nav.tabs button.sport-tab{ padding:6px 7px !important; font-size:0.78rem !important; gap:4px !important; margin:0 1px !important; letter-spacing:0 !important; }
  nav.tabs button.sport-tab img, nav.tabs button.sport-tab .sport-logo{ width:17px !important; height:17px !important; }
  nav.tabs button#tab-home{ padding-left:8px !important; padding-right:8px !important; }
}/* the NHL shield is mostly black: no plate behind it (transparent logo on the dark theme); a soft light edge keeps it readable */
nav.tabs button#tab-hockey .sport-logo, #home-nhl-panel .nba-eyebrow img{ background:none; padding:0; border-radius:0; filter:drop-shadow(0 0 1px rgba(255,255,255,.9)) drop-shadow(0 0 3px rgba(255,255,255,.28)); }
/* team logos: dark crests (BOS, VGK, ANA, PIT...) get a faint light edge so they pop on the dark bar, plus a tiny shadow for depth */
.nhl-logo, .ticker-item img[src*="/img/nhl/"]{ filter:drop-shadow(0 0 1px rgba(255,255,255,.4)) drop-shadow(0 1px 2px rgba(0,0,0,.5)); }
/* ---------- goal research: teams side by side ---------- */
.nhg-listhead{ flex-direction:column; align-items:flex-start; gap:2px; }
.nhg-sides{ display:grid; grid-template-columns:1fr 1fr; gap:18px; align-items:start; }
.nhg-sidecol{ min-width:0; }
.nhg-sidehead{ display:flex; align-items:center; gap:8px; padding:8px 4px; margin-bottom:6px; border-bottom:2px solid var(--border); } .nhg-sidehead b{ font-family:'Oswald',sans-serif; font-size:1rem; } .nhg-sidehead span{ margin-left:auto; font-size:0.72rem; color:var(--text-muted); }
.nhg-sidecol .nhg-cols, .nhg-sidecol .nhg-main{ grid-template-columns:20px 36px minmax(0, 1fr) 44px 58px 66px 12px; gap:9px; }
.nhg-sidecol .nhg-cols{ padding:0 12px 4px; } .nhg-sidecol .nhg-main{ padding:8px 10px; }
.nhg-sidecol .nhg-hs{ width:36px; height:36px; }
.nhg-ch{ flex-direction:column !important; align-items:stretch !important; gap:3px !important; } .nhg-ch b{ text-align:center; font-size:0.9rem; min-width:0 !important; } .nhg-cb{ flex:none !important; height:6px !important; }
.nhg-bk{ display:flex; flex-direction:column; align-items:center; gap:3px; } .nhg-bk .nhl-edge{ min-width:0; padding:1px 6px; font-size:0.66rem; }
.nhg-sidecol .nhg-detail{ grid-template-columns:1fr !important; gap:12px; }
.nhg-extra{ margin:14px 2px 0; font-size:0.78rem; color:var(--text-muted); line-height:1.6; } .nhg-extra em{ font-style:normal; color:var(--text); font-weight:600; }
@media (max-width:980px){ .nhg-sides{ grid-template-columns:1fr; } }
@media (max-width:760px){
  .nhg-sidecol .nhg-cols{ display:none; }
  .nhg-sidecol .nhg-main{ grid-template-columns:18px 32px minmax(0, 1fr) 38px 40px 56px 10px !important; gap:7px !important; padding:8px 8px !important; }
  .nhg-bk{ display:flex !important; } .nhg-ch{ display:flex !important; } .nhg-cb{ display:block !important; }
}@media (max-width:760px){
  .nhg-sidecol .nhg-hs{ display:none; }
  .nhg-sidecol .nhg-main{ grid-template-columns:16px minmax(0, 1fr) 38px 40px 54px 10px !important; gap:7px !important; }
  .nhg-sidecol .nhg-n small .nhl-logo{ display:none; }
  .nhg-sidecol .nhg-n b{ white-space:normal; line-height:1.15; }
}@media (max-width:760px){
  .nhg-sidecol .nhg-main{ display:flex !important; align-items:center; gap:8px !important; }
  .nhg-sidecol .nhg-main > .nhg-i{ flex:0 0 16px; } .nhg-sidecol .nhg-main > .nhg-n{ flex:1 1 0; min-width:0; }
  .nhg-sidecol .nhg-main > .nhg-badge{ flex:0 0 38px; } .nhg-sidecol .nhg-main > .nhg-ch{ flex:0 0 44px; } .nhg-sidecol .nhg-main > .nhg-bk{ flex:0 0 56px; } .nhg-sidecol .nhg-main > .nhg-chev{ flex:0 0 10px; }
}

/* ======== Goal Research: game picker, search by game, and the phone layout (supersedes the patches above on small screens) ======== */
.nhg-gpick{ display:flex; gap:8px; overflow-x:auto; padding:2px 2px 12px; margin:0 -2px 6px; scroll-snap-type:x proximity; -webkit-overflow-scrolling:touch; scrollbar-width:thin; overscroll-behavior-x:contain; }
.nhg-gchip{ flex:0 0 auto; scroll-snap-align:start; display:inline-flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:3px 5px; min-width:122px; padding:8px 12px; background:var(--surface); color:var(--text); border:1px solid var(--border); border-radius:14px; font:inherit; font-size:0.8rem; cursor:pointer; -webkit-tap-highlight-color:transparent; }
.nhg-gchip b{ font-family:'Oswald',sans-serif; letter-spacing:0.02em; } .nhg-gchip i{ font-style:normal; color:var(--text-muted); }
.nhg-gchip small{ flex-basis:100%; text-align:center; color:var(--text-muted); font-size:0.68rem; }
.nhg-gchip .nhl-logo{ width:18px; height:18px; vertical-align:middle; }
.nhg-gchip.active{ border-color:var(--accent); background:color-mix(in srgb, var(--accent) 14%, var(--surface)); } .nhg-gchip.active small{ color:var(--text); }
.nhg-sidetabs{ display:none; }
@media (max-width:760px){
  #view-nhl-goals .nhg-sidetabs{ display:grid; grid-template-columns:1fr 1fr; gap:6px; margin:6px 0 10px; }
  #view-nhl-goals .nhg-sidetabs button{ display:flex; align-items:center; justify-content:center; gap:6px; padding:10px 8px; border-radius:12px; border:1px solid var(--border); background:var(--surface); color:var(--text); font:inherit; font-weight:700; font-size:0.86rem; -webkit-tap-highlight-color:transparent; }
  #view-nhl-goals .nhg-sidetabs button.active{ border-color:var(--accent); background:color-mix(in srgb, var(--accent) 14%, var(--surface)); }
  #view-nhl-goals .nhg-sidetabs i{ font-style:normal; font-weight:600; color:var(--text-muted); font-size:0.72rem; }
  /* one team's list at a time instead of two long stacked lists */
  #view-nhl-goals .nhg-sides{ display:block !important; }
  #view-nhl-goals .nhg-sides[data-side="away"] > .nhg-sidecol:nth-child(2), #view-nhl-goals .nhg-sides[data-side="home"] > .nhg-sidecol:nth-child(1){ display:none !important; }
  #view-nhl-goals .nhg-sidehead{ display:none; }
  /* compact game header: logos either side of the status */
  #view-nhl-goals .nhg-game{ padding:12px 10px !important; border-radius:14px; }
  #view-nhl-goals .nhg-gh{ grid-template-columns:1fr auto 1fr !important; gap:6px !important; justify-items:stretch !important; margin-bottom:10px !important; padding-bottom:10px !important; }
  #view-nhl-goals .nhg-gh > div, #view-nhl-goals .nhg-gh > div:last-child{ flex-direction:column !important; align-items:center !important; justify-content:flex-start !important; gap:4px !important; font-size:0.8rem !important; line-height:1.15; text-align:center !important; }
  #view-nhl-goals .nhg-gh .nhl-logo.lg{ width:42px; height:42px; }
  #view-nhl-goals .nhg-gh > span{ gap:2px; font-size:0.78rem; }
  /* the two team cards sit side by side and stay short */
  #view-nhl-goals .nhg-strips{ grid-template-columns:1fr 1fr !important; gap:8px !important; }
  #view-nhl-goals .nhg-strip{ padding:8px 9px !important; gap:0 !important; border-radius:12px; }
  #view-nhl-goals .nhg-strip .nhl-logo{ display:none; }
  #view-nhl-goals .nhg-strip > div > b{ font-size:0.8rem; margin-bottom:3px; }
  #view-nhl-goals .nhg-sc{ gap:10px !important; margin-bottom:5px !important; font-size:0.7rem !important; } #view-nhl-goals .nhg-sc em{ font-size:0.92rem !important; }
  #view-nhl-goals .nhg-strip .nhg-tags{ gap:4px; } #view-nhl-goals .nhg-tag{ font-size:0.62rem !important; padding:2px 7px !important; }
  #view-nhl-goals .nhg-edges{ margin:10px 0 6px !important; padding:9px 11px !important; font-size:0.76rem !important; }
  #view-nhl-goals .nhg-listhead{ margin:6px 0 8px; } #view-nhl-goals .nhg-listhead h4{ font-size:0.95rem; }
  /* player row: name on top; chance + price under it; rating badge on the right */
  #view-nhl-goals .nhg-main{ display:grid !important; grid-template-columns:34px minmax(0, 1fr) minmax(0, 1fr) 42px 14px !important; grid-template-areas:"hs n n badge chev" "hs ch bk badge chev" !important; column-gap:9px !important; row-gap:3px !important; align-items:center; padding:9px 10px !important; }
  #view-nhl-goals .nhg-main > .nhg-i{ display:none !important; }
  #view-nhl-goals .nhg-main > .nhg-hs{ grid-area:hs; display:block !important; width:34px !important; height:34px !important; }
  #view-nhl-goals .nhg-main > .nhg-n{ grid-area:n; min-width:0; } #view-nhl-goals .nhg-n b{ font-size:0.88rem; white-space:nowrap; } #view-nhl-goals .nhg-n small{ font-size:0.68rem; }
  #view-nhl-goals .nhg-main > .nhg-badge{ grid-area:badge; width:40px; height:40px; font-size:0.9rem; }
  #view-nhl-goals .nhg-main > .nhg-ch{ grid-area:ch; display:flex !important; flex-direction:row !important; align-items:center !important; gap:7px !important; min-width:0; }
  #view-nhl-goals .nhg-ch b{ font-size:0.82rem; min-width:0 !important; } #view-nhl-goals .nhg-cb{ display:block !important; flex:1 1 auto !important; height:5px !important; }
  #view-nhl-goals .nhg-main > .nhg-bk{ grid-area:bk; display:flex !important; flex-direction:row !important; align-items:center; justify-content:flex-end; gap:6px !important; }
  #view-nhl-goals .nhg-bk b{ font-size:0.82rem; } #view-nhl-goals .nhg-bk small{ font-size:0.62rem; }
  #view-nhl-goals .nhg-main > .nhg-chev{ grid-area:chev; }
  #view-nhl-goals .nhg-detail{ grid-template-columns:1fr !important; gap:12px !important; padding:12px 10px !important; }
  #view-nhl-goals .nhg-comp{ grid-template-columns:minmax(0, 1fr) 1fr 36px !important; font-size:0.74rem; }
  #view-nhl-goals .nhg-detail .btn{ width:100%; justify-content:center; }
  #view-nhl-goals .nhl-sel{ width:100%; } #view-nhl-goals #nhg-q{ width:100%; min-height:44px; font-size:16px; }   /* 16px: stops iOS zooming the page when the box is focused */
}
/* NHL props: period + special markets live in a dropdown next to the main market chips */
#nhl-mkts select{ background:var(--surface-2,#141b25); color:var(--text); border:1px solid var(--border); border-radius:999px; padding:7px 14px; font-weight:600; font-size:0.85rem; cursor:pointer; max-width:100%; }
#nhl-mkts select.active{ border-color:var(--accent); color:var(--accent); }
.nhl-search-pill{ background:#4f9dff; color:#04101f; font-weight:800; font-size:0.62rem; }
.site-search-row .nhl-logo{ width:18px; height:18px; }
/* ---------- shared chart polish: one look for every bar chart on the site ---------- */
.pm-svg, .nbm-chart svg, .nhp-svg, .tdr-rzs, .tdr-sepsvg, .tr-svg{ background:linear-gradient(180deg, color-mix(in srgb, var(--surface-2) 70%, transparent), transparent); border-radius:12px; padding:6px 4px 2px; box-sizing:border-box; }
.pm-svg rect:not([fill="none"]), .nbm-chart svg rect[rx], .nhp-svg rect, .tdr-rzs rect, .tdr-sepsvg rect{ rx:4px; ry:4px; transition:opacity .15s ease, filter .15s ease; transform-box:fill-box; transform-origin:bottom; animation:chartGrow .55s cubic-bezier(.2,.8,.2,1) both; }
.pm-svg rect:hover, .nbm-chart svg rect:hover, .nhp-svg rect:hover, .tdr-rzs rect:hover, .tdr-sepsvg rect:hover{ filter:brightness(1.18) saturate(1.1); opacity:1 !important; }
@keyframes chartGrow{ from{ transform:scaleY(0.02); opacity:0.3; } to{ transform:scaleY(1); } }
@media (prefers-reduced-motion: reduce){ .pm-svg rect, .nbm-chart svg rect, .nhp-svg rect, .tdr-rzs rect, .tdr-sepsvg rect{ animation:none; } }
.pm-grid, .nbm-grid, .tdr-grid, .tr-grid{ stroke:var(--border); stroke-dasharray:2 5; opacity:0.7; }
.pm-txt, .nbm-ax, .tdr-ax{ fill:var(--text-muted); font-size:10.5px; font-weight:500; }
.nbp-avg, .tdr-avg, .nbm-avg{ stroke:var(--accent); stroke-width:1.6; stroke-dasharray:6 4; opacity:0.95; }
.nbp-legend{ display:flex; flex-wrap:wrap; gap:6px 16px; align-items:center; font-size:0.74rem; color:var(--text-muted); margin:6px 2px 4px; }
.nbp-legend i{ display:inline-block; width:10px; height:10px; border-radius:3px; margin-right:5px; vertical-align:-1px; }
.nbp-w, .nbp-l{ rx:4px; }
.nbp-legend i.nbp-w{ background:var(--good); } .nbp-legend i.nbp-l{ background:var(--danger); }
.nbp-chart, .tdr-panel svg{ max-width:100%; }/* ---------- UFC research ---------- */
:root{ --ufb:#ff8a3d; }
body.sport-ufc #subtabs-ufc{ display:flex; }
#subtabs-ufc{ display:none; }
.ufc-panel .panel-head{ margin-bottom:6px; }
/* event tabs */
.uf-events{ gap:8px; margin:12px 0; } .uf-events button i{ font-style:normal; margin-left:8px; font-size:.7rem; opacity:.75; }
.uf-ev-head{ display:flex; align-items:center; gap:14px; flex-wrap:wrap; padding:14px 16px; margin:6px 0 10px; border:1px solid var(--border); border-radius:14px; background:linear-gradient(120deg, color-mix(in srgb, var(--accent) 9%, var(--surface-2)), var(--surface-2) 70%); }
.uf-ev-head h3{ margin:0; font-family:'Oswald',sans-serif; font-size:1.35rem; letter-spacing:.02em; text-transform:uppercase; } .uf-ev-head span{ color:var(--text-muted); font-size:.84rem; } .uf-ev-head > div:first-child{ flex:1 1 260px; min-width:0; }
.uf-ev-n{ text-align:center; padding:6px 16px; border-radius:12px; background:var(--surface); border:1px solid var(--border); } .uf-ev-n b{ display:block; font-family:'Oswald',sans-serif; font-size:1.4rem; line-height:1.1; } .uf-ev-n small{ font-size:.62rem; letter-spacing:.08em; text-transform:uppercase; color:var(--text-muted); font-weight:700; }
/* a fight */
.uf-list{ display:flex; flex-direction:column; gap:10px; }
.uf-fight{ position:relative; border:1px solid var(--border); border-radius:16px; background:var(--surface-2); padding:12px 16px 10px; overflow:hidden; }
.uf-fight.main{ border-color:color-mix(in srgb, var(--accent) 55%, var(--border)); box-shadow:0 14px 40px -28px var(--accent); }
.uf-meta{ display:flex; flex-wrap:wrap; gap:4px 10px; align-items:center; font-size:.7rem; letter-spacing:.05em; text-transform:uppercase; font-weight:700; color:var(--text-muted); margin-bottom:10px; }
.uf-meta .uf-wc{ color:var(--text); } .uf-meta span + span::before{ content:'·'; margin-right:10px; opacity:.6; } .uf-meta .uf-main-b{ margin-left:auto; padding:2px 10px; border-radius:99px; background:var(--accent); color:#04130a; } .uf-meta .uf-main-b::before{ content:none !important; margin:0; }
.uf-main{ display:grid; grid-template-columns:minmax(0, 1fr) minmax(190px, 260px) minmax(0, 1fr); gap:12px 18px; align-items:center; }
.uf-side{ display:flex; align-items:center; gap:12px; min-width:0; } .uf-side.b{ flex-direction:row-reverse; text-align:right; }
.uf-who{ display:flex; align-items:center; gap:12px; min-width:0; padding:0; background:none; border:0; color:inherit; font:inherit; cursor:pointer; text-align:inherit; } .uf-side.b .uf-who{ flex-direction:row-reverse; }
.uf-who b{ display:block; font-size:1.02rem; line-height:1.2; } .uf-who:hover b{ color:var(--accent); text-decoration:underline; text-underline-offset:3px; }
.uf-who small{ display:flex; align-items:center; gap:6px; color:var(--text-muted); font-size:.74rem; margin-top:2px; } .uf-side.b .uf-who small{ justify-content:flex-end; }
.uf-flag{ width:18px; height:12px; object-fit:cover; border-radius:2px; }
.uf-odds{ margin-left:auto; } .uf-side.b .uf-odds{ margin-left:0; margin-right:auto; }
.uf-odds b{ font-family:'Oswald',sans-serif; font-size:1.15rem; padding:4px 10px; border-radius:10px; background:var(--surface); border:1px solid var(--border); } .uf-odds b.fav{ color:var(--accent); } .uf-odds b.dog{ color:var(--ufb); }
/* photos */
.uf-ph{ position:relative; display:inline-flex; align-items:center; justify-content:center; flex:none; width:58px; height:58px; border-radius:50%; overflow:hidden; background:var(--surface); border:2px solid var(--accent); }
.uf-ph.b{ border-color:var(--ufb); } .uf-ph.sm{ width:34px; height:34px; border-width:1.5px; } .uf-ph.lg{ width:92px; height:92px; border-width:3px; }
.uf-ph b{ font-family:'Oswald',sans-serif; font-size:1rem; color:var(--text-muted); } .uf-ph img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:top; }
/* middle */
.uf-mid{ text-align:center; }
.uf-big{ display:flex; align-items:baseline; justify-content:center; gap:10px; } .uf-big b{ font-family:'Oswald',sans-serif; font-size:1.6rem; line-height:1; color:var(--text-muted); } .uf-big b.lean{ color:var(--text); } .uf-big small{ font-size:.6rem; letter-spacing:.08em; text-transform:uppercase; color:var(--text-muted); font-weight:700; }
.uf-split{ position:relative; display:flex; height:10px; border-radius:99px; overflow:hidden; background:var(--surface); margin:6px 0; } .uf-split i{ display:block; height:100%; } .uf-split i.a{ background:var(--accent); } .uf-split i.b{ background:var(--ufb); }
.uf-split span{ position:absolute; top:50%; transform:translateY(-50%); font-size:.66rem; font-weight:800; color:#04130a; padding:0 8px; } .uf-split span.l{ left:0; } .uf-split span.r{ right:0; }
.uf-split:has(span){ height:20px; } .uf-split.slim{ height:8px; }
.uf-chips{ display:flex; flex-wrap:wrap; justify-content:center; gap:6px; margin-top:6px; } .uf-chips span{ font-size:.68rem; color:var(--text-muted); padding:2px 8px; border-radius:8px; background:var(--surface); border:1px solid var(--border); } .uf-chips b{ color:var(--text); } .uf-chips .edge{ border-color:color-mix(in srgb, var(--accent) 55%, var(--border)); }
.uf-lean{ margin-top:10px; padding:8px 12px; border-radius:10px; background:var(--surface); font-size:.84rem; display:flex; flex-wrap:wrap; gap:4px 10px; align-items:center; } .uf-lean b{ color:var(--accent); } .uf-endq{ margin-left:auto; color:var(--text-muted); font-size:.76rem; }
.uf-val{ font-style:normal; font-size:.66rem; font-weight:800; padding:1px 8px; border-radius:99px; background:color-mix(in srgb, var(--accent) 22%, transparent); color:var(--accent); border:1px solid color-mix(in srgb, var(--accent) 50%, transparent); white-space:nowrap; }
.uf-more{ display:flex; align-items:center; justify-content:center; gap:8px; width:100%; margin-top:8px; padding:8px; background:none; border:0; border-top:1px solid var(--border); color:var(--text-muted); font:inherit; font-size:.78rem; font-weight:700; cursor:pointer; } .uf-more:hover{ color:var(--accent); } .uf-more i{ font-style:normal; font-size:.7rem; }
/* detail */
.uf-detail{ margin-top:4px; } .uf-detail-in{ display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:14px 22px; padding-top:6px; }
.uf-sec{ min-width:0; padding:12px 14px; border:1px solid var(--border); border-radius:14px; background:var(--surface); } .uf-sec h4{ margin:0 0 8px; font-family:'Oswald',sans-serif; font-size:.95rem; letter-spacing:.04em; text-transform:uppercase; } .uf-sec h4 small{ font-family:Inter,sans-serif; text-transform:none; letter-spacing:0; font-weight:500; color:var(--text-muted); font-size:.72rem; margin-left:6px; }
.uf-detail-in > .uf-sec:nth-child(3), .uf-detail-in > .uf-sec:nth-child(4){ grid-row:span 2; } .uf-hist{ grid-column:1 / -1; }
.uf-p3{ margin-bottom:6px; } .uf-p3 > span{ font-size:.68rem; letter-spacing:.06em; text-transform:uppercase; color:var(--text-muted); font-weight:700; }
.uf-why{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:7px; font-size:.84rem; line-height:1.45; color:var(--text-muted); } .uf-why li{ padding:8px 10px; border-left:3px solid var(--accent); border-radius:0 10px 10px 0; background:var(--surface-2); } .uf-why b{ color:var(--text); }
.uf-rows{ display:flex; flex-direction:column; gap:6px; }
.uf-row{ display:grid; grid-template-columns:62px minmax(0, 1fr) 62px; gap:10px; align-items:center; } .uf-row > b{ font-family:'Oswald',sans-serif; font-size:1rem; color:var(--text-muted); } .uf-row > b:first-child{ text-align:right; } .uf-row > b.win{ color:var(--text); }
.uf-rb{ text-align:center; } .uf-rb span{ display:block; font-size:.66rem; letter-spacing:.04em; text-transform:uppercase; font-weight:700; color:var(--text-muted); margin-bottom:3px; }
.uf-rbar{ display:flex; height:7px; border-radius:99px; overflow:hidden; background:var(--surface-2); } .uf-rbar i{ display:block; height:100%; } .uf-rbar i.a{ background:var(--accent); } .uf-rbar i.b{ background:var(--ufb); margin-left:2px; }
.uf-end{ display:grid; grid-template-columns:repeat(4, 1fr); gap:8px; margin-bottom:10px; } .uf-end > div{ padding:8px 6px; text-align:center; border-radius:12px; background:var(--surface-2); border:1px solid var(--border); } .uf-end small{ display:block; font-size:.58rem; letter-spacing:.07em; text-transform:uppercase; color:var(--text-muted); font-weight:700; } .uf-end b{ font-family:'Oswald',sans-serif; font-size:1.25rem; }
.uf-mtab td small{ display:block; color:var(--text-muted); font-size:.66rem; } .uf-mtab td em{ display:inline-block; margin-top:2px; font-style:normal; font-size:.6rem; font-weight:800; color:var(--accent); }
.uf-hcols{ display:grid; grid-template-columns:1fr 1fr; gap:14px; } .uf-hcols ul{ list-style:none; margin:6px 0 0; padding:0; display:flex; flex-direction:column; gap:4px; }
.uf-hcols li{ display:grid; grid-template-columns:26px minmax(0, 1fr); grid-template-rows:auto auto; gap:0 8px; padding:6px 8px; border-radius:10px; background:var(--surface-2); font-size:.82rem; } .uf-hcols li b{ grid-row:1 / 3; align-self:center; text-align:center; font-family:'Oswald',sans-serif; color:var(--text-muted); } .uf-hcols li.w b{ color:var(--accent); } .uf-hcols li.l b{ color:#ff6b6b; } .uf-hcols li small{ color:var(--text-muted); font-size:.68rem; } .uf-hcols li span{ white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
/* fighters table */
.uf-filters{ margin:10px 0; } .uf-table td.uf-nm{ display:flex; align-items:center; gap:10px; min-width:200px; } .uf-table td.uf-nm b{ display:block; } .uf-table td.uf-nm small{ display:block; color:var(--text-muted); font-size:.68rem; font-weight:500; } .uf-table tr[data-uf-fighter]{ cursor:pointer; } .uf-table tr[data-uf-fighter]:hover td{ background:color-mix(in srgb, var(--accent) 6%, transparent); } .uf-table td, .uf-table th{ white-space:nowrap; }
/* profile window */
.ufc-card-w{ max-width:880px !important; } .uf-prof{ padding-top:4px; }
.uf-ph-head{ display:flex; align-items:center; gap:16px; margin-bottom:12px; padding-right:44px; } .uf-ph-head h2{ margin:0; font-family:'Oswald',sans-serif; font-size:1.8rem; line-height:1.1; text-transform:uppercase; }
.uf-sub{ display:flex; align-items:center; flex-wrap:wrap; gap:4px 8px; color:var(--text-muted); font-size:.84rem; margin-top:4px; }
.uf-bio{ display:flex; flex-wrap:wrap; gap:8px; margin-top:10px; } .uf-bio span{ padding:5px 12px; border-radius:10px; background:var(--surface-2); border:1px solid var(--border); font-size:.66rem; letter-spacing:.06em; text-transform:uppercase; color:var(--text-muted); font-weight:700; } .uf-bio b{ display:block; font-family:'Oswald',sans-serif; font-size:1rem; letter-spacing:0; color:var(--text); text-transform:none; }
.uf-mixrow{ margin:8px 0 2px; } .uf-mixrow > span{ font-size:.68rem; letter-spacing:.06em; text-transform:uppercase; color:var(--text-muted); font-weight:700; }
.uf-mix{ display:flex; height:26px; border-radius:99px; overflow:hidden; margin-top:4px; background:var(--surface-2); } .uf-mix i{ display:flex; align-items:center; justify-content:center; font-style:normal; font-size:.66rem; font-weight:800; color:#04130a; white-space:nowrap; overflow:hidden; } .uf-mix i.h{ background:var(--accent); } .uf-mix i.b{ background:#7bdcff; } .uf-mix i.l{ background:var(--ufb); }
.uf-res{ display:inline-flex; align-items:center; justify-content:center; width:24px; height:22px; border-radius:7px; font-weight:800; font-size:.76rem; background:var(--surface-2); } .uf-res.W{ background:color-mix(in srgb, var(--accent) 24%, transparent); color:var(--accent); } .uf-res.L{ background:rgba(255,107,107,.2); color:#ff6b6b; }
/* compare */
.uf-pick{ display:grid; grid-template-columns:minmax(0, 1fr) auto minmax(0, 1fr); gap:12px; align-items:center; margin:12px 0; } .uf-vs{ font-family:'Oswald',sans-serif; color:var(--text-muted); letter-spacing:.1em; }
.uf-pickbox{ min-width:0; padding:10px 12px; border:1px solid var(--accent); border-radius:14px; background:var(--surface-2); } .uf-pickbox.b{ border-color:var(--ufb); }
.uf-picked{ display:flex; align-items:center; gap:12px; } .uf-picked > span:not(.uf-ph){ flex:1; min-width:0; } .uf-picked b{ display:block; } .uf-picked small{ color:var(--text-muted); font-size:.74rem; }
.uf-x{ width:32px; height:32px; border-radius:50%; border:1px solid var(--border); background:var(--surface); color:inherit; cursor:pointer; }
.uf-search{ position:relative; } .uf-search input{ width:100%; height:44px; border:0; outline:0; background:transparent; color:var(--text); font:inherit; font-size:1rem; font-weight:600; }
.uf-sug{ position:absolute; left:-12px; right:-12px; top:calc(100% + 10px); z-index:30; max-height:340px; overflow:auto; padding:6px; border:1px solid var(--border); border-radius:14px; background:var(--surface, #12161d); box-shadow:0 18px 50px -10px rgba(0,0,0,.75); }
.uf-sug button{ display:flex; align-items:center; gap:10px; width:100%; padding:8px 10px; min-height:50px; border:0; border-radius:10px; background:none; color:var(--text); font:inherit; text-align:left; cursor:pointer; } .uf-sug button:hover{ background:color-mix(in srgb, var(--accent) 14%, transparent); } .uf-sug b{ display:block; } .uf-sug small{ color:var(--text-muted); font-size:.74rem; }
.uf-cmp-top{ margin:10px auto 14px; text-align:center; max-width:720px; }
.uf-quick h4{ font-family:'Oswald',sans-serif; text-transform:uppercase; margin:14px 0 8px; } .uf-qlist{ display:grid; grid-template-columns:repeat(auto-fill, minmax(260px, 1fr)); gap:8px; } .uf-qlist button{ padding:10px 12px; text-align:left; border:1px solid var(--border); border-radius:12px; background:var(--surface-2); color:var(--text); font:inherit; cursor:pointer; } .uf-qlist button:hover{ border-color:var(--accent); } .uf-qlist small{ display:block; color:var(--text-muted); font-size:.68rem; margin-top:2px; }
.uf-gloss{ display:grid; grid-template-columns:repeat(auto-fill, minmax(280px, 1fr)); gap:8px; } .uf-gloss > div{ padding:10px 12px; border:1px solid var(--border); border-radius:12px; background:var(--surface-2); } .uf-gloss b{ display:block; margin-bottom:2px; } .uf-gloss span{ color:var(--text-muted); font-size:.82rem; line-height:1.4; }
/* phones */
@media (max-width:860px){ .uf-detail-in{ grid-template-columns:minmax(0, 1fr); } .uf-detail-in > .uf-sec:nth-child(3), .uf-detail-in > .uf-sec:nth-child(4){ grid-row:auto; } }
@media (max-width:700px){
  .uf-main{ grid-template-columns:minmax(0, 1fr) minmax(0, 1fr); } .uf-mid{ grid-column:1 / -1; grid-row:2; } .uf-side{ flex-direction:column; align-items:center; text-align:center; gap:8px; } .uf-side.b{ flex-direction:column; text-align:center; }
  .uf-who, .uf-side.b .uf-who{ flex-direction:column; text-align:center; } .uf-who small, .uf-side.b .uf-who small{ justify-content:center; } .uf-odds, .uf-side.b .uf-odds{ margin:0; }
  .uf-ph{ width:64px; height:64px; } .uf-who b{ font-size:.96rem; }
  .uf-fight{ padding:12px 12px 8px; } .uf-meta .uf-main-b{ margin-left:0; } .uf-lean .uf-endq{ margin-left:0; flex-basis:100%; }
  .uf-ph-head{ flex-direction:column; align-items:flex-start; padding-right:0; } .uf-ph-head h2{ font-size:1.5rem; }
  .uf-pick{ grid-template-columns:minmax(0, 1fr); } .uf-vs{ text-align:center; }
  .uf-hcols{ grid-template-columns:minmax(0, 1fr); } .uf-end{ grid-template-columns:repeat(2, 1fr); } .uf-row{ grid-template-columns:50px minmax(0, 1fr) 50px; gap:8px; }
  .uf-ev-head{ padding:12px; } .uf-ev-head h3{ font-size:1.15rem; }
  #view-ufc-card .nhl-dates, .uf-events{ flex-wrap:nowrap; overflow-x:auto; scrollbar-width:none; max-width:100%; } .uf-events::-webkit-scrollbar{ display:none; } .uf-events button{ flex:none; white-space:nowrap; }
  .ufc-panel, #view-ufc-card, #view-ufc-fighters, #view-ufc-compare{ min-width:0; max-width:100%; }
}
@media (max-width:700px){ .uf-table{ min-width:0 !important; width:100%; } .uf-table tr > *:nth-child(n){ display:none; } .uf-table tr > *:nth-child(1), .uf-table tr > *:nth-child(5), .uf-table tr > *:nth-child(8), .uf-table tr > *:nth-child(9), .uf-table tr > *:nth-child(12){ display:table-cell; } .uf-table td.uf-nm{ min-width:0; white-space:normal; } .uf-table td, .uf-table th{ padding:9px 5px; } .uf-table td.uf-nm small{ font-size:.62rem; } .uf-table .uf-ph.sm{ display:none; } }
/* ---------- live reports (injury / practice notes + news), see snippet-reports.js ---------- */
.spr-live:empty{ display:none; }
.spr-card{ border:1px solid var(--border); border-radius:16px; background:var(--surface); padding:16px 16px 14px; margin:0 0 18px; min-width:0; }
.spr-head{ display:flex; align-items:flex-start; justify-content:space-between; gap:12px; flex-wrap:wrap; margin-bottom:10px; }
.spr-head h3{ margin:0 0 3px; font-family:'Oswald',sans-serif; font-size:1.15rem; letter-spacing:0.01em; }
.spr-head .hint{ margin:0; max-width:62ch; }
.spr-live-tag{ display:inline-flex; align-items:center; gap:6px; font-size:0.72rem; font-weight:700; color:var(--good); border:1px solid color-mix(in srgb, var(--good) 40%, var(--border)); border-radius:999px; padding:4px 10px; white-space:nowrap; }
.spr-live-tag i{ width:7px; height:7px; border-radius:50%; background:var(--good); box-shadow:0 0 0 0 color-mix(in srgb, var(--good) 60%, transparent); animation:sprPulse 2s infinite; }
.spr-live-tag small{ color:var(--text-muted); font-weight:500; font-size:0.7rem; }
@keyframes sprPulse{ 0%{ box-shadow:0 0 0 0 color-mix(in srgb, var(--good) 55%, transparent); } 70%{ box-shadow:0 0 0 7px transparent; } 100%{ box-shadow:0 0 0 0 transparent; } }
@media (prefers-reduced-motion:reduce){ .spr-live-tag i{ animation:none; } }
.spr-ctl{ display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap; margin:6px 0 12px; }
.spr-q{ min-width:200px; flex:0 1 260px; }
.spr-list{ display:grid; gap:8px; }
.spr-row{ display:grid; grid-template-columns:44px minmax(0, 1fr); gap:12px; align-items:start; padding:10px 12px; border:1px solid var(--border); border-radius:14px; background:var(--bg); }
.spr-hs{ width:44px; height:44px; border-radius:50%; object-fit:cover; object-position:top; background:var(--surface-2); display:block; }
.spr-top{ display:flex; align-items:baseline; justify-content:space-between; gap:10px; flex-wrap:wrap; }
.spr-top b{ font-size:0.95rem; }
.spr-meta{ display:inline-flex; align-items:center; gap:5px; font-size:0.74rem; color:var(--text-muted); }
.spr-meta img{ width:16px; height:16px; object-fit:contain; }
.spr-line{ display:flex; align-items:center; flex-wrap:wrap; gap:4px 8px; margin:5px 0 3px; font-size:0.76rem; color:var(--text-muted); }
.spr-line em{ font-style:normal; }
.spr-line time{ margin-left:auto; white-space:nowrap; font-size:0.72rem; }
.spr-pill{ font-size:0.68rem; font-weight:800; letter-spacing:0.03em; padding:2px 9px; border-radius:999px; text-transform:uppercase; }
.spr-pill.out{ background:var(--danger-bg, rgba(166,54,47,0.18)); color:var(--danger); }
.spr-pill.dbt{ background:rgba(224,130,48,0.18); color:#e08230; }
.spr-pill.q{ background:rgba(224,176,48,0.18); color:#d9a520; }
.spr-pill.ok{ background:var(--good-bg, rgba(46,125,79,0.16)); color:var(--good); }
.spr-row p{ margin:4px 0 0; font-size:0.82rem; line-height:1.5; }
.spr-row details{ margin-top:4px; font-size:0.78rem; color:var(--text-muted); }
.spr-row details summary{ cursor:pointer; color:var(--accent); font-weight:600; width:max-content; }
.spr-row details p{ color:var(--text-muted); }
.spr-more{ margin:12px auto 0; display:block; }
.spr-news{ display:grid; grid-template-columns:120px minmax(0, 1fr); gap:14px; align-items:start; padding:10px; border:1px solid var(--border); border-radius:14px; background:var(--bg); color:var(--text); text-decoration:none; }
.spr-news:hover{ border-color:color-mix(in srgb, var(--accent) 55%, var(--border)); }
.spr-news:not(:has(img)){ grid-template-columns:1fr; }
.spr-news img{ width:120px; height:80px; object-fit:cover; border-radius:10px; background:var(--surface-2); }
.spr-news b{ display:block; font-size:0.95rem; line-height:1.3; margin-bottom:3px; }
.spr-news p{ margin:0 0 5px; font-size:0.8rem; color:var(--text-muted); line-height:1.45; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.spr-news span{ font-size:0.72rem; color:var(--text-muted); }
.spr-news span i{ font-style:normal; font-weight:700; font-size:0.64rem; letter-spacing:0.05em; text-transform:uppercase; color:var(--accent); margin-right:7px; }
.spr-retry{ background:none; border:0; color:var(--accent); font:inherit; font-weight:600; cursor:pointer; padding:0; text-decoration:underline; }
/* NBA: once the live ESPN list is showing, hide the build-time snapshot underneath it */
.spr-live:not(:empty) + #nba-nw-body{ display:none; }
@media (max-width:640px){
  .spr-card{ padding:12px 10px; border-radius:14px; }
  .spr-row{ grid-template-columns:38px minmax(0, 1fr); gap:10px; padding:9px 10px; }
  .spr-hs{ width:38px; height:38px; }
  .spr-news{ grid-template-columns:92px minmax(0, 1fr); gap:10px; }
  .spr-news img{ width:92px; height:68px; }
  .spr-q{ flex:1 1 100%; min-height:44px; font-size:16px; }
  .spr-line time{ margin-left:0; }
}
/* ---------- Start/Sit Studio (owner only): controls + a 1280x720 / 720x1280 broadcast stage that is exported to PNG / WebM ---------- */
body.consumer-mode #tab-ss-studio, body.consumer-mode #view-ss-studio{ display:none !important; }
.sst-page .panel-head{ flex-wrap:wrap; gap:8px; }
.sst-ctl{ display:flex; flex-wrap:wrap; gap:12px 18px; align-items:flex-end; margin:6px 0 12px; }
.sst-picks{ display:flex; flex-wrap:wrap; gap:8px; align-items:center; }
.sst-pk{ position:relative; display:flex; flex-wrap:wrap; gap:4px; align-items:center; max-width:100%; }
.sst-call{ display:flex; width:100%; border:1px solid var(--border); border-radius:999px; overflow:hidden; }
.sst-call button{ flex:1; background:var(--surface-2, #141b25); color:var(--text-muted); border:0; padding:6px 8px; font-size:0.75rem; font-weight:800; letter-spacing:0.06em; cursor:pointer; }
.sst-call button + button{ border-left:1px solid var(--border); }
.sst-call button.on{ background:#2a3544; color:#fff; } .sst-call button.st.on{ background:var(--accent); color:#04130a; } .sst-call button.si.on{ background:#ff5d5d; color:#fff; }
.sst-pick{ width:260px; max-width:100%; background:var(--surface-2, #141b25); color:var(--text); border:1px solid var(--border); border-radius:10px; padding:9px 12px; font-size:0.9rem; }
.sst-rm{ background:transparent; border:1px solid var(--border); color:var(--text-muted); border-radius:999px; width:28px; height:28px; cursor:pointer; }
.sst-opts{ display:flex; flex-wrap:wrap; gap:10px; align-items:center; }
.sst-opts label{ display:flex; gap:6px; align-items:center; font-size:0.85rem; color:var(--text-muted); }
.sst-opts select, .sst-bar2 select{ background:var(--surface-2, #141b25); color:var(--text); border:1px solid var(--border); border-radius:8px; padding:6px 8px; }
.sst-strip{ display:flex; gap:6px; overflow-x:auto; padding:4px 0 10px; scrollbar-width:thin; }
.sst-strip button{ flex:none; display:flex; gap:6px; align-items:center; background:var(--surface-2, #141b25); color:var(--text-muted); border:1px solid var(--border); border-radius:999px; padding:6px 12px; font-size:0.78rem; font-weight:700; cursor:pointer; white-space:nowrap; }
.sst-strip button i{ font-style:normal; display:inline-grid; place-items:center; width:18px; height:18px; border-radius:50%; background:rgba(255,255,255,0.08); font-size:0.7rem; }
.sst-strip button.on{ color:#04130a; background:var(--accent); border-color:var(--accent); } .sst-strip button.on i{ background:rgba(0,0,0,0.18); }
.sst-host{ width:100%; display:flex; justify-content:center; background:#05070a; border:1px solid var(--border); border-radius:14px; padding:10px; box-sizing:border-box; overflow:hidden; }
.sst-outer{ position:relative; overflow:hidden; border-radius:12px; flex:none; }
.sst-fit{ position:absolute; left:0; top:0; }
.sst-bar2{ display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin:12px 0; }
.sst-bar2 .btn.on{ border-color:var(--accent); color:var(--accent); }
.sst-notes{ display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.sst-notes h4{ margin:0 0 8px; display:flex; gap:10px; align-items:center; justify-content:space-between; font-size:0.9rem; }
.sst-notes ul{ margin:0; padding-left:18px; display:grid; gap:7px; font-size:0.9rem; line-height:1.45; }
.sst-notes textarea{ width:100%; box-sizing:border-box; background:var(--surface-2, #141b25); color:var(--text); border:1px solid var(--border); border-radius:10px; padding:10px; font:inherit; font-size:0.85rem; resize:vertical; }
@media (max-width:760px){ .sst-notes{ grid-template-columns:1fr; } .sst-pick{ width:100%; } .sst-pk{ width:100%; } }

/* present mode: the stage takes the whole screen */
body.sst-present-on{ overflow:hidden; }
#view-ss-studio.sst-presenting .sst-page{ position:fixed; inset:0; z-index:9998; margin:0; padding:0; border:0; border-radius:0; background:radial-gradient(1200px 700px at 50% 0%, #0d1520, #05070a); display:flex; flex-direction:column; align-items:center; overflow:hidden; }
#view-ss-studio.sst-presenting .panel-head, #view-ss-studio.sst-presenting .page-sub, #view-ss-studio.sst-presenting .hint, #view-ss-studio.sst-presenting .sst-ctl, #view-ss-studio.sst-presenting .sst-strip, #view-ss-studio.sst-presenting .sst-bar2, #view-ss-studio.sst-presenting .sst-notes{ display:none; }
#view-ss-studio.sst-presenting #sst-root{ width:100%; display:flex; justify-content:center; }
#view-ss-studio.sst-presenting .sst-host{ border:0; background:transparent; padding:52px 0 0; }
#sst-pbar{ position:fixed; top:0; left:0; right:0; z-index:9999; display:flex; gap:10px; align-items:center; justify-content:center; padding:8px 14px; background:rgba(8,12,18,0.94); border-bottom:1px solid #1e2630; color:#e8eef5; font-size:0.85rem; font-weight:700; }
#sst-pbar button{ background:#141b25; color:#e8eef5; border:1px solid #2a3544; border-radius:999px; padding:6px 14px; font-weight:700; cursor:pointer; } #sst-pbar button:hover{ border-color:var(--accent); color:var(--accent); }

/* ---------- the stage ---------- */
.sst-stage{ position:relative; box-sizing:border-box; display:flex; flex-direction:column; overflow:hidden; color:#f2f6fb; font-family:Inter,sans-serif; background:#0a0e14; padding:20px 34px 14px;
  --text:#f2f6fb; --text-muted:#93a4b6; --border:#2a3646; --surface:#121a25; --good:#18e255; --danger:#ff5d5d; --warn:#ffc233; --accent:#18e255; }
.sst-stage *{ box-sizing:border-box; }
.sst-bg{ position:absolute; inset:0; z-index:0; background:
    linear-gradient(115deg, color-mix(in srgb, var(--ta) 48%, #0a0e14) 0%, rgba(10,14,20,0.15) 40%, rgba(10,14,20,0.15) 60%, color-mix(in srgb, var(--tb) 38%, #0a0e14) 100%),
    radial-gradient(900px 420px at 50% 112%, color-mix(in srgb, var(--accent) 14%, transparent), transparent 70%),
    repeating-linear-gradient(90deg, rgba(255,255,255,0.025) 0 1px, transparent 1px 64px); }
.sst-stage > *:not(.sst-bg){ position:relative; z-index:1; }
.sst-top{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:10px; flex:none; }
.sst-brand{ font-family:'Oswald',sans-serif; font-size:26px; letter-spacing:0.05em; } .sst-brand span{ color:var(--accent); }
.sst-title{ font-family:'Oswald',sans-serif; font-size:19px; letter-spacing:0.18em; color:#c4d0dc; }
.sst-count{ font-family:'Oswald',sans-serif; font-size:22px; background:rgba(0,0,0,0.35); border:1px solid #2a3646; border-radius:999px; padding:1px 15px; } .sst-count small{ color:#8fa0b2; font-size:14px; }
.sst-body{ flex:1; min-height:0; display:flex; flex-direction:column; justify-content:center; }
.sst-foot{ display:flex; justify-content:space-between; gap:10px; margin-top:8px; flex:none; font-size:12px; letter-spacing:0.08em; color:#7d8da0; text-transform:uppercase; } .sst-foot span:nth-child(2){ color:var(--accent); font-weight:700; }

.sst-face{ width:84px; height:84px; flex:none; border-radius:50%; overflow:hidden; background:#1a2330; border:3px solid var(--c, var(--accent)); box-shadow:0 0 0 4px rgba(255,255,255,0.05), 0 8px 24px rgba(0,0,0,0.5); display:grid; place-items:center; font-family:'Oswald',sans-serif; font-size:30px; }
.sst-face img{ width:100%; height:100%; object-fit:cover; }
.sst-lg{ width:26px; height:26px; object-fit:contain; vertical-align:middle; }
.pill{ display:inline-block; }

/* intro */
.sst-intro{ text-align:center; display:flex; flex-direction:column; align-items:center; gap:14px; }
.sst-kick{ font-family:'Oswald',sans-serif; letter-spacing:0.28em; color:var(--accent); font-size:22px; border:1px solid color-mix(in srgb, var(--accent) 50%, transparent); border-radius:999px; padding:4px 22px; background:color-mix(in srgb, var(--accent) 8%, transparent); }
.sst-intro h1{ margin:0; font-family:'Oswald',sans-serif; font-size:132px; line-height:0.95; letter-spacing:0.02em; text-shadow:0 6px 30px rgba(0,0,0,0.5); } .sst-intro h1 span{ color:var(--accent); }
.sst-faces{ display:flex; align-items:center; justify-content:center; gap:28px; flex-wrap:wrap; }
.sst-faces em{ font-style:normal; font-family:'Oswald',sans-serif; font-size:30px; color:#8fa0b2; }
.sst-fb{ display:flex; flex-direction:column; align-items:center; gap:4px; } .sst-fb .sst-face{ width:128px; height:128px; font-size:44px; } .sst-fb b{ font-family:'Oswald',sans-serif; font-size:28px; letter-spacing:0.03em; } .sst-fb small{ color:#a7b6c6; font-size:15px; }
.sst-sub{ color:#b6c3d1; font-size:20px; letter-spacing:0.04em; }

/* columns (overview, form, bets) */
.sst-cols{ display:grid; grid-template-columns:repeat(var(--n), 1fr); gap:18px; align-items:stretch; }
.sst-col{ background:linear-gradient(180deg, color-mix(in srgb, var(--c) 22%, #0e1520), #0c121b); border:1px solid color-mix(in srgb, var(--c) 45%, #2a3646); border-radius:16px; padding:16px 14px; display:flex; flex-direction:column; align-items:center; gap:8px; text-align:center; min-width:0; }
.sst-card{ display:flex; flex-direction:column; align-items:center; gap:8px; width:100%; position:relative; }
.sst-card .sst-face{ width:112px; height:112px; font-size:38px; }
.sst-card h2{ margin:0; font-family:'Oswald',sans-serif; font-size:30px; letter-spacing:0.02em; line-height:1.05; }
.sst-card.win .sst-face{ border-color:var(--accent); box-shadow:0 0 0 5px color-mix(in srgb, var(--accent) 20%, transparent), 0 0 40px color-mix(in srgb, var(--accent) 35%, transparent); }
.sst-crown{ font-family:'Oswald',sans-serif; letter-spacing:0.18em; font-size:16px; color:#04130a; background:var(--accent); border-radius:999px; padding:2px 16px; }
.sst-crown.sit{ background:#ff5d5d; color:#fff; }
.sst-also > div{ background:color-mix(in srgb, var(--accent) 8%, transparent); border-color:color-mix(in srgb, var(--accent) 40%, transparent); } .sst-also em{ color:var(--accent); } .sst-also .sst-face{ border-color:var(--accent); }
.sst-meta{ display:flex; gap:8px; align-items:center; justify-content:center; font-size:18px; flex-wrap:wrap; } .sst-meta b{ font-family:'Oswald',sans-serif; letter-spacing:0.04em; }
.sst-kickoff{ color:#9fb0c1; font-size:14px; min-height:18px; }
.sst-ring{ --p:0; --rc:#18e255; width:150px; height:150px; border-radius:50%; display:grid; place-content:center; text-align:center; background:radial-gradient(closest-side, #0a0e14 76%, transparent 78% 100%), conic-gradient(var(--rc) calc(var(--p) * 1%), rgba(255,255,255,0.1) 0); }
.sst-ring b{ font-family:'Oswald',sans-serif; font-size:58px; line-height:1; color:var(--rc); }
.sst-ringwrap{ display:grid; justify-items:center; gap:5px; } .sst-ringwrap small{ font-size:11px; letter-spacing:0.18em; color:#9fb0c1; }
.sst-mini{ display:grid; grid-template-columns:repeat(3, 1fr); gap:8px; width:100%; margin-top:4px; }
.sst-mini > div{ display:flex; flex-direction:column; align-items:center; gap:0; background:rgba(0,0,0,0.3); border:1px solid #243041; border-radius:10px; padding:5px 4px; }
.sst-mini small{ font-size:9.5px; letter-spacing:0.14em; color:#8fa0b2; } .sst-mini b{ font-family:'Oswald',sans-serif; font-size:24px; line-height:1.05; } .sst-mini i{ font-style:normal; font-size:10.5px; letter-spacing:0.1em; color:#8fa0b2; min-height:12px; }
.sst-mini .good{ border-color:color-mix(in srgb, var(--accent) 55%, transparent); background:color-mix(in srgb, var(--accent) 10%, transparent); } .sst-mini .good b, .sst-mini .good i{ color:#46f07a; }
.sst-mini .bad{ border-color:rgba(255,93,93,0.55); background:rgba(255,93,93,0.1); } .sst-mini .bad b, .sst-mini .bad i{ color:#ff7a7a; }
.sst-chips{ display:flex; gap:6px; flex-wrap:wrap; justify-content:center; }
.chip{ border:1px solid #2a3646; background:rgba(0,0,0,0.3); border-radius:999px; padding:3px 11px; font-size:13px; color:#c4d0dc; letter-spacing:0.04em; } .chip b{ color:#fff; }
.chip.good{ color:var(--accent); border-color:color-mix(in srgb, var(--accent) 50%, transparent); } .chip.warn{ color:#ffc233; border-color:rgba(255,194,51,0.5); } .chip.bad{ color:#ff5d5d; border-color:rgba(255,93,93,0.5); }
.sst-prac{ display:flex; gap:7px; align-items:center; justify-content:center; font-size:13px; color:#9fb0c1; } .sst-prac span{ letter-spacing:0.14em; font-size:11px; }
.pr{ font-style:normal; font-size:11px; font-weight:800; letter-spacing:0.06em; padding:2px 7px; border-radius:6px; background:#2a3646; color:#c4d0dc; }
.pr.full{ background:color-mix(in srgb, var(--accent) 20%, transparent); color:var(--accent); } .pr.limited{ background:rgba(255,194,51,0.2); color:#ffc233; } .pr.dnp{ background:rgba(255,93,93,0.22); color:#ff5d5d; } .pr.none{ opacity:0.5; }

/* comparison table */
.sst-tbl{ display:flex; flex-direction:column; gap:6px; }
.sst-row{ display:grid; grid-template-columns:230px repeat(var(--n, 2), minmax(0, 1fr)); gap:8px; align-items:stretch; }
.sst-tbl .sst-row{ grid-template-columns:230px repeat(var(--n), minmax(0, 1fr)); }
.sst-lab{ display:flex; flex-direction:column; justify-content:center; font-family:'Oswald',sans-serif; font-size:19px; letter-spacing:0.04em; color:#d5deea; line-height:1.1; } .sst-lab small{ font-family:Inter,sans-serif; letter-spacing:0; font-size:11px; color:#7d8da0; margin-top:2px; text-transform:none; }
.sst-cell{ position:relative; overflow:hidden; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; min-height:46px; padding:5px 8px; border-radius:10px; background:rgba(18,26,37,0.85); border:1px solid #243041; }
.sst-cell b{ font-family:'Oswald',sans-serif; font-size:26px; line-height:1.05; letter-spacing:0.01em; } .sst-cell small{ font-size:11.5px; color:#8fa0b2; line-height:1.2; margin-top:1px; }
.sst-cell.best{ border-color:#ffc233; box-shadow:inset 0 0 0 1px rgba(255,194,51,0.5); background:linear-gradient(180deg, rgba(255,194,51,0.16), rgba(18,26,37,0.85)); } .sst-cell.best b{ color:#ffd166; }
.sst-cell.good{ background:linear-gradient(180deg, color-mix(in srgb, var(--accent) 22%, transparent), rgba(18,26,37,0.85)); border-color:color-mix(in srgb, var(--accent) 55%, transparent); } .sst-cell.good b{ color:#46f07a; }
.sst-cell.bad{ background:linear-gradient(180deg, rgba(255,93,93,0.24), rgba(18,26,37,0.85)); border-color:rgba(255,93,93,0.55); } .sst-cell.bad b{ color:#ff7a7a; }
.sst-cell.best.good, .sst-cell.best.bad{ border-color:#ffc233; box-shadow:inset 0 0 0 1px rgba(255,194,51,0.6); }
.sst-cell.best::after{ content:'▲ EDGE'; position:absolute; top:3px; right:7px; font:800 9px Inter,sans-serif; letter-spacing:0.12em; color:#ffc233; }
.sst-bar{ position:absolute; left:0; bottom:0; height:4px; background:linear-gradient(90deg, var(--accent), #7dffa6); border-radius:0 3px 0 0; }
.sst-hdr .sst-who{ background:transparent; border:0; gap:2px; padding:0 4px; } .sst-hdr .sst-who .sst-face{ width:62px; height:62px; font-size:22px; margin-bottom:2px; }
.sst-hdr .sst-who b{ font-size:22px; } .sst-hdr .sst-who small{ font-size:12.5px; color:#a7b6c6; }
.sst-range .rng{ position:relative; width:100%; height:10px; border-radius:6px; background:rgba(255,255,255,0.1); margin:4px 0; } .sst-range .rng i{ position:absolute; top:0; bottom:0; border-radius:6px; background:linear-gradient(90deg, #ff7a7a, #ffc233, var(--accent)); } .sst-range .rng u{ position:absolute; top:-4px; width:4px; height:18px; background:#fff; border-radius:2px; }
.sst-range b{ font-size:22px; }
.sst-legend{ display:flex; gap:18px; justify-content:center; font-size:12.5px; color:#9fb0c1; margin-bottom:6px; } .sst-legend i{ display:inline-block; width:12px; height:12px; border-radius:3px; margin-right:6px; vertical-align:-1px; background:var(--accent); } .sst-legend i.r{ background:#ff5d5d; } .sst-legend i.c{ background:transparent; border:2px solid #ffc233; }

/* form */
.sst-formh{ display:flex; flex-direction:column; align-items:center; gap:3px; margin-bottom:4px; width:100%; } .sst-formh h2{ margin:0; font-family:'Oswald',sans-serif; font-size:26px; } .sst-formh small{ color:#8fa0b2; font-size:12.5px; }
.sst-formh .sst-face{ width:76px; height:76px; font-size:26px; }
.sst-g{ display:grid; grid-template-columns:70px 1fr 54px; gap:8px; align-items:center; width:100%; }
.sst-g .wk{ font-family:'Oswald',sans-serif; font-size:17px; text-align:left; display:flex; flex-direction:column; line-height:1.05; } .sst-g .wk small{ font-family:Inter,sans-serif; font-size:10.5px; color:#8fa0b2; }
.bars{ position:relative; height:24px; background:rgba(255,255,255,0.06); border-radius:7px; overflow:hidden; } .bars i{ position:absolute; left:0; top:0; bottom:0; border-radius:7px; }
.bars .pj{ background:rgba(255,255,255,0.18); } .bars .ac{ top:7px; bottom:7px; } .bars .ac.up{ background:var(--accent); } .bars .ac.dn{ background:#ff5d5d; }
.sst-g b{ font-family:'Oswald',sans-serif; font-size:23px; text-align:right; } .sst-g b.up, .sst-avg em.up{ color:var(--accent); } .sst-g b.dn, .sst-avg em.dn{ color:#ff7a7a; }
.sst-avg{ margin-top:auto; padding-top:8px; font-family:'Oswald',sans-serif; font-size:22px; letter-spacing:0.06em; color:#c4d0dc; } .sst-avg b{ color:#fff; font-size:30px; } .sst-avg em{ font-style:normal; font-size:15px; margin-left:8px; font-family:Inter,sans-serif; }
.sst-none{ color:#7d8da0; font-size:15px; margin:14px 0; }

/* bets */
.sst-prop{ display:grid; grid-template-columns:1fr auto; gap:0 10px; width:100%; align-items:baseline; text-align:left; background:rgba(0,0,0,0.3); border:1px solid #243041; border-radius:10px; padding:7px 12px; }
.sst-prop span{ font-size:14px; color:#c4d0dc; } .sst-prop b{ font-family:'Oswald',sans-serif; font-size:28px; } .sst-prop small{ grid-column:1 / 3; color:#8fa0b2; font-size:12px; }
.sst-prop.atd b{ color:#ffc233; }
.sst-td{ margin-top:auto; width:100%; background:color-mix(in srgb, var(--accent) 10%, transparent); border:1px solid color-mix(in srgb, var(--accent) 45%, transparent); border-radius:12px; padding:8px 12px; display:grid; } .sst-td span{ font-size:11px; letter-spacing:0.16em; color:var(--accent); } .sst-td b{ font-family:'Oswald',sans-serif; font-size:42px; line-height:1; } .sst-td small{ color:#9fb0c1; font-size:12.5px; }

/* verdict */
.sst-verdict{ display:flex; flex-direction:column; gap:14px; }
.sst-vcard{ display:flex; align-items:center; gap:22px; padding:18px 24px; border-radius:18px; background:linear-gradient(115deg, color-mix(in srgb, var(--c) 40%, #0e1520), #0c121b 70%); border:2px solid var(--accent); box-shadow:0 0 50px color-mix(in srgb, var(--accent) 20%, transparent); }
.sst-vcard .sst-face{ width:132px; height:132px; font-size:44px; border-color:var(--accent); }
.sst-vcard > div:nth-child(2){ flex:1; min-width:0; } .sst-vk{ font-family:'Oswald',sans-serif; letter-spacing:0.3em; font-size:26px; color:var(--accent); }
.sst-vcard h1{ margin:0; font-family:'Oswald',sans-serif; font-size:68px; line-height:1; letter-spacing:0.01em; }
.sst-vscore{ text-align:center; } .sst-vscore b{ display:block; font-family:'Oswald',sans-serif; font-size:84px; line-height:1; color:var(--accent); } .sst-vscore small{ letter-spacing:0.16em; font-size:13px; color:#9fb0c1; }
.sst-sit{ display:flex; gap:12px; flex-wrap:wrap; } .sst-sit > div{ display:flex; gap:12px; align-items:center; flex:1; min-width:0; background:rgba(255,93,93,0.08); border:1px solid rgba(255,93,93,0.4); border-radius:14px; padding:8px 14px; }
.sst-sit em{ font-style:normal; font-family:'Oswald',sans-serif; letter-spacing:0.2em; color:#ff7a7a; font-size:20px; } .sst-sit .sst-face{ width:50px; height:50px; font-size:18px; border-color:#ff5d5d; } .sst-sit b{ font-family:'Oswald',sans-serif; font-size:24px; } .sst-sit small{ color:#a7b6c6; margin-left:auto; font-size:14px; }
.sst-why{ background:rgba(18,26,37,0.85); border:1px solid #243041; border-radius:14px; padding:12px 18px; } .sst-why h3{ margin:0 0 6px; font-family:'Oswald',sans-serif; letter-spacing:0.22em; font-size:16px; color:#9fb0c1; }
.sst-why > div{ display:flex; gap:12px; align-items:center; font-size:19px; padding:5px 0; } .sst-why i{ font-style:normal; font-family:'Oswald',sans-serif; display:grid; place-items:center; width:30px; height:30px; flex:none; border-radius:50%; background:var(--accent); color:#04130a; font-size:18px; } .sst-why b{ color:var(--accent); }

.sst-fac{ background:rgba(18,26,37,0.85); border:1px solid #243041; border-radius:14px; padding:10px 18px 8px; } .sst-fac h3{ margin:0 0 6px; font-family:'Oswald',sans-serif; letter-spacing:0.22em; font-size:14px; color:#9fb0c1; }
.sst-fr{ display:flex; gap:10px; align-items:center; padding:2px 0; } .sst-fr > span{ width:170px; flex:none; font-size:14px; color:#c4d0dc; } .sst-fr small{ margin-left:6px; color:#7d8da0; font-size:11px; }
.sst-fb2{ flex:1; position:relative; height:20px; border-radius:6px; background:rgba(255,255,255,0.07); overflow:hidden; border-left:3px solid var(--c); } .sst-fb2 i{ position:absolute; left:0; top:0; bottom:0; opacity:0.9; background:#ffc233; } .sst-fb2 i.g{ background:var(--accent); } .sst-fb2 i.r{ background:#ff5d5d; }
.sst-fb2 b{ position:absolute; right:7px; top:0; line-height:20px; font-family:'Oswald',sans-serif; font-size:15px; text-shadow:0 1px 3px #000; }
.sst-fkey{ display:flex; gap:16px; justify-content:flex-end; font-size:12px; color:#9fb0c1; margin-top:4px; } .sst-fkey span{ border-left:3px solid var(--c); padding-left:6px; }
.tall .sst-fr > span{ width:120px; } .tall .sst-fac{ padding:12px 16px; } .tall .sst-fb2{ height:26px; } .tall .sst-fb2 b{ line-height:26px; }

/* verdict score breakdown: bars carry the player's name */
.sst-fb2 u{ position:absolute; left:8px; top:0; line-height:20px; text-decoration:none; font:800 11px Inter,sans-serif; letter-spacing:0.12em; color:rgba(255,255,255,0.92); text-shadow:0 1px 3px rgba(0,0,0,0.9); }
.sst-fb2 i.g{ background:linear-gradient(90deg, #12a843, var(--accent)); } .sst-fb2 i.w{ background:linear-gradient(90deg, #c98f12, #ffc233); } .sst-fb2 i.r{ background:linear-gradient(90deg, #b83434, #ff5d5d); }
/* panels use the whole height of the frame instead of floating in the middle */
.sst-body > .sst-cols{ flex:1; min-height:0; } .sst-col{ justify-content:center; }
.sst-g{ row-gap:0; } .sst-g .bars{ height:30px; } .sst-g .bars .ac{ top:9px; bottom:9px; } .sst-g .wk{ font-size:19px; } .sst-g b{ font-size:26px; }
.sst-nolines{ font-size:11px; letter-spacing:0.16em; color:#8fa0b2; margin:2px 0 2px; }
.sst-allgood{ width:100%; text-align:center; background:color-mix(in srgb, var(--accent) 10%, transparent); border:1px solid color-mix(in srgb, var(--accent) 45%, transparent); border-radius:12px; padding:16px 10px; font-family:'Oswald',sans-serif; letter-spacing:0.1em; font-size:20px; color:#46f07a; } .sst-allgood small{ display:block; font-family:Inter,sans-serif; letter-spacing:0; font-size:12.5px; color:#9fb0c1; margin-top:3px; }
.tall .sst-cols[style*="--n:2"] .sst-im{ padding:12px 14px; } .tall .sst-cols[style*="--n:2"] .sst-im b{ font-size:24px; } .tall .sst-cols[style*="--n:2"] .sst-im small{ font-size:13.5px; } .tall .sst-cols[style*="--n:2"] .sst-boost b{ font-size:58px; } .tall .sst-cols[style*="--n:2"] .sst-boost{ padding:14px 12px; } .tall .sst-cols[style*="--n:2"] .sst-allgood{ font-size:24px; padding:22px 10px; }
.tall .sst-cols[style*="--n:3"] .sst-im, .tall .sst-cols[style*="--n:4"] .sst-im{ padding:5px 10px; } .tall .sst-cols[style*="--n:3"] .sst-boost, .tall .sst-cols[style*="--n:4"] .sst-boost{ padding:4px 10px; margin-top:4px; } .tall .sst-cols[style*="--n:3"] .sst-boost b, .tall .sst-cols[style*="--n:4"] .sst-boost b{ font-size:30px; } .tall .sst-cols[style*="--n:3"] .sst-allgood, .tall .sst-cols[style*="--n:4"] .sst-allgood{ padding:8px; font-size:17px; } .tall .sst-cols[style*="--n:3"] .sst-boost small, .tall .sst-cols[style*="--n:4"] .sst-boost small{ display:none; }
.sst-ov[style*="--n:4"] .sst-mini{ display:none; } .sst-ov[style*="--n:4"] .sst-card .sst-face{ width:84px; height:84px; } .sst-ov[style*="--n:4"] .sst-ring{ width:118px; height:118px; } .sst-ov[style*="--n:4"] .sst-ring b{ font-size:44px; } .sst-ov[style*="--n:4"] .sst-card h2{ font-size:26px; }
.tall .sst-cols:not(.sst-ov)[style*="--n:3"] .sst-nolines, .tall .sst-cols:not(.sst-ov)[style*="--n:4"] .sst-nolines{ display:none; }
/* tighten the wide stage so the START/SIT tags never push a slide past the frame */
.sst-stage{ padding-top:16px; padding-bottom:10px; } .sst-top{ margin-bottom:6px; } .sst-foot{ margin-top:6px; }
.sst-hdr .sst-who .sst-face{ width:52px; height:52px; font-size:19px; } .sst-hdr .sst-who{ gap:1px; } .sst-tbl{ gap:5px; }
.sst-formh .sst-face{ width:62px; height:62px; } .sst-formh{ gap:2px; margin-bottom:2px; }
.sst-sit > div{ padding:6px 14px; } .sst-fac{ padding:8px 16px 6px; } .sst-why{ padding:10px 16px; } .sst-why > div{ padding:3px 0; font-size:18px; }
.sst-im{ padding:5px 10px; } .sst-prop{ padding:5px 12px; }
/* injuries & opportunity */
.sst-im{ display:flex; align-items:center; justify-content:space-between; gap:8px; width:100%; text-align:left; background:rgba(0,0,0,0.3); border:1px solid #243041; border-radius:10px; padding:6px 10px; }
.sst-im b{ display:block; font-family:'Oswald',sans-serif; font-size:19px; letter-spacing:0.02em; } .sst-im small{ color:#8fa0b2; font-size:12px; }
.sst-im .chip{ flex:none; font-weight:800; font-size:12px; }
.sst-boost{ margin-top:8px; width:100%; border:1px solid #2a3646; background:rgba(0,0,0,0.28); border-radius:12px; padding:8px 12px; display:grid; text-align:center; }
.sst-boost span{ font-size:11px; letter-spacing:0.16em; color:#9fb0c1; } .sst-boost b{ font-family:'Oswald',sans-serif; font-size:40px; line-height:1.05; color:#c4d0dc; } .sst-boost b i{ font-style:normal; font-size:16px; color:#9fb0c1; } .sst-boost small{ color:#8fa0b2; font-size:12px; }
.sst-boost.good{ border-color:color-mix(in srgb, var(--accent) 60%, transparent); background:color-mix(in srgb, var(--accent) 12%, transparent); } .sst-boost.good b, .sst-boost.good span{ color:var(--accent); }
.sst-boost.warn{ border-color:rgba(255,194,51,0.55); background:rgba(255,194,51,0.1); } .sst-boost.warn b, .sst-boost.warn span{ color:#ffc233; }
.sst-boost.bad{ border-color:rgba(255,93,93,0.6); background:rgba(255,93,93,0.12); } .sst-boost.bad b, .sst-boost.bad span{ color:#ff6b6b; }

/* START (green) / SIT (red) tag on every slide */
.sst-tag{ font-style:normal; font-family:'Oswald',sans-serif; font-weight:700; letter-spacing:0.14em; font-size:15px; line-height:1; padding:4px 13px; border-radius:999px; margin-top:4px; display:inline-block; }
.sst-tag.st{ background:var(--accent); color:#04130a; box-shadow:0 0 18px color-mix(in srgb, var(--accent) 45%, transparent); }
.sst-tag.si{ background:#ff4d4d; color:#fff; box-shadow:0 0 18px rgba(255,77,77,0.4); }
.sst-col:has(.sst-tag.st), .sst-card.win{ border-color:var(--accent); } .sst-col:has(.sst-tag.si){ border-color:rgba(255,77,77,0.7); }
.sst-hdr .sst-who:has(.sst-tag.st) .sst-face{ border-color:var(--accent); } .sst-hdr .sst-who:has(.sst-tag.si) .sst-face{ border-color:#ff4d4d; }
.sst-bye{ color:#ffc233; font-family:'Oswald',sans-serif; letter-spacing:0.08em; }
.sst-vk{ color:var(--accent); text-shadow:0 0 24px color-mix(in srgb, var(--accent) 50%, transparent); }
.sst-sit em{ background:#ff4d4d; color:#fff; padding:3px 12px; border-radius:999px; font-size:18px; }
.sst-also em{ background:var(--accent); color:#04130a; }

/* ---------- tall (9:16) layout: players become full-width rows, tables stretch to use the whole height ---------- */
.tall .sst-body{ justify-content:stretch; }
.tall .sst-tbl{ flex:1; gap:8px; justify-content:space-evenly; }
.tall .sst-tbl .sst-row:not(.sst-hdr){ flex:1; max-height:104px; }
.tall .sst-hdr{ flex:none; } .tall .sst-hdr .sst-who{ gap:3px; } .tall .sst-hdr .sst-who small{ font-size:12px; }
.tall .sst-cell b{ font-size:30px; } .tall .sst-cell small{ font-size:12.5px; } .tall .sst-lab{ font-size:18px; } .tall .sst-lab small{ font-size:11.5px; }
.tall .sst-tag{ font-size:14px; padding:4px 10px; }
/* overview: one big row per player */
.tall .sst-ov{ grid-template-columns:1fr; flex:1; gap:14px; }
.tall .sst-ov .sst-col{ padding:14px 18px; }
.tall .sst-ov .sst-card{ display:grid; grid-template-columns:128px 1fr 150px; grid-template-rows:repeat(5, auto); column-gap:18px; row-gap:6px; align-content:center; justify-items:start; text-align:left; height:100%; }
.tall .sst-ov .sst-card .sst-face{ grid-column:1; grid-row:1 / span 5; width:128px; height:128px; align-self:center; }
.tall .sst-ov .sst-card h2{ grid-column:2; grid-row:1; font-size:34px; }
.tall .sst-ov .sst-meta{ grid-column:2; grid-row:2; justify-content:flex-start; } .tall .sst-ov .sst-kickoff{ grid-column:2; grid-row:3; min-height:0; }
.tall .sst-ov .sst-chips{ grid-column:2; grid-row:4; justify-content:flex-start; } .tall .sst-ov .sst-prac{ grid-column:2; grid-row:5; justify-content:flex-start; }
.tall .sst-ov .sst-ringwrap{ grid-column:3; grid-row:1 / span 4; align-self:center; justify-self:center; } .tall .sst-ov .sst-ring{ width:140px; height:140px; }
.tall .sst-ov .sst-mini{ grid-column:1 / -1; grid-row:6; margin-top:10px; } .tall .sst-ov .sst-card{ grid-template-rows:repeat(5, auto) auto; } .tall .sst-ov .sst-card .sst-face{ grid-row:1 / span 5; }
.tall .sst-ov[style*="--n:4"] .sst-mini{ display:none; }
.tall .sst-ov[style*="--n:2"] .sst-mini{ margin-top:22px; gap:12px; } .tall .sst-ov[style*="--n:2"] .sst-mini > div{ padding:14px 6px; border-radius:14px; } .tall .sst-ov[style*="--n:2"] .sst-mini b{ font-size:38px; } .tall .sst-ov[style*="--n:2"] .sst-mini small{ font-size:11.5px; } .tall .sst-ov[style*="--n:2"] .sst-mini i{ font-size:12.5px; }
.tall .sst-ov[style*="--n:2"] .sst-chips{ margin:6px 0; } .tall .sst-ov[style*="--n:2"] .chip{ font-size:15px; padding:5px 14px; } .tall .sst-ov[style*="--n:2"] .sst-kickoff{ font-size:16px; } .tall .sst-ov[style*="--n:2"] .sst-meta{ font-size:22px; }
.tall .sst-ov .sst-crown{ grid-column:3; grid-row:5; justify-self:center; font-size:22px; padding:4px 22px; }
.tall .sst-ov[style*="--n:2"] .sst-card{ grid-template-columns:170px 1fr 190px; } .tall .sst-ov[style*="--n:2"] .sst-card .sst-face{ width:170px; height:170px; font-size:56px; }
.tall .sst-ov[style*="--n:2"] .sst-card h2{ font-size:42px; } .tall .sst-ov[style*="--n:2"] .sst-ring{ width:180px; height:180px; } .tall .sst-ov[style*="--n:2"] .sst-ring b{ font-size:66px; }
/* form + bets: 2 players side by side, 3-4 stacked as full-width panels */
.tall .sst-cols:not(.sst-ov){ flex:1; }
.tall .sst-cols:not(.sst-ov)[style*="--n:3"], .tall .sst-cols:not(.sst-ov)[style*="--n:4"]{ grid-template-columns:1fr; gap:12px; }
.tall .sst-cols:not(.sst-ov)[style*="--n:3"] .sst-col, .tall .sst-cols:not(.sst-ov)[style*="--n:4"] .sst-col{ display:grid; grid-template-columns:170px 1fr; align-items:center; text-align:left; column-gap:14px; row-gap:6px; padding:10px 16px; }
.tall .sst-cols:not(.sst-ov)[style*="--n:3"] .sst-col > :not(.sst-formh), .tall .sst-cols:not(.sst-ov)[style*="--n:4"] .sst-col > :not(.sst-formh){ grid-column:2; }
.tall .sst-cols:not(.sst-ov)[style*="--n:3"] .sst-formh, .tall .sst-cols:not(.sst-ov)[style*="--n:4"] .sst-formh{ grid-column:1; grid-row:1 / span 8; }
.tall .sst-cols:not(.sst-ov) .sst-formh h2{ font-size:24px; text-align:center; } .tall .sst-col .sst-prop{ padding:5px 12px; } .tall .sst-col .sst-prop b{ font-size:24px; } .tall .sst-col .sst-td b{ font-size:34px; }
.tall .sst-g{ grid-template-columns:70px 1fr 54px; } .tall .sst-avg{ margin-top:4px; padding-top:2px; font-size:19px; } .tall .sst-avg b{ font-size:26px; }
/* verdict */
.tall .sst-verdict{ flex:1; justify-content:flex-start; gap:14px; }
.tall .sst-vcard{ flex-direction:column; padding:16px 22px; gap:6px; flex:1.4; justify-content:center; align-items:center; text-align:center; }
.tall .sst-vcard > div:nth-child(2){ flex:none; } .tall .sst-vcard .sst-meta{ justify-content:center; } .tall .sst-vk{ text-align:center; }
.tall .sst-why{ flex:1; display:flex; flex-direction:column; justify-content:space-evenly; padding:16px 22px; } .tall .sst-fac{ flex:none; }
.tall .sst-cols.sst-stackrows{ grid-template-columns:1fr !important; gap:22px; flex:none !important; margin:auto 0; }
.tall .sst-cols.sst-stackrows .sst-col{ display:grid; grid-template-columns:190px 1fr; align-items:center; text-align:left; column-gap:20px; row-gap:10px; padding:24px 20px; justify-content:stretch; }
.tall .sst-stackrows .sst-col > :not(.sst-formh){ grid-column:2; } .tall .sst-stackrows .sst-formh{ grid-column:1; grid-row:1 / span 8; } .tall .sst-stackrows .sst-formh .sst-face{ width:96px; height:96px; }
.tall .sst-why h3{ font-size:19px; } .tall .sst-why > div{ font-size:24px; padding:6px 0; gap:16px; } .tall .sst-why i{ width:40px; height:40px; font-size:24px; }
.tall .sst-vcard{ flex:1.15; }
.tall .sst-verdict:has(.sst-sit > div:nth-child(3)) .sst-why{ padding:8px 18px; } .tall .sst-verdict:has(.sst-sit > div:nth-child(3)) .sst-why > div{ font-size:19px; padding:1px 0; } .tall .sst-verdict:has(.sst-sit > div:nth-child(3)) .sst-why i{ width:28px; height:28px; font-size:16px; } .tall .sst-verdict:has(.sst-sit > div:nth-child(3)) .sst-vcard{ flex:.7; } .tall .sst-verdict:has(.sst-sit > div:nth-child(3)) .sst-sit > div{ padding:5px 14px; } .tall .sst-verdict:has(.sst-sit > div:nth-child(3)) .sst-vcard .sst-face{ width:84px; height:84px; } .tall .sst-verdict:has(.sst-sit > div:nth-child(3)) .sst-vcard h1{ font-size:50px; }
.tall .sst-cols[style*="--n:2"] .sst-col{ justify-content:space-evenly; padding:22px 16px; } .tall .sst-vcard h1{ font-size:64px; } .tall .sst-vk{ font-size:34px; }
.tall .sst-sit > div{ padding:12px 18px; } .tall .sst-sit b{ font-size:30px; } .tall .sst-sit .sst-face{ width:64px; height:64px; } .tall .sst-sit em{ font-size:22px; }/* intro */
.tall .sst-intro{ flex:1; justify-content:center; gap:28px; } .tall .sst-intro h1{ font-size:170px; }

/* tall (9:16, 720x1280) base: kept AFTER the specific rules above only for things they do not set */
.sst-stage.tall{ padding:26px 28px 18px; }
.tall .sst-top{ margin-bottom:14px; } .tall .sst-title{ font-size:17px; } .tall .sst-brand{ font-size:24px; }
.tall .sst-faces{ display:grid; grid-template-columns:repeat(2, 1fr); gap:10px 18px; } .tall .sst-faces em{ display:none; } .tall .sst-fb .sst-face{ width:104px; height:104px; } .tall .sst-fb b{ font-size:24px; }
.tall .sst-vscore b{ font-size:70px; } .tall .sst-vcard .sst-face{ width:120px; height:120px; }
.tall .sst-row, .tall .sst-tbl .sst-row{ grid-template-columns:150px repeat(var(--n), minmax(0, 1fr)); gap:6px; }
.tall .sst-hdr .sst-who .sst-face{ width:56px; height:56px; } .tall .sst-hdr .sst-who b{ font-size:18px; }
.tall .sst-sit{ flex-direction:column; } .tall .sst-sit > div{ flex:none; }
.tall .sst-legend{ flex-wrap:wrap; gap:8px 14px; }
.tall .sst-fr > span{ width:120px; } .tall .sst-fac{ padding:12px 16px; } .tall .sst-fb2{ height:26px; } .tall .sst-fb2 b{ line-height:26px; }
@media (prefers-reduced-motion:no-preference){ .sst-strip button{ transition:background .12s ease, color .12s ease; } }

/* wide stage: tighter prop rows so 4 lines + the TD rating fit under the taller logo bar */
.sst-stage:not(.tall) .sst-prop{ padding:3px 12px; } .sst-stage:not(.tall) .sst-prop b{ font-size:24px; } .sst-stage:not(.tall) .sst-prop small{ font-size:11px; } .sst-stage:not(.tall) .sst-td b{ font-size:34px; } .sst-stage:not(.tall) .sst-td{ padding:5px 12px; }

.sst-share{ display:flex; flex-wrap:wrap; gap:8px; margin:8px 0; } .sst-tpl{ margin-top:6px; } .sst-tpl summary{ cursor:pointer; color:var(--text-muted); font-size:0.85rem; } .sst-tpl textarea{ width:100%; box-sizing:border-box; background:var(--surface-2, #141b25); color:var(--text); border:1px solid var(--border); border-radius:10px; padding:10px; font:inherit; font-size:0.85rem; margin:6px 0; } .sst-tpl small{ color:var(--text-muted); }
/* ---------- Waiver Wire Graphic (owner only): controls + a 1280x720 / 720x1280 stage exported to PNG / JPEG ---------- */
body.consumer-mode #tab-ww-studio, body.consumer-mode #view-ww-studio{ display:none !important; }
.ww-page .panel-head{ flex-wrap:wrap; gap:8px; }
.ww-ctl{ display:grid; gap:12px; margin:6px 0 12px; }
.ww-picks{ display:grid; gap:6px; }
.ww-pk{ display:flex; flex-wrap:wrap; gap:6px; align-items:center; }
.ww-n{ display:inline-grid; place-items:center; width:24px; height:24px; border-radius:50%; background:var(--accent); color:#04130a; font-weight:800; font-size:0.78rem; flex:none; } .ww-pk.add .ww-n{ background:var(--surface-2, #141b25); color:var(--text-muted); border:1px dashed var(--border); }
.ww-pick, .ww-note, #ww-title{ background:var(--surface-2, #141b25); color:var(--text); border:1px solid var(--border); border-radius:10px; padding:8px 11px; font-size:0.88rem; }
#ww-root .ww-pick{ width:280px; max-width:100%; flex:0 0 auto; } #ww-root .ww-note{ flex:1 1 220px; width:auto; min-width:160px; } #ww-root #ww-title{ width:170px; } #ww-root .ww-bar2 select, #ww-root .ww-opts select{ width:auto; } #ww-root .ww-ib{ padding:0; flex:none; }
.ww-ib{ background:transparent; border:1px solid var(--border); color:var(--text-muted); border-radius:8px; width:30px; height:30px; cursor:pointer; } .ww-ib:disabled{ opacity:0.3; cursor:default; } .ww-ib:hover:not(:disabled){ color:var(--text); border-color:var(--text-muted); }
.ww-quick{ display:flex; flex-wrap:wrap; gap:6px; align-items:center; margin-top:4px; }
.ww-opts{ display:flex; flex-wrap:wrap; gap:10px; align-items:center; } .ww-opts label{ display:flex; gap:6px; align-items:center; font-size:0.85rem; color:var(--text-muted); }
.ww-opts select, .ww-bar2 select{ background:var(--surface-2, #141b25); color:var(--text); border:1px solid var(--border); border-radius:8px; padding:6px 8px; }
.ww-format h4{ margin:0 0 8px; font-size:0.85rem; letter-spacing:0.04em; text-transform:uppercase; color:var(--text-muted); }
.ww-fcards{ display:flex; flex-wrap:wrap; gap:10px; align-items:stretch; }
#ww-root .ww-fc{ display:grid; grid-template-columns:auto 1fr; grid-template-rows:auto auto; column-gap:12px; align-items:center; text-align:left; min-width:250px; padding:10px 16px 10px 12px; border-radius:14px; border:2px solid var(--border); background:var(--surface-2, #141b25); color:var(--text); cursor:pointer; }
#ww-root .ww-fc b{ font-size:0.98rem; } #ww-root .ww-fc small{ grid-column:2; color:var(--text-muted); font-size:0.76rem; } #ww-root .ww-fc .ww-ic{ grid-row:1 / span 2; display:block; border:2px solid currentColor; border-radius:4px; opacity:0.8; } .ww-ic.wide{ width:38px; height:22px; } .ww-ic.tall{ width:22px; height:38px; }
#ww-root .ww-fc.on{ border-color:var(--accent); background:color-mix(in srgb, var(--accent) 12%, transparent); box-shadow:0 0 0 3px color-mix(in srgb, var(--accent) 15%, transparent); } #ww-root .ww-fc.on .ww-ic{ color:var(--accent); opacity:1; }
.ww-ft{ display:flex; flex-direction:column; justify-content:center; gap:4px; padding:0 4px; } .ww-ft small{ color:var(--text-muted); font-size:0.76rem; } .ww-ft i{ font-style:normal; opacity:0.65; font-size:0.72em; margin-left:4px; }
.ww-host{ width:100%; display:flex; justify-content:center; background:#05070a; border:1px solid var(--border); border-radius:14px; padding:10px; box-sizing:border-box; overflow:hidden; }
.ww-outer{ position:relative; overflow:hidden; border-radius:12px; flex:none; } .ww-fit{ position:absolute; left:0; top:0; }
.ww-bar2{ display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin:12px 0; }
.ww-caps{ display:grid; grid-template-columns:1fr 1fr; gap:16px; } .ww-caps h4{ margin:0 0 8px; display:flex; gap:10px; align-items:center; justify-content:space-between; font-size:0.9rem; }
.ww-caps textarea{ width:100%; box-sizing:border-box; background:var(--surface-2, #141b25); color:var(--text); border:1px solid var(--border); border-radius:10px; padding:10px; font:inherit; font-size:0.85rem; resize:vertical; } .ww-caps small{ color:var(--text-muted); }
@media (max-width:760px){ .ww-caps{ grid-template-columns:1fr; } #ww-root .ww-pick{ flex:1 1 200px; width:auto; } }

/* ---------- the stage ---------- */
.ww-stage{ position:relative; box-sizing:border-box; display:flex; flex-direction:column; overflow:hidden; color:#f2f6fb; font-family:Inter,sans-serif; background:#0a0e14; padding:18px 30px 12px;
  --text:#f2f6fb; --text-muted:#93a4b6; --border:#2a3646; --good:#18e255; --danger:#ff5d5d; --warn:#ffc233; --accent:#18e255; }
.ww-stage *{ box-sizing:border-box; }
.ww-bg{ position:absolute; inset:0; z-index:0; background:radial-gradient(900px 380px at 12% -10%, color-mix(in srgb, var(--accent) 20%, transparent), transparent 70%), radial-gradient(800px 420px at 100% 110%, color-mix(in srgb, var(--accent) 12%, transparent), transparent 70%), repeating-linear-gradient(90deg, rgba(255,255,255,0.025) 0 1px, transparent 1px 64px); }
.ww-stage > *:not(.ww-bg){ position:relative; z-index:1; }
.ww-top{ display:flex; align-items:center; gap:18px; margin-bottom:10px; flex:none; }
.ww-brand img{ height:46px; width:auto; display:block; }
.ww-title{ flex:1; min-width:0; } .ww-title h1{ margin:0; font-family:'Oswald',sans-serif; font-size:38px; line-height:1; letter-spacing:0.06em; color:#fff; } .ww-title span{ display:block; margin-top:4px; font-size:12px; letter-spacing:0.16em; color:#9fb0c2; }
.ww-badge{ font-family:'Oswald',sans-serif; font-size:26px; line-height:1; text-align:center; color:#04130a; background:var(--accent); border-radius:12px; padding:6px 16px; } .ww-badge small{ display:block; font-size:11px; letter-spacing:0.18em; margin-top:2px; }
.ww-list{ flex:1; min-height:0; display:flex; flex-direction:column; gap:8px; }
.ww-foot{ display:flex; justify-content:center; margin-top:6px; flex:none; font-family:'Oswald',sans-serif; font-size:26px; line-height:1; letter-spacing:0.12em; color:var(--accent); text-transform:uppercase; text-shadow:0 0 18px color-mix(in srgb, var(--accent) 35%, transparent); }

.ww-row{ flex:1; min-height:0; display:grid; gap:10px; align-items:stretch; padding:8px 12px; border-radius:12px; border:1px solid var(--border); border-left:4px solid var(--c, var(--accent)); background:linear-gradient(90deg, color-mix(in srgb, var(--c, var(--accent)) 16%, #0f1620), #0f1620 42%); }
.ww-stage.wide .ww-row{ grid-template-columns:292px 212px 226px 204px minmax(0, 1fr); } .ww-stage.wide .ww-who h2{ font-size:17px; } .ww-stage.wide .ww-id{ gap:7px; } .ww-stage.wide .ww-rank{ font-size:26px; width:18px; } .ww-mate .chip{ font-size:7.5px !important; padding:2px 5px !important; }
.ww-sec h3 .chip{ margin-left:auto; font-size:8.5px; padding:1px 7px; letter-spacing:0.05em; font-family:Inter,sans-serif; }
.ww-foot span{ white-space:nowrap; }
.ww-sec{ min-width:0; display:flex; flex-direction:column; gap:5px; overflow:hidden; } .ww-sec h3{ margin:0; font-family:'Oswald',sans-serif; font-size:11px; font-weight:500; letter-spacing:0.14em; color:var(--accent); display:flex; align-items:baseline; gap:6px; white-space:nowrap; } .ww-sec h3 small{ font-family:Inter,sans-serif; font-size:10px; letter-spacing:0.04em; color:#8fa0b2; font-weight:600; }
.ww-sec + .ww-sec{ border-left:1px solid #1e2937; padding-left:10px; }

/* identity */
.ww-id{ display:grid; grid-template-columns:auto auto minmax(0, 1fr) auto; align-items:center; gap:9px; min-width:0; }
.ww-rank{ font-family:'Oswald',sans-serif; font-size:30px; color:var(--accent); width:22px; text-align:center; }
.ww-face{ width:62px; height:62px; flex:none; border-radius:50%; overflow:hidden; background:#1a2330; border:3px solid var(--c, var(--accent)); box-shadow:0 6px 16px rgba(0,0,0,0.5); display:grid; place-items:center; font-family:'Oswald',sans-serif; font-size:22px; } .ww-face img{ width:100%; height:100%; object-fit:cover; object-position:top; }
.ww-who{ min-width:0; } .ww-who h2{ margin:0; font-family:'Oswald',sans-serif; font-size:19px; line-height:1.1; letter-spacing:0.02em; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ww-meta{ display:flex; align-items:center; gap:5px; margin-top:3px; font-size:11px; color:#c4d0dc; white-space:nowrap; } .ww-meta b{ font-weight:700; } .ww-meta .bye{ color:#ff5d5d; font-weight:800; }
.ww-lg{ width:18px; height:18px; object-fit:contain; } .ww-meta .pill{ font-size:10px; font-weight:800; padding:1px 6px; border-radius:6px; color:#fff; }
.ww-sub{ margin-top:2px; font-size:10px; color:#8fa0b2; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } .ww-sub em{ font-style:normal; color:var(--accent); font-weight:700; }
.ww-proj{ text-align:center; display:grid; gap:1px; } .ww-proj b{ font-family:'Oswald',sans-serif; font-size:30px; line-height:1; } .ww-proj small{ font-size:8.5px; letter-spacing:0.1em; color:#8fa0b2; } .ww-proj .chip{ margin-top:3px; }
.chip{ display:inline-block; padding:2px 8px; border-radius:999px; font-size:9.5px; font-weight:800; letter-spacing:0.06em; background:#202b39; color:#c4d0dc; white-space:nowrap; }
.ww-stage .chip.good{ background:color-mix(in srgb, var(--accent) 18%, transparent); color:var(--accent); } .ww-stage .chip.warn{ background:rgba(255,194,51,0.2); color:#ffc233; } .ww-stage .chip.bad{ background:rgba(255,93,93,0.2); color:#ff7a7a; }

/* tiles */
.ww-tiles{ display:grid; grid-template-columns:repeat(4, 1fr); gap:5px; } .ww-tiles > div{ background:rgba(255,255,255,0.05); border-radius:8px; padding:4px 3px 3px; text-align:center; min-width:0; }
.ww-tiles b{ display:block; font-family:'Oswald',sans-serif; font-size:17px; line-height:1.1; white-space:nowrap; } .ww-tiles small{ display:block; margin-top:1px; font-size:7.5px; letter-spacing:0.05em; color:#8fa0b2; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } .ww-tiles i{ display:block; font-style:normal; font-size:7.5px; color:#6f8195; white-space:nowrap; }
.ww-tiles .good{ background:color-mix(in srgb, var(--accent) 16%, transparent); } .ww-tiles .good b{ color:var(--accent); } .ww-tiles .bad{ background:rgba(255,93,93,0.16); } .ww-tiles .bad b{ color:#ff7a7a; }
.ww-pts{ display:flex; align-items:baseline; gap:6px; font-size:11px; color:#c4d0dc; } .ww-pts b{ font-family:'Oswald',sans-serif; font-size:20px; color:#fff; } .ww-pts em{ margin-left:auto; font-style:normal; font-weight:800; color:#04130a; background:var(--accent); border-radius:6px; padding:0 6px; font-size:10px; }
.up{ color:var(--accent); } .dn{ color:#ff7a7a; } .ww-pts span{ font-weight:700; font-size:10.5px; }
.ww-bars{ display:flex; gap:6px; align-items:flex-end; height:44px; } .ww-bar{ flex:1; display:flex; flex-direction:column; align-items:center; justify-content:flex-end; gap:1px; height:100%; } .ww-bar b{ font-size:9.5px; font-weight:700; } .ww-bar b.up{ color:var(--accent); } .ww-bar b.dn{ color:#ff7a7a; } .ww-bar i{ display:block; width:100%; border-radius:3px 3px 0 0; min-height:4px; } .ww-bar i.up{ background:var(--accent); } .ww-bar i.dn{ background:#ff5d5d; } .ww-bar em{ font-style:normal; font-size:8px; color:#8fa0b2; }
.ww-l3{ font-size:10px; letter-spacing:0.05em; color:#9fb0c2; } .ww-l3 b{ font-family:'Oswald',sans-serif; font-size:14px; color:#fff; } .ww-l3 b.up{ color:var(--accent); } .ww-l3 b.dn{ color:#ff7a7a; }
.ww-none{ font-size:11px; color:#7d8da0; padding:6px 0; }

/* injuries */
.ww-st{ display:flex; flex-wrap:wrap; gap:5px; align-items:center; }
.ww-prac{ font-size:8.5px; letter-spacing:0.08em; color:#8fa0b2; display:flex; gap:5px; align-items:center; } .ww-prac span{ display:inline-flex; gap:3px; align-items:center; font-size:10px; color:#c4d0dc; letter-spacing:0; }
.ww-prac i{ font-style:normal; font-weight:800; font-size:8.5px; padding:1px 4px; border-radius:4px; background:#202b39; } .ww-prac i.full{ background:color-mix(in srgb, var(--accent) 20%, transparent); color:var(--accent); } .ww-prac i.lp, .ww-prac i.limited{ background:rgba(255,194,51,0.22); color:#ffc233; } .ww-prac i.dnp{ background:rgba(255,93,93,0.22); color:#ff7a7a; }
.ww-mates{ display:grid; gap:4px; } .ww-mate{ display:grid; grid-template-columns:auto minmax(0, 1fr); gap:1px 6px; align-items:center; } .ww-mate b{ font-size:11px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } .ww-mate small{ grid-column:2; font-size:9px; color:#8fa0b2; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } .ww-mate .chip{ grid-row:1 / span 2; font-size:8px; padding:2px 6px; }
.ww-clear{ font-size:10.5px; color:var(--accent); }

/* notables */
.ww-not ul{ margin:0; padding:0; list-style:none; display:grid; gap:4px; align-content:start; } .ww-not li{ position:relative; padding-left:12px; font-size:11px; line-height:1.28; color:#dbe4ee; }
.ww-not li::before{ content:''; position:absolute; left:0; top:0.42em; width:6px; height:6px; border-radius:50%; background:#8fa0b2; } .ww-not li.good::before{ background:var(--accent); } .ww-not li.bad::before{ background:#ff5d5d; } .ww-not li.warn::before{ background:#ffc233; }
.ww-not li.mine{ color:#fff; font-weight:700; } .ww-not li.mine::before{ background:var(--accent); box-shadow:0 0 0 3px color-mix(in srgb, var(--accent) 25%, transparent); }

/* landscape density */
.ww-stage.wide[data-n="5"] .ww-row{ padding:6px 10px; } .ww-stage.wide[data-n="5"] .ww-face{ width:52px; height:52px; } .ww-stage.wide[data-n="5"] .ww-bars, .ww-stage.wide[data-n="4"] .ww-bars{ display:none; }
.ww-stage.wide[data-n="5"] .ww-tiles b{ font-size:15px; } .ww-stage.wide[data-n="5"] .ww-who h2{ font-size:17px; } .ww-stage.wide[data-n="5"] .ww-not li{ font-size:10.5px; } .ww-stage.wide[data-n="5"] .ww-l3{ display:none; }
.ww-stage.wide[data-n="2"] .ww-row, .ww-stage.wide[data-n="3"] .ww-row{ padding:10px 14px; } .ww-stage.wide[data-n="2"] .ww-tiles b, .ww-stage.wide[data-n="3"] .ww-tiles b{ font-size:22px; } .ww-stage.wide[data-n="2"] .ww-not li, .ww-stage.wide[data-n="3"] .ww-not li{ font-size:13px; } .ww-stage.wide[data-n="2"] .ww-face, .ww-stage.wide[data-n="3"] .ww-face{ width:76px; height:76px; } .ww-stage.wide[data-n="2"] .ww-who h2, .ww-stage.wide[data-n="3"] .ww-who h2{ font-size:22px; }

/* two or three players: names may wrap instead of being cut off, and the vertical cards scale up to use the room */
.ww-stage[data-n="2"] .ww-who h2, .ww-stage[data-n="3"] .ww-who h2{ white-space:normal; overflow:visible; line-height:1.05; }
.ww-stage.wide[data-n="2"] .ww-who h2, .ww-stage.wide[data-n="3"] .ww-who h2{ font-size:21px; } .ww-stage.wide[data-n="2"] .ww-face, .ww-stage.wide[data-n="3"] .ww-face{ width:68px; height:68px; } .ww-stage.wide[data-n="2"] .ww-bars, .ww-stage.wide[data-n="3"] .ww-bars{ height:56px; }
.ww-stage.tall[data-n="3"] .ww-tiles b{ font-size:22px; } .ww-stage.tall[data-n="3"] .ww-not li{ font-size:14.5px; } .ww-stage.tall[data-n="3"] .ww-mate b{ font-size:13px; } .ww-stage.tall[data-n="3"] .ww-bars{ height:52px; } .ww-stage.tall[data-n="3"] .ww-sec h3{ font-size:13px; }
.ww-stage.tall[data-n="2"] .ww-tiles b{ font-size:28px; } .ww-stage.tall[data-n="2"] .ww-tiles > div{ padding:8px 3px 6px; } .ww-stage.tall[data-n="2"] .ww-not li{ font-size:18px; line-height:1.3; } .ww-stage.tall[data-n="2"] .ww-mate b{ font-size:16px; } .ww-stage.tall[data-n="2"] .ww-mate small{ font-size:12px; } .ww-stage.tall[data-n="2"] .ww-bars{ height:96px; } .ww-stage.tall[data-n="2"] .ww-pts b{ font-size:30px; } .ww-stage.tall[data-n="2"] .ww-sec h3{ font-size:15px; } .ww-stage.tall[data-n="2"] .ww-sec{ gap:8px; } .ww-stage.tall[data-n="2"] .ww-l3{ font-size:12px; } .ww-stage.tall[data-n="2"] .ww-l3 b{ font-size:16px; } .ww-stage.tall[data-n="2"] .ww-proj b{ font-size:44px; }/* one player: a spotlight card. Identity across the top, the four sections in a row (wide) or a 2x2 grid (tall), everything scaled up so it reads from a phone */
.ww-stage[data-n="1"] .ww-list{ justify-content:center; } .ww-stage[data-n="1"] .ww-who h2{ white-space:normal; overflow:visible; line-height:1.05; }
.ww-stage.wide[data-n="1"] .ww-row{ flex:0 0 auto; min-height:470px; padding:18px 22px; gap:14px 22px; grid-template-columns:repeat(4, minmax(0, 1fr)); grid-template-rows:auto 1fr; }
.ww-stage.wide[data-n="1"] .ww-id{ grid-column:1 / -1; grid-template-columns:auto auto minmax(0, 1fr) auto; gap:16px; } .ww-stage.wide[data-n="1"] .ww-sec + .ww-sec{ padding-left:18px; } .ww-stage.wide[data-n="1"] .ww-sec:nth-child(2){ border-left:0; padding-left:0; }
.ww-stage.wide[data-n="1"] .ww-face{ width:92px; height:92px; } .ww-stage.wide[data-n="1"] .ww-rank{ font-size:40px; } .ww-stage.wide[data-n="1"] .ww-who h2{ font-size:36px; } .ww-stage.wide[data-n="1"] .ww-meta{ font-size:15px; } .ww-stage.wide[data-n="1"] .ww-sub{ font-size:13px; } .ww-stage.wide[data-n="1"] .ww-proj b{ font-size:56px; } .ww-stage.wide[data-n="1"] .ww-proj small{ font-size:11px; }
.ww-stage[data-n="1"] .ww-sec{ gap:9px; } .ww-stage[data-n="1"] .ww-sec h3{ font-size:15px; } .ww-stage[data-n="1"] .ww-sec h3 small{ font-size:12px; } .ww-stage[data-n="1"] .ww-tiles{ gap:7px; } .ww-stage[data-n="1"] .ww-tiles > div{ padding:8px 4px 6px; border-radius:10px; } .ww-stage[data-n="1"] .ww-tiles b{ font-size:25px; } .ww-stage[data-n="1"] .ww-tiles small{ font-size:9.5px; letter-spacing:0.03em; } .ww-stage[data-n="1"] .ww-tiles i{ font-size:9px; }
.ww-stage[data-n="1"] .ww-pts{ font-size:14px; } .ww-stage[data-n="1"] .ww-pts b{ font-size:32px; } .ww-stage[data-n="1"] .ww-l3{ font-size:13px; } .ww-stage[data-n="1"] .ww-l3 b{ font-size:20px; } .ww-stage[data-n="1"] .ww-bars{ height:84px; } .ww-stage[data-n="1"] .ww-bar b{ font-size:12px; } .ww-stage[data-n="1"] .ww-bar em{ font-size:10px; }
.ww-stage[data-n="1"] .ww-mate b{ font-size:16px; } .ww-stage[data-n="1"] .ww-mate small{ font-size:12px; } .ww-stage[data-n="1"] .ww-mate .chip{ font-size:9.5px !important; } .ww-stage[data-n="1"] .ww-mates{ gap:10px; } .ww-stage[data-n="1"] .ww-not ul{ gap:9px; } .ww-stage[data-n="1"] .ww-not li{ font-size:17px; line-height:1.3; padding-left:16px; } .ww-stage[data-n="1"] .ww-not li::before{ width:8px; height:8px; } .ww-stage[data-n="1"] .ww-clear{ font-size:14px; } .ww-stage[data-n="1"] .ww-prac span{ font-size:13px; }
.ww-stage.tall[data-n="1"] .ww-row{ flex:0 0 auto; grid-template-columns:1fr 1fr; grid-template-rows:auto auto 1fr; gap:22px 22px; padding:22px; } .ww-stage.tall[data-n="1"] .ww-id{ grid-column:1 / -1; grid-template-columns:auto auto minmax(0, 1fr) auto; } .ww-stage.tall[data-n="1"] .ww-face{ width:96px; height:96px; } .ww-stage.tall[data-n="1"] .ww-who h2{ font-size:36px; } .ww-stage.tall[data-n="1"] .ww-meta{ font-size:16px; } .ww-stage.tall[data-n="1"] .ww-proj b{ font-size:60px; } .ww-stage.tall[data-n="1"] .ww-rank{ font-size:40px; }
.ww-stage.tall[data-n="1"] .ww-tiles b{ font-size:34px; } .ww-stage.tall[data-n="1"] .ww-tiles > div{ padding:12px 4px 9px; } .ww-stage.tall[data-n="1"] .ww-tiles small{ font-size:11px; } .ww-stage.tall[data-n="1"] .ww-sec h3{ font-size:17px; } .ww-stage.tall[data-n="1"] .ww-not li{ font-size:22px; } .ww-stage.tall[data-n="1"] .ww-mate b{ font-size:19px; } .ww-stage.tall[data-n="1"] .ww-mate small{ font-size:14px; } .ww-stage.tall[data-n="1"] .ww-pts b{ font-size:38px; } .ww-stage.tall[data-n="1"] .ww-bars{ height:120px; }/* vertical (9:16): each player is a card with the identity across the top and a 2x2 grid of sections below */
.ww-stage.tall{ padding:20px 26px 12px; } .ww-stage.tall .ww-brand img{ height:42px; } .ww-stage.tall .ww-title h1{ font-size:34px; } .ww-stage.tall .ww-title span{ font-size:10.5px; } .ww-stage.tall .ww-badge{ font-size:22px; padding:5px 12px; }
.ww-stage.tall .ww-row{ grid-template-columns:1fr 1fr; grid-template-rows:auto auto 1fr; gap:6px 12px; padding:8px 12px 8px; }
.ww-stage.tall .ww-id{ grid-column:1 / -1; } .ww-stage.tall .ww-sec + .ww-sec{ border-left:0; padding-left:0; } .ww-stage.tall .ww-sec.ww-adv{ border-left:1px solid #1e2937; padding-left:12px; } .ww-stage.tall .ww-sec.ww-not{ border-left:1px solid #1e2937; padding-left:12px; }
.ww-stage.tall .ww-id{ grid-template-columns:auto auto minmax(0, 1fr) auto; } .ww-stage.tall .ww-face{ width:56px; height:56px; } .ww-stage.tall .ww-who h2{ font-size:21px; } .ww-stage.tall .ww-meta{ font-size:12px; } .ww-stage.tall .ww-sub{ font-size:10.5px; }
.ww-stage.tall .ww-proj{ grid-template-columns:auto auto; align-items:center; column-gap:8px; } .ww-stage.tall .ww-proj b{ grid-row:1 / span 2; font-size:34px; } .ww-stage.tall .ww-proj small{ text-align:left; } .ww-stage.tall .ww-proj .chip{ grid-column:2; justify-self:start; margin:0; }
.ww-stage.tall .ww-tiles b{ font-size:17px; } .ww-stage.tall .ww-tiles small{ font-size:8px; } .ww-stage.tall .ww-tiles > div{ padding:3px 2px 2px; } .ww-stage.tall .ww-sec{ gap:4px; } .ww-stage.tall .ww-l3{ font-size:9.5px; } .ww-stage.tall .ww-l3 b{ font-size:12.5px; } .ww-stage.tall .ww-foot{ font-size:26px; } .ww-stage.tall .ww-not li{ font-size:11.5px; } .ww-stage.tall .ww-sec h3{ font-size:11.5px; }
.ww-stage.tall[data-n="5"] .ww-row{ padding:5px 10px; gap:3px 10px; } .ww-stage.tall[data-n="5"] .ww-face{ width:44px; height:44px; } .ww-stage.tall[data-n="5"] .ww-who h2{ font-size:18px; } .ww-stage.tall[data-n="5"] .ww-rank{ font-size:24px; } .ww-stage.tall[data-n="5"] .ww-tiles b{ font-size:15px; } .ww-stage.tall[data-n="5"] .ww-tiles > div{ padding:2px 2px 1px; } .ww-stage.tall[data-n="5"] .ww-tiles i{ display:none; } .ww-stage.tall[data-n="5"] .ww-sec{ gap:3px; } .ww-stage.tall[data-n="5"] .ww-pts b{ font-size:17px; } .ww-stage.tall[data-n="5"] .ww-not li{ font-size:10.5px; } .ww-stage.tall[data-n="5"] .ww-l3, .ww-stage.tall[data-n="5"] .ww-prac{ display:none; } .ww-stage.tall[data-n="5"] .ww-sub{ display:none; }
.ww-stage.tall[data-n="2"] .ww-tiles b, .ww-stage.tall[data-n="3"] .ww-tiles b{ font-size:22px; } .ww-stage.tall[data-n="2"] .ww-not li, .ww-stage.tall[data-n="3"] .ww-not li{ font-size:13px; } .ww-stage.tall[data-n="2"] .ww-face, .ww-stage.tall[data-n="3"] .ww-face{ width:70px; height:70px; } .ww-stage.tall[data-n="2"] .ww-who h2, .ww-stage.tall[data-n="3"] .ww-who h2{ font-size:25px; }

/* ---------- Members page (owner only) ---------- */
body.consumer-mode #tab-members, body.consumer-mode #view-members{ display:none !important; }
.mb-comp{ display:flex; justify-content:space-between; gap:10px; flex-wrap:wrap; align-items:center; padding:6px 0; border-top:1px solid var(--border); font-size:0.88rem; } .mb-comp:first-child{ border-top:0; }
.mb-confirm{ margin-left:6px; padding:2px 9px; font-size:0.74rem; }
.mb-cards{ display:grid; grid-template-columns:repeat(auto-fit, minmax(130px, 1fr)); gap:10px; margin:6px 0 14px; }
.mb-card{ background:var(--surface-2, #0d1117); border:1px solid var(--border); border-radius:12px; padding:12px 14px; display:flex; flex-direction:column; gap:2px; }
.mb-card b{ font-family:'Oswald',sans-serif; font-size:1.9rem; line-height:1.05; } .mb-card span{ color:var(--text-muted); font-size:0.8rem; letter-spacing:0.04em; }
.mb-card.hot{ border-color:color-mix(in srgb, var(--accent) 55%, transparent); background:color-mix(in srgb, var(--accent) 8%, transparent); } .mb-card.hot b{ color:var(--accent); }
.mb-box{ border:1px solid var(--border); border-radius:12px; padding:10px 14px 4px; margin-bottom:14px; background:rgba(0,0,0,0.25); } .mb-box h4{ margin:0 0 6px; font-size:0.9rem; color:var(--text-muted); } .mb-chart{ width:100%; height:auto; display:block; }
.mb-ctl{ display:flex; flex-wrap:wrap; gap:10px; align-items:center; margin-bottom:10px; } .mb-ctl input{ background:var(--surface-2, #141b25); color:var(--text); border:1px solid var(--border); border-radius:10px; padding:8px 12px; min-width:220px; }
.mb-table td, .mb-table th{ white-space:nowrap; } .mb-warn{ color:#ffc233; margin-left:6px; } .mb-err{ color:#ff7a7a; font-weight:700; }
.mb-plan{ border:1px solid var(--border); border-radius:999px; padding:2px 10px; font-size:0.78rem; text-transform:uppercase; letter-spacing:0.06em; color:var(--text-muted); } .mb-plan.on{ color:#04130a; background:var(--accent); border-color:var(--accent); font-weight:800; }
.mb-temp{ border-color:var(--accent); background:color-mix(in srgb, var(--accent) 8%, transparent); } .mb-code{ font-size:1.1rem; font-weight:800; letter-spacing:.06em; padding:3px 10px; border-radius:8px; background:rgba(0,0,0,.35); user-select:all; }
/* ---------- Membership pop-up + lock badges ---------- */
.tab-locked::after{ content:'🔒'; font-size:0.68em; margin-left:6px; opacity:0.9; filter:saturate(0.8); }
body.up-open{ overflow:hidden; }
.up-wrap{ position:fixed; inset:0; z-index:10000; display:none; align-items:center; justify-content:center; padding:16px; background:rgba(0,0,0,0.72); backdrop-filter:blur(4px); }
.up-wrap.show{ display:flex; animation:upfade .16s ease; }
@keyframes upfade{ from{ opacity:0 } to{ opacity:1 } }
.up-card{ position:relative; width:100%; max-width:460px; max-height:92vh; overflow:auto; box-sizing:border-box; padding:26px 26px 20px; border-radius:18px; border:1px solid color-mix(in srgb, var(--accent) 50%, transparent); outline:none;
  background:radial-gradient(520px 260px at 0% 0%, rgba(30,130,16,0.35), transparent 70%), #080a08; box-shadow:0 24px 70px rgba(0,0,0,0.7), 0 0 40px color-mix(in srgb, var(--accent) 12%, transparent); color:var(--text, #ecf0f4); }
.up-x{ position:absolute; top:10px; right:12px; background:transparent; border:0; color:var(--text-muted); font-size:1.05rem; cursor:pointer; padding:6px 8px; border-radius:8px; } .up-x:hover{ color:#fff; background:rgba(255,255,255,0.08); }
.up-badge{ display:inline-block; font-family:'Oswald',sans-serif; letter-spacing:0.16em; font-size:0.78rem; color:#1a1300; background:#ffc233; border-radius:999px; padding:4px 14px; font-weight:700; }
.up-card h3{ margin:12px 0 4px; font-family:'Oswald',sans-serif; font-size:1.55rem; line-height:1.15; letter-spacing:0.01em; }
.up-sub{ margin:0 0 12px; color:var(--text-muted); font-size:0.93rem; line-height:1.45; }
.up-perks{ list-style:none; margin:0 0 14px; padding:0; display:grid; gap:7px; font-size:0.92rem; }
.up-perks li{ position:relative; padding-left:26px; line-height:1.35; } .up-perks li::before{ content:'✓'; position:absolute; left:0; top:0; width:18px; height:18px; border-radius:50%; background:var(--accent); color:#04130a; font-weight:800; font-size:0.72rem; display:grid; place-items:center; }
.up-price{ display:flex; justify-content:space-between; align-items:center; gap:12px; flex-wrap:wrap; border:1px solid rgba(255,194,51,0.5); background:rgba(255,194,51,0.08); border-radius:12px; padding:10px 14px; margin-bottom:14px; }
.up-price b{ font-family:'Oswald',sans-serif; font-size:1.25rem; color:#ffd166; display:block; } .up-price span{ font-size:0.82rem; color:var(--text-muted); } .up-alt{ font-size:0.85rem; color:var(--text-muted); } .up-alt b{ display:inline; font-size:0.95rem; color:#fff; }
.up-cta{ width:100%; padding:13px 16px; font-size:1rem; } .up-alt-btn{ width:100%; margin-top:8px; }
.up-fine{ margin:10px 0 0; font-size:0.78rem; color:var(--text-muted); line-height:1.45; text-align:center; }
.up-links{ display:flex; justify-content:center; gap:18px; margin-top:10px; } .up-link{ background:none; border:0; color:var(--text-muted); font-size:0.82rem; cursor:pointer; text-decoration:underline; padding:4px; } .up-link:hover{ color:#fff; }
@media (max-width:520px){ .up-wrap{ align-items:flex-end; padding:0; } .up-card{ max-width:none; border-radius:18px 18px 0 0; padding:22px 18px 16px; } }
.rk-unlock{ width:100%; margin:10px 0 4px; padding:14px; border-radius:12px; border:1px dashed rgba(255,194,51,0.6); background:rgba(255,194,51,0.07); color:#ffd166; font-weight:700; cursor:pointer; font-size:0.95rem; } .rk-unlock:hover{ background:rgba(255,194,51,0.14); }

/* ---------- free preview on Members pages ---------- */
.pv-banner{ display:flex; gap:12px; align-items:center; justify-content:space-between; flex-wrap:wrap; margin:0 0 14px; padding:10px 14px; border-radius:12px; border:1px solid rgba(255,194,51,0.55); background:rgba(255,194,51,0.09); color:#ffe29a; font-size:0.92rem; }
.pv-banner b{ color:#ffd166; }
.pv-locked{ filter:blur(5px) saturate(0.7); opacity:0.75; user-select:none; cursor:pointer; }
.pv-locked *{ pointer-events:none !important; }
tr.pv-cta > td{ padding:0 !important; border:0 !important; }
.pv-cta{ position:relative; z-index:2; }
.pv-cta-in{ display:flex; gap:14px; align-items:center; justify-content:center; flex-wrap:wrap; padding:14px 16px; margin:6px 0; border-radius:12px; border:1px dashed color-mix(in srgb, var(--accent) 60%, transparent); background:linear-gradient(90deg, color-mix(in srgb, var(--accent) 12%, transparent), rgba(0,0,0,0.6)); font-size:0.95rem; }
.pv-cta-in b{ color:var(--accent); font-size:1.05rem; } .pv-cta-in span{ color:var(--text-muted); }
.pk-grid > .pv-cta{ grid-column:1 / -1; }
.mc-row span.pv{ color:#ffd166; font-weight:700; font-size:0.82rem; }/* ---------- Home hero: NBA games slideshow (snippet-home-nba.js) ---------- */
.home-hero-media .nbh{ position:absolute; inset:0; outline:none; }
.nbh-track{ position:absolute; inset:0; }
.nbh-pane{ position:absolute; inset:0; opacity:0; visibility:hidden; transition:opacity .55s ease, visibility .55s; }
.nbh-pane.on{ opacity:1; visibility:visible; }
.nbh-slide{ position:absolute; inset:0; cursor:pointer; color:#fff; }
/* banner slide */
.nbh-banner{ display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; padding:26px 30px 44px; background:linear-gradient(145deg,#0b1220 0%,#101a33 45%,#1c0f2b 100%); overflow:hidden; }
.nbh-bglow{ position:absolute; inset:-30%; background:radial-gradient(circle at 30% 25%, color-mix(in srgb, var(--accent) 22%, transparent), transparent 45%), radial-gradient(circle at 75% 80%, rgba(255,120,60,.20), transparent 45%); animation:nbhGlow 9s ease-in-out infinite alternate; pointer-events:none; }
@keyframes nbhGlow{ from{ transform:translate3d(-2%,-2%,0) scale(1); } to{ transform:translate3d(3%,3%,0) scale(1.08); } }
.nbh-nbalogo{ position:relative; width:64px; height:auto; margin-bottom:8px; filter:drop-shadow(0 6px 16px rgba(0,0,0,.55)); }
.nbh-kick{ position:relative; font-family:'Oswald',sans-serif; font-weight:700; letter-spacing:.22em; font-size:.78rem; color:var(--accent); }
.nbh-banner h3{ position:relative; margin:6px 0 8px; font-family:'Oswald',sans-serif; font-weight:800; font-size:clamp(1.7rem,3.1vw,2.5rem); line-height:1.02; letter-spacing:.01em; text-transform:uppercase; color:#fff; }
.nbh-banner p{ position:relative; margin:0 0 16px; max-width:38ch; font-size:.92rem; line-height:1.4; color:rgba(255,255,255,.78); }
.nbh-btns{ position:relative; display:flex; flex-wrap:wrap; gap:10px; justify-content:center; }
/* game slide */
.nbh-game{ display:flex; }
.nbh-side{ flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px; padding-bottom:70px; position:relative; }
.nbh-side.away{ background-image:radial-gradient(circle at 35% 45%, rgba(255,255,255,.24), transparent 62%); }
.nbh-side.home{ background-image:radial-gradient(circle at 65% 45%, rgba(255,255,255,.24), transparent 62%); }
.nbh-side img{ width:62%; max-width:190px; height:auto; max-height:46%; object-fit:contain; filter:drop-shadow(0 10px 22px rgba(0,0,0,.55)); }
.nbh-side b{ font-family:'Oswald',sans-serif; font-weight:800; font-size:1.25rem; letter-spacing:.06em; text-transform:uppercase; text-shadow:0 2px 10px rgba(0,0,0,.6); }
.nbh-side small{ opacity:.85; font-weight:600; letter-spacing:.04em; text-shadow:0 1px 6px rgba(0,0,0,.6); }
.nbh-vs{ position:absolute; top:42%; left:50%; transform:translate(-50%,-50%); z-index:2; width:54px; height:54px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-family:'Oswald',sans-serif; font-weight:800; font-size:1.3rem; background:rgba(0,0,0,.6); border:2px solid rgba(255,255,255,.35); }
.nbh-info{ position:absolute; left:0; right:0; bottom:0; padding:30px 16px 34px; text-align:center; background:linear-gradient(0deg, rgba(0,0,0,.94) 0%, rgba(0,0,0,.78) 58%, transparent 100%); }
.nbh-when{ font-family:'Oswald',sans-serif; font-weight:700; letter-spacing:.05em; text-transform:uppercase; font-size:.9rem; }
.nbh-when small{ opacity:.8; font-weight:500; margin-left:6px; }
.nbh-live{ display:inline-block; padding:1px 7px; border-radius:6px; background:#ff3b3b; color:#fff; font-size:.72rem; letter-spacing:.08em; margin-right:4px; animation:nbhPulse 1.4s infinite; }
@keyframes nbhPulse{ 50%{ opacity:.55; } }
.nbh-odds{ margin-top:4px; font-family:'Oswald',sans-serif; font-weight:800; font-size:1.3rem; color:var(--accent); }
.nbh-odds .dot{ margin:0 10px; opacity:.55; color:#fff; }
.nbh-go{ margin-top:8px; background:var(--accent); color:#04130a; border:0; border-radius:999px; padding:7px 16px; font-weight:800; font-size:.8rem; letter-spacing:.03em; cursor:pointer; }
/* controls */
.nbh-arrow{ position:absolute; top:42%; transform:translateY(-50%); z-index:5; width:38px; height:38px; border-radius:50%; border:1px solid rgba(255,255,255,.3); background:rgba(0,0,0,.45); color:#fff; font-size:1.5rem; line-height:1; cursor:pointer; opacity:0; transition:opacity .2s; }
.nbh-arrow.prev{ left:10px; } .nbh-arrow.next{ right:10px; }
.nbh:hover .nbh-arrow, .nbh:focus-within .nbh-arrow{ opacity:1; }
.nbh-dots{ position:absolute; left:0; right:0; bottom:10px; z-index:5; display:flex; justify-content:center; gap:7px; }
.nbh-dots button{ width:9px; height:9px; padding:0; border-radius:50%; border:0; background:rgba(255,255,255,.35); cursor:pointer; }
.nbh-dots button.on{ background:var(--accent); width:22px; border-radius:6px; }
@media (max-width:900px){
  .home-hero-media{ min-height:330px !important; }
  .nbh-arrow{ opacity:.9; width:34px; height:34px; }
  .nbh-banner h3{ font-size:1.7rem; }
}
@media (max-width:640px){
  .home-hero-media{ min-height:300px !important; }
  .nbh-banner{ padding:20px 18px 40px; } .nbh-nbalogo{ width:48px; }
  .nbh-banner p{ font-size:.84rem; margin-bottom:12px; }
  .nbh-side b{ font-size:1rem; } .nbh-vs{ width:44px; height:44px; font-size:1.05rem; }
  .nbh-odds{ font-size:1.1rem; } .nbh-info{ padding:24px 12px 30px; }
}
@media (prefers-reduced-motion: reduce){ .nbh-bglow{ animation:none; } .nbh-pane{ transition:none; } }
.nbh-pill{ align-self:flex-start; margin:0 0 12px; padding:7px 14px; border-radius:999px; border:1px solid var(--accent); background:color-mix(in srgb, var(--accent) 12%, transparent); color:var(--accent); font-family:'Oswald',sans-serif; font-weight:700; font-size:.78rem; letter-spacing:.06em; cursor:pointer; }
.nbh-pill:hover{ background:color-mix(in srgb, var(--accent) 22%, transparent); }
@media (max-width:900px){ .nbh-pill{ align-self:center; text-align:center; } }

/* hero banner with the three leagues (NFL / NBA / NHL) */
.nbh-logos{ position:relative; display:flex; gap:12px; justify-content:center; flex-wrap:wrap; margin-bottom:10px; }
.nbh-lg{ display:flex; flex-direction:column; align-items:center; gap:4px; min-width:68px; padding:10px 12px 8px; border-radius:14px; border:1px solid rgba(255,255,255,.18); background:rgba(255,255,255,.06); color:#fff; font:700 .72rem 'Oswald',sans-serif; letter-spacing:.08em; cursor:pointer; }
.nbh-lg img{ width:40px; height:40px; object-fit:contain; filter:drop-shadow(0 4px 10px rgba(0,0,0,.5)); }
.nbh-lg:hover{ background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.4); }

/* ---- game slide v2: teams on top, a solid info panel underneath (nothing overlaps, on any screen) ---- */
.nbh-game{ flex-direction:column; }
.nbh-teams{ position:relative; display:flex; flex:1 1 auto; min-height:0; }
.nbh-side{ padding:16px 8px 14px; justify-content:center; gap:8px; text-align:center; }
.nbh-side img{ width:auto; height:clamp(84px, 20vw, 130px); max-width:78%; max-height:none; }
.nbh-side b{ font-size:1.15rem; line-height:1.1; max-width:100%; overflow-wrap:anywhere; }
.nbh-side small{ font-size:.82rem; }
.nbh-vs{ top:50%; width:44px; height:44px; font-size:1rem; }
.nbh-info{ position:static; padding:14px 16px 38px; background:#05080b; border-top:1px solid rgba(255,255,255,.12); display:flex; flex-direction:column; align-items:center; gap:6px; }
.nbh-info .nbh-odds{ margin:0; font-size:1.15rem; line-height:1.2; display:flex; flex-wrap:wrap; justify-content:center; gap:2px 6px; }
.nbh-info .nbh-odds .dot{ margin:0 4px; }
.nbh-info .nbh-star{ margin:2px 0 0; max-width:none; }
.nbh-info .nbh-star b{ font-size:.82rem; } .nbh-info .nbh-star span{ font-size:.76rem; }
.nbh-info .nbh-go{ margin-top:6px; min-height:42px; padding:9px 20px; font-size:.86rem; }
.nbh-arrow{ top:34%; }
@media (max-width:900px){ .home-hero-media{ min-height:470px !important; } }
@media (max-width:640px){ .home-hero-media{ min-height:500px !important; } .nbh-side img{ height:88px; } .nbh-side b{ font-size:1.02rem; } }
/* Thursday Night Football promos only while that game is still ahead or in progress (body.tnf-on, set in snippet-home-nba.js) */
[data-tnf]{ display:none !important; } body.tnf-on [data-tnf]{ display:revert !important; } body.tnf-on [data-notnf]{ display:none !important; }
/* ---------- Guided tour (snippet-tour.js) ---------- */
.tour-wrap{ display:none; position:fixed; z-index:9000; left:0; right:0; bottom:58px; padding:0 14px; pointer-events:none; justify-content:center; }
.tour-wrap.show{ display:flex; }
.tour-wrap.center{ top:0; bottom:44px; align-items:center; background:rgba(0,0,0,.55); backdrop-filter:blur(3px); pointer-events:auto; }
.tour-card{ position:relative; pointer-events:auto; width:100%; max-width:460px; box-sizing:border-box; padding:20px 22px 16px; border-radius:18px; color:var(--text); background:linear-gradient(180deg, #131b2c, #0b101b); border:1px solid color-mix(in srgb, var(--accent) 55%, transparent); box-shadow:0 20px 60px rgba(0,0,0,.65), 0 0 0 1px color-mix(in srgb, var(--accent) 12%, transparent); animation:tourIn .22s ease; }
@keyframes tourIn{ from{ opacity:0; transform:translateY(10px); } to{ opacity:1; transform:none; } }
.tour-x{ position:absolute; top:10px; right:12px; width:30px; height:30px; border-radius:50%; border:0; background:rgba(255,255,255,.08); color:var(--text-muted); font-size:.9rem; cursor:pointer; }
.tour-step{ font-family:'Oswald',sans-serif; font-weight:700; letter-spacing:.14em; font-size:.7rem; color:var(--accent); text-transform:uppercase; }
.tour-card h3{ margin:4px 28px 6px 0; font-family:'Oswald',sans-serif; font-size:1.35rem; line-height:1.15; text-transform:uppercase; letter-spacing:.01em; }
.tour-card p{ margin:0 0 12px; font-size:.9rem; line-height:1.5; color:var(--text-muted); }
.tour-dots{ display:flex; gap:6px; margin:0 0 12px; }
.tour-dots button{ width:8px; height:8px; padding:0; border:0; border-radius:50%; background:rgba(255,255,255,.22); cursor:pointer; } .tour-dots button.on{ width:22px; border-radius:6px; background:var(--accent); }
.tour-row{ display:flex; align-items:center; gap:8px; }
.tour-skip{ background:none; border:0; color:var(--text-muted); font-size:.82rem; text-decoration:underline; cursor:pointer; padding:6px 2px; }
.tour-btn{ min-height:38px; padding:8px 18px; }
/* the real menu items the step is about */
.tour-hl{ outline:3px solid var(--accent) !important; outline-offset:3px; border-radius:10px; box-shadow:0 0 0 7px color-mix(in srgb, var(--accent) 22%, transparent), 0 0 22px color-mix(in srgb, var(--accent) 55%, transparent) !important; position:relative; z-index:3; }
nav.subtabs.tour-hl{ outline-offset:-3px; border-radius:0; }
body.tour-on header.topbar{ transform:none !important; }
@media (max-width:640px){
  .tour-wrap{ bottom:52px; padding:0 8px; }
  .tour-card{ max-width:none; padding:16px 16px 12px; border-radius:16px; }
  .tour-card h3{ font-size:1.15rem; } .tour-card p{ font-size:.84rem; margin-bottom:10px; }
}
@media (prefers-reduced-motion: reduce){ .tour-card{ animation:none; } }
/* Help page: the "take the tour" box */
.help-tour{ display:flex; align-items:center; gap:14px; flex-wrap:wrap; margin:0 0 16px; padding:14px 16px; border-radius:14px; border:1px solid color-mix(in srgb, var(--accent) 45%, transparent); background:linear-gradient(90deg, color-mix(in srgb, var(--accent) 10%, transparent), transparent); }
.help-tour b{ display:block; font-family:'Oswald',sans-serif; font-size:1.05rem; letter-spacing:.02em; text-transform:uppercase; } .help-tour span{ color:var(--text-muted); font-size:.84rem; }
/* ---------- Customization: light theme, accent / background / corners / text size, Customize page, "For you" panel (snippet-custom.js) ---------- */

/* ===== light theme: content goes light; the header, score ticker, footer and hero stay dark "brand islands" (they are built around the dark logo art) ===== */
:root[data-theme="light"]{
  --bg:#EEF1F5; --surface:#FFFFFF; --surface-2:#F1F4F8; --border:#D3DAE3; --text:#121923; --text-muted:#56637A;
  --danger:#C62828; --danger-bg:#FBE4E4; --good:#0E8A3A; --good-bg:#DDF3E5; --warn:#A87400; --warn-bg:#FFF1CC;
  --shadow-sm:0 1px 2px rgba(20,30,50,.06), 0 3px 10px rgba(20,30,50,.08); --shadow-md:0 6px 20px rgba(20,30,50,.12), 0 1px 3px rgba(20,30,50,.08);
  color-scheme:light;
}
:root[data-theme="light"] header.topbar, :root[data-theme="light"] .score-ticker, :root[data-theme="light"] footer.foot, :root[data-theme="light"] .home-hero,
:root[data-theme="light"] .tour-card, :root[data-theme="light"] .up-card, :root[data-theme="light"] .mship{
  --surface:#000000; --surface-2:#0D1117; --border:#252C36; --text:#ECEFF2; --text-muted:#8B96A3; --good:#0EE23F; --danger:#FF5A5F; --warn:#F2B705; color-scheme:dark;
}
:root[data-theme="light"]{ background:#E5E9EF; }
:root[data-theme="light"] body::before{ background:radial-gradient(1100px 650px at 0% 0%, color-mix(in srgb, var(--accent) 12%, transparent), transparent 66%), radial-gradient(900px 600px at 100% 100%, color-mix(in srgb, var(--accent) 8%, transparent), transparent 70%), #EEF1F5; }
:root[data-theme="light"] .panel{ background-color:#FFFFFF; }
:root[data-theme="light"] .panel .panel, :root[data-theme="light"] .feature-card, :root[data-theme="light"] .mb-box{ background-color:var(--surface-2); }
:root[data-theme="light"] .table-wrap, :root[data-theme="light"] table{ color:var(--text); }
:root[data-theme="light"] input, :root[data-theme="light"] select, :root[data-theme="light"] textarea{ color:var(--text); }
:root[data-theme="light"] .home-hero .btn.secondary{ color:#fff; }
:root[data-theme="light"] ::selection{ background:var(--accent); color:var(--accent-ink); }
:root[data-theme="light"] header.topbar nav.tabs button[aria-selected="true"]{ color:#fff; }
/* things that were built with translucent black on a dark page */
:root[data-theme="light"] .pv-banner{ background:#FFF4D6; color:#4a3500; border-color:#E8C560; }
:root[data-theme="light"] .nph-card, :root[data-theme="light"] .nbr-card, :root[data-theme="light"] .lab-us-card, :root[data-theme="light"] .lab-def, :root[data-theme="light"] .lab-game{ background:var(--surface); }
:root[data-theme="light"] .nph-chip.on{ color:var(--accent-ink); }
:root[data-theme="light"] .nph-linelab{ fill:#201700; }
:root[data-theme="light"] .pm-head, :root[data-theme="light"] .nbd-stage{ color:#fff; }

/* ===== background styles ===== */
html[data-bg="plain"] body::before{ background:var(--bg) !important; }
html[data-bg="glow"] body::before{ background:radial-gradient(900px 520px at 15% -5%, color-mix(in srgb, var(--accent) 34%, transparent), transparent 70%), radial-gradient(800px 500px at 95% 105%, color-mix(in srgb, var(--accent) 22%, transparent), transparent 70%), var(--bg) !important; }

/* ===== corners ===== */
html[data-radius="sharp"]{ --radius:2px; }
html[data-radius="sharp"] .panel, html[data-radius="sharp"] .btn, html[data-radius="sharp"] button.btn, html[data-radius="sharp"] .feature-card, html[data-radius="sharp"] .pricing-card, html[data-radius="sharp"] .nph-card,
html[data-radius="sharp"] .lab-us-card, html[data-radius="sharp"] .nbr-card, html[data-radius="sharp"] .cz-card, html[data-radius="sharp"] .fy-team, html[data-radius="sharp"] .home-hero, html[data-radius="sharp"] .table-wrap,
html[data-radius="sharp"] input, html[data-radius="sharp"] select, html[data-radius="sharp"] .modal, html[data-radius="sharp"] .up-card, html[data-radius="sharp"] .tour-card, html[data-radius="sharp"] .pill{ border-radius:3px !important; }
html[data-radius="round"]{ --radius:18px; }
html[data-radius="round"] .panel, html[data-radius="round"] .feature-card, html[data-radius="round"] .pricing-card, html[data-radius="round"] .nph-card, html[data-radius="round"] .lab-us-card, html[data-radius="round"] .nbr-card,
html[data-radius="round"] .cz-card, html[data-radius="round"] .fy-team, html[data-radius="round"] .home-hero, html[data-radius="round"] .up-card, html[data-radius="round"] .tour-card{ border-radius:24px !important; }
html[data-radius="round"] .btn, html[data-radius="round"] button.btn, html[data-radius="round"] input, html[data-radius="round"] select{ border-radius:999px !important; }

/* ===== text size ===== */
html[data-fs="s"]{ font-size:14.5px; } html[data-fs="l"]{ font-size:18px; }
@media (max-width:640px){ html[data-fs="s"]{ font-size:12.5px !important; } html[data-fs="l"]{ font-size:16px !important; } }

/* ===== header quick toggle + Customize tab ===== */
.theme-btn{ color:#fff !important; background:rgba(255,255,255,.1) !important; border:1px solid rgba(255,255,255,.25) !important; width:36px; height:36px; padding:0; border-radius:50%; font-size:1.05rem; line-height:1; display:inline-flex; align-items:center; justify-content:center; }
#tab-customize{ white-space:nowrap; }

/* ===== Customize page ===== */
.cz-page{ max-width:1000px; margin:0 auto; }
.cz-h{ margin:24px 0 6px; font-size:1.1rem; } .cz-h small{ color:var(--text-muted); font-weight:500; font-size:.8rem; margin-left:6px; }
.cz-grid{ display:grid; grid-template-columns:repeat(auto-fit, minmax(230px, 1fr)); gap:12px; }
.cz-card{ border:1px solid var(--border); border-radius:14px; background:var(--surface-2); padding:14px; }
.cz-card h4{ margin:0 0 10px; font-family:'Oswald',sans-serif; font-size:.9rem; letter-spacing:.06em; text-transform:uppercase; color:var(--text-muted); }
.cz-seg{ display:flex; border:1px solid var(--border); border-radius:12px; overflow:hidden; background:var(--surface); }
.cz-seg button{ flex:1; padding:10px 6px; border:0; background:transparent; color:var(--text); font-family:inherit; font-size:.82rem; font-weight:700; cursor:pointer; }
.cz-seg button + button{ border-left:1px solid var(--border); }
.cz-seg button.on{ background:var(--accent); color:var(--accent-ink); }
.cz-sw{ display:flex; flex-wrap:wrap; gap:9px; align-items:center; }
.cz-dot{ width:32px; height:32px; border-radius:50%; border:3px solid transparent; box-shadow:0 0 0 1px var(--border); cursor:pointer; padding:0; }
.cz-dot.on{ border-color:var(--surface); box-shadow:0 0 0 3px var(--text); }
.cz-pick{ position:relative; display:inline-flex; align-items:center; gap:6px; font-size:.78rem; font-weight:700; color:var(--text-muted); cursor:pointer; }
.cz-pick input{ width:34px; height:34px; padding:0; border:0; background:none; cursor:pointer; border-radius:50%; }
.cz-n{ font-style:normal; margin-left:4px; padding:0 6px; border-radius:8px; background:var(--accent); color:var(--accent-ink); font-size:.7rem; }
.cz-teams{ display:grid; grid-template-columns:repeat(auto-fill, minmax(150px, 1fr)); gap:8px; margin-top:10px; }
.cz-team{ position:relative; display:flex; align-items:center; gap:9px; padding:8px 10px; border-radius:12px; border:1px solid var(--border); background:var(--surface-2); color:var(--text); font-family:inherit; font-size:.8rem; font-weight:700; text-align:left; cursor:pointer; }
.cz-team img{ width:34px; height:34px; object-fit:contain; flex:none; } .cz-team span{ flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.cz-team i{ font-style:normal; color:var(--border); font-size:1rem; }
.cz-team.on{ border-color:var(--accent); background:var(--accent-soft, color-mix(in srgb, var(--accent) 14%, transparent)); } .cz-team.on i{ color:var(--accent); }
@media (max-width:640px){ .cz-teams{ grid-template-columns:repeat(2, 1fr); } }

/* ===== Home: For you ===== */
.fy{ margin-bottom:20px; }
.fy-prompt{ display:flex; align-items:center; gap:16px; flex-wrap:wrap; } .fy-prompt > div:first-child{ flex:1 1 320px; } .fy-prompt h2{ margin:2px 0; } .fy-btns{ display:flex; gap:10px; flex-wrap:wrap; }
.fy-grid{ display:grid; grid-template-columns:repeat(auto-fill, minmax(250px, 1fr)); gap:12px; margin-top:6px; }
.fy-team{ border:1px solid var(--border); border-radius:14px; background:var(--surface-2); padding:12px 14px; }
.fy-th{ display:flex; align-items:center; gap:10px; margin-bottom:8px; } .fy-th img{ width:40px; height:40px; object-fit:contain; } .fy-th b{ display:block; font-family:'Oswald',sans-serif; font-size:1.02rem; letter-spacing:.02em; } .fy-th small{ color:var(--text-muted); font-size:.72rem; }
.fy-row{ display:flex; align-items:center; gap:10px; padding:6px 0; border-top:1px solid var(--border); font-size:.84rem; } .fy-row small{ width:34px; flex:none; font-size:.66rem; letter-spacing:.08em; text-transform:uppercase; color:var(--text-muted); font-weight:700; }
.fy-row span{ display:flex; align-items:center; gap:5px; flex-wrap:wrap; } .fy-row img{ vertical-align:middle; }
.fy-w{ color:var(--good); } .fy-l{ color:var(--danger); } .fy-live{ color:#fff; background:#ff3b3b; border-radius:5px; padding:0 6px; font-size:.7rem; } .fy-when{ color:var(--text-muted); font-size:.78rem; } .fy-none{ color:var(--text-muted); }
.fy-news{ display:grid; grid-template-columns:repeat(auto-fill, minmax(300px, 1fr)); gap:8px; }
.fy-n{ display:flex; align-items:flex-start; gap:10px; padding:10px 12px; border-radius:12px; border:1px solid var(--border); background:var(--surface-2); color:var(--text); text-decoration:none; }
.fy-n:hover{ border-color:var(--accent); } .fy-n img{ width:22px; height:22px; object-fit:contain; margin-top:2px; flex:none; } .fy-n b{ display:block; font-size:.86rem; line-height:1.3; } .fy-n small{ color:var(--text-muted); font-size:.72rem; }
.fy-links{ display:flex; flex-wrap:wrap; gap:8px 18px; margin-top:14px; }
.fy-ql{ display:inline-flex; align-items:center; gap:6px; flex-wrap:wrap; } .fy-ql small{ color:var(--text-muted); font-weight:700; letter-spacing:.06em; text-transform:uppercase; font-size:.66rem; }
.fy-ql button{ border:1px solid var(--border); background:var(--surface-2); color:var(--text); border-radius:999px; padding:5px 12px; font-family:inherit; font-size:.78rem; font-weight:600; cursor:pointer; } .fy-ql button:hover{ border-color:var(--accent); color:var(--accent); }
@media (max-width:640px){ .fy-grid{ grid-template-columns:1fr; } .fy-news{ grid-template-columns:1fr; } }
/* ---------- My Bets (bet tracker) ---------- */
.bt-panel{ max-width:1000px; margin:0 auto; }
.bt-bar{ display:flex; flex-wrap:wrap; gap:10px 16px; align-items:center; justify-content:space-between; margin:4px 0 12px; }
.bt-btns{ display:flex; flex-wrap:wrap; gap:8px; }
.bt-btns .btn{ padding:9px 14px; }
.bt-sync{ font-size:0.78rem; color:var(--text-muted); }
.bt-sync.on{ color:var(--good); font-weight:600; }
.bt-sync a{ color:var(--accent); }
.bt-flash{ margin:0 0 10px; padding:8px 12px; border-radius:9px; background:var(--good-bg); color:var(--good); font-size:0.84rem; font-weight:600; }
.bt-filters{ display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin:0 0 12px; min-width:0; }
.bt-filters select{ width:auto; max-width:100%; flex:0 1 auto; }
.bt-filters select, .bt-unit input{ background:var(--surface); color:var(--text); border:1px solid var(--border); border-radius:8px; padding:7px 10px; font:inherit; font-size:0.84rem; }
.bt-unit{ margin-left:auto; font-size:0.8rem; color:var(--text-muted); display:flex; align-items:center; gap:4px; }
.bt-unit input{ width:68px; }
.bt-tiles{ display:grid; grid-template-columns:repeat(5, minmax(0,1fr)); gap:10px; margin:0 0 14px; }
.bt-tile{ min-width:0; padding:12px 8px; }
.bt-tile .stat-tile-value{ font-size:1.35rem; }
.bt-tile.good{ background:var(--good-bg); border-color:var(--good); }
.bt-tile.good .stat-tile-value{ color:var(--good); }
.bt-tile.bad{ background:var(--danger-bg); border-color:var(--danger); }
.bt-tile.bad .stat-tile-value{ color:var(--danger); }
.bt-sub{ font-size:0.68rem; color:var(--text-muted); margin-top:4px; }
.bt-box{ background:var(--surface); border:1px solid var(--border); border-radius:12px; padding:14px; margin:0 0 14px; min-width:0; }
.bt-chart{ width:100%; height:auto; display:block; }
.bt-zero{ stroke:var(--border); stroke-width:1; stroke-dasharray:4 4; }
.bt-line{ fill:none; stroke-width:2.5; stroke-linejoin:round; stroke-linecap:round; }
.bt-line.up{ stroke:var(--good); } .bt-line.dn{ stroke:var(--danger); }
.bt-area.up{ fill:var(--good); opacity:0.12; } .bt-area.dn{ fill:var(--danger); opacity:0.12; }
.bt-dot.up{ fill:var(--good); } .bt-dot.dn{ fill:var(--danger); }
.bt-end{ font-family:'Oswald',sans-serif; font-size:14px; font-weight:600; } .bt-end.up{ fill:var(--good); } .bt-end.dn{ fill:var(--danger); }
.bt-ax{ font-size:11px; fill:var(--text-muted); }
.bt-bds{ display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:14px 18px; }
.bt-bd h4{ margin:0 0 4px; font-size:0.78rem; text-transform:uppercase; letter-spacing:0.05em; color:var(--text-muted); }
.bt-tbl td:first-child{ white-space:normal; }
.bt-pos{ color:var(--good); font-weight:700; } .bt-neg{ color:var(--danger); font-weight:700; }
.bt-lock{ display:flex; flex-direction:column; align-items:flex-start; gap:6px; background:var(--surface-2); border:1px dashed var(--border); border-radius:12px; padding:14px; margin:0 0 14px; }
.bt-lock span{ font-size:0.86rem; color:var(--text-muted); }
.bt-list{ display:flex; flex-direction:column; gap:10px; }
.bt-card{ background:var(--surface); border:1px solid var(--border); border-left:4px solid var(--border); border-radius:12px; padding:12px 14px; min-width:0; }
.bt-card.won{ border-left-color:var(--good); } .bt-card.lost{ border-left-color:var(--danger); } .bt-card.pending{ border-left-color:var(--accent); }
.bt-top{ display:flex; align-items:center; gap:12px; }
.bt-main{ flex:1; min-width:0; }
.bt-main b{ display:block; font-size:0.98rem; overflow-wrap:anywhere; }
.bt-main small{ color:var(--text-muted); font-size:0.78rem; }
.bt-chip{ flex:none; font-size:0.68rem; font-weight:700; text-transform:uppercase; letter-spacing:0.05em; padding:4px 9px; border-radius:7px; background:var(--surface-2); color:var(--text-muted); }
.bt-chip.won{ background:var(--good-bg); color:var(--good); } .bt-chip.lost{ background:var(--danger-bg); color:var(--danger); } .bt-chip.pending{ background:var(--warn-bg); color:var(--warn); }
.bt-amt{ flex:none; text-align:right; }
.bt-amt small{ display:block; font-size:0.65rem; text-transform:uppercase; letter-spacing:0.05em; color:var(--text-muted); }
.bt-amt b{ font-family:'Oswald',sans-serif; font-size:1.1rem; }
.bt-legs{ list-style:none; margin:8px 0 0; padding:0; display:flex; flex-direction:column; gap:4px; font-size:0.84rem; }
.bt-legs li{ display:flex; gap:8px; align-items:flex-start; }
.bt-legs em{ font-style:normal; color:var(--text-muted); font-size:0.78rem; }
.bt-legs small{ display:block; color:var(--text-muted); }
.bt-lg{ flex:none; width:18px; height:18px; border-radius:50%; background:var(--surface-2); color:var(--text-muted); font-style:normal; font-size:0.7rem; font-weight:800; display:inline-flex; align-items:center; justify-content:center; margin-top:1px; }
.bt-lg.won{ background:var(--good); color:#fff; } .bt-lg.lost{ background:var(--danger); color:#fff; }
.bt-tags{ display:flex; gap:6px; margin-top:8px; flex-wrap:wrap; }
.bt-tag{ font-size:0.7rem; padding:2px 8px; border-radius:6px; background:var(--surface-2); color:var(--text-muted); border:1px solid var(--border); }
.bt-note{ margin:8px 0 0; font-size:0.8rem; color:var(--text-muted); }
.bt-acts{ display:flex; flex-wrap:wrap; gap:6px; margin-top:10px; align-items:center; }
.bt-sp{ flex:1; }
.bt-mini{ font:inherit; font-size:0.76rem; font-weight:600; padding:5px 11px; border-radius:7px; border:1px solid var(--border); background:transparent; color:var(--text); cursor:pointer; }
.bt-mini:hover{ background:var(--surface-2); }
.bt-mini.won{ color:var(--good); border-color:var(--good); } .bt-mini.lost{ color:var(--danger); border-color:var(--danger); }
.bt-mini.del{ color:var(--text-muted); }
.bt-empty{ text-align:center; padding:34px 16px; background:var(--surface); border:1px dashed var(--border); border-radius:14px; margin:6px 0 14px; }
.bt-empty.small{ padding:16px; margin:0; font-size:0.86rem; color:var(--text-muted); }
.bt-empty h3{ margin:6px 0; font-family:'Oswald',sans-serif; }
.bt-empty p{ max-width:560px; margin:6px auto 14px; color:var(--text-muted); font-size:0.9rem; }
.bt-big{ font-size:2.4rem; }
.bt-sync-box{ display:flex; flex-direction:column; gap:3px; margin:16px 0 8px; padding:12px 14px; border-radius:12px; background:var(--surface-2); border:1px solid var(--border); font-size:0.82rem; }
.bt-sync-box span{ color:var(--text-muted); }

/* tabs + calendar */
.bt-tabs{ display:flex; gap:6px; margin:0 0 12px; }
.bt-tabs button{ font:inherit; font-weight:600; font-size:0.86rem; padding:8px 16px; border-radius:999px; border:1px solid var(--border); background:transparent; color:var(--text); cursor:pointer; }
.bt-tabs button.on{ background:var(--accent); border-color:var(--accent); color:var(--accent-ink); }
.bt-cal-head{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin:0 0 12px; }
.bt-cal-nav{ display:flex; align-items:center; gap:10px; }
.bt-cal-nav h3{ margin:0; font-family:'Oswald',sans-serif; font-size:1.3rem; min-width:9.5em; text-align:center; }
.bt-cal-nav .btn, .bt-cal-head > .btn{ padding:7px 14px; }
.bt-dow{ display:grid; grid-template-columns:repeat(7, minmax(0,1fr)); gap:4px; margin:0 0 4px; text-align:center; font-size:0.68rem; font-weight:700; text-transform:uppercase; letter-spacing:0.05em; color:var(--text-muted); }
.bt-grid-cal{ display:grid; grid-template-columns:repeat(7, minmax(0,1fr)); gap:4px; }
.bt-day{ font:inherit; color:var(--text); text-align:left; min-width:0; min-height:74px; padding:6px 7px; border-radius:9px; border:1px solid var(--border); background:var(--surface-2); cursor:pointer; display:flex; flex-direction:column; gap:2px; position:relative; }
.bt-day .n{ font-size:0.74rem; font-weight:700; color:var(--text-muted); }
.bt-day b{ font-family:'Oswald',sans-serif; font-size:0.98rem; line-height:1.1; }
.bt-day i{ font-style:normal; font-size:0.62rem; color:var(--text-muted); line-height:1.2; }
.bt-day.out{ opacity:0.38; }
.bt-day.pos{ background:var(--good-bg); border-color:var(--good); } .bt-day.pos b{ color:var(--good); }
.bt-day.neg{ background:var(--danger-bg); border-color:var(--danger); } .bt-day.neg b{ color:var(--danger); }
.bt-day.open{ border-style:dashed; border-color:var(--accent); }
.bt-day.today .n{ color:var(--accent); }
.bt-day.today::after{ content:''; position:absolute; top:6px; right:6px; width:7px; height:7px; border-radius:50%; background:var(--accent); }
.bt-day.sel{ outline:2px solid var(--accent); outline-offset:1px; }
.bt-day:hover{ filter:brightness(1.08); }
.bt-gh{ display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap; }
.bt-seg button{ padding:7px 14px; }
.bt-sh{ margin:14px 0 6px; font-size:0.78rem; text-transform:uppercase; letter-spacing:0.05em; color:var(--text-muted); }
.bt-bar.up{ fill:var(--good); } .bt-bar.dn{ fill:var(--danger); }
.bt-val{ font-size:11px; font-weight:700; } .bt-val.up{ fill:var(--good); } .bt-val.dn{ fill:var(--danger); }

/* the ＋ button on props rows and the Track button in the Deep Dive */
.bt-add{ font:inherit; line-height:1; cursor:pointer; border:1px solid var(--border); background:var(--surface); color:var(--accent); border-radius:50%; width:22px; height:22px; padding:0; margin-left:6px; font-size:0.95rem; font-weight:700; vertical-align:middle; display:inline-flex; align-items:center; justify-content:center; }
.bt-add:hover, .bt-add.static{ background:var(--accent); border-color:var(--accent); color:var(--accent-ink); }
.bt-add.static{ cursor:default; margin:0 2px; }
.bt-add.wide{ width:auto; height:auto; border-radius:9px; margin:10px 0 0; padding:9px 14px; font-size:0.84rem; font-family:'Oswald',sans-serif; letter-spacing:0.02em; display:flex; width:100%; background:var(--accent); border-color:var(--accent); color:var(--accent-ink); }
.bt-add.wide:hover{ filter:brightness(1.07); }

/* add / import window */
.bt-modal{ position:fixed; inset:0; z-index:10050; background:rgba(5,10,7,0.62); display:none; align-items:center; justify-content:center; padding:14px; overflow-y:auto; }
.bt-modal.show{ display:flex; }
body.bt-open{ overflow:hidden; }
.bt-sheet{ position:relative; background:var(--surface); color:var(--text); border:1px solid var(--border); border-radius:16px; width:100%; max-width:560px; max-height:calc(100vh - 28px); overflow-y:auto; padding:20px 18px 16px; box-shadow:var(--shadow-md); outline:none; }
.bt-sheet h3{ margin:0 28px 12px 0; font-family:'Oswald',sans-serif; font-size:1.25rem; }
.bt-close{ position:absolute; top:10px; right:10px; border:none; background:transparent; color:var(--text-muted); font-size:1.1rem; cursor:pointer; padding:6px 9px; border-radius:8px; }
.bt-close:hover{ background:var(--surface-2); }
.bt-sheet label{ display:flex; flex-direction:column; gap:4px; font-size:0.74rem; font-weight:600; color:var(--text-muted); min-width:0; }
.bt-sheet label small{ font-weight:400; }
.bt-sheet input, .bt-sheet select{ background:var(--bg); color:var(--text); border:1px solid var(--border); border-radius:8px; padding:9px 10px; font:inherit; font-size:0.92rem; font-weight:500; min-width:0; width:100%; box-sizing:border-box; }
.bt-leg{ border:1px solid var(--border); border-radius:12px; padding:10px; margin:0 0 10px; display:flex; flex-direction:column; gap:8px; background:var(--surface-2); }
.bt-lrow{ display:flex; gap:8px; align-items:flex-end; }
.bt-lrow label{ flex:1; }
.bt-lrow label.grow{ flex:2; }
.bt-team{ font-size:0.76rem; color:var(--text-muted); padding-bottom:10px; white-space:nowrap; }
.bt-x{ flex:none; border:1px solid var(--border); background:transparent; color:var(--text-muted); border-radius:8px; width:36px; height:38px; cursor:pointer; }
.bt-link{ border:none; background:transparent; color:var(--accent); font:inherit; font-size:0.84rem; font-weight:600; cursor:pointer; padding:2px 0 12px; }
.bt-grid{ display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:10px; margin:0 0 10px; }
.bt-grid.one{ grid-template-columns:1fr; }
.bt-n{ margin:0 0 6px; }
.bt-wins{ min-height:1.2em; margin:4px 0; font-size:0.84rem; color:var(--good); font-weight:600; }
.bt-err{ margin:0; min-height:1.1em; font-size:0.82rem; color:var(--danger); font-weight:600; }
.bt-foot{ display:flex; gap:8px; justify-content:flex-end; margin-top:10px; }
.bt-toast{ position:fixed; left:50%; bottom:78px; transform:translate(-50%, 20px); opacity:0; pointer-events:none; z-index:10060; background:var(--surface); color:var(--text); border:1px solid var(--accent); border-radius:12px; padding:10px 16px; font-size:0.86rem; font-weight:600; box-shadow:var(--shadow-md); transition:opacity .2s, transform .2s; }
.bt-toast.show{ opacity:1; transform:translate(-50%, 0); pointer-events:auto; }
.bt-toast a{ color:var(--accent); margin-left:8px; }

@media (max-width:720px){
  .bt-tiles{ grid-template-columns:repeat(3, minmax(0,1fr)); }
  .bt-bds{ grid-template-columns:1fr; }
  .bt-unit{ margin-left:0; }
  .bt-top{ flex-wrap:wrap; }
  .bt-amt{ margin-left:auto; }
}
@media (max-width:640px){
  .bt-day{ min-height:54px; padding:4px 4px; border-radius:7px; }
  .bt-day b{ font-size:0.74rem; }
  .bt-day i{ display:none; }
  .bt-grid-cal, .bt-dow{ gap:3px; }
  .bt-cal-nav h3{ min-width:0; font-size:1.05rem; }
}
@media (max-width:480px){
  .bt-tiles{ grid-template-columns:repeat(2, minmax(0,1fr)); }
  .bt-btns .btn{ flex:1 1 calc(50% - 8px); }
  .bt-lrow{ flex-wrap:wrap; }
  .bt-sheet{ padding:18px 14px 14px; }
}
/* ---------- Deep Dive: the opposing team's card (see snippet-oppcard.js) ---------- */
.opp-card{ display:block; }
.opp-head{ display:flex; align-items:center; gap:10px; margin:0 0 6px; } .opp-head > div{ min-width:0; }
.opp-head img, .opp-head .team-badge, .opp-head .nhl-logo{ flex:none; }
.opp-head b{ display:block; font-family:'Oswald',sans-serif; font-size:1.08rem; line-height:1.15; } .opp-head small{ display:block; color:var(--text-muted); font-size:.74rem; }
.opp-q{ margin:0 0 8px; font-size:.84rem; line-height:1.45; color:var(--text); }
.opp-legend{ display:flex; flex-wrap:wrap; gap:4px 14px; margin:0 0 10px; font-size:.7rem; font-weight:600; color:var(--text-muted); }
.opp-legend span{ display:inline-flex; align-items:center; gap:5px; } .opp-legend i{ width:11px; height:11px; border-radius:50%; display:inline-block; }
.opp-legend i.g{ background:var(--good); } .opp-legend i.r{ background:var(--danger); } .opp-legend i.m{ background:var(--text-muted); opacity:.65; }
.opp-grid{ display:grid; grid-template-columns:repeat(auto-fill, minmax(118px, 1fr)); gap:8px; }
.opp-grid-info{ grid-template-columns:repeat(auto-fill, minmax(96px, 1fr)); }
.opp-sub{ margin:14px 0 6px; font-size:.66rem; font-weight:700; letter-spacing:.07em; text-transform:uppercase; color:var(--text-muted); }
.opp-t{ --c:var(--text-muted); --bg:5%; position:relative; padding:8px 10px 11px; border-radius:12px; border:1px solid color-mix(in srgb, var(--c) 55%, var(--border)); background:color-mix(in srgb, var(--c) var(--bg), var(--surface-2)); overflow:hidden; text-align:left; }
.opp-t.hi{ --c:var(--good); --bg:22%; } .opp-t.lo{ --c:var(--danger); --bg:22%; }
.opp-t::before{ content:''; position:absolute; left:0; top:0; bottom:0; width:4px; background:var(--c); opacity:.9; }
.opp-t.mid::before, .opp-t.na::before{ opacity:.3; }
.opp-t em{ display:block; font-style:normal; font-size:.56rem; font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:var(--c); margin:0 0 3px 2px; }
.opp-t.mid em{ color:var(--text-muted); }
.opp-t small{ display:block; font-size:.66rem; font-weight:700; letter-spacing:.04em; color:var(--text-muted); margin-left:2px; }
.opp-t b{ display:block; font-family:'Oswald',sans-serif; font-size:1.35rem; line-height:1.15; margin:1px 0 1px 2px; color:var(--text); }
.opp-t.hi b{ color:var(--good); } .opp-t.lo b{ color:var(--danger); }
.opp-t i{ display:block; font-style:normal; font-size:.7rem; color:var(--text-muted); margin-left:2px; }
.opp-t.na{ padding-top:10px; } .opp-t.na b{ font-size:1.12rem; }
.opp-t.cur{ outline:2px solid var(--accent); outline-offset:1px; }
.opp-bar{ display:block; position:relative; height:5px; margin:7px 2px 0; border-radius:3px; background:linear-gradient(90deg, var(--danger), color-mix(in srgb, var(--text-muted) 60%, var(--surface-2)) 50%, var(--good)); opacity:.9; }
.opp-bar u{ position:absolute; top:50%; width:11px; height:11px; margin:-5.5px 0 0 -5.5px; border-radius:50%; background:var(--text); border:2px solid var(--surface); box-shadow:0 0 0 1px var(--border); }
.opp-notes{ margin-top:10px; font-size:.78rem; color:var(--text-muted); display:flex; flex-direction:column; gap:3px; } .opp-notes b{ color:var(--text); }
@media (max-width:560px){ .opp-grid{ grid-template-columns:repeat(2, minmax(0, 1fr)); } .opp-grid-info{ grid-template-columns:repeat(3, minmax(0, 1fr)); } .opp-t b{ font-size:1.2rem; } }
/* ---------- phones: denser layout so more information fits on screen (<=640px; desktop is untouched) ----------
   Measured on the live site at 375px: header 191px -> 131px and pages 14-29% shorter, with the same content.
   Loaded last so it wins over the older per-page rules. Text inputs stay 16px: below that iOS zooms the page when a box is focused. */
@media (max-width:640px){
  html{ font-size:14px; }                       /* every rem-sized size, padding and gap scales down ~12% */
  body{ line-height:1.4; }
  main{ padding:10px 8px 56px !important; }
  .panel{ padding:11px !important; margin-bottom:11px !important; border-radius:12px !important; }
  .panel-head{ margin-bottom:7px !important; gap:6px !important; }
  .hint{ font-size:0.78rem !important; margin:2px 0 8px !important; line-height:1.38 !important; }
  h1{ font-size:1.5rem !important; } h2{ font-size:1rem !important; } h3{ font-size:0.95rem !important; }
  table th, table td{ padding-top:5px !important; padding-bottom:5px !important; }
  /* header: logo and the Start Free / trial pill share the first row, section tabs next, search last */
  header.topbar{ padding:6px 10px !important; gap:6px 8px !important; }
  header.topbar .brand{ order:1; } header.topbar .brand img{ height:34px !important; width:auto !important; }
  header.topbar .topbar-right{ order:2; margin-left:auto; }
  header.topbar nav.tabs{ order:3; flex:1 1 100%; width:100%; }
  header.topbar nav.tabs button{ padding:7px 11px !important; font-size:0.78rem !important; }
  header.topbar .site-search{ order:4; flex:1 1 100%; width:100%; }
  header.topbar .site-search input{ width:100% !important; height:34px; }
  nav.subtabs{ padding:6px 10px !important; } nav.subtabs button{ padding:6px 11px !important; }
  input, select, textarea{ font-size:16px !important; }

  /* sub-tabs: one swipeable row instead of three or four wrapped lines (the active tab is scrolled into view) */
  nav.subtabs:not(.sport-cats){ flex-wrap:nowrap !important; overflow-x:auto !important; scrollbar-width:none; -webkit-overflow-scrolling:touch; gap:2px !important; padding:2px 10px 0 !important;
    -webkit-mask-image:linear-gradient(to right, transparent, #000 14px, #000 calc(100% - 22px), transparent); mask-image:linear-gradient(to right, transparent, #000 14px, #000 calc(100% - 22px), transparent); }
  nav.subtabs:not(.sport-cats)::-webkit-scrollbar{ display:none; }
  nav.subtabs:not(.sport-cats) button{ flex:0 0 auto; white-space:nowrap; padding:11px 12px !important; }

  /* comfortable thumb targets */
  .btn, button.btn{ min-height:40px; }
  .toggle-group button, .cat-filters button{ min-height:36px; }
  select{ min-height:42px; }
  body{ padding-bottom:56px; }                                  /* keeps the last line clear of the live score ticker */

  /* NBA Player Props: each prop becomes a card instead of an 11-column table that runs off the screen */
  #view-nba-props .table-wrap{ overflow:visible !important; border:0 !important; }
  #view-nba-props table.nbp-table:not(.nbr-alt), #view-nba-props table.nbp-table:not(.nbr-alt) tbody{ display:block; width:100%; min-width:0 !important; }
  #view-nba-props table.nbp-table:not(.nbr-alt) thead{ display:none; }
  #view-nba-props tr.nbp-row{ display:grid; grid-template-columns:repeat(4, 1fr); gap:6px; padding:10px 8px; margin:0 0 8px; border:1px solid var(--border); border-radius:12px; background:var(--surface-2); }
  #view-nba-props tr.nbp-row.open{ border-color:var(--accent); border-bottom-left-radius:0; border-bottom-right-radius:0; margin-bottom:0; }
  #view-nba-props tr.nbp-row > td{ display:block; border:0 !important; padding:0 !important; text-align:left; white-space:normal; min-width:0; }
  #view-nba-props tr.nbp-row > td:nth-child(2), #view-nba-props tr.nbp-row > td:nth-child(7), #view-nba-props tr.nbp-row > td:nth-child(10), #view-nba-props tr.nbp-row > td:nth-child(11){ display:none !important; }
  #view-nba-props tr.nbp-row > td:nth-child(1){ grid-column:1 / -1; }
  #view-nba-props tr.nbp-row > td:nth-child(3), #view-nba-props tr.nbp-row > td:nth-child(4), #view-nba-props tr.nbp-row > td:nth-child(5), #view-nba-props tr.nbp-row > td:nth-child(6){ display:block !important; text-align:center; background:rgba(0,0,0,.28); border-radius:9px; padding:6px 2px !important; }
  #view-nba-props tr.nbp-row > td:nth-child(3)::before, #view-nba-props tr.nbp-row > td:nth-child(4)::before, #view-nba-props tr.nbp-row > td:nth-child(5)::before, #view-nba-props tr.nbp-row > td:nth-child(6)::before{ display:block; font-size:.62rem; letter-spacing:.06em; text-transform:uppercase; color:var(--text-muted); margin-bottom:2px; }
  #view-nba-props tr.nbp-row > td:nth-child(3)::before{ content:'Line'; } #view-nba-props tr.nbp-row > td:nth-child(4)::before{ content:'Over'; }
  #view-nba-props tr.nbp-row > td:nth-child(5)::before{ content:'Under'; } #view-nba-props tr.nbp-row > td:nth-child(6)::before{ content:'Our proj'; }
  #view-nba-props tr.nbp-row > td:nth-child(8){ display:block !important; grid-column:1 / span 3; }
  #view-nba-props tr.nbp-row > td:nth-child(9){ display:block !important; text-align:right; align-self:center; }
  #view-nba-props tr.nbp-row > td:nth-child(9)::before{ content:'EV '; font-size:.62rem; color:var(--text-muted); }
  #view-nba-props tr.nbp-detail{ display:block; margin:0 0 8px; border:1px solid var(--accent); border-top:0; border-radius:0 0 12px 12px; background:var(--surface-2); }
  #view-nba-props tr.nbp-detail > td{ display:block; padding:8px !important; }
  #view-nba-props .nbp-dgrid{ grid-template-columns:1fr !important; }
  #view-nba-props .nbp-who{ min-width:0; }

  /* Season Predictor rows fit a 390px screen: smaller grip/inputs, tighter name column */
  .nbd-row{ gap:6px !important; padding:7px 6px !important; } .nbd-grip{ display:none !important; }
  .nbd-name{ min-width:0; } .nbd-name b{ white-space:normal !important; overflow:visible !important; text-overflow:clip !important; font-size:.86rem; line-height:1.15; display:block; }
  .nbd-wl{ gap:3px !important; } .nbd-wl input{ width:40px !important; padding:5px 1px !important; } .nbd-name small{ font-size:.66rem; white-space:normal; }
  .nbd-mv button{ min-width:34px; min-height:34px; }
}

/* ================= phone "app" layout (<=640px) =================
   A bottom tab bar replaces the top sport tabs, the page gets bigger type and thumb-sized controls, the live scores sit just above the bar,
   and everything respects the notch / home-indicator safe areas. Desktop and tablets keep the normal site. */
#appbar, #appsheet{ display:none; }
@media (max-width:640px){
  :root{ --ab-h:58px; --ab-safe:env(safe-area-inset-bottom, 0px); }
  html{ font-size:15px; }
  body{ line-height:1.5; padding-bottom:calc(var(--ab-h) + var(--ab-safe) + 36px) !important; overscroll-behavior-y:none; }
  main{ padding:10px 10px 18px !important; }
  /* header: just the logo, the account pill and search; the sections live in the bottom bar */
  header.topbar{ padding:calc(6px + env(safe-area-inset-top, 0px)) 12px 6px !important; position:sticky; top:0; z-index:40; }
  header.topbar nav.tabs{ display:none !important; }
  header.topbar .brand img{ height:32px !important; }
  header.topbar .site-search input{ height:40px; border-radius:12px; }
  header.topbar .site-search{ display:none !important; } body.ab-search header.topbar .site-search{ display:block !important; }   /* search lives under More; it slides open when asked for */
  /* Spread Score: one card per player instead of a 9-column table */
  #view-spreadscore .table-wrap{ overflow:visible !important; border:0 !important; }
  #view-spreadscore .ss-table, #view-spreadscore .ss-table tbody{ display:block; width:100%; min-width:0 !important; } #view-spreadscore .ss-table thead{ display:none; }
  #view-spreadscore .ss-table tr{ display:flex; flex-wrap:wrap; align-items:center; gap:4px 12px; padding:12px; margin:0 0 10px; border:1px solid var(--border, rgba(255,255,255,.12)); border-radius:14px; background:var(--surface-2, rgba(255,255,255,.04)); }
  #view-spreadscore .ss-table td{ display:block; border:0 !important; padding:0 !important; white-space:normal !important; text-align:left; font-size:.82rem; color:var(--text-muted, #97a3b2); }
  #view-spreadscore .ss-table td:nth-child(1){ order:1; flex:0 0 26px; font-size:1.05rem; } #view-spreadscore .ss-table td:nth-child(2){ order:2; flex:1 1 calc(100% - 140px); color:inherit; } #view-spreadscore .ss-table td:nth-child(2) .clickable-name{ font-size:1.05rem; font-weight:700; }
  #view-spreadscore .ss-table td:nth-child(5){ order:3; flex:0 0 90px; text-align:right; } #view-spreadscore .ss-score{ font-size:1.55rem; }
  #view-spreadscore .ss-table td:nth-child(3){ order:4; margin-left:38px; } #view-spreadscore .ss-table td:nth-child(4){ order:5; } #view-spreadscore .ss-table td:nth-child(6){ order:6; } #view-spreadscore .ss-table td:nth-child(7){ order:7; } #view-spreadscore .ss-table td:nth-child(8){ order:8; }
  #view-spreadscore .ss-table td:nth-child(3)::before{ content:'vs '; } #view-spreadscore .ss-table td:nth-child(4)::before{ content:'Vegas '; } #view-spreadscore .ss-table td:nth-child(6)::before{ content:'Range '; } #view-spreadscore .ss-table td:nth-child(7)::before{ content:'Market '; } #view-spreadscore .ss-table td:nth-child(8)::before{ content:'Model '; }
  #view-spreadscore .ss-table td:nth-child(9){ order:9; flex:1 1 100%; padding-top:4px !important; } #view-spreadscore .ss-whys{ min-width:0; }
  /* bottom tab bar */
  #appbar{ display:flex; position:fixed; left:0; right:0; bottom:0; z-index:60; height:calc(var(--ab-h) + var(--ab-safe)); padding:0 4px var(--ab-safe);
    background:rgba(10,13,18,.96); -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px); border-top:1px solid var(--border, rgba(255,255,255,.12)); }
  #appbar button{ flex:1 1 0; min-width:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px; background:none; border:0; color:var(--text-muted, #97a3b2); font:inherit; padding:6px 0 4px; cursor:pointer; position:relative; }
  #appbar .ab-ic{ width:26px; height:26px; display:flex; align-items:center; justify-content:center; } #appbar .ab-ic svg{ width:24px; height:24px; } #appbar .ab-ic img{ width:24px; height:24px; object-fit:contain; opacity:.7; filter:grayscale(.4); }
  #appbar .ab-nhl{ filter:drop-shadow(0 0 1px rgba(255,255,255,.9)) grayscale(.4) !important; }
  #appbar .ab-l{ font-size:.66rem; font-weight:700; letter-spacing:.02em; }
  #appbar button.on{ color:var(--accent, var(--accent)); } #appbar button.on .ab-ic img{ opacity:1; filter:none; } #appbar button.on .ab-nhl{ filter:drop-shadow(0 0 1px rgba(255,255,255,.9)) !important; }
  #appbar button.on::before{ content:''; position:absolute; top:0; left:26%; right:26%; height:3px; border-radius:0 0 3px 3px; background:var(--accent, var(--accent)); }
  #appbar button:active{ background:rgba(255,255,255,.06); }
  /* live scores ride right above the bar */
  .score-ticker{ bottom:calc(var(--ab-h) + var(--ab-safe)) !important; height:32px !important; z-index:59 !important; border-top:1px solid var(--border, rgba(255,255,255,.12)); }
  .ticker-item, .ticker-sport{ height:32px !important; }
  .tour-wrap{ bottom:calc(var(--ab-h) + var(--ab-safe) + 40px) !important; }
  /* More sheet */
  #appsheet{ display:block; position:fixed; inset:0; z-index:80; visibility:hidden; pointer-events:none; }
  #appsheet.show{ visibility:visible; pointer-events:auto; }
  #appsheet .as-back{ position:absolute; inset:0; background:rgba(0,0,0,.55); opacity:0; transition:opacity .2s; } #appsheet.show .as-back{ opacity:1; }
  #appsheet .as-card{ position:absolute; left:0; right:0; bottom:0; max-height:82vh; overflow:auto; border-radius:20px 20px 0 0; background:var(--surface, #12161d); border-top:1px solid var(--border, rgba(255,255,255,.14));
    padding:8px 12px calc(14px + var(--ab-h) + var(--ab-safe)); transform:translateY(102%); transition:transform .24s ease; }
  #appsheet.show .as-card{ transform:none; }
  .as-grab{ width:40px; height:4px; border-radius:4px; background:rgba(255,255,255,.25); margin:4px auto 10px; }
  .as-row{ width:100%; display:flex; align-items:center; gap:14px; text-align:left; background:none; border:0; border-bottom:1px solid var(--border, rgba(255,255,255,.08)); color:inherit; font:inherit; padding:14px 6px; min-height:60px; }
  .as-row:last-child{ border-bottom:0; } .as-row:active{ background:rgba(255,255,255,.05); }
  .as-e{ font-size:1.35rem; width:34px; text-align:center; } .as-t{ flex:1; display:flex; flex-direction:column; } .as-t b{ font-size:1rem; } .as-t small{ color:var(--text-muted, #97a3b2); font-size:.8rem; margin-top:1px; }
  .as-go{ color:var(--text-muted, #97a3b2); font-size:1.4rem; }
  body.as-open{ overflow:hidden; }
  /* readable, tappable content */
  .panel{ padding:14px !important; border-radius:16px !important; margin-bottom:12px !important; }
  h2{ font-size:1.15rem !important; } h3{ font-size:1.02rem !important; }
  .hint{ font-size:.84rem !important; line-height:1.45 !important; }
  .btn, button.btn{ min-height:46px; font-size:.95rem; border-radius:12px; }
  .btn-row{ display:flex; flex-wrap:wrap; gap:8px; } .btn-row .btn{ flex:1 1 calc(50% - 8px); }
  .cat-filters, .toggle-group{ gap:6px !important; } .cat-filters button, .toggle-group button, .nsim-chip, .ss-chip{ min-height:42px !important; padding:8px 14px !important; font-size:.9rem !important; }
  nav.subtabs:not(.sport-cats) button{ padding:12px 14px !important; font-size:.92rem !important; }
  nav.subtabs.sport-cats button, nav.sport-cats-sims button{ padding:11px 16px !important; font-size:.95rem !important; }
  table td, table th{ font-size:.84rem; } .table-wrap{ border-radius:12px; }
  .feature-grid{ grid-template-columns:1fr !important; } .feature-card{ padding:14px !important; }
  .home-hero{ padding:20px 16px !important; border-radius:18px !important; }
  /* full-screen sheets (player profiles, sim shows) clear the home indicator */
  .modal-close{ top:calc(8px + env(safe-area-inset-top, 0px)); }
  .nfs-card{ padding-bottom:calc(10px + var(--ab-safe)); }
}
/* ---- Owner-only tabs: Members and Web Analytics ---- */
body.consumer-mode #tab-analytics, body.consumer-mode #view-analytics, body.consumer-mode #tab-members, body.consumer-mode #view-members{ display:none !important; }
nav.tabs button.owner-tab{ border:1px dashed color-mix(in srgb, var(--accent) 55%, transparent); border-radius:10px; }
nav.tabs button.owner-tab.active, nav.tabs button.owner-tab[aria-selected="true"]{ color:var(--accent); background:color-mix(in srgb, var(--accent) 12%, transparent); }
/* ---- Web Analytics page ---- */
.wa-top{ display:flex; flex-wrap:wrap; align-items:center; gap:12px; margin:6px 0 14px; } .wa-live{ margin-left:auto; display:flex; align-items:center; gap:8px; font-size:.92rem; } .wa-live b{ font-family:'Oswald',sans-serif; font-size:1.2rem; color:var(--accent); }
.wa-dot{ width:10px; height:10px; border-radius:50%; background:#22d65a; box-shadow:0 0 0 0 rgba(34,214,90,.6); animation:waPulse 1.8s infinite; } @keyframes waPulse{ 70%{ box-shadow:0 0 0 9px rgba(34,214,90,0); } 100%{ box-shadow:0 0 0 0 rgba(34,214,90,0); } }
.wa-tiles{ display:grid; grid-template-columns:repeat(auto-fill, minmax(210px, 1fr)); gap:10px; margin-bottom:16px; }
.wa-tile{ border:1px solid var(--border); border-radius:14px; background:var(--surface-2); padding:12px 14px; display:flex; flex-direction:column; gap:2px; } .wa-tile small{ font-size:.64rem; letter-spacing:.08em; text-transform:uppercase; color:var(--text-muted); font-weight:700; } .wa-tile b{ font-family:'Oswald',sans-serif; font-size:1.8rem; line-height:1.1; } .wa-tile span{ font-size:.76rem; color:var(--text-muted); }
.wa-tile.big{ border-color:var(--accent); background:linear-gradient(130deg, color-mix(in srgb, var(--accent) 14%, var(--surface-2)), var(--surface-2) 70%); } .wa-tile.hot b{ color:var(--accent); }
.wa-grid{ display:grid; grid-template-columns:repeat(auto-fill, minmax(330px, 1fr)); gap:14px; } .wa-box{ border:1px solid var(--border); border-radius:16px; background:var(--surface-2); padding:14px 16px 16px; min-width:0; } .wa-box.wa-wide{ grid-column:1 / -1; } .wa-box.wa-eye{ border-color:color-mix(in srgb, var(--accent) 50%, var(--border)); }
.wa-box h3{ margin:0 0 10px; font-size:1rem; } .wa-box h3 small{ font-weight:500; color:var(--text-muted); font-size:.74rem; margin-left:6px; } .wa-box h4{ margin:14px 0 6px; font-size:.84rem; color:var(--text-muted); }
.wa-bars{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:7px; } .wa-bars li{ position:relative; display:grid; grid-template-columns:minmax(80px, 42%) 1fr auto; align-items:center; gap:8px; font-size:.86rem; } .wa-bars li i{ display:block; height:12px; border-radius:6px; background:linear-gradient(90deg, color-mix(in srgb, var(--accent) 45%, #000), var(--accent)); } .wa-bars .wa-l{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .wa-bars b{ font-family:'Oswald',sans-serif; } .wa-bars small{ grid-column:2 / -1; color:var(--text-muted); font-size:.7rem; margin-top:-5px; }
.wa-sp{ display:inline-block; padding:1px 6px; border-radius:6px; font-size:.62rem; font-weight:800; background:rgba(127,127,127,.25); margin-right:4px; } .wa-sp.nba{ background:#ff8a3d; color:#000; } .wa-sp.nfl{ background:#2ee66b; color:#000; } .wa-sp.nhl{ background:#4aa8ff; color:#000; }
.wa-chart{ width:100%; height:auto; display:block; } .wa-g{ stroke:var(--border); stroke-width:1; } .wa-t{ fill:var(--text-muted); font-size:10px; } .wa-pv{ fill:color-mix(in srgb, var(--accent) 55%, var(--surface-2)); } .wa-ss{ fill:var(--accent); }
.wa-leg{ display:flex; gap:16px; font-size:.8rem; color:var(--text-muted); margin-top:4px; } .wa-leg i{ display:inline-block; width:10px; height:10px; border-radius:3px; margin-right:5px; vertical-align:middle; } .wa-leg i.pv{ background:color-mix(in srgb, var(--accent) 55%, var(--surface-2)); } .wa-leg i.ss{ background:var(--accent); }
.wa-hours{ display:flex; align-items:flex-end; gap:3px; height:150px; } .wa-hours > div{ flex:1; height:100%; display:flex; flex-direction:column; justify-content:flex-end; align-items:center; gap:4px; } .wa-hours i{ display:block; width:100%; border-radius:3px 3px 0 0; background:var(--accent); } .wa-hours span{ font-size:.6rem; color:var(--text-muted); height:10px; }
.wa-fun{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:10px; } .wa-fun li{ display:grid; grid-template-columns:150px 1fr 56px 44px; align-items:center; gap:8px; font-size:.86rem; } .wa-fun i{ display:block; height:18px; border-radius:9px; background:linear-gradient(90deg, color-mix(in srgb, var(--accent) 45%, #000), var(--accent)); } .wa-fun b{ font-family:'Oswald',sans-serif; text-align:right; } .wa-fun small{ color:var(--text-muted); text-align:right; }
@media (max-width:640px){ .wa-grid{ grid-template-columns:1fr; } .wa-tiles{ grid-template-columns:repeat(2, 1fr); } .wa-fun li{ grid-template-columns:110px 1fr 44px 38px; } .wa-live{ margin-left:0; width:100%; } }
/* ---- Smooth long tables (snippet-smooth.js) ---- */
.sm-more{ display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:10px; padding:14px 0 6px; }
.sm-more .hint{ margin:0; }
tr[hidden]{ display:none !important; }
/* page changes feel instant: the existing fade is 0.3 s, shorten it */
.view.active{ animation-duration:.14s; }
@media (prefers-reduced-motion:reduce){ .view.active{ animation:none; } }
/* ---- Click any player name (snippet-playerlinks.js) ---- */
.pl-hint{ cursor:pointer; text-decoration:underline dotted; text-underline-offset:3px; text-decoration-thickness:1.5px; }
.pl-hint:hover{ color:var(--accent); }
.pm-tab-locked{ opacity:.75; }

.tdr-name b, .tdr-id b, .rkc-name{ cursor:pointer; } .tdr-name b:hover, .tdr-id b:hover{ color:var(--accent); text-decoration:underline dotted; text-underline-offset:3px; }
/* ---- Save chart as image (snippet-chartexport.js) ---- */
.cx-bar{ display:flex; justify-content:flex-end; margin:2px 0 8px; }
.cx-btn{ font:700 .72rem 'Oswald',sans-serif; letter-spacing:.05em; text-transform:uppercase; padding:5px 11px; border-radius:999px; border:1px solid var(--border); background:var(--surface-2); color:var(--text-muted); cursor:pointer; }
.cx-btn:hover{ color:var(--accent); border-color:var(--accent); }
.cx-btn:disabled{ opacity:.7; cursor:default; }
/* ---- Screenshot cards (snippet-shot.js) ---- */
.shot-host{ position:relative; }
.shot-btn{ position:absolute; top:10px; right:10px; z-index:6; width:36px; height:36px; padding:0; border-radius:50%; border:1px solid var(--border); background:color-mix(in srgb, var(--surface-2) 90%, transparent); color:var(--text); font-size:1rem; line-height:1; cursor:pointer; opacity:.78; display:flex; align-items:center; justify-content:center; }
.shot-btn:hover{ opacity:1; border-color:var(--accent); } .shot-btn:disabled{ cursor:default; }
.shot-brand{ display:none; }
.shot-mode .shot-brand{ display:flex; align-items:center; gap:14px; padding:14px 20px; background:#05080b; color:#fff; }
.shot-mode .shot-top{ border-bottom:3px solid #22e65a; margin:-1px -1px 14px; } .shot-mode .shot-top img{ height:54px; width:auto; } .shot-mode .shot-top span{ margin-left:auto; font:800 1.5rem 'Oswald',sans-serif; letter-spacing:.02em; text-transform:uppercase; text-align:right; }
.shot-mode .shot-bot{ border-top:3px solid #22e65a; margin:14px -1px -1px; flex-wrap:wrap; gap:2px 14px; } .shot-mode .shot-bot b{ font:700 1.3rem 'Oswald',sans-serif; } .shot-mode .shot-bot span{ color:#9aa6b2; font-size:.8rem; } .shot-mode .shot-bot i{ margin-left:auto; font-style:normal; color:#9aa6b2; font-size:.8rem; }
.shot-mode .shot-btn, .shot-mode .cx-bar, .shot-mode .gdd-list, .shot-mode .dd-search, .shot-mode .pv-banner, .shot-mode .modal-close, .shot-mode .star-strip .star-head span{ display:none !important; }
.shot-mode *, .shot-mode *::before, .shot-mode *::after{ animation:none !important; transition:none !important; }

/* long panels are cropped to their top with a soft fade into the footer */
.shot-mode .shot-clip{ position:relative; overflow:hidden; }
.shot-mode .shot-clip::after{ content:''; position:absolute; left:0; right:0; bottom:0; height:36px; background:linear-gradient(0deg, var(--surface, #0D1117), transparent); pointer-events:none; }/* the picture shows content, not controls */
.shot-mode .nhl-dates, .shot-mode .nbp-games, .shot-mode .nsim-chips, .shot-mode .gdd, .shot-mode .cat-filters, .shot-mode .nhl-ctl, .shot-mode .fmt-toggle, .shot-mode .toggle-group, .shot-mode details.nbr-how, .shot-mode .subtabs, .shot-mode select{ display:none !important; }
.shot-mode .hint.pl-clamp{ display:block !important; -webkit-line-clamp:unset !important; overflow:visible !important; } .shot-mode .hint.pl-clamp::after{ content:none !important; }

.shot-mode .shot-bot{ justify-content:space-between; } .shot-mode .shot-bot b{ order:1; } .shot-mode .shot-bot i{ order:2; margin-left:0 !important; } .shot-mode .shot-bot span{ order:3; flex-basis:100%; }
.shot-mode .shot-target > .panel-head h2:first-child, .shot-mode .shot-target .panel-head > div > h2:first-child{ display:none; }

/* ---- profile card (1080 px wide at 2x): built off-screen from the open profile ---- */
.shot-prof{ position:fixed; left:0; top:0; width:540px; z-index:-1; pointer-events:none; background:#0a0d12; color:#fff; font-family:Inter, system-ui, sans-serif; overflow:hidden; }
.shot-prof .sp-top{ display:flex; align-items:center; justify-content:space-between; padding:14px 18px; background:#05080b; border-bottom:3px solid #22e65a; }
.shot-prof .sp-top img{ height:44px; width:auto; } .shot-prof .sp-top span{ font:800 1.05rem 'Oswald',sans-serif; letter-spacing:.08em; text-transform:uppercase; color:#22e65a; }
.shot-prof .pm-head{ margin:0 !important; border-radius:0 !important; padding:18px 18px 16px 150px !important; min-height:170px !important; }
.shot-prof .pm-head-photo{ left:18px !important; width:112px !important; }
.shot-prof .sp-body{ padding:14px 14px 4px; display:flex; flex-direction:column; gap:12px; }
.shot-prof .nlab-pickc, .shot-prof .nlab-box{ margin:0 !important; width:auto !important; }
.shot-prof .nlab-box{ padding:12px 12px 14px; } .shot-prof .nlab-box .nlab-h3{ font-size:1rem; }
.shot-prof .nlab-sum{ display:grid !important; grid-template-columns:repeat(5, 1fr) !important; gap:6px; } .shot-prof .nlab-sum > div{ grid-column:auto !important; padding:8px 4px !important; } .shot-prof .nlab-sum b{ font-size:1.05rem !important; }
.shot-prof .nlab-pk-n{ grid-template-columns:repeat(4, 1fr) !important; }
.shot-prof .sp-clip{ max-height:760px; overflow:hidden; }
.shot-prof .sp-foot{ display:flex; flex-wrap:wrap; justify-content:space-between; align-items:baseline; gap:2px 12px; padding:14px 18px 16px; margin-top:10px; background:#05080b; border-top:3px solid #22e65a; }
.shot-prof .sp-foot b{ font:700 1.25rem 'Oswald',sans-serif; } .shot-prof .sp-foot i{ font-style:normal; color:#9aa6b2; font-size:.8rem; } .shot-prof .sp-foot span{ flex-basis:100%; color:#9aa6b2; font-size:.8rem; }

.shot-prof .nph-svg{ width:100%; height:auto; max-height:330px; } .shot-prof .nlab-pickc{ padding:12px 14px; }

/* ---- Phone readability pass: stats and analytics you can read (and screenshot) on a phone ---- */
@media (max-width:640px){
  /* long intros take a screen of their own: two lines, the rest is in Help */
  .dd-intro > div:last-child{ display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
  .dd-search.big .dds-in{ font-size:1rem; }

  /* NFL Props Edge: the 13-column table becomes one card per player (rating + name on top, then labeled stat tiles) */
  #view-props .prop-table-wrap{ overflow:visible; }
  #view-props .prop-table, #view-props .prop-table tbody{ display:block; width:100%; min-width:0 !important; }
  #view-props .prop-table thead{ display:none; }
  #view-props .prop-table tr.data-row{ display:grid; grid-template-columns:repeat(4, minmax(0, 1fr)); gap:8px; padding:12px; margin:0 0 12px; border:1px solid var(--border); border-radius:16px; background:var(--surface-2); }
  #view-props .prop-table tr.data-row > td{ display:block; padding:0; border:0; min-width:0; text-align:left; background:transparent !important; }
  #view-props .prop-table tr.data-row > td:nth-child(1){ grid-column:1; grid-row:1 / span 2; align-self:center; }
  #view-props .prop-table tr.data-row > td:nth-child(3){ grid-column:2 / 5; grid-row:1; }
  #view-props .prop-table tr.data-row > td:nth-child(2){ grid-column:2; grid-row:2; align-self:center; }
  #view-props .prop-table tr.data-row > td:nth-child(11){ grid-column:3 / 5; grid-row:2; align-self:center; }
  #view-props .prop-table tr.data-row > td:nth-child(4){ grid-column:1 / 5; }
  #view-props .prop-table tr.data-row > td:nth-child(n+5):nth-child(-n+10), #view-props .prop-table tr.data-row > td:nth-child(12){ grid-column:span 2; padding:8px 10px; border-radius:12px; background:rgba(255,255,255,.055) !important; }
  #view-props .prop-table tr.data-row > td:nth-child(13){ grid-column:1 / 5; }
  #view-props .prop-table tr.data-row > td:nth-child(13) .btn{ width:100%; padding:10px 12px !important; font-size:.8rem !important; }
  #view-props .prop-table tr.data-row > td:nth-child(n+4):nth-child(-n+10)::before, #view-props .prop-table tr.data-row > td:nth-child(12)::before{ display:block; margin-bottom:3px; font:700 .62rem 'Oswald',sans-serif; letter-spacing:.09em; text-transform:uppercase; color:var(--text-muted); }
  #view-props .prop-table tr.data-row > td:nth-child(4)::before{ content:'Market line'; } #view-props .prop-table tr.data-row > td:nth-child(5)::before{ content:'2026 avg'; }
  #view-props .prop-table tr.data-row > td:nth-child(6)::before{ content:'Matchup'; } #view-props .prop-table tr.data-row > td:nth-child(7)::before{ content:'Trend'; }
  #view-props .prop-table tr.data-row > td:nth-child(8)::before{ content:'Environment'; } #view-props .prop-table tr.data-row > td:nth-child(9)::before{ content:'Usage'; }
  #view-props .prop-table tr.data-row > td:nth-child(10)::before{ content:'Score'; } #view-props .prop-table tr.data-row > td:nth-child(12)::before{ content:'Value'; }
  #view-props .prop-table tr.data-row > td:nth-child(4) > *{ white-space:normal; }
  #view-props .prop-table tr.chart-row{ display:block; margin:-4px 0 12px; } #view-props .prop-table tr.chart-row > td{ display:block; }
  #view-props .prop-table .rating-ring{ transform:scale(1.15); transform-origin:left center; }

  /* every other wide table: scrolls sideways and keeps the player name in view */
  .table-wrap{ -webkit-overflow-scrolling:touch; }
  .table-wrap table td:first-child, .table-wrap table th:first-child{ position:sticky; left:0; z-index:2; background:var(--surface, #12161d); }

  /* stat tiles and numbers: a notch bigger so a screenshot is readable at a glance */
  .stat-tile-value{ font-size:1.5rem; } .stat-tile-label{ font-size:.7rem; }
  .nlab-table td, .nlab-table th, .nbp-table td, .nbp-table th{ font-size:.86rem; }
}

@media (max-width:640px){
  /* quiet scrollbars on the sideways chip rows (they scroll by swipe), and a little air in the home hero */
  .nhl-dates, .cat-filters, .nbp-games, nav.subtabs, nav.tabs{ scrollbar-width:none; -ms-overflow-style:none; }
  .nhl-dates::-webkit-scrollbar, .cat-filters::-webkit-scrollbar, .nbp-games::-webkit-scrollbar, nav.subtabs::-webkit-scrollbar, nav.tabs::-webkit-scrollbar{ display:none; }
  .nbpr-detail{ display:none; }
  .home-hero-text > button, .home-hero-text > .hero-eyebrow, .home-hero-text > a{ margin-bottom:10px; }
  .home-hero-text h1{ margin-top:20px; }
}

@media (max-width:640px){
  /* Player Props cards: one calm surface (no black cells), derived combined markets show only line + projection */
  #view-nba-props tr.nbp-row > td{ background:transparent !important; }
  #view-nba-props tr.nbp-row > td:nth-child(3), #view-nba-props tr.nbp-row > td:nth-child(4), #view-nba-props tr.nbp-row > td:nth-child(5), #view-nba-props tr.nbp-row > td:nth-child(6){ background:rgba(255,255,255,.055) !important; padding:8px 2px !important; }
  #view-nba-props tr.nbp-row{ padding:12px 10px; gap:8px; margin-bottom:10px; border-radius:14px; }
  #view-nba-props tr.nbp-row.derived > td:nth-child(4), #view-nba-props tr.nbp-row.derived > td:nth-child(5){ display:none !important; }
  #view-nba-props tr.nbp-row.derived > td:nth-child(3), #view-nba-props tr.nbp-row.derived > td:nth-child(6){ grid-column:span 2; }
  #view-nba-props tr.nbp-row > td.noev{ visibility:hidden; }
  #view-nba-props .nbp-who{ min-width:0; }
}
@media (max-width:640px){ #view-nba-props tr.nbp-row.derived > td:nth-child(3)::before{ content:'Line (sum of parts)' !important; } }

@media (max-width:640px){
  /* the home hero keeps one pill and four buttons (the promos have their own cards further down) */
  .home-hero-text .hero-eyebrow.promo, .home-hero-text .giveaway-pill{ display:none !important; }
  .home-hero-text .btn-row .btn.secondary:nth-child(2){ display:none; }
  .home-hero-text .btn-row{ gap:10px; }
  .home-hero-text .btn-row .btn{ min-height:52px; }
  .home-hero-text .btn-row .btn.accent:first-child, .home-hero-text .btn-row .btn.gold-cta{ grid-column:1 / -1; }
}

.shot-host > .panel-head{ padding-right:50px; }
@media (max-width:640px){
  .hint.pl-clamp{ display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; cursor:pointer; position:relative; }
  .hint.pl-clamp::after{ content:'more ▾'; position:absolute; right:0; bottom:0; padding-left:28px; background:linear-gradient(90deg, transparent, var(--surface, #0D1117) 40%); color:var(--accent); font-weight:700; font-size:.8rem; }
  .hint.pl-clamp.open{ display:block; -webkit-line-clamp:unset; overflow:visible; } .hint.pl-clamp.open::after{ content:none; }
}

/* ---- phones: Touchdown Research rows get a clean two-tier card (player + score on top, numbers below) ---- */
@media (max-width:640px){
  .tdr-head{ grid-template-columns:30px minmax(0,1fr) 70px 20px !important; grid-template-areas:'rk pl rate chev' 'mini mini mini mini' 'prob prob prob prob' !important; gap:10px 8px !important; padding:12px !important; align-items:center; }
  .tdr-pl{ min-width:0; } .tdr-name{ flex-wrap:wrap; gap:4px 6px; } .tdr-name b{ font-size:1.02rem; line-height:1.2; }
  .tdr-pl .rkc-chips{ flex-wrap:wrap; gap:5px; margin-top:6px; }
  .tdr-mini{ display:grid !important; grid-template-columns:repeat(3, 1fr); gap:8px; padding:10px; border-radius:12px; background:rgba(255,255,255,.05); }
  .tdr-mini > div{ display:flex; flex-direction:column; align-items:center; gap:2px; min-width:0; text-align:center; } .tdr-mini label{ font-size:.62rem; letter-spacing:.06em; text-transform:uppercase; color:var(--text-muted); white-space:normal; line-height:1.15; } .tdr-mini b{ font-size:1.15rem; }
  .tdr-prob{ flex-direction:row !important; flex-wrap:wrap; align-items:baseline !important; justify-content:space-between; gap:2px 12px; text-align:left !important; padding-top:2px; border-top:1px solid var(--border); padding:10px 2px 0; }
  .tdr-prob b{ font-size:1.5rem !important; } .tdr-prob span{ order:2; margin-right:auto; } .tdr-prob em{ order:3; flex-basis:100%; white-space:normal; font-size:.76rem !important; }
  .tdr-gauge{ --s:52px; }
  /* Rankings / Tier cards and other multi-number rows: let numbers wrap instead of overlapping */
  .nba-mseg{ min-width:0; overflow-wrap:anywhere; } .nba-mseg b{ display:block; }
  #view-floorceiling .fc-card b, #view-floorceiling [class*="card"] > b{ white-space:normal; }
  .shot-btn{ top:8px; right:8px; width:32px; height:32px; font-size:.9rem; }
  .panel-head{ padding-right:44px; }
}

/* ---- phone: header never changes height or wraps (no jump when sign-in state arrives) and the hero reserves its note ---- */
@media (max-width:640px){
  .topbar-right{ flex-wrap:nowrap !important; gap:6px; flex:0 0 auto; }
  .topbar-right .owner-badge, #header-signout-btn{ display:none !important; }
  .topbar{ min-height:73px; }
  .home-hero-text .home-trial-note{ min-height:4.6em; }
}

/* reserve the space these fill in once the account state is known, so nothing below them moves */
@media (max-width:640px){
  .topbar-right .trial-pill{ min-height:42px; min-width:62px; display:inline-flex; align-items:center; justify-content:center; box-sizing:border-box; }
  .home-hero-text .home-trial-note{ min-height:56px; }
  .home-hero-text .btn-row .btn.accent:first-child{ min-height:90px; }
}
@media (max-width:640px){ #home-trial-note{ min-height:56px; display:block; } #home-cta{ min-height:90px; } .home-hero-text .btn-row{ min-height:204px; } }
/* ---- Phone: player profile + Deep Dive as clean, full-screen sheets ---- */
.nph-dash i{ display:inline-block; width:18px; border-top:2px dashed #ffc400; vertical-align:middle; margin-right:6px; }
.nph-val{ paint-order:stroke; stroke:var(--surface-2, #0D1117); stroke-width:3.5px; stroke-linejoin:round; }
.nlab-morelines{ display:none; }
@media (max-width:760px){
  /* the profile fills the screen (no side strips), its tab bar stays pinned while you scroll */
  #pl-modal.modal-backdrop{ padding:0; background:var(--surface, #000); align-items:stretch; }
  #pl-modal #pl-panel{ max-width:none !important; width:100%; min-height:100%; margin:0; border:0; border-radius:0; box-shadow:none; padding:0 14px calc(var(--ab-h, 58px) + 36px); }
  #pl-modal .pm-head{ margin:0 -14px; border-radius:0; padding:calc(env(safe-area-inset-top, 0px) + 16px) 14px 14px 112px; min-height:150px; }
  #pl-modal .pm-head-photo{ left:14px; width:84px; }
  #pl-modal .pm-head h2{ font-size:1.35rem; margin-bottom:6px; } #pl-modal .pm-head-bio{ gap:14px; margin-bottom:4px; }
  #pl-modal .pm-tabbar{ margin:0 -14px 14px; padding:0 8px; position:sticky; top:0; z-index:6; }
  #pl-modal .modal-close{ top:calc(env(safe-area-inset-top, 0px) + 12px); right:12px; width:36px; height:36px; font-size:1.1rem; }

  /* Deep Dive: header, one-row market chips, a compact control block */
  .nlab-card-w{ padding:14px 12px calc(var(--ab-h, 58px) + 30px); }
  .nlab-head{ padding-right:0; gap:8px; margin-bottom:8px; }
  .nlab-next{ flex-direction:row; align-items:baseline; justify-content:flex-start; gap:6px 10px; flex-wrap:wrap; width:100%; padding:8px 12px; border-radius:12px; }
  .nlab-next small::after{ content:':'; } .nlab-next b{ font-size:1.05rem; } .nlab-next span{ font-size:.82rem; }
  .nlab-bar, .nlab-modal .nlab-bar{ position:static; border:0; padding:0 0 6px; margin:0; gap:10px; }
  .nlab-chips{ flex-wrap:nowrap; overflow-x:auto; margin:0 -12px; padding:2px 12px 6px; -webkit-overflow-scrolling:touch; scrollbar-width:none; scroll-snap-type:x proximity; }
  .nlab-chips::-webkit-scrollbar{ display:none; }
  .nlab-chips .nph-chip{ flex:0 0 auto; scroll-snap-align:start; min-height:42px; padding:6px 13px; font-size:.88rem; white-space:nowrap; }
  .nlab-tools{ display:grid; grid-template-columns:1fr 1fr; gap:10px; align-items:stretch; margin:0; }
  .nlab-tools .toggle-group{ display:flex; grid-column:1; } .nlab-tools .toggle-group button{ flex:1; min-height:46px; }
  .nlab-step{ order:0; grid-column:2; display:flex; width:100%; } .nlab-step button{ flex:0 0 46px; height:46px; } .nlab-step input{ flex:1; min-width:0; width:auto; height:46px; font-size:1.05rem; }
  .nlab-tools label.nbh-lab{ display:flex; flex-direction:column; gap:4px; margin:0; font-size:.66rem; font-weight:700; letter-spacing:.07em; text-transform:uppercase; color:var(--text-muted); }
  .nlab-tools label.nbh-lab select{ width:100%; min-height:46px; font-size:.95rem; text-transform:none; letter-spacing:0; color:var(--text); }

  /* one calm column, in reading order: chart, our pick, matchup, splits, lines, rating */
  .nlab-grid{ display:flex; flex-direction:column; gap:12px; margin-top:10px; }
  .nlab-main, .nlab-side{ display:contents; }
  .nlab-grid .sec-chart{ order:1; } .nlab-grid .nlab-pickc{ order:2; } .nlab-grid .sec-game{ order:3; } .nlab-grid .sec-match{ order:4; } .nlab-grid .sec-rate{ order:5; }
  .nlab-grid .sec-splits{ order:6; } .nlab-grid .sec-adv{ order:7; } .nlab-grid .sec-lines{ order:8; } .nlab-grid .sec-lineup{ order:9; }
  .nlab-box{ padding:14px 12px 16px; border-radius:16px; }
  .nlab-box .nlab-h3{ font-size:1.02rem; margin:0 0 10px; } .nlab-h3 small{ display:block; margin:2px 0 0; font-size:.78rem; }
  .nlab-page .nph-svg{ margin:0 -2px; }
  .nph-legend{ display:flex; flex-wrap:wrap; gap:6px 16px; font-size:.8rem; margin-top:4px; }

  /* the numbers under the chart: one big hit-rate tile, then a tidy 2 x 2 */
  .nlab-sum{ display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-top:12px; }
  .nlab-sum > div{ min-width:0; padding:10px 8px; border:0; border-radius:12px; background:rgba(255,255,255,.055); display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2px; }
  .nlab-sum > div:first-child{ grid-column:1 / -1; } .nlab-sum b{ font-size:1.3rem; line-height:1.15; }
  .nlab-pk-n > div{ background:rgba(255,255,255,.055); border:0; padding:9px 6px; }
  .nlab-pickc{ padding:14px 12px; }
  .nlab-mus{ grid-template-columns:repeat(3, minmax(0, 1fr)); gap:6px; }
  .nlab-mu{ padding:8px 4px; } .nlab-mu b{ font-size:1.05rem; } .nlab-mu i{ font-size:.68rem; }

  /* tables: no sideways scrolling, only the columns that matter */
  .nlab-box .table-wrap{ overflow:visible; margin:0 -4px; }
  .nlab-split, .nlab-lines, .nlab-box table.nbp-table{ min-width:0 !important; width:100%; table-layout:auto; }
  .nlab-split th, .nlab-split td, .nlab-lines th, .nlab-lines td, .nlab-box table.nbp-table th, .nlab-box table.nbp-table td{ padding:9px 6px; font-size:.86rem; white-space:normal; }
  .nlab-split th:nth-child(n+5), .nlab-split td:nth-child(n+5){ display:none; }
  .nlab-split td:first-child{ width:46%; line-height:1.25; }
  .nlab-lines th:nth-child(n+5), .nlab-lines td:nth-child(n+5){ display:none; }
  .nlab-lines td small, .nlab-box table.nbp-table td small{ display:block; font-size:.68rem; color:var(--text-muted); font-weight:500; }
  .nlab-lines:not(.all) tr.far{ display:none; }
  .nlab-pill{ padding:3px 8px; font-size:.82rem; } .nlab-pill i{ font-size:.72rem; }
  .nlab-morelines{ display:block; width:100%; margin-top:10px; }
  .nlab-part{ grid-template-columns:92px 1fr 42px; }
  .nlab-act{ flex-direction:column; } .nlab-act .btn{ width:100%; }
  .nhl-fine{ font-size:.74rem; line-height:1.5; margin-top:14px; }
  .nlab-pickc{ align-self:stretch; width:100%; }
  .nlab-page.profile .nlab-chips{ margin:0 -14px; padding:2px 14px 6px; }
  /* one calm surface inside the cards (no black cells, no pinned first column) */
  .nlab-box .table-wrap table td:first-child, .nlab-box .table-wrap table th:first-child{ position:static; background:transparent; }
  .nlab-box table th, .nlab-box table td{ background:transparent; border-color:var(--border); }
  .nlab-box table thead th{ position:static !important; border-bottom:1px solid var(--border); font-size:.74rem; }
  .nlab-box table .nlab-grp td{ background:rgba(255,255,255,.055) !important; }
  .nlab-box table tr.nlab-cur td, .nlab-box .table-wrap table tr.nlab-cur td:first-child{ background:color-mix(in srgb, var(--accent) 14%, transparent); }
}
#pl-panel > .shot-btn{ right:56px; top:12px; }
/* ---- Profile / Deep Dive windows: easy to leave, fit the screen (snippet-profilenav.js) ---- */
img.nba-hs, img.rkc-hs, img.tb-headshot{ cursor:pointer; }
#pl-panel img, .nlab-modal img{ cursor:auto; }
@media (max-width:760px){
  /* a big close button that stays on screen while you scroll */
  #pl-modal .modal-close, .nlab-modal .nlab-x{
    position:fixed !important; top:calc(env(safe-area-inset-top, 0px) + 10px) !important; right:12px !important; z-index:400;
    width:46px !important; height:46px !important; border-radius:50% !important; display:flex !important; align-items:center; justify-content:center;
    background:rgba(0,0,0,.72) !important; color:#fff !important; border:1px solid rgba(255,255,255,.35) !important; font-size:1.25rem !important; line-height:1;
    -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px); box-shadow:0 4px 16px rgba(0,0,0,.5);
  }
  #pl-modal:not(.show) .modal-close, .nlab-modal:not(.show) .nlab-x{ display:none !important; }
  /* nothing hides under the button or the notch */
  #pl-modal .pm-tabbar{ padding-right:64px !important; top:0; }
  #pl-modal .pm-head{ padding-right:64px; }
  #pl-modal .pm-head h2{ overflow-wrap:anywhere; }
  .nlab-modal .nlab-card-w{ padding-top:calc(env(safe-area-inset-top, 0px) + 62px) !important; }
  .nlab-modal .nlab-head{ padding-right:0; }
  /* the profile sheet always fills the screen exactly: no side scroll, long names wrap */
  #pl-modal, .nlab-modal{ overscroll-behavior:contain; overflow-x:hidden; -webkit-overflow-scrolling:touch; }
  #pl-modal #pl-panel{ overflow-x:hidden; }
  #pl-modal .pm-head-photo{ width:84px; }
  #pl-modal .pm-head-meta{ gap:6px; } #pl-modal .pm-head-bio{ gap:10px 14px; }
  #pl-modal .pm-tiles{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
  #pl-modal table{ font-size:.86rem; }
  #pl-modal .table-wrap{ overflow-x:auto; -webkit-overflow-scrolling:touch; }
  /* leave room for the bottom app bar so the last section can be scrolled fully into view */
  #pl-modal #pl-panel, .nlab-modal .nlab-card-w{ padding-bottom:calc(var(--ab-h, 58px) + env(safe-area-inset-bottom, 0px) + 40px) !important; }
}
/* the camera button sits beside the close button */
@media (max-width:760px){ #pl-panel > .shot-btn{ position:absolute; right:70px !important; top:calc(env(safe-area-inset-top, 0px) + 12px) !important; } }

/* Advanced stats inside the NFL Deep Dive tab */
.pm-adv-embed{ margin-top:18px; padding:14px 16px 16px; border:1px solid var(--border); border-radius:16px; background:var(--surface-2); }
.pm-adv-embed .pm-section-head, .pm-adv-embed > h3{ margin-top:0; }
@media (max-width:760px){ .pm-adv-embed{ padding:12px 10px 14px; } .pm-adv-embed .pm-tiles{ grid-template-columns:repeat(2, minmax(0, 1fr)); } }
/* ---------- display ads: one quiet, clearly labeled unit at the end of a page (snippet-ads.js) ---------- */
.ad-slot{ display:block; margin:22px auto 6px; max-width:970px; text-align:center; }
.ad-slot[hidden]{ display:none; }
.ad-slot small{ display:block; margin-bottom:6px; font-size:.64rem; letter-spacing:.12em; text-transform:uppercase; color:var(--text-muted); opacity:.75; }
.ad-slot ins.adsbygoogle{ min-height:90px; border-radius:12px; overflow:hidden; background:transparent; }
.ad-slot ins.adsbygoogle[data-ad-status="unfilled"]{ display:none !important; }
@media (max-width:640px){ .ad-slot{ margin:18px 0 4px; } .ad-slot ins.adsbygoogle{ min-height:100px; } }
@media print{ .ad-slot{ display:none !important; } }
/* ---------- top tabs: one row that fits the window (sizes scale with the screen width; wraps to two tidy rows only on small laptops/tablets) ---------- */
@media (min-width:901px){
  header.topbar nav.tabs{ flex-wrap:nowrap; overflow:visible; gap:0; justify-content:center; min-width:0; }
  header.topbar nav.tabs button{ flex:0 1 auto; white-space:nowrap; padding:9px clamp(5px, .8vw, 13px); font-size:clamp(.7rem, .95vw, .9rem); }
  header.topbar nav.tabs button.sport-tab{ gap:clamp(4px, .45vw, 7px); margin:0 1px; }
  header.topbar nav.tabs button.sport-tab img, header.topbar nav.tabs button.sport-tab .sport-logo{ width:clamp(15px, 1.4vw, 22px); height:clamp(15px, 1.4vw, 22px); }
  header.topbar nav.tabs .trial-badge, header.topbar nav.tabs button .pill, header.topbar nav.tabs button .badge{ font-size:clamp(.5rem, .6vw, .62rem); padding:2px clamp(4px, .5vw, 8px); }
}
@media (min-width:901px) and (max-width:1139px){
  header.topbar nav.tabs button{ padding:8px 4px; font-size:.66rem; } header.topbar nav.tabs button.sport-tab{ gap:3px; margin:0; } header.topbar nav.tabs button.sport-tab img, header.topbar nav.tabs button.sport-tab .sport-logo{ width:14px; height:14px; }
  header.topbar nav.tabs .trial-badge, header.topbar nav.tabs button .pill, header.topbar nav.tabs button .badge{ font-size:.46rem; padding:1px 4px; }
  header.topbar nav.tabs{ flex-wrap:wrap; row-gap:2px; }
}
/* tablets: the main tabs wrap into two tidy rows instead of scrolling off the side */
@media (min-width:641px) and (max-width:900px){
  header.topbar nav.tabs{ flex-wrap:wrap; overflow:visible; justify-content:center; row-gap:2px; }
  header.topbar nav.tabs button{ flex:0 1 auto; white-space:nowrap; padding:8px 8px; font-size:.78rem; }
  header.topbar nav.tabs button.sport-tab img, header.topbar nav.tabs button.sport-tab .sport-logo{ width:16px; height:16px; }
}
/* phones: the section rows under the header are smaller so more of each row is on screen at once */
@media (max-width:640px){
  nav.subtabs:not(.sport-cats) button{ padding:11px 9px !important; font-size:.78rem !important; }
  nav.subtabs.sport-cats button, nav.sport-cats-sims button{ padding:8px 11px !important; font-size:.8rem !important; }
  nav.subtabs{ gap:0 !important; }
}
/* ---------- compact header on tablets and laptops (641-1599px): a small logo + search + account on one line, the tabs in one slim row under it ---------- */
@media (min-width:641px) and (max-width:1599px){
  header.topbar{ display:grid !important; grid-template-columns:auto minmax(0, 1fr) auto; grid-template-areas:"brand search right" "tabs tabs tabs"; align-items:center; gap:4px 16px; padding:8px 18px 6px !important; }
  header.topbar .brand{ grid-area:brand; } header.topbar .brand .brand-logo{ height:50px !important; }
  header.topbar .site-search{ grid-area:search; justify-self:center; width:100%; max-width:340px; flex:none; order:0; }
  header.topbar .topbar-right{ grid-area:right; }
  header.topbar nav.tabs{ grid-area:tabs; width:100%; flex:none; order:0; justify-content:center; }
}
/* below 1280px the secondary tabs (Settings, Customize, Blog, Help, About, Discord) move into a "More" menu so the main tabs stay one slim row */
#tab-more{ display:none; position:relative; }
@media (min-width:641px) and (max-width:1279px){
  header.topbar nav.tabs #tab-settings, header.topbar nav.tabs #tab-customize, header.topbar nav.tabs #tab-members, header.topbar nav.tabs #tab-analytics, header.topbar nav.tabs #tab-blog, header.topbar nav.tabs #tab-help, header.topbar nav.tabs #tab-about, header.topbar nav.tabs #tab-discord{ display:none !important; }
  header.topbar nav.tabs #tab-more{ display:inline-flex; align-items:center; }
  header.topbar nav.tabs button{ padding:8px clamp(6px, 1vw, 12px); font-size:clamp(.74rem, 1.2vw, .86rem); }
}
.nav-more-menu{ position:fixed; z-index:300; min-width:200px; padding:6px; border:1px solid var(--border); border-radius:12px; background:var(--surface, #12161d); box-shadow:0 18px 50px -12px rgba(0,0,0,.75); display:none; }
.nav-more-menu.show{ display:block; }
.nav-more-menu button{ display:flex; align-items:center; gap:8px; width:100%; padding:10px 12px; border:0; border-radius:8px; background:none; color:var(--text); font:inherit; font-size:.9rem; font-weight:600; text-align:left; cursor:pointer; }
.nav-more-menu button:hover{ background:color-mix(in srgb, var(--accent) 14%, transparent); }
@media (min-width:641px) and (max-width:760px){
  header.topbar nav.tabs button{ padding:7px 5px !important; font-size:.7rem !important; } header.topbar nav.tabs button.sport-tab{ gap:3px !important; margin:0 !important; }
  header.topbar nav.tabs button.sport-tab img, header.topbar nav.tabs button.sport-tab .sport-logo{ width:14px !important; height:14px !important; }
  header.topbar nav.tabs #tab-membership > *:not(:first-child), header.topbar nav.tabs #tab-membership .trial-badge{ display:none !important; }
}
/* ---------- Surface Pro / tablet / laptop (641-1599px): every tab row is a notch smaller so the whole stack under the logo takes less of the screen ---------- */
@media (min-width:641px) and (max-width:1599px){
  header.topbar nav.tabs button{ padding:6px clamp(5px, .7vw, 11px); font-size:clamp(.68rem, .88vw, .82rem); }
  header.topbar nav.tabs button.sport-tab{ padding:5px clamp(5px, .7vw, 10px); }
  header.topbar nav.tabs button.sport-tab img, header.topbar nav.tabs button.sport-tab .sport-logo{ width:15px; height:15px; }
  header.topbar .brand .brand-logo{ height:44px !important; }
  header.topbar .site-search input{ padding:6px 14px; font-size:.78rem; }
  nav.subtabs.sport-cats{ padding-top:4px !important; padding-bottom:4px !important; }
  nav.subtabs.sport-cats button, nav.sport-cats-sims button{ font-size:.76rem !important; padding:4px 13px !important; }
  nav.subtabs:not(.sport-cats) button{ font-size:.8rem !important; padding:9px 11px !important; }
}
/* Self-hosted Oswald and Inter (variable fonts, Latin + Latin Extended): no third-party request, the files are preloaded, so text does not jump when the font arrives */
@font-face{ font-family:'Inter'; font-style:normal; font-weight:100 900; font-display:swap; src:url(/fonts/inter-latin-ext.woff2) format('woff2'); unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face{ font-family:'Inter'; font-style:normal; font-weight:100 900; font-display:swap; src:url(/fonts/inter-latin.woff2) format('woff2'); unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face{ font-family:'Oswald'; font-style:normal; font-weight:200 700; font-display:swap; src:url(/fonts/oswald-latin-ext.woff2) format('woff2'); unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face{ font-family:'Oswald'; font-style:normal; font-weight:200 700; font-display:swap; src:url(/fonts/oswald-latin.woff2) format('woff2'); unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
.spread-auth-wrap{ max-width:360px; margin-top:18px; }
.spread-auth-card{
  background:var(--surface-2); border:1px solid var(--border); border-radius:12px; padding:20px; text-align:left;
}
.spread-auth-card h3{ margin:0 0 14px; color:var(--text); }
.spread-google-btn{
  width:100%; background:#fff; color:#1f1f1f; border:1px solid var(--border);
  display:flex; align-items:center; justify-content:center; gap:8px;
}
.spread-auth-divider{ display:flex; align-items:center; gap:10px; margin:14px 0; color:var(--text-muted); font-size:0.8rem; }
.spread-auth-divider::before, .spread-auth-divider::after{ content:''; flex:1; height:1px; background:var(--border); }
.email-gate-form{ display:flex; flex-direction:column; gap:10px; }
.email-gate-form input{
  width:100%; padding:10px 12px; background:var(--surface); border:1px solid var(--border);
  border-radius:8px; color:var(--text); font-size:0.9rem;
}
.spread-auth-passrow{ position:relative; display:flex; }
.spread-auth-passrow input{ padding-right:64px; }
.spread-auth-show{ position:absolute; right:6px; top:50%; transform:translateY(-50%); background:none; border:none; color:var(--accent); font-size:0.78rem; font-weight:700; cursor:pointer; padding:8px; }
.spread-auth-link{ background:none; border:none; color:var(--accent); font-size:inherit; text-decoration:underline; cursor:pointer; padding:0 2px; font-family:inherit; }
.spread-auth-forgot{ align-self:flex-end; font-size:0.8rem; padding:2px; margin-top:-4px; }
#email-gate-error{ line-height:1.45; font-size:0.84rem; }
.spread-auth-toggle{
  display:block; width:100%; text-align:center; margin-top:12px; background:none; border:none;
  color:var(--accent); font-size:0.82rem; cursor:pointer; padding:4px;
}.brand-logo{ height:64px !important; }
.foot-brand img{ height:32px !important; opacity:1 !important; }
@media (max-width:640px){ .brand-logo{ height:48px !important; } }
.owner-badge{
  font-size:0.72rem; font-weight:700; letter-spacing:0.03em; text-transform:uppercase;
  color:#1a1200; background:linear-gradient(135deg,#ffe27a,#f2b705); border:1px solid rgba(0,0,0,0.15);
  padding:6px 12px; border-radius:14px; white-space:nowrap;
}body.stream-mode header.topbar, body.stream-mode nav.tabs, body.stream-mode .subtabs,
body.stream-mode footer.foot, body.stream-mode .panel-head, body.stream-mode #tb-edit-hint,
body.stream-mode .tb-add, body.stream-mode .disclosure, body.stream-mode #tb-out,
body.stream-mode #tb-readonly-note{ display:none !important; }
body.stream-mode main{ max-width:480px; margin:0 auto; padding:14px 10px 90px; overflow-x:hidden; }
body.stream-mode .panel{ padding:10px; border:none; box-shadow:none; }
body.stream-mode .tb-label{ width:64px; padding:4px 2px; }
body.stream-mode .tb-label-letter{ font-size:1.5rem; }
body.stream-mode .tb-label-text{ font-size:0.56rem; }
/* grid instead of flex-wrap so 2-3 chips sit per row (however many fit at ~125px each) instead of one
   full-width chip per row -- each chip still wraps its own contents onto a second internal line if its
   own narrower column isn't wide enough for name + team + projection + weather badge on one line */
body.stream-mode .tb-drop{ display:grid; grid-template-columns:repeat(auto-fill, minmax(125px, 1fr)); min-height:70px; padding:10px; gap:8px; }
body.stream-mode .tb-chip{
  font-size:0.74rem; padding:7px 8px; gap:5px; border-radius:10px;
  flex-wrap:wrap; row-gap:3px; box-sizing:border-box; width:100%;
}
body.stream-mode .tb-chip .tb-nm{ font-size:0.76rem; white-space:normal; }
body.stream-mode .tb-chip .tb-tm{ font-size:0.62rem; }
body.stream-mode .tb-chip .tb-pr{ font-size:0.64rem; padding:1px 4px; }
body.stream-mode .tb-pool h3{ font-size:1rem; text-align:center; }
body.stream-mode .tb-pool .tb-drop{ grid-template-columns:repeat(auto-fill, minmax(110px, 1fr)); }
/* the player card's stat tiles (season totals, game info, and the "Advanced stats" section with
   snap%/EPA/red zone/etc.) both use .modal-stat-grid/.pm-tiles as the grid and .stat-tile as each
   card -- shrink the columns and text so all of them stay readable without spilling sideways */
body.stream-mode .modal-stat-grid, body.stream-mode .pm-tiles{
  grid-template-columns:repeat(auto-fill, minmax(88px, 1fr)) !important; gap:6px !important; margin:10px 0 !important;
}
body.stream-mode .stat-tile{ padding:6px 5px !important; min-width:0 !important; }
body.stream-mode .stat-tile-value{ font-size:0.82rem !important; }
body.stream-mode .stat-tile-label{ font-size:0.52rem !important; margin-bottom:3px !important; }
body.stream-mode .pm-sub{ font-size:0.7rem !important; margin:12px 0 6px !important; }
body.stream-mode .pm-line{ font-size:0.62rem !important; }
/* the player-card popup is a fixed full-viewport overlay, so on a wide browser window it would
   otherwise center itself against the whole window instead of the narrow portrait column above --
   pin it to the same width and bump its text up a notch so it still reads on camera */
body.stream-mode .modal-backdrop{ padding:16px 10px; }
body.stream-mode .modal-panel{ max-width:460px; }
body.stream-mode .pm-head h2{ font-size:1.7rem; }
body.stream-mode .pm-head-bio b{ font-size:1.1rem; }
body.stream-mode .modal-stat-grid{ font-size:1.05rem; }
#stream-exit-btn{
  position:fixed; top:10px; right:10px; z-index:999; background:rgba(0,0,0,0.65); color:#fff;
  border:1px solid rgba(255,255,255,0.3); border-radius:20px; padding:8px 16px; font-size:0.8rem;
  cursor:pointer; backdrop-filter:blur(4px);
}