@sproutsocial/seeds-theme 0.1.0

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 (42) hide show
  1. package/README.md +259 -0
  2. package/dist/css-tokens.json +134 -0
  3. package/dist/legacy-dark.css +437 -0
  4. package/dist/legacy-light.css +437 -0
  5. package/dist/legacy.css +659 -0
  6. package/dist/schema.json +11798 -0
  7. package/dist/shadcn-dark.css +2 -0
  8. package/dist/shadcn-light.css +2 -0
  9. package/dist/shadcn.css +2 -0
  10. package/dist/shadcn.registry.json +77 -0
  11. package/dist/source/shadcn-dark.tokens.json +169 -0
  12. package/dist/source/shadcn-light.tokens.json +169 -0
  13. package/dist/source/theme-dark.tokens.json +1945 -0
  14. package/dist/source/theme-light.tokens.json +1945 -0
  15. package/dist/styled-components/index.cjs +1648 -0
  16. package/dist/styled-components/index.d.ts +3654 -0
  17. package/dist/styled-components/index.js +1641 -0
  18. package/dist/styled-components/index.ts +5285 -0
  19. package/dist/tailwind.css +40 -0
  20. package/dist/theme-dark.css +388 -0
  21. package/dist/theme-dark.d.ts +420 -0
  22. package/dist/theme-dark.js +401 -0
  23. package/dist/theme-dark.json +712 -0
  24. package/dist/theme-light.css +388 -0
  25. package/dist/theme-light.d.ts +420 -0
  26. package/dist/theme-light.js +400 -0
  27. package/dist/theme-light.json +712 -0
  28. package/dist/theme.css +611 -0
  29. package/mode-authoring.md +54 -0
  30. package/package.json +96 -0
  31. package/src/cli.js +42 -0
  32. package/src/compiler.d.ts +9 -0
  33. package/src/compiler.js +533 -0
  34. package/src/config.d.ts +39 -0
  35. package/src/config.js +280 -0
  36. package/src/contract.js +351 -0
  37. package/src/extension-schema.js +88 -0
  38. package/src/extension.d.ts +18 -0
  39. package/src/extension.js +81 -0
  40. package/src/index.d.ts +90 -0
  41. package/src/index.js +9 -0
  42. package/src/primitives.js +98 -0
package/dist/theme-light.css ADDED
@@ -0,0 +1,388 @@
1
+ :root {
2
+ --breakpoints-0: 900px;
3
+ --breakpoints-1: 1200px;
4
+ --breakpoints-2: 1500px;
5
+ --breakpoints-3: 1800px;
6
+ --breakpoints-sm: 640px;
7
+ --breakpoints-md: 768px;
8
+ --breakpoints-lg: 1024px;
9
+ --breakpoints-xl: 1280px;
10
+ --colors-gradient-ai-stop-2: oklch(0.5981 0.2541 298.01); /** Theme-owned AI gradient middle stop. No exact existing seeds-color primitive; preserved for compatibility. Other stops reference seeds-color. */
11
+ --colors-button-primary-border-base: oklch(0.0000 0.0000 0.00 / 0);
12
+ --colors-button-secondary-background-base: oklch(0.0000 0.0000 0.00 / 0);
13
+ --colors-button-pill-background-base: oklch(0.0000 0.0000 0.00 / 0);
14
+ --colors-button-pill-border-base: oklch(0.0000 0.0000 0.00 / 0);
15
+ --colors-button-destructive-border-base: oklch(0.0000 0.0000 0.00 / 0);
16
+ --colors-button-placeholder-background-base: oklch(0.0000 0.0000 0.00 / 0);
17
+ --colors-button-unstyled-background-base: oklch(0.0000 0.0000 0.00 / 0);
18
+ --colors-button-unstyled-border-base: oklch(0.0000 0.0000 0.00 / 0);
19
+ --colors-button-ai-primary-border-base: oklch(0.0000 0.0000 0.00 / 0);
20
+ --colors-button-ai-secondary-border-base: oklch(0.0000 0.0000 0.00 / 0);
21
+ --colors-button-ai-outline-background-base: oklch(0.0000 0.0000 0.00 / 0);
22
+ --colors-list-item-background-base: oklch(0.0000 0.0000 0.00 / 0);
23
+ --colors-nav-nav-item-background-base: oklch(0.0000 0.0000 0.00 / 0);
24
+ --colors-navigation-settings-list-item-background-base: oklch(0.0000 0.0000 0.00 / 0);
25
+ --mode: light;
26
+ --colors-container-background-positive-sentiment: var(--color-blue-500);
27
+ --colors-container-background-negative-sentiment: var(--color-red-500);
28
+ --colors-container-background-neutral-sentiment: var(--color-neutral-300);
29
+ --colors-container-background-base: var(--color-neutral-0);
30
+ --colors-container-background-success: var(--color-green-100);
31
+ --colors-container-background-warning: var(--color-yellow-100);
32
+ --colors-container-background-error: var(--color-red-100);
33
+ --colors-container-background-info: var(--color-blue-100);
34
+ --colors-container-background-opportunity: var(--color-purple-100);
35
+ --colors-container-background-danger: var(--color-red-100);
36
+ --colors-container-background-decorative-green: var(--color-green-100);
37
+ --colors-container-background-decorative-blue: var(--color-blue-100);
38
+ --colors-container-background-decorative-purple: var(--color-purple-100);
39
+ --colors-container-background-decorative-yellow: var(--color-yellow-100);
40
+ --colors-container-background-decorative-orange: var(--color-orange-100);
41
+ --colors-container-background-decorative-red: var(--color-red-100);
42
+ --colors-container-background-decorative-neutral: var(--color-neutral-100);
43
+ --colors-container-background-decorative-magenta: var(--color-magenta-100);
44
+ --colors-container-background-decorative-pink: var(--color-pink-100);
45
+ --colors-container-background-decorative-aqua: var(--color-aqua-100);
46
+ --colors-container-background-decorative-teal: var(--color-teal-100);
47
+ --colors-container-background-selected: var(--color-neutral-800);
48
+ --colors-container-border-success: var(--color-green-500);
49
+ --colors-container-border-warning: var(--color-yellow-600);
50
+ --colors-container-border-error: var(--color-red-600);
51
+ --colors-container-border-danger: var(--color-red-600);
52
+ --colors-container-border-info: var(--color-blue-600);
53
+ --colors-container-border-opportunity: var(--color-purple-500);
54
+ --colors-container-border-decorative-green: var(--color-green-500);
55
+ --colors-container-border-decorative-blue: var(--color-blue-600);
56
+ --colors-container-border-decorative-purple: var(--color-purple-500);
57
+ --colors-container-border-decorative-yellow: var(--color-yellow-600);
58
+ --colors-container-border-decorative-orange: var(--color-orange-600);
59
+ --colors-container-border-decorative-red: var(--color-red-600);
60
+ --colors-container-border-decorative-neutral: var(--color-neutral-600);
61
+ --colors-container-border-decorative-magenta: var(--color-magenta-600);
62
+ --colors-container-border-decorative-pink: var(--color-pink-600);
63
+ --colors-container-border-decorative-aqua: var(--color-aqua-500);
64
+ --colors-container-border-decorative-teal: var(--color-teal-500);
65
+ --colors-container-border-ai-generated: var(--color-purple-700);
66
+ --colors-container-border-base: var(--color-neutral-200);
67
+ --colors-container-border-selected: var(--color-neutral-800);
68
+ --colors-gradient-ai-stop-3: var(--color-magenta-400);
69
+ --colors-gradient-ai: radial-gradient(circle at bottom left, var(--color-blue-700) 0%, var(--colors-gradient-ai-stop-2) 61%, var(--color-magenta-400) 100%);
70
+ --colors-gradient-ai-subtle: radial-gradient(circle at bottom left, color-mix(in srgb, var(--color-blue-700), transparent 80%) 0%, color-mix(in srgb, var(--colors-gradient-ai-stop-2), transparent 80%) 61%, color-mix(in srgb, var(--color-magenta-400), transparent 80%) 100%);
71
+ --colors-gradient-ai-stop-1: var(--color-blue-700);
72
+ --colors-button-primary-background-base: var(--color-blue-700);
73
+ --colors-button-primary-background-hover: var(--color-blue-800);
74
+ --colors-button-primary-background-active: var(--color-blue-900);
75
+ --colors-button-primary-text-base: var(--color-neutral-0);
76
+ --colors-button-primary-text-hover: var(--color-neutral-0);
77
+ --colors-button-secondary-background-hover: var(--color-neutral-800);
78
+ --colors-button-secondary-background-active: var(--color-neutral-900);
79
+ --colors-button-secondary-border-base: var(--color-neutral-800);
80
+ --colors-button-secondary-text-base: var(--color-neutral-800);
81
+ --colors-button-secondary-text-hover: var(--color-neutral-0);
82
+ --colors-button-pill-background-hover: var(--color-neutral-100);
83
+ --colors-button-pill-background-active: var(--color-neutral-200);
84
+ --colors-button-pill-border-hover: var(--color-neutral-800);
85
+ --colors-button-pill-text-base: var(--color-neutral-800);
86
+ --colors-button-pill-text-hover: var(--color-neutral-900);
87
+ --colors-button-destructive-background-base: var(--color-red-800);
88
+ --colors-button-destructive-background-hover: var(--color-red-900);
89
+ --colors-button-destructive-background-active: var(--color-red-1000);
90
+ --colors-button-destructive-text-base: var(--color-neutral-0);
91
+ --colors-button-destructive-text-hover: var(--color-neutral-0);
92
+ --colors-button-placeholder-background-hover: var(--color-neutral-0);
93
+ --colors-button-placeholder-background-active: var(--color-neutral-0);
94
+ --colors-button-placeholder-border-base: var(--color-neutral-500);
95
+ --colors-button-placeholder-text-base: var(--color-blue-700);
96
+ --colors-button-placeholder-text-hover: var(--color-blue-800);
97
+ --colors-button-unstyled-text-base: var(--color-neutral-700);
98
+ --colors-button-unstyled-text-hover: var(--color-neutral-900);
99
+ --colors-button-ai-primary-text-base: var(--color-neutral-0);
100
+ --colors-button-ai-primary-text-hover: var(--color-neutral-0);
101
+ --colors-button-ai-secondary-text-base: var(--color-neutral-800);
102
+ --colors-button-ai-secondary-text-hover: var(--color-neutral-800);
103
+ --colors-button-ai-outline-text-base: var(--color-neutral-800);
104
+ --colors-button-ai-outline-text-hover: var(--color-neutral-800);
105
+ --colors-button-overlay-background-base: color-mix(in srgb, var(--color-neutral-1100), transparent 40%);
106
+ --colors-button-overlay-background-hover: color-mix(in srgb, var(--color-neutral-1100), transparent 25%);
107
+ --colors-button-overlay-text-base: var(--color-neutral-0);
108
+ --colors-icon-positive-sentiment: var(--color-blue-600);
109
+ --colors-icon-negative-sentiment: var(--color-red-600);
110
+ --colors-icon-base: var(--color-neutral-800);
111
+ --colors-icon-inverse: var(--color-neutral-0);
112
+ --colors-icon-success: var(--color-green-900);
113
+ --colors-icon-warning: var(--color-yellow-900);
114
+ --colors-icon-error: var(--color-red-900);
115
+ --colors-icon-danger: var(--color-red-900);
116
+ --colors-icon-info: var(--color-blue-900);
117
+ --colors-icon-opportunity: var(--color-purple-800);
118
+ --colors-icon-applied: var(--color-blue-700);
119
+ --colors-icon-neutral-sentiment: var(--color-neutral-600);
120
+ --colors-form-border-error: var(--color-red-600);
121
+ --colors-form-border-warning: var(--color-yellow-600);
122
+ --colors-form-border-base: var(--color-neutral-600);
123
+ --colors-form-border-selected: var(--color-neutral-800);
124
+ --colors-form-background-base: var(--color-neutral-0);
125
+ --colors-form-background-selected: var(--color-neutral-800);
126
+ --colors-form-placeholder-base: var(--color-neutral-700);
127
+ --colors-list-item-background-hover: var(--color-neutral-100);
128
+ --colors-list-item-background-selected: var(--color-neutral-800);
129
+ --colors-list-item-background-active: var(--color-neutral-400);
130
+ --colors-list-item-border-base: var(--color-neutral-600);
131
+ --colors-nav-nav-item-text-base: var(--color-neutral-0);
132
+ --colors-nav-nav-item-icon-base: var(--color-neutral-0);
133
+ --colors-nav-nav-item-indicator-notification-base: var(--color-pink-600);
134
+ --colors-nav-nav-item-indicator-user-status-online: var(--color-green-500);
135
+ --colors-nav-nav-item-indicator-user-status-offline: var(--color-red-600);
136
+ --colors-nav-nav-item-indicator-user-status-unavailable: var(--color-neutral-800);
137
+ --colors-nav-nav-item-background-hover: var(--color-neutral-800);
138
+ --colors-nav-nav-item-background-active: var(--color-neutral-1100);
139
+ --colors-nav-nav-item-background-selected: var(--color-neutral-700);
140
+ --colors-nav-nav-item-border-hover: var(--color-neutral-700);
141
+ --colors-nav-nav-item-border-active: var(--color-neutral-700);
142
+ --colors-nav-nav-item-border-selected: var(--color-neutral-700);
143
+ --colors-overlay-text-base: var(--color-neutral-0);
144
+ --colors-overlay-icon-base: var(--color-neutral-0);
145
+ --colors-overlay-background-base: color-mix(in srgb, var(--color-neutral-1000), transparent 44%);
146
+ --colors-overlay-background-inverse: color-mix(in srgb, var(--color-neutral-0), transparent 30%);
147
+ --colors-illustration-fill: var(--color-blue-400);
148
+ --colors-illustration-stroke: var(--color-neutral-900);
149
+ --colors-dataviz-map-1: var(--color-teal-500);
150
+ --colors-dataviz-map-2: var(--color-purple-700);
151
+ --colors-dataviz-map-3: var(--color-pink-700);
152
+ --colors-dataviz-map-4: var(--color-yellow-500);
153
+ --colors-dataviz-map-5: var(--color-blue-500);
154
+ --colors-dataviz-map-6: var(--color-magenta-500);
155
+ --colors-dataviz-map-7: var(--color-green-500);
156
+ --colors-dataviz-map-8: var(--color-orange-500);
157
+ --colors-dataviz-map-9: var(--color-red-700);
158
+ --colors-dataviz-map-10: var(--color-teal-900);
159
+ --colors-dataviz-map-11: var(--color-purple-400);
160
+ --colors-dataviz-map-12: var(--color-pink-900);
161
+ --colors-dataviz-map-13: var(--color-yellow-900);
162
+ --colors-dataviz-map-14: var(--color-blue-900);
163
+ --colors-dataviz-map-15: var(--color-magenta-900);
164
+ --colors-dataviz-map-16: var(--color-green-900);
165
+ --colors-dataviz-map-17: var(--color-orange-900);
166
+ --colors-dataviz-map-18: var(--color-red-400);
167
+ --colors-dataviz-map-19: var(--color-green-700);
168
+ --colors-dataviz-map-20: var(--color-yellow-800);
169
+ --colors-dataviz-list-0: var(--color-teal-500);
170
+ --colors-dataviz-list-1: var(--color-purple-700);
171
+ --colors-dataviz-list-2: var(--color-pink-700);
172
+ --colors-dataviz-list-3: var(--color-yellow-500);
173
+ --colors-dataviz-list-4: var(--color-blue-500);
174
+ --colors-dataviz-list-5: var(--color-magenta-500);
175
+ --colors-dataviz-list-6: var(--color-green-500);
176
+ --colors-dataviz-list-7: var(--color-orange-500);
177
+ --colors-dataviz-list-8: var(--color-red-700);
178
+ --colors-dataviz-list-9: var(--color-teal-900);
179
+ --colors-dataviz-list-10: var(--color-purple-400);
180
+ --colors-dataviz-list-11: var(--color-pink-900);
181
+ --colors-dataviz-list-12: var(--color-yellow-900);
182
+ --colors-dataviz-list-13: var(--color-blue-900);
183
+ --colors-dataviz-list-14: var(--color-magenta-900);
184
+ --colors-dataviz-list-15: var(--color-green-900);
185
+ --colors-dataviz-list-16: var(--color-orange-900);
186
+ --colors-dataviz-list-17: var(--color-red-400);
187
+ --colors-dataviz-list-18: var(--color-green-700);
188
+ --colors-dataviz-list-19: var(--color-yellow-800);
189
+ --colors-dataviz-placeholder: var(--color-neutral-300);
190
+ --colors-dataviz-colors-list-0: var(--color-teal-500);
191
+ --colors-dataviz-colors-list-1: var(--color-purple-700);
192
+ --colors-dataviz-colors-list-2: var(--color-pink-700);
193
+ --colors-dataviz-colors-list-3: var(--color-yellow-500);
194
+ --colors-dataviz-colors-list-4: var(--color-blue-500);
195
+ --colors-dataviz-colors-list-5: var(--color-magenta-500);
196
+ --colors-dataviz-colors-list-6: var(--color-green-500);
197
+ --colors-dataviz-colors-list-7: var(--color-orange-500);
198
+ --colors-dataviz-colors-list-8: var(--color-red-700);
199
+ --colors-dataviz-colors-list-9: var(--color-teal-900);
200
+ --colors-dataviz-colors-list-10: var(--color-purple-400);
201
+ --colors-dataviz-colors-list-11: var(--color-pink-900);
202
+ --colors-dataviz-colors-list-12: var(--color-yellow-900);
203
+ --colors-dataviz-colors-list-13: var(--color-blue-900);
204
+ --colors-dataviz-colors-list-14: var(--color-magenta-900);
205
+ --colors-dataviz-colors-list-15: var(--color-green-900);
206
+ --colors-dataviz-colors-list-16: var(--color-orange-900);
207
+ --colors-dataviz-colors-list-17: var(--color-red-400);
208
+ --colors-dataviz-colors-list-18: var(--color-green-700);
209
+ --colors-dataviz-colors-list-19: var(--color-yellow-800);
210
+ --colors-dataviz-colors-map-1: var(--color-teal-500);
211
+ --colors-dataviz-colors-map-2: var(--color-purple-700);
212
+ --colors-dataviz-colors-map-3: var(--color-pink-700);
213
+ --colors-dataviz-colors-map-4: var(--color-yellow-500);
214
+ --colors-dataviz-colors-map-5: var(--color-blue-500);
215
+ --colors-dataviz-colors-map-6: var(--color-magenta-500);
216
+ --colors-dataviz-colors-map-7: var(--color-green-500);
217
+ --colors-dataviz-colors-map-8: var(--color-orange-500);
218
+ --colors-dataviz-colors-map-9: var(--color-red-700);
219
+ --colors-dataviz-colors-map-10: var(--color-teal-900);
220
+ --colors-dataviz-colors-map-11: var(--color-purple-400);
221
+ --colors-dataviz-colors-map-12: var(--color-pink-900);
222
+ --colors-dataviz-colors-map-13: var(--color-yellow-900);
223
+ --colors-dataviz-colors-map-14: var(--color-blue-900);
224
+ --colors-dataviz-colors-map-15: var(--color-magenta-900);
225
+ --colors-dataviz-colors-map-16: var(--color-green-900);
226
+ --colors-dataviz-colors-map-17: var(--color-orange-900);
227
+ --colors-dataviz-colors-map-18: var(--color-red-400);
228
+ --colors-dataviz-colors-map-19: var(--color-green-700);
229
+ --colors-dataviz-colors-map-20: var(--color-yellow-800);
230
+ --colors-ai-feature-decorative-primary: var(--color-teal-800);
231
+ --colors-ai-feature-decorative-secondary: var(--color-blue-900);
232
+ --colors-ai-feature-background-primary: var(--color-teal-800);
233
+ --colors-ai-feature-background-secondary: var(--color-blue-900);
234
+ --colors-ai-feature-background-default-primary: var(--color-teal-800);
235
+ --colors-ai-feature-background-default-secondary: var(--color-blue-900);
236
+ --colors-ai-feature-background-inverse-primary: var(--color-teal-100);
237
+ --colors-ai-feature-background-inverse-secondary: var(--color-blue-200);
238
+ --colors-navigation-settings-list-item-background-hover: var(--color-neutral-200);
239
+ --colors-navigation-settings-list-item-background-selected: var(--color-neutral-0);
240
+ --colors-navigation-text-base: var(--color-neutral-0);
241
+ --colors-navigation-text-hover: var(--color-neutral-0);
242
+ --colors-navigation-icon-base: var(--color-neutral-0);
243
+ --colors-navigation-icon-hover: var(--color-neutral-0);
244
+ --colors-navigation-list-item-background-selected: var(--color-neutral-700);
245
+ --colors-navigation-list-item-background-base: var(--color-neutral-800);
246
+ --colors-navigation-list-item-background-hover: var(--color-neutral-1000);
247
+ --colors-navigation-main-background-base: var(--color-neutral-900);
248
+ --colors-navigation-main-background-overflow-gradient: var(--color-neutral-1000);
249
+ --colors-navigation-main-border-base: var(--color-neutral-1000);
250
+ --colors-navigation-secondary-background-base: var(--color-neutral-800);
251
+ --colors-navigation-secondary-widget-background-base: var(--color-neutral-1000);
252
+ --colors-navigation-secondary-accordion-background-base: var(--color-neutral-900);
253
+ --colors-date-picker-comparison-background-base: var(--color-neutral-400);
254
+ --colors-date-picker-comparison-text-base: var(--color-neutral-800);
255
+ --colors-listening-chart-indicator-hover-secondary: var(--color-neutral-0);
256
+ --colors-listening-chart-indicator-hover-primary: var(--color-neutral-1000);
257
+ --colors-listening-chart-indicator-default-primary: var(--color-neutral-400);
258
+ --colors-listening-chart-indicator-default-secondary: var(--color-neutral-0);
259
+ --colors-listening-chart-spike-background-base: var(--color-teal-500);
260
+ --colors-listening-chart-spike-icon-base: var(--color-neutral-0);
261
+ --colors-listening-topic-types-brand-health: var(--color-red-400);
262
+ --colors-listening-topic-types-industry-insights: var(--color-green-400);
263
+ --colors-listening-topic-types-competitive-analysis: var(--color-yellow-400);
264
+ --colors-listening-topic-types-campaign-analysis: var(--color-magenta-400);
265
+ --colors-listening-topic-types-event-monitoring: var(--color-aqua-400);
266
+ --colors-listening-topic-types-featured-topic: var(--color-green-400);
267
+ --colors-listening-topic-types-custom-topic: var(--color-blue-400);
268
+ --colors-listening-world-map-empty: var(--color-neutral-200);
269
+ --colors-listening-world-map-q0: var(--color-purple-200);
270
+ --colors-listening-world-map-q1: var(--color-purple-300);
271
+ --colors-listening-world-map-q2: var(--color-purple-400);
272
+ --colors-listening-world-map-q3: var(--color-purple-500);
273
+ --colors-listening-world-map-q4: var(--color-purple-600);
274
+ --colors-listening-world-map-q5: var(--color-purple-700);
275
+ --colors-listening-world-map-q6: var(--color-purple-800);
276
+ --colors-listening-world-map-q7: var(--color-purple-900);
277
+ --colors-growth-carousel-indicator-active: var(--color-blue-600);
278
+ --colors-growth-carousel-indicator-inactive: var(--color-neutral-300);
279
+ --colors-growth-education-decorative-aqua: var(--color-aqua-600);
280
+ --colors-growth-education-decorative-teal: var(--color-teal-700);
281
+ --colors-growth-opportunity-background-base: var(--color-purple-700);
282
+ --colors-growth-opportunity-background-secondary: var(--color-neutral-900);
283
+ --colors-growth-opportunity-background-hover: var(--color-purple-300);
284
+ --colors-growth-opportunity-decorative-green: var(--color-green-700);
285
+ --colors-growth-opportunity-decorative-light-aqua: var(--color-aqua-600);
286
+ --colors-growth-opportunity-decorative-dark-aqua: var(--color-aqua-1100);
287
+ --colors-growth-opportunity-decorative-purple: var(--color-purple-700);
288
+ --colors-growth-opportunity-button-primary-base: var(--color-purple-700);
289
+ --colors-growth-opportunity-button-primary-hover: var(--color-purple-800);
290
+ --colors-growth-opportunity-badge-background-base: var(--color-purple-200);
291
+ --colors-growth-opportunity-badge-background-active: var(--color-purple-800);
292
+ --colors-growth-opportunity-badge-icon-base: var(--color-purple-700);
293
+ --colors-growth-opportunity-badge-icon-active: var(--color-purple-100);
294
+ --colors-growth-opportunity-badge-text-base: var(--color-purple-700);
295
+ --colors-growth-dark-modal-background-base: var(--color-aqua-1100);
296
+ --colors-growth-dark-modal-text-base: var(--color-neutral-0);
297
+ --colors-growth-dark-modal-cards-background-base: var(--color-neutral-0);
298
+ --colors-growth-dark-modal-cards-background-hover: var(--color-purple-100);
299
+ --colors-growth-dark-modal-cards-text-base: var(--color-neutral-800);
300
+ --colors-growth-dark-modal-cards-text-hover: var(--color-neutral-900);
301
+ --colors-growth-dark-modal-cards-border-base: var(--color-neutral-0);
302
+ --colors-growth-dark-modal-cards-border-hover: var(--color-purple-700);
303
+ --colors-growth-user-status-online: var(--color-green-700);
304
+ --colors-growth-featured-demo-background-primary-base: var(--color-blue-700);
305
+ --colors-growth-featured-demo-background-primary-hover: var(--color-blue-900);
306
+ --colors-growth-featured-demo-background-secondary-base: var(--color-purple-800);
307
+ --colors-growth-featured-demo-background-secondary-hover: var(--color-purple-800);
308
+ --colors-app-background-base: var(--color-neutral-100);
309
+ --colors-link-base: var(--color-blue-800);
310
+ --colors-link-hover: var(--color-blue-900);
311
+ --colors-text-headline: var(--color-neutral-900);
312
+ --colors-text-subtext: var(--color-neutral-700);
313
+ --colors-text-body: var(--color-neutral-800);
314
+ --colors-text-inverse: var(--color-neutral-0);
315
+ --colors-text-error: var(--color-red-900);
316
+ --colors-text-background-highlight: var(--color-yellow-200);
317
+ --colors-text-background-selection: var(--color-blue-300);
318
+ --colors-text-decorative-green: var(--color-green-900);
319
+ --colors-text-decorative-blue: var(--color-blue-900);
320
+ --colors-text-decorative-purple: var(--color-purple-800);
321
+ --colors-text-decorative-yellow: var(--color-yellow-900);
322
+ --colors-text-decorative-orange: var(--color-orange-900);
323
+ --colors-text-decorative-red: var(--color-red-900);
324
+ --colors-text-decorative-neutral: var(--color-neutral-900);
325
+ --colors-text-decorative-magenta: var(--color-magenta-900);
326
+ --colors-text-decorative-pink: var(--color-pink-900);
327
+ --colors-text-decorative-aqua: var(--color-aqua-900);
328
+ --colors-text-decorative-teal: var(--color-teal-900);
329
+ --colors-text-ai-generated: var(--color-neutral-900);
330
+ --colors-menu-item-background-active: var(--color-neutral-400);
331
+ --colors-elevation-base: rgb(from var(--color-neutral-900) r g b / calc(61 / 255));
332
+ --colors-user-status-online: var(--color-green-700);
333
+ --colors-user-status-offline: var(--color-red-600);
334
+ --colors-user-status-unavailable: var(--color-neutral-600);
335
+ --colors-analytics-trend-positive: var(--color-teal-800);
336
+ --colors-analytics-trend-neutral: var(--color-neutral-800);
337
+ --colors-analytics-trend-negative: var(--color-neutral-800);
338
+ --colors-analytics-overlay-background-base: color-mix(in srgb, var(--color-neutral-0), transparent 20%);
339
+ --colors-card-control-background-base: var(--color-neutral-0);
340
+ --colors-card-control-background-selected: var(--color-neutral-800);
341
+ --colors-card-control-background-hover: var(--color-neutral-100);
342
+ --colors-card-control-text-selected: var(--color-neutral-0);
343
+ --colors-tags-collections-background-base: var(--color-neutral-100);
344
+ --colors-placeholder: var(--color-neutral-300);
345
+ --radii-inner: var(--border-radius-500);
346
+ --radii-outer: var(--border-radius-600);
347
+ --radii-pill: var(--border-radius-1000);
348
+ --shadows-low: var(--elevation-level-100) var(--colors-elevation-base);
349
+ --shadows-medium: var(--elevation-level-300) var(--colors-elevation-base);
350
+ --shadows-high: var(--elevation-level-400) var(--colors-elevation-base);
351
+ --colors-container-background-ai-generated: var(--colors-gradient-ai-subtle), var(--colors-container-background-base);
352
+ --colors-button-ai-primary-background-base: var(--colors-gradient-ai);
353
+ --colors-button-ai-secondary-background-base: var(--colors-gradient-ai-subtle);
354
+ --colors-button-ai-outline-border-base: var(--colors-gradient-ai);
355
+ --background: var(--colors-app-background-base); /** Background CSS alias for colors.app.background.base. */
356
+ --foreground: var(--colors-text-body); /** Foreground CSS alias for colors.text.body. */
357
+ --card: var(--colors-container-background-base); /** Card CSS alias for colors.container.background.base. */
358
+ --card-foreground: var(--colors-text-headline); /** Card foreground CSS alias for colors.text.headline. */
359
+ --popover: var(--colors-container-background-base); /** Popover CSS alias for colors.container.background.base. */
360
+ --popover-foreground: var(--colors-text-body); /** Popover foreground CSS alias for colors.text.body. */
361
+ --primary: var(--colors-button-primary-background-base); /** Primary CSS alias for colors.button.primary.background.base. */
362
+ --primary-foreground: var(--colors-button-primary-text-base); /** Primary foreground CSS alias for colors.button.primary.text.base. */
363
+ --secondary: var(--colors-container-border-base); /** Secondary CSS alias for colors.container.border.base. */
364
+ --secondary-foreground: var(--colors-text-body); /** Secondary foreground CSS alias for colors.text.body. */
365
+ --muted: var(--colors-container-background-decorative-neutral); /** Muted CSS alias for colors.container.background.decorative.neutral. */
366
+ --muted-foreground: var(--colors-text-subtext); /** Muted foreground CSS alias for colors.text.subtext. */
367
+ --accent: var(--colors-list-item-background-hover); /** Accent CSS alias for colors.listItem.background.hover. */
368
+ --accent-foreground: var(--colors-text-body); /** Accent foreground CSS alias for colors.text.body. */
369
+ --destructive: var(--colors-button-destructive-background-base); /** Destructive CSS alias for colors.button.destructive.background.base. */
370
+ --destructive-foreground: var(--colors-button-destructive-text-base); /** Destructive foreground CSS alias for colors.button.destructive.text.base. */
371
+ --border: var(--colors-container-border-base); /** Border CSS alias for colors.container.border.base. */
372
+ --input: var(--colors-form-border-base); /** Input CSS alias for colors.form.border.base. */
373
+ --ring: var(--colors-form-border-selected); /** Ring CSS alias for colors.form.border.selected. */
374
+ --radius: var(--radii-inner); /** Radius CSS alias for radii.inner. */
375
+ --sidebar: var(--colors-navigation-main-background-base); /** Sidebar CSS alias for colors.navigation.main.background.base. */
376
+ --sidebar-foreground: var(--colors-navigation-text-base); /** Sidebar foreground CSS alias for colors.navigation.text.base. */
377
+ --sidebar-primary: var(--colors-navigation-list-item-background-selected); /** Sidebar primary CSS alias for colors.navigation.listItem.background.selected. */
378
+ --sidebar-primary-foreground: var(--colors-navigation-text-base); /** Sidebar primary foreground CSS alias for colors.navigation.text.base. */
379
+ --sidebar-accent: var(--colors-navigation-list-item-background-hover); /** Sidebar accent CSS alias for colors.navigation.listItem.background.hover. */
380
+ --sidebar-accent-foreground: var(--colors-navigation-text-hover); /** Sidebar accent foreground CSS alias for colors.navigation.text.hover. */
381
+ --sidebar-border: var(--colors-navigation-main-border-base); /** Sidebar border CSS alias for colors.navigation.main.border.base. */
382
+ --sidebar-ring: var(--colors-form-border-selected); /** Sidebar ring CSS alias for colors.form.border.selected. */
383
+ --chart-1: var(--colors-dataviz-map-1); /** Chart 1 CSS alias for colors.dataviz.map.1. */
384
+ --chart-2: var(--colors-dataviz-map-2); /** Chart 2 CSS alias for colors.dataviz.map.2. */
385
+ --chart-3: var(--colors-dataviz-map-3); /** Chart 3 CSS alias for colors.dataviz.map.3. */
386
+ --chart-4: var(--colors-dataviz-map-4); /** Chart 4 CSS alias for colors.dataviz.map.4. */
387
+ --chart-5: var(--colors-dataviz-map-5); /** Chart 5 CSS alias for colors.dataviz.map.5. */
388
+ }