.auth-page { min-height: 100vh; display: flex; flex-direction: column; }
.auth-main { flex: 1; display: grid; place-items: center; padding: 48px 24px; background: radial-gradient(ellipse at 15% 40%, #292044 0, transparent 55%); }
.auth-layout { width: 100%; max-width: 1000px; display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 80px; }
.auth-intro .auth-eyebrow { color: var(--accent); font-size: 12px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; margin-bottom: 20px; }
.auth-intro h1 { font-size: clamp(36px, 5vw, 58px); line-height: 1.1; letter-spacing: -.045em; margin-bottom: 24px; }
.auth-intro h1 span { color: var(--accent); }
.auth-intro p { color: #aeb4c3; max-width: 340px; }
.auth-back { display: inline-block; margin-top: 32px; }
.auth-page a:not(.header-logo):not(.nav-link) { color: var(--accent); text-underline-offset: 4px; }
.auth-card { padding: 32px; background: #171120; border: 1px solid #342a42; border-radius: 16px; box-shadow: 0 24px 80px #0003; }
.auth-card h2 { font-size: 25px; letter-spacing: -.025em; margin-bottom: 6px; }
.auth-subtitle { color: #aeb4c3; font-size: 14px; margin-bottom: 24px; }
.auth-field { margin-bottom: 18px; }
.auth-field label { display: block; font-size: 14px; font-weight: 500; margin-bottom: 7px; }
.auth-field input { width: 100%; min-width: 0; padding: 12px 14px; border: 1px solid #4a4058; border-radius: 7px; background: #100b18; color: var(--text); font: inherit; font-size: 16px; }
.auth-field input::placeholder { color: #948c9e; }
.auth-password { position: relative; }
.auth-password input { padding-right: 72px; }
.auth-toggle { position: absolute; right: 5px; top: 5px; bottom: 5px; background: transparent; border: 0; color: var(--accent); padding: 0 10px; font: inherit; font-size: 13px; cursor: pointer; }
.auth-hint { display: block; margin-top: 6px; font-size: 12px; color: #aeb4c3; }
.auth-submit { width: 100%; padding: 13px; border: 0; border-radius: 7px; background: var(--accent); color: #0f0916; font: inherit; font-weight: 700; cursor: pointer; }
.auth-submit:hover { background: var(--accent-hover); }
.auth-switch { text-align: center; font-size: 14px; margin-top: 22px; }
.auth-preview { margin-top: 22px; padding-top: 18px; border-top: 1px solid #342a42; font-size: 12px; color: #aeb4c3; }
.auth-status:not(:empty) { margin-top: 16px; padding: 12px; background: #23233b; border-radius: 7px; font-size: 14px; }
.auth-page :focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
.auth-footer { text-align: center; color: #aeb4c3; font-size: 12px; padding: 24px; }
.auth-page .header { position: static; }
@media (max-width: 760px) { .auth-layout { grid-template-columns: 1fr; gap: 28px; max-width: 460px; } .auth-main { padding: 28px 20px; } .auth-intro h1 { font-size: 36px; } .auth-intro p { max-width: none; } .auth-back { margin-top: 16px; } .auth-card { padding: 24px; } }