.app-scroll-shell { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-rows: minmax(0, 1fr) auto; min-width: 0; min-height: 0; max-height: 100%; }
.app-scroll-shell > .app-scroll-viewport { grid-area: 1 / 1; min-width: 0; min-height: 0; }
.app-scroll-header-controls:not([data-scroll-x="true"]) { display: none; }
.responsive-table table > .app-scroll-header-rowgroup { display: block; padding: 0; }
.responsive-table table > .app-scroll-header-rowgroup[hidden] { display: none; }
.responsive-table:has(.table-sort-button) table > thead:has(+ .app-scroll-header-rowgroup:not([hidden])) { border-bottom: 0; }
.responsive-table table > .app-scroll-header-rowgroup:not([hidden]) { border-bottom: 1px solid var(--color-border); background: transparent; }
.responsive-table table > .app-scroll-header-rowgroup > tr { display: block; padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
.responsive-table table > .app-scroll-header-rowgroup > tr > td { display: block; padding: 0; border: 0; }
.app-scroll-header-rowgroup td::before { display: none; }
.app-data-table.responsive-table table > thead:has(+ .app-scroll-header-rowgroup:not([hidden])),
.app-data-table.responsive-table table > .app-scroll-header-rowgroup,
.app-data-table.responsive-table table > .app-scroll-header-rowgroup > tr,
.app-data-table.responsive-table table > .app-scroll-header-rowgroup > tr:hover,
.app-data-table.responsive-table table > .app-scroll-header-rowgroup > tr > td { background: transparent; background-image: none; box-shadow: none; }
.app-scroll-header-controls > .app-scroll-x { margin: 0 12px var(--space-xs); }
.app-scroll-viewport { scrollbar-width: none; }
.app-scroll-viewport::-webkit-scrollbar { display: none; }
.app-scroll-rail { position: relative; border: 0; padding: 0; border-radius: var(--radius-pill); background: color-mix(in srgb, var(--color-surface-2) 50%, var(--color-border-strong)); touch-action: none; cursor: pointer; }
.app-scroll-rail[hidden] { display: none !important; }
.app-scroll-y { grid-area: 1 / 2; width: 8px; min-height: 0; margin: var(--space-md) var(--space-md) var(--space-md) 0; }
.app-scroll-x { grid-area: 2 / 1; height: 8px; min-width: 0; margin: 0 var(--space-md) var(--space-md); }
.app-scroll-thumb { position: absolute; border-radius: inherit; background: var(--color-primary); cursor: grab; }
.app-scroll-y > .app-scroll-thumb { left: 0; right: 0; }
.app-scroll-x > .app-scroll-thumb { top: 0; bottom: 0; }
.app-scroll-rail:active > .app-scroll-thumb { cursor: grabbing; }
.app-scroll-rail:focus-visible { outline: 2px solid var(--color-primary); outline-offset: 2px; }
.app-scroll-rail.is-pointer-focus:focus { outline: none; box-shadow: none; }
.app-scroll-shell[data-scroll-x="true"] > .responsive-table { overflow-x: auto; }
.app-scroll-shell:has(> :is(.form-grid, #drawerContent, .mo-dialog-body, .ma-dialog-body, .assignment-timeline, .ma-target-list)) { flex: 1; }
.app-scroll-popover:popover-open { display: flex; flex-direction: row; overflow: hidden !important; }
.web-status-stack.app-scroll-popover { display: flex; flex-direction: row; overflow: hidden; }
.web-status-stack.app-scroll-popover > .app-scroll-viewport { display: grid; gap: inherit; }
.web-status-stack .app-scroll-rail { pointer-events: auto; }
.app-scroll-popover > .app-scroll-viewport { flex: 1; min-width: 0; min-height: 0; overflow-y: auto; overflow-x: hidden; align-self: stretch; }
.app-scroll-popover > .app-scroll-y { flex: 0 0 8px; width: 8px; margin: var(--space-xxs) 0 var(--space-xxs) var(--space-xs); }
.app-scroll-popover > .app-scroll-x { display: none; }
@media (forced-colors: active) {
  .app-scroll-rail { forced-color-adjust: none; background: Canvas; border: 1px solid CanvasText; }
  .app-scroll-thumb { forced-color-adjust: none; background: Highlight; }
}