/* =====================================================================
   Ticopa Hub · rediseño «Marcador» (r17) · 1) Fuentes y colores
   Fuentes alojadas en el propio sitio (fonts/, licencia OFL). No se pide nada a Google.
   Los nombres viejos (Orbitron, Rajdhani, Teko, Oxanium) apuntan a las fuentes nuevas:
   así los estilos escritos dentro del código cambian solos, sin tocar la lógica.
   ===================================================================== */
@font-face { font-family: "Big Shoulders Display"; src: url(../fonts/BigShouldersDisplay-wght.woff) format("woff"); font-weight: 100 900; font-display: swap; }
@font-face { font-family: "Barlow"; src: url(../fonts/Barlow-Regular.woff) format("woff"); font-weight: 400; font-display: swap; }
@font-face { font-family: "Barlow"; src: url(../fonts/Barlow-Medium.woff) format("woff"); font-weight: 500; font-display: swap; }
@font-face { font-family: "Barlow"; src: url(../fonts/Barlow-SemiBold.woff) format("woff"); font-weight: 600; font-display: swap; }
@font-face { font-family: "Barlow"; src: url(../fonts/Barlow-Bold.woff) format("woff"); font-weight: 700 900; font-display: swap; }
@font-face { font-family: "Barlow Semi Condensed"; src: url(../fonts/BarlowSemiCondensed-SemiBold.woff) format("woff"); font-weight: 400 600; font-display: swap; }
@font-face { font-family: "Barlow Semi Condensed"; src: url(../fonts/BarlowSemiCondensed-Bold.woff) format("woff"); font-weight: 700 900; font-display: swap; }
/* Alias de los nombres viejos */
@font-face { font-family: "Orbitron"; src: url(../fonts/BigShouldersDisplay-wght.woff) format("woff"); font-weight: 100 900; font-display: swap; }
@font-face { font-family: "Teko"; src: url(../fonts/BigShouldersDisplay-wght.woff) format("woff"); font-weight: 100 900; font-display: swap; }
@font-face { font-family: "Oxanium"; src: url(../fonts/BarlowSemiCondensed-Bold.woff) format("woff"); font-weight: 100 900; font-display: swap; }
@font-face { font-family: "Rajdhani"; src: url(../fonts/Barlow-Medium.woff) format("woff"); font-weight: 100 500; font-display: swap; }
@font-face { font-family: "Rajdhani"; src: url(../fonts/Barlow-SemiBold.woff) format("woff"); font-weight: 600; font-display: swap; }
@font-face { font-family: "Rajdhani"; src: url(../fonts/Barlow-Bold.woff) format("woff"); font-weight: 700 900; font-display: swap; }

:root, :root body {
  /* Sistema «Marcador» */
  --noche: #0b0a24;
  --sup-1: #14123a;
  --sup-2: #1d1a4f;
  --sup-3: #262263;
  --linea: #2f2b70;
  --linea-fuerte: #463f9a;
  --violeta: #8b5cf6;
  --violeta-boton: #7344f0;
  --violeta-texto: #b49dff;
  --rojo: #ff2d55;
  --rojo-texto: #ff5c7a;
  --tinta: #14031a;
  --texto: #f4f3ff;
  --suave: #b9b6dd;
  --tenue: #9792c8;
  --ok: #20e89b;
  --espera: #f5c542;
  --info: #00d4ff;
  --error: #ff6b6b;
  --f-display: "Big Shoulders Display", "Barlow Semi Condensed", sans-serif;
  --f-texto: "Ticopa Flags", "Barlow", system-ui, sans-serif;
  --f-datos: "Ticopa Flags", "Barlow Semi Condensed", "Barlow", sans-serif;
  --r-s: 6px; --r-m: 10px; --r-l: 16px;
  --toque: 44px;

  /* Variables viejas → nuevas (todo el CSS existente las usa) */
  --primary: #ff2d55;
  --primary-glow: rgba(255, 45, 85, .30);
  --secondary: #8b5cf6;
  --secondary-glow: rgba(139, 92, 246, .30);
  --accent: #ff5c7a;
  --accent-glow: rgba(255, 92, 122, .28);
  --gold: #f5c542;
  --dark-bg: #0b0a24;
  --panel-bg: #14123a;
  --panel-hover: #1d1a4f;
  --border-color: #2f2b70;
  --border-light: #463f9a;
  --text-main: #f4f3ff;
  --text-muted: #b9b6dd;
  --zone-direct: #20e89b;
  --zone-playoff: #00d4ff;
  --zone-relegation: #ff5c7a;
  --font-body: var(--f-texto);
  --font-titles: var(--f-display);
  --font-tech: var(--f-datos);
}

html { background: var(--noche); }
body {
  background: var(--noche) !important;
  color: var(--texto);
  font-family: var(--f-texto);
  font-variant-numeric: tabular-nums;
}
* { font-family: inherit; }
body, input, select, textarea, button { font-family: var(--f-texto); }
h1, h2, .neon-text { font-family: var(--f-display); letter-spacing: .01em; }
h3, h4, h5, th, .tab-btn, .filtro-btn { font-family: var(--f-datos); }
:focus-visible { outline: 3px solid var(--violeta-texto) !important; outline-offset: 2px; }
::selection { background: rgba(139, 92, 246, .45); }
::-webkit-scrollbar-track { background: var(--noche); }
::-webkit-scrollbar-thumb { background: var(--linea-fuerte); }
@media (prefers-reduced-motion: reduce) { * { animation-duration: .01ms !important; transition-duration: .01ms !important; } }