/* Page de garde - socle des pages du compte (spec docs/superpowers/specs/2026-09-24-refonte-auth-design.md).
   Porté de la maquette A (a.css). Les jetons --ard-* viennent de night_kitchen.css. */

/* ── Seul jeton propre à la direction : l'encre d'erreur ──
   Le registre --ard-* n'a pas de rouge. Une erreur doit se lire comme une
   erreur (pas en or, pas en vert) : rouge sourd, texte ≥ 4,5:1 sur les
   trois fonds. Sombre #f28b7d : 7,7:1 sur --ard-bg. Clair #a8321f : 5,9:1
   sur --ard-bg, 5,4:1 sur --ard-bg-2. */
[data-theme="dark"] body{ --ga-err:#f28b7d; }
[data-theme="light"] body{ --ga-err:#a8321f; }

html[data-theme="dark"]{ color-scheme:dark; }
html[data-theme="light"]{ color-scheme:light; }

/* ── Socle ─────────────────────────────────────────────────────────── */
*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; text-size-adjust:100%; }
body{
  margin:0;
  background:var(--ard-bg);
  color:var(--ard-ink);
  font-family:var(--ard-sans);
  font-size:16px;
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
  caret-color:var(--ard-accent);
  scrollbar-color:var(--ard-rule-strong) transparent;
  scrollbar-width:thin;
}
/* night_kitchen.css pose body, html { background: var(--bg-page) !important } :
   la page de garde vit sur l'ardoise / le papier, pas sur le fond du site. */
body.ga-page{ background:var(--ard-bg) !important; }
::selection{ background:var(--hn-gold-38); color:var(--ard-ink); }
p{ margin:0; }
button,input{ font:inherit; color:inherit; }
button{ -webkit-tap-highlight-color:transparent; }

:focus-visible{ outline:2px solid var(--ard-accent); outline-offset:3px; }

.ga-sprite{ position:absolute; width:0; height:0; overflow:hidden; }
.ga-sr{
  position:absolute !important; width:1px; height:1px; margin:-1px; padding:0;
  overflow:hidden; clip:rect(0 0 0 0); clip-path:inset(50%); white-space:nowrap; border:0;
}
.ga-ic{
  width:20px; height:20px; flex:none;
  fill:none; stroke:currentColor; stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round;
}

/* ── Logo ──────────────────────────────────────────────────────────── */
.ga-logo{
  display:inline-flex; align-items:center; gap:10px; min-height:44px;
  color:var(--ard-ink); text-decoration:none;
}
.ga-logo-ic{ width:30px; height:30px; color:var(--ard-accent-text); flex:none; }
.ga-logo-mot{
  font-family:var(--ard-serif); font-variation-settings:'SOFT' 34,'WONK' 1,'opsz' 72;
  font-weight:600; font-size:22px; letter-spacing:-.01em; line-height:1;
}
.ga-logo-top{ color:var(--ard-ink); }
.ga-logo-popote{ color:var(--ard-accent-text); }
.ga-logo .couvercle {
    transition: transform .3s cubic-bezier(.2,.8,.2,1);
}
.ga-logo:hover .couvercle,
.ga-logo:focus-visible .couvercle {
    transform: translateY(-5px);
}
@media (prefers-reduced-motion: reduce) {
    .ga-logo .couvercle { transition: none; }
}
.ga-logo-ic svg { width: 100%; height: 100%; display: block; color: var(--ard-accent-text); }

/* ── Étiquette or (la grammaire du monde) ──────────────────────────── */
.ga-kick{
  display:flex; align-items:center; gap:12px; margin:0 0 14px;
  font:600 12px/1.2 var(--ard-sans); letter-spacing:.18em; text-transform:uppercase;
  color:var(--ard-gold-text);
}
.ga-kick::before{ content:""; width:28px; height:1px; background:currentColor; flex:none; }

/* ── Mise en page : deux colonnes ──────────────────────────────────── */
.ga-shell{ min-height:100vh; min-height:100dvh; display:grid; grid-template-columns:minmax(0,1fr); }

.ga-cover{ background:var(--ard-bg-2); min-width:0; }
.ga-main{ display:flex; flex-direction:column; min-width:0; }

.ga-top{
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  padding:14px var(--ard-gut); border-bottom:1px solid var(--ard-rule);
}
.ga-body{ flex:1; display:flex; flex-direction:column; padding:28px var(--ard-gut) 48px; }
.ga-col{ width:100%; max-width:440px; margin:0 auto; }

/* Mobile d'abord : la couverture n'est qu'un bandeau photo. */
.ga-mast,.ga-une-legende,.ga-som{ display:none; }
.ga-une{ margin:0; }
.ga-une-img{ position:relative; height:76px; overflow:hidden; }
.ga-une-photo{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block; }
/* Bandeau bas (76 px) : on vise le cœur du plat, pas le bord de l'assiette. */
.ga-une-photo--saumon{ object-position:50% 50%; }
.ga-une-photo--agneau{ object-position:50% 60%; }

@media (min-width:960px){
  .ga-shell{ grid-template-columns:minmax(0,5fr) minmax(0,6fr); }

  .ga-cover{
    position:sticky; top:0; height:100vh; height:100dvh;
    display:flex; flex-direction:column; gap:24px;
    padding:20px clamp(24px,3vw,40px) 32px;
    border-right:1px solid var(--ard-rule);
  }
  .ga-mast{
    display:flex; align-items:center; justify-content:space-between; gap:16px;
    padding-bottom:14px; border-bottom:1px solid var(--ard-rule);
  }
  .ga-mast-note{
    font-size:12px; font-weight:600; letter-spacing:.16em; text-transform:uppercase;
    color:var(--ard-ink-3);
  }
  .ga-une{ flex:1 1 auto; min-height:0; display:flex; flex-direction:column; gap:18px; }
  .ga-une-img{ flex:1 1 auto; height:auto; min-height:140px; border-radius:2px; }
  .ga-une-legende{ display:block; flex:none; }
  /* Cadre plus large que haut : on remonte pour garder le bout des os et toute la viande. */
  .ga-une-photo--agneau{ object-position:50% 30%; }
  .ga-une-legende .ga-kick{ margin-bottom:10px; }
  .ga-une-titre{
    font-family:var(--ard-serif); font-variation-settings:'SOFT' 34,'WONK' 1;
    font-weight:600; font-size:26px; line-height:1.15; letter-spacing:-.01em;
    color:var(--ard-ink); text-wrap:balance;
  }
  .ga-une-ligne{ margin-top:6px; color:var(--ard-ink-2); font-size:15px; }

  .ga-som{ display:block; flex:none; padding-top:18px; border-top:1px solid var(--ard-rule-strong); }
  .ga-som .ga-kick{ margin-bottom:6px; }

  /* L'en-tête ne porte que le logo mobile : en bureau, la couverture a le sien. */
  .ga-top{ display:none; }
  .ga-body{ justify-content:center; padding:24px var(--ard-gut) 56px; }
  .ga-stepline{ display:none; }
}

/* ── Sommaire (bureau) ─────────────────────────────────────────────── */
.ga-som-liste{ list-style:none; margin:0; padding:0; counter-reset:none; }
.ga-som-row{
  display:flex; align-items:baseline; gap:10px; width:100%; min-height:44px;
  padding:10px 0; border:0; background:none; text-align:left;
  font-size:16px; color:color-mix(in srgb,var(--ard-ink) 80%,transparent); cursor:default;
}
.ga-som-nom{ flex:none; }
.ga-som-pts{
  flex:1 1 auto; min-width:16px; align-self:flex-end; margin-bottom:.4em;
  border-bottom:1px dotted currentColor; opacity:.6;
}
.ga-som-num{
  flex:none; min-width:1.2em; text-align:right;
  font-family:var(--ard-serif); font-variation-settings:'SOFT' 34,'WONK' 1;
  font-size:18px; font-variant-numeric:tabular-nums lining-nums;
}
/* Étape courante : encre pleine, graisse, numéro or. */
.ga-som-row[aria-current="step"]{ color:var(--ard-ink); }
.ga-som-row[aria-current="step"] .ga-som-nom{ font-weight:700; }
.ga-som-row[aria-current="step"] .ga-som-num{ color:var(--ard-gold-text); font-weight:600; }
/* Étapes faites : on peut y revenir. */
.ga-som-row.is-done{ cursor:pointer; }
.ga-som-row.is-done .ga-som-num{ color:var(--ard-accent-text); }
.ga-som-row.is-done:hover .ga-som-nom{
  color:var(--ard-ink); text-decoration:underline; text-underline-offset:4px; text-decoration-thickness:1px;
}
.ga-som-row:disabled{ opacity:1; }

/* Ligne d'étape (mobile) */
.ga-stepline{
  margin:-4px 0 18px; padding-bottom:12px; border-bottom:1px solid var(--ard-rule);
  font-size:14px; font-weight:600; color:var(--ard-ink-2);
  font-variant-numeric:tabular-nums;
}

/* ── Titres et chapeau ─────────────────────────────────────────────── */
.ga-h1{
  margin:0 0 12px;
  font-family:var(--ard-serif); font-variation-settings:'SOFT' 34,'WONK' 1;
  font-weight:600; font-size:clamp(2.25rem,1.5rem + 2.4vw,3.25rem);
  line-height:1.04; letter-spacing:-.02em; text-wrap:balance;
  color:var(--ard-ink);
}
.ga-h1:focus{ outline:none; }
.ga-h1:focus-visible{ outline:2px solid var(--ard-accent); outline-offset:4px; }
.ga-lead{ margin:0 0 28px; max-width:40ch; color:var(--ard-ink-2); font-size:17px; }

/* ── Boutons ───────────────────────────────────────────────────────── */
.ga-btn{
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  min-height:52px; padding:0 24px; border:1px solid transparent; border-radius:2px;
  font:700 13px/1 var(--ard-sans); letter-spacing:.14em; text-transform:uppercase;
  text-decoration:none; cursor:pointer;
  transition:background-color var(--ard-tr),color var(--ard-tr),border-color var(--ard-tr);
}
.ga-btn--full{ width:100%; }
.ga-btn--primary{ background:var(--ard-accent); color:var(--ard-on-accent); }
/* Vers l'encre : s'éclaircit sur l'ardoise, fonce sur le papier. Le texte gagne en contraste dans les deux cas. */
.ga-btn--primary:hover{ background:color-mix(in srgb,var(--ard-accent) 86%,var(--ard-ink)); }
.ga-btn--primary:active{ background:color-mix(in srgb,var(--ard-accent) 76%,var(--ard-ink)); }
.ga-btn--primary .ga-ic{ transition:transform var(--ard-tr); }
.ga-btn--primary:hover .ga-ic{ transform:translateX(3px); }
.ga-btn[disabled],.ga-btn[aria-disabled="true"]{ opacity:.5; cursor:not-allowed; }
.ga-btn--primary[disabled]:hover{ background:var(--ard-accent); }

.ga-btn--google{
  width:100%; gap:12px;
  background:transparent; color:var(--ard-ink); border-color:var(--ard-rule-strong);
  font-size:16px; font-weight:600; letter-spacing:0; text-transform:none;
}
.ga-btn--google:hover{ background:var(--ard-bg-2); border-color:var(--ard-ink-2); }
.ga-btn--google:active{ background:var(--ard-bg-3); }
.ga-google{ width:20px; height:20px; flex:none; }
.ga-google-note{
  display:flex; align-items:center; justify-content:center; gap:8px; margin-top:10px;
  font-size:14px; color:var(--ard-ink-3);
}
.ga-google-note .ga-ic{ width:16px; height:16px; }

.ga-btn--ghost{
  background:transparent; color:var(--ard-ink-2); padding:0 14px 0 8px;
  letter-spacing:.14em;
}
.ga-btn--ghost:hover{ color:var(--ard-ink); background:var(--ard-bg-2); }

/* base.css remonte les toasts de 68 px sous 768 px pour une barre basse que la page
   de garde n'a pas. Le bandeau cookies (bandeau_cookies.css) reste plus spécifique. */
.ga-page #toast-container{ bottom:calc(24px + env(safe-area-inset-bottom,0px)); }

/* ── Séparateur « ou » ─────────────────────────────────────────────── */
.ga-sep{
  display:flex; align-items:center; gap:14px; margin:26px 0 22px;
  font-size:14px; color:var(--ard-ink-3); text-align:center;
}
.ga-sep::before,.ga-sep::after{ content:""; flex:1 1 0; height:1px; background:var(--ard-rule); }

/* ── Champs ────────────────────────────────────────────────────────── */
.ga-field{ margin:0 0 22px; }
.ga-fieldset{ border:0; padding:0; min-width:0; }
.ga-label{
  display:block; margin:0 0 8px; padding:0;
  font-size:14px; font-weight:600; color:var(--ard-ink);
}
.ga-label--flat{ margin:0 0 4px; }
.ga-facultatif{ font-weight:500; color:var(--ard-ink-3); margin-left:6px; }

.ga-input{
  display:block; width:100%; height:50px; padding:0 14px;
  font:500 16px/1.2 var(--ard-sans); color:var(--ard-ink);
  background:var(--ard-bg-2);
  border:1px solid var(--ard-rule-strong); border-radius:2px;
  transition:border-color var(--ard-tr),background-color var(--ard-tr);
  -webkit-appearance:none; appearance:none;
}
.ga-input::placeholder{ color:var(--ard-ink-3); opacity:1; }
.ga-input:hover{ border-color:var(--ard-ink-2); }
.ga-input:focus{ outline:2px solid var(--ard-accent); outline-offset:2px; border-color:var(--ard-accent); background:var(--ard-bg-3); }
.ga-input[aria-invalid="true"]{ border-color:var(--ga-err); }
.ga-input[aria-invalid="true"]:focus{ outline-color:var(--ga-err); }
.ga-input:disabled{ opacity:.5; cursor:not-allowed; }
.ga-input:-webkit-autofill{
  -webkit-text-fill-color:var(--ard-ink);
  -webkit-box-shadow:0 0 0 100px var(--ard-bg-3) inset;
}

.ga-input-wrap{ position:relative; }
.ga-input--eye{ padding-right:52px; }
.ga-input--eye2{ padding-right:84px; }
.ga-eye{
  position:absolute; top:50%; right:3px; transform:translateY(-50%);
  width:44px; height:44px; display:grid; place-items:center;
  border:0; border-radius:2px; background:none; color:var(--ard-ink-2); cursor:pointer;
}
.ga-eye:hover{ color:var(--ard-ink); }
.ga-eye .ga-ic{ grid-area:1/1; }
.ga-eye .ga-eye-off{ display:none; }
.ga-eye[aria-pressed="true"] .ga-eye-on{ display:none; }
.ga-eye[aria-pressed="true"] .ga-eye-off{ display:block; }

.ga-match{
  position:absolute; top:50%; right:50px; transform:translateY(-50%);
  width:18px; height:18px; color:var(--ard-accent-text); stroke-width:2;
  opacity:0; transition:opacity var(--ard-tr);
}
.is-match .ga-match{ opacity:1; }

.ga-help{ margin-top:8px; font-size:14px; color:var(--ard-ink-3); }
.ga-help--flat{ margin-top:0; }
.ga-help--row{ display:flex; justify-content:space-between; gap:16px; }
/* L'aide des valideurs de Django arrive en <ul> : une ligne d'aide, pas une liste à puces. */
.ga-help ul{ margin:0; padding:0; list-style:none; }
.ga-count{ flex:none; font-variant-numeric:tabular-nums; }

.ga-err-msg{
  display:flex; gap:8px; align-items:flex-start; margin-top:8px;
  font-size:14px; font-weight:500; color:var(--ga-err);
}
.ga-err-msg[hidden]{ display:none; }
.ga-err-msg .ga-ic{ width:18px; height:18px; margin-top:1px; }

.ga-oubli{ display:flex; justify-content:flex-end; margin-top:4px; }
.ga-oubli .ga-link{ display:inline-flex; align-items:center; min-height:44px; font-size:14px; }

/* ── Liens ─────────────────────────────────────────────────────────── */
.ga-link{
  color:var(--ard-accent-text); font-weight:600;
  text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:4px;
  text-decoration-color:color-mix(in srgb,currentColor 40%,transparent);
  transition:text-decoration-color var(--ard-tr);
}
.ga-link:hover{ text-decoration-color:currentColor; }

/* ── Erreur de connexion : sur filet, pas d'encart ─────────────────── */
.ga-alert{
  display:flex; gap:12px; align-items:flex-start;
  margin:0 0 26px; padding:14px 0 16px;
  border-top:1px solid var(--ga-err); border-bottom:1px solid var(--ard-rule);
}
.ga-alert[hidden]{ display:none; }
.ga-alert-ic{ color:var(--ga-err); margin-top:2px; }
.ga-alert-titre{
  margin-bottom:4px; font-size:12px; font-weight:700; letter-spacing:.16em; text-transform:uppercase;
  color:var(--ga-err);
}
.ga-alert-txt{ color:var(--ard-ink); font-size:15px; }

/* ── Pied ──────────────────────────────────────────────────────────── */
.ga-foot{
  margin-top:32px; padding-top:18px; border-top:1px solid var(--ard-rule);
  font-size:15px; color:var(--ard-ink-2);
}
.ga-foot .ga-link,
.ga-deja .ga-link{ display:inline-flex; align-items:center; min-height:44px; }
.ga-status{ margin-top:12px; font-size:14px; color:var(--ard-ink-2); min-height:1px; }
.ga-status:empty{ margin:0; }

/* ── Le moment animé : l'entrée d'une étape (et de la page de connexion) ── */
.ga-step:not([hidden]),.ga-anim{ animation:aEntre .42s cubic-bezier(.16,1,.3,1) both; }
@keyframes aEntre{
  from{ opacity:0; transform:translateY(10px); }
  to{ opacity:1; transform:none; }
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{ animation:none !important; transition:none !important; }
  .ga-btn--primary:hover .ga-ic{ transform:none; }
}

/* ── Petits écrans ─────────────────────────────────────────────────── */
@media (max-width:959px){
  .ga-h1{ font-size:clamp(2rem,1.4rem + 3vw,2.5rem); }
  .ga-lead{ font-size:16px; margin-bottom:24px; }
}


/* ════════════════════════════════════════════════════════════════════
   Pages du parcours du compte (a-pages.html)
   Même page de garde que la connexion ; tout ce qui suit est scopé aux
   vues (.ga-vue) ou à des classes neuves : login et inscription ne bougent pas.
   ════════════════════════════════════════════════════════════════════ */

/* Texte posé sur le rouge d'erreur (bouton destructif) : le texte des boutons
   pleins. Sombre #04170d : 7,7:1 sur #f28b7d. Clair #ffffff : 6,7:1 sur #a8321f. */
body{ --ga-on-err:var(--ard-on-accent); }

.ga-kick--err{ color:var(--ga-err); }

/* Les libellés longs (« Essayer de me connecter », « Annuler et revenir à mon profil ») passent
   à la ligne au lieu de déborder à 390 px. */
.ga-vue .ga-btn{ line-height:1.3; text-align:center; padding-top:12px; padding-bottom:12px; }
.ga-vue .ga-foot .ga-link{ gap:8px; }
.ga-vue .ga-link .ga-ic{ width:16px; height:16px; }

.ga-btn--second{
  width:100%;
  background:transparent; color:var(--ard-ink); border-color:var(--ard-rule-strong);
  font-size:16px; font-weight:600; letter-spacing:0; text-transform:none;
}
.ga-btn--second:hover{ background:var(--ard-bg-2); border-color:var(--ard-ink-2); }
.ga-btn--second:active{ background:var(--ard-bg-3); }
.ga-btn--second .ga-ic{ width:16px; height:16px; }

/* Destructif : le rouge du monde, plein. Survol vers l'encre, comme le vert. */
.ga-btn--danger{ background:var(--ga-err); color:var(--ga-on-err); }
.ga-btn--danger:hover{ background:color-mix(in srgb,var(--ga-err) 86%,var(--ard-ink)); }
.ga-btn--danger:active{ background:color-mix(in srgb,var(--ga-err) 76%,var(--ard-ink)); }
.ga-btn--danger:focus-visible{ outline-color:var(--ga-err); }

.ga-actions{ display:grid; gap:10px; }
.ga-bloc{ margin-top:28px; }
.ga-em{ color:var(--ard-ink); font-weight:600; overflow-wrap:anywhere; }

/* ── Note sur filet (spams, renvoi) : même grammaire que l'alerte, en or ── */
.ga-note{
  display:flex; gap:12px; align-items:flex-start;
  margin-top:28px; padding-top:16px; border-top:1px solid var(--ard-rule-strong);
}
.ga-note > div{ min-width:0; }
.ga-note-ic{ color:var(--ard-gold-text); margin-top:1px; }
.ga-note-titre{
  margin-bottom:4px; font-size:12px; font-weight:700; letter-spacing:.16em; text-transform:uppercase;
  color:var(--ard-gold-text);
}
.ga-note-txt{ font-size:15px; color:var(--ard-ink-2); }
.ga-note-txt strong{ font-weight:600; color:var(--ard-ink); }
.ga-note .ga-act{ margin-top:2px; }
/* Posée à la place de l'alerte (connexion d'un compte non activé) : même place, mêmes filets. */
.ga-note--filet{ margin:0 0 26px; padding:14px 0 16px; border-bottom:1px solid var(--ard-rule); }

/* ── Action texte (lignes de liste, renvoi) ── */
.ga-act{
  display:inline-flex; align-items:center; gap:8px; min-height:44px; padding:0;
  border:0; background:none; cursor:pointer;
  font-size:14px; font-weight:600; color:var(--ard-accent-text); text-align:left;
  text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:4px;
  text-decoration-color:color-mix(in srgb,currentColor 40%,transparent);
  transition:text-decoration-color var(--ard-tr),color var(--ard-tr);
}
.ga-act:hover{ text-decoration-color:currentColor; }
.ga-act--err{ color:var(--ga-err); }
.ga-act--err:focus-visible{ outline-color:var(--ga-err); }
.ga-act:disabled{ color:var(--ard-ink-3); text-decoration:none; cursor:not-allowed; }

/* ── Listes : lignes entre filets, angles vifs ── */
.ga-liste{ list-style:none; margin:0; padding:0; border-top:1px solid var(--ard-rule-strong); }
.ga-ligne{
  display:flex; flex-wrap:wrap; align-items:center; gap:4px 14px;
  padding:14px 0; border-bottom:1px solid var(--ard-rule);
}
.ga-ligne-logo{ width:22px; height:22px; flex:none; }
.ga-ligne-main{ flex:1 1 180px; min-width:0; }
.ga-ligne-titre{ font-weight:600; color:var(--ard-ink); overflow-wrap:anywhere; }
.ga-ligne-sous{ font-size:14px; color:var(--ard-ink-2); overflow-wrap:anywhere; }
.ga-ligne-acts{ display:flex; flex-wrap:wrap; column-gap:22px; }
/* Adresse email : l'adresse sur toute la ligne, ses actions dessous. */
.ga-ligne--email{ padding:16px 0 6px; }
.ga-ligne--email .ga-ligne-main{ flex-basis:100%; }

.ga-etats{ display:flex; flex-wrap:wrap; gap:4px 18px; margin-top:6px; }
.ga-etat{
  display:inline-flex; align-items:center; gap:6px;
  font-size:12px; font-weight:700; letter-spacing:.12em; text-transform:uppercase;
  color:var(--ard-ink-2);
}
.ga-etat .ga-ic{ width:14px; height:14px; stroke-width:2; }
.ga-etat--principale{ color:var(--ard-gold-text); }
.ga-etat--verifiee{ color:var(--ard-accent-text); }

.ga-vide{ padding:16px 0 18px; border-top:1px solid var(--ard-rule-strong); border-bottom:1px solid var(--ard-rule); }
.ga-vide-titre{ font-weight:600; color:var(--ard-ink); }
.ga-vide-txt{ margin-top:4px; font-size:15px; color:var(--ard-ink-2); }

.ga-ajout{ display:flex; gap:8px; }
.ga-ajout .ga-input{ flex:1 1 auto; min-width:0; }
.ga-ajout .ga-btn{ flex:none; min-height:50px; padding:0 18px; }

/* ── Messageries : trois accès égaux ── */
.ga-mails{
  list-style:none; margin:0; padding:0;
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px;
}
.ga-mails .ga-btn{ padding:0 8px; gap:6px; font-size:15px; }

/* ── La suite de l'activation : un sommaire, pas une frise ── */
.ga-suite{ padding-top:14px; border-top:1px solid var(--ard-rule-strong); }
.ga-suite .ga-kick{ margin-bottom:2px; }
.ga-suite .ga-som-row{ cursor:default; }
.ga-suite .ga-som-row.is-done:hover .ga-som-nom{ text-decoration:none; color:inherit; }

/* Sans chapeau, l'alerte suit le titre : on lui rend l'air d'un chapeau. */
.ga-vue .ga-h1 + .ga-alert{ margin-top:24px; }
/* Mobile : une vue courte ne doit pas étirer le bandeau photo. Le surplus de
   hauteur va à la colonne du formulaire (sans effet sur connexion et
   inscription, plus hautes que l'écran). */
@media (max-width:959px){
  .ga-shell{ grid-template-rows:auto 1fr; }
}