/* ═══════════════════════════════════════════════════════════════════════════════════════
   Cabestian — le bloc « Le modèle » : typographie du schéma
   ───────────────────────────────────────────────────────────────────────────────────────
   champ.css impose une taille unique à tout le texte du schéma (.graph text). Depuis que
   le schéma raconte un enchaînement, il porte trois registres qui ne peuvent pas avoir la
   même taille : la barre d'étapes, les étiquettes du dessin, les valeurs chiffrées, et la
   légende du bas. On les distingue ici — sélecteurs à deux classes, donc prioritaires sur
   la règle générale de champ.css sans avoir à toucher à ce fichier.

   Ce fichier ne porte AUCUNE couleur : elles sont écrites dans le SVG lui-même. Un schéma
   qui perdrait sa feuille de style resterait juste, seulement moins bien composé.
   ═══════════════════════════════════════════════════════════════════════════════════════ */

/* Le schéma est dessiné à L'ÉCHELLE RÉELLE : 1 unité de viewBox = 1 pixel à l'écran (voir
   l'en-tête de graphes.py). Mesuré, le bloc lui donnait 537 px pour une toile de 520 —
   soit ×1,033. Ce plafond ramène le facteur à 1 exactement : aucune valeur écrite dans le
   SVG ne peut être dépassée à l'écran, et aux fenêtres étroites le dessin rétrécit, ce qui
   ne peut qu'affiner le trait. champ.css pose `.graph{width:100%}` ; cette feuille est
   chargée après, elle l'emporte à spécificité égale. */
.graph{max-width:520px;margin-inline:auto}

/* la barre d'étapes : les cinq opérations, en tête du schéma. Les abscisses sont calculées
   côté générateur avec une avance de 7,26 px par caractère — ne pas changer taille ni
   interlettrage sans reprendre ADV dans graphes.py. */
.graph .t-step{font-size:var(--t-micro);letter-spacing:.12em}
.graph .t-sep{letter-spacing:0}

/* les étiquettes du dessin (BASELINE, SCÉNARIO A, CHEZ VOUS…) */
.graph .t-lbl{font-size:var(--t-micro);letter-spacing:.09em}

/* le second plan chiffré : empreintes, valeurs du diff, retards imputés, noms de briques */
.graph .t-mini{font-size:var(--t-micro);letter-spacing:.05em}

/* la légende du temps en cours, en pied de schéma. Même grammaire que les légendes des
   scènes du hero (.scene-cap) : minuscules, mono, le mot qui opère en accent. */
.graph .t-cap{font-size:var(--t-micro);letter-spacing:.005em}

/* Sous 640 px le schéma tombe à ~0,6× : la barre d'étapes passerait sous 7 px, illisible.
   On la retire plutôt que de la laisser en décoration — la liste des opérations qui suit
   immédiatement le schéma (.map) dit exactement la même chose, en plus détaillé. Le reste
   du texte remonte d'un cran. */
@media (max-width:640px){
  .graph .t-step,.graph .t-sep{display:none}
  .graph .t-lbl{font-size:var(--t-petit)}
  .graph .t-mini{font-size:var(--t-micro)}
  .graph .t-cap{font-size:var(--t-petit)}
}
