.auth-layout { min-height: 100vh; display: grid; grid-template-columns: 1.05fr 1fr; background: var(--bg); }
.auth-story { background: radial-gradient(ellipse at 12% 45%, #103A652F, transparent 65%), #0B1020; color: var(--silver); display: flex; flex-direction: column; padding: 42px 9%; position: relative; overflow: hidden; border-right: 1px solid var(--border); }
.auth-story::after { content: ''; position: absolute; width: 540px; height: 540px; border-radius: 50%; border: 1px solid #1677FF0B; bottom: -395px; left: -85px; box-shadow: 0 0 0 70px #1677FF04, 0 0 0 140px #1677FF03; pointer-events: none; }
.auth-story .brand { padding: 0; text-decoration: none; align-self: flex-start; }.auth-story .brand-logo { width: 52px; height: 52px; flex-basis: 52px; }.auth-story .brand-logo img { width: 89px; height: 89px; }.auth-story .brand-copy b { font-size: 16px; letter-spacing: 2px; }.auth-story .brand-copy small { font-size: 10px; letter-spacing: 2px; }
.auth-story-body { margin: auto 0; padding: 60px 0; max-width: 530px; position: relative; z-index: 1; }.auth-eyebrow { font-size: 12px; text-transform: uppercase; letter-spacing: 1.7px; color: #80BCF7; }.auth-story h1 { color: var(--text); font-family: system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif; font-size: clamp(36px, 3.5vw, 56px); font-weight: 750; letter-spacing: -2px; line-height: 1.16; margin-top: 22px; }.auth-story h1 em { font-style: normal; color: #89C8FF; }.auth-story-body > p { font-size: 16px; color: var(--secondary); line-height: 1.85; margin-top: 23px; max-width: 410px; }
.auth-chart { border: 1px solid #284465; border-radius: 14px; background: linear-gradient(140deg, #15273F, #0E1728); padding: 23px 25px 18px; margin-top: 34px; box-shadow: 0 16px 45px #00000024; }.auth-chart > div span { display: block; font-size: 12px; color: var(--secondary); }.auth-chart > div b { display: block; font-size: 22px; font-family: system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif; letter-spacing: -.5px; color: var(--silver); margin-top: 7px; }.auth-chart > div small { display: block; color: #8FB5DE; font-size: 12px; margin-top: 8px; }.auth-chart svg { width: 100%; height: auto; margin-top: 22px; }.auth-chart-note { display: block; text-align: right; font-size: 10px; line-height: 1.5; color: #96A8C1; margin-top: 5px; }
.auth-benefits { display: flex; flex-wrap: wrap; gap: 15px 19px; margin-top: 28px; }.auth-benefits span { display: flex; align-items: center; gap: 8px; font-size: 12px; color: #A5BAD6; }.auth-benefits .icon { width: 15px; height: 15px; color: #68B7FF; }.auth-story-footer { font-size: 12px; color: #879BB9; padding-top: 22px; }
.auth-entry { display: flex; align-items: center; justify-content: center; flex-direction: column; padding: 45px; position: relative; min-height: 100vh; background: radial-gradient(ellipse at 80% 0%, #1677FF07, transparent 55%), var(--bg); }.auth-card { width: 100%; max-width: 392px; margin: auto; }.auth-card-icon { width: 48px; height: 48px; border-radius: 13px; display: grid; place-items: center; background: #132D4F; border: 1px solid #23456C; color: #7AC3FF; margin-bottom: 26px; }.auth-card-icon .icon { width: 23px; height: 23px; }.auth-card .eyebrow { display: block; color: #88B2E0; font-size: 11px; margin-bottom: 11px; }.auth-card h2 { font-family: system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif; font-size: 30px; letter-spacing: -1px; color: var(--text); font-weight: 750; line-height: 1.3; }.auth-description { color: var(--secondary); font-size: 14px; line-height: 1.8; margin-top: 13px; margin-bottom: 29px; overflow-wrap: anywhere; }.auth-description strong { color: var(--silver); font-weight: 600; }
.auth-form { display: flex; flex-direction: column; gap: 19px; }.auth-form .field label { font-size: 13px; color: #C4D0E3; }.auth-form input { padding: 14px 15px; font-size: 14px; border: 1px solid #2B3D58; background: #0D1525; border-radius: 9px; min-height: 49px; }.auth-form input::placeholder { color: #7C8CA6; }.auth-form .primary { padding: 14px 17px; font-size: 14px; margin-top: 5px; justify-content: space-between; min-height: 49px; }.password-wrap { position: relative; }.password-wrap input { width: 100%; padding-right: 86px; }.password-wrap button { position: absolute; right: 10px; top: 13px; font-size: 11px; color: #95BDDF; padding: 5px; }.auth-forgot { align-self: flex-end; font-size: 12px !important; margin-top: -7px; }.auth-form-hint { font-size: 12px; line-height: 1.7; color: var(--secondary); margin-top: -5px; }.auth-switch { text-align: center; font-size: 13px; color: var(--secondary); margin-top: 25px; line-height: 1.7; }.auth-switch button { font-size: 13px; margin-left: 4px; }.auth-divider { display: flex; align-items: center; gap: 12px; font-size: 11px; color: #8F9FB7; margin: 27px 0 18px; }.auth-divider span { border-top: 1px solid var(--border); flex: 1; }.auth-demo { width: 100%; padding: 13px 16px !important; justify-content: space-between; color: var(--silver) !important; font-size: 13px !important; border-color: #2B3D58 !important; min-height: 47px; }.auth-privacy { font-size: 11px; line-height: 1.8; text-align: center; color: #92A3BC; margin-top: 22px; }.auth-privacy .icon { width: 13px; height: 13px; margin-right: 4px; }.auth-entry-footer { color: #8091AC; font-size: 11px; margin-top: 36px; text-align: center; line-height: 1.7; }.auth-mobile-brand { display: none; }
.auth-message { font-size: 13px; line-height: 1.7; color: #99E7C7; background: #122F27; border: 1px solid #255340; padding: 13px 15px; border-radius: 9px; margin-top: 16px; }.auth-message:empty { display: none; }.auth-notice { font-size: 13px; line-height: 1.7; background: #28251D; border: 1px solid #493D27; color: #DDC797; border-radius: 9px; padding: 14px; margin-bottom: 20px; }.cloud-badge { font-size: 12px; display: flex; align-items: center; gap: 7px; color: var(--secondary); }.cloud-badge.error { color: var(--red); }.account-actions { display: flex; gap: 11px; flex-wrap: wrap; margin-top: 18px; }
@media (max-width: 1000px) { .auth-story { padding: 36px 8%; }.auth-story h1 { font-size: 39px; }.auth-entry { padding: 36px; }.auth-story-body > p { font-size: 15px; }.auth-benefits { gap: 13px; }.auth-chart { padding: 20px; }.auth-story-body { padding: 43px 0; }.auth-story .brand-copy b { font-size: 14px; } }
@media (max-width: 740px) { .auth-layout { display: block; }.auth-story { display: none; }.auth-entry { padding: 28px 25px 25px; min-height: 100dvh; }.auth-card { max-width: 405px; }.auth-mobile-brand { display: flex; margin: 0 0 34px; padding: 0; width: fit-content; gap: 12px; }.auth-mobile-brand .brand-logo { width: 47px; height: 47px; }.auth-mobile-brand .brand-copy b { font-size: 15px; letter-spacing: 1.6px; }.auth-mobile-brand .brand-copy small { font-size: 9px; }.auth-card-icon { margin-bottom: 22px; width: 44px; height: 44px; }.auth-card h2 { font-size: 28px; }.auth-description { margin-bottom: 25px; }.auth-entry-footer { margin-top: 35px; }.auth-form input { font-size: 16px; }.auth-switch { margin-top: 24px; } }
@media (max-width: 390px) { .auth-entry { padding: 24px 20px; }.auth-card h2 { font-size: 26px; }.auth-mobile-brand { margin-bottom: 28px; }.auth-description { font-size: 13px; }.auth-entry-footer { font-size: 10px; } }
.auth-entry-footer .legal-links{justify-content:center;margin-top:12px}
.auth-terms{display:flex;align-items:flex-start;gap:10px;text-align:left;font-size:12px;line-height:1.7;color:#CCD4E2}
.auth-terms input{flex:0 0 17px;width:17px;height:17px;margin:3px 0 0;accent-color:#315DFF}
.auth-terms a,.auth-data-note a{color:#9CBDFD;text-decoration:underline;text-underline-offset:3px}
.auth-data-note{font-size:11px;line-height:1.75;color:#9CA8BD;text-align:left;margin:0}
.auth-form label.auth-terms{display:flex;align-items:flex-start;gap:10px;margin:0;font-size:12px;line-height:1.7}
.auth-form .auth-terms input[type="checkbox"]{width:17px;height:17px;min-height:17px;flex:0 0 17px;margin:3px 0 0;padding:0;appearance:auto;accent-color:#315DFF}
.auth-form .auth-terms span{flex:1}