@texturehq/edges 0.0.5 → 0.0.7

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 (16) hide show
  1. package/README.md +79 -1
  2. package/dist/index.cjs +3 -0
  3. package/dist/index.cjs.map +1 -0
  4. package/dist/index.d.cts +740 -0
  5. package/dist/index.d.ts +740 -0
  6. package/dist/index.js +3 -0
  7. package/dist/index.js.map +1 -0
  8. package/dist/styles.css +2901 -0
  9. package/dist/texture_logo_brand-CQ4VWZWF.svg +20 -0
  10. package/dist/texture_logo_brand_wordmark-TQMXZX6P.svg +20 -0
  11. package/dist/texture_logo_dark-V75XEH2I.svg +20 -0
  12. package/dist/texture_logo_dark_wordmark-CTFWT525.svg +20 -0
  13. package/dist/texture_logo_white-MPY7T26X.svg +13 -0
  14. package/dist/texture_logo_white_wordmark-BAPLTTO6.svg +20 -0
  15. package/dist/theme.css +1017 -0
  16. package/package.json +8 -7
package/dist/theme.css ADDED
@@ -0,0 +1,1017 @@
1
+ @keyframes wave {
2
+ 0% {
3
+ transform: translateX(-100%);
4
+ }
5
+ 50%,
6
+ 100% {
7
+ transform: translateX(100%);
8
+ }
9
+ }
10
+
11
+ @theme {
12
+ /* Base Font Families */
13
+ --font-sans: "Inter", system-ui, sans-serif;
14
+ --font-brand: "TT Firs Neue", "Helvetica Neue", "Arial", system-ui, sans-serif;
15
+ --font-serif: "Merriweather", serif;
16
+ --font-mono: "Fira Code", monospace;
17
+
18
+ /* Color Scale */
19
+ --color-red-50: oklch(0.971 0.013 17.38);
20
+ --color-red-100: oklch(0.936 0.032 17.717);
21
+ --color-red-200: oklch(0.885 0.062 18.334);
22
+ --color-red-300: oklch(0.808 0.114 19.571);
23
+ --color-red-400: oklch(0.704 0.191 22.216);
24
+ --color-red-500: oklch(0.637 0.237 25.331);
25
+ --color-red-600: oklch(0.577 0.245 27.325);
26
+ --color-red-700: oklch(0.505 0.213 27.518);
27
+ --color-red-800: oklch(0.444 0.177 26.899);
28
+ --color-red-900: oklch(0.396 0.141 25.723);
29
+ --color-red-950: oklch(0.258 0.092 26.042);
30
+
31
+ --color-orange-50: oklch(0.98 0.016 73.684);
32
+ --color-orange-100: oklch(0.954 0.038 75.164);
33
+ --color-orange-200: oklch(0.901 0.076 70.697);
34
+ --color-orange-300: oklch(0.837 0.128 66.29);
35
+ --color-orange-400: oklch(0.75 0.183 55.934);
36
+ --color-orange-500: oklch(0.705 0.213 47.604);
37
+ --color-orange-600: oklch(0.646 0.222 41.116);
38
+ --color-orange-700: oklch(0.553 0.195 38.402);
39
+ --color-orange-800: oklch(0.47 0.157 37.304);
40
+ --color-orange-900: oklch(0.408 0.123 38.172);
41
+ --color-orange-950: oklch(0.266 0.079 36.259);
42
+
43
+ --color-amber-50: oklch(0.987 0.022 95.277);
44
+ --color-amber-100: oklch(0.962 0.059 95.617);
45
+ --color-amber-200: oklch(0.924 0.12 95.746);
46
+ --color-amber-300: oklch(0.879 0.169 91.605);
47
+ --color-amber-400: oklch(0.828 0.189 84.429);
48
+ --color-amber-500: oklch(0.769 0.188 70.08);
49
+ --color-amber-600: oklch(0.666 0.179 58.318);
50
+ --color-amber-700: oklch(0.555 0.163 48.998);
51
+ --color-amber-800: oklch(0.473 0.137 46.201);
52
+ --color-amber-900: oklch(0.414 0.112 45.904);
53
+ --color-amber-950: oklch(0.279 0.077 45.635);
54
+
55
+ --color-yellow-50: oklch(0.987 0.026 102.212);
56
+ --color-yellow-100: oklch(0.973 0.071 103.193);
57
+ --color-yellow-200: oklch(0.945 0.129 101.54);
58
+ --color-yellow-300: oklch(0.905 0.182 98.111);
59
+ --color-yellow-400: oklch(0.852 0.199 91.936);
60
+ --color-yellow-500: oklch(0.795 0.184 86.047);
61
+ --color-yellow-600: oklch(0.681 0.162 75.834);
62
+ --color-yellow-700: oklch(0.554 0.135 66.442);
63
+ --color-yellow-800: oklch(0.476 0.114 61.907);
64
+ --color-yellow-900: oklch(0.421 0.095 57.708);
65
+ --color-yellow-950: oklch(0.286 0.066 53.813);
66
+
67
+ --color-lime-50: oklch(0.986 0.031 120.757);
68
+ --color-lime-100: oklch(0.967 0.067 122.328);
69
+ --color-lime-200: oklch(0.938 0.127 124.321);
70
+ --color-lime-300: oklch(0.897 0.196 126.665);
71
+ --color-lime-400: oklch(0.841 0.238 128.85);
72
+ --color-lime-500: oklch(0.768 0.233 130.85);
73
+ --color-lime-600: oklch(0.648 0.2 131.684);
74
+ --color-lime-700: oklch(0.532 0.157 131.589);
75
+ --color-lime-800: oklch(0.453 0.124 130.933);
76
+ --color-lime-900: oklch(0.405 0.101 131.063);
77
+ --color-lime-950: oklch(0.274 0.072 132.109);
78
+
79
+ --color-green-50: oklch(0.982 0.018 155.826);
80
+ --color-green-100: oklch(0.962 0.044 156.743);
81
+ --color-green-200: oklch(0.925 0.084 155.995);
82
+ --color-green-300: oklch(0.871 0.15 154.449);
83
+ --color-green-400: oklch(0.792 0.209 151.711);
84
+ --color-green-500: oklch(0.723 0.219 149.579);
85
+ --color-green-600: oklch(0.627 0.194 149.214);
86
+ --color-green-700: oklch(0.527 0.154 150.069);
87
+ --color-green-800: oklch(0.448 0.119 151.328);
88
+ --color-green-900: oklch(0.393 0.095 152.535);
89
+ --color-green-950: oklch(0.266 0.065 152.934);
90
+
91
+ --color-emerald-50: oklch(0.979 0.021 166.113);
92
+ --color-emerald-100: oklch(0.95 0.052 163.051);
93
+ --color-emerald-200: oklch(0.905 0.093 164.15);
94
+ --color-emerald-300: oklch(0.845 0.143 164.978);
95
+ --color-emerald-400: oklch(0.765 0.177 163.223);
96
+ --color-emerald-500: oklch(0.696 0.17 162.48);
97
+ --color-emerald-600: oklch(0.596 0.145 163.225);
98
+ --color-emerald-700: oklch(0.508 0.118 165.612);
99
+ --color-emerald-800: oklch(0.432 0.095 166.913);
100
+ --color-emerald-900: oklch(0.378 0.077 168.94);
101
+ --color-emerald-950: oklch(0.262 0.051 172.552);
102
+
103
+ --color-teal-50: oklch(0.984 0.014 180.72);
104
+ --color-teal-100: oklch(0.953 0.051 180.801);
105
+ --color-teal-200: oklch(0.91 0.096 180.426);
106
+ --color-teal-300: oklch(0.855 0.138 181.071);
107
+ --color-teal-400: oklch(0.777 0.152 181.912);
108
+ --color-teal-500: oklch(0.704 0.14 182.503);
109
+ --color-teal-600: oklch(0.6 0.118 184.704);
110
+ --color-teal-700: oklch(0.511 0.096 186.391);
111
+ --color-teal-800: oklch(0.437 0.078 188.216);
112
+ --color-teal-900: oklch(0.386 0.063 188.416);
113
+ --color-teal-950: oklch(0.277 0.046 192.524);
114
+
115
+ --color-cyan-50: oklch(0.984 0.019 200.873);
116
+ --color-cyan-100: oklch(0.956 0.045 203.388);
117
+ --color-cyan-200: oklch(0.917 0.08 205.041);
118
+ --color-cyan-300: oklch(0.865 0.127 207.078);
119
+ --color-cyan-400: oklch(0.789 0.154 211.53);
120
+ --color-cyan-500: oklch(0.715 0.143 215.221);
121
+ --color-cyan-600: oklch(0.609 0.126 221.723);
122
+ --color-cyan-700: oklch(0.52 0.105 223.128);
123
+ --color-cyan-800: oklch(0.45 0.085 224.283);
124
+ --color-cyan-900: oklch(0.398 0.07 227.392);
125
+ --color-cyan-950: oklch(0.302 0.056 229.695);
126
+
127
+ --color-sky-50: oklch(0.977 0.013 236.62);
128
+ --color-sky-100: oklch(0.951 0.026 236.824);
129
+ --color-sky-200: oklch(0.901 0.058 230.902);
130
+ --color-sky-300: oklch(0.828 0.111 230.318);
131
+ --color-sky-400: oklch(0.746 0.16 232.661);
132
+ --color-sky-500: oklch(0.685 0.169 237.323);
133
+ --color-sky-600: oklch(0.588 0.158 241.966);
134
+ --color-sky-700: oklch(0.5 0.134 242.749);
135
+ --color-sky-800: oklch(0.443 0.11 240.79);
136
+ --color-sky-900: oklch(0.391 0.09 240.876);
137
+ --color-sky-950: oklch(0.293 0.066 243.157);
138
+
139
+ --color-blue-50: oklch(0.97 0.014 254.604);
140
+ --color-blue-100: oklch(0.932 0.032 255.585);
141
+ --color-blue-200: oklch(0.882 0.059 254.128);
142
+ --color-blue-300: oklch(0.809 0.105 251.813);
143
+ --color-blue-400: oklch(0.707 0.165 254.624);
144
+ --color-blue-500: oklch(0.623 0.214 259.815);
145
+ --color-blue-600: oklch(0.546 0.245 262.881);
146
+ --color-blue-700: oklch(0.488 0.243 264.376);
147
+ --color-blue-800: oklch(0.424 0.199 265.638);
148
+ --color-blue-900: oklch(0.379 0.146 265.522);
149
+ --color-blue-950: oklch(0.282 0.091 267.935);
150
+
151
+ --color-indigo-50: oklch(0.962 0.018 272.314);
152
+ --color-indigo-100: oklch(0.93 0.034 272.788);
153
+ --color-indigo-200: oklch(0.87 0.065 274.039);
154
+ --color-indigo-300: oklch(0.785 0.115 274.713);
155
+ --color-indigo-400: oklch(0.673 0.182 276.935);
156
+ --color-indigo-500: oklch(0.585 0.233 277.117);
157
+ --color-indigo-600: oklch(0.511 0.262 276.966);
158
+ --color-indigo-700: oklch(0.457 0.24 277.023);
159
+ --color-indigo-800: oklch(0.398 0.195 277.366);
160
+ --color-indigo-900: oklch(0.359 0.144 278.697);
161
+ --color-indigo-950: oklch(0.257 0.09 281.288);
162
+
163
+ --color-violet-50: oklch(0.969 0.016 293.756);
164
+ --color-violet-100: oklch(0.943 0.029 294.588);
165
+ --color-violet-200: oklch(0.894 0.057 293.283);
166
+ --color-violet-300: oklch(0.811 0.111 293.571);
167
+ --color-violet-400: oklch(0.702 0.183 293.541);
168
+ --color-violet-500: oklch(0.606 0.25 292.717);
169
+ --color-violet-600: oklch(0.541 0.281 293.009);
170
+ --color-violet-700: oklch(0.491 0.27 292.581);
171
+ --color-violet-800: oklch(0.432 0.232 292.759);
172
+ --color-violet-900: oklch(0.38 0.189 293.745);
173
+ --color-violet-950: oklch(0.283 0.141 291.089);
174
+
175
+ --color-purple-50: oklch(0.977 0.014 308.299);
176
+ --color-purple-100: oklch(0.946 0.033 307.174);
177
+ --color-purple-200: oklch(0.902 0.063 306.703);
178
+ --color-purple-300: oklch(0.827 0.119 306.383);
179
+ --color-purple-400: oklch(0.714 0.203 305.504);
180
+ --color-purple-500: oklch(0.627 0.265 303.9);
181
+ --color-purple-600: oklch(0.558 0.288 302.321);
182
+ --color-purple-700: oklch(0.496 0.265 301.924);
183
+ --color-purple-800: oklch(0.438 0.218 303.724);
184
+ --color-purple-900: oklch(0.381 0.176 304.987);
185
+ --color-purple-950: oklch(0.291 0.149 302.717);
186
+
187
+ --color-fuchsia-50: oklch(0.977 0.017 320.058);
188
+ --color-fuchsia-100: oklch(0.952 0.037 318.852);
189
+ --color-fuchsia-200: oklch(0.903 0.076 319.62);
190
+ --color-fuchsia-300: oklch(0.833 0.145 321.434);
191
+ --color-fuchsia-400: oklch(0.74 0.238 322.16);
192
+ --color-fuchsia-500: oklch(0.667 0.295 322.15);
193
+ --color-fuchsia-600: oklch(0.591 0.293 322.896);
194
+ --color-fuchsia-700: oklch(0.518 0.253 323.949);
195
+ --color-fuchsia-800: oklch(0.452 0.211 324.591);
196
+ --color-fuchsia-900: oklch(0.401 0.17 325.612);
197
+ --color-fuchsia-950: oklch(0.293 0.136 325.661);
198
+
199
+ --color-pink-50: var(--pink-50);
200
+ --color-pink-100: var(--pink-100);
201
+ --color-pink-200: var(--pink-200);
202
+ --color-pink-300: var(--pink-300);
203
+ --color-pink-400: var(--pink-400);
204
+ --color-pink-500: var(--pink-500);
205
+ --color-pink-600: var(--pink-600);
206
+ --color-pink-700: var(--pink-700);
207
+ --color-pink-800: var(--pink-800);
208
+ --color-pink-900: var(--pink-900);
209
+ --color-pink-950: var(--pink-950);
210
+
211
+ --color-rose-50: var(--rose-50);
212
+ --color-rose-100: var(--rose-100);
213
+ --color-rose-200: var(--rose-200);
214
+ --color-rose-300: var(--rose-300);
215
+ --color-rose-400: var(--rose-400);
216
+ --color-rose-500: var(--rose-500);
217
+ --color-rose-600: var(--rose-600);
218
+ --color-rose-700: var(--rose-700);
219
+ --color-rose-800: var(--rose-800);
220
+ --color-rose-900: var(--rose-900);
221
+ --color-rose-950: var(--rose-950);
222
+
223
+ --color-slate-50: var(--slate-50);
224
+ --color-slate-100: var(--slate-100);
225
+ --color-slate-200: var(--slate-200);
226
+ --color-slate-300: var(--slate-300);
227
+ --color-slate-400: var(--slate-400);
228
+ --color-slate-500: var(--slate-500);
229
+ --color-slate-600: var(--slate-600);
230
+ --color-slate-700: var(--slate-700);
231
+ --color-slate-800: var(--slate-800);
232
+ --color-slate-900: var(--slate-900);
233
+ --color-slate-950: var(--slate-950);
234
+
235
+ --color-gray-50: var(--gray-50);
236
+ --color-gray-100: var(--gray-100);
237
+ --color-gray-200: var(--gray-200);
238
+ --color-gray-300: var(--gray-300);
239
+ --color-gray-400: var(--gray-400);
240
+ --color-gray-500: var(--gray-500);
241
+ --color-gray-600: var(--gray-600);
242
+ --color-gray-700: var(--gray-700);
243
+ --color-gray-800: var(--gray-800);
244
+ --color-gray-900: var(--gray-900);
245
+ --color-gray-950: var(--gray-950);
246
+
247
+ --color-zinc-50: var(--zinc-50);
248
+ --color-zinc-100: var(--zinc-100);
249
+ --color-zinc-200: var(--zinc-200);
250
+ --color-zinc-300: var(--zinc-300);
251
+ --color-zinc-400: var(--zinc-400);
252
+ --color-zinc-500: var(--zinc-500);
253
+ --color-zinc-600: var(--zinc-600);
254
+ --color-zinc-700: var(--zinc-700);
255
+ --color-zinc-800: var(--zinc-800);
256
+ --color-zinc-900: var(--zinc-900);
257
+ --color-zinc-950: var(--zinc-950);
258
+
259
+ --color-neutral-50: var(--neutral-50);
260
+ --color-neutral-100: var(--neutral-100);
261
+ --color-neutral-200: var(--neutral-200);
262
+ --color-neutral-300: var(--neutral-300);
263
+ --color-neutral-400: var(--neutral-400);
264
+ --color-neutral-500: var(--neutral-500);
265
+ --color-neutral-600: var(--neutral-600);
266
+ --color-neutral-700: var(--neutral-700);
267
+ --color-neutral-800: var(--neutral-800);
268
+ --color-neutral-900: var(--neutral-900);
269
+ --color-neutral-950: var(--neutral-950);
270
+
271
+ --color-stone-50: var(--stone-50);
272
+ --color-stone-100: var(--stone-100);
273
+ --color-stone-200: var(--stone-200);
274
+ --color-stone-300: var(--stone-300);
275
+ --color-stone-400: var(--stone-400);
276
+ --color-stone-500: var(--stone-500);
277
+ --color-stone-600: var(--stone-600);
278
+ --color-stone-700: var(--stone-700);
279
+ --color-stone-800: var(--stone-800);
280
+ --color-stone-900: var(--stone-900);
281
+ --color-stone-950: var(--stone-950);
282
+
283
+ --color-black: var(--black);
284
+ --color-white: var(--white);
285
+
286
+ --spacing: 0.25rem;
287
+
288
+ --breakpoint-sm: 40rem;
289
+ --breakpoint-md: 48rem;
290
+ --breakpoint-lg: 64rem;
291
+ --breakpoint-xl: 80rem;
292
+ --breakpoint-2xl: 96rem;
293
+
294
+ --container-3xs: 16rem;
295
+ --container-2xs: 18rem;
296
+ --container-xs: 20rem;
297
+ --container-sm: 24rem;
298
+ --container-md: 28rem;
299
+ --container-lg: 32rem;
300
+ --container-xl: 36rem;
301
+ --container-2xl: 42rem;
302
+ --container-3xl: 48rem;
303
+ --container-4xl: 56rem;
304
+ --container-5xl: 64rem;
305
+ --container-6xl: 72rem;
306
+ --container-7xl: 80rem;
307
+
308
+ --text-xs: 0.75rem;
309
+ --text-xs--line-height: calc(1 / 0.75);
310
+ --text-sm: 0.875rem;
311
+ --text-sm--line-height: calc(1.25 / 0.875);
312
+ --text-base: 1rem;
313
+ --text-base--line-height: calc(1.5 / 1);
314
+ --text-lg: 1.125rem;
315
+ --text-lg--line-height: calc(1.75 / 1.125);
316
+ --text-xl: 1.25rem;
317
+ --text-xl--line-height: calc(1.75 / 1.25);
318
+ --text-2xl: 1.5rem;
319
+ --text-2xl--line-height: calc(2 / 1.5);
320
+ --text-3xl: 1.875rem;
321
+ --text-3xl--line-height: calc(2.25 / 1.875);
322
+ --text-4xl: 2.25rem;
323
+ --text-4xl--line-height: calc(2.5 / 2.25);
324
+ --text-5xl: 3rem;
325
+ --text-5xl--line-height: 1;
326
+ --text-6xl: 3.75rem;
327
+ --text-6xl--line-height: 1;
328
+ --text-7xl: 4.5rem;
329
+ --text-7xl--line-height: 1;
330
+ --text-8xl: 6rem;
331
+ --text-8xl--line-height: 1;
332
+ --text-9xl: 8rem;
333
+ --text-9xl--line-height: 1;
334
+
335
+ --font-weight-thin: 100;
336
+ --font-weight-extralight: 200;
337
+ --font-weight-light: 300;
338
+ --font-weight-normal: 400;
339
+ --font-weight-medium: 500;
340
+ --font-weight-semibold: 600;
341
+ --font-weight-bold: 700;
342
+ --font-weight-extrabold: 800;
343
+ --font-weight-black: 900;
344
+
345
+ --tracking-tighter: -0.05em;
346
+ --tracking-tight: -0.025em;
347
+ --tracking-normal: 0em;
348
+ --tracking-wide: 0.025em;
349
+ --tracking-wider: 0.05em;
350
+ --tracking-widest: 0.1em;
351
+
352
+ --leading-tight: 1.25;
353
+ --leading-snug: 1.375;
354
+ --leading-normal: 1.5;
355
+ --leading-relaxed: 1.625;
356
+ --leading-loose: 2;
357
+
358
+ --radius-xs: 0.125rem;
359
+ --radius-sm: 0.25rem;
360
+ --radius-md: 0.375rem;
361
+ --radius-lg: 0.5rem;
362
+ --radius-xl: 0.75rem;
363
+ --radius-2xl: 1rem;
364
+ --radius-3xl: 1.5rem;
365
+ --radius-4xl: 2rem;
366
+
367
+ --shadow-2xs: 0 1px rgb(0 0 0 / 0.05);
368
+ --shadow-xs: 0 1px 2px 0 rgb(0 0 0 / 0.05);
369
+ --shadow-sm: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
370
+ --shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
371
+ --shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
372
+ --shadow-xl: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
373
+ --shadow-2xl: 0 25px 50px -12px rgb(0 0 0 / 0.25);
374
+
375
+ --inset-shadow-2xs: inset 0 1px rgb(0 0 0 / 0.05);
376
+ --inset-shadow-xs: inset 0 1px 1px rgb(0 0 0 / 0.05);
377
+ --inset-shadow-sm: inset 0 2px 4px rgb(0 0 0 / 0.05);
378
+
379
+ --drop-shadow-xs: 0 1px 1px rgb(0 0 0 / 0.05);
380
+ --drop-shadow-sm: 0 1px 2px rgb(0 0 0 / 0.15);
381
+ --drop-shadow-md: 0 3px 3px rgb(0 0 0 / 0.12);
382
+ --drop-shadow-lg: 0 4px 4px rgb(0 0 0 / 0.15);
383
+ --drop-shadow-xl: 0 9px 7px rgb(0 0 0 / 0.1);
384
+ --drop-shadow-2xl: 0 25px 25px rgb(0 0 0 / 0.15);
385
+
386
+ --blur-xs: 4px;
387
+ --blur-sm: 8px;
388
+ --blur-md: 12px;
389
+ --blur-lg: 16px;
390
+ --blur-xl: 24px;
391
+ --blur-2xl: 40px;
392
+ --blur-3xl: 64px;
393
+
394
+ --perspective-dramatic: 100px;
395
+ --perspective-near: 300px;
396
+ --perspective-normal: 500px;
397
+ --perspective-midrange: 800px;
398
+ --perspective-distant: 1200px;
399
+
400
+ --aspect-video: 16 / 9;
401
+
402
+ --ease-in: cubic-bezier(0.4, 0, 1, 1);
403
+ --ease-out: cubic-bezier(0, 0, 0.2, 1);
404
+ --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
405
+
406
+ --animate-spin: spin 1s linear infinite;
407
+ --animate-ping: ping 1s cubic-bezier(0, 0, 0.2, 1) infinite;
408
+ --animate-pulse: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
409
+ --animate-bounce: bounce 1s infinite;
410
+
411
+ @keyframes spin {
412
+ to {
413
+ transform: rotate(360deg);
414
+ }
415
+ }
416
+
417
+ @keyframes ping {
418
+ 75%,
419
+ 100% {
420
+ transform: scale(2);
421
+ opacity: 0;
422
+ }
423
+ }
424
+
425
+ @keyframes pulse {
426
+ 50% {
427
+ opacity: 0.5;
428
+ }
429
+ }
430
+
431
+ @keyframes bounce {
432
+ 0%,
433
+ 100% {
434
+ transform: translateY(-25%);
435
+ animation-timing-function: cubic-bezier(0.8, 0, 1, 1);
436
+ }
437
+ 50% {
438
+ transform: none;
439
+ animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
440
+ }
441
+ }
442
+
443
+ /* Brand Colors */
444
+ --color-brand-primary: #444ae1;
445
+ --color-brand-light: #f7f7ff;
446
+ --color-brand-dark: #363ccb;
447
+ --color-brand-background: #f6f7ff;
448
+
449
+ /* Neutral Colors */
450
+ --color-neutral-black: #333333;
451
+ --color-neutral-white: #ffffff;
452
+
453
+ /* Gray Scale */
454
+ --color-gray-lightest: #f9fafb;
455
+ --color-gray-lighter: #f3f4f6;
456
+ --color-gray-light: #e5e7eb;
457
+ --color-gray-medium: #d1d5db;
458
+ --color-gray-dark: #9ca3af;
459
+ --color-gray-darker: #6b7280;
460
+ --color-gray-darkest: #4b5563;
461
+
462
+ /* Text Colors */
463
+ --color-text-body: #333333;
464
+ --color-text-heading: #111827;
465
+ --color-text-caption: #6b7280;
466
+ --color-text-muted: #4b5563;
467
+ --color-text-placeholder: #9ca3af;
468
+ --color-text-disabled: #9ca3af;
469
+ --color-text-link-default: #444ae1;
470
+ --color-text-link-hover: #383ccb;
471
+ --color-text-link-active: #2563eb;
472
+ --color-text-link-visited: #8b5cf6;
473
+ --color-text-onPrimary: #ffffff;
474
+
475
+ /* Background Colors */
476
+ --color-background-body: #f9fafb;
477
+ --color-background-surface: #ffffff;
478
+ --color-background-muted: #f3f4f6;
479
+ --color-background-hover: #f3f4f6;
480
+ --color-background-selected: #d1d5db;
481
+ --color-background-modal: rgba(0, 0, 0, 0.15);
482
+ --color-background-input: #ffffff;
483
+ --color-background-menu-active: #f7f7ff;
484
+
485
+ /* Border Colors */
486
+ --color-border-default: #e5e7eb;
487
+ --color-border-focus: #333333;
488
+ --color-border-muted: #e5e7eb;
489
+ --color-border-input: #d1d5db;
490
+
491
+ /* Action Colors */
492
+ --color-action-primary: #444ae1;
493
+ --color-action-primary-hover: #383ccb;
494
+ --color-action-secondary: #333333;
495
+ --color-action-secondary-hover: #4b5563;
496
+ --color-action-destructive: #b91c1c;
497
+ --color-action-destructive-hover: #991b1b;
498
+ --color-action-success: #065f46;
499
+ --color-action-disabled: #9ca3af;
500
+
501
+ /* Feedback Colors */
502
+ --color-feedback-success-text: #065f46;
503
+ --color-feedback-success-icon: #065f46;
504
+ --color-feedback-success-background: #d1fae5;
505
+ --color-feedback-success-border: #10b981;
506
+
507
+ --color-feedback-error-text: #b91c1c;
508
+ --color-feedback-error-icon: #b91c1c;
509
+ --color-feedback-error-background: #fee2e2;
510
+ --color-feedback-error-border: #ef4444;
511
+
512
+ --color-feedback-warning-text: #92400e;
513
+ --color-feedback-warning-icon: #92400e;
514
+ --color-feedback-warning-background: #fef3c7;
515
+ --color-feedback-warning-border: #f59e0b;
516
+
517
+ --color-feedback-info-text: #2563eb;
518
+ --color-feedback-info-icon: #2563eb;
519
+ --color-feedback-info-background: #dbeafe;
520
+ --color-feedback-info-border: #93c5fd;
521
+
522
+ /* Device State Colors */
523
+ --color-device-charging-background: #f3e8ff;
524
+ --color-device-charging-border: #c084fc;
525
+ --color-device-charging-text: #6b21a8;
526
+
527
+ --color-device-discharging-background: #fffbeb;
528
+ --color-device-discharging-border: #facc15;
529
+ --color-device-discharging-text: #78350f;
530
+
531
+ --color-device-heat-background: #fee2e2;
532
+ --color-device-heat-border: #f87171;
533
+ --color-device-heat-text: #920000;
534
+
535
+ --color-device-cool-background: #dbeafe;
536
+ --color-device-cool-border: #60a5fa;
537
+ --color-device-cool-text: #0334be;
538
+
539
+ --color-device-eco-background: #ddfff1;
540
+ --color-device-eco-border: #34d399;
541
+ --color-device-eco-text: #065f46;
542
+
543
+ --color-device-auto-background: #ffedd5;
544
+ --color-device-auto-border: #fdba74;
545
+ --color-device-auto-text: #7c2d12;
546
+
547
+ --color-device-on-background: #ccfbf1;
548
+ --color-device-on-border: #2dd4bf;
549
+ --color-device-on-text: #0f766e;
550
+
551
+ --color-device-idle-background: #e5e7eb;
552
+ --color-device-idle-border: #9ca3af;
553
+ --color-device-idle-text: #374151;
554
+
555
+ --color-device-off-background: #e5e7eb;
556
+ --color-device-off-border: #9ca3af;
557
+ --color-device-off-text: #374151;
558
+
559
+ --color-device-unknown-background: #f8f8f8;
560
+ --color-device-unknown-border: #d1d5db;
561
+ --color-device-unknown-text: #000000;
562
+
563
+ --color-device-importing-background: #f8f8f8;
564
+ --color-device-importing-border: #d1d5db;
565
+ --color-device-importing-text: #000000;
566
+
567
+ --color-device-exporting-background: #f8f8f8;
568
+ --color-device-exporting-border: #d1d5db;
569
+ --color-device-exporting-text: #000000;
570
+
571
+ /* Skeleton Colors */
572
+ --skeleton-base: #e5e7eb;
573
+ --skeleton-highlight: #f3f4f6;
574
+ --skeleton-wave: rgba(255, 255, 255, 0.3);
575
+
576
+ /* Data Visualization Colors */
577
+ --data-default: #0082ff;
578
+
579
+ --data-categorical-1: #11b5ae;
580
+ --data-categorical-2: #4046ca;
581
+ --data-categorical-3: #f68512;
582
+ --data-categorical-4: #de3c82;
583
+ --data-categorical-5: #7e84fa;
584
+ --data-categorical-6: #72e06a;
585
+ --data-categorical-7: #167af3;
586
+ --data-categorical-8: #7326d3;
587
+ --data-categorical-9: #e7c600;
588
+ --data-categorical-10: #cb5d02;
589
+ --data-categorical-11: #008f5d;
590
+ --data-categorical-12: #bce931;
591
+
592
+ /* Sequential Scale */
593
+ --data-sequential-scale-1: #fafa37;
594
+ --data-sequential-scale-2: #d6e654;
595
+ --data-sequential-scale-3: #b2d373;
596
+ --data-sequential-scale-4: #88be8c;
597
+ --data-sequential-scale-5: #5fa2a4;
598
+ --data-sequential-scale-6: #3d7eaa;
599
+ --data-sequential-scale-7: #2a60b1;
600
+ --data-sequential-scale-8: #1b3a99;
601
+ --data-sequential-scale-9: #132353;
602
+ --data-sequential-scale-10: #110f39;
603
+
604
+ /* Sequential Intensity */
605
+ --data-sequential-intensity-1: #fcf5cd;
606
+ --data-sequential-intensity-2: #f5db95;
607
+ --data-sequential-intensity-3: #e9af7c;
608
+ --data-sequential-intensity-4: #db7d70;
609
+ --data-sequential-intensity-5: #b9577a;
610
+ --data-sequential-intensity-6: #883482;
611
+ --data-sequential-intensity-7: #6a1f78;
612
+ --data-sequential-intensity-8: #4b1277;
613
+ --data-sequential-intensity-9: #2d0b42;
614
+ --data-sequential-intensity-10: #0b0511;
615
+
616
+ /* Diverging Progression */
617
+ --data-diverging-progression-1: #6b2c1a;
618
+ --data-diverging-progression-2: #a24b1e;
619
+ --data-diverging-progression-3: #cb7131;
620
+ --data-diverging-progression-4: #e2a05d;
621
+ --data-diverging-progression-5: #f3e1a3;
622
+ --data-diverging-progression-6: #c1e4d2;
623
+ --data-diverging-progression-7: #7eb8b1;
624
+ --data-diverging-progression-8: #4c8c89;
625
+ --data-diverging-progression-9: #2b6262;
626
+ --data-diverging-progression-10: #1b3d3c;
627
+
628
+ /* Diverging Heatmap */
629
+ --data-diverging-heatmap-1: #4e142d;
630
+ --data-diverging-heatmap-2: #8b2d4e;
631
+ --data-diverging-heatmap-3: #c15a4a;
632
+ --data-diverging-heatmap-4: #db8b6a;
633
+ --data-diverging-heatmap-5: #f3e1a3;
634
+ --data-diverging-heatmap-6: #bfd4c7;
635
+ --data-diverging-heatmap-7: #7c9eb9;
636
+ --data-diverging-heatmap-8: #4770a3;
637
+ --data-diverging-heatmap-9: #2e4d8c;
638
+ --data-diverging-heatmap-10: #18274e;
639
+
640
+ /* Diverging Polarity */
641
+ --data-diverging-polarity-1: #4e142d;
642
+ --data-diverging-polarity-2: #8b2d4e;
643
+ --data-diverging-polarity-3: #c15a7a;
644
+ --data-diverging-polarity-4: #db8b9e;
645
+ --data-diverging-polarity-5: #f3e1f4;
646
+ --data-diverging-polarity-6: #c7bfe2;
647
+ --data-diverging-polarity-7: #9ea7ce;
648
+ --data-diverging-polarity-8: #7080b5;
649
+ --data-diverging-polarity-9: #4d5e99;
650
+ --data-diverging-polarity-10: #2b3d70;
651
+ /* Data Visualization Colors */
652
+ --color-data-default: #0082ff;
653
+
654
+ /* Categorical Colors */
655
+ --color-data-categorical-1: #11b5ae;
656
+ --color-data-categorical-2: #4046ca;
657
+ --color-data-categorical-3: #f68512;
658
+ --color-data-categorical-4: #de3c82;
659
+ --color-data-categorical-5: #7e84fa;
660
+ --color-data-categorical-6: #72e06a;
661
+ --color-data-categorical-7: #167af3;
662
+ --color-data-categorical-8: #7326d3;
663
+ --color-data-categorical-9: #e7c600;
664
+ --color-data-categorical-10: #cb5d02;
665
+ --color-data-categorical-11: #008f5d;
666
+ --color-data-categorical-12: #bce931;
667
+
668
+ /* Sequential Scale */
669
+ --color-data-sequential-scale-1: #fafa37;
670
+ --color-data-sequential-scale-2: #d6e654;
671
+ --color-data-sequential-scale-3: #b2d373;
672
+ --color-data-sequential-scale-4: #88be8c;
673
+ --color-data-sequential-scale-5: #5fa2a4;
674
+ --color-data-sequential-scale-6: #3d7eaa;
675
+ --color-data-sequential-scale-7: #2a60b1;
676
+ --color-data-sequential-scale-8: #1b3a99;
677
+ --color-data-sequential-scale-9: #132353;
678
+ --color-data-sequential-scale-10: #110f39;
679
+
680
+ /* Sequential Intensity */
681
+ --color-data-sequential-intensity-1: #fcf5cd;
682
+ --color-data-sequential-intensity-2: #f5db95;
683
+ --color-data-sequential-intensity-3: #e9af7c;
684
+ --color-data-sequential-intensity-4: #db7d70;
685
+ --color-data-sequential-intensity-5: #b9577a;
686
+ --color-data-sequential-intensity-6: #883482;
687
+ --color-data-sequential-intensity-7: #6a1f78;
688
+ --color-data-sequential-intensity-8: #4b1277;
689
+ --color-data-sequential-intensity-9: #2d0b42;
690
+ --color-data-sequential-intensity-10: #0b0511;
691
+
692
+ /* Diverging Progression */
693
+ --color-data-diverging-progression-1: #6b2c1a;
694
+ --color-data-diverging-progression-2: #a24b1e;
695
+ --color-data-diverging-progression-3: #cb7131;
696
+ --color-data-diverging-progression-4: #e2a05d;
697
+ --color-data-diverging-progression-5: #f3e1a3;
698
+ --color-data-diverging-progression-6: #c1e4d2;
699
+ --color-data-diverging-progression-7: #7eb8b1;
700
+ --color-data-diverging-progression-8: #4c8c89;
701
+ --color-data-diverging-progression-9: #2b6262;
702
+ --color-data-diverging-progression-10: #1b3d3c;
703
+
704
+ /* Diverging Heatmap */
705
+ --color-data-diverging-heatmap-1: #4e142d;
706
+ --color-data-diverging-heatmap-2: #8b2d4e;
707
+ --color-data-diverging-heatmap-3: #c15a4a;
708
+ --color-data-diverging-heatmap-4: #db8b6a;
709
+ --color-data-diverging-heatmap-5: #f3e1a3;
710
+ --color-data-diverging-heatmap-6: #bfd4c7;
711
+ --color-data-diverging-heatmap-7: #7c9eb9;
712
+ --color-data-diverging-heatmap-8: #4770a3;
713
+ --color-data-diverging-heatmap-9: #2e4d8c;
714
+ --color-data-diverging-heatmap-10: #18274e;
715
+
716
+ /* Diverging Polarity */
717
+ --color-data-diverging-polarity-1: #4e142d;
718
+ --color-data-diverging-polarity-2: #8b2d4e;
719
+ --color-data-diverging-polarity-3: #c15a7a;
720
+ --color-data-diverging-polarity-4: #db8b9e;
721
+ --color-data-diverging-polarity-5: #f3e1f4;
722
+ --color-data-diverging-polarity-6: #c7bfe2;
723
+ --color-data-diverging-polarity-7: #9ea7ce;
724
+ --color-data-diverging-polarity-8: #7080b5;
725
+ --color-data-diverging-polarity-9: #4d5e99;
726
+ --color-data-diverging-polarity-10: #2b3d70;
727
+
728
+ /* Device State Colors */
729
+ --color-device-charging-background: #f3e8ff;
730
+ --color-device-charging-border: #c084fc;
731
+ --color-device-charging-text: #6b21a8;
732
+
733
+ --color-device-discharging-background: #fffbeb;
734
+ --color-device-discharging-border: #facc15;
735
+ --color-device-discharging-text: #78350f;
736
+
737
+ --color-device-heat-background: #fee2e2;
738
+ --color-device-heat-border: #f87171;
739
+ --color-device-heat-text: #920000;
740
+
741
+ --color-device-cool-background: #dbeafe;
742
+ --color-device-cool-border: #60a5fa;
743
+ --color-device-cool-text: #0334be;
744
+
745
+ --color-device-eco-background: #ddfff1;
746
+ --color-device-eco-border: #34d399;
747
+ --color-device-eco-text: #065f46;
748
+
749
+ --color-device-auto-background: #ffedd5;
750
+ --color-device-auto-border: #fdba74;
751
+ --color-device-auto-text: #7c2d12;
752
+
753
+ --color-device-on-background: #ccfbf1;
754
+ --color-device-on-border: #2dd4bf;
755
+ --color-device-on-text: #0f766e;
756
+
757
+ --color-device-idle-background: #e5e7eb;
758
+ --color-device-idle-border: #9ca3af;
759
+ --color-device-idle-text: #374151;
760
+
761
+ --color-device-off-background: #e5e7eb;
762
+ --color-device-off-border: #9ca3af;
763
+ --color-device-off-text: #374151;
764
+
765
+ --color-device-unknown-background: #f8f8f8;
766
+ --color-device-unknown-border: #d1d5db;
767
+ --color-device-unknown-text: #000000;
768
+
769
+ --color-device-importing-background: #f8f8f8;
770
+ --color-device-importing-border: #d1d5db;
771
+ --color-device-importing-text: #000000;
772
+
773
+ --color-device-exporting-background: #f8f8f8;
774
+ --color-device-exporting-border: #d1d5db;
775
+ --color-device-exporting-text: #000000;
776
+
777
+ /* Form Control Base Sizes */
778
+ --control-sm: 0.75rem;
779
+ --control-md: 0.875rem;
780
+ --control-lg: 1rem;
781
+ --control-xl: 1.125rem;
782
+
783
+ /* Form Control Line Heights */
784
+ --control-sm-height: calc(var(--control-sm) * 2.75);
785
+ --control-md-height: calc(var(--control-md) * 2.75);
786
+ --control-lg-height: calc(var(--control-lg) * 3);
787
+ --control-xl-height: calc(var(--control-xl) * 3);
788
+
789
+ /* Form Control Padding */
790
+ --control-padding-sm: 0.75rem;
791
+ --control-padding-md: 1rem;
792
+ --control-padding-lg: 1.25rem;
793
+ --control-padding-xl: 1.5rem;
794
+
795
+ /* Form Control Gaps */
796
+ --control-gap-sm: 0.25rem;
797
+ --control-gap-md: 0.375rem;
798
+ --control-gap-lg: 0.5rem;
799
+ --control-gap-xl: 0.625rem;
800
+
801
+ /* Input Heights (includes padding) */
802
+ --input-height-sm: calc(var(--control-sm-height) + (var(--control-padding-sm) * 2));
803
+ --input-height-md: calc(var(--control-md-height) + (var(--control-padding-md) * 2));
804
+ --input-height-lg: calc(var(--control-lg-height) + (var(--control-padding-lg) * 2));
805
+ --input-height-xl: calc(var(--control-xl-height) + (var(--control-padding-xl) * 2));
806
+
807
+ /* Border Radius */
808
+ --control-border-radius: var(--border-radius-lg);
809
+
810
+ /* Select Widths */
811
+ --select-min-width-sm: 7.5rem;
812
+ --select-min-width-md: 10rem;
813
+ --select-min-width-lg: 12.5rem;
814
+ --select-min-width-xl: 15rem;
815
+
816
+ /* Form Control Text Relationships */
817
+ --control-text-sm: var(--text-xs);
818
+ --control-text-md: var(--text-sm);
819
+ --control-text-lg: var(--text-base);
820
+ --control-text-xl: var(--text-lg);
821
+
822
+ /* Form Control Group Spacing */
823
+ --control-group-spacing-sm: var(--control-gap-sm);
824
+ --control-group-spacing-md: var(--control-gap-md);
825
+ --control-group-spacing-lg: var(--control-gap-lg);
826
+ --control-group-spacing-xl: var(--control-gap-xl);
827
+
828
+ /* Form Layout Spacing */
829
+ --form-row-gap: var(--control-gap-lg);
830
+ --form-column-gap: var(--control-gap-xl);
831
+ --form-section-gap: calc(var(--control-gap-xl) * 2);
832
+ --form-field-gap: var(--control-gap-md);
833
+
834
+ /* Interactive States */
835
+ --control-hover-opacity: 0.9;
836
+ --control-active-opacity: 0.8;
837
+ --control-pressed-opacity: 0.7;
838
+
839
+ --control-focus-ring-color: var(--color-neutral-black);
840
+ --control-focus-ring-color-error: var(--color-feedback-error-border);
841
+ --control-focus-ring-color-success: var(--color-feedback-success-border);
842
+
843
+ /* Form Validation States */
844
+ --control-error-border: var(--color-feedback-error-border);
845
+ --control-error-background: var(--color-feedback-error-background);
846
+ --control-error-text: var(--color-feedback-error-text);
847
+
848
+ --control-success-border: var(--color-feedback-success-border);
849
+ --control-success-background: var(--color-feedback-success-background);
850
+ --control-success-text: var(--color-feedback-success-text);
851
+
852
+ --control-warning-border: var(--color-feedback-warning-border);
853
+ --control-warning-background: var(--color-feedback-warning-background);
854
+ --control-warning-text: var(--color-feedback-warning-text);
855
+
856
+ /* Form Control Transitions */
857
+ --control-transition-duration: 150ms;
858
+ --control-transition-timing: var(--ease-in-out);
859
+ --control-hover-transition: all var(--control-transition-duration) var(--control-transition-timing);
860
+ --control-focus-transition: all var(--control-transition-duration) var(--control-transition-timing);
861
+
862
+ /* Form Labels and Help Text */
863
+ --control-label-margin: var(--control-gap-sm);
864
+ --control-helper-text-margin: var(--control-gap-sm);
865
+ --control-helper-text-size: var(--text-sm);
866
+ --control-helper-text-color: var(--color-text-muted);
867
+ --control-label-size: var(--text-sm);
868
+ --control-label-color: var(--color-text-body);
869
+
870
+ /* Input Adornments */
871
+ --control-icon-size-sm: 1rem;
872
+ --control-icon-size-md: 1.25rem;
873
+ --control-icon-size-lg: 1.5rem;
874
+ --control-icon-size-xl: 1.75rem;
875
+ --control-adornment-gap: var(--control-gap-sm);
876
+
877
+ /* Form Control Variables */
878
+ --control-height-sm: 2rem;
879
+ --control-height-md: 2.5rem;
880
+ --control-height-lg: 3rem;
881
+ --control-height-xl: 3.5rem;
882
+ }
883
+
884
+ .dark {
885
+ /* Brand Colors - Dark */
886
+ --color-brand-primary: #b4b9ff;
887
+ --color-brand-light: #c4c4ff;
888
+ --color-brand-dark: #a8aeff;
889
+ --color-brand-background: #3a3f63;
890
+
891
+ /* Neutral Colors - Dark */
892
+ --color-neutral-black: #e5e7eb;
893
+ --color-neutral-white: #151a30;
894
+
895
+ /* Gray Scale - Dark */
896
+ --color-gray-lightest: #1f2937;
897
+ --color-gray-lighter: #374151;
898
+ --color-gray-light: #4b5563;
899
+ --color-gray-medium: #6b7280;
900
+ --color-gray-dark: #9ca3af;
901
+ --color-gray-darker: #d1d5db;
902
+ --color-gray-darkest: #f3f4f6;
903
+
904
+ /* Text Colors - Dark */
905
+ --color-text-body: #ededef;
906
+ --color-text-heading: #ffffff;
907
+ --color-text-caption: #d1d5db;
908
+ --color-text-muted: #9ca3af;
909
+ --color-text-placeholder: #9ca3af;
910
+ --color-text-disabled: #9ca3af;
911
+ --color-text-link-default: #b4b9ff;
912
+ --color-text-link-hover: #c0c5ff;
913
+ --color-text-link-active: #b4b9ff;
914
+ --color-text-link-visited: #c0c5ff;
915
+ --color-text-onPrimary: #1f2937;
916
+
917
+ /* Background Colors - Dark */
918
+ --color-background-body: #151a30;
919
+ --color-background-surface: #1a2038;
920
+ --color-background-muted: #374151;
921
+ --color-background-hover: #4b5563;
922
+ --color-background-selected: #6b7280;
923
+ --color-background-modal: rgba(255, 255, 255, 0.12);
924
+ --color-background-input: rgba(255, 255, 255, 0.05);
925
+ --color-background-menu-active: #222b44;
926
+
927
+ /* Border Colors - Dark */
928
+ --color-border-default: #2e3a59;
929
+ --color-border-focus: #e5e7eb;
930
+ --color-border-muted: #4b5563;
931
+ --color-border-input: #6b7280;
932
+
933
+ /* Action Colors - Dark */
934
+ --color-action-primary: #7a8ee1;
935
+ --color-action-primary-hover: #6a6fcc;
936
+ --color-action-secondary: #e5e7eb;
937
+ --color-action-secondary-hover: #f3f4f6;
938
+ --color-action-destructive: #e55a5a;
939
+ --color-action-destructive-hover: #d12c2c;
940
+ --color-action-success: #d1fae5;
941
+ --color-action-disabled: #9ca3af;
942
+
943
+ /* Feedback Colors - Dark */
944
+ --color-feedback-success-text: #d1fae5;
945
+ --color-feedback-success-icon: #d1fae5;
946
+ --color-feedback-success-background: #065f46;
947
+ --color-feedback-success-border: #10b981;
948
+
949
+ --color-feedback-error-text: #fee2e2;
950
+ --color-feedback-error-icon: #fee2e2;
951
+ --color-feedback-error-background: #b91c1c;
952
+ --color-feedback-error-border: #ef4444;
953
+
954
+ --color-feedback-warning-text: #fef3c7;
955
+ --color-feedback-warning-icon: #fef3c7;
956
+ --color-feedback-warning-background: #92400e;
957
+ --color-feedback-warning-border: #f59e0b;
958
+
959
+ --color-feedback-info-text: #60a5fa;
960
+ --color-feedback-info-icon: #60a5fa;
961
+ --color-feedback-info-background: #1e3160;
962
+ --color-feedback-info-border: #2563eb;
963
+
964
+ /* Device States - Dark */
965
+ --color-device-charging-background: #581c87;
966
+ --color-device-charging-border: #a855f7;
967
+ --color-device-charging-text: #e9d5ff;
968
+
969
+ --color-device-discharging-background: #78350f;
970
+ --color-device-discharging-border: #eab308;
971
+ --color-device-discharging-text: #fef3c7;
972
+
973
+ --color-device-heat-background: #7f1d1d;
974
+ --color-device-heat-border: #ef4444;
975
+ --color-device-heat-text: #fee2e2;
976
+
977
+ --color-device-cool-background: #1e3a8a;
978
+ --color-device-cool-border: #3b82f6;
979
+ --color-device-cool-text: #dbeafe;
980
+
981
+ --color-device-eco-background: #064e3b;
982
+ --color-device-eco-border: #10b981;
983
+ --color-device-eco-text: #d1fae5;
984
+
985
+ --color-device-auto-background: #7c2d12;
986
+ --color-device-auto-border: #fb923c;
987
+ --color-device-auto-text: #ffedd5;
988
+
989
+ --color-device-on-background: #134e4a;
990
+ --color-device-on-border: #14b8a6;
991
+ --color-device-on-text: #ccfbf1;
992
+
993
+ --color-device-idle-background: #374151;
994
+ --color-device-idle-border: #6b7280;
995
+ --color-device-idle-text: #e5e7eb;
996
+
997
+ --color-device-off-background: #374151;
998
+ --color-device-off-border: #6b7280;
999
+ --color-device-off-text: #e5e7eb;
1000
+
1001
+ --color-device-unknown-background: #1f2937;
1002
+ --color-device-unknown-border: #6b7280;
1003
+ --color-device-unknown-text: #ffffff;
1004
+
1005
+ --color-device-importing-background: #1f2937;
1006
+ --color-device-importing-border: #6b7280;
1007
+ --color-device-importing-text: #ffffff;
1008
+
1009
+ --color-device-exporting-background: #1f2937;
1010
+ --color-device-exporting-border: #6b7280;
1011
+ --color-device-exporting-text: #ffffff;
1012
+
1013
+ /* Skeleton Colors - Dark */
1014
+ --skeleton-base: #2e3a59;
1015
+ --skeleton-highlight: #374151;
1016
+ --skeleton-wave: rgba(255, 255, 255, 0.1);
1017
+ }