/* One scrollbar policy for every surface, including editors and popovers. */
:root{--scroll-thumb:#9587a5;--scroll-thumb-hover:#705d88;--scroll-thumb-active:#514062}
.sidebar{--scroll-thumb:#81758f;--scroll-thumb-hover:#b8a6d0;--scroll-thumb-active:#d5c3ed}
*{scrollbar-width:thin;scrollbar-color:var(--scroll-thumb) transparent}

/* Reserve space in changing lists; content never sits underneath the thumb. */
.page-content,.assistant-messages,#modal-body,.project-list,#assistant-thread-list,
.speaker-options,.choice-list,.time-choices,.attendee-options,.dependency-options{scrollbar-gutter:stable}
.main:is([data-page=assistant],[data-page=calendar])>.page-content{scrollbar-gutter:auto}
.project-list,#assistant-thread-list,.speaker-options,.choice-list,
.editor-step .attendee-options,.dependency-options{padding-inline-end:8px}
#modal-body{padding-inline-end:10px}
.recording-tabs{padding-block-end:8px}
.gantt-scroll,.phone-gantt-scroll,.result-table-scroll{padding-block-end:8px}

@supports selector(::-webkit-scrollbar){
 /* Standard scrollbar-color overrides WebKit painting in recent Chromium. */
 *{scrollbar-width:auto;scrollbar-color:auto}
 *::-webkit-scrollbar{width:12px;height:12px}
 *::-webkit-scrollbar-track{background:transparent;margin:8px;border-radius:12px}
 *::-webkit-scrollbar-thumb{background:var(--scroll-thumb);background-clip:padding-box;border:3px solid transparent;border-radius:12px;min-height:36px;min-width:36px}
 *::-webkit-scrollbar-thumb:hover{background-color:var(--scroll-thumb-hover)}
 *::-webkit-scrollbar-thumb:active{background-color:var(--scroll-thumb-active)}
 *::-webkit-scrollbar-corner{background:transparent}
 *::-webkit-scrollbar-button{display:none;width:0;height:0}
}

@media(max-width:760px){
 /* Touch scrolling is the default: no rails beside text, forms or navigation. */
 *{scrollbar-width:none;scrollbar-gutter:auto}
 *::-webkit-scrollbar{width:0;height:0}
 .page-content,.assistant-messages,#modal-body,.project-list,#assistant-thread-list,
 .speaker-options,.choice-list,.time-choices,.attendee-options,.dependency-options{scrollbar-gutter:auto}
 .project-list,#assistant-thread-list,.speaker-options,.choice-list,
 .editor-step .attendee-options,.dependency-options,#modal-body{padding-inline-end:0}
 /* Wide timelines and tables need a quiet horizontal position indicator. */
 .gantt-scroll,.phone-gantt-scroll,.result-table-scroll{scrollbar-width:thin;scrollbar-color:var(--scroll-thumb) transparent}
 @supports selector(::-webkit-scrollbar){
  .gantt-scroll,.phone-gantt-scroll,.result-table-scroll{scrollbar-width:auto;scrollbar-color:auto}
  .gantt-scroll::-webkit-scrollbar,.phone-gantt-scroll::-webkit-scrollbar,.result-table-scroll::-webkit-scrollbar{width:0;height:8px}
  .gantt-scroll::-webkit-scrollbar-thumb,.phone-gantt-scroll::-webkit-scrollbar-thumb,.result-table-scroll::-webkit-scrollbar-thumb{border-width:2px;min-width:36px}
 }
}

@media(prefers-contrast:more){:root{--scroll-thumb:#6c5a80;--scroll-thumb-hover:#493459}.sidebar{--scroll-thumb:#beacd5}}
@media(forced-colors:active){
 *{scrollbar-width:auto;scrollbar-color:auto}
 *::-webkit-scrollbar{width:14px!important;height:14px!important}
 *::-webkit-scrollbar-thumb{background:CanvasText;border-color:Canvas}
}