/* Autoalojadas (antes: Inter vía <link> a Google Fonts en index.html, y
   Space Grotesk/IBM Plex Mono declaradas acá abajo pero nunca cargadas en
   ningún lado — caían calladas al sans/mono del sistema). Una PWA
   offline-first no puede depender de una petición externa en el arranque
   para verse bien, y menos aún declarar una fuente que jamás se sirve.
   Solo el subset latin: el español completo (incluida ñ, á-ú, ¿, ¡) vive
   en Latin-1 (U+0000-00FF), así que alcanza sin bajar cyrillic/greek/
   vietnamese que esta app nunca muestra. Pesos: solo los que el proyecto
   usa de verdad (ver grep de font-weight junto a cada var(--font-*) en
   css/ y js/). --font-mono-mk3 (más abajo) usa el stack del sistema a
   propósito y no se toca. */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  /* Rango variable, no un peso fijo: Google sirve un solo archivo
     variable para 400–900 en vez de seis estáticos — menos bytes en
     total que descargar los seis por separado. */
  font-weight: 400 900;
  font-display: swap;
  src: url('../assets/fonts/inter-variable-latin.woff2') format('woff2');
}
@font-face {
  font-family: 'Space Grotesk';
  font-style: normal;
  font-weight: 700; /* único peso usado: .nav-brand del sidebar de escritorio (layout.css) */
  font-display: swap;
  src: url('../assets/fonts/space-grotesk-700-latin.woff2') format('woff2');
}
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../assets/fonts/ibm-plex-mono-400-latin.woff2') format('woff2');
}
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('../assets/fonts/ibm-plex-mono-700-latin.woff2') format('woff2');
}

:root {
  /* --- Paleta 2026 (hyper-saturated accents sobre dark minimalista) ---
     4 niveles de superficie: fondo real, elevada, elevada secundaria,
     y borde sutil (usado como "superficie de contorno" en vez de sombra). */
  --bg-base: #0A0A0F;
  --surface-1: #14141C;
  --surface-2: #1C1C28;
  --surface-border: rgba(38, 38, 54, 0.4);

  /* --- Texto --- */
  --text-primary: #F5F5F7;
  --text-secondary: #8B8B9A;
  --text-disabled: #4A4A58;

  /* --- Acentos: morado = acento primario (Finanzas, Tareas, nav);
     cian = acento secundario, EXCLUSIVO de Entreno (anillos, racha,
     "Iniciar sesión", mapa de actividad). --- */
  /* Retinte "rediseño Vanguard": dorado/latón como acento de marca propio
     de Inicio (.mk3-dashboard no lo redefine), separado del color de
     cualquier módulo — antes compartía el morado con Tareas. */
  --accent-primary: #C9A24A;
  --accent-purple: #C9A24A; /* alias histórico, usado en varios lugares */
  --accent-teal: #06B6D4;
  --accent-orange: #F59E0B;
  --accent-blue: #3B82F6; /* solo para distinguir categorías/datos (ej. "Deseos" en Finanzas, columna "En Progreso" en Tareas) — no es un acento de marca */

  /* --- Fase "vida" (Ritual, Planificador, Anotaciones): igual que
     --cy/--am/--vi, tokens globales en :root para que las filas heroicas
     de Inicio puedan usarlos aunque #view-root esté en scope
     .mk3-dashboard, no en el de cada módulo. --- */
  --accent-ritual: #8B7CFF;
  --accent-plan: #4ADE80;
  --accent-notas: #94A3B8;

  /* --- Estados semánticos: mismos colores de feedback en toda la app,
     nunca varían entre secciones. --- */
  --state-high: #EF4444;
  --state-medium: #F59E0B;
  --state-low: #22C55E;
  --state-success: #22C55E;
  --state-info: #3B82F6;

  /* --- Superficies vidrio (glassmorphism, tipo iOS) --- */
  --glass-bg: rgba(20, 20, 28, 0.72);
  --glass-border: rgba(245, 245, 247, 0.08);
  --glass-blur: 24px;
  --hairline: rgba(245, 245, 247, 0.07);

  /* --- Tipografía --- */
  --font-display: 'Space Grotesk', -apple-system, BlinkMacSystemFont, sans-serif;
  --font-body: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  --font-mono: 'IBM Plex Mono', monospace;

  /* --- Radios de borde (Curvas tipo Apple) --- */
  --radius-sm: 6px;
  --radius-md: 12px;
  --radius-lg: 20px;
  --radius-full: 9999px;

  /* --- Sombras sutiles --- */
  --shadow-1: 0 4px 6px -1px rgba(0, 0, 0, 0.3), 0 2px 4px -1px rgba(0, 0, 0, 0.2);
  --shadow-2: 0 10px 15px -3px rgba(0, 0, 0, 0.4), 0 4px 6px -2px rgba(0, 0, 0, 0.2);

  /* --- Espaciado --- */
  --space-1: 4px; --space-2: 8px; --space-3: 16px; --space-4: 24px; --space-5: 32px;

  --transition-view: 200ms ease-out;

  /* --- Vanguard MK III — tokens del nuevo sistema de diseño. Se activan
     dentro de la clase .mk3-entreno (y sus hermanas .mk3-finanzas/
     .mk3-tareas/.mk3-dashboard), que el router (app.js) pone sobre el
     contenedor de la vista montada (#view-root), no sobre <html> — ver el
     bloque de overrides en components.css. --- */
  --bg: #05070A;
  --panel: #0A1318;
  --line: #16323A;
  --div: #0E1F25;

  /* Retinte "rediseño Vanguard": bajamos saturación/subimos sofisticación
     de los 4 acentos base, manteniéndolos distinguibles entre sí y del
     nuevo dorado de marca (--accent-primary). Cada familia derivada se
     regeneró en HSL preservando la RATIO de saturación/luminosidad que
     cada paso ya tenía respecto de su base vieja (no un delta absoluto —
     un delta absoluto colapsaba los pasos más oscuros de vi/vis a negro
     puro al aplicarse sobre un base con luminosidad de partida distinta).
     --vi y --rd además se subieron un poco de L respecto del cálculo
     directo de la tabla de diseño (#6C74B0→#737AB4, #C1554B→#C56056):
     con el tono "apagado" propuesto quedaban en 4.26:1 y 4.17:1 contra
     --panel, por debajo del piso de 4.5:1 de la auditoría WCAG existente.
     Todos los pares base-vs-panel quedaron re-verificados en ≥4.5:1. */
  --cy: #4FA6B3; --cy2: #48747B; --cy3: #314E52; --cy4: #283E41; --cyb: #223538; --cyp: #0B1011;
  --am: #D98A3D; --am2: #97622F; --amd: #634221; --amb: #271F16; --amp: #100D0B;
  --vi: #737AB4; --vib: #393B4A; --vid: #2C2E37; --vip: #0C0C0F; --vis: #14151B;
  --rd: #C56056; --rdb: #442C2A; --rd2: #6D3B36;

  /* t3/t4/t5 aclarados (Fase 7, auditoría WCAG): fallaban 4.5:1 contra
     --panel (t3 2.56:1, t4 1.89:1) o lo pasaban raspando (t5 4.49:1) —
     --t3 en particular es --text-disabled en los 4 scopes MK III, así que
     cubre bastante más que texto secundario suelto: "Sin movimientos",
     etiquetas de insignias bloqueadas, botones de eliminar. Mismo tono
     azul-grisáceo, solo más claro; t1/t2 y los acentos ya pasaban y quedan
     sin tocar. */
  --t1: #C8DDE4; --t2: #8CA9B4; --t3: #698692; --t4: #64828E; --t5: #6E838E;

  --font-mono-mk3: ui-monospace, "SF Mono", Menlo, Consolas, monospace;

  /* Tamaño del corte de chaflán (ver .chaflan en components.css) — un solo
     valor para que la tarjeta principal, el botón primario y el FAB
     compartan el mismo lenguaje geométrico. */
  --chaflan: 12px;
}