.auth-screen {
  display: grid;
  place-items: center;
  min-height: 100dvh;
  padding: 36px 20px;
  background: #f7f8fc;
}

.auth-card {
  width: min(100%, 460px);
  padding: 32px;
  border: 1px solid #e4e5ef;
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 16px 48px rgba(34, 43, 76, .08);
}

.auth-brand { display: flex; align-items: center; gap: 10px; margin-bottom: 30px; }
.auth-brand > strong { font-size: 23px; letter-spacing: -.5px; }
.auth-brand .brand-mark { width: 40px; height: 40px; font-size: 23px; }
.auth-card .eyebrow { margin: 0 0 6px; }
.auth-card h1 { margin: 0 0 12px; font-size: 29px; line-height: 1.15; letter-spacing: -.7px; }
.auth-intro { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.6; }
.auth-loading { margin: 17px 0 0; color: #5945be; font-size: 13px; }
.auth-card form { margin-top: 24px; }
.auth-card form > label + label { margin-top: 18px; }
.auth-card label { font-size: 14px; }
.auth-card input { min-height: 48px; font-size: 16px; }
.auth-card .primary-button { min-height: 48px; margin-top: 18px; font-size: 15px; }
.auth-error { display: block; margin: 14px 0 0; color: #a22e29; font-size: 14px; line-height: 1.5; }
.auth-error:empty { display: none; }
.auth-help { margin: 23px 0 0; padding-top: 20px; border-top: 1px solid var(--line); color: var(--muted); font-size: 13px; line-height: 1.6; }
.account-actions { display: flex; flex-direction: column; gap: 3px; margin-top: 7px; }
.account-action { min-height: 44px; padding: 8px 10px; border: 0; border-radius: 8px; color: #59647e; background: transparent; text-align: left; font-size: 13px; font-weight: 650; }
.account-action:hover { color: var(--violet); background: var(--violet-soft); }
.seller-card .role-pill { color: #5945be; font-size: 12px; }

@media (max-width: 500px) {
  .auth-screen { padding: 20px 15px; }
  .auth-card { padding: 26px 22px; }
  .auth-card h1 { font-size: 27px; }
}