.login-page {
  display: grid;
  min-height: calc(100vh - 180px);
  place-items: center;
  padding: 4rem 1rem;
  background: radial-gradient(circle at 80% 10%, #e5e2ff, transparent 28%), var(--paper);
}

.login-card {
  width: min(100%, 480px);
  padding: clamp(1.5rem, 5vw, 2.5rem);
  border: 1px solid var(--line);
  border-radius: 18px;
  background: var(--surface);
  box-shadow: 0 20px 45px #14213d12;
}

.login-card h1 {
  margin: .45rem 0 .8rem;
  font-size: clamp(2rem, 5vw, 3rem);
  letter-spacing: -.05em;
  line-height: 1;
}

.login-card > p:not(.eyebrow) {
  color: var(--muted);
}

.login-card .btn {
  width: 100%;
  margin-top: .5rem;
}

.login-links {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  margin-top: 1.2rem;
  font-size: .92rem;
}

.login-links a {
  color: var(--violet);
  font-weight: 700;
}

@media (max-width: 450px) {
  .login-links { flex-direction: column; }
}