/* Shared overlay appearance; one page rail plus one reusable pane pair. */
:root{
 --page-scroll-hit:18px;
 --page-scroll-inset:8px;
 --page-scroll-width:4px;
 --page-scroll-width-hover:5px;
 --page-scroll-width-active:7px;
 --page-scroll-color:var(--interaction-line-hover);
 --page-scroll-color-hover:var(--interaction-line-drag);
 --page-scroll-color-active:var(--interaction-line-drag);
 --page-scroll-focus:var(--interaction-focus);
}
html.has-page-scrollbar{scrollbar-gutter:auto;scrollbar-width:none}
html.has-page-scrollbar::-webkit-scrollbar{display:none}
.page-scrollbar{
 position:fixed;
 inset:var(--page-scroll-inset) 0 var(--page-scroll-inset) auto;
 width:var(--page-scroll-hit);
 z-index:40;
 touch-action:none;
 user-select:none;
 outline:none;
}
.page-scrollbar[hidden]{display:none}
html.has-panel-scrollbars :is(.module-preview,.comparison-preview,.review-scroll,.canvas-scroll,.left-content,.inspector,.editor-right,.global-nav,.dialog-body,.font-license,.inventory-scroll,.approved-preview,.rt-task-list,.rt-return pre,.resource-tabs,.resource-drawer .resource-page,.workspace-group-content,.workspace-rows,.workspace-row-tabs,.workspace-icon-dock,.workspace-action-menu>.engine-selected-actions,textarea,#dialog){scrollbar-width:none;scrollbar-gutter:auto}
html.has-panel-scrollbars :is(.module-preview,.comparison-preview,.review-scroll,.canvas-scroll,.left-content,.inspector,.editor-right,.global-nav,.dialog-body,.font-license,.inventory-scroll,.approved-preview,.rt-task-list,.rt-return pre,.resource-tabs,.resource-drawer .resource-page,.workspace-group-content,.workspace-rows,.workspace-row-tabs,.workspace-icon-dock,.workspace-action-menu>.engine-selected-actions,textarea,#dialog)::-webkit-scrollbar{display:none}
.panel-scrollbar{inset:auto;z-index:41}
.panel-scrollbar.is-horizontal::before{inset:3px 0}
.panel-scrollbar.is-horizontal .page-scrollbar-thumb{top:auto;bottom:5px;left:0;right:auto;width:var(--page-scroll-thumb-height,40px);height:var(--page-scroll-width);transform:translateX(var(--page-scroll-thumb-top,0px));transition:opacity 240ms ease,height 160ms ease,background-color 160ms ease}
.panel-scrollbar.is-horizontal:hover .page-scrollbar-thumb{height:var(--page-scroll-width-hover)}
.panel-scrollbar.is-horizontal.is-dragging .page-scrollbar-thumb{height:var(--page-scroll-width-active)}
.page-scrollbar::before{
 content:'';
 position:absolute;
 inset:0 3px;
 border-radius:999px;
 background:color-mix(in srgb,var(--line) 48%,transparent);
 opacity:0;
 transition:opacity 180ms ease;
}
.page-scrollbar-thumb{
 position:absolute;
 top:0;
 right:5px;
 width:var(--page-scroll-width);
 height:var(--page-scroll-thumb-height,40px);
 transform:translateY(var(--page-scroll-thumb-top,0px));
 border-radius:999px;
 background:var(--page-scroll-color);
 opacity:0;
 transition:opacity 240ms ease,width 160ms ease,background-color 160ms ease;
 pointer-events:none;
}
.page-scrollbar.is-active .page-scrollbar-thumb{opacity:.65}
.page-scrollbar:is(:hover,:focus-visible,.is-dragging)::before{opacity:1}
.page-scrollbar:hover .page-scrollbar-thumb{
 width:var(--page-scroll-width-hover);
 background:var(--page-scroll-color-hover);
 opacity:.8;
}
.page-scrollbar:focus-visible .page-scrollbar-thumb{opacity:.8}
.page-scrollbar.is-dragging .page-scrollbar-thumb{width:var(--page-scroll-width-active);background:var(--page-scroll-color-active);opacity:1;transition:none}
.panel-scrollbar.is-horizontal:is(:hover,.is-dragging) .page-scrollbar-thumb{width:var(--page-scroll-thumb-height,40px)}
.page-scrollbar:focus-visible::before{outline:2px solid var(--page-scroll-focus);outline-offset:-2px}
.page-scrollbar.is-dragging{cursor:grabbing}
html.is-page-scroll-dragging,html.is-page-scroll-dragging *{user-select:none!important;cursor:grabbing!important}
@media(prefers-reduced-motion:reduce){
 .page-scrollbar::before,.page-scrollbar-thumb,.panel-scrollbar.is-horizontal .page-scrollbar-thumb{transition:none}
}
@media(forced-colors:active),(hover:none),(pointer:coarse){
 html.has-panel-scrollbars :is(.module-preview,.comparison-preview,.review-scroll,.canvas-scroll,.left-content,.inspector,.editor-right,.global-nav,.dialog-body,.font-license,.inventory-scroll,.approved-preview,.rt-task-list,.rt-return pre,.resource-tabs,.resource-drawer .resource-page,.workspace-group-content,.workspace-rows,.workspace-row-tabs,.workspace-icon-dock,.workspace-action-menu>.engine-selected-actions,textarea,#dialog){scrollbar-width:auto}
 html.has-panel-scrollbars :is(.module-preview,.comparison-preview,.review-scroll,.canvas-scroll,.left-content,.inspector,.editor-right,.global-nav,.dialog-body,.font-license,.inventory-scroll,.approved-preview,.rt-task-list,.rt-return pre,.resource-tabs,.resource-drawer .resource-page,.workspace-group-content,.workspace-rows,.workspace-row-tabs,.workspace-icon-dock,.workspace-action-menu>.engine-selected-actions,textarea,#dialog)::-webkit-scrollbar{display:revert}
 html.has-page-scrollbar{scrollbar-width:auto;scrollbar-gutter:stable}
 html.has-page-scrollbar::-webkit-scrollbar{display:revert}
 .page-scrollbar{display:none}
}
@media print{
 .page-scrollbar{display:none}
 html.has-page-scrollbar{scrollbar-width:auto;scrollbar-gutter:auto}
}

.panel-scrollbar[data-workspace-scroll]{z-index:240}
.panel-scrollbar[data-workspace-tabs]{--page-scroll-width:2px;--page-scroll-width-hover:3px;--page-scroll-width-active:4px}
.panel-scrollbar.is-horizontal[data-workspace-tabs] .page-scrollbar-thumb{bottom:1px}
