@import url('https://fonts.googleapis.com/css2?family=DM+Serif+Display:ital@1&family=Inter:wght@300;400;500;600&display=swap');

:root {

  --color-bg:          #FFFFFF;   /* fond principal */
  --color-surface:     #FAF7F2;   /* sections alternées, stats bar */
  --color-ivory:       #F4EFE6;   /* halo tachymètre, footer */
  --color-border:      rgba(0, 0, 0, 0.08);
  --color-border-mid:  rgba(0, 0, 0, 0.12);

  --color-ink:         #2C1E10;   /* titres, texte principal */
  --color-muted:       #7A5A3E;   /* corps de texte secondaire */
  --color-subtle:      #9A7A5A;   /* labels, placeholders */

  --color-rail:        #3D6FA5;   /* boutons, liens, accents */
  --color-rail-dark:   #2E5580;   /* hover boutons */
  --color-rail-bg:     #EEF3F9;   /* fond tags, badges */
  --color-rail-light:        #deeeff;   /* boutons, liens, accents */
  --color-rail-border: #B0C8E4;   /* bordure éléments rail */

  --color-brass:       #C8A050;
  --color-brass-bg:    #FDF6E3;
  --color-brass-text:  #7A5C10;

  /* couleurs */

--border-radius-lg: 10px;

  /* oui */
  --color-success:        #2D7A4A;
  --color-success-bg:     #EBF6EE;
  --color-success-border: #A8D4B5;
  --color-success-text:   #1E6636;

  /* erreur / non */
  --color-error:          #C03228;
  --color-error-bg:       #FCEAE8;
  --color-error-border:   #F0B4AF;
  --color-error-text:     #8B2820;

  /* Avertissement MEUUUH PSH */
  --color-warning:        #C08820;
  --color-warning-bg:     #FDF4E3;
  --color-warning-border: #F0CF80;
  --color-warning-text:   #7A5010;

  /* typo */
  --font-base:    'Inter', sans-serif;
  --font-accent:  'DM Serif Display', serif; /* uniquement pour les I / II */

  --text-xs:   10px;
  --text-sm:   12px;
  --text-base: 14px;
  --text-md:   16px;
  --text-lg:   20px;
  --text-xl:   26px;
  --text-2xl:  34px;

  --weight-regular: 400;
  --weight-medium:  500;
  --weight-bold:    600;

  --leading-tight:  1.1;
  --leading-normal: 1.5;
  --leading-loose:  1.75;

  --tracking-tight:  -0.4px;
  --tracking-normal:  0;
  --tracking-wide:    0.08em;
  --tracking-wider:   0.15em;

  /* space */
  --space-1:  4px;
  --space-2:  8px;
  --space-3:  12px;
  --space-4:  16px;
  --space-5:  20px;
  --space-6:  24px;
  --space-8:  32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;

  /* bords */
  --radius-sm:  3px;
  --radius-md:  6px;
  --radius-lg:  10px;
  --radius-full: 9999px;

  /* transitions */
  --transition-fast:   0.15s ease;
  --transition-normal: 0.25s ease;

}