/* Loups-Garous de Thiercelieux — conducteur de veillée (spec docs/specs/2026-10-20-loup-garou-veillee-design.md § 8), écrans de préparation : préfixe lg-.
   Les boutons, puces, champs, en-têtes et papiers sont ceux des Parties (css/fil-jeunes.css, préfixe mj-) ; ici seulement ce qui leur manque.
   Jetons --f-* de Le Fil, aucune couleur en dur ; pleine largeur : les listes de rôles et de joueurs se mettent en colonnes dès que la place existe. */

[data-app] .lg { min-width: 0; }

/* ---------- Les étapes du lancement ---------- */
[data-app] .lg-etapes { display: flex; flex-wrap: wrap; gap: 4px 16px; margin: 0 0 14px; padding: 0; list-style: none; font: 500 13px/1.4 Inter, system-ui, sans-serif; color: var(--f-encre-3); }
[data-app] .lg-etape[data-fait] { color: var(--f-fait); }
[data-app] .lg-etape[aria-current="step"] { color: var(--f-encre); font-weight: 600; box-shadow: inset 0 -2px 0 var(--f-encre); }

[data-app] .lg-bloc { margin: 0 0 18px; }
[data-app] .lg-bloc.mj-presents > summary { justify-content: space-between; gap: 8px; }
[data-app] .lg-bloc.mj-presents > summary::after { content: "Modifier"; font: 400 13px/1.4 Inter, system-ui, sans-serif; color: var(--f-encre-2); }
[data-app] .lg-bloc .lg-compte[data-compte-groupes] { margin: 10px 0 6px; }
[data-app] .lg-bloc .mj-h2 { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
[data-app] .lg-fait { padding: 2px 10px; border: 1px solid var(--f-filet); border-radius: 999px; font: 600 12px/1.5 Inter, system-ui, sans-serif; }
[data-app] .lg-fait[data-etat="ok"] { color: var(--f-fait); border-color: var(--f-fait); }
[data-app] .lg-fait[data-etat="alerte"] { color: var(--f-attention); border-color: var(--f-attention); }
[data-app] .lg-synchro { margin: 0 0 10px; font: 400 13px/1.4 Inter, system-ui, sans-serif; color: var(--f-encre-2); }
[data-app] .lg-synchro[data-synchro="hors_reseau"], [data-app] .lg-synchro[data-synchro="perdue"] { color: var(--f-attention); }
[data-app] .lg-synchro[data-synchro="refusee"] { color: var(--f-urgent); }
[data-app] .lg-info { margin: 0 0 10px; font-size: 14px; color: var(--f-attention); }
[data-app] .lg-msg:empty { display: none; }
[data-app] .lg-bas { align-items: flex-start; }
[data-app] .lg-bas .mj-champ { flex: 1 1 100%; }
[data-app] .lg-bas .mj-bouton-plein { flex: 1 1 auto; }
[data-app] .lg-bas-aide { flex-basis: 100%; margin: 0; }
[data-app] .lg-bas .lg-alertes { flex-basis: 100%; }

/* ---------- Composition ---------- */
[data-app] .lg-compte { margin: 6px 0 4px; font: 600 15px/1.4 Inter, system-ui, sans-serif; color: var(--f-encre); }
[data-app] .lg-compte[data-etat="ok"] { color: var(--f-fait); }
[data-app] .lg-compte[data-etat="alerte"] { color: var(--f-urgent); }
[data-app] .lg-boite { margin: 10px 0 0; border-top: 1px solid var(--f-filet); }
[data-app] .lg-boite > summary { min-height: 48px; display: flex; align-items: center; justify-content: space-between; gap: 8px; cursor: pointer; font-weight: 600; }
[data-app] .lg-boite-n { font: 400 13px/1.4 Inter, system-ui, sans-serif; color: var(--f-encre-2); }
[data-app] .lg-roles { margin: 0 0 8px; padding: 0; list-style: none; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 280px), 1fr)); gap: 0 28px; }
[data-app] .lg-role { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 52px; padding: 2px 0; border-bottom: 1px solid var(--f-filet); }
[data-app] .lg-role-nom { flex: 1 1 auto; min-width: 0; display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 8px; }
[data-app] .lg-role-texte { color: var(--f-encre-2); }
[data-app] .lg-role[data-actif] .lg-role-texte { color: var(--f-encre); font-weight: 600; }
[data-app] .lg-camp { padding: 0 8px; border: 1px solid var(--f-filet); border-radius: 999px; font: 400 11px/1.6 Inter, system-ui, sans-serif; color: var(--f-encre-2); }
[data-app] .lg-role-note { flex-basis: 100%; font: 400 12px/1.4 Inter, system-ui, sans-serif; color: var(--f-encre-2); }
[data-app] .lg-pas { flex: none; display: inline-flex; align-items: center; gap: 2px; }
[data-app] .lg-pas-bouton { width: 44px; height: 44px; display: inline-grid; place-items: center; padding: 0; border: 1px solid var(--f-filet); border-radius: 12px; background: var(--f-surface); color: var(--f-encre); font: 500 22px/1 Inter, system-ui, sans-serif; cursor: pointer; }
[data-app] .lg-pas-bouton:disabled { opacity: .35; cursor: default; }
[data-app] .lg-role > .lg-n { min-width: 120px; }
[data-app] .lg-n { min-width: 32px; text-align: center; font: 600 16px/1 Inter, system-ui, sans-serif; font-variant-numeric: tabular-nums; }
[data-app] .lg-alertes { margin: 12px 0 0; padding: 0; list-style: none; }
[data-app] .lg-alerte { margin: 6px 0; padding: 2px 0 2px 10px; border-left: 3px solid var(--f-filet); font: 400 14px/1.4 Inter, system-ui, sans-serif; color: var(--f-encre-2); }
[data-app] .lg-alerte[data-etat="alerte"] { border-left-color: var(--f-urgent); color: var(--f-urgent); font-weight: 500; }
[data-app] .lg-alerte[data-etat="info"] { border-left-color: var(--f-attention); }

/* ---------- Réglages de la maison ---------- */
[data-app] .lg-reglage { width: 100%; display: flex; flex-direction: column; align-items: flex-start; gap: 2px; margin: 6px 0; padding: 10px 14px; min-height: 56px; border: 1px solid var(--f-filet); border-radius: 12px; background: var(--f-surface); color: var(--f-encre); text-align: left; cursor: pointer; }
[data-app] .lg-reglage-lib { font: 500 15px/1.35 Inter, system-ui, sans-serif; }
[data-app] .lg-reglage-aide { font: 400 13px/1.35 Inter, system-ui, sans-serif; color: var(--f-encre-2); }
[data-app] .lg-reglage[aria-pressed="true"] { background: var(--f-encre); border-color: var(--f-encre); color: var(--f-fond); }
[data-app] .lg-reglage[aria-pressed="true"] .lg-reglage-aide { color: var(--f-fond); opacity: .8; }
@media (min-width: 900px) { [data-app] .lg-reglage { width: auto; min-width: 360px; } }

/* ---------- Préparatifs ---------- */
[data-app] .lg-blocs { display: grid; gap: 4px 32px; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 1100px) { [data-app] .lg-blocs { grid-template-columns: repeat(auto-fit, minmax(380px, 1fr)); align-items: start; } }
[data-app] .lg-cartes { display: flex; flex-wrap: wrap; gap: 6px; margin: 8px 0; }
[data-app] .lg-carte { display: inline-flex; align-items: center; min-height: 40px; padding: 0 14px; border-radius: 20px; }
[data-app] .lg-carte:not(.lg-carte-vide) { background: var(--f-encre); border-color: var(--f-encre); color: var(--f-fond); }
[data-app] .lg-carte:not(.lg-carte-vide) .lg-carte-x { color: var(--f-fond); }
[data-app] .lg-bloc .mj-puce:disabled { opacity: .4; cursor: default; }
[data-app] .lg-carte-vide { border: 1px dashed var(--f-encre-3); color: var(--f-encre-2); font-size: 14px; }
[data-app] .lg-carte-x { margin-left: 4px; color: var(--f-encre-2); }
[data-app] .lg-eq[data-groupe="A"] { background: var(--f-equipe-a); border-color: var(--f-equipe-a); color: var(--f-surface); }
[data-app] .lg-eq[data-groupe="B"] { background: var(--f-equipe-b); border-color: var(--f-equipe-b); color: var(--f-encre); }
[data-app] .lg-cercle { position: relative; width: min(100%, 360px); aspect-ratio: 1; margin: 14px auto; }
[data-app] .lg-cercle::before { content: ""; position: absolute; inset: 10%; border: 1px dashed var(--f-encre-3); border-radius: 50%; }
[data-app] .lg-place { position: absolute; transform: translate(-50%, -50%); max-width: 24%; padding: 3px 8px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; border: 1px dashed var(--f-encre-3); border-radius: 999px; background: var(--f-fond); color: var(--f-encre-3); font: 500 12px/1.5 Inter, system-ui, sans-serif; }
[data-app] .lg-place[data-pose] { border: 1px solid var(--f-encre); background: var(--f-surface); color: var(--f-encre); }
[data-app] .lg-place[data-premiere] { background: var(--f-encre); color: var(--f-fond); }
[data-app] .lg-cercle-sens { position: absolute; inset: 44% 22% auto; text-align: center; font: 400 12px/1.3 Inter, system-ui, sans-serif; color: var(--f-encre-3); }

/* ---------- Tirage ---------- */
[data-app] .lg-resume { margin: 10px 0 6px; font: 400 15px/1.45 Inter, system-ui, sans-serif; color: var(--f-encre-2); overflow-wrap: anywhere; }
[data-app] .lg-tirage { margin: 8px 0 0; padding: 0; list-style: none; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 280px), 1fr)); gap: 0 28px; }
[data-app] .lg-joueur { width: 100%; min-height: 52px; display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 4px 2px; border: 0; border-bottom: 1px solid var(--f-filet); background: none; color: var(--f-encre); text-align: left; font: 400 16px/1.3 Inter, system-ui, sans-serif; cursor: pointer; }
[data-app] .lg-joueur-nom { flex: 1 1 auto; min-width: 0; overflow-wrap: anywhere; }
[data-app] .lg-joueur-role { flex: none; font-weight: 600; text-align: right; }
[data-app] .lg-fixe { flex: none; padding: 0 8px; border: 1px solid var(--f-encre); border-radius: 999px; font: 600 11px/1.6 Inter, system-ui, sans-serif; }
[data-app] .lg-feuille { position: fixed; inset: 0; z-index: 200; display: flex; flex-direction: column; justify-content: flex-end; align-items: center; background: color-mix(in srgb, var(--f-encre) 38%, transparent); }
[data-app] .lg-feuille[hidden] { display: none; }
[data-app] .lg-feuille-corps { width: min(100%, 560px); max-height: 86dvh; overflow-y: auto; padding: 20px 16px 24px; border: 1px solid var(--f-filet); border-bottom: 0; border-radius: 24px 24px 0 0; background: var(--f-surface); color: var(--f-encre); }
@media (min-width: 720px) { [data-app] .lg-feuille { justify-content: center; } [data-app] .lg-feuille-corps { border-bottom: 1px solid var(--f-filet); border-radius: 24px; } }
[data-app] .lg-feuille-role { margin: 0 0 8px; color: var(--f-encre-2); }
[data-app] .lg-feuille-titre { margin: 16px 0 4px; font: 600 14px/1.3 Inter, system-ui, sans-serif; color: var(--f-encre-2); }
[data-app] .lg-feuille-msg { min-height: 20px; margin: 8px 0; color: var(--f-urgent); font-size: 14px; }
[data-app] .lg-feuille-corps > .mj-bouton-plein { width: 100%; margin-top: 8px; }

/* ---------- Distribution, Capitaine, attente ---------- */
[data-app] .lg-secret-camp { margin: 0; font: 500 15px/1.4 Inter, system-ui, sans-serif; color: var(--f-encre-2); }
[data-app] .lg-secret-texte { max-width: 34ch; color: var(--f-encre-2); }
[data-app] .lg-capitaine .mj-actions { margin-top: 10px; }
[data-app] .lg-brut { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: 8px 16px; margin: 12px 0; padding: 14px 16px; border: 1px solid var(--f-filet); border-radius: 16px; background: var(--f-surface); font: 400 15px/1.45 Inter, system-ui, sans-serif; }
[data-app] .lg-brut dt { color: var(--f-encre-2); }
[data-app] .lg-brut dd { margin: 0; overflow-wrap: anywhere; }
@media (min-width: 900px) { [data-app] .lg-brut { max-width: 720px; } }

/* ---------- Partie menée sur un autre téléphone ---------- */
[data-app] .lg-bandeau { margin: 0 0 14px; padding: 14px 16px; border: 1px solid var(--f-attention); border-radius: 16px; background: var(--f-surface-2); }
[data-app] .lg-bandeau-titre { margin: 0 0 4px; font: 600 16px/1.35 Inter, system-ui, sans-serif; color: var(--f-attention); }
[data-app] .lg-bandeau .mj-bouton { margin-top: 10px; }
[data-app] .lg-bandeau-msg { margin: 8px 0 0; font-size: 14px; color: var(--f-urgent); }
[data-app] .lg-bandeau-msg:empty { display: none; }

@media (min-width: 720px) {
  [data-app] .lg-bas .mj-champ { flex: 0 1 460px; }
  [data-app] .lg-bas .mj-bouton-plein { flex: 0 0 auto; min-width: 200px; }
}

/* =====================================================================
   LE JEU (js/loupgarou/jeu*.js) : un écran plein cadre posé sur l'application, du début de la nuit à la fin de la partie.
   Deux modes, deux jeux de jetons, TOUS DEUX SOMBRES (pièce tamisée) : le JOUR (aube, jour, fin, tableau) prend les --lgd-* de tokens.css (neutre sombre, accents bleu-ardoise) ; la NUIT prend les --lgn-* (fond noir, corail). La distinction tient à la teinte des accents.
   Tout passe par les variables locales --lgj-* ci-dessous : un seul endroit change de couleur selon le mode. Pleine largeur : la grille des joueurs se range en colonnes,
   le texte reste dans une colonne lisible (1100 px) centrée. Aucun mouvement : rien à neutraliser pour « mouvement réduit ».
   ===================================================================== */
[data-app] .lgj {
  --lgj-fond: var(--lgd-fond); --lgj-surface: var(--lgd-surface); --lgj-texte: var(--lgd-texte); --lgj-texte-2: var(--lgd-texte-2); --lgj-filet: var(--lgd-filet);
  --lgj-accent: var(--lgd-accent); --lgj-sur-accent: var(--lgd-sur-accent); --lgj-alerte: var(--lgd-alerte);
  --f-encre: var(--lgj-texte); --f-attention: var(--lgj-alerte);   /* le cadran du minuteur (css/fil-scene-outils.css) lit ces jetons du Fil */
  position: fixed; inset: 0; z-index: 200; display: flex; flex-direction: column; background: var(--lgj-fond); color: var(--lgj-texte);
  font-family: Inter, system-ui, sans-serif; -webkit-tap-highlight-color: transparent;
}
[data-app] .lgj[data-mode="nuit"] {
  --lgj-fond: var(--lgn-fond); --lgj-surface: var(--lgn-surface); --lgj-texte: var(--lgn-texte); --lgj-texte-2: var(--lgn-texte-2); --lgj-filet: var(--lgn-filet);
  --lgj-accent: var(--lgn-accent); --lgj-sur-accent: var(--lgn-sur-accent); --lgj-alerte: var(--lgn-alerte);
}
[data-app] .lgj *, [data-app] .lgj *::before, [data-app] .lgj *::after { box-sizing: border-box; }
[data-app] .lgj p, [data-app] .lgj h2, [data-app] .lgj h3, [data-app] .lgj h4, [data-app] .lgj ul { margin: 0; }
[data-app] .lgj ul { padding: 0; list-style: none; }

/* En-tête : où l'on en est, le tableau */
[data-app] .lgj-tete { flex: none; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: max(10px, env(safe-area-inset-top)) max(16px, calc((100% - 1100px) / 2)) 10px; border-bottom: 1px solid var(--lgj-filet); }
[data-app] .lgj-tete-texte { min-width: 0; }
[data-app] .lgj-lieu { font: 600 19px/1.2 Inter, system-ui, sans-serif; color: var(--lgj-texte-2); }
[data-app] .lgj-compte { margin-top: 2px; font: 600 17px/1.3 Inter, system-ui, sans-serif; color: var(--lgj-texte-2); }
[data-app] .lgj-tete-actions { flex: none; display: flex; align-items: center; gap: 10px; min-width: 0; }
[data-app] .lgj-synchro { max-width: 40vw; font: 600 17px/1.25 Inter, system-ui, sans-serif; color: var(--lgj-alerte); text-align: right; }
[data-app] .lgj-synchro[hidden] { display: none; }

/* Le corps de l'étape */
[data-app] .lgj-corps { flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain; display: flex; flex-direction: column; gap: 16px; align-items: stretch;
  padding: 20px max(16px, calc((100% - 1100px) / 2)) 28px; }
[data-app] .lgj-role { font: 600 clamp(19px, 3vw, 26px)/1.2 Inter, system-ui, sans-serif; letter-spacing: .01em; color: var(--lgj-texte-2); }
[data-app] .lgj-phrase { max-width: 30ch; font: 400 clamp(30px, 6.4vw, 54px)/1.18 'Instrument Serif', Georgia, serif; color: var(--lgj-texte); text-wrap: balance; overflow-wrap: anywhere; }
@media (min-width: 900px) { [data-app] .lgj-phrase { max-width: 36ch; } }
[data-app] .lgj-consigne, [data-app] .lgj-porteurs, [data-app] .lgj-note { font: 600 17px/1.45 Inter, system-ui, sans-serif; color: var(--lgj-texte-2); overflow-wrap: anywhere; }
[data-app] .lgj-porteurs-lib { opacity: .85; }
[data-app] .lgj-porteurs-noms { font-weight: 700; }
[data-app] .lgj-note-ok { color: var(--lgj-texte); }
[data-app] .lgj-titre-bloc { margin-top: 6px; font: 600 17px/1.3 Inter, system-ui, sans-serif; color: var(--lgj-texte-2); }
[data-app] .lgj-sous-titre { font: 600 17px/1.3 Inter, system-ui, sans-serif; color: var(--lgj-texte-2); }
[data-app] .lgj-bloc { display: grid; gap: 10px; }
[data-app] .lgj-msg:empty { display: none; }
[data-app] .lgj-msg-texte { padding: 10px max(16px, calc((100% - 1100px) / 2)); font: 600 17px/1.4 Inter, system-ui, sans-serif; color: var(--lgj-alerte); }
[data-app] .lgj-msg-texte[data-etat="info"] { color: var(--lgj-texte-2); }

/* Le pied : « Suivant » toujours sous le pouce */
[data-app] .lgj-pied { flex: none; display: flex; flex-wrap: wrap; gap: 10px; padding: 10px max(16px, calc((100% - 1100px) / 2)) max(14px, env(safe-area-inset-bottom)); border-top: 1px solid var(--lgj-filet); background: var(--lgj-fond); }
[data-app] .lgj-pied:empty { display: none; }
[data-app] .lgj-pied .lgj-bouton { flex: 1 1 200px; }

/* Boutons, joueurs, cartes : la même forme, le choix en cours en aplat */
[data-app] .lgj-bouton, [data-app] .lgj-joueur, [data-app] .lgj-tuile, [data-app] .lgj-voile {
  appearance: none; font-family: Inter, system-ui, sans-serif; border: 1px solid var(--lgj-filet); background: var(--lgj-surface); color: var(--lgj-texte-2); cursor: pointer; text-decoration: none;
}
[data-app] .lgj-bouton { display: inline-flex; align-items: center; justify-content: center; min-height: 52px; padding: 0 20px; border-radius: 14px; font: 600 17px/1.2 Inter, system-ui, sans-serif; text-align: center; }
[data-app] .lgj-bouton-petit { min-height: 44px; padding: 0 14px; font-size: 16px; }
[data-app] .lgj-bouton-tableau { min-height: 44px; padding: 0 16px; }
[data-app] .lgj-suivant { min-height: 64px; background: var(--lgj-accent); border-color: var(--lgj-accent); color: var(--lgj-sur-accent); font-size: 20px; }
[data-app] .lgj-personne { align-self: flex-start; }
[data-app] .lgj-bouton[data-arme] { border-color: var(--lgj-alerte); color: var(--lgj-alerte); }
[data-app] .lgj-bouton:disabled, [data-app] .lgj-joueur:disabled, [data-app] .lgj-tuile:disabled { opacity: .38; cursor: default; }
[data-app] .lgj-bouton[aria-pressed="true"], [data-app] .lgj-joueur[aria-pressed="true"], [data-app] .lgj-tuile[aria-pressed="true"] { background: var(--lgj-accent); border-color: var(--lgj-accent); color: var(--lgj-sur-accent); }
[data-app] .lgj-bouton:focus-visible, [data-app] .lgj-joueur:focus-visible, [data-app] .lgj-tuile:focus-visible, [data-app] .lgj-voile:focus-visible { outline: 3px solid var(--lgj-texte); outline-offset: 2px; }

[data-app] .lgj-grille { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 150px), 1fr)); gap: 10px; }
[data-app] .lgj-joueur { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; min-height: 58px; padding: 6px 10px; border-radius: 14px; font: 600 18px/1.25 Inter, system-ui, sans-serif; overflow-wrap: anywhere; }
[data-app] .lgj-joueur-note { font: 600 14px/1.2 Inter, system-ui, sans-serif; opacity: .85; }
[data-app] .lgj-vote-actions { display: flex; flex-wrap: wrap; gap: 10px; }
[data-app] .lgj-vote-actions .lgj-bouton { flex: 1 1 180px; }

/* Le cercle des places */
[data-app] .lgj-cercle { position: relative; width: min(100%, 470px, 60dvh); aspect-ratio: 1; margin: 6px auto; }
[data-app] .lgj-cercle::before { content: ""; position: absolute; inset: 12%; border: 1px dashed var(--lgj-filet); border-radius: 50%; }
[data-app] .lgj-place { position: absolute; transform: translate(-50%, -50%); width: auto; min-width: 44px; max-width: 24%; min-height: 44px; padding: 0 6px; font-size: 16px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: flex; justify-content: center; }
[data-app] .lgj-fantome { opacity: .38; border-style: dashed; cursor: default; align-items: center; }

/* Cartes à toucher (centre du Voleur, Comédien, Chien-Loup, oui ou non) */
[data-app] .lgj-tuiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 230px), 1fr)); gap: 12px; }
[data-app] .lgj-tuile { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; gap: 6px; min-height: 104px; padding: 14px 18px; border-radius: 16px; text-align: left; }
[data-app] .lgj-tuile-titre { font: 400 clamp(26px, 5vw, 34px)/1.1 'Instrument Serif', Georgia, serif; color: var(--lgj-texte); }
[data-app] .lgj-tuile-sous { font: 600 16px/1.35 Inter, system-ui, sans-serif; }
[data-app] .lgj-tuile[aria-pressed="true"] .lgj-tuile-titre { color: var(--lgj-sur-accent); }

/* Ce que la Voyante ou le Renard apprennent, ce que la nuit a laissé */
[data-app] .lgj-info { font: 400 clamp(46px, 11vw, 84px)/1.05 'Instrument Serif', Georgia, serif; color: var(--lgj-texte); overflow-wrap: anywhere; }
[data-app] .lgj-annonce { font: 400 clamp(30px, 6vw, 46px)/1.2 'Instrument Serif', Georgia, serif; color: var(--lgj-texte); }
[data-app] .lgj-morts { display: grid; gap: 12px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 280px), 1fr)); }
[data-app] .lgj-morts .lgj-mort { display: flex; flex-direction: column; gap: 2px; padding: 14px 16px; border: 1px solid var(--lgj-filet); border-radius: 16px; background: var(--lgj-surface); opacity: 1; cursor: default; }
[data-app] .lgj-mort-nom { font: 600 20px/1.25 Inter, system-ui, sans-serif; color: var(--lgj-texte-2); }
[data-app] .lgj-mort-role { font: 400 clamp(28px, 5vw, 38px)/1.1 'Instrument Serif', Georgia, serif; color: var(--lgj-texte); }
[data-app] .lgj-mort-cause { font: 600 16px/1.35 Inter, system-ui, sans-serif; color: var(--lgj-texte-2); }
[data-app] .lgj-faits { display: grid; gap: 4px; padding: 12px 14px; border: 1px solid var(--lgj-filet); border-left-width: 4px; border-radius: 12px; background: var(--lgj-surface); font: 600 17px/1.4 Inter, system-ui, sans-serif; color: var(--lgj-texte-2); }
[data-app] .lgj-rappels { display: grid; gap: 6px; }
[data-app] .lgj-rappel { padding: 2px 0 2px 12px; border-left: 3px solid var(--lgj-filet); font: 600 17px/1.4 Inter, system-ui, sans-serif; color: var(--lgj-texte-2); }

/* Le minuteur du débat (le cadran de css/fil-scene-outils.css, resserré) */
[data-app] .lgj-minuteur { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 4px 20px; padding: 12px 16px; border: 1px solid var(--lgj-filet); border-radius: 16px; background: var(--lgj-surface); }
[data-app] .lgj-minuteur-titre { grid-column: 1 / -1; font: 600 17px/1.3 Inter, system-ui, sans-serif; color: var(--lgj-texte-2); }
[data-app] .lgj-minuteur .fso-cadran { width: 132px; margin: 0; }
[data-app] .lgj-minuteur .chrono-disp { margin: 0; font-size: 32px; color: var(--lgj-texte); }
[data-app] .lgj-minuteur .fso-mot { font-size: 24px; }
[data-app] .lgj-minuteur-actions { display: flex; flex-wrap: wrap; gap: 8px; }
[data-app] .lgj-minuteur-actions .lgj-bouton:first-child { flex: 1 1 100%; }
@media (min-width: 720px) { [data-app] .lgj-minuteur .fso-cadran { width: 160px; } [data-app] .lgj-minuteur .chrono-disp { font-size: 40px; } }

/* Le tableau du meneur : posé sur l'écran de jeu, derrière un voile */
[data-app] .lgj-tableau { position: absolute; inset: 0; z-index: 5; display: flex; flex-direction: column; background: var(--lgj-fond); }
[data-app] .lgj-tableau-tete { flex: none; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: max(10px, env(safe-area-inset-top)) max(16px, calc((100% - 1100px) / 2)) 10px; border-bottom: 1px solid var(--lgj-filet); }
[data-app] .lgj-tableau-titre { font: 600 19px/1.2 Inter, system-ui, sans-serif; color: var(--lgj-texte-2); }
[data-app] .lgj-voile { flex: 1 1 auto; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; margin: 16px; border-radius: 20px; padding: 24px; text-align: center; }
[data-app] .lgj-voile-titre { font: 400 clamp(30px, 6vw, 48px)/1.15 'Instrument Serif', Georgia, serif; color: var(--lgj-texte); }
[data-app] .lgj-voile-sous { font: 600 17px/1.4 Inter, system-ui, sans-serif; }
[data-app] .lgj-tableau-corps { flex: 1 1 auto; min-height: 0; overflow-y: auto; display: flex; flex-direction: column; gap: 14px; padding: 16px max(16px, calc((100% - 1100px) / 2)) 28px; }
[data-app] .lgj-tab-liste { display: grid; gap: 10px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 340px), 1fr)); }
[data-app] .lgj-tab-ligne { display: grid; gap: 8px; align-content: start; padding: 12px 14px; border: 1px solid var(--lgj-filet); border-radius: 14px; background: var(--lgj-surface); }
[data-app] .lgj-tab-ligne[data-vivant="non"] { opacity: .72; }
[data-app] .lgj-tab-entete { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 2px 10px; }
[data-app] .lgj-tab-nom { font: 600 20px/1.25 Inter, system-ui, sans-serif; color: var(--lgj-texte); }
[data-app] .lgj-tab-role { font: 600 17px/1.3 Inter, system-ui, sans-serif; color: var(--lgj-texte-2); }
[data-app] .lgj-tab-sous { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
[data-app] .lgj-puce { padding: 1px 10px; border: 1px solid var(--lgj-filet); border-radius: 999px; font: 600 15px/1.5 Inter, system-ui, sans-serif; color: var(--lgj-texte-2); }
[data-app] .lgj-puce-statut { border-color: var(--lgj-texte-2); }
[data-app] .lgj-retirer { margin-left: auto; }
[data-app] .lgj-tab-actions { display: grid; gap: 8px; justify-items: start; }
[data-app] .lgj-journal, [data-app] .lgj-histoire { display: block; column-width: 320px; column-gap: 28px; }
[data-app] .lgj-journal-section, [data-app] .lgj-histoire-section { break-inside: avoid; margin: 0 0 14px; }
[data-app] .lgj-journal-titre { margin-bottom: 4px; font: 600 17px/1.3 Inter, system-ui, sans-serif; color: var(--lgj-texte-2); }
[data-app] .lgj-journal-phrases, [data-app] .lgj-histoire-phrases { display: grid; gap: 4px; font: 500 16px/1.45 Inter, system-ui, sans-serif; color: var(--lgj-texte); }

/* La fin */
[data-app] .lgj-resultat { font: 400 clamp(38px, 8.5vw, 72px)/1.08 'Instrument Serif', Georgia, serif; color: var(--lgj-texte); text-wrap: balance; }
[data-app] .lgj-gagnants { display: flex; flex-wrap: wrap; gap: 8px; }
[data-app] .lgj-gagnant { display: flex; flex-direction: column; padding: 8px 14px; border: 1px solid var(--lgj-filet); border-radius: 14px; background: var(--lgj-surface); }
[data-app] .lgj-gagnant-nom { font: 600 19px/1.25 Inter, system-ui, sans-serif; color: var(--lgj-texte); }
[data-app] .lgj-gagnant-role { font: 600 16px/1.3 Inter, system-ui, sans-serif; color: var(--lgj-texte-2); }
[data-app] .lgj-quiquoi { display: grid; gap: 6px 24px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 320px), 1fr)); }
[data-app] .lgj-quiquoi-ligne { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 10px; padding: 8px 0; border-bottom: 1px solid var(--lgj-filet); }
[data-app] .lgj-quiquoi-nom { font: 600 18px/1.3 Inter, system-ui, sans-serif; color: var(--lgj-texte); }
[data-app] .lgj-quiquoi-role, [data-app] .lgj-quiquoi-sort { font: 600 16px/1.3 Inter, system-ui, sans-serif; color: var(--lgj-texte-2); }