/*
 * WebUI 设计令牌 v1（design-tokens = 1，02 §2）
 * 唯一视觉真相：业务代码（壳与插件）只允许语义层 var(--*)，
 * 原始层仅供本文件内部使用，禁止业务引用（02 §2.1）。
 * 暗色默认，亮色一等公民，双主题正文对比度 ≥ 4.5:1（02 §6）。
 * 本文件由壳在文档级 <link> 注入（02 §5.1），插件不引入任何样式文件。
 */

:root {
  /* ── 原始层（色板，主题无关；仅设计系统内部）── */
  --gray-0: #ffffff;
  --gray-50: #f7f8fa;
  --gray-100: #eef0f4;
  --gray-200: #e2e5ea;
  --gray-300: #c7ccd4;
  --gray-500: #6b7280;
  --gray-600: #4b5260;
  --gray-700: #3a414d;
  --gray-800: #262b34;
  --gray-900: #161a21;
  --gray-950: #0f1115;
  --gray-975: #0a0c0f;

  --blue-400: #60a5fa;
  --blue-500: #4d8dff;
  --blue-600: #0a5cff;
  --blue-700: #2470ff;

  --green-400: #4ade80;
  --green-600: #15803d;
  --green-50: #f0fdf4;
  --green-950: #052e16;

  --amber-400: #fbbf24;
  --amber-600: #b45309;
  --amber-50: #fffbeb;
  --amber-950: #3a2a03;

  --red-400: #f87171;
  --red-600: #dc2626;
  --red-50: #fef2f2;
  --red-950: #450a0a;

  --blue-50: #eff6ff;
  --blue-950: #0a1c3d;

  /* ── 尺度（主题无关，02 §2.2–2.5）── */

  /* 字号五档：档位外取值即缺陷 */
  --text-xs: 11px;
  --text-sm: 12px;
  --text-base: 13px;
  --text-lg: 16px;
  --text-xl: 20px;

  /* 字重 */
  --font-weight-regular: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-weight-bold: 700;

  /* 行高 */
  --leading-tight: 1.2;
  --leading-normal: 1.5;

  /* 间距：4px 栅格（02 §2.3 阶梯） */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;

  /* 控件高度阶梯（02 §2.4） */
  --control-xs: 24px;
  --control-sm: 28px;
  --control-md: 32px;
  --control-lg: 40px;

  /* 圆角 */
  --radius-sm: 4px;
  --radius-md: 6px;
  --radius-lg: 8px;
  --radius-full: 999px;

  /* 阴影：管理台 UI 层级用边框+背景表达（02 §2.5），--shadow-overlay 仅供弹层；
     --shadow-sm/md 专供访客内容块（站点作者的卡片类块样式槽，55 §2 D4），
     暗色基准（亮段在 [data-theme=light] 覆盖），二者不得混用 */
  --shadow-overlay: 0 8px 24px rgba(0, 0, 0, 0.5);
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.4);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.45);

  /* 边框宽度档（55 §2 D4：块样式槽 border 受控档位；颜色走 --border-* 语义令牌） */
  --border-thin: 1px;
  --border-thick: 2px;

  /* z-index 阶梯：禁止字面量（02 §5.5） */
  --z-dropdown: 100;
  --z-sticky: 200;
  --z-drawer: 300;
  --z-modal: 400;
  --z-toast: 500;

  /* 动效：只做反馈与引导，100–200ms */
  --duration-fast: 100ms;
  --duration-base: 160ms;
  --ease-smooth: cubic-bezier(0.4, 0, 0.2, 1);

  /* 焦点环（键盘可达性单一真相）：可聚焦元素 :focus-visible 统一描边；
     offset 负值用于贴边容器内收环，正值用于离体外放环（交互规范） */
  --focus-ring: 2px solid var(--accent);
  --focus-offset: 1px;
  /* 入场 reveal（39 §5）：发布页块级上移淡入一次性显现——host-client
   * IntersectionObserver 后挂 data-reveal 驱动，prefers-reduced-motion 豁免；
   * SSR 直出内容完整在位（动效仅入场呈现不隐内容，07 §5） */
  --motion-reveal-duration: 240ms;
  --motion-reveal-offset: 16px;
  /* 循环呼吸（状态点 pulse 等持续反馈，非过渡动效） */
  --duration-pulse: 1.6s;

  /* 细条高度（顶部进度条 NProgress） */
  --progress-h: 2px;

  /* 控件容器断点三档（39 §2 冻结）：compact < 480px / regular < 768px / wide ≥ 768px。
   * @container 条件不支持 var()——查询一律用字面量；本组令牌是三档语义常量的
   * 唯一声明处（39 §2「token 化语义常量」），R14 门禁白名单 {480, 768} 与此
   * 对齐防漂移（sdk/gate.mjs 单一真相） */
  --bp-compact: 480px;
  --bp-regular: 768px;

  /* 字体：系统字体栈，禁止内嵌字体（原则七） */
  --font-sans:
    system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial,
    'PingFang SC', 'Microsoft YaHei', sans-serif;
  --font-mono:
    ui-monospace, SFMono-Regular, Consolas, 'Liberation Mono', monospace;
}

/* ── 语义层（业务唯一可用；暗色默认）──
   主题岛支持（66 §2.2）：选择器不限定 :root——任意挂 data-theme 的元素都形成
   主题作用域。设计器画布用包裹元素挂 data-theme 预览站点外观，管理台 chrome
   （在岛外）保持管理员自身主题。自定义属性「自身声明胜继承」，岛内 data-theme
   声明覆盖自文档根继承的主题，与选择器特异性无关；发布页 main 只有 data-site
   无 data-theme，不匹配本段，主题仍由 <html data-theme> 承载，发布链零影响。 */

:root,
[data-theme='dark'] {
  color-scheme: dark;

  --bg-base: var(--gray-950);
  --bg-elevated: var(--gray-900);
  --bg-overlay: #1b2029;
  --bg-sunken: var(--gray-975);

  --text-primary: #e8eaed;
  --text-secondary: #a8b0bc;
  --text-tertiary: #7d8590;
  --text-disabled: var(--gray-600);

  --border-subtle: var(--gray-800);
  --border-strong: var(--gray-700);

  --accent: var(--blue-500);
  --accent-hover: var(--blue-400);
  /* on-color 前景走深字：#0f1115 on #4d8dff ≈ 5.96:1（白字仅 3.2:1，02 §4.4 正文 ≥4.5:1 双主题同守） */
  --accent-text: var(--gray-950);

  --status-ok: var(--green-400);
  --on-ok: var(--green-950);
  --status-warn: var(--amber-400);
  --on-warn: var(--amber-950);
  --status-error: var(--red-400);
  --on-error: var(--red-950);
  --status-info: var(--blue-400);
  --on-info: var(--blue-950);

  /* 图表灰阶（02 §2.1）：暗色按平台原始层取值，显著度序 grid < track ≤ center-outer < tick < tick-major */
  --chart-grid: var(--gray-800);
  --chart-track: var(--gray-700);
  --chart-center-outer: var(--gray-700);
  --chart-tick: var(--gray-600);
  --chart-tick-major: var(--gray-500);
  --chart-center-inner: var(--gray-600);

  /* 语法高亮令牌对（02 §2.7，38 §5.2 D-3）：Shiki 物化 class → 令牌映射承载
     （--syntax-* 亮暗成对；代码块底 --bg-sunken，取值对齐 GitHub Dark 实测对比度） */
  --syntax-keyword: #ff7b72;
  --syntax-string: #a5d6ff;
  --syntax-comment: #8b949e;
  --syntax-number: #79c0ff;
  --syntax-function: #d2a8ff;
  --syntax-constant: #79c0ff;
  --syntax-variable: #ffa657;
  --syntax-operator: #ff7b72;
  --syntax-type: #ffa657;
  --syntax-tag: #7ee787;
  --syntax-attr: #79c0ff;
}

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

  --bg-base: var(--gray-50);
  --bg-elevated: var(--gray-0);
  --bg-overlay: var(--gray-0);
  --bg-sunken: var(--gray-100);

  --text-primary: #1a1d23;
  --text-secondary: var(--gray-600);
  --text-tertiary: var(--gray-500);
  --text-disabled: #9aa1ac;

  --border-subtle: var(--gray-200);
  --border-strong: var(--gray-300);

  --accent: var(--blue-600);
  --accent-hover: var(--blue-700);
  --accent-text: var(--gray-0);

  --status-ok: var(--green-600);
  --on-ok: var(--green-50);
  --status-warn: var(--amber-600);
  --on-warn: var(--amber-50);
  --status-error: var(--red-600);
  --on-error: var(--red-50);
  --status-info: var(--blue-600);
  --on-info: var(--blue-50);

  /* 图表灰阶（02 §2.1）：亮色沿用 IGW-S SpeedometerGauge 实测值（设计保真） */
  --chart-grid: #e5e7eb;
  --chart-track: #dce1e8;
  --chart-center-outer: #c8cdd4;
  --chart-tick: #c0c7cf;
  --chart-tick-major: #8893a0;
  --chart-center-inner: #5a6370;

  /* 语法高亮令牌对（02 §2.7 亮色档；取值对齐 GitHub Light 实测对比度，
     代码块底 --bg-sunken=--gray-100） */
  --syntax-keyword: #cf222e;
  --syntax-string: #0a3069;
  --syntax-comment: #59636e;
  --syntax-number: #0550ae;
  --syntax-function: #8250df;
  --syntax-constant: #0550ae;
  --syntax-variable: #953800;
  --syntax-operator: #cf222e;
  --syntax-type: #953800;
  --syntax-tag: #116329;
  --syntax-attr: #0550ae;

  --shadow-overlay: 0 8px 24px rgba(15, 17, 21, 0.12);
  /* 访客内容块轻阴影亮段（55 §2 D4）：浅色低透明黑，避免亮底下显脏 */
  --shadow-sm: 0 1px 2px rgba(15, 17, 21, 0.06), 0 1px 3px rgba(15, 17, 21, 0.04);
  --shadow-md: 0 2px 8px rgba(15, 17, 21, 0.08), 0 1px 3px rgba(15, 17, 21, 0.06);
}

/* ── 壳布局尺寸（系统内部令牌，02 §3.4 导航布局）── */
:root {
  --topbar-height: 48px;
  --nav-width: 220px;
  /* v4.0 驾驶舱：一级图标导轨宽（系统轨；二级上下文侧栏仍用 --nav-width） */
  --rail-width: 56px;
  /* 发布页内容宽（49 §D-2 所见即所得单一真相）：#host-root 与设计器画布
     同令牌限宽居中——容器查询 @container 三档（768/480）两态同宽同档；
     全宽（full-bleed）诉求由样式槽档位扩展承载，不另开口 */
  --page-w: 1040px;
}
