:root {
  --hr-night: #160b18;
  --hr-wine: #4c172b;
  --hr-gold: #f2c875;
  --hr-cream: #fff9ee;
  --hr-soft: #eadde1;
  --hr-error: #ffd4d4;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  min-height: 100vh;
  color: var(--hr-cream);
  background:
    radial-gradient(circle at 82% 12%, rgba(96, 36, 62, .62), transparent 31%),
    radial-gradient(circle at 12% 88%, rgba(89, 43, 72, .35), transparent 34%),
    var(--hr-night);
  font-family: Arial, Helvetica, sans-serif;
}

.auth-shell { width: min(100% - 36px, 760px); margin: 0 auto; padding: 34px 0 72px; }
.auth-brand { display: inline-block; margin-bottom: 46px; color: var(--hr-cream); font: 400 1.25rem Georgia, serif; text-decoration: none; }
.auth-brand span { color: var(--hr-gold); }
.auth-card { padding: clamp(26px, 6vw, 54px); border: 1px solid rgba(242, 200, 117, .28); border-radius: 26px; background: rgba(36, 16, 29, .92); box-shadow: 0 24px 80px rgba(0, 0, 0, .34); }
.auth-kicker { margin: 0 0 12px; color: var(--hr-gold); font-size: .78rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
h1 { margin: 0 0 14px; font: 400 clamp(2.15rem, 8vw, 3.6rem)/1.05 Georgia, 'Times New Roman', serif; }
.auth-lead { margin: 0 0 30px; color: var(--hr-soft); font-size: 1.05rem; line-height: 1.65; }
.auth-field { margin: 0 0 19px; }
.auth-field label, .auth-legend { display: block; margin-bottom: 8px; color: var(--hr-cream); font-weight: 700; }
.auth-field input[type='email'] { width: 100%; min-height: 52px; padding: 12px 15px; border: 1px solid rgba(242, 200, 117, .35); border-radius: 12px; color: var(--hr-cream); background: rgba(255, 255, 255, .055); font: inherit; }
.auth-field input:focus { outline: 3px solid rgba(242, 200, 117, .25); border-color: var(--hr-gold); }
.auth-help { margin: 7px 0 0; color: #cfbec5; font-size: .88rem; line-height: 1.45; }
.auth-check { display: grid; grid-template-columns: auto 1fr; gap: 10px; align-items: start; margin: 24px 0; color: var(--hr-soft); line-height: 1.5; }
.auth-check input { margin-top: 4px; accent-color: var(--hr-gold); }
.auth-check a, .auth-switch a { color: var(--hr-gold); }
.auth-button { width: 100%; min-height: 54px; border: 1px solid var(--hr-gold); border-radius: 999px; color: #291420; background: var(--hr-gold); font: 700 1rem Arial, sans-serif; cursor: pointer; }
.auth-button-link { display: inline-flex; align-items: center; justify-content: center; padding: 0 18px; text-decoration: none; }
.auth-button:hover { background: #ffe0a0; }
.auth-alert { margin: 0 0 24px; padding: 14px 16px; border: 1px solid rgba(255, 160, 160, .4); border-radius: 12px; color: var(--hr-error); background: rgba(130, 30, 45, .2); line-height: 1.5; }
.auth-notice { margin: 0 0 24px; padding: 14px 16px; border: 1px solid rgba(242, 200, 117, .42); border-radius: 12px; color: var(--hr-cream); background: rgba(242, 200, 117, .08); line-height: 1.5; }
.auth-notice p { margin: 0; }
.auth-notice .auth-help { margin-top: 8px; }
.auth-switch { margin: 24px 0 0; color: var(--hr-soft); text-align: center; }

@media (max-width: 600px) {
  .auth-shell { width: min(100% - 24px, 760px); padding-top: 22px; }
  .auth-brand { margin-bottom: 28px; }
}
