/* ──────────────────────────────────────────────────────────────────────────────
   tz-carte.css — HABILLAGE DE LA CARTE TROPHIZ, CONSTRUIT EN DIRECT
   ------------------------------------------------------------------------------
   Demande de Rudolf (24/09/2026) : « ces icônes ne doivent pas être en dur dans
   l'illustration car il faut les calibrer et les faire varier, il faut donc
   séparer l'illustration de la carte qui sera construite en live ».

   Principe : l'illustration est NUE (une simple image posée dans .tzc-illu) et
   tout le reste (cadre, quart de famille, médaillons, nom, types, pictogramme
   d'effet, sablier, couronne) est dessiné par ce fichier, par-dessus. Rien
   n'est cuit dans une image, donc tout est recalibrable ici, en un seul endroit.

   Emplacements FIXES, toujours les mêmes d'une carte à l'autre :
     coin haut gauche ...... QUART DE CERCLE de famille (un secteur par famille)
     médaillon haut gauche . PUISSANCE, acier brossé, posé SUR le quart (il le
                             mord un peu : c'est un effet de profondeur voulu)
     médaillon haut droit .. RESSOURCE Kŧ, or brossé
     coin haut droit ....... COURONNE (premium seulement) et, à sa gauche, le
                             SABLIER (effet limité dans le temps seulement)
     bas gauche de l'illu ... TYPE(S), fond de la couleur de la famille, texte noir
     bas droit de l'illu .... PICTOGRAMME de l'effet
     bandeau sous l'illu .... NOM, jamais tronqué, taille réduite automatiquement
     pied ................... discipline ou marque, effet, référence de la copie

   Toutes les tailles sont en cqw (1 cqw = 1 % de la largeur de la carte) : la
   carte est donc lisible à l'identique en main, en deck, en collection et en
   plein écran. Aucune valeur en px, aucune valeur en rem.

   Contraste des étiquettes de type (calculé le 24/09/2026, WCAG 2) :
     sponsor #e8871a  noir 7,91 / blanc 2,65
     athlète #c9a227  noir 8,68 / blanc 2,42
     agent   #aeb4bd  noir 10,06 / blanc 2,09
     club    #a9713b  noir 5,11 / blanc 4,11
     fan     #e9e9e6  noir 17,26 / blanc 1,22
     staff   #4db6ac  noir 8,60 / blanc 2,44   (01/10/2026, staff technique)
     équip.  #8fb8de  noir 10,08 / blanc 2,08  (03/10/2026, famille ÉQUIPEMENT, bleu acier)
   Le blanc n'atteint 4,5 sur aucune des cinq ; le noir les passe toutes. Donc
   texte NOIR partout, ce n'est pas une préférence, c'est la mesure.
   ────────────────────────────────────────────────────────────────────────────── */

.tzc {
  --tzc-or:        #e8c26a;
  --tzc-or-clair:  #fff3c4;
  --tzc-or-sombre: #8a6a1e;
  --tzc-fond:      #0b0b10;
  --tzc-teinte:    #2a2a36;   /* redéfinie par type ci-dessous */
  --tzc-encre:     #f3e3b3;

  /* Les cinq couleurs de famille, mot pour mot celles de Rudolf. */
  --tzc-fam-entreprise: #e8871a;
  --tzc-fam-athlete:    #c9a227;
  --tzc-fam-agent:      #aeb4bd;
  --tzc-fam-club:       #a9713b;
  --tzc-fam-supporter:  #e9e9e6;
  --tzc-fam-staff:      #4db6ac;   /* STAFF technique (01/10/2026), sarcelle : noir 8,60 */
  --tzc-fam-equipement: #8fb8de;   /* ÉQUIPEMENT (03/10/2026), bleu acier : noir 10,08 */
  --tzc-fam:            #2a2a36;   /* famille principale, posée par type ci-dessous */

  /* Les emplacements, paramétrables d'ici sans toucher au balisage. */
  --tzc-illu-x:     4.5%;     /* marge gauche et droite de la fenêtre d'illustration */
  --tzc-illu-y:     8.6%;     /* haut de la fenêtre, en % de la HAUTEUR de la carte */
  --tzc-illu-h:     67%;      /* hauteur de la fenêtre, en % de la HAUTEUR de la carte */
  --tzc-quart:      21.5cqw;  /* rayon du quart de cercle : la moitié des 43 % du schéma */
  --tzc-medaille:   20cqw;    /* diamètre des deux médaillons (puissance et Kŧ) */
  --tzc-medaille-y: 3cqw;     /* leur retrait depuis le haut de la fenêtre */
  --tzc-coin:       10.4cqw;   /* hauteur de la couronne et du sablier, dans le bandeau du haut */

  position: relative;
  aspect-ratio: 2 / 3;
  container-type: inline-size;
  border-radius: 5.6% / 3.7%;
  overflow: hidden;
  background:
    radial-gradient(120% 80% at 50% 0%, color-mix(in srgb, var(--tzc-teinte) 85%, #fff 0%) 0%, transparent 60%),
    linear-gradient(170deg, color-mix(in srgb, var(--tzc-teinte) 70%, #000) 0%, var(--tzc-fond) 55%, #05050a 100%);
  box-shadow: 0 6px 18px rgba(0, 0, 0, .6);
  cursor: pointer;
  user-select: none;
  transition: transform .15s, box-shadow .2s;
}
.tzc:hover { transform: translateY(-4px) scale(1.02); box-shadow: 0 12px 28px rgba(232, 194, 106, .25); }

/* Teinte de fond et couleur de famille. Le mot « entreprise » est la valeur en
   base ; l'étiquette affichée est SPONSOR (voir tz-carte.js). Ne jamais renommer
   la valeur en base : le moteur de jeu compare card_type à ces chaînes exactes. */
/* Le fond de la carte est la couleur de famille assombrie : plus de bleu nuit
   ni de vert, qui ne sont dans aucune charte (critique du 24/09). */
.tzc--athlete    { --tzc-fam: var(--tzc-fam-athlete); }
.tzc--agent      { --tzc-fam: var(--tzc-fam-agent); }
.tzc--supporter  { --tzc-fam: var(--tzc-fam-supporter); }
.tzc--entreprise { --tzc-fam: var(--tzc-fam-entreprise); }
.tzc--club       { --tzc-fam: var(--tzc-fam-club); }
.tzc--staff      { --tzc-fam: var(--tzc-fam-staff); }
.tzc--equipement { --tzc-fam: var(--tzc-fam-equipement); }
.tzc--athlete, .tzc--agent, .tzc--supporter, .tzc--entreprise, .tzc--club, .tzc--staff, .tzc--equipement {
  --tzc-teinte: color-mix(in srgb, var(--tzc-fam) 32%, #111); }
.tzc--autre      { --tzc-teinte: #2a2a36; }
.tzc--premium    { --tzc-teinte: #4a3608; }

/* ── Textures métalliques, en CSS pur ────────────────────────────────────────
   Pas d'image : un dégradé conique donne les reflets d'un métal tourné, des
   rayures fines répétées donnent le brossage, un halo radial pose la lumière
   (toujours en haut à gauche, comme sur les pictogrammes d'Astra). Ça pèse
   zéro octet, ça se recadre à toute taille et ça reste net. */
.tzc {
  --tzc-brosse: repeating-linear-gradient(115deg,
      rgba(255, 255, 255, .10) 0 .25cqw, rgba(255, 255, 255, 0) .25cqw .7cqw,
      rgba(0, 0, 0, .10) .7cqw .95cqw, rgba(0, 0, 0, 0) .95cqw 1.5cqw);
  --tzc-metal-or: conic-gradient(from 215deg at 50% 50%,
      #b98a2a, #f6dc8c 12%, #c99b3a 24%, #7a5a16 36%, #e9c76a 50%,
      #a8802a 62%, #fff0b8 74%, #b98a2a 86%, #6d4f12 94%, #b98a2a);
  --tzc-metal-acier: conic-gradient(from 215deg at 50% 50%,
      #5a6270, #c3cad6 12%, #6a7381 24%, #2a2f38 36%, #aeb6c3 50%,
      #4e5563 62%, #dfe5ee 74%, #5a6270 86%, #23272e 94%, #5a6270);
}

/* Liseré or : dessiné, pas photographié. */
.tzc-cadre {
  position: absolute; inset: 2.4cqw;
  border: .9cqw solid var(--tzc-or);
  border-radius: 4.2% / 2.9%;
  /* Le cadre est un LISERÉ : il ne doit rien peindre à l'intérieur, sans quoi il
     recouvrirait l'illustration. D'où la découpe par masque, qui ne garde que
     la bordure du dégradé. */
  background: linear-gradient(160deg, var(--tzc-or-sombre), var(--tzc-or) 35%, var(--tzc-or-clair) 50%, var(--tzc-or) 65%, var(--tzc-or-sombre));
  -webkit-mask: linear-gradient(#000 0 0) padding-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
          mask: linear-gradient(#000 0 0) padding-box exclude, linear-gradient(#000 0 0);
  box-shadow: inset 0 0 0 .25cqw rgba(0, 0, 0, .55);
  pointer-events: none;
  z-index: 2;
}
.tzc--premium .tzc-cadre { border-width: 1.3cqw; box-shadow: 0 0 4cqw rgba(232, 194, 106, .35) inset; }

/* ── L'illustration, nue ──────────────────────────────────────────────────── */
.tzc-illu {
  position: absolute;
  left: var(--tzc-illu-x); right: var(--tzc-illu-x);
  top: var(--tzc-illu-y); height: var(--tzc-illu-h);
  overflow: hidden;
  border-radius: 3.2% / 2.2%;
  background: #07070c;
  display: flex; align-items: center; justify-content: center;
  z-index: 1;
}
.tzc-illu img { width: 100%; height: 100%; object-fit: cover; display: block; }
.tzc-illu img.tzc-icone { width: 52%; height: 52%; object-fit: contain; opacity: .3;
  filter: brightness(0) invert(1) drop-shadow(0 0 1.5cqw rgba(255, 255, 255, .4)); }
/* Voile bas : sert UNIQUEMENT à asseoir les pastilles de type, il ne masque pas le sujet. */
.tzc-illu::after {
  content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 30%;
  background: linear-gradient(to top, rgba(0, 0, 0, .68), transparent);
  pointer-events: none;
}

/* ── Le quart de cercle de famille, ancré au coin haut gauche ─────────────────
   Il remplace l'ancien petit symbole d'enseigne. Une seule famille = un quart
   plein ; plusieurs = un éventail, un secteur par famille (tz-carte.js pose le
   dégradé conique dans --tzc-quart-fond). Brossage métallique par-dessus. */
.tzc-quart {
  /* Ancré au coin INTÉRIEUR du liseré (inset 2,4 + bordure 0,9) : le liseré
     reste continu et le quart ne déborde plus dans la marge de la carte. */
  position: absolute; left: 3.3cqw; top: 3.3cqw; z-index: 1;
  width: var(--tzc-quart); aspect-ratio: 1;
  border-bottom-right-radius: 100%;
  border-top-left-radius: 2.6cqw;
  /* Pas de rayures ici : sur une surface colorée elles font ruban de chantier.
     Un seul halo, en haut à gauche, suffit à dire « métal ». */
  background:
    radial-gradient(circle at 10% 10%, rgba(255, 255, 255, .5), rgba(255, 255, 255, 0) 60%),
    linear-gradient(135deg, rgba(255, 255, 255, 0) 55%, rgba(0, 0, 0, .18)),
    var(--tzc-quart-fond, conic-gradient(from 90deg at 0 0, var(--tzc-fam) 0deg 90deg));
  box-shadow:
    inset -.35cqw -.35cqw 0 rgba(0, 0, 0, .55),      /* arête intérieure sombre */
    .5cqw .5cqw 1.4cqw rgba(0, 0, 0, .6);            /* ombre portée sur l'illustration */
  pointer-events: none;
}
/* Liseré or sur tout l'arc, séparé pour ne pas être rogné par le dégradé. */
.tzc-quart::after {
  content: ''; position: absolute; inset: 0;
  border-bottom-right-radius: 100%;
  box-shadow: inset 0 0 0 .55cqw var(--tzc-or), inset 0 0 1.4cqw rgba(0, 0, 0, .35);
}

/* ── Couronne (premium) et sablier (effet limité dans le temps) ─────────────
   Le coin haut droit, à l'ancienne place de la couronne. Le sablier se pose à
   sa gauche ; les deux ont un emplacement fixe, présent ou non. */
.tzc-couronne, .tzc-sablier {
  position: absolute; z-index: 4; top: 1.2cqw;
  height: var(--tzc-coin); width: calc(var(--tzc-coin) * 1.25);
  display: flex; align-items: center; justify-content: center;
  pointer-events: none;
}
.tzc-couronne { right: 4.6cqw; }
.tzc-sablier  { right: calc(4.6cqw + var(--tzc-coin) * 1.25 + .6cqw); width: calc(var(--tzc-coin) * .9); }
.tzc-couronne img, .tzc-sablier img {
  width: 100%; height: 100%; object-fit: contain; display: block;
  filter: drop-shadow(0 .3cqw .5cqw rgba(0, 0, 0, .85));
}
.tzc-couronne img { filter: drop-shadow(0 .3cqw .5cqw rgba(0, 0, 0, .85)) drop-shadow(0 0 1.2cqw rgba(255, 215, 0, .35)); }
/* Repli si l'image manque : un glyphe, mais dans l'or de la carte. */
.tzc-couronne span, .tzc-sablier span { font-size: calc(var(--tzc-coin) * .9); line-height: 1; color: var(--tzc-or); text-shadow: 0 0 1cqw #000; }

/* ── Les deux médaillons : même diamètre, même hauteur, un à gauche un à droite ─ */
.tzc-puissance, .tzc-kt {
  position: absolute; z-index: 5;
  top: calc(var(--tzc-illu-y) + var(--tzc-medaille-y));
  width: var(--tzc-medaille); aspect-ratio: 1; border-radius: 50%;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  line-height: 1; font-family: Orbitron, system-ui, sans-serif; font-weight: 900;
  letter-spacing: -.02em; text-align: center;
}
/* À 7 cqw du bord et 3 cqw sous le haut de la fenêtre, le disque de 20 cqw
   entre d'environ 1 cqw dans l'arc du quart (rayon 21,5) : il le mord, sans
   le cacher. Si on change --tzc-quart ou --tzc-medaille, revérifier ce point. */
.tzc-puissance { left: 7cqw; }
.tzc-kt        { right: 7cqw; }

/* Puissance : médaillon d'acier brossé. Il est posé SUR le quart de cercle et
   le mord légèrement ; l'ombre portée creuse la marche entre les deux. */
.tzc-puissance {
  background:
    radial-gradient(circle at 32% 26%, rgba(255, 255, 255, .55), rgba(255, 255, 255, 0) 42%),
    var(--tzc-brosse),
    var(--tzc-metal-acier);
  /* Deux ombres : une courte et dense (le contact avec le quart, qui creuse la
     marche), une longue et douce (le relief sur l'illustration). */
  box-shadow: 0 0 0 .35cqw #0a0c10, 0 0 0 .8cqw var(--tzc-or),
              .3cqw .4cqw .5cqw rgba(0, 0, 0, .95), .8cqw 1.1cqw 2cqw rgba(0, 0, 0, .6),
              inset 0 .4cqw .6cqw rgba(255, 255, 255, .35), inset 0 -.6cqw 1cqw rgba(0, 0, 0, .55);
  color: #f4f7ff; text-shadow: 0 .25cqw .5cqw rgba(0, 0, 0, .95), 0 0 .2cqw #000;
}
/* Ressource Kŧ : médaillon d'or brossé, même construction. */
.tzc-kt {
  background:
    radial-gradient(circle at 32% 26%, rgba(255, 255, 255, .7), rgba(255, 255, 255, 0) 42%),
    var(--tzc-brosse),
    var(--tzc-metal-or);
  box-shadow: 0 0 0 .35cqw #3a2c08, 0 0 0 .8cqw var(--tzc-or),
              .3cqw .4cqw .5cqw rgba(0, 0, 0, .95), .8cqw 1.1cqw 2cqw rgba(0, 0, 0, .6),
              inset 0 .4cqw .6cqw rgba(255, 255, 255, .6), inset 0 -.6cqw 1cqw rgba(0, 0, 0, .45);
  /* Chiffre presque noir : le brun moyen ne tenait plus à 130 px. */
  color: #150f02; text-shadow: 0 .2cqw 0 rgba(255, 255, 255, .45);
}
/* Financement d'un sponsor : même encre, le « + » suffit à le distinguer (le
   vert sur or vibrait et ajoutait une troisième couleur d'accent). */
.tzc-kt.tzc-kt--fond { color: #150f02; }
/* Carte NÉGATIVE (01/10/2026) : ponction de la finance adverse, « −5 » sur émail rouge (celui du soutien),
   chiffre blanc. Règle des signes : « − » et rouge pour un malus, « + » pour le seul financement à son profit. */
.tzc-kt.tzc-kt--malus {
  background: radial-gradient(circle at 32% 26%, #ff8a8a 0%, #c8102e 45%, #6d0616 100%);
  box-shadow: 0 0 0 .5cqw #fff1f1, 0 0 0 .9cqw #5a0010,
              .3cqw .4cqw .5cqw rgba(0, 0, 0, .95), .8cqw 1.1cqw 2cqw rgba(0, 0, 0, .6),
              inset 0 .4cqw .6cqw rgba(255, 255, 255, .35);
  color: #fff; text-shadow: 0 .25cqw .5cqw rgba(0, 0, 0, .8);
}

/* MALUS INFLIGÉ À L'ADVERSAIRE (04/10/2026, ex. Contre-Com « −2 ») : petit médaillon d'émail rouge SOUS celui des Kŧ. */
.tzc-malus-adv {
  position: absolute; z-index: 5; right: 9.5cqw;
  top: calc(var(--tzc-illu-y) + var(--tzc-medaille-y) + var(--tzc-medaille) + 2cqw);
  width: calc(var(--tzc-medaille) * .75); aspect-ratio: 1; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-family: Orbitron, system-ui, sans-serif; font-weight: 900; line-height: 1;
  background: radial-gradient(circle at 32% 26%, #ff8a8a 0%, #c8102e 45%, #6d0616 100%);
  box-shadow: 0 0 0 .5cqw #fff1f1, 0 0 0 .9cqw #5a0010,
              .3cqw .4cqw .5cqw rgba(0, 0, 0, .95), .8cqw 1.1cqw 2cqw rgba(0, 0, 0, .6),
              inset 0 .4cqw .6cqw rgba(255, 255, 255, .35);
  color: #fff; text-shadow: 0 .25cqw .5cqw rgba(0, 0, 0, .8);
}
.tzc-malus-adv--seul { top: calc(var(--tzc-illu-y) + var(--tzc-medaille-y)); right: 7cqw; }
.tzc-malus-adv b { font-size: 6.4cqw; white-space: nowrap; }
.tzc-malus-adv b.tzc-long { font-size: 4.4cqw; }
.tzc-malus-adv .tzc-moins { display: inline-block; transform: scale(1.3, 1.5); margin-right: .4cqw; }
.tzc-puissance b, .tzc-kt b       { display: block; font-size: 8cqw; font-weight: 900; }
.tzc-puissance small, .tzc-kt small { display: block; font-size: 3cqw; font-weight: 800; letter-spacing: .06em; margin-top: .3cqw; }
/* Une valeur longue (« +0.5 ») ne doit pas déborder du disque. */
.tzc-puissance b.tzc-long, .tzc-kt b.tzc-long { font-size: 5.4cqw; }

/* DOUBLE POUVOIR (04/10/2026, cartes de Delf) : préparation « +2 » d'un athlète, petit rond sarcelle SOUS sa puissance. */
.tzc-prep-ath {
  position: absolute; z-index: 5; left: 9.5cqw;
  top: calc(var(--tzc-illu-y) + var(--tzc-medaille-y) + var(--tzc-medaille) + 2cqw);
  width: calc(var(--tzc-medaille) * .75); aspect-ratio: 1; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-family: Orbitron, system-ui, sans-serif; font-weight: 900; line-height: 1;
  background: radial-gradient(circle at 32% 26%, #a6e6de 0%, #2f8f86 45%, #134a45 100%);
  box-shadow: 0 0 0 .5cqw #e9fbf8, 0 0 0 .9cqw #0f3d39,
              .3cqw .4cqw .5cqw rgba(0, 0, 0, .95), .8cqw 1.1cqw 2cqw rgba(0, 0, 0, .6),
              inset 0 .4cqw .6cqw rgba(255, 255, 255, .35);
  color: #fff; text-shadow: 0 .25cqw .5cqw rgba(0, 0, 0, .8);
}
.tzc-prep-ath b { font-size: 6.4cqw; letter-spacing: -.02em; }
/* Le « + » (et le chiffre) d'un disque posé sur l'illustration est CONTOURÉ d'un liseré sombre net (Rudolf, 14/10/2026,
   guide-creation-jeux §7) : il se détache de tout fond. paint-order met le trait SOUS le remplissage (le signe ne maigrit pas). */
.tzc-prep-ath b { -webkit-text-stroke: .7cqw #062624; paint-order: stroke fill; }
.tzc-prep-ath .tzc-plus { display: inline-block; transform: scale(1.12); margin-right: .2cqw; }
/* Carte SANS puissance (sponsor qui prépare : ABN-RNC) : le même disque À LA PLACE de la puissance, centré sur son emplacement. */
/* DEVIENT FAN (14/10/2026, François Pina) : même place et même taille que le « +2 » de Delf ; cœur jaune défini plus bas. */
.tzc-fan-ath--2 { top: calc(var(--tzc-illu-y) + var(--tzc-medaille-y) + var(--tzc-medaille) * 1.75 + 4cqw); }
.tzc-prep-ath--place { top: calc(var(--tzc-illu-y) + var(--tzc-medaille-y) + var(--tzc-medaille) * .125); }

/* ── Symbole propre aux cartes SANS puissance (Rudolf, 27/09/2026) ─────────
   Seuls les athlètes portent le médaillon de puissance. À la même place :
     RECHERCHE (agent, club) : émail noir cerclé d'acier, loupe d'acier clair ;
     SOUTIEN (supporter)     : émail rouge, cœur et « +0,5 » en blanc.
   Ni chiffre sur acier brossé, ni forme du médaillon de puissance : on ne peut
   pas confondre. Mêmes cotes que .tzc-puissance pour ne rien décaler. */
.tzc-symbole {
  position: absolute; z-index: 5; left: 7cqw;
  top: calc(var(--tzc-illu-y) + var(--tzc-medaille-y));
  width: var(--tzc-medaille); aspect-ratio: 1; border-radius: 50%;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  line-height: 1; font-family: Orbitron, system-ui, sans-serif; font-weight: 900;
}
.tzc-symbole--recherche {
  background: radial-gradient(circle at 32% 26%, #3a4150 0%, #14171d 58%, #07080b 100%);
  box-shadow: 0 0 0 .6cqw #c3cad6, 0 0 0 1.1cqw #23272e,
              .3cqw .4cqw .5cqw rgba(0, 0, 0, .95), .8cqw 1.1cqw 2cqw rgba(0, 0, 0, .6),
              inset 0 .4cqw .8cqw rgba(255, 255, 255, .18);
  color: #e6ebf3;
}
.tzc-symbole--recherche svg { width: 62%; height: 62%; display: block;
  filter: drop-shadow(0 .3cqw .4cqw rgba(0, 0, 0, .9)); }
/* SOUTIEN (Fans) : le cœur jaune est défini plus bas (CŒUR JAUNE des FANS, 14/10/2026) ; plus d'émail rouge ici. */
/* PRÉPARATION (staff, 01/10/2026) : émail sarcelle, « +2 » blanc = bonus du prochain athlète mis en jeu. */
.tzc-symbole--prep {
  background: radial-gradient(circle at 32% 26%, #a6e6de 0%, #2f8f86 45%, #134a45 100%);
  box-shadow: 0 0 0 .5cqw #e9fbf8, 0 0 0 .9cqw #0f3d39,
              .3cqw .4cqw .5cqw rgba(0, 0, 0, .95), .8cqw 1.1cqw 2cqw rgba(0, 0, 0, .6),
              inset 0 .4cqw .6cqw rgba(255, 255, 255, .35);
  color: #fff; text-shadow: 0 .25cqw .5cqw rgba(0, 0, 0, .8);
}
.tzc-symbole--prep b { font-size: 7cqw; font-weight: 900; letter-spacing: -.02em; }
/* ÉQUIPEMENT (03/10/2026) : émail bleu acier, « +1 » blanc = bonus de chaque athlète associé en jeu. */
.tzc-symbole--equipe {
  background: radial-gradient(circle at 32% 26%, #d4e6f7 0%, #4f7fae 45%, #1d3a57 100%);
  box-shadow: 0 0 0 .5cqw #eef5fc, 0 0 0 .9cqw #16314b,
              .3cqw .4cqw .5cqw rgba(0, 0, 0, .95), .8cqw 1.1cqw 2cqw rgba(0, 0, 0, .6),
              inset 0 .4cqw .6cqw rgba(255, 255, 255, .35);
  color: #fff; text-shadow: 0 .25cqw .5cqw rgba(0, 0, 0, .8);
}
.tzc-symbole--equipe b { font-size: 7cqw; font-weight: 900; letter-spacing: -.02em; }

/* ── Le ou les TYPES, empilés en bas à gauche de l'illustration ──────────────
   Fond = couleur de la famille, texte noir (voir le calcul en tête de fichier). */
.tzc-types {
  position: absolute; z-index: 4;
  left: calc(var(--tzc-illu-x) + 2.2cqw);
  top: calc(var(--tzc-illu-y) + var(--tzc-illu-h));
  /* Ancré par le BAS : la pile grandit vers le haut quand la carte porte
     plusieurs types, sans jamais déborder sur le bandeau du nom. */
  transform: translateY(calc(-100% - 2.4cqw));
  margin: 0; padding: 0; list-style: none;
  display: flex; flex-direction: column-reverse; align-items: flex-start;
  gap: .8cqw;
  max-width: 64cqw;
}
.tzc-type {
  display: block;
  font-size: 4.2cqw; font-weight: 800; letter-spacing: .1em; text-transform: uppercase;
  line-height: 1; padding: 1.4cqw 2.6cqw;
  color: #000;
  --tzc-type-fond: var(--tzc-fam);
  /* Un reflet très léger en haut (blanc à 18 %) : il éclaircit, donc il ne
     peut qu'augmenter le contraste du texte noir. */
  background: var(--tzc-type-fond);       /* à plat : un dégradé fait bouton web */
  border-radius: 1cqw;
  box-shadow: 0 0 0 .25cqw rgba(0, 0, 0, .6), 0 .4cqw .8cqw rgba(0, 0, 0, .6);
  white-space: nowrap; overflow: hidden; text-overflow: clip;
}
.tzc-type--entreprise { --tzc-type-fond: var(--tzc-fam-entreprise); }
.tzc-type--athlete    { --tzc-type-fond: var(--tzc-fam-athlete); }
.tzc-type--agent      { --tzc-type-fond: var(--tzc-fam-agent); }
.tzc-type--club       { --tzc-type-fond: var(--tzc-fam-club); }
.tzc-type--supporter  { --tzc-type-fond: var(--tzc-fam-supporter); }
.tzc-type--staff      { --tzc-type-fond: var(--tzc-fam-staff); }
.tzc-type--equipement { --tzc-type-fond: var(--tzc-fam-equipement); }
/* SPORTIF AMATEUR (Rudolf, 01/10/2026) : même carte que l'athlète, étiquette « SPORTIF AMATEUR » sur JAUNE PASTEL,
   nettement plus clair que l'or de l'athlète (#c9a227) ; texte noir : contraste 18,9 sur #fff3a6. Libellé long :
   espacement des lettres réduit pour tenir dans la largeur de l'étiquette. */
.tzc-type--athlete.tzc-type--amateur { --tzc-type-fond: #fff3a6; letter-spacing: .04em; }
/* ATHLÈTE SPONSORISÉ : bandeau « ATHLÈTE » à la couleur des athlètes (Rudolf 03/10/2026 soir ; étiquette bleue retirée). */
/* Types secondaires : même couleur de famille, un cran plus petits. */
.tzc-type--secondaire { font-size: 3.6cqw; padding: 1.1cqw 2.2cqw; }
.tzc-type--reste { --tzc-type-fond: #d9d9d4; opacity: .9; }

/* ── Pictogramme de l'effet, en bas à droite de l'illustration ─────────────
   Image de la série d'Astra (or brossé sur transparent). Repli : le glyphe. */
.tzc-effet {
  position: absolute; z-index: 4;
  right: calc(var(--tzc-illu-x) + 2.2cqw);
  top: calc(var(--tzc-illu-y) + var(--tzc-illu-h));
  transform: translateY(calc(-100% - 2.4cqw));
  width: 11cqw; height: 11cqw;
  display: flex; align-items: center; justify-content: center;
  pointer-events: none;
}
.tzc-effet img { width: 100%; height: 100%; object-fit: contain; display: block;
  filter: drop-shadow(0 .4cqw .7cqw rgba(0, 0, 0, .9)); }
.tzc-effet span { font-size: 7cqw; line-height: 1; filter: drop-shadow(0 .4cqw .6cqw #000); }

/* ── Le NOM : jamais tronqué, jamais démesuré ─────────────────────────────── */
.tzc-nom {
  position: absolute; z-index: 3;
  left: var(--tzc-illu-x); right: var(--tzc-illu-x);
  top: calc(var(--tzc-illu-y) + var(--tzc-illu-h) + 1.4%);
  height: 8.6%;
  display: flex; align-items: center; justify-content: center;
  text-align: center; overflow: hidden;
  color: var(--tzc-encre); font-weight: 800; letter-spacing: .02em;
  text-transform: uppercase; text-shadow: 0 .2cqw .4cqw #000;
  font-size: 7.2cqw;                 /* valeur de départ, réduite par tz-carte.js si besoin */
  line-height: 1.2;                  /* 1.06 rognait les accents des majuscules (Ë de Pierre-Mickaël, Rudolf 01/10/2026) */
}
.tzc-nom span { display: block; width: 100%; word-break: normal; overflow-wrap: anywhere; hyphens: auto; }

/* ── Pied : discipline ou marque, effet, référence ────────────────────────── */
.tzc-pied {
  position: absolute; z-index: 3;
  left: var(--tzc-illu-x); right: var(--tzc-illu-x);
  top: 85.6%; height: 7.6%;
  display: flex; align-items: center; justify-content: center; gap: 2.4cqw;
  font-size: 3.6cqw; line-height: 1.1; color: #a89a70;
  text-transform: uppercase; letter-spacing: .05em;
}
.tzc-pied span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; line-height: 1.35; }   /* place pour les accents des majuscules */
.tzc-pied b { color: #ffe9a8; font-weight: 700; }
.tzc-pied .tzc-sep { color: #5d5340; }
.tzc-pied .tzc-bonus { color: var(--tzc-or); }   /* « Bonus » en or (Rudolf, 01/10/2026) */
/* Référence de la copie : DANS la marge basse, à l'intérieur du liseré, jamais
   sur le trait ; gris discret, sans contour. */
.tzc-ref {
  position: absolute; z-index: 3; right: 6.4cqw; bottom: 3.9cqw;
  font-size: 2.6cqw; color: #7d7150; font-family: ui-monospace, monospace; letter-spacing: .06em;
}

/* Carte retenue dans le deck. La coche descend sous le bandeau du haut, que la
   couronne et le sablier occupent désormais. */
.tzc.is-deck { box-shadow: 0 0 0 .6cqw var(--tzc-or), 0 0 4cqw rgba(255, 215, 0, .5); }
.tzc.is-deck::after {
  content: '✓'; position: absolute; z-index: 6; right: 6.4cqw;
  top: calc(var(--tzc-illu-y) + var(--tzc-medaille-y) + var(--tzc-medaille) + 1.2cqw);
  color: var(--tzc-or); font-size: 5cqw; font-weight: bold; text-shadow: 0 0 1.5cqw #000;
}

/* ── Vignette : sous 136 px de large, on allège sans rien tronquer ──────────
   136 px est la largeur au-dessous de laquelle le pied (discipline, effet)
   descend sous 5 px de hauteur de texte : illisible, donc retiré. Le
   pictogramme d'effet et le sablier tombent avec lui (moins de 10 px, ils ne
   seraient plus que des taches). Restent : quart de famille, médaillons, type
   principal, nom, couronne. */
@container (max-width: 136px) {
  .tzc-pied, .tzc-ref, .tzc-effet, .tzc-sablier { display: none; }
  .tzc-kt small { display: none; }            /* 2 px de haut : du bruit */
  .tzc-puissance b, .tzc-kt b { font-size: 9.4cqw; }
  .tzc-type--secondaire, .tzc-type--reste { display: none; }   /* seul le type principal reste */
  .tzc-nom { height: 11.5%; top: calc(var(--tzc-illu-y) + var(--tzc-illu-h) + 2%); }
  .tzc-type { font-size: 4.8cqw; padding: 1.6cqw 2.8cqw; }
  .tzc-type--amateur { font-size: 4.2cqw; padding: 1.6cqw 2cqw; }
}

/* Repli si le navigateur ne connaît pas les requêtes de conteneur : la carte
   reste lisible, simplement sans mise à l'échelle fine. */
@supports not (container-type: inline-size) {
  .tzc { font-size: 13px; }
  .tzc-nom { font-size: .72rem; }
  .tzc-type { font-size: .42rem; padding: 2px 4px; }
  .tzc-quart { width: 21.5%; left: 3.3%; top: 2.2%; }
  .tzc-puissance, .tzc-kt, .tzc-symbole { width: 20%; }
  .tzc-puissance b, .tzc-kt b { font-size: .86rem; }
  .tzc-puissance small, .tzc-kt small { font-size: .32rem; }
  .tzc-pied { font-size: .36rem; }
  .tzc-ref { font-size: .3rem; }
  .tzc-couronne, .tzc-sablier { height: 9.4%; width: 12%; }
  .tzc-effet { width: 11%; height: 11%; }
}

/* ── Sections de la collection (Sponsors, Athlètes, Clubs, Agents, Fans, Autres) ─ */
.tzc-section { margin: 0 0 22px; }
.tzc-section-titre {
  display: flex; align-items: baseline; gap: 10px;
  margin: 0 0 10px; padding-bottom: 6px;
  border-bottom: 1px solid #23231c;
  color: #e8c26a; font-size: .9rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase;
}
.tzc-section-titre .tzc-compte { color: #8a7c52; font-size: .72rem; font-weight: 600; letter-spacing: .04em; }
/* Coût d'un athlète : GROS signe moins (Rudolf 27/09/2026), plus épais et plus grand que les chiffres. */
.tzc-kt .tzc-moins { display: inline-block; font-weight: 900; transform: scale(1.35, 1.6); margin-right: .5cqw; }

/* ── Bandeau de possession (cartes Supporter / Sponsor liées à un athlète, 30/09/2026) ──
   « Tant que vous suivez X », « Encore N jours (jusqu'au JJ/MM) », « À vie ».
   Posé TOUT EN BAS de la carte, dans la marge sous le pied, jamais sur l'illustration (Rudolf 01/10/2026) ;
   la référence de copie n'est pas affichée sur ces cartes (tz-carte.js) pour lui laisser la largeur. */
.tzc-droit {
  position: absolute; z-index: 6; left: 50%; bottom: 1.6cqw; transform: translateX(-50%);
  width: max-content; max-width: 84cqw; padding: .6cqw 2.4cqw; border-radius: 2cqw;
  font-size: 3.6cqw; font-weight: 700; line-height: 1.15; text-align: center;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  color: #1b1405; background: rgba(255, 233, 168, .94); box-shadow: 0 .4cqw 1.6cqw rgba(0, 0, 0, .7);
}
.tzc-droit--suivi  { background: rgba(255, 196, 206, .95); }
.tzc-droit--a_vie  { background: linear-gradient(160deg, #f6dc8c, #fff0b8 50%, #c99b3a); }
.tzc-droit--bientot { background: rgba(255, 150, 120, .96); }
@container (max-width: 136px) { .tzc-droit { font-size: 4.4cqw; padding: .6cqw 2cqw; max-width: 80cqw; } }

/* Athlète sponsorisé : prénom au-dessus, « ATHLÈTE SPONSORISÉ » sur une seule ligne (03/10/2026) */
.tzc-nom--2l { line-height: 1.12; }
.tzc-nom--2l span { overflow-wrap: normal; hyphens: none; }
.tzc-nom--2l em { display: block; font-style: normal; white-space: nowrap; font-size: .62em; letter-spacing: .06em; }

/* USINE À CARTES (03/10/2026) : exemplaire numéroté « n° 37 / 100 · 1re édition » (place de la référence de copie, plus lisible)
   et pastille de rareté « Plus que 12 exemplaires » / « Épuisée » (catalogue). */
.tzc-ref.tzc-ex { color: #e9d9a6; font-family: inherit; font-weight: 700; letter-spacing: .02em; white-space: nowrap; font-size: 3cqw; }
.tzc-ref.tzc-ex--haut { bottom: 7.6cqw; }
.tzc-rarete {
  position: absolute; z-index: 7; left: 50%; top: 1.4cqw; transform: translateX(-50%);
  width: max-content; max-width: 80cqw; padding: .5cqw 2.4cqw; border-radius: 2cqw;
  font-size: 3.4cqw; font-weight: 800; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  color: #1b1405; background: #ffd34d; box-shadow: 0 .4cqw 1.6cqw rgba(0, 0, 0, .7);
}
.tzc-rarete--epuisee { color: #fff; background: #8a1f1f; }
@container (max-width: 136px) { .tzc-rarete { font-size: 4.6cqw; } }

/* ── CŒUR JAUNE des FANS (Rudolf, 14/10/2026) : la valeur de soutien d'une carte Fan (« +0,4 ») et le « devient fan »
   de François (« +0,5 », sous sa puissance) sont portés par un GRAND CŒUR JAUNE contouré, plus par une cocarde rouge.
   Le « + » et le chiffre sont blancs, CONTOURÉS d'un liseré sombre net (règle : tout « + » posé sur l'illustration). ── */
.tzc-symbole--soutien, .tzc-fan-ath { background: none; box-shadow: none; overflow: visible; }
.tzc-coeur { position: absolute; left: -6%; top: -4%; width: 112%; height: 112%; overflow: visible;
  fill: #ffd23f; stroke: #3a2600; stroke-width: 1.1; stroke-linejoin: round;
  filter: drop-shadow(.3cqw .5cqw .6cqw rgba(0, 0, 0, .9)); }
.tzc-symbole--soutien b, .tzc-fan-ath b {
  position: relative; z-index: 1; margin-top: -2.6cqw; color: #111; font-size: 5.6cqw; font-weight: 900; letter-spacing: -.02em;
  text-shadow: none; -webkit-text-stroke: 0;
}
.tzc-fan-ath b { font-size: 4.4cqw; margin-top: -2cqw; }
/* Écriture NOIRE sur le cœur jaune ; le « + » est CONTOURÉ DE BLANC (Rudolf, 14/10/2026). */
.tzc-symbole--soutien .tzc-plus, .tzc-fan-ath .tzc-plus { -webkit-text-stroke: .8cqw #fff; paint-order: stroke fill; }

/* ── ICÔNES DE DISCIPLINE des athlètes (Rudolf, 14/10/2026) ─────────────────────────────────────────────────────────
   Colonne FIXE sous le médaillon Kŧ, centrée sur lui (miroir des disques de bonus sous la puissance, à gauche) :
   discipline précise, puis famille(s), handisport en dernier (tz-carte.js, iconesDisciplines). Or de la série d'Astra sur
   une pastille sombre cerclée d'or : lisible sur toute illustration. Jamais de texte : le nom de chaque discipline est
   dans le title de la colonne. La coche « dans le deck » (right 6,4 cqw) reste à droite de la colonne, sans la toucher. */
.tzc-disc {
  position: absolute; z-index: 4; margin: 0; padding: 0; list-style: none;
  right: calc(7cqw + var(--tzc-medaille) / 2 - 6.75cqw);
  top: calc(var(--tzc-illu-y) + var(--tzc-medaille-y) + var(--tzc-medaille) + 2.4cqw);
  display: flex; flex-direction: column; gap: 1.6cqw;
}
.tzc-disc li {
  width: 13.5cqw; aspect-ratio: 1; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  background: radial-gradient(circle at 35% 30%, #2b2618 0%, #0d0b07 75%);
  box-shadow: 0 0 0 .45cqw var(--tzc-or-sombre), .3cqw .5cqw 1cqw rgba(0, 0, 0, .85);
}
.tzc-disc img { width: 80%; height: 80%; object-fit: contain; display: block; filter: drop-shadow(0 .2cqw .3cqw #000); }
/* Vignette (130 et 90 px) : pastilles agrandies pour rester au-dessus de 12 px ; les 4 tiennent avant le bas de l'illustration. */
@container (max-width: 136px) {
  .tzc-disc { right: calc(7cqw + var(--tzc-medaille) / 2 - 8cqw); gap: 2cqw; }
  .tzc-disc li { width: 16cqw; }
}
@supports not (container-type: inline-size) { .tzc-disc li { width: 13.5%; } }