agent-teams-dashboard 0.1.0 → 0.2.0
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.
- package/README.md +28 -2
- package/README.zh-TW.md +40 -6
- package/dist/assets/index-Ddn7oByj.js +49 -0
- package/dist/assets/index-DyZplrwc.css +1 -0
- package/dist/index.html +2 -2
- package/package.json +1 -1
- package/server-dist/server/teamsApi.js +17 -0
- package/server-dist/server/teamsCache.js +37 -0
- package/server-dist/server/teamsWatcher.js +28 -1
- package/dist/assets/index-BwUrrF1R.css +0 -1
- package/dist/assets/index-DEOAkXJf.js +0 -49
|
@@ -0,0 +1 @@
|
|
|
1
|
+
:root{--bg-primary: #1a1a2e;--bg-secondary: #16213e;--bg-sidebar: #0f0f1a;--bg-sidebar-2: #111122;--bg-card: #16213e;--bg-hover: #1f2b47;--bg-active: #253350;--border-primary: #2a2a3e;--border-subtle: #222236;--text-primary: #e0e0e0;--text-secondary: #888;--text-muted: #555;--accent-blue: #58a6ff;--accent-green: #00ff88;--accent-yellow: #ffd700;--accent-red: #ff4444;--accent-purple: #bc8cff;--accent-cyan: #00d4ff;--font-mono: "JetBrains Mono", "Fira Code", Consolas, monospace;--font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;--radius-sm: 4px;--radius-md: 6px;--radius-lg: 8px;--transition-fast: .15s ease}*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}body{font-family:var(--font-mono);font-size:13px;line-height:1.5;color:var(--text-primary);background:var(--bg-primary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.app-container{display:flex;height:100vh;overflow:hidden}.teams-panel{width:200px;min-width:200px;background:var(--bg-sidebar);border-right:1px solid var(--border-primary);display:flex;flex-direction:column;overflow:hidden}.teams-panel__header{padding:14px 12px;border-bottom:1px solid var(--border-primary)}.teams-panel__title{font-size:13px;font-weight:700;color:var(--text-primary);letter-spacing:.04em;text-transform:uppercase}.teams-panel__conn-dot{font-size:10px}.teams-panel__nav{flex:1;overflow-y:auto;padding:6px}.teams-panel__nav-item{display:flex;align-items:center;gap:8px;width:100%;padding:8px 10px;border:none;background:transparent;color:var(--text-secondary);font-family:var(--font-mono);font-size:12px;cursor:pointer;border-radius:var(--radius-sm);transition:all var(--transition-fast);text-align:left}.teams-panel__nav-item:hover{background:var(--bg-hover);color:var(--text-primary)}.teams-panel__nav-item--active{background:var(--bg-active);color:var(--accent-cyan)}.teams-panel__nav-icon{font-size:14px}.teams-panel__divider{height:1px;background:var(--border-subtle);margin:6px 4px}.teams-panel__team{display:flex;flex-direction:column;gap:4px;width:100%;padding:8px 10px;margin-bottom:2px;border:none;background:transparent;color:var(--text-primary);font-family:var(--font-mono);font-size:12px;cursor:pointer;border-radius:var(--radius-sm);border-left:3px solid transparent;transition:all var(--transition-fast);text-align:left}.teams-panel__team:hover{background:var(--bg-hover)}.teams-panel__team--active{background:var(--bg-active);border-left-color:var(--accent-cyan)}.teams-panel__team-row{display:flex;align-items:center;gap:6px}.teams-panel__team-dot{font-size:10px;flex-shrink:0;line-height:1}.teams-panel__team-name{flex:1;min-width:0}.teams-panel__team-progress{display:flex;align-items:center;gap:6px;padding-left:16px}.teams-panel__team-bar{flex:1;height:3px;background:var(--border-primary);border-radius:2px;overflow:hidden}.teams-panel__team-bar-fill{height:100%;background:var(--accent-green);border-radius:2px;transition:width .3s ease}.teams-panel__team-pct{flex-shrink:0;white-space:nowrap}.teams-panel__footer{padding:10px 12px;border-top:1px solid var(--border-primary)}.teams-panel__footer-stats{display:flex;gap:10px}.agents-panel{width:260px;min-width:260px;background:var(--bg-sidebar-2);border-right:1px solid var(--border-primary);display:flex;flex-direction:column;overflow:hidden}.agents-panel__header{padding:14px 12px;border-bottom:1px solid var(--border-primary);display:flex;align-items:center;justify-content:space-between;gap:8px}.agents-panel__title{font-size:13px;font-weight:700;color:var(--text-primary);min-width:0}.agents-panel__task-summary{flex-shrink:0;white-space:nowrap}.agents-panel__empty{flex:1;display:flex;align-items:center;justify-content:center}.agents-panel__actions{padding:8px;border-bottom:1px solid var(--border-subtle)}.agents-panel__tasks-btn{display:flex;align-items:center;gap:6px;width:100%;padding:6px 10px;border:1px solid var(--border-primary);background:transparent;color:var(--text-secondary);font-family:var(--font-mono);font-size:12px;cursor:pointer;border-radius:var(--radius-sm);transition:all var(--transition-fast)}.agents-panel__tasks-btn:hover{background:var(--bg-hover);color:var(--text-primary);border-color:var(--text-muted)}.agents-panel__tasks-btn--active{background:var(--bg-active);color:var(--accent-cyan);border-color:var(--accent-cyan)}.agents-panel__list{flex:1;overflow-y:auto;padding:6px}.agents-panel__agent{margin-bottom:2px}.agents-panel__agent-btn{display:flex;align-items:center;gap:6px;width:100%;padding:7px 10px;border:none;background:transparent;color:var(--text-primary);font-family:var(--font-mono);font-size:12px;cursor:pointer;border-radius:var(--radius-sm);transition:all var(--transition-fast);text-align:left;border-left:3px solid transparent}.agents-panel__agent-btn:hover{background:var(--bg-hover)}.agents-panel__agent-btn--active{background:var(--bg-active);border-left-color:var(--accent-cyan);color:var(--accent-cyan)}.agents-panel__agent-dot{font-size:10px;flex-shrink:0;line-height:1}.agents-panel__agent-name{flex:1;min-width:0}.agents-panel__agent-type{flex-shrink:0}.agents-panel__agent-meta{display:flex;align-items:center;gap:8px;padding:2px 10px 4px 26px}.agents-panel__session-toggle{border:none;background:transparent;color:var(--text-muted);font-family:var(--font-mono);font-size:11px;cursor:pointer;padding:0;transition:color var(--transition-fast)}.agents-panel__session-toggle:hover{color:var(--text-secondary)}.agents-panel__sessions{padding:2px 10px 6px 26px}.agents-panel__session{display:flex;align-items:center;gap:8px;border-left:1px solid var(--border-subtle);padding:3px 0 3px 8px;margin-left:4px}.agents-panel__session-id{font-size:11px;color:var(--accent-purple);font-family:var(--font-mono)}.agents-panel__session-time{font-size:11px;color:var(--text-muted)}.agents-panel__session-count{font-size:10px;color:var(--text-muted);background:var(--bg-hover);padding:0 4px;border-radius:3px}.main-panel{flex:1;overflow-y:auto;padding:16px}.placeholder{display:flex;align-items:center;justify-content:center;height:100%;color:var(--text-muted);font-size:14px}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--border-primary);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}*{scrollbar-width:thin;scrollbar-color:var(--border-primary) transparent}.text-primary{color:var(--text-primary)}.text-secondary{color:var(--text-secondary)}.text-muted{color:var(--text-muted)}.text-blue{color:var(--accent-blue)}.text-green{color:var(--accent-green)}.text-yellow{color:var(--accent-yellow)}.text-red{color:var(--accent-red)}.text-purple{color:var(--accent-purple)}.text-cyan{color:var(--accent-cyan)}.bg-card{background:var(--bg-card)}.bg-hover{background:var(--bg-hover)}.rounded-sm{border-radius:var(--radius-sm)}.rounded-md{border-radius:var(--radius-md)}.rounded-lg{border-radius:var(--radius-lg)}.flex{display:flex}.flex-col{flex-direction:column}.flex-1{flex:1}.items-center{align-items:center}.justify-between{justify-content:space-between}.gap-1{gap:4px}.gap-2{gap:8px}.gap-3{gap:12px}.gap-4{gap:16px}.p-1{padding:4px}.p-2{padding:8px}.p-3{padding:12px}.p-4{padding:16px}.px-2{padding-left:8px;padding-right:8px}.px-3{padding-left:12px;padding-right:12px}.py-1{padding-top:4px;padding-bottom:4px}.py-2{padding-top:8px;padding-bottom:8px}.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.font-mono{font-family:var(--font-mono)}.font-sans{font-family:var(--font-sans)}.font-bold{font-weight:600}.text-sm{font-size:12px}.text-xs{font-size:11px}.border{border:1px solid var(--border-primary)}.border-b{border-bottom:1px solid var(--border-primary)}.cursor-pointer{cursor:pointer}.select-none{-webkit-user-select:none;user-select:none}.transition{transition:all var(--transition-fast)}.panel-title{font-size:16px;font-weight:600;color:var(--text-primary);margin-bottom:16px}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;gap:12px;text-align:center}.empty-state__icon{font-size:48px}.empty-state__title{font-size:16px;font-weight:600;color:var(--text-secondary)}.empty-state__text{max-width:400px;line-height:1.6}.overview-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:12px}.overview-card{background:var(--bg-card);border:1px solid var(--border-primary);border-left:3px solid var(--text-muted);border-radius:var(--radius-md);padding:16px;transition:all var(--transition-fast)}.overview-card:hover{border-color:var(--accent-cyan);border-left-color:inherit;background:var(--bg-hover)}.overview-card--active{border-left-color:var(--accent-green)}.overview-card--idle{border-left-color:var(--accent-yellow)}.overview-card--done{border-left-color:var(--accent-cyan)}.overview-card--inactive{border-left-color:var(--text-muted)}.overview-card__header{display:flex;justify-content:space-between;align-items:center;margin-bottom:4px}.overview-card__meta{margin-bottom:12px}.overview-card__progress{display:flex;align-items:center;gap:8px;margin-bottom:8px}.progress-bar{flex:1;height:4px;background:var(--border-primary);border-radius:2px;overflow:hidden}.progress-bar__fill{height:100%;background:var(--accent-green);border-radius:2px;transition:width .3s ease}.overview-card__footer{text-align:right}.pulse-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--accent-green);animation:pulse 2s ease-in-out infinite;flex-shrink:0}@keyframes pulse{0%,to{opacity:1;box-shadow:0 0 #0f86}50%{opacity:.7;box-shadow:0 0 0 6px #0f80}}.task-board__columns{display:flex;gap:12px}.task-board__column{flex:1;min-width:0}.task-board__column-header{display:flex;justify-content:space-between;align-items:center;padding:8px 12px;margin-bottom:8px;border-bottom:2px solid var(--border-primary);font-weight:600;font-size:12px;color:var(--text-secondary)}.task-card{background:var(--bg-card);border:1px solid var(--border-primary);border-radius:var(--radius-md);padding:12px;margin-bottom:8px;border-left:3px solid var(--text-muted)}.task-card--in-progress{border-left-color:var(--accent-yellow)}.task-card--completed{border-left-color:var(--accent-green)}.task-card--pending{border-left-color:var(--text-muted)}.task-card__subject{font-size:12px;margin-bottom:4px;color:var(--text-primary)}.task-card__desc{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin-bottom:8px;line-height:1.4}.task-card__meta{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.task-card__owner{display:inline-block;padding:2px 6px;background:#00d4ff26;color:var(--accent-cyan);border-radius:var(--radius-sm);font-size:11px}.task-card__blocked{color:var(--accent-yellow)}.agent-panel{display:flex;flex-direction:column;height:100%}.agent-panel__header{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:12px;padding-bottom:12px;border-bottom:1px solid var(--border-primary)}.agent-panel__header .panel-title{margin-bottom:0}.status-badge{display:inline-block;padding:2px 8px;border-radius:10px;font-size:11px;font-weight:600}.status-badge--active{background:#00ff8826;color:var(--accent-green)}.status-badge--idle{background:#ffd70026;color:var(--accent-yellow)}.status-badge--done{background:#00d4ff26;color:var(--accent-cyan)}.status-badge--unknown{background:#5555554d;color:var(--text-muted)}.agent-panel__tasks{padding:8px 12px;margin-bottom:12px;background:var(--bg-card);border-radius:var(--radius-md);border:1px solid var(--border-primary)}.agent-panel__task-item{display:flex;align-items:center;gap:8px;padding:4px 0;font-size:12px}.task-status-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}.task-status-dot--pending{background:var(--text-muted)}.task-status-dot--in_progress{background:var(--accent-yellow)}.task-status-dot--completed{background:var(--accent-green)}.agent-panel__feed{flex:1;overflow-y:auto;padding:4px}.activity-entry{padding:8px 12px;margin-bottom:4px;border-radius:var(--radius-sm);font-size:12px}.activity-entry--user{border-left:3px solid var(--accent-green);background:#00ff880d}.activity-entry--assistant{color:var(--accent-cyan)}.activity-entry--tool-use{background:#ffd7000d}.activity-entry--tool-result{color:var(--text-muted)}.activity-entry__header{display:flex;justify-content:space-between;align-items:center;margin-bottom:4px}.activity-entry__role{color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em}.activity-entry__body{word-break:break-word}.activity-entry__code{background:var(--bg-secondary);padding:8px;border-radius:var(--radius-sm);overflow-x:auto;font-size:11px;white-space:pre-wrap;margin-top:4px}.activity-entry__tool-use{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}.activity-entry__tool-badge{display:inline-block;padding:2px 6px;background:#ffd70026;color:var(--accent-yellow);border-radius:var(--radius-sm);font-size:11px;white-space:nowrap}.activity-entry__tool-input{font-size:11px;word-break:break-all}.activity-entry__tool-result{font-size:11px;line-height:1.4}
|
package/dist/index.html
CHANGED
|
@@ -4,8 +4,8 @@
|
|
|
4
4
|
<meta charset="UTF-8" />
|
|
5
5
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
6
6
|
<title>Agent Teams Dashboard</title>
|
|
7
|
-
<script type="module" crossorigin src="/assets/index-
|
|
8
|
-
<link rel="stylesheet" crossorigin href="/assets/index-
|
|
7
|
+
<script type="module" crossorigin src="/assets/index-Ddn7oByj.js"></script>
|
|
8
|
+
<link rel="stylesheet" crossorigin href="/assets/index-DyZplrwc.css">
|
|
9
9
|
</head>
|
|
10
10
|
<body>
|
|
11
11
|
<div id="root"></div>
|
package/package.json
CHANGED
|
@@ -48,6 +48,23 @@ export async function handleTeamsApi(req, res) {
|
|
|
48
48
|
json(res, team);
|
|
49
49
|
return true;
|
|
50
50
|
}
|
|
51
|
+
// GET /api/agents/:agentId/sessions/:sessionId
|
|
52
|
+
const sessionDetailMatch = path.match(/^\/api\/agents\/([^/]+)\/sessions\/([^/]+)$/);
|
|
53
|
+
if (sessionDetailMatch) {
|
|
54
|
+
const agentId = decodeURIComponent(sessionDetailMatch[1]);
|
|
55
|
+
const sessionId = decodeURIComponent(sessionDetailMatch[2]);
|
|
56
|
+
const entries = cache.getSessionEntries(agentId, sessionId);
|
|
57
|
+
json(res, entries);
|
|
58
|
+
return true;
|
|
59
|
+
}
|
|
60
|
+
// GET /api/agents/:agentId/sessions
|
|
61
|
+
const sessionsMatch = path.match(/^\/api\/agents\/([^/]+)\/sessions$/);
|
|
62
|
+
if (sessionsMatch) {
|
|
63
|
+
const agentId = decodeURIComponent(sessionsMatch[1]);
|
|
64
|
+
const sessions = cache.getAgentSessions(agentId);
|
|
65
|
+
json(res, sessions);
|
|
66
|
+
return true;
|
|
67
|
+
}
|
|
51
68
|
// GET /api/agents/:agentId/activity
|
|
52
69
|
const agentMatch = path.match(/^\/api\/agents\/([^/]+)\/activity$/);
|
|
53
70
|
if (agentMatch) {
|
|
@@ -283,6 +283,43 @@ export function getSnapshot() {
|
|
|
283
283
|
export function getAgentActivity(agentId) {
|
|
284
284
|
return agentEntries.get(agentId) ?? [];
|
|
285
285
|
}
|
|
286
|
+
export function getAgentSessions(agentId) {
|
|
287
|
+
const entries = agentEntries.get(agentId);
|
|
288
|
+
if (!entries || entries.length === 0)
|
|
289
|
+
return [];
|
|
290
|
+
const sessionMap = new Map();
|
|
291
|
+
for (const entry of entries) {
|
|
292
|
+
const sid = entry.sessionId || 'unknown';
|
|
293
|
+
let group = sessionMap.get(sid);
|
|
294
|
+
if (!group) {
|
|
295
|
+
group = { entries: [] };
|
|
296
|
+
sessionMap.set(sid, group);
|
|
297
|
+
}
|
|
298
|
+
group.entries.push(entry);
|
|
299
|
+
}
|
|
300
|
+
const sessions = [];
|
|
301
|
+
for (const [sessionId, group] of sessionMap) {
|
|
302
|
+
const first = group.entries[0];
|
|
303
|
+
const last = group.entries[group.entries.length - 1];
|
|
304
|
+
sessions.push({
|
|
305
|
+
sessionId,
|
|
306
|
+
agentId,
|
|
307
|
+
slug: last.slug,
|
|
308
|
+
entryCount: group.entries.length,
|
|
309
|
+
firstTimestamp: first.timestamp,
|
|
310
|
+
lastTimestamp: last.timestamp,
|
|
311
|
+
});
|
|
312
|
+
}
|
|
313
|
+
// Sort by lastTimestamp descending (most recent first)
|
|
314
|
+
sessions.sort((a, b) => (b.lastTimestamp > a.lastTimestamp ? 1 : -1));
|
|
315
|
+
return sessions;
|
|
316
|
+
}
|
|
317
|
+
export function getSessionEntries(agentId, sessionId) {
|
|
318
|
+
const entries = agentEntries.get(agentId);
|
|
319
|
+
if (!entries)
|
|
320
|
+
return [];
|
|
321
|
+
return entries.filter(e => (e.sessionId || 'unknown') === sessionId);
|
|
322
|
+
}
|
|
286
323
|
// --- Full refresh ---
|
|
287
324
|
export async function refreshAll() {
|
|
288
325
|
await refreshTeams();
|
|
@@ -8,10 +8,12 @@ const TASKS_DIR = join(CLAUDE_DIR, 'tasks');
|
|
|
8
8
|
const DEBOUNCE_MS = 200;
|
|
9
9
|
const JSONL_POLL_MS = 2000;
|
|
10
10
|
const DIR_CHECK_MS = 5000;
|
|
11
|
+
const FULL_REFRESH_MS = 5000; // Fallback polling for environments where fs.watch doesn't work (e.g. Docker bind mounts)
|
|
11
12
|
let tasksWatcher = null;
|
|
12
13
|
let teamsWatcher = null;
|
|
13
14
|
let jsonlTimer = null;
|
|
14
15
|
let dirCheckTimer = null;
|
|
16
|
+
let fullRefreshTimer = null;
|
|
15
17
|
// --- Debounce helper ---
|
|
16
18
|
function debounce(fn, ms) {
|
|
17
19
|
let timer = null;
|
|
@@ -95,11 +97,31 @@ function startDirCheckPoller() {
|
|
|
95
97
|
}
|
|
96
98
|
}, DIR_CHECK_MS);
|
|
97
99
|
}
|
|
100
|
+
// --- Full refresh poller (fallback for Docker / environments without fs.watch) ---
|
|
101
|
+
function startFullRefreshPoller() {
|
|
102
|
+
let lastSnapshot = '';
|
|
103
|
+
fullRefreshTimer = setInterval(async () => {
|
|
104
|
+
await cache.refreshTeams();
|
|
105
|
+
for (const team of cache.getSnapshot().teams) {
|
|
106
|
+
await cache.refreshTasks(team.config.name);
|
|
107
|
+
}
|
|
108
|
+
const snapshot = JSON.stringify(cache.getSnapshot());
|
|
109
|
+
if (snapshot !== lastSnapshot) {
|
|
110
|
+
lastSnapshot = snapshot;
|
|
111
|
+
cache.onChange.emit('change');
|
|
112
|
+
}
|
|
113
|
+
}, FULL_REFRESH_MS);
|
|
114
|
+
}
|
|
98
115
|
// --- Agent JSONL poller ---
|
|
99
116
|
function startJsonlPoller() {
|
|
117
|
+
let lastSnapshot = '';
|
|
100
118
|
jsonlTimer = setInterval(async () => {
|
|
101
119
|
await cache.scanAgentJsonl();
|
|
102
|
-
cache.
|
|
120
|
+
const snapshot = JSON.stringify(cache.getSnapshot());
|
|
121
|
+
if (snapshot !== lastSnapshot) {
|
|
122
|
+
lastSnapshot = snapshot;
|
|
123
|
+
cache.onChange.emit('change');
|
|
124
|
+
}
|
|
103
125
|
}, JSONL_POLL_MS);
|
|
104
126
|
}
|
|
105
127
|
// --- Public API ---
|
|
@@ -107,6 +129,7 @@ export function startWatching() {
|
|
|
107
129
|
startTasksWatcher();
|
|
108
130
|
startTeamsWatcher();
|
|
109
131
|
startJsonlPoller();
|
|
132
|
+
startFullRefreshPoller();
|
|
110
133
|
// If either dir doesn't exist yet, poll for them
|
|
111
134
|
if (!tasksWatcher || !teamsWatcher) {
|
|
112
135
|
startDirCheckPoller();
|
|
@@ -125,4 +148,8 @@ export function stopWatching() {
|
|
|
125
148
|
clearInterval(dirCheckTimer);
|
|
126
149
|
dirCheckTimer = null;
|
|
127
150
|
}
|
|
151
|
+
if (fullRefreshTimer) {
|
|
152
|
+
clearInterval(fullRefreshTimer);
|
|
153
|
+
fullRefreshTimer = null;
|
|
154
|
+
}
|
|
128
155
|
}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
:root{--bg-primary: #1a1a2e;--bg-secondary: #16213e;--bg-sidebar: #0f0f1a;--bg-card: #16213e;--bg-hover: #1f2b47;--bg-active: #253350;--border-primary: #2a2a3e;--border-subtle: #222236;--text-primary: #e0e0e0;--text-secondary: #888;--text-muted: #555;--accent-blue: #58a6ff;--accent-green: #00ff88;--accent-yellow: #ffd700;--accent-red: #ff4444;--accent-purple: #bc8cff;--accent-cyan: #00d4ff;--font-mono: "JetBrains Mono", "Fira Code", Consolas, monospace;--font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;--radius-sm: 4px;--radius-md: 6px;--radius-lg: 8px;--transition-fast: .15s ease}*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}body{font-family:var(--font-mono);font-size:13px;line-height:1.5;color:var(--text-primary);background:var(--bg-primary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.app-container{display:flex;height:100vh;overflow:hidden}.sidebar{width:250px;min-width:250px;background:var(--bg-sidebar);border-right:1px solid var(--border-primary);overflow-y:auto;display:flex;flex-direction:column}.sidebar-header{padding:16px;border-bottom:1px solid var(--border-primary)}.sidebar-title{font-size:14px;font-weight:600;color:var(--text-primary);letter-spacing:.02em}.sidebar-nav{flex:1;padding:8px}.main-panel{flex:1;overflow-y:auto;padding:16px}.placeholder{display:flex;align-items:center;justify-content:center;height:100%;color:var(--text-muted);font-size:14px}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--border-primary);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}*{scrollbar-width:thin;scrollbar-color:var(--border-primary) transparent}.text-primary{color:var(--text-primary)}.text-secondary{color:var(--text-secondary)}.text-muted{color:var(--text-muted)}.text-blue{color:var(--accent-blue)}.text-green{color:var(--accent-green)}.text-yellow{color:var(--accent-yellow)}.text-red{color:var(--accent-red)}.text-purple{color:var(--accent-purple)}.text-cyan{color:var(--accent-cyan)}.bg-card{background:var(--bg-card)}.bg-hover{background:var(--bg-hover)}.rounded-sm{border-radius:var(--radius-sm)}.rounded-md{border-radius:var(--radius-md)}.rounded-lg{border-radius:var(--radius-lg)}.flex{display:flex}.flex-col{flex-direction:column}.flex-1{flex:1}.items-center{align-items:center}.justify-between{justify-content:space-between}.gap-1{gap:4px}.gap-2{gap:8px}.gap-3{gap:12px}.gap-4{gap:16px}.p-1{padding:4px}.p-2{padding:8px}.p-3{padding:12px}.p-4{padding:16px}.px-2{padding-left:8px;padding-right:8px}.px-3{padding-left:12px;padding-right:12px}.py-1{padding-top:4px;padding-bottom:4px}.py-2{padding-top:8px;padding-bottom:8px}.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.font-mono{font-family:var(--font-mono)}.font-sans{font-family:var(--font-sans)}.font-bold{font-weight:600}.text-sm{font-size:12px}.text-xs{font-size:11px}.border{border:1px solid var(--border-primary)}.border-b{border-bottom:1px solid var(--border-primary)}.cursor-pointer{cursor:pointer}.select-none{-webkit-user-select:none;user-select:none}.transition{transition:all var(--transition-fast)}.sidebar-nav-item{display:flex;align-items:center;width:100%;padding:8px 12px;border:none;background:transparent;color:var(--text-secondary);font-family:var(--font-mono);font-size:13px;cursor:pointer;border-radius:var(--radius-sm);transition:all var(--transition-fast);text-align:left}.sidebar-nav-item:hover{background:var(--bg-hover);color:var(--text-primary)}.sidebar-nav-item--active{background:var(--bg-active);color:var(--accent-cyan)}.sidebar-team{margin-bottom:2px}.sidebar-team-header{display:flex;align-items:center;gap:6px;width:100%;padding:8px 12px;border:none;background:transparent;color:var(--text-primary);font-family:var(--font-mono);font-size:13px;cursor:pointer;border-radius:var(--radius-sm);transition:all var(--transition-fast);text-align:left}.sidebar-team-header:hover{background:var(--bg-hover)}.sidebar-team-arrow{font-size:10px;color:var(--text-muted);width:12px}.sidebar-footer{padding:12px 16px;border-top:1px solid var(--border-primary)}.sidebar-stats{display:flex;gap:12px}.agent-item{display:flex;align-items:center;gap:6px;width:100%;padding:6px 12px 6px 28px;border:none;background:transparent;color:var(--text-secondary);font-family:var(--font-mono);font-size:12px;cursor:pointer;border-radius:var(--radius-sm);transition:all var(--transition-fast);text-align:left}.agent-item:hover{background:var(--bg-hover);color:var(--text-primary)}.agent-item--selected{background:var(--bg-active);color:var(--accent-cyan)}.agent-item__dot{font-size:8px;flex-shrink:0}.agent-item__name{flex:1;min-width:0}.agent-item__type{flex-shrink:0}.panel-title{font-size:16px;font-weight:600;color:var(--text-primary);margin-bottom:16px}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;gap:12px;text-align:center}.empty-state__icon{font-size:48px}.empty-state__title{font-size:16px;font-weight:600;color:var(--text-secondary)}.empty-state__text{max-width:400px;line-height:1.6}.overview-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:12px}.overview-card{background:var(--bg-card);border:1px solid var(--border-primary);border-left:3px solid var(--text-muted);border-radius:var(--radius-md);padding:16px;transition:all var(--transition-fast)}.overview-card:hover{border-color:var(--accent-cyan);border-left-color:inherit;background:var(--bg-hover)}.overview-card--active{border-left-color:var(--accent-green)}.overview-card--idle{border-left-color:var(--accent-yellow)}.overview-card--done{border-left-color:var(--accent-cyan)}.overview-card--inactive{border-left-color:var(--text-muted)}.overview-card__header{display:flex;justify-content:space-between;align-items:center;margin-bottom:4px}.overview-card__meta{margin-bottom:12px}.overview-card__progress{display:flex;align-items:center;gap:8px;margin-bottom:8px}.progress-bar{flex:1;height:4px;background:var(--border-primary);border-radius:2px;overflow:hidden}.progress-bar__fill{height:100%;background:var(--accent-green);border-radius:2px;transition:width .3s ease}.overview-card__footer{text-align:right}.pulse-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--accent-green);animation:pulse 2s ease-in-out infinite;flex-shrink:0}@keyframes pulse{0%,to{opacity:1;box-shadow:0 0 #0f86}50%{opacity:.7;box-shadow:0 0 0 6px #0f80}}.task-board__columns{display:flex;gap:12px}.task-board__column{flex:1;min-width:0}.task-board__column-header{display:flex;justify-content:space-between;align-items:center;padding:8px 12px;margin-bottom:8px;border-bottom:2px solid var(--border-primary);font-weight:600;font-size:12px;color:var(--text-secondary)}.task-card{background:var(--bg-card);border:1px solid var(--border-primary);border-radius:var(--radius-md);padding:12px;margin-bottom:8px;border-left:3px solid var(--text-muted)}.task-card--in-progress{border-left-color:var(--accent-yellow)}.task-card--completed{border-left-color:var(--accent-green)}.task-card--pending{border-left-color:var(--text-muted)}.task-card__subject{font-size:12px;margin-bottom:4px;color:var(--text-primary)}.task-card__desc{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin-bottom:8px;line-height:1.4}.task-card__meta{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.task-card__owner{display:inline-block;padding:2px 6px;background:#00d4ff26;color:var(--accent-cyan);border-radius:var(--radius-sm);font-size:11px}.task-card__blocked{color:var(--accent-yellow)}.agent-panel{display:flex;flex-direction:column;height:100%}.agent-panel__header{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:12px;padding-bottom:12px;border-bottom:1px solid var(--border-primary)}.agent-panel__header .panel-title{margin-bottom:0}.status-badge{display:inline-block;padding:2px 8px;border-radius:10px;font-size:11px;font-weight:600}.status-badge--active{background:#00ff8826;color:var(--accent-green)}.status-badge--idle{background:#ffd70026;color:var(--accent-yellow)}.status-badge--done{background:#00d4ff26;color:var(--accent-cyan)}.status-badge--unknown{background:#5555554d;color:var(--text-muted)}.agent-panel__tasks{padding:8px 12px;margin-bottom:12px;background:var(--bg-card);border-radius:var(--radius-md);border:1px solid var(--border-primary)}.agent-panel__task-item{display:flex;align-items:center;gap:8px;padding:4px 0;font-size:12px}.task-status-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}.task-status-dot--pending{background:var(--text-muted)}.task-status-dot--in_progress{background:var(--accent-yellow)}.task-status-dot--completed{background:var(--accent-green)}.agent-panel__feed{flex:1;overflow-y:auto;padding:4px}.activity-entry{padding:8px 12px;margin-bottom:4px;border-radius:var(--radius-sm);font-size:12px}.activity-entry--user{border-left:3px solid var(--accent-green);background:#00ff880d}.activity-entry--assistant{color:var(--accent-cyan)}.activity-entry--tool-use{background:#ffd7000d}.activity-entry--tool-result{color:var(--text-muted)}.activity-entry__header{display:flex;justify-content:space-between;align-items:center;margin-bottom:4px}.activity-entry__role{color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em}.activity-entry__body{word-break:break-word}.activity-entry__code{background:var(--bg-secondary);padding:8px;border-radius:var(--radius-sm);overflow-x:auto;font-size:11px;white-space:pre-wrap;margin-top:4px}.activity-entry__tool-use{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}.activity-entry__tool-badge{display:inline-block;padding:2px 6px;background:#ffd70026;color:var(--accent-yellow);border-radius:var(--radius-sm);font-size:11px;white-space:nowrap}.activity-entry__tool-input{font-size:11px;word-break:break-all}.activity-entry__tool-result{font-size:11px;line-height:1.4}
|