/* =========================================================
   页面设计令牌
   组件自己的令牌（--arw-*）在 agent-run-widget.css 里，
   这里只放展示页用到的颜色、字体。
   ========================================================= */

:root {
  color-scheme: dark;

  --page-bg: #121212;
  --page-text: #c2c2c2;
  --page-strong: #ececec;
  --page-muted: #8f8f8f;
  --page-rule: #262626;
  --page-hairline: #222222;
  --page-swatch-outline: rgba(255, 255, 255, 0.1);
  --page-control-border: #2a2a2a;
  --page-control-active: #262626;
  --page-control-shadow: none;
  --page-hover: rgba(255, 255, 255, 0.06);
  --page-focus: #659cf9;

  --font-sans: Inter, ui-sans-serif, system-ui, -apple-system, "PingFang SC", "Microsoft YaHei", "Noto Sans SC", "WenQuanYi Zen Hei", sans-serif;
  --font-mono: ui-monospace, "SF Mono", "JetBrains Mono", Menlo, Consolas, monospace;
}

:root[data-theme="light"] {
  color-scheme: light;

  --page-bg: #f3f3f1;
  --page-text: #3b3b3b;
  --page-strong: #141414;
  /* 设计稿为 #737373，在 #F3F3F1 上对比度 4.3:1；略加深到 4.6:1 以满足 WCAG AA */
  --page-muted: #6e6e6e;
  --page-rule: #e6e6e3;
  --page-hairline: #e6e6e3;
  --page-swatch-outline: rgba(0, 0, 0, 0.1);
  --page-control-border: #e3e3e0;
  --page-control-active: #ffffff;
  --page-control-shadow: 0 1px 2px rgba(20, 20, 20, 0.08);
  --page-hover: rgba(20, 20, 20, 0.04);
  --page-focus: #2f6fe4;
}