/* Source reference: existing Dyadic tokens own every color, font and surface. */
[data-dev-page="reference"] .dev-lead { padding-top: 1.5rem; }
[data-dev-page="reference"] .dev-lead h1 { font-size: clamp(2rem, 3.5vw, 3.25rem) !important; }
[data-dev-page="reference"] .dev-lead > p:last-child { font-size: 1rem; max-width: 48rem; }
.doc-reference { margin-block: var(--spacing-padding-1rem-b8be0c7); }
.doc-toolbar { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 1rem; padding-block: 1rem; }
.doc-scopes { display: inline-flex; gap: .25rem; padding: .25rem; background: var(--panel); border: 1px solid var(--line); border-radius: var(--r-md); }
.doc-scopes a { display: inline-flex; align-items: center; justify-content: center; min-height: 2.5rem; padding: .5rem 1rem; border-radius: var(--r-sm); color: var(--muted); }
.doc-scopes a[aria-current] { color: var(--ink); background: var(--panel-strong); }
.doc-build { color: var(--dim); font-family: var(--font-mono); font-size: .75rem; }
.doc-shell { display: grid; grid-template-columns: minmax(220px, 26%) minmax(0, 1fr); border-top: 1px solid var(--line); }
.doc-sidebar { min-width: 0; padding: 1.5rem 1.25rem 1.5rem 0; border-right: 1px solid var(--line); position: sticky; top: 5rem; align-self: start; max-height: calc(100dvh - 6rem); overflow: auto; scrollbar-width: thin; }
.doc-search, .doc-filters label { display: grid; gap: .5rem; font-size: .75rem; font-weight: 600; color: var(--muted); }
.doc-search input, .doc-filters select, .doc-symbol-search { width: 100%; min-width: 0; padding: .75rem; border: 1px solid var(--line); border-radius: var(--r-md); background: var(--panel); color: var(--ink); font: inherit; }
.doc-search input { font-size: .875rem; }
.doc-filters { display: grid; grid-template-columns: minmax(0,1fr); gap: .5rem; margin-top: 1rem; }
.doc-filters select { padding: .5rem; font-size: .75rem; }
.doc-result-count, .doc-footnote { color: var(--dim); font-size: .8rem; line-height: 1.6; }
.doc-modules { display: grid; gap: .25rem; }
.doc-module { display: grid; gap: .25rem; padding: .75rem; border-radius: var(--r-md); border: 1px solid transparent; min-width: 0; }
.doc-module strong { font-family: var(--font-mono); font-size: .8rem; font-weight: 500; overflow-wrap: anywhere; }
.doc-module small { color: var(--muted); font-size: .7rem; overflow-wrap: anywhere; }
.doc-module:hover { background: var(--panel); }
.doc-module[aria-current] { background: var(--accent-surface); border-color: var(--line); }
.doc-content { min-width: 0; padding: 1.5rem 0 2rem 2rem; overflow-wrap: anywhere; }
.doc-content h2 { margin: .5rem 0 1rem; font-size: clamp(1.5rem, 3vw, 2.25rem); line-height: 1.2; letter-spacing: -.03em; }
.doc-meta { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem; color: var(--dim); font-size: .75rem; }
.doc-badge { padding: .2rem .5rem; border: 1px solid var(--line); border-radius: var(--r-sm); font-family: var(--font-mono); font-size: .7rem; color: var(--muted); }
.doc-summary { margin-block: 1.5rem; padding-bottom: 1rem; border-bottom: 1px solid var(--line); }
.doc-prose { color: var(--muted); line-height: 1.75; font-size: .9rem; }
.doc-prose p { margin-block: .65rem; white-space: normal; }
.doc-prose h3, .doc-prose h4 { color: var(--ink); margin-block: 1.5rem .5rem; font-size: 1rem; }
.doc-prose code { font-family: var(--font-mono); font-size: .85em; overflow-wrap: anywhere; }
.doc-prose pre { max-width: 100%; overflow: auto; padding: 1rem; border: 1px solid var(--line); border-radius: var(--r-md); background: var(--panel); white-space: pre; }
.doc-symbol-search { margin-block: 1rem; font-size: .875rem; }
.doc-symbol { padding-block: 1.5rem; border-bottom: 1px solid var(--line); scroll-margin-top: 6rem; }
.doc-symbol h3 { font-family: var(--font-mono); font-size: .95rem; font-weight: 600; margin: .5rem 0; overflow-wrap: anywhere; }
.doc-symbol-top { display: flex; align-items: center; justify-content: space-between; gap: .5rem; }
.doc-symbol-top a { min-width: 0; }
.doc-signature { position: relative; border: 1px solid var(--line); background: var(--panel); border-radius: var(--r-md); padding: 1rem; margin-block: 1rem; }
.doc-signature pre { margin: 0; padding-right: 2rem; white-space: pre-wrap; overflow-wrap: anywhere; font: .8rem/1.7 var(--font-mono); }
.doc-copy { display: inline-flex; align-items: center; justify-content: center; flex: none; width: 2.5rem; height: 2.5rem; padding: 0; border: 1px solid var(--line); border-radius: var(--r-md); background: var(--panel); color: var(--muted); cursor: pointer; }
.doc-copy svg { display: block; flex: none; }
.doc-signature .doc-copy { position: absolute; top: .5rem; right: .5rem; }
.doc-empty { padding: 2rem; border: 1px solid var(--line); border-radius: var(--r-lg); background: var(--panel); }
.doc-empty h2 { font-size: 1.5rem; }
.doc-empty p { color: var(--muted); }
.doc-table { width: 100%; border-collapse: collapse; font-size: .8rem; }
.doc-table th, .doc-table td { text-align: left; vertical-align: top; padding: .65rem .5rem; border-bottom: 1px solid var(--line); overflow-wrap: anywhere; }
.doc-table th { color: var(--muted); font-size: .7rem; font-weight: 600; }
.doc-table td:first-child { font-family: var(--font-mono); }
.doc-tablewrap { overflow-x: auto; }
.doc-browse { display: none; }
.doc-jump { display: flex; gap: .5rem; flex-wrap: wrap; margin-block: 1rem; }
.doc-jump a { font: .75rem var(--font-mono); color: var(--muted); border: 1px solid var(--line); border-radius: var(--r-sm); padding: .4rem .6rem; }
.doc-footnote { padding-block: 1.5rem; border-top: 1px solid var(--line); }
.doc-overview-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; margin-block: 2rem; }
.doc-overview-card { display: flex; flex-direction: column; align-items: flex-start; gap: .75rem; padding: 1.25rem; border: 1px solid var(--line); border-radius: var(--r-lg); background: var(--panel); min-width: 0; }
.doc-overview-card:hover { background: var(--panel-strong); }
.doc-overview-card h3 { margin: 0; color: var(--ink); font-size: 1.1rem; }
.doc-overview-card p { margin: 0; color: var(--muted); font: .7rem var(--font-mono); }
.doc-overview-card > span:last-child { color: var(--muted); font-size: .8rem; line-height: 1.65; }
.doc-content [hidden] { display: none !important; }
@media (max-width: 760px) {
  .doc-shell { grid-template-columns: minmax(0, 1fr); }
  .doc-sidebar { position: static; max-height: none; padding: 1rem 0; border-right: 0; border-bottom: 1px solid var(--line); }
  .doc-content { padding: 1.5rem 0; }
  .doc-filters { grid-template-columns: minmax(0,1fr) minmax(0,1fr); }
  .doc-modules { display: none; max-height: 22rem; overflow-y: auto; margin-top: .75rem; }
  .doc-sidebar.is-open .doc-modules { display: grid; }
  .doc-browse { display: inline-flex; width: 100%; margin-top: 1rem; }
  .doc-toolbar { align-items: flex-start; }
  .doc-empty { padding: 1.25rem; }
  .doc-overview-grid { grid-template-columns: minmax(0, 1fr); }
}

.doc-prose h5, .doc-prose h6 { color: var(--ink); margin-block: 1.25rem .5rem; font-size: .95rem; }
.doc-prose ul, .doc-prose ol { padding-inline-start: 1.5rem; margin-block: .75rem; }
.doc-prose li { margin-block: .35rem; }
.doc-prose blockquote { margin: 1rem 0; padding-inline-start: 1rem; border-inline-start: 2px solid var(--line); }
.doc-prose a { text-decoration: underline; text-underline-offset: .18em; }
.doc-prose .doc-table th, .doc-prose .doc-table td { min-width: 9rem; }
.doc-prose .doc-tablewrap { max-width: 100%; margin-block: 1rem; }
.doc-code { position: relative; min-width: 0; }
.doc-code pre { padding-top: 3.25rem; }
.doc-code .doc-copy { position: absolute; top: .5rem; right: .5rem; }