feat(design): design/ 真相源 + 防漂移静态闸（#25）

真相源整固：
- design/index.html 登记簿：token 色板（var() 实时渲染）/ 组件登记卡 /
  图标与跨端映射 / guidelines / ui_kits 单一入口，check-ds 强制登记
- design/icons.js 图标单源（Lucide 线条）+ icon-map.json 跨端映射表
  （web/iOS/Android 三列，iOS 12 个 SF Symbol 全部收编登记）
- components/core/Icon.jsx 单源图标渲染器；MicBar/RecognitionOverlay 接入
- tokens 新增 --brand-wechat(-press)（微信官方绿）与 --overlay-wave
- fonts.css 弃 Google Fonts CDN，Outfit 可变字体自托管
  （assets/outfit-latin.woff2，40KB；中国网络下 CDN 不可用会卡字体）
- design/serve.mjs 零依赖预览服务器（登记簿与原型评审入口）

codegen 强化（export-tokens.mjs）：
- 产物直写消费位置：ios/dudu/Shared/DuduTheme.swift、
  android/.../design/DuduTheme.kt——删除 design-pipeline/generated/
  中间拷贝层（此前 app 内是手工拷贝，--check 守不到真实消费文件已漂移）
- 新增 web/tokens.css 产物（custom props 透传 + Outfit data URI 内嵌）
- tokens 文件遍历排序，产物确定性

存量收编：
- desktop：三个窗口内联 SVG → Icon 组件；tray 裸 rgba → token+opacity
- Android：LoginScreen 微信绿常量 → DuduPalette.brandWechat(Press)，
  Color.White → textOnAccent
- 官网 web/index.html：接入 tokens.css，34 处硬编码 hex 全部 var() 化；
  深色板块（metrics/cta/footer）改挂 data-theme="dark" 复用 dark 令牌；
  移除 Google Fonts CDN
- design 包内 8 处裸色：微信绿 token 化、装饰色 ds-ignore 白名单、
  同值色改 var() 引用

防漂移闸（零依赖 Node）：
- design-pipeline/check-ds.mjs：真相源自检 7 道（dark⊆light / var 链 /
  裸色∈tokens 值集 / 组件登记 / icons 唯一 / icon-map 双向同集 / 禁 emoji）
- design-pipeline/check-code.mjs：代码侧单源（desktop 禁字面色+内联 path /
  iOS 禁字面色+SF Symbol 同集 / Android 禁 Color(0x / web 禁字面色），
  ds-ignore 行级豁免制
- .githooks/pre-commit（启用：git config core.hooksPath .githooks）
- CI design job 扩展为三道闸全绿
- 反向验证通过：注入裸色/孤儿 token/未登记组件/未登记 symbol 均被拦截

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

desktop/src/feedback/main.jsx

@@ -4,6 +4,7 @@ import { useEffect, useRef, useState } from 'react';
 import { createRoot } from 'react-dom/client';
 import '@dudu/design/styles.css';
 import { Button } from '@dudu/design/components/core/Button';
+import { Icon } from '@dudu/design/components/core/Icon';
 import { Switch } from '@dudu/design/components/forms/Switch';
 import { SettingRow } from '@dudu/design/components/forms/SettingRow';
 import { invoke } from '../shared/tauri';
@@ -45,7 +46,7 @@ function Thumb({ img, onRemove }) {
         background: 'var(--text-1)', color: 'var(--bg-app)',
         display: 'flex', alignItems: 'center', justifyContent: 'center', padding: 0,
       }}>
-        <svg width="10" height="10" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="3" strokeLinecap="round"><path d="M18 6 6 18M6 6l12 12"/></svg>
+        <Icon name="x" size={10} sw={3} />
       </button>
     </div>
   );
@@ -65,11 +66,7 @@ function AddBox({ onClick, dragging }) {
         display: 'flex', alignItems: 'center', justifyContent: 'center',
         transition: 'border-color var(--dur-fast) var(--ease-out)',
       }}>
-      {/* Lucide image-plus */}
-      <svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
-        <path d="M16 5h6"/><path d="M19 2v6"/><path d="M21 11.5V19a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h7.5"/>
-        <circle cx="9" cy="9" r="2"/><path d="m21 15-3.086-3.086a2 2 0 0 0-2.828 0L6 21"/>
-      </svg>
+      <Icon name="imagePlus" size={20} />
     </button>
   );
 }
@@ -81,7 +78,7 @@ function SuccessView({ onAgain }) {
         width: 56, height: 56, borderRadius: '50%', background: 'var(--positive-soft)', color: 'var(--positive)',
         display: 'flex', alignItems: 'center', justifyContent: 'center',
       }}>
-        <svg width="28" height="28" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2.5" strokeLinecap="round" strokeLinejoin="round"><path d="M20 6 9 17l-5-5"/></svg>
+        <Icon name="check" size={28} sw={2.5} />
       </span>
       <div style={{ fontSize: 17, fontWeight: 'var(--weight-semibold)', color: 'var(--text-1)' }}>已收到 · 谢谢你</div>
       <Button variant="ghost" size="sm" onClick={onAgain}>继续反馈</Button>

desktop/src/login/main.jsx

@@ -5,6 +5,7 @@ import { createRoot } from 'react-dom/client';
 import '@dudu/design/styles.css';
 import { Button } from '@dudu/design/components/core/Button';
 import { Badge } from '@dudu/design/components/core/Badge';
+import { Icon } from '@dudu/design/components/core/Icon';
 import { invoke } from '../shared/tauri';
 import { setThemePref } from '../shared/theme';
 import { usePoll } from '../shared/usePoll';
@@ -172,7 +173,7 @@ function LoginApp() {
         width: 56, height: 56, borderRadius: '50%', background: 'var(--positive-soft)', color: 'var(--positive)',
         display: 'flex', alignItems: 'center', justifyContent: 'center', fontSize: 28,
       }}>
-        <svg width="28" height="28" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2.5" strokeLinecap="round" strokeLinejoin="round"><path d="M20 6 9 17l-5-5"/></svg>
+        <Icon name="check" size={28} sw={2.5} />
       </span>
       <div style={{ fontSize: 'var(--text-lg)', fontWeight: 'var(--weight-semibold)', color: 'var(--text-1)' }}>已到账 {pack.minutes} 分钟</div>
       <div style={{ fontSize: 'var(--text-sm)', color: 'var(--text-2)', textAlign: 'center' }}>

desktop/src/onboarding/main.jsx

@@ -6,6 +6,7 @@ import '@dudu/design/styles.css';
 import { Button } from '@dudu/design/components/core/Button';
 import { Badge } from '@dudu/design/components/core/Badge';
 import { HotkeyCombo } from '@dudu/design/components/core/Kbd';
+import { Icon } from '@dudu/design/components/core/Icon';
 import { invoke } from '../shared/tauri';
 import { setThemePref } from '../shared/theme';
 import { usePoll } from '../shared/usePoll';
@@ -56,17 +57,9 @@ function PermCard({ icon, title, desc, granted, onGrant }) {
   );
 }
 
-const MicIcon = (
-  <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
-    <path d="M12 19v3"/><path d="M19 10v2a7 7 0 0 1-14 0v-2"/><rect x="9" y="2" width="6" height="13" rx="3"/>
-  </svg>
-);
+const MicIcon = <Icon name="mic" size={18} />;
 
-const KeyIcon = (
-  <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
-    <path d="m15.5 7.5 3 3L22 7l-3-3"/><path d="m21 2-9.6 9.6"/><circle cx="7.5" cy="15.5" r="5.5"/>
-  </svg>
-);
+const KeyIcon = <Icon name="key" size={18} />;
 
 function OnboardingApp() {
   const [step, setStep] = useState(0);
@@ -105,9 +98,7 @@ function OnboardingApp() {
           width: 64, height: 64, borderRadius: 18, background: 'var(--accent)', color: 'var(--text-on-accent)',
           display: 'flex', alignItems: 'center', justifyContent: 'center', margin: '0 auto',
         }}>
-          <svg width="30" height="30" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
-            <path d="M12 19v3"/><path d="M19 10v2a7 7 0 0 1-14 0v-2"/><rect x="9" y="2" width="6" height="13" rx="3"/>
-          </svg>
+          <Icon name="mic" size={30} />
         </span>
         <Title>dudu 语音输入</Title>
         <Desc>按住快捷键说话，松开文字就出现在光标处<br />全程比打字快三倍</Desc>

desktop/src/tray/main.jsx

@@ -18,7 +18,7 @@ function Item({ children, right, onClick }) {
         transition: 'background var(--dur-fast) var(--ease-out)',
       }}>
       <span style={{ whiteSpace: 'nowrap' }}>{children}</span>
-      {right && <span style={{ fontSize: 'var(--text-xs)', color: hover ? 'rgba(255,255,255,.8)' : 'var(--text-3)' }}>{right}</span>}
+      {right && <span style={{ fontSize: 'var(--text-xs)', color: hover ? 'var(--text-on-accent)' : 'var(--text-3)', opacity: hover ? 0.8 : 1 }}>{right}</span>}
     </div>
   );
 }