/* Pages autonomes : connexion, installation, hors ligne.

   login.css et pwa.css étaient le MÊME fichier sous deux noms — .login/.offline
   et .login__card/.offline__card avaient des déclarations identiques, à
   l'alignement centré près. Ils n'en font plus qu'un. */

.carte-seule {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: var(--s-4);
}

.carte-seule__panneau {
  width: min(100%, 380px);
  display: flex;
  flex-direction: column;
  gap: var(--s-3);
  padding: var(--s-5);
}

/* La page hors ligne s'adresse à quelqu'un qui n'a rien demandé : elle se
   présente centrée, autour de son logo. */
.carte-seule--centree .carte-seule__panneau {
  align-items: center;
  text-align: center;
}

.carte-seule__sous-titre {
  color: var(--text-2);
  font-size: var(--t-m);
  margin-top: calc(var(--s-1) * -1);
}

.carte-seule__texte {
  color: var(--text-2);
  font-size: var(--t-base);
  line-height: var(--lh-normal);
}

.carte-seule__logo {
  width: 72px;
  height: 72px;
  border-radius: var(--r-m);
}

.carte-seule__form {
  display: flex;
  flex-direction: column;
  gap: var(--s-2);
  margin-top: var(--s-2);
}

.carte-seule__form .btn,
.carte-seule__panneau .btn {
  margin-top: var(--s-3);
}