#loginDialog.login-dialog{width:min(920px,calc(100% - 34px));max-width:none;padding:0;overflow:hidden;border-color:rgba(115,184,255,.42);background:linear-gradient(145deg,#07101f,#112644);box-shadow:0 42px 120px #000c,0 0 60px rgba(40,102,199,.18)}
#loginDialog .dialog-close{z-index:5;right:18px;top:14px;width:40px;height:40px;border-radius:50%;background:#07101fcc;line-height:1}
#loginDialog .login-shell{display:grid;grid-template-columns:minmax(300px,.88fr) minmax(400px,1.12fr);min-height:620px}
#loginDialog .login-mascot{position:relative;display:flex;align-items:flex-end;justify-content:center;overflow:hidden;background:radial-gradient(circle at 52% 32%,rgba(115,184,255,.32),transparent 30%),radial-gradient(circle at 50% 76%,rgba(232,64,81,.2),transparent 38%),linear-gradient(160deg,#071225,#091a36)}
#loginDialog .login-mascot::before{content:"";position:absolute;width:330px;height:330px;top:80px;border:1px solid rgba(242,201,109,.3);border-radius:50%;box-shadow:0 0 80px rgba(40,102,199,.2)}
#loginDialog .login-mascot span{position:absolute;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:42px 42px;mask-image:linear-gradient(to bottom,#000,transparent 86%)}
#loginDialog .login-mascot img{position:relative;z-index:1;width:min(120%,470px);height:auto;max-height:590px;object-fit:contain;object-position:center bottom;filter:drop-shadow(0 24px 32px rgba(0,0,0,.5))}
#loginDialog .login-content{align-self:center;padding:56px 58px 48px}
#loginDialog .login-content>p:not(.kicker){margin:20px 0 0;color:#aab8cf;font-size:16px}
#loginDialog .login-content form{margin-top:30px}
#loginDialog .login-content input{height:54px;border-color:rgba(190,210,242,.22);border-radius:10px;background:#0b1830}
#loginDialog .login-content form .button{min-height:56px;margin-top:5px;font-size:16px}
@media(max-width:700px){#loginDialog.login-dialog{width:min(440px,calc(100% - 22px));max-height:calc(100dvh - 20px);overflow:auto;border-radius:24px}#loginDialog .login-shell{display:block;min-height:0}#loginDialog .login-mascot{height:210px;align-items:flex-start;background:radial-gradient(circle at 50% 40%,rgba(115,184,255,.34),transparent 42%),linear-gradient(160deg,#071225,#0c2144)}#loginDialog .login-mascot::before{width:230px;height:230px;top:18px}#loginDialog .login-mascot img{width:230px;max-height:none;margin-top:-18px}#loginDialog .login-content{padding:24px 24px max(26px,env(safe-area-inset-bottom))}#loginDialog .login-content .dialog-mark{position:absolute;left:18px;top:18px;width:48px;height:48px;margin:0;background:#fff}#loginDialog .login-content .kicker{margin-bottom:10px;font-size:10px}#loginDialog .login-content h2{font-size:32px}#loginDialog .login-content>p:not(.kicker){margin-top:10px;font-size:14px}#loginDialog .login-content form{gap:13px;margin-top:20px}#loginDialog .login-content input{height:49px}#loginDialog .login-content form .button{min-height:52px}}
@media(max-width:380px),(max-height:680px) and (max-width:700px){#loginDialog .login-mascot{height:145px}#loginDialog .login-mascot img{width:175px;margin-top:-22px}#loginDialog .login-content{padding-top:18px}#loginDialog .login-content h2{font-size:28px}}
@media(prefers-reduced-motion:reduce){#loginDialog .login-mascot img{transition:none}}
