/* ==========================================================================
   Apptonomia — Design tokens
   High-contrast light theme. See CLAUDE.md (accessibility rules).
   ========================================================================== */

:root {
  /* Base colors — accessible light theme */
  --color-fondo: #FAF7F2;
  --color-superficie: #FFFFFF;
  --color-texto: #1A1A2E;
  --color-texto-suave: #4A4A68;
  --color-borde: #D8D2C8;

  /* Module colors */
  --mod-coordinacion: #1B6CA8;   /* blue */
  --mod-coordinacion-suave: #E3EEF6;
  --mod-secuencia: #2E7D32;      /* green */
  --mod-secuencia-suave: #E6F2E6;
  --mod-memoria: #C05621;        /* orange */
  --mod-memoria-suave: #F9EBE2;
  --mod-emocional: #6B3FA0;      /* purple */
  --mod-emocional-suave: #EFE8F7;
  --mod-razonamiento: #00695C;   /* teal */
  --mod-razonamiento-suave: #E0F0EE;
  --mod-lenguaje: #B3446C;       /* raspberry */
  --mod-lenguaje-suave: #F7E8EE;
  --mod-cuerpo: #A6432C;         /* terracotta */
  --mod-cuerpo-suave: #F8E9E3;

  /* Feedback */
  --color-acierto: #2E7D32;
  --color-acierto-suave: #E6F2E6;
  --color-animo: #C05621;        /* never an aggressive red for mistakes */
  --color-animo-suave: #F9EBE2;
  --color-estrella: #B8860B;

  /* Typography. --escala-texto is applied by assets/js/storage.js based
     on the preference saved in /settings/ (Normal=1/Large/Extra large);
     defaults to 1, so anyone who hasn't touched that preference sees
     no change. */
  --fuente: 'Atkinson Hyperlegible', 'Nunito', system-ui, -apple-system, sans-serif;
  --escala-texto: 1;
  --texto-base: calc(20px * var(--escala-texto));
  --texto-pequeno: calc(17px * var(--escala-texto));
  --texto-grande: calc(28px * var(--escala-texto));
  --texto-titulo: calc(36px * var(--escala-texto));

  /* Touch and spacing */
  --boton-min: 64px;
  --espacio: 16px;
  --espacio-grande: 24px;
  --radio: 16px;
  --sombra: 0 2px 8px rgba(26, 26, 46, 0.12);

  /* Visible focus */
  --color-foco: #1B6CA8;
}