/* Native scroll behavior, one dark treatment for pages, panels and dialogs. */
:root{--scroll-thumb:#766b9c;--scroll-thumb-hover:#ac96de;--scroll-rail-inset:6px;scrollbar-gutter:stable}
*,.scroll-content{scrollbar-width:thin;scrollbar-color:var(--scroll-thumb) transparent}
.prejoin-modal,.document-dialog,.g4-dialog,.disclosure-panel{
  --scroll-rail-inset:18px;
  scrollbar-gutter:stable;
  overscroll-behavior:contain;
}
.prejoin-modal{overflow-x:hidden}
.scroll-content,textarea,pre,.topic-chip,#errors{--scroll-rail-inset:8px}

/* Chromium/WebKit: inset the rail so neither end reaches rounded corners.
   Explicit auto values allow the pseudo-element styling to take effect. */
@supports selector(::-webkit-scrollbar){
  *,.scroll-content{scrollbar-width:auto;scrollbar-color:auto}
  ::-webkit-scrollbar{width:10px;height:10px;background:transparent}
  ::-webkit-scrollbar-track{background:transparent;margin-block:var(--scroll-rail-inset);margin-inline:4px}
  ::-webkit-scrollbar-thumb{min-height:36px;border:3px solid transparent;border-radius:999px;background:var(--scroll-thumb);background-clip:padding-box}
  ::-webkit-scrollbar-thumb:hover{background-color:var(--scroll-thumb-hover)}
  ::-webkit-scrollbar-thumb:active{background-color:#c1a9f2}
  ::-webkit-scrollbar-button{display:none;width:0;height:0}
  ::-webkit-scrollbar-corner{background:transparent}
}
@media(forced-colors:active){
  *,.scroll-content{scrollbar-color:auto}
  ::-webkit-scrollbar-thumb{background-color:ButtonText}
}
