/* Page de connexion : mêmes jetons que le lecteur (style.css), papier posé sur le fond chaud. */
.login-body { min-height:100vh; min-height:100dvh; padding:max(10vh,24px) 16px 48px; background:var(--ground); }
main.login { width:min(23rem,100%); margin:0 auto; padding:28px 24px 24px; background:var(--paper); border:1px solid var(--rule); border-radius:12px; }
.login-brand { display:flex; flex-wrap:wrap; align-items:baseline; gap:4px 10px; margin:0 0 28px; color:var(--ink); font:400 1.35rem/1.1 var(--serif); letter-spacing:-.01em; }
.login-brand span { color:var(--muted); font:400 .85rem/1.3 var(--ui-font); letter-spacing:0; }
.login h1 { margin:0 0 18px; font:400 1.6rem/1.2 var(--serif); letter-spacing:-.02em; }
.login-form { display:flex; flex-direction:column; }
.login-form label { margin:0 0 6px; }
.login input:not(.sr) { min-height:44px; font-size:1rem; }
.password-field { position:relative; }
.password-field input:not(.sr) { padding-right:92px; }
.password-field .reveal { position:absolute; top:4px; right:4px; bottom:4px; min-height:0; padding:0 10px; border:0; border-radius:6px; color:var(--accent); font-size:.85rem; font-weight:600; }
.login .error { margin:10px 0 0; line-height:1.4; }
.login-submit { margin-top:16px; min-height:44px; font-weight:600; }
.login-names { display:flex; flex-direction:column; gap:8px; }
.login-names button { min-height:44px; padding:0 14px; font-weight:500; text-align:left; }
.login-names button:hover { border-color:var(--accent); background:var(--accent-light); }
.login-hint { margin:14px 0 0; color:var(--muted); font-size:.85rem; line-height:1.45; }
.login :focus-visible { outline:3px solid var(--focus); outline-offset:3px; }
.login input:focus-visible { outline-offset:1px; border-color:var(--focus); }
@media (max-width:420px) {
  .login-body { padding-top:24px; }
  main.login { padding:22px 18px 20px; }
}