/* The API reference page: the top bar, and a few fixes to Scalar's own layout. */
:root { --dy-ref-bar: calc(48px + env(safe-area-inset-top, 0px)); --scalar-custom-header-height: var(--dy-ref-bar); }
.dev-ref-page { margin: 0; background: var(--paper); }
.dev-ref-bar { position: sticky; top: 0; z-index: 30; box-sizing: border-box; height: var(--dy-ref-bar); display: flex; align-items: center; gap: .9rem; flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; white-space: nowrap; padding: env(safe-area-inset-top, 0px) clamp(.8rem, 3vw, 1.4rem) 0; background: color-mix(in srgb, var(--paper) 95%, transparent); border-bottom: 1px solid var(--line); font: 14px/1.4 var(--font-ui); }
.dev-ref-bar::-webkit-scrollbar { display: none; }
.dev-ref-bar a { flex: none; color: var(--muted); text-decoration: none; }
.dev-ref-bar a:hover, .dev-ref-bar a[aria-current="page"] { color: var(--accent); }
.dev-ref-bar__brand { display: inline-flex; align-items: center; gap: .5rem; color: var(--ink) !important; font-weight: 800; margin-right: auto; }
.dev-ref-bar__brand img { width: 22px; height: 22px; }
@media (max-width: 480px) { .dev-ref-bar { gap: .75rem; font-size: 13px; } }
/* Scalar lays its tables out fixed, which squeezes the first column until its words break
   letter by letter. Lay them out by their content instead: the first column keeps its words
   whole, the others wrap between words (long code may break), and a table still too wide
   for its column scrolls inside its own box. */
#dyadic-api-reference .markdown table { table-layout: auto; display: block; width: max-content; max-width: 100%; overflow-x: auto; }
#dyadic-api-reference .markdown :is(th, td) { word-break: normal; overflow-wrap: break-word; }
#dyadic-api-reference .markdown :is(th, td):first-child { white-space: nowrap; }
#dyadic-api-reference .markdown td:not(:first-child) code { overflow-wrap: anywhere; }
@media (max-width: 480px) { #dyadic-api-reference .markdown :is(th, td) { padding: 8px 10px; } }