/* ═══════════════════════════════════════════════════════════════════════
   MANDAT DIRECT — Écrans d'authentification
   ═══════════════════════════════════════════════════════════════════════ */
.auth{ min-height:100vh; min-height:100svh; display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,1fr); }

/* ── Panneau technique ─────────────────────────────────────────────────── */
.auth-flanc{
  position:relative; overflow:hidden; background:var(--g-nuit); color:var(--txt-inv);
  padding:clamp(2rem,1.4rem + 2.4vw,3.5rem); display:flex; flex-direction:column; gap:var(--e8);
}
.auth-flanc > *{ position:relative; z-index:2; }
.auth-flanc .trame{
  background-image:linear-gradient(rgba(255,255,255,.055) 1px,transparent 1px),
                   linear-gradient(90deg,rgba(255,255,255,.055) 1px,transparent 1px);
  background-size:52px 52px;
  mask-image:radial-gradient(ellipse 70% 60% at 30% 20%,#000 10%,transparent 80%);
  -webkit-mask-image:radial-gradient(ellipse 70% 60% at 30% 20%,#000 10%,transparent 80%);
}
.auth-marque{ display:flex; align-items:center; gap:10px; }
.auth-marque svg{ width:28px; height:28px; }
.auth-marque b{ font-family:var(--f-titre); font-size:1.06rem; font-weight:700; letter-spacing:-.03em; color:#fff; }
.auth-argu{ margin-top:auto; }
.auth-argu h2{ font-size:clamp(1.5rem,1.2rem + 1.4vw,2.125rem); color:#fff; letter-spacing:-.034em; line-height:1.08; max-width:20ch; }
.auth-argu p{ margin-top:var(--e4); font-size:var(--fs-sm); color:rgba(246,244,239,.68); max-width:44ch; line-height:1.6; }

/* Preuves techniques */
.auth-preuves{ display:flex; flex-direction:column; gap:2px; margin-top:var(--e7);
  border:1px solid var(--trait-inv); border-radius:var(--r3); overflow:hidden; background:rgba(255,255,255,.03); }
.auth-preuve{ display:flex; align-items:center; gap:11px; padding:12px 15px; font-size:var(--fs-xs);
  color:rgba(246,244,239,.82); border-bottom:1px solid rgba(255,255,255,.06); }
.auth-preuve:last-child{ border-bottom:0; }
.auth-preuve svg{ width:15px; height:15px; flex:none; color:#54D6A0; }
.auth-preuve b{ color:#fff; font-weight:600; }
.auth-preuve code{ font-family:var(--f-data); font-size:11px; color:var(--or-clair);
  background:rgba(239,176,51,.1); padding:2px 6px; border-radius:5px; margin-left:auto; white-space:nowrap; }

/* ── Colonne formulaire ────────────────────────────────────────────────── */
.auth-corps{
  display:flex; align-items:center; justify-content:center;
  padding:clamp(2rem,1.4rem + 2.4vw,3.5rem) var(--gouttiere); background:var(--papier);
}
.auth-boite{ width:100%; max-width:26rem; }
.auth-boite h1{ font-size:clamp(1.625rem,1.35rem + 1.2vw,2.125rem); letter-spacing:-.035em; line-height:1.05; }
.auth-boite > p.lead{ margin-top:var(--e3); font-size:var(--fs-sm); }
.auth-form{ margin-top:var(--e7); display:flex; flex-direction:column; gap:var(--e5); }
.auth-deux{ display:grid; grid-template-columns:1fr 1fr; gap:var(--e4); }
@media(max-width:420px){ .auth-deux{ grid-template-columns:1fr; } }

.auth-bas{ margin-top:var(--e6); text-align:center; font-size:var(--fs-sm); color:var(--txt-doux); }
.auth-note{ margin-top:var(--e7); padding-top:var(--e5); border-top:1px solid var(--trait);
  font-size:var(--fs-xs); color:var(--txt-tres-doux); line-height:1.6; }

/* Champ mot de passe avec bascule d'affichage */
.champ-mdp{ position:relative; }
.champ-mdp .saisie{ padding-right:46px; }
.oeil{ position:absolute; right:6px; top:50%; transform:translateY(-50%); width:34px; height:34px;
  display:grid; place-items:center; border-radius:8px; color:var(--txt-tres-doux);
  transition:color var(--t1) var(--ease), background-color var(--t1) var(--ease); }
.oeil:hover{ color:var(--marine); background:var(--craie); }
.oeil svg{ width:17px; height:17px; }

/* Jauge de robustesse */
.jauge{ display:flex; gap:4px; margin-top:9px; }
.jauge i{ height:4px; flex:1; border-radius:2px; background:var(--craie-2);
  transition:background-color var(--t2) var(--ease); }
.jauge[data-force="1"] i:nth-child(-n+1){ background:var(--brique); }
.jauge[data-force="2"] i:nth-child(-n+2){ background:#D98324; }
.jauge[data-force="3"] i:nth-child(-n+3){ background:var(--or); }
.jauge[data-force="4"] i{ background:var(--vert); }
.jauge-txt{ margin-top:7px; font-size:var(--fs-xs); color:var(--txt-tres-doux); min-height:1.2em; }
.jauge-txt.ok{ color:var(--vert); }

/* Message d'erreur global */
.alerte{ display:flex; gap:11px; align-items:flex-start; padding:13px 15px; border-radius:var(--r2);
  font-size:var(--fs-sm); line-height:1.5; }
.alerte svg{ width:17px; height:17px; flex:none; margin-top:2px; }
.alerte-ko{ background:var(--brique-clair); color:#8E2F1B; }
.alerte-ok{ background:var(--vert-clair); color:#126544; }
.alerte-info{ background:#E8EFF7; color:#1E4E77; }

@media(max-width:880px){
  .auth{ grid-template-columns:1fr; }
  .auth-flanc{ gap:var(--e6); padding:var(--e6) var(--gouttiere); }
  .auth-argu h2{ font-size:1.3rem; }
  .auth-argu p, .auth-preuves{ display:none; }
  .auth-corps{ padding-block:var(--e8); }
}