descry-codegraph 0.1.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.
@@ -0,0 +1,1791 @@
1
+ /* Descry Explorer - Dark Theme */
2
+
3
+ :root {
4
+ --bg-primary: #0d1117;
5
+ --bg-secondary: #161b22;
6
+ --bg-tertiary: #21262d;
7
+ --bg-hover: #30363d;
8
+ --bg-active: #1f6feb22;
9
+ --border: #30363d;
10
+ --border-active: #1f6feb;
11
+ --text-primary: #e6edf3;
12
+ --text-secondary: #8b949e;
13
+ --text-muted: #484f58;
14
+ --accent: #58a6ff;
15
+ --accent-hover: #79c0ff;
16
+ --green: #3fb950;
17
+ --yellow: #d29922;
18
+ --red: #f85149;
19
+ --orange: #d18616;
20
+ --purple: #bc8cff;
21
+ --font-mono: 'JetBrains Mono', 'Fira Code', 'Cascadia Code', 'SF Mono', Consolas, monospace;
22
+ --font-sans: -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif;
23
+ --sidebar-width: 220px;
24
+ --header-height: 52px;
25
+ --radius: 6px;
26
+ --transition: 150ms ease;
27
+ }
28
+
29
+ * { margin: 0; padding: 0; box-sizing: border-box; }
30
+
31
+ body {
32
+ font-family: var(--font-sans);
33
+ background: var(--bg-primary);
34
+ color: var(--text-primary);
35
+ font-size: 14px;
36
+ line-height: 1.5;
37
+ overflow: hidden;
38
+ height: 100vh;
39
+ }
40
+
41
+ /* --- Header --- */
42
+ .header {
43
+ height: var(--header-height);
44
+ background: var(--bg-secondary);
45
+ border-bottom: 1px solid var(--border);
46
+ display: flex;
47
+ align-items: center;
48
+ padding: 0 16px;
49
+ gap: 16px;
50
+ position: fixed;
51
+ top: 0;
52
+ left: 0;
53
+ right: 0;
54
+ z-index: 100;
55
+ }
56
+
57
+ .header-logo {
58
+ font-size: 15px;
59
+ font-weight: 600;
60
+ color: var(--text-primary);
61
+ white-space: nowrap;
62
+ display: flex;
63
+ align-items: center;
64
+ gap: 8px;
65
+ }
66
+
67
+ .header-logo svg { width: 20px; height: 20px; }
68
+
69
+ .search-bar {
70
+ flex: 1;
71
+ max-width: 600px;
72
+ position: relative;
73
+ }
74
+
75
+ .search-bar input {
76
+ width: 100%;
77
+ padding: 6px 12px 6px 32px;
78
+ background: var(--bg-primary);
79
+ border: 1px solid var(--border);
80
+ border-radius: var(--radius);
81
+ color: var(--text-primary);
82
+ font-size: 14px;
83
+ font-family: var(--font-mono);
84
+ outline: none;
85
+ transition: border-color var(--transition);
86
+ }
87
+
88
+ .search-bar input:focus { border-color: var(--accent); }
89
+ .search-bar input::placeholder { color: var(--text-muted); }
90
+
91
+ .search-bar .search-icon {
92
+ position: absolute;
93
+ left: 10px;
94
+ top: 50%;
95
+ transform: translateY(-50%);
96
+ color: var(--text-muted);
97
+ font-size: 14px;
98
+ }
99
+
100
+ .header-status {
101
+ font-size: 12px;
102
+ color: var(--text-secondary);
103
+ font-family: var(--font-mono);
104
+ white-space: nowrap;
105
+ }
106
+
107
+ .status-dot {
108
+ display: inline-block;
109
+ width: 8px;
110
+ height: 8px;
111
+ border-radius: 50%;
112
+ margin-right: 4px;
113
+ vertical-align: middle;
114
+ }
115
+
116
+ .status-dot.ok { background: var(--green); }
117
+ .status-dot.stale { background: var(--yellow); }
118
+ .status-dot.error { background: var(--red); }
119
+
120
+ /* --- Help Button --- */
121
+ .help-btn {
122
+ width: 32px;
123
+ height: 32px;
124
+ border-radius: 50%;
125
+ border: 1px solid var(--border);
126
+ background: var(--bg-secondary);
127
+ color: var(--text-secondary);
128
+ font-size: 16px;
129
+ font-weight: 700;
130
+ cursor: pointer;
131
+ transition: var(--transition);
132
+ font-family: var(--font-sans);
133
+ }
134
+ .help-btn:hover {
135
+ color: var(--accent);
136
+ border-color: var(--accent);
137
+ }
138
+
139
+ /* --- Encyclopedia Panel --- */
140
+ .ency-overlay {
141
+ position: fixed;
142
+ top: 0; left: 0; right: 0; bottom: 0;
143
+ background: rgba(0,0,0,0.6);
144
+ z-index: 1000;
145
+ display: flex;
146
+ align-items: center;
147
+ justify-content: center;
148
+ }
149
+ .ency-panel {
150
+ background: var(--bg-secondary);
151
+ border: 1px solid var(--border);
152
+ border-radius: var(--radius);
153
+ width: 95vw;
154
+ max-width: 700px;
155
+ max-height: 85vh;
156
+ display: flex;
157
+ flex-direction: column;
158
+ box-shadow: 0 16px 48px rgba(0,0,0,0.4);
159
+ }
160
+
161
+ /* Header */
162
+ .ency-header {
163
+ display: flex;
164
+ align-items: center;
165
+ gap: 8px;
166
+ padding: 12px 16px;
167
+ border-bottom: 1px solid var(--border);
168
+ flex-shrink: 0;
169
+ }
170
+ .ency-back {
171
+ background: none;
172
+ border: 1px solid var(--border);
173
+ border-radius: var(--radius);
174
+ color: var(--text-secondary);
175
+ font-size: 13px;
176
+ padding: 4px 10px;
177
+ cursor: pointer;
178
+ transition: var(--transition);
179
+ font-family: var(--font-sans);
180
+ white-space: nowrap;
181
+ }
182
+ .ency-back:hover { color: var(--accent); border-color: var(--accent); }
183
+ .ency-title {
184
+ font-size: 15px;
185
+ font-weight: 600;
186
+ color: var(--text-primary);
187
+ white-space: nowrap;
188
+ }
189
+ .ency-search {
190
+ flex: 1;
191
+ min-width: 0;
192
+ background: var(--bg-primary);
193
+ border: 1px solid var(--border);
194
+ border-radius: var(--radius);
195
+ color: var(--text-primary);
196
+ font-size: 13px;
197
+ padding: 5px 10px;
198
+ font-family: var(--font-sans);
199
+ outline: none;
200
+ transition: var(--transition);
201
+ }
202
+ .ency-search:focus { border-color: var(--accent); }
203
+ .ency-search::placeholder { color: var(--text-muted); }
204
+ .ency-close {
205
+ background: none;
206
+ border: none;
207
+ color: var(--text-muted);
208
+ font-size: 22px;
209
+ cursor: pointer;
210
+ padding: 0 4px;
211
+ line-height: 1;
212
+ transition: var(--transition);
213
+ }
214
+ .ency-close:hover { color: var(--text-primary); }
215
+
216
+ /* Body (scrollable) */
217
+ .ency-body {
218
+ overflow-y: auto;
219
+ padding: 16px 20px 24px;
220
+ flex: 1;
221
+ min-height: 0;
222
+ }
223
+
224
+ /* TOC */
225
+ .ency-category {
226
+ font-size: 11px;
227
+ font-weight: 700;
228
+ text-transform: uppercase;
229
+ letter-spacing: 0.08em;
230
+ color: var(--text-muted);
231
+ padding: 16px 0 6px;
232
+ }
233
+ .ency-category:first-child { padding-top: 0; }
234
+ .ency-toc-item {
235
+ display: flex;
236
+ align-items: baseline;
237
+ gap: 8px;
238
+ padding: 7px 10px;
239
+ border-radius: var(--radius);
240
+ cursor: pointer;
241
+ transition: var(--transition);
242
+ }
243
+ .ency-toc-item:hover { background: var(--bg-hover); }
244
+ .ency-toc-title {
245
+ font-size: 13px;
246
+ font-weight: 500;
247
+ color: var(--text-primary);
248
+ }
249
+ .ency-toc-desc {
250
+ font-size: 12px;
251
+ color: var(--text-muted);
252
+ white-space: nowrap;
253
+ overflow: hidden;
254
+ text-overflow: ellipsis;
255
+ }
256
+ .ency-no-results {
257
+ text-align: center;
258
+ color: var(--text-muted);
259
+ font-size: 13px;
260
+ padding: 40px 0;
261
+ }
262
+
263
+ /* Article */
264
+ .ency-article h2 {
265
+ font-size: 18px;
266
+ font-weight: 600;
267
+ color: var(--text-primary);
268
+ margin-bottom: 4px;
269
+ }
270
+ .ency-article .ency-oneliner {
271
+ font-size: 13px;
272
+ color: var(--text-secondary);
273
+ margin-bottom: 16px;
274
+ }
275
+ .ency-article h3 {
276
+ font-size: 13px;
277
+ font-weight: 700;
278
+ text-transform: uppercase;
279
+ letter-spacing: 0.05em;
280
+ color: var(--text-muted);
281
+ margin: 16px 0 6px;
282
+ }
283
+ .ency-article table {
284
+ width: 100%;
285
+ font-size: 13px;
286
+ border-collapse: collapse;
287
+ margin-bottom: 8px;
288
+ }
289
+ .ency-article th {
290
+ text-align: left;
291
+ font-weight: 600;
292
+ color: var(--text-secondary);
293
+ padding: 4px 8px;
294
+ border-bottom: 1px solid var(--border);
295
+ }
296
+ .ency-article td {
297
+ padding: 4px 8px;
298
+ color: var(--text-primary);
299
+ border-bottom: 1px solid var(--bg-tertiary);
300
+ }
301
+ .ency-article td:first-child {
302
+ font-family: var(--font-mono);
303
+ font-size: 12px;
304
+ color: var(--accent);
305
+ white-space: nowrap;
306
+ }
307
+ .ency-example {
308
+ background: var(--bg-primary);
309
+ border: 1px solid var(--border);
310
+ border-radius: var(--radius);
311
+ padding: 10px 14px;
312
+ font-size: 13px;
313
+ color: var(--text-secondary);
314
+ margin-bottom: 8px;
315
+ }
316
+ .ency-example code {
317
+ color: var(--accent);
318
+ font-family: var(--font-mono);
319
+ font-size: 12px;
320
+ }
321
+ .ency-tips {
322
+ list-style: none;
323
+ padding: 0;
324
+ }
325
+ .ency-tips li {
326
+ font-size: 13px;
327
+ color: var(--text-secondary);
328
+ padding: 3px 0;
329
+ padding-left: 14px;
330
+ position: relative;
331
+ }
332
+ .ency-tips li::before {
333
+ content: "\2022";
334
+ position: absolute;
335
+ left: 0;
336
+ color: var(--text-muted);
337
+ }
338
+
339
+ /* Symbol legend (concept article) */
340
+ .ency-legend-row {
341
+ display: flex;
342
+ align-items: center;
343
+ gap: 10px;
344
+ padding: 5px 0;
345
+ border-bottom: 1px solid var(--bg-tertiary);
346
+ }
347
+ .ency-legend-row:last-child { border-bottom: none; }
348
+ .ency-legend-name {
349
+ font-size: 13px;
350
+ font-weight: 500;
351
+ color: var(--text-primary);
352
+ width: 100px;
353
+ }
354
+ .ency-legend-desc {
355
+ font-size: 12px;
356
+ color: var(--text-muted);
357
+ }
358
+
359
+ /* Workflow steps */
360
+ .ency-steps {
361
+ display: flex;
362
+ flex-direction: column;
363
+ gap: 6px;
364
+ }
365
+ .ency-step {
366
+ display: flex;
367
+ align-items: baseline;
368
+ gap: 8px;
369
+ font-size: 13px;
370
+ color: var(--text-secondary);
371
+ }
372
+ .ency-step-num {
373
+ font-weight: 700;
374
+ color: var(--accent);
375
+ font-size: 12px;
376
+ flex-shrink: 0;
377
+ }
378
+ .ency-step code {
379
+ color: var(--accent);
380
+ font-family: var(--font-mono);
381
+ font-size: 12px;
382
+ }
383
+
384
+ /* --- Layout --- */
385
+ .layout {
386
+ display: flex;
387
+ height: calc(100vh - var(--header-height));
388
+ margin-top: var(--header-height);
389
+ }
390
+
391
+ /* --- Sidebar --- */
392
+ .sidebar {
393
+ width: var(--sidebar-width);
394
+ background: var(--bg-secondary);
395
+ border-right: 1px solid var(--border);
396
+ overflow-y: auto;
397
+ flex-shrink: 0;
398
+ padding: 8px 0;
399
+ }
400
+
401
+ .sidebar-group {
402
+ margin-bottom: 4px;
403
+ }
404
+
405
+ .sidebar-group-title {
406
+ font-size: 11px;
407
+ font-weight: 600;
408
+ color: var(--text-muted);
409
+ text-transform: uppercase;
410
+ letter-spacing: 0.5px;
411
+ padding: 8px 16px 4px;
412
+ }
413
+
414
+ .sidebar-item {
415
+ display: flex;
416
+ align-items: center;
417
+ gap: 8px;
418
+ padding: 6px 16px;
419
+ color: var(--text-secondary);
420
+ cursor: pointer;
421
+ font-size: 13px;
422
+ transition: all var(--transition);
423
+ border-left: 2px solid transparent;
424
+ }
425
+
426
+ .sidebar-item:hover {
427
+ background: var(--bg-hover);
428
+ color: var(--text-primary);
429
+ }
430
+
431
+ .sidebar-item.active {
432
+ background: var(--bg-active);
433
+ color: var(--accent);
434
+ border-left-color: var(--accent);
435
+ }
436
+
437
+ .sidebar-item .icon {
438
+ width: 16px;
439
+ text-align: center;
440
+ font-size: 12px;
441
+ opacity: 0.7;
442
+ }
443
+
444
+ /* --- Main Content --- */
445
+ .main {
446
+ flex: 1;
447
+ overflow-y: auto;
448
+ padding: 20px 24px;
449
+ display: flex;
450
+ flex-direction: column;
451
+ gap: 16px;
452
+ }
453
+
454
+ /* --- Breadcrumbs --- */
455
+ .breadcrumbs {
456
+ display: flex;
457
+ align-items: center;
458
+ gap: 4px;
459
+ font-size: 12px;
460
+ color: var(--text-secondary);
461
+ flex-wrap: wrap;
462
+ }
463
+
464
+ .breadcrumbs .crumb {
465
+ cursor: pointer;
466
+ color: var(--accent);
467
+ transition: color var(--transition);
468
+ }
469
+
470
+ .breadcrumbs .crumb:hover { color: var(--accent-hover); }
471
+ .breadcrumbs .sep { color: var(--text-muted); }
472
+
473
+ /* --- Tool Forms --- */
474
+ .tool-form {
475
+ background: var(--bg-secondary);
476
+ border: 1px solid var(--border);
477
+ border-radius: var(--radius);
478
+ padding: 16px;
479
+ }
480
+
481
+ .tool-form h3 {
482
+ font-size: 14px;
483
+ font-weight: 600;
484
+ margin-bottom: 12px;
485
+ color: var(--text-primary);
486
+ }
487
+
488
+ .form-row {
489
+ display: flex;
490
+ gap: 12px;
491
+ align-items: flex-end;
492
+ flex-wrap: wrap;
493
+ margin-bottom: 8px;
494
+ }
495
+
496
+ .form-group {
497
+ display: flex;
498
+ flex-direction: column;
499
+ gap: 4px;
500
+ }
501
+
502
+ .form-group.flex-1 { flex: 1; min-width: 200px; }
503
+
504
+ .form-group label {
505
+ font-size: 12px;
506
+ color: var(--text-secondary);
507
+ font-weight: 500;
508
+ }
509
+
510
+ .form-group input,
511
+ .form-group select {
512
+ padding: 6px 10px;
513
+ background: var(--bg-primary);
514
+ border: 1px solid var(--border);
515
+ border-radius: 4px;
516
+ color: var(--text-primary);
517
+ font-size: 13px;
518
+ font-family: var(--font-mono);
519
+ outline: none;
520
+ transition: border-color var(--transition);
521
+ }
522
+
523
+ .form-group input:focus,
524
+ .form-group select:focus {
525
+ border-color: var(--accent);
526
+ }
527
+
528
+ .form-group select { cursor: pointer; }
529
+
530
+ .form-group input[type="checkbox"] {
531
+ width: 16px;
532
+ height: 16px;
533
+ accent-color: var(--accent);
534
+ }
535
+
536
+ .checkbox-row {
537
+ display: flex;
538
+ align-items: center;
539
+ gap: 6px;
540
+ padding-bottom: 2px;
541
+ }
542
+
543
+ .checkbox-row label {
544
+ font-size: 13px;
545
+ cursor: pointer;
546
+ }
547
+
548
+ .btn {
549
+ padding: 6px 16px;
550
+ border-radius: 4px;
551
+ border: 1px solid var(--border);
552
+ font-size: 13px;
553
+ font-weight: 500;
554
+ cursor: pointer;
555
+ transition: all var(--transition);
556
+ white-space: nowrap;
557
+ }
558
+
559
+ .btn-primary {
560
+ background: #238636;
561
+ border-color: rgba(240, 246, 252, 0.1);
562
+ color: #fff;
563
+ }
564
+
565
+ .btn-primary:hover { background: #2ea043; }
566
+
567
+ .btn-secondary {
568
+ background: var(--bg-tertiary);
569
+ color: var(--text-primary);
570
+ }
571
+
572
+ .btn-secondary:hover { background: var(--bg-hover); }
573
+
574
+ .btn:disabled {
575
+ opacity: 0.5;
576
+ cursor: not-allowed;
577
+ }
578
+
579
+ /* --- Results Area --- */
580
+ .results {
581
+ background: var(--bg-secondary);
582
+ border: 1px solid var(--border);
583
+ border-radius: var(--radius);
584
+ min-height: 200px;
585
+ overflow: hidden;
586
+ }
587
+
588
+ .results-header {
589
+ padding: 10px 16px;
590
+ border-bottom: 1px solid var(--border);
591
+ font-size: 12px;
592
+ color: var(--text-secondary);
593
+ display: flex;
594
+ align-items: center;
595
+ justify-content: space-between;
596
+ }
597
+
598
+ .results-body {
599
+ padding: 16px;
600
+ overflow-x: auto;
601
+ }
602
+
603
+ /* --- Result Cards --- */
604
+ .result-card {
605
+ padding: 10px 12px;
606
+ border: 1px solid var(--border);
607
+ border-radius: 4px;
608
+ margin-bottom: 8px;
609
+ cursor: pointer;
610
+ transition: all var(--transition);
611
+ }
612
+
613
+ .result-card:hover {
614
+ border-color: var(--accent);
615
+ background: var(--bg-tertiary);
616
+ }
617
+
618
+ .result-card .rc-header {
619
+ display: flex;
620
+ align-items: center;
621
+ gap: 8px;
622
+ margin-bottom: 4px;
623
+ }
624
+
625
+ .result-card .rc-type {
626
+ font-size: 10px;
627
+ font-weight: 600;
628
+ padding: 1px 6px;
629
+ border-radius: 3px;
630
+ text-transform: uppercase;
631
+ letter-spacing: 0.3px;
632
+ }
633
+
634
+ .rc-type.fun { background: #1f6feb33; color: var(--accent); }
635
+ .rc-type.met { background: #8b5cf633; color: var(--purple); }
636
+ .rc-type.cla { background: #d2992233; color: var(--yellow); }
637
+ .rc-type.con { background: #3fb95033; color: var(--green); }
638
+ .rc-type.fil { background: #484f5833; color: var(--text-secondary); }
639
+ .rc-type.cfg { background: #d1861633; color: var(--orange); }
640
+
641
+ .result-card .rc-name {
642
+ font-family: var(--font-mono);
643
+ font-size: 13px;
644
+ font-weight: 600;
645
+ color: var(--text-primary);
646
+ }
647
+
648
+ .result-card .rc-location {
649
+ font-size: 12px;
650
+ color: var(--text-secondary);
651
+ font-family: var(--font-mono);
652
+ }
653
+
654
+ .result-card .rc-meta {
655
+ font-size: 11px;
656
+ color: var(--text-muted);
657
+ margin-top: 2px;
658
+ }
659
+
660
+ .result-card .rc-signature {
661
+ font-size: 12px;
662
+ color: var(--text-secondary);
663
+ font-family: var(--font-mono);
664
+ margin-top: 4px;
665
+ white-space: nowrap;
666
+ overflow: hidden;
667
+ text-overflow: ellipsis;
668
+ }
669
+
670
+ .result-card .rc-docstring {
671
+ font-size: 12px;
672
+ color: var(--text-muted);
673
+ margin-top: 2px;
674
+ font-style: italic;
675
+ }
676
+
677
+ /* --- Caller/Callee List --- */
678
+ .symbol-list-item {
679
+ display: flex;
680
+ align-items: center;
681
+ gap: 8px;
682
+ padding: 6px 10px;
683
+ border-radius: 4px;
684
+ cursor: pointer;
685
+ font-family: var(--font-mono);
686
+ font-size: 13px;
687
+ color: var(--accent);
688
+ transition: background var(--transition);
689
+ }
690
+
691
+ .symbol-list-item:hover { background: var(--bg-hover); }
692
+
693
+ .symbol-list-item .sl-location {
694
+ font-size: 11px;
695
+ color: var(--text-muted);
696
+ margin-left: auto;
697
+ }
698
+
699
+ /* --- Markdown Rendering --- */
700
+ .markdown-body {
701
+ font-family: var(--font-sans);
702
+ font-size: 14px;
703
+ line-height: 1.6;
704
+ color: var(--text-primary);
705
+ word-wrap: break-word;
706
+ }
707
+
708
+ .markdown-body h1, .markdown-body h2, .markdown-body h3 {
709
+ border-bottom: 1px solid var(--border);
710
+ padding-bottom: 6px;
711
+ margin: 16px 0 8px;
712
+ }
713
+
714
+ .markdown-body h3 { font-size: 15px; border-bottom: none; }
715
+
716
+ .markdown-body p { margin: 8px 0; }
717
+
718
+ .markdown-body code {
719
+ font-family: var(--font-mono);
720
+ font-size: 13px;
721
+ padding: 2px 6px;
722
+ background: var(--bg-tertiary);
723
+ border-radius: 3px;
724
+ }
725
+
726
+ .markdown-body pre {
727
+ background: var(--bg-primary);
728
+ border: 1px solid var(--border);
729
+ border-radius: var(--radius);
730
+ padding: 12px 16px;
731
+ overflow-x: auto;
732
+ margin: 8px 0;
733
+ }
734
+
735
+ .markdown-body pre code {
736
+ padding: 0;
737
+ background: none;
738
+ font-size: 13px;
739
+ line-height: 1.45;
740
+ }
741
+
742
+ .markdown-body strong { color: var(--text-primary); }
743
+ .markdown-body em { color: var(--text-secondary); }
744
+
745
+ .markdown-body ul, .markdown-body ol {
746
+ padding-left: 24px;
747
+ margin: 8px 0;
748
+ }
749
+
750
+ .markdown-body a {
751
+ color: var(--accent);
752
+ text-decoration: none;
753
+ }
754
+
755
+ .markdown-body a:hover { text-decoration: underline; }
756
+
757
+ .markdown-body table {
758
+ border-collapse: collapse;
759
+ width: 100%;
760
+ margin: 8px 0;
761
+ }
762
+ .markdown-body th, .markdown-body td {
763
+ border: 1px solid var(--border);
764
+ padding: 6px 12px;
765
+ text-align: left;
766
+ font-size: 13px;
767
+ }
768
+ .markdown-body th {
769
+ background: var(--bg-tertiary);
770
+ font-weight: 600;
771
+ }
772
+ .markdown-body blockquote {
773
+ border-left: 3px solid var(--accent);
774
+ padding-left: 12px;
775
+ color: var(--text-secondary);
776
+ margin: 8px 0;
777
+ }
778
+ .markdown-body hr {
779
+ border: none;
780
+ border-top: 1px solid var(--border);
781
+ margin: 16px 0;
782
+ }
783
+ .markdown-body img {
784
+ max-width: 100%;
785
+ border-radius: var(--radius);
786
+ }
787
+
788
+ /* --- Doc Result Cards --- */
789
+ .doc-result-card {
790
+ cursor: default;
791
+ }
792
+ .doc-result-card .doc-content {
793
+ margin-top: 8px;
794
+ padding-top: 8px;
795
+ border-top: 1px solid var(--border);
796
+ }
797
+ .doc-result-card .doc-content p:first-child {
798
+ margin-top: 0;
799
+ }
800
+
801
+ /* --- Mermaid Diagrams --- */
802
+ pre.mermaid {
803
+ background: var(--bg-primary);
804
+ border: 1px solid var(--border);
805
+ border-radius: var(--radius);
806
+ padding: 16px;
807
+ overflow-x: auto;
808
+ text-align: center;
809
+ }
810
+ pre.mermaid.mermaid-rendered {
811
+ border-color: var(--accent);
812
+ background: var(--bg-secondary);
813
+ }
814
+ pre.mermaid.mermaid-rendered svg {
815
+ max-width: 100%;
816
+ height: auto;
817
+ }
818
+ pre.mermaid.mermaid-error {
819
+ border-color: var(--yellow);
820
+ color: var(--text-secondary);
821
+ font-family: var(--font-mono);
822
+ font-size: 12px;
823
+ text-align: left;
824
+ white-space: pre-wrap;
825
+ }
826
+
827
+ /* --- Flow Tree --- */
828
+ .flow-tree {
829
+ padding: 12px 16px;
830
+ }
831
+
832
+ .flow-note {
833
+ padding: 8px 16px;
834
+ font-size: 12px;
835
+ color: var(--text-secondary);
836
+ border-bottom: 1px solid var(--border);
837
+ }
838
+
839
+ .flow-alternatives {
840
+ padding: 6px 16px;
841
+ font-size: 12px;
842
+ color: var(--text-secondary);
843
+ border-bottom: 1px solid var(--border);
844
+ display: flex;
845
+ flex-wrap: wrap;
846
+ gap: 4px 12px;
847
+ align-items: center;
848
+ }
849
+
850
+ .flow-alt-label {
851
+ font-weight: 600;
852
+ color: var(--text-secondary);
853
+ }
854
+
855
+ .flow-alt-link {
856
+ color: var(--accent);
857
+ cursor: pointer;
858
+ font-family: var(--font-mono);
859
+ font-size: 11px;
860
+ }
861
+ .flow-alt-link:hover {
862
+ text-decoration: underline;
863
+ }
864
+
865
+ .flow-error {
866
+ padding: 12px 16px;
867
+ color: var(--red);
868
+ font-size: 13px;
869
+ }
870
+
871
+ .tool-notice {
872
+ padding: 16px 20px;
873
+ background: var(--bg-tertiary);
874
+ border: 1px solid var(--border);
875
+ border-radius: var(--radius);
876
+ font-size: 13px;
877
+ color: var(--text-secondary);
878
+ margin: 8px 0;
879
+ }
880
+ .tool-notice strong {
881
+ color: var(--text-primary);
882
+ display: block;
883
+ margin-bottom: 6px;
884
+ }
885
+ .tool-notice p {
886
+ margin: 0;
887
+ line-height: 1.5;
888
+ }
889
+ .tool-notice code {
890
+ color: var(--accent);
891
+ font-family: var(--font-mono);
892
+ font-size: 12px;
893
+ }
894
+
895
+ .flow-empty {
896
+ padding: 24px;
897
+ text-align: center;
898
+ color: var(--text-secondary);
899
+ }
900
+
901
+ /* Node */
902
+ .flow-node {
903
+ position: relative;
904
+ }
905
+
906
+ .flow-node-row {
907
+ display: flex;
908
+ align-items: center;
909
+ gap: 8px;
910
+ padding: 5px 8px;
911
+ border-radius: 4px;
912
+ cursor: pointer;
913
+ transition: background var(--transition);
914
+ min-height: 30px;
915
+ }
916
+
917
+ .flow-node-row:hover {
918
+ background: var(--bg-hover);
919
+ }
920
+
921
+ /* Toggle arrow */
922
+ .flow-toggle {
923
+ width: 16px;
924
+ flex-shrink: 0;
925
+ text-align: center;
926
+ font-size: 12px;
927
+ color: var(--text-secondary);
928
+ transition: transform var(--transition);
929
+ user-select: none;
930
+ }
931
+
932
+ .flow-toggle-leaf {
933
+ color: var(--text-muted);
934
+ font-size: 8px;
935
+ }
936
+
937
+ /* Collapsed state */
938
+ .flow-node.collapsed > .flow-children,
939
+ .flow-node.collapsed > .flow-code {
940
+ display: none;
941
+ }
942
+
943
+ .flow-node.collapsed > .flow-node-row > .flow-toggle:not(.flow-toggle-leaf) {
944
+ transform: rotate(-90deg);
945
+ }
946
+
947
+ /* Function name */
948
+ .flow-fn-name {
949
+ font-family: var(--font-mono);
950
+ font-size: 13px;
951
+ font-weight: 600;
952
+ color: var(--text-primary);
953
+ cursor: pointer;
954
+ white-space: nowrap;
955
+ }
956
+
957
+ .flow-fn-name:hover {
958
+ color: var(--accent);
959
+ text-decoration: underline;
960
+ }
961
+
962
+ /* Token count */
963
+ .flow-tokens {
964
+ font-size: 11px;
965
+ color: var(--text-muted);
966
+ white-space: nowrap;
967
+ flex-shrink: 0;
968
+ }
969
+
970
+ /* File location */
971
+ .flow-file {
972
+ font-family: var(--font-mono);
973
+ font-size: 11px;
974
+ color: var(--text-secondary);
975
+ cursor: pointer;
976
+ white-space: nowrap;
977
+ overflow: hidden;
978
+ text-overflow: ellipsis;
979
+ margin-left: auto;
980
+ }
981
+
982
+ .flow-file:hover {
983
+ color: var(--accent);
984
+ }
985
+
986
+ /* Children container - tree lines */
987
+ .flow-children {
988
+ margin-left: 20px;
989
+ padding-left: 16px;
990
+ border-left: 1px solid var(--border);
991
+ }
992
+
993
+ .flow-children > .flow-node:last-child {
994
+ position: relative;
995
+ }
996
+
997
+ /* Inline code */
998
+ .flow-code {
999
+ margin-left: 36px;
1000
+ margin-bottom: 4px;
1001
+ }
1002
+
1003
+ .flow-code pre {
1004
+ background: var(--bg-primary);
1005
+ border: 1px solid var(--border);
1006
+ border-radius: var(--radius);
1007
+ padding: 8px 12px;
1008
+ overflow-x: auto;
1009
+ margin: 2px 0 6px;
1010
+ font-size: 12px;
1011
+ line-height: 1.4;
1012
+ }
1013
+
1014
+ .flow-code pre code {
1015
+ font-family: var(--font-mono);
1016
+ font-size: 12px;
1017
+ background: none;
1018
+ padding: 0;
1019
+ }
1020
+
1021
+ /* Root node emphasis */
1022
+ .flow-node.flow-root > .flow-node-row {
1023
+ background: var(--bg-active);
1024
+ border: 1px solid var(--border-active);
1025
+ border-radius: 4px;
1026
+ }
1027
+
1028
+ .flow-node.flow-root > .flow-node-row .flow-fn-name {
1029
+ color: var(--accent);
1030
+ }
1031
+
1032
+ /* --- Changes Impact --- */
1033
+ .changes-header {
1034
+ display: flex;
1035
+ align-items: center;
1036
+ justify-content: space-between;
1037
+ padding: 12px 16px;
1038
+ border-bottom: 1px solid var(--border);
1039
+ }
1040
+
1041
+ .changes-range {
1042
+ font-family: var(--font-mono);
1043
+ font-size: 14px;
1044
+ font-weight: 600;
1045
+ color: var(--text-primary);
1046
+ }
1047
+
1048
+ .changes-meta {
1049
+ font-size: 12px;
1050
+ color: var(--text-secondary);
1051
+ }
1052
+
1053
+ .changes-sep {
1054
+ margin: 0 6px;
1055
+ color: var(--text-muted);
1056
+ }
1057
+
1058
+ .changes-section-title {
1059
+ padding: 8px 16px;
1060
+ font-size: 12px;
1061
+ font-weight: 600;
1062
+ color: var(--text-secondary);
1063
+ text-transform: uppercase;
1064
+ letter-spacing: 0.5px;
1065
+ border-bottom: 1px solid var(--border);
1066
+ background: var(--bg-secondary);
1067
+ }
1068
+
1069
+ /* Symbol entries */
1070
+ .changes-symbol {
1071
+ border-bottom: 1px solid var(--border);
1072
+ }
1073
+
1074
+ .changes-symbol:last-child {
1075
+ border-bottom: none;
1076
+ }
1077
+
1078
+ .changes-symbol-row {
1079
+ display: flex;
1080
+ align-items: center;
1081
+ gap: 8px;
1082
+ padding: 8px 16px;
1083
+ transition: background var(--transition);
1084
+ }
1085
+
1086
+ .changes-symbol-row:hover {
1087
+ background: var(--bg-hover);
1088
+ }
1089
+
1090
+ .changes-sym-name {
1091
+ font-family: var(--font-mono);
1092
+ font-size: 13px;
1093
+ font-weight: 600;
1094
+ color: var(--text-primary);
1095
+ cursor: pointer;
1096
+ white-space: nowrap;
1097
+ }
1098
+
1099
+ .changes-sym-name:hover {
1100
+ color: var(--accent);
1101
+ text-decoration: underline;
1102
+ }
1103
+
1104
+ .changes-diff-stat {
1105
+ display: flex;
1106
+ gap: 6px;
1107
+ font-family: var(--font-mono);
1108
+ font-size: 12px;
1109
+ white-space: nowrap;
1110
+ flex-shrink: 0;
1111
+ }
1112
+
1113
+ .changes-added {
1114
+ color: var(--green);
1115
+ }
1116
+
1117
+ .changes-removed {
1118
+ color: var(--red);
1119
+ }
1120
+
1121
+ .changes-sym-file {
1122
+ font-family: var(--font-mono);
1123
+ font-size: 11px;
1124
+ color: var(--text-secondary);
1125
+ cursor: pointer;
1126
+ white-space: nowrap;
1127
+ overflow: hidden;
1128
+ text-overflow: ellipsis;
1129
+ margin-left: auto;
1130
+ }
1131
+
1132
+ .changes-sym-file:hover {
1133
+ color: var(--accent);
1134
+ }
1135
+
1136
+ /* Callers row */
1137
+ .changes-callers {
1138
+ display: flex;
1139
+ flex-wrap: wrap;
1140
+ align-items: center;
1141
+ gap: 4px 8px;
1142
+ padding: 2px 16px 8px 44px;
1143
+ font-size: 12px;
1144
+ }
1145
+
1146
+ .changes-callers-label {
1147
+ color: var(--text-muted);
1148
+ font-size: 11px;
1149
+ }
1150
+
1151
+ .changes-caller {
1152
+ font-family: var(--font-mono);
1153
+ font-size: 11px;
1154
+ color: var(--text-secondary);
1155
+ cursor: pointer;
1156
+ padding: 1px 6px;
1157
+ border-radius: 3px;
1158
+ background: var(--bg-secondary);
1159
+ border: 1px solid var(--border);
1160
+ transition: all var(--transition);
1161
+ }
1162
+
1163
+ .changes-caller:hover {
1164
+ color: var(--accent);
1165
+ border-color: var(--accent);
1166
+ }
1167
+
1168
+ .changes-callers-more {
1169
+ font-size: 11px;
1170
+ color: var(--text-muted);
1171
+ }
1172
+
1173
+ /* File-only fallback */
1174
+ .changes-file-row {
1175
+ display: flex;
1176
+ align-items: center;
1177
+ justify-content: space-between;
1178
+ padding: 6px 16px;
1179
+ border-bottom: 1px solid var(--border);
1180
+ }
1181
+
1182
+ .changes-file-row:last-child {
1183
+ border-bottom: none;
1184
+ }
1185
+
1186
+ .changes-file-path {
1187
+ font-family: var(--font-mono);
1188
+ font-size: 12px;
1189
+ color: var(--text-secondary);
1190
+ cursor: pointer;
1191
+ }
1192
+
1193
+ .changes-file-path:hover {
1194
+ color: var(--accent);
1195
+ }
1196
+
1197
+ /* --- Churn --- */
1198
+ .churn-list {
1199
+ max-height: 700px;
1200
+ overflow-y: auto;
1201
+ }
1202
+
1203
+ .churn-item {
1204
+ display: flex;
1205
+ align-items: center;
1206
+ gap: 8px;
1207
+ padding: 7px 16px;
1208
+ border-bottom: 1px solid var(--border);
1209
+ transition: background var(--transition);
1210
+ }
1211
+
1212
+ .churn-item:last-child {
1213
+ border-bottom: none;
1214
+ }
1215
+
1216
+ .churn-item:hover {
1217
+ background: var(--bg-hover);
1218
+ }
1219
+
1220
+ .churn-rank {
1221
+ font-size: 12px;
1222
+ font-weight: 600;
1223
+ color: var(--text-muted);
1224
+ min-width: 24px;
1225
+ text-align: right;
1226
+ flex-shrink: 0;
1227
+ }
1228
+
1229
+ .churn-commits {
1230
+ font-family: var(--font-mono);
1231
+ font-size: 11px;
1232
+ color: var(--text-secondary);
1233
+ white-space: nowrap;
1234
+ flex-shrink: 0;
1235
+ padding: 2px 8px;
1236
+ border-radius: 3px;
1237
+ background: var(--bg-secondary);
1238
+ }
1239
+
1240
+ .churn-file-name {
1241
+ font-family: var(--font-mono);
1242
+ font-size: 13px;
1243
+ color: var(--text-primary);
1244
+ cursor: pointer;
1245
+ overflow: hidden;
1246
+ text-overflow: ellipsis;
1247
+ white-space: nowrap;
1248
+ }
1249
+
1250
+ .churn-file-name:hover {
1251
+ color: var(--accent);
1252
+ text-decoration: underline;
1253
+ }
1254
+
1255
+ /* Co-change pairs */
1256
+ .churn-pair {
1257
+ display: flex;
1258
+ align-items: center;
1259
+ gap: 8px;
1260
+ padding: 8px 16px;
1261
+ border-bottom: 1px solid var(--border);
1262
+ transition: background var(--transition);
1263
+ }
1264
+
1265
+ .churn-pair:last-child {
1266
+ border-bottom: none;
1267
+ }
1268
+
1269
+ .churn-pair:hover {
1270
+ background: var(--bg-hover);
1271
+ }
1272
+
1273
+ .churn-pair-sym {
1274
+ font-family: var(--font-mono);
1275
+ font-size: 12px;
1276
+ color: var(--text-primary);
1277
+ overflow: hidden;
1278
+ text-overflow: ellipsis;
1279
+ white-space: nowrap;
1280
+ }
1281
+
1282
+ .churn-pair-sym.clickable {
1283
+ cursor: pointer;
1284
+ }
1285
+
1286
+ .churn-pair-sym.clickable:hover {
1287
+ color: var(--accent);
1288
+ text-decoration: underline;
1289
+ }
1290
+
1291
+ .churn-pair-arrow {
1292
+ color: var(--text-muted);
1293
+ font-size: 14px;
1294
+ flex-shrink: 0;
1295
+ }
1296
+
1297
+ /* --- Cross-Language Trace --- */
1298
+
1299
+ /* Endpoint detail view */
1300
+ .cl-endpoint-detail {
1301
+ padding: 12px 0;
1302
+ }
1303
+
1304
+ .cl-row {
1305
+ display: flex;
1306
+ align-items: baseline;
1307
+ padding: 6px 16px;
1308
+ gap: 12px;
1309
+ }
1310
+
1311
+ .cl-row:hover {
1312
+ background: var(--bg-hover);
1313
+ }
1314
+
1315
+ .cl-label {
1316
+ font-size: 12px;
1317
+ font-weight: 600;
1318
+ color: var(--text-secondary);
1319
+ min-width: 80px;
1320
+ flex-shrink: 0;
1321
+ }
1322
+
1323
+ .cl-value {
1324
+ font-size: 13px;
1325
+ color: var(--text-primary);
1326
+ display: flex;
1327
+ align-items: center;
1328
+ gap: 8px;
1329
+ flex-wrap: wrap;
1330
+ }
1331
+
1332
+ .cl-mono {
1333
+ font-family: var(--font-mono);
1334
+ font-size: 12px;
1335
+ }
1336
+
1337
+ .cl-no-handler {
1338
+ color: var(--text-muted);
1339
+ font-style: italic;
1340
+ }
1341
+
1342
+ /* Tags */
1343
+ .cl-tag {
1344
+ display: inline-block;
1345
+ font-size: 11px;
1346
+ font-family: var(--font-mono);
1347
+ padding: 2px 8px;
1348
+ border-radius: 3px;
1349
+ background: var(--bg-secondary);
1350
+ border: 1px solid var(--border);
1351
+ color: var(--text-secondary);
1352
+ cursor: pointer;
1353
+ transition: all var(--transition);
1354
+ }
1355
+
1356
+ .cl-tag:hover {
1357
+ color: var(--accent);
1358
+ border-color: var(--accent);
1359
+ }
1360
+
1361
+ /* Handler name and file */
1362
+ .cl-handler-name {
1363
+ font-family: var(--font-mono);
1364
+ font-size: 13px;
1365
+ font-weight: 600;
1366
+ color: var(--accent);
1367
+ cursor: pointer;
1368
+ }
1369
+
1370
+ .cl-handler-name:hover {
1371
+ text-decoration: underline;
1372
+ }
1373
+
1374
+ .cl-handler-file {
1375
+ font-family: var(--font-mono);
1376
+ font-size: 11px;
1377
+ color: var(--text-secondary);
1378
+ cursor: pointer;
1379
+ }
1380
+
1381
+ .cl-handler-file:hover {
1382
+ color: var(--accent);
1383
+ }
1384
+
1385
+ /* Action buttons */
1386
+ .cl-actions {
1387
+ display: flex;
1388
+ gap: 8px;
1389
+ padding: 12px 16px;
1390
+ border-top: 1px solid var(--border);
1391
+ margin-top: 4px;
1392
+ }
1393
+
1394
+ /* Endpoint list */
1395
+ .cl-endpoint-list {
1396
+ max-height: 600px;
1397
+ overflow-y: auto;
1398
+ }
1399
+
1400
+ .cl-endpoint-item {
1401
+ display: flex;
1402
+ align-items: center;
1403
+ gap: 10px;
1404
+ padding: 8px 16px;
1405
+ border-bottom: 1px solid var(--border);
1406
+ cursor: pointer;
1407
+ transition: background var(--transition);
1408
+ }
1409
+
1410
+ .cl-endpoint-item:last-child {
1411
+ border-bottom: none;
1412
+ }
1413
+
1414
+ .cl-endpoint-item:hover {
1415
+ background: var(--bg-hover);
1416
+ }
1417
+
1418
+ /* Method badges */
1419
+ .cl-method-badge {
1420
+ font-family: var(--font-mono);
1421
+ font-size: 11px;
1422
+ font-weight: 700;
1423
+ padding: 2px 6px;
1424
+ border-radius: 3px;
1425
+ min-width: 52px;
1426
+ text-align: center;
1427
+ flex-shrink: 0;
1428
+ }
1429
+
1430
+ .method-get { background: rgba(59, 130, 246, 0.15); color: #60a5fa; }
1431
+ .method-post { background: rgba(34, 197, 94, 0.15); color: #4ade80; }
1432
+ .method-put { background: rgba(245, 158, 11, 0.15); color: #fbbf24; }
1433
+ .method-delete { background: rgba(239, 68, 68, 0.15); color: #f87171; }
1434
+ .method-patch { background: rgba(168, 85, 247, 0.15); color: #c084fc; }
1435
+
1436
+ .cl-ep-path {
1437
+ font-family: var(--font-mono);
1438
+ font-size: 13px;
1439
+ color: var(--text-primary);
1440
+ white-space: nowrap;
1441
+ }
1442
+
1443
+ .cl-ep-summary {
1444
+ font-size: 12px;
1445
+ color: var(--text-secondary);
1446
+ overflow: hidden;
1447
+ text-overflow: ellipsis;
1448
+ white-space: nowrap;
1449
+ flex: 1;
1450
+ }
1451
+
1452
+ .cl-ep-handler {
1453
+ font-family: var(--font-mono);
1454
+ font-size: 11px;
1455
+ color: var(--text-muted);
1456
+ margin-left: auto;
1457
+ white-space: nowrap;
1458
+ flex-shrink: 0;
1459
+ }
1460
+
1461
+ /* Stats cards */
1462
+ .cl-stats {
1463
+ display: flex;
1464
+ gap: 16px;
1465
+ padding: 24px 16px;
1466
+ }
1467
+
1468
+ .cl-stat-card {
1469
+ flex: 1;
1470
+ text-align: center;
1471
+ padding: 16px;
1472
+ background: var(--bg-secondary);
1473
+ border: 1px solid var(--border);
1474
+ border-radius: var(--radius);
1475
+ }
1476
+
1477
+ .cl-stat-value {
1478
+ font-size: 28px;
1479
+ font-weight: 700;
1480
+ color: var(--accent);
1481
+ font-family: var(--font-mono);
1482
+ }
1483
+
1484
+ .cl-stat-label {
1485
+ font-size: 12px;
1486
+ color: var(--text-secondary);
1487
+ margin-top: 4px;
1488
+ }
1489
+
1490
+ /* --- Source Viewer --- */
1491
+ .source-viewer {
1492
+ background: var(--bg-primary);
1493
+ border: 1px solid var(--border);
1494
+ border-radius: var(--radius);
1495
+ overflow: hidden;
1496
+ }
1497
+
1498
+ .source-header {
1499
+ padding: 8px 16px;
1500
+ background: var(--bg-secondary);
1501
+ border-bottom: 1px solid var(--border);
1502
+ font-family: var(--font-mono);
1503
+ font-size: 12px;
1504
+ color: var(--text-secondary);
1505
+ display: flex;
1506
+ align-items: center;
1507
+ justify-content: space-between;
1508
+ }
1509
+
1510
+ .source-content {
1511
+ overflow: auto;
1512
+ max-height: 600px;
1513
+ }
1514
+
1515
+ .source-content pre {
1516
+ margin: 0;
1517
+ padding: 12px 0;
1518
+ }
1519
+
1520
+ .source-content table {
1521
+ border-collapse: collapse;
1522
+ width: 100%;
1523
+ }
1524
+
1525
+ .source-content .line-number {
1526
+ text-align: right;
1527
+ padding: 0 12px 0 16px;
1528
+ color: var(--text-muted);
1529
+ user-select: none;
1530
+ white-space: nowrap;
1531
+ font-family: var(--font-mono);
1532
+ font-size: 12px;
1533
+ vertical-align: top;
1534
+ }
1535
+
1536
+ .source-content .line-code {
1537
+ padding: 0 16px 0 8px;
1538
+ font-family: var(--font-mono);
1539
+ font-size: 13px;
1540
+ white-space: pre;
1541
+ line-height: 1.5;
1542
+ }
1543
+
1544
+ .source-content tr.highlight {
1545
+ background: #1f6feb22;
1546
+ }
1547
+
1548
+ .source-markdown {
1549
+ padding: 16px 24px;
1550
+ overflow: auto;
1551
+ max-height: 700px;
1552
+ }
1553
+
1554
+ /* --- Loading/Empty States --- */
1555
+ .loading {
1556
+ display: flex;
1557
+ align-items: center;
1558
+ justify-content: center;
1559
+ padding: 40px;
1560
+ color: var(--text-secondary);
1561
+ gap: 10px;
1562
+ }
1563
+
1564
+ .spinner {
1565
+ width: 18px;
1566
+ height: 18px;
1567
+ border: 2px solid var(--border);
1568
+ border-top-color: var(--accent);
1569
+ border-radius: 50%;
1570
+ animation: spin 0.8s linear infinite;
1571
+ }
1572
+
1573
+ @keyframes spin { to { transform: rotate(360deg); } }
1574
+
1575
+ /* --- Welcome Screen --- */
1576
+ .welcome-screen {
1577
+ display: flex;
1578
+ flex-direction: column;
1579
+ align-items: center;
1580
+ justify-content: center;
1581
+ flex: 1;
1582
+ padding: 40px 20px;
1583
+ color: var(--text-muted);
1584
+ }
1585
+
1586
+ .welcome-screen .es-icon {
1587
+ font-size: 32px;
1588
+ margin-bottom: 12px;
1589
+ opacity: 0.5;
1590
+ }
1591
+
1592
+ .welcome-screen .es-title {
1593
+ font-size: 18px;
1594
+ font-weight: 600;
1595
+ color: var(--text-secondary);
1596
+ margin-bottom: 4px;
1597
+ }
1598
+
1599
+ .welcome-screen .es-subtitle {
1600
+ font-size: 13px;
1601
+ margin-bottom: 8px;
1602
+ }
1603
+
1604
+ /* --- Empty state (for no-results within tools) --- */
1605
+ .empty-state {
1606
+ text-align: center;
1607
+ padding: 40px 20px;
1608
+ color: var(--text-muted);
1609
+ }
1610
+
1611
+ .empty-state .es-title {
1612
+ font-size: 14px;
1613
+ color: var(--text-secondary);
1614
+ }
1615
+
1616
+ /* --- Mermaid Diagrams --- */
1617
+ .mermaid-container {
1618
+ background: var(--bg-primary);
1619
+ border: 1px solid var(--border);
1620
+ border-radius: var(--radius);
1621
+ padding: 16px;
1622
+ overflow-x: auto;
1623
+ margin: 8px 0;
1624
+ }
1625
+
1626
+ .mermaid-container svg {
1627
+ max-width: 100%;
1628
+ }
1629
+
1630
+ /* --- Chart Container --- */
1631
+ .chart-container {
1632
+ background: var(--bg-primary);
1633
+ border: 1px solid var(--border);
1634
+ border-radius: var(--radius);
1635
+ padding: 16px;
1636
+ margin: 8px 0;
1637
+ }
1638
+
1639
+ /* --- Error Banner --- */
1640
+ .error-banner {
1641
+ padding: 10px 16px;
1642
+ background: #f8514922;
1643
+ border: 1px solid #f8514955;
1644
+ border-radius: var(--radius);
1645
+ color: var(--red);
1646
+ font-size: 13px;
1647
+ }
1648
+
1649
+ /* --- Scrollbar Styling --- */
1650
+ ::-webkit-scrollbar {
1651
+ width: 8px;
1652
+ height: 8px;
1653
+ }
1654
+
1655
+ ::-webkit-scrollbar-track { background: transparent; }
1656
+
1657
+ ::-webkit-scrollbar-thumb {
1658
+ background: var(--bg-hover);
1659
+ border-radius: 4px;
1660
+ }
1661
+
1662
+ ::-webkit-scrollbar-thumb:hover { background: var(--text-muted); }
1663
+
1664
+ /* --- Tool Descriptions --- */
1665
+ .tool-desc {
1666
+ color: var(--text-secondary);
1667
+ font-size: 13px;
1668
+ margin: -4px 0 12px 0;
1669
+ line-height: 1.5;
1670
+ }
1671
+
1672
+ /* --- Input Hints (inline suggestions below inputs) --- */
1673
+ .input-hints {
1674
+ font-size: 11px;
1675
+ color: var(--text-muted);
1676
+ margin-top: 4px;
1677
+ line-height: 1.6;
1678
+ }
1679
+
1680
+ .input-hints a {
1681
+ color: var(--text-secondary);
1682
+ cursor: pointer;
1683
+ text-decoration: none;
1684
+ font-family: var(--font-mono);
1685
+ font-size: 11px;
1686
+ transition: color var(--transition);
1687
+ }
1688
+
1689
+ .input-hints a:hover {
1690
+ color: var(--accent);
1691
+ text-decoration: underline;
1692
+ }
1693
+
1694
+ .input-hints a + a::before {
1695
+ content: "\00b7";
1696
+ margin: 0 5px;
1697
+ color: var(--text-muted);
1698
+ text-decoration: none;
1699
+ display: inline-block;
1700
+ }
1701
+
1702
+ /* --- Welcome Screen Scenarios --- */
1703
+ .welcome-scenarios {
1704
+ display: grid;
1705
+ grid-template-columns: repeat(3, 1fr);
1706
+ gap: 12px;
1707
+ margin-top: 24px;
1708
+ width: 100%;
1709
+ max-width: 820px;
1710
+ }
1711
+
1712
+ .scenario-card {
1713
+ background: var(--bg-card);
1714
+ border: 1px solid var(--border);
1715
+ border-radius: 8px;
1716
+ padding: 16px;
1717
+ cursor: pointer;
1718
+ transition: all 0.15s;
1719
+ }
1720
+
1721
+ .scenario-card:hover {
1722
+ border-color: var(--accent);
1723
+ background: var(--bg-hover);
1724
+ }
1725
+
1726
+ .sc-title {
1727
+ font-weight: 600;
1728
+ font-size: 14px;
1729
+ color: var(--text-primary);
1730
+ margin-bottom: 4px;
1731
+ }
1732
+
1733
+ .sc-desc {
1734
+ font-size: 12px;
1735
+ color: var(--text-muted);
1736
+ line-height: 1.4;
1737
+ }
1738
+
1739
+ .sc-desc code {
1740
+ font-family: var(--font-mono);
1741
+ background: var(--bg-hover);
1742
+ padding: 1px 4px;
1743
+ border-radius: 3px;
1744
+ color: var(--accent);
1745
+ font-size: 11px;
1746
+ }
1747
+
1748
+ /* --- Reindex Output --- */
1749
+ .reindex-output {
1750
+ background: var(--bg-primary);
1751
+ border: 1px solid var(--border);
1752
+ border-radius: var(--radius);
1753
+ overflow: hidden;
1754
+ }
1755
+
1756
+ .reindex-header {
1757
+ padding: 8px 16px;
1758
+ background: var(--bg-secondary);
1759
+ border-bottom: 1px solid var(--border);
1760
+ font-size: 12px;
1761
+ color: var(--text-secondary);
1762
+ display: flex;
1763
+ align-items: center;
1764
+ justify-content: space-between;
1765
+ }
1766
+
1767
+ .reindex-log {
1768
+ max-height: 500px;
1769
+ overflow-y: auto;
1770
+ padding: 12px 16px;
1771
+ font-family: var(--font-mono);
1772
+ font-size: 12px;
1773
+ line-height: 1.6;
1774
+ }
1775
+
1776
+ .reindex-line {
1777
+ white-space: pre-wrap;
1778
+ word-break: break-all;
1779
+ }
1780
+
1781
+ .reindex-line.output { color: var(--text-secondary); }
1782
+ .reindex-line.info { color: var(--text-muted); }
1783
+ .reindex-line.error { color: var(--red); }
1784
+ .reindex-line.success { color: var(--green); font-weight: 600; }
1785
+
1786
+ /* --- Responsive --- */
1787
+ @media (max-width: 768px) {
1788
+ .sidebar { display: none; }
1789
+ .header-logo span { display: none; }
1790
+ .welcome-scenarios { grid-template-columns: 1fr 1fr; }
1791
+ }