@hopper-ui/styled-system 2.5.13 → 3.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (61) hide show
  1. package/CHANGELOG.md +20 -0
  2. package/dist/StyledSystemProvider.css +35 -35
  3. package/dist/StyledSystemProvider.d.ts +6 -6
  4. package/dist/StyledSystemProvider.js +15 -17
  5. package/dist/{chunk-54RO57YA.js → chunk-3PUBJ5LJ.js} +25 -13
  6. package/dist/chunk-6ZFFJVAW.js +17 -0
  7. package/dist/{chunk-V7X6ANEM.js → chunk-7PR2BAOL.js} +0 -1
  8. package/dist/{chunk-MSH55T2T.js → chunk-A54ZRFEM.js} +31 -2
  9. package/dist/{chunk-ILG53YIO.js → chunk-FGXNB7F6.js} +34 -9
  10. package/dist/{chunk-7TNCJ3OQ.js → chunk-JJKYIWIT.js} +13 -3
  11. package/dist/{chunk-A54ZF3UN.js → chunk-QZ7W6U3E.js} +2 -2
  12. package/dist/{chunk-GQ3J3RTR.js → chunk-SVHEHWY4.js} +3 -3
  13. package/dist/chunk-TKWJ3X2I.js +13 -0
  14. package/dist/{chunk-JVNXXRWE.js → chunk-VIIWNAIQ.js} +1 -1
  15. package/dist/{chunk-X5OXC6DN.js → chunk-XG7R6QGE.js} +1 -1
  16. package/dist/chunk-YQ665QH5.js +6 -0
  17. package/dist/color-scheme/ColorSchemeContext.js +1 -1
  18. package/dist/color-scheme/useColorSchemeValue.js +2 -2
  19. package/dist/global-styles/BodyStyleProvider.js +5 -5
  20. package/dist/html-wrappers/html.css +35 -35
  21. package/dist/html-wrappers/html.js +8 -7
  22. package/dist/html-wrappers/htmlElement.css +35 -35
  23. package/dist/html-wrappers/htmlElement.js +7 -6
  24. package/dist/index.css +35 -35
  25. package/dist/index.d.ts +4 -6
  26. package/dist/index.js +16 -18
  27. package/dist/responsive/useResponsiveValue.js +2 -2
  28. package/dist/styledSystemProps.d.ts +21 -5
  29. package/dist/styledSystemRootCssClass.d.ts +2 -4
  30. package/dist/styledSystemRootCssClass.js +2 -1
  31. package/dist/theme/ThemeContext.d.ts +11 -0
  32. package/dist/theme/ThemeContext.js +2 -0
  33. package/dist/theme/generated/sharegate/dark.css +742 -0
  34. package/dist/theme/generated/sharegate/light.css +1182 -0
  35. package/dist/theme/generated/sharegate.css +4 -0
  36. package/dist/theme/generated/workleap/dark.css +742 -0
  37. package/dist/theme/generated/workleap/light.css +1182 -0
  38. package/dist/theme/generated/workleap.css +4 -0
  39. package/dist/tokens/generated/styledSystemConstants.d.ts +6 -0
  40. package/dist/tokens/generated/styledSystemConstants.js +2 -0
  41. package/dist/tokens/generated/styledSystemToTokenMappings.d.ts +1182 -1151
  42. package/dist/tokens/generated/styledSystemToTokenMappings.js +1 -1
  43. package/dist/tokens/tokenMappings.d.ts +540 -37
  44. package/dist/tokens/tokenMappings.js +5 -4
  45. package/dist/useStyledSystem.css +32 -32
  46. package/dist/useStyledSystem.js +6 -5
  47. package/package.json +13 -9
  48. package/dist/chunk-43MQD25Q.js +0 -17
  49. package/dist/chunk-K5JIMNDM.js +0 -1182
  50. package/dist/chunk-P6FMQKUS.js +0 -546
  51. package/dist/chunk-RAWVBWQ4.js +0 -11
  52. package/dist/chunk-S3G5NPHF.js +0 -32
  53. package/dist/tokens/TokenProvider.d.ts +0 -20
  54. package/dist/tokens/TokenProvider.js +0 -9
  55. package/dist/tokens/generated/darkSemanticTokens.d.ts +0 -548
  56. package/dist/tokens/generated/darkSemanticTokens.js +0 -2
  57. package/dist/tokens/generated/lightSemanticTokens.d.ts +0 -1184
  58. package/dist/tokens/generated/lightSemanticTokens.js +0 -2
  59. package/dist/tokens/tokens.d.ts +0 -1731
  60. package/dist/tokens/tokens.js +0 -4
  61. package/dist/{chunk-SFOVKOPG.js → chunk-FTYK7Z7Q.js} +1 -1
@@ -0,0 +1,1182 @@
1
+ /**
2
+ * This file is generated by Style Dictionary. Do not edit directly.
3
+ */
4
+
5
+ .hop-5-0-0-sharegate {
6
+ --hop-overline-bottom-offset: -0.25rem;
7
+ --hop-overline-top-offset: -0.25rem;
8
+ --hop-heading-xs-medium-bottom-offset: -0.25rem;
9
+ --hop-heading-xs-medium-top-offset: -0.4166rem;
10
+ --hop-heading-xs-bottom-offset: -0.25rem;
11
+ --hop-heading-xs-top-offset: -0.4166rem;
12
+ --hop-heading-sm-bottom-offset: -0.1875rem;
13
+ --hop-heading-sm-top-offset: -0.375rem;
14
+ --hop-heading-md-bottom-offset: -0.125rem;
15
+ --hop-heading-md-top-offset: -0.3333rem;
16
+ --hop-heading-lg-bottom-offset: -0.3125rem;
17
+ --hop-heading-lg-top-offset: -0.5625rem;
18
+ --hop-heading-xl-bottom-offset: -0.1875rem;
19
+ --hop-heading-xl-top-offset: -0.5rem;
20
+ --hop-heading-2xl-bottom-offset: -0.3334rem;
21
+ --hop-heading-2xl-top-offset: -0.6667rem;
22
+ --hop-heading-3xl-bottom-offset: -0.5625rem;
23
+ --hop-heading-3xl-top-offset: -0.9375rem;
24
+ --hop-dataviz-categorical-6colorgroup-option4-category6: #fbe997;
25
+ --hop-dataviz-categorical-6colorgroup-option4-category5: #bfdca9;
26
+ --hop-dataviz-categorical-6colorgroup-option4-category4: #c7ebff;
27
+ --hop-dataviz-categorical-6colorgroup-option4-category3: #ffbf92;
28
+ --hop-dataviz-categorical-6colorgroup-option4-category2: #a0b8fa;
29
+ --hop-dataviz-categorical-6colorgroup-option4-category1: #fbbdcf;
30
+ --hop-dataviz-categorical-6colorgroup-option3-category6: #fbbdcf;
31
+ --hop-dataviz-categorical-6colorgroup-option3-category5: #2e70a8;
32
+ --hop-dataviz-categorical-6colorgroup-option3-category4: #a7e6dc;
33
+ --hop-dataviz-categorical-6colorgroup-option3-category3: #e8ddd0;
34
+ --hop-dataviz-categorical-6colorgroup-option3-category2: #aecdd5;
35
+ --hop-dataviz-categorical-6colorgroup-option3-category1: #b6bead;
36
+ --hop-dataviz-categorical-6colorgroup-option2-category6: #d2cdf8;
37
+ --hop-dataviz-categorical-6colorgroup-option2-category5: #a7e6dc;
38
+ --hop-dataviz-categorical-6colorgroup-option2-category4: #ff9b3f;
39
+ --hop-dataviz-categorical-6colorgroup-option2-category3: #69bfa0;
40
+ --hop-dataviz-categorical-6colorgroup-option2-category2: #fbe997;
41
+ --hop-dataviz-categorical-6colorgroup-option2-category1: #2e70a8;
42
+ --hop-dataviz-categorical-6colorgroup-option1-category6: #69bfa0;
43
+ --hop-dataviz-categorical-6colorgroup-option1-category5: #ecd599;
44
+ --hop-dataviz-categorical-6colorgroup-option1-category4: #fa4d59;
45
+ --hop-dataviz-categorical-6colorgroup-option1-category3: #bfdca9;
46
+ --hop-dataviz-categorical-6colorgroup-option1-category2: #a0b8fa;
47
+ --hop-dataviz-categorical-6colorgroup-option1-category1: #b6bead;
48
+ --hop-dataviz-categorical-5colorgroup-option4-category5: #b6bead;
49
+ --hop-dataviz-categorical-5colorgroup-option4-category4: #d2cdf8;
50
+ --hop-dataviz-categorical-5colorgroup-option4-category3: #fa4d59;
51
+ --hop-dataviz-categorical-5colorgroup-option4-category2: #c7ebff;
52
+ --hop-dataviz-categorical-5colorgroup-option4-category1: #69bfa0;
53
+ --hop-dataviz-categorical-5colorgroup-option3-category5: #ffbf92;
54
+ --hop-dataviz-categorical-5colorgroup-option3-category4: #b6bead;
55
+ --hop-dataviz-categorical-5colorgroup-option3-category3: #aecdd5;
56
+ --hop-dataviz-categorical-5colorgroup-option3-category2: #ecd599;
57
+ --hop-dataviz-categorical-5colorgroup-option3-category1: #d2cdf8;
58
+ --hop-dataviz-categorical-5colorgroup-option2-category5: #c5bef6;
59
+ --hop-dataviz-categorical-5colorgroup-option2-category4: #fbe997;
60
+ --hop-dataviz-categorical-5colorgroup-option2-category3: #2e70a8;
61
+ --hop-dataviz-categorical-5colorgroup-option2-category2: #b6bead;
62
+ --hop-dataviz-categorical-5colorgroup-option2-category1: #ff9b3f;
63
+ --hop-dataviz-categorical-5colorgroup-option1-category5: #69bfa0;
64
+ --hop-dataviz-categorical-5colorgroup-option1-category4: #ecd599;
65
+ --hop-dataviz-categorical-5colorgroup-option1-category3: #bfdca9;
66
+ --hop-dataviz-categorical-5colorgroup-option1-category2: #ff9b3f;
67
+ --hop-dataviz-categorical-5colorgroup-option1-category1: #b6bead;
68
+ --hop-dataviz-categorical-4colorgroup-option4-category4: #d2cdf8;
69
+ --hop-dataviz-categorical-4colorgroup-option4-category3: #fa4d59;
70
+ --hop-dataviz-categorical-4colorgroup-option4-category2: #c7ebff;
71
+ --hop-dataviz-categorical-4colorgroup-option4-category1: #69bfa0;
72
+ --hop-dataviz-categorical-4colorgroup-option3-category4: #ecd599;
73
+ --hop-dataviz-categorical-4colorgroup-option3-category3: #2e70a8;
74
+ --hop-dataviz-categorical-4colorgroup-option3-category2: #b6bead;
75
+ --hop-dataviz-categorical-4colorgroup-option3-category1: #ffbf92;
76
+ --hop-dataviz-categorical-4colorgroup-option2-category4: #fbe997;
77
+ --hop-dataviz-categorical-4colorgroup-option2-category3: #84d0b4;
78
+ --hop-dataviz-categorical-4colorgroup-option2-category2: #c7ebff;
79
+ --hop-dataviz-categorical-4colorgroup-option2-category1: #b6bead;
80
+ --hop-dataviz-categorical-4colorgroup-option1-category4: #fbbdcf;
81
+ --hop-dataviz-categorical-4colorgroup-option1-category3: #cde8ac;
82
+ --hop-dataviz-categorical-4colorgroup-option1-category2: #d2cdf8;
83
+ --hop-dataviz-categorical-4colorgroup-option1-category1: #b6bead;
84
+ --hop-dataviz-categorical-3colorgroup-option4-category3: #fbbdcf;
85
+ --hop-dataviz-categorical-3colorgroup-option4-category2: #a0b8fa;
86
+ --hop-dataviz-categorical-3colorgroup-option4-category1: #b6bead;
87
+ --hop-dataviz-categorical-3colorgroup-option3-category3: #aecdd5;
88
+ --hop-dataviz-categorical-3colorgroup-option3-category2: #fbe997;
89
+ --hop-dataviz-categorical-3colorgroup-option3-category1: #69bfa0;
90
+ --hop-dataviz-categorical-3colorgroup-option2-category3: #69bfa0;
91
+ --hop-dataviz-categorical-3colorgroup-option2-category2: #a7e6dc;
92
+ --hop-dataviz-categorical-3colorgroup-option2-category1: #ecd599;
93
+ --hop-dataviz-categorical-3colorgroup-option1-category3: #bfdca9;
94
+ --hop-dataviz-categorical-3colorgroup-option1-category2: #d2cdf8;
95
+ --hop-dataviz-categorical-3colorgroup-option1-category1: #b6bead;
96
+ --hop-dataviz-categorical-2colorgroup-option1-category1: #b6bead;
97
+ --hop-dataviz-categorical-2colorgroup-option1-category2: #c7ebff;
98
+ --hop-dataviz-categorical-2colorgroup-option2-category1: #fbbdcf;
99
+ --hop-dataviz-categorical-2colorgroup-option2-category2: #fbe997;
100
+ --hop-dataviz-categorical-2colorgroup-option3-category1: #2f48ff;
101
+ --hop-dataviz-categorical-2colorgroup-option3-category2: #ff9b3f;
102
+ --hop-dataviz-categorical-2colorgroup-option4-category1: #bfdca9;
103
+ --hop-dataviz-categorical-2colorgroup-option4-category2: #6c8ffd;
104
+ --hop-dataviz-categorical-2colorgroup-option5-category1: #a7e6dc;
105
+ --hop-dataviz-categorical-2colorgroup-option5-category2: #a0b8fa;
106
+ --hop-dataviz-categorical-2colorgroup-option6-category1: #ffbf92;
107
+ --hop-dataviz-categorical-2colorgroup-option6-category2: #69bfa0;
108
+ --hop-dataviz-categorical-sequence-category13-hover: #54b692;
109
+ --hop-dataviz-categorical-sequence-category13: #69bfa0;
110
+ --hop-dataviz-categorical-sequence-category12-hover: #779af8;
111
+ --hop-dataviz-categorical-sequence-category12: #a0b8fa;
112
+ --hop-dataviz-categorical-sequence-category11-hover: #ffac70;
113
+ --hop-dataviz-categorical-sequence-category11: #ffbf92;
114
+ --hop-dataviz-categorical-sequence-category10-hover: #93bdc8;
115
+ --hop-dataviz-categorical-sequence-category10: #aecdd5;
116
+ --hop-dataviz-categorical-sequence-category9-hover: #90e0d2;
117
+ --hop-dataviz-categorical-sequence-category9: #a7e6dc;
118
+ --hop-dataviz-categorical-sequence-category8-hover: #ddcebb;
119
+ --hop-dataviz-categorical-sequence-category8: #e8ddd0;
120
+ --hop-dataviz-categorical-sequence-category7-hover: #fae275;
121
+ --hop-dataviz-categorical-sequence-category7: #fbe997;
122
+ --hop-dataviz-categorical-sequence-category6-hover: #a9d08b;
123
+ --hop-dataviz-categorical-sequence-category6: #bfdca9;
124
+ --hop-dataviz-categorical-sequence-category5-hover: #f99fb8;
125
+ --hop-dataviz-categorical-sequence-category5: #fbbdcf;
126
+ --hop-dataviz-categorical-sequence-category4-hover: #a4ae98;
127
+ --hop-dataviz-categorical-sequence-category4: #b6bead;
128
+ --hop-dataviz-categorical-sequence-category3-hover: #bfb8f5;
129
+ --hop-dataviz-categorical-sequence-category3: #d2cdf8;
130
+ --hop-dataviz-categorical-sequence-category2-hover: #e6c675;
131
+ --hop-dataviz-categorical-sequence-category2: #ecd599;
132
+ --hop-dataviz-categorical-sequence-category1-hover: #ade2ff;
133
+ --hop-dataviz-categorical-sequence-category1: #c7ebff;
134
+ --hop-dataviz-diverging-sequence-2-negative10-hover: #431a17;
135
+ --hop-dataviz-diverging-sequence-2-negative10: #6c2320;
136
+ --hop-dataviz-diverging-sequence-2-negative9-hover: #6c2320;
137
+ --hop-dataviz-diverging-sequence-2-negative9: #952927;
138
+ --hop-dataviz-diverging-sequence-2-negative8-hover: #952927;
139
+ --hop-dataviz-diverging-sequence-2-negative8: #ba2d2d;
140
+ --hop-dataviz-diverging-sequence-2-negative7-hover: #ba2d2d;
141
+ --hop-dataviz-diverging-sequence-2-negative7: #cb2e31;
142
+ --hop-dataviz-diverging-sequence-2-negative6-hover: #cb2e31;
143
+ --hop-dataviz-diverging-sequence-2-negative6: #df3236;
144
+ --hop-dataviz-diverging-sequence-2-negative5-hover: #df3236;
145
+ --hop-dataviz-diverging-sequence-2-negative5: #f56263;
146
+ --hop-dataviz-diverging-sequence-2-negative4-hover: #f56263;
147
+ --hop-dataviz-diverging-sequence-2-negative4: #ff8e8e;
148
+ --hop-dataviz-diverging-sequence-2-negative3-hover: #ff8e8e;
149
+ --hop-dataviz-diverging-sequence-2-negative3: #ffbcb7;
150
+ --hop-dataviz-diverging-sequence-2-negative2-hover: #ffbcb7;
151
+ --hop-dataviz-diverging-sequence-2-negative2: #ffd6d3;
152
+ --hop-dataviz-diverging-sequence-2-negative1-hover: #ffd6d3;
153
+ --hop-dataviz-diverging-sequence-2-negative1: #fde6e5;
154
+ --hop-dataviz-diverging-sequence-2-positive1-hover: #cde8ac;
155
+ --hop-dataviz-diverging-sequence-2-positive1: #e3f3b9;
156
+ --hop-dataviz-diverging-sequence-2-positive2-hover: #aad89d;
157
+ --hop-dataviz-diverging-sequence-2-positive2: #cde8ac;
158
+ --hop-dataviz-diverging-sequence-2-positive3-hover: #7dc291;
159
+ --hop-dataviz-diverging-sequence-2-positive3: #aad89d;
160
+ --hop-dataviz-diverging-sequence-2-positive4-hover: #47a584;
161
+ --hop-dataviz-diverging-sequence-2-positive4: #7dc291;
162
+ --hop-dataviz-diverging-sequence-2-positive5-hover: #188a71;
163
+ --hop-dataviz-diverging-sequence-2-positive5: #47a584;
164
+ --hop-dataviz-diverging-sequence-2-positive6-hover: #0c796b;
165
+ --hop-dataviz-diverging-sequence-2-positive6: #188a71;
166
+ --hop-dataviz-diverging-sequence-2-positive7-hover: #0a6f64;
167
+ --hop-dataviz-diverging-sequence-2-positive7: #0c796b;
168
+ --hop-dataviz-diverging-sequence-2-positive8-hover: #115a52;
169
+ --hop-dataviz-diverging-sequence-2-positive8: #0a6f64;
170
+ --hop-dataviz-diverging-sequence-2-positive9-hover: #16433d;
171
+ --hop-dataviz-diverging-sequence-2-positive9: #115a52;
172
+ --hop-dataviz-diverging-sequence-2-positive10-hover: #132a27;
173
+ --hop-dataviz-diverging-sequence-2-positive10: #16433d;
174
+ --hop-dataviz-diverging-sequence-1-negative9-hover: #431a17;
175
+ --hop-dataviz-diverging-sequence-1-negative9: #6c2320;
176
+ --hop-dataviz-diverging-sequence-1-negative8-hover: #6c2320;
177
+ --hop-dataviz-diverging-sequence-1-negative8: #952927;
178
+ --hop-dataviz-diverging-sequence-1-negative7-hover: #952927;
179
+ --hop-dataviz-diverging-sequence-1-negative7: #ba2d2d;
180
+ --hop-dataviz-diverging-sequence-1-negative6-hover: #ba2d2d;
181
+ --hop-dataviz-diverging-sequence-1-negative6: #cb2e31;
182
+ --hop-dataviz-diverging-sequence-1-negative5-hover: #cb2e31;
183
+ --hop-dataviz-diverging-sequence-1-negative5: #df3236;
184
+ --hop-dataviz-diverging-sequence-1-negative4-hover: #df3236;
185
+ --hop-dataviz-diverging-sequence-1-negative4: #f56263;
186
+ --hop-dataviz-diverging-sequence-1-negative3-hover: #f56263;
187
+ --hop-dataviz-diverging-sequence-1-negative3: #ff8e8e;
188
+ --hop-dataviz-diverging-sequence-1-negative2-hover: #ff8e8e;
189
+ --hop-dataviz-diverging-sequence-1-negative2: #ffbcb7;
190
+ --hop-dataviz-diverging-sequence-1-negative1-hover: #ffbcb7;
191
+ --hop-dataviz-diverging-sequence-1-negative1: #ffd8be;
192
+ --hop-dataviz-diverging-sequence-1-neutral-hover: #eac96d;
193
+ --hop-dataviz-diverging-sequence-1-neutral: #f7e694;
194
+ --hop-dataviz-diverging-sequence-1-positive1-hover: #aad89d;
195
+ --hop-dataviz-diverging-sequence-1-positive1: #cde8ac;
196
+ --hop-dataviz-diverging-sequence-1-positive2-hover: #7dc291;
197
+ --hop-dataviz-diverging-sequence-1-positive2: #aad89d;
198
+ --hop-dataviz-diverging-sequence-1-positive3-hover: #47a584;
199
+ --hop-dataviz-diverging-sequence-1-positive3: #7dc291;
200
+ --hop-dataviz-diverging-sequence-1-positive-4-hover: #188a71;
201
+ --hop-dataviz-diverging-sequence-1-positive4: #47a584;
202
+ --hop-dataviz-diverging-sequence-1-positive5-hover: #0c796b;
203
+ --hop-dataviz-diverging-sequence-1-positive5: #188a71;
204
+ --hop-dataviz-diverging-sequence-1-positive6-hover: #0a6f64;
205
+ --hop-dataviz-diverging-sequence-1-positive6: #0c796b;
206
+ --hop-dataviz-diverging-sequence-1-positive7-hover: #115a52;
207
+ --hop-dataviz-diverging-sequence-1-positive7: #0a6f64;
208
+ --hop-dataviz-diverging-sequence-1-positive8-hover: #16433d;
209
+ --hop-dataviz-diverging-sequence-1-positive8: #115a52;
210
+ --hop-dataviz-diverging-sequence-1-positive9-hover: #132a27;
211
+ --hop-dataviz-diverging-sequence-1-positive9: #16433d;
212
+ --hop-dataviz-monochromatic-negative-900-hover: #2d100d;
213
+ --hop-dataviz-monochromatic-negative-800-hover: #431a17;
214
+ --hop-dataviz-monochromatic-negative-700-hover: #6c2320;
215
+ --hop-dataviz-monochromatic-negative-600-hover: #952927;
216
+ --hop-dataviz-monochromatic-negative-500-hover: #ba2d2d;
217
+ --hop-dataviz-monochromatic-negative-400-hover: #cb2e31;
218
+ --hop-dataviz-monochromatic-negative-300-hover: #df3236;
219
+ --hop-dataviz-monochromatic-negative-200-hover: #f56263;
220
+ --hop-dataviz-monochromatic-negative-100-hover: #ff8e8e;
221
+ --hop-dataviz-monochromatic-negative-75-hover: #ffbcb7;
222
+ --hop-dataviz-monochromatic-negative-50-hover: #ffd6d3;
223
+ --hop-dataviz-monochromatic-negative-25-hover: #fde6e5;
224
+ --hop-dataviz-monochromatic-negative-900: #431a17;
225
+ --hop-dataviz-monochromatic-negative-800: #6c2320;
226
+ --hop-dataviz-monochromatic-negative-700: #952927;
227
+ --hop-dataviz-monochromatic-negative-600: #ba2d2d;
228
+ --hop-dataviz-monochromatic-negative-500: #cb2e31;
229
+ --hop-dataviz-monochromatic-negative-400: #df3236;
230
+ --hop-dataviz-monochromatic-negative-300: #f56263;
231
+ --hop-dataviz-monochromatic-negative-200: #ff8e8e;
232
+ --hop-dataviz-monochromatic-negative-100: #ffbcb7;
233
+ --hop-dataviz-monochromatic-negative-75: #ffd6d3;
234
+ --hop-dataviz-monochromatic-negative-50: #fde6e5;
235
+ --hop-dataviz-monochromatic-negative-25: #fdf6f6;
236
+ --hop-dataviz-monochromatic-positive-900-hover: #0a1716;
237
+ --hop-dataviz-monochromatic-positive-800-hover: #132a27;
238
+ --hop-dataviz-monochromatic-positive-700-hover: #16433d;
239
+ --hop-dataviz-monochromatic-positive-600-hover: #115a52;
240
+ --hop-dataviz-monochromatic-positive-500-hover: #0a6f64;
241
+ --hop-dataviz-monochromatic-positive-400-hover: #0c796b;
242
+ --hop-dataviz-monochromatic-positive-300-hover: #188a71;
243
+ --hop-dataviz-monochromatic-positive-200-hover: #47a584;
244
+ --hop-dataviz-monochromatic-positive-100-hover: #7dc291;
245
+ --hop-dataviz-monochromatic-positive-75-hover: #aad89d;
246
+ --hop-dataviz-monochromatic-positive-50-hover: #cde8ac;
247
+ --hop-dataviz-monochromatic-positive-25-hover: #e3f3b9;
248
+ --hop-dataviz-monochromatic-positive-900: #132a27;
249
+ --hop-dataviz-monochromatic-positive-800: #16433d;
250
+ --hop-dataviz-monochromatic-positive-700: #115a52;
251
+ --hop-dataviz-monochromatic-positive-600: #0a6f64;
252
+ --hop-dataviz-monochromatic-positive-500: #0c796b;
253
+ --hop-dataviz-monochromatic-positive-400: #188a71;
254
+ --hop-dataviz-monochromatic-positive-300: #47a584;
255
+ --hop-dataviz-monochromatic-positive-200: #7dc291;
256
+ --hop-dataviz-monochromatic-positive-100: #aad89d;
257
+ --hop-dataviz-monochromatic-positive-75: #cde8ac;
258
+ --hop-dataviz-monochromatic-positive-50: #e3f3b9;
259
+ --hop-dataviz-monochromatic-positive-25: #f4f9e9;
260
+ --hop-dataviz-monochromatic-primary-900-hover: #0b173a;
261
+ --hop-dataviz-monochromatic-primary-800-hover: #152450;
262
+ --hop-dataviz-monochromatic-primary-700-hover: #1b3587;
263
+ --hop-dataviz-monochromatic-primary-600-hover: #2040c7;
264
+ --hop-dataviz-monochromatic-primary-500-hover: #2a43e8;
265
+ --hop-dataviz-monochromatic-primary-400-hover: #3b57ff;
266
+ --hop-dataviz-monochromatic-primary-300-hover: #4767fe;
267
+ --hop-dataviz-monochromatic-primary-200-hover: #6c8ffd;
268
+ --hop-dataviz-monochromatic-primary-100-hover: #95b1ff;
269
+ --hop-dataviz-monochromatic-primary-75-hover: #b9cbff;
270
+ --hop-dataviz-monochromatic-primary-50-hover: #d6e0ff;
271
+ --hop-dataviz-monochromatic-primary-25-hover: #e6ebff;
272
+ --hop-dataviz-monochromatic-primary-900: #152450;
273
+ --hop-dataviz-monochromatic-primary-800: #1b3587;
274
+ --hop-dataviz-monochromatic-primary-700: #2040c7;
275
+ --hop-dataviz-monochromatic-primary-600: #2a43e8;
276
+ --hop-dataviz-monochromatic-primary-500: #3b57ff;
277
+ --hop-dataviz-monochromatic-primary-400: #4767fe;
278
+ --hop-dataviz-monochromatic-primary-300: #6c8ffd;
279
+ --hop-dataviz-monochromatic-primary-200: #95b1ff;
280
+ --hop-dataviz-monochromatic-primary-100: #b9cbff;
281
+ --hop-dataviz-monochromatic-primary-75: #d6e0ff;
282
+ --hop-dataviz-monochromatic-primary-50: #e6ebff;
283
+ --hop-dataviz-monochromatic-primary-25: #f5f6ff;
284
+ --hop-space-1280: 8rem;
285
+ --hop-space-960: 6rem;
286
+ --hop-space-800: 5rem;
287
+ --hop-space-640: 4rem;
288
+ --hop-space-480: 3rem;
289
+ --hop-space-400: 2.5rem;
290
+ --hop-space-320: 2rem;
291
+ --hop-space-240: 1.5rem;
292
+ --hop-space-160: 1rem;
293
+ --hop-space-80: 0.5rem;
294
+ --hop-space-40: 0.25rem;
295
+ --hop-space-20: 0.125rem;
296
+ --hop-space-10: 0.0625rem;
297
+ --hop-space-0: 0;
298
+ --hop-border-radius-9999: 624.9375rem;
299
+ --hop-border-radius-4: 1.5rem;
300
+ --hop-border-radius-3: 1rem;
301
+ --hop-border-radius-2: 0.5rem;
302
+ --hop-border-radius-1: 0.25rem;
303
+ --hop-border-radius-0: 0;
304
+ --hop-easing-expressive: cubic-bezier(0.72, -0.66, 0.15, 1.5);
305
+ --hop-easing-focus: cubic-bezier(0.46, 0.03, 0.52, 0.96);
306
+ --hop-easing-productive: cubic-bezier(0.22, 0.61, 0.36, 1);
307
+ --hop-easing-duration-5: 800ms;
308
+ --hop-easing-duration-4: 500ms;
309
+ --hop-easing-duration-3: 300ms;
310
+ --hop-easing-duration-2: 200ms;
311
+ --hop-easing-duration-1: 100ms;
312
+ --hop-line-height-1-50: 1.5;
313
+ --hop-line-height-1-4285: 1.4285714;
314
+ --hop-line-height-1-33: 1.3333333;
315
+ --hop-line-height-1-25: 1.25;
316
+ --hop-line-height-1-20: 1.2;
317
+ --hop-line-height-1-14: 1.1428571;
318
+ --hop-line-height-1-125: 1.125;
319
+ --hop-font-weight-690: 690;
320
+ --hop-font-weight-680: 680;
321
+ --hop-font-weight-590: 590;
322
+ --hop-font-weight-580: 580;
323
+ --hop-font-weight-505: 505;
324
+ --hop-font-weight-410: 410;
325
+ --hop-font-weight-400: 400;
326
+ --hop-font-size-480: 3rem;
327
+ --hop-font-size-360: 2.25rem;
328
+ --hop-font-size-320: 2rem;
329
+ --hop-font-size-280: 1.75rem;
330
+ --hop-font-size-240: 1.5rem;
331
+ --hop-font-size-200: 1.25rem;
332
+ --hop-font-size-180: 1.125rem;
333
+ --hop-font-size-160: 1rem;
334
+ --hop-font-size-140: 0.875rem;
335
+ --hop-font-size-120: 0.75rem;
336
+ --hop-font-family-tertiary: 'ABC Favorit Mono', Consolas, 'SF Mono', monospace;
337
+ --hop-font-family-secondary: 'Inter', Helvetica, Arial, sans-serif;
338
+ --hop-font-family-primary: 'ABC Favorit', Helvetica, Arial, sans-serif;
339
+ --hop-shadow-lg: 0 10px 18px 8px rgba(60, 60, 60, 0.08);
340
+ --hop-shadow-md: 0 4px 10px 4px rgba(60, 60, 60, 0.08);
341
+ --hop-shadow-sm: 0 1px 6px 0 rgba(60, 60, 60, 0.10);
342
+ --hop-shadow-none: none;
343
+ --hop-samoyed: #ffffff;
344
+ --hop-rock-900: #292929;
345
+ --hop-rock-800: #3c3c3c;
346
+ --hop-rock-700: #505050;
347
+ --hop-rock-600: #636362;
348
+ --hop-rock-500: #6c6c6b;
349
+ --hop-rock-400: #777775;
350
+ --hop-rock-300: #959593;
351
+ --hop-rock-200: #b3b3b1;
352
+ --hop-rock-100: #ccccca;
353
+ --hop-rock-75: #e0dfdd;
354
+ --hop-rock-50: #ecebe8;
355
+ --hop-rock-25: #f8f6f3;
356
+ --hop-rock-20: #fcfbfb;
357
+ --hop-abyss: #1d1d1c;
358
+ --hop-moss-900: #132a27;
359
+ --hop-moss-800: #16433d;
360
+ --hop-moss-700: #115a52;
361
+ --hop-moss-600: #0a6f64;
362
+ --hop-moss-500: #0c796b;
363
+ --hop-moss-400: #188a71;
364
+ --hop-moss-300: #47a584;
365
+ --hop-moss-200: #7dc291;
366
+ --hop-moss-100: #aad89d;
367
+ --hop-moss-75: #cde8ac;
368
+ --hop-moss-50: #e3f3b9;
369
+ --hop-moss-25: #f4f9e9;
370
+ --hop-amanita-900: #431a17;
371
+ --hop-amanita-800: #6c2320;
372
+ --hop-amanita-700: #952927;
373
+ --hop-amanita-600: #ba2d2d;
374
+ --hop-amanita-500: #cb2e31;
375
+ --hop-amanita-400: #df3236;
376
+ --hop-amanita-300: #fa4d59;
377
+ --hop-amanita-200: #ff8e8e;
378
+ --hop-amanita-100: #ffbcb7;
379
+ --hop-amanita-75: #ffd6d3;
380
+ --hop-amanita-50: #fde6e5;
381
+ --hop-amanita-25: #fdf6f6;
382
+ --hop-koi-900: #451a02;
383
+ --hop-koi-800: #692803;
384
+ --hop-koi-700: #8c3504;
385
+ --hop-koi-600: #ab4104;
386
+ --hop-koi-500: #ba4705;
387
+ --hop-koi-400: #c95109;
388
+ --hop-koi-300: #e57723;
389
+ --hop-koi-200: #ff9b3f;
390
+ --hop-koi-100: #ffbf92;
391
+ --hop-koi-75: #ffd8be;
392
+ --hop-koi-50: #ffe8d3;
393
+ --hop-koi-25: #fff5e9;
394
+ --hop-sunken-treasure-900: #2f250d;
395
+ --hop-sunken-treasure-800: #4b390f;
396
+ --hop-sunken-treasure-700: #654c0d;
397
+ --hop-sunken-treasure-600: #7e5e0a;
398
+ --hop-sunken-treasure-500: #8b6609;
399
+ --hop-sunken-treasure-400: #996f08;
400
+ --hop-sunken-treasure-300: #c28b12;
401
+ --hop-sunken-treasure-200: #e2a934;
402
+ --hop-sunken-treasure-100: #eac96d;
403
+ --hop-sunken-treasure-75: #f7e694;
404
+ --hop-sunken-treasure-50: #fff2b8;
405
+ --hop-sunken-treasure-25: #fff8d6;
406
+ --hop-toad-900: #2a2620;
407
+ --hop-toad-800: #433b31;
408
+ --hop-toad-700: #594f41;
409
+ --hop-toad-600: #6e6151;
410
+ --hop-toad-500: #776a59;
411
+ --hop-toad-400: #837463;
412
+ --hop-toad-300: #a19382;
413
+ --hop-toad-200: #bdb1a3;
414
+ --hop-toad-100: #d4cbc0;
415
+ --hop-toad-75: #e5ded6;
416
+ --hop-toad-50: #f0eae3;
417
+ --hop-toad-25: #fef6ef;
418
+ --hop-fog-900: #20282a;
419
+ --hop-fog-800: #313e43;
420
+ --hop-fog-700: #40535a;
421
+ --hop-fog-600: #4e6770;
422
+ --hop-fog-500: #557079;
423
+ --hop-fog-400: #5e7b84;
424
+ --hop-fog-300: #7c9aa3;
425
+ --hop-fog-200: #9cb7be;
426
+ --hop-fog-100: #bad0d5;
427
+ --hop-fog-75: #d2e3e7;
428
+ --hop-fog-50: #e1eef1;
429
+ --hop-fog-25: #f2f8fa;
430
+ --hop-sapphire-900: #152450;
431
+ --hop-sapphire-800: #1b3587;
432
+ --hop-sapphire-700: #2040c7;
433
+ --hop-sapphire-600: #2a43e8;
434
+ --hop-sapphire-500: #3b57ff;
435
+ --hop-sapphire-400: #4767fe;
436
+ --hop-sapphire-300: #6c8ffd;
437
+ --hop-sapphire-200: #95b1ff;
438
+ --hop-sapphire-100: #b9cbff;
439
+ --hop-sapphire-75: #d6e0ff;
440
+ --hop-sapphire-50: #e6ebff;
441
+ --hop-sapphire-25: #f5f6ff;
442
+ --hop-orchid-bloom-900: #1e1c5d;
443
+ --hop-orchid-bloom-800: #322b8d;
444
+ --hop-orchid-bloom-700: #433fac;
445
+ --hop-orchid-bloom-600: #5454be;
446
+ --hop-orchid-bloom-500: #5f61c5;
447
+ --hop-orchid-bloom-400: #6b6ecc;
448
+ --hop-orchid-bloom-300: #8d91dc;
449
+ --hop-orchid-bloom-200: #aeb3e8;
450
+ --hop-orchid-bloom-100: #c8caf0;
451
+ --hop-orchid-bloom-75: #ddddf7;
452
+ --hop-orchid-bloom-50: #eae9fb;
453
+ --hop-orchid-bloom-25: #f6f5ff;
454
+ --hop-quetzal-900: #002d1c;
455
+ --hop-quetzal-800: #00452d;
456
+ --hop-quetzal-700: #055c41;
457
+ --hop-quetzal-600: #206f54;
458
+ --hop-quetzal-500: #2b795e;
459
+ --hop-quetzal-400: #38836a;
460
+ --hop-quetzal-300: #5da18c;
461
+ --hop-quetzal-200: #83beaf;
462
+ --hop-quetzal-100: #a3d6cb;
463
+ --hop-quetzal-75: #bde8e1;
464
+ --hop-quetzal-50: #cff4ef;
465
+ --hop-quetzal-25: #ddfdf9;
466
+ --hop-coastal-900: #00274b;
467
+ --hop-coastal-800: #003d70;
468
+ --hop-coastal-700: #0a538b;
469
+ --hop-coastal-600: #23669f;
470
+ --hop-coastal-500: #2e70a8;
471
+ --hop-coastal-400: #3a7bb2;
472
+ --hop-coastal-300: #5d9acd;
473
+ --hop-coastal-200: #81b9e4;
474
+ --hop-coastal-100: #9fd2f7;
475
+ --hop-coastal-75: #bae6ff;
476
+ --hop-coastal-50: #d9efff;
477
+ --hop-coastal-25: #f0f8ff;
478
+ --hop-comp-button-border-color: var(--hop-amanita-100);
479
+ --hop-shape-rounded-sm: var(--hop-border-radius-1);
480
+ --hop-shape-rounded-md: var(--hop-border-radius-2);
481
+ --hop-shape-rounded-lg: var(--hop-border-radius-3);
482
+ --hop-shape-pill: var(--hop-border-radius-4);
483
+ --hop-shape-circle: var(--hop-border-radius-9999);
484
+ --hop-accent-sm-line-height: var(--hop-line-height-1-33);
485
+ --hop-accent-sm-font-weight: var(--hop-font-weight-580);
486
+ --hop-accent-sm-font-size: var(--hop-font-size-180);
487
+ --hop-accent-sm-font-family: var(--hop-font-family-primary);
488
+ --hop-accent-lg-line-height: var(--hop-line-height-1-125);
489
+ --hop-accent-lg-font-weight: var(--hop-font-weight-580);
490
+ --hop-accent-lg-font-size: var(--hop-font-size-480);
491
+ --hop-accent-lg-font-family: var(--hop-font-family-primary);
492
+ --hop-body-xs-underline-line-height: var(--hop-line-height-1-33);
493
+ --hop-body-xs-underline-font-weight: var(--hop-font-weight-505);
494
+ --hop-body-xs-underline-font-size: var(--hop-font-size-120);
495
+ --hop-body-xs-underline-font-family: var(--hop-font-family-secondary);
496
+ --hop-body-xs-bold-line-height: var(--hop-line-height-1-33);
497
+ --hop-body-xs-bold-font-weight: var(--hop-font-weight-690);
498
+ --hop-body-xs-bold-font-size: var(--hop-font-size-120);
499
+ --hop-body-xs-bold-font-family: var(--hop-font-family-secondary);
500
+ --hop-body-xs-semibold-line-height: var(--hop-line-height-1-33);
501
+ --hop-body-xs-semibold-font-weight: var(--hop-font-weight-590);
502
+ --hop-body-xs-semibold-font-size: var(--hop-font-size-120);
503
+ --hop-body-xs-semibold-font-family: var(--hop-font-family-secondary);
504
+ --hop-body-xs-medium-line-height: var(--hop-line-height-1-33);
505
+ --hop-body-xs-medium-font-weight: var(--hop-font-weight-505);
506
+ --hop-body-xs-medium-font-size: var(--hop-font-size-120);
507
+ --hop-body-xs-medium-font-family: var(--hop-font-family-secondary);
508
+ --hop-body-xs-line-height: var(--hop-line-height-1-33);
509
+ --hop-body-xs-font-weight: var(--hop-font-weight-410);
510
+ --hop-body-xs-font-size: var(--hop-font-size-120);
511
+ --hop-body-xs-font-family: var(--hop-font-family-secondary);
512
+ --hop-body-sm-underline-line-height: var(--hop-line-height-1-4285);
513
+ --hop-body-sm-underline-font-weight: var(--hop-font-weight-505);
514
+ --hop-body-sm-underline-font-size: var(--hop-font-size-140);
515
+ --hop-body-sm-underline-font-family: var(--hop-font-family-secondary);
516
+ --hop-body-sm-bold-line-height: var(--hop-line-height-1-4285);
517
+ --hop-body-sm-bold-font-weight: var(--hop-font-weight-690);
518
+ --hop-body-sm-bold-font-size: var(--hop-font-size-140);
519
+ --hop-body-sm-bold-font-family: var(--hop-font-family-secondary);
520
+ --hop-body-sm-semibold-line-height: var(--hop-line-height-1-4285);
521
+ --hop-body-sm-semibold-font-weight: var(--hop-font-weight-590);
522
+ --hop-body-sm-semibold-font-size: var(--hop-font-size-140);
523
+ --hop-body-sm-semibold-font-family: var(--hop-font-family-secondary);
524
+ --hop-body-sm-medium-line-height: var(--hop-line-height-1-4285);
525
+ --hop-body-sm-medium-font-weight: var(--hop-font-weight-505);
526
+ --hop-body-sm-medium-font-size: var(--hop-font-size-140);
527
+ --hop-body-sm-medium-font-family: var(--hop-font-family-secondary);
528
+ --hop-body-sm-line-height: var(--hop-line-height-1-4285);
529
+ --hop-body-sm-font-weight: var(--hop-font-weight-410);
530
+ --hop-body-sm-font-size: var(--hop-font-size-140);
531
+ --hop-body-sm-font-family: var(--hop-font-family-secondary);
532
+ --hop-body-md-underline-line-height: var(--hop-line-height-1-50);
533
+ --hop-body-md-underline-font-weight: var(--hop-font-weight-410);
534
+ --hop-body-md-underline-font-size: var(--hop-font-size-160);
535
+ --hop-body-md-underline-font-family: var(--hop-font-family-secondary);
536
+ --hop-body-md-bold-line-height: var(--hop-line-height-1-50);
537
+ --hop-body-md-bold-font-weight: var(--hop-font-weight-690);
538
+ --hop-body-md-bold-font-size: var(--hop-font-size-160);
539
+ --hop-body-md-bold-font-family: var(--hop-font-family-secondary);
540
+ --hop-body-md-semibold-line-height: var(--hop-line-height-1-50);
541
+ --hop-body-md-semibold-font-weight: var(--hop-font-weight-590);
542
+ --hop-body-md-semibold-font-size: var(--hop-font-size-160);
543
+ --hop-body-md-semibold-font-family: var(--hop-font-family-secondary);
544
+ --hop-body-md-medium-line-height: var(--hop-line-height-1-50);
545
+ --hop-body-md-medium-font-weight: var(--hop-font-weight-505);
546
+ --hop-body-md-medium-font-size: var(--hop-font-size-160);
547
+ --hop-body-md-medium-font-family: var(--hop-font-family-secondary);
548
+ --hop-body-md-line-height: var(--hop-line-height-1-50);
549
+ --hop-body-md-font-weight: var(--hop-font-weight-410);
550
+ --hop-body-md-font-size: var(--hop-font-size-160);
551
+ --hop-body-md-font-family: var(--hop-font-family-secondary);
552
+ --hop-body-lg-underline-line-height: var(--hop-line-height-1-33);
553
+ --hop-body-lg-underline-font-weight: var(--hop-font-weight-505);
554
+ --hop-body-lg-underline-font-size: var(--hop-font-size-180);
555
+ --hop-body-lg-underline-font-family: var(--hop-font-family-secondary);
556
+ --hop-body-lg-bold-line-height: var(--hop-line-height-1-33);
557
+ --hop-body-lg-bold-font-weight: var(--hop-font-weight-690);
558
+ --hop-body-lg-bold-font-size: var(--hop-font-size-180);
559
+ --hop-body-lg-bold-font-family: var(--hop-font-family-secondary);
560
+ --hop-body-lg-semibold-line-height: var(--hop-line-height-1-33);
561
+ --hop-body-lg-semibold-font-weight: var(--hop-font-weight-590);
562
+ --hop-body-lg-semibold-font-size: var(--hop-font-size-180);
563
+ --hop-body-lg-semibold-font-family: var(--hop-font-family-secondary);
564
+ --hop-body-lg-medium-line-height: var(--hop-line-height-1-33);
565
+ --hop-body-lg-medium-font-weight: var(--hop-font-weight-505);
566
+ --hop-body-lg-medium-font-size: var(--hop-font-size-180);
567
+ --hop-body-lg-medium-font-family: var(--hop-font-family-secondary);
568
+ --hop-body-lg-line-height: var(--hop-line-height-1-33);
569
+ --hop-body-lg-font-weight: var(--hop-font-weight-410);
570
+ --hop-body-lg-font-size: var(--hop-font-size-180);
571
+ --hop-body-lg-font-family: var(--hop-font-family-secondary);
572
+ --hop-body-xl-line-height: var(--hop-line-height-1-14);
573
+ --hop-body-xl-font-weight: var(--hop-font-weight-410);
574
+ --hop-body-xl-font-size: var(--hop-font-size-280);
575
+ --hop-body-xl-font-family: var(--hop-font-family-secondary);
576
+ --hop-body-2xl-line-height: var(--hop-line-height-1-125);
577
+ --hop-body-2xl-font-weight: var(--hop-font-weight-410);
578
+ --hop-body-2xl-font-size: var(--hop-font-size-320);
579
+ --hop-body-2xl-font-family: var(--hop-font-family-secondary);
580
+ --hop-overline-line-height: var(--hop-line-height-1-33);
581
+ --hop-overline-font-weight: var(--hop-font-weight-400);
582
+ --hop-overline-font-size: var(--hop-font-size-120);
583
+ --hop-overline-font-family: var(--hop-font-family-tertiary);
584
+ --hop-heading-xs-medium-line-height: var(--hop-line-height-1-50);
585
+ --hop-heading-xs-medium-font-weight: var(--hop-font-weight-580);
586
+ --hop-heading-xs-medium-font-size: var(--hop-font-size-160);
587
+ --hop-heading-xs-medium-font-family: var(--hop-font-family-primary);
588
+ --hop-heading-xs-line-height: var(--hop-line-height-1-50);
589
+ --hop-heading-xs-font-weight: var(--hop-font-weight-410);
590
+ --hop-heading-xs-font-size: var(--hop-font-size-160);
591
+ --hop-heading-xs-font-family: var(--hop-font-family-primary);
592
+ --hop-heading-sm-line-height: var(--hop-line-height-1-33);
593
+ --hop-heading-sm-font-weight: var(--hop-font-weight-580);
594
+ --hop-heading-sm-font-size: var(--hop-font-size-180);
595
+ --hop-heading-sm-font-family: var(--hop-font-family-primary);
596
+ --hop-heading-md-line-height: var(--hop-line-height-1-20);
597
+ --hop-heading-md-font-weight: var(--hop-font-weight-580);
598
+ --hop-heading-md-font-size: var(--hop-font-size-200);
599
+ --hop-heading-md-font-family: var(--hop-font-family-primary);
600
+ --hop-heading-lg-line-height: var(--hop-line-height-1-33);
601
+ --hop-heading-lg-font-weight: var(--hop-font-weight-680);
602
+ --hop-heading-lg-font-size: var(--hop-font-size-240);
603
+ --hop-heading-lg-font-family: var(--hop-font-family-primary);
604
+ --hop-heading-xl-line-height: var(--hop-line-height-1-14);
605
+ --hop-heading-xl-font-weight: var(--hop-font-weight-680);
606
+ --hop-heading-xl-font-size: var(--hop-font-size-280);
607
+ --hop-heading-xl-font-family: var(--hop-font-family-primary);
608
+ --hop-heading-2xl-line-height: var(--hop-line-height-1-25);
609
+ --hop-heading-2xl-font-weight: var(--hop-font-weight-580);
610
+ --hop-heading-2xl-font-size: var(--hop-font-size-320);
611
+ --hop-heading-2xl-font-family: var(--hop-font-family-primary);
612
+ --hop-heading-3xl-line-height: var(--hop-line-height-1-33);
613
+ --hop-heading-3xl-font-weight: var(--hop-font-weight-680);
614
+ --hop-heading-3xl-font-size: var(--hop-font-size-360);
615
+ --hop-heading-3xl-font-family: var(--hop-font-family-primary);
616
+ --hop-elevation-floating: var(--hop-shadow-lg);
617
+ --hop-elevation-lifted: var(--hop-shadow-md);
618
+ --hop-elevation-raised: var(--hop-shadow-sm);
619
+ --hop-elevation-none: var(--hop-shadow-none);
620
+ --hop-dataviz-text-ondark: var(--hop-samoyed);
621
+ --hop-dataviz-text-onlight: var(--hop-rock-800);
622
+ --hop-dataviz-unavailable-strong: var(--hop-rock-100);
623
+ --hop-dataviz-unavailable-weak: var(--hop-rock-50);
624
+ --hop-dataviz-unavailable: var(--hop-rock-75);
625
+ --hop-warning-text-weak: var(--hop-koi-300);
626
+ --hop-warning-text: var(--hop-koi-700);
627
+ --hop-warning-surface-weak: var(--hop-koi-50);
628
+ --hop-warning-surface-strong: var(--hop-koi-100);
629
+ --hop-warning-surface: var(--hop-koi-25);
630
+ --hop-warning-icon-weak: var(--hop-koi-300);
631
+ --hop-warning-icon-weakest: var(--hop-koi-100);
632
+ --hop-warning-icon: var(--hop-koi-700);
633
+ --hop-warning-border: var(--hop-koi-100);
634
+ --hop-success-text-weak: var(--hop-moss-300);
635
+ --hop-success-text-hover: var(--hop-moss-800);
636
+ --hop-success-text: var(--hop-moss-700);
637
+ --hop-success-surface-weak: var(--hop-moss-50);
638
+ --hop-success-surface-strong: var(--hop-moss-100);
639
+ --hop-success-surface: var(--hop-moss-25);
640
+ --hop-success-icon-weak: var(--hop-moss-300);
641
+ --hop-success-icon-weakest: var(--hop-moss-100);
642
+ --hop-success-icon: var(--hop-moss-700);
643
+ --hop-success-border: var(--hop-moss-100);
644
+ --hop-status-progress-text-selected: var(--hop-sapphire-500);
645
+ --hop-status-progress-text-press: var(--hop-sapphire-800);
646
+ --hop-status-progress-text-hover: var(--hop-sapphire-700);
647
+ --hop-status-progress-text-disabled: var(--hop-sapphire-200);
648
+ --hop-status-progress-text: var(--hop-sapphire-600);
649
+ --hop-status-progress-surface-strong: var(--hop-sapphire-200);
650
+ --hop-status-progress-surface-selected: var(--hop-sapphire-50);
651
+ --hop-status-progress-surface-press: var(--hop-sapphire-100);
652
+ --hop-status-progress-surface-hover: var(--hop-sapphire-75);
653
+ --hop-status-progress-surface-disabled: var(--hop-sapphire-25);
654
+ --hop-status-progress-surface: var(--hop-sapphire-50);
655
+ --hop-status-progress-icon-selected: var(--hop-sapphire-500);
656
+ --hop-status-progress-icon-press: var(--hop-sapphire-800);
657
+ --hop-status-progress-icon-hover: var(--hop-sapphire-700);
658
+ --hop-status-progress-icon-disabled: var(--hop-sapphire-200);
659
+ --hop-status-progress-icon: var(--hop-sapphire-600);
660
+ --hop-status-progress-border-selected: var(--hop-sapphire-400);
661
+ --hop-status-progress-border-press: var(--hop-sapphire-500);
662
+ --hop-status-progress-border-hover: var(--hop-sapphire-400);
663
+ --hop-status-progress-border-disabled: var(--hop-sapphire-50);
664
+ --hop-status-progress-border: var(--hop-sapphire-300);
665
+ --hop-status-positive-text-selected: var(--hop-moss-700);
666
+ --hop-status-positive-text-press: var(--hop-moss-800);
667
+ --hop-status-positive-text-hover: var(--hop-moss-700);
668
+ --hop-status-positive-text-disabled: var(--hop-moss-200);
669
+ --hop-status-positive-text: var(--hop-moss-600);
670
+ --hop-status-positive-surface-strong: var(--hop-moss-200);
671
+ --hop-status-positive-surface-selected: var(--hop-moss-50);
672
+ --hop-status-positive-surface-press: var(--hop-moss-100);
673
+ --hop-status-positive-surface-hover: var(--hop-moss-75);
674
+ --hop-status-positive-surface-disabled: var(--hop-moss-25);
675
+ --hop-status-positive-surface: var(--hop-moss-50);
676
+ --hop-status-positive-icon-selected: var(--hop-moss-700);
677
+ --hop-status-positive-icon-press: var(--hop-moss-800);
678
+ --hop-status-positive-icon-hover: var(--hop-moss-700);
679
+ --hop-status-positive-icon-disabled: var(--hop-moss-200);
680
+ --hop-status-positive-icon: var(--hop-moss-600);
681
+ --hop-status-positive-border-selected: var(--hop-moss-700);
682
+ --hop-status-positive-border-press: var(--hop-moss-500);
683
+ --hop-status-positive-border-hover: var(--hop-moss-400);
684
+ --hop-status-positive-border-disabled: var(--hop-moss-50);
685
+ --hop-status-positive-border: var(--hop-moss-300);
686
+ --hop-status-option6-text-selected: var(--hop-sunken-treasure-700);
687
+ --hop-status-option6-text-press: var(--hop-sunken-treasure-800);
688
+ --hop-status-option6-text-hover: var(--hop-sunken-treasure-700);
689
+ --hop-status-option6-text-disabled: var(--hop-sunken-treasure-200);
690
+ --hop-status-option6-text: var(--hop-sunken-treasure-600);
691
+ --hop-status-option6-surface-strong: var(--hop-sunken-treasure-200);
692
+ --hop-status-option6-surface-selected: var(--hop-sunken-treasure-50);
693
+ --hop-status-option6-surface-press: var(--hop-sunken-treasure-100);
694
+ --hop-status-option6-surface-hover: var(--hop-sunken-treasure-50);
695
+ --hop-status-option6-surface-disabled: var(--hop-sunken-treasure-25);
696
+ --hop-status-option6-surface: var(--hop-sunken-treasure-25);
697
+ --hop-status-option6-icon-selected: var(--hop-sunken-treasure-700);
698
+ --hop-status-option6-icon-press: var(--hop-sunken-treasure-800);
699
+ --hop-status-option6-icon-hover: var(--hop-sunken-treasure-700);
700
+ --hop-status-option6-icon-disabled: var(--hop-sunken-treasure-200);
701
+ --hop-status-option6-icon: var(--hop-sunken-treasure-600);
702
+ --hop-status-option6-border-selected: var(--hop-sunken-treasure-700);
703
+ --hop-status-option6-border-press: var(--hop-sunken-treasure-500);
704
+ --hop-status-option6-border-hover: var(--hop-sunken-treasure-400);
705
+ --hop-status-option6-border-disabled: var(--hop-sunken-treasure-50);
706
+ --hop-status-option6-border: var(--hop-sunken-treasure-300);
707
+ --hop-status-option5-text-selected: var(--hop-toad-700);
708
+ --hop-status-option5-text-press: var(--hop-toad-800);
709
+ --hop-status-option5-text-hover: var(--hop-toad-700);
710
+ --hop-status-option5-text-disabled: var(--hop-toad-200);
711
+ --hop-status-option5-text: var(--hop-toad-600);
712
+ --hop-status-option5-surface-strong: var(--hop-toad-200);
713
+ --hop-status-option5-surface-selected: var(--hop-toad-50);
714
+ --hop-status-option5-surface-press: var(--hop-toad-100);
715
+ --hop-status-option5-surface-hover: var(--hop-toad-75);
716
+ --hop-status-option5-surface-disabled: var(--hop-toad-25);
717
+ --hop-status-option5-surface: var(--hop-toad-50);
718
+ --hop-status-option5-icon-selected: var(--hop-toad-700);
719
+ --hop-status-option5-icon-press: var(--hop-toad-800);
720
+ --hop-status-option5-icon-hover: var(--hop-toad-700);
721
+ --hop-status-option5-icon-disabled: var(--hop-toad-200);
722
+ --hop-status-option5-icon: var(--hop-toad-600);
723
+ --hop-status-option5-border-selected: var(--hop-toad-700);
724
+ --hop-status-option5-border-press: var(--hop-toad-500);
725
+ --hop-status-option5-border-hover: var(--hop-toad-400);
726
+ --hop-status-option5-border-disabled: var(--hop-toad-50);
727
+ --hop-status-option5-border: var(--hop-toad-300);
728
+ --hop-status-option4-text-selected: var(--hop-fog-700);
729
+ --hop-status-option4-text-press: var(--hop-fog-800);
730
+ --hop-status-option4-text-hover: var(--hop-fog-700);
731
+ --hop-status-option4-text-disabled: var(--hop-fog-200);
732
+ --hop-status-option4-text: var(--hop-fog-600);
733
+ --hop-status-option4-surface-strong: var(--hop-fog-200);
734
+ --hop-status-option4-surface-selected: var(--hop-fog-50);
735
+ --hop-status-option4-surface-press: var(--hop-fog-100);
736
+ --hop-status-option4-surface-hover: var(--hop-fog-75);
737
+ --hop-status-option4-surface-disabled: var(--hop-fog-25);
738
+ --hop-status-option4-surface: var(--hop-fog-50);
739
+ --hop-status-option4-icon-selected: var(--hop-fog-700);
740
+ --hop-status-option4-icon-press: var(--hop-fog-800);
741
+ --hop-status-option4-icon-hover: var(--hop-fog-700);
742
+ --hop-status-option4-icon-disabled: var(--hop-fog-200);
743
+ --hop-status-option4-icon: var(--hop-fog-600);
744
+ --hop-status-option4-border-selected: var(--hop-fog-700);
745
+ --hop-status-option4-border-press: var(--hop-fog-500);
746
+ --hop-status-option4-border-hover: var(--hop-fog-400);
747
+ --hop-status-option4-border-disabled: var(--hop-fog-50);
748
+ --hop-status-option4-border: var(--hop-fog-300);
749
+ --hop-status-option3-text-selected: var(--hop-quetzal-700);
750
+ --hop-status-option3-text-press: var(--hop-quetzal-800);
751
+ --hop-status-option3-text-hover: var(--hop-quetzal-700);
752
+ --hop-status-option3-text-disabled: var(--hop-quetzal-200);
753
+ --hop-status-option3-text: var(--hop-quetzal-600);
754
+ --hop-status-option3-surface-strong: var(--hop-quetzal-200);
755
+ --hop-status-option3-surface-selected: var(--hop-quetzal-700);
756
+ --hop-status-option3-surface-press: var(--hop-quetzal-100);
757
+ --hop-status-option3-surface-hover: var(--hop-quetzal-75);
758
+ --hop-status-option3-surface-disabled: var(--hop-quetzal-25);
759
+ --hop-status-option3-surface: var(--hop-quetzal-50);
760
+ --hop-status-option3-icon-selected: var(--hop-quetzal-700);
761
+ --hop-status-option3-icon-press: var(--hop-quetzal-800);
762
+ --hop-status-option3-icon-hover: var(--hop-quetzal-700);
763
+ --hop-status-option3-icon-disabled: var(--hop-quetzal-200);
764
+ --hop-status-option3-icon: var(--hop-quetzal-600);
765
+ --hop-status-option3-border-selected: var(--hop-quetzal-50);
766
+ --hop-status-option3-border-press: var(--hop-quetzal-500);
767
+ --hop-status-option3-border-hover: var(--hop-quetzal-400);
768
+ --hop-status-option3-border-disabled: var(--hop-quetzal-50);
769
+ --hop-status-option3-border: var(--hop-quetzal-300);
770
+ --hop-status-option2-text-selected: var(--hop-orchid-bloom-700);
771
+ --hop-status-option2-text-press: var(--hop-orchid-bloom-800);
772
+ --hop-status-option2-text-hover: var(--hop-orchid-bloom-700);
773
+ --hop-status-option2-text-disabled: var(--hop-orchid-bloom-200);
774
+ --hop-status-option2-text: var(--hop-orchid-bloom-600);
775
+ --hop-status-option2-surface-strong: var(--hop-orchid-bloom-200);
776
+ --hop-status-option2-surface-selected: var(--hop-orchid-bloom-50);
777
+ --hop-status-option2-surface-press: var(--hop-orchid-bloom-100);
778
+ --hop-status-option2-surface-hover: var(--hop-orchid-bloom-75);
779
+ --hop-status-option2-surface-disabled: var(--hop-orchid-bloom-25);
780
+ --hop-status-option2-surface: var(--hop-orchid-bloom-50);
781
+ --hop-status-option2-icon-selected: var(--hop-orchid-bloom-700);
782
+ --hop-status-option2-icon-press: var(--hop-orchid-bloom-800);
783
+ --hop-status-option2-icon-hover: var(--hop-orchid-bloom-700);
784
+ --hop-status-option2-icon-disabled: var(--hop-orchid-bloom-200);
785
+ --hop-status-option2-icon: var(--hop-orchid-bloom-600);
786
+ --hop-status-option2-border-selected: var(--hop-orchid-bloom-700);
787
+ --hop-status-option2-border-press: var(--hop-orchid-bloom-500);
788
+ --hop-status-option2-border-hover: var(--hop-orchid-bloom-400);
789
+ --hop-status-option2-border-disabled: var(--hop-orchid-bloom-50);
790
+ --hop-status-option2-border: var(--hop-orchid-bloom-300);
791
+ --hop-status-option1-text-selected: var(--hop-coastal-700);
792
+ --hop-status-option1-text-press: var(--hop-coastal-800);
793
+ --hop-status-option1-text-hover: var(--hop-coastal-700);
794
+ --hop-status-option1-text-disabled: var(--hop-coastal-200);
795
+ --hop-status-option1-text: var(--hop-coastal-600);
796
+ --hop-status-option1-surface-strong: var(--hop-coastal-200);
797
+ --hop-status-option1-surface-selected: var(--hop-coastal-50);
798
+ --hop-status-option1-surface-press: var(--hop-coastal-100);
799
+ --hop-status-option1-surface-hover: var(--hop-coastal-75);
800
+ --hop-status-option1-surface-disabled: var(--hop-coastal-25);
801
+ --hop-status-option1-surface: var(--hop-coastal-50);
802
+ --hop-status-option1-icon-selected: var(--hop-coastal-700);
803
+ --hop-status-option1-icon-press: var(--hop-coastal-800);
804
+ --hop-status-option1-icon-hover: var(--hop-coastal-700);
805
+ --hop-status-option1-icon-disabled: var(--hop-coastal-200);
806
+ --hop-status-option1-icon: var(--hop-coastal-600);
807
+ --hop-status-option1-border-selected: var(--hop-coastal-700);
808
+ --hop-status-option1-border-press: var(--hop-coastal-500);
809
+ --hop-status-option1-border-hover: var(--hop-coastal-400);
810
+ --hop-status-option1-border-disabled: var(--hop-coastal-50);
811
+ --hop-status-option1-border: var(--hop-coastal-300);
812
+ --hop-status-neutral-text-selected: var(--hop-samoyed);
813
+ --hop-status-neutral-text-press: var(--hop-rock-900);
814
+ --hop-status-neutral-text-hover: var(--hop-rock-700);
815
+ --hop-status-neutral-text-disabled: var(--hop-rock-300);
816
+ --hop-status-neutral-text: var(--hop-rock-800);
817
+ --hop-status-neutral-surface-strong: var(--hop-rock-200);
818
+ --hop-status-neutral-surface-selected: var(--hop-rock-800);
819
+ --hop-status-neutral-surface-press: var(--hop-rock-50);
820
+ --hop-status-neutral-surface-hover: var(--hop-rock-25);
821
+ --hop-status-neutral-surface-disabled: var(--hop-rock-50);
822
+ --hop-status-neutral-surface: var(--hop-samoyed);
823
+ --hop-status-neutral-icon-selected: var(--hop-samoyed);
824
+ --hop-status-neutral-icon-press: var(--hop-rock-900);
825
+ --hop-status-neutral-icon-hover: var(--hop-rock-700);
826
+ --hop-status-neutral-icon-disabled: var(--hop-rock-300);
827
+ --hop-status-neutral-icon: var(--hop-rock-800);
828
+ --hop-status-neutral-border-selected: var(--hop-rock-800);
829
+ --hop-status-neutral-border-press: var(--hop-rock-900);
830
+ --hop-status-neutral-border-hover: var(--hop-rock-700);
831
+ --hop-status-neutral-border-disabled: var(--hop-rock-50);
832
+ --hop-status-neutral-border: var(--hop-rock-800);
833
+ --hop-status-negative-text-selected: var(--hop-amanita-700);
834
+ --hop-status-negative-text-press: var(--hop-amanita-800);
835
+ --hop-status-negative-text-hover: var(--hop-amanita-700);
836
+ --hop-status-negative-text-disabled: var(--hop-amanita-200);
837
+ --hop-status-negative-text: var(--hop-amanita-600);
838
+ --hop-status-negative-surface-strong: var(--hop-amanita-200);
839
+ --hop-status-negative-surface-selected: var(--hop-amanita-50);
840
+ --hop-status-negative-surface-press: var(--hop-amanita-100);
841
+ --hop-status-negative-surface-hover: var(--hop-amanita-75);
842
+ --hop-status-negative-surface-disabled: var(--hop-amanita-25);
843
+ --hop-status-negative-surface: var(--hop-amanita-50);
844
+ --hop-status-negative-icon-selected: var(--hop-amanita-700);
845
+ --hop-status-negative-icon-press: var(--hop-amanita-800);
846
+ --hop-status-negative-icon-hover: var(--hop-amanita-700);
847
+ --hop-status-negative-icon-disabled: var(--hop-amanita-200);
848
+ --hop-status-negative-icon: var(--hop-amanita-600);
849
+ --hop-status-negative-border-selected: var(--hop-amanita-700);
850
+ --hop-status-negative-border-press: var(--hop-amanita-500);
851
+ --hop-status-negative-border-hover: var(--hop-amanita-400);
852
+ --hop-status-negative-border-disabled: var(--hop-amanita-50);
853
+ --hop-status-negative-border: var(--hop-amanita-300);
854
+ --hop-status-inactive-text-selected: var(--hop-rock-700);
855
+ --hop-status-inactive-text-press: var(--hop-rock-800);
856
+ --hop-status-inactive-text-hover: var(--hop-rock-700);
857
+ --hop-status-inactive-text-disabled: var(--hop-rock-200);
858
+ --hop-status-inactive-text: var(--hop-rock-600);
859
+ --hop-status-inactive-surface-strong: var(--hop-rock-100);
860
+ --hop-status-inactive-surface-selected: var(--hop-rock-50);
861
+ --hop-status-inactive-surface-press: var(--hop-rock-100);
862
+ --hop-status-inactive-surface-hover: var(--hop-rock-75);
863
+ --hop-status-inactive-surface-disabled: var(--hop-rock-25);
864
+ --hop-status-inactive-surface: var(--hop-rock-50);
865
+ --hop-status-inactive-icon-selected: var(--hop-rock-700);
866
+ --hop-status-inactive-icon-press: var(--hop-rock-800);
867
+ --hop-status-inactive-icon-hover: var(--hop-rock-700);
868
+ --hop-status-inactive-icon-disabled: var(--hop-rock-200);
869
+ --hop-status-inactive-icon: var(--hop-rock-600);
870
+ --hop-status-inactive-border-selected: var(--hop-rock-700);
871
+ --hop-status-inactive-border-press: var(--hop-rock-500);
872
+ --hop-status-inactive-border-hover: var(--hop-rock-400);
873
+ --hop-status-inactive-border-disabled: var(--hop-rock-50);
874
+ --hop-status-inactive-border: var(--hop-rock-300);
875
+ --hop-status-caution-text-selected: var(--hop-koi-700);
876
+ --hop-status-caution-text-press: var(--hop-koi-800);
877
+ --hop-status-caution-text-hover: var(--hop-koi-700);
878
+ --hop-status-caution-text-disabled: var(--hop-koi-200);
879
+ --hop-status-caution-text: var(--hop-koi-600);
880
+ --hop-status-caution-surface-strong: var(--hop-koi-200);
881
+ --hop-status-caution-surface-selected: var(--hop-koi-50);
882
+ --hop-status-caution-surface-press: var(--hop-koi-100);
883
+ --hop-status-caution-surface-hover: var(--hop-koi-75);
884
+ --hop-status-caution-surface-disabled: var(--hop-koi-25);
885
+ --hop-status-caution-surface: var(--hop-koi-50);
886
+ --hop-status-caution-icon-selected: var(--hop-koi-700);
887
+ --hop-status-caution-icon-press: var(--hop-koi-800);
888
+ --hop-status-caution-icon-hover: var(--hop-koi-700);
889
+ --hop-status-caution-icon-disabled: var(--hop-koi-200);
890
+ --hop-status-caution-icon: var(--hop-koi-600);
891
+ --hop-status-caution-border-selected: var(--hop-koi-700);
892
+ --hop-status-caution-border-press: var(--hop-koi-500);
893
+ --hop-status-caution-border-hover: var(--hop-koi-400);
894
+ --hop-status-caution-border-disabled: var(--hop-koi-50);
895
+ --hop-status-caution-border: var(--hop-koi-300);
896
+ --hop-information-text-weak: var(--hop-coastal-300);
897
+ --hop-information-text: var(--hop-coastal-800);
898
+ --hop-information-surface-weak: var(--hop-coastal-50);
899
+ --hop-information-surface-strong: var(--hop-coastal-100);
900
+ --hop-information-surface: var(--hop-coastal-25);
901
+ --hop-information-icon-weak: var(--hop-coastal-300);
902
+ --hop-information-icon-weakest: var(--hop-coastal-75);
903
+ --hop-information-icon: var(--hop-coastal-700);
904
+ --hop-information-border: var(--hop-coastal-100);
905
+ --hop-decorative-option1-text-weak: var(--hop-sapphire-300);
906
+ --hop-decorative-option1-text: var(--hop-sapphire-900);
907
+ --hop-decorative-option1-surface-weakest: var(--hop-sapphire-25);
908
+ --hop-decorative-option1-surface-weak-hover: var(--hop-sapphire-75);
909
+ --hop-decorative-option1-surface-weak: var(--hop-sapphire-50);
910
+ --hop-decorative-option1-surface-strong: var(--hop-sapphire-200);
911
+ --hop-decorative-option1-surface-hover: var(--hop-sapphire-200);
912
+ --hop-decorative-option1-surface: var(--hop-sapphire-100);
913
+ --hop-decorative-option1-icon: var(--hop-sapphire-900);
914
+ --hop-decorative-option1-border: var(--hop-sapphire-100);
915
+ --hop-decorative-option2-text-weak: var(--hop-quetzal-300);
916
+ --hop-decorative-option2-text: var(--hop-quetzal-900);
917
+ --hop-decorative-option2-surface-weakest: var(--hop-quetzal-25);
918
+ --hop-decorative-option2-surface-weak-hover: var(--hop-quetzal-75);
919
+ --hop-decorative-option2-surface-weak: var(--hop-quetzal-50);
920
+ --hop-decorative-option2-surface-strong: var(--hop-quetzal-100);
921
+ --hop-decorative-option2-surface-hover: var(--hop-quetzal-100);
922
+ --hop-decorative-option2-surface: var(--hop-quetzal-75);
923
+ --hop-decorative-option2-icon: var(--hop-quetzal-900);
924
+ --hop-decorative-option2-border: var(--hop-quetzal-100);
925
+ --hop-decorative-option3-text-weak: var(--hop-koi-300);
926
+ --hop-decorative-option3-text: var(--hop-koi-900);
927
+ --hop-decorative-option3-surface-weakest: var(--hop-koi-25);
928
+ --hop-decorative-option3-surface-weak-hover: var(--hop-koi-75);
929
+ --hop-decorative-option3-surface-weak: var(--hop-koi-50);
930
+ --hop-decorative-option3-surface-strong: var(--hop-koi-200);
931
+ --hop-decorative-option3-surface-hover: var(--hop-koi-200);
932
+ --hop-decorative-option3-surface: var(--hop-koi-100);
933
+ --hop-decorative-option3-icon: var(--hop-koi-900);
934
+ --hop-decorative-option3-border: var(--hop-koi-100);
935
+ --hop-decorative-option4-text-weak: var(--hop-moss-400);
936
+ --hop-decorative-option4-text: var(--hop-moss-900);
937
+ --hop-decorative-option4-surface-weakest: var(--hop-moss-25);
938
+ --hop-decorative-option4-surface-weak-hover: var(--hop-moss-75);
939
+ --hop-decorative-option4-surface-weak: var(--hop-moss-50);
940
+ --hop-decorative-option4-surface-strong: var(--hop-moss-100);
941
+ --hop-decorative-option4-surface-hover: var(--hop-moss-100);
942
+ --hop-decorative-option4-surface: var(--hop-moss-75);
943
+ --hop-decorative-option4-icon: var(--hop-moss-900);
944
+ --hop-decorative-option4-border: var(--hop-moss-100);
945
+ --hop-decorative-option6-text-weak: var(--hop-sunken-treasure-200);
946
+ --hop-decorative-option6-text: var(--hop-sunken-treasure-900);
947
+ --hop-decorative-option6-surface-weakest: var(--hop-sunken-treasure-25);
948
+ --hop-decorative-option6-surface-weak-hover: var(--hop-sunken-treasure-75);
949
+ --hop-decorative-option6-surface-weak: var(--hop-sunken-treasure-50);
950
+ --hop-decorative-option6-surface-strong: var(--hop-sunken-treasure-100);
951
+ --hop-decorative-option6-surface-hover: var(--hop-sunken-treasure-100);
952
+ --hop-decorative-option6-surface: var(--hop-sunken-treasure-75);
953
+ --hop-decorative-option6-icon: var(--hop-sunken-treasure-900);
954
+ --hop-decorative-option6-border: var(--hop-sunken-treasure-100);
955
+ --hop-decorative-option5-text-weak: var(--hop-coastal-300);
956
+ --hop-decorative-option5-text: var(--hop-coastal-900);
957
+ --hop-decorative-option5-surface-weakest: var(--hop-coastal-25);
958
+ --hop-decorative-option5-surface-weak-hover: var(--hop-coastal-75);
959
+ --hop-decorative-option5-surface-weak: var(--hop-coastal-50);
960
+ --hop-decorative-option5-surface-strong: var(--hop-coastal-100);
961
+ --hop-decorative-option5-surface-hover: var(--hop-coastal-100);
962
+ --hop-decorative-option5-surface: var(--hop-coastal-75);
963
+ --hop-decorative-option5-icon: var(--hop-coastal-900);
964
+ --hop-decorative-option5-border: var(--hop-coastal-100);
965
+ --hop-decorative-option7-text-weak: var(--hop-toad-500);
966
+ --hop-decorative-option7-text: var(--hop-toad-900);
967
+ --hop-decorative-option7-surface-weakest: var(--hop-toad-25);
968
+ --hop-decorative-option7-surface-weak-hover: var(--hop-toad-75);
969
+ --hop-decorative-option7-surface-weak: var(--hop-toad-50);
970
+ --hop-decorative-option7-surface-strong: var(--hop-toad-100);
971
+ --hop-decorative-option7-surface-hover: var(--hop-toad-100);
972
+ --hop-decorative-option7-surface: var(--hop-toad-75);
973
+ --hop-decorative-option7-icon: var(--hop-toad-900);
974
+ --hop-decorative-option7-border: var(--hop-toad-100);
975
+ --hop-decorative-option8-text-weak: var(--hop-amanita-300);
976
+ --hop-decorative-option8-text: var(--hop-amanita-900);
977
+ --hop-decorative-option8-surface-weakest: var(--hop-amanita-25);
978
+ --hop-decorative-option8-surface-weak-hover: var(--hop-amanita-75);
979
+ --hop-decorative-option8-surface-weak: var(--hop-amanita-50);
980
+ --hop-decorative-option8-surface-strong: var(--hop-amanita-100);
981
+ --hop-decorative-option8-surface-hover: var(--hop-amanita-200);
982
+ --hop-decorative-option8-surface: var(--hop-amanita-75);
983
+ --hop-decorative-option8-icon: var(--hop-amanita-900);
984
+ --hop-decorative-option8-border: var(--hop-amanita-100);
985
+ --hop-decorative-option9-text-weak: var(--hop-rock-300);
986
+ --hop-decorative-option9-text: var(--hop-samoyed);
987
+ --hop-decorative-option9-surface-weakest: var(--hop-rock-200);
988
+ --hop-decorative-option9-surface-weak-hover: var(--hop-rock-400);
989
+ --hop-decorative-option9-surface-weak: var(--hop-rock-300);
990
+ --hop-decorative-option9-surface-strong: var(--hop-rock-800);
991
+ --hop-decorative-option9-surface-hover: var(--hop-rock-500);
992
+ --hop-decorative-option9-surface: var(--hop-rock-400);
993
+ --hop-decorative-option9-icon: var(--hop-samoyed);
994
+ --hop-decorative-option9-border: var(--hop-rock-100);
995
+ --hop-upsell-text-weak-press: var(--hop-sunken-treasure-600);
996
+ --hop-upsell-text-weak-hover: var(--hop-sunken-treasure-500);
997
+ --hop-upsell-text-weak: var(--hop-sunken-treasure-300);
998
+ --hop-upsell-text-press: var(--hop-sunken-treasure-900);
999
+ --hop-upsell-text-hover: var(--hop-sunken-treasure-800);
1000
+ --hop-upsell-text-disabled: var(--hop-sunken-treasure-400);
1001
+ --hop-upsell-text-selected: var(--hop-sunken-treasure-400);
1002
+ --hop-upsell-text: var(--hop-sunken-treasure-700);
1003
+ --hop-upsell-surface-weak-press: var(--hop-sunken-treasure-200);
1004
+ --hop-upsell-surface-weak-hover: var(--hop-sunken-treasure-100);
1005
+ --hop-upsell-surface-weak: var(--hop-sunken-treasure-75);
1006
+ --hop-upsell-surface-press: var(--hop-sunken-treasure-75);
1007
+ --hop-upsell-surface-hover: var(--hop-sunken-treasure-50);
1008
+ --hop-upsell-surface-disabled: var(--hop-sunken-treasure-25);
1009
+ --hop-upsell-surface-selected: var(--hop-sunken-treasure-50);
1010
+ --hop-upsell-surface: var(--hop-sunken-treasure-25);
1011
+ --hop-upsell-icon-weak-press: var(--hop-sunken-treasure-600);
1012
+ --hop-upsell-icon-weak-hover: var(--hop-sunken-treasure-500);
1013
+ --hop-upsell-icon-weak: var(--hop-sunken-treasure-300);
1014
+ --hop-upsell-icon-weakest: var(--hop-sunken-treasure-75);
1015
+ --hop-upsell-icon-press: var(--hop-sunken-treasure-900);
1016
+ --hop-upsell-icon-hover: var(--hop-sunken-treasure-800);
1017
+ --hop-upsell-icon-selected: var(--hop-sunken-treasure-400);
1018
+ --hop-upsell-icon: var(--hop-sunken-treasure-700);
1019
+ --hop-upsell-border-press: var(--hop-sunken-treasure-300);
1020
+ --hop-upsell-border-disabled: var(--hop-sunken-treasure-75);
1021
+ --hop-upsell-border-selected: var(--hop-sunken-treasure-400);
1022
+ --hop-upsell-border: var(--hop-sunken-treasure-100);
1023
+ --hop-upsell-text-weak-active: var(--hop-sunken-treasure-600);
1024
+ --hop-upsell-text-active: var(--hop-sunken-treasure-900);
1025
+ --hop-upsell-surface-weak-active: var(--hop-sunken-treasure-75);
1026
+ --hop-upsell-surface-active: var(--hop-sunken-treasure-200);
1027
+ --hop-upsell-icon-weak-active: var(--hop-sunken-treasure-600);
1028
+ --hop-upsell-icon-active: var(--hop-sunken-treasure-900);
1029
+ --hop-upsell-border-active: var(--hop-sunken-treasure-200);
1030
+ --hop-primary-text-strong-hover: var(--hop-samoyed);
1031
+ --hop-primary-text-strong: var(--hop-samoyed);
1032
+ --hop-primary-text-press: var(--hop-sapphire-700);
1033
+ --hop-primary-text-hover: var(--hop-sapphire-600);
1034
+ --hop-primary-text-disabled: var(--hop-sapphire-200);
1035
+ --hop-primary-text-selected: var(--hop-sapphire-500);
1036
+ --hop-primary-text: var(--hop-sapphire-500);
1037
+ --hop-primary-surface-weak-press: var(--hop-sapphire-75);
1038
+ --hop-primary-surface-weak-hover: var(--hop-sapphire-50);
1039
+ --hop-primary-surface-weak: var(--hop-sapphire-25);
1040
+ --hop-primary-surface-strong-press: var(--hop-sapphire-700);
1041
+ --hop-primary-surface-strong-hover: var(--hop-sapphire-600);
1042
+ --hop-primary-surface-strong-selected: var(--hop-sapphire-50);
1043
+ --hop-primary-surface-strong: var(--hop-sapphire-400);
1044
+ --hop-primary-surface-press: var(--hop-sapphire-300);
1045
+ --hop-primary-surface-hover: var(--hop-sapphire-200);
1046
+ --hop-primary-surface-focus: var(--hop-sapphire-25);
1047
+ --hop-primary-surface-disabled: var(--hop-sapphire-200);
1048
+ --hop-primary-surface-selected: var(--hop-sapphire-50);
1049
+ --hop-primary-surface: var(--hop-sapphire-50);
1050
+ --hop-primary-icon-strong-hover: var(--hop-samoyed);
1051
+ --hop-primary-icon-strong: var(--hop-samoyed);
1052
+ --hop-primary-icon-press: var(--hop-sapphire-700);
1053
+ --hop-primary-icon-hover: var(--hop-sapphire-600);
1054
+ --hop-primary-icon-disabled: var(--hop-sapphire-200);
1055
+ --hop-primary-icon-selected: var(--hop-sapphire-500);
1056
+ --hop-primary-icon: var(--hop-sapphire-500);
1057
+ --hop-primary-border-press: var(--hop-sapphire-300);
1058
+ --hop-primary-border-focus: var(--hop-sapphire-500);
1059
+ --hop-primary-border-selected: var(--hop-sapphire-400);
1060
+ --hop-primary-border: var(--hop-sapphire-400);
1061
+ --hop-primary-text-active: var(--hop-sapphire-700);
1062
+ --hop-primary-surface-weak-active: var(--hop-sapphire-75);
1063
+ --hop-primary-surface-strong-active: var(--hop-sapphire-700);
1064
+ --hop-primary-surface-active: var(--hop-sapphire-300);
1065
+ --hop-primary-icon-active: var(--hop-sapphire-700);
1066
+ --hop-primary-border-active: var(--hop-sapphire-300);
1067
+ --hop-neutral-text-weakest: var(--hop-rock-300);
1068
+ --hop-neutral-text-weak-selected: var(--hop-rock-600);
1069
+ --hop-neutral-text-weak-press: var(--hop-rock-700);
1070
+ --hop-neutral-text-weak-hover: var(--hop-rock-600);
1071
+ --hop-neutral-text-weak: var(--hop-rock-500);
1072
+ --hop-neutral-text-strong: var(--hop-samoyed);
1073
+ --hop-neutral-text-press: var(--hop-rock-900);
1074
+ --hop-neutral-text-hover: var(--hop-rock-700);
1075
+ --hop-neutral-text-disabled: var(--hop-rock-300);
1076
+ --hop-neutral-text-selected: var(--hop-samoyed);
1077
+ --hop-neutral-text: var(--hop-rock-800);
1078
+ --hop-neutral-surface-weakest-hover: var(--hop-rock-50);
1079
+ --hop-neutral-surface-weakest-selected: var(--hop-rock-50);
1080
+ --hop-neutral-surface-weakest: var(--hop-rock-25);
1081
+ --hop-neutral-surface-weak-press: var(--hop-rock-100);
1082
+ --hop-neutral-surface-weak-hover: var(--hop-rock-75);
1083
+ --hop-neutral-surface-weak-selected: var(--hop-rock-50);
1084
+ --hop-neutral-surface-weak: var(--hop-rock-50);
1085
+ --hop-neutral-surface-strong: var(--hop-rock-800);
1086
+ --hop-neutral-surface-press: var(--hop-rock-50);
1087
+ --hop-neutral-surface-hover: var(--hop-rock-25);
1088
+ --hop-neutral-surface-disabled: var(--hop-rock-50);
1089
+ --hop-neutral-surface-selected: var(--hop-rock-800);
1090
+ --hop-neutral-surface: var(--hop-samoyed);
1091
+ --hop-neutral-icon-weakest: var(--hop-rock-200);
1092
+ --hop-neutral-icon-weak-selected: var(--hop-rock-600);
1093
+ --hop-neutral-icon-weak-press: var(--hop-rock-700);
1094
+ --hop-neutral-icon-weak-hover: var(--hop-rock-600);
1095
+ --hop-neutral-icon-weak: var(--hop-rock-400);
1096
+ --hop-neutral-icon-strong-hover: var(--hop-samoyed);
1097
+ --hop-neutral-icon-strong: var(--hop-samoyed);
1098
+ --hop-neutral-icon-press: var(--hop-rock-900);
1099
+ --hop-neutral-icon-hover: var(--hop-rock-700);
1100
+ --hop-neutral-icon-disabled: var(--hop-rock-300);
1101
+ --hop-neutral-icon-selected: var(--hop-samoyed);
1102
+ --hop-neutral-icon: var(--hop-rock-800);
1103
+ --hop-neutral-border-weakest: var(--hop-rock-50);
1104
+ --hop-neutral-border-weak: var(--hop-rock-75);
1105
+ --hop-neutral-border-strong-hover: var(--hop-rock-700);
1106
+ --hop-neutral-border-strong: var(--hop-rock-800);
1107
+ --hop-neutral-border-press: var(--hop-rock-400);
1108
+ --hop-neutral-border-hover: var(--hop-rock-300);
1109
+ --hop-neutral-border-disabled: var(--hop-rock-50);
1110
+ --hop-neutral-border-selected: var(--hop-rock-800);
1111
+ --hop-neutral-border: var(--hop-rock-200);
1112
+ --hop-neutral-text-weak-active: var(--hop-rock-700);
1113
+ --hop-neutral-text-active: var(--hop-rock-900);
1114
+ --hop-neutral-surface-weak-active: var(--hop-rock-100);
1115
+ --hop-neutral-surface-active: var(--hop-rock-50);
1116
+ --hop-neutral-icon-weak-active: var(--hop-rock-700);
1117
+ --hop-neutral-icon-active: var(--hop-rock-900);
1118
+ --hop-neutral-border-active: var(--hop-rock-400);
1119
+ --hop-danger-text-weak-press: var(--hop-amanita-600);
1120
+ --hop-danger-text-weak-hover: var(--hop-amanita-500);
1121
+ --hop-danger-text-weak: var(--hop-amanita-400);
1122
+ --hop-danger-text-strong-hover: var(--hop-samoyed);
1123
+ --hop-danger-text-strong: var(--hop-samoyed);
1124
+ --hop-danger-text-press: var(--hop-amanita-800);
1125
+ --hop-danger-text-hover: var(--hop-amanita-500);
1126
+ --hop-danger-text-disabled: var(--hop-amanita-100);
1127
+ --hop-danger-text-selected: var(--hop-amanita-400);
1128
+ --hop-danger-text: var(--hop-amanita-700);
1129
+ --hop-danger-surface-weak-press: var(--hop-amanita-100);
1130
+ --hop-danger-surface-weak-hover: var(--hop-amanita-75);
1131
+ --hop-danger-surface-weak: var(--hop-amanita-50);
1132
+ --hop-danger-surface-strong-hover: var(--hop-amanita-500);
1133
+ --hop-danger-surface-strong: var(--hop-amanita-400);
1134
+ --hop-danger-surface-press: var(--hop-amanita-600);
1135
+ --hop-danger-surface-hover: var(--hop-amanita-500);
1136
+ --hop-danger-surface-disabled: var(--hop-amanita-100);
1137
+ --hop-danger-surface-selected: var(--hop-amanita-50);
1138
+ --hop-danger-surface: var(--hop-amanita-25);
1139
+ --hop-danger-icon-weakest: var(--hop-amanita-75);
1140
+ --hop-danger-icon-weak-press: var(--hop-amanita-600);
1141
+ --hop-danger-icon-weak-hover: var(--hop-amanita-500);
1142
+ --hop-danger-icon-weak: var(--hop-amanita-400);
1143
+ --hop-danger-icon-strong-hover: var(--hop-samoyed);
1144
+ --hop-danger-icon-strong: var(--hop-samoyed);
1145
+ --hop-danger-icon-press: var(--hop-amanita-800);
1146
+ --hop-danger-icon-hover: var(--hop-amanita-500);
1147
+ --hop-danger-icon-disabled: var(--hop-amanita-100);
1148
+ --hop-danger-icon-selected: var(--hop-amanita-400);
1149
+ --hop-danger-icon: var(--hop-amanita-700);
1150
+ --hop-danger-border-press: var(--hop-amanita-300);
1151
+ --hop-danger-border-strong: var(--hop-amanita-300);
1152
+ --hop-danger-border-selected: var(--hop-amanita-400);
1153
+ --hop-danger-border: var(--hop-amanita-100);
1154
+ --hop-danger-text-weak-active: var(--hop-amanita-600);
1155
+ --hop-danger-text-active: var(--hop-amanita-800);
1156
+ --hop-danger-surface-weak-active: var(--hop-amanita-100);
1157
+ --hop-danger-surface-active: var(--hop-amanita-600);
1158
+ --hop-danger-icon-weak-active: var(--hop-amanita-600);
1159
+ --hop-danger-icon-active: var(--hop-amanita-800);
1160
+ --hop-danger-border-active: var(--hop-amanita-600);
1161
+ --hop-space-inset-stretch-lg: var(--hop-space-480) var(--hop-space-240);
1162
+ --hop-space-inset-stretch-md: var(--hop-space-240) var(--hop-space-160);
1163
+ --hop-space-inset-stretch-sm: var(--hop-space-160) var(--hop-space-80);
1164
+ --hop-space-inset-squish-lg: var(--hop-space-160) var(--hop-space-320);
1165
+ --hop-space-inset-squish-md: var(--hop-space-80) var(--hop-space-160);
1166
+ --hop-space-inset-squish-sm: var(--hop-space-40) var(--hop-space-80);
1167
+ --hop-space-inset-xl: var(--hop-space-320);
1168
+ --hop-space-inset-lg: var(--hop-space-240);
1169
+ --hop-space-inset-md: var(--hop-space-160);
1170
+ --hop-space-inset-sm: var(--hop-space-80);
1171
+ --hop-space-inset-xs: var(--hop-space-40);
1172
+ --hop-space-inline-xl: var(--hop-space-320);
1173
+ --hop-space-inline-lg: var(--hop-space-240);
1174
+ --hop-space-inline-md: var(--hop-space-160);
1175
+ --hop-space-inline-sm: var(--hop-space-80);
1176
+ --hop-space-inline-xs: var(--hop-space-40);
1177
+ --hop-space-stack-xl: var(--hop-space-320);
1178
+ --hop-space-stack-lg: var(--hop-space-240);
1179
+ --hop-space-stack-md: var(--hop-space-160);
1180
+ --hop-space-stack-sm: var(--hop-space-80);
1181
+ --hop-space-stack-xs: var(--hop-space-40);
1182
+ }