:root {
  /* Couleurs de surface */
  --bg: #f6f7f9;
  --surface: #ffffff;
  --surface-alt: #f9fafb;
  --border: #e5e7eb;
  --border-strong: #d1d5db;

  /* Texte */
  --text: #111827;
  --muted: #6b7280;
  --text-inverse: #ffffff;

  /* Accent et états */
  --accent: #4f46e5;
  --accent-hover: #4338ca;
  --accent-soft: #eef2ff;
  --danger: #dc2626;
  --danger-soft: #fef2f2;
  --success: #16a34a;
  --success-soft: #dcfce7;
  --warning: #d97706;

  /* Température */
  --hot: #dc2626;
  --hot-soft: #fee2e2;
  --warm: #d97706;
  --warm-soft: #fef3c7;
  --cold: #2563eb;
  --cold-soft: #dbeafe;

  /* Canal */
  --wa: #25d366;
  --wa-hover: #1eb855;

  /* Typo */
  --font: "Inter", -apple-system, "Segoe UI", Roboto, sans-serif;
  --fs-xs: 12px;
  --fs-sm: 13px;
  --fs-md: 14px;
  --fs-lg: 16px;
  --fs-xl: 20px;
  --fs-2xl: 28px;

  /* Espacement (base 4px) */
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 24px;
  --sp-6: 32px;

  /* Rayons et ombres */
  --r-sm: 6px;
  --r-md: 10px;
  --shadow-sm: 0 1px 2px rgba(16, 24, 40, 0.06);
  --shadow-md: 0 8px 24px rgba(16, 24, 40, 0.12);

  /* Voile des modales et du tiroir */
  --backdrop: rgba(17, 24, 39, 0.45);

  /* Dimensions des barres fixes */
  --nav-h: 56px;
}