/* Tokens du design system (docs/DESIGN.md) — LE seul fichier du produit où une
   couleur, un rayon, un espacement ou une durée est écrit en clair.

   Pourquoi ici et pas dans chaque feuille : la palette était recopiée à la main en
   trois endroits (`calendar.css` la scopait à `.calendar`, `site.css` la posait en
   `:root`, `docs/design-preview.html` en gardait sa propre copie) et divergeait déjà
   — la version calendrier n'avait pas `--r-lg`, la version vitrine pas les softs
   d'état. Un quatrième exemplaire dans le châssis rendait la dérive certaine. Les
   feuilles de page ne déclarent plus aucune valeur : elles consomment `var(--…)`,
   et `tests/test_design_system.py` le vérifie mécaniquement.

   Aucune `font-family` ici, délibérément : la vitrine (`site.css`) reste sur la pile
   système et ne charge rien du réseau, alors que l'app charge Geist et JetBrains
   Mono depuis ce serveur (`fonts.css`). Les deux surfaces partagent leurs couleurs,
   pas leur typographie. */
:root {
  /* Neutres — légèrement chauds : c'est un écran qu'on regarde longtemps, le blanc
     pur fatigue (docs/DESIGN.md, Color). */
  --ink: #0C0D0E; --ink-2: #1C1E20; --ink-3: #3A3D40;
  --gray-1: #6B6F73; --gray-2: #9AA0A6; --gray-3: #C9CDD1;
  --line: #E3E5E7; --surface: #F2F2F0; --paper: #FAFAF8; --white: #FFFFFF;

  /* Action — la règle centrale du système : l'orange n'est JAMAIS un état,
     toujours une action. Deux emplois sanctionnés, et deux seulement : le bouton
     primaire et le marqueur du jour.

     `--action-contrast` est l'encre POSÉE SUR l'orange, et c'est elle qui porte le
     contraste, pas la teinte : en blanc, le libellé du bouton primaire (13 px, 600
     — pas du « grand texte ») mesurait 3,12:1. En encre sombre il monte à 6,24:1
     sans toucher à l'orange. Valeur écrite en clair et non `var(--ink)` : `--ink`
     s'inverse en mode sombre alors que `--action`, lui, ne bouge pas — l'encre
     doit rester sombre dans les deux modes. */
  --action: #FF5A1F; --action-hover: #EA4E14; --action-ink: #C2410C;
  --action-soft: #FFF1EA; --action-contrast: #0C0D0E;

  /* États d'une publication — sémantiques, jamais utilisés pour une action.
     Chaque couleur a son fond doux et son encre lisible SUR ce fond doux. */
  --draft: #6B6F73; --draft-soft: #EFEFED; --draft-ink: #3A3D40;
  --sched: #2563EB; --sched-soft: #EAF0FE; --sched-ink: #1E3A8A;
  --pub:   #15803D; --pub-soft:   #E8F5EC; --pub-ink:   #14532D;
  --fail:  #DC2626; --fail-soft:  #FDECEC; --fail-ink:  #7F1D1D;

  /* Barre latérale : sombre dans les DEUX modes, donc posée sur des valeurs fixes
     plutôt que sur la rampe de neutres (qui s'inverse en mode sombre). Toutes ces
     valeurs sortent de la rampe documentée — aucune teinte inventée pour elle. */
  --side-bg: #0C0D0E; --side-fg: #C9CDD1; --side-dim: #9AA0A6;
  --side-strong: #FFFFFF; --side-active: #1C1E20; --side-line: #1C1E20;

  /* Rayons — les rayons courts font l'outil, les longs font l'app grand public. */
  --r-sm: 4px; --r-md: 6px; --r-lg: 10px; --r-full: 9999px;

  /* Espacements, base 4 px. */
  --s-2xs: 2px; --s-xs: 4px; --s-sm: 8px; --s-md: 16px;
  --s-lg: 24px; --s-xl: 32px; --s-2xl: 48px; --s-3xl: 64px;

  /* Échelle typographique (docs/DESIGN.md) : énoncée en px, donc écrite en px —
     l'ancienne feuille l'exprimait en rem et n'atterrissait par construction sur
     presque aucune valeur de l'échelle (.9rem = 14,4 px, .62rem = 9,9 px…).

     Les tokens vont jusqu'à 48 px depuis le 29/07 : l'échelle documentée monte à
     48 et 84, et le hero de la vitrine en avait besoin — il tournait à
     `clamp(32px, 4.2vw, 52px)`, deux valeurs hors échelle, faute d'un token à sa
     taille. 84 px n'est pas déclaré : aucun écran ne l'emploie, et un token que
     personne ne consomme est une valeur qui dérive en silence. */
  --fs-2xs: 11px; --fs-xs: 12px; --fs-sm: 13px; --fs-md: 15px;
  --fs-lg: 19px; --fs-xl: 24px; --fs-2xl: 30px; --fs-3xl: 48px;

  /* Mouvement — micro pour survol/focus, court pour boutons et champs, rien
     au-delà : la vitesse est le sujet du produit. */
  --t-micro: 90ms; --t-short: 160ms;
  --ease-out: ease-out; --ease-in: ease-in; --ease-in-out: ease-in-out;

  /* Gabarit. La barre latérale est prescrite à 212 px, mais aucune largeur fixe
     n'est admise sur un porteur de texte (« Global analytics » devient
     « Statistiques globales ») : c'est un plancher, pas une largeur. */
  /* Le produit balaie des tableaux — la liste des vidéos porte huit colonnes, dont une
     date suivie de son bouton — là où la vitrine se lit. D'où deux largeurs : serrer le
     dashboard à 1180 px repliait le bouton sous le champ de date sur écran large. */
  --max-content: 1600px; --max-reading: 1180px; --sidebar-min: 212px;

  --shadow-sm: 0 1px 2px rgba(12, 13, 14, .05);
}

/* Mode sombre : les neutres s'inversent, l'orange et les sémantiques ne bougent
   pas — ils sont déjà lisibles sur les deux fonds. Les FONDS DOUX, eux, doivent
   suivre : `--sched-soft` clair conservé en mode sombre donnait du bleu clair sur
   bleu très clair dans le calendrier (texte illisible, constaté en portant le
   châssis le 29/07 — calendar.css n'inversait que les encres). */
@media (prefers-color-scheme: dark) {
  :root {
    --ink: #FAFAF8; --ink-2: #E3E5E7; --ink-3: #C9CDD1;
    --gray-1: #9AA0A6; --gray-2: #6B6F73; --gray-3: #3A3D40;
    --line: #2A2D2F; --surface: #1C1E20; --paper: #141516; --white: #0C0D0E;

    --action-soft: #3A2016;

    --draft-soft: #26282A; --draft-ink: #C9CDD1;
    --sched-soft: #16243F; --sched-ink: #93B4FA;
    --pub-soft:   #14301F; --pub-ink:   #86D9A4;
    --fail-soft:  #33191A; --fail-ink:  #F5A3A3;

    --shadow-sm: 0 1px 2px rgba(0, 0, 0, .4);
  }
}