:root {
  color-scheme: light;
  font-synthesis: none;
}

body {
  min-width: 320px;
  min-height: 100vh;
  background: #f4f7fb;
}

.hero {
  color: #fff;
  background:
    radial-gradient(circle at 85% 20%, rgb(255 255 255 / 18%), transparent 22rem),
    linear-gradient(135deg, #0b3d91, #0d6efd);
}

.card {
  border-radius: 1rem;
}

.account-card {
  background: #fbfcfe;
  border-color: #dfe5ec !important;
}

.input-width {
  max-width: 24rem;
}

.result-highlight {
  color: #073b4c;
  background: linear-gradient(135deg, #dff7eb, #d9efff);
}

@media (max-width: 575.98px) {
  .display-5 {
    font-size: 2.25rem;
  }

  .display-6 {
    font-size: 1.85rem;
  }
}