@layer components {
  .docs-prose {
    max-width: 46rem;
    line-height: 1.65;
  }

  .docs-prose > * + * { margin-top: 1rem; }

  .docs-prose h1 { margin-bottom: 1.25rem; font-size: 1.75rem; line-height: 1.25; }
  .docs-prose h2 { margin-top: 2.25rem; font-size: 1.25rem; line-height: 1.3; }
  .docs-prose h3 { margin-top: 1.75rem; font-size: 1.0625rem; }
  .docs-prose h2[id],
  .docs-prose h3[id] { scroll-margin-top: 5rem; }

  .docs-prose p,
  .docs-prose li { color: var(--text-muted); }
  .docs-prose strong { color: var(--text); }

  .docs-prose a { color: var(--accent-text); text-decoration: underline; text-underline-offset: 0.15em; }
  .docs-prose a:hover { color: var(--text); }

  .docs-prose ul,
  .docs-prose ol { padding-left: 1.375rem; }
  .docs-prose li + li { margin-top: 0.375rem; }

  .docs-prose code {
    padding: 0.125rem 0.3125rem;
    border-radius: 0.25rem;
    background: var(--bg-code);
    font-family: "JetBrains Mono", monospace;
    font-size: 0.8125em;
  }

  .docs-prose pre {
    padding: 1rem;
    overflow-x: auto;
    border: 0.0625rem solid var(--border);
    border-radius: 0.5rem;
    background: var(--bg-code);
  }
  .docs-prose pre code { padding: 0; background: transparent; font-size: 0.8125rem; line-height: 1.6; }

  .docs-prose table { width: 100%; border-collapse: collapse; font-size: 0.875rem; }
  .docs-prose th,
  .docs-prose td { padding: 0.5rem 0.75rem; border: 0.0625rem solid var(--border); text-align: left; vertical-align: top; }
  .docs-prose th { background: var(--bg-raised); color: var(--text); font-weight: 600; }
  .docs-prose td { color: var(--text-muted); }

  .docs-prose blockquote {
    padding: 0.625rem 1rem;
    border-left: 0.1875rem solid var(--accent);
    border-radius: 0 0.375rem 0.375rem 0;
    background: var(--accent-soft);
  }
  .docs-prose blockquote p { color: var(--text); }

  .docs-prose hr { border: 0; border-top: 0.0625rem solid var(--border); }

  /* Wide tables scroll inside the prose column rather than the page. */
  .docs-prose .table-scroll { overflow-x: auto; }
}