agent-control-plane 0.7.1 → 0.8.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.
Files changed (18) hide show
  1. package/README.md +305 -7
  2. package/hooks/pr-reconcile-hooks.sh +12 -1
  3. package/package.json +9 -7
  4. package/tools/bin/flow-runtime-doctor.sh +67 -0
  5. package/tools/bin/heartbeat-safe-auto.sh +161 -0
  6. package/tools/bin/render-flow-config.sh +98 -0
  7. package/tools/bin/sync-shared-agent-home.sh +23 -0
  8. package/tools/dashboard/__pycache__/server.cpython-311.pyc +0 -0
  9. package/tools/dashboard/app-v2.js +1120 -0
  10. package/tools/dashboard/app.js +129 -38
  11. package/tools/dashboard/index-inline.html +1533 -0
  12. package/tools/dashboard/index-v2.html +45 -0
  13. package/tools/dashboard/server.py +64 -15
  14. package/tools/dashboard/styles.css +595 -521
  15. package/tools/bin/profile-activate.sh +0 -109
  16. package/tools/bin/profile-adopt.sh +0 -225
  17. package/tools/bin/profile-smoke.sh +0 -461
  18. package/tools/bin/test-smoke.sh +0 -119
package/tools/dashboard/styles.css CHANGED
@@ -1,542 +1,616 @@
1
- 1| 1|:root {
2
- 2| 2| --bg: #f4f3ee;
3
- 3| 3| --panel: #fffdf7;
4
- 4| 4| --panel-strong: #f8f4e6;
5
- 5| 5| --ink: #192126;
6
- 6| 6| --muted: #5a6872;
7
- 7| 7| --line: #d7d0c0;
8
- 8| 8| --accent: #0f766e;
9
- 9| 9| --accent-soft: #d8f1ec;
10
- 10| 10| --warn: #a16207;
11
- 11| 11| --warn-soft: #fce7b2;
12
- 12| 12| --danger: #b42318;
13
- 13| 13| --danger-soft: #fdd8d2;
14
- 14| 14| --shadow: 0 18px 50px rgba(25, 33, 38, 0.08);
15
- 15| 15| --button-bg: var(--ink);
16
- 16| 16| --button-ink: #ffffff;
17
- 17| 17| --button-hover: #0f1720;
18
- 18| 18| --hero-bg: rgba(255, 253, 247, 0.92);
19
- 19| 19| --profile-bg: rgba(255, 253, 247, 0.94);
20
- 20| 20| --body-gradient-top: rgba(15, 118, 110, 0.08);
21
- 21| 21| --body-gradient-bottom: #faf7ef;
22
- 22| 22| --theme-toggle-bg: var(--panel);
23
- 23| 23| --theme-toggle-ink: var(--ink);
24
- 24| 24| --theme-toggle-line: var(--line);
25
- 25| 25| --theme-toggle-hover: var(--panel-strong);
26
- 26| 26| --reported-soft: #dbeafe;
27
- 27| 27| --reported-ink: #1d4ed8;
28
- 28| 28| --implemented-soft: #dcfce7;
29
- 29| 29| --implemented-ink: #166534;
30
- 30| 30| --blocked-soft: #fef3c7;
31
- 31| 31| --blocked-ink: #92400e;
32
- 32| 32|}
33
- 33| 33|
34
- 34| 34|:root[data-theme="dark"] {
35
- 35| 35| --bg: #0d1418;
36
- 36| 36| --panel: #142026;
37
- 37| 37| --panel-strong: #1a2a31;
38
- 38| 38| --ink: #ebf1f3;
39
- 39| 39| --muted: #9ab0bb;
40
- 40| 40| --line: #2a3c44;
41
- 41| 41| --accent: #5ad4c7;
42
- 42| 42| --accent-soft: #183d3a;
43
- 43| 43| --warn: #f4c35f;
44
- 44| 44| --warn-soft: #4d3a12;
45
- 45| 45| --danger: #ff8a80;
46
- 46| 46| --danger-soft: #4a2220;
47
- 47| 47| --shadow: 0 24px 60px rgba(0, 0, 0, 0.32);
48
- 48| 48| --button-bg: #ebf1f3;
49
- 49| 49| --button-ink: #0d1418;
50
- 50| 50| --button-hover: #d7e2e6;
51
- 51| 51| --hero-bg: rgba(20, 32, 38, 0.92);
52
- 52| 52| --profile-bg: rgba(20, 32, 38, 0.94);
53
- 53| 53| --body-gradient-top: rgba(90, 212, 199, 0.12);
54
- 54| 54| --body-gradient-bottom: #10181d;
55
- 55| 55| --theme-toggle-bg: #1d2d35;
56
- 56| 56| --theme-toggle-ink: #ebf1f3;
57
- 57| 57| --theme-toggle-line: #35505b;
58
- 58| 58| --theme-toggle-hover: #23363f;
59
- 59| 59| --reported-soft: #1b3552;
60
- 60| 60| --reported-ink: #9fc8ff;
61
- 61| 61| --implemented-soft: #173a2b;
62
- 62| 62| --implemented-ink: #85ddb1;
63
- 63| 63| --blocked-soft: #4a3711;
64
- 64| 64| --blocked-ink: #f4c35f;
65
- 65| 65|}
66
- 66| 66|
67
- 67| 67|* {
68
- 68| 68| box-sizing: border-box;
69
- 69| 69|}
70
- 70| 70|
71
- 71| 71|body {
72
- 72| 72| margin: 0;
73
- 73| 73| font-family: "Iowan Old Style", "Palatino Linotype", "Book Antiqua", serif;
74
- 74| 74| background:
75
- 75| 75| radial-gradient(circle at top right, var(--body-gradient-top), transparent 34%),
76
- 76| 76| linear-gradient(180deg, var(--body-gradient-bottom) 0%, var(--bg) 100%);
77
- 77| 77| color: var(--ink);
78
- 78| 78|}
79
- 79| 79|
80
- 80| 80|.page {
81
- 81| 81| max-width: 1440px;
82
- 82| 82| margin: 0 auto;
83
- 83| 83| padding: 32px 20px 48px;
84
- 84| 84|}
85
- 85| 85|
86
- 86| 86|.hero {
87
- 87| 87| display: flex;
88
- 88| 88| justify-content: space-between;
89
- 89| 89| gap: 24px;
90
- 90| 90| align-items: flex-start;
91
- 91| 91| padding: 24px;
92
- 92| 92| border: 1px solid var(--line);
93
- 93| 93| border-radius: 28px;
94
- 94| 94| background: var(--hero-bg);
95
- 95| 95| box-shadow: var(--shadow);
96
- 96| 96|}
97
- 97| 97|
98
- 98| 98|.eyebrow {
99
- 99| 99| margin: 0 0 8px;
100
- 100| 100| text-transform: uppercase;
101
- 101| 101| letter-spacing: 0.08em;
102
- 102| 102| font-size: 12px;
103
- 103| 103| color: var(--accent);
104
- 104| 104|}
105
- 105| 105|
106
- 106| 106|.hero h1 {
107
- 107| 107| margin: 0;
108
- 108| 108| font-size: clamp(34px, 5vw, 56px);
109
- 109| 109| line-height: 0.95;
110
- 110| 110|}
111
- 111| 111|
112
- 112| 112|.subtitle {
113
- 113| 113| max-width: 760px;
114
- 114| 114| margin: 16px 0 0;
115
- 115| 115| color: var(--muted);
116
- 116| 116| font-size: 18px;
117
- 117| 117| line-height: 1.45;
118
- 118| 118|}
119
- 119| 119|
120
- 120| 120|.hero-actions {
121
- 121| 121| min-width: 220px;
122
- 122| 122| display: flex;
123
- 123| 123| flex-direction: column;
124
- 124| 124| gap: 14px;
125
- 125| 125| align-items: flex-end;
126
- 126| 126|}
127
- 127| 127|
128
- 128| 128|.hero-controls {
129
- 129| 129| display: flex;
130
- 130| 130| gap: 10px;
131
- 131| 131| align-items: center;
132
- 132| 132| flex-wrap: wrap;
133
- 133| 133| justify-content: flex-end;
134
- 134| 134|}
135
- 135| 135|
136
- 136| 136|button {
137
- 137| 137| appearance: none;
138
- 138| 138| border: 0;
139
- 139| 139| border-radius: 999px;
140
- 140| 140| padding: 12px 18px;
141
- 141| 141| font: inherit;
142
- 142| 142| background: var(--button-bg);
143
- 143| 143| color: var(--button-ink);
144
- 144| 144| cursor: pointer;
145
- 145| 145| transition: background 140ms ease, color 140ms ease, border-color 140ms ease, transform 140ms ease;
146
- 146| 146|}
147
- 147| 147|
148
- 148| 148|button:hover {
149
- 149| 149| background: var(--button-hover);
150
- 150| 150|}
151
- 151| 151|
152
- 152| 152|button:active {
153
- 153| 153| transform: translateY(1px);
154
- 154| 154|}
155
- 155| 155|
156
- 156| 156|#theme-toggle {
157
- 157| 157| background: var(--theme-toggle-bg);
158
- 158| 158| color: var(--theme-toggle-ink);
159
- 159| 159| border: 1px solid var(--theme-toggle-line);
160
- 160| 160|}
161
- 161| 161|
162
- 162| 162|#theme-toggle:hover {
163
- 163| 163| background: var(--theme-toggle-hover);
164
- 164| 164|}
165
- 165| 165|
166
- 166| 166|.meta {
167
- 167| 167| text-align: right;
168
- 168| 168| color: var(--muted);
169
- 169| 169| font-size: 14px;
170
- 170| 170|}
171
- 171| 171|
172
- 172| 172|.overview {
173
- 173| 173| margin-top: 24px;
174
- 174| 174| display: grid;
175
- 175| 175| grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
176
- 176| 176| gap: 14px;
177
- 177| 177|}
178
- 178| 178|
179
- 179| 179|.card {
180
- 180| 180| padding: 18px;
181
- 181| 181| border-radius: 22px;
182
- 182| 182| border: 1px solid var(--line);
183
- 183| 183| background: var(--panel);
184
- 184| 184| box-shadow: var(--shadow);
185
- 185| 185|}
186
- 186| 186|
187
- 187| 187|.stat-label {
188
- 188| 188| color: var(--muted);
189
- 189| 189| font-size: 13px;
190
- 190| 190| text-transform: uppercase;
191
- 191| 191| letter-spacing: 0.06em;
192
- 192| 192|}
193
- 193| 193|
194
- 194| 194|.stat-value {
195
- 195| 195| margin-top: 8px;
196
- 196| 196| font-size: 34px;
197
- 197| 197| font-weight: 700;
198
- 198| 198|}
199
- 199| 199|
200
- 200| 200|.profiles {
201
- 201| 201| margin-top: 28px;
202
- 202| 202| display: flex;
203
- 203| 203| flex-direction: column;
204
- 204| 204| gap: 22px;
205
- 205| 205|}
206
- 206| 206|
207
- 207| 207|.profile {
208
- 208| 208| padding: 22px;
209
- 209| 209| border-radius: 28px;
210
- 210| 210| border: 1px solid var(--line);
211
- 211| 211| background: var(--profile-bg);
212
- 212| 212| box-shadow: var(--shadow);
213
- 213| 213|}
214
- 214| 214|
215
- 215| 215|.profile-header {
216
- 216| 216| display: flex;
217
- 217| 217| justify-content: space-between;
218
- 218| 218| gap: 16px;
219
- 219| 219| align-items: flex-start;
220
- 220| 220|}
221
- 221| 221|
222
- 222| 222|.profile-title {
223
- 223| 223| display: flex;
224
- 224| 224| flex-wrap: wrap;
225
- 225| 225| gap: 10px;
226
- 226| 226| align-items: center;
227
- 227| 227|}
228
- 228| 228|
229
- 229| 229|.profile-title h2 {
230
- 230| 230| margin: 0;
231
- 231| 231| font-size: 28px;
232
- 232| 232|}
233
- 233| 233|
234
- 234| 234|.profile-subtitle {
235
- 235| 235| margin-top: 8px;
236
- 236| 236| color: var(--muted);
237
- 237| 237|}
238
- 238| 238|
239
- 239| 239|.badge-row {
240
- 240| 240| display: flex;
241
- 241| 241| flex-wrap: wrap;
242
- 242| 242| gap: 8px;
243
- 243| 243| justify-content: flex-end;
244
- 244| 244|}
245
- 245| 245|
246
- 246| 246|.badge {
247
- 247| 247| display: inline-flex;
248
- 248| 248| align-items: center;
249
- 249| 249| gap: 6px;
250
- 250| 250| padding: 7px 10px;
251
- 251| 251| border-radius: 999px;
252
- 252| 252| font-size: 13px;
253
- 253| 253| border: 1px solid transparent;
254
- 254| 254| background: var(--panel-strong);
255
- 255| 255|}
256
- 256| 256|
257
- 257| 257|.badge.good {
258
- 258| 258| background: var(--accent-soft);
259
- 259| 259| color: var(--accent);
260
- 260| 260|}
261
- 261| 261|
262
- 262| 262|.badge.warn {
263
- 263| 263| background: var(--warn-soft);
264
- 264| 264| color: var(--warn);
265
- 265| 265|}
266
- 266| 266|
267
- 267| 267|.badge.danger {
268
- 268| 268| background: var(--danger-soft);
269
- 269| 269| color: var(--danger);
270
- 270| 270|}
271
- 271| 271|
272
- 272| 272|.profile-grid {
273
- 273| 273| margin-top: 18px;
274
- 274| 274| display: grid;
275
- 275| 275| grid-template-columns: repeat(12, minmax(0, 1fr));
276
- 276| 276| gap: 14px;
277
- 277| 277|}
278
- 278| 278|
279
- 279| 279|.panel {
280
- 280| 280| grid-column: span 12;
281
- 281| 281| padding: 16px;
282
- 282| 282| border-radius: 22px;
283
- 283| 283| border: 1px solid var(--line);
284
- 284| 284| background: var(--panel);
285
- 285| 285|}
286
- 286| 286|
287
- 287| 287|.panel.half {
288
- 288| 288| grid-column: span 6;
289
- 289| 289|}
290
- 290| 290|
291
- 291| 291|.panel.third {
292
- 292| 292| grid-column: span 4;
293
- 293| 293|}
294
- 294| 294|
295
- 295| 295|.panel h3 {
296
- 296| 296| margin: 0 0 12px;
297
- 297| 297| font-size: 18px;
298
- 298| 298|}
299
- 299| 299|
300
- 300| 300|.panel-subtitle {
301
- 301| 301| margin: -6px 0 12px;
302
- 302| 302| color: var(--muted);
303
- 303| 303| font-size: 14px;
304
- 304| 304|}
305
- 305| 305|
306
- 306| 306|.alert-list {
307
- 307| 307| display: grid;
308
- 308| 308| gap: 12px;
309
- 309| 309|}
310
- 310| 310|
311
- 311| 311|.alert-card {
312
- 312| 312| padding: 14px 16px;
313
- 313| 313| border-radius: 18px;
314
- 314| 314| border: 1px solid var(--line);
315
- 315| 315| background: var(--panel-strong);
316
- 316| 316|}
317
- 317| 317|
318
- 318| 318|.alert-card.warn {
319
- 319| 319| border-color: color-mix(in srgb, var(--warn) 45%, var(--line));
320
- 320| 320| background: color-mix(in srgb, var(--warn-soft) 82%, var(--panel) 18%);
321
- 321| 321|}
322
- 322| 322|
323
- 323| 323|.alert-card h4 {
324
- 324| 324| margin: 0;
325
- 325| 325| font-size: 17px;
326
- 326| 326|}
327
- 327| 327|
328
- 328| 328|.alert-card p {
329
- 329| 329| margin: 10px 0 0;
330
- 330| 330| line-height: 1.5;
331
- 331| 331|}
332
- 332| 332|
333
- 333| 333|.alert-header {
334
- 334| 334| display: flex;
335
- 335| 335| gap: 12px;
336
- 336| 336| justify-content: space-between;
337
- 337| 337| align-items: flex-start;
338
- 338| 338|}
339
- 339| 339|
340
- 340| 340|.alert-meta {
341
- 341| 341| margin-top: 10px;
342
- 342| 342| display: flex;
343
- 343| 343| flex-wrap: wrap;
344
- 344| 344| gap: 12px;
345
- 345| 345| color: var(--muted);
346
- 346| 346| font-size: 13px;
347
- 347| 347|}
348
- 348| 348|
349
- 349| 349|.table-wrap {
350
- 350| 350| overflow-x: auto;
351
- 351| 351|}
352
- 352| 352|
353
- 353| 353|table {
354
- 354| 354| width: 100%;
355
- 355| 355| border-collapse: collapse;
356
- 356| 356| font-size: 14px;
357
- 357| 357|}
358
- 358| 358|
359
- 359| 359|th,
360
- 360| 360|td {
361
- 361| 361| padding: 10px 8px;
362
- 362| 362| text-align: left;
363
- 363| 363| vertical-align: top;
364
- 364| 364| border-top: 1px solid var(--line);
365
- 365| 365|}
366
- 366| 366|
367
- 367| 367|th {
368
- 368| 368| color: var(--muted);
369
- 369| 369| font-size: 12px;
370
- 370| 370| text-transform: uppercase;
371
- 371| 371| letter-spacing: 0.06em;
372
- 372| 372| border-top: 0;
373
- 373| 373|}
374
- 374| 374|
375
- 375| 375|.mono {
376
- 376| 376| font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
377
- 377| 377| font-size: 12px;
378
- 378| 378|}
379
- 379| 379|
380
- 380| 380|.muted {
381
- 381| 381| color: var(--muted);
382
- 382| 382|}
383
- 383| 383|
384
- 384| 384|.status-pill {
385
- 385| 385| display: inline-flex;
386
- 386| 386| align-items: center;
387
- 387| 387| padding: 4px 8px;
388
- 388| 388| border-radius: 999px;
389
- 389| 389| font-size: 12px;
390
- 390| 390| font-weight: 700;
391
- 391| 391| background: var(--panel-strong);
392
- 392| 392|}
393
- 393| 393|
394
- 394| 394|.status-pill.RUNNING,
395
- 395| 395|.status-pill.waiting-worker,
396
- 396| 396|.status-pill.launching,
397
- 397| 397|.status-pill.reconciling {
398
- 398| 398| background: var(--accent-soft);
399
- 399| 399| color: var(--accent);
400
- 400| 400|}
401
- 401| 401|
402
- 402| 402|.status-pill.waiting-provider,
403
- 403| 403|.status-pill.waiting-due,
404
- 404| 404|.status-pill.waiting-open-pr,
405
- 405| 405|.status-pill.idle,
406
- 406| 406|.status-pill.sleeping {
407
- 407| 407| background: var(--warn-soft);
408
- 408| 408| color: var(--warn);
409
- 409| 409|}
410
- 410| 410|
411
- 411| 411|.status-pill.FAILED,
412
- 412| 412|.status-pill.stopped,
413
- 413| 413|.status-pill.launch-failed {
414
- 414| 414| background: var(--danger-soft);
415
- 415| 415| color: var(--danger);
416
- 416| 416|}
417
- 417| 417|
418
- 418| 418|.status-pill.implemented {
419
- 419| 419| background: var(--implemented-soft);
420
- 420| 420| color: var(--implemented-ink);
421
- 421| 421|}
422
- 422| 422|
423
- 423| 423|.status-pill.reported,
424
- 424| 424|.status-pill.completed {
425
- 425| 425| background: var(--reported-soft);
426
- 426| 426| color: var(--reported-ink);
427
- 427| 427|}
428
- 428| 428|
429
- 429| 429|.status-pill.blocked {
430
- 430| 430| background: var(--blocked-soft);
431
- 431| 431| color: var(--blocked-ink);
432
- 432| 432|}
433
- 433| 433|
434
- 434| 434|.status-pill.failed,
435
- 435| 435|.status-pill.unknown {
436
- 436| 436| background: var(--danger-soft);
437
- 437| 437| color: var(--danger);
438
- 438| 438|}
439
- 439| 439|
440
- 440| 440|.status-pill.running {
441
- 441| 441| background: var(--accent-soft);
442
- 442| 442| color: var(--accent);
443
- 443| 443|}
444
- 444| 444|
445
- 445| 445|.empty-state {
446
- 446| 446| color: var(--muted);
447
- 447| 447| padding: 10px 4px;
448
- 448| 448|}
449
- 449| 449|
450
- 450| 450|@media (max-width: 960px) {
451
- 451| 451| .hero,
452
- 452| 452| .profile-header {
453
- 453| 453| flex-direction: column;
454
- 454| 454| }
455
- 455| 455|
456
- 456| 456| .hero-actions,
457
- 457| 457| .badge-row {
458
- 458| 458| align-items: flex-start;
459
- 459| 459| justify-content: flex-start;
460
- 460| 460| text-align: left;
461
- 461| 461| }
462
- 462| 462|
463
- 463| 463| .hero-controls {
464
- 464| 464| justify-content: flex-start;
465
- 465| 465| }
466
- 466| 466|
467
- 467| 467| .panel.half,
468
- 468| 468| .panel.third {
469
- 469| 469| grid-column: span 12;
470
- 470| 470| }
471
- 471| 471|}
472
- 472| 472|
473
- 473|
474
- 474|/* Filter bar */
475
- 475|.filter-bar {
476
- 476| display: flex;
477
- 477| gap: 8px;
478
- 478| margin-bottom: 12px;
479
- 479| flex-wrap: wrap;
480
- 480| align-items: center;
481
- 481|}
482
- 482|
483
- 483|.filter-search {
484
- 484| flex: 1;
485
- 485| min-width: 200px;
486
- 486| padding: 6px 10px;
487
- 487| border: 1px solid var(--line);
488
- 488| border-radius: 6px;
489
- 489| background: var(--panel);
490
- 490| color: var(--ink);
491
- 491| font-size: 13px;
492
- 492|}
493
- 493|
494
- 494|.filter-search:focus {
495
- 495| outline: none;
496
- 496| border-color: var(--accent);
497
- 497| box-shadow: 0 0 0 2px var(--accent-soft);
498
- 498|}
499
- 499|
500
- 500|.filter-btn {
501
- 501|
502
-
503
- /* Action bar */
504
- .action-bar {
1
+ :root {
2
+ --bg: #f5f5f7;
3
+ --panel: #ffffff;
4
+ --panel-strong: #f8f8fa;
5
+ --ink: #1a1a2e;
6
+ --muted: #6b7280;
7
+ --line: #e5e7eb;
8
+ --accent: #0ea5e9;
9
+ --accent-soft: #e0f2fe;
10
+ --warn: #f59e0b;
11
+ --warn-soft: #fef3c7;
12
+ --danger: #ef4444;
13
+ --danger-soft: #fee2e2;
14
+ --shadow: 0 1px 3px rgba(0,0,0,0.08);
15
+ --button-bg: var(--ink);
16
+ --button-ink: #ffffff;
17
+ --button-hover: #2d2d44;
18
+ --hero-bg: rgba(255,255,255,0.95);
19
+ --profile-bg: rgba(255,255,255,0.97);
20
+ --body-gradient-top: transparent;
21
+ --body-gradient-bottom: #f5f5f7;
22
+ --theme-toggle-bg: var(--panel);
23
+ --theme-toggle-ink: var(--ink);
24
+ --theme-toggle-line: var(--line);
25
+ --theme-toggle-hover: var(--panel-strong);
26
+ --reported-soft: #dbeafe;
27
+ --reported-ink: #2563eb;
28
+ --implemented-soft: #dcfce7;
29
+ --implemented-ink: #16a34a;
30
+ --blocked-soft: #fef3c7;
31
+ --blocked-ink: #d97706;
32
+ }
33
+
34
+ :root[data-theme="dark"] {
35
+ --bg: #0f0f1a;
36
+ --panel: #1a1a2e;
37
+ --panel-strong: #23233a;
38
+ --ink: #e5e7eb;
39
+ --muted: #9ca3af;
40
+ --line: #2d2d44;
41
+ --accent: #38bdf8;
42
+ --accent-soft: #0c2a3d;
43
+ --warn: #fbbf24;
44
+ --warn-soft: #2d2410;
45
+ --danger: #f87171;
46
+ --danger-soft: #2d1a1a;
47
+ --shadow: 0 1px 3px rgba(0,0,0,0.3);
48
+ --button-bg: #e5e7eb;
49
+ --button-ink: #0f0f1a;
50
+ --button-hover: #d1d5db;
51
+ --hero-bg: rgba(26,26,46,0.95);
52
+ --profile-bg: rgba(26,26,46,0.97);
53
+ --body-gradient-top: transparent;
54
+ --body-gradient-bottom: #0a0a14;
55
+ --theme-toggle-bg: #23233a;
56
+ --theme-toggle-ink: #e5e7eb;
57
+ --theme-toggle-line: #2d2d44;
58
+ --theme-toggle-hover: #2d2d44;
59
+ --reported-soft: #1e3a5f;
60
+ --reported-ink: #60a5fa;
61
+ --implemented-soft: #1a3a2a;
62
+ --implemented-ink: #4ade80;
63
+ --blocked-soft: #2d2410;
64
+ --blocked-ink: #fbbf24;
65
+ }
66
+
67
+ * {
68
+ box-sizing: border-box;
69
+ margin: 0;
70
+ padding: 0;
71
+ }
72
+
73
+ body {
74
+ margin: 0;
75
+ font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif;
76
+ background: var(--bg);
77
+ color: var(--ink);
78
+ font-size: 14px;
79
+ line-height: 1.5;
80
+ }
81
+
82
+ .page {
83
+ max-width: 1440px;
84
+ margin: 0 auto;
85
+ padding: 16px 16px 32px;
86
+ }
87
+
88
+ .hero {
89
+ display: flex;
90
+ justify-content: space-between;
91
+ gap: 16px;
92
+ align-items: flex-start;
93
+ padding: 16px;
94
+ border: 1px solid var(--line);
95
+ border-radius: 12px;
96
+ background: var(--hero-bg);
97
+ box-shadow: var(--shadow);
98
+ margin-bottom: 16px;
99
+ }
100
+
101
+ .eyebrow {
102
+ margin: 0 0 4px;
103
+ text-transform: uppercase;
104
+ letter-spacing: 0.08em;
105
+ font-size: 11px;
106
+ color: var(--accent);
107
+ font-weight: 600;
108
+ }
109
+
110
+ .hero h1 {
111
+ margin: 0;
112
+ font-size: 24px;
113
+ font-weight: 700;
114
+ line-height: 1.2;
115
+ }
116
+
117
+ .subtitle {
118
+ max-width: 760px;
119
+ margin: 8px 0 0;
120
+ color: var(--muted);
121
+ font-size: 13px;
122
+ line-height: 1.4;
123
+ }
124
+
125
+ .hero-actions {
126
+ min-width: 200px;
127
+ display: flex;
128
+ flex-direction: column;
129
+ gap: 8px;
130
+ align-items: flex-end;
131
+ }
132
+
133
+ .hero-controls {
505
134
  display: flex;
506
135
  gap: 8px;
507
136
  align-items: center;
508
- margin-bottom: 12px;
137
+ flex-wrap: wrap;
138
+ justify-content: flex-end;
509
139
  }
510
140
 
511
- .action-btn {
512
- padding: 6px 16px;
513
- border: 1px solid var(--accent);
141
+ button {
142
+ appearance: none;
143
+ border: 0;
514
144
  border-radius: 6px;
515
- background: var(--accent);
516
- color: #fff;
145
+ padding: 6px 12px;
146
+ font: inherit;
517
147
  font-size: 13px;
148
+ background: var(--button-bg);
149
+ color: var(--button-ink);
518
150
  cursor: pointer;
519
- transition: all 0.15s ease;
151
+ transition: background 140ms ease;
520
152
  }
521
153
 
522
- .action-btn:hover {
154
+ button:hover {
523
155
  background: var(--button-hover);
524
- border-color: var(--button-hover);
525
156
  }
526
157
 
527
- .action-btn:active {
528
- transform: scale(0.98);
158
+ button:active {
159
+ transform: translateY(1px);
160
+ }
161
+
162
+ #theme-toggle {
163
+ background: var(--theme-toggle-bg);
164
+ color: var(--theme-toggle-ink);
165
+ border: 1px solid var(--theme-toggle-line);
166
+ }
167
+
168
+ #theme-toggle:hover {
169
+ background: var(--theme-toggle-hover);
170
+ }
171
+
172
+ .meta {
173
+ text-align: right;
174
+ color: var(--muted);
175
+ font-size: 12px;
176
+ }
177
+
178
+ .overview {
179
+ margin-top: 16px;
180
+ display: grid;
181
+ grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
182
+ gap: 8px;
183
+ }
184
+
185
+ .card {
186
+ padding: 10px 12px;
187
+ border-radius: 8px;
188
+ border: 1px solid var(--line);
189
+ background: var(--panel);
190
+ box-shadow: var(--shadow);
191
+ }
192
+
193
+ .stat-label {
194
+ color: var(--muted);
195
+ font-size: 11px;
196
+ text-transform: uppercase;
197
+ letter-spacing: 0.05em;
198
+ font-weight: 500;
199
+ }
200
+
201
+ .stat-value {
202
+ margin-top: 4px;
203
+ font-size: 24px;
204
+ font-weight: 700;
205
+ line-height: 1.2;
206
+ }
207
+
208
+ .profiles {
209
+ margin-top: 16px;
210
+ display: flex;
211
+ flex-direction: column;
212
+ gap: 16px;
213
+ }
214
+
215
+ .profile {
216
+ padding: 16px;
217
+ border-radius: 12px;
218
+ border: 1px solid var(--line);
219
+ background: var(--profile-bg);
220
+ box-shadow: var(--shadow);
221
+ }
222
+
223
+ .profile-header {
224
+ display: flex;
225
+ justify-content: space-between;
226
+ gap: 12px;
227
+ align-items: flex-start;
228
+ margin-bottom: 12px;
229
+ }
230
+
231
+ .profile-title {
232
+ display: flex;
233
+ flex-wrap: wrap;
234
+ gap: 8px;
235
+ align-items: center;
236
+ }
237
+
238
+ .profile-title h2 {
239
+ margin: 0;
240
+ font-size: 18px;
241
+ font-weight: 700;
242
+ }
243
+
244
+ .profile-subtitle {
245
+ margin-top: 4px;
246
+ color: var(--muted);
247
+ font-size: 12px;
248
+ }
249
+
250
+ .badge-row {
251
+ display: flex;
252
+ flex-wrap: wrap;
253
+ gap: 6px;
254
+ justify-content: flex-end;
255
+ }
256
+
257
+ .badge {
258
+ display: inline-flex;
259
+ align-items: center;
260
+ gap: 4px;
261
+ padding: 3px 8px;
262
+ border-radius: 4px;
263
+ font-size: 12px;
264
+ background: var(--panel-strong);
265
+ border: 1px solid var(--line);
266
+ }
267
+
268
+ .badge.good {
269
+ background: var(--accent-soft);
270
+ color: var(--accent);
271
+ border-color: transparent;
272
+ }
273
+
274
+ .badge.warn {
275
+ background: var(--warn-soft);
276
+ color: var(--warn);
277
+ border-color: transparent;
278
+ }
279
+
280
+ .badge.danger {
281
+ background: var(--danger-soft);
282
+ color: var(--danger);
283
+ border-color: transparent;
529
284
  }
530
285
 
531
- .doctor-output {
286
+ .profile-grid {
532
287
  margin-top: 12px;
533
- padding: 12px;
288
+ display: grid;
289
+ grid-template-columns: repeat(12, 1fr);
290
+ gap: 8px;
291
+ }
292
+
293
+ .panel {
294
+ grid-column: span 12;
295
+ padding: 10px 12px;
296
+ border-radius: 8px;
297
+ border: 1px solid var(--line);
298
+ background: var(--panel);
299
+ }
300
+
301
+ .panel.half {
302
+ grid-column: span 6;
303
+ }
304
+
305
+ .panel.third {
306
+ grid-column: span 4;
307
+ }
308
+
309
+ .panel h3 {
310
+ margin: 0 0 8px;
311
+ font-size: 14px;
312
+ font-weight: 600;
313
+ }
314
+
315
+ .panel-subtitle {
316
+ margin: -4px 0 8px;
317
+ color: var(--muted);
318
+ font-size: 12px;
319
+ }
320
+
321
+ .alert-list {
322
+ display: grid;
323
+ gap: 8px;
324
+ }
325
+
326
+ .alert-card {
327
+ padding: 10px 12px;
328
+ border-radius: 8px;
534
329
  border: 1px solid var(--line);
535
- border-radius: 6px;
536
330
  background: var(--panel-strong);
331
+ }
332
+
333
+ .alert-card.warn {
334
+ border-color: var(--warn);
335
+ background: var(--warn-soft);
336
+ }
337
+
338
+ .alert-card h4 {
339
+ margin: 0;
340
+ font-size: 14px;
341
+ font-weight: 600;
342
+ }
343
+
344
+ .alert-card p {
345
+ margin: 6px 0 0;
346
+ font-size: 13px;
347
+ line-height: 1.4;
348
+ }
349
+
350
+ .alert-header {
351
+ display: flex;
352
+ gap: 8px;
353
+ justify-content: space-between;
354
+ align-items: flex-start;
355
+ }
356
+
357
+ .alert-meta {
358
+ margin-top: 6px;
359
+ display: flex;
360
+ flex-wrap: wrap;
361
+ gap: 8px;
362
+ color: var(--muted);
363
+ font-size: 11px;
364
+ }
365
+
366
+ .table-wrap {
367
+ overflow-x: auto;
368
+ }
369
+
370
+ table {
371
+ width: 100%;
372
+ border-collapse: collapse;
373
+ font-size: 13px;
374
+ }
375
+
376
+ th,
377
+ td {
378
+ padding: 6px 8px;
379
+ text-align: left;
380
+ vertical-align: top;
381
+ border-top: 1px solid var(--line);
382
+ }
383
+
384
+ th {
385
+ color: var(--muted);
386
+ font-size: 11px;
387
+ text-transform: uppercase;
388
+ letter-spacing: 0.05em;
389
+ font-weight: 600;
390
+ border-top: 0;
391
+ background: var(--panel-strong);
392
+ position: sticky;
393
+ top: 0;
394
+ }
395
+
396
+ .mono {
397
+ font-family: 'SF Mono', ui-monospace, Menlo, Consolas, monospace;
398
+ font-size: 12px;
399
+ }
400
+
401
+ .muted {
402
+ color: var(--muted);
403
+ }
404
+
405
+ .status-pill {
406
+ display: inline-flex;
407
+ align-items: center;
408
+ padding: 2px 6px;
409
+ border-radius: 4px;
410
+ font-size: 11px;
411
+ font-weight: 600;
412
+ background: var(--panel-strong);
413
+ border: 1px solid var(--line);
414
+ }
415
+
416
+ .status-pill.RUNNING,
417
+ .status-pill.waiting-worker,
418
+ .status-pill.launching,
419
+ .status-pill.reconciling {
420
+ background: var(--accent-soft);
421
+ color: var(--accent);
422
+ border-color: transparent;
423
+ }
424
+
425
+ .status-pill.waiting-provider,
426
+ .status-pill.waiting-due,
427
+ .status-pill.waiting-open-pr,
428
+ .status-pill.idle,
429
+ .status-pill.sleeping {
430
+ background: var(--warn-soft);
431
+ color: var(--warn);
432
+ border-color: transparent;
433
+ }
434
+
435
+ .status-pill.FAILED,
436
+ .status-pill.stopped,
437
+ .status-pill.launch-failed {
438
+ background: var(--danger-soft);
439
+ color: var(--danger);
440
+ border-color: transparent;
441
+ }
442
+
443
+ .status-pill.implemented {
444
+ background: var(--implemented-soft);
445
+ color: var(--implemented-ink);
446
+ border-color: transparent;
447
+ }
448
+
449
+ .status-pill.reported,
450
+ .status-pill.completed {
451
+ background: var(--reported-soft);
452
+ color: var(--reported-ink);
453
+ border-color: transparent;
454
+ }
455
+
456
+ .status-pill.blocked {
457
+ background: var(--blocked-soft);
458
+ color: var(--blocked-ink);
459
+ border-color: transparent;
460
+ }
461
+
462
+ .status-pill.failed,
463
+ .status-pill.unknown {
464
+ background: var(--danger-soft);
465
+ color: var(--danger);
466
+ border-color: transparent;
467
+ }
468
+
469
+ .status-pill.running {
470
+ background: var(--accent-soft);
471
+ color: var(--accent);
472
+ border-color: transparent;
473
+ }
474
+
475
+ .empty-state {
476
+ color: var(--muted);
477
+ padding: 8px 4px;
478
+ font-size: 13px;
479
+ }
480
+
481
+ /* Filter bar */
482
+ .filter-bar {
483
+ display: flex;
484
+ gap: 6px;
485
+ margin-bottom: 8px;
486
+ flex-wrap: wrap;
487
+ align-items: center;
488
+ }
489
+
490
+ .filter-search {
491
+ flex: 1;
492
+ min-width: 180px;
493
+ padding: 4px 8px;
494
+ border: 1px solid var(--line);
495
+ border-radius: 4px;
496
+ background: var(--panel);
537
497
  color: var(--ink);
538
498
  font-size: 12px;
539
- max-height: 400px;
540
- overflow-y: auto;
541
- white-space: pre-wrap;
499
+ }
500
+
501
+ .filter-search:focus {
502
+ outline: none;
503
+ border-color: var(--accent);
504
+ box-shadow: 0 0 0 2px var(--accent-soft);
505
+ }
506
+
507
+ .filter-btn {
508
+ padding: 4px 10px;
509
+ font-size: 12px;
510
+ border-radius: 4px;
511
+ background: var(--panel);
512
+ color: var(--ink);
513
+ border: 1px solid var(--line);
514
+ }
515
+
516
+ .filter-btn:hover {
517
+ background: var(--panel-strong);
518
+ }
519
+
520
+ .filter-btn.active {
521
+ background: var(--accent);
522
+ color: var(--button-ink);
523
+ border-color: transparent;
524
+ }
525
+
526
+ /* Pagination */
527
+ .pagination {
528
+ display: flex;
529
+ gap: 4px;
530
+ align-items: center;
531
+ justify-content: space-between;
532
+ margin-top: 8px;
533
+ font-size: 12px;
534
+ color: var(--muted);
535
+ }
536
+
537
+ .pagination-info {
538
+ font-size: 12px;
539
+ }
540
+
541
+ .pagination-controls {
542
+ display: flex;
543
+ gap: 2px;
544
+ align-items: center;
545
+ }
546
+
547
+ .pagination-controls button {
548
+ padding: 4px 8px;
549
+ font-size: 12px;
550
+ min-width: 28px;
551
+ text-align: center;
552
+ background: var(--panel);
553
+ color: var(--ink);
554
+ border: 1px solid var(--line);
555
+ border-radius: 4px;
556
+ }
557
+
558
+ .pagination-controls button:hover {
559
+ background: var(--panel-strong);
560
+ }
561
+
562
+ .pagination-controls button.active {
563
+ background: var(--accent);
564
+ color: var(--button-ink);
565
+ border-color: transparent;
566
+ }
567
+
568
+ .pagination-controls button:disabled {
569
+ opacity: 0.4;
570
+ cursor: not-allowed;
571
+ }
572
+
573
+ .pagination-ellipsis {
574
+ padding: 4px 4px;
575
+ color: var(--muted);
576
+ }
577
+
578
+ /* Icon-only action buttons */
579
+ .action-btn {
580
+ padding: 4px 6px;
581
+ font-size: 14px;
582
+ line-height: 1;
583
+ background: transparent;
584
+ color: var(--muted);
585
+ border: 1px solid transparent;
586
+ border-radius: 4px;
587
+ }
588
+
589
+ .action-btn:hover {
590
+ background: var(--panel-strong);
591
+ color: var(--ink);
592
+ border-color: var(--line);
593
+ }
594
+
595
+ @media (max-width: 960px) {
596
+ .hero,
597
+ .profile-header {
598
+ flex-direction: column;
599
+ }
600
+
601
+ .hero-actions,
602
+ .badge-row {
603
+ align-items: flex-start;
604
+ justify-content: flex-start;
605
+ text-align: left;
606
+ }
607
+
608
+ .hero-controls {
609
+ justify-content: flex-start;
610
+ }
611
+
612
+ .panel.half,
613
+ .panel.third {
614
+ grid-column: span 12;
615
+ }
542
616
  }