:root {
  --md-primary-fg-color: #111111;
  --md-primary-fg-color--light: #333333;
  --md-primary-fg-color--dark: #000000;
  --md-accent-fg-color: #3b3b3b;
}
[data-md-color-scheme="slate"] {
  --md-primary-fg-color: #111111;
  --md-accent-fg-color: #c9c9c9;
}

/* GitBook content-ref cards */
a.content-ref {
  display: block;
  padding: 0.6em 0.9em;
  margin: 0.6em 0;
  border: 1px solid var(--md-default-fg-color--lightest);
  border-radius: 0.3rem;
  font-weight: 500;
  text-decoration: none;
}
a.content-ref:hover {
  border-color: var(--md-accent-fg-color);
  background: var(--md-code-bg-color);
}
a.content-ref .twemoji {
  margin-right: 0.35em;
}

/* GitBook figures */
.md-typeset figure {
  margin: 1em 0;
}
.md-typeset figure img {
  border: 1px solid var(--md-default-fg-color--lightest);
  border-radius: 0.3rem;
}
.md-typeset figcaption:empty {
  display: none;
}

/* Embedded video */
.video {
  position: relative;
  padding-bottom: 56.25%;
  height: 0;
  margin: 1em 0;
}
.video iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
  border-radius: 0.3rem;
}

/* Home page cards */
.home-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr));
  gap: 0.8rem;
  margin: 1.2rem 0;
}
.home-grid a {
  display: block;
  padding: 0.9rem 1rem;
  border: 1px solid var(--md-default-fg-color--lightest);
  border-radius: 0.4rem;
  text-decoration: none;
  color: var(--md-default-fg-color);
}
.home-grid a:hover {
  border-color: var(--md-default-fg-color--light);
  background: var(--md-code-bg-color);
}
.home-grid a strong {
  display: block;
  margin-bottom: 0.25rem;
}
.home-grid a span {
  font-size: 0.8rem;
  color: var(--md-default-fg-color--light);
}
.home-grid > p {
  margin: 0;
  display: flex;
}
.home-grid > p > a {
  flex: 1;
}