/* ===== Tableau d'honneur : jeu.css (www/jeux/tableau-honneur/jeu.css, chargé par jouer.php APRÈS jeux.css) =====
   Couleur du jeu : rouge vif (choix de Guillaume, 23/10/2026). On redéfinit les variables du socle et les quelques
   couleurs écrites en dur dans jeux.css (lueur du titre, carte). Les défauts sont en orange (--danger), pour ne pas
   se confondre avec le rouge du jeu.
   Tableau : classes tb-… ; --s = taille d'une case, calculée par ui.js (60 à 44 px). */
.jx{--bg:#120a0b;--panel:#1e1315;--line:#3d2429;--fg:#f4eaeb;--muted:#a8949a;
  --amber:#ff3b30;--amber-soft:#ff3b3024;--danger:#ffa62b;--lum:#ffe6a0}
.jx-titre{text-shadow:0 0 16px #ff3b3088}
@media (max-width:420px){.jx-titre{font-size:18px;letter-spacing:.03em}}/* titre long : laisser de la place aux pastilles */
.jx-btn.jx-go{color:#fff}
.jx-statut{min-height:2.7em}/* 2 lignes réservées : un message plus long ne rétrécit pas le tableau */
.jx-carte{background:#120a0bf2;box-shadow:0 0 40px #ff3b3044}
.jx-gagne{z-index:5}/* au-dessus du bac collé en bas (.tb-bac sticky, z-index 1) */
/* boutons du socle : sans la marge ni le filtre inversé de global.css (demande au socle du 22/10, en attendant) */
.jx .jx-btn{margin:0;min-width:0;min-height:44px}
.jx .jx-btn:hover{filter:none}
.tb-tension.tb-pret{animation:tbPret 1.4s ease-in-out infinite alternate}
@keyframes tbPret{from{box-shadow:0 0 4px #ff3b3066}to{box-shadow:0 0 18px #ff3b30dd}}

/* --- zone --- */
/* global.css du site donne à TOUS les boutons margin:4px, min-width/min-height 35px, padding 8px, fond blanc et un filtre
   inversé au survol : on remet à zéro dans le tableau */
.tb-zone button{margin:0;min-width:0;min-height:0;background-size:auto;font-family:inherit}
.tb-zone button:hover{filter:none}
.tb-zone{--s:56px;width:100%;max-height:100%;display:flex;flex-direction:column;gap:8px;touch-action:pan-y;overflow:auto;scrollbar-width:none}
.tb-zone::-webkit-scrollbar{display:none}
.tb-tableau{display:flex;flex-direction:column;gap:6px}
.tb-cols,.tb-dep{display:grid;grid-template-columns:minmax(0,1fr) repeat(3,var(--s));gap:5px;align-items:center}
.tb-cols{padding:0 7px;font-size:11px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.04em;text-align:center}

/* une rangée : le différentiel en tête, puis les départs */
.tb-rangee{border:1px solid var(--line);border-radius:12px;padding:5px 6px 6px;display:flex;flex-direction:column;gap:5px;
  background:linear-gradient(#1a1012,#150c0e);transition:outline-color .1s,background .2s;outline:2px solid transparent}
.tb-rtete{display:flex;align-items:center;gap:8px;padding-bottom:5px;border-bottom:2px solid #2c1b1f}
.tb-rtete .tb-case{width:calc(var(--s)*1.35)}
.tb-rnom{display:flex;flex-direction:column;line-height:1.15;min-width:0}
.tb-rnom b{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tb-rnom small{font-size:13px;color:var(--muted)}
.tb-compte{margin-left:auto;font-weight:700;font-variant-numeric:tabular-nums;color:var(--muted);font-size:14px;white-space:nowrap}
.tb-compte.tb-trop{color:var(--danger)}
.tb-videR{height:var(--s);display:flex;align-items:center;justify-content:center;border:1px dashed var(--line);border-radius:10px;color:var(--muted);font-size:14px}
.tb-mobile .tb-rangee.tb-vise{outline-color:var(--amber);background:var(--amber-soft)}

/* un départ : le circuit (carte), puis disjoncteur, câble, raccordement */
.tb-dep{border-radius:10px;transition:background .2s}
.tb-app{height:var(--s);min-width:0;display:flex;align-items:center;gap:6px;padding:2px 6px 2px 4px;border-radius:10px;border:1px solid var(--line);
  background:var(--panel);color:var(--fg);text-align:left;cursor:default}
.tb-mobile .tb-app{cursor:grab;touch-action:none}
.tb-app .tb-ico{width:calc(var(--s)*.6);height:calc(var(--s)*.6);flex:none}
.tb-txt{display:flex;flex-direction:column;min-width:0;line-height:1.15}
.tb-txt b{font-size:14px;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;line-height:1.1}
.tb-txt b span{font-weight:400;color:var(--muted)}
.tb-txt small{font-size:13px;color:var(--muted);white-space:nowrap;font-variant-numeric:tabular-nums}
.tb-dep.tb-sel .tb-app{outline:3px solid var(--amber);outline-offset:1px}

/* les cases */
.tb-case{position:relative;width:var(--s);height:var(--s);flex:none;border-radius:9px}
.tb-trou{width:100%;height:100%;border-radius:9px;border:1px dashed #4a2e34;background:#170e10;color:#6e5258;font-size:11px;font-weight:700;
  cursor:pointer;padding:0;text-transform:uppercase;letter-spacing:.03em}
.tb-zone[data-vise="dj"] .tb-vide[data-t="dj"] .tb-trou,.tb-zone[data-vise="cable"] .tb-vide[data-t="cable"] .tb-trou,
.tb-zone[data-vise="rac"] .tb-vide[data-t="rac"] .tb-trou,.tb-zone[data-vise="ddr"] .tb-vide[data-t="ddr"] .tb-trou{
  border:2px dashed var(--amber);color:var(--amber);background:var(--amber-soft)}
.tb-case.tb-vise .tb-trou,.tb-case.tb-vise .tb-piece{outline:3px solid var(--amber);outline-offset:1px}
.tb-case.tb-non .tb-trou,.tb-case.tb-non .tb-piece{outline:2px solid var(--muted);outline-offset:1px}
.tb-manque .tb-vide .tb-trou{animation:tbManque .5s 2}
@keyframes tbManque{50%{border-color:var(--danger);background:#ffa62b22}}

/* les pièces */
.tb-ico{fill:none;stroke:currentColor;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round;display:block}
.tb-plein{fill:currentColor;stroke:none}
.tb-piece{position:relative;width:var(--s);height:var(--s);flex:none;border-radius:9px;border:1px solid var(--line);background:var(--panel);color:var(--fg);
  cursor:grab;padding:2px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;touch-action:none;line-height:1}
.tb-case .tb-piece{position:absolute;inset:0;width:auto;height:auto}
.tb-piece .tb-ico{width:52%;height:52%}
.tb-lab{display:flex;align-items:baseline;gap:2px;white-space:nowrap;font-variant-numeric:tabular-nums}
.tb-lab b{font-size:max(12px,calc(var(--s)*.25))}
.tb-lab i{font-style:normal;font-size:10px;font-weight:700;opacity:.75}
/* disjoncteurs et différentiels : modules blancs, comme en vrai */
.tb-dj,.tb-ddr{background:linear-gradient(#f4efed,#ddd5d2);color:#2b1a1d;border-color:#8d7a7e}
.tb-ddr{gap:0}.tb-ddr .tb-lab{flex-direction:column;align-items:center;gap:1px}
.tb-ddr-A .tb-lab b{color:#c0140c}
/* câbles : cuivre, le trait épaissit avec la section ; raccordements : gris clair */
.tb-cable{color:#f0a066}
.tb-rac{color:#d6dbe6}
.tb-rac .tb-lab b{font-size:max(11px,calc(var(--s)*.2))}
.tb-piece.tb-fixe{cursor:default;opacity:.8}
.tb-piece.tb-fixe::after{content:'🔒';position:absolute;top:-5px;right:-5px;font-size:10px}
.tb-nb{position:absolute;top:-7px;right:-7px;min-width:22px;height:20px;padding:0 4px;border-radius:10px;background:var(--amber);color:#fff;
  font-size:12px;font-weight:700;line-height:20px;text-align:center}
.tb-piece.tb-sel{outline:3px solid var(--amber);outline-offset:2px;transform:translateY(-3px)}
.tb-piece.tb-parti,.tb-app.tb-parti{opacity:.3}
.tb-fantome{position:fixed;left:0;top:0;z-index:6;pointer-events:none;box-shadow:0 8px 24px #000a,0 0 16px #ff3b3088;opacity:.95}
.tb-fantome.tb-app{border-color:var(--amber)}

/* le bac, collé en bas */
.tb-bac{position:sticky;bottom:0;z-index:1;flex:none;display:flex;flex-wrap:wrap;gap:9px 8px;align-content:flex-start;justify-content:center;
  padding:10px 8px 8px;border-radius:12px;border:1px dashed var(--line);background:#160d0f;box-shadow:0 -10px 14px var(--bg);min-height:var(--bac,auto)}
.tb-bac.tb-bac-vide::before{content:'Toutes les pièces sont posées';color:var(--muted);font-size:14px;align-self:center}

/* après « Sous tension » */
.tb-dep.tb-ok .tb-app{color:var(--lum);border-color:#7a5a2a;box-shadow:0 0 12px #ffe6a055}
.tb-dep.tb-ko{background:#ffa62b14}
.tb-dep.tb-ko .tb-app{border-color:var(--danger)}
.tb-ko-chauffe .tb-case[data-t="cable"] .tb-piece,.tb-ko-clac .tb-case[data-t="dj"] .tb-piece,.tb-ko-norme .tb-case[data-t="dj"] .tb-piece,
.tb-ko-raccord .tb-case[data-t="rac"] .tb-piece{outline:3px solid var(--danger);outline-offset:1px;animation:tbSecoue .35s}
.tb-ko-chauffe .tb-case[data-t="cable"] .tb-piece{color:var(--danger);box-shadow:0 0 14px #ffa62bbb}
.tb-ko-chauffe .tb-case[data-t="cable"]::after{content:'🔥';position:absolute;top:-9px;right:-6px;font-size:16px}
.tb-ko-clac .tb-case[data-t="dj"] .tb-piece rect:nth-of-type(2){transform:translateY(5px)}
.tb-ko-nombre .tb-app,.tb-ko-fuite .tb-app{animation:tbSecoue .35s}
.tb-ko-nombre .tb-app small,.tb-ko-fuite .tb-app b{color:var(--danger)}
.tb-rangee.tb-ko-fuite .tb-rtete .tb-piece,.tb-rangee.tb-ko-huit .tb-compte{outline:3px solid var(--danger);outline-offset:2px;border-radius:6px}
.tb-rangee.tb-ko-huit{border-color:var(--danger)}
.tb-gagne .tb-dep.tb-ok .tb-app{animation:tbBrille 1.2s ease-in-out infinite alternate}
@keyframes tbSecoue{0%,100%{transform:none}25%{transform:translateX(-4px)}75%{transform:translateX(4px)}}
@keyframes tbBrille{from{box-shadow:0 0 6px #ffe6a055}to{box-shadow:0 0 18px #ffe6a0cc}}
@media (prefers-reduced-motion:reduce){.tb-tension.tb-pret,.tb-manque .tb-vide .tb-trou,.tb-gagne .tb-dep.tb-ok .tb-app,
  .tb-ko-chauffe .tb-case[data-t="cable"] .tb-piece,.tb-ko-clac .tb-case[data-t="dj"] .tb-piece,.tb-ko-norme .tb-case[data-t="dj"] .tb-piece,
  .tb-ko-raccord .tb-case[data-t="rac"] .tb-piece,.tb-ko-nombre .tb-app,.tb-ko-fuite .tb-app{animation:none}}