:root{
  /* TEAM COLORS (set per team via JS on team pages) */
  --team-a:#ff5500;
  --team-b:#f4f4f4;

  --team-a-rgb:255, 85, 0;
  --team-b-rgb:244, 244, 244;

  /* hover fallback */
  --hover-color: var(--team-a);
  --hover-rgb: var(--team-a-rgb);

  /* Text + UI */
  --text:#ffffff;
  --muted:rgba(255,255,255,.75);

  --shadow:0 18px 45px rgba(0,0,0,.45);
  --shadow-soft:0 12px 30px rgba(0,0,0,.30);

  /* SINGLE SOURCE OF TRUTH FOR ROW HEIGHT */
  --row-pad-y:10px;
  --row-line-height:1.15;

  /* POS/PLAYER SPACING (TEAM PAGES) */
  --pos-col:54px;
  --pos-gap:8px;

  /* Team dropdown hover control */
  --team-dd-hover: rgba(255,255,255,0.22);
  --team-dd-hover-outline: rgba(255,255,255,0.18);

  /* STARTERS table left pad for PLAYER column */
  --starters-player-pad-left: 25px;
}

/* =======================
   Base / Reset
======================= */
*{box-sizing:border-box}
html,body{margin:0;padding:0}

body{
  font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  color:var(--text);
  line-height:1.45;
  overflow-x:hidden;
  background:
    repeating-linear-gradient(45deg,
      rgba(255,255,255,.012),
      rgba(255,255,255,.012) 1px,
      transparent 1px,
      transparent 7px
    ),
    color-mix(in srgb, var(--team-a) 12%, #060812);
}

/* Home page uses neutral background (team pages keep team tint) */
body.home{
  background:
    repeating-linear-gradient(45deg,
      rgba(255,255,255,.012),
      rgba(255,255,255,.012) 1px,
      transparent 1px,
      transparent 7px
    ),
    color-mix(in srgb, #0b0e1a 12%, #060812);
}

/* Remove animated glow layer entirely */
body::before{content:"";display:none}

/* Force all text to stay white */
body, body *{color:#ffffff !important}

/* Team pages: add shadow to ALL text (index stays cleaner) */
body:not(.home) *{
  text-shadow:
    0 1px 2px rgba(0,0,0,0.85),
    0 3px 6px rgba(0,0,0,0.65),
    0 6px 14px rgba(0,0,0,0.45);
}

/* Muted hierarchy */
.tag,
.team-tile .meta,
.team-row .meta,
.footer,
.nav a{
  color: var(--muted) !important;
}

/* Ensure links never tint */
a,a:hover,a:visited{
  color:#ffffff !important;
  text-decoration:none;
}

/* Wrapper */
.wrap{
  width:min(1100px, calc(100% - 48px));
  margin:0 auto;
}

/* =======================
   Header
======================= */
.site-header{
  position:sticky;
  top:0;
  z-index:999999;
  isolation:isolate;
  border-bottom:2px solid rgba(var(--team-b-rgb), .85);
  background: rgba(8,11,21,.92);
  backdrop-filter:blur(12px);
}

.site-header .wrap{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  padding:2px 18px;
}

.site-header a{
  font-weight:850;
  letter-spacing:-.2px;
}

.header-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
}

.brand{
  display:flex;
  align-items:center;
  gap:12px;
}

.logo-link{
  display:inline-flex;
  align-items:center;
}

.site-logo{
  width:100px;
  height:100px;
  object-fit:contain;
  display:block;
}

.brand-text{
  display:flex;
  flex-direction:column;
  gap:2px;
}

.tag{
  font-weight:650;
  font-size:12px;
}

.nav a{
  margin-left:14px;
  font-weight:650;
  padding:8px 10px;
  border-radius:12px;
  transition: background .12s ease, transform .12s ease, box-shadow .12s ease, border-color .12s ease;
  border:1px solid transparent;
}

.nav a:hover{
  background: rgba(var(--hover-rgb), .12);
  border-color: rgba(var(--team-b-rgb), .65);
  box-shadow: 0 0 0 2px rgba(var(--hover-rgb), .28);
  transform: translateY(-1px);
}

@media (max-width:700px){
  .site-header .wrap{flex-direction:column;align-items:flex-start;}
  .header-row{flex-direction:column;align-items:flex-start;}
}

/* =======================
   Main spacing
======================= */
main.wrap{padding:24px 0 32px}

/* =======================
   Team Hero
======================= */
.team-hero{
  border:2px solid rgba(var(--team-b-rgb), .80);
  border-radius:22px;
  padding:18px;
  margin:10px 0 14px;
  background: rgba(255,255,255,.02);
  box-shadow: var(--shadow);
  position: relative;
  overflow:hidden;
}

.team-hero::after{content:none !important;display:none !important;background:none !important}

.team-hero-inner{
  display:grid;
  justify-items:center;
  text-align:center;
  position:relative;
  z-index:1;
  padding:0;
}

.team-hero-inner > div{
  width:100%;
  max-width:860px;
}

.team-hero h1{
  margin:0 0 6px;
  font-size: clamp(32px, 3.8vw, 46px);
  letter-spacing:-.8px;
  line-height:1.06;
  display:inline-block;
  position:relative;
}

/* Remove orange underline bar under hero H1 */
.team-hero h1::after{
  content:none !important;
  display:none !important;
}

/* Team name at top of team page (id hook) */
.team-hero #teamTitle{
  font-size: clamp(2.6rem, 6vw, 4rem);
  font-weight: 800;
  line-height: 1.05;
  text-shadow: 0 3px 8px rgba(0, 0, 0, 0.35);
}

/* Homepage only: tighter hero spacing without affecting team pages */
body.home .team-hero{ padding:12px; }
body.home .team-hero h1{ margin:0; line-height:1.05; }
body.home .team-hero .team-hero-inner > div > div{ margin-top:8px !important; }

/* =======================
   Cards
======================= */
.card{
  margin-top:10px;
  padding:12px;
  border-radius:18px;
  border:2px solid rgba(var(--team-b-rgb), .70);
  background: rgba(255,255,255,.01);
  box-shadow: var(--shadow-soft);
  position:relative;
  overflow:hidden;
  transition: transform .14s ease, border-color .14s ease, box-shadow .14s ease;
}

.card::before{content:none !important;display:none !important;background:none !important}

.card:hover{
  transform: translateY(-2px);
  border-color: rgba(var(--team-b-rgb), .92);
  box-shadow: 0 0 0 2px rgba(var(--team-b-rgb), .35), 0 18px 46px rgba(0,0,0,.42);
}

.card h2{
  margin:0 0 8px;
  font-size:20px;
  font-weight:900;
  letter-spacing:-.2px;
}

.card-head{ text-align:center; }

.card .card-head .card-title{
  font-size: 1.7rem;
  font-weight: 600;
  text-align: center;
}

/* =======================
   Tables (global)
======================= */
.table-wrap{
  width:100%;
  border-radius:16px;
  overflow:hidden;
  border:2px solid rgba(var(--team-b-rgb), .70);
  background: rgba(0,0,0,.18);
}

.table{
  width:100%;
  border-collapse:collapse;
  table-layout:fixed;
}

.table thead{ background: rgba(var(--team-b-rgb), .14); }

.table thead th{
  text-align:left;
  font-size:11px;
  letter-spacing:.10em;
  text-transform:uppercase;
  padding: var(--row-pad-y) 12px;
  line-height: var(--row-line-height);
  border-bottom:1px solid rgba(255,255,255,.10);
}

.table tbody td{
  padding: var(--row-pad-y) 12px;
  line-height: var(--row-line-height);
  border-bottom:1px solid rgba(255,255,255,.08);
  transition: background .12s ease;
}

.table tbody tr:last-child td{border-bottom:none}
.table tbody tr:nth-child(odd) td{background: rgba(255,255,255,.010)}

/* Default row hover (do not change) */
.table tbody tr:hover td{ background: rgba(var(--hover-rgb), .18); }

/* Column sizing */
.table th:nth-child(1),
.table td:nth-child(1){
  width:44px;
  text-align:center;
  font-weight:800;
  font-size: 1.1rem;
}

.table th:nth-child(2),
.table td:nth-child(2){
  width:auto;
  font-weight:750;
  font-size:1.06rem;
  letter-spacing:.2px;
}

/* Team pages only: make player names larger (2nd column) */
body:not(.home) .table tbody td:nth-child(2){
  font-size: 1.22rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.2px;
}

/* Header label (team pages only) */
body:not(.home) .table thead th:nth-child(2){ font-size: 0.95rem !important; }

/* POS column width + gap (team pages only) */
body:not(.home) .table:not(.starters-mini) th:nth-child(1),
body:not(.home) .table:not(.starters-mini) td:nth-child(1){
  width: var(--pos-col) !important;
  padding-right: var(--pos-gap) !important;
}

body:not(.home) .table:not(.starters-mini) thead th:nth-child(1),
body:not(.home) .table:not(.starters-mini) thead th:nth-child(2){
  font-size: 0.95rem !important;
  letter-spacing: 0.10em !important;
}

body:not(.home) .table:not(.starters-mini) tbody td:nth-child(1),
body:not(.home) .table:not(.starters-mini) tbody td:nth-child(2){
  font-size: 1.15rem !important;
}

/* =======================
   Footer (UNCHANGED)
======================= */
.footer{
  border-top:2px solid rgba(var(--team-b-rgb), .55);
  margin-top:14px;
  padding:12px 0;
  font-size:13px;
}

.footer .wrap{
  text-align:center;
  padding:18px 0;
}

/* =======================
   Starters grid + cards
======================= */
.starters-grid{
  display: grid;
  gap: 16px;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  margin-top: 18px;
}

#startersGrid.starters-grid{ grid-template-columns: repeat(4, minmax(0, 1fr)); }

@media (max-width: 1100px){
  #startersGrid.starters-grid{grid-template-columns: repeat(3, minmax(0, 1fr));}
}
@media (max-width: 820px){
  #startersGrid.starters-grid{grid-template-columns: repeat(2, minmax(0, 1fr));}
}
@media (max-width: 520px){
  #startersGrid.starters-grid{grid-template-columns: 1fr;}
}

.starter-card{
  border-radius: 16px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,0.12);
  background: rgba(0,0,0,0.35);
  box-shadow: 0 10px 30px rgba(0,0,0,0.35);
  --card-hover-rgb: var(--hover-rgb);
}

.starter-card-head{ padding: 6px 14px; }

.starter-card-title{
  text-align:center;
  font-size: 1.25rem;
  font-weight: 900;
  letter-spacing: 0.3px;
  line-height: 1.0;
  margin: 0;
  padding: 0;

  -webkit-text-stroke: 1px #000;
  text-shadow:
    0 1px 2px rgba(0,0,0,0.85),
    0 3px 6px rgba(0,0,0,0.65),
    0 6px 14px rgba(0,0,0,0.45);
}

.starter-card-title .team-city,
.starter-card-title .team-mascot{
  display:block;
  white-space: nowrap;
}

.starter-card-title .team-city{margin-bottom:-2px}
.starter-card-title .team-mascot{margin-top:-2px}

.starter-card-body{ padding: 10px 12px 12px; }

.table.starters-mini td{
  padding: 8px 6px;
  border-top: 1px solid rgba(255,255,255,0.10);
  border-bottom:none;
}

.table.starters-mini tr:first-child td{border-top:none}

.table.starters-mini td.pos{
  width: 44px;
  opacity: 0.9;
  font-weight: 800;
}

.table.starters-mini td.name{font-weight: 700}

body.home #startersGrid .starter-card .table.starters-mini tbody tr:hover td{
  background: rgba(var(--card-hover-rgb), .22) !important;
}

#startersGrid .view-roster-btn{
  display:block;
  width: fit-content;
  margin: 8px auto 0;
  padding: 6px 12px;
  border-radius: 999px;

  font-weight: 900;
  font-size: 0.85rem;
  letter-spacing: 0.3px;

  background: #000 !important;
  color: #fff !important;

  border: 1px solid rgba(255,255,255,0.28);
  text-align: center;
  text-decoration: none;
  cursor: pointer;
}

#startersGrid .view-roster-btn:hover{
  background:#111 !important;
  border-color: rgba(255,255,255,0.45);
}

body.home #startersGrid .table.starters-mini td.name{
  white-space:nowrap;
  font-size:0.97rem;
  letter-spacing:0.1px;
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce){
  .card, .nav a{ transition:none; }
}

/* =========================
   TEAM PAGE: Teams dropdown (legacy <select> support)
========================= */
.team-jump select{
  background-color:#000 !important;
  color:#fff !important;
  border:1px solid rgba(255,255,255,0.35);
  border-radius:999px;
  padding:8px 14px;
  font-size:14px;
  font-weight:700;
  appearance:none;
  -webkit-appearance:none;
  -moz-appearance:none;
}

.team-jump{position:relative}

.team-jump::after{
  content:"▾";
  position:absolute;
  right:14px;
  top:50%;
  transform:translateY(-50%);
  color:#fff;
  font-size:16px;
  font-weight:700;
  pointer-events:none;
}

.team-jump select option{
  background-color:#000 !important;
  color:#fff !important;
  font-weight:700;
}

.team-jump select{padding-right:36px !important}

.team-jump .team-jump-item:hover{
  background: var(--team-dd-hover);
  outline: 1px solid var(--team-dd-hover-outline);
}

/* =========================
   Search box
========================= */
.search-pop{
  width:min(520px, 100%);
  padding:14px 16px;
  border-radius:999px;
  background:rgba(0,0,0,0.55);
  border:2px solid rgba(255,255,255,0.22);
  font-size:16px;
  font-weight:800;
  letter-spacing:0.2px;
  outline:none;
  box-shadow:
    0 10px 26px rgba(0,0,0,0.45),
    0 0 0 2px rgba(255,255,255,0.06);
  transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease, background .12s ease;
}

.search-pop::placeholder{
  color:rgba(255,255,255,0.70);
  font-weight:700;
}

.search-pop:hover{
  transform:translateY(-1px);
  border-color:rgba(255,255,255,0.35);
  background:rgba(0,0,0,0.62);
}

.search-pop:focus{
  border-color:#fff;
  box-shadow:
    0 14px 34px rgba(0,0,0,0.55),
    0 0 0 4px rgb(245, 244, 244);
}

/* =========================
   TEAM PAGE LAYOUT
========================= */
body.team-page .wrap{
  width:min(1200px, calc(100% - 48px)) !important;
}

.team-layout{
  display:grid;
  grid-template-columns:420px minmax(0, 1fr);
  gap:22px;
  align-items:start;
  max-width:none;
  margin:0;
}

.team-layout > .col{ min-width:0; }

@media (max-width:900px){
  .team-layout{grid-template-columns:1fr;}
}

/* =========================
   BENCH (two inner tables + header)
========================= */
.bench-table{ padding:0; }

.bench-header{
  display:grid;
  grid-template-columns: var(--pos-col) minmax(0, 1fr) var(--pos-col) minmax(0, 1fr);
  background:rgba(var(--team-b-rgb), .14);
  border-bottom:1px solid rgba(255,255,255,.10);
}

.bench-header span{
  text-align:left;
  font-size:0.95rem;
  font-weight:700;
  letter-spacing:0.10em;
  text-transform:uppercase;
  color:rgba(255,255,255,0.75);
  padding: var(--row-pad-y) 12px;
  line-height: var(--row-line-height);
  white-space:nowrap;
}

.bench-header span:nth-child(1),
.bench-header span:nth-child(3){
  text-align:center;
}

.bench-columns{
  display:grid;
  grid-template-columns:minmax(0, 1fr) minmax(0, 1fr);
}

.bench-col{
  width:100%;
  border-collapse:collapse;
  table-layout:fixed;
}

.bench-col:first-child{
  border-right:1px solid rgba(255,255,255,.12);
}

.bench-col td{
  padding: var(--row-pad-y) 12px;
  line-height: var(--row-line-height);
  border-bottom:1px solid rgba(255,255,255,.08);
  transition: background .12s ease;
}

.bench-col tr:last-child td{ border-bottom:none; }
.bench-col tr:nth-child(odd) td{ background:rgba(255,255,255,.010); }
.bench-col tr:hover td{ background:rgba(var(--hover-rgb), .18); }

.bench-col td:nth-child(1){
  width: var(--pos-col);
  text-align:center;
  font-weight:800;
  font-size:1.15rem;
  padding-right: var(--pos-gap);
}

.bench-col td:nth-child(2){
  font-weight:800;
  font-size:1.15rem;
  letter-spacing:0.2px;
}

@media (max-width:700px){
  .bench-header{grid-template-columns: var(--pos-col) minmax(0, 1fr);}
  .bench-header span:nth-child(3),
  .bench-header span:nth-child(4){display:none;}
  .bench-columns{grid-template-columns:1fr;}
  .bench-col:first-child{
    border-right:none;
    border-bottom:1px solid rgba(255,255,255,.12);
  }
}

/* =========================
   NOTABLE PLAYERS GRID
========================= */
.col.col-full{grid-column: 1 / -1;}
.notable-card, .notable-card .table-wrap, .table.notable-grid{width:100%;}
.table.notable-grid thead{display:none;}

.table.notable-grid tbody#notableBody{
  display:grid;
  grid-template-columns:repeat(4, minmax(240px, 1fr));
  gap:0 !important;
}

@media (max-width:1200px){
  .table.notable-grid tbody#notableBody{grid-template-columns:repeat(3, minmax(220px, 1fr));}
}
@media (max-width:900px){
  .table.notable-grid tbody#notableBody{grid-template-columns:repeat(2, minmax(220px, 1fr));}
}
@media (max-width:520px){
  .table.notable-grid tbody#notableBody{grid-template-columns:1fr;}
}

.table.notable-grid tbody#notableBody tr{
  display:grid;
  grid-template-columns: var(--pos-col) minmax(0, 1fr);
  align-items:center;
  position:relative;
  padding:0 6px;
  border-bottom:1px solid #ffffff;
}

.table.notable-grid tbody#notableBody tr:last-child{border-bottom:none;}

.table.notable-grid tbody#notableBody tr::before{
  content:"";
  position:absolute;
  top:0;
  bottom:0;
  left:6px;
  right:6px;
  background:transparent;
  transition: background .12s ease;
  z-index:0;
}

.table.notable-grid tbody#notableBody tr:nth-child(odd)::before{
  background:rgba(255,255,255,.010);
}

.table.notable-grid tbody#notableBody tr:hover::before{
  background:rgba(var(--hover-rgb), .18);
}

.table.notable-grid tbody#notableBody td{
  border-bottom:none !important;
  background:transparent !important;
  position:relative;
  z-index:1;
  padding: var(--row-pad-y) 12px !important;
  line-height: var(--row-line-height);
}

.table.notable-grid tbody#notableBody td:first-child{
  width: var(--pos-col);
  text-align:center;
  font-weight:800;
  font-size:1.15rem;
  padding-right: var(--pos-gap);
}

.table.notable-grid tbody#notableBody td:last-child{
  font-weight:800;
  font-size:1.15rem;
  letter-spacing:.2px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

/* =========================
   WHITE HORIZONTAL LINES + NO VERTICAL LINES
========================= */
.table tbody td{ border-bottom:1px solid #ffffff !important; }
.bench-col td{ border-bottom:1px solid #ffffff !important; }

.table tbody tr:last-child td,
.bench-col tr:last-child td{ border-bottom:none !important; }

.table th,
.table td,
.bench-col th,
.bench-col td,
.table.notable-grid th,
.table.notable-grid td{
  border-left:none !important;
  border-right:none !important;
}

.table,
.table-wrap,
.bench-col,
.table.notable-grid{
  border-left:none !important;
  border-right:none !important;
}

.bench-col:first-child{ border-right:none !important; }

/* =========================
   Normalize row height across all tables in main
========================= */
main table th,
main table td{
  padding-top:var(--row-pad-y) !important;
  padding-bottom:var(--row-pad-y) !important;
  line-height:var(--row-line-height) !important;
  vertical-align:middle !important;
}

main table th > *,
main table td > *{
  margin:0 !important;
  padding-top:0 !important;
  padding-bottom:0 !important;
  line-height:inherit !important;
  min-height:0 !important;
}

main table tr{ height:auto !important; }

/* =========================
   TEAM PAGES: disable zebra striping, keep hover
========================= */
body:not(.home) .table tbody tr td{ background: transparent !important; }
body:not(.home) .bench-col tr td{ background: transparent !important; }
body:not(.home) .table.notable-grid tbody#notableBody tr::before{ background: transparent !important; }

body:not(.home) .table tbody tr:hover td{
  background: rgba(var(--hover-rgb), .18) !important;
}

body:not(.home) .bench-col tr:hover td{
  background: rgba(var(--hover-rgb), .18) !important;
}

body:not(.home) .table.notable-grid tbody#notableBody tr:hover::before{
  background: rgba(var(--hover-rgb), .18) !important;
}

/* =========================
   SEGMENTED TOGGLE (kept)
========================= */
.segmented{
  --active-color:#07621e;
  --active-glow: rgba(7,98,30,.40);

  display:flex;
  align-items:center;
  justify-content:center;
  gap:4px;

  padding:4px;
  border-radius:999px;

  background:rgba(0,0,0,.35);
  border:1.75px solid rgba(255,255,255,.90);
  box-shadow:0 8px 20px rgba(0,0,0,.28);
}

.segmented .seg-btn{
  appearance:none;
  -webkit-appearance:none;

  display:inline-flex;
  align-items:center;
  justify-content:center;

  cursor:pointer;
  user-select:none;

  padding:6px 12px;
  border-radius:999px;

  font-size:.88rem;
  font-weight:600;
  letter-spacing:.3px;

  color:#fff;
  background:transparent;
  border:none;

  transition: background .2s ease, box-shadow .2s ease, color .2s ease;
}

.segmented .seg-btn.active{
  background:var(--active-color);
  box-shadow:
    0 0 0 2px rgba(255,255,255,.9),
    0 0 12px var(--active-glow);
  color:#fff;
}

.segmented-wrap{
  margin-left:auto;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:6px;
}

.segmented-label{
  text-align:center;
  font-size:13px;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:rgba(255,255,255,.82);
}

/* =========================
   DRAG AND DROP (kept)
========================= */
tr.dnd-row{ cursor: grab; }
tr.dnd-row:active{ cursor: grabbing; }

tr.dnd-row.dragging{
  opacity:.70;
  filter: saturate(1.05);
  cursor: grabbing;
}

tbody.dnd-target{
  outline:2px solid rgba(255,255,255,0.18);
  outline-offset:2px;
  border-radius:10px;
}

tr.dnd-over{
  position:relative;
  z-index:5;

  outline:2px solid #ffffff;
  outline-offset:-2px;

  box-shadow:
    0 0 0 2px rgba(255,255,255,0.95),
    0 0 14px rgba(255,255,255,0.80),
    0 0 28px rgba(255,255,255,0.40);

  transform: scale(1.015);
  transition: box-shadow .12s ease, transform .12s ease, outline-color .12s ease;
}

tr.dnd-over td{
  background: rgba(255,255,255,0.05) !important;
}

tr.dnd-row,
tr.dnd-row *{
  user-select: none;
  -webkit-user-select: none;
}

td.dnd-namecell{
  position:relative;
  padding-right:38px;
  z-index:0;
}


/* =========================
   TEAM PAGE: ACTION BUTTONS (kept)
========================= */
.team-actions{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  margin-top:10px;
  flex-wrap:wrap;
  width:100%;
}

.team-action-btn{
  appearance:none;
  -webkit-appearance:none;
  border:1px solid rgba(255,255,255,0.40);
  background:rgba(0,0,0,0.35);
  color:#fff;
  padding:9px 14px;
  border-radius:999px;
  font-weight:800;
  font-size:13px;
  cursor:pointer;
  transition:transform .06s ease, background .12s ease, border-color .12s ease;
}

.team-action-btn:hover{
  background:rgba(255,255,255,0.10);
  border-color:rgba(255,255,255,0.55);
}

.team-action-btn:active{ transform:scale(0.98); }

.team-actions-hint{
  flex-basis:100%;
  text-align:center;
  font-size:12px;
  opacity:.72;
  font-weight:700;
  padding-left:0;
  white-space:nowrap;
}

/* Force Share + Reset to be identical (CSS only) */
.team-action-btn,
.team-action-btn.primary{
  background:rgba(0,0,0,0.35) !important;
  border:1px solid rgba(255,255,255,0.40) !important;
  color:#fff !important;
}

.team-action-btn:hover,
.team-action-btn.primary:hover{
  background:rgba(255,255,255,0.10) !important;
  border-color:rgba(255,255,255,0.55) !important;
}

/* =========================
   STARTERS: keep PLAYER header aligned with player cells
========================= */
#startersTable thead th:nth-child(2){
  padding-left: var(--starters-player-pad-left) !important;
}

#startersTable tbody td:nth-child(2){
  padding-left: var(--starters-player-pad-left) !important;
}

/* STARTER POSITION DROPDOWN option readability */
.starter-pos-select{
  background: transparent;
  color: #ffffff;
}

.starter-pos-select option{
  background-color: #000000;
  color: #ffffff;
  font-weight: 800;
}

.starter-pos-select option:checked,
.starter-pos-select option:hover{
  background-color: rgba(255,255,255,0.18);
  color: #ffffff;
}

/* =========================
   Center brand text block (kept; not footer, not hover)
   NOTE: left as-is to avoid unintended header behavior changes.
========================= */
.brand-text{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:6px;
}

.brand-text .logo{
  display:inline-block;
  text-align:center;
  margin:0;
  padding:0;
}

.team-jump{
  width:100%;
  display:flex;
  justify-content:center;
  margin-top:0;
}

.team-jump-select{
  width:220px;
  max-width:52vw;
}

.team-jump{
  display:flex;
  justify-content:center;
  width:100%;
}

.team-jump-select{
  width:auto;
  min-width:unset;
  max-width:100%;
  padding:6px 14px;
  font-size:12px;
  text-align:center;
  white-space:nowrap;
}

.team-jump select{
  padding-right:36px !important;
}

/* =========================
   Team Jump dropdown hover + selected visibility (kept)
========================= */
.team-jump-select option{
  background-color:#000000;
  color:#ffffff;
  font-weight:800;
}

.team-jump-select option:hover{
  background-color:rgba(255,255,255,0.25);
  color:#ffffff;
}

.team-jump-select option:checked,
.team-jump-select option:focus{
  background-color:rgba(255,255,255,0.35);
  color:#ffffff;
}

@-moz-document url-prefix() {
  .team-jump-select option{ background-color:#000000; }
}

/* =========================
   Tighter card headers (kept)
========================= */
.card .card-head{
  padding-top: 0px !important;
  padding-bottom: 10px !important;
  min-height: 0 !important;
}

.card .card-head .card-title{
  margin: 0 !important;
  line-height: 1.1 !important;
}

/* =========================
   Slim team hero (kept)
========================= */
.team-page .team-hero{
  padding-top: 5px !important;
  padding-bottom: 5px !important;
}

.team-page .team-hero-inner{
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

.team-page #teamTitle{
  margin-top: 0 !important;
  margin-bottom: 8px !important;
  line-height: 1.05 !important;
}

/* =========================
   Slightly larger instruction text (kept)
========================= */
.team-page .team-actions-hint{
  font-size:14px !important;
  line-height:1.35 !important;
}

/* =========================
   Slim header blocks (kept exactly; not footer, not hover)
========================= */
.home .site-header{
  padding-top: 0px !important;
  padding-bottom: 0px !important;
}

.home .header-row{
  padding-top: 0px !important;
  padding-bottom: 0px !important;
  min-height: 0 !important;
}

body.team-page .site-header{
  padding-top:0px;
  padding-bottom:0px;
}

body.team-page .site-header .wrap{
  max-width:1100px;
  padding-left:14px;
  padding-right:14px;
}

body.team-page .site-header{
  padding-top:10px !important;
  padding-bottom:10px !important;
}

body.team-page .header-row{
  padding-top:0 !important;
  padding-bottom:0 !important;
  min-height:auto !important;
}

body.team-page .site-logo{
  height:36px !important;
  width:auto !important;
  display:block;
}

body.team-page .site-header{
  padding-top:0 !important;
  padding-bottom:0 !important;
}

body.team-page .site-header .wrap{
  padding-top:0px !important;
  padding-bottom:0px !important;
}

body.team-page .header-row{
  padding-top:0 !important;
  padding-bottom:0 !important;
  min-height:0 !important;
}

body.team-page .site-logo{
  width:120px !important;
  height:100px !important;
  object-fit:contain !important;
}

body.home .site-logo{
  width:120px !important;
  height:100px !important;
  object-fit:contain !important;
}

/* =========================
   Footer blocks (UNCHANGED)
========================= */
.footer{
  font-size:12px;
  letter-spacing:.04em;
  opacity:.78;
}

.footer{
  padding-top:10px;
  padding-bottom:10px;
}

.footer .wrap{
  padding-top:0;
  padding-bottom:0;
  padding-left:12px;
  padding-right:12px;
  max-width:1100px;
}

.footer-disclaimer{
  font-size:12px;
  line-height:1.35;
  opacity:.75;

  max-width:100%;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.footer{
  padding-top:10px;
  padding-bottom:10px;
  font-size:12px;
  letter-spacing:.04em;
  opacity:.78;
}

footer.footer .wrap{
  width:calc(100% - 24px) !important;
  max-width:none !important;
  margin:0 auto;
  padding:0 12px;
  text-align:center;
}

footer.footer .footer-disclaimer{
  white-space:nowrap !important;
  max-width:none !important;
  overflow:visible !important;
  text-overflow:clip !important;
}

@media (max-width: 900px){
  footer.footer .footer-disclaimer{
    display:block;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:thin;
    padding-bottom:2px;
  }
}

/* =========================
   PILL DROPDOWN (Bench size) (kept)
========================= */
.bench-size-ui{
  display:inline-flex;
  align-items:center;
  gap:8px;

  padding:6px 10px;
  border-radius:999px;

  background:rgba(255,255,255,0.10);
  border:1px solid rgba(255,255,255,0.28);
  box-shadow:0 10px 22px rgba(0,0,0,0.35), 0 4px 10px rgba(0,0,0,0.25);

  backdrop-filter:blur(6px);
  -webkit-backdrop-filter:blur(6px);
}

.bench-size-ui > span{
  font-weight:800;
  opacity:.9;
}

.bench-size-select{
  appearance:none;
  -webkit-appearance:none;
  -moz-appearance:none;

  background:transparent;
  color:var(--text);

  border:none;
  outline:none;

  font:inherit;
  font-weight:900;

  padding:0 18px 0 6px;
  line-height:1;
  cursor:pointer;
}

.bench-size-arrow{
  margin-left:-10px;
  font-weight:900;
  opacity:.9;
  cursor:pointer;
  transform:translateY(-1px);
}

.bench-size-select option{
  background:rgba(0,0,0,0.95);
  color:#fff;
  font-weight:800;
}

.bench-size-ui{ font-size: 20px; }
.bench-size-ui{ padding: 4px 19px; }

.bench-size-pill,
.bench-size-wrap,
.bench-size-control,
.bench-size{
  position: relative;
  padding-right: 15px;
}

.bench-size-arrow{
  font-size: 30px;
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  pointer-events: none;
}

.bench-slots select{
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;

  text-align: center;
  text-align-last: center;

  padding-left: 28px;
  padding-right: 28px;

  background-position: right 12px center;
  background-size: 14px;

  display: inline-block;
}

/* =========================================================
   SHARED PILL SELECT (kept)
========================================================= */
.pill-select{
  appearance:none;
  -webkit-appearance:none;
  -moz-appearance:none;

  display:inline-block;
  border-radius:999px;

  background-color:rgba(255,255,255,0.10);
  border:2px solid rgba(255,255,255,0.28);
  color:#fff;

  font-weight:800;
  letter-spacing:0.4px;

  text-align:center;
  text-align-last:center;

  padding:6px 28px;

  background-image:url("data:image/svg+xml;utf8,\
  <svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'>\
    <path d='M7 10l5 5 5-5z'/>\
  </svg>");
  background-repeat:no-repeat;
  background-size:14px;
  background-position:right 12px center;

  line-height:1;
}

/* =====================================================
   STARTERS: POS DROPDOWN CARET (kept)
===================================================== */
:root{
  --starter-caret-size: 30px;
  --starter-caret-right: -10px;
  --starter-caret-color: #ffffff;
  --starter-caret-pad: 52px;
}

#startersTable tbody td:first-child{ position: relative; }

#startersTable tbody td:first-child select{
  appearance: none !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;

  background-image: none !important;
  padding-right: var(--starter-caret-pad) !important;
}

#startersTable tbody td:first-child select::-ms-expand{
  display: none !important;
}

#startersTable tbody td:first-child .starter-pos-arrow,
#startersTable tbody td:first-child .pos-arrow,
#startersTable tbody td:first-child .select-arrow,
#startersTable tbody td:first-child .dropdown-arrow,
#startersTable tbody td:first-child .caret,
#startersTable tbody td:first-child .arrow,
#startersTable tbody td:first-child span[aria-hidden="true"]{
  display: none !important;
}

#startersTable tbody td:first-child::after{
  content: "▾";
  position: absolute;
  right: var(--starter-caret-right);
  top: 50%;
  transform: translateY(-50%);

  font-size: var(--starter-caret-size);
  font-weight: 900;
  color: var(--starter-caret-color);

  pointer-events: none;
}

/* =========================================================
   COLOR BOOST / UNIFY HOVER / INDEX HOVER / ACTION BUTTONS
   (HOVER RULES UNCHANGED, ONLY DE-DUPED THE EXTRA :root BLOCKS)
========================================================= */
:root{
  --hover-alpha: .30;
  --chip-alpha: .22;
  --outline-alpha: .55;
  --text-boost: 1;
}

.table tbody tr:hover td,
.notable-grid tbody tr:hover td{
  background: rgba(var(--hover-rgb), var(--hover-alpha)) !important;
}

#benchBody > tr:hover{
  background: rgba(var(--hover-rgb), var(--hover-alpha)) !important;
}

.team-action-btn.primary{
  background: rgba(var(--hover-rgb), .16) !important;
  border-color: rgba(255,255,255,var(--outline-alpha)) !important;
}

.table-wrap,
.card{
  background: rgba(0,0,0,.42);
}

.table thead th,
.bench-header{
  border-bottom-color: rgba(255,255,255,.85) !important;
}

.pill,
.chip,
.badge{
  background: rgba(var(--hover-rgb), var(--chip-alpha)) !important;
  border: 1px solid rgba(255,255,255,var(--outline-alpha)) !important;
}

#benchBody > tr:hover{
  background: rgba(var(--hover-rgb), var(--hover-alpha)) !important;
}

#startersTable tbody tr:hover,
.notable-grid tbody tr:hover{
  background: rgba(var(--hover-rgb), var(--hover-alpha)) !important;
}

#startersTable tbody tr:hover > td,
.notable-grid tbody tr:hover > td{
  background: transparent !important;
}

#startersTable tbody td:hover,
.notable-grid tbody td:hover{
  background: transparent !important;
}

#indexPage :is(
  table tbody tr,
  .table tbody tr,
  .notable-grid tbody tr
):hover{
  background: rgba(var(--hover-rgb), var(--hover-alpha)) !important;
}

#indexPage :is(
  table tbody tr:hover > td,
  .table tbody tr:hover > td,
  .notable-grid tbody tr:hover > td
){
  background: transparent !important;
}

#indexPage :is(
  table tbody td:hover,
  .table tbody td:hover,
  .notable-grid tbody td:hover
){
  background: transparent !important;
}

body.team-page .team-actions button,
body.team-page .team-actions .team-action-btn,
body.team-page .team-actions a.team-action-btn,
body.team-page .team-actions a[role="button"]{
  background: rgba(0,0,0,0.35) !important;
  border: 1px solid rgba(255,255,255,0.40) !important;
  color: var(--text) !important;
  opacity: 1 !important;
  filter: none !important;
  transition: background 0.12s ease, border-color 0.12s ease, box-shadow 0.12s ease, transform 0.06s ease !important;
}

body.team-page .team-actions button:hover,
body.team-page .team-actions .team-action-btn:hover,
body.team-page .team-actions a.team-action-btn:hover,
body.team-page .team-actions a[role="button"]:hover,
body.team-page .team-actions button:focus-visible,
body.team-page .team-actions .team-action-btn:focus-visible,
body.team-page .team-actions a.team-action-btn:focus-visible,
body.team-page .team-actions a[role="button"]:focus-visible{
  background: rgba(var(--hover-rgb), 0.18) !important;
  border-color: rgba(var(--hover-rgb), 0.60) !important;
  box-shadow: 0 0 0 1px rgba(var(--hover-rgb), 0.25) !important;
}

body.team-page .team-actions button:active,
body.team-page .team-actions .team-action-btn:active,
body.team-page .team-actions a.team-action-btn:active,
body.team-page .team-actions a[role="button"]:active{
  transform: scale(0.98) !important;
}

/* ==================================================
   TEAM PAGE — BENCH SLOT PILL (kept)
================================================== */
.team-page .bench-size-wrap {
  background: #000000 !important;
  border-radius: 999px;
  padding: 4px 12px;
  border: 1px solid rgba(255,255,255,0.35);
  box-shadow: 0 6px 16px rgba(0,0,0,0.55);
}

.team-page .bench-size-wrap select {
  color: #ffffff !important;
}

.team-page .bench-size-wrap .bench-size-arrow {
  color: #ffffff !important;
}

.team-page .bench-size-wrap:hover {
  background: #000000 !important;
}

.team-page .bench-head .bench-size-ui {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
}

.team-page .bench-head .bench-size-wrap {
  background: #000000 !important;
  border-radius: 999px !important;
  padding: 4px 12px !important;
  border: 1px solid rgba(255,255,255,0.35) !important;
  box-shadow: 0 6px 16px rgba(0,0,0,0.55) !important;
}

.team-page .bench-head .bench-size-wrap select,
.team-page .bench-head .bench-size-wrap .bench-size-arrow {
  color: #ffffff !important;
}

/* =====================================================
   GLOW MASK — CARDS & TABLE CONTAINERS (kept)
===================================================== */
.card,
.table-wrap,
.starter-card,
.notable-card{
  background:
    linear-gradient(rgba(0,0,0,0.88), rgba(0,0,0,0.88)),
    rgba(255,255,255,0.01);
}

/* =====================================================
   SEGMENTED TOGGLE FORMATTING (kept)
===================================================== */
.segmented{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:6px !important;

  padding:4px !important;
  border-radius:999px !important;

  background: rgba(0,0,0,0.55) !important;
  border: 2px solid rgba(255,255,255,0.85) !important;
  box-shadow: 0 8px 20px rgba(0,0,0,0.28) !important;

  line-height:1 !important;
  text-shadow:none !important;
}

.segmented .seg-btn{
  appearance:none !important;
  -webkit-appearance:none !important;

  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;

  cursor:pointer !important;
  user-select:none !important;

  padding:7px 14px !important;
  border-radius:999px !important;

  font: inherit !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  letter-spacing: .10em !important;

  color:#ffffff !important;
  background: transparent !important;
  border: 0 !important;

  line-height:1 !important;
  text-shadow:none !important;
  box-shadow:none !important;

  transition: background .15s ease, box-shadow .15s ease, transform .06s ease !important;
}

.segmented .seg-btn:hover{
  background: rgba(255,255,255,0.10) !important;
}

.segmented .seg-btn:active{
  transform: scale(0.98) !important;
}

.segmented .seg-btn.active{
  background: #07621e !important;
  color:#ffffff !important;

  box-shadow:
    0 0 0 2px rgba(255,255,255,0.90),
    0 0 12px rgba(7,98,30,0.40) !important;

  text-shadow:none !important;
}

/* TEAM NAME — TARGETED GLOW ONLY (kept) */
.team-hero #teamTitle{
  position: relative;
  text-shadow:
    0 0 6px rgba(var(--team-a-rgb), 0.45),
    0 0 14px rgba(var(--team-a-rgb), 0.30),
    0 0 28px rgba(var(--team-a-rgb), 0.18),
    0 3px 8px rgba(0,0,0,0.45);
}

/* =====================================================
   TEAM PAGE: POS / PLAYER HEADER COLOR (SAFE, SCOPED)
   This only colors the POS/PLAYER header rows.
   It does NOT affect table body rectangles.
===================================================== */
body.team-page #startersTable thead th{
  background: linear-gradient(
    180deg,
    rgba(var(--section-header-rgb), .95),
    rgba(var(--section-header-rgb), .72)
  ) !important;
  border-bottom: 1px solid rgba(255,255,255,.85) !important;
}

body.team-page .bench-header{
  background: linear-gradient(
    180deg,
    rgba(var(--section-header-rgb), .95),
    rgba(var(--section-header-rgb), .72)
  ) !important;
  border-bottom: 1px solid rgba(255,255,255,.85) !important;
}

body.team-page .bench-header span{
  color:#ffffff !important;
  opacity:1 !important;
}

/* =====================================================
   TEAM PAGE — POS / PLAYER HEADER COLOR (STARTERS + BENCH)
   Pulls from TEAM_SECTION_HEADERS via script.js vars
===================================================== */

/* ---------- STARTERS ---------- */
body.team-page #startersTable thead th{
  background: linear-gradient(
    180deg,
    rgba(var(--section-header-bg-rgb), 0.95),
    rgba(var(--section-header-bg-rgb), 0.75)
  ) !important;

  color: #ffffff !important;
  border-bottom: 1px solid rgba(var(--section-header-border-rgb), 0.85) !important;
}

/* ---------- BENCH ---------- */
body.team-page #benchTable thead th{
  background: linear-gradient(
    180deg,
    rgba(var(--section-header-bg-rgb), 0.95),
    rgba(var(--section-header-bg-rgb), 0.75)
  ) !important;

  color: #ffffff !important;
  border-bottom: 1px solid rgba(var(--section-header-border-rgb), 0.85) !important;
}
/* =====================================================
   TEAM PAGE — GLOW/WASH ONLY ON THE PAGE BACKGROUND
   NO tables, player cards, table headers, or table titles
   may inherit team/glow color.  Everything stays neutral.
===================================================== */

/* Fallbacks (in case a team has no glow entry) */
:root{
  --glow-color: var(--hover-color);
  --glow-rgb: var(--hover-rgb);
}

/* 1) Page-level soft wash ONLY (behind everything) */
body.team-page{
  background:
    radial-gradient(
      900px 520px at 50% -10%,
      rgba(var(--glow-rgb), 0.22),
      transparent 60%
    ),
    radial-gradient(
      780px 520px at 50% 30%,
      rgba(var(--glow-rgb), 0.12),
      transparent 65%
    ),
    repeating-linear-gradient(
      45deg,
      rgba(255,255,255,.012),
      rgba(255,255,255,.012) 1px,
      transparent 1px,
      transparent 7px
    ),
    #060812 !important; /* locked neutral base (no team color mixing) */
}

/* 2) HARD RULE: all cards + table wrappers + tables must be neutral */
body.team-page .card,
body.team-page .starter-card,
body.team-page .notable-card,
body.team-page .player-card,
body.team-page .table-wrap,
body.team-page table,
body.team-page .table{
  background: rgba(0,0,0,0.88) !important;
  background-image: none !important;
  box-shadow: var(--shadow-soft) !important;
  filter: none !important;
  backdrop-filter: none !important;
}

/* 3) HARD RULE: no glow overlays on ANY containers that hold content */
body.team-page .card::before,
body.team-page .card::after,
body.team-page .starter-card::before,
body.team-page .starter-card::after,
body.team-page .notable-card::before,
body.team-page .notable-card::after,
body.team-page .player-card::before,
body.team-page .player-card::after,
body.team-page .table-wrap::before,
body.team-page .table-wrap::after,
body.team-page table::before,
body.team-page table::after,
body.team-page .table::before,
body.team-page .table::after{
  content: none !important;
  background: none !important;
  background-image: none !important;
}

/* 4) HARD RULE: table headers + titles can never tint */
body.team-page thead th,
body.team-page thead td,
body.team-page .table thead th,
body.team-page .table thead td,
body.team-page .table-title,
body.team-page .section-title,
body.team-page .section-header,
body.team-page h2,
body.team-page h3{
  background: rgba(0,0,0,0.88) !important;
  background-image: none !important;
  box-shadow: none !important;
  filter: none !important;
}

/* 5) HARD RULE: table body cells stay neutral, including hover */
body.team-page tbody tr,
body.team-page tbody td{
  background: rgba(0,0,0,0.38) !important;
  background-image: none !important;
  filter: none !important;
}

body.team-page tbody tr:hover,
body.team-page tbody td:hover{
  background: rgba(255,255,255,0.08) !important;
  background-image: none !important;
}

/* 6) Defensive: prevent accidental var-based overlays from clipping weirdly */
body.team-page table,
body.team-page th,
body.team-page td{
  background-clip: padding-box !important;
}

/* =====================================================
   TEAM PAGE — GLOW ONLY ON PAGE BACKGROUND
   NO tables, cards, headers, or titles inherit color
   Adds a faint bottom glow near footer
===================================================== */

/* Fallbacks (in case a team has no glow entry) */
:root{
  --glow-color: var(--hover-color);
  --glow-rgb: var(--hover-rgb);
}

/* 1) Page-level soft wash ONLY (top + middle + bottom) */
body.team-page{
  background:
    /* TOP glow */
    radial-gradient(
      900px 520px at 50% -10%,
      rgba(var(--glow-rgb), 0.50),
      transparent 70%
    ),

    /* MID subtle wash */
    radial-gradient(
      780px 520px at 50% 30%,
      rgba(var(--glow-rgb), 0.12),
      transparent 65%
    ),

    /* BOTTOM faint footer glow (NEW) */
    radial-gradient(
      900px 420px at 50% 110%,
      rgba(var(--glow-rgb), 0.50),
      transparent 70%
    ),

    /* texture */
    repeating-linear-gradient(
      45deg,
      rgba(255,255,255,.012),
      rgba(255,255,255,.012) 1px,
      transparent 1px,
      transparent 7px
    ),

    /* locked neutral base */
    #060812 !important;
}

/* 2) HARD RULE: all cards + table wrappers + tables stay neutral */
body.team-page .card,
body.team-page .starter-card,
body.team-page .notable-card,
body.team-page .player-card,
body.team-page .table-wrap,
body.team-page table,
body.team-page .table{
  background: rgba(0,0,0,0.88) !important;
  background-image: none !important;
  box-shadow: var(--shadow-soft) !important;
  filter: none !important;
  backdrop-filter: none !important;
}

/* 3) HARD RULE: no glow overlays on content containers */
body.team-page .card::before,
body.team-page .card::after,
body.team-page .starter-card::before,
body.team-page .starter-card::after,
body.team-page .notable-card::before,
body.team-page .notable-card::after,
body.team-page .player-card::before,
body.team-page .player-card::after,
body.team-page .table-wrap::before,
body.team-page .table-wrap::after,
body.team-page table::before,
body.team-page table::after,
body.team-page .table::before,
body.team-page .table::after{
  content: none !important;
  background: none !important;
}

/* 4) HARD RULE: section titles & table headers never tint */
body.team-page thead th,
body.team-page thead td,
body.team-page .table-title,
body.team-page .section-title,
body.team-page .section-header,
body.team-page h2,
body.team-page h3{
  background: rgba(0,0,0,0.88) !important;
  background-image: none !important;
  box-shadow: none !important;
  filter: none !important;
}

/* 5) Table body cells stay neutral */
body.team-page tbody tr,
body.team-page tbody td{
  background: rgba(0,0,0,0.38) !important;
  background-image: none !important;
}

body.team-page tbody tr:hover,
body.team-page tbody td:hover{
  background: rgba(255,255,255,0.08) !important;
}

/* 6) Defensive clipping */
body.team-page table,
body.team-page th,
body.team-page td{
  background-clip: padding-box !important;
}

/* FORCE “Feedback or Questions?” to not be bold (beats global link rules) */
header .dataset-toggle-wrap a.feedback-link,
header .dataset-toggle-wrap a.feedback-link span{
  font-weight: 400 !important;
}

/* =====================================================
   HOMEPAGE — MAKE TEAM CARDS' PERIMETER BORDER WHITE
   More pronounced, not lost in shadows
===================================================== */

/* Whole card perimeter */
body.home .starter-card{
  border: 2px solid rgba(255,255,255,0.85) !important;
  box-shadow: none !important;                 /* removes “shadow eats the border” look */
  background-clip: padding-box;
}

/* Optional: tighten the look so the header doesn't hide the border */
body.home .starter-card-head{
  border-bottom: 2px solid rgba(255,255,255,0.85) !important;
}

/* Optional: keep the body area crisp too */
body.home .starter-card-body{
  border-top: 0 !important;
}

/* =====================================================
   HOMEPAGE INDEX — FINAL POLISH PACK
   Purpose:
   • Strong white card perimeter (no shadow bleed)
   • Clean, consistent rounded cards
   • Solid team-color header (already handled in JS)
   • Improved header text readability
   • Tighter, more intentional mini-table layout
   • Subtle but premium hover behavior
   • Search bar styled to match UI
===================================================== */

/* ---------- CARD BASE ---------- */
body.home .starter-card{
  border: 2px solid rgba(255,255,255,0.85);
  border-radius: 18px;
  overflow: hidden;
  background: rgba(0,0,0,0.35);
  box-shadow: 0 10px 26px rgba(0,0,0,0.45);
  transition:
    transform 0.12s ease,
    box-shadow 0.12s ease,
    border-color 0.12s ease;
}

/* Hover lift */
body.home .starter-card:hover{
  transform: translateY(-2px);
  box-shadow: 0 16px 38px rgba(0,0,0,0.55);
  border-color: rgba(255,255,255,0.95);
}

/* ---------- CARD HEADER ---------- */
body.home .starter-card-head{
  position: relative;
  border-bottom: 2px solid rgba(255,255,255,0.85);
}

/* Readability veil over bright team colors */
body.home .starter-card-head::after{
  content:"";
  position:absolute;
  inset:0;
  background: rgba(0,0,0,0.18);
  pointer-events:none;
}

/* Team name text */
body.home .starter-card-title{
  position: relative;
  z-index: 1;
  text-shadow: 0 2px 10px rgba(0,0,0,0.45);
}

/* ---------- CARD BODY ---------- */
body.home .starter-card-body{
  background: rgba(0,0,0,0.40);
}

/* ---------- MINI LINEUP TABLE ---------- */
body.home .starters-mini{
  width: 100%;
  border-collapse: collapse;
}

body.home .starters-mini td{
  padding: 10px 12px;
  font-size: 15px;
}

/* POS column */
body.home .starters-mini td.pos{
  width: 54px;
  text-align: center;
  font-weight: 800;
  letter-spacing: 0.02em;
}

/* Player name */
body.home .starters-mini td.name{
  font-weight: 650;
}

/* Horizontal dividers */
body.home .starters-mini tbody tr:not(:last-child) td{
  border-bottom: 1px solid rgba(255,255,255,0.85);
}

/* ---------- VIEW ROSTER BUTTON ---------- */
body.home .starter-card .view-roster-btn{
  display: inline-flex;
  justify-content: center;
  align-items: center;
  margin-top: 12px;
  padding: 10px 14px;
  border-radius: 999px;
  font-weight: 700;
  border: 2px solid rgba(255,255,255,0.65);
  background: rgba(0,0,0,0.35);
  color: #fff;
  text-decoration: none;
  transition:
    background 0.12s ease,
    border-color 0.12s ease,
    transform 0.06s ease;
}

body.home .starter-card .view-roster-btn:hover{
  background: rgba(255,255,255,0.12);
  border-color: rgba(255,255,255,0.9);
  transform: translateY(-1px);
}

/* ---------- SEARCH BAR ---------- */
body.home #teamSearch.search-pop{
  border: 2px solid rgba(255,255,255,0.35);
  background: rgba(0,0,0,0.35);
  color: #fff;
  border-radius: 999px;
  padding: 12px 16px;
  width: min(520px, 88vw);
}

body.home #teamSearch.search-pop:focus{
  outline: none;
}

body.home #teamSearch.search-pop:focus-visible{
  border-color: rgba(255,255,255,0.75);
  box-shadow: 0 0 0 4px rgba(255,255,255,0.18);
}

/* =====================================================
   MOBILE POLISH — FINAL CONSOLIDATED BLOCK
   Applies ONLY to phones (≤ 640px)
===================================================== */
@media (max-width: 640px){

  /* Prevent horizontal scroll */
  html, body{
    overflow-x: hidden;
  }

  /* Slightly tighter page padding */
  .wrap{
    padding-left: 12px;
    padding-right: 12px;
  }

  /* =========================
     HEADER — tighten height
  ========================= */
  .site-header{
    padding-top: 8px !important;
    padding-bottom: 10px !important;
  }

  .site-header .header-row{
    gap: 8px !important;
  }

  /* Logo + brand */
  .site-logo{
    max-height: 48px !important;
  }

  .brand-text .logo{
    font-size: 18px !important;
  }

  /* Team dropdown */
  .team-jump{
    width:100% !important;
    margin-bottom: 4px !important;
  }

  .team-jump-btn{
    width: min(420px, 100%) !important;
    justify-content:center !important;
    padding:12px 44px 12px 16px !important;
    font-size:16px !important;
  }

  .team-jump-caret{
    right:18px !important;
    font-size:18px !important;
  }

  .team-jump-menu{
    width: min(420px, 92vw) !important;
    max-height: 52vh !important;
  }

  /* Arrow nav under dropdown (team pages only) */
  body.team-page .team-nav-arrows{
    margin-top: 2px !important;
  }

  body.team-page .team-nav-arrow{
    width:42px !important;
    height:28px !important;
    border-radius:14px !important;
  }

  /* =========================
     SETTINGS TOGGLE
  ========================= */
  .dataset-toggle-wrap{
    width:100%;
    max-width:420px;
  }

  .dataset-label{
    font-size:10px !important;
    margin-bottom:2px !important;
  }

  .segmented{
    width:100%;
  }

  .segmented .seg-btn{
    flex:1 1 50%;
    padding:10px 8px !important;
    font-size:13px !important;
  }

  /* =========================
     INDEX PAGE — cards
  ========================= */
  .starters-grid{
    display:grid;
    grid-template-columns: 1fr !important;
    gap:14px !important;
  }

  body.home .starter-card{
    border-radius:16px !important;
  }

  /* Stronger separation between card header/body */
  body.home .starter-card-head{
    border-bottom: 2px solid rgba(255,255,255,0.95) !important;
  }

  body.home .starter-card-title{
    font-size:20px !important;
  }

  body.home .starter-card-body{
    padding-top:6px !important;
  }

  /* View roster button — tap friendly */
  .view-roster-btn{
    width:100%;
    min-height:44px;
    font-size:15px;
    display:flex;
    align-items:center;
    justify-content:center;
  }

  /* Search bar */
  .search-pop{
    width: min(520px, 100%) !important;
  }

  /* =========================
     TEAM PAGES — layout
  ========================= */
  .team-layout{
    display:grid !important;
    grid-template-columns: 1fr !important;
    gap:14px !important;
  }

  .col, .col-full{
    width:100% !important;
  }

  /* Team action buttons */
  .team-actions{
    gap:10px !important;
  }

  .team-actions .team-action-btn,
  .team-actions button{
    width: min(520px, 100%);
    min-height:44px;
    font-size:15px;
  }

  .team-actions-hint{
    width: min(520px, 100%);
    font-size:12px;
    line-height:1.25;
    opacity:0.85;
  }

  /* Tables scroll safely */
  .table-wrap{
    overflow-x:auto;
    -webkit-overflow-scrolling: touch;
  }

  /* =========================
     BENCH TABLE — mobile
  ========================= */
  #benchBody{
    grid-template-columns: 1fr !important;
  }

  #benchTable thead tr{
    grid-template-columns: var(--pos-col, 54px) minmax(0, 1fr) !important;
  }

  #benchTable thead th:nth-child(3),
  #benchTable thead th:nth-child(4){
    display:none !important;
  }

  #benchBody > tr{
    border-bottom: 2px solid rgba(255,255,255,0.85) !important;
  }

  #benchBody > tr > td{
    padding:11px 12px !important;
  }

  /* Slightly smaller POS column on phones */
  :root{
    --pos-col: 48px;
    --row-pad-y: 9px;
  }
}

/* =====================================================
   MOBILE — CENTER TEAM NAV ARROWS UNDER DROPDOWN
   Team pages only
===================================================== */
@media (max-width: 640px){

  body.team-page .team-nav-arrows{
    display:flex !important;
    justify-content:center !important;   /* ⬅ hard center */
    align-items:center !important;
    width:100% !important;
    gap:12px !important;
    margin-left:0 !important;
    margin-right:0 !important;
  }

  body.team-page .team-nav-arrow{
    margin:0 !important;                 /* ⬅ remove stray offsets */
  }
}


@media (max-width: 640px){
  body.team-page .team-nav-arrows{
    max-width:420px;
  }
}

/* =========================================================
   MOBILE TEAM PAGE FIXES
   1) Left-align button text inside action buttons
   2) Left-align team name
   3) Force City on first line, Mascot on second line
========================================================= */

@media (max-width: 700px){

  /* ---------------------------------
     ACTION BUTTON TEXT ALIGNMENT
  ---------------------------------- */

  body.team-page .team-actions button,
  body.team-page .team-actions a,
  body.team-page .team-actions .team-action-btn{
    justify-content: flex-start !important;  /* left-align content */
    text-align: left !important;
    padding-left: 14px !important;           /* visual breathing room */
  }

  body.team-page .team-actions button span,
  body.team-page .team-actions a span{
    text-align: left !important;
    width: 100%;
  }

  /* ---------------------------------
     TEAM NAME CONTAINER
  ---------------------------------- */

  body.team-page .team-name,
  body.team-page .team-title,
  body.team-page .team-header{
    text-align: left !important;
    align-items: flex-start !important;
  }

  /* ---------------------------------
     CITY / MASCOT STACKING
     (City on top, Mascot below)
  ---------------------------------- */

  body.team-page .team-city{
    display: block !important;
    font-size: 18px !important;
    line-height: 1.05 !important;
    white-space: normal !important;
  }

  body.team-page .team-mascot{
    display: block !important;
    font-size: 22px !important;
    font-weight: 700 !important;
    line-height: 1.05 !important;
    margin-top: 2px;
    white-space: normal !important;
  }

  /* Fallback if city/mascot are in one element */
  body.team-page .team-name,
  body.team-page h1{
    white-space: normal !important;
    line-height: 1.1 !important;
  }
}

/* =========================================================
   MOBILE ONLY — HARD LEFT ALIGN
   Buttons + Team Name + City/Mascot
========================================================= */

@media (max-width: 700px){

  /* -------------------------------
     ACTION BUTTON CONTAINER
     Push content fully left
  -------------------------------- */

  body.team-page .team-actions,
  body.team-page .team-actions-wrap,
  body.team-page .team-page-actions,
  body.team-page .action-buttons{
    justify-content: flex-start !important;
    align-items: flex-start !important;
    padding-left: 6px !important;   /* minimal inset */
    padding-right: 6px !important;
    text-align: left !important;
  }

  /* -------------------------------
     ACTION BUTTONS
  -------------------------------- */

  body.team-page .team-actions button,
  body.team-page .team-actions a,
  body.team-page .team-actions .team-action-btn{
    justify-content: flex-start !important;
    text-align: left !important;
    padding-left: 10px !important;  /* text hugs left */
    padding-right: 10px !important;
    margin-left: 0 !important;
  }

  body.team-page .team-actions button span,
  body.team-page .team-actions a span{
    width: 100%;
    text-align: left !important;
  }

  /* -------------------------------
     TEAM NAME — HARD LEFT
  -------------------------------- */

  body.team-page .team-header,
  body.team-page .team-title,
  body.team-page .team-name{
    align-items: flex-start !important;
    justify-content: flex-start !important;
    text-align: left !important;
    padding-left: 6px !important;
  }

  /* -------------------------------
     CITY / MASCOT STACKING
  -------------------------------- */

  body.team-page .team-city{
    display: block !important;
    text-align: left !important;
    margin: 0 !important;
    line-height: 1.05 !important;
  }

  body.team-page .team-mascot{
    display: block !important;
    text-align: left !important;
    margin-top: 2px !important;
    line-height: 1.05 !important;
  }

  /* Fallback if name is a single element */
  body.team-page h1{
    text-align: left !important;
    white-space: normal !important;
    line-height: 1.1 !important;
    padding-left: 6px !important;
  }
}

/* =========================================================
   MOBILE LANDSCAPE ONLY
   Remove header to save vertical space
========================================================= */

@media (orientation: landscape) and (max-height: 480px){

  /* Hide the entire header */
  header,
  .site-header,
  #site-header{
    display: none !important;
  }

  /* Remove any leftover spacing caused by header */
  body{
    padding-top: 0 !important;
    margin-top: 0 !important;
  }

  /* If your main content wrapper expects header height */
  main,
  .main-content,
  #main{
    margin-top: 0 !important;
    padding-top: 0 !important;
  }
}

/* =====================================================
   HARD LOCK — MOBILE TEAM PAGE NAME ALIGNMENT
   City + Mascot ALWAYS left-justified
===================================================== */

@media (max-width: 700px){

  /* Force the entire team name area left */
  body.team-page .team-header,
  body.team-page .team-title,
  body.team-page .team-name{
    display: block !important;
    text-align: left !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 6px !important;
    padding-right: 0 !important;
  }

  /* Kill any flex centering applied above or below */
  body.team-page .team-header,
  body.team-page .team-title,
  body.team-page .team-name{
    justify-content: flex-start !important;
    align-items: flex-start !important;
  }

  /* City line */
  body.team-page .team-city{
    display: block !important;
    text-align: left !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1.05 !important;
    font-size: 15px !important;
    white-space: normal !important;
  }

  /* Mascot line */
  body.team-page .team-mascot{
    display: block !important;
    text-align: left !important;
    margin: 2px 0 0 0 !important;
    padding: 0 !important;
    line-height: 1.05 !important;
    font-size: 19px !important;
    font-weight: 700 !important;
    white-space: normal !important;
  }

  /* Absolute fallback if name is a single element */
  body.team-page h1{
    display: block !important;
    text-align: left !important;
    margin-left: 0 !important;
    padding-left: 6px !important;
    white-space: normal !important;
    line-height: 1.1 !important;
  }

  /* Prevent any child from re-centering */
  body.team-page .team-header *,
  body.team-page .team-title *,
  body.team-page .team-name *{
    text-align: left !important;
    justify-content: flex-start !important;
    align-items: flex-start !important;
  }
}

/* =====================================================
   MOBILE ONLY — HEADER LOGO SIZE
   Makes logo larger on phones without breaking layout
===================================================== */

@media (max-width: 700px){

  /* Logo image itself */
  .site-header .site-logo,
  header .site-logo,
  header img.logo,
  header img.site-logo{
    max-height: 80px !important;   /* ⬅ increase/decrease this number */
    height: auto !important;
    width: auto !important;
  }

  /* If logo sits inside a flex row, allow it room */
  .site-header .header-left,
  header .header-left{
    min-height: 64px !important;
    align-items: center !important;
  }
}

/* =========================================================
   MOBILE: FIX GOOFY TEAM-NAME RENDERING ON INDEX CARDS
   (Works even if the class name is different)
========================================================= */
@media (max-width: 768px){

  /* 1) Remove transform/filter effects from the card header area
        (common cause of jaggy / doubled text on mobile) */
  .team-card,
  .team-card *{
    filter: none !important;
  }

  /* If your team title sits inside a colored bar/header, this catches it */
  .team-card-header,
  .team-card .header,
  .team-card .title,
  .team-card .team-title,
  .team-card .team-name,
  .team-card h2,
  .team-card h3{
    transform: none !important;
    text-shadow: none !important;
    -webkit-text-stroke: 0 !important;
    paint-order: normal !important;
  }

  /* 2) Catch ANY element inside the team-card that might be the title
        by targeting the first big text block in the card */
  .team-card :is(h1,h2,h3,h4,.team-name,.team-title,.team-header,.card-title,.name){
    text-shadow: none !important;
    -webkit-text-stroke: 0 !important;
    transform: none !important;
    filter: none !important;
    letter-spacing: 0.2px !important;
  }

  /* 3) Mobile font rendering helpers (often fixes the “outlined wobble”) */
  .team-card :is(h1,h2,h3,h4,.team-name,.team-title,.team-header,.card-title,.name){
    -webkit-font-smoothing: antialiased !important;
    text-rendering: geometricPrecision !important;
  }
}

/* =========================================================
   MOBILE FIX: remove the blocky outlined team-name text (INDEX)
   Android Chrome hates multi-direction text-shadow outlines.
========================================================= */
@media (max-width: 768px){

  /* Target the FIRST header bar inside each team card on the index */
  .team-card > :first-child,
  .team-card .team-header,
  .team-card .team-name,
  .team-card .team-title,
  .team-card h2,
  .team-card h3{
    /* kill every outline technique */
    text-shadow: none !important;

    -webkit-text-stroke: 0px transparent !important;
    -webkit-text-stroke-width: 0px !important;
    -webkit-text-stroke-color: transparent !important;

    filter: none !important;
    transform: none !important;

    /* keep it crisp */
    letter-spacing: 0.3px !important;
  }

  /* If the outline is coming from pseudo-elements (common trick) */
  .team-card .team-header::before,
  .team-card .team-header::after,
  .team-card .team-name::before,
  .team-card .team-name::after,
  .team-card .team-title::before,
  .team-card .team-title::after{
    content: none !important;
    display: none !important;
  }
}





/* =====================================================
   END MOBILE POLISH
===================================================== */

/* INDEX fallback — any link/button that looks like a pill button */
body:not(.team-page) a[class*="btn"],
body:not(.team-page) button[class*="btn"],
body:not(.team-page) a[class*="button"],
body:not(.team-page) button[class*="button"]{
  box-shadow: inset 0 0 0 1px #fff !important;
  border: 1px solid #fff !important;
}

/* =====================================================
   INDEX (body#indexPage) — FORCE VIEW FULL ROSTER HOVER FILL
   Uses the per-card --hover-rgb that your index already sets inline
===================================================== */

body#indexPage article.starter-card .starter-card-body a.view-roster-btn{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:100% !important;

  margin-top:12px !important;
  padding:10px 14px !important;
  border-radius:999px !important;

  background: rgba(0,0,0,0.35) !important;
  border: 1px solid #ffffff !important;
  color: #ffffff !important;
  text-decoration:none !important;

  box-shadow: none !important;
  filter: none !important;
  opacity: 1 !important;

  transition: background 0.14s ease, border-color 0.14s ease, transform 0.08s ease !important;
}

body#indexPage article.starter-card .starter-card-body a.view-roster-btn:hover{
  background: rgba(var(--hover-rgb), 0.35) !important;
  border-color: rgba(var(--hover-rgb), 1) !important;
  color: #ffffff !important;
  transform: translateY(-1px) !important;
}

/* =====================================================
   BENCH SIZE DROPDOWN — STYLE ONLY WHEN MENU IS OPEN
   No pill hover change.  Only when select is focused/open.
===================================================== */

.bench-size-wrap select.bench-size-select{
  color: #fff;
  background: transparent;
}

/* ONLY when dropdown is opened (focused), not hover */
.bench-size-wrap select.bench-size-select:focus,
.bench-size-wrap select.bench-size-select:focus-visible{
  color: #000 !important;
  background: rgba(255,255,255,0.95) !important;
}

/* =====================================================
   BENCH SIZE DROPDOWN — SINGLE OUTER PILL BORDER ONLY
===================================================== */

body.team-page .bench-size-ui{
  border: 2px solid #fff !important;     /* thickness here */
  border-radius: 999px !important;
  background: rgba(0,0,0,0.35) !important;
  padding: 6px 10px !important;          /* keeps border from hugging text */
  display: inline-flex !important;
  align-items: center !important;
}

/* Inner wrapper: NO border */
body.team-page .bench-size-ui .bench-size-wrap{
  border: 0 !important;
  background: transparent !important;
}

/* Select: NO border (prevents the second outline) */
body.team-page .bench-size-ui select.bench-size-select{
  border: 0 !important;
  outline: none !important;
  box-shadow: none !important;
  background: transparent !important;
}

/* =====================================================
   BENCH SIZE DROPDOWN — FORCE A SINGLE WHITE PILL OUTLINE
   Border is owned by .bench-size-wrap (not the select).
===================================================== */

:root{
  --pill-border-w: 2px;            /* thickness control */
  --pill-border-c: rgba(255,255,255,1);
}

body.team-page .bench-size-ui{
  border: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.team-page .bench-size-ui .bench-size-wrap{
  border: var(--pill-border-w) solid var(--pill-border-c) !important;
  border-radius: 999px !important;
  background: rgba(0,0,0,0.35) !important;
  padding: 6px 10px !important;
  box-sizing: border-box !important;
  display: inline-flex !important;
  align-items: center !important;
}

/* Kill any inner borders that could create a second outline */
body.team-page .bench-size-ui .bench-size-wrap *{
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
}

body.team-page .bench-size-ui select.bench-size-select{
  background: transparent !important;
}

/* =====================================================
   BENCH SIZE DROPDOWN — TEXT ALWAYS WHITE
   Even immediately after selection (while still focused)
===================================================== */

body.team-page .bench-size-ui select.bench-size-select,
body.team-page .bench-size-ui select.bench-size-select:focus,
body.team-page .bench-size-ui select.bench-size-select:focus-visible{
  color: #ffffff !important;
  background: transparent !important;
}

/* =====================================================
   TEAM PAGE — ACTION BUTTON PILL BORDERS (WHITE)
   Excludes starter position pills (PG/SG/SF/PF/C)
===================================================== */

:root{
  --team-pill-border-w: 2px;   /* adjust thickness here */
  --team-pill-border-c: #ffffff;
  --team-pill-radius: 999px;
}

/* Target ONLY team page action buttons */
body.team-page .team-actions .team-action-btn,
body.team-page .team-actions button,
body.team-page .team-actions a.team-action-btn,
body.team-page .team-actions a[role="button"]{
  border: var(--team-pill-border-w) solid var(--team-pill-border-c) !important;
  border-radius: var(--team-pill-radius) !important;
  background: rgba(0,0,0,0.35) !important;
  box-shadow: none !important;
  outline: none !important;
}

/* Hover/focus polish (border stays white) */
body.team-page .team-actions .team-action-btn:hover,
body.team-page .team-actions button:hover{
  border-color: #ffffff !important;
}

/* Ensure starter POS pills are NOT affected */
body.team-page .starter-pos-wrap,
body.team-page .starter-pos-select{
  border: none !important;
  background: transparent !important;
}

/* =========================================================
   INDEX TEAM HEADER TEXT  |  SAFE DEPTH (NO MAC ARTIFACTS)
========================================================= */

body.home .starter-card-head .starter-card-title,
body.home .starter-card-head .starter-card-title .team-city,
body.home .starter-card-head .starter-card-title .team-mascot{
  /* clean base */
  filter: none !important;
  -webkit-text-stroke: 0 !important;
  paint-order: normal !important;
  mix-blend-mode: normal !important;
  transform: none !important;
  will-change: auto !important;

  /* SAFE shadow: single, crisp, no blur */
text-shadow:
  0 2px 0 rgba(0,0,0,0.70),
  0 -1px 0 rgba(255,255,255,0.12);

  /* mac stability */
  -webkit-font-smoothing: antialiased !important;
  -moz-osx-font-smoothing: grayscale !important;
  text-rendering: auto !important;

  letter-spacing: 0 !important;
}

/* keep glass effects on container, not text */
body.home .starter-card-head{
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

html, body{
  background: #000 !important;   /* true neutral base */
  background-color: #000 !important;
}

/* TEAM PAGES: keep your existing glow exactly as-is.
   This only forces a neutral black base behind everything (kills blue tint). */
html, body{
  background-color:#000 !important;
}

body.team-page{
  background-color:#000 !important;
}


/* =====================================================
   HEADER BLUE-HUE FIX (neutralize glass tint)
   Keeps blur, removes blue cast on some machines
===================================================== */

.site-header{
  position: relative;              /* needed for ::before overlay */
  background-color: rgba(0,0,0,0.60) !important; /* neutral base */
}

/* Neutral overlay ON TOP of the blur layer (kills blue tint) */
.site-header::before{
  content:"";
  position:absolute;
  inset:0;
  background: rgba(0,0,0,0.35);    /* adjust for more/less neutralization */
  pointer-events:none;
  z-index:0;
}

/* Keep header content above the overlay */
.site-header > *{
  position: relative;
  z-index:1;
}

/* =====================================================
   TEAM HEADER GLOW (CONSISTENT ON ALL COMPUTERS)
   SAME LOOK, but does NOT break dropdown menus.
   Key change: no overflow:hidden on the header.
===================================================== */

body.team-page .site-header{
  position: relative;        /* ensure pseudo element positioning */
  overflow: visible;         /* allow dropdown menu to escape */
}

/* Team glow layer (behind the neutral overlay) */
body.team-page .site-header::after{
  content:"";
  position:absolute;
  inset:-35px 0 0 0;         /* same bloom extension */
  pointer-events:none;

  /* Keep it behind header content and behind your ::before overlay */
  z-index: 0;

  background:
    radial-gradient(
      900px 260px at 50% 0%,
      rgba(var(--glow-rgb), 0.55),
      rgba(0,0,0,0) 68%
    ),
    radial-gradient(
      900px 260px at 50% 130%,
      rgba(var(--glow-rgb), 0.18),
      rgba(0,0,0,0) 75%
    );

  /* CONTAIN the glow visually without clipping children like dropdowns */
  clip-path: inset(0);
}

/* Ensure your existing neutral overlay stays above the glow */
body.team-page .site-header::before{
  z-index: 1;
}

/* Ensure header content (including the team jump dropdown) is above overlays */
body.team-page .site-header > *{
  position: relative;
  z-index: 2;
}

/* 2) When the row is hovered, apply ONE unified hover look */
/* IMPORTANT: let the later "painted inset" block control visuals */
:is(
  .player-row,
  .roster-row,
  .row,
  .table-row,
  tr,
  li
):has(
  :is(.player-name, .name, .player, .pos, .position)
):hover{
  background-color: transparent !important;
  box-shadow: none !important;
}


/* =========================================================
   UNIFORM PLAYER HOVER — ALL PAGES (INDEX + TEAM PAGES)
   One solid color.  No outlines.  No glow.  No blending.
========================================================= */

:root{
  /* Use your existing hover color if defined, else fallback orange */
  --hover-rgb: var(--hover-rgb, 255, 85, 0);

  /* Single, uniform hover fill */
  --player-hover-fill: rgba(var(--hover-rgb), 0.55);

  /* Text color on hover */
  --player-hover-text: #ffffff;
}

/* Apply hover ONLY at the row/cell level */
body :is(
  .player-row,
  .roster-row,
  .table-row,
  .row,
  tr,
  li
):hover{
  background: none !important;
  box-shadow: 0 0 0 9999px var(--player-hover-fill) inset !important;
  border-color: transparent !important;
}

/* Force NAME + POS + any inline elements to match exactly */
body :is(
  .player-row,
  .roster-row,
  .table-row,
  .row,
  tr,
  li
):hover :is(
  .player-name,
  .name,
  .player,
  .pos,
  .position,
  span,
  a
){
  color: var(--player-hover-text) !important;
  opacity: 1 !important;
  filter: none !important;
  text-shadow: none !important;
  -webkit-text-stroke: 0 !important;
}

/* =========================================================
   MATCH TEAM-PAGE HOVER ON INDEX TABLES
   Reason: index uses <td> surfaces that often have their own dark bg.
   Solution: paint <td> directly and neutralize any dark cell bg on hover.
========================================================= */

/* 1) Index mini-table cells: do NOT let the cell itself add extra dark tint */
body.home .starter-card .starters-mini td{
  background: transparent;
  background-color: transparent;
  box-shadow: none;
}

/* 2) Index hover: paint the *cells* (this is the visible surface) */
body.home .starter-card .starters-mini tbody tr:hover > td{
  /* Use the SAME variable you already set per card: --hover-rgb */
  background-color: rgba(var(--hover-rgb, 255, 85, 0), 0.55) !important;

  /* Prevent “black added” look from other effects */
  background-image: none !important;
  box-shadow: none !important;
  filter: none !important;
  opacity: 1 !important;
}

/* 3) Your index adds white bottom borders between rows.
      On hover, make those borders stop muting the hover color. */
body.home .starter-card .starters-mini tbody tr:hover > td{
  border-bottom-color: rgba(var(--hover-rgb, 255, 85, 0), 0.55) !important;
}

/* 4) Text: force POS + NAME to match, just like team pages */
body.home .starter-card .starters-mini tbody tr:hover :is(td.pos, td.name, span, a){
  color: #fff !important;
  text-shadow: none !important;
  filter: none !important;
  -webkit-text-stroke: 0 !important;
}

/* =====================================================
   FIX: INDEX HOVER SHOULD MATCH TEAM PAGE HOVER
   Reason: later #indexPage rules were forcing TD backgrounds transparent,
   and a global TR hover inset was darkening the layer underneath.
===================================================== */

/* 1) On the index, do NOT force hovered cells transparent.  Paint the TDs. */
body#indexPage #startersGrid .starter-card .table.starters-mini tbody tr:hover > td{
  background: rgba(var(--hover-rgb), 0.30) !important; /* adjust strength here */
}

/* 2) On the index only, disable the universal "9999px inset" hover trick */
body#indexPage :is(table tbody tr, .table tbody tr, .notable-grid tbody tr):hover{
  box-shadow: none !important;
}

/* 3) Safety: if any old index rules still try to blank the cells, override them */
body#indexPage :is(
  table tbody tr:hover > td,
  .table tbody tr:hover > td,
  .notable-grid tbody tr:hover > td
){
  background: rgba(var(--hover-rgb), 0.30) !important;
}

/* =====================================================
   DRAG HANDLE — HARD OVERRIDE (ALWAYS WINS)
   Single source of truth across ALL pages
===================================================== */

:root{
  --dnd-handle-border-w: 1.75px;                 /* thickness */
  --dnd-handle-border-c: rgba(255,255,255,0.95); /* color */
  --dnd-handle-bg: rgba(0,0,0,0.55);
}

/* Pseudo-element drag handle (your ⠿ icon) */
html body td.dnd-namecell::after{
  content: "⠿" !important;

  border: var(--dnd-handle-border-w) solid var(--dnd-handle-border-c) !important;
  background: var(--dnd-handle-bg) !important;

  border-radius: 10px !important;
  opacity: 1 !important;

  box-shadow:
    0 0 0 1px rgba(255,255,255,0.25),
}

/* =========================================================
   FIX: HONORABLE MENTIONS TILE MUST FILL FULL WIDTH
   Cause in your CSS:
   - HM rows have padding: 0 6px
   - HM background is drawn on tr::before with left/right: 6px
   That creates the unfilled edge strip.
========================================================= */

body.team-page .table.notable-grid tbody#notableBody tr{
  padding: 0 !important;                 /* remove the inset that creates the strip */
  background: rgba(0,0,0,0.38) !important; /* neutral base like your other rows */
  overflow: hidden !important;
}

/* Disable the inset background layer entirely */
body.team-page .table.notable-grid tbody#notableBody tr::before{
  content: none !important;
  display: none !important;
}

/* Paint the full tile on hover (entire row box, not an inset) */
body.team-page .table.notable-grid tbody#notableBody tr:hover{
  background: rgba(var(--hover-rgb), 0.30) !important;
}

/* Keep cells transparent so the row background shows as one solid tile */
body.team-page .table.notable-grid tbody#notableBody tr > td{
  background: transparent !important;
}

/* =====================================================
   FINAL FIX: COMPENSATE FOR 2px BENCH SIZE PILL BORDER
   Keeps the border, prevents row shift
===================================================== */

body.team-page .bench-size-ui .bench-size-wrap{
  margin-top: -5px !important;
}