codex-usage-tracking 0.3.0__py3-none-any.whl

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 (50) hide show
  1. codex_usage_tracker/__init__.py +7 -0
  2. codex_usage_tracker/__main__.py +6 -0
  3. codex_usage_tracker/allowance.py +759 -0
  4. codex_usage_tracker/api_payloads.py +90 -0
  5. codex_usage_tracker/cli.py +1326 -0
  6. codex_usage_tracker/context.py +410 -0
  7. codex_usage_tracker/costing.py +176 -0
  8. codex_usage_tracker/dashboard.py +389 -0
  9. codex_usage_tracker/diagnostics.py +624 -0
  10. codex_usage_tracker/formatting.py +225 -0
  11. codex_usage_tracker/json_contracts.py +350 -0
  12. codex_usage_tracker/mcp_server.py +371 -0
  13. codex_usage_tracker/models.py +92 -0
  14. codex_usage_tracker/parser.py +491 -0
  15. codex_usage_tracker/paths.py +18 -0
  16. codex_usage_tracker/plugin_data/__init__.py +1 -0
  17. codex_usage_tracker/plugin_data/assets/icon.svg +8 -0
  18. codex_usage_tracker/plugin_data/dashboard/dashboard.css +954 -0
  19. codex_usage_tracker/plugin_data/dashboard/dashboard.js +1833 -0
  20. codex_usage_tracker/plugin_data/dashboard/dashboard_data.js +155 -0
  21. codex_usage_tracker/plugin_data/dashboard/dashboard_format.js +132 -0
  22. codex_usage_tracker/plugin_data/dashboard/dashboard_state.js +157 -0
  23. codex_usage_tracker/plugin_data/dashboard/dashboard_template.html +141 -0
  24. codex_usage_tracker/plugin_data/docs/assets/dashboard-calls.png +0 -0
  25. codex_usage_tracker/plugin_data/docs/assets/dashboard-details.png +0 -0
  26. codex_usage_tracker/plugin_data/docs/assets/dashboard-insights.png +0 -0
  27. codex_usage_tracker/plugin_data/docs/assets/dashboard-threads.png +0 -0
  28. codex_usage_tracker/plugin_data/docs/dashboard-guide.html +136 -0
  29. codex_usage_tracker/plugin_data/rate_cards/codex-credit-rates.json +69 -0
  30. codex_usage_tracker/plugin_data/skills/codex-usage-api/SKILL.md +62 -0
  31. codex_usage_tracker/plugin_data/skills/codex-usage-tracker/SKILL.md +47 -0
  32. codex_usage_tracker/plugin_installer.py +312 -0
  33. codex_usage_tracker/pricing.py +57 -0
  34. codex_usage_tracker/pricing_config.py +223 -0
  35. codex_usage_tracker/pricing_estimates.py +44 -0
  36. codex_usage_tracker/pricing_openai.py +253 -0
  37. codex_usage_tracker/projects.py +347 -0
  38. codex_usage_tracker/recommendations.py +270 -0
  39. codex_usage_tracker/reports.py +637 -0
  40. codex_usage_tracker/schema.py +71 -0
  41. codex_usage_tracker/server.py +400 -0
  42. codex_usage_tracker/store.py +666 -0
  43. codex_usage_tracker/support.py +147 -0
  44. codex_usage_tracker/threads.py +183 -0
  45. codex_usage_tracking-0.3.0.dist-info/METADATA +278 -0
  46. codex_usage_tracking-0.3.0.dist-info/RECORD +50 -0
  47. codex_usage_tracking-0.3.0.dist-info/WHEEL +5 -0
  48. codex_usage_tracking-0.3.0.dist-info/entry_points.txt +2 -0
  49. codex_usage_tracking-0.3.0.dist-info/licenses/LICENSE +21 -0
  50. codex_usage_tracking-0.3.0.dist-info/top_level.txt +1 -0
@@ -0,0 +1,954 @@
1
+ :root {
2
+ color-scheme: light;
3
+ --bg: #f7f8fb;
4
+ --panel: #ffffff;
5
+ --ink: #172033;
6
+ --muted: #69758a;
7
+ --line: #dde3ee;
8
+ --blue: #2563eb;
9
+ --green: #047857;
10
+ --amber: #b45309;
11
+ --red: #b91c1c;
12
+ --violet: #6d28d9;
13
+ --shadow: 0 12px 32px rgba(23, 32, 51, 0.09);
14
+ }
15
+ * { box-sizing: border-box; }
16
+ [hidden] { display: none !important; }
17
+ body {
18
+ margin: 0;
19
+ font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
20
+ background: var(--bg);
21
+ color: var(--ink);
22
+ }
23
+ header {
24
+ padding: 18px 28px 14px;
25
+ border-bottom: 1px solid var(--line);
26
+ background: var(--panel);
27
+ }
28
+ .header-main {
29
+ display: flex;
30
+ align-items: flex-start;
31
+ justify-content: space-between;
32
+ gap: 18px;
33
+ }
34
+ .eyebrow {
35
+ margin: 0 0 3px;
36
+ color: var(--muted);
37
+ font-size: 11px;
38
+ font-weight: 780;
39
+ letter-spacing: 0.04em;
40
+ text-transform: uppercase;
41
+ }
42
+ h1 { margin: 0; font-size: 23px; font-weight: 760; letter-spacing: 0; }
43
+ .header-meta {
44
+ display: flex;
45
+ align-items: center;
46
+ justify-content: space-between;
47
+ gap: 8px;
48
+ margin-top: 11px;
49
+ min-height: 26px;
50
+ color: var(--muted);
51
+ font-size: 12px;
52
+ font-weight: 680;
53
+ }
54
+ .meta-chips {
55
+ display: flex;
56
+ flex-wrap: wrap;
57
+ align-items: center;
58
+ gap: 8px;
59
+ min-width: 0;
60
+ }
61
+ .live-status,
62
+ .source-line {
63
+ display: inline-flex;
64
+ align-items: center;
65
+ min-height: 24px;
66
+ padding: 2px 8px;
67
+ border: 1px solid #c7d2fe;
68
+ border-radius: 999px;
69
+ background: #eef2ff;
70
+ color: #3346a3;
71
+ font-weight: 760;
72
+ }
73
+ .live-status {
74
+ justify-content: center;
75
+ min-width: 58px;
76
+ }
77
+ .disclaimer-chip {
78
+ display: inline-flex;
79
+ align-items: center;
80
+ min-height: 24px;
81
+ padding: 2px 8px;
82
+ border: 1px solid #fed7aa;
83
+ border-radius: 999px;
84
+ background: #fff7ed;
85
+ color: #9a3412;
86
+ font-weight: 780;
87
+ }
88
+ .source-line {
89
+ border-color: var(--line);
90
+ background: #f8fafc;
91
+ color: var(--muted);
92
+ }
93
+ .source-line[data-state="missing"],
94
+ .live-status[data-state="error"] {
95
+ border-color: #fed7aa;
96
+ background: #fff7ed;
97
+ color: #9a3412;
98
+ }
99
+ .guide-link {
100
+ flex: 0 0 auto;
101
+ color: var(--blue);
102
+ font-weight: 760;
103
+ text-decoration: none;
104
+ }
105
+ .guide-link:hover { text-decoration: underline; }
106
+ .live-bar {
107
+ display: flex;
108
+ flex-wrap: wrap;
109
+ align-items: center;
110
+ gap: 10px;
111
+ justify-content: flex-end;
112
+ }
113
+ .refresh-button {
114
+ min-height: 34px;
115
+ padding: 6px 12px;
116
+ border: 1px solid var(--line);
117
+ border-radius: 8px;
118
+ background: var(--panel);
119
+ color: var(--blue);
120
+ font-size: 12px;
121
+ font-weight: 760;
122
+ cursor: pointer;
123
+ }
124
+ .refresh-button:hover { background: #eff6ff; }
125
+ .refresh-button:disabled { cursor: progress; opacity: 0.7; }
126
+ .live-toggle {
127
+ display: inline-flex;
128
+ grid-template-columns: none;
129
+ align-items: center;
130
+ gap: 7px;
131
+ min-height: 34px;
132
+ font-size: 12px;
133
+ font-weight: 760;
134
+ color: var(--muted);
135
+ }
136
+ .live-toggle input {
137
+ width: auto;
138
+ min-height: 0;
139
+ padding: 0;
140
+ margin: 0;
141
+ }
142
+ .live-status {
143
+ font-size: 12px;
144
+ font-weight: 680;
145
+ }
146
+ .load-control,
147
+ .history-control {
148
+ display: inline-flex;
149
+ grid-template-columns: none;
150
+ align-items: center;
151
+ gap: 7px;
152
+ min-height: 34px;
153
+ color: var(--muted);
154
+ font-size: 12px;
155
+ font-weight: 760;
156
+ }
157
+ .load-control select,
158
+ .history-control select {
159
+ width: auto;
160
+ min-width: 104px;
161
+ min-height: 34px;
162
+ padding: 5px 8px;
163
+ font-size: 12px;
164
+ }
165
+ .history-control select {
166
+ min-width: 156px;
167
+ }
168
+ main { padding: 22px 28px 36px; }
169
+ .filters {
170
+ display: grid;
171
+ grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
172
+ gap: 12px;
173
+ margin-bottom: 18px;
174
+ }
175
+ label { display: grid; gap: 6px; font-size: 12px; font-weight: 680; color: var(--muted); }
176
+ input, select {
177
+ width: 100%;
178
+ min-height: 38px;
179
+ padding: 7px 10px;
180
+ border: 1px solid var(--line);
181
+ border-radius: 8px;
182
+ background: var(--panel);
183
+ color: var(--ink);
184
+ font: inherit;
185
+ }
186
+ .filter-status {
187
+ color: var(--muted);
188
+ font-size: 11px;
189
+ font-weight: 720;
190
+ line-height: 1.2;
191
+ overflow-wrap: anywhere;
192
+ }
193
+ .filter-status:empty {
194
+ display: none;
195
+ }
196
+ .filter-status[data-state="active"] {
197
+ color: var(--blue);
198
+ }
199
+ .filter-status[data-state="error"] {
200
+ color: var(--red);
201
+ }
202
+ .cards {
203
+ display: grid;
204
+ grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
205
+ gap: 12px;
206
+ margin-bottom: 18px;
207
+ }
208
+ .card {
209
+ background: var(--panel);
210
+ border: 1px solid var(--line);
211
+ border-radius: 8px;
212
+ padding: 14px;
213
+ box-shadow: var(--shadow);
214
+ }
215
+ .card span { display: block; color: var(--muted); font-size: 12px; font-weight: 680; }
216
+ .card strong { display: block; margin-top: 7px; font-size: 22px; }
217
+ #allowanceImpact { white-space: pre-line; line-height: 1.18; }
218
+ .insights-panel {
219
+ margin-bottom: 18px;
220
+ }
221
+ .insights-panel[hidden] {
222
+ display: none;
223
+ }
224
+ .insights-layout {
225
+ display: grid;
226
+ grid-template-columns: minmax(0, 1.4fr) minmax(300px, 0.8fr);
227
+ gap: 16px;
228
+ padding: 14px;
229
+ }
230
+ .section-heading,
231
+ .preset-heading {
232
+ display: flex;
233
+ align-items: flex-start;
234
+ justify-content: space-between;
235
+ gap: 12px;
236
+ margin-bottom: 12px;
237
+ }
238
+ .section-heading h2,
239
+ .preset-heading h2 {
240
+ margin: 0;
241
+ padding: 0;
242
+ border: 0;
243
+ font-size: 15px;
244
+ }
245
+ .section-heading p,
246
+ .preset-heading p {
247
+ margin: 4px 0 0;
248
+ color: var(--muted);
249
+ font-size: 12px;
250
+ font-weight: 680;
251
+ line-height: 1.35;
252
+ }
253
+ .insight-cards {
254
+ display: grid;
255
+ grid-template-columns: repeat(3, minmax(0, 1fr));
256
+ gap: 10px;
257
+ }
258
+ .insight-card {
259
+ display: grid;
260
+ align-content: start;
261
+ min-height: 172px;
262
+ padding: 13px;
263
+ border: 1px solid var(--line);
264
+ border-radius: 8px;
265
+ background: #fbfcfe;
266
+ }
267
+ .insight-card[data-severity="high"] {
268
+ border-color: #fecaca;
269
+ background: #fff7f7;
270
+ }
271
+ .insight-card[data-severity="medium"] {
272
+ border-color: #fed7aa;
273
+ background: #fffaf0;
274
+ }
275
+ .insight-card[data-severity="review"] {
276
+ border-color: #bfdbfe;
277
+ background: #f7fbff;
278
+ }
279
+ .insight-card h3 {
280
+ margin: 0;
281
+ font-size: 14px;
282
+ line-height: 1.2;
283
+ }
284
+ .insight-card strong {
285
+ display: block;
286
+ margin: 9px 0 5px;
287
+ font-size: 24px;
288
+ letter-spacing: 0;
289
+ }
290
+ .insight-card p {
291
+ margin: 0;
292
+ color: var(--muted);
293
+ font-size: 12px;
294
+ font-weight: 650;
295
+ line-height: 1.35;
296
+ }
297
+ .insight-card-header {
298
+ display: flex;
299
+ align-items: flex-start;
300
+ justify-content: space-between;
301
+ gap: 10px;
302
+ }
303
+ .severity-chip,
304
+ .preset-chip {
305
+ display: inline-flex;
306
+ align-items: center;
307
+ min-height: 22px;
308
+ padding: 2px 8px;
309
+ border: 1px solid var(--line);
310
+ border-radius: 999px;
311
+ background: var(--panel);
312
+ color: var(--muted);
313
+ font-size: 11px;
314
+ font-weight: 780;
315
+ white-space: nowrap;
316
+ }
317
+ .severity-chip.high {
318
+ border-color: #fecaca;
319
+ background: #fef2f2;
320
+ color: var(--red);
321
+ }
322
+ .severity-chip.medium {
323
+ border-color: #fed7aa;
324
+ background: #fff7ed;
325
+ color: var(--amber);
326
+ }
327
+ .severity-chip.review {
328
+ border-color: #bfdbfe;
329
+ background: #eff6ff;
330
+ color: var(--blue);
331
+ }
332
+ .insight-action {
333
+ width: max-content;
334
+ max-width: 100%;
335
+ margin-top: 12px;
336
+ padding: 0;
337
+ border: 0;
338
+ background: transparent;
339
+ color: var(--blue);
340
+ font-size: 12px;
341
+ font-weight: 780;
342
+ text-align: left;
343
+ cursor: pointer;
344
+ }
345
+ .insight-action:hover,
346
+ .preset-clear:hover {
347
+ text-decoration: underline;
348
+ }
349
+ .preset-panel {
350
+ min-width: 0;
351
+ }
352
+ .preset-clear {
353
+ min-height: 28px;
354
+ padding: 4px 8px;
355
+ border: 1px solid var(--line);
356
+ border-radius: 8px;
357
+ background: var(--panel);
358
+ color: var(--blue);
359
+ font-size: 12px;
360
+ font-weight: 760;
361
+ cursor: pointer;
362
+ }
363
+ .preset-status {
364
+ margin-bottom: 10px;
365
+ padding: 8px 10px;
366
+ border: 1px solid var(--line);
367
+ border-radius: 8px;
368
+ background: #fbfcfe;
369
+ color: var(--muted);
370
+ font-size: 12px;
371
+ font-weight: 680;
372
+ }
373
+ .preset-list {
374
+ display: grid;
375
+ gap: 8px;
376
+ }
377
+ .preset-card {
378
+ display: grid;
379
+ grid-template-columns: minmax(0, 1fr) auto;
380
+ gap: 10px;
381
+ align-items: center;
382
+ min-height: 68px;
383
+ padding: 10px;
384
+ border: 1px solid var(--line);
385
+ border-radius: 8px;
386
+ background: #fbfcfe;
387
+ color: var(--ink);
388
+ text-align: left;
389
+ cursor: pointer;
390
+ }
391
+ .preset-card[aria-pressed="true"] {
392
+ border-color: #bfdbfe;
393
+ background: #eff6ff;
394
+ }
395
+ .preset-copy b {
396
+ display: block;
397
+ font-size: 13px;
398
+ line-height: 1.2;
399
+ }
400
+ .preset-copy span {
401
+ display: block;
402
+ margin-top: 4px;
403
+ color: var(--muted);
404
+ font-size: 11px;
405
+ font-weight: 650;
406
+ line-height: 1.32;
407
+ }
408
+ .grid {
409
+ display: grid;
410
+ grid-template-columns: minmax(0, 1.4fr) minmax(320px, 0.8fr);
411
+ gap: 16px;
412
+ align-items: start;
413
+ }
414
+ section {
415
+ background: var(--panel);
416
+ border: 1px solid var(--line);
417
+ border-radius: 8px;
418
+ overflow: hidden;
419
+ box-shadow: var(--shadow);
420
+ }
421
+ .detail-section {
422
+ position: sticky;
423
+ top: 14px;
424
+ max-height: calc(100dvh - 28px);
425
+ display: flex;
426
+ flex-direction: column;
427
+ }
428
+ section h2 {
429
+ margin: 0;
430
+ padding: 14px 16px;
431
+ border-bottom: 1px solid var(--line);
432
+ font-size: 15px;
433
+ }
434
+ table { width: 100%; border-collapse: collapse; font-size: 13px; }
435
+ th, td { padding: 10px 12px; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; }
436
+ th { color: var(--muted); font-size: 12px; background: #fbfcfe; position: sticky; top: 0; }
437
+ tr:hover { background: #eff6ff; }
438
+ .call-row {
439
+ cursor: pointer;
440
+ }
441
+ .call-row:focus-visible,
442
+ .thread-row:focus-visible,
443
+ .thread-call-row:focus-visible {
444
+ outline: 2px solid var(--blue);
445
+ outline-offset: -2px;
446
+ background: #eff6ff;
447
+ }
448
+ button {
449
+ font: inherit;
450
+ }
451
+ .sort-header {
452
+ display: inline-flex;
453
+ align-items: center;
454
+ gap: 4px;
455
+ max-width: 100%;
456
+ min-height: 24px;
457
+ padding: 0;
458
+ border: 0;
459
+ background: transparent;
460
+ color: inherit;
461
+ font-size: inherit;
462
+ font-weight: 760;
463
+ cursor: pointer;
464
+ }
465
+ th.num .sort-header {
466
+ width: 100%;
467
+ justify-content: flex-end;
468
+ }
469
+ th[data-sort-active="true"] .sort-header {
470
+ color: var(--ink);
471
+ }
472
+ .sort-indicator {
473
+ display: inline-block;
474
+ min-width: 12px;
475
+ color: var(--blue);
476
+ font-size: 11px;
477
+ }
478
+ .table-tools {
479
+ display: grid;
480
+ grid-template-columns: auto minmax(0, 1fr) auto auto;
481
+ align-items: center;
482
+ gap: 12px;
483
+ padding: 12px 16px;
484
+ border-bottom: 1px solid var(--line);
485
+ background: #fbfcfe;
486
+ }
487
+ .segmented {
488
+ display: inline-flex;
489
+ gap: 2px;
490
+ padding: 3px;
491
+ border: 1px solid var(--line);
492
+ border-radius: 8px;
493
+ background: #eef2f8;
494
+ }
495
+ .segmented button {
496
+ min-width: 82px;
497
+ min-height: 30px;
498
+ border: 0;
499
+ border-radius: 6px;
500
+ background: transparent;
501
+ color: var(--muted);
502
+ font-size: 12px;
503
+ font-weight: 760;
504
+ cursor: pointer;
505
+ }
506
+ .segmented button[aria-pressed="true"] {
507
+ background: var(--panel);
508
+ color: var(--ink);
509
+ box-shadow: 0 1px 4px rgba(23, 32, 51, 0.12);
510
+ }
511
+ .table-caption {
512
+ min-width: 0;
513
+ color: var(--muted);
514
+ font-size: 12px;
515
+ font-weight: 680;
516
+ }
517
+ .table-actions {
518
+ display: inline-flex;
519
+ align-items: center;
520
+ justify-content: flex-end;
521
+ gap: 8px;
522
+ min-width: 0;
523
+ white-space: nowrap;
524
+ }
525
+ .toolbar-button {
526
+ min-height: 30px;
527
+ padding: 4px 9px;
528
+ border: 1px solid var(--line);
529
+ border-radius: 8px;
530
+ background: var(--panel);
531
+ color: var(--blue);
532
+ font-size: 12px;
533
+ font-weight: 760;
534
+ cursor: pointer;
535
+ }
536
+ .toolbar-button:hover {
537
+ background: #eff6ff;
538
+ }
539
+ .action-status {
540
+ min-width: 62px;
541
+ color: var(--muted);
542
+ font-size: 11px;
543
+ font-weight: 720;
544
+ }
545
+ .pager {
546
+ display: inline-flex;
547
+ align-items: center;
548
+ justify-content: flex-end;
549
+ gap: 8px;
550
+ color: var(--muted);
551
+ font-size: 12px;
552
+ font-weight: 680;
553
+ white-space: nowrap;
554
+ }
555
+ .pager[hidden] {
556
+ display: none;
557
+ }
558
+ .pager-button {
559
+ min-height: 30px;
560
+ padding: 4px 9px;
561
+ border: 1px solid var(--line);
562
+ border-radius: 8px;
563
+ background: var(--panel);
564
+ color: var(--blue);
565
+ font-size: 12px;
566
+ font-weight: 760;
567
+ cursor: pointer;
568
+ }
569
+ .pager-button:disabled {
570
+ cursor: not-allowed;
571
+ color: var(--muted);
572
+ opacity: 0.55;
573
+ }
574
+ .num { text-align: right; font-variant-numeric: tabular-nums; }
575
+ .metric-stack {
576
+ display: inline-flex;
577
+ flex-direction: column;
578
+ align-items: flex-end;
579
+ gap: 2px;
580
+ line-height: 1.15;
581
+ }
582
+ .metric-sub {
583
+ color: var(--muted);
584
+ font-size: 11px;
585
+ font-weight: 720;
586
+ }
587
+ .time-cell {
588
+ display: grid;
589
+ gap: 2px;
590
+ min-width: 104px;
591
+ line-height: 1.2;
592
+ }
593
+ .time-date {
594
+ color: var(--ink);
595
+ font-weight: 680;
596
+ white-space: nowrap;
597
+ }
598
+ .time-clock {
599
+ color: var(--muted);
600
+ font-size: 12px;
601
+ white-space: nowrap;
602
+ }
603
+ .pill {
604
+ display: inline-flex;
605
+ align-items: center;
606
+ justify-content: center;
607
+ max-width: 100%;
608
+ min-height: 22px;
609
+ padding: 2px 8px;
610
+ border-radius: 999px;
611
+ background: #e0ecff;
612
+ color: #184fc5;
613
+ font-weight: 680;
614
+ font-size: 12px;
615
+ line-height: 1.08;
616
+ white-space: nowrap;
617
+ }
618
+ .model-pill {
619
+ width: max-content;
620
+ max-width: min(132px, 100%);
621
+ min-width: 0;
622
+ overflow: hidden;
623
+ }
624
+ .flags {
625
+ display: flex;
626
+ flex-wrap: wrap;
627
+ gap: 4px;
628
+ justify-content: flex-end;
629
+ }
630
+ .flag {
631
+ display: inline-flex;
632
+ min-height: 20px;
633
+ align-items: center;
634
+ padding: 1px 7px;
635
+ border-radius: 999px;
636
+ background: #f5e8ff;
637
+ color: var(--violet);
638
+ font-size: 11px;
639
+ font-weight: 680;
640
+ white-space: nowrap;
641
+ }
642
+ .thread-row {
643
+ cursor: pointer;
644
+ }
645
+ .thread-row[aria-expanded="true"] {
646
+ background: #f8fbff;
647
+ }
648
+ .thread-row.spawned-thread {
649
+ background: #fcfdff;
650
+ }
651
+ .thread-row.spawned-thread td:nth-child(2) {
652
+ border-left: 3px solid #bfdbfe;
653
+ padding-left: 18px;
654
+ }
655
+ .thread-title {
656
+ display: flex;
657
+ gap: 8px;
658
+ align-items: center;
659
+ min-width: 0;
660
+ }
661
+ .thread-toggle {
662
+ flex: 0 0 auto;
663
+ display: inline-grid;
664
+ place-items: center;
665
+ width: 22px;
666
+ height: 22px;
667
+ border: 1px solid var(--line);
668
+ border-radius: 999px;
669
+ background: var(--panel);
670
+ color: var(--blue);
671
+ font-size: 13px;
672
+ font-weight: 820;
673
+ }
674
+ .thread-meta {
675
+ display: grid;
676
+ gap: 2px;
677
+ min-width: 0;
678
+ }
679
+ .thread-name {
680
+ font-weight: 760;
681
+ overflow-wrap: anywhere;
682
+ }
683
+ .thread-subtle {
684
+ color: var(--muted);
685
+ font-size: 12px;
686
+ }
687
+ .thread-relation {
688
+ color: var(--blue);
689
+ font-weight: 720;
690
+ }
691
+ .child-cell {
692
+ padding: 0;
693
+ background: #f8fafd;
694
+ }
695
+ .thread-call-table {
696
+ width: 100%;
697
+ border-collapse: collapse;
698
+ font-size: 12px;
699
+ }
700
+ .thread-call-table th {
701
+ position: static;
702
+ background: #eef3fb;
703
+ }
704
+ .thread-call-table td, .thread-call-table th {
705
+ padding: 8px 10px;
706
+ }
707
+ .thread-call-table tr:last-child td {
708
+ border-bottom: 0;
709
+ }
710
+ .empty-state {
711
+ padding: 18px 16px;
712
+ color: var(--muted);
713
+ text-align: center;
714
+ }
715
+ .detail {
716
+ flex: 1 1 auto;
717
+ padding: 14px 16px;
718
+ min-height: 280px;
719
+ overflow-x: hidden;
720
+ overflow-y: scroll;
721
+ scrollbar-gutter: stable;
722
+ scrollbar-width: thin;
723
+ scrollbar-color: #94a3b8 #eef2f8;
724
+ color: var(--muted);
725
+ line-height: 1.45;
726
+ }
727
+ .detail::-webkit-scrollbar {
728
+ width: 10px;
729
+ }
730
+ .detail::-webkit-scrollbar-track {
731
+ background: #eef2f8;
732
+ border-left: 1px solid var(--line);
733
+ }
734
+ .detail::-webkit-scrollbar-thumb {
735
+ background: #94a3b8;
736
+ border: 2px solid #eef2f8;
737
+ border-radius: 999px;
738
+ }
739
+ .detail::-webkit-scrollbar-thumb:hover {
740
+ background: #64748b;
741
+ }
742
+ .detail dl { display: grid; grid-template-columns: minmax(120px, 0.6fr) minmax(0, 1fr); gap: 8px 14px; margin: 0; }
743
+ .detail dt { font-weight: 720; color: var(--ink); }
744
+ .detail dd { margin: 0; overflow-wrap: anywhere; }
745
+ .detail-stack {
746
+ display: grid;
747
+ gap: 12px;
748
+ }
749
+ .detail-card {
750
+ padding: 12px;
751
+ border: 1px solid var(--line);
752
+ border-radius: 8px;
753
+ background: #fbfcfe;
754
+ }
755
+ .detail-card.primary {
756
+ border-color: #bfdbfe;
757
+ background: #f7fbff;
758
+ }
759
+ .detail-card h3 {
760
+ margin: 0 0 10px;
761
+ color: var(--ink);
762
+ font-size: 14px;
763
+ line-height: 1.25;
764
+ }
765
+ .detail-card p {
766
+ margin: 0;
767
+ color: var(--muted);
768
+ font-size: 12px;
769
+ font-weight: 650;
770
+ line-height: 1.4;
771
+ }
772
+ .detail-kv {
773
+ display: grid;
774
+ grid-template-columns: minmax(110px, 0.7fr) minmax(0, 1fr);
775
+ gap: 8px 12px;
776
+ margin: 0;
777
+ font-size: 12px;
778
+ }
779
+ .detail-kv dt {
780
+ color: var(--muted);
781
+ font-weight: 720;
782
+ }
783
+ .detail-kv dd {
784
+ color: var(--ink);
785
+ font-weight: 680;
786
+ }
787
+ .detail-collapse {
788
+ border: 1px solid var(--line);
789
+ border-radius: 8px;
790
+ background: #fbfcfe;
791
+ }
792
+ .detail-collapse summary {
793
+ min-height: 38px;
794
+ padding: 9px 11px;
795
+ color: var(--muted);
796
+ font-size: 12px;
797
+ font-weight: 760;
798
+ cursor: pointer;
799
+ }
800
+ .detail-collapse-body {
801
+ padding: 0 11px 11px;
802
+ }
803
+ .timeline-list {
804
+ display: grid;
805
+ gap: 10px;
806
+ }
807
+ .timeline-item {
808
+ display: grid;
809
+ grid-template-columns: minmax(72px, 0.35fr) minmax(0, 1fr);
810
+ gap: 10px;
811
+ padding-bottom: 10px;
812
+ border-bottom: 1px solid var(--line);
813
+ }
814
+ .timeline-item:last-child {
815
+ padding-bottom: 0;
816
+ border-bottom: 0;
817
+ }
818
+ .timeline-time {
819
+ color: var(--muted);
820
+ font-size: 11px;
821
+ font-weight: 760;
822
+ line-height: 1.25;
823
+ }
824
+ .timeline-title {
825
+ color: var(--ink);
826
+ font-size: 12px;
827
+ font-weight: 760;
828
+ line-height: 1.25;
829
+ }
830
+ .timeline-meta {
831
+ margin-top: 5px;
832
+ color: var(--muted);
833
+ font-size: 11px;
834
+ font-weight: 650;
835
+ line-height: 1.35;
836
+ }
837
+ .signal-strip {
838
+ display: flex;
839
+ flex-wrap: wrap;
840
+ gap: 4px;
841
+ margin-top: 7px;
842
+ }
843
+ .mini-bar {
844
+ height: 7px;
845
+ overflow: hidden;
846
+ border-radius: 999px;
847
+ background: #e5eaf3;
848
+ }
849
+ .mini-bar span {
850
+ display: block;
851
+ height: 100%;
852
+ border-radius: 999px;
853
+ background: var(--blue);
854
+ }
855
+ .mini-bar span.low { background: var(--green); }
856
+ .mini-bar span.medium { background: var(--amber); }
857
+ .mini-bar span.high { background: var(--red); }
858
+ .context-actions {
859
+ display: flex;
860
+ flex-wrap: wrap;
861
+ gap: 8px;
862
+ margin-top: 14px;
863
+ padding-top: 12px;
864
+ border-top: 1px solid var(--line);
865
+ }
866
+ .context-button {
867
+ min-height: 32px;
868
+ padding: 6px 10px;
869
+ border: 1px solid var(--line);
870
+ border-radius: 8px;
871
+ background: var(--panel);
872
+ color: var(--blue);
873
+ font-size: 12px;
874
+ font-weight: 760;
875
+ cursor: pointer;
876
+ }
877
+ .context-button:hover { background: #eff6ff; }
878
+ .context-button.secondary { color: var(--muted); }
879
+ .context-result {
880
+ margin-top: 12px;
881
+ padding-top: 12px;
882
+ border-top: 1px solid var(--line);
883
+ }
884
+ .context-note { margin: 0 0 10px; font-size: 12px; color: var(--muted); }
885
+ .context-entry {
886
+ margin: 10px 0;
887
+ border: 1px solid var(--line);
888
+ border-radius: 8px;
889
+ overflow: hidden;
890
+ background: #fbfcfe;
891
+ }
892
+ .context-entry-header {
893
+ display: flex;
894
+ justify-content: space-between;
895
+ gap: 10px;
896
+ padding: 8px 10px;
897
+ border-bottom: 1px solid var(--line);
898
+ color: var(--muted);
899
+ font-size: 12px;
900
+ font-weight: 720;
901
+ }
902
+ .context-entry pre {
903
+ margin: 0;
904
+ padding: 10px;
905
+ max-height: 360px;
906
+ overflow: auto;
907
+ white-space: pre-wrap;
908
+ overflow-wrap: anywhere;
909
+ color: var(--ink);
910
+ font: 12px/1.45 ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
911
+ }
912
+ .to-top {
913
+ position: fixed;
914
+ right: 18px;
915
+ bottom: 18px;
916
+ z-index: 4;
917
+ min-height: 38px;
918
+ padding: 8px 12px;
919
+ border: 1px solid #c7d2fe;
920
+ border-radius: 999px;
921
+ background: var(--panel);
922
+ color: var(--blue);
923
+ box-shadow: var(--shadow);
924
+ font-size: 12px;
925
+ font-weight: 780;
926
+ cursor: pointer;
927
+ opacity: 0;
928
+ pointer-events: none;
929
+ transform: translateY(10px);
930
+ transition: opacity 160ms ease, transform 160ms ease;
931
+ }
932
+ .to-top[data-visible="true"] {
933
+ opacity: 1;
934
+ pointer-events: auto;
935
+ transform: translateY(0);
936
+ }
937
+ .to-top:hover { background: #eff6ff; }
938
+ .to-top:active { transform: translateY(1px); }
939
+ @media (max-width: 980px) {
940
+ .filters, .cards, .grid, .insights-layout, .insight-cards { grid-template-columns: 1fr; }
941
+ main, header { padding-left: 16px; padding-right: 16px; }
942
+ table { font-size: 12px; }
943
+ th, td { padding: 8px; }
944
+ .header-main { flex-direction: column; }
945
+ .header-meta { align-items: flex-start; flex-direction: column; }
946
+ .live-bar { justify-content: flex-start; width: 100%; }
947
+ .detail-section { position: static; max-height: none; }
948
+ .detail { max-height: none; }
949
+ .table-tools { align-items: stretch; grid-template-columns: 1fr; }
950
+ .segmented, .segmented button { width: 100%; }
951
+ .pager, .load-control, .table-actions { justify-content: space-between; width: 100%; }
952
+ .action-status { min-width: 0; }
953
+ .preset-card { grid-template-columns: 1fr; }
954
+ }