/* ============================================================
   components/scrollbar.css — 全站统一自定义滚动条（v315 通用组件）
   ------------------------------------------------------------
   设计语言：细长圆角（6px 宽 / 3px 圆角）+ 暖灰滑块 + 拖动时品牌色反馈。
   显示策略：滑块默认透明隐藏，指针移到滚动条所在的 8px 边界带时才显现，
             由 components/scrollbar.js 给容器（页面级给 <html>）加 .is-sb-hover。
             隐藏态滚动条仍占 6px，显隐切换不会引起布局抖动。
   覆盖范围：html 与所有内部溢出容器；用全局伪元素 + 通配重置实现，
             无需为每个容器单独列白名单。
   兼容：WebKit(Chrome/Edge/Safari) ::-webkit-scrollbar 伪元素 +
         Firefox scrollbar-width / scrollbar-color 标准属性。
   依赖：tokens.css（仅 var(--brand) 令牌，色值带 fallback 可独立使用）、
         components/scrollbar.js（显隐触发）。

   抽取自 section.css（原 L24-109），2026-07-12 升级为独立组件；
   2026-10-18 改为"默认隐藏、指针进入滚动条区域才显示"。
   ============================================================ */

/* ══ 默认态：细滚动条 + 滑块透明 ══
   用通配选择器而非继承：避免 html 的显示态被内部容器继承（一显全显）。 */
* {
  scrollbar-width: thin;
  scrollbar-color: transparent transparent;
}

/* ══ 默认态（WebKit）：轨道与滑块均透明 ══ */
::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}

::-webkit-scrollbar-track {
  background: transparent;
}

::-webkit-scrollbar-thumb {
  background: transparent;
  border-radius: 3px;
  transition: background 200ms ease;
}

/* ══ 显示态：.is-sb-hover 由 scrollbar.js 添加 ══ */
.is-sb-hover {
  scrollbar-color: #c8cdd4 transparent;
}

.is-sb-hover::-webkit-scrollbar-thumb {
  background: #c8cdd4;
}

.is-sb-hover::-webkit-scrollbar-thumb:hover {
  background: #b0b7c4;
}

.is-sb-hover::-webkit-scrollbar-thumb:active {
  background: var(--brand, #ef6a4c);
}