:root {
  color-scheme: light;
  font-family: Inter, system-ui, sans-serif;
  color: #172026;
  background: #f4f6f5;
}
* { box-sizing: border-box; }
body { margin: 0; min-height: 100vh; background: radial-gradient(circle at top, #e9f3f2, #f7f7f4 52%); }
.auth-page { min-height: 100vh; display: grid; place-items: center; padding: 24px; }
.auth-panel { width: min(100%, 520px); padding: 40px; border: 1px solid #dce4e1; border-radius: 24px; background: rgba(255,255,255,.96); box-shadow: 0 24px 70px rgba(25,48,45,.12); }
.hero-logo-link img { width: 180px; max-width: 70%; height: auto; }
.eyebrow { margin: 28px 0 8px; color: #26746c; font-size: .75rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
h1 { margin: 0 0 14px; font-size: clamp(2rem, 7vw, 3rem); line-height: 1.04; }
p { color: #52615e; line-height: 1.65; }
.auth-form { margin: 28px 0 14px; }
.primary-button { display: block; width: 100%; padding: 14px 18px; border-radius: 12px; background: #185f58; color: white; text-align: center; font-weight: 800; text-decoration: none; }
.settings-status { margin: 14px 0; padding: 14px; border-radius: 12px; background: #edf4f2; color: #304b47; line-height: 1.5; }
.auth-links { display: flex; flex-wrap: wrap; gap: 16px; margin-top: 24px; }
.auth-links a { color: #185f58; font-weight: 700; }
@media (max-width: 520px) { .auth-page { padding: 12px; } .auth-panel { padding: 28px 22px; border-radius: 18px; } }