/* 前台与管理后台共用。只处理外观，不改变容器高度、overflow 或滚轮行为。 */
:root{--ui-scroll-thumb:rgba(100,116,139,.32);--ui-scroll-hover:rgba(100,116,139,.55);--ui-scroll-active:rgba(71,85,105,.7)}
html:has(.studio-shell),html:has(.official),body.studio-theme,.auth-backdrop{
 --ui-scroll-thumb:rgba(173,173,184,.28);--ui-scroll-hover:rgba(188,188,199,.48);--ui-scroll-active:rgba(212,212,221,.64)
}
/* Firefox 使用标准细滚动条；透明轨道融入当前页面底色。 */
*{scrollbar-width:thin;scrollbar-color:var(--ui-scroll-thumb) transparent}
*:hover,*:focus-visible{scrollbar-color:var(--ui-scroll-hover) transparent}
/* Chromium / Safari 使用圆角滑块，保留8px拖动区域，中间滑块宽4px。 */
@supports selector(::-webkit-scrollbar){
 *,*:hover,*:focus-visible{scrollbar-width:auto;scrollbar-color:auto}
 ::-webkit-scrollbar{width:8px;height:8px}
 ::-webkit-scrollbar-track,::-webkit-scrollbar-corner{background:transparent}
 ::-webkit-scrollbar-thumb{min-height:32px;min-width:32px;border:2px solid transparent;border-radius:99px;background:var(--ui-scroll-thumb);background-clip:padding-box}
 :hover::-webkit-scrollbar-thumb,:focus-visible::-webkit-scrollbar-thumb{background-color:var(--ui-scroll-hover)}
 ::-webkit-scrollbar-thumb:active{background-color:var(--ui-scroll-active)}
 ::-webkit-scrollbar-button{display:none;width:0;height:0}
}
/* 高对比度模式交由浏览器保证滑块可辨识。 */
@media(forced-colors:active){
 *,*:hover,*:focus-visible{scrollbar-color:auto;scrollbar-width:auto}
 ::-webkit-scrollbar-thumb{background:CanvasText;border-color:Canvas}
}
