/* ── Signed-out surface (login + signup wizard) in the v3 PUBLIC brand ──
   Visitors arrive here straight from the website, so this screen matches it: light ground, ink
   text, the blue-to-teal gradient. Scoped strictly to #loginScreen; the signed-in app keeps the
   user's chosen theme (dark by default, Profile > Appearance to switch). */
#loginScreen { background: radial-gradient(ellipse at 50% 0%, rgba(46,124,246,.08) 0%, rgba(43,208,197,.05) 40%, #F4F6FA 70%); color-scheme: light; }
#loginScreen::before { background: radial-gradient(circle, rgba(46,124,246,.30), transparent 70%); }
#loginScreen::after { background: radial-gradient(circle, rgba(43,208,197,.28), transparent 70%); }
#loginScreen .login-card { background: #FFFFFF; border-color: rgba(11,16,32,.10); box-shadow: 0 1px 2px rgba(11,16,32,.05), 0 24px 64px -24px rgba(11,16,32,.18); }
#loginScreen .login-card::before { background: radial-gradient(ellipse at 30% -10%, rgba(46,124,246,.12) 0%, rgba(43,208,197,.08) 55%, transparent 80%); }
#loginScreen, #loginScreen .login-tagline, #loginScreen .login-hint, #loginScreen p, #loginScreen label { color: #4A5468; }
#loginScreen h1, #loginScreen h2, #loginScreen h3, #loginScreen b, #loginScreen strong { color: #0B0F1A; }
#loginScreen .login-label { color: #6E7890; }
#loginScreen .login-input, #loginScreen input, #loginScreen select, #loginScreen textarea { background: #FFFFFF !important; border-color: rgba(11,16,32,.16) !important; color: #0B0F1A !important; }
#loginScreen .login-input:focus, #loginScreen input:focus, #loginScreen select:focus, #loginScreen textarea:focus { border-color: #2E7CF6 !important; box-shadow: 0 0 0 3px rgba(46,124,246,.12); }
#loginScreen ::placeholder { color: #9AA3B5; }
#loginScreen .login-btn, #loginScreen .btn-primary { background: linear-gradient(135deg, #2E7CF6, #2BD0C5); color: #fff; }
#loginScreen .btn-secondary { background: #FFFFFF; border: 1px solid rgba(11,16,32,.16); color: #0B0F1A; }
#loginScreen a { color: #2E7CF6; }
#loginScreen .login-error { color: #8E2A31; background: rgba(208,59,68,.08); border-color: rgba(208,59,68,.28); }
#loginScreen .login-error.success { color: #14532D; background: rgba(24,138,78,.08); border-color: rgba(24,138,78,.28); }
#loginScreen .su-step-pill { color: #6E7890; }
#loginScreen .su-step-pill::before { background: rgba(11,16,32,.10); }
#loginScreen .su-step-pill.on { color: #0B0F1A; }
#loginScreen .su-step-pill.on::before { background: linear-gradient(90deg, #2E7CF6, #2BD0C5); }
#loginScreen [style*="rgba(255,255,255,.0"], #loginScreen [style*="rgba(255,255,255,0.0"] { background-color: #F7F8F9 !important; }
#loginScreen [style*="color:#fff"], #loginScreen [style*="color: #fff"], #loginScreen [style*="color:#ffffff"] { color: #0B0F1A !important; }
#loginScreen .login-btn[style*="color"], #loginScreen .btn-primary[style*="color"] { color: #fff !important; }