@channel.io/bezier-tokens 0.1.0 → 0.2.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -0,0 +1,854 @@
1
+ [data-bezier-theme="dark"] {
2
+ --alpha-color-shadow-base-inner: var(--alpha-color-white-8);
3
+ --alpha-color-shadow-base: var(--alpha-color-black-8);
4
+ --alpha-color-shadow-small: var(--alpha-color-black-15);
5
+ --alpha-color-shadow-medium: var(--alpha-color-black-20);
6
+ --alpha-color-shadow-large: var(--alpha-color-black-40);
7
+ --alpha-color-shadow-xlarge: var(--alpha-color-black-60);
8
+ --alpha-color-surface-normal: var(--alpha-color-grey-900);
9
+ --alpha-color-surface-lower: var(--alpha-color-grey-850);
10
+ --alpha-color-surface-lowest: var(--alpha-color-grey-800);
11
+ --alpha-color-bg-absolute-white-lightest: var(--alpha-color-white-20);
12
+ --alpha-color-bg-absolute-white-lighter: var(--alpha-color-white-40);
13
+ --alpha-color-bg-absolute-white-light: var(--alpha-color-white-60);
14
+ --alpha-color-bg-absolute-white-normal: var(--alpha-color-white-90);
15
+ --alpha-color-bg-absolute-white-dark: var(--alpha-color-white-100);
16
+ --alpha-color-bg-absolute-black-lightest: var(--alpha-color-black-20);
17
+ --alpha-color-bg-absolute-black-lighter: var(--alpha-color-black-40);
18
+ --alpha-color-bg-absolute-black-light: var(--alpha-color-black-60);
19
+ --alpha-color-bg-absolute-black-normal: var(--alpha-color-black-85);
20
+ --alpha-color-bg-absolute-black-dark: var(--alpha-color-black-100);
21
+ --alpha-color-bg-navy-shade-normal: var(--alpha-color-shade-navy-600);
22
+ --alpha-color-bg-navy-shade-light: var(--alpha-color-shade-navy-600-40);
23
+ --alpha-color-bg-navy-dark: var(--alpha-color-navy-400);
24
+ --alpha-color-bg-navy-lightest: var(--alpha-color-navy-300-15);
25
+ --alpha-color-bg-navy-lighter: var(--alpha-color-navy-300-30);
26
+ --alpha-color-bg-navy-light: var(--alpha-color-navy-300-45);
27
+ --alpha-color-bg-navy-normal: var(--alpha-color-navy-300);
28
+ --alpha-color-bg-purple-shade-normal: var(--alpha-color-shade-purple-600);
29
+ --alpha-color-bg-purple-shade-light: var(--alpha-color-shade-purple-600-40);
30
+ --alpha-color-bg-purple-dark: var(--alpha-color-purple-400);
31
+ --alpha-color-bg-purple-lightest: var(--alpha-color-purple-300-15);
32
+ --alpha-color-bg-purple-lighter: var(--alpha-color-purple-300-30);
33
+ --alpha-color-bg-purple-light: var(--alpha-color-purple-300-45);
34
+ --alpha-color-bg-purple-normal: var(--alpha-color-purple-300);
35
+ --alpha-color-bg-pink-shade-normal: var(--alpha-color-shade-pink-600);
36
+ --alpha-color-bg-pink-shade-light: var(--alpha-color-shade-pink-600-40);
37
+ --alpha-color-bg-pink-dark: var(--alpha-color-pink-400);
38
+ --alpha-color-bg-pink-lightest: var(--alpha-color-pink-300-15);
39
+ --alpha-color-bg-pink-lighter: var(--alpha-color-pink-300-30);
40
+ --alpha-color-bg-pink-light: var(--alpha-color-pink-300-45);
41
+ --alpha-color-bg-pink-normal: var(--alpha-color-pink-300);
42
+ --alpha-color-bg-yellow-shade-normal: var(--alpha-color-shade-yellow-600);
43
+ --alpha-color-bg-yellow-shade-light: var(--alpha-color-shade-yellow-600-40);
44
+ --alpha-color-bg-yellow-dark: var(--alpha-color-yellow-400);
45
+ --alpha-color-bg-yellow-lightest: var(--alpha-color-yellow-300-15);
46
+ --alpha-color-bg-yellow-lighter: var(--alpha-color-yellow-300-30);
47
+ --alpha-color-bg-yellow-light: var(--alpha-color-yellow-300-45);
48
+ --alpha-color-bg-yellow-normal: var(--alpha-color-yellow-300);
49
+ --alpha-color-bg-olive-shade-normal: var(--alpha-color-shade-olive-600);
50
+ --alpha-color-bg-olive-shade-light: var(--alpha-color-shade-olive-600-40);
51
+ --alpha-color-bg-olive-dark: var(--alpha-color-olive-400);
52
+ --alpha-color-bg-olive-lightest: var(--alpha-color-olive-300-15);
53
+ --alpha-color-bg-olive-lighter: var(--alpha-color-olive-300-30);
54
+ --alpha-color-bg-olive-light: var(--alpha-color-olive-300-45);
55
+ --alpha-color-bg-olive-normal: var(--alpha-color-olive-300);
56
+ --alpha-color-bg-teal-shade-normal: var(--alpha-color-shade-teal-600);
57
+ --alpha-color-bg-teal-shade-light: var(--alpha-color-shade-teal-600-40);
58
+ --alpha-color-bg-teal-dark: var(--alpha-color-teal-400);
59
+ --alpha-color-bg-teal-lightest: var(--alpha-color-teal-300-15);
60
+ --alpha-color-bg-teal-lighter: var(--alpha-color-teal-300-30);
61
+ --alpha-color-bg-teal-light: var(--alpha-color-teal-300-45);
62
+ --alpha-color-bg-teal-normal: var(--alpha-color-teal-300);
63
+ --alpha-color-bg-green-shade-normal: var(--alpha-color-shade-green-600);
64
+ --alpha-color-bg-green-shade-light: var(--alpha-color-shade-green-600-40);
65
+ --alpha-color-bg-green-dark: var(--alpha-color-green-400);
66
+ --alpha-color-bg-green-lightest: var(--alpha-color-green-300-15);
67
+ --alpha-color-bg-green-lighter: var(--alpha-color-green-300-30);
68
+ --alpha-color-bg-green-light: var(--alpha-color-green-300-45);
69
+ --alpha-color-bg-green-normal: var(--alpha-color-green-300);
70
+ --alpha-color-bg-orange-shade-normal: var(--alpha-color-shade-orange-600);
71
+ --alpha-color-bg-orange-shade-light: var(--alpha-color-shade-orange-600-40);
72
+ --alpha-color-bg-orange-dark: var(--alpha-color-orange-400);
73
+ --alpha-color-bg-orange-lightest: var(--alpha-color-orange-300-15);
74
+ --alpha-color-bg-orange-lighter: var(--alpha-color-orange-300-30);
75
+ --alpha-color-bg-orange-light: var(--alpha-color-orange-300-45);
76
+ --alpha-color-bg-orange-normal: var(--alpha-color-orange-300);
77
+ --alpha-color-bg-red-shade-normal: var(--alpha-color-shade-red-600);
78
+ --alpha-color-bg-red-shade-light: var(--alpha-color-shade-red-600-40);
79
+ --alpha-color-bg-red-dark: var(--alpha-color-red-400);
80
+ --alpha-color-bg-red-lightest: var(--alpha-color-red-300-15);
81
+ --alpha-color-bg-red-lighter: var(--alpha-color-red-300-30);
82
+ --alpha-color-bg-red-light: var(--alpha-color-red-300-45);
83
+ --alpha-color-bg-red-normal: var(--alpha-color-red-300);
84
+ --alpha-color-bg-cobalt-shade-normal: var(--alpha-color-shade-cobalt-600);
85
+ --alpha-color-bg-cobalt-shade-light: var(--alpha-color-shade-cobalt-600-40);
86
+ --alpha-color-bg-cobalt-dark: var(--alpha-color-cobalt-400);
87
+ --alpha-color-bg-cobalt-lightest: var(--alpha-color-cobalt-300-15);
88
+ --alpha-color-bg-cobalt-lighter: var(--alpha-color-cobalt-300-30);
89
+ --alpha-color-bg-cobalt-light: var(--alpha-color-cobalt-300-45);
90
+ --alpha-color-bg-cobalt-normal: var(--alpha-color-cobalt-300);
91
+ --alpha-color-bg-blue-shade-normal: var(--alpha-color-shade-blue-600);
92
+ --alpha-color-bg-blue-shade-light: var(--alpha-color-shade-blue-600-40);
93
+ --alpha-color-bg-blue-dark: var(--alpha-color-blue-400);
94
+ --alpha-color-bg-blue-lightest: var(--alpha-color-blue-300-15);
95
+ --alpha-color-bg-blue-lighter: var(--alpha-color-blue-300-30);
96
+ --alpha-color-bg-blue-light: var(--alpha-color-blue-300-45);
97
+ --alpha-color-bg-blue-normal: var(--alpha-color-blue-300);
98
+ --alpha-color-bg-white-white-alpha-light: var(--alpha-color-black-20);
99
+ --alpha-color-bg-white-white-alpha-lighter: var(--alpha-color-black-60);
100
+ --alpha-color-bg-white-white-alpha-lightest: var(--alpha-color-grey-alpha-800-80);
101
+ --alpha-color-bg-white-normal: var(--alpha-color-grey-900);
102
+ --alpha-color-bg-white-higher: var(--alpha-color-grey-800);
103
+ --alpha-color-bg-white-highest: var(--alpha-color-grey-700);
104
+ --alpha-color-bg-grey-normal: var(--alpha-color-grey-600);
105
+ --alpha-color-bg-grey-grey-alpha-light: var(--alpha-color-grey-alpha-850-80);
106
+ --alpha-color-bg-grey-grey-alpha-dark: var(--alpha-color-grey-alpha-800-80);
107
+ --alpha-color-bg-grey-grey-alpha-darker: var(--alpha-color-grey-alpha-800-90);
108
+ --alpha-color-bg-grey-grey-alpha-darkest: var(--alpha-color-grey-alpha-700-80);
109
+ --alpha-color-bg-grey-lightest: var(--alpha-color-grey-850);
110
+ --alpha-color-bg-grey-lighter: var(--alpha-color-grey-800);
111
+ --alpha-color-bg-grey-light: var(--alpha-color-grey-700);
112
+ --alpha-color-bg-grey-dark: var(--alpha-color-grey-500);
113
+ --alpha-color-bg-grey-darkest: var(--alpha-color-white-100);
114
+ --alpha-color-bg-black-lightest: var(--alpha-color-white-5);
115
+ --alpha-color-bg-black-lighter: var(--alpha-color-white-8);
116
+ --alpha-color-bg-black-light: var(--alpha-color-white-12);
117
+ --alpha-color-bg-black-dark: var(--alpha-color-white-20);
118
+ --alpha-color-bg-black-darker: var(--alpha-color-white-40);
119
+ --alpha-color-bg-black-darkest: var(--alpha-color-black-60);
120
+ --alpha-color-fg-grey-grey-alpha-light: var(--alpha-color-grey-alpha-850-80);
121
+ --alpha-color-fg-grey-grey-alpha-dark: var(--alpha-color-grey-alpha-800-80);
122
+ --alpha-color-fg-grey-grey-alpha-darker: var(--alpha-color-grey-alpha-800-90);
123
+ --alpha-color-fg-grey-lightest: var(--alpha-color-grey-850);
124
+ --alpha-color-fg-grey-lighter: var(--alpha-color-grey-800);
125
+ --alpha-color-fg-grey-light: var(--alpha-color-grey-700);
126
+ --alpha-color-fg-grey-normal: var(--alpha-color-grey-600);
127
+ --alpha-color-fg-grey-dark: var(--alpha-color-grey-500);
128
+ --alpha-color-fg-absolute-white-lightest: var(--alpha-color-white-20);
129
+ --alpha-color-fg-absolute-white-lighter: var(--alpha-color-white-40);
130
+ --alpha-color-fg-absolute-white-light: var(--alpha-color-white-60);
131
+ --alpha-color-fg-absolute-white-normal: var(--alpha-color-white-90);
132
+ --alpha-color-fg-absolute-white-dark: var(--alpha-color-white-100);
133
+ --alpha-color-fg-absolute-black-lightest: var(--alpha-color-black-20);
134
+ --alpha-color-fg-absolute-black-lighter: var(--alpha-color-black-40);
135
+ --alpha-color-fg-absolute-black-light: var(--alpha-color-black-60);
136
+ --alpha-color-fg-absolute-black-normal: var(--alpha-color-black-85);
137
+ --alpha-color-fg-absolute-black-dark: var(--alpha-color-black-100);
138
+ --alpha-color-fg-navy-light: var(--alpha-color-navy-300-45);
139
+ --alpha-color-fg-navy-normal: var(--alpha-color-navy-300);
140
+ --alpha-color-fg-purple-light: var(--alpha-color-purple-300-45);
141
+ --alpha-color-fg-purple-normal: var(--alpha-color-purple-300);
142
+ --alpha-color-fg-pink-light: var(--alpha-color-pink-300-45);
143
+ --alpha-color-fg-pink-normal: var(--alpha-color-pink-300);
144
+ --alpha-color-fg-yellow-light: var(--alpha-color-yellow-300-45);
145
+ --alpha-color-fg-yellow-normal: var(--alpha-color-yellow-300);
146
+ --alpha-color-fg-olive-light: var(--alpha-color-olive-300-45);
147
+ --alpha-color-fg-olive-normal: var(--alpha-color-olive-300);
148
+ --alpha-color-fg-teal-light: var(--alpha-color-teal-300-45);
149
+ --alpha-color-fg-teal-normal: var(--alpha-color-teal-300);
150
+ --alpha-color-fg-green-dark: var(--alpha-color-green-300);
151
+ --alpha-color-fg-green-light: var(--alpha-color-green-300-45);
152
+ --alpha-color-fg-green-normal: var(--alpha-color-green-300);
153
+ --alpha-color-fg-orange-dark: var(--alpha-color-orange-300);
154
+ --alpha-color-fg-orange-light: var(--alpha-color-orange-300-45);
155
+ --alpha-color-fg-orange-normal: var(--alpha-color-orange-300);
156
+ --alpha-color-fg-red-dark: var(--alpha-color-red-300);
157
+ --alpha-color-fg-red-light: var(--alpha-color-red-300-45);
158
+ --alpha-color-fg-red-normal: var(--alpha-color-red-300);
159
+ --alpha-color-fg-cobalt-dark: var(--alpha-color-cobalt-300);
160
+ --alpha-color-fg-cobalt-light: var(--alpha-color-cobalt-300-45);
161
+ --alpha-color-fg-cobalt-normal: var(--alpha-color-cobalt-300);
162
+ --alpha-color-fg-blue-dark: var(--alpha-color-blue-300);
163
+ --alpha-color-fg-blue-light: var(--alpha-color-blue-300-45);
164
+ --alpha-color-fg-blue-normal: var(--alpha-color-blue-300);
165
+ --alpha-color-fg-white-normal: var(--alpha-color-grey-900);
166
+ --alpha-color-fg-black-lightest: var(--alpha-color-white-12);
167
+ --alpha-color-fg-black-light: var(--alpha-color-white-20);
168
+ --alpha-color-fg-black-dark: var(--alpha-color-white-40);
169
+ --alpha-color-fg-black-darker: var(--alpha-color-white-60);
170
+ --alpha-color-fg-black-darkest: var(--alpha-color-white-80);
171
+ --alpha-color-fg-black-pure: var(--alpha-color-white-100);
172
+ --alpha-color-success-fg-dark: var(--alpha-color-fg-green-dark);
173
+ --alpha-color-success-fg-light: var(--alpha-color-fg-green-light);
174
+ --alpha-color-success-fg-normal: var(--alpha-color-fg-green-normal);
175
+ --alpha-color-success-bg-lightest: var(--alpha-color-bg-green-lightest);
176
+ --alpha-color-success-bg-lighter: var(--alpha-color-bg-green-lighter);
177
+ --alpha-color-success-bg-light: var(--alpha-color-bg-green-light);
178
+ --alpha-color-success-bg-normal: var(--alpha-color-bg-green-normal);
179
+ --alpha-color-success-bg-dark: var(--alpha-color-bg-green-dark);
180
+ --alpha-color-accent-fg-dark: var(--alpha-color-fg-cobalt-dark);
181
+ --alpha-color-accent-fg-light: var(--alpha-color-fg-cobalt-light);
182
+ --alpha-color-accent-fg-normal: var(--alpha-color-fg-cobalt-normal);
183
+ --alpha-color-accent-bg-lightest: var(--alpha-color-bg-cobalt-lightest);
184
+ --alpha-color-accent-bg-lighter: var(--alpha-color-bg-cobalt-lighter);
185
+ --alpha-color-accent-bg-light: var(--alpha-color-bg-cobalt-light);
186
+ --alpha-color-accent-bg-normal: var(--alpha-color-bg-cobalt-normal);
187
+ --alpha-color-accent-bg-dark: var(--alpha-color-bg-cobalt-dark);
188
+ --alpha-color-warning-fg-dark: var(--alpha-color-fg-orange-dark);
189
+ --alpha-color-warning-fg-light: var(--alpha-color-fg-orange-light);
190
+ --alpha-color-warning-fg-normal: var(--alpha-color-fg-orange-normal);
191
+ --alpha-color-warning-bg-lightest: var(--alpha-color-bg-orange-lightest);
192
+ --alpha-color-warning-bg-lighter: var(--alpha-color-bg-orange-lighter);
193
+ --alpha-color-warning-bg-light: var(--alpha-color-bg-orange-light);
194
+ --alpha-color-warning-bg-normal: var(--alpha-color-bg-orange-normal);
195
+ --alpha-color-warning-bg-dark: var(--alpha-color-bg-orange-dark);
196
+ --alpha-color-critical-fg-dark: var(--alpha-color-fg-red-dark);
197
+ --alpha-color-critical-fg-light: var(--alpha-color-fg-red-light);
198
+ --alpha-color-critical-fg-normal: var(--alpha-color-fg-red-normal);
199
+ --alpha-color-critical-bg-lightest: var(--alpha-color-bg-red-lightest);
200
+ --alpha-color-critical-bg-lighter: var(--alpha-color-bg-red-lighter);
201
+ --alpha-color-critical-bg-light: var(--alpha-color-bg-red-light);
202
+ --alpha-color-critical-bg-normal: var(--alpha-color-fg-red-normal);
203
+ --alpha-color-critical-bg-dark: var(--alpha-color-bg-red-dark);
204
+ --alpha-color-primary-fg-dark: var(--alpha-color-fg-blue-dark);
205
+ --alpha-color-primary-fg-light: var(--alpha-color-fg-blue-light);
206
+ --alpha-color-primary-fg-normal: var(--alpha-color-fg-blue-normal);
207
+ --alpha-color-primary-bg-dark: var(--alpha-color-bg-blue-dark);
208
+ --alpha-color-primary-bg-lightest: var(--alpha-color-bg-blue-lightest);
209
+ --alpha-color-primary-bg-lighter: var(--alpha-color-bg-blue-lighter);
210
+ --alpha-color-primary-bg-light: var(--alpha-color-bg-blue-light);
211
+ --alpha-color-primary-bg-normal: var(--alpha-color-bg-blue-normal);
212
+ --alpha-color-dim-black-normal: var(--alpha-color-bg-absolute-black-lighter);
213
+ --alpha-color-dim-black-light: var(--alpha-color-bg-absolute-black-lightest);
214
+ --alpha-shadow-input-default: inset 0 0 0 1px var(--alpha-color-shadow-base-inner), 0 0 2px 0 var(--alpha-color-shadow-base);
215
+ --alpha-shadow-6: inset 0 0 2px 0 var(--alpha-color-shadow-base-inner), 0 0 2px 1px var(--alpha-color-shadow-base), 0 12px 60px 4px var(--alpha-color-shadow-xlarge);
216
+ --alpha-shadow-5: inset 0 0 2px 0 var(--alpha-color-shadow-base-inner), 0 0 2px 1px var(--alpha-color-shadow-base), 0 6px 40px 0 var(--alpha-color-shadow-xlarge);
217
+ --alpha-shadow-4: inset 0 0 2px 0 var(--alpha-color-shadow-base-inner), 0 0 2px 1px var(--alpha-color-shadow-base), 0 4px 24px 0 var(--alpha-color-shadow-large);
218
+ --alpha-shadow-3: inset 0 0 2px 0 var(--alpha-color-shadow-base-inner), 0 0 2px 1px var(--alpha-color-shadow-base), 0 4px 16px 0 var(--alpha-color-shadow-medium);
219
+ --alpha-shadow-2: inset 0 0 2px 0 var(--alpha-color-shadow-base-inner), 0 0 2px 1px var(--alpha-color-shadow-base), 0 2px 6px 0 var(--alpha-color-shadow-small);
220
+ --alpha-shadow-1: inset 0 0 2px 0 var(--alpha-color-shadow-base-inner), 0 0 2px 1px var(--alpha-color-shadow-base), 0 1px 2px 0 var(--alpha-color-shadow-small);
221
+ --alpha-gradient-fg-black: linear-gradient(90deg, var(--alpha-color-bg-black-light) 0%, var(--alpha-color-bg-black-dark) 100%);
222
+ --alpha-shadow-input-error: inset 0 0 0 1px var(--alpha-color-warning-bg-normal), 0 0 0 3px var(--alpha-color-warning-bg-light), 0 0 6px 0 var(--alpha-color-shadow-base);
223
+ --alpha-shadow-input-active: inset 0 0 0 1px var(--alpha-color-primary-bg-normal), 0 0 0 3px var(--alpha-color-primary-bg-light), 0 0 6px 0 var(--alpha-color-shadow-base);
224
+ --alpha-shadow-input-hover: inset 0 0 0 1px var(--alpha-color-primary-bg-normal), 0 0 6px 0 var(--alpha-color-shadow-base);
225
+ --alpha-shadow-active: 0 0 0 1px var(--alpha-color-primary-bg-normal);
226
+ --alpha-shadow-error: 0 0 0 1px var(--alpha-color-warning-bg-normal);
227
+ }
228
+
229
+ :where(:root, :host) {
230
+ --alpha-font-letter-spacing-3: 0.03rem;
231
+ --alpha-font-letter-spacing-2: 0.02rem;
232
+ --alpha-font-letter-spacing-1: 0.01rem;
233
+ --alpha-font-letter-spacing-0: 0rem;
234
+ --alpha-font-line-height-44: 4.4rem;
235
+ --alpha-font-line-height-36: 3.6rem;
236
+ --alpha-font-line-height-32: 3.2rem;
237
+ --alpha-font-line-height-28: 2.8rem;
238
+ --alpha-font-line-height-24: 2.4rem;
239
+ --alpha-font-line-height-23: 2.3rem;
240
+ --alpha-font-line-height-22: 2.2rem;
241
+ --alpha-font-line-height-18: 1.8rem;
242
+ --alpha-font-line-height-16: 1.6rem;
243
+ --alpha-font-weight-bold: 700;
244
+ --alpha-font-weight-semibold: 600;
245
+ --alpha-font-weight-regular: 400;
246
+ --alpha-font-size-15-5: 1.55rem;
247
+ --alpha-font-size-36: 3.6rem;
248
+ --alpha-font-size-30: 3rem;
249
+ --alpha-font-size-24: 2.4rem;
250
+ --alpha-font-size-22: 2.2rem;
251
+ --alpha-font-size-18: 1.8rem;
252
+ --alpha-font-size-17: 1.7rem;
253
+ --alpha-font-size-16: 1.6rem;
254
+ --alpha-font-size-15: 1.5rem;
255
+ --alpha-font-size-14: 1.4rem;
256
+ --alpha-font-size-13: 1.3rem;
257
+ --alpha-font-size-12: 1.2rem;
258
+ --alpha-font-size-11: 1.1rem;
259
+ --alpha-font-family-mono: 'ui-monospace', 'Cascadia Code', 'Source Code Pro', 'Menlo', 'Consolas', 'DejaVu Sans Mono', 'monospace';
260
+ --alpha-font-family-sans: 'Pretendard', 'NotoSansJP', 'system-ui', 'sans-serif';
261
+ --alpha-dimension-m-1: -1px;
262
+ --alpha-dimension-100-p: 100%;
263
+ --alpha-dimension-42-p: 42%;
264
+ --alpha-dimension-900: 900px;
265
+ --alpha-dimension-800: 800px;
266
+ --alpha-dimension-720: 720px;
267
+ --alpha-dimension-640: 640px;
268
+ --alpha-dimension-540: 540px;
269
+ --alpha-dimension-420: 420px;
270
+ --alpha-dimension-320: 320px;
271
+ --alpha-dimension-240: 240px;
272
+ --alpha-dimension-200: 200px;
273
+ --alpha-dimension-160: 160px;
274
+ --alpha-dimension-120: 120px;
275
+ --alpha-dimension-90: 90px;
276
+ --alpha-dimension-72: 72px;
277
+ --alpha-dimension-60: 60px;
278
+ --alpha-dimension-54: 54px;
279
+ --alpha-dimension-48: 48px;
280
+ --alpha-dimension-44: 44px;
281
+ --alpha-dimension-42: 42px;
282
+ --alpha-dimension-40: 40px;
283
+ --alpha-dimension-36: 36px;
284
+ --alpha-dimension-32: 32px;
285
+ --alpha-dimension-30: 30px;
286
+ --alpha-dimension-28: 28px;
287
+ --alpha-dimension-24: 24px;
288
+ --alpha-dimension-22: 22px;
289
+ --alpha-dimension-20: 20px;
290
+ --alpha-dimension-16: 16px;
291
+ --alpha-dimension-14: 14px;
292
+ --alpha-dimension-12: 12px;
293
+ --alpha-dimension-10: 10px;
294
+ --alpha-dimension-8: 8px;
295
+ --alpha-dimension-7: 7px;
296
+ --alpha-dimension-6: 6px;
297
+ --alpha-dimension-4: 4px;
298
+ --alpha-dimension-3: 3px;
299
+ --alpha-dimension-2: 2px;
300
+ --alpha-dimension-1: 1px;
301
+ --alpha-color-shade-navy-600-40: #373b5666;
302
+ --alpha-color-shade-navy-400-20: #5f69b033;
303
+ --alpha-color-shade-navy-600: #373b56;
304
+ --alpha-color-shade-navy-400: #5f69b0;
305
+ --alpha-color-shade-purple-600-40: #5b467d66;
306
+ --alpha-color-shade-purple-400-20: #9d6fe533;
307
+ --alpha-color-shade-purple-600: #5b467d;
308
+ --alpha-color-shade-purple-400: #9d6fe5;
309
+ --alpha-color-shade-pink-600-40: #85407566;
310
+ --alpha-color-shade-pink-400-20: #d369ba33;
311
+ --alpha-color-shade-pink-600: #854075;
312
+ --alpha-color-shade-pink-400: #d369ba;
313
+ --alpha-color-shade-orange-600-40: #895a3466;
314
+ --alpha-color-shade-orange-400-20: #e08c4833;
315
+ --alpha-color-shade-orange-600: #895a34;
316
+ --alpha-color-shade-orange-400: #e08c48;
317
+ --alpha-color-shade-yellow-600-40: #7d6a2666;
318
+ --alpha-color-shade-yellow-400-20: #e8ae3c33;
319
+ --alpha-color-shade-yellow-600: #7d6a26;
320
+ --alpha-color-shade-yellow-400: #e8ae3c;
321
+ --alpha-color-shade-olive-600-40: #73763866;
322
+ --alpha-color-shade-olive-400-20: #a5a95333;
323
+ --alpha-color-shade-olive-600: #737638;
324
+ --alpha-color-shade-olive-400: #a5a953;
325
+ --alpha-color-shade-green-600-40: #4c7a5e66;
326
+ --alpha-color-shade-green-400-20: #62af7c33;
327
+ --alpha-color-shade-green-600: #4c7a5e;
328
+ --alpha-color-shade-green-400: #62af7c;
329
+ --alpha-color-shade-red-600-40: #90424866;
330
+ --alpha-color-shade-red-400-20: #de687033;
331
+ --alpha-color-shade-red-600: #904248;
332
+ --alpha-color-shade-red-400: #de6870;
333
+ --alpha-color-shade-teal-600-40: #47737d66;
334
+ --alpha-color-shade-teal-400-20: #55aaa733;
335
+ --alpha-color-shade-teal-600: #47737d;
336
+ --alpha-color-shade-teal-400: #55aaa7;
337
+ --alpha-color-shade-cobalt-600-40: #4a618566;
338
+ --alpha-color-shade-cobalt-400-20: #57ace833;
339
+ --alpha-color-shade-cobalt-600: #4a6185;
340
+ --alpha-color-shade-cobalt-400: #57ace8;
341
+ --alpha-color-shade-blue-600-40: #4c528966;
342
+ --alpha-color-shade-blue-400-20: #7175e033;
343
+ --alpha-color-shade-blue-600: #4c5289;
344
+ --alpha-color-shade-blue-400: #7175e0;
345
+ --alpha-color-grey-alpha-800-90: #313234e6;
346
+ --alpha-color-grey-alpha-100-90: #f7f7f8e6;
347
+ --alpha-color-grey-alpha-50-80: #fcfcfccc;
348
+ --alpha-color-grey-alpha-100-80: #f7f7f8cc;
349
+ --alpha-color-grey-alpha-200-80: #efeff0cc;
350
+ --alpha-color-grey-alpha-700-80: #464748cc;
351
+ --alpha-color-grey-alpha-800-80: #313234cc;
352
+ --alpha-color-grey-alpha-850-80: #2a2b2dcc;
353
+ --alpha-color-grey-alpha-900-90: #242428e6;
354
+ --alpha-color-grey-900: #242428;
355
+ --alpha-color-grey-850: #2a2b2d;
356
+ --alpha-color-grey-800: #313234;
357
+ --alpha-color-grey-700: #464748;
358
+ --alpha-color-grey-600: #7b7b7b;
359
+ --alpha-color-grey-500: #a7a7aa;
360
+ --alpha-color-grey-400: #cfcfd1;
361
+ --alpha-color-grey-300: #e2e2e4;
362
+ --alpha-color-grey-200: #efeff0;
363
+ --alpha-color-grey-100: #f7f7f8;
364
+ --alpha-color-grey-50: #fcfcfc;
365
+ --alpha-color-olive-300-15: #c8d63026;
366
+ --alpha-color-olive-300-30: #c8d6304d;
367
+ --alpha-color-olive-300-45: #c8d63073;
368
+ --alpha-color-olive-400-10: #a9b1101a;
369
+ --alpha-color-olive-400-20: #a9b11033;
370
+ --alpha-color-olive-400-30: #a9b1104d;
371
+ --alpha-color-olive-600: #65691c;
372
+ --alpha-color-olive-500: #7b801c;
373
+ --alpha-color-olive-400: #a9b110;
374
+ --alpha-color-olive-300: #c8d630;
375
+ --alpha-color-olive-200: #dbe56e;
376
+ --alpha-color-olive-100: #e7f17c;
377
+ --alpha-color-teal-300-15: #40d3c526;
378
+ --alpha-color-teal-300-30: #40d3c54d;
379
+ --alpha-color-teal-300-45: #40d3c573;
380
+ --alpha-color-teal-400-10: #09b2ac1a;
381
+ --alpha-color-teal-400-20: #09b2ac33;
382
+ --alpha-color-teal-400-30: #09b2ac4d;
383
+ --alpha-color-teal-600: #06687d;
384
+ --alpha-color-teal-500: #068e95;
385
+ --alpha-color-teal-400: #09b2ac;
386
+ --alpha-color-teal-300: #40d3c5;
387
+ --alpha-color-teal-200: #72e0d5;
388
+ --alpha-color-teal-100: #9beee6;
389
+ --alpha-color-navy-300-15: #7683d326;
390
+ --alpha-color-navy-300-30: #7683d34d;
391
+ --alpha-color-navy-300-45: #7683d373;
392
+ --alpha-color-navy-400-10: #424fab1a;
393
+ --alpha-color-navy-400-20: #424fab33;
394
+ --alpha-color-navy-400-30: #424fab4d;
395
+ --alpha-color-navy-600: #22245b;
396
+ --alpha-color-navy-500: #353888;
397
+ --alpha-color-navy-400: #424fab;
398
+ --alpha-color-navy-300: #7683d3;
399
+ --alpha-color-navy-200: #8b99d9;
400
+ --alpha-color-navy-100: #a5b2ee;
401
+ --alpha-color-purple-300-15: #b184ff26;
402
+ --alpha-color-purple-300-30: #b184ff4d;
403
+ --alpha-color-purple-300-45: #b184ff73;
404
+ --alpha-color-purple-400-10: #8e57e71a;
405
+ --alpha-color-purple-400-20: #8e57e733;
406
+ --alpha-color-purple-400-30: #8e57e74d;
407
+ --alpha-color-purple-600: #54278f;
408
+ --alpha-color-purple-500: #6735b6;
409
+ --alpha-color-purple-400: #8e57e7;
410
+ --alpha-color-purple-300: #b184ff;
411
+ --alpha-color-purple-200: #c19aff;
412
+ --alpha-color-purple-100: #d1b5ff;
413
+ --alpha-color-pink-300-15: #ec6fd326;
414
+ --alpha-color-pink-300-30: #ec6fd34d;
415
+ --alpha-color-pink-300-45: #ec6fd373;
416
+ --alpha-color-pink-400-10: #d64bb51a;
417
+ --alpha-color-pink-400-20: #d64bb533;
418
+ --alpha-color-pink-400-30: #d64bb54d;
419
+ --alpha-color-pink-600: #962c86;
420
+ --alpha-color-pink-500: #b0369e;
421
+ --alpha-color-pink-400: #d64bb5;
422
+ --alpha-color-pink-300: #ec6fd3;
423
+ --alpha-color-pink-200: #f896e5;
424
+ --alpha-color-pink-100: #ffafef;
425
+ --alpha-color-yellow-300-15: #f9c83526;
426
+ --alpha-color-yellow-300-30: #f9c8354d;
427
+ --alpha-color-yellow-300-45: #f9c83573;
428
+ --alpha-color-yellow-400-10: #edae0d1a;
429
+ --alpha-color-yellow-400-20: #edae0d33;
430
+ --alpha-color-yellow-400-30: #edae0d4d;
431
+ --alpha-color-yellow-600: #9e7504;
432
+ --alpha-color-yellow-500: #c38f00;
433
+ --alpha-color-yellow-400: #edae0d;
434
+ --alpha-color-yellow-300: #f9c835;
435
+ --alpha-color-yellow-200: #fed968;
436
+ --alpha-color-yellow-100: #ffe38f;
437
+ --alpha-color-orange-300-15: #ffa15e26;
438
+ --alpha-color-orange-300-30: #ffa15e4d;
439
+ --alpha-color-orange-300-45: #ffa15e73;
440
+ --alpha-color-orange-400-10: #e67f2b1a;
441
+ --alpha-color-orange-400-20: #e67f2b33;
442
+ --alpha-color-orange-400-30: #e67f2b4d;
443
+ --alpha-color-orange-600: #a1540c;
444
+ --alpha-color-orange-500: #c1630d;
445
+ --alpha-color-orange-400: #e67f2b;
446
+ --alpha-color-orange-300: #ffa15e;
447
+ --alpha-color-orange-200: #ffb77d;
448
+ --alpha-color-orange-100: #ffc38f;
449
+ --alpha-color-white-100: #ffffff;
450
+ --alpha-color-white-90: #ffffffe6;
451
+ --alpha-color-white-80: #ffffffcc;
452
+ --alpha-color-white-60: #ffffff99;
453
+ --alpha-color-white-40: #ffffff66;
454
+ --alpha-color-white-20: #ffffff33;
455
+ --alpha-color-white-12: #ffffff1f;
456
+ --alpha-color-white-8: #ffffff14;
457
+ --alpha-color-white-5: #ffffff0d;
458
+ --alpha-color-white-0: #ffffff00;
459
+ --alpha-color-black-100: #000000;
460
+ --alpha-color-black-85: #000000d9;
461
+ --alpha-color-black-70: #000000b3;
462
+ --alpha-color-black-60: #00000099;
463
+ --alpha-color-black-50: #00000080;
464
+ --alpha-color-black-40: #00000066;
465
+ --alpha-color-black-30: #0000004d;
466
+ --alpha-color-black-22: #00000038;
467
+ --alpha-color-black-20: #00000033;
468
+ --alpha-color-black-15: #00000026;
469
+ --alpha-color-black-8: #00000014;
470
+ --alpha-color-black-5: #0000000d;
471
+ --alpha-color-black-3: #00000008;
472
+ --alpha-color-red-300-15: #ff8c8c26;
473
+ --alpha-color-red-300-30: #ff8c8c4d;
474
+ --alpha-color-red-300-45: #ff8c8c73;
475
+ --alpha-color-red-400-10: #e55c5c1a;
476
+ --alpha-color-red-400-20: #e55c5c33;
477
+ --alpha-color-red-400-30: #e55c5c4d;
478
+ --alpha-color-red-600: #992c34;
479
+ --alpha-color-red-500: #bc3a42;
480
+ --alpha-color-red-400: #e55c5c;
481
+ --alpha-color-red-300: #ff8c8c;
482
+ --alpha-color-red-200: #ffa6a6;
483
+ --alpha-color-red-100: #ffb8b8;
484
+ --alpha-color-green-300-15: #7ad89026;
485
+ --alpha-color-green-300-30: #7ad8904d;
486
+ --alpha-color-green-300-45: #7ad89073;
487
+ --alpha-color-green-400-10: #40ad671a;
488
+ --alpha-color-green-400-20: #40ad6733;
489
+ --alpha-color-green-400-30: #40ad674d;
490
+ --alpha-color-green-600: #327055;
491
+ --alpha-color-green-500: #358761;
492
+ --alpha-color-green-400: #40ad67;
493
+ --alpha-color-green-300: #7ad890;
494
+ --alpha-color-green-200: #91e5a4;
495
+ --alpha-color-green-100: #a4ecb3;
496
+ --alpha-color-cobalt-300-15: #77c0fb26;
497
+ --alpha-color-cobalt-300-30: #77c0fb4d;
498
+ --alpha-color-cobalt-300-45: #77c0fb73;
499
+ --alpha-color-cobalt-400-10: #5093e51a;
500
+ --alpha-color-cobalt-400-20: #5093e533;
501
+ --alpha-color-cobalt-400-30: #5093e54d;
502
+ --alpha-color-cobalt-600: #2b59b5;
503
+ --alpha-color-cobalt-500: #3870d1;
504
+ --alpha-color-cobalt-400: #5093e5;
505
+ --alpha-color-cobalt-300: #7dc2fa;
506
+ --alpha-color-cobalt-200: #9ad1ff;
507
+ --alpha-color-cobalt-100: #afdaff;
508
+ --alpha-color-blue-300-15: #84a5ff26;
509
+ --alpha-color-blue-300-30: #84a5ff4d;
510
+ --alpha-color-blue-300-45: #84a5ff73;
511
+ --alpha-color-blue-400-10: #6d6afc1a;
512
+ --alpha-color-blue-400-20: #6d6afc33;
513
+ --alpha-color-blue-400-30: #6d6afc4d;
514
+ --alpha-color-blue-600: #4941bc;
515
+ --alpha-color-blue-500: #5950dc;
516
+ --alpha-color-blue-400: #6d6afc;
517
+ --alpha-color-blue-300: #84a5ff;
518
+ --alpha-color-blue-200: #96b7ff;
519
+ --alpha-color-blue-100: #a9c6ff;
520
+ --alpha-typography-caption-4-regular-letter-spacing: var(--alpha-font-letter-spacing-1);
521
+ --alpha-typography-caption-4-regular-line-height: var(--alpha-font-line-height-16);
522
+ --alpha-typography-caption-4-regular-font-size: var(--alpha-font-size-11);
523
+ --alpha-typography-caption-4-regular-font-weight: var(--alpha-font-weight-regular);
524
+ --alpha-typography-caption-4-semibold-letter-spacing: var(--alpha-font-letter-spacing-1);
525
+ --alpha-typography-caption-4-semibold-line-height: var(--alpha-font-line-height-16);
526
+ --alpha-typography-caption-4-semibold-font-size: var(--alpha-font-size-11);
527
+ --alpha-typography-caption-4-semibold-font-weight: var(--alpha-font-weight-semibold);
528
+ --alpha-typography-caption-3-regular-letter-spacing: var(--alpha-font-letter-spacing-2);
529
+ --alpha-typography-caption-3-regular-line-height: var(--alpha-font-line-height-16);
530
+ --alpha-typography-caption-3-regular-font-size: var(--alpha-font-size-12);
531
+ --alpha-typography-caption-3-regular-font-weight: var(--alpha-font-weight-regular);
532
+ --alpha-typography-caption-3-semibold-letter-spacing: var(--alpha-font-letter-spacing-2);
533
+ --alpha-typography-caption-3-semibold-line-height: var(--alpha-font-line-height-16);
534
+ --alpha-typography-caption-3-semibold-font-size: var(--alpha-font-size-12);
535
+ --alpha-typography-caption-3-semibold-font-weight: var(--alpha-font-weight-semibold);
536
+ --alpha-typography-caption-2-regular-letter-spacing: var(--alpha-font-letter-spacing-2);
537
+ --alpha-typography-caption-2-regular-line-height: var(--alpha-font-line-height-18);
538
+ --alpha-typography-caption-2-regular-font-size: var(--alpha-font-size-13);
539
+ --alpha-typography-caption-2-regular-font-weight: var(--alpha-font-weight-regular);
540
+ --alpha-typography-caption-2-semibold-letter-spacing: var(--alpha-font-letter-spacing-2);
541
+ --alpha-typography-caption-2-semibold-line-height: var(--alpha-font-line-height-18);
542
+ --alpha-typography-caption-2-semibold-font-size: var(--alpha-font-size-13);
543
+ --alpha-typography-caption-2-semibold-font-weight: var(--alpha-font-weight-semibold);
544
+ --alpha-typography-caption-1-regular-letter-spacing: var(--alpha-font-letter-spacing-2);
545
+ --alpha-typography-caption-1-regular-line-height: var(--alpha-font-line-height-18);
546
+ --alpha-typography-caption-1-regular-font-size: var(--alpha-font-size-14);
547
+ --alpha-typography-caption-1-regular-font-weight: var(--alpha-font-weight-regular);
548
+ --alpha-typography-caption-1-semibold-letter-spacing: var(--alpha-font-letter-spacing-2);
549
+ --alpha-typography-caption-1-semibold-line-height: var(--alpha-font-line-height-18);
550
+ --alpha-typography-caption-1-semibold-font-size: var(--alpha-font-size-14);
551
+ --alpha-typography-caption-1-semibold-font-weight: var(--alpha-font-weight-semibold);
552
+ --alpha-typography-body-2-regular-letter-spacing: var(--alpha-font-letter-spacing-1);
553
+ --alpha-typography-body-2-regular-line-height: var(--alpha-font-line-height-22);
554
+ --alpha-typography-body-2-regular-font-size: var(--alpha-font-size-15);
555
+ --alpha-typography-body-2-regular-font-weight: var(--alpha-font-weight-regular);
556
+ --alpha-typography-body-2-semibold-letter-spacing: var(--alpha-font-letter-spacing-2);
557
+ --alpha-typography-body-2-semibold-line-height: var(--alpha-font-line-height-22);
558
+ --alpha-typography-body-2-semibold-font-size: var(--alpha-font-size-15);
559
+ --alpha-typography-body-2-semibold-font-weight: var(--alpha-font-weight-semibold);
560
+ --alpha-typography-body-1-regular-letter-spacing: var(--alpha-font-letter-spacing-1);
561
+ --alpha-typography-body-1-regular-line-height: var(--alpha-font-line-height-24);
562
+ --alpha-typography-body-1-regular-font-size: var(--alpha-font-size-16);
563
+ --alpha-typography-body-1-regular-font-weight: var(--alpha-font-weight-regular);
564
+ --alpha-typography-body-1-semibold-letter-spacing: var(--alpha-font-letter-spacing-2);
565
+ --alpha-typography-body-1-semibold-line-height: var(--alpha-font-line-height-24);
566
+ --alpha-typography-body-1-semibold-font-size: var(--alpha-font-size-16);
567
+ --alpha-typography-body-1-semibold-font-weight: var(--alpha-font-weight-semibold);
568
+ --alpha-typography-title-3-semibold-letter-spacing: var(--alpha-font-letter-spacing-3);
569
+ --alpha-typography-title-3-semibold-line-height: var(--alpha-font-line-height-24);
570
+ --alpha-typography-title-3-semibold-font-size: var(--alpha-font-size-16);
571
+ --alpha-typography-title-3-semibold-font-weight: var(--alpha-font-weight-semibold);
572
+ --alpha-typography-title-2-semibold-letter-spacing: var(--alpha-font-letter-spacing-2);
573
+ --alpha-typography-title-2-semibold-line-height: var(--alpha-font-line-height-24);
574
+ --alpha-typography-title-2-semibold-font-size: var(--alpha-font-size-18);
575
+ --alpha-typography-title-2-semibold-font-weight: var(--alpha-font-weight-semibold);
576
+ --alpha-typography-title-2-bold-letter-spacing: var(--alpha-font-letter-spacing-2);
577
+ --alpha-typography-title-2-bold-line-height: var(--alpha-font-line-height-24);
578
+ --alpha-typography-title-2-bold-font-size: var(--alpha-font-size-18);
579
+ --alpha-typography-title-2-bold-font-weight: var(--alpha-font-weight-bold);
580
+ --alpha-typography-title-1-bold-letter-spacing: var(--alpha-font-letter-spacing-2);
581
+ --alpha-typography-title-1-bold-line-height: var(--alpha-font-line-height-28);
582
+ --alpha-typography-title-1-bold-font-size: var(--alpha-font-size-22);
583
+ --alpha-typography-title-1-bold-font-weight: var(--alpha-font-weight-bold);
584
+ --alpha-typography-h3-regular-letter-spacing: var(--alpha-font-letter-spacing-0);
585
+ --alpha-typography-h3-regular-line-height: var(--alpha-font-line-height-32);
586
+ --alpha-typography-h3-regular-font-size: var(--alpha-font-size-24);
587
+ --alpha-typography-h3-regular-font-weight: var(--alpha-font-weight-regular);
588
+ --alpha-typography-h3-bold-letter-spacing: var(--alpha-font-letter-spacing-0);
589
+ --alpha-typography-h3-bold-line-height: var(--alpha-font-line-height-32);
590
+ --alpha-typography-h3-bold-font-size: var(--alpha-font-size-24);
591
+ --alpha-typography-h3-bold-font-weight: var(--alpha-font-weight-bold);
592
+ --alpha-typography-h2-regular-letter-spacing: var(--alpha-font-letter-spacing-0);
593
+ --alpha-typography-h2-regular-line-height: var(--alpha-font-line-height-36);
594
+ --alpha-typography-h2-regular-font-size: var(--alpha-font-size-30);
595
+ --alpha-typography-h2-regular-font-weight: var(--alpha-font-weight-regular);
596
+ --alpha-typography-h2-bold-letter-spacing: var(--alpha-font-letter-spacing-0);
597
+ --alpha-typography-h2-bold-line-height: var(--alpha-font-line-height-36);
598
+ --alpha-typography-h2-bold-font-size: var(--alpha-font-size-30);
599
+ --alpha-typography-h2-bold-font-weight: var(--alpha-font-weight-bold);
600
+ --alpha-typography-h1-bold-letter-spacing: var(--alpha-font-letter-spacing-0);
601
+ --alpha-typography-h1-bold-line-height: var(--alpha-font-line-height-44);
602
+ --alpha-typography-h1-bold-font-size: var(--alpha-font-size-36);
603
+ --alpha-typography-h1-bold-font-weight: var(--alpha-font-weight-bold);
604
+ --alpha-typography-message-letter-spacing: var(--alpha-font-letter-spacing-2);
605
+ --alpha-typography-message-line-height: var(--alpha-font-line-height-23);
606
+ --alpha-typography-message-font-size: var(--alpha-font-size-15-5);
607
+ --alpha-typography-message-font-weight: var(--alpha-font-weight-regular);
608
+ --alpha-gradient-fg-green: linear-gradient(90deg, var(--alpha-color-green-400) 0%, var(--alpha-color-green-300) 100%);
609
+ --alpha-gradient-bg-blue: linear-gradient(90deg, var(--alpha-color-blue-300) 50%, var(--alpha-color-green-200) 100%);
610
+ --alpha-gradient-bg-green: linear-gradient(90deg, var(--alpha-color-green-300) 50%, var(--alpha-color-teal-200) 100%);
611
+ --alpha-gradient-bg-orange: linear-gradient(90deg, var(--alpha-color-orange-300) 50%, var(--alpha-color-yellow-200) 100%);
612
+ --alpha-gradient-bg-purple: linear-gradient(90deg, var(--alpha-color-purple-300) 50%, var(--alpha-color-pink-200) 100%);
613
+ --alpha-dimension-source-120: var(--alpha-dimension-120);
614
+ --alpha-dimension-source-90: var(--alpha-dimension-90);
615
+ --alpha-dimension-source-72: var(--alpha-dimension-72);
616
+ --alpha-dimension-source-60: var(--alpha-dimension-60);
617
+ --alpha-dimension-source-48: var(--alpha-dimension-48);
618
+ --alpha-dimension-source-42: var(--alpha-dimension-42);
619
+ --alpha-dimension-source-36: var(--alpha-dimension-36);
620
+ --alpha-dimension-source-30: var(--alpha-dimension-30);
621
+ --alpha-dimension-source-24: var(--alpha-dimension-24);
622
+ --alpha-dimension-source-20: var(--alpha-dimension-20);
623
+ --alpha-dimension-source-16: var(--alpha-dimension-16);
624
+ --alpha-dimension-source-12: var(--alpha-dimension-12);
625
+ --alpha-dimension-source-10: var(--alpha-dimension-10);
626
+ }
627
+
628
+ :where(:root, :host), [data-bezier-theme="light"] {
629
+ --alpha-color-shadow-base-inner: var(--alpha-color-white-12);
630
+ --alpha-color-shadow-base: var(--alpha-color-black-5);
631
+ --alpha-color-shadow-small: var(--alpha-color-black-8);
632
+ --alpha-color-shadow-medium: var(--alpha-color-black-15);
633
+ --alpha-color-shadow-large: var(--alpha-color-black-22);
634
+ --alpha-color-shadow-xlarge: var(--alpha-color-black-30);
635
+ --alpha-color-surface-normal: var(--alpha-color-white-100);
636
+ --alpha-color-surface-lower: var(--alpha-color-grey-50);
637
+ --alpha-color-surface-lowest: var(--alpha-color-grey-100);
638
+ --alpha-color-bg-absolute-white-lightest: var(--alpha-color-white-20);
639
+ --alpha-color-bg-absolute-white-lighter: var(--alpha-color-white-40);
640
+ --alpha-color-bg-absolute-white-light: var(--alpha-color-white-60);
641
+ --alpha-color-bg-absolute-white-normal: var(--alpha-color-white-90);
642
+ --alpha-color-bg-absolute-white-dark: var(--alpha-color-white-100);
643
+ --alpha-color-bg-absolute-black-lightest: var(--alpha-color-black-20);
644
+ --alpha-color-bg-absolute-black-lighter: var(--alpha-color-black-40);
645
+ --alpha-color-bg-absolute-black-light: var(--alpha-color-black-60);
646
+ --alpha-color-bg-absolute-black-normal: var(--alpha-color-black-85);
647
+ --alpha-color-bg-absolute-black-dark: var(--alpha-color-black-100);
648
+ --alpha-color-bg-navy-shade-normal: var(--alpha-color-shade-navy-400);
649
+ --alpha-color-bg-navy-shade-light: var(--alpha-color-shade-navy-400-20);
650
+ --alpha-color-bg-navy-dark: var(--alpha-color-navy-500);
651
+ --alpha-color-bg-navy-lightest: var(--alpha-color-navy-400-10);
652
+ --alpha-color-bg-navy-lighter: var(--alpha-color-navy-400-20);
653
+ --alpha-color-bg-navy-light: var(--alpha-color-navy-400-30);
654
+ --alpha-color-bg-navy-normal: var(--alpha-color-navy-400);
655
+ --alpha-color-bg-purple-shade-normal: var(--alpha-color-shade-purple-400);
656
+ --alpha-color-bg-purple-shade-light: var(--alpha-color-shade-purple-400-20);
657
+ --alpha-color-bg-purple-dark: var(--alpha-color-purple-500);
658
+ --alpha-color-bg-purple-lightest: var(--alpha-color-purple-400-10);
659
+ --alpha-color-bg-purple-lighter: var(--alpha-color-purple-400-20);
660
+ --alpha-color-bg-purple-light: var(--alpha-color-purple-400-30);
661
+ --alpha-color-bg-purple-normal: var(--alpha-color-purple-400);
662
+ --alpha-color-bg-pink-shade-normal: var(--alpha-color-shade-pink-400);
663
+ --alpha-color-bg-pink-shade-light: var(--alpha-color-shade-pink-400-20);
664
+ --alpha-color-bg-pink-dark: var(--alpha-color-pink-500);
665
+ --alpha-color-bg-pink-lightest: var(--alpha-color-pink-400-10);
666
+ --alpha-color-bg-pink-lighter: var(--alpha-color-pink-400-20);
667
+ --alpha-color-bg-pink-light: var(--alpha-color-pink-400-30);
668
+ --alpha-color-bg-pink-normal: var(--alpha-color-pink-400);
669
+ --alpha-color-bg-yellow-shade-normal: var(--alpha-color-shade-yellow-400);
670
+ --alpha-color-bg-yellow-shade-light: var(--alpha-color-shade-yellow-400-20);
671
+ --alpha-color-bg-yellow-dark: var(--alpha-color-yellow-500);
672
+ --alpha-color-bg-yellow-lightest: var(--alpha-color-yellow-400-10);
673
+ --alpha-color-bg-yellow-lighter: var(--alpha-color-yellow-400-20);
674
+ --alpha-color-bg-yellow-light: var(--alpha-color-yellow-400-30);
675
+ --alpha-color-bg-yellow-normal: var(--alpha-color-yellow-400);
676
+ --alpha-color-bg-olive-shade-normal: var(--alpha-color-shade-olive-400);
677
+ --alpha-color-bg-olive-shade-light: var(--alpha-color-shade-olive-400-20);
678
+ --alpha-color-bg-olive-dark: var(--alpha-color-olive-500);
679
+ --alpha-color-bg-olive-lightest: var(--alpha-color-olive-400-10);
680
+ --alpha-color-bg-olive-lighter: var(--alpha-color-olive-400-20);
681
+ --alpha-color-bg-olive-light: var(--alpha-color-olive-400-30);
682
+ --alpha-color-bg-olive-normal: var(--alpha-color-olive-400);
683
+ --alpha-color-bg-teal-shade-normal: var(--alpha-color-shade-teal-400);
684
+ --alpha-color-bg-teal-shade-light: var(--alpha-color-shade-teal-400-20);
685
+ --alpha-color-bg-teal-dark: var(--alpha-color-teal-500);
686
+ --alpha-color-bg-teal-lightest: var(--alpha-color-teal-400-10);
687
+ --alpha-color-bg-teal-lighter: var(--alpha-color-teal-400-20);
688
+ --alpha-color-bg-teal-light: var(--alpha-color-teal-400-30);
689
+ --alpha-color-bg-teal-normal: var(--alpha-color-teal-400);
690
+ --alpha-color-bg-green-shade-normal: var(--alpha-color-shade-green-400);
691
+ --alpha-color-bg-green-shade-light: var(--alpha-color-shade-green-400-20);
692
+ --alpha-color-bg-green-dark: var(--alpha-color-green-500);
693
+ --alpha-color-bg-green-lightest: var(--alpha-color-green-400-10);
694
+ --alpha-color-bg-green-lighter: var(--alpha-color-green-400-20);
695
+ --alpha-color-bg-green-light: var(--alpha-color-green-400-30);
696
+ --alpha-color-bg-green-normal: var(--alpha-color-green-400);
697
+ --alpha-color-bg-orange-shade-normal: var(--alpha-color-shade-orange-400);
698
+ --alpha-color-bg-orange-shade-light: var(--alpha-color-shade-orange-400-20);
699
+ --alpha-color-bg-orange-dark: var(--alpha-color-orange-500);
700
+ --alpha-color-bg-orange-lightest: var(--alpha-color-orange-400-10);
701
+ --alpha-color-bg-orange-lighter: var(--alpha-color-orange-400-20);
702
+ --alpha-color-bg-orange-light: var(--alpha-color-orange-400-30);
703
+ --alpha-color-bg-orange-normal: var(--alpha-color-orange-400);
704
+ --alpha-color-bg-red-shade-normal: var(--alpha-color-shade-red-400);
705
+ --alpha-color-bg-red-shade-light: var(--alpha-color-shade-red-400-20);
706
+ --alpha-color-bg-red-dark: var(--alpha-color-red-500);
707
+ --alpha-color-bg-red-lightest: var(--alpha-color-red-400-10);
708
+ --alpha-color-bg-red-lighter: var(--alpha-color-red-400-20);
709
+ --alpha-color-bg-red-light: var(--alpha-color-red-400-30);
710
+ --alpha-color-bg-red-normal: var(--alpha-color-red-400);
711
+ --alpha-color-bg-cobalt-shade-normal: var(--alpha-color-shade-cobalt-400);
712
+ --alpha-color-bg-cobalt-shade-light: var(--alpha-color-shade-cobalt-400-20);
713
+ --alpha-color-bg-cobalt-dark: var(--alpha-color-cobalt-500);
714
+ --alpha-color-bg-cobalt-lightest: var(--alpha-color-cobalt-400-10);
715
+ --alpha-color-bg-cobalt-lighter: var(--alpha-color-cobalt-400-20);
716
+ --alpha-color-bg-cobalt-light: var(--alpha-color-cobalt-400-30);
717
+ --alpha-color-bg-cobalt-normal: var(--alpha-color-cobalt-400);
718
+ --alpha-color-bg-blue-shade-normal: var(--alpha-color-shade-blue-400);
719
+ --alpha-color-bg-blue-shade-light: var(--alpha-color-shade-blue-400-20);
720
+ --alpha-color-bg-blue-dark: var(--alpha-color-blue-500);
721
+ --alpha-color-bg-blue-lightest: var(--alpha-color-blue-400-10);
722
+ --alpha-color-bg-blue-lighter: var(--alpha-color-blue-400-20);
723
+ --alpha-color-bg-blue-light: var(--alpha-color-blue-400-30);
724
+ --alpha-color-bg-blue-normal: var(--alpha-color-blue-400);
725
+ --alpha-color-bg-white-white-alpha-light: var(--alpha-color-white-20);
726
+ --alpha-color-bg-white-white-alpha-lighter: var(--alpha-color-white-60);
727
+ --alpha-color-bg-white-white-alpha-lightest: var(--alpha-color-white-90);
728
+ --alpha-color-bg-white-normal: var(--alpha-color-white-100);
729
+ --alpha-color-bg-white-higher: var(--alpha-color-white-100);
730
+ --alpha-color-bg-white-highest: var(--alpha-color-white-100);
731
+ --alpha-color-bg-grey-normal: var(--alpha-color-grey-400);
732
+ --alpha-color-bg-grey-grey-alpha-light: var(--alpha-color-grey-alpha-50-80);
733
+ --alpha-color-bg-grey-grey-alpha-dark: var(--alpha-color-grey-alpha-100-80);
734
+ --alpha-color-bg-grey-grey-alpha-darker: var(--alpha-color-grey-alpha-100-90);
735
+ --alpha-color-bg-grey-grey-alpha-darkest: var(--alpha-color-grey-alpha-200-80);
736
+ --alpha-color-bg-grey-lightest: var(--alpha-color-grey-50);
737
+ --alpha-color-bg-grey-lighter: var(--alpha-color-grey-100);
738
+ --alpha-color-bg-grey-light: var(--alpha-color-grey-200);
739
+ --alpha-color-bg-grey-dark: var(--alpha-color-grey-500);
740
+ --alpha-color-bg-grey-darkest: var(--alpha-color-grey-900);
741
+ --alpha-color-bg-black-lightest: var(--alpha-color-black-3);
742
+ --alpha-color-bg-black-lighter: var(--alpha-color-black-5);
743
+ --alpha-color-bg-black-light: var(--alpha-color-black-8);
744
+ --alpha-color-bg-black-dark: var(--alpha-color-black-15);
745
+ --alpha-color-bg-black-darker: var(--alpha-color-black-40);
746
+ --alpha-color-bg-black-darkest: var(--alpha-color-black-60);
747
+ --alpha-color-fg-grey-grey-alpha-light: var(--alpha-color-grey-alpha-50-80);
748
+ --alpha-color-fg-grey-grey-alpha-dark: var(--alpha-color-grey-alpha-100-80);
749
+ --alpha-color-fg-grey-grey-alpha-darker: var(--alpha-color-grey-alpha-200-80);
750
+ --alpha-color-fg-grey-lightest: var(--alpha-color-grey-50);
751
+ --alpha-color-fg-grey-lighter: var(--alpha-color-grey-100);
752
+ --alpha-color-fg-grey-light: var(--alpha-color-grey-200);
753
+ --alpha-color-fg-grey-normal: var(--alpha-color-grey-400);
754
+ --alpha-color-fg-grey-dark: var(--alpha-color-grey-500);
755
+ --alpha-color-fg-absolute-white-lightest: var(--alpha-color-white-20);
756
+ --alpha-color-fg-absolute-white-lighter: var(--alpha-color-white-40);
757
+ --alpha-color-fg-absolute-white-light: var(--alpha-color-white-60);
758
+ --alpha-color-fg-absolute-white-normal: var(--alpha-color-white-90);
759
+ --alpha-color-fg-absolute-white-dark: var(--alpha-color-white-100);
760
+ --alpha-color-fg-absolute-black-lightest: var(--alpha-color-black-20);
761
+ --alpha-color-fg-absolute-black-lighter: var(--alpha-color-black-40);
762
+ --alpha-color-fg-absolute-black-light: var(--alpha-color-black-60);
763
+ --alpha-color-fg-absolute-black-normal: var(--alpha-color-black-85);
764
+ --alpha-color-fg-absolute-black-dark: var(--alpha-color-black-100);
765
+ --alpha-color-fg-navy-light: var(--alpha-color-navy-400-30);
766
+ --alpha-color-fg-navy-normal: var(--alpha-color-navy-400);
767
+ --alpha-color-fg-purple-light: var(--alpha-color-purple-400-30);
768
+ --alpha-color-fg-purple-normal: var(--alpha-color-purple-400);
769
+ --alpha-color-fg-pink-light: var(--alpha-color-pink-400-30);
770
+ --alpha-color-fg-pink-normal: var(--alpha-color-pink-400);
771
+ --alpha-color-fg-yellow-light: var(--alpha-color-yellow-400-30);
772
+ --alpha-color-fg-yellow-normal: var(--alpha-color-yellow-400);
773
+ --alpha-color-fg-olive-light: var(--alpha-color-olive-400-30);
774
+ --alpha-color-fg-olive-normal: var(--alpha-color-olive-400);
775
+ --alpha-color-fg-teal-light: var(--alpha-color-teal-400-30);
776
+ --alpha-color-fg-teal-normal: var(--alpha-color-teal-400);
777
+ --alpha-color-fg-green-dark: var(--alpha-color-green-500);
778
+ --alpha-color-fg-green-light: var(--alpha-color-green-400-30);
779
+ --alpha-color-fg-green-normal: var(--alpha-color-green-400);
780
+ --alpha-color-fg-orange-dark: var(--alpha-color-orange-500);
781
+ --alpha-color-fg-orange-light: var(--alpha-color-orange-400-30);
782
+ --alpha-color-fg-orange-normal: var(--alpha-color-orange-400);
783
+ --alpha-color-fg-red-dark: var(--alpha-color-red-500);
784
+ --alpha-color-fg-red-light: var(--alpha-color-red-400-30);
785
+ --alpha-color-fg-red-normal: var(--alpha-color-red-400);
786
+ --alpha-color-fg-cobalt-dark: var(--alpha-color-cobalt-500);
787
+ --alpha-color-fg-cobalt-light: var(--alpha-color-cobalt-400-30);
788
+ --alpha-color-fg-cobalt-normal: var(--alpha-color-cobalt-400);
789
+ --alpha-color-fg-blue-dark: var(--alpha-color-blue-500);
790
+ --alpha-color-fg-blue-light: var(--alpha-color-blue-400-30);
791
+ --alpha-color-fg-blue-normal: var(--alpha-color-blue-400);
792
+ --alpha-color-fg-white-normal: var(--alpha-color-white-100);
793
+ --alpha-color-fg-black-lightest: var(--alpha-color-black-8);
794
+ --alpha-color-fg-black-light: var(--alpha-color-black-15);
795
+ --alpha-color-fg-black-dark: var(--alpha-color-black-40);
796
+ --alpha-color-fg-black-darker: var(--alpha-color-black-60);
797
+ --alpha-color-fg-black-darkest: var(--alpha-color-black-85);
798
+ --alpha-color-fg-black-pure: var(--alpha-color-black-100);
799
+ --alpha-color-success-fg-dark: var(--alpha-color-fg-green-dark);
800
+ --alpha-color-success-fg-light: var(--alpha-color-fg-green-light);
801
+ --alpha-color-success-fg-normal: var(--alpha-color-fg-green-normal);
802
+ --alpha-color-success-bg-lightest: var(--alpha-color-bg-green-lightest);
803
+ --alpha-color-success-bg-lighter: var(--alpha-color-bg-green-lighter);
804
+ --alpha-color-success-bg-light: var(--alpha-color-bg-green-light);
805
+ --alpha-color-success-bg-normal: var(--alpha-color-bg-green-normal);
806
+ --alpha-color-success-bg-dark: var(--alpha-color-bg-green-dark);
807
+ --alpha-color-accent-fg-dark: var(--alpha-color-fg-cobalt-dark);
808
+ --alpha-color-accent-fg-light: var(--alpha-color-fg-cobalt-light);
809
+ --alpha-color-accent-fg-normal: var(--alpha-color-fg-cobalt-normal);
810
+ --alpha-color-accent-bg-lightest: var(--alpha-color-bg-cobalt-lightest);
811
+ --alpha-color-accent-bg-lighter: var(--alpha-color-bg-cobalt-lighter);
812
+ --alpha-color-accent-bg-light: var(--alpha-color-bg-cobalt-light);
813
+ --alpha-color-accent-bg-normal: var(--alpha-color-bg-cobalt-normal);
814
+ --alpha-color-accent-bg-dark: var(--alpha-color-bg-cobalt-dark);
815
+ --alpha-color-warning-fg-dark: var(--alpha-color-fg-orange-dark);
816
+ --alpha-color-warning-fg-light: var(--alpha-color-fg-orange-light);
817
+ --alpha-color-warning-fg-normal: var(--alpha-color-fg-orange-normal);
818
+ --alpha-color-warning-bg-lightest: var(--alpha-color-bg-orange-lightest);
819
+ --alpha-color-warning-bg-lighter: var(--alpha-color-bg-orange-lighter);
820
+ --alpha-color-warning-bg-light: var(--alpha-color-bg-orange-light);
821
+ --alpha-color-warning-bg-normal: var(--alpha-color-bg-orange-normal);
822
+ --alpha-color-warning-bg-dark: var(--alpha-color-bg-orange-dark);
823
+ --alpha-color-critical-fg-dark: var(--alpha-color-fg-red-dark);
824
+ --alpha-color-critical-fg-light: var(--alpha-color-fg-red-light);
825
+ --alpha-color-critical-fg-normal: var(--alpha-color-fg-red-normal);
826
+ --alpha-color-critical-bg-lightest: var(--alpha-color-bg-red-lightest);
827
+ --alpha-color-critical-bg-lighter: var(--alpha-color-bg-red-lighter);
828
+ --alpha-color-critical-bg-light: var(--alpha-color-bg-red-light);
829
+ --alpha-color-critical-bg-normal: var(--alpha-color-fg-red-normal);
830
+ --alpha-color-critical-bg-dark: var(--alpha-color-bg-red-dark);
831
+ --alpha-color-primary-fg-dark: var(--alpha-color-fg-blue-dark);
832
+ --alpha-color-primary-fg-light: var(--alpha-color-fg-blue-light);
833
+ --alpha-color-primary-fg-normal: var(--alpha-color-fg-blue-normal);
834
+ --alpha-color-primary-bg-dark: var(--alpha-color-bg-blue-dark);
835
+ --alpha-color-primary-bg-lightest: var(--alpha-color-bg-blue-lightest);
836
+ --alpha-color-primary-bg-lighter: var(--alpha-color-bg-blue-lighter);
837
+ --alpha-color-primary-bg-light: var(--alpha-color-bg-blue-light);
838
+ --alpha-color-primary-bg-normal: var(--alpha-color-bg-blue-normal);
839
+ --alpha-color-dim-black-normal: var(--alpha-color-bg-absolute-black-lighter);
840
+ --alpha-color-dim-black-light: var(--alpha-color-bg-absolute-black-lightest);
841
+ --alpha-shadow-input-default: inset 0 0 0 1px var(--alpha-color-shadow-base-inner), 0 0 2px 0 var(--alpha-color-shadow-base);
842
+ --alpha-shadow-6: inset 0 0 2px 0 var(--alpha-color-shadow-base-inner), 0 0 2px 1px var(--alpha-color-shadow-base), 0 12px 60px 4px var(--alpha-color-shadow-xlarge);
843
+ --alpha-shadow-5: inset 0 0 2px 0 var(--alpha-color-shadow-base-inner), 0 0 2px 1px var(--alpha-color-shadow-base), 0 6px 40px 0 var(--alpha-color-shadow-xlarge);
844
+ --alpha-shadow-4: inset 0 0 2px 0 var(--alpha-color-shadow-base-inner), 0 0 2px 1px var(--alpha-color-shadow-base), 0 4px 24px 0 var(--alpha-color-shadow-large);
845
+ --alpha-shadow-3: inset 0 0 2px 0 var(--alpha-color-shadow-base-inner), 0 0 2px 1px var(--alpha-color-shadow-base), 0 4px 16px 0 var(--alpha-color-shadow-medium);
846
+ --alpha-shadow-2: inset 0 0 2px 0 var(--alpha-color-shadow-base-inner), 0 0 2px 1px var(--alpha-color-shadow-base), 0 2px 6px 0 var(--alpha-color-shadow-small);
847
+ --alpha-shadow-1: inset 0 0 2px 0 var(--alpha-color-shadow-base-inner), 0 0 2px 1px var(--alpha-color-shadow-base), 0 1px 2px 0 var(--alpha-color-shadow-small);
848
+ --alpha-gradient-fg-black: linear-gradient(90deg, var(--alpha-color-bg-black-light) 0%, var(--alpha-color-bg-black-dark) 100%);
849
+ --alpha-shadow-input-error: inset 0 0 0 1px var(--alpha-color-warning-bg-normal), 0 0 0 3px var(--alpha-color-warning-bg-light), 0 0 6px 0 var(--alpha-color-shadow-base);
850
+ --alpha-shadow-input-active: inset 0 0 0 1px var(--alpha-color-primary-bg-normal), 0 0 0 3px var(--alpha-color-primary-bg-light), 0 0 6px 0 var(--alpha-color-shadow-base);
851
+ --alpha-shadow-input-hover: inset 0 0 0 1px var(--alpha-color-primary-bg-normal), 0 0 6px 0 var(--alpha-color-shadow-base);
852
+ --alpha-shadow-active: 0 0 0 1px var(--alpha-color-primary-bg-normal);
853
+ --alpha-shadow-error: 0 0 0 1px var(--alpha-color-warning-bg-normal);
854
+ }