@bspk/ui 1.3.30 → 1.4.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.
Files changed (65) hide show
  1. package/build.ts +1 -2
  2. package/dist/components/StylesProviderAgentWorkplace/StylesProviderAgentWorkplace.d.ts +11 -0
  3. package/dist/components/StylesProviderAgentWorkplace/StylesProviderAgentWorkplace.js +14 -0
  4. package/dist/components/StylesProviderAgentWorkplace/StylesProviderAgentWorkplace.js.map +1 -0
  5. package/dist/components/StylesProviderAgentWorkplace/index.d.ts +1 -0
  6. package/dist/components/StylesProviderAgentWorkplace/index.js +2 -0
  7. package/dist/components/StylesProviderAgentWorkplace/index.js.map +1 -0
  8. package/dist/components/StylesProviderBrokerWorkplace/StylesProviderBrokerWorkplace.d.ts +11 -0
  9. package/dist/components/StylesProviderBrokerWorkplace/StylesProviderBrokerWorkplace.js +14 -0
  10. package/dist/components/StylesProviderBrokerWorkplace/StylesProviderBrokerWorkplace.js.map +1 -0
  11. package/dist/components/StylesProviderBrokerWorkplace/index.d.ts +1 -0
  12. package/dist/components/StylesProviderBrokerWorkplace/index.js +2 -0
  13. package/dist/components/StylesProviderBrokerWorkplace/index.js.map +1 -0
  14. package/dist/components/StylesProviderDemo/brandsCss.js +10 -9
  15. package/dist/components/StylesProviderDemo/brandsCss.js.map +1 -1
  16. package/dist/components/StylesProviderDemo/exampleCss.js +5 -5
  17. package/dist/components/StylesProviderDemo/exampleCss.js.map +1 -1
  18. package/dist/components/Table/Table.js +1 -1
  19. package/dist/components/Table/Table.js.map +1 -1
  20. package/dist/styles/agent-workplace.css +1800 -0
  21. package/dist/styles/{denali-boss.css.js → agent-workplace.css.js} +770 -849
  22. package/dist/styles/anywhere.css +687 -766
  23. package/dist/styles/anywhere.css.js +687 -766
  24. package/dist/styles/better-homes-gardens.css +579 -826
  25. package/dist/styles/better-homes-gardens.css.js +579 -826
  26. package/dist/styles/broker-workplace.css +1800 -0
  27. package/dist/styles/broker-workplace.css.js +1805 -0
  28. package/dist/styles/cartus.css +674 -765
  29. package/dist/styles/cartus.css.js +674 -765
  30. package/dist/styles/century-21.css +679 -766
  31. package/dist/styles/century-21.css.js +679 -766
  32. package/dist/styles/coldwell-banker.css +671 -762
  33. package/dist/styles/coldwell-banker.css.js +671 -762
  34. package/dist/styles/corcoran.css +663 -758
  35. package/dist/styles/corcoran.css.js +663 -758
  36. package/dist/styles/era.css +677 -766
  37. package/dist/styles/era.css.js +677 -766
  38. package/dist/styles/example.css +1898 -0
  39. package/dist/styles/example.css.js +1903 -0
  40. package/dist/styles/sothebys.css +670 -759
  41. package/dist/styles/sothebys.css.js +670 -759
  42. package/dist/types/common.d.ts +2 -1
  43. package/dist/types/common.js.map +1 -1
  44. package/package.json +7 -47
  45. package/src/components/StylesProviderAgentWorkplace/StylesProviderAgentWorkplace.tsx +15 -0
  46. package/src/components/StylesProviderAgentWorkplace/index.tsx +1 -0
  47. package/src/components/StylesProviderBrokerWorkplace/StylesProviderBrokerWorkplace.tsx +15 -0
  48. package/src/components/StylesProviderBrokerWorkplace/index.tsx +1 -0
  49. package/src/components/StylesProviderDemo/brandsCss.ts +13 -10
  50. package/src/components/StylesProviderDemo/exampleCss.ts +5 -5
  51. package/src/components/Table/Table.tsx +1 -1
  52. package/{dist/styles/denali-boss.css → src/styles/example.css} +401 -384
  53. package/src/types/common.ts +2 -10
  54. package/dist/components/StylesProviderDenaliBoss/StylesProviderDenaliBoss.d.ts +0 -11
  55. package/dist/components/StylesProviderDenaliBoss/StylesProviderDenaliBoss.js +0 -14
  56. package/dist/components/StylesProviderDenaliBoss/StylesProviderDenaliBoss.js.map +0 -1
  57. package/dist/components/StylesProviderDenaliBoss/index.d.ts +0 -1
  58. package/dist/components/StylesProviderDenaliBoss/index.js +0 -2
  59. package/dist/components/StylesProviderDenaliBoss/index.js.map +0 -1
  60. package/dist/constants/brands.d.ts +0 -7
  61. package/dist/constants/brands.js +0 -43
  62. package/dist/constants/brands.js.map +0 -1
  63. package/src/components/StylesProviderDenaliBoss/StylesProviderDenaliBoss.tsx +0 -15
  64. package/src/components/StylesProviderDenaliBoss/index.tsx +0 -1
  65. package/src/constants/brands.ts +0 -49
package/dist/styles/broker-workplace.css ADDED
@@ -0,0 +1,1800 @@
1
+ /* Generated from figma export: 2026-02-02T17:54:13.533Z */
2
+
3
+ @import url('https://fonts.googleapis.com/css2?family=Inter:ital,wght@0,100..900;1,100..900&display=swap');
4
+ body {
5
+ font-family: var(--typeface);
6
+ }
7
+
8
+ :root {
9
+ /* Body/Base */
10
+ --body-base: 400 16px/24px var(--typeface);
11
+ /* Body/Base - line height */
12
+ --body-base-line-height: 24px;
13
+ /* Body/Base - size */
14
+ --body-base-size: 16px;
15
+ /* Body/Base - style */
16
+ --body-base-style: regular;
17
+ /* Body/Large */
18
+ --body-large: 400 18px/28px var(--typeface);
19
+ /* Body/Large - line height */
20
+ --body-large-line-height: 28px;
21
+ /* Body/Large - size */
22
+ --body-large-size: 18px;
23
+ /* Body/Large - style */
24
+ --body-large-style: regular;
25
+ /* Body/Small */
26
+ --body-small: 400 14px/20px var(--typeface);
27
+ /* Body/Small - line height */
28
+ --body-small-line-height: 20px;
29
+ /* Body/Small - size */
30
+ --body-small-size: 14px;
31
+ /* Body/Small - style */
32
+ --body-small-style: regular;
33
+ /* Body/X-Small */
34
+ --body-x-small: 400 12px/16px var(--typeface);
35
+ /* Body/X-Small - line height */
36
+ --body-x-small-line-height: 16px;
37
+ /* Body/X-Small - size */
38
+ --body-x-small-size: 12px;
39
+ /* Body/X-Small - style */
40
+ --body-x-small-style: regular;
41
+ /* Colors/Internal/pink-00-light - Global (primitives) */
42
+ --colors-internal-pink-00-light: #ff4f8d;
43
+ /* Colors/Internal/pink-50-dark - Global (primitives) */
44
+ --colors-internal-pink-50-dark: #802847;
45
+ /* Colors/Neutral/00 - Global (primitives) */
46
+ --colors-neutral-00: #000000;
47
+ /* Colors/Neutral/02 - Global (primitives) */
48
+ --colors-neutral-02: #050505;
49
+ /* Colors/Neutral/04 - Global (primitives) */
50
+ --colors-neutral-04: #0a0a0a;
51
+ /* Colors/Neutral/06 - Global (primitives) */
52
+ --colors-neutral-06: #0f0f0f;
53
+ /* Colors/Neutral/08 - Global (primitives) */
54
+ --colors-neutral-08: #141414;
55
+ /* Colors/Neutral/10 - Global (primitives) */
56
+ --colors-neutral-10: #1a1a1a;
57
+ /* Colors/Neutral/100 - Global (primitives) */
58
+ --colors-neutral-100: #ffffff;
59
+ /* Colors/Neutral/12 - Global (primitives) */
60
+ --colors-neutral-12: #1f1f1f;
61
+ /* Colors/Neutral/14 - Global (primitives) */
62
+ --colors-neutral-14: #242424;
63
+ /* Colors/Neutral/16 - Global (primitives) */
64
+ --colors-neutral-16: #292929;
65
+ /* Colors/Neutral/18 - Global (primitives) */
66
+ --colors-neutral-18: #2e2e2e;
67
+ /* Colors/Neutral/20 - Global (primitives) */
68
+ --colors-neutral-20: #333333;
69
+ /* Colors/Neutral/22 - Global (primitives) */
70
+ --colors-neutral-22: #383838;
71
+ /* Colors/Neutral/24 - Global (primitives) */
72
+ --colors-neutral-24: #3d3d3d;
73
+ /* Colors/Neutral/26 - Global (primitives) */
74
+ --colors-neutral-26: #424242;
75
+ /* Colors/Neutral/28 - Global (primitives) */
76
+ --colors-neutral-28: #474747;
77
+ /* Colors/Neutral/30 - Global (primitives) */
78
+ --colors-neutral-30: #4d4d4d;
79
+ /* Colors/Neutral/32 - Global (primitives) */
80
+ --colors-neutral-32: #525252;
81
+ /* Colors/Neutral/34 - Global (primitives) */
82
+ --colors-neutral-34: #575757;
83
+ /* Colors/Neutral/36 - Global (primitives) */
84
+ --colors-neutral-36: #5c5c5c;
85
+ /* Colors/Neutral/38 - Global (primitives) */
86
+ --colors-neutral-38: #616161;
87
+ /* Colors/Neutral/40 - Global (primitives) */
88
+ --colors-neutral-40: #666666;
89
+ /* Colors/Neutral/42 - Global (primitives) */
90
+ --colors-neutral-42: #6b6b6b;
91
+ /* Colors/Neutral/44 - Global (primitives) */
92
+ --colors-neutral-44: #707070;
93
+ /* Colors/Neutral/46 - Global (primitives) */
94
+ --colors-neutral-46: #757575;
95
+ /* Colors/Neutral/48 - Global (primitives) */
96
+ --colors-neutral-48: #7a7a7a;
97
+ /* Colors/Neutral/50 - Global (primitives) */
98
+ --colors-neutral-50: #808080;
99
+ /* Colors/Neutral/52 - Global (primitives) */
100
+ --colors-neutral-52: #858585;
101
+ /* Colors/Neutral/54 - Global (primitives) */
102
+ --colors-neutral-54: #8a8a8a;
103
+ /* Colors/Neutral/56 - Global (primitives) */
104
+ --colors-neutral-56: #8f8f8f;
105
+ /* Colors/Neutral/58 - Global (primitives) */
106
+ --colors-neutral-58: #949494;
107
+ /* Colors/Neutral/60 - Global (primitives) */
108
+ --colors-neutral-60: #999999;
109
+ /* Colors/Neutral/62 - Global (primitives) */
110
+ --colors-neutral-62: #9e9e9e;
111
+ /* Colors/Neutral/64 - Global (primitives) */
112
+ --colors-neutral-64: #a3a3a3;
113
+ /* Colors/Neutral/66 - Global (primitives) */
114
+ --colors-neutral-66: #a8a8a8;
115
+ /* Colors/Neutral/68 - Global (primitives) */
116
+ --colors-neutral-68: #adadad;
117
+ /* Colors/Neutral/70 - Global (primitives) */
118
+ --colors-neutral-70: #b3b3b3;
119
+ /* Colors/Neutral/72 - Global (primitives) */
120
+ --colors-neutral-72: #b8b8b8;
121
+ /* Colors/Neutral/74 - Global (primitives) */
122
+ --colors-neutral-74: #bdbdbd;
123
+ /* Colors/Neutral/76 - Global (primitives) */
124
+ --colors-neutral-76: #c2c2c2;
125
+ /* Colors/Neutral/78 - Global (primitives) */
126
+ --colors-neutral-78: #c7c7c7;
127
+ /* Colors/Neutral/80 - Global (primitives) */
128
+ --colors-neutral-80: #cccccc;
129
+ /* Colors/Neutral/82 - Global (primitives) */
130
+ --colors-neutral-82: #d1d1d1;
131
+ /* Colors/Neutral/84 - Global (primitives) */
132
+ --colors-neutral-84: #d6d6d6;
133
+ /* Colors/Neutral/86 - Global (primitives) */
134
+ --colors-neutral-86: #dbdbdb;
135
+ /* Colors/Neutral/88 - Global (primitives) */
136
+ --colors-neutral-88: #e0e0e0;
137
+ /* Colors/Neutral/90 - Global (primitives) */
138
+ --colors-neutral-90: #e6e6e6;
139
+ /* Colors/Neutral/92 - Global (primitives) */
140
+ --colors-neutral-92: #ebebeb;
141
+ /* Colors/Neutral/94 - Global (primitives) */
142
+ --colors-neutral-94: #f0f0f0;
143
+ /* Colors/Neutral/96 - Global (primitives) */
144
+ --colors-neutral-96: #f5f5f5;
145
+ /* Colors/Neutral/98 - Global (primitives) */
146
+ --colors-neutral-98: #fafafa;
147
+ /* Colors/Neutral/transparent - Global (primitives) */
148
+ --colors-neutral-transparent: #ffffff00;
149
+ /* Colors/System/AI-gradient/blue - Global (primitives) */
150
+ --colors-system-ai-gradient-blue: #215ecd;
151
+ /* Colors/System/AI-gradient/pink - Global (primitives) */
152
+ --colors-system-ai-gradient-pink: #c60ede;
153
+ /* Colors/System/blue-dark - Global (primitives) */
154
+ --colors-system-blue-dark: #5d92f5;
155
+ /* Colors/System/blue-dark-bg - Global (primitives) */
156
+ --colors-system-blue-dark-bg: #0e2754;
157
+ /* Colors/System/blue-light - Global (primitives) */
158
+ --colors-system-blue-light: #276ef1;
159
+ /* Colors/System/blue-light-bg - Global (primitives) */
160
+ --colors-system-blue-light-bg: #dfe9fd;
161
+ /* Colors/System/green-dark - Global (primitives) */
162
+ --colors-system-green-dark: #519f73;
163
+ /* Colors/System/green-dark-bg - Global (primitives) */
164
+ --colors-system-green-dark-bg: #0d2f1c;
165
+ /* Colors/System/green-light - Global (primitives) */
166
+ --colors-system-green-light: #258750;
167
+ /* Colors/System/green-light-bg - Global (primitives) */
168
+ --colors-system-green-light-bg: #d3e7dc;
169
+ /* Colors/System/Links/00-default-light - Global (primitives) */
170
+ --colors-system-links-00-default-light: #215ecd;
171
+ /* Colors/System/Links/10-hover-light - Global (primitives) */
172
+ --colors-system-links-10-hover-light: #1e55b9;
173
+ /* Colors/System/Links/20-press-light - Global (primitives) */
174
+ --colors-system-links-20-press-light: #1a4ba4;
175
+ /* Colors/System/Links/30-active-dark - Global (primitives) */
176
+ --colors-system-links-30-active-dark: #648edc;
177
+ /* Colors/System/Links/30-active-light - Global (primitives) */
178
+ --colors-system-links-30-active-light: #174290;
179
+ /* Colors/System/Links/40-default-dark - Global (primitives) */
180
+ --colors-system-links-40-default-dark: #7a9ee1;
181
+ /* Colors/System/Links/40-disabled-dark - Global (primitives) */
182
+ --colors-system-links-40-disabled-dark: #14387b;
183
+ /* Colors/System/Links/40-disabled-light - Global (primitives) */
184
+ --colors-system-links-40-disabled-light: #7a9ee1;
185
+ /* Colors/System/Links/50-hover-dark - Global (primitives) */
186
+ --colors-system-links-50-hover-dark: #90afe6;
187
+ /* Colors/System/Links/60-press-dark - Global (primitives) */
188
+ --colors-system-links-60-press-dark: #a6bfeb;
189
+ /* Colors/System/red-dark - Global (primitives) */
190
+ --colors-system-red-dark: #e26b7d;
191
+ /* Colors/System/red-dark-bg - Global (primitives) */
192
+ --colors-system-red-dark-bg: #4c141d;
193
+ /* Colors/System/red-light - Global (primitives) */
194
+ --colors-system-red-light: #d83a52;
195
+ /* Colors/System/red-light-bg - Global (primitives) */
196
+ --colors-system-red-light-bg: #f9e1e9;
197
+ /* Colors/System/Spectrum/Data visual/azure-400 - Global (primitives) */
198
+ --colors-system-spectrum-data-visual-azure-400: #7fc4ec;
199
+ /* Colors/System/Spectrum/Data visual/azure-700 - Global (primitives) */
200
+ --colors-system-spectrum-data-visual-azure-700: #299de0;
201
+ /* Colors/System/Spectrum/Data visual/blackrose-1200 - Global (primitives) */
202
+ --colors-system-spectrum-data-visual-blackrose-1200: #130033;
203
+ /* Colors/System/Spectrum/Data visual/blackrose-900 - Global (primitives) */
204
+ --colors-system-spectrum-data-visual-blackrose-900: #958ca3;
205
+ /* Colors/System/Spectrum/Data visual/bronze-1100 - Global (primitives) */
206
+ --colors-system-spectrum-data-visual-bronze-1100: #794b34;
207
+ /* Colors/System/Spectrum/Data visual/bronze-800 - Global (primitives) */
208
+ --colors-system-spectrum-data-visual-bronze-800: #af9385;
209
+ /* Colors/System/Spectrum/Data visual/brown-1200 - Global (primitives) */
210
+ --colors-system-spectrum-data-visual-brown-1200: #7a2a0b;
211
+ /* Colors/System/Spectrum/Data visual/brown-900 - Global (primitives) */
212
+ --colors-system-spectrum-data-visual-brown-900: #b68a79;
213
+ /* Colors/System/Spectrum/Data visual/cadet-gray-1200 - Global (primitives) */
214
+ --colors-system-spectrum-data-visual-cadet-gray-1200: #094a53;
215
+ /* Colors/System/Spectrum/Data visual/cadet-gray-900 - Global (primitives) */
216
+ --colors-system-spectrum-data-visual-cadet-gray-900: #789ba0;
217
+ /* Colors/System/Spectrum/Data visual/cooper-500 - Global (primitives) */
218
+ --colors-system-spectrum-data-visual-cooper-500: #e6b297;
219
+ /* Colors/System/Spectrum/Data visual/cooper-800 - Global (primitives) */
220
+ --colors-system-spectrum-data-visual-cooper-800: #d67e51;
221
+ /* Colors/System/Spectrum/Data visual/gold-400 - Global (primitives) */
222
+ --colors-system-spectrum-data-visual-gold-400: #cdbe80;
223
+ /* Colors/System/Spectrum/Data visual/gold-700 - Global (primitives) */
224
+ --colors-system-spectrum-data-visual-gold-700: #ab922b;
225
+ /* Colors/System/Spectrum/Data visual/Gradient/opacity-black - Global (primitives) */
226
+ --colors-system-spectrum-data-visual-gradient-opacity-black: #1f1f1f4d;
227
+ /* Colors/System/Spectrum/Data visual/Gradient/opacity-white - Global (primitives) */
228
+ --colors-system-spectrum-data-visual-gradient-opacity-white: #ffffff4d;
229
+ /* Colors/System/Spectrum/Data visual/Highlight/azure-400-opacity - Global (primitives) */
230
+ --colors-system-spectrum-data-visual-highlight-azure-400-opacity: #7fc4ec4d;
231
+ /* Colors/System/Spectrum/Data visual/Highlight/azure-700-opacity - Global (primitives) */
232
+ --colors-system-spectrum-data-visual-highlight-azure-700-opacity: #299de04d;
233
+ /* Colors/System/Spectrum/Data visual/Highlight/blackrose-1200-opacity - Global (primitives) */
234
+ --colors-system-spectrum-data-visual-highlight-blackrose-1200-opacity: #1300334d;
235
+ /* Colors/System/Spectrum/Data visual/Highlight/blackrose-900-opacity - Global (primitives) */
236
+ --colors-system-spectrum-data-visual-highlight-blackrose-900-opacity: #958ca34d;
237
+ /* Colors/System/Spectrum/Data visual/Highlight/bronze-1100-opacity - Global (primitives) */
238
+ --colors-system-spectrum-data-visual-highlight-bronze-1100-opacity: #794b344d;
239
+ /* Colors/System/Spectrum/Data visual/Highlight/bronze-800-opacity - Global (primitives) */
240
+ --colors-system-spectrum-data-visual-highlight-bronze-800-opacity: #af93854d;
241
+ /* Colors/System/Spectrum/Data visual/Highlight/brown-1200-opacity - Global (primitives) */
242
+ --colors-system-spectrum-data-visual-highlight-brown-1200-opacity: #7a2a0b4d;
243
+ /* Colors/System/Spectrum/Data visual/Highlight/brown-900-opacity - Global (primitives) */
244
+ --colors-system-spectrum-data-visual-highlight-brown-900-opacity: #b68a794d;
245
+ /* Colors/System/Spectrum/Data visual/Highlight/cadet-gray-1200-opacity - Global (primitives) */
246
+ --colors-system-spectrum-data-visual-highlight-cadet-gray-1200-opacity: #094a534d;
247
+ /* Colors/System/Spectrum/Data visual/Highlight/cadet-gray-900-opacity - Global (primitives) */
248
+ --colors-system-spectrum-data-visual-highlight-cadet-gray-900-opacity: #789ba04d;
249
+ /* Colors/System/Spectrum/Data visual/Highlight/cooper-500-opacity - Global (primitives) */
250
+ --colors-system-spectrum-data-visual-highlight-cooper-500-opacity: #e6b2974d;
251
+ /* Colors/System/Spectrum/Data visual/Highlight/cooper-800-opacity - Global (primitives) */
252
+ --colors-system-spectrum-data-visual-highlight-cooper-800-opacity: #d67e514d;
253
+ /* Colors/System/Spectrum/Data visual/Highlight/gold-400-opacity - Global (primitives) */
254
+ --colors-system-spectrum-data-visual-highlight-gold-400-opacity: #cdbe804d;
255
+ /* Colors/System/Spectrum/Data visual/Highlight/gold-700-opacity - Global (primitives) */
256
+ --colors-system-spectrum-data-visual-highlight-gold-700-opacity: #ab922b4d;
257
+ /* Colors/System/Spectrum/Data visual/Highlight/jade-600-opacity - Global (primitives) */
258
+ --colors-system-spectrum-data-visual-highlight-jade-600-opacity: #88c5af4d;
259
+ /* Colors/System/Spectrum/Data visual/Highlight/jade-900-opacity - Global (primitives) */
260
+ --colors-system-spectrum-data-visual-highlight-jade-900-opacity: #389e7a4d;
261
+ /* Colors/System/Spectrum/Data visual/Highlight/maroon-1200-opacity - Global (primitives) */
262
+ --colors-system-spectrum-data-visual-highlight-maroon-1200-opacity: #5309094d;
263
+ /* Colors/System/Spectrum/Data visual/Highlight/maroon-900-opacity - Global (primitives) */
264
+ --colors-system-spectrum-data-visual-highlight-maroon-900-opacity: #a984844d;
265
+ /* Colors/System/Spectrum/Data visual/Highlight/platinum-1000-opacity - Global (primitives) */
266
+ --colors-system-spectrum-data-visual-highlight-platinum-1000-opacity: #7f7f7f4d;
267
+ /* Colors/System/Spectrum/Data visual/Highlight/platinum-700-opacity - Global (primitives) */
268
+ --colors-system-spectrum-data-visual-highlight-platinum-700-opacity: #b2b2b24d;
269
+ /* Colors/System/Spectrum/Data visual/Highlight/sage-1200-opacity - Global (primitives) */
270
+ --colors-system-spectrum-data-visual-highlight-sage-1200-opacity: #2d33004d;
271
+ /* Colors/System/Spectrum/Data visual/Highlight/sage-900-opacity - Global (primitives) */
272
+ --colors-system-spectrum-data-visual-highlight-sage-900-opacity: #9699804d;
273
+ /* Colors/System/Spectrum/Data visual/Highlight/tanzanite-1200-opacity - Global (primitives) */
274
+ --colors-system-spectrum-data-visual-highlight-tanzanite-1200-opacity: #0a466c4d;
275
+ /* Colors/System/Spectrum/Data visual/Highlight/tanzanite-900-opacity - Global (primitives) */
276
+ --colors-system-spectrum-data-visual-highlight-tanzanite-900-opacity: #7899ae4d;
277
+ /* Colors/System/Spectrum/Data visual/Highlight/violet-1200-opacity - Global (primitives) */
278
+ --colors-system-spectrum-data-visual-highlight-violet-1200-opacity: #4334794d;
279
+ /* Colors/System/Spectrum/Data visual/Highlight/violet-900-opacity - Global (primitives) */
280
+ --colors-system-spectrum-data-visual-highlight-violet-900-opacity: #a19abc4d;
281
+ /* Colors/System/Spectrum/Data visual/jade-600 - Global (primitives) */
282
+ --colors-system-spectrum-data-visual-jade-600: #88c5af;
283
+ /* Colors/System/Spectrum/Data visual/jade-900 - Global (primitives) */
284
+ --colors-system-spectrum-data-visual-jade-900: #389e7a;
285
+ /* Colors/System/Spectrum/Data visual/maroon-1200 - Global (primitives) */
286
+ --colors-system-spectrum-data-visual-maroon-1200: #530909;
287
+ /* Colors/System/Spectrum/Data visual/maroon-900 - Global (primitives) */
288
+ --colors-system-spectrum-data-visual-maroon-900: #a98484;
289
+ /* Colors/System/Spectrum/Data visual/platinum-1000 - Global (primitives) */
290
+ --colors-system-spectrum-data-visual-platinum-1000: #7f7f7f;
291
+ /* Colors/System/Spectrum/Data visual/platinum-700 - Global (primitives) */
292
+ --colors-system-spectrum-data-visual-platinum-700: #b2b2b2;
293
+ /* Colors/System/Spectrum/Data visual/sage-1200 - Global (primitives) */
294
+ --colors-system-spectrum-data-visual-sage-1200: #2d3300;
295
+ /* Colors/System/Spectrum/Data visual/sage-900 - Global (primitives) */
296
+ --colors-system-spectrum-data-visual-sage-900: #969980;
297
+ /* Colors/System/Spectrum/Data visual/tanzanite-1200 - Global (primitives) */
298
+ --colors-system-spectrum-data-visual-tanzanite-1200: #0a466c;
299
+ /* Colors/System/Spectrum/Data visual/tanzanite-900 - Global (primitives) */
300
+ --colors-system-spectrum-data-visual-tanzanite-900: #7899ae;
301
+ /* Colors/System/Spectrum/Data visual/violet-1200 - Global (primitives) */
302
+ --colors-system-spectrum-data-visual-violet-1200: #433479;
303
+ /* Colors/System/Spectrum/Data visual/violet-900 - Global (primitives) */
304
+ --colors-system-spectrum-data-visual-violet-900: #a19abc;
305
+ /* Colors/System/Spectrum/Depth/45-blue-dark - Global (primitives) */
306
+ --colors-system-spectrum-depth-45-blue-dark: #88aff7;
307
+ /* Colors/System/Spectrum/Depth/45-green-dark - Global (primitives) */
308
+ --colors-system-spectrum-depth-45-green-dark: #87bd9f;
309
+ /* Colors/System/Spectrum/Depth/45-lime-dark - Global (primitives) */
310
+ --colors-system-spectrum-depth-45-lime-dark: #dce28f;
311
+ /* Colors/System/Spectrum/Depth/45-magenta-dark - Global (primitives) */
312
+ --colors-system-spectrum-depth-45-magenta-dark: #e07aed;
313
+ /* Colors/System/Spectrum/Depth/45-orange-dark - Global (primitives) */
314
+ --colors-system-spectrum-depth-45-orange-dark: #f6a874;
315
+ /* Colors/System/Spectrum/Depth/45-pink-dark - Global (primitives) */
316
+ --colors-system-spectrum-depth-45-pink-dark: #ea86b9;
317
+ /* Colors/System/Spectrum/Depth/45-purple-dark - Global (primitives) */
318
+ --colors-system-spectrum-depth-45-purple-dark: #c8a6f9;
319
+ /* Colors/System/Spectrum/Depth/45-red-dark - Global (primitives) */
320
+ --colors-system-spectrum-depth-45-red-dark: #ea93a0;
321
+ /* Colors/System/Spectrum/Depth/45-teal-dark - Global (primitives) */
322
+ --colors-system-spectrum-depth-45-teal-dark: #74bbb4;
323
+ /* Colors/System/Spectrum/Depth/45-yellow-dark - Global (primitives) */
324
+ --colors-system-spectrum-depth-45-yellow-dark: #fada8d;
325
+ /* Colors/System/Spectrum/Depth/50-blue-light - Global (primitives) */
326
+ --colors-system-spectrum-depth-50-blue-light: #143778;
327
+ /* Colors/System/Spectrum/Depth/50-green-light - Global (primitives) */
328
+ --colors-system-spectrum-depth-50-green-light: #134428;
329
+ /* Colors/System/Spectrum/Depth/50-lime-light - Global (primitives) */
330
+ --colors-system-spectrum-depth-50-lime-light: #60651a;
331
+ /* Colors/System/Spectrum/Depth/50-magenta-light - Global (primitives) */
332
+ --colors-system-spectrum-depth-50-magenta-light: #63076f;
333
+ /* Colors/System/Spectrum/Depth/50-orange-light - Global (primitives) */
334
+ --colors-system-spectrum-depth-50-orange-light: #773001;
335
+ /* Colors/System/Spectrum/Depth/50-pink-light - Global (primitives) */
336
+ --colors-system-spectrum-depth-50-pink-light: #6c1240;
337
+ /* Colors/System/Spectrum/Depth/50-purple-light - Global (primitives) */
338
+ --colors-system-spectrum-depth-50-purple-light: #310077;
339
+ /* Colors/System/Spectrum/Depth/50-red-light - Global (primitives) */
340
+ --colors-system-spectrum-depth-50-red-light: #6c1d29;
341
+ /* Colors/System/Spectrum/Depth/50-teal-light - Global (primitives) */
342
+ --colors-system-spectrum-depth-50-teal-light: #01413c;
343
+ /* Colors/System/Spectrum/Depth/50-yellow-light - Global (primitives) */
344
+ --colors-system-spectrum-depth-50-yellow-light: #7b5e18;
345
+ /* Colors/System/Spectrum/Highlight/65-blue-dark - Global (primitives) */
346
+ --colors-system-spectrum-highlight-65-blue-dark: #0e2754;
347
+ /* Colors/System/Spectrum/Highlight/65-green-dark - Global (primitives) */
348
+ --colors-system-spectrum-highlight-65-green-dark: #0d2f1c;
349
+ /* Colors/System/Spectrum/Highlight/65-lime-dark - Global (primitives) */
350
+ --colors-system-spectrum-highlight-65-lime-dark: #434712;
351
+ /* Colors/System/Spectrum/Highlight/65-magenta-dark - Global (primitives) */
352
+ --colors-system-spectrum-highlight-65-magenta-dark: #45054e;
353
+ /* Colors/System/Spectrum/Highlight/65-orange-dark - Global (primitives) */
354
+ --colors-system-spectrum-highlight-65-orange-dark: #532201;
355
+ /* Colors/System/Spectrum/Highlight/65-pink-dark - Global (primitives) */
356
+ --colors-system-spectrum-highlight-65-pink-dark: #4c0c2d;
357
+ /* Colors/System/Spectrum/Highlight/65-purple-dark - Global (primitives) */
358
+ --colors-system-spectrum-highlight-65-purple-dark: #220053;
359
+ /* Colors/System/Spectrum/Highlight/65-red-dark - Global (primitives) */
360
+ --colors-system-spectrum-highlight-65-red-dark: #4c141d;
361
+ /* Colors/System/Spectrum/Highlight/65-teal-dark - Global (primitives) */
362
+ --colors-system-spectrum-highlight-65-teal-dark: #012e2a;
363
+ /* Colors/System/Spectrum/Highlight/65-yellow-dark - Global (primitives) */
364
+ --colors-system-spectrum-highlight-65-yellow-dark: #564210;
365
+ /* Colors/System/Spectrum/Highlight/85-blue-light - Global (primitives) */
366
+ --colors-system-spectrum-highlight-85-blue-light: #dfe9fd;
367
+ /* Colors/System/Spectrum/Highlight/85-green-light - Global (primitives) */
368
+ --colors-system-spectrum-highlight-85-green-light: #deede5;
369
+ /* Colors/System/Spectrum/Highlight/85-lime-light - Global (primitives) */
370
+ --colors-system-spectrum-highlight-85-lime-light: #f6f7e0;
371
+ /* Colors/System/Spectrum/Highlight/85-magenta-light - Global (primitives) */
372
+ --colors-system-spectrum-highlight-85-magenta-light: #f6dbfa;
373
+ /* Colors/System/Spectrum/Highlight/85-orange-light - Global (primitives) */
374
+ --colors-system-spectrum-highlight-85-orange-light: #fce7d9;
375
+ /* Colors/System/Spectrum/Highlight/85-pink-light - Global (primitives) */
376
+ --colors-system-spectrum-highlight-85-pink-light: #f9deec;
377
+ /* Colors/System/Spectrum/Highlight/85-purple-light - Global (primitives) */
378
+ --colors-system-spectrum-highlight-85-purple-light: #e7d9fc;
379
+ /* Colors/System/Spectrum/Highlight/85-red-light - Global (primitives) */
380
+ --colors-system-spectrum-highlight-85-red-light: #f9e1e5;
381
+ /* Colors/System/Spectrum/Highlight/85-teal-light - Global (primitives) */
382
+ --colors-system-spectrum-highlight-85-teal-light: #d9eceb;
383
+ /* Colors/System/Spectrum/Highlight/85-yellow-light - Global (primitives) */
384
+ --colors-system-spectrum-highlight-85-yellow-light: #fef5e0;
385
+ /* Colors/System/Spectrum/Vibrant/00-blue-light - Global (primitives) */
386
+ --colors-system-spectrum-vibrant-00-blue-light: #276ef1;
387
+ /* Colors/System/Spectrum/Vibrant/00-green-light - Global (primitives) */
388
+ --colors-system-spectrum-vibrant-00-green-light: #258750;
389
+ /* Colors/System/Spectrum/Vibrant/00-lime-light - Global (primitives) */
390
+ --colors-system-spectrum-vibrant-00-lime-light: #c0ca33;
391
+ /* Colors/System/Spectrum/Vibrant/00-magenta-light - Global (primitives) */
392
+ --colors-system-spectrum-vibrant-00-magenta-light: #c60ede;
393
+ /* Colors/System/Spectrum/Vibrant/00-orange-light - Global (primitives) */
394
+ --colors-system-spectrum-vibrant-00-orange-light: #ee6002;
395
+ /* Colors/System/Spectrum/Vibrant/00-pink-light - Global (primitives) */
396
+ --colors-system-spectrum-vibrant-00-pink-light: #d82380;
397
+ /* Colors/System/Spectrum/Vibrant/00-purple-light - Global (primitives) */
398
+ --colors-system-spectrum-vibrant-00-purple-light: #6200ee;
399
+ /* Colors/System/Spectrum/Vibrant/00-red-light - Global (primitives) */
400
+ --colors-system-spectrum-vibrant-00-red-light: #d83a52;
401
+ /* Colors/System/Spectrum/Vibrant/00-teal-light - Global (primitives) */
402
+ --colors-system-spectrum-vibrant-00-teal-light: #038377;
403
+ /* Colors/System/Spectrum/Vibrant/00-yellow-light - Global (primitives) */
404
+ --colors-system-spectrum-vibrant-00-yellow-light: #f6bc2f;
405
+ /* Colors/System/Spectrum/Vibrant/40-blue-dark - Global (primitives) */
406
+ --colors-system-spectrum-vibrant-40-blue-dark: #5d92f5;
407
+ /* Colors/System/Spectrum/Vibrant/40-green-dark - Global (primitives) */
408
+ --colors-system-spectrum-vibrant-40-green-dark: #7cb796;
409
+ /* Colors/System/Spectrum/Vibrant/40-lime-dark - Global (primitives) */
410
+ --colors-system-spectrum-vibrant-40-lime-dark: #d9df85;
411
+ /* Colors/System/Spectrum/Vibrant/40-magenta-dark - Global (primitives) */
412
+ --colors-system-spectrum-vibrant-40-magenta-dark: #dd6eeb;
413
+ /* Colors/System/Spectrum/Vibrant/40-orange-dark - Global (primitives) */
414
+ --colors-system-spectrum-vibrant-40-orange-dark: #f5a067;
415
+ /* Colors/System/Spectrum/Vibrant/40-pink-dark - Global (primitives) */
416
+ --colors-system-spectrum-vibrant-40-pink-dark: #e87bb3;
417
+ /* Colors/System/Spectrum/Vibrant/40-purple-dark - Global (primitives) */
418
+ --colors-system-spectrum-vibrant-40-purple-dark: #a166f5;
419
+ /* Colors/System/Spectrum/Vibrant/40-red-dark - Global (primitives) */
420
+ --colors-system-spectrum-vibrant-40-red-dark: #e88997;
421
+ /* Colors/System/Spectrum/Vibrant/40-teal-dark - Global (primitives) */
422
+ --colors-system-spectrum-vibrant-40-teal-dark: #68b5ad;
423
+ /* Colors/System/Spectrum/Vibrant/40-yellow-dark - Global (primitives) */
424
+ --colors-system-spectrum-vibrant-40-yellow-dark: #fad782;
425
+ /* Colors/System/Visited links/00-default-light - Global (primitives) */
426
+ --colors-system-visited-links-00-default-light: #7a3e7a;
427
+ /* Colors/System/Visited links/30-active-dark - Global (primitives) */
428
+ --colors-system-visited-links-30-active-dark: #a278a2;
429
+ /* Colors/System/Visited links/30-active-light - Global (primitives) */
430
+ --colors-system-visited-links-30-active-light: #552b55;
431
+ /* Colors/System/Visited links/40-default-dark - Global (primitives) */
432
+ --colors-system-visited-links-40-default-dark: #af8baf;
433
+ /* Colors/System/Visited links/40-disabled-dark - Global (primitives) */
434
+ --colors-system-visited-links-40-disabled-dark: #492549;
435
+ /* Colors/System/Visited links/40-disabled-light - Global (primitives) */
436
+ --colors-system-visited-links-40-disabled-light: #af8baf;
437
+ /* Colors/System/yellow-dark - Global (primitives) */
438
+ --colors-system-yellow-dark: #f8cd63;
439
+ /* Colors/System/yellow-dark-bg - Global (primitives) */
440
+ --colors-system-yellow-dark-bg: #564210;
441
+ /* Colors/System/yellow-light - Global (primitives) */
442
+ --colors-system-yellow-light: #f6bc2f;
443
+ /* Colors/System/yellow-light-bg - Global (primitives) */
444
+ --colors-system-yellow-light-bg: #fef5e0;
445
+ /* Corner radius/120 - Global (primitives) */
446
+ --corner-radius-120: 12px;
447
+ /* Corner radius/160 - Global (primitives) */
448
+ --corner-radius-160: 16px;
449
+ /* Corner radius/40 - Global (primitives) */
450
+ --corner-radius-40: 4px;
451
+ /* Corner radius/80 - Global (primitives) */
452
+ --corner-radius-80: 8px;
453
+ /* Corner radius/circular - Global (primitives) */
454
+ --corner-radius-circular: 999px;
455
+ /* Corner radius/None - Global (primitives) */
456
+ --corner-radius-none: 0;
457
+ /* East - navigation rails, drawers, sheets */
458
+ --drop-shadow-east: 2px 0px 8px -2px #0000001a, 2px 0px 4px -2px #0000001f;
459
+ /* Float */
460
+ --drop-shadow-float: 0px 0px 1px 0px #00000052, 0px 8px 12px 0px #00000026;
461
+ /* North - Bottom navigation, button dock, bottom sheet */
462
+ --drop-shadow-north: 0px -2px 8px -2px #0000001a, 0px -2px 4px -2px #0000001f;
463
+ /* Raise */
464
+ --drop-shadow-raise: 0px 0px 1px 0px #00000026, 0px 1px 1px 0px #00000052;
465
+ /* Scroll */
466
+ --drop-shadow-scroll: 0px 0px 3px 0px #00000052;
467
+ /* South - top navigation */
468
+ --drop-shadow-south: 0px 2px 8px -2px #0000001a, 0px 2px 4px -2px #0000001f;
469
+ /* West - side sheets */
470
+ --drop-shadow-west: -8px 0px 8px -2px #0000001a, -5px 4px 4px -6px #00000026;
471
+ /* Interactions/opacity-black-10 - Global (primitives) */
472
+ --interactions-opacity-black-10: #0000001a;
473
+ /* Interactions/opacity-black-16 - Global (primitives) */
474
+ --interactions-opacity-black-16: #00000029;
475
+ /* Interactions/opacity-black-20 - Global (primitives) */
476
+ --interactions-opacity-black-20: #00000033;
477
+ /* Interactions/opacity-black-30 - Global (primitives) */
478
+ --interactions-opacity-black-30: #0000004d;
479
+ /* Interactions/opacity-black-6 - Global (primitives) */
480
+ --interactions-opacity-black-6: #0000000f;
481
+ /* Interactions/opacity-black-8 - Global (primitives) */
482
+ --interactions-opacity-black-8: #00000014;
483
+ /* Interactions/opacity-white-10 - Global (primitives) */
484
+ --interactions-opacity-white-10: #ffffff1a;
485
+ /* Interactions/opacity-white-16 - Global (primitives) */
486
+ --interactions-opacity-white-16: #ffffff29;
487
+ /* Interactions/opacity-white-20 - Global (primitives) */
488
+ --interactions-opacity-white-20: #ffffff33;
489
+ /* Interactions/opacity-white-30 - Global (primitives) */
490
+ --interactions-opacity-white-30: #ffffff4d;
491
+ /* Interactions/opacity-white-6 - Global (primitives) */
492
+ --interactions-opacity-white-6: #ffffff0f;
493
+ /* Interactions/opacity-white-8 - Global (primitives) */
494
+ --interactions-opacity-white-8: #ffffff14;
495
+ /* Colors/Brands/BRAND/Interactions/primary-dark-opacity-10 - Global (primitives) */
496
+ --interactions-primary-dark-opacity-10: #7574821a;
497
+ /* Colors/Brands/BRAND/Interactions/primary-dark-opacity-12 - Global (primitives) */
498
+ --interactions-primary-dark-opacity-12: #7574821f;
499
+ /* Colors/Brands/BRAND/Interactions/primary-dark-opacity-16 - Global (primitives) */
500
+ --interactions-primary-dark-opacity-16: #75748229;
501
+ /* Colors/Brands/BRAND/Interactions/primary-dark-opacity-20 - Global (primitives) */
502
+ --interactions-primary-dark-opacity-20: #75748233;
503
+ /* Colors/Brands/BRAND/Interactions/primary-dark-opacity-8 - Global (primitives) */
504
+ --interactions-primary-dark-opacity-8: #75748214;
505
+ /* Colors/Brands/BRAND/Interactions/primary-light-opacity-10 - Global (primitives) */
506
+ --interactions-primary-light-opacity-10: #19172f1a;
507
+ /* Colors/Brands/BRAND/Interactions/primary-light-opacity-12 - Global (primitives) */
508
+ --interactions-primary-light-opacity-12: #19172f1f;
509
+ /* Colors/Brands/BRAND/Interactions/primary-light-opacity-16 - Global (primitives) */
510
+ --interactions-primary-light-opacity-16: #19172f29;
511
+ /* Colors/Brands/BRAND/Interactions/primary-light-opacity-20 - Global (primitives) */
512
+ --interactions-primary-light-opacity-20: #19172f33;
513
+ /* Colors/Brands/BRAND/Interactions/primary-light-opacity-8 - Global (primitives) */
514
+ --interactions-primary-light-opacity-8: #19172f14;
515
+ /* Labels/Base */
516
+ --labels-base: 500 16px/24px var(--typeface);
517
+ /* Labels/Base - line height */
518
+ --labels-base-line-height: 24px;
519
+ /* Labels/Base - size */
520
+ --labels-base-size: 16px;
521
+ /* Labels/Base - style */
522
+ --labels-base-style: medium;
523
+ /* Labels/Large */
524
+ --labels-large: 500 18px/28px var(--typeface);
525
+ /* Labels/Large - line height */
526
+ --labels-large-line-height: 28px;
527
+ /* Labels/Large - size */
528
+ --labels-large-size: 18px;
529
+ /* Labels/Large - style */
530
+ --labels-large-style: medium;
531
+ /* Labels/Small */
532
+ --labels-small: 500 14px/20px var(--typeface);
533
+ /* Labels/Small - line height */
534
+ --labels-small-line-height: 20px;
535
+ /* Labels/Small - size */
536
+ --labels-small-size: 14px;
537
+ /* Labels/Small - style */
538
+ --labels-small-style: medium;
539
+ /* Labels/X-Small */
540
+ --labels-x-small: 500 12px/16px var(--typeface);
541
+ /* Labels/X-Small - line height */
542
+ --labels-x-small-line-height: 16px;
543
+ /* Labels/X-Small - size */
544
+ --labels-x-small-size: 12px;
545
+ /* Labels/X-Small - style */
546
+ --labels-x-small-style: medium;
547
+ /* Colors/Brands/BRAND/Primary/00-base - Global (primitives) */
548
+ --primary-00-base: #19172f;
549
+ /* Colors/Brands/BRAND/Primary/15-dark - Global (primitives) */
550
+ --primary-15-dark: #151428;
551
+ /* Colors/Brands/BRAND/Primary/40-light - Global (primitives) */
552
+ --primary-40-light: #757482;
553
+ /* Colors/Brands/BRAND/Primary/55-light - Global (primitives) */
554
+ --primary-55-light: #9897a1;
555
+ /* Colors/Brands/BRAND/Primary/75-dark - Global (primitives) */
556
+ --primary-75-dark: #06060c;
557
+ /* Colors/Brands/BRAND/Primary/85-light - Global (primitives) */
558
+ --primary-85-light: #dddce0;
559
+ /* Radius/full - Borders */
560
+ --radius-full: 999px;
561
+ /* Radius/lg - Borders */
562
+ --radius-lg: 12px;
563
+ /* Radius/md - Borders */
564
+ --radius-md: 8px;
565
+ /* Radius/none - Borders */
566
+ --radius-none: 0;
567
+ /* Radius/sm - Borders */
568
+ --radius-sm: 4px;
569
+ /* Radius/xlg - Borders */
570
+ --radius-xlg: 16px;
571
+ /* Colors/Brands/BRAND/Secondary/00-base - Global (primitives) */
572
+ --secondary-00-base: #eb672f;
573
+ /* Colors/Brands/BRAND/Secondary/15-dark - Global (primitives) */
574
+ --secondary-15-dark: #c85828;
575
+ /* Colors/Brands/BRAND/Secondary/40-light - Global (primitives) */
576
+ --secondary-40-light: #f3a482;
577
+ /* Colors/Brands/BRAND/Secondary/55-light - Global (primitives) */
578
+ --secondary-55-light: #f6bba1;
579
+ /* Colors/Brands/BRAND/Secondary/75-dark - Global (primitives) */
580
+ --secondary-75-dark: #3b1a0c;
581
+ /* Colors/Brands/BRAND/Secondary/85-light - Global (primitives) */
582
+ --secondary-85-light: #fce8e0;
583
+ /* Shadows/Inner-Shadow-black-100 - Global (primitives) */
584
+ --shadows-inner-shadow-black-100: #000000;
585
+ /* Shadows/Inner-Shadow-white-100 - Global (primitives) */
586
+ --shadows-inner-shadow-white-100: #ffffff;
587
+ /* Shadows/Shadow-black-10 - Global (primitives) */
588
+ --shadows-shadow-black-10: #0000001a;
589
+ /* Shadows/Shadow-black-12 - Global (primitives) */
590
+ --shadows-shadow-black-12: #0000001f;
591
+ /* Shadows/Shadow-black-15 - Global (primitives) */
592
+ --shadows-shadow-black-15: #00000026;
593
+ /* Shadows/Shadow-black-25 - Global (primitives) */
594
+ --shadows-shadow-black-25: #00000040;
595
+ /* Shadows/Shadow-black-32 - Global (primitives) */
596
+ --shadows-shadow-black-32: #00000052;
597
+ /* Shadows/Shadow-black-50 - Global (primitives) */
598
+ --shadows-shadow-black-50: #00000080;
599
+ /* Shadows/Shadow-gray-10 - Global (primitives) */
600
+ --shadows-shadow-gray-10: #6161611a;
601
+ /* Shadows/Shadow-gray-12 - Global (primitives) */
602
+ --shadows-shadow-gray-12: #6161611f;
603
+ /* Shadows/Shadow-gray-15 - Global (primitives) */
604
+ --shadows-shadow-gray-15: #61616126;
605
+ /* Shadows/Shadow-gray-25 - Global (primitives) */
606
+ --shadows-shadow-gray-25: #61616140;
607
+ /* Shadows/Shadow-gray-32 - Global (primitives) */
608
+ --shadows-shadow-gray-32: #61616152;
609
+ /* Shadows/Shadow-gray-50 - Global (primitives) */
610
+ --shadows-shadow-gray-50: #61616180;
611
+ /* Spacing/sizing-01 - Spacing & Sizing */
612
+ --spacing-sizing-01: 4px;
613
+ /* Spacing/sizing-02 - Spacing & Sizing */
614
+ --spacing-sizing-02: 8px;
615
+ /* Spacing/sizing-03 - Spacing & Sizing */
616
+ --spacing-sizing-03: 12px;
617
+ /* Spacing/sizing-04 - Spacing & Sizing */
618
+ --spacing-sizing-04: 16px;
619
+ /* Spacing/sizing-05 - Spacing & Sizing */
620
+ --spacing-sizing-05: 20px;
621
+ /* Spacing/sizing-06 - Spacing & Sizing */
622
+ --spacing-sizing-06: 24px;
623
+ /* Spacing/sizing-07 - Spacing & Sizing */
624
+ --spacing-sizing-07: 28px;
625
+ /* Spacing/sizing-08 - Spacing & Sizing */
626
+ --spacing-sizing-08: 32px;
627
+ /* Spacing/sizing-09 - Spacing & Sizing */
628
+ --spacing-sizing-09: 36px;
629
+ /* Spacing/sizing-10 - Spacing & Sizing */
630
+ --spacing-sizing-10: 40px;
631
+ /* Spacing/sizing-11 - Spacing & Sizing */
632
+ --spacing-sizing-11: 44px;
633
+ /* Spacing/sizing-12 - Spacing & Sizing */
634
+ --spacing-sizing-12: 48px;
635
+ /* Spacing/sizing-13 - Spacing & Sizing */
636
+ --spacing-sizing-13: 52px;
637
+ /* Spacing/sizing-14 - Spacing & Sizing */
638
+ --spacing-sizing-14: 56px;
639
+ /* Spacing/sizing-15 - Spacing & Sizing */
640
+ --spacing-sizing-15: 60px;
641
+ /* Spacing/sizing-16 - Spacing & Sizing */
642
+ --spacing-sizing-16: 64px;
643
+ /* Spacing/sizing-17 - Spacing & Sizing */
644
+ --spacing-sizing-17: 68px;
645
+ /* Spacing/sizing-18 - Spacing & Sizing */
646
+ --spacing-sizing-18: 72px;
647
+ /* Spacing/sizing-19 - Spacing & Sizing */
648
+ --spacing-sizing-19: 80px;
649
+ /* Spacing/sizing-20 - Spacing & Sizing */
650
+ --spacing-sizing-20: 96px;
651
+ /* Spacing/sizing-21 - Spacing & Sizing */
652
+ --spacing-sizing-21: 104px;
653
+ /* Spacing/sizing-22 - Spacing & Sizing */
654
+ --spacing-sizing-22: 120px;
655
+ /* Spacing/sizing-23 - Spacing & Sizing */
656
+ --spacing-sizing-23: 128px;
657
+ /* Spacing/sizing-24 - Spacing & Sizing */
658
+ --spacing-sizing-24: 148px;
659
+ /* Spacing/sizing-25 - Spacing & Sizing */
660
+ --spacing-sizing-25: 152px;
661
+ /* Spacing/sizing-none - Spacing & Sizing */
662
+ --spacing-sizing-none: 0;
663
+ /* Spacings/1040 - Global (primitives) */
664
+ --spacings-1040: 104px;
665
+ /* Spacings/120 - Global (primitives) */
666
+ --spacings-120: 12px;
667
+ /* Spacings/1200 - Global (primitives) */
668
+ --spacings-1200: 120px;
669
+ /* Spacings/1280 - Global (primitives) */
670
+ --spacings-1280: 128px;
671
+ /* Spacings/1480 - Global (primitives) */
672
+ --spacings-1480: 148px;
673
+ /* Spacings/1520 - Global (primitives) */
674
+ --spacings-1520: 152px;
675
+ /* Spacings/160 - Global (primitives) */
676
+ --spacings-160: 16px;
677
+ /* Spacings/200 - Global (primitives) */
678
+ --spacings-200: 20px;
679
+ /* Spacings/240 - Global (primitives) */
680
+ --spacings-240: 24px;
681
+ /* Spacings/280 - Global (primitives) */
682
+ --spacings-280: 28px;
683
+ /* Spacings/320 - Global (primitives) */
684
+ --spacings-320: 32px;
685
+ /* Spacings/360 - Global (primitives) */
686
+ --spacings-360: 36px;
687
+ /* Spacings/40 - Global (primitives) */
688
+ --spacings-40: 4px;
689
+ /* Spacings/400 - Global (primitives) */
690
+ --spacings-400: 40px;
691
+ /* Spacings/440 - Global (primitives) */
692
+ --spacings-440: 44px;
693
+ /* Spacings/480 - Global (primitives) */
694
+ --spacings-480: 48px;
695
+ /* Spacings/520 - Global (primitives) */
696
+ --spacings-520: 52px;
697
+ /* Spacings/560 - Global (primitives) */
698
+ --spacings-560: 56px;
699
+ /* Spacings/600 - Global (primitives) */
700
+ --spacings-600: 60px;
701
+ /* Spacings/640 - Global (primitives) */
702
+ --spacings-640: 64px;
703
+ /* Spacings/680 - Global (primitives) */
704
+ --spacings-680: 68px;
705
+ /* Spacings/720 - Global (primitives) */
706
+ --spacings-720: 72px;
707
+ /* Spacings/80 - Global (primitives) */
708
+ --spacings-80: 8px;
709
+ /* Spacings/800 - Global (primitives) */
710
+ --spacings-800: 80px;
711
+ /* Spacings/960 - Global (primitives) */
712
+ --spacings-960: 96px;
713
+ /* Spacings/None - Global (primitives) */
714
+ --spacings-none: 0;
715
+ /* Stroke/none - Borders */
716
+ --stroke-none: 0;
717
+ /* Stroke/thick - Borders */
718
+ --stroke-thick: 2px;
719
+ /* Stroke/thicker - Borders */
720
+ --stroke-thicker: 4px;
721
+ /* Stroke/thin - Borders */
722
+ --stroke-thin: 1px;
723
+ /* Typeface - Brand */
724
+ --typeface: 'Inter', sans-serif;
725
+ /* Typography/Line-height/lh-1 - Global (primitives) */
726
+ --typography-line-height-lh-1: 16px;
727
+ /* Typography/Line-height/lh-10 - Global (primitives) */
728
+ --typography-line-height-lh-10: 48px;
729
+ /* Typography/Line-height/lh-11 - Global (primitives) */
730
+ --typography-line-height-lh-11: 56px;
731
+ /* Typography/Line-height/lh-12 - Global (primitives) */
732
+ --typography-line-height-lh-12: 60px;
733
+ /* Typography/Line-height/lh-13 - Global (primitives) */
734
+ --typography-line-height-lh-13: 64px;
735
+ /* Typography/Line-height/lh-14 - Global (primitives) */
736
+ --typography-line-height-lh-14: 72px;
737
+ /* Typography/Line-height/lh-15 - Global (primitives) */
738
+ --typography-line-height-lh-15: 88px;
739
+ /* Typography/Line-height/lh-2 - Global (primitives) */
740
+ --typography-line-height-lh-2: 20px;
741
+ /* Typography/Line-height/lh-3 - Global (primitives) */
742
+ --typography-line-height-lh-3: 22px;
743
+ /* Typography/Line-height/lh-4 - Global (primitives) */
744
+ --typography-line-height-lh-4: 24px;
745
+ /* Typography/Line-height/lh-5 - Global (primitives) */
746
+ --typography-line-height-lh-5: 28px;
747
+ /* Typography/Line-height/lh-6 - Global (primitives) */
748
+ --typography-line-height-lh-6: 32px;
749
+ /* Typography/Line-height/lh-7 - Global (primitives) */
750
+ --typography-line-height-lh-7: 36px;
751
+ /* Typography/Line-height/lh-8 - Global (primitives) */
752
+ --typography-line-height-lh-8: 40px;
753
+ /* Typography/Line-height/lh-9 - Global (primitives) */
754
+ --typography-line-height-lh-9: 44px;
755
+ /* Typography/Size/base - Global (primitives) */
756
+ --typography-size-base: 16px;
757
+ /* Typography/Size/bp-md - Global (primitives) */
758
+ --typography-size-bp-md: 18px;
759
+ /* Typography/Size/d-lg-m - Global (primitives) */
760
+ --typography-size-d-lg-m: 64px;
761
+ /* Typography/Size/d-lg (old) - Global (primitives) */
762
+ --typography-size-d-lg-old: 60px;
763
+ /* Typography/Size/d-md-m - Global (primitives) */
764
+ --typography-size-d-md-m: 56px;
765
+ /* Typography/Size/d-md (old) - Global (primitives) */
766
+ --typography-size-d-md-old: 52px;
767
+ /* Typography/Size/d-sm-m - Global (primitives) */
768
+ --typography-size-d-sm-m: 48px;
769
+ /* Typography/Size/d-sm (old) - Global (primitives) */
770
+ --typography-size-d-sm-old: 44px;
771
+ /* Typography/Size/lg-xlg - Global (primitives) */
772
+ --typography-size-lg-xlg: 28px;
773
+ /* Typography/Size/md-mdp - Global (primitives) */
774
+ --typography-size-md-mdp: 20px;
775
+ /* Typography/Size/mdp-lg - Global (primitives) */
776
+ --typography-size-mdp-lg: 24px;
777
+ /* Typography/Size/sm - Global (primitives) */
778
+ --typography-size-sm: 14px;
779
+ /* Typography/Size/xlg-xxlg - Global (primitives) */
780
+ --typography-size-xlg-xxlg: 32px;
781
+ /* Typography/Size/xs - Global (primitives) */
782
+ --typography-size-xs: 12px;
783
+ /* Typography/Size/xxlg-xxxlg - Global (primitives) */
784
+ --typography-size-xxlg-xxxlg: 36px;
785
+ /* Typography/Size/xxxlg - Global (primitives) */
786
+ --typography-size-xxxlg: 40px;
787
+ /* Typography/Typeface/Arial - Global (primitives) */
788
+ --typography-typeface-arial: 'Arial';
789
+ /* Typography/Typeface/Geist - Global (primitives) */
790
+ --typography-typeface-geist: 'Geist';
791
+ /* Typography/Typeface/Helvetica - Global (primitives) */
792
+ --typography-typeface-helvetica: 'Helvetica';
793
+ /* Typography/Typeface/Inter - Global (primitives) */
794
+ --typography-typeface-inter: 'Inter';
795
+ /* Typography/Typeface/Lato - Global (primitives) */
796
+ --typography-typeface-lato: 'Lato';
797
+ /* Typography/Typeface/Manrope - Global (primitives) */
798
+ --typography-typeface-manrope: 'Manrope';
799
+ /* Typography/Typeface/Open Sans - Global (primitives) */
800
+ --typography-typeface-open-sans: 'Open Sans';
801
+ /* Typography/Typeface/Red Hat Text - Global (primitives) */
802
+ --typography-typeface-red-hat-text: 'Red Hat Text';
803
+ /* Typography/Typeface/Roboto - Global (primitives) */
804
+ --typography-typeface-roboto: 'Roboto';
805
+ /* Typography/Typeface/SF Pro - Global (primitives) */
806
+ --typography-typeface-sf-pro: 'SF Pro';
807
+ /* Typography/Typeface/Typold - Global (primitives) */
808
+ --typography-typeface-typold: 'Typold';
809
+ /* Typography/Typeface/Work Sans - Global (primitives) */
810
+ --typography-typeface-work-sans: 'Work Sans';
811
+ /* Typography/Weight/300 - Global (primitives) */
812
+ --typography-weight-300: 300;
813
+ /* Typography/Weight/400 - Global (primitives) */
814
+ --typography-weight-400: 400;
815
+ /* Typography/Weight/500 - Global (primitives) */
816
+ --typography-weight-500: 500;
817
+ /* Typography/Weight/600 - Global (primitives) */
818
+ --typography-weight-600: 600;
819
+ /* Mobile/Display/Regular/Large */
820
+ --display-regular-large: 400 56px/72px var(--typeface);
821
+ /* Mobile/Display/Regular/Large - line height */
822
+ --display-regular-large-line-height: 72px;
823
+ /* Mobile/Display/Regular/Large - size */
824
+ --display-regular-large-size: 56px;
825
+ /* Mobile/Display/Regular/Large - style */
826
+ --display-regular-large-style: regular;
827
+ /* Mobile/Display/Regular/Medium */
828
+ --display-regular-medium: 400 48px/60px var(--typeface);
829
+ /* Mobile/Display/Regular/Medium - line height */
830
+ --display-regular-medium-line-height: 60px;
831
+ /* Mobile/Display/Regular/Medium - size */
832
+ --display-regular-medium-size: 48px;
833
+ /* Mobile/Display/Regular/Medium - style */
834
+ --display-regular-medium-style: regular;
835
+ /* Mobile/Display/Regular/Small */
836
+ --display-regular-small: 400 40px/48px var(--typeface);
837
+ /* Mobile/Display/Regular/Small - line height */
838
+ --display-regular-small-line-height: 48px;
839
+ /* Mobile/Display/Regular/Small - size */
840
+ --display-regular-small-size: 40px;
841
+ /* Mobile/Display/Regular/Small - style */
842
+ --display-regular-small-style: regular;
843
+ /* Mobile/Display/Semibold/Large */
844
+ --display-semibold-large: 600 56px/72px var(--typeface);
845
+ /* Mobile/Display/Semibold/Large - line height */
846
+ --display-semibold-large-line-height: 72px;
847
+ /* Mobile/Display/Semibold/Large - size */
848
+ --display-semibold-large-size: 56px;
849
+ /* Mobile/Display/Semibold/Large - style */
850
+ --display-semibold-large-style: 600;
851
+ /* Mobile/Display/Semibold/Medium */
852
+ --display-semibold-medium: 600 48px/60px var(--typeface);
853
+ /* Mobile/Display/Semibold/Medium - line height */
854
+ --display-semibold-medium-line-height: 60px;
855
+ /* Mobile/Display/Semibold/Medium - size */
856
+ --display-semibold-medium-size: 48px;
857
+ /* Mobile/Display/Semibold/Medium - style */
858
+ --display-semibold-medium-style: 600;
859
+ /* Mobile/Display/Semibold/Small */
860
+ --display-semibold-small: 600 40px/48px var(--typeface);
861
+ /* Mobile/Display/Semibold/Small - line height */
862
+ --display-semibold-small-line-height: 48px;
863
+ /* Mobile/Display/Semibold/Small - size */
864
+ --display-semibold-small-size: 40px;
865
+ /* Mobile/Display/Semibold/Small - style */
866
+ --display-semibold-small-style: 600;
867
+ /* Mobile/Heading/H1 - Large Headline */
868
+ --heading-h1: 600 32px/40px var(--typeface);
869
+ /* Mobile/Heading/H1 - Large Headline line height */
870
+ --heading-h1-line-height: 40px;
871
+ /* Mobile/Heading/H1 - Large Headline size */
872
+ --heading-h1-size: 32px;
873
+ /* Mobile/Heading/H1 - Large Headline style */
874
+ --heading-h1-style: 600;
875
+ /* Mobile/Heading/H2 - Headline */
876
+ --heading-h2: 600 28px/36px var(--typeface);
877
+ /* Mobile/Heading/H2 - Headline line height */
878
+ --heading-h2-line-height: 36px;
879
+ /* Mobile/Heading/H2 - Headline size */
880
+ --heading-h2-size: 28px;
881
+ /* Mobile/Heading/H2 - Headline style */
882
+ --heading-h2-style: 600;
883
+ /* Mobile/Heading/H3 - Headline */
884
+ --heading-h3: 600 24px/32px var(--typeface);
885
+ /* Mobile/Heading/H3 - Headline line height */
886
+ --heading-h3-line-height: 32px;
887
+ /* Mobile/Heading/H3 - Headline size */
888
+ --heading-h3-size: 24px;
889
+ /* Mobile/Heading/H3 - Headline style */
890
+ --heading-h3-style: 600;
891
+ /* Mobile/Heading/H4 - Headline */
892
+ --heading-h4: 600 20px/28px var(--typeface);
893
+ /* Mobile/Heading/H4 - Headline line height */
894
+ --heading-h4-line-height: 28px;
895
+ /* Mobile/Heading/H4 - Headline size */
896
+ --heading-h4-size: 20px;
897
+ /* Mobile/Heading/H4 - Headline style */
898
+ --heading-h4-style: 600;
899
+ /* Mobile/Heading/H5 */
900
+ --heading-h5: 600 18px/24px var(--typeface);
901
+ /* Mobile/Heading/H5 - line height */
902
+ --heading-h5-line-height: 24px;
903
+ /* Mobile/Heading/H5 - size */
904
+ --heading-h5-size: 18px;
905
+ /* Mobile/Heading/H5 - style */
906
+ --heading-h5-style: 600;
907
+ /* Mobile/Heading/H6 */
908
+ --heading-h6: 500 16px/20px var(--typeface);
909
+ /* Mobile/Heading/H6 - line height */
910
+ --heading-h6-line-height: 20px;
911
+ /* Mobile/Heading/H6 - size */
912
+ --heading-h6-size: 16px;
913
+ /* Mobile/Heading/H6 - style */
914
+ --heading-h6-style: medium;
915
+ /* Mobile/Subheader/Large - Headline */
916
+ --subheader-large: 400 20px/28px var(--typeface);
917
+ /* Mobile/Subheader/Large - Headline line height */
918
+ --subheader-large-line-height: 28px;
919
+ /* Mobile/Subheader/Large - Headline size */
920
+ --subheader-large-size: 20px;
921
+ /* Mobile/Subheader/Large - Headline style */
922
+ --subheader-large-style: regular;
923
+ /* Mobile/Subheader/Medium - Headline */
924
+ --subheader-medium: 400 18px/24px var(--typeface);
925
+ /* Mobile/Subheader/Medium - Headline line height */
926
+ --subheader-medium-line-height: 24px;
927
+ /* Mobile/Subheader/Medium - Headline size */
928
+ --subheader-medium-size: 18px;
929
+ /* Mobile/Subheader/Medium - Headline style */
930
+ --subheader-medium-style: regular;
931
+ /* Mobile/Subheader/X-Large - Headline */
932
+ --subheader-x-large: 400 24px/32px var(--typeface);
933
+ /* Mobile/Subheader/X-Large - Headline line height */
934
+ --subheader-x-large-line-height: 32px;
935
+ /* Mobile/Subheader/X-Large - Headline size */
936
+ --subheader-x-large-size: 24px;
937
+ /* Mobile/Subheader/X-Large - Headline style */
938
+ --subheader-x-large-style: regular;
939
+ /* Mobile/Subheader/XX-Large - Large Headline */
940
+ --subheader-xx-large: 400 28px/36px var(--typeface);
941
+ /* Mobile/Subheader/XX-Large - Large Headline line height */
942
+ --subheader-xx-large-line-height: 36px;
943
+ /* Mobile/Subheader/XX-Large - Large Headline size */
944
+ --subheader-xx-large-size: 28px;
945
+ /* Mobile/Subheader/XX-Large - Large Headline style */
946
+ --subheader-xx-large-style: regular;
947
+ /* Mobile/Subheader/XXX-Large - Large Headline */
948
+ --subheader-xxx-large: 400 32px/40px var(--typeface);
949
+ /* Mobile/Subheader/XXX-Large - Large Headline line height */
950
+ --subheader-xxx-large-line-height: 40px;
951
+ /* Mobile/Subheader/XXX-Large - Large Headline size */
952
+ --subheader-xxx-large-size: 32px;
953
+ /* Mobile/Subheader/XXX-Large - Large Headline style */
954
+ --subheader-xxx-large-style: regular;
955
+ /* light theme (default) */
956
+ /* Background/base - Theme - BRAND */
957
+ --background-base: #ffffff;
958
+ /* Background/scrim - Theme - BRAND */
959
+ --background-scrim: #00000040;
960
+ /* Background/shade - Theme - BRAND */
961
+ --background-shade: #f5f5f5;
962
+ /* Data visual/category-01 - Brand */
963
+ --data-visual-category-01: #d67e51;
964
+ /* Data visual/category-01-highlight - Brand */
965
+ --data-visual-category-01-highlight: #d67e514d;
966
+ /* Data visual/category-02 - Brand */
967
+ --data-visual-category-02: #7a2a0b;
968
+ /* Data visual/category-02-highlight - Brand */
969
+ --data-visual-category-02-highlight: #7a2a0b4d;
970
+ /* Data visual/category-03 - Brand */
971
+ --data-visual-category-03: #ab922b;
972
+ /* Data visual/category-03-highlight - Brand */
973
+ --data-visual-category-03-highlight: #ab922b4d;
974
+ /* Data visual/category-04 - Brand */
975
+ --data-visual-category-04: #2d3300;
976
+ /* Data visual/category-04-highlight - Brand */
977
+ --data-visual-category-04-highlight: #2d33004d;
978
+ /* Data visual/category-05 - Brand */
979
+ --data-visual-category-05: #794b34;
980
+ /* Data visual/category-05-highlight - Brand */
981
+ --data-visual-category-05-highlight: #794b344d;
982
+ /* Data visual/category-06 - Brand */
983
+ --data-visual-category-06: #7f7f7f;
984
+ /* Data visual/category-06-highlight - Brand */
985
+ --data-visual-category-06-highlight: #7f7f7f4d;
986
+ /* Data visual/category-07 - Brand */
987
+ --data-visual-category-07: #530909;
988
+ /* Data visual/category-07-highlight - Brand */
989
+ --data-visual-category-07-highlight: #5309094d;
990
+ /* Data visual/category-1 - Theme - BRAND */
991
+ --data-visual-category-1: #7a2a0b;
992
+ /* Data visual/category-1-highlight - Theme - BRAND */
993
+ --data-visual-category-1-highlight: #7a2a0b4d;
994
+ /* Data visual/category-2 - Theme - BRAND */
995
+ --data-visual-category-2: #d67e51;
996
+ /* Data visual/category-2-highlight - Theme - BRAND */
997
+ --data-visual-category-2-highlight: #d67e514d;
998
+ /* Data visual/category-3 - Theme - BRAND */
999
+ --data-visual-category-3: #2d3300;
1000
+ /* Data visual/category-3-highlight - Theme - BRAND */
1001
+ --data-visual-category-3-highlight: #2d33004d;
1002
+ /* Data visual/category-4 - Theme - BRAND */
1003
+ --data-visual-category-4: #ab922b;
1004
+ /* Data visual/category-4-highlight - Theme - BRAND */
1005
+ --data-visual-category-4-highlight: #ab922b4d;
1006
+ /* Data visual/category-5 - Theme - BRAND */
1007
+ --data-visual-category-5: #530909;
1008
+ /* Data visual/category-5-highlight - Theme - BRAND */
1009
+ --data-visual-category-5-highlight: #5309094d;
1010
+ /* Data visual/category-6 - Theme - BRAND */
1011
+ --data-visual-category-6: #7f7f7f;
1012
+ /* Data visual/category-6-highlight - Theme - BRAND */
1013
+ --data-visual-category-6-highlight: #7f7f7f4d;
1014
+ /* Data visual/category-7 - Theme - BRAND */
1015
+ --data-visual-category-7: #794b34;
1016
+ /* Data visual/category-7-highlight - Theme - BRAND */
1017
+ --data-visual-category-7-highlight: #794b344d;
1018
+ /* Data visual/gradient-end - Theme - BRAND */
1019
+ --data-visual-gradient-end: #ffffff4d;
1020
+ /* Data visual/green - Theme - BRAND */
1021
+ --data-visual-green: #258750;
1022
+ /* Data visual/green-highlight - Theme - BRAND */
1023
+ --data-visual-green-highlight: #deede5;
1024
+ /* Data visual/negative - Brand */
1025
+ --data-visual-negative: #d83a52;
1026
+ /* Data visual/negative-highlight - Brand */
1027
+ --data-visual-negative-highlight: #f9e1e5;
1028
+ /* Data visual/positive - Brand */
1029
+ --data-visual-positive: #258750;
1030
+ /* Data visual/positive-highlight - Brand */
1031
+ --data-visual-positive-highlight: #deede5;
1032
+ /* Data visual/red - Theme - BRAND */
1033
+ --data-visual-red: #d83a52;
1034
+ /* Data visual/red-highlight - Theme - BRAND */
1035
+ --data-visual-red-highlight: #f9e1e5;
1036
+ /* Foreground/AI-powered/blue - Theme - BRAND */
1037
+ --foreground-ai-powered-blue: #215ecd;
1038
+ /* Foreground/AI-powered/pink - Theme - BRAND */
1039
+ --foreground-ai-powered-pink: #c60ede;
1040
+ /* Foreground/Brand/on-inverse-primary - Theme - BRAND */
1041
+ --foreground-brand-on-inverse-primary: #757482;
1042
+ /* Foreground/Brand/on-inverse-secondary - Theme - BRAND */
1043
+ --foreground-brand-on-inverse-secondary: #f3a482;
1044
+ /* Foreground/Brand/on-brand-primary - Theme - BRAND */
1045
+ /* Foreground color used on Brand's primary color (non neutral color) */
1046
+ --foreground-brand-on-primary: #ffffff;
1047
+ /* Foreground/Brand/on-brand-secondary - Theme - BRAND */
1048
+ /* Foreground color used on Brand's primary color (non neutral color) */
1049
+ --foreground-brand-on-secondary: #ffffff;
1050
+ /* Foreground/Brand/brand-primary - Theme - BRAND */
1051
+ /* Foreground text and icons that match the brand's primary color */
1052
+ --foreground-brand-primary: #19172f;
1053
+ /* Foreground/Brand/brand-primary-depth - Theme - BRAND */
1054
+ --foreground-brand-primary-depth: #151428;
1055
+ /* Foreground/Brand/brand-secondary - Theme - BRAND */
1056
+ /* Foreground text and icons that match the brand's secondary color */
1057
+ --foreground-brand-secondary: #eb672f;
1058
+ /* Foreground/Brand/brand-secondary-depth - Theme - BRAND */
1059
+ --foreground-brand-secondary-depth: #c85828;
1060
+ /* Foreground/Link text/default - Theme - BRAND */
1061
+ --foreground-link-text-default: #215ecd;
1062
+ /* Foreground/Link text/default-disabled - Theme - BRAND */
1063
+ --foreground-link-text-default-disabled: #7a9ee1;
1064
+ /* Foreground/Link text/default-hovered - Theme - BRAND */
1065
+ --foreground-link-text-default-hovered: #1e55b9;
1066
+ /* Foreground/Link text/default-pressed - Theme - BRAND */
1067
+ --foreground-link-text-default-pressed: #1a4ba4;
1068
+ /* Foreground/Link text/default-visited - Theme - BRAND */
1069
+ --foreground-link-text-default-visited: #7a3e7a;
1070
+ /* Foreground/Link text/subtle-disabled - Brand */
1071
+ --foreground-link-text-subtle-disabled: #bdbdbd;
1072
+ /* Foreground/Link text/subtle-hovered - Theme - BRAND */
1073
+ --foreground-link-text-subtle-hovered: #292929;
1074
+ /* Foreground/Link text/subtle-inverse-hovered - Theme - BRAND */
1075
+ --foreground-link-text-subtle-inverse-hovered: #e6e6e6;
1076
+ /* Foreground/Link text/subtle-inverse-pressed - Theme - BRAND */
1077
+ --foreground-link-text-subtle-inverse-pressed: #d1d1d1;
1078
+ /* Foreground/Link text/subtle-inversed-disabled - Brand */
1079
+ --foreground-link-text-subtle-inversed-disabled: #757575;
1080
+ /* Foreground/Link text/subtle-pressed - Theme - BRAND */
1081
+ --foreground-link-text-subtle-pressed: #3d3d3d;
1082
+ /* Foreground/Neutral/disabled-on-color-surface - Theme - BRAND */
1083
+ --foreground-neutral-disabled-on-color-surface: #757575;
1084
+ /* Foreground/Neutral/disabled-on-surface - Theme - BRAND */
1085
+ --foreground-neutral-disabled-on-surface: #bdbdbd;
1086
+ /* Foreground/Neutral/inverse-on-surface - Theme - BRAND */
1087
+ --foreground-neutral-inverse-on-surface: #fafafa;
1088
+ /* Foreground/Neutral/on-color - Theme - BRAND */
1089
+ /* Interactive controls */
1090
+ --foreground-neutral-on-color: #ffffff;
1091
+ /* Foreground/Neutral/on-inverse-surface - Brand */
1092
+ /* Text and icons against inverse surface */
1093
+ --foreground-neutral-on-inverse-surface: #fafafa;
1094
+ /* Foreground/Neutral/on-surface - Theme - BRAND */
1095
+ /* Default foreground text and icons against any surface color */
1096
+ --foreground-neutral-on-surface: #141414;
1097
+ /* Foreground/Neutral/on-surface-variant-01 - Theme - BRAND */
1098
+ /* Secondary foreground color for icons and text */
1099
+ --foreground-neutral-on-surface-variant-01: #707070;
1100
+ /* Foreground/Neutral/on-surface-variant-02 - Theme - BRAND */
1101
+ /* Tertiary foreground color for icons and text */
1102
+ --foreground-neutral-on-surface-variant-02: #757575;
1103
+ /* Foreground/Neutral/on-surface-variant-03 - Theme - BRAND */
1104
+ /* Quaternary foreground color for icons and text. Only for placeholder text */
1105
+ --foreground-neutral-on-surface-variant-03: #8a8a8a;
1106
+ /* Foreground/Neutral/skeleton-element - Theme - BRAND */
1107
+ --foreground-neutral-skeleton-element: #e0e0e0;
1108
+ /* Foreground/Spectrum/blue - Theme - BRAND */
1109
+ --foreground-spectrum-blue: #143778;
1110
+ /* Foreground/Spectrum/green - Theme - BRAND */
1111
+ --foreground-spectrum-green: #134428;
1112
+ /* Foreground/Spectrum/lime - Theme - BRAND */
1113
+ --foreground-spectrum-lime: #60651a;
1114
+ /* Foreground/Spectrum/magenta - Theme - BRAND */
1115
+ --foreground-spectrum-magenta: #63076f;
1116
+ /* Foreground/Spectrum/orange - Theme - BRAND */
1117
+ --foreground-spectrum-orange: #773001;
1118
+ /* Foreground/Spectrum/pink - Theme - BRAND */
1119
+ --foreground-spectrum-pink: #6c1240;
1120
+ /* Foreground/Spectrum/purple - Theme - BRAND */
1121
+ --foreground-spectrum-purple: #310077;
1122
+ /* Foreground/Spectrum/red - Theme - BRAND */
1123
+ --foreground-spectrum-red: #6c1d29;
1124
+ /* Foreground/Spectrum/teal - Theme - BRAND */
1125
+ --foreground-spectrum-teal: #01413c;
1126
+ /* Foreground/Spectrum/yellow - Theme - BRAND */
1127
+ --foreground-spectrum-yellow: #7b5e18;
1128
+ /* Interactions/brand-disabled-opacity - Theme - BRAND */
1129
+ --interactions-brand-disabled-opacity: #0000000f;
1130
+ /* Interactions/brand-hover-opacity - Theme - BRAND */
1131
+ --interactions-brand-hover-opacity: #0000001a;
1132
+ /* Interactions/brand-press-opacity - Theme - BRAND */
1133
+ --interactions-brand-press-opacity: #00000033;
1134
+ /* Interactions/disabled-opacity - Theme - BRAND */
1135
+ --interactions-disabled-opacity: #0000000f;
1136
+ /* Interactions/hover-opacity - Theme - BRAND */
1137
+ --interactions-hover-opacity: #00000014;
1138
+ /* Interactions/link-active-opacity - Theme - BRAND */
1139
+ --interactions-link-active-opacity: #0000004d;
1140
+ /* Interactions/neutral-hover-opacity - Brand */
1141
+ /* surfaces using neutral tones */
1142
+ --interactions-neutral-hover-opacity: #0000001a;
1143
+ /* Interactions/neutral-press-opacity - Brand */
1144
+ /* surfaces using neutral tones */
1145
+ --interactions-neutral-press-opacity: #00000029;
1146
+ /* Interactions/press-opacity - Theme - BRAND */
1147
+ --interactions-press-opacity: #00000029;
1148
+ /* Interactions/primary-disabled-opacity - Theme - BRAND */
1149
+ --interactions-primary-disabled-opacity: #19172f1f;
1150
+ /* Interactions/primary-hover-opacity - Theme - BRAND */
1151
+ --interactions-primary-hover-opacity: #19172f1a;
1152
+ /* Interactions/primary-press-opacity - Theme - BRAND */
1153
+ --interactions-primary-press-opacity: #19172f33;
1154
+ /* Shadow/shadow-10 - Theme - BRAND */
1155
+ --shadow-10: #0000001a;
1156
+ /* Shadow/shadow-12 - Theme - BRAND */
1157
+ --shadow-12: #0000001f;
1158
+ /* Shadow/shadow-15 - Theme - BRAND */
1159
+ --shadow-15: #00000026;
1160
+ /* Shadow/shadow-25 - Theme - BRAND */
1161
+ --shadow-25: #00000040;
1162
+ /* Shadow/shadow-32 - Theme - BRAND */
1163
+ --shadow-32: #00000052;
1164
+ /* Shadow/inner-shadow - Brand */
1165
+ --shadow-inner: #ffffff;
1166
+ /* Shadow/inner-shadow-100 - Theme - BRAND */
1167
+ --shadow-inner-100: #ffffff;
1168
+ /* Shadow/variant-01 - Brand */
1169
+ --shadow-variant-01: #0000001a;
1170
+ /* Shadow/variant-02 - Brand */
1171
+ --shadow-variant-02: #0000001f;
1172
+ /* Shadow/variant-03 - Brand */
1173
+ --shadow-variant-03: #00000026;
1174
+ /* Shadow/variant-04 - Brand */
1175
+ --shadow-variant-04: #00000040;
1176
+ /* Shadow/variant-05 - Brand */
1177
+ --shadow-variant-05: #00000052;
1178
+ /* Status/error - Theme - BRAND */
1179
+ /* Foreground error text and icons */
1180
+ --status-error: #d83a52;
1181
+ /* Status/information - Theme - BRAND */
1182
+ --status-information: #276ef1;
1183
+ /* Status/informational - Brand */
1184
+ /* Foreground informational text and icons */
1185
+ --status-informational: #276ef1;
1186
+ /* Status/on-error - Theme - BRAND */
1187
+ /* Foreground error text and icons */
1188
+ --status-on-error: #ffffff;
1189
+ /* Status/on-information - Theme - BRAND */
1190
+ --status-on-information: #ffffff;
1191
+ /* Status/on-informational - Brand */
1192
+ /* Foreground informational text and icons */
1193
+ --status-on-informational: #ffffff;
1194
+ /* Status/on-success - Theme - BRAND */
1195
+ /* Foreground success icons and text */
1196
+ --status-on-success: #ffffff;
1197
+ /* Status/on-warning - Theme - BRAND */
1198
+ /* Foreground warning icons */
1199
+ --status-on-warning: #141414;
1200
+ /* Status/success - Theme - BRAND */
1201
+ /* Foreground success icons and text */
1202
+ --status-success: #258750;
1203
+ /* Status/warning - Theme - BRAND */
1204
+ /* Foreground warning icons */
1205
+ --status-warning: #f6bc2f;
1206
+ /* Stroke/AI-powered/blue - Theme - BRAND */
1207
+ --stroke-ai-powered-blue: #215ecd;
1208
+ /* Stroke/AI-powered/pink - Theme - BRAND */
1209
+ --stroke-ai-powered-pink: #c60ede;
1210
+ /* Stroke/Brand/brand-primary - Theme - BRAND */
1211
+ /* Outline variant - decorative elements such as dividers */
1212
+ --stroke-brand-primary: #19172f;
1213
+ /* Stroke/Brand/brand-primary-depth - Theme - BRAND */
1214
+ /* Outline variant - decorative elements such as dividers */
1215
+ --stroke-brand-primary-depth: #151428;
1216
+ /* Stroke/Brand/brand-secondary - Theme - BRAND */
1217
+ --stroke-brand-secondary: #eb672f;
1218
+ /* Stroke/Brand/brand-secondary-depth - Theme - BRAND */
1219
+ --stroke-brand-secondary-depth: #c85828;
1220
+ /* Stroke/Neutral/neutral-base - Theme - BRAND */
1221
+ /* For control components */
1222
+ --stroke-neutral-base: #949494;
1223
+ /* Stroke/Neutral/disabled-dark - Brand */
1224
+ /* Disabled outline separating the fill and surface background */
1225
+ --stroke-neutral-disabled-dark: #757575;
1226
+ /* Stroke/Neutral/disabled-light - Brand */
1227
+ /* Disabled outline separating the fill and surface background */
1228
+ --stroke-neutral-disabled-light: #bdbdbd;
1229
+ /* Stroke/Neutral/focus - Brand */
1230
+ /* Highlight focus element */
1231
+ --stroke-neutral-focus: #000000;
1232
+ /* Stroke/Neutral/focus-on-inverse - Brand */
1233
+ /* Highlight focus element */
1234
+ --stroke-neutral-focus-on-inverse: #ffffff;
1235
+ /* Stroke/Neutral/neutral-high - Brand */
1236
+ --stroke-neutral-high: #141414;
1237
+ /* Stroke/Neutral/neutral-high-contrast - Theme - BRAND */
1238
+ --stroke-neutral-high-contrast: #141414;
1239
+ /* Stroke/Neutral/Interactions/disabled-dark - Theme - BRAND */
1240
+ --stroke-neutral-interactions-disabled-dark: #757575;
1241
+ /* Stroke/Neutral/Interactions/disabled-light - Theme - BRAND */
1242
+ --stroke-neutral-interactions-disabled-light: #bdbdbd;
1243
+ /* Stroke/Neutral/Interactions/focus - Theme - BRAND */
1244
+ --stroke-neutral-interactions-focus: #000000;
1245
+ /* Stroke/Neutral/Interactions/inverse-focus - Theme - BRAND */
1246
+ --stroke-neutral-interactions-inverse-focus: #ffffff;
1247
+ /* Stroke/Neutral/neutral-low - Brand */
1248
+ /* Outline variant - decorative elements such as dividers */
1249
+ --stroke-neutral-low: #e0e0e0;
1250
+ /* Stroke/Neutral/neutral-low-contrast - Theme - BRAND */
1251
+ --stroke-neutral-low-contrast: #e0e0e0;
1252
+ /* Surface/AI-powered/blue - Theme - BRAND */
1253
+ --surface-ai-powered-blue: #215ecd;
1254
+ /* Surface/AI-powered/pink - Theme - BRAND */
1255
+ --surface-ai-powered-pink: #c60ede;
1256
+ /* Surface/Brand/primary - Theme - BRAND */
1257
+ --surface-brand-primary: #19172f;
1258
+ /* Surface/Brand/primary-highlight - Theme - BRAND */
1259
+ --surface-brand-primary-highlight: #dddce0;
1260
+ /* Surface/Brand/secondary - Theme - BRAND */
1261
+ --surface-brand-secondary: #eb672f;
1262
+ /* Surface/Brand/secondary-highlight - Theme - BRAND */
1263
+ --surface-brand-secondary-highlight: #fce8e0;
1264
+ /* Surface/Neutral/Interactions/dark-disabled - Theme - BRAND */
1265
+ --surface-neutral-interactions-dark-disabled: #d6d6d6;
1266
+ /* Surface/Neutral/Interactions/light-disabled - Theme - BRAND */
1267
+ --surface-neutral-interactions-light-disabled: #f5f5f5;
1268
+ /* Surface/Neutral/inverse - Brand */
1269
+ /* Inverted. Use for toasts notification & snackbars */
1270
+ --surface-neutral-inverse: #1f1f1f;
1271
+ /* Surface/Neutral/inverse-dark - Theme - BRAND */
1272
+ --surface-neutral-inverse-dark: #1f1f1f;
1273
+ /* Surface/Neutral/inverse-light - Theme - BRAND */
1274
+ --surface-neutral-inverse-light: #ffffff;
1275
+ /* Surface/Neutral/T1-base - Theme - BRAND */
1276
+ --surface-neutral-t1-base: #ffffff;
1277
+ /* Surface/Neutral/T2-lowest - Theme - BRAND */
1278
+ --surface-neutral-t2-lowest: #f5f5f5;
1279
+ /* Surface/Neutral/T3-low - Theme - BRAND */
1280
+ /* Navigations, app bar etc */
1281
+ --surface-neutral-t3-low: #dbdbdb;
1282
+ /* Surface/Neutral/T4-high - Theme - BRAND */
1283
+ /* Navigations, app bar etc */
1284
+ --surface-neutral-t4-high: #8a8a8a;
1285
+ /* Surface/Neutral/transparent - Theme - BRAND */
1286
+ --surface-neutral-transparent: #ffffff00;
1287
+ /* Surface/Spectrum/blue - Theme - BRAND */
1288
+ --surface-spectrum-blue: #dfe9fd;
1289
+ /* Surface/Spectrum/green - Theme - BRAND */
1290
+ --surface-spectrum-green: #deede5;
1291
+ /* Surface/Spectrum/lime - Theme - BRAND */
1292
+ --surface-spectrum-lime: #f6f7e0;
1293
+ /* Surface/Spectrum/magenta - Theme - BRAND */
1294
+ --surface-spectrum-magenta: #f6dbfa;
1295
+ /* Surface/Spectrum/orange - Theme - BRAND */
1296
+ --surface-spectrum-orange: #fce7d9;
1297
+ /* Surface/Spectrum/pink - Theme - BRAND */
1298
+ --surface-spectrum-pink: #f9deec;
1299
+ /* Surface/Spectrum/purple - Theme - BRAND */
1300
+ --surface-spectrum-purple: #e7d9fc;
1301
+ /* Surface/Spectrum/red - Theme - BRAND */
1302
+ --surface-spectrum-red: #f9e1e5;
1303
+ /* Surface/Spectrum/teal - Theme - BRAND */
1304
+ --surface-spectrum-teal: #d9eceb;
1305
+ /* Surface/Spectrum/yellow - Theme - BRAND */
1306
+ --surface-spectrum-yellow: #fef5e0;
1307
+
1308
+ @media (width >= 640px) {
1309
+ /* Desktop/Display/Regular/Large - Used in landing hero or marketing sections. */
1310
+ --display-regular-large: 400 64px/88px var(--typeface);
1311
+ /* Desktop/Display/Regular/Large - Used in landing hero or marketing sections. line height */
1312
+ --display-regular-large-line-height: 88px;
1313
+ /* Desktop/Display/Regular/Large - Used in landing hero or marketing sections. size */
1314
+ --display-regular-large-size: 64px;
1315
+ /* Desktop/Display/Regular/Large - Used in landing hero or marketing sections. style */
1316
+ --display-regular-large-style: regular;
1317
+ /* Desktop/Display/Regular/Medium - Used in landing hero or marketing sections. */
1318
+ --display-regular-medium: 400 56px/72px var(--typeface);
1319
+ /* Desktop/Display/Regular/Medium - Used in landing hero or marketing sections. line height */
1320
+ --display-regular-medium-line-height: 72px;
1321
+ /* Desktop/Display/Regular/Medium - Used in landing hero or marketing sections. size */
1322
+ --display-regular-medium-size: 56px;
1323
+ /* Desktop/Display/Regular/Medium - Used in landing hero or marketing sections. style */
1324
+ --display-regular-medium-style: regular;
1325
+ /* Desktop/Display/Regular/Small - Used in landing hero or marketing sections. */
1326
+ --display-regular-small: 400 48px/60px var(--typeface);
1327
+ /* Desktop/Display/Regular/Small - Used in landing hero or marketing sections. line height */
1328
+ --display-regular-small-line-height: 60px;
1329
+ /* Desktop/Display/Regular/Small - Used in landing hero or marketing sections. size */
1330
+ --display-regular-small-size: 48px;
1331
+ /* Desktop/Display/Regular/Small - Used in landing hero or marketing sections. style */
1332
+ --display-regular-small-style: regular;
1333
+ /* Desktop/Display/SemiBold/Large - Used in landing hero or marketing sections. */
1334
+ --display-semibold-large: 600 64px/88px var(--typeface);
1335
+ /* Desktop/Display/SemiBold/Large - Used in landing hero or marketing sections. line height */
1336
+ --display-semibold-large-line-height: 88px;
1337
+ /* Desktop/Display/SemiBold/Large - Used in landing hero or marketing sections. size */
1338
+ --display-semibold-large-size: 64px;
1339
+ /* Desktop/Display/SemiBold/Large - Used in landing hero or marketing sections. style */
1340
+ --display-semibold-large-style: 600;
1341
+ /* Desktop/Display/SemiBold/Medium - Used in landing hero or marketing sections. */
1342
+ --display-semibold-medium: 600 56px/72px var(--typeface);
1343
+ /* Desktop/Display/SemiBold/Medium - Used in landing hero or marketing sections. line height */
1344
+ --display-semibold-medium-line-height: 72px;
1345
+ /* Desktop/Display/SemiBold/Medium - Used in landing hero or marketing sections. size */
1346
+ --display-semibold-medium-size: 56px;
1347
+ /* Desktop/Display/SemiBold/Medium - Used in landing hero or marketing sections. style */
1348
+ --display-semibold-medium-style: 600;
1349
+ /* Desktop/Display/SemiBold/Small - Used in landing hero or marketing sections. */
1350
+ --display-semibold-small: 600 48px/60px var(--typeface);
1351
+ /* Desktop/Display/SemiBold/Small - Used in landing hero or marketing sections. line height */
1352
+ --display-semibold-small-line-height: 60px;
1353
+ /* Desktop/Display/SemiBold/Small - Used in landing hero or marketing sections. size */
1354
+ --display-semibold-small-size: 48px;
1355
+ /* Desktop/Display/SemiBold/Small - Used in landing hero or marketing sections. style */
1356
+ --display-semibold-small-style: 600;
1357
+ /* Desktop/Heading/H1 */
1358
+ --heading-h1: 600 40px/48px var(--typeface);
1359
+ /* Desktop/Heading/H1 - line height */
1360
+ --heading-h1-line-height: 48px;
1361
+ /* Desktop/Heading/H1 - size */
1362
+ --heading-h1-size: 40px;
1363
+ /* Desktop/Heading/H1 - style */
1364
+ --heading-h1-style: 600;
1365
+ /* Desktop/Heading/H2 */
1366
+ --heading-h2: 600 32px/40px var(--typeface);
1367
+ /* Desktop/Heading/H2 - line height */
1368
+ --heading-h2-line-height: 40px;
1369
+ /* Desktop/Heading/H2 - size */
1370
+ --heading-h2-size: 32px;
1371
+ /* Desktop/Heading/H2 - style */
1372
+ --heading-h2-style: 600;
1373
+ /* Desktop/Heading/H3 */
1374
+ --heading-h3: 600 28px/36px var(--typeface);
1375
+ /* Desktop/Heading/H3 - line height */
1376
+ --heading-h3-line-height: 36px;
1377
+ /* Desktop/Heading/H3 - size */
1378
+ --heading-h3-size: 28px;
1379
+ /* Desktop/Heading/H3 - style */
1380
+ --heading-h3-style: 600;
1381
+ /* Desktop/Heading/H4 */
1382
+ --heading-h4: 600 24px/32px var(--typeface);
1383
+ /* Desktop/Heading/H4 - line height */
1384
+ --heading-h4-line-height: 32px;
1385
+ /* Desktop/Heading/H4 - size */
1386
+ --heading-h4-size: 24px;
1387
+ /* Desktop/Heading/H4 - style */
1388
+ --heading-h4-style: 600;
1389
+ /* Desktop/Heading/H5 */
1390
+ --heading-h5: 600 20px/28px var(--typeface);
1391
+ /* Desktop/Heading/H5 - line height */
1392
+ --heading-h5-line-height: 28px;
1393
+ /* Desktop/Heading/H5 - size */
1394
+ --heading-h5-size: 20px;
1395
+ /* Desktop/Heading/H5 - style */
1396
+ --heading-h5-style: 600;
1397
+ /* Desktop/Heading/H6 */
1398
+ --heading-h6: 500 18px/24px var(--typeface);
1399
+ /* Desktop/Heading/H6 - line height */
1400
+ --heading-h6-line-height: 24px;
1401
+ /* Desktop/Heading/H6 - size */
1402
+ --heading-h6-size: 18px;
1403
+ /* Desktop/Heading/H6 - style */
1404
+ --heading-h6-style: medium;
1405
+ /* Desktop/Subheader/Large - Headline */
1406
+ --subheader-large: 400 24px/32px var(--typeface);
1407
+ /* Desktop/Subheader/Large - Headline line height */
1408
+ --subheader-large-line-height: 32px;
1409
+ /* Desktop/Subheader/Large - Headline size */
1410
+ --subheader-large-size: 24px;
1411
+ /* Desktop/Subheader/Large - Headline style */
1412
+ --subheader-large-style: regular;
1413
+ /* Desktop/Subheader/Medium */
1414
+ --subheader-medium: 400 20px/28px var(--typeface);
1415
+ /* Desktop/Subheader/Medium - line height */
1416
+ --subheader-medium-line-height: 28px;
1417
+ /* Desktop/Subheader/Medium - size */
1418
+ --subheader-medium-size: 20px;
1419
+ /* Desktop/Subheader/Medium - style */
1420
+ --subheader-medium-style: regular;
1421
+ /* Desktop/Subheader/X-Large - Headline */
1422
+ --subheader-x-large: 400 28px/36px var(--typeface);
1423
+ /* Desktop/Subheader/X-Large - Headline line height */
1424
+ --subheader-x-large-line-height: 36px;
1425
+ /* Desktop/Subheader/X-Large - Headline size */
1426
+ --subheader-x-large-size: 28px;
1427
+ /* Desktop/Subheader/X-Large - Headline style */
1428
+ --subheader-x-large-style: regular;
1429
+ /* Desktop/Subheader/XX-Large - Headline */
1430
+ --subheader-xx-large: 400 32px/40px var(--typeface);
1431
+ /* Desktop/Subheader/XX-Large - Headline line height */
1432
+ --subheader-xx-large-line-height: 40px;
1433
+ /* Desktop/Subheader/XX-Large - Headline size */
1434
+ --subheader-xx-large-size: 32px;
1435
+ /* Desktop/Subheader/XX-Large - Headline style */
1436
+ --subheader-xx-large-style: regular;
1437
+ /* Desktop/Subheader/XXX-Large - Large Headline */
1438
+ --subheader-xxx-large: 400 40px/48px var(--typeface);
1439
+ /* Desktop/Subheader/XXX-Large - Large Headline line height */
1440
+ --subheader-xxx-large-line-height: 48px;
1441
+ /* Desktop/Subheader/XXX-Large - Large Headline size */
1442
+ --subheader-xxx-large-size: 40px;
1443
+ /* Desktop/Subheader/XXX-Large - Large Headline style */
1444
+ --subheader-xxx-large-style: regular;
1445
+ }
1446
+ }
1447
+ /* dark theme */
1448
+ [data-theme='dark'] {
1449
+ /* Background/base - Theme - BRAND */
1450
+ --background-base: #1f1f1f;
1451
+ /* Background/scrim - Theme - BRAND */
1452
+ --background-scrim: #61616180;
1453
+ /* Background/shade - Theme - BRAND */
1454
+ --background-shade: #292929;
1455
+ /* Data visual/category-01 - Brand */
1456
+ --data-visual-category-01: #e6b297;
1457
+ /* Data visual/category-01-highlight - Brand */
1458
+ --data-visual-category-01-highlight: #e6b2974d;
1459
+ /* Data visual/category-02 - Brand */
1460
+ --data-visual-category-02: #b68a79;
1461
+ /* Data visual/category-02-highlight - Brand */
1462
+ --data-visual-category-02-highlight: #b68a794d;
1463
+ /* Data visual/category-03 - Brand */
1464
+ --data-visual-category-03: #cdbe80;
1465
+ /* Data visual/category-03-highlight - Brand */
1466
+ --data-visual-category-03-highlight: #cdbe804d;
1467
+ /* Data visual/category-04 - Brand */
1468
+ --data-visual-category-04: #969980;
1469
+ /* Data visual/category-04-highlight - Brand */
1470
+ --data-visual-category-04-highlight: #9699804d;
1471
+ /* Data visual/category-05 - Brand */
1472
+ --data-visual-category-05: #af9385;
1473
+ /* Data visual/category-05-highlight - Brand */
1474
+ --data-visual-category-05-highlight: #af93854d;
1475
+ /* Data visual/category-06 - Brand */
1476
+ --data-visual-category-06: #b2b2b2;
1477
+ /* Data visual/category-06-highlight - Brand */
1478
+ --data-visual-category-06-highlight: #b2b2b24d;
1479
+ /* Data visual/category-07 - Brand */
1480
+ --data-visual-category-07: #a98484;
1481
+ /* Data visual/category-07-highlight - Brand */
1482
+ --data-visual-category-07-highlight: #a984844d;
1483
+ /* Data visual/category-1 - Theme - BRAND */
1484
+ --data-visual-category-1: #b68a79;
1485
+ /* Data visual/category-1-highlight - Theme - BRAND */
1486
+ --data-visual-category-1-highlight: #b68a794d;
1487
+ /* Data visual/category-2 - Theme - BRAND */
1488
+ --data-visual-category-2: #e6b297;
1489
+ /* Data visual/category-2-highlight - Theme - BRAND */
1490
+ --data-visual-category-2-highlight: #e6b2974d;
1491
+ /* Data visual/category-3 - Theme - BRAND */
1492
+ --data-visual-category-3: #969980;
1493
+ /* Data visual/category-3-highlight - Theme - BRAND */
1494
+ --data-visual-category-3-highlight: #9699804d;
1495
+ /* Data visual/category-4 - Theme - BRAND */
1496
+ --data-visual-category-4: #cdbe80;
1497
+ /* Data visual/category-4-highlight - Theme - BRAND */
1498
+ --data-visual-category-4-highlight: #cdbe804d;
1499
+ /* Data visual/category-5 - Theme - BRAND */
1500
+ --data-visual-category-5: #a98484;
1501
+ /* Data visual/category-5-highlight - Theme - BRAND */
1502
+ --data-visual-category-5-highlight: #a984844d;
1503
+ /* Data visual/category-6 - Theme - BRAND */
1504
+ --data-visual-category-6: #b2b2b2;
1505
+ /* Data visual/category-6-highlight - Theme - BRAND */
1506
+ --data-visual-category-6-highlight: #b2b2b24d;
1507
+ /* Data visual/category-7 - Theme - BRAND */
1508
+ --data-visual-category-7: #af9385;
1509
+ /* Data visual/category-7-highlight - Theme - BRAND */
1510
+ --data-visual-category-7-highlight: #af93854d;
1511
+ /* Data visual/gradient-end - Theme - BRAND */
1512
+ --data-visual-gradient-end: #1f1f1f4d;
1513
+ /* Data visual/green - Theme - BRAND */
1514
+ --data-visual-green: #7cb796;
1515
+ /* Data visual/green-highlight - Theme - BRAND */
1516
+ --data-visual-green-highlight: #0d2f1c;
1517
+ /* Data visual/negative - Brand */
1518
+ --data-visual-negative: #e88997;
1519
+ /* Data visual/negative-highlight - Brand */
1520
+ --data-visual-negative-highlight: #4c141d;
1521
+ /* Data visual/positive - Brand */
1522
+ --data-visual-positive: #7cb796;
1523
+ /* Data visual/positive-highlight - Brand */
1524
+ --data-visual-positive-highlight: #0d2f1c;
1525
+ /* Data visual/red - Theme - BRAND */
1526
+ --data-visual-red: #e88997;
1527
+ /* Data visual/red-highlight - Theme - BRAND */
1528
+ --data-visual-red-highlight: #4c141d;
1529
+ /* Foreground/AI-powered/blue - Theme - BRAND */
1530
+ --foreground-ai-powered-blue: #000000;
1531
+ /* Foreground/AI-powered/pink - Theme - BRAND */
1532
+ --foreground-ai-powered-pink: #000000;
1533
+ /* Foreground/Brand/on-inverse-primary - Theme - BRAND */
1534
+ --foreground-brand-on-inverse-primary: #757482;
1535
+ /* Foreground/Brand/on-inverse-secondary - Theme - BRAND */
1536
+ --foreground-brand-on-inverse-secondary: #f3a482;
1537
+ /* Foreground/Brand/on-brand-primary - Theme - BRAND */
1538
+ /* Foreground color used on Brand's primary color (non neutral color) */
1539
+ --foreground-brand-on-primary: #141414;
1540
+ /* Foreground/Brand/on-brand-secondary - Theme - BRAND */
1541
+ /* Foreground color used on Brand's primary color (non neutral color) */
1542
+ --foreground-brand-on-secondary: #141414;
1543
+ /* Foreground/Brand/brand-primary - Theme - BRAND */
1544
+ /* Foreground text and icons that match the brand's primary color */
1545
+ --foreground-brand-primary: #757482;
1546
+ /* Foreground/Brand/brand-primary-depth - Theme - BRAND */
1547
+ --foreground-brand-primary-depth: #9897a1;
1548
+ /* Foreground/Brand/brand-secondary - Theme - BRAND */
1549
+ /* Foreground text and icons that match the brand's secondary color */
1550
+ --foreground-brand-secondary: #f3a482;
1551
+ /* Foreground/Brand/brand-secondary-depth - Theme - BRAND */
1552
+ --foreground-brand-secondary-depth: #f6bba1;
1553
+ /* Foreground/Link text/default - Theme - BRAND */
1554
+ --foreground-link-text-default: #7a9ee1;
1555
+ /* Foreground/Link text/default-disabled - Theme - BRAND */
1556
+ --foreground-link-text-default-disabled: #14387b;
1557
+ /* Foreground/Link text/default-hovered - Theme - BRAND */
1558
+ --foreground-link-text-default-hovered: #90afe6;
1559
+ /* Foreground/Link text/default-pressed - Theme - BRAND */
1560
+ --foreground-link-text-default-pressed: #a6bfeb;
1561
+ /* Foreground/Link text/default-visited - Theme - BRAND */
1562
+ --foreground-link-text-default-visited: #af8baf;
1563
+ /* Foreground/Link text/subtle-disabled - Brand */
1564
+ --foreground-link-text-subtle-disabled: #4d4d4d;
1565
+ /* Foreground/Link text/subtle-hovered - Theme - BRAND */
1566
+ --foreground-link-text-subtle-hovered: #e6e6e6;
1567
+ /* Foreground/Link text/subtle-inverse-hovered - Theme - BRAND */
1568
+ --foreground-link-text-subtle-inverse-hovered: #e6e6e6;
1569
+ /* Foreground/Link text/subtle-inverse-pressed - Theme - BRAND */
1570
+ --foreground-link-text-subtle-inverse-pressed: #d1d1d1;
1571
+ /* Foreground/Link text/subtle-inversed-disabled - Brand */
1572
+ --foreground-link-text-subtle-inversed-disabled: #3d3d3d;
1573
+ /* Foreground/Link text/subtle-pressed - Theme - BRAND */
1574
+ --foreground-link-text-subtle-pressed: #d1d1d1;
1575
+ /* Foreground/Neutral/disabled-on-color-surface - Theme - BRAND */
1576
+ --foreground-neutral-disabled-on-color-surface: #3d3d3d;
1577
+ /* Foreground/Neutral/disabled-on-surface - Theme - BRAND */
1578
+ --foreground-neutral-disabled-on-surface: #4d4d4d;
1579
+ /* Foreground/Neutral/inverse-on-surface - Theme - BRAND */
1580
+ --foreground-neutral-inverse-on-surface: #fafafa;
1581
+ /* Foreground/Neutral/on-color - Theme - BRAND */
1582
+ /* Interactive controls */
1583
+ --foreground-neutral-on-color: #ffffff;
1584
+ /* Foreground/Neutral/on-inverse-surface - Brand */
1585
+ /* Text and icons against inverse surface */
1586
+ --foreground-neutral-on-inverse-surface: #fafafa;
1587
+ /* Foreground/Neutral/on-surface - Theme - BRAND */
1588
+ /* Default foreground text and icons against any surface color */
1589
+ --foreground-neutral-on-surface: #fafafa;
1590
+ /* Foreground/Neutral/on-surface-variant-01 - Theme - BRAND */
1591
+ /* Secondary foreground color for icons and text */
1592
+ --foreground-neutral-on-surface-variant-01: #c2c2c2;
1593
+ /* Foreground/Neutral/on-surface-variant-02 - Theme - BRAND */
1594
+ /* Tertiary foreground color for icons and text */
1595
+ --foreground-neutral-on-surface-variant-02: #9e9e9e;
1596
+ /* Foreground/Neutral/on-surface-variant-03 - Theme - BRAND */
1597
+ /* Quaternary foreground color for icons and text. Only for placeholder text */
1598
+ --foreground-neutral-on-surface-variant-03: #757575;
1599
+ /* Foreground/Neutral/skeleton-element - Theme - BRAND */
1600
+ --foreground-neutral-skeleton-element: #333333;
1601
+ /* Foreground/Spectrum/blue - Theme - BRAND */
1602
+ --foreground-spectrum-blue: #88aff7;
1603
+ /* Foreground/Spectrum/green - Theme - BRAND */
1604
+ --foreground-spectrum-green: #87bd9f;
1605
+ /* Foreground/Spectrum/lime - Theme - BRAND */
1606
+ --foreground-spectrum-lime: #dce28f;
1607
+ /* Foreground/Spectrum/magenta - Theme - BRAND */
1608
+ --foreground-spectrum-magenta: #e07aed;
1609
+ /* Foreground/Spectrum/orange - Theme - BRAND */
1610
+ --foreground-spectrum-orange: #f6a874;
1611
+ /* Foreground/Spectrum/pink - Theme - BRAND */
1612
+ --foreground-spectrum-pink: #ea86b9;
1613
+ /* Foreground/Spectrum/purple - Theme - BRAND */
1614
+ --foreground-spectrum-purple: #c8a6f9;
1615
+ /* Foreground/Spectrum/red - Theme - BRAND */
1616
+ --foreground-spectrum-red: #ea93a0;
1617
+ /* Foreground/Spectrum/teal - Theme - BRAND */
1618
+ --foreground-spectrum-teal: #74bbb4;
1619
+ /* Foreground/Spectrum/yellow - Theme - BRAND */
1620
+ --foreground-spectrum-yellow: #fada8d;
1621
+ /* Interactions/brand-disabled-opacity - Theme - BRAND */
1622
+ --interactions-brand-disabled-opacity: #ffffff0f;
1623
+ /* Interactions/brand-hover-opacity - Theme - BRAND */
1624
+ --interactions-brand-hover-opacity: #ffffff1a;
1625
+ /* Interactions/brand-press-opacity - Theme - BRAND */
1626
+ --interactions-brand-press-opacity: #ffffff33;
1627
+ /* Interactions/disabled-opacity - Theme - BRAND */
1628
+ --interactions-disabled-opacity: #ffffff0f;
1629
+ /* Interactions/hover-opacity - Theme - BRAND */
1630
+ --interactions-hover-opacity: #ffffff14;
1631
+ /* Interactions/link-active-opacity - Theme - BRAND */
1632
+ --interactions-link-active-opacity: #ffffff4d;
1633
+ /* Interactions/neutral-hover-opacity - Brand */
1634
+ /* surfaces using neutral tones */
1635
+ --interactions-neutral-hover-opacity: #ffffff1a;
1636
+ /* Interactions/neutral-press-opacity - Brand */
1637
+ /* surfaces using neutral tones */
1638
+ --interactions-neutral-press-opacity: #ffffff29;
1639
+ /* Interactions/press-opacity - Theme - BRAND */
1640
+ --interactions-press-opacity: #ffffff29;
1641
+ /* Interactions/primary-disabled-opacity - Theme - BRAND */
1642
+ --interactions-primary-disabled-opacity: #7574821f;
1643
+ /* Interactions/primary-hover-opacity - Theme - BRAND */
1644
+ --interactions-primary-hover-opacity: #7574821a;
1645
+ /* Interactions/primary-press-opacity - Theme - BRAND */
1646
+ --interactions-primary-press-opacity: #75748233;
1647
+ /* Shadow/shadow-10 - Theme - BRAND */
1648
+ --shadow-10: #6161611a;
1649
+ /* Shadow/shadow-12 - Theme - BRAND */
1650
+ --shadow-12: #6161611f;
1651
+ /* Shadow/shadow-15 - Theme - BRAND */
1652
+ --shadow-15: #61616126;
1653
+ /* Shadow/shadow-25 - Theme - BRAND */
1654
+ --shadow-25: #61616140;
1655
+ /* Shadow/shadow-32 - Theme - BRAND */
1656
+ --shadow-32: #61616152;
1657
+ /* Shadow/inner-shadow - Brand */
1658
+ --shadow-inner: #000000;
1659
+ /* Shadow/inner-shadow-100 - Theme - BRAND */
1660
+ --shadow-inner-100: #000000;
1661
+ /* Shadow/variant-01 - Brand */
1662
+ --shadow-variant-01: #6161611a;
1663
+ /* Shadow/variant-02 - Brand */
1664
+ --shadow-variant-02: #6161611f;
1665
+ /* Shadow/variant-03 - Brand */
1666
+ --shadow-variant-03: #61616126;
1667
+ /* Shadow/variant-04 - Brand */
1668
+ --shadow-variant-04: #61616140;
1669
+ /* Shadow/variant-05 - Brand */
1670
+ --shadow-variant-05: #61616152;
1671
+ /* Status/error - Theme - BRAND */
1672
+ /* Foreground error text and icons */
1673
+ --status-error: #e26b7d;
1674
+ /* Status/information - Theme - BRAND */
1675
+ --status-information: #5d92f5;
1676
+ /* Status/informational - Brand */
1677
+ /* Foreground informational text and icons */
1678
+ --status-informational: #5d92f5;
1679
+ /* Status/on-error - Theme - BRAND */
1680
+ /* Foreground error text and icons */
1681
+ --status-on-error: #ffffff;
1682
+ /* Status/on-information - Theme - BRAND */
1683
+ --status-on-information: #ffffff;
1684
+ /* Status/on-informational - Brand */
1685
+ /* Foreground informational text and icons */
1686
+ --status-on-informational: #ffffff;
1687
+ /* Status/on-success - Theme - BRAND */
1688
+ /* Foreground success icons and text */
1689
+ --status-on-success: #ffffff;
1690
+ /* Status/on-warning - Theme - BRAND */
1691
+ /* Foreground warning icons */
1692
+ --status-on-warning: #141414;
1693
+ /* Status/success - Theme - BRAND */
1694
+ /* Foreground success icons and text */
1695
+ --status-success: #519f73;
1696
+ /* Status/warning - Theme - BRAND */
1697
+ /* Foreground warning icons */
1698
+ --status-warning: #f8cd63;
1699
+ /* Stroke/AI-powered/blue - Theme - BRAND */
1700
+ --stroke-ai-powered-blue: #000000;
1701
+ /* Stroke/AI-powered/pink - Theme - BRAND */
1702
+ --stroke-ai-powered-pink: #000000;
1703
+ /* Stroke/Brand/brand-primary - Theme - BRAND */
1704
+ /* Outline variant - decorative elements such as dividers */
1705
+ --stroke-brand-primary: #757482;
1706
+ /* Stroke/Brand/brand-primary-depth - Theme - BRAND */
1707
+ /* Outline variant - decorative elements such as dividers */
1708
+ --stroke-brand-primary-depth: #9897a1;
1709
+ /* Stroke/Brand/brand-secondary - Theme - BRAND */
1710
+ --stroke-brand-secondary: #f3a482;
1711
+ /* Stroke/Brand/brand-secondary-depth - Theme - BRAND */
1712
+ --stroke-brand-secondary-depth: #f6bba1;
1713
+ /* Stroke/Neutral/neutral-base - Theme - BRAND */
1714
+ /* For control components */
1715
+ --stroke-neutral-base: #6b6b6b;
1716
+ /* Stroke/Neutral/disabled-dark - Brand */
1717
+ /* Disabled outline separating the fill and surface background */
1718
+ --stroke-neutral-disabled-dark: #3d3d3d;
1719
+ /* Stroke/Neutral/disabled-light - Brand */
1720
+ /* Disabled outline separating the fill and surface background */
1721
+ --stroke-neutral-disabled-light: #4d4d4d;
1722
+ /* Stroke/Neutral/focus - Brand */
1723
+ /* Highlight focus element */
1724
+ --stroke-neutral-focus: #ffffff;
1725
+ /* Stroke/Neutral/focus-on-inverse - Brand */
1726
+ /* Highlight focus element */
1727
+ --stroke-neutral-focus-on-inverse: #ffffff;
1728
+ /* Stroke/Neutral/neutral-high - Brand */
1729
+ --stroke-neutral-high: #fafafa;
1730
+ /* Stroke/Neutral/neutral-high-contrast - Theme - BRAND */
1731
+ --stroke-neutral-high-contrast: #fafafa;
1732
+ /* Stroke/Neutral/Interactions/disabled-dark - Theme - BRAND */
1733
+ --stroke-neutral-interactions-disabled-dark: #3d3d3d;
1734
+ /* Stroke/Neutral/Interactions/disabled-light - Theme - BRAND */
1735
+ --stroke-neutral-interactions-disabled-light: #4d4d4d;
1736
+ /* Stroke/Neutral/Interactions/focus - Theme - BRAND */
1737
+ --stroke-neutral-interactions-focus: #ffffff;
1738
+ /* Stroke/Neutral/Interactions/inverse-focus - Theme - BRAND */
1739
+ --stroke-neutral-interactions-inverse-focus: #ffffff;
1740
+ /* Stroke/Neutral/neutral-low - Brand */
1741
+ /* Outline variant - decorative elements such as dividers */
1742
+ --stroke-neutral-low: #4d4d4d;
1743
+ /* Stroke/Neutral/neutral-low-contrast - Theme - BRAND */
1744
+ --stroke-neutral-low-contrast: #4d4d4d;
1745
+ /* Surface/AI-powered/blue - Theme - BRAND */
1746
+ --surface-ai-powered-blue: #000000;
1747
+ /* Surface/AI-powered/pink - Theme - BRAND */
1748
+ --surface-ai-powered-pink: #000000;
1749
+ /* Surface/Brand/primary - Theme - BRAND */
1750
+ --surface-brand-primary: #757482;
1751
+ /* Surface/Brand/primary-highlight - Theme - BRAND */
1752
+ --surface-brand-primary-highlight: #06060c;
1753
+ /* Surface/Brand/secondary - Theme - BRAND */
1754
+ --surface-brand-secondary: #f3a482;
1755
+ /* Surface/Brand/secondary-highlight - Theme - BRAND */
1756
+ --surface-brand-secondary-highlight: #3b1a0c;
1757
+ /* Surface/Neutral/Interactions/dark-disabled - Theme - BRAND */
1758
+ --surface-neutral-interactions-dark-disabled: #474747;
1759
+ /* Surface/Neutral/Interactions/light-disabled - Theme - BRAND */
1760
+ --surface-neutral-interactions-light-disabled: #292929;
1761
+ /* Surface/Neutral/inverse - Brand */
1762
+ /* Inverted. Use for toasts notification & snackbars */
1763
+ --surface-neutral-inverse: #383838;
1764
+ /* Surface/Neutral/inverse-dark - Theme - BRAND */
1765
+ --surface-neutral-inverse-dark: #383838;
1766
+ /* Surface/Neutral/inverse-light - Theme - BRAND */
1767
+ --surface-neutral-inverse-light: #575757;
1768
+ /* Surface/Neutral/T1-base - Theme - BRAND */
1769
+ --surface-neutral-t1-base: #1f1f1f;
1770
+ /* Surface/Neutral/T2-lowest - Theme - BRAND */
1771
+ --surface-neutral-t2-lowest: #2e2e2e;
1772
+ /* Surface/Neutral/T3-low - Theme - BRAND */
1773
+ /* Navigations, app bar etc */
1774
+ --surface-neutral-t3-low: #383838;
1775
+ /* Surface/Neutral/T4-high - Theme - BRAND */
1776
+ /* Navigations, app bar etc */
1777
+ --surface-neutral-t4-high: #7a7a7a;
1778
+ /* Surface/Neutral/transparent - Theme - BRAND */
1779
+ --surface-neutral-transparent: #ffffff00;
1780
+ /* Surface/Spectrum/blue - Theme - BRAND */
1781
+ --surface-spectrum-blue: #0e2754;
1782
+ /* Surface/Spectrum/green - Theme - BRAND */
1783
+ --surface-spectrum-green: #0d2f1c;
1784
+ /* Surface/Spectrum/lime - Theme - BRAND */
1785
+ --surface-spectrum-lime: #434712;
1786
+ /* Surface/Spectrum/magenta - Theme - BRAND */
1787
+ --surface-spectrum-magenta: #45054e;
1788
+ /* Surface/Spectrum/orange - Theme - BRAND */
1789
+ --surface-spectrum-orange: #532201;
1790
+ /* Surface/Spectrum/pink - Theme - BRAND */
1791
+ --surface-spectrum-pink: #4c0c2d;
1792
+ /* Surface/Spectrum/purple - Theme - BRAND */
1793
+ --surface-spectrum-purple: #220053;
1794
+ /* Surface/Spectrum/red - Theme - BRAND */
1795
+ --surface-spectrum-red: #4c141d;
1796
+ /* Surface/Spectrum/teal - Theme - BRAND */
1797
+ --surface-spectrum-teal: #012e2a;
1798
+ /* Surface/Spectrum/yellow - Theme - BRAND */
1799
+ --surface-spectrum-yellow: #564210;
1800
+ }