@umacloud/knowledge 1.0.1

package/design-systems/modern-minimal.md

@@ -0,0 +1,145 @@
+---
+id: modern-minimal
+title: Modern Minimal
+domain: design-systems
+category: modern-minimal.md
+difficulty: intermediate
+tags: [borders, color, component, design-systems, minimal, modern, palette, patterns]
+quality_score: 70
+last_updated: 2026-06-15
+---
+# Modern Minimal
+
+> Precise, geometric, whitespace-first. Inspired by Linear, Vercel, Raycast.
+
+## When to use
+
+SaaS products, developer tools, dashboards, productivity apps. Products where information density matters but visual noise must stay low.
+
+## Color palette
+
+```css
+:root {
+  /* Surface */
+  --color-bg: #fafafa;
+  --color-surface: #ffffff;
+  --color-surface-elevated: #ffffff;
+  --color-surface-sunken: #f4f4f5;
+
+  /* Text */
+  --color-text: #18181b;
+  --color-text-secondary: #71717a;
+  --color-text-tertiary: #a1a1aa;
+
+  /* Brand */
+  --color-primary: #2563eb;
+  --color-primary-hover: #1d4ed8;
+  --color-primary-muted: #dbeafe;
+
+  /* Accent */
+  --color-accent: #8b5cf6;
+
+  /* Status */
+  --color-success: #22c55e;
+  --color-warning: #f59e0b;
+  --color-error: #ef4444;
+
+  /* Border */
+  --color-border: #e4e4e7;
+  --color-border-hover: #d4d4d8;
+  --color-border-focus: #2563eb;
+
+  /* Shadow */
+  --shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.05);
+  --shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.07), 0 2px 4px -2px rgb(0 0 0 / 0.05);
+  --shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.08), 0 4px 6px -4px rgb(0 0 0 / 0.04);
+}
+
+@media (prefers-color-scheme: dark) {
+  :root {
+    --color-bg: #09090b;
+    --color-surface: #18181b;
+    --color-surface-elevated: #27272a;
+    --color-surface-sunken: #09090b;
+    --color-text: #fafafa;
+    --color-text-secondary: #a1a1aa;
+    --color-text-tertiary: #71717a;
+    --color-primary-muted: #1e3a5f;
+    --color-border: #27272a;
+    --color-border-hover: #3f3f46;
+    --shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.3);
+    --shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.4);
+    --shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.5);
+  }
+}
+```
+
+## Typography
+
+- **Headings**: `Inter, -apple-system, BlinkMacSystemFont, sans-serif`, weight 600
+- **Body**: `Inter, -apple-system, BlinkMacSystemFont, sans-serif`, weight 400
+- **Code**: `JetBrains Mono, Menlo, monospace`, weight 400
+
+| Level | Size | Weight | Line-height | Letter-spacing | Use |
+|---|---|---|---|---|---|
+| h1 | 2.25rem (36px) | 700 | 1.2 | -0.025em | Page title |
+| h2 | 1.5rem (24px) | 600 | 1.3 | -0.02em | Section header |
+| h3 | 1.25rem (20px) | 600 | 1.4 | -0.015em | Card title |
+| body-lg | 1.125rem (18px) | 400 | 1.6 | 0 | Hero subtitle |
+| body | 1rem (16px) | 400 | 1.5 | 0 | Default text |
+| body-sm | 0.875rem (14px) | 400 | 1.5 | 0 | Secondary text |
+| caption | 0.75rem (12px) | 500 | 1.4 | 0.02em | Labels, badges |
+
+## Spacing
+
+4px base grid: `4 / 8 / 12 / 16 / 20 / 24 / 32 / 40 / 48 / 64 / 80 / 96`
+
+## Borders & radius
+
+- Default radius: `8px`
+- Small radius: `6px` (badges, tags)
+- Large radius: `12px` (cards, modals)
+- Full radius: `9999px` (pills, avatars)
+- Border width: `1px`
+
+## Component patterns
+
+### Buttons
+- Primary: `bg-primary text-white`, hover darkens 10%, active darkens 15%, disabled opacity 0.5
+- Secondary: `bg-transparent border-default text-primary`, hover bg-surface-sunken
+- Ghost: no border, hover bg-surface-sunken
+- Height: 36px (sm), 40px (md), 44px (lg)
+- Padding: 12px horizontal (sm), 16px (md), 20px (lg)
+- Font: body-sm weight 500
+
+### Cards
+- `bg-surface border-default radius-lg shadow-sm`
+- Hover: `shadow-md border-hover`
+- Padding: 20px (compact), 24px (default)
+
+### Inputs
+- Height: 40px
+- `bg-surface border-default radius-md`
+- Focus: `border-focus shadow(0 0 0 3px primary-muted)`
+- Error: `border-error`
+
+## Motion
+
+- `--transition-fast: 150ms cubic-bezier(0.4, 0, 0.2, 1)` — hover, focus
+- `--transition-normal: 200ms cubic-bezier(0.4, 0, 0.2, 1)` — expand, collapse
+- `--transition-slow: 300ms cubic-bezier(0.4, 0, 0.2, 1)` — modals, drawers
+
+## Do
+
+- Let whitespace do the work. 24-32px between sections minimum.
+- One accent color, used at most 2x per screen.
+- Subtle borders over heavy shadows.
+- Monochrome icons (Lucide stroke width 1.5).
+
+## Don't
+
+- Purple/pink gradient hero backgrounds.
+- More than 2 font weights per page.
+- Shadows heavier than `shadow-md` on cards.
+- Icon + text + icon on every row.
+- Rounded everything (keep some sharp edges for contrast).

package/design-systems/premium-luxury.md

@@ -0,0 +1,106 @@
+---
+id: premium-luxury
+title: Premium Luxury
+domain: design-systems
+category: premium-luxury.md
+difficulty: intermediate
+tags: [luxury, premium, refined, elegant, serif, dark, single-accent, generous-space, design-systems, palette, patterns]
+quality_score: 72
+last_updated: 2026-06-19
+last_note: high-end refined aesthetic
+---
+# Premium Luxury
+
+> 高端、精致、克制：近黑底 + 单一精炼金属/宝石色、大量呼吸留白、优雅的衬线/无衬线对比、慢而顺滑的动效。"$150k 机构感"——少即是贵。
+
+## When to use
+
+奢侈品牌、高端金融/私行/财富、汽车/腕表/珠宝、高端 SaaS / 企业旗舰、会员制产品、精品内容。**核心**：克制是奢华的本质——任何"多"都减分。**不适合**：大众消费打折促销、儿童、数据密集后台。
+
+## Color palette
+
+```css
+:root {
+  --color-bg: #0b0b0c;
+  --color-surface: #131316;
+  --color-surface-elevated: #1b1b1f;
+  --color-text: #f5f3ef;               /* 暖白，非纯白 */
+  --color-text-secondary: #b8b3a8;
+  --color-text-tertiary: #76726a;
+  --color-primary: #c8a96a;            /* 单一精炼金 —— 唯一强调，面积极小 */
+  --color-primary-hover: #d9bd84;
+  --color-accent: #c8a96a;             /* 不引入第二强调色 */
+  --color-success: #7d9a76;
+  --color-error: #b5544e;
+  --color-border: #26262b;
+  --color-border-accent: rgba(200,169,106,0.4);
+  --radius: 4px;                        /* 极小圆角，克制 */
+  --shadow-soft: 0 24px 60px rgba(0,0,0,0.5);
+}
+
+@media (prefers-color-scheme: light) {
+  :root {
+    --color-bg: #faf8f3;               /* 暖象牙白（非奶油 AI 米色——靠极低饱和的真象牙 + 金强调区分） */
+    --color-surface: #ffffff;
+    --color-text: #1a1814;
+    --color-text-secondary: #5c574d;
+    --color-primary: #9a7b3f;          /* 浅底下加深金以保对比 */
+    --color-border: #e7e2d6;
+  }
+}
+```
+
+## Typography
+
+- **Display / Headlines**: `"Canela", "Ogg", "Tiempos Headline", Georgia, serif`（精致衬线建立高级感）weight 400–500
+- **Body / UI**: `"Söhne", "Suisse Int'l", "Neue Haas Grotesk", system-ui, sans-serif`, weight 400
+- 衬线标题 × 无衬线正文的对比，是奢华版式的标志。
+
+| Level | Size | Weight | Line-height | Letter-spacing | Use |
+|---|---|---|---|---|---|
+| display | 4rem (64px) | 400 | 1.05 | -0.01em | Hero（衬线，细 weight 反而更贵） |
+| h1 | 2.5rem (40px) | 500 | 1.15 | -0.005em | Section（衬线） |
+| h2 | 1.5rem (24px) | 500 | 1.25 | 0 | Subsection |
+| body-lg | 1.25rem (20px) | 400 | 1.7 | 0 | Lead（无衬线） |
+| body | 1rem (16px) | 400 | 1.7 | 0 | 正文 |
+| overline | 0.75rem (12px) | 500 | 1.2 | 0.18em | 标签，ALL CAPS，宽字距 |
+
+## Spacing
+
+8px 基，**慷慨**：`8 / 16 / 32 / 64 / 96 / 160 / 240`。Hero 与区块用 160px+ 垂直留白。留白是主角。
+
+## Layout
+
+- 大量负空间；少而精的元素；严格对齐与基线网格。
+- 居中或经典栅格皆可，但**密度低**——一屏只讲一件事。
+- 全幅高质量影像（产品/材质特写）配极简文字。
+
+## Component patterns
+
+### Hero
+- 衬线大标题（细 weight）+ 一行副标 + 一个克制的描边/文字按钮（非实心大色块）。
+- 背景：纯深色或极细的材质纹理；金色仅出现在一处。
+
+### Card
+- 极小圆角、`--shadow-soft` 极柔阴影或 1px `--color-border`；可用"双层内描边"（concentric border）增加精工感。
+- hover：极轻微上浮 + 边框转金，动作慢（500-700ms）。
+
+### Button
+- 首选描边/幽灵按钮或细金线；实心仅留给唯一主 CTA。圆角小。
+
+## Motion
+
+- `--ease: cubic-bezier(0.32, 0.72, 0, 1)`；时长 **500–700ms**（慢即贵）；退场 ≈75%。
+- 入场：缓慢 fade + 轻微上移 + 轻微 blur 收敛；尊重 `prefers-reduced-motion`。
+
+## Do
+
+- 单一金/宝石强调色，面积极小（一屏 1-2 处）。
+- 衬线标题 × 无衬线正文；细字重；宽字距 ALL CAPS 标签。
+- 慷慨留白 + 慢动效 + 高质量影像。
+
+## Don't
+
+- 多强调色、饱和色、渐变、紫色。
+- 拥挤密集、小留白、廉价的实心大色块按钮。
+- 快/弹跳动效（与"贵"相反）；emoji。

package/design-systems/product-type-design-map.md

@@ -0,0 +1,48 @@
+# 产品类型 → 设计推荐表（concrete palette + 字体对，照抄起步）
+
+> 别从空白页开始猜。先按产品类型查这张表拿到**具体起步 token（已做 WCAG 调整）+ 字体对 + 落地结构 + 必避反模式**，再结合所选档位(`anti-ai-slop.md` 的家族)细化。颜色都是语义 token 的起点，不是终点——可调，但要保持一致与对比。
+
+## 用法
+1. 按需求匹配最接近的产品类型行。
+2. 取它的 Primary/Accent/Background 作为 `--color-*` token 起点（仍写进 `:root`，组件里用 var）。
+3. 取字体对作为 display×body（标题/正文对比轴）。
+4. 落地结构与必避项作为硬约束。
+
+## 推荐表
+
+| 产品类型 | 主风格 | Primary | Accent | Background | 字体对(display / body) | 落地结构 | 必避 |
+|---|---|---|---|---|---|---|---|
+| SaaS(通用) | 玻璃+扁平 | `#2563EB` | `#EA580C` | `#F8FAFC` | Geist / Inter | Hero+Features+CTA | 过度动效、默认深色 |
+| 微 SaaS / indie | 扁平+活力 | `#6366F1` | `#059669` | `#F5F3FF` | Space Grotesk / DM Sans | Minimal+Demo | 静态无演示、移动端差 |
+| 电商 | 鲜明块面 | `#059669` | `#EA580C` | `#ECFDF5` | Clash Display / Inter | 商品showcase | 无深度的纯扁平、文字堆砌 |
+| 电商-奢侈 | premium-luxury | `#1C1917` | `#A16207` | `#FAFAF9` | Playfair / Inter | 大图+留白 | 鲜艳/廉价实心按钮 |
+| B2B 服务 | 信任+极简 | `#0F172A` | `#0369A1` | `#F8FAFC` | Söhne / Inter | 信任模块+案例 | 花哨、第二强调色 |
+| 金融仪表盘 | 数据密+深色 | `#0F172A` | `#22C55E` | `#020617` | Inter / Inter | 数据看板 | 涨跌只用色不用符号 |
+| 分析后台 | 数据密+热力 | `#1E40AF` | `#D97706` | `#F8FAFC` | Inter / Inter | 表格+图表 | 小字、gray-on-gray |
+| 医疗健康 | 柔和+可达 | `#0891B2` | `#059669` | `#ECFEFF` | Lora / Raleway | 信任+预约 | AI 紫粉渐变、低对比 |
+| 教育 | claymorphism+微交互 | `#4F46E5` | `#EA580C` | `#EEF2FF` | Fredoka / Nunito | 课程+进度 | 冷峻严肃、密集 |
+| 创意机构 | brutalist-bold+motion | `#0A0A0A` | `#E6FF00` | `#0A0A0A` | Archivo Expanded / Inter Tight | 作品流 | 圆角柔和、居中弱字 |
+| 作品集 | motion+极简 | `#18181B` | `#2563EB` | `#FAFAFA` | Clash Display / Inter | 项目网格 | 千篇一律模板 |
+| 游戏 | 3D+赛博/合成波 | `#7C3AED` | `#F43F5E` | `#0F0F23` | Orbitron / Rajdhani | 沉浸 hero | 平淡无能量 |
+| 金融科技/Crypto | glass-aurora+深色 | `#5E8BFF` | `#36E0C8` | `#07080D` | General Sans / Inter | 实时数据+信任 | 满屏紫渐变、夸大收益 |
+| 约会/社交 | 活力+motion | `#FF4D6D` | `#FF8CC6` | `#FFF0F4` | Cabinet Grotesk / Inter | 卡片流 | 冷淡、低饱和 |
+| 餐饮/美食 | 暖色+motion | `#E2571E` | `#F2B705` | `#FFF8F0` | Recoleta / Inter | 大图诱食 | 冷色、无食物图 |
+| 健身 | 活力+深色 OLED | `#FF6B35` | `#00D4FF` | `#0A0A0A` | Druk / Inter | 强动感 hero | 柔弱、低对比 |
+| 房产 | 玻璃+极简 | `#0077B6` | `#C8A96A` | `#FFFFFF` | Canela / Inter | 大图+地图 | 廉价、密集 |
+| 旅行 | aurora+motion | `#0EA5E9` | `#F59E0B` | `#F0F9FF` | Tiempos / Inter | 目的地大图 | 灰暗无憧憬感 |
+| 音乐流媒体 | 深色 OLED+专辑色 | `#1DB954` | 取自封面 | `#121212` | Inter / Inter | 沉浸播放 | 浅底、低对比 |
+| 开发者工具/IDE | tech-utility/terminal | `#E0E0E0` | `#4AF626` | `#0A0A0A` | Berkeley Mono / Inter | 暗色+蓝焦点 | 花哨、圆润可爱 |
+| AI/大模型产品 | glass-aurora | `#5E8BFF` | `#36E0C8` | `#07080D` | General Sans / Inter | 对话/生成展示 | **`#6366F1` 这种 AI 紫**、满屏渐变 |
+
+## 字体对速查（按气质）
+- 古典优雅(奢侈)：Playfair/Canela × Inter
+- 现代专业(SaaS)：Geist/Poppins × Inter
+- 科技初创(dev/AI)：Space Grotesk/General Sans × DM Sans
+- 极简瑞士(后台)：Inter × Inter（密度优先时唯一可用 Inter 的场景）
+- 活泼创意(儿童/教育)：Fredoka/Cabinet × Nunito
+- 大胆宣言(机构/文化)：Archivo Expanded/Druk × Source Sans
+- 康养平和(健康)：Lora × Raleway
+- 编辑经典(出版)：Cormorant/Tiempos × Libre Baskerville
+
+---
+**注**：`#6366F1 / #7c3aed / #667eea→#764ba2` 是公认的"AI-slop 紫"——即便做 AI 产品也**别**用它当主色/hero 渐变；用上表的电蓝+青绿(glass-aurora)来表达"AI/未来感"。

package/design-systems/soft-warm.md

@@ -0,0 +1,123 @@
+---
+id: soft-warm
+title: Soft Warm
+domain: design-systems
+category: soft-warm.md
+difficulty: intermediate
+tags: [borders, color, component, design-systems, palette, patterns, radius, soft]
+quality_score: 70
+last_updated: 2026-06-15
+---
+# Soft Warm
+
+> Rounded, approachable, warm tones. Inspired by Notion, Headspace, Duolingo.
+
+## When to use
+
+Consumer apps, education, wellness, onboarding flows, community products. Products where friendliness and accessibility matter more than information density.
+
+## Color palette
+
+```css
+:root {
+  --color-bg: #fffbf5;
+  --color-surface: #ffffff;
+  --color-surface-elevated: #ffffff;
+  --color-surface-sunken: #faf5ee;
+  --color-text: #37352f;
+  --color-text-secondary: #787774;
+  --color-text-tertiary: #b4b4b0;
+  --color-primary: #eb5757;
+  --color-primary-hover: #d94444;
+  --color-primary-muted: #fce8e8;
+  --color-accent: #4ea8de;
+  --color-success: #4dab6f;
+  --color-warning: #e9b949;
+  --color-error: #eb5757;
+  --color-border: #e9e5df;
+  --color-border-hover: #ddd9d3;
+  --color-border-focus: #eb5757;
+  --shadow-sm: 0 1px 4px rgb(55 53 47 / 0.06);
+  --shadow-md: 0 4px 16px rgb(55 53 47 / 0.08);
+}
+
+@media (prefers-color-scheme: dark) {
+  :root {
+    --color-bg: #191919;
+    --color-surface: #202020;
+    --color-surface-sunken: #141414;
+    --color-text: #ffffffcf;
+    --color-text-secondary: #ffffff80;
+    --color-border: #ffffff14;
+  }
+}
+```
+
+## Typography
+
+- **Headings**: `"DM Sans", "Nunito", system-ui, sans-serif`, weight 700
+- **Body**: `"DM Sans", "Nunito", system-ui, sans-serif`, weight 400
+
+| Level | Size | Weight | Line-height | Use |
+|---|---|---|---|---|
+| h1 | 2rem (32px) | 700 | 1.25 | Page title |
+| h2 | 1.5rem (24px) | 700 | 1.3 | Section header |
+| h3 | 1.125rem (18px) | 600 | 1.4 | Card title |
+| body | 1rem (16px) | 400 | 1.6 | Default text |
+| body-sm | 0.875rem (14px) | 400 | 1.5 | Secondary text |
+| caption | 0.75rem (12px) | 600 | 1.4 | Labels |
+
+## Spacing
+
+4px base: `4 / 8 / 12 / 16 / 24 / 32 / 48 / 64`
+
+Generous padding. Cards: 24px minimum. Sections: 48-64px vertical.
+
+## Borders & radius
+
+- Default radius: `12px`
+- Small radius: `8px`
+- Large radius: `16px`
+- Full radius: `9999px` (avatars, pills, floating action buttons)
+
+## Component patterns
+
+### Card
+- `bg-surface radius-lg shadow-sm`, 24px padding
+- Hover: translate-y -2px + shadow-md (gentle lift)
+- Colorful left accent stripe (4px, rounded) optional
+
+### Button
+- Primary: `bg-primary text-white radius-full`, 44px height
+- Hover: scale 1.02 + darken 5%
+- Pill-shaped for primary CTAs
+
+### Avatar
+- Circular, border 2px white, pastel background for initials
+- Size: 32px (sm), 40px (md), 56px (lg)
+
+### Toast/notification
+- Rounded, gentle shadow, slide-in from bottom
+- Icon + text, dismiss on swipe
+
+## Motion
+
+- `--transition-fast: 180ms cubic-bezier(0.2, 0, 0, 1)` — hover
+- `--transition-normal: 300ms cubic-bezier(0.2, 0, 0, 1)` — expand
+- `--transition-bounce: 500ms cubic-bezier(0.34, 1.56, 0.64, 1)` — celebratory moments
+
+## Do
+
+- Rounded everything. 12px+ radius gives warmth.
+- Pastel accent colors for backgrounds (muted tints of primary/accent).
+- Playful micro-interactions (button press scale, check animation).
+- Friendly copy ("You're all set!" not "Operation successful").
+- Illustration style over photography when possible.
+
+## Don't
+
+- Sharp corners on interactive elements.
+- Dense data tables (use cards or lists instead).
+- Dark, moody color schemes.
+- Corporate / formal tone in UI copy.
+- Monospace fonts anywhere in the UI.

package/design-systems/tech-utility.md

@@ -0,0 +1,113 @@
+---
+id: tech-utility
+title: Tech Utility
+domain: design-systems
+category: tech-utility.md
+difficulty: intermediate
+tags: [color, component, design-systems, motion, palette, patterns, spacing, tech]
+quality_score: 70
+last_updated: 2026-06-15
+---
+# Tech Utility
+
+> Dense, monospace accents, dark-mode-native. Inspired by GitHub, Datadog, Grafana.
+
+## When to use
+
+CLI companions, code platforms, monitoring dashboards, data tools, developer-facing products. Products where information density is a feature, not a bug.
+
+## Color palette
+
+```css
+:root {
+  --color-bg: #0d1117;
+  --color-surface: #161b22;
+  --color-surface-elevated: #1c2128;
+  --color-surface-sunken: #010409;
+  --color-text: #e6edf3;
+  --color-text-secondary: #8b949e;
+  --color-text-tertiary: #6e7681;
+  --color-primary: #58a6ff;
+  --color-primary-hover: #79c0ff;
+  --color-primary-muted: rgba(56, 139, 253, 0.15);
+  --color-accent: #bc8cff;
+  --color-success: #3fb950;
+  --color-warning: #d29922;
+  --color-error: #f85149;
+  --color-border: #30363d;
+  --color-border-hover: #484f58;
+  --color-border-focus: #58a6ff;
+  --shadow-sm: 0 0 0 1px var(--color-border);
+  --shadow-md: 0 3px 12px rgb(1 4 9 / 0.4);
+}
+
+@media (prefers-color-scheme: light) {
+  :root {
+    --color-bg: #ffffff;
+    --color-surface: #f6f8fa;
+    --color-surface-elevated: #ffffff;
+    --color-text: #1f2328;
+    --color-text-secondary: #656d76;
+    --color-primary: #0969da;
+    --color-border: #d0d7de;
+  }
+}
+```
+
+## Typography
+
+- **Headings**: `"Inter", -apple-system, sans-serif`, weight 600
+- **Body**: `"Inter", -apple-system, sans-serif`, weight 400
+- **Code / Data**: `"JetBrains Mono", "Fira Code", monospace`, weight 400
+
+| Level | Size | Weight | Line-height | Use |
+|---|---|---|---|---|
+| h1 | 1.75rem (28px) | 600 | 1.25 | Page title (compact) |
+| h2 | 1.25rem (20px) | 600 | 1.3 | Section header |
+| h3 | 1rem (16px) | 600 | 1.4 | Panel title |
+| body | 0.875rem (14px) | 400 | 1.5 | Default text |
+| body-sm | 0.8125rem (13px) | 400 | 1.45 | Table cells, metadata |
+| mono | 0.8125rem (13px) | 400 | 1.5 | Code, terminal output |
+| caption | 0.75rem (12px) | 500 | 1.3 | Timestamps, status labels |
+
+## Spacing
+
+4px base: `4 / 8 / 12 / 16 / 24 / 32 / 48`
+
+Tighter than other systems. Panels: 16px padding. Gap between panels: 8-12px.
+
+## Component patterns
+
+### Data table
+- Monospace numbers right-aligned, text left-aligned
+- Alternating row bg: transparent / surface-sunken
+- Sticky header, sortable columns (chevron indicator)
+- Compact row height: 36px
+
+### Status badge
+- Dot (8px circle) + label. Colors: success/warning/error/neutral
+- No filled backgrounds — just colored dot + text
+
+### Code block
+- `bg-surface-sunken`, monospace, line numbers in text-tertiary
+- Copy button top-right, language label top-left
+
+## Motion
+
+- `--transition-fast: 100ms ease` — everything. Tech UIs should feel instant.
+- Minimal animation. No bounces, no spring physics.
+
+## Do
+
+- Smaller base font (14px). Dense but legible.
+- Monospace for any data: timestamps, IDs, metrics, code.
+- Dark mode as the PRIMARY mode (light is the override).
+- Subtle borders over shadows. 1px borders everywhere.
+- Tabular data in actual tables, not cards.
+
+## Don't
+
+- Large hero sections with marketing copy.
+- Rounded card corners > 8px (keep it sharp).
+- Colorful illustrations or decorative elements.
+- More than 2 status colors visible at once per panel.

package/desktop/01-standards/desktop-app-standard.md

@@ -0,0 +1,72 @@
+---
+id: desktop-app-standard
+title: 桌面应用开发标准（Windows/macOS/Linux · 商业级）
+domain: desktop
+category: 01-standards
+difficulty: intermediate
+tags: [桌面, desktop, electron, tauri, windows, macos, linux, 主进程, 渲染进程, ipc, 自动更新, 代码签名, 系统集成, 商业级]
+quality_score: 93
+last_updated: 2026-06-19
+---
+
+# 桌面应用开发标准（Windows/macOS/Linux · 商业级）
+
+> 桌面 App 要做好进程架构、安全、系统集成、打包签名与多平台差异。"把网页用 Electron 一包"远不够商业级。
+
+## 1. 技术选型
+
+- **Tauri**（Rust 后端 + 系统 WebView）：包小(几 MB)、内存省、默认更安全。**新项目推荐**。
+- **Electron**（Chromium + Node）：生态成熟、一致渲染，但包大(~100MB+)、内存高。需要 Node 生态/特定 Chromium 特性时用。
+- **原生 / 跨平台原生**：重性能/深度系统集成 → 原生(SwiftUI/AppKit、WinUI/WPF)、或 Qt/.NET MAUI/Flutter Desktop。
+- 不要为一个简单工具上 Electron 拖出 100MB+ 包；也不要用 web 技术硬做重图形/底层场景。
+
+## 2. 进程架构与 IPC
+
+- **主进程**（系统能力/窗口/生命周期）与**渲染进程/前端**（UI）分离；通过 **IPC** 通信。
+- 渲染层不直接拿系统全权限；系统能力封装在主进程，渲染层经受控 IPC 调用（最小暴露面）。
+- 前端本身仍按前端架构分层（feature/状态/数据访问），系统调用走"桌面能力适配层"。
+
+## 3. 安全（桌面是高权限环境，极重要）
+
+- **Electron**：`contextIsolation: true`、`nodeIntegration: false`、用 `preload` + `contextBridge` 暴露**最小** API；开启 CSP；校验/限制 `webContents` 导航与新窗口；不加载不可信远程内容到有 Node 权限的窗口。
+- **Tauri**：用 **allowlist/capabilities** 最小授权，只开用到的系统能力；校验前端→后端命令参数。
+- 不在渲染层执行不可信代码；IPC 入参当不可信处理(校验)；密钥不放前端。
+- 自动更新走 **HTTPS + 签名校验**，防中间人投毒。
+
+## 4. 系统集成（桌面体验关键）
+
+- 原生菜单（macOS 顶部菜单栏 / Windows 菜单）、托盘(Tray)、系统通知、全局快捷键。
+- 文件系统：打开/保存对话框、拖拽文件、最近文件、关联文件类型。
+- 窗口管理：多窗口、最小化到托盘、记住窗口位置/尺寸、多显示器。
+- 遵循各平台 UI 约定（macOS 与 Windows 的按钮顺序、菜单、快捷键 Cmd vs Ctrl 不同）。
+
+## 5. 打包、签名、分发
+
+- 多平台产物：Windows(`.exe/.msi`)、macOS(`.dmg/.pkg`)、Linux(`.AppImage/.deb/.rpm`)。
+- **代码签名**：Windows 代码签名证书、**macOS 签名 + 公证(notarization)**——不签名会被系统拦截/警告，商业必做。
+- **自动更新**（electron-updater / Tauri updater）：增量/全量、回滚、签名校验、灰度。
+- 包体优化、启动速度；崩溃监控(Sentry)。
+
+## 6. 离线与数据
+
+- 桌面常需离线：本地数据库(SQLite)、本地配置、缓存；联网同步 + 冲突解决。
+- 用户数据存平台标准目录（AppData / Application Support / .config），不要乱放。
+
+## 7. 反模式（出现即不合格）
+
+- Electron 开 `nodeIntegration` + 关 `contextIsolation` + 加载远程内容（远程代码可拿系统权限，重大漏洞）。
+- 渲染层直接全权访问系统/文件/shell；IPC 不校验入参。
+- 不做代码签名/公证（用户装不上或报毒）；自动更新无签名校验。
+- 用 web 范式忽略原生菜单/快捷键/多平台差异(Cmd vs Ctrl)。
+- 简单工具硬上 Electron 拖出超大包。
+
+## 8. 最低交付 checklist
+
+- [ ] 选型合理(优先 Tauri/按需 Electron/原生)；主进程与渲染分离 + 最小 IPC。
+- [ ] 安全：Electron(contextIsolation/nodeIntegration off/preload+contextBridge/CSP) 或 Tauri(allowlist 最小授权)；IPC 入参校验。
+- [ ] 系统集成：原生菜单/托盘/通知/快捷键/文件对话框/窗口记忆/多显示器，遵循各平台约定。
+- [ ] 多平台打包 + 代码签名 + macOS 公证 + 自动更新(签名校验/回滚)。
+- [ ] 离线数据本地库 + 标准用户目录 + 同步冲突处理 + 崩溃监控。
+
+---
+**参考**：Tauri 安全(allowlist/capabilities)、Electron 安全清单(contextIsolation/preload)、代码签名与公证、各平台桌面 UI 约定、自动更新。

package/desktop/01-standards/desktop-design.md

@@ -0,0 +1,71 @@
+---
+id: desktop-design
+title: 桌面端设计规范（macOS HIG / Windows Fluent · 官方）
+domain: desktop
+category: 01-standards
+difficulty: intermediate
+tags: [桌面, desktop, macos, windows, linux, 设计规范, hig, fluent-design, 菜单栏, 快捷键, 多窗口, 平台约定, 商业级]
+quality_score: 92
+last_updated: 2026-06-19
+---
+
+# 桌面端设计规范（macOS HIG / Windows Fluent · 官方）
+
+> 桌面 App 各平台有用户已内化的约定，偏离就产生摩擦。纯底座常把桌面做成"放大的网页"，不遵循 macOS/Windows 原生约定。本标准给出各平台桌面设计要点。
+
+## 1. 通用原则
+
+- 桌面服务**高级用户**：期望深度键盘控制、持久菜单、可调整的多窗口布局、紧密系统集成。
+- 用户通过反复使用形成心智模型——**遵循平台约定**（菜单、快捷键、按钮顺序），不要无理由自创。
+- 信息密度比移动端高，但仍要清晰层次、留白、对齐。
+
+## 2. macOS（遵循 Apple HIG for Mac）
+
+- **必有菜单栏(Menu Bar)**——Mac 命令的主要发现入口。至少包含：**App / File / Edit / View / Window / Help**；非文档型应用可省 File；应用特有菜单放在 Edit 与 View 或 View 与 Window 之间。
+- 标准快捷键：**Cmd** 为修饰键（Cmd+C/V/Z/S/W/Q…），与 Windows 的 Ctrl 不同——不要照搬。
+- 工具栏(Toolbar)、侧边栏(Sidebar) 导航、可调分栏；窗口可缩放、记住尺寸位置；支持全屏、多窗口/标签。
+- 视觉遵循 macOS：系统材质(毛玻璃)、SF 字体、系统控件、浅/深色；遵循 Clarity/Deference/Depth。
+- 系统集成：Dock、菜单栏图标、通知中心、拖放、服务、快捷指令。
+
+## 3. Windows（遵循 Microsoft Fluent Design System）
+
+- 遵循 **Fluent Design**：光(Light)、深度、运动、材质(Acrylic/Mica)、缩放比例。
+- **Ctrl** 为修饰键；标准菜单/快捷键；标题栏 + 可选 Ribbon/菜单；右键上下文菜单。
+- 导航：NavigationView(左侧/顶部)、命令栏(CommandBar)；适配窗口大小/响应式。
+- 用 WinUI/系统控件，支持浅/深色与系统强调色；DPI 缩放适配；触控+鼠标+键盘多输入。
+- 系统集成：任务栏、系统托盘、通知、跳转列表、文件关联。
+
+## 4. Linux
+
+- 遵循目标桌面环境约定（GNOME HIG / KDE HIG）；用对应工具包(GTK/Qt)原生控件。
+- 尊重系统主题/暗色、键盘约定；打包多发行版(AppImage/Flatpak/deb/rpm)。
+
+## 5. 跨平台桌面（Electron/Tauri/Flutter 时）
+
+- **不要一套 UI 硬套所有平台**：菜单/快捷键/按钮顺序按平台适配（Cmd vs Ctrl、确认/取消按钮顺序 mac 与 win 相反）。
+- 用平台原生菜单 API（非自绘网页菜单）；窗口控件(红绿灯 vs 最小化/最大化/关闭)位置按平台。
+- 至少让每个平台"感觉对"，而非在所有平台都像 web。
+
+## 6. 通用桌面交互
+
+- 键盘：完整快捷键 + Tab 焦点顺序 + 可访问性。
+- 多窗口/标签、拖放、右键上下文菜单、撤销/重做、批量操作。
+- 状态保持（窗口位置、上次会话）；空/加载/错误三态；长操作有进度可取消。
+
+## 7. 反模式（出现即不合格 / "像放大的网页"）
+
+- 桌面无原生菜单栏(尤其 macOS)、无快捷键、不能多窗口/调整大小。
+- 一套 UI 套所有平台（Cmd/Ctrl 不分、按钮顺序不对、网页右键菜单）。
+- 不遵循 macOS HIG / Windows Fluent 视觉与控件；不适配 DPI/暗色/系统强调色。
+- 无拖放/上下文菜单/撤销重做等桌面用户期望；不记住窗口状态。
+
+## 8. 最低交付 checklist
+
+- [ ] macOS：原生菜单栏(App/File/Edit/View/Window/Help)+Cmd 快捷键+工具栏/侧边栏+窗口记忆+系统集成。
+- [ ] Windows：Fluent 视觉/材质+Ctrl 快捷键+NavigationView/CommandBar+DPI/暗色/强调色+任务栏/托盘。
+- [ ] Linux：遵循桌面环境 HIG + 原生工具包 + 多发行版打包。
+- [ ] 跨平台：菜单/快捷键/按钮顺序按平台适配，用原生菜单 API。
+- [ ] 键盘全可达 + 多窗口/拖放/上下文菜单/撤销重做 + 窗口状态保持 + 三态。
+
+---
+**参考（官方）**：Apple HIG (macOS)、Microsoft Fluent Design System、GNOME/KDE HIG、各平台键盘与窗口约定。