/* ============================================================================
   RARA · auth.css - the centered auth card used by login, register, verify,
   password reset/change, lockout - and reused by orders/payment.html (same card).
   Slice-4 doctrine: single burgundy accent, 440px centered, AA contrast; generic
   .field* form controls live in base.css.
   ============================================================================ */

.auth{max-width:440px;margin:0 auto;padding:48px 0 72px}
.auth-brand{display:block;text-align:center;font-family:var(--serif);font-weight:600;
  font-size:26px;letter-spacing:.22em;padding-left:.22em;color:var(--burgundy);margin-bottom:22px}
.auth-card{background:var(--surface);border:1px solid var(--line);border-top:2px solid var(--burgundy);padding:36px 32px}
.auth-title{font-size:28px;margin-bottom:6px}
.auth-sub{color:var(--muted);font-size:14px;margin-bottom:22px}
.auth-email{font-size:14px;color:var(--ink);background:var(--cream-2);padding:10px 12px;text-align:center;margin-bottom:16px;word-break:break-all}
.auth-alt{text-align:center;font-size:13px;color:var(--muted);margin-top:16px}
.auth-alt a{color:var(--burgundy);text-decoration:underline}
.auth-alt a:hover{color:var(--burgundy-deep)}

@media(max-width:600px){.auth-card{padding:28px 22px}}