:root {
  --orion-blue: #1976d2;
  --orion-night: #070b18;
  --orion-ink: #101a2f;
  --orion-gold: #e7bf6b;
}

[data-md-color-scheme="slate"] {
  --md-default-bg-color: var(--orion-night);
  --md-default-fg-color: #dce8fb;
  --md-default-fg-color--light: #a9bdd8;
  --md-primary-fg-color: #0d1428;
  --md-primary-bg-color: #f4f7ff;
  --md-accent-fg-color: #79b8ff;
  --md-typeset-a-color: #9dcbff;
  --md-code-bg-color: #0d1428;
}

[data-md-color-scheme="default"] {
  --md-primary-fg-color: var(--orion-ink);
  --md-primary-bg-color: #f5f8ff;
  --md-accent-fg-color: var(--orion-blue);
}

/* Material's active navigation token follows the dark primary color above.
   That is correct for the header, but unreadable on Orion's dark sidebar. */
[data-md-color-scheme="slate"] .md-nav__link--active,
[data-md-color-scheme="slate"] .md-nav__item--active > .md-nav__link {
  color: var(--md-accent-fg-color);
}

[data-md-color-scheme="slate"] .md-nav__link:hover,
[data-md-color-scheme="slate"] .md-nav__link:focus-visible {
  color: #b9d9ff;
}

[data-md-color-scheme="slate"] .md-nav__title {
  color: var(--md-default-fg-color);
}

.md-header__title,
.md-nav__title,
.md-typeset h1,
.md-typeset h2,
.md-typeset h3 {
  letter-spacing: -0.02em;
}

.md-typeset h1 {
  font-weight: 700;
}

.md-typeset h2 {
  border-bottom: 1px solid color-mix(in srgb, var(--md-default-fg-color) 16%, transparent);
  padding-bottom: 0.35rem;
}

.md-typeset .orion-hero {
  background: radial-gradient(circle at 82% 10%, rgba(76, 157, 255, 0.22), transparent 28%),
    linear-gradient(135deg, rgba(21, 38, 79, 0.96), rgba(7, 11, 24, 0.98));
  border: 1px solid rgba(121, 184, 255, 0.35);
  border-radius: 0.8rem;
  color: #edf5ff;
  margin: 0 0 2rem;
  padding: clamp(1.2rem, 4vw, 2.4rem);
}

.md-typeset .orion-hero h1,
.md-typeset .orion-hero h2,
.md-typeset .orion-hero p {
  border: 0;
  color: inherit;
}

.md-typeset .orion-hero h1 {
  margin-top: 0;
}

.md-typeset .orion-hero .orion-kicker {
  color: #9dcbff;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.md-typeset .orion-card-grid {
  display: grid;
  gap: 1rem;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr));
  margin: 1.2rem 0 2rem;
}

.md-typeset .orion-card {
  border: 1px solid color-mix(in srgb, var(--md-default-fg-color) 20%, transparent);
  border-radius: 0.65rem;
  padding: 1rem;
}

.md-typeset .orion-card h3 {
  margin-top: 0;
}

.md-typeset .orion-card p:last-child {
  margin-bottom: 0;
}

.md-typeset .orion-status {
  border-left: 0.25rem solid var(--orion-gold);
  padding-left: 0.9rem;
}

.md-typeset code {
  overflow-wrap: anywhere;
}

@media (max-width: 700px) {
  .md-typeset .orion-hero {
    padding: 1.1rem;
  }
}
