/* Marlon Arias · tokens v1.0
   Copia literal del Manual de Marca §15 (tokens.css) + extensiones mínimas
   para los demos (marcadas con "ext"). No editar valores de marca aquí sin
   actualizar primero el manual. */
:root {
  /* Marca */
  --ma-blue: #1D4ED8;        --ma-blue-hover: #1E3A8A;   --ma-navy: #0F2A6B;
  --ma-teal: #0D9488;        --ma-teal-text: #0F766E;    --ma-teal-light: #5EEAD4;
  --ma-blue-text: #1D4ED8;   /* ext: azul para texto (en oscuro cambia) */
  /* Neutros */
  --ma-paper: #F8F5F1;       --ma-surface: #FFFFFF;      --ma-surface-2: #F8FAFC;
  --ma-fill: #F1F5F9;        --ma-line: #E2E8F0;         --ma-line-strong: #CBD5E1;
  --ma-ink: #0F172A;         --ma-ink-2: #334155;        --ma-ink-3: #475569;
  --ma-ink-4: #64748B;       --ma-ink-5: #94A3B8;
  /* Estado */
  --ma-success: #16A34A; --ma-warning: #D97706; --ma-error: #DC2626; --ma-info: #1D4ED8;
  --ma-success-text: #15803D; --ma-warning-text: #B45309; --ma-error-text: #B91C1C; /* ext */
  /* Gradientes */
  --ma-grad: linear-gradient(135deg, #1D4ED8, #0D9488);
  --ma-grad-deep: linear-gradient(135deg, #1D4ED8, #0F2A6B);
  --ma-grad-tint: linear-gradient(135deg, rgba(29,78,216,.12), rgba(13,148,136,.12));
  /* Tipografía */
  --ma-font-display: 'Sora', system-ui, sans-serif;
  --ma-font-body: 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --ma-font-mono: 'JetBrains Mono', ui-monospace, Consolas, monospace;
  /* Espacio (base 4) */
  --ma-s1: 4px; --ma-s2: 8px; --ma-s3: 12px; --ma-s4: 16px; --ma-s5: 24px;
  --ma-s6: 32px; --ma-s7: 48px; --ma-s8: 64px; --ma-s9: 84px;
  /* Radios */
  --ma-r-xs: 6px; --ma-r-sm: 9px; --ma-r-md: 11px; --ma-r-lg: 14px;
  --ma-r-xl: 18px; --ma-r-2xl: 22px; --ma-r-3xl: 28px; --ma-r-pill: 999px;
  /* Sombras */
  --ma-e1: 0 4px 18px rgba(15,23,42,.04);
  --ma-e2: 0 14px 34px rgba(15,23,42,.10);
  --ma-e3: 0 40px 100px rgba(15,23,42,.45);
  --ma-glow: 0 8px 24px rgba(29,78,216,.28);
  /* Layout y movimiento */
  --ma-container: 1080px; --ma-ease: cubic-bezier(.2,.7,.2,1);
  --ma-fast: 200ms; --ma-slow: 600ms;
  /* Datos (orden fijo) */
  --ma-c1: #1D4ED8; --ma-c2: #0D9488; --ma-c3: #E0870B;
  --ma-c4: #7C3AED; --ma-c5: #DB2777; --ma-c6: #0EA5E9;
  /* ext: superficies translúcidas (nav glass) */
  --ma-glass: rgba(255,255,255,.72);
  --ma-overlay: rgba(15,23,42,.62);
  color-scheme: light;
}
/* Tema oscuro: solo apps y dashboards (manual §3). Nunca invertido. */
[data-theme="dark"] {
  --ma-paper: #0B1220; --ma-surface: #111A2E; --ma-fill: #1A2540;
  --ma-line: #1E293B; --ma-line-strong: #334155;
  --ma-ink: #F1F5F9; --ma-ink-2: #CBD5E1; --ma-ink-3: #AAB6C8; --ma-ink-4: #94A3B8;
  --ma-blue: #2563EB; --ma-blue-text: #60A5FA; --ma-teal-text: #2DD4BF;
  --ma-c1: #3B82F6; --ma-c3: #D97706; --ma-c4: #8B5CF6; --ma-c5: #EC4899; --ma-c6: #0891B2;
  /* ext */
  --ma-surface-2: #0F1830; --ma-ink-5: #64748B;
  --ma-success-text: #4ADE80; --ma-warning-text: #FBBF24; --ma-error-text: #F87171;
  --ma-glass: rgba(17,26,46,.78);
  --ma-overlay: rgba(2,6,23,.72);
  --ma-e1: 0 4px 18px rgba(0,0,0,.25);
  --ma-e2: 0 14px 34px rgba(0,0,0,.35);
  color-scheme: dark;
}
