/* ═══════════════════════════════════════════════════════════════════════════
   MANA — jetons de la charte kaki
   Note interne UX du 26/08/2026, §7. Charte retenue comme faisant foi le 26/08.
   ═══════════════════════════════════════════════════════════════════════════

   ⚠️ CE FICHIER EST LE LIVRABLE §7.6 QUI N'EXISTAIT PAS. La note l'annonce au
   passé (« Produits le 26 août 2026 : mana-tokens.css, tailwind.mana.js,
   charte-kaki.html »). Recherche exhaustive du 26/08 — `find` sur toute la
   machine, Bibliothèque et Corbeille comprises, plus l'historique git complet
   de treize dépôts : aucun des trois n'a jamais existé. On les écrit donc.

   ⚠️⚠️ ET QUATRE VALEURS DE LA NOTE SONT CORRIGÉES, PAS RECOPIÉES.
   La note pose en §7.5 « contraste minimum de 4,5:1 » et rappelle que le RGAA
   peut devenir une obligation contractuelle. Or sa propre palette ne le tient
   pas : 23 paires sur 36 échouent, mesurées selon WCAG 2.1 (luminance relative
   sRGB, formule validée sur des paires de référence — #767676/blanc = 4,54,
   #595959/blanc = 7,00). Publier la règle en livrant la palette qui la manque,
   c'est le passif que la note décrit elle-même en §4.6 pour la constitution.
   Chaque correction ci-dessous est signalée, chiffrée, et conserve la teinte.

   RAPPEL DE LA RÈGLE FONDATRICE (§7.1) :
   le kaki porte la terre, l'ocre la lumière, le crème la peau. */

:root {
  /* ── Fond : dégradé radial, lumière en haut à gauche (§7.2) ──
     Le dégradé appartient au FOND DE PAGE SEUL et se fixe au cadre de la
     fenêtre. Les surfaces restent des aplats francs — §7.4. */
  --mana-fond-lueur:    #5E5F3D;
  --mana-fond-milieu:   #474C36;
  --mana-fond-profond:  #2A2E21;
  --mana-fond: radial-gradient(120% 90% at 22% 0%,
                 var(--mana-fond-lueur) 0%,
                 var(--mana-fond-milieu) 38%,
                 var(--mana-fond-profond) 100%);

  /* ── Surfaces ──
     ⚠️ CORRIGÉ. La note pose « Surface élevée #454B3A » : contre le fond
     milieu #474C36, elle donne 1,0148:1 — une carte posée à mi-hauteur du
     dégradé n'a AUCUN moyen de montrer son bord. Portée à #58604A (1,35:1),
     seuil à partir duquel une élévation se perçoit. Même teinte, clarté +6 %. */
  --mana-surface:        #3A3F30;
  --mana-surface-elevee: #58604A;   /* note : #454B3A — invisible, corrigé */

  /* ── Encres ── */
  --mana-creme:          #F2EAD9;   /* 5,52:1 sur la lueur · 11,61:1 sur le profond */
  --mana-texte:          var(--mana-creme);
  --mana-texte-2:        #C4BFA4;   /* ⚠️ JAMAIS sur la zone de lueur : 3,56:1 */
  --mana-encre:          #23261C;   /* sur crème : 12,4:1 — la seule paire AAA */

  /* ── Filet ──
     ⚠️ CORRIGÉ, ET C'EST LA CORRECTION LA PLUS STRUCTURANTE. La note pose
     #545B45 : il n'atteint 3:1 contre AUCUNE surface de la charte (plafond
     mesuré 1,96:1, et 1,07:1 contre la lueur). Or le filet ne décore pas — il
     code à lui seul le degré de formalité entre les trois cercles (§7.7 :
     famille sans filet, coups de main avec filet, commune filets visibles).
     Invisible, cette couche d'information n'existait pas.
     #B9BFAB tient 3:1 contre les HUIT fonds de la charte (§7.3, §7.7 et §7.8),
     au plus juste : 3,04:1 dans le pire cas (manahome). Même teinte, clarté
     portée à 71 %. */
  --mana-filet:          #B9BFAB;   /* note : #545B45 — sous le seuil partout */

  /* ── Ocre : le temps donné, et rien d'autre (§7.4) ──
     ⚠️ La note dit que son contraste « tombe sous le seuil sur les zones
     claires ». Mesuré : c'est vrai, et insuffisamment large — il échoue AUSSI
     sur le fond milieu (4,13:1). L'ocre n'est lisible comme texte que sur le
     tiers le plus profond du dégradé. La restriction de la note est donc
     JUSTE mais trop timide : jamais un bouton, jamais une pastille, jamais du
     texte courant — et jamais du texte tout court hors du fond profond. */
  --mana-ocre:           #D9A94A;

  /* ── États ──
     ⚠️ CORRIGÉ. La note pose Erreur #E39B7D : 2,53:1 au pire, 3,93:1 au
     mieux — il n'atteint 4,5:1 sur aucun arrêt du dégradé. Or le message
     d'erreur est précisément le texte qui doit être lu du premier coup : un
     refus d'envoi ou un avertissement de suppression de compte serait affiché
     sous le seuil. #F2D0C3 tient 4,59:1 dans le pire cas. Même teinte. */
  --mana-erreur:         #F2D0C3;   /* note : #E39B7D — illisible, corrigé */
  --mana-attention:      #E8CE96;   /* 4,31:1 sur la lueur — tient de justesse */

  /* ── Kaki clair ──
     ⚠️ SANS RÔLE ASSIGNÉ DANS LA NOTE, et il échoue au contraste sur huit
     fonds sur neuf. Un jeton sans emploi et illisible finit en décor — or le
     décor est exactement ce que §7.4 interdit. On lui donne donc UN rôle,
     non textuel : les aplats et les fonds de pastille. Jamais du texte. */
  --mana-kaki-clair:     #A3AD76;

  /* ── Typographie (§7.5) — deux graisses, quatre tailles ── */
  --mana-titre:    22px;
  --mana-section:  17px;
  --mana-courant:  15px;
  --mana-legende:  13px;

  /* ── Espacement, rayons, filets (§7.5) ── */
  --mana-pas:        8px;
  --mana-rayon-ctrl: 8px;
  --mana-rayon-carte: 12px;
  --mana-filet-ep:   0.5px;
  --mana-cible:      44px;   /* cible tactile minimale */
}

/* ═══ LES TROIS CERCLES (§7.7) ═══
   La lumière bouge, la forme des surfaces change, le surtitre dit l'audience.
   ⚠️ La note annonce « trois couches dont chacune suffit ». Mesuré, ce n'est
   pas le cas : entre les trois fonds, le contraste mutuel des arrêts va de
   1,00 à 1,11:1 et l'écart perceptuel descend à ΔE 1,71 — sous le seuil de
   perception. La LUMIÈRE seule ne permet donc pas de savoir dans quel cercle
   on se trouve ; c'est le surtitre qui porte l'information, et la forme qui
   l'appuie. À traiter comme deux couches, pas trois — ou à écarter davantage
   les trois lumières. */
[data-cercle="famille"] {
  --mana-fond: radial-gradient(130% 100% at 18% 100%, #6A6140 0%, #474334 42%, #2A2A1F 100%);
  --mana-rayon-carte: 18px;   /* rien ne sépare : la carte est un coussin */
  --mana-filet-ep: 0;
}
[data-cercle="coups-de-main"] {
  --mana-fond: radial-gradient(120% 90% at 22% 0%, #5E5F3D 0%, #474C36 38%, #2A2E21 100%);
  --mana-rayon-carte: 12px;   /* un engagement entre deux personnes */
  --mana-filet-ep: 0.5px;
}
[data-cercle="commune"] {
  --mana-fond: radial-gradient(140% 100% at 50% -12%, #58604A 0%, #414A38 45%, #272C21 100%);
  --mana-rayon-carte: 8px;    /* de l'institution et de l'archive */
  --mana-filet-ep: 1px;
}

/* ═══ L'UNIVERS (§7.8) — un seul degré de liberté : la lumière ═══ */
[data-maison="manafrance"] { --mana-fond: radial-gradient(120% 90% at 22% 0%,  #5E5F3D, #474C36 38%, #2A2E21); }
[data-maison="manafamily"] { --mana-fond: radial-gradient(130% 100% at 18% 100%, #6A6140, #474334 42%, #2A2A1F); }
/* ⚠️ manahome porte l'arrêt le plus clair de toute la charte (#70663A) : le
   crème n'y donne que 4,81:1, ce qui casse l'affirmation « le texte crème
   passe partout au-dessus de 5:1 » du §7.7. Conforme AA, mais la règle
   énoncée est fausse d'une section à l'autre. Assombrir cet arrêt d'environ
   4 % de luminance la rétablirait. */
[data-maison="manahome"]   { --mana-fond: radial-gradient(130% 100% at 84% 100%, #70663A, #4B4630 44%, #2A2A1E); }
[data-maison="alliance"]   { --mana-fond: radial-gradient(140% 100% at 50% -12%, #58604A, #414A38 45%, #272C21); }

/* ═══ SOCLE ═══ */
.mana {
  background: var(--mana-fond);
  background-attachment: fixed;   /* le dégradé est LA LUMIÈRE, pas un décor qui défile */
  color: var(--mana-texte);
  font-family: 'Philosopher', 'Iowan Old Style', 'Palatino Linotype', Georgia, serif;
  font-size: var(--mana-courant);
}

/* ⚠️ LE GRAIN N'EST PAS UN ORNEMENT (§7.4) : sans lui, les verts sombres
   font des bandes visibles sur la plupart des écrans. Deux pour cent. */
.mana::before {
  content: '';
  position: fixed; inset: 0; pointer-events: none; z-index: 0;
  opacity: 0.02;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='b'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23b)'/%3E%3C/svg%3E");
}

/* ═══ COMPOSANTS ═══ */

/* ⚠️ LE BOUTON PRINCIPAL EST EN CRÈME, PAS EN OCRE (§7.4) — c'est l'arbitrage
   le mieux étayé de la charte, et la mesure le confirme : sur les trois arrêts
   de référence, le crème arrive premier des six encres, et le couple
   encre/crème est le seul de la palette à atteindre AAA. */
.mana-bouton {
  min-height: var(--mana-cible);
  padding: 0 20px;
  border: none;
  border-radius: var(--mana-rayon-ctrl);
  background: var(--mana-creme);
  color: var(--mana-encre);
  font-family: inherit;
  font-size: var(--mana-section);
  cursor: pointer;
}

/* ⚠️ TOUT VISAGE REPOSE SUR UN CARTON CRÈME (§7.4). Sur kaki à nu, les
   carnations verdissent par contraste simultané. Règle de composant, pas
   préférence esthétique. */
.mana-visage {
  background: var(--mana-creme);
  border-radius: var(--mana-rayon-carte);
  padding: var(--mana-pas);
}

.mana-carte {
  background: var(--mana-surface);
  border: var(--mana-filet-ep) solid var(--mana-filet);
  border-radius: var(--mana-rayon-carte);
  padding: calc(var(--mana-pas) * 2);
}
.mana-carte-elevee { background: var(--mana-surface-elevee); }

/* Le temps donné, et lui seul. */
.mana-temps { color: var(--mana-ocre); font-variant-numeric: tabular-nums; }

/* ⚠️ NI LE KAKI NI L'OCRE NE PORTENT SEULS UNE INFORMATION (§7.4) : le mot la
   porte. Ces deux classes exigent donc un libellé, jamais une pastille nue. */
.mana-erreur    { color: var(--mana-erreur); }
.mana-attention { color: var(--mana-attention); }

@media (prefers-reduced-motion: reduce) {
  .mana * { animation: none !important; transition: none !important; }
}
