.auth-page { min-height: 100svh; padding: 36px 24px 24px; display: flex; flex-direction: column; align-items: center; background: radial-gradient(ellipse at 50% 0%, #e8f2ff 0%, var(--soft) 65%); }
.auth-brand { width: min(100%, 1120px); display: flex; align-items: center; gap: 20px; }
.auth-brand img { width: 190px; height: auto; }
.auth-brand span { border-left: 1px solid var(--edge); padding-left: 20px; font-size: 10px; font-weight: 700; letter-spacing: .16em; color: var(--muted); }
.auth-card { width: min(100%, 460px); margin: auto 0; padding: 40px; background: white; border: 1px solid var(--line); border-radius: 24px; box-shadow: 0 5px 0 #dce5ef, 0 24px 70px #08223608; }
.auth-symbol { width: 52px; height: 52px; display: grid; place-items: center; background: var(--blue-wash); border-radius: 16px; color: var(--blue); margin-bottom: 26px; }
.auth-symbol svg { width: 28px; height: 28px; }
.auth-eyebrow { color: var(--blue); letter-spacing: .12em; font-size: 10px; font-weight: 700; margin: 0 0 10px; }
.auth-card h1 { margin: 0; font-size: 34px; line-height: 1.15; letter-spacing: -.04em; }
.auth-intro { color: var(--muted); margin: 14px 0 28px; line-height: 1.65; }
.auth-card label { display: block; margin: 18px 0 8px; font-size: 13px; font-weight: 600; }
.auth-card input { display: block; width: 100%; height: 50px; padding: 12px 14px; border: 1.5px solid var(--edge); border-radius: 11px; background: white; color: var(--ink); font: inherit; }
.auth-card input:focus { border-color: var(--blue); outline: 3px solid var(--blue-wash); }
.password-wrap { position: relative; }
.password-wrap input { padding-right: 64px; }
.password-wrap button { position: absolute; top: 0; right: 4px; height: 50px; padding: 0 12px; border: 0; background: transparent; font: 600 12px Archivo, sans-serif; color: var(--blue); cursor: pointer; }
.auth-submit { width: 100%; justify-content: space-between; margin-top: 26px; min-height: 50px; }
.auth-hint, .auth-note { font-size: 12px; line-height: 1.6; color: var(--muted); }
.auth-note { text-align: center; margin: 26px 0 0; padding-top: 22px; border-top: 1px solid var(--line); }
.auth-error { font-size: 13px; padding: 12px; border-radius: 10px; background: var(--red-wash); color: var(--red-text); margin: 18px 0 0; }
.auth-footer { color: var(--muted); font-size: 11px; margin-top: 34px; padding-top: 24px; }
.auth-footer span { padding: 0 10px; }
@media (max-width: 540px) { .auth-page { padding: 24px 18px; gap: 34px; } .auth-brand img { width: 160px; } .auth-card { padding: 28px 24px; } .auth-card h1 { font-size: 30px; } }
@media (max-height: 800px) { .auth-card { margin-top: 36px; } }