@compose-market/theme 0.0.82 → 0.0.91

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (83) hide show
  1. package/dist/agents/index.d.ts +2 -2
  2. package/dist/agents/index.d.ts.map +1 -1
  3. package/dist/app/index.d.ts +1 -1
  4. package/dist/app/index.d.ts.map +1 -1
  5. package/dist/app/styles.d.ts +1 -1
  6. package/dist/app/styles.d.ts.map +1 -1
  7. package/dist/app/styles.js +64 -4
  8. package/dist/app/styles.js.map +1 -1
  9. package/dist/css/app.css +64 -4
  10. package/dist/css/dark.css +18 -18
  11. package/dist/css/effects.css +293 -30
  12. package/dist/css/index.css +4 -0
  13. package/dist/css/index.d.ts +1 -1
  14. package/dist/css/index.d.ts.map +1 -1
  15. package/dist/css/index.js +4 -0
  16. package/dist/css/index.js.map +1 -1
  17. package/dist/css/market.css +273 -0
  18. package/dist/css/mirror.css +251 -0
  19. package/dist/css/session.css +28 -0
  20. package/dist/css/shell.css +46 -30
  21. package/dist/css/tokens.css +1 -1
  22. package/dist/css/utilities.css +323 -0
  23. package/dist/css/workflows.css +634 -0
  24. package/dist/effects/styles.d.ts +3 -3
  25. package/dist/effects/styles.d.ts.map +1 -1
  26. package/dist/effects/styles.js +295 -32
  27. package/dist/effects/styles.js.map +1 -1
  28. package/dist/index.d.ts +5 -1
  29. package/dist/index.d.ts.map +1 -1
  30. package/dist/index.js +5 -1
  31. package/dist/index.js.map +1 -1
  32. package/dist/market/index.d.ts +8 -0
  33. package/dist/market/index.d.ts.map +1 -0
  34. package/dist/market/index.js +8 -0
  35. package/dist/market/index.js.map +1 -0
  36. package/dist/market/styles.d.ts +8 -0
  37. package/dist/market/styles.d.ts.map +1 -0
  38. package/dist/market/styles.js +281 -0
  39. package/dist/market/styles.js.map +1 -0
  40. package/dist/mirror/index.d.ts +8 -0
  41. package/dist/mirror/index.d.ts.map +1 -0
  42. package/dist/mirror/index.js +8 -0
  43. package/dist/mirror/index.js.map +1 -0
  44. package/dist/mirror/styles.d.ts +7 -0
  45. package/dist/mirror/styles.d.ts.map +1 -0
  46. package/dist/mirror/styles.js +258 -0
  47. package/dist/mirror/styles.js.map +1 -0
  48. package/dist/session/index.d.ts +16 -4
  49. package/dist/session/index.d.ts.map +1 -1
  50. package/dist/session/index.js +31 -2
  51. package/dist/session/index.js.map +1 -1
  52. package/dist/session/styles.d.ts +1 -1
  53. package/dist/session/styles.d.ts.map +1 -1
  54. package/dist/session/styles.js +28 -0
  55. package/dist/session/styles.js.map +1 -1
  56. package/dist/shell/index.d.ts +19 -19
  57. package/dist/shell/index.d.ts.map +1 -1
  58. package/dist/shell/styles.d.ts +1 -1
  59. package/dist/shell/styles.d.ts.map +1 -1
  60. package/dist/shell/styles.js +46 -30
  61. package/dist/shell/styles.js.map +1 -1
  62. package/dist/themes/dark.js +25 -25
  63. package/dist/themes/dark.js.map +1 -1
  64. package/dist/tokens/typography.d.ts +1 -1
  65. package/dist/tokens/typography.js +2 -2
  66. package/dist/tokens/typography.js.map +1 -1
  67. package/dist/utilities/index.d.ts +8 -0
  68. package/dist/utilities/index.d.ts.map +1 -0
  69. package/dist/utilities/index.js +8 -0
  70. package/dist/utilities/index.js.map +1 -0
  71. package/dist/utilities/styles.d.ts +8 -0
  72. package/dist/utilities/styles.d.ts.map +1 -0
  73. package/dist/utilities/styles.js +331 -0
  74. package/dist/utilities/styles.js.map +1 -0
  75. package/dist/workflows/index.d.ts +65 -0
  76. package/dist/workflows/index.d.ts.map +1 -0
  77. package/dist/workflows/index.js +17 -0
  78. package/dist/workflows/index.js.map +1 -0
  79. package/dist/workflows/styles.d.ts +8 -0
  80. package/dist/workflows/styles.d.ts.map +1 -0
  81. package/dist/workflows/styles.js +642 -0
  82. package/dist/workflows/styles.js.map +1 -0
  83. package/package.json +49 -10
@@ -5,24 +5,78 @@
5
5
  * DO NOT EDIT – generated from the theme package.
6
6
  */
7
7
 
8
+ :root {
9
+ --cm-bg: #0c1324;
10
+ --cm-bg-deep: #020607;
11
+ --cm-surface: hsl(var(--card) / 0.42);
12
+ --cm-surface-high: hsl(var(--card) / 0.64);
13
+ --cm-cyan: #22d3ee;
14
+ --cm-cyan-hot: #00e5ff;
15
+ --cm-fuchsia: #ae05c6;
16
+ --cm-fuchsia-hot: #fbabff;
17
+ --cm-text: #dce1fb;
18
+ --cm-muted: hsl(var(--muted-foreground) / 0.72);
19
+ --cm-line: hsl(var(--primary) / 0.22);
20
+ --cm-purple-line: hsl(var(--accent) / 0.24);
21
+ --cm-radius: 12px;
22
+ --cm-font-display: var(--font-display), Orbitron, Rajdhani, Inter, ui-sans-serif, system-ui, sans-serif;
23
+ --cm-font-sans: var(--font-sans), Manrope, Rajdhani, Inter, ui-sans-serif, system-ui, sans-serif;
24
+ --cm-font-mono: var(--font-mono), "Fira Code", "SFMono-Regular", Consolas, "Liberation Mono", monospace;
25
+ --cm-glow-cyan: 0 0 18px hsl(var(--primary) / 0.32), 0 0 42px hsl(194 100% 42% / 0.16);
26
+ --cm-glow-fuchsia: 0 0 16px hsl(var(--accent) / 0.32), 0 0 36px hsl(292 85% 38% / 0.18);
27
+ --cm-glow-soft: 0 0 28px hsl(var(--primary) / 0.08);
28
+ }
29
+
8
30
  /* Glass Panel */
9
- .glass-panel {
10
- background: linear-gradient(145deg, hsl(var(--card) / 0.8), hsl(var(--card) / 0.4));
11
- backdrop-filter: blur(12px);
12
- border: 1px solid hsl(var(--border) / 0.5);
31
+ .glass-panel,
32
+ .cm-glass {
33
+ position: relative;
34
+ overflow: hidden;
35
+ border: 1px solid hsl(var(--primary) / 0.18);
36
+ border-radius: var(--cm-radius);
37
+ background:
38
+ linear-gradient(145deg, hsl(226 21% 23% / 0.38), hsl(221 50% 9% / 0.24)),
39
+ radial-gradient(circle at 18% 0%, hsl(var(--primary) / 0.13), transparent 34%),
40
+ hsl(224 36% 13% / 0.28);
13
41
  box-shadow:
14
- 0 4px 24px -1px hsl(0 0% 0% / 0.3),
15
- inset 0 1px 0 hsl(0 0% 100% / 0.05);
42
+ inset 0 1px 0 hsl(0 0% 100% / 0.07),
43
+ inset 0 -1px 0 hsl(var(--primary) / 0.08),
44
+ 0 0 40px hsl(var(--primary) / 0.055);
45
+ backdrop-filter: blur(18px) saturate(1.16);
46
+ }
47
+
48
+ .glass-panel::before,
49
+ .cm-glass::before {
50
+ content: "";
51
+ position: absolute;
52
+ inset: 0;
53
+ pointer-events: none;
54
+ background:
55
+ linear-gradient(120deg, hsl(0 0% 100% / 0.12), transparent 18%),
56
+ radial-gradient(circle at 18% 12%, hsl(var(--primary) / 0.15), transparent 34%),
57
+ radial-gradient(circle at 100% 100%, hsl(var(--accent) / 0.16), transparent 38%);
58
+ opacity: 0.44;
59
+ }
60
+
61
+ .glass-panel > *,
62
+ .cm-glass > * {
63
+ position: relative;
64
+ z-index: 1;
16
65
  }
17
66
 
18
67
  /* Neon Effects */
19
68
  .neon-border {
20
- box-shadow: 0 0 10px -2px hsl(var(--primary) / 0.5);
21
- border-color: hsl(var(--primary) / 0.5);
69
+ border-color: hsl(var(--primary) / 0.42);
70
+ box-shadow:
71
+ inset 0 0 0 1px hsl(0 0% 100% / 0.025),
72
+ 0 0 10px -2px hsl(var(--primary) / 0.5),
73
+ 0 0 34px hsl(var(--primary) / 0.08);
22
74
  }
23
75
 
24
76
  .neon-text {
25
- text-shadow: 0 0 10px hsl(var(--primary) / 0.5);
77
+ text-shadow:
78
+ 0 0 10px hsl(var(--primary) / 0.58),
79
+ 0 0 24px hsl(var(--accent) / 0.16);
26
80
  }
27
81
 
28
82
  .neon-glow {
@@ -31,40 +85,235 @@
31
85
 
32
86
  @keyframes neon-pulse {
33
87
  from {
34
- box-shadow: 0 0 5px hsl(var(--primary) / 0.5),
35
- 0 0 10px hsl(var(--primary) / 0.3),
36
- 0 0 15px hsl(var(--primary) / 0.1);
88
+ opacity: 0.84;
89
+ box-shadow:
90
+ 0 0 5px hsl(var(--primary) / 0.42),
91
+ 0 0 10px hsl(var(--primary) / 0.22),
92
+ 0 0 15px hsl(var(--primary) / 0.08);
37
93
  }
38
94
  to {
39
- box-shadow: 0 0 10px hsl(var(--primary) / 0.6),
40
- 0 0 20px hsl(var(--primary) / 0.4),
41
- 0 0 30px hsl(var(--primary) / 0.2);
95
+ opacity: 1;
96
+ box-shadow:
97
+ 0 0 10px hsl(var(--primary) / 0.56),
98
+ 0 0 20px hsl(var(--primary) / 0.32),
99
+ 0 0 30px hsl(var(--accent) / 0.14);
42
100
  }
43
101
  }
44
102
 
45
103
  /* Background Grid Pattern */
46
- .bg-grid-pattern {
47
- background-size: 40px 40px;
48
- background-image: linear-gradient(to right, hsl(217 33% 17% / 0.3) 1px, transparent 1px),
49
- linear-gradient(to bottom, hsl(217 33% 17% / 0.3) 1px, transparent 1px);
104
+ .bg-grid-pattern,
105
+ .cm-grid {
106
+ background-size: 44px 44px;
107
+ background-image:
108
+ linear-gradient(to right, hsl(var(--primary) / 0.055) 1px, transparent 1px),
109
+ linear-gradient(to bottom, hsl(var(--primary) / 0.045) 1px, transparent 1px),
110
+ radial-gradient(circle at 50% 0%, hsl(var(--primary) / 0.1), transparent 34rem);
50
111
  }
51
112
 
52
113
  /* Scanline Animation */
53
114
  .scanline {
115
+ position: absolute;
116
+ inset-inline: 0;
117
+ top: -100px;
54
118
  width: 100%;
55
119
  height: 100px;
56
120
  z-index: 50;
57
- background: linear-gradient(0deg, rgba(0, 0, 0, 0) 0%, hsl(188 95% 43% / 0.05) 50%, rgba(0, 0, 0, 0) 100%);
58
- opacity: 0.1;
59
- position: absolute;
60
- bottom: 100%;
61
- animation: scanline 8s linear infinite;
62
121
  pointer-events: none;
122
+ background: linear-gradient(0deg, transparent 0%, hsl(var(--primary) / 0.06) 50%, transparent 100%);
123
+ opacity: 0.16;
124
+ animation: scanline 8s linear infinite;
125
+ will-change: transform;
63
126
  }
64
127
 
65
128
  @keyframes scanline {
66
- 0% { bottom: 100%; }
67
- 100% { bottom: -100px; }
129
+ 0% { transform: translateY(-100px); }
130
+ 100% { transform: translateY(calc(100vh + 100px)); }
131
+ }
132
+
133
+ @keyframes cm-biopulse {
134
+ 0%, 100% {
135
+ opacity: 0.96;
136
+ box-shadow:
137
+ inset 0 0 26px hsl(var(--primary) / 0.04),
138
+ 0 0 10px hsl(var(--primary) / 0.06);
139
+ }
140
+
141
+ 50% {
142
+ opacity: 1;
143
+ box-shadow:
144
+ inset 0 0 30px hsl(var(--primary) / 0.08),
145
+ 0 0 18px hsl(var(--primary) / 0.14);
146
+ }
147
+ }
148
+
149
+ .cm-cell {
150
+ container-type: inline-size;
151
+ animation: cm-biopulse 2s ease-in-out infinite;
152
+ transition:
153
+ transform 180ms ease,
154
+ border-color 180ms ease,
155
+ box-shadow 180ms ease,
156
+ background-color 180ms ease,
157
+ color 180ms ease;
158
+ will-change: transform;
159
+ }
160
+
161
+ .cm-cell:hover,
162
+ .cm-cell:focus-within,
163
+ .cm-cell[data-state="active"] {
164
+ transform: translateY(-1px);
165
+ border-color: hsl(var(--primary) / 0.78);
166
+ box-shadow:
167
+ inset 0 0 30px hsl(var(--primary) / 0.08),
168
+ 0 0 18px hsl(var(--primary) / 0.34),
169
+ 0 0 38px hsl(194 100% 42% / 0.16);
170
+ }
171
+
172
+ .cm-cell[data-tone="purple"],
173
+ .cm-cell[data-tone="violet"] {
174
+ border-color: hsl(var(--accent) / 0.46);
175
+ box-shadow:
176
+ inset 0 0 26px hsl(var(--accent) / 0.1),
177
+ 0 0 10px hsl(var(--accent) / 0.34);
178
+ }
179
+
180
+ .cm-kicker {
181
+ margin: 0;
182
+ color: var(--cm-cyan-hot);
183
+ font-family: var(--cm-font-mono);
184
+ font-size: clamp(0.62rem, 1vw, 0.82rem);
185
+ font-weight: 800;
186
+ letter-spacing: 0;
187
+ line-height: 1.2;
188
+ text-transform: uppercase;
189
+ text-shadow: var(--cm-glow-cyan);
190
+ }
191
+
192
+ .cm-display {
193
+ margin: 0;
194
+ color: var(--cm-text);
195
+ font-family: var(--cm-font-display);
196
+ font-weight: 950;
197
+ letter-spacing: 0;
198
+ line-height: 0.9;
199
+ text-transform: uppercase;
200
+ text-shadow:
201
+ 0 0 12px hsl(0 0% 100% / 0.34),
202
+ 0 0 26px hsl(var(--primary) / 0.3);
203
+ }
204
+
205
+ .cm-display em {
206
+ color: var(--cm-cyan-hot);
207
+ font-style: normal;
208
+ text-shadow:
209
+ 0 0 12px hsl(var(--primary) / 0.82),
210
+ 0 0 34px hsl(var(--primary) / 0.52),
211
+ 0 0 52px hsl(var(--accent) / 0.24);
212
+ }
213
+
214
+ .cm-copy {
215
+ color: var(--cm-muted);
216
+ font-family: var(--cm-font-sans);
217
+ font-weight: 500;
218
+ line-height: 1.42;
219
+ }
220
+
221
+ .cm-button {
222
+ display: inline-flex;
223
+ min-height: 2.625rem;
224
+ min-width: 0;
225
+ align-items: center;
226
+ justify-content: center;
227
+ gap: 0.5rem;
228
+ border: 1px solid hsl(var(--primary) / 0.42);
229
+ border-radius: 999px;
230
+ padding: 0.78rem 1.05rem;
231
+ color: hsl(var(--foreground));
232
+ font-family: var(--cm-font-mono);
233
+ font-size: clamp(0.64rem, 1.6cqw, 0.74rem);
234
+ font-weight: 900;
235
+ letter-spacing: 0;
236
+ line-height: 1.08;
237
+ text-align: center;
238
+ text-transform: uppercase;
239
+ transition:
240
+ transform 180ms ease,
241
+ border-color 180ms ease,
242
+ background 180ms ease,
243
+ box-shadow 180ms ease,
244
+ color 180ms ease;
245
+ }
246
+
247
+ .cm-button:hover,
248
+ .cm-button:focus-visible {
249
+ transform: translateY(-1px);
250
+ outline: none;
251
+ }
252
+
253
+ .cm-button-primary,
254
+ .primary {
255
+ border-color: hsl(var(--primary) / 0.9);
256
+ background: linear-gradient(135deg, #8aebff, #22d3ee);
257
+ color: #031314;
258
+ box-shadow: var(--cm-glow-cyan);
259
+ }
260
+
261
+ .cm-button-primary:hover,
262
+ .cm-button-primary:focus-visible,
263
+ .primary:hover,
264
+ .primary:focus-visible {
265
+ box-shadow:
266
+ 0 0 18px hsl(var(--primary) / 0.44),
267
+ 0 0 42px hsl(var(--primary) / 0.2);
268
+ }
269
+
270
+ .cm-button-secondary,
271
+ .secondary {
272
+ border-color: hsl(var(--primary) / 0.2);
273
+ background: hsl(221 50% 9% / 0.36);
274
+ color: var(--cm-cyan-hot);
275
+ box-shadow: inset 0 0 22px hsl(var(--primary) / 0.08);
276
+ backdrop-filter: blur(14px);
277
+ }
278
+
279
+ .cm-button-secondary:hover,
280
+ .cm-button-secondary:focus-visible,
281
+ .secondary:hover,
282
+ .secondary:focus-visible {
283
+ border-color: hsl(var(--primary) / 0.72);
284
+ background: hsl(var(--primary) / 0.1);
285
+ box-shadow: var(--cm-glow-cyan);
286
+ }
287
+
288
+ .cm-chip {
289
+ display: inline-flex;
290
+ align-items: center;
291
+ border: 1px solid hsl(var(--primary) / 0.18);
292
+ border-radius: 999px;
293
+ background: hsl(var(--background) / 0.42);
294
+ color: hsl(var(--foreground) / 0.72);
295
+ padding: 0.36rem 0.58rem;
296
+ font-family: var(--cm-font-mono);
297
+ font-size: 0.64rem;
298
+ font-weight: 800;
299
+ line-height: 1;
300
+ text-transform: uppercase;
301
+ backdrop-filter: blur(12px);
302
+ }
303
+
304
+ .cm-icon {
305
+ display: inline-grid;
306
+ width: 2.45rem;
307
+ height: 2.45rem;
308
+ place-items: center;
309
+ border: 1px solid hsl(var(--primary) / 0.28);
310
+ border-radius: var(--cm-radius);
311
+ background: hsl(var(--primary) / 0.08);
312
+ color: var(--cm-cyan-hot);
313
+ font-family: var(--cm-font-mono);
314
+ font-size: 0.8rem;
315
+ font-weight: 900;
316
+ box-shadow: inset 0 0 20px hsl(var(--primary) / 0.1);
68
317
  }
69
318
 
70
319
  /* Glitch Border Effect */
@@ -186,12 +435,26 @@
186
435
 
187
436
  /* Partner Badge Scanline Animation */
188
437
  @keyframes partner-scanline {
189
- 0% { transform: translateY(-100px); }
190
- 100% { transform: translateY(calc(100vh + 100px)); }
438
+ 0% { transform: translate3d(0, -100px, 0); }
439
+ 100% { transform: translate3d(0, calc(100vh + 100px), 0); }
191
440
  }
192
441
 
193
442
  /* Shimmer Animation */
194
443
  @keyframes shimmer {
195
- 0% { transform: translateX(-100%); }
196
- 100% { transform: translateX(100%); }
444
+ 0% { transform: translate3d(-100%, 0, 0); }
445
+ 100% { transform: translate3d(100%, 0, 0); }
446
+ }
447
+
448
+ @media (prefers-reduced-motion: reduce) {
449
+ .neon-glow,
450
+ .scanline,
451
+ .cm-cell {
452
+ animation-duration: 0.01ms !important;
453
+ animation-iteration-count: 1 !important;
454
+ }
455
+
456
+ .cm-cell,
457
+ .cm-button {
458
+ transition-duration: 0.01ms !important;
459
+ }
197
460
  }
@@ -12,3 +12,7 @@
12
12
  @import './app.css';
13
13
  @import './agents.css';
14
14
  @import './session.css';
15
+ @import './workflows.css';
16
+ @import './market.css';
17
+ @import './mirror.css';
18
+ @import './utilities.css';
@@ -12,5 +12,5 @@ export declare function generateRadiusCss(): string;
12
12
  export declare const baseTokensCss: string;
13
13
  export declare const darkThemeCss: string;
14
14
  export declare const lightThemeCss: string;
15
- export declare const indexCss = "/**\n * Compose.Market Theme System\n * @compose-market/theme/css\n * \n * Import this file for the complete theme (dark by default).\n * For light mode support, also import ./light.css\n */\n\n@import './tokens.css';\n@import './dark.css';\n@import './shell.css';\n@import './effects.css';\n@import './app.css';\n@import './agents.css';\n@import './session.css';\n";
15
+ export declare const indexCss = "/**\n * Compose.Market Theme System\n * @compose-market/theme/css\n * \n * Import this file for the complete theme (dark by default).\n * For light mode support, also import ./light.css\n */\n\n@import './tokens.css';\n@import './dark.css';\n@import './shell.css';\n@import './effects.css';\n@import './app.css';\n@import './agents.css';\n@import './session.css';\n@import './workflows.css';\n@import './market.css';\n@import './mirror.css';\n@import './utilities.css';\n";
16
16
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/css/index.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAIH,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAG3C,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,OAAO,SAAS,EAAE,SAAS,EAAE,MAAM,GAAG,MAAM,CAanF;AAED,wBAAgB,eAAe,IAAI,MAAM,CASxC;AAED,wBAAgB,iBAAiB,IAAI,MAAM,CAS1C;AAED,eAAO,MAAM,aAAa,QAazB,CAAC;AAEF,eAAO,MAAM,YAAY,QAaxB,CAAC;AAEF,eAAO,MAAM,aAAa,QAiBzB,CAAC;AAEF,eAAO,MAAM,QAAQ,kXAepB,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/css/index.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAIH,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAG3C,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,OAAO,SAAS,EAAE,SAAS,EAAE,MAAM,GAAG,MAAM,CAanF;AAED,wBAAgB,eAAe,IAAI,MAAM,CASxC;AAED,wBAAgB,iBAAiB,IAAI,MAAM,CAS1C;AAED,eAAO,MAAM,aAAa,QAazB,CAAC;AAEF,eAAO,MAAM,YAAY,QAaxB,CAAC;AAEF,eAAO,MAAM,aAAa,QAiBzB,CAAC;AAEF,eAAO,MAAM,QAAQ,4dAmBpB,CAAC"}
package/dist/css/index.js CHANGED
@@ -97,5 +97,9 @@ export const indexCss = `/**
97
97
  @import './app.css';
98
98
  @import './agents.css';
99
99
  @import './session.css';
100
+ @import './workflows.css';
101
+ @import './market.css';
102
+ @import './mirror.css';
103
+ @import './utilities.css';
100
104
  `;
101
105
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/css/index.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAC;AACpD,OAAO,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAC;AAC1C,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAC3C,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAE7C,MAAM,UAAU,gBAAgB,CAAC,KAAuB,EAAE,SAAiB;IACzE,MAAM,KAAK,GAAa,EAAE,CAAC;IAE3B,KAAK,CAAC,IAAI,CAAC,4BAA4B,SAAS,KAAK,CAAC,CAAC;IACvD,KAAK,CAAC,IAAI,CAAC,4CAA4C,CAAC,CAAC;IACzD,KAAK,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;IAEf,KAAK,MAAM,CAAC,GAAG,EAAE,KAAK,CAAC,IAAI,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,EAAE,CAAC;QACjD,MAAM,UAAU,GAAG,KAAK,GAAG,CAAC,OAAO,CAAC,UAAU,EAAE,KAAK,CAAC,CAAC,WAAW,EAAE,EAAE,CAAC;QACvE,KAAK,CAAC,IAAI,CAAC,KAAK,UAAU,KAAK,KAAK,GAAG,CAAC,CAAC;IAC3C,CAAC;IAED,OAAO,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;AAC1B,CAAC;AAED,MAAM,UAAU,eAAe;IAC7B,MAAM,KAAK,GAAa,EAAE,CAAC;IAE3B,KAAK,CAAC,IAAI,CAAC,kBAAkB,CAAC,CAAC;IAC/B,KAAK,MAAM,IAAI,IAAI,MAAM,CAAC,MAAM,CAAC,YAAY,CAAC,EAAE,CAAC;QAC/C,KAAK,CAAC,IAAI,CAAC,KAAK,IAAI,CAAC,MAAM,KAAK,IAAI,CAAC,KAAK,KAAK,IAAI,CAAC,QAAQ,GAAG,CAAC,CAAC;IACnE,CAAC;IAED,OAAO,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;AAC1B,CAAC;AAED,MAAM,UAAU,iBAAiB;IAC/B,MAAM,KAAK,GAAa,EAAE,CAAC;IAE3B,KAAK,CAAC,IAAI,CAAC,qBAAqB,CAAC,CAAC;IAClC,KAAK,MAAM,CAAC,IAAI,MAAM,CAAC,MAAM,CAAC,MAAM,CAAC,EAAE,CAAC;QACtC,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,KAAK,CAAC,CAAC,KAAK,GAAG,CAAC,CAAC;IAC3C,CAAC;IAED,OAAO,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;AAC1B,CAAC;AAED,MAAM,CAAC,MAAM,aAAa,GAAG;;;;;;;;;EAS3B,eAAe,EAAE;;EAEjB,iBAAiB,EAAE;;CAEpB,CAAC;AAEF,MAAM,CAAC,MAAM,YAAY,GAAG;;;;;;;;;EAS1B,gBAAgB,CAAC,SAAS,EAAE,MAAM,CAAC;;;;CAIpC,CAAC;AAEF,MAAM,CAAC,MAAM,aAAa,GAAG;;;;;;;;;EAS3B,gBAAgB,CAAC,UAAU,EAAE,OAAO,CAAC;;;;;;EAMrC,gBAAgB,CAAC,UAAU,EAAE,OAAO,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC;;CAEtE,CAAC;AAEF,MAAM,CAAC,MAAM,QAAQ,GAAG;;;;;;;;;;;;;;;CAevB,CAAC"}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/css/index.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAC;AACpD,OAAO,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAC;AAC1C,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAC3C,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAE7C,MAAM,UAAU,gBAAgB,CAAC,KAAuB,EAAE,SAAiB;IACzE,MAAM,KAAK,GAAa,EAAE,CAAC;IAE3B,KAAK,CAAC,IAAI,CAAC,4BAA4B,SAAS,KAAK,CAAC,CAAC;IACvD,KAAK,CAAC,IAAI,CAAC,4CAA4C,CAAC,CAAC;IACzD,KAAK,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;IAEf,KAAK,MAAM,CAAC,GAAG,EAAE,KAAK,CAAC,IAAI,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,EAAE,CAAC;QACjD,MAAM,UAAU,GAAG,KAAK,GAAG,CAAC,OAAO,CAAC,UAAU,EAAE,KAAK,CAAC,CAAC,WAAW,EAAE,EAAE,CAAC;QACvE,KAAK,CAAC,IAAI,CAAC,KAAK,UAAU,KAAK,KAAK,GAAG,CAAC,CAAC;IAC3C,CAAC;IAED,OAAO,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;AAC1B,CAAC;AAED,MAAM,UAAU,eAAe;IAC7B,MAAM,KAAK,GAAa,EAAE,CAAC;IAE3B,KAAK,CAAC,IAAI,CAAC,kBAAkB,CAAC,CAAC;IAC/B,KAAK,MAAM,IAAI,IAAI,MAAM,CAAC,MAAM,CAAC,YAAY,CAAC,EAAE,CAAC;QAC/C,KAAK,CAAC,IAAI,CAAC,KAAK,IAAI,CAAC,MAAM,KAAK,IAAI,CAAC,KAAK,KAAK,IAAI,CAAC,QAAQ,GAAG,CAAC,CAAC;IACnE,CAAC;IAED,OAAO,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;AAC1B,CAAC;AAED,MAAM,UAAU,iBAAiB;IAC/B,MAAM,KAAK,GAAa,EAAE,CAAC;IAE3B,KAAK,CAAC,IAAI,CAAC,qBAAqB,CAAC,CAAC;IAClC,KAAK,MAAM,CAAC,IAAI,MAAM,CAAC,MAAM,CAAC,MAAM,CAAC,EAAE,CAAC;QACtC,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,KAAK,CAAC,CAAC,KAAK,GAAG,CAAC,CAAC;IAC3C,CAAC;IAED,OAAO,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;AAC1B,CAAC;AAED,MAAM,CAAC,MAAM,aAAa,GAAG;;;;;;;;;EAS3B,eAAe,EAAE;;EAEjB,iBAAiB,EAAE;;CAEpB,CAAC;AAEF,MAAM,CAAC,MAAM,YAAY,GAAG;;;;;;;;;EAS1B,gBAAgB,CAAC,SAAS,EAAE,MAAM,CAAC;;;;CAIpC,CAAC;AAEF,MAAM,CAAC,MAAM,aAAa,GAAG;;;;;;;;;EAS3B,gBAAgB,CAAC,UAAU,EAAE,OAAO,CAAC;;;;;;EAMrC,gBAAgB,CAAC,UAAU,EAAE,OAAO,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC;;CAEtE,CAAC;AAEF,MAAM,CAAC,MAAM,QAAQ,GAAG;;;;;;;;;;;;;;;;;;;CAmBvB,CAAC"}
@@ -0,0 +1,273 @@
1
+
2
+ /* ── Page Header ── */
3
+ .cm-page-header {
4
+ display: flex;
5
+ flex-direction: column;
6
+ gap: 4px;
7
+ border-bottom: 1px solid hsl(var(--sidebar-border));
8
+ padding-bottom: 16px;
9
+ }
10
+
11
+ @media (min-width: 640px) {
12
+ .cm-page-header {
13
+ gap: 8px;
14
+ padding-bottom: 24px;
15
+ }
16
+ }
17
+
18
+ .cm-page-header__title-row {
19
+ display: flex;
20
+ align-items: center;
21
+ gap: 16px;
22
+ }
23
+
24
+ .cm-page-header__title {
25
+ font-family: var(--font-display), sans-serif;
26
+ font-weight: 700;
27
+ color: hsl(var(--foreground));
28
+ font-size: 20px;
29
+ }
30
+
31
+ @media (min-width: 640px) {
32
+ .cm-page-header__title {
33
+ font-size: 24px;
34
+ }
35
+ }
36
+
37
+ .cm-page-header__rule {
38
+ height: 1px;
39
+ width: 128px;
40
+ background: linear-gradient(90deg, hsl(var(--accent)), transparent);
41
+ }
42
+
43
+ .cm-page-header__subtitle {
44
+ color: hsl(var(--muted-foreground));
45
+ font-family: var(--font-mono, monospace);
46
+ font-size: 12px;
47
+ }
48
+
49
+ @media (min-width: 640px) {
50
+ .cm-page-header__subtitle {
51
+ font-size: 14px;
52
+ }
53
+ }
54
+
55
+ /* ── Card Grid ── */
56
+ .cm-card-grid {
57
+ display: grid;
58
+ grid-template-columns: 1fr;
59
+ gap: 16px;
60
+ }
61
+
62
+ @media (min-width: 640px) {
63
+ .cm-card-grid {
64
+ grid-template-columns: repeat(2, 1fr);
65
+ gap: 24px;
66
+ }
67
+ }
68
+
69
+ @media (min-width: 1024px) {
70
+ .cm-card-grid {
71
+ grid-template-columns: repeat(3, 1fr);
72
+ }
73
+ }
74
+
75
+ .cm-card-grid--2col {
76
+ grid-template-columns: 1fr;
77
+ }
78
+
79
+ @media (min-width: 640px) {
80
+ .cm-card-grid--2col {
81
+ grid-template-columns: repeat(2, 1fr);
82
+ }
83
+ }
84
+
85
+ /* ── Stat Cell ── */
86
+ .cm-stat-cell {
87
+ padding: 6px;
88
+ background: hsl(var(--background));
89
+ border: 1px solid hsl(var(--sidebar-border) / 0.5);
90
+ border-radius: 4px;
91
+ }
92
+
93
+ @media (min-width: 640px) {
94
+ .cm-stat-cell {
95
+ padding: 8px;
96
+ }
97
+ }
98
+
99
+ .cm-stat-cell__label {
100
+ font-size: 8px;
101
+ color: hsl(var(--muted-foreground));
102
+ text-transform: uppercase;
103
+ }
104
+
105
+ @media (min-width: 640px) {
106
+ .cm-stat-cell__label {
107
+ font-size: 10px;
108
+ }
109
+ }
110
+
111
+ .cm-stat-cell__value-row {
112
+ display: flex;
113
+ align-items: center;
114
+ gap: 4px;
115
+ }
116
+
117
+ .cm-stat-cell__value {
118
+ font-family: var(--font-mono, monospace);
119
+ font-size: 12px;
120
+ white-space: nowrap;
121
+ overflow: hidden;
122
+ text-overflow: ellipsis;
123
+ }
124
+
125
+ @media (min-width: 640px) {
126
+ .cm-stat-cell__value {
127
+ font-size: 14px;
128
+ }
129
+ }
130
+
131
+ /* ── Filter Bar ── */
132
+ .cm-filter-bar {
133
+ display: flex;
134
+ flex-direction: column;
135
+ gap: 12px;
136
+ }
137
+
138
+ @media (min-width: 640px) {
139
+ .cm-filter-bar {
140
+ flex-direction: row;
141
+ align-items: center;
142
+ justify-content: space-between;
143
+ }
144
+ }
145
+
146
+ .cm-filter-bar__actions {
147
+ display: flex;
148
+ align-items: center;
149
+ gap: 8px;
150
+ }
151
+
152
+ @media (max-width: 639px) {
153
+ .cm-filter-bar__actions {
154
+ justify-content: space-between;
155
+ }
156
+ }
157
+
158
+ /* ── Empty State (inline variant) ── */
159
+ .cm-empty-state-inline {
160
+ text-align: center;
161
+ padding: 48px 16px;
162
+ }
163
+
164
+ @media (min-width: 640px) {
165
+ .cm-empty-state-inline {
166
+ padding: 80px 16px;
167
+ }
168
+ }
169
+
170
+ .cm-empty-state-inline__icon {
171
+ margin: 0 auto 16px;
172
+ color: hsl(var(--muted-foreground) / 0.3);
173
+ width: 40px;
174
+ height: 40px;
175
+ }
176
+
177
+ @media (min-width: 640px) {
178
+ .cm-empty-state-inline__icon {
179
+ width: 48px;
180
+ height: 48px;
181
+ }
182
+ }
183
+
184
+ .cm-empty-state-inline__text {
185
+ color: hsl(var(--muted-foreground));
186
+ font-size: 14px;
187
+ }
188
+
189
+ @media (min-width: 640px) {
190
+ .cm-empty-state-inline__text {
191
+ font-size: 16px;
192
+ }
193
+ }
194
+
195
+ .cm-empty-state-inline__hint {
196
+ color: hsl(var(--muted-foreground) / 0.6);
197
+ font-size: 10px;
198
+ margin-top: 8px;
199
+ padding: 0 16px;
200
+ }
201
+
202
+ @media (min-width: 640px) {
203
+ .cm-empty-state-inline__hint {
204
+ font-size: 12px;
205
+ }
206
+ }
207
+
208
+ /* ── Stat Grid (centered, icon-above) ── */
209
+ .cm-stat-grid {
210
+ display: grid;
211
+ gap: 6px;
212
+ font-family: var(--font-mono, monospace);
213
+ }
214
+
215
+ @media (min-width: 640px) {
216
+ .cm-stat-grid {
217
+ gap: 12px;
218
+ }
219
+ }
220
+
221
+ .cm-stat-grid--3col {
222
+ grid-template-columns: repeat(3, 1fr);
223
+ }
224
+
225
+ .cm-stat-grid--2col {
226
+ grid-template-columns: repeat(2, 1fr);
227
+ }
228
+
229
+ .cm-stat-grid__cell {
230
+ text-align: center;
231
+ padding: 6px;
232
+ border-radius: 2px;
233
+ background: hsl(var(--sidebar-accent));
234
+ }
235
+
236
+ @media (min-width: 640px) {
237
+ .cm-stat-grid__cell {
238
+ padding: 8px;
239
+ }
240
+ }
241
+
242
+ .cm-stat-grid__cell-icon {
243
+ margin: 0 auto 2px;
244
+ width: 12px;
245
+ height: 12px;
246
+ }
247
+
248
+ @media (min-width: 640px) {
249
+ .cm-stat-grid__cell-icon {
250
+ width: 14px;
251
+ height: 14px;
252
+ margin-bottom: 4px;
253
+ }
254
+ }
255
+
256
+ .cm-stat-grid__cell-value {
257
+ font-weight: 700;
258
+ color: hsl(var(--foreground));
259
+ white-space: nowrap;
260
+ overflow: hidden;
261
+ text-overflow: ellipsis;
262
+ }
263
+
264
+ .cm-stat-grid__cell-label {
265
+ font-size: 8px;
266
+ color: hsl(var(--muted-foreground));
267
+ }
268
+
269
+ @media (min-width: 640px) {
270
+ .cm-stat-grid__cell-label {
271
+ font-size: 10px;
272
+ }
273
+ }