#login{min-height:100vh;display:grid;place-items:center;padding:var(--s5);}
.login-card{
  width:100%;max-width:404px;background:var(--surface);border:1px solid var(--line);
  border-radius:var(--r-lg);box-shadow:var(--sh-lg);overflow:hidden;
  animation:fadeUp .5s var(--ease-out);
}
.login-hero{
  padding:var(--s6) var(--s6) var(--s5);position:relative;overflow:hidden;
  border-bottom:1px solid var(--line-soft);
}
.login-hero::after{
  content:'';position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(400px 200px at 80% -20%, var(--accent-glow), transparent 70%);
}
.login-hero .brand{padding:0 0 var(--s2);}
.login-hero .brand b,.login-hero .brand i{font-size:32px;}
.login-sub{font-family:var(--f-mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);}
.login-body{padding:var(--s5) var(--s6) var(--s6);}
.login-foot{
  padding:var(--s3) var(--s6);border-top:1px solid var(--line-soft);background:var(--surface-2);
  display:flex;justify-content:space-between;align-items:center;
  font-family:var(--f-mono);font-size:10.5px;color:var(--faint);
}
.login-count{color:var(--accent);}