@kl-c/matrixos 0.1.7 → 0.1.9

package/dist/config/schema/oh-my-opencode-config.d.ts

@@ -2459,6 +2459,12 @@ export declare const OhMyOpenCodeConfigSchema: z.ZodObject<{
             restart: "restart";
             safe: "safe";
         }>>;
+        hookRecursionWindowMs: z.ZodDefault<z.ZodNumber>;
+        hookRecursionThreshold: z.ZodDefault<z.ZodNumber>;
+        contextBloatMaxTokens: z.ZodDefault<z.ZodNumber>;
+        contextBloatStuckSec: z.ZodDefault<z.ZodNumber>;
+        zombieSessionIdleSec: z.ZodDefault<z.ZodNumber>;
+        runawayTaskTimeoutSec: z.ZodDefault<z.ZodNumber>;
         heartbeatIntervalSec: z.ZodDefault<z.ZodNumber>;
         heartbeatFilePath: z.ZodDefault<z.ZodString>;
         fatalMarkerPath: z.ZodDefault<z.ZodString>;

package/dist/config/schema/watchdog.d.ts

@@ -16,6 +16,12 @@ export declare const WatchdogConfigSchema: z.ZodObject<{
         restart: "restart";
         safe: "safe";
     }>>;
+    hookRecursionWindowMs: z.ZodDefault<z.ZodNumber>;
+    hookRecursionThreshold: z.ZodDefault<z.ZodNumber>;
+    contextBloatMaxTokens: z.ZodDefault<z.ZodNumber>;
+    contextBloatStuckSec: z.ZodDefault<z.ZodNumber>;
+    zombieSessionIdleSec: z.ZodDefault<z.ZodNumber>;
+    runawayTaskTimeoutSec: z.ZodDefault<z.ZodNumber>;
     heartbeatIntervalSec: z.ZodDefault<z.ZodNumber>;
     heartbeatFilePath: z.ZodDefault<z.ZodString>;
     fatalMarkerPath: z.ZodDefault<z.ZodString>;

package/dist/features/anti-loop/background-registry.d.ts

@@ -0,0 +1,10 @@
+export interface BackgroundTaskRecord {
+    taskId: string;
+    startedAt: number;
+    completedAt?: number;
+    status: "running" | "completed";
+}
+export declare function registerBackgroundTask(taskId: string): void;
+export declare function completeBackgroundTask(taskId: string): void;
+export declare function getRunningTasks(): BackgroundTaskRecord[];
+export declare function getTaskAgeMs(taskId: string): number | undefined;

package/dist/features/dashboard/frontend/css/style.css

@@ -0,0 +1,211 @@
+:root {
+  --bg-base: #0A0B0E; --bg-surface: #12131A; --bg-card: #1A1B25; --bg-card-hover: #1E1F2B;
+  --bg-elevated: #222330; --border-default: #2A2B35; --border-subtle: #1E1F2B;
+  --accent-primary: #7C5CFC; --accent-hover: #9278FF; --accent-muted: rgba(124,92,252,0.12);
+  --accent-secondary: #00D4FF; --success: #22C55E; --success-muted: rgba(34,197,94,0.12);
+  --warning: #F59E0B; --warning-muted: rgba(245,158,11,0.12);
+  --danger: #EF4444; --danger-muted: rgba(239,68,68,0.12);
+  --info: #3B82F6; --info-muted: rgba(59,130,246,0.12);
+  --text-primary: #F0F1F5; --text-secondary: #8B8D97; --text-tertiary: #5A5C66;
+  --font-body: "Inter",system-ui,sans-serif; --font-mono: "JetBrains Mono",monospace;
+  --text-xs: 11px; --text-sm: 12.5px; --text-base: 14px; --text-lg: 17px; --text-xl: 20px; --text-2xl: 24px;
+  --space-1: 4px; --space-2: 8px; --space-3: 12px; --space-4: 16px; --space-5: 20px; --space-6: 24px;
+  --radius-sm: 4px; --radius-md: 6px; --radius-lg: 8px; --radius-xl: 12px; --radius-full: 9999px;
+  --shadow-sm: 0 2px 4px rgba(0,0,0,0.3); --sidebar-w: 240px; --header-h: 56px;
+}
+*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
+html{font-size:16px;-webkit-font-smoothing:antialiased}
+body{font-family:var(--font-body);font-size:var(--text-base);color:var(--text-primary);background:var(--bg-base);display:flex;min-height:100vh}
+.sidebar{width:var(--sidebar-w);min-width:var(--sidebar-w);background:var(--bg-surface);border-right:1px solid var(--border-default);display:flex;flex-direction:column;height:100vh;position:sticky;top:0}
+.sidebar-logo{height:var(--header-h);display:flex;align-items:center;padding:0 var(--space-5);border-bottom:1px solid var(--border-default);gap:var(--space-3)}
+.sidebar-logo-text{font-size:var(--text-lg);font-weight:700;font-family:var(--font-mono);color:var(--accent-secondary);letter-spacing:-.5px}
+.sidebar-logo-version{font-size:var(--text-xs);color:var(--text-tertiary);font-family:var(--font-mono)}
+.sidebar-nav{flex:1;padding:var(--space-4) var(--space-3);display:flex;flex-direction:column;gap:var(--space-1);overflow-y:auto}
+.sidebar-section{font-size:var(--text-xs);font-weight:600;color:var(--text-tertiary);text-transform:uppercase;letter-spacing:.8px;padding:var(--space-4) var(--space-3) var(--space-2)}
+.sidebar-item{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-2) var(--space-3);border-radius:var(--radius-lg);color:var(--text-secondary);font-size:var(--text-sm);font-weight:500;cursor:pointer;transition:all .15s;text-decoration:none}
+.sidebar-item:hover{background:var(--bg-card);color:var(--text-primary)}
+.sidebar-item.active{background:var(--accent-muted);color:var(--accent-primary)}
+.sidebar-item svg{flex-shrink:0;opacity:.7}.sidebar-item.active svg{opacity:1}
+.sidebar-badge{margin-left:auto;font-size:var(--text-xs);font-family:var(--font-mono);font-weight:500;background:var(--accent-muted);color:var(--accent-primary);padding:1px 6px;border-radius:var(--radius-full);min-width:20px;text-align:center}
+.sidebar-badge.danger{background:var(--danger-muted);color:var(--danger)}
+.sidebar-footer{padding:var(--space-4) var(--space-5);border-top:1px solid var(--border-default);display:flex;align-items:center;gap:var(--space-3)}
+.sidebar-avatar{width:32px;height:32px;border-radius:var(--radius-full);background:linear-gradient(135deg,var(--accent-primary),var(--accent-secondary));display:flex;align-items:center;justify-content:center;font-size:var(--text-xs);font-weight:700;color:#fff;flex-shrink:0}
+.sidebar-user-info{flex:1;min-width:0}
+.sidebar-user-name{font-size:var(--text-sm);font-weight:500;color:var(--text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
+.sidebar-user-role{font-size:var(--text-xs);color:var(--text-tertiary)}
+.main{flex:1;display:flex;flex-direction:column;min-width:0;height:100vh}
+.header{height:var(--header-h);display:flex;align-items:center;justify-content:space-between;padding:0 var(--space-6);border-bottom:1px solid var(--border-default);background:var(--bg-surface);flex-shrink:0}
+.header-left{display:flex;align-items:center;gap:var(--space-6)}
+.header-right{display:flex;align-items:center;gap:var(--space-3)}
+.header-tabs{display:flex;gap:var(--space-1);background:var(--bg-base);padding:3px;border-radius:var(--radius-lg)}
+.header-tab{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-3);border-radius:var(--radius-md);font-size:var(--text-sm);font-weight:500;color:var(--text-secondary);cursor:pointer;transition:all .15s;border:none;background:none;white-space:nowrap}
+.header-tab:hover{color:var(--text-primary);background:var(--bg-card)}
+.header-tab.active{color:var(--text-primary);background:var(--bg-card);box-shadow:var(--shadow-sm)}
+.header-tab svg{width:14px;height:14px}
+.header-search{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-3);background:var(--bg-base);border:1px solid var(--border-default);border-radius:var(--radius-lg);color:var(--text-tertiary);font-size:var(--text-sm);min-width:220px;cursor:pointer}
+.header-search:hover{border-color:var(--accent-primary)}
+.header-search kbd{font-family:var(--font-mono);font-size:var(--text-xs);background:var(--bg-card);padding:1px 5px;border-radius:var(--radius-sm);border:1px solid var(--border-default);margin-left:auto}
+.header-icon-btn{width:36px;height:36px;display:flex;align-items:center;justify-content:center;border-radius:var(--radius-lg);background:none;border:1px solid transparent;color:var(--text-secondary);cursor:pointer;transition:all .15s;position:relative}
+.header-icon-btn:hover{background:var(--bg-card);color:var(--text-primary)}
+.notif-dot{position:absolute;top:6px;right:6px;width:7px;height:7px;border-radius:50%;background:var(--danger);border:2px solid var(--bg-surface)}
+.content{flex:1;padding:var(--space-6);overflow-y:auto}
+.tab-panel{display:none}.tab-panel.active{display:block}
+.page-header{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:var(--space-6)}
+.page-title{font-size:var(--text-xl);font-weight:700;color:var(--text-primary);margin-bottom:var(--space-1)}
+.page-subtitle{font-size:var(--text-sm);color:var(--text-secondary)}
+.page-actions{display:flex;gap:var(--space-2)}
+.btn{display:inline-flex;align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-4);border-radius:var(--radius-lg);font-size:var(--text-sm);font-weight:500;cursor:pointer;transition:all .15s;border:none;white-space:nowrap}
+.btn-primary{background:var(--accent-primary);color:#fff}.btn-primary:hover{background:var(--accent-hover)}
+.btn-secondary{background:var(--bg-card);color:var(--text-primary);border:1px solid var(--border-default)}
+.btn-secondary:hover{background:var(--bg-card-hover);border-color:var(--text-tertiary)}
+.btn-ghost{background:transparent;color:var(--text-secondary)}.btn-ghost:hover{background:var(--bg-card);color:var(--text-primary)}
+.btn svg{width:14px;height:14px}
+.kpi-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-4);margin-bottom:var(--space-6)}
+.kpi-card{background:var(--bg-card);border:1px solid var(--border-default);border-radius:var(--radius-xl);padding:var(--space-5);display:flex;flex-direction:column;gap:var(--space-2);transition:all .15s}
+.kpi-card:hover{border-color:var(--bg-elevated)}
+.kpi-card-header{display:flex;justify-content:space-between;align-items:flex-start}
+.kpi-label{font-size:var(--text-xs);color:var(--text-secondary);text-transform:uppercase;letter-spacing:.05em}
+.kpi-icon{width:36px;height:36px;border-radius:var(--radius-lg);display:flex;align-items:center;justify-content:center}
+.kpi-icon.purple{background:var(--accent-muted);color:var(--accent-primary)}
+.kpi-icon.cyan{background:rgba(0,212,255,0.12);color:var(--accent-secondary)}
+.kpi-icon.amber{background:var(--warning-muted);color:var(--warning)}
+.kpi-icon.green{background:var(--success-muted);color:var(--success)}
+.kpi-icon.red{background:var(--danger-muted);color:var(--danger)}
+.kpi-icon.blue{background:var(--info-muted);color:var(--info)}
+.kpi-value{font-size:var(--text-2xl);font-weight:700}
+.kpi-value.small{font-size:var(--text-lg)}
+.kpi-trend{display:flex;align-items:center;gap:var(--space-1);font-size:var(--text-xs)}
+.kpi-trend.up{color:var(--success)}.kpi-trend.down{color:var(--danger)}.kpi-trend.flat{color:var(--text-tertiary)}
+.section{margin-bottom:var(--space-6)}
+.section-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:var(--space-4)}
+.section-title{font-size:var(--text-base);font-weight:600;color:var(--text-primary)}
+.section-subtitle{font-size:var(--text-xs);color:var(--text-secondary);margin-top:2px}
+.filters-bar{display:flex;gap:var(--space-1);background:var(--bg-base);padding:3px;border-radius:var(--radius-lg)}
+.filter-chip{padding:var(--space-1) var(--space-3);border-radius:var(--radius-md);font-size:var(--text-xs);font-weight:500;color:var(--text-secondary);cursor:pointer;border:none;background:none;white-space:nowrap}
+.filter-chip:hover{color:var(--text-primary)}.filter-chip.active{background:var(--bg-card);color:var(--text-primary);box-shadow:var(--shadow-sm)}
+.agent-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:var(--space-3)}
+.agent-card{background:var(--bg-card);border:1px solid var(--border-default);border-radius:var(--radius-xl);padding:var(--space-4);transition:all .15s}
+.agent-card:hover{border-color:var(--bg-elevated)}
+.agent-card-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:var(--space-3)}
+.agent-name{font-size:var(--text-sm);font-weight:600}
+.agent-role{font-size:var(--text-xs);color:var(--text-tertiary);font-family:var(--font-mono)}
+.agent-meta{display:flex;flex-direction:column;gap:var(--space-1);font-size:var(--text-xs);color:var(--text-secondary)}
+.agent-meta-row{display:flex;justify-content:space-between}
+.agent-meta-val{font-family:var(--font-mono);color:var(--text-primary)}
+.agent-cpu{margin-top:var(--space-1)}
+.agent-cpu-header{display:flex;justify-content:space-between;margin-bottom:4px}
+.agent-cpu-label{font-size:var(--text-xs);color:var(--text-tertiary)}
+.agent-cpu-pct{font-size:var(--text-xs);font-family:var(--font-mono)}
+.badge{display:inline-flex;align-items:center;gap:4px;padding:2px 8px;border-radius:var(--radius-full);font-size:var(--text-xs);font-weight:500}
+.badge-dot{width:6px;height:6px;border-radius:50%}
+.badge-success{background:var(--success-muted);color:var(--success)}.badge-success .badge-dot{background:var(--success)}
+.badge-warning{background:var(--warning-muted);color:var(--warning)}.badge-warning .badge-dot{background:var(--warning)}
+.badge-danger{background:var(--danger-muted);color:var(--danger)}.badge-danger .badge-dot{background:var(--danger)}
+.badge-info{background:var(--info-muted);color:var(--info)}
+.badge-purple{background:var(--accent-muted);color:var(--accent-primary)}
+.badge-cyan{background:rgba(0,212,255,0.12);color:var(--accent-secondary)}
+.progress-bar{height:6px;background:var(--bg-surface);border-radius:3px;overflow:hidden}
+.progress-fill{height:100%;border-radius:3px;transition:width .5s}
+.progress-fill.green{background:var(--success)}.progress-fill.amber{background:var(--warning)}
+.progress-fill.red{background:var(--danger)}.progress-fill.purple{background:var(--accent-primary)}
+.card{background:var(--bg-card);border:1px solid var(--border-default);border-radius:var(--radius-xl);overflow:hidden;margin-bottom:var(--space-6)}
+.card-header{display:flex;justify-content:space-between;align-items:center;padding:var(--space-4) var(--space-5);border-bottom:1px solid var(--border-default)}
+.card-title{font-size:var(--text-sm);font-weight:600}
+.card-body{padding:var(--space-5)}.card-body.no-pad{padding:0}
+.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-4);margin-bottom:var(--space-6)}
+.table-wrapper{overflow-x:auto}
+.data-table{width:100%;border-collapse:collapse;font-size:var(--text-sm)}
+.data-table th{text-align:left;padding:var(--space-3) var(--space-4);color:var(--text-secondary);font-weight:500;font-size:var(--text-xs);text-transform:uppercase;letter-spacing:.05em;border-bottom:1px solid var(--border-default);background:var(--bg-surface)}
+.data-table td{padding:var(--space-3) var(--space-4);border-bottom:1px solid var(--border-subtle)}
+.data-table tr:hover td{background:var(--bg-card-hover)}
+.data-table .mono{font-family:var(--font-mono);font-size:var(--text-xs)}
+.queue-bars{display:flex;gap:var(--space-4)}
+.queue-col{flex:1}.queue-header{display:flex;justify-content:space-between;margin-bottom:var(--space-2)}
+.queue-label{font-size:var(--text-xs);color:var(--text-secondary)}
+.queue-count{font-size:var(--text-xs);font-family:var(--font-mono)}
+.queue-bar-group{display:flex;gap:4px;height:24px}
+.queue-bar{border-radius:var(--radius-sm)}
+.gauge-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-4)}
+.gauge-card{text-align:center}
+.gauge-ring{position:relative;width:100px;height:100px;margin:0 auto var(--space-2)}
+.gauge-ring svg{width:100%;height:100%;transform:rotate(-90deg)}
+.gauge-ring circle{fill:none;stroke-width:4}
+.gauge-ring .track{stroke:var(--bg-surface)}
+.gauge-val{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:var(--text-lg);font-weight:700;font-family:var(--font-mono)}
+.gauge-label{font-size:var(--text-xs);color:var(--text-secondary);margin-bottom:2px}
+.gauge-sub{font-size:10px;color:var(--text-tertiary);font-family:var(--font-mono)}
+.heartbeat-grid{display:flex;flex-wrap:wrap;gap:3px}
+.hb-cell{width:28px;height:28px;border-radius:4px;display:flex;align-items:center;justify-content:center;font-size:9px;font-family:var(--font-mono);font-weight:600}
+.hb-cell.healthy{background:rgba(34,197,94,0.2);color:var(--success)}
+.hb-cell.warn{background:rgba(245,158,11,0.2);color:var(--warning)}
+.hb-cell.fail{background:rgba(239,68,68,0.2);color:var(--danger)}
+.hb-cell.off{background:rgba(90,92,102,0.2);color:var(--text-tertiary)}
+.incident-item{display:flex;align-items:flex-start;gap:var(--space-3);padding:var(--space-4) var(--space-5);border-bottom:1px solid var(--border-subtle)}
+.incident-item:last-child{border-bottom:none}
+.incident-icon{width:32px;height:32px;border-radius:var(--radius-lg);display:flex;align-items:center;justify-content:center;flex-shrink:0}
+.incident-icon svg{width:16px;height:16px}
+.incident-content{flex:1;min-width:0}
+.incident-title{font-size:var(--text-sm);font-weight:500;color:var(--text-primary);margin-bottom:2px}
+.incident-desc{font-size:var(--text-xs);color:var(--text-secondary);margin-bottom:4px}
+.incident-time{font-size:10px;color:var(--text-tertiary);font-family:var(--font-mono)}
+.alert-list{display:flex;flex-direction:column;gap:var(--space-2)}
+.alert-item{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-4);border-radius:var(--radius-lg);font-size:var(--text-sm)}
+.alert-item.warning{background:var(--warning-muted);color:var(--warning);border:1px solid rgba(245,158,11,0.2)}
+.alert-item.critical{background:var(--danger-muted);color:var(--danger);border:1px solid rgba(239,68,68,0.2)}
+.kanban-board{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-4)}
+.kanban-col{background:var(--bg-surface);border:1px solid var(--border-default);border-radius:var(--radius-xl);display:flex;flex-direction:column}
+.kanban-header{padding:var(--space-3) var(--space-4);font-size:var(--text-xs);font-weight:600;text-transform:uppercase;letter-spacing:.05em;border-bottom:1px solid var(--border-default);display:flex;justify-content:space-between}
+.kanban-count{font-size:var(--text-xs);padding:1px 8px;border-radius:8px;background:var(--bg-card);color:var(--text-secondary)}
+.kanban-body{flex:1;padding:var(--space-3);display:flex;flex-direction:column;gap:var(--space-2)}
+.kanban-card{background:var(--bg-card);border:1px solid var(--border-default);border-radius:var(--radius-lg);padding:var(--space-3);transition:all .15s}
+.kanban-card:hover{border-color:var(--bg-elevated)}
+.kanban-card-title{font-size:var(--text-sm);font-weight:500;margin-bottom:var(--space-2)}
+.kanban-card-meta{display:flex;justify-content:space-between;font-size:var(--text-xs);color:var(--text-secondary)}
+.prio{font-size:10px;padding:1px 6px;border-radius:4px;font-weight:600}
+.prio.critical{background:var(--danger-muted);color:var(--danger)}
+.prio.high{background:var(--warning-muted);color:var(--warning)}
+.prio.medium{background:var(--info-muted);color:var(--info)}
+.prio.low{background:rgba(139,141,151,0.15);color:var(--text-tertiary)}
+.empty,.error{display:flex;flex-direction:column;align-items:center;gap:12px;padding:40px;color:var(--text-secondary);text-align:center}
+.error{color:var(--danger)}
+.mono{font-family:var(--font-mono)}
+.skeleton{background:linear-gradient(90deg,var(--bg-card) 25%,var(--bg-card-hover) 50%,var(--bg-card) 75%);background-size:200% 100%;animation:shimmer 1.5s infinite;border-radius:var(--radius);margin-bottom:8px}
+.skeleton-kpi{height:100px}.skeleton-row{height:40px}.skeleton-card{height:160px}
+@keyframes shimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}
+/* LOGS */
+.log-container{font-family:var(--font-mono);font-size:var(--text-xs);height:500px;overflow-y:auto;padding:var(--space-2);background:var(--bg-base)}
+.log-entry{display:flex;gap:var(--space-3);padding:2px var(--space-2);border-radius:2px;line-height:1.6}
+.log-entry:hover{background:var(--bg-card)}
+.log-time{color:var(--text-tertiary);white-space:nowrap;flex-shrink:0;width:80px}
+.log-level{width:42px;flex-shrink:0;font-weight:600;text-transform:uppercase}
+.log-level.info{color:var(--info)}.log-level.warn{color:var(--warning)}.log-level.error{color:var(--danger)}.log-level.debug{color:var(--text-tertiary)}
+.log-source{width:70px;flex-shrink:0;color:var(--accent-secondary)}
+.log-msg{color:var(--text-primary);word-break:break-word}
+.log-entry.hidden{display:none}
+
+/* MEMORY */
+.memory-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(360px,1fr));gap:var(--space-3)}
+.memory-card{background:var(--bg-card);border:1px solid var(--border-default);border-radius:var(--radius-xl);padding:var(--space-4)}
+.memory-card:hover{border-color:var(--bg-elevated)}
+.mem-type{font-size:10px;padding:2px 8px;border-radius:10px;font-weight:600;text-transform:uppercase;display:inline-block;margin-bottom:var(--space-2)}
+.mem-type.episodic{background:var(--accent-muted);color:var(--accent-primary)}
+.mem-type.semantic{background:var(--success-muted);color:var(--success)}
+.mem-type.procedural{background:rgba(0,212,255,0.12);color:var(--accent-secondary)}
+.mem-type.reflection{background:var(--warning-muted);color:var(--warning)}
+.mem-content{font-size:var(--text-sm);color:var(--text-primary);margin-bottom:var(--space-2);line-height:1.5}
+.mem-meta{font-size:10px;color:var(--text-tertiary);display:flex;justify-content:space-between}
+
+/* SKILLS */
+.skills-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:var(--space-3)}
+.skill-card{background:var(--bg-card);border:1px solid var(--border-default);border-radius:var(--radius-xl);padding:var(--space-4);transition:all .15s}
+.skill-card:hover{border-color:var(--bg-elevated)}
+.skill-name{font-size:var(--text-sm);font-weight:600;color:var(--accent-secondary);font-family:var(--font-mono);margin-bottom:var(--space-1)}
+.skill-desc{font-size:var(--text-xs);color:var(--text-secondary);margin-bottom:var(--space-2);line-height:1.5}
+.skill-meta{font-size:10px;color:var(--text-tertiary);font-family:var(--font-mono)}
+
+/* CONFIG EDITOR */
+.config-editor{width:100%;min-height:400px;background:var(--bg-base);color:var(--text-primary);font-family:var(--font-mono);font-size:var(--text-sm);border:none;padding:var(--space-4);resize:vertical;tab-size:2;line-height:1.5}
+.config-editor:focus{outline:1px solid var(--accent-primary)}
+
+@media(max-width:1024px){.kpi-grid,.grid-2{grid-template-columns:repeat(2,1fr)}.kanban-board{grid-template-columns:repeat(2,1fr)}.gauge-grid{grid-template-columns:repeat(2,1fr)}}
+@media(max-width:768px){.kpi-grid,.grid-2{grid-template-columns:1fr}.kanban-board{grid-template-columns:1fr}.agent-grid{grid-template-columns:1fr}}

package/dist/features/dashboard/frontend/index.html

@@ -0,0 +1,173 @@
+<!DOCTYPE html>
+<html lang="fr">
+<head>
+<meta charset="utf-8">
+<meta name="viewport" content="width=1024, initial-scale=1">
+<title>MaTrixOS Dashboard</title>
+<link rel="preconnect" href="https://fonts.googleapis.com">
+<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap" rel="stylesheet">
+<link rel="stylesheet" href="css/style.css">
+</head>
+<body>
+<aside class="sidebar">
+  <div class="sidebar-logo">
+    <svg width="28" height="28" viewBox="0 0 16 16" fill="none" stroke="#7C5CFC" stroke-width="1.5"><circle cx="14" cy="14" r="3" fill="#7C5CFC"/><circle cx="14" cy="14" r="1.5" fill="#00D4FF"/></svg>
+    <div><div class="sidebar-logo-text">MaTrixOS</div><div class="sidebar-logo-version">v0.1.0</div></div>
+  </div>
+  <nav class="sidebar-nav">
+    <div class="sidebar-section">Command</div>
+    <a href="#" class="sidebar-item active" data-tab="architect"><svg width="16" height="16" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><rect x="1.5" y="1.5" width="5" height="5" rx="1"/><rect x="9.5" y="1.5" width="5" height="5" rx="1"/><rect x="1.5" y="9.5" width="5" height="5" rx="1"/><rect x="9.5" y="9.5" width="5" height="5" rx="1"/></svg>Dashboard</a>
+    <a href="#" class="sidebar-item" data-tab="agents"><svg width="16" height="16" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"><circle cx="8" cy="6" r="3"/><path d="M2 14c0-3.3 2.7-5 6-5s6 1.7 6 5"/></svg>Agents<span class="sidebar-badge" id="badgeAgents">7</span></a>
+    <a href="#" class="sidebar-item" data-tab="sessions"><svg width="16" height="16" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"><path d="M2 4h12M2 8h8M2 12h10"/></svg>Sessions<span class="sidebar-badge" id="badgeSessions">24</span></a>
+    <a href="#" class="sidebar-item" data-tab="health"><svg width="16" height="16" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"><path d="M3 12V8M6 12V5M9 12V7M12 12V3"/></svg>Health</a>
+    <div class="sidebar-section">Operations</div>
+    <a href="#" class="sidebar-item" data-tab="health"><svg width="16" height="16" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"><path d="M8 2L1.5 13h13L8 2z"/><path d="M8 7v2.5M8 11.5v.5"/></svg>Incidents<span class="sidebar-badge danger" id="badgeIncidents">3</span></a>
+    <a href="#" class="sidebar-item" data-tab="logs"><svg width="16" height="16" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"><path d="M14 2H2v12h12V2z"/><path d="M5 8h6M5 11h4"/></svg>Logs</a>
+    <a href="#" class="sidebar-item"><svg width="16" height="16" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"><path d="M8 14A6 6 0 108 2a6 6 0 000 12z"/><path d="M8 5v3l2 2"/></svg>Schedule</a>
+    <div class="sidebar-section">System</div>
+    <a href="#" class="sidebar-item" data-tab="config"><svg width="16" height="16" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"><rect x="2" y="2" width="12" height="12" rx="2"/><path d="M6 6h4M6 8h4M6 10h2"/></svg>Config</a>
+    <a href="#" class="sidebar-item"><svg width="16" height="16" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"><path d="M12 8A4 4 0 114 8a4 4 0 018 0z"/><path d="M8 2v1M8 13v1M2 8h1M13 8h1"/></svg>Settings</a>
+    <a href="#" class="sidebar-item"><svg width="16" height="16" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"><path d="M9 2H4a1 1 0 00-1 1v10a1 1 0 001 1h8a1 1 0 001-1V7l-5-5z"/><path d="M9 2v5h5"/></svg>Audit Trail</a>
+  </nav>
+  <div class="sidebar-footer">
+    <div class="sidebar-avatar">SM</div>
+    <div class="sidebar-user-info"><div class="sidebar-user-name">Shiro</div><div class="sidebar-user-role">Admin</div></div>
+  </div>
+</aside>
+
+<div class="main">
+  <header class="header">
+    <div class="header-left">
+      <div class="header-tabs" id="headerTabs">
+        <button class="header-tab active" data-tab="architect"><svg width="14" height="14" viewBox="0 0 14 14" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"><circle cx="7" cy="5" r="2.5"/><path d="M1.5 13c0-3 2.5-5 5.5-5s5.5 2 5.5 5"/></svg>Architect</button>
+        <button class="header-tab" data-tab="health"><svg width="14" height="14" viewBox="0 0 14 14" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"><path d="M1 7h3l2-4 2 8 2-4h3"/></svg>Health</button>
+        <button class="header-tab" data-tab="cost"><svg width="14" height="14" viewBox="0 0 14 14" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"><path d="M7 1v12M4.5 3.5C4.5 3.5 5 3 7 3s3 .5 3 1.5-1 1.5-3 1.5-3 .5-3 1.5 1 1.5 3 1.5 3-.5 3-1.5"/></svg>Cost</button>
+        <button class="header-tab" data-tab="kanban"><svg width="14" height="14" viewBox="0 0 14 14" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"><rect x="1" y="1" width="3.5" height="12" rx="0.75"/><rect x="5.5" y="1" width="3.5" height="8" rx="0.75"/><rect x="10" y="1" width="3.5" height="10" rx="0.75"/></svg>Kanban</button>
+        <button class="header-tab" data-tab="logs"><svg width="14" height="14" viewBox="0 0 14 14" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"><path d="M2 4h10M2 7h10M2 10h7"/></svg>Logs</button>
+        <button class="header-tab" data-tab="memory"><svg width="14" height="14" viewBox="0 0 14 14" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"><rect x="2" y="3" width="10" height="9" rx="1"/><path d="M2 6h10"/><circle cx="7" cy="9" r="1.5"/></svg>Memory</button>
+        <button class="header-tab" data-tab="skills"><svg width="14" height="14" viewBox="0 0 14 14" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"><circle cx="7" cy="5" r="3"/><path d="M3 12c0-2.5 2-4 4-4s4 1.5 4 4"/></svg>Skills</button>
+        <button class="header-tab" data-tab="config"><svg width="14" height="14" viewBox="0 0 14 14" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"><rect x="2" y="2" width="10" height="10" rx="1"/><path d="M5 5h4M5 7h4M5 9h2"/></svg>Config</button>
+      </div>
+    </div>
+    <div class="header-right">
+      <div class="header-search"><svg width="14" height="14" viewBox="0 0 14 14" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"><circle cx="6" cy="6" r="4.5"/><path d="M9.5 9.5L13 13"/></svg>Search agents, sessions...<kbd>Ctrl+K</kbd></div>
+      <button class="header-icon-btn" id="notifBtn"><svg width="16" height="16" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"><path d="M12 6a4 4 0 10-8 0c0 4-2 5-2 5h12s-2-1-2-5"/><path d="M6.5 14a1.5 1.5 0 003 0"/></svg><span class="notif-dot"></span></button>
+      <button class="header-icon-btn" id="refreshBtn"><svg width="16" height="16" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"><polyline points="14 3 14 8 9 8"/><path d="M12.5 11.5A6 6 0 104 4L2 6"/></svg></button>
+    </div>
+  </header>
+
+  <div class="content" id="tabContent">
+    <div id="tab-architect" class="tab-panel active">
+      <div class="page-header">
+        <div><h1 class="page-title">Architect Overview</h1><p class="page-subtitle">Monitor agent sessions, queues, and system orchestration</p></div>
+        <div class="page-actions"><button class="btn btn-secondary" id="deployBtn"><svg width="14" height="14" viewBox="0 0 14 14" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"><path d="M1 7h12M7 1v12"/></svg>Deploy Agent</button><button class="btn btn-ghost" id="archRefresh"><svg width="14" height="14" viewBox="0 0 14 14" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"><polyline points="12 3 12 7 8 7"/><path d="M10.5 10.5A5 5 0 103 5L1.5 6.5"/></svg>Refresh</button></div>
+      </div>
+      <div class="kpi-grid" id="archKpis"></div>
+      <div class="section">
+        <div class="section-header">
+          <div><h2 class="section-title">Agent Fleet</h2><p class="section-subtitle">Real-time status of all registered agents</p></div>
+          <div class="filters-bar" id="agentFilters"><button class="filter-chip active" data-filter="all">All (0)</button><button class="filter-chip" data-filter="online">Active (0)</button><button class="filter-chip" data-filter="idle">Idle (0)</button><button class="filter-chip" data-filter="offline">Offline (0)</button></div>
+        </div>
+        <div class="agent-grid" id="agentGrid"></div>
+      </div>
+      <div class="section">
+        <div class="section-header"><div><h2 class="section-title">Active Sessions</h2><p class="section-subtitle">Currently running agent sessions</p></div></div>
+        <div class="card"><div class="card-body no-pad"><div class="table-wrapper" id="sessionsTable"></div></div></div>
+      </div>
+      <div class="section">
+        <div class="section-header"><div><h2 class="section-title">Session Queue</h2><p class="section-subtitle">Pending tasks waiting for agent assignment</p></div></div>
+        <div class="card"><div class="card-body" id="sessionQueue"></div></div>
+      </div>
+    </div>
+
+    <div id="tab-health" class="tab-panel">
+      <div class="page-header">
+        <div><h1 class="page-title">System Health</h1><p class="page-subtitle">Heartbeat monitoring, incident watchdog, and system resource status</p></div>
+        <div class="page-actions"><button class="btn btn-secondary" id="diagBtn"><svg width="14" height="14" viewBox="0 0 14 14" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"><path d="M1 7h12M7 1v12"/></svg>Run Diagnostics</button></div>
+      </div>
+      <div class="kpi-grid" id="healthKpis"></div>
+      <div class="grid-2">
+        <div class="card"><div class="card-header"><span class="card-title">System Resources</span><span class="badge badge-success" id="resourceStatus"><span class="badge-dot"></span>Nominal</span></div><div class="card-body"><div class="gauge-grid" id="gaugeGrid"></div></div></div>
+        <div class="card"><div class="card-header"><span class="card-title">Agent Heartbeats</span><div style="display:flex;gap:12px" id="hbLegend"></div></div><div class="card-body"><div class="heartbeat-grid" id="heartbeatGrid"></div></div></div>
+      </div>
+      <div class="section">
+        <div class="section-header"><div><h2 class="section-title">Recent Incidents</h2><p class="section-subtitle">From anti-loop.jsonl and audit.jsonl</p></div><button class="btn btn-ghost">Export Log</button></div>
+        <div class="card"><div class="card-body no-pad" id="incidentList"></div></div>
+      </div>
+    </div>
+
+    <div id="tab-cost" class="tab-panel">
+      <div class="page-header">
+        <div><h1 class="page-title">Cost Management</h1><p class="page-subtitle">Budget consumption, cost per agent/session, and alert thresholds</p></div>
+        <div class="page-actions"><button class="btn btn-secondary"><svg width="14" height="14" viewBox="0 0 14 14" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"><path d="M7 1v12M1 7h12"/></svg>Set Budget</button><button class="btn btn-ghost">Export CSV</button></div>
+      </div>
+      <div class="kpi-grid" id="costKpis"></div>
+      <div class="section"><div class="section-header"><div><h2 class="section-title">Cost by Agent</h2></div></div><div class="card"><div class="card-body no-pad"><div class="table-wrapper" id="costByAgentTable"></div></div></div></div>
+      <div class="section"><div class="section-header"><div><h2 class="section-title">Budget Alerts</h2></div></div><div class="alert-list" id="alertList"></div></div>
+    </div>
+
+    <div id="tab-kanban" class="tab-panel">
+      <div class="page-header">
+        <div><h1 class="page-title">Kanban Board</h1><p class="page-subtitle">Task tracking across all agents</p></div>
+        <div class="page-actions"><button class="btn btn-secondary"><svg width="14" height="14" viewBox="0 0 14 14" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"><path d="M1 7h12M7 1v12"/></svg>New Task</button></div>
+      </div>
+      <div class="kanban-board" id="kanbanBoard"></div>
+    </div>
+
+    <div id="tab-logs" class="tab-panel">
+      <div class="page-header">
+        <div><h1 class="page-title">Live Logs</h1><p class="page-subtitle">Real-time event stream from MaTrixOS agents and services</p></div>
+        <div class="page-actions">
+          <div class="filters-bar" id="logFilters">
+            <button class="filter-chip active" data-level="all">All</button>
+            <button class="filter-chip" data-level="error">Error</button>
+            <button class="filter-chip" data-level="warn">Warning</button>
+            <button class="filter-chip" data-level="info">Info</button>
+            <button class="filter-chip" data-level="debug">Debug</button>
+          </div>
+          <button class="btn btn-ghost" id="logClearBtn"><svg width="14" height="14" viewBox="0 0 14 14" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"><polyline points="12 3 12 7 8 7"/><path d="M10.5 10.5A5 5 0 103 5L1.5 6.5"/></svg>Clear</button>
+        </div>
+      </div>
+      <div class="card"><div class="card-body no-pad"><div class="log-container" id="logContainer"><div class="empty" style="padding:40px"><p>Connecting to log stream...</p></div></div></div></div>
+    </div>
+
+    <div id="tab-memory" class="tab-panel">
+      <div class="page-header">
+        <div><h1 class="page-title">Memory</h1><p class="page-subtitle">Episodic, semantic, and procedural memories stored by the learning loop</p></div>
+        <div class="page-actions">
+          <div class="filters-bar" id="memFilters">
+            <button class="filter-chip active" data-mtype="all">All</button>
+            <button class="filter-chip" data-mtype="episodic">Episodic</button>
+            <button class="filter-chip" data-mtype="semantic">Semantic</button>
+            <button class="filter-chip" data-mtype="procedural">Procedural</button>
+            <button class="filter-chip" data-mtype="reflection">Reflection</button>
+          </div>
+        </div>
+      </div>
+      <div class="memory-grid" id="memoryGrid"></div>
+    </div>
+
+    <div id="tab-skills" class="tab-panel">
+      <div class="page-header">
+        <div><h1 class="page-title">Skills</h1><p class="page-subtitle">Installed MaTrixOS and shared skills</p></div>
+        <div class="page-actions"><div class="filters-bar" id="skillFilters"><button class="filter-chip active" data-scat="all">All</button><button class="filter-chip" data-scat="builtin">Builtin</button></div></div>
+      </div>
+      <div class="skills-grid" id="skillsGrid"></div>
+    </div>
+
+    <div id="tab-config" class="tab-panel">
+      <div class="page-header">
+        <div><h1 class="page-title">Configuration</h1><p class="page-subtitle">Edit matrixos.jsonc — MaTrixOS agent configuration</p></div>
+        <div class="page-actions">
+          <button class="btn btn-secondary" id="configSaveBtn"><svg width="14" height="14" viewBox="0 0 14 14" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"><path d="M4 8l3 3 5-6"/></svg>Save</button>
+          <button class="btn btn-ghost" id="configRefreshBtn"><svg width="14" height="14" viewBox="0 0 14 14" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"><polyline points="12 3 12 7 8 7"/><path d="M10.5 10.5A5 5 0 103 5L1.5 6.5"/></svg>Refresh</button>
+        </div>
+      </div>
+      <div class="card"><div class="card-header"><span class="card-title">matrixos.jsonc</span><span id="configStatus" style="font-size:var(--text-xs);color:var(--text-tertiary)"></span></div><div class="card-body"><textarea id="configEditor" class="config-editor" spellcheck="false"></textarea></div></div>
+    </div>
+  </div>
+</div>
+<script src="js/api.js"></script>
+<script src="js/app.js"></script>
+</body>
+</html>

package/dist/features/dashboard/frontend/js/api.js

@@ -0,0 +1,2 @@
+const API={health:()=>fetchJSON('/health'),agents:()=>fetchJSON('/agents'),sessions:(l)=>fetchJSON(`/sessions?limit=${l}`),cost:()=>fetchJSON('/cost'),kanban:()=>fetchJSON('/kanban'),incidents:(l)=>fetchJSON(`/incidents?limit=${l}`),metrics:()=>fetchJSON('/metrics'),config:()=>fetchJSON('/config'),memory:()=>fetchJSON('/memory'),skills:()=>fetchJSON('/skills')}
+async function fetchJSON(e){const r=await fetch(`/api${e}`);if(!r.ok)throw new Error(`API ${e}: ${r.status}`);return r.json()}