/* Mobile login presentation only; existing credentials, PIN and desktop remain owned by auth. */
@media(max-width:1023px){
    body{background:#fff;padding:28px 24px calc(24px + env(safe-area-inset-bottom,0px));align-items:center;overflow-x:hidden}
    .login-container{position:relative;max-width:420px;flex:0 1 420px;outline:none}
    .manual-card{position:relative;isolation:isolate;padding:30px 4px 28px;border-radius:0;box-shadow:none;background:transparent}
    .manual-card::before,.manual-card::after{content:'';position:fixed;border-radius:50%;border:34px solid #eaf3ff;z-index:-1;pointer-events:none}
    .manual-card::before{width:190px;height:190px;top:-100px;left:-95px;border-width:42px}
    .manual-card::after{width:125px;height:125px;top:-75px;right:-54px;border-color:#f1f7ff}
    .auth-login__manual-logo{width:160px;height:88px;object-fit:cover;margin:0 auto 18px}
    .auth-login__manual-intro{margin-bottom:36px}
    .auth-login__manual-intro .auth-login__title{font-size:19px;line-height:1.45;font-weight:600;color:#1c2d46;letter-spacing:-.4px;margin-bottom:8px}
    .auth-login__manual-intro .auth-login__subtitle{font-size:14px;color:#8995a7;line-height:1.6}
    #manual-form .form-group{position:relative;margin-bottom:25px}
    #manual-form .form-group label{position:absolute;left:17px;top:-9px;z-index:1;padding:0 7px;margin:0;background:#fff;color:#6e7e96;font-size:12px;font-weight:500;letter-spacing:0;text-transform:none;transition:color .18s ease}
    #manual-form .form-group input{height:59px;padding:15px 18px;border:1px solid #e2e8f1;background:#fff;border-radius:17px;font-size:16px;color:#22344d;box-shadow:0 3px 12px #16325903;transition:border-color .18s ease,box-shadow .18s ease}
    #manual-form .form-group input::placeholder{color:#a5afbd;font-size:14px}
    #manual-form .form-group:focus-within label{color:#2484ec}
    #manual-form .form-group input:focus{border-color:#3594f1;box-shadow:0 0 0 3px #3292ef12}
    #manual-form .submit-btn{min-height:56px;border-radius:16px;background:linear-gradient(110deg,#168de9,#386cf0);font-size:17px;font-weight:500;box-shadow:0 8px 24px #287fe526;margin-top:2px}
    #manual-form .submit-btn:focus-visible{outline:3px solid #9bcbff;outline-offset:4px}
    .auth-login__help--manual{font-size:12px;color:#98a3b3;margin-top:23px}
    #manual-mode>.switch-link{font-size:13px;margin-top:8px;color:#5483bf}
    #pin-mode{background:#fff;border-radius:24px;box-shadow:none;padding:26px 12px}
    #pin-mode .auth-login__title{font-size:19px;color:#22344d}
    #pin-mode .auth-login__subtitle{font-size:13px;color:#8995a7}
    #pin-mode .key{border-color:#e7eef8;background:#f5f8fd;color:#28446e}
    #pin-mode .switch-link{color:#287fe5;font-size:13px}
}
@media(max-width:359px){body{padding-inline:20px}.auth-login__manual-intro .auth-login__title{font-size:18px}.manual-card{padding-top:20px}}
@media(max-width:1023px) and (max-height:620px){body{align-items:flex-start;padding-top:20px}.manual-card{padding-top:0}.auth-login__manual-logo{height:65px;margin-bottom:10px}.auth-login__manual-intro{margin-bottom:26px}}

.auth-mobile-social{display:none}
@media(max-width:1023px){
    .auth-mobile-social{display:grid;gap:10px;margin-top:16px}
    .auth-mobile-social-divider{display:flex;align-items:center;gap:12px;color:#9aa5b4;font-size:11px;text-align:center;margin-bottom:4px}
    .auth-mobile-social-divider::before,.auth-mobile-social-divider::after{content:'';height:1px;flex:1;background:#edf1f6}
    .auth-mobile-social-button{display:flex;align-items:center;justify-content:center;gap:11px;min-height:50px;width:100%;padding:10px 16px;border:1px solid #e6ecf4;border-radius:15px;background:#fff;color:#4c5e76;font:inherit;font-size:14px;cursor:not-allowed;opacity:1}
    .auth-mobile-social-mark{display:block;flex:0 0 23px;width:23px;height:23px}
    .auth-mobile-social-button>span{font-weight:500;color:#27384e}
    .auth-mobile-social-note{text-align:center;font-size:10px;color:#9aa7b8;margin-top:2px}

}

@media(max-width:1023px) and (prefers-reduced-motion:no-preference){
    .login-container.auth-mobile-enter{animation:auth-mobile-login-enter .6s cubic-bezier(.22,1,.36,1) both}
}
@keyframes auth-mobile-login-enter{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}
