/* ─────────────────────────────────────────────────────────────────────────
   auth.css — les écrans « hors session » du module : connexion/inscription
   (index.php), nouveau mot de passe (reset.php), confirmation d'adresse
   (email.php). Sorti de la balise <style> d'index.php le 19/09/2026 pour que
   les trois écrans restent identiques sans copier le même bloc trois fois.
   L'accueil des sports (accueil.php) et les pages « en construction »
   (_chantier.php) s'y posent aussi, avec accueil.css par-dessus (04/10/2026).

   Le corps de page DÉFILE (il était en overflow:hidden) : l'inscription a pris
   un champ (l'e-mail) et, clavier ouvert sur un petit téléphone, la carte
   dépassait sans qu'on puisse descendre jusqu'au bouton. `margin:auto` sur la
   carte la centre tant qu'elle tient, et la laisse défiler dès qu'elle ne tient
   plus — `justify-content:center` seul coupait le HAUT de la carte.
   ───────────────────────────────────────────────────────────────────────── */
body{
  min-height:100vh;min-height:100dvh;margin:0;
  display:flex;flex-direction:column;align-items:center;
  padding:4.75rem 0 2.5rem;box-sizing:border-box;
  overflow-x:hidden;font-family:var(--fn-body);
}
body::after{
  content:"";position:fixed;inset:0;
  background:radial-gradient(ellipse 50% 40% at 70% 30%, rgba(var(--pl-lime-rgb,199,245,70),.06), transparent 60%);
  pointer-events:none;z-index:0;
}
.login-wrap{width:min(380px,94vw);position:relative;z-index:1;margin:auto 0}
.login-header{margin-bottom:1.75rem;text-align:center}
.login-logo{
  font-family:var(--fn-disp);font-size:3rem;font-weight:900;
  letter-spacing:-0.03em;color:var(--pl-text);line-height:.9;
  display:inline-flex;align-items:center;gap:10px;
}
.login-logo::after{
  content:'';width:10px;height:10px;border-radius:2px;
  background:var(--pl-lime);box-shadow:0 0 14px var(--pl-lime);
}
.login-tagline{font-family:var(--fn-mono);font-size:10px;color:var(--pl-faint);letter-spacing:.22em;margin-top:.55rem;text-transform:uppercase}
.login-card{background:var(--pl-bg2);border:1px solid var(--pl-bdr);border-radius:12px;padding:1.75rem}
.tabs{display:flex;border-bottom:1px solid var(--pl-bdr);margin-bottom:1.6rem;gap:.2rem}
.tab{
  flex:1;text-align:center;padding:.65rem .4rem;
  font:600 11px/1 var(--fn-mono);letter-spacing:.14em;text-transform:uppercase;
  color:var(--pl-dim);border-bottom:2px solid transparent;
  cursor:pointer;transition:color .15s,border-color .15s;margin-bottom:-1px;
}
.tab:hover{color:var(--pl-text)}
.tab.active{color:var(--pl-lime);border-bottom-color:var(--pl-lime)}
.panel{display:none}.panel.active{display:block}
.field{margin-bottom:.85rem;display:flex;flex-direction:column;gap:.35rem}
.field label{font:600 9.5px/1 var(--fn-mono);letter-spacing:.18em;color:var(--pl-dim);text-transform:uppercase}
.field input.input{
  padding:11px 13px;background:var(--pl-bg);border:1px solid var(--pl-bdr);
  border-radius:7px;color:var(--pl-text);font:500 13px/1 var(--fn-body);outline:none;
  transition:border-color .15s,box-shadow .15s;
}
.field input.input:focus{border-color:rgba(var(--pl-lime-rgb,199,245,70),.5);box-shadow:0 0 0 3px rgba(var(--pl-lime-rgb,199,245,70),.07)}
.field input.input::placeholder{color:var(--pl-faint)}
.field-hint{font:400 11px/1.4 var(--fn-body);color:var(--pl-dim)}
.back-link{
  position:absolute;top:1.5rem;left:1.75rem;
  font:600 10px/1 var(--fn-mono);color:var(--pl-dim);
  letter-spacing:.16em;text-transform:uppercase;
  padding:8px 12px;border:1px solid var(--pl-bdr);border-radius:6px;
  text-decoration:none;transition:color .15s,border-color .15s,background .15s;
  display:inline-flex;align-items:center;gap:7px;z-index:10;
}
.back-link:hover{color:var(--pl-text);border-color:var(--pl-bdr2);background:rgba(var(--pl-ink,255,255,255),.04)}
.remember-row{display:flex;align-items:center;gap:.5rem;margin:.85rem 0 .35rem}
.remember-row input[type="checkbox"]{width:14px;height:14px;accent-color:var(--pl-lime);cursor:pointer;flex-shrink:0}
.remember-row label{font:500 11px/1.3 var(--fn-body);color:var(--pl-dim);cursor:pointer;letter-spacing:.01em}
.btn-full{
  width:100%;padding:13px;margin-top:.5rem;
  background:var(--pl-fill,#c7f546);color:var(--pl-on-fill,#0b0c0a);
  font:800 12px/1 var(--fn-disp);letter-spacing:.12em;text-transform:uppercase;
  border:none;border-radius:7px;cursor:pointer;
  box-shadow:0 0 22px rgba(var(--pl-lime-rgb,199,245,70),.22);
  transition:box-shadow .15s,transform .1s;
  display:block;text-align:center;text-decoration:none;box-sizing:border-box;
}
.btn-full:hover{box-shadow:0 0 36px rgba(var(--pl-lime-rgb,199,245,70),.36);transform:translateY(-1px)}
.btn-full:active{transform:scale(.98)}
.btn-full:disabled{opacity:.5;cursor:not-allowed;transform:none}
.form-err{margin-top:.7rem;color:var(--pl-red);font:500 11.5px/1.3 var(--fn-body);min-height:1rem}
.form-ok{
  margin-top:.8rem;padding:.7rem .8rem;border-radius:7px;
  background:rgba(var(--pl-lime-rgb,199,245,70),.06);border:1px solid rgba(var(--pl-lime-rgb,199,245,70),.22);
  color:var(--pl-text);font:500 12px/1.45 var(--fn-body);
}

/* Lien discret sous un bouton (« Mot de passe oublié ? », « ← Retour »). */
.link-btn{
  display:block;margin:.9rem auto 0;padding:.35rem .5rem;
  background:none;border:none;cursor:pointer;
  font:500 11.5px/1.3 var(--fn-body);color:var(--pl-dim);
  text-decoration:underline;text-underline-offset:3px;text-decoration-color:rgba(var(--pl-ink,255,255,255),.18);
}
.link-btn:hover{color:var(--pl-lime);text-decoration-color:currentColor}

/* Titre + texte d'un panneau sans onglet (oubli, reset, confirmation). */
.panel-title{font:800 1.05rem/1.25 var(--fn-disp);color:var(--pl-text);margin:0 0 .5rem;letter-spacing:.01em}
.panel-intro{font:400 12.5px/1.5 var(--fn-body);color:var(--pl-dim);margin:0 0 1.2rem}
.panel-intro b{color:var(--pl-text);font-weight:600;word-break:break-all}
.state-ico{font-size:1.9rem;line-height:1;margin-bottom:.7rem}