/* ---------- 登录页 ---------- */
.login-body{
  min-height:100vh;display:grid;place-items:center;padding:32px 20px;
  background:linear-gradient(160deg,#f2f5f8 0%,#e8edf3 55%,#e3eaf1 100%);
}
.login-wrap{
  width:100%;max-width:1000px;display:grid;grid-template-columns:1fr 1fr;
  background:#fff;border-radius:18px;overflow:hidden;
  box-shadow:0 20px 60px rgba(16,24,40,.12),0 2px 8px rgba(16,24,40,.06);
}
@media(max-width:820px){.login-wrap{grid-template-columns:1fr}.login-side{display:none}}

/* --- 左：登录表单 --- */
.login-card{padding:42px 44px}
.login-brand{display:flex;align-items:center;gap:13px;margin-bottom:32px}
.logo.lg{width:44px;height:44px;font-size:15px;border-radius:11px}
.login-brand h1{font-size:18px;letter-spacing:-.01em}
.login-brand .sub{font-size:12.5px;color:var(--muted);margin-top:2px}

.lf{display:block;margin-bottom:16px}
.lf-label{display:block;font-size:12.5px;color:var(--muted);font-weight:500;margin-bottom:6px}
.lf input[type=text],.lf input[type=password]{
  width:100%;border:1px solid var(--line);border-radius:9px;padding:11px 13px;font-size:14px;background:#fff;
  transition:.15s;
}
.lf input:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-soft)}
.lf input::placeholder{color:var(--faint)}
.lf-pw{position:relative}
.lf-pw input{padding-right:56px}
.pw-toggle{
  position:absolute;right:6px;top:50%;transform:translateY(-50%);
  border:0;background:transparent;color:var(--muted);font-size:12.5px;
  cursor:pointer;padding:5px 9px;border-radius:6px;
}
.pw-toggle:hover{color:var(--brand);background:var(--brand-soft)}

.lf-row{display:flex;justify-content:space-between;align-items:center;margin:4px 0 18px;flex-wrap:wrap;gap:8px}
.lf-link{font-size:12.5px;color:var(--muted);text-decoration:none}
.lf-link:hover{color:var(--brand);text-decoration:underline}

.lf-error{
  background:var(--danger-soft);color:var(--danger);border-radius:8px;padding:10px 13px;
  font-size:13px;margin-bottom:15px;display:flex;gap:8px;align-items:flex-start;line-height:1.6;
}
.lf-error::before{content:"!";font-weight:700;flex-shrink:0;width:16px;height:16px;border-radius:50%;
  background:var(--danger);color:#fff;display:grid;place-items:center;font-size:11px;margin-top:2px}

.btn-login{width:100%;padding:12px;font-size:15px;font-weight:600;letter-spacing:.08em}
.btn-login:disabled{opacity:.6;cursor:wait}

.login-foot{margin-top:26px;padding-top:20px;border-top:1px solid var(--line-soft)}
.lf-hint{font-size:12px;color:var(--faint);line-height:1.7}
.lf-hint b{color:var(--muted)}
.lf-roles{display:flex;gap:7px;margin-top:11px;flex-wrap:wrap}
.role-chip{font-size:11.5px;padding:3px 10px;border-radius:14px;font-weight:500}
.role-chip.admin{background:#EEEDFE;color:#534AB7}
.role-chip.operator{background:#E6F1FB;color:#185FA5}
.role-chip.viewer{background:#F1EFE8;color:#5F5E5A}

/* --- 右：价值说明 --- */
.login-side{
  background:#1a2b3d;padding:42px 40px;color:#fff;
  display:flex;flex-direction:column;justify-content:center;
}
@media(max-width:820px){.login-side{display:none}}
.login-side h2{font-size:20px;font-weight:600;line-height:1.5;margin-bottom:26px;letter-spacing:-.01em}
.ls-list{list-style:none;display:flex;flex-direction:column;gap:18px}
.ls-list li{display:flex;gap:13px;align-items:flex-start}
.ls-num{
  width:24px;height:24px;border-radius:50%;background:rgba(255,255,255,.14);
  color:#fff;display:grid;place-items:center;font-size:12px;font-weight:600;flex-shrink:0;margin-top:1px;
}
.ls-list b{font-size:13.5px;font-weight:500;display:block;margin-bottom:2px}
.ls-list p{font-size:12.5px;color:rgba(255,255,255,.62);line-height:1.6}
.ls-foot{
  display:flex;gap:26px;margin-top:32px;padding-top:22px;
  border-top:1px solid rgba(255,255,255,.12);
}
.ls-stat{font-size:12px;color:rgba(255,255,255,.6)}
.ls-stat b{display:block;font-size:20px;color:#fff;font-weight:600;margin-bottom:1px;
  font-variant-numeric:tabular-nums}