/* ===================================================================
   LAB PANELS CSS — Rankings & Values (7 panels)
   Styles for native panel rendering inside lab.html
   =================================================================== */

/* ===== SHARED PANEL STYLES ===== */
.lp-page {
  max-width: 1200px;
  margin: 0 auto;
  padding: 24px 20px 60px;
}
.lp-page table th {
  font-family: var(--font-display);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}
.lp-header {
  text-align: center;
  margin-bottom: 24px;
}
.lp-header h2 {
  font-family: var(--font-display);
  font-size: 28px;
  color: var(--ink);
  margin: 0 0 4px;
}
.lp-subtitle {
  font-family: var(--font-hand);
  font-size: 18px;
  color: var(--ink-light);
}
.lp-meta {
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--ink-light);
  margin-top: 6px;
}
.lp-controls {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 14px;
  margin-bottom: 20px;
  flex-wrap: wrap;
}
.lp-select {
  font-family: var(--font-mono);
  font-size: 13px;
  padding: 6px 10px;
  border: 2px solid var(--ink);
  border-radius: 8px;
  background: var(--bg-card);
  color: var(--ink);
  cursor: pointer;
}
.lp-search {
  font-family: var(--font-mono);
  font-size: 13px;
  padding: 6px 10px;
  border: 2px solid var(--ink);
  border-radius: 8px;
  background: var(--bg-card);
  color: var(--ink);
  width: 180px;
}
.lp-search::placeholder { color: var(--ink-light); }
.lp-ctrl-label {
  font-family: var(--font-mono);
  font-size: 12px;
  color: var(--ink);
}
.lp-pos-tabs {
  display: flex;
  border: 2px solid var(--ink);
  border-radius: 8px;
  overflow: hidden;
}
.lp-pos-tab {
  font-family: var(--font-display);
  font-size: 13px;
  font-weight: 700;
  padding: 6px 14px;
  background: var(--bg-card);
  color: var(--ink);
  border: none;
  border-right: 2px solid var(--ink);
  cursor: pointer;
  transition: all 0.15s;
}
.lp-pos-tab:last-child { border-right: none; }
.lp-pos-tab.active { background: var(--ink); color: var(--bg-card); }
.lp-pos-tab:hover:not(.active) { background: var(--bg-warm); }
.lp-actions {
  display: flex;
  justify-content: center;
  gap: 10px;
  margin-bottom: 20px;
}
.lp-loading, .lp-empty {
  text-align: center;
  padding: 60px 20px;
  font-family: var(--font-hand);
  font-size: 20px;
  color: var(--ink-light);
}
.lp-error {
  text-align: center;
  padding: 40px 20px;
  font-family: var(--font-hand);
  font-size: 18px;
  color: var(--red);
}

/* ===== RANKINGS PANEL ===== */
.rankings-filters {
  display: flex;
  justify-content: center;
  gap: 0;
  margin-bottom: 24px;
}
.rankings-filter-btn {
  font-family: var(--font-display);
  font-size: 14px;
  padding: 8px 18px;
  border: 2px solid var(--ink);
  background: var(--bg-card);
  color: var(--ink);
  cursor: pointer;
  transition: all 0.15s;
}
.rankings-filter-btn:first-child { border-radius: 8px 0 0 8px; }
.rankings-filter-btn:last-child { border-radius: 0 8px 8px 0; }
.rankings-filter-btn:not(:first-child) { border-left: none; }
.rankings-filter-btn:hover { background: var(--bg-warm); }
.rankings-filter-btn.active { background: var(--ink); color: var(--bg-card); }
.rankings-filter-btn.active.pos-qb { background: var(--pos-qb); border-color: var(--pos-qb); }
.rankings-filter-btn.active.pos-rb { background: var(--pos-rb); border-color: var(--pos-rb); }
.rankings-filter-btn.active.pos-wr { background: var(--pos-wr); border-color: var(--pos-wr); }
.rankings-filter-btn.active.pos-te { background: var(--pos-te); border-color: var(--pos-te); }

.rankings-tier { margin-bottom: 28px; }
.rankings-tier-header {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 12px;
  padding-bottom: 8px;
  border-bottom: 2px dashed var(--ink-faint);
}
.rankings-tier-badge {
  font-family: var(--font-display);
  font-size: 14px;
  font-weight: 700;
  padding: 4px 12px;
  border: 2px solid var(--ink);
  border-radius: 20px;
  background: var(--bg-card);
  box-shadow: 2px 2px 0 var(--ink);
  transform: rotate(-2deg);
  white-space: nowrap;
}
.rankings-tier-label {
  font-family: var(--font-hand);
  font-size: 20px;
  color: var(--ink-light);
}
.rankings-tier-count {
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--ink-light);
  margin-left: auto;
}
.tier-1 .rankings-tier-badge { background: var(--orange); color: #fff; }
.tier-2 .rankings-tier-badge { background: var(--blue); color: #fff; }
.tier-3 .rankings-tier-badge { background: var(--green); color: #fff; }
.tier-4 .rankings-tier-badge { background: var(--purple); color: #fff; }
.tier-5 .rankings-tier-badge, .tier-6 .rankings-tier-badge { background: var(--bg-warm); }
.tier-7 .rankings-tier-badge, .tier-8 .rankings-tier-badge { background: var(--bg-warm); color: var(--ink-light); }
.rankings-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 12px;
}
.rankings-card {
  background: var(--bg-card);
  border: 3px solid var(--ink);
  border-radius: 10px;
  box-shadow: 4px 4px 0 var(--ink);
  padding: 12px;
  display: flex;
  align-items: center;
  gap: 10px;
  cursor: pointer;
  transition: all 0.15s;
  position: relative;
}
.rankings-card:hover {
  transform: translate(-2px, -2px);
  box-shadow: 6px 6px 0 var(--ink);
}
.rankings-rank {
  font-family: var(--font-display);
  font-size: 16px;
  color: var(--ink-light);
  min-width: 28px;
  text-align: center;
}
.tier-1 .rankings-rank { color: var(--orange); }
.tier-2 .rankings-rank { color: var(--blue); }
.rankings-card .player-headshot,
.rankings-card .player-headshot-fallback {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  flex-shrink: 0;
}
.rankings-card .player-headshot-fallback {
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-display);
  font-size: 12px;
  font-weight: 700;
  color: #fff;
}
.rankings-info { flex: 1; min-width: 0; }
.rankings-name {
  font-family: var(--font-display);
  font-size: 14px;
  font-weight: 700;
  color: var(--ink);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.rankings-meta { display: flex; align-items: center; gap: 6px; margin-top: 2px; }
.rankings-pos-badge {
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 700;
  padding: 1px 6px;
  border-radius: 4px;
  color: #fff;
}
.rankings-pos-badge.qb { background: var(--pos-qb); }
.rankings-pos-badge.rb { background: var(--pos-rb); }
.rankings-pos-badge.wr { background: var(--pos-wr); }
.rankings-pos-badge.te { background: var(--pos-te); }
.rankings-team { font-family: var(--font-mono); font-size: 11px; color: var(--ink-light); }
.rankings-age {
  font-family: var(--font-mono);
  font-size: 11px;
  padding: 1px 5px;
  border-radius: 4px;
  font-weight: 700;
}
.rankings-age.young { background: var(--green-light); color: #1a7a6e; }
.rankings-age.prime { background: var(--yellow-light); color: #8a6e1a; }
.rankings-age.aging { background: var(--red-light); color: #a82d3a; }
.rankings-scores { text-align: right; flex-shrink: 0; }
.rankings-value { font-family: var(--font-mono); font-size: 16px; font-weight: 700; color: var(--ink); }
.rankings-ppg { font-family: var(--font-mono); font-size: 11px; color: var(--ink-light); }

/* ===== VIEW TOGGLE ===== */
.lp-view-toggle {
  display: flex;
  gap: 0;
  border: 2px solid var(--ink);
  border-radius: 8px;
  overflow: hidden;
}
.lp-view-btn {
  font-family: var(--font-display);
  font-size: 12px;
  padding: 4px 12px;
  border: none;
  background: var(--bg-card);
  cursor: pointer;
  color: var(--ink-medium);
}
.lp-view-btn:not(:last-child) { border-right: 2px solid var(--ink); }
.lp-view-btn.active { background: var(--accent); color: #fff; font-weight: 700; }
.lp-view-btn:hover:not(.active) { background: var(--bg-main); }

/* ===== DYNASTY HISTORY TABLE ===== */
.dh-wrap {
  background: var(--bg-card);
  border: 3px solid var(--ink);
  border-radius: 10px;
  box-shadow: 4px 4px 0 var(--ink);
  overflow-x: auto;
}
.dh-table {
  width: 100%;
  border-collapse: collapse;
  font-family: var(--font-mono);
  font-size: 12px;
}
.dh-table th {
  font-family: var(--font-display);
  font-size: 11px;
  text-transform: uppercase;
  padding: 8px 6px;
  border-bottom: 3px solid var(--ink);
  background: var(--bg-main);
  color: var(--ink-medium);
  position: sticky;
  top: 0;
  white-space: nowrap;
}
.dh-table td { padding: 6px; border-bottom: 2px dashed var(--border-light); }
.dh-table tr:hover { background: rgba(217, 119, 87, 0.06); }
.dh-table tr[data-pid] { cursor: pointer; }
.dh-player-cell {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 160px;
}
.dh-headshot {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  border: 2px solid var(--ink);
  object-fit: cover;
  flex-shrink: 0;
}
.dh-name { font-family: var(--font-display); font-size: 13px; font-weight: 700; }
.dh-team { font-size: 10px; color: var(--ink-light); }
.dh-val {
  display: inline-block;
  font-weight: 700;
  padding: 2px 6px;
  border-radius: 4px;
  font-size: 11px;
}
.dh-val.elite { background: var(--green-light); color: #1a7a6e; }
.dh-val.solid { background: var(--yellow-light); color: #8a6e1a; }
.dh-val.low { background: var(--orange-light, #fde8d8); color: var(--accent); }
.dh-val.rep { background: var(--red-light); color: #a82d3a; }
.dh-val.empty { color: var(--ink-light); background: none; }
.dh-compare-bar {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 12px;
  flex-wrap: wrap;
}
.dh-compare-bar .lp-search-wrap { position: relative; flex: 1; min-width: 200px; }
.dh-compare-bar .lp-search { width: 100%; }
.dh-compare-results {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  z-index: 50;
  background: var(--bg-card);
  border: 2px solid var(--ink);
  border-radius: 8px;
  box-shadow: 4px 4px 0 var(--ink);
  max-height: 200px;
  overflow-y: auto;
  margin-top: 2px;
}
.dh-compare-results > div {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 8px 10px;
  cursor: pointer;
  font-family: var(--font-mono);
  font-size: 12px;
  border-bottom: 2px dashed var(--border-light);
}
.dh-compare-results > div:last-child { border-bottom: none; }
.dh-compare-results > div:hover { background: rgba(217,119,87,0.08); }

/* ===== TIERS PANEL ===== */
.tl-tier {
  display: flex;
  align-items: stretch;
  margin-bottom: 12px;
  border: 3px solid var(--ink);
  border-radius: 14px;
  box-shadow: 4px 4px 0 var(--ink);
  overflow: hidden;
  background: var(--bg-card);
}
.tl-tier-label {
  min-width: 70px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 12px 8px;
  border-right: 3px solid var(--ink);
}
.tl-tier-letter {
  font-family: var(--font-display);
  font-size: 36px;
  line-height: 1;
  color: white;
  text-shadow: 2px 2px 0 rgba(0,0,0,0.2);
}
.tl-tier-count {
  font-family: var(--font-mono);
  font-size: 10px;
  color: rgba(255,255,255,0.8);
  margin-top: 4px;
}
.tl-tier-label.S { background: #d44040; }
.tl-tier-label.A { background: var(--orange); }
.tl-tier-label.B { background: #e8a838; }
.tl-tier-label.C { background: var(--pos-rb); }
.tl-tier-label.D { background: var(--pos-qb); }
.tl-tier-label.F { background: var(--ink-light); }
.tl-tier-players {
  flex: 1;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  padding: 10px 12px;
  align-items: center;
  align-content: center;
  min-height: 50px;
}
.tl-player-chip {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 4px 10px 4px 4px;
  border: 2px solid var(--ink);
  border-radius: 20px;
  background: var(--bg-card);
  font-family: var(--font-mono);
  font-size: 12px;
  white-space: nowrap;
  box-shadow: 2px 2px 0 var(--ink-faint);
  transition: transform 0.1s;
}
.tl-player-chip:hover { transform: translateY(-1px); box-shadow: 3px 3px 0 var(--ink-faint); }
.tl-chip-pos {
  display: inline-block;
  font-family: var(--font-display);
  font-size: 10px;
  padding: 2px 6px;
  border-radius: 10px;
  color: white;
}
.tl-chip-pos.QB { background: var(--pos-qb); }
.tl-chip-pos.RB { background: var(--pos-rb); }
.tl-chip-pos.WR { background: var(--pos-wr); }
.tl-chip-pos.TE { background: var(--pos-te); }
.tl-chip-name { font-weight: 600; }
.tl-chip-tv { font-size: 10px; color: var(--ink-light); }
.tl-empty-tier { font-family: var(--font-hand); font-size: 14px; color: var(--ink-faint); padding: 8px; }
.tl-tier-desc {
  font-family: var(--font-hand);
  font-size: 12px;
  color: rgba(255,255,255,0.7);
  max-width: 60px;
  text-align: center;
  line-height: 1.2;
}

/* ===== TRADE VALUES PANEL ===== */
.tv-methodology {
  display: flex;
  justify-content: center;
  gap: 12px;
  margin-bottom: 20px;
  flex-wrap: wrap;
}
.tv-method-chip {
  font-family: var(--font-mono);
  font-size: 12px;
  padding: 4px 10px;
  border: 2px solid var(--ink);
  border-radius: 6px;
  background: var(--bg-card);
  color: var(--ink-medium);
}
.tv-method-chip .method-label { font-family: var(--font-display); font-weight: 700; margin-right: 4px; }
.tv-weight-slider {
  display: flex;
  align-items: center;
  gap: 8px;
  font-family: var(--font-mono);
  font-size: 12px;
  color: var(--ink-medium);
}
.tv-weight-slider label {
  min-width: 130px;
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 13px;
  color: var(--ink);
}
.tv-weight-slider label span {
  font-family: var(--font-mono);
  color: var(--accent);
  font-weight: 700;
}
.tv-weight-slider input[type="range"] {
  width: 120px;
  accent-color: var(--accent);
  cursor: pointer;
}
#lp-tv-w-reset {
  font-family: var(--font-hand);
  font-size: 13px;
  padding: 4px 10px;
  border: 2px solid var(--ink);
  border-radius: 6px;
  background: var(--bg-card);
  cursor: pointer;
  color: var(--ink-medium);
}
#lp-tv-w-reset:hover { background: var(--accent); color: #fff; }
.tv-chart-wrap {
  background: var(--bg-card);
  border: 3px solid var(--ink);
  border-radius: 10px;
  box-shadow: 4px 4px 0 var(--ink);
  overflow: hidden;
  margin-bottom: 32px;
}
.tv-tier-header {
  font-family: var(--font-display);
  font-size: 16px;
  font-weight: 700;
  color: var(--ink);
  padding: 10px 14px;
  background: var(--bg-warm);
  border-bottom: 3px solid var(--ink);
  display: flex;
  align-items: center;
  gap: 8px;
}
.tv-tier-header:not(:first-child) { border-top: 3px solid var(--ink); }
.tv-tier-num {
  font-family: var(--font-mono);
  font-size: 13px;
  font-weight: 700;
  width: 26px;
  height: 26px;
  line-height: 26px;
  text-align: center;
  border-radius: 50%;
  border: 2px solid var(--ink);
  flex-shrink: 0;
}
.tv-tier-num.t1 { background: #ffd700; color: var(--ink); }
.tv-tier-num.t2 { background: var(--blue-light); color: var(--blue); }
.tv-tier-num.t3 { background: var(--green-light); color: #1a7a6d; }
.tv-tier-num.t4 { background: var(--orange-light); color: #a85a3a; }
.tv-tier-num.t5 { background: var(--purple-light); color: var(--purple); }
.tv-tier-num.t6 { background: var(--bg); color: var(--ink-medium); }
.tv-tier-num.t7 { background: var(--red-light); color: #a83240; }
.tv-tier-num.t8 { background: var(--ink-faint); color: var(--ink-medium); }
.tv-tier-label { font-family: var(--font-hand); font-size: 15px; color: var(--ink-light); margin-left: 4px; }
.tv-tier-count { font-family: var(--font-mono); font-size: 11px; color: var(--ink-light); margin-left: auto; }
.tv-row {
  display: flex;
  align-items: center;
  padding: 6px 14px;
  border-bottom: 1px solid var(--ink-faint);
  cursor: pointer;
  transition: background 0.1s;
  gap: 10px;
  min-height: 44px;
}
.tv-row:hover { background: var(--bg-warm); }
.tv-row:last-child { border-bottom: none; }
.tv-rank { font-family: var(--font-display); font-size: 14px; font-weight: 700; color: var(--ink-light); width: 32px; text-align: center; flex-shrink: 0; }
.tv-rank.top1 { color: #b8860b; font-size: 16px; }
.tv-rank.top2 { color: var(--ink-light); font-size: 15px; }
.tv-rank.top3 { color: #a0522d; font-size: 15px; }
.tv-headshot { width: 32px; height: 32px; border-radius: 50%; border: 2px solid var(--ink); object-fit: cover; flex-shrink: 0; background: var(--bg-warm); }
.tv-player-info { min-width: 0; width: 140px; flex-shrink: 0; }
.tv-player-name { font-family: var(--font-display); font-size: 13px; font-weight: 700; color: var(--ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tv-player-meta { display: flex; align-items: center; gap: 5px; margin-top: 1px; }
.tv-pos-badge { font-family: var(--font-display); font-size: 10px; font-weight: 700; padding: 1px 6px; border-radius: 5px; color: #fff; }
.tv-pos-badge.qb { background: var(--pos-qb); }
.tv-pos-badge.rb { background: var(--pos-rb); }
.tv-pos-badge.wr { background: var(--pos-wr); }
.tv-pos-badge.te { background: var(--pos-te); }
.tv-team-label { font-family: var(--font-mono); font-size: 11px; color: var(--ink-medium); }
.tv-age { font-family: var(--font-mono); font-size: 10px; color: var(--ink-light); }
.tv-bar-area { flex: 1; min-width: 0; display: flex; align-items: center; gap: 8px; }
.tv-bar-track { flex: 1; height: 22px; background: var(--bg); border: 2px solid var(--ink-faint); border-radius: 6px; overflow: hidden; position: relative; }
.tv-bar-fill { height: 100%; border-radius: 4px; transition: width 0.4s ease; }
.tv-bar-fill.qb { background: var(--pos-qb); }
.tv-bar-fill.rb { background: var(--pos-rb); }
.tv-bar-fill.wr { background: var(--pos-wr); }
.tv-bar-fill.te { background: var(--pos-te); }
.tv-value { font-family: var(--font-display); font-size: 14px; font-weight: 700; color: var(--ink); width: 36px; text-align: right; flex-shrink: 0; }
.tv-stats { display: flex; gap: 6px; flex-shrink: 0; }
.tv-stat { font-family: var(--font-mono); font-size: 11px; color: var(--ink-medium); text-align: center; width: 48px; }
.tv-stat-label { font-size: 9px; color: var(--ink-light); text-transform: uppercase; }
.tv-tier-badge {
  font-family: var(--font-display);
  font-size: 10px;
  font-weight: 700;
  padding: 2px 8px;
  border-radius: 5px;
  border: 2px solid;
  white-space: nowrap;
  flex-shrink: 0;
}
.tv-tier-badge.t1 { background: #ffeeba; color: #856404; border-color: #ffc107; }
.tv-tier-badge.t2 { background: var(--blue-light); color: #3a5abf; border-color: var(--blue); }
.tv-tier-badge.t3 { background: var(--green-light); color: #1a7a6d; border-color: var(--green); }
.tv-tier-badge.t4 { background: var(--orange-light); color: #a85a3a; border-color: var(--orange); }
.tv-tier-badge.t5 { background: var(--purple-light); color: #6b3fc7; border-color: var(--purple); }
.tv-tier-badge.t6 { background: var(--bg); color: var(--ink-medium); border-color: var(--ink-faint); }
.tv-tier-badge.t7 { background: var(--red-light); color: #a83240; border-color: var(--red); }
.tv-tier-badge.t8 { background: var(--ink-faint); color: var(--ink-medium); border-color: var(--ink-light); }

/* ===== VORP PANEL ===== */
.vorp-thresholds { display: flex; justify-content: center; gap: 12px; margin-bottom: 20px; flex-wrap: wrap; }
.vorp-threshold-chip {
  font-family: var(--font-mono);
  font-size: 12px;
  padding: 4px 10px;
  border: 2px solid var(--ink);
  border-radius: 6px;
  background: var(--bg-card);
  color: var(--ink-medium);
}
.vorp-threshold-chip .pos-label { font-family: var(--font-display); font-weight: 700; margin-right: 4px; }
.vorp-section { margin-bottom: 32px; }
.vorp-section-header {
  font-family: var(--font-display);
  font-size: 20px;
  font-weight: 700;
  color: var(--ink);
  margin-bottom: 12px;
  padding: 10px 14px;
  border: 3px solid var(--ink);
  border-radius: 10px;
  box-shadow: 4px 4px 0 var(--ink);
}
.vorp-section-header.winners { background: var(--green-light); }
.vorp-section-header.replacement { background: var(--red-light); }
.vorp-table {
  width: 100%;
  border-collapse: collapse;
  font-family: var(--font-mono);
  font-size: 13px;
  background: var(--bg-card);
  border: 3px solid var(--ink);
  border-radius: 10px;
  overflow: hidden;
  box-shadow: 4px 4px 0 var(--ink);
}
.vorp-table th {
  font-family: var(--font-display);
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  padding: 10px 8px;
  background: var(--bg-warm);
  color: var(--ink);
  border-bottom: 3px solid var(--ink);
  white-space: nowrap;
  cursor: pointer;
  user-select: none;
}
.vorp-table th.center, .vorp-table td.center { text-align: center; }
.vorp-table th.sorted { color: var(--orange); }
.vorp-table th .sort-arrow { font-size: 10px; margin-left: 2px; }
.vorp-table th:hover { background: var(--bg); }
.vorp-table td { padding: 8px; border-bottom: 1px solid var(--ink-faint); vertical-align: middle; }
.vorp-table tbody tr { cursor: pointer; transition: background 0.1s; }
.vorp-table tbody tr:hover { background: var(--bg-warm); }
.vorp-player-cell { display: flex; align-items: center; gap: 8px; min-width: 160px; }
.vorp-headshot { width: 32px; height: 32px; border-radius: 50%; border: 2px solid var(--ink); object-fit: cover; flex-shrink: 0; background: var(--bg-warm); }
.vorp-player-info { min-width: 0; }
.vorp-player-name { font-family: var(--font-display); font-size: 14px; font-weight: 700; color: var(--ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.vorp-player-meta { display: flex; align-items: center; gap: 5px; margin-top: 1px; }
.vorp-pos-badge { font-family: var(--font-display); font-size: 10px; font-weight: 700; padding: 1px 6px; border-radius: 5px; color: #fff; }
.vorp-pos-badge.qb { background: var(--pos-qb); }
.vorp-pos-badge.rb { background: var(--pos-rb); }
.vorp-pos-badge.wr { background: var(--pos-wr); }
.vorp-pos-badge.te { background: var(--pos-te); }
.vorp-team-label { font-family: var(--font-mono); font-size: 11px; color: var(--ink-medium); }
.vorp-badge {
  display: inline-block;
  font-family: var(--font-display);
  font-size: 13px;
  font-weight: 700;
  padding: 2px 10px;
  border-radius: 6px;
  border: 2px solid;
}
.vorp-badge.elite { background: var(--green-light); color: #1a7a6d; border-color: var(--green); }
.vorp-badge.starter { background: var(--blue-light); color: #3a5abf; border-color: var(--blue); }
.vorp-badge.flex { background: var(--yellow-light); color: #8a6d20; border-color: var(--yellow); }
.vorp-badge.fringe { background: var(--orange-light); color: #a85a3a; border-color: var(--orange); }
.vorp-badge.replacement { background: var(--red-light); color: #a83240; border-color: var(--red); }
.vorp-annotation { font-family: var(--font-hand); font-size: 14px; color: var(--ink-light); white-space: nowrap; }

/* ===== POSITIONAL ADVANTAGE PANEL ===== */
.pa-avgs { display: flex; justify-content: center; gap: 12px; margin-bottom: 16px; flex-wrap: wrap; }
.pa-avg-chip { font-family: var(--font-mono); font-size: 11px; padding: 3px 10px; border: 2px solid var(--ink); border-radius: 4px; background: var(--bg-card); }
.pa-avg-chip span { font-weight: 700; }
.pa-card { background: var(--bg-card); border: 3px solid var(--ink); border-radius: 10px; box-shadow: 4px 4px 0 var(--ink); overflow: hidden; }
.pa-card-header { font-family: var(--font-display); font-size: 18px; padding: 10px 16px; background: var(--ink); color: var(--bg); }
.pa-table { width: 100%; border-collapse: collapse; font-family: var(--font-mono); font-size: 12px; }
.pa-table th { background: var(--bg); padding: 6px 8px; text-align: right; font-size: 10px; font-weight: 700; border-bottom: 2px solid var(--ink-faint); white-space: nowrap; }
.pa-table th:first-child, .pa-table th:nth-child(2), .pa-table th:nth-child(3) { text-align: left; }
.pa-table td { padding: 6px 8px; text-align: right; border-bottom: 1px solid var(--ink-faint); }
.pa-table td:first-child, .pa-table td:nth-child(2), .pa-table td:nth-child(3) { text-align: left; }
.pa-table tbody tr:hover { background: rgba(217,119,87,0.08); }
.pa-rank { font-weight: 700; color: var(--ink-light); font-size: 11px; }
.pa-pos-badge { font-size: 10px; font-weight: 700; padding: 1px 5px; border-radius: 3px; color: #fff; }
.pa-adv-badge { font-family: var(--font-mono); font-size: 11px; font-weight: 700; padding: 1px 6px; border-radius: 3px; border: 2px solid; }
.pa-adv-pos { background: #dcfce7; color: #166534; border-color: #166534; }
.pa-adv-neg { background: #fef2f2; color: #991b1b; border-color: #991b1b; }
.pa-bar { display: inline-block; height: 10px; border-radius: 5px; vertical-align: middle; margin-left: 4px; }

/* ===== AUCTION VALUES PANEL ===== */
.av-controls label { font-family: var(--font-mono); font-size: 12px; color: var(--ink-light); }
.av-controls input[type="range"] { width: 120px; accent-color: var(--orange); }
.av-budget-display { font-family: var(--font-display); font-size: 20px; color: var(--orange); min-width: 50px; text-align: center; }
.av-summary { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 24px; }
.av-sum-card { background: var(--bg-card); border: 3px solid var(--ink); border-radius: 12px; box-shadow: 4px 4px 0 var(--ink); padding: 12px; text-align: center; }
.av-sum-pos { font-family: var(--font-display); font-size: 16px; margin-bottom: 4px; }
.av-sum-pos.QB { color: var(--pos-qb); }
.av-sum-pos.RB { color: var(--pos-rb); }
.av-sum-pos.WR { color: var(--pos-wr); }
.av-sum-pos.TE { color: var(--pos-te); }
.av-sum-stat { font-family: var(--font-mono); font-size: 11px; color: var(--ink-light); line-height: 1.6; }
.av-sum-big { font-family: var(--font-display); font-size: 24px; color: var(--ink); }
.av-table-wrap { overflow-x: auto; }
.av-table { width: 100%; border-collapse: collapse; font-family: var(--font-mono); font-size: 13px; }
.av-table th { font-family: var(--font-display); font-size: 12px; text-transform: uppercase; letter-spacing: 0.5px; padding: 8px 10px; border-bottom: 3px solid var(--ink); text-align: left; cursor: pointer; white-space: nowrap; user-select: none; }
.av-table th:hover { color: var(--orange); }
.av-table td { padding: 8px 10px; border-bottom: 1px solid var(--ink-faint); white-space: nowrap; }
.av-table tr:hover { background: rgba(217,119,87,0.08); }
.av-pos-badge { display: inline-block; font-family: var(--font-display); font-size: 11px; padding: 2px 8px; border-radius: 10px; color: white; min-width: 28px; text-align: center; }
.av-pos-badge.QB { background: var(--pos-qb); }
.av-pos-badge.RB { background: var(--pos-rb); }
.av-pos-badge.WR { background: var(--pos-wr); }
.av-pos-badge.TE { background: var(--pos-te); }
.av-dollar { font-family: var(--font-display); font-size: 16px; color: var(--ink); }
.av-dollar.premium { color: #d44040; }
.av-dollar.starter { color: var(--orange); }
.av-dollar.value { color: var(--pos-rb); }
.av-dollar.bargain { color: var(--pos-qb); }
.av-dollar.dollar-tier { color: var(--ink-light); }
.av-tv-bar { width: 80px; height: 8px; background: var(--ink-faint); border-radius: 4px; display: inline-block; vertical-align: middle; margin-right: 6px; }
.av-tv-fill { height: 100%; border-radius: 4px; background: var(--orange); }
.av-tier-badge { display: inline-block; font-family: var(--font-mono); font-size: 10px; padding: 2px 6px; border-radius: 8px; border: 2px solid; }
.av-tier-badge.premium { background: rgba(212,64,64,0.12); color: #d44040; border-color: #d44040; }
.av-tier-badge.starter { background: rgba(217,119,87,0.12); color: var(--orange); border-color: var(--orange); }
.av-tier-badge.value { background: rgba(46,196,182,0.12); color: var(--pos-rb); border-color: var(--pos-rb); }
.av-tier-badge.bargain { background: rgba(91,127,255,0.12); color: var(--pos-qb); border-color: var(--pos-qb); }
.av-tier-badge.dollar-tier { background: rgba(0,0,0,0.06); color: var(--ink-light); border-color: var(--ink-faint); }

/* ===== CHEAT SHEET PANEL ===== */
.cs-fmt-tabs { display: flex; gap: 6px; }
.cs-fmt-tab {
  padding: 6px 16px;
  font-family: var(--font-display);
  font-size: 13px;
  border: 2px solid var(--ink);
  border-radius: 20px;
  background: var(--bg-card);
  color: var(--ink);
  cursor: pointer;
  transition: all 0.15s;
}
.cs-fmt-tab:hover { background: var(--bg-warm); }
.cs-fmt-tab.active { background: var(--ink); color: var(--bg-card); }
.cs-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
  align-items: start;
}
.cs-col {
  background: var(--bg-card);
  border: 3px solid var(--ink);
  border-radius: 12px;
  box-shadow: 4px 4px 0 var(--ink);
  overflow: hidden;
}
.cs-col-header {
  padding: 10px 12px;
  font-family: var(--font-display);
  font-size: 16px;
  color: #fff;
  text-align: center;
  font-weight: 700;
}
.cs-col-header.QB { background: var(--pos-qb); }
.cs-col-header.RB { background: var(--pos-rb); }
.cs-col-header.WR { background: var(--pos-wr); }
.cs-col-header.TE { background: var(--pos-te); }
.cs-tier-break {
  padding: 4px 12px;
  font-family: var(--font-display);
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 1px;
  background: var(--bg-warm);
  color: var(--ink-medium);
  border-top: 2px dashed var(--ink-faint);
  border-bottom: 2px dashed var(--ink-faint);
}
.cs-player {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 5px 10px;
  border-bottom: 1px solid var(--ink-faint);
  font-family: var(--font-mono);
  font-size: 11px;
  cursor: pointer;
  transition: background 0.1s;
}
.cs-player:hover { background: var(--bg-warm); }
.cs-player:last-child { border-bottom: none; }
.cs-rank { font-weight: 700; color: var(--ink-light); min-width: 18px; text-align: right; }
.cs-pname { flex: 1; font-weight: 600; color: var(--ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cs-team { color: var(--ink-light); font-size: 10px; }
.cs-ppg { font-weight: 700; color: var(--orange); min-width: 32px; text-align: right; }

/* ===== RESPONSIVE ===== */
@media (max-width: 768px) {
  .rankings-grid { grid-template-columns: 1fr; }
  .tl-tier { flex-direction: column; }
  .tl-tier-label { flex-direction: row; min-width: auto; border-right: none; border-bottom: 3px solid var(--ink); padding: 8px 16px; gap: 8px; }
  .tl-tier-letter { font-size: 24px; }
  .tl-tier-desc { max-width: none; }
  .tv-player-info { width: 100px; }
  .tv-player-name { font-size: 12px; }
  .tv-headshot { width: 28px; height: 28px; }
  .tv-stats { display: none; }
  .tv-rank { width: 24px; font-size: 12px; }
  .vorp-table { font-size: 12px; }
  .vorp-player-cell { min-width: 120px; }
  .vorp-headshot { width: 28px; height: 28px; }
  .vorp-player-name { font-size: 12px; }
  .pa-table { font-size: 11px; }
  .av-summary { grid-template-columns: repeat(2, 1fr); }
  .cs-grid { grid-template-columns: 1fr 1fr; }
  .hide-mobile { display: none !important; }
  /* Dynasty History mobile */
  .dh-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .dh-table th, .dh-table td { padding: 4px; font-size: 11px; white-space: nowrap; }
  .dh-player-cell { min-width: 140px; }
  .dh-headshot { width: 24px; height: 24px; }
  .dh-name { font-size: 12px; }
  /* View toggle touch targets */
  .lp-view-btn { min-height: 44px; min-width: 44px; padding: 8px 14px; font-size: 13px; }
  /* Weight sliders stack */
  .tv-methodology { flex-direction: column; align-items: stretch; gap: 8px; }
  .tv-weight-slider { flex-wrap: wrap; }
  .tv-weight-slider input[type="range"] { width: 100%; min-height: 44px; }
  /* Search bars */
  .lp-search { min-height: 44px; font-size: 14px; }
}
@media (max-width: 480px) {
  .lp-page { padding: 16px 10px 40px; }
  .rankings-card { padding: 10px 8px; gap: 8px; }
  .rankings-rank { font-size: 13px; min-width: 22px; }
  .rankings-name { font-size: 13px; }
  .rankings-value { font-size: 14px; }
  .tv-tier-badge { display: none; }
  .tv-methodology { display: flex; flex-direction: column; }
  .tv-weight-slider label { min-width: 100px; font-size: 12px; }
  .tv-weight-slider input[type="range"] { width: 100%; }
  .av-summary { grid-template-columns: 1fr; }
  .cs-grid { grid-template-columns: 1fr; }
}

/* ===================================================================
   DISCOVERY PANELS (6 panels)
   breakouts, buysell, stocks, waivers, scarcity, handcuffs
   =================================================================== */

/* ===== BREAKOUTS ===== */
.breakouts-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
  gap: 16px;
}
.breakout-card {
  background: var(--bg-card);
  border: 3px solid var(--ink);
  border-radius: 12px;
  box-shadow: 4px 4px 0 var(--ink);
  overflow: hidden;
  transition: all 0.15s;
  cursor: pointer;
}
.breakout-card:hover {
  transform: translate(-2px, -2px);
  box-shadow: 6px 6px 0 var(--ink);
}
.breakout-card-top { height: 6px; }
.breakout-card-top.qb { background: var(--pos-qb); }
.breakout-card-top.rb { background: var(--pos-rb); }
.breakout-card-top.wr { background: var(--pos-wr); }
.breakout-card-top.te { background: var(--pos-te); }
.breakout-card-body { padding: 14px; }
.breakout-card-row1 {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 10px;
}
.breakout-rank {
  font-family: var(--font-display);
  font-size: 20px;
  font-weight: 700;
  color: var(--ink-light);
  min-width: 28px;
  text-align: center;
}
.breakout-headshot {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  border: 2px solid var(--ink);
  object-fit: cover;
  flex-shrink: 0;
  background: var(--bg-warm);
}
.breakout-info { flex: 1; min-width: 0; }
.breakout-name {
  font-family: var(--font-display);
  font-size: 16px;
  font-weight: 700;
  color: var(--ink);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.breakout-meta {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 2px;
}
.breakout-pos-badge {
  font-family: var(--font-display);
  font-size: 11px;
  font-weight: 700;
  padding: 1px 8px;
  border-radius: 6px;
  color: #fff;
}
.breakout-pos-badge.qb { background: var(--pos-qb); }
.breakout-pos-badge.rb { background: var(--pos-rb); }
.breakout-pos-badge.wr { background: var(--pos-wr); }
.breakout-pos-badge.te { background: var(--pos-te); }
.breakout-team {
  font-family: var(--font-mono);
  font-size: 12px;
  color: var(--ink-medium);
}
.breakout-age-badge {
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 700;
  padding: 1px 6px;
  border-radius: 4px;
  border: 2px solid;
}
.breakout-age-badge.young { background: #d9efec; color: #1a7a6d; border-color: #2ec4b6; }
.breakout-age-badge.prime { background: #f5eacc; color: #8a6d20; border-color: #ffc857; }
.breakout-age-badge.aging { background: #f2d5d8; color: #a83240; border-color: #e63946; }
.breakout-rbs { text-align: right; flex-shrink: 0; }
.breakout-rbs-score {
  font-family: var(--font-mono);
  font-size: 22px;
  font-weight: 700;
  color: var(--orange);
}
.breakout-rbs-label {
  font-family: var(--font-mono);
  font-size: 10px;
  color: var(--ink-light);
  text-transform: uppercase;
}
.breakout-bars { margin-bottom: 10px; }
.breakout-bar-group { margin-bottom: 6px; }
.breakout-bar-label {
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--ink-medium);
  margin-bottom: 2px;
  display: flex;
  justify-content: space-between;
}
.breakout-bar-track {
  height: 14px;
  background: var(--bg-warm);
  border-radius: 4px;
  border: 2px solid var(--ink-faint);
  position: relative;
  overflow: hidden;
}
.breakout-bar-fill {
  height: 100%;
  border-radius: 3px;
  transition: width 0.3s ease;
}
.breakout-bar-fill.opportunity { background: var(--green); opacity: 0.8; }
.breakout-bar-fill.production { background: var(--ink-light); opacity: 0.6; }
.breakout-gap {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  margin-bottom: 8px;
  padding: 4px 0;
  border-top: 2px dashed var(--ink-faint);
  border-bottom: 2px dashed var(--ink-faint);
}
.breakout-gap-arrow { font-size: 16px; color: var(--green); }
.breakout-gap-text {
  font-family: var(--font-hand);
  font-size: 16px;
  color: var(--ink-medium);
}
.breakout-stats { display: flex; gap: 10px; flex-wrap: wrap; }
.breakout-stat { flex: 1; min-width: 60px; text-align: center; }
.breakout-stat-val {
  font-family: var(--font-mono);
  font-size: 14px;
  font-weight: 700;
  color: var(--ink);
}
.breakout-stat-key {
  font-family: var(--font-mono);
  font-size: 10px;
  color: var(--ink-light);
  text-transform: uppercase;
}

/* ===== BUYSELL ===== */
.buysell-columns {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
}
.buysell-column { min-width: 0; }
.buysell-column-header {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 16px;
  padding: 10px 14px;
  border: 3px solid var(--ink);
  border-radius: 10px;
  box-shadow: 4px 4px 0 var(--ink);
}
.buysell-column-header.buy { background: var(--green-light); }
.buysell-column-header.sell { background: var(--red-light); }
.buysell-column-arrow { font-size: 24px; line-height: 1; }
.buysell-column-arrow.buy { color: var(--green); }
.buysell-column-arrow.sell { color: var(--red); }
.buysell-column-title {
  font-family: var(--font-display);
  font-size: 20px;
  font-weight: 700;
  color: var(--ink);
}
.buysell-column-note {
  font-family: var(--font-hand);
  font-size: 16px;
  color: var(--ink-light);
  margin-left: auto;
}
.buysell-list { display: flex; flex-direction: column; gap: 12px; }
.buysell-card {
  background: var(--bg-card);
  border: 3px solid var(--ink);
  border-radius: 12px;
  box-shadow: 4px 4px 0 var(--ink);
  overflow: hidden;
  transition: all 0.15s;
  cursor: pointer;
}
.buysell-card:hover {
  transform: translate(-2px, -2px);
  box-shadow: 6px 6px 0 var(--ink);
}
.buysell-card-top { height: 6px; }
.buysell-card-top.qb { background: var(--pos-qb); }
.buysell-card-top.rb { background: var(--pos-rb); }
.buysell-card-top.wr { background: var(--pos-wr); }
.buysell-card-top.te { background: var(--pos-te); }
.buysell-card-body { padding: 12px 14px; }
.buysell-card-row1 {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 8px;
}
.buysell-rank {
  font-family: var(--font-display);
  font-size: 18px;
  font-weight: 700;
  color: var(--ink-light);
  min-width: 24px;
  text-align: center;
}
.buysell-headshot {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  border: 2px solid var(--ink);
  object-fit: cover;
  flex-shrink: 0;
  background: var(--bg-warm);
}
.buysell-info { flex: 1; min-width: 0; }
.buysell-name {
  font-family: var(--font-display);
  font-size: 15px;
  font-weight: 700;
  color: var(--ink);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.buysell-meta { display: flex; align-items: center; gap: 6px; margin-top: 2px; }
.buysell-pos-badge {
  font-family: var(--font-display);
  font-size: 11px;
  font-weight: 700;
  padding: 1px 8px;
  border-radius: 6px;
  color: #fff;
}
.buysell-pos-badge.qb { background: var(--pos-qb); }
.buysell-pos-badge.rb { background: var(--pos-rb); }
.buysell-pos-badge.wr { background: var(--pos-wr); }
.buysell-pos-badge.te { background: var(--pos-te); }
.buysell-team {
  font-family: var(--font-mono);
  font-size: 12px;
  color: var(--ink-medium);
}
.buysell-age-badge {
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 700;
  padding: 1px 6px;
  border-radius: 4px;
  border: 2px solid;
}
.buysell-age-badge.young { background: #d9efec; color: #1a7a6d; border-color: #2ec4b6; }
.buysell-age-badge.prime { background: #f5eacc; color: #8a6d20; border-color: #ffc857; }
.buysell-age-badge.aging { background: #f2d5d8; color: #a83240; border-color: #e63946; }
.buysell-age-badge.veteran { background: #f2d5d8; color: #a83240; border-color: #e63946; }
.buysell-badges {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  flex-shrink: 0;
}
.buysell-grade {
  font-family: var(--font-mono);
  font-size: 18px;
  font-weight: 700;
  min-width: 36px;
  text-align: center;
  padding: 2px 6px;
  border-radius: 6px;
  border: 2px solid var(--ink);
}
.buysell-grade.grade-a { background: #d9efec; color: #1a7a6d; }
.buysell-grade.grade-b { background: #dde4f7; color: #3a5abf; }
.buysell-grade.grade-c { background: #f5eacc; color: #8a6d20; }
.buysell-grade.grade-d { background: #f7e4d8; color: #a85a3a; }
.buysell-grade.grade-f { background: #f2d5d8; color: #a83240; }
.buysell-grade-label {
  font-family: var(--font-mono);
  font-size: 9px;
  color: var(--ink-light);
  text-transform: uppercase;
  letter-spacing: 0.5px;
}
.buysell-mismatch { margin-bottom: 6px; }
.buysell-mismatch-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 2px;
}
.buysell-mismatch-label {
  font-family: var(--font-mono);
  font-size: 10px;
  color: var(--ink-medium);
  text-transform: uppercase;
}
.buysell-mismatch-val {
  font-family: var(--font-mono);
  font-size: 12px;
  font-weight: 700;
}
.buysell-mismatch-val.buy { color: var(--green); }
.buysell-mismatch-val.sell { color: var(--red); }
.buysell-mismatch-track {
  height: 8px;
  background: var(--bg-warm);
  border-radius: 4px;
  border: 2px solid var(--ink-faint);
  overflow: hidden;
}
.buysell-mismatch-fill {
  height: 100%;
  border-radius: 3px;
  transition: width 0.3s ease;
}
.buysell-mismatch-fill.buy { background: var(--green); opacity: 0.7; }
.buysell-mismatch-fill.sell { background: var(--red); opacity: 0.7; }
.buysell-annotation {
  font-family: var(--font-hand);
  font-size: 15px;
  color: var(--ink-light);
  padding: 4px 0;
  border-top: 2px dashed var(--ink-faint);
  margin-bottom: 6px;
}
.buysell-stats { display: flex; gap: 8px; flex-wrap: wrap; }
.buysell-stat { flex: 1; min-width: 50px; text-align: center; }
.buysell-stat-val {
  font-family: var(--font-mono);
  font-size: 13px;
  font-weight: 700;
  color: var(--ink);
}
.buysell-stat-key {
  font-family: var(--font-mono);
  font-size: 9px;
  color: var(--ink-light);
  text-transform: uppercase;
}

/* ===== STOCKS ===== */
.stk-section { margin-bottom: 32px; }
.stk-section-header {
  font-family: var(--font-display);
  font-size: 20px;
  font-weight: 700;
  color: var(--ink);
  margin-bottom: 12px;
  padding: 10px 14px;
  border: 3px solid var(--ink);
  border-radius: 10px;
  box-shadow: 4px 4px 0 var(--ink);
}
.stk-section-header.rising { background: var(--green-light); }
.stk-section-header.falling { background: var(--red-light); }
.stk-section-icon { font-size: 20px; margin-right: 4px; }
.stk-section-icon.rising { color: var(--green); }
.stk-section-icon.falling { color: var(--red); }
.stk-table {
  width: 100%;
  border-collapse: collapse;
  font-family: var(--font-mono);
  font-size: 13px;
  background: var(--bg-card);
  border: 3px solid var(--ink);
  border-radius: 10px;
  overflow: hidden;
  box-shadow: 4px 4px 0 var(--ink);
}
.stk-table th {
  font-family: var(--font-display);
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  padding: 10px 8px;
  background: var(--bg-warm);
  color: var(--ink);
  border-bottom: 3px solid var(--ink);
  white-space: nowrap;
  cursor: pointer;
  user-select: none;
}
.stk-table th.center, .stk-table td.center { text-align: center; }
.stk-table th.sorted { color: var(--orange); }
.stk-table th .sort-arrow { font-size: 10px; margin-left: 2px; }
.stk-table th:hover { background: var(--bg); }
.stk-table td {
  padding: 8px;
  border-bottom: 1px solid var(--ink-faint);
  vertical-align: middle;
}
.stk-table tbody tr { cursor: pointer; transition: background 0.1s; }
.stk-table tbody tr:hover { background: var(--bg-warm); }
.stk-player-cell {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 160px;
}
.stk-headshot {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  border: 2px solid var(--ink);
  object-fit: cover;
  flex-shrink: 0;
  background: var(--bg-warm);
}
.stk-player-info { min-width: 0; }
.stk-player-name {
  font-family: var(--font-display);
  font-size: 14px;
  font-weight: 700;
  color: var(--ink);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.stk-player-meta { display: flex; align-items: center; gap: 5px; margin-top: 1px; }
.stk-pos-badge {
  font-family: var(--font-display);
  font-size: 10px;
  font-weight: 700;
  padding: 1px 6px;
  border-radius: 5px;
  color: #fff;
}
.stk-pos-badge.qb { background: var(--pos-qb); }
.stk-pos-badge.rb { background: var(--pos-rb); }
.stk-pos-badge.wr { background: var(--pos-wr); }
.stk-pos-badge.te { background: var(--pos-te); }
.stk-team-label {
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--ink-medium);
}
.stk-score-badge {
  display: inline-block;
  font-family: var(--font-display);
  font-size: 14px;
  font-weight: 700;
  padding: 2px 10px;
  border-radius: 6px;
  border: 2px solid;
  min-width: 32px;
  text-align: center;
}
.stk-score-badge.elite { background: var(--green-light); color: #1a7a6d; border-color: var(--green); }
.stk-score-badge.good { background: var(--blue-light); color: #3a5abf; border-color: var(--blue); }
.stk-score-badge.avg { background: var(--yellow-light); color: #8a6d20; border-color: var(--yellow); }
.stk-score-badge.below { background: var(--orange-light); color: #a85a3a; border-color: var(--orange); }
.stk-score-badge.poor { background: var(--red-light); color: #a83240; border-color: var(--red); }
.stk-grade-badge {
  display: inline-block;
  font-family: var(--font-display);
  font-size: 12px;
  font-weight: 700;
  padding: 1px 7px;
  border-radius: 5px;
  border: 2px solid;
}
.stk-grade-badge.grade-aplus { background: var(--green-light); color: #1a7a6d; border-color: var(--green); }
.stk-grade-badge.grade-a { background: var(--green-light); color: #1a7a6d; border-color: var(--green); }
.stk-grade-badge.grade-b { background: var(--blue-light); color: #3a5abf; border-color: var(--blue); }
.stk-grade-badge.grade-c { background: var(--yellow-light); color: #8a6d20; border-color: var(--yellow); }
.stk-grade-badge.grade-d { background: var(--orange-light); color: #a85a3a; border-color: var(--orange); }
.stk-grade-badge.grade-f { background: var(--red-light); color: #a83240; border-color: var(--red); }
.stk-annotation {
  font-family: var(--font-hand);
  font-size: 14px;
  color: var(--ink-light);
  white-space: nowrap;
}

/* ===== WAIVERS ===== */
.ww-card {
  background: var(--bg-card);
  border: 3px solid var(--ink);
  border-radius: 10px;
  box-shadow: 4px 4px 0 var(--ink);
  overflow: hidden;
}
.ww-card-header {
  font-family: var(--font-display);
  font-size: 18px;
  padding: 10px 16px;
  background: #166534;
  color: #fff;
}
.ww-table {
  width: 100%;
  border-collapse: collapse;
  font-family: var(--font-mono);
  font-size: 12px;
}
.ww-table th {
  background: var(--bg-warm);
  padding: 6px 8px;
  text-align: right;
  font-size: 10px;
  font-weight: 700;
  border-bottom: 2px solid var(--ink-faint);
  cursor: pointer;
  user-select: none;
  white-space: nowrap;
}
.ww-table th:first-child, .ww-table th:nth-child(2) { text-align: left; }
.ww-table td {
  padding: 6px 8px;
  text-align: right;
  border-bottom: 1px solid var(--ink-faint);
}
.ww-table td:first-child, .ww-table td:nth-child(2) { text-align: left; }
.ww-table tbody tr:hover { background: rgba(217,119,87,0.08); }
.ww-delta-badge {
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 700;
  padding: 1px 6px;
  border-radius: 3px;
  border: 2px solid;
  white-space: nowrap;
  background: #dcfce7;
  color: #166534;
  border-color: #166534;
}
.ww-pos-badge {
  font-size: 10px;
  font-weight: 700;
  padding: 1px 5px;
  border-radius: 3px;
  color: #fff;
  margin-left: 4px;
}
.ww-recent { display: flex; gap: 2px; align-items: flex-end; height: 20px; }
.ww-recent-bar { width: 8px; border-radius: 2px 2px 0 0; min-height: 2px; }
.ww-rank { font-weight: 700; color: var(--ink-light); font-size: 11px; }

/* ===== SCARCITY ===== */
.scarcity-summary {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  margin-bottom: 28px;
}
.scarcity-summary-card {
  background: var(--bg-card);
  border: 3px solid var(--ink);
  border-radius: 12px;
  box-shadow: 4px 4px 0 var(--ink);
  padding: 14px;
  text-align: center;
  transition: all 0.15s;
}
.scarcity-summary-card:hover {
  transform: translate(-2px, -2px);
  box-shadow: 6px 6px 0 var(--ink);
}
.scarcity-summary-pos {
  font-family: var(--font-display);
  font-size: 14px;
  font-weight: 700;
  display: inline-block;
  padding: 2px 10px;
  border-radius: 6px;
  color: #fff;
  margin-bottom: 6px;
}
.scarcity-summary-pos.qb { background: var(--pos-qb); }
.scarcity-summary-pos.rb { background: var(--pos-rb); }
.scarcity-summary-pos.wr { background: var(--pos-wr); }
.scarcity-summary-pos.te { background: var(--pos-te); }
.scarcity-summary-dropoff {
  font-family: var(--font-mono);
  font-size: 24px;
  font-weight: 700;
  color: var(--ink);
}
.scarcity-summary-label {
  font-family: var(--font-hand);
  font-size: 16px;
  color: var(--ink-light);
  margin-top: 2px;
}
.scarcity-summary-range {
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--ink-light);
  margin-top: 4px;
}
.scarcity-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}
.scarcity-card {
  background: var(--bg-card);
  border: 3px solid var(--ink);
  border-radius: 12px;
  box-shadow: 4px 4px 0 var(--ink);
  overflow: hidden;
  transition: all 0.15s;
}
.scarcity-card:hover {
  transform: translate(-2px, -2px);
  box-shadow: 6px 6px 0 var(--ink);
}
.scarcity-card-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 14px;
  border-bottom: 2px dashed var(--ink-faint);
}
.scarcity-card-header.qb { background: var(--blue-light); }
.scarcity-card-header.rb { background: var(--green-light); }
.scarcity-card-header.wr { background: var(--orange-light); }
.scarcity-card-header.te { background: var(--purple-light); }
.scarcity-card-title {
  font-family: var(--font-display);
  font-size: 18px;
  font-weight: 700;
  color: var(--ink);
}
.scarcity-card-annotation {
  font-family: var(--font-hand);
  font-size: 16px;
  color: var(--ink-light);
}
.scarcity-chart { padding: 12px 14px 8px; }
.scarcity-bar-row {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 3px;
  cursor: pointer;
  border-radius: 4px;
  padding: 2px 4px;
  transition: background 0.1s;
}
.scarcity-bar-row:hover { background: var(--bg-warm); }
.scarcity-bar-rank {
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 700;
  color: var(--ink-light);
  min-width: 22px;
  text-align: right;
  flex-shrink: 0;
}
.scarcity-bar-name {
  font-family: var(--font-display);
  font-size: 12px;
  color: var(--ink);
  min-width: 100px;
  max-width: 100px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  flex-shrink: 0;
}
.scarcity-bar-track {
  flex: 1;
  height: 18px;
  background: var(--bg);
  border-radius: 4px;
  position: relative;
  overflow: hidden;
  border: 2px solid var(--ink-faint);
}
.scarcity-bar-fill {
  height: 100%;
  border-radius: 3px;
  transition: width 0.4s ease;
}
.scarcity-bar-fill.qb { background: var(--pos-qb); }
.scarcity-bar-fill.rb { background: var(--pos-rb); }
.scarcity-bar-fill.wr { background: var(--pos-wr); }
.scarcity-bar-fill.te { background: var(--pos-te); }
.scarcity-bar-ppg {
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 700;
  color: var(--ink);
  min-width: 36px;
  text-align: right;
  flex-shrink: 0;
}
.scarcity-tier-break {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 6px 0;
  padding: 2px 4px;
}
.scarcity-tier-line { flex: 1; border-top: 2px dashed var(--ink-faint); }
.scarcity-tier-label {
  font-family: var(--font-hand);
  font-size: 14px;
  color: var(--ink-light);
  white-space: nowrap;
}

/* ===== HANDCUFFS ===== */
.hc-card {
  background: var(--bg-card);
  border: 3px solid var(--ink);
  border-radius: 10px;
  box-shadow: 4px 4px 0 var(--ink);
  overflow: hidden;
}
.hc-card-header {
  font-family: var(--font-display);
  font-size: 18px;
  padding: 10px 16px;
  background: var(--green);
  color: #fff;
}
.hc-table {
  width: 100%;
  border-collapse: collapse;
  font-family: var(--font-mono);
  font-size: 12px;
}
.hc-table th {
  background: var(--bg-warm);
  padding: 6px 8px;
  text-align: right;
  font-size: 10px;
  font-weight: 700;
  border-bottom: 2px solid var(--ink-faint);
  white-space: nowrap;
}
.hc-table th:first-child, .hc-table th:nth-child(2), .hc-table th:nth-child(3) { text-align: left; }
.hc-table td {
  padding: 6px 8px;
  text-align: right;
  border-bottom: 1px solid var(--ink-faint);
}
.hc-table td:first-child, .hc-table td:nth-child(2), .hc-table td:nth-child(3) { text-align: left; }
.hc-table tbody tr:hover { background: rgba(217,119,87,0.08); }
.hc-rank { font-weight: 700; color: var(--ink-light); font-size: 11px; }
.hc-team-badge {
  font-size: 10px;
  font-weight: 700;
  padding: 1px 5px;
  border-radius: 3px;
  background: var(--green);
  color: #fff;
}
.hc-value-badge {
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 700;
  padding: 1px 6px;
  border-radius: 3px;
  border: 2px solid;
  background: #dcfce7;
  color: #166534;
  border-color: #166534;
}
.hc-starter { color: var(--ink-light); font-size: 11px; }

/* ===== DISCOVERY RESPONSIVE ===== */
@media (max-width: 768px) {
  .breakouts-grid { grid-template-columns: 1fr; }
  .buysell-columns { grid-template-columns: 1fr; gap: 20px; }
  .stk-table { font-size: 12px; }
  .stk-table .hide-mobile { display: none !important; }
  .stk-player-cell { min-width: 120px; }
  .stk-headshot { width: 28px; height: 28px; }
  .stk-player-name { font-size: 12px; }
  .scarcity-summary { grid-template-columns: repeat(2, 1fr); }
  .scarcity-grid { grid-template-columns: 1fr; }
  .scarcity-bar-name { min-width: 70px; max-width: 70px; font-size: 11px; }
  .hc-table { font-size: 11px; }
}
@media (max-width: 480px) {
  .breakout-card-body { padding: 10px; }
  .breakout-stats { gap: 6px; }
  .buysell-card-body { padding: 10px; }
  .buysell-stats { gap: 4px; }
  .buysell-column-note { display: none; }
  .scarcity-summary { grid-template-columns: 1fr 1fr; gap: 8px; }
  .scarcity-bar-name { min-width: 55px; max-width: 55px; }
}

/* ===================================================================
   PERFORMANCE PANELS (8 panels)
   =================================================================== */

/* ===== EFFICIENCY ===== */
.eff-section { margin-bottom: 32px; }
.eff-section-header {
  font-family: var(--font-display);
  font-size: 20px;
  font-weight: 700;
  color: var(--ink);
  margin-bottom: 12px;
  padding: 10px 14px;
  border: 3px solid var(--ink);
  border-radius: 10px;
  box-shadow: 4px 4px 0 var(--ink);
}
.eff-section-header.efficient { background: var(--green-light); }
.eff-section-header.volume { background: var(--orange-light); }
.eff-section-icon { font-size: 20px; margin-right: 4px; }
.eff-section-icon.efficient { color: var(--green); }
.eff-section-icon.volume { color: var(--orange); }
.eff-table {
  width: 100%;
  border-collapse: collapse;
  font-family: var(--font-mono);
  font-size: 13px;
  background: var(--bg-card);
  border: 3px solid var(--ink);
  border-radius: 10px;
  overflow: hidden;
  box-shadow: 4px 4px 0 var(--ink);
}
.eff-table th {
  font-family: var(--font-display);
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  padding: 10px 8px;
  background: var(--bg-warm);
  color: var(--ink);
  border-bottom: 3px solid var(--ink);
  white-space: nowrap;
  cursor: pointer;
  user-select: none;
}
.eff-table th.center, .eff-table td.center { text-align: center; }
.eff-table th.sorted { color: var(--orange); }
.eff-table th .sort-arrow { font-size: 10px; margin-left: 2px; }
.eff-table th:hover { background: var(--bg); }
.eff-table td {
  padding: 8px;
  border-bottom: 1px solid var(--ink-faint);
  vertical-align: middle;
}
.eff-table tbody tr { cursor: pointer; transition: background 0.1s; }
.eff-table tbody tr:hover { background: var(--bg-warm); }
.eff-player-cell { display: flex; align-items: center; gap: 8px; min-width: 160px; }
.eff-headshot {
  width: 32px; height: 32px; border-radius: 50%;
  border: 2px solid var(--ink); object-fit: cover; flex-shrink: 0; background: var(--bg-warm);
}
.eff-player-info { min-width: 0; }
.eff-player-name {
  font-family: var(--font-display); font-size: 14px; font-weight: 700;
  color: var(--ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.eff-player-meta { display: flex; align-items: center; gap: 5px; margin-top: 1px; }
.eff-pos-badge {
  font-family: var(--font-display); font-size: 10px; font-weight: 700;
  padding: 1px 6px; border-radius: 5px; color: #fff;
}
.eff-pos-badge.qb { background: var(--pos-qb); }
.eff-pos-badge.rb { background: var(--pos-rb); }
.eff-pos-badge.wr { background: var(--pos-wr); }
.eff-pos-badge.te { background: var(--pos-te); }
.eff-team-label { font-family: var(--font-mono); font-size: 11px; color: var(--ink-medium); }
.eff-grade-badge {
  display: inline-block; font-family: var(--font-display); font-size: 13px;
  font-weight: 700; padding: 2px 10px; border-radius: 6px; border: 2px solid;
}
.eff-grade-badge.grade-aplus { background: var(--green-light); color: #1a7a6d; border-color: var(--green); }
.eff-grade-badge.grade-a { background: var(--green-light); color: #1a7a6d; border-color: var(--green); }
.eff-grade-badge.grade-b { background: var(--blue-light); color: #3a5abf; border-color: var(--blue); }
.eff-grade-badge.grade-c { background: var(--yellow-light); color: #8a6d20; border-color: var(--yellow); }
.eff-grade-badge.grade-d { background: var(--orange-light); color: #a85a3a; border-color: var(--orange); }
.eff-grade-badge.grade-f { background: var(--red-light); color: #a83240; border-color: var(--red); }

/* ===== CONSISTENCY ===== */
.con-section { margin-bottom: 32px; }
.con-section-header {
  font-family: var(--font-display); font-size: 20px; font-weight: 700;
  color: var(--ink); margin-bottom: 12px; padding: 10px 14px;
  border: 3px solid var(--ink); border-radius: 10px; box-shadow: 4px 4px 0 var(--ink);
}
.con-section-header.solid { background: var(--green-light); }
.con-section-header.wild { background: var(--red-light); }
.con-section-icon { font-size: 20px; margin-right: 4px; }
.con-section-icon.solid { color: var(--green); }
.con-section-icon.wild { color: var(--red); }
.con-table {
  width: 100%; border-collapse: collapse; font-family: var(--font-mono); font-size: 13px;
  background: var(--bg-card); border: 3px solid var(--ink); border-radius: 10px;
  overflow: hidden; box-shadow: 4px 4px 0 var(--ink);
}
.con-table th {
  font-family: var(--font-display); font-size: 11px; font-weight: 700;
  text-transform: uppercase; letter-spacing: 0.5px; padding: 10px 8px;
  background: var(--bg-warm); color: var(--ink); border-bottom: 3px solid var(--ink);
  white-space: nowrap; cursor: pointer; user-select: none;
}
.con-table th.center, .con-table td.center { text-align: center; }
.con-table th.sorted { color: var(--orange); }
.con-table th .sort-arrow { font-size: 10px; margin-left: 2px; }
.con-table th:hover { background: var(--bg); }
.con-table td { padding: 8px; border-bottom: 1px solid var(--ink-faint); vertical-align: middle; }
.con-table tbody tr { cursor: pointer; transition: background 0.1s; }
.con-table tbody tr:hover { background: var(--bg-warm); }
.con-player-cell { display: flex; align-items: center; gap: 8px; min-width: 160px; }
.con-headshot {
  width: 32px; height: 32px; border-radius: 50%;
  border: 2px solid var(--ink); object-fit: cover; flex-shrink: 0; background: var(--bg-warm);
}
.con-player-info { min-width: 0; }
.con-player-name {
  font-family: var(--font-display); font-size: 14px; font-weight: 700;
  color: var(--ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.con-player-meta { display: flex; align-items: center; gap: 5px; margin-top: 1px; }
.con-pos-badge {
  font-family: var(--font-display); font-size: 10px; font-weight: 700;
  padding: 1px 6px; border-radius: 5px; color: #fff;
}
.con-pos-badge.qb { background: var(--pos-qb); }
.con-pos-badge.rb { background: var(--pos-rb); }
.con-pos-badge.wr { background: var(--pos-wr); }
.con-pos-badge.te { background: var(--pos-te); }
.con-team-label { font-family: var(--font-mono); font-size: 11px; color: var(--ink-medium); }
.con-grade-badge {
  display: inline-block; font-family: var(--font-display); font-size: 13px;
  font-weight: 700; padding: 2px 10px; border-radius: 6px; border: 2px solid;
}
.con-grade-badge.grade-aplus { background: var(--green-light); color: #1a7a6d; border-color: var(--green); }
.con-grade-badge.grade-a { background: var(--green-light); color: #1a7a6d; border-color: var(--green); }
.con-grade-badge.grade-b { background: var(--blue-light); color: #3a5abf; border-color: var(--blue); }
.con-grade-badge.grade-c { background: var(--yellow-light); color: #8a6d20; border-color: var(--yellow); }
.con-grade-badge.grade-d { background: var(--orange-light); color: #a85a3a; border-color: var(--orange); }
.con-grade-badge.grade-f { background: var(--red-light); color: #a83240; border-color: var(--red); }

/* ===== SNAP EFFICIENCY ===== */
.se-card {
  background: var(--bg-card); border: 3px solid var(--ink);
  border-radius: 10px; box-shadow: 4px 4px 0 var(--ink); overflow: hidden;
}
.se-card-header {
  font-family: var(--font-display); font-size: 18px;
  padding: 10px 16px; background: var(--ink); color: var(--bg);
}
.se-table {
  width: 100%; border-collapse: collapse; font-family: var(--font-mono); font-size: 12px;
}
.se-table th {
  background: var(--bg); padding: 6px 8px; text-align: right;
  font-size: 10px; font-weight: 700; border-bottom: 2px solid var(--ink-faint); white-space: nowrap;
}
.se-table th:first-child, .se-table th:nth-child(2), .se-table th:nth-child(3) { text-align: left; }
.se-table td {
  padding: 6px 8px; text-align: right; border-bottom: 1px solid var(--ink-faint);
}
.se-table td:first-child, .se-table td:nth-child(2), .se-table td:nth-child(3) { text-align: left; }
.se-table tbody tr:hover { background: rgba(217,119,87,0.08); }
.se-rank { font-weight: 700; color: var(--ink-light); font-size: 11px; }
.se-pos-badge { font-size: 10px; font-weight: 700; padding: 1px 5px; border-radius: 3px; color: #fff; }
.se-eff-badge {
  font-family: var(--font-mono); font-size: 11px; font-weight: 700;
  padding: 1px 6px; border-radius: 3px; border: 2px solid;
}
.se-eff-elite { background: #dbeafe; color: #1e40af; border-color: #1e40af; }
.se-eff-high { background: #dcfce7; color: #166534; border-color: #166534; }
.se-eff-mid { background: #fef9c3; color: #854d0e; border-color: #854d0e; }
.se-eff-low { background: #fee2e2; color: #991b1b; border-color: #991b1b; }
.se-bar-cell { width: 80px; }
.se-bar { height: 12px; border-radius: 2px; background: var(--green); min-width: 2px; }

/* ===== WORKLOAD ===== */
.wl-card {
  background: var(--bg-card); border: 3px solid var(--ink);
  border-radius: 10px; box-shadow: 4px 4px 0 var(--ink); overflow: hidden;
}
.wl-card-header {
  font-family: var(--font-display); font-size: 18px;
  padding: 10px 16px; background: var(--ink); color: var(--bg);
}
.wl-table {
  width: 100%; border-collapse: collapse; font-family: var(--font-mono); font-size: 12px;
}
.wl-table th {
  background: var(--bg); padding: 6px 8px; text-align: right;
  font-size: 10px; font-weight: 700; border-bottom: 2px solid var(--ink-faint); white-space: nowrap;
}
.wl-table th:first-child, .wl-table th:nth-child(2), .wl-table th:nth-child(3) { text-align: left; }
.wl-table td {
  padding: 6px 8px; text-align: right; border-bottom: 1px solid var(--ink-faint);
}
.wl-table td:first-child, .wl-table td:nth-child(2), .wl-table td:nth-child(3) { text-align: left; }
.wl-table tbody tr:hover { background: rgba(217,119,87,0.08); }
.wl-rank { font-weight: 700; color: var(--ink-light); font-size: 11px; }
.wl-pos-badge { font-size: 10px; font-weight: 700; padding: 1px 5px; border-radius: 3px; color: #fff; }
.wl-score-badge {
  font-family: var(--font-mono); font-size: 11px; font-weight: 700;
  padding: 1px 6px; border-radius: 3px; border: 2px solid;
}
.wl-score-high { background: #fee2e2; color: #991b1b; border-color: #991b1b; }
.wl-score-mid { background: #fef9c3; color: #854d0e; border-color: #854d0e; }
.wl-score-low { background: #dcfce7; color: #166534; border-color: #166534; }
.wl-flag {
  display: inline-block; font-family: var(--font-mono); font-size: 9px;
  font-weight: 700; padding: 1px 5px; border-radius: 3px; margin: 1px 2px;
  background: var(--orange); color: #fff;
}
.wl-bar-cell { width: 80px; }
.wl-bar { height: 12px; border-radius: 2px; background: var(--orange); min-width: 2px; }

/* ===== DUAL-THREAT ===== */
.dt-card {
  background: var(--bg-card); border: 3px solid var(--ink);
  border-radius: 10px; box-shadow: 4px 4px 0 var(--ink); overflow: hidden;
}
.dt-card-header {
  font-family: var(--font-display); font-size: 18px;
  padding: 10px 16px; background: var(--ink); color: var(--bg);
}
.dt-table {
  width: 100%; border-collapse: collapse; font-family: var(--font-mono); font-size: 12px;
}
.dt-table th {
  background: var(--bg); padding: 6px 8px; text-align: right;
  font-size: 10px; font-weight: 700; border-bottom: 2px solid var(--ink-faint); white-space: nowrap;
}
.dt-table th:first-child, .dt-table th:nth-child(2), .dt-table th:nth-child(3) { text-align: left; }
.dt-table td {
  padding: 6px 8px; text-align: right; border-bottom: 1px solid var(--ink-faint);
}
.dt-table td:first-child, .dt-table td:nth-child(2), .dt-table td:nth-child(3) { text-align: left; }
.dt-table tbody tr:hover { background: rgba(217,119,87,0.08); }
.dt-rank { font-weight: 700; color: var(--ink-light); font-size: 11px; }
.dt-pos-badge { font-size: 10px; font-weight: 700; padding: 1px 5px; border-radius: 3px; color: #fff; }
.dt-dti-badge {
  font-family: var(--font-mono); font-size: 11px; font-weight: 700;
  padding: 1px 6px; border-radius: 3px; border: 2px solid;
}
.dt-dti-elite { background: #dbeafe; color: #1e40af; border-color: #1e40af; }
.dt-dti-high { background: #dcfce7; color: #166534; border-color: #166534; }
.dt-dti-mid { background: #fef9c3; color: #854d0e; border-color: #854d0e; }
.dt-dti-low { background: #fee2e2; color: #991b1b; border-color: #991b1b; }
.dt-split-bar { display: flex; height: 14px; border-radius: 3px; overflow: hidden; border: 2px solid var(--ink-faint); }
.dt-split-rush { background: var(--green); }
.dt-split-rec { background: var(--orange); }
.dt-split-cell { width: 100px; }

/* ===== TARGET PREMIUM ===== */
.tp-card {
  background: var(--bg-card); border: 3px solid var(--ink);
  border-radius: 10px; box-shadow: 4px 4px 0 var(--ink); overflow: hidden;
}
.tp-card-header {
  font-family: var(--font-display); font-size: 18px;
  padding: 10px 16px; background: var(--ink); color: var(--bg);
}
.tp-table {
  width: 100%; border-collapse: collapse; font-family: var(--font-mono); font-size: 12px;
}
.tp-table th {
  background: var(--bg); padding: 6px 8px; text-align: right;
  font-size: 10px; font-weight: 700; border-bottom: 2px solid var(--ink-faint); white-space: nowrap;
}
.tp-table th:first-child, .tp-table th:nth-child(2), .tp-table th:nth-child(3) { text-align: left; }
.tp-table td {
  padding: 6px 8px; text-align: right; border-bottom: 1px solid var(--ink-faint);
}
.tp-table td:first-child, .tp-table td:nth-child(2), .tp-table td:nth-child(3) { text-align: left; }
.tp-table tbody tr:hover { background: rgba(217,119,87,0.08); }
.tp-rank { font-weight: 700; color: var(--ink-light); font-size: 11px; }
.tp-pos-badge { font-size: 10px; font-weight: 700; padding: 1px 5px; border-radius: 3px; color: #fff; }
.tp-premium-badge {
  font-family: var(--font-mono); font-size: 11px; font-weight: 700;
  padding: 1px 6px; border-radius: 3px; border: 2px solid;
}
.tp-premium-elite { background: #dbeafe; color: #1e40af; border-color: #1e40af; }
.tp-premium-high { background: #dcfce7; color: #166534; border-color: #166534; }
.tp-premium-mid { background: #fef9c3; color: #854d0e; border-color: #854d0e; }
.tp-premium-low { background: #fee2e2; color: #991b1b; border-color: #991b1b; }
.tp-bar-cell { width: 80px; }
.tp-bar { height: 12px; border-radius: 2px; background: var(--green); min-width: 2px; }

/* ===== DROP RATE ===== */
.dr-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.dr-card {
  background: var(--bg-card); border: 3px solid var(--ink);
  border-radius: 10px; box-shadow: 4px 4px 0 var(--ink); overflow: hidden;
}
.dr-card-header {
  font-family: var(--font-display); font-size: 18px;
  padding: 10px 16px; color: var(--bg);
}
.dr-card-header.sure { background: #166534; }
.dr-card-header.butter { background: #991b1b; }
.dr-table {
  width: 100%; border-collapse: collapse; font-family: var(--font-mono); font-size: 12px;
}
.dr-table th {
  background: var(--bg); padding: 6px 8px; text-align: right;
  font-size: 10px; font-weight: 700; border-bottom: 2px solid var(--ink-faint); white-space: nowrap;
}
.dr-table th:first-child, .dr-table th:nth-child(2), .dr-table th:nth-child(3) { text-align: left; }
.dr-table td {
  padding: 6px 8px; text-align: right; border-bottom: 1px solid var(--ink-faint);
}
.dr-table td:first-child, .dr-table td:nth-child(2), .dr-table td:nth-child(3) { text-align: left; }
.dr-table tbody tr:hover { background: rgba(217,119,87,0.08); }
.dr-rank { font-weight: 700; color: var(--ink-light); font-size: 11px; }
.dr-pos-badge { font-size: 10px; font-weight: 700; padding: 1px 5px; border-radius: 3px; color: #fff; }
.dr-rate-badge {
  font-family: var(--font-mono); font-size: 11px; font-weight: 700;
  padding: 1px 6px; border-radius: 3px; border: 2px solid;
}
.dr-rate-good { background: #dcfce7; color: #166534; border-color: #166534; }
.dr-rate-mid { background: #fef9c3; color: #854d0e; border-color: #854d0e; }
.dr-rate-bad { background: #fee2e2; color: #991b1b; border-color: #991b1b; }
.dr-bar-cell { width: 60px; }
.dr-bar { height: 12px; border-radius: 2px; min-width: 2px; }
.dr-bar-good { background: #166534; }
.dr-bar-bad { background: #991b1b; }

/* ===== GARBAGE TIME ===== */
.gt-sections { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.gt-card {
  background: var(--bg-card); border: 3px solid var(--ink);
  border-radius: 10px; box-shadow: 4px 4px 0 var(--ink); overflow: hidden;
}
.gt-card-header {
  font-family: var(--font-display); font-size: 18px;
  padding: 10px 16px; color: var(--bg);
}
.gt-card-header.padders { background: #991b1b; }
.gt-card-header.clean { background: #166534; }
.gt-table {
  width: 100%; border-collapse: collapse; font-family: var(--font-mono); font-size: 12px;
}
.gt-table th {
  background: var(--bg); padding: 6px 8px; text-align: right;
  font-size: 10px; font-weight: 700; border-bottom: 2px solid var(--ink-faint); white-space: nowrap;
}
.gt-table th:first-child, .gt-table th:nth-child(2), .gt-table th:nth-child(3) { text-align: left; }
.gt-table td {
  padding: 6px 8px; text-align: right; border-bottom: 1px solid var(--ink-faint);
}
.gt-table td:first-child, .gt-table td:nth-child(2), .gt-table td:nth-child(3) { text-align: left; }
.gt-table tbody tr:hover { background: rgba(217,119,87,0.08); }
.gt-rank { font-weight: 700; color: var(--ink-light); font-size: 11px; }
.gt-pos-badge { font-size: 10px; font-weight: 700; padding: 1px 5px; border-radius: 3px; color: #fff; }
.gt-pct-badge {
  font-family: var(--font-mono); font-size: 11px; font-weight: 700;
  padding: 1px 6px; border-radius: 3px; border: 2px solid;
}
.gt-pct-high { background: #fee2e2; color: #991b1b; border-color: #991b1b; }
.gt-pct-mid { background: #fef9c3; color: #854d0e; border-color: #854d0e; }
.gt-pct-low { background: #dcfce7; color: #166534; border-color: #166534; }
.gt-bar-cell { width: 80px; }
.gt-bar { height: 12px; border-radius: 2px; min-width: 2px; }
.gt-bar.red { background: var(--orange); }
.gt-bar.green { background: var(--green); }

/* ===== PERFORMANCE RESPONSIVE ===== */
@media (max-width: 768px) {
  .eff-table { font-size: 12px; }
  .eff-table .hide-mobile { display: none !important; }
  .eff-player-cell { min-width: 120px; }
  .eff-headshot { width: 28px; height: 28px; }
  .eff-player-name { font-size: 12px; }
  .con-table { font-size: 12px; }
  .con-table .hide-mobile { display: none !important; }
  .con-player-cell { min-width: 120px; }
  .con-headshot { width: 28px; height: 28px; }
  .con-player-name { font-size: 12px; }
  .se-bar-cell { width: 50px; }
  .wl-bar-cell { width: 50px; }
  .dt-split-cell { width: 60px; }
  .tp-bar-cell { width: 50px; }
  .dr-grid { grid-template-columns: 1fr; }
  .dr-bar-cell { width: 40px; }
  .gt-sections { grid-template-columns: 1fr; }
  .gt-bar-cell { width: 50px; }
}
/* eff-pos-tab and con-pos-tab overrides removed — handled by shared .lp-pos-tab 375px rule */

/* ===== WEEKLY SCORING HEATMAP ===== */
.wh-container {
  overflow-x: auto;
  border: 3px solid var(--ink);
  border-radius: 12px;
  box-shadow: 4px 4px 0 var(--ink);
  background: var(--bg-card);
}
.wh-table {
  width: 100%;
  border-collapse: collapse;
  min-width: 700px;
}
.wh-table th {
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  color: var(--ink);
  background: var(--bg-warm);
  padding: 8px 4px;
  border-bottom: 3px solid var(--ink);
  position: sticky;
  top: 0;
  z-index: 2;
  text-align: center;
  white-space: nowrap;
  cursor: pointer;
}
.wh-table th.wh-player-col {
  text-align: left;
  padding-left: 12px;
  min-width: 160px;
  position: sticky;
  left: 0;
  z-index: 3;
  background: var(--bg-warm);
}
.wh-table td {
  font-family: var(--font-mono);
  font-size: 12px;
  text-align: center;
  padding: 6px 4px;
  border-bottom: 1px solid var(--ink-faint);
  white-space: nowrap;
  min-width: 42px;
  transition: transform 0.1s;
}
.wh-table td:hover { transform: scale(1.1); z-index: 1; position: relative; }
.wh-table td.wh-player-cell {
  text-align: left;
  padding-left: 8px;
  font-family: var(--font-display);
  font-size: 13px;
  font-weight: 700;
  position: sticky;
  left: 0;
  background: var(--bg-card);
  z-index: 1;
  border-right: 2px solid var(--ink-faint);
  min-width: 160px;
}
.wh-table td.wh-ppg-cell { font-weight: 700; border-left: 2px solid var(--ink-faint); }
.wh-player-inner { display: flex; align-items: center; gap: 6px; cursor: pointer; }
.wh-player-inner:hover { color: var(--orange); }
.wh-pos-dot {
  width: 8px; height: 8px; border-radius: 50%;
  border: 1.5px solid var(--ink); flex-shrink: 0;
}
.wh-rank {
  font-family: var(--font-mono); font-size: 10px;
  color: var(--ink-light); width: 20px; text-align: right; flex-shrink: 0;
}
.wh-team {
  font-family: var(--font-mono); font-size: 10px;
  color: var(--ink-light); margin-left: 2px;
}
.wh-bye { color: var(--ink-faint); font-size: 10px; font-style: italic; }
.wh-score-cell { border-radius: 4px; }
.wh-table tr:hover td { background-color: rgba(217,119,87,0.08); }
.wh-table tr:hover td.wh-player-cell { background-color: var(--bg-card); }
.wh-legend {
  display: flex; justify-content: center; align-items: center;
  gap: 8px; margin-top: 16px;
  font-family: var(--font-hand); font-size: 16px; color: var(--ink-light);
}
.wh-legend-bar {
  display: flex; border-radius: 4px; overflow: hidden;
  border: 1.5px solid var(--ink); height: 16px;
}
.wh-legend-cell { width: 32px; height: 16px; }
.wh-legend-note {
  text-align: center; font-family: var(--font-hand);
  font-size: 14px; color: var(--ink-light); margin-top: 4px;
}

/* ===== MATCHUP HEATMAP ===== */
.mh-legend {
  display: flex; justify-content: center; align-items: center;
  gap: 16px; margin-bottom: 16px;
  font-family: var(--font-mono); font-size: 12px; color: var(--ink-medium);
  flex-wrap: wrap;
}
.mh-legend-item { display: flex; align-items: center; gap: 6px; }
.mh-legend-swatch {
  width: 20px; height: 14px;
  border: 2px solid var(--ink); border-radius: 3px;
}
.mh-table-wrap {
  overflow-x: auto;
  border: 3px solid var(--ink);
  border-radius: 12px;
  box-shadow: 4px 4px 0 var(--ink);
  background: var(--bg-card);
}
.mh-table {
  width: 100%; border-collapse: collapse;
  font-family: var(--font-mono); font-size: 13px;
}
.mh-table thead th {
  font-family: var(--font-display); font-size: 14px; font-weight: 700;
  background: var(--bg-warm); color: var(--ink);
  padding: 10px 12px; text-align: center;
  border-bottom: 3px solid var(--ink);
  cursor: pointer; user-select: none; white-space: nowrap;
}
.mh-table thead th:hover { background: var(--bg); }
.mh-table thead th.mh-team-col {
  text-align: left; min-width: 120px;
  position: sticky; left: 0; z-index: 2; background: var(--bg-warm);
}
.mh-table tbody td {
  padding: 8px 12px; text-align: center;
  border-bottom: 1px solid var(--ink-faint);
  transition: all 0.15s; cursor: pointer; position: relative;
}
.mh-table tbody td.mh-team-cell {
  text-align: left; font-family: var(--font-display);
  font-size: 14px; font-weight: 700;
  position: sticky; left: 0; z-index: 1;
  background: var(--bg-card); border-right: 2px solid var(--ink-faint);
}
.mh-table tbody tr:hover td { filter: brightness(0.95); }
.mh-table tbody tr:hover td.mh-team-cell { filter: none; background: var(--bg-warm); }
.mh-heat-cell { display: flex; flex-direction: column; align-items: center; gap: 1px; }
.mh-heat-ppg { font-weight: 700; font-size: 14px; }
.mh-heat-rank { font-size: 10px; color: var(--ink-light); }
.mh-annotation {
  font-family: var(--font-hand); font-size: 14px; color: var(--ink-light);
  position: absolute; bottom: 1px; right: 4px; pointer-events: none; white-space: nowrap;
}
.mh-detail {
  margin-top: 20px;
  border: 3px solid var(--ink); border-radius: 12px;
  box-shadow: 4px 4px 0 var(--ink); background: var(--bg-card);
  padding: 16px; display: none;
}
.mh-detail.visible { display: block; }
.mh-detail h3 {
  font-family: var(--font-display); font-size: 18px;
  color: var(--ink); margin: 0 0 12px;
}
.mh-detail-players {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 10px;
}
.mh-detail-player {
  display: flex; align-items: center; gap: 10px;
  padding: 8px 10px; border: 2px solid var(--ink-faint); border-radius: 8px;
  background: var(--bg); cursor: pointer; transition: all 0.15s;
}
.mh-detail-player:hover { box-shadow: 3px 3px 0 var(--ink); transform: translate(-1px,-1px); }
.mh-detail-player img {
  width: 36px; height: 36px; border-radius: 50%;
  border: 2px solid var(--ink-faint); object-fit: cover;
}
.mh-detail-name { font-family: var(--font-display); font-size: 13px; font-weight: 700; }
.mh-detail-stats { font-family: var(--font-mono); font-size: 11px; color: var(--ink-medium); }
.mh-detail-pos {
  font-family: var(--font-display); font-size: 10px; font-weight: 700;
  padding: 2px 6px; border-radius: 4px; color: #fff;
}
.mh-sort-arrow { font-size: 10px; margin-left: 4px; opacity: 0.4; }
.mh-table thead th.sorted .mh-sort-arrow { opacity: 1; }

/* ===== STACK CORRELATION FINDER ===== */
.sk-card {
  border: 3px solid var(--ink); border-radius: 12px;
  box-shadow: 4px 4px 0 var(--ink); background: var(--bg-card);
  overflow: hidden;
}
.sk-card-header {
  font-family: var(--font-display); font-size: 16px; font-weight: 700;
  padding: 12px 16px; background: var(--bg-warm);
  border-bottom: 3px solid var(--ink);
}
.sk-table {
  width: 100%; border-collapse: collapse;
  font-family: var(--font-mono); font-size: 13px;
}
.sk-table thead th {
  font-family: var(--font-display); font-size: 12px; font-weight: 700;
  padding: 8px 10px; text-align: center;
  border-bottom: 2px solid var(--ink-faint);
  background: var(--bg-card);
}
.sk-table thead th:first-child, .sk-table thead th:nth-child(2),
.sk-table thead th:nth-child(3), .sk-table thead th:nth-child(4) { text-align: left; }
.sk-table tbody td {
  padding: 8px 10px; text-align: center;
  border-bottom: 1px solid var(--ink-faint);
}
.sk-table tbody td:first-child, .sk-table tbody td:nth-child(2),
.sk-table tbody td:nth-child(3), .sk-table tbody td:nth-child(4) { text-align: left; }
.sk-table tbody tr:hover { background: rgba(217,119,87,0.08); }
.sk-rank { font-weight: 700; color: var(--ink-light); font-size: 11px; }
.sk-team-badge {
  font-family: var(--font-display); font-size: 11px; font-weight: 700;
  padding: 2px 6px; border-radius: 4px;
  background: var(--bg-warm); border: 2px solid var(--ink-faint);
}
.sk-pos-badge {
  font-size: 10px; font-weight: 700;
  padding: 1px 5px; border-radius: 3px; color: #fff;
}
.sk-corr-badge {
  font-family: var(--font-mono); font-size: 11px; font-weight: 700;
  padding: 1px 6px; border-radius: 3px; border: 2px solid;
}
.sk-corr-high { background: #dcfce7; color: #166534; border-color: #166534; }
.sk-corr-mid { background: #fef9c3; color: #854d0e; border-color: #854d0e; }
.sk-corr-low { background: #f7efe5; color: var(--ink-light); border-color: var(--ink-faint); }
.sk-corr-neg { background: #fee2e2; color: #991b1b; border-color: #991b1b; }
.sk-corr-bar { height: 8px; border-radius: 3px; background: var(--orange); }
.sk-empty {
  text-align: center; padding: 40px;
  font-family: var(--font-hand); font-size: 18px; color: var(--ink-light);
}

/* ===== RED ZONE & GOAL-LINE ===== */
.rz-section { margin-bottom: 24px; }
.rz-section-header {
  font-family: var(--font-display); font-size: 16px; font-weight: 700;
  padding: 10px 16px; border-radius: 10px 10px 0 0;
  border: 3px solid var(--ink); border-bottom: none;
}
.rz-section-header.dominators { background: #d9efec; }
.rz-section-header.td-dependent { background: #f2d5d8; }
.rz-table {
  width: 100%; border-collapse: collapse;
  font-family: var(--font-mono); font-size: 13px;
  border: 3px solid var(--ink); border-radius: 0 0 12px 12px;
  box-shadow: 4px 4px 0 var(--ink); background: var(--bg-card);
  overflow: hidden;
}
.rz-table thead th {
  font-family: var(--font-display); font-size: 12px; font-weight: 700;
  padding: 8px 10px; text-align: center;
  border-bottom: 2px solid var(--ink-faint); cursor: pointer;
}
.rz-table thead th:first-child { text-align: left; }
.rz-table thead th.sorted { color: var(--orange); }
.rz-table tbody td {
  padding: 8px 10px; text-align: center;
  border-bottom: 1px solid var(--ink-faint);
}
.rz-table tbody tr:hover { background: rgba(217,119,87,0.08); cursor: pointer; }
.rz-player-cell { display: flex; align-items: center; gap: 8px; }
.rz-headshot {
  width: 32px; height: 32px; border-radius: 50%;
  border: 2px solid var(--ink-faint); object-fit: cover;
}
.rz-player-info { min-width: 0; }
.rz-player-name { font-family: var(--font-display); font-size: 13px; font-weight: 700; }
.rz-player-meta { display: flex; align-items: center; gap: 6px; }
.rz-pos-badge {
  font-size: 10px; font-weight: 700; padding: 1px 5px;
  border-radius: 3px; color: #fff;
}
.rz-pos-badge.qb { background: var(--pos-qb); }
.rz-pos-badge.rb { background: var(--pos-rb); }
.rz-pos-badge.wr { background: var(--pos-wr); }
.rz-pos-badge.te { background: var(--pos-te); }
.rz-team-label { font-family: var(--font-mono); font-size: 10px; color: var(--ink-light); }
.rz-rate-badge {
  font-family: var(--font-mono); font-size: 11px; font-weight: 700;
  padding: 1px 6px; border-radius: 3px; border: 2px solid;
}
.rz-rate-badge.high { background: #dcfce7; color: #166534; border-color: #166534; }
.rz-rate-badge.mid { background: #fef9c3; color: #854d0e; border-color: #854d0e; }
.rz-rate-badge.low { background: #fee2e2; color: #991b1b; border-color: #991b1b; }
.rz-tdpct-badge {
  font-family: var(--font-mono); font-size: 11px; font-weight: 700;
  padding: 1px 6px; border-radius: 3px; border: 2px solid;
}
.rz-tdpct-badge.heavy { background: #fee2e2; color: #991b1b; border-color: #991b1b; }
.rz-tdpct-badge.moderate { background: #fef9c3; color: #854d0e; border-color: #854d0e; }
.rz-tdpct-badge.light { background: #dcfce7; color: #166534; border-color: #166534; }
.rz-annotation {
  font-family: var(--font-hand); font-size: 12px; color: var(--ink-light);
}
.rz-empty {
  text-align: center; padding: 40px;
  font-family: var(--font-hand); font-size: 18px; color: var(--ink-light);
}
.section-icon { font-size: 16px; }

/* ===== HOT & COLD STREAKS ===== */
.str-columns {
  display: grid; grid-template-columns: 1fr 1fr; gap: 20px;
}
.str-section-header {
  font-family: var(--font-display); font-size: 16px; font-weight: 700;
  padding: 10px 16px; border-radius: 10px 10px 0 0;
  border: 3px solid var(--ink); border-bottom: none;
  text-align: center;
}
.str-section-header.hot { background: #fee2e2; color: #991b1b; }
.str-section-header.cold { background: #dbeafe; color: #1e3a5f; }
.str-table {
  width: 100%; border-collapse: collapse;
  font-family: var(--font-mono); font-size: 13px;
  border: 3px solid var(--ink); border-radius: 0 0 12px 12px;
  box-shadow: 4px 4px 0 var(--ink); background: var(--bg-card);
  overflow: hidden;
}
.str-table thead th {
  font-family: var(--font-display); font-size: 11px; font-weight: 700;
  padding: 8px 6px; text-align: center;
  border-bottom: 2px solid var(--ink-faint);
}
.str-table thead th:first-child { text-align: left; }
.str-table tbody td {
  padding: 6px 6px; text-align: center;
  border-bottom: 1px solid var(--ink-faint);
}
.str-table tbody td:first-child { text-align: left; }
.str-table tbody tr:hover { background: rgba(217,119,87,0.08); }
.str-pos-badge {
  font-size: 10px; font-weight: 700;
  padding: 1px 5px; border-radius: 3px; color: #fff;
}
.str-delta-badge {
  font-family: var(--font-mono); font-size: 11px; font-weight: 700;
  padding: 1px 6px; border-radius: 3px;
}
.str-delta-badge.hot { background: #fee2e2; color: #991b1b; }
.str-delta-badge.cold { background: #dbeafe; color: #1e3a5f; }
.str-recent { display: flex; align-items: flex-end; gap: 2px; height: 22px; }
.str-recent-bar {
  width: 8px; border-radius: 1px; min-height: 2px;
}
.str-empty {
  text-align: center; padding: 30px;
  font-family: var(--font-hand); font-size: 16px; color: var(--ink-light);
}

/* ===== WEEKLY LEADERS ===== */
.wkl-week-nav {
  display: flex; align-items: center; gap: 8px;
}
.wkl-week-btn {
  font-family: var(--font-display); font-size: 16px; font-weight: 700;
  padding: 4px 10px; border: 2px solid var(--ink); border-radius: 8px;
  background: var(--bg-card); color: var(--ink); cursor: pointer;
  transition: all 0.12s;
}
.wkl-week-btn:hover:not(:disabled) { background: var(--bg-warm); }
.wkl-week-btn:disabled { opacity: 0.3; cursor: not-allowed; }
.wkl-week-label {
  font-family: var(--font-display); font-size: 16px; font-weight: 700;
  min-width: 70px; text-align: center;
}
.wkl-table {
  width: 100%; border-collapse: collapse;
  font-family: var(--font-mono); font-size: 13px;
  border: 3px solid var(--ink); border-radius: 12px;
  box-shadow: 4px 4px 0 var(--ink); background: var(--bg-card);
  overflow: hidden;
}
.wkl-table thead th {
  font-family: var(--font-display); font-size: 12px; font-weight: 700;
  padding: 8px 10px; text-align: center;
  border-bottom: 2px solid var(--ink-faint);
  cursor: pointer;
}
.wkl-table thead th:nth-child(2) { text-align: left; }
.wkl-table thead th.sorted { color: var(--orange); }
.wkl-table tbody td {
  padding: 8px 10px; text-align: center;
  border-bottom: 1px solid var(--ink-faint);
}
.wkl-table tbody tr:hover { background: rgba(217,119,87,0.08); cursor: pointer; }
.wkl-player-cell { display: flex; align-items: center; gap: 8px; }
.wkl-player-info { min-width: 0; }
.wkl-player-name { font-family: var(--font-display); font-size: 13px; font-weight: 700; }
.wkl-player-meta { display: flex; align-items: center; gap: 6px; }
.wkl-pos-badge {
  font-size: 10px; font-weight: 700;
  padding: 1px 5px; border-radius: 3px; color: #fff;
}
.wkl-pos-badge.qb { background: var(--pos-qb); }
.wkl-pos-badge.rb { background: var(--pos-rb); }
.wkl-pos-badge.wr { background: var(--pos-wr); }
.wkl-pos-badge.te { background: var(--pos-te); }
.wkl-team-label { font-family: var(--font-mono); font-size: 10px; color: var(--ink-light); }
.wkl-rank {
  font-family: var(--font-display); font-weight: 700;
  padding: 2px 6px; border-radius: 4px;
}
.wkl-rank.top1 { background: #ffd700; color: var(--ink); }
.wkl-rank.top2 { background: #c0c0c0; color: var(--ink); }
.wkl-rank.top3 { background: #cd7f32; color: #fff; }
.wkl-pts {
  font-weight: 700; padding: 2px 6px; border-radius: 4px;
}
.wkl-pts.elite { background: #dcfce7; color: #166534; }
.wkl-pts.great { background: #d9efec; color: #1a6b60; }
.wkl-pts.good { color: var(--ink); }

/* ===== WEEKLY MVP GRID ===== */
.mv-card {
  border: 3px solid var(--ink); border-radius: 12px;
  box-shadow: 4px 4px 0 var(--ink); background: var(--bg-card);
  overflow: hidden;
}
.mv-card-header {
  font-family: var(--font-display); font-size: 16px; font-weight: 700;
  padding: 12px 16px; background: var(--bg-warm);
  border-bottom: 3px solid var(--ink);
}
.mv-grid {
  width: 100%; border-collapse: collapse;
  font-family: var(--font-mono); font-size: 13px;
}
.mv-grid thead th {
  font-family: var(--font-display); font-size: 14px; font-weight: 700;
  padding: 10px 12px; text-align: center;
  border-bottom: 2px solid var(--ink-faint);
}
.mv-grid thead th:first-child { text-align: left; }
.mv-grid tbody td {
  padding: 8px 10px; text-align: center;
  border-bottom: 1px solid var(--ink-faint);
}
.mv-grid tbody td:first-child { text-align: left; font-weight: 700; }
.mv-grid tbody tr:hover { background: rgba(217,119,87,0.08); }
.mv-cell { display: flex; flex-direction: column; align-items: center; gap: 2px; }
.mv-cell-name { font-family: var(--font-display); font-size: 12px; font-weight: 700; }
.mv-cell-team { font-size: 10px; color: var(--ink-light); }
.mv-cell-pts {
  font-size: 11px; font-weight: 700; color: #fff;
  padding: 2px 6px; border-radius: 4px;
}
.mv-empty {
  text-align: center; padding: 40px;
  font-family: var(--font-hand); font-size: 18px; color: var(--ink-light);
}

/* ===== PLAYOFF SCHEDULE PLANNER ===== */
.po-card {
  border: 3px solid var(--ink); border-radius: 12px;
  box-shadow: 4px 4px 0 var(--ink); background: var(--bg-card);
  overflow: hidden;
}
.po-card-header {
  font-family: var(--font-display); font-size: 16px; font-weight: 700;
  padding: 12px 16px; background: var(--bg-warm);
  border-bottom: 3px solid var(--ink);
}
.po-table {
  width: 100%; border-collapse: collapse;
  font-family: var(--font-mono); font-size: 13px;
}
.po-table thead th {
  font-family: var(--font-display); font-size: 12px; font-weight: 700;
  padding: 8px 10px; text-align: center;
  border-bottom: 2px solid var(--ink-faint);
}
.po-table thead th:first-child, .po-table thead th:nth-child(2) { text-align: left; }
.po-table tbody td {
  padding: 8px 10px; text-align: center;
  border-bottom: 1px solid var(--ink-faint);
}
.po-table tbody td:first-child, .po-table tbody td:nth-child(2) { text-align: left; }
.po-table tbody tr:hover { background: rgba(217,119,87,0.08); }
.po-rank { font-weight: 700; color: var(--ink-light); font-size: 11px; }
.po-pos-badge {
  font-size: 10px; font-weight: 700;
  padding: 1px 5px; border-radius: 3px; color: #fff;
}
.po-grade {
  font-family: var(--font-display); font-size: 12px; font-weight: 700;
  padding: 2px 6px; border-radius: 4px; border: 2px solid;
  display: inline-block;
}
.po-grade-Aplus { background: #dcfce7; color: #166534; border-color: #166534; }
.po-grade-A { background: #d9efec; color: #1a6b60; border-color: #1a6b60; }
.po-grade-Bplus { background: #dbeafe; color: #1e3a5f; border-color: #1e3a5f; }
.po-grade-B { background: #f7efe5; color: var(--ink); border-color: var(--ink-faint); }
.po-grade-C { background: #fef9c3; color: #854d0e; border-color: #854d0e; }
.po-grade-D { background: #fee2e2; color: #991b1b; border-color: #991b1b; }
.po-grade-F { background: #e63946; color: #fff; border-color: #991b1b; }
.po-matchup { display: flex; align-items: center; gap: 4px; justify-content: center; }
.po-opp { font-size: 11px; color: var(--ink-light); }
.po-empty {
  text-align: center; padding: 40px;
  font-family: var(--font-hand); font-size: 18px; color: var(--ink-light);
}

/* ===== GAME ANALYSIS RESPONSIVE ===== */
@media (max-width: 768px) {
  .wh-table td { font-size: 11px; padding: 4px 3px; min-width: 36px; }
  .wh-table td.wh-player-cell { min-width: 130px; font-size: 12px; }
  .wh-table th { font-size: 10px; padding: 6px 3px; }
  .mh-table { font-size: 12px; }
  .mh-table thead th { padding: 8px 6px; font-size: 12px; }
  .mh-table tbody td { padding: 6px 6px; }
  .mh-heat-ppg { font-size: 12px; }
  .mh-detail-players { grid-template-columns: 1fr; }
  .sk-table { font-size: 12px; }
  .rz-table { font-size: 12px; }
  .rz-table .hide-mobile { display: none !important; }
  .rz-player-cell { min-width: 120px; }
  .rz-headshot { width: 28px; height: 28px; }
  .rz-player-name { font-size: 12px; }
  .str-columns { grid-template-columns: 1fr; }
  .str-table { font-size: 12px; }
  .wkl-table { font-size: 12px; }
  .wkl-table .hide-mobile { display: none !important; }
  .mv-grid { font-size: 12px; }
  .mv-cell-name { font-size: 11px; }
  .po-table { font-size: 12px; }
  .po-table .hide-mobile { display: none !important; }
}
@media (max-width: 480px) {
  .wh-table td.wh-player-cell { min-width: 110px; font-size: 11px; }
  .wh-rank { display: none; }
  .mh-legend { gap: 8px; }
  .str-table thead th { font-size: 10px; padding: 6px 4px; }
  .str-table tbody td { padding: 4px 4px; font-size: 12px; }
  .wkl-week-label { font-size: 14px; }
}

/* ===== 30. USAGE TRENDS (ut-) ===== */
.ut-section { margin-bottom: 24px; }
.ut-section-title { font-family: var(--font-display); font-size: 18px; margin: 0 0 8px; padding: 4px 0; }
.ut-risers-title { color: #16a34a; }
.ut-fallers-title { color: #dc2626; }
.ut-table-wrap { overflow-x: auto; }
.ut-table { width: 100%; border-collapse: collapse; font-family: var(--font-mono); font-size: 13px; }
.ut-table thead th { text-align: left; padding: 8px 10px; font-size: 11px; text-transform: uppercase; color: var(--ink-light); border-bottom: 2px solid var(--ink); }
.ut-table tbody tr { border-bottom: 1px solid var(--ink-faint); }
.ut-table tbody tr:hover { background: rgba(217,119,87,0.08); }
.ut-rank { width: 30px; text-align: center; color: var(--ink-light); }
.ut-player-cell { display: flex; align-items: center; gap: 6px; padding: 6px 10px; min-width: 180px; }
.ut-headshot { width: 30px; height: 30px; border-radius: 50%; border: 2px solid var(--ink); object-fit: cover; }
.ut-name { font-weight: 700; font-size: 13px; white-space: nowrap; }
.ut-pos-badge { font-size: 10px; color: #fff; padding: 1px 5px; border-radius: 4px; font-weight: 700; }
.ut-team { font-size: 10px; color: var(--ink-light); }
.ut-num { text-align: right; padding: 6px 10px; font-variant-numeric: tabular-nums; }
.ut-delta-up { color: #16a34a; font-weight: 700; }
.ut-delta-down { color: #dc2626; font-weight: 700; }

/* ===== 31. YEAR-OVER-YEAR (yy-) ===== */
.yy-section { margin-bottom: 24px; }
.yy-section-title { font-family: var(--font-display); font-size: 18px; margin: 0 0 8px; }
.yy-risers-title { color: #16a34a; }
.yy-fallers-title { color: #dc2626; }
.yy-table-wrap { overflow-x: auto; }
.yy-table { width: 100%; border-collapse: collapse; font-family: var(--font-mono); font-size: 13px; }
.yy-table thead th { text-align: left; padding: 8px 10px; font-size: 11px; text-transform: uppercase; color: var(--ink-light); border-bottom: 2px solid var(--ink); }
.yy-table tbody tr { border-bottom: 1px solid var(--ink-faint); }
.yy-table tbody tr:hover { background: rgba(217,119,87,0.08); }
.yy-rank { width: 30px; text-align: center; color: var(--ink-light); }
.yy-player-cell { display: flex; align-items: center; gap: 6px; padding: 6px 10px; min-width: 180px; }
.yy-headshot { width: 30px; height: 30px; border-radius: 50%; border: 2px solid var(--ink); object-fit: cover; }
.yy-name { font-weight: 700; font-size: 13px; white-space: nowrap; }
.yy-pos-badge { font-size: 10px; color: #fff; padding: 1px 5px; border-radius: 4px; font-weight: 700; }
.yy-team { font-size: 10px; color: var(--ink-light); }
.yy-num { text-align: right; padding: 6px 10px; font-variant-numeric: tabular-nums; }
.yy-delta-badge { display: inline-block; padding: 2px 8px; border-radius: 6px; font-weight: 700; font-size: 12px; }
.yy-delta-pos { background: #dcfce7; color: #166534; }
.yy-delta-neg { background: #fee2e2; color: #991b1b; }
.yy-chips { display: flex; flex-wrap: wrap; gap: 4px; padding: 4px 6px; }
.yy-mini-chip { font-size: 10px; padding: 1px 5px; border-radius: 4px; font-weight: 600; white-space: nowrap; }
.yy-chip-pos { background: #dcfce7; color: #166534; }
.yy-chip-neg { background: #fee2e2; color: #991b1b; }

/* ===== 32. AGING CURVES (ag-) ===== */
.ag-chart-wrap {
  background: var(--bg-card); border: 3px solid var(--ink); border-radius: 10px;
  box-shadow: 4px 4px 0 var(--ink); padding: 16px; margin-bottom: 16px; text-align: center;
}
.ag-chart-wrap canvas { max-width: 100%; height: auto; }
.ag-summary { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.ag-card {
  background: var(--bg-card); border: 3px solid var(--ink); border-radius: 10px;
  box-shadow: 4px 4px 0 var(--ink); padding: 16px; text-align: center;
}
.ag-card-label { font-family: var(--font-mono); font-size: 11px; text-transform: uppercase; color: var(--ink-light); margin-bottom: 4px; }
.ag-card-value { font-family: var(--font-display); font-size: 28px; color: var(--ink); }

/* ===== 33. PACE TRACKER (pt-) ===== */
.pt-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.pt-card {
  background: var(--bg-card); border: 3px solid var(--ink); border-radius: 10px;
  box-shadow: 4px 4px 0 var(--ink); padding: 16px;
}
.pt-card-header { display: flex; align-items: center; gap: 8px; margin-bottom: 12px; flex-wrap: wrap; }
.pt-player-name { font-family: var(--font-display); font-size: 16px; }
.pt-pos-badge { font-size: 10px; color: #fff; padding: 1px 5px; border-radius: 4px; font-weight: 700; }
.pt-team { font-size: 11px; color: var(--ink-light); font-family: var(--font-mono); }
.pt-stats { display: flex; flex-direction: column; gap: 8px; }
.pt-stat-row { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.pt-stat-label { font-family: var(--font-mono); font-size: 11px; color: var(--ink-light); text-transform: uppercase; min-width: 70px; }
.pt-stat-vals { font-family: var(--font-mono); font-size: 13px; font-weight: 700; min-width: 100px; }
.pt-pace-bar-wrap { flex: 1; min-width: 60px; height: 8px; background: var(--ink-faint); border-radius: 4px; overflow: hidden; }
.pt-pace-bar { height: 100%; border-radius: 4px; transition: width 0.3s; }
.pt-pace-badge { font-size: 10px; padding: 1px 6px; border-radius: 4px; font-weight: 700; white-space: nowrap; }
.pt-on-pace { background: #dcfce7; color: #166534; }
.pt-off-pace { background: #f3f4f6; color: #6b7280; }

/* ===== 34. SEASON PACE (spc-) ===== */
.spc-card {
  background: var(--bg-card); border: 3px solid var(--ink); border-radius: 10px;
  box-shadow: 4px 4px 0 var(--ink); padding: 20px;
}
.spc-title { font-family: var(--font-display); font-size: 20px; margin: 0 0 12px; }
.spc-table-wrap { overflow-x: auto; }
.spc-table { width: 100%; border-collapse: collapse; font-family: var(--font-mono); font-size: 13px; }
.spc-table thead th { text-align: left; padding: 8px 10px; font-size: 11px; text-transform: uppercase; color: var(--ink-light); border-bottom: 2px solid var(--ink); }
.spc-table tbody tr { border-bottom: 1px solid var(--ink-faint); }
.spc-table tbody tr:hover { background: rgba(217,119,87,0.08); }
.spc-rank { width: 30px; text-align: center; color: var(--ink-light); }
.spc-name { font-weight: 700; }
.spc-team { font-size: 10px; color: var(--ink-light); }
.spc-pos-badge { font-size: 10px; color: #fff; padding: 1px 5px; border-radius: 4px; font-weight: 700; }
.spc-num { text-align: right; padding: 6px 10px; font-variant-numeric: tabular-nums; }
.spc-milestones { display: flex; flex-wrap: wrap; gap: 4px; padding: 4px 6px; }
.spc-milestone { font-size: 10px; padding: 2px 8px; border-radius: 6px; font-weight: 700; border: 2px solid; }
.spc-gold { background: #fef3c7; color: #92400e; border-color: #d97706; }
.spc-silver { background: #f3f4f6; color: #374151; border-color: #9ca3af; }

/* ===== 35. TD REGRESSION (tdr-) ===== */
.tdr-rates { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 16px; }
.tdr-rate-chip {
  font-family: var(--font-mono); font-size: 12px; padding: 4px 10px;
  background: var(--bg-card); border: 2px solid var(--ink-faint); border-radius: 6px;
}
.tdr-columns { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.tdr-col-header {
  font-family: var(--font-display); font-size: 16px; padding: 8px 12px;
  border-radius: 8px 8px 0 0; color: #fff; text-align: center;
}
.tdr-buy-header { background: #16a34a; }
.tdr-sell-header { background: #dc2626; }
.tdr-table-wrap { overflow-x: auto; }
.tdr-table { width: 100%; border-collapse: collapse; font-family: var(--font-mono); font-size: 12px; }
.tdr-table thead th { text-align: left; padding: 6px 8px; font-size: 10px; text-transform: uppercase; color: var(--ink-light); border-bottom: 2px solid var(--ink); }
.tdr-table tbody tr { border-bottom: 1px solid var(--ink-faint); }
.tdr-table tbody tr:hover { background: rgba(217,119,87,0.08); }
.tdr-rank { width: 24px; text-align: center; color: var(--ink-light); }
.tdr-name { font-weight: 700; white-space: nowrap; }
.tdr-team { font-size: 10px; color: var(--ink-light); }
.tdr-pos-badge { font-size: 9px; color: #fff; padding: 1px 4px; border-radius: 3px; font-weight: 700; }
.tdr-num { text-align: right; padding: 4px 8px; font-variant-numeric: tabular-nums; }
.tdr-diff-badge { display: inline-block; padding: 1px 6px; border-radius: 4px; font-weight: 700; font-size: 11px; }
.tdr-diff-pos { background: #dcfce7; color: #166534; }
.tdr-diff-neg { background: #fee2e2; color: #991b1b; }
.tdr-bar-wrap { width: 60px; height: 10px; background: var(--ink-faint); border-radius: 4px; overflow: hidden; }
.tdr-bar { height: 100%; border-radius: 4px; }

/* ===== 36. AIR YARDS (ay-) ===== */
.ay-legend { display: flex; gap: 16px; margin-bottom: 16px; flex-wrap: wrap; }
.ay-legend-item { font-family: var(--font-mono); font-size: 12px; padding: 4px 10px; border-radius: 6px; font-weight: 600; }
.ay-legend-buy { background: #dcfce7; color: #166534; }
.ay-legend-sell { background: #fee2e2; color: #991b1b; }
.ay-section { margin-bottom: 24px; }
.ay-section-title { font-family: var(--font-display); font-size: 18px; margin: 0 0 8px; }
.ay-buy-title { color: #16a34a; }
.ay-sell-title { color: #dc2626; }
.ay-table-wrap { overflow-x: auto; }
.ay-table { width: 100%; border-collapse: collapse; font-family: var(--font-mono); font-size: 12px; }
.ay-table thead th { text-align: left; padding: 6px 8px; font-size: 10px; text-transform: uppercase; color: var(--ink-light); border-bottom: 2px solid var(--ink); white-space: nowrap; cursor: default; }
.ay-table thead th.ay-sortable { cursor: pointer; }
.ay-table thead th.ay-sortable:hover { color: var(--ink); }
.ay-table tbody tr { border-bottom: 1px solid var(--ink-faint); }
.ay-table tbody tr:hover { background: rgba(217,119,87,0.08); }
.ay-player-cell { display: flex; align-items: center; gap: 5px; padding: 5px 8px; min-width: 160px; }
.ay-headshot { width: 28px; height: 28px; border-radius: 50%; border: 2px solid var(--ink); object-fit: cover; }
.ay-name { font-weight: 700; font-size: 12px; white-space: nowrap; }
.ay-pos-badge { font-size: 9px; color: #fff; padding: 1px 4px; border-radius: 3px; font-weight: 700; }
.ay-team { font-size: 9px; color: var(--ink-light); }
.ay-num { text-align: right; padding: 5px 8px; font-variant-numeric: tabular-nums; }
.ay-regr-badge { display: inline-block; padding: 1px 6px; border-radius: 4px; font-weight: 700; font-size: 11px; }
.ay-regr-buy { background: #dcfce7; color: #166534; }
.ay-regr-sell { background: #fee2e2; color: #991b1b; }
.ay-annotation { font-size: 11px; color: var(--ink-light); max-width: 150px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* ===== TRENDS & PROJECTIONS RESPONSIVE ===== */
@media (max-width: 768px) {
  .ut-table { font-size: 12px; }
  .ut-player-cell { min-width: 140px; }
  .ut-headshot { width: 24px; height: 24px; }
  .yy-table { font-size: 12px; }
  .yy-player-cell { min-width: 140px; }
  .yy-headshot { width: 24px; height: 24px; }
  .ag-summary { grid-template-columns: repeat(2, 1fr); }
  .ag-card-value { font-size: 22px; }
  .pt-grid { grid-template-columns: repeat(2, 1fr); }
  .spc-table { font-size: 12px; }
  .tdr-columns { grid-template-columns: 1fr; }
  .tdr-table { font-size: 11px; }
  .ay-table { font-size: 11px; }
  .ay-player-cell { min-width: 130px; }
  .ay-headshot { width: 24px; height: 24px; }
}
@media (max-width: 480px) {
  .ut-player-cell { min-width: 120px; }
  .ut-rank { display: none; }
  .yy-player-cell { min-width: 120px; }
  .yy-rank { display: none; }
  .ag-summary { grid-template-columns: 1fr 1fr; }
  .ag-card-value { font-size: 20px; }
  .pt-grid { grid-template-columns: 1fr; }
  .spc-milestones { gap: 2px; }
  .spc-milestone { font-size: 9px; padding: 1px 5px; }
  .tdr-rate-chip { font-size: 10px; padding: 2px 6px; }
  .ay-player-cell { min-width: 110px; }
  .ay-name { font-size: 11px; }
}

/* ===================================================================
   PLAYER SEARCH AUTOCOMPLETE (shared)
   =================================================================== */
.lp-search-wrap { position: relative; display: inline-block; }
.lp-search-list {
  display: none; position: absolute; top: 100%; left: 0; right: 0; z-index: 50;
  background: var(--bg-card); border: 2px solid var(--ink); border-radius: 8px;
  box-shadow: 4px 4px 0 var(--ink); max-height: 260px; overflow-y: auto; margin-top: 2px;
}
.lp-search-list > div {
  display: flex; align-items: center; gap: 6px; padding: 7px 10px; cursor: pointer;
  font-family: var(--font-mono); font-size: 12px; border-bottom: 1px solid var(--ink-faint);
}
.lp-search-list > div:last-child { border-bottom: none; }
.lp-search-list > div:hover { background: rgba(217,119,87,0.08); }
.cst-search-pos, .ccp-search-pos, .cmt-search-pos, .sw2-search-pos, .glo-search-pos, .pbd-search-pos {
  font-size: 9px; color: #fff; padding: 1px 5px; border-radius: 3px; font-weight: 700;
}
.cst-search-name, .ccp-search-name, .cmt-search-name, .sw2-search-name, .glo-search-name, .pbd-search-name { font-weight: 700; }
.cst-search-team, .ccp-search-team, .cmt-search-team, .sw2-search-team, .glo-search-team, .pbd-search-team { color: var(--ink-light); font-size: 11px; }
.cst-search-empty, .ccp-search-empty, .cmt-search-empty, .sw2-search-empty, .glo-search-empty, .pbd-search-empty {
  padding: 10px; color: var(--ink-light); font-family: var(--font-mono); font-size: 12px; text-align: center;
}

/* ===================================================================
   37. CAREER STATS TIMELINE (cst-)
   =================================================================== */
.cst-player-card {
  display: flex; align-items: center; gap: 12px; padding: 16px;
  background: var(--bg-card); border: 3px solid var(--ink); border-radius: 10px;
  box-shadow: 4px 4px 0 var(--ink); margin-bottom: 16px;
}
.cst-player-info { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.cst-player-name { font-family: var(--font-display); font-size: 18px; color: var(--ink); }
.cst-pos-badge { font-size: 10px; color: #fff; padding: 2px 6px; border-radius: 4px; font-weight: 700; }
.cst-team { font-family: var(--font-mono); font-size: 12px; color: var(--ink-light); }
.cst-age { font-family: var(--font-mono); font-size: 12px; color: var(--ink-light); }
.cst-traj { font-size: 10px; color: #fff; padding: 2px 8px; border-radius: 4px; font-weight: 700; }

.cst-chips {
  display: flex; gap: 10px; flex-wrap: wrap; justify-content: center; margin-bottom: 16px;
}
.cst-chip {
  background: var(--bg-card); border: 2px solid var(--ink); border-radius: 8px;
  padding: 8px 14px; text-align: center; min-width: 80px;
}
.cst-chip-val { font-family: var(--font-mono); font-size: 18px; font-weight: 700; color: var(--ink); }
.cst-chip-label { font-family: var(--font-mono); font-size: 10px; color: var(--ink-light); text-transform: uppercase; }

.cst-chart-card {
  background: var(--bg-card); border: 3px solid var(--ink); border-radius: 10px;
  box-shadow: 4px 4px 0 var(--ink); padding: 16px; margin-bottom: 16px; overflow-x: auto;
}
.cst-chart-card canvas { display: block; max-width: 100%; }

.cst-highs-title { font-family: var(--font-display); font-size: 16px; color: var(--ink); margin: 0 0 8px; }
.cst-highs { display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 16px; }
.cst-high-card {
  background: var(--bg-card); border: 2px solid var(--ink); border-radius: 8px;
  padding: 8px 14px; text-align: center;
}
.cst-high-val { font-family: var(--font-mono); font-size: 16px; font-weight: 700; color: var(--orange); }
.cst-high-label { font-family: var(--font-mono); font-size: 10px; color: var(--ink-light); text-transform: uppercase; }

.cst-table-wrap { overflow-x: auto; margin-bottom: 16px; }
.cst-table { width: 100%; border-collapse: collapse; font-family: var(--font-mono); font-size: 12px; }
.cst-table thead th { text-align: left; padding: 6px 8px; font-size: 10px; text-transform: uppercase; color: var(--ink-light); border-bottom: 2px solid var(--ink); white-space: nowrap; }
.cst-table tbody tr { border-bottom: 1px solid var(--ink-faint); }
.cst-table tbody tr:hover { background: rgba(217,119,87,0.08); }
.cst-table td { padding: 6px 8px; text-align: right; font-variant-numeric: tabular-nums; }
.cst-table td:first-child { text-align: left; font-weight: 700; }
.cst-ppg-cell { font-weight: 700; color: var(--orange); }
.cst-totals { font-weight: 700; border-top: 2px solid var(--ink); background: rgba(217,119,87,0.05); }

/* ===================================================================
   38. CAREER COMPARISON (ccp-)
   =================================================================== */
.ccp-chips { display: flex; gap: 8px; flex-wrap: wrap; justify-content: center; margin-bottom: 12px; }
.ccp-chip {
  display: inline-flex; align-items: center; gap: 5px; padding: 4px 10px;
  border: 2px solid; border-radius: 20px; font-family: var(--font-mono); font-size: 12px;
  background: var(--bg-card);
}
.ccp-chip-dot { width: 8px; height: 8px; border-radius: 50%; }
.ccp-chip-rm { background: none; border: none; font-size: 16px; cursor: pointer; color: var(--ink-light); padding: 0 2px; }
.ccp-chip-rm:hover { color: var(--ink); }

.ccp-chart-card {
  background: var(--bg-card); border: 3px solid var(--ink); border-radius: 10px;
  box-shadow: 4px 4px 0 var(--ink); padding: 16px; margin-bottom: 16px; overflow-x: auto;
}
.ccp-chart-card canvas { display: block; max-width: 100%; }

.ccp-table-wrap { overflow-x: auto; margin-bottom: 16px; }
.ccp-table { width: 100%; border-collapse: collapse; font-family: var(--font-mono); font-size: 12px; }
.ccp-table thead th { text-align: left; padding: 6px 8px; font-size: 10px; text-transform: uppercase; border-bottom: 2px solid var(--ink); white-space: nowrap; }
.ccp-table tbody tr { border-bottom: 1px solid var(--ink-faint); }
.ccp-table tbody tr:hover { background: rgba(217,119,87,0.08); }
.ccp-table td { padding: 6px 8px; text-align: right; font-variant-numeric: tabular-nums; }
.ccp-table td:first-child { text-align: left; font-weight: 700; }
.ccp-best { background: #dcfce7; font-weight: 700; }

/* ===================================================================
   39. COMPARE TABLE (cmt-)
   =================================================================== */
.cmt-chips { display: flex; gap: 8px; flex-wrap: wrap; justify-content: center; margin-bottom: 12px; }
.cmt-chip {
  display: inline-flex; align-items: center; gap: 5px; padding: 4px 10px;
  border: 2px solid; border-radius: 20px; font-family: var(--font-mono); font-size: 12px;
  background: var(--bg-card);
}
.cmt-chip-pos { font-size: 9px; color: #fff; padding: 1px 5px; border-radius: 3px; font-weight: 700; }
.cmt-chip-rm { background: none; border: none; font-size: 16px; cursor: pointer; color: var(--ink-light); padding: 0 2px; }
.cmt-chip-rm:hover { color: var(--ink); }

.cmt-table-wrap { overflow-x: auto; }
.cmt-table { width: 100%; border-collapse: collapse; font-family: var(--font-mono); font-size: 12px; }
.cmt-table thead th { text-align: left; padding: 6px 8px; font-size: 10px; text-transform: uppercase; color: var(--ink-light); border-bottom: 2px solid var(--ink); white-space: nowrap; cursor: default; }
.cmt-table thead th.cmt-sortable { cursor: pointer; }
.cmt-table thead th.cmt-sortable:hover { color: var(--ink); }
.cmt-table tbody tr { border-bottom: 1px solid var(--ink-faint); }
.cmt-table tbody tr:hover { background: rgba(217,119,87,0.08); }
.cmt-player-cell { display: flex; align-items: center; gap: 5px; padding: 5px 8px; min-width: 160px; }
.cmt-headshot { width: 28px; height: 28px; border-radius: 50%; border: 2px solid var(--ink); object-fit: cover; }
.cmt-pos { font-size: 9px; color: #fff; padding: 1px 5px; border-radius: 3px; font-weight: 700; }
.cmt-num { text-align: right; padding: 5px 8px; font-variant-numeric: tabular-nums; }
.cmt-best { background: #dcfce7; font-weight: 700; }

/* ===================================================================
   40. STRENGTHS & WEAKNESSES (sw2-)
   =================================================================== */
.sw2-player-card {
  display: flex; align-items: center; gap: 12px; padding: 16px;
  background: var(--bg-card); border: 3px solid var(--ink); border-radius: 10px;
  box-shadow: 4px 4px 0 var(--ink); margin-bottom: 16px;
}
.sw2-player-info { display: flex; align-items: center; gap: 8px; flex: 1; flex-wrap: wrap; }
.sw2-player-name { font-family: var(--font-display); font-size: 18px; color: var(--ink); }
.sw2-pos-badge { font-size: 10px; color: #fff; padding: 2px 6px; border-radius: 4px; font-weight: 700; }
.sw2-team { font-family: var(--font-mono); font-size: 12px; color: var(--ink-light); }
.sw2-overall-grade {
  font-family: var(--font-display); font-size: 22px; color: #fff; width: 48px; height: 48px;
  display: flex; align-items: center; justify-content: center; border-radius: 10px; font-weight: 700;
}

.sw2-columns { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 20px; }
.sw2-col-header {
  font-family: var(--font-display); font-size: 16px; padding: 8px 14px; border-radius: 8px 8px 0 0;
  color: #fff; margin-bottom: 8px;
}
.sw2-strengths-header { background: #16a34a; }
.sw2-weaknesses-header { background: #dc2626; }

.sw2-stat-card {
  display: flex; align-items: center; gap: 8px; padding: 8px 12px;
  background: var(--bg-card); border: 2px solid var(--ink-faint); border-radius: 8px; margin-bottom: 6px;
}
.sw2-stat-rank { font-family: var(--font-mono); font-size: 11px; color: var(--ink-light); min-width: 28px; }
.sw2-stat-info { flex: 1; }
.sw2-stat-label { font-family: var(--font-mono); font-size: 11px; font-weight: 700; }
.sw2-stat-value { font-family: var(--font-mono); font-size: 13px; color: var(--orange); }
.sw2-stat-pct-bar { width: 60px; height: 6px; background: var(--ink-faint); border-radius: 3px; overflow: hidden; }
.sw2-stat-pct-fill { height: 100%; border-radius: 3px; }
.sw2-stat-grade { font-size: 10px; color: #fff; padding: 2px 6px; border-radius: 4px; font-weight: 700; min-width: 24px; text-align: center; }

.sw2-bars-title { font-family: var(--font-display); font-size: 16px; color: var(--ink); margin: 0 0 10px; }
.sw2-bars { margin-bottom: 16px; }
.sw2-bar-row { display: flex; align-items: center; gap: 8px; margin-bottom: 4px; }
.sw2-bar-label { font-family: var(--font-mono); font-size: 11px; width: 100px; text-align: right; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sw2-bar-track { flex: 1; height: 14px; background: var(--ink-faint); border-radius: 7px; overflow: hidden; }
.sw2-bar-fill { height: 100%; border-radius: 7px; transition: width 0.3s; }
.sw2-bar-val { font-family: var(--font-mono); font-size: 11px; width: 36px; text-align: right; }
.sw2-bar-grade { font-family: var(--font-mono); font-size: 10px; font-weight: 700; width: 24px; }

/* ===================================================================
   41. REPORT CARD (rpc-)
   =================================================================== */
.rpc-section { margin-bottom: 24px; }
.rpc-section-title {
  font-family: var(--font-display); font-size: 18px; padding: 8px 14px; border-radius: 8px;
  color: #fff; margin-bottom: 10px;
}
.rpc-honor-title { background: #16a34a; }
.rpc-needs-title { background: #dc2626; }

.rpc-table-wrap { overflow-x: auto; }
.rpc-table { width: 100%; border-collapse: collapse; font-family: var(--font-mono); font-size: 12px; }
.rpc-table thead th { text-align: left; padding: 6px 8px; font-size: 10px; text-transform: uppercase; color: var(--ink-light); border-bottom: 2px solid var(--ink); white-space: nowrap; cursor: default; }
.rpc-table thead th.rpc-sortable { cursor: pointer; }
.rpc-table thead th.rpc-sortable:hover { color: var(--ink); }
.rpc-table tbody tr { border-bottom: 1px solid var(--ink-faint); }
.rpc-table tbody tr:hover { background: rgba(217,119,87,0.08); }
.rpc-player-cell { display: flex; align-items: center; gap: 5px; padding: 5px 8px; min-width: 160px; }
.rpc-headshot { width: 28px; height: 28px; border-radius: 50%; border: 2px solid var(--ink); object-fit: cover; }
.rpc-name { font-weight: 700; font-size: 12px; white-space: nowrap; }
.rpc-pos { font-size: 9px; color: #fff; padding: 1px 5px; border-radius: 3px; font-weight: 700; }
.rpc-team { font-size: 9px; color: var(--ink-light); }
.rpc-num { text-align: right; padding: 5px 8px; font-variant-numeric: tabular-nums; }
.rpc-annotation { font-size: 11px; color: var(--ink-light); max-width: 120px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.rpc-grade-badge {
  display: inline-block; padding: 2px 8px; border-radius: 4px; font-weight: 700; font-size: 11px; color: #fff;
}
.rpc-elite { background: #16a34a; }
.rpc-good { background: var(--blue); }
.rpc-avg { background: #eab308; }
.rpc-below { background: #f97316; }
.rpc-poor { background: #dc2626; }

/* ===================================================================
   42. FPTS BREAKDOWN (fpb-)
   =================================================================== */
.fpb-legend { display: flex; gap: 14px; flex-wrap: wrap; justify-content: center; margin-bottom: 12px; }
.fpb-legend-item { display: flex; align-items: center; gap: 4px; font-family: var(--font-mono); font-size: 11px; }
.fpb-legend-dot { width: 10px; height: 10px; border-radius: 50%; }

.fpb-card {
  background: var(--bg-card); border: 3px solid var(--ink); border-radius: 10px;
  box-shadow: 4px 4px 0 var(--ink); padding: 16px;
}
.fpb-row { display: flex; align-items: center; gap: 10px; padding: 6px 0; border-bottom: 1px solid var(--ink-faint); }
.fpb-row:last-child { border-bottom: none; }
.fpb-rank { font-family: var(--font-mono); font-size: 11px; color: var(--ink-light); min-width: 24px; text-align: right; }
.fpb-player { display: flex; align-items: center; gap: 5px; min-width: 140px; }
.fpb-name { font-family: var(--font-mono); font-size: 12px; font-weight: 700; white-space: nowrap; }
.fpb-team { font-family: var(--font-mono); font-size: 10px; color: var(--ink-light); }
.fpb-pos { font-size: 9px; color: #fff; padding: 1px 5px; border-radius: 3px; font-weight: 700; }
.fpb-ppg { font-family: var(--font-mono); font-size: 12px; font-weight: 700; min-width: 40px; text-align: right; }
.fpb-bar { flex: 1; display: flex; height: 22px; border-radius: 4px; overflow: hidden; min-width: 100px; }
.fpb-segment { display: flex; align-items: center; justify-content: center; transition: width 0.3s; }
.fpb-seg-label { font-family: var(--font-mono); font-size: 9px; color: #fff; font-weight: 700; }

/* ===================================================================
   43. GAME LOG (glo-)
   =================================================================== */
.glo-player-card {
  display: flex; align-items: center; gap: 12px; padding: 16px;
  background: var(--bg-card); border: 3px solid var(--ink); border-radius: 10px;
  box-shadow: 4px 4px 0 var(--ink); margin-bottom: 16px; flex-wrap: wrap;
}
.glo-player-info { display: flex; align-items: center; gap: 8px; flex: 1; }
.glo-player-name { font-family: var(--font-display); font-size: 18px; color: var(--ink); }
.glo-pos { font-size: 10px; color: #fff; padding: 2px 6px; border-radius: 4px; font-weight: 700; }
.glo-team { font-family: var(--font-mono); font-size: 12px; color: var(--ink-light); }
.glo-summary { display: flex; gap: 8px; }
.glo-chip {
  font-family: var(--font-mono); font-size: 12px; font-weight: 700; padding: 4px 10px;
  background: var(--bg); border: 2px solid var(--ink-faint); border-radius: 6px;
}

.glo-table-wrap { overflow-x: auto; }
.glo-table { width: 100%; border-collapse: collapse; font-family: var(--font-mono); font-size: 12px; }
.glo-table thead th { text-align: left; padding: 6px 8px; font-size: 10px; text-transform: uppercase; color: var(--ink-light); border-bottom: 2px solid var(--ink); white-space: nowrap; cursor: pointer; }
.glo-table thead th:hover { color: var(--ink); }
.glo-table tbody tr { border-bottom: 1px solid var(--ink-faint); }
.glo-table tbody tr:hover { background: rgba(217,119,87,0.08); }
.glo-num { text-align: right; padding: 5px 8px; font-variant-numeric: tabular-nums; }
.glo-elite { font-weight: 700; color: #16a34a; }
.glo-great { font-weight: 700; color: #5b7fff; }
.glo-ok { color: var(--ink); }
.glo-bad { color: #dc2626; }
.glo-totals { font-weight: 700; border-top: 2px solid var(--ink); background: rgba(217,119,87,0.05); }

/* ===================================================================
   44. PLAYER ARCHETYPES (arc-)
   =================================================================== */
.arc-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); gap: 16px; }
.arc-card {
  background: var(--bg-card); border: 3px solid var(--ink); border-radius: 10px;
  box-shadow: 4px 4px 0 var(--ink); overflow: hidden;
}
.arc-card-header { display: flex; align-items: center; gap: 10px; padding: 12px 14px; border-bottom: 2px solid var(--ink-faint); }
.arc-icon { font-size: 24px; }
.arc-card-title { flex: 1; }
.arc-name { font-family: var(--font-display); font-size: 15px; color: var(--ink); }
.arc-desc { font-family: var(--font-mono); font-size: 10px; color: var(--ink-light); }
.arc-pos-badge { font-size: 9px; color: #fff; padding: 2px 6px; border-radius: 4px; font-weight: 700; }
.arc-count { font-family: var(--font-mono); font-size: 11px; color: var(--ink-light); }

.arc-players { padding: 8px 14px; }
.arc-player {
  display: flex; align-items: center; gap: 6px; padding: 4px 0; border-bottom: 1px solid var(--ink-faint);
  font-family: var(--font-mono); font-size: 11px;
}
.arc-player:last-child { border-bottom: none; }
.arc-player-pos { font-size: 8px; color: #fff; padding: 1px 4px; border-radius: 3px; font-weight: 700; }
.arc-player-name { font-weight: 700; }
.arc-player-team { color: var(--ink-light); }
.arc-player-age { color: var(--ink-light); font-size: 10px; }
.arc-player-ppg { color: var(--orange); font-weight: 700; margin-left: auto; }
.arc-player-stat { color: var(--ink-light); font-size: 10px; }

/* ===================================================================
   45. POINTS BREAKDOWN / DONUT (pbd-)
   =================================================================== */
.pbd-player-card {
  display: flex; align-items: center; gap: 12px; padding: 16px;
  background: var(--bg-card); border: 3px solid var(--ink); border-radius: 10px;
  box-shadow: 4px 4px 0 var(--ink); margin-bottom: 16px; flex-wrap: wrap;
}
.pbd-player-info { display: flex; align-items: center; gap: 8px; flex: 1; }
.pbd-player-name { font-family: var(--font-display); font-size: 18px; color: var(--ink); }
.pbd-pos { font-size: 10px; color: #fff; padding: 2px 6px; border-radius: 4px; font-weight: 700; }
.pbd-team { font-family: var(--font-mono); font-size: 12px; color: var(--ink-light); }
.pbd-summary { display: flex; gap: 8px; }
.pbd-chip {
  font-family: var(--font-mono); font-size: 12px; font-weight: 700; padding: 4px 10px;
  background: var(--bg); border: 2px solid var(--ink-faint); border-radius: 6px;
}

.pbd-chart-area { display: flex; align-items: center; gap: 24px; margin-bottom: 20px; flex-wrap: wrap; justify-content: center; }
.pbd-chart-area canvas { flex-shrink: 0; }
.pbd-legend { display: flex; flex-direction: column; gap: 6px; }
.pbd-legend-item { display: flex; align-items: center; gap: 8px; font-family: var(--font-mono); font-size: 12px; }
.pbd-legend-dot { width: 12px; height: 12px; border-radius: 50%; flex-shrink: 0; }
.pbd-legend-label { font-weight: 700; }
.pbd-legend-val { color: var(--ink-light); }

.pbd-details { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 10px; }
.pbd-detail-card {
  background: var(--bg-card); border: 2px solid var(--ink-faint); border-radius: 8px;
  padding: 10px 14px;
}
.pbd-detail-label { font-family: var(--font-mono); font-size: 11px; color: var(--ink-light); text-transform: uppercase; }
.pbd-detail-pts { font-family: var(--font-mono); font-size: 16px; font-weight: 700; color: var(--ink); }
.pbd-detail-raw { font-family: var(--font-mono); font-size: 11px; color: var(--ink-light); }

/* ===================================================================
   PLAYER TOOLS RESPONSIVE
   =================================================================== */
@media (max-width: 768px) {
  .cst-chips { gap: 6px; }
  .cst-chip { min-width: 60px; padding: 6px 10px; }
  .cst-chip-val { font-size: 14px; }
  .cst-table { font-size: 11px; }
  .ccp-table { font-size: 11px; }
  .cmt-table { font-size: 11px; }
  .cmt-player-cell { min-width: 130px; }
  .sw2-columns { grid-template-columns: 1fr; }
  .sw2-bar-label { width: 80px; }
  .rpc-table { font-size: 11px; }
  .rpc-player-cell { min-width: 130px; }
  .fpb-player { min-width: 110px; }
  .fpb-name { font-size: 11px; }
  .glo-table { font-size: 11px; }
  .arc-grid { grid-template-columns: 1fr; }
  .pbd-chart-area { flex-direction: column; }
  .pbd-details { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 480px) {
  .cst-player-name { font-size: 15px; }
  .cst-chip { min-width: auto; padding: 5px 8px; }
  .cst-chip-val { font-size: 13px; }
  .cmt-player-cell { min-width: 110px; }
  .sw2-player-card { flex-direction: column; text-align: center; }
  .sw2-overall-grade { margin: 0 auto; }
  .rpc-player-cell { min-width: 110px; }
  .fpb-row { flex-wrap: wrap; }
  .fpb-bar { min-width: 100%; }
  .glo-player-card { flex-direction: column; }
  .pbd-details { grid-template-columns: 1fr; }
}

/* ===== AWARDS PANEL (aw2-) ===== */
.aw2-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); gap: 20px; }
.aw2-card { background: var(--bg-card); border: 3px solid var(--ink); border-radius: 12px; padding: 20px; box-shadow: 4px 4px 0 var(--ink); }
.aw2-card-header { display: flex; align-items: flex-start; gap: 10px; margin-bottom: 14px; }
.aw2-trophy { font-size: 28px; }
.aw2-card-title { font-family: var(--font-display); font-size: 16px; color: var(--ink); }
.aw2-card-desc { font-family: var(--font-hand); font-size: 14px; color: var(--ink-light); }
.aw2-winner { display: flex; align-items: center; gap: 12px; padding: 10px; background: var(--bg-warm); border-radius: 8px; margin-bottom: 10px; cursor: pointer; }
.aw2-winner:hover { background: var(--bg); }
.aw2-winner-headshot { width: 48px; height: 48px; border-radius: 50%; border: 2px solid var(--ink); object-fit: cover; }
.aw2-winner-name { font-family: var(--font-display); font-size: 16px; color: var(--ink); }
.aw2-winner-meta { display: flex; align-items: center; gap: 8px; font-family: var(--font-mono); font-size: 11px; color: var(--ink-light); flex-wrap: wrap; }
.aw2-pos-badge { padding: 2px 8px; border-radius: 4px; color: #fff; font-size: 10px; font-weight: 700; text-transform: uppercase; }
.aw2-pos-badge.qb { background: var(--pos-qb); }
.aw2-pos-badge.rb { background: var(--pos-rb); }
.aw2-pos-badge.wr { background: var(--pos-wr); }
.aw2-pos-badge.te { background: var(--pos-te); }
.aw2-winner-grades { display: flex; gap: 6px; margin-top: 6px; flex-wrap: wrap; }
.aw2-grade { font-family: var(--font-mono); font-size: 10px; padding: 2px 6px; border-radius: 4px; font-weight: 700; border: 2px solid var(--ink); }
.aw2-grade.elite { background: #d4edda; color: #155724; }
.aw2-grade.good { background: #cce5ff; color: #004085; }
.aw2-grade.avg { background: #fff3cd; color: #856404; }
.aw2-grade.below { background: #ffe0cc; color: #944a1e; }
.aw2-grade.poor { background: #f8d7da; color: #721c24; }
.aw2-annotation { font-family: var(--font-hand); font-size: 14px; color: var(--ink-light); margin-top: 6px; }
.aw2-winner-stat { text-align: center; margin-left: auto; min-width: 60px; }
.aw2-stat-value { font-family: var(--font-display); font-size: 22px; color: var(--orange); }
.aw2-stat-label { font-family: var(--font-mono); font-size: 10px; color: var(--ink-light); }
.aw2-runners { border-top: 2px dashed var(--ink-faint); padding-top: 10px; margin-top: 10px; }
.aw2-runners-title { font-family: var(--font-hand); font-size: 14px; color: var(--ink-light); margin-bottom: 6px; }
.aw2-runner-row { display: flex; align-items: center; gap: 8px; padding: 4px 0; cursor: pointer; font-family: var(--font-mono); font-size: 12px; }
.aw2-runner-row:hover { color: var(--orange); }
.aw2-runner-rank { font-weight: 700; min-width: 16px; }
.aw2-runner-headshot { width: 24px; height: 24px; border-radius: 50%; object-fit: cover; }
.aw2-runner-pos { padding: 1px 6px; border-radius: 3px; color: #fff; font-size: 9px; font-weight: 700; }
.aw2-runner-pos.qb { background: var(--pos-qb); }
.aw2-runner-pos.rb { background: var(--pos-rb); }
.aw2-runner-pos.wr { background: var(--pos-wr); }
.aw2-runner-pos.te { background: var(--pos-te); }
.aw2-runner-stat { margin-left: auto; font-weight: 700; }

/* ===== DASHBOARD PANEL (db2-) ===== */
.db2-top5-row { display: flex; gap: 12px; margin-bottom: 20px; flex-wrap: wrap; justify-content: center; }
.db2-top5-card { background: var(--bg-card); border: 3px solid var(--ink); border-radius: 10px; padding: 12px 16px; text-align: center; min-width: 140px; box-shadow: 3px 3px 0 var(--ink); }
.db2-top5-rank { font-family: var(--font-display); font-size: 20px; color: var(--orange); }
.db2-top5-name { font-family: var(--font-display); font-size: 14px; color: var(--ink); }
.db2-top5-tv { font-family: var(--font-mono); font-size: 18px; font-weight: 700; color: var(--ink); }
.db2-top5-meta { font-family: var(--font-mono); font-size: 11px; color: var(--ink-light); }
.db2-pos { font-size: 10px; font-weight: 700; padding: 1px 6px; border-radius: 4px; color: #fff; }
.db2-pos.QB { background: var(--pos-qb); }
.db2-pos.RB { background: var(--pos-rb); }
.db2-pos.WR { background: var(--pos-wr); }
.db2-pos.TE { background: var(--pos-te); }
.db2-trends-row { display: flex; gap: 12px; margin-bottom: 20px; flex-wrap: wrap; justify-content: center; }
.db2-trend-card { background: var(--bg-card); border: 3px solid var(--ink); border-radius: 10px; padding: 12px 16px; text-align: center; min-width: 130px; }
.db2-trend-pos { font-family: var(--font-display); font-size: 14px; padding: 2px 10px; border-radius: 4px; color: #fff; display: inline-block; margin-bottom: 6px; }
.db2-trend-pos.QB { background: var(--pos-qb); }
.db2-trend-pos.RB { background: var(--pos-rb); }
.db2-trend-pos.WR { background: var(--pos-wr); }
.db2-trend-pos.TE { background: var(--pos-te); }
.db2-trend-big { font-family: var(--font-display); font-size: 22px; color: var(--ink); }
.db2-trend-stat { font-family: var(--font-mono); font-size: 11px; color: var(--ink-light); }
.db2-section { background: var(--bg-card); border: 3px solid var(--ink); border-radius: 10px; padding: 16px; margin-bottom: 16px; }
.db2-section-header { font-family: var(--font-display); font-size: 16px; color: var(--ink); margin-bottom: 10px; padding-bottom: 6px; border-bottom: 2px dashed var(--ink-faint); }
.db2-row { display: flex; align-items: center; gap: 8px; padding: 6px 0; font-family: var(--font-mono); font-size: 12px; border-bottom: 1px solid var(--ink-faint); }
.db2-row:last-child { border-bottom: none; }
.db2-row-rank { font-weight: 700; min-width: 18px; }
.db2-row-name { flex: 1; font-weight: 600; }
.db2-row-team { color: var(--ink-light); font-size: 11px; }
.db2-chip { font-size: 10px; padding: 2px 8px; border-radius: 10px; font-weight: 700; }
.db2-chip.ppg { background: var(--bg-warm); }
.db2-chip.up { background: #d4edda; color: #155724; }
.db2-chip.down { background: #f8d7da; color: #721c24; }
.db2-chip.tv { background: #cce5ff; color: #004085; }
.db2-scar-row { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; }
.db2-scar-pos { font-family: var(--font-display); font-size: 13px; min-width: 28px; text-align: center; padding: 2px 8px; border-radius: 4px; color: #fff; }
.db2-scar-pos.QB { background: var(--pos-qb); }
.db2-scar-pos.RB { background: var(--pos-rb); }
.db2-scar-pos.WR { background: var(--pos-wr); }
.db2-scar-pos.TE { background: var(--pos-te); }
.db2-scar-bar-wrap { flex: 1; height: 18px; background: var(--bg-warm); border-radius: 4px; overflow: hidden; }
.db2-scar-bar { height: 100%; border-radius: 4px; }
.db2-scar-bar.QB { background: var(--pos-qb); }
.db2-scar-bar.RB { background: var(--pos-rb); }
.db2-scar-bar.WR { background: var(--pos-wr); }
.db2-scar-bar.TE { background: var(--pos-te); }
.db2-scar-info { font-family: var(--font-mono); font-size: 11px; color: var(--ink-light); min-width: 180px; }

/* ===== DRAFT CLASS PANEL (dc2-) ===== */
.dc2-summary { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; margin-bottom: 20px; }
.dc2-chip { background: var(--bg-card); border: 2px solid var(--ink); border-radius: 8px; padding: 8px 14px; text-align: center; box-shadow: 2px 2px 0 var(--ink); }
.dc2-chip-label { font-family: var(--font-mono); font-size: 10px; color: var(--ink-light); text-transform: uppercase; }
.dc2-chip-value { font-family: var(--font-display); font-size: 20px; color: var(--ink); }
.dc2-chip-value.green { color: #155724; }
.dc2-chip-value.red { color: #721c24; }
.dc2-chart-wrap { background: var(--bg-card); border: 3px solid var(--ink); border-radius: 10px; padding: 16px; margin-bottom: 20px; }
.dc2-chart-title { font-family: var(--font-display); font-size: 16px; text-align: center; margin-bottom: 10px; }
.dc2-canvas { width: 100%; display: block; }
.dc2-table-wrap { overflow-x: auto; }
.dc2-table { width: 100%; border-collapse: collapse; font-family: var(--font-mono); font-size: 12px; }
.dc2-table th { background: var(--ink); color: var(--bg-card); padding: 8px 10px; text-align: center; cursor: pointer; white-space: nowrap; font-size: 11px; }
.dc2-table th.sorted { background: var(--orange); }
.dc2-table td { padding: 8px 10px; border-bottom: 1px solid var(--ink-faint); text-align: center; }
.dc2-table tbody tr { cursor: pointer; }
.dc2-table tbody tr:hover { background: var(--bg-warm); }
.dc2-pos-badge { padding: 2px 8px; border-radius: 4px; color: #fff; font-size: 10px; font-weight: 700; }
.dc2-pos-badge.QB { background: var(--pos-qb); }
.dc2-pos-badge.RB { background: var(--pos-rb); }
.dc2-pos-badge.WR { background: var(--pos-wr); }
.dc2-pos-badge.TE { background: var(--pos-te); }
.dc2-verdict { font-size: 10px; font-weight: 700; padding: 2px 8px; border-radius: 4px; }
.dc2-verdict.hit { background: #d4edda; color: #155724; }
.dc2-verdict.solid { background: #cce5ff; color: #004085; }
.dc2-verdict.ok { background: #fff3cd; color: #856404; }
.dc2-verdict.bust { background: #f8d7da; color: #721c24; }

/* ===== EXPLORER PANEL (exp-) ===== */
.exp-count { text-align: center; font-family: var(--font-mono); font-size: 12px; color: var(--ink-light); margin-bottom: 10px; }
.exp-chart-wrap { position: relative; background: var(--bg-card); border: 3px solid var(--ink); border-radius: 10px; padding: 20px; }
.exp-canvas { display: block; width: 100%; cursor: crosshair; }
.exp-tooltip { display: none; position: absolute; background: var(--bg-card); border: 2px solid var(--ink); border-radius: 8px; padding: 8px 12px; font-family: var(--font-mono); font-size: 12px; z-index: 10; pointer-events: none; box-shadow: 3px 3px 0 var(--ink); }

/* ===== LEADERS PANEL (ld2-) ===== */
.ld2-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 16px; }
.ld2-card { background: var(--bg-card); border: 3px solid var(--ink); border-radius: 10px; padding: 16px; box-shadow: 3px 3px 0 var(--ink); }
.ld2-card-header { display: flex; align-items: baseline; gap: 8px; margin-bottom: 10px; padding-bottom: 8px; border-bottom: 2px dashed var(--ink-faint); }
.ld2-card-title { font-family: var(--font-display); font-size: 16px; color: var(--ink); }
.ld2-card-annotation { font-family: var(--font-hand); font-size: 14px; color: var(--ink-light); }
.ld2-list { list-style: none; padding: 0; margin: 0; }
.ld2-row { display: flex; align-items: center; gap: 8px; padding: 6px 0; border-bottom: 1px solid var(--ink-faint); cursor: pointer; }
.ld2-row:hover { background: var(--bg-warm); }
.ld2-row:last-child { border-bottom: none; }
.ld2-rank { font-family: var(--font-display); font-size: 14px; min-width: 24px; text-align: center; padding: 2px 6px; border-radius: 50%; }
.ld2-rank.gold { background: #ffd700; color: #2d1f14; }
.ld2-rank.silver { background: #c0c0c0; color: #2d1f14; }
.ld2-rank.bronze { background: #cd7f32; color: #fff; }
.ld2-player-info { display: flex; align-items: center; gap: 6px; flex: 1; min-width: 0; }
.ld2-player-name { font-family: var(--font-mono); font-size: 12px; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ld2-pos-badge { padding: 1px 6px; border-radius: 3px; color: #fff; font-size: 9px; font-weight: 700; }
.ld2-pos-badge.qb { background: var(--pos-qb); }
.ld2-pos-badge.rb { background: var(--pos-rb); }
.ld2-pos-badge.wr { background: var(--pos-wr); }
.ld2-pos-badge.te { background: var(--pos-te); }
.ld2-team { font-family: var(--font-mono); font-size: 10px; color: var(--ink-light); }
.ld2-stat-value { font-family: var(--font-mono); font-size: 13px; font-weight: 700; margin-left: auto; white-space: nowrap; }

/* ===== OPPORTUNITY PANEL (opp2-) ===== */
.opp2-section { margin-bottom: 24px; }
.opp2-section-header { font-family: var(--font-display); font-size: 18px; color: var(--ink); margin-bottom: 12px; padding-bottom: 8px; border-bottom: 3px solid var(--ink); }
.opp2-section-header.alpha { border-color: var(--orange); }
.opp2-section-header.dominator { border-color: var(--pos-qb); }
.opp2-table { width: 100%; border-collapse: collapse; font-family: var(--font-mono); font-size: 12px; }
.opp2-table th { background: var(--ink); color: var(--bg-card); padding: 8px 10px; cursor: pointer; white-space: nowrap; font-size: 11px; }
.opp2-table th.center { text-align: center; }
.opp2-table td { padding: 8px 10px; border-bottom: 1px solid var(--ink-faint); }
.opp2-table td.center { text-align: center; }
.opp2-table tbody tr { cursor: pointer; }
.opp2-table tbody tr:hover { background: var(--bg-warm); }
.opp2-player-cell { display: flex; align-items: center; gap: 8px; }
.opp2-headshot { width: 32px; height: 32px; border-radius: 50%; object-fit: cover; border: 2px solid var(--ink); }
.opp2-player-name { font-weight: 700; }
.opp2-player-meta { font-size: 10px; color: var(--ink-light); }
.opp2-pos-badge { padding: 1px 6px; border-radius: 3px; color: #fff; font-size: 9px; font-weight: 700; }
.opp2-pos-badge.qb { background: var(--pos-qb); }
.opp2-pos-badge.rb { background: var(--pos-rb); }
.opp2-pos-badge.wr { background: var(--pos-wr); }
.opp2-pos-badge.te { background: var(--pos-te); }
.opp2-share-badge, .opp2-dom-badge { font-size: 11px; font-weight: 700; padding: 2px 8px; border-radius: 4px; }
.opp2-share-badge.elite, .opp2-dom-badge.elite { background: #d4edda; color: #155724; }
.opp2-share-badge.good, .opp2-dom-badge.good { background: #cce5ff; color: #004085; }
.opp2-share-badge.avg, .opp2-dom-badge.avg { background: #fff3cd; color: #856404; }
.opp2-share-badge.below, .opp2-dom-badge.below { background: #ffe0cc; color: #944a1e; }
.opp2-share-badge.poor, .opp2-dom-badge.poor { background: #f8d7da; color: #721c24; }

/* ===== PERCENTILES PANEL (pct2-) ===== */
.pct2-player-card { display: flex; align-items: center; gap: 16px; background: var(--bg-card); border: 3px solid var(--ink); border-radius: 10px; padding: 16px; margin-bottom: 12px; box-shadow: 3px 3px 0 var(--ink); }
.pct2-player-name { font-family: var(--font-display); font-size: 20px; margin: 0; }
.pct2-player-meta { display: flex; align-items: center; gap: 8px; font-family: var(--font-mono); font-size: 12px; color: var(--ink-light); }
.pct2-pos-badge { padding: 2px 8px; border-radius: 4px; color: #fff; font-size: 10px; font-weight: 700; }
.pct2-pos-badge.QB { background: var(--pos-qb); }
.pct2-pos-badge.RB { background: var(--pos-rb); }
.pct2-pos-badge.WR { background: var(--pos-wr); }
.pct2-pos-badge.TE { background: var(--pos-te); }
.pct2-pool { text-align: center; font-family: var(--font-hand); font-size: 14px; color: var(--ink-light); margin-bottom: 16px; }
.pct2-bars { max-width: 600px; margin: 0 auto; }
.pct2-bar-row { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; }
.pct2-bar-label { font-family: var(--font-mono); font-size: 11px; min-width: 100px; text-align: right; color: var(--ink-light); }
.pct2-bar-track { flex: 1; height: 24px; background: var(--bg-warm); border-radius: 6px; overflow: hidden; }
.pct2-bar-fill { height: 100%; border-radius: 6px; display: flex; align-items: center; justify-content: flex-end; padding-right: 6px; transition: width 0.3s; }
.pct2-bar-pctile { font-family: var(--font-mono); font-size: 10px; font-weight: 700; color: #fff; }
.pct2-bar-value { font-family: var(--font-mono); font-size: 11px; min-width: 50px; font-weight: 700; }

/* ===== PROSPECTS PANEL (bb-) ===== */
.bb-tier { margin-bottom: 24px; }
.bb-tier-header { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; padding-bottom: 8px; border-bottom: 2px dashed var(--ink-faint); }
.bb-tier-badge { font-family: var(--font-display); font-size: 14px; font-weight: 700; padding: 4px 12px; border: 2px solid var(--ink); border-radius: 20px; background: var(--bg-card); box-shadow: 2px 2px 0 var(--ink); transform: rotate(-2deg); }
.bb-tier-label { font-family: var(--font-hand); font-size: 18px; color: var(--ink-light); }
.bb-tier-count { font-family: var(--font-mono); font-size: 11px; color: var(--ink-light); margin-left: auto; }
.bb-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 14px; }
.bb-card { background: var(--bg-card); border: 3px solid var(--ink); border-radius: 10px; padding: 14px; box-shadow: 3px 3px 0 var(--ink); }
.bb-card-top { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
.bb-rank { font-family: var(--font-display); font-size: 16px; color: var(--orange); min-width: 30px; }
.bb-pos-badge { padding: 2px 8px; border-radius: 4px; color: #fff; font-size: 10px; font-weight: 700; }
.bb-pos-badge.qb { background: var(--pos-qb); }
.bb-pos-badge.rb { background: var(--pos-rb); }
.bb-pos-badge.wr { background: var(--pos-wr); }
.bb-pos-badge.te { background: var(--pos-te); }
.bb-info { flex: 1; min-width: 0; }
.bb-name { font-family: var(--font-display); font-size: 14px; }
.bb-meta { font-family: var(--font-mono); font-size: 11px; color: var(--ink-light); }
.bb-rps { text-align: center; min-width: 50px; }
.bb-rps-value { font-family: var(--font-display); font-size: 20px; color: var(--orange); }
.bb-rps-label { font-family: var(--font-mono); font-size: 9px; color: var(--ink-light); }
.bb-draft-row { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
.bb-draft-chip { font-family: var(--font-mono); font-size: 11px; background: var(--bg-warm); padding: 2px 8px; border-radius: 4px; }
.bb-meas { font-family: var(--font-mono); font-size: 11px; color: var(--ink-light); }
.bb-pcts { margin-top: 8px; }
.bb-pct-row { display: flex; align-items: center; gap: 6px; margin-bottom: 4px; }
.bb-pct-label { font-family: var(--font-mono); font-size: 10px; min-width: 50px; text-align: right; color: var(--ink-light); }
.bb-pct-bar-bg { flex: 1; height: 14px; background: var(--bg-warm); border-radius: 4px; overflow: hidden; }
.bb-pct-bar-fill { height: 100%; border-radius: 4px; }
.bb-pct-val { font-family: var(--font-mono); font-size: 10px; min-width: 32px; font-weight: 700; }

/* ===== RECAP PANEL (rc2-) ===== */
.rc2-mvp { background: var(--bg-card); border: 3px solid var(--ink); border-radius: 12px; padding: 20px; text-align: center; margin-bottom: 20px; box-shadow: 4px 4px 0 var(--ink); }
.rc2-mvp-label { font-family: var(--font-hand); font-size: 16px; color: var(--ink-light); }
.rc2-mvp-name { font-family: var(--font-display); font-size: 24px; color: var(--ink); margin: 6px 0; }
.rc2-mvp-stats { display: flex; justify-content: center; gap: 30px; margin-top: 12px; }
.rc2-mvp-val { font-family: var(--font-display); font-size: 22px; color: var(--orange); }
.rc2-mvp-lbl { font-family: var(--font-mono); font-size: 10px; color: var(--ink-light); }
.rc2-pos-leaders { display: flex; gap: 12px; justify-content: center; margin-bottom: 20px; flex-wrap: wrap; }
.rc2-pos-card { background: var(--bg-card); border: 3px solid var(--ink); border-radius: 10px; padding: 12px 16px; text-align: center; min-width: 130px; }
.rc2-pos-label { font-family: var(--font-display); font-size: 14px; padding: 2px 10px; border-radius: 4px; color: #fff; display: inline-block; margin-bottom: 6px; }
.rc2-pos-name { font-family: var(--font-display); font-size: 14px; color: var(--ink); }
.rc2-pos-stat { font-family: var(--font-mono); font-size: 11px; color: var(--ink-light); }
.rc2-pos-chip { padding: 1px 6px; border-radius: 3px; color: #fff; font-size: 9px; font-weight: 700; margin-left: 4px; }
.rc2-sections { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 16px; }
.rc2-section { background: var(--bg-card); border: 3px solid var(--ink); border-radius: 10px; padding: 16px; }
.rc2-section-header { font-family: var(--font-display); font-size: 16px; margin-bottom: 10px; padding-bottom: 6px; border-bottom: 2px dashed var(--ink-faint); }
.rc2-list { list-style: none; padding: 0; margin: 0; }
.rc2-list li { display: flex; justify-content: space-between; align-items: center; padding: 6px 0; border-bottom: 1px solid var(--ink-faint); font-family: var(--font-mono); font-size: 12px; }
.rc2-list li:last-child { border-bottom: none; }
.rc2-badge { font-size: 10px; font-weight: 700; padding: 2px 6px; border-radius: 4px; margin-right: 4px; }
.rc2-badge.gold { background: #ffd700; color: #2d1f14; }
.rc2-badge.green { background: #d4edda; color: #155724; }
.rc2-badge.red { background: #f8d7da; color: #721c24; }
.rc2-badge.blue { background: #cce5ff; color: #004085; }

/* ===== RECORDS PANEL (rec-) ===== */
.rec-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); gap: 16px; }
.rec-section { background: var(--bg-card); border: 3px solid var(--ink); border-radius: 10px; padding: 16px; }
.rec-section-header { font-family: var(--font-display); font-size: 16px; margin-bottom: 10px; padding-bottom: 6px; border-bottom: 2px dashed var(--ink-faint); }
.rec-table { width: 100%; border-collapse: collapse; font-family: var(--font-mono); font-size: 12px; }
.rec-table th { padding: 6px 8px; text-align: center; font-size: 11px; border-bottom: 2px solid var(--ink); }
.rec-table td { padding: 6px 8px; text-align: center; border-bottom: 1px solid var(--ink-faint); }
.rec-rank { font-weight: 700; display: inline-block; min-width: 20px; text-align: center; }
.rec-rank.gold { color: #b8860b; }
.rec-rank.silver { color: #808080; }
.rec-rank.bronze { color: #cd7f32; }
.rec-pos-chip { padding: 1px 6px; border-radius: 3px; color: #fff; font-size: 9px; font-weight: 700; margin-left: 4px; }
.rec-season-badge { background: var(--bg-warm); padding: 1px 6px; border-radius: 4px; font-size: 10px; }
.rec-fpts { font-weight: 700; }

/* ===== ROSTER BUILDER PANEL (rbld-) ===== */
.rbld-layout { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.rbld-left, .rbld-right { min-width: 0; }
.rbld-search-area { position: relative; margin-bottom: 12px; }
.rbld-autocomplete { display: none; position: absolute; top: 100%; left: 0; right: 0; background: var(--bg-card); border: 2px solid var(--ink); border-radius: 0 0 8px 8px; z-index: 10; max-height: 260px; overflow-y: auto; }
.rbld-ac-item { display: flex; align-items: center; gap: 8px; padding: 8px 10px; cursor: pointer; font-family: var(--font-mono); font-size: 12px; }
.rbld-ac-item:hover { background: var(--bg-warm); }
.rbld-ac-pos { padding: 1px 6px; border-radius: 3px; color: #fff; font-size: 9px; font-weight: 700; }
.rbld-ac-pos.QB { background: var(--pos-qb); }
.rbld-ac-pos.RB { background: var(--pos-rb); }
.rbld-ac-pos.WR { background: var(--pos-wr); }
.rbld-ac-pos.TE { background: var(--pos-te); }
.rbld-ac-team { color: var(--ink-light); font-size: 11px; margin-left: auto; }
.rbld-slot-count { font-family: var(--font-mono); font-size: 12px; color: var(--ink-light); margin-bottom: 8px; }
.rbld-roster-list { list-style: none; padding: 0; margin: 0; }
.rbld-empty { font-family: var(--font-hand); font-size: 16px; color: var(--ink-light); padding: 20px; text-align: center; }
.rbld-player-row { display: flex; align-items: center; gap: 6px; padding: 6px 0; border-bottom: 1px solid var(--ink-faint); font-family: var(--font-mono); font-size: 12px; }
.rbld-player-name { flex: 1; font-weight: 600; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rbld-player-team { color: var(--ink-light); font-size: 11px; }
.rbld-player-tv { font-weight: 700; }
.rbld-player-vorp { font-size: 11px; }
.rbld-player-vorp.positive { color: #155724; }
.rbld-player-vorp.negative { color: #721c24; }
.rbld-remove-btn { background: none; border: none; color: var(--red); font-size: 18px; cursor: pointer; padding: 0 4px; }
.rbld-clear-btn { font-family: var(--font-display); font-size: 12px; padding: 6px 14px; border: 2px solid var(--ink); border-radius: 8px; background: var(--bg-card); cursor: pointer; margin-top: 10px; }
.rbld-clear-btn:hover { background: var(--bg-warm); }
.rbld-grade-empty { font-family: var(--font-hand); font-size: 16px; color: var(--ink-light); text-align: center; padding: 40px 20px; }
.rbld-grade-card { background: var(--bg-card); border: 3px solid var(--ink); border-radius: 12px; padding: 20px; text-align: center; margin-bottom: 16px; box-shadow: 4px 4px 0 var(--ink); }
.rbld-grade-letter { font-family: var(--font-display); font-size: 48px; }
.rbld-grade-score { font-family: var(--font-mono); font-size: 14px; color: var(--ink-light); }
.rbld-total-tv { font-family: var(--font-mono); font-size: 12px; color: var(--ink-light); margin-top: 4px; }
.rbld-dim-row { margin-bottom: 10px; }
.rbld-dim-label { display: flex; justify-content: space-between; font-family: var(--font-mono); font-size: 11px; margin-bottom: 4px; }
.rbld-dim-bar { height: 16px; background: var(--bg-warm); border-radius: 4px; overflow: hidden; }
.rbld-dim-fill { height: 100%; border-radius: 4px; }
.rbld-dim-fill.tv { background: var(--orange); }
.rbld-dim-fill.vorp { background: var(--pos-qb); }
.rbld-dim-fill.age { background: var(--pos-rb); }
.rbld-dim-fill.depth { background: var(--pos-te); }
.rbld-pos-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin-top: 16px; }
.rbld-pos-item { background: var(--bg-card); border: 2px solid var(--ink); border-radius: 8px; padding: 10px; text-align: center; }
.rbld-pos-item-label { font-family: var(--font-display); font-size: 14px; }
.rbld-pos-item.QB .rbld-pos-item-label { color: var(--pos-qb); }
.rbld-pos-item.RB .rbld-pos-item-label { color: var(--pos-rb); }
.rbld-pos-item.WR .rbld-pos-item-label { color: var(--pos-wr); }
.rbld-pos-item.TE .rbld-pos-item-label { color: var(--pos-te); }
.rbld-pos-item-count { font-family: var(--font-display); font-size: 22px; color: var(--ink); }
.rbld-pos-item-meta { font-family: var(--font-mono); font-size: 10px; color: var(--ink-light); }

/* ===== SCHEDULE (SOS) PANEL (sos2-) ===== */
.sos2-section { margin-bottom: 24px; }
.sos2-section-header { font-family: var(--font-display); font-size: 18px; color: var(--ink); margin-bottom: 12px; padding-bottom: 8px; border-bottom: 3px solid var(--ink); }
.sos2-section-header.suppressed { border-color: var(--pos-qb); }
.sos2-section-header.inflated { border-color: var(--pos-rb); }
.sos2-table { width: 100%; border-collapse: collapse; font-family: var(--font-mono); font-size: 12px; }
.sos2-table th { background: var(--ink); color: var(--bg-card); padding: 8px 10px; cursor: pointer; white-space: nowrap; font-size: 11px; }
.sos2-table th.center { text-align: center; }
.sos2-table td { padding: 8px 10px; border-bottom: 1px solid var(--ink-faint); }
.sos2-table td.center { text-align: center; }
.sos2-table tbody tr { cursor: pointer; }
.sos2-table tbody tr:hover { background: var(--bg-warm); }
.sos2-player-cell { display: flex; align-items: center; gap: 8px; }
.sos2-headshot { width: 32px; height: 32px; border-radius: 50%; object-fit: cover; border: 2px solid var(--ink); }
.sos2-player-name { font-weight: 700; }
.sos2-player-meta { font-size: 10px; color: var(--ink-light); }
.sos2-pos-badge { padding: 1px 6px; border-radius: 3px; color: #fff; font-size: 9px; font-weight: 700; }
.sos2-pos-badge.qb { background: var(--pos-qb); }
.sos2-pos-badge.rb { background: var(--pos-rb); }
.sos2-pos-badge.wr { background: var(--pos-wr); }
.sos2-pos-badge.te { background: var(--pos-te); }
.sos2-grade-badge { font-size: 11px; font-weight: 700; padding: 2px 8px; border-radius: 4px; }
.sos2-grade-badge.grade-aplus, .sos2-grade-badge.grade-a { background: #d4edda; color: #155724; }
.sos2-grade-badge.grade-b { background: #cce5ff; color: #004085; }
.sos2-grade-badge.grade-c { background: #fff3cd; color: #856404; }
.sos2-grade-badge.grade-d { background: #ffe0cc; color: #944a1e; }
.sos2-grade-badge.grade-f { background: #f8d7da; color: #721c24; }
.sos2-delta { font-weight: 700; }
.sos2-delta.hard { color: #155724; }
.sos2-delta.easy { color: #721c24; }

/* ===== SCORING PANEL (sc2-) ===== */
.sc2-section { margin-bottom: 24px; }
.sc2-section-header { font-family: var(--font-display); font-size: 18px; color: var(--ink); margin-bottom: 12px; padding-bottom: 8px; border-bottom: 3px solid var(--ink); }
.sc2-section-header.risers { border-color: #155724; }
.sc2-section-header.fallers { border-color: #721c24; }
.sc2-table { width: 100%; border-collapse: collapse; font-family: var(--font-mono); font-size: 12px; }
.sc2-table th { background: var(--ink); color: var(--bg-card); padding: 8px 10px; font-size: 11px; }
.sc2-table td { padding: 8px 10px; border-bottom: 1px solid var(--ink-faint); }
.sc2-table tbody tr { cursor: pointer; }
.sc2-table tbody tr:hover { background: var(--bg-warm); }
.sc2-pos-badge { padding: 1px 6px; border-radius: 3px; color: #fff; font-size: 9px; font-weight: 700; }
.sc2-pos-badge.QB { background: var(--pos-qb); }
.sc2-pos-badge.RB { background: var(--pos-rb); }
.sc2-pos-badge.WR { background: var(--pos-wr); }
.sc2-pos-badge.TE { background: var(--pos-te); }
.sc2-headshot { width: 28px; height: 28px; border-radius: 50%; object-fit: cover; margin-right: 6px; vertical-align: middle; }
.sc2-rank-shift { font-weight: 700; padding: 2px 6px; border-radius: 4px; }
.sc2-rank-shift.up { background: #d4edda; color: #155724; }
.sc2-rank-shift.down { background: #f8d7da; color: #721c24; }
.sc2-rank-shift.neutral { background: var(--bg-warm); color: var(--ink-light); }

/* ===== SUCCESS RATE PANEL (sr2-) ===== */
.sr2-table { width: 100%; border-collapse: collapse; font-family: var(--font-mono); font-size: 12px; }
.sr2-table th { background: var(--ink); color: var(--bg-card); padding: 8px 10px; font-size: 11px; }
.sr2-table td { padding: 8px 10px; border-bottom: 1px solid var(--ink-faint); }
.sr2-rank { font-weight: 700; text-align: center; }
.sr2-pos-badge { padding: 1px 6px; border-radius: 3px; color: #fff; font-size: 9px; font-weight: 700; }
.sr2-rate-badge { font-weight: 700; padding: 2px 8px; border-radius: 4px; }
.sr2-rate-high { background: #d4edda; color: #155724; }
.sr2-rate-mid { background: #fff3cd; color: #856404; }
.sr2-rate-low { background: #f8d7da; color: #721c24; }
.sr2-type-chip { font-size: 10px; background: var(--bg-warm); padding: 2px 6px; border-radius: 4px; }
.sr2-bar-cell { width: 80px; }
.sr2-bar { height: 14px; background: var(--orange); border-radius: 4px; opacity: 0.6; }

/* ===== TARGETS PANEL (td2-) ===== */
.td2-mode-tabs { display: flex; border: 2px solid var(--ink); border-radius: 8px; overflow: hidden; }
.td2-mode-tab { font-family: var(--font-display); font-size: 13px; padding: 6px 14px; background: var(--bg-card); color: var(--ink); border: none; cursor: pointer; border-right: 2px solid var(--ink); }
.td2-mode-tab:last-child { border-right: none; }
.td2-mode-tab.active { background: var(--ink); color: var(--bg-card); }
.td2-team-card { background: var(--bg-card); border: 3px solid var(--ink); border-radius: 10px; padding: 16px; margin-bottom: 16px; box-shadow: 3px 3px 0 var(--ink); }
.td2-team-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px; }
.td2-team-name { font-family: var(--font-display); font-size: 16px; }
.td2-team-abbr { font-family: var(--font-mono); font-size: 12px; color: var(--ink-light); margin-left: 8px; }
.td2-team-totals { font-family: var(--font-mono); font-size: 11px; color: var(--ink-light); }
.td2-dist-bar { display: flex; height: 32px; border: 2px solid var(--ink); border-radius: 6px; overflow: hidden; margin-bottom: 8px; }
.td2-dist-seg { display: flex; align-items: center; justify-content: center; overflow: hidden; }
.td2-seg-label { font-family: var(--font-mono); font-size: 9px; font-weight: 700; white-space: nowrap; }
.td2-annotation { font-family: var(--font-hand); font-size: 14px; color: var(--ink-light); margin-bottom: 8px; }
.td2-players { }
.td2-player-row { display: flex; align-items: center; gap: 8px; padding: 4px 0; border-bottom: 1px solid var(--ink-faint); font-family: var(--font-mono); font-size: 12px; cursor: pointer; }
.td2-player-row:hover { background: var(--bg-warm); }
.td2-player-pos { padding: 1px 6px; border-radius: 3px; color: #fff; font-size: 9px; font-weight: 700; }
.td2-player-name { flex: 1; }
.td2-player-stat { color: var(--ink-light); }
.td2-player-share { font-weight: 700; min-width: 36px; text-align: right; }

/* ===== TEAM ROSTER PANEL (tm-) ===== */
.tm-groups { display: grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); gap: 16px; }
.tm-group-card { background: var(--bg-card); border: 3px solid var(--ink); border-radius: 10px; overflow: hidden; }
.tm-group-header { display: flex; justify-content: space-between; align-items: center; padding: 12px 16px; color: #fff; }
.tm-group-header.pos-qb { background: var(--pos-qb); }
.tm-group-header.pos-rb { background: var(--pos-rb); }
.tm-group-header.pos-wr { background: var(--pos-wr); }
.tm-group-header.pos-te { background: var(--pos-te); }
.tm-group-title { font-family: var(--font-display); font-size: 16px; }
.tm-group-annotation { font-family: var(--font-hand); font-size: 14px; opacity: 0.8; }
.tm-group-count { font-family: var(--font-mono); font-size: 12px; opacity: 0.8; }
.tm-roster-list { list-style: none; padding: 0; margin: 0; }
.tm-player-row { display: flex; align-items: center; gap: 8px; padding: 10px 16px; border-bottom: 1px solid var(--ink-faint); cursor: pointer; }
.tm-player-row:hover { background: var(--bg-warm); }
.tm-player-row:last-child { border-bottom: none; }
.tm-player-rank { font-family: var(--font-mono); font-size: 12px; color: var(--ink-light); min-width: 20px; }
.tm-player-info { display: flex; align-items: center; gap: 6px; flex: 1; min-width: 0; }
.tm-player-name { font-family: var(--font-mono); font-size: 12px; font-weight: 700; }
.tm-age-badge { font-family: var(--font-mono); font-size: 10px; padding: 1px 6px; border-radius: 4px; }
.tm-age-badge.young { background: #d4edda; color: #155724; }
.tm-age-badge.prime { background: #cce5ff; color: #004085; }
.tm-age-badge.aging { background: #f8d7da; color: #721c24; }
.tm-player-stats { display: flex; gap: 12px; }
.tm-stat { text-align: center; min-width: 40px; }
.tm-stat.ppg { }
.tm-stat-value { font-family: var(--font-mono); font-size: 12px; font-weight: 700; display: block; }
.tm-stat-label { font-family: var(--font-mono); font-size: 9px; color: var(--ink-light); display: block; }

/* ===== TRADE FINDER PANEL (tf2-) ===== */
.tf2-selected-card { display: flex; align-items: center; gap: 16px; background: var(--bg-card); border: 3px solid var(--ink); border-radius: 12px; padding: 16px; margin-bottom: 16px; box-shadow: 4px 4px 0 var(--ink); flex-wrap: wrap; }
.tf2-sel-headshot { width: 56px; height: 56px; border-radius: 50%; border: 3px solid var(--ink); object-fit: cover; }
.tf2-sel-info { flex: 1; min-width: 160px; }
.tf2-sel-name { font-family: var(--font-display); font-size: 20px; }
.tf2-sel-meta { display: flex; align-items: center; gap: 8px; font-family: var(--font-mono); font-size: 12px; color: var(--ink-light); flex-wrap: wrap; }
.tf2-pos-badge { padding: 2px 8px; border-radius: 4px; color: #fff; font-size: 10px; font-weight: 700; }
.tf2-pos-badge.qb { background: var(--pos-qb); }
.tf2-pos-badge.rb { background: var(--pos-rb); }
.tf2-pos-badge.wr { background: var(--pos-wr); }
.tf2-pos-badge.te { background: var(--pos-te); }
.tf2-tier-badge { font-size: 10px; font-weight: 700; padding: 2px 8px; border-radius: 4px; background: var(--bg-warm); }
.tf2-sel-stats { display: flex; gap: 20px; margin-left: auto; }
.tf2-sel-stat { text-align: center; }
.tf2-sel-stat-val { font-family: var(--font-display); font-size: 20px; color: var(--orange); }
.tf2-sel-stat-label { font-family: var(--font-mono); font-size: 10px; color: var(--ink-light); }
.tf2-target-controls { margin-bottom: 16px; }
.tf2-pos-tabs { display: flex; border: 2px solid var(--ink); border-radius: 8px; overflow: hidden; width: fit-content; }
.tf2-pos-tab { font-family: var(--font-display); font-size: 13px; padding: 6px 14px; background: var(--bg-card); color: var(--ink); border: none; cursor: pointer; border-right: 2px solid var(--ink); }
.tf2-pos-tab:last-child { border-right: none; }
.tf2-pos-tab.active { background: var(--ink); color: var(--bg-card); }
.tf2-section { margin-bottom: 20px; }
.tf2-section-header { font-family: var(--font-display); font-size: 18px; color: var(--ink); }
.tf2-section-count { font-family: var(--font-mono); font-size: 12px; color: var(--ink-light); }
.tf2-section-desc { font-family: var(--font-hand); font-size: 14px; color: var(--ink-light); margin-bottom: 10px; }
.tf2-table { width: 100%; border-collapse: collapse; font-family: var(--font-mono); font-size: 12px; }
.tf2-table th { background: var(--ink); color: var(--bg-card); padding: 8px 10px; font-size: 11px; }
.tf2-table td { padding: 8px 10px; border-bottom: 1px solid var(--ink-faint); }
.tf2-table tbody tr { cursor: pointer; }
.tf2-table tbody tr:hover { background: var(--bg-warm); }
.tf2-player-cell { display: flex; align-items: center; gap: 6px; }
.tf2-row-img { width: 28px; height: 28px; border-radius: 50%; object-fit: cover; }
.tf2-stock-arrow { font-size: 12px; }
.tf2-stock-arrow.rising { color: #155724; }
.tf2-stock-arrow.falling { color: #721c24; }
.tf2-stock-arrow.stable { color: var(--ink-light); }
.tf2-val-diff { font-weight: 700; padding: 2px 6px; border-radius: 4px; font-size: 11px; }
.tf2-val-diff.positive { background: #d4edda; color: #155724; }
.tf2-val-diff.negative { background: #f8d7da; color: #721c24; }
.tf2-val-diff.neutral { background: var(--bg-warm); color: var(--ink-light); }

/* ===== RESPONSIVE FOR NEW PANELS ===== */
@media (max-width: 768px) {
  .aw2-grid { grid-template-columns: 1fr; }
  .db2-top5-row { flex-direction: column; align-items: stretch; }
  .db2-trends-row { flex-direction: column; align-items: stretch; }
  .dc2-summary { flex-direction: column; align-items: center; }
  .ld2-grid { grid-template-columns: 1fr; }
  .bb-grid { grid-template-columns: 1fr; }
  .rc2-sections { grid-template-columns: 1fr; }
  .rec-grid { grid-template-columns: 1fr; }
  .rbld-layout { grid-template-columns: 1fr; }
  .rbld-pos-grid { grid-template-columns: repeat(2, 1fr); }
  .tm-groups { grid-template-columns: 1fr; }
  .tm-player-stats { flex-wrap: wrap; gap: 8px; }
  .tf2-selected-card { flex-direction: column; align-items: flex-start; }
  .tf2-sel-stats { margin-left: 0; }
  .sc2-table th:nth-child(n+4), .sc2-table td:nth-child(n+4) { display: none; }
  .hide-mobile { display: none; }
}

/* ===== NFL-ONLY MESSAGE (college mode) ===== */
.lp-nfl-only {
  text-align: center;
  padding: 80px 24px 60px;
  max-width: 420px;
  margin: 0 auto;
}
.lp-nfl-only-icon {
  font-size: 48px;
  margin-bottom: 16px;
  transform: rotate(-4deg);
  display: inline-block;
}
.lp-nfl-only-text {
  font-family: var(--font-hand);
  font-size: 22px;
  line-height: 1.4;
  color: var(--ink-light);
  transform: rotate(-1deg);
}
.lp-nfl-only-btn {
  margin-top: 20px;
  padding: 10px 28px;
  font-family: var(--font-mono);
  font-size: 14px;
  font-weight: 700;
  color: #fff;
  background: var(--orange);
  border: 3px solid var(--ink);
  box-shadow: 4px 4px 0 var(--ink);
  cursor: pointer;
  transition: transform 0.1s, box-shadow 0.1s;
}
.lp-nfl-only-btn:hover {
  transform: translate(2px, 2px);
  box-shadow: 2px 2px 0 var(--ink);
}

/* ===== GLOBAL MOBILE — all panel tables ===== */
@media (max-width: 768px) {
  /* All panel content stays within viewport */
  .lab-panel-content { overflow-x: hidden; max-width: 100vw; }
  .lp-page { max-width: 100%; }

  /* Panel table containers scroll horizontally — wrap tables, don't change display */
  .lp-page { overflow-x: auto; -webkit-overflow-scrolling: touch; }

  /* Sticky first column for all panel tables */
  .lp-page table th:first-child,
  .lp-page table td:first-child {
    position: sticky;
    left: 0;
    z-index: 2;
    background: var(--bg-warm);
  }
  .lp-page table thead th:first-child { z-index: 3; }

  /* Touch targets: ensure 44px minimum for interactive elements */
  .lp-pos-tab { min-height: 44px; display: flex; align-items: center; justify-content: center; }
  .lp-select { min-height: 44px; }

  /* NFL-only message mobile */
  .lp-nfl-only { padding: 40px 16px 30px; }
}

@media (max-width: 375px) {
  .lp-page { padding: 12px 8px 30px; }
  .lp-page table { font-size: 11px; }
  .lp-page table th,
  .lp-page table td { padding: 4px 6px; }
  .lp-pos-tab { padding: 5px 10px; font-size: 11px; }
  .lp-select { font-size: 12px; padding: 5px 8px; }
  .lp-header h2 { font-size: 22px; }
  .lp-subtitle { font-size: 15px; }
}

/* ===================================================================
   MOCK DRAFT PANEL
   =================================================================== */

/* Config Screen */
.md-config {
  max-width: 520px;
  margin: 40px auto;
  padding: 32px;
  background: var(--bg-card);
  border: 3px solid var(--ink);
  box-shadow: 4px 4px 0 var(--ink);
  text-align: center;
}
.md-config-title {
  font-family: var(--font-display);
  font-size: 28px;
  color: var(--ink);
  margin-bottom: 4px;
}
.md-config-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  margin-bottom: 24px;
  text-align: left;
}
.md-config-field label {
  display: block;
  font-family: var(--font-display);
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  color: var(--ink-light);
  margin-bottom: 6px;
}
.md-btn-group {
  display: flex;
  gap: 4px;
}
.md-opt {
  flex: 1;
  padding: 8px 4px;
  font-family: var(--font-mono);
  font-size: 13px;
  background: var(--bg);
  border: 2px solid var(--ink);
  color: var(--ink);
  cursor: pointer;
  transition: all 0.15s;
}
.md-opt:hover {
  background: var(--bg-warm);
}
.md-opt.active {
  background: var(--ink);
  color: var(--bg-card);
}
.md-select {
  width: 100%;
  padding: 8px;
  font-family: var(--font-mono);
  font-size: 13px;
  background: var(--bg);
  border: 2px solid var(--ink);
  color: var(--ink);
  cursor: pointer;
}
.md-start-btn {
  padding: 14px 48px;
  font-size: 16px;
  background: var(--orange);
  color: white;
  border: 3px solid var(--ink);
  box-shadow: 4px 4px 0 var(--ink);
  cursor: pointer;
  font-family: var(--font-display);
  transition: all 0.15s;
}
.md-start-btn:hover {
  transform: translate(-2px, -2px);
  box-shadow: 6px 6px 0 var(--ink);
}

/* Draft Layout */
.md-draft-layout {
  padding: 12px;
}
.md-draft-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
  flex-wrap: wrap;
  gap: 12px;
}
.md-draft-info {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.md-draft-year {
  font-family: var(--font-display);
  font-size: 20px;
  color: var(--ink);
}
.md-draft-meta {
  font-family: var(--font-mono);
  font-size: 12px;
  color: var(--ink-light);
}
.md-pick-info {
  font-family: var(--font-mono);
  font-size: 13px;
  color: var(--ink-light);
}

/* On the Clock Banner */
.md-on-clock {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 20px;
  background: var(--orange);
  color: white;
  border: 3px solid var(--ink);
  box-shadow: 4px 4px 0 var(--ink);
}
.md-clock-text {
  font-family: var(--font-display);
  font-size: 16px;
}
.md-clock-pick {
  font-family: var(--font-mono);
  font-size: 12px;
  opacity: 0.9;
}
.md-clock-pulse {
  display: inline-block;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: white;
  animation: md-pulse 1.2s ease-in-out infinite;
}
@keyframes md-pulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.4; transform: scale(0.8); }
}

/* Draft Board Grid */
.md-board-wrap {
  overflow-x: auto;
  margin-bottom: 20px;
  border: 3px solid var(--ink);
  box-shadow: 4px 4px 0 var(--ink);
}
.md-board {
  width: 100%;
  border-collapse: collapse;
  font-family: var(--font-mono);
  font-size: 11px;
  background: var(--bg-card);
}
.md-board-corner {
  background: var(--bg-warm);
  font-family: var(--font-display);
  font-size: 11px;
  text-transform: uppercase;
  color: var(--ink-light);
  padding: 6px 8px;
  border: 2px solid var(--ink-faint);
  position: sticky;
  left: 0;
  z-index: 2;
}
.md-board-th {
  background: var(--bg-warm);
  font-family: var(--font-display);
  font-size: 11px;
  text-transform: uppercase;
  color: var(--ink-light);
  padding: 6px 4px;
  border: 2px solid var(--ink-faint);
  text-align: center;
  min-width: 80px;
  white-space: nowrap;
}
.md-board-th.md-user-col {
  background: var(--orange-light);
  color: var(--orange);
  border-bottom: 3px solid var(--orange);
}
.md-board-rd {
  background: var(--bg-warm);
  font-family: var(--font-display);
  font-size: 11px;
  color: var(--ink-light);
  padding: 6px 8px;
  border: 2px solid var(--ink-faint);
  text-align: center;
  position: sticky;
  left: 0;
  z-index: 1;
}
.md-board-cell {
  padding: 6px 4px;
  border: 2px solid var(--ink-faint);
  text-align: center;
  vertical-align: middle;
  min-height: 44px;
  height: 44px;
}
.md-board-cell.md-user-col {
  border-left: 2px solid var(--orange);
  border-right: 2px solid var(--orange);
}
.md-board-cell.md-current-pick {
  outline: 3px solid var(--orange);
  outline-offset: -3px;
  animation: md-pulse-border 1.2s ease-in-out infinite;
}
@keyframes md-pulse-border {
  0%, 100% { outline-color: var(--orange); }
  50% { outline-color: transparent; }
}
.md-board-cell.md-filled {
  padding: 4px;
}
.md-cell-name {
  display: block;
  font-size: 11px;
  font-weight: 600;
  color: var(--ink);
  line-height: 1.2;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.md-cell-pos {
  display: block;
  font-size: 10px;
  font-weight: 700;
  line-height: 1.2;
}
.md-cell-empty {
  font-family: var(--font-hand);
  font-size: 13px;
  color: var(--ink-faint);
}
.md-clock-pulse-cell {
  color: var(--orange);
  animation: md-pulse 1.2s ease-in-out infinite;
}

/* Best Available Table */
.md-best-available {
  margin-top: 20px;
}
.md-ba-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
}
.md-ba-title {
  font-family: var(--font-display);
  font-size: 18px;
  color: var(--ink);
}
.md-undo-btn {
  font-size: 12px;
  padding: 6px 16px;
  background: var(--bg-card);
}
.md-ba-table {
  width: 100%;
  border-collapse: collapse;
  border: 2px solid var(--ink);
  background: var(--bg-card);
}
.md-ba-table th {
  background: var(--bg-warm);
  font-family: var(--font-display);
  font-size: 11px;
  text-transform: uppercase;
  color: var(--ink-light);
  padding: 8px 10px;
  text-align: left;
  border-bottom: 2px solid var(--ink);
}
.md-ba-table td {
  padding: 8px 10px;
  border-bottom: 1px solid var(--ink-faint);
  font-family: var(--font-mono);
  font-size: 12px;
  color: var(--ink-medium);
}
.md-ba-row {
  cursor: pointer;
  transition: background 0.1s;
}
.md-ba-row:hover {
  background: var(--bg-warm);
}
.md-ba-rank {
  font-weight: 700;
  color: var(--ink);
}
.md-ba-name {
  font-weight: 600;
  color: var(--ink);
}
.md-ba-school {
  color: var(--ink-light);
  font-size: 11px;
}
.md-ba-rps {
  font-weight: 700;
}

/* Position Badge */
.md-pos-badge {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 99px;
  font-family: var(--font-display);
  font-size: 10px;
  font-weight: 700;
  color: white;
  text-transform: uppercase;
}

/* Tier Chip */
.md-tier-chip {
  display: inline-block;
  padding: 2px 8px;
  border: 2px solid;
  border-radius: 99px;
  font-family: var(--font-display);
  font-size: 10px;
  font-weight: 700;
  background: transparent;
}

/* Draft Button */
.md-draft-btn {
  padding: 4px 14px;
  font-size: 11px;
  background: var(--orange);
  color: white;
  border: 2px solid var(--ink);
  cursor: pointer;
  font-family: var(--font-display);
  transition: all 0.15s;
}
.md-draft-btn:hover {
  transform: translate(-1px, -1px);
  box-shadow: 3px 3px 0 var(--ink);
}

/* Recent Picks */
.md-recent-picks {
  margin-top: 20px;
  padding: 16px;
  background: var(--bg-card);
  border: 2px solid var(--ink-faint);
}
.md-recent-row {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 4px 0;
  font-family: var(--font-mono);
  font-size: 12px;
  color: var(--ink-medium);
}
.md-recent-num {
  font-weight: 700;
  color: var(--ink-light);
  min-width: 24px;
}

/* Recap */
.md-recap {
  max-width: 800px;
  margin: 20px auto;
  padding: 24px;
}
.md-recap-header {
  text-align: center;
  margin-bottom: 24px;
}
.md-recap-title {
  font-family: var(--font-display);
  font-size: 28px;
  color: var(--ink);
  margin-bottom: 4px;
}
.md-recap-grade {
  display: inline-block;
  margin-top: 12px;
  font-family: var(--font-display);
  font-size: 48px;
  font-weight: 700;
  padding: 8px 24px;
  border: 3px solid;
  box-shadow: 4px 4px 0 var(--ink);
}
.md-recap-table {
  width: 100%;
  border-collapse: collapse;
  border: 2px solid var(--ink);
  background: var(--bg-card);
  margin-bottom: 20px;
}
.md-recap-table th {
  background: var(--bg-warm);
  font-family: var(--font-display);
  font-size: 11px;
  text-transform: uppercase;
  color: var(--ink-light);
  padding: 8px 10px;
  text-align: left;
  border-bottom: 2px solid var(--ink);
}
.md-recap-table td {
  padding: 8px 10px;
  border-bottom: 1px solid var(--ink-faint);
  font-family: var(--font-mono);
  font-size: 12px;
  color: var(--ink-medium);
}
.md-recap-name {
  font-weight: 600;
  color: var(--ink);
}
.md-grade-chip {
  display: inline-block;
  padding: 2px 10px;
  border-radius: 99px;
  font-family: var(--font-display);
  font-size: 10px;
  font-weight: 700;
  color: white;
}

/* Full Board Details */
.md-full-board-details {
  margin-bottom: 20px;
}
.md-full-board-summary {
  font-family: var(--font-display);
  font-size: 14px;
  color: var(--ink-light);
  cursor: pointer;
  padding: 8px 0;
}
.md-full-board-summary:hover {
  color: var(--ink);
}

/* Recap Actions */
.md-recap-actions {
  display: flex;
  gap: 12px;
  justify-content: center;
  flex-wrap: wrap;
}
.md-again-btn {
  background: var(--bg-card);
}

/* Mobile */
@media (max-width: 768px) {
  .md-config {
    margin: 20px 8px;
    padding: 20px;
  }
  .md-config-grid {
    grid-template-columns: 1fr;
    gap: 12px;
  }
  .md-board-th,
  .md-board-cell {
    min-width: 64px;
    font-size: 10px;
  }
  .md-cell-name {
    font-size: 9px;
  }
  .md-on-clock {
    flex-wrap: wrap;
    padding: 8px 12px;
  }
}
@media (max-width: 480px) {
  .md-board-th,
  .md-board-cell {
    min-width: 56px;
    padding: 4px 2px;
  }
}

/* ===================================================================
   PROSPECT ATHLETIC RADAR PANEL
   =================================================================== */

.pr-layout {
  padding: 12px;
}

/* Controls */
.pr-controls {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  margin-bottom: 16px;
  flex-wrap: wrap;
}
.pr-year-select {
  padding: 8px 12px;
  font-family: var(--font-mono);
  font-size: 13px;
  background: var(--bg-card);
  border: 2px solid var(--ink);
  color: var(--ink);
  cursor: pointer;
}
.pr-search-wrap {
  flex: 1;
  min-width: 200px;
}
.pr-search {
  width: 100%;
  padding: 8px 12px;
  font-family: var(--font-mono);
  font-size: 13px;
  background: var(--bg-card);
  border: 2px solid var(--ink);
  color: var(--ink);
}
.pr-search:focus {
  outline: none;
  border-color: var(--orange);
}
.pr-pos-tabs {
  display: flex;
  gap: 4px;
}
.pr-pos-tab {
  padding: 6px 14px;
  font-family: var(--font-display);
  font-size: 12px;
  background: var(--bg);
  border: 2px solid var(--ink-faint);
  color: var(--ink-light);
  cursor: pointer;
  transition: all 0.15s;
}
.pr-pos-tab:hover {
  background: var(--bg-warm);
}
.pr-pos-tab.active {
  background: var(--ink);
  color: var(--bg-card);
  border-color: var(--ink);
}

/* Main layout: chart + list side by side */
.pr-main {
  display: grid;
  grid-template-columns: 1fr 320px;
  gap: 20px;
  align-items: start;
}

/* Chart Card */
.pr-chart-card {
  background: var(--bg-card);
  border: 3px solid var(--ink);
  box-shadow: 4px 4px 0 var(--ink);
  padding: 20px;
  min-height: 300px;
}
.pr-chart-empty {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 300px;
}
.pr-chart-inner {
  text-align: center;
}

/* Player Tags */
.pr-chart-players {
  display: flex;
  gap: 10px;
  justify-content: center;
  align-items: center;
  margin-bottom: 12px;
  flex-wrap: wrap;
}
.pr-player-tag {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 4px 10px;
  background: var(--bg);
  border: 2px solid;
  font-family: var(--font-mono);
  font-size: 12px;
}
.pr-tag-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
}
.pr-tag-name {
  font-weight: 600;
  color: var(--ink);
}
.pr-tag-pos {
  font-size: 10px;
  font-weight: 700;
}
.pr-tag-remove {
  background: none;
  border: none;
  color: var(--ink-light);
  font-size: 16px;
  cursor: pointer;
  padding: 0 2px;
  line-height: 1;
}
.pr-tag-remove:hover {
  color: var(--red);
}
.pr-add-compare {
  font-style: italic;
}

/* Percentile Bars */
.pr-pct-bars {
  margin-top: 16px;
  text-align: left;
}
.pr-pct-row {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
}
.pr-pct-label {
  font-family: var(--font-display);
  font-size: 11px;
  text-transform: uppercase;
  color: var(--ink-light);
  width: 50px;
  text-align: right;
  flex-shrink: 0;
}
.pr-pct-col {
  flex: 1;
  display: flex;
  align-items: center;
  gap: 6px;
}
.pr-pct-bar-wrap {
  flex: 1;
  height: 8px;
  background: var(--bg-warm);
  border-radius: 4px;
  overflow: hidden;
}
.pr-pct-bar {
  height: 100%;
  border-radius: 4px;
  transition: width 0.3s ease;
}
.pr-pct-val {
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--ink-medium);
  min-width: 48px;
  text-align: right;
}
.pr-pct-num {
  font-family: var(--font-mono);
  font-size: 10px;
  font-weight: 700;
  min-width: 32px;
  text-align: right;
}
.pr-pct-elite { color: #d97757; }
.pr-pct-good { color: #2ec4b6; }
.pr-pct-avg { color: #5b7fff; }
.pr-pct-below { color: #8a7565; }

/* Athletic Grade Cards */
.pr-grades {
  display: flex;
  gap: 12px;
  justify-content: center;
  margin-top: 20px;
  flex-wrap: wrap;
}
.pr-grade-card {
  padding: 12px 20px;
  border: 2px solid;
  background: var(--bg);
  text-align: center;
  min-width: 160px;
}
.pr-grade-name {
  font-family: var(--font-display);
  font-size: 14px;
  color: var(--ink);
  margin-bottom: 4px;
}
.pr-grade-score {
  font-family: var(--font-mono);
  font-size: 32px;
  font-weight: 700;
  line-height: 1.1;
}
.pr-grade-label {
  font-family: var(--font-display);
  font-size: 12px;
  text-transform: uppercase;
  margin-bottom: 4px;
}
.pr-grade-detail {
  font-family: var(--font-mono);
  font-size: 10px;
  color: var(--ink-light);
}

/* Prospect List */
.pr-list {
  border: 2px solid var(--ink);
  background: var(--bg-card);
  max-height: 700px;
  overflow-y: auto;
}
.pr-list-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 8px 12px;
  background: var(--bg-warm);
  border-bottom: 2px solid var(--ink);
  position: sticky;
  top: 0;
  z-index: 1;
}
.pr-list-title {
  font-family: var(--font-display);
  font-size: 14px;
  color: var(--ink);
}
.pr-list-count {
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--ink-light);
}
.pr-prospect-row {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  border-bottom: 1px solid var(--ink-faint);
  cursor: pointer;
  transition: background 0.1s;
}
.pr-prospect-row:hover {
  background: var(--bg-warm);
}
.pr-prospect-row.pr-selected {
  background: var(--orange-light);
}
.pr-prospect-rank {
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--ink-light);
  min-width: 24px;
  text-align: right;
}
.pr-prospect-pos {
  display: inline-block;
  padding: 1px 6px;
  border-radius: 99px;
  font-family: var(--font-display);
  font-size: 9px;
  font-weight: 700;
  color: white;
}
.pr-prospect-name {
  font-family: var(--font-mono);
  font-size: 12px;
  font-weight: 600;
  color: var(--ink);
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.pr-prospect-school {
  font-family: var(--font-mono);
  font-size: 10px;
  color: var(--ink-light);
  max-width: 80px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.pr-prospect-rps {
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 700;
  color: var(--ink);
  min-width: 30px;
  text-align: right;
}
.pr-sel-badge {
  display: inline-block;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  font-family: var(--font-display);
  font-size: 10px;
  font-weight: 700;
  color: white;
  text-align: center;
  line-height: 18px;
}

/* Mobile responsive */
@media (max-width: 768px) {
  .pr-main {
    grid-template-columns: 1fr;
  }
  .pr-chart-card {
    order: 1;
  }
  .pr-list {
    order: 0;
    max-height: 300px;
  }
  .pr-controls {
    flex-direction: column;
    align-items: stretch;
  }
}
@media (max-width: 480px) {
  .pr-pct-val {
    display: none;
  }
}

/* ===== CORRELATIONS PANEL ===== */
.corr-section {
  background: var(--bg-card);
  border: 3px solid var(--ink);
  box-shadow: 4px 4px 0 var(--ink);
  border-radius: 6px;
  padding: 16px;
  margin-bottom: 16px;
}
.corr-section-title {
  font-family: var(--font-display);
  font-size: 16px;
  color: var(--ink);
  margin: 0 0 12px 0;
}
.corr-predictors {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.corr-pred-row {
  display: flex;
  align-items: center;
  gap: 10px;
}
.corr-pred-label {
  font-family: var(--font-mono);
  font-size: 12px;
  font-weight: 700;
  color: var(--ink);
  width: 80px;
  text-align: right;
  flex-shrink: 0;
}
.corr-pred-bar-bg {
  flex: 1;
  height: 18px;
  background: var(--bg);
  border: 2px solid var(--ink);
  border-radius: 4px;
  overflow: hidden;
}
.corr-pred-bar {
  height: 100%;
  border-radius: 2px;
  transition: width 0.3s ease;
}
.corr-pred-val {
  font-family: var(--font-mono);
  font-size: 12px;
  font-weight: 700;
  width: 50px;
  text-align: left;
  flex-shrink: 0;
}
.corr-heatmap-wrap {
  text-align: center;
}
.corr-heatmap-wrap canvas {
  border: 3px solid var(--ink);
  border-radius: 4px;
  background: var(--bg-card);
}
.corr-scatter-wrap {
  text-align: center;
}
.corr-scatter-wrap canvas {
  border: 3px solid var(--ink);
  border-radius: 4px;
  background: var(--bg-card);
}
.corr-sample {
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--ink-light);
}
@media (max-width: 768px) {
  .corr-pred-label { width: 60px; font-size: 10px; }
  .corr-pred-val { width: 40px; font-size: 10px; }
}
/* ===== GAME SCRIPT ===== */
.gs-columns {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
}
.gs-column { min-width: 0; overflow-x: auto; }
.gs-column-header {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 16px;
  padding: 10px 14px;
  border: 3px solid var(--ink);
  border-radius: 4px;
  box-shadow: 4px 4px 0 var(--ink);
  background: var(--bg-card);
}
.gs-column-header.positive { border-left: 6px solid var(--green); }
.gs-column-header.negative { border-left: 6px solid var(--red); }
.gs-column-icon {
  font-size: 18px;
  line-height: 1;
}
.gs-column-header.positive .gs-column-icon { color: var(--green); }
.gs-column-header.negative .gs-column-icon { color: var(--red); }
.gs-column-title {
  font-family: var(--font-display);
  font-size: 16px;
  color: var(--ink);
}
.gs-column-note {
  font-family: var(--font-hand);
  font-size: 14px;
  color: var(--ink-light);
  margin-left: auto;
}
.gs-table {
  width: 100%;
  border-collapse: collapse;
  font-family: var(--font-mono);
  font-size: 13px;
}
.gs-table thead th {
  padding: 6px 8px;
  text-align: left;
  font-size: 11px;
  color: var(--ink-light);
  border-bottom: 2px solid var(--ink);
  white-space: nowrap;
}
.gs-table tbody tr {
  border-bottom: 1px solid var(--ink-faint);
  cursor: pointer;
  transition: background 0.15s;
}
.gs-table tbody tr:hover {
  background: var(--bg-warm);
}
.gs-rank {
  padding: 6px 8px;
  color: var(--ink-light);
  font-size: 12px;
  text-align: center;
  width: 28px;
}
.gs-player {
  padding: 6px 8px;
  display: flex;
  align-items: center;
  gap: 6px;
}
.gs-pos-dot {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  flex-shrink: 0;
}
.gs-name {
  font-weight: bold;
  color: var(--ink);
  white-space: nowrap;
}
.gs-pos {
  font-size: 11px;
  font-weight: bold;
}
.gs-team {
  padding: 6px 8px;
  color: var(--ink-medium);
  font-size: 12px;
}
.gs-gp {
  padding: 6px 8px;
  text-align: center;
  color: var(--ink-light);
  font-size: 12px;
}
.gs-ppg {
  padding: 6px 8px;
  text-align: right;
  font-size: 14px;
  color: var(--ink);
}
.gs-diff {
  padding: 6px 8px;
  text-align: center;
}
.gs-diff-badge {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 3px;
  font-size: 12px;
  font-weight: bold;
  font-family: var(--font-mono);
}
.gs-diff-pos {
  background: var(--green-light);
  color: #0d7a6f;
  border: 2px solid var(--green);
}
.gs-diff-neg {
  background: var(--red-light);
  color: #b5232e;
  border: 2px solid var(--red);
}
.gs-gt {
  padding: 6px 8px;
  text-align: center;
}
.gs-gt-chip {
  display: inline-block;
  padding: 1px 6px;
  border-radius: 3px;
  font-size: 10px;
  font-weight: bold;
  font-family: var(--font-mono);
}
.gs-gt-low {
  background: var(--bg-warm);
  color: var(--ink-light);
}
.gs-gt-mid {
  background: var(--yellow-light);
  color: #9a7b2e;
}
.gs-gt-high {
  background: #fde2e4;
  color: #b5232e;
}
@media (max-width: 768px) {
  .gs-columns { grid-template-columns: 1fr; gap: 20px; }
  .gs-table { font-size: 11px; }
  .gs-column-note { display: none; }
  .gs-team { display: none; }
}
