/* ===== PADEL MANAGER PRO - PROFESSIONAL DARK THEME ===== */
/* Clean, modern dark UI with green accent (#7CFF00) */
/* Professional aesthetic - no debug/terminal styling */

/* --- CSS Variables --- */
:root {
  --bg-darkest: #0D0D0D;
  --bg-dark: #121212;
  --bg-panel: #161618;
  --bg-card: #1a1a1c;
  --bg-input: #0e0e10;
  --bg-inner: #1c1c1f;
  --bg-hover: #222225;
  --accent: #7CFF00;
  --accent-dim: rgba(124, 255, 0, 0.08);
  --accent-border: rgba(124, 255, 0, 0.25);
  --accent-hover: #6BDD00;
  --text-primary: #f4f4f5;
  --text-secondary: #b4b4b8;
  --text-muted: #8e8e93;
  --text-dim: #a1a1aa;
  --text-ghost: #636366;
  --border-default: #2c2c2e;
  --border-subtle: #232325;
  --border-input: #3a3a3c;
  --red-error: #ff453a;
  --green-ok: #30d158;
  --gold: #ffd60a;
  --font-sans: 'Inter', sans-serif;
  --font-mono: 'Roboto Mono', monospace;
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-xl: 24px;
}

/* --- Reset & Base --- */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
* { font-family: var(--font-sans); }
.font-mono, .fm, code, pre { font-family: var(--font-mono) !important; }

html { scroll-behavior: smooth; }

body {
  background-color: var(--bg-darkest);
  color: var(--text-secondary);
  min-height: 100vh;
  -webkit-tap-highlight-color: transparent;
  overflow-x: hidden;
  display: flex;
  flex-direction: column;
}

::selection { background: var(--accent); color: black; }

/* --- Custom Scrollbar --- */
::-webkit-scrollbar { width: 4px; height: 4px; }
::-webkit-scrollbar-track { background: var(--bg-panel); }
::-webkit-scrollbar-thumb { background: var(--border-default); border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: var(--accent); }

/* Hide number input arrows */
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
input[type="number"] { -moz-appearance: textfield; }

/* --- Background (subtle, no orbs) --- */
#mesh-bg { display: none; }

/* --- Header --- */
header {
  background: var(--bg-darkest) !important;
  border-bottom: 1px solid var(--border-subtle);
  transition: background .35s ease;
}
header.glass {
  background: rgba(13,13,13,0.92) !important;
  backdrop-filter: blur(20px) !important;
  -webkit-backdrop-filter: blur(20px) !important;
  box-shadow: 0 1px 0 rgba(255,255,255,0.02), 0 4px 20px rgba(0,0,0,.3) !important;
}
#hdr-strip { height: 0; overflow: hidden; transition: height .38s cubic-bezier(.4,0,.2,1), opacity .3s ease; opacity: 0; display: flex; align-items: center; padding: 0 12px; gap: 8px; }
#hdr-strip.visible { height: 36px; opacity: 1; }
#hdr-strip-name { font-size: 13px; font-weight: 700; color: var(--text-primary); flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#hdr-strip-sub { font-size: 11px; color: var(--text-muted); flex-shrink: 0; }
#hdr-toggle { display: none; position: absolute; bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 60; background: var(--bg-panel); border: 1px solid var(--border-default); border-radius: 999px; padding: 3px 12px; cursor: pointer; transition: all .2s; }
#hdr-toggle:hover { border-color: var(--accent); }
#hdr-toggle svg { display: block; transition: transform .3s ease; stroke: var(--text-muted); }
#hdr-toggle.collapsed svg { transform: rotate(180deg); }
#hdr-body { overflow: hidden; max-height: 120px; transition: max-height .3s ease, opacity .25s ease; }
#hdr-body.hdr-hidden { max-height: 0 !important; opacity: 0; pointer-events: none; }

/* --- Step Pills --- */
.step-pill { flex: 1; height: 3px; border-radius: 999px; transition: all .5s cubic-bezier(.4,0,.2,1); }

/* --- Splash Screen --- */
#splash { position: fixed; inset: 0; z-index: 9999; background: var(--bg-darkest); display: flex; flex-direction: column; align-items: center; justify-content: center; transition: opacity .4s ease, visibility .4s ease; }
#splash.fade-out { opacity: 0; visibility: hidden; pointer-events: none; }
.splash-logo { width: 84px; height: 84px; background: var(--bg-panel); border: 2px solid var(--accent); border-radius: var(--radius-xl); display: flex; align-items: center; justify-content: center; animation: popIn .65s .2s both cubic-bezier(.175,.885,.32,1.275); }
.splash-title { font-size: 28px; font-weight: 900; color: var(--text-primary); margin: 16px 0 4px; letter-spacing: -.5px; animation: fadeSlide .5s .5s both; display: flex; align-items: center; gap: 8px; }
.splash-sub { font-size: 14px; color: var(--text-muted); margin-bottom: 32px; animation: fadeSlide .5s .6s both; }
.splash-bar-track { width: 200px; height: 4px; background: var(--border-default); border-radius: 999px; overflow: hidden; animation: fadeSlide .5s .7s both; }
.splash-bar-fill { height: 100%; border-radius: 999px; background: var(--accent); width: 0%; transition: width .1s linear; }
.splash-msg { font-size: 12px; color: var(--text-muted); margin-top: 10px; animation: fadeSlide .5s .8s both; }

.splash-svg-wrap { position: relative; }
.splash-svg-wrap svg { position: relative; z-index: 5; }

/* ===== GENERATE LOADER ===== */
#gen-loader { position: fixed; inset: 0; z-index: 9998; background: var(--bg-darkest); display: none; align-items: center; justify-content: center; }
.gen-grid-bg { display: none; }
.gen-scanline { display: none; }
.gen-sidebar { display: none !important; }
.gen-tech-block { margin-bottom: 20px; }
.gen-tech-title { color: var(--text-ghost); font-size: 10px; font-weight: 600; text-transform: uppercase; letter-spacing: 1.5px; margin-bottom: 6px; padding-left: 0; }
.gen-tech-value { color: var(--text-secondary); font-size: 12px; line-height: 1.6; }
.gen-tech-neon { color: var(--accent); }
.gen-loader-center { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 10; text-align: center; width: 90%; max-width: 400px; }
.gen-svg-wrapper { position: relative; width: 220px; height: 220px; margin: 0 auto 30px; }
.gen-svg-loader { width: 100%; height: 100%; position: relative; z-index: 5; }
.gen-status-title { font-size: 16px; font-weight: 700; letter-spacing: 2px; text-transform: uppercase; color: #fff; margin-bottom: 8px; }
.gen-status-sub { font-size: 12px; color: var(--text-muted); letter-spacing: 0.5px; }
.geo-ring { transform-origin: 130px 130px; animation: rotateGeo 12s cubic-bezier(0.4,0,0.2,1) infinite; }
.ball-lines { transform-origin: 130px 130px; animation: rotateBall 25s linear infinite; }
.paddle-core { animation: paddlePulse 2s ease-in-out infinite; }
@keyframes rotateGeo { 0%{transform:rotate(0deg)} 25%{transform:rotate(90deg)} 50%{transform:rotate(180deg)} 75%{transform:rotate(270deg)} 100%{transform:rotate(360deg)} }
@keyframes rotateBall { 0%{transform:rotate(360deg)} 100%{transform:rotate(0deg)} }
@keyframes paddlePulse { 0%,100%{opacity:.85} 50%{opacity:1} }
.gen-skip-btn { position: absolute; bottom: 30px; left: 50%; transform: translateX(-50%); z-index: 10; background: transparent; border: 1px solid var(--border-default); color: var(--text-muted); padding: 10px 24px; font-size: 12px; text-transform: uppercase; letter-spacing: 1px; cursor: pointer; border-radius: var(--radius-md); transition: all .2s ease; }
.gen-skip-btn:hover { border-color: var(--accent); color: var(--accent); }

/* --- Champion Celebration --- */
#champ { position: fixed; inset: 0; z-index: 9970; background: rgba(0,0,0,.8); display: none; align-items: center; justify-content: center; padding: 20px; }
.champ-card { background: linear-gradient(135deg, #1a1a1c, #222225); border-radius: var(--radius-xl); padding: 44px 32px; text-align: center; max-width: 340px; width: 100%; box-shadow: 0 20px 60px rgba(0,0,0,.5); border: 1px solid var(--accent-border); animation: popIn .5s cubic-bezier(.175,.885,.32,1.275); }
.champ-trophy { display: flex; justify-content: center; animation: trBounce 1.2s ease infinite; }
@keyframes trBounce { 0%,100%{transform:translateY(0) rotate(-4deg)} 50%{transform:translateY(-14px) rotate(4deg)} }
#confetti { position: fixed; inset: 0; pointer-events: none; z-index: 9960; }

/* --- Neon Badge --- */
.neon-badge { background: var(--accent); color: black; font-size: 10px; padding: 2px 8px; border-radius: var(--radius-sm); font-weight: 700; letter-spacing: 0.05em; }

/* --- Status Indicator --- */
.status-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--accent); }

/* ===== TAB INDICATOR ===== */
.tab-group { position: relative; display: grid; gap: 4px; background: var(--bg-input); padding: 4px; border-radius: var(--radius-md); border: 1px solid var(--border-subtle); }
.tab-group .tab-indicator { position: absolute; height: calc(100% - 8px); top: 4px; background: var(--accent); border-radius: 8px; transition: all .25s cubic-bezier(.4,0,.2,1); z-index: 0; }
.tab-group button { position: relative; z-index: 1; padding: 8px 12px; font-size: 12px; font-weight: 600; border-radius: 8px; border: none; background: transparent; cursor: pointer; transition: color .2s; }
.tab-group button.active { color: black; font-weight: 700; }
.tab-group button:not(.active) { color: var(--text-muted); }
.tab-group button:not(.active):hover { color: var(--text-primary); }

/* ===== PRIMARY BUTTONS ===== */
.neon-btn { background: var(--accent); color: black; font-weight: 700; font-size: 13px; padding: 14px 32px; border-radius: 12px; border: none; cursor: pointer; transition: all .2s; letter-spacing: 0.03em; text-transform: uppercase; display: flex; align-items: center; justify-content: center; gap: 8px; position: relative; overflow: hidden; }
.neon-btn:hover { background: var(--accent-hover); }
.neon-btn:disabled { opacity: .4; cursor: not-allowed; }
.neon-btn:disabled:hover { background: var(--accent); }
.neon-btn-sm { padding: 8px 16px; font-size: 11px; }

.ghost-btn { background: transparent; border: 1px solid var(--border-default); color: #d4d4d8; font-weight: 600; font-size: 11px; padding: 8px 16px; border-radius: 12px; cursor: pointer; transition: all .2s; text-transform: uppercase; letter-spacing: 0.03em; }
.ghost-btn:hover { border-color: var(--accent); color: var(--accent); }

.danger-btn { background: transparent; border: 1px solid rgba(255,69,58,0.3); color: #ff6961; font-weight: 600; font-size: 11px; padding: 8px 16px; border-radius: 12px; cursor: pointer; transition: all .2s; }
.danger-btn:hover { border-color: var(--red-error); background: rgba(255,69,58,0.08); }

/* ===== FORMAT SELECTOR CARDS ===== */
.format-card { background: var(--bg-input); border: 1px solid var(--border-subtle); border-radius: 16px; padding: 14px; cursor: pointer; transition: all .25s; display: flex; flex-direction: column; gap: 4px; }
.format-card:hover { border-color: var(--border-default); background: var(--bg-hover); }
.format-card.active { border-color: var(--accent); background: var(--accent-dim); }
.format-dot { width: 8px; height: 8px; border-radius: 50%; background: #52525b; flex-shrink: 0; transition: all .2s; }
.format-card.active .format-dot { background: var(--accent); }

/* Category dropdown */
.cat-dropdown { position: relative; width: 100%; }
.cat-dropdown-trigger { display: flex; align-items: center; justify-content: space-between; width: 100%; padding: 9px 12px; border-radius: 12px; border: 1px solid var(--border-subtle); background: var(--bg-input); color: var(--text-primary); font-size: 13px; font-weight: 600; font-family: 'Roboto Mono', monospace; cursor: pointer; transition: all .2s; }
.cat-dropdown-trigger:hover { border-color: var(--border-default); }
.cat-dropdown.open .cat-dropdown-trigger { border-color: var(--accent); background: var(--accent-dim); }
.cat-dropdown-text { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cat-dropdown-arrow { flex-shrink: 0; margin-left: 8px; color: var(--text-muted); transition: transform .2s; }
.cat-dropdown.open .cat-dropdown-arrow { transform: rotate(180deg); color: var(--accent); }
.cat-dropdown-menu { display: none; position: absolute; top: calc(100% + 4px); left: 0; right: 0; z-index: 50; max-height: 260px; overflow-y: auto; background: #161619; border: 1px solid var(--border-default); border-radius: 12px; padding: 6px; box-shadow: 0 8px 32px rgba(0,0,0,.5); scrollbar-width: thin; scrollbar-color: #27272a #161619; }
.cat-dropdown.open .cat-dropdown-menu { display: block; }
.cat-dropdown-item { display: flex; align-items: center; gap: 8px; padding: 8px 10px; border-radius: 8px; font-size: 12px; font-weight: 600; color: var(--text-muted); cursor: pointer; transition: all .15s; font-family: 'Roboto Mono', monospace; }
.cat-dropdown-item:hover { background: rgba(255,255,255,.04); color: var(--text-primary); }
.cat-dropdown-item input[type="checkbox"] { width: 16px; height: 16px; accent-color: var(--accent); border-radius: 4px; cursor: pointer; flex-shrink: 0; }

/* Gender checkboxes */
.gender-checks { display: flex; gap: 8px; flex-wrap: wrap; }
.gender-check-item { display: flex; align-items: center; gap: 6px; padding: 7px 12px; border-radius: 10px; border: 1px solid var(--border-subtle); background: var(--bg-input); font-size: 12px; font-weight: 600; color: var(--text-muted); cursor: pointer; transition: all .15s; font-family: 'Roboto Mono', monospace; }
.gender-check-item:hover { border-color: var(--border-default); color: var(--text-primary); }
.gender-check-item input[type="checkbox"] { width: 16px; height: 16px; accent-color: var(--accent); cursor: pointer; }
.gender-icon { font-size: 14px; }

/* Category filter tabs in dashboard */
.cat-filter-bar { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 12px; }
.cat-filter-btn { padding: 5px 12px; border-radius: 8px; border: 1px solid #27272a; background: #111113; color: #71717a; font-size: 11px; font-weight: 700; font-family: 'Roboto Mono', monospace; cursor: pointer; transition: all .2s; white-space: nowrap; }
.cat-filter-btn:hover { border-color: #3f3f46; color: #a1a1aa; }
.cat-filter-btn.active { border-color: var(--accent); background: var(--accent-dim); color: var(--accent); }

/* ===== RADIO CARDS ===== */
.radio-card { background: var(--bg-input); border: 1px solid var(--border-subtle); border-radius: 16px; padding: 12px; cursor: pointer; transition: all .2s; display: flex; flex-direction: column; justify-content: space-between; }
.radio-card:hover { border-color: var(--border-default); }
.radio-card.selected, .radio-card.active { border-color: var(--accent); background: var(--accent-dim); }
.radio-card .radio-dot { width: 12px; height: 12px; border-radius: 50%; border: 2px solid var(--border-default); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.radio-card.selected .radio-dot, .radio-card.active .radio-dot { border-color: var(--accent); }
.radio-card.selected .radio-dot::after, .radio-card.active .radio-dot::after { content: ''; width: 6px; height: 6px; border-radius: 50%; background: var(--accent); }

/* ===== DATA TABLE ===== */
.ltable { width: 100%; border-collapse: collapse; }
.ltable th { background: var(--bg-input); padding: 10px 8px; text-align: left; font-size: 11px; font-weight: 600; text-transform: uppercase; color: var(--text-muted); letter-spacing: .4px; border-bottom: 1px solid var(--border-default); }
.ltable td { padding: 10px 8px; border-bottom: 1px solid var(--border-subtle); font-size: 13px; color: var(--text-secondary); }
.ltable tr:hover td { background: var(--bg-hover); }
.ltable tr.highlight td { border-left: 2px solid var(--accent); background: var(--accent-dim); }

/* --- Score Pills --- */
.sp { font-size: 11px; font-weight: 700; padding: 2px 6px; border-radius: var(--radius-sm); font-family: var(--font-mono); background: var(--bg-input); color: #d4d4d8; }
.sp.w { background: rgba(48,209,88,0.12); color: var(--green-ok); }
.sp.l { background: rgba(255,69,58,0.1); color: #ff6961; }

/* ===== BRACKET STYLES ===== */
.bwrap { overflow-x: auto; padding: 16px; background: var(--bg-input); border-radius: 16px; }
.brow { display: flex; gap: 28px; min-width: max-content; }
.bcol { display: flex; flex-direction: column; min-width: 185px; }
.bcol-title { text-align: center; font-weight: 600; font-size: 11px; text-transform: uppercase; letter-spacing: 1px; color: var(--text-muted); margin-bottom: 10px; }
.bmatch { background: var(--bg-panel); border: 1px solid var(--border-default); border-radius: 12px; margin: 8px 0; overflow: hidden; cursor: pointer; transition: transform .15s, border-color .15s; }
.bmatch:hover { transform: scale(1.02); border-color: var(--text-muted); }
.bmatch.done { border-color: var(--green-ok); }
.bmatch.final { border: 2px solid var(--gold); }
.bteam { display: flex; justify-content: space-between; align-items: center; padding: 9px 12px; font-size: 13px; color: #e4e4e7; }
.bteam:first-child { border-bottom: 1px solid var(--border-subtle); }
.bteam.winner { background: rgba(48,209,88,0.06); font-weight: 700; color: var(--green-ok); }
.bteam.loser { color: var(--text-muted); }
.bscore { font-weight: 800; font-family: var(--font-mono); background: var(--bg-input); padding: 3px 8px; border-radius: 8px; min-width: 30px; text-align: center; font-size: 12px; color: #e4e4e7; }
.bteam.winner .bscore { background: var(--green-ok); color: white; }

/* --- Bracket format-specific layouts --- */
.brow.brow-vertical { display: block; min-width: auto; gap: 0; }
.bracket-leaderboard { width: 100%; }
.bracket-leaderboard-row { display: flex; align-items: center; gap: 8px; padding: 7px 12px; border-radius: 10px; margin-bottom: 3px; transition: background .2s, border-color .2s; }
.bracket-leaderboard-row:hover { filter: brightness(1.1); }
.bracket-leaderboard-bar { margin: -1px 12px 4px 46px; height: 2px; border-radius: 1px; background: var(--border-subtle); overflow: hidden; }
.bracket-leaderboard-bar-fill { height: 100%; border-radius: 1px; transition: width .5s ease; }
.bracket-stats-row { display: flex; gap: 12px; margin-bottom: 12px; padding: 10px 14px; border-radius: 12px; }
.bracket-stats-cell { flex: 1; }
.bracket-stats-label { font-size: 10px; color: var(--text-muted); text-transform: uppercase; font-weight: 700; letter-spacing: .08em; }
.bracket-stats-value { font-size: 20px; font-weight: 900; }
.bracket-tier-label { font-size: 9px; font-weight: 800; text-transform: uppercase; letter-spacing: .12em; padding: 6px 12px 2px; }

/* --- Match Cards --- */
.mcard { background: var(--bg-panel); border-radius: 12px; padding: 14px; border-left: 3px solid var(--accent); cursor: pointer; margin-bottom: 8px; transition: transform .15s, border-color .15s; }
.mcard:hover { transform: translateX(4px); border-left-color: white; }
.mcard.won { border-left-color: var(--green-ok); background: rgba(48,209,88,0.04); }

/* ===== TICKER MARQUEE ===== */
.ticker-bar { background: var(--bg-panel); border: 1px solid var(--border-subtle); border-radius: 16px; height: 48px; overflow: hidden; display: flex; align-items: center; position: relative; }
.ticker-anchor-left { background: var(--accent); color: black; font-size: 10px; font-weight: 700; padding: 4px 12px; letter-spacing: .05em; text-transform: uppercase; flex-shrink: 0; z-index: 2; display: flex; align-items: center; gap: 6px; }
.ticker-scroll { flex: 1; overflow: hidden; position: relative; height: 100%; display: flex; align-items: center; }
.ticker-content { display: flex; gap: 48px; animation: tickerScroll 25s linear infinite; white-space: nowrap; padding-left: 20px; }
.ticker-content:hover { animation-play-state: paused; }
.ticker-item { font-size: 11px; color: var(--text-muted); display: flex; align-items: center; gap: 8px; flex-shrink: 0; }
.ticker-item .neon { color: var(--accent); }
.ticker-anchor-right { color: var(--accent); font-size: 11px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; padding: 4px 12px; flex-shrink: 0; z-index: 2; display: flex; align-items: center; gap: 6px; }
@keyframes tickerScroll { 0% { transform: translateX(0); } 100% { transform: translateX(-50%); } }

/* ===== SPONSOR / SPOTLIGHT CARDS ===== */
.sponsor-card { background: var(--bg-input); border: 1px solid var(--border-subtle); border-radius: 16px; padding: 12px; margin-bottom: 8px; display: flex; align-items: center; gap: 10px; }
.spotlight-card { background: var(--bg-input); border: 1px solid var(--border-subtle); border-radius: 16px; padding: 8px; border-left: 2px solid var(--accent); }

/* ===== AD SLOT STYLES ===== */
.ad-slot { background: var(--bg-input); border: 1px dashed var(--border-default); border-radius: 12px; padding: 16px; display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 96px; transition: all .25s; position: relative; overflow: hidden; }
.ad-slot::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 2px; background: linear-gradient(90deg, transparent, var(--accent-border), transparent); opacity: 0; transition: opacity .3s; }
.ad-slot:hover { border-color: var(--accent-border); background: var(--accent-dim); }
.ad-slot:hover::before { opacity: 1; }
.ad-slot-label { font-size: 10px; font-weight: 600; color: var(--text-ghost); text-transform: uppercase; letter-spacing: 1px; }
.ad-slot-icon { opacity: 0.3; margin-bottom: 4px; }

.sponsor-slot { background: var(--bg-input); border: 1px solid var(--border-subtle); border-radius: 12px; padding: 12px 16px; display: flex; align-items: center; justify-content: center; gap: 8px; transition: all .25s; min-height: 56px; }
.sponsor-slot:hover { border-color: var(--accent-border); background: var(--accent-dim); }

/* Hide ad management in public view - accessible via modal only */
.dash-ad-admin { display: none; }

/* --- Ad config map --- */
#map-banner { transition: all .3s; }
#map-banner:hover { border-color: var(--accent); }

/* --- Toast --- */
#toast { position: fixed; bottom: 76px; left: 50%; transform: translateX(-50%) translateY(14px); background: var(--bg-panel); color: var(--accent); padding: 9px 18px; border-radius: 12px; font-size: 13px; font-weight: 600; z-index: 9990; opacity: 0; transition: all .28s cubic-bezier(.4,0,.2,1); pointer-events: none; white-space: nowrap; box-shadow: 0 8px 28px rgba(0,0,0,.4); border: 1px solid var(--accent-border); }
#toast.show { opacity: 1; transform: translateX(-50%) translateY(0); }

/* ===== ANIMATIONS ===== */
@keyframes popIn { from{transform:scale(.7);opacity:0} to{transform:scale(1);opacity:1} }
@keyframes fadeSlide { from{opacity:0;transform:translateY(-10px)} to{opacity:1;transform:translateY(0)} }
@keyframes slideUp { from{opacity:0;transform:translateY(24px)} to{opacity:1;transform:translateY(0)} }
@keyframes rowSlideIn { from{opacity:0;transform:translateY(-10px)} to{opacity:1;transform:translateY(0)} }
.manim { animation: slideUp .32s cubic-bezier(.175,.885,.32,1.275); }
.animate-row { animation: rowSlideIn 0.3s cubic-bezier(.4,0,.2,1) forwards; }
.animate-neon-btn { }
.ico-glow { }

/* ===== FORMAT INFOGRAPHIC ANIMATIONS ===== */
.format-infographic {
  height: 40px;
  width: 100%;
  margin-top: 8px;
  opacity: 0.7;
  transition: opacity .3s ease;
}
.format-card:hover .format-infographic,
.format-card.active .format-infographic {
  opacity: 1;
}

/* Elimination bracket animation */
.fi-elim-advance {
  animation: fiElimPulse 2s ease-in-out infinite;
}
.fi-elim-winner {
  animation: fiElimGlow 1.5s ease-in-out infinite;
}
@keyframes fiElimPulse {
  0%, 100% { fill-opacity: 0.15; }
  50% { fill-opacity: 0.35; }
}
@keyframes fiElimGlow {
  0%, 100% { fill-opacity: 0.3; stroke-width: 1.5; }
  50% { fill-opacity: 0.55; stroke-width: 2; }
}

/* League circular rotation */
.fi-league-rotate {
  transform-origin: 100px 20px;
  animation: fiLeagueRotate 8s linear infinite;
}
@keyframes fiLeagueRotate {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

/* Groups arrow animation */
.fi-groups-arrow {
  animation: fiGroupsSlide 2s ease-in-out infinite;
}
@keyframes fiGroupsSlide {
  0%, 100% { opacity: 0.6; transform: translateX(0); }
  50% { opacity: 1; transform: translateX(4px); }
}

/* Americano rotating players */
.fi-am-rot-1 { animation: fiAmOrbit 6s linear infinite; }
.fi-am-rot-2 { animation: fiAmOrbit 6s linear infinite; animation-delay: -3s; }
.fi-am-rot-3 { animation: fiAmOrbit 6s linear infinite; animation-delay: -1.5s; }
.fi-am-rot-4 { animation: fiAmOrbit 6s linear infinite; animation-delay: -4.5s; }
.fi-am-rot-5 { animation: fiAmOrbit 6s linear infinite; animation-delay: -0.75s; }
.fi-am-rot-6 { animation: fiAmOrbit 6s linear infinite; animation-delay: -3.75s; }
.fi-am-orbit { animation: fiAmOrbitSpin 10s linear infinite; transform-origin: 100px 20px; }
@keyframes fiAmOrbit {
  0%, 100% { opacity: 0.4; r: 4; }
  50% { opacity: 0.9; r: 5.5; }
}
@keyframes fiAmOrbitSpin {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

/* Mexicano up/down arrows */
.fi-mex-up { animation: fiMexUp 1.5s ease-in-out infinite; }
.fi-mex-down { animation: fiMexDown 1.5s ease-in-out infinite; }
@keyframes fiMexUp {
  0%, 100% { opacity: 0.6; transform: translateY(0); }
  50% { opacity: 1; transform: translateY(-3px); }
}
@keyframes fiMexDown {
  0%, 100% { opacity: 0.6; transform: translateY(0); }
  50% { opacity: 1; transform: translateY(3px); }
}

/* Swiss ranking bars - subtle width pulse */
.fi-swiss rect {
  animation: fiSwissPulse 3s ease-in-out infinite;
}
.fi-swiss rect:nth-child(1) { animation-delay: 0s; }
.fi-swiss rect:nth-child(2) { animation-delay: 0.1s; }
.fi-swiss rect:nth-child(3) { animation-delay: 0.2s; }
@keyframes fiSwissPulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.65; }
}

/* --- Icon Animations (keep hover, no glow) --- */
.ico { display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; transition: transform .25s cubic-bezier(.4,0,.2,1); }
.ico svg { display: block; }
.ico-float { animation: icoFloat 3s ease-in-out infinite; }
@keyframes icoFloat { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-5px)} }
.ico-hbounce:hover svg { animation: icoBounce .45s ease; }
.ico-hwiggle:hover svg { animation: icoWiggle .45s ease; }
.ico-hshake:hover svg { animation: icoShake .45s ease; }
.ico-hrotate:hover { transform: rotate(180deg) !important; }
.ico-hscale:hover { transform: scale(1.25) !important; }
@keyframes icoBounce { 0%,100%{transform:translateY(0)} 40%{transform:translateY(-5px)} 70%{transform:translateY(-2px)} }
@keyframes icoWiggle { 0%,100%{transform:rotate(0)} 25%{transform:rotate(-18deg)} 75%{transform:rotate(18deg)} }
@keyframes icoShake { 0%,100%{transform:rotate(0) scale(1)} 20%{transform:rotate(-20deg) scale(1.2)} 50%{transform:rotate(18deg) scale(1.2)} 75%{transform:rotate(-10deg)} }

.ico-badge { display: inline-flex; align-items: center; justify-content: center; border-radius: var(--radius-md); padding: 6px; flex-shrink: 0; }
.ico-blue { background: linear-gradient(135deg, var(--accent), #8bcc00); color: black; }
.ico-green { background: linear-gradient(135deg, #4ade80, #16a34a); color: white; }
.ico-purple { background: linear-gradient(135deg, #a78bfa, #7c3aed); color: white; }
.ico-gold { background: linear-gradient(135deg, #fbbf24, #f59e0b); color: black; }
.ico-red { background: linear-gradient(135deg, #f87171, #dc2626); color: white; }

.btn-shine::after { content: ''; position: absolute; inset: 0; background: linear-gradient(105deg, transparent 35%, rgba(255,255,255,.15) 50%, transparent 65%); transform: translateX(-100%) skewX(-15deg); transition: none; }
.btn-shine:hover::after { transform: translateX(150%) skewX(-15deg); transition: transform .55s ease; }
.btn-pulse { }

.btn-hdr { transition: transform .2s ease, background .2s ease !important; border: 1px solid var(--border-default); background: transparent; color: #d4d4d8; border-radius: 12px; }
.btn-hdr:hover { transform: scale(1.05) !important; border-color: var(--accent); color: var(--accent); }

button { position: relative; overflow: hidden; -webkit-tap-highlight-color: transparent; user-select: none; transition: transform .15s ease; min-height: 36px; }
button:active { transform: scale(0.97) !important; }
button:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
nav button { min-height: 48px; }
.ripple { position: absolute; border-radius: 50%; background: rgba(124,255,0,.15); transform: scale(0); animation: rippleOut .55s ease-out forwards; pointer-events: none; z-index: 10; }
@keyframes rippleOut { to{transform:scale(4.5);opacity:0} }

/* --- Cal Cell --- */
.cal-cell { width: 100%; aspect-ratio: 1; border: 1px solid var(--border-default); border-radius: 10px; display: flex; align-items: center; justify-content: center; font-size: 10px; cursor: pointer; transition: all .15s; color: #d4d4d8; background: var(--bg-input); min-height: 36px; }
.cal-cell.active { border-color: var(--accent-border); background: var(--accent-dim); color: var(--accent); }

/* --- Telemetry --- */
.telemetry-row { display: flex; justify-content: space-between; align-items: center; padding: 6px 0; border-bottom: 1px solid var(--border-subtle); font-size: 11px; }
.telemetry-row:last-child { border-bottom: none; }
.telemetry-label { color: var(--text-muted); }
.telemetry-value { color: var(--accent); font-weight: 700; }

/* --- Tour Banner --- */
#tour-banner { border-radius: 20px; overflow: hidden; background: linear-gradient(135deg, #0d0d0d 0%, #1a1a1c 55%, #111113 100%); border: 1px solid var(--border-default); box-shadow: 0 8px 40px rgba(0,0,0,.3); position: relative; margin: 0 auto 2rem; max-width: 800px; min-height: 172px; }
.banner-gold { position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: var(--accent); z-index: 2; }
.banner-inner { position: relative; height: 172px; overflow: hidden; }
.banner-slide { position: absolute; inset: 0; display: flex; align-items: center; padding: 0 90px 0 24px; gap: 16px; opacity: 0; transform: translateY(8px); transition: opacity .45s cubic-bezier(.4,0,.2,1), transform .45s cubic-bezier(.4,0,.2,1); color: white; pointer-events: none; min-width: 0; overflow: hidden; }
.banner-slide.active { opacity: 1; transform: translateY(0); pointer-events: auto; }
.banner-emoji { font-size: 32px; flex-shrink: 0; line-height: 1; }
.banner-txt-wrap { flex: 1; min-width: 0; overflow: hidden; }
.banner-txt { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: rgba(255,255,255,.92); font-size: 18px; font-weight: 600; }
.banner-txt strong { font-weight: 800; color: #fff; }
.banner-txt-sub { display: block; font-size: 14px; color: rgba(255,255,255,.6); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin-top: 4px; }
.banner-ad-logo { width: 64px; height: 64px; border-radius: 16px; object-fit: contain; background: rgba(255,255,255,.08); flex-shrink: 0; }
.banner-ad-logo-wide { max-width: 160px; height: 64px; border-radius: 16px; object-fit: contain; background: rgba(255,255,255,.08); flex-shrink: 0; }
.banner-ad-cta { font-size: 12px; font-weight: 800; color: var(--accent); background: var(--accent-dim); padding: 4px 12px; border-radius: 999px; flex-shrink: 0; border: 1px solid var(--accent-border); white-space: nowrap; }
.banner-ad { display: flex; align-items: center; gap: 16px; width: 100%; min-width: 0; text-decoration: none; color: white; overflow: hidden; }
.banner-dots { position: absolute; right: 50px; bottom: 14px; display: flex; gap: 6px; z-index: 3; }
.bdot { width: 6px; height: 6px; border-radius: 50%; background: rgba(255,255,255,.25); cursor: pointer; transition: all .3s ease; }
.bdot.active { background: var(--accent); transform: scale(1.35); }
.banner-ad-video { max-width: 140px; height: 100px; border-radius: 16px; object-fit: cover; flex-shrink: 0; background: #000; }

/* --- Stadium LED Ticker --- */
.stadium-ticker { width: 100%; overflow: hidden; position: relative; background: linear-gradient(90deg, #0a0a0b 0%, #111113 50%, #0a0a0b 100%); border: 1px solid var(--accent-border); border-radius: 14px; margin-bottom: 1rem; min-height: 48px; display: none; }
.stadium-ticker.has-items { display: block; }
.stadium-ticker::before, .stadium-ticker::after { content: ''; position: absolute; top: 0; bottom: 0; width: 60px; z-index: 2; pointer-events: none; }
.stadium-ticker::before { left: 0; background: linear-gradient(90deg, #0a0a0b, transparent); }
.stadium-ticker::after { right: 0; background: linear-gradient(270deg, #0a0a0b, transparent); }
.stadium-ticker-label { position: absolute; left: 0; top: 0; bottom: 0; width: 36px; background: var(--accent); display: flex; align-items: center; justify-content: center; z-index: 3; border-radius: 14px 0 0 14px; }
.stadium-ticker-label svg { width: 16px; height: 16px; }
.stadium-ticker-track { display: flex; align-items: center; height: 48px; padding-left: 44px; white-space: nowrap; animation: tickerScroll var(--ticker-duration, 30s) linear infinite; }
.stadium-ticker:hover .stadium-ticker-track { animation-play-state: paused; }
.stadium-ticker-item { display: inline-flex; align-items: center; gap: 8px; padding: 0 24px; flex-shrink: 0; cursor: pointer; transition: opacity .2s; }
.stadium-ticker-item:hover { opacity: .8; }
.stadium-ticker-item img { width: 28px; height: 28px; border-radius: 6px; object-fit: contain; }
.stadium-ticker-item .ticker-emoji { font-size: 20px; }
.stadium-ticker-item .ticker-text { font-size: 13px; font-weight: 700; color: rgba(255,255,255,.9); letter-spacing: .02em; }
.stadium-ticker-item .ticker-sub { font-size: 10px; color: rgba(255,255,255,.4); font-weight: 500; margin-left: 4px; }
.stadium-ticker-sep { display: inline-flex; align-items: center; justify-content: center; width: 6px; height: 6px; border-radius: 50%; background: var(--accent); opacity: .4; flex-shrink: 0; margin: 0 8px; }
@keyframes tickerScroll { 0% { transform: translateX(0); } 100% { transform: translateX(-50%); } }

/* --- Sponsor Cards (Sidebar) --- */
.sponsor-card-premium { background: linear-gradient(135deg, rgba(124,255,0,0.08) 0%, rgba(124,255,0,0.02) 100%); border: 1px solid rgba(124,255,0,0.25); border-radius: 16px; padding: 16px; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 8px; transition: all .3s; position: relative; overflow: hidden; cursor: pointer; }
.sponsor-card-premium::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px; background: linear-gradient(90deg, transparent, var(--accent), transparent); }
.sponsor-card-premium:hover { border-color: var(--accent); transform: translateY(-2px); box-shadow: 0 8px 24px rgba(124,255,0,0.1); }
.sponsor-card-premium img { width: 40px; height: 40px; border-radius: 10px; object-fit: contain; }
.sponsor-card-premium .sp-emoji { font-size: 28px; }
.sponsor-card-premium .sp-name { font-size: 14px; font-weight: 800; color: #f4f4f5; letter-spacing: -.01em; }
.sponsor-card-premium .sp-role { font-size: 9px; font-weight: 700; color: var(--accent); text-transform: uppercase; letter-spacing: .08em; }
.sponsor-card-premium .sp-url { font-size: 9px; color: rgba(255,255,255,.3); font-weight: 500; }

/* --- Ad Cards --- */
.ad-card { border: 1px solid var(--border-default); border-radius: 12px; padding: 12px; margin-bottom: 8px; background: var(--bg-panel); display: flex; align-items: center; gap: 10px; }
.ad-card-logo { width: 40px; height: 40px; border-radius: 10px; object-fit: contain; background: var(--bg-input); flex-shrink: 0; border: 1px solid var(--border-default); }

/* --- Player Edit Zone --- */
#player-edit-zone { position: fixed; inset: 0; z-index: 9998; background: rgba(7,7,8,0.95); display: none; overflow-y: auto; padding: 20px; }
.pe-card { background: var(--bg-panel); border-radius: var(--radius-xl); padding: 24px; max-width: 480px; margin: 40px auto; border: 1px solid var(--border-default); }
.pe-title { font-size: 24px; font-weight: 900; color: var(--text-primary); margin-bottom: 6px; }
.pe-subtitle { font-size: 13px; color: var(--text-muted); }
.pe-media-zone { width: 100%; aspect-ratio: 1; border-radius: 20px; background: var(--bg-input); border: 2px dashed var(--border-default); display: flex; align-items: center; justify-content: center; cursor: pointer; overflow: hidden; transition: all .3s ease; margin-bottom: 16px; position: relative; }
.pe-media-zone:hover { border-color: var(--accent); background: var(--accent-dim); }
.pe-media-zone img, .pe-media-zone video { width: 100%; height: 100%; object-fit: cover; border-radius: 20px; }
.pe-media-placeholder { display: flex; flex-direction: column; align-items: center; gap: 8px; color: var(--text-muted); }
.pe-media-badge { position: absolute; top: 10px; right: 10px; background: rgba(0,0,0,.6); backdrop-filter: blur(4px); padding: 4px 10px; border-radius: 999px; font-size: 10px; font-weight: 700; color: white; display: none; }
.pe-media-badge.show { display: block; }
.pe-form { display: grid; gap: 14px; }
.pe-label { font-size: 11px; font-weight: 700; color: #d4d4d8 !important; text-transform: uppercase; letter-spacing: .06em; margin-bottom: 4px; display: block; }
.pe-input { width: 100%; border: 1px solid var(--border-default); border-radius: 10px; padding: 10px 12px; color: #e4e4e7; font-size: 14px; outline: none; transition: border-color .2s; background: var(--bg-input); }
.pe-input:focus { border-color: var(--accent); }
.pe-select { width: 100%; border: 1px solid var(--border-default); border-radius: 10px; padding: 10px 12px; color: #e4e4e7; font-size: 14px; outline: none; cursor: pointer; appearance: none; background: var(--bg-input); }
.pe-select:focus { border-color: var(--accent); }
.pe-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.pe-progress { height: 6px; background: var(--border-default); border-radius: 999px; overflow: hidden; }
.pe-progress-fill { height: 100%; border-radius: 999px; background: var(--accent); width: 0%; transition: width .3s; }
.pe-video-indicator { position: absolute; bottom: 10px; left: 10px; background: rgba(0,0,0,.6); backdrop-filter: blur(4px); padding: 4px 10px; border-radius: 999px; font-size: 10px; font-weight: 700; color: white; display: none; align-items: center; gap: 4px; }
.pe-video-indicator.show { display: flex; }
.pe-btn-row { display: flex; gap: 10px; }
.pe-btn { flex: 1; padding: 12px; border-radius: 12px; font-weight: 700; font-size: 14px; border: none; cursor: pointer; display: flex; align-items: center; justify-content: center; gap: 8px; transition: all .2s; }
.pe-btn-cancel { background: var(--bg-hover); color: var(--text-secondary); border: 1px solid var(--border-default); }
.pe-btn-cancel:hover { background: var(--border-default); }
.pe-btn-save { background: var(--accent); color: black; }
.pe-btn-save:hover { background: var(--accent-hover); }

/* --- Dark Panel (Modals) --- */
.dark-panel { background: var(--bg-panel) !important; border: 1px solid var(--border-default) !important; border-radius: 20px !important; padding: 20px; }

/* ===== CARD STYLES (unified rounded) ===== */
.bg-\[\#111113\],
[class*="bg-[#111113]"] { border-radius: 16px !important; }

/* ===== CONTRAST FIXES ===== */
.text-zinc-400, .text-gray-400 { color: var(--text-secondary) !important; }
.text-zinc-500, .text-gray-500 { color: var(--text-muted) !important; }
label { color: #d4d4d8 !important; }
.btn-hdr { color: #d4d4d8 !important; border-color: var(--border-default) !important; }
.btn-hdr:hover { color: var(--accent) !important; border-color: var(--accent) !important; }
.ghost-btn { color: #d4d4d8 !important; border-color: var(--border-default) !important; }
.ghost-btn:hover { color: var(--accent) !important; border-color: var(--accent-border) !important; }
.danger-btn { color: #ff6961 !important; border-color: rgba(255,69,58,0.3) !important; }
.sp { color: #d4d4d8 !important; }
.sp.w { color: var(--green-ok) !important; }
.sp.l { color: #ff6961 !important; }
.bteam { color: #e4e4e7 !important; }
.bscore { color: #e4e4e7 !important; }
.cal-cell { color: #d4d4d8 !important; }
.cal-cell.active { color: var(--accent) !important; }
select option { background: var(--bg-panel) !important; color: #e4e4e7 !important; }
input[type="date"]::-webkit-calendar-picker-indicator { filter: invert(1); }

/* Dashboard tabs */
#v-dash .grid.grid-cols-4 button, #v-dash [data-action="showTab"] {
  border: 1px solid var(--border-default); color: var(--text-muted);
  background: var(--bg-input); border-radius: 12px; transition: all .25s ease;
}
#v-dash .grid.grid-cols-4 button:hover, #v-dash [data-action="showTab"]:hover {
  color: var(--text-primary); border-color: var(--border-default); background: var(--bg-hover);
}

/* Modal overlays */
[id^="m-"][style*="bg-black"] { backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); }

/* ===== INPUT STYLING (unified rounded) ===== */
input[type="text"],
input[type="url"],
input[type="number"],
input[type="date"],
select {
  border-radius: 10px !important;
}

/* ===== LED TICKER GLOW EFFECTS ===== */
.led-ticker {
  height: 36px !important;
  border-radius: 0 !important;
  border-left: none !important;
  border-right: none !important;
  background: var(--bg-panel) !important;
  position: relative;
  overflow: hidden;
}
.led-ticker::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--accent), transparent);
  opacity: 0.4;
}
.led-ticker::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--accent), transparent);
  opacity: 0.4;
}
.led-ticker .ticker-item {
  text-shadow: 0 0 8px var(--accent-border);
  font-weight: 500;
}
.led-ticker .neon {
  text-shadow: 0 0 12px var(--accent-border), 0 0 24px rgba(124,255,0,0.1);
}
.led-anchor {
  text-shadow: 0 0 8px var(--accent-border);
}
.led-ticker-top {
  margin-bottom: 8px;
}
.led-ticker-bottom {
  margin-top: 8px;
}

/* ===== DASHBOARD FULLSCREEN MODE ===== */
.dash-top-strip {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 4px 8px;
  margin-bottom: 8px;
}
.dash-fs-btn {
  background: var(--bg-input);
  border: 1px solid var(--border-default);
  color: var(--text-muted);
  width: 32px;
  height: 32px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all .2s;
  flex-shrink: 0;
  padding: 0;
  min-height: unset;
}
.dash-fs-btn:hover {
  color: var(--accent);
  border-color: var(--accent);
  background: var(--accent-dim);
}
.dash-fs-close {
  position: fixed;
  top: 12px;
  right: 12px;
  z-index: 9990;
  background: var(--bg-panel);
  border: 1px solid var(--border-default);
  color: var(--text-secondary);
  width: 36px;
  height: 36px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all .2s;
  box-shadow: 0 4px 16px rgba(0,0,0,.4);
  padding: 0;
  min-height: unset;
}
.dash-fs-close:hover {
  color: #ff6961;
  border-color: #ff6961;
  background: rgba(255,69,58,0.08);
}
.dash-tour-banner-mini {
  flex: 1;
  min-width: 0;
  font-size: 11px;
  font-weight: 700;
  color: var(--text-primary);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  padding: 4px 12px;
  background: var(--accent-dim);
  border: 1px solid var(--accent-border);
  border-radius: 8px;
  letter-spacing: 0.03em;
}

/* Fullscreen active state */
body.dash-fullscreen #main-header {
  display: none !important;
}
body.dash-fullscreen #v-dash {
  position: fixed;
  inset: 0;
  z-index: 9980;
  background: var(--bg-darkest);
  overflow-y: auto;
  padding: 0;
}
body.dash-fullscreen main {
  padding: 0 !important;
  max-width: 100% !important;
}
body.dash-fullscreen .dash-fs-btn {
  display: none;
}
body.dash-fullscreen .dash-fs-close {
  display: flex !important;
}
body.dash-fullscreen nav {
  display: none !important;
}

/* ═══ FULLSCREEN PRESENTATION MODE ═══ */
body.dash-fullscreen {
  overflow: hidden !important;
}
body.dash-fullscreen #main-header {
  display: none !important;
}
body.dash-fullscreen nav {
  display: none !important;
}
body.dash-fullscreen main {
  padding: 0 !important;
  margin: 0 !important;
  max-width: 100% !important;
  height: 100vh !important;
  overflow: hidden !important;
}
body.dash-fullscreen #v-dash {
  height: 100vh !important;
  max-height: 100vh !important;
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
  padding: 0 !important;
}
/* Top LED ticker: fixed at top, always visible */
body.dash-fullscreen .led-ticker-top {
  flex-shrink: 0 !important;
  position: relative !important;
  z-index: 10 !important;
  border-radius: 0 !important;
  margin: 0 !important;
}
/* Bottom LED ticker: fixed at bottom, always visible */
body.dash-fullscreen .led-ticker-bottom {
  flex-shrink: 0 !important;
  position: relative !important;
  z-index: 10 !important;
  border-radius: 0 !important;
  margin: 0 !important;
}
/* Main grid: fill remaining space between tickers */
body.dash-fullscreen #dash-grid {
  flex: 1 !important;
  overflow: hidden !important;
  min-height: 0 !important;
  gap: 8px !important;
  padding: 8px !important;
}
/* Banner: visible and prominent in fullscreen */
body.dash-fullscreen #tour-banner {
  display: block !important;
  min-height: 80px !important;
  max-height: 120px !important;
  margin-bottom: 4px !important;
  border-radius: 10px !important;
  flex-shrink: 0 !important;
}
/* Stadium ticker: visible in fullscreen */
body.dash-fullscreen .stadium-ticker {
  display: block !important;
  flex-shrink: 0 !important;
  border-radius: 0 !important;
  margin: 0 !important;
}
/* Center content: takes most space, scrollable internally */
body.dash-fullscreen .lg\:col-span-6 {
  overflow-y: auto !important;
  min-height: 0 !important;
}
/* Side panels: compact in fullscreen */
body.dash-fullscreen .lg\:col-span-3 {
  overflow-y: auto !important;
  min-height: 0 !important;
  max-height: none !important;
}
/* FS close button */
body.dash-fullscreen .dash-fs-close {
  display: flex !important;
  position: fixed !important;
  top: 12px !important;
  right: 12px !important;
  z-index: 9999 !important;
  width: 36px !important;
  height: 36px !important;
  border-radius: 50% !important;
  background: rgba(0,0,0,0.6) !important;
  border: 1px solid var(--border-default) !important;
  color: white !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  backdrop-filter: blur(8px) !important;
}
body.dash-fullscreen .dash-fs-btn {
  display: none !important;
}
body.dash-fullscreen .dash-top-strip {
  position: relative !important;
  z-index: 5 !important;
  flex-shrink: 0 !important;
}
/* Hide ad management button in public fullscreen */
body.dash-fullscreen .dash-ad-admin {
  display: none !important;
}
/* Visual hierarchy: score area prominence */
body.dash-fullscreen .bmatch {
  box-shadow: 0 2px 8px rgba(0,0,0,0.3) !important;
}
body.dash-fullscreen .bmatch.final {
  border-width: 2px !important;
  box-shadow: 0 0 20px rgba(var(--accent-rgb, 124,255,0), 0.3) !important;
}
/* Heat map visual indicators for match priority */
body.dash-fullscreen .mcard[data-priority="high"] {
  border-left: 3px solid #ef4444 !important;
}
body.dash-fullscreen .mcard[data-priority="medium"] {
  border-left: 3px solid #f59e0b !important;
}
body.dash-fullscreen .mcard[data-priority="low"] {
  border-left: 3px solid #22c55e !important;
}
/* Ocular tracking: progressive reveal animation for matches */
body.dash-fullscreen .mcard {
  animation: fsCardReveal 0.3s ease-out both !important;
}
@keyframes fsCardReveal {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: translateY(0); }
}
/* Stagger animation for visual tracking */
body.dash-fullscreen .mcard:nth-child(1) { animation-delay: 0.05s !important; }
body.dash-fullscreen .mcard:nth-child(2) { animation-delay: 0.1s !important; }
body.dash-fullscreen .mcard:nth-child(3) { animation-delay: 0.15s !important; }
body.dash-fullscreen .mcard:nth-child(4) { animation-delay: 0.2s !important; }
body.dash-fullscreen .mcard:nth-child(5) { animation-delay: 0.25s !important; }
body.dash-fullscreen .mcard:nth-child(6) { animation-delay: 0.3s !important; }
body.dash-fullscreen .mcard:nth-child(7) { animation-delay: 0.35s !important; }
body.dash-fullscreen .mcard:nth-child(8) { animation-delay: 0.4s !important; }
/* Sponsor slots: more prominent in fullscreen */
body.dash-fullscreen .sponsor-slot {
  padding: 8px !important;
  border-width: 1px !important;
}
body.dash-fullscreen .ad-slot {
  min-height: 60px !important;
}
/* No print elements hidden */
body.dash-fullscreen .no-print {
  /* Keep functional no-print elements but hide admin-only ones */
}
/* Tab navigation: compact */
body.dash-fullscreen #v-dash .grid.grid-cols-4.gap-2.mb-4 {
  flex-shrink: 0 !important;
  margin-bottom: 4px !important;
}
/* Stats row: compact */
body.dash-fullscreen .grid.grid-cols-4.gap-2.mb-4:not([id]) {
  gap: 4px !important;
  margin-bottom: 4px !important;
}
body.dash-fullscreen .grid.grid-cols-4.gap-2.mb-4 .bg-\[\#0a0a0b\] {
  padding: 6px !important;
}
body.dash-fullscreen .grid.grid-cols-4.gap-2.mb-4 .text-2xl {
  font-size: 18px !important;
}

/* ===== PRINT ===== */
@media print {
  .no-print,nav,#main-header,.ticker-bar,#toast,footer,#mesh-bg,#splash,#gen-loader,#champ,#confetti,button[data-action="printWindow"],button[data-action="openShare"],.btn-hdr,.ghost-btn,#tour-banner,.banner-dots,.ico,.ticker-anchor-left,.ticker-anchor-right,.dash-ad-admin{display:none!important}
  body{background:white!important;color:black!important;font-size:12pt}
  main{padding:0!important}
  .bwrap{background:white!important;border:1px solid #ddd!important}
  .bmatch{background:white!important;border:1px solid #999!important}
  .bteam{color:black!important;border-bottom-color:#ccc!important}
  .bscore{background:#eee!important;color:black!important}
  .bteam.winner .bscore{background:#d4edda!important;color:#155724!important}
  .bteam.winner{background:#f0fff4!important;color:#155724!important}
  .bcol-title{color:#333!important}
  .ltable th{background:#f5f5f5!important;color:#333!important;border-bottom-color:#999!important}
  .ltable td{color:black!important;border-bottom-color:#ddd!important}
  .ltable tr:hover td{background:transparent!important}
  .ltable tr.highlight td{border-left-color:#155724!important;background:#f0fff4!important}
  .dark-panel{background:white!important;border:1px solid #ddd!important}
  .cfg-card{border:1px solid #ddd!important}
  .mcard{background:white!important;border-left-color:#333!important}
  .sp{background:#eee!important;color:black!important}
  .sp.w{background:#d4edda!important;color:#155724!important}
  .sp.l{background:#f8d7da!important;color:#721c24!important}
  .brow{gap:16px}.bcol{min-width:150px}
  .neon-badge,.neon-btn{background:#333!important;color:white!important;box-shadow:none!important}
  .format-dot{background:#999!important}
}

/* ===== DASHBOARD RESPONSIVE GRID (NO SCROLL) ===== */
/* Main 3-column grid that fills viewport height */
.dash-grid {
  display: grid;
  grid-template-columns: 220px 1fr 220px;
  grid-template-rows: 1fr;
  gap: 8px;
  height: calc(100vh - 130px); /* minus header + top ticker + bottom ticker */
  min-height: 400px;
  overflow: hidden;
}

/* Sidebars */
.dash-sidebar-left, .dash-sidebar-right {
  display: flex;
  flex-direction: column;
  gap: 6px;
  overflow-y: auto;
  overflow-x: hidden;
  scrollbar-width: thin;
  scrollbar-color: var(--border-default) transparent;
  min-width: 0;
}

/* Main center column */
.dash-main {
  display: flex;
  flex-direction: column;
  min-height: 0;
  overflow: hidden;
}

/* Dashboard cards */
.dash-card {
  background: var(--bg-card, #111113);
  border: 1px solid var(--border-default);
  border-radius: 12px;
  padding: 10px;
  flex-shrink: 0;
}
.dash-card-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 8px;
}
.dash-label {
  font-size: 9px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--text-muted);
}
.dash-count {
  font-size: 8px;
  font-weight: 700;
  background: var(--bg-input);
  color: var(--text-muted);
  padding: 1px 5px;
  border-radius: 4px;
  font-family: monospace;
}

/* Sponsor grid */
.dash-sponsor-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
}

/* Ad grid */
.dash-ad-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 6px;
}

/* Admin button */
.dash-admin-btn {
  width: 100%;
  padding: 6px;
  font-size: 10px;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  background: var(--bg-input);
  border: 1px solid var(--border-default);
  border-radius: 8px;
  color: var(--text-muted);
  cursor: pointer;
  transition: all .2s;
}
.dash-admin-btn:hover { border-color: var(--accent); color: var(--accent); }

/* Header row (compact, one line) */
.dash-header-row {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 6px 8px;
  background: var(--bg-card, #111113);
  border: 1px solid var(--border-default);
  border-radius: 10px;
  flex-shrink: 0;
  margin-bottom: 6px;
}

.dash-back-btn {
  width: 28px;
  height: 28px;
  border-radius: 8px;
  background: var(--bg-input);
  border: 1px solid var(--border-default);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  color: var(--text-secondary);
  flex-shrink: 0;
  transition: all .15s;
}
.dash-back-btn:hover { border-color: var(--accent); color: var(--accent); }

.dash-progress-wrap {
  flex: 1;
  min-width: 80px;
}
.dash-info-text {
  display: block;
  font-size: 10px;
  font-weight: 600;
  color: var(--text-dim);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  margin-bottom: 2px;
}
.dash-progress-bar {
  height: 4px;
  border-radius: 4px;
  background: var(--border-default);
  overflow: hidden;
}
.dash-progress-fill {
  height: 100%;
  border-radius: 4px;
  background: var(--accent);
  transition: width .7s ease;
}
.dash-progress-labels {
  display: flex;
  justify-content: space-between;
  font-size: 8px;
  color: var(--text-muted);
  font-weight: 600;
  margin-top: 1px;
}

/* Stat pills */
.dash-stat-pill {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 4px 8px;
  border-radius: 8px;
  background: var(--bg-input);
  border: 1px solid var(--border-subtle);
  flex-shrink: 0;
}
.dash-stat-val {
  font-size: 14px;
  font-weight: 900;
  line-height: 1;
  color: var(--text-primary);
  font-family: var(--font-mono);
}
.dash-stat-key {
  font-size: 7px;
  font-weight: 700;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: .05em;
  margin-top: 1px;
}
.dash-stat-green .dash-stat-val { color: #22c55e; }
.dash-stat-orange .dash-stat-val { color: #f97316; }
.dash-stat-gold .dash-stat-val { color: #fbbf24; }

/* Auth views */
.club-card {
  background: #111113;
  border: 1px solid #27272a;
  border-radius: 14px;
  padding: 16px 18px;
  transition: border-color .2s, background .2s;
}
.club-card:hover {
  border-color: rgba(124,255,0,0.3);
  background: rgba(124,255,0,0.03);
}

/* Header actions */
.dash-header-actions {
  display: flex;
  gap: 4px;
  flex-shrink: 0;
}
.dash-icon-btn {
  width: 28px;
  height: 28px;
  border-radius: 8px;
  background: var(--bg-input);
  border: 1px solid var(--border-default);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  color: var(--text-secondary);
  transition: all .15s;
}
.dash-icon-btn:hover { border-color: var(--accent); color: var(--accent); }

/* Banner compact */
.dash-banner {
  border-radius: 10px !important;
  min-height: 80px !important;
  margin-bottom: 6px !important;
  flex-shrink: 0;
  border: 1px solid var(--border-default) !important;
  box-shadow: 0 4px 20px rgba(0,0,0,.2) !important;
}
.dash-banner .banner-inner { height: 80px !important; }
.dash-banner .banner-slide { padding: 0 40px 0 16px !important; gap: 10px !important; }
.dash-banner .banner-emoji { font-size: 22px !important; }
.dash-banner .banner-txt { font-size: 14px !important; }
.dash-banner .banner-txt-sub { font-size: 10px !important; }
.dash-banner .banner-ad-logo { width: 40px !important; height: 40px !important; border-radius: 8px !important; }

/* Tabs */
.dash-tabs {
  display: flex;
  gap: 4px;
  margin-bottom: 6px;
  flex-shrink: 0;
}
.dash-tab {
  flex: 1;
  padding: 6px 4px;
  font-size: 10px;
  font-weight: 700;
  font-family: var(--font-mono);
  text-transform: uppercase;
  letter-spacing: .06em;
  border-radius: 8px;
  border: 1px solid var(--border-default);
  background: transparent;
  color: var(--text-muted);
  cursor: pointer;
  transition: all .2s;
}
.dash-tab:hover { color: var(--text-secondary); border-color: var(--text-muted); }
.dash-tab.active {
  background: var(--accent-dim);
  color: var(--accent);
  border-color: var(--accent-border);
}

/* Content area (scrolls internally) */
.dash-content {
  flex: 1;
  overflow-y: auto;
  overflow-x: hidden;
  min-height: 0;
  scrollbar-width: thin;
  scrollbar-color: var(--border-default) transparent;
}

/* Bracket auto-fit */
.bracket-container {
  background: var(--bg-input);
  border-radius: 12px;
  overflow: hidden;
}
.bwrap { overflow-x: auto; padding: 12px; }
.brow { display: flex; gap: 20px; min-width: max-content; }
.bcol { display: flex; flex-direction: column; min-width: 160px; }
.bcol-title { text-align: center; font-weight: 700; font-size: 10px; text-transform: uppercase; letter-spacing: .08em; color: var(--text-muted); margin-bottom: 8px; }
.bmatch { background: var(--bg-panel); border: 1px solid var(--border-default); border-radius: 8px; margin: 5px 0; overflow: hidden; cursor: pointer; transition: transform .15s, border-color .15s; }
.bmatch:hover { transform: scale(1.02); border-color: var(--text-muted); }
.bmatch.done { border-color: var(--green-ok); }
.bmatch.final { border: 2px solid var(--gold); }
.bteam { display: flex; justify-content: space-between; align-items: center; padding: 6px 10px; font-size: 12px; color: #e4e4e7; }
.bteam:first-child { border-bottom: 1px solid var(--border-subtle); }
.bteam.winner { background: rgba(48,209,88,0.06); font-weight: 700; color: var(--green-ok); }
.bteam.loser { color: var(--text-muted); }
.bscore { font-weight: 800; font-family: var(--font-mono); background: var(--bg-input); padding: 2px 6px; border-radius: 6px; min-width: 26px; text-align: center; font-size: 11px; color: #e4e4e7; }
.bteam.winner .bscore { background: var(--green-ok); color: white; }

/* Standings */
.standings-container { overflow-x: auto; }
.ltable { width: 100%; border-collapse: collapse; font-size: 11px; }
.ltable th { padding: 6px 6px; font-size: 9px; font-weight: 700; text-transform: uppercase; color: var(--text-muted); border-bottom: 1px solid var(--border-default); text-align: center; white-space: nowrap; }
.ltable td { padding: 5px 6px; text-align: center; border-bottom: 1px solid var(--border-subtle); white-space: nowrap; }
.ltable td:first-child { text-align: left; }

/* Stats grid */
.stats-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.stats-card { background: var(--bg-input); border: 1px solid var(--border-default); border-radius: 10px; padding: 10px; }
.stats-title { font-size: 10px; font-weight: 700; color: var(--text-muted); text-transform: uppercase; letter-spacing: .06em; margin-bottom: 8px; }

/* Right sidebar - Upcoming matches */
.dash-upcoming-list {
  font-size: 10px;
  max-height: 200px;
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: var(--border-default) transparent;
}
.dash-empty { text-align: center; color: var(--text-muted); padding: 10px; font-size: 10px; }

/* Quick stats */
.dash-qs-grid { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 4px; }
.dash-qs-item { text-align: center; background: var(--bg-input); border-radius: 6px; padding: 6px 4px; }
.dash-qs-key { display: block; font-size: 7px; font-weight: 700; color: var(--text-muted); text-transform: uppercase; letter-spacing: .05em; }
.dash-qs-val { display: block; font-size: 13px; font-weight: 900; color: var(--text-primary); font-family: var(--font-mono); }
.dash-qs-accent { color: var(--accent) !important; }

/* Spotlight */
.dash-spotlight-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.dash-spot-item { text-align: center; background: var(--bg-input); border-radius: 8px; padding: 8px 4px; border-left: 2px solid var(--accent); }
.dash-spot-avatar { width: 32px; height: 32px; border-radius: 50%; background: var(--border-default); margin: 0 auto 4px; display: flex; align-items: center; justify-content: center; font-size: 10px; font-weight: 800; color: var(--text-primary); }
.dash-spot-name { display: block; font-size: 9px; font-weight: 700; color: var(--text-primary); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dash-spot-role { display: block; font-size: 7px; color: var(--accent); font-weight: 700; text-transform: uppercase; }

/* Print button */
.dash-print-btn {
  width: 100%;
  padding: 8px;
  font-size: 10px;
  font-weight: 800;
  font-family: var(--font-mono);
  text-transform: uppercase;
  letter-spacing: .06em;
  background: var(--accent);
  color: black;
  border: none;
  border-radius: 8px;
  cursor: pointer;
  transition: all .2s;
}
.dash-print-btn:hover { background: var(--accent-hover, #fff); }

/* ===== TABLET ===== */
@media (max-width: 1024px) {
  /* Dashboard: 2-column layout on tablet */
  .dash-grid {
    grid-template-columns: 180px 1fr;
    height: calc(100vh - 120px);
  }
  .dash-sidebar-right { display: none; }
  .dash-sidebar-left { max-height: calc(100vh - 120px); }
  .splash-svg-wrap{max-width:220px!important;max-height:220px!important}
  /* Tablet: banner less padding */
  .dash-banner .banner-slide{padding:0 40px 0 16px!important}
  .dash-banner .banner-inner{height:70px!important}
  .bwrap{max-width:100%!important;overflow-x:auto!important}
}

/* ===== MOBILE ===== */
@media (max-width: 640px) {
  body{padding:0!important}
  main{padding:8px 4px 70px!important;width:100%!important;max-width:100vw!important;overflow-x:hidden!important;box-sizing:border-box!important}
  #v-dash{width:100%!important;max-width:100%!important;overflow-x:hidden!important}
  #hdr-body .max-w-7xl{padding-left:8px!important;padding-right:8px!important}
  header .flex.items-center.gap-2{flex-wrap:wrap;gap:4px!important}
  .btn-hdr span{display:none!important}

  /* Mobile Dashboard: single column, fills viewport */
  .dash-grid {
    grid-template-columns: 1fr;
    height: calc(100vh - 110px);
    gap: 4px;
  }
  .dash-sidebar-left { display: none; }
  .dash-sidebar-right { display: none; }
  .dash-header-row { flex-wrap: wrap; gap: 4px; padding: 4px 6px; }
  .dash-stat-pill { padding: 3px 5px; }
  .dash-stat-val { font-size: 12px; }
  .dash-stat-key { font-size: 6px; }
  .dash-tabs { gap: 3px; }
  .dash-tab { font-size: 9px; padding: 5px 2px; }
  .dash-banner { min-height: 60px !important; }
  .dash-banner .banner-inner { height: 60px !important; }
  .dash-banner .banner-slide { padding: 0 20px 0 10px !important; gap: 6px !important; }
  .dash-banner .banner-emoji { font-size: 18px !important; }
  .dash-banner .banner-txt { font-size: 12px !important; }
  .dash-banner .banner-ad-logo { width: 30px !important; height: 30px !important; }
  .stadium-ticker { min-height: 32px !important; border-radius: 8px !important; margin-bottom: 4px !important; }
  .stadium-ticker-track { height: 32px !important; padding-left: 32px !important; }
  .stadium-ticker-label { width: 24px !important; border-radius: 8px 0 0 8px !important; }
  .stadium-ticker-item .ticker-text { font-size: 10px !important; }
  .stadium-ticker-item .ticker-emoji { font-size: 14px !important; }
  .ticker-bar { height: 32px !important; border-radius: 8px !important; margin-top: 4px !important; }
  .bcol { min-width: 130px !important; }
  .bteam { padding: 4px 6px !important; font-size: 10px !important; }
  .bscore { padding: 1px 4px !important; font-size: 9px !important; }
  .bmatch { border-radius: 10px; }
  .mcard { border-radius: 10px; }

  /* Mobile: larger inputs for touch */
  input[type="text"],
  input[type="url"],
  input[type="number"],
  input[type="date"],
  select {
    min-height: 44px;
    font-size: 16px !important;
    padding: 10px 14px !important;
    border-radius: 12px !important;
  }

  /* Mobile: scrollable tab navigation */
  #v-dash .grid.grid-cols-4 {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    -ms-overflow-style: none;
    flex-wrap: nowrap;
    gap: 6px;
  }
  #v-dash .grid.grid-cols-4::-webkit-scrollbar { display: none; }
  #v-dash .grid.grid-cols-4 button {
    white-space: nowrap;
    flex-shrink: 0;
    min-width: auto;
    padding: 10px 14px;
  }

  /* Mobile: touch-friendly bottom nav */
  nav button { min-height: 56px; min-width: 68px; padding: 12px 10px!important; }

  /* Mobile: ad slots stacked */
  #dash-player-cards { grid-template-columns: 1fr !important; }

  /* ===== MOBILE FIXES: Config Section ===== */
  /* Config: force 2-col grids to single column on very small screens */
  #v-config .grid.grid-cols-2 { grid-template-columns: 1fr !important; }
  /* Config: scoring grid-cols-3 → stacked */
  #v-config .grid.grid-cols-3 { grid-template-columns: 1fr 1fr !important; gap: 8px !important; }
  /* Config: scoring points row → 3 cols is fine but tighten */
  #v-config .p-5 { padding: 16px !important; }

  /* ===== MOBILE FIXES: Ad Config Section ===== */
  /* Ad config: visual map grid-cols-12 → stacked */
  #v-config .grid.grid-cols-12 { grid-template-columns: 1fr !important; }
  #v-config .col-span-3, #v-config .col-span-6, #v-config .col-span-12 { grid-column: span 1 !important; }
  /* Ad config: form grid-cols-2 → stacked */
  .rounded-xl .grid.grid-cols-2 { grid-template-columns: 1fr !important; }
  /* Ad config: emoji + button row */
  .rounded-xl .flex.items-end.gap-2 { flex-direction: column !important; }
  .rounded-xl .flex.items-end.gap-2 .w-20 { width: 100% !important; }

  /* ===== MOBILE FIXES: Dashboard ===== */
  /* Dashboard: stats row 2x2 on mobile instead of 4 across */
  #v-dash .grid.grid-cols-4.gap-2.mb-4 { grid-template-columns: 1fr 1fr !important; }
  /* Dashboard: sponsor cards 1 col on mobile */
  #dash-sponsor-slots { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 8px !important; }
  /* Dashboard: banner slots 2 col on mobile */
  #dash-ad-slots { grid-template-columns: 1fr 1fr !important; gap: 8px !important; }
  /* Dashboard: main grid stacked — force 1fr column */
  #v-dash .grid { grid-template-columns: 1fr !important; }
  /* Dashboard: force ALL lg:col-span elements to full width */
  #v-dash [class*="lg:col-span"] { grid-column: span 1 !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; }
  /* Dashboard: minimize height constraints */
  #v-dash .min-h-\[580px\] { min-height: auto !important; }
  /* Dashboard: ticker bar full width */
  #v-dash .ticker-bar { width: 100% !important; max-width: 100% !important; }
  /* Dashboard: bracket wrap not wider than screen */
  #v-dash .bwrap { max-width: 100% !important; overflow-x: auto !important; }
  /* Dashboard: banner not wider than screen */
  #v-dash #tour-banner { max-width: 100% !important; }
  #v-dash .banner-inner { max-width: 100% !important; }
  /* Dashboard: all cards max-width */
  #v-dash .bg-\[\#111113\], #v-dash .bg-\[\#0a0a0b\] { max-width: 100% !important; min-width: 0 !important; }
  /* Dashboard: CRITICAL - prevent grid blowout from content */
  #v-dash, #v-dash > * { min-width: 0 !important; }
  #v-dash .grid > * { min-width: 0 !important; overflow-wrap: break-word !important; }
  /* Dashboard: prevent flex items from growing beyond container */
  #v-dash .flex-1 { min-width: 0 !important; }
  /* Dashboard: all direct children of v-dash constrained */
  #v-dash > div { max-width: 100% !important; overflow-x: hidden !important; }

  /* ===== MOBILE FIXES: Dashboard Deep Fixes ===== */
  /* Dashboard: Nav row compact — hide share/print text */
  #v-dash .ghost-btn span { display: none !important; }
  /* Dashboard: Progress bar row compact */
  #v-dash .flex.items-center.gap-2.sm\:gap-3 { gap: 6px !important; flex-wrap: wrap !important; }
  /* Dashboard: Stats cards compact text */
  #v-dash .text-2xl.font-black { font-size: 1.25rem !important; }
  #v-dash .text-\\[10px\\] { font-size: 9px !important; }
  /* Dashboard: Tab nav use 2x2 grid on small phones instead of horizontal scroll */
  #v-dash .grid.grid-cols-2.sm\:grid-cols-4 { grid-template-columns: 1fr 1fr !important; }
  /* Dashboard: Stadium ticker compact on mobile */
  .stadium-ticker { border-radius: 10px !important; min-height: 38px !important; margin-bottom: 0.5rem !important; }
  .stadium-ticker-track { height: 38px !important; padding-left: 36px !important; }
  .stadium-ticker-item .ticker-text { font-size: 11px !important; }
  .stadium-ticker-item .ticker-emoji { font-size: 16px !important; }
  .stadium-ticker-label { width: 28px !important; border-radius: 10px 0 0 10px !important; }
  .stadium-ticker-label svg { width: 12px !important; height: 12px !important; }
  /* Dashboard: Banner compact on mobile */
  #tour-banner { border-radius: 12px !important; min-height: 100px !important; margin: 0 auto 1rem !important; }
  .banner-inner { height: 100px !important; }
  .banner-slide { padding: 0 20px 0 12px !important; gap: 8px !important; }
  .banner-emoji { font-size: 22px !important; }
  .banner-txt { font-size: 14px !important; }
  .banner-txt-sub { font-size: 11px !important; }
  .banner-ad-logo { width: 40px !important; height: 40px !important; border-radius: 10px !important; }
  .banner-dots { right: 24px !important; bottom: 8px !important; }
  .banner-ad-video { max-width: 80px !important; height: 60px !important; border-radius: 8px !important; }
  #banner-ad-btn { top: 6px !important; right: 6px !important; font-size: 14px !important; padding: 3px 6px !important; border-radius: 6px !important; }
  /* Dashboard: Sponsor cards compact on mobile */
  .sponsor-card-premium { padding: 10px !important; border-radius: 10px !important; }
  .sponsor-card-premium .sp-emoji { font-size: 20px !important; }
  .sponsor-card-premium .sp-name { font-size: 12px !important; }
  .sponsor-card-premium .sp-role { font-size: 8px !important; }
  /* Dashboard: Player edit zone full mobile */
  #player-edit-zone { padding: 10px !important; }
  .pe-card { margin: 10px auto !important; padding: 16px !important; border-radius: 16px !important; }
  .pe-grid { grid-template-columns: 1fr !important; gap: 10px !important; }
  .pe-media-zone { aspect-ratio: 4/3 !important; border-radius: 12px !important; }
  /* Dashboard: bracket compact on mobile */
  .bwrap { padding: 8px !important; border-radius: 10px !important; }
  .bcol { min-width: 140px !important; }
  .bmatch { margin: 4px 0 !important; border-radius: 8px !important; }
  .bteam { padding: 6px 8px !important; font-size: 11px !important; }
  .bscore { padding: 2px 5px !important; font-size: 10px !important; }
  .bcol-title { font-size: 9px !important; margin-bottom: 6px !important; }
  /* Dashboard: Match cards compact */
  .mcard { padding: 10px !important; border-radius: 8px !important; }
  /* Dashboard: Table compact */
  .ltable th { padding: 6px 4px !important; font-size: 9px !important; }
  .ltable td { padding: 6px 4px !important; font-size: 11px !important; }
  /* Dashboard: Right sidebar stats compact */
  #v-dash .grid.grid-cols-3.gap-2 { gap: 4px !important; }
  #v-dash .bg-zinc-950.border.border-zinc-900.p-2\\.5 { padding: 8px !important; }
  /* Dashboard: Upcoming matches compact */
  #upcoming-matches { font-size: 9px !important; }

  /* ===== MOBILE FIXES: Banner ===== */
  .banner-slide { padding: 0 50px 0 16px !important; gap: 10px !important; }
  .banner-inner { height: 120px !important; }
  .banner-emoji { font-size: 24px !important; }
  .banner-txt { font-size: 14px !important; }
  .banner-txt-sub { font-size: 11px !important; }
  .banner-ad-logo { width: 44px !important; height: 44px !important; border-radius: 10px !important; }
  .banner-ad-logo-wide { max-width: 80px !important; height: 44px !important; }
  .banner-ad-video { max-width: 80px !important; height: 56px !important; }
  .banner-ad-cta { font-size: 10px !important; padding: 3px 8px !important; }
  .banner-dots { right: 16px !important; bottom: 8px !important; }
  #tour-banner { min-height: 120px !important; border-radius: 14px !important; margin-bottom: 12px !important; }
  #banner-ad-btn { top: 6px !important; right: 6px !important; font-size: 14px !important; padding: 3px 6px !important; }

  /* ===== MOBILE FIXES: Stadium Ticker ===== */
  .stadium-ticker { border-radius: 10px !important; min-height: 40px !important; margin-bottom: 8px !important; }
  .stadium-ticker-label { width: 28px !important; border-radius: 10px 0 0 10px !important; }
  .stadium-ticker-label svg { width: 12px !important; height: 12px !important; }
  .stadium-ticker-track { height: 40px !important; padding-left: 34px !important; }
  .stadium-ticker-item { padding: 0 12px !important; gap: 6px !important; }
  .stadium-ticker-item .ticker-emoji { font-size: 16px !important; }
  .stadium-ticker-item .ticker-text { font-size: 11px !important; }
  .stadium-ticker-item .ticker-sub { font-size: 8px !important; }
  .stadium-ticker-sep { width: 4px !important; height: 4px !important; margin: 0 4px !important; }

  /* ===== MOBILE FIXES: Ticker Bar (bottom) ===== */
  .ticker-bar { border-radius: 10px !important; height: 40px !important; }
  .ticker-anchor-left { font-size: 8px !important; padding: 3px 8px !important; }
  .ticker-anchor-right { font-size: 9px !important; padding: 3px 8px !important; }
  .ticker-item { font-size: 10px !important; }

  /* ===== MOBILE FIXES: Sponsor Cards ===== */
  .sponsor-card-premium { padding: 10px !important; border-radius: 12px !important; }
  .sponsor-card-premium .sp-emoji { font-size: 22px !important; }
  .sponsor-card-premium .sp-name { font-size: 12px !important; }
  .sponsor-card-premium .sp-role { font-size: 8px !important; }
  .sponsor-card-premium img { width: 32px !important; height: 32px !important; }

  /* ===== MOBILE FIXES: Registration Section ===== */
  #v-register .lg\:col-span-5, #v-register .lg\:col-span-3, #v-register .lg\:col-span-4 { min-height: auto !important; }
  /* Register: action buttons wrap properly */
  #v-register .flex.gap-2.mb-4.flex-wrap { gap: 6px !important; }
  #v-register .flex.gap-2.mb-4.flex-wrap .neon-btn,
  #v-register .flex.gap-2.mb-4.flex-wrap .ghost-btn,
  #v-register .flex.gap-2.mb-4.flex-wrap .danger-btn { flex: 1 1 calc(50% - 6px) !important; min-width: 0 !important; }

  /* ===== MOBILE FIXES: Modals ===== */
  .dark-panel { max-width: 100% !important; }
  /* Modal tab groups: smaller text */
  #m-ads .tab-group button { font-size: 9px !important; padding: 8px 4px !important; }
  #m-ads .tab-group button svg { display: none !important; }

  /* ===== MOBILE FIXES: Bracket ===== */
  .bwrap { padding: 8px !important; border-radius: 12px !important; }
  .brow { gap: 12px !important; }
  .bcol { min-width: 150px !important; }
  .bmatch { border-radius: 10px !important; margin: 4px 0 !important; }
  .bteam { padding: 6px 8px !important; font-size: 11px !important; }
  .bscore { font-size: 10px !important; padding: 2px 5px !important; }

  /* ===== MOBILE FIXES: Player Edit ===== */
  .pe-card { padding: 16px !important; margin: 10px auto !important; }
  .pe-grid { grid-template-columns: 1fr !important; gap: 10px !important; }
  .pe-media-zone { aspect-ratio: 4/3 !important; }

  /* ===== MOBILE FIXES: General ===== */
  /* Hide share/print buttons on mobile to save space */
  #v-dash .ghost-btn.no-print { padding: 6px !important; }
  #v-dash .ghost-btn.no-print span { display: none !important; }
  /* Force all 3-tab groups to scroll horizontally on very small screens */
  .tab-group[style*="repeat(3"] { overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
  .tab-group[style*="repeat(3"]::-webkit-scrollbar { display: none; }
  /* Make sure text doesn't get cut off */
  .truncate, [class*="overflow-hidden"] { min-width: 0 !important; }
}

/* ===== EXTRA SMALL PHONES (<=375px) ===== */
@media (max-width: 375px) {
  main { padding: 8px 6px 80px !important; width: 100% !important; max-width: 100vw !important; overflow-x: hidden !important; }
  #v-dash { overflow-x: hidden !important; }
  /* Config cards tighter */
  #v-config .p-5 { padding: 12px !important; }
  /* Tab buttons even smaller */
  .tab-group button { font-size: 9px !important; padding: 8px 4px !important; }
  /* Dashboard stats: stack to 1 col */
  #v-dash .grid.grid-cols-4.gap-2.mb-4 { grid-template-columns: 1fr 1fr !important; gap: 6px !important; }
  #v-dash .grid.grid-cols-4.gap-2.mb-4 > div { padding: 8px !important; }
  #v-dash .grid.grid-cols-4.gap-2.mb-4 p.text-2xl { font-size: 20px !important; }
  /* Sponsor cards: single col */
  #dash-sponsor-slots { grid-template-columns: 1fr !important; }
  /* Banner even smaller */
  .banner-slide { padding: 0 40px 0 12px !important; }
  .banner-inner { height: 100px !important; }
  .banner-emoji { font-size: 20px !important; }
  .banner-txt { font-size: 12px !important; }
  .banner-txt-sub { font-size: 10px !important; }
  .banner-ad-logo { width: 36px !important; height: 36px !important; }
  .banner-ad-logo-wide { max-width: 60px !important; height: 36px !important; }
  .banner-ad-cta { display: none !important; }
  /* Scoring row: single col on tiny phones */
  #v-config .grid.grid-cols-3 { grid-template-columns: 1fr !important; }
}

/* ===== FULLSCREEN PRESENTATION MODE ===== */
body.fs-mode #main-header,
body.fs-mode nav,
body.fs-mode #mesh-bg { display: none !important; }
body.fs-mode main { padding: 8px !important; max-width: 100% !important; }
body.fs-mode .dash-grid { height: calc(100vh - 16px); }
body.fs-mode .dash-header-row { display: none; }
body.fs-mode .dash-sidebar-left,
body.fs-mode .dash-sidebar-right { max-width: 180px; }
body.fs-mode #tour-banner { min-height: 120px; margin-bottom: 8px; display: block !important; }
body.fs-mode .stadium-ticker { margin-bottom: 8px; }
body.fs-mode #bottom-ticker { display: none; }
body.fs-mode .dash-banner { min-height: 100px !important; }
body.fs-mode .dash-banner .banner-inner { height: 100px !important; }
body.fs-mode .dash-banner .banner-txt { font-size: 16px !important; }
body.fs-mode .dash-banner .banner-emoji { font-size: 28px !important; }
body.fs-mode .sponsor-card-premium { padding: 12px; }
body.fs-mode .sponsor-card-premium .sp-emoji { font-size: 22px; }
body.fs-mode .sponsor-card-premium .sp-name { font-size: 12px; }

/* ===== REMOTE SCORE INDICATOR ===== */
.remote-active {
  box-shadow: 0 0 0 2px var(--accent), 0 0 20px var(--accent-dim) !important;
  animation: remotePulse 2s ease-in-out infinite;
}
@keyframes remotePulse {
  0%, 100% { box-shadow: 0 0 0 2px var(--accent), 0 0 10px var(--accent-dim); }
  50% { box-shadow: 0 0 0 2px var(--accent), 0 0 25px var(--accent); }
}