dsh-synapse 0.4.1 → 0.4.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE +21 -21
- package/README.md +79 -81
- package/app.js +1344 -1344
- package/client.js +336 -241
- package/cordis.patch.yml +13 -13
- package/deepseek-mark.svg +3 -3
- package/docs/architecture.md +127 -104
- package/docs/development.md +138 -137
- package/docs/en/README.md +161 -161
- package/docs/images/native-webui.jpg +0 -0
- package/docs/images/synapse-map.jpg +0 -0
- package/docs/zh-CN/README.md +154 -154
- package/index.js +761 -754
- package/package.json +47 -45
- package/styles.css +317 -317
- package/docs/images/native-webui.png +0 -0
- package/docs/images/synapse-ui.png +0 -0
package/styles.css
CHANGED
|
@@ -1,105 +1,105 @@
|
|
|
1
|
-
:root { color-scheme: light; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", Helvetica, Arial, sans-serif; color: #1f2937; background: #f5f7fa; }
|
|
2
|
-
* { box-sizing: border-box; }
|
|
3
|
-
body { margin: 0; min-width: 320px; background: #f5f7fa; }
|
|
4
|
-
button, select, textarea { font: inherit; }
|
|
5
|
-
button { border: 1px solid #d8dee8; border-radius: 6px; background: #fff; color: #374151; cursor: pointer; min-height: 32px; padding: 0 11px; }
|
|
6
|
-
button:hover { border-color: #9ca3af; background: #f3f4f6; color: #111827; }
|
|
7
|
-
button:disabled { cursor: not-allowed; opacity: .5; }
|
|
8
|
-
button.primary { border-color: #111827; background: #111827; color: #fff; }
|
|
9
|
-
button.primary:hover { border-color: #000; background: #000; color: #fff; }
|
|
10
|
-
.synapse-shell { --sidebar-width: 280px; --sidebar-half: 140px; height: 100vh; display: grid; grid-template-columns: var(--sidebar-width) minmax(0, 1fr); grid-template-rows: 42px minmax(0, 1fr); overflow: hidden; }
|
|
11
|
-
.synapse-shell.sidebar-collapsed { --sidebar-width: 56px; --sidebar-half: 28px; }
|
|
12
|
-
.topbar { position: relative; grid-column: 2; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 0 16px; border: 0; background: #fff; }
|
|
13
|
-
.brand, .top-actions, .view-switch, .thread-card-head, .thread-meta, .detail-actions, .compare-title { display: flex; align-items: center; }
|
|
14
|
-
.sidebar-brand-row { box-sizing: border-box; display: flex; align-items: center; gap: 8px; height: 60px; flex: none; margin-bottom: 8px; padding: 8px 0 8px 4px; overflow: hidden; }
|
|
15
|
-
.brand { gap: 8px; min-width: 0; flex: 1; }
|
|
16
|
-
.brand::before { width: 31px; height: 26px; flex: none; content: ''; background: center / contain no-repeat url('/synapse/deepseek-mark.svg'); }
|
|
17
|
-
.brand::after { content: '非线性工作台'; flex: none; border-radius: 3px; background: #111827; padding: 2px 5px; color: #fff; font-size: 10px; font-weight: 400; line-height: 1; white-space: nowrap; }
|
|
18
|
-
.brand-mark { display: none; }
|
|
19
|
-
.brand strong { font-size: 20px; font-weight: 600; letter-spacing: 0; }
|
|
20
|
-
.sidebar-toggle { display: inline-grid; width: 28px; height: 28px; min-height: 28px; flex: none; place-items: center; border: 0; border-radius: 50%; background: transparent; padding: 0; color: #6b7280; }
|
|
21
|
-
.sidebar-toggle:hover { border: 0; background: #eef0f2; color: #374151; }
|
|
22
|
-
.sidebar-toggle svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.4; }
|
|
23
|
-
.top-actions { gap: 10px; }
|
|
24
|
-
.view-switch { position: fixed; z-index: 80; top: 12px; left: 50%; gap: 2px; padding: 3px; transform: translateX(-50%); border: 1px solid #d1d5db; border-radius: 999px; background: rgba(255,255,255,.96); }
|
|
25
|
-
.view-switch button { min-height: 28px; border: 0; border-radius: 999px; background: transparent; padding: 0 11px; color: #64748b; font-size: 12px; font-weight: 650; }
|
|
26
|
-
.view-switch button:hover { background: #e5e7eb; color: #111827; }
|
|
27
|
-
.view-switch button.active { background: #111827; color: #fff; }
|
|
28
|
-
.view-switch button:focus-visible { outline: 2px solid #111827; outline-offset: 2px; }
|
|
29
|
-
.canvas-controls { position: fixed; z-index: 80; top: 14px; right: 16px; display: flex; align-items: center; gap: 5px; }
|
|
30
|
-
.canvas-controls button { min-width: 32px; padding: 0 8px; font-size: 12px; display: inline-flex; align-items: center; gap: 4px; }
|
|
31
|
-
.canvas-controls button svg { width: 14px; height: 14px; flex: none; }
|
|
32
|
-
.canvas-controls span { min-width: 42px; color: #64748b; font-size: 12px; text-align: center; }
|
|
33
|
-
.sidebar { grid-row: 1 / -1; display: flex; flex-direction: column; gap: 0; min-height: 0; padding: 6px 12px; border-right: 1px solid #e5e7eb; background: #f8f9fa; }
|
|
34
|
-
.new-workspace { display: flex; width: calc(100% - 4px); min-height: auto; height: 38px; align-items: center; justify-content: center; gap: 6px; margin: 0 2px 8px; border-color: rgba(0,0,0,.1); border-radius: 12px; background: #fff; padding: 8px 16px; color: #111827; font-size: 14px; font-weight: 500; }
|
|
35
|
-
.new-session-icon { width: 16px; height: 16px; flex: none; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.5; }
|
|
36
|
-
.new-workspace:hover { border-color: rgba(0,0,0,.16); background: #f7f7f8; color: #111827; }
|
|
37
|
-
.workspace-label, .sidebar-heading { color: #7c8798; font-size: 14px; font-weight: 400; letter-spacing: 0; }
|
|
38
|
-
.workspace-label { display: grid; gap: 9px; margin: 16px 4px 0; }
|
|
39
|
-
.workspace-select { position: relative; display: block; }
|
|
40
|
-
.workspace-select svg { position: absolute; top: 50%; left: 9px; width: 15px; height: 15px; transform: translateY(-50%); fill: none; pointer-events: none; stroke: #64748b; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.4; }
|
|
41
|
-
.workspace-label select { width: 100%; min-height: 33px; border: 1px solid #d8dee8; border-radius: 6px; background: #fff; color: #374151; padding: 0 28px 0 30px; }
|
|
42
|
-
.sidebar-heading { display: flex; align-items: center; justify-content: space-between; margin: 23px 4px 0; padding: 0; }
|
|
43
|
-
.sidebar-heading button { display: grid; width: 24px; min-height: 24px; place-items: center; padding: 0; color: #111827; font-size: 17px; }
|
|
44
|
-
.thread-tree { display: grid; gap: 3px; overflow: auto; padding-bottom: 12px; }
|
|
45
|
-
.tree-row { display: flex; min-width: 0; align-items: center; gap: 8px; border: 0; background: transparent; color: #4b5563; text-align: left; }
|
|
46
|
-
.tree-row:hover { background: #f3f4f6; }
|
|
47
|
-
.tree-row.active { background: #e5e7eb; color: #111827; font-weight: 650; }
|
|
48
|
-
.tree-row span:nth-child(2) { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; }
|
|
49
|
-
.tree-row i { margin-left: auto; color: #94a3b8; font-size: 10px; font-style: normal; }
|
|
50
|
-
.tree-dot, .topic-dot { width: 8px; height: 8px; flex: none; border-radius: 50%; background: var(--thread-color, #374151); }
|
|
51
|
-
.tree-row { --thread-color: #3478f6 !important; }
|
|
52
|
-
.tree-empty { padding: 12px 5px; color: #94a3b8; font-size: 12px; }
|
|
53
|
-
.main-stage { position: relative; grid-column: 2; min-width: 0; min-height: 0; overflow: hidden; background: #f5f7fa; }
|
|
54
|
-
.sidebar-collapsed .sidebar { align-items: center; padding: 18px 10px 6px; }
|
|
55
|
-
.sidebar-collapsed .sidebar-brand-row { width: 36px; height: 36px; margin-bottom: 12px; padding: 0; }
|
|
56
|
-
.sidebar-collapsed .brand { display: none; }
|
|
57
|
-
.sidebar-collapsed .sidebar-toggle { width: 36px; height: 36px; min-height: 36px; color: #111827; }
|
|
58
|
-
.sidebar-collapsed .new-workspace { width: 36px; height: 36px; min-height: 36px; margin: 0 0 12px; border-color: transparent; background: transparent; padding: 0; }
|
|
59
|
-
.sidebar-collapsed .new-workspace span, .sidebar-collapsed .workspace-label, .sidebar-collapsed .sidebar-heading, .sidebar-collapsed .thread-tree { display: none; }
|
|
60
|
-
.status-message { position: absolute; z-index: 6; top: 12px; right: 16px; display: flex; align-items: center; gap: 10px; max-width: 400px; padding: 9px 10px 9px 13px; border: 1px solid #fecaca; border-radius: 8px; background: #fef2f2; color: #991b1b; font-size: 12px; box-shadow: 0 3px 10px rgba(127,29,29,.12); }
|
|
61
|
-
.status-message span { flex: 1; line-height: 1.5; }
|
|
62
|
-
.status-message button { display: grid; width: 22px; height: 22px; flex: none; place-items: center; border: 0; border-radius: 50%; background: transparent; padding: 0; color: #b91c1c; font-size: 15px; line-height: 1; }
|
|
63
|
-
.status-message button:hover { background: #fee2e2; }
|
|
64
|
-
.main-stage { display: flex; min-width: 0; min-height: 0; flex-direction: column; overflow: hidden; background: #fff; }
|
|
65
|
-
.canvas-tabs { display: flex; height: 32px; flex: none; align-items: end; gap: 26px; padding: 0 24px; border-bottom: 1px solid #e5e7eb; background: #fff; }
|
|
66
|
-
.canvas-tabs button { min-height: 32px; border: 0; border-bottom: 2px solid transparent; border-radius: 0; background: transparent; padding: 0 2px; color: #8a919b; font-size: 13px; font-weight: 500; }
|
|
67
|
-
.canvas-tabs button:hover { background: transparent; color: #3478f6; }
|
|
68
|
-
.canvas-tabs button.active { border-bottom-color: #3478f6; color: #3478f6; }
|
|
69
|
-
.canvas-tabs button:disabled { cursor: default; opacity: .4; }
|
|
1
|
+
:root { color-scheme: light; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", Helvetica, Arial, sans-serif; color: #1f2937; background: #f5f7fa; }
|
|
2
|
+
* { box-sizing: border-box; }
|
|
3
|
+
body { margin: 0; min-width: 320px; background: #f5f7fa; }
|
|
4
|
+
button, select, textarea { font: inherit; }
|
|
5
|
+
button { border: 1px solid #d8dee8; border-radius: 6px; background: #fff; color: #374151; cursor: pointer; min-height: 32px; padding: 0 11px; }
|
|
6
|
+
button:hover { border-color: #9ca3af; background: #f3f4f6; color: #111827; }
|
|
7
|
+
button:disabled { cursor: not-allowed; opacity: .5; }
|
|
8
|
+
button.primary { border-color: #111827; background: #111827; color: #fff; }
|
|
9
|
+
button.primary:hover { border-color: #000; background: #000; color: #fff; }
|
|
10
|
+
.synapse-shell { --sidebar-width: 280px; --sidebar-half: 140px; height: 100vh; display: grid; grid-template-columns: var(--sidebar-width) minmax(0, 1fr); grid-template-rows: 42px minmax(0, 1fr); overflow: hidden; }
|
|
11
|
+
.synapse-shell.sidebar-collapsed { --sidebar-width: 56px; --sidebar-half: 28px; }
|
|
12
|
+
.topbar { position: relative; grid-column: 2; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 0 16px; border: 0; background: #fff; }
|
|
13
|
+
.brand, .top-actions, .view-switch, .thread-card-head, .thread-meta, .detail-actions, .compare-title { display: flex; align-items: center; }
|
|
14
|
+
.sidebar-brand-row { box-sizing: border-box; display: flex; align-items: center; gap: 8px; height: 60px; flex: none; margin-bottom: 8px; padding: 8px 0 8px 4px; overflow: hidden; }
|
|
15
|
+
.brand { gap: 8px; min-width: 0; flex: 1; }
|
|
16
|
+
.brand::before { width: 31px; height: 26px; flex: none; content: ''; background: center / contain no-repeat url('/synapse/deepseek-mark.svg'); }
|
|
17
|
+
.brand::after { content: '非线性工作台'; flex: none; border-radius: 3px; background: #111827; padding: 2px 5px; color: #fff; font-size: 10px; font-weight: 400; line-height: 1; white-space: nowrap; }
|
|
18
|
+
.brand-mark { display: none; }
|
|
19
|
+
.brand strong { font-size: 20px; font-weight: 600; letter-spacing: 0; }
|
|
20
|
+
.sidebar-toggle { display: inline-grid; width: 28px; height: 28px; min-height: 28px; flex: none; place-items: center; border: 0; border-radius: 50%; background: transparent; padding: 0; color: #6b7280; }
|
|
21
|
+
.sidebar-toggle:hover { border: 0; background: #eef0f2; color: #374151; }
|
|
22
|
+
.sidebar-toggle svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.4; }
|
|
23
|
+
.top-actions { gap: 10px; }
|
|
24
|
+
.view-switch { position: fixed; z-index: 80; top: 12px; left: 50%; gap: 2px; padding: 3px; transform: translateX(-50%); border: 1px solid #d1d5db; border-radius: 999px; background: rgba(255,255,255,.96); }
|
|
25
|
+
.view-switch button { min-height: 28px; border: 0; border-radius: 999px; background: transparent; padding: 0 11px; color: #64748b; font-size: 12px; font-weight: 650; }
|
|
26
|
+
.view-switch button:hover { background: #e5e7eb; color: #111827; }
|
|
27
|
+
.view-switch button.active { background: #111827; color: #fff; }
|
|
28
|
+
.view-switch button:focus-visible { outline: 2px solid #111827; outline-offset: 2px; }
|
|
29
|
+
.canvas-controls { position: fixed; z-index: 80; top: 14px; right: 16px; display: flex; align-items: center; gap: 5px; }
|
|
30
|
+
.canvas-controls button { min-width: 32px; padding: 0 8px; font-size: 12px; display: inline-flex; align-items: center; gap: 4px; }
|
|
31
|
+
.canvas-controls button svg { width: 14px; height: 14px; flex: none; }
|
|
32
|
+
.canvas-controls span { min-width: 42px; color: #64748b; font-size: 12px; text-align: center; }
|
|
33
|
+
.sidebar { grid-row: 1 / -1; display: flex; flex-direction: column; gap: 0; min-height: 0; padding: 6px 12px; border-right: 1px solid #e5e7eb; background: #f8f9fa; }
|
|
34
|
+
.new-workspace { display: flex; width: calc(100% - 4px); min-height: auto; height: 38px; align-items: center; justify-content: center; gap: 6px; margin: 0 2px 8px; border-color: rgba(0,0,0,.1); border-radius: 12px; background: #fff; padding: 8px 16px; color: #111827; font-size: 14px; font-weight: 500; }
|
|
35
|
+
.new-session-icon { width: 16px; height: 16px; flex: none; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.5; }
|
|
36
|
+
.new-workspace:hover { border-color: rgba(0,0,0,.16); background: #f7f7f8; color: #111827; }
|
|
37
|
+
.workspace-label, .sidebar-heading { color: #7c8798; font-size: 14px; font-weight: 400; letter-spacing: 0; }
|
|
38
|
+
.workspace-label { display: grid; gap: 9px; margin: 16px 4px 0; }
|
|
39
|
+
.workspace-select { position: relative; display: block; }
|
|
40
|
+
.workspace-select svg { position: absolute; top: 50%; left: 9px; width: 15px; height: 15px; transform: translateY(-50%); fill: none; pointer-events: none; stroke: #64748b; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.4; }
|
|
41
|
+
.workspace-label select { width: 100%; min-height: 33px; border: 1px solid #d8dee8; border-radius: 6px; background: #fff; color: #374151; padding: 0 28px 0 30px; }
|
|
42
|
+
.sidebar-heading { display: flex; align-items: center; justify-content: space-between; margin: 23px 4px 0; padding: 0; }
|
|
43
|
+
.sidebar-heading button { display: grid; width: 24px; min-height: 24px; place-items: center; padding: 0; color: #111827; font-size: 17px; }
|
|
44
|
+
.thread-tree { display: grid; gap: 3px; overflow: auto; padding-bottom: 12px; }
|
|
45
|
+
.tree-row { display: flex; min-width: 0; align-items: center; gap: 8px; border: 0; background: transparent; color: #4b5563; text-align: left; }
|
|
46
|
+
.tree-row:hover { background: #f3f4f6; }
|
|
47
|
+
.tree-row.active { background: #e5e7eb; color: #111827; font-weight: 650; }
|
|
48
|
+
.tree-row span:nth-child(2) { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; }
|
|
49
|
+
.tree-row i { margin-left: auto; color: #94a3b8; font-size: 10px; font-style: normal; }
|
|
50
|
+
.tree-dot, .topic-dot { width: 8px; height: 8px; flex: none; border-radius: 50%; background: var(--thread-color, #374151); }
|
|
51
|
+
.tree-row { --thread-color: #3478f6 !important; }
|
|
52
|
+
.tree-empty { padding: 12px 5px; color: #94a3b8; font-size: 12px; }
|
|
53
|
+
.main-stage { position: relative; grid-column: 2; min-width: 0; min-height: 0; overflow: hidden; background: #f5f7fa; }
|
|
54
|
+
.sidebar-collapsed .sidebar { align-items: center; padding: 18px 10px 6px; }
|
|
55
|
+
.sidebar-collapsed .sidebar-brand-row { width: 36px; height: 36px; margin-bottom: 12px; padding: 0; }
|
|
56
|
+
.sidebar-collapsed .brand { display: none; }
|
|
57
|
+
.sidebar-collapsed .sidebar-toggle { width: 36px; height: 36px; min-height: 36px; color: #111827; }
|
|
58
|
+
.sidebar-collapsed .new-workspace { width: 36px; height: 36px; min-height: 36px; margin: 0 0 12px; border-color: transparent; background: transparent; padding: 0; }
|
|
59
|
+
.sidebar-collapsed .new-workspace span, .sidebar-collapsed .workspace-label, .sidebar-collapsed .sidebar-heading, .sidebar-collapsed .thread-tree { display: none; }
|
|
60
|
+
.status-message { position: absolute; z-index: 6; top: 12px; right: 16px; display: flex; align-items: center; gap: 10px; max-width: 400px; padding: 9px 10px 9px 13px; border: 1px solid #fecaca; border-radius: 8px; background: #fef2f2; color: #991b1b; font-size: 12px; box-shadow: 0 3px 10px rgba(127,29,29,.12); }
|
|
61
|
+
.status-message span { flex: 1; line-height: 1.5; }
|
|
62
|
+
.status-message button { display: grid; width: 22px; height: 22px; flex: none; place-items: center; border: 0; border-radius: 50%; background: transparent; padding: 0; color: #b91c1c; font-size: 15px; line-height: 1; }
|
|
63
|
+
.status-message button:hover { background: #fee2e2; }
|
|
64
|
+
.main-stage { display: flex; min-width: 0; min-height: 0; flex-direction: column; overflow: hidden; background: #fff; }
|
|
65
|
+
.canvas-tabs { display: flex; height: 32px; flex: none; align-items: end; gap: 26px; padding: 0 24px; border-bottom: 1px solid #e5e7eb; background: #fff; }
|
|
66
|
+
.canvas-tabs button { min-height: 32px; border: 0; border-bottom: 2px solid transparent; border-radius: 0; background: transparent; padding: 0 2px; color: #8a919b; font-size: 13px; font-weight: 500; }
|
|
67
|
+
.canvas-tabs button:hover { background: transparent; color: #3478f6; }
|
|
68
|
+
.canvas-tabs button.active { border-bottom-color: #3478f6; color: #3478f6; }
|
|
69
|
+
.canvas-tabs button:disabled { cursor: default; opacity: .4; }
|
|
70
70
|
.canvas-view { position: relative; display: flex; min-height: 0; flex: 1; }
|
|
71
|
-
/* The canvas void is light gray (matching the DSH main stage) instead of pure
|
|
72
|
-
white, and the pan cursor is a custom dark hand with a light outline so it
|
|
73
|
-
stays visible on both light and dark canvases (system light-theme pointers
|
|
74
|
-
vanish on a white void). */
|
|
75
|
-
.canvas-viewport { position: relative; width: 100%; height: 100%; min-height: 0; flex: 1; overflow: hidden; background: #f5f7fa; cursor: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 24 24'><g fill='none' stroke='%23ffffff' stroke-width='4.5' stroke-linecap='round' stroke-linejoin='round'><path d='M18 11V6a2 2 0 0 0-4 0v5M14 10V4a2 2 0 0 0-4 0v2M10 10.5V6a2 2 0 0 0-4 0v8M18 8a2 2 0 1 1 4 0v6a8 8 0 0 1-8 8h-2c-2.8 0-4.5-.86-5.99-2.34l-3.6-3.6a2 2 0 0 1 2.83-2.82L7 15'/></g><g fill='none' stroke='%23374151' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M18 11V6a2 2 0 0 0-4 0v5M14 10V4a2 2 0 0 0-4 0v2M10 10.5V6a2 2 0 0 0-4 0v8M18 8a2 2 0 1 1 4 0v6a8 8 0 0 1-8 8h-2c-2.8 0-4.5-.86-5.99-2.34l-3.6-3.6a2 2 0 0 1 2.83-2.82L7 15'/></g></svg>") 11 12, grab; }
|
|
76
|
-
.canvas-viewport.is-panning { cursor: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 24 24'><g fill='none' stroke='%23ffffff' stroke-width='4.5' stroke-linecap='round' stroke-linejoin='round'><path d='M18 11V6a2 2 0 0 0-4 0v5M14 10V4a2 2 0 0 0-4 0v2M10 10.5V6a2 2 0 0 0-4 0v8M18 8a2 2 0 1 1 4 0v6a8 8 0 0 1-8 8h-2c-2.8 0-4.5-.86-5.99-2.34l-3.6-3.6a2 2 0 0 1 2.83-2.82L7 15'/></g><g fill='none' stroke='%231f2937' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M18 11V6a2 2 0 0 0-4 0v5M14 10V4a2 2 0 0 0-4 0v2M10 10.5V6a2 2 0 0 0-4 0v8M18 8a2 2 0 1 1 4 0v6a8 8 0 0 1-8 8h-2c-2.8 0-4.5-.86-5.99-2.34l-3.6-3.6a2 2 0 0 1 2.83-2.82L7 15'/></g></svg>") 11 12, grabbing; user-select: none; }
|
|
77
|
-
/* While panning, promote the canvas to its own composited layer so the
|
|
78
|
-
browser GPU-transforms the whole subtree instead of repainting every card
|
|
79
|
-
and connector per frame. Zoom drops the layer to avoid upscaling a stale
|
|
80
|
-
raster (see zoomCanvas in app.js). */
|
|
81
|
-
.canvas-viewport.is-panning .canvas-content { will-change: transform; }
|
|
82
|
-
.canvas-content { position: absolute; inset: 0; transform-origin: 0 0; }
|
|
71
|
+
/* The canvas void is light gray (matching the DSH main stage) instead of pure
|
|
72
|
+
white, and the pan cursor is a custom dark hand with a light outline so it
|
|
73
|
+
stays visible on both light and dark canvases (system light-theme pointers
|
|
74
|
+
vanish on a white void). */
|
|
75
|
+
.canvas-viewport { position: relative; width: 100%; height: 100%; min-height: 0; flex: 1; overflow: hidden; background: #f5f7fa; cursor: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 24 24'><g fill='none' stroke='%23ffffff' stroke-width='4.5' stroke-linecap='round' stroke-linejoin='round'><path d='M18 11V6a2 2 0 0 0-4 0v5M14 10V4a2 2 0 0 0-4 0v2M10 10.5V6a2 2 0 0 0-4 0v8M18 8a2 2 0 1 1 4 0v6a8 8 0 0 1-8 8h-2c-2.8 0-4.5-.86-5.99-2.34l-3.6-3.6a2 2 0 0 1 2.83-2.82L7 15'/></g><g fill='none' stroke='%23374151' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M18 11V6a2 2 0 0 0-4 0v5M14 10V4a2 2 0 0 0-4 0v2M10 10.5V6a2 2 0 0 0-4 0v8M18 8a2 2 0 1 1 4 0v6a8 8 0 0 1-8 8h-2c-2.8 0-4.5-.86-5.99-2.34l-3.6-3.6a2 2 0 0 1 2.83-2.82L7 15'/></g></svg>") 11 12, grab; }
|
|
76
|
+
.canvas-viewport.is-panning { cursor: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 24 24'><g fill='none' stroke='%23ffffff' stroke-width='4.5' stroke-linecap='round' stroke-linejoin='round'><path d='M18 11V6a2 2 0 0 0-4 0v5M14 10V4a2 2 0 0 0-4 0v2M10 10.5V6a2 2 0 0 0-4 0v8M18 8a2 2 0 1 1 4 0v6a8 8 0 0 1-8 8h-2c-2.8 0-4.5-.86-5.99-2.34l-3.6-3.6a2 2 0 0 1 2.83-2.82L7 15'/></g><g fill='none' stroke='%231f2937' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M18 11V6a2 2 0 0 0-4 0v5M14 10V4a2 2 0 0 0-4 0v2M10 10.5V6a2 2 0 0 0-4 0v8M18 8a2 2 0 1 1 4 0v6a8 8 0 0 1-8 8h-2c-2.8 0-4.5-.86-5.99-2.34l-3.6-3.6a2 2 0 0 1 2.83-2.82L7 15'/></g></svg>") 11 12, grabbing; user-select: none; }
|
|
77
|
+
/* While panning, promote the canvas to its own composited layer so the
|
|
78
|
+
browser GPU-transforms the whole subtree instead of repainting every card
|
|
79
|
+
and connector per frame. Zoom drops the layer to avoid upscaling a stale
|
|
80
|
+
raster (see zoomCanvas in app.js). */
|
|
81
|
+
.canvas-viewport.is-panning .canvas-content { will-change: transform; }
|
|
82
|
+
.canvas-content { position: absolute; inset: 0; transform-origin: 0 0; }
|
|
83
83
|
.connectors { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; }
|
|
84
84
|
.connectors path { fill: none; stroke: #aebbc9; stroke-width: 1.5; }
|
|
85
85
|
.connectors path.active-connector { stroke: #3478f6; }
|
|
86
86
|
.connectors .draft-connector { stroke: #3478f6; stroke-dasharray: 5 4; }
|
|
87
|
-
.cards-layer { position: absolute; inset: 0; }
|
|
88
|
-
.thread-card { position: absolute; display: grid; width: 310px; height: 276px; grid-template-rows: auto auto minmax(0, 1fr) auto; border: 1px solid #d8e0e8; border-radius: 7px; background: #fff; box-shadow: 0 3px 11px rgba(33,48,67,.08); overflow: visible; }
|
|
89
|
-
.thread-card:hover { border-color: #9ca3af; box-shadow: 0 8px 20px rgba(33,48,67,.13); }
|
|
87
|
+
.cards-layer { position: absolute; inset: 0; }
|
|
88
|
+
.thread-card { position: absolute; display: grid; width: 310px; height: 276px; grid-template-rows: auto auto minmax(0, 1fr) auto; border: 1px solid #d8e0e8; border-radius: 7px; background: #fff; box-shadow: 0 3px 11px rgba(33,48,67,.08); overflow: visible; }
|
|
89
|
+
.thread-card:hover { border-color: #9ca3af; box-shadow: 0 8px 20px rgba(33,48,67,.13); }
|
|
90
90
|
.thread-card.selected { box-shadow: 0 0 0 2px rgba(17,24,39,.16), 0 8px 20px rgba(33,48,67,.13); }
|
|
91
|
-
.node-handle { position: absolute; top: -8px; left: 50%; display: grid; width: 28px; height: 15px; min-height: 15px; place-items: center; transform: translateX(-50%); border: 1px solid #d8e0e8; border-radius: 4px; background: #fff; cursor: grab; padding: 0; }
|
|
92
|
-
.node-handle::after { content: '...'; display: block; margin: -5px 0 0 2px; color: #94a3b8; font-size: 11px; letter-spacing: 1.5px; line-height: 1; }
|
|
93
|
-
.thread-card-head { gap: 8px; min-width: 0; padding: 15px 12px 8px; }
|
|
94
|
-
.thread-card-head .topic-dot { background: var(--thread-color); }
|
|
95
|
-
.thread-title { min-width: 0; flex: 1; min-height: 22px; overflow: hidden; border: 0; background: transparent; padding: 0; color: #1f2937; font-size: 13px; font-weight: 720; text-align: left; text-overflow: ellipsis; white-space: nowrap; }
|
|
96
|
-
.thread-title:hover { background: transparent; color: #111827; }
|
|
97
|
-
.graph-continue-button, .graph-fold-button, .graph-branch-button { position: absolute; right: -12px; z-index: 4; display: grid; width: 24px; height: 24px; min-height: 24px; place-items: center; border-color: #9ca3af; border-radius: 50%; background: #fff; padding: 0; color: #111827; }
|
|
98
|
-
.graph-continue-button, .graph-fold-button { top: 50%; transform: translateY(-50%); }
|
|
99
|
-
.graph-branch-button { top: calc(50% + 30px); transform: translateY(-50%); }
|
|
100
|
-
.graph-continue-button svg, .graph-fold-button svg, .graph-branch-button svg { width: 13px; height: 13px; }
|
|
101
|
-
.graph-continue-button svg, .graph-fold-button svg { fill: none; stroke: currentColor; stroke-linecap: round; stroke-width: 1.8; }
|
|
102
|
-
.graph-branch-button svg { fill: currentColor; }
|
|
91
|
+
.node-handle { position: absolute; top: -8px; left: 50%; display: grid; width: 28px; height: 15px; min-height: 15px; place-items: center; transform: translateX(-50%); border: 1px solid #d8e0e8; border-radius: 4px; background: #fff; cursor: grab; padding: 0; }
|
|
92
|
+
.node-handle::after { content: '...'; display: block; margin: -5px 0 0 2px; color: #94a3b8; font-size: 11px; letter-spacing: 1.5px; line-height: 1; }
|
|
93
|
+
.thread-card-head { gap: 8px; min-width: 0; padding: 15px 12px 8px; }
|
|
94
|
+
.thread-card-head .topic-dot { background: var(--thread-color); }
|
|
95
|
+
.thread-title { min-width: 0; flex: 1; min-height: 22px; overflow: hidden; border: 0; background: transparent; padding: 0; color: #1f2937; font-size: 13px; font-weight: 720; text-align: left; text-overflow: ellipsis; white-space: nowrap; }
|
|
96
|
+
.thread-title:hover { background: transparent; color: #111827; }
|
|
97
|
+
.graph-continue-button, .graph-fold-button, .graph-branch-button { position: absolute; right: -12px; z-index: 4; display: grid; width: 24px; height: 24px; min-height: 24px; place-items: center; border-color: #9ca3af; border-radius: 50%; background: #fff; padding: 0; color: #111827; }
|
|
98
|
+
.graph-continue-button, .graph-fold-button { top: 50%; transform: translateY(-50%); }
|
|
99
|
+
.graph-branch-button { top: calc(50% + 30px); transform: translateY(-50%); }
|
|
100
|
+
.graph-continue-button svg, .graph-fold-button svg, .graph-branch-button svg { width: 13px; height: 13px; }
|
|
101
|
+
.graph-continue-button svg, .graph-fold-button svg { fill: none; stroke: currentColor; stroke-linecap: round; stroke-width: 1.8; }
|
|
102
|
+
.graph-branch-button svg { fill: currentColor; }
|
|
103
103
|
.graph-continue-button:hover, .graph-fold-button:hover, .graph-branch-button:hover { border-color: #111827; background: #f3f4f6; }
|
|
104
104
|
.graph-continue-button:focus-visible, .graph-fold-button:focus-visible, .graph-branch-button:focus-visible { outline: 2px solid #3478f6; outline-offset: 2px; }
|
|
105
105
|
.selection-followup { position: fixed; z-index: 90; display: inline-flex; min-height: 30px; align-items: center; gap: 4px; transform: translateX(-100%); border-color: #3478f6; border-radius: 6px; background: #3478f6; padding: 0 8px; color: #fff; font-size: 12px; font-weight: 650; line-height: 1; box-shadow: 0 4px 12px rgba(37,99,235,.24); user-select: none; }
|
|
@@ -111,29 +111,29 @@ button.primary:hover { border-color: #000; background: #000; color: #fff; }
|
|
|
111
111
|
.thread-meta .card-process-count { display: inline-flex; align-items: center; min-height: 18px; margin-left: auto; border-radius: 9px; background: #eef4ff; padding: 0 6px; color: #3478f6; font-size: 10px; font-weight: 650; white-space: nowrap; }
|
|
112
112
|
.thread-meta .card-process-count::before { content: none; }
|
|
113
113
|
.thread-meta .card-error-status { color: #b42318; font-weight: 650; }
|
|
114
|
-
.thread-answer { min-width: 0; min-height: 0; margin: 10px 14px; overflow-x: hidden; overflow-y: auto; color: #526174; font-size: 12px; line-height: 1.58; overflow-wrap: anywhere; overscroll-behavior: contain; scrollbar-color: #9ca3af transparent; scrollbar-width: thin; }
|
|
115
|
-
.thread-answer::-webkit-scrollbar { width: 6px; height: 0; }
|
|
116
|
-
.thread-answer::-webkit-scrollbar-track { background: transparent; }
|
|
117
|
-
.thread-answer::-webkit-scrollbar-thumb { border: 2px solid transparent; border-radius: 999px; background: #9ca3af; background-clip: padding-box; }
|
|
118
|
-
.thread-answer::-webkit-scrollbar-thumb:hover { background: #6b7280; }
|
|
119
|
-
.thread-answer p { margin: 0 0 8px; overflow-wrap: anywhere; }
|
|
120
|
-
.thread-answer h1, .thread-answer h2, .thread-answer h3 { margin: 0 0 8px; color: #334155; font-size: 13px; line-height: 1.4; }
|
|
121
|
-
.thread-answer ul, .thread-answer ol { margin: 0 0 8px; padding-left: 19px; }
|
|
122
|
-
.thread-answer li + li { margin-top: 3px; }
|
|
123
|
-
.thread-answer code { overflow-wrap: anywhere; border-radius: 3px; background: #eef2f5; padding: 1px 3px; color: #334155; font-family: "Cascadia Code", Consolas, monospace; font-size: 11px; }
|
|
124
|
-
.thread-answer pre { margin: 0 0 8px; max-width: 100%; overflow-x: auto; border: 1px solid #e0e7ee; border-radius: 4px; background: #fff; padding: 8px; white-space: pre-wrap; overflow-wrap: anywhere; }
|
|
125
|
-
.thread-answer pre code { background: transparent; padding: 0; }
|
|
126
|
-
.thread-answer table { display: block; max-width: 100%; margin: 0 0 8px; overflow-x: auto; border-collapse: collapse; font-size: 11px; }
|
|
127
|
-
.thread-answer th, .thread-answer td { border: 1px solid #d8e0e8; padding: 4px 6px; text-align: left; overflow-wrap: anywhere; white-space: normal; }
|
|
128
|
-
.thread-answer th { background: #f5f7fa; font-weight: 720; }
|
|
129
|
-
.thread-answer-empty { color: #94a3b8; }
|
|
114
|
+
.thread-answer { min-width: 0; min-height: 0; margin: 10px 14px; overflow-x: hidden; overflow-y: auto; color: #526174; font-size: 12px; line-height: 1.58; overflow-wrap: anywhere; overscroll-behavior: contain; scrollbar-color: #9ca3af transparent; scrollbar-width: thin; }
|
|
115
|
+
.thread-answer::-webkit-scrollbar { width: 6px; height: 0; }
|
|
116
|
+
.thread-answer::-webkit-scrollbar-track { background: transparent; }
|
|
117
|
+
.thread-answer::-webkit-scrollbar-thumb { border: 2px solid transparent; border-radius: 999px; background: #9ca3af; background-clip: padding-box; }
|
|
118
|
+
.thread-answer::-webkit-scrollbar-thumb:hover { background: #6b7280; }
|
|
119
|
+
.thread-answer p { margin: 0 0 8px; overflow-wrap: anywhere; }
|
|
120
|
+
.thread-answer h1, .thread-answer h2, .thread-answer h3 { margin: 0 0 8px; color: #334155; font-size: 13px; line-height: 1.4; }
|
|
121
|
+
.thread-answer ul, .thread-answer ol { margin: 0 0 8px; padding-left: 19px; }
|
|
122
|
+
.thread-answer li + li { margin-top: 3px; }
|
|
123
|
+
.thread-answer code { overflow-wrap: anywhere; border-radius: 3px; background: #eef2f5; padding: 1px 3px; color: #334155; font-family: "Cascadia Code", Consolas, monospace; font-size: 11px; }
|
|
124
|
+
.thread-answer pre { margin: 0 0 8px; max-width: 100%; overflow-x: auto; border: 1px solid #e0e7ee; border-radius: 4px; background: #fff; padding: 8px; white-space: pre-wrap; overflow-wrap: anywhere; }
|
|
125
|
+
.thread-answer pre code { background: transparent; padding: 0; }
|
|
126
|
+
.thread-answer table { display: block; max-width: 100%; margin: 0 0 8px; overflow-x: auto; border-collapse: collapse; font-size: 11px; }
|
|
127
|
+
.thread-answer th, .thread-answer td { border: 1px solid #d8e0e8; padding: 4px 6px; text-align: left; overflow-wrap: anywhere; white-space: normal; }
|
|
128
|
+
.thread-answer th { background: #f5f7fa; font-weight: 720; }
|
|
129
|
+
.thread-answer-empty { color: #94a3b8; }
|
|
130
130
|
.thread-answer-pending, .message-pending p { color: #374151; font-style: italic; }
|
|
131
131
|
.thread-answer-error { display: -webkit-box; margin: 8px 0 0; overflow: hidden; color: #b42318; font-weight: 620; line-height: 1.55; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }
|
|
132
|
-
.thread-card footer { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 4px; padding: 7px; border-top: 1px solid #edf0f3; }
|
|
133
|
-
.thread-card footer button { min-height: 26px; padding: 0 7px; border: 0; display: inline-flex; align-items: center; gap: 4px; color: #526174; font-size: 11px; }
|
|
134
|
-
.thread-card footer button svg { width: 13px; height: 13px; flex: none; }
|
|
135
|
-
.thread-card footer button:hover { background: #f3f4f6; color: #111827; border-radius: 6px; }
|
|
136
|
-
.thread-card footer .compare-button { margin-right: auto; color: #374151; }
|
|
132
|
+
.thread-card footer { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 4px; padding: 7px; border-top: 1px solid #edf0f3; }
|
|
133
|
+
.thread-card footer button { min-height: 26px; padding: 0 7px; border: 0; display: inline-flex; align-items: center; gap: 4px; color: #526174; font-size: 11px; }
|
|
134
|
+
.thread-card footer button svg { width: 13px; height: 13px; flex: none; }
|
|
135
|
+
.thread-card footer button:hover { background: #f3f4f6; color: #111827; border-radius: 6px; }
|
|
136
|
+
.thread-card footer .compare-button { margin-right: auto; color: #374151; }
|
|
137
137
|
.thread-card footer .compare-button.selected { background: #e5e7eb; color: #111827; }
|
|
138
138
|
.card-inspector { position: absolute; z-index: 30; top: 0; right: 0; bottom: 0; display: flex; width: min(460px, calc(100% - 48px)); min-width: 360px; flex-direction: column; border-left: 1px solid #dbe3ec; background: #fff; opacity: 1; transform: translateX(0); transition: transform 180ms cubic-bezier(.23,1,.32,1), opacity 150ms ease-out; }
|
|
139
139
|
.card-inspector.is-opening, .card-inspector.is-closing { opacity: 0; transform: translateX(28px); }
|
|
@@ -173,7 +173,7 @@ button.primary:hover { border-color: #000; background: #000; color: #fff; }
|
|
|
173
173
|
.card-inspector-actions button svg { width: 13px; height: 13px; flex: none; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.4; }
|
|
174
174
|
.card-inspector-actions .primary { border-color: #3478f6; background: #3478f6; color: #fff; }
|
|
175
175
|
.card-inspector-actions .primary:hover { border-color: #2563eb; background: #2563eb; }
|
|
176
|
-
.draft-card { z-index: 2; height: auto; min-height: 228px; border-style: dashed; border-color: #9ca3af; box-shadow: 0 7px 19px rgba(17,24,39,.1); }
|
|
176
|
+
.draft-card { z-index: 2; height: auto; min-height: 228px; border-style: dashed; border-color: #9ca3af; box-shadow: 0 7px 19px rgba(17,24,39,.1); }
|
|
177
177
|
.draft-card strong { color: #1f2937; font-size: 13px; }
|
|
178
178
|
.draft-branch-form { display: grid; justify-items: center; gap: 10px; padding: 10px 12px 12px; }
|
|
179
179
|
.draft-quick-phrases { display: flex; width: 100%; flex-wrap: wrap; gap: 6px; }
|
|
@@ -192,142 +192,142 @@ button.primary:hover { border-color: #000; background: #000; color: #fff; }
|
|
|
192
192
|
.draft-quick-editor-close { justify-self: end; min-height: 26px; border: 0; background: transparent; padding: 0 6px; color: #64748b; font-size: 11px; }
|
|
193
193
|
.draft-quick-editor-close:hover { background: #f3f4f6; color: #111827; }
|
|
194
194
|
.draft-branch-form textarea { width: 100%; min-height: 104px; resize: vertical; border: 1px solid #cbd8e3; border-radius: 5px; padding: 8px 12px; color: #334155; outline-color: #3478f6; }
|
|
195
|
-
.draft-actions { display: flex; width: 100%; justify-content: flex-end; gap: 8px; }
|
|
196
|
-
.draft-actions button { display: grid; width: 32px; height: 32px; min-height: 32px; place-items: center; border-radius: 50%; background: #fff; padding: 0; color: #64748b; line-height: 0; }
|
|
197
|
-
.draft-actions button.primary { border-color: #3478f6; background: #3478f6; color: #fff; }
|
|
198
|
-
.draft-actions svg { display: block; width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; }
|
|
199
|
-
.empty-canvas, .compare-empty { display: grid; align-content: center; justify-items: center; height: 100%; padding: 32px; text-align: center; }
|
|
200
|
-
.empty-canvas strong, .compare-empty strong { color: #334155; font-size: 16px; }
|
|
201
|
-
.empty-canvas p, .compare-empty p { max-width: 460px; color: #64748b; font-size: 13px; line-height: 1.65; }
|
|
202
|
-
.empty-canvas div { display: flex; gap: 8px; }
|
|
203
|
-
.detail-view { box-sizing: border-box; width: min(880px, 100%); height: 100%; min-height: 0; flex: 1; display: flex; flex-direction: column; margin: 0 auto; background: #fbfcfe; }
|
|
204
|
-
.detail-head { flex: none; display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; padding: 34px 38px 18px; border-bottom: 1px solid #e7edf3; }
|
|
205
|
-
.detail-head-title { min-width: 0; }
|
|
206
|
-
.detail-head-meta { display: flex; align-items: center; gap: 9px; }
|
|
207
|
-
.detail-badge { display: inline-flex; align-items: center; gap: 5px; border-radius: 999px; background: #eaf0fa; padding: 3px 9px; color: #3b6fd4; font-size: 11px; font-weight: 750; letter-spacing: .05em; }
|
|
208
|
-
.detail-badge::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
|
|
209
|
-
.detail-subtitle { overflow: hidden; color: #8a97a8; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
|
|
210
|
-
.detail-head h1 { margin: 10px 0 0; overflow-wrap: anywhere; color: #152033; font-size: 21px; font-weight: 650; line-height: 1.35; letter-spacing: 0; }
|
|
211
|
-
.detail-head-actions { flex: none; display: flex; gap: 8px; }
|
|
212
|
-
.detail-head-actions button { min-height: 32px; border: 1px solid #d9e1ea; border-radius: 7px; background: #fff; padding: 0 12px; color: #3d4a5c; font-size: 12px; font-weight: 600; }
|
|
213
|
-
.detail-head-actions button:hover { border-color: #b9c7d8; background: #f4f7fb; }
|
|
214
|
-
.detail-head-actions button.primary { border-color: #3478f6; background: #3478f6; color: #fff; }
|
|
215
|
-
.detail-head-actions button.primary:hover { background: #2563eb; }
|
|
216
|
-
.detail-scroll { flex: 1; min-height: 0; display: flex; flex-direction: column; gap: 12px; overflow-y: auto; padding: 22px 38px 24px; }
|
|
217
|
-
.note-empty { padding: 34px 25px; border: 1px dashed #cbd5df; border-radius: 10px; color: #8a97a8; font-size: 13px; text-align: center; }
|
|
218
|
-
.message { padding: 13px 16px; border: 1px solid #e2e8f0; border-radius: 11px; background: #fff; box-shadow: 0 1px 2px rgba(15,23,42,.03); }
|
|
219
|
-
.message header { display: flex; align-items: center; gap: 7px; color: #475569; font-size: 11px; font-weight: 650; }
|
|
220
|
-
.message time { color: #94a3b8; font-weight: 400; }
|
|
221
|
-
.message-role { color: #334155; }
|
|
222
|
-
.message-avatar { flex: none; width: 18px; height: 18px; border-radius: 50%; background: linear-gradient(135deg, #3478f6, #7c3aed); }
|
|
223
|
-
.message-user { align-self: flex-end; max-width: 84%; border-color: transparent; background: #eaf1ff; box-shadow: none; }
|
|
224
|
-
.message-user header { justify-content: flex-end; color: #5a78b0; }
|
|
225
|
-
.message-user .message-body p { color: #27375f; }
|
|
226
|
-
.message-assistant { border-left: 3px solid #3478f6; }
|
|
227
|
-
.message-error { border-left: 3px solid #dc2626; background: #fef7f7; }
|
|
228
|
-
.message-todo { border-left: 3px solid #b45309; }
|
|
229
|
-
.message-tool, .message-tool-result { border-left: 3px solid #6b7280; }
|
|
230
|
-
.message-pending { border-style: dashed; }
|
|
231
|
-
.message-collapsible.expanded { box-shadow: 0 2px 10px rgba(15,23,42,.06); }
|
|
232
|
-
.message-body { margin-top: 8px; }
|
|
233
|
-
.message-body > * + * { margin-top: 8px; }
|
|
234
|
-
.message-body p { margin: 0; overflow-wrap: anywhere; color: #334155; font-size: 14px; line-height: 1.75; white-space: pre-wrap; }
|
|
235
|
-
.message-body ul, .message-body ol { margin: 0; padding-left: 20px; }
|
|
236
|
-
.message-body li + li { margin-top: 4px; }
|
|
237
|
-
.message-body h1, .message-body h2, .message-body h3 { margin: 0; color: #1e293b; font-size: 15px; }
|
|
238
|
-
.message-body blockquote { margin: 0; border-left: 3px solid #dbe3ec; padding-left: 10px; color: #64748b; }
|
|
239
|
-
.message-body code { overflow-wrap: anywhere; border-radius: 3px; background: #eef2f5; padding: 1px 3px; color: #334155; font-family: "Cascadia Code", Consolas, monospace; font-size: 12px; }
|
|
240
|
-
.message-body pre { max-width: 100%; margin: 0; overflow-x: auto; border: 1px solid #e0e7ee; border-radius: 6px; background: #fff; padding: 10px 12px; white-space: pre-wrap; overflow-wrap: anywhere; }
|
|
241
|
-
.message-body pre code { background: transparent; padding: 0; font-size: 12px; }
|
|
242
|
-
.message-body table { display: block; max-width: 100%; margin: 0; overflow-x: auto; border-collapse: collapse; font-size: 12px; }
|
|
243
|
-
.message-body th, .message-body td { border: 1px solid #d8e0e8; padding: 5px 8px; text-align: left; overflow-wrap: anywhere; white-space: normal; }
|
|
244
|
-
.message-body th { background: #f5f7fa; font-weight: 720; }
|
|
245
|
-
.message-branch { display: inline-flex; align-items: center; gap: 4px; min-height: 22px; margin-left: auto; border: 0; border-radius: 5px; background: transparent; padding: 0 6px; color: #8a97a8; font-size: 11px; }
|
|
246
|
-
.message-branch:hover { background: #eef4ff; color: #3478f6; }
|
|
247
|
-
.message-branch svg { width: 12px; height: 12px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; }
|
|
248
|
-
.message-fold { display: grid; width: 24px; min-height: 24px; place-items: center; margin-left: 0; border: 0; border-radius: 50%; background: transparent; padding: 0; color: #94a3b8; }
|
|
249
|
-
.message-fold:hover { background: #edf3ff !important; color: #3478f6 !important; }
|
|
250
|
-
.message-fold svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; transition: transform .15s ease; }
|
|
251
|
-
.message-collapsible.expanded .message-fold svg { transform: rotate(90deg); }
|
|
252
|
-
.message-summary { overflow: hidden; color: #64748b !important; text-overflow: ellipsis; white-space: nowrap; }
|
|
253
|
-
.message-streaming { display: inline-flex; align-items: center; gap: 6px; color: #6b7280 !important; font-style: italic; }
|
|
254
|
-
.streaming-dot { width: 6px; height: 6px; border-radius: 50%; background: #94a3b8; animation: streaming-pulse 1.1s ease-in-out infinite; }
|
|
255
|
-
@keyframes streaming-pulse { 0%, 100% { opacity: .3; } 50% { opacity: 1; } }
|
|
256
|
-
.process-records { margin-top: 10px; border-top: 1px dashed #e2e8f0; padding-top: 8px; }
|
|
257
|
-
.process-records-fold { display: flex; width: 100%; align-items: center; justify-content: space-between; gap: 8px; border: 0; border-radius: 6px; background: #f8fafc; padding: 7px 10px; color: #475569; font-size: 12px; font-weight: 620; text-align: left; }
|
|
258
|
-
.process-records-fold:hover { background: #edf3ff; color: #3478f6; }
|
|
259
|
-
.process-count { display: grid; min-width: 20px; height: 20px; place-items: center; border-radius: 10px; background: #e2e8f0; color: #64748b; font-size: 11px; font-weight: 720; }
|
|
260
|
-
.process-entry { margin-top: 8px; border: 1px solid #e2e8f0; border-radius: 6px; background: #fff; }
|
|
261
|
-
.process-entry-fold { display: flex; width: 100%; align-items: center; justify-content: space-between; gap: 8px; border: 0; background: transparent; padding: 8px 10px; color: #334155; font-size: 12px; text-align: left; }
|
|
262
|
-
.process-entry-fold:hover { background: #f8fafc; }
|
|
263
|
-
.process-entry-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
|
|
264
|
-
.process-status { flex: none; font-size: 11px; }
|
|
265
|
-
.process-status-done { color: #0f766e; }
|
|
266
|
-
.process-status-pending { color: #b45309; }
|
|
267
|
-
.process-status-error { color: #b91c1c; }
|
|
268
|
-
.process-entry-body { display: grid; gap: 8px; padding: 0 10px 10px; }
|
|
269
|
-
.process-args, .process-result, .process-error { margin: 0; padding: 8px 10px; border-radius: 5px; background: #f1f5f9; overflow: auto; color: #334155; font-size: 12px; line-height: 1.55; white-space: pre-wrap; }
|
|
270
|
-
.process-error { background: #fef2f2; color: #991b1b; }
|
|
271
|
-
.message-composer { flex: none; display: grid; grid-template-columns: 1fr auto; gap: 10px; align-items: end; padding: 14px 38px 20px; border-top: 1px solid #e7edf3; background: #fbfcfe; }
|
|
272
|
-
.message-composer textarea { min-height: 44px; max-height: 160px; resize: vertical; border: 1px solid #dbe3ec; border-radius: 10px; background: #fff; padding: 11px 13px; color: #334155; font-size: 13px; line-height: 1.6; outline-color: #3478f6; box-shadow: 0 1px 3px rgba(15,23,42,.05); }
|
|
273
|
-
.message-composer button { min-height: 40px; border: 0; border-radius: 10px; background: #3478f6; padding: 0 18px; color: #fff; font-size: 13px; font-weight: 650; }
|
|
274
|
-
.message-composer button:hover { background: #2563eb; }
|
|
275
|
-
.message-composer button:disabled { background: #b9c7d8; cursor: not-allowed; }
|
|
276
|
-
.compare-view { height: 100%; overflow: auto; padding: 43px 38px; }
|
|
277
|
-
.compare-view header { width: min(1050px, 100%); margin: 0 auto 24px; }
|
|
278
|
-
.compare-columns { display: grid; width: min(1050px, 100%); grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin: 0 auto; }
|
|
279
|
-
.compare-columns article { overflow: hidden; border: 1px solid #dbe3eb; border-radius: 7px; background: #fff; }
|
|
280
|
-
.compare-title { gap: 8px; padding: 16px; border-bottom: 1px solid #e8edf2; }
|
|
281
|
-
.compare-title .topic-dot { background: var(--thread-color, #374151); }
|
|
282
|
-
.compare-title h2 { min-width: 0; flex: 1; margin: 0; overflow: hidden; color: #1e293b; font-size: 15px; text-overflow: ellipsis; white-space: nowrap; }
|
|
283
|
-
.compare-title button { min-height: 27px; padding: 0 7px; font-size: 11px; }
|
|
284
|
-
.compare-meta { margin: 12px 16px; color: #94a3b8; font-size: 11px; }
|
|
285
|
-
.compare-notes { display: grid; gap: 1px; padding: 0 16px 16px; }
|
|
286
|
-
.compare-notes p { margin: 0; padding: 11px 0; border-top: 1px solid #eef2f5; color: #475569; font-size: 13px; line-height: 1.6; white-space: pre-wrap; }
|
|
195
|
+
.draft-actions { display: flex; width: 100%; justify-content: flex-end; gap: 8px; }
|
|
196
|
+
.draft-actions button { display: grid; width: 32px; height: 32px; min-height: 32px; place-items: center; border-radius: 50%; background: #fff; padding: 0; color: #64748b; line-height: 0; }
|
|
197
|
+
.draft-actions button.primary { border-color: #3478f6; background: #3478f6; color: #fff; }
|
|
198
|
+
.draft-actions svg { display: block; width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; }
|
|
199
|
+
.empty-canvas, .compare-empty { display: grid; align-content: center; justify-items: center; height: 100%; padding: 32px; text-align: center; }
|
|
200
|
+
.empty-canvas strong, .compare-empty strong { color: #334155; font-size: 16px; }
|
|
201
|
+
.empty-canvas p, .compare-empty p { max-width: 460px; color: #64748b; font-size: 13px; line-height: 1.65; }
|
|
202
|
+
.empty-canvas div { display: flex; gap: 8px; }
|
|
203
|
+
.detail-view { box-sizing: border-box; width: min(880px, 100%); height: 100%; min-height: 0; flex: 1; display: flex; flex-direction: column; margin: 0 auto; background: #fbfcfe; }
|
|
204
|
+
.detail-head { flex: none; display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; padding: 34px 38px 18px; border-bottom: 1px solid #e7edf3; }
|
|
205
|
+
.detail-head-title { min-width: 0; }
|
|
206
|
+
.detail-head-meta { display: flex; align-items: center; gap: 9px; }
|
|
207
|
+
.detail-badge { display: inline-flex; align-items: center; gap: 5px; border-radius: 999px; background: #eaf0fa; padding: 3px 9px; color: #3b6fd4; font-size: 11px; font-weight: 750; letter-spacing: .05em; }
|
|
208
|
+
.detail-badge::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
|
|
209
|
+
.detail-subtitle { overflow: hidden; color: #8a97a8; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
|
|
210
|
+
.detail-head h1 { margin: 10px 0 0; overflow-wrap: anywhere; color: #152033; font-size: 21px; font-weight: 650; line-height: 1.35; letter-spacing: 0; }
|
|
211
|
+
.detail-head-actions { flex: none; display: flex; gap: 8px; }
|
|
212
|
+
.detail-head-actions button { min-height: 32px; border: 1px solid #d9e1ea; border-radius: 7px; background: #fff; padding: 0 12px; color: #3d4a5c; font-size: 12px; font-weight: 600; }
|
|
213
|
+
.detail-head-actions button:hover { border-color: #b9c7d8; background: #f4f7fb; }
|
|
214
|
+
.detail-head-actions button.primary { border-color: #3478f6; background: #3478f6; color: #fff; }
|
|
215
|
+
.detail-head-actions button.primary:hover { background: #2563eb; }
|
|
216
|
+
.detail-scroll { flex: 1; min-height: 0; display: flex; flex-direction: column; gap: 12px; overflow-y: auto; padding: 22px 38px 24px; }
|
|
217
|
+
.note-empty { padding: 34px 25px; border: 1px dashed #cbd5df; border-radius: 10px; color: #8a97a8; font-size: 13px; text-align: center; }
|
|
218
|
+
.message { padding: 13px 16px; border: 1px solid #e2e8f0; border-radius: 11px; background: #fff; box-shadow: 0 1px 2px rgba(15,23,42,.03); }
|
|
219
|
+
.message header { display: flex; align-items: center; gap: 7px; color: #475569; font-size: 11px; font-weight: 650; }
|
|
220
|
+
.message time { color: #94a3b8; font-weight: 400; }
|
|
221
|
+
.message-role { color: #334155; }
|
|
222
|
+
.message-avatar { flex: none; width: 18px; height: 18px; border-radius: 50%; background: linear-gradient(135deg, #3478f6, #7c3aed); }
|
|
223
|
+
.message-user { align-self: flex-end; max-width: 84%; border-color: transparent; background: #eaf1ff; box-shadow: none; }
|
|
224
|
+
.message-user header { justify-content: flex-end; color: #5a78b0; }
|
|
225
|
+
.message-user .message-body p { color: #27375f; }
|
|
226
|
+
.message-assistant { border-left: 3px solid #3478f6; }
|
|
227
|
+
.message-error { border-left: 3px solid #dc2626; background: #fef7f7; }
|
|
228
|
+
.message-todo { border-left: 3px solid #b45309; }
|
|
229
|
+
.message-tool, .message-tool-result { border-left: 3px solid #6b7280; }
|
|
230
|
+
.message-pending { border-style: dashed; }
|
|
231
|
+
.message-collapsible.expanded { box-shadow: 0 2px 10px rgba(15,23,42,.06); }
|
|
232
|
+
.message-body { margin-top: 8px; }
|
|
233
|
+
.message-body > * + * { margin-top: 8px; }
|
|
234
|
+
.message-body p { margin: 0; overflow-wrap: anywhere; color: #334155; font-size: 14px; line-height: 1.75; white-space: pre-wrap; }
|
|
235
|
+
.message-body ul, .message-body ol { margin: 0; padding-left: 20px; }
|
|
236
|
+
.message-body li + li { margin-top: 4px; }
|
|
237
|
+
.message-body h1, .message-body h2, .message-body h3 { margin: 0; color: #1e293b; font-size: 15px; }
|
|
238
|
+
.message-body blockquote { margin: 0; border-left: 3px solid #dbe3ec; padding-left: 10px; color: #64748b; }
|
|
239
|
+
.message-body code { overflow-wrap: anywhere; border-radius: 3px; background: #eef2f5; padding: 1px 3px; color: #334155; font-family: "Cascadia Code", Consolas, monospace; font-size: 12px; }
|
|
240
|
+
.message-body pre { max-width: 100%; margin: 0; overflow-x: auto; border: 1px solid #e0e7ee; border-radius: 6px; background: #fff; padding: 10px 12px; white-space: pre-wrap; overflow-wrap: anywhere; }
|
|
241
|
+
.message-body pre code { background: transparent; padding: 0; font-size: 12px; }
|
|
242
|
+
.message-body table { display: block; max-width: 100%; margin: 0; overflow-x: auto; border-collapse: collapse; font-size: 12px; }
|
|
243
|
+
.message-body th, .message-body td { border: 1px solid #d8e0e8; padding: 5px 8px; text-align: left; overflow-wrap: anywhere; white-space: normal; }
|
|
244
|
+
.message-body th { background: #f5f7fa; font-weight: 720; }
|
|
245
|
+
.message-branch { display: inline-flex; align-items: center; gap: 4px; min-height: 22px; margin-left: auto; border: 0; border-radius: 5px; background: transparent; padding: 0 6px; color: #8a97a8; font-size: 11px; }
|
|
246
|
+
.message-branch:hover { background: #eef4ff; color: #3478f6; }
|
|
247
|
+
.message-branch svg { width: 12px; height: 12px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; }
|
|
248
|
+
.message-fold { display: grid; width: 24px; min-height: 24px; place-items: center; margin-left: 0; border: 0; border-radius: 50%; background: transparent; padding: 0; color: #94a3b8; }
|
|
249
|
+
.message-fold:hover { background: #edf3ff !important; color: #3478f6 !important; }
|
|
250
|
+
.message-fold svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; transition: transform .15s ease; }
|
|
251
|
+
.message-collapsible.expanded .message-fold svg { transform: rotate(90deg); }
|
|
252
|
+
.message-summary { overflow: hidden; color: #64748b !important; text-overflow: ellipsis; white-space: nowrap; }
|
|
253
|
+
.message-streaming { display: inline-flex; align-items: center; gap: 6px; color: #6b7280 !important; font-style: italic; }
|
|
254
|
+
.streaming-dot { width: 6px; height: 6px; border-radius: 50%; background: #94a3b8; animation: streaming-pulse 1.1s ease-in-out infinite; }
|
|
255
|
+
@keyframes streaming-pulse { 0%, 100% { opacity: .3; } 50% { opacity: 1; } }
|
|
256
|
+
.process-records { margin-top: 10px; border-top: 1px dashed #e2e8f0; padding-top: 8px; }
|
|
257
|
+
.process-records-fold { display: flex; width: 100%; align-items: center; justify-content: space-between; gap: 8px; border: 0; border-radius: 6px; background: #f8fafc; padding: 7px 10px; color: #475569; font-size: 12px; font-weight: 620; text-align: left; }
|
|
258
|
+
.process-records-fold:hover { background: #edf3ff; color: #3478f6; }
|
|
259
|
+
.process-count { display: grid; min-width: 20px; height: 20px; place-items: center; border-radius: 10px; background: #e2e8f0; color: #64748b; font-size: 11px; font-weight: 720; }
|
|
260
|
+
.process-entry { margin-top: 8px; border: 1px solid #e2e8f0; border-radius: 6px; background: #fff; }
|
|
261
|
+
.process-entry-fold { display: flex; width: 100%; align-items: center; justify-content: space-between; gap: 8px; border: 0; background: transparent; padding: 8px 10px; color: #334155; font-size: 12px; text-align: left; }
|
|
262
|
+
.process-entry-fold:hover { background: #f8fafc; }
|
|
263
|
+
.process-entry-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
|
|
264
|
+
.process-status { flex: none; font-size: 11px; }
|
|
265
|
+
.process-status-done { color: #0f766e; }
|
|
266
|
+
.process-status-pending { color: #b45309; }
|
|
267
|
+
.process-status-error { color: #b91c1c; }
|
|
268
|
+
.process-entry-body { display: grid; gap: 8px; padding: 0 10px 10px; }
|
|
269
|
+
.process-args, .process-result, .process-error { margin: 0; padding: 8px 10px; border-radius: 5px; background: #f1f5f9; overflow: auto; color: #334155; font-size: 12px; line-height: 1.55; white-space: pre-wrap; }
|
|
270
|
+
.process-error { background: #fef2f2; color: #991b1b; }
|
|
271
|
+
.message-composer { flex: none; display: grid; grid-template-columns: 1fr auto; gap: 10px; align-items: end; padding: 14px 38px 20px; border-top: 1px solid #e7edf3; background: #fbfcfe; }
|
|
272
|
+
.message-composer textarea { min-height: 44px; max-height: 160px; resize: vertical; border: 1px solid #dbe3ec; border-radius: 10px; background: #fff; padding: 11px 13px; color: #334155; font-size: 13px; line-height: 1.6; outline-color: #3478f6; box-shadow: 0 1px 3px rgba(15,23,42,.05); }
|
|
273
|
+
.message-composer button { min-height: 40px; border: 0; border-radius: 10px; background: #3478f6; padding: 0 18px; color: #fff; font-size: 13px; font-weight: 650; }
|
|
274
|
+
.message-composer button:hover { background: #2563eb; }
|
|
275
|
+
.message-composer button:disabled { background: #b9c7d8; cursor: not-allowed; }
|
|
276
|
+
.compare-view { height: 100%; overflow: auto; padding: 43px 38px; }
|
|
277
|
+
.compare-view header { width: min(1050px, 100%); margin: 0 auto 24px; }
|
|
278
|
+
.compare-columns { display: grid; width: min(1050px, 100%); grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin: 0 auto; }
|
|
279
|
+
.compare-columns article { overflow: hidden; border: 1px solid #dbe3eb; border-radius: 7px; background: #fff; }
|
|
280
|
+
.compare-title { gap: 8px; padding: 16px; border-bottom: 1px solid #e8edf2; }
|
|
281
|
+
.compare-title .topic-dot { background: var(--thread-color, #374151); }
|
|
282
|
+
.compare-title h2 { min-width: 0; flex: 1; margin: 0; overflow: hidden; color: #1e293b; font-size: 15px; text-overflow: ellipsis; white-space: nowrap; }
|
|
283
|
+
.compare-title button { min-height: 27px; padding: 0 7px; font-size: 11px; }
|
|
284
|
+
.compare-meta { margin: 12px 16px; color: #94a3b8; font-size: 11px; }
|
|
285
|
+
.compare-notes { display: grid; gap: 1px; padding: 0 16px 16px; }
|
|
286
|
+
.compare-notes p { margin: 0; padding: 11px 0; border-top: 1px solid #eef2f5; color: #475569; font-size: 13px; line-height: 1.6; white-space: pre-wrap; }
|
|
287
287
|
@media (max-width: 760px) { .synapse-shell { --sidebar-width: 200px; --sidebar-half: 100px; } .synapse-shell.sidebar-collapsed { --sidebar-width: 56px; --sidebar-half: 28px; } .sidebar { padding: 6px 10px; } .detail-head { display: grid; gap: 12px; padding: 22px 18px 14px; } .detail-scroll { padding: 16px 18px 20px; } .message-composer { padding: 12px 18px 16px; } .message-user { max-width: 92%; } .compare-view { padding: 26px 18px; } .compare-columns { grid-template-columns: 1fr; } .topbar { padding: 0 10px; } .brand strong { display: none; } .card-inspector { top: auto; width: 100%; min-width: 0; max-height: 78%; border-top: 1px solid #dbe3ec; border-left: 0; } .card-inspector.is-opening, .card-inspector.is-closing { transform: translateY(24px); } }
|
|
288
288
|
@media (max-width: 560px) { .synapse-shell { min-width: 0; grid-template-columns: 1fr; } .sidebar { display: none; } .topbar, .main-stage { grid-column: 1; } .view-switch { left: 50%; } .view-switch button { padding: 0 7px; } .top-actions > button { font-size: 11px; padding: 0 7px; } .thread-card { width: 280px; } }
|
|
289
289
|
@media (prefers-reduced-motion: reduce) { .card-inspector { transition: opacity 120ms ease; } .card-inspector.is-opening, .card-inspector.is-closing { transform: none; } }
|
|
290
|
-
|
|
291
|
-
/* ── Dark theme: follows DSH's body[data-ds-dark-theme] via synapse:theme ── */
|
|
292
|
-
[data-theme="dark"] { color-scheme: dark; }
|
|
293
|
-
[data-theme="dark"] body { background: #0f1115; color: #e6e8eb; }
|
|
294
|
-
[data-theme="dark"] .synapse-shell { background: #0f1115; }
|
|
295
|
-
[data-theme="dark"] .sidebar { border-right-color: #26282d; background: #15171b; }
|
|
296
|
-
[data-theme="dark"] .topbar { background: #15171b; }
|
|
297
|
-
[data-theme="dark"] .main-stage { background: #0f1115; }
|
|
298
|
-
[data-theme="dark"] .canvas-tabs { border-bottom-color: #26282d; background: #15171b; }
|
|
299
|
-
[data-theme="dark"] .canvas-tabs button { color: #8f959e; }
|
|
300
|
-
[data-theme="dark"] .canvas-tabs button.active, [data-theme="dark"] .canvas-tabs button:hover { color: #5b8def; border-bottom-color: #5b8def; }
|
|
301
|
-
[data-theme="dark"] .canvas-viewport { background: #0f1115; }
|
|
290
|
+
|
|
291
|
+
/* ── Dark theme: follows DSH's body[data-ds-dark-theme] via synapse:theme ── */
|
|
292
|
+
[data-theme="dark"] { color-scheme: dark; }
|
|
293
|
+
[data-theme="dark"] body { background: #0f1115; color: #e6e8eb; }
|
|
294
|
+
[data-theme="dark"] .synapse-shell { background: #0f1115; }
|
|
295
|
+
[data-theme="dark"] .sidebar { border-right-color: #26282d; background: #15171b; }
|
|
296
|
+
[data-theme="dark"] .topbar { background: #15171b; }
|
|
297
|
+
[data-theme="dark"] .main-stage { background: #0f1115; }
|
|
298
|
+
[data-theme="dark"] .canvas-tabs { border-bottom-color: #26282d; background: #15171b; }
|
|
299
|
+
[data-theme="dark"] .canvas-tabs button { color: #8f959e; }
|
|
300
|
+
[data-theme="dark"] .canvas-tabs button.active, [data-theme="dark"] .canvas-tabs button:hover { color: #5b8def; border-bottom-color: #5b8def; }
|
|
301
|
+
[data-theme="dark"] .canvas-viewport { background: #0f1115; }
|
|
302
302
|
[data-theme="dark"] .canvas-content { background: #0f1115; }
|
|
303
303
|
[data-theme="dark"] .connectors path { stroke: #3a3f47; }
|
|
304
304
|
[data-theme="dark"] .connectors path.active-connector { stroke: #5b8def; }
|
|
305
305
|
[data-theme="dark"] .connectors .draft-connector { stroke: #5b8def; }
|
|
306
|
-
[data-theme="dark"] .thread-card { border-color: #2a2d33; background: #1b1c1f; box-shadow: 0 3px 11px rgba(0,0,0,.35); }
|
|
307
|
-
[data-theme="dark"] .thread-card:hover { border-color: #4a4f57; box-shadow: 0 8px 20px rgba(0,0,0,.45); }
|
|
306
|
+
[data-theme="dark"] .thread-card { border-color: #2a2d33; background: #1b1c1f; box-shadow: 0 3px 11px rgba(0,0,0,.35); }
|
|
307
|
+
[data-theme="dark"] .thread-card:hover { border-color: #4a4f57; box-shadow: 0 8px 20px rgba(0,0,0,.45); }
|
|
308
308
|
[data-theme="dark"] .thread-card.selected { box-shadow: 0 0 0 2px rgba(91,141,239,.4), 0 8px 20px rgba(0,0,0,.45); }
|
|
309
|
-
[data-theme="dark"] .node-handle { border-color: #2a2d33; background: #1b1c1f; }
|
|
310
|
-
[data-theme="dark"] .node-handle::after { color: #737a83; }
|
|
311
|
-
[data-theme="dark"] .thread-title { color: #e6e8eb; }
|
|
312
|
-
[data-theme="dark"] .thread-title:hover { color: #fff; }
|
|
313
|
-
[data-theme="dark"] .graph-continue-button, [data-theme="dark"] .graph-fold-button, [data-theme="dark"] .graph-branch-button { border-color: #4a4f57; background: #1b1c1f; color: #e6e8eb; }
|
|
309
|
+
[data-theme="dark"] .node-handle { border-color: #2a2d33; background: #1b1c1f; }
|
|
310
|
+
[data-theme="dark"] .node-handle::after { color: #737a83; }
|
|
311
|
+
[data-theme="dark"] .thread-title { color: #e6e8eb; }
|
|
312
|
+
[data-theme="dark"] .thread-title:hover { color: #fff; }
|
|
313
|
+
[data-theme="dark"] .graph-continue-button, [data-theme="dark"] .graph-fold-button, [data-theme="dark"] .graph-branch-button { border-color: #4a4f57; background: #1b1c1f; color: #e6e8eb; }
|
|
314
314
|
[data-theme="dark"] .graph-continue-button:hover, [data-theme="dark"] .graph-fold-button:hover, [data-theme="dark"] .graph-branch-button:hover { border-color: #9ca3af; background: #26282d; }
|
|
315
315
|
[data-theme="dark"] .graph-continue-button:focus-visible, [data-theme="dark"] .graph-fold-button:focus-visible, [data-theme="dark"] .graph-branch-button:focus-visible { outline-color: #7ea6f5; }
|
|
316
316
|
[data-theme="dark"] .selection-followup { border-color: #5b8def; background: #5b8def; color: #fff; box-shadow: 0 4px 12px rgba(0,0,0,.35); }
|
|
317
317
|
[data-theme="dark"] .selection-followup:hover { border-color: #7ea6f5; background: #7ea6f5; color: #fff; }
|
|
318
318
|
[data-theme="dark"] .thread-meta { color: #737a83; }
|
|
319
319
|
[data-theme="dark"] .thread-meta .card-process-count { background: #1e2a44; color: #7ea6f5; }
|
|
320
|
-
[data-theme="dark"] .thread-answer { color: #a7adb5; }
|
|
321
|
-
[data-theme="dark"] .thread-answer h1, [data-theme="dark"] .thread-answer h2, [data-theme="dark"] .thread-answer h3 { color: #d7dae0; }
|
|
322
|
-
[data-theme="dark"] .thread-answer code { background: #26282d; color: #d7dae0; }
|
|
323
|
-
[data-theme="dark"] .thread-answer pre { border-color: #2a2d33; background: #15171b; }
|
|
324
|
-
[data-theme="dark"] .thread-answer th, [data-theme="dark"] .thread-answer td { border-color: #2a2d33; }
|
|
325
|
-
[data-theme="dark"] .thread-answer th { background: #222428; }
|
|
326
|
-
[data-theme="dark"] .thread-answer-empty { color: #737a83; }
|
|
327
|
-
[data-theme="dark"] .thread-answer-pending, [data-theme="dark"] .message-pending p { color: #a7adb5; }
|
|
328
|
-
[data-theme="dark"] .thread-card footer { border-top-color: #23262b; }
|
|
329
|
-
[data-theme="dark"] .thread-card footer button { color: #a7adb5; }
|
|
330
|
-
[data-theme="dark"] .thread-card footer button:hover { background: #26282d; color: #e6e8eb; }
|
|
320
|
+
[data-theme="dark"] .thread-answer { color: #a7adb5; }
|
|
321
|
+
[data-theme="dark"] .thread-answer h1, [data-theme="dark"] .thread-answer h2, [data-theme="dark"] .thread-answer h3 { color: #d7dae0; }
|
|
322
|
+
[data-theme="dark"] .thread-answer code { background: #26282d; color: #d7dae0; }
|
|
323
|
+
[data-theme="dark"] .thread-answer pre { border-color: #2a2d33; background: #15171b; }
|
|
324
|
+
[data-theme="dark"] .thread-answer th, [data-theme="dark"] .thread-answer td { border-color: #2a2d33; }
|
|
325
|
+
[data-theme="dark"] .thread-answer th { background: #222428; }
|
|
326
|
+
[data-theme="dark"] .thread-answer-empty { color: #737a83; }
|
|
327
|
+
[data-theme="dark"] .thread-answer-pending, [data-theme="dark"] .message-pending p { color: #a7adb5; }
|
|
328
|
+
[data-theme="dark"] .thread-card footer { border-top-color: #23262b; }
|
|
329
|
+
[data-theme="dark"] .thread-card footer button { color: #a7adb5; }
|
|
330
|
+
[data-theme="dark"] .thread-card footer button:hover { background: #26282d; color: #e6e8eb; }
|
|
331
331
|
[data-theme="dark"] .thread-card footer .compare-button { color: #d7dae0; }
|
|
332
332
|
[data-theme="dark"] .thread-card footer .compare-button.selected { background: #2a2d33; color: #fff; }
|
|
333
333
|
[data-theme="dark"] .card-inspector { border-left-color: #2a2d33; background: #15171b; }
|
|
@@ -356,7 +356,7 @@ button.primary:hover { border-color: #000; background: #000; color: #fff; }
|
|
|
356
356
|
[data-theme="dark"] .card-inspector-actions button:hover { border-color: #4a4f57; background: #26282d; color: #fff; }
|
|
357
357
|
[data-theme="dark"] .card-inspector-actions .primary { border-color: #5b8def; background: #5b8def; color: #fff; }
|
|
358
358
|
[data-theme="dark"] .card-inspector-actions .primary:hover { border-color: #7ea6f5; background: #7ea6f5; }
|
|
359
|
-
[data-theme="dark"] .draft-card { border-color: #4a4f57; box-shadow: 0 7px 19px rgba(0,0,0,.4); }
|
|
359
|
+
[data-theme="dark"] .draft-card { border-color: #4a4f57; box-shadow: 0 7px 19px rgba(0,0,0,.4); }
|
|
360
360
|
[data-theme="dark"] .draft-card strong { color: #e6e8eb; }
|
|
361
361
|
[data-theme="dark"] .draft-quick-phrase, [data-theme="dark"] .draft-quick-phrase-add-button { border-color: #3a3f47; background: #222428; color: #a7adb5; }
|
|
362
362
|
[data-theme="dark"] .draft-quick-phrase:hover, [data-theme="dark"] .draft-quick-phrase-add-button:hover { border-color: #5b8def; background: #1e2a44; color: #7ea6f5; }
|
|
@@ -366,82 +366,82 @@ button.primary:hover { border-color: #000; background: #000; color: #fff; }
|
|
|
366
366
|
[data-theme="dark"] .draft-quick-editor-close { color: #a7adb5; }
|
|
367
367
|
[data-theme="dark"] .draft-quick-editor-close:hover { background: #26282d; color: #e6e8eb; }
|
|
368
368
|
[data-theme="dark"] .draft-branch-form textarea { border-color: #2a2d33; background: #15171b; color: #e6e8eb; }
|
|
369
|
-
[data-theme="dark"] .draft-actions button { background: #1b1c1f; color: #a7adb5; }
|
|
370
|
-
[data-theme="dark"] .draft-actions button.primary { background: #3478f6; color: #fff; }
|
|
371
|
-
[data-theme="dark"] .view-switch { border-color: #2a2d33; background: rgba(21,23,27,.96); }
|
|
372
|
-
[data-theme="dark"] .view-switch button { color: #8f959e; }
|
|
373
|
-
[data-theme="dark"] .view-switch button:hover { background: #26282d; color: #e6e8eb; }
|
|
374
|
-
[data-theme="dark"] .view-switch button.active { background: #e6e8eb; color: #111317; }
|
|
375
|
-
[data-theme="dark"] .canvas-controls span { color: #8f959e; }
|
|
376
|
-
[data-theme="dark"] .sidebar-toggle { color: #a7adb5; }
|
|
377
|
-
[data-theme="dark"] .sidebar-toggle:hover { background: #26282d; color: #e6e8eb; }
|
|
378
|
-
[data-theme="dark"] .new-workspace { border-color: rgba(255,255,255,.12); background: #1b1c1f; color: #e6e8eb; }
|
|
379
|
-
[data-theme="dark"] .new-workspace:hover { border-color: rgba(255,255,255,.22); background: #222428; color: #fff; }
|
|
380
|
-
[data-theme="dark"] .workspace-label, [data-theme="dark"] .sidebar-heading { color: #8f959e; }
|
|
381
|
-
[data-theme="dark"] .workspace-label select { border-color: #2a2d33; background: #15171b; color: #e6e8eb; }
|
|
382
|
-
[data-theme="dark"] .workspace-select svg { stroke: #8f959e; }
|
|
383
|
-
[data-theme="dark"] .tree-row { color: #a7adb5; }
|
|
384
|
-
[data-theme="dark"] .tree-row:hover { background: #26282d; }
|
|
385
|
-
[data-theme="dark"] .tree-row.active { background: #2a2d33; color: #e6e8eb; }
|
|
386
|
-
[data-theme="dark"] .tree-row i { color: #737a83; }
|
|
387
|
-
[data-theme="dark"] .tree-empty { color: #737a83; }
|
|
388
|
-
[data-theme="dark"] .brand::after { background: #e6e8eb; color: #111317; }
|
|
389
|
-
[data-theme="dark"] .empty-canvas strong { color: #d7dae0; }
|
|
390
|
-
[data-theme="dark"] .empty-canvas p { color: #8f959e; }
|
|
391
|
-
[data-theme="dark"] .note-empty { border-color: #2a2d33; color: #8f959e; }
|
|
392
|
-
[data-theme="dark"] .status-message { border-color: #7a2e2e; background: #2b1a1c; color: #f0a3a3; box-shadow: 0 3px 10px rgba(0,0,0,.4); }
|
|
393
|
-
[data-theme="dark"] .status-message button { color: #f0a3a3; }
|
|
394
|
-
[data-theme="dark"] .status-message button:hover { background: #3a2326; }
|
|
395
|
-
[data-theme="dark"] .detail-view { background: #0f1115; }
|
|
396
|
-
[data-theme="dark"] .detail-head { border-bottom-color: #26282d; }
|
|
397
|
-
[data-theme="dark"] .detail-badge { background: #1e2a44; color: #7ea6f5; }
|
|
398
|
-
[data-theme="dark"] .detail-subtitle { color: #737a83; }
|
|
399
|
-
[data-theme="dark"] .detail-head h1 { color: #e6e8eb; }
|
|
400
|
-
[data-theme="dark"] .detail-head-actions button { border-color: #2a2d33; background: #15171b; color: #c6cbd2; }
|
|
401
|
-
[data-theme="dark"] .detail-head-actions button:hover { border-color: #4a4f57; background: #222428; }
|
|
402
|
-
[data-theme="dark"] .detail-head-actions button.primary { border-color: #3478f6; background: #3478f6; color: #fff; }
|
|
403
|
-
[data-theme="dark"] .detail-head-actions button.primary:hover { background: #2563eb; }
|
|
404
|
-
[data-theme="dark"] .message { border-color: #2a2d33; background: #1b1c1f; box-shadow: 0 1px 2px rgba(0,0,0,.25); }
|
|
405
|
-
[data-theme="dark"] .message header { color: #a7adb5; }
|
|
406
|
-
[data-theme="dark"] .message time { color: #737a83; }
|
|
407
|
-
[data-theme="dark"] .message-role { color: #d7dae0; }
|
|
408
|
-
[data-theme="dark"] .message-user { border-color: transparent; background: #1e2a45; box-shadow: none; }
|
|
409
|
-
[data-theme="dark"] .message-user header { color: #8fa9d9; }
|
|
410
|
-
[data-theme="dark"] .message-user .message-body p { color: #c9d4ea; }
|
|
411
|
-
[data-theme="dark"] .message-error { border-left-color: #dc2626; background: #2b1a1c; }
|
|
412
|
-
[data-theme="dark"] .message-collapsible.expanded { box-shadow: 0 2px 10px rgba(0,0,0,.35); }
|
|
413
|
-
[data-theme="dark"] .message-body p { color: #d7dae0; }
|
|
414
|
-
[data-theme="dark"] .message-body h1, [data-theme="dark"] .message-body h2, [data-theme="dark"] .message-body h3 { color: #e6e8eb; }
|
|
415
|
-
[data-theme="dark"] .message-body blockquote { border-left-color: #3a3f47; color: #8f959e; }
|
|
416
|
-
[data-theme="dark"] .message-body code { background: #26282d; color: #d7dae0; }
|
|
417
|
-
[data-theme="dark"] .message-body pre { border-color: #2a2d33; background: #15171b; }
|
|
418
|
-
[data-theme="dark"] .message-body pre code { background: transparent; }
|
|
419
|
-
[data-theme="dark"] .message-body th, [data-theme="dark"] .message-body td { border-color: #2a2d33; }
|
|
420
|
-
[data-theme="dark"] .message-body th { background: #222428; }
|
|
421
|
-
[data-theme="dark"] .message-branch { color: #8f959e; }
|
|
422
|
-
[data-theme="dark"] .message-branch:hover { background: #1e2a44; color: #7ea6f5; }
|
|
423
|
-
[data-theme="dark"] .message-fold { color: #737a83; }
|
|
424
|
-
[data-theme="dark"] .message-fold:hover { background: #1e2a44 !important; color: #7ea6f5 !important; }
|
|
425
|
-
[data-theme="dark"] .message-summary { color: #8f959e !important; }
|
|
426
|
-
[data-theme="dark"] .message-streaming { color: #8f959e !important; }
|
|
427
|
-
[data-theme="dark"] .streaming-dot { background: #737a83; }
|
|
428
|
-
[data-theme="dark"] .process-records { border-top-color: #2a2d33; }
|
|
429
|
-
[data-theme="dark"] .process-records-fold { background: #222428; color: #a7adb5; }
|
|
430
|
-
[data-theme="dark"] .process-records-fold:hover { background: #1e2a44; color: #7ea6f5; }
|
|
431
|
-
[data-theme="dark"] .process-count { background: #2a2d33; color: #8f959e; }
|
|
432
|
-
[data-theme="dark"] .process-entry { border-color: #2a2d33; background: #15171b; }
|
|
433
|
-
[data-theme="dark"] .process-entry-fold { color: #d7dae0; }
|
|
434
|
-
[data-theme="dark"] .process-entry-fold:hover { background: #222428; }
|
|
435
|
-
[data-theme="dark"] .process-status-done { color: #34d399; }
|
|
436
|
-
[data-theme="dark"] .process-status-pending { color: #fbbf24; }
|
|
437
|
-
[data-theme="dark"] .process-status-error { color: #f87171; }
|
|
438
|
-
[data-theme="dark"] .process-args, [data-theme="dark"] .process-result { background: #222428; color: #d7dae0; }
|
|
439
|
-
[data-theme="dark"] .process-error { background: #2b1a1c; color: #f0a3a3; }
|
|
440
|
-
[data-theme="dark"] .message-composer { border-top-color: #26282d; background: #0f1115; }
|
|
441
|
-
[data-theme="dark"] .message-composer textarea { border-color: #2a2d33; background: #15171b; color: #e6e8eb; box-shadow: 0 1px 3px rgba(0,0,0,.3); }
|
|
442
|
-
[data-theme="dark"] .message-composer button:disabled { background: #2a2d33; color: #737a83; }
|
|
443
|
-
[data-theme="dark"] button { border-color: #2a2d33; background: #1b1c1f; color: #d7dae0; }
|
|
444
|
-
[data-theme="dark"] button:hover { border-color: #4a4f57; background: #26282d; color: #fff; }
|
|
369
|
+
[data-theme="dark"] .draft-actions button { background: #1b1c1f; color: #a7adb5; }
|
|
370
|
+
[data-theme="dark"] .draft-actions button.primary { background: #3478f6; color: #fff; }
|
|
371
|
+
[data-theme="dark"] .view-switch { border-color: #2a2d33; background: rgba(21,23,27,.96); }
|
|
372
|
+
[data-theme="dark"] .view-switch button { color: #8f959e; }
|
|
373
|
+
[data-theme="dark"] .view-switch button:hover { background: #26282d; color: #e6e8eb; }
|
|
374
|
+
[data-theme="dark"] .view-switch button.active { background: #e6e8eb; color: #111317; }
|
|
375
|
+
[data-theme="dark"] .canvas-controls span { color: #8f959e; }
|
|
376
|
+
[data-theme="dark"] .sidebar-toggle { color: #a7adb5; }
|
|
377
|
+
[data-theme="dark"] .sidebar-toggle:hover { background: #26282d; color: #e6e8eb; }
|
|
378
|
+
[data-theme="dark"] .new-workspace { border-color: rgba(255,255,255,.12); background: #1b1c1f; color: #e6e8eb; }
|
|
379
|
+
[data-theme="dark"] .new-workspace:hover { border-color: rgba(255,255,255,.22); background: #222428; color: #fff; }
|
|
380
|
+
[data-theme="dark"] .workspace-label, [data-theme="dark"] .sidebar-heading { color: #8f959e; }
|
|
381
|
+
[data-theme="dark"] .workspace-label select { border-color: #2a2d33; background: #15171b; color: #e6e8eb; }
|
|
382
|
+
[data-theme="dark"] .workspace-select svg { stroke: #8f959e; }
|
|
383
|
+
[data-theme="dark"] .tree-row { color: #a7adb5; }
|
|
384
|
+
[data-theme="dark"] .tree-row:hover { background: #26282d; }
|
|
385
|
+
[data-theme="dark"] .tree-row.active { background: #2a2d33; color: #e6e8eb; }
|
|
386
|
+
[data-theme="dark"] .tree-row i { color: #737a83; }
|
|
387
|
+
[data-theme="dark"] .tree-empty { color: #737a83; }
|
|
388
|
+
[data-theme="dark"] .brand::after { background: #e6e8eb; color: #111317; }
|
|
389
|
+
[data-theme="dark"] .empty-canvas strong { color: #d7dae0; }
|
|
390
|
+
[data-theme="dark"] .empty-canvas p { color: #8f959e; }
|
|
391
|
+
[data-theme="dark"] .note-empty { border-color: #2a2d33; color: #8f959e; }
|
|
392
|
+
[data-theme="dark"] .status-message { border-color: #7a2e2e; background: #2b1a1c; color: #f0a3a3; box-shadow: 0 3px 10px rgba(0,0,0,.4); }
|
|
393
|
+
[data-theme="dark"] .status-message button { color: #f0a3a3; }
|
|
394
|
+
[data-theme="dark"] .status-message button:hover { background: #3a2326; }
|
|
395
|
+
[data-theme="dark"] .detail-view { background: #0f1115; }
|
|
396
|
+
[data-theme="dark"] .detail-head { border-bottom-color: #26282d; }
|
|
397
|
+
[data-theme="dark"] .detail-badge { background: #1e2a44; color: #7ea6f5; }
|
|
398
|
+
[data-theme="dark"] .detail-subtitle { color: #737a83; }
|
|
399
|
+
[data-theme="dark"] .detail-head h1 { color: #e6e8eb; }
|
|
400
|
+
[data-theme="dark"] .detail-head-actions button { border-color: #2a2d33; background: #15171b; color: #c6cbd2; }
|
|
401
|
+
[data-theme="dark"] .detail-head-actions button:hover { border-color: #4a4f57; background: #222428; }
|
|
402
|
+
[data-theme="dark"] .detail-head-actions button.primary { border-color: #3478f6; background: #3478f6; color: #fff; }
|
|
403
|
+
[data-theme="dark"] .detail-head-actions button.primary:hover { background: #2563eb; }
|
|
404
|
+
[data-theme="dark"] .message { border-color: #2a2d33; background: #1b1c1f; box-shadow: 0 1px 2px rgba(0,0,0,.25); }
|
|
405
|
+
[data-theme="dark"] .message header { color: #a7adb5; }
|
|
406
|
+
[data-theme="dark"] .message time { color: #737a83; }
|
|
407
|
+
[data-theme="dark"] .message-role { color: #d7dae0; }
|
|
408
|
+
[data-theme="dark"] .message-user { border-color: transparent; background: #1e2a45; box-shadow: none; }
|
|
409
|
+
[data-theme="dark"] .message-user header { color: #8fa9d9; }
|
|
410
|
+
[data-theme="dark"] .message-user .message-body p { color: #c9d4ea; }
|
|
411
|
+
[data-theme="dark"] .message-error { border-left-color: #dc2626; background: #2b1a1c; }
|
|
412
|
+
[data-theme="dark"] .message-collapsible.expanded { box-shadow: 0 2px 10px rgba(0,0,0,.35); }
|
|
413
|
+
[data-theme="dark"] .message-body p { color: #d7dae0; }
|
|
414
|
+
[data-theme="dark"] .message-body h1, [data-theme="dark"] .message-body h2, [data-theme="dark"] .message-body h3 { color: #e6e8eb; }
|
|
415
|
+
[data-theme="dark"] .message-body blockquote { border-left-color: #3a3f47; color: #8f959e; }
|
|
416
|
+
[data-theme="dark"] .message-body code { background: #26282d; color: #d7dae0; }
|
|
417
|
+
[data-theme="dark"] .message-body pre { border-color: #2a2d33; background: #15171b; }
|
|
418
|
+
[data-theme="dark"] .message-body pre code { background: transparent; }
|
|
419
|
+
[data-theme="dark"] .message-body th, [data-theme="dark"] .message-body td { border-color: #2a2d33; }
|
|
420
|
+
[data-theme="dark"] .message-body th { background: #222428; }
|
|
421
|
+
[data-theme="dark"] .message-branch { color: #8f959e; }
|
|
422
|
+
[data-theme="dark"] .message-branch:hover { background: #1e2a44; color: #7ea6f5; }
|
|
423
|
+
[data-theme="dark"] .message-fold { color: #737a83; }
|
|
424
|
+
[data-theme="dark"] .message-fold:hover { background: #1e2a44 !important; color: #7ea6f5 !important; }
|
|
425
|
+
[data-theme="dark"] .message-summary { color: #8f959e !important; }
|
|
426
|
+
[data-theme="dark"] .message-streaming { color: #8f959e !important; }
|
|
427
|
+
[data-theme="dark"] .streaming-dot { background: #737a83; }
|
|
428
|
+
[data-theme="dark"] .process-records { border-top-color: #2a2d33; }
|
|
429
|
+
[data-theme="dark"] .process-records-fold { background: #222428; color: #a7adb5; }
|
|
430
|
+
[data-theme="dark"] .process-records-fold:hover { background: #1e2a44; color: #7ea6f5; }
|
|
431
|
+
[data-theme="dark"] .process-count { background: #2a2d33; color: #8f959e; }
|
|
432
|
+
[data-theme="dark"] .process-entry { border-color: #2a2d33; background: #15171b; }
|
|
433
|
+
[data-theme="dark"] .process-entry-fold { color: #d7dae0; }
|
|
434
|
+
[data-theme="dark"] .process-entry-fold:hover { background: #222428; }
|
|
435
|
+
[data-theme="dark"] .process-status-done { color: #34d399; }
|
|
436
|
+
[data-theme="dark"] .process-status-pending { color: #fbbf24; }
|
|
437
|
+
[data-theme="dark"] .process-status-error { color: #f87171; }
|
|
438
|
+
[data-theme="dark"] .process-args, [data-theme="dark"] .process-result { background: #222428; color: #d7dae0; }
|
|
439
|
+
[data-theme="dark"] .process-error { background: #2b1a1c; color: #f0a3a3; }
|
|
440
|
+
[data-theme="dark"] .message-composer { border-top-color: #26282d; background: #0f1115; }
|
|
441
|
+
[data-theme="dark"] .message-composer textarea { border-color: #2a2d33; background: #15171b; color: #e6e8eb; box-shadow: 0 1px 3px rgba(0,0,0,.3); }
|
|
442
|
+
[data-theme="dark"] .message-composer button:disabled { background: #2a2d33; color: #737a83; }
|
|
443
|
+
[data-theme="dark"] button { border-color: #2a2d33; background: #1b1c1f; color: #d7dae0; }
|
|
444
|
+
[data-theme="dark"] button:hover { border-color: #4a4f57; background: #26282d; color: #fff; }
|
|
445
445
|
[data-theme="dark"] button.primary { border-color: #3478f6; background: #3478f6; color: #fff; }
|
|
446
446
|
[data-theme="dark"] button.primary:hover { border-color: #2563eb; background: #2563eb; color: #fff; }
|
|
447
447
|
@media (max-width: 760px) { [data-theme="dark"] .card-inspector { border-top-color: #2a2d33; border-left: 0; } }
|