/* Mobile-first login styling */
:root{--primary:#0d6efd;--bg:#f7f9fc;--card:#ffffff}
html,body{height:100%}
body{background:linear-gradient(180deg,#e9f2ff 0%,var(--bg) 100%);font-family:Inter,system-ui,Arial,sans-serif;margin:0;display:flex;align-items:center;justify-content:center;padding:24px}
.login-wrap{width:100%;max-width:420px}
.card{background:var(--card);border-radius:12px;box-shadow:0 6px 24px rgba(13,110,253,0.08);padding:20px}
.logo{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.logo .brand{font-weight:700;font-size:20px;color:var(--primary)}
.form-group{margin-bottom:12px}
label{display:block;margin-bottom:6px;font-size:13px;color:#333}
.form-control{width:100%;padding:10px 12px;border:1px solid #e6eef9;border-radius:8px;font-size:15px}
.btn-primary{background:var(--primary);color:#fff;border:none;padding:10px 14px;border-radius:8px;width:100%;font-weight:600}
.helper{display:flex;justify-content:space-between;margin-top:10px;font-size:13px}
.toggle-pass{background:transparent;border:none;color:var(--primary);cursor:pointer}
.small{font-size:13px;color:#666}
@media (max-width:420px){.card{padding:16px}}