body.login-page {
  --ink: #18272e;
  --muted: #708087;
  --line: #dfe8eb;
  --cyan: #148c7a;
  --lime: #22ad86;
  min-height: 100vh;
  color: var(--ink);
  background: #f4f8f8;
}

.login-page .login-shell {
  width: min(1180px, calc(100% - 48px));
  grid-template-columns: 1.05fr .95fr;
  gap: 64px;
  padding: 104px 0 58px;
}

.login-page .login-shell::before {
  background: radial-gradient(circle at 14% 22%, rgba(26, 170, 145, .10), transparent 25rem), radial-gradient(circle at 88% 72%, rgba(74, 168, 213, .10), transparent 27rem);
}

.login-page .login-brand {
  color: var(--ink);
}

.login-page .brand-mark {
  color: #fff;
  background: #18a88f;
  border-color: #18a88f;
  box-shadow: 0 10px 24px rgba(24, 168, 143, .18);
}

.login-page .brand-copy small { color: #829298; }
.login-page .brand-copy strong { color: var(--ink); }
.login-page .login-showcase { min-height: 590px; }
.login-page .login-showcase > span { color: #0f806f; }
.login-page .login-showcase h2 { color: var(--ink); }
.login-page .login-showcase h2 em {
  color: #148c7a;
  background: none;
  -webkit-text-fill-color: currentColor;
}

.login-page .login-console {
  border-color: #d6e7e3;
  background: #fff;
  box-shadow: 0 22px 55px rgba(34, 63, 72, .09);
}

.login-page .login-console-head { color: #7b8c92; }
.login-page .login-console-head i { box-shadow: 0 0 0 4px #dcf5ec; }
.login-page .login-product-card {
  border-color: #deeaed;
  background: radial-gradient(circle at 72% 25%, rgba(74, 168, 213, .13), transparent 8rem), #eff9f6;
  color: var(--ink);
}

.login-page .login-product-card small { color: #73858c; }
.login-page .product-orbit {
  border-color: rgba(24, 168, 143, .25);
  background: #18a88f;
  box-shadow: 0 16px 35px rgba(24, 168, 143, .19);
}

.login-page .product-orbit::before,
.login-page .product-orbit::after { border-color: rgba(24, 168, 143, .20); }
.login-page .login-product-stats div { border-color: #e1e9eb; background: #f8fbfb; }
.login-page .login-product-stats span { color: #819097; }
.login-page .login-product-stats b { color: #263940; }
.login-page .login-product-stats div:nth-child(2) b { color: #148c7a; }

.login-page .login-card {
  border-color: #dde8ea;
  background: rgba(255, 255, 255, .94);
  box-shadow: 0 24px 65px rgba(34, 63, 72, .10);
}

.login-page .login-card .eyebrow { color: #148c7a; }
.login-page .login-card h1 { color: var(--ink); }
.login-page .login-card label { color: #30434b; }
.login-page .key-input {
  border-color: #cfdbdf;
  background: #f9fbfc;
}

.login-page .key-input:focus-within {
  border-color: #18a88f;
  box-shadow: 0 0 0 4px rgba(24, 168, 143, .09);
}

.login-page .key-input input { color: var(--ink); }
.login-page .key-input button { color: #148c7a; }
.login-page .button-dark {
  border-color: #18a88f;
  background: #18a88f;
  color: #fff;
  box-shadow: 0 10px 24px rgba(24, 168, 143, .16);
}

.login-page .privacy-box {
  border-color: #d9e9e5;
  background: #f2faf8;
}

.login-page .privacy-box i { color: #148c7a; }
.login-page .privacy-box strong { color: #294039; }
.login-page .privacy-box p { color: #72827d; }
.login-page .login-links { border-color: #e1e8ea; }
.login-page .login-links a { color: #62747b; }
.login-page .form-error { color: #b3374b; background: #fff1f3; }

@media (max-width: 920px) {
  .login-page .login-shell { width: min(760px, calc(100% - 36px)); grid-template-columns: 1fr; gap: 28px; }
  .login-page .login-showcase { min-height: 0; }
}

@media (max-width: 560px) {
  .login-page .login-shell { width: calc(100% - 24px); padding-top: 90px; }
  .login-page .login-showcase h2 { font-size: 40px; }
}