/**
 * css/variables.css
 * -----------------------------------------------------------------------
 * Token system. Nenhuma cor "solta" deve aparecer em outros arquivos CSS
 * — tudo referencia estas variáveis. As --accent-* são sobrescritas em
 * runtime pelo player-controller com base no `theme` da estação ativa
 * (config/stations.js), então o mesmo CSS serve para as 4 estações.
 * -----------------------------------------------------------------------
 */

:root {
  /* Base — profundidade cinematográfica, não preto puro */
  --bg-void: #060810;
  --bg-deep: #0b1220;
  --bg-elevated: rgba(255, 255, 255, 0.045);
  --bg-elevated-strong: rgba(255, 255, 255, 0.08);
  --border-glass: rgba(255, 255, 255, 0.09);

  /* Texto */
  --text-primary: #f4f6fb;
  --text-muted: #8992a9;
  --text-faint: #545c72;

  /* Acento — sobrescrito por estação via JS (config/stations.js) */
  --accent-primary: #4c8dff;
  --accent-secondary: #7c6cff;
  --accent-tertiary: #38e1c6;
  --glow-strength: 0.55;
  --particle-speed: 1;

  /* Sinalização de estado */
  --state-warning: #ffb454;
  --state-danger: #ff6b6b;

  /* Tipografia */
  --font-display: 'Sora', 'Inter', system-ui, sans-serif;
  --font-body: 'Inter', system-ui, sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, 'SFMono-Regular', monospace;

  /* Ritmo */
  --radius-sm: 10px;
  --radius-md: 18px;
  --radius-lg: 28px;
  --radius-pill: 999px;

  --ease-cinematic: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-standard: cubic-bezier(0.4, 0, 0.2, 1);

  /* Publicadas pelo visualizer-engine.js a cada frame (0..1) */
  --audio-bass: 0;
  --audio-mid: 0;
  --audio-treble: 0;
  --audio-energy: 0;

  color-scheme: dark;
}