/* Shared premium authentication experience. Existing auth form selectors remain untouched. */
.auth-body { min-height: 100vh; background: #f5f7fb; }
.auth-shell { min-height: 100vh; grid-template-columns: minmax(0, 1.15fr) minmax(420px, 560px); }
.auth-visual { justify-content: center; padding: clamp(30px, 7vw, 92px); background: #101a30; }
.auth-visual::before { content: ""; position: absolute; inset: 0; background: radial-gradient(circle at 82% 15%, rgba(87,142,255,.28), transparent 28%), radial-gradient(circle at 12% 88%, rgba(70,197,151,.16), transparent 32%), linear-gradient(135deg, transparent 54%, rgba(255,255,255,.035) 54%, transparent 55%); pointer-events: none; }
.auth-visual::after { inset: 26px; border-color: rgba(255,255,255,.12); border-radius: 22px; }
.auth-visual__content { position: relative; z-index: 1; width: min(100%, 670px); margin: 0 auto; }
.auth-visual__glow { position: absolute; right: 15%; bottom: 13%; width: 190px; height: 190px; border-radius: 50%; background: rgba(105,220,177,.13); filter: blur(46px); pointer-events: none; }
.auth-brand { display: inline-flex; align-items: center; gap: 11px; color: #fff; font-size: .85rem; font-weight: 800; letter-spacing: .04em; text-decoration: none; }.auth-brand img { width: 36px; height: 36px; }.auth-brand b,.auth-mobile-brand b { color: #82b7ff; font-weight: 800; }
.auth-visual__copy { margin-top: clamp(54px, 10vh, 100px); }.auth-eyebrow,.auth-form-kicker { color: #79b5ff; font-size: .7rem; font-weight: 850; letter-spacing: .14em; text-transform: uppercase; }.auth-visual h1 { max-width: 690px; margin: 17px 0 0; font-size: clamp(2.7rem, 6vw, 6rem); line-height: .93; letter-spacing: -.05em; }.auth-visual h1 em { color: #a8c9ff; font-style: normal; }.auth-visual__copy p { max-width: 560px; margin-top: 24px; color: rgba(255,255,255,.68); font-size: 1.05rem; line-height: 1.7; }
.auth-product-card { max-width: 480px; margin-top: clamp(38px, 7vh, 70px); padding: 16px; border: 1px solid rgba(255,255,255,.14); border-radius: 16px; background: rgba(9,17,34,.42); box-shadow: 0 20px 65px rgba(0,0,0,.2); backdrop-filter: blur(12px); }.auth-product-card__head,.auth-product-row,.auth-product-row > span { display: flex; align-items: center; }.auth-product-card__head,.auth-product-row { justify-content: space-between; gap: 12px; }.auth-product-card__head { color: rgba(255,255,255,.55); font-size: .69rem; }.auth-live-dot { color: #77dcaa; font-weight: 800; }.auth-live-dot::before { content: ""; display: inline-block; width: 6px; height: 6px; margin-right: 5px; border-radius: 50%; background: #5bd292; }.auth-product-stat { display: flex; gap: 12px; align-items: center; margin: 21px 0 15px; }.auth-product-stat strong { font-size: 2.1rem; letter-spacing: -.06em; }.auth-product-stat span { color: rgba(255,255,255,.55); font-size: .69rem; line-height: 1.5; }.auth-product-stat b { color: #75d79e; font-weight: 700; }.auth-product-row { padding: 11px 0; border-top: 1px solid rgba(255,255,255,.1); color: rgba(255,255,255,.55); font-size: .65rem; }.auth-product-row > span { gap: 9px; color: #fff; }.auth-product-row small { display: block; margin-top: 2px; color: rgba(255,255,255,.45); font-size: .59rem; }.auth-product-row > strong { color: #91baff; font-size: .62rem; }.auth-mini-score { display: grid; width: 29px; height: 23px; place-items: center; border-radius: 6px; background: #fff0dc; color: #ac691b; font-size: .67rem; font-style: normal; font-weight: 850; }.auth-mini-score--green { background: #e4f5ea; color: #258553; }.auth-proof { display: flex; gap: 24px; margin-top: 29px; color: rgba(255,255,255,.5); font-size: .65rem; }.auth-proof b { margin-right: 5px; color: #9cc4ff; }
.auth-panel--modern { display: block; padding: clamp(28px, 6vw, 72px); border-left: 1px solid #dfe4ed; background: var(--surface); }.auth-panel__top { display: flex; justify-content: space-between; align-items: center; gap: 14px; }.auth-mobile-brand { display: none; align-items: center; gap: 7px; color: var(--text); font-size: .78rem; font-weight: 850; letter-spacing: .04em; }.auth-mobile-brand img { width: 24px; height: 24px; flex: 0 0 auto; }.auth-step-label { color: var(--muted-2); font-size: .68rem; font-weight: 700; }.auth-form-heading { margin: clamp(52px, 10vh, 100px) 0 30px; }.auth-form-heading h2 { margin: 10px 0 0; font-size: clamp(1.8rem, 4vw, 2.6rem); letter-spacing: -.035em; }.auth-form-heading p { max-width: 390px; margin: 10px 0 0; line-height: 1.55; }.auth-form-modern { gap: 16px !important; }.auth-form-modern .field { gap: 7px; }.auth-form-modern .field label { font-size: .77rem; font-weight: 750; }.auth-form-modern input { min-height: 48px; border-radius: 10px; }.auth-form-modern input::placeholder { color: var(--muted-2); }.auth-label-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; }.auth-label-row a,.auth-label-row span { color: var(--accent); font-size: .72rem; font-weight: 750; text-decoration: none; }.auth-label-row a:hover { text-decoration: underline; }.auth-password-field { position: relative; }.auth-password-field input { width: 100%; padding-right: 60px; }.auth-password-toggle { position: absolute; top: 50%; right: 10px; padding: 5px; border: 0; transform: translateY(-50%); background: transparent; color: var(--accent); cursor: pointer; font: inherit; font-size: .7rem; font-weight: 800; }.auth-submit { min-height: 49px; justify-content: center; gap: 10px; margin-top: 4px; }.auth-status { margin: 0; font-size: .72rem; line-height: 1.45; }.auth-divider { margin: 3px 0; font-size: .65rem; }.auth-account-link { min-height: 44px; justify-content: center; font-size: .75rem; }.auth-account-link b { color: var(--accent); }.auth-legal { max-width: 420px; margin: 24px auto 0; color: var(--muted-2); font-size: .67rem; line-height: 1.55; text-align: center; }.auth-onboarding-list { display: grid; gap: 12px; max-width: 470px; margin-top: clamp(38px, 7vh, 70px); }.auth-onboarding-list > div { display: flex; gap: 13px; align-items: center; padding: 12px 13px; border: 1px solid rgba(255,255,255,.1); border-radius: 11px; background: rgba(255,255,255,.045); }.auth-onboarding-list i { display: grid; width: 29px; height: 29px; flex: 0 0 auto; place-items: center; border-radius: 8px; background: rgba(117,181,255,.14); color: #8ebcff; font-size: .64rem; font-style: normal; font-weight: 850; }.auth-onboarding-list b,.auth-onboarding-list small { display: block; }.auth-onboarding-list b { color: #fff; font-size: .78rem; }.auth-onboarding-list small { margin-top: 3px; color: rgba(255,255,255,.48); font-size: .66rem; line-height: 1.5; }.auth-visual-note { margin-top: 26px; color: rgba(255,255,255,.42); font-size: .7rem; }
@media (max-width: 900px) { .auth-shell { grid-template-columns: 1fr; }.auth-visual { min-height: auto; padding: 30px 24px 40px; }.auth-visual__copy { margin-top: 55px; }.auth-visual h1 { max-width: 640px; font-size: clamp(2.8rem, 9vw, 4.8rem); }.auth-product-card,.auth-onboarding-list { margin-top: 35px; }.auth-proof { margin-top: 22px; }.auth-panel--modern { border-left: 0; border-top: 1px solid var(--border); padding: 38px 24px 48px; }.auth-form-heading { margin-top: 44px; } }
@media (max-width: 520px) { .auth-visual { padding: 24px 18px 32px; }.auth-visual::after { inset: 12px; }.auth-brand { font-size: .72rem; }.auth-visual__copy { margin-top: 48px; }.auth-visual h1 { font-size: clamp(2.55rem, 13vw, 3.8rem); }.auth-visual__copy p { font-size: .92rem; }.auth-product-card { padding: 13px; }.auth-proof { gap: 13px; }.auth-proof span { font-size: .58rem; }.auth-panel--modern { padding: 30px 18px 38px; }.auth-mobile-brand { display: block; }.auth-step-label { font-size: .62rem; }.auth-form-heading { margin-top: 42px; }.auth-form-heading h2 { font-size: 1.85rem; } }

.auth-return-link { color: var(--muted); font-size: .72rem; font-weight: 750; text-decoration: none; }.auth-return-link:hover { color: var(--accent); }
.auth-security-card { display: flex; max-width: 460px; gap: 12px; align-items: flex-start; margin-top: clamp(38px, 7vh, 70px); padding: 15px; border: 1px solid rgba(255,255,255,.12); border-radius: 13px; background: rgba(255,255,255,.055); }.auth-security-icon { display: grid; width: 33px; height: 33px; flex: 0 0 auto; place-items: center; border-radius: 9px; background: rgba(117,181,255,.14); color: #9ac4ff; font-size: 1rem; }.auth-security-card b,.auth-security-card small { display: block; }.auth-security-card b { color: #fff; font-size: .78rem; }.auth-security-card small { margin-top: 4px; color: rgba(255,255,255,.5); font-size: .67rem; line-height: 1.5; }
.auth-panel--state { display: grid; align-content: center; }.auth-state { max-width: 430px; margin: clamp(44px, 9vh, 94px) auto 0; }.auth-state[hidden] { display: none; }.auth-state h2 { margin: 11px 0 0; font-size: clamp(1.85rem, 4vw, 2.55rem); letter-spacing: -.035em; }.auth-state > p { margin: 10px 0 22px; color: var(--muted); line-height: 1.6; }.auth-state .auth-status { margin-top: 16px; }.auth-state-form { margin-top: 18px; }.auth-wide-button { width: 100%; justify-content: center; margin-top: 12px; }.auth-state-icon { display: grid; width: 52px; height: 52px; margin: 24px 0 4px; place-items: center; border-radius: 15px; font-weight: 850; }.auth-state-icon--loading { border: 1px solid var(--border); background: var(--surface-2); }.auth-state-icon--loading i { width: 18px; height: 18px; border: 2px solid color-mix(in srgb, var(--accent) 20%, transparent); border-top-color: var(--accent); border-radius: 50%; animation: auth-spin .8s linear infinite; }.auth-state-icon--success { background: rgba(32,142,83,.11); color: #218653; font-size: 1.35rem; }@keyframes auth-spin { to { transform: rotate(360deg); } }
