/* MindTracker - jetons de design. Les couleurs de marque (--brand-*) viennent des paramètres : /marque/couleurs.css */
:root {
  --neutral-anthracite: #272727;
  --neutral-white: #FFFFFF;
  --neutral-gray-light: #F3F6F7;
  --color-brand-primary: var(--brand-primary);
  --color-brand-secondary: var(--brand-accent);
  --color-accent: var(--brand-accent-light);
  --color-bg: var(--neutral-white);
  --color-surface: var(--neutral-gray-light);
  --color-surface-accent: color-mix(in srgb, var(--brand-accent) 10%, white);
  --color-text: var(--neutral-anthracite);
  --color-text-secondary: #526171;
  --color-text-inverse: var(--neutral-white);
  --color-heading: var(--brand-primary);
  --color-link: color-mix(in srgb, var(--brand-accent) 70%, black);
  --color-link-hover: var(--brand-primary);
  --color-border: #D9E2E7;
  --color-input-border: #778896;
  --color-action-bg: var(--brand-primary);
  --color-action-text: var(--neutral-white);
  --color-action-hover: color-mix(in srgb, var(--brand-primary) 85%, white);
  --color-action-active: color-mix(in srgb, var(--brand-primary) 80%, black);
  --color-focus: color-mix(in srgb, var(--brand-accent) 70%, black);
  --color-focus-on-dark: var(--brand-accent-light);
  --color-disabled-bg: var(--neutral-gray-light);
  --color-disabled-text: #526171;
  --color-success: #16734A;
  --color-warning: #8A5600;
  --color-error: #B42318;
  --font-heading: 'Manrope', Arial, sans-serif;
  --font-body: 'Inter', Arial, sans-serif;
  --text-h1: clamp(2.125rem, 4vw, 3rem);
  --text-h2: clamp(1.75rem, 3vw, 2rem);
  --text-h3: clamp(1.375rem, 2vw, 1.5rem);
  --text-body: 1rem;
  --text-small: .875rem;
  --leading-heading: 1.2;
  --leading-body: 1.55;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-6: 24px;
  --space-8: 32px;
  --space-12: 48px;
  --space-16: 64px;
  --space-24: 96px;
  --radius-control: 8px;
  --radius-card: 12px;
  --radius-panel: 24px;
  --container-max: 1200px;
  --control-min-height: 44px;
  --input-min-height: 48px;
  --shadow-card: 0 4px 16px color-mix(in srgb, var(--brand-primary) 6%, transparent);
  --duration-fast: 180ms;
}
/* Fond clair. Sur fond marine, employer le token focus-on-dark. */
:focus-visible {
  outline: 3px solid var(--color-focus);
  outline-offset: 3px;
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
}