/* tokens.css — RRHH design tokens (UI-R1).
   Single source of truth for the visual language: a rebrand is a token-value
   edit here, nothing else. Consumed exclusively via var() by app.css.
   Dark mode is a non-goal (UI-R1). */
:root {
  --color-primary: #0F172A; --color-action: #2563EB; --color-accent: #0D9488;
  --color-bg: #F8FAFC; --color-surface: #FFFFFF; --color-border: #E2E8F0;
  --color-muted: #64748B; --color-error: #DC2626; --color-warning: #D97706;
  --color-success: #059669; --color-info: #2563EB;
  --space-1: 4px; --space-2: 8px; --space-3: 12px; --space-4: 16px;
  --space-5: 24px; --space-6: 32px;
  --radius-sm: 6px; --radius-md: 10px;
  --shadow: 0 1px 3px rgba(15,23,42,.08);
  --breakpoint-sm: 480px; --breakpoint-md: 768px;
  --font-sans: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --focus-ring: 0 0 0 3px rgba(37,99,235,.35);   /* R7 */
  /* M3 elevation / state / motion / tonal (UI-R9) */
  --elevation-1: 0 1px 2px rgba(15,23,42,.06), 0 1px 3px rgba(15,23,42,.10);
  --elevation-2: 0 2px 4px rgba(15,23,42,.08), 0 4px 12px rgba(15,23,42,.12);
  --elevation-3: 0 4px 8px rgba(15,23,42,.10), 0 8px 24px rgba(15,23,42,.16);
  --state-hover: rgba(37,99,235,.08); --state-active: rgba(37,99,235,.16);
  --state-hover-surface: rgba(15,23,42,.05);
  --motion-duration-1: 120ms; --motion-duration-2: 200ms;
  --motion-easing: cubic-bezier(0.2, 0, 0, 1);
  --surface-tonal: color-mix(in srgb, var(--color-action) 6%, var(--color-surface));
  /* M3 component set (ui-m3-components): dialog scrim + full pill radius (D7) */
  --overlay-scrim: rgba(15,23,42,.45); --radius-full: 999px;
}