@texturehq/edges 1.30.6 → 1.31.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.
package/dist/styles.css CHANGED
@@ -3,66 +3,43 @@
3
3
  :root, :host {
4
4
  --color-white: #ffffff;
5
5
  --color-black: #000000;
6
- --color-gray-50: #f9fafb;
7
- --color-gray-100: #f3f4f6;
8
- --color-gray-200: #e5e7eb;
9
- --color-gray-300: #d1d5db;
10
- --color-gray-400: #9ca3af;
11
- --color-gray-500: #6b7280;
12
- --color-gray-600: #4b5563;
13
- --color-gray-700: #374151;
14
- --color-gray-800: #1f2937;
15
- --color-gray-900: #111827;
16
- --color-gray-950: #030712;
17
- --color-red-50: oklch(0.971 0.013 17.38);
18
- --color-red-100: oklch(0.936 0.032 17.717);
19
- --color-red-200: oklch(0.885 0.062 18.334);
20
- --color-red-300: oklch(0.808 0.114 19.571);
21
- --color-red-400: oklch(0.704 0.191 22.216);
22
- --color-red-500: oklch(0.637 0.237 25.331);
23
- --color-red-600: oklch(0.577 0.245 27.325);
24
- --color-red-700: oklch(0.505 0.213 27.518);
25
- --color-red-800: oklch(0.444 0.177 26.899);
26
- --color-red-900: oklch(0.396 0.141 25.723);
27
- --color-red-950: oklch(0.258 0.092 26.042);
28
- --color-green-50: oklch(0.982 0.018 131.68);
29
- --color-green-100: oklch(0.947 0.052 132.272);
30
- --color-green-200: oklch(0.895 0.111 131.438);
31
- --color-green-300: oklch(0.82 0.178 132.63);
32
- --color-green-400: oklch(0.718 0.209 130.901);
33
- --color-green-500: oklch(0.627 0.194 130.331);
34
- --color-green-600: oklch(0.527 0.19 131.688);
35
- --color-green-700: oklch(0.437 0.154 132.474);
36
- --color-green-800: oklch(0.366 0.121 132.109);
37
- --color-green-900: oklch(0.314 0.095 133.748);
38
- --color-green-950: oklch(0.197 0.06 130.709);
39
- --color-blue-50: oklch(0.97 0.014 237.69);
40
- --color-blue-100: oklch(0.932 0.032 241.935);
41
- --color-blue-200: oklch(0.882 0.059 243.157);
42
- --color-blue-300: oklch(0.809 0.105 244.039);
43
- --color-blue-400: oklch(0.707 0.165 246.422);
44
- --color-blue-500: oklch(0.623 0.214 250.546);
45
- --color-blue-600: oklch(0.546 0.245 253.739);
46
- --color-blue-700: oklch(0.488 0.243 255.638);
47
- --color-blue-800: oklch(0.424 0.199 255.585);
48
- --color-blue-900: oklch(0.368 0.146 254.128);
49
- --color-blue-950: oklch(0.262 0.09 254.128);
50
- --color-yellow-50: oklch(0.987 0.024 102.851);
51
- --color-yellow-100: oklch(0.973 0.071 103.193);
52
- --color-yellow-200: oklch(0.945 0.129 101.54);
53
- --color-yellow-300: oklch(0.905 0.182 98.111);
54
- --color-yellow-400: oklch(0.852 0.199 91.936);
55
- --color-yellow-500: oklch(0.795 0.184 86.047);
56
- --color-yellow-600: oklch(0.681 0.162 75.834);
57
- --color-yellow-700: oklch(0.554 0.135 66.191);
58
- --color-yellow-800: oklch(0.456 0.111 61.896);
59
- --color-yellow-900: oklch(0.398 0.092 60.236);
60
- --color-yellow-950: oklch(0.265 0.06 56.259);
61
- --color-brand-primary: #444ae1;
62
- --color-brand-light: #f7f7ff;
63
- --color-brand-dark: #363ccb;
64
- --color-brand-background: #f6f7ff;
65
- --color-neutral-black: #000000;
6
+ --color-linen: #faf7f0;
7
+ --color-graphite: #2c2a26;
8
+ --color-ink: #111111;
9
+ --color-gray-50: #fafafa;
10
+ --color-gray-100: #f5f5f4;
11
+ --color-gray-200: #e7e6e5;
12
+ --color-gray-300: #d4d3d0;
13
+ --color-gray-400: #a09d98;
14
+ --color-gray-500: #7c7974;
15
+ --color-gray-600: #5d5b56;
16
+ --color-gray-700: #454340;
17
+ --color-gray-800: #302f2d;
18
+ --color-gray-900: #222120;
19
+ --color-gray-950: #161615;
20
+ --color-error-light: #fdecec;
21
+ --color-error-base: #c42d2d;
22
+ --color-error-dark: #7a1212;
23
+ --color-warning-light: #fcefd9;
24
+ --color-warning-base: #c88420;
25
+ --color-warning-dark: #7a4708;
26
+ --color-success-light: #e4f3e9;
27
+ --color-success-base: #278a4a;
28
+ --color-success-dark: #15452a;
29
+ --color-info-light: #e0eaf5;
30
+ --color-info-base: #2d6cb8;
31
+ --color-info-dark: #123862;
32
+ --color-scrim-light: rgba(0, 0, 0, 0.15);
33
+ --color-scrim-dark: rgba(255, 255, 255, 0.12);
34
+ --color-input-background-dark: rgba(255, 255, 255, 0.05);
35
+ --color-skeleton-wave-light: rgba(255, 255, 255, 0.6);
36
+ --color-skeleton-wave-dark: rgba(255, 255, 255, 0.08);
37
+ --color-viz-categorical-1: #5424db;
38
+ --color-viz-categorical-2: #d92361;
39
+ --color-viz-categorical-3: #e86a00;
40
+ --color-viz-categorical-4: #5d89ff;
41
+ --color-viz-categorical-5: #9a47e2;
42
+ --color-viz-categorical-6: #f24cb8;
66
43
  --motion-duration-instant: 0ms;
67
44
  --motion-duration-fast: 150ms;
68
45
  --motion-duration-normal: 250ms;
@@ -116,51 +93,52 @@
116
93
  --font-weight-medium: 500;
117
94
  --font-weight-semibold: 600;
118
95
  --font-weight-bold: 700;
119
- --action-brand-background: #444ae1;
120
- --action-brand-hover: #363ccb;
121
- --feedback-success-text: oklch(0.314 0.095 133.748);
122
- --color-map-marker-default: #444ae1;
123
96
  --color-background-body: #ffffff;
124
97
  --color-background-surface: #ffffff;
125
- --color-background-muted: #f3f4f6;
126
- --color-background-hover: #f3f4f6;
127
- --color-background-selected: #e5e7eb;
128
- --color-background-modal: rgba(0, 0, 0, 0.15);
98
+ --color-background-muted: #f5f5f4;
99
+ --color-background-hover: #fafafa;
100
+ --color-background-selected: #e7e6e5;
129
101
  --color-background-input: #ffffff;
130
- --theme-background-canvas: linear-gradient(to bottom right, rgb(239 246 255), rgb(250 245 255), rgb(253 242 248));
131
- --theme-background-ai: linear-gradient(to bottom right, rgb(245 243 255 / 0.5), rgb(255 255 255), rgb(240 249 255 / 0.5));
132
- --color-text-body: #333333;
133
- --color-text-heading: #111827;
134
- --color-text-muted: #4b5563;
135
- --color-text-caption: #6b7280;
136
- --color-text-subtle: #5f6873;
137
- --color-text-placeholder: #9ca3af;
138
- --color-text-disabled: #9ca3af;
139
- --color-text-link-default: #444ae1;
140
- --color-text-link-hover: #363ccb;
102
+ --color-background-modal: rgba(0, 0, 0, 0.15);
103
+ --color-background-canvas: linear-gradient(to bottom right, rgb(239 246 255), rgb(250 245 255), rgb(253 242 248));
104
+ --color-background-ai: linear-gradient(to bottom right, rgb(245 243 255 / 0.5), rgb(255 255 255), rgb(240 249 255 / 0.5));
105
+ --color-text-body: #2c2a26;
106
+ --color-text-heading: #111111;
107
+ --color-text-muted: #5d5b56;
108
+ --color-text-caption: #7c7974;
109
+ --color-text-subtle: #7c7974;
110
+ --color-text-placeholder: #a09d98;
111
+ --color-text-disabled: #d4d3d0;
112
+ --color-text-link-default: #111111;
113
+ --color-text-link-hover: #2c2a26;
141
114
  --color-text-onPrimary: #ffffff;
142
- --color-border-default: #e5e7eb;
143
- --color-border-focus: #111827;
144
- --color-border-muted: #e5e7eb;
145
- --color-border-input: #d1d5db;
146
- --color-feedback-success-text: #065f46;
147
- --color-feedback-success-background: #d1fae5;
148
- --color-feedback-success-border: #10b981;
149
- --color-feedback-error-text: #b91c1c;
150
- --color-feedback-error-background: #fee2e2;
151
- --color-feedback-error-border: #ef4444;
152
- --color-feedback-warning-text: #92400e;
153
- --color-feedback-warning-background: #fef3c7;
154
- --color-feedback-warning-border: #f59e0b;
155
- --color-feedback-info-text: #2563eb;
156
- --color-feedback-info-background: #dbeafe;
157
- --color-feedback-info-border: #93c5fd;
158
- --color-action-brand: #444ae1;
159
- --color-action-brand-hover: #363ccb;
115
+ --color-border-default: #e7e6e5;
116
+ --color-border-focus: #111111;
117
+ --color-border-muted: #f5f5f4;
118
+ --color-border-input: #d4d3d0;
119
+ --color-action-brand: #111111;
120
+ --color-action-brand-hover: #2c2a26;
160
121
  --color-action-brand-text: #ffffff;
161
- --color-action-default: #333333;
162
- --color-action-default-hover: #4b5563;
122
+ --color-action-default: #111111;
123
+ --color-action-default-hover: #2c2a26;
163
124
  --color-action-default-text: #ffffff;
125
+ --color-feedback-success-text: #15452a;
126
+ --color-feedback-success-background: #e4f3e9;
127
+ --color-feedback-success-border: #278a4a;
128
+ --color-feedback-error-text: #7a1212;
129
+ --color-feedback-error-background: #fdecec;
130
+ --color-feedback-error-border: #c42d2d;
131
+ --color-feedback-warning-text: #7a4708;
132
+ --color-feedback-warning-background: #fcefd9;
133
+ --color-feedback-warning-border: #c88420;
134
+ --color-feedback-info-text: #123862;
135
+ --color-feedback-info-background: #e0eaf5;
136
+ --color-feedback-info-border: #2d6cb8;
137
+ --color-viz-default: #5424db;
138
+ --color-skeleton-base: #e7e6e5;
139
+ --color-skeleton-highlight: #f5f5f4;
140
+ --color-skeleton-wave: rgba(255, 255, 255, 0.6);
141
+ --color-map-marker-default: #111111;
164
142
  --color-state-charging: #f3e8ff;
165
143
  --color-state-charging-data: #d9b6fd;
166
144
  --color-state-charging-border: #c084fc;
@@ -209,16 +187,6 @@
209
187
  --color-state-exporting-data: #f9c869;
210
188
  --color-state-exporting-border: #f59e0b;
211
189
  --color-state-exporting-text: #92400e;
212
- --color-viz-default: #0082ff;
213
- --color-viz-categorical-1: #a3eae4;
214
- --color-viz-categorical-2: #91a0ff;
215
- --color-viz-categorical-3: #ffd1a3;
216
- --color-viz-categorical-4: #ffabc8;
217
- --color-viz-categorical-5: #c1b8ff;
218
- --color-viz-categorical-6: #e0ffb8;
219
- --color-skeleton-base: #e5e7eb;
220
- --color-skeleton-highlight: #f3f4f6;
221
- --color-skeleton-wave: rgba(255, 255, 255, 0.5);
222
190
  --control-sm: 0.75rem;
223
191
  --control-md: 0.875rem;
224
192
  --control-lg: 1rem;
@@ -249,6 +217,17 @@
249
217
  "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
250
218
  --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",
251
219
  "Courier New", monospace;
220
+ --color-red-50: oklch(97.1% 0.013 17.38);
221
+ --color-red-100: oklch(93.6% 0.032 17.717);
222
+ --color-red-200: oklch(88.5% 0.062 18.334);
223
+ --color-red-300: oklch(80.8% 0.114 19.571);
224
+ --color-red-400: oklch(70.4% 0.191 22.216);
225
+ --color-red-500: oklch(63.7% 0.237 25.331);
226
+ --color-red-600: oklch(57.7% 0.245 27.325);
227
+ --color-red-700: oklch(50.5% 0.213 27.518);
228
+ --color-red-800: oklch(44.4% 0.177 26.899);
229
+ --color-red-900: oklch(39.6% 0.141 25.723);
230
+ --color-red-950: oklch(25.8% 0.092 26.042);
252
231
  --color-orange-50: oklch(98% 0.016 73.684);
253
232
  --color-orange-100: oklch(95.4% 0.038 75.164);
254
233
  --color-orange-200: oklch(90.1% 0.076 70.697);
@@ -261,7 +240,40 @@
261
240
  --color-amber-800: oklch(47.3% 0.137 46.201);
262
241
  --color-amber-900: oklch(41.4% 0.112 45.904);
263
242
  --color-amber-950: oklch(27.9% 0.077 45.635);
243
+ --color-yellow-50: oklch(98.7% 0.026 102.212);
244
+ --color-yellow-100: oklch(97.3% 0.071 103.193);
245
+ --color-yellow-200: oklch(94.5% 0.129 101.54);
246
+ --color-yellow-300: oklch(90.5% 0.182 98.111);
247
+ --color-yellow-400: oklch(85.2% 0.199 91.936);
248
+ --color-yellow-500: oklch(79.5% 0.184 86.047);
249
+ --color-yellow-600: oklch(68.1% 0.162 75.834);
250
+ --color-yellow-700: oklch(55.4% 0.135 66.442);
251
+ --color-yellow-800: oklch(47.6% 0.114 61.907);
252
+ --color-yellow-900: oklch(42.1% 0.095 57.708);
253
+ --color-yellow-950: oklch(28.6% 0.066 53.813);
254
+ --color-green-50: oklch(98.2% 0.018 155.826);
255
+ --color-green-100: oklch(96.2% 0.044 156.743);
256
+ --color-green-200: oklch(92.5% 0.084 155.995);
257
+ --color-green-300: oklch(87.1% 0.15 154.449);
258
+ --color-green-400: oklch(79.2% 0.209 151.711);
259
+ --color-green-500: oklch(72.3% 0.219 149.579);
260
+ --color-green-600: oklch(62.7% 0.194 149.214);
261
+ --color-green-700: oklch(52.7% 0.154 150.069);
262
+ --color-green-800: oklch(44.8% 0.119 151.328);
263
+ --color-green-900: oklch(39.3% 0.095 152.535);
264
+ --color-green-950: oklch(26.6% 0.065 152.934);
264
265
  --color-teal-500: oklch(70.4% 0.14 182.503);
266
+ --color-blue-50: oklch(97% 0.014 254.604);
267
+ --color-blue-100: oklch(93.2% 0.032 255.585);
268
+ --color-blue-200: oklch(88.2% 0.059 254.128);
269
+ --color-blue-300: oklch(80.9% 0.105 251.813);
270
+ --color-blue-400: oklch(70.7% 0.165 254.624);
271
+ --color-blue-500: oklch(62.3% 0.214 259.815);
272
+ --color-blue-600: oklch(54.6% 0.245 262.881);
273
+ --color-blue-700: oklch(48.8% 0.243 264.376);
274
+ --color-blue-800: oklch(42.4% 0.199 265.638);
275
+ --color-blue-900: oklch(37.9% 0.146 265.522);
276
+ --color-blue-950: oklch(28.2% 0.091 267.935);
265
277
  --color-purple-50: oklch(97.7% 0.014 308.299);
266
278
  --color-purple-100: oklch(94.6% 0.033 307.174);
267
279
  --color-purple-500: oklch(62.7% 0.265 303.9);
@@ -340,127 +352,53 @@
340
352
  --default-mono-font-family: var(--font-mono);
341
353
  }
342
354
  :root {
343
- --color-neutral-white: var(--color-white);
344
- --color-neutral-black: var(--color-black);
345
- --action-brand-background: var(--color-brand-primary);
346
- --action-brand-hover: var(--color-brand-dark);
347
- --action-brand-text: var(--color-white);
348
- --action-default-background: var(--color-gray-900);
349
- --action-default-hover: var(--color-gray-700);
350
- --action-default-text: var(--color-white);
351
- --action-destructive-background: var(--color-red-700);
352
- --action-destructive-hover: var(--color-red-800);
353
- --action-destructive-text: var(--color-white);
354
- --action-disabled-background: var(--color-gray-300);
355
- --action-disabled-text: var(--color-gray-500);
356
- --feedback-success-text: var(--color-green-900);
357
- --feedback-success-icon: var(--color-green-700);
358
- --feedback-success-border: var(--color-green-600);
359
- --feedback-error-text: var(--color-red-700);
360
- --feedback-error-icon: var(--color-red-600);
361
- --feedback-error-border: var(--color-red-500);
362
- --feedback-warning-text: var(--color-yellow-900);
363
- --feedback-warning-icon: var(--color-yellow-700);
364
- --feedback-warning-border: var(--color-yellow-600);
365
- --feedback-info-text: var(--color-blue-700);
366
- --feedback-info-icon: var(--color-blue-600);
367
- --feedback-info-border: var(--color-blue-500);
368
- --color-map-marker-default: var(--color-action-brand);
369
- --color-map-streets-border: var(--color-black);
370
- --color-map-satellite-border: var(--color-white);
371
- --color-map-neutral-border: var(--color-black);
372
- --skeleton-base: var(--color-gray-200);
373
- --skeleton-highlight: var(--color-gray-100);
374
- --color-background-body: var(--color-white);
375
- --color-background-surface: var(--color-white);
376
- --color-background-muted: var(--color-gray-100);
377
- --color-background-hover: var(--color-gray-100);
378
- --color-background-selected: var(--color-gray-200);
379
- --color-background-input: var(--color-white);
380
- --color-text-heading: var(--color-gray-900);
381
- --theme-text-label: var(--color-gray-900);
382
- --color-text-muted: var(--color-gray-600);
383
- --color-text-caption: var(--color-gray-500);
384
- --color-text-placeholder: var(--color-gray-400);
385
- --color-text-disabled: var(--color-gray-400);
386
- --color-text-link-default: var(--color-brand-primary);
387
- --color-text-link-hover: var(--color-brand-dark);
388
- --color-text-onPrimary: var(--color-white);
389
- --color-border-default: var(--color-gray-200);
390
- --color-border-focus: var(--color-gray-900);
391
- --color-border-muted: var(--color-gray-200);
392
- --color-border-input: var(--color-gray-300);
393
- --color-action-brand: var(--color-brand-primary);
394
- --color-action-brand-hover: var(--color-brand-dark);
395
- --color-action-brand-text: var(--color-white);
396
- --color-action-default-text: var(--color-white);
397
- --color-skeleton-base: var(--color-gray-200);
398
- --color-skeleton-highlight: var(--color-gray-100);
399
- }
400
- .theme-dark {
401
355
  --color-white: #ffffff;
402
356
  --color-black: #000000;
403
- --color-gray-50: #f9fafb;
404
- --color-gray-100: #f3f4f6;
405
- --color-gray-200: #e5e7eb;
406
- --color-gray-300: #d1d5db;
407
- --color-gray-400: #9ca3af;
408
- --color-gray-500: #6b7280;
409
- --color-gray-600: #4b5563;
410
- --color-gray-700: #374151;
411
- --color-gray-800: #1f2937;
412
- --color-gray-900: #111827;
413
- --color-gray-950: #030712;
414
- --color-red-50: oklch(0.971 0.013 17.38);
415
- --color-red-100: oklch(0.936 0.032 17.717);
416
- --color-red-200: oklch(0.885 0.062 18.334);
417
- --color-red-300: oklch(0.808 0.114 19.571);
418
- --color-red-400: oklch(0.704 0.191 22.216);
419
- --color-red-500: oklch(0.637 0.237 25.331);
420
- --color-red-600: oklch(0.577 0.245 27.325);
421
- --color-red-700: oklch(0.505 0.213 27.518);
422
- --color-red-800: oklch(0.444 0.177 26.899);
423
- --color-red-900: oklch(0.396 0.141 25.723);
424
- --color-red-950: oklch(0.258 0.092 26.042);
425
- --color-green-50: oklch(0.982 0.018 131.68);
426
- --color-green-100: oklch(0.947 0.052 132.272);
427
- --color-green-200: oklch(0.895 0.111 131.438);
428
- --color-green-300: oklch(0.82 0.178 132.63);
429
- --color-green-400: oklch(0.718 0.209 130.901);
430
- --color-green-500: oklch(0.627 0.194 130.331);
431
- --color-green-600: oklch(0.527 0.19 131.688);
432
- --color-green-700: oklch(0.437 0.154 132.474);
433
- --color-green-800: oklch(0.366 0.121 132.109);
434
- --color-green-900: oklch(0.314 0.095 133.748);
435
- --color-green-950: oklch(0.197 0.06 130.709);
436
- --color-blue-50: oklch(0.97 0.014 237.69);
437
- --color-blue-100: oklch(0.932 0.032 241.935);
438
- --color-blue-200: oklch(0.882 0.059 243.157);
439
- --color-blue-300: oklch(0.809 0.105 244.039);
440
- --color-blue-400: oklch(0.707 0.165 246.422);
441
- --color-blue-500: oklch(0.623 0.214 250.546);
442
- --color-blue-600: oklch(0.546 0.245 253.739);
443
- --color-blue-700: oklch(0.488 0.243 255.638);
444
- --color-blue-800: oklch(0.424 0.199 255.585);
445
- --color-blue-900: oklch(0.368 0.146 254.128);
446
- --color-blue-950: oklch(0.262 0.09 254.128);
447
- --color-yellow-50: oklch(0.987 0.024 102.851);
448
- --color-yellow-100: oklch(0.973 0.071 103.193);
449
- --color-yellow-200: oklch(0.945 0.129 101.54);
450
- --color-yellow-300: oklch(0.905 0.182 98.111);
451
- --color-yellow-400: oklch(0.852 0.199 91.936);
452
- --color-yellow-500: oklch(0.795 0.184 86.047);
453
- --color-yellow-600: oklch(0.681 0.162 75.834);
454
- --color-yellow-700: oklch(0.554 0.135 66.191);
455
- --color-yellow-800: oklch(0.456 0.111 61.896);
456
- --color-yellow-900: oklch(0.398 0.092 60.236);
457
- --color-yellow-950: oklch(0.265 0.06 56.259);
458
- --color-brand-primary: #7a8ee1;
459
- --color-brand-light: #2a2d52;
460
- --color-brand-dark: #6a6fcc;
461
- --color-brand-background: #2e3258;
462
- --color-neutral-white: #ffffff;
463
- --color-neutral-black: #000000;
357
+ --color-linen: #faf7f0;
358
+ --color-graphite: #2c2a26;
359
+ --color-ink: #111111;
360
+ --color-gray-50: #fafafa;
361
+ --color-gray-100: #f5f5f4;
362
+ --color-gray-200: #e7e6e5;
363
+ --color-gray-300: #d4d3d0;
364
+ --color-gray-400: #a09d98;
365
+ --color-gray-500: #7c7974;
366
+ --color-gray-600: #5d5b56;
367
+ --color-gray-700: #454340;
368
+ --color-gray-800: #302f2d;
369
+ --color-gray-900: #222120;
370
+ --color-gray-950: #161615;
371
+ --color-honey-pastel: #fcebd4;
372
+ --color-honey-base: #f0972a;
373
+ --color-canary-pastel: #fffccc;
374
+ --color-canary-base: #ffff0c;
375
+ --color-moss-pastel: #eef6d8;
376
+ --color-moss-base: #8fbf2c;
377
+ --color-ocean-pastel: #dcf1f4;
378
+ --color-ocean-base: #2fa3b0;
379
+ --color-iris-pastel: #e3e6f5;
380
+ --color-iris-base: #3945a8;
381
+ --color-plum-pastel: #f0e3f7;
382
+ --color-plum-base: #8b39b8;
383
+ --color-rose-pastel: #fbe3ec;
384
+ --color-rose-base: #d93d72;
385
+ --color-error-light: #fdecec;
386
+ --color-error-base: #c42d2d;
387
+ --color-error-dark: #7a1212;
388
+ --color-warning-light: #fcefd9;
389
+ --color-warning-base: #c88420;
390
+ --color-warning-dark: #7a4708;
391
+ --color-success-light: #e4f3e9;
392
+ --color-success-base: #278a4a;
393
+ --color-success-dark: #15452a;
394
+ --color-info-light: #e0eaf5;
395
+ --color-info-base: #2d6cb8;
396
+ --color-info-dark: #123862;
397
+ --color-scrim-light: rgba(0, 0, 0, 0.15);
398
+ --color-scrim-dark: rgba(255, 255, 255, 0.12);
399
+ --color-input-background-dark: rgba(255, 255, 255, 0.05);
400
+ --color-skeleton-wave-light: rgba(255, 255, 255, 0.6);
401
+ --color-skeleton-wave-dark: rgba(255, 255, 255, 0.08);
464
402
  --motion-duration-instant: 0ms;
465
403
  --motion-duration-fast: 150ms;
466
404
  --motion-duration-normal: 250ms;
@@ -521,6 +459,19 @@
521
459
  --font-family-brand: 'TT Firs Neue', 'Helvetica Neue', Arial, system-ui, sans-serif;
522
460
  --font-family-serif: Merriweather, serif;
523
461
  --font-family-mono: 'Fira Code', monospace;
462
+ --font-size-xs: 0.75rem;
463
+ --font-size-sm: 0.875rem;
464
+ --font-size-base: 1rem;
465
+ --font-size-lg: 1.125rem;
466
+ --font-size-xl: 1.25rem;
467
+ --font-size-2xl: 1.5rem;
468
+ --font-size-3xl: 1.875rem;
469
+ --font-size-4xl: 2.25rem;
470
+ --font-size-5xl: 3rem;
471
+ --font-size-6xl: 3.75rem;
472
+ --font-size-7xl: 4.5rem;
473
+ --font-size-8xl: 6rem;
474
+ --font-size-9xl: 8rem;
524
475
  --font-weight-thin: 100;
525
476
  --font-weight-extralight: 200;
526
477
  --font-weight-light: 300;
@@ -541,305 +492,62 @@
541
492
  --font-letterspacing-wide: 0.025em;
542
493
  --font-letterspacing-wider: 0.05em;
543
494
  --font-letterspacing-widest: 0.1em;
544
- --action-brand-background: #7a8ee1;
545
- --action-brand-hover: #6a6fcc;
546
- --action-brand-text: #ffffff;
547
- --action-default-background: #111827;
548
- --action-default-hover: #374151;
549
- --action-default-text: #ffffff;
550
- --action-destructive-background: oklch(0.505 0.213 27.518);
551
- --action-destructive-hover: oklch(0.444 0.177 26.899);
552
- --action-destructive-text: #ffffff;
553
- --action-disabled-background: #d1d5db;
554
- --action-disabled-text: #6b7280;
555
- --feedback-success-text: oklch(0.314 0.095 133.748);
556
- --feedback-success-icon: oklch(0.437 0.154 132.474);
557
- --feedback-success-background: oklch(0.99 0.01 131.68);
558
- --feedback-success-border: oklch(0.527 0.19 131.688);
559
- --feedback-error-text: oklch(0.505 0.213 27.518);
560
- --feedback-error-icon: oklch(0.577 0.245 27.325);
561
- --feedback-error-background: oklch(0.985 0.008 17.38);
562
- --feedback-error-border: oklch(0.637 0.237 25.331);
563
- --feedback-warning-text: oklch(0.398 0.092 60.236);
564
- --feedback-warning-icon: oklch(0.554 0.135 66.191);
565
- --feedback-warning-background: oklch(0.993 0.015 102.851);
566
- --feedback-warning-border: oklch(0.681 0.162 75.834);
567
- --feedback-info-text: oklch(0.488 0.243 255.638);
568
- --feedback-info-icon: oklch(0.546 0.245 253.739);
569
- --feedback-info-background: oklch(0.985 0.008 237.69);
570
- --feedback-info-border: oklch(0.623 0.214 250.546);
571
- --color-map-marker-default: #7a8ee1;
572
- --color-map-streets-border: #000000;
573
- --color-map-neutral-border: #000000;
574
- --skeleton-base: #e5e7eb;
575
- --skeleton-highlight: #f3f4f6;
576
- --skeleton-wave: rgba(255, 255, 255, 0.5);
577
- --color-background-body: #151a30;
578
- --color-background-surface: #1a2038;
579
- --color-background-muted: #374151;
580
- --color-background-hover: #242d47;
581
- --color-background-selected: #4b5563;
582
- --color-background-modal: rgba(255, 255, 255, 0.12);
583
- --color-background-input: rgba(255, 255, 255, 0.05);
584
- --theme-background-canvas: linear-gradient(to bottom right, rgb(24 28 48), rgb(30 26 45), rgb(35 26 38));
585
- --theme-background-ai: linear-gradient(to bottom right, rgb(46 16 101 / 0.2), rgb(31 41 55), rgb(8 47 73 / 0.2));
586
- --color-text-body: #ededef;
587
- --color-text-heading: #ffffff;
588
- --theme-text-label: #ffffff;
589
- --color-text-muted: #9ca3af;
590
- --color-text-caption: #d1d5db;
591
- --color-text-subtle: #8e8e93;
592
- --color-text-placeholder: #9ca3af;
593
- --color-text-disabled: #9ca3af;
594
- --color-text-link-default: #b4b9ff;
595
- --color-text-link-hover: #c0c5ff;
596
- --color-text-onPrimary: #1f2937;
597
- --color-border-default: #2e3a59;
598
- --color-border-focus: #e5e7eb;
599
- --color-border-muted: #4b5563;
600
- --color-border-input: #6b7280;
601
- --color-feedback-success-text: #d1fae5;
602
- --color-feedback-success-background: #064e3b;
603
- --color-feedback-success-border: #059669;
604
- --color-feedback-error-text: #f87171;
605
- --color-feedback-error-background: #7f1d1d;
606
- --color-feedback-error-border: #dc2626;
607
- --color-feedback-warning-text: #fbbf24;
608
- --color-feedback-warning-background: #78350f;
609
- --color-feedback-warning-border: #d97706;
610
- --color-feedback-info-text: #60a5fa;
611
- --color-feedback-info-background: #1e3a8a;
612
- --color-feedback-info-border: #2563eb;
613
- --color-action-brand: #7a8ee1;
614
- --color-action-brand-hover: #6a6fcc;
495
+ --color-background-body: #ffffff;
496
+ --color-background-surface: #ffffff;
497
+ --color-background-muted: #f5f5f4;
498
+ --color-background-hover: #fafafa;
499
+ --color-background-selected: #e7e6e5;
500
+ --color-background-input: #ffffff;
501
+ --color-background-modal: rgba(0, 0, 0, 0.15);
502
+ --color-background-canvas: linear-gradient(to bottom right, rgb(239 246 255), rgb(250 245 255), rgb(253 242 248));
503
+ --color-background-ai: linear-gradient(to bottom right, rgb(245 243 255 / 0.5), rgb(255 255 255), rgb(240 249 255 / 0.5));
504
+ --color-text-body: #2c2a26;
505
+ --color-text-heading: #111111;
506
+ --theme-text-label: #111111;
507
+ --color-text-muted: #5d5b56;
508
+ --color-text-caption: #7c7974;
509
+ --color-text-subtle: #7c7974;
510
+ --color-text-placeholder: #a09d98;
511
+ --color-text-disabled: #d4d3d0;
512
+ --color-text-link-default: #111111;
513
+ --color-text-link-hover: #2c2a26;
514
+ --color-text-onPrimary: #ffffff;
515
+ --color-text-onBrand: #ffffff;
516
+ --color-border-default: #e7e6e5;
517
+ --color-border-focus: #111111;
518
+ --color-border-muted: #f5f5f4;
519
+ --color-border-input: #d4d3d0;
520
+ --color-action-brand: #111111;
521
+ --color-action-brand-hover: #2c2a26;
615
522
  --color-action-brand-text: #ffffff;
616
- --color-action-default: #ededef;
617
- --color-action-default-hover: #ffffff;
618
- --color-action-default-text: #111827;
619
- --color-state-charging: #581c87;
620
- --color-state-charging-data: #8038bf;
621
- --color-state-charging-border: #a855f7;
622
- --color-state-charging-text: #e9d5ff;
623
- --color-state-discharging: #78350f;
624
- --color-state-discharging-data: #b1740b;
625
- --color-state-discharging-border: #eab308;
626
- --color-state-discharging-text: #fef3c7;
627
- --color-state-heat: #7f1d1d;
628
- --color-state-heat-data: #b73030;
629
- --color-state-heat-border: #ef4444;
630
- --color-state-heat-text: #fee2e2;
631
- --color-state-cool: #1e3a8a;
632
- --color-state-cool-data: #2c5ec0;
633
- --color-state-cool-border: #3b82f6;
634
- --color-state-cool-text: #dbeafe;
635
- --color-state-eco: #064e3b;
636
- --color-state-eco-data: #0b835e;
637
- --color-state-eco-border: #10b981;
638
- --color-state-eco-text: #d1fae5;
639
- --color-state-auto: #7c2d12;
640
- --color-state-auto-data: #bb5f27;
641
- --color-state-auto-border: #fb923c;
642
- --color-state-auto-text: #ffedd5;
643
- --color-state-circulate: #312e81;
644
- --color-state-circulate-data: #4f46e5;
645
- --color-state-circulate-border: #818cf8;
646
- --color-state-circulate-text: #e0e7ff;
647
- --color-state-on: #134e4a;
648
- --color-state-on-data: #138378;
649
- --color-state-on-border: #14b8a6;
650
- --color-state-on-text: #ccfbf1;
651
- --color-state-idle: #374151;
652
- --color-state-idle-data: #515968;
653
- --color-state-idle-border: #6b7280;
654
- --color-state-idle-text: #e5e7eb;
655
- --color-state-off: #374151;
656
- --color-state-off-data: #515968;
657
- --color-state-off-border: #6b7280;
658
- --color-state-off-text: #e5e7eb;
659
- --color-state-unknown: #1f2937;
660
- --color-state-unknown-data: #454d5b;
661
- --color-state-unknown-border: #6b7280;
662
- --color-state-unknown-text: #ffffff;
663
- --color-state-importing: #1e3a8a;
664
- --color-state-importing-data: #3f6fc2;
665
- --color-state-importing-border: #60a5fa;
666
- --color-state-importing-text: #dbeafe;
667
- --color-state-exporting: #78350f;
668
- --color-state-exporting-data: #b97a19;
669
- --color-state-exporting-border: #fbbf24;
670
- --color-state-exporting-text: #fef3c7;
671
- --color-map-streets-border: #ffffff;
672
- --color-map-satellite-border: #ffffff;
673
- --color-map-neutral-border: #ffffff;
674
- --color-viz-default: #4da6ff;
675
- --color-viz-categorical-1: #7dd3c0;
676
- --color-viz-categorical-2: #a8b4ff;
677
- --color-viz-categorical-3: #ffd67a;
678
- --color-viz-categorical-4: #ffb3d9;
679
- --color-viz-categorical-5: #d4c4ff;
680
- --color-viz-categorical-6: #c8ff8e;
681
- --color-viz-sequential-viridis-1: #fde724;
682
- --color-viz-sequential-viridis-2: #b5de2b;
683
- --color-viz-sequential-viridis-3: #6ece58;
684
- --color-viz-sequential-viridis-4: #35b779;
685
- --color-viz-sequential-viridis-5: #1f9e89;
686
- --color-viz-sequential-viridis-6: #26828e;
687
- --color-viz-sequential-viridis-7: #31688e;
688
- --color-viz-sequential-viridis-8: #3e4a89;
689
- --color-viz-sequential-viridis-9: #482878;
690
- --color-viz-sequential-viridis-10: #440154;
691
- --color-viz-sequential-magma-1: #fcfdbf;
692
- --color-viz-sequential-magma-2: #feca8d;
693
- --color-viz-sequential-magma-3: #fd9668;
694
- --color-viz-sequential-magma-4: #f1605d;
695
- --color-viz-sequential-magma-5: #cd4071;
696
- --color-viz-sequential-magma-6: #9e2f7f;
697
- --color-viz-sequential-magma-7: #721f81;
698
- --color-viz-sequential-magma-8: #51127c;
699
- --color-viz-sequential-magma-9: #2c115f;
700
- --color-viz-sequential-magma-10: #0c0927;
701
- --color-viz-sequential-rose-1: #fff5ee;
702
- --color-viz-sequential-rose-2: #ffc9e8;
703
- --color-viz-sequential-rose-3: #ff95d5;
704
- --color-viz-sequential-rose-4: #eb5fb7;
705
- --color-viz-sequential-rose-5: #d13896;
706
- --color-viz-sequential-rose-6: #ac2681;
707
- --color-viz-sequential-rose-7: #841f78;
708
- --color-viz-sequential-rose-8: #631d67;
709
- --color-viz-sequential-rose-9: #3f1a4e;
710
- --color-viz-sequential-rose-10: #1e0f2e;
711
- --color-viz-sequential-cerulean-1: #e8fafd;
712
- --color-viz-sequential-cerulean-2: #b3e5f0;
713
- --color-viz-sequential-cerulean-3: #7fd4e8;
714
- --color-viz-sequential-cerulean-4: #4db8d8;
715
- --color-viz-sequential-cerulean-5: #2e9dc6;
716
- --color-viz-sequential-cerulean-6: #1a7ba3;
717
- --color-viz-sequential-cerulean-7: #0d5b7e;
718
- --color-viz-sequential-cerulean-8: #0a4263;
719
- --color-viz-sequential-cerulean-9: #072d47;
720
- --color-viz-sequential-cerulean-10: #041a2b;
721
- --color-viz-sequential-forest-1: #f7fcd4;
722
- --color-viz-sequential-forest-2: #d5ed99;
723
- --color-viz-sequential-forest-3: #afd66f;
724
- --color-viz-sequential-forest-4: #84ba4d;
725
- --color-viz-sequential-forest-5: #5a9b30;
726
- --color-viz-sequential-forest-6: #3a7a1e;
727
- --color-viz-sequential-forest-7: #285714;
728
- --color-viz-sequential-forest-8: #1a3c0d;
729
- --color-viz-sequential-forest-9: #0f2808;
730
- --color-viz-sequential-forest-10: #071403;
731
- --color-viz-sequential-red-yellow-green-1: #991b1b;
732
- --color-viz-sequential-red-yellow-green-2: #dc2626;
733
- --color-viz-sequential-red-yellow-green-3: #f87171;
734
- --color-viz-sequential-red-yellow-green-4: #fb923c;
735
- --color-viz-sequential-red-yellow-green-5: #fbbf24;
736
- --color-viz-sequential-red-yellow-green-6: #fde047;
737
- --color-viz-sequential-red-yellow-green-7: #bef264;
738
- --color-viz-sequential-red-yellow-green-8: #6ee7b7;
739
- --color-viz-sequential-red-yellow-green-9: #34d399;
740
- --color-viz-sequential-red-yellow-green-10: #10b981;
741
- --color-viz-diverging-orange-yellow-seafoam-1: #883a1f;
742
- --color-viz-diverging-orange-yellow-seafoam-2: #c25f27;
743
- --color-viz-diverging-orange-yellow-seafoam-3: #e8843d;
744
- --color-viz-diverging-orange-yellow-seafoam-4: #f5b774;
745
- --color-viz-diverging-orange-yellow-seafoam-5: #fef4c7;
746
- --color-viz-diverging-orange-yellow-seafoam-6: #b8e8d5;
747
- --color-viz-diverging-orange-yellow-seafoam-7: #73d4c5;
748
- --color-viz-diverging-orange-yellow-seafoam-8: #3db3a8;
749
- --color-viz-diverging-orange-yellow-seafoam-9: #1f8d82;
750
- --color-viz-diverging-orange-yellow-seafoam-10: #0d5d56;
751
- --color-viz-diverging-red-yellow-blue-1: #6b1e3c;
752
- --color-viz-diverging-red-yellow-blue-2: #a83b5e;
753
- --color-viz-diverging-red-yellow-blue-3: #d96e68;
754
- --color-viz-diverging-red-yellow-blue-4: #f0a487;
755
- --color-viz-diverging-red-yellow-blue-5: #fef4c7;
756
- --color-viz-diverging-red-yellow-blue-6: #b8ddd3;
757
- --color-viz-diverging-red-yellow-blue-7: #7bb8cf;
758
- --color-viz-diverging-red-yellow-blue-8: #4a8ec4;
759
- --color-viz-diverging-red-yellow-blue-9: #2d6bb0;
760
- --color-viz-diverging-red-yellow-blue-10: #1a4680;
761
- --color-viz-diverging-red-blue-1: #6b1e3c;
762
- --color-viz-diverging-red-blue-2: #a83b5e;
763
- --color-viz-diverging-red-blue-3: #d9668f;
764
- --color-viz-diverging-red-blue-4: #f09db8;
765
- --color-viz-diverging-red-blue-5: #f8e5f9;
766
- --color-viz-diverging-red-blue-6: #d4c9ed;
767
- --color-viz-diverging-red-blue-7: #b0b8df;
768
- --color-viz-diverging-red-blue-8: #8494ca;
769
- --color-viz-diverging-red-blue-9: #5d6fb0;
770
- --color-viz-diverging-red-blue-10: #374f88;
771
- --color-skeleton-base: #374151;
772
- --color-skeleton-highlight: #4b5563;
773
- --color-skeleton-wave: rgba(255, 255, 255, 0.15);
774
- }
775
- @layer base {
776
- :root {
777
- --text-xs: 0.75rem;
778
- --text-sm: 0.875rem;
779
- --text-base: 1rem;
780
- --text-lg: 1rem;
781
- --text-xl: 1.125rem;
782
- --text-2xl: 1.25rem;
783
- --text-3xl: 1.5rem;
784
- --text-4xl: 1.875rem;
785
- --text-5xl: 2.25rem;
786
- --text-6xl: 3rem;
787
- --text-7xl: 3.5rem;
788
- --text-8xl: 4rem;
789
- --text-9xl: 4.5rem;
790
- --font-size-xs: 0.75rem;
791
- --font-size-sm: 0.875rem;
792
- --font-size-base: 1rem;
793
- --font-size-lg: 1rem;
794
- --font-size-xl: 1.125rem;
795
- --font-size-2xl: 1.25rem;
796
- --font-size-3xl: 1.5rem;
797
- --font-size-4xl: 1.875rem;
798
- --font-size-5xl: 2.25rem;
799
- --font-size-6xl: 3rem;
800
- --font-size-7xl: 3.5rem;
801
- --font-size-8xl: 4rem;
802
- --font-size-9xl: 4.5rem;
803
- }
804
- @media (min-width: 768px) {
805
- :root {
806
- --text-xs: 0.75rem;
807
- --text-sm: 0.875rem;
808
- --text-base: 1rem;
809
- --text-lg: 1.125rem;
810
- --text-xl: 1.25rem;
811
- --text-2xl: 1.5rem;
812
- --text-3xl: 1.875rem;
813
- --text-4xl: 2.25rem;
814
- --text-5xl: 3rem;
815
- --text-6xl: 3.75rem;
816
- --text-7xl: 4.5rem;
817
- --text-8xl: 6rem;
818
- --text-9xl: 8rem;
819
- --font-size-xs: 0.75rem;
820
- --font-size-sm: 0.875rem;
821
- --font-size-base: 1rem;
822
- --font-size-lg: 1.125rem;
823
- --font-size-xl: 1.25rem;
824
- --font-size-2xl: 1.5rem;
825
- --font-size-3xl: 1.875rem;
826
- --font-size-4xl: 2.25rem;
827
- --font-size-5xl: 3rem;
828
- --font-size-6xl: 3.75rem;
829
- --font-size-7xl: 4.5rem;
830
- --font-size-8xl: 6rem;
831
- --font-size-9xl: 8rem;
832
- }
833
- }
834
- }
835
- :root {
836
- --color-viz-default: #0082ff;
837
- --color-viz-categorical-1: #a3eae4;
838
- --color-viz-categorical-2: #91a0ff;
839
- --color-viz-categorical-3: #ffd1a3;
840
- --color-viz-categorical-4: #ffabc8;
841
- --color-viz-categorical-5: #c1b8ff;
842
- --color-viz-categorical-6: #e0ffb8;
523
+ --color-action-default: #111111;
524
+ --color-action-default-hover: #2c2a26;
525
+ --color-action-default-text: #ffffff;
526
+ --color-feedback-success-text: #15452a;
527
+ --color-feedback-success-background: #e4f3e9;
528
+ --color-feedback-success-border: #278a4a;
529
+ --color-feedback-error-text: #7a1212;
530
+ --color-feedback-error-background: #fdecec;
531
+ --color-feedback-error-border: #c42d2d;
532
+ --color-feedback-warning-text: #7a4708;
533
+ --color-feedback-warning-background: #fcefd9;
534
+ --color-feedback-warning-border: #c88420;
535
+ --color-feedback-info-text: #123862;
536
+ --color-feedback-info-background: #e0eaf5;
537
+ --color-feedback-info-border: #2d6cb8;
538
+ --color-viz-default: #5424db;
539
+ --color-viz-categorical-1: #5424db;
540
+ --color-viz-categorical-2: #d92361;
541
+ --color-viz-categorical-3: #e86a00;
542
+ --color-viz-categorical-4: #5d89ff;
543
+ --color-viz-categorical-5: #9a47e2;
544
+ --color-viz-categorical-6: #f24cb8;
545
+ --color-viz-categorical-7: #0ba286;
546
+ --color-viz-categorical-8: #9c28af;
547
+ --color-viz-categorical-9: #036e45;
548
+ --color-viz-categorical-10: #52a119;
549
+ --color-viz-categorical-11: #ff513d;
550
+ --color-viz-categorical-12: #046691;
843
551
  --color-viz-sequential-viridis-1: #fafa37;
844
552
  --color-viz-sequential-viridis-2: #d6e654;
845
553
  --color-viz-sequential-viridis-3: #b2d373;
@@ -930,28 +638,301 @@
930
638
  --color-viz-diverging-red-blue-8: #7080b5;
931
639
  --color-viz-diverging-red-blue-9: #4d5e99;
932
640
  --color-viz-diverging-red-blue-10: #2b3d70;
641
+ --color-skeleton-base: #e7e6e5;
642
+ --color-skeleton-highlight: #f5f5f4;
643
+ --color-skeleton-wave: rgba(255, 255, 255, 0.6);
644
+ --color-map-marker-default: #111111;
645
+ --color-map-streets-border: #000000;
646
+ --color-map-satellite-border: #ffffff;
647
+ --color-map-neutral-border: #000000;
648
+ --color-state-charging: #f3e8ff;
933
649
  --color-state-charging-data: #d9b6fd;
650
+ --color-state-charging-border: #c084fc;
651
+ --color-state-charging-text: #6b21a8;
652
+ --color-state-discharging: #fffbeb;
934
653
  --color-state-discharging-data: #fce380;
654
+ --color-state-discharging-border: #facc15;
655
+ --color-state-discharging-text: #78350f;
656
+ --color-state-heat: #fee2e2;
935
657
  --color-state-heat-data: #fba9a9;
658
+ --color-state-heat-border: #f87171;
659
+ --color-state-heat-text: #920000;
660
+ --color-state-cool: #dbeafe;
936
661
  --color-state-cool-data: #9dc7fc;
662
+ --color-state-cool-border: #60a5fa;
663
+ --color-state-cool-text: #0334be;
664
+ --color-state-eco: #ddfff1;
937
665
  --color-state-eco-data: #88e9c5;
666
+ --color-state-eco-border: #34d399;
667
+ --color-state-eco-text: #065f46;
668
+ --color-state-auto: #ffedd5;
938
669
  --color-state-auto-data: #fed3a4;
670
+ --color-state-auto-border: #fdba74;
671
+ --color-state-auto-text: #7c2d12;
672
+ --color-state-circulate: #ede9fe;
939
673
  --color-state-circulate-data: #c4b5fd;
674
+ --color-state-circulate-border: #a78bfa;
675
+ --color-state-circulate-text: #4338ca;
676
+ --color-state-on: #ccfbf1;
940
677
  --color-state-on-data: #7ce7d8;
678
+ --color-state-on-border: #2dd4bf;
679
+ --color-state-on-text: #0f766e;
680
+ --color-state-idle: #e5e7eb;
941
681
  --color-state-idle-data: #c0c5cd;
682
+ --color-state-idle-border: #9ca3af;
683
+ --color-state-idle-text: #374151;
684
+ --color-state-off: #e5e7eb;
942
685
  --color-state-off-data: #c0c5cd;
686
+ --color-state-off-border: #9ca3af;
687
+ --color-state-off-text: #374151;
688
+ --color-state-unknown: #f8f8f8;
943
689
  --color-state-unknown-data: #e4e6e9;
690
+ --color-state-unknown-border: #d1d5db;
691
+ --color-state-unknown-text: #000000;
692
+ --color-state-importing: #dbeafe;
944
693
  --color-state-importing-data: #8bb6fa;
694
+ --color-state-importing-border: #3b82f6;
695
+ --color-state-importing-text: #1e40af;
696
+ --color-state-exporting: #fef3c7;
945
697
  --color-state-exporting-data: #f9c869;
698
+ --color-state-exporting-border: #f59e0b;
699
+ --color-state-exporting-text: #92400e;
700
+ }
701
+ :root {
702
+ --color-background-body: var(--color-white);
703
+ --color-background-surface: var(--color-white);
704
+ --color-background-muted: var(--color-gray-100);
705
+ --color-background-hover: var(--color-gray-50);
706
+ --color-background-selected: var(--color-gray-200);
707
+ --color-background-input: var(--color-white);
708
+ --color-background-modal: var(--color-scrim-light);
709
+ --color-text-body: var(--color-graphite);
710
+ --color-text-heading: var(--color-ink);
711
+ --theme-text-label: var(--color-ink);
712
+ --color-text-muted: var(--color-gray-600);
713
+ --color-text-caption: var(--color-gray-500);
714
+ --color-text-subtle: var(--color-gray-500);
715
+ --color-text-placeholder: var(--color-gray-400);
716
+ --color-text-disabled: var(--color-gray-300);
717
+ --color-text-link-default: var(--color-ink);
718
+ --color-text-link-hover: var(--color-graphite);
719
+ --color-text-onPrimary: var(--color-white);
720
+ --color-text-onBrand: var(--color-white);
721
+ --color-border-default: var(--color-gray-200);
722
+ --color-border-focus: var(--color-ink);
723
+ --color-border-muted: var(--color-gray-100);
724
+ --color-border-input: var(--color-gray-300);
725
+ --color-action-brand: var(--color-ink);
726
+ --color-action-brand-hover: var(--color-graphite);
727
+ --color-action-brand-text: var(--color-white);
728
+ --color-action-default: var(--color-ink);
729
+ --color-action-default-hover: var(--color-graphite);
730
+ --color-action-default-text: var(--color-white);
731
+ --color-feedback-success-text: var(--color-success-dark);
732
+ --color-feedback-success-background: var(--color-success-light);
733
+ --color-feedback-success-border: var(--color-success-base);
734
+ --color-feedback-error-text: var(--color-error-dark);
735
+ --color-feedback-error-background: var(--color-error-light);
736
+ --color-feedback-error-border: var(--color-error-base);
737
+ --color-feedback-warning-text: var(--color-warning-dark);
738
+ --color-feedback-warning-background: var(--color-warning-light);
739
+ --color-feedback-warning-border: var(--color-warning-base);
740
+ --color-feedback-info-text: var(--color-info-dark);
741
+ --color-feedback-info-background: var(--color-info-light);
742
+ --color-feedback-info-border: var(--color-info-base);
743
+ --color-viz-default: var(--color-viz-categorical-1);
744
+ --color-skeleton-base: var(--color-gray-200);
745
+ --color-skeleton-highlight: var(--color-gray-100);
746
+ --color-skeleton-wave: var(--color-skeleton-wave-light);
747
+ --color-map-marker-default: var(--color-action-brand);
748
+ --color-map-streets-border: var(--color-black);
749
+ --color-map-satellite-border: var(--color-white);
750
+ --color-map-neutral-border: var(--color-black);
946
751
  }
947
752
  .theme-dark {
948
- --color-viz-default: #4da6ff;
949
- --color-viz-categorical-1: #7dd3c0;
950
- --color-viz-categorical-2: #a8b4ff;
951
- --color-viz-categorical-3: #ffd67a;
952
- --color-viz-categorical-4: #ffb3d9;
953
- --color-viz-categorical-5: #d4c4ff;
954
- --color-viz-categorical-6: #c8ff8e;
753
+ --color-white: #ffffff;
754
+ --color-black: #000000;
755
+ --color-linen: #faf7f0;
756
+ --color-graphite: #d5d2cb;
757
+ --color-ink: #ededef;
758
+ --color-gray-50: #fafafa;
759
+ --color-gray-100: #f5f5f4;
760
+ --color-gray-200: #e7e6e5;
761
+ --color-gray-300: #d4d3d0;
762
+ --color-gray-400: #a09d98;
763
+ --color-gray-500: #7c7974;
764
+ --color-gray-600: #5d5b56;
765
+ --color-gray-700: #454340;
766
+ --color-gray-800: #302f2d;
767
+ --color-gray-900: #222120;
768
+ --color-gray-950: #161615;
769
+ --color-honey-pastel: #3d2a10;
770
+ --color-honey-base: #f4ad52;
771
+ --color-canary-pastel: #3d3a10;
772
+ --color-canary-base: #ffff5c;
773
+ --color-moss-pastel: #283318;
774
+ --color-moss-base: #a8d44a;
775
+ --color-ocean-pastel: #15343a;
776
+ --color-ocean-base: #48bcc8;
777
+ --color-iris-pastel: #1e2248;
778
+ --color-iris-base: #6270d0;
779
+ --color-plum-pastel: #2e1640;
780
+ --color-plum-base: #ab62d6;
781
+ --color-rose-pastel: #3d1628;
782
+ --color-rose-base: #e8658f;
783
+ --color-error-light: #3d1414;
784
+ --color-error-base: #e85454;
785
+ --color-error-dark: #fca5a5;
786
+ --color-warning-light: #3d2b0e;
787
+ --color-warning-base: #e0a03a;
788
+ --color-warning-dark: #fbd38d;
789
+ --color-success-light: #0e2e1a;
790
+ --color-success-base: #3daf68;
791
+ --color-success-dark: #86efac;
792
+ --color-info-light: #0e1e38;
793
+ --color-info-base: #5a94d4;
794
+ --color-info-dark: #93c5fd;
795
+ --color-scrim-light: rgba(0, 0, 0, 0.15);
796
+ --color-scrim-dark: rgba(255, 255, 255, 0.12);
797
+ --color-input-background-dark: rgba(255, 255, 255, 0.05);
798
+ --color-skeleton-wave-light: rgba(255, 255, 255, 0.6);
799
+ --color-skeleton-wave-dark: rgba(255, 255, 255, 0.08);
800
+ --motion-duration-instant: 0ms;
801
+ --motion-duration-fast: 150ms;
802
+ --motion-duration-normal: 250ms;
803
+ --motion-duration-slow: 350ms;
804
+ --motion-duration-slower: 500ms;
805
+ --motion-easing-standard: cubic-bezier(0.4, 0, 0.2, 1);
806
+ --motion-easing-emphasized: cubic-bezier(0, 0, 0.2, 1);
807
+ --motion-easing-accelerate: cubic-bezier(0.4, 0, 1, 1);
808
+ --motion-easing-deaccelerate: cubic-bezier(0, 0, 0.2, 1);
809
+ --motion-distance-xs: 4px;
810
+ --motion-distance-sm: 8px;
811
+ --motion-distance-md: 16px;
812
+ --motion-opacity-hover: 0.9;
813
+ --motion-opacity-disabled: 0.5;
814
+ --motion-scale-hover: 1.02;
815
+ --motion-scale-press: 0.97;
816
+ --spacing-0: 0;
817
+ --spacing-1: 0.25rem;
818
+ --spacing-2: 0.5rem;
819
+ --spacing-3: 0.75rem;
820
+ --spacing-4: 1rem;
821
+ --spacing-5: 1.25rem;
822
+ --spacing-6: 1.5rem;
823
+ --spacing-7: 1.75rem;
824
+ --spacing-8: 2rem;
825
+ --spacing-9: 2.25rem;
826
+ --spacing-10: 2.5rem;
827
+ --spacing-11: 2.75rem;
828
+ --spacing-12: 3rem;
829
+ --spacing-14: 3.5rem;
830
+ --spacing-16: 4rem;
831
+ --spacing-20: 5rem;
832
+ --spacing-24: 6rem;
833
+ --spacing-28: 7rem;
834
+ --spacing-32: 8rem;
835
+ --spacing-36: 9rem;
836
+ --spacing-40: 10rem;
837
+ --spacing-44: 11rem;
838
+ --spacing-48: 12rem;
839
+ --spacing-52: 13rem;
840
+ --spacing-56: 14rem;
841
+ --spacing-60: 15rem;
842
+ --spacing-64: 16rem;
843
+ --spacing-72: 18rem;
844
+ --spacing-80: 20rem;
845
+ --spacing-96: 24rem;
846
+ --radius-none: 0;
847
+ --radius-xs: 0.125rem;
848
+ --radius-sm: 0.25rem;
849
+ --radius-md: 0.375rem;
850
+ --radius-lg: 0.5rem;
851
+ --radius-xl: 0.75rem;
852
+ --radius-2xl: 1rem;
853
+ --radius-3xl: 1.5rem;
854
+ --radius-4xl: 2rem;
855
+ --radius-full: 9999px;
856
+ --font-family-sans: Inter, system-ui, sans-serif;
857
+ --font-family-brand: 'TT Firs Neue', 'Helvetica Neue', Arial, system-ui, sans-serif;
858
+ --font-family-serif: Merriweather, serif;
859
+ --font-family-mono: 'Fira Code', monospace;
860
+ --font-weight-thin: 100;
861
+ --font-weight-extralight: 200;
862
+ --font-weight-light: 300;
863
+ --font-weight-normal: 400;
864
+ --font-weight-medium: 500;
865
+ --font-weight-semibold: 600;
866
+ --font-weight-bold: 700;
867
+ --font-weight-extrabold: 800;
868
+ --font-weight-black: 900;
869
+ --font-lineheight-tight: 1.25;
870
+ --font-lineheight-snug: 1.375;
871
+ --font-lineheight-normal: 1.5;
872
+ --font-lineheight-relaxed: 1.625;
873
+ --font-lineheight-loose: 2;
874
+ --font-letterspacing-tighter: -0.05em;
875
+ --font-letterspacing-tight: -0.025em;
876
+ --font-letterspacing-normal: 0;
877
+ --font-letterspacing-wide: 0.025em;
878
+ --font-letterspacing-wider: 0.05em;
879
+ --font-letterspacing-widest: 0.1em;
880
+ --color-background-body: var(--color-gray-950);
881
+ --color-background-surface: var(--color-gray-900);
882
+ --color-background-muted: var(--color-gray-800);
883
+ --color-background-hover: var(--color-gray-900);
884
+ --color-background-selected: var(--color-gray-700);
885
+ --color-background-input: var(--color-input-background-dark);
886
+ --color-background-modal: var(--color-scrim-dark);
887
+ --color-background-canvas: linear-gradient(to bottom right, rgb(24 28 48), rgb(30 26 45), rgb(35 26 38));
888
+ --color-background-ai: linear-gradient(to bottom right, rgb(46 16 101 / 0.2), rgb(31 41 55), rgb(8 47 73 / 0.2));
889
+ --color-text-body: var(--color-gray-200);
890
+ --color-text-heading: var(--color-white);
891
+ --theme-text-label: var(--color-white);
892
+ --color-text-muted: var(--color-gray-400);
893
+ --color-text-caption: var(--color-gray-400);
894
+ --color-text-subtle: var(--color-gray-400);
895
+ --color-text-placeholder: var(--color-gray-400);
896
+ --color-text-disabled: var(--color-gray-700);
897
+ --color-text-link-default: var(--color-ink);
898
+ --color-text-link-hover: var(--color-graphite);
899
+ --color-text-onPrimary: var(--color-gray-900);
900
+ --color-text-onBrand: #111111;
901
+ --color-border-default: var(--color-gray-700);
902
+ --color-border-focus: var(--color-gray-200);
903
+ --color-border-muted: var(--color-gray-800);
904
+ --color-border-input: var(--color-gray-700);
905
+ --color-action-brand: var(--color-ink);
906
+ --color-action-brand-hover: var(--color-graphite);
907
+ --color-action-brand-text: #111111;
908
+ --color-action-default: var(--color-ink);
909
+ --color-action-default-hover: var(--color-graphite);
910
+ --color-action-default-text: #111111;
911
+ --color-feedback-success-text: var(--color-success-dark);
912
+ --color-feedback-success-background: var(--color-success-light);
913
+ --color-feedback-success-border: var(--color-success-base);
914
+ --color-feedback-error-text: var(--color-error-dark);
915
+ --color-feedback-error-background: var(--color-error-light);
916
+ --color-feedback-error-border: var(--color-error-base);
917
+ --color-feedback-warning-text: var(--color-warning-dark);
918
+ --color-feedback-warning-background: var(--color-warning-light);
919
+ --color-feedback-warning-border: var(--color-warning-base);
920
+ --color-feedback-info-text: var(--color-info-dark);
921
+ --color-feedback-info-background: var(--color-info-light);
922
+ --color-feedback-info-border: var(--color-info-base);
923
+ --color-viz-default: #7e5bec;
924
+ --color-viz-categorical-1: #7e5bec;
925
+ --color-viz-categorical-2: #d92361;
926
+ --color-viz-categorical-3: #e86a00;
927
+ --color-viz-categorical-4: #5d89ff;
928
+ --color-viz-categorical-5: #9a47e2;
929
+ --color-viz-categorical-6: #f24cb8;
930
+ --color-viz-categorical-7: #0ba286;
931
+ --color-viz-categorical-8: #9c28af;
932
+ --color-viz-categorical-9: #036e45;
933
+ --color-viz-categorical-10: #52a119;
934
+ --color-viz-categorical-11: #ff513d;
935
+ --color-viz-categorical-12: #046691;
955
936
  --color-viz-sequential-viridis-1: #fde724;
956
937
  --color-viz-sequential-viridis-2: #b5de2b;
957
938
  --color-viz-sequential-viridis-3: #6ece58;
@@ -1042,64 +1023,221 @@
1042
1023
  --color-viz-diverging-red-blue-8: #8494ca;
1043
1024
  --color-viz-diverging-red-blue-9: #5d6fb0;
1044
1025
  --color-viz-diverging-red-blue-10: #374f88;
1026
+ --color-skeleton-base: var(--color-gray-800);
1027
+ --color-skeleton-highlight: var(--color-gray-700);
1028
+ --color-skeleton-wave: var(--color-skeleton-wave-dark);
1029
+ --color-map-marker-default: var(--color-action-brand);
1030
+ --color-map-streets-border: var(--color-white);
1031
+ --color-map-satellite-border: var(--color-white);
1032
+ --color-map-neutral-border: var(--color-white);
1033
+ --color-state-charging: #581c87;
1045
1034
  --color-state-charging-data: #8038bf;
1035
+ --color-state-charging-border: #a855f7;
1036
+ --color-state-charging-text: #e9d5ff;
1037
+ --color-state-discharging: #78350f;
1046
1038
  --color-state-discharging-data: #b1740b;
1039
+ --color-state-discharging-border: #eab308;
1040
+ --color-state-discharging-text: #fef3c7;
1041
+ --color-state-heat: #7f1d1d;
1047
1042
  --color-state-heat-data: #b73030;
1043
+ --color-state-heat-border: #ef4444;
1044
+ --color-state-heat-text: #fee2e2;
1045
+ --color-state-cool: #1e3a8a;
1048
1046
  --color-state-cool-data: #2c5ec0;
1047
+ --color-state-cool-border: #3b82f6;
1048
+ --color-state-cool-text: #dbeafe;
1049
+ --color-state-eco: #064e3b;
1049
1050
  --color-state-eco-data: #0b835e;
1051
+ --color-state-eco-border: #10b981;
1052
+ --color-state-eco-text: #d1fae5;
1053
+ --color-state-auto: #7c2d12;
1050
1054
  --color-state-auto-data: #bb5f27;
1055
+ --color-state-auto-border: #fb923c;
1056
+ --color-state-auto-text: #ffedd5;
1057
+ --color-state-circulate: #312e81;
1051
1058
  --color-state-circulate-data: #4f46e5;
1059
+ --color-state-circulate-border: #818cf8;
1060
+ --color-state-circulate-text: #e0e7ff;
1061
+ --color-state-on: #134e4a;
1052
1062
  --color-state-on-data: #138378;
1063
+ --color-state-on-border: #14b8a6;
1064
+ --color-state-on-text: #ccfbf1;
1065
+ --color-state-idle: #374151;
1053
1066
  --color-state-idle-data: #515968;
1067
+ --color-state-idle-border: #6b7280;
1068
+ --color-state-idle-text: #e5e7eb;
1069
+ --color-state-off: #374151;
1054
1070
  --color-state-off-data: #515968;
1071
+ --color-state-off-border: #6b7280;
1072
+ --color-state-off-text: #e5e7eb;
1073
+ --color-state-unknown: #1f2937;
1055
1074
  --color-state-unknown-data: #454d5b;
1075
+ --color-state-unknown-border: #6b7280;
1076
+ --color-state-unknown-text: #ffffff;
1077
+ --color-state-importing: #1e3a8a;
1056
1078
  --color-state-importing-data: #3f6fc2;
1079
+ --color-state-importing-border: #60a5fa;
1080
+ --color-state-importing-text: #dbeafe;
1081
+ --color-state-exporting: #78350f;
1057
1082
  --color-state-exporting-data: #b97a19;
1083
+ --color-state-exporting-border: #fbbf24;
1084
+ --color-state-exporting-text: #fef3c7;
1085
+ }
1086
+ :root {
1087
+ --color-brand-primary: var(--color-ink);
1088
+ --color-brand-dark: var(--color-ink);
1089
+ --color-brand-light: var(--color-linen);
1090
+ --color-brand-background: var(--color-linen);
1091
+ --color-neutral-white: var(--color-white);
1092
+ --color-neutral-black: var(--color-black);
1093
+ --action-brand-background: var(--color-ink);
1094
+ --action-brand-hover: var(--color-graphite);
1095
+ --action-brand-text: var(--color-white);
1096
+ --action-default-background: var(--color-ink);
1097
+ --action-default-hover: var(--color-graphite);
1098
+ --action-default-text: var(--color-white);
1099
+ --action-destructive-background: var(--color-error-base);
1100
+ --action-destructive-hover: var(--color-error-dark);
1101
+ --action-destructive-text: var(--color-white);
1102
+ --action-disabled-background: var(--color-gray-300);
1103
+ --action-disabled-text: var(--color-gray-500);
1104
+ --feedback-success-text: var(--color-success-dark);
1105
+ --feedback-success-icon: var(--color-success-base);
1106
+ --feedback-success-background: var(--color-success-light);
1107
+ --feedback-success-border: var(--color-success-base);
1108
+ --feedback-error-text: var(--color-error-dark);
1109
+ --feedback-error-icon: var(--color-error-base);
1110
+ --feedback-error-background: var(--color-error-light);
1111
+ --feedback-error-border: var(--color-error-base);
1112
+ --feedback-warning-text: var(--color-warning-dark);
1113
+ --feedback-warning-icon: var(--color-warning-base);
1114
+ --feedback-warning-background: var(--color-warning-light);
1115
+ --feedback-warning-border: var(--color-warning-base);
1116
+ --feedback-info-text: var(--color-info-dark);
1117
+ --feedback-info-icon: var(--color-info-base);
1118
+ --feedback-info-background: var(--color-info-light);
1119
+ --feedback-info-border: var(--color-info-base);
1120
+ --skeleton-base: var(--color-gray-200);
1121
+ --skeleton-highlight: var(--color-gray-100);
1122
+ --skeleton-wave: var(--color-skeleton-wave-light);
1123
+ --theme-text-label: var(--color-ink);
1124
+ }
1125
+ :root {
1126
+ --theme-background-canvas: var(--color-background-canvas);
1127
+ --theme-background-ai: var(--color-background-ai);
1128
+ --theme-border-default: var(--color-border-default);
1129
+ --theme-border-muted: var(--color-border-muted);
1130
+ }
1131
+ .theme-dark {
1132
+ --theme-background-canvas: var(--color-background-canvas);
1133
+ --theme-background-ai: var(--color-background-ai);
1134
+ --theme-border-default: var(--color-border-default);
1135
+ --theme-border-muted: var(--color-border-muted);
1136
+ }
1137
+ @layer base {
1138
+ :root {
1139
+ --text-xs: 0.75rem;
1140
+ --text-sm: 0.875rem;
1141
+ --text-base: 1rem;
1142
+ --text-lg: 1rem;
1143
+ --text-xl: 1.125rem;
1144
+ --text-2xl: 1.25rem;
1145
+ --text-3xl: 1.5rem;
1146
+ --text-4xl: 1.875rem;
1147
+ --text-5xl: 2.25rem;
1148
+ --text-6xl: 3rem;
1149
+ --text-7xl: 3.5rem;
1150
+ --text-8xl: 4rem;
1151
+ --text-9xl: 4.5rem;
1152
+ --font-size-xs: 0.75rem;
1153
+ --font-size-sm: 0.875rem;
1154
+ --font-size-base: 1rem;
1155
+ --font-size-lg: 1rem;
1156
+ --font-size-xl: 1.125rem;
1157
+ --font-size-2xl: 1.25rem;
1158
+ --font-size-3xl: 1.5rem;
1159
+ --font-size-4xl: 1.875rem;
1160
+ --font-size-5xl: 2.25rem;
1161
+ --font-size-6xl: 3rem;
1162
+ --font-size-7xl: 3.5rem;
1163
+ --font-size-8xl: 4rem;
1164
+ --font-size-9xl: 4.5rem;
1165
+ }
1166
+ @media (min-width: 768px) {
1167
+ :root {
1168
+ --text-xs: 0.75rem;
1169
+ --text-sm: 0.875rem;
1170
+ --text-base: 1rem;
1171
+ --text-lg: 1.125rem;
1172
+ --text-xl: 1.25rem;
1173
+ --text-2xl: 1.5rem;
1174
+ --text-3xl: 1.875rem;
1175
+ --text-4xl: 2.25rem;
1176
+ --text-5xl: 3rem;
1177
+ --text-6xl: 3.75rem;
1178
+ --text-7xl: 4.5rem;
1179
+ --text-8xl: 6rem;
1180
+ --text-9xl: 8rem;
1181
+ --font-size-xs: 0.75rem;
1182
+ --font-size-sm: 0.875rem;
1183
+ --font-size-base: 1rem;
1184
+ --font-size-lg: 1.125rem;
1185
+ --font-size-xl: 1.25rem;
1186
+ --font-size-2xl: 1.5rem;
1187
+ --font-size-3xl: 1.875rem;
1188
+ --font-size-4xl: 2.25rem;
1189
+ --font-size-5xl: 3rem;
1190
+ --font-size-6xl: 3.75rem;
1191
+ --font-size-7xl: 4.5rem;
1192
+ --font-size-8xl: 6rem;
1193
+ --font-size-9xl: 8rem;
1194
+ }
1195
+ }
1058
1196
  }
1059
1197
  .theme-light {
1060
1198
  --color-background-body: #ffffff;
1061
1199
  --color-background-surface: #ffffff;
1062
- --color-background-muted: #f3f4f6;
1063
- --color-background-hover: #f3f4f6;
1064
- --color-background-selected: #e5e7eb;
1200
+ --color-background-muted: #f5f5f4;
1201
+ --color-background-hover: #fafafa;
1202
+ --color-background-selected: #e7e6e5;
1065
1203
  --color-background-modal: rgba(0, 0, 0, 0.15);
1066
1204
  --color-background-input: #ffffff;
1067
- --color-text-body: #333333;
1068
- --color-text-heading: #111827;
1069
- --color-text-muted: #4b5563;
1070
- --color-text-caption: #6b7280;
1071
- --color-text-subtle: #5f6873;
1072
- --color-text-placeholder: #9ca3af;
1073
- --color-text-disabled: #9ca3af;
1074
- --color-text-link-default: #444ae1;
1075
- --color-text-link-hover: #363ccb;
1205
+ --color-text-body: #2c2a26;
1206
+ --color-text-heading: #111111;
1207
+ --color-text-muted: #5d5b56;
1208
+ --color-text-caption: #7c7974;
1209
+ --color-text-subtle: #7c7974;
1210
+ --color-text-placeholder: #a09d98;
1211
+ --color-text-disabled: #d4d3d0;
1212
+ --color-text-link-default: #111111;
1213
+ --color-text-link-hover: #2c2a26;
1076
1214
  --color-text-onPrimary: #ffffff;
1077
- --color-border-default: #e5e7eb;
1078
- --color-border-focus: #111827;
1079
- --color-border-muted: #e5e7eb;
1080
- --color-border-input: #d1d5db;
1081
- --color-feedback-success-text: #065f46;
1082
- --color-feedback-success-background: #d1fae5;
1083
- --color-feedback-success-border: #10b981;
1084
- --color-feedback-error-text: #b91c1c;
1085
- --color-feedback-error-background: #fee2e2;
1086
- --color-feedback-error-border: #ef4444;
1087
- --color-feedback-warning-text: #92400e;
1088
- --color-feedback-warning-background: #fef3c7;
1089
- --color-feedback-warning-border: #f59e0b;
1090
- --color-feedback-info-text: #2563eb;
1091
- --color-feedback-info-background: #dbeafe;
1092
- --color-feedback-info-border: #93c5fd;
1093
- --color-action-brand: #444ae1;
1094
- --color-action-brand-hover: #363ccb;
1215
+ --color-border-default: #e7e6e5;
1216
+ --color-border-focus: #111111;
1217
+ --color-border-muted: #f5f5f4;
1218
+ --color-border-input: #d4d3d0;
1219
+ --color-feedback-success-text: #15452a;
1220
+ --color-feedback-success-background: #e4f3e9;
1221
+ --color-feedback-success-border: #278a4a;
1222
+ --color-feedback-error-text: #7a1212;
1223
+ --color-feedback-error-background: #fdecec;
1224
+ --color-feedback-error-border: #c42d2d;
1225
+ --color-feedback-warning-text: #7a4708;
1226
+ --color-feedback-warning-background: #fcefd9;
1227
+ --color-feedback-warning-border: #c88420;
1228
+ --color-feedback-info-text: #123862;
1229
+ --color-feedback-info-background: #e0eaf5;
1230
+ --color-feedback-info-border: #2d6cb8;
1231
+ --color-action-brand: #111111;
1232
+ --color-action-brand-hover: #2c2a26;
1095
1233
  --color-action-brand-text: #ffffff;
1096
- --color-action-default: #333333;
1097
- --color-action-default-hover: #4b5563;
1234
+ --color-action-default: #111111;
1235
+ --color-action-default-hover: #2c2a26;
1098
1236
  --color-action-default-text: #ffffff;
1099
- --color-skeleton-base: #e5e7eb;
1100
- --color-skeleton-highlight: #f3f4f6;
1101
- --color-skeleton-wave: rgba(255, 255, 255, 0.5);
1102
- color: #333333;
1237
+ --color-skeleton-base: #e7e6e5;
1238
+ --color-skeleton-highlight: #f5f5f4;
1239
+ --color-skeleton-wave: rgba(255, 255, 255, 0.6);
1240
+ color: #2c2a26;
1103
1241
  }
1104
1242
  @keyframes wave {
1105
1243
  0% {
@@ -3227,13 +3365,13 @@
3227
3365
  border-color: var(--color-action-brand);
3228
3366
  }
3229
3367
  .border-action-brand\/20 {
3230
- border-color: color-mix(in srgb, #444ae1 20%, transparent);
3368
+ border-color: color-mix(in srgb, #111111 20%, transparent);
3231
3369
  @supports (color: color-mix(in lab, red, red)) {
3232
3370
  border-color: color-mix(in oklab, var(--color-action-brand) 20%, transparent);
3233
3371
  }
3234
3372
  }
3235
3373
  .border-action-brand\/30 {
3236
- border-color: color-mix(in srgb, #444ae1 30%, transparent);
3374
+ border-color: color-mix(in srgb, #111111 30%, transparent);
3237
3375
  @supports (color: color-mix(in lab, red, red)) {
3238
3376
  border-color: color-mix(in oklab, var(--color-action-brand) 30%, transparent);
3239
3377
  }
@@ -3254,19 +3392,19 @@
3254
3392
  border-color: var(--color-border-default);
3255
3393
  }
3256
3394
  .border-border-default\/40 {
3257
- border-color: color-mix(in srgb, #e5e7eb 40%, transparent);
3395
+ border-color: color-mix(in srgb, #e7e6e5 40%, transparent);
3258
3396
  @supports (color: color-mix(in lab, red, red)) {
3259
3397
  border-color: color-mix(in oklab, var(--color-border-default) 40%, transparent);
3260
3398
  }
3261
3399
  }
3262
3400
  .border-border-default\/50 {
3263
- border-color: color-mix(in srgb, #e5e7eb 50%, transparent);
3401
+ border-color: color-mix(in srgb, #e7e6e5 50%, transparent);
3264
3402
  @supports (color: color-mix(in lab, red, red)) {
3265
3403
  border-color: color-mix(in oklab, var(--color-border-default) 50%, transparent);
3266
3404
  }
3267
3405
  }
3268
3406
  .border-border-default\/60 {
3269
- border-color: color-mix(in srgb, #e5e7eb 60%, transparent);
3407
+ border-color: color-mix(in srgb, #e7e6e5 60%, transparent);
3270
3408
  @supports (color: color-mix(in lab, red, red)) {
3271
3409
  border-color: color-mix(in oklab, var(--color-border-default) 60%, transparent);
3272
3410
  }
@@ -3278,7 +3416,7 @@
3278
3416
  border-color: var(--color-border-input);
3279
3417
  }
3280
3418
  .border-border-input\/20 {
3281
- border-color: color-mix(in srgb, #d1d5db 20%, transparent);
3419
+ border-color: color-mix(in srgb, #d4d3d0 20%, transparent);
3282
3420
  @supports (color: color-mix(in lab, red, red)) {
3283
3421
  border-color: color-mix(in oklab, var(--color-border-input) 20%, transparent);
3284
3422
  }
@@ -3287,26 +3425,17 @@
3287
3425
  border-color: var(--color-border-muted);
3288
3426
  }
3289
3427
  .border-border-muted\/30 {
3290
- border-color: color-mix(in srgb, #e5e7eb 30%, transparent);
3428
+ border-color: color-mix(in srgb, #f5f5f4 30%, transparent);
3291
3429
  @supports (color: color-mix(in lab, red, red)) {
3292
3430
  border-color: color-mix(in oklab, var(--color-border-muted) 30%, transparent);
3293
3431
  }
3294
3432
  }
3295
3433
  .border-border-muted\/50 {
3296
- border-color: color-mix(in srgb, #e5e7eb 50%, transparent);
3434
+ border-color: color-mix(in srgb, #f5f5f4 50%, transparent);
3297
3435
  @supports (color: color-mix(in lab, red, red)) {
3298
3436
  border-color: color-mix(in oklab, var(--color-border-muted) 50%, transparent);
3299
3437
  }
3300
3438
  }
3301
- .border-brand-primary {
3302
- border-color: var(--color-brand-primary);
3303
- }
3304
- .border-brand-primary\/20 {
3305
- border-color: color-mix(in srgb, #444ae1 20%, transparent);
3306
- @supports (color: color-mix(in lab, red, red)) {
3307
- border-color: color-mix(in oklab, var(--color-brand-primary) 20%, transparent);
3308
- }
3309
- }
3310
3439
  .border-current {
3311
3440
  border-color: currentcolor;
3312
3441
  }
@@ -3314,7 +3443,7 @@
3314
3443
  border-color: var(--color-feedback-error-border);
3315
3444
  }
3316
3445
  .border-feedback-error-border\/40 {
3317
- border-color: color-mix(in srgb, #ef4444 40%, transparent);
3446
+ border-color: color-mix(in srgb, #c42d2d 40%, transparent);
3318
3447
  @supports (color: color-mix(in lab, red, red)) {
3319
3448
  border-color: color-mix(in oklab, var(--color-feedback-error-border) 40%, transparent);
3320
3449
  }
@@ -3326,7 +3455,7 @@
3326
3455
  border-color: var(--color-feedback-info-border);
3327
3456
  }
3328
3457
  .border-feedback-info-border\/40 {
3329
- border-color: color-mix(in srgb, #93c5fd 40%, transparent);
3458
+ border-color: color-mix(in srgb, #2d6cb8 40%, transparent);
3330
3459
  @supports (color: color-mix(in lab, red, red)) {
3331
3460
  border-color: color-mix(in oklab, var(--color-feedback-info-border) 40%, transparent);
3332
3461
  }
@@ -3335,7 +3464,7 @@
3335
3464
  border-color: var(--color-feedback-success-border);
3336
3465
  }
3337
3466
  .border-feedback-success-border\/40 {
3338
- border-color: color-mix(in srgb, #10b981 40%, transparent);
3467
+ border-color: color-mix(in srgb, #278a4a 40%, transparent);
3339
3468
  @supports (color: color-mix(in lab, red, red)) {
3340
3469
  border-color: color-mix(in oklab, var(--color-feedback-success-border) 40%, transparent);
3341
3470
  }
@@ -3344,7 +3473,7 @@
3344
3473
  border-color: var(--color-feedback-warning-border);
3345
3474
  }
3346
3475
  .border-feedback-warning-border\/40 {
3347
- border-color: color-mix(in srgb, #f59e0b 40%, transparent);
3476
+ border-color: color-mix(in srgb, #c88420 40%, transparent);
3348
3477
  @supports (color: color-mix(in lab, red, red)) {
3349
3478
  border-color: color-mix(in oklab, var(--color-feedback-warning-border) 40%, transparent);
3350
3479
  }
@@ -3400,9 +3529,6 @@
3400
3529
  .border-l-border-muted {
3401
3530
  border-left-color: var(--color-border-muted);
3402
3531
  }
3403
- .border-l-brand-primary {
3404
- border-left-color: var(--color-brand-primary);
3405
- }
3406
3532
  .border-l-feedback-error-border {
3407
3533
  border-left-color: var(--color-feedback-error-border);
3408
3534
  }
@@ -3428,13 +3554,13 @@
3428
3554
  background-color: var(--color-action-brand);
3429
3555
  }
3430
3556
  .bg-action-brand\/5 {
3431
- background-color: color-mix(in srgb, #444ae1 5%, transparent);
3557
+ background-color: color-mix(in srgb, #111111 5%, transparent);
3432
3558
  @supports (color: color-mix(in lab, red, red)) {
3433
3559
  background-color: color-mix(in oklab, var(--color-action-brand) 5%, transparent);
3434
3560
  }
3435
3561
  }
3436
3562
  .bg-action-brand\/10 {
3437
- background-color: color-mix(in srgb, #444ae1 10%, transparent);
3563
+ background-color: color-mix(in srgb, #111111 10%, transparent);
3438
3564
  @supports (color: color-mix(in lab, red, red)) {
3439
3565
  background-color: color-mix(in oklab, var(--color-action-brand) 10%, transparent);
3440
3566
  }
@@ -3443,13 +3569,13 @@
3443
3569
  background-color: var(--color-action-default);
3444
3570
  }
3445
3571
  .bg-action-default\/5 {
3446
- background-color: color-mix(in srgb, #333333 5%, transparent);
3572
+ background-color: color-mix(in srgb, #111111 5%, transparent);
3447
3573
  @supports (color: color-mix(in lab, red, red)) {
3448
3574
  background-color: color-mix(in oklab, var(--color-action-default) 5%, transparent);
3449
3575
  }
3450
3576
  }
3451
3577
  .bg-action-default\/10 {
3452
- background-color: color-mix(in srgb, #333333 10%, transparent);
3578
+ background-color: color-mix(in srgb, #111111 10%, transparent);
3453
3579
  @supports (color: color-mix(in lab, red, red)) {
3454
3580
  background-color: color-mix(in oklab, var(--color-action-default) 10%, transparent);
3455
3581
  }
@@ -3460,6 +3586,12 @@
3460
3586
  .bg-background-body {
3461
3587
  background-color: var(--color-background-body);
3462
3588
  }
3589
+ .bg-background-canvas {
3590
+ background-color: var(--color-background-canvas);
3591
+ }
3592
+ .bg-background-canvas\! {
3593
+ background-color: var(--color-background-canvas) !important;
3594
+ }
3463
3595
  .bg-background-hover {
3464
3596
  background-color: var(--color-background-hover);
3465
3597
  }
@@ -3470,13 +3602,13 @@
3470
3602
  background-color: var(--color-background-muted);
3471
3603
  }
3472
3604
  .bg-background-muted\/30 {
3473
- background-color: color-mix(in srgb, #f3f4f6 30%, transparent);
3605
+ background-color: color-mix(in srgb, #f5f5f4 30%, transparent);
3474
3606
  @supports (color: color-mix(in lab, red, red)) {
3475
3607
  background-color: color-mix(in oklab, var(--color-background-muted) 30%, transparent);
3476
3608
  }
3477
3609
  }
3478
3610
  .bg-background-muted\/50 {
3479
- background-color: color-mix(in srgb, #f3f4f6 50%, transparent);
3611
+ background-color: color-mix(in srgb, #f5f5f4 50%, transparent);
3480
3612
  @supports (color: color-mix(in lab, red, red)) {
3481
3613
  background-color: color-mix(in oklab, var(--color-background-muted) 50%, transparent);
3482
3614
  }
@@ -3529,24 +3661,6 @@
3529
3661
  .bg-border-muted {
3530
3662
  background-color: var(--color-border-muted);
3531
3663
  }
3532
- .bg-brand-light {
3533
- background-color: var(--color-brand-light);
3534
- }
3535
- .bg-brand-primary {
3536
- background-color: var(--color-brand-primary);
3537
- }
3538
- .bg-brand-primary\/10 {
3539
- background-color: color-mix(in srgb, #444ae1 10%, transparent);
3540
- @supports (color: color-mix(in lab, red, red)) {
3541
- background-color: color-mix(in oklab, var(--color-brand-primary) 10%, transparent);
3542
- }
3543
- }
3544
- .bg-brand-primary\/20 {
3545
- background-color: color-mix(in srgb, #444ae1 20%, transparent);
3546
- @supports (color: color-mix(in lab, red, red)) {
3547
- background-color: color-mix(in oklab, var(--color-brand-primary) 20%, transparent);
3548
- }
3549
- }
3550
3664
  .bg-current {
3551
3665
  background-color: currentcolor;
3552
3666
  }
@@ -3554,7 +3668,7 @@
3554
3668
  background-color: var(--color-feedback-error-background);
3555
3669
  }
3556
3670
  .bg-feedback-error-background\/50 {
3557
- background-color: color-mix(in srgb, #fee2e2 50%, transparent);
3671
+ background-color: color-mix(in srgb, #fdecec 50%, transparent);
3558
3672
  @supports (color: color-mix(in lab, red, red)) {
3559
3673
  background-color: color-mix(in oklab, var(--color-feedback-error-background) 50%, transparent);
3560
3674
  }
@@ -3569,7 +3683,7 @@
3569
3683
  background-color: var(--color-feedback-info-background);
3570
3684
  }
3571
3685
  .bg-feedback-info-background\/20 {
3572
- background-color: color-mix(in srgb, #dbeafe 20%, transparent);
3686
+ background-color: color-mix(in srgb, #e0eaf5 20%, transparent);
3573
3687
  @supports (color: color-mix(in lab, red, red)) {
3574
3688
  background-color: color-mix(in oklab, var(--color-feedback-info-background) 20%, transparent);
3575
3689
  }
@@ -3605,7 +3719,7 @@
3605
3719
  background-color: var(--color-gray-100);
3606
3720
  }
3607
3721
  .bg-gray-100\/60 {
3608
- background-color: color-mix(in srgb, #f3f4f6 60%, transparent);
3722
+ background-color: color-mix(in srgb, #f5f5f4 60%, transparent);
3609
3723
  @supports (color: color-mix(in lab, red, red)) {
3610
3724
  background-color: color-mix(in oklab, var(--color-gray-100) 60%, transparent);
3611
3725
  }
@@ -3626,7 +3740,7 @@
3626
3740
  background-color: var(--color-green-500);
3627
3741
  }
3628
3742
  .bg-green-500\/20 {
3629
- background-color: color-mix(in srgb, oklch(0.627 0.194 130.331) 20%, transparent);
3743
+ background-color: color-mix(in srgb, oklch(72.3% 0.219 149.579) 20%, transparent);
3630
3744
  @supports (color: color-mix(in lab, red, red)) {
3631
3745
  background-color: color-mix(in oklab, var(--color-green-500) 20%, transparent);
3632
3746
  }
@@ -3637,9 +3751,6 @@
3637
3751
  .bg-inherit {
3638
3752
  background-color: inherit;
3639
3753
  }
3640
- .bg-neutral-black {
3641
- background-color: var(--color-neutral-black);
3642
- }
3643
3754
  .bg-orange-50 {
3644
3755
  background-color: var(--color-orange-50);
3645
3756
  }
@@ -3680,7 +3791,7 @@
3680
3791
  background-color: var(--color-red-500);
3681
3792
  }
3682
3793
  .bg-red-500\/20 {
3683
- background-color: color-mix(in srgb, oklch(0.637 0.237 25.331) 20%, transparent);
3794
+ background-color: color-mix(in srgb, oklch(63.7% 0.237 25.331) 20%, transparent);
3684
3795
  @supports (color: color-mix(in lab, red, red)) {
3685
3796
  background-color: color-mix(in oklab, var(--color-red-500) 20%, transparent);
3686
3797
  }
@@ -3761,7 +3872,7 @@
3761
3872
  background-color: var(--color-yellow-500);
3762
3873
  }
3763
3874
  .bg-yellow-500\/20 {
3764
- background-color: color-mix(in srgb, oklch(0.795 0.184 86.047) 20%, transparent);
3875
+ background-color: color-mix(in srgb, oklch(79.5% 0.184 86.047) 20%, transparent);
3765
3876
  @supports (color: color-mix(in lab, red, red)) {
3766
3877
  background-color: color-mix(in oklab, var(--color-yellow-500) 20%, transparent);
3767
3878
  }
@@ -3853,12 +3964,6 @@
3853
3964
  .fill-background-surface {
3854
3965
  fill: var(--color-background-surface);
3855
3966
  }
3856
- .fill-brand-primary {
3857
- fill: var(--color-brand-primary);
3858
- }
3859
- .fill-neutral-black {
3860
- fill: var(--color-neutral-black);
3861
- }
3862
3967
  .fill-red-500 {
3863
3968
  fill: var(--color-red-500);
3864
3969
  }
@@ -4393,12 +4498,6 @@
4393
4498
  .text-blue-900 {
4394
4499
  color: var(--color-blue-900);
4395
4500
  }
4396
- .text-brand-light {
4397
- color: var(--color-brand-light);
4398
- }
4399
- .text-brand-primary {
4400
- color: var(--color-brand-primary);
4401
- }
4402
4501
  .text-current {
4403
4502
  color: currentcolor;
4404
4503
  }
@@ -4600,7 +4699,7 @@
4600
4699
  text-decoration-color: currentcolor;
4601
4700
  }
4602
4701
  .decoration-text-link-default\/30 {
4603
- text-decoration-color: color-mix(in srgb, #444ae1 30%, transparent);
4702
+ text-decoration-color: color-mix(in srgb, #111111 30%, transparent);
4604
4703
  @supports (color: color-mix(in lab, red, red)) {
4605
4704
  text-decoration-color: color-mix(in oklab, var(--color-text-link-default) 30%, transparent);
4606
4705
  }
@@ -4687,7 +4786,7 @@
4687
4786
  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
4688
4787
  }
4689
4788
  .shadow-\[inset_0_1px_0_0_theme\(colors\.gray\.600\)\] {
4690
- --tw-shadow: inset 0 1px 0 0 var(--tw-shadow-color, #4b5563);
4789
+ --tw-shadow: inset 0 1px 0 0 var(--tw-shadow-color, #5d5b56);
4691
4790
  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
4692
4791
  }
4693
4792
  .shadow-inner {
@@ -4981,7 +5080,7 @@
4981
5080
  .group-hover\:bg-action-brand\/50 {
4982
5081
  &:is(:where(.group):hover *) {
4983
5082
  @media (hover: hover) {
4984
- background-color: color-mix(in srgb, #444ae1 50%, transparent);
5083
+ background-color: color-mix(in srgb, #111111 50%, transparent);
4985
5084
  @supports (color: color-mix(in lab, red, red)) {
4986
5085
  background-color: color-mix(in oklab, var(--color-action-brand) 50%, transparent);
4987
5086
  }
@@ -5002,26 +5101,6 @@
5002
5101
  }
5003
5102
  }
5004
5103
  }
5005
- .group-hover\:bg-brand-primary\/15 {
5006
- &:is(:where(.group):hover *) {
5007
- @media (hover: hover) {
5008
- background-color: color-mix(in srgb, #444ae1 15%, transparent);
5009
- @supports (color: color-mix(in lab, red, red)) {
5010
- background-color: color-mix(in oklab, var(--color-brand-primary) 15%, transparent);
5011
- }
5012
- }
5013
- }
5014
- }
5015
- .group-hover\:bg-brand-primary\/90 {
5016
- &:is(:where(.group):hover *) {
5017
- @media (hover: hover) {
5018
- background-color: color-mix(in srgb, #444ae1 90%, transparent);
5019
- @supports (color: color-mix(in lab, red, red)) {
5020
- background-color: color-mix(in oklab, var(--color-brand-primary) 90%, transparent);
5021
- }
5022
- }
5023
- }
5024
- }
5025
5104
  .group-hover\:bg-gray-200 {
5026
5105
  &:is(:where(.group):hover *) {
5027
5106
  @media (hover: hover) {
@@ -5029,13 +5108,6 @@
5029
5108
  }
5030
5109
  }
5031
5110
  }
5032
- .group-hover\:text-brand-primary {
5033
- &:is(:where(.group):hover *) {
5034
- @media (hover: hover) {
5035
- color: var(--color-brand-primary);
5036
- }
5037
- }
5038
- }
5039
5111
  .group-hover\:text-text-heading {
5040
5112
  &:is(:where(.group):hover *) {
5041
5113
  @media (hover: hover) {
@@ -5410,7 +5482,7 @@
5410
5482
  .hover\:bg-action-brand\/15 {
5411
5483
  &:hover {
5412
5484
  @media (hover: hover) {
5413
- background-color: color-mix(in srgb, #444ae1 15%, transparent);
5485
+ background-color: color-mix(in srgb, #111111 15%, transparent);
5414
5486
  @supports (color: color-mix(in lab, red, red)) {
5415
5487
  background-color: color-mix(in oklab, var(--color-action-brand) 15%, transparent);
5416
5488
  }
@@ -5420,7 +5492,7 @@
5420
5492
  .hover\:bg-action-brand\/90 {
5421
5493
  &:hover {
5422
5494
  @media (hover: hover) {
5423
- background-color: color-mix(in srgb, #444ae1 90%, transparent);
5495
+ background-color: color-mix(in srgb, #111111 90%, transparent);
5424
5496
  @supports (color: color-mix(in lab, red, red)) {
5425
5497
  background-color: color-mix(in oklab, var(--color-action-brand) 90%, transparent);
5426
5498
  }
@@ -5437,7 +5509,7 @@
5437
5509
  .hover\:bg-action-default\/90 {
5438
5510
  &:hover {
5439
5511
  @media (hover: hover) {
5440
- background-color: color-mix(in srgb, #333333 90%, transparent);
5512
+ background-color: color-mix(in srgb, #111111 90%, transparent);
5441
5513
  @supports (color: color-mix(in lab, red, red)) {
5442
5514
  background-color: color-mix(in oklab, var(--color-action-default) 90%, transparent);
5443
5515
  }
@@ -5510,16 +5582,6 @@
5510
5582
  }
5511
5583
  }
5512
5584
  }
5513
- .hover\:bg-brand-primary\/90 {
5514
- &:hover {
5515
- @media (hover: hover) {
5516
- background-color: color-mix(in srgb, #444ae1 90%, transparent);
5517
- @supports (color: color-mix(in lab, red, red)) {
5518
- background-color: color-mix(in oklab, var(--color-brand-primary) 90%, transparent);
5519
- }
5520
- }
5521
- }
5522
- }
5523
5585
  .hover\:bg-feedback-error-background {
5524
5586
  &:hover {
5525
5587
  @media (hover: hover) {
@@ -5530,7 +5592,7 @@
5530
5592
  .hover\:bg-feedback-error-background\/50 {
5531
5593
  &:hover {
5532
5594
  @media (hover: hover) {
5533
- background-color: color-mix(in srgb, #fee2e2 50%, transparent);
5595
+ background-color: color-mix(in srgb, #fdecec 50%, transparent);
5534
5596
  @supports (color: color-mix(in lab, red, red)) {
5535
5597
  background-color: color-mix(in oklab, var(--color-feedback-error-background) 50%, transparent);
5536
5598
  }
@@ -5540,7 +5602,7 @@
5540
5602
  .hover\:bg-feedback-error-background\/80 {
5541
5603
  &:hover {
5542
5604
  @media (hover: hover) {
5543
- background-color: color-mix(in srgb, #fee2e2 80%, transparent);
5605
+ background-color: color-mix(in srgb, #fdecec 80%, transparent);
5544
5606
  @supports (color: color-mix(in lab, red, red)) {
5545
5607
  background-color: color-mix(in oklab, var(--color-feedback-error-background) 80%, transparent);
5546
5608
  }
@@ -5550,7 +5612,7 @@
5550
5612
  .hover\:bg-feedback-info-background\/80 {
5551
5613
  &:hover {
5552
5614
  @media (hover: hover) {
5553
- background-color: color-mix(in srgb, #dbeafe 80%, transparent);
5615
+ background-color: color-mix(in srgb, #e0eaf5 80%, transparent);
5554
5616
  @supports (color: color-mix(in lab, red, red)) {
5555
5617
  background-color: color-mix(in oklab, var(--color-feedback-info-background) 80%, transparent);
5556
5618
  }
@@ -5588,7 +5650,7 @@
5588
5650
  .hover\:bg-text-body\/5 {
5589
5651
  &:hover {
5590
5652
  @media (hover: hover) {
5591
- background-color: color-mix(in srgb, #333333 5%, transparent);
5653
+ background-color: color-mix(in srgb, #2c2a26 5%, transparent);
5592
5654
  @supports (color: color-mix(in lab, red, red)) {
5593
5655
  background-color: color-mix(in oklab, var(--color-text-body) 5%, transparent);
5594
5656
  }
@@ -5598,7 +5660,7 @@
5598
5660
  .hover\:bg-text-body\/\[0\.05\] {
5599
5661
  &:hover {
5600
5662
  @media (hover: hover) {
5601
- background-color: color-mix(in srgb, #333333 5%, transparent);
5663
+ background-color: color-mix(in srgb, #2c2a26 5%, transparent);
5602
5664
  @supports (color: color-mix(in lab, red, red)) {
5603
5665
  background-color: color-mix(in oklab, var(--color-text-body) 5%, transparent);
5604
5666
  }
@@ -5650,20 +5712,13 @@
5650
5712
  .hover\:text-action-brand\/90 {
5651
5713
  &:hover {
5652
5714
  @media (hover: hover) {
5653
- color: color-mix(in srgb, #444ae1 90%, transparent);
5715
+ color: color-mix(in srgb, #111111 90%, transparent);
5654
5716
  @supports (color: color-mix(in lab, red, red)) {
5655
5717
  color: color-mix(in oklab, var(--color-action-brand) 90%, transparent);
5656
5718
  }
5657
5719
  }
5658
5720
  }
5659
5721
  }
5660
- .hover\:text-brand-primary {
5661
- &:hover {
5662
- @media (hover: hover) {
5663
- color: var(--color-brand-primary);
5664
- }
5665
- }
5666
- }
5667
5722
  .hover\:text-text-body {
5668
5723
  &:hover {
5669
5724
  @media (hover: hover) {
@@ -5854,11 +5909,6 @@
5854
5909
  border-width: 0px !important;
5855
5910
  }
5856
5911
  }
5857
- .focus-visible\:bg-brand-light {
5858
- &:focus-visible {
5859
- background-color: var(--color-brand-light);
5860
- }
5861
- }
5862
5912
  .focus-visible\:\!ring-0 {
5863
5913
  &:focus-visible {
5864
5914
  --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor) !important;
@@ -5917,7 +5967,7 @@
5917
5967
  }
5918
5968
  .active\:bg-background-hover\/80 {
5919
5969
  &:active {
5920
- background-color: color-mix(in srgb, #f3f4f6 80%, transparent);
5970
+ background-color: color-mix(in srgb, #fafafa 80%, transparent);
5921
5971
  @supports (color: color-mix(in lab, red, red)) {
5922
5972
  background-color: color-mix(in oklab, var(--color-background-hover) 80%, transparent);
5923
5973
  }
@@ -5930,7 +5980,7 @@
5930
5980
  }
5931
5981
  .active\:bg-feedback-error-background\/80 {
5932
5982
  &:active {
5933
- background-color: color-mix(in srgb, #fee2e2 80%, transparent);
5983
+ background-color: color-mix(in srgb, #fdecec 80%, transparent);
5934
5984
  @supports (color: color-mix(in lab, red, red)) {
5935
5985
  background-color: color-mix(in oklab, var(--color-feedback-error-background) 80%, transparent);
5936
5986
  }
@@ -7328,7 +7378,7 @@
7328
7378
  }
7329
7379
  .dark\:bg-blue-900\/20 {
7330
7380
  @media (prefers-color-scheme: dark) {
7331
- background-color: color-mix(in srgb, oklch(0.368 0.146 254.128) 20%, transparent);
7381
+ background-color: color-mix(in srgb, oklch(37.9% 0.146 265.522) 20%, transparent);
7332
7382
  @supports (color: color-mix(in lab, red, red)) {
7333
7383
  background-color: color-mix(in oklab, var(--color-blue-900) 20%, transparent);
7334
7384
  }
@@ -7351,7 +7401,7 @@
7351
7401
  }
7352
7402
  .dark\:bg-green-900\/20 {
7353
7403
  @media (prefers-color-scheme: dark) {
7354
- background-color: color-mix(in srgb, oklch(0.314 0.095 133.748) 20%, transparent);
7404
+ background-color: color-mix(in srgb, oklch(39.3% 0.095 152.535) 20%, transparent);
7355
7405
  @supports (color: color-mix(in lab, red, red)) {
7356
7406
  background-color: color-mix(in oklab, var(--color-green-900) 20%, transparent);
7357
7407
  }
@@ -8105,13 +8155,13 @@
8105
8155
  }
8106
8156
  .\[\&_\[data-chip-id\]\:\:selection\]\:bg-action-brand\/20 {
8107
8157
  & [data-chip-id]::-moz-selection {
8108
- background-color: color-mix(in srgb, #444ae1 20%, transparent);
8158
+ background-color: color-mix(in srgb, #111111 20%, transparent);
8109
8159
  @supports (color: color-mix(in lab, red, red)) {
8110
8160
  background-color: color-mix(in oklab, var(--color-action-brand) 20%, transparent);
8111
8161
  }
8112
8162
  }
8113
8163
  & [data-chip-id]::selection {
8114
- background-color: color-mix(in srgb, #444ae1 20%, transparent);
8164
+ background-color: color-mix(in srgb, #111111 20%, transparent);
8115
8165
  @supports (color: color-mix(in lab, red, red)) {
8116
8166
  background-color: color-mix(in oklab, var(--color-action-brand) 20%, transparent);
8117
8167
  }