/* Tokens de la demo. Único archivo donde viven los colores: nunca un hex suelto en otro lado.
   Sistema: RaketSense (courtside-admin/apps/frontend/src/styles.css, solo lectura). Oscuro por defecto; claro con [data-theme='light'].
   Guía y movimiento: tal cual el prototipo aprobado (docs/demo/prototipo-demo.html). */
:root {
  color-scheme: dark;
  /* Superficies */
  --bg: #0a0a0a;
  --surface: #121212;
  --surface2: #1a1a1a;
  --border: #2b2b2b;
  --hair: #212121;
  /* Tinta */
  --ink: #f2f2f2;
  --ink2: #c4c4c4;
  --muted: #8a8a8a;
  /* Acento (uno solo) */
  --accent: #e2683a;
  --accent-ink: #0a0a0a;
  --accent-soft: rgba(226, 104, 58, 0.14);
  --accent-hi: #eda27c;
  --accent-halo: rgba(226, 104, 58, 0.55);
  --accent-halo-0: rgba(226, 104, 58, 0);
  --ok: #7fc49a;
  /* Datos */
  --series: #8f8f8f;
  --track: rgba(255, 255, 255, 0.09);
  --pos: #b5b5b5;
  --neg: #e2683a;
  --warn: #c9c9c9;
  --req: #ff7a7a;
  --ramp-1: #242424;
  --ramp-2: #3a3a3a;
  --ramp-3: #565656;
  --ramp-4: #7a7a7a;
  --ramp-5: #a8a8a8;
  /* mapa de ocupación de la demo: tonos más separados que la rampa general, para que en oscuro se distingan los 5 */
  --mapa-1: #303030;
  --mapa-2: #4a4a4a;
  --mapa-3: #686868;
  --mapa-4: #8c8c8c;
  --mapa-5: #bcbcbc;
  --franja-fondo: rgba(226, 104, 58, 0.24);
  /* Velo de las ventanas */
  --velo: rgba(0, 0, 0, 0.55);
  /* Geometría del sistema: radios chicos */
  --r-sm: 4px;
  --r-md: 5px;
  --r-lg: 7px;
  --font: 'Helvetica Neue', Helvetica, Arial, sans-serif;

  /* Guía: formas y movimiento de pilates, en naranja. Capa clara que flota sobre el sistema (igual en oscuro y claro). */
  --guia: #f4f1ec;
  --guia-ink: #141414;
  --guia-suave: #5b5650;
  --guia-linea: #ddd6cc;
  --guia-blanco: #ffffff;
  --guia-acento: #c2410c;
  --g-r: 22px;
  --g-r-chip: 999px;
  --panel-w: 360px;

  /* Movimiento */
  --sale: cubic-bezier(0.2, 0.8, 0.2, 1);
  --d-toque: 0.12s;
  --d-corta: 0.2s;
  --d-media: 0.32s;
  --d-larga: 0.45s;
  --d-tilde: 0.35s;
  --d-latido: 1.1s;
  --d-ventana: 0.26s;
}

[data-theme='light'] {
  color-scheme: light;
  --bg: #f0f0f0;
  --surface: #ffffff;
  --surface2: #f7f7f7;
  --border: #d6d6d6;
  --hair: #e6e6e6;
  --ink: #111111;
  --ink2: #3a3a3a;
  --muted: #666666;
  --accent: #c2410c;
  --accent-ink: #ffffff;
  --accent-soft: rgba(194, 65, 12, 0.08);
  --accent-hi: #9c3409;
  --accent-halo: rgba(194, 65, 12, 0.5);
  --accent-halo-0: rgba(194, 65, 12, 0);
  --ok: #2e7d4f;
  --series: #8a8a8a;
  --track: rgba(0, 0, 0, 0.09);
  --pos: #4a4a4a;
  --neg: #c2410c;
  --warn: #5c5c5c;
  --req: #b91c1c;
  --ramp-1: #eaeaea;
  --ramp-2: #c9c9c9;
  --ramp-3: #a1a1a1;
  --ramp-4: #727272;
  --ramp-5: #3d3d3d;
  --mapa-1: #eaeaea;
  --mapa-2: #c9c9c9;
  --mapa-3: #a1a1a1;
  --mapa-4: #727272;
  --mapa-5: #3d3d3d;
  --franja-fondo: rgba(194, 65, 12, 0.16);
  --velo: rgba(0, 0, 0, 0.4);
}