/*
 * qywork 网站共用的主题（颜色、字体、圆角、阴影与滚动条）：官网（index.html、404.html）、隐私政策与服务条款（server/src/legal.ts）、
 * console 的登录与账号页、云端操作与管理后台都引用这一份，不另行定义同名变量或滚动条样式。官网的装饰变量写在 index.html 中。
 * 明暗两套按系统设置切换，新增变量两套都要写。黑白灰为主，主按钮与正文同为墨色；紫色只用于少量强调。
 */
:root {
  color-scheme: light dark;
  --bg: #ffffff;
  --bg-alt: #fafafa;
  --bg-raised: #ffffff;
  --bg-inset: #f3f3f4;
  --line: rgba(0, 0, 0, 0.08);
  --line-strong: rgba(0, 0, 0, 0.14);
  --text: #16161a;
  --text-2: #55555e;
  --text-3: #8b8b93;
  --accent: #16161a;
  --accent-hover: #35353b;
  --accent-fg: #ffffff;
  --vivid: #7c3aed;
  --vivid-line: #8b5cf6;
  --vivid-soft: rgba(124, 58, 237, 0.1);
  --ok: #1a7f47;
  --ok-soft: rgba(26, 127, 71, 0.1);
  --warn: #b45309;
  --warn-soft: rgba(180, 83, 9, 0.1);
  --danger: #dc2626;
  --danger-soft: rgba(220, 38, 38, 0.1);
  --grid: rgba(0, 0, 0, 0.045);
  --glow: rgba(124, 58, 237, 0.16);
  --shadow-card: 0 1px 2px rgba(16, 16, 26, 0.04), 0 8px 24px -12px rgba(16, 16, 26, 0.1);
  --shadow-pop: 0 2px 6px rgba(16, 16, 26, 0.06), 0 24px 60px -16px rgba(16, 16, 26, 0.28);
  --font-ui:
    -apple-system, BlinkMacSystemFont, "Segoe UI Variable Display", "Segoe UI", system-ui,
    "PingFang SC", "HarmonyOS Sans SC", "Source Han Sans SC", "Microsoft YaHei", sans-serif;
  --font-mono:
    "Cascadia Code", ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono",
    monospace;
  --radius: 16px;
}
@media (prefers-color-scheme: dark) {
  :root {
    --bg: #0b0b0c;
    --bg-alt: #101012;
    --bg-raised: #151517;
    --bg-inset: #1b1b1e;
    --line: rgba(255, 255, 255, 0.08);
    --line-strong: rgba(255, 255, 255, 0.15);
    --text: #ececef;
    --text-2: #a4a4ad;
    --text-3: #72727c;
    --accent: #f2f2f4;
    --accent-hover: #d6d6da;
    --accent-fg: #16161a;
    --vivid: #a78bfa;
    --vivid-line: #a78bfa;
    --vivid-soft: rgba(167, 139, 250, 0.14);
    --ok: #4ec98a;
    --ok-soft: rgba(78, 201, 138, 0.14);
    --warn: #fbbf24;
    --warn-soft: rgba(251, 191, 36, 0.14);
    --danger: #f87171;
    --danger-soft: rgba(248, 113, 113, 0.14);
    --grid: rgba(255, 255, 255, 0.045);
    --glow: rgba(139, 92, 246, 0.22);
    --shadow-card: 0 1px 2px rgba(0, 0, 0, 0.4), 0 8px 24px -12px rgba(0, 0, 0, 0.6);
    --shadow-pop:
      0 2px 6px rgba(0, 0, 0, 0.5), 0 24px 60px -16px rgba(0, 0, 0, 0.85), 0 0 0 1px
      rgba(255, 255, 255, 0.06);
  }
}

/* 滚动条：细、无箭头、悬停时加深。Chromium 识别到 scrollbar-width 或 scrollbar-color 后忽略全部 ::-webkit-scrollbar 规则，
   退回带箭头按钮的系统滚动条，因此标准属性只写给不支持 ::-webkit-scrollbar 的引擎。滑块宽 = 轨道 12px - 两侧透明边框各 2px。 */
@supports not selector(::-webkit-scrollbar) {
  * {
    scrollbar-width: thin;
    scrollbar-color: var(--line-strong) transparent;
  }
}
*::-webkit-scrollbar {
  width: 12px;
  height: 12px;
}
*::-webkit-scrollbar-track {
  background: transparent;
}
*::-webkit-scrollbar-thumb {
  background: var(--line-strong);
  border: 2px solid transparent;
  border-radius: 999px;
  background-clip: content-box;
}
*::-webkit-scrollbar-thumb:hover {
  background: var(--text-3);
  background-clip: content-box;
}
