neoagent 1.4.1 → 1.4.3

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.
@@ -14,62 +14,117 @@
14
14
  --bg-4: #1e1e32;
15
15
  --bg-5: #262640;
16
16
 
17
- /* legacy compat */
18
- --bg-primary: var(--bg-0);
17
+ /* contextual aliases */
18
+ --bg-primary: var(--bg-0);
19
19
  --bg-secondary: var(--bg-1);
20
- --bg-tertiary: var(--bg-2);
21
- --bg-card: var(--bg-3);
22
- --bg-hover: var(--bg-5);
23
- --bg-input: var(--bg-1);
20
+ --bg-tertiary: var(--bg-2);
21
+ --bg-card: var(--bg-3);
22
+ --bg-hover: var(--bg-5);
23
+ --bg-input: var(--bg-1);
24
+ --bg-modal: rgba(14, 14, 26, .96);
25
+ --bg-toast: rgba(18, 18, 32, .92);
26
+ --bg-logs: rgba(5, 10, 18, .8);
24
27
 
25
28
  /* borders */
26
- --border: rgba(255,255,255,.07);
27
- --border-light: rgba(255,255,255,.13);
29
+ --border: rgba(255, 255, 255, .07);
30
+ --border-light: rgba(255, 255, 255, .13);
28
31
 
29
32
  /* text */
30
- --text-primary: #eaeaf4;
33
+ --text-primary: #eaeaf4;
31
34
  --text-secondary: #8080a8;
32
- --text-muted: #4d4d6a;
35
+ --text-muted: #4d4d6a;
33
36
 
34
37
  /* accent */
35
- --accent: #6366f1;
38
+ --accent: #6366f1;
36
39
  --accent-hover: #818cf8;
37
- --accent-dim: rgba(99,102,241,.12);
38
- --accent-glow: rgba(99,102,241,.28);
39
- --accent-muted: rgba(99,102,241,.15);
40
+ --accent-dim: rgba(99, 102, 241, .12);
41
+ --accent-glow: rgba(99, 102, 241, .28);
42
+ --accent-muted: rgba(99, 102, 241, .15);
40
43
 
41
44
  /* semantic */
42
45
  --success: #22c55e;
43
46
  --warning: #f59e0b;
44
- --error: #ef4444;
45
- --info: #3b82f6;
47
+ --error: #ef4444;
48
+ --info: #3b82f6;
46
49
 
47
50
  /* layout */
48
51
  --sidebar-width: 220px;
49
52
  --header-height: 56px;
50
53
 
51
54
  /* shape */
52
- --radius: 8px;
55
+ --radius: 8px;
53
56
  --radius-lg: 14px;
54
57
  --radius-xl: 20px;
55
58
 
56
59
  /* shadow */
57
- --shadow-sm: 0 2px 8px rgba(0,0,0,.35);
58
- --shadow: 0 8px 32px rgba(0,0,0,.5);
59
- --shadow-lg: 0 20px 60px rgba(0,0,0,.6);
60
+ --shadow-sm: 0 2px 8px rgba(0, 0, 0, .35);
61
+ --shadow: 0 8px 32px rgba(0, 0, 0, .5);
62
+ --shadow-lg: 0 20px 60px rgba(0, 0, 0, .6);
60
63
 
61
64
  /* motion */
62
- --ease-out: cubic-bezier(.16,1,.3,1);
63
- --ease-in: cubic-bezier(.7,0,.84,0);
64
- --t-fast: 100ms;
65
- --t-mid: 200ms;
66
- --t-slow: 360ms;
65
+ --ease-out: cubic-bezier(.16, 1, .3, 1);
66
+ --ease-in: cubic-bezier(.7, 0, .84, 0);
67
+ --t-fast: 100ms;
68
+ --t-mid: 200ms;
69
+ --t-slow: 360ms;
67
70
  --transition: var(--t-mid) var(--ease-out);
71
+
72
+ color-scheme: dark;
68
73
  }
69
74
 
70
- *, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
75
+ [data-theme="light"] {
76
+ /* backgrounds */
77
+ --bg-0: #f5f5fa;
78
+ --bg-1: #eeeef6;
79
+ --bg-2: #e5e5f0;
80
+ --bg-3: #dcdcec;
81
+ --bg-4: #d0d0e0;
82
+ --bg-5: #c8c8da;
83
+
84
+ --bg-primary: var(--bg-0);
85
+ --bg-secondary: var(--bg-1);
86
+ --bg-tertiary: var(--bg-2);
87
+ --bg-card: var(--bg-3);
88
+ --bg-hover: var(--bg-5);
89
+ --bg-input: var(--bg-1);
90
+ --bg-modal: rgba(240, 240, 250, .97);
91
+ --bg-toast: rgba(235, 235, 248, .95);
92
+ --bg-logs: rgba(228, 228, 240, .9);
93
+
94
+ /* borders */
95
+ --border: rgba(0, 0, 0, .08);
96
+ --border-light: rgba(0, 0, 0, .15);
97
+
98
+ /* text */
99
+ --text-primary: #1a1a2e;
100
+ --text-secondary: #4a4a6a;
101
+ --text-muted: #8080a0;
102
+
103
+ /* accent — same hue, keep brand consistent */
104
+ --accent: #5254cc;
105
+ --accent-hover: #6366f1;
106
+ --accent-dim: rgba(82, 84, 204, .12);
107
+ --accent-glow: rgba(82, 84, 204, .22);
108
+ --accent-muted: rgba(82, 84, 204, .12);
109
+
110
+ /* shadow — lighter for light mode */
111
+ --shadow-sm: 0 2px 8px rgba(0, 0, 0, .08);
112
+ --shadow: 0 8px 32px rgba(0, 0, 0, .12);
113
+ --shadow-lg: 0 20px 60px rgba(0, 0, 0, .18);
71
114
 
72
- html, body {
115
+ color-scheme: light;
116
+ }
117
+
118
+ *,
119
+ *::before,
120
+ *::after {
121
+ margin: 0;
122
+ padding: 0;
123
+ box-sizing: border-box;
124
+ }
125
+
126
+ html,
127
+ body {
73
128
  height: 100%;
74
129
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif;
75
130
  background: var(--bg-0);
@@ -80,10 +135,19 @@ html, body {
80
135
  -moz-osx-font-smoothing: grayscale;
81
136
  }
82
137
 
83
- a { color: var(--accent); text-decoration: none; }
84
- a:hover { color: var(--accent-hover); }
138
+ a {
139
+ color: var(--accent);
140
+ text-decoration: none;
141
+ }
142
+
143
+ a:hover {
144
+ color: var(--accent-hover);
145
+ }
85
146
 
86
- button, input, textarea, select {
147
+ button,
148
+ input,
149
+ textarea,
150
+ select {
87
151
  font-family: inherit;
88
152
  font-size: inherit;
89
153
  color: inherit;
@@ -94,10 +158,23 @@ button, input, textarea, select {
94
158
  color: white;
95
159
  }
96
160
 
97
- ::-webkit-scrollbar { width: 4px; height: 4px; }
98
- ::-webkit-scrollbar-track { background: transparent; }
99
- ::-webkit-scrollbar-thumb { background: rgba(255,255,255,.1); border-radius: 99px; }
100
- ::-webkit-scrollbar-thumb:hover { background: rgba(255,255,255,.2); }
161
+ ::-webkit-scrollbar {
162
+ width: 4px;
163
+ height: 4px;
164
+ }
165
+
166
+ ::-webkit-scrollbar-track {
167
+ background: transparent;
168
+ }
169
+
170
+ ::-webkit-scrollbar-thumb {
171
+ background: rgba(255, 255, 255, .1);
172
+ border-radius: 99px;
173
+ }
174
+
175
+ ::-webkit-scrollbar-thumb:hover {
176
+ background: rgba(255, 255, 255, .2);
177
+ }
101
178
 
102
179
  /* ── Buttons ── */
103
180
 
@@ -116,33 +193,44 @@ button, input, textarea, select {
116
193
  user-select: none;
117
194
  position: relative;
118
195
  }
119
- .btn:active { transform: scale(.96); }
196
+
197
+ .btn:active {
198
+ transform: scale(.96);
199
+ }
120
200
 
121
201
  .btn-primary {
122
202
  background: var(--accent);
123
203
  color: white;
124
204
  border-color: var(--accent);
125
- box-shadow: 0 2px 10px rgba(99,102,241,.3);
205
+ box-shadow: 0 2px 10px rgba(99, 102, 241, .3);
126
206
  }
207
+
127
208
  .btn-primary:hover {
128
209
  background: var(--accent-hover);
129
210
  border-color: var(--accent-hover);
130
- box-shadow: 0 4px 18px rgba(99,102,241,.45);
211
+ box-shadow: 0 4px 18px rgba(99, 102, 241, .45);
131
212
  }
132
213
 
133
214
  .btn-secondary {
134
- background: rgba(255,255,255,.04);
215
+ background: rgba(255, 255, 255, .04);
135
216
  color: var(--text-primary);
136
217
  border-color: var(--border);
137
218
  }
138
- .btn-secondary:hover { background: rgba(255,255,255,.08); border-color: var(--border-light); }
219
+
220
+ .btn-secondary:hover {
221
+ background: rgba(255, 255, 255, .08);
222
+ border-color: var(--border-light);
223
+ }
139
224
 
140
225
  .btn-danger {
141
226
  background: transparent;
142
227
  color: var(--error);
143
228
  border-color: var(--error);
144
229
  }
145
- .btn-danger:hover { background: rgba(239, 68, 68, 0.1); }
230
+
231
+ .btn-danger:hover {
232
+ background: rgba(239, 68, 68, 0.1);
233
+ }
146
234
 
147
235
  .btn-ghost {
148
236
  background: transparent;
@@ -150,16 +238,32 @@ button, input, textarea, select {
150
238
  border: none;
151
239
  padding: 6px 10px;
152
240
  }
153
- .btn-ghost:hover { color: var(--text-primary); background: rgba(255,255,255,.06); }
154
241
 
155
- .btn-sm { padding: 4px 10px; font-size: 12px; }
156
- .btn-lg { padding: 12px 24px; font-size: 15px; }
242
+ .btn-ghost:hover {
243
+ color: var(--text-primary);
244
+ background: rgba(255, 255, 255, .06);
245
+ }
246
+
247
+ .btn-sm {
248
+ padding: 4px 10px;
249
+ font-size: 12px;
250
+ }
157
251
 
158
- .btn:disabled { opacity: 0.5; cursor: not-allowed; }
252
+ .btn-lg {
253
+ padding: 12px 24px;
254
+ font-size: 15px;
255
+ }
256
+
257
+ .btn:disabled {
258
+ opacity: 0.5;
259
+ cursor: not-allowed;
260
+ }
159
261
 
160
262
  /* ── Inputs ── */
161
263
 
162
- .input, .textarea, .select {
264
+ .input,
265
+ .textarea,
266
+ .select {
163
267
  width: 100%;
164
268
  padding: 9px 13px;
165
269
  background: var(--bg-input);
@@ -170,18 +274,27 @@ button, input, textarea, select {
170
274
  outline: none;
171
275
  }
172
276
 
173
- .input:focus, .textarea:focus, .select:focus {
277
+ .input:focus,
278
+ .textarea:focus,
279
+ .select:focus {
174
280
  border-color: var(--accent);
175
- box-shadow: 0 0 0 3px var(--accent-dim, rgba(99,102,241,.12));
281
+ box-shadow: 0 0 0 3px var(--accent-dim, rgba(99, 102, 241, .12));
176
282
  }
177
283
 
178
- .input::placeholder, .textarea::placeholder {
284
+ .input::placeholder,
285
+ .textarea::placeholder {
179
286
  color: var(--text-muted);
180
287
  }
181
288
 
182
- .textarea { resize: vertical; min-height: 80px; }
289
+ .textarea {
290
+ resize: vertical;
291
+ min-height: 80px;
292
+ }
293
+
294
+ .form-group {
295
+ margin-bottom: 16px;
296
+ }
183
297
 
184
- .form-group { margin-bottom: 16px; }
185
298
  .form-label {
186
299
  display: block;
187
300
  margin-bottom: 5px;
@@ -191,11 +304,13 @@ button, input, textarea, select {
191
304
  color: var(--text-secondary);
192
305
  text-transform: uppercase;
193
306
  }
307
+
194
308
  .settings-inline-label {
195
309
  display: flex;
196
310
  align-items: center;
197
311
  gap: 8px;
198
312
  }
313
+
199
314
  .settings-info-wrap {
200
315
  position: relative;
201
316
  display: inline-flex;
@@ -211,6 +326,7 @@ button, input, textarea, select {
211
326
  cursor: help;
212
327
  text-transform: none;
213
328
  }
329
+
214
330
  .settings-info-icon {
215
331
  display: inline-flex;
216
332
  align-items: center;
@@ -218,6 +334,7 @@ button, input, textarea, select {
218
334
  width: 100%;
219
335
  height: 100%;
220
336
  }
337
+
221
338
  .settings-info-pop {
222
339
  position: absolute;
223
340
  top: 20px;
@@ -228,7 +345,7 @@ button, input, textarea, select {
228
345
  padding: 8px 10px;
229
346
  border-radius: 8px;
230
347
  border: 1px solid var(--border-light);
231
- background: rgba(14,14,26,.98);
348
+ background: var(--bg-modal);
232
349
  color: var(--text-primary);
233
350
  font-size: 11px;
234
351
  font-weight: 400;
@@ -241,16 +358,18 @@ button, input, textarea, select {
241
358
  transition: opacity 120ms ease;
242
359
  z-index: 2;
243
360
  }
361
+
244
362
  .settings-info-wrap:hover .settings-info-pop,
245
363
  .settings-info-wrap:focus .settings-info-pop,
246
364
  .settings-info-wrap:focus-within .settings-info-pop {
247
365
  opacity: 1;
248
366
  }
367
+
249
368
  .settings-token-box {
250
369
  border: 1px solid var(--border);
251
370
  border-radius: 10px;
252
371
  padding: 10px 12px;
253
- background: rgba(255,255,255,.02);
372
+ background: rgba(255, 255, 255, .02);
254
373
  color: var(--text-secondary);
255
374
  font-size: 12px;
256
375
  line-height: 1.45;
@@ -265,7 +384,11 @@ button, input, textarea, select {
265
384
  padding: 20px;
266
385
  transition: border-color var(--t-mid, 200ms), box-shadow var(--t-mid, 200ms);
267
386
  }
268
- .card:hover { border-color: var(--border-light); box-shadow: 0 2px 12px rgba(0,0,0,.3); }
387
+
388
+ .card:hover {
389
+ border-color: var(--border-light);
390
+ box-shadow: 0 2px 12px rgba(0, 0, 0, .3);
391
+ }
269
392
 
270
393
  .card-header {
271
394
  display: flex;
@@ -293,11 +416,30 @@ button, input, textarea, select {
293
416
  letter-spacing: 0.5px;
294
417
  }
295
418
 
296
- .badge-success { background: rgba(34, 197, 94, 0.15); color: var(--success); }
297
- .badge-warning { background: rgba(245, 158, 11, 0.15); color: var(--warning); }
298
- .badge-error { background: rgba(239, 68, 68, 0.15); color: var(--error); }
299
- .badge-info { background: rgba(59, 130, 246, 0.15); color: var(--info); }
300
- .badge-neutral { background: var(--bg-hover); color: var(--text-secondary); }
419
+ .badge-success {
420
+ background: rgba(34, 197, 94, 0.15);
421
+ color: var(--success);
422
+ }
423
+
424
+ .badge-warning {
425
+ background: rgba(245, 158, 11, 0.15);
426
+ color: var(--warning);
427
+ }
428
+
429
+ .badge-error {
430
+ background: rgba(239, 68, 68, 0.15);
431
+ color: var(--error);
432
+ }
433
+
434
+ .badge-info {
435
+ background: rgba(59, 130, 246, 0.15);
436
+ color: var(--info);
437
+ }
438
+
439
+ .badge-neutral {
440
+ background: var(--bg-hover);
441
+ color: var(--text-secondary);
442
+ }
301
443
 
302
444
  /* ── Toast / Notification ── */
303
445
 
@@ -315,29 +457,55 @@ button, input, textarea, select {
315
457
  .toast {
316
458
  padding: 12px 18px;
317
459
  border-radius: var(--radius-lg);
318
- background: rgba(18,18,32,.92);
460
+ background: var(--bg-toast);
319
461
  backdrop-filter: blur(20px) saturate(1.4);
320
462
  -webkit-backdrop-filter: blur(20px) saturate(1.4);
321
463
  border: 1px solid var(--border-light);
322
464
  box-shadow: var(--shadow);
323
465
  font-size: 13px;
324
466
  pointer-events: all;
325
- animation: toastIn 200ms var(--ease-out, cubic-bezier(.16,1,.3,1)) both;
467
+ animation: toastIn 200ms var(--ease-out, cubic-bezier(.16, 1, .3, 1)) both;
326
468
  max-width: 380px;
327
469
  }
328
- .toast.removing { animation: toastOut 120ms ease-in both; }
329
470
 
330
- .toast-success { border-left: 3px solid var(--success); }
331
- .toast-error { border-left: 3px solid var(--error); }
332
- .toast-info { border-left: 3px solid var(--info); }
471
+ .toast.removing {
472
+ animation: toastOut 120ms ease-in both;
473
+ }
474
+
475
+ .toast-success {
476
+ border-left: 3px solid var(--success);
477
+ }
478
+
479
+ .toast-error {
480
+ border-left: 3px solid var(--error);
481
+ }
482
+
483
+ .toast-info {
484
+ border-left: 3px solid var(--info);
485
+ }
333
486
 
334
487
  @keyframes toastIn {
335
- from { transform: translateX(110%) scale(.9); opacity: 0; }
336
- to { transform: translateX(0) scale(1); opacity: 1; }
488
+ from {
489
+ transform: translateX(110%) scale(.9);
490
+ opacity: 0;
491
+ }
492
+
493
+ to {
494
+ transform: translateX(0) scale(1);
495
+ opacity: 1;
496
+ }
337
497
  }
498
+
338
499
  @keyframes toastOut {
339
- from { transform: translateX(0) scale(1); opacity: 1; }
340
- to { transform: translateX(60%) scale(.9); opacity: 0; }
500
+ from {
501
+ transform: translateX(0) scale(1);
502
+ opacity: 1;
503
+ }
504
+
505
+ to {
506
+ transform: translateX(60%) scale(.9);
507
+ opacity: 0;
508
+ }
341
509
  }
342
510
 
343
511
  /* ── Modal ── */
@@ -345,7 +513,7 @@ button, input, textarea, select {
345
513
  .modal-overlay {
346
514
  position: fixed;
347
515
  inset: 0;
348
- background: rgba(0,0,0,.68);
516
+ background: rgba(0, 0, 0, .68);
349
517
  backdrop-filter: blur(10px);
350
518
  -webkit-backdrop-filter: blur(10px);
351
519
  display: flex;
@@ -356,7 +524,7 @@ button, input, textarea, select {
356
524
  }
357
525
 
358
526
  .modal {
359
- background: rgba(14,14,26,.96);
527
+ background: var(--bg-modal);
360
528
  backdrop-filter: blur(24px) saturate(1.3);
361
529
  -webkit-backdrop-filter: blur(24px) saturate(1.3);
362
530
  border: 1px solid var(--border-light);
@@ -366,7 +534,7 @@ button, input, textarea, select {
366
534
  max-height: 80vh;
367
535
  overflow-y: auto;
368
536
  box-shadow: var(--shadow-lg);
369
- animation: modalIn 200ms var(--ease-out, cubic-bezier(.16,1,.3,1)) both;
537
+ animation: modalIn 200ms var(--ease-out, cubic-bezier(.16, 1, .3, 1)) both;
370
538
  }
371
539
 
372
540
  .modal-header {
@@ -377,9 +545,14 @@ button, input, textarea, select {
377
545
  border-bottom: 1px solid var(--border);
378
546
  }
379
547
 
380
- .modal-header h2 { font-size: 18px; font-weight: 600; }
548
+ .modal-header h2 {
549
+ font-size: 18px;
550
+ font-weight: 600;
551
+ }
381
552
 
382
- .modal-body { padding: 24px; }
553
+ .modal-body {
554
+ padding: 24px;
555
+ }
383
556
 
384
557
  .modal-footer {
385
558
  display: flex;
@@ -394,7 +567,7 @@ button, input, textarea, select {
394
567
  border: 1px solid var(--border);
395
568
  border-radius: 12px;
396
569
  padding: 14px;
397
- background: linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.01));
570
+ background: linear-gradient(180deg, rgba(255, 255, 255, 0.02), rgba(255, 255, 255, 0.01));
398
571
  }
399
572
 
400
573
  .settings-update-head {
@@ -417,7 +590,7 @@ button, input, textarea, select {
417
590
  width: 100%;
418
591
  height: 8px;
419
592
  border-radius: 999px;
420
- background: rgba(255,255,255,.08);
593
+ background: rgba(255, 255, 255, .08);
421
594
  overflow: hidden;
422
595
  }
423
596
 
@@ -480,13 +653,13 @@ button, input, textarea, select {
480
653
  .settings-update-logs {
481
654
  margin: 0;
482
655
  padding: 10px;
483
- background: rgba(5,10,18,.8);
656
+ background: var(--bg-logs);
484
657
  border: 1px solid var(--border);
485
658
  border-radius: 8px;
486
659
  font-family: 'JetBrains Mono', monospace;
487
660
  font-size: 11px;
488
661
  line-height: 1.45;
489
- color: #cfd7ff;
662
+ color: var(--text-secondary);
490
663
  max-height: 140px;
491
664
  overflow-y: auto;
492
665
  white-space: pre-wrap;
@@ -494,11 +667,26 @@ button, input, textarea, select {
494
667
  }
495
668
 
496
669
  @keyframes modalIn {
497
- from { transform: translateY(14px) scale(.96); opacity: 0; }
498
- to { transform: translateY(0) scale(1); opacity: 1; }
670
+ from {
671
+ transform: translateY(14px) scale(.96);
672
+ opacity: 0;
673
+ }
674
+
675
+ to {
676
+ transform: translateY(0) scale(1);
677
+ opacity: 1;
678
+ }
499
679
  }
500
680
 
501
- @keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
681
+ @keyframes fadeIn {
682
+ from {
683
+ opacity: 0;
684
+ }
685
+
686
+ to {
687
+ opacity: 1;
688
+ }
689
+ }
502
690
 
503
691
  /* ── Tabs ── */
504
692
 
@@ -519,8 +707,14 @@ button, input, textarea, select {
519
707
  font-size: 13px;
520
708
  }
521
709
 
522
- .tab:hover { color: var(--text-primary); }
523
- .tab.active { color: var(--accent); border-bottom-color: var(--accent); }
710
+ .tab:hover {
711
+ color: var(--text-primary);
712
+ }
713
+
714
+ .tab.active {
715
+ color: var(--accent);
716
+ border-bottom-color: var(--accent);
717
+ }
524
718
 
525
719
  /* ── Code Block ── */
526
720
 
@@ -549,8 +743,17 @@ button, input, textarea, select {
549
743
  text-align: center;
550
744
  gap: 8px;
551
745
  }
552
- .empty-state svg { opacity: .25; margin-bottom: 8px; }
553
- .empty-state p { font-size: 15px; font-weight: 500; color: var(--text-secondary); }
746
+
747
+ .empty-state svg {
748
+ opacity: .25;
749
+ margin-bottom: 8px;
750
+ }
751
+
752
+ .empty-state p {
753
+ font-size: 15px;
754
+ font-weight: 500;
755
+ color: var(--text-secondary);
756
+ }
554
757
 
555
758
  /* ── Spinner ── */
556
759
 
@@ -563,16 +766,42 @@ button, input, textarea, select {
563
766
  animation: spin 600ms linear infinite;
564
767
  }
565
768
 
566
- @keyframes spin { to { transform: rotate(360deg); } }
769
+ @keyframes spin {
770
+ to {
771
+ transform: rotate(360deg);
772
+ }
773
+ }
567
774
 
568
775
  /* ── Markdown Content ── */
569
776
 
570
- .md-content h1, .md-content h2, .md-content h3 { margin: 16px 0 8px; }
571
- .md-content h1 { font-size: 20px; }
572
- .md-content h2 { font-size: 17px; }
573
- .md-content h3 { font-size: 15px; }
574
- .md-content p { margin-bottom: 8px; }
575
- .md-content ul, .md-content ol { padding-left: 24px; margin-bottom: 8px; }
777
+ .md-content h1,
778
+ .md-content h2,
779
+ .md-content h3 {
780
+ margin: 16px 0 8px;
781
+ }
782
+
783
+ .md-content h1 {
784
+ font-size: 20px;
785
+ }
786
+
787
+ .md-content h2 {
788
+ font-size: 17px;
789
+ }
790
+
791
+ .md-content h3 {
792
+ font-size: 15px;
793
+ }
794
+
795
+ .md-content p {
796
+ margin-bottom: 8px;
797
+ }
798
+
799
+ .md-content ul,
800
+ .md-content ol {
801
+ padding-left: 24px;
802
+ margin-bottom: 8px;
803
+ }
804
+
576
805
  .md-content code {
577
806
  background: var(--bg-2, #111120);
578
807
  padding: 2px 6px;
@@ -581,6 +810,7 @@ button, input, textarea, select {
581
810
  font-size: 12.5px;
582
811
  color: var(--accent-hover);
583
812
  }
813
+
584
814
  .md-content pre {
585
815
  background: var(--bg-primary);
586
816
  border: 1px solid var(--border);
@@ -589,7 +819,12 @@ button, input, textarea, select {
589
819
  overflow-x: auto;
590
820
  margin-bottom: 12px;
591
821
  }
592
- .md-content pre code { background: none; padding: 0; }
822
+
823
+ .md-content pre code {
824
+ background: none;
825
+ padding: 0;
826
+ }
827
+
593
828
  .md-content blockquote {
594
829
  border-left: 3px solid var(--accent);
595
830
  padding-left: 14px;
@@ -599,41 +834,130 @@ button, input, textarea, select {
599
834
 
600
835
  /* ── Utility ── */
601
836
 
602
- .flex { display: flex; }
603
- .flex-col { flex-direction: column; }
604
- .items-center { align-items: center; }
605
- .justify-between { justify-content: space-between; }
606
- .gap-2 { gap: 8px; }
607
- .gap-3 { gap: 12px; }
608
- .gap-4 { gap: 16px; }
609
- .w-full { width: 100%; }
610
- .text-center { text-align: center; }
611
- .text-sm { font-size: 13px; }
612
- .text-xs { font-size: 11px; }
613
- .text-muted { color: var(--text-secondary); }
614
- .font-mono { font-family: 'JetBrains Mono', 'SF Mono', 'Fira Code', monospace; }
615
- .truncate { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
616
- .hidden { display: none !important; }
617
- .mt-1 { margin-top: 4px; }
618
- .mt-2 { margin-top: 8px; }
619
- .mt-4 { margin-top: 16px; }
620
- .mb-2 { margin-bottom: 8px; }
621
- .mb-4 { margin-bottom: 16px; }
622
- .p-4 { padding: 16px; }
623
- .gap-1 { gap: 4px; }
624
- .justify-center { justify-content: center; }
625
- .rounded { border-radius: var(--radius); }
837
+ .flex {
838
+ display: flex;
839
+ }
840
+
841
+ .flex-col {
842
+ flex-direction: column;
843
+ }
844
+
845
+ .items-center {
846
+ align-items: center;
847
+ }
848
+
849
+ .justify-between {
850
+ justify-content: space-between;
851
+ }
852
+
853
+ .gap-2 {
854
+ gap: 8px;
855
+ }
856
+
857
+ .gap-3 {
858
+ gap: 12px;
859
+ }
860
+
861
+ .gap-4 {
862
+ gap: 16px;
863
+ }
864
+
865
+ .w-full {
866
+ width: 100%;
867
+ }
868
+
869
+ .text-center {
870
+ text-align: center;
871
+ }
872
+
873
+ .text-sm {
874
+ font-size: 13px;
875
+ }
876
+
877
+ .text-xs {
878
+ font-size: 11px;
879
+ }
880
+
881
+ .text-muted {
882
+ color: var(--text-secondary);
883
+ }
884
+
885
+ .font-mono {
886
+ font-family: 'JetBrains Mono', 'SF Mono', 'Fira Code', monospace;
887
+ }
888
+
889
+ .truncate {
890
+ overflow: hidden;
891
+ text-overflow: ellipsis;
892
+ white-space: nowrap;
893
+ }
894
+
895
+ .hidden {
896
+ display: none !important;
897
+ }
898
+
899
+ .mt-1 {
900
+ margin-top: 4px;
901
+ }
902
+
903
+ .mt-2 {
904
+ margin-top: 8px;
905
+ }
906
+
907
+ .mt-4 {
908
+ margin-top: 16px;
909
+ }
910
+
911
+ .mb-2 {
912
+ margin-bottom: 8px;
913
+ }
914
+
915
+ .mb-4 {
916
+ margin-bottom: 16px;
917
+ }
918
+
919
+ .p-4 {
920
+ padding: 16px;
921
+ }
922
+
923
+ .gap-1 {
924
+ gap: 4px;
925
+ }
926
+
927
+ .justify-center {
928
+ justify-content: center;
929
+ }
930
+
931
+ .rounded {
932
+ border-radius: var(--radius);
933
+ }
626
934
 
627
935
  /* ── ANIMATIONS (global) ── */
628
936
 
629
937
  @keyframes pulse {
630
- 0%, 100% { opacity: 1; }
631
- 50% { opacity: .35; }
938
+
939
+ 0%,
940
+ 100% {
941
+ opacity: 1;
942
+ }
943
+
944
+ 50% {
945
+ opacity: .35;
946
+ }
632
947
  }
633
948
 
634
949
  @keyframes fadeSlideUp {
635
- from { opacity: 0; transform: translateY(8px); }
636
- to { opacity: 1; transform: translateY(0); }
950
+ from {
951
+ opacity: 0;
952
+ transform: translateY(8px);
953
+ }
954
+
955
+ to {
956
+ opacity: 1;
957
+ transform: translateY(0);
958
+ }
637
959
  }
638
960
 
639
- .animate-in { animation: fadeSlideUp 200ms cubic-bezier(.16,1,.3,1) both; }
961
+ .animate-in {
962
+ animation: fadeSlideUp 200ms cubic-bezier(.16, 1, .3, 1) both;
963
+ }