/* ============================================================
   NHL Legacy League Manager — NHL Legacy Edition Game Theme
   Dark arena, metallic chrome, blue ambient glow, red accents
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@400;500;600;700&family=Inter:wght@400;500;600;700;800&display=swap');

:root {
  /* Core palette — inspired by the game's dark arena look */
  --arena-black:   #050a12;
  --arena-dark:    #0a1020;
  --arena-blue:    #0c1a35;
  --arena-mid:     #112244;
  --arena-light:   #1a3060;
  --chrome:        #b0bec5;
  --chrome-bright: #d0dce5;
  --chrome-dim:    #607888;
  --steel:         #2a4060;
  --ice-glow:      #4a8cc8;
  --ice-bright:    #6cb4e8;
  --red-accent:    #c8102e;
  --red-dark:      #9a0c22;
  --red-glow:      rgba(200, 16, 46, 0.4);
  --gold:          #c8a84e;
  --gold-dim:      #a08838;
  --success:       #34c759;
  --warning:       #f0a030;

  --bg:            var(--arena-black);
  --bg-card:       rgba(10, 18, 36, 0.85);
  --bg-card-solid: #0c1428;
  --bg-panel:      rgba(16, 28, 52, 0.9);
  --bg-input:      rgba(8, 16, 32, 0.9);
  --border:        rgba(40, 70, 120, 0.5);
  --border-bright: rgba(70, 110, 170, 0.6);
  --border-chrome: rgba(140, 170, 200, 0.25);
  --text:          #d8e0ec;
  --text-muted:    #7a98b8;
  --text-dim:      #4a6888;

  --radius:    6px;
  --radius-sm: 3px;
  --shadow:    0 4px 24px rgba(0,0,0,.7);
  --shadow-sm: 0 2px 10px rgba(0,0,0,.5);
  --glow-blue: 0 0 30px rgba(74, 140, 200, 0.15);
  --glow-red:  0 0 20px rgba(200, 16, 46, 0.2);
}

/* ── Reset ── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { font-size: 15px; }
body {
  background: var(--bg);
  color: var(--text);
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif;
  line-height: 1.5;
  min-height: 100vh;
  background-image:
    radial-gradient(ellipse 80% 50% at 50% 0%, rgba(12, 40, 80, 0.6) 0%, transparent 70%),
    radial-gradient(ellipse 60% 40% at 80% 20%, rgba(20, 50, 100, 0.3) 0%, transparent 60%),
    radial-gradient(ellipse 40% 30% at 20% 60%, rgba(10, 30, 70, 0.2) 0%, transparent 60%),
    linear-gradient(180deg, #060e1a 0%, #050a12 100%);
  background-attachment: fixed;
}
#app { display: flex; align-items: stretch; min-height: 100vh; }
a { color: var(--ice-bright); text-decoration: none; }
a:hover { text-decoration: underline; }
button { cursor: pointer; font-family: inherit; }
input, select, textarea {
  font-family: inherit;
  font-size: inherit;
  background: var(--bg-input);
  color: var(--text);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  padding: 7px 11px;
  outline: none;
  transition: border-color .2s, box-shadow .2s;
}
input:focus, select:focus, textarea:focus {
  border-color: var(--ice-glow);
  box-shadow: 0 0 8px rgba(74, 140, 200, 0.25);
}
input::placeholder { color: var(--text-dim); }
select option { background: var(--bg-card-solid); }
h1 { font-family: 'Oswald', sans-serif; font-size: 1.6rem; font-weight: 700; }
h2 { font-family: 'Oswald', sans-serif; font-size: 1.25rem; font-weight: 600; }
h3 { font-family: 'Oswald', sans-serif; font-size: 1rem; font-weight: 600; }
.hidden { display: none !important; }

::-webkit-scrollbar { width: 5px; height: 5px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--steel); border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: var(--ice-glow); }

/* ============================================================
   SIDEBAR NAV — Vertical game-menu style
   ============================================================ */
#app-header {
  position: sticky;
  top: 0;
  height: 100vh;
  width: 210px;
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  background: linear-gradient(180deg, #0d1a30 0%, #080f1e 60%, #050a14 100%);
  border-right: 1px solid rgba(40,70,120,0.4);
  box-shadow: 2px 0 24px rgba(0,0,0,.7);
  z-index: 100;
  overflow-y: auto;
  overflow-x: hidden;
}
#app-header::before { display: none; }

.header-brand {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0;
  padding: 28px 20px 22px;
  border-bottom: 2px solid var(--red-accent);
  flex-shrink: 0;
}
.brand-icon { display: none; }
.brand-zamboni {
  width: 80px;
  height: auto;
  object-fit: contain;
  margin-bottom: 10px;
  filter: drop-shadow(0 2px 8px rgba(0,0,0,.5));
}
#league-title {
  font-family: 'Oswald', sans-serif;
  font-size: 1.25rem;
  font-weight: 700;
  color: #fff;
  letter-spacing: 2px;
  text-transform: uppercase;
  line-height: 1.15;
  text-shadow: 0 2px 8px rgba(0,0,0,.6);
}
.header-brand::after {
  content: 'LEAGUE MANAGER';
  font-family: 'Oswald', sans-serif;
  font-size: .62rem;
  font-weight: 500;
  color: var(--chrome-dim);
  letter-spacing: 2.5px;
  text-transform: uppercase;
  margin-top: 4px;
}

#main-nav {
  display: flex;
  flex-direction: column;
  flex: 1;
  padding: 10px 0;
  overflow: visible;
  height: auto;
}

.nav-btn {
  background: transparent;
  border: none;
  border-left: 3px solid transparent;
  color: var(--chrome-dim);
  padding: 13px 20px 13px 18px;
  height: auto;
  width: 100%;
  text-align: left;
  font-family: 'Oswald', sans-serif;
  font-size: 1rem;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  white-space: nowrap;
  transition: color .15s, background .15s, border-color .15s;
  position: relative;
}
.nav-btn:hover {
  color: var(--chrome-bright);
  background: rgba(74,140,200,0.06);
}
.nav-btn.active {
  color: #fff;
  border-left-color: var(--red-accent);
  background: linear-gradient(90deg, rgba(200,16,46,0.1) 0%, rgba(20,40,80,0.15) 70%, transparent 100%);
  text-shadow: 0 0 12px rgba(255,255,255,0.15);
}
.nav-btn.active::after {
  content: '▶';
  position: absolute;
  right: 14px;
  top: 50%;
  transform: translateY(-50%);
  font-size: .55rem;
  color: var(--chrome-dim);
  opacity: .7;
}
.nav-btn::before {
  display: inline-block;
  width: 20px;
  margin-right: 2px;
  opacity: .7;
  font-size: .9rem;
}
.nav-btn[data-section="dashboard"]::before { content: '⊞'; }
.nav-btn[data-section="teams"]::before     { content: '⬡'; }
.nav-btn[data-section="players"]::before   { content: '◉'; }
.nav-btn[data-section="draft"]::before     { content: '◈'; }
.nav-btn[data-section="scores"]::before   { content: '◎'; }
.nav-btn[data-section="schedule"]::before  { content: '▦'; }
.nav-btn[data-section="standings"]::before { content: '◆'; }
.nav-btn[data-section="playoffs"]::before  { 
  content: ''; 
  background-image: url('assets/ZamboniCupPlayoffs.png');
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  display: inline-block;
  width: 20px;
  height: 16px;
  margin-right: 2px;
  opacity: .7;
}
.nav-btn[data-section="trades"]::before    { content: '⇌'; }
.nav-btn[data-section="rules"]::before     { content: '📋'; font-size: .75rem; }
.nav-btn[data-section="settings"]::before  { content: '⚙'; }
.nav-btn.active::before { opacity: 1; }

#header-right {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  padding: 14px 16px;
  border-top: 1px solid var(--border);
  flex-shrink: 0;
  margin-left: 0;
}
.badge-admin {
  background: linear-gradient(135deg, var(--red-accent) 0%, var(--red-dark) 100%);
  color: #fff;
  font-family: 'Oswald', sans-serif;
  font-size: .62rem;
  font-weight: 600;
  padding: 3px 10px;
  border-radius: 2px;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  box-shadow: 0 0 8px var(--red-glow);
}

/* ============================================================
   BUTTONS — Metallic/chrome style
   ============================================================ */
.btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 20px;
  border-radius: var(--radius-sm);
  border: 1px solid transparent;
  font-family: 'Oswald', sans-serif;
  font-size: .88rem;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: .8px;
  transition: all .2s;
  line-height: 1;
}
.btn:disabled { opacity: .35; cursor: not-allowed; }
.btn-primary {
  background: linear-gradient(180deg, #d01830 0%, #a80e1e 100%);
  color: #fff;
  border-color: rgba(200,16,46,0.5);
  box-shadow: 0 2px 8px rgba(200,16,46,0.3);
}
.btn-primary:hover:not(:disabled) {
  background: linear-gradient(180deg, #e02040 0%, #c01020 100%);
  box-shadow: 0 2px 12px rgba(200,16,46,0.5);
}
.btn-accent { background: linear-gradient(180deg, #d4b458 0%, #a08838 100%); color: #000; border-color: rgba(200,168,78,0.4); }
.btn-accent:hover:not(:disabled) { background: linear-gradient(180deg, #e0c068 0%, #b09848 100%); }
.btn-success { background: linear-gradient(180deg, #3ad868 0%, #28a84a 100%); color: #000; }
.btn-success:hover:not(:disabled) { filter: brightness(1.1); }
.btn-danger { background: linear-gradient(180deg, #d01830 0%, #a80e1e 100%); color: #fff; }
.btn-secondary {
  background: linear-gradient(180deg, rgba(30,50,80,0.8) 0%, rgba(16,32,56,0.8) 100%);
  color: var(--chrome);
  border-color: var(--border-bright);
}
.btn-secondary:hover:not(:disabled) {
  background: linear-gradient(180deg, rgba(40,65,100,0.8) 0%, rgba(24,44,72,0.8) 100%);
  color: var(--chrome-bright);
}
.btn-ghost {
  background: transparent;
  color: var(--chrome-dim);
  border-color: var(--border);
}
.btn-ghost:hover {
  color: var(--chrome-bright);
  background: rgba(40,70,120,0.2);
  border-color: var(--border-bright);
}
.btn-sm { padding: 5px 12px; font-size: .78rem; }
.btn-lg { padding: 11px 24px; font-size: .9rem; }
.btn-block { width: 100%; justify-content: center; }

/* ============================================================
   MAIN
   ============================================================ */
#main-content { flex: 1; padding: 28px 32px; max-width: none; min-width: 0; overflow-y: auto; }
.section { display: none; }
.section.active { display: block; }

.page-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 20px;
  flex-wrap: wrap;
  gap: 10px;
}
.page-header h2 {
  font-family: 'Oswald', sans-serif;
  font-size: 1.65rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  color: #fff;
  text-shadow: 0 1px 6px rgba(0,0,0,.5);
}
.page-header h2 span { color: var(--red-accent); }

/* ============================================================
   CARDS — Frosted arena glass panels
   ============================================================ */
.card {
  background: var(--bg-panel);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 16px;
  backdrop-filter: blur(8px);
  box-shadow: var(--shadow-sm);
}
.card-title {
  font-family: 'Oswald', sans-serif;
  font-size: .82rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 1.2px;
  color: var(--chrome-dim);
  margin-bottom: 12px;
  border-bottom: 1px solid var(--border);
  padding-bottom: 8px;
}

.stat-card {
  background: linear-gradient(135deg, rgba(16,32,60,0.9) 0%, rgba(10,20,40,0.9) 100%);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 18px 16px;
  text-align: center;
  position: relative;
  overflow: hidden;
  backdrop-filter: blur(8px);
}
.stat-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 2px;
  background: linear-gradient(90deg, transparent, var(--red-accent), transparent);
}
.stat-card::after {
  content: '';
  position: absolute;
  top: 0; left: 50%; transform: translateX(-50%);
  width: 80%;
  height: 40%;
  background: radial-gradient(ellipse, rgba(74,140,200,0.06) 0%, transparent 70%);
  pointer-events: none;
}
.stat-value {
  font-family: 'Oswald', sans-serif;
  font-size: 2.8rem;
  font-weight: 700;
  color: #fff;
  line-height: 1;
  text-shadow: 0 0 20px rgba(74,140,200,0.2);
}
.stat-label {
  font-family: 'Oswald', sans-serif;
  font-size: .75rem;
  color: var(--chrome-dim);
  margin-top: 6px;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  font-weight: 500;
}

/* ── Rich stat cards (hot/cold/bubble/week) ── */
:root { --stat-hot: #ff6b35; --stat-cold: #4fc3f7; }

.stat-card-trend,
.stat-card-bubble,
.stat-card-week {
  text-align: left;
  padding: 14px 16px 12px;
}
.stat-card-trend::before { background: linear-gradient(90deg, transparent, var(--accent, var(--red-accent)), transparent); }

.sct-label {
  font-family: 'Oswald', sans-serif;
  font-size: .62rem; font-weight: 800; letter-spacing: 1.5px; text-transform: uppercase;
  color: var(--chrome-dim);
  margin-bottom: 10px;
}
/* legacy single-team row (kept for bubble card) */
.sct-team { display: flex; align-items: center; gap: 10px; margin-bottom: 6px; }
.sct-info { display: flex; flex-direction: column; }
.sct-code {
  font-family: 'Oswald', sans-serif; font-weight: 700;
  font-size: .92rem; color: var(--ice-bright); line-height: 1.1;
}
.sct-mgr { font-size: .65rem; color: var(--text-dim); }
.sct-record {
  font-family: 'Oswald', sans-serif; font-weight: 700;
  font-size: .88rem; color: var(--accent, var(--gold));
  letter-spacing: .3px; display: flex; align-items: center; gap: 5px;
}
.sct-empty { font-size: 1.4rem; color: var(--text-dim); padding: 10px 0; }

/* L10 trend card — multi-team rows for ties */
.sct-team-row {
  display: flex; align-items: center; gap: 8px;
  padding: 5px 0;
  border-bottom: 1px solid rgba(255,255,255,.05);
}
.sct-team-row:last-child { border-bottom: none; }
.sct-trend-right {
  margin-left: auto; text-align: right;
  display: flex; flex-direction: column; align-items: flex-end; gap: 3px;
}
.sct-form-dots { display: flex; gap: 2px; flex-wrap: nowrap; }
.sct-l10-tag {
  display: inline-block; font-size: .55rem; font-weight: 700;
  background: rgba(74,140,200,.2); color: var(--primary);
  border-radius: 3px; padding: 1px 4px; letter-spacing: .5px;
  vertical-align: middle; margin-left: 4px;
}
.sct-tied-badge {
  display: inline-block; font-size: .55rem; font-weight: 800;
  background: rgba(251,191,36,.18); color: #fbbf24;
  border-radius: 3px; padding: 1px 4px; letter-spacing: .5px;
  vertical-align: middle; margin-left: 4px;
}

/* Bubble card */
.sct-bubble-body { display: flex; flex-direction: column; gap: 6px; margin: 6px 0 4px; }
.sct-bubble-conf { display: flex; align-items: center; justify-content: space-between; }
.sct-bubble-conf-name {
  font-size: .7rem; color: var(--text-dim);
  font-family: 'Oswald', sans-serif; letter-spacing: .5px; text-transform: uppercase;
}
.sct-bubble-gap {
  font-family: 'Oswald', sans-serif; font-weight: 800;
  font-size: 1.1rem; letter-spacing: .5px;
}
.gap-zero  { color: var(--gold); }
.gap-tight { color: #ff6b35; }
.gap-safe  { color: #4fc3f7; }
.sct-bubble-sub { font-size: .62rem; color: var(--text-dim); margin-top: 4px; text-transform: uppercase; letter-spacing: .5px; }

/* Week card */
.sct-week-num {
  font-family: 'Oswald', sans-serif; font-weight: 800;
  font-size: 2rem; color: var(--ice-bright); line-height: 1; margin: 6px 0 4px;
}
.sct-week-sub { font-size: .68rem; color: var(--text-dim); text-transform: uppercase; letter-spacing: .5px; }

/* ============================================================
   TABLES — Arena scoreboard style
   ============================================================ */
.table-wrap {
  overflow-x: auto;
  border-radius: var(--radius);
  border: 1px solid var(--border);
  box-shadow: var(--shadow-sm);
}
table { width: 100%; border-collapse: collapse; font-size: .88rem; }
thead th {
  background: linear-gradient(180deg, #152540 0%, #0e1a30 100%);
  color: var(--chrome-dim);
  font-family: 'Oswald', sans-serif;
  font-size: .75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 1px;
  padding: 10px 12px;
  border-bottom: 2px solid var(--red-accent);
  white-space: nowrap;
  cursor: pointer;
  user-select: none;
}
thead th:hover { color: var(--chrome-bright); }
thead th.sort-asc::after  { content: ' \2191'; color: var(--gold); }
thead th.sort-desc::after { content: ' \2193'; color: var(--gold); }
tbody tr { border-bottom: 1px solid rgba(40,70,120,0.3); transition: background .15s; }
tbody tr:last-child { border-bottom: none; }
tbody tr:hover { background: rgba(20,40,80,0.5); }
td { padding: 11px 14px; vertical-align: middle; font-size: .88rem; }
td.num { text-align: right; font-variant-numeric: tabular-nums; font-weight: 500; }
td.center { text-align: center; }

.team-badge {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 3px 8px;
  border-radius: 2px;
  font-family: 'Oswald', sans-serif;
  font-size: .78rem;
  font-weight: 600;
  letter-spacing: .8px;
  background: linear-gradient(180deg, rgba(20,40,70,0.8) 0%, rgba(12,24,45,0.8) 100%);
  border: 1px solid var(--border-bright);
  color: var(--ice-bright);
  text-transform: uppercase;
  vertical-align: middle;
}
.team-badge-logo {
  width: 36px; height: 36px; object-fit: contain; flex-shrink: 0;
}
.team-logo-lg {
  object-fit: contain; flex-shrink: 0; display: block;
}

/* ============================================================
   STANDINGS
   ============================================================ */
.standings-table .pts-col { color: var(--gold); font-weight: 700; }
.standings-table .rank-col { color: var(--text-dim); font-weight: 700; text-align: center; }
.standings-table tr.leader td { background: rgba(200,16,46,.06); }
.standings-table tr.leader td:first-child { border-left: 3px solid var(--red-accent); }
.standings-table tr.playoff-spot td { background: rgba(0,100,200,.04); }
.playoff-cutline { height: 2px; background: rgba(0,150,255,.35); margin-top: 4px; }

/* Playoff bracket */
.playoff-section { border-top: 1px solid rgba(40,70,120,.4); padding-top: 24px; }
.playoff-header {
  font-family: 'Oswald', sans-serif; font-size: 1rem; letter-spacing: 2px;
  color: var(--gold); margin-bottom: 16px; font-weight: 700;
}
/* ── Playoffs wrap — dark arena + ghosted background cup ─────────── */
.playoffs-wrap {
  position: relative;
  background: linear-gradient(180deg, #050d1a 0%, #070e1c 50%, #050d1a 100%);
  border-radius: var(--radius);
  overflow: hidden;
  margin: -4px;
}
.playoffs-wrap::before {
  content: '';
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  width: 860px; height: 860px;
  background: url('assets/ZamboniCupPlayoffs.png') center / contain no-repeat;
  opacity: 0.09;
  pointer-events: none;
  z-index: 0;
}
.playoffs-wrap > * { position: relative; z-index: 1; }

/* ── Playoff Hero — open, no box ─────────────────────────────────── */
@keyframes cup-float {
  0%, 100% { transform: translateY(0px);   filter: drop-shadow(0 6px 24px rgba(200,168,78,.7)) drop-shadow(0 0 50px rgba(200,168,78,.25)); }
  50%       { transform: translateY(-10px); filter: drop-shadow(0 16px 40px rgba(200,168,78,1))  drop-shadow(0 0 70px rgba(200,168,78,.5)); }
}
@keyframes hero-shimmer {
  0%   { background-position: -200% center; }
  100% { background-position: 200% center; }
}
.playoff-hero {
  display: flex; flex-direction: column; align-items: center;
  padding: 60px 24px 52px;
  background: radial-gradient(ellipse 70% 55% at 50% 0%, rgba(200,168,78,.16) 0%, transparent 70%);
  border: none;
  border-bottom: 1px solid rgba(200,168,78,.14);
  margin-bottom: 0;
  text-align: center;
}
.playoff-hero-logo {
  width: 170px; height: 170px; object-fit: contain;
  animation: cup-float 3.4s ease-in-out infinite;
}
.playoff-hero-text { display: flex; flex-direction: column; align-items: center; margin-top: 22px; }
.playoff-hero-title {
  font-family: 'Oswald', sans-serif; font-size: 3.2rem; font-weight: 800;
  letter-spacing: 10px; line-height: 1;
  background: linear-gradient(100deg, #c89030 0%, #f8e87a 25%, #e0a830 50%, #f8e87a 75%, #c89030 100%);
  background-size: 200% auto;
  -webkit-background-clip: text; -webkit-text-fill-color: transparent;
  background-clip: text;
  animation: hero-shimmer 4s linear infinite;
}
.playoff-hero-sub {
  font-family: 'Oswald', sans-serif; font-size: .82rem; font-weight: 600;
  letter-spacing: 9px; color: rgba(255,255,255,.32); text-transform: uppercase;
  margin-top: 6px;
}

/* ── Champion Banner — full-bleed presentation ───────────────────── */
.champion-banner {
  display: flex; flex-direction: column; align-items: center; gap: 8px;
  background: linear-gradient(180deg, rgba(200,168,78,.18) 0%, rgba(200,168,78,.05) 100%);
  border-top: 2px solid rgba(200,168,78,.5);
  border-bottom: 2px solid rgba(200,168,78,.5);
  border-radius: 0;
  padding: 28px 24px;
  text-align: center;
  margin: 0 0 28px;
}
.champion-cup-icon {
  width: 80px; height: 80px; object-fit: contain;
  filter: drop-shadow(0 4px 20px rgba(200,168,78,.8));
  flex-shrink: 0;
}
.champion-info { display: flex; flex-direction: column; align-items: center; gap: 4px; }
.champion-team {
  font-family: 'Oswald', sans-serif; font-size: 2.2rem; font-weight: 800;
  letter-spacing: 3px; color: var(--gold); line-height: 1;
}
.champion-mgr { font-size: .82rem; color: rgba(255,255,255,.5); margin-top: 2px; }
.champion-label {
  font-family: 'Oswald', sans-serif; font-size: .65rem;
  letter-spacing: 4px; color: rgba(200,168,78,.6);
  text-transform: uppercase; margin-top: 4px;
}

/* ── Bracket ─────────────────────────────────────────────────────── */
.bracket-rounds {
  display: flex; gap: 16px; overflow-x: auto; padding: 28px 28px 32px;
}
.bracket-round { flex-shrink: 0; min-width: 185px; }
.bracket-round-name {
  font-family: 'Oswald', sans-serif; font-size: .62rem; letter-spacing: 2.5px;
  text-transform: uppercase; color: rgba(200,168,78,.65);
  margin-bottom: 14px; padding-bottom: 7px;
  border-bottom: 1px solid rgba(200,168,78,.18); font-weight: 700;
}
.bracket-series {
  background: rgba(6,14,28,.85); border: 1px solid rgba(255,255,255,.08);
  border-radius: 8px; margin-bottom: 12px; overflow: hidden;
  box-shadow: 0 4px 20px rgba(0,0,0,.5);
  transition: border-color .2s;
}
.bracket-series:hover { border-color: rgba(200,168,78,.25); }
.bracket-team {
  display: flex; align-items: center; gap: 8px;
  padding: 10px 12px; font-size: .82rem;
}
.bracket-team + .bracket-team { border-top: 1px solid rgba(255,255,255,.06); }
.bracket-winner { background: rgba(200,168,78,.1); font-weight: 700; }
.bracket-loser { opacity: .42; }
.bracket-manager { flex: 1; font-size: .72rem; color: var(--text-muted); }
.bracket-seed {
  font-family: 'Oswald', sans-serif; font-size: .65rem; font-weight: 700;
  color: rgba(255,255,255,.3); min-width: 14px; text-align: center; flex-shrink: 0;
}
.bracket-wins {
  font-family: 'Oswald', sans-serif; font-size: 1.1rem; font-weight: 800;
  color: rgba(255,255,255,.3); min-width: 20px; text-align: right; flex-shrink: 0;
}
.bracket-wins-w { color: var(--gold); }
.btn-po-game {
  background: none; border: 1px solid rgba(200,168,78,.35); border-radius: 4px;
  color: rgba(200,168,78,.8); font-size: .58rem; font-weight: 700; letter-spacing: .5px;
  padding: 2px 7px; cursor: pointer; transition: all .15s;
}
.btn-po-game:hover { background: rgba(200,168,78,.12); color: var(--gold); border-color: rgba(200,168,78,.6); }

/* ============================================================
   DROP ZONE / FILTER BAR
   ============================================================ */
.drop-zone {
  border: 2px dashed var(--border-bright);
  border-radius: var(--radius);
  padding: 48px 24px;
  text-align: center;
  cursor: pointer;
  transition: border-color .2s, background .2s, box-shadow .2s;
  margin-bottom: 16px;
  background: rgba(16,32,60,0.3);
}
.drop-zone:hover, .drop-zone.dragover {
  border-color: var(--ice-glow);
  background: rgba(74,140,200,.06);
  box-shadow: var(--glow-blue);
}
.drop-zone-icon { font-size: 2.8rem; display: block; margin-bottom: 8px; }
.drop-zone p { color: var(--text-muted); margin-top: 6px; font-size: .85rem; }
.drop-zone .drop-label {
  font-family: 'Oswald', sans-serif;
  font-size: 1rem;
  font-weight: 600;
  color: var(--text);
  letter-spacing: .5px;
  text-transform: uppercase;
}

.filter-bar {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 14px;
  align-items: center;
}
.filter-bar input { flex: 1; min-width: 160px; }
.filter-bar select { min-width: 120px; }

/* ============================================================
   DRAFT BOARD
   ============================================================ */
.tab-bar {
  display: flex;
  gap: 0;
  border-bottom: 2px solid var(--border);
  padding-bottom: 0;
}
.tab-btn {
  background: none;
  border: none;
  color: var(--chrome-dim);
  font-family: 'Oswald', sans-serif;
  font-size: .85rem;
  font-weight: 500;
  padding: 10px 20px;
  cursor: pointer;
  border-bottom: 2px solid transparent;
  margin-bottom: -2px;
  transition: color .2s, border-color .2s;
  text-transform: uppercase;
  letter-spacing: 1px;
}
.tab-btn:hover  { color: var(--chrome-bright); }
.tab-btn.active { color: #fff; border-bottom-color: var(--red-accent); }

.draft-grid-table { border-collapse: collapse; font-size: .78rem; width: 100%; }
.draft-grid-table th, .draft-grid-table td {
  border: 1px solid var(--border);
  padding: 5px 7px;
  white-space: nowrap;
  text-align: center;
  vertical-align: top;
}
.draft-grid-table thead th {
  background: linear-gradient(180deg, var(--arena-mid) 0%, var(--arena-blue) 100%);
  font-size: .72rem;
  position: sticky;
  top: 0;
  z-index: 2;
}
.draft-grid-table tbody tr:nth-child(even) td { background: rgba(20,40,80,0.15); }
.draft-grid-table td:first-child {
  font-weight: 700;
  background: linear-gradient(180deg, var(--arena-mid) 0%, var(--arena-blue) 100%);
  position: sticky;
  left: 0;
  z-index: 1;
}

.draft-session-shell { display: flex; flex-direction: column; gap: 0; }

.draft-layout { display: grid; grid-template-columns: minmax(0, 1fr) 420px; gap: 16px; align-items: start; }
.draft-secondary-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}
.draft-hero-card {
  box-shadow: 0 10px 28px rgba(0,0,0,.24);
  padding: 10px 12px;
}
.draft-hero-topline {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 6px;
}
.draft-hero-stats {
  display: inline-flex;
  gap: 4px;
  flex-wrap: wrap;
  justify-content: flex-end;
}
.draft-hero-stats span {
  font-size: .62rem;
  letter-spacing: .5px;
  color: var(--text-muted);
  padding: 3px 6px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 999px;
  background: rgba(255,255,255,.04);
}
.draft-hero-main {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}
.draft-hero-ident {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}
.draft-progress-mini {
  flex: 0 0 120px;
  height: 6px;
  border-radius: 999px;
  overflow: hidden;
  background: rgba(255,255,255,.08);
}
.draft-progress-mini span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, rgba(200,168,78,.75) 0%, rgba(255,220,120,.95) 100%);
}
.draft-hero-actions {
  margin-top: 12px;
  display: flex;
  gap: 8px;
}
.draft-compact-card {
  min-height: 0;
  padding: 8px 10px;
}
.draft-compact-stack {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.draft-card-header-tight {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 6px;
}
.draft-mini-pick,
.draft-auto-row {
  border: 1px solid var(--border);
  border-radius: 8px;
  background: rgba(10,18,36,.5);
}
.draft-mini-pick { padding: 6px 8px; }
.draft-auto-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
  padding: 5px 7px;
}
.draft-board-table thead th { cursor: default; }
.draft-pick-cell { font-size: .78rem; min-height: 32px; }
.draft-pick-cell.current-pick-row td { background: rgba(200,16,46,.08) !important; }
.pick-number { color: var(--text-dim); font-weight: 600; font-size: .72rem; }
.pick-empty { color: var(--text-dim); font-style: italic; }
.pick-on-clock { color: var(--gold); font-weight: 700; }

.draft-sidebar { position: sticky; top: 76px; }
.draft-available-card {
  position: sticky;
  top: 76px;
  box-shadow: 0 14px 30px rgba(0,0,0,.28);
  padding: 8px 10px 10px;
}
.draft-available-tools {
  position: sticky;
  top: 0;
  z-index: 2;
  margin: -4px -4px 10px;
  padding: 4px 4px 10px;
  background: linear-gradient(180deg, rgba(14,26,50,.98) 0%, rgba(14,26,50,.9) 100%);
}
.draft-panel-mode-row {
  display: flex;
  gap: 4px;
  flex-wrap: wrap;
  margin-bottom: 6px;
}
.draft-filter-chip-row {
  display: flex;
  gap: 4px;
  flex-wrap: wrap;
  margin-bottom: 6px;
}
.available-list {
  max-height: calc(100vh - 190px);
  min-height: 540px;
  overflow-y: auto;
  padding-right: 2px;
}
.draft-player-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 6px 8px;
  border-bottom: 1px solid var(--border);
  font-size: .78rem;
  transition: background .15s;
  cursor: pointer;
  min-height: 30px;
}
.draft-player-row:hover { background: rgba(20,40,80,0.5); }
.draft-player-row .player-name { font-weight: 500; }
.draft-player-actions {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  margin-left: 8px;
  flex-shrink: 0;
}

/* OVR + PLT badges */
.ovr-badge {
  display: inline-flex; align-items: center; justify-content: center;
  font-size: .78rem; font-weight: 800;
  padding: 2px 6px; border-radius: 4px; letter-spacing: .4px; min-width: 28px; text-align: center;
}
.ovr-gold  { background: rgba(200,168,78,.25);  color: #e8c84e; border: 1px solid rgba(200,168,78,.4); }
.ovr-blue  { background: rgba(30,100,220,.2);   color: #6ab0f5; border: 1px solid rgba(30,100,220,.3); }
.ovr-green { background: rgba(40,160,80,.18);   color: #5dca7a; border: 1px solid rgba(40,160,80,.3); }
.ovr-grey  { background: rgba(255,255,255,.06); color: var(--text-muted); border: 1px solid rgba(255,255,255,.1); }
.plt-badge {
  display: inline-flex; align-items: center; justify-content: center;
  font-size: .65rem; font-weight: 700;
  padding: 2px 5px; border-radius: 4px; letter-spacing: .6px;
  background: rgba(255,255,255,.07); color: var(--text-muted);
  border: 1px solid rgba(255,255,255,.1);
}
/* Forward types */
.plt-SNP { background: rgba(200,16,46,.18); color: #f06070; border-color: rgba(200,16,46,.3); }
.plt-PWF { background: rgba(180,80,0,.2);  color: #f09050; border-color: rgba(180,80,0,.3); }
.plt-PLY { background: rgba(200,168,78,.18); color: #d4b04a; border-color: rgba(200,168,78,.3); }
.plt-TWF { background: rgba(30,100,220,.2); color: #6ab0f5; border-color: rgba(30,100,220,.3); }
.plt-ENF { background: rgba(100,40,140,.2); color: #b070e0; border-color: rgba(100,40,140,.3); }
/* Defense types */
.plt-OFD { background: rgba(200,168,78,.18); color: #d4b04a; border-color: rgba(200,168,78,.3); }
.plt-TWD { background: rgba(30,100,220,.2); color: #6ab0f5; border-color: rgba(30,100,220,.3); }
.plt-DFD { background: rgba(40,160,80,.18); color: #5dca7a; border-color: rgba(40,160,80,.3); }
.plt-PWD { background: rgba(180,80,0,.2);  color: #f09050; border-color: rgba(180,80,0,.3); }
.draft-player-info { display: flex; align-items: center; gap: 6px; min-width: 0; }
.draft-player-name { display: flex; align-items: center; gap: 4px; flex-wrap: wrap; }
.draft-headshot {
  width: 34px; height: 34px; border-radius: 50%;
  object-fit: cover; flex-shrink: 0;
  background: rgba(20,40,80,.5);
}
.draft-headshot-ph {
  width: 34px; height: 34px; border-radius: 50%;
  background: rgba(20,40,80,.5); flex-shrink: 0;
}
.player-headshot-sm {
  width: 46px; height: 46px; border-radius: 50%;
  object-fit: cover; vertical-align: middle;
  margin-right: 8px; background: rgba(20,40,80,.5);
}
.pos-badge {
  display: inline-block; font-size: .58rem; font-weight: 700;
  padding: 1px 4px; border-radius: 3px; letter-spacing: .4px;
  background: rgba(255,255,255,.1); color: var(--text-muted);
}
.pos-C  { background: rgba(200,168,78,.2);  color: #c8a84e; }
.pos-L  { background: rgba(0,100,200,.2);   color: #5aa0e0; }
.pos-R  { background: rgba(0,100,200,.2);   color: #5aa0e0; }
.pos-LW { background: rgba(0,100,200,.2);   color: #5aa0e0; }
.pos-RW { background: rgba(0,100,200,.2);   color: #5aa0e0; }
.pos-D  { background: rgba(0,160,80,.2);    color: #40c060; }
.pos-G  { background: rgba(180,0,0,.25);    color: #e05050; }

/* Draft position limits */
.draft-player-row.pos-full { opacity: .45; }
.draft-full-label {
  font-size: .68rem; font-weight: 700; letter-spacing: .5px;
  color: var(--text-dim); border: 1px solid rgba(255,255,255,.12);
  padding: 3px 8px; border-radius: 4px; white-space: nowrap;
}
.pos-counts { display: flex; gap: 6px; margin-top: 0; flex-wrap: wrap; }
.pos-count {
  font-size: .64rem; font-weight: 700; padding: 2px 6px;
  border-radius: 4px; background: rgba(255,255,255,.06);
  color: var(--text-muted);
}
.pos-count-full { background: rgba(200,168,78,.15); color: var(--gold); }

@media (max-width: 1180px) {
  .draft-layout { grid-template-columns: 1fr; }
  .draft-sidebar,
  .draft-available-card { position: static; top: auto; }
  .draft-hero-bottom { flex-direction: column; align-items: stretch; }
  .available-list {
    max-height: 60vh;
    min-height: 420px;
  }
}

@media (max-width: 760px) {
  .draft-secondary-grid { grid-template-columns: 1fr; }
  .draft-hero-topline { flex-direction: column; align-items: stretch; }
  .draft-hero-main { flex-direction: column; align-items: stretch; }
  .draft-hero-stats { justify-content: flex-start; }
  .draft-progress-mini { flex: 1 1 auto; width: 100%; }
}

/* ============================================================
   SCHEDULE
   ============================================================ */
.schedule-week-header {
  font-family: 'Oswald', sans-serif;
  font-size: .78rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 1.2px;
  color: var(--chrome-dim);
  padding: 10px 0 6px;
  border-bottom: 1px solid var(--border);
  margin-bottom: 8px;
  margin-top: 16px;
}
.schedule-week-header:first-child { margin-top: 0; }
.week-block { margin-bottom: 20px; }
.week-block-playoff { margin-bottom: 16px; }
.week-label {
  font-family: 'Oswald', sans-serif;
  font-size: .72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 2px;
  color: var(--red-accent);
  padding: 6px 0 8px;
  border-bottom: 1px solid var(--border);
  margin-bottom: 8px;
}
.week-label-playoff {
  color: var(--gold);
  border-bottom-color: rgba(200,168,78,.3);
}
.playoff-schedule-banner {
  display: flex; align-items: center; gap: 10px;
  background: linear-gradient(90deg, rgba(200,168,78,.12), transparent);
  border: 1px solid rgba(200,168,78,.25); border-radius: 6px;
  padding: 8px 14px; margin-bottom: 12px;
  font-family: 'Oswald', sans-serif; font-size: .78rem; font-weight: 800;
  letter-spacing: 3px; color: var(--gold);
}
.playoff-schedule-divider {
  border-top: 2px solid var(--border);
  margin: 20px 0 24px;
}

.game-card {
  background: linear-gradient(135deg, rgba(14,26,50,0.85) 0%, rgba(10,18,36,0.85) 100%);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 10px 14px;
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 6px;
  transition: border-color .15s, background .15s, box-shadow .15s;
}
.game-card:hover {
  border-color: var(--border-bright);
  background: rgba(20,36,65,0.9);
  box-shadow: var(--glow-blue);
}
.game-date { font-size: .72rem; color: var(--text-dim); min-width: 72px; }
.game-teams {
  display: flex;
  align-items: center;
  gap: 10px;
  flex: 1;
  font-family: 'Oswald', sans-serif;
  font-weight: 500;
  font-size: .95rem;
  letter-spacing: .5px;
}
.vs-sep { color: var(--text-dim); font-size: .72rem; font-weight: 400; }
.game-score {
  font-family: 'Oswald', sans-serif;
  font-size: 1.3rem;
  font-weight: 700;
  color: var(--gold);
  min-width: 56px;
  text-align: center;
  text-shadow: 0 0 10px rgba(200,168,78,0.3);
}
.game-score.pending { color: var(--text-dim); font-size: .8rem; font-weight: 400; text-shadow: none; }
.game-actions { display: flex; gap: 6px; }
.winner-team { color: #fff; }
.loser-team  { color: var(--text-muted); }

/* ============================================================
   TRADES
   ============================================================ */
.trade-card {
  background: var(--bg-panel);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 14px 16px;
  margin-bottom: 10px;
  backdrop-filter: blur(6px);
}
.trade-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 10px;
}
.trade-teams {
  display: flex;
  align-items: center;
  gap: 8px;
  font-family: 'Oswald', sans-serif;
  font-weight: 600;
  font-size: .95rem;
  letter-spacing: .5px;
}
.trade-arrow { color: var(--gold); font-size: 1.2rem; }
.trade-date  { font-size: .72rem; color: var(--text-dim); }
.trade-players { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; font-size: .82rem; }
.trade-side {
  background: rgba(16,32,60,0.6);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  padding: 8px 10px;
}
.trade-side-label {
  font-family: 'Oswald', sans-serif;
  font-size: .68rem;
  color: var(--chrome-dim);
  text-transform: uppercase;
  letter-spacing: 1px;
  margin-bottom: 5px;
  font-weight: 500;
}

/* ============================================================
   LINES EDITOR
   ============================================================ */
.lines-layout { display: grid; grid-template-columns: repeat(auto-fill, minmax(360px, 1fr)); gap: 12px; }
.line-group {
  background: var(--bg-panel);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 14px;
  backdrop-filter: blur(6px);
}
.line-group-title {
  font-family: 'Oswald', sans-serif;
  font-size: .72rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 1.2px;
  color: var(--red-accent);
  margin-bottom: 10px;
  border-bottom: 1px solid var(--border);
  padding-bottom: 6px;
}
.line-row { display: grid; gap: 5px; margin-bottom: 5px; align-items: center; }
.line-row.fwd { grid-template-columns: 36px 1fr 1fr 1fr; }
.line-row.def { grid-template-columns: 36px 1fr 1fr; }
.line-row.g   { grid-template-columns: 36px 1fr; }
.line-row.pp  { grid-template-columns: 36px 1fr 1fr 1fr 1fr 1fr; }
.line-row.pk  { grid-template-columns: 36px 1fr 1fr 1fr 1fr; }
.line-label {
  font-family: 'Oswald', sans-serif;
  font-size: .68rem;
  color: var(--text-dim);
  text-align: right;
  font-weight: 500;
  letter-spacing: .5px;
}
.line-slot select { width: 100%; padding: 4px 5px; font-size: .75rem; }
.line-pos-header {
  display: grid;
  gap: 5px;
  margin-bottom: 3px;
  font-family: 'Oswald', sans-serif;
  font-size: .62rem;
  color: var(--text-dim);
  font-weight: 500;
  text-transform: uppercase;
  text-align: center;
  letter-spacing: .8px;
}
.line-pos-header.fwd { grid-template-columns: 36px 1fr 1fr 1fr; }
.line-pos-header.def { grid-template-columns: 36px 1fr 1fr; }
.line-pos-header.g   { grid-template-columns: 36px 1fr; }
.line-pos-header.pp  { grid-template-columns: 36px 1fr 1fr 1fr 1fr 1fr; }
.line-pos-header.pk  { grid-template-columns: 36px 1fr 1fr 1fr 1fr; }

/* ============================================================
   SETTINGS
   ============================================================ */
.settings-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 16px; }
.form-row { margin-bottom: 14px; }

/* ── Settings Menu Grid ─────────────────────────────────────── */
.settings-menu-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 10px;
  padding: 8px 0 20px;
}
.settings-menu-card {
  display: flex;
  align-items: center;
  gap: 14px;
  width: 100%;
  background: var(--card-bg);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 14px 16px;
  cursor: pointer;
  text-align: left;
  transition: background 0.12s, border-color 0.12s;
}
.settings-menu-card:hover {
  background: rgba(74,140,200,.1);
  border-color: rgba(74,140,200,.35);
}
.settings-menu-icon {
  font-size: 1.5rem;
  width: 36px;
  text-align: center;
  flex-shrink: 0;
}
.settings-menu-text  { flex: 1; min-width: 0; }
.settings-menu-title { font-family: 'Oswald', sans-serif; font-size: .95rem; font-weight: 600; color: var(--chrome-bright); }
.settings-menu-sub   { font-size: .72rem; color: var(--text-dim); margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.settings-menu-arrow { font-size: 1.3rem; color: var(--text-dim); flex-shrink: 0; line-height: 1; }

/* ── Settings Section Page ──────────────────────────────────── */
.settings-section-page { display: flex; flex-direction: column; }
.settings-back-bar {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 6px 0 14px;
  border-bottom: 1px solid var(--border);
  margin-bottom: 20px;
}
.settings-back-btn {
  background: none;
  border: none;
  color: var(--primary);
  font-size: .88rem;
  font-weight: 600;
  cursor: pointer;
  padding: 4px 8px 4px 2px;
  display: flex;
  align-items: center;
  gap: 4px;
  border-radius: 5px;
  flex-shrink: 0;
}
.settings-back-btn:hover { background: rgba(74,140,200,.12); }
.settings-section-heading {
  font-family: 'Oswald', sans-serif;
  font-size: 1.1rem;
  font-weight: 600;
  color: var(--chrome-bright);
  letter-spacing: .03em;
}
.settings-section-body { flex: 1; }

@media (max-width: 600px) {
  .settings-menu-grid { grid-template-columns: 1fr; }
  .settings-menu-card { padding: 12px 14px; }
}
.form-row label {
  display: block;
  font-family: 'Oswald', sans-serif;
  font-size: .78rem;
  color: var(--chrome-dim);
  margin-bottom: 5px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: .8px;
}
.form-row input, .form-row select { width: 100%; }
.manager-list { list-style: none; }
.manager-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 12px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  margin-bottom: 6px;
  background: rgba(16,32,60,0.5);
  font-size: .85rem;
}
.manager-dot { width: 12px; height: 12px; border-radius: 50%; flex-shrink: 0; }
.manager-meta {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.manager-name { font-weight: 600; }
.manager-subline { font-size: .72rem; color: var(--text-dim); }
.team-assign-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 10px; }
.team-assign-item {
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-size: .78rem;
  padding: 10px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: rgba(16,32,60,0.35);
}
.team-assign-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px;
}
.team-assign-item label { color: var(--chrome-dim); font-weight: 500; font-size: .68rem; text-transform: uppercase; }
.team-assign-summary {
  font-size: .68rem;
  color: var(--text-dim);
  text-align: right;
  line-height: 1.25;
}
.team-coowner-select { opacity: .75; font-size: .72rem; }
.advanced-settings-card {
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  background: rgba(12,20,38,.45);
  overflow: hidden;
}
.advanced-settings-summary {
  list-style: none;
  cursor: pointer;
  padding: 12px 14px;
  font-family: 'Oswald', sans-serif;
  font-size: .84rem;
  letter-spacing: .8px;
  text-transform: uppercase;
  color: var(--chrome-dim);
}
.advanced-settings-summary::-webkit-details-marker {
  display: none;
}
.advanced-settings-summary::after {
  content: '▾';
  float: right;
  color: var(--text-dim);
}
.advanced-settings-card[open] .advanced-settings-summary {
  border-bottom: 1px solid rgba(255,255,255,.08);
}
.advanced-settings-card[open] .advanced-settings-summary::after {
  content: '▴';
}
.advanced-settings-body {
  padding: 12px 14px 14px;
}
.advanced-setting-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.advanced-setting-item .btn {
  flex-shrink: 0;
}
.teams-th[data-sort] { cursor: pointer; user-select: none; }
.teams-th[data-sort]:hover { color: var(--chrome-bright); }

/* ============================================================
   TEAMS PAGE — logo strip + grid cards
   ============================================================ */
.logo-strip {
  display: flex; flex-wrap: wrap; gap: 6px;
  padding: 14px 16px;
  background: rgba(8,16,36,.6);
  border: 1px solid var(--border);
  border-radius: 10px;
  margin-bottom: 20px;
}
.logo-strip-item {
  display: flex; align-items: center; justify-content: center;
  width: 52px; height: 52px;
  border-radius: 8px;
  transition: background .15s, transform .15s;
  text-decoration: none;
}
.logo-strip-item:hover { background: rgba(74,140,200,.15); transform: scale(1.12); }

.sort-pill {
  display: inline-block; font-size: .72rem; font-weight: 700;
  padding: 3px 9px; border-radius: 20px; cursor: pointer; letter-spacing: .4px;
  background: rgba(255,255,255,.06); color: var(--text-muted);
  border: 1px solid rgba(255,255,255,.12);
  transition: background .15s, color .15s;
}
.sort-pill.active { background: var(--gold); color: #000; border-color: var(--gold); }
.sort-pill:hover:not(.active) { background: rgba(255,255,255,.12); color: var(--chrome-bright); }

.teams-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}
@media (max-width: 1100px) { .teams-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 700px)  { .teams-grid { grid-template-columns: 1fr; } }

/* Team card */
.tc-card {
  background: var(--panel-bg);
  border: 1px solid var(--border);
  border-radius: 10px;
  overflow: hidden;
  display: flex; flex-direction: column;
  transition: border-color .2s, box-shadow .2s;
}
.tc-card:hover { border-color: rgba(74,140,200,.4); box-shadow: 0 4px 24px rgba(0,0,0,.3); }

.tc-header {
  display: flex; align-items: center; gap: 12px;
  padding: 14px 16px;
  background: linear-gradient(135deg, rgba(8,20,48,.9) 0%, rgba(16,36,80,.6) 100%);
  border-bottom: 1px solid var(--border);
}
.tc-logo { flex-shrink: 0; }
.tc-title { min-width: 0; }
.tc-team-name { font-family: 'Oswald', sans-serif; font-weight: 700; font-size: .95rem; color: var(--ice-bright); line-height: 1.2; }
.tc-mgr { font-size: .72rem; color: var(--text-muted); margin-top: 2px; }

.tc-body { flex: 1; padding: 0 0 4px; }
.tc-pos-label {
  font-size: .62rem; font-weight: 800; letter-spacing: 1.5px; text-transform: uppercase;
  color: var(--chrome-dim); padding: 8px 14px 4px;
  border-top: 1px solid rgba(40,70,120,.3);
}
.tc-pos-label:first-child { border-top: none; }

.tc-player-row {
  display: flex; align-items: center; gap: 8px;
  padding: 5px 12px;
  transition: background .12s;
}
.tc-player-row:hover { background: rgba(20,40,80,.5); }
.tc-headshot {
  width: 34px; height: 34px; border-radius: 50%;
  object-fit: cover; flex-shrink: 0;
  background: rgba(20,40,80,.5);
}
.tc-headshot-ph {
  width: 34px; height: 34px; border-radius: 50%;
  background: rgba(20,40,80,.4); flex-shrink: 0;
}
.tc-name { flex: 1; font-size: .82rem; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tc-badges { display: flex; align-items: center; gap: 4px; flex-shrink: 0; }
.tc-num { font-size: .7rem; min-width: 26px; text-align: right; flex-shrink: 0; }

.tc-footer {
  display: flex; align-items: center; gap: 14px;
  padding: 8px 14px;
  font-size: .72rem; color: var(--text-dim);
  background: rgba(8,16,36,.4);
  border-top: 1px solid var(--border);
}
.tc-footer strong { color: var(--chrome-bright); }

/* ============================================================
   STANDINGS — dual-conference layout
   ============================================================ */
.conf-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  margin-bottom: 16px;
}
@media (max-width: 800px) { .conf-grid { grid-template-columns: 1fr; } }

.conf-standings {
  background: var(--panel-bg);
  border: 1px solid var(--border);
  border-radius: 10px;
  overflow: hidden;
}
.conf-header {
  display: flex; justify-content: space-between; align-items: center;
  padding: 12px 16px;
  background: linear-gradient(135deg, rgba(200,16,46,.18) 0%, rgba(8,20,48,.8) 100%);
  border-bottom: 1px solid var(--border);
}
.conf-title {
  font-family: 'Oswald', sans-serif; font-weight: 700;
  font-size: 1rem; letter-spacing: 1px; color: var(--ice-bright); text-transform: uppercase;
}
.conf-sub { font-size: .68rem; color: var(--text-dim); }

.conf-table { width: 100%; border-collapse: collapse; }
.conf-table thead th {
  font-size: .65rem; font-weight: 800; letter-spacing: 1px; text-transform: uppercase;
  color: var(--chrome-dim); padding: 7px 10px;
  background: rgba(8,16,36,.5); border-bottom: 1px solid var(--border);
  text-align: center;
}
.conf-table thead th.ct-team { text-align: left; }

/* New column header classes */
.ct-th-rank { width: 32px; text-align: center; padding: 7px 6px; }
.ct-th-team { text-align: left; padding: 7px 10px; }
.ct-th-num  { text-align: center; padding: 7px 8px; min-width: 30px; }
.ct-th-pts  { text-align: center; padding: 7px 8px; min-width: 34px; color: #6ab0f5; }

/* New cell classes */
.ct-td-rank {
  text-align: center; padding: 10px 6px;
  font-size: .78rem; font-weight: 700; color: var(--text-dim);
  width: 32px;
}
.ct-td-team {
  display: flex; align-items: center; gap: 10px;
  padding: 8px 10px; min-width: 0;
}
.ct-td-team img { flex-shrink: 0; }
.ct-team-info { display: flex; flex-direction: column; min-width: 0; }
.ct-fullname {
  font-family: 'Oswald', sans-serif; font-weight: 600;
  font-size: .85rem; color: var(--ice-bright);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.ct-td-num {
  text-align: center; padding: 10px 8px;
  font-size: .82rem; font-variant-numeric: tabular-nums; color: var(--chrome-bright);
}
.ct-pct { color: var(--text-dim); font-size: .76rem; }
.ct-td-pts {
  text-align: center; padding: 10px 8px;
  font-size: .92rem; font-weight: 800;
  color: var(--gold);
  font-variant-numeric: tabular-nums;
}

.ct-row { border-bottom: 1px solid rgba(40,70,120,.25); transition: background .12s; }
.ct-row:hover { background: rgba(20,40,80,.5); }
.ct-row:last-child { border-bottom: none; }
.ct-row.ct-out td { opacity: .7; }
.ct-row.ct-cutline { box-shadow: inset 0 -2px 0 rgba(200,16,46,.5); }

/* ── Unified sortable standings table ────────────────────────────────────── */
.stn-table { width: 100%; border-collapse: collapse; font-size: .83rem; }
.stn-table thead th {
  background: linear-gradient(180deg, #152540 0%, #0e1a30 100%);
  font-family: 'Oswald', sans-serif; font-size: .68rem; font-weight: 600;
  text-transform: uppercase; letter-spacing: .8px;
  color: var(--chrome-dim); padding: 9px 8px;
  border-bottom: 2px solid var(--red-accent);
  white-space: nowrap; cursor: pointer; user-select: none;
  text-align: center;
}
.stn-table thead th:hover { color: var(--chrome-bright); }
.stn-table thead th.sort-asc::after  { content: ' \2191'; color: var(--gold); }
.stn-table thead th.sort-desc::after { content: ' \2193'; color: var(--gold); }
.stn-table thead th.ct-th-rank,
.stn-table thead th.ct-th-team { cursor: default; }

/* Playoff-in rows get a very subtle left accent */
.stn-table .stn-in  { border-left: 3px solid transparent; }
.stn-table .stn-in:nth-child(-n+8) { border-left-color: rgba(100,180,100,.4); } /* top 8 — deeper green */
.stn-table .stn-in  { border-left-color: rgba(30,100,200,.35); }
.stn-table .stn-out { border-left: 3px solid transparent; }
.stn-table .stn-out td { opacity: .72; }
.stn-table .stn-cutline { box-shadow: inset 0 -2px 0 rgba(200,16,46,.55); }

.stn-table tbody tr { border-bottom: 1px solid rgba(40,70,120,.2); transition: background .12s; }
.stn-table tbody tr:hover { background: rgba(20,40,80,.5); }
.stn-table tbody tr:last-child { border-bottom: none; }

.ct-rank-cell {
  display: flex; align-items: center; gap: 5px;
  padding: 8px 8px 8px 12px; white-space: nowrap;
}
.ct-num { font-size: .75rem; color: var(--text-dim); font-weight: 600; min-width: 16px; }
.ct-team-cell {
  display: flex; align-items: center; gap: 8px;
  padding: 6px 8px;
}
.ct-team-info { display: flex; flex-direction: column; }
.ct-code { font-family: 'Oswald', sans-serif; font-weight: 700; font-size: .85rem; color: var(--ice-bright); line-height: 1.1; }
.ct-mgr  { font-size: .68rem; color: var(--text-dim); line-height: 1.1; }

.ct-num-cell, .ct-pts-cell, .ct-wlo {
  text-align: center; padding: 8px 6px;
  font-size: .8rem; font-variant-numeric: tabular-nums;
}
.ct-pts-cell { font-weight: 800; font-size: .9rem; color: var(--gold); }
.ct-wlo { color: var(--text-muted); font-size: .75rem; }

/* Clinch badges */
.clinch-badge {
  display: inline-flex; align-items: center; justify-content: center;
  width: 17px; height: 17px; border-radius: 3px;
  font-size: .6rem; font-weight: 800; letter-spacing: 0; flex-shrink: 0;
}
.clinch-P { background: rgba(200,168,78,.3); color: #e8c84e; border: 1px solid rgba(200,168,78,.5); }
.clinch-Z { background: rgba(30,100,220,.25); color: #6ab0f5; border: 1px solid rgba(30,100,220,.4); }
.clinch-Y { background: rgba(40,160,80,.2); color: #5dca7a; border: 1px solid rgba(40,160,80,.35); }
.clinch-X { background: rgba(255,255,255,.08); color: var(--chrome-bright); border: 1px solid rgba(255,255,255,.18); }
.clinch-W { background: rgba(180,80,0,.2); color: #f09050; border: 1px solid rgba(180,80,0,.35); }
.clinch-E { background: rgba(200,16,46,.12); color: rgba(200,80,80,.7); border: 1px solid rgba(200,16,46,.2); }

.clinch-legend {
  display: flex; flex-wrap: wrap; align-items: center; gap: 10px;
  padding: 10px 14px;
  font-size: .72rem; color: var(--text-dim);
  background: rgba(8,16,36,.4);
  border: 1px solid var(--border);
  border-radius: 8px;
}

/* ============================================================
   MODAL — Arena overlay glass panel
   ============================================================ */
#modal-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.8);
  z-index: 200;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  backdrop-filter: blur(6px);
}
#modal-box {
  background: linear-gradient(180deg, #101e38 0%, #0a1425 100%);
  border: 1px solid var(--border-bright);
  border-top: 2px solid var(--red-accent);
  border-radius: var(--radius);
  width: 100%;
  max-width: 540px;
  transition: max-width .15s ease;
  max-height: 85vh;
  display: flex;
  flex-direction: column;
  box-shadow: 0 8px 50px rgba(0,0,0,.9), var(--glow-red);
}
#modal-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 18px;
  border-bottom: 1px solid var(--border);
  flex-shrink: 0;
}
#modal-title {
  font-family: 'Oswald', sans-serif;
  font-size: 1rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1px;
}
#modal-close-btn {
  background: none;
  border: none;
  color: var(--chrome-dim);
  font-size: 1.1rem;
  padding: 4px 8px;
  border-radius: var(--radius-sm);
}
#modal-close-btn:hover { color: var(--text); background: rgba(40,70,120,0.3); }
#modal-body { padding: 18px; overflow-y: auto; }
#modal-box.modal-wide { max-width: 720px; }

/* Player checklist (trade form) */
.player-checklist {
  max-height: 160px;
  overflow-y: auto;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  padding: 4px;
  background: var(--arena-black);
}
.player-check-item {
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 4px 7px;
  font-size: .8rem;
  font-weight: 400;
  text-transform: none;
  letter-spacing: 0;
  cursor: pointer;
  border-radius: 3px;
  color: var(--text-muted);
}
.player-check-item:hover { background: rgba(74,140,200,.12); color: var(--text); }
.player-check-item input[type="checkbox"] {
  width: auto;
  margin: 0;
  flex-shrink: 0;
  accent-color: var(--red-accent);
}

/* ============================================================
   TOAST
   ============================================================ */
#toast-container {
  position: fixed;
  bottom: 20px;
  right: 20px;
  z-index: 300;
  display: flex;
  flex-direction: column;
  gap: 8px;
  pointer-events: none;
}
.toast {
  padding: 10px 16px;
  border-radius: var(--radius-sm);
  font-size: .84rem;
  font-weight: 600;
  box-shadow: var(--shadow);
  animation: toast-in .25s ease;
  pointer-events: auto;
  max-width: 320px;
  border-left: 3px solid transparent;
  background: linear-gradient(135deg, rgba(14,26,50,0.95) 0%, rgba(10,18,36,0.95) 100%);
  border: 1px solid var(--border-bright);
  backdrop-filter: blur(10px);
}
.toast-success { border-left-color: var(--success); }
.toast-error   { border-left-color: var(--red-accent); }
.toast-info    { border-left-color: var(--ice-glow); }
@keyframes toast-in {
  from { transform: translateX(20px); opacity: 0; }
  to   { transform: translateX(0);    opacity: 1; }
}

/* ============================================================
   DASHBOARD
   ============================================================ */
.dash-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  margin-bottom: 20px;
}
/* ── Dashboard Hero ── */
.dash-hero {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: linear-gradient(120deg, #0a1624 0%, #0d1e38 40%, #0a1220 100%);
  border: 1px solid rgba(200,16,46,.25);
  border-radius: 8px;
  padding: 28px 32px;
  margin-bottom: 20px;
  position: relative;
  overflow: hidden;
}
.dash-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 80% 100% at 0% 50%, rgba(200,16,46,.07) 0%, transparent 60%),
    radial-gradient(ellipse 60% 80% at 100% 50%, rgba(74,140,200,.06) 0%, transparent 60%);
  pointer-events: none;
}
.dash-hero::after {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 2px;
  background: linear-gradient(90deg, var(--red-accent) 0%, var(--gold) 50%, var(--red-accent) 100%);
}
.dash-hero-content { position: relative; z-index: 1; }
.dash-hero-eyebrow {
  font-family: 'Oswald', sans-serif;
  font-size: .65rem;
  font-weight: 600;
  letter-spacing: 4px;
  color: var(--red-accent);
  text-transform: uppercase;
  margin-bottom: 6px;
}
.dash-hero-title {
  font-family: 'Oswald', sans-serif;
  font-size: 2.4rem;
  font-weight: 700;
  color: #fff;
  text-transform: uppercase;
  letter-spacing: 3px;
  line-height: 1;
  text-shadow: 0 2px 20px rgba(0,0,0,.8);
}
.dash-hero-meta {
  font-family: 'Oswald', sans-serif;
  font-size: .78rem;
  font-weight: 500;
  color: var(--chrome-dim);
  letter-spacing: 2px;
  text-transform: uppercase;
  margin-top: 10px;
}
.dash-hero-gfx {
  position: relative;
  z-index: 1;
  user-select: none;
  line-height: 1;
}
.hero-zamboni {
  width: 140px;
  height: auto;
  object-fit: contain;
  opacity: .22;
  filter: drop-shadow(0 4px 16px rgba(0,0,0,.4));
}

.dash-panels {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}
.panel {
  background: var(--bg-panel);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  overflow: hidden;
  backdrop-filter: blur(6px);
  box-shadow: var(--shadow-sm);
}
.panel-title {
  font-family: 'Oswald', sans-serif;
  font-size: .7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 2px;
  color: var(--chrome-dim);
  padding: 11px 16px;
  background: linear-gradient(180deg, #12213c 0%, #0b1628 100%);
  border-bottom: 1px solid rgba(200,16,46,.25);
  border-left: 3px solid var(--red-accent);
  display: flex;
  align-items: center;
  gap: 8px;
}
.panel-body { padding: 12px 14px; }

/* ── Scoreboard game rows ── */
.sb-game {
  display: flex;
  align-items: stretch;
  border-bottom: 1px solid rgba(40,70,120,.3);
  min-height: 64px;
}
.sb-game:last-child { border-bottom: none; }
.sb-game.sb-upcoming { min-height: 56px; }
.sb-team {
  flex: 1;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 14px;
  transition: background .15s;
}
.sb-team:hover { background: rgba(20,40,80,.3); }
.sb-info { flex: 1; min-width: 0; }
.sb-code {
  font-family: 'Oswald', sans-serif;
  font-size: .95rem;
  font-weight: 700;
  color: var(--chrome-bright);
  letter-spacing: .8px;
  text-transform: uppercase;
}
.sb-mgr {
  font-size: .7rem;
  color: var(--text-dim);
  margin-top: 1px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.sb-score {
  font-family: 'Oswald', sans-serif;
  font-size: 1.6rem;
  font-weight: 700;
  color: var(--text-muted);
  min-width: 28px;
  text-align: center;
  line-height: 1;
}
.sb-score-win {
  color: #fff;
  text-shadow: 0 0 12px rgba(255,255,255,.2);
}
.sb-sep {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2px;
  padding: 8px 10px;
  border-left: 1px solid rgba(40,70,120,.3);
  border-right: 1px solid rgba(40,70,120,.3);
  background: rgba(8,16,32,.4);
  flex-shrink: 0;
}
.sb-vs {
  font-family: 'Oswald', sans-serif;
  font-size: .65rem;
  font-weight: 700;
  letter-spacing: 1.5px;
  color: var(--chrome-dim);
  text-transform: uppercase;
}
.sb-ot {
  font-family: 'Oswald', sans-serif;
  font-size: .62rem;
  font-weight: 600;
  color: var(--gold);
  letter-spacing: 1px;
  min-height: 12px;
}
/* Makeup game badge */
.badge-mu {
  display: inline-block;
  font-family: 'Oswald', sans-serif; font-size: .58rem; font-weight: 700;
  letter-spacing: .5px; padding: 1px 5px; border-radius: 3px;
  background: rgba(251,191,36,.15); color: #fbbf24;
  border: 1px solid rgba(251,191,36,.3);
  vertical-align: middle;
}

.sb-posted {
  font-size: .58rem;
  color: var(--text-muted);
  letter-spacing: .3px;
  white-space: nowrap;
  margin-top: 1px;
}
.sb-winner .sb-code { color: #fff; }
.sb-loser { opacity: .5; }

/* Clickable game cards with Zamboni stats */
.sb-game-stats { cursor: pointer; }
.sb-game-stats:hover { background: rgba(20,40,80,.25); }
.sb-stats-hint {
  font-size: .58rem; color: var(--ice-glow); letter-spacing: .3px;
  margin-top: 2px; font-weight: 600;
}
.game-card-stats { cursor: pointer; }
.game-card-stats:hover {
  border-color: var(--ice-glow);
  box-shadow: 0 0 12px rgba(74,140,200,.2);
}
.game-stats-btn {
  font-size: .85rem; opacity: .6;
  cursor: pointer; padding: 2px 4px;
  border-radius: 3px; transition: opacity .1s;
}
.game-card-stats:hover .game-stats-btn { opacity: 1; }

.result-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 7px 0;
  border-bottom: 1px solid rgba(40,70,120,0.3);
  font-size: .83rem;
  gap: 8px;
}
.result-row:last-child { border-bottom: none; }
.result-teams { display: flex; align-items: center; gap: 6px; flex: 1; flex-wrap: wrap; }
.result-score {
  font-family: 'Oswald', sans-serif;
  font-weight: 700;
  font-size: 1rem;
  color: var(--gold);
  white-space: nowrap;
  text-shadow: 0 0 8px rgba(200,168,78,0.2);
}
.empty-state { text-align: center; padding: 30px 16px; color: var(--text-dim); font-size: .85rem; }
.empty-state .empty-icon { font-size: 2.2rem; display: block; margin-bottom: 8px; }

.portal-dashboard-slot {
  margin-bottom: 16px;
}

.portal-panel {
  border-color: rgba(200, 168, 78, 0.2);
}

.portal-panel-cta {
  background: linear-gradient(135deg, rgba(14, 28, 52, 0.95) 0%, rgba(18, 26, 48, 0.92) 100%);
}

.portal-panel-body {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.portal-copy {
  color: var(--text-muted);
  font-size: .92rem;
}

.portal-user-row {
  display: flex;
  align-items: center;
  gap: 12px;
}

.portal-user-meta {
  flex: 1;
  min-width: 0;
}

.portal-avatar {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  object-fit: cover;
  flex-shrink: 0;
  border: 1px solid var(--border-bright);
}

.portal-avatar-fallback {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(180deg, rgba(200,16,46,0.9) 0%, rgba(100,16,26,0.9) 100%);
  color: #fff;
  font-family: 'Oswald', sans-serif;
  font-size: 1rem;
  font-weight: 700;
}

.portal-user-name {
  font-family: 'Oswald', sans-serif;
  font-size: 1rem;
  font-weight: 600;
  color: #fff;
  letter-spacing: .5px;
}

.portal-user-sub {
  color: var(--text-dim);
  font-size: .76rem;
}

.portal-link-form {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.portal-quick-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.portal-stat {
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 8px;
  padding: 10px 12px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.portal-stat-value {
  font-family: 'Oswald', sans-serif;
  font-size: 1.1rem;
  color: #fff;
}

.portal-stat-label {
  font-size: .7rem;
  color: var(--text-dim);
  text-transform: uppercase;
  letter-spacing: .8px;
}

.portal-games-stack {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.portal-game-card {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 6px;
  align-items: stretch;
  text-align: left;
  background: rgba(255,255,255,.04);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 12px 14px;
  color: var(--text);
  transition: border-color .15s, transform .15s, background .15s;
}

.portal-game-card:hover {
  border-color: var(--gold);
  background: rgba(255,255,255,.06);
}

.portal-game-card:active {
  transform: scale(.99);
}

.portal-game-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
}

.portal-game-week {
  font-size: .72rem;
  color: var(--gold);
  text-transform: uppercase;
  letter-spacing: .8px;
  font-family: 'Oswald', sans-serif;
}

.portal-game-action {
  font-size: .72rem;
  color: var(--ice-bright);
  font-weight: 700;
}

.portal-game-matchup {
  font-family: 'Oswald', sans-serif;
  font-size: 1rem;
  color: #fff;
  letter-spacing: .5px;
}

.portal-game-sub,
.portal-score-meta {
  color: var(--text-dim);
  font-size: .76rem;
}

.portal-rpcn-status {
  color: var(--text-dim);
  font-size: .72rem;
  margin-top: 6px;
}

.portal-checkbox-row {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
}

.portal-checkbox-row input {
  width: auto;
}

.portal-team-banner {
  display: flex;
  align-items: center;
  gap: 14px;
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 10px;
  padding: 14px 16px;
}

.portal-team-logo {
  flex-shrink: 0;
  width: 48px;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.portal-team-logo svg {
  max-width: 100%;
  max-height: 100%;
}

.portal-team-info {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.portal-team-code {
  font-family: 'Oswald', sans-serif;
  font-size: 1.3rem;
  font-weight: 700;
  color: #fff;
  letter-spacing: .5px;
}

.portal-team-record {
  font-size: .82rem;
  color: var(--text-dim);
  font-family: 'Oswald', sans-serif;
  letter-spacing: .3px;
}

.portal-team-stats {
  display: flex;
  gap: 16px;
}

.portal-mini-stat {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
}

.portal-mini-stat-value {
  font-family: 'Oswald', sans-serif;
  font-size: 1.2rem;
  font-weight: 700;
  color: var(--gold);
}

.portal-mini-stat-label {
  font-size: .65rem;
  color: var(--text-dim);
  text-transform: uppercase;
  letter-spacing: .6px;
}

/* ── SYS-DATA bar ── */
.sysdata-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  background: linear-gradient(90deg, rgba(200,168,78,.08) 0%, rgba(10,20,40,.6) 100%);
  border: 1px solid rgba(200,168,78,.25);
  border-radius: 8px;
  padding: 14px 20px;
  margin-bottom: 16px;
}
.sysdata-bar-left { display: flex; align-items: center; gap: 14px; }
.sysdata-bar-icon { font-size: 1.6rem; }
.sysdata-bar-title {
  font-family: 'Oswald', sans-serif;
  font-weight: 700;
  font-size: .95rem;
  color: var(--gold);
  letter-spacing: .5px;
}
.sysdata-bar-meta { font-size: .72rem; color: var(--text-dim); margin-top: 2px; }

/* ── Playoff Race ── */
.race-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 14px;
  border-bottom: 1px solid rgba(40,70,120,.25);
  transition: background .12s;
}
.race-row:last-child { border-bottom: none; }
.race-row:hover { background: rgba(20,40,80,.4); }
.race-in  { border-left: 3px solid rgba(0,150,255,.4); }
.race-out { border-left: 3px solid rgba(200,16,46,.3); opacity: .75; }
.race-rank {
  font-family: 'Oswald', sans-serif;
  font-weight: 700;
  font-size: .85rem;
  color: var(--text-dim);
  min-width: 20px;
  text-align: center;
}
.race-info { flex: 1; min-width: 0; }
.race-code {
  font-family: 'Oswald', sans-serif;
  font-weight: 700;
  font-size: .88rem;
  color: var(--chrome-bright);
  display: block;
}
.race-mgr { font-size: .68rem; color: var(--text-dim); }
.race-pts {
  font-family: 'Oswald', sans-serif;
  font-weight: 700;
  font-size: 1rem;
  color: var(--gold);
  min-width: 28px;
  text-align: right;
}
.race-diff {
  font-family: 'Oswald', sans-serif;
  font-size: .72rem;
  font-weight: 600;
  min-width: 52px;
  text-align: right;
  letter-spacing: .5px;
}
.race-diff-in   { color: #4fc3f7; }
.race-diff-out  { color: var(--red-accent); }
.race-diff-cut  { color: var(--gold); }
.race-cutline {
  font-family: 'Oswald', sans-serif;
  font-size: .62rem;
  font-weight: 700;
  letter-spacing: 3px;
  text-transform: uppercase;
  color: rgba(0,150,255,.6);
  text-align: center;
  padding: 5px 0;
  border-top: 1px dashed rgba(0,150,255,.3);
  border-bottom: 1px dashed rgba(0,150,255,.3);
  background: rgba(0,100,200,.04);
  margin: 2px 0;
}

/* ── Playoff Race conf split ── */
.race-conf-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
}
.race-conf-col {
  border-right: 1px solid var(--border);
}
.race-conf-col:last-child { border-right: none; }
.race-conf-label {
  font-family: 'Oswald', sans-serif;
  font-size: .65rem; font-weight: 800; letter-spacing: 1.5px; text-transform: uppercase;
  color: var(--chrome-dim);
  padding: 7px 14px 5px;
  background: rgba(8,16,36,.5);
  border-bottom: 1px solid var(--border);
}
@media (max-width: 700px) {
  .race-conf-grid { grid-template-columns: 1fr; }
  .race-conf-col { border-right: none; border-bottom: 1px solid var(--border); }
}

/* ── Playoff Format rows ── */
.pf-row {
  display: flex; align-items: center; gap: 8px;
  margin-bottom: 8px;
}
.pf-round-num {
  font-family: 'Oswald', sans-serif; font-weight: 700;
  font-size: .78rem; color: var(--text-dim);
  min-width: 18px; text-align: center;
}

/* ── Rules hero banner ── */
.rules-hero {
  display: flex;
  align-items: center;
  gap: 18px;
  padding: 18px 20px;
  margin-bottom: 16px;
  background: linear-gradient(135deg, rgba(200,16,46,.15) 0%, rgba(8,20,48,.8) 100%);
  border: 1px solid var(--border);
  border-radius: 10px;
}
.rules-hero-zamboni {
  width: 72px;
  height: auto;
  object-fit: contain;
  filter: drop-shadow(0 2px 10px rgba(0,0,0,.5));
  flex-shrink: 0;
}
.rules-hero-text { display: flex; flex-direction: column; }

/* ── Rules Section ── */
.rules-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  margin-top: 4px;
}
@media (max-width: 860px) { .rules-grid { grid-template-columns: 1fr; } }

.rules-card { border-radius: 10px; overflow: hidden; }
.rules-body { padding: 16px 18px; }

.rules-p {
  font-size: .84rem; color: var(--chrome-bright);
  margin: 0 0 10px; line-height: 1.65;
}
.rules-p:last-child { margin-bottom: 0; }

.rules-sub-heading {
  font-family: 'Oswald', sans-serif; font-weight: 700;
  font-size: .78rem; letter-spacing: .8px; text-transform: uppercase;
  color: var(--ice-bright);
  margin: 12px 0 6px;
  padding-bottom: 4px;
  border-bottom: 1px solid rgba(74,140,200,.2);
}
.rules-sub-heading:first-child { margin-top: 0; }

.rules-list {
  margin: 0 0 10px 0; padding-left: 18px;
  list-style: none;
}
.rules-list li {
  font-size: .83rem; color: var(--chrome-bright);
  line-height: 1.6; margin-bottom: 4px;
  position: relative;
}
.rules-list li::before {
  content: '—';
  position: absolute; left: -16px;
  color: var(--red-accent); font-weight: 700;
}

.rules-note {
  font-size: .78rem; color: var(--text-dim);
  font-style: italic;
  background: rgba(74,140,200,.05);
  border-left: 2px solid rgba(74,140,200,.3);
  padding: 6px 10px; border-radius: 0 4px 4px 0;
  margin: 6px 0 10px;
  line-height: 1.55;
}

.rules-body strong { color: var(--ice-bright); font-weight: 700; }
.rules-body code {
  background: rgba(74,140,200,.12); padding: 1px 5px;
  border-radius: 3px; font-size: .8em; color: #6ab0f5;
}

/* ── Season History ── */
.season-history-list { display: flex; flex-direction: column; gap: 0; }
.season-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 0;
  border-bottom: 1px solid rgba(40,70,120,.3);
}
.season-row:last-child { border-bottom: none; }
.season-row-left  { display: flex; align-items: center; gap: 14px; }
.season-row-right { display: flex; align-items: center; gap: 16px; flex-shrink: 0; }
.season-number {
  font-family: 'Oswald', sans-serif;
  font-size: 1.4rem;
  font-weight: 700;
  color: var(--red-accent);
  min-width: 40px;
  text-align: center;
  line-height: 1;
}
.season-name {
  font-family: 'Oswald', sans-serif;
  font-weight: 600;
  font-size: .95rem;
  color: #fff;
  letter-spacing: .5px;
}
.season-meta { font-size: .72rem; color: var(--text-dim); margin-top: 2px; }
.season-champ { display: flex; align-items: center; gap: 6px; }

/* ============================================================
   UTILITIES
   ============================================================ */
.flex          { display: flex; }
.flex-center   { display: flex; align-items: center; justify-content: center; }
.items-center  { align-items: center; }
.gap-6   { gap: 6px; }
.gap-8   { gap: 8px; }
.gap-12  { gap: 12px; }
.mt-4    { margin-top: 4px; }
.mt-8    { margin-top: 8px; }
.mt-12   { margin-top: 12px; }
.mt-16   { margin-top: 16px; }
.mt-20   { margin-top: 20px; }
.mb-8    { margin-bottom: 8px; }
.mb-12   { margin-bottom: 12px; }
.mb-16   { margin-bottom: 16px; }
.text-muted   { color: var(--text-muted); }
.text-dim     { color: var(--text-dim); }
.text-accent  { color: var(--gold); }
.text-red     { color: var(--red-accent); }
.text-success { color: var(--success); }
.text-sm  { font-size: .8rem; }
.text-xs  { font-size: .72rem; }
.font-bold { font-weight: 700; }
.font-800  { font-weight: 800; }
.divider { border: none; border-top: 1px solid var(--border); margin: 14px 0; }
.chip {
  display: inline-block;
  padding: 2px 9px;
  border-radius: 2px;
  font-family: 'Oswald', sans-serif;
  font-size: .68rem;
  font-weight: 500;
  letter-spacing: .5px;
  text-transform: uppercase;
}
.chip-blue  { background: rgba(74,140,200,.15); color: var(--ice-bright); }
.chip-green { background: rgba(52,199,89,.15);  color: var(--success); }
.chip-gold  { background: rgba(200,168,78,.15); color: var(--gold); }
.chip-red   { background: rgba(200,16,46,.2);   color: #ff6b7a; }

.section-sep {
  height: 1px;
  background: var(--border);
  margin: 20px 0 12px;
}

/* ── Info banner ── */
.info-banner {
  background: rgba(74,140,200,.08);
  border: 1px solid rgba(74,140,200,.25);
  color: var(--text-muted);
  border-radius: var(--radius-sm);
  padding: 10px 14px;
  font-size: .85rem;
  margin-bottom: 16px;
}

/* ── Responsive ── */
@media (max-width: 1000px) {
  #app-header   { width: 170px; }
  .nav-btn      { font-size: .88rem; padding: 12px 14px; }
  #main-content { padding: 20px; }
}
@media (max-width: 900px) {
  .dash-grid    { grid-template-columns: 1fr 1fr; }
  .dash-panels  { grid-template-columns: 1fr; }
  .draft-layout { grid-template-columns: 1fr; }
}
/* Hamburger — hidden on desktop */
.hamburger-btn {
  display: none;
}

@media (max-width: 700px) {
  #app          { flex-direction: column; }
  #app-header   {
    position: sticky;
    top: 0;
    width: 100%;
    height: auto;
    flex-direction: column;
    padding: 0;
    overflow: visible;
    z-index: 200;
  }
  .header-brand { padding: 8px 14px; border-bottom: 1px solid var(--border); border-right: none; display: flex; justify-content: space-between; align-items: center; flex-direction: row; gap: 10px; }
  .brand-zamboni { width: 40px; margin-bottom: 0; }
  #league-title { font-size: 1rem; letter-spacing: 1px; flex: 1; }
  .header-brand::after { display: none; }

  /* Hamburger button */
  .hamburger-btn {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 5px;
    width: 36px;
    height: 36px;
    padding: 6px;
    background: none;
    border: 1px solid var(--border);
    border-radius: 6px;
    cursor: pointer;
    flex-shrink: 0;
  }
  .hamburger-btn span {
    display: block;
    height: 2px;
    background: var(--text);
    border-radius: 2px;
    transition: transform .2s, opacity .2s;
  }
  .hamburger-btn.open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
  .hamburger-btn.open span:nth-child(2) { opacity: 0; }
  .hamburger-btn.open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

  /* Nav hidden by default on mobile, shown when open */
  #main-nav     {
    flex-direction: column;
    flex-wrap: nowrap;
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    padding: 6px 8px;
    gap: 2px;
    border-bottom: 1px solid var(--border);
    background: rgba(8,16,30,.98);
    display: none;
    max-height: 70vh;
  }
  #main-nav.nav-open { display: flex; }
  .nav-btn      {
    flex: 0 0 auto;
    width: 100%;
    min-height: 44px;
    border-left: 3px solid transparent;
    border-bottom: none;
    padding: 10px 14px;
    font-size: .92rem;
    white-space: nowrap;
    border-radius: 8px;
    text-align: left;
  }
  .nav-btn::before { margin-right: 10px; }
  .nav-btn.active { border-left-color: var(--red-accent); border-bottom-color: transparent; background: rgba(200,16,46,.08); }
  .nav-btn.active::after { display: none; }
  #header-right {
    border-top: none;
    padding: 8px 12px;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 8px;
    border-top: 1px solid var(--border);
    background: rgba(8,16,30,.96);
  }
  #portal-toggle-btn, #admin-toggle-btn {
    min-height: 42px;
  }
  #main-content { padding: 12px; }
  #app-header   { border-right: none; border-bottom: 2px solid var(--red-accent); }
  .dash-grid    { grid-template-columns: 1fr 1fr; }
  .trade-players { grid-template-columns: 1fr; }
  .game-card    { flex-wrap: wrap; gap: 6px; }
  .dash-panels  { grid-template-columns: 1fr; }
  .portal-quick-grid { grid-template-columns: 1fr; }
  .portal-user-row { align-items: flex-start; flex-wrap: wrap; }
  .portal-user-row .btn { width: 100%; justify-content: center; }
  .portal-game-card { padding: 14px; }
  .portal-team-banner { flex-wrap: wrap; justify-content: center; text-align: center; }
  .portal-team-info { align-items: center; }
  .portal-team-stats { justify-content: center; }
  /* Tables — horizontal scroll on small screens */
  .conf-table, .standings-table, .players-table, table {
    font-size: .78rem;
  }
  .conf-standings { overflow-x: auto; }
  .pr-stats { flex-direction: column; gap: 0; }
  .pr-dots  { display: none; }
  .wk-progress-bar { width: 56px; }
  .tw-header { flex-wrap: wrap; gap: 4px; }
  /* Hide less critical standings columns on mobile */
  .ct-th-num:nth-child(n+8), .ct-td-num:nth-child(n+8) { display: none; }
  /* Shorten full team name in standings */
  .ct-fullname { font-size: .78rem; max-width: 100px; }
  /* Stat cards — keep 2-col but fix trend card internals */
  .sct-code { font-size: .88rem; }
  .sct-week-num { font-size: 1.6rem; }
  /* Hot/Cold trend rows wrap on narrow screens */
  .sct-team-row { flex-wrap: wrap; gap: 6px 8px; }
  .sct-trend-right {
    margin-left: 0; width: 100%; align-items: flex-start;
    padding-left: 40px; /* align under text, past logo */
    box-sizing: border-box;
  }
  .sct-form-dots { flex-wrap: wrap; gap: 3px; }
  /* Rules grid already 1-col, conf-grid already 1-col */
  .teams-grid { grid-template-columns: 1fr; }
  /* Scoreboard — stack at mobile */
  .sb-game { padding: 10px 12px; }
  .sb-score { font-size: 1.6rem; }
}

@media (max-width: 480px) {
  .dash-grid { grid-template-columns: 1fr; }
  .stat-card-trend { grid-column: span 1; }
  .sct-trend-right { padding-left: 40px; }
  #header-right { align-items: stretch; }
  #portal-toggle-btn, #admin-toggle-btn { width: 100%; justify-content: center; }
}

/* ── Power Rankings ─────────────────────────────────────────── */
.pr-row {
  display: flex; align-items: center; gap: 10px;
  padding: 8px 14px;
  border-bottom: 1px solid rgba(255,255,255,.05);
  transition: background .15s;
}
.pr-row:hover { background: rgba(255,255,255,.04); }
.pr-row-top { background: rgba(200,168,78,.06); }
.pr-row-top .pr-rank { color: var(--gold); }

.pr-rank {
  font-family: 'Oswald', sans-serif; font-size: 1rem; font-weight: 700;
  color: var(--text-dim); width: 22px; text-align: center; flex-shrink: 0;
}
.pr-diff { font-size: .65rem; font-weight: 700; width: 28px; text-align: center; flex-shrink: 0; }
.pr-diff-up  { color: #4caf50; }
.pr-diff-dn  { color: #ef5350; }
.pr-diff-eq  { color: var(--text-dim); }
.pr-diff-new { color: var(--gold); font-size: .58rem; }

.pr-logo { flex-shrink: 0; }
.pr-info { flex: 1; display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.pr-code {
  font-family: 'Oswald', sans-serif; font-weight: 700;
  font-size: .88rem; color: var(--ice-bright);
}
.pr-mgr { font-size: .68rem; color: var(--text-dim); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.pr-stats { display: flex; align-items: center; gap: 8px; flex-shrink: 0; }
.pr-pts  { font-weight: 700; font-size: .82rem; color: var(--text-primary); }
.pr-l10  { font-size: .68rem; color: var(--text-dim); }
.pr-dots { display: flex; gap: 2px; align-items: center; }

/* Week progress bar */
.wk-progress-wrap {
  display: flex; align-items: center; gap: 8px; flex-shrink: 0;
}
.wk-progress-label {
  font-size: .68rem; color: var(--text-dim); font-weight: 600;
  white-space: nowrap; font-family: 'Oswald', sans-serif;
}
.wk-progress-label.wk-done { color: var(--success); }
.wk-progress-bar {
  width: 80px; height: 5px; background: rgba(255,255,255,.08);
  border-radius: 3px; overflow: hidden;
}
.wk-progress-fill {
  height: 100%; background: var(--primary);
  border-radius: 3px; transition: width .3s ease;
}
.wk-progress-fill.wk-fill-done { background: var(--success); }

/* ── Trade Wire ─────────────────────────────────────────────── */
.tw-card {
  padding: 10px 14px;
  border-bottom: 1px solid rgba(255,255,255,.06);
}
.tw-card:last-child { border-bottom: none; }
.tw-card:hover { background: rgba(255,255,255,.03); }

.tw-header {
  display: flex; justify-content: space-between; align-items: center;
  margin-bottom: 6px;
}
.tw-teams {
  display: flex; align-items: center; gap: 6px;
}
.tw-team-code {
  font-family: 'Oswald', sans-serif; font-weight: 700;
  font-size: .82rem; color: var(--ice-bright);
}
.tw-arrow { color: var(--gold); font-size: 1rem; margin: 0 2px; }
.tw-meta { display: flex; align-items: center; gap: 6px; }
.tw-date { font-size: .65rem; color: var(--text-dim); }
.tw-hot  { font-size: .62rem; font-weight: 700; color: #ef5350; animation: tw-pulse 1.5s ease-in-out infinite; }
.tw-recent { font-size: .62rem; font-weight: 700; color: var(--gold); }
@keyframes tw-pulse { 0%,100% { opacity: 1; } 50% { opacity: .5; } }

.tw-body { display: flex; flex-direction: column; gap: 3px; }
.tw-side { font-size: .75rem; line-height: 1.5; }
.tw-dir  { color: var(--text-dim); font-size: .68rem; margin-right: 4px; }
.tw-player {
  display: inline-flex; align-items: center; gap: 3px;
  background: rgba(255,255,255,.06); border-radius: 4px;
  padding: 1px 5px; margin: 1px 2px; font-size: .72rem; color: var(--text-primary);
}
.tw-ovr {
  background: var(--gold); color: #000; border-radius: 3px;
  padding: 0 3px; font-size: .62rem; font-weight: 700;
}
.tw-empty-assets { color: var(--text-dim); font-style: italic; font-size: .72rem; }
.tw-notes { font-size: .68rem; color: var(--text-dim); font-style: italic; margin-top: 4px; }

/* ── Manager Profiles card ───────────────────────────────────────────────── */
/* ── Managers Split-Pane ────────────────────────────────────────────────── */
.mgr-card-fullwidth { grid-column: 1 / -1; }

.mgr-topbar {
  display: flex; align-items: center; justify-content: space-between;
  flex-wrap: wrap; gap: 10px;
  margin-bottom: 12px; padding-bottom: 10px; border-bottom: 1px solid var(--border);
}
.mgr-topbar-left  { display: flex; align-items: baseline; gap: 10px; }
.mgr-topbar-right { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.mgr-topbar-meta  { font-size: .72rem; color: var(--text-dim); }
.mgr-search-input {
  padding: 5px 10px; font-size: .82rem; width: 200px;
  border-radius: var(--radius-sm); border: 1px solid var(--border);
  background: var(--input-bg); color: var(--chrome-bright);
}
.mgr-filter-sel {
  padding: 5px 8px; font-size: .78rem;
  border-radius: var(--radius-sm); border: 1px solid var(--border);
  background: var(--input-bg); color: var(--chrome-bright);
}

.mgr-split {
  display: grid; grid-template-columns: 260px 1fr; grid-template-rows: 1fr; gap: 0;
  border: 1px solid var(--border); border-radius: var(--radius);
  overflow: hidden; height: 520px;
}

/* LEFT list */
.mgr-list-col { overflow-y: auto; min-height: 0; border-right: 1px solid var(--border); background: rgba(6,12,26,.6); }
.mgr-list-item {
  display: flex; align-items: center; gap: 6px; width: 100%;
  padding: 7px 10px; background: transparent; border: none;
  border-bottom: 1px solid rgba(40,70,120,.13);
  color: var(--text-primary); text-align: left; cursor: pointer;
  transition: background .1s;
}
.mgr-list-item:last-child  { border-bottom: none; }
.mgr-list-item:hover       { background: rgba(74,140,200,.08); }
.mgr-list-item[aria-pressed="true"] {
  background: rgba(74,140,200,.15);
  border-right: 2px solid var(--ice-blue, #4a8cc8);
}
.mgr-list-name {
  flex: 1; font-size: .83rem; font-weight: 600;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.mgr-list-team {
  font-family: 'Oswald', sans-serif; font-size: .7rem; font-weight: 700;
  color: var(--ice-bright, #aac8e8); min-width: 26px; text-align: right;
}

/* Status pills */
.mgr-status-pip {
  display: inline-flex; align-items: center; justify-content: center;
  width: 15px; height: 15px; border-radius: 3px;
  font-family: 'Oswald', sans-serif; font-size: .58rem; font-weight: 700; flex-shrink: 0;
}
.pip-ok  { background: rgba(52,199,89,.18);  color: #34c759; }
.pip-off { background: rgba(40,70,120,.22);  color: var(--text-dim); }

/* RIGHT detail */
.mgr-detail-col { overflow-y: auto; min-height: 0; padding: 16px 18px; background: rgba(8,16,34,.7); }
.mgr-detail-empty {
  display: flex; flex-direction: column; align-items: center;
  justify-content: center; height: 100%; gap: 10px;
  color: var(--text-dim); font-size: .85rem;
}
.mgr-detail-empty-icon { font-size: 2rem; opacity: .3; }
.mgr-detail-header {
  display: flex; align-items: center; gap: 10px;
  margin-bottom: 14px; padding-bottom: 10px; border-bottom: 1px solid var(--border);
}
.mgr-detail-dot   { width: 16px; height: 16px; flex-shrink: 0; }
.mgr-detail-title {
  flex: 1; font-family: 'Oswald', sans-serif; font-size: 1.05rem;
  font-weight: 700; text-transform: uppercase; letter-spacing: 1px; color: #fff;
}
.mgr-detail-fields { display: flex; flex-direction: column; gap: 10px; }
.mgr-detail-group  { display: flex; flex-direction: column; gap: 3px; }
.mgr-detail-row-2col { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.mgr-detail-label {
  font-family: 'Oswald', sans-serif; font-size: .68rem; font-weight: 500;
  text-transform: uppercase; letter-spacing: .7px; color: var(--chrome-dim);
  display: flex; align-items: center; gap: 5px;
}
.mgr-field-hint {
  font-family: inherit; font-size: .68rem; color: var(--text-dim);
  text-transform: none; letter-spacing: 0; font-weight: 400;
}
.mgr-detail-section-head {
  font-family: 'Oswald', sans-serif; font-size: .68rem; font-weight: 600;
  text-transform: uppercase; letter-spacing: 1px; color: var(--chrome-dim);
  margin: 6px 0 4px; padding-bottom: 4px; border-bottom: 1px solid rgba(40,70,120,.25);
  display: flex; align-items: center; gap: 6px;
}
.mgr-pip-inline {
  display: inline-flex; align-items: center; justify-content: center;
  width: 14px; height: 14px; border-radius: 3px;
  font-family: 'Oswald', sans-serif; font-size: .58rem; font-weight: 700;
}
.mgr-detail-input, .mgr-detail-sel {
  padding: 6px 9px; font-size: .83rem;
  background: var(--input-bg); border: 1px solid var(--border);
  border-radius: var(--radius-sm); color: var(--chrome-bright); width: 100%;
  box-sizing: border-box;
}
.mgr-detail-input:focus, .mgr-detail-sel:focus {
  border-color: rgba(74,140,200,.7); outline: none;
  box-shadow: 0 0 0 2px rgba(74,140,200,.15);
}
.mgr-color-row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.mgr-color-picker {
  width: 36px; height: 30px; padding: 2px; border-radius: 5px;
  border: 1px solid var(--border); cursor: pointer; background: none; flex-shrink: 0;
}
.mgr-color-swatches { display: flex; gap: 5px; flex-wrap: wrap; }
.mgr-swatch {
  width: 20px; height: 20px; border-radius: 50%;
  border: 2px solid transparent; cursor: pointer; transition: transform .12s, border-color .12s;
}
.mgr-swatch:hover       { transform: scale(1.2); }
.mgr-swatch.swatch-active { border-color: #fff; transform: scale(1.1); }
.mgr-detail-actions {
  display: flex; align-items: center; gap: 10px;
  margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--border);
}
.mgr-save-feedback { font-size: .78rem; color: var(--success); font-weight: 600; }
.mgr-footer-row {
  display: flex; align-items: center; gap: 8px; margin-top: 12px; flex-wrap: wrap;
}
.mgr-footer-row > input { flex: 1; min-width: 160px; }

@media (max-width: 860px) {
  .mgr-split { grid-template-columns: 1fr; max-height: none; }
  .mgr-list-col { border-right: none; border-bottom: 1px solid var(--border); max-height: 220px; }
}
.mgr-discord-linked { color: var(--success); }

/* ── Legacy profile rows (kept for backward compat) ─────────────────────── */
.mgr-profile-row {
  display: flex; align-items: flex-start; gap: 12px;
  padding: 10px 0; border-bottom: 1px solid rgba(40,70,120,.2);
}
.mgr-profile-row:last-of-type { border-bottom: none; }
.mgr-profile-head {
  display: flex; align-items: center; gap: 8px;
  min-width: 140px; padding-top: 6px;
}
.mgr-profile-fields {
  display: flex; flex: 1; gap: 8px; flex-wrap: wrap;
}
.mgr-profile-fields input {
  flex: 1; min-width: 140px;
  padding: 5px 9px; font-size: .82rem;
  background: var(--input-bg); border: 1px solid var(--border);
  border-radius: 6px; color: var(--chrome-bright);
}

/* ── Zamboni gamertag autocomplete ──────────────────────────────────────── */
.zamboni-wrap { position: relative; flex: 1; min-width: 140px; }
.zamboni-wrap input { width: 100%; box-sizing: border-box; }
.zamboni-drop {
  display: none; position: absolute; top: 100%; left: 0; right: 0; z-index: 200;
  background: #1a2236; border: 1px solid var(--border);
  border-radius: 0 0 6px 6px; max-height: 220px; overflow-y: auto;
  box-shadow: 0 6px 18px rgba(0,0,0,.5);
}
.zamboni-drop.open { display: block; }
.zamboni-option {
  padding: 7px 11px; font-size: .82rem; cursor: pointer;
  color: var(--text-primary); transition: background .1s;
  width: 100%;
  text-align: left;
  border: none;
  background: transparent;
  border-radius: 0;
}
.zamboni-option:hover { background: rgba(74,140,200,.18); }

/* ── Stats leaderboard table ─────────────────────────────────────────────── */
.stats-table { width: 100%; border-collapse: collapse; font-size: .85rem; }

/* Manager identity cell */
.stat-mgr-cell { min-width: 160px; }
.stat-mgr-inner {
  display: flex; align-items: center; gap: 10px; padding: 2px 0;
}
.stat-team-code {
  font-family: 'Oswald', sans-serif; font-size: .95rem;
  font-weight: 700; letter-spacing: .04em; line-height: 1;
}
.stat-mgr-name { font-size: .7rem; color: var(--text-muted); margin-top: 2px; }

/* Rank column */
.stat-rank { color: var(--text-dim); font-weight: 700; font-size: .78rem; }

/* Column leader — gold highlight on the best value in each sortable column */
td.stat-leader {
  color: var(--gold) !important;
  font-weight: 700;
}

/* Goal differential coloring */
.diff-pos { color: #4ade80; font-weight: 600; }
.diff-neg { color: #f87171; font-weight: 600; }

/* Home / Away split cols — slightly muted */
.stat-split { font-size: .78rem; color: var(--text-muted); }

/* Last 5 form dots */
.stat-form { white-space: nowrap; padding: 8px 12px; }
.form-dot {
  display: inline-flex; align-items: center; justify-content: center;
  width: 20px; height: 20px; border-radius: 50%;
  font-size: .6rem; font-weight: 800; margin: 0 1px;
  font-family: 'Oswald', sans-serif;
}
.form-w   { background: rgba(74,222,128,.2);  color: #4ade80; border: 1px solid rgba(74,222,128,.4); }
.form-l   { background: rgba(248,113,113,.18); color: #f87171; border: 1px solid rgba(248,113,113,.35); }
.form-otl { background: rgba(251,191,36,.18);  color: #fbbf24; border: 1px solid rgba(251,191,36,.35); }

/* Clinch / Elimination badge — x (clinched) and e (eliminated) */
.clinch-x, .clinch-e {
  display: inline-block;
  width: auto; height: auto;
  font-family: 'Oswald', sans-serif; font-size: .78rem; font-weight: 800;
  padding: 2px 7px; border-radius: 4px; letter-spacing: .6px;
  vertical-align: middle; margin-left: 6px; line-height: 1.6;
  min-width: 22px; text-align: center;
}
.clinch-x {
  background: rgba(52,199,89,.18);
  color: #34c759;
  border: 1px solid rgba(52,199,89,.45);
}
.clinch-e {
  background: rgba(248,113,113,.15);
  color: #f87171;
  border: 1px solid rgba(248,113,113,.4);
}

/* Streak badge */
.streak-badge {
  display: inline-block; padding: 2px 7px; border-radius: 10px;
  font-family: 'Oswald', sans-serif; font-size: .75rem; font-weight: 700;
  letter-spacing: .04em;
}
.streak-w   { background: rgba(74,222,128,.15);  color: #4ade80; }
.streak-l   { background: rgba(248,113,113,.15); color: #f87171; }
.streak-otl { background: rgba(251,191,36,.15);  color: #fbbf24; }

/* ── Zamboni two-sided game card ─────────────────────────────────────────── */
.zb-game-list { display: flex; flex-direction: column; gap: 0; }

.zb-game-card {
  border: 1px solid rgba(40,70,120,.3);
  border-radius: 6px; margin-bottom: 16px;
  overflow: hidden;
  background: rgba(10,18,40,.6);
}
.zb-game-card:last-child { margin-bottom: 0; }

/* Header row: team | score | team */
.zb-game-header {
  display: flex; align-items: center; gap: 12px;
  padding: 12px 14px 8px 14px;
}
.zb-game-team {
  display: flex; align-items: center; gap: 10px; flex: 1;
}
.zb-game-team-right { justify-content: flex-end; }
.zb-team-code {
  font-family: 'Oswald', sans-serif; font-size: 1rem;
  font-weight: 700; color: var(--chrome-bright); letter-spacing: .04em;
}
.zb-team-mgr { font-size: .72rem; color: var(--text-dim); margin-top: 1px; }

.zb-game-center {
  display: flex; flex-direction: column; align-items: center;
  min-width: 120px;
}
.zb-game-scores {
  display: flex; align-items: center; gap: 10px;
  font-family: 'Oswald', sans-serif;
}
.zb-final-score {
  font-size: 2rem; font-weight: 700; color: var(--text-dim); line-height: 1;
}
.zb-score-w { color: #fff; }
.zb-score-sep { font-size: 1.4rem; color: var(--text-dim); }
.zb-game-meta {
  font-size: .7rem; color: var(--text-dim); margin-top: 3px;
  display: flex; align-items: center; gap: 4px;
}
.zb-ot-badge {
  font-size: .6rem; font-weight: 800; background: #f5c518; color: #000;
  border-radius: 3px; padding: 1px 4px;
}
.zb-disc-badge {
  font-size: .6rem; font-weight: 800; background: #c0392b; color: #fff;
  border-radius: 3px; padding: 1px 4px;
}

/* Comparison table */
.zb-compare {
  padding: 4px 16px 12px 16px;
  background: rgba(10,20,40,.3);
}
.zb-cmp-row {
  display: grid; grid-template-columns: 1fr auto 1fr;
  align-items: center; gap: 8px;
  padding: 4px 0; border-bottom: 1px solid rgba(40,70,120,.12);
  font-size: .8rem;
}
.zb-cmp-row:last-child { border-bottom: none; }
.zb-cmp-label {
  text-align: center; color: var(--text-dim); font-size: .72rem;
  font-weight: 600; letter-spacing: .02em; white-space: nowrap;
}
.zb-cmp-val {
  font-family: 'Oswald', sans-serif; font-size: .9rem;
  color: var(--text-dim); font-weight: 500;
}
.zb-cmp-row .zb-cmp-val:first-child { text-align: right; }
.zb-cmp-row .zb-cmp-val:last-child  { text-align: left; }
.zb-cmp-win { color: #fff; font-weight: 700; }
.zb-cmp-val-r { text-align: left; }

/* ── Banner header (NHL-style gradient card top) ─────────────────────────── */
.zb-banner {
  display: flex; align-items: stretch;
  background: linear-gradient(160deg, #0d1c3a 0%, #080f22 100%);
  border-radius: 6px 6px 0 0;
  border-bottom: 1px solid rgba(74,140,200,.2);
  min-height: 96px;
  overflow: hidden;
}

/* Each team side */
.zb-banner-side {
  display: flex; align-items: center; gap: 12px;
  flex: 1; padding: 16px 14px;
  transition: background .2s;
}
.zb-banner-side-r { flex-direction: row-reverse; }
/* winner tint is applied inline per-team via teamColor() */

/* Logo wrapper */
.zb-banner-logo { flex-shrink: 0; display: flex; align-items: center; }
.zb-banner-logo img { filter: drop-shadow(0 2px 8px rgba(0,0,0,.6)); }

/* Text block */
.zb-banner-info { display: flex; flex-direction: column; gap: 3px; }
.zb-banner-info-r { text-align: right; }
.zb-banner-code {
  font-family: 'Oswald', sans-serif; font-size: 1.3rem;
  font-weight: 700; color: #fff; letter-spacing: .06em; line-height: 1;
}
.zb-banner-mgr { font-size: .8rem; color: var(--text-muted); font-weight: 500; }
.zb-banner-rec  {
  font-size: .7rem; color: var(--text-dim); font-weight: 600;
  letter-spacing: .03em;
}

/* Center score block */
.zb-banner-center {
  display: flex; align-items: center; justify-content: center;
  padding: 12px 8px; flex-shrink: 0;
}
.zb-banner-scores {
  display: flex; align-items: center; gap: 10px;
  font-family: 'Oswald', sans-serif;
}
.zb-banner-score {
  font-size: 3rem; font-weight: 700; color: rgba(255,255,255,.3);
  line-height: 1; min-width: 2ch; text-align: center;
}
.zb-score-w { color: #fff; text-shadow: 0 0 20px rgba(255,255,255,.3); }

/* FINAL label + date stacked */
.zb-banner-final-wrap {
  display: flex; flex-direction: column; align-items: center;
  gap: 4px; padding: 0 6px;
}
.zb-banner-final {
  font-size: .6rem; font-weight: 700; letter-spacing: .1em;
  color: var(--text-dim); text-transform: uppercase; white-space: nowrap;
}
.zb-banner-date {
  font-size: .62rem; color: var(--text-dim); white-space: nowrap;
}

/* ── Donut charts row ─────────────────────────────────────────────────────── */
.zb-donuts {
  display: flex; justify-content: center; gap: 36px;
  padding: 14px 16px 10px;
  background: rgba(8,16,36,.4);
  border-bottom: 1px solid rgba(40,70,120,.15);
}
.zb-donut-block {
  display: flex; flex-direction: column; align-items: center; gap: 3px;
}
.zb-donut-label {
  font-size: .64rem; font-weight: 700; letter-spacing: .07em;
  text-transform: uppercase; color: var(--text-dim);
}
.zb-donut-pcts {
  font-family: 'Oswald', sans-serif; font-size: .78rem;
  display: flex; gap: 6px; font-weight: 600;
}

/* ── Comparison stat bars ─────────────────────────────────────────────────── */
.zb-cmp-center {
  display: flex; flex-direction: column; align-items: stretch;
  gap: 3px; min-width: 160px;
}
.zb-cmp-bar {
  display: flex; height: 4px; border-radius: 2px; overflow: hidden;
  width: 100%; background: rgba(40,70,120,.2);
}
.zb-cmp-bar-l { height: 100%; flex-shrink: 0; } /* color set inline by teamColor() */
.zb-cmp-bar-r { height: 100%; flex-shrink: 0; } /* color set inline by teamColor() */