/* Developer docs shell overrides; main.css is never edited. */
.bb-dev-workspace{display:flex;flex:1;min-width:0;width:100%;max-width:1600px;margin:0 auto}
.bb-dev-sidebar-rail{position:sticky;top:var(--bb-dev-header-h,64px);height:calc(100vh - var(--bb-dev-header-h,64px));flex:0 0 252px;width:252px;border-right:1px solid var(--bb-border-color);background:var(--bb-body-bg);transition:flex-basis .2s ease,width .2s ease;z-index:20}
.bb-dev-sidebar-toolbar{height:39px;display:flex;justify-content:flex-end;align-items:center;border-bottom:1px solid var(--bb-border-color);padding:0 8px}
.bb-dev-sidebar-collapse{height:29px;width:30px;border:1px solid var(--bb-border-color);border-radius:var(--bb-radius,6px);background:var(--bb-body-bg);color:var(--bb-secondary-color);cursor:pointer;display:inline-flex;align-items:center;justify-content:center}
.bb-dev-sidebar-collapse svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.8}
.bb-dev-sidebar-rail .bb-dev-sidebar{position:static;width:100%;max-height:calc(100vh - var(--bb-dev-header-h,64px) - 39px);overflow-y:auto;padding:16px 12px 28px;scrollbar-width:none}
.bb-dev-sidebar-rail .bb-dev-sidebar::-webkit-scrollbar{display:none}
.bb-dev-workspace-content{min-width:0;flex:1;padding:0 28px}
.bb-dev-workspace-content .bb-dev-main{width:100%;max-width:none;padding:16px 0 56px}
.bb-dev-breadcrumb{display:flex;align-items:center;gap:10px;min-height:42px;border-bottom:1px solid var(--bb-border-color);font-size:.8rem;color:var(--bb-secondary-color);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bb-dev-breadcrumb a{color:var(--bb-secondary-color);text-decoration:none}
.bb-dev-breadcrumb a:hover{color:var(--bb-emphasis-color)}
.bb-dev-workspace-content .bb-dev-doc{max-width:1150px;margin:0 auto}
.bb-dev-workspace-content .bb-dev-prose{max-width:820px}
.bb-dev-workspace-content .bb-dev-toc{top:calc(var(--bb-dev-header-h,64px) + 56px)}
.bb-dev-workspace-content .bb-dynamic-docs{display:grid;grid-template-columns:minmax(0,1fr) 195px;max-width:1200px;margin:0 auto;padding:14px 0 48px;gap:36px}
.bb-dev-workspace-content .bb-dynamic-docs-main{min-width:0}
.bb-dev-workspace-content .bb-dynamic-docs-toc{top:calc(var(--bb-dev-header-h,64px) + 56px)}
.bb-dev-sidebar-rail.is-collapsed{flex-basis:46px;width:46px}
.bb-dev-sidebar-rail.is-collapsed #bb-dev-sidebar-panel{display:none}
.bb-dev-sidebar-rail.is-collapsed .bb-dev-sidebar-collapse svg{transform:rotate(180deg)}
.bb-dev-sidebar-rail.is-collapsed .bb-dev-sidebar-toolbar{justify-content:center;padding:0}
.bb-dev-footer{margin-top:auto}
.bb-dev-footer-inner{max-width:1600px}
@media(max-width:1100px){.bb-dev-workspace-content .bb-dynamic-docs{grid-template-columns:minmax(0,1fr)}.bb-dev-workspace-content .bb-dynamic-docs-toc{display:none}.bb-dev-workspace-content{padding:0 20px}}
@media(max-width:760px){.bb-dev-sidebar-rail{position:fixed;top:var(--bb-dev-header-h,64px);left:0;bottom:0;height:auto;width:min(300px,85vw);flex-basis:auto;transform:translateX(-105%);box-shadow:var(--bb-shadow-lg);transition:transform .2s ease}.bb-dev-sidebar-rail.is-mobile-open{transform:translateX(0)}.bb-dev-sidebar-rail.is-collapsed{width:min(300px,85vw)}.bb-dev-sidebar-rail.is-collapsed #bb-dev-sidebar-panel{display:block}.bb-dev-workspace-content{padding:0 16px}.bb-dev-menu-toggle{display:inline-flex}.bb-dev-workspace-content .bb-dev-doc{display:block}.bb-dev-workspace-content .bb-dev-toc{display:none}}
@media(prefers-reduced-motion:reduce){.bb-dev-sidebar-rail{transition:none}}

/* Compact documentation navigation: native theme tokens */
.bb-dev-sidebar-rail .bb-dev-side-group + .bb-dev-side-group { margin-top: 10px; }
.bb-dev-sidebar-rail .bb-dev-side-link { padding-top: 4px; padding-bottom: 4px; line-height: 1.35; font-weight: 400; }
.bb-dev-sidebar-rail .bb-dev-side-title.bb-dev-side-link { padding-top: 6px; padding-bottom: 6px; font-weight: 600; }
.bb-dev-sidebar-rail .bb-dev-side-link:hover { color: var(--bb-emphasis-color); background-color: var(--bb-tertiary-bg); font-weight: inherit; }
.bb-dev-sidebar-rail .bb-dev-side-link.is-active { font-weight: 400; color: var(--bb-emphasis-color); }
.bb-dev-footer-links .bb-dev-status-dot.bb-dev-status-preview { background-color:var(--bb-success); opacity:1; }

/* Navigation typography and rhythm */
.bb-dev-sidebar-rail .bb-dev-side-group + .bb-dev-side-group { margin-top: 8px; }
.bb-dev-sidebar-rail .bb-dev-side-title.bb-dev-side-link {
  margin-bottom: 1px;
  padding-top: 5px;
  padding-bottom: 3px;
  font-size: .70rem;
  font-weight: 700;
  color: var(--bb-emphasis-color);
  background: transparent;
}
.bb-dev-sidebar-rail .bb-dev-side-group > .bb-dev-side-link:not(.bb-dev-side-title) {
  font-size: .84rem;
  padding-top: 3px;
  padding-bottom: 3px;
}
.bb-dev-sidebar-rail .bb-dev-side-title.bb-dev-side-link:hover,
.bb-dev-sidebar-rail .bb-dev-side-title.bb-dev-side-link.is-active,
.bb-dev-sidebar-rail .bb-dev-side-title.bb-dev-side-link:focus-visible {
  color: var(--bb-emphasis-color);
  background: transparent;
  font-weight: 700;
}
.bb-dev-sidebar-rail .bb-dev-side-group > .bb-dev-side-link:not(.bb-dev-side-title):hover {
  color: var(--bb-emphasis-color);
  font-weight: 400;
}
.bb-dev-sidebar-toolbar,
.bb-dev-breadcrumb { border-bottom: none; }

/* Documentation layout: bounded desktop shell with responsive gutters.
   Typography/colors continue to use existing developer theme tokens. */
.bb-dev-header-inner {
  max-width: 1440px;
  margin-inline: auto;
  padding-inline: 24px;
}
.bb-dev-workspace {
  max-width: 1440px;
  margin-inline: auto;
}
.bb-dev-workspace-content {
  padding-inline: 24px;
}
.bb-dev-workspace-content .bb-dev-main {
  padding-inline: 0;
}
.bb-dev-workspace-content .bb-dynamic-docs {
  width: 100%;
  max-width: 1160px;
  margin-inline: auto;
  padding: 14px 0 48px;
  gap: 28px;
  grid-template-columns: minmax(0, 1fr) 190px;
}
.bb-dev-workspace-content .bb-dynamic-docs-main {
  min-width: 0;
}
.bb-dev-workspace-content .bb-dynamic-docs-main h1 {
  font-size: clamp(1.75rem, 2.2vw, 2.15rem);
  line-height: 1.25;
  letter-spacing: -.02em;
}
.bb-dev-sidebar-rail .bb-dev-side-title.bb-dev-side-link {
  font-size: .82rem;
}
.bb-dev-sidebar-rail .bb-dev-side-group > .bb-dev-side-link:not(.bb-dev-side-title) {
  font-size: .94rem;
}
.bb-dev-breadcrumb {
  font-size: .94rem;
}
@media (max-width: 1100px) {
  .bb-dev-workspace-content {
    padding-inline: 20px;
  }
  .bb-dev-workspace-content .bb-dynamic-docs {
    grid-template-columns: minmax(0,1fr);
  }
}
@media (max-width: 760px) {
  .bb-dev-header-inner {
    padding-inline: 16px;
  }
  .bb-dev-workspace-content {
    padding-inline: 16px;
  }
  .bb-dev-workspace-content .bb-dev-main {
    padding-inline: 0;
  }
  .bb-dev-workspace-content .bb-dynamic-docs {
    display: block;
    padding: 16px 0 36px;
  }
}

/* Documentation visual polish: use current theme color tokens. */
.bb-dev-breadcrumb {
  min-height: 56px;
  padding-top: 12px;
  padding-bottom: 10px;
}
.bb-dev-sidebar-toolbar {
  height: 52px;
  padding-top: 10px;
}
.bb-dev-sidebar-rail .bb-dev-sidebar {
  max-height: calc(100vh - var(--bb-dev-header-h,64px) - 52px);
}
.bb-dev-workspace-content .bb-dynamic-docs {
  padding-top: 28px;
}
.bb-dynamic-docs-page-header {
  padding: 0 0 30px;
  margin: 0;
}
.bb-dev-workspace-content .bb-dynamic-docs-page-header h1 {
  margin: 0;
  font-size: clamp(1.65rem, 2vw, 2rem);
  line-height: 1.3;
}
.bb-dev-workspace-content .bb-dynamic-docs-section h2 {
  font-size: clamp(1.2rem, 1.55vw, 1.45rem);
  line-height: 1.35;
  font-weight: 650;
  margin: 0 0 8px;
}
.bb-dev-workspace-content .bb-dynamic-docs-section {
  padding-top: 16px;
}
.bb-dev-workspace-content .bb-dynamic-docs-toc {
  padding-left: 0;
}
.bb-dev-workspace-content .bb-dynamic-docs-toc > strong {
  display: block;
  margin: 0 0 14px;
  font-size: .75rem;
  font-weight: 700;
  letter-spacing: .075em;
  text-transform: uppercase;
  color: var(--bb-secondary-color);
}
.bb-dev-workspace-content .bb-dynamic-docs-toc > a {
  display: block;
  position: relative;
  margin: 0;
  padding: 8px 8px 8px 13px;
  border-radius: 0;
  border-left: 1px solid var(--bb-border-color);
  font-size: .85rem;
  line-height: 1.45;
  color: var(--bb-secondary-color);
  text-decoration: none;
}
.bb-dev-workspace-content .bb-dynamic-docs-toc > a:hover {
  color: var(--bb-emphasis-color);
  background: transparent;
}
.bb-dev-workspace-content .bb-dynamic-docs-toc > a.is-active {
  color: var(--bb-emphasis-color);
  border-left: 2px solid var(--bb-warning, #f0c419);
  padding-left: 12px;
}
@media(max-width:760px) {
  .bb-dev-workspace-content .bb-dynamic-docs { padding-top: 20px; }
  .bb-dynamic-docs-page-header { padding-bottom: 22px; }
}

/* Breadcrumb hierarchy: compact, readable, using existing theme tokens. */
.bb-dev-breadcrumb {
  font-size: .875rem;
  font-weight: 500;
  color: var(--bb-secondary-color);
}
.bb-dev-breadcrumb a {
  color: var(--bb-secondary-color);
  font-weight: 500;
}
.bb-dev-breadcrumb [aria-current="page"] {
  color: var(--bb-emphasis-color);
  font-weight: 600;
}

/* Beta44: category-owned page introduction, separate from section content. */
.bb-dev-workspace-content .bb-dynamic-docs-page-header {
  margin: 0 0 24px;
  padding: 0 0 24px;
  border-bottom: 1px solid var(--bb-border-color);
}
.bb-dev-workspace-content .bb-dynamic-docs-page-header h1 {
  margin: 0 0 12px;
  color: var(--bb-emphasis-color);
}
.bb-dev-workspace-content .bb-dynamic-docs-category-intro {
  white-space: pre-wrap;
  line-height: 1.7;
  font-size: 1rem;
  color: var(--bb-body-color);
  overflow-wrap: anywhere;
}
.bb-dev-workspace-content .bb-dynamic-docs-page-header h1:last-child {
  margin-bottom: 0;
}

/* Beta44 typography hierarchy: category introduction above section content. */
.bb-dev-workspace-content .bb-dynamic-docs-page-header h1 {
  font-weight: 750;
  font-size: clamp(1.85rem, 2.25vw, 2.25rem);
  color: var(--bb-emphasis-color);
}
.bb-dev-workspace-content .bb-dynamic-docs-category-intro {
  font-size: 1.0625rem;
  line-height: 1.75;
}
.bb-dev-workspace-content .bb-dynamic-docs-section .bb-dynamic-docs-content {
  color: var(--bb-body-color);
}

/* Beta45: category-selectable right panel. No empty right column when disabled. */
.bb-dev-workspace-content .bb-dynamic-docs.bb-dynamic-docs-no-toc {
  grid-template-columns: minmax(0, 1fr);
}
.bb-dev-workspace-content .bb-dynamic-docs-section .bb-dev-lead {
  color: var(--bb-body-color);
}

/* Beta46: improve contrast in right-side document navigation. */
.bb-dev-workspace-content .bb-dynamic-docs-toc > a:not(.is-active) {
  color: var(--bb-body-color);
}