/* Site v2 (flags.site_v2, branch site-v2; Joseph 2026-10-31: "make all the pages similar visually to the Props page; the icons aren't the same").
   Every page but Props (which has its own sheet, nba-props-v2.css) gets the Props finish: its header, floating glass tab bar and background glow
   (the shell rules below are the Props sheet's, re-scoped from .pv2 to .sv2), and its look on the shared components: double-bezel cards
   (.shell > .core), ring game chips (.strip .game), rounded pills for button groups (.seg, .tabs). Content and layout stay as each page builds them.
   Linked after unslop.css, which flattens `body *` with !important, so rules sit under #home / #nav and repeat !important.
   Blur only on fixed or sticky layers. One easing (--sp). Transform and opacity are the only animated properties. */
.sv2{--bg:#07080a;--tx:#f2f4f7;--mu:#8b919b;--ac:#7fa8ff;--gr:#3ddc84;--rd:#ff6b6b;
  --hl:rgba(255,255,255,.1);--hl2:rgba(255,255,255,.06);--sp:cubic-bezier(.32,.72,0,1)}
.sv2 body{background:var(--bg)!important;color:var(--tx);letter-spacing:-.005em}
.sv2 body>svg{position:absolute;width:0;height:0}   /* the chart module's hatch defs: no line box above the header (as on Props) */
.sv2 #home .sv-mesh{position:fixed;inset:0;pointer-events:none;z-index:-1;
  background-image:radial-gradient(420px 320px at 85% -4%,rgba(127,168,255,.16),transparent 70%),radial-gradient(380px 300px at -10% 62%,rgba(61,220,132,.07),transparent 70%)!important}
@media (max-width:767px){.sv2 #home{padding-bottom:calc(104px + env(safe-area-inset-bottom,0px))!important}}   /* room under the floating tab bar */

/* ---------- compact header: SLATE@BOARD | season | history (phone: one row in the flow) ---------- */
.sv2 #nav .brand{font-size:14.5px!important;font-weight:700!important;letter-spacing:.06em!important;color:var(--tx)!important}
.sv2 #nav .brand i{color:var(--ac)!important;font-style:normal}
.sv2 #nav .rd3-season{height:auto!important;min-height:0!important;margin:0!important;padding:3px!important;gap:0!important;border:0!important;border-radius:999px!important;
  background:rgba(255,255,255,.04)!important;box-shadow:inset 0 0 0 1px var(--hl)!important}
.sv2 #nav .rd3-season button{flex:none!important;min-height:0!important;height:auto!important;padding:5px 10px!important;border:0!important;border-radius:999px!important;
  font-size:.75rem!important;line-height:1.25!important;color:var(--mu)!important;background:transparent!important;box-shadow:none!important}
.sv2 #nav .rd3-season button[aria-pressed="true"]{color:var(--tx)!important;font-weight:600!important;background:rgba(255,255,255,.1)!important;box-shadow:inset 0 1px 1px rgba(255,255,255,.12)!important}
.sv2 #nav .rd3-season .l{display:none!important}.sv2 #nav .rd3-season .s{display:inline!important}
.sv2 #nav .tb.nav-data{width:34px!important;height:34px!important;min-width:0!important;min-height:0!important;padding:0!important;gap:0!important;display:grid!important;place-items:center;
  border:0!important;border-radius:999px!important;color:#c9ced6!important;background:rgba(255,255,255,.03)!important;box-shadow:inset 0 0 0 1px var(--hl)!important}
.sv2 #nav .tb.nav-data svg{width:18px;height:18px}
.sv2 #nav .tb.nav-data span{display:none!important}
@media (max-width:767px){
  /* 30px under the status bar: iOS Safari blurs content in a band just below it, so the header row sits clear of that band at rest (Joseph, 2026-10-31) */
  .sv2 #nav{position:static!important;display:flex!important;align-items:center!important;flex-wrap:nowrap!important;gap:8px!important;width:auto!important;height:auto!important;
    margin:0!important;padding:calc(30px + var(--sat,0px)) 16px 6px!important;border:0!important;border-radius:0!important;overflow:visible!important;
    background:transparent!important;box-shadow:none!important}
  .sv2 #nav .brand{flex:1 1 auto!important;min-width:0;min-height:0!important;margin:0!important;white-space:nowrap}
  .sv2 #nav .nav-links,.sv2 #nav .tb.hide-s{display:none!important}
  .sv2 #nav .tools{display:flex!important;align-items:center;gap:8px!important;margin:0!important}
  .sv2 #nav .rd3-season{order:0!important;flex:none!important}
}
@media (min-width:768px){   /* the existing fixed desktop bar, in the same glass */
  .sv2 #nav{border-color:transparent!important;border-radius:999px!important;background:rgba(18,20,24,.62)!important;
    backdrop-filter:blur(24px) saturate(1.6)!important;-webkit-backdrop-filter:blur(24px) saturate(1.6)!important;
    box-shadow:inset 0 0 0 1px var(--hl),inset 0 1px 1px rgba(255,255,255,.1),0 18px 50px -12px rgba(0,0,0,.75)!important}
  .sv2 #nav .nav-links a[aria-current="page"]{background:rgba(255,255,255,.08)!important;box-shadow:inset 0 1px 1px rgba(255,255,255,.12)!important}
}

/* ---------- floating glass tab bar (phones) ---------- */
@media (max-width:767px){
  .sv2 .tabbar:not(#_){left:50%!important;right:auto!important;bottom:calc(14px + env(safe-area-inset-bottom,0px))!important;transform:translateX(-50%)!important;
    width:calc(100% - 28px)!important;max-width:380px!important;height:62px;padding:5px!important;gap:0;border:0!important;border-radius:999px!important;
    background:rgba(18,20,24,.62)!important;backdrop-filter:blur(24px) saturate(1.6)!important;-webkit-backdrop-filter:blur(24px) saturate(1.6)!important;
    box-shadow:inset 0 0 0 1px var(--hl),inset 0 1px 1px rgba(255,255,255,.1),0 18px 50px -12px rgba(0,0,0,.75)!important}
  .sv2 .tabbar:not(#_) a,.sv2 .tabbar:not(#_) button[data-search]{min-height:0!important;height:100%;padding:0!important;justify-content:center;gap:3px!important;border-radius:999px!important;
    font-size:.72rem!important;color:var(--mu)!important;background:transparent!important}
  .sv2 .tabbar:not(#_) a[aria-current]{color:var(--tx)!important;background:rgba(255,255,255,.08)!important;box-shadow:inset 0 1px 1px rgba(255,255,255,.12)!important}
  .sv2 .tabbar:not(#_) svg{width:22px!important;height:22px!important}
  .sv2 .tabbar:not(#_) button[data-search]{display:flex!important}   /* the site search stays one tap away: the header has no room for it on phones (audit_site.py checks it) */
}

/* ---------- double-bezel cards: an outer ring around a gradient core ---------- */
.sv2 #home .shell{padding:5px!important;border:0!important;border-radius:24px!important;background:rgba(255,255,255,.035)!important;
  box-shadow:inset 0 0 0 1px var(--hl),0 16px 48px -22px rgba(0,0,0,.8)!important}
.sv2 #home .shell>.core{border:0!important;border-radius:19px!important;background-color:transparent!important;
  background-image:linear-gradient(180deg,#0f1115,#0a0b0e)!important;box-shadow:inset 0 1px 1px rgba(255,255,255,.1)!important}

/* ---------- page titles and section heads in the Props scale ---------- */
.sv2 #home .hero h1,.sv2 #home .hc h1{font-size:28px!important;font-weight:600!important;letter-spacing:-.035em!important;line-height:1.15!important;color:var(--tx)!important}
.sv2 #home .card-head h2,.sv2 #home .sh h2,.sv2 #home .core>h2{font-weight:600!important;letter-spacing:-.02em!important;color:var(--tx)!important}

/* ---------- game chips: a ring around a core, the selected one in the accent ---------- */
.sv2 #home .strip .game{border:0!important;border-radius:18px!important;background:rgba(255,255,255,.035)!important;box-shadow:inset 0 0 0 1px var(--hl)!important;
  transition:transform .3s var(--sp)}
.sv2 #home .strip .game[aria-pressed="true"]{background:rgba(127,168,255,.08)!important;box-shadow:inset 0 0 0 1.5px var(--ac),0 6px 24px -8px rgba(127,168,255,.35)!important}
.sv2 #home .strip .game:active{transform:scale(.98)}

/* ---------- button groups and tabs: Props' pills (hairline, the active one filled) ---------- */
.sv2 #home .seg:not(.rd3-season),.sv2 #home .tabs{flex-wrap:nowrap!important;gap:6px!important;padding:2px 0 4px!important;border:0!important;
  overflow-x:auto;scrollbar-width:none;background:transparent!important;box-shadow:none!important}
.sv2 #home .seg:not(.rd3-season)::-webkit-scrollbar,.sv2 #home .tabs::-webkit-scrollbar{display:none}
.sv2 #home .seg:not(.rd3-season) button,.sv2 #home .tabs .tab{flex:none!important;width:auto!important;min-height:0!important;height:auto!important;margin:0!important;
  padding:6px 12px!important;border:0!important;border-radius:999px!important;font-size:.78rem!important;line-height:1.25!important;white-space:nowrap;
  color:var(--mu)!important;background:transparent!important;box-shadow:inset 0 0 0 1px var(--hl)!important;transition:transform .3s var(--sp)}
.sv2 #home .seg:not(.rd3-season) button::after,.sv2 #home .tabs .tab::after{display:none!important}   /* the old underline */
.sv2 #home .seg:not(.rd3-season) button[aria-pressed="true"],.sv2 #home .tabs .tab.on,.sv2 #home .tabs .tab[aria-selected="true"]{
  color:#07080a!important;font-weight:600!important;background:var(--tx)!important;box-shadow:0 4px 14px -4px rgba(255,255,255,.25)!important}
.sv2 #home .seg:not(.rd3-season) button:active,.sv2 #home .tabs .tab:active{transform:scale(.97)}
@media (hover:hover){.sv2 #home .seg:not(.rd3-season) button:not([aria-pressed="true"]):hover,.sv2 #home .tabs .tab:not(.on):hover{background:rgba(255,255,255,.06)!important}}

@media (prefers-reduced-motion:reduce){
  .sv2 #home .strip .game,.sv2 #home .seg button,.sv2 #home .tabs .tab{transition:none}
  .sv2 #home .strip .game:active,.sv2 #home .seg button:active,.sv2 #home .tabs .tab:active{transform:none}
}

/* ---------- page frame: titles land where Props' does (78px phone / 96px desktop) and pages share its 1200px width ---------- */
.sv2 #home .hero,.sv2 #home .hero .hc{margin-top:0!important;padding-top:0!important}
@media (max-width:767px){.sv2 #home{padding-top:0!important}}
@media (min-width:768px){.sv2 #home{max-width:1200px!important}}
