@kevin5251984/guild 0.2.17 → 0.2.19

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -0,0 +1,491 @@
1
+ :root {
2
+ --enamel: #0B0E12;
3
+ --paper: #F3EFE6;
4
+ --ink: #0B0E12;
5
+ --steel: #A8B0BC;
6
+ --signal: #C9A227;
7
+ --bg: #0B0E12;
8
+ --panel: #10141A;
9
+ --lift: #161C24;
10
+ --card: #161C24;
11
+ --you: #242C36;
12
+ --text: #E8E4DC;
13
+ --muted: #8B8F96;
14
+ --line: #1C222C;
15
+ --fill: #141A22;
16
+ --ok: #9fdfb2;
17
+ --danger: #f0a8a8;
18
+ --tap: 44px;
19
+ --focus: 0 0 0 2px var(--bg), 0 0 0 3px var(--steel);
20
+ --vvh: 100dvh;
21
+ color: var(--text);
22
+ background: var(--bg);
23
+ font-family: "SF Pro Text", "PingFang TC", "Segoe UI", system-ui, sans-serif;
24
+ line-height: 1.45;
25
+ }
26
+ * { box-sizing: border-box; }
27
+ html, body {
28
+ margin: 0;
29
+ min-height: 100%;
30
+ height: var(--vvh);
31
+ background: var(--bg);
32
+ color: var(--text);
33
+ }
34
+ html { text-wrap: pretty; -webkit-text-size-adjust: 100%; }
35
+ [hidden] { display: none !important; }
36
+ body.m-away {
37
+ max-width: 40rem;
38
+ margin: 0 auto;
39
+ min-height: var(--vvh);
40
+ display: flex;
41
+ flex-direction: column;
42
+ overflow-x: hidden;
43
+ }
44
+ button, a, input, textarea { touch-action: manipulation; }
45
+ button:focus-visible,
46
+ a:focus-visible,
47
+ textarea:focus-visible {
48
+ outline: none;
49
+ box-shadow: var(--focus);
50
+ }
51
+ .screen {
52
+ display: flex;
53
+ flex-direction: column;
54
+ flex: 1;
55
+ height: var(--vvh);
56
+ min-height: 0;
57
+ overflow: hidden;
58
+ }
59
+ .screen[hidden] { display: none !important; }
60
+ #screen-list {
61
+ overflow: auto;
62
+ -webkit-overflow-scrolling: touch;
63
+ }
64
+ .list-head,
65
+ .room-head {
66
+ position: sticky;
67
+ top: 0;
68
+ z-index: 4;
69
+ display: flex;
70
+ align-items: center;
71
+ gap: 0.65rem;
72
+ min-height: calc(var(--tap) + 0.4rem);
73
+ padding: calc(0.55rem + env(safe-area-inset-top, 0px)) 1rem 0.55rem;
74
+ background: color-mix(in srgb, var(--bg) 92%, transparent);
75
+ backdrop-filter: blur(12px);
76
+ border-bottom: 1px solid var(--line);
77
+ }
78
+ .list-head h1,
79
+ .room-head h1 {
80
+ margin: 0;
81
+ font-size: 1.05rem;
82
+ font-weight: 650;
83
+ letter-spacing: 0.03em;
84
+ min-width: 0;
85
+ overflow: hidden;
86
+ text-overflow: ellipsis;
87
+ white-space: nowrap;
88
+ }
89
+ .hint {
90
+ margin: 0;
91
+ padding: 0.7rem 1rem 0.35rem;
92
+ color: var(--muted);
93
+ font-size: 0.82rem;
94
+ line-height: 1.45;
95
+ }
96
+ .section-h {
97
+ padding: 0.85rem 1rem 0.35rem;
98
+ color: var(--muted);
99
+ font-size: 0.78rem;
100
+ letter-spacing: 0.04em;
101
+ }
102
+ .navlist {
103
+ list-style: none;
104
+ margin: 0;
105
+ padding: 0 0.65rem 1.25rem;
106
+ display: flex;
107
+ flex-direction: column;
108
+ gap: 4px;
109
+ }
110
+ .navlist a {
111
+ display: flex;
112
+ align-items: center;
113
+ gap: 0.7rem;
114
+ min-height: var(--tap);
115
+ padding: 0.55rem 0.75rem;
116
+ border-radius: 14px;
117
+ color: var(--text);
118
+ text-decoration: none;
119
+ background: var(--card);
120
+ min-width: 0;
121
+ }
122
+ .navlist a:hover { text-decoration: none; background: var(--lift); }
123
+ .navlist a.branch { margin-left: 1.1rem; }
124
+ .nav-copy {
125
+ min-width: 0;
126
+ flex: 1;
127
+ display: flex;
128
+ flex-direction: column;
129
+ gap: 2px;
130
+ }
131
+ .nav-copy strong {
132
+ display: flex;
133
+ align-items: center;
134
+ gap: 0.4rem;
135
+ font-weight: 600;
136
+ font-size: 0.95rem;
137
+ }
138
+ .nav-copy em {
139
+ font-style: normal;
140
+ color: var(--muted);
141
+ font-size: 0.78rem;
142
+ overflow: hidden;
143
+ text-overflow: ellipsis;
144
+ white-space: nowrap;
145
+ }
146
+ .live-dot {
147
+ flex: none;
148
+ min-height: 22px;
149
+ padding: 0 0.45rem;
150
+ border-radius: 99px;
151
+ background: color-mix(in srgb, var(--signal) 22%, var(--lift));
152
+ color: var(--paper);
153
+ font-size: 0.68rem;
154
+ font-weight: 650;
155
+ line-height: 22px;
156
+ }
157
+ .back {
158
+ margin: 0;
159
+ min-width: var(--tap);
160
+ min-height: var(--tap);
161
+ padding: 0;
162
+ border: 0;
163
+ border-radius: 12px;
164
+ background: var(--fill);
165
+ color: var(--text);
166
+ font: inherit;
167
+ font-size: 1.15rem;
168
+ cursor: pointer;
169
+ }
170
+ .room-head .meta {
171
+ color: var(--muted);
172
+ font-size: 0.78rem;
173
+ margin-left: auto;
174
+ white-space: nowrap;
175
+ }
176
+ .thread {
177
+ flex: 1;
178
+ min-height: 0;
179
+ overflow: auto;
180
+ padding: 0.75rem 1rem calc(0.5rem + env(safe-area-inset-bottom, 0px));
181
+ display: flex;
182
+ flex-direction: column;
183
+ gap: 0.85rem;
184
+ -webkit-overflow-scrolling: touch;
185
+ }
186
+ .empty-thread,
187
+ .empty-list {
188
+ color: var(--muted);
189
+ font-size: 0.9rem;
190
+ padding: 1.2rem 0.4rem;
191
+ }
192
+ .msg {
193
+ display: flex;
194
+ gap: 0.65rem;
195
+ align-items: flex-start;
196
+ }
197
+ .msg.you { flex-direction: row-reverse; }
198
+ .msg.you .msg-main {
199
+ display: flex;
200
+ flex-direction: column;
201
+ align-items: flex-end;
202
+ }
203
+ .msg.you .msg-head { flex-direction: row-reverse; }
204
+ .msg.you .bubble { max-width: 85%; }
205
+ .avatar {
206
+ width: 32px;
207
+ height: 32px;
208
+ border-radius: 50%;
209
+ display: grid;
210
+ place-items: center;
211
+ flex: none;
212
+ overflow: hidden;
213
+ font-size: 0.72rem;
214
+ font-weight: 650;
215
+ color: #fff;
216
+ background: var(--steel);
217
+ }
218
+ .avatar img {
219
+ width: 100%;
220
+ height: 100%;
221
+ object-fit: cover;
222
+ }
223
+ .msg-main { min-width: 0; flex: 1; }
224
+ .msg-head {
225
+ display: flex;
226
+ align-items: baseline;
227
+ gap: 0.4rem;
228
+ margin-bottom: 0.2rem;
229
+ }
230
+ .msg-head .name { font-weight: 620; font-size: 0.86rem; }
231
+ .msg-head .handle,
232
+ .msg-head .clock {
233
+ color: var(--muted);
234
+ font-size: 0.72rem;
235
+ }
236
+ .bubble {
237
+ margin: 0;
238
+ padding: 0.55rem 0.75rem;
239
+ border-radius: 14px;
240
+ background: var(--lift);
241
+ overflow-wrap: anywhere;
242
+ white-space: pre-wrap;
243
+ }
244
+ .msg.you .bubble { background: var(--you); }
245
+ .assistant-text {
246
+ margin: 0;
247
+ color: var(--text);
248
+ font-size: 0.95rem;
249
+ line-height: 1.65;
250
+ white-space: normal;
251
+ overflow-wrap: break-word;
252
+ }
253
+ .assistant-text p { margin: 0 0 0.7rem; }
254
+ .assistant-text p:last-child { margin-bottom: 0; }
255
+ .assistant-text a { color: var(--steel); }
256
+ .assistant-text code {
257
+ font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
258
+ font-size: 0.86em;
259
+ padding: 0.1em 0.35em;
260
+ border-radius: 6px;
261
+ background: var(--fill);
262
+ border: 1px solid var(--line);
263
+ }
264
+ .assistant-text .md-fence {
265
+ margin: 0.35rem 0 0.7rem;
266
+ border-radius: 12px;
267
+ background: #1a1a1a;
268
+ overflow: auto;
269
+ }
270
+ .assistant-text .md-fence-bar {
271
+ display: flex;
272
+ align-items: center;
273
+ justify-content: space-between;
274
+ gap: 8px;
275
+ min-height: 32px;
276
+ padding: 4px 8px 0 12px;
277
+ color: var(--muted);
278
+ font-size: 0.75rem;
279
+ }
280
+ .assistant-text .md-pre {
281
+ margin: 0;
282
+ padding: 0.6rem 0.8rem 0.8rem;
283
+ overflow: auto;
284
+ font-size: 0.82rem;
285
+ }
286
+ .assistant-text img.md-img {
287
+ max-width: 100%;
288
+ border-radius: 10px;
289
+ }
290
+ .turn-live {
291
+ display: flex;
292
+ flex-direction: column;
293
+ gap: 6px;
294
+ }
295
+ .turn-status {
296
+ display: inline-flex;
297
+ align-items: center;
298
+ height: 26px;
299
+ font-size: 14px;
300
+ font-weight: 600;
301
+ white-space: nowrap;
302
+ background: linear-gradient(
303
+ 90deg,
304
+ #E8E4DC 0%,
305
+ #E8E4DC 40%,
306
+ #8B8F96 50%,
307
+ #E8E4DC 60%,
308
+ #E8E4DC 100%
309
+ );
310
+ background-position: 100% 0;
311
+ background-size: 250% 100%;
312
+ background-clip: text;
313
+ -webkit-background-clip: text;
314
+ color: transparent;
315
+ animation: m-shimmer 1.8s ease-in-out infinite;
316
+ }
317
+ .turn-status .clock {
318
+ margin-left: 8px;
319
+ font-size: 13px;
320
+ font-weight: 400;
321
+ font-variant-numeric: tabular-nums;
322
+ color: #6f6f6f;
323
+ -webkit-text-fill-color: #6f6f6f;
324
+ }
325
+ @keyframes m-shimmer { to { background-position: 0 0; } }
326
+ @media (prefers-reduced-motion: reduce) {
327
+ .turn-status { animation: none; color: var(--text); background: none; }
328
+ }
329
+ .live-steps {
330
+ margin: 0;
331
+ padding: 0;
332
+ list-style: none;
333
+ display: flex;
334
+ flex-direction: column;
335
+ gap: 2px;
336
+ }
337
+ .live-step {
338
+ display: grid;
339
+ grid-template-columns: auto minmax(0, 1fr);
340
+ gap: 8px;
341
+ min-height: 20px;
342
+ font-size: 13px;
343
+ line-height: 20px;
344
+ color: var(--muted);
345
+ }
346
+ .live-name { color: #cfcfcf; font-weight: 500; }
347
+ .live-detail {
348
+ overflow: hidden;
349
+ text-overflow: ellipsis;
350
+ white-space: nowrap;
351
+ }
352
+ .live-step.running .live-name { color: var(--text); }
353
+ .turn-actions { margin-top: 4px; }
354
+ .turn-stop,
355
+ .send,
356
+ .stop-all {
357
+ display: inline-flex;
358
+ align-items: center;
359
+ justify-content: center;
360
+ flex: none;
361
+ min-height: var(--tap);
362
+ min-width: var(--tap);
363
+ padding: 0 0.9rem;
364
+ border: 1px solid var(--line);
365
+ border-radius: 12px;
366
+ background: var(--fill);
367
+ color: var(--text);
368
+ font: inherit;
369
+ font-weight: 620;
370
+ cursor: pointer;
371
+ }
372
+ .turn-stop,
373
+ .stop-all {
374
+ color: var(--danger);
375
+ background: var(--lift);
376
+ border-color: color-mix(in srgb, var(--danger) 35%, var(--line));
377
+ }
378
+ .send {
379
+ background: var(--steel);
380
+ color: var(--ink);
381
+ border-color: transparent;
382
+ }
383
+ .send:disabled,
384
+ .stop-all:disabled {
385
+ opacity: 0.45;
386
+ cursor: default;
387
+ }
388
+ .composer {
389
+ position: sticky;
390
+ bottom: 0;
391
+ z-index: 5;
392
+ padding: 0.55rem 0.75rem calc(0.55rem + env(safe-area-inset-bottom, 0px));
393
+ background: color-mix(in srgb, var(--bg) 94%, transparent);
394
+ backdrop-filter: blur(12px);
395
+ border-top: 1px solid var(--line);
396
+ }
397
+ .composer-card {
398
+ position: relative;
399
+ display: flex;
400
+ flex-direction: column;
401
+ align-items: stretch;
402
+ gap: 0.5rem;
403
+ min-width: 0;
404
+ }
405
+ .composer-actions {
406
+ display: flex;
407
+ gap: 0.5rem;
408
+ }
409
+ .composer-actions .send,
410
+ .composer-actions .stop-all {
411
+ flex: 1;
412
+ }
413
+ #draft {
414
+ display: block;
415
+ width: 100%;
416
+ min-width: 0;
417
+ min-height: var(--tap);
418
+ max-height: 9rem;
419
+ padding: 0.7rem 0.8rem;
420
+ border: 1px solid var(--line);
421
+ border-radius: 14px;
422
+ background: var(--fill);
423
+ color: var(--text);
424
+ font: inherit;
425
+ font-size: 16px;
426
+ line-height: 1.4;
427
+ resize: none;
428
+ }
429
+ .mention-pop {
430
+ position: absolute;
431
+ left: 0;
432
+ right: 0;
433
+ bottom: calc(100% + 6px);
434
+ max-height: 12rem;
435
+ overflow: auto;
436
+ border: 1px solid var(--line);
437
+ border-radius: 14px;
438
+ background: var(--panel);
439
+ box-shadow: 0 8px 28px rgba(0, 0, 0, 0.35);
440
+ }
441
+ .mention-item {
442
+ display: flex;
443
+ align-items: center;
444
+ gap: 0.65rem;
445
+ width: 100%;
446
+ min-height: var(--tap);
447
+ padding: 0.45rem 0.7rem;
448
+ border: 0;
449
+ background: transparent;
450
+ color: var(--text);
451
+ font: inherit;
452
+ text-align: left;
453
+ cursor: pointer;
454
+ }
455
+ .mention-item.on,
456
+ .mention-item:hover { background: var(--lift); }
457
+ .mention-item strong { display: block; font-size: 0.9rem; }
458
+ .mention-item em {
459
+ display: block;
460
+ font-style: normal;
461
+ color: var(--muted);
462
+ font-size: 0.75rem;
463
+ }
464
+ .mention-glyph {
465
+ width: 28px;
466
+ height: 28px;
467
+ border-radius: 50%;
468
+ display: grid;
469
+ place-items: center;
470
+ font-size: 0.7rem;
471
+ font-weight: 650;
472
+ color: #fff;
473
+ background: var(--steel);
474
+ flex: none;
475
+ }
476
+ .flash {
477
+ position: fixed;
478
+ left: 50%;
479
+ bottom: calc(5.5rem + env(safe-area-inset-bottom, 0px));
480
+ transform: translateX(-50%);
481
+ padding: 0.45rem 0.8rem;
482
+ border-radius: 999px;
483
+ background: var(--lift);
484
+ color: var(--text);
485
+ font-size: 0.82rem;
486
+ opacity: 0;
487
+ pointer-events: none;
488
+ transition: opacity 160ms ease;
489
+ z-index: 8;
490
+ }
491
+ .flash.on { opacity: 1; }