@geminilight/mindos 0.5.8 → 0.5.10

package/README.md

@@ -70,22 +70,21 @@ All that experience from your conversations — gone the moment you close the wi
 
 **For Humans**
 
-- **GUI Collaboration Workbench**: use one command entry to browse, edit, and search efficiently (`⌘K` / `⌘/`).
-- **Built-in Agent Assistant**: converse in context while edits are captured into managed knowledge.
-- **Plugin Views**: use scenario-focused views like TODO, Kanban, and Timeline.
+- **GUI Workbench**: browse, edit, search notes with unified search + AI entry (`⌘K` / `⌘/`), designed for human-AI co-creation.
+- **Built-in Agent Assistant**: converse with the knowledge base in context; edits seamlessly capture human-curated knowledge.
+- **Plugin Extensions**: multiple built-in renderer plugins — TODO Board, CSV Views, Wiki Graph, Timeline, Agent Inspector, and more.
 
 **For Agents**
 
-- **MCP Server + Skills**: connect any compatible agent to read, write, search, and run workflows.
-- **Structured Templates**: start quickly with Profile, Workflows, and Configurations scaffolds.
-- **Experience Auto-Distillation**: automatically distill daily work into reusable, executable SOP experience.
+- **MCP Server + Skills**: stdio + HTTP dual transport, full-lineup Agent compatible (OpenClaw, Claude Code, Cursor, etc.). Zero-config access.
+- **Structured Templates**: pre-set directory structures for Profiles, Workflows, Configurations, etc., to jumpstart personal context.
+- **Agent-Ready Docs**: everyday notes naturally double as high-quality executable Agent commands — no format conversion needed, write and dispatch.
 
 **Infrastructure**
 
 - **Security**: Bearer Token auth, path sandboxing, INSTRUCTION.md write-protection, atomic writes.
-- **Knowledge Graph**: visualize relationships and dependencies across notes.
-- **Git Time Machine**: track every edit, audit history, and roll back safely.
-- **Cross-Device Sync**: auto-commit, push, and pull via Git — edits on one device appear on all others within minutes.
+- **Knowledge Graph**: dynamically parses and visualizes inter-file references and dependencies.
+- **Git Time Machine**: Git auto-sync (commit/push/pull), records every edit by both humans and Agents. One-click rollback, cross-device sync.
 
 <details>
 <summary><strong>Coming Soon</strong></summary>
@@ -418,7 +417,7 @@ MindOS/
 ~/.mindos/            # User data directory (outside project, never committed)
 ├── config.json       # All configuration (AI keys, port, auth token, sync settings)
 ├── sync-state.json   # Sync state (last sync time, conflicts)
-└── my-mind/          # Your private knowledge base (default path, customizable on onboard)
+└── mind/             # Your private knowledge base (default: ~/MindOS/mind, customizable on onboard)
 ```
 
 ---

package/README_zh.md

@@ -70,22 +70,21 @@ Agent 记了什么、记对没有，用户无从知晓。**MindOS 将每次读
 
 **人类侧**
 
-- **GUI 协作工作台**：以统一入口高效浏览、编辑与搜索（`⌘K` / `⌘/`）。
-- **内置 Agent 助手**：在上下文中对话，编辑内容可持续沉淀为可管理知识。
-- **插件视图**：按场景使用 TODO、看板、时间线等视图。
+- **GUI 工作台**：浏览、编辑、搜索笔记，统一搜索 + AI 入口（`⌘K` / `⌘/`），专为人机共创设计。
+- **内置 Agent 助手**：在上下文中与知识库对话，编辑无缝沉淀为可管理知识。
+- **插件扩展**：多种内置渲染器插件——TODO Board、CSV Views、Wiki Graph、Timeline、Agent Inspector 等。
 
 **Agent 侧**
 
-- **MCP Server + Skills**：让兼容 Agent 统一接入读写、搜索与工作流执行。
-- **结构化模板**：通过 Profile、Workflows、Configurations 快速冷启动。
-- **经验自动沉淀**：将日常记录自动化沉淀为可执行 SOP 经验。
+- **MCP Server + Skills**：stdio + HTTP 双传输，全阵容 Agent 兼容（OpenClaw, Claude Code, Cursor 等），零配置接入。
+- **结构化模板**：预置 Profile、Workflows、Configurations 等目录骨架，快速冷启动个人 Context。
+- **笔记即指令**：日常笔记天然就是 Agent 可直接执行的高质量指令——无需额外格式转换，写下即可调度。
 
 **基础设施**
 
 - **安全防线**：Bearer Token 认证、路径沙箱、INSTRUCTION.md 写保护、原子写入。
-- **知识图谱**：可视化笔记间关系与依赖。
-- **Git 时光机**：记录修改历史，支持审计与安全回滚。
-- **跨设备同步**：通过 Git 自动 commit、push、pull —— 一台设备的编辑几分钟内同步到所有设备。
+- **知识图谱**：动态解析并可视化文件间的引用与依赖关系。
+- **Git 时光机**：Git 自动同步（commit/push/pull），记录人类与 Agent 的每次编辑历史，一键回滚，跨设备同步。
 
 <details>
 <summary><strong>即将到来</strong></summary>

package/app/app/api/mcp/agents/route.ts

@@ -20,6 +20,13 @@ export async function GET() {
         preferredTransport: agent.preferredTransport,
       };
     });
+
+    // Sort: installed first, then detected, then not found
+    agents.sort((a, b) => {
+      const rank = (x: typeof a) => x.installed ? 0 : x.present ? 1 : 2;
+      return rank(a) - rank(b);
+    });
+
     return NextResponse.json({ agents });
   } catch (err) {
     return NextResponse.json({ error: String(err) }, { status: 500 });

package/app/app/api/mcp/install-skill/route.ts

@@ -24,6 +24,12 @@ const AGENT_NAME_MAP: Record<string, string> = {
   'trae': 'trae',
   'openclaw': 'openclaw',
   'codebuddy': 'codebuddy',
+  'iflow-cli': 'iflow-cli',
+  'pi': 'pi',
+  'augment': 'augment',
+  'qwen-code': 'qwen-code',
+  'trae-cn': 'trae-cn',
+  'roo': 'roo',
 };
 
 /* ── Helpers ──────────────────────────────────────────────────── */

package/app/app/api/setup/check-port/route.ts

@@ -27,29 +27,53 @@ async function isSelfPort(port: number): Promise<boolean> {
   }
 }
 
-async function findFreePort(start: number): Promise<number | null> {
+async function findFreePort(start: number, selfPorts: Set<number>): Promise<number | null> {
   for (let p = start; p <= 65535; p++) {
+    if (selfPorts.has(p)) continue;
     if (!await isPortInUse(p)) return p;
   }
   return null;
 }
 
+/**
+ * The port this MindOS web server is actually listening on.
+ * Derived from the incoming request URL — always reliable, no network round-trip.
+ *
+ * Note: We intentionally do NOT read settings here. Settings contain *configured*
+ * ports (webPort / mcpPort), which may not actually be listening yet (e.g. during
+ * first onboard, or if MCP server hasn't started). Treating configured-but-not-
+ * listening ports as "self" would mask real conflicts.
+ */
+function getListeningPort(req: NextRequest): number {
+  return parseInt(req.nextUrl.port || '0', 10);
+}
+
 export async function POST(req: NextRequest) {
   try {
     const { port } = await req.json() as { port: number };
     if (!port || port < 1024 || port > 65535) {
       return NextResponse.json({ error: 'Invalid port' }, { status: 400 });
     }
+
+    const myPort = getListeningPort(req);
+
+    // Fast path: if checking the port we're currently listening on, skip network round-trip
+    if (myPort > 0 && port === myPort) {
+      return NextResponse.json({ available: true, isSelf: true });
+    }
+
     const inUse = await isPortInUse(port);
     if (!inUse) {
       return NextResponse.json({ available: true, isSelf: false });
     }
-    // Port is occupied — check if it's this MindOS instance
+    // Port is occupied — check if it's another MindOS instance
     const self = await isSelfPort(port);
     if (self) {
       return NextResponse.json({ available: true, isSelf: true });
     }
-    const suggestion = await findFreePort(port + 1);
+    const skipPorts = new Set<number>();
+    if (myPort > 0) skipPorts.add(myPort);
+    const suggestion = await findFreePort(port + 1, skipPorts);
     return NextResponse.json({ available: false, isSelf: false, suggestion });
   } catch (err) {
     return NextResponse.json({ error: String(err) }, { status: 500 });

package/app/app/api/setup/route.ts

@@ -67,17 +67,10 @@ export async function POST(req: NextRequest) {
       return NextResponse.json({ error: `Invalid MCP port: ${mcpPortNum}` }, { status: 400 });
     }
 
-    // Apply template if mindRoot doesn't exist or is empty
+    // Apply template (copyRecursive has skip-existing protection)
     const dirExists = fs.existsSync(resolvedRoot);
-    let dirEmpty = true;
-    if (dirExists) {
-      try {
-        const entries = fs.readdirSync(resolvedRoot).filter(e => !e.startsWith('.'));
-        dirEmpty = entries.length === 0;
-      } catch { /* treat as empty */ }
-    }
 
-    if (template && (!dirExists || dirEmpty)) {
+    if (template) {
       applyTemplate(template, resolvedRoot);
     } else if (!dirExists) {
       fs.mkdirSync(resolvedRoot, { recursive: true });

package/app/app/api/skills/route.ts

@@ -9,7 +9,7 @@ const PROJECT_ROOT = path.resolve(process.cwd(), '..');
 
 function getMindRoot(): string {
   const s = readSettings();
-  return s.mindRoot || process.env.MIND_ROOT || path.join(os.homedir(), 'MindOS');
+  return s.mindRoot || process.env.MIND_ROOT || path.join(os.homedir(), 'MindOS', 'mind');
 }
 
 interface SkillInfo {

package/app/app/globals.css

@@ -26,6 +26,9 @@
   --color-input: var(--input);
   --color-border: var(--border);
   --color-destructive: var(--destructive);
+  --color-success: var(--success);
+  --color-error: var(--error);
+  --color-amber-foreground: var(--amber-foreground);
   --color-accent-foreground: var(--accent-foreground);
   --color-accent: var(--accent);
   --color-muted-foreground: var(--muted-foreground);
@@ -63,16 +66,19 @@ body {
   --secondary: #e8e4db;
   --secondary-foreground: #1c1a17;
   --muted: #e8e4db;
-  --muted-foreground: #7a7568;
+  --muted-foreground: #685f52;
   --accent: #d9d3c6;
   --accent-foreground: #1c1a17;
   --destructive: oklch(0.58 0.22 27);
   --border: rgba(28, 26, 23, 0.1);
   --input: rgba(28, 26, 23, 0.12);
-  --ring: rgba(28, 26, 23, 0.3);
+  --ring: var(--amber);
   --radius: 0.5rem;
   --amber: #c8873a;
   --amber-dim: rgba(200, 135, 58, 0.12);
+  --amber-foreground: #131210;
+  --success: #7aad80;
+  --error: #c85050;
   --sidebar: #ede9e1;
   --sidebar-foreground: #1c1a17;
   --sidebar-primary: #1c1a17;
@@ -101,9 +107,12 @@ body {
   --destructive: oklch(0.704 0.191 22.216);
   --border: rgba(232, 228, 220, 0.08);
   --input: rgba(232, 228, 220, 0.1);
-  --ring: rgba(232, 228, 220, 0.2);
+  --ring: var(--amber);
   --amber: #d4954a;
   --amber-dim: rgba(212, 149, 74, 0.12);
+  --amber-foreground: #131210;
+  --success: #7aad80;
+  --error: #c85050;
   --sidebar: #1c1a17;
   --sidebar-foreground: #e8e4dc;
   --sidebar-primary: #d4954a;
@@ -276,6 +285,11 @@ body {
   -webkit-backdrop-filter: blur(8px);
 }
 
+/* Micro type scale: text-2xs = 10px (between nothing and text-xs 12px) */
+@layer utilities {
+  .text-2xs { font-size: 10px; line-height: 1.4; }
+}
+
 /* Hide scrollbar but keep scroll functionality */
 .scrollbar-none { -ms-overflow-style: none; scrollbar-width: none; }
 .scrollbar-none::-webkit-scrollbar { display: none; }
@@ -290,6 +304,16 @@ body {
   button, a { -webkit-tap-highlight-color: transparent; }
 }
 
+/* Respect user's reduced-motion preference */
+@media (prefers-reduced-motion: reduce) {
+  *, *::before, *::after {
+    animation-duration: 0.01ms !important;
+    animation-iteration-count: 1 !important;
+    transition-duration: 0.01ms !important;
+    scroll-behavior: auto !important;
+  }
+}
+
 /* Global focus-visible ring for interactive elements */
 button:focus-visible,
 a:focus-visible,
@@ -325,7 +349,7 @@ a:focus-visible,
 /* Selection */
 .wysiwyg-editor ::selection {
   background: var(--amber);
-  color: #131210;
+  color: var(--amber-foreground);
   opacity: 0.35;
 }
 

package/app/app/login/page.tsx

@@ -90,7 +90,7 @@ function LoginForm() {
               autoFocus
               autoComplete="current-password"
               required
-              className="w-full px-3 py-2 text-sm bg-background border border-border rounded-lg text-foreground placeholder:text-muted-foreground outline-none focus:ring-1 focus:ring-ring disabled:opacity-50"
+              className="w-full px-3 py-2 text-sm bg-background border border-border rounded-lg text-foreground placeholder:text-muted-foreground outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:opacity-50"
             />
           </div>
 
@@ -101,7 +101,7 @@ function LoginForm() {
           <button
             type="submit"
             disabled={loading || !password}
-            className="w-full flex items-center justify-center gap-2 py-2 px-4 rounded-lg text-sm font-medium transition-opacity disabled:opacity-50 disabled:cursor-not-allowed mt-2 bg-[var(--amber)] text-[#131210]"
+            className="w-full flex items-center justify-center gap-2 py-2 px-4 rounded-lg text-sm font-medium transition-opacity disabled:opacity-50 disabled:cursor-not-allowed mt-2 bg-[var(--amber)] text-[var(--amber-foreground)]"
           >
             {loading ? (
               <Loader2 size={14} className="animate-spin" />

package/app/app/view/[...path]/ViewPageClient.tsx

@@ -2,7 +2,7 @@
 
 import { useState, useTransition, useCallback, useEffect, useRef, useSyncExternalStore, useMemo, Suspense } from 'react';
 import { useRouter } from 'next/navigation';
-import { Edit3, Save, X, Loader2, LayoutTemplate, ArrowLeft } from 'lucide-react';
+import { Edit3, Save, X, Loader2, LayoutTemplate, ArrowLeft, Share2, FileText, Code } from 'lucide-react';
 import { lazy } from 'react';
 import MarkdownView from '@/components/MarkdownView';
 import JsonView from '@/components/JsonView';
@@ -118,6 +118,11 @@ export default function ViewPageClient({
       setSaveError('Please enter a file name');
       return;
     }
+    // Reject path traversal and illegal filename characters
+    if (/[/\\:*?"<>|]/.test(trimmed) || trimmed.includes('..')) {
+      setSaveError('File name contains invalid characters');
+      return;
+    }
     if (!createDraftAction) {
       setSaveError('Draft save is not available');
       return;
@@ -213,13 +218,13 @@ export default function ViewPageClient({
 
           <div className="flex items-center gap-1.5 md:gap-2 shrink-0">
             {saveSuccess && (
-              <span className="text-xs flex items-center gap-1.5 font-display" style={{ color: '#7aad80' }}>
-                <span className="w-1.5 h-1.5 rounded-full" style={{ background: '#7aad80' }} />
+              <span className="text-xs flex items-center gap-1.5 font-display" style={{ color: 'var(--success)' }}>
+                <span className="w-1.5 h-1.5 rounded-full" style={{ background: 'var(--success)' }} />
                 <span className="hidden sm:inline">saved</span>
               </span>
             )}
             {saveError && (
-              <span className="text-xs text-red-400 hidden sm:inline">{saveError}</span>
+              <span className="text-xs text-error hidden sm:inline">{saveError}</span>
             )}
 
             {/* Graph toggle — only for md files, hidden when graph plugin is disabled */}
@@ -233,8 +238,8 @@ export default function ViewPageClient({
                 }}
                 title={effectiveGraphMode ? 'Switch to document view' : 'Switch to Wiki Graph'}
               >
-                <span>🕸️</span>
-                <span className="hidden sm:inline">Graph</span>
+                {effectiveGraphMode ? <FileText size={13} /> : <Share2 size={13} />}
+                <span className="hidden sm:inline">{effectiveGraphMode ? 'Doc' : 'Graph'}</span>
               </button>
             )}
 
@@ -244,12 +249,12 @@ export default function ViewPageClient({
                 onClick={handleToggleRaw}
                 className="flex items-center gap-1.5 px-3 py-1.5 rounded-md text-xs font-medium transition-colors font-display"
                 style={{
-                  background: effectiveUseRaw ? 'var(--muted)' : `${'var(--amber)'}22`,
-                  color: effectiveUseRaw ? 'var(--muted-foreground)' : 'var(--amber)',
+                  background: effectiveUseRaw ? `${'var(--amber)'}22` : 'var(--muted)',
+                  color: effectiveUseRaw ? 'var(--amber)' : 'var(--muted-foreground)',
                 }}
                 title={effectiveUseRaw ? `Switch to ${registryRenderer?.name}` : 'View raw'}
               >
-                <LayoutTemplate size={13} />
+                {effectiveUseRaw ? <LayoutTemplate size={13} /> : <Code size={13} />}
                 <span className="hidden sm:inline">{effectiveUseRaw ? registryRenderer.name : 'Raw'}</span>
               </button>
             )}
@@ -283,7 +288,7 @@ export default function ViewPageClient({
                   onClick={isDraft && showSaveAs ? handleConfirmDraftSave : handleSave}
                   disabled={isPending}
                   className="flex items-center gap-1.5 px-3 py-1.5 rounded-md text-xs font-medium disabled:opacity-50 font-display"
-                  style={{ background: 'var(--amber)', color: '#131210' }}
+                  style={{ background: 'var(--amber)', color: 'var(--amber-foreground)' }}
                 >
                   {isPending ? <Loader2 size={13} className="animate-spin" /> : <Save size={13} />}
                   <span className="hidden sm:inline">Save</span>

package/app/app/view/[...path]/not-found.tsx

@@ -69,7 +69,7 @@ export default function ViewNotFound() {
             onClick={handleCreate}
             disabled={creating}
             className="flex items-center gap-2 px-4 py-2.5 text-sm font-medium rounded-lg transition-colors disabled:opacity-50"
-            style={{ background: 'var(--amber)', color: '#131210' }}
+            style={{ background: 'var(--amber)', color: 'var(--amber-foreground)' }}
           >
             <FilePlus size={14} />
             {creating

package/app/components/AskModal.tsx

@@ -289,7 +289,7 @@ export default function AskModal({ open, onClose, currentFile }: AskModalProps)
           {/* Attached file chips */}
           {attachedFiles.length > 0 && (
             <div className="px-4 pt-2.5 pb-1">
-              <div className="text-[11px] text-muted-foreground/70 mb-1.5">Knowledge Base Context</div>
+              <div className="text-xs text-muted-foreground/70 mb-1.5">Knowledge Base Context</div>
               <div className="flex flex-wrap gap-1.5">
                 {attachedFiles.map(f => (
                   <FileChip key={f} path={f} onRemove={() => setAttachedFiles(prev => prev.filter(x => x !== f))} />
@@ -300,7 +300,7 @@ export default function AskModal({ open, onClose, currentFile }: AskModalProps)
 
           {upload.localAttachments.length > 0 && (
             <div className="px-4 pb-1">
-              <div className="text-[11px] text-muted-foreground/70 mb-1.5">Uploaded Files</div>
+              <div className="text-xs text-muted-foreground/70 mb-1.5">Uploaded Files</div>
               <div className="flex flex-wrap gap-1.5">
                 {upload.localAttachments.map((f, idx) => (
                   <FileChip key={`${f.name}-${idx}`} path={f.name} variant="upload" onRemove={() => upload.removeAttachment(idx)} />
@@ -310,7 +310,7 @@ export default function AskModal({ open, onClose, currentFile }: AskModalProps)
           )}
 
           {upload.uploadError && (
-            <div className="px-4 pb-1 text-xs text-red-400">{upload.uploadError}</div>
+            <div className="px-4 pb-1 text-xs text-error">{upload.uploadError}</div>
           )}
 
           {/* @-mention dropdown */}
@@ -371,7 +371,7 @@ export default function AskModal({ open, onClose, currentFile }: AskModalProps)
                 <StopCircle size={15} />
               </button>
             ) : (
-              <button type="submit" disabled={!input.trim()} className="p-1.5 rounded-md disabled:opacity-40 disabled:cursor-not-allowed transition-opacity shrink-0" style={{ background: 'var(--amber)', color: '#131210' }}>
+              <button type="submit" disabled={!input.trim()} className="p-1.5 rounded-md disabled:opacity-40 disabled:cursor-not-allowed transition-opacity shrink-0" style={{ background: 'var(--amber)', color: 'var(--amber-foreground)' }}>
                 <Send size={14} />
               </button>
             )}
@@ -384,7 +384,7 @@ export default function AskModal({ open, onClose, currentFile }: AskModalProps)
           <span><kbd className="font-mono">@</kbd> {t.ask.attachFile}</span>
           <span className="inline-flex items-center gap-1">
             <span>Agent steps</span>
-            <select value={maxSteps} onChange={(e) => setMaxSteps(Number(e.target.value))} disabled={isLoading} className="bg-transparent border border-border rounded px-1.5 py-0.5 text-[11px] text-foreground">
+            <select value={maxSteps} onChange={(e) => setMaxSteps(Number(e.target.value))} disabled={isLoading} className="bg-transparent border border-border rounded px-1.5 py-0.5 text-xs text-foreground">
               <option value={10}>10</option>
               <option value={20}>20</option>
               <option value={30}>30</option>

package/app/components/Breadcrumb.tsx

@@ -5,8 +5,8 @@ import { ChevronRight, Home, FileText, Table, Folder } from 'lucide-react';
 
 function FileTypeIcon({ name }: { name: string }) {
   const ext = name.includes('.') ? name.slice(name.lastIndexOf('.')).toLowerCase() : '';
-  if (ext === '.csv') return <Table size={13} className="text-emerald-400 shrink-0" />;
-  if (ext) return <FileText size={13} className="text-zinc-400 shrink-0" />;
+  if (ext === '.csv') return <Table size={13} className="text-success shrink-0" />;
+  if (ext) return <FileText size={13} className="text-muted-foreground shrink-0" />;
   return <Folder size={13} className="text-yellow-400 shrink-0" />;
 }
 

package/app/components/DirView.tsx

@@ -15,14 +15,14 @@ interface DirViewProps {
 
 function FileIcon({ node }: { node: FileNode }) {
   if (node.type === 'directory') return <Folder size={16} className="text-yellow-400 shrink-0" />;
-  if (node.extension === '.csv') return <Table size={16} className="text-emerald-400 shrink-0" />;
-  return <FileText size={16} className="text-zinc-400 shrink-0" />;
+  if (node.extension === '.csv') return <Table size={16} className="text-success shrink-0" />;
+  return <FileText size={16} className="text-muted-foreground shrink-0" />;
 }
 
 function FileIconLarge({ node }: { node: FileNode }) {
   if (node.type === 'directory') return <FolderOpen size={28} className="text-yellow-400" />;
-  if (node.extension === '.csv') return <Table size={28} className="text-emerald-400" />;
-  return <FileText size={28} className="text-zinc-400" />;
+  if (node.extension === '.csv') return <Table size={28} className="text-success" />;
+  return <FileText size={28} className="text-muted-foreground" />;
 }
 
 function countFiles(node: FileNode): number {
@@ -125,10 +125,10 @@ export default function DirView({ dirPath, entries }: DirViewProps) {
                     {entry.name}
                   </span>
                   {entry.type === 'directory' && (
-                    <span className="text-[10px] text-muted-foreground">{t.dirView.fileCount(fileCounts.get(entry.path) ?? 0)}</span>
+                    <span className="text-2xs text-muted-foreground">{t.dirView.fileCount(fileCounts.get(entry.path) ?? 0)}</span>
                   )}
                   {entry.type === 'file' && entry.mtime && (
-                    <span className="text-[10px] text-muted-foreground font-display" suppressHydrationWarning>
+                    <span className="text-2xs text-muted-foreground font-display" suppressHydrationWarning>
                       {formatTime(entry.mtime)}
                     </span>
                   )}

package/app/components/FileTree.tsx

@@ -16,8 +16,8 @@ interface FileTreeProps {
 
 function getIcon(node: FileNode) {
   if (node.type === 'directory') return null;
-  if (node.extension === '.csv') return <Table size={14} className="text-emerald-400 shrink-0" />;
-  return <FileText size={14} className="text-zinc-400 shrink-0" />;
+  if (node.extension === '.csv') return <Table size={14} className="text-success shrink-0" />;
+  return <FileText size={14} className="text-muted-foreground shrink-0" />;
 }
 
 function getCurrentFilePath(pathname: string): string {
@@ -65,7 +65,7 @@ function NewFileInline({ dirPath, depth, onDone }: { dirPath: string; depth: num
           className="
             flex-1 bg-muted border border-border rounded px-2 py-1
             text-xs text-foreground placeholder:text-muted-foreground
-            focus:outline-none focus:border-blue-500/60
+            focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring
           "
         />
         {isPending
@@ -80,7 +80,7 @@ function NewFileInline({ dirPath, depth, onDone }: { dirPath: string; depth: num
           )
         }
       </div>
-      {error && <p className="text-xs text-red-400 mt-0.5 px-1">{error}</p>}
+      {error && <p className="text-xs text-error mt-0.5 px-1">{error}</p>}
     </div>
   );
 }
@@ -161,7 +161,7 @@ function DirectoryNode({ node, depth, currentPath, onNavigate }: {
             if (e.key === 'Escape') setRenaming(false);
           }}
           onBlur={commitRename}
-          className="w-full bg-muted border border-blue-500/60 rounded px-2 py-0.5 text-xs text-foreground focus:outline-none"
+          className="w-full bg-muted border border-border rounded px-2 py-0.5 text-xs text-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring"
         />
         {isPending && <Loader2 size={12} className="absolute right-3 top-1/2 -translate-y-1/2 animate-spin text-zinc-500" />}
       </div>
@@ -304,7 +304,7 @@ function FileNodeItem({ node, depth, currentPath, onNavigate }: {
             if (e.key === 'Escape') setRenaming(false);
           }}
           onBlur={commitRename}
-          className="w-full bg-muted border border-blue-500/60 rounded px-2 py-0.5 text-xs text-foreground focus:outline-none"
+          className="w-full bg-muted border border-border rounded px-2 py-0.5 text-xs text-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring"
         />
         {isPending && <Loader2 size={12} className="absolute right-3 top-1/2 -translate-y-1/2 animate-spin text-zinc-500" />}
       </div>
@@ -334,7 +334,7 @@ function FileNodeItem({ node, depth, currentPath, onNavigate }: {
         <button onClick={startRename} className="p-0.5 rounded text-muted-foreground hover:text-foreground hover:bg-muted transition-colors" title={t.fileTree.rename}>
           <Pencil size={12} />
         </button>
-        <button onClick={handleDelete} className="p-0.5 rounded text-muted-foreground hover:text-red-400 hover:bg-muted transition-colors" title={t.fileTree.delete}>
+        <button onClick={handleDelete} className="p-0.5 rounded text-muted-foreground hover:text-error hover:bg-muted transition-colors" title={t.fileTree.delete}>
           <Trash2 size={12} />
         </button>
       </div>

package/app/components/HomeContent.tsx

@@ -102,7 +102,7 @@ export default function HomeContent({ recent, existingFiles }: { recent: RecentF
               {suggestions[suggestionIdx]}
             </span>
             <kbd
-              className="hidden sm:inline-flex items-center gap-0.5 px-2 py-0.5 rounded text-[11px] font-mono font-medium"
+              className="hidden sm:inline-flex items-center gap-0.5 px-2 py-0.5 rounded text-xs font-mono font-medium"
               style={{ background: 'var(--amber-dim)', color: 'var(--amber)' }}
             >
               ⌘/
@@ -118,7 +118,7 @@ export default function HomeContent({ recent, existingFiles }: { recent: RecentF
           >
             <Search size={14} />
             <span className="hidden sm:inline">{t.home.shortcuts.searchFiles}</span>
-            <kbd className="hidden sm:inline-flex items-center px-1.5 py-0.5 rounded text-[10px] font-mono" style={{ background: 'var(--muted)' }}>
+            <kbd className="hidden sm:inline-flex items-center px-1.5 py-0.5 rounded text-2xs font-mono" style={{ background: 'var(--muted)' }}>
               ⌘K
             </kbd>
           </button>
@@ -189,17 +189,17 @@ export default function HomeContent({ recent, existingFiles }: { recent: RecentF
                         {r.name}
                       </span>
                     </div>
-                    <p className="text-[11px] leading-relaxed line-clamp-2" style={{ color: 'var(--muted-foreground)' }}>
+                    <p className="text-xs leading-relaxed line-clamp-2" style={{ color: 'var(--muted-foreground)' }}>
                       {r.description}
                     </p>
                     {hintId === r.id ? (
-                      <p className="text-[10px] animate-in" style={{ color: 'var(--amber)' }} role="status">
+                      <p className="text-2xs animate-in" style={{ color: 'var(--amber)' }} role="status">
                         {(t.home.createToActivate ?? 'Create {file} to activate').replace('{file}', entryPath ?? '')}
                       </p>
                     ) : (
                       <div className="flex flex-wrap gap-1">
                         {r.tags.slice(0, 3).map(tag => (
-                          <span key={tag} className="text-[10px] px-1.5 py-0.5 rounded-full" style={{ background: 'var(--muted)', color: 'var(--muted-foreground)' }}>
+                          <span key={tag} className="text-2xs px-1.5 py-0.5 rounded-full" style={{ background: 'var(--muted)', color: 'var(--muted-foreground)' }}>
                             {tag}
                           </span>
                         ))}
@@ -222,12 +222,12 @@ export default function HomeContent({ recent, existingFiles }: { recent: RecentF
                       {r.name}
                     </span>
                   </div>
-                  <p className="text-[11px] leading-relaxed line-clamp-2" style={{ color: 'var(--muted-foreground)' }}>
+                  <p className="text-xs leading-relaxed line-clamp-2" style={{ color: 'var(--muted-foreground)' }}>
                     {r.description}
                   </p>
                   <div className="flex flex-wrap gap-1">
                     {r.tags.slice(0, 3).map(tag => (
-                      <span key={tag} className="text-[10px] px-1.5 py-0.5 rounded-full" style={{ background: 'var(--muted)', color: 'var(--muted-foreground)' }}>
+                      <span key={tag} className="text-2xs px-1.5 py-0.5 rounded-full" style={{ background: 'var(--muted)', color: 'var(--muted-foreground)' }}>
                         {tag}
                       </span>
                     ))}
@@ -278,7 +278,7 @@ export default function HomeContent({ recent, existingFiles }: { recent: RecentF
                       className="flex items-center gap-3 px-3 py-2.5 rounded-lg transition-all duration-100 group-hover:translate-x-0.5 hover:bg-muted"
                     >
                       {isCSV
-                        ? <Table size={13} className="shrink-0" style={{ color: '#7aad80' }} />
+                        ? <Table size={13} className="shrink-0" style={{ color: 'var(--success)' }} />
                         : <FileText size={13} className="shrink-0" style={{ color: 'var(--muted-foreground)' }} />
                       }
                       <div className="flex-1 min-w-0">

package/app/components/OnboardingView.tsx

@@ -110,7 +110,7 @@ export default function OnboardingView() {
 
               {/* Directory preview */}
               <div
-                className="w-full rounded-lg px-3 py-2 text-[11px] leading-relaxed font-display"
+                className="w-full rounded-lg px-3 py-2 text-xs leading-relaxed font-display"
                 style={{
                   background: 'var(--muted)',
                   color: 'var(--muted-foreground)',

package/app/components/SearchModal.tsx

@@ -158,7 +158,7 @@ export default function SearchModal({ open, onClose }: SearchModalProps) {
                 `}
               >
                 {ext === '.csv'
-                  ? <Table size={14} className="text-emerald-400 shrink-0 mt-0.5" />
+                  ? <Table size={14} className="text-success shrink-0 mt-0.5" />
                   : <FileText size={14} className="text-muted-foreground shrink-0 mt-0.5" />
                 }
                 <div className="min-w-0 flex-1">

package/app/components/SettingsModal.tsx

@@ -234,7 +234,7 @@ export default function SettingsModal({ open, onClose, initialTab }: SettingsMod
               )}
               <div className="flex items-center gap-1.5 text-xs">
                 {status === 'saved' && (
-                  <><CheckCircle2 size={13} className="text-green-500" /><span className="text-green-500">{t.settings.saved}</span></>
+                  <><CheckCircle2 size={13} className="text-success" /><span className="text-success">{t.settings.saved}</span></>
                 )}
                 {status === 'error' && (
                   <><AlertCircle size={13} className="text-destructive" /><span className="text-destructive">{t.settings.saveFailed}</span></>
@@ -245,7 +245,7 @@ export default function SettingsModal({ open, onClose, initialTab }: SettingsMod
               onClick={handleSave}
               disabled={saving || !data}
               className="flex items-center gap-1.5 px-4 py-1.5 text-sm rounded-lg disabled:opacity-40 disabled:cursor-not-allowed transition-opacity"
-              style={{ background: 'var(--amber)', color: '#131210' }}
+              style={{ background: 'var(--amber)', color: 'var(--amber-foreground)' }}
             >
               {saving ? <Loader2 size={13} className="animate-spin" /> : <Save size={13} />}
               {t.settings.save}