/* Sombre, toujours : on se filme souvent le soir, et un écran blanc éclaire le visage. */
:root {
  --fond: #0b0b0d;
  --carte: #17171b;
  --trait: #2a2a31;
  --texte: #f4f4f5;
  --gris: #9a9aa4;
  --rouge: #e5484d;
  color-scheme: dark;
}
* { box-sizing: border-box; }
body {
  margin: 0;
  background: var(--fond);
  color: var(--texte);
  font: 17px/1.5 -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;
  min-height: 100dvh;
  -webkit-font-smoothing: antialiased;
}
.centre {
  min-height: 100dvh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 24px;
  padding: 24px;
}
h1 { font-size: 22px; font-weight: 600; margin: 0; }
p { color: var(--gris); margin: 0; text-align: center; }
input[type=password] {
  width: 100%;
  max-width: 320px;
  padding: 14px 16px;
  font-size: 17px;
  border-radius: 12px;
  border: 1px solid var(--trait);
  background: var(--carte);
  color: var(--texte);
}
button, .bouton {
  font: inherit;
  border: 0;
  border-radius: 999px;
  padding: 14px 22px;
  background: var(--carte);
  color: var(--texte);
  border: 1px solid var(--trait);
  cursor: pointer;
  min-height: 48px;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.principal { background: var(--texte); color: #000; border-color: transparent; font-weight: 600; }
.refus { color: var(--rouge); }

/*
  Un lien reste un lien, même écrit dans un bouton : sans ça, le changement de caméra prenait
  la rondeur et le fond d'un bouton principal, et se disputait l'oeil avec le déclencheur.
  Une seule chose commande sur cet écran.
*/
button.lien {
  background: none;
  border: 0;
  padding: 8px 4px;
  min-height: 44px;
  font-size: 15px;
  opacity: .85;
}