@kl-c/matrixos 0.1.6 → 0.1.9

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (124) hide show
  1. package/.agents/command/adopt.md +50 -0
  2. package/.agents/command/features.md +35 -0
  3. package/.opencode/command/adopt.md +50 -0
  4. package/.opencode/command/features.md +35 -0
  5. package/dist/cli/config-manager/write-gateway-env.d.ts +7 -0
  6. package/dist/cli/index.js +942 -788
  7. package/dist/cli/install-validators.d.ts +1 -0
  8. package/dist/cli/skills/debugging/references/methodology/02-investigate.md +1 -1
  9. package/dist/cli/skills/refactor/SKILL.md +1 -1
  10. package/dist/cli/skills/superpowers-brainstorming/SKILL.md +162 -0
  11. package/dist/cli/skills/superpowers-brainstorming/SUPERPOWERS_LICENSE +21 -0
  12. package/dist/cli/skills/superpowers-brainstorming/scripts/frame-template.html +213 -0
  13. package/dist/cli/skills/superpowers-brainstorming/scripts/helper.js +167 -0
  14. package/dist/cli/skills/superpowers-brainstorming/scripts/server.cjs +723 -0
  15. package/dist/cli/skills/superpowers-brainstorming/scripts/start-server.sh +209 -0
  16. package/dist/cli/skills/superpowers-brainstorming/scripts/stop-server.sh +120 -0
  17. package/dist/cli/skills/superpowers-brainstorming/spec-document-reviewer-prompt.md +49 -0
  18. package/dist/cli/skills/superpowers-brainstorming/visual-companion.md +291 -0
  19. package/dist/cli/skills/superpowers-receiving-code-review/SKILL.md +216 -0
  20. package/dist/cli/skills/superpowers-receiving-code-review/SUPERPOWERS_LICENSE +21 -0
  21. package/dist/cli/skills/superpowers-systematic-debugging/CREATION-LOG.md +119 -0
  22. package/dist/cli/skills/superpowers-systematic-debugging/SKILL.md +299 -0
  23. package/dist/cli/skills/superpowers-systematic-debugging/SUPERPOWERS_LICENSE +21 -0
  24. package/dist/cli/skills/superpowers-systematic-debugging/condition-based-waiting-example.ts +158 -0
  25. package/dist/cli/skills/superpowers-systematic-debugging/condition-based-waiting.md +115 -0
  26. package/dist/cli/skills/superpowers-systematic-debugging/defense-in-depth.md +122 -0
  27. package/dist/cli/skills/superpowers-systematic-debugging/find-polluter.sh +63 -0
  28. package/dist/cli/skills/superpowers-systematic-debugging/root-cause-tracing.md +169 -0
  29. package/dist/cli/skills/superpowers-systematic-debugging/test-academic.md +14 -0
  30. package/dist/cli/skills/superpowers-systematic-debugging/test-pressure-1.md +58 -0
  31. package/dist/cli/skills/superpowers-systematic-debugging/test-pressure-2.md +68 -0
  32. package/dist/cli/skills/superpowers-systematic-debugging/test-pressure-3.md +69 -0
  33. package/dist/cli/skills/superpowers-writing-skills/SKILL.md +692 -0
  34. package/dist/cli/skills/superpowers-writing-skills/SUPERPOWERS_LICENSE +21 -0
  35. package/dist/cli/skills/superpowers-writing-skills/anthropic-best-practices.md +1150 -0
  36. package/dist/cli/skills/superpowers-writing-skills/examples/CLAUDE_MD_TESTING.md +189 -0
  37. package/dist/cli/skills/superpowers-writing-skills/graphviz-conventions.dot +172 -0
  38. package/dist/cli/skills/superpowers-writing-skills/persuasion-principles.md +187 -0
  39. package/dist/cli/skills/superpowers-writing-skills/render-graphs.js +168 -0
  40. package/dist/cli/skills/superpowers-writing-skills/testing-skills-with-subagents.md +384 -0
  41. package/dist/cli/types.d.ts +4 -0
  42. package/dist/cli-node/index.js +942 -788
  43. package/dist/config/schema/oh-my-opencode-config.d.ts +7 -0
  44. package/dist/config/schema/watchdog.d.ts +7 -0
  45. package/dist/features/anti-loop/background-registry.d.ts +10 -0
  46. package/dist/features/anti-loop/logger.d.ts +15 -0
  47. package/dist/features/dashboard/frontend/css/style.css +211 -0
  48. package/dist/features/dashboard/frontend/index.html +173 -0
  49. package/dist/features/dashboard/frontend/js/api.js +2 -0
  50. package/dist/features/dashboard/frontend/js/app.js +349 -0
  51. package/dist/features/matrix-inventory/features.d.ts +45 -0
  52. package/dist/hooks/agent-anti-loop/hook.d.ts +21 -26
  53. package/dist/index.js +392 -145
  54. package/dist/oh-my-opencode.schema.json +49 -0
  55. package/dist/plugin/agent-anti-loop.d.ts +8 -5
  56. package/dist/skills/debugging/references/methodology/02-investigate.md +1 -1
  57. package/dist/skills/refactor/SKILL.md +1 -1
  58. package/dist/skills/superpowers-brainstorming/SKILL.md +162 -0
  59. package/dist/skills/superpowers-brainstorming/SUPERPOWERS_LICENSE +21 -0
  60. package/dist/skills/superpowers-brainstorming/scripts/frame-template.html +213 -0
  61. package/dist/skills/superpowers-brainstorming/scripts/helper.js +167 -0
  62. package/dist/skills/superpowers-brainstorming/scripts/server.cjs +723 -0
  63. package/dist/skills/superpowers-brainstorming/scripts/start-server.sh +209 -0
  64. package/dist/skills/superpowers-brainstorming/scripts/stop-server.sh +120 -0
  65. package/dist/skills/superpowers-brainstorming/spec-document-reviewer-prompt.md +49 -0
  66. package/dist/skills/superpowers-brainstorming/visual-companion.md +291 -0
  67. package/dist/skills/superpowers-receiving-code-review/SKILL.md +216 -0
  68. package/dist/skills/superpowers-receiving-code-review/SUPERPOWERS_LICENSE +21 -0
  69. package/dist/skills/superpowers-systematic-debugging/CREATION-LOG.md +119 -0
  70. package/dist/skills/superpowers-systematic-debugging/SKILL.md +299 -0
  71. package/dist/skills/superpowers-systematic-debugging/SUPERPOWERS_LICENSE +21 -0
  72. package/dist/skills/superpowers-systematic-debugging/condition-based-waiting-example.ts +158 -0
  73. package/dist/skills/superpowers-systematic-debugging/condition-based-waiting.md +115 -0
  74. package/dist/skills/superpowers-systematic-debugging/defense-in-depth.md +122 -0
  75. package/dist/skills/superpowers-systematic-debugging/find-polluter.sh +63 -0
  76. package/dist/skills/superpowers-systematic-debugging/root-cause-tracing.md +169 -0
  77. package/dist/skills/superpowers-systematic-debugging/test-academic.md +14 -0
  78. package/dist/skills/superpowers-systematic-debugging/test-pressure-1.md +58 -0
  79. package/dist/skills/superpowers-systematic-debugging/test-pressure-2.md +68 -0
  80. package/dist/skills/superpowers-systematic-debugging/test-pressure-3.md +69 -0
  81. package/dist/skills/superpowers-writing-skills/SKILL.md +692 -0
  82. package/dist/skills/superpowers-writing-skills/SUPERPOWERS_LICENSE +21 -0
  83. package/dist/skills/superpowers-writing-skills/anthropic-best-practices.md +1150 -0
  84. package/dist/skills/superpowers-writing-skills/examples/CLAUDE_MD_TESTING.md +189 -0
  85. package/dist/skills/superpowers-writing-skills/graphviz-conventions.dot +172 -0
  86. package/dist/skills/superpowers-writing-skills/persuasion-principles.md +187 -0
  87. package/dist/skills/superpowers-writing-skills/render-graphs.js +168 -0
  88. package/dist/skills/superpowers-writing-skills/testing-skills-with-subagents.md +384 -0
  89. package/dist/testing/create-gateway-relay.d.ts +26 -0
  90. package/dist/tui.js +14 -0
  91. package/package.json +2 -1
  92. package/packages/shared-skills/skills/debugging/references/methodology/02-investigate.md +1 -1
  93. package/packages/shared-skills/skills/refactor/SKILL.md +1 -1
  94. package/packages/shared-skills/skills/superpowers-brainstorming/SKILL.md +162 -0
  95. package/packages/shared-skills/skills/superpowers-brainstorming/SUPERPOWERS_LICENSE +21 -0
  96. package/packages/shared-skills/skills/superpowers-brainstorming/scripts/frame-template.html +213 -0
  97. package/packages/shared-skills/skills/superpowers-brainstorming/scripts/helper.js +167 -0
  98. package/packages/shared-skills/skills/superpowers-brainstorming/scripts/server.cjs +723 -0
  99. package/packages/shared-skills/skills/superpowers-brainstorming/scripts/start-server.sh +209 -0
  100. package/packages/shared-skills/skills/superpowers-brainstorming/scripts/stop-server.sh +120 -0
  101. package/packages/shared-skills/skills/superpowers-brainstorming/spec-document-reviewer-prompt.md +49 -0
  102. package/packages/shared-skills/skills/superpowers-brainstorming/visual-companion.md +291 -0
  103. package/packages/shared-skills/skills/superpowers-receiving-code-review/SKILL.md +216 -0
  104. package/packages/shared-skills/skills/superpowers-receiving-code-review/SUPERPOWERS_LICENSE +21 -0
  105. package/packages/shared-skills/skills/superpowers-systematic-debugging/CREATION-LOG.md +119 -0
  106. package/packages/shared-skills/skills/superpowers-systematic-debugging/SKILL.md +299 -0
  107. package/packages/shared-skills/skills/superpowers-systematic-debugging/SUPERPOWERS_LICENSE +21 -0
  108. package/packages/shared-skills/skills/superpowers-systematic-debugging/condition-based-waiting-example.ts +158 -0
  109. package/packages/shared-skills/skills/superpowers-systematic-debugging/condition-based-waiting.md +115 -0
  110. package/packages/shared-skills/skills/superpowers-systematic-debugging/defense-in-depth.md +122 -0
  111. package/packages/shared-skills/skills/superpowers-systematic-debugging/find-polluter.sh +63 -0
  112. package/packages/shared-skills/skills/superpowers-systematic-debugging/root-cause-tracing.md +169 -0
  113. package/packages/shared-skills/skills/superpowers-systematic-debugging/test-academic.md +14 -0
  114. package/packages/shared-skills/skills/superpowers-systematic-debugging/test-pressure-1.md +58 -0
  115. package/packages/shared-skills/skills/superpowers-systematic-debugging/test-pressure-2.md +68 -0
  116. package/packages/shared-skills/skills/superpowers-systematic-debugging/test-pressure-3.md +69 -0
  117. package/packages/shared-skills/skills/superpowers-writing-skills/SKILL.md +692 -0
  118. package/packages/shared-skills/skills/superpowers-writing-skills/SUPERPOWERS_LICENSE +21 -0
  119. package/packages/shared-skills/skills/superpowers-writing-skills/anthropic-best-practices.md +1150 -0
  120. package/packages/shared-skills/skills/superpowers-writing-skills/examples/CLAUDE_MD_TESTING.md +189 -0
  121. package/packages/shared-skills/skills/superpowers-writing-skills/graphviz-conventions.dot +172 -0
  122. package/packages/shared-skills/skills/superpowers-writing-skills/persuasion-principles.md +187 -0
  123. package/packages/shared-skills/skills/superpowers-writing-skills/render-graphs.js +168 -0
  124. package/packages/shared-skills/skills/superpowers-writing-skills/testing-skills-with-subagents.md +384 -0
@@ -2449,6 +2449,7 @@ export declare const OhMyOpenCodeConfigSchema: z.ZodObject<{
2449
2449
  watchdog: z.ZodOptional<z.ZodObject<{
2450
2450
  enabled: z.ZodDefault<z.ZodBoolean>;
2451
2451
  doomLoopThreshold: z.ZodDefault<z.ZodNumber>;
2452
+ softDoomLoopThreshold: z.ZodDefault<z.ZodNumber>;
2452
2453
  stuckTimeoutSec: z.ZodDefault<z.ZodNumber>;
2453
2454
  auditLogPath: z.ZodOptional<z.ZodString>;
2454
2455
  recoveryStrategy: z.ZodDefault<z.ZodEnum<{
@@ -2458,6 +2459,12 @@ export declare const OhMyOpenCodeConfigSchema: z.ZodObject<{
2458
2459
  restart: "restart";
2459
2460
  safe: "safe";
2460
2461
  }>>;
2462
+ hookRecursionWindowMs: z.ZodDefault<z.ZodNumber>;
2463
+ hookRecursionThreshold: z.ZodDefault<z.ZodNumber>;
2464
+ contextBloatMaxTokens: z.ZodDefault<z.ZodNumber>;
2465
+ contextBloatStuckSec: z.ZodDefault<z.ZodNumber>;
2466
+ zombieSessionIdleSec: z.ZodDefault<z.ZodNumber>;
2467
+ runawayTaskTimeoutSec: z.ZodDefault<z.ZodNumber>;
2461
2468
  heartbeatIntervalSec: z.ZodDefault<z.ZodNumber>;
2462
2469
  heartbeatFilePath: z.ZodDefault<z.ZodString>;
2463
2470
  fatalMarkerPath: z.ZodDefault<z.ZodString>;
@@ -6,6 +6,7 @@ import * as z from "zod";
6
6
  export declare const WatchdogConfigSchema: z.ZodObject<{
7
7
  enabled: z.ZodDefault<z.ZodBoolean>;
8
8
  doomLoopThreshold: z.ZodDefault<z.ZodNumber>;
9
+ softDoomLoopThreshold: z.ZodDefault<z.ZodNumber>;
9
10
  stuckTimeoutSec: z.ZodDefault<z.ZodNumber>;
10
11
  auditLogPath: z.ZodOptional<z.ZodString>;
11
12
  recoveryStrategy: z.ZodDefault<z.ZodEnum<{
@@ -15,6 +16,12 @@ export declare const WatchdogConfigSchema: z.ZodObject<{
15
16
  restart: "restart";
16
17
  safe: "safe";
17
18
  }>>;
19
+ hookRecursionWindowMs: z.ZodDefault<z.ZodNumber>;
20
+ hookRecursionThreshold: z.ZodDefault<z.ZodNumber>;
21
+ contextBloatMaxTokens: z.ZodDefault<z.ZodNumber>;
22
+ contextBloatStuckSec: z.ZodDefault<z.ZodNumber>;
23
+ zombieSessionIdleSec: z.ZodDefault<z.ZodNumber>;
24
+ runawayTaskTimeoutSec: z.ZodDefault<z.ZodNumber>;
18
25
  heartbeatIntervalSec: z.ZodDefault<z.ZodNumber>;
19
26
  heartbeatFilePath: z.ZodDefault<z.ZodString>;
20
27
  fatalMarkerPath: z.ZodDefault<z.ZodString>;
@@ -0,0 +1,10 @@
1
+ export interface BackgroundTaskRecord {
2
+ taskId: string;
3
+ startedAt: number;
4
+ completedAt?: number;
5
+ status: "running" | "completed";
6
+ }
7
+ export declare function registerBackgroundTask(taskId: string): void;
8
+ export declare function completeBackgroundTask(taskId: string): void;
9
+ export declare function getRunningTasks(): BackgroundTaskRecord[];
10
+ export declare function getTaskAgeMs(taskId: string): number | undefined;
@@ -0,0 +1,15 @@
1
+ export type AntiLoopPattern = "doom_loop" | "soft_doom_loop" | "stuck" | "zombie_session" | "hook_recursion" | "agent_avoidance" | "context_bloat" | "runaway_task";
2
+ export interface AntiLoopEvent {
3
+ timestamp: string;
4
+ sessionId?: string;
5
+ pattern: AntiLoopPattern;
6
+ agent?: string;
7
+ toolName?: string;
8
+ detail: string;
9
+ actionTaken: string;
10
+ outcome?: string;
11
+ }
12
+ export interface AntiLoopLogger {
13
+ log(event: Omit<AntiLoopEvent, "timestamp">): void;
14
+ }
15
+ export declare function createAntiLoopLogger(logsDir: string): AntiLoopLogger;
@@ -0,0 +1,211 @@
1
+ :root {
2
+ --bg-base: #0A0B0E; --bg-surface: #12131A; --bg-card: #1A1B25; --bg-card-hover: #1E1F2B;
3
+ --bg-elevated: #222330; --border-default: #2A2B35; --border-subtle: #1E1F2B;
4
+ --accent-primary: #7C5CFC; --accent-hover: #9278FF; --accent-muted: rgba(124,92,252,0.12);
5
+ --accent-secondary: #00D4FF; --success: #22C55E; --success-muted: rgba(34,197,94,0.12);
6
+ --warning: #F59E0B; --warning-muted: rgba(245,158,11,0.12);
7
+ --danger: #EF4444; --danger-muted: rgba(239,68,68,0.12);
8
+ --info: #3B82F6; --info-muted: rgba(59,130,246,0.12);
9
+ --text-primary: #F0F1F5; --text-secondary: #8B8D97; --text-tertiary: #5A5C66;
10
+ --font-body: "Inter",system-ui,sans-serif; --font-mono: "JetBrains Mono",monospace;
11
+ --text-xs: 11px; --text-sm: 12.5px; --text-base: 14px; --text-lg: 17px; --text-xl: 20px; --text-2xl: 24px;
12
+ --space-1: 4px; --space-2: 8px; --space-3: 12px; --space-4: 16px; --space-5: 20px; --space-6: 24px;
13
+ --radius-sm: 4px; --radius-md: 6px; --radius-lg: 8px; --radius-xl: 12px; --radius-full: 9999px;
14
+ --shadow-sm: 0 2px 4px rgba(0,0,0,0.3); --sidebar-w: 240px; --header-h: 56px;
15
+ }
16
+ *,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
17
+ html{font-size:16px;-webkit-font-smoothing:antialiased}
18
+ body{font-family:var(--font-body);font-size:var(--text-base);color:var(--text-primary);background:var(--bg-base);display:flex;min-height:100vh}
19
+ .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}
20
+ .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)}
21
+ .sidebar-logo-text{font-size:var(--text-lg);font-weight:700;font-family:var(--font-mono);color:var(--accent-secondary);letter-spacing:-.5px}
22
+ .sidebar-logo-version{font-size:var(--text-xs);color:var(--text-tertiary);font-family:var(--font-mono)}
23
+ .sidebar-nav{flex:1;padding:var(--space-4) var(--space-3);display:flex;flex-direction:column;gap:var(--space-1);overflow-y:auto}
24
+ .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)}
25
+ .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}
26
+ .sidebar-item:hover{background:var(--bg-card);color:var(--text-primary)}
27
+ .sidebar-item.active{background:var(--accent-muted);color:var(--accent-primary)}
28
+ .sidebar-item svg{flex-shrink:0;opacity:.7}.sidebar-item.active svg{opacity:1}
29
+ .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}
30
+ .sidebar-badge.danger{background:var(--danger-muted);color:var(--danger)}
31
+ .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)}
32
+ .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}
33
+ .sidebar-user-info{flex:1;min-width:0}
34
+ .sidebar-user-name{font-size:var(--text-sm);font-weight:500;color:var(--text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
35
+ .sidebar-user-role{font-size:var(--text-xs);color:var(--text-tertiary)}
36
+ .main{flex:1;display:flex;flex-direction:column;min-width:0;height:100vh}
37
+ .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}
38
+ .header-left{display:flex;align-items:center;gap:var(--space-6)}
39
+ .header-right{display:flex;align-items:center;gap:var(--space-3)}
40
+ .header-tabs{display:flex;gap:var(--space-1);background:var(--bg-base);padding:3px;border-radius:var(--radius-lg)}
41
+ .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}
42
+ .header-tab:hover{color:var(--text-primary);background:var(--bg-card)}
43
+ .header-tab.active{color:var(--text-primary);background:var(--bg-card);box-shadow:var(--shadow-sm)}
44
+ .header-tab svg{width:14px;height:14px}
45
+ .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}
46
+ .header-search:hover{border-color:var(--accent-primary)}
47
+ .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}
48
+ .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}
49
+ .header-icon-btn:hover{background:var(--bg-card);color:var(--text-primary)}
50
+ .notif-dot{position:absolute;top:6px;right:6px;width:7px;height:7px;border-radius:50%;background:var(--danger);border:2px solid var(--bg-surface)}
51
+ .content{flex:1;padding:var(--space-6);overflow-y:auto}
52
+ .tab-panel{display:none}.tab-panel.active{display:block}
53
+ .page-header{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:var(--space-6)}
54
+ .page-title{font-size:var(--text-xl);font-weight:700;color:var(--text-primary);margin-bottom:var(--space-1)}
55
+ .page-subtitle{font-size:var(--text-sm);color:var(--text-secondary)}
56
+ .page-actions{display:flex;gap:var(--space-2)}
57
+ .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}
58
+ .btn-primary{background:var(--accent-primary);color:#fff}.btn-primary:hover{background:var(--accent-hover)}
59
+ .btn-secondary{background:var(--bg-card);color:var(--text-primary);border:1px solid var(--border-default)}
60
+ .btn-secondary:hover{background:var(--bg-card-hover);border-color:var(--text-tertiary)}
61
+ .btn-ghost{background:transparent;color:var(--text-secondary)}.btn-ghost:hover{background:var(--bg-card);color:var(--text-primary)}
62
+ .btn svg{width:14px;height:14px}
63
+ .kpi-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-4);margin-bottom:var(--space-6)}
64
+ .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}
65
+ .kpi-card:hover{border-color:var(--bg-elevated)}
66
+ .kpi-card-header{display:flex;justify-content:space-between;align-items:flex-start}
67
+ .kpi-label{font-size:var(--text-xs);color:var(--text-secondary);text-transform:uppercase;letter-spacing:.05em}
68
+ .kpi-icon{width:36px;height:36px;border-radius:var(--radius-lg);display:flex;align-items:center;justify-content:center}
69
+ .kpi-icon.purple{background:var(--accent-muted);color:var(--accent-primary)}
70
+ .kpi-icon.cyan{background:rgba(0,212,255,0.12);color:var(--accent-secondary)}
71
+ .kpi-icon.amber{background:var(--warning-muted);color:var(--warning)}
72
+ .kpi-icon.green{background:var(--success-muted);color:var(--success)}
73
+ .kpi-icon.red{background:var(--danger-muted);color:var(--danger)}
74
+ .kpi-icon.blue{background:var(--info-muted);color:var(--info)}
75
+ .kpi-value{font-size:var(--text-2xl);font-weight:700}
76
+ .kpi-value.small{font-size:var(--text-lg)}
77
+ .kpi-trend{display:flex;align-items:center;gap:var(--space-1);font-size:var(--text-xs)}
78
+ .kpi-trend.up{color:var(--success)}.kpi-trend.down{color:var(--danger)}.kpi-trend.flat{color:var(--text-tertiary)}
79
+ .section{margin-bottom:var(--space-6)}
80
+ .section-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:var(--space-4)}
81
+ .section-title{font-size:var(--text-base);font-weight:600;color:var(--text-primary)}
82
+ .section-subtitle{font-size:var(--text-xs);color:var(--text-secondary);margin-top:2px}
83
+ .filters-bar{display:flex;gap:var(--space-1);background:var(--bg-base);padding:3px;border-radius:var(--radius-lg)}
84
+ .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}
85
+ .filter-chip:hover{color:var(--text-primary)}.filter-chip.active{background:var(--bg-card);color:var(--text-primary);box-shadow:var(--shadow-sm)}
86
+ .agent-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:var(--space-3)}
87
+ .agent-card{background:var(--bg-card);border:1px solid var(--border-default);border-radius:var(--radius-xl);padding:var(--space-4);transition:all .15s}
88
+ .agent-card:hover{border-color:var(--bg-elevated)}
89
+ .agent-card-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:var(--space-3)}
90
+ .agent-name{font-size:var(--text-sm);font-weight:600}
91
+ .agent-role{font-size:var(--text-xs);color:var(--text-tertiary);font-family:var(--font-mono)}
92
+ .agent-meta{display:flex;flex-direction:column;gap:var(--space-1);font-size:var(--text-xs);color:var(--text-secondary)}
93
+ .agent-meta-row{display:flex;justify-content:space-between}
94
+ .agent-meta-val{font-family:var(--font-mono);color:var(--text-primary)}
95
+ .agent-cpu{margin-top:var(--space-1)}
96
+ .agent-cpu-header{display:flex;justify-content:space-between;margin-bottom:4px}
97
+ .agent-cpu-label{font-size:var(--text-xs);color:var(--text-tertiary)}
98
+ .agent-cpu-pct{font-size:var(--text-xs);font-family:var(--font-mono)}
99
+ .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}
100
+ .badge-dot{width:6px;height:6px;border-radius:50%}
101
+ .badge-success{background:var(--success-muted);color:var(--success)}.badge-success .badge-dot{background:var(--success)}
102
+ .badge-warning{background:var(--warning-muted);color:var(--warning)}.badge-warning .badge-dot{background:var(--warning)}
103
+ .badge-danger{background:var(--danger-muted);color:var(--danger)}.badge-danger .badge-dot{background:var(--danger)}
104
+ .badge-info{background:var(--info-muted);color:var(--info)}
105
+ .badge-purple{background:var(--accent-muted);color:var(--accent-primary)}
106
+ .badge-cyan{background:rgba(0,212,255,0.12);color:var(--accent-secondary)}
107
+ .progress-bar{height:6px;background:var(--bg-surface);border-radius:3px;overflow:hidden}
108
+ .progress-fill{height:100%;border-radius:3px;transition:width .5s}
109
+ .progress-fill.green{background:var(--success)}.progress-fill.amber{background:var(--warning)}
110
+ .progress-fill.red{background:var(--danger)}.progress-fill.purple{background:var(--accent-primary)}
111
+ .card{background:var(--bg-card);border:1px solid var(--border-default);border-radius:var(--radius-xl);overflow:hidden;margin-bottom:var(--space-6)}
112
+ .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)}
113
+ .card-title{font-size:var(--text-sm);font-weight:600}
114
+ .card-body{padding:var(--space-5)}.card-body.no-pad{padding:0}
115
+ .grid-2{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-4);margin-bottom:var(--space-6)}
116
+ .table-wrapper{overflow-x:auto}
117
+ .data-table{width:100%;border-collapse:collapse;font-size:var(--text-sm)}
118
+ .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)}
119
+ .data-table td{padding:var(--space-3) var(--space-4);border-bottom:1px solid var(--border-subtle)}
120
+ .data-table tr:hover td{background:var(--bg-card-hover)}
121
+ .data-table .mono{font-family:var(--font-mono);font-size:var(--text-xs)}
122
+ .queue-bars{display:flex;gap:var(--space-4)}
123
+ .queue-col{flex:1}.queue-header{display:flex;justify-content:space-between;margin-bottom:var(--space-2)}
124
+ .queue-label{font-size:var(--text-xs);color:var(--text-secondary)}
125
+ .queue-count{font-size:var(--text-xs);font-family:var(--font-mono)}
126
+ .queue-bar-group{display:flex;gap:4px;height:24px}
127
+ .queue-bar{border-radius:var(--radius-sm)}
128
+ .gauge-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-4)}
129
+ .gauge-card{text-align:center}
130
+ .gauge-ring{position:relative;width:100px;height:100px;margin:0 auto var(--space-2)}
131
+ .gauge-ring svg{width:100%;height:100%;transform:rotate(-90deg)}
132
+ .gauge-ring circle{fill:none;stroke-width:4}
133
+ .gauge-ring .track{stroke:var(--bg-surface)}
134
+ .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)}
135
+ .gauge-label{font-size:var(--text-xs);color:var(--text-secondary);margin-bottom:2px}
136
+ .gauge-sub{font-size:10px;color:var(--text-tertiary);font-family:var(--font-mono)}
137
+ .heartbeat-grid{display:flex;flex-wrap:wrap;gap:3px}
138
+ .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}
139
+ .hb-cell.healthy{background:rgba(34,197,94,0.2);color:var(--success)}
140
+ .hb-cell.warn{background:rgba(245,158,11,0.2);color:var(--warning)}
141
+ .hb-cell.fail{background:rgba(239,68,68,0.2);color:var(--danger)}
142
+ .hb-cell.off{background:rgba(90,92,102,0.2);color:var(--text-tertiary)}
143
+ .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)}
144
+ .incident-item:last-child{border-bottom:none}
145
+ .incident-icon{width:32px;height:32px;border-radius:var(--radius-lg);display:flex;align-items:center;justify-content:center;flex-shrink:0}
146
+ .incident-icon svg{width:16px;height:16px}
147
+ .incident-content{flex:1;min-width:0}
148
+ .incident-title{font-size:var(--text-sm);font-weight:500;color:var(--text-primary);margin-bottom:2px}
149
+ .incident-desc{font-size:var(--text-xs);color:var(--text-secondary);margin-bottom:4px}
150
+ .incident-time{font-size:10px;color:var(--text-tertiary);font-family:var(--font-mono)}
151
+ .alert-list{display:flex;flex-direction:column;gap:var(--space-2)}
152
+ .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)}
153
+ .alert-item.warning{background:var(--warning-muted);color:var(--warning);border:1px solid rgba(245,158,11,0.2)}
154
+ .alert-item.critical{background:var(--danger-muted);color:var(--danger);border:1px solid rgba(239,68,68,0.2)}
155
+ .kanban-board{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-4)}
156
+ .kanban-col{background:var(--bg-surface);border:1px solid var(--border-default);border-radius:var(--radius-xl);display:flex;flex-direction:column}
157
+ .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}
158
+ .kanban-count{font-size:var(--text-xs);padding:1px 8px;border-radius:8px;background:var(--bg-card);color:var(--text-secondary)}
159
+ .kanban-body{flex:1;padding:var(--space-3);display:flex;flex-direction:column;gap:var(--space-2)}
160
+ .kanban-card{background:var(--bg-card);border:1px solid var(--border-default);border-radius:var(--radius-lg);padding:var(--space-3);transition:all .15s}
161
+ .kanban-card:hover{border-color:var(--bg-elevated)}
162
+ .kanban-card-title{font-size:var(--text-sm);font-weight:500;margin-bottom:var(--space-2)}
163
+ .kanban-card-meta{display:flex;justify-content:space-between;font-size:var(--text-xs);color:var(--text-secondary)}
164
+ .prio{font-size:10px;padding:1px 6px;border-radius:4px;font-weight:600}
165
+ .prio.critical{background:var(--danger-muted);color:var(--danger)}
166
+ .prio.high{background:var(--warning-muted);color:var(--warning)}
167
+ .prio.medium{background:var(--info-muted);color:var(--info)}
168
+ .prio.low{background:rgba(139,141,151,0.15);color:var(--text-tertiary)}
169
+ .empty,.error{display:flex;flex-direction:column;align-items:center;gap:12px;padding:40px;color:var(--text-secondary);text-align:center}
170
+ .error{color:var(--danger)}
171
+ .mono{font-family:var(--font-mono)}
172
+ .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}
173
+ .skeleton-kpi{height:100px}.skeleton-row{height:40px}.skeleton-card{height:160px}
174
+ @keyframes shimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}
175
+ /* LOGS */
176
+ .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)}
177
+ .log-entry{display:flex;gap:var(--space-3);padding:2px var(--space-2);border-radius:2px;line-height:1.6}
178
+ .log-entry:hover{background:var(--bg-card)}
179
+ .log-time{color:var(--text-tertiary);white-space:nowrap;flex-shrink:0;width:80px}
180
+ .log-level{width:42px;flex-shrink:0;font-weight:600;text-transform:uppercase}
181
+ .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)}
182
+ .log-source{width:70px;flex-shrink:0;color:var(--accent-secondary)}
183
+ .log-msg{color:var(--text-primary);word-break:break-word}
184
+ .log-entry.hidden{display:none}
185
+
186
+ /* MEMORY */
187
+ .memory-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(360px,1fr));gap:var(--space-3)}
188
+ .memory-card{background:var(--bg-card);border:1px solid var(--border-default);border-radius:var(--radius-xl);padding:var(--space-4)}
189
+ .memory-card:hover{border-color:var(--bg-elevated)}
190
+ .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)}
191
+ .mem-type.episodic{background:var(--accent-muted);color:var(--accent-primary)}
192
+ .mem-type.semantic{background:var(--success-muted);color:var(--success)}
193
+ .mem-type.procedural{background:rgba(0,212,255,0.12);color:var(--accent-secondary)}
194
+ .mem-type.reflection{background:var(--warning-muted);color:var(--warning)}
195
+ .mem-content{font-size:var(--text-sm);color:var(--text-primary);margin-bottom:var(--space-2);line-height:1.5}
196
+ .mem-meta{font-size:10px;color:var(--text-tertiary);display:flex;justify-content:space-between}
197
+
198
+ /* SKILLS */
199
+ .skills-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:var(--space-3)}
200
+ .skill-card{background:var(--bg-card);border:1px solid var(--border-default);border-radius:var(--radius-xl);padding:var(--space-4);transition:all .15s}
201
+ .skill-card:hover{border-color:var(--bg-elevated)}
202
+ .skill-name{font-size:var(--text-sm);font-weight:600;color:var(--accent-secondary);font-family:var(--font-mono);margin-bottom:var(--space-1)}
203
+ .skill-desc{font-size:var(--text-xs);color:var(--text-secondary);margin-bottom:var(--space-2);line-height:1.5}
204
+ .skill-meta{font-size:10px;color:var(--text-tertiary);font-family:var(--font-mono)}
205
+
206
+ /* CONFIG EDITOR */
207
+ .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}
208
+ .config-editor:focus{outline:1px solid var(--accent-primary)}
209
+
210
+ @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)}}
211
+ @media(max-width:768px){.kpi-grid,.grid-2{grid-template-columns:1fr}.kanban-board{grid-template-columns:1fr}.agent-grid{grid-template-columns:1fr}}
@@ -0,0 +1,173 @@
1
+ <!DOCTYPE html>
2
+ <html lang="fr">
3
+ <head>
4
+ <meta charset="utf-8">
5
+ <meta name="viewport" content="width=1024, initial-scale=1">
6
+ <title>MaTrixOS Dashboard</title>
7
+ <link rel="preconnect" href="https://fonts.googleapis.com">
8
+ <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap" rel="stylesheet">
9
+ <link rel="stylesheet" href="css/style.css">
10
+ </head>
11
+ <body>
12
+ <aside class="sidebar">
13
+ <div class="sidebar-logo">
14
+ <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>
15
+ <div><div class="sidebar-logo-text">MaTrixOS</div><div class="sidebar-logo-version">v0.1.0</div></div>
16
+ </div>
17
+ <nav class="sidebar-nav">
18
+ <div class="sidebar-section">Command</div>
19
+ <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>
20
+ <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>
21
+ <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>
22
+ <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>
23
+ <div class="sidebar-section">Operations</div>
24
+ <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>
25
+ <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>
26
+ <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>
27
+ <div class="sidebar-section">System</div>
28
+ <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>
29
+ <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>
30
+ <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>
31
+ </nav>
32
+ <div class="sidebar-footer">
33
+ <div class="sidebar-avatar">SM</div>
34
+ <div class="sidebar-user-info"><div class="sidebar-user-name">Shiro</div><div class="sidebar-user-role">Admin</div></div>
35
+ </div>
36
+ </aside>
37
+
38
+ <div class="main">
39
+ <header class="header">
40
+ <div class="header-left">
41
+ <div class="header-tabs" id="headerTabs">
42
+ <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>
43
+ <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>
44
+ <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>
45
+ <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>
46
+ <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>
47
+ <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>
48
+ <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>
49
+ <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>
50
+ </div>
51
+ </div>
52
+ <div class="header-right">
53
+ <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>
54
+ <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>
55
+ <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>
56
+ </div>
57
+ </header>
58
+
59
+ <div class="content" id="tabContent">
60
+ <div id="tab-architect" class="tab-panel active">
61
+ <div class="page-header">
62
+ <div><h1 class="page-title">Architect Overview</h1><p class="page-subtitle">Monitor agent sessions, queues, and system orchestration</p></div>
63
+ <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>
64
+ </div>
65
+ <div class="kpi-grid" id="archKpis"></div>
66
+ <div class="section">
67
+ <div class="section-header">
68
+ <div><h2 class="section-title">Agent Fleet</h2><p class="section-subtitle">Real-time status of all registered agents</p></div>
69
+ <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>
70
+ </div>
71
+ <div class="agent-grid" id="agentGrid"></div>
72
+ </div>
73
+ <div class="section">
74
+ <div class="section-header"><div><h2 class="section-title">Active Sessions</h2><p class="section-subtitle">Currently running agent sessions</p></div></div>
75
+ <div class="card"><div class="card-body no-pad"><div class="table-wrapper" id="sessionsTable"></div></div></div>
76
+ </div>
77
+ <div class="section">
78
+ <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>
79
+ <div class="card"><div class="card-body" id="sessionQueue"></div></div>
80
+ </div>
81
+ </div>
82
+
83
+ <div id="tab-health" class="tab-panel">
84
+ <div class="page-header">
85
+ <div><h1 class="page-title">System Health</h1><p class="page-subtitle">Heartbeat monitoring, incident watchdog, and system resource status</p></div>
86
+ <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>
87
+ </div>
88
+ <div class="kpi-grid" id="healthKpis"></div>
89
+ <div class="grid-2">
90
+ <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>
91
+ <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>
92
+ </div>
93
+ <div class="section">
94
+ <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>
95
+ <div class="card"><div class="card-body no-pad" id="incidentList"></div></div>
96
+ </div>
97
+ </div>
98
+
99
+ <div id="tab-cost" class="tab-panel">
100
+ <div class="page-header">
101
+ <div><h1 class="page-title">Cost Management</h1><p class="page-subtitle">Budget consumption, cost per agent/session, and alert thresholds</p></div>
102
+ <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>
103
+ </div>
104
+ <div class="kpi-grid" id="costKpis"></div>
105
+ <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>
106
+ <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>
107
+ </div>
108
+
109
+ <div id="tab-kanban" class="tab-panel">
110
+ <div class="page-header">
111
+ <div><h1 class="page-title">Kanban Board</h1><p class="page-subtitle">Task tracking across all agents</p></div>
112
+ <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>
113
+ </div>
114
+ <div class="kanban-board" id="kanbanBoard"></div>
115
+ </div>
116
+
117
+ <div id="tab-logs" class="tab-panel">
118
+ <div class="page-header">
119
+ <div><h1 class="page-title">Live Logs</h1><p class="page-subtitle">Real-time event stream from MaTrixOS agents and services</p></div>
120
+ <div class="page-actions">
121
+ <div class="filters-bar" id="logFilters">
122
+ <button class="filter-chip active" data-level="all">All</button>
123
+ <button class="filter-chip" data-level="error">Error</button>
124
+ <button class="filter-chip" data-level="warn">Warning</button>
125
+ <button class="filter-chip" data-level="info">Info</button>
126
+ <button class="filter-chip" data-level="debug">Debug</button>
127
+ </div>
128
+ <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>
129
+ </div>
130
+ </div>
131
+ <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>
132
+ </div>
133
+
134
+ <div id="tab-memory" class="tab-panel">
135
+ <div class="page-header">
136
+ <div><h1 class="page-title">Memory</h1><p class="page-subtitle">Episodic, semantic, and procedural memories stored by the learning loop</p></div>
137
+ <div class="page-actions">
138
+ <div class="filters-bar" id="memFilters">
139
+ <button class="filter-chip active" data-mtype="all">All</button>
140
+ <button class="filter-chip" data-mtype="episodic">Episodic</button>
141
+ <button class="filter-chip" data-mtype="semantic">Semantic</button>
142
+ <button class="filter-chip" data-mtype="procedural">Procedural</button>
143
+ <button class="filter-chip" data-mtype="reflection">Reflection</button>
144
+ </div>
145
+ </div>
146
+ </div>
147
+ <div class="memory-grid" id="memoryGrid"></div>
148
+ </div>
149
+
150
+ <div id="tab-skills" class="tab-panel">
151
+ <div class="page-header">
152
+ <div><h1 class="page-title">Skills</h1><p class="page-subtitle">Installed MaTrixOS and shared skills</p></div>
153
+ <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>
154
+ </div>
155
+ <div class="skills-grid" id="skillsGrid"></div>
156
+ </div>
157
+
158
+ <div id="tab-config" class="tab-panel">
159
+ <div class="page-header">
160
+ <div><h1 class="page-title">Configuration</h1><p class="page-subtitle">Edit matrixos.jsonc — MaTrixOS agent configuration</p></div>
161
+ <div class="page-actions">
162
+ <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>
163
+ <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>
164
+ </div>
165
+ </div>
166
+ <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>
167
+ </div>
168
+ </div>
169
+ </div>
170
+ <script src="js/api.js"></script>
171
+ <script src="js/app.js"></script>
172
+ </body>
173
+ </html>
@@ -0,0 +1,2 @@
1
+ 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')}
2
+ async function fetchJSON(e){const r=await fetch(`/api${e}`);if(!r.ok)throw new Error(`API ${e}: ${r.status}`);return r.json()}