/* Strony konta (logowanie, rejestracja, hasło, oczekiwanie) w wyglądzie Prototypu A — ładowane PO stylach
   strony, więc nadpisują wspólne klasy auth-*. Logika stron (PasswordLogin, ExternalLoginFlow) jest nietknięta. */
body { background: var(--ds-bg); font-size: 14.5px; line-height: 1.45; }
.auth-card {
  border-radius: 12px; border-color: var(--ds-line); padding: 36px;
  box-shadow: 0 1px 2px rgba(0,0,0,.04), 0 12px 32px rgba(0,0,0,.06);
}
.auth-title { font-size: 21px; font-weight: 600; letter-spacing: -.01em; }
.auth-sub { font-size: 14px; color: var(--ds-muted); }
.auth-field label { font-size: 13px; font-weight: 500; color: var(--ds-ink2); }
.auth-field input, .auth-field select {
  min-height: 36px; padding: 0 10px; font-size: 14.5px; border: 1px solid var(--ds-control-line);
  border-radius: 6px; background: var(--ds-surface); color: var(--ds-ink);
}
.auth-field input:focus, .auth-field select:focus { border-color: var(--ds-todo); box-shadow: 0 0 0 3px #dbeafe; outline: none; }
.auth-btn-primary {
  min-height: 40px; background: var(--ds-ink); border-radius: 6px; font-size: 14.5px; font-weight: 500;
}
.auth-btn-primary:hover { opacity: 1; background: #262626; }
.auth-btn-google {
  min-height: 40px; border: 1px solid var(--ds-control-line); border-radius: 6px; font-size: 14.5px;
}
.auth-btn-google:hover { background: var(--ds-hover); }
.auth-error {
  background: var(--ds-late-bg); border: 1px solid var(--ds-late); color: var(--ds-late);
  border-radius: 8px; font-size: 13.5px;
}
.auth-footer a { color: var(--ds-todo); }
@media (max-width: 480px) {
  body { align-items: flex-start; padding: 24px 16px; }
  .auth-card { padding: 24px 18px; box-shadow: none; }
}