/**
 * Mobile scroll — single window scroll surface (loaded last).
 * No overflow-x:clip on #output or tool shells (causes overflow-y:auto trap + blank scroll).
 */

@media (max-width: 768px) {
  html.cpn-dashboard-root:not(.menu-open):not(.cp-nav-open),
  html.cpn-dashboard-root:not(.menu-open):not(.cp-nav-open) body,
  html.cpn-dashboard-root body:not(.menu-open):not(.cp-nav-open) {
    overflow-x: hidden !important;
    overflow-y: auto !important;
    height: auto !important;
    min-height: 100% !important;
    max-height: none !important;
    position: static !important;
    -webkit-overflow-scrolling: touch;
  }

  html.cpn-dashboard-root.menu-open,
  html.cpn-dashboard-root.cp-nav-open,
  html.cpn-dashboard-root.menu-open body,
  html.cpn-dashboard-root.cp-nav-open body,
  html.cpn-dashboard-root[data-mobile-nav="open"],
  html.cpn-dashboard-root[data-mobile-nav="open"] body {
    overflow: hidden !important;
  }

  html.cpn-dashboard-root .dashboard-wrapper,
  html.cpn-dashboard-root .main,
  html.cpn-dashboard-root #output {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    flex: none !important;
    overflow: visible !important;
    overflow-x: visible !important;
    overflow-y: visible !important;
    -webkit-overflow-scrolling: auto !important;
  }

  html.cpn-dashboard-root #output .section-wrapper,
  html.cpn-dashboard-root #output .cpn-dark-tool-shell,
  html.cpn-dashboard-root #output .pra-dark-shell,
  html.cpn-dashboard-root #output .app-description,
  html.cpn-dashboard-root #output .tool-panel,
  html.cpn-dashboard-root #toolPanel,
  html.cpn-dashboard-root #toolPanel .section-wrapper,
  html.cpn-dashboard-root #toolPanel .cpn-dark-tool-shell {
    overflow: visible !important;
    overflow-x: visible !important;
    overflow-y: visible !important;
    max-height: none !important;
    height: auto !important;
  }

  html.cpn-dashboard-root body.cpn-in-tool-view #output,
  html.cpn-dashboard-root body[data-current-tool]:not([data-current-tool=""]) #output {
    padding-bottom: calc(var(--dash-bottom-nav-h, 56px) + env(safe-area-inset-bottom, 0px) + 32px) !important;
  }
}