:root {
  --ohs-primary: #635bff;
  --ohs-primary-light: #7578ff;
  --ohs-primary-dark: #4e36f5;
  --ohs-text: #212636;
  --ohs-muted: #667085;
  --ohs-surface: #ffffff;
}

[data-md-color-scheme="default"] {
  --md-primary-fg-color: var(--ohs-primary);
  --md-primary-fg-color--light: var(--ohs-primary-light);
  --md-primary-fg-color--dark: var(--ohs-primary-dark);
  --md-accent-fg-color: var(--ohs-primary);
  --md-default-fg-color: var(--ohs-text);
  --md-default-fg-color--light: var(--ohs-muted);
}

[data-md-color-scheme="slate"] {
  --md-primary-fg-color: #7578ff;
  --md-primary-fg-color--light: #9ca7ff;
  --md-primary-fg-color--dark: #635bff;
  --md-accent-fg-color: #9ca7ff;
  --md-default-bg-color: #090a0b;
  --md-code-bg-color: #121517;
}

body,
input {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
}

.md-header,
.md-tabs {
  background: linear-gradient(120deg, #4e36f5, #635bff 58%, #7578ff);
}

.ohs-grid {
  display: grid;
  gap: 1rem;
  grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
  margin: 1.5rem 0 2rem;
}

.ohs-card {
  border: 1px solid var(--md-default-fg-color--lightest);
  border-radius: 0.75rem;
  color: inherit;
  display: block;
  padding: 1.15rem;
  transition: border-color 150ms ease, transform 150ms ease;
}

.ohs-card:hover,
.ohs-card:focus-visible {
  border-color: var(--md-accent-fg-color);
  transform: translateY(-2px);
}

.ohs-card strong {
  display: block;
  font-size: 1rem;
  margin-bottom: 0.35rem;
}

.ohs-card span {
  color: var(--md-default-fg-color--light);
  font-size: 0.85rem;
}

.md-typeset .md-button {
  border-radius: 0.5rem;
}

@media screen and (min-width: 76.25em) {
  .md-nav--primary > .md-nav__list > .md-nav__item--nested > .md-nav__link {
    color: var(--md-default-fg-color);
    font-weight: 700;
    margin-top: 0.35rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .ohs-card {
    transition: none;
  }
}