/* LA PORTE (lot UX-1 « acces », 29/09/2026) — sur le socle du guide (guide.css : la colonne, le champ, le bouton plein largeur en
   bas). Ici seulement ce que la porte a en plus : la flèche de retour, le champ du code, la liste des sites, l'écran du geste. */
/* Ce qui porte « hidden » ne s'affiche pas, quoi qu'en dise une règle d'affichage plus bas (le geste, l'e-mail, « Renvoyer ») :
   la première passe montrait le lien de renvoi dès l'arrivée, display:grid l'emportant sur l'attribut. */
.acces [hidden]{display:none!important}
.acces [data-acces-email],.acces [data-cle-entrer-bloc]{display:flex;flex-direction:column;flex:1}
/* Le geste d'abord, seulement quand ce navigateur a activé une clé : la marque est lue AVANT le premier rendu (script de tête),
   pour ne pas voir l'e-mail puis le geste. cles.js retire la marque si le geste n'est pas possible. */
html[data-cle] .acces [data-acces-email]{display:none}
/* La flèche ← (.acces-retour) vit dans guide.css depuis le lot UX-3 (29/09) : la même que celle du guide, écrite une fois. */
.acces-adresse{display:block;margin-top:8px;font:500 17px/1.3 var(--g-police);color:var(--g-doux);letter-spacing:0;overflow-wrap:anywhere}
/* Six points en attente (le placeholder), la même graisse et le même espacement que les chiffres : on voit combien, et où taper. */
.acces-code{width:100%;min-height:66px;padding:12px 18px 12px calc(18px + .34em);border:1.5px solid var(--g-ligne2);border-radius:16px;background:var(--g-fond);color:inherit;font:600 30px/1 var(--g-titre);letter-spacing:.34em;text-align:center;font-variant-numeric:tabular-nums}
.acces-code::placeholder{color:var(--g-ligne2);letter-spacing:.34em;font-weight:600}
/* PAS DE CURSEUR dans le champ des six points (lot UX-2, 29/09 — le dirigeant : « il y a un curseur, ça me dérange, retire-le ») :
   le champ garde le focus et le clavier numérique ; les six points sont le repère, le trait clignotant n'en est pas un. */
.acces-code{caret-color:transparent}
/* « Valider » en texte : le code part seul au sixième chiffre ; le lien reste pour qui n'a pas de script (correctif UX-1, P3). */
.acces-gestes-code{margin-top:0;padding-top:8px}
.acces-code:focus{outline:0;border-color:var(--g-encre);box-shadow:0 0 0 4px #D23C2522}
.acces-code[aria-invalid=true]{border-color:var(--g-accent)}
.acces-renvoi{display:grid;justify-items:center;margin-top:2px}
.acces-sites{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.acces-sites a{display:flex;flex-direction:column;justify-content:center;gap:2px;min-height:66px;padding:12px 18px;border:1.5px solid var(--g-ligne2);border-radius:16px;color:inherit;text-decoration:none}
.acces-sites a b{font-size:17px;font-weight:600}
.acces-sites a span{color:var(--g-doux);font-size:14px}
.acces-sites a:hover{border-color:var(--g-encre)}
/* l'état d'une ligne (lot UX-2) : « Gardé », ou « Brouillon · s'efface le … » */
.acces-sites a .acces-site-etat{font-size:13px;color:var(--g-doux)}
.acces-sites a[data-etat=garde] .acces-site-etat{color:var(--g-encre);font-weight:600}
.acces .guide-erreur+.acces-sites{margin-top:14px}
/* Retour immédiat au geste : le bouton qui vient d'être pressé se grise le temps de la réponse (acces.js). */
.guide-suivant[disabled]{opacity:.55;cursor:default}
