/* Feuille de style des cartes, copiée de JdR/HeartRunner/Cartes/gen_cards.py par
   scripts/importer.py. Ne pas éditer ici : relancer l'import. */

*{box-sizing:border-box}
html,body{margin:0;background:transparent}
.wrap{display:inline-block;padding:16px}
.cw{--panel:#0E0E13;--dim:#8B8B93;--credit:#FFC24D;
  --mono:ui-monospace,"SF Mono","Roboto Mono",Menlo,Consolas,monospace;
  --disp:"Impact","Haettenschweiler","Franklin Gothic Bold","Arial Narrow",sans-serif;
  --fail:#FF4D4D;--part:#FFB43B;--crit:#33E0A0}
.t-cyber{--ac:#FF3B47;--ac2:#B90F1B;--on:#160406;--glow:rgba(255,59,71,.30)}
.t-soft {--ac:#2FE38C;--ac2:#0E9E57;--on:#04140b;--glow:rgba(47,227,140,.28)}
.t-hard {--ac:#3BA2FF;--ac2:#155FC0;--on:#040f1e;--glow:rgba(59,162,255,.28)}
.t-trash{--ac:#FF8A1F;--ac2:#B85400;--on:#1A0900;--glow:rgba(255,138,31,.28)}
.t-job  {--ac:#F5C518;--ac2:#9C7A0A;--on:#171200;--glow:rgba(245,197,24,.26)}
.t-lieu {--ac:#AEB6BF;--ac2:#6A7280;--on:#12151a;--glow:rgba(174,182,191,.20)}
.t-run  {--ac:#B77BFF;--ac2:#6B2FB0;--on:#150A22;--glow:rgba(183,123,255,.28)}
.t-perso{--ac:#F5C518;--ac2:#9C7A0A;--on:#171200;--glow:rgba(245,197,24,.26)}
.t-timer{--ac:#FF8A1F;--ac2:#B85400;--on:#1A0900;--glow:rgba(255,138,31,.34)}
.card{width:315px;height:440px;padding:2px;background:var(--ac);
  clip-path:polygon(0 0,calc(100% - 17px) 0,100% 17px,100% calc(100% - 17px),calc(100% - 17px) 100%,0 100%);
  filter:drop-shadow(0 0 7px var(--glow)) drop-shadow(0 3px 6px rgba(0,0,0,.5))}
.card__inner{position:relative;display:flex;flex-direction:column;height:100%;background:var(--panel);
  clip-path:polygon(0 0,calc(100% - 16px) 0,100% 16px,100% calc(100% - 16px),calc(100% - 16px) 100%,0 100%)}
.card__inner::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:3;
  background:repeating-linear-gradient(180deg,rgba(0,0,0,0) 0 2px,rgba(0,0,0,.22) 2px 3px)}
.card__head{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:9px 13px 8px;background:var(--ac)}
.card__name{margin:0;min-width:0;white-space:nowrap;font-family:var(--disp);font-weight:400;font-size:26px;line-height:.92;text-transform:uppercase;letter-spacing:.5px;color:#000}
.card__stat{font-family:var(--mono);font-size:12px;font-weight:800;letter-spacing:.5px;padding:2px 7px;border:1.5px solid var(--on);white-space:nowrap;flex:none;color:var(--on)}
.card__mid{flex:1;display:flex;min-height:0}
.card__col{flex:1;display:flex;flex-direction:column;min-width:0}
.card__type{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 13px;border-bottom:1px solid #24242b;
  font-family:var(--mono);font-size:10.5px;font-weight:700;letter-spacing:1.4px;text-transform:uppercase;color:var(--ac);text-shadow:0 0 8px var(--glow)}
.card__type>span:first-child{min-width:0;white-space:nowrap}
.card__bars{width:48px;height:12px;flex:none;opacity:.85;
  background:repeating-linear-gradient(90deg,var(--ac) 0 1px,transparent 1px 2px,var(--ac) 2px 4px,transparent 4px 6px,var(--ac) 6px 7px,transparent 7px 9px)}
/* Sur les assets, la ligne de type s'empile : la famille, son sous-type dessous.
   Toute la largeur de droite revient ainsi à la case PRO, même quand le
   sous-type est long (« Audition cybernétique »). Le sous-type est en em pour
   suivre la réduction automatique du titre de ligne (FITJS). */
.type2{display:flex;flex-direction:column;gap:1px;min-width:0}
.type2 .sub{font-size:.9em;letter-spacing:1.2px;color:var(--dim);text-shadow:none}
/* La case PRO prend la place du code-barres. Le livret : un asset pro, c'est la
   même carte, cochée PRO au feutre. Elle s'encadre comme la pastille du haut,
   dont elle donne l'écart : coche, et le « 4 ENC » du bandeau vaut 2. */
.pro{display:flex;align-items:center;gap:5px;flex:none;white-space:nowrap;
  padding:2px 6px;border:1.5px solid var(--ac2);text-transform:none}
.pro__box{width:11px;height:11px;flex:none;border-radius:2px;background:var(--ac);
  box-shadow:0 0 6px var(--glow)}
.card__body{flex:1;min-height:0;overflow:hidden;padding:12px 13px;font-family:var(--mono);font-size:12px;line-height:1.46;color:#D6D6DA}
.bfit{transform-origin:top left}
.card__body p{margin:0 0 8px}.card__body b{color:#fff;font-weight:700}
.cue{color:var(--ac);font-size:10px;letter-spacing:1px;text-transform:uppercase;margin:6px 0 4px;text-shadow:0 0 8px var(--glow)}
.qlist{list-style:none;margin:0 0 6px;padding:0}
.qlist li{position:relative;padding-left:14px;margin-bottom:3px;font-size:11.5px}
.qlist li::before{content:"\203A";position:absolute;left:0;color:var(--ac);font-weight:700}
.clist li{padding-left:18px}
/* une case à cocher se remplit au feutre : son fond doit être clair, sinon
   la coche disparaît dans le noir de la carte */
.clist li::before{content:"";top:3px;width:10px;height:10px;border-radius:2px;
  background:var(--ac);box-shadow:0 0 6px var(--glow)}
.spine{width:27px;flex:none;background:#08080B;border-right:1px solid var(--ac2);
  display:flex;flex-direction:column;align-items:center;padding:9px 0;gap:6px}
.spine__lab{writing-mode:vertical-rl;transform:rotate(180deg);font-family:var(--mono);
  font-size:8px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--ac);
  opacity:.85;margin-bottom:3px;text-shadow:0 0 6px var(--glow)}
.chg{width:14px;height:14px;flex:none;border:1.5px solid var(--ac);border-radius:2px;
  background:var(--ac)}
/* Un drone pro n'est pas plus léger, il tient plus longtemps : au lieu de la
   case PRO du haut, sa tranche porte les charges de batterie que sa version
   pro ajoute, dans un encadré à part. */
.spro{display:flex;flex-direction:column;align-items:center;gap:6px;margin-top:5px;
  padding:4px 3px 5px;border:1px dashed var(--ac2);border-radius:3px}
.spro__lab{font-family:var(--mono);font-size:7px;font-weight:700;letter-spacing:.5px;
  text-transform:uppercase;color:var(--ac);opacity:.85;text-shadow:0 0 6px var(--glow)}
.f{margin:0 0 5px;font-size:11px;line-height:1.4}
.f b{color:var(--ac);font-weight:700}
.zone{margin:0 0 7px}
.zone__h{font-family:var(--mono);font-size:11px;font-weight:800;letter-spacing:.6px;color:#fff}
.zone__s{color:var(--ac);font-size:9.5px}
.zone__d{font-size:11px;color:#C7C7CC;line-height:1.4}
.zone__d b{color:var(--ac);font-weight:700}
.zone__sys{position:relative;margin-top:2px;padding-left:12px;font-size:10.5px;line-height:1.35;color:#7FC0FF}
.zone__sys::before{content:"\203A";position:absolute;left:0;color:#3BA2FF;font-weight:700}
.twist{position:relative;margin:11px 0 0;padding:9px 9px 6px;border:1px dashed var(--ac2);font-family:var(--mono);font-size:10.5px;line-height:1.4;color:#9a9aa2}
.twist::before{content:"MENEUR";position:absolute;top:-6px;right:9px;background:var(--panel);padding:0 6px;color:var(--ac);font-weight:700;letter-spacing:1.5px;font-size:9px}
.twist b{color:var(--ac)}
.card__foot{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:9px 13px;background:#08080B;border-top:1.5px solid var(--ac2);
  font-family:var(--mono);font-size:11px;letter-spacing:.5px}
.card__tier{color:var(--dim);letter-spacing:1px;font-weight:700}
.card__price{color:var(--credit);font-weight:800;font-size:14px}

/* ---- carte Timer ------------------------------------------------------------
   La seule carte dont le cadre n'est pas d'une couleur : il descend du jaune au
   gris, comme la jauge elle-même. Elle doit sauter aux yeux sur la table. */
.card.t-timer{background:linear-gradient(180deg,#F5C518 0%,#FF8A1F 33%,#FF3B47 66%,#6A7280 100%)}
.t-timer .card__head{background:linear-gradient(90deg,#F5C518 0%,#FF8A1F 36%,#FF3B47 72%,#6A7280 100%)}
.t-timer .card__body{padding:11px 12px}
/* les quatre cases se partagent toute la hauteur : chacune est une zone assez
   large pour y poser le marqueur, et la carte ne se vide pas par le bas */
.t-timer .bfit{display:flex;flex-direction:column;height:100%;gap:9px}
.tstep{flex:1;display:flex;align-items:center;gap:10px;padding:8px 10px 8px 8px;
  background:var(--sbg);border-left:5px solid var(--sc);
  clip-path:polygon(0 0,calc(100% - 10px) 0,100% 10px,100% 100%,0 100%)}
.tslot{width:27px;height:27px;flex:none;border:2px solid var(--sc);
  display:flex;align-items:center;justify-content:center;
  font-family:var(--mono);font-size:13px;font-weight:800;color:var(--sc);
  box-shadow:inset 0 0 10px var(--sglow)}
.ttxt{font-size:12px;line-height:1.3;color:#D6D6DA}
.ttxt b{display:block;color:var(--sc);font-weight:800;font-size:14px;
  letter-spacing:.3px;margin-bottom:1px;text-shadow:0 0 9px var(--sglow)}
/* ---- carte Cœur Artificiel --------------------------------------------------
   L'implant emblématique. Il reste un asset cyberware — aplat rouge, pas de
   dégradé (essayé sur les objets le 2026-07-30, puis retiré : Valentin préfère
   l'aplat) — mais deux écarts discrets le sortent du rang : le cadre est un
   cran plus épais, et un tracé d'ECG remplace le code-barres. Le tracé raconte
   la face : pouls régulier sur le cœur bridé, tachycardie sur le débridé. */
.t-coeur{--ac:#FF3B47;--ac2:#B90F1B;--on:#160406;--glow:rgba(255,59,71,.30)}
.card.t-coeur{padding:3px}
.t-coeur .ecg{width:66px;height:14px;flex:none;filter:drop-shadow(0 0 4px var(--glow))}
/* « Organe · Débridé » + l'ECG : la ligne de type est plus chargée qu'ailleurs,
   on la resserre d'un demi-point pour qu'elle tienne sur une seule ligne */
.t-coeur .card__type{font-size:9.5px;letter-spacing:1.1px;white-space:nowrap}
/* La réussite frénétique (20 +) reste une ligne de l'échelle, en rose glitch
   puisque c'est la psychose qui parle ; ce qu'elle déclenche s'écrit dessous,
   sur toute la largeur de la ligne (et non sous la seule cellule du gain) :
   ça se lit d'un trait au lieu de tomber dans une colonne étroite. */

/* ---- carte Glitch -----------------------------------------------------------
   Le glitch est une image qui décroche : la carte le montre au lieu de le dire.
   Trois écarts assumés avec les autres cartes — le bandeau est noir et non un
   aplat de couleur, le titre et le code-barres partent en aberration
   chromatique cyan/magenta, et il n'y a pas de pied.
   Tout le reste — cadre, fond — est sobre : le glitch tient dans le bandeau.
   Le texte de la règle, lui, ne bouge pas : c'est une carte qu'on lit. */
.t-glitch{--ac:#FF2BD6;--ac2:#8E0A78;--on:#1A0016;--glow:rgba(255,43,214,.34);--cy:#22E7F2}
/* Le cadre part en dégradé sur tout le pourtour, du rose au cyan de la carte :
   les deux couleurs de l'aberration chromatique du titre se retrouvent dans le
   cadre, qui décroche donc lui aussi, mais en continu — les sauts cyan avaient
   été essayés puis retirés (Valentin), le dégradé, lui, ne hache rien.
   Deuxième carte après le Timer à ne pas avoir un cadre d'une seule couleur. */
.card.t-glitch{background:linear-gradient(135deg,#FF2BD6 0%,#C13BE6 38%,#5C8CF0 72%,#22E7F2 100%)}
/* le filet du bandeau prolonge le cadre : même dégradé, à l'horizontale, pour
   qu'il rejoigne le rose à gauche et le cyan à droite sans rupture */
.t-glitch .card__head{padding:11px 13px 10px;
  background:linear-gradient(#08080B,#08080B) 0 0/100% calc(100% - 2px) no-repeat,
    linear-gradient(90deg,#FF2BD6 0%,#C13BE6 38%,#5C8CF0 72%,#22E7F2 100%) 0 100%/100% 2px no-repeat}
.t-glitch .card__name{color:#fff;font-size:29px;letter-spacing:1.5px}
/* le titre porte l'aberration chromatique seule : dupliquer une tranche du mot
   en la décalant a été essayé deux fois, ça le hache et on ne lit plus
   « GLITCH ». La barre de couleurs qui l'accompagnait un temps est retirée
   (Valentin) — le décrochage se joue ailleurs, dans le corps. */
.t-glitch .gt{display:inline-block;color:#fff;text-shadow:-2px 0 var(--cy),2px 0 var(--ac)}
/* le titre blanc est le seul de toutes les cartes : les scanlines noires, qui
   passent inaperçues sur les titres noirs, le transformaient en peigne. */
.t-glitch .card__inner::after{background:repeating-linear-gradient(180deg,
  rgba(0,0,0,0) 0 3px,rgba(0,0,0,.15) 3px 4px)}
.t-glitch .card__stat{color:var(--ac);border-color:var(--ac)}
.t-glitch .card__type{color:var(--cy);text-shadow:0 0 8px rgba(34,231,242,.35)}
/* le code-barres décroche comme le titre : trois couches, blanc au centre,
   cyan et magenta de part et d'autre, plus une tranche partie plus loin.
   Il n'a rien à dire, donc lui, on peut le casser franchement. */
.t-glitch .card__bars{position:relative;width:56px;
  background:repeating-linear-gradient(90deg,#EDEDF2 0 1px,transparent 1px 2px,
    #EDEDF2 2px 4px,transparent 4px 6px,#EDEDF2 6px 7px,transparent 7px 9px)}
.t-glitch .card__bars::before,.t-glitch .card__bars::after{content:"";position:absolute;
  inset:0;background:inherit;mix-blend-mode:screen}
.t-glitch .card__bars::before{background-image:repeating-linear-gradient(90deg,
  var(--cy) 0 1px,transparent 1px 2px,var(--cy) 2px 4px,transparent 4px 6px,
  var(--cy) 6px 7px,transparent 7px 9px);transform:translateX(-3px)}
.t-glitch .card__bars::after{background-image:repeating-linear-gradient(90deg,
  var(--ac) 0 1px,transparent 1px 2px,var(--ac) 2px 4px,transparent 4px 6px,
  var(--ac) 6px 7px,transparent 7px 9px);
  transform:translateX(3px);clip-path:inset(38% 0 26% 0)}

/* Les barres de données mortes qui traversaient le corps et fermaient la carte
   ont été retirées (Valentin) : essayées légères, puis appuyées, puis à opacité
   constante, elles restaient du bruit derrière un texte de règle. Le fond est
   nu, comme sur les autres cartes. */
.t-glitch .qlist li::before{color:var(--cy)}

/* Pas de pied : une carte de règle ne s'achète pas, et la bande de prix ne
   servait qu'à fermer la boîte. L'encadré meneur descend prendre sa place. */
.t-glitch .card__foot{display:none}
.t-glitch .bfit{display:flex;flex-direction:column;height:100%}
.t-glitch .gnote{margin-top:auto}

/* La carte entière s'adresse au meneur : l'encadré ne peut donc plus s'appeler
   « MENEUR » comme le TWIST des cartes Run, ça ne distinguerait plus rien. Il
   isole la seule ligne que le meneur dit à voix haute, d'où « À DIRE ». */
.gnote{position:relative;margin:11px 0 0;padding:9px 9px 7px;border:1px dashed var(--ac2);
  font-family:var(--mono);font-size:10.5px;line-height:1.4;color:#B9B9C0}
.gnote::before{content:"À DIRE";position:absolute;top:-6px;right:9px;background:var(--panel);
  padding:0 6px;color:var(--ac);font-weight:700;letter-spacing:1.5px;font-size:9px}
.gnote b{color:#fff}

/* ---- noms suggérés (cartes Job, face 1) -------------------------------------
   Un joueur qui n'a jamais fait de JdR sèche sur le choix d'un blaze. La carte
   lui en pose une poignée sous les yeux, dans l'espace resté libre en bas.
   Gris et sans puces : ça se lit après les questions, jamais à leur place.
   Les deux blocs sont en flex:none pour que rien ne se comprime en silence —
   si un jour ça déborde, c'est FITJS qui réduit, comme sur les autres cartes. */
.bfit.hasnames{display:flex;flex-direction:column;height:100%}
.bfit.hasnames>*{flex:none}
.names{margin-top:auto;padding-top:9px;border-top:1px dotted #24242b}
.names__lab{font-family:var(--mono);font-size:9.5px;letter-spacing:1.4px;
  text-transform:uppercase;color:#5E5E68;margin-bottom:5px}
.names__l{font-family:var(--mono);font-size:12.5px;line-height:1.9;color:#70707A;
  display:flex;flex-wrap:wrap;gap:0 14px}

.s1{--sc:#F5C518;--sbg:#1B1608;--sglow:rgba(245,197,24,.32)}
.s2{--sc:#FF8A1F;--sbg:#1C0F03;--sglow:rgba(255,138,31,.32)}
.s3{--sc:#FF3B47;--sbg:#1C0709;--sglow:rgba(255,59,71,.32)}
.s4{--sc:#8B939D;--sbg:#131519;--sglow:rgba(139,147,157,.24)}

/* ---- carte Personnage, face 2 : la fiche -----------------------------------
   La seule carte du jeu sur laquelle le joueur écrit. Tout ce qui se remplit
   est donc un aplat clair posé sur le noir de la charte : gris pour ce qui se
   fixe à la création (les quatre caractéristiques), jaune pour les deux jauges
   qui bougent en jeu (REP, PSY). Le bandeau de titre, déjà un aplat jaune sur
   toutes les cartes, devient le champ du nom : la carte porte le nom du
   personnage à la place du sien.
   Les deux tranches verticales reprennent la tranche des cartes à charges et
   couvrent exactement les caractéristiques qu'elles pénalisent (faim : AGI et
   FOR ; fatigue : COG et TEC). Les quatre blessures sont à l'échelle du Timer
   — jaune, orange, rouge, gris — pour que la gravité se lise à la couleur.
   Pas de pied : une fiche ne s'achète pas, et la place va au corps. */
.t-perso2{--ac:#F5C518;--ac2:#9C7A0A;--on:#171200;--glow:rgba(245,197,24,.26);
  --slot:#C3C4CC;--tab:#8E8F99;--ink:#0E0E13}
.t-perso2 .card__head{align-items:flex-start;height:54px;padding:8px 13px 0}
.t-perso2 .card__body{padding:11px 12px}
.t-perso2 .bfit{display:flex;flex-direction:column;height:100%;gap:9px}
/* le champ du nom : une étiquette discrète en haut à gauche, le reste de
   l'aplat est laissé libre pour écrire */
.pname{font-family:var(--mono);font-size:9px;font-weight:700;letter-spacing:1.8px;
  text-transform:uppercase;color:var(--on);opacity:.6}

.pgrid{flex:1;display:flex;gap:8px;min-height:0}
.pgrid__l{flex:1;display:flex;flex-direction:column;gap:7px;min-width:0}
.pgrid__r{width:96px;flex:none;display:flex;flex-direction:column;gap:7px}
.pgrp{flex:1;display:flex;min-height:0}
.pgrp__c{flex:1;display:flex;flex-direction:column;gap:7px;min-width:0}

/* une case de caractéristique : le sigle calé à gauche, tout le reste du gris
   est la zone d'écriture. Les deux barres noires sont le mobilier de la
   charte — mêmes encoches que les biseaux des cartes. */
.pslot{position:relative;flex:1;display:flex;flex-direction:column;
  justify-content:center;padding:0 11px;background:var(--slot);
  clip-path:polygon(0 0,calc(100% - 9px) 0,100% 9px,100% 100%,9px 100%,0 calc(100% - 9px))}
.pslot::before,.pslot::after{content:"";position:absolute;height:3px;width:44%;background:var(--ink)}
.pslot::before{top:0;left:13px}
.pslot::after{bottom:0;right:13px}
.pslot__k{font-family:var(--mono);font-size:17px;font-weight:800;letter-spacing:1.2px;color:var(--ink)}
.pslot__s{font-family:var(--mono);font-size:8px;font-weight:700;letter-spacing:.6px;color:#4E4F59;margin-top:2px}

.ptab{width:20px;flex:none;background:var(--tab);display:flex;align-items:center;justify-content:center;
  clip-path:polygon(0 0,100% 0,100% calc(100% - 9px),calc(100% - 9px) 100%,0 100%)}
.ptab__l{writing-mode:vertical-rl;transform:rotate(180deg);font-family:var(--mono);
  font-size:8.5px;font-weight:800;letter-spacing:1.6px;text-transform:uppercase;color:var(--ink)}

/* REP et PSY : mêmes cases, en jaune, avec leur plafond en filigrane dans le
   coin — 99 pour la réputation, 50 pour la psychose (seuil de la folie définitive) */
.pgauge{position:relative;flex:1;padding:9px 10px;background:var(--ac);
  clip-path:polygon(0 0,calc(100% - 11px) 0,100% 11px,100% 100%,11px 100%,0 calc(100% - 11px))}
.pgauge__k{font-family:var(--mono);font-size:17px;font-weight:800;letter-spacing:1.2px;color:var(--ink)}
.pgauge__m{position:absolute;right:10px;bottom:7px;font-family:var(--mono);
  font-size:13px;font-weight:800;color:rgba(14,14,19,.38)}
.pgauge__b{position:absolute;top:9px;right:10px;width:26px;height:8px;opacity:.5;
  background:repeating-linear-gradient(90deg,var(--ink) 0 1px,transparent 1px 2px,
    var(--ink) 2px 4px,transparent 4px 6px,var(--ink) 6px 7px,transparent 7px 9px)}

.pw{flex:none;display:flex;gap:6px}
.pw__c{flex:1;display:flex;flex-direction:column;align-items:center;gap:2px}
.pw__k{font-family:var(--mono);font-size:8px;font-weight:700;letter-spacing:.8px;
  text-transform:uppercase;color:var(--wc)}
.pw__n{font-family:var(--mono);font-size:12px;font-weight:800;color:var(--wc);
  text-shadow:0 0 8px var(--wg)}
.pw svg{width:40px;height:40px;display:block}
.w1{--wc:#F5C518;--wg:rgba(245,197,24,.30)}
.w2{--wc:#FF8A1F;--wg:rgba(255,138,31,.30)}
.w3{--wc:#FF3B47;--wg:rgba(255,59,71,.30)}
.w4{--wc:#8B939D;--wg:rgba(139,147,157,.22)}

/* ---- face 2 : trois variantes autour de la fiche ---------------------------
   Mêmes partis pris que la V1 (bandeau-nom, gris = fixé à la création, jaune =
   bouge en jeu, pas de pied), autres architectures.
   « Dossier » : un formulaire en rangées, sigles hors case, ligne d'écriture
   pointillée dans chaque case, blessures en cases à cocher façon charges.
   « Moniteur » : les jauges d'abord, un tracé d'ECG en filet (le clin d'œil au
   Cœur), les carac en grille 2×2 avec les malus écrits en toutes lettres, et
   les blessures en échelle à filets pointillés, comme l'échelle d'ADR.
   « Compte à rebours » : la piste de blessures en colonne pleine hauteur,
   bâtie sur les crans du Timer (s1…s4) : le corps a son propre timer. */
.t-p2b,.t-p2c,.t-p2d{--ac:#F5C518;--ac2:#9C7A0A;--on:#171200;--glow:rgba(245,197,24,.26);
  --slot:#C3C4CC;--ink:#0E0E13}
.t-p2b .card__head,.t-p2c .card__head,.t-p2d .card__head{align-items:flex-start;height:54px;padding:8px 13px 0}
.t-p2b .card__body,.t-p2c .card__body,.t-p2d .card__body{padding:11px 12px}
.t-p2b .bfit,.t-p2c .bfit{display:flex;flex-direction:column;height:100%;gap:8px}

/* -- Dossier -- */
.fgrp{flex:1;display:flex;gap:6px;min-height:0}
.fgrp__c{flex:1;display:flex;flex-direction:column;gap:6px;min-width:0}
.frow{flex:1;display:flex;align-items:stretch;gap:8px;min-height:0}
.frow__k{width:46px;flex:none;display:flex;flex-direction:column;justify-content:center;
  font-family:var(--mono);font-size:14px;font-weight:800;letter-spacing:.8px;color:#EDEDF2}
.frow__k small{font-size:7px;font-weight:700;color:#5E5E68;letter-spacing:.3px;margin-top:2px}
.frow__cell{flex:1;position:relative;background:var(--slot);
  clip-path:polygon(0 0,calc(100% - 8px) 0,100% 8px,100% 100%,8px 100%,0 calc(100% - 8px))}
.frow__cell::after{content:"";position:absolute;left:9px;right:9px;bottom:5px;height:1px;opacity:.45;
  background:repeating-linear-gradient(90deg,var(--ink) 0 4px,transparent 4px 7px)}
.frow--y .frow__cell{background:var(--ac)}
.fmax{position:absolute;right:8px;bottom:8px;font-family:var(--mono);font-size:11px;
  font-weight:800;color:rgba(14,14,19,.38)}
.ftab{width:17px;flex:none;border:1px dashed #3A3A44;display:flex;align-items:center;justify-content:center}
.ftab span{writing-mode:vertical-rl;transform:rotate(180deg);font-family:var(--mono);
  font-size:8px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;color:#8B8B93}
.wchg{flex:none;display:flex;gap:6px;padding-top:8px;border-top:1px dotted #24242b}
.wc2{flex:1;display:flex;flex-direction:column;align-items:center;gap:3px}
.wc2__k{font-family:var(--mono);font-size:7.5px;font-weight:700;letter-spacing:.7px;text-transform:uppercase;color:var(--wc)}
.wc2__b{width:17px;height:17px;border:1.8px solid var(--wc);border-radius:2px;
  background:rgba(0,0,0,.35);box-shadow:inset 0 0 8px var(--wg)}
.wc2__n{font-family:var(--mono);font-size:10.5px;font-weight:800;color:var(--wc)}

/* -- Moniteur -- */
.vg{flex:none;height:60px;display:flex;gap:8px}
.vecg{flex:none;height:13px;opacity:.85;filter:drop-shadow(0 0 4px rgba(255,59,71,.3))}
.vecg svg{width:100%;height:100%;display:block}
.cgrid{flex:1;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr auto 1fr auto;gap:7px;min-height:0}
.mal{grid-column:1/-1;display:flex;justify-content:space-between;align-items:center;
  padding:3px 8px;background:#15151B;font-family:var(--mono);font-size:8.5px;
  letter-spacing:1px;text-transform:uppercase}
.mal__k{color:#8B8B93;font-weight:800}
.mal__v{color:#C7C7CC;font-weight:700}
.wlad{flex:none;font-family:var(--mono)}
.wrow{display:flex;align-items:center;gap:8px;padding:4.5px 0;border-bottom:1px dotted #2a2a32}
.wrow:last-child{border-bottom:none;padding-bottom:0}
.wrow svg{width:15px;height:15px;flex:none}
.wrow__k{flex:1;font-size:10.5px;font-weight:700;letter-spacing:.5px;color:var(--wc)}
.wrow__n{font-size:11px;font-weight:800;color:var(--wc)}

/* -- Compte à rebours -- */
.t-p2d .bfit{display:flex;gap:8px;height:100%}
.dcol{flex:1;display:flex;flex-direction:column;gap:7px;min-width:0}
.dtrack{width:96px;flex:none;display:flex;flex-direction:column;gap:7px}
.dstep{flex:1;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:4px;
  padding:6px 8px;background:var(--sbg);border-left:4px solid var(--sc);
  clip-path:polygon(0 0,calc(100% - 8px) 0,100% 8px,100% 100%,0 100%)}
.dstep b{font-family:var(--mono);font-size:9px;font-weight:800;letter-spacing:.6px;
  text-transform:uppercase;color:var(--sc);text-shadow:0 0 8px var(--sglow)}
.dstep__r{display:flex;align-items:center;gap:6px}
.dslot{width:20px;height:20px;flex:none;border:2px solid var(--sc);
  background:rgba(0,0,0,.35);box-shadow:inset 0 0 8px var(--sglow)}
.dstep__n{font-family:var(--mono);font-size:11px;font-weight:800;color:var(--sc)}
.pslot__tag{position:absolute;right:9px;bottom:5px;font-family:var(--mono);font-size:7.5px;
  font-weight:700;letter-spacing:.8px;text-transform:uppercase;color:#4E4F59}
.dg{flex:none;height:54px;display:flex;gap:7px}
.dg .pgauge{padding:7px 9px}
.dg .pgauge__k{font-size:14px}
.dg .pgauge__m{font-size:11px;bottom:6px}
.dg .pgauge__b{display:none}