/* "Hardwood classic" theme (2026-10-04): 80s-90s arena programme. Scoped to body.hw so pages switch over one at a time.
   Type: Graduate (varsity jersey numerals) for display + scores, Barlow Condensed caps for labels/buttons/nav, Barlow for text.
   Colour: walnut-black floor, maple wood, home-jersey red as the single action colour, old gold for the top tier. */
body.hw {
  --hw-bg: #14100c; --hw-panel: #1c1611; --hw-panel2: #241c15; --hw-line: #3a2c1e; --hw-line2: #2a2018;
  --hw-ink: #f1e6d3; --hw-ink2: #d9c9b0; --hw-mut: #a8977f; --hw-dim: #75644f;
  --hw-red: #c8102e; --hw-red2: #e0203f; --hw-maple: #c8894a; --hw-gold: #e9b44c;
  /* the page's own tokens (index.html etc. read these) */
  --bg: var(--hw-bg); --panel: var(--hw-panel); --line: var(--hw-line); --acc: var(--hw-red); --acc2: var(--hw-red2); --mut: var(--hw-mut);
  font-family: 'Barlow', system-ui, sans-serif !important; color: var(--hw-ink) !important;
}
html:has(body.hw) {
  background: #17110b !important;
  /* maple floor: centre-court light, dark board seams every 46px, three alternating board tones, fine grain lines */
  background-image:
    radial-gradient(70% 40% at 50% 0%, rgba(214,150,84,.16), transparent 70%),
    repeating-linear-gradient(90deg, rgba(0,0,0,.55) 0 1.5px, transparent 1.5px 46px),
    repeating-linear-gradient(90deg, rgba(200,137,74,.13) 0 46px, rgba(200,137,74,.05) 46px 92px, rgba(170,110,58,.10) 92px 138px, rgba(200,137,74,.03) 138px 184px),
    repeating-linear-gradient(90deg, rgba(255,214,160,.035) 0 1px, transparent 1px 5px, rgba(0,0,0,.05) 5px 6px, transparent 6px 11px),
    linear-gradient(180deg, rgba(0,0,0,0) 40%, rgba(0,0,0,.35)) !important;
  background-attachment: scroll !important;   /* fixed + 5 gradient layers repaints on every scroll frame */
}
body.hw::before { display: none; }

/* ---------- type ---------- */
body.hw .orb { font-family: 'Graduate', Georgia, serif; font-weight: 400 !important; letter-spacing: .02em; }
body.hw .btn, body.hw .nav-scroll, body.hw .seg button, body.hw .tab, body.hw .role,
body.hw .orb.text-\[9px\], body.hw .orb.text-\[10px\], body.hw .orb.text-\[11px\], body.hw .orb.text-xs, body.hw .orb.text-sm:not(h1):not(h2),
body.hw table.box th, body.hw .site-links h4 {
  font-family: 'Barlow Condensed', system-ui, sans-serif !important; font-weight: 700 !important; letter-spacing: .14em !important; text-transform: uppercase;
}
body.hw h1.orb { font-family: 'Graduate', Georgia, serif !important; letter-spacing: .01em; line-height: 1; color: var(--hw-ink); }
body.hw .acc { color: var(--hw-red) !important; }
body.hw .tier { font-family: 'Graduate', Georgia, serif !important; font-weight: 400 !important; }
body.hw table, body.hw .t, body.hw .box, body.hw .orb { font-variant-numeric: tabular-nums lining-nums; }
body.hw strong { color: var(--hw-ink); }

/* ---------- zinc utility remap (Tailwind greys -> walnut/sand) ---------- */
body.hw .text-white { color: var(--hw-ink) !important; }
body.hw .text-zinc-100, body.hw .text-zinc-200 { color: var(--hw-ink) !important; }
body.hw .text-zinc-300 { color: var(--hw-ink2) !important; }
body.hw .text-zinc-400 { color: var(--hw-mut) !important; }
body.hw .text-zinc-500 { color: #8d7c66 !important; }
body.hw .text-zinc-600, body.hw .text-zinc-700 { color: var(--hw-dim) !important; }
body.hw .border-zinc-800, body.hw .border-zinc-900 { border-color: var(--hw-line2) !important; }
body.hw .bg-zinc-900 { background-color: var(--hw-panel) !important; }
body.hw .bg-zinc-800 { background-color: var(--hw-panel2) !important; }

/* ---------- nav ---------- */
body.hw nav.sticky { background: rgba(20,16,12,.92) !important; border-bottom: 1px solid var(--hw-line) !important; }
body.hw nav .orb { font-family: 'Barlow Condensed', sans-serif !important; font-weight: 800 !important; letter-spacing: .22em !important; font-size: 15px; }
body.hw .nav-scroll { font-size: 13px !important; color: var(--hw-mut) !important; }
body.hw .nav-scroll > a:hover { color: var(--hw-ink) !important; }
body.hw .nav-scroll > a.acc { color: var(--hw-ink) !important; }
body.hw .nav-scroll > a.acc::after { background: var(--hw-red); height: 3px; border-radius: 0; }
body.hw .nav-scroll > a[target] { border-color: var(--hw-maple) !important; color: var(--hw-maple) !important; border-radius: 2px !important; }
body.hw .nav-scroll > a[target]:hover { background: var(--hw-maple) !important; color: #1a120a !important; }

/* ---------- surfaces: square, programme-like panels with a maple rule on top ---------- */
body.hw .panel, body.hw .card {
  background: var(--hw-panel) !important; border: 1px solid var(--hw-line) !important; border-radius: 4px !important;
  background-image: linear-gradient(180deg, rgba(200,137,74,.05), transparent 30%) !important;
  box-shadow: inset 0 2px 0 rgba(200,137,74,.35), 0 10px 26px -18px #000 !important;
}

/* ---------- buttons ---------- */
body.hw .btn { border-radius: 3px !important; }
body.hw .btn-main { background: var(--hw-red) !important; color: #fff4ea !important; font-size: 16px; padding: 14px 30px;
  box-shadow: inset 0 -3px 0 rgba(0,0,0,.25), 0 0 0 1px #8e0b20 !important; }
body.hw .btn-main:hover { background: var(--hw-red2) !important; box-shadow: inset 0 -3px 0 rgba(0,0,0,.25), 0 0 0 1px #8e0b20, 0 6px 18px -6px rgba(200,16,46,.6) !important; }
body.hw .btn-ghost, body.hw .btn-dark { border: 1px solid #5c4630 !important; color: var(--hw-ink2) !important; background: transparent !important; font-size: 13px; }
body.hw .btn-ghost:hover, body.hw .btn-dark:hover { border-color: var(--hw-maple) !important; color: var(--hw-maple) !important; }

/* ---------- controls ---------- */
body.hw select, body.hw select.teamsel, body.hw select.sel { background: var(--hw-panel2) !important; border: 1px solid var(--hw-line) !important; color: var(--hw-ink) !important; border-radius: 3px !important;
  font-family: 'Barlow Condensed', sans-serif; font-weight: 700; font-size: 17px; letter-spacing: .02em; }
body.hw select:focus { border-color: var(--hw-maple) !important; }
body.hw input[type=checkbox] { accent-color: var(--hw-red); }
body.hw :focus-visible { outline-color: var(--hw-maple); }

/* ---------- roster rows, roles, tables ---------- */
body.hw .prow { border-bottom-color: var(--hw-line2) !important; font-size: 14px; }
body.hw .prow:hover { background: var(--hw-panel2) !important; }
body.hw .role { font-size: 11px !important; letter-spacing: .08em !important; border-radius: 2px !important; }
body.hw table.box th { color: var(--hw-mut) !important; font-size: 12px !important; border-bottom-color: var(--hw-line) !important; }
body.hw table.box td { border-bottom-color: var(--hw-line2) !important; font-size: 13px; }
body.hw table.box td:first-child, body.hw table.box th:first-child { background: var(--hw-panel) !important; }
body.hw table.box tr.tot td { color: var(--hw-ink) !important; border-top-color: var(--hw-maple) !important; }
body.hw .play { border-bottom-color: var(--hw-line2) !important; }
body.hw .tab { color: var(--hw-mut) !important; font-size: 13px !important; }
body.hw .tab.on { color: var(--hw-ink) !important; border-color: var(--hw-red) !important; }

/* ---------- team marks: jerseys (see hwJersey in the page) ---------- */
body.hw .jersey { display: inline-block; flex-shrink: 0; filter: drop-shadow(0 3px 4px rgba(0,0,0,.45)); }

/* ---------- FAQ, footer, toast ---------- */
body.hw details > summary::after { color: var(--hw-maple); }
body.hw .site-links a { color: var(--hw-mut); } body.hw .site-links a:hover { color: var(--hw-ink); }
body.hw .site-links h4 { color: var(--hw-dim) !important; }
body.hw .site-toast { background: var(--hw-panel2); border-color: var(--hw-maple); }
body.hw ::selection { background: rgba(200,16,46,.45); }
@media (max-width: 767px) {
  body.hw .mobile-dock { background: linear-gradient(180deg, rgba(20,16,12,0), rgba(20,16,12,.94) 30%); }
}

/* small print: Barlow Condensed needs ~1.5px more than Inter to read the same */
body.hw .text-\[9px\] { font-size: 11px !important; }
body.hw .text-\[10px\] { font-size: 11.5px !important; }
body.hw .text-\[11px\] { font-size: 12.5px !important; }
body.hw .text-xs { font-size: 13px !important; }
/* wordmark */
body.hw nav a.orb:first-child { font-family: 'Graduate', Georgia, serif !important; font-weight: 400 !important; letter-spacing: .04em !important; font-size: 19px !important; }

/* roster rows: programme sections + lineup numbers (index.html renders .prow-div and role numbers) */
body.hw .pname { font-family: 'Barlow Condensed', sans-serif; font-weight: 600; font-size: 16.5px; letter-spacing: .01em; color: var(--hw-ink); }
body.hw .prow.out .pname { color: var(--hw-dim); }
body.hw .prow-div { font-family: 'Barlow Condensed', sans-serif; font-weight: 700; font-size: 12px; letter-spacing: .2em; text-transform: uppercase; color: var(--hw-maple);
  display: flex; align-items: center; gap: 10px; padding: 12px 10px 4px; }
body.hw .prow-div::after { content: ''; flex: 1; height: 1px; background: linear-gradient(90deg, var(--hw-line), transparent); }
body.hw .role { background: none !important; border: 0 !important; padding: 0 !important; }
body.hw .role.st { font-family: 'Graduate', Georgia, serif !important; font-size: 15px !important; letter-spacing: 0 !important; color: var(--hw-red2) !important; }
body.hw .role.bn::before { content: ''; display: inline-block; width: 4px; height: 4px; border-radius: 50%; background: var(--hw-dim); vertical-align: middle; }
body.hw .role.ot { font-size: 10px !important; color: #e07a5f !important; }
/* small headings that came from the old theme at 10px */
body.hw .site-links h4 { font-size: 12px !important; }
body.hw table th, body.hw .t th { font-family: 'Barlow Condensed', sans-serif; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; font-size: 12px !important; }

/* team card + picker (SITE.pickTeam in site.js; .teampick is the card that opens it) */
.teampick { width:100%; display:flex; align-items:center; gap:14px; padding:6px 8px 10px; margin-bottom:6px; border-bottom:1px solid var(--line); text-align:left; cursor:pointer; border-radius:4px; transition:background .15s; }
.teampick:hover { background:rgba(200,137,74,.06); }
.tp-side { display:block; font-family:'Barlow Condensed',sans-serif; font-weight:700; font-size:12px; letter-spacing:.16em; text-transform:uppercase; color:#c8894a; }
.tp-city { display:block; font-family:'Barlow Condensed',sans-serif; font-weight:600; font-size:15px; color:#a8977f; line-height:1.1; margin-top:2px; }
.tp-name { display:block; font-family:'Graduate',Georgia,serif; font-size:26px; line-height:1.05; color:#f1e6d3; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.tp-change { flex-shrink:0; font-family:'Barlow Condensed',sans-serif; font-weight:700; font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:#d9c9b0; border:1px solid #5c4630; border-radius:3px; padding:6px 10px; }
.teampick:hover .tp-change { border-color:#c8894a; color:#c8894a; }
#tpick { position:fixed; inset:0; z-index:70; background:rgba(8,6,4,.72); display:flex; align-items:center; justify-content:center; padding:24px; opacity:0; transition:opacity .18s; }
#tpick.open { opacity:1; }
.tp-sheet { width:100%; max-width:760px; max-height:88vh; display:flex; flex-direction:column; background:#1c1611; border:1px solid #3a2c1e; border-radius:6px; box-shadow:inset 0 2px 0 rgba(200,137,74,.35), 0 30px 60px -20px #000; transform:translateY(10px); transition:transform .2s; }
#tpick.open .tp-sheet { transform:none; }
.tp-head { display:flex; align-items:center; justify-content:space-between; padding:14px 18px; border-bottom:1px solid #3a2c1e; font-family:'Graduate',Georgia,serif; font-size:20px; color:#f1e6d3; }
.tp-x { width:36px; height:36px; border:1px solid #5c4630; border-radius:3px; color:#d9c9b0; font-size:14px; }
.tp-x:hover { border-color:#c8894a; color:#c8894a; }
.tp-body { overflow-y:auto; padding:6px 18px 18px; overscroll-behavior:contain; }
.tp-conf { font-family:'Barlow Condensed',sans-serif; font-weight:700; font-size:12px; letter-spacing:.2em; text-transform:uppercase; color:#c8894a; display:flex; align-items:center; gap:10px; margin:14px 0 8px; }
.tp-conf::after { content:''; flex:1; height:1px; background:linear-gradient(90deg,#3a2c1e,transparent); }
.tp-grid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:6px; }
.tp-tile { display:flex; flex-direction:column; align-items:center; gap:3px; padding:10px 4px 8px; border:1px solid transparent; border-radius:4px; transition:background .12s,border-color .12s; }
.tp-tile:hover, .tp-tile:focus-visible { background:#241c15; border-color:#4a3826; }
.tp-tile.on { background:rgba(200,16,46,.12); border-color:#c8102e; }
.tp-tn { font-family:'Barlow Condensed',sans-serif; font-weight:700; font-size:15px; color:#f1e6d3; line-height:1.1; text-align:center; }
.tp-tr { font-family:'Barlow Condensed',sans-serif; font-weight:600; font-size:12px; color:#8d7c66; letter-spacing:.04em; }
.tp-note { font-size:12px; color:#75644f; margin-top:12px; }
@media (max-width:640px) {
  #tpick { align-items:flex-end; padding:0; }
  .tp-sheet { max-height:86vh; border-radius:10px 10px 0 0; transform:translateY(40px); }
  .tp-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .tp-name { font-size:22px; }
}
/* search + extras (SITE.pickTeam) */
.tp-search { padding:12px 18px 4px; }
.tp-search input { width:100%; background:#14100c; border:1px solid #4a3826; border-radius:3px; color:#f1e6d3; padding:10px 12px; font-family:'Barlow',sans-serif; font-size:16px; }
.tp-search input::placeholder { color:#75644f; }
.tp-search input:focus { outline:none; border-color:#c8894a; }
.tp-extra { display:block; width:100%; text-align:left; margin-top:10px; padding:10px 12px; border:1px solid #4a3826; border-radius:3px; font-family:'Barlow Condensed',sans-serif; font-weight:700; font-size:15px; letter-spacing:.04em; color:#f1e6d3; }
.tp-extra:hover { border-color:#c8894a; } .tp-extra.on { border-color:#c8102e; background:rgba(200,16,46,.12); }
.tp-empty { display:none; text-align:center; color:#8d7c66; padding:24px 0; font-size:14px; }
[hidden] { display:none !important; }

/* compact team chip that opens SITE.pickTeam (trade sim, GM trade partner, mock draft) */
.tchip { display:inline-flex; align-items:center; gap:8px; padding:5px 10px 5px 6px; border:1px solid #4a3826; border-radius:3px; background:#241c15; cursor:pointer; max-width:100%; }
.tchip:hover { border-color:#c8894a; }
.tchip-n { font-family:'Barlow Condensed',sans-serif; font-weight:700; font-size:18px; color:#f1e6d3; white-space:nowrap; }
.tchip-c { font-family:'Barlow Condensed',sans-serif; font-weight:700; font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:#a8977f; white-space:nowrap; }