@charset "UTF-8";
/* Docs typescale mixin only — no CSS output, so it can be @used from scoped
   component styles (Markdoc.astro) without leaking the docs scale globally. */
.docs-scope {
  font-family: "Inter", sans-serif;
  --color-background-nav: rgba(250, 250, 248, 0.88);
  --color-background-docs-content: #ffffff;
  --icon-box-shadow:
    0px 0px 1px 0.5px rgba(0, 0, 0, 0.2),
    0px 0px 0px 0.75px rgba(0, 0, 0, 0.05), 0px 0.75px 0px 0px #fff inset,
    0px -1px 0px 0px rgba(0, 0, 0, 0.1) inset;
  --radial-background: radial-gradient(
    50% 50% at 50% 50%,
    rgba(0, 0, 0, 0) 0%,
    rgba(0, 0, 0, 0.04) 100%
  );
  --search-bar-box-shadow: 0px 0px 1px 0.5px rgba(0, 0, 0, 0.2);
  --card-box-shadow:
    0px 0px 0px 1px rgba(0, 0, 0, 0.08), 0px 2px 4px 0px rgba(0, 0, 0, 0.04);
  --badge-box-shadow:
    0px 0px 0px 1px rgba(0, 68, 204, 0.16), 0px 2px 4px 0px rgba(0, 0, 0, 0.04);
  --badge-box-shadow-hover:
    0px 0px 0px 1px rgba(0, 41, 122, 0.9), 0px 4px 8px 0px rgba(0, 0, 0, 0.16);
  --dropdown-box-shadow: 0px 8px 24px 0px rgba(82, 80, 74, 0.12);
  --button-box-shadow:
    rgba(0, 0, 0, 0.12) 0px 0px 0px 1px, rgba(0, 0, 0, 0.04) 0px 1px 2px 0px;
}

.dark .docs-scope {
  --color-background-nav: rgba(20, 20, 18, 0.88);
  --color-background-docs-content: #1b1b19;
  --icon-box-shadow:
    0px 0px 4px 0px rgba(0, 0, 0, 0.4),
    0px 0px 0px 0.75px rgba(255, 255, 255, 0.12),
    0px 0.75px 0px 0px rgba(255, 255, 255, 0.2) inset,
    0px -0.75px 0px 0px rgba(0, 0, 0, 0.12) inset;
  --radial-background: radial-gradient(
    50% 50% at 50% 50%,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 0.04) 100%
  );
  --search-bar-box-shadow:
    0px 0px 0px 1px rgba(255, 255, 255, 0.12),
    0px 2px 4px 0px rgba(0, 0, 0, 0.16);
  --card-box-shadow:
    0px 0px 1px 2px rgba(0, 0, 0, 0.24),
    0px 0px 0px 1px rgba(255, 255, 255, 0.2),
    0px 2px 2px 0px rgba(0, 0, 0, 0.24);
  --badge-box-shadow:
    0px 0px 0px 1px rgba(0, 68, 204, 0.5), 0px 2px 4px 0px rgba(0, 0, 0, 0.5);
  --badge-box-shadow-hover:
    0px 0px 0px 1px rgba(102, 143, 224, 0.6), 0px 4px 8px 0px rgba(0, 0, 0, 0.5);
  --dropdown-box-shadow: 0px 8px 24px 0px rgba(82, 80, 74, 0.12);
  --button-box-shadow:
    rgba(255, 255, 255, 0.2) 0px 0px 0px 1px,
    rgba(0, 0, 0, 0.16) 0px 2px 4px 0px;
}

:where(.docs-scope) h1,
:where(.docs-scope) h2,
:where(.docs-scope) .badge,
:where(.docs-scope) .title-2xl,
:where(.docs-scope) .title-xl,
:where(.docs-scope) .title-l,
:where(.docs-scope) .title-m,
:where(.docs-scope) .title-s,
:where(.docs-scope) .title-xs {
  font-style: normal;
  font-weight: 600;
}
:where(.docs-scope) h1,
:where(.docs-scope) .title-2xl {
  font-size: 32px;
  letter-spacing: -1.2px;
  line-height: 40px;
}
:where(.docs-scope) h2,
:where(.docs-scope) .title-xl {
  font-size: 24px;
  letter-spacing: -0.64px;
  line-height: 32px;
}
:where(.docs-scope) .title-l {
  font-size: 20px;
  letter-spacing: -0.24px;
  line-height: 28px;
}
:where(.docs-scope) .title-m {
  font-size: 16px;
  letter-spacing: 0.08px;
  line-height: 24px;
}
:where(.docs-scope) .title-s {
  font-size: 14px;
  letter-spacing: 0.08px;
  line-height: 20px;
}
:where(.docs-scope) .title-xs {
  font-size: 12px;
  letter-spacing: 0.07px;
  line-height: 16px;
}
:where(.docs-scope) h3,
:where(.docs-scope) h4,
:where(.docs-scope) .subtitle-2xl,
:where(.docs-scope) .subtitle-xl,
:where(.docs-scope) .subtitle-l,
:where(.docs-scope) .subtitle-m,
:where(.docs-scope) .subtitle-s,
:where(.docs-scope) .subtitle-xs {
  font-style: normal;
  font-weight: 500;
}
:where(.docs-scope) .subtitle-2xl {
  font-size: 32px;
  letter-spacing: -1.2px;
  line-height: 40px;
}
:where(.docs-scope) .subtitle-xl {
  font-size: 24px;
  letter-spacing: -0.64px;
  line-height: 32px;
}
:where(.docs-scope) h3,
:where(.docs-scope) .subtitle-l {
  font-size: 20px;
  letter-spacing: -0.24px;
  line-height: 28px;
}
:where(.docs-scope) h4,
:where(.docs-scope) .subtitle-m {
  font-size: 16px;
  letter-spacing: 0.08px;
  line-height: 24px;
}
:where(.docs-scope) .subtitle-s {
  font-size: 14px;
  letter-spacing: 0.08px;
  line-height: 20px;
}
:where(.docs-scope) .subtitle-xs {
  font-size: 12px;
  letter-spacing: 0.07px;
  line-height: 16px;
}
:where(.docs-scope) p,
:where(.docs-scope) small,
:where(.docs-scope) .body-2xl,
:where(.docs-scope) .body-xl,
:where(.docs-scope) .body-l,
:where(.docs-scope) .body-m,
:where(.docs-scope) .body-s,
:where(.docs-scope) .body-xs {
  font-style: normal;
  font-weight: 400;
}
:where(.docs-scope) .body-2xl {
  font-size: 32px;
  letter-spacing: -1.2px;
  line-height: 40px;
}
:where(.docs-scope) .body-xl {
  font-size: 24px;
  letter-spacing: -0.64px;
  line-height: 32px;
}
:where(.docs-scope) .body-l {
  font-size: 20px;
  letter-spacing: -0.24px;
  line-height: 28px;
}
:where(.docs-scope) p,
:where(.docs-scope) .body-m {
  font-size: 16px;
  letter-spacing: 0.08px;
  line-height: 24px;
}
:where(.docs-scope) small,
:where(.docs-scope) .body-s {
  font-size: 14px;
  letter-spacing: 0.08px;
  line-height: 20px;
}
:where(.docs-scope) .body-xs {
  font-size: 12px;
  letter-spacing: 0.07px;
  line-height: 16px;
}
:where(.docs-scope) em,
:where(.docs-scope) pre,
:where(.docs-scope) code,
:where(.docs-scope) .mono-m,
:where(.docs-scope) .mono-s,
:where(.docs-scope) .mono-xs {
  font-family: JetBrains Mono, monospace;
  font-style: normal;
  font-weight: 400;
}
:where(.docs-scope) .mono-m {
  font-size: 16px;
  letter-spacing: 0.08px;
  line-height: 24px;
}
:where(.docs-scope) pre,
:where(.docs-scope) code,
:where(.docs-scope) .mono-s {
  font-size: 14px;
  letter-spacing: 0.08px;
  line-height: 20px;
}
:where(.docs-scope) .mono-xs {
  font-size: 12px;
  letter-spacing: 0.07px;
  line-height: 16px;
}

.docs-scope .button:not(.button--primary, .button--secondary) {
  outline: none;
  border: none;
  border-radius: var(--s1);
  background-color: var(--bg-3);
  display: flex;
  align-items: center;
  gap: var(--s1);
  color: var(--neutral-fg-1);
  box-shadow: var(--icon-box-shadow);
  text-decoration: none;
}
.docs-scope .button:not(.button--primary, .button--secondary) svg,
.docs-scope .button:not(.button--primary, .button--secondary) path {
  fill: var(--neutral-fg-2) !important;
}
.docs-scope .button:not(.button--primary, .button--secondary) {
  font-size: inherit;
  line-height: inherit;
}

.docs-scope button:not(.button) {
  font-family: inherit;
  box-shadow: none;
}

.docs-scope main {
  overflow: visible;
}