.bp-dag-viewer {
  --dag-border: var(--bp-rule, #d8dade); --dag-bg: var(--bp-surface, #fff);
  --dag-panel: color-mix(in srgb, var(--dag-bg) 94%, #64748b 6%); --dag-map: var(--bp-sunken, #f0f2f5); --dag-error: #b42318;
  --dag-fg: var(--bp-fg, #1c1e21); --dag-muted: var(--bp-muted, #65676b); --dag-link: var(--bp-link, #0064e0);
  --dag-navigation-width: 288px;
  --dag-mono: var(--md-code-font-family, ui-monospace, SFMono-Regular, Menlo, Consolas, monospace);
  --dag-radius-row: 6px; --dag-radius-control: 8px; --dag-radius-panel: var(--bp-radius, 12px);
  --dag-e1: 0 1px 2px rgb(0 0 0 / .06); --dag-e2: 0 8px 24px rgb(0 0 0 / .16); --dag-overlay-border: transparent;
  position: relative; display: grid; grid-template-columns: minmax(0, 1fr); grid-template-rows: auto minmax(0, 1fr); width: 100%;
  height: clamp(608px, calc(100svh - 112px), 1024px); min-height: 608px; overflow: hidden;
  border: 1px solid var(--dag-border); border-radius: var(--dag-radius-panel); background: var(--dag-bg); color: var(--dag-fg);
  box-shadow: var(--dag-e1); isolation: isolate;
  font-family: var(--md-text-font-family, ui-sans-serif, system-ui, sans-serif);
}
body.bp-dag-app-page .bp-dag-viewer, body.bp-book .bp-book-frame {
  position: fixed; z-index: 40; inset: 0; width: 100dvw; max-width: none;
  height: 100dvh !important; min-height: 0; margin: 0; border: 0; border-radius: 0; box-shadow: none;
}
/* A phone's reader hangs below the viewer on a transform. Unlike hidden, clip leaves the viewer nothing a fragment link can scroll, so the trail and search stay on screen. */
body.bp-dag-app-page .bp-dag-viewer, body.bp-book .bp-book-frame { overflow: clip; }
body.bp-dag-app-page, body.bp-book { overflow: hidden; }
/* Before the explorer's first commit, the page's boot script (dag_viewer.BOOT_SCRIPT) puts the reading in a frame that
   carries the viewer's classes (.bp-book-frame), so these rules lay out the first paint as the book will be, with the
   article in its place. The explorer replaces the frame when it commits; the real viewer waits until then. On a phone
   the boot script drops the frame, and Material's page stays until the commit. */
.bp-dag-viewer.bp-book-frame { display: none; }
body.bp-book:not(.bp-dag-app-page) .bp-book-frame { display: grid; }
body.bp-book:not(.bp-dag-app-page) .bp-dag-viewer:not(.bp-book-frame) { display: none; }
/* The frame's theme mark stands in for the switch the book adds only when Material's palette has a toggle. */
body:not(:has([data-md-component=palette] label)) .bp-book-frame .bp-dag-theme { display: none; }
/* A topic page shows its "← topic" line, as the book does, only while its address names one of its statements. */
.bp-book-frame:not(:has(.bp-thmwrapper :target, .bp-thmwrapper:target)) .bp-reading-context[data-boot-target] { display: none; }
/* The map's stage says it is loading, in the frame and in the explorer, until the map has drawn the page's place. */
.bp-dag-viewer .bp-dag-map-loading { position: absolute; top: 50%; left: 50%; margin: 0; color: var(--dag-muted); font-size: 14px; transform: translate(-50%, -50%); }
[data-md-color-scheme=slate] .bp-dag-viewer { --dag-overlay-border: var(--dag-border); --dag-map: #18191a; --dag-error: #ff7b72; }
body:is(.bp-dag-app-page, .bp-book) :is(.md-header, .md-tabs, .md-sidebar, .md-footer) { display: none; }
/* Material's skip link and back-to-top button sit under the explorer on its pages, so a keyboard reaching them saw nothing. */
body:is(.bp-dag-app-page, .bp-book) :is(.md-skip, .md-top) { display: none; }
body.bp-dag-app-page .md-main__inner { width: 100%; max-width: none; margin: 0; }
body.bp-dag-app-page .md-content { max-width: none; }
body.bp-dag-app-page .md-content__inner { margin: 0; padding: 0; }
body.bp-dag-app-page .md-content__inner::before,
body.bp-dag-app-page .md-content__inner > h1,
body.bp-dag-app-page .md-content__inner > p { display: none; }
.bp-dag-viewer *, .bp-dag-viewer *::before, .bp-dag-viewer *::after { box-sizing: border-box; }
.bp-dag-viewer [hidden] { display: none !important; }
.bp-dag-head { z-index: 13; border-bottom: 1px solid var(--dag-border); background: var(--dag-bg); }
.bp-dag-context { display: flex; align-items: center; min-height: 28px; padding: 0 16px; }
.bp-dag-breadcrumb { min-width: 0; flex: 1; color: var(--dag-muted); font-size: 12px; }
.bp-dag-viewer.bp-dag-viewer :is(.bp-dag-breadcrumb ol, .bp-dag-navigation-path) { display: flex; align-items: center; gap: 6px; margin: 0; padding: 0; list-style: none; }
.bp-dag-viewer.bp-dag-viewer :is(.bp-dag-breadcrumb, .bp-dag-navigation-path) li { min-width: 0; margin: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
:is(.bp-dag-breadcrumb, .bp-dag-navigation-path) li + li::before { content: "/"; content: "/" / ""; margin-right: 6px; color: var(--dag-border); }
:is(.bp-dag-breadcrumb, .bp-dag-navigation-path) li:not(:first-child, [aria-current]) { flex-shrink: 4; }
.bp-dag-breadcrumb [aria-current=page] { color: var(--dag-fg); font-weight: 600; }
@media (min-width: 681px) and (max-width: 1100px) { .bp-dag-viewer:has(.bp-dag-navigation-path) .bp-dag-breadcrumb { visibility: hidden; } }
.bp-dag-book { flex: none; color: var(--dag-link); font-size: 12px; font-weight: 600; text-decoration: none; white-space: nowrap; }
/* Material's own sun or moon sits in the header this page hides, so the trail row ends in a quiet stand-in. */
.bp-dag-viewer .bp-dag-theme { position: relative; flex: none; width: 32px; min-height: 32px; margin-left: 8px; padding: 0; border: 0; background: transparent; color: var(--dag-muted); font-size: 16px; line-height: 1; }
.bp-dag-viewer .bp-dag-theme svg { display: block; width: 18px; height: 18px; margin: auto; color: var(--dag-fg); }
/* The theme switch and Map only draw a 32px box and reach 44px through their ::after, so the trail row stays one line high. */
.bp-dag-viewer :is(.bp-dag-theme, .bp-dag-map-only)::after { content: ""; position: absolute; inset: -6px; }
.bp-dag-swatch { flex: none; width: 11px; height: 11px; border: 2px solid var(--dag-swatch-light-stroke); border-radius: 50%; background: var(--dag-swatch-light-fill); }
[data-md-color-scheme=slate] .bp-dag-swatch { border-color: var(--dag-swatch-dark-stroke); background: var(--dag-swatch-dark-fill); }
.bp-dag-toolbar { display: flex; align-items: center; gap: 8px; min-height: 52px; padding: 4px 16px 12px; font-size: 13px; }
@media (min-width: 1101px) {
  .bp-dag-head { display: flex; align-items: center; gap: 12px; padding: 8px 16px; }
  .bp-dag-context { display: contents; }
  .bp-dag-breadcrumb { flex: 0 1 auto; max-width: 32%; }
  .bp-dag-viewer:has(.bp-dag-navigation-path) .bp-dag-breadcrumb { display: none; }
  .bp-dag-toolbar { flex: 1; min-width: 0; min-height: 36px; padding: 0; }
}
.bp-dag-search-wrap { position: relative; flex: 1 1 384px; min-width: 160px; max-width: 672px; }
.bp-dag-search { display: block; width: 100%; min-height: 36px; margin: 0; padding: 7px 36px 7px 32px; border: 1px solid var(--dag-border); border-radius: var(--dag-radius-control); outline: 0; background: var(--dag-panel); color: var(--dag-fg); font: inherit; }
.bp-dag-search::placeholder { color: var(--dag-muted); opacity: 1; }
.bp-dag-search-wrap::before {
  content: ""; position: absolute; z-index: 2; left: 11px; top: 50%; width: 14px; height: 14px; margin-top: -7px; background: currentColor; color: var(--dag-muted); pointer-events: none;
  --dag-magnifier: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23000' stroke-width='1.75' stroke-linecap='round'%3E%3Ccircle cx='7' cy='7' r='5'/%3E%3Cpath d='m11 11 3.5 3.5'/%3E%3C/svg%3E");
  -webkit-mask: var(--dag-magnifier) center / 14px no-repeat; mask: var(--dag-magnifier) center / 14px no-repeat;
}
.bp-dag-search-wrap::after { content: "/"; position: absolute; z-index: 2; right: 8px; top: 50%; min-width: 20px; height: 20px; margin-top: -10px; padding: 0 5px; border: 1px solid var(--dag-border); border-radius: var(--dag-radius-row); background: var(--dag-bg); color: var(--dag-muted); font-family: var(--dag-mono); font-size: 11px; line-height: 18px; text-align: center; pointer-events: none; }
.bp-dag-search-wrap:focus-within::after { display: none; }
.bp-dag-search-wrap:has(.bp-dag-search:not(:placeholder-shown))::after { display: none; }
.bp-dag-search:focus { border-color: var(--dag-link); box-shadow: 0 0 0 3px color-mix(in srgb, var(--dag-link) 18%, transparent); }
.bp-dag-search-results { position: absolute; z-index: 20; top: calc(100% + 6px); left: 0; right: 0; max-height: min(432px, 60vh); overflow: auto; padding: 6px; border: 1px solid var(--dag-overlay-border); border-radius: var(--dag-radius-panel); background: var(--dag-bg); box-shadow: var(--dag-e2); min-width: min(576px, calc(100vw - 24px)); }
.bp-dag-viewer.bp-dag-viewer :is(.bp-dag-results, .bp-dag-relation-list, .bp-dag-inventory-list) { display: block; margin: 0; padding: 0; list-style: none; }
.bp-dag-viewer.bp-dag-viewer :is(.bp-dag-results, .bp-dag-relation-list, .bp-dag-inventory-list) > li { margin: 0; }
.bp-dag-result { display: flex; align-items: baseline; width: 100%; gap: 10px; padding: 8px 9px; border: 0; border-radius: var(--dag-radius-row); background: transparent; color: var(--dag-fg); text-align: left; cursor: pointer; }
.bp-dag-result:hover, .bp-dag-result:focus-visible { background: color-mix(in srgb, var(--dag-link) 9%, transparent); }
.bp-dag-result-title, .bp-dag-inventory-title { flex: 1 1 auto; min-width: 0; overflow: hidden; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.bp-dag-result-meta, .bp-dag-inventory-meta { min-width: 0; overflow: hidden; color: var(--dag-muted); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
/* A result's place takes a line of its own under its title and status. */
.bp-dag-result { flex-wrap: wrap; row-gap: 2px; }
.bp-dag-result-place { flex: 1 0 100%; min-width: 0; overflow: hidden; color: var(--dag-muted); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.bp-dag-button, .bp-dag-filter-summary, .bp-dag-hidden-button, .bp-dag-whole-search, .bp-dag-load-more { min-height: 36px; padding: 6px 10px; border: 1px solid var(--dag-border); border-radius: var(--dag-radius-control); background: var(--dag-bg); color: var(--dag-fg); font: inherit; font-weight: 600; cursor: pointer; }
.bp-dag-button:not(:disabled):hover, .bp-dag-filter-summary:hover, .bp-dag-load-more:hover { border-color: var(--dag-link); color: var(--dag-link); }
/* One solid ring for every control, 3.9:1 or more on every surface; rows draw it inside, where the rail or list would clip it. */
.bp-dag-viewer :is(button, a, [tabindex]):focus-visible { outline: 2px solid var(--dag-link); outline-offset: 2px; }
/* Controls inside a box that clips draw their ring inside it: the reader's handle and the map's edge tabs sit in panes that hide overflow. */
.bp-dag-viewer :is(.bp-dag-result, .bp-dag-inventory-row, .bp-dag-navigation-link, .bp-reading-body, .bp-dag-sheet-handle, .bp-dag-pane-tab):focus-visible { outline-offset: -2px; }
/* Browse marks the list on screen in the pressed look, and its closed toggle carries that look while a list or the sources replace the map. */
.bp-dag-browse-popover .bp-dag-button[aria-pressed=true], .bp-dag-pivot[aria-pressed=true], .bp-dag-viewer:has(.bp-dag-stage[hidden]) .bp-dag-browse > .bp-dag-button { border-color: var(--dag-link); background: color-mix(in srgb, var(--dag-link) 10%, var(--dag-bg)); color: var(--dag-link); }
.bp-dag-filters { position: relative; flex: none; }
.bp-dag-browse { position: relative; flex: none; }
.bp-dag-browse-popover { position: absolute; z-index: 18; top: calc(100% + 6px); right: 0; display: grid; gap: 5px; width: 220px; max-width: calc(100vw - 32px); padding: 10px; border: 1px solid var(--dag-overlay-border); border-radius: var(--dag-radius-panel); background: var(--dag-bg); box-shadow: var(--dag-e2); }
.bp-dag-browse-popover .bp-dag-button { text-align: left; }
.bp-dag-filter-summary { display: flex; align-items: center; white-space: nowrap; }
.bp-dag-filter-popover { position: absolute; z-index: 18; top: calc(100% + 6px); right: 0; width: 240px; max-height: 368px; overflow: auto; padding: 10px; border: 1px solid var(--dag-overlay-border); border-radius: var(--dag-radius-panel); background: var(--dag-bg); box-shadow: var(--dag-e2); }
.bp-dag-filter-popover fieldset { display: grid; gap: 3px; margin: 0; padding: 0; border: 0; }
.bp-dag-filter-popover fieldset + fieldset { margin-top: 8px; padding-top: 8px; border-top: 1px solid var(--dag-border); }
.bp-dag-filter-popover legend { margin-bottom: 6px; }
.bp-dag-filter-popover legend, .bp-dag-viewer.bp-dag-viewer .bp-dag-navigation-group h2 { color: var(--dag-muted); font-size: 12px; font-weight: 600; letter-spacing: normal; line-height: 1.3; }
.bp-dag-check { display: flex; align-items: center; gap: 7px; min-height: 32px; padding: 3px 5px; border-radius: var(--dag-radius-row); }
.bp-dag-check:hover { background: var(--dag-panel); }
.bp-dag-check input { accent-color: var(--dag-link); }
.bp-dag-check-count { margin-left: auto; color: var(--dag-muted); font-size: 12px; font-variant-numeric: tabular-nums; }
.bp-dag-check-text { display: grid; gap: 1px; min-width: 0; }
.bp-dag-check-meaning { color: var(--dag-muted); font-size: 11.5px; line-height: 1.3; }
.bp-dag-filter-popover:has(.bp-dag-check-meaning) { width: 300px; max-height: min(560px, calc(100dvh - 140px)); }
.bp-dag-check:has(.bp-dag-check-meaning) { align-items: flex-start; }
.bp-dag-check:has(.bp-dag-check-meaning) :is(input, .bp-dag-swatch) { margin-top: 3px; }
.bp-dag-hidden-button, .bp-dag-whole-search { min-height: 26px; margin: 0; padding: 1px 3px; border: 0; background: transparent; color: var(--dag-link); }
.bp-dag-hidden-button { flex: none; margin-left: auto; white-space: nowrap; }
.bp-dag-hidden-button:hover { text-decoration: underline; }
.bp-dag-body { position: relative; display: grid; grid-template-columns: var(--dag-navigation-width) minmax(0, 1fr); min-height: 0; }
.bp-dag-navigation { z-index: 6; min-width: 0; min-height: 0; overflow: auto; border-right: 1px solid var(--dag-border); background: var(--dag-bg); }
.bp-dag-navigation-inner { display: grid; grid-template-columns: minmax(0, 1fr); align-content: start; min-height: 100%; padding: 16px 12px 24px; }
.bp-dag-viewer.bp-dag-viewer .bp-dag-navigation-title { margin: 0 6px; color: var(--dag-fg); font-size: 22px; font-weight: 700; letter-spacing: -.02em; line-height: 1.2; }
.bp-dag-navigation-summary { display: -webkit-box; margin: 9px 6px 15px; overflow: hidden; color: var(--dag-muted); font-size: 13px; line-height: 1.5; -webkit-box-orient: vertical; -webkit-line-clamp: 4; }
.bp-dag-viewer.bp-dag-viewer ol.bp-dag-navigation-path { margin: 0 6px 6px; color: var(--dag-muted); font-size: 12px; line-height: 1.4; }
.bp-dag-viewer.bp-dag-viewer .bp-dag-navigation-path a { color: inherit; text-decoration: none; }
.bp-dag-viewer.bp-dag-viewer .bp-dag-navigation-path a:hover { color: var(--dag-link); }
.bp-dag-navigation-counts { margin: 0 6px 16px; color: var(--dag-muted); font-size: 12px; font-variant-numeric: tabular-nums; }
.bp-dag-navigation-group { margin-top: 12px; }
.bp-dag-viewer.bp-dag-viewer .bp-dag-navigation-group h2 { margin: 0 6px 5px; }
.bp-dag-viewer.bp-dag-viewer .bp-dag-navigation-list { display: grid; gap: 3px; margin: 0; padding: 0; list-style: none; }
.bp-dag-viewer.bp-dag-viewer .bp-dag-navigation-list > li { margin: 0; }
.bp-dag-navigation-link { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; width: 100%; gap: 8px; min-height: 36px; padding: 7px 8px; border: 1px solid transparent; border-radius: var(--dag-radius-row); background: transparent; color: var(--dag-fg) !important; font: inherit; font-size: 13px; line-height: 1.25; text-align: left; text-decoration: none !important; cursor: pointer; }
.bp-dag-navigation-link > span:first-child { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bp-dag-navigation-link:hover { border-color: var(--dag-border); background: var(--dag-panel); }
.bp-dag-navigation-link[aria-current=true] { border-color: color-mix(in srgb, var(--dag-link) 38%, var(--dag-border)); background: color-mix(in srgb, var(--dag-link) 9%, var(--dag-bg)); color: var(--dag-link) !important; }
.bp-dag-navigation-meta { color: var(--dag-muted); font-size: 12px; font-variant-numeric: tabular-nums; white-space: nowrap; }
.bp-dag-navigation-more { width: 100%; margin-top: 7px; border: 0; background: transparent; color: var(--dag-link); font: inherit; font-size: 12px; text-align: left; cursor: pointer; }
.bp-dag-main { position: relative; min-width: 0; min-height: 0; overflow: hidden; background: var(--dag-map); }
.bp-dag-stage { position: absolute; inset: 0; overflow: hidden; }
.bp-dag-inventory { position: absolute; inset: 0; display: grid; grid-template-rows: auto minmax(0, 1fr) auto; overflow: hidden; background: var(--dag-bg); font-size: 13px; }
.bp-dag-inventory-head { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; padding: 12px 16px; border-bottom: 1px solid var(--dag-border); }
.bp-dag-viewer.bp-dag-viewer .bp-dag-inventory-head h2 { margin: 0; font-size: 14px; font-weight: 700; letter-spacing: normal; line-height: 1.3; }
.bp-dag-inventory-summary { color: var(--dag-muted); font-size: 12px; }
.bp-dag-inventory-scroll { overflow: auto; padding: 7px; }
.bp-dag-inventory-row { display: flex; align-items: baseline; width: 100%; gap: 13px; padding: 10px 11px; border: 0; border-radius: var(--dag-radius-row); background: transparent; color: var(--dag-fg); text-align: left; cursor: pointer; }
.bp-dag-inventory-row:hover, .bp-dag-inventory-row:focus-visible { background: var(--dag-panel); }
.bp-dag-inventory-row[aria-current=true] { background: color-mix(in srgb, var(--dag-link) 10%, var(--dag-bg)); box-shadow: inset 3px 0 0 var(--dag-link); }
.bp-dag-load-more { justify-self: center; margin: 9px; }
.bp-dag-inspector { position: absolute; z-index: 10; top: 12px; right: 12px; bottom: 12px; width: min(384px, calc(100% - 24px)); min-width: 0; overflow: auto; border: 1px solid var(--dag-overlay-border); border-radius: var(--dag-radius-panel); font-size: 13px; background: var(--dag-bg); box-shadow: var(--dag-e2); visibility: hidden; opacity: 0; transform: translateX(calc(100% + 24px)); transition: opacity .16s ease, transform .2s ease, visibility 0s linear .2s; }
.bp-dag-viewer.bp-dag-has-selection.bp-dag-sheet-open .bp-dag-inspector { visibility: visible; opacity: 1; transform: translateX(0); transition-delay: 0s; }
.bp-dag-inspector-inner { padding: 16px; }
.bp-dag-sheet-handle { display: none; }
.bp-dag-inspector-header { padding-right: 32px; }
.bp-dag-viewer.bp-dag-viewer .bp-dag-inspector-header h2 { margin: 0; font-size: 17px; font-weight: 700; letter-spacing: normal; line-height: 1.25; }
.bp-dag-viewer.bp-dag-viewer .bp-dag-inspector-inner > h2 { margin: 0 0 8px; font-size: 17px; font-weight: 700; letter-spacing: normal; line-height: 1.25; }
.bp-dag-close { position: absolute; z-index: 3; top: 10px; right: 10px; width: 32px; height: 32px; padding: 0; border: 0; border-radius: var(--dag-radius-control); background: transparent; color: var(--dag-muted); font-size: 22px; line-height: 1; cursor: pointer; }
.bp-dag-close:hover { background: var(--dag-panel); color: var(--dag-fg); }
.bp-dag-kicker { margin: 0 0 6px; color: var(--dag-muted); font-size: 12px; font-weight: 600; }
.bp-dag-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; margin: 10px 0 12px; }
.bp-dag-status-pill { display: inline-flex; align-items: center; gap: 6px; color: var(--dag-muted); font-size: 12px; }
.bp-dag-status-pill::before { content: ""; width: 9px; height: 9px; border: 2px solid var(--dag-pill-stroke); border-radius: 50%; background: var(--dag-pill-fill); }
.bp-dag-open { display: inline-flex; align-items: center; justify-content: center; min-height: 36px; padding: 6px 12px; border-radius: var(--dag-radius-control); background: var(--dag-link); color: #fff !important; font-size: 13px; font-weight: 600; text-decoration: none !important; }
[data-md-color-scheme=slate] .bp-dag-open { background: #0064e0; }
.bp-dag-overview { color: var(--dag-muted); font-size: 13px; line-height: 1.55; }
.bp-dag-overview strong { color: var(--dag-fg); }
.bp-dag-summary { margin: 13px 0; color: var(--dag-fg); font-size: 14px; line-height: 1.55; }
.bp-dag-lean { margin: 10px 0 0; overflow-wrap: anywhere; color: var(--dag-muted); font-size: 12px; font-family: var(--dag-mono); }
.bp-dag-section { margin-top: 20px; }
.bp-dag-viewer.bp-dag-viewer .bp-dag-section h3 { margin: 0 0 7px; font-size: 13px; font-weight: 600; letter-spacing: normal; line-height: 1.3; }
.bp-dag-pivots { display: flex; gap: 2px; margin-top: 16px; padding: 2px; border: 1px solid var(--dag-border); border-radius: var(--dag-radius-control); }
.bp-dag-pivot { flex: 1 1 auto; min-width: 0; min-height: 30px; padding: 4px 8px; border: 0; border-radius: var(--dag-radius-row); background: transparent; color: var(--dag-muted); font: inherit; font-size: 12px; font-weight: 600; white-space: nowrap; cursor: pointer; }
.bp-dag-pivot:not([aria-pressed=true], :disabled):hover { background: var(--dag-panel); color: var(--dag-fg); }
.bp-dag-pivot:disabled { opacity: .45; cursor: default; }
.bp-dag-relation-button { width: 100%; padding: 6px 4px; overflow: hidden; border: 0; background: transparent; color: var(--dag-link); font: inherit; font-size: 13px; text-align: left; text-overflow: ellipsis; white-space: nowrap; cursor: pointer; }
.bp-dag-relation-button:hover { text-decoration: underline; }
.bp-dag-distribution { display: grid; gap: 5px; margin: 6px 0 0; }
.bp-dag-distribution-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 6px; color: var(--dag-muted); font-size: 12px; }
.bp-dag-distribution-label { display: flex; align-items: center; gap: 6px; min-width: 0; }
.bp-dag-loading, .bp-dag-error { margin: 0; padding: 16px; }
.bp-dag-error { color: var(--dag-error); }
.bp-dag-fallback { min-height: 0; overflow: auto; padding: 0 16px 16px; color: var(--dag-muted); }
.bp-dag-fallback p { max-width: 768px; }
.bp-dag-fallback-list { display: grid; gap: 5px; margin: 13px 0; padding-left: 22px; }
.bp-dag-viewer.bp-dag-enhancing .bp-dag-fallback { display: none; }
.bp-dag-sr-only, body.bp-dag-app-page .md-content__inner > h1 { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; }
@media (max-width: 1100px) {
  .bp-dag-viewer { --dag-navigation-width: 248px; }
  .bp-dag-head { display: grid; grid-template-columns: minmax(0, 1fr) auto; padding-top: 8px; }
  .bp-dag-book { grid-area: 1 / 2; align-self: center; margin-right: 16px; }
  .bp-dag-toolbar { grid-column: 1 / -1; }
  .bp-dag-inspector { right: auto; left: 12px; transform: translateX(calc(-100% - 24px)); }
  .bp-dag-viewer.bp-dag-has-selection.bp-dag-sheet-open .bp-dag-breadcrumb { visibility: visible; }
  .bp-dag-viewer.bp-dag-has-selection.bp-dag-sheet-open .bp-dag-navigation { visibility: hidden; transition: visibility 0s .2s; }
  .bp-dag-viewer.bp-dag-has-selection.bp-dag-sheet-open .bp-dag-navigation h1 { visibility: visible; opacity: 0; transition: opacity 0s .2s; }
}
@media (min-width: 681px) and (max-width: 1100px) {
  .bp-dag-viewer.bp-dag-has-selection.bp-dag-sheet-open .bp-dag-inventory { left: calc(408px - var(--dag-navigation-width)); }
  .bp-dag-viewer:has(.bp-dag-navigation-path):not(.bp-dag-has-selection.bp-dag-sheet-open) .bp-dag-head:not(:has(.bp-dag-book)) .bp-dag-context { display: none; }
}
@media (max-width: 900px) {
  .bp-dag-viewer { --dag-navigation-width: 216px; }
  .bp-dag-toolbar { flex-wrap: wrap; }
  .bp-dag-search-wrap { max-width: none; }
}
@media (max-width: 680px) {
  .bp-dag-context { padding-inline: 8px; }
  .bp-dag-head { grid-template-columns: minmax(0, 1fr); }
  .bp-dag-head:has(.bp-dag-book) .bp-dag-context { min-height: 0; }
  .bp-dag-book { grid-area: 2 / 1; justify-self: start; margin: 4px 8px 0; }
  .bp-dag-toolbar { gap: 6px; padding: 6px 8px 8px; }
  .bp-dag-search-wrap { flex-basis: calc(100% - 6px); order: -2; }
  .bp-dag-search-wrap::after { display: none; }
  .bp-dag-search { padding-right: 12px; }
  .bp-dag-filter-popover { left: 0; right: auto; max-width: calc(100vw - 16px); }
  .bp-dag-search, .bp-dag-button, .bp-dag-filter-summary, .bp-dag-hidden-button { min-height: 44px; }
  .bp-dag-body { display: block; }
  .bp-dag-navigation { display: none; }
  body.bp-dag-app-page .md-content__inner > h1 { display: block; }
  .bp-dag-main { position: absolute; inset: 0; }
  .bp-dag-inventory { padding-bottom: 60px; }
  .bp-dag-inspector { position: absolute; z-index: 12; top: auto; right: 8px; bottom: 8px; left: 8px; width: auto; max-height: min(58%, 480px); overflow: auto; border: 1px solid var(--dag-overlay-border); border-radius: var(--dag-radius-panel); box-shadow: var(--dag-e2); visibility: visible; opacity: 1; transform: translateY(calc(100% - 52px)); transition: transform .2s ease; }
  .bp-dag-viewer.bp-dag-sheet-open .bp-dag-inspector { transform: translateY(0); }
  .bp-dag-sheet-handle { display: block; position: sticky; z-index: 2; top: 0; width: 100%; min-height: 50px; padding: 10px 48px 8px 12px; overflow: hidden; border: 0; border-bottom: 1px solid var(--dag-border); background: var(--dag-bg); color: var(--dag-fg); font: inherit; font-size: 13px; font-weight: 600; text-align: left; text-overflow: ellipsis; white-space: nowrap; cursor: pointer; }
  .bp-dag-sheet-handle::before { content: ""; position: absolute; top: 6px; left: 50%; width: 32px; height: 3px; border-radius: 2px; background: var(--dag-border); transform: translateX(-50%); }
  .bp-dag-inspector-inner { padding: 12px; }
  .bp-dag-viewer:not(.bp-dag-sheet-open) .bp-dag-close { display: none; }
  .bp-dag-inspector-header { padding-right: 0; }
  .bp-dag-viewer.bp-dag-viewer .bp-dag-inspector-header h2 { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; }
}
/* A touch screen of any width gets the phone's 44px toolbar targets. */
@media (pointer: coarse) {
  .bp-dag-toolbar :is(.bp-dag-search, .bp-dag-button, .bp-dag-filter-summary, .bp-dag-hidden-button) { min-height: 44px; }
}
@media (prefers-reduced-motion: reduce) {
  .bp-dag-inspector { transition: none; }
}

/* One book and map workspace. The source remains readable until enhancement succeeds. */
body.bp-dag-app-page .bp-explorer-page > .bp-reading-source { display: none; }
body.bp-dag-app-page:has(.bp-dag-integrated) .md-content__inner > h1 { display: none !important; }
.bp-dag-integrated { --dag-navigation-width: 216px; }
.bp-dag-integrated .bp-dag-body { grid-template-columns: var(--dag-navigation-width) minmax(160px, 1fr) var(--dag-reading-width, minmax(360px, 39%)); }
.bp-dag-integrated .bp-dag-head { display: block; padding: 0; }
.bp-dag-integrated .bp-dag-context { display: flex; padding: 10px 16px 0; }
/* The trail has the row to itself: each crumb keeps a few letters, the "…" its glyph, and a parent at most 24ch. */
.bp-dag-integrated .bp-dag-breadcrumb { display: block; flex: 1 1 auto; max-width: none; visibility: visible !important; }
.bp-dag-viewer.bp-dag-integrated .bp-dag-breadcrumb li { min-width: 4em; }
.bp-dag-viewer.bp-dag-integrated .bp-dag-breadcrumb li:first-child { flex: none; min-width: 0; }
.bp-dag-viewer.bp-dag-integrated .bp-dag-breadcrumb li:has(.bp-dag-sr-only) { flex: none; min-width: 0; }
.bp-dag-integrated .bp-dag-breadcrumb li:not(:first-child, :last-child) { max-width: 24ch; }
/* A crumb with a link lets its focus ring out; the link still truncates its own text. */
.bp-dag-viewer.bp-dag-viewer .bp-dag-breadcrumb li:has(> a) { display: flex; align-items: center; overflow: visible; }
.bp-dag-viewer.bp-dag-viewer .bp-dag-breadcrumb li > a { display: block; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bp-dag-viewer.bp-dag-viewer .bp-dag-breadcrumb li::before { flex: none; }
.bp-dag-integrated .bp-dag-book { grid-area: auto; margin: 0; max-width: 240px; overflow: hidden; text-overflow: ellipsis; }
.bp-dag-integrated .bp-dag-toolbar { display: flex; padding: 10px 16px; }
.bp-dag-integrated .bp-dag-search-wrap { max-width: none; }
/* The box can span a wide head, but its results stop at 720px, so a row's status stays near its title. */
.bp-dag-integrated .bp-dag-search-results { max-width: 720px; }
.bp-dag-integrated .bp-dag-navigation { visibility: visible !important; transition: none; }
.bp-dag-integrated .bp-dag-navigation-link { display: block; white-space: normal; overflow-wrap: anywhere; }
.bp-dag-integrated .bp-dag-navigation-link[aria-current=page] { background: var(--dag-panel); color: var(--dag-link) !important; }
.bp-outline-depth-1 { margin-left: 14px !important; }
.bp-outline-depth-2 { margin-left: 28px !important; }
.bp-outline-depth-3 { margin-left: 42px !important; }
.bp-outline-depth-4 { margin-left: 56px !important; }
.bp-outline-collection { display: block; padding: 10px 7px 4px; color: var(--dag-muted); font-size: 12px; font-weight: 600; }
.bp-outline-label { margin: 0 7px 10px !important; font-size: 12px !important; color: var(--dag-muted); font-weight: 600; }
.bp-dag-integrated .bp-reading-pane { position: relative; inset: auto; width: auto; max-width: none; height: 100%; max-height: none; min-width: 0; min-height: 0; visibility: visible; opacity: 1; transform: none; transition: none; border: 0; border-left: 1px solid var(--dag-border); border-radius: 0; box-shadow: none; overflow: hidden; }
.bp-dag-integrated .bp-dag-inspector-inner { display: grid; grid-template-columns: minmax(0, 1fr); grid-template-rows: auto minmax(0, 1fr); min-width: 0; padding: 0; height: 100%; overflow: hidden; }
.bp-reading-context:empty { display: none; }
.bp-reading-context { grid-row: 1; min-width: 0; padding: 10px 22px; border-bottom: 1px solid var(--dag-border); overflow-wrap: anywhere; }
.bp-reading-around { color: var(--dag-link); font-size: 13px; text-decoration: none; }
.bp-reading-body { grid-row: 2; min-width: 0; min-height: 0; overflow: auto; padding: 24px 26px 60px; font-size: 16px; line-height: 1.6; scroll-padding-top: 24px; }
.bp-reading-source { min-width: 0; max-width: 100%; overflow-wrap: anywhere; }
.bp-reading-body h1 { margin: 0 0 22px !important; color: var(--dag-fg); font-size: 22px !important; font-weight: 700; line-height: 1.35; }
.bp-reading-body h2 { font-size: 22px; line-height: 1.4; }
.bp-reading-body h3 { font-size: 17px; line-height: 1.4; }
/* The book sizes notes, totals and labels in rem for Material's body size; beside the pane's 16px statement they would outrank it, so they step down here. */
.bp-reading-body :is(.bp-thmnotes, .bp-meta, .bp-progress-states), .bp-reading-body :is(details.bp-dependencies, details.bp-lean-fold) { font-size: 14px; }
.bp-reading-body :is(.bp-thmnotes h6, .bp-thmcaption, .bp-key, .bp-mark, .bp-progress-kicker, .bp-next-kicker, .bp-hero-kicker) { font-size: 12px; }
.bp-reading-body :is(.bp-progress-total, .bp-next-title) { font-size: 16px; }
/* The status rule and the bold head already mark a theorem, so the workspace sets its statement upright. */
.bp-dag-integrated .theorem-style-plain > .bp-thmcontent { font-style: normal; }
.bp-reading-body pre, .bp-reading-body table { max-width: 100%; overflow: auto; }
/* A table cell keeps its words whole: a column held at Material's 100px minimum split a longer header mid-word ("Dependen t"). */
.bp-reading-source :is(th, td) { overflow-wrap: break-word; }
.bp-reading-body img, .bp-reading-body svg { max-width: 100%; }
.bp-reading-body .bp-node { border-radius: 8px; }
/* The current statement takes the contents row's tint and left bar inside the column; an offset outline ran past it. */
/* The current statement takes a neutral tint: blue is a status colour. */
.bp-reading-current { padding: 10px 12px 10px 15px; border-radius: 8px; background: color-mix(in srgb, var(--dag-fg) 6%, transparent); box-shadow: inset 3px 0 0 var(--dag-fg); }
/* An article ends with its links to other articles and theirs to it, in a section of its own that scrolls with it. A
   statement's links end its card, under headings a size below the card's title, in the site's ink and case. */
.bp-reading-wiki-links { margin-top: 32px; border-top: 1px solid var(--dag-border); }
.bp-reading-body .bp-reading-wiki-links h2 { margin: 20px 0 8px; font-size: 17px; }
.bp-thmwrapper > .bp-reading-wiki-links { margin-top: 16px; }
.bp-reading-body .bp-reading-wiki-links h5 { margin: 16px 0 6px; color: inherit; font-size: 14px; font-weight: 600; letter-spacing: normal; text-transform: none; }
.bp-reading-wiki-list a { overflow-wrap: anywhere; }
.bp-reading-wiki-notice { margin: 16px 0 0; color: var(--dag-muted); font-size: 14px; }
.bp-reading-wiki-more { border: 0; padding: 2px 0; background: transparent; color: var(--dag-link); font: inherit; font-size: 14px; cursor: pointer; }
/* The site clips a list holding a formula; this list's links reach its edges, so the clip would cut the sides of their
   focus rings. */
.bp-dag-viewer.bp-dag-viewer .bp-reading-wiki-list:has(mjx-container) { overflow-x: visible; }
.bp-dag-integrated .bp-dag-inventory { left: 0 !important; }
.bp-dag-integrated .bp-dag-inventory-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 5px 16px; padding: 14px 16px; }
.bp-dag-integrated .bp-dag-inventory-title { font-size: 17px; font-weight: 600; line-height: 1.3; white-space: normal; overflow-wrap: anywhere; }
.bp-dag-integrated .bp-dag-inventory-meta { font-size: 12px; color: var(--dag-muted); }
.bp-result-summary { grid-column: 1 / -1; font-size: 13px; color: var(--dag-muted); line-height: 1.5; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
/* A row's formula stays blank, rather than showing its TeX, until it is typeset as the row scrolls near the view. */
.bp-dag-inventory-row .bp-math-pending { color: transparent; }
.bp-dag-outline-toggle { display: none; }
.bp-reading-map { display: none; }
@media (min-width: 721px) {
  .bp-dag-integrated.bp-dag-overview-only:not(.bp-dag-sheet-open) .bp-dag-body { grid-template-columns: var(--dag-navigation-width) minmax(0, 1fr) 48px; }
  .bp-dag-integrated.bp-dag-overview-only:not(.bp-dag-sheet-open) .bp-dag-inspector-inner { display: none; }
  .bp-dag-integrated.bp-dag-overview-only:not(.bp-dag-sheet-open) .bp-dag-sheet-handle { display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; height: 100%; padding: 14px 10px; border: 0; background: var(--dag-panel); color: var(--dag-fg); font: inherit; font-size: 13px; font-weight: 600; writing-mode: vertical-rl; cursor: pointer; }
  .bp-dag-integrated.bp-dag-overview-only.bp-dag-sheet-open .bp-dag-sheet-handle { display: block; position: absolute; z-index: 2; top: 12px; right: 12px; width: 32px; height: 32px; padding: 0; border: 0; border-radius: var(--dag-radius-control); background: var(--dag-panel); color: var(--dag-fg); font: inherit; font-size: 22px; line-height: 1; cursor: pointer; }
  .bp-dag-integrated.bp-dag-overview-only.bp-dag-sheet-open .bp-reading-body h1 { padding-right: 32px; }
}
@media (max-width: 1100px) {
  .bp-dag-integrated .bp-dag-body { grid-template-columns: minmax(160px, 1fr) var(--dag-reading-width, minmax(340px, 43%)); }
  .bp-dag-integrated.bp-dag-overview-only:not(.bp-dag-sheet-open) .bp-dag-body { grid-template-columns: minmax(0, 1fr) 48px; }
  .bp-dag-integrated .bp-dag-navigation { display: none; }
  .bp-dag-integrated .bp-dag-outline-toggle { display: inline-flex; align-items: center; }
  .bp-dag-integrated.bp-dag-outline-open .bp-dag-navigation { display: block; position: absolute; z-index: 18; inset: 0 auto 0 0; width: 264px; box-shadow: var(--dag-e2); }
  .bp-dag-integrated .bp-dag-toolbar { flex-wrap: wrap; }
  /* Search and Contents take the first row, and filter, Back to map, Browse and "Show N filtered out" the second, so a filter never adds a row and moves the map, and the search box keeps room for its placeholder. */
  .bp-dag-integrated .bp-dag-search-wrap { flex-basis: calc(100% - 96px); }
  .bp-dag-integrated .bp-dag-filter-popover { left: 0; right: auto; max-width: calc(100dvw - 24px); }
}
/* A tablet's or phone's filter grows from 100px to its whole summary in the second row's free space, and cuts the summary short rather than push "Show N filtered out" onto a third row. */
@media (max-width: 1100px) {
  .bp-dag-integrated .bp-dag-filters { flex: 1 1 100px; min-width: 0; max-width: max-content; }
  .bp-dag-integrated .bp-dag-filter-summary { display: block; max-width: 100%; overflow: hidden; line-height: 22px; text-overflow: ellipsis; }
}
@media (max-width: 720px) {
  .bp-dag-integrated .bp-dag-body { display: block; }
  .bp-dag-integrated .bp-dag-main { position: absolute; inset: 0 0 56px; }
  /* The reader peeks 56px, opens to half with the map's top 45% above it, or covers the map. */
  .bp-dag-integrated .bp-reading-pane { position: absolute; z-index: 12; inset: 0; height: 100%; border: 0; transform: translateY(calc(100% - 56px)); transition: transform .16s ease; }
  .bp-dag-viewer.bp-dag-integrated .bp-reading-pane { max-height: none; max-width: none; }
  .bp-dag-viewer.bp-dag-integrated.bp-dag-sheet-open .bp-reading-pane { transform: translateY(45%); }
  .bp-dag-viewer.bp-dag-integrated.bp-dag-sheet-full .bp-reading-pane { transform: none; }
  .bp-dag-integrated .bp-dag-sheet-handle { display: block; width: 100%; height: 56px; min-height: 56px; padding: 16px 20px 12px; overflow: hidden; border: 0; border-bottom: 1px solid var(--dag-border); border-radius: 0; background: var(--dag-bg); color: var(--dag-fg); font: inherit; font-size: 13px; font-weight: 600; text-align: left; text-overflow: ellipsis; white-space: nowrap; cursor: pointer; touch-action: none; }
  .bp-dag-integrated .bp-dag-sheet-handle .bp-dag-swatch { display: inline-block; margin: 0 8px -1px 0; }
  .bp-dag-integrated .bp-dag-inspector-inner { height: calc(100% - 56px); }
  /* At half the reader ends at the screen's bottom, so its last lines can still be scrolled into view. */
  .bp-dag-integrated.bp-dag-sheet-open:not(.bp-dag-sheet-full) .bp-dag-inspector-inner { height: calc(55% - 56px); }
  .bp-dag-integrated.bp-dag-sheet-full .bp-dag-toolbar { display: none; }
  .bp-dag-integrated.bp-dag-sheet-full .bp-reading-map { display: block; position: absolute; z-index: 3; bottom: 16px; left: 50%; padding: 10px 24px; border: 1px solid var(--dag-overlay-border); border-radius: 999px; background: var(--dag-bg); color: var(--dag-fg); font: inherit; font-size: 14px; font-weight: 600; box-shadow: var(--dag-e2); transform: translateX(-50%); cursor: pointer; }
  .bp-dag-integrated .bp-reading-body { padding: 20px 22px 60px; }
  /* Open, the reader shows its heading right under the handle, so the handle keeps only its grabber; its name still says the title. */
  .bp-dag-integrated.bp-dag-sheet-open .bp-dag-sheet-handle :is(.bp-dag-sheet-title, .bp-dag-swatch) { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  /* At full the Map pill floats over the reader's foot, so the article's end, with its links, scrolls clear of it, and so
     does whatever takes focus there. */
  .bp-dag-integrated.bp-dag-sheet-full .bp-reading-body { padding-bottom: 72px; scroll-padding-bottom: 72px; }
  .bp-dag-integrated .bp-dag-context { padding-inline: 12px; }
  /* Keep every 44px control and both rows; trim only their outer padding, which leaves the map more of the screen. */
  .bp-dag-integrated .bp-dag-toolbar { padding: 4px 12px; gap: 6px; }
  /* Secondary labels can elide before any touch target shrinks or the toolbar adds a third row. */
  .bp-dag-integrated :is(.bp-dag-filters, .bp-dag-browse, .bp-dag-hidden-button) { flex: 1 1 44px; min-width: 44px; max-width: max-content; }
  .bp-dag-integrated :is(.bp-dag-filter-summary, .bp-dag-browse > .bp-dag-button, .bp-dag-hidden-button) { min-width: 44px; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .bp-dag-integrated .bp-dag-breadcrumb { min-width: 0; flex: 1; }
  /* JavaScript folds middle ancestors with their names; CSS must not silently erase them. */
  .bp-dag-breadcrumb .bp-dag-book { margin: 0; max-width: none; }
  /* Search and Contents keep the first row, as on a tablet: Contents on the second row pushed a third row once Browse read "Statements". */
  /* Browse can wrap to the start of a row, where a menu hung from its right edge would open off screen, and the filter's 300px
     legend ran past a 320px screen from Filter's place, so a phone hangs both from the toolbar. */
  .bp-dag-integrated .bp-dag-toolbar { position: relative; }
  .bp-dag-integrated :is(.bp-dag-browse, .bp-dag-filters) { position: static; }
  .bp-dag-integrated .bp-dag-browse-popover, .bp-dag-viewer.bp-dag-integrated .bp-dag-filter-popover { left: 12px; right: 12px; width: auto; max-width: none; }
}
@media (prefers-reduced-motion: reduce) { .bp-dag-integrated .bp-reading-pane { transition: none; } }

/* Contents and the reading pane resize from splitters on their inner edges, and hide: a hidden pane leaves a tab at the map's
   edge that brings it back. The map keeps 160px in every layout with a reader, whatever width was saved, until it is shut
   (below). A splitter sits over the reading pane, which would otherwise take its inner half, and the splitters and tabs stay
   under the head's menus.
   A focused splitter shows the usual focus ring, and its line only while dragged or hovered. Where touch is the main
   pointer, as on a tablet, the splitters are 24px wide. The statement list leaves the tabs room. A phone keeps its sheet. */
.bp-dag-splitter { position: absolute; z-index: 11; top: 0; bottom: 0; width: 8px; cursor: col-resize; touch-action: none; }
.bp-dag-splitter::after { content: ""; position: absolute; top: 0; bottom: 0; left: calc(50% - 1px); width: 2px; transition: background .12s; }
.bp-dag-splitter:hover::after, .bp-dag-resizing .bp-dag-splitter:focus::after { background: var(--dag-link); }
@media (pointer: coarse) { .bp-dag-splitter { width: 24px; } }
.bp-dag-resizing, .bp-dag-resizing * { cursor: col-resize !important; user-select: none; }
.bp-dag-viewer .bp-dag-pane-tab { position: absolute; z-index: 7; top: 50%; padding: 14px 6px; border: 1px solid var(--dag-border); background: var(--dag-bg); color: var(--dag-fg); font: inherit; font-size: 12px; font-weight: 600; writing-mode: vertical-rl; box-shadow: var(--dag-e1); transform: translateY(-50%); cursor: pointer; }
.bp-dag-viewer .bp-dag-pane-tab:hover { color: var(--dag-link); }
.bp-dag-viewer .bp-dag-pane-tab-topics { left: 0; border-left: 0; border-radius: 0 var(--dag-radius-control) var(--dag-radius-control) 0; }
.bp-dag-viewer .bp-dag-pane-tab-reading { right: 0; border-right: 0; border-radius: var(--dag-radius-control) 0 0 var(--dag-radius-control); }
.bp-dag-viewer.bp-dag-topics-hidden .bp-dag-inventory { padding-left: 36px; }
.bp-dag-viewer.bp-dag-reading-hidden .bp-dag-inventory { padding-right: 36px; }
.bp-dag-viewer .bp-dag-map-only { position: relative; flex: none; width: 32px; min-height: 32px; margin-left: 8px; padding: 0; border: 0; border-radius: var(--dag-radius-control); background: transparent; color: var(--dag-fg); }
.bp-dag-viewer .bp-dag-map-only svg { display: block; width: 18px; height: 18px; margin: auto; }
.bp-dag-viewer .bp-dag-map-only[aria-pressed=true] { background: var(--dag-panel); color: var(--dag-link); }
/* Windows' forced colours drop backgrounds, so the splitter's line and Map only's pressed look take the system's colours. */
@media (forced-colors: active) {
  .bp-dag-splitter:hover::after, .bp-dag-resizing .bp-dag-splitter:focus::after { background: Highlight; forced-color-adjust: none; }
  .bp-dag-viewer .bp-dag-map-only[aria-pressed=true] { border: 2px solid Highlight; }
  .bp-dag-viewer .bp-dag-map-only[aria-pressed=true]::after { inset: -8px; }
}
@media (min-width: 721px) {
  .bp-dag-viewer.bp-dag-integrated.bp-dag-reading-hidden .bp-reading-pane { display: none; }
  .bp-dag-viewer.bp-dag-integrated.bp-dag-reading-hidden .bp-dag-body { grid-template-columns: var(--dag-navigation-width) minmax(0, 1fr); }
}
@media (min-width: 721px) and (max-width: 1100px) {
  .bp-dag-viewer.bp-dag-integrated.bp-dag-reading-hidden .bp-dag-body { grid-template-columns: minmax(0, 1fr); }
}
@media (min-width: 1101px) {
  .bp-dag-viewer.bp-dag-integrated.bp-dag-topics-hidden .bp-dag-navigation { display: none; }
  .bp-dag-viewer.bp-dag-integrated.bp-dag-topics-hidden .bp-dag-body { grid-template-columns: minmax(160px, 1fr) var(--dag-reading-width, minmax(360px, 39%)); }
  .bp-dag-viewer.bp-dag-integrated.bp-dag-topics-hidden.bp-dag-overview-only:not(.bp-dag-sheet-open, .bp-dag-reading-hidden) .bp-dag-body { grid-template-columns: minmax(0, 1fr) 48px; }
  .bp-dag-viewer.bp-dag-integrated.bp-dag-topics-hidden.bp-dag-reading-hidden .bp-dag-body { grid-template-columns: minmax(0, 1fr); }
}
/* A shut map gives its column to the reader, which then takes all the room beside Contents, or the whole width where
   Contents is shut or a drawer. Only a page read in the reader shuts it, and only while it shows the map: an overview's
   collapsed reader, and a list, keep the column. The map's tab and Contents' stand over the reader's edge, the map's above
   when both show, under the reader's splitter, which keeps its grip there, except where a finger's 24px splitter would
   cover them; the article keeps clear of them. A wide reader keeps its lines to a readable length. The first paint's
   frame, which has no stage, shuts the map the reader shut, with its loading notice. */
.bp-dag-viewer .bp-dag-pane-tab-map { display: none; left: 0; border-left: 0; border-radius: 0 var(--dag-radius-control) var(--dag-radius-control) 0; }
@media (min-width: 721px) {
  .bp-dag-integrated .bp-reading-body { padding-inline: max(26px, calc((100% - 880px) / 2)); }
  .bp-dag-viewer.bp-dag-integrated.bp-dag-map-hidden:not(.bp-dag-overview-only:not(.bp-dag-sheet-open), .bp-dag-reading-hidden):is(.bp-book-frame, :has(.bp-dag-stage:not([hidden]))) .bp-dag-body { grid-template-columns: var(--dag-navigation-width) 0 minmax(0, 1fr); }
  .bp-dag-viewer.bp-dag-integrated.bp-dag-map-hidden:not(.bp-dag-overview-only:not(.bp-dag-sheet-open), .bp-dag-reading-hidden):is(.bp-book-frame, :has(.bp-dag-stage:not([hidden]))) .bp-dag-main { overflow: visible; }
  .bp-dag-viewer.bp-dag-integrated.bp-dag-map-hidden:not(.bp-dag-overview-only:not(.bp-dag-sheet-open), .bp-dag-reading-hidden):is(.bp-book-frame, :has(.bp-dag-stage:not([hidden]))) :is(.bp-dag-stage, .bp-dag-map-loading) { visibility: hidden; }
  .bp-dag-viewer.bp-dag-integrated.bp-dag-map-hidden:not(.bp-dag-overview-only:not(.bp-dag-sheet-open), .bp-dag-reading-hidden):is(.bp-book-frame, :has(.bp-dag-stage:not([hidden]))) .bp-dag-pane-tab { z-index: 11; }
  .bp-dag-viewer.bp-dag-integrated.bp-dag-map-hidden:not(.bp-dag-overview-only:not(.bp-dag-sheet-open), .bp-dag-reading-hidden):is(.bp-book-frame, :has(.bp-dag-stage:not([hidden]))) .bp-dag-pane-tab-map { display: block; }
  .bp-dag-viewer.bp-dag-integrated.bp-dag-map-hidden.bp-dag-topics-hidden .bp-dag-pane-tab-map { transform: translateY(calc(-100% - 52px)); }
  .bp-dag-viewer.bp-dag-integrated.bp-dag-map-hidden:not(.bp-dag-overview-only:not(.bp-dag-sheet-open), .bp-dag-reading-hidden):is(.bp-book-frame, :has(.bp-dag-stage:not([hidden]))) .bp-reading-body { padding-left: max(44px, calc((100% - 880px) / 2)); }
}
@media (min-width: 721px) and (pointer: coarse) {
  .bp-dag-viewer.bp-dag-integrated.bp-dag-map-hidden:not(.bp-dag-overview-only:not(.bp-dag-sheet-open), .bp-dag-reading-hidden):is(.bp-book-frame, :has(.bp-dag-stage:not([hidden]))) .bp-dag-pane-tab { z-index: 12; }
}
@media (min-width: 721px) and (max-width: 1100px) {
  .bp-dag-viewer.bp-dag-integrated.bp-dag-map-hidden:not(.bp-dag-overview-only:not(.bp-dag-sheet-open), .bp-dag-reading-hidden):is(.bp-book-frame, :has(.bp-dag-stage:not([hidden]))) .bp-dag-body { grid-template-columns: 0 minmax(0, 1fr); }
}
@media (min-width: 1101px) {
  .bp-dag-viewer.bp-dag-integrated.bp-dag-map-hidden.bp-dag-topics-hidden:not(.bp-dag-overview-only:not(.bp-dag-sheet-open), .bp-dag-reading-hidden):is(.bp-book-frame, :has(.bp-dag-stage:not([hidden]))) .bp-dag-body { grid-template-columns: 0 minmax(0, 1fr); }
}
@media (max-width: 720px) {
  .bp-dag-viewer .bp-dag-map-only { display: none; }
}

/* The whole-project map fills the stage, and the status filter dims it. A map that cannot load leaves a notice in its place. */
.bp-whole-map { position: absolute; inset: 0; z-index: 5; }
.bp-dag-viewer.bp-dag-viewer .bp-dag-map-unavailable { position: absolute; top: 50%; left: 50%; width: max-content; max-width: calc(100% - 32px); margin: 0; padding: 10px 14px; border: 1px solid var(--dag-border); border-radius: var(--dag-radius-control); background: var(--dag-bg); color: var(--dag-muted); box-shadow: var(--dag-e1); font-size: 14px; line-height: 1.45; text-align: center; transform: translate(-50%, -50%); }
/* The map dims what the filter leaves out and hides nothing; a list still offers what it hid. */
.bp-dag-integrated:has(.bp-dag-stage:not([hidden]) > .bp-whole-map) .bp-dag-hidden-button { display: none !important; }
/* The card a name in a statement's Lean shows on hover or focus: the declaration it names, and its file. */
.bp-dag-viewer .bp-lean-card { position: fixed; z-index: 30; width: max-content; max-width: min(560px, calc(100vw - 16px)); max-height: min(360px, 50vh); overflow: auto; padding: 8px 12px; border: 1px solid var(--dag-overlay-border); border-radius: var(--dag-radius-panel); background: var(--dag-bg); color: var(--dag-fg); font-size: 12px; box-shadow: var(--dag-e2); }
/* The card is the code's only frame, as the block is its statement's. */
.bp-dag-viewer .bp-lean-card :is(.bp-lean, .bp-lean > code) { margin: 0; padding: 0; border: 0; background: none; }
.bp-dag-viewer .bp-lean-card-name { margin: 0 0 6px; font-family: var(--dag-mono); font-weight: 600; overflow-wrap: anywhere; }
.bp-dag-viewer .bp-lean-card .bp-lean-where { margin: 6px 0 0; color: var(--dag-muted); font-family: var(--dag-mono); }

/* A project that tracks no Lean (render marks its pages data-tracks-lean="false"): no status filter, and no status on
   the phone's reading handle. Search hits and Browse rows leave out their status themselves. */
[data-tracks-lean="false"] :is(.bp-dag-filters, .bp-dag-sheet-handle .bp-dag-swatch) { display: none !important; }