/* ─────────────────────────────────────────────────────────────────────────
   Les jetons de l'interface : la seule feuille où une teinte, une taille, un
   espacement, un rayon ou une ombre s'écrit en valeur. Toutes les autres
   feuilles, le code des écrans et la coque Next lisent ces variables.

   Plan des onglets et du design, §7 et lot B (docs/PLAN-ONGLETS-ET-DESIGN.md),
   validé par le propriétaire le 24/09/2026 : « que l'UI / UX et surtout le
   DESIGN SOIT UNIFORME PARTOUT en termes de couleur etc ». Chaque teinte est la
   plus employée de son groupe dans les feuilles d'avant (relevé de
   tools/_audit-design.mjs) : aucune couleur neuve, seulement moins de couleurs.

   🔴 Le bleu ardoise (jetons glace) est réservé aux écrans de la Longue Nuit.
   Partout ailleurs : pierre, bois, cuir, parchemin, or et fer.
   🔴 La couleur ne dit jamais rien toute seule. Un gain est vert, précédé
   d'un « + », et suivi de son nom. Une teinte sans signe ni mot est un défaut.

   Cette feuille se charge avant toutes les autres, y compris dans la coque Next
   et la carte active.
   ───────────────────────────────────────────────────────────────────────── */

/* Les dix chiffres du texte courant. Georgia n'a que des chiffres elzéviriens, sans variante alignée : son zéro est la
   lettre « o », et « 0 route ouverte », « Fer 0 » ou « 0,28 or » se lisaient « o route », « Fer o », « o,28 or »
   (16/10/2026). Les chiffres seuls passent par Palatino, la police des titres, aux chiffres alignés ; sans Palatino
   sur l'appareil, Georgia reprend la main. */
@font-face { font-family: 'Chiffres alignés'; font-style: normal; font-weight: 100 600; unicode-range: U+0030-0039;
  src: local('Palatino Linotype'), local('PalatinoLinotype-Roman'), local('Palatino-Roman'), local('Palatino'); }
@font-face { font-family: 'Chiffres alignés'; font-style: normal; font-weight: 700 900; unicode-range: U+0030-0039;
  src: local('Palatino Linotype Bold'), local('PalatinoLinotype-Bold'), local('Palatino-Bold'), local('Palatino Bold'); }
@font-face { font-family: 'Chiffres alignés'; font-style: italic; font-weight: 100 600; unicode-range: U+0030-0039;
  src: local('Palatino Linotype Italic'), local('PalatinoLinotype-Italic'), local('Palatino-Italic'), local('Palatino Italic'); }
@font-face { font-family: 'Chiffres alignés'; font-style: italic; font-weight: 700 900; unicode-range: U+0030-0039;
  src: local('Palatino Linotype Bold Italic'), local('PalatinoLinotype-BoldItalic'), local('Palatino-BoldItalic'), local('Palatino Bold Italic'); }

:root {
  /* Pierre : les fonds, du plus profond au plus clair. */
  --pierre-0: #0b0907;   /* fond de page, derrière les panneaux */
  --pierre-1: #12100d;   /* fond d'écran */
  --pierre-2: #17130f;   /* panneau */
  --pierre-3: #1d1a15;   /* panneau surélevé, ligne survolée */
  --pierre-4: #2a2018;   /* case, champ de saisie */

  /* Bois et cuir : cadres, onglets, boutons secondaires. */
  --bois-sombre: #2e200e;
  --cuir: #3a2b1c;
  --cuir-clair: #55402a;
  --bois: #5a4426;

  /* Parchemin : bandeaux de titre, documents lus, texte fort. */
  --parchemin-clair: #f3e6c8;
  --parchemin: #e3d5b3;
  --parchemin-bas: #c9b78d;
  --encre: #2a2018;      /* texte sur parchemin */
  --encre-pale: #5c4d3c;

  /* Texte sur pierre. */
  --texte-fort: #f3e6c8;
  --texte: #cbbfa6;
  /* #8a8171 restait sous 4,5:1 sur les panneaux sombres de la création : un cran plus clair. */
  --texte-pale: #938a79;

  /* Or et fer : filets, titres, valeurs, métal. */
  --or-vif: #e6c87f;
  --or: #d3ad5c;
  --or-sourd: #b99545;
  --or-fonce: #8e6d28;
  --fer: #7b8189;
  --fer-sombre: #4a4e54;

  /* Cire : l'action principale, le sceau, le danger. */
  --cire-vif: #a02b23;
  --cire: #7e1d16;
  --cire-fonce: #55130f;

  /* États : jamais seuls, toujours avec un signe et un mot. Le jeton simple
     s'écrit en lettres sur la pierre ; le jeton « fond » remplit une case. */
  --gain: #86a05a;
  --gain-fond: #4e7a44;
  --perte: #e0655d;      /* 5,3 pour 1 sur la pierre */
  --perte-fond: #9a2b26;
  --alerte: #d9a441;
  --alerte-fond: #b8791c;
  --peril: #6f1210;
  --neutre: #6e6a63;
  --ferme: #6e6a63;      /* action verrouillée */

  /* Surnaturel. --barral est le rouge vif du feuillage, distinct de --cire.
     Les cinq jetons glace ne servent qu'aux écrans de la Longue Nuit.
     --glace-nuit et --glace-ardoise sont les fonds de page et de case de la
     Nuit : sans eux, ses fonds sombres tombaient sur la pierre et la page
     perdait son froid (planche du lot B, 24/09/2026). */
  --feu: #d9541c;
  --feu-lueur: #f0a94a;
  --glace: #79c6dc;
  --glace-fond: #14384f;
  --glace-clair: #cfe4ee;
  --glace-ardoise: #17222d;
  --glace-nuit: #0c131a;
  --barral: #b81026;
  --ombre-magie: #5f3a8f;
  --verredragon: #1b1b22;
  --valyrien: #4a4e57;

  /* Les six échelons de qualité d'un équipement. L'échelon se lit à la
     bordure, et il est aussi écrit en toutes lettres. */
  --echelon-1: #8f877a;  /* commun */
  --echelon-2: #4e7a44;  /* bon */
  --echelon-3: #2f6fb0;  /* de maître */
  --echelon-4: #7a4cbb;  /* seigneurial */
  --echelon-5: #c39b3e;  /* légendaire */
  --echelon-6: #d9541c;  /* valyrien, verredragon ouvré, œuf */

  /* Transparences : une seule recette, la teinte du jeton et un pourcentage. */
  --voile-or: color-mix(in srgb, var(--or) 12%, transparent);
  --voile-or-fort: color-mix(in srgb, var(--or) 22%, transparent);
  --voile-noir: color-mix(in srgb, var(--pierre-0) 70%, transparent);
  --filet-pale: color-mix(in srgb, var(--or) 22%, transparent);

  /* Typographie : deux familles, huit tailles. */
  --police-titre: 'Palatino Linotype', Palatino, Georgia, serif;
  --police-corps: 'Chiffres alignés', Georgia, 'Times New Roman', serif;
  --t-1: 0.72rem;   /* étiquette, capitales espacées */
  --t-2: 0.8rem;    /* note, cellule de liste */
  --t-3: 0.9rem;    /* texte courant dense */
  --t-4: 1rem;      /* texte courant */
  --t-5: 1.15rem;   /* intertitre */
  --t-6: 1.35rem;   /* titre de panneau */
  --t-7: 1.7rem;    /* titre d'écran au téléphone */
  --t-8: 2.1rem;    /* titre d'écran au bureau */
  --interligne: 1.4;
  --capitales: 0.08em;

  /* Espacement : sept pas. */
  --e-0: 0.125rem;
  --e-1: 0.25rem;
  --e-2: 0.5rem;
  --e-3: 0.75rem;
  --e-4: 1rem;
  --e-5: 1.5rem;
  --e-6: 2rem;

  /* Rayons, filets, ombres. */
  --rayon: 2px;
  --rayon-case: 4px;
  --rayon-rond: 50%;
  --rayon-pilule: 999px;
  --filet: 1px solid var(--or-fonce);
  --filet-fort: 2px solid var(--or);
  --filet-cuir: 1px solid var(--cuir-clair);
  --ombre-1: 0 1px 2px color-mix(in srgb, #000 50%, transparent);
  --ombre-2: 0 4px 12px color-mix(in srgb, #000 55%, transparent);
  --ombre-3: 0 12px 32px color-mix(in srgb, #000 60%, transparent);
  --ombre-creux: inset 0 1px 0 color-mix(in srgb, var(--parchemin-clair) 8%, transparent), inset 0 -1px 0 color-mix(in srgb, #000 50%, transparent);
  --ombre-texte: 0 1px 3px color-mix(in srgb, var(--pierre-0) 90%, transparent);

  /* Cible tactile. */
  --cible: 44px;

  /* Les noms d'avant, le temps que les feuilles passent aux jetons. */
  --pierre: var(--pierre-1);
  --pierre-claire: var(--pierre-3);
  --or-eteint: var(--or-sourd);
  --sur-pierre: var(--texte);
  --sur-pierre-pale: var(--texte-pale);
  --perte-texte: var(--perte);
  --ombre: var(--ombre-magie);
  --serif-titre: var(--police-titre);
  --serif-corps: var(--police-corps);
  --serif-dit: var(--police-corps);
  --parure-or: var(--or);
  --parure-or-vif: var(--or-vif);
  --parure-or-fonce: var(--or-fonce);
  --parure-sang: var(--cire);
  --parure-sang-vif: var(--cire-vif);
  --parure-noir: var(--pierre-0);
  --parure-noir-pale: var(--pierre-2);
  --parure-vert: var(--gain);
  --parure-rouge: var(--perte);
}