/* Accountability uses the space left by its actual headers and controls.
   Smaller or short windows retain the original document-scrolling layout.
   The chart and outline keep their own scroll/pan area; dialogs stay outside. */
@media screen and (min-width: 901px) and (min-height: 600px) {
  .rh-company-scope .main-shell:has(> .route-accountability) {
    display: flex;
    flex-direction: column;
    height: 100dvh;
    min-height: 0;
  }
  .rh-company-scope .main-shell:has(> .route-accountability) > :is(.topbar, .preview-banner, .development-banner, .save-strip) {
    flex: 0 0 auto;
  }
  .rh-company-scope .route-accountability {
    display: flex;
    flex-direction: column;
    flex: 1 1 0;
    width: 100%;
    min-height: 0;
    padding-block: 20px;
  }
  .rh-company-scope .route-accountability > .accountability-page {
    display: flex;
    flex-direction: column;
    flex: 1 1 0;
    min-height: 0;
  }
  .rh-company-scope .accountability-page > .page-title,
  .rh-company-scope .accountability-page > .chart-overview {
    flex: 0 0 auto;
  }
  .rh-company-scope .accountability-page > .chart-panel {
    display: flex;
    flex-direction: column;
    flex: 1 1 0;
    min-height: 0;
    overflow: visible;
  }
  .rh-company-scope .accountability-page .chart-toolbar,
  .rh-company-scope .accountability-page .chart-location,
  .rh-company-scope .accountability-page .chart-canvas-footer {
    flex: 0 0 auto;
  }
  .rh-company-scope .accountability-page .chart-search-results {
    flex: 0 1 auto;
    min-height: 0;
    max-height: min(25dvh, 240px);
    overflow: auto;
  }
  .rh-company-scope .accountability-page .chart-viewport,
  .rh-company-scope .accountability-page .chart-outline {
    flex: 1 1 0;
    height: auto;
    min-height: 0;
    max-height: none;
    overflow: auto;
    overscroll-behavior: contain;
  }
}