/* The latest supplied mobile screenshot governs the login page only. */
body.login-mode{background:#fff;color:#282624;font-size:12px}
.login-mode .scene{background:#fff;min-height:100svh;width:100%;max-width:100vw;overflow-x:hidden;padding:0 0 42px}
.login-mode .auth-area{min-height:0}
.login-shell{width:min(100%,420px);min-width:320px;max-width:420px;margin:0 auto;padding-top:60px}
.login-header{display:flex;align-items:center;justify-content:center;height:55px;margin-bottom:49px}
.login-header img{display:block;width:149px;height:58px;object-fit:contain}
.login-card{width:calc(100% - 16px);margin:0 8px;padding:18px 20px 17px;background:#fff;border:1px solid #f8f8f6;border-radius:4px;box-shadow:0 14px 24px rgba(50,48,42,.055)}
.transfer-notice{display:flex;align-items:center;gap:12px;min-height:63px;border:1px solid #eef0c8;border-radius:2px;background:#fffff4;padding:9px 12px;margin-bottom:27px;box-shadow:inset 0 0 11px rgba(231,232,184,.1)}
.transfer-notice .icon{color:#916b21;width:32px;height:32px;flex-shrink:0;stroke-width:1.8}
.transfer-notice p{margin:0;color:#9a9872;font-size:12px;font-weight:400;line-height:1.5;text-align:right}
.login-form .form-field{margin:0 0 18px}
.login-form .form-field:nth-child(2){margin-bottom:0}
.login-form .form-field label{font-size:12px;font-weight:500;color:#292724;line-height:20px;margin:0 0 4px}
.login-form .form-field input{height:40px;font-size:11px;font-weight:400;padding:0 10px;border:1px solid #e8e8e5;border-radius:2px;background:#fff;box-shadow:0 1px 4px #f5f5f3;color:#55534f}
.login-form .form-field input::placeholder{color:#85837e;opacity:1}
.login-form .form-field input.invalid{border-color:#cc6d66;background:#fffafa}
.login-verification.verification{height:54px;width:255px;max-width:100%;margin:0 0 0 auto;padding:5px 7px;background:#30302e;font-size:12px}
.login-verification .verification-result{gap:6px}
.login-verification .checkmark{width:25px;height:25px;border:3px dotted #608578}
.login-verification.verified .checkmark{border:0;font-size:18px;width:24px;height:24px}
.login-verification .cloudflare-logo{width:74px;height:39px;object-fit:contain}
.login-submit.button{height:40px;width:100%;margin-top:34px;padding:0 15px;border-radius:5px;font-size:12px;font-weight:400;background:#262322;border-color:#262322}
.login-switch{margin:23px 0 0;font-size:12px;font-weight:400;text-align:center;line-height:22px;color:#99958e;white-space:nowrap}
.login-switch a{color:#272521}
.login-switch a:hover{text-decoration:underline}
.login-copyright{margin:18px 0 0;font-size:12px;font-weight:400;text-align:center;line-height:24px;color:#97958e}
.approval-card{text-align:center;padding:28px 25px 25px;min-height:260px}
.approval-mark{width:58px;height:58px;margin:3px auto 17px;display:grid;place-items:center;border-radius:50%;background:#f8f3df;color:#a87829;font-size:29px;line-height:1}
.approval-mark.approval-rejected{background:#fae9e7;color:#b45b59;font-family:Arial,sans-serif;font-size:36px}
.approval-card h1{margin:0 0 12px;color:#2b2926;font-size:18px;font-weight:600}
.approval-card p{margin:0 auto;color:#8b877e;font-size:12px;line-height:1.9;max-width:300px}
.approval-card small{display:block;margin-top:17px;color:#aaa59c;font-size:10px}
.approval-loader{display:flex;justify-content:center;gap:5px;margin-top:21px}
.approval-loader span{width:7px;height:7px;border-radius:50%;background:#aaa36b;animation:approval-pulse 1.2s infinite ease-in-out}
.approval-loader span:nth-child(2){animation-delay:.15s}.approval-loader span:nth-child(3){animation-delay:.3s}
.approval-refresh{display:flex;align-items:center;justify-content:center;margin:16px auto 0;min-height:38px;padding:0 18px;border:1px solid #d8d4e7;border-radius:5px;background:#fff;color:#625d91;font-size:12px}
.approval-refresh:hover{background:#f5f3fb;border-color:#bdb8da}
.approval-back{display:flex;align-items:center;justify-content:center;text-decoration:none;margin-top:22px}
@keyframes approval-pulse{0%,80%,100%{opacity:.3;transform:scale(.8)}40%{opacity:1;transform:scale(1)}}
.login-mode .demo-notice{background:#fffefc;color:#948f84;font-size:9px;bottom:0;padding:5px 8px;border-top:1px solid #f4f2ed}
.login-mode .demo-notice button{color:#6e695e;font-size:9px}
.login-mode #demo-code{color:#6e695e}
.login-mode .toast{position:fixed;top:20px;width:300px;padding:12px;font-size:11px}
.login-mode .toast-status{width:15px;height:15px}
.login-mode .toast button{font-size:17px;top:10px;left:10px}
@media(max-width:350px){
  .login-shell{width:100%;min-width:0;padding-top:40px}
  .login-header{margin-bottom:36px}
  .login-card{padding-left:16px;padding-right:16px}
  .transfer-notice{gap:8px;padding:9px 8px}
  .transfer-notice p{font-size:11px}
  .notice-break{display:none}
  .login-switch{font-size:11px}
}
@media(max-width:700px){
  html,body{width:100%;min-width:320px;max-width:100%;overflow-x:hidden;overscroll-behavior-x:none;-webkit-text-size-adjust:100%;}
  .login-mode .auth-area{width:100%;max-width:100vw;overflow-x:hidden}
  .login-mode .auth-card{max-width:420px}
}
@media(min-width:701px){
  .login-shell{padding-top:72px}
}