@cordis-tavern/ct-ui-theme

统一 UI token：经 CSSStyleSheet + adoptedStyleSheets 注入全局 CSS 变量。 内置 Dark 主题（中性灰柔和 + 文字重点色），usingTheme 字段预留多主题仓位。

主题状态（持久化）

主题保存在 $CT_HOME/data/ui-theme/theme.json：

{
  "usingTheme": "dark",
  "tokens": {
    "--ct-color-bg": "#181818",
    "…": "…"
  }
}

• usingTheme：当前主题名。目前只支持 dark，后续加 light 等，切换时只改这一行。
• tokens：合并后的完整 token 表（主题默认 + 用户覆盖）。

Dark 主题色卡

主图灰阶

| 变量 | 值 | 说明 | | --- | --- | --- | | --ct-color-bg | #181818 | 页面背景：中性深灰，非纯黑 | | --ct-color-surface | #1F1F1F | 卡片 / 面板表面 | | --ct-color-surface-2 | #262626 | 浮层 / hover / 激活表面 | | --ct-color-border | #333333 | 边框 / 分割线 | | --ct-color-text | #D6D6D6 | 正文文字：柔和浅灰，不纯白 | | --ct-color-text-secondary | #AFAFAF | 次要文字：弱一层的中性灰 | | --ct-color-text-muted | #8A8A8A | 弱化文字：说明、占位、辅助信息 | | --ct-color-text-system | #E2E2E2 | 系统字体：略亮但不刺眼 | | --ct-color-text-accent | #F0F0F0 | 主图亮灰强调：标题、关键块 |

文字重点色

| 变量 | 值 | 说明 | | --- | --- | --- | | --ct-color-text-highlight | #D4B06A | 引号内对话、强调内容、关键短语 |

功能状态色

| 变量 | 值 | 说明 | | --- | --- | --- | | --ct-color-success | #47A76E | 成功状态：饱和度足够，语义清晰 | | --ct-color-warning | #C97A1A | 警告状态：偏 dark 橙色 | | --ct-color-error | #EA6B58 | 错误状态：饱和度足够，可快速识别 | | --ct-color-info | #5B8DEF | 信息状态：低饱和蓝，有功能辨识度 |

React 组件用法：

<div style={{ background: 'var(--ct-color-surface)', color: 'var(--ct-color-text)' }}>
  <span style={{ color: 'var(--ct-color-text-highlight)' }}>强调内容</span>
</div>

Node 侧

• inject: ['persist', 'webServer']
• 主题持久化：$CT_HOME/data/ui-theme/theme.json（persist）
• 传输：GET /api/ct-ui-theme → { usingTheme, tokens, css }

浏览器服务 theme

| 方法 | 说明 | | --- | --- | | getTokens() | token 表副本 | | getCss() | CSS 文本 | | apply() | CSSStyleSheet → replaceSync → document.adoptedStyleSheets |

v1 不提供修改/注册 token 的 API。

装载

ct plugin add -p <环境名> @cordis-tavern/ct-ui-theme

insert[].id: uiTheme。