feat(desktop): 工业化升级 A —— 设计系统地基（primitives + lucide + 语义令牌）

把"手搓内联 class + Unicode 字符图标"换成统一组件与真实图标，为后续工业化打底。

- 依赖：装 lucide-react（描线图标，按需 tree-shake）
- 令牌：tailwind.config 加语义色 brand/accent/success/warn/danger + 圆角档位；
  强调色字面量(violet/cyan/emerald…)收敛到令牌，便于整体换肤
- primitives（src/ui，零重依赖自建）：Button/Input/Textarea/Select/Field/Card/Panel/
  Badge/Dot/Tabs/Skeleton/EmptyState/Dialog/Toast(+useToast)/cn，桶文件统一引入
- 迁移：TopBar/LeftNav/BottomDrawer + Home/Report/Runs/Kb/Placeholder/ExecTrace/
  MemoryPanel/StudioView 全部换 primitives + lucide 图标；导航/能力卡/按钮告别
  ▤◆▣▦ 等 Unicode 字符；错误改用全局 Toast；空状态用 EmptyState
- App 包 ToastProvider

验证：tsc + vite build 通过；浏览器(Preview)走查工作台/报告页——真实图标、统一卡片/
按钮/输入；跑报告端到端正常（执行轨迹 lucide 状态图标点亮、章节耗时/字数/检索片段、
完成弹 Toast + 下载 Word）。

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

sundynix-desktop/frontend/src/panels/MemoryPanel.tsx

@@ -1,40 +1,44 @@
 import { useState } from "react";
+import { Check } from "lucide-react";
 import { setMemory, type Identity } from "../lib/api";
+import { Button, Input, Textarea, Field, useToast } from "../ui";
 
 // 偏好记忆面板 —— 让用户显式登记/纠正模型对自己的记忆（→ PUT /api/v1/memory）。
 export function MemoryPanel({ identity }: { identity: Identity }) {
+  const toast = useToast();
   const [key, setKey] = useState("回答偏好");
   const [value, setValue] = useState("简洁、中文、多给要点");
   const [saved, setSaved] = useState<Array<{ key: string; value: string }>>([]);
-  const [msg, setMsg] = useState("");
 
   const save = async () => {
     if (!key.trim()) return;
     try {
       const m = await setMemory(identity, key.trim(), value.trim());
       setSaved((s) => [{ key: key.trim(), value: value.trim() }, ...s.filter((x) => x.key !== key.trim())]);
-      setMsg(m);
+      toast.push("success", m);
     } catch (e) {
-      setMsg(`✗ ${(e as Error).message}`);
+      toast.push("error", (e as Error).message);
     }
   };
 
-  const inputCls = "rounded-md border border-line bg-ink-800 px-2 py-1 text-sm text-slate-200 focus:border-violet-500/60 focus:outline-none";
   return (
     <section className="border-b border-line p-4">
-      <h2 className="mb-2 text-sm font-semibold text-slate-300">偏好记忆（让模型知道是我）</h2>
-      <div className="flex flex-col gap-2">
-        <input className={inputCls} value={key} onChange={(e) => setKey(e.target.value)} placeholder="键，如 称呼 / 回答偏好" />
-        <textarea className={`${inputCls} h-16 resize-none`} value={value} onChange={(e) => setValue(e.target.value)} placeholder="值" />
-        <button onClick={save} className="self-end rounded-md bg-emerald-600 px-3 py-1 text-sm text-white hover:bg-emerald-500">
+      <h2 className="mb-3 text-sm font-semibold text-slate-300">偏好记忆（让模型知道是我）</h2>
+      <div className="flex flex-col gap-3">
+        <Field label="键">
+          <Input value={key} onChange={(e) => setKey(e.target.value)} placeholder="如 称呼 / 回答偏好" />
+        </Field>
+        <Field label="值">
+          <Textarea className="h-16 resize-none" value={value} onChange={(e) => setValue(e.target.value)} placeholder="值" />
+        </Field>
+        <Button variant="primary" size="sm" icon={Check} className="self-end" onClick={save}>
           记住
-        </button>
+        </Button>
       </div>
-      {msg && <p className="mt-2 text-xs text-emerald-400">{msg}</p>}
       {saved.length > 0 && (
         <ul className="mt-3 space-y-1">
           {saved.map((s) => (
-            <li key={s.key} className="rounded-md bg-ink-800 px-2 py-1 text-xs text-slate-400">
+            <li key={s.key} className="rounded-md bg-ink-800 px-2 py-1.5 text-xs text-slate-400">
               <span className="font-medium text-slate-200">{s.key}</span>：{s.value}
             </li>
           ))}