/* Game Of Consultant : pages du module, sur les jetons de tokens.css (charte, specs UX). Reprend maquette-e1.html. */
h1,h2,h3{color:var(--ink);margin:0;line-height:var(--lh-tight)}
h1{font-weight:900;font-size:var(--fs-h1)} h2{font-weight:900;font-size:var(--fs-lg)} h3{font-weight:700;font-size:var(--fs-md)}
p{margin:0} button,input,select{font:inherit} button{cursor:pointer}
a{color:var(--ink)}
.muted{color:var(--muted)} .small{font-size:var(--fs-sm)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* Scène : une carte centrée, pleine largeur sur téléphone */
.scene{padding:var(--sp-8) var(--gutter) var(--sp-16);display:grid;justify-items:center}
.carte{width:min(440px,100%);background:var(--surface);border:1px solid var(--rule);border-radius:var(--r);overflow:hidden}
.carte.large{width:min(960px,100%)}
.bandeau{background:var(--band);color:var(--band-ink);padding:18px 20px 22px;position:relative;overflow:hidden}
.bandeau .logo{font-weight:900;letter-spacing:.02em;font-size:15px}
.bandeau .nom{font-weight:900;font-size:22px;margin-top:14px;position:relative;z-index:1}
/* Texte doré sur le bleu : réservé au gros texte (charte, contraste 4,0) ; l'édition, petite, est en crème */
.bandeau .edition{color:rgb(251 249 242 / .85);font-size:var(--fs-sm);margin-top:2px;position:relative;z-index:1}
.bandeau .onde{position:absolute;right:-26px;bottom:-26px;width:84px;height:84px;border-radius:var(--r-wave);background:var(--gold)}
.corps{padding:22px 20px;display:grid;gap:16px}
.pied{border-top:1px solid var(--rule);padding:12px 20px;display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;font-size:var(--fs-sm)}
.pied a,.pied button.lien{color:var(--muted)}
form{margin:0}

/* Contrôles */
.btn{border:1px solid var(--ink);background:var(--ink);color:var(--surface);border-radius:var(--r-sm);padding:11px 16px;font-weight:700;min-height:44px;width:100%;text-align:center;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;gap:10px}
.btn.or{background:var(--gold);border-color:var(--gold);color:var(--gold-ink)}
.btn.fantome{background:transparent;color:var(--ink)}
.btn.court{width:auto}
.btn:disabled,.btn[aria-disabled="true"]{opacity:.5;cursor:not-allowed}
.btn .li{font-style:normal;font-weight:900;background:var(--gold-ink);color:var(--gold);border-radius:3px;width:22px;height:22px;display:grid;place-items:center;font-size:13px}
button.lien{background:none;border:0;padding:0;text-decoration:underline;font-size:inherit}
.rang{display:flex;gap:8px;flex-wrap:wrap}
.ou{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:var(--fs-sm)}
.ou::before,.ou::after{content:"";flex:1;height:1px;background:var(--rule)}
.champs{display:grid;gap:12px}
.champ{display:grid;gap:4px}
.champ label{font-weight:700;font-size:14px;color:var(--ink)}
.champ .aide{font-size:var(--fs-sm);color:var(--muted)}
.champ input{border:1px solid var(--control-border);border-radius:var(--r-sm);padding:10px 12px;background:var(--surface);color:var(--body);min-height:44px;width:100%}
.champ input.code{font-family:var(--mono);letter-spacing:.6em;font-size:22px;text-align:center}
.champ input[aria-invalid="true"]{border-color:var(--crit)}
.piege{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
.erreur{color:var(--crit);font-size:var(--fs-sm);display:flex;gap:6px}
.erreur::before{content:"▲";font-size:10px;margin-top:3px}
.alerte{background:var(--crit-tint);color:var(--crit);border-radius:var(--r-sm);padding:10px 12px;font-size:14px}
.info{background:var(--tint);color:var(--body);border-radius:var(--r-sm);padding:10px 12px;font-size:14px}
.ident{display:flex;justify-content:space-between;gap:8px;font-size:var(--fs-sm);color:var(--muted);flex-wrap:wrap}

/* Liste des équipes */
.equipes{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.equipe{border:1px solid var(--rule);border-radius:var(--r-sm);padding:10px 12px;display:grid;grid-template-columns:1fr auto;gap:4px 10px;align-items:center}
.equipe b{color:var(--ink)}
.equipe .meta{font-size:var(--fs-sm);color:var(--muted)}
.equipe .actions{grid-column:2;grid-row:1 / span 2;display:flex;align-items:center;gap:8px}
.equipe .ouvre{grid-column:1 / -1;display:grid;gap:8px;padding-top:8px;border-top:1px dashed var(--rule);margin-top:6px}
@media (max-width:560px){.equipe{grid-template-columns:1fr}.equipe .actions{grid-column:1;grid-row:auto;justify-content:space-between}}
.pill{display:inline-flex;font-size:12px;font-weight:700;border-radius:var(--r-pill);padding:2px 9px;white-space:nowrap}
.pill.n{background:var(--tint);color:var(--muted)} .pill.d{background:var(--tint-gold);color:var(--sub)}
.vide{border:1px dashed var(--rule);border-radius:var(--r-sm);padding:18px;text-align:center;color:var(--muted);font-size:14px}
.panneau{border:1px solid var(--rule);border-radius:var(--r-sm);padding:14px;display:grid;gap:12px;background:var(--surface)}
.grandcode{font-family:var(--mono);font-size:44px;font-weight:900;color:var(--ink);letter-spacing:.35em;text-align:center;background:var(--tint-gold);border-radius:var(--r-sm);padding:12px 0 12px .35em}
.membres{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.membres li{display:flex;justify-content:space-between;border-bottom:1px solid var(--rule);padding:6px 0}

/* Administration */
table{border-collapse:collapse;width:100%;font-size:14px}
th,td{text-align:left;padding:8px 10px;border-bottom:1px solid var(--rule);vertical-align:top}
th{font-size:var(--fs-xs);letter-spacing:var(--ls-label);text-transform:uppercase;color:var(--muted);background:var(--tint)}
.lienzone{font-family:var(--mono);font-size:13px;word-break:break-all;background:var(--tint);padding:8px 10px;border-radius:var(--r-sm)}
.qr{display:block;margin:0 auto;width:min(280px,100%);height:auto;image-rendering:pixelated}
.projection{min-height:100vh;display:grid;place-items:center;text-align:center;background:var(--band);color:var(--band-ink);gap:24px;padding:32px}
.projection h1{color:var(--band-ink);font-size:48px}
.projection .qr{width:min(60vh,520px);background:#fff;padding:16px;border-radius:var(--r)}
.projection .lienzone{background:rgb(255 255 255 / .1);color:var(--band-ink);font-size:28px}
.grandir{flex:1}
.bas{align-self:end}
.rang.entre{justify-content:space-between;align-items:center}
