@payfit/unity-themes 2.46.13 → 2.46.14

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 (37) hide show
  1. package/dist/css/fonts/heartbreak-eighties/HeartbreakEighties-Oblique.woff +0 -0
  2. package/dist/css/fonts/heartbreak-eighties/HeartbreakEighties-Oblique.woff2 +0 -0
  3. package/dist/css/fonts/heartbreak-eighties/HeartbreakEighties-Regular.woff +0 -0
  4. package/dist/css/fonts/heartbreak-eighties/HeartbreakEighties-Regular.woff2 +0 -0
  5. package/dist/css/generated/proprietary-fonts.css +11 -0
  6. package/dist/css/unity.css +1982 -0
  7. package/dist/esm/components/unity-theme-provider.d.ts +25 -0
  8. package/dist/esm/components/unity-theme-provider.js +34 -0
  9. package/dist/esm/components/unity-theme-provider.test.d.ts +1 -0
  10. package/dist/esm/index.d.ts +5 -0
  11. package/dist/esm/index.js +15 -0
  12. package/dist/esm/scripts/actions/append-animations.d.ts +3 -0
  13. package/dist/esm/scripts/actions/compose-multi-theme.d.ts +15 -0
  14. package/dist/esm/scripts/build.d.ts +1 -0
  15. package/dist/esm/scripts/file-headers/unity.d.ts +2 -0
  16. package/dist/esm/scripts/formats/processors/grid-processor.d.ts +2 -0
  17. package/dist/esm/scripts/formats/processors/typography-processor.d.ts +2 -0
  18. package/dist/esm/scripts/formats/unity-theme.d.ts +3 -0
  19. package/dist/esm/scripts/formats/utils.d.ts +3 -0
  20. package/dist/esm/scripts/transforms/oklch.d.ts +4 -0
  21. package/dist/esm/scripts/transforms/tailwind-animation-token.d.ts +6 -0
  22. package/dist/esm/scripts/transforms/tailwind-color-token.d.ts +7 -0
  23. package/dist/esm/scripts/transforms/tailwind-grid-token.d.ts +7 -0
  24. package/dist/esm/scripts/transforms/tailwind-spacing-token.d.ts +4 -0
  25. package/dist/esm/scripts/transforms/tailwind-text-token.d.ts +4 -0
  26. package/dist/esm/scripts/transforms/tailwind-typography-token.d.ts +3 -0
  27. package/dist/esm/scripts/types.d.ts +21 -0
  28. package/dist/esm/scripts/utils/prefix-transform.d.ts +4 -0
  29. package/dist/esm/utils/cn.d.ts +94 -0
  30. package/dist/esm/utils/cn.js +11 -0
  31. package/dist/esm/utils/merge-config.d.ts +217 -0
  32. package/dist/esm/utils/merge-config.js +172 -0
  33. package/dist/esm/utils/tailwind-merge.d.ts +67 -0
  34. package/dist/esm/utils/tailwind-merge.js +8 -0
  35. package/dist/esm/utils/tailwind-variants.d.ts +44 -0
  36. package/dist/esm/utils/tailwind-variants.js +9 -0
  37. package/package.json +1 -1
@@ -0,0 +1,1982 @@
1
+ /**
2
+ * =============================================================================
3
+ * Unity Themes: Default Theme
4
+ * =============================================================================
5
+ *
6
+ * @file unity.css
7
+ * @description Auto-generated CSS styles for Unity
8
+ * @copyright Copyright (c) 2025 PayFit. All rights reserved.
9
+ *
10
+ * =============================================================================
11
+ * LINKS
12
+ * =============================================================================
13
+ *
14
+ * GitHub Repository: https://github.com/PayFit/hr-apps/blob/master/libs/shared/unity/themes
15
+ * Documentation: https://unity-theme.payfit.io/?path=/docs/1-introduction-1-welcome--docs
16
+ * Issues/Support: https://payfit.atlassian.net/jira/software/c/projects/CEEFRE/boards/623
17
+ *
18
+ * =============================================================================
19
+ * NOTICE
20
+ * =============================================================================
21
+ *
22
+ * This file is auto-generated. Manual changes to this file will be overwritten
23
+ * when the build process runs again. To customize styles, please refer to the
24
+ * source files or documentation.
25
+ *
26
+ * Generated by: monorepo-root 0.0.0-use.local
27
+ */
28
+
29
+ @import "@fontsource/inter";
30
+ @import "@fontsource/inter/500.css";
31
+ @import "@fontsource/inter/600.css";
32
+ @import "@fontsource/inter/700.css";
33
+ @import "@fontsource/source-serif-4";
34
+ @import "@fontsource/source-serif-4/500.css";
35
+ @import "@fontsource/source-serif-4/600.css";
36
+ @import "@fontsource/source-serif-4/700.css";
37
+ @import "@fontsource/roboto-mono";
38
+ @import "./generated/proprietary-fonts.css";
39
+ @import "tailwindcss" prefix(uy);
40
+
41
+ @layer base {
42
+ :root,
43
+ [data-uy-theme="legacy"] {
44
+ --uy-animate-spin: 2s linear infinite spin;
45
+ --uy-animate-arc-shrink: 2s ease-in-out infinite arc-shrink;
46
+ --uy-animate-pulse: 2s cubic-bezier(0.4, 0, 0.6, 1) infinite pulse;
47
+ --uy-animate-slide: 4s cubic-bezier(1, 0, 0.36, 0.71) infinite slide;
48
+ --uy-animate-fade-in: 0.3s linear 1 fade-in;
49
+ --uy-animate-fade-out: 0.3s linear 1 fade-out;
50
+ --uy-animate-slide-right-fade-in: 0.3s ease-in 1 slide-right-fade-in;
51
+ --uy-animate-slide-right-fade-out: 0.3s ease-out 1 slide-right-fade-out;
52
+ --uy-animate-slide-up-fade-in: 0.3s ease-in 1 slide-up-fade-in;
53
+ --uy-animate-slide-down-fade-out: 0.3s ease-out 1 slide-down-fade-out;
54
+ --uy-animate-zoom-in: 0.3s ease-in 1 zoom-in;
55
+ --uy-animate-zoom-out: 0.3s ease-out 1 zoom-out;
56
+ --uy-aspect-video: 16 / 9;
57
+ --uy-aspect-square: 1 / 1;
58
+ --uy-breakpoint-sm: 490px;
59
+ --uy-breakpoint-md: 768px;
60
+ --uy-breakpoint-lg: 1280px;
61
+ --uy-breakpoint-xl: 1440px;
62
+ --uy-text-50: 12px;
63
+ --uy-text-75: 14px;
64
+ --uy-text-100: 16px;
65
+ --uy-text-200: 18px;
66
+ --uy-text-300: 20px;
67
+ --uy-text-400: 22px;
68
+ --uy-text-500: 24px;
69
+ --uy-text-600: 28px;
70
+ --uy-text-800: 30px;
71
+ --uy-text-1000: 32px;
72
+ --uy-text-1200: 38px;
73
+ --uy-text-1400: 52px;
74
+ --uy-text-1600: 66px;
75
+ --uy-font-weight-regular: 400;
76
+ --uy-font-weight-medium: 500;
77
+ --uy-font-weight-semibold: 600;
78
+ --uy-font-weight-bold: 700;
79
+ --uy-grid-layout-columns--default: 6;
80
+ --uy-grid-layout-columns--md: 12;
81
+ --uy-grid-layout-columns--lg: 12;
82
+ --uy-radius-0: 0;
83
+ --uy-radius-25: 2px;
84
+ --uy-radius-50: 4px;
85
+ --uy-radius-75: 6px;
86
+ --uy-radius-100: 8px;
87
+ --uy-radius-125: 10px;
88
+ --uy-radius-150: 12px;
89
+ --uy-radius-200: 16px;
90
+ --uy-radius-300: 24px;
91
+ --uy-radius-400: 32px;
92
+ --uy-radius-circle: 50%;
93
+ --uy-radius-pill: 9999px;
94
+ --uy-container-app-menu: 296px; /** Width of the main menu in global App layout */
95
+ --uy-container-lg: 984px; /** Maximum width for layout containers at large resolutions */
96
+ --uy-container-xl: 1360px; /** Maximum width for layout containers at extra-large resolutions */
97
+ --uy-container-content: 523px; /** Maximum width for content containers */
98
+ --uy-container-section: 703px; /** Maximum width for section containers */
99
+ --uy-container-page: 1063px; /** Maximum width for page containers */
100
+ --uy-container-app: 1439px; /** Maximum width for app containers */
101
+ --uy-spacing-0: 0;
102
+ --uy-spacing-25: 2px;
103
+ --uy-spacing-50: 4px;
104
+ --uy-spacing-75: 6px;
105
+ --uy-spacing-100: 8px;
106
+ --uy-spacing-125: 10px;
107
+ --uy-spacing-150: 12px;
108
+ --uy-spacing-200: 16px;
109
+ --uy-spacing-250: 20px;
110
+ --uy-spacing-300: 24px;
111
+ --uy-spacing-400: 32px;
112
+ --uy-spacing-500: 40px;
113
+ --uy-spacing-600: 48px;
114
+ --uy-spacing-800: 64px;
115
+ --uy-spacing-1000: 80px;
116
+ --uy-spacing: 8px; /** Base spacing value */
117
+ --uy-color-grayscale-l1: oklch(99.059% 0.0017 247.84);
118
+ --uy-color-grayscale-l2: oklch(98.22% 0.00412 271.37);
119
+ --uy-color-grayscale-l3: oklch(97.323% 0.00413 271.37);
120
+ --uy-color-grayscale-l4: oklch(95.128% 0.00745 260.73);
121
+ --uy-color-grayscale-l5: oklch(91.982% 0.00977 252.82);
122
+ --uy-color-grayscale-l6: oklch(86.339% 0.01521 251.17);
123
+ --uy-color-grayscale-l7: oklch(76.254% 0.02353 254.43);
124
+ --uy-color-grayscale-l8: oklch(65.823% 0.02505 252.27);
125
+ --uy-color-grayscale-l9: oklch(53.625% 0.02834 252.08);
126
+ --uy-color-grayscale-l10: oklch(49.112% 0.03033 253.74);
127
+ --uy-color-grayscale-l11: oklch(37.463% 0.03027 254.19);
128
+ --uy-color-grayscale-l12: oklch(16.172% 0.03703 253.15);
129
+ --uy-color-grayscale-l0: oklch(100% 0 none);
130
+ --uy-color-red-l1: oklch(98.894% 0.00534 17.247);
131
+ --uy-color-red-l2: oklch(95.657% 0.02191 10.599);
132
+ --uy-color-red-l3: oklch(89.102% 0.05813 11.703);
133
+ --uy-color-red-l4: oklch(76.425% 0.14179 14.508);
134
+ --uy-color-red-l5: oklch(66.039% 0.19306 18.401);
135
+ --uy-color-red-l6: oklch(61.565% 0.23811 24.593);
136
+ --uy-color-red-l7: oklch(57.968% 0.22848 25.303);
137
+ --uy-color-red-l8: oklch(54.299% 0.21359 25.062);
138
+ --uy-color-red-l9: oklch(49.786% 0.19508 24.828);
139
+ --uy-color-red-l10: oklch(42.146% 0.1518 22.159);
140
+ --uy-color-red-l11: oklch(31.984% 0.11081 21.252);
141
+ --uy-color-red-l12: oklch(14.815% 0.03894 14.818);
142
+ --uy-color-green-l1: oklch(99.09% 0.01311 159.93);
143
+ --uy-color-green-l2: oklch(97.628% 0.03602 155.45);
144
+ --uy-color-green-l3: oklch(93.032% 0.07653 156.15);
145
+ --uy-color-green-l4: oklch(87.477% 0.11235 154.7);
146
+ --uy-color-green-l5: oklch(82.183% 0.15332 152.92);
147
+ --uy-color-green-l6: oklch(73.532% 0.21134 147.69);
148
+ --uy-color-green-l7: oklch(69.453% 0.19894 147.76);
149
+ --uy-color-green-l8: oklch(59.644% 0.17117 147.68);
150
+ --uy-color-green-l9: oklch(50.681% 0.14238 148.18);
151
+ --uy-color-green-l10: oklch(45.284% 0.12552 148.44);
152
+ --uy-color-green-l11: oklch(38.135% 0.10324 148.99);
153
+ --uy-color-green-l12: oklch(29.078% 0.08111 149.47);
154
+ --uy-color-yellow-l1: oklch(99.339% 0.01073 95.159);
155
+ --uy-color-yellow-l2: oklch(97.51% 0.03751 93.823);
156
+ --uy-color-yellow-l3: oklch(94.386% 0.09476 96.118);
157
+ --uy-color-yellow-l4: oklch(91.334% 0.13181 94.112);
158
+ --uy-color-yellow-l5: oklch(88.467% 0.16439 92.595);
159
+ --uy-color-yellow-l6: oklch(85.747% 0.17524 88.489);
160
+ --uy-color-yellow-l7: oklch(78.825% 0.16326 80.005);
161
+ --uy-color-yellow-l8: oklch(70.863% 0.14874 76.185);
162
+ --uy-color-yellow-l9: oklch(65.58% 0.13871 74.43);
163
+ --uy-color-yellow-l10: oklch(57.086% 0.12081 74.308);
164
+ --uy-color-yellow-l11: oklch(44.005% 0.09353 73.415);
165
+ --uy-color-yellow-l12: oklch(19.304% 0.03947 87.228);
166
+ --uy-color-cyan-l1: oklch(98.251% 0.01093 225.98);
167
+ --uy-color-cyan-l2: oklch(96.793% 0.02117 223);
168
+ --uy-color-cyan-l3: oklch(92.693% 0.04939 222.46);
169
+ --uy-color-cyan-l4: oklch(88.175% 0.07902 224.08);
170
+ --uy-color-cyan-l5: oklch(85.429% 0.09702 224.9);
171
+ --uy-color-cyan-l6: oklch(81.492% 0.12112 226.94);
172
+ --uy-color-cyan-l7: oklch(72.674% 0.124 228.51);
173
+ --uy-color-cyan-l8: oklch(64.227% 0.11503 229.99);
174
+ --uy-color-cyan-l9: oklch(52.482% 0.09504 229.3);
175
+ --uy-color-cyan-l10: oklch(46.295% 0.08653 230.57);
176
+ --uy-color-cyan-l11: oklch(39.485% 0.07503 230.8);
177
+ --uy-color-cyan-l12: oklch(27.448% 0.05468 229.97);
178
+ --uy-color-blue-l1: oklch(95.332% 0.02282 252.17);
179
+ --uy-color-blue-l2: oklch(90.025% 0.04979 252.09);
180
+ --uy-color-blue-l3: oklch(76.235% 0.11994 252.37);
181
+ --uy-color-blue-l4: oklch(66.102% 0.17494 254.38);
182
+ --uy-color-blue-l5: oklch(57.397% 0.20023 257.15);
183
+ --uy-color-blue-l6: oklch(55.63% 0.18803 256.77);
184
+ --uy-color-blue-l7: oklch(50.854% 0.17021 256.62);
185
+ --uy-color-blue-l8: oklch(46.343% 0.15334 256.43);
186
+ --uy-color-blue-l9: oklch(42.818% 0.13895 256.1);
187
+ --uy-color-blue-l10: oklch(38.89% 0.12422 255.76);
188
+ --uy-color-blue-l11: oklch(30.049% 0.09294 255.42);
189
+ --uy-color-blue-l12: oklch(19.818% 0.05155 252.58);
190
+ --uy-color-purple-l1: oklch(98.727% 0.00667 295.45);
191
+ --uy-color-purple-l2: oklch(96.104% 0.02008 292.15);
192
+ --uy-color-purple-l3: oklch(86.837% 0.07043 292.06);
193
+ --uy-color-purple-l4: oklch(77.641% 0.12295 290.62);
194
+ --uy-color-purple-l5: oklch(68.949% 0.1743 288.5);
195
+ --uy-color-purple-l6: oklch(60.721% 0.22281 284.89);
196
+ --uy-color-purple-l7: oklch(52.742% 0.21026 283.76);
197
+ --uy-color-purple-l8: oklch(45.172% 0.19333 282.42);
198
+ --uy-color-purple-l9: oklch(37.908% 0.1729 281.55);
199
+ --uy-color-purple-l10: oklch(30.959% 0.14783 280.72);
200
+ --uy-color-purple-l11: oklch(26.77% 0.13374 278.97);
201
+ --uy-color-purple-l12: oklch(19.414% 0.10973 276.86);
202
+ --uy-color-plum-l1: oklch(97.96% 0.01323 340.54);
203
+ --uy-color-plum-l2: oklch(94.722% 0.03438 342.15);
204
+ --uy-color-plum-l3: oklch(89.332% 0.05898 343.24);
205
+ --uy-color-plum-l4: oklch(77.61% 0.13363 344.73);
206
+ --uy-color-plum-l5: oklch(71.011% 0.17788 346.37);
207
+ --uy-color-plum-l6: oklch(65.697% 0.21441 348.85);
208
+ --uy-color-plum-l7: oklch(62.946% 0.23091 350.49);
209
+ --uy-color-plum-l8: oklch(60.018% 0.2365 352.7);
210
+ --uy-color-plum-l9: oklch(55.392% 0.21788 352.33);
211
+ --uy-color-plum-l10: oklch(47.463% 0.17504 350.96);
212
+ --uy-color-plum-l11: oklch(35.416% 0.11019 347.55);
213
+ --uy-color-plum-l12: oklch(17.955% 0.04579 345.08);
214
+ --uy-color-peach-l1: oklch(97.27% 0.01359 34.299);
215
+ --uy-color-peach-l2: oklch(90.632% 0.04897 32.141);
216
+ --uy-color-peach-l3: oklch(82.029% 0.10207 33.458);
217
+ --uy-color-peach-l9: oklch(74.944% 0.15289 33.756);
218
+ --uy-color-peach-l10: oklch(68.145% 0.20917 33.947);
219
+ --uy-color-peach-l11: oklch(45.269% 0.14889 33.908);
220
+ --uy-color-peach-l12: oklch(22.79% 0.07583 37.262);
221
+ --uy-color-sunglow-l1: oklch(97.781% 0.02393 85.787);
222
+ --uy-color-sunglow-l2: oklch(94.597% 0.05744 85.031);
223
+ --uy-color-sunglow-l3: oklch(88.727% 0.12792 86.388);
224
+ --uy-color-sunglow-l9: oklch(82.358% 0.16964 79.247);
225
+ --uy-color-sunglow-l10: oklch(55.358% 0.10103 84.486);
226
+ --uy-color-sunglow-l11: oklch(41.232% 0.07399 83.781);
227
+ --uy-color-sunglow-l12: oklch(28.544% 0.05865 83.417);
228
+ --uy-color-teal-l1: oklch(98.741% 0.01366 196.94);
229
+ --uy-color-teal-l2: oklch(97.487% 0.01887 196.85);
230
+ --uy-color-teal-l3: oklch(94.358% 0.04709 193.11);
231
+ --uy-color-teal-l4: oklch(88.394% 0.07939 191.85);
232
+ --uy-color-teal-l5: oklch(83.893% 0.09384 191.26);
233
+ --uy-color-teal-l6: oklch(74.584% 0.12769 188.32);
234
+ --uy-color-teal-l7: oklch(70.945% 0.12073 188.56);
235
+ --uy-color-teal-l8: oklch(64.559% 0.11068 188.59);
236
+ --uy-color-teal-l9: oklch(53.208% 0.09099 187.88);
237
+ --uy-color-teal-l10: oklch(46.647% 0.07467 189.94);
238
+ --uy-color-teal-l11: oklch(39.345% 0.06605 190.42);
239
+ --uy-color-teal-l12: oklch(25.346% 0.04379 189.82);
240
+ --uy-color-orange-l1: oklch(99.087% 0.00448 34.309);
241
+ --uy-color-orange-l2: oklch(95.249% 0.02398 33.548);
242
+ --uy-color-orange-l3: oklch(89.762% 0.05397 32.365);
243
+ --uy-color-orange-l4: oklch(83.646% 0.0914 33.222);
244
+ --uy-color-orange-l5: oklch(74.944% 0.15289 33.756);
245
+ --uy-color-orange-l6: oklch(68.776% 0.18707 34.151);
246
+ --uy-color-orange-l7: oklch(65.542% 0.20292 33.582);
247
+ --uy-color-orange-l8: oklch(54.399% 0.19025 33.476);
248
+ --uy-color-orange-l9: oklch(47.762% 0.15857 33.832);
249
+ --uy-color-orange-l10: oklch(42.172% 0.12494 33.8);
250
+ --uy-color-orange-l11: oklch(28.891% 0.10112 35.093);
251
+ --uy-color-orange-l12: oklch(16.65% 0.04887 43.496);
252
+ --uy-color-utility-backdrop: oklch(16.172% 0.03703 253.15 / 0.6);
253
+ --uy-color-utility-shadow-100: oklch(0% 0 none / 0.05882);
254
+ --uy-color-utility-shadow-200: oklch(0% 0 none / 0.07843);
255
+ --uy-color-utility-shadow-300: oklch(0% 0 none / 0.07843);
256
+ --uy-color-utility-shadow-400: oklch(0% 0 none / 0.10196);
257
+ --uy-color-utility-shadow-500: oklch(0% 0 none / 0.12157);
258
+ --uy-color-utility-shadow-600: oklch(0% 0 none / 0.12157);
259
+ --uy-shadow-canvas: none;
260
+ --uy-font-serif: "Source Serif 4", serif;
261
+ --uy-font-sans: Inter, sans-serif;
262
+ --uy-font-mono: "Roboto Mono", monospace;
263
+ --uy-grid-layout-gutter--default: calc(var(--uy-spacing) * 2);
264
+ --uy-grid-layout-margin--default: calc(var(--uy-spacing) * 2);
265
+ --uy-grid-layout-gutter--md: calc(var(--uy-spacing) * 2);
266
+ --uy-grid-layout-margin--md: calc(var(--uy-spacing) * 3);
267
+ --uy-grid-layout-gutter--lg: calc(var(--uy-spacing) * 2);
268
+ --uy-grid-layout-margin--lg: calc(var(--uy-spacing) * 5);
269
+ --uy-radius-xs: var(--uy-radius-50);
270
+ --uy-radius-sm: var(--uy-radius-75);
271
+ --uy-radius-md: var(--uy-radius-100);
272
+ --uy-radius-lg: var(--uy-radius-200);
273
+ --uy-radius-xl: var(--uy-radius-300);
274
+ --uy-color-canvas: var(--uy-color-grayscale-l2);
275
+ --uy-color-surface-primary-highest: var(--uy-color-blue-l10);
276
+ --uy-color-surface-primary-high: var(--uy-color-blue-l8);
277
+ --uy-color-surface-primary: var(--uy-color-blue-l5);
278
+ --uy-color-surface-primary-enabled: var(--uy-color-blue-l5);
279
+ --uy-color-surface-primary-hover: var(--uy-color-blue-l7);
280
+ --uy-color-surface-primary-pressed: var(--uy-color-blue-l8);
281
+ --uy-color-surface-primary-focus: var(--uy-color-blue-l5);
282
+ --uy-color-surface-primary-active: var(--uy-color-blue-l5);
283
+ --uy-color-surface-primary-disabled: var(--uy-color-grayscale-l3);
284
+ --uy-color-surface-primary-low: var(--uy-color-blue-l3);
285
+ --uy-color-surface-primary-lowest: var(--uy-color-blue-l1);
286
+ --uy-color-surface-primary-lowest-enabled: var(--uy-color-blue-l1);
287
+ --uy-color-surface-primary-lowest-hover: var(--uy-color-blue-l1);
288
+ --uy-color-surface-primary-lowest-pressed: var(--uy-color-blue-l2);
289
+ --uy-color-surface-primary-lowest-focus: var(--uy-color-blue-l4);
290
+ --uy-color-surface-primary-lowest-active: var(--uy-color-blue-l1);
291
+ --uy-color-surface-primary-lowest-disabled: var(--uy-color-grayscale-l2);
292
+ --uy-color-surface-neutral: var(--uy-color-grayscale-l0);
293
+ --uy-color-surface-neutral-enabled: var(--uy-color-grayscale-l0);
294
+ --uy-color-surface-neutral-hover: var(--uy-color-grayscale-l3);
295
+ --uy-color-surface-neutral-pressed: var(--uy-color-grayscale-l4);
296
+ --uy-color-surface-neutral-focus: var(--uy-color-grayscale-l2);
297
+ --uy-color-surface-neutral-active: var(--uy-color-grayscale-l4);
298
+ --uy-color-surface-neutral-selected: var(--uy-color-grayscale-l3);
299
+ --uy-color-surface-neutral-disabled: var(--uy-color-grayscale-l4);
300
+ --uy-color-surface-neutral-low: var(--uy-color-grayscale-l3);
301
+ --uy-color-surface-neutral-low-enabled: var(--uy-color-grayscale-l3);
302
+ --uy-color-surface-neutral-low-hover: var(--uy-color-grayscale-l4);
303
+ --uy-color-surface-neutral-low-pressed: var(--uy-color-grayscale-l5);
304
+ --uy-color-surface-neutral-low-focus: var(--uy-color-grayscale-l4);
305
+ --uy-color-surface-neutral-low-active: var(--uy-color-grayscale-l5);
306
+ --uy-color-surface-neutral-low-disabled: var(--uy-color-grayscale-l3);
307
+ --uy-color-surface-neutral-low-selected: var(--uy-color-grayscale-l4);
308
+ --uy-color-surface-neutral-lowest: var(--uy-color-grayscale-l4);
309
+ --uy-color-surface-neutral-lowest-enabled: var(--uy-color-grayscale-l4);
310
+ --uy-color-surface-neutral-lowest-hover: var(--uy-color-grayscale-l5);
311
+ --uy-color-surface-neutral-lowest-pressed: var(--uy-color-grayscale-l6);
312
+ --uy-color-surface-neutral-lowest-focus: var(--uy-color-grayscale-l5);
313
+ --uy-color-surface-neutral-lowest-active: var(--uy-color-grayscale-l6);
314
+ --uy-color-surface-neutral-lowest-disabled: var(--uy-color-grayscale-l4);
315
+ --uy-color-surface-neutral-lowest-selected: var(--uy-color-grayscale-l5);
316
+ --uy-color-surface-danger: var(--uy-color-red-l7);
317
+ --uy-color-surface-danger-enabled: var(--uy-color-red-l7);
318
+ --uy-color-surface-danger-hover: var(--uy-color-red-l8);
319
+ --uy-color-surface-danger-pressed: var(--uy-color-red-l9);
320
+ --uy-color-surface-danger-focus: var(--uy-color-red-l7);
321
+ --uy-color-surface-danger-active: var(--uy-color-red-l7);
322
+ --uy-color-surface-danger-disabled: var(--uy-color-grayscale-l8);
323
+ --uy-color-surface-danger-low: var(--uy-color-red-l3);
324
+ --uy-color-surface-danger-lowest: var(--uy-color-red-l2);
325
+ --uy-color-surface-danger-lowest-enabled: var(--uy-color-red-l1);
326
+ --uy-color-surface-danger-lowest-hover: var(--uy-color-red-l2);
327
+ --uy-color-surface-danger-lowest-pressed: var(--uy-color-red-l3);
328
+ --uy-color-surface-danger-lowest-focus: var(--uy-color-grayscale-l0);
329
+ --uy-color-surface-danger-lowest-active: var(--uy-color-red-l2);
330
+ --uy-color-surface-danger-lowest-disabled: var(--uy-color-grayscale-l8);
331
+ --uy-color-surface-warning: var(--uy-color-yellow-l6);
332
+ --uy-color-surface-warning-enabled: var(--uy-color-yellow-l6);
333
+ --uy-color-surface-warning-hover: var(--uy-color-yellow-l7);
334
+ --uy-color-surface-warning-pressed: var(--uy-color-yellow-l8);
335
+ --uy-color-surface-warning-focus: var(--uy-color-yellow-l6);
336
+ --uy-color-surface-warning-active: var(--uy-color-yellow-l6);
337
+ --uy-color-surface-warning-disabled: var(--uy-color-grayscale-l8);
338
+ --uy-color-surface-warning-low: var(--uy-color-yellow-l3);
339
+ --uy-color-surface-warning-lowest: var(--uy-color-yellow-l2);
340
+ --uy-color-surface-warning-lowest-enabled: var(--uy-color-yellow-l2);
341
+ --uy-color-surface-warning-lowest-hover: var(--uy-color-yellow-l2);
342
+ --uy-color-surface-warning-lowest-pressed: var(--uy-color-yellow-l3);
343
+ --uy-color-surface-warning-lowest-focus: var(--uy-color-grayscale-l0);
344
+ --uy-color-surface-warning-lowest-active: var(--uy-color-yellow-l2);
345
+ --uy-color-surface-warning-lowest-disabled: var(--uy-color-grayscale-l8);
346
+ --uy-color-surface-success: var(--uy-color-green-l8);
347
+ --uy-color-surface-success-low: var(--uy-color-green-l3);
348
+ --uy-color-surface-success-lowest: var(--uy-color-green-l2);
349
+ --uy-color-surface-success-lowest-enabled: var(--uy-color-green-l2);
350
+ --uy-color-surface-success-lowest-hover: var(--uy-color-green-l2);
351
+ --uy-color-surface-success-lowest-pressed: var(--uy-color-green-l3);
352
+ --uy-color-surface-success-lowest-focus: var(--uy-color-green-l4);
353
+ --uy-color-surface-success-lowest-active: var(--uy-color-green-l2);
354
+ --uy-color-surface-success-lowest-disabled: var(--uy-color-grayscale-l8);
355
+ --uy-color-surface-info: var(--uy-color-cyan-l6);
356
+ --uy-color-surface-info-low: var(--uy-color-cyan-l3);
357
+ --uy-color-surface-info-lowest: var(--uy-color-cyan-l2);
358
+ --uy-color-surface-info-lowest-enabled: var(--uy-color-cyan-l2);
359
+ --uy-color-surface-info-lowest-hover: var(--uy-color-cyan-l3);
360
+ --uy-color-surface-info-lowest-pressed: var(--uy-color-cyan-l3);
361
+ --uy-color-surface-info-lowest-focus: var(--uy-color-cyan-l9);
362
+ --uy-color-surface-info-lowest-active: var(--uy-color-cyan-l11);
363
+ --uy-color-surface-info-lowest-disabled: var(--uy-color-grayscale-l8);
364
+ --uy-color-surface-promo: var(--uy-color-plum-l6);
365
+ --uy-color-surface-promo-low: var(--uy-color-plum-l3);
366
+ --uy-color-surface-promo-lowest: var(--uy-color-plum-l2);
367
+ --uy-color-surface-ai-low: var(--uy-color-purple-l6);
368
+ --uy-color-surface-form-enabled: var(--uy-color-grayscale-l0);
369
+ --uy-color-surface-form-hover: var(--uy-color-grayscale-l0);
370
+ --uy-color-surface-form-pressed: var(--uy-color-grayscale-l0);
371
+ --uy-color-surface-form-focus: var(--uy-color-grayscale-l0);
372
+ --uy-color-surface-form-active: var(--uy-color-blue-l5);
373
+ --uy-color-surface-form-selected: var(--uy-color-blue-l1);
374
+ --uy-color-surface-form-disabled: var(--uy-color-grayscale-l3);
375
+ --uy-color-surface-form-read-only: var(--uy-color-grayscale-l8);
376
+ --uy-color-surface-form-error: var(--uy-color-red-l2);
377
+ --uy-color-surface-form-high-enabled: var(--uy-color-grayscale-l3);
378
+ --uy-color-surface-form-high-hover: var(--uy-color-grayscale-l4);
379
+ --uy-color-surface-form-high-pressed: var(--uy-color-grayscale-l5);
380
+ --uy-color-surface-form-high-focus: var(--uy-color-grayscale-l3);
381
+ --uy-color-surface-form-high-active: var(--uy-color-grayscale-l0);
382
+ --uy-color-surface-form-high-selected: var(--uy-color-blue-l2);
383
+ --uy-color-surface-form-high-disabled: var(--uy-color-grayscale-l2);
384
+ --uy-color-surface-form-high-read-only: var(--uy-color-grayscale-l2);
385
+ --uy-color-surface-form-high-error: var(--uy-color-red-l2);
386
+ --uy-color-surface-inverted: var(--uy-color-grayscale-l12);
387
+ --uy-color-surface-inverted-enabled: var(--uy-color-grayscale-l12);
388
+ --uy-color-surface-inverted-hover: var(--uy-color-grayscale-l10);
389
+ --uy-color-surface-inverted-pressed: var(--uy-color-grayscale-l11);
390
+ --uy-color-surface-inverted-focus: var(--uy-color-grayscale-l12);
391
+ --uy-color-surface-inverted-active: var(--uy-color-grayscale-l11);
392
+ --uy-color-surface-decorative-teal: var(--uy-color-teal-l6);
393
+ --uy-color-surface-decorative-teal-high: var(--uy-color-teal-l9);
394
+ --uy-color-surface-decorative-teal-low: var(--uy-color-teal-l3);
395
+ --uy-color-surface-decorative-teal-lowest: var(--uy-color-teal-l2);
396
+ --uy-color-surface-decorative-purple-high: var(--uy-color-purple-l9);
397
+ --uy-color-surface-decorative-purple: var(--uy-color-purple-l6);
398
+ --uy-color-surface-decorative-purple-low: var(--uy-color-purple-l3);
399
+ --uy-color-surface-decorative-purple-lowest: var(--uy-color-purple-l2);
400
+ --uy-color-surface-decorative-plum: var(--uy-color-plum-l6);
401
+ --uy-color-surface-decorative-plum-high: var(--uy-color-plum-l9);
402
+ --uy-color-surface-decorative-plum-low: var(--uy-color-plum-l3);
403
+ --uy-color-surface-decorative-plum-lowest: var(--uy-color-plum-l2);
404
+ --uy-color-surface-decorative-orange: var(--uy-color-orange-l6);
405
+ --uy-color-surface-decorative-orange-high: var(--uy-color-orange-l9);
406
+ --uy-color-surface-decorative-orange-low: var(--uy-color-orange-l3);
407
+ --uy-color-surface-decorative-orange-lowest: var(--uy-color-orange-l2);
408
+ --uy-color-content-primary: var(--uy-color-blue-l6);
409
+ --uy-color-content-primary-enabled: var(--uy-color-blue-l7);
410
+ --uy-color-content-primary-hover: var(--uy-color-blue-l10);
411
+ --uy-color-content-primary-pressed: var(--uy-color-blue-l11);
412
+ --uy-color-content-primary-focus: var(--uy-color-blue-l7);
413
+ --uy-color-content-primary-active: var(--uy-color-blue-l6);
414
+ --uy-color-content-primary-disabled: var(--uy-color-grayscale-l8);
415
+ --uy-color-content-primary-high: var(--uy-color-blue-l10);
416
+ --uy-color-content-neutral: var(--uy-color-grayscale-l12);
417
+ --uy-color-content-neutral-enabled: var(--uy-color-grayscale-l12);
418
+ --uy-color-content-neutral-hover: var(--uy-color-grayscale-l12);
419
+ --uy-color-content-neutral-pressed: var(--uy-color-grayscale-l12);
420
+ --uy-color-content-neutral-focus: var(--uy-color-grayscale-l12);
421
+ --uy-color-content-neutral-active: var(--uy-color-grayscale-l12);
422
+ --uy-color-content-neutral-disabled: var(--uy-color-grayscale-l8);
423
+ --uy-color-content-neutral-low: var(--uy-color-grayscale-l11);
424
+ --uy-color-content-neutral-lowest: var(--uy-color-grayscale-l9);
425
+ --uy-color-content-neutral-lowest-enabled: var(--uy-color-grayscale-l9);
426
+ --uy-color-content-neutral-lowest-hover: var(--uy-color-grayscale-l10);
427
+ --uy-color-content-neutral-lowest-pressed: var(--uy-color-grayscale-l11);
428
+ --uy-color-content-neutral-lowest-focus: var(--uy-color-grayscale-l9);
429
+ --uy-color-content-neutral-lowest-active: var(--uy-color-grayscale-l12);
430
+ --uy-color-content-neutral-lowest-disabled: var(--uy-color-grayscale-l8);
431
+ --uy-color-content-danger: var(--uy-color-red-l8);
432
+ --uy-color-content-danger-enabled: var(--uy-color-red-l9);
433
+ --uy-color-content-danger-hover: var(--uy-color-red-l10);
434
+ --uy-color-content-danger-pressed: var(--uy-color-red-l11);
435
+ --uy-color-content-danger-focus: var(--uy-color-red-l9);
436
+ --uy-color-content-danger-active: var(--uy-color-red-l10);
437
+ --uy-color-content-danger-disabled: var(--uy-color-grayscale-l8);
438
+ --uy-color-content-danger-high: var(--uy-color-red-l11);
439
+ --uy-color-content-warning: var(--uy-color-yellow-l7);
440
+ --uy-color-content-warning-enabled: var(--uy-color-yellow-l11);
441
+ --uy-color-content-warning-hover: var(--uy-color-yellow-l11);
442
+ --uy-color-content-warning-pressed: var(--uy-color-yellow-l12);
443
+ --uy-color-content-warning-focus: var(--uy-color-yellow-l1);
444
+ --uy-color-content-warning-active: var(--uy-color-yellow-l11);
445
+ --uy-color-content-warning-disabled: var(--uy-color-grayscale-l8);
446
+ --uy-color-content-warning-high: var(--uy-color-yellow-l11);
447
+ --uy-color-content-success: var(--uy-color-green-l8);
448
+ --uy-color-content-success-enabled: var(--uy-color-green-l9);
449
+ --uy-color-content-success-hover: var(--uy-color-green-l10);
450
+ --uy-color-content-success-pressed: var(--uy-color-green-l11);
451
+ --uy-color-content-success-focus: var(--uy-color-green-l9);
452
+ --uy-color-content-success-active: var(--uy-color-green-l10);
453
+ --uy-color-content-success-disabled: var(--uy-color-grayscale-l8);
454
+ --uy-color-content-success-high: var(--uy-color-green-l11);
455
+ --uy-color-content-info: var(--uy-color-cyan-l7);
456
+ --uy-color-content-info-enabled: var(--uy-color-cyan-l9);
457
+ --uy-color-content-info-hover: var(--uy-color-cyan-l10);
458
+ --uy-color-content-info-pressed: var(--uy-color-cyan-l11);
459
+ --uy-color-content-info-focus: var(--uy-color-cyan-l9);
460
+ --uy-color-content-info-active: var(--uy-color-cyan-l10);
461
+ --uy-color-content-info-disabled: var(--uy-color-grayscale-l8);
462
+ --uy-color-content-info-high: var(--uy-color-cyan-l11);
463
+ --uy-color-content-promo: var(--uy-color-plum-l6);
464
+ --uy-color-content-promo-high: var(--uy-color-plum-l10);
465
+ --uy-color-content-form-enabled: var(--uy-color-grayscale-l12);
466
+ --uy-color-content-form-hover: var(--uy-color-grayscale-l12);
467
+ --uy-color-content-form-pressed: var(--uy-color-grayscale-l12);
468
+ --uy-color-content-form-focus: var(--uy-color-grayscale-l12);
469
+ --uy-color-content-form-active: var(--uy-color-grayscale-l12);
470
+ --uy-color-content-form-selected: var(--uy-color-blue-l6);
471
+ --uy-color-content-form-disabled: var(--uy-color-grayscale-l8);
472
+ --uy-color-content-form-read-only: var(--uy-color-grayscale-l12);
473
+ --uy-color-content-form-invalid: var(--uy-color-red-l8);
474
+ --uy-color-content-inverted: var(--uy-color-grayscale-l0);
475
+ --uy-color-content-inverted-enabled: var(--uy-color-grayscale-l0);
476
+ --uy-color-content-inverted-hover: var(--uy-color-grayscale-l2);
477
+ --uy-color-content-inverted-pressed: var(--uy-color-grayscale-l4);
478
+ --uy-color-content-inverted-focus: var(--uy-color-grayscale-l0);
479
+ --uy-color-content-inverted-active: var(--uy-color-grayscale-l0);
480
+ --uy-color-content-inverted-disabled: var(--uy-color-grayscale-l7);
481
+ --uy-color-content-decorative-teal: var(--uy-color-teal-l6);
482
+ --uy-color-content-decorative-teal-high: var(--uy-color-teal-l10);
483
+ --uy-color-content-decorative-purple: var(--uy-color-purple-l6);
484
+ --uy-color-content-decorative-purple-high: var(--uy-color-purple-l10);
485
+ --uy-color-content-decorative-plum: var(--uy-color-plum-l6);
486
+ --uy-color-content-decorative-plum-high: var(--uy-color-plum-l10);
487
+ --uy-color-content-decorative-orange: var(--uy-color-orange-l6);
488
+ --uy-color-content-decorative-orange-high: var(--uy-color-orange-l10);
489
+ --uy-color-border-primary: var(--uy-color-blue-l5);
490
+ --uy-color-border-primary-enabled: var(--uy-color-blue-l5);
491
+ --uy-color-border-primary-hover: var(--uy-color-blue-l6);
492
+ --uy-color-border-primary-pressed: var(--uy-color-blue-l7);
493
+ --uy-color-border-primary-focus: var(--uy-color-blue-l5);
494
+ --uy-color-border-primary-active: var(--uy-color-blue-l8);
495
+ --uy-color-border-primary-disabled: var(--uy-color-grayscale-l4);
496
+ --uy-color-border-primary-lowest: var(--uy-color-blue-l2);
497
+ --uy-color-border-neutral-high: var(--uy-color-grayscale-l7);
498
+ --uy-color-border-neutral-high-enabled: var(--uy-color-grayscale-l8);
499
+ --uy-color-border-neutral-high-hover: var(--uy-color-grayscale-l9);
500
+ --uy-color-border-neutral-high-pressed: var(--uy-color-grayscale-l10);
501
+ --uy-color-border-neutral-high-focus: var(--uy-color-grayscale-l8);
502
+ --uy-color-border-neutral-high-active: var(--uy-color-grayscale-l8);
503
+ --uy-color-border-neutral-high-disabled: var(--uy-color-grayscale-l5);
504
+ --uy-color-border-neutral: var(--uy-color-grayscale-l5);
505
+ --uy-color-border-neutral-enabled: var(--uy-color-grayscale-l6);
506
+ --uy-color-border-neutral-hover: var(--uy-color-grayscale-l6);
507
+ --uy-color-border-neutral-active: var(--uy-color-blue-l5);
508
+ --uy-color-border-neutral-pressed: var(--uy-color-grayscale-l7);
509
+ --uy-color-border-neutral-selected: var(--uy-color-grayscale-l6);
510
+ --uy-color-border-neutral-disabled: var(--uy-color-grayscale-l5);
511
+ --uy-color-border-neutral-low: var(--uy-color-grayscale-l4);
512
+ --uy-color-border-danger: var(--uy-color-red-l4);
513
+ --uy-color-border-danger-lowest: var(--uy-color-red-l2);
514
+ --uy-color-border-warning: var(--uy-color-yellow-l4);
515
+ --uy-color-border-warning-lowest: var(--uy-color-yellow-l2);
516
+ --uy-color-border-success: var(--uy-color-green-l8);
517
+ --uy-color-border-success-low: var(--uy-color-green-l4);
518
+ --uy-color-border-success-lowest: var(--uy-color-green-l2);
519
+ --uy-color-border-info: var(--uy-color-cyan-l4);
520
+ --uy-color-border-info-lowest: var(--uy-color-cyan-l2);
521
+ --uy-color-border-promo: var(--uy-color-plum-l4);
522
+ --uy-color-border-promo-lowest: var(--uy-color-plum-l3);
523
+ --uy-color-border-form-enabled: var(--uy-color-grayscale-l8);
524
+ --uy-color-border-form-hover: var(--uy-color-grayscale-l9);
525
+ --uy-color-border-form-pressed: var(--uy-color-grayscale-l10);
526
+ --uy-color-border-form-focus: var(--uy-color-grayscale-l8);
527
+ --uy-color-border-form-active: var(--uy-color-blue-l5);
528
+ --uy-color-border-form-selected: var(--uy-color-blue-l5);
529
+ --uy-color-border-form-disabled: var(--uy-color-grayscale-l5);
530
+ --uy-color-border-form-read-only: var(--uy-color-grayscale-l5);
531
+ --uy-color-border-form-error: var(--uy-color-red-l8);
532
+ --uy-color-border-inverted: var(--uy-color-grayscale-l2);
533
+ --uy-color-border-inverted-enabled: var(--uy-color-grayscale-l2);
534
+ --uy-color-border-inverted-hover: var(--uy-color-grayscale-l3);
535
+ --uy-color-border-inverted-pressed: var(--uy-color-grayscale-l4);
536
+ --uy-color-border-inverted-focus: var(--uy-color-grayscale-l2);
537
+ --uy-color-border-inverted-active: var(--uy-color-grayscale-l1);
538
+ --uy-color-border-inverted-disabled: var(--uy-color-grayscale-l7);
539
+ --uy-color-border-inverted-high: var(--uy-color-grayscale-l0);
540
+ --uy-color-utility-focus-ring: var(--uy-color-blue-l4);
541
+ --uy-color-utility-inverted-focus-ring: var(--uy-color-yellow-l4);
542
+ --uy-shadow-100: 0px 1px 4px 1px var(--uy-color-utility-shadow-100);
543
+ --uy-shadow-200: 0px 2px 8px 1px var(--uy-color-utility-shadow-200);
544
+ --uy-shadow-300: 0px 5px 10px 1px var(--uy-color-utility-shadow-300);
545
+ --uy-shadow-400: 0px 8px 18px 2px var(--uy-color-utility-shadow-400);
546
+ --uy-shadow-500: 0px 8px 24px 4px var(--uy-color-utility-shadow-500);
547
+ --uy-shadow-600: 0px 15px 30px 5px var(--uy-color-utility-shadow-600);
548
+ --uy-typography-default-display-heading: var(--uy-font-weight-semibold) var(--uy-text-1000)/1.25 var(--uy-font-sans);
549
+ --uy-typography-sm-display-heading: var(--uy-font-weight-semibold) var(--uy-text-1000)/1.25 var(--uy-font-sans);
550
+ --uy-typography-default-h1: var(--uy-font-weight-semibold) var(--uy-text-800)/1.2 var(--uy-font-sans);
551
+ --uy-typography-sm-h1: var(--uy-font-weight-semibold) var(--uy-text-600)/1.286 var(--uy-font-sans);
552
+ --uy-typography-default-h2: var(--uy-font-weight-semibold) var(--uy-text-400)/1.273 var(--uy-font-sans);
553
+ --uy-typography-sm-h2: var(--uy-font-weight-semibold) var(--uy-text-500)/1.333 var(--uy-font-sans);
554
+ --uy-typography-default-h3: var(--uy-font-weight-semibold) var(--uy-text-200)/1.333 var(--uy-font-sans);
555
+ --uy-typography-sm-h3: var(--uy-font-weight-semibold) var(--uy-text-300)/1.2 var(--uy-font-sans);
556
+ --uy-typography-default-h4: var(--uy-font-weight-semibold) var(--uy-text-100)/1.125 var(--uy-font-sans);
557
+ --uy-typography-sm-h4: var(--uy-font-weight-semibold) var(--uy-text-200)/1.333 var(--uy-font-sans);
558
+ --uy-typography-default-overline: var(--uy-font-weight-medium) var(--uy-text-100)/1.5 var(--uy-font-sans);
559
+ --uy-typography-sm-overline: var(--uy-font-weight-medium) var(--uy-text-100)/1.5 var(--uy-font-sans);
560
+ --uy-typography-default-subtitle: var(--uy-font-weight-regular) var(--uy-text-100)/1.5 var(--uy-font-sans);
561
+ --uy-typography-sm-subtitle: var(--uy-font-weight-regular) var(--uy-text-100)/1.333 var(--uy-font-sans);
562
+ --uy-typography-default-display-title: var(--uy-font-weight-semibold) var(--uy-text-300)/1.4 var(--uy-font-sans);
563
+ --uy-typography-sm-display-title: var(--uy-font-weight-semibold) var(--uy-text-500)/1.333 var(--uy-font-sans);
564
+ --uy-typography-default-display-body: var(--uy-font-weight-regular) var(--uy-text-100)/1.5 var(--uy-font-sans);
565
+ --uy-typography-sm-display-body: var(--uy-font-weight-regular) var(--uy-text-200)/1.556 var(--uy-font-sans);
566
+ --uy-typography-default-body: var(--uy-font-weight-regular) var(--uy-text-100)/1.5 var(--uy-font-sans);
567
+ --uy-typography-sm-body: var(--uy-font-weight-regular) var(--uy-text-75)/1.571 var(--uy-font-sans);
568
+ --uy-typography-default-body-strong: var(--uy-font-weight-medium) var(--uy-text-100)/1.5 var(--uy-font-sans);
569
+ --uy-typography-sm-body-strong: var(--uy-font-weight-medium) var(--uy-text-75)/1.571 var(--uy-font-sans);
570
+ --uy-typography-default-body-small: var(--uy-font-weight-regular) var(--uy-text-50)/1.667 var(--uy-font-sans);
571
+ --uy-typography-sm-body-small: var(--uy-font-weight-regular) var(--uy-text-50)/1.667 var(--uy-font-sans);
572
+ --uy-typography-default-body-small-strong: var(--uy-font-weight-medium) var(--uy-text-50)/1.667 var(--uy-font-sans);
573
+ --uy-typography-sm-body-small-strong: var(--uy-font-weight-medium) var(--uy-text-50)/1.667 var(--uy-font-sans);
574
+ --uy-typography-default-body-large: var(--uy-font-weight-regular) var(--uy-text-200)/1.556 var(--uy-font-sans);
575
+ --uy-typography-sm-body-large: var(--uy-font-weight-regular) var(--uy-text-100)/1.5 var(--uy-font-sans);
576
+ --uy-typography-default-body-large-strong: var(--uy-font-weight-medium) var(--uy-text-200)/1.556 var(--uy-font-sans);
577
+ --uy-typography-sm-body-large-strong: var(--uy-font-weight-medium) var(--uy-text-100)/1.5 var(--uy-font-sans);
578
+ --uy-typography-default-action: var(--uy-font-weight-medium) var(--uy-text-100)/1.5 var(--uy-font-sans);
579
+ --uy-typography-sm-action: var(--uy-font-weight-medium) var(--uy-text-75)/1.571 var(--uy-font-sans);
580
+ --uy-typography-default-action-small: var(--uy-font-weight-medium) var(--uy-text-50)/1.667 var(--uy-font-sans);
581
+ --uy-typography-sm-action-small: var(--uy-font-weight-medium) var(--uy-text-50)/1.667 var(--uy-font-sans);
582
+ --uy-typography-default-action-large: var(--uy-font-weight-medium) var(--uy-text-200)/1.556 var(--uy-font-sans);
583
+ --uy-typography-sm-action-large: var(--uy-font-weight-medium) var(--uy-text-100)/1.5 var(--uy-font-sans);
584
+ --uy-shadow-raising: var(--uy-shadow-100);
585
+ --uy-shadow-floating: var(--uy-shadow-200);
586
+ --uy-shadow-levitating: var(--uy-shadow-300);
587
+ --uy-shadow-flying: var(--uy-shadow-400);
588
+ --uy-shadow-soaring: var(--uy-shadow-500);
589
+ --uy-shadow-summit: var(--uy-shadow-600);
590
+ }
591
+
592
+ [data-uy-theme="rebrand"] {
593
+ --uy-animate-spin: 2s linear infinite spin;
594
+ --uy-animate-arc-shrink: 2s ease-in-out infinite arc-shrink;
595
+ --uy-animate-pulse: 2s cubic-bezier(0.4, 0, 0.6, 1) infinite pulse;
596
+ --uy-animate-slide: 4s cubic-bezier(1, 0, 0.36, 0.71) infinite slide;
597
+ --uy-animate-fade-in: 0.3s linear 1 fade-in;
598
+ --uy-animate-fade-out: 0.3s linear 1 fade-out;
599
+ --uy-animate-slide-right-fade-in: 0.3s ease-in 1 slide-right-fade-in;
600
+ --uy-animate-slide-right-fade-out: 0.3s ease-out 1 slide-right-fade-out;
601
+ --uy-animate-slide-up-fade-in: 0.3s ease-in 1 slide-up-fade-in;
602
+ --uy-animate-slide-down-fade-out: 0.3s ease-out 1 slide-down-fade-out;
603
+ --uy-animate-zoom-in: 0.3s ease-in 1 zoom-in;
604
+ --uy-animate-zoom-out: 0.3s ease-out 1 zoom-out;
605
+ --uy-aspect-video: 16 / 9;
606
+ --uy-aspect-square: 1 / 1;
607
+ --uy-breakpoint-sm: 490px;
608
+ --uy-breakpoint-md: 768px;
609
+ --uy-breakpoint-lg: 1280px;
610
+ --uy-breakpoint-xl: 1440px;
611
+ --uy-text-50: 12px;
612
+ --uy-text-75: 14px;
613
+ --uy-text-100: 16px;
614
+ --uy-text-200: 18px;
615
+ --uy-text-300: 20px;
616
+ --uy-text-400: 22px;
617
+ --uy-text-500: 24px;
618
+ --uy-text-600: 28px;
619
+ --uy-text-800: 30px;
620
+ --uy-text-1000: 32px;
621
+ --uy-text-1200: 38px;
622
+ --uy-text-1400: 52px;
623
+ --uy-text-1600: 66px;
624
+ --uy-font-weight-regular: 400;
625
+ --uy-font-weight-medium: 500;
626
+ --uy-font-weight-semibold: 600;
627
+ --uy-font-weight-bold: 700;
628
+ --uy-grid-layout-columns--default: 6;
629
+ --uy-grid-layout-columns--md: 12;
630
+ --uy-grid-layout-columns--lg: 12;
631
+ --uy-radius-0: 0;
632
+ --uy-radius-25: 2px;
633
+ --uy-radius-50: 4px;
634
+ --uy-radius-75: 6px;
635
+ --uy-radius-100: 8px;
636
+ --uy-radius-125: 10px;
637
+ --uy-radius-150: 12px;
638
+ --uy-radius-200: 16px;
639
+ --uy-radius-300: 24px;
640
+ --uy-radius-400: 32px;
641
+ --uy-radius-circle: 50%;
642
+ --uy-radius-pill: 9999px;
643
+ --uy-container-app-menu: 296px; /** Width of the main menu in global App layout */
644
+ --uy-container-lg: 984px; /** Maximum width for layout containers at large resolutions */
645
+ --uy-container-xl: 1360px; /** Maximum width for layout containers at extra-large resolutions */
646
+ --uy-container-content: 523px; /** Maximum width for content containers */
647
+ --uy-container-section: 703px; /** Maximum width for section containers */
648
+ --uy-container-page: 1063px; /** Maximum width for page containers */
649
+ --uy-container-app: 1439px; /** Maximum width for app containers */
650
+ --uy-spacing-0: 0;
651
+ --uy-spacing-25: 2px;
652
+ --uy-spacing-50: 4px;
653
+ --uy-spacing-75: 6px;
654
+ --uy-spacing-100: 8px;
655
+ --uy-spacing-125: 10px;
656
+ --uy-spacing-150: 12px;
657
+ --uy-spacing-200: 16px;
658
+ --uy-spacing-250: 20px;
659
+ --uy-spacing-300: 24px;
660
+ --uy-spacing-400: 32px;
661
+ --uy-spacing-500: 40px;
662
+ --uy-spacing-600: 48px;
663
+ --uy-spacing-800: 64px;
664
+ --uy-spacing-1000: 80px;
665
+ --uy-spacing: 8px; /** Base spacing value */
666
+ --uy-color-grayscale-l1: oklch(99.107% 0 none);
667
+ --uy-color-grayscale-l2: oklch(98.483% 0.00132 106.42);
668
+ --uy-color-grayscale-l3: oklch(96.987% 0.00132 106.42);
669
+ --uy-color-grayscale-l4: oklch(95.563% 0.00172 67.802);
670
+ --uy-color-grayscale-l5: oklch(92.515% 0.0029 84.559);
671
+ --uy-color-grayscale-l6: oklch(87.71% 0.00351 67.778);
672
+ --uy-color-grayscale-l7: oklch(76.698% 0.00304 84.561);
673
+ --uy-color-grayscale-l8: oklch(66.489% 0.00564 67.728);
674
+ --uy-color-grayscale-l9: oklch(53.906% 0.00524 78.28);
675
+ --uy-color-grayscale-l10: oklch(46.613% 0.00504 56.284);
676
+ --uy-color-grayscale-l11: oklch(32.073% 0.00174 106.5);
677
+ --uy-color-grayscale-l12: oklch(15.864% 0.00207 106.63);
678
+ --uy-color-grayscale-l0: oklch(100% 0 none);
679
+ --uy-color-red-l1: oklch(97.792% 0.01075 17.34);
680
+ --uy-color-red-l2: oklch(94.381% 0.02876 9.7161);
681
+ --uy-color-red-l3: oklch(89.492% 0.04856 14.944);
682
+ --uy-color-red-l4: oklch(78.582% 0.1152 16.001);
683
+ --uy-color-red-l5: oklch(71.886% 0.16053 17.784);
684
+ --uy-color-red-l6: oklch(65.708% 0.19759 21.046);
685
+ --uy-color-red-l7: oklch(59.25% 0.21355 24.137);
686
+ --uy-color-red-l8: oklch(57.879% 0.20845 23.228);
687
+ --uy-color-red-l9: oklch(50.925% 0.17633 22.089);
688
+ --uy-color-red-l10: oklch(43.341% 0.14894 22.251);
689
+ --uy-color-red-l11: oklch(35.625% 0.12118 22.019);
690
+ --uy-color-red-l12: oklch(17.535% 0.05614 18.19);
691
+ --uy-color-green-l1: oklch(98.871% 0.00744 164.95);
692
+ --uy-color-green-l2: oklch(96.38% 0.02223 160.23);
693
+ --uy-color-green-l3: oklch(92.126% 0.05504 160.67);
694
+ --uy-color-green-l4: oklch(86.028% 0.09651 159.64);
695
+ --uy-color-green-l5: oklch(81.721% 0.12618 158.13);
696
+ --uy-color-green-l6: oklch(77.692% 0.15338 156.44);
697
+ --uy-color-green-l7: oklch(73.847% 0.17437 153.87);
698
+ --uy-color-green-l8: oklch(57.61% 0.14966 151.64);
699
+ --uy-color-green-l9: oklch(47.424% 0.11597 153.14);
700
+ --uy-color-green-l10: oklch(39.675% 0.09458 153.9);
701
+ --uy-color-green-l11: oklch(31.845% 0.0735 154.83);
702
+ --uy-color-green-l12: oklch(24.608% 0.05225 158.42);
703
+ --uy-color-yellow-l1: oklch(99.339% 0.01073 95.159);
704
+ --uy-color-yellow-l2: oklch(97.915% 0.03037 98.851);
705
+ --uy-color-yellow-l3: oklch(95.518% 0.06994 99.662);
706
+ --uy-color-yellow-l4: oklch(92.557% 0.1141 100.74);
707
+ --uy-color-yellow-l5: oklch(89.595% 0.13091 97.032);
708
+ --uy-color-yellow-l6: oklch(84.352% 0.16318 90.591);
709
+ --uy-color-yellow-l7: oklch(77.818% 0.15947 85.077);
710
+ --uy-color-yellow-l8: oklch(69.416% 0.14464 76.061);
711
+ --uy-color-yellow-l9: oklch(63.915% 0.13445 73.481);
712
+ --uy-color-yellow-l10: oklch(54.002% 0.11336 74.267);
713
+ --uy-color-yellow-l11: oklch(30.395% 0.06335 78.023);
714
+ --uy-color-yellow-l12: oklch(22.149% 0.0459 79.81);
715
+ --uy-color-cyan-l1: oklch(97.886% 0.00986 267.36);
716
+ --uy-color-cyan-l2: oklch(95.134% 0.02342 256.1);
717
+ --uy-color-cyan-l3: oklch(88.875% 0.0523 253.72);
718
+ --uy-color-cyan-l4: oklch(84.58% 0.07513 252.94);
719
+ --uy-color-cyan-l5: oklch(77.464% 0.10865 254.47);
720
+ --uy-color-cyan-l6: oklch(61.837% 0.19835 264.1);
721
+ --uy-color-cyan-l7: oklch(49.463% 0.23537 263.16);
722
+ --uy-color-cyan-l8: oklch(45.699% 0.23019 263.15);
723
+ --uy-color-cyan-l9: oklch(37.762% 0.18821 262.89);
724
+ --uy-color-cyan-l10: oklch(34.112% 0.16828 262.78);
725
+ --uy-color-cyan-l11: oklch(26.594% 0.12371 262.08);
726
+ --uy-color-cyan-l12: oklch(17.635% 0.07085 259.71);
727
+ --uy-color-blue-l1: oklch(97.952% 0.01094 225.98);
728
+ --uy-color-blue-l2: oklch(96.382% 0.02364 223.67);
729
+ --uy-color-blue-l3: oklch(93.309% 0.03781 224.26);
730
+ --uy-color-blue-l4: oklch(86.944% 0.07387 225.17);
731
+ --uy-color-blue-l5: oklch(79.937% 0.09849 228.77);
732
+ --uy-color-blue-l6: oklch(73.171% 0.11492 230.76);
733
+ --uy-color-blue-l7: oklch(64.991% 0.13865 236.58);
734
+ --uy-color-blue-l8: oklch(54.305% 0.12243 240.11);
735
+ --uy-color-blue-l9: oklch(48.504% 0.11745 244.2);
736
+ --uy-color-blue-l10: oklch(41.431% 0.11515 250.54);
737
+ --uy-color-blue-l11: oklch(31.396% 0.08821 251.58);
738
+ --uy-color-blue-l12: oklch(20.128% 0.05254 250.57);
739
+ --uy-color-purple-l1: oklch(98.727% 0.00667 295.45);
740
+ --uy-color-purple-l2: oklch(93.912% 0.03693 306.42);
741
+ --uy-color-purple-l3: oklch(86.42% 0.08356 305.11);
742
+ --uy-color-purple-l4: oklch(80.045% 0.12523 304.54);
743
+ --uy-color-purple-l5: oklch(70.598% 0.18751 302.64);
744
+ --uy-color-purple-l6: oklch(59.606% 0.25733 298.62);
745
+ --uy-color-purple-l7: oklch(50.521% 0.27523 292.38);
746
+ --uy-color-purple-l8: oklch(39.992% 0.22552 290.56);
747
+ --uy-color-purple-l9: oklch(34.128% 0.19137 291.48);
748
+ --uy-color-purple-l10: oklch(28.003% 0.15567 292.93);
749
+ --uy-color-purple-l11: oklch(21.779% 0.11996 294.49);
750
+ --uy-color-purple-l12: oklch(19.414% 0.10973 276.86);
751
+ --uy-color-plum-l1: oklch(98.074% 0.01687 325.7);
752
+ --uy-color-plum-l2: oklch(95.054% 0.0442 325.92);
753
+ --uy-color-plum-l3: oklch(89.634% 0.09612 326.34);
754
+ --uy-color-plum-l4: oklch(84.63% 0.14779 326.78);
755
+ --uy-color-plum-l5: oklch(77.951% 0.22327 327.45);
756
+ --uy-color-plum-l6: oklch(70.055% 0.26778 327.97);
757
+ --uy-color-plum-l7: oklch(66.973% 0.30481 328.34);
758
+ --uy-color-plum-l8: oklch(60.393% 0.27757 328.36);
759
+ --uy-color-plum-l9: oklch(55.799% 0.25645 328.36);
760
+ --uy-color-plum-l10: oklch(41.854% 0.19236 328.36);
761
+ --uy-color-plum-l11: oklch(28.707% 0.13194 328.36);
762
+ --uy-color-plum-l12: oklch(21.133% 0.09713 328.36);
763
+ --uy-color-peach-l1: oklch(97.27% 0.01359 34.299);
764
+ --uy-color-peach-l2: oklch(90.632% 0.04897 32.141);
765
+ --uy-color-peach-l3: oklch(82.029% 0.10207 33.458);
766
+ --uy-color-peach-l9: oklch(74.944% 0.15289 33.756);
767
+ --uy-color-peach-l10: oklch(68.145% 0.20917 33.947);
768
+ --uy-color-peach-l11: oklch(45.269% 0.14889 33.908);
769
+ --uy-color-peach-l12: oklch(22.79% 0.07583 37.262);
770
+ --uy-color-sunglow-l1: oklch(97.781% 0.02393 85.787);
771
+ --uy-color-sunglow-l2: oklch(94.597% 0.05744 85.031);
772
+ --uy-color-sunglow-l3: oklch(88.727% 0.12792 86.388);
773
+ --uy-color-sunglow-l9: oklch(82.358% 0.16964 79.247);
774
+ --uy-color-sunglow-l10: oklch(55.358% 0.10103 84.486);
775
+ --uy-color-sunglow-l11: oklch(41.232% 0.07399 83.781);
776
+ --uy-color-sunglow-l12: oklch(28.544% 0.05865 83.417);
777
+ --uy-color-teal-l1: oklch(98.684% 0.01389 185.97);
778
+ --uy-color-teal-l2: oklch(96.544% 0.02736 188.32);
779
+ --uy-color-teal-l3: oklch(94.626% 0.05078 185.69);
780
+ --uy-color-teal-l4: oklch(93.062% 0.07454 184.48);
781
+ --uy-color-teal-l5: oklch(89.504% 0.09816 184.34);
782
+ --uy-color-teal-l6: oklch(83.729% 0.13003 182.66);
783
+ --uy-color-teal-l7: oklch(81.175% 0.14302 180.05);
784
+ --uy-color-teal-l8: oklch(75.655% 0.13859 178.63);
785
+ --uy-color-teal-l9: oklch(64.039% 0.11735 178.57);
786
+ --uy-color-teal-l10: oklch(53.68% 0.09858 178.28);
787
+ --uy-color-teal-l11: oklch(39.29% 0.07141 179.75);
788
+ --uy-color-teal-l12: oklch(25.219% 0.04499 182.68);
789
+ --uy-color-orange-l1: oklch(98.951% 0.00901 78.283);
790
+ --uy-color-orange-l2: oklch(96.593% 0.02201 63.21);
791
+ --uy-color-orange-l3: oklch(91.294% 0.06104 66.137);
792
+ --uy-color-orange-l4: oklch(84.141% 0.11341 63.98);
793
+ --uy-color-orange-l5: oklch(78.942% 0.14833 59.584);
794
+ --uy-color-orange-l6: oklch(74.813% 0.1758 55.368);
795
+ --uy-color-orange-l7: oklch(70.436% 0.18901 48.977);
796
+ --uy-color-orange-l8: oklch(62.422% 0.17068 47.739);
797
+ --uy-color-orange-l9: oklch(52.276% 0.14176 48.278);
798
+ --uy-color-orange-l10: oklch(41.774% 0.1105 49.961);
799
+ --uy-color-orange-l11: oklch(31.978% 0.08201 52.207);
800
+ --uy-color-orange-l12: oklch(22.532% 0.05418 57.579);
801
+ --uy-color-utility-backdrop: oklch(16.172% 0.03703 253.15 / 0.6);
802
+ --uy-color-utility-shadow-100: oklch(0% 0 none / 0.05882);
803
+ --uy-color-utility-shadow-200: oklch(0% 0 none / 0.07843);
804
+ --uy-color-utility-shadow-300: oklch(0% 0 none / 0.07843);
805
+ --uy-color-utility-shadow-400: oklch(0% 0 none / 0.10196);
806
+ --uy-color-utility-shadow-500: oklch(0% 0 none / 0.12157);
807
+ --uy-color-utility-shadow-600: oklch(0% 0 none / 0.12157);
808
+ --uy-shadow-canvas: none;
809
+ --uy-font-serif: "Heartbreak Eighties", serif;
810
+ --uy-font-sans: Inter, sans-serif;
811
+ --uy-font-mono: "Roboto Mono", monospace;
812
+ --uy-grid-layout-gutter--default: calc(var(--uy-spacing) * 2);
813
+ --uy-grid-layout-margin--default: calc(var(--uy-spacing) * 2);
814
+ --uy-grid-layout-gutter--md: calc(var(--uy-spacing) * 2);
815
+ --uy-grid-layout-margin--md: calc(var(--uy-spacing) * 3);
816
+ --uy-grid-layout-gutter--lg: calc(var(--uy-spacing) * 2);
817
+ --uy-grid-layout-margin--lg: calc(var(--uy-spacing) * 5);
818
+ --uy-radius-xs: var(--uy-radius-50);
819
+ --uy-radius-sm: var(--uy-radius-75);
820
+ --uy-radius-md: var(--uy-radius-100);
821
+ --uy-radius-lg: var(--uy-radius-200);
822
+ --uy-radius-xl: var(--uy-radius-300);
823
+ --uy-color-canvas: var(--uy-color-grayscale-l2);
824
+ --uy-color-surface-primary-highest: var(--uy-color-plum-l10);
825
+ --uy-color-surface-primary-high: var(--uy-color-plum-l8);
826
+ --uy-color-surface-primary: var(--uy-color-plum-l6);
827
+ --uy-color-surface-primary-enabled: var(--uy-color-plum-l6);
828
+ --uy-color-surface-primary-hover: var(--uy-color-plum-l7);
829
+ --uy-color-surface-primary-pressed: var(--uy-color-plum-l8);
830
+ --uy-color-surface-primary-focus: var(--uy-color-plum-l6);
831
+ --uy-color-surface-primary-active: var(--uy-color-plum-l6);
832
+ --uy-color-surface-primary-disabled: var(--uy-color-grayscale-l5);
833
+ --uy-color-surface-primary-low: var(--uy-color-plum-l3);
834
+ --uy-color-surface-primary-lowest: var(--uy-color-plum-l1);
835
+ --uy-color-surface-primary-lowest-enabled: var(--uy-color-plum-l1);
836
+ --uy-color-surface-primary-lowest-hover: var(--uy-color-grayscale-l1);
837
+ --uy-color-surface-primary-lowest-pressed: var(--uy-color-plum-l1);
838
+ --uy-color-surface-primary-lowest-focus: var(--uy-color-plum-l4);
839
+ --uy-color-surface-primary-lowest-active: var(--uy-color-plum-l1);
840
+ --uy-color-surface-primary-lowest-disabled: var(--uy-color-grayscale-l2);
841
+ --uy-color-surface-neutral: var(--uy-color-grayscale-l0);
842
+ --uy-color-surface-neutral-enabled: var(--uy-color-grayscale-l0);
843
+ --uy-color-surface-neutral-hover: var(--uy-color-grayscale-l3);
844
+ --uy-color-surface-neutral-pressed: var(--uy-color-plum-l2);
845
+ --uy-color-surface-neutral-focus: var(--uy-color-grayscale-l2);
846
+ --uy-color-surface-neutral-active: var(--uy-color-plum-l2);
847
+ --uy-color-surface-neutral-selected: var(--uy-color-grayscale-l3);
848
+ --uy-color-surface-neutral-disabled: var(--uy-color-grayscale-l4);
849
+ --uy-color-surface-neutral-low: var(--uy-color-grayscale-l3);
850
+ --uy-color-surface-neutral-low-enabled: var(--uy-color-grayscale-l3);
851
+ --uy-color-surface-neutral-low-hover: var(--uy-color-grayscale-l4);
852
+ --uy-color-surface-neutral-low-pressed: var(--uy-color-plum-l3);
853
+ --uy-color-surface-neutral-low-focus: var(--uy-color-grayscale-l3);
854
+ --uy-color-surface-neutral-low-active: var(--uy-color-grayscale-l3);
855
+ --uy-color-surface-neutral-low-disabled: var(--uy-color-grayscale-l5);
856
+ --uy-color-surface-neutral-low-selected: var(--uy-color-grayscale-l3);
857
+ --uy-color-surface-neutral-lowest: var(--uy-color-grayscale-l4);
858
+ --uy-color-surface-neutral-lowest-enabled: var(--uy-color-grayscale-l4);
859
+ --uy-color-surface-neutral-lowest-hover: var(--uy-color-grayscale-l5);
860
+ --uy-color-surface-neutral-lowest-pressed: var(--uy-color-grayscale-l6);
861
+ --uy-color-surface-neutral-lowest-focus: var(--uy-color-grayscale-l4);
862
+ --uy-color-surface-neutral-lowest-active: var(--uy-color-grayscale-l5);
863
+ --uy-color-surface-neutral-lowest-disabled: var(--uy-color-grayscale-l4);
864
+ --uy-color-surface-neutral-lowest-selected: var(--uy-color-grayscale-l6);
865
+ --uy-color-surface-neutral-highest: var(--uy-color-grayscale-l12);
866
+ --uy-color-surface-neutral-highest-enabled: var(--uy-color-grayscale-l12);
867
+ --uy-color-surface-neutral-highest-hover: var(--uy-color-grayscale-l11);
868
+ --uy-color-surface-neutral-highest-pressed: var(--uy-color-plum-l5);
869
+ --uy-color-surface-neutral-highest-active: var(--uy-color-grayscale-l12);
870
+ --uy-color-surface-neutral-highest-focus: var(--uy-color-grayscale-l12);
871
+ --uy-color-surface-neutral-highest-disabled: var(--uy-color-grayscale-l5);
872
+ --uy-color-surface-neutral-highest-selected: var(--uy-color-grayscale-l12);
873
+ --uy-color-surface-danger: var(--uy-color-red-l7);
874
+ --uy-color-surface-danger-enabled: var(--uy-color-red-l7);
875
+ --uy-color-surface-danger-hover: var(--uy-color-red-l8);
876
+ --uy-color-surface-danger-pressed: var(--uy-color-red-l9);
877
+ --uy-color-surface-danger-focus: var(--uy-color-red-l7);
878
+ --uy-color-surface-danger-active: var(--uy-color-red-l7);
879
+ --uy-color-surface-danger-disabled: var(--uy-color-grayscale-l8);
880
+ --uy-color-surface-danger-low: var(--uy-color-red-l3);
881
+ --uy-color-surface-danger-lowest: var(--uy-color-red-l2);
882
+ --uy-color-surface-danger-lowest-enabled: var(--uy-color-red-l1);
883
+ --uy-color-surface-danger-lowest-hover: var(--uy-color-red-l2);
884
+ --uy-color-surface-danger-lowest-pressed: var(--uy-color-red-l3);
885
+ --uy-color-surface-danger-lowest-focus: var(--uy-color-grayscale-l0);
886
+ --uy-color-surface-danger-lowest-active: var(--uy-color-red-l2);
887
+ --uy-color-surface-danger-lowest-disabled: var(--uy-color-grayscale-l8);
888
+ --uy-color-surface-warning: var(--uy-color-yellow-l6);
889
+ --uy-color-surface-warning-enabled: var(--uy-color-yellow-l6);
890
+ --uy-color-surface-warning-hover: var(--uy-color-yellow-l7);
891
+ --uy-color-surface-warning-pressed: var(--uy-color-yellow-l8);
892
+ --uy-color-surface-warning-focus: var(--uy-color-yellow-l6);
893
+ --uy-color-surface-warning-active: var(--uy-color-yellow-l6);
894
+ --uy-color-surface-warning-disabled: var(--uy-color-grayscale-l8);
895
+ --uy-color-surface-warning-low: var(--uy-color-yellow-l3);
896
+ --uy-color-surface-warning-lowest: var(--uy-color-yellow-l2);
897
+ --uy-color-surface-warning-lowest-enabled: var(--uy-color-yellow-l2);
898
+ --uy-color-surface-warning-lowest-hover: var(--uy-color-yellow-l2);
899
+ --uy-color-surface-warning-lowest-pressed: var(--uy-color-yellow-l3);
900
+ --uy-color-surface-warning-lowest-focus: var(--uy-color-grayscale-l0);
901
+ --uy-color-surface-warning-lowest-active: var(--uy-color-yellow-l2);
902
+ --uy-color-surface-warning-lowest-disabled: var(--uy-color-grayscale-l8);
903
+ --uy-color-surface-success: var(--uy-color-green-l8);
904
+ --uy-color-surface-success-low: var(--uy-color-green-l3);
905
+ --uy-color-surface-success-lowest: var(--uy-color-green-l2);
906
+ --uy-color-surface-success-lowest-enabled: var(--uy-color-green-l2);
907
+ --uy-color-surface-success-lowest-hover: var(--uy-color-green-l2);
908
+ --uy-color-surface-success-lowest-pressed: var(--uy-color-green-l3);
909
+ --uy-color-surface-success-lowest-focus: var(--uy-color-green-l4);
910
+ --uy-color-surface-success-lowest-active: var(--uy-color-green-l2);
911
+ --uy-color-surface-success-lowest-disabled: var(--uy-color-grayscale-l8);
912
+ --uy-color-surface-info: var(--uy-color-blue-l4);
913
+ --uy-color-surface-info-low: var(--uy-color-blue-l3);
914
+ --uy-color-surface-info-lowest: var(--uy-color-blue-l2);
915
+ --uy-color-surface-info-lowest-enabled: var(--uy-color-blue-l2);
916
+ --uy-color-surface-info-lowest-hover: var(--uy-color-blue-l3);
917
+ --uy-color-surface-info-lowest-pressed: var(--uy-color-blue-l3);
918
+ --uy-color-surface-info-lowest-focus: var(--uy-color-blue-l2);
919
+ --uy-color-surface-info-lowest-active: var(--uy-color-blue-l2);
920
+ --uy-color-surface-info-lowest-disabled: var(--uy-color-grayscale-l8);
921
+ --uy-color-surface-promo: var(--uy-color-plum-l6);
922
+ --uy-color-surface-promo-low: var(--uy-color-plum-l3);
923
+ --uy-color-surface-promo-lowest: var(--uy-color-plum-l2);
924
+ --uy-color-surface-ai-low: var(--uy-color-purple-l6);
925
+ --uy-color-surface-form-enabled: var(--uy-color-grayscale-l0);
926
+ --uy-color-surface-form-hover: var(--uy-color-grayscale-l0);
927
+ --uy-color-surface-form-pressed: var(--uy-color-grayscale-l0);
928
+ --uy-color-surface-form-focus: var(--uy-color-grayscale-l0);
929
+ --uy-color-surface-form-active: var(--uy-color-plum-l6);
930
+ --uy-color-surface-form-selected: var(--uy-color-plum-l2);
931
+ --uy-color-surface-form-disabled: var(--uy-color-grayscale-l3);
932
+ --uy-color-surface-form-read-only: var(--uy-color-grayscale-l9);
933
+ --uy-color-surface-form-error: var(--uy-color-red-l2);
934
+ --uy-color-surface-form-high-enabled: var(--uy-color-grayscale-l3);
935
+ --uy-color-surface-form-high-hover: var(--uy-color-grayscale-l4);
936
+ --uy-color-surface-form-high-pressed: var(--uy-color-grayscale-l2);
937
+ --uy-color-surface-form-high-focus: var(--uy-color-grayscale-l3);
938
+ --uy-color-surface-form-high-active: var(--uy-color-grayscale-l0);
939
+ --uy-color-surface-form-high-selected: var(--uy-color-plum-l2);
940
+ --uy-color-surface-form-high-disabled: var(--uy-color-grayscale-l2);
941
+ --uy-color-surface-form-high-read-only: var(--uy-color-grayscale-l2);
942
+ --uy-color-surface-form-high-error: var(--uy-color-red-l2);
943
+ --uy-color-surface-inverted: var(--uy-color-grayscale-l12);
944
+ --uy-color-surface-inverted-enabled: var(--uy-color-grayscale-l12);
945
+ --uy-color-surface-inverted-hover: var(--uy-color-grayscale-l10);
946
+ --uy-color-surface-inverted-pressed: var(--uy-color-grayscale-l11);
947
+ --uy-color-surface-inverted-focus: var(--uy-color-grayscale-l12);
948
+ --uy-color-surface-inverted-active: var(--uy-color-grayscale-l11);
949
+ --uy-color-surface-inverted-low-enabled: var(--uy-color-grayscale-l11);
950
+ --uy-color-surface-inverted-low-hover: var(--uy-color-grayscale-l10);
951
+ --uy-color-surface-inverted-low-pressed: var(--uy-color-grayscale-l11);
952
+ --uy-color-surface-inverted-low-active: var(--uy-color-grayscale-l11);
953
+ --uy-color-surface-inverted-low-focus: var(--uy-color-grayscale-l11);
954
+ --uy-color-surface-inverted-low-disabled: var(--uy-color-grayscale-l10);
955
+ --uy-color-surface-decorative-teal: var(--uy-color-teal-l6);
956
+ --uy-color-surface-decorative-teal-high: var(--uy-color-teal-l9);
957
+ --uy-color-surface-decorative-teal-low: var(--uy-color-teal-l3);
958
+ --uy-color-surface-decorative-teal-lowest: var(--uy-color-teal-l2);
959
+ --uy-color-surface-decorative-purple-high: var(--uy-color-purple-l9);
960
+ --uy-color-surface-decorative-purple: var(--uy-color-purple-l6);
961
+ --uy-color-surface-decorative-purple-low: var(--uy-color-purple-l3);
962
+ --uy-color-surface-decorative-purple-lowest: var(--uy-color-purple-l2);
963
+ --uy-color-surface-decorative-plum: var(--uy-color-plum-l6);
964
+ --uy-color-surface-decorative-plum-high: var(--uy-color-plum-l9);
965
+ --uy-color-surface-decorative-plum-low: var(--uy-color-plum-l3);
966
+ --uy-color-surface-decorative-plum-lowest: var(--uy-color-plum-l2);
967
+ --uy-color-surface-decorative-orange: var(--uy-color-orange-l6);
968
+ --uy-color-surface-decorative-orange-high: var(--uy-color-orange-l9);
969
+ --uy-color-surface-decorative-orange-low: var(--uy-color-orange-l3);
970
+ --uy-color-surface-decorative-orange-lowest: var(--uy-color-orange-l2);
971
+ --uy-color-content-primary: var(--uy-color-plum-l6);
972
+ --uy-color-content-primary-enabled: var(--uy-color-plum-l8);
973
+ --uy-color-content-primary-hover: var(--uy-color-plum-l9);
974
+ --uy-color-content-primary-pressed: var(--uy-color-plum-l10);
975
+ --uy-color-content-primary-focus: var(--uy-color-plum-l8);
976
+ --uy-color-content-primary-active: var(--uy-color-plum-l8);
977
+ --uy-color-content-primary-disabled: var(--uy-color-grayscale-l7);
978
+ --uy-color-content-primary-high: var(--uy-color-plum-l10);
979
+ --uy-color-content-neutral: var(--uy-color-grayscale-l12);
980
+ --uy-color-content-neutral-enabled: var(--uy-color-grayscale-l12);
981
+ --uy-color-content-neutral-hover: var(--uy-color-grayscale-l12);
982
+ --uy-color-content-neutral-pressed: var(--uy-color-grayscale-l12);
983
+ --uy-color-content-neutral-focus: var(--uy-color-grayscale-l12);
984
+ --uy-color-content-neutral-active: var(--uy-color-grayscale-l12);
985
+ --uy-color-content-neutral-disabled: var(--uy-color-grayscale-l7);
986
+ --uy-color-content-neutral-low: var(--uy-color-grayscale-l11);
987
+ --uy-color-content-neutral-lowest: var(--uy-color-grayscale-l9);
988
+ --uy-color-content-neutral-lowest-enabled: var(--uy-color-grayscale-l9);
989
+ --uy-color-content-neutral-lowest-hover: var(--uy-color-grayscale-l10);
990
+ --uy-color-content-neutral-lowest-pressed: var(--uy-color-grayscale-l12);
991
+ --uy-color-content-neutral-lowest-focus: var(--uy-color-grayscale-l9);
992
+ --uy-color-content-neutral-lowest-active: var(--uy-color-grayscale-l9);
993
+ --uy-color-content-neutral-lowest-disabled: var(--uy-color-grayscale-l7);
994
+ --uy-color-content-danger: var(--uy-color-red-l8);
995
+ --uy-color-content-danger-enabled: var(--uy-color-red-l9);
996
+ --uy-color-content-danger-hover: var(--uy-color-red-l10);
997
+ --uy-color-content-danger-pressed: var(--uy-color-red-l11);
998
+ --uy-color-content-danger-focus: var(--uy-color-red-l9);
999
+ --uy-color-content-danger-active: var(--uy-color-red-l9);
1000
+ --uy-color-content-danger-disabled: var(--uy-color-grayscale-l8);
1001
+ --uy-color-content-danger-high: var(--uy-color-red-l10);
1002
+ --uy-color-content-warning: var(--uy-color-yellow-l7);
1003
+ --uy-color-content-warning-enabled: var(--uy-color-yellow-l11);
1004
+ --uy-color-content-warning-hover: var(--uy-color-yellow-l11);
1005
+ --uy-color-content-warning-pressed: var(--uy-color-yellow-l12);
1006
+ --uy-color-content-warning-focus: var(--uy-color-yellow-l11);
1007
+ --uy-color-content-warning-active: var(--uy-color-yellow-l11);
1008
+ --uy-color-content-warning-disabled: var(--uy-color-grayscale-l8);
1009
+ --uy-color-content-warning-high: var(--uy-color-yellow-l11);
1010
+ --uy-color-content-success: var(--uy-color-green-l8);
1011
+ --uy-color-content-success-enabled: var(--uy-color-green-l9);
1012
+ --uy-color-content-success-hover: var(--uy-color-green-l10);
1013
+ --uy-color-content-success-pressed: var(--uy-color-green-l11);
1014
+ --uy-color-content-success-focus: var(--uy-color-green-l9);
1015
+ --uy-color-content-success-active: var(--uy-color-green-l10);
1016
+ --uy-color-content-success-disabled: var(--uy-color-grayscale-l8);
1017
+ --uy-color-content-success-high: var(--uy-color-green-l11);
1018
+ --uy-color-content-info: var(--uy-color-blue-l7);
1019
+ --uy-color-content-info-enabled: var(--uy-color-blue-l9);
1020
+ --uy-color-content-info-hover: var(--uy-color-blue-l10);
1021
+ --uy-color-content-info-pressed: var(--uy-color-blue-l11);
1022
+ --uy-color-content-info-focus: var(--uy-color-blue-l9);
1023
+ --uy-color-content-info-active: var(--uy-color-blue-l10);
1024
+ --uy-color-content-info-disabled: var(--uy-color-grayscale-l8);
1025
+ --uy-color-content-info-high: var(--uy-color-blue-l11);
1026
+ --uy-color-content-promo: var(--uy-color-plum-l6);
1027
+ --uy-color-content-promo-high: var(--uy-color-plum-l10);
1028
+ --uy-color-content-form-enabled: var(--uy-color-grayscale-l12);
1029
+ --uy-color-content-form-hover: var(--uy-color-grayscale-l12);
1030
+ --uy-color-content-form-pressed: var(--uy-color-grayscale-l12);
1031
+ --uy-color-content-form-focus: var(--uy-color-grayscale-l12);
1032
+ --uy-color-content-form-active: var(--uy-color-grayscale-l12);
1033
+ --uy-color-content-form-selected: var(--uy-color-grayscale-l12);
1034
+ --uy-color-content-form-disabled: var(--uy-color-grayscale-l8);
1035
+ --uy-color-content-form-read-only: var(--uy-color-grayscale-l8);
1036
+ --uy-color-content-form-invalid: var(--uy-color-red-l8);
1037
+ --uy-color-content-inverted: var(--uy-color-grayscale-l0);
1038
+ --uy-color-content-inverted-enabled: var(--uy-color-grayscale-l0);
1039
+ --uy-color-content-inverted-hover: var(--uy-color-grayscale-l0);
1040
+ --uy-color-content-inverted-pressed: var(--uy-color-grayscale-l0);
1041
+ --uy-color-content-inverted-focus: var(--uy-color-grayscale-l0);
1042
+ --uy-color-content-inverted-active: var(--uy-color-grayscale-l0);
1043
+ --uy-color-content-inverted-disabled: var(--uy-color-grayscale-l7);
1044
+ --uy-color-content-decorative-teal: var(--uy-color-teal-l6);
1045
+ --uy-color-content-decorative-teal-high: var(--uy-color-teal-l10);
1046
+ --uy-color-content-decorative-purple: var(--uy-color-purple-l6);
1047
+ --uy-color-content-decorative-purple-high: var(--uy-color-purple-l10);
1048
+ --uy-color-content-decorative-plum: var(--uy-color-plum-l6);
1049
+ --uy-color-content-decorative-plum-high: var(--uy-color-plum-l10);
1050
+ --uy-color-content-decorative-orange: var(--uy-color-orange-l6);
1051
+ --uy-color-content-decorative-orange-high: var(--uy-color-orange-l10);
1052
+ --uy-color-border-primary: var(--uy-color-plum-l7);
1053
+ --uy-color-border-primary-enabled: var(--uy-color-plum-l7);
1054
+ --uy-color-border-primary-hover: var(--uy-color-plum-l8);
1055
+ --uy-color-border-primary-pressed: var(--uy-color-plum-l9);
1056
+ --uy-color-border-primary-focus: var(--uy-color-plum-l7);
1057
+ --uy-color-border-primary-active: var(--uy-color-plum-l7);
1058
+ --uy-color-border-primary-disabled: var(--uy-color-grayscale-l4);
1059
+ --uy-color-border-primary-lowest: var(--uy-color-plum-l3);
1060
+ --uy-color-border-neutral-high: var(--uy-color-grayscale-l7);
1061
+ --uy-color-border-neutral-high-enabled: var(--uy-color-grayscale-l8);
1062
+ --uy-color-border-neutral-high-hover: var(--uy-color-grayscale-l9);
1063
+ --uy-color-border-neutral-high-pressed: var(--uy-color-grayscale-l10);
1064
+ --uy-color-border-neutral-high-focus: var(--uy-color-grayscale-l8);
1065
+ --uy-color-border-neutral-high-active: var(--uy-color-grayscale-l8);
1066
+ --uy-color-border-neutral-high-disabled: var(--uy-color-grayscale-l5);
1067
+ --uy-color-border-neutral: var(--uy-color-grayscale-l5);
1068
+ --uy-color-border-neutral-enabled: var(--uy-color-grayscale-l6);
1069
+ --uy-color-border-neutral-hover: var(--uy-color-grayscale-l6);
1070
+ --uy-color-border-neutral-active: var(--uy-color-grayscale-l7);
1071
+ --uy-color-border-neutral-pressed: var(--uy-color-grayscale-l6);
1072
+ --uy-color-border-neutral-selected: var(--uy-color-grayscale-l6);
1073
+ --uy-color-border-neutral-disabled: var(--uy-color-grayscale-l5);
1074
+ --uy-color-border-neutral-low: var(--uy-color-grayscale-l4);
1075
+ --uy-color-border-neutral-highest: var(--uy-color-grayscale-l12);
1076
+ --uy-color-border-neutral-highest-enabled: var(--uy-color-grayscale-l12);
1077
+ --uy-color-border-neutral-highest-hover: var(--uy-color-grayscale-l11);
1078
+ --uy-color-border-neutral-highest-pressed: var(--uy-color-grayscale-l12);
1079
+ --uy-color-border-neutral-highest-active: var(--uy-color-grayscale-l12);
1080
+ --uy-color-border-neutral-highest-focus: var(--uy-color-grayscale-l12);
1081
+ --uy-color-border-neutral-highest-disabled: var(--uy-color-grayscale-l4);
1082
+ --uy-color-border-danger: var(--uy-color-red-l4);
1083
+ --uy-color-border-danger-lowest: var(--uy-color-red-l2);
1084
+ --uy-color-border-warning: var(--uy-color-yellow-l4);
1085
+ --uy-color-border-warning-lowest: var(--uy-color-yellow-l2);
1086
+ --uy-color-border-success: var(--uy-color-green-l8);
1087
+ --uy-color-border-success-low: var(--uy-color-green-l4);
1088
+ --uy-color-border-success-lowest: var(--uy-color-green-l2);
1089
+ --uy-color-border-info: var(--uy-color-blue-l4);
1090
+ --uy-color-border-info-lowest: var(--uy-color-blue-l2);
1091
+ --uy-color-border-promo: var(--uy-color-plum-l4);
1092
+ --uy-color-border-promo-lowest: var(--uy-color-plum-l3);
1093
+ --uy-color-border-form-enabled: var(--uy-color-grayscale-l8);
1094
+ --uy-color-border-form-hover: var(--uy-color-grayscale-l9);
1095
+ --uy-color-border-form-pressed: var(--uy-color-grayscale-l10);
1096
+ --uy-color-border-form-focus: var(--uy-color-grayscale-l8);
1097
+ --uy-color-border-form-active: var(--uy-color-grayscale-l12);
1098
+ --uy-color-border-form-selected: var(--uy-color-plum-l6);
1099
+ --uy-color-border-form-disabled: var(--uy-color-grayscale-l5);
1100
+ --uy-color-border-form-read-only: var(--uy-color-grayscale-l5);
1101
+ --uy-color-border-form-error: var(--uy-color-red-l8);
1102
+ --uy-color-border-inverted: var(--uy-color-grayscale-l0);
1103
+ --uy-color-border-inverted-enabled: var(--uy-color-grayscale-l2);
1104
+ --uy-color-border-inverted-hover: var(--uy-color-grayscale-l3);
1105
+ --uy-color-border-inverted-pressed: var(--uy-color-grayscale-l4);
1106
+ --uy-color-border-inverted-focus: var(--uy-color-grayscale-l2);
1107
+ --uy-color-border-inverted-active: var(--uy-color-grayscale-l1);
1108
+ --uy-color-border-inverted-disabled: var(--uy-color-grayscale-l7);
1109
+ --uy-color-border-inverted-high: var(--uy-color-grayscale-l2);
1110
+ --uy-color-utility-focus-ring: var(--uy-color-blue-l7);
1111
+ --uy-color-utility-inverted-focus-ring: var(--uy-color-yellow-l4);
1112
+ --uy-shadow-100: 0px 1px 4px 1px var(--uy-color-utility-shadow-100);
1113
+ --uy-shadow-200: 0px 2px 8px 1px var(--uy-color-utility-shadow-200);
1114
+ --uy-shadow-300: 0px 5px 10px 1px var(--uy-color-utility-shadow-300);
1115
+ --uy-shadow-400: 0px 8px 18px 2px var(--uy-color-utility-shadow-400);
1116
+ --uy-shadow-500: 0px 8px 24px 4px var(--uy-color-utility-shadow-500);
1117
+ --uy-shadow-600: 0px 15px 30px 5px var(--uy-color-utility-shadow-600);
1118
+ --uy-typography-default-display-heading: var(--uy-font-weight-regular) var(--uy-text-1200)/1.1578
1119
+ var(--uy-font-serif);
1120
+ --uy-typography-sm-display-heading: var(--uy-font-weight-regular) var(--uy-text-1200)/1.1578 var(--uy-font-serif);
1121
+ --uy-typography-default-h1: var(--uy-font-weight-regular) var(--uy-text-1000)/1.125 var(--uy-font-serif);
1122
+ --uy-typography-sm-h1: var(--uy-font-weight-regular) var(--uy-text-1000)/1.125 var(--uy-font-serif);
1123
+ --uy-typography-default-h2: var(--uy-font-weight-semibold) var(--uy-text-400)/1.273 var(--uy-font-sans);
1124
+ --uy-typography-sm-h2: var(--uy-font-weight-semibold) var(--uy-text-500)/1.333 var(--uy-font-sans);
1125
+ --uy-typography-default-h3: var(--uy-font-weight-semibold) var(--uy-text-200)/1.333 var(--uy-font-sans);
1126
+ --uy-typography-sm-h3: var(--uy-font-weight-semibold) var(--uy-text-300)/1.2 var(--uy-font-sans);
1127
+ --uy-typography-default-h4: var(--uy-font-weight-semibold) var(--uy-text-100)/1.125 var(--uy-font-sans);
1128
+ --uy-typography-sm-h4: var(--uy-font-weight-semibold) var(--uy-text-200)/1.333 var(--uy-font-sans);
1129
+ --uy-typography-default-overline: var(--uy-font-weight-medium) var(--uy-text-100)/1.5 var(--uy-font-sans);
1130
+ --uy-typography-sm-overline: var(--uy-font-weight-medium) var(--uy-text-100)/1.5 var(--uy-font-sans);
1131
+ --uy-typography-default-subtitle: var(--uy-font-weight-regular) var(--uy-text-100)/1.5 var(--uy-font-sans);
1132
+ --uy-typography-sm-subtitle: var(--uy-font-weight-regular) var(--uy-text-100)/1.333 var(--uy-font-sans);
1133
+ --uy-typography-default-display-title: var(--uy-font-weight-semibold) var(--uy-text-300)/1.4 var(--uy-font-sans);
1134
+ --uy-typography-sm-display-title: var(--uy-font-weight-semibold) var(--uy-text-500)/1.333 var(--uy-font-sans);
1135
+ --uy-typography-default-display-body: var(--uy-font-weight-regular) var(--uy-text-100)/1.5 var(--uy-font-sans);
1136
+ --uy-typography-sm-display-body: var(--uy-font-weight-regular) var(--uy-text-200)/1.556 var(--uy-font-sans);
1137
+ --uy-typography-default-body: var(--uy-font-weight-regular) var(--uy-text-100)/1.5 var(--uy-font-sans);
1138
+ --uy-typography-sm-body: var(--uy-font-weight-regular) var(--uy-text-75)/1.571 var(--uy-font-sans);
1139
+ --uy-typography-default-body-strong: var(--uy-font-weight-medium) var(--uy-text-100)/1.5 var(--uy-font-sans);
1140
+ --uy-typography-sm-body-strong: var(--uy-font-weight-medium) var(--uy-text-75)/1.571 var(--uy-font-sans);
1141
+ --uy-typography-default-body-small: var(--uy-font-weight-regular) var(--uy-text-50)/1.667 var(--uy-font-sans);
1142
+ --uy-typography-sm-body-small: var(--uy-font-weight-regular) var(--uy-text-50)/1.667 var(--uy-font-sans);
1143
+ --uy-typography-default-body-small-strong: var(--uy-font-weight-medium) var(--uy-text-50)/1.667 var(--uy-font-sans);
1144
+ --uy-typography-sm-body-small-strong: var(--uy-font-weight-medium) var(--uy-text-50)/1.667 var(--uy-font-sans);
1145
+ --uy-typography-default-body-large: var(--uy-font-weight-regular) var(--uy-text-200)/1.556 var(--uy-font-sans);
1146
+ --uy-typography-sm-body-large: var(--uy-font-weight-regular) var(--uy-text-100)/1.5 var(--uy-font-sans);
1147
+ --uy-typography-default-body-large-strong: var(--uy-font-weight-medium) var(--uy-text-200)/1.556 var(--uy-font-sans);
1148
+ --uy-typography-sm-body-large-strong: var(--uy-font-weight-medium) var(--uy-text-100)/1.5 var(--uy-font-sans);
1149
+ --uy-typography-default-action: var(--uy-font-weight-medium) var(--uy-text-100)/1.5 var(--uy-font-sans);
1150
+ --uy-typography-sm-action: var(--uy-font-weight-medium) var(--uy-text-75)/1.571 var(--uy-font-sans);
1151
+ --uy-typography-default-action-small: var(--uy-font-weight-medium) var(--uy-text-50)/1.667 var(--uy-font-sans);
1152
+ --uy-typography-sm-action-small: var(--uy-font-weight-medium) var(--uy-text-50)/1.667 var(--uy-font-sans);
1153
+ --uy-typography-default-action-large: var(--uy-font-weight-medium) var(--uy-text-200)/1.556 var(--uy-font-sans);
1154
+ --uy-typography-sm-action-large: var(--uy-font-weight-medium) var(--uy-text-100)/1.5 var(--uy-font-sans);
1155
+ --uy-shadow-raising: var(--uy-shadow-100);
1156
+ --uy-shadow-floating: var(--uy-shadow-200);
1157
+ --uy-shadow-levitating: var(--uy-shadow-300);
1158
+ --uy-shadow-flying: var(--uy-shadow-400);
1159
+ --uy-shadow-soaring: var(--uy-shadow-500);
1160
+ --uy-shadow-summit: var(--uy-shadow-600);
1161
+ }
1162
+ }
1163
+
1164
+ @theme {
1165
+ --color-*: initial;
1166
+ --animate-spin: var(--uy-animate-spin);
1167
+ --animate-arc-shrink: var(--uy-animate-arc-shrink);
1168
+ --animate-pulse: var(--uy-animate-pulse);
1169
+ --animate-slide: var(--uy-animate-slide);
1170
+ --animate-fade-in: var(--uy-animate-fade-in);
1171
+ --animate-fade-out: var(--uy-animate-fade-out);
1172
+ --animate-slide-right-fade-in: var(--uy-animate-slide-right-fade-in);
1173
+ --animate-slide-right-fade-out: var(--uy-animate-slide-right-fade-out);
1174
+ --animate-slide-up-fade-in: var(--uy-animate-slide-up-fade-in);
1175
+ --animate-slide-down-fade-out: var(--uy-animate-slide-down-fade-out);
1176
+ --animate-zoom-in: var(--uy-animate-zoom-in);
1177
+ --animate-zoom-out: var(--uy-animate-zoom-out);
1178
+ --aspect-video: var(--uy-aspect-video);
1179
+ --aspect-square: var(--uy-aspect-square);
1180
+ --breakpoint-sm: 490px;
1181
+ --breakpoint-md: 768px;
1182
+ --breakpoint-lg: 1280px;
1183
+ --breakpoint-xl: 1440px;
1184
+ --text-50: var(--uy-text-50);
1185
+ --text-75: var(--uy-text-75);
1186
+ --text-100: var(--uy-text-100);
1187
+ --text-200: var(--uy-text-200);
1188
+ --text-300: var(--uy-text-300);
1189
+ --text-400: var(--uy-text-400);
1190
+ --text-500: var(--uy-text-500);
1191
+ --text-600: var(--uy-text-600);
1192
+ --text-800: var(--uy-text-800);
1193
+ --text-1000: var(--uy-text-1000);
1194
+ --text-1200: var(--uy-text-1200);
1195
+ --text-1400: var(--uy-text-1400);
1196
+ --text-1600: var(--uy-text-1600);
1197
+ --font-weight-regular: var(--uy-font-weight-regular);
1198
+ --font-weight-medium: var(--uy-font-weight-medium);
1199
+ --font-weight-semibold: var(--uy-font-weight-semibold);
1200
+ --font-weight-bold: var(--uy-font-weight-bold);
1201
+ --grid-layout-columns--default: var(--uy-grid-layout-columns--default);
1202
+ --grid-layout-gutter--default: var(--uy-grid-layout-gutter--default);
1203
+ --grid-layout-margin--default: var(--uy-grid-layout-margin--default);
1204
+ --grid-layout-columns--md: var(--uy-grid-layout-columns--md);
1205
+ --grid-layout-gutter--md: var(--uy-grid-layout-gutter--md);
1206
+ --grid-layout-margin--md: var(--uy-grid-layout-margin--md);
1207
+ --grid-layout-columns--lg: var(--uy-grid-layout-columns--lg);
1208
+ --grid-layout-gutter--lg: var(--uy-grid-layout-gutter--lg);
1209
+ --grid-layout-margin--lg: var(--uy-grid-layout-margin--lg);
1210
+ --radius-0: var(--uy-radius-0);
1211
+ --radius-25: var(--uy-radius-25);
1212
+ --radius-50: var(--uy-radius-50);
1213
+ --radius-75: var(--uy-radius-75);
1214
+ --radius-100: var(--uy-radius-100);
1215
+ --radius-125: var(--uy-radius-125);
1216
+ --radius-150: var(--uy-radius-150);
1217
+ --radius-200: var(--uy-radius-200);
1218
+ --radius-300: var(--uy-radius-300);
1219
+ --radius-400: var(--uy-radius-400);
1220
+ --radius-circle: var(--uy-radius-circle);
1221
+ --radius-pill: var(--uy-radius-pill);
1222
+ --radius-xs: var(--uy-radius-xs);
1223
+ --radius-sm: var(--uy-radius-sm);
1224
+ --radius-md: var(--uy-radius-md);
1225
+ --radius-lg: var(--uy-radius-lg);
1226
+ --radius-xl: var(--uy-radius-xl);
1227
+ --container-app-menu: 296px;
1228
+ --container-lg: 984px;
1229
+ --container-xl: 1360px;
1230
+ --container-content: 523px;
1231
+ --container-section: 703px;
1232
+ --container-page: 1063px;
1233
+ --container-app: 1439px;
1234
+ --spacing-0: var(--uy-spacing-0);
1235
+ --spacing-25: var(--uy-spacing-25);
1236
+ --spacing-50: var(--uy-spacing-50);
1237
+ --spacing-75: var(--uy-spacing-75);
1238
+ --spacing-100: var(--uy-spacing-100);
1239
+ --spacing-125: var(--uy-spacing-125);
1240
+ --spacing-150: var(--uy-spacing-150);
1241
+ --spacing-200: var(--uy-spacing-200);
1242
+ --spacing-250: var(--uy-spacing-250);
1243
+ --spacing-300: var(--uy-spacing-300);
1244
+ --spacing-400: var(--uy-spacing-400);
1245
+ --spacing-500: var(--uy-spacing-500);
1246
+ --spacing-600: var(--uy-spacing-600);
1247
+ --spacing-800: var(--uy-spacing-800);
1248
+ --spacing-1000: var(--uy-spacing-1000);
1249
+ --spacing: var(--uy-spacing);
1250
+ --color-grayscale-l1: var(--uy-color-grayscale-l1);
1251
+ --color-grayscale-l2: var(--uy-color-grayscale-l2);
1252
+ --color-grayscale-l3: var(--uy-color-grayscale-l3);
1253
+ --color-grayscale-l4: var(--uy-color-grayscale-l4);
1254
+ --color-grayscale-l5: var(--uy-color-grayscale-l5);
1255
+ --color-grayscale-l6: var(--uy-color-grayscale-l6);
1256
+ --color-grayscale-l7: var(--uy-color-grayscale-l7);
1257
+ --color-grayscale-l8: var(--uy-color-grayscale-l8);
1258
+ --color-grayscale-l9: var(--uy-color-grayscale-l9);
1259
+ --color-grayscale-l10: var(--uy-color-grayscale-l10);
1260
+ --color-grayscale-l11: var(--uy-color-grayscale-l11);
1261
+ --color-grayscale-l12: var(--uy-color-grayscale-l12);
1262
+ --color-grayscale-l0: var(--uy-color-grayscale-l0);
1263
+ --color-red-l1: var(--uy-color-red-l1);
1264
+ --color-red-l2: var(--uy-color-red-l2);
1265
+ --color-red-l3: var(--uy-color-red-l3);
1266
+ --color-red-l4: var(--uy-color-red-l4);
1267
+ --color-red-l5: var(--uy-color-red-l5);
1268
+ --color-red-l6: var(--uy-color-red-l6);
1269
+ --color-red-l7: var(--uy-color-red-l7);
1270
+ --color-red-l8: var(--uy-color-red-l8);
1271
+ --color-red-l9: var(--uy-color-red-l9);
1272
+ --color-red-l10: var(--uy-color-red-l10);
1273
+ --color-red-l11: var(--uy-color-red-l11);
1274
+ --color-red-l12: var(--uy-color-red-l12);
1275
+ --color-green-l1: var(--uy-color-green-l1);
1276
+ --color-green-l2: var(--uy-color-green-l2);
1277
+ --color-green-l3: var(--uy-color-green-l3);
1278
+ --color-green-l4: var(--uy-color-green-l4);
1279
+ --color-green-l5: var(--uy-color-green-l5);
1280
+ --color-green-l6: var(--uy-color-green-l6);
1281
+ --color-green-l7: var(--uy-color-green-l7);
1282
+ --color-green-l8: var(--uy-color-green-l8);
1283
+ --color-green-l9: var(--uy-color-green-l9);
1284
+ --color-green-l10: var(--uy-color-green-l10);
1285
+ --color-green-l11: var(--uy-color-green-l11);
1286
+ --color-green-l12: var(--uy-color-green-l12);
1287
+ --color-yellow-l1: var(--uy-color-yellow-l1);
1288
+ --color-yellow-l2: var(--uy-color-yellow-l2);
1289
+ --color-yellow-l3: var(--uy-color-yellow-l3);
1290
+ --color-yellow-l4: var(--uy-color-yellow-l4);
1291
+ --color-yellow-l5: var(--uy-color-yellow-l5);
1292
+ --color-yellow-l6: var(--uy-color-yellow-l6);
1293
+ --color-yellow-l7: var(--uy-color-yellow-l7);
1294
+ --color-yellow-l8: var(--uy-color-yellow-l8);
1295
+ --color-yellow-l9: var(--uy-color-yellow-l9);
1296
+ --color-yellow-l10: var(--uy-color-yellow-l10);
1297
+ --color-yellow-l11: var(--uy-color-yellow-l11);
1298
+ --color-yellow-l12: var(--uy-color-yellow-l12);
1299
+ --color-cyan-l1: var(--uy-color-cyan-l1);
1300
+ --color-cyan-l2: var(--uy-color-cyan-l2);
1301
+ --color-cyan-l3: var(--uy-color-cyan-l3);
1302
+ --color-cyan-l4: var(--uy-color-cyan-l4);
1303
+ --color-cyan-l5: var(--uy-color-cyan-l5);
1304
+ --color-cyan-l6: var(--uy-color-cyan-l6);
1305
+ --color-cyan-l7: var(--uy-color-cyan-l7);
1306
+ --color-cyan-l8: var(--uy-color-cyan-l8);
1307
+ --color-cyan-l9: var(--uy-color-cyan-l9);
1308
+ --color-cyan-l10: var(--uy-color-cyan-l10);
1309
+ --color-cyan-l11: var(--uy-color-cyan-l11);
1310
+ --color-cyan-l12: var(--uy-color-cyan-l12);
1311
+ --color-blue-l1: var(--uy-color-blue-l1);
1312
+ --color-blue-l2: var(--uy-color-blue-l2);
1313
+ --color-blue-l3: var(--uy-color-blue-l3);
1314
+ --color-blue-l4: var(--uy-color-blue-l4);
1315
+ --color-blue-l5: var(--uy-color-blue-l5);
1316
+ --color-blue-l6: var(--uy-color-blue-l6);
1317
+ --color-blue-l7: var(--uy-color-blue-l7);
1318
+ --color-blue-l8: var(--uy-color-blue-l8);
1319
+ --color-blue-l9: var(--uy-color-blue-l9);
1320
+ --color-blue-l10: var(--uy-color-blue-l10);
1321
+ --color-blue-l11: var(--uy-color-blue-l11);
1322
+ --color-blue-l12: var(--uy-color-blue-l12);
1323
+ --color-purple-l1: var(--uy-color-purple-l1);
1324
+ --color-purple-l2: var(--uy-color-purple-l2);
1325
+ --color-purple-l3: var(--uy-color-purple-l3);
1326
+ --color-purple-l4: var(--uy-color-purple-l4);
1327
+ --color-purple-l5: var(--uy-color-purple-l5);
1328
+ --color-purple-l6: var(--uy-color-purple-l6);
1329
+ --color-purple-l7: var(--uy-color-purple-l7);
1330
+ --color-purple-l8: var(--uy-color-purple-l8);
1331
+ --color-purple-l9: var(--uy-color-purple-l9);
1332
+ --color-purple-l10: var(--uy-color-purple-l10);
1333
+ --color-purple-l11: var(--uy-color-purple-l11);
1334
+ --color-purple-l12: var(--uy-color-purple-l12);
1335
+ --color-plum-l1: var(--uy-color-plum-l1);
1336
+ --color-plum-l2: var(--uy-color-plum-l2);
1337
+ --color-plum-l3: var(--uy-color-plum-l3);
1338
+ --color-plum-l4: var(--uy-color-plum-l4);
1339
+ --color-plum-l5: var(--uy-color-plum-l5);
1340
+ --color-plum-l6: var(--uy-color-plum-l6);
1341
+ --color-plum-l7: var(--uy-color-plum-l7);
1342
+ --color-plum-l8: var(--uy-color-plum-l8);
1343
+ --color-plum-l9: var(--uy-color-plum-l9);
1344
+ --color-plum-l10: var(--uy-color-plum-l10);
1345
+ --color-plum-l11: var(--uy-color-plum-l11);
1346
+ --color-plum-l12: var(--uy-color-plum-l12);
1347
+ --color-peach-l1: var(--uy-color-peach-l1);
1348
+ --color-peach-l2: var(--uy-color-peach-l2);
1349
+ --color-peach-l3: var(--uy-color-peach-l3);
1350
+ --color-peach-l9: var(--uy-color-peach-l9);
1351
+ --color-peach-l10: var(--uy-color-peach-l10);
1352
+ --color-peach-l11: var(--uy-color-peach-l11);
1353
+ --color-peach-l12: var(--uy-color-peach-l12);
1354
+ --color-sunglow-l1: var(--uy-color-sunglow-l1);
1355
+ --color-sunglow-l2: var(--uy-color-sunglow-l2);
1356
+ --color-sunglow-l3: var(--uy-color-sunglow-l3);
1357
+ --color-sunglow-l9: var(--uy-color-sunglow-l9);
1358
+ --color-sunglow-l10: var(--uy-color-sunglow-l10);
1359
+ --color-sunglow-l11: var(--uy-color-sunglow-l11);
1360
+ --color-sunglow-l12: var(--uy-color-sunglow-l12);
1361
+ --color-teal-l1: var(--uy-color-teal-l1);
1362
+ --color-teal-l2: var(--uy-color-teal-l2);
1363
+ --color-teal-l3: var(--uy-color-teal-l3);
1364
+ --color-teal-l4: var(--uy-color-teal-l4);
1365
+ --color-teal-l5: var(--uy-color-teal-l5);
1366
+ --color-teal-l6: var(--uy-color-teal-l6);
1367
+ --color-teal-l7: var(--uy-color-teal-l7);
1368
+ --color-teal-l8: var(--uy-color-teal-l8);
1369
+ --color-teal-l9: var(--uy-color-teal-l9);
1370
+ --color-teal-l10: var(--uy-color-teal-l10);
1371
+ --color-teal-l11: var(--uy-color-teal-l11);
1372
+ --color-teal-l12: var(--uy-color-teal-l12);
1373
+ --color-orange-l1: var(--uy-color-orange-l1);
1374
+ --color-orange-l2: var(--uy-color-orange-l2);
1375
+ --color-orange-l3: var(--uy-color-orange-l3);
1376
+ --color-orange-l4: var(--uy-color-orange-l4);
1377
+ --color-orange-l5: var(--uy-color-orange-l5);
1378
+ --color-orange-l6: var(--uy-color-orange-l6);
1379
+ --color-orange-l7: var(--uy-color-orange-l7);
1380
+ --color-orange-l8: var(--uy-color-orange-l8);
1381
+ --color-orange-l9: var(--uy-color-orange-l9);
1382
+ --color-orange-l10: var(--uy-color-orange-l10);
1383
+ --color-orange-l11: var(--uy-color-orange-l11);
1384
+ --color-orange-l12: var(--uy-color-orange-l12);
1385
+ --color-canvas: var(--uy-color-canvas);
1386
+ --color-surface-primary-highest: var(--uy-color-surface-primary-highest);
1387
+ --color-surface-primary-high: var(--uy-color-surface-primary-high);
1388
+ --color-surface-primary: var(--uy-color-surface-primary);
1389
+ --color-surface-primary-enabled: var(--uy-color-surface-primary-enabled);
1390
+ --color-surface-primary-hover: var(--uy-color-surface-primary-hover);
1391
+ --color-surface-primary-pressed: var(--uy-color-surface-primary-pressed);
1392
+ --color-surface-primary-focus: var(--uy-color-surface-primary-focus);
1393
+ --color-surface-primary-active: var(--uy-color-surface-primary-active);
1394
+ --color-surface-primary-disabled: var(--uy-color-surface-primary-disabled);
1395
+ --color-surface-primary-low: var(--uy-color-surface-primary-low);
1396
+ --color-surface-primary-lowest: var(--uy-color-surface-primary-lowest);
1397
+ --color-surface-primary-lowest-enabled: var(--uy-color-surface-primary-lowest-enabled);
1398
+ --color-surface-primary-lowest-hover: var(--uy-color-surface-primary-lowest-hover);
1399
+ --color-surface-primary-lowest-pressed: var(--uy-color-surface-primary-lowest-pressed);
1400
+ --color-surface-primary-lowest-focus: var(--uy-color-surface-primary-lowest-focus);
1401
+ --color-surface-primary-lowest-active: var(--uy-color-surface-primary-lowest-active);
1402
+ --color-surface-primary-lowest-disabled: var(--uy-color-surface-primary-lowest-disabled);
1403
+ --color-surface-neutral: var(--uy-color-surface-neutral);
1404
+ --color-surface-neutral-enabled: var(--uy-color-surface-neutral-enabled);
1405
+ --color-surface-neutral-hover: var(--uy-color-surface-neutral-hover);
1406
+ --color-surface-neutral-pressed: var(--uy-color-surface-neutral-pressed);
1407
+ --color-surface-neutral-focus: var(--uy-color-surface-neutral-focus);
1408
+ --color-surface-neutral-active: var(--uy-color-surface-neutral-active);
1409
+ --color-surface-neutral-selected: var(--uy-color-surface-neutral-selected);
1410
+ --color-surface-neutral-disabled: var(--uy-color-surface-neutral-disabled);
1411
+ --color-surface-neutral-low: var(--uy-color-surface-neutral-low);
1412
+ --color-surface-neutral-low-enabled: var(--uy-color-surface-neutral-low-enabled);
1413
+ --color-surface-neutral-low-hover: var(--uy-color-surface-neutral-low-hover);
1414
+ --color-surface-neutral-low-pressed: var(--uy-color-surface-neutral-low-pressed);
1415
+ --color-surface-neutral-low-focus: var(--uy-color-surface-neutral-low-focus);
1416
+ --color-surface-neutral-low-active: var(--uy-color-surface-neutral-low-active);
1417
+ --color-surface-neutral-low-disabled: var(--uy-color-surface-neutral-low-disabled);
1418
+ --color-surface-neutral-low-selected: var(--uy-color-surface-neutral-low-selected);
1419
+ --color-surface-neutral-lowest: var(--uy-color-surface-neutral-lowest);
1420
+ --color-surface-neutral-lowest-enabled: var(--uy-color-surface-neutral-lowest-enabled);
1421
+ --color-surface-neutral-lowest-hover: var(--uy-color-surface-neutral-lowest-hover);
1422
+ --color-surface-neutral-lowest-pressed: var(--uy-color-surface-neutral-lowest-pressed);
1423
+ --color-surface-neutral-lowest-focus: var(--uy-color-surface-neutral-lowest-focus);
1424
+ --color-surface-neutral-lowest-active: var(--uy-color-surface-neutral-lowest-active);
1425
+ --color-surface-neutral-lowest-disabled: var(--uy-color-surface-neutral-lowest-disabled);
1426
+ --color-surface-neutral-lowest-selected: var(--uy-color-surface-neutral-lowest-selected);
1427
+ --color-surface-neutral-highest: var(--uy-color-surface-neutral-highest);
1428
+ --color-surface-neutral-highest-enabled: var(--uy-color-surface-neutral-highest-enabled);
1429
+ --color-surface-neutral-highest-hover: var(--uy-color-surface-neutral-highest-hover);
1430
+ --color-surface-neutral-highest-pressed: var(--uy-color-surface-neutral-highest-pressed);
1431
+ --color-surface-neutral-highest-active: var(--uy-color-surface-neutral-highest-active);
1432
+ --color-surface-neutral-highest-focus: var(--uy-color-surface-neutral-highest-focus);
1433
+ --color-surface-neutral-highest-disabled: var(--uy-color-surface-neutral-highest-disabled);
1434
+ --color-surface-neutral-highest-selected: var(--uy-color-surface-neutral-highest-selected);
1435
+ --color-surface-danger: var(--uy-color-surface-danger);
1436
+ --color-surface-danger-enabled: var(--uy-color-surface-danger-enabled);
1437
+ --color-surface-danger-hover: var(--uy-color-surface-danger-hover);
1438
+ --color-surface-danger-pressed: var(--uy-color-surface-danger-pressed);
1439
+ --color-surface-danger-focus: var(--uy-color-surface-danger-focus);
1440
+ --color-surface-danger-active: var(--uy-color-surface-danger-active);
1441
+ --color-surface-danger-disabled: var(--uy-color-surface-danger-disabled);
1442
+ --color-surface-danger-low: var(--uy-color-surface-danger-low);
1443
+ --color-surface-danger-lowest: var(--uy-color-surface-danger-lowest);
1444
+ --color-surface-danger-lowest-enabled: var(--uy-color-surface-danger-lowest-enabled);
1445
+ --color-surface-danger-lowest-hover: var(--uy-color-surface-danger-lowest-hover);
1446
+ --color-surface-danger-lowest-pressed: var(--uy-color-surface-danger-lowest-pressed);
1447
+ --color-surface-danger-lowest-focus: var(--uy-color-surface-danger-lowest-focus);
1448
+ --color-surface-danger-lowest-active: var(--uy-color-surface-danger-lowest-active);
1449
+ --color-surface-danger-lowest-disabled: var(--uy-color-surface-danger-lowest-disabled);
1450
+ --color-surface-warning: var(--uy-color-surface-warning);
1451
+ --color-surface-warning-enabled: var(--uy-color-surface-warning-enabled);
1452
+ --color-surface-warning-hover: var(--uy-color-surface-warning-hover);
1453
+ --color-surface-warning-pressed: var(--uy-color-surface-warning-pressed);
1454
+ --color-surface-warning-focus: var(--uy-color-surface-warning-focus);
1455
+ --color-surface-warning-active: var(--uy-color-surface-warning-active);
1456
+ --color-surface-warning-disabled: var(--uy-color-surface-warning-disabled);
1457
+ --color-surface-warning-low: var(--uy-color-surface-warning-low);
1458
+ --color-surface-warning-lowest: var(--uy-color-surface-warning-lowest);
1459
+ --color-surface-warning-lowest-enabled: var(--uy-color-surface-warning-lowest-enabled);
1460
+ --color-surface-warning-lowest-hover: var(--uy-color-surface-warning-lowest-hover);
1461
+ --color-surface-warning-lowest-pressed: var(--uy-color-surface-warning-lowest-pressed);
1462
+ --color-surface-warning-lowest-focus: var(--uy-color-surface-warning-lowest-focus);
1463
+ --color-surface-warning-lowest-active: var(--uy-color-surface-warning-lowest-active);
1464
+ --color-surface-warning-lowest-disabled: var(--uy-color-surface-warning-lowest-disabled);
1465
+ --color-surface-success: var(--uy-color-surface-success);
1466
+ --color-surface-success-low: var(--uy-color-surface-success-low);
1467
+ --color-surface-success-lowest: var(--uy-color-surface-success-lowest);
1468
+ --color-surface-success-lowest-enabled: var(--uy-color-surface-success-lowest-enabled);
1469
+ --color-surface-success-lowest-hover: var(--uy-color-surface-success-lowest-hover);
1470
+ --color-surface-success-lowest-pressed: var(--uy-color-surface-success-lowest-pressed);
1471
+ --color-surface-success-lowest-focus: var(--uy-color-surface-success-lowest-focus);
1472
+ --color-surface-success-lowest-active: var(--uy-color-surface-success-lowest-active);
1473
+ --color-surface-success-lowest-disabled: var(--uy-color-surface-success-lowest-disabled);
1474
+ --color-surface-info: var(--uy-color-surface-info);
1475
+ --color-surface-info-low: var(--uy-color-surface-info-low);
1476
+ --color-surface-info-lowest: var(--uy-color-surface-info-lowest);
1477
+ --color-surface-info-lowest-enabled: var(--uy-color-surface-info-lowest-enabled);
1478
+ --color-surface-info-lowest-hover: var(--uy-color-surface-info-lowest-hover);
1479
+ --color-surface-info-lowest-pressed: var(--uy-color-surface-info-lowest-pressed);
1480
+ --color-surface-info-lowest-focus: var(--uy-color-surface-info-lowest-focus);
1481
+ --color-surface-info-lowest-active: var(--uy-color-surface-info-lowest-active);
1482
+ --color-surface-info-lowest-disabled: var(--uy-color-surface-info-lowest-disabled);
1483
+ --color-surface-promo: var(--uy-color-surface-promo);
1484
+ --color-surface-promo-low: var(--uy-color-surface-promo-low);
1485
+ --color-surface-promo-lowest: var(--uy-color-surface-promo-lowest);
1486
+ --color-surface-ai-low: var(--uy-color-surface-ai-low);
1487
+ --color-surface-form-enabled: var(--uy-color-surface-form-enabled);
1488
+ --color-surface-form-hover: var(--uy-color-surface-form-hover);
1489
+ --color-surface-form-pressed: var(--uy-color-surface-form-pressed);
1490
+ --color-surface-form-focus: var(--uy-color-surface-form-focus);
1491
+ --color-surface-form-active: var(--uy-color-surface-form-active);
1492
+ --color-surface-form-selected: var(--uy-color-surface-form-selected);
1493
+ --color-surface-form-disabled: var(--uy-color-surface-form-disabled);
1494
+ --color-surface-form-read-only: var(--uy-color-surface-form-read-only);
1495
+ --color-surface-form-error: var(--uy-color-surface-form-error);
1496
+ --color-surface-form-high-enabled: var(--uy-color-surface-form-high-enabled);
1497
+ --color-surface-form-high-hover: var(--uy-color-surface-form-high-hover);
1498
+ --color-surface-form-high-pressed: var(--uy-color-surface-form-high-pressed);
1499
+ --color-surface-form-high-focus: var(--uy-color-surface-form-high-focus);
1500
+ --color-surface-form-high-active: var(--uy-color-surface-form-high-active);
1501
+ --color-surface-form-high-selected: var(--uy-color-surface-form-high-selected);
1502
+ --color-surface-form-high-disabled: var(--uy-color-surface-form-high-disabled);
1503
+ --color-surface-form-high-read-only: var(--uy-color-surface-form-high-read-only);
1504
+ --color-surface-form-high-error: var(--uy-color-surface-form-high-error);
1505
+ --color-surface-inverted: var(--uy-color-surface-inverted);
1506
+ --color-surface-inverted-enabled: var(--uy-color-surface-inverted-enabled);
1507
+ --color-surface-inverted-hover: var(--uy-color-surface-inverted-hover);
1508
+ --color-surface-inverted-pressed: var(--uy-color-surface-inverted-pressed);
1509
+ --color-surface-inverted-focus: var(--uy-color-surface-inverted-focus);
1510
+ --color-surface-inverted-active: var(--uy-color-surface-inverted-active);
1511
+ --color-surface-inverted-low-enabled: var(--uy-color-surface-inverted-low-enabled);
1512
+ --color-surface-inverted-low-hover: var(--uy-color-surface-inverted-low-hover);
1513
+ --color-surface-inverted-low-pressed: var(--uy-color-surface-inverted-low-pressed);
1514
+ --color-surface-inverted-low-active: var(--uy-color-surface-inverted-low-active);
1515
+ --color-surface-inverted-low-focus: var(--uy-color-surface-inverted-low-focus);
1516
+ --color-surface-inverted-low-disabled: var(--uy-color-surface-inverted-low-disabled);
1517
+ --color-surface-decorative-teal: var(--uy-color-surface-decorative-teal);
1518
+ --color-surface-decorative-teal-high: var(--uy-color-surface-decorative-teal-high);
1519
+ --color-surface-decorative-teal-low: var(--uy-color-surface-decorative-teal-low);
1520
+ --color-surface-decorative-teal-lowest: var(--uy-color-surface-decorative-teal-lowest);
1521
+ --color-surface-decorative-purple-high: var(--uy-color-surface-decorative-purple-high);
1522
+ --color-surface-decorative-purple: var(--uy-color-surface-decorative-purple);
1523
+ --color-surface-decorative-purple-low: var(--uy-color-surface-decorative-purple-low);
1524
+ --color-surface-decorative-purple-lowest: var(--uy-color-surface-decorative-purple-lowest);
1525
+ --color-surface-decorative-plum: var(--uy-color-surface-decorative-plum);
1526
+ --color-surface-decorative-plum-high: var(--uy-color-surface-decorative-plum-high);
1527
+ --color-surface-decorative-plum-low: var(--uy-color-surface-decorative-plum-low);
1528
+ --color-surface-decorative-plum-lowest: var(--uy-color-surface-decorative-plum-lowest);
1529
+ --color-surface-decorative-orange: var(--uy-color-surface-decorative-orange);
1530
+ --color-surface-decorative-orange-high: var(--uy-color-surface-decorative-orange-high);
1531
+ --color-surface-decorative-orange-low: var(--uy-color-surface-decorative-orange-low);
1532
+ --color-surface-decorative-orange-lowest: var(--uy-color-surface-decorative-orange-lowest);
1533
+ --color-content-primary: var(--uy-color-content-primary);
1534
+ --color-content-primary-enabled: var(--uy-color-content-primary-enabled);
1535
+ --color-content-primary-hover: var(--uy-color-content-primary-hover);
1536
+ --color-content-primary-pressed: var(--uy-color-content-primary-pressed);
1537
+ --color-content-primary-focus: var(--uy-color-content-primary-focus);
1538
+ --color-content-primary-active: var(--uy-color-content-primary-active);
1539
+ --color-content-primary-disabled: var(--uy-color-content-primary-disabled);
1540
+ --color-content-primary-high: var(--uy-color-content-primary-high);
1541
+ --color-content-neutral: var(--uy-color-content-neutral);
1542
+ --color-content-neutral-enabled: var(--uy-color-content-neutral-enabled);
1543
+ --color-content-neutral-hover: var(--uy-color-content-neutral-hover);
1544
+ --color-content-neutral-pressed: var(--uy-color-content-neutral-pressed);
1545
+ --color-content-neutral-focus: var(--uy-color-content-neutral-focus);
1546
+ --color-content-neutral-active: var(--uy-color-content-neutral-active);
1547
+ --color-content-neutral-disabled: var(--uy-color-content-neutral-disabled);
1548
+ --color-content-neutral-low: var(--uy-color-content-neutral-low);
1549
+ --color-content-neutral-lowest: var(--uy-color-content-neutral-lowest);
1550
+ --color-content-neutral-lowest-enabled: var(--uy-color-content-neutral-lowest-enabled);
1551
+ --color-content-neutral-lowest-hover: var(--uy-color-content-neutral-lowest-hover);
1552
+ --color-content-neutral-lowest-pressed: var(--uy-color-content-neutral-lowest-pressed);
1553
+ --color-content-neutral-lowest-focus: var(--uy-color-content-neutral-lowest-focus);
1554
+ --color-content-neutral-lowest-active: var(--uy-color-content-neutral-lowest-active);
1555
+ --color-content-neutral-lowest-disabled: var(--uy-color-content-neutral-lowest-disabled);
1556
+ --color-content-danger: var(--uy-color-content-danger);
1557
+ --color-content-danger-enabled: var(--uy-color-content-danger-enabled);
1558
+ --color-content-danger-hover: var(--uy-color-content-danger-hover);
1559
+ --color-content-danger-pressed: var(--uy-color-content-danger-pressed);
1560
+ --color-content-danger-focus: var(--uy-color-content-danger-focus);
1561
+ --color-content-danger-active: var(--uy-color-content-danger-active);
1562
+ --color-content-danger-disabled: var(--uy-color-content-danger-disabled);
1563
+ --color-content-danger-high: var(--uy-color-content-danger-high);
1564
+ --color-content-warning: var(--uy-color-content-warning);
1565
+ --color-content-warning-enabled: var(--uy-color-content-warning-enabled);
1566
+ --color-content-warning-hover: var(--uy-color-content-warning-hover);
1567
+ --color-content-warning-pressed: var(--uy-color-content-warning-pressed);
1568
+ --color-content-warning-focus: var(--uy-color-content-warning-focus);
1569
+ --color-content-warning-active: var(--uy-color-content-warning-active);
1570
+ --color-content-warning-disabled: var(--uy-color-content-warning-disabled);
1571
+ --color-content-warning-high: var(--uy-color-content-warning-high);
1572
+ --color-content-success: var(--uy-color-content-success);
1573
+ --color-content-success-enabled: var(--uy-color-content-success-enabled);
1574
+ --color-content-success-hover: var(--uy-color-content-success-hover);
1575
+ --color-content-success-pressed: var(--uy-color-content-success-pressed);
1576
+ --color-content-success-focus: var(--uy-color-content-success-focus);
1577
+ --color-content-success-active: var(--uy-color-content-success-active);
1578
+ --color-content-success-disabled: var(--uy-color-content-success-disabled);
1579
+ --color-content-success-high: var(--uy-color-content-success-high);
1580
+ --color-content-info: var(--uy-color-content-info);
1581
+ --color-content-info-enabled: var(--uy-color-content-info-enabled);
1582
+ --color-content-info-hover: var(--uy-color-content-info-hover);
1583
+ --color-content-info-pressed: var(--uy-color-content-info-pressed);
1584
+ --color-content-info-focus: var(--uy-color-content-info-focus);
1585
+ --color-content-info-active: var(--uy-color-content-info-active);
1586
+ --color-content-info-disabled: var(--uy-color-content-info-disabled);
1587
+ --color-content-info-high: var(--uy-color-content-info-high);
1588
+ --color-content-promo: var(--uy-color-content-promo);
1589
+ --color-content-promo-high: var(--uy-color-content-promo-high);
1590
+ --color-content-form-enabled: var(--uy-color-content-form-enabled);
1591
+ --color-content-form-hover: var(--uy-color-content-form-hover);
1592
+ --color-content-form-pressed: var(--uy-color-content-form-pressed);
1593
+ --color-content-form-focus: var(--uy-color-content-form-focus);
1594
+ --color-content-form-active: var(--uy-color-content-form-active);
1595
+ --color-content-form-selected: var(--uy-color-content-form-selected);
1596
+ --color-content-form-disabled: var(--uy-color-content-form-disabled);
1597
+ --color-content-form-read-only: var(--uy-color-content-form-read-only);
1598
+ --color-content-form-invalid: var(--uy-color-content-form-invalid);
1599
+ --color-content-inverted: var(--uy-color-content-inverted);
1600
+ --color-content-inverted-enabled: var(--uy-color-content-inverted-enabled);
1601
+ --color-content-inverted-hover: var(--uy-color-content-inverted-hover);
1602
+ --color-content-inverted-pressed: var(--uy-color-content-inverted-pressed);
1603
+ --color-content-inverted-focus: var(--uy-color-content-inverted-focus);
1604
+ --color-content-inverted-active: var(--uy-color-content-inverted-active);
1605
+ --color-content-inverted-disabled: var(--uy-color-content-inverted-disabled);
1606
+ --color-content-decorative-teal: var(--uy-color-content-decorative-teal);
1607
+ --color-content-decorative-teal-high: var(--uy-color-content-decorative-teal-high);
1608
+ --color-content-decorative-purple: var(--uy-color-content-decorative-purple);
1609
+ --color-content-decorative-purple-high: var(--uy-color-content-decorative-purple-high);
1610
+ --color-content-decorative-plum: var(--uy-color-content-decorative-plum);
1611
+ --color-content-decorative-plum-high: var(--uy-color-content-decorative-plum-high);
1612
+ --color-content-decorative-orange: var(--uy-color-content-decorative-orange);
1613
+ --color-content-decorative-orange-high: var(--uy-color-content-decorative-orange-high);
1614
+ --color-border-primary: var(--uy-color-border-primary);
1615
+ --color-border-primary-enabled: var(--uy-color-border-primary-enabled);
1616
+ --color-border-primary-hover: var(--uy-color-border-primary-hover);
1617
+ --color-border-primary-pressed: var(--uy-color-border-primary-pressed);
1618
+ --color-border-primary-focus: var(--uy-color-border-primary-focus);
1619
+ --color-border-primary-active: var(--uy-color-border-primary-active);
1620
+ --color-border-primary-disabled: var(--uy-color-border-primary-disabled);
1621
+ --color-border-primary-lowest: var(--uy-color-border-primary-lowest);
1622
+ --color-border-neutral-high: var(--uy-color-border-neutral-high);
1623
+ --color-border-neutral-high-enabled: var(--uy-color-border-neutral-high-enabled);
1624
+ --color-border-neutral-high-hover: var(--uy-color-border-neutral-high-hover);
1625
+ --color-border-neutral-high-pressed: var(--uy-color-border-neutral-high-pressed);
1626
+ --color-border-neutral-high-focus: var(--uy-color-border-neutral-high-focus);
1627
+ --color-border-neutral-high-active: var(--uy-color-border-neutral-high-active);
1628
+ --color-border-neutral-high-disabled: var(--uy-color-border-neutral-high-disabled);
1629
+ --color-border-neutral: var(--uy-color-border-neutral);
1630
+ --color-border-neutral-enabled: var(--uy-color-border-neutral-enabled);
1631
+ --color-border-neutral-hover: var(--uy-color-border-neutral-hover);
1632
+ --color-border-neutral-active: var(--uy-color-border-neutral-active);
1633
+ --color-border-neutral-pressed: var(--uy-color-border-neutral-pressed);
1634
+ --color-border-neutral-selected: var(--uy-color-border-neutral-selected);
1635
+ --color-border-neutral-disabled: var(--uy-color-border-neutral-disabled);
1636
+ --color-border-neutral-low: var(--uy-color-border-neutral-low);
1637
+ --color-border-neutral-highest: var(--uy-color-border-neutral-highest);
1638
+ --color-border-neutral-highest-enabled: var(--uy-color-border-neutral-highest-enabled);
1639
+ --color-border-neutral-highest-hover: var(--uy-color-border-neutral-highest-hover);
1640
+ --color-border-neutral-highest-pressed: var(--uy-color-border-neutral-highest-pressed);
1641
+ --color-border-neutral-highest-active: var(--uy-color-border-neutral-highest-active);
1642
+ --color-border-neutral-highest-focus: var(--uy-color-border-neutral-highest-focus);
1643
+ --color-border-neutral-highest-disabled: var(--uy-color-border-neutral-highest-disabled);
1644
+ --color-border-danger: var(--uy-color-border-danger);
1645
+ --color-border-danger-lowest: var(--uy-color-border-danger-lowest);
1646
+ --color-border-warning: var(--uy-color-border-warning);
1647
+ --color-border-warning-lowest: var(--uy-color-border-warning-lowest);
1648
+ --color-border-success: var(--uy-color-border-success);
1649
+ --color-border-success-low: var(--uy-color-border-success-low);
1650
+ --color-border-success-lowest: var(--uy-color-border-success-lowest);
1651
+ --color-border-info: var(--uy-color-border-info);
1652
+ --color-border-info-lowest: var(--uy-color-border-info-lowest);
1653
+ --color-border-promo: var(--uy-color-border-promo);
1654
+ --color-border-promo-lowest: var(--uy-color-border-promo-lowest);
1655
+ --color-border-form-enabled: var(--uy-color-border-form-enabled);
1656
+ --color-border-form-hover: var(--uy-color-border-form-hover);
1657
+ --color-border-form-pressed: var(--uy-color-border-form-pressed);
1658
+ --color-border-form-focus: var(--uy-color-border-form-focus);
1659
+ --color-border-form-active: var(--uy-color-border-form-active);
1660
+ --color-border-form-selected: var(--uy-color-border-form-selected);
1661
+ --color-border-form-disabled: var(--uy-color-border-form-disabled);
1662
+ --color-border-form-read-only: var(--uy-color-border-form-read-only);
1663
+ --color-border-form-error: var(--uy-color-border-form-error);
1664
+ --color-border-inverted: var(--uy-color-border-inverted);
1665
+ --color-border-inverted-enabled: var(--uy-color-border-inverted-enabled);
1666
+ --color-border-inverted-hover: var(--uy-color-border-inverted-hover);
1667
+ --color-border-inverted-pressed: var(--uy-color-border-inverted-pressed);
1668
+ --color-border-inverted-focus: var(--uy-color-border-inverted-focus);
1669
+ --color-border-inverted-active: var(--uy-color-border-inverted-active);
1670
+ --color-border-inverted-disabled: var(--uy-color-border-inverted-disabled);
1671
+ --color-border-inverted-high: var(--uy-color-border-inverted-high);
1672
+ --color-utility-focus-ring: var(--uy-color-utility-focus-ring);
1673
+ --color-utility-inverted-focus-ring: var(--uy-color-utility-inverted-focus-ring);
1674
+ --color-utility-backdrop: var(--uy-color-utility-backdrop);
1675
+ --color-utility-shadow-100: var(--uy-color-utility-shadow-100);
1676
+ --color-utility-shadow-200: var(--uy-color-utility-shadow-200);
1677
+ --color-utility-shadow-300: var(--uy-color-utility-shadow-300);
1678
+ --color-utility-shadow-400: var(--uy-color-utility-shadow-400);
1679
+ --color-utility-shadow-500: var(--uy-color-utility-shadow-500);
1680
+ --color-utility-shadow-600: var(--uy-color-utility-shadow-600);
1681
+ --shadow-100: var(--uy-shadow-100);
1682
+ --shadow-200: var(--uy-shadow-200);
1683
+ --shadow-300: var(--uy-shadow-300);
1684
+ --shadow-400: var(--uy-shadow-400);
1685
+ --shadow-500: var(--uy-shadow-500);
1686
+ --shadow-600: var(--uy-shadow-600);
1687
+ --shadow-canvas: var(--uy-shadow-canvas);
1688
+ --shadow-raising: var(--uy-shadow-raising);
1689
+ --shadow-floating: var(--uy-shadow-floating);
1690
+ --shadow-levitating: var(--uy-shadow-levitating);
1691
+ --shadow-flying: var(--uy-shadow-flying);
1692
+ --shadow-soaring: var(--uy-shadow-soaring);
1693
+ --shadow-summit: var(--uy-shadow-summit);
1694
+ --font-serif: var(--uy-font-serif);
1695
+ --font-sans: var(--uy-font-sans);
1696
+ --font-mono: var(--uy-font-mono);
1697
+ --typography-default-display-heading: var(--uy-typography-default-display-heading);
1698
+ --typography-sm-display-heading: var(--uy-typography-sm-display-heading);
1699
+ --typography-default-h1: var(--uy-typography-default-h1);
1700
+ --typography-sm-h1: var(--uy-typography-sm-h1);
1701
+ --typography-default-h2: var(--uy-typography-default-h2);
1702
+ --typography-sm-h2: var(--uy-typography-sm-h2);
1703
+ --typography-default-h3: var(--uy-typography-default-h3);
1704
+ --typography-sm-h3: var(--uy-typography-sm-h3);
1705
+ --typography-default-h4: var(--uy-typography-default-h4);
1706
+ --typography-sm-h4: var(--uy-typography-sm-h4);
1707
+ --typography-default-overline: var(--uy-typography-default-overline);
1708
+ --typography-sm-overline: var(--uy-typography-sm-overline);
1709
+ --typography-default-subtitle: var(--uy-typography-default-subtitle);
1710
+ --typography-sm-subtitle: var(--uy-typography-sm-subtitle);
1711
+ --typography-default-display-title: var(--uy-typography-default-display-title);
1712
+ --typography-sm-display-title: var(--uy-typography-sm-display-title);
1713
+ --typography-default-display-body: var(--uy-typography-default-display-body);
1714
+ --typography-sm-display-body: var(--uy-typography-sm-display-body);
1715
+ --typography-default-body: var(--uy-typography-default-body);
1716
+ --typography-sm-body: var(--uy-typography-sm-body);
1717
+ --typography-default-body-strong: var(--uy-typography-default-body-strong);
1718
+ --typography-sm-body-strong: var(--uy-typography-sm-body-strong);
1719
+ --typography-default-body-small: var(--uy-typography-default-body-small);
1720
+ --typography-sm-body-small: var(--uy-typography-sm-body-small);
1721
+ --typography-default-body-small-strong: var(--uy-typography-default-body-small-strong);
1722
+ --typography-sm-body-small-strong: var(--uy-typography-sm-body-small-strong);
1723
+ --typography-default-body-large: var(--uy-typography-default-body-large);
1724
+ --typography-sm-body-large: var(--uy-typography-sm-body-large);
1725
+ --typography-default-body-large-strong: var(--uy-typography-default-body-large-strong);
1726
+ --typography-sm-body-large-strong: var(--uy-typography-sm-body-large-strong);
1727
+ --typography-default-action: var(--uy-typography-default-action);
1728
+ --typography-sm-action: var(--uy-typography-sm-action);
1729
+ --typography-default-action-small: var(--uy-typography-default-action-small);
1730
+ --typography-sm-action-small: var(--uy-typography-sm-action-small);
1731
+ --typography-default-action-large: var(--uy-typography-default-action-large);
1732
+ --typography-sm-action-large: var(--uy-typography-sm-action-large);
1733
+ }
1734
+
1735
+ @utility grid-layout {
1736
+ display: grid;
1737
+ grid-template-columns: repeat(var(--uy-grid-layout-columns--default), 1fr);
1738
+ grid-gap: var(--uy-grid-layout-gutter--default);
1739
+ margin: 0 var(--uy-grid-layout-margin--default);
1740
+ @media screen and (min-width: 768px) {
1741
+ grid-template-columns: repeat(var(--uy-grid-layout-columns--md), 1fr);
1742
+ grid-gap: var(--uy-grid-layout-gutter--md);
1743
+ margin: 0 var(--uy-grid-layout-margin--md);
1744
+ }
1745
+ @media screen and (min-width: 1280px) {
1746
+ grid-template-columns: repeat(var(--uy-grid-layout-columns--lg), 1fr);
1747
+ grid-gap: var(--uy-grid-layout-gutter--lg);
1748
+ margin: 0 var(--uy-grid-layout-margin--lg);
1749
+ }
1750
+ }
1751
+
1752
+ @utility typography-* {
1753
+ font: --value(--typography-default-*);
1754
+ @media screen and (min-width: 490px) {
1755
+ font: --value(--typography-sm- *);
1756
+ }
1757
+ }
1758
+
1759
+ @custom-variant theme-legacy (&:where([data-uy-theme="legacy"], [data-uy-theme="legacy"] *));
1760
+ @custom-variant theme-rebrand (&:where([data-uy-theme="rebrand"], [data-uy-theme="rebrand"] *));
1761
+
1762
+
1763
+ @keyframes spin {
1764
+ 0% {
1765
+ transform: rotate(0deg);
1766
+ }
1767
+ 100% {
1768
+ transform: rotate(360deg);
1769
+ }
1770
+ }
1771
+
1772
+ @keyframes arc-shrink {
1773
+ 0% {
1774
+ stroke-dasharray: calc(2 * var(--1deg, 1rad)) calc(358 * var(--1deg, 1rad));
1775
+ stroke-dashoffset: 0;
1776
+ }
1777
+ 50% {
1778
+ stroke-dasharray: calc(290 * var(--1deg, 1rad))
1779
+ calc(358 * var(--1deg, 1rad));
1780
+ stroke-dashoffset: calc(-35 * var(--1deg, 1rad));
1781
+ }
1782
+ 100% {
1783
+ stroke-dasharray: calc(2 * var(--1deg, 1rad)) calc(358 * var(--1deg, 1rad));
1784
+ stroke-dashoffset: calc(-358 * var(--1deg, 1rad));
1785
+ }
1786
+ }
1787
+
1788
+ @keyframes pulse {
1789
+ 0% {
1790
+ opacity: 1;
1791
+ }
1792
+ 50% {
1793
+ opacity: 0.5;
1794
+ }
1795
+ 100% {
1796
+ opacity: 1;
1797
+ }
1798
+ }
1799
+
1800
+ @keyframes fade-in {
1801
+ 0% {
1802
+ opacity: 0;
1803
+ }
1804
+ 100% {
1805
+ opacity: 1;
1806
+ }
1807
+ }
1808
+
1809
+ @keyframes fade-out {
1810
+ 0% {
1811
+ opacity: 1;
1812
+ }
1813
+ 100% {
1814
+ opacity: 0;
1815
+ }
1816
+ }
1817
+
1818
+ @keyframes slide-right-fade-in {
1819
+ 0% {
1820
+ opacity: 0;
1821
+ transform: translate3d(100%, 0, 0);
1822
+ }
1823
+ 100% {
1824
+ opacity: 1;
1825
+ transform: translate3d(0, 0, 0);
1826
+ }
1827
+ }
1828
+
1829
+ @keyframes slide-right-fade-out {
1830
+ 0% {
1831
+ opacity: 1;
1832
+ }
1833
+ 100% {
1834
+ opacity: 0;
1835
+ transform: translate3d(100%, 0, 0);
1836
+ }
1837
+ }
1838
+
1839
+ @keyframes slide-up-fade-in {
1840
+ 0% {
1841
+ opacity: 0;
1842
+ transform: translate3d(0, 100%, 0);
1843
+ }
1844
+ 100% {
1845
+ opacity: 1;
1846
+ transform: translate3d(0, 0, 0);
1847
+ }
1848
+ }
1849
+
1850
+ @keyframes slide-down-fade-out {
1851
+ 0% {
1852
+ opacity: 1;
1853
+ }
1854
+ 100% {
1855
+ opacity: 0;
1856
+ transform: translate3d(0, 100%, 0);
1857
+ }
1858
+ }
1859
+
1860
+ @keyframes slide {
1861
+ 0% {
1862
+ opacity: 0;
1863
+ transform: translate3d(-100%, 0, 0);
1864
+ }
1865
+
1866
+ 25% {
1867
+ opacity: 0.2;
1868
+ transform: translate3d(-100%, 0, 0);
1869
+ }
1870
+
1871
+ 50% {
1872
+ opacity: 1;
1873
+ transform: translate3d(0, 0, 0);
1874
+ }
1875
+
1876
+ 100% {
1877
+ opacity: 0.2;
1878
+ transform: translate3d(100%, 0, 0);
1879
+ }
1880
+ }
1881
+
1882
+ @keyframes zoom-in {
1883
+ 0% {
1884
+ opacity: 0;
1885
+ transform: scale(0);
1886
+ }
1887
+ 100% {
1888
+ opacity: 1;
1889
+ transform: scale(1);
1890
+ }
1891
+ }
1892
+
1893
+ @keyframes zoom-out {
1894
+ 0% {
1895
+ opacity: 1;
1896
+ transform: scale(1);
1897
+ }
1898
+ 100% {
1899
+ opacity: 0;
1900
+ transform: scale(0);
1901
+ }
1902
+ }
1903
+
1904
+
1905
+ /* this is Midnight css reset */
1906
+ @layer base {
1907
+ html {
1908
+ -webkit-font-smoothing: antialiased;
1909
+ -webkit-tap-highlight-color: transparent;
1910
+ -moz-osx-font-smoothing: grayscale;
1911
+ }
1912
+
1913
+ /* Set core body defaults */
1914
+ body {
1915
+ font-family: var(--uy-font-sans);
1916
+ font-size: 100%;
1917
+ line-height: 1.5;
1918
+
1919
+ color: var(--uy-color-content-neutral);
1920
+ background-color: var(--uy-color-canvas);
1921
+
1922
+ min-height: 100vh;
1923
+ margin: 0;
1924
+ scroll-behavior: smooth;
1925
+ text-rendering: optimizeSpeed;
1926
+ -webkit-text-size-adjust: 100%;
1927
+ }
1928
+
1929
+ /* Remove default margin */
1930
+ h1,
1931
+ h2,
1932
+ h3,
1933
+ h4,
1934
+ figure,
1935
+ figcaption,
1936
+ blockquote {
1937
+ margin: 0;
1938
+ }
1939
+
1940
+ /* Make images easier to work with */
1941
+ img {
1942
+ max-width: 100%;
1943
+ display: block;
1944
+ }
1945
+
1946
+ svg:not(:root) {
1947
+ overflow: visible;
1948
+ }
1949
+
1950
+ a {
1951
+ text-decoration: none;
1952
+ }
1953
+
1954
+ table {
1955
+ border-spacing: 0;
1956
+ }
1957
+
1958
+ iframe {
1959
+ border: 0;
1960
+ }
1961
+
1962
+ /* Inherit fonts for inputs and buttons */
1963
+ input,
1964
+ button,
1965
+ textarea,
1966
+ select {
1967
+ font: inherit;
1968
+ }
1969
+
1970
+ b,
1971
+ strong {
1972
+ font-weight: var(--uy-font-weight-bold);
1973
+ }
1974
+
1975
+ ol {
1976
+ list-style-type: decimal;
1977
+ }
1978
+
1979
+ ul {
1980
+ list-style-type: disc;
1981
+ }
1982
+ }