:root {
  /* Espacements (8pt grid) */
  --space-1: 8px;   --space-2: 16px;  --space-3: 24px;
  --space-4: 32px;  --space-5: 48px;  --space-6: 64px;

  /* Rayons */
  --radius-sm: 4px;   --radius-md: 8px;   --radius-lg: 12px;
  --radius-pill: 9999px;

  /* Ombres */
  --shadow-sm: 0 1px 2px rgba(0,0,0,0.05);
  --shadow-md: 0 4px 6px rgba(0,0,0,0.07), 0 2px 4px rgba(0,0,0,0.06);
  --shadow-lg: 0 10px 15px rgba(0,0,0,0.1), 0 4px 6px rgba(0,0,0,0.05);

  /* Transitions */
  --transition-fast: 150ms ease;
  --transition-base: 250ms ease;
  --transition-slow: 400ms cubic-bezier(0.4, 0, 0.2, 1);

  /* Z-index */
  --z-dropdown: 100;  --z-sticky: 200;
  --z-modal: 1000;    --z-toast: 1100;

  /* Couleurs sémantiques */
  --color-success: #10B981;
  --color-warning: #F59E0B;
  --color-danger: #EF4444;
  --color-info: #3B82F6;

  /* Couleurs textuelles — WCAG 2.1 AA conformes sur fond --color-bg-card (#FFFFFF)
   * primary  #1F2937 → ratio 12.6:1 (AAA)
   * secondary #4B5563 → ratio  8.9:1 (AAA) — assombri depuis #6B7280
   * muted    #6B7280 → ratio  4.7:1 (AA  texte normal) — assombri depuis #9CA3AF (2.85:1) */
  --color-text-primary: #1F2937;
  --color-text-secondary: #4B5563;
  --color-text-muted: #6B7280;

  /* Backgrounds */
  --color-bg-page: #F9FAFB;
  --color-bg-card: #FFFFFF;
  --color-bg-elevated: #FFFFFF;
  --color-border: #E5E7EB;

  /* Typographie */
  --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-serif: 'Source Serif Pro', Georgia, serif;
  --text-xs: 12px; --text-sm: 14px; --text-base: 16px;
  --text-lg: 18px; --text-xl: 20px; --text-2xl: 24px;
  --text-3xl: 30px; --text-4xl: 36px;
}

/* Accents par rôle */
[data-role="libraire"]  { --role-accent: #1F5E3A; --role-accent-light: #7FB069; }
[data-role="editeur"]   { --role-accent: #1B3A6B; --role-accent-light: #2B6CB0; }
[data-role="diffuseur"] { --role-accent: #C05621; --role-accent-light: #F6AD55; }
[data-role="lecteur"]   { --role-accent: #553C9A; --role-accent-light: #B794F4; }
[data-role="auteur"]    { --role-accent: #822727; --role-accent-light: #FEB2B2; }

/* Focus accessible WCAG 2.1 AA */
*:focus-visible {
  outline: 2px solid var(--role-accent, var(--color-info));
  outline-offset: 2px;
}