.auth-shell {
  display: grid;
  place-items: center;
  min-height: 100svh;
  max-width: none;
  padding: 24px 16px;
}

.auth-shell [hidden] { display: none; }
.auth-card {
  width: min(100%, 430px);
  padding: clamp(20px, 6vw, 32px);
  box-shadow: var(--shadow);
}
.auth-card-header { display: grid; gap: 8px; }
.auth-brand {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 12px;
  font-weight: 680;
}
.auth-card h1 {
  font-size: clamp(23px, 5vw, 28px);
  line-height: 1.25;
}
.auth-card-header p { color: var(--muted); line-height: 1.5; }
.auth-form { display: grid; gap: 14px; margin-top: 24px; }
.auth-form input {
  width: 100%;
  min-height: 44px;
  font-size: 16px;
  box-shadow: none;
}
.auth-form input[aria-invalid=true] { border-color: var(--danger); }
.auth-form .auth-field-error, .auth-error { color: var(--danger); }
.auth-field-error:empty, .auth-error:empty, .auth-status:empty { margin: 0; padding: 0; }
.auth-error:not(:empty), .auth-status:not(:empty) { margin-top: 12px; line-height: 1.5; }
.auth-status { color: var(--muted); }
.auth-card .btn { min-height: 44px; touch-action: manipulation; }
.auth-card .btn:active:not(:disabled) { background: var(--brand-soft); color: var(--brand-dark); }
.auth-card .btn.primary:active:not(:disabled) { background: var(--brand-dark); color: var(--paper); }
.auth-submit { margin-top: 4px; }
.auth-actions { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px; margin-top: 12px; }