/* Scoped to the login modal; existing authentication stays intact. */
@media(min-width:761px){
 #globalLoginModal .global-login-modal{max-width:860px!important;width:calc(100vw - 48px)!important}
 #globalLoginModal .global-login-modal-body{display:grid!important;grid-template-columns:minmax(260px,.9fr) minmax(340px,1fr)}
 #globalLoginModal .global-login-container{width:100%!important;max-width:none!important;margin:0!important;box-sizing:border-box}
}
.login-mates{position:relative;min-height:400px;background:linear-gradient(145deg,#eeedf7,#e2e7f3);overflow:hidden;display:flex;align-items:flex-end;justify-content:center;padding:44px 20px 54px;box-sizing:border-box;isolation:isolate}
.login-mates-intro{position:absolute;top:40px;left:28px;right:28px;color:#26263e;font-size:25px;font-weight:800;line-height:1.5}
.login-mates-intro small{display:block;font-size:13px;font-weight:500;color:#6a6a82;margin-top:8px}
.login-mates-cast{position:relative;width:270px;height:245px;max-width:100%}
.login-mate{color:#20212c;position:absolute;bottom:0;border:0;cursor:pointer;padding:0;transform-origin:bottom center;transition:transform .35s ease;box-shadow:inset -6px 0 0 #00000008; -webkit-tap-highlight-color:transparent}
.login-mate:focus-visible{outline:3px solid #2563eb;outline-offset:5px}
.login-mate.purple{left:87px;width:78px;height:235px;background:#7638ef;border-radius:9px 9px 0 0;transform:rotate(-7deg);z-index:1}
.login-mate.black{left:157px;width:65px;height:169px;background:#20212c;border-radius:12px 12px 0 0;z-index:2;color:white}
.login-mate.yellow{left:211px;width:65px;height:133px;background:#ffcf35;border-radius:40px 40px 6px 6px;z-index:3}
.login-mate.orange{left:0;width:171px;height:116px;background:#ff823f;border-radius:110px 110px 5px 5px;z-index:4}
.mate-face{position:absolute;left:50%;top:36%;transform:translateX(-50%);width:48px;height:43px;transition:transform .3s}
.mate-eyes{display:flex;justify-content:space-between;transform:translate(var(--look-x,0px),var(--look-y,0px));transition:transform .15s}
.mate-eyes i{display:block;width:8px;height:10px;border-radius:50%;background:currentColor;color:inherit}
.mate-mouth{display:block;width:17px;height:8px;border-bottom:3px solid currentColor;border-radius:0 0 15px 15px;position:absolute;left:16px;top:23px}
.mate-hands{position:absolute;inset:-5px -2px auto;height:23px;display:none}
.mate-hands:before,.mate-hands:after{content:'';position:absolute;width:24px;height:21px;border-radius:9px;background:inherit;background:#bba9e5;box-shadow:0 2px 3px #0002}
.mate-hands:before{left:-1px;transform:rotate(-15deg)}.mate-hands:after{right:-1px;transform:rotate(15deg)}
.login-mates[data-mood=curious] .login-mate{transform:skewX(-5deg) rotate(5deg)}
.login-mates[data-mood=curious] .mate-face{transform:translateX(-35%)}
.login-mates[data-mood=shy] .login-mate{transform:rotate(-8deg)}
.login-mates[data-mood=shy] .mate-face{transform:translateX(-70%)}
.login-mates[data-mood=shy] .mate-eyes i{height:5px;background:transparent;border-bottom:3px solid currentColor;border-radius:0 0 8px 8px}
.login-mates[data-mood=covered] .mate-hands{display:block}
.login-mates[data-mood=covered] .mate-mouth{height:13px;width:9px;border:2px solid currentColor;border-radius:50%;top:26px;left:19px}
.login-mates[data-mood=waiting] .login-mate{animation:mateWait .8s ease-in-out infinite alternate}
.login-mates[data-mood=waiting] .black{animation-delay:.15s}.login-mates[data-mood=waiting] .yellow{animation-delay:.3s}.login-mates[data-mood=waiting] .orange{animation-delay:.45s}
.login-mates[data-mood=sad] .login-mate{transform:translateY(5px) rotate(-3deg)}
.login-mates[data-mood=sad] .mate-mouth{border-bottom:0;border-top:3px solid currentColor;border-radius:15px 15px 0 0}
@keyframes mateWait{to{transform:translateY(-12px) rotate(3deg)}}
#globalLoginModal .login-password-wrapper input{padding-right:64px!important}
.login-password-toggle{position:absolute;right:12px;top:50%;transform:translateY(-50%);border:0;border-radius:6px;background:transparent;color:#4f46e5;font-size:12px;font-weight:700;padding:8px;cursor:pointer;z-index:2}
@media(max-width:760px){
 .login-mates{min-height:125px;height:125px;padding:0 14px 10px;justify-content:flex-end}
 .login-mates-intro{top:25px;left:20px;right:140px;font-size:18px}.login-mates-intro small{font-size:11px}
 .login-mates-cast{flex:none;transform:scale(.43);transform-origin:bottom right;width:270px;height:245px;margin-left:-145px}
}
@media(prefers-reduced-motion:reduce){.login-mates *,#globalLoginModal .login-mate{animation:none!important;transition:none!important}}
