/*
Theme Name: CourtDepth
Theme URI: https://courtdepth.com
Author: Dijohn
Description: CourtDepth v2 — Automated NBA depth charts with live salary, rotation & injury data. Zero Google Sheets required.
Version: 2.0.0
Requires at least: 6.0
Tested up to: 6.6
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: courtdepth
Tags: dark, sports, data, responsive, accessibility-ready
*/
:root{
  --bg:#0E0F13;
  --surface:#16181F;
  --border:#232632;
  --text-hi:#E8ECF3;
  --text-mid:#AAB1C2;
  --text-lo:#7C8294;
  --teal:#00D0C3;
  --violet:#8B7CFF;
  --amber:#FFC24D;
  --red:#FF6B6B;
}
body{background:var(--bg);color:var(--text-hi);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif}
a{color:var(--teal);text-decoration:none}
a:hover{text-decoration:underline}

/* basic layout helpers */
.container{max-width:1200px;margin:0 auto;padding:1rem}
.card{background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:16px}
.grid{display:grid;gap:12px}
.grid-5{grid-template-columns:repeat(5,minmax(0,1fr))}
.grid-1{grid-template-columns:1fr}
@media(max-width:960px){.grid-5{grid-template-columns:1fr}}

/* badges */
.badge{display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:4px 8px;font-size:12px;border:1px solid transparent}
.badge--starter{background:color-mix(in oklab, var(--teal) 15%, transparent);color:color-mix(in oklab, var(--teal) 80%, white 20%)}
.badge--rotation{border-color:color-mix(in oklab, var(--violet) 40%, transparent);color:color-mix(in oklab, var(--violet) 80%, white 10%)}
.badge--bench{border-color:var(--border);color:var(--text-mid)}
.badge--gleague{border-color:color-mix(in oklab, var(--amber) 40%, transparent);color:var(--amber)}
.badge--full{background:rgba(255,255,255,.04);color:var(--text-mid)}
.badge--twoway{background:repeating-linear-gradient(45deg, rgba(0,208,195,.15), rgba(0,208,195,.15) 6px, rgba(0,208,195,.05) 6px, rgba(0,208,195,.05) 12px);color:#BEFEF6}
.badge--10day{border:1px dotted var(--border);color:var(--text-mid)}
.badge--ex10{border:1px dashed var(--border);color:var(--text-mid)}

/* general UI */
.row{display:flex;align-items:center;justify-content:space-between;gap:12px}
.mono{font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace}
.subtle{color:var(--text-mid);font-size:12px}
.hr{height:1px;background:var(--border);margin:12px 0}
.btn{background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:6px 10px;color:var(--text-hi)}
.btn:hover{background:#1b1e27}
.header{position:sticky;top:0;background:color-mix(in oklab, var(--bg) 92%, transparent);backdrop-filter:saturate(120%) blur(6px);border-bottom:1px solid var(--border);z-index:10}
.team-carousel{display:flex;gap:8px;overflow:auto;padding:6px 0}
.team-chip{background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:6px 12px;white-space:nowrap}
.team-chip.active{background:color-mix(in oklab, var(--teal) 12%, var(--surface));color:var(--teal);border-color:color-mix(in oklab, var(--teal) 40%, var(--border))}

/* player cards */
.player-card{background:#1b1e27;border:1px solid var(--border);border-radius:14px;padding:12px;cursor:pointer}
.player-card:hover{border-color:color-mix(in oklab, var(--teal) 40%, var(--border))}
.mbar{height:12px;background:#0E0F13;border-radius:6px;position:relative;overflow:hidden}
.mbar .season{position:absolute;left:0;top:0;bottom:0;background:color-mix(in oklab, var(--teal) 40%, #0E0F13);}
.mbar .twofourty{position:absolute;left:0;top:2px;height:2px;background:color-mix(in oklab, var(--teal) 80%, white 5%);}

/* ==== Minutes meter heat effects (brand-safe, lightweight) ==== */

/* Base tweaks (keep your current definitions as-is) */
.mbar{ position:relative; overflow:hidden; }
.mbar .season{ transition: transform .25s ease, filter .25s ease; }
.mbar .twofourty{ transition: opacity .25s ease; }

/* --- Inferno (hot): warm edge glow + soft flicker + ember specks --- */
.mbar.is-hot{
  box-shadow: inset 0 0 0 1px rgba(255,140,0,.20), 0 0 14px rgba(255,140,0,.16);
}
.mbar.is-hot .season{
  background: linear-gradient(90deg,
    color-mix(in oklab, var(--teal) 65%, #FFC24D 35%),
    color-mix(in oklab, #FF6B6B 35%, var(--teal) 15%)
  );
}
.mbar.is-hot::before,
.mbar.is-hot::after{
  content:""; position:absolute; inset:-20% -10% -30% -10%; pointer-events:none;
}
.mbar.is-hot::before{
  /* subtle orange plume that flickers */
  background: radial-gradient(120% 60% at 50% 120%, rgba(255,140,0,.18), transparent 60%);
  animation: cd-heat-flicker 1.9s ease-in-out infinite;
  mix-blend-mode: screen;
}
.mbar.is-hot::after{
  /* tiny ember specks drifting right */
  background:
    radial-gradient(3px 3px at 12% 80%, rgba(255,200,120,.35) 0 60%, transparent 65%) ,
    radial-gradient(2px 2px at 32% 65%, rgba(255,170,90,.35) 0 60%, transparent 65%) ,
    radial-gradient(2.5px 2.5px at 68% 78%, rgba(255,170,90,.30) 0 60%, transparent 65%) ,
    radial-gradient(2px 2px at 85% 60%, rgba(255,220,140,.25) 0 60%, transparent 65%);
  animation: cd-embers 6s linear infinite;
  opacity:.7; mix-blend-mode: screen;
}

/* --- Freeze (cold): cool glow + icy striation + drifting snow --- */
.mbar.is-cold{
  box-shadow: inset 0 0 0 1px rgba(120,210,255,.20), 0 0 14px rgba(120,210,255,.14);
}
.mbar.is-cold .season{
  background: linear-gradient(90deg,
    color-mix(in oklab, var(--teal) 80%, white 0%),
    color-mix(in oklab, #7FDBFF 55%, var(--teal) 35%)
  );
  filter: saturate(1.05);
}
.mbar.is-cold::before{
  content:""; position:absolute; inset:-2px; pointer-events:none;
  /* faint frosty diagonal texture */
  background:
    repeating-linear-gradient(135deg, rgba(160,210,240,.10) 0 8px, transparent 8px 16px),
    radial-gradient(120% 100% at 50% -30%, rgba(150,230,255,.16), transparent 60%);
  animation: cd-frost-drift 8s linear infinite;
  mix-blend-mode: screen;
}
.mbar.is-cold::after{
  content:""; position:absolute; inset:-10% -5%; pointer-events:none;
  /* drifting micro snow */
  background:
    radial-gradient(2px 2px at 20% 30%, rgba(220,245,255,.30) 0 60%, transparent 65%),
    radial-gradient(1.8px 1.8px at 55% 10%, rgba(220,245,255,.28) 0 60%, transparent 65%),
    radial-gradient(2.2px 2.2px at 80% 40%, rgba(220,245,255,.26) 0 60%, transparent 65%),
    radial-gradient(2px 2px at 35% 75%, rgba(220,245,255,.22) 0 60%, transparent 65%);
  animation: cd-snow 9s linear infinite;
  opacity:.75; mix-blend-mode: screen;
}

/* Keep the 240 stripe readable over effects */
.mbar.is-hot .twofourty,
.mbar.is-cold .twofourty{
  opacity:.9;
}

/* --- Animations (very lightweight) --- */
@keyframes cd-heat-flicker{
  0%{ opacity:.35; transform: translateY(0) }
  45%{ opacity:.55; transform: translateY(-1px) }
  100%{ opacity:.35; transform: translateY(0) }
}
@keyframes cd-embers{
  0%{ transform: translateX(-6%); opacity:.75 }
  50%{ opacity:.85 }
  100%{ transform: translateX(6%); opacity:.75 }
}
@keyframes cd-frost-drift{
  0%{ background-position: 0 0, 0 0 }
  100%{ background-position: 24px 24px, 0 0 }
}
@keyframes cd-snow{
  0%{ transform: translateY(-2%); opacity:.70 }
  50%{ transform: translateY(2%); opacity:.80 }
  100%{ transform: translateY(-2%); opacity:.70 }
}

/* Respect accessibility preferences */
@media (prefers-reduced-motion: reduce){
  .mbar.is-hot::before,
  .mbar.is-hot::after,
  .mbar.is-cold::before,
  .mbar.is-cold::after{ animation: none !important; }
}

/* ===== Minute bar: always-visible 240 rail ===== */
.mbar{
  position: relative;
  isolation: isolate;              /* own stacking context */
  height: 12px;
  border-radius: 8px;
  overflow: visible;               /* let glow breathe */
  background: #0E0F13;
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.06),
    inset 0 -1px 0 rgba(0,0,0,.35);
}

/* season fill stays under everything */
.mbar .season{
  position: absolute; left:0; top:0; bottom:0;
  border-radius: 8px 0 0 8px;
  z-index: 1;
}

/* 240 rail sits ABOVE heat/frost and above season fill */
.mbar .twofourty{
  position: absolute; left:0; top:50%;
  transform: translateY(-50%);
  height: 4px;                     /* thicker so it’s readable */
  border-radius: 999px;
  z-index: 3;
  background:
    linear-gradient(90deg,
      color-mix(in oklab, var(--teal) 92%, white 8%),
      color-mix(in oklab, var(--teal) 60%, black 0%)
    );
  box-shadow:
    0 0 6px rgba(0,208,195,.55),
    0 0 0 1px rgba(0,0,0,.55) inset; /* edge contrast on any bg */
}

/* ===== Heat/Frost effects kept UNDER the bars ===== */
.mbar.is-hot::before,
.mbar.is-cold::before{
  content:"";
  position:absolute; inset:-1px;
  border-radius:8px;
  pointer-events:none;
  z-index:0;                       /* sits below .season and .twofourty */
}

/* Inferno vibe for high minutes */
.mbar.is-hot::before{
  background:
    radial-gradient(120% 100% at 0% 50%, rgba(255,110,20,.35), transparent 60%),
    radial-gradient(120% 100% at 100% 50%, rgba(255,70,20,.25), transparent 60%),
    linear-gradient(180deg, rgba(255,160,40,.20), rgba(255,60,0,.08));
  box-shadow:
    0 0 16px rgba(255,95,0,.35),
    inset 0 0 24px rgba(255,120,40,.22);
  animation: cd-flicker 1.8s ease-in-out infinite alternate;
}

/* Frost vibe for low minutes */
.mbar.is-cold::before{
  background:
    radial-gradient(140% 120% at 10% 30%, rgba(160,240,255,.28), transparent 60%),
    radial-gradient(120% 100% at 90% 70%, rgba(120,220,255,.22), transparent 55%),
    linear-gradient(180deg, rgba(120,200,255,.10), rgba(0,40,80,.06));
  box-shadow:
    0 0 16px rgba(120,220,255,.25),
    inset 0 0 22px rgba(160,240,255,.18);
  animation: cd-shiver 2.2s ease-in-out infinite alternate;
}

/* subtle movement */
@keyframes cd-flicker{
  from{ filter: saturate(1.0) brightness(1.0); }
  to{   filter: saturate(1.2) brightness(1.08); }
}
@keyframes cd-shiver{
  from{ transform: translateY(-50%) scaleY(1); }
  to{   transform: translateY(-50.5%) scaleY(1.02); }
}

/* Optional: improve contrast on very small bars */
.mbar .twofourty[style*="width:0%"],
.mbar .twofourty[style*="width:1%"],
.mbar .twofourty[style*="width:2%"]{
  height: 5px;
}

/* --- Fix cold backing alignment (no offsets, no translate) --- */
.mbar{
  overflow: hidden;         /* clip effects to the rail */
  position: relative;
  isolation: isolate;
}

.mbar.is-hot::before,
.mbar.is-cold::before{
  content:"";
  position:absolute;
  inset:0;                  /* perfectly aligned to .mbar */
  border-radius: inherit;   /* follow rail radius */
  pointer-events:none;
  z-index:0;                /* keep under fills/rail */
}

/* (unchanged) HOT look — keep if you like */
.mbar.is-hot::before{
  background:
    radial-gradient(120% 100% at 0% 50%, rgba(255,110,20,.35), transparent 60%),
    radial-gradient(120% 100% at 100% 50%, rgba(255,70,20,.25), transparent 60%),
    linear-gradient(180deg, rgba(255,160,40,.20), rgba(255,60,0,.08));
  box-shadow:
    0 0 16px rgba(255,95,0,.35),
    inset 0 0 24px rgba(255,120,40,.22);
  animation: cd-flicker 1.8s ease-in-out infinite alternate;
}

/* NEW: COLD look — aligned, subtle flow via background-position */
.mbar.is-cold::before{
  background:
    radial-gradient(140% 120% at 12% 35%, rgba(160,240,255,.26), transparent 60%),
    radial-gradient(120% 100% at 88% 65%, rgba(120,220,255,.20), transparent 55%),
    linear-gradient(180deg, rgba(120,200,255,.10), rgba(0,40,80,.06));
  background-size: 160% 100%, 160% 100%, 100% 100%;
  background-position: 0 0, 100% 0, 0 0;
  box-shadow:
    0 0 16px rgba(120,220,255,.22),
    inset 0 0 22px rgba(160,240,255,.16);
  animation: cd-iceflow 6s linear infinite;  /* no translate, stays aligned */
}

/* replace old cd-shiver with this */
@keyframes cd-iceflow{
  0%   { background-position:   0% 0, 100% 0, 0 0; filter: brightness(1)   saturate(1.0); }
  50%  { background-position: -30% 0,  80% 0, 0 0; filter: brightness(1.04) saturate(1.06); }
  100% { background-position: -60% 0,  60% 0, 0 0; filter: brightness(1)   saturate(1.0); }
}

/* Keep the 240 rail above everything */
.mbar .season{ z-index:1; }
.mbar .twofourty{
  z-index:3;
  position:absolute; left:0; top:50%;
  transform: translateY(-50%);
  height:4px; border-radius:999px;
  background: linear-gradient(90deg,
    color-mix(in oklab, var(--teal) 92%, white 8%),
    color-mix(in oklab, var(--teal) 60%, black 0%)
  );
  box-shadow: 0 0 6px rgba(0,208,195,.55), inset 0 0 0 1px rgba(0,0,0,.55);
}


/* 240 bar */
.twobar{height:24px;border-radius:10px;display:flex;overflow:hidden;border:1px solid var(--border)}
.twobar span{display:block;height:100%;border-right:1px solid rgba(255,255,255,.07)}

/* tables */
.table{width:100%;border-collapse:collapse}
.table th,.table td{padding:10px;border-bottom:1px solid var(--border);text-align:left}
.table th{color:var(--text-mid);font-weight:600}
footer{border-top:1px solid var(--border);color:var(--text-mid);font-size:12px}

/* layout fixes */
*, *::before, *::after { box-sizing: border-box; }
.grid > * { min-width: 0; }
.grid-1 > * { min-width: 0; }
.row > * { min-width: 0; }
.player-card { display: block; width: 100%; max-width: 100%; }
.card { overflow: hidden; }
.player-card .subtle, .player-card .mono, .player-card { overflow-wrap:anywhere; word-break:break-word; }
.col-stack { display:flex; flex-direction:column; gap:12px; }

/* badge layout + visuals */
.badge{ white-space:nowrap; word-break:normal; overflow-wrap:normal; line-height:1.1; padding:4px 10px; border-radius:999px; border:1px solid transparent; background-clip:padding-box; }
.player-card .row .badge{ max-width:none; }
.player-card{ overflow-wrap:normal; word-break:normal; }
.player-card .notes{ overflow-wrap:anywhere; word-break:break-word; }

/* card header */
.card-head{ display:flex; align-items:flex-start; justify-content:space-between; gap:8px; }
.card-head .title{ min-width:0; }
.badge-group{ display:flex; flex-direction:column; align-items:flex-end; gap:6px; flex-shrink:0; }

@media (max-width: 420px){
  .badge{ padding:3px 8px; font-size:12px; }
  .badge-group{ gap:4px; }
}

/* IR toggle + injury look */
.btn-ir-on { border-color: rgba(255,107,107,.35); color: #FF6B6B; }
.badge--out{ background: rgba(255,107,107,.10); color:#FF6B6B; border:1px solid rgba(255,107,107,.35); }
.player-card.is-ir{ opacity:.72; }

/* 240 bar + chips */
.twobar{ display:flex; gap:0; height:14px; border-radius:999px; background: color-mix(in oklab, var(--surface) 92%, black); overflow:hidden; }
.twobar span{ display:block; height:100%; }
.cd-chip{ display:inline-flex; align-items:center; padding:4px 10px; border-radius:999px; font-size:12px; line-height:1.1; color:var(--text-hi); margin-bottom:6px; }
.btn-active{ border-color: var(--teal); color: var(--teal); }

/* search dropdown */
.cd-searchwrap{ position: relative; }
.cd-suggest{ position:absolute; left:0; right:0; top:36px; z-index:1000; background:var(--surface); border:1px solid var(--border); border-radius:12px; padding:6px; box-shadow:0 12px 28px rgba(0,0,0,.35); }
.cd-suggest-item{ display:flex; justify-content:space-between; align-items:center; width:100%; border:0; background:transparent; color:var(--text-hi); padding:8px 10px; border-radius:8px; cursor:pointer; text-align:left; }
.cd-suggest-item:hover,.cd-suggest-item.is-active{ background: color-mix(in oklab, var(--surface) 90%, black); }
.cd-sg-main{ pointer-events:none; }
.cd-type-tag{ pointer-events:none; font-size:12px; opacity:.7; }

/* team list pills */
.team-list{ display:flex; flex-wrap:wrap; gap:12px 14px; }
.team-pill{ display:inline-flex; align-items:center; gap:10px; background: var(--surface); border:1px solid var(--border); border-radius:999px; padding:8px 12px; text-decoration:none; color: var(--text-hi); transition:border-color .15s ease, transform .05s ease; }
.team-pill:hover{ border-color: var(--teal); }
.team-pill:active{ transform: translateY(1px); }
.team-pill img{ width:28px; height:28px; border-radius:50%; display:block; flex:0 0 28px; }

/* responsive tweaks */
@media (max-width: 1100px) and (min-width: 721px){
  .grid.grid-5{ grid-template-columns: repeat(3, minmax(0,1fr)); }
}
@media (max-width: 720px){
  .header .container .row{ flex-wrap: wrap; row-gap: 8px; }
  #cd-search{ order: 2; width: 100%; }
  #cd-search .cd-searchwrap, #cd-search input{ width: 100%; }
  .card > .row{ flex-wrap: wrap; gap: 8px; align-items: center; }
  .card > .row h1{ flex: 1 1 100%; margin-bottom: 4px; font-size: 26px; line-height: 1.15; }
  .card > .row h1 ~ div{ display:flex; gap:8px; flex-wrap:wrap; width:100%; }
  .btn{ padding:6px 10px; font-size:13px; }
  .twobar{ height:12px; }
  .cd-chip{ font-size:11px; padding:3px 8px; margin-bottom:6px; }
  .grid.grid-5{ grid-template-columns: repeat(2, minmax(0,1fr)); }
  .grid > *{ min-width: 0; }
  .col-stack{ gap:10px; }
  .player-card{ padding:12px; }
  .card-head{ gap:8px; }
  .badge-group{ gap:4px; }
  .badge{ padding:3px 8px; font-size:12px; line-height:1.1; }
  .player-card .mbar{ height:8px; }
  .player-card .row{ column-gap:8px; }
  .card > div[style*="overflow:auto"]{ -webkit-overflow-scrolling: touch; }
  .table{ font-size:14px; min-width:560px; }
}
@media (max-width: 520px){
  .grid.grid-5{ grid-template-columns: 1fr; }
  .card > .row h1{ font-size: 24px; }
}

/* starter glow */
.player-card.is-starter{ border-color: rgba(0,208,195,.65); box-shadow: 0 0 0 1px rgba(0,208,195,.45), 0 0 18px rgba(0,208,195,.30); }
.player-card.is-starter:hover,.player-card.is-starter:focus{ border-color: rgba(0,208,195,.9); box-shadow: 0 0 0 1px rgba(0,208,195,.7), 0 0 24px rgba(0,208,195,.45), 0 0 36px rgba(0,208,195,.25); }
.player-card.is-ir.is-starter{ box-shadow:none; border-color: rgba(255,107,107,.35); opacity:.72; }

/* news feed */
.news-list{ list-style:none; margin:0; padding:0; display:grid; gap:10px; }
.news-item{ display:flex; flex-direction:column; gap:4px; padding:8px 0; border-bottom:1px dashed var(--border); }
.news-item:last-child{ border-bottom:0; }
.news-title{ color:var(--text-hi); text-decoration:none; }
.news-title:hover{ color:var(--teal); text-decoration:underline; }
.news-meta{ font-size:12px; color:var(--text-mid); }

/* ads */
.cd-ad-wrap{ margin:20px 0; display:flex; justify-content:center; }
.cd-ad-wrap ins.adsbygoogle{}

/* contract badges (unique looks) */
.badge--wrap{ white-space:normal; line-height:1.05; text-align:center; min-width:56px; padding-block:6px; overflow-wrap:anywhere; }
.badge--rookie{ color:#FFD54F; background: rgba(255,213,79,.14); border:1px solid rgba(255,213,79,.45); box-shadow: inset 0 0 0 1px rgba(255,213,79,.12); }
.badge--rookieext{ color:#FFD54F; background: repeating-linear-gradient(135deg, rgba(255,213,79,.22) 0 8px, rgba(255,213,79,.10) 8px 16px); border:1px solid rgba(255,213,79,.45); }
.badge--veteran{ color:#A782FF; background: rgba(167,130,255,.14); border:1px solid rgba(167,130,255,.45); box-shadow: inset 0 0 0 1px rgba(167,130,255,.12); }
.badge--vetext{ color:#A782FF; background: repeating-linear-gradient(135deg, rgba(167,130,255,.22) 0 8px, rgba(167,130,255,.10) 8px 16px); border:1px solid rgba(167,130,255,.45); }
.badge--twoway.badge--wrap{ white-space:normal; }

/* show badges nicely in tables */
.table .badge{ display:inline-flex; vertical-align:middle; }

/* ===== Team metrics strip (compact, teal accents, 12px) ===== */
.team-metrics{
  margin-top:10px;
  display:grid;
  gap:8px;
  grid-template-columns: repeat(3, minmax(0,1fr));
}
@media (max-width: 860px){
  .team-metrics{ grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 520px){
  .team-metrics{ grid-template-columns: 1fr; }
}
.tm-item{
  background: color-mix(in oklab, var(--surface) 94%, black);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 8px 10px;
  position: relative;
}
.tm-item.pos{ border-color: color-mix(in oklab, var(--teal) 40%, var(--border)); }
.tm-item.pos::before{
  content:""; position:absolute; left:0; top:0; bottom:0; width:3px;
  background: color-mix(in oklab, var(--teal) 70%, transparent);
  border-top-left-radius:10px; border-bottom-left-radius:10px;
}
.tm-item.neg{ border-color: color-mix(in oklab, var(--red) 40%, var(--border)); }
.tm-item.neg::before{
  content:""; position:absolute; left:0; top:0; bottom:0; width:3px;
  background: color-mix(in oklab, var(--red) 70%, transparent);
  border-top-left-radius:10px; border-bottom-left-radius:10px;
}
.tm-label{
  font-size: 12px;                 /* same size as “at a glance” */
  color: var(--text-mid);
  letter-spacing: .02em;
}
.tm-val{
  margin-top: 2px;
  font-size: 12px;                 /* same size */
  font-weight: 600;
  color: var(--text-hi);
}
.tm-val.pos{ color: var(--teal); }
.tm-val.neg{ color: var(--red); }
.tm-sub{
  font-weight: 500;
  color: var(--text-mid);
  margin-left: 4px;
}

/* mobile header/hero tidy */
@media (max-width: 800px){
  .header .container.row{ display:grid !important; grid-template-columns:1fr !important; row-gap:8px !important; align-items:stretch !important; }
  .header .container.row > .row:first-child{ display:flex !important; flex-wrap:wrap !important; gap:6px !important; }
  .header .container.row > .row:first-child > a{ font-size:18px; line-height:1.1; }
  .header .container.row > .row:first-child > nav.team-carousel{ order:2; flex:1 1 100% !important; width:100% !important; overflow-x:auto !important; white-space:nowrap !important; -webkit-overflow-scrolling:touch; padding-bottom:2px; scrollbar-width:thin; }
  .header .team-carousel .team-chip{ display:inline-block; margin-right:8px; white-space:nowrap; }
  .header .container.row > .row:nth-child(2){ display:flex !important; gap:8px !important; width:100% !important; }
  #cd-search{ flex: 1 1 auto; width:100%; }
  #cd-search .cd-searchwrap, #cd-q{ width:100%; }
  #cd-prev-team, #cd-next-team{ flex:0 0 auto; min-width:40px; padding:6px 10px; }
  .card:first-of-type > .row{ display:flex !important; flex-wrap:wrap !important; gap:8px !important; align-items:center; }
  .card:first-of-type > .row > h1{ flex:1 1 100% !important; margin:0 0 2px !important; font-size:28px; line-height:1.2; }
  .card:first-of-type > .row > div{ display:flex !important; flex-wrap:wrap !important; gap:8px !important; width:100% !important; }
  .btn{ padding:6px 10px; font-size:13px; }
  .twobar{ height:12px; }
  .cd-chip{ font-size:11px; padding:3px 8px; }
}

/* Team metrics (compact, uses pos/neg classes) */
.team-metrics{
  margin-top:10px;
  display:grid;
  gap:8px;
  grid-template-columns: repeat(3, minmax(0,1fr));
}
@media (max-width: 860px){ .team-metrics{ grid-template-columns: repeat(2, minmax(0,1fr)); } }
@media (max-width: 520px){ .team-metrics{ grid-template-columns: 1fr; } }

.tm-item{
  background: color-mix(in oklab, var(--surface) 94%, black);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 8px 10px;
  position: relative;
}
.tm-item.pos{ border-color: color-mix(in oklab, var(--teal) 40%, var(--border)); }
.tm-item.pos::before{
  content:""; position:absolute; left:0; top:0; bottom:0; width:3px;
  background: color-mix(in oklab, var(--teal) 70%, transparent);
  border-top-left-radius:10px; border-bottom-left-radius:10px;
}
.tm-item.neg{ border-color: color-mix(in oklab, var(--red) 40%, var(--border)); }
.tm-item.neg::before{
  content:""; position:absolute; left:0; top:0; bottom:0; width:3px;
  background: color-mix(in oklab, var(--red) 70%, transparent);
  border-top-left-radius:10px; border-bottom-left-radius:10px;
}

.tm-label{ font-size:12px; color:var(--text-mid); letter-spacing:.02em; }
.tm-val{ margin-top:2px; font-size:12px; font-weight:600; color:var(--text-hi); }
.tm-val.pos{ color:var(--teal); }
.tm-val.neg{ color:var(--red); }
.tm-sub{ font-weight:500; color:var(--text-mid); margin-left:4px; }

/* Badge looks (rookie/vet extensions preserved) */
.badge--rookieext{
  color:#FFD54F;
  background: repeating-linear-gradient(135deg, rgba(255,213,79,.22) 0 8px, rgba(255,213,79,.10) 8px 16px);
  border:1px solid rgba(255,213,79,.45);
}
.badge--vetext{
  color:#A782FF;
  background: repeating-linear-gradient(135deg, rgba(167,130,255,.22) 0 8px, rgba(167,130,255,.10) 8px 16px);
  border:1px solid rgba(167,130,255,.45);
}

.cd-tweets{ list-style:none; margin:0; padding:0; display:grid; gap:10px; }
.cd-tweet{ padding:8px 0; border-bottom:1px dashed var(--border); }
.cd-tweet:last-child{ border-bottom:0; }
.cd-tweet-link{ color:var(--text-hi); text-decoration:none; }
.cd-tweet-link:hover{ color:var(--teal); text-decoration:underline; }
.cd-tweet-meta{ font-size:12px; color:var(--text-mid); margin-top:4px; }

/* Front page — Latest signings table tweaks */
.table.cd-signings-front td,
.table.cd-signings-front th{ white-space:nowrap; }
@media (max-width: 640px){
  .table.cd-signings-front th:nth-child(3),
  .table.cd-signings-front td:nth-child(3){ white-space:normal; }
}

/* ===== Depth Builder ===== */
.cd-select,.cd-input{ background:var(--surface); border:1px solid var(--border); color:var(--text-hi); border-radius:8px; padding:6px 10px; }
.cdb-pool{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; list-style:none; padding:0; margin:0; }
@media (max-width:720px){ .cdb-pool{ grid-template-columns:1fr; } }

.cdb-pill{ display:flex; justify-content:space-between; align-items:center; gap:8px; background:var(--surface); border:1px solid var(--border); border-radius:10px; padding:8px 10px; cursor:grab; }
.cdb-pill.dragging{ opacity:.6; }

.cdb-grid{ margin-top:8px; }
.cdb-col{ background: color-mix(in oklab, var(--surface) 96%, black); border:1px solid var(--border); border-radius:12px; padding:10px; }

.cdb-slot{ list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:10px; min-height:120px; }
.cdb-slot.is-over{ outline:2px dashed color-mix(in oklab, var(--teal) 40%, var(--border)); outline-offset:2px; border-radius:10px; }
.cdb-empty{ text-align:center; padding:12px; border:1px dashed var(--border); border-radius:10px; }

.cdb-card{ background:#1b1e27; border:1px solid var(--border); border-radius:12px; padding:10px; cursor:grab; }
.cdb-card.dragging{ opacity:.7; }
.cdb-card .cd-x{ background:transparent; border:1px solid var(--border); border-radius:8px; color:var(--text-mid); padding:2px 8px; cursor:pointer; }
.cdb-card .cd-x:hover{ color:var(--text-hi); border-color:var(--text-mid); }

.cdb-card .mbar{ height:10px; margin-top:8px; }
.cdb-card .mbar .twofourty{
  position:absolute; left:0; top:2px; height:6px;
  background: linear-gradient(90deg, rgba(0,208,195,.9), rgba(0,208,195,.45));
  border-radius:999px;
}

.cdb-capture.is-capturing{ box-shadow:0 0 0 2px var(--teal) inset; }
#cdb-240.neg{ color:var(--red); }

/* small inputs */
.cdb-mins{ width:64px; background:var(--surface); border:1px solid var(--border); color:var(--text-hi); border-radius:8px; padding:4px 6px; }

/* CTA button */
.btn-cta{
  background: linear-gradient(180deg,
              color-mix(in oklab, var(--teal) 22%, #000),
              color-mix(in oklab, var(--teal) 8%,  #000));
  border-color: color-mix(in oklab, var(--teal) 55%, var(--border));
  color: var(--text-hi);
  font-weight: 600;
  box-shadow: 0 6px 14px rgba(0,208,195,.12);
}
.btn-cta:hover{
  transform: translateY(-1px);
  box-shadow: 0 8px 22px rgba(0,208,195,.22);
  text-decoration: none;
}

/* ===== Mobile player picker ===== */
.cdpp[hidden]{ display:none; }
.cdpp{
  position: fixed; inset: 0; z-index: 9999;
  background: rgba(0,0,0,.55); backdrop-filter: blur(2px);
  display: grid; place-items: end center;
}
.cdpp__sheet{
  width: min(680px, 100%);
  background: var(--surface);
  border-top-left-radius: 18px; border-top-right-radius: 18px;
  border: 1px solid var(--border);
  border-bottom: none;
  box-shadow: 0 -12px 40px rgba(0,0,0,.45);
  padding: 10px 12px 12px;
  animation: cdppUp .18s ease-out;
}
@keyframes cdppUp{ from{ transform: translateY(18px); opacity:.85; } to{ transform: translateY(0); opacity:1; } }
.cdpp__grab{ width:44px; height:4px; border-radius:999px; margin:2px auto 8px; background: rgba(255,255,255,.16); }
.cdpp__head{ display:flex; align-items:center; justify-content:space-between; gap:8px; }
.cdpp__title{ font-weight:700; }
.cdpp__close{ background:transparent; border:1px solid var(--border); color:var(--text-hi); border-radius:10px; padding:6px 10px; }
.cdpp__info{ margin:6px 2px 8px; }
.cdpp__search{ display:flex; gap:8px; margin:6px 0 8px; }
.cdpp__search input{
  flex:1; background: #101218; color: var(--text-hi);
  border:1px solid var(--border); border-radius:10px; padding:8px 10px;
}
.cdpp__clear{ background:transparent; border:1px solid var(--border); color:var(--text-mid); border-radius:10px; padding:6px 10px; }
.cdpp__list{ max-height: 52vh; overflow:auto; display:grid; gap:6px; padding:2px; }
.cdpp__item{
  display:flex; align-items:center; justify-content:space-between; gap:10px;
  background: color-mix(in oklab, var(--surface) 92%, black);
  border:1px solid var(--border); border-radius:12px; padding:10px; cursor:pointer;
}
.cdpp__item:hover{ border-color: color-mix(in oklab, var(--teal) 40%, var(--border)); }
.cdpp__meta{ font-size:12px; color:var(--text-mid); }
.cdpp__footer{ display:flex; justify-content:space-between; gap:8px; margin-top:10px; }
.cdpp__item .badge{ margin-left:auto; }
@media (min-width: 768px){
  /* Keep available for desktop too, but we default to drag there */
  .cdpp__sheet{ border-radius: 18px; margin-bottom: 18px; }
}

/* Mobile mode cue: make slots obviously tappable */
.is-mobilemode .slot, .is-mobilemode .player-slot{
  cursor: pointer;
  outline: 0;
}
.is-mobilemode .slot:active, .is-mobilemode .player-slot:active{
  box-shadow: 0 0 0 2px rgba(0,208,195,.25) inset;
}

.is-mobilemode .drag-handle { display:none !important; }

/* ===== Builder: mobile readability + compact roster ===== */

/* Ensure all roster/picker text uses the light palette on dark BG */
html.is-mobilemode .cdb-pill,
html.is-mobilemode .cdb-pill * { color: var(--text-hi) !important; }

#cd-player-picker .cdpp__sheet { background: var(--surface); color: var(--text-hi); }
#cd-player-picker .cdpp__item { 
  background: color-mix(in oklab, var(--surface) 94%, black);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 10px 12px;
  color: var(--text-hi);
}
#cd-player-picker .cdpp__item strong { color: var(--text-hi); }
#cd-player-picker .cdpp__item .cdpp__meta { color: var(--text-mid); }
#cd-player-picker .cdpp__item[data-taken="1"]{
  opacity:.72;
  border-style: dashed;
}

/* Search field in picker and roster: readable on dark */
html.is-mobilemode #cdpp-q,
html.is-mobilemode #cdb-search{
  background: var(--surface);
  color: var(--text-hi);
  border: 1px solid var(--border);
  border-radius: 10px;
}
html.is-mobilemode #cdpp-q::placeholder,
html.is-mobilemode #cdb-search::placeholder{ color: var(--text-lo); }

/* Compact roster list (above positions) on mobile */
html.is-mobilemode #cdb-pool{
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 6px;
  max-height: 140px;          /* keep it small; scroll if long */
  overflow: auto;
  padding: 4px;
  -webkit-overflow-scrolling: touch;
  scroll-behavior: smooth;
}

/* Smaller, high-contrast chips */
html.is-mobilemode .cdb-pill{
  background: color-mix(in oklab, var(--surface) 96%, black);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 6px 8px;
  line-height: 1.1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
}
html.is-mobilemode .cdb-pill .cdb-pill-name{ font-size: 13px; font-weight: 600; }
html.is-mobilemode .cdb-pill .subtle{ display: none; }   /* hide position to save space */

/* Make the search input smaller too */
html.is-mobilemode #cdb-search{
  height: 34px;
  font-size: 13px;
  padding: 6px 10px;
  margin-bottom: 6px;
}

/* Optional: subtle fade on the bottom to hint scrollability */
html.is-mobilemode #cdb-pool{
  mask-image: linear-gradient(180deg, rgba(0,0,0,1) 80%, rgba(0,0,0,0.0) 100%);
  -webkit-mask-image: linear-gradient(180deg, rgba(0,0,0,1) 80%, rgba(0,0,0,0.0) 100%);
}

/* “Add player” button rows inside each slot on mobile—tighten up */
html.is-mobilemode .cdb-add .btn{
  padding: 6px 8px;
  font-size: 13px;
}

/* --- Header refresh --- */
.header{
  position: sticky; top: 0; z-index: 50;
  background: color-mix(in oklab, var(--bg) 90%, transparent);
  backdrop-filter: saturate(120%) blur(8px);
  border-bottom: 1px solid var(--border);
}
.cdh-top{
  display:flex; align-items:center; justify-content:space-between;
  padding: 10px 0 6px;
}
.brand{ text-decoration:none; }
.brand-logo{
  display:inline-block; font-weight:800; font-size:22px; letter-spacing:.2px;
  color: var(--teal);
  text-shadow: 0 0 24px color-mix(in oklab, var(--teal) 25%, transparent);
}

.cdh-actions .btn-ghost{
  border:1px solid color-mix(in oklab, var(--teal) 35%, var(--border));
  color: var(--teal);
  background: color-mix(in oklab, var(--surface) 92%, black);
  border-radius: 999px; padding: 8px 12px; font-weight:600;
}
.cdh-actions .btn-ghost:hover{ border-color: var(--teal); }

/* Row 2 */
.cdh-bottom{
  display:grid; align-items:center; gap: 10px 12px;
  grid-template-columns: minmax(220px, 340px) auto 1fr;
  padding: 6px 0 12px;
}
.cdh-team-select{
  position:relative; display:block;
}
.cdh-team-select select{
  width:100%; appearance:none;
  background: var(--surface); color: var(--text-hi);
  border:1px solid var(--border); border-radius: 12px;
  padding: 10px 38px 10px 12px; font-size:14px;
}
.cdh-team-select .cdh-caret{
  position:absolute; right: 10px; top:50%; transform: translateY(-50%);
  opacity:.65; color: var(--text-mid); pointer-events:none;
}

.cdh-arrows{ display:flex; gap:8px; }
.btn-icon{
  background: var(--surface); color: var(--text-hi);
  border:1px solid var(--border); border-radius:10px;
  width:38px; height:38px; line-height:36px; text-align:center;
  font-weight:700; font-size:16px;
}
.btn-icon:hover{ border-color: var(--teal); color: var(--teal); }

.cdh-search .cd-searchwrap{ width:100%; }
.cdh-search input#cd-q{
  width:100%; height:38px; padding:8px 12px;
  background: var(--surface); color: var(--text-hi);
  border:1px solid var(--border); border-radius: 12px;
}
.cdh-search input#cd-q::placeholder{ color: var(--text-lo); }

/* Accessibility helper */
.sr-only{
  position:absolute !important; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;
}

/* --- Mobile tweaks --- */
@media (max-width: 720px){
  .brand-logo{ font-size:20px; }

  .cdh-bottom{
    grid-template-columns: 1fr auto;
    grid-template-rows: auto auto;
    grid-template-areas:
      "team arrows"
      "search search";
    gap: 8px;
  }
  .cdh-team-select{ grid-area: team; }
  .cdh-arrows{ grid-area: arrows; }
  .cdh-search{ grid-area: search; }

  .cdh-actions .btn-ghost{
    padding: 6px 10px; font-size:13px;
  }
}

/* search dropdown default */
#cd-search .cd-suggest{ display:none; }

/* ===== Contract Rankings ===== */
.cd-rank-card{ padding:16px; }
.cd-rank-toolbar{ display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; }
.cd-rank-title{ margin:0; font-size:22px; }

.cd-rank-actions .btn{ padding:6px 10px; }
.cd-rank-actions .btn-cta{
  background: linear-gradient(180deg, color-mix(in oklab, var(--teal) 22%, #000), color-mix(in oklab, var(--teal) 8%, #000));
  border-color: color-mix(in oklab, var(--teal) 55%, var(--border));
  color: var(--text-hi); font-weight:600; box-shadow:0 6px 14px rgba(0,208,195,.12);
}

.cd-rank-switch{ display:flex; gap:8px; margin:8px 0 10px; flex-wrap:wrap; }
.cd-rank-switch .chip{
  display:inline-flex; align-items:center; gap:6px;
  padding:6px 10px; border-radius:999px;
  background: var(--surface); border:1px solid var(--border); color: var(--text-hi);
  text-decoration:none;
}
.cd-rank-switch .chip.active{ border-color: var(--teal); color: var(--teal); }

.cd-rank-capture{ background: color-mix(in oklab, var(--surface) 96%, black); border:1px solid var(--border); border-radius:14px; }
.cd-ranklist{ list-style:none; margin:0; padding:0; }
.cd-rank-item{
  display:grid; grid-template-columns: 44px 1fr auto; align-items:center; gap:10px;
  padding:12px 12px; border-bottom:1px solid var(--border);
}
.cd-rank-item:last-child{ border-bottom:0; }
.cd-rank-item:nth-child(odd){ background: color-mix(in oklab, var(--surface) 94%, black); }

.rk-num{
  width:40px; height:40px; border-radius:10px;
  display:grid; place-items:center;
  background: color-mix(in oklab, var(--surface) 86%, black);
  border:1px solid var(--border); font-weight:800; color:var(--text-mid);
}
.rk-main{ min-width:0; }
.rk-name{ display:flex; align-items:center; gap:8px; font-size:16px; }
.rk-logo{ width:20px; height:20px; border-radius:50%; flex:0 0 20px; }
.rk-sub{ display:flex; align-items:center; gap:6px; margin-top:2px; color:var(--text-mid); font-size:12px; }
.rk-val{ font-size:16px; font-weight:700; color: var(--text-hi); }

@media (max-width: 560px){
  .cd-rank-title{ font-size:18px; }
  .rk-name{ font-size:15px; }
  .rk-val{ font-size:15px; }
  .cd-rank-item{ grid-template-columns: 36px 1fr auto; padding:10px; }
  .rk-num{ width:34px; height:34px; font-size:13px; }
}

/* ===== Better Contract (arena) ===== */
.cdcb-arena{ display:grid; grid-template-columns:1fr auto 1fr; gap:12px; align-items:stretch; }
.cdcb-col{ display:flex; }
.cdcb-choice{
  width:100%;
  background: color-mix(in oklab, var(--surface) 94%, black);
  border:1px solid var(--border);
  border-radius:14px;
  padding:12px;
  text-align:left;
  color: var(--text-hi);
  cursor:pointer;
}
.cdcb-choice:hover{ border-color: var(--teal); }
.cdcb-choice.picked{ box-shadow: 0 0 0 2px color-mix(in oklab, var(--teal) 40%, transparent) inset; }
.cdcb-name{ font-weight:700; margin-bottom:4px; }
.cdcb-meta{ font-size:12px; color:var(--text-mid); }

.cdcb-vs{
  display:grid; place-items:center;
  width:44px; border-radius:12px; border:1px dashed var(--border); color:var(--text-mid);
}

/* Bar like FIBA graphic (no photos) */
.cdcb-bar{
  display:flex; height:28px; border-radius:999px; overflow:hidden;
  border:1px solid var(--border); margin-top:12px;
  background: color-mix(in oklab, var(--surface) 92%, black);
}
.cdcb-bar > div{ display:flex; align-items:center; justify-content:center; gap:6px; position:relative; transition:width .35s ease; }
.cdcb-bar-a{ background: color-mix(in oklab, var(--teal) 30%, #0a1616); color: #BEFEF6; width:50%; }
.cdcb-bar-b{ background: color-mix(in oklab, var(--red) 35%, #160b0b); color: #FFD3D3; width:50%; }
.cdcb-bar span{ font-weight:700; text-shadow: 0 1px 0 rgba(0,0,0,.35); }
.cdcb-bar .win{ filter: saturate(1.1) brightness(1.05); }
.cdcb-bar .lose{ filter: saturate(.85) brightness(.95); }

@media (max-width:720px){
  .cdcb-arena{ grid-template-columns:1fr; }
  .cdcb-vs{ width:100%; height:34px; }
}

/* ===== Contract rankings (mobile) ===== */
.table-scroll{
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;      /* smooth iOS scroll */
}

/* Keep a comfortable min width so columns don't crush */
.cdcb-table{
  min-width: 720px;                        /* scrolls on small screens */
  border-collapse: separate;
  border-spacing: 0;
}

.cdcb-table th,
.cdcb-table td{
  white-space: nowrap;
  padding: 10px 12px;
}

/* Optional: make the first column (#) sticky so the row number stays visible while scrolling */
.cdcb-table th:first-child,
.cdcb-table td:first-child{
  position: sticky;
  left: 0;
  background: var(--panel, #121419);
  z-index: 1;
}

/* Phone tweaks */
@media (max-width: 520px){
  .cdcb-table th,
  .cdcb-table td{ padding: 8px 10px; font-size: 13px; }
}

/* Super-narrow phones: hide "Type" column to save space */
@media (max-width: 420px){
  .cdcb-table th:nth-child(4),
  .cdcb-table td:nth-child(4){ display:none; }   /* Type */
}

/* If you ever need it tighter still, you can also hide AAV on ~360px:
@media (max-width: 360px){
  .cdcb-table th:nth-child(6),
  .cdcb-table td:nth-child(6){ display:none; }
}
*/

/* =========================
   Salary ranking list (Cap/AAV/Total)
   ========================= */
.cd-ranklist{ margin:0; padding:0; list-style:none; }
.cd-rank-item{
  display:grid;
  grid-template-columns: 36px 1fr auto;  /* rank | main | value */
  gap:10px;
  align-items:center;
  padding:10px 12px;
  border-radius:12px;
  background: var(--panel, #121419);
  margin:8px 0;
}
.cd-rank-item .rk-num{
  width:32px; height:32px; border-radius:999px;
  display:flex; align-items:center; justify-content:center;
  background: var(--chip, #0f151b);
}
.cd-rank-item .rk-main .rk-name{ line-height:1.2; }
.cd-rank-item .rk-main .rk-sub{ margin-top:4px; display:flex; flex-wrap:wrap; gap:6px; }
.cd-rank-item .rk-val{ font-variant-numeric: tabular-nums; }

/* Phone: push the value under the name so everything fits without scroll */
@media (max-width: 520px){
  .cd-rank-item{ grid-template-columns: 32px 1fr; }
  .cd-rank-item .rk-val{
    grid-column: 2 / -1;
    justify-self: start;
    margin-top: 2px;
  }
}

/* =========================
   Battle vote block
   ========================= */
.cdcb-arena{
  display:grid;
  grid-template-columns: 1fr 30px 1fr;  /* card | VS | card */
  gap:12px;
}
.cdcb-vs{
  display:flex; align-items:center; justify-content:center;
  font-weight:700; opacity:.6;
}
.cdcb-choice{
  width:100%;
  text-align:left;
  padding:12px;
  border-radius:14px;
  background: var(--panel, #121419);
  border:1px solid var(--hair, #1a2027);
}
.cdcb-choice .cdcb-name{ font-weight:700; margin-bottom:4px; }
.cdcb-choice .cdcb-meta{ font-size:13px; opacity:.85; line-height:1.3; }

/* Result bar (kept compact) */
.cdcb-bar{ display:flex; gap:8px; margin-top:12px; }
.cdcb-bar > div{
  flex:1; height:28px; border-radius:999px; display:flex; align-items:center; justify-content:center;
  font-weight:700; font-variant-numeric: tabular-nums;
}
.cdcb-bar-a{ background:#1f6b63; }
.cdcb-bar-b{ background:#6b2d2d; }

/* Phone: stack the matchup cards, hide the VS chip */
@media (max-width: 640px){
  .cdcb-arena{ grid-template-columns: 1fr; }
  .cdcb-vs{ display:none; }
  .cdcb-choice{ padding:12px; }
  .cdcb-bar{ margin-top:8px; }
}

/* =========================
   Battle rankings (Elo) — table → stacked cards on mobile
   ========================= */
.cdcb-table{ width:100%; border-collapse:separate; border-spacing:0; }
.cdcb-table th, .cdcb-table td{ padding:10px 12px; white-space:nowrap; }

/* Desktop stays a normal table; phones become stacked rows */
@media (max-width: 640px){
  .cdcb-table, .cdcb-table thead, .cdcb-table tbody, .cdcb-table th, .cdcb-table td, .cdcb-table tr{
    display:block;
  }
  .cdcb-table thead{ display:none; }
  .cdcb-table tr{
    background: var(--panel, #121419);
    border:1px solid var(--hair, #1a2027);
    border-radius:12px;
    padding:10px 12px;
    margin:10px 0;
  }
  .cdcb-table td{
    display:grid;
    grid-template-columns: 110px 1fr;     /* label | value */
    gap:8px;
    white-space:normal;
    padding:6px 0;
  }
  .cdcb-table td::before{
    content: attr(data-label);
    color: var(--subtle, #8a96a3);
    font-weight:600;
    text-transform: uppercase;
    letter-spacing:.02em;
    font-size:12px;
  }
  /* Make first (#) and player appear as a compact header line */
  .cdcb-table td[data-label="#"]{
    grid-template-columns: 24px 1fr;
    font-weight:700;
  }
  .cdcb-table td[data-label="Player"]{
    margin-top:-2px;
  }
  /* Align right numeric cells normally on mobile */
  .cdcb-table td.right{ text-align:left; }
}

/* General chips/buttons spacing on the toolbar */
.cd-rank-switch{ display:flex; gap:8px; flex-wrap:wrap; }

/* ===== Better Contract: visual polish ===== */

/* Card choice */
.cdcb-arena { display:grid; grid-template-columns:1fr auto 1fr; gap:12px; }
.cdcb-choice{
  display:block; width:100%; text-align:left;
  border-radius:14px; padding:14px 16px;
  border:1px solid var(--border, #2b313b);
  background: var(--card, #13171d);
  transition: background-color .25s, border-color .25s, box-shadow .25s;
}
.cdcb-choice:hover{ border-color: rgba(16,196,164,.55); }
.cdcb-choice.selected{
  background: rgba(16,196,164,.14);              /* dull green fill */
  border-color: rgba(16,196,164,.75);
  box-shadow: 0 0 0 2px rgba(16,196,164,.28) inset;
}

/* “VS” chip in the middle */
.cdcb-vs{
  align-self:center; justify-self:center;
  font-weight:700; opacity:.7;
  padding:4px 10px; border-radius:999px;
  border:1px solid var(--border, #2b313b);
}

/* Animated results bar */
.cdcb-bar{
  height:38px; margin-top:10px;
  border-radius:999px; overflow:hidden;
  display:flex; background:#1a1f28;
  border:1px solid var(--border, #2b313b);
}
.cdcb-bar-a, .cdcb-bar-b{
  display:flex; align-items:center; justify-content:center;
  font-weight:700; color:#fff;
  width:50%;                                  /* start 50/50 */
  transition: width .7s cubic-bezier(.2,.7,.2,1);
}
.cdcb-bar-a{ background:#0f8f7e; }            /* site green family */
.cdcb-bar-b{ background:#7a3030; }            /* muted red */

/* Next button highlight */
#cdcb-next.btn-cta{ /* ensure CTA style appears when we add class from JS */ }
#cdcb-next.pulse{
  animation: cd-pulse 1.6s ease-in-out infinite;
}
@keyframes cd-pulse{
  0%   { box-shadow:0 0 0 0 rgba(16,196,164,.45); }
  70%  { box-shadow:0 0 0 14px rgba(16,196,164,0); }
  100% { box-shadow:0 0 0 0 rgba(16,196,164,0); }
}

/* Small screens: keep everything tidy, no horizontal scroll */
@media (max-width: 640px){
  .cdcb-arena{ grid-template-columns:1fr; gap:10px; }
  .cdcb-vs{ order:0; justify-self:start; margin:2px 0 4px; }
  .cdcb-choice{ padding:12px; }
  .cdcb-bar{ height:34px; }
}

/* ===== Builder minute input: reset native spinners and layout ===== */
.cdb-min-wrap {
  display:flex;
  align-items:center;
  gap:8px;
}
.cdb-min {
  width:70px;
  padding:10px 12px;
  font:600 14px/1.1 var(--font, Inter, system-ui, sans-serif);
  color:var(--text, #E7ECEB);
  background:var(--panel, #12151A);
  border:1px solid var(--line, #2A2F35);
  border-radius:10px;
  text-align:center;
}
.cdb-min::-webkit-outer-spin-button,
.cdb-min::-webkit-inner-spin-button { -webkit-appearance: none; margin:0; }
.cdb-min[type=number] { -moz-appearance: textfield; }

/* Big external controls */
.cdb-step {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:40px; height:40px;
  border-radius:10px;
  border:1px solid var(--line, #2A2F35);
  background:var(--panel, #12151A);
  cursor:pointer;
  transition:transform .06s ease, background .15s ease, border-color .15s ease;
  user-select:none;
}
.cdb-step:hover { border-color:#3a424a; }
.cdb-step:active { transform:scale(.97); }
.cdb-step svg { width:18px; height:18px; }

.cdb-step.plus  { outline: 2px solid transparent; }
.cdb-step.minus { outline: 2px solid transparent; }

/* Emphasize selected card after choosing it (theme green) */
.cdcb-choice.is-selected,
.cdb-card.is-selected {
  background: color-mix(in srgb, var(--cd-green, #0BD3C2) 16%, transparent);
  outline: 1px solid color-mix(in srgb, var(--cd-green, #0BD3C2) 40%, #1a1f24);
}

/* Player card aesthetics used in pool/slots */
.cdb-card {
  display:flex; flex-direction:column; gap:8px;
  padding:10px; border:1px solid var(--line, #2A2F35);
  border-radius:14px; background:var(--panel, #0F1318);
}
.cdb-h {
  display:flex; align-items:center; gap:8px; justify-content:space-between;
}
.cdb-name { display:flex; align-items:center; gap:8px; font-weight:700; }
.cdb-logo { width:20px; height:20px; border-radius:6px; object-fit:cover; }
.cdb-sub { color:#9DA7AE; font-size:12px; display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
.cdb-badge { font-size:11px; padding:2px 6px; border-radius:999px; border:1px solid #2a2f35; }
.cdb-meta { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.cdb-hotcold {
  height:6px; border-radius:999px; overflow:hidden; background:#1a2026; flex:1;
}
.cdb-hotcold > span { display:block; height:100%; width:0; background:linear-gradient(90deg, #3D8BFF, #FF6B6B); }

/* Minutes controls inline with meta */
.cdb-min-controls { display:flex; align-items:center; gap:8px; }

/* Mobile: bigger tap targets and stacked layout */
@media (max-width: 640px){
  .cdb-min { width:64px; padding:10px 10px; font-size:15px; }
  .cdb-step { width:44px; height:44px; }
  .cdb-meta { flex-direction:column; align-items:stretch; gap:8px; }
  .cdb-min-controls { justify-content:space-between; }
}

/* Optional: badge color mapping (align with your site’s badge classes) */
.badge--twoway { background:#16222a; color:#9bdcff; border-color:#1c2e3a; }
.badge--10day  { background:#241a1a; color:#ffb3b3; border-color:#392222; }
.badge--ex10   { background:#1c1f24; color:#e5e5e5; border-color:#2a2f35; }
.badge--rookie { background:#18241a; color:#b6f7c7; border-color:#233426; }
.badge--rookieext{ background:#201b24; color:#e3b6ff; border-color:#2e2434; }
.badge--veteran{ background:#141a24; color:#b6c7f7; border-color:#202838; }
.badge--vetext { background:#221a17; color:#ffd3b3; border-color:#36261e; }
.badge--full   { background:#151a1c; color:#dfe6e5; border-color:#243033; }

.cdb-min-controls{
  display:flex; align-items:center; gap:8px;
}
.cdb-step{
  width:32px; height:32px; border-radius:10px; border:1px solid var(--hair,rgba(255,255,255,.12));
  background: var(--surface, rgba(255,255,255,.04));
  color: var(--fg,#EAECEF); font-weight:700; line-height:30px; text-align:center;
  cursor:pointer;
}
.cdb-step:active{ transform:translateY(1px); }
.cdb-mins{
  width:70px; text-align:center; padding:6px 8px;
}
@media (max-width: 480px){
  .cdb-mins{ width:56px; }
}

/* minutes controls */
.cdb-min-controls{ display:flex; align-items:center; gap:8px; }
.cdb-step{
  width:34px; height:34px; border-radius:10px;
  border:1px solid var(--hair,rgba(255,255,255,.12));
  background: var(--surface, rgba(255,255,255,.04));
  color: var(--fg,#EAECEF); font-weight:700; line-height:32px; text-align:center; cursor:pointer;
}
.cdb-step:active{ transform:translateY(1px); }
.cdb-mins{ width:72px; text-align:center; padding:6px 8px; }
@media (max-width:480px){
  .cdb-mins{ width:58px; }
}

/* card header layout */
.cdb-card{ position:relative; padding-bottom:12px; }
.cdb-card .cd-x{ position:absolute; right:8px; bottom:8px; }
.cdb-card-top{ display:flex; align-items:flex-start; justify-content:space-between; gap:10px; }
.cdb-card-top__right .badge{ white-space:nowrap; }

/* contract info strip */
.cdb-contractline{ display:flex; flex-wrap:wrap; gap:6px; margin:6px 0 8px; }
.cdb-contractline .mono{ font-variant-numeric: tabular-nums; }

.cd-elo-chip{
  display:inline-block; margin-left:6px; padding:2px 6px;
  border-radius:10px; border:1px solid var(--hair, rgba(255,255,255,.12));
  background: rgba(0,208,195,.10); /* your teal, faint */
  font-size:12px; line-height:1; letter-spacing:.02em;
}

.cd-metric{ display:flex; flex-direction:column; gap:2px; min-width:110px }
.cd-metric__label{ font-size:12px; opacity:.75 }
.cd-metric__value{ font-size:18px; font-weight:700 }
.cd-metric__sub{ font-size:12px }

/* Player-name links anywhere we render rosters/240/builder lists */
.cd-player-link,
.rk-name a,
.cdb-card .cdb-name a,
.depth a.cd-player-link,
.cdb-slot .cdb-item .cdb-name a {
  color: inherit;
  text-decoration: none;
  border-bottom: 0;
}

.cd-player-link:hover,
.cd-player-link:focus,
.rk-name a:hover,
.rk-name a:focus,
.cdb-card .cdb-name a:hover,
.cdb-card .cdb-name a:focus,
.depth a.cd-player-link:hover,
.depth a.cd-player-link:focus {
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 2px;
}

/* If your theme was forcing green for links inside cards, neutralize it */
.card a.cd-player-link { color: inherit !important; }


/* ==========================================================================
   CourtDepth v2 — Design System Additions
   ========================================================================== */

/* ---------- Live data badge ---------- */
.cd-live-badge {
    background: color-mix(in oklab, #00D0C3 12%, transparent);
    color: #00D0C3;
    border: 1px solid color-mix(in oklab, #00D0C3 35%, transparent);
    font-size: 11px;
    letter-spacing: .02em;
    animation: cd-pulse 2.8s ease-in-out infinite;
}
@keyframes cd-pulse {
    0%,100% { opacity:1; }
    50%      { opacity:.6; }
}

/* ---------- Team Hero ---------- */
.cd-team-hero {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 20px;
    margin: 16px 0;
    overflow: hidden;
}
.cd-hero-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 20px 20px 0;
}
.cd-hero-left {
    display: flex;
    align-items: center;
    gap: 16px;
}
.cd-hero-logo {
    width: 72px;
    height: 72px;
    object-fit: contain;
    filter: drop-shadow(0 0 12px rgba(0,208,195,.18));
}
.cd-hero-title {
    font-size: clamp(20px, 3vw, 28px);
    font-weight: 700;
    margin: 0 0 6px;
    line-height: 1.1;
}
.cd-hero-sub {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    align-items: center;
}
.cd-hero-right {
    flex-shrink: 0;
}

/* Financial strip */
.cd-fin-strip {
    display: flex;
    flex-wrap: wrap;
    gap: 0;
    border-top: 1px solid var(--border);
    margin-top: 16px;
}
.cd-fin-item {
    flex: 1 1 110px;
    padding: 10px 14px;
    border-right: 1px solid var(--border);
    min-width: 90px;
}
.cd-fin-item:last-child { border-right: none; }
.cd-fin-label {
    font-size: 11px;
    color: var(--text-lo);
    text-transform: uppercase;
    letter-spacing: .04em;
    margin-bottom: 3px;
}
.cd-fin-val {
    font-size: 14px;
    font-weight: 600;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
}
.cd-fin-val.pos { color: var(--teal); }
.cd-fin-val.neg { color: var(--red);  }

/* ---------- 240 Card ---------- */
.cd-240-card {}
.cd-240-bar {
    display: flex;
    height: 28px;
    border-radius: 10px;
    overflow: hidden;
    background: #0E0F13;
    margin: 10px 0 8px;
    gap: 1px;
}
.cd-240-bar span {
    display: block;
    transition: width .3s ease;
}
.cd-240-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 6px;
}
.cd-chip {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 20px;
    font-size: 12px;
    border: 1px solid transparent;
    color: var(--text-hi);
    text-decoration: none;
    transition: opacity .15s;
}
.cd-chip:hover { opacity: .8; text-decoration: none; }

/* ---------- Position column ---------- */
.cd-pos-card {}
.cd-pos-header {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    margin-bottom: 10px;
}
.cd-pos-label {
    font-size: 18px;
    font-weight: 700;
    color: var(--text-hi);
    letter-spacing: .01em;
}

/* ---------- Player card v2 ---------- */
.player-card {
    position: relative;
    overflow: hidden;  /* hard clip — badges & content can't escape the card */
    transition: border-color .15s, transform .1s;
}
.player-card:hover {
    transform: translateY(-1px);
}
.player-card.is-starter {
    border-color: color-mix(in oklab, var(--teal) 28%, var(--border));
    background: color-mix(in oklab, var(--teal) 3%, #1b1e27);
}
.player-card.is-ir {
    opacity: .55;
}
.cd-card-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 6px;
    flex-wrap: wrap;   /* allow badges to wrap below name on tiny cards */
    overflow: hidden;  /* hard stop — nothing escapes the card */
}
.cd-player-name {
    display: flex;
    align-items: center;
    gap: 4px;
    flex-wrap: wrap;
    min-width: 0;      /* allow name column to compress */
    word-break: break-word;
}
.cd-jersey {
    font-size: 12px;
    color: var(--text-lo);
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
}
.cd-player-link {
    font-weight: 600;
    color: var(--text-hi);
    text-decoration: none;
    font-size: 14px;
}
.cd-player-link:hover { color: var(--teal); text-decoration: none; }
.cd-player-pos { font-size: 11px; margin-top: 2px; }
.cd-card-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 3px;
    justify-content: flex-end;
    flex-shrink: 0;
    max-width: 100%;   /* never wider than the card */
}

/* Compact badges inside player cards */
.player-card .badge {
    font-size: 11px;
    padding: 3px 7px;
    white-space: nowrap;
    max-width: 90px;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Salary section */
.cd-salary-row {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 8px 0 4px;
    flex-wrap: wrap;
}
.cd-salary-main {
    display: flex;
    align-items: center;
    gap: 5px;
}
.cd-salary-label {
    font-size: 11px;
    color: var(--text-lo);
    text-transform: uppercase;
    letter-spacing: .04em;
}
.cd-salary-val {
    font-size: 14px;
    font-weight: 600;
    color: var(--amber);
}
.cd-salary-next {
    font-size: 11px;
    color: var(--text-lo);
}
.cd-elo-chip {
    font-size: 10px;
    padding: 2px 6px;
    background: rgba(139,124,255,.12);
    border: 1px solid rgba(139,124,255,.3);
    border-radius: 20px;
    color: var(--violet);
    cursor: default;
}
.cd-mins-detail {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 4px;
    font-size: 11px;
}
.cd-last-season {
    font-size: 11px;
    margin-top: 3px;
}
.cd-inj-note {
    font-size: 11px;
    color: var(--red);
    opacity: .8;
}

/* ---------- Home page ---------- */
.cd-home-hero {
    background: linear-gradient(135deg, var(--surface) 0%, color-mix(in oklab, var(--teal) 6%, var(--surface)) 100%);
    border: 1px solid var(--border);
    border-radius: 20px;
    padding: 32px 24px;
    margin: 16px 0 24px;
    text-align: center;
}
.cd-home-hero-inner {}
.cd-home-title {
    font-size: clamp(28px, 5vw, 42px);
    font-weight: 800;
    margin: 0 0 10px;
    background: linear-gradient(135deg, var(--text-hi) 0%, var(--teal) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}
.cd-home-sub {
    color: var(--text-mid);
    font-size: 16px;
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    flex-wrap: wrap;
}

/* Conference card */
.cd-conf-card {}
.cd-conf-header {
    margin-bottom: 12px;
}
.cd-conf-title {
    font-size: 18px;
    font-weight: 700;
    margin: 0;
}
.cd-div-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
}
@media (max-width: 600px) {
    .cd-div-grid { grid-template-columns: 1fr; }
}
.cd-div-col {}
.cd-div-label {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: var(--text-lo);
    font-weight: 600;
    margin-bottom: 8px;
    padding-bottom: 6px;
    border-bottom: 1px solid var(--border);
}
.cd-team-row {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 0;
    border-bottom: 1px solid color-mix(in oklab, var(--border) 50%, transparent);
    text-decoration: none;
    color: var(--text-hi);
    transition: color .15s;
}
.cd-team-row:last-child { border-bottom: none; }
.cd-team-row:hover { color: var(--teal); text-decoration: none; }
.cd-team-row img {
    width: 28px; height: 28px; object-fit: contain; flex-shrink: 0;
}
.cd-team-row-name { flex: 1; font-size: 14px; }
.cd-team-row-arrow { color: var(--text-lo); font-size: 12px; }

/* ---------- Trade matcher ---------- */
.cd-trade-grid {
    display: grid;
    grid-template-columns: 1fr 100px 1fr;
    gap: 16px;
    align-items: start;
}
@media (max-width: 768px) {
    .cd-trade-grid { grid-template-columns: 1fr; }
}
.cd-trade-side {}
.cd-trade-side-head { margin-bottom: 12px; }
.cd-trade-center {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding-top: 60px;
}
.cd-trade-arrows {
    font-size: 28px;
    color: var(--text-mid);
}
.cd-trade-verdict {
    font-size: 14px;
    font-weight: 700;
    text-align: center;
    padding: 8px 12px;
    border-radius: 10px;
}
.cd-trade-verdict.ok   { background: rgba(0,208,195,.12); color: var(--teal); }
.cd-trade-verdict.fail { background: rgba(255,107,107,.12); color: var(--red); }
.cd-trade-diff { font-size: 12px; text-align: center; }
.cd-trade-player {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 10px;
    background: #1b1e27;
    border-radius: 10px;
    margin-bottom: 6px;
    font-size: 13px;
}
.cd-trade-totals {
    background: #1b1e27;
    border-radius: 10px;
    padding: 10px 12px;
    font-size: 13px;
}
.cd-trade-total-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 4px 0;
}
.cd-trade-valid {
    padding: 8px 10px;
    border-radius: 8px;
    font-size: 12px;
}
.cd-trade-valid.ok   { background: rgba(0,208,195,.08); color: var(--teal); }
.cd-trade-valid.fail { background: rgba(255,107,107,.08); color: var(--red); }
.cd-trade-warn {
    margin-top: 6px;
    padding: 6px 10px;
    background: rgba(255,194,77,.08);
    color: var(--amber);
    border-radius: 8px;
    font-size: 12px;
}

/* ---------- Responsive tweaks ---------- */
@media (max-width: 1024px) {
    .cd-fin-strip { overflow-x: auto; flex-wrap: nowrap; }
    .cd-fin-item { min-width: 100px; }
}
@media (max-width: 768px) {
    .cd-hero-inner { flex-direction: column; align-items: flex-start; }
    .cd-hero-right { align-self: flex-end; }
    .cd-trade-center { padding-top: 0; }
}

/* ---------- SEO: clean URLs slug active state ---------- */
.cd-team-row.is-current { color: var(--teal); }
.cd-team-row.is-current .cd-team-row-arrow { color: var(--teal); }


/* ==========================================================================
   Fix: Badge overflow + positional flexibility indicators
   ========================================================================== */

/* Ensure the card head never lets badges spill */
.cd-card-head > div:first-child {
    min-width: 0;
    flex: 1 1 auto;
}

/* Badge: player borrowed from another position */
.cd-pos-flex-badge {
    background: rgba(255,194,77,.10);
    color: var(--amber);
    border: 1px solid rgba(255,194,77,.28);
    font-size: 10px;
    padding: 2px 5px;
    cursor: help;
}

/* Borrowed-position card: subtle amber left border */
.player-card.is-borrowed {
    border-left: 2px solid rgba(255,194,77,.35);
}

/* Badge text — abbreviate long contract types */
.player-card .badge {
    font-size: 11px;
    padding: 3px 7px;
    white-space: nowrap;
    max-width: 88px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: inline-flex;
    align-items: center;
}


/* ==========================================================================
   Lineup engine UI additions
   ========================================================================== */

/* Lineup adjustment notice banner */
.cd-lineup-notice {
    background: color-mix(in oklab, var(--teal) 8%, var(--surface));
    border: 1px solid color-mix(in oklab, var(--teal) 30%, var(--border));
    border-radius: 12px;
    padding: 10px 14px;
    margin: 0 0 12px;
    font-size: 13px;
    color: var(--text-mid);
    display: flex;
    align-items: center;
    gap: 8px;
}
.cd-lineup-notice--warn {
    background: color-mix(in oklab, var(--amber) 6%, var(--surface));
    border-color: color-mix(in oklab, var(--amber) 28%, var(--border));
    color: var(--amber);
}
.cd-lineup-notice a { color: var(--teal); }
.cd-lineup-notice-icon { font-size: 16px; flex-shrink: 0; }

/* "Filling in for" badge — shown on IR-replacement starters */
.cd-subin-badge {
    background: rgba(0,208,195,.08);
    color: var(--teal);
    border: 1px solid rgba(0,208,195,.25);
    font-size: 10px;
    padding: 2px 6px;
    max-width: 120px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    cursor: help;
}

/* Starter card: stronger teal left border (confirmed by lineup data) */
.player-card.is-starter {
    border-left: 3px solid rgba(0,208,195,.5);
}

/* Subbed-in starter: amber border instead (filling in for injury) */
.player-card.is-subin {
    border-left: 3px solid rgba(255,194,77,.5);
    background: color-mix(in oklab, var(--amber) 3%, #1b1e27);
}

/* Small-ball label in position header */
.cd-smallball-tag {
    font-size: 10px;
    padding: 2px 6px;
    background: rgba(139,124,255,.12);
    border: 1px solid rgba(139,124,255,.3);
    border-radius: 20px;
    color: var(--violet);
    margin-left: 6px;
}

/* Injury sync freshness indicator */
.cd-inj-freshness {
    font-size: 11px;
    color: var(--text-lo);
    display: flex;
    align-items: center;
    gap: 4px;
}
.cd-inj-freshness.fresh { color: var(--teal); }
.cd-inj-freshness.stale { color: var(--amber); }


/* ==========================================================================
   Mobile fixes — badges, cards, position grid
   ========================================================================== */

/* On narrow screens, badge groups stack below name (not overflow right) */
@media (max-width: 480px) {
    .cd-card-head {
        flex-direction: column;
        gap: 6px;
    }
    .cd-card-badges {
        justify-content: flex-start;
    }
    .player-card .badge {
        font-size: 10px;
        padding: 2px 5px;
    }
    .cd-salary-val {
        font-size: 12px;
    }
    .cd-240-chips {
        gap: 4px;
    }
    .cd-chip {
        font-size: 11px;
        padding: 3px 8px;
    }
}

/* Position grid: stack on mobile */
@media (max-width: 768px) {
    .grid-5 {
        grid-template-columns: 1fr 1fr !important;
        gap: 8px;
    }
}
@media (max-width: 500px) {
    .grid-5 {
        grid-template-columns: 1fr !important;
    }
}

/* Global: player-card overflow is hard-clipped — no exceptions */
.player-card,
.player-card * {
    box-sizing: border-box;
}
.player-card {
    overflow: hidden;
    max-width: 100%;
    word-break: break-word;
}

/* Badge row: always wraps, never overflows */
.cd-card-badges {
    max-width: 100%;
    overflow: hidden;
}
.badge {
    box-sizing: border-box;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: inline-flex;
    align-items: center;
    vertical-align: middle;
}

/* Salary row: allow wrapping on tiny screens */
.cd-salary-row {
    flex-wrap: wrap;
    row-gap: 4px;
}


/* ==========================================================================
   Contract type badges — full set
   ========================================================================== */
.badge--rookie        { background:rgba(0,208,195,.10); color:#00D0C3; border-color:rgba(0,208,195,.3); }
.badge--rookie-ext    { background:rgba(0,208,195,.06); color:#5ee8e0; border-color:rgba(0,208,195,.2); }
.badge--max           { background:rgba(255,215,0,.12); color:#FFD700; border-color:rgba(255,215,0,.4); }
.badge--mle           { background:rgba(255,194,77,.10); color:var(--amber); border-color:rgba(255,194,77,.3); }
.badge--bae           { background:rgba(255,194,77,.07); color:var(--amber); border-color:rgba(255,194,77,.2); }
.badge--vetmin        { border-color:var(--border); color:var(--text-lo); }
.badge--10day         { border:1px dashed var(--border); color:var(--text-lo); font-style:italic; }
.badge--exhibit10     { border:1px dotted var(--border); color:var(--text-lo); font-style:italic; }
.badge--twoway        { background:repeating-linear-gradient(45deg,rgba(0,208,195,.12),rgba(0,208,195,.12) 4px,rgba(0,208,195,.04) 4px,rgba(0,208,195,.04) 8px); color:#BEFEF6; }
.badge--gleague-ct    { border-color:rgba(255,194,77,.25); color:var(--amber); font-size:10px; }
.badge--veteran       { background:rgba(255,255,255,.04); color:var(--text-mid); }
.badge--hardship      { border:1px dashed var(--red); color:var(--red); font-size:10px; }
.badge--ros           { border:1px dotted var(--text-lo); color:var(--text-lo); font-size:10px; }

/* ==========================================================================
   Mobile depth chart — starter full-size / bench condensed-but-complete
   ========================================================================== */

.cd-starter-card {}
.cd-depth-card   {}

@media (max-width: 768px) {
    .cd-depth-grid {
        grid-template-columns: 1fr !important;
    }
    .cd-pos-card { padding: 12px; }

    /* Starter = full card, unchanged */
    .cd-starter-card { margin-bottom: 8px; }

    /* Depth cards: same info, smaller visual footprint */
    .cd-depth-card {
        padding: 10px 12px;
        border-radius: 10px;
        margin-bottom: 5px;
        opacity: 0.88;
        /* Subtle left indent to show hierarchy */
        border-left: 2px solid var(--border);
        margin-left: 4px;
    }
    .cd-depth-card:hover { opacity: 1; }

    /* Shrink text sizes */
    .cd-depth-card .cd-player-name { gap: 3px; }
    .cd-depth-card .cd-player-link { font-size: 13px; }
    .cd-depth-card .cd-jersey { font-size: 11px; }
    .cd-depth-card .cd-player-pos { font-size: 10px; }

    /* Compact badge row */
    .cd-depth-card .cd-card-badges { gap: 2px; }
    .cd-depth-card .badge { font-size: 10px; padding: 2px 5px; max-width: 75px; }

    /* Salary row: smaller but still visible */
    .cd-depth-card .cd-salary-label { font-size: 9px; }
    .cd-depth-card .cd-salary-val   { font-size: 12px; }
    .cd-depth-card .cd-salary-next  { font-size: 10px; }
    .cd-depth-card .cd-elo-chip     { font-size: 9px; padding: 1px 4px; }

    /* Minutes bar: slimmer */
    .cd-depth-card .mbar { height: 8px; margin-top: 6px; }

    /* Stats row: smaller text */
    .cd-depth-card .cd-mins-detail { font-size: 10px; margin-top: 3px; }
    .cd-depth-card .cd-last-season  { font-size: 10px; }
    .cd-depth-card .notes,
    .cd-depth-card .cd-inj-note    { font-size: 10px; }
}

/* ==========================================================================
   League snapshot homepage section
   ========================================================================== */

.cd-league-section {
    margin: 32px 0;
}
.cd-league-title {
    font-size: clamp(22px,4vw,30px);
    font-weight: 800;
    margin: 0 0 4px;
}
.cd-league-sub {
    margin: 0 0 20px;
}
.cd-league-stats-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(130px, 1fr));
    gap: 10px;
    margin-bottom: 20px;
}
.cd-lstat {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 14px;
    padding: 14px 12px;
    text-align: center;
}
.cd-lstat--red  { border-color: rgba(255,107,107,.35); }
.cd-lstat--teal { border-color: rgba(0,208,195,.35); }
.cd-lstat--gold { border-color: rgba(255,215,0,.35); }
.cd-lstat-val {
    font-size: 26px;
    font-weight: 700;
    line-height: 1;
    margin-bottom: 6px;
}
.cd-lstat--red  .cd-lstat-val { color: var(--red); }
.cd-lstat--teal .cd-lstat-val { color: var(--teal); }
.cd-lstat--gold .cd-lstat-val { color: #FFD700; }
.cd-lstat-label {
    font-size: 11px;
    color: var(--text-lo);
    line-height: 1.3;
}
.cd-league-two-col {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}
@media (max-width: 640px) {
    .cd-league-two-col { grid-template-columns: 1fr; }
}
.cd-league-row {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 7px 0;
    border-bottom: 1px solid color-mix(in oklab, var(--border) 50%, transparent);
    font-size: 13px;
}
.cd-league-row:last-child { border-bottom: none; }
.cd-league-row-name {
    flex: 1;
    min-width: 0;
    overflow: hidden;
}
.cd-league-row-name a {
    color: var(--text-hi);
    text-decoration: none;
    font-weight: 500;
}
.cd-league-row-name a:hover { color: var(--teal); }
.cd-league-row-val {
    font-size: 13px;
    flex-shrink: 0;
    font-weight: 600;
}


/* ==========================================================================
   DraftBallr-inspired design enhancements + animations
   ========================================================================== */

/* Animated gradient glow on starter cards */
@keyframes cd-starter-pulse {
    0%,100% { box-shadow: 0 0 0 1px rgba(0,208,195,.25), 0 0 12px rgba(0,208,195,.08); }
    50%      { box-shadow: 0 0 0 1px rgba(0,208,195,.45), 0 0 20px rgba(0,208,195,.15); }
}
.player-card.is-starter.cd-starter-card {
    animation: cd-starter-pulse 3s ease-in-out infinite;
}

/* Animated minutes bar fill on page load */
@keyframes cd-bar-grow {
    from { width: 0 !important; }
}
.mbar .season, .mbar .twofourty {
    animation: cd-bar-grow .8s cubic-bezier(.4,0,.2,1) both;
}

/* Live data ticker on homepage */
.cd-ticker-wrap {
    overflow: hidden;
    background: color-mix(in oklab, var(--teal) 6%, var(--surface));
    border-bottom: 1px solid color-mix(in oklab, var(--teal) 20%, var(--border));
    border-top: 1px solid color-mix(in oklab, var(--teal) 20%, var(--border));
    padding: 8px 0;
    margin: -16px 0 24px;
}
.cd-ticker {
    display: flex;
    gap: 40px;
    white-space: nowrap;
    animation: cd-ticker-scroll 40s linear infinite;
}
.cd-ticker:hover { animation-play-state: paused; }
@keyframes cd-ticker-scroll {
    from { transform: translateX(0); }
    to   { transform: translateX(-50%); }
}
.cd-ticker-item {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 12px;
    color: var(--text-mid);
    flex-shrink: 0;
}
.cd-ticker-item .cd-t-name { color: var(--text-hi); font-weight: 600; }
.cd-ticker-item .cd-t-out  { color: var(--red); font-weight: 600; }
.cd-ticker-item .cd-t-dtd  { color: var(--amber); }
.cd-ticker-sep { color: var(--border); }

/* Terminal-style data labels */
.cd-sys-label {
    font-family: ui-monospace, SFMono-Regular, monospace;
    font-size: 10px;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--text-lo);
}
.cd-sys-label::before { content: '// '; opacity: .5; }

/* Glassmorphism hero */
.cd-team-hero {
    background: linear-gradient(135deg,
        rgba(22,24,31,.95) 0%,
        rgba(0,208,195,.04) 50%,
        rgba(22,24,31,.98) 100%) !important;
    backdrop-filter: saturate(160%) blur(12px);
    border: 1px solid rgba(0,208,195,.15) !important;
}

/* Depth chart column header glow on active position */
.cd-pos-label {
    background: linear-gradient(135deg, var(--text-hi), var(--teal));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

/* Score bar animation */
.cd-score-bar {
    height: 3px;
    background: linear-gradient(90deg, var(--teal), var(--violet));
    border-radius: 2px;
    transition: width .6s cubic-bezier(.4,0,.2,1);
}

/* Player card hover lift */
.player-card {
    transition: transform .15s ease, border-color .15s ease, box-shadow .15s ease !important;
}
.player-card:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 8px 24px rgba(0,0,0,.3), 0 0 0 1px rgba(0,208,195,.2);
}

/* Minutes bar heat effects */
.mbar.is-hot .season {
    background: linear-gradient(90deg, #FF6B6B, #FFC24D) !important;
}

/* League snapshot stats animated count */
.cd-lstat-val {
    animation: cd-count-in .5s ease-out both;
}
@keyframes cd-count-in {
    from { opacity:0; transform: translateY(8px); }
    to   { opacity:1; transform: translateY(0); }
}

/* Position badge on borrowed players */
.cd-pos-flex-badge {
    animation: none;
    font-weight: 700;
}

/* SEO-only content (search engines read, users don't see) */
.cd-seo-content {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0,0,0,0);
    white-space: nowrap;
    border: 0;
}


/* ==========================================================================
   Mobile hero + financial strip fixes
   ========================================================================== */

@media (max-width: 600px) {
    /* Hero: tighter layout */
    .cd-team-hero {
        border-radius: 14px;
        margin: 10px 0 12px;
    }
    .cd-hero-inner {
        flex-direction: row;
        align-items: center;
        padding: 14px 14px 0;
        gap: 10px;
    }
    .cd-hero-logo { width: 48px; height: 48px; }
    .cd-hero-title { font-size: 17px; margin-bottom: 4px; }
    .cd-hero-sub   { gap: 4px; }
    .cd-hero-sub .badge { font-size: 10px; padding: 2px 6px; }
    .cd-hero-right {
        position: absolute;
        top: 12px;
        right: 12px;
    }
    .btn { font-size: 12px; padding: 4px 8px; }

    /* Financial strip: 2-column grid on mobile */
    .cd-fin-strip {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 0;
        border-top: 1px solid var(--border);
        margin-top: 12px;
        overflow: hidden; /* clip border-radius */
    }
    .cd-fin-item {
        flex: unset;
        min-width: unset;
        padding: 8px 10px;
        border-right: 1px solid var(--border);
        border-bottom: 1px solid var(--border);
    }
    /* Remove right border on every 2nd item */
    .cd-fin-item:nth-child(2n) { border-right: none; }
    /* Remove bottom border on last two items */
    .cd-fin-item:nth-last-child(-n+2) { border-bottom: none; }
    .cd-fin-label {
        font-size: 9px;
        letter-spacing: .02em;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    .cd-fin-val {
        font-size: 12px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    /* IR mode button position fix */
    .cd-team-hero { position: relative; }
}

/* ==========================================================================
   Lineup History Panel
   ========================================================================== */

.cd-lineup-history { padding: 0; overflow: hidden; }
.cd-lh-header { padding: 16px 16px 0; }
.cd-lh-title { font-size: 16px; font-weight: 700; margin: 0 0 4px; display: flex; align-items: center; gap: 8px; }
.cd-lh-tabs  { display: flex; border-bottom: 1px solid var(--border); padding: 0 16px; gap: 0; }
.cd-lh-tab   { background: none; border: none; border-bottom: 2px solid transparent; color: var(--text-lo);
                padding: 8px 14px; font-size: 12px; font-weight: 600; cursor: pointer; transition: all .15s; margin-bottom: -1px; }
.cd-lh-tab.active { color: var(--teal); border-bottom-color: var(--teal); }
.cd-lh-tab:hover  { color: var(--text-hi); }
.cd-lh-panel      { display: none; padding: 12px 16px 16px; }
.cd-lh-panel.active { display: block; }
.cd-lh-game-date  { font-size: 11px; color: var(--text-lo); margin-bottom: 8px; }
.cd-lh-five       { display: flex; flex-direction: column; gap: 6px; }
.cd-lh-player     { display: flex; align-items: center; gap: 8px; font-size: 13px; }
.cd-lh-player--sm { font-size: 11px; gap: 4px; padding: 2px 0; }
.cd-lh-pos        { font-size: 10px; min-width: 22px; text-align: center; }
.cd-lh-name       { flex: 1; font-weight: 500; color: var(--text-hi); }
.cd-lh-mins       { font-size: 11px; }
.cd-lh-grid       { display: flex; gap: 8px; overflow-x: auto; padding-bottom: 4px; }
.cd-lh-game-col   { flex: 0 0 auto; min-width: 80px; }
.cd-lh-game-col--sm { min-width: 65px; }
.cd-lh-pos-dot    { display: inline-block; width: 6px; height: 6px; border-radius: 50%; margin-right: 3px; flex-shrink: 0; }
.cd-lh-pos--g     { background: var(--teal); }
.cd-lh-pos--f     { background: var(--amber); }
.cd-lh-pos--c     { background: var(--violet); }
.cd-lh-pos--b     { background: var(--border); }
.cd-lh-consist-row { display: flex; align-items: center; gap: 8px; padding: 5px 0; }
.cd-lh-consist-bar-wrap { flex: 1; height: 6px; background: rgba(255,255,255,.08); border-radius: 3px; overflow: hidden; }
.cd-lh-consist-bar { height: 100%; background: linear-gradient(90deg,var(--teal),var(--violet)); border-radius: 3px; transition: width .5s ease; }

/* ==========================================================================
   Minutes Projection Tools
   ========================================================================== */

.cd-minutes-tools { padding: 16px; }
.cd-mpt-legend    { display: flex; gap: 12px; font-size: 11px; color: var(--text-lo); align-items: center; }
.cd-mpt-leg-item  { display: flex; align-items: center; gap: 4px; }
.cd-mpt-bar-wrap  { display: flex; height: 36px; border-radius: 8px; overflow: hidden; gap: 1px; background: var(--surface); }
.cd-mpt-seg       { display: flex; align-items: center; justify-content: center; min-width: 0; transition: opacity .2s; cursor: default; position: relative; }
.cd-mpt-seg:hover { opacity: .85; }
.cd-mpt-seg--ir   { background: rgba(214,54,56,.25); border: 1px dashed rgba(214,54,56,.4); }
.cd-mpt-label     { font-size: 9px; font-weight: 700; color: rgba(0,0,0,.7); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding: 0 3px; }
.cd-mpt-steal     {}
.cd-mpt-player-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.cd-mpt-chip {
    cursor: pointer;
    transition: all .15s;
    background: var(--surface) !important;
    border: 1px solid var(--border) !important;
    color: var(--text-hi) !important;
    padding: 5px 10px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 500;
    display: inline-flex;
    align-items: center;
    gap: 4px;
}
.cd-mpt-chip:hover {
    border-color: var(--teal) !important;
    color: var(--teal) !important;
}
.cd-mpt-chip.active {
    background: rgba(0,208,195,.15) !important;
    border-color: var(--teal) !important;
    color: var(--teal) !important;
    box-shadow: 0 0 0 1px var(--teal);
}
/* Role colour dot inside chip */
.cd-mpt-chip.cd-chip--teal::before { content:''; display:inline-block; width:6px; height:6px; border-radius:50%; background:var(--teal); }
.cd-mpt-chip.cd-chip--amber::before { content:''; display:inline-block; width:6px; height:6px; border-radius:50%; background:var(--amber); }
.cd-mpt-steal-result { background: rgba(0,208,195,.08); border: 1px solid rgba(0,208,195,.2); border-radius: 10px; padding: 10px 14px; font-size: 13px; margin-top: 8px; }

/* Starter probability rings */
.cd-mpt-prob-grid { display: flex; flex-wrap: wrap; gap: 10px; }
.cd-mpt-prob-item { display: flex; flex-direction: column; align-items: center; gap: 4px; }
.cd-mpt-prob-ring {
    width: 48px; height: 48px; border-radius: 50%;
    background: conic-gradient(var(--col, var(--teal)) calc(var(--prob, 0%) * 3.6deg / 100 * 1deg), var(--surface) 0);
    display: flex; align-items: center; justify-content: center; position: relative;
}
.cd-mpt-prob-ring::before {
    content: ''; position: absolute; inset: 6px; background: var(--surface); border-radius: 50%;
}
.cd-mpt-prob-ring span { font-size: 9px; font-weight: 700; z-index: 1; position: relative; }
.cd-mpt-prob-name { font-size: 10px; color: var(--text-lo); text-align: center; max-width: 52px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

@media (max-width: 600px) {
    .cd-lh-grid { gap: 5px; }
    .cd-lh-game-col { min-width: 65px; }
    .cd-mpt-bar-wrap { height: 28px; }
    .cd-mpt-prob-ring { width: 40px; height: 40px; }
}

/* Admin override indicator on team page */
.cd-admin-ov-dot {
    font-size: 10px;
    color: var(--amber);
    opacity: .7;
    margin-left: 3px;
    cursor: help;
}