/* -- LOGIN -- */
#loginScreen{
  position:fixed;inset:0;z-index:9000;
  background:linear-gradient(135deg,#0f4c9e,#1a73e8 60%,#4285f4);
  display:flex;align-items:center;justify-content:center;padding:16px;
}
.lcard{
  background:white;border-radius:20px;padding:32px 28px;
  width:100%;max-width:360px;
  box-shadow:0 32px 80px rgba(0,0,0,.3);text-align:center;
  animation:popUp .4s cubic-bezier(.34,1.56,.64,1);
}
.login-theme-wrap{display:flex;justify-content:flex-end;margin-bottom:8px}
.login-theme-btn{border:1px solid var(--g2);background:linear-gradient(180deg,#ffffff,#f3f4f6);color:var(--dark);border-radius:999px;padding:4px 8px 4px 10px;font:700 .78rem 'Inter',sans-serif;display:inline-flex;align-items:center;gap:8px;cursor:pointer;min-width:82px;justify-content:space-between;box-shadow:inset 0 1px 1px rgba(255,255,255,.8)}
.login-theme-btn #loginThemeIco{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;border-radius:50%;background:#fff;border:1px solid #dbe0e6;box-shadow:0 1px 3px rgba(0,0,0,.12);font-size:.72rem}
.login-theme-btn:hover{border-color:var(--blue)}
body.dark-mode #loginScreen{background:linear-gradient(135deg,#081326,#0f274a 60%,#1f3b64)}
body.dark-mode .login-theme-btn{background:linear-gradient(180deg,#0f172a,#0b1220);color:#e5e7eb;border-color:#334155}
body.dark-mode .login-theme-btn #loginThemeIco{background:#f8fafc;border-color:#cbd5e1;color:#0f172a}
@keyframes popUp{from{transform:scale(.85) translateY(20px);opacity:0}to{transform:scale(1);opacity:1}}
.l-logo{font-size:1.9rem;font-weight:800;color:var(--blue);letter-spacing:-.5px;margin-bottom:2px}
.l-logo span{color:var(--orange)}
.l-tag{font-size:.72rem;color:var(--g3);margin-bottom:20px}
.lstep{display:none}.lstep.active{display:block}
.l-icon{font-size:2rem;margin-bottom:7px}
.l-title{font-size:1rem;font-weight:700;margin-bottom:3px}
.l-sub{font-size:.76rem;color:var(--g4);margin-bottom:16px;line-height:1.5}
.utype-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-bottom:13px}
.utype{padding:14px 8px;border:2px solid var(--g2);border-radius:var(--rl);cursor:pointer;transition:all .2s;background:white;text-align:center;-webkit-tap-highlight-color:transparent}
.utype:hover,.utype.sel{border-color:var(--blue);background:var(--blue-lt)}
.utype .ui{font-size:1.6rem;margin-bottom:4px}.utype .ut{font-size:.78rem;font-weight:700}.utype .us{font-size:.64rem;color:var(--g4);margin-top:1px}
.phone-row{display:flex;gap:7px;margin-bottom:10px}
.cc{background:var(--g1);border:1.5px solid var(--g2);border-radius:var(--r);padding:0 9px;font-size:.85rem;font-weight:600;width:68px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.l-input{width:100%;padding:11px 13px;border:1.5px solid var(--g2);border-radius:var(--r);font-family:'Inter',sans-serif;font-size:1rem;outline:none;transition:border-color .2s;text-align:center;letter-spacing:1px}
.l-input:focus{border-color:var(--blue)}
.l-btn{width:100%;padding:12px;background:var(--blue);color:white;border:none;cursor:pointer;border-radius:var(--r);font-family:'Inter',sans-serif;font-size:.9rem;font-weight:700;transition:all .2s;margin-top:2px;-webkit-tap-highlight-color:transparent}
.l-btn:hover{background:var(--blue-dk)}.l-btn:disabled{background:var(--g3);cursor:not-allowed}
.l-err{font-size:.74rem;color:var(--red);margin-top:6px;min-height:15px}
.otp-row{display:flex;gap:8px;justify-content:center;margin-bottom:12px}
.obox{width:44px;height:52px;border:2px solid var(--g2);border-radius:var(--r);text-align:center;font-size:1.3rem;font-weight:700;outline:none;transition:border-color .2s;font-family:'Inter',sans-serif;-moz-appearance:textfield;-webkit-appearance:none}
.obox::-webkit-inner-spin-button,.obox::-webkit-outer-spin-button{-webkit-appearance:none}
.obox:focus{border-color:var(--blue)}.obox.filled{border-color:var(--blue);background:var(--blue-lt)}
.demo-box{background:var(--blue-lt);border-left:3px solid var(--blue);border-radius:5px;padding:8px 10px;font-size:.72rem;color:var(--blue);margin-bottom:11px;text-align:left;display:none}
.resend{font-size:.73rem;color:var(--blue);cursor:pointer;margin-top:6px;display:inline-block;text-decoration:underline}
.resend.off{color:var(--g3);cursor:default;text-decoration:none}
.back{font-size:.73rem;color:var(--g4);cursor:pointer;margin-top:8px;display:inline-block;-webkit-tap-highlight-color:transparent}
.back:hover{color:var(--blue)}
.admin-link{font-size:.7rem;color:var(--g3);margin-top:10px}
.admin-link span{color:var(--blue);cursor:pointer;text-decoration:underline}