/* ============================================================================
   carte-texte.css — LE TEXTE VIVANT DES CARTES (source WCM, 2026-09-03)

   Compagne de carte-texte.js version « UN ÉLÉMENT = UNE ENTRÉE » : le module
   place chaque texte (x/y/taille/ancre dans son GABARIT plat), cette feuille
   porte l'HABILLAGE — polices, graisses, ombres. Polices (décision admin) :
     · Orbitron  : nom, rareté, chiffres ;
     · Rajdhani  : attaques, citation, titre, passif (latin étendu complet —
       c'est l'accentué mal rendu de GillSans qui a déclenché ce lot).

   L'HÔTE pose --ctx-l = la LARGEUR de la carte en px : toutes les tailles en
   découlent, le texte suit n'importe quelle taille d'affichage.

   ⚠️ SOURCE = WaifuCatchManager/public/. Copies : motif arena-board (§6).
   ============================================================================ */
@import url('https://fonts.googleapis.com/css2?family=Rajdhani:wght@500;600;700&family=Orbitron:wght@700;900&display=swap');

.ctx-calque {
  position: absolute; inset: 0; z-index: 5; pointer-events: none;
  --ctx-l: 300px;               /* repli : l'hôte DOIT le poser à la vraie largeur */
  color: #fff;
  text-shadow: 0 1px 3px rgba(0, 0, 0, .85), 0 0 8px rgba(0, 0, 0, .5);
}

/* — l'élément générique : position absolue, y = CENTRE vertical du texte,
     l'ancre décide de quel côté x accroche — */
.ctx-el {
  position: absolute; white-space: nowrap; line-height: 1;
  overflow: hidden; text-overflow: ellipsis;
}
.ctx-a-gauche { transform: translate(0, -50%); }
.ctx-a-centre { transform: translate(-50%, -50%); }
.ctx-a-droite { transform: translate(-100%, -50%); }

/* — habillages par famille — */
.ctx-atk-nom { font-family: 'Rajdhani', 'Segoe UI', sans-serif; font-weight: 700; letter-spacing: -.01em; }
.ctx-atk-chance { font-family: 'Rajdhani', 'Segoe UI', sans-serif; font-weight: 600; font-style: normal; }
.ctx-atk-val { font-family: 'Orbitron', sans-serif; font-weight: 700; }

/* « Passif : » — doré italique comme la maquette */
.ctx-passif-label { font-family: 'Rajdhani', 'Segoe UI', sans-serif; font-weight: 700; font-style: italic; color: #ffd76a; letter-spacing: .03em; }
.ctx-passif-texte { font-family: 'Rajdhani', 'Segoe UI', sans-serif; font-weight: 600; }

.ctx-citation { font-family: 'Rajdhani', 'Segoe UI', sans-serif; font-weight: 600; font-style: italic; opacity: .95; }
.ctx-titre { font-family: 'Rajdhani', 'Segoe UI', sans-serif; font-weight: 700; color: #ffd76a; letter-spacing: .06em; }
/* nom et rareté : italiques comme la maquette (oblique d'Orbitron synthétisée) */
.ctx-nom { font-family: 'Orbitron', sans-serif; font-weight: 900; font-style: italic; letter-spacing: .02em; }

/* 🌈 NOM PRISMATIQUE (2026-09-05, référence admin : le nom foil des Secret Rare
   Yu-Gi-Oh — chaque lettre glisse dans l'arc-en-ciel). Dès que la carte porte un
   vernis (une classe de motif m*-… posée par holoConfig), le nom du calque prend
   le foil : l'encre du nom appartient au vernis, pas au texte courant.
   ⚠️ `text-shadow: none` est OBLIGATOIRE : sur un texte à remplissage transparent
   (background-clip:text), l'ombre se voit À TRAVERS les lettres et boue le foil —
   le relief vient du drop-shadow, qui suit la forme des glyphes. */
.ig-carte-reelle[class*="mf-"] .ctx-nom,
.ig-carte-reelle[class*="mp-"] .ctx-nom,
.ig-carte-reelle[class*="mc-"] .ctx-nom,
.ig-carte-reelle[class*="mv-"] .ctx-nom {
  background: linear-gradient(92deg,
    #e8412c 0%, #f7a01c 16%, #ffe45c 32%, #57d95c 48%,
    #35b6ff 64%, #7a6cff 80%, #d550e0 96%, #e8412c 112%);
  background-size: 160% 100%;
  -webkit-background-clip: text; background-clip: text;
  color: transparent;
  -webkit-text-stroke: .5px rgba(60, 30, 0, .28);
  text-shadow: none;
  filter: drop-shadow(0 1px 1px rgba(0, 0, 0, .35));
  animation: ctxNomFoil 6s ease-in-out infinite alternate;
}
@keyframes ctxNomFoil {
  from { background-position: 0% 0; }
  to   { background-position: 100% 0; }
}
@media (prefers-reduced-motion: reduce) {
  .ig-carte-reelle[class*="mf-"] .ctx-nom, .ig-carte-reelle[class*="mp-"] .ctx-nom,
  .ig-carte-reelle[class*="mc-"] .ctx-nom, .ig-carte-reelle[class*="mv-"] .ctx-nom {
    animation: none; background-position: 50% 0;
  }
}
.ctx-rarete { font-family: 'Orbitron', sans-serif; font-weight: 700; font-style: italic; letter-spacing: .1em; text-transform: capitalize; }

.ctx-stat { font-family: 'Orbitron', sans-serif; font-weight: 900; }

/* 🖼️ les ICÔNES posées par le jeu (éléments, états, ❤/⚔/🛡) : des images du
   calque — largeur pilotée par le gabarit, ratio préservé, jamais cliquables. */
.ctx-icone { height: auto; overflow: visible; text-overflow: clip; }

/* N° du Dex : rouge italique — comme la maquette */
.ctx-dexnum {
  font-family: 'Rajdhani', sans-serif; font-weight: 700; font-style: italic;
  color: #e2574c; text-shadow: 0 1px 2px rgba(0, 0, 0, .35);
}
