/* Les pages servies avant toute authentification : connexion et erreurs.
 *
 * Feuille séparée et non style en ligne, parce que la politique de sécurité du
 * back-office dit `style-src 'self'` : une balise <style> dans la page serait
 * purement et simplement ignorée, et la page s'afficherait nue. C'est ce qui
 * s'est produit au premier essai.
 */
:root { color-scheme: dark; }

body {
  margin: 0; min-height: 100vh; display: grid; place-items: center;
  background: radial-gradient(90% 80% at 50% 30%, #1a1d44, #0b0d22);
  color: #faf7f2;
  font: 15px/1.55 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}

.c {
  width: min(27rem, 92vw); padding: 2.4rem;
  background: #1a1d44; border: 1px solid rgba(250, 247, 242, .12);
  border-radius: 12px; box-shadow: 0 24px 60px rgba(0, 0, 0, .45);
}
.c--large { width: min(38rem, 92vw); text-align: center; }

.mark { height: 30px; width: auto; fill: #faf7f2; display: block;
  margin: 0 0 1.2rem; }
.mark__dot { fill: #ffc940; }

h1 { font-size: 1.15rem; margin: 0 0 .3rem; letter-spacing: .02em; }
.s { color: #8b90bd; font-size: .78rem; letter-spacing: .07em;
  text-transform: uppercase; margin: 0 0 1.7rem; }
p { margin: 0 0 1.4rem; color: #c9c6d8; }

label { display: block; font-size: .82rem; color: #8b90bd; margin-bottom: .45rem; }
input {
  width: 100%; box-sizing: border-box; padding: .8rem .9rem; font: inherit;
  background: #12142f; color: #faf7f2; border-radius: 8px;
  border: 1px solid rgba(250, 247, 242, .18);
  /* Chiffres de largeur fixe : une phrase de passe en groupes se relit
     caractère par caractère quand on la vérifie. */
  font-variant-numeric: tabular-nums;
}
input:focus { outline: 2px solid #229bdd; outline-offset: 1px; border-color: #229bdd; }

button, .b {
  display: inline-block; width: 100%; box-sizing: border-box;
  margin-top: 1.1rem; padding: .85rem; font: inherit; font-weight: 700;
  letter-spacing: .06em; text-transform: uppercase; cursor: pointer;
  border: 0; border-radius: 8px; text-align: center; text-decoration: none;
  background: linear-gradient(135deg, #ffc940, #d4922a); color: #1a1d44;
}
.b { width: auto; padding: .85rem 1.8rem; }
button:hover, .b:hover { filter: brightness(1.06); }

.e {
  background: rgba(208, 59, 59, .16); border: 1px solid rgba(208, 59, 59, .5);
  color: #ffb4b4; padding: .6rem .8rem; border-radius: 8px;
  font-size: .86rem; margin: 0 0 1.1rem;
}
.n { margin: 1.5rem 0 0; font-size: .76rem; color: #6f74a0; line-height: 1.5; }
code { background: #0006; padding: .15rem .4rem; border-radius: .25rem;
  font-size: .85em; word-break: break-all; }