@media (width >= 64rem) {
  #nd-docs-layout {
    --fd-sidebar-width: 17.5rem;
  }
}

@media (width >= 80rem) {
  #nd-docs-layout {
    --fd-toc-width: 15rem;
  }
}

@media (width >= 64rem) {
  #docs-band [data-mobile-search], #docs-band button[aria-label="Open Search"], #docs-band button[aria-label="Search"], #nd-docs-layout > [style*="grid-area:tabs"], #nd-docs-layout > [class*="[grid-area:tabs]"] {
    display: none;
  }

  #nd-sidebar [data-radix-scroll-area-viewport] > p, #nd-sidebar-mobile [data-radix-scroll-area-viewport] > p {
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--color-fd-muted-foreground);
    margin-top: 1.6rem;
    margin-bottom: .35rem;
    font-size: .75rem;
    font-weight: 600;
  }

  #nd-sidebar a, #nd-sidebar-mobile a {
    border-radius: .5rem;
  }

  #nd-sidebar a[data-active="true"], #nd-sidebar-mobile a[data-active="true"] {
    background-color: color-mix(in oklab,
            var(--color-fd-primary) 12%,
            transparent);
    color: var(--color-fd-primary);
    box-shadow: inset 2px 0 0 var(--color-fd-primary);
    font-weight: 600;
  }

  #nd-toc {
    font-size: .875rem;
  }

  #nd-toc a[data-active="true"] {
    color: var(--color-fd-primary);
  }
}

@media (width <= 63.9375rem) {
  #nd-page {
    padding-inline: 1.15rem;
    padding-bottom: 3rem;
  }

  #nd-page .prose {
    font-size: 1rem;
    line-height: 1.72;
  }

  #nd-page .prose :is(h2, h3, h4):not(:where(.not-prose *)) {
    margin-top: 2.2rem;
  }

  #nd-page .prose :is(th, td) {
    padding: .55rem .6rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  #nd-page .prose a:not([data-card]) {
    transition: none;
  }
}

:root {
  --bhai-content-width: 46rem;
  --bhai-shell-width: 104rem;
}

#nd-docs-layout {
  --fd-layout-width: var(--bhai-shell-width);
  max-inline-size: var(--bhai-shell-width);
}

@media (width >= 64rem) {
  #nd-docs-layout {
    --fd-sidebar-width: 17.5rem;
  }
}

@media (width >= 80rem) {
  #nd-docs-layout {
    --fd-toc-width: 15rem;
  }
}

#nd-page {
  max-width: var(--bhai-content-width);
  padding-inline: clamp(1.25rem, 3vw, 2.5rem);
  gap: 1.25rem;
  margin-inline: auto;
  padding-top: clamp(1.75rem, 3vw, 2.75rem);
}

#nd-page .prose {
  letter-spacing: -.003em;
  font-size: 1.0625rem;
  line-height: 1.78;
}

#nd-page .prose :is(p, ul, ol):not(:where(.not-prose *)) {
  margin-block: 1.1rem;
}

#nd-page .prose li:not(:where(.not-prose *)) {
  margin-block: .45rem;
  padding-inline-start: .15rem;
}

#nd-page .prose li > p:not(:where(.not-prose *)) {
  margin-block: .35rem;
}

#nd-page .prose :is(ul, ol) :is(ul, ol):not(:where(.not-prose *)) {
  margin-block: .5rem;
  margin-inline-start: 1.1rem;
}

#nd-page .prose :is(h2, h3, h4):not(:where(.not-prose *)) {
  text-wrap: balance;
  margin-top: 2.9rem;
  margin-bottom: .75rem;
}

#nd-page .prose h2:not(:where(.not-prose *)) {
  border-top: 1px solid
        color-mix(in oklab, var(--color-fd-border) 70%, transparent);
  padding-top: 1.9rem;
}

#nd-page .prose h3:not(:where(.not-prose *)) {
  margin-top: 2.1rem;
}

#nd-page .prose > :first-child:not(:where(.not-prose *)) {
  margin-top: 0;
}

#nd-page .prose :is(h2, h3) + :is(p, ul, ol, table, figure):not(:where(.not-prose *)) {
  margin-top: .6rem;
}

#nd-page [data-description], #nd-page .prose > p:first-of-type {
  color: var(--color-fd-muted-foreground);
  font-size: 1.0625rem;
  line-height: 1.7;
}

#nd-page article h1 {
  letter-spacing: -.025em;
  text-wrap: balance;
  margin-bottom: .35rem;
  font-size: clamp(2rem, 3.4vw, 2.65rem);
  line-height: 1.15;
}

#nd-page .prose a:not([data-card]):not(:where(.not-prose *)):not(:has( > div)) {
  color: var(--color-fd-primary);
  border-bottom: 1px solid
        color-mix(in oklab, var(--color-fd-primary) 35%, transparent);
  text-decoration: none;
  transition: border-color .15s, color .15s;
}

#nd-page .prose a:not([data-card]):not(:where(.not-prose *)):hover {
  border-bottom-color: var(--color-fd-primary);
}

#nd-page .prose figure.shiki, #nd-page .prose > pre {
  border-radius: .75rem;
  margin-block: 1.5rem;
}

#nd-page .prose figure.shiki pre, #nd-page .prose > pre {
  font-size: .875rem;
  line-height: 1.65;
}

#nd-page .prose table {
  width: 100%;
  margin-block: 1.5rem;
  font-size: .9375rem;
}

#nd-page .prose :is(th, td) {
  vertical-align: top;
  padding: .7rem .95rem;
}

#nd-page .prose th {
  letter-spacing: .01em;
  white-space: nowrap;
  font-size: .8125rem;
  font-weight: 600;
}

#nd-page .prose :is(svg, [data-mermaid], [data-mermaid] svg) {
  max-width: 100%;
}

#nd-page .prose figure:not(:where(.not-prose *)):has( > svg) {
  justify-content: center;
  margin-block: 1.75rem;
  display: flex;
}

#nd-page .prose figure:has( > svg) > svg, #nd-page .prose [data-mermaid] svg[id^="mermaid"] {
  width: 100%;
  max-width: 100%;
  height: auto;
}

#nd-page .prose :has( > [data-callout]), #nd-page .prose [data-callout] {
  margin-block: 1.5rem;
}

@media (width >= 64rem) {
  #docs-band [data-mobile-search], #docs-band button[aria-label="Open Search"], #docs-band button[aria-label="Search"], #nd-docs-layout > [style*="grid-area:tabs"], #nd-docs-layout > [class*="[grid-area:tabs]"] {
    display: none;
  }

  #nd-sidebar [data-radix-scroll-area-viewport] > p, #nd-sidebar-mobile [data-radix-scroll-area-viewport] > p {
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--color-fd-muted-foreground);
    margin-top: 1.6rem;
    margin-bottom: .35rem;
    font-size: .75rem;
    font-weight: 600;
  }

  #nd-sidebar a, #nd-sidebar-mobile a {
    border-radius: .5rem;
  }

  #nd-sidebar a[data-active="true"], #nd-sidebar-mobile a[data-active="true"] {
    background-color: color-mix(in oklab,
            var(--color-fd-primary) 12%,
            transparent);
    color: var(--color-fd-primary);
    box-shadow: inset 2px 0 0 var(--color-fd-primary);
    font-weight: 600;
  }

  #nd-toc {
    font-size: .875rem;
  }

  #nd-toc a[data-active="true"] {
    color: var(--color-fd-primary);
  }
}

@media (width <= 63.9375rem) {
  #nd-page {
    padding-inline: 1.15rem;
    padding-bottom: 3rem;
  }

  #nd-page .prose {
    font-size: 1rem;
    line-height: 1.72;
  }

  #nd-page .prose :is(h2, h3, h4):not(:where(.not-prose *)) {
    margin-top: 2.2rem;
  }

  #nd-page .prose :is(th, td) {
    padding: .55rem .6rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  #nd-page .prose a:not([data-card]) {
    transition: none;
  }
}