:root {
  /* === Direction : éditorial, sobre, haut de gamme — robuste à TOUT accent ===
     Principe : l'accent est une ÉTINCELLE (liens, focus, états actifs, chiffres clés).
     La structure tient sur des neutres soignés + une action primaire en ENCRE (indépendante
     de la couleur). Résultat : changer --accent (thème d'event) reste toujours stylé. */

  /* Encre = action primaire / texte fort. Indépendant de l'accent → contraste garanti. */
  --ink: #16181d;
  --ink-hover: #2b2f39;
  --on-ink: #ffffff;

  /* Accent unique (par défaut : bleu froid). Surchargé par le thème d'un event. */
  --accent: #2f43c9;
  --accent-strong: #1f2f9e;
  --accent-2: #2f43c9;                 /* alias plat : neutralise les anciens dégradés 2-couleurs */
  --accent-soft: color-mix(in srgb, var(--accent) 9%, transparent);   /* fond d'état discret */
  --accent-line: color-mix(in srgb, var(--accent) 32%, var(--border)); /* filet teinté accent */

  /* Neutres : papier doux, encre froide, filets fins. C'est là qu'est « l'âme ». */
  --bg: #fbfbfc;
  --bg-2: #f4f5f7;
  --surface: #ffffff;
  --surface-2: #f6f7f9;
  --border: #e6e7ec;
  --border-strong: #d3d5dd;
  --text: #1a1d24;
  --text-muted: #6a7080;
  --text-faint: #9aa0ad;

  --danger: #d6443c;
  --warn: #c97a12;
  --ok: #1f9d57;

  /* Élévation : quasi nulle. On s'appuie sur les filets, pas sur les ombres. Réservée aux
     surfaces flottantes (menu, modal, toast). */
  --shadow: 0 1px 2px rgba(20, 22, 28, 0.05);
  --shadow-pop: 0 12px 28px -12px rgba(20, 22, 28, 0.22), 0 2px 6px -2px rgba(20, 22, 28, 0.10);
  --radius: 10px;
  --radius-sm: 7px;

  /* Compat ascendante : anciennes variables d'effet neutralisées (rien ne casse). */
  --accent-grad: var(--accent);
  --glow: none;
  --glass-bg: var(--surface);
  --glass-blur: 0px;

  /* Typo (direction moderne/tech, style « sentrio ») : GROTESK nette et forte pour les TITRES
     (Space Grotesk — caractère bespoke, pas générique), Inter pour le corps, mono pour le
     code/chiffres. Fallback sans-serif si Space Grotesk ne charge pas. */
  --font-display: 'Space Grotesk', 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-sans: 'Inter', system-ui, -apple-system, Segoe UI, Roboto, 'Segoe UI Emoji', 'Apple Color Emoji', 'Noto Color Emoji', 'Segoe UI Symbol', sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, 'Segoe UI Emoji', 'Apple Color Emoji', 'Noto Color Emoji', monospace;

  --space-1: 4px;
  --space-2: 8px;
  --space-3: 16px;
  --space-4: 24px;
  --space-5: 40px;
  --space-6: 72px;

  /* Transitions : rapide pour le feedback, fluide pour les surfaces. Courbe « expo-out »
     pour des entrées qui décélèrent joliment (modales, menus). */
  --t: 0.14s ease;
  --t-slow: 0.24s cubic-bezier(0.16, 1, 0.3, 1);
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  /* Anneau de focus réutilisable (cohérent partout). */
  --ring: 0 0 0 3px color-mix(in srgb, var(--accent) 22%, transparent);
  /* Élévation au survol des éléments interactifs (cartes/liens cliquables). */
  --shadow-hover: 0 6px 18px -8px rgba(20, 22, 28, 0.18), 0 2px 4px -2px rgba(20, 22, 28, 0.08);
}

[data-theme='dark'] {
  --ink: #f0f1f4;            /* en sombre, l'action primaire s'inverse (clair sur sombre) */
  --ink-hover: #ffffff;
  --on-ink: #0d0f14;
  --accent: #93a4ff;
  --accent-strong: #b7c2ff;
  --accent-2: #93a4ff;
  --bg: #0c0e13;
  --bg-2: #11141b;
  --surface: #12151c;
  --surface-2: #171b24;
  --border: #232732;
  --border-strong: #303644;
  --text: #e8eaee;
  --text-muted: #9aa2b1;
  --text-faint: #6c7382;
  --shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
  --shadow-pop: 0 16px 40px -16px rgba(0, 0, 0, 0.7);
}