/* GrowFX Pro frontend authentication */
.site-auth-body { min-height: 100vh; overflow-x: hidden; background: var(--site-bg); }
.site-auth-shell { display: grid; min-height: 100vh; grid-template-columns: minmax(0, 55fr) minmax(520px, 45fr); }

.site-auth-visual { position: relative; display: flex; min-width: 0; min-height: 100vh; overflow: hidden; padding: clamp(34px, 4vw, 62px); color: #fff; background: radial-gradient(circle at 18% 20%, rgba(120,103,238,.3), transparent 30%), radial-gradient(circle at 85% 72%, rgba(32,183,212,.16), transparent 28%), linear-gradient(145deg, #080b16 0%, #10152a 54%, #090c17 100%); flex-direction: column; isolation: isolate; }
.site-auth-visual::before { position: absolute; z-index: -1; inset: 0; background-image: linear-gradient(rgba(255,255,255,.025) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.025) 1px, transparent 1px); background-size: 56px 56px; content: ""; mask-image: linear-gradient(180deg, transparent, #000 25%, #000 80%, transparent); }
.site-auth-visual::after { position: absolute; z-index: -1; right: -20%; bottom: -38%; width: 78%; aspect-ratio: 1; border: 1px solid rgba(255,255,255,.07); border-radius: 50%; content: ""; box-shadow: 0 0 0 70px rgba(255,255,255,.015), 0 0 0 140px rgba(255,255,255,.012); }
.auth-visual-glow { position: absolute; z-index: -1; border-radius: 50%; filter: blur(85px); pointer-events: none; }
.auth-visual-glow-primary { top: 24%; left: 18%; width: 390px; height: 390px; background: rgba(120,103,238,.2); }
.auth-visual-glow-cyan { right: 3%; bottom: 13%; width: 310px; height: 310px; background: rgba(32,183,212,.12); }
.auth-visual-brand { position: relative; z-index: 3; display: inline-flex; width: fit-content; color: #fff; align-items: center; gap: 12px; }
.auth-visual-brand:hover { color: #fff; }
.auth-visual-brand > span { display: grid; width: 46px; height: 46px; color: #fff; background: var(--site-logo-gradient); border: 1px solid rgba(255,255,255,.2); border-radius: 14px; box-shadow: 0 14px 32px rgba(85,68,211,.35); font-size: 18px; place-items: center; }
.auth-visual-brand > span i, .site-auth-mobile-brand > span i, .auth-card-logo i { color: #fff; }
.auth-visual-brand > div { display: flex; flex-direction: column; }
.auth-visual-brand strong { font-size: 16px; font-weight: 800; }
.auth-visual-brand small { margin-top: 3px; color: rgba(255,255,255,.5); font-size: 8px; font-weight: 700; letter-spacing: .8px; text-transform: uppercase; }
.auth-visual-copy { position: relative; z-index: 2; max-width: 670px; margin-top: clamp(56px, 7vh, 90px); }
.auth-visual-copy > span { display: inline-flex; min-height: 32px; padding: 0 11px; color: #b9b0ff; background: rgba(120,103,238,.12); border: 1px solid rgba(160,147,255,.18); border-radius: 999px; font-size: 9px; font-weight: 800; letter-spacing: .65px; text-transform: uppercase; align-items: center; gap: 7px; }
.auth-visual-copy h1 { margin: 20px 0 16px; font-size: clamp(42px, 5.1vw, 74px); font-weight: 800; letter-spacing: -3.5px; line-height: 1.02; }
.auth-visual-copy p { max-width: 580px; margin: 0; color: rgba(232,235,248,.67); font-size: clamp(13px, 1.1vw, 16px); line-height: 1.75; }

.auth-trading-scene { position: relative; width: min(100%, 720px); min-height: 430px; margin-top: clamp(36px, 5vh, 64px); }
.auth-terminal-card { position: absolute; z-index: 2; top: 22px; right: 4%; left: 0; overflow: hidden; background: rgba(18,23,42,.76); border: 1px solid rgba(255,255,255,.1); border-radius: 22px; box-shadow: 0 34px 75px rgba(0,0,0,.34); backdrop-filter: blur(22px); transform: perspective(1200px) rotateY(3deg) rotateX(1deg); transition: transform 350ms ease, border-color 250ms ease; }
.auth-terminal-card:hover { border-color: rgba(140,126,245,.4); transform: perspective(1200px) rotateY(0) rotateX(0) translateY(-3px); }
.auth-terminal-card > header { display: flex; min-height: 61px; padding: 0 17px; background: rgba(255,255,255,.025); border-bottom: 1px solid rgba(255,255,255,.075); align-items: center; justify-content: space-between; }
.auth-terminal-card > header > div { display: flex; align-items: center; gap: 9px; }
.auth-terminal-card > header span { display: grid; width: 33px; height: 33px; background: var(--site-logo-gradient); border-radius: 10px; font-size: 11px; place-items: center; }
.auth-terminal-card > header strong { font-size: 10px; }
.auth-terminal-card > header small { display: inline-flex; min-height: 26px; padding: 0 9px; color: #35d4a4; background: rgba(39,211,155,.09); border: 1px solid rgba(39,211,155,.16); border-radius: 999px; font-size: 7px; font-weight: 800; align-items: center; gap: 6px; }
.auth-terminal-card > header small i { width: 6px; height: 6px; background: currentColor; border-radius: 50%; }
.auth-terminal-toolbar { display: flex; padding: 17px 18px 0; align-items: flex-end; justify-content: space-between; }
.auth-terminal-toolbar > div { display: flex; flex-direction: column; }
.auth-terminal-toolbar small { color: rgba(255,255,255,.46); font-size: 7px; }
.auth-terminal-toolbar strong { margin-top: 4px; font-size: 22px; }
.auth-terminal-toolbar > span { padding: 6px 8px; color: #35d4a4; background: rgba(39,211,155,.08); border-radius: 7px; font-size: 7px; font-weight: 800; }
.auth-terminal-chart { position: relative; display: flex; height: 145px; margin: 14px 18px; overflow: hidden; padding: 12px 8px; background: repeating-linear-gradient(0deg,transparent 0 34px,rgba(255,255,255,.05) 35px), repeating-linear-gradient(90deg,transparent 0 60px,rgba(255,255,255,.05) 61px); border: 1px solid rgba(255,255,255,.06); border-radius: 13px; align-items: flex-end; gap: 6px; }
.auth-terminal-chart > span { position: absolute; z-index: 2; right: 7px; bottom: 35%; left: 7px; height: 3px; background: linear-gradient(90deg,#20b7d4,#7867ee); border-radius: 999px; box-shadow: 0 0 15px rgba(32,183,212,.35); transform: skewY(-7deg); }
.auth-terminal-chart > i { width: 100%; height: 22%; background: linear-gradient(180deg,#20b7d4,#7867ee); border-radius: 3px 3px 1px 1px; opacity: .75; }
.auth-terminal-chart > i:nth-of-type(2) { height: 35%; } .auth-terminal-chart > i:nth-of-type(3) { height: 29%; } .auth-terminal-chart > i:nth-of-type(4) { height: 48%; } .auth-terminal-chart > i:nth-of-type(5) { height: 42%; } .auth-terminal-chart > i:nth-of-type(6) { height: 59%; } .auth-terminal-chart > i:nth-of-type(7) { height: 52%; } .auth-terminal-chart > i:nth-of-type(8) { height: 71%; } .auth-terminal-chart > i:nth-of-type(9) { height: 64%; } .auth-terminal-chart > i:nth-of-type(10) { height: 83%; } .auth-terminal-chart > i:nth-of-type(11) { height: 77%; } .auth-terminal-chart > i:nth-of-type(12) { height: 92%; }
.auth-terminal-stats { display: grid; padding: 14px 18px 18px; grid-template-columns: repeat(3,1fr); }
.auth-terminal-stats > div { display: flex; padding-left: 13px; border-left: 1px solid rgba(255,255,255,.075); flex-direction: column; }
.auth-terminal-stats > div:first-child { padding-left: 0; border-left: 0; }
.auth-terminal-stats small { color: rgba(255,255,255,.4); font-size: 6px; }
.auth-terminal-stats strong { margin-top: 4px; font-size: 9px; }
.auth-market-watch { position: absolute; z-index: 4; right: -15px; bottom: 1px; width: 185px; padding: 14px; background: rgba(18,23,42,.86); border: 1px solid rgba(255,255,255,.11); border-radius: 17px; box-shadow: 0 22px 55px rgba(0,0,0,.34); backdrop-filter: blur(20px); animation: auth-float 5.8s -2s ease-in-out infinite; }
.auth-market-watch header, .auth-market-watch > div { display: flex; align-items: center; justify-content: space-between; }
.auth-market-watch header { margin-bottom: 7px; } .auth-market-watch header strong { font-size: 8px; } .auth-market-watch header i { color: rgba(255,255,255,.4); font-size: 9px; }
.auth-market-watch > div { min-height: 38px; border-bottom: 1px solid rgba(255,255,255,.07); font-size: 6px; }
.auth-market-watch > div:last-child { border-bottom: 0; } .auth-market-watch > div span { display: flex; align-items: center; gap: 6px; } .auth-market-watch > div span i { color: #8b7bf4; }
.auth-market-watch > div strong { color: #35d4a4; } .auth-market-watch .auth-market-loss { color: #ef6078; }
.auth-floating-widget { position: absolute; z-index: 5; display: flex; min-width: 174px; padding: 12px 14px; background: rgba(18,23,42,.86); border: 1px solid rgba(255,255,255,.11); border-radius: 15px; box-shadow: 0 20px 52px rgba(0,0,0,.32); align-items: center; gap: 9px; backdrop-filter: blur(20px); animation: auth-float 5.4s ease-in-out infinite; }
.auth-floating-widget > span { display: grid; width: 34px; height: 34px; border-radius: 10px; place-items: center; }
.auth-floating-widget > div { display: flex; flex-direction: column; } .auth-floating-widget small { color: rgba(255,255,255,.45); font-size: 6px; } .auth-floating-widget strong { margin-top: 3px; font-size: 9px; }
.auth-profit-widget { top: 0; left: -11px; } .auth-profit-widget > span { color: #35d4a4; background: rgba(39,211,155,.1); } .auth-profit-widget strong { color: #35d4a4; font-size: 11px; }
.auth-security-widget { bottom: 17px; left: 11%; animation-delay: -3.1s; } .auth-security-widget > span { color: #8b7bf4; background: rgba(120,103,238,.12); }
.auth-trust-row { position: relative; z-index: 2; display: flex; margin-top: auto; padding-top: 35px; color: rgba(255,255,255,.58); font-size: 8px; font-weight: 750; flex-wrap: wrap; gap: 18px; }
.auth-trust-row span { display: inline-flex; align-items: center; gap: 6px; } .auth-trust-row i { color: #8b7bf4; font-size: 10px; }

.site-auth-panel { position: relative; display: flex; min-width: 0; min-height: 100vh; padding: 24px clamp(28px,4vw,66px); overflow-y: auto; background: var(--site-bg); flex-direction: column; }
.site-auth-panel::before { position: fixed; z-index: 0; top: -180px; right: -140px; width: 410px; height: 410px; background: var(--site-bg-glow-primary); border-radius: 50%; content: ""; filter: blur(80px); pointer-events: none; }
.site-auth-topbar { position: relative; z-index: 2; display: flex; min-height: 48px; align-items: center; justify-content: flex-end; }
.site-auth-mobile-brand { display: none; color: var(--site-text); align-items: center; gap: 9px; }
.site-auth-mobile-brand:hover { color: var(--site-text); }
.site-auth-mobile-brand > span { display: grid; width: 38px; height: 38px; color: #fff; background: var(--site-logo-gradient); border-radius: 11px; place-items: center; }
.site-auth-mobile-brand strong { font-size: 14px; font-weight: 800; }
.site-auth-theme-toggle { position: relative; display: grid; width: 43px; height: 43px; padding: 0; color: var(--site-text-soft); background: var(--site-surface); border: 1px solid var(--site-border); border-radius: 12px; box-shadow: 0 8px 22px rgba(0,0,0,.06); cursor: pointer; place-items: center; transition: color var(--site-transition), background var(--site-transition), border-color var(--site-transition), transform var(--site-transition); }
.site-auth-theme-toggle:hover { color: var(--site-primary); background: var(--site-primary-soft); border-color: color-mix(in srgb,var(--site-primary) 45%,var(--site-border)); transform: translateY(-1px); }
.site-auth-theme-toggle i { position: absolute; transition: opacity var(--site-transition), transform var(--site-transition); }
html[data-site-theme="dark"] .auth-theme-sun { opacity: 1; transform: scale(1) rotate(0); } html[data-site-theme="dark"] .auth-theme-moon { opacity: 0; transform: scale(.65) rotate(-20deg); }
html[data-site-theme="light"] .auth-theme-sun { opacity: 0; transform: scale(.65) rotate(20deg); } html[data-site-theme="light"] .auth-theme-moon { opacity: 1; transform: scale(1) rotate(0); }
.site-auth-panel-content { position: relative; z-index: 1; display: grid; width: 100%; margin: auto; padding: 32px 0; place-items: center; }
.site-auth-copyright { position: relative; z-index: 1; padding: 12px 0 4px; color: var(--site-text-muted); font-size: 8px; text-align: center; }

.auth-card { width: min(100%,560px); padding: clamp(27px,3.2vw,42px); background: var(--site-card-gradient); border: 1px solid var(--site-border); border-radius: 26px; box-shadow: var(--site-shadow), inset 0 1px rgba(255,255,255,.045); backdrop-filter: blur(22px) saturate(125%); }
.auth-card-register { width: min(100%,650px); }
.auth-card-header { margin-bottom: 27px; text-align: center; }
.auth-card-logo { display: grid; width: 54px; height: 54px; margin: 0 auto 16px; color: #fff; background: var(--site-logo-gradient); border: 1px solid var(--site-border-strong); border-radius: 16px; box-shadow: 0 14px 32px var(--site-bg-glow-primary); font-size: 19px; place-items: center; }
.auth-card-logo:hover { color: #fff; transform: translateY(-2px); }
.auth-card-header > span { color: var(--site-primary); font-size: 8px; font-weight: 800; letter-spacing: .85px; text-transform: uppercase; }
.auth-card-header h1 { margin: 8px 0 8px; color: var(--site-text); font-size: clamp(27px,3vw,37px); font-weight: 800; letter-spacing: -1.35px; line-height: 1.16; }
.auth-card-header p { margin: 0; color: var(--site-text-soft); font-size: 11px; line-height: 1.65; }
.auth-alert { display: flex; min-height: 46px; margin-bottom: 18px; padding: 10px 12px; border: 1px solid; border-radius: 12px; font-size: 16px; line-height: 1.5; align-items: center; gap: 8px; }
.auth-alert-success { color: var(--site-success); background: color-mix(in srgb,var(--site-success) 8%,transparent); border-color: color-mix(in srgb,var(--site-success) 22%,transparent); }
.auth-alert-error { color: #df526c; background: rgba(223,82,108,.07); border-color: rgba(223,82,108,.2); }
.auth-form { display: grid; gap: 17px; }
.auth-form-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; }
.auth-field { min-width: 0; }
.auth-field > label { display: block; margin: 0 0 7px 2px; color: var(--site-text); font-size: 9px; font-weight: 750; }
.auth-field > label span { margin-left: 3px; color: #df526c; }
.auth-input-wrap { position: relative; display: flex; min-height: 52px; color: var(--site-text-soft); background: var(--site-surface-muted); border: 1px solid var(--site-border); border-radius: 13px; align-items: center; transition: background var(--site-transition), border-color var(--site-transition), box-shadow var(--site-transition); }
.auth-input-wrap:focus-within { background: var(--site-surface); border-color: color-mix(in srgb,var(--site-primary) 65%,var(--site-border)); box-shadow: 0 0 0 4px var(--site-primary-soft); }
.auth-input-wrap.has-error, .was-validated .auth-input-wrap:has(input:invalid) { border-color: rgba(223,82,108,.75); box-shadow: 0 0 0 3px rgba(223,82,108,.08); }
.auth-input-icon { position: absolute; left: 15px; color: var(--site-text-muted); font-size: 13px; pointer-events: none; }
.auth-input-wrap input { width: 100%; height: 50px; padding: 0 44px 0 42px; color: var(--site-text); background: transparent; border: 0; outline: 0; font-family: var(--site-font); font-size: 16px; }
.auth-input-wrap input::placeholder { color: var(--site-text-muted); opacity: .78; }
.auth-input-wrap input:-webkit-autofill { -webkit-text-fill-color: var(--site-text); transition: background-color 9999s ease-in-out 0s; }
.auth-password-toggle { position: absolute; right: 8px; display: grid; width: 35px; height: 35px; padding: 0; color: var(--site-text-muted); background: transparent; border: 0; border-radius: 9px; cursor: pointer; place-items: center; }
.auth-password-toggle:hover { color: var(--site-primary); background: var(--site-primary-soft); }
.auth-field-error { display: flex; margin: 6px 2px 0; color: #df526c; font-size: 8px; line-height: 1.45; align-items: flex-start; gap: 5px; }
.auth-form-options { display: flex; margin-top: -2px; align-items: center; justify-content: space-between; gap: 14px; }
.auth-form-options > a, .auth-switch-copy a, .auth-terms-check a { color: var(--site-primary); font-weight: 800; }
.auth-form-options > a { font-size: 9px; }
.auth-form-options > a:hover, .auth-switch-copy a:hover, .auth-terms-check a:hover { color: var(--site-primary-strong); text-decoration: underline; }
.auth-check { display: inline-flex; margin: 0; color: var(--site-text-soft); font-size: 12px; line-height: 1.55; cursor: pointer; align-items: flex-start; gap: 8px; }
.auth-check > input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.auth-check > span:first-of-type { display: grid; width: 18px; height: 18px; color: transparent; background: var(--site-surface-muted); border: 1px solid var(--site-border-strong); border-radius: 5px; font-size: 11px; place-items: center; flex: 0 0 auto; transition: color var(--site-transition), background var(--site-transition), border-color var(--site-transition), box-shadow var(--site-transition); }
.auth-check > input:checked + span { color: #fff; background: var(--site-primary); border-color: var(--site-primary); }
.auth-check > input:focus-visible + span { box-shadow: 0 0 0 4px var(--site-primary-soft); }
.auth-terms-check { margin-top: -2px; }
.auth-terms-error { margin-top: -10px; }
.auth-password-hint { display: flex; margin-top: -9px; color: var(--site-text-muted); font-size: 8px; align-items: center; gap: 5px; }
.auth-submit-button { position: relative; display: flex; min-height: 54px; padding: 0 17px; color: #fff; background: var(--site-button-gradient); border: 0; border-radius: 13px; box-shadow: 0 15px 32px var(--site-bg-glow-primary); font-size: 10px; font-weight: 800; cursor: pointer; align-items: center; justify-content: center; transition: box-shadow var(--site-transition), opacity var(--site-transition), transform var(--site-transition); }
.auth-submit-button:hover { box-shadow: 0 20px 40px var(--site-bg-glow-primary); transform: translateY(-2px); }
.auth-submit-button:disabled { cursor: wait; opacity: .78; transform: none; }
.auth-submit-arrow { position: absolute; right: 17px; }
.auth-submit-loading { display: none; align-items: center; gap: 7px; }
.auth-submit-button.is-loading > span:first-child, .auth-submit-button.is-loading .auth-submit-arrow { display: none; }
.auth-submit-button.is-loading .auth-submit-loading { display: inline-flex; }
.auth-submit-button.is-loading .auth-submit-loading i { animation: auth-spin .8s linear infinite; }
.auth-divider { position: relative; display: flex; color: var(--site-text-muted); font-size: 8px; align-items: center; justify-content: center; }
.auth-divider::before, .auth-divider::after { height: 1px; background: var(--site-border); content: ""; flex: 1; }
.auth-divider span { padding: 0 11px; }
.auth-google-button { position: relative; display: flex; min-height: 52px; padding: 0 16px; color: var(--site-text); background: var(--site-surface-muted); border: 1px solid var(--site-border); border-radius: 13px; font-size: 10px; font-weight: 750; cursor: default; align-items: center; justify-content: center; gap: 9px; }
.auth-google-button > i { color: #4285f4; font-size: 14px; }
.auth-google-button > span { position: absolute; right: 11px; padding: 4px 6px; color: var(--site-text-muted); background: var(--site-surface); border: 1px solid var(--site-border); border-radius: 999px; font-size: 6px; text-transform: uppercase; }
.auth-switch-copy { margin: 1px 0 0; color: var(--site-text-soft); font-size: 10px; text-align: center; }
.auth-card-footer { display: grid; margin: 26px -4px -4px; padding-top: 19px; color: var(--site-text-muted); border-top: 1px solid var(--site-border); grid-template-columns: repeat(4,minmax(0,1fr)); gap: 8px; }
.auth-card-footer span { display: flex; min-width: 0; font-size: 7px; text-align: center; align-items: center; justify-content: center; flex-direction: column; gap: 6px; }
.auth-card-footer i { display: grid; width: 27px; height: 27px; color: var(--site-primary); background: var(--site-primary-soft); border-radius: 8px; font-size: 9px; place-items: center; }

@keyframes auth-float { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-7px); } }
@keyframes auth-spin { to { transform: rotate(360deg); } }

@media (max-width: 1199.98px) {
    .site-auth-shell { grid-template-columns: minmax(0,48fr) minmax(500px,52fr); }
    .site-auth-visual { padding: 36px; }
    .auth-visual-copy h1 { font-size: clamp(40px,5vw,58px); }
    .auth-market-watch { right: -8px; }
}

@media (max-width: 991.98px) {
    .site-auth-shell { display: block; }
    .site-auth-visual { display: none; }
    .site-auth-panel { min-height: 100vh; padding: 22px clamp(20px,6vw,54px); }
    .site-auth-topbar { justify-content: space-between; }
    .site-auth-mobile-brand { display: inline-flex; }
    .site-auth-panel-content { padding: 38px 0; }
}

@media (max-width: 575.98px) {
    .site-auth-panel { padding: 17px 14px; }
    .site-auth-topbar { min-height: 43px; }
    .site-auth-theme-toggle { width: 40px; height: 40px; }
    .site-auth-panel-content { padding: 25px 0; }
    .auth-card { padding: 25px 18px; border-radius: 21px; }
    .auth-card-header { margin-bottom: 23px; }
    .auth-card-logo { width: 49px; height: 49px; margin-bottom: 14px; }
    .auth-card-header h1 { font-size: 29px; }
    .auth-card-header p { font-size: 10px; }
    .auth-form-grid { grid-template-columns: 1fr; gap: 17px; }
    .auth-input-wrap { min-height: 54px; }
    .auth-input-wrap input { height: 52px; font-size: 16px; }
    .auth-field > label { font-size: 10px; }
    .auth-form-options { align-items: flex-start; }
    .auth-check, .auth-form-options > a { font-size: 9px; }
    .auth-submit-button { min-height: 55px; font-size: 11px; }
    .auth-google-button { min-height: 54px; }
    .auth-google-button > span { display: none; }
    .auth-card-footer { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 13px 7px; }
    .auth-card-footer span { font-size: 8px; }
    .site-auth-copyright { font-size: 7px; }
}

@media (prefers-reduced-motion: reduce) {
    .auth-market-watch, .auth-floating-widget { animation: none; }
}