body.login-page {
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: 20px;
  background:
    radial-gradient(circle at 20% 10%, rgba(31,94,255,.25), transparent 32%),
    radial-gradient(circle at 80% 90%, rgba(20,132,95,.15), transparent 30%),
    #0d1524;
}
.login-card { width: min(410px, 100%); padding: 30px; }
.login-brand { text-align: center; margin-bottom: 28px; }
.login-brand .brand-mark { margin: 0 auto 12px; width: 52px; height: 52px; font-size: 25px; }
.login-brand h1 { margin: 0; font-size: 26px; letter-spacing: 1px; }
.login-brand p { margin: 7px 0 0; color: var(--muted); font-size: 13px; }
.login-form { display: grid; gap: 14px; }
.login-form .btn { width: 100%; padding: 12px; margin-top: 4px; }
.login-error { min-height: 18px; color: var(--danger); text-align: center; font-size: 12px; }
.login-note { color: var(--muted); font-size: 11px; text-align: center; margin-top: 18px; }