:root {
  --md-primary-fg-color: #5f50e8;
  --md-accent-fg-color: #0d9488;
  --md-typeset-a-color: #5145cd;
}

[data-md-color-scheme="open-llm-light"] {
  --md-default-bg-color: #fbfbfe;
  --md-default-fg-color: #171a2b;
  --md-code-bg-color: #f1f0fa;
}

.md-typeset h1 {
  font-weight: 760;
  letter-spacing: -0.035em;
}

.md-typeset h2 {
  font-weight: 700;
  letter-spacing: -0.02em;
}

.md-typeset .hero {
  padding: 2.2rem;
  border: 1px solid color-mix(in srgb, var(--md-primary-fg-color) 24%, transparent);
  border-radius: 1.25rem;
  background: radial-gradient(circle at 85% 15%, rgba(24, 169, 153, .16), transparent 36%),
              linear-gradient(135deg, rgba(101, 87, 255, .12), transparent 55%);
}

.md-typeset .hero .md-button {
  margin: .3rem .4rem .3rem 0;
}

.md-typeset .signal {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr));
  gap: .75rem;
  margin: 1rem 0;
}

.md-typeset .signal > div {
  padding: 1rem;
  border: 1px solid var(--md-default-fg-color--lightest);
  border-radius: .8rem;
}

.mermaid {
  text-align: center;
}