.auth-page{min-height:100vh;display:grid;grid-template-columns:1.08fr .92fr;position:relative;z-index:1}
.auth-brand-pane{padding:48px;display:flex;flex-direction:column;justify-content:space-between;border-right:1px solid var(--border);background:
radial-gradient(circle at 20% 15%,rgba(232,168,56,.13),transparent 30%),
linear-gradient(180deg,rgba(15,15,20,.82),rgba(7,7,10,.96))}
.auth-logo{font-size:1.35rem;font-weight:800;color:var(--text);letter-spacing:-.03em}
.auth-logo span{color:var(--accent)}
.auth-pitch{max-width:560px}
.auth-pitch .hero-badge{margin-bottom:22px}
.auth-pitch h1{font-size:3.5rem;line-height:1.05;letter-spacing:-2px;margin-bottom:18px}
.auth-pitch p{color:var(--text-muted);font-size:1rem;line-height:1.7;max-width:520px}
.auth-benefits{display:grid;gap:10px;margin-top:30px}
.auth-benefit{display:flex;gap:11px;align-items:center;color:var(--text-muted);font-size:.84rem}
.auth-benefit span{width:24px;height:24px;border-radius:7px;background:var(--accent-dim);border:1px solid rgba(232,168,56,.15);display:flex;align-items:center;justify-content:center;color:var(--accent);font-size:.7rem;font-weight:900}
.auth-brand-foot{color:var(--text-dim);font-size:.72rem}
.auth-form-pane{display:flex;align-items:center;justify-content:center;padding:42px 24px;background:rgba(7,7,10,.76)}
.login-card{width:100%;max-width:430px}
.login-card h2{font-size:1.7rem;margin-bottom:7px}
.login-card>.sub{color:var(--text-muted);font-size:.86rem;margin-bottom:25px}
.login-method-note{display:grid;gap:4px;margin:-8px 0 20px;padding:12px 13px;border:1px solid rgba(255,255,255,.075);border-radius:11px;background:rgba(255,255,255,.02)}
.login-method-note strong{color:#e9ecf0;font-size:.76rem}
.login-method-note span{color:var(--text-muted);font-size:.68rem;line-height:1.5}
.login-field{margin-bottom:14px}
.login-field label{display:block;color:var(--text-muted);font-size:.69rem;font-weight:800;text-transform:uppercase;letter-spacing:.6px;margin-bottom:6px}
.login-field input{width:100%;background:var(--surface);border:1px solid var(--border);color:var(--text);border-radius:10px;padding:12px 13px;font:inherit;font-size:.85rem;outline:0}
.login-field input:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(232,168,56,.06)}
.login-submit{width:100%;border:0;background:var(--accent);color:#111;border-radius:10px;padding:12px;font:inherit;font-size:.86rem;font-weight:900;cursor:pointer;margin-top:5px}
.login-submit:hover{background:var(--accent-bright)}
.login-submit:disabled{opacity:.65;cursor:wait;transform:none}
.auth-switch{font-size:.78rem;color:var(--text-muted);text-align:center;margin-top:18px}
.auth-switch a{color:var(--accent);font-weight:700;}
.panel-signup{display:none}
body.signup-mode .panel-login{display:none}
body.signup-mode .panel-signup{display:block}
.back-link{display:inline-flex;margin-top:18px;color:var(--text-muted);font-size:.76rem}
.back-link:hover{color:var(--accent)}
@media(max-width:860px){.auth-page{grid-template-columns:1fr}.auth-brand-pane{display:none}.auth-form-pane{min-height:100vh}.login-card{max-width:460px}}

.auth-message{position:absolute;top:18px;left:50%;transform:translateX(-50%);width:min(430px,calc(100% - 40px));min-height:20px;text-align:center;color:var(--text-muted);font-size:.76rem;z-index:3}
.auth-message.error{color:#ef8585}
.auth-message.success{color:var(--success)}

.legal-agreement{display:flex;align-items:flex-start;gap:9px;margin:14px 0 10px;color:var(--text-muted);font-size:.72rem;line-height:1.5;cursor:pointer}
.legal-agreement input{width:15px;height:15px;margin-top:2px;accent-color:var(--accent);flex:0 0 auto}
.legal-agreement a{color:var(--accent);}
.legal-agreement a:hover{text-decoration:underline}

.forgot-link{display:block;margin:-3px 0 12px;text-align:right;color:var(--accent);font-size:.72rem;font-weight:700;}
.forgot-link:hover{text-decoration:underline}
.reset-note{color:var(--text-muted);font-size:.76rem;line-height:1.6;margin-bottom:18px}
.reset-success{padding:11px 12px;border:1px solid rgba(74,222,128,.2);background:rgba(74,222,128,.06);color:var(--success);border-radius:10px;font-size:.76rem;line-height:1.5;margin-bottom:14px}

.auth-brand-pane .auth-logo{align-self:flex-start;line-height:1}

.roblox-login-button{display:grid;grid-template-columns:40px minmax(0,1fr) auto;align-items:center;gap:12px;width:100%;min-height:58px;padding:9px 12px;margin:-6px 0 16px;border:1px solid rgba(255,255,255,.11);border-radius:12px;background:#111318;color:#f3f4f6;text-decoration:none;transition:border-color .18s ease,background .18s ease,transform .18s ease}
.roblox-login-button:hover{border-color:rgba(232,168,56,.34);background:#15181e;transform:translateY(-1px)}
.roblox-login-mark{width:40px;height:40px;border-radius:10px;display:grid;place-items:center;background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.075);color:#f4f5f7}
.roblox-login-mark svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linejoin:round}
.roblox-login-copy{min-width:0;display:grid;gap:2px}
.roblox-login-copy strong{font-size:.82rem;color:#f3f4f6}
.roblox-login-copy small{font-size:.66rem;color:var(--text-muted);line-height:1.35}
.roblox-login-arrow{color:var(--accent);font-size:1rem;font-weight:800}
.auth-divider{display:flex;align-items:center;gap:10px;margin:2px 0 16px;color:#727984;font-size:.64rem;text-transform:uppercase;letter-spacing:.08em;font-weight:800}
.auth-divider:before,.auth-divider:after{content:"";height:1px;flex:1;background:var(--border)}
.auth-divider span{white-space:nowrap}
.roblox-first-link-note{margin:13px 4px 0;color:#747b86;font-size:.65rem;line-height:1.55;text-align:center}

/* v21.6.6 Android auth polish */
@media(max-width:860px){
  .auth-page,.auth-form-pane{min-height:100dvh}
  .auth-form-pane{padding-left:16px;padding-right:16px}
  .login-card{width:100%;max-width:460px}
  .login-card input,.login-card select,.login-card textarea{font-size:16px!important}
  .login-card button{min-height:44px}
}
@media(max-width:420px){
  .roblox-login-button{grid-template-columns:38px minmax(0,1fr) auto;padding:9px 10px;gap:10px}
  .roblox-login-mark{width:38px;height:38px}
  .roblox-login-copy small{font-size:.62rem}
}