/* Finition visuelle de l'interface carte. Aucun comportement ni rendu du monde. */
html[data-vue="jeu"] #jeu{--carte-bleu:var(--cuir);--carte-bleu-clair:var(--fer-sombre);--carte-or:var(--or);--carte-papier:var(--parchemin-clair);--carte-ligne:color-mix(in srgb, var(--or) 58%, transparent)}
html[data-vue="jeu"] #jeu .hud{pointer-events:none}
html[data-vue="jeu"] #jeu .bandeau{pointer-events:auto;left:50%;right:auto;width:min(94vw,88rem);min-height:4rem;padding:var(--e-2) var(--e-3);transform:translateX(-50%);background:linear-gradient(105deg,color-mix(in srgb, var(--cuir) 98%, transparent),color-mix(in srgb, var(--cuir-clair) 94%, transparent));border:1px solid var(--carte-ligne);border-bottom:2px solid var(--carte-or);box-shadow:var(--ombre-3)}
html[data-vue="jeu"] #jeu .bandeau__logo{width:3.2rem;height:2.35rem;object-fit:contain;opacity:.92}
html[data-vue="jeu"] #jeu .bandeau__nom{color:var(--or-vif)}html[data-vue="jeu"] #jeu .bandeau__jour,html[data-vue="jeu"] #jeu .bandeau__rang{color:var(--texte)}
@media(min-width:60.0625rem){html[data-vue="jeu"] #jeu #volet-cap,html[data-vue="jeu"] #jeu #volet-nouvelles{top:calc(var(--marge-haut) + 5.35rem)}}
@media(min-width:60.0625rem){html[data-vue="jeu"] #jeu .bandeau__nom{justify-self:start;max-width:14rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}html[data-vue="jeu"] #jeu .bandeau__tresor{position:absolute;left:50%;top:50%;display:flex;align-items:center;justify-content:center;gap:var(--e-1);transform:translate(-50%,-50%);padding:var(--e-1) var(--e-2);background:color-mix(in srgb, var(--verredragon) 50%, transparent);border:1px solid color-mix(in srgb, var(--or) 34%, transparent);border-radius:var(--rayon-case)}html[data-vue="jeu"] #jeu .tresor{gap:var(--e-2);padding:var(--e-1) var(--e-2);min-width:5.25rem;min-height:3.25rem;justify-content:center}html[data-vue="jeu"] #jeu .tresor__marque{width:2.7rem;height:2.7rem}html[data-vue="jeu"] #jeu .tresor__stock{font-size:var(--t-6);font-weight:600}html[data-vue="jeu"] #jeu .tresor__debit{font-size:var(--t-2)}}
html[data-vue="jeu"] #jeu .volet{background:linear-gradient(155deg,color-mix(in srgb, var(--cuir) 94%, transparent),color-mix(in srgb, var(--pierre-4) 96%, transparent));border-color:var(--carte-ligne);box-shadow:var(--ombre-3), inset 0 0 0 1px color-mix(in srgb, var(--parchemin) 8%, transparent)}
html[data-vue="jeu"] #jeu .volet__poignee{min-height:2.8rem;background:linear-gradient(180deg,color-mix(in srgb, var(--fer-sombre) 96%, transparent),color-mix(in srgb, var(--cuir) 96%, transparent));border-color:var(--carte-ligne)}
html[data-vue="jeu"] #jeu .volet__titre{color:var(--or-vif);letter-spacing:.13em}
html[data-vue="jeu"] #jeu .volet .priorite{background:color-mix(in srgb, var(--pierre-3) 34%, transparent);border-color:color-mix(in srgb, var(--or) 28%, transparent)}
html[data-vue="jeu"] #jeu .volet .priorite--urgent{background:color-mix(in srgb, var(--cire) 42%, transparent);border-color:color-mix(in srgb, var(--perte) 82%, transparent)}
html[data-vue="jeu"] #jeu .barre{padding:var(--e-1);background:color-mix(in srgb, var(--cuir) 97%, transparent);border:1px solid var(--carte-ligne);box-shadow:0 -.45rem 1.5rem color-mix(in srgb, var(--pierre-2) 28%, transparent)}
html[data-vue="jeu"] #jeu .barre__entree{min-width:4.5rem;min-height:3.25rem;color:var(--texte);border-top-color:transparent}
html[data-vue="jeu"] #jeu .barre__entree.est-actif,html[data-vue="jeu"] #jeu .barre__entree:hover,html[data-vue="jeu"] #jeu .barre__entree:focus-visible{color:var(--or-vif);background:color-mix(in srgb, var(--or) 14%, transparent);border-top-color:var(--carte-or);outline:none}
html[data-vue="jeu"] #jeu .barre__icone{width:1.8rem;height:1.8rem;opacity:.72}html[data-vue="jeu"] #jeu .barre__entree.est-actif .barre__icone,html[data-vue="jeu"] #jeu .barre__entree:hover .barre__icone,html[data-vue="jeu"] #jeu .barre__entree:focus-visible .barre__icone{opacity:1}
html[data-vue="jeu"] #jeu .feuillet{background:linear-gradient(135deg,color-mix(in srgb, var(--parchemin-clair) 98%, transparent),color-mix(in srgb, var(--or-vif) 97%, transparent));border-color:var(--or-fonce);color:var(--pierre-4);box-shadow:0 -1rem 2.6rem color-mix(in srgb, var(--pierre-2) 38%, transparent)}
html[data-vue="jeu"] #jeu .feuillet .feuillet__titre{color:var(--pierre-4);background:color-mix(in srgb, var(--parchemin-clair) 32%, transparent);border-color:color-mix(in srgb, var(--or-fonce) 42%, transparent)}
html[data-vue="jeu"] #jeu .feuillet__fermer{color:var(--pierre-4);border-color:color-mix(in srgb, var(--or-fonce) 52%, transparent)}
/* Passe de lisibilite : les controles sont des objets de jeu, pas des notes de
   marge. Toutes les cibles gardent au moins 48px pour souris et tactile. */
html[data-vue="jeu"] #jeu .bandeau{min-height:4.5rem}
html[data-vue="jeu"] #jeu .bandeau__nom{font-size:var(--t-6)}
html[data-vue="jeu"] #jeu .bandeau__jour{font-size:var(--t-2)}
html[data-vue="jeu"] #jeu .bandeau__rang{font-size:var(--t-1)}
html[data-vue="jeu"] #jeu .volet{width:min(21rem,24vw)}
html[data-vue="jeu"] #jeu .volet__poignee{min-height:3.15rem;padding-inline:var(--e-4)}
html[data-vue="jeu"] #jeu .volet__titre{font-size:var(--t-3)}
html[data-vue="jeu"] #jeu .volet__corps{padding:var(--e-3) var(--e-3) var(--e-4)}
html[data-vue="jeu"] #jeu .volet .priorite{gap:var(--e-2);padding:var(--e-3) var(--e-3)}
html[data-vue="jeu"] #jeu .volet .priorite__titre{font-size:var(--t-4)}
html[data-vue="jeu"] #jeu .volet .priorite__dit{font-size:var(--t-3);line-height:1.4}
html[data-vue="jeu"] #jeu .volet .priorite__ouvrir{min-height:44px;padding-inline:var(--e-3);font-size:var(--t-1);background:color-mix(in srgb, var(--or) 14%, transparent);border-color:var(--carte-or)}
html[data-vue="jeu"] #jeu .volet__liste--nouvelles li{padding-block:var(--e-2);font-size:var(--t-3);line-height:1.4}
html[data-vue="jeu"] #jeu .monde__outils button,html[data-vue="jeu"] #jeu .monde__outils .carte__outils button{width:52px;height:52px;border:1px solid var(--carte-ligne);border-radius:var(--rayon-case);background:color-mix(in srgb, var(--cuir) 90%, transparent);color:var(--or-vif);box-shadow:var(--ombre-2)}
html[data-vue="jeu"] #jeu .barre{gap:var(--e-1);padding-bottom:calc(var(--marge-bas) + .5rem)}
html[data-vue="jeu"] #jeu .barre__entree{min-width:5.4rem;min-height:3.4rem;gap:var(--e-0);padding:var(--e-1) var(--e-1);color:var(--texte);background:color-mix(in srgb, var(--cuir) 58%, transparent);border:1px solid color-mix(in srgb, var(--or) 18%, transparent);border-radius:var(--rayon-case);transition:background 140ms ease,border-color 140ms ease,color 140ms ease,transform 140ms ease}
html[data-vue="jeu"] #jeu .barre__entree.est-actif{color:var(--or-vif);background:color-mix(in srgb, var(--or) 22%, transparent);border-color:var(--carte-or);box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--or-vif) 18%, transparent), var(--ombre-2)}
html[data-vue="jeu"] #jeu .barre__entree:hover,html[data-vue="jeu"] #jeu .barre__entree:focus-visible{color:var(--parchemin-clair);background:color-mix(in srgb, var(--fer-sombre) 82%, transparent);border-color:var(--or-vif);transform:translateY(-2px)}
html[data-vue="jeu"] #jeu .barre__icone{width:1.7rem;height:1.7rem}
html[data-vue="jeu"] #jeu .barre__mot{font-size:var(--t-1);letter-spacing:.07em;line-height:1.25}
html[data-vue="jeu"] #jeu .feuillet__actions button,html[data-vue="jeu"] #jeu .feuillet__fermer{min-height:48px}
@media(max-width:42rem){html[data-vue="jeu"] #jeu .bandeau{width:calc(100vw - .8rem)}html[data-vue="jeu"] #jeu .bandeau__logo{width:2.25rem;height:1.9rem}html[data-vue="jeu"] #jeu .barre__entree{min-width:0;flex:1 1 0}html[data-vue="jeu"] #jeu .barre__icone{width:1.55rem;height:1.55rem}}
@media(max-width:42rem){html[data-vue="jeu"] #jeu .bandeau{min-height:3.8rem}html[data-vue="jeu"] #jeu .bandeau__nom{font-size:var(--t-4)}html[data-vue="jeu"] #jeu .bandeau__jour{font-size:var(--t-1)}html[data-vue="jeu"] #jeu .volet{width:calc(100vw - 1rem)}html[data-vue="jeu"] #jeu .barre{gap:var(--e-0)}html[data-vue="jeu"] #jeu .barre__entree{min-height:3.5rem;padding-inline:var(--e-0)}html[data-vue="jeu"] #jeu .barre__mot{font-size:var(--t-1)}}
@media(prefers-reduced-motion:reduce){html[data-vue="jeu"] #jeu .feuillet,html[data-vue="jeu"] #jeu .volet__chevron{transition:none}}
/* Etats de jeu : chargement, selection et action. */
html[data-vue="jeu"] #jeu .monde{background:radial-gradient(circle at 50% 42%,var(--fer-sombre) 0,var(--cuir-clair) 48%,var(--pierre-4) 100%)}
html[data-vue="jeu"]:not([data-page-ouverte]) #jeu .monde__vue:empty:before{content:'La carte se prépare…';position:absolute;inset:0;display:grid;place-items:center;color:var(--parchemin-clair);font:var(--t-5) var(--police-titre);letter-spacing:.08em;background:radial-gradient(circle,color-mix(in srgb, var(--or-fonce) 55%, transparent),color-mix(in srgb, var(--pierre-4) 92%, transparent));z-index:2}
html[data-vue="jeu"] #jeu .monde__vue>svg{transition:filter 180ms ease}
html[data-vue="jeu"] #jeu .carte__marque{filter:drop-shadow(0 2px 3px color-mix(in srgb, var(--pierre-1) 65%, transparent));transition:filter 140ms ease,transform 140ms ease}
html[data-vue="jeu"] #jeu .carte__marque:hover,html[data-vue="jeu"] #jeu .carte__marque:focus-visible{filter:drop-shadow(0 0 7px color-mix(in srgb, var(--or-vif) 95%, transparent));transform:scale(1.12);outline:none}
html[data-vue="jeu"] #jeu .est-designe{filter:drop-shadow(0 0 8px color-mix(in srgb, var(--or-vif) 95%, transparent))}
html[data-vue="jeu"] #jeu .carte-region__aller,html[data-vue="jeu"] #jeu .autour__nom{min-height:48px;padding:var(--e-2) var(--e-4);background:linear-gradient(180deg,var(--or-sourd),var(--or-fonce));border:1px solid var(--or-vif);border-radius:var(--rayon-case);color:var(--parchemin-clair);font-weight:600;box-shadow:inset 0 1px 0 color-mix(in srgb, var(--parchemin-clair) 25%, transparent), var(--ombre-2)}
html[data-vue="jeu"] #jeu .carte-region__aller:hover,html[data-vue="jeu"] #jeu .carte-region__aller:focus-visible,html[data-vue="jeu"] #jeu .autour__nom:hover,html[data-vue="jeu"] #jeu .autour__nom:focus-visible{background:linear-gradient(180deg,var(--or),var(--or-fonce));border-color:var(--parchemin-clair);outline:2px solid color-mix(in srgb, var(--or-vif) 65%, transparent);outline-offset:2px;transform:translateY(-1px)}
/* Passe finale : une lecture en trois zones, des panneaux secondaires et une
   fiche de lieu qui porte vraiment l'action. */
@media(min-width:60.0625rem){
  html[data-vue="jeu"] #jeu .bandeau{width:calc(100vw - 1.5rem);max-width:none;height:4.5rem;min-height:4.5rem;max-height:4.5rem;grid-template-columns:auto auto minmax(12rem,1fr) auto auto;grid-template-rows:1fr;align-items:center;column-gap:var(--e-3);white-space:nowrap;overflow:visible}
  /* Le bandeau tient sur une ligne, mais ses NOTES sont des paragraphes.
     Le `white-space:nowrap` ci-dessus descendait jusqu au detail d un debit :
     « Les camps prennent leur part, 18 pour cent » sortait de la note et se
     superposait a son propre montant. Mesure du 15/09/2026. */
  html[data-vue="jeu"] #jeu .bandeau .chiffre__lignes{white-space:normal}
  html[data-vue="jeu"] #jeu .bandeau__jour{justify-self:start}
  html[data-vue="jeu"] #jeu .bandeau__nom{grid-column:3;justify-self:start;max-width:18rem}
  html[data-vue="jeu"] #jeu .bandeau__tresor{grid-column:4;position:static;justify-self:center;transform:none}
  html[data-vue="jeu"] #jeu .bandeau__rang{grid-column:5;justify-self:end}
  html[data-vue="jeu"] #jeu .volet{width:min(20rem,21vw);border-radius:var(--rayon-case)}
  html[data-vue="jeu"] #jeu .volet--gauche{left:1.2rem}
  html[data-vue="jeu"] #jeu .volet--droite{right:1.2rem}
}
html[data-vue="jeu"] #jeu .volet__poignee{cursor:pointer;transition:background 140ms ease,border-color 140ms ease}
html[data-vue="jeu"] #jeu .volet__poignee:hover,html[data-vue="jeu"] #jeu .volet__poignee:focus-visible{background:linear-gradient(180deg,color-mix(in srgb, var(--fer-sombre) 98%, transparent),color-mix(in srgb, var(--cuir-clair) 98%, transparent));border-color:var(--or-vif);outline:0}
html[data-vue="jeu"] #jeu .volet__compte{min-width:1.65rem;min-height:1.65rem;padding:var(--e-0) var(--e-2);background:var(--perte-fond);color:var(--parchemin-clair);font-size:var(--t-2)}
html[data-vue="jeu"] #jeu .volet__liste--nouvelles .jour{color:var(--or-vif)}
html[data-vue="jeu"] #jeu .feuillet{width:min(42rem,calc(100vw - 2rem));left:50%;right:auto;transform:translateX(-50%);border-radius:.45rem .45rem 0 0}
html[data-vue="jeu"] #jeu .feuillet__entete{padding-inline:var(--e-4)}
html[data-vue="jeu"] #jeu .feuillet__corps{font-size:var(--t-4);line-height:1.5}
html[data-vue="jeu"] #jeu .feuillet__actions{gap:var(--e-2);padding-inline:var(--e-4)}
html[data-vue="jeu"] #jeu .feuillet__actions .carte-region__aller{flex:1;min-height:52px;font-size:var(--t-3);font-weight:600}
html[data-vue="jeu"] #jeu .carte-region__siege{padding:var(--e-2) var(--e-3);color:var(--parchemin-clair);background:color-mix(in srgb, var(--perte-fond) 55%, transparent);border-left:3px solid var(--perte)}
html[data-vue="jeu"] #jeu .carte-region__maison{padding:var(--e-2) var(--e-2);background:color-mix(in srgb, var(--cuir-clair) 20%, transparent);border-left:3px solid var(--carte-or)}
html[data-vue="jeu"] #jeu .carte__ville-nom,html[data-vue="jeu"] #jeu .carte__cartouche{paint-order:stroke;stroke:color-mix(in srgb, var(--verredragon) 75%, transparent);stroke-width:2px}
html[data-vue="jeu"] #jeu .carte__ville:hover,html[data-vue="jeu"] #jeu .carte__cite:hover{filter:drop-shadow(0 0 7px color-mix(in srgb, var(--or-vif) 90%, transparent));cursor:pointer}
html[data-vue="jeu"] #jeu button:focus-visible{outline:2px solid var(--or-vif);outline-offset:3px}
html[data-vue="jeu"] #jeu .tresor{border-radius:var(--rayon-case);transition:background 140ms ease,transform 140ms ease}
html[data-vue="jeu"] #jeu .tresor:hover{background:color-mix(in srgb, var(--or) 16%, transparent);transform:translateY(-1px)}
/* Le transform du survol ouvre un contexte d empilement : la note d un debit
   restait SOUS les cases ecrites apres elle, et le joueur lisait son total
   a travers le fer. Mesure du 15/09/2026. */
html[data-vue="jeu"] #jeu .tresor:hover,html[data-vue="jeu"] #jeu .tresor:focus-within,html[data-vue="jeu"] #jeu .tresor:has(.chiffre--ouvert){position:relative;z-index:41}
@media(max-width:60rem){
  html[data-vue="jeu"] #jeu .bandeau{transform:none;left:.4rem;right:.4rem;width:calc(100vw - .8rem);max-width:none}
  html[data-vue="jeu"] #jeu .bandeau__tresor{display:flex;position:relative;left:auto;top:auto;transform:none;grid-column:1/-1;justify-self:center;margin-top:var(--e-0)}
  html[data-vue="jeu"] #jeu .tresor{min-height:2.9rem;padding:var(--e-1) var(--e-2)}
  html[data-vue="jeu"] #jeu .tresor__marque{width:2.1rem;height:2.1rem}
  html[data-vue="jeu"] #jeu .tresor__stock{font-size:var(--t-5)}
}
@media(max-width:42rem){
  html[data-vue="jeu"] #jeu .bandeau__tresor{gap:.05rem;overflow-x:auto;max-width:100%;justify-content:flex-start}
  html[data-vue="jeu"] #jeu .feuillet{width:calc(100vw - 1rem);border-radius:.4rem .4rem 0 0}
  html[data-vue="jeu"] #jeu .feuillet__actions{padding-inline:var(--e-3)}
  html[data-vue="jeu"] #jeu .feuillet__actions .carte-region__aller{min-height:48px;font-size:var(--t-2)}
}
/* Le bandeau desktop passe en flex : trois zones stables, aucune ligne
   fantome et aucune ressource qui glisse dans la colonne du compte. */
@media(min-width:60.0625rem){
  html[data-vue="jeu"] #jeu .bandeau{display:flex;align-items:center;gap:var(--e-3);grid-template-columns:none;grid-template-rows:none}
  html[data-vue="jeu"] #jeu .bandeau__logo{flex:0 0 auto}
  html[data-vue="jeu"] #jeu .bandeau__jour{flex:0 0 auto}
  /* Le titre coupe sa FIN, et sa fin est la pastille de niveau. Le defaut
     est le meme que sur telephone (voir `coque.css`, meme date) : la boite
     est en `overflow:hidden` et le nom mange toute la place, donc
     « NIVEAU 1 » sortait a moitie et le joueur lisait « Alys Roche … ».
     Ce qui varie est le nom ; ce qui est court et fixe est le niveau. */
  html[data-vue="jeu"] #jeu .bandeau__nom{flex:0 1 26rem;min-width:13.5rem;max-width:26rem;display:flex;align-items:baseline;gap:var(--e-2);overflow:hidden;grid-column:auto;justify-self:auto}
  html[data-vue="jeu"] #jeu .bandeau__nom #nom-affiche{flex:0 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  html[data-vue="jeu"] #jeu .bandeau__niveau{flex:0 0 auto}
  /* 🔴 Le coffre etait pose en absolu au milieu du bandeau, donc PAR-DESSUS
     le nom. Mesure le 15/09/2026 sur 1440 px : le coffre s’etend de 450 a
     990 px, le nom court jusqu’a 534, et le joueur lisait « A l0och » au
     lieu de « Alys Roche ». Un absolu ne connait pas ses voisins. Le coffre
     reste donc dans le flux et prend la place restante, ou il se centre :
     trois zones qui ne peuvent plus se recouvrir. */
  html[data-vue="jeu"] #jeu .bandeau__tresor{position:static;flex:1 1 auto;display:flex;justify-content:center;transform:none;grid-column:auto;justify-self:auto;margin:0;min-width:0}
  html[data-vue="jeu"] #jeu .bandeau__rang{display:flex;align-items:center;gap:var(--e-3);flex:0 0 auto;margin-left:0;grid-column:auto;justify-self:auto}
  html[data-vue="jeu"] #jeu .cartouche-jour{top:calc(var(--marge-haut) + 4.5rem + .55rem)}
}
/* 🔴 Le coffre passait a la ligne et sortait du bandeau. Mesure du 15/09/2026
   sur 1 440 px, la Longue Nuit affichee : le bandeau fait 72 px de haut, le
   coffre 122, ses cases sur deux rangs a y=-20 et y=37, et les deux dernieres
   flottaient sur la page sous le bandeau. La cause est arithmetique : logo,
   jour, nuit, titre et compte prennent mille pixels, il en reste 416 pour cinq
   cases taillees pour 550. Entre 961 et 1 920 px les cases se resserrent donc,
   et le rang ne se coupe plus jamais. Au-dela, la place existe et le coffre
   garde sa taille pleine. Le seuil passe de 1 536 à 1 920 px le 29/09/2026 : un
   seigneur (six cases à quatre chiffres et leurs débits, pastille « assaut dans
   4 j, 94 morts ») coupait « Se connecter » à 1 440 et 1 600 px. */
@media(min-width:60.0625rem) and (max-width:120rem){
  html[data-vue="jeu"] #jeu .bandeau__tresor{flex-wrap:nowrap;gap:var(--e-0)}
  html[data-vue="jeu"] #jeu .tresor{min-width:4.4rem;padding:var(--e-1) var(--e-1);gap:var(--e-1)}
  html[data-vue="jeu"] #jeu .tresor__marque{width:1.9rem;height:1.9rem}
  html[data-vue="jeu"] #jeu .tresor__stock{font-size:var(--t-5)}
  html[data-vue="jeu"] #jeu .tresor__debit{font-size:var(--t-1)}
  /* Le coffre resserre touchait le rang : « 0PAYSAN » se lisait d un bloc. */
  html[data-vue="jeu"] #jeu .bandeau__rang{margin-left:var(--e-3)}
}
/* Polish de production : les panneaux fermes deviennent des onglets de carte,
   les controles gagnent une hierarchie et la feuille de selection devient la
   piece forte quand un lieu est touche. */
@media(min-width:60.0625rem){
  html[data-vue="jeu"] #jeu .volet{width:min(18.5rem,19vw)}
  html[data-vue="jeu"] #jeu .volet:has(.volet__poignee[aria-expanded="false"]){width:15.5rem}
  html[data-vue="jeu"] #jeu .volet:has(.volet__poignee[aria-expanded="false"]) .volet__poignee{min-height:2.7rem}
  html[data-vue="jeu"] #jeu .volet--gauche:has(.volet__poignee[aria-expanded="false"]){left:.8rem}
  html[data-vue="jeu"] #jeu .volet--droite:has(.volet__poignee[aria-expanded="false"]){right:.8rem}
}
html[data-vue="jeu"] #jeu .volet:has(.volet__poignee[aria-expanded="false"]){box-shadow:var(--ombre-2), inset 0 0 0 1px color-mix(in srgb, var(--parchemin) 8%, transparent)}
html[data-vue="jeu"] #jeu .volet:has(.volet__poignee[aria-expanded="false"]) .volet__titre{font-size:var(--t-1)}
html[data-vue="jeu"] #jeu .cartouche-jour{background:linear-gradient(180deg,color-mix(in srgb, var(--cuir) 96%, transparent),color-mix(in srgb, var(--pierre-4) 96%, transparent));border-color:var(--carte-ligne);box-shadow:var(--ombre-2)}
html[data-vue="jeu"] #jeu .cartouche-jour__sceau{width:3rem;height:3rem;background:radial-gradient(circle at 35% 28%,var(--fer-sombre),var(--cuir) 74%);border-color:var(--carte-or);color:var(--or-vif)}
html[data-vue="jeu"] #jeu .cartouche-jour__quoi{color:var(--or-vif)}
html[data-vue="jeu"] #jeu .cartouche-jour__phase{color:var(--parchemin-clair)}
html[data-vue="jeu"] #jeu .monde__outils button{min-width:52px;min-height:52px}
html[data-vue="jeu"] #jeu .monde__outils button:hover,html[data-vue="jeu"] #jeu .monde__outils button:focus-visible{background:linear-gradient(180deg,var(--fer-sombre),var(--cuir-clair));border-color:var(--or-vif);box-shadow:0 0 0 2px color-mix(in srgb, var(--or-vif) 20%, transparent), var(--ombre-2);transform:translateX(-2px)}
/* Les modes sont des libelles, pas des boutons ronds : ils gardent une
   largeur lisible et restent dans leur colonne sans toucher au zoom. */
html[data-vue="jeu"] #jeu .monde__outils .carte__outils .carte__mode{width:12rem;min-width:12rem;height:auto;min-height:48px;padding:var(--e-2) var(--e-3);border-radius:var(--rayon-case);text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:var(--t-2);letter-spacing:.04em;background:color-mix(in srgb, var(--cuir) 92%, transparent);border:1px solid var(--carte-ligne);color:var(--parchemin-clair)}
html[data-vue="jeu"] #jeu .monde__outils .carte__outils .carte__mode:hover,html[data-vue="jeu"] #jeu .monde__outils .carte__outils .carte__mode:focus-visible{background:linear-gradient(180deg,var(--fer-sombre),var(--cuir-clair));border-color:var(--or-vif);color:var(--or-vif);transform:none}
html[data-vue="jeu"] #jeu .monde__outils .carte__outils{gap:var(--e-2);align-items:flex-end}
html[data-vue="jeu"] #jeu .feuillet{max-width:42rem;max-height:calc(100dvh - 7rem)}
html[data-vue="jeu"] #jeu .feuillet__entete{background:linear-gradient(90deg,color-mix(in srgb, var(--parchemin-clair) 26%, transparent),transparent);border-bottom:1px solid color-mix(in srgb, var(--or-fonce) 35%, transparent)}
html[data-vue="jeu"] #jeu .feuillet__titre{font-size:var(--t-6);letter-spacing:.04em}
html[data-vue="jeu"] #jeu .feuillet .carte-region__dit{color:var(--bois)}
html[data-vue="jeu"] #jeu .feuillet .carte-region__sous-titre{color:var(--or-fonce);font-size:var(--t-2);letter-spacing:.12em;text-transform:uppercase}
html[data-vue="jeu"] #jeu .feuillet__actions .carte-region__aller{box-shadow:inset 0 1px 0 color-mix(in srgb, var(--parchemin-clair) 25%, transparent),0 3px 8px color-mix(in srgb, var(--bois) 22%, transparent);transition:filter 140ms ease,transform 140ms ease}
html[data-vue="jeu"] #jeu .feuillet__actions .carte-region__aller:active{transform:translateY(1px);filter:brightness(.92)}
html[data-vue="jeu"] #jeu .barre__entree:active{transform:translateY(1px)}

/* La barre d'outils de la carte en fer et cuir (9 septembre 2026, point 61).
   Six ronds noirs identiques ne disaient rien : sur une carte de parchemin,
   une commande est une plaque de fer rivée sur une lanière de cuir. */
html[data-vue="jeu"] #jeu .monde__outils .carte__outils{padding:var(--e-2) var(--e-1);border:1px solid color-mix(in srgb, var(--bois) 70%, transparent);border-radius:var(--rayon-case);background:linear-gradient(180deg,color-mix(in srgb, var(--cuir) 94%, transparent),color-mix(in srgb, var(--pierre-4) 96%, transparent));box-shadow:inset 0 1px 0 color-mix(in srgb, var(--or-vif) 18%, transparent), var(--ombre-2)}
html[data-vue="jeu"] #jeu .monde__outils button,html[data-vue="jeu"] #jeu .monde__outils .carte__outils button{width:50px;height:50px;border:1px solid var(--bois);border-radius:var(--rayon-case);background:linear-gradient(180deg,var(--fer-sombre),var(--pierre-4));color:var(--or-vif);font-size:var(--t-5);box-shadow:inset 0 1px 0 color-mix(in srgb, var(--parchemin) 22%, transparent), inset 0 -2px 4px color-mix(in srgb, var(--pierre-0) 45%, transparent), var(--ombre-2)}
html[data-vue="jeu"] #jeu .monde__outils button:hover,html[data-vue="jeu"] #jeu .monde__outils button:focus-visible{background:linear-gradient(180deg,var(--neutre),var(--cuir));border-color:var(--alerte);color:var(--parchemin-clair);box-shadow:inset 0 1px 0 color-mix(in srgb, var(--parchemin-clair) 30%, transparent), 0 0 0 2px color-mix(in srgb, var(--alerte) 25%, transparent), var(--ombre-2);transform:translateX(-2px)}
/* Les deux commandes de zoom se distinguent des quatre autres : un fer plus clair. */
html[data-vue="jeu"] #jeu .monde__outils .carte__outils button:nth-child(1),html[data-vue="jeu"] #jeu .monde__outils .carte__outils button:nth-child(2){background:linear-gradient(180deg,var(--encre-pale),var(--pierre-4));border-radius:.9rem}
/* Les deux commandes de rotation sont rondes, comme une roue. */
html[data-vue="jeu"] #jeu .monde__outils .carte__outils button:nth-child(3),html[data-vue="jeu"] #jeu .monde__outils .carte__outils button:nth-child(4){border-radius:var(--rayon-rond)}
/* Le coffre garde la largeur de ses cases : comprimé sous son contenu (346 px pour 388 à 1 280 de large, 183 pour 307
   à 1 024), il laissait ses cases déborder sur le rang, « 12PRINCE » (recette du lot 8 bis, 29/09/2026). Le nom, coupé
   en fin de ligne, cède la place ; de la tablette à 1 584 px, la barre d'expérience du bandeau se retire, le niveau reste
   écrit : à 1 441 px elle réduisait le nom à « E. », à 768 px à « Ed… » (tools/_coffre-et-rang.mjs). */
@media(min-width:60.0625rem){
  html[data-vue="jeu"] #jeu .hud .bandeau > .bandeau__tresor.bandeau__tresor{min-width:max-content;flex-shrink:0}
}
@media(min-width:42.0625rem) and (max-width:99rem){
  html[data-vue="jeu"] #jeu .hud .bandeau .bandeau__xp{display:none}
}
/* Sous 1 440 px, un prince ou un seigneur (six cases à quatre chiffres) poussait le rang et la connexion hors de l'écran :
   le logo, l'âge et les séparateurs se retirent comme au téléphone, le niveau aussi (il laissait « E… » du nom), et le nom
   descend à 7rem, coupé en fin de ligne. La pastille de la nuit garde la phase ; l'assaut qui vient passe à sa bordure
   rouge, la horde à la page de la Nuit, comme au téléphone (jeu/styles/cadre.css). */
@media(min-width:60.0625rem) and (max-width:90rem){
  html[data-vue="jeu"] #jeu .hud .bandeau__nuit :is(.bandeau__nuit-assaut,.bandeau__nuit-horde){display:none}
  html[data-vue="jeu"] #jeu .hud .bandeau > .bandeau__logo{display:none}
  html[data-vue="jeu"] #jeu .hud .bandeau > .bandeau__nom{min-width:7rem}
  html[data-vue="jeu"] #jeu .hud .bandeau{gap:var(--e-2)}
  html[data-vue="jeu"] #jeu .hud .bandeau :is(.bandeau__separateur,.bandeau__age,.bandeau__niveau){display:none}
  html[data-vue="jeu"] #jeu .hud .bandeau .bandeau__rang{margin-left:0}
}
/* Jusqu'à 1 920 px, l'âge et ses séparateurs cèdent leur place au coffre ; l'âge reste sur la fiche du personnage. */
@media(min-width:90.0625rem) and (max-width:120rem){
  html[data-vue="jeu"] #jeu .hud .bandeau :is(.bandeau__separateur,.bandeau__age){display:none}
}
/* Sous 1 088 px, six cases à quatre chiffres laissaient le bouton de connexion à 1 px du bord : les chiffres du coffre
   descendent d'un cran. */
@media(min-width:60.0625rem) and (max-width:68rem){
  html[data-vue="jeu"] #jeu .hud .tresor{min-width:3.9rem}
  html[data-vue="jeu"] #jeu .hud .tresor__stock{font-size:var(--t-4)}
}
/* De 961 à 1 100 px, « Grand Seigneur » poussait « Se connecter » de 40 px hors de l'écran (1 024 px, six cases à quatre
   chiffres) : le rang passe sur deux lignes, à la largeur de son mot le plus long, et le bouton de connexion se resserre. Banc : tools/_coffre-et-rang.mjs. */
@media(min-width:60.0625rem) and (max-width:68.75rem){
  html[data-vue="jeu"] #jeu .hud .bandeau .bandeau__rang{gap:var(--e-2)}
  html[data-vue="jeu"] #jeu .hud .bandeau .bandeau__rang #rang-affiche{white-space:normal;width:min-content;line-height:1.1;text-align:right;letter-spacing:.04em}
  html[data-vue="jeu"] #jeu .hud .bandeau .bandeau__rang .bandeau__compte{padding-inline:var(--e-2);letter-spacing:.04em}
}