/* olit-scrollbar.css —— 全站捲軸
 *
 * 後台(base_site.html,含嵌進全覽畫面的分析頁)與全覽畫面(view.html)共用,
 * 兩邊長得一樣:細、軌道透明、拇指是低飽和灰,沒有上下箭頭。
 * 深淺色跟著 html[data-skin-theme] 換;嵌入的分析頁由 view-layout.js 同步主題,
 * 所以也會跟著變。
 *
 * Chromium 用 ::-webkit-scrollbar。不要在這裡對 Chromium 設標準的
 * scrollbar-color / scrollbar-width —— Chrome 121 之後只要設了標準屬性,
 * ::-webkit-scrollbar 整組就失效,又變回系統原生的樣子。Firefox 才用標準屬性。
 */
:root {
  --ol-sb-thumb: rgba(100, 116, 139, 0.38);
  --ol-sb-thumb-hover: rgba(100, 116, 139, 0.62);
}
:root[data-skin-theme="dark"] {
  --ol-sb-thumb: rgba(148, 163, 184, 0.28);
  --ol-sb-thumb-hover: rgba(148, 163, 184, 0.52);
}

::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track,
::-webkit-scrollbar-corner { background: transparent; }
/* 透明邊框 + padding-box:拇指看起來細一點、離邊緣有一點空隙,但可點範圍不變 */
::-webkit-scrollbar-thumb {
  background-color: var(--ol-sb-thumb);
  background-clip: padding-box;
  border: 2px solid transparent;
  border-radius: 999px;
}
::-webkit-scrollbar-thumb:hover { background-color: var(--ol-sb-thumb-hover); }
::-webkit-scrollbar-thumb:active { background-color: var(--ol-accent, #1e6fd9); }
/* Windows 的上下箭頭方塊 */
::-webkit-scrollbar-button { display: none; width: 0; height: 0; }

@supports not selector(::-webkit-scrollbar) {
  * { scrollbar-width: thin; scrollbar-color: var(--ol-sb-thumb) transparent; }
}