/* EX’SIE — jetons de design. Source unique des couleurs, tailles, rayons, courbes. Design à plat : aplats, bordures fines, aucune ombre colorée. */
:root {
  color-scheme: light;

  /* Marque */
  --c-accent: #1E87AE;
  --c-accent-fonce: #176b8b;
  --c-gris: #CDCDCD;
  --c-sombre: #323232;
  --c-exform: #705594;

  /* Rôles — clair */
  --bg: #f6f9fb;
  --bg-doux: #edf2f5;
  --surface: #ffffff;
  --surface-2: #f9fbfc;
  --ink: #323232;
  --text: #4a5256;
  --muted: #5d696e;          /* 5,3:1 sur --bg */
  --accent: #1E87AE;         /* titres et grands éléments (4,1:1 : grand texte uniquement) */
  --accent-fonce: #176b8b;   /* boutons */
  --accent-texte: #176b8b;   /* liens et petits textes (6,0:1) */
  --sur-accent: #ffffff;
  --line: #e1e8ec;
  --line-fort: #cdd6db; --bord-controle: #808b91; /* contour des champs et des cases : 3:1 au moins sur le fond */
  --point: rgba(50, 50, 50, .16);
  /* Ombre neutre, réservée à ce qui flotte vraiment : menus, listes, objets des scènes. */
  --flottant: 0 1px 2px rgb(0 0 0 / .04), 0 14px 36px rgb(0 0 0 / .08);
  --ambre: #b0730e;          /* décor : exceptions, écarts */
  --ambre-texte: #8a5a06;    /* même teinte, lisible en petit (5,6:1) */
  --papier: #fbfbfa;
  --papier-encre: #2c3e46;
  --papier-trait: #cfd8dc;
  --exform: #705594;

  /* Typographie */
  --police: "Quicksand", "Nunito", "Segoe UI", system-ui, sans-serif;
  --t-h1: clamp(2.5rem, 1.55rem + 3.9vw, 4.25rem);
  --t-h2: clamp(1.85rem, 1.3rem + 2.3vw, 2.9rem);
  --t-h3: clamp(1.2rem, 1.1rem + .5vw, 1.45rem);
  --t-chapo: clamp(1.03rem, 1rem + .2vw, 1.14rem);
  --t-corps: 1.02rem;
  --t-petit: .875rem;
  --t-mini: .75rem;
  --mesure: 60ch;            /* jamais plus de 75 caractères par ligne */
  --mesure-chapo: 48ch;

  /* Espace */
  --e-1: 4px; --e-2: 8px; --e-3: 12px; --e-4: 16px; --e-5: 24px;
  --e-6: 32px; --e-7: 48px; --e-8: 64px; --e-9: 96px;
  --section: clamp(72px, 9vw, 136px);
  --gouttiere: clamp(20px, 4vw, 32px);
  --largeur: 1240px;

  /* Formes */
  --r-1: 8px; --r-2: 12px; --r-3: 18px; --r-4: 28px; --r-pilule: 999px;

  /* Mouvement : trois courbes, quatre durées */
  --c-entree: cubic-bezier(.2, .8, .2, 1);
  --c-elan: cubic-bezier(.16, 1, .3, 1);
  --c-trajet: cubic-bezier(.65, 0, .35, 1);
  --d-1: 160ms; --d-2: 280ms; --d-3: 520ms; --d-4: 900ms;

  --z-entete: 50; --z-menu: 80;
  --h-entete: 84px;
}

/* Rôles — sombre (base neutre #323232) */
:root[data-theme="dark"] {
  color-scheme: dark;
  --bg: #232526; --bg-doux: #1c1e1f; --surface: #323232; --surface-2: #3a3c3d;
  --ink: #f2f5f6; --text: #c9d0d3; --muted: #9ba6ab;
  --accent: #3aa5cc; --accent-texte: #74c4e2;
  --line: #414547; --line-fort: #565b5e; --bord-controle: #858d91;
  --point: rgba(255, 255, 255, .14); --flottant: 0 1px 2px rgb(0 0 0 / .3), 0 14px 36px rgb(0 0 0 / .38);
  --ambre: #e0a33c; --ambre-texte: #e9b862; --papier: #e9edee; --exform: #ab96c9;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --bg: #232526; --bg-doux: #1c1e1f; --surface: #323232; --surface-2: #3a3c3d;
    --ink: #f2f5f6; --text: #c9d0d3; --muted: #9ba6ab;
    --accent: #3aa5cc; --accent-texte: #74c4e2;
    --line: #414547; --line-fort: #565b5e; --bord-controle: #858d91; --bord-controle: #858d91;
    --point: rgba(255, 255, 255, .14); --flottant: 0 1px 2px rgb(0 0 0 / .3), 0 14px 36px rgb(0 0 0 / .38);
    --ambre: #e0a33c; --ambre-texte: #e9b862; --papier: #e9edee; --exform: #ab96c9;
  }
}
@media (max-width: 760px) { :root { --h-entete: 68px; } }