@stackoverflow/stacks 1.10.3 → 2.0.0-rc.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (90) hide show
  1. package/README.md +15 -0
  2. package/dist/css/stacks.css +7428 -4429
  3. package/dist/css/stacks.min.css +1 -1
  4. package/dist/js/stacks.js +110 -265
  5. package/dist/js/stacks.min.js +1 -1
  6. package/lib/atomic/__snapshots__/color-new.less.test.ts.snap +3015 -0
  7. package/lib/atomic/__snapshots__/color.less.test.ts.snap +2886 -0
  8. package/lib/atomic/border.less +0 -258
  9. package/lib/atomic/color.less +26 -200
  10. package/lib/atomic/color.less.test.ts +12 -0
  11. package/lib/atomic/misc.less +7 -6
  12. package/lib/atomic/typography.less +0 -7
  13. package/lib/atomic/v1/__snapshots__/border.less.test.ts.snap +552 -0
  14. package/lib/atomic/v1/__snapshots__/color.less.test.ts.snap +6756 -0
  15. package/lib/atomic/v1/__snapshots__/typography.less.test.ts.snap +22 -0
  16. package/lib/atomic/v1/border.less +210 -0
  17. package/lib/atomic/v1/border.less.test.ts +14 -0
  18. package/lib/atomic/v1/color.less +183 -0
  19. package/lib/atomic/v1/color.less.test.ts +14 -0
  20. package/lib/atomic/v1/typography.less +8 -0
  21. package/lib/atomic/v1/typography.less.test.ts +14 -0
  22. package/lib/components/activity-indicator/activity-indicator.a11y.test.ts +1 -10
  23. package/lib/components/activity-indicator/activity-indicator.less +4 -4
  24. package/lib/components/anchor/anchor.a11y.test.ts +0 -12
  25. package/lib/components/anchor/anchor.less +4 -4
  26. package/lib/components/anchor/anchor.visual.test.ts +1 -1
  27. package/lib/components/avatar/avatar.less +2 -2
  28. package/lib/components/award-bling/award-bling.less +3 -3
  29. package/lib/components/badge/badge.a11y.test.ts +2 -51
  30. package/lib/components/badge/badge.less +40 -40
  31. package/lib/components/banner/banner.a11y.test.ts +0 -14
  32. package/lib/components/block-link/block-link.a11y.test.ts +0 -14
  33. package/lib/components/block-link/block-link.less +8 -8
  34. package/lib/components/breadcrumbs/breadcrumbs.a11y.test.ts +0 -2
  35. package/lib/components/breadcrumbs/breadcrumbs.less +1 -1
  36. package/lib/components/button/button.a11y.test.ts +0 -134
  37. package/lib/components/button/button.less +40 -40
  38. package/lib/components/button/button.visual.test.ts +1 -1
  39. package/lib/components/card/card.a11y.test.ts +0 -6
  40. package/lib/components/check-control/check-control.a11y.test.ts +0 -13
  41. package/lib/components/check-control/check-control.visual.test.ts +1 -1
  42. package/lib/components/checkbox_radio/checkbox_radio.less +5 -5
  43. package/lib/components/checkbox_radio/checkbox_radio.visual.test.ts +1 -1
  44. package/lib/components/code-block/code-block.less +3 -3
  45. package/lib/components/description/description.a11y.test.ts +0 -5
  46. package/lib/components/description/description.visual.test.ts +1 -1
  47. package/lib/components/input-fill/input-fill.less +2 -2
  48. package/lib/components/input-icon/input-icon.less +2 -2
  49. package/lib/components/input-message/input-message.less +8 -8
  50. package/lib/components/input_textarea/input_textarea.less +6 -6
  51. package/lib/components/label/label.less +11 -11
  52. package/lib/components/link/link.a11y.test.ts +0 -21
  53. package/lib/components/link/link.less +8 -8
  54. package/lib/components/link-preview/link-preview.less +9 -9
  55. package/lib/components/menu/menu.less +3 -3
  56. package/lib/components/modal/modal.less +5 -4
  57. package/lib/components/navigation/navigation.less +11 -11
  58. package/lib/components/notice/notice.less +48 -48
  59. package/lib/components/pagination/pagination.less +3 -3
  60. package/lib/components/popover/popover.less +2 -2
  61. package/lib/components/popover/tooltip.test.ts +1 -1
  62. package/lib/components/post-summary/post-summary.less +40 -40
  63. package/lib/components/progress-bar/progress-bar.less +15 -15
  64. package/lib/components/prose/prose.less +15 -15
  65. package/lib/components/select/select.less +5 -5
  66. package/lib/components/sidebar-widget/sidebar-widget.less +12 -12
  67. package/lib/components/table/table.less +7 -7
  68. package/lib/components/tag/tag.less +25 -25
  69. package/lib/components/toggle-switch/toggle-switch.a11y.test.ts +0 -7
  70. package/lib/components/toggle-switch/toggle-switch.less +4 -4
  71. package/lib/components/topbar/topbar.less +34 -34
  72. package/lib/components/uploader/uploader.less +15 -15
  73. package/lib/components/user-card/user-card.less +7 -7
  74. package/lib/exports/__snapshots__/color-mixins.less.test.ts.snap +539 -0
  75. package/lib/exports/__snapshots__/color.less.test.ts.snap +762 -0
  76. package/lib/exports/color-mixins.less +280 -0
  77. package/lib/exports/color-mixins.less.test.ts +150 -0
  78. package/lib/exports/color-sets.less +620 -0
  79. package/lib/exports/color.less +57 -0
  80. package/lib/exports/color.less.test.ts +12 -0
  81. package/lib/exports/exports.less +2 -1
  82. package/lib/exports/mixins.less +17 -5
  83. package/lib/exports/theme.less +85 -0
  84. package/lib/exports/v1/__snapshots__/constants-colors.less.test.ts.snap +902 -0
  85. package/lib/exports/v1/constants-colors.less +893 -0
  86. package/lib/exports/v1/constants-colors.less.test.ts +12 -0
  87. package/lib/stacks-static.less +5 -0
  88. package/lib/test/less-test-utils.ts +28 -0
  89. package/package.json +13 -7
  90. package/lib/exports/constants-colors.less +0 -1100
package/lib/exports/v1/__snapshots__/constants-colors.less.test.ts.snap ADDED
@@ -0,0 +1,902 @@
1
+ // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
2
+
3
+ exports[`constants-colors > should output all the css generated by the v1 colors/theming generation mixins 1`] = `
4
+ ":root {
5
+ --theme-base-primary-color-legacy-h: 27;
6
+ --theme-base-primary-color-legacy-s: 90%;
7
+ --theme-base-primary-color-legacy-l: 55%;
8
+ --theme-base-primary-color-legacy-r: 243.525;
9
+ --theme-base-primary-color-legacy-g: 129.9225;
10
+ --theme-base-primary-color-legacy-b: 36.975;
11
+ --theme-base-secondary-color-legacy-h: 206;
12
+ --theme-base-secondary-color-legacy-s: 100%;
13
+ --theme-base-secondary-color-legacy-l: 40%;
14
+ --theme-base-secondary-color-legacy-r: 0;
15
+ --theme-base-secondary-color-legacy-g: 115.6;
16
+ --theme-base-secondary-color-legacy-b: 204;
17
+ }
18
+
19
+ body:not(.theme-dark),
20
+ body.theme-dark .theme-light__forced,
21
+ body.theme-system .theme-light__forced {
22
+ --white-legacy: hsl(0, 0%, 100%);
23
+ --black-legacy: hsl(210, 8%, 5%);
24
+ --orange-legacy: hsl(27, 90%, 55%);
25
+ --yellow-legacy: hsl(47, 83%, 91%);
26
+ --green-legacy: hsl(140, 40%, 55%);
27
+ --blue-legacy: hsl(206, 100%, 40%);
28
+ --powder-legacy: hsl(205, 46%, 92%);
29
+ --red-legacy: hsl(358, 62%, 52%);
30
+ --black-legacy-025: hsl(210, 8%, 97.5%);
31
+ --black-legacy-050: hsl(210, 8%, 95%);
32
+ --black-legacy-075: hsl(210, 8%, 90%);
33
+ --black-legacy-100: hsl(210, 8%, 85%);
34
+ --black-legacy-150: hsl(210, 8%, 80%);
35
+ --black-legacy-200: hsl(210, 8%, 75%);
36
+ --black-legacy-300: hsl(210, 8%, 65%);
37
+ --black-legacy-350: hsl(210, 8%, 60%);
38
+ --black-legacy-400: hsl(210, 8%, 55%);
39
+ --black-legacy-500: hsl(210, 8%, 45%);
40
+ --black-legacy-600: hsl(210, 8%, 35%);
41
+ --black-legacy-700: hsl(210, 8%, 25%);
42
+ --black-legacy-750: hsl(210, 8%, 20%);
43
+ --black-legacy-800: hsl(210, 8%, 15%);
44
+ --black-legacy-900: hsl(210, 8%, 5%);
45
+ --orange-legacy-050: hsl(27, 100%, 97%);
46
+ --orange-legacy-100: hsl(27, 95%, 90%);
47
+ --orange-legacy-200: hsl(27, 90%, 83%);
48
+ --orange-legacy-300: hsl(27, 90%, 70%);
49
+ --orange-legacy-400: hsl(27, 90%, 55%);
50
+ --orange-legacy-500: hsl(27, 90%, 50%);
51
+ --orange-legacy-600: hsl(27, 90%, 45%);
52
+ --orange-legacy-700: hsl(27, 90%, 39%);
53
+ --orange-legacy-800: hsl(27, 87%, 35%);
54
+ --orange-legacy-900: hsl(27, 80%, 30%);
55
+ --blue-legacy-050: hsl(206, 100%, 97%);
56
+ --blue-legacy-100: hsl(206, 96%, 90%);
57
+ --blue-legacy-200: hsl(206, 93%, 83.5%);
58
+ --blue-legacy-300: hsl(206, 90%, 69.5%);
59
+ --blue-legacy-400: hsl(206, 85%, 57.5%);
60
+ --blue-legacy-500: hsl(206, 100%, 52%);
61
+ --blue-legacy-600: hsl(206, 100%, 40%);
62
+ --blue-legacy-700: hsl(209, 100%, 37.5%);
63
+ --blue-legacy-800: hsl(209, 100%, 32%);
64
+ --blue-legacy-900: hsl(209, 100%, 26%);
65
+ --powder-legacy-050: hsl(205, 47%, 97%);
66
+ --powder-legacy-100: hsl(205, 46%, 92%);
67
+ --powder-legacy-200: hsl(205, 53%, 88%);
68
+ --powder-legacy-300: hsl(205, 57%, 81%);
69
+ --powder-legacy-400: hsl(205, 56%, 76%);
70
+ --powder-legacy-500: hsl(205, 41%, 63%);
71
+ --powder-legacy-600: hsl(205, 36%, 53%);
72
+ --powder-legacy-700: hsl(205, 47%, 42%);
73
+ --powder-legacy-800: hsl(205, 46%, 32%);
74
+ --powder-legacy-900: hsl(205, 46%, 22%);
75
+ --green-legacy-025: hsl(140, 42%, 95%);
76
+ --green-legacy-050: hsl(140, 40%, 90%);
77
+ --green-legacy-100: hsl(140, 40%, 85%);
78
+ --green-legacy-200: hsl(140, 40%, 75%);
79
+ --green-legacy-300: hsl(140, 40%, 65%);
80
+ --green-legacy-400: hsl(140, 40%, 55%);
81
+ --green-legacy-500: hsl(140, 40%, 47%);
82
+ --green-legacy-600: hsl(140, 40%, 40%);
83
+ --green-legacy-700: hsl(140, 41%, 31%);
84
+ --green-legacy-800: hsl(140, 40%, 27%);
85
+ --green-legacy-900: hsl(140, 40%, 20%);
86
+ --yellow-legacy-050: hsl(47, 87%, 94%);
87
+ --yellow-legacy-100: hsl(47, 83%, 91%);
88
+ --yellow-legacy-200: hsl(47, 65%, 84%);
89
+ --yellow-legacy-300: hsl(47, 69%, 69%);
90
+ --yellow-legacy-400: hsl(47, 79%, 58%);
91
+ --yellow-legacy-500: hsl(47, 73%, 50%);
92
+ --yellow-legacy-600: hsl(47, 76%, 46%);
93
+ --yellow-legacy-700: hsl(47, 79%, 40%);
94
+ --yellow-legacy-800: hsl(47, 82%, 34%);
95
+ --yellow-legacy-900: hsl(47, 84%, 28%);
96
+ --red-legacy-025: hsl(358, 80%, 98%);
97
+ --red-legacy-050: hsl(358, 75%, 97%);
98
+ --red-legacy-100: hsl(358, 76%, 90%);
99
+ --red-legacy-200: hsl(358, 74%, 83%);
100
+ --red-legacy-300: hsl(358, 70%, 70%);
101
+ --red-legacy-400: hsl(358, 68%, 59%);
102
+ --red-legacy-500: hsl(358, 62%, 52%);
103
+ --red-legacy-600: hsl(358, 62%, 47%);
104
+ --red-legacy-700: hsl(358, 64%, 41%);
105
+ --red-legacy-800: hsl(358, 64%, 35%);
106
+ --red-legacy-900: hsl(358, 67%, 29%);
107
+ --gold-legacy: hsl(48, 100%, 50%);
108
+ --gold-legacy-lighter: hsl(48, 100%, 91%);
109
+ --gold-legacy-darker: hsl(45, 100%, 47%);
110
+ --silver-legacy: hsl(210, 6%, 72%);
111
+ --silver-legacy-lighter: hsl(0, 0%, 91%);
112
+ --silver-legacy-darker: hsl(210, 3%, 61%);
113
+ --bronze-legacy: hsl(28, 38%, 67%);
114
+ --bronze-legacy-lighter: hsl(28, 40%, 92%);
115
+ --bronze-legacy-darker: hsl(28, 31%, 52%);
116
+ --bc-lightest-legacy: var(--black-legacy-025);
117
+ --bc-lighter-legacy: var(--black-legacy-050);
118
+ --bc-light-legacy: var(--black-legacy-075);
119
+ --bc-medium-legacy: var(--black-legacy-100);
120
+ --bc-dark-legacy: var(--black-legacy-150);
121
+ --bc-darker-legacy: var(--black-legacy-200);
122
+ --fc-dark-legacy: hsl(210, 8%, 5%);
123
+ --fc-medium-legacy: hsl(210, 8%, 25%);
124
+ --fc-light-legacy: hsl(210, 8%, 45%);
125
+ --focus-ring-success-legacy: hsla(140, 40%, 75%, 0.4);
126
+ --focus-ring-warning-legacy: hsla(47, 79%, 58%, 0.4);
127
+ --focus-ring-error-legacy: hsla(358, 62%, 47%, 0.15);
128
+ --focus-ring-muted-legacy: hsla(210, 8%, 15%, 0.1);
129
+ }
130
+
131
+ body:not(.theme-dark),
132
+ body.theme-dark .theme-light__forced,
133
+ body.theme-system .theme-light__forced,
134
+ body:not(.theme-dark) .themed,
135
+ body.theme-dark .theme-light__forced .themed,
136
+ body.theme-system .theme-light__forced .themed {
137
+ color: var(--theme-body-font-color);
138
+ --theme-primary-color-legacy-h: var(--theme-light-primary-color-legacy-h, var(--theme-base-primary-color-legacy-h));
139
+ --theme-primary-color-legacy-s: var(--theme-light-primary-color-legacy-s, var(--theme-base-primary-color-legacy-s));
140
+ --theme-primary-color-legacy-l: var(--theme-light-primary-color-legacy-l, var(--theme-base-primary-color-legacy-l));
141
+ --theme-primary-color-legacy-r: var(--theme-light-primary-color-legacy-r, var(--theme-base-primary-color-legacy-r));
142
+ --theme-primary-color-legacy-g: var(--theme-light-primary-color-legacy-g, var(--theme-base-primary-color-legacy-g));
143
+ --theme-primary-color-legacy-b: var(--theme-light-primary-color-legacy-b, var(--theme-base-primary-color-legacy-b));
144
+ --theme-secondary-color-legacy-h: var(--theme-light-secondary-color-legacy-h, var(--theme-base-secondary-color-legacy-h));
145
+ --theme-secondary-color-legacy-s: var(--theme-light-secondary-color-legacy-s, var(--theme-base-secondary-color-legacy-s));
146
+ --theme-secondary-color-legacy-l: var(--theme-light-secondary-color-legacy-l, var(--theme-base-secondary-color-legacy-l));
147
+ --theme-secondary-color-legacy-r: var(--theme-light-secondary-color-legacy-r, var(--theme-base-secondary-color-legacy-r));
148
+ --theme-secondary-color-legacy-g: var(--theme-light-secondary-color-legacy-g, var(--theme-base-secondary-color-legacy-g));
149
+ --theme-secondary-color-legacy-b: var(--theme-light-secondary-color-legacy-b, var(--theme-base-secondary-color-legacy-b));
150
+ --theme-primary-color-legacy: hsl(var(--theme-primary-color-legacy-h), var(--theme-primary-color-legacy-s), var(--theme-primary-color-legacy-l));
151
+ --theme-primary-legacy-900: hsl(var(--theme-primary-color-legacy-h), var(--theme-primary-color-legacy-s), calc(var(--theme-primary-color-legacy-l) - 26%));
152
+ --theme-primary-legacy-800: hsl(var(--theme-primary-color-legacy-h), var(--theme-primary-color-legacy-s), calc(var(--theme-primary-color-legacy-l) - 21%));
153
+ --theme-primary-legacy-700: hsl(var(--theme-primary-color-legacy-h), var(--theme-primary-color-legacy-s), calc(var(--theme-primary-color-legacy-l) - 16%));
154
+ --theme-primary-legacy-600: hsl(var(--theme-primary-color-legacy-h), var(--theme-primary-color-legacy-s), calc(var(--theme-primary-color-legacy-l) - 10%));
155
+ --theme-primary-legacy-500: hsl(var(--theme-primary-color-legacy-h), var(--theme-primary-color-legacy-s), calc(var(--theme-primary-color-legacy-l) - 5%));
156
+ --theme-primary-legacy-400: var(--theme-primary-color-legacy);
157
+ --theme-primary-legacy-350: rgb(calc(51 + var(--theme-primary-color-legacy-r) * 0.8), calc(51 + var(--theme-primary-color-legacy-g) * 0.8), calc(51 + var(--theme-primary-color-legacy-b) * 0.8));
158
+ --theme-primary-legacy-300: rgb(calc(89.25 + var(--theme-primary-color-legacy-r) * 0.65), calc(89.25 + var(--theme-primary-color-legacy-g) * 0.65), calc(89.25 + var(--theme-primary-color-legacy-b) * 0.65));
159
+ --theme-primary-legacy-200: rgb(calc(122.4 + var(--theme-primary-color-legacy-r) * 0.52), calc(122.4 + var(--theme-primary-color-legacy-g) * 0.52), calc(122.4 + var(--theme-primary-color-legacy-b) * 0.52));
160
+ --theme-primary-legacy-150: rgb(calc(165.75 + var(--theme-primary-color-legacy-r) * 0.35), calc(165.75 + var(--theme-primary-color-legacy-g) * 0.35), calc(165.75 + var(--theme-primary-color-legacy-b) * 0.35));
161
+ --theme-primary-legacy-100: rgb(calc(198.9 + var(--theme-primary-color-legacy-r) * 0.22), calc(198.9 + var(--theme-primary-color-legacy-g) * 0.22), calc(198.9 + var(--theme-primary-color-legacy-b) * 0.22));
162
+ --theme-primary-legacy-075: rgb(calc(216.75 + var(--theme-primary-color-legacy-r) * 0.15), calc(216.75 + var(--theme-primary-color-legacy-g) * 0.15), calc(216.75 + var(--theme-primary-color-legacy-b) * 0.15));
163
+ --theme-primary-legacy-050: rgb(calc(234.6 + var(--theme-primary-color-legacy-r) * 0.08), calc(234.6 + var(--theme-primary-color-legacy-g) * 0.08), calc(234.6 + var(--theme-primary-color-legacy-b) * 0.08));
164
+ --theme-primary-legacy-025: rgb(calc(244.8 + var(--theme-primary-color-legacy-r) * 0.04), calc(244.8 + var(--theme-primary-color-legacy-g) * 0.04), calc(244.8 + var(--theme-primary-color-legacy-b) * 0.04));
165
+ --theme-secondary-color-legacy: hsl(var(--theme-secondary-color-legacy-h), var(--theme-secondary-color-legacy-s), var(--theme-secondary-color-legacy-l));
166
+ --theme-secondary-legacy-900: hsl(var(--theme-secondary-color-legacy-h), var(--theme-secondary-color-legacy-s), calc(var(--theme-secondary-color-legacy-l) - 26%));
167
+ --theme-secondary-legacy-800: hsl(var(--theme-secondary-color-legacy-h), var(--theme-secondary-color-legacy-s), calc(var(--theme-secondary-color-legacy-l) - 21%));
168
+ --theme-secondary-legacy-700: hsl(var(--theme-secondary-color-legacy-h), var(--theme-secondary-color-legacy-s), calc(var(--theme-secondary-color-legacy-l) - 16%));
169
+ --theme-secondary-legacy-600: hsl(var(--theme-secondary-color-legacy-h), var(--theme-secondary-color-legacy-s), calc(var(--theme-secondary-color-legacy-l) - 10%));
170
+ --theme-secondary-legacy-500: hsl(var(--theme-secondary-color-legacy-h), var(--theme-secondary-color-legacy-s), calc(var(--theme-secondary-color-legacy-l) - 5%));
171
+ --theme-secondary-legacy-400: var(--theme-secondary-color-legacy);
172
+ --theme-secondary-legacy-350: rgb(calc(51 + var(--theme-secondary-color-legacy-r) * 0.8), calc(51 + var(--theme-secondary-color-legacy-g) * 0.8), calc(51 + var(--theme-secondary-color-legacy-b) * 0.8));
173
+ --theme-secondary-legacy-300: rgb(calc(89.25 + var(--theme-secondary-color-legacy-r) * 0.65), calc(89.25 + var(--theme-secondary-color-legacy-g) * 0.65), calc(89.25 + var(--theme-secondary-color-legacy-b) * 0.65));
174
+ --theme-secondary-legacy-200: rgb(calc(122.4 + var(--theme-secondary-color-legacy-r) * 0.52), calc(122.4 + var(--theme-secondary-color-legacy-g) * 0.52), calc(122.4 + var(--theme-secondary-color-legacy-b) * 0.52));
175
+ --theme-secondary-legacy-150: rgb(calc(165.75 + var(--theme-secondary-color-legacy-r) * 0.35), calc(165.75 + var(--theme-secondary-color-legacy-g) * 0.35), calc(165.75 + var(--theme-secondary-color-legacy-b) * 0.35));
176
+ --theme-secondary-legacy-100: rgb(calc(198.9 + var(--theme-secondary-color-legacy-r) * 0.22), calc(198.9 + var(--theme-secondary-color-legacy-g) * 0.22), calc(198.9 + var(--theme-secondary-color-legacy-b) * 0.22));
177
+ --theme-secondary-legacy-075: rgb(calc(216.75 + var(--theme-secondary-color-legacy-r) * 0.15), calc(216.75 + var(--theme-secondary-color-legacy-g) * 0.15), calc(216.75 + var(--theme-secondary-color-legacy-b) * 0.15));
178
+ --theme-secondary-legacy-050: rgb(calc(234.6 + var(--theme-secondary-color-legacy-r) * 0.08), calc(234.6 + var(--theme-secondary-color-legacy-g) * 0.08), calc(234.6 + var(--theme-secondary-color-legacy-b) * 0.08));
179
+ --theme-secondary-legacy-025: rgb(calc(244.8 + var(--theme-secondary-color-legacy-r) * 0.04), calc(244.8 + var(--theme-secondary-color-legacy-g) * 0.04), calc(244.8 + var(--theme-secondary-color-legacy-b) * 0.04));
180
+ --focus-ring-legacy: hsla(var(--theme-secondary-color-legacy-h), var(--theme-secondary-color-legacy-s), var(--theme-secondary-color-legacy-l), 0.15);
181
+ }
182
+
183
+ body.theme-dark,
184
+ body:not(.theme-dark) .theme-dark__forced {
185
+ --white-legacy: hsl(0, 0%, 17.5%);
186
+ --black-legacy: hsl(0, 0%, 100%);
187
+ --black-legacy-025: hsl(0, 0%, 22.5%);
188
+ --black-legacy-050: hsl(0, 0%, 24%);
189
+ --black-legacy-075: hsl(210, 4%, 26%);
190
+ --black-legacy-100: hsl(210, 4.5%, 30.5%);
191
+ --black-legacy-150: hsl(210, 5%, 35%);
192
+ --black-legacy-200: hsl(210, 5.5%, 43.5%);
193
+ --black-legacy-300: hsl(210, 6.5%, 52%);
194
+ --black-legacy-350: hsl(210, 7%, 61%);
195
+ --black-legacy-400: hsl(210, 8%, 65%);
196
+ --black-legacy-500: hsl(210, 8%, 70%);
197
+ --black-legacy-600: hsl(210, 7%, 78.5%);
198
+ --black-legacy-700: hsl(210, 8%, 82.5%);
199
+ --black-legacy-750: hsl(210, 9%, 86.5%);
200
+ --black-legacy-800: hsl(210, 9%, 91.5%);
201
+ --black-legacy-900: hsl(210, 4%, 95%);
202
+ --orange-legacy-050: hsl(27, 16.5%, 23.9%);
203
+ --orange-legacy-100: hsl(27, 30%, 28.4%);
204
+ --orange-legacy-200: hsl(27, 50%, 36.9%);
205
+ --orange-legacy-300: hsl(27, 70%, 47.3%);
206
+ --orange-legacy-400: hsl(27, 90.5%, 54.9%);
207
+ --orange-legacy-500: hsl(27, 100%, 59%);
208
+ --orange-legacy-600: hsl(27, 100%, 68.4%);
209
+ --orange-legacy-700: hsl(27, 89.5%, 74.1%);
210
+ --orange-legacy-800: hsl(27, 92%, 85.7%);
211
+ --orange-legacy-900: hsl(27, 95%, 91.8%);
212
+ --blue-legacy-050: hsl(206, 40%, 23%);
213
+ --blue-legacy-100: hsl(206, 44%, 26%);
214
+ --blue-legacy-200: hsl(206, 46%, 30%);
215
+ --blue-legacy-300: hsl(206, 53%, 35%);
216
+ --blue-legacy-400: hsl(209, 56%, 43%);
217
+ --blue-legacy-500: hsl(206, 64%, 51%);
218
+ --blue-legacy-600: hsl(206, 100%, 60%);
219
+ --blue-legacy-700: hsl(206, 90%, 74%);
220
+ --blue-legacy-800: hsl(206, 95%, 86%);
221
+ --blue-legacy-900: hsl(206, 91%, 91.5%);
222
+ --powder-legacy-050: hsl(205, 5%, 27%);
223
+ --powder-legacy-100: hsl(205, 14%, 28%);
224
+ --powder-legacy-200: hsl(205, 17.5%, 32%);
225
+ --powder-legacy-300: hsl(205, 19.5%, 37%);
226
+ --powder-legacy-400: hsl(205, 22.5%, 44%);
227
+ --powder-legacy-500: hsl(205, 29%, 54%);
228
+ --powder-legacy-600: hsl(205, 50%, 65.5%);
229
+ --powder-legacy-700: hsl(205, 46.5%, 73.5%);
230
+ --powder-legacy-800: hsl(205, 49.5%, 87%);
231
+ --powder-legacy-900: hsl(205, 100%, 95%);
232
+ --green-legacy-025: hsl(140, 18%, 22%);
233
+ --green-legacy-050: hsl(140, 18%, 25%);
234
+ --green-legacy-100: hsl(140, 22.5%, 31%);
235
+ --green-legacy-200: hsl(140, 23.5%, 37%);
236
+ --green-legacy-300: hsl(140, 25%, 40.5%);
237
+ --green-legacy-400: hsl(140, 27.5%, 48.5%);
238
+ --green-legacy-500: hsl(140, 35%, 54.5%);
239
+ --green-legacy-600: hsl(140, 40%, 61.5%);
240
+ --green-legacy-700: hsl(140, 39.5%, 69.5%);
241
+ --green-legacy-800: hsl(140, 39.5%, 78.5%);
242
+ --green-legacy-900: hsl(140, 38%, 86.5%);
243
+ --yellow-legacy-050: hsl(47, 13%, 24.5%);
244
+ --yellow-legacy-100: hsl(47, 19%, 27%);
245
+ --yellow-legacy-200: hsl(47, 30.5%, 31%);
246
+ --yellow-legacy-300: hsl(47, 37%, 36%);
247
+ --yellow-legacy-400: hsl(47, 45.5%, 42.5%);
248
+ --yellow-legacy-500: hsl(47, 55.5%, 48%);
249
+ --yellow-legacy-600: hsl(47, 67.5%, 55.5%);
250
+ --yellow-legacy-700: hsl(47, 84.5%, 64%);
251
+ --yellow-legacy-800: hsl(47, 90%, 72.5%);
252
+ --yellow-legacy-900: hsl(47, 93%, 83.5%);
253
+ --red-legacy-025: hsl(1, 10%, 24%);
254
+ --red-legacy-050: hsl(1, 30%, 26.5%);
255
+ --red-legacy-100: hsl(1, 35%, 33%);
256
+ --red-legacy-200: hsl(1, 37%, 38.5%);
257
+ --red-legacy-300: hsl(1, 39%, 43.5%);
258
+ --red-legacy-400: hsl(1, 42%, 49%);
259
+ --red-legacy-500: hsl(1, 50%, 54%);
260
+ --red-legacy-600: hsl(1, 56.5%, 59.5%);
261
+ --red-legacy-700: hsl(1, 62.5%, 65.5%);
262
+ --red-legacy-800: hsl(1, 64%, 74%);
263
+ --red-legacy-900: hsl(1, 65.5%, 85.5%);
264
+ --gold-legacy: hsl(48, 100%, 50%);
265
+ --gold-legacy-lighter: hsl(48, 22%, 30%);
266
+ --gold-legacy-darker: hsl(45, 100%, 47%);
267
+ --silver-legacy: hsl(210, 6%, 72%);
268
+ --silver-legacy-lighter: hsl(0, 0%, 26%);
269
+ --silver-legacy-darker: hsl(210, 3%, 61%);
270
+ --bronze-legacy: hsl(28, 38%, 67%);
271
+ --bronze-legacy-lighter: hsl(28, 13%, 27%);
272
+ --bronze-legacy-darker: hsl(28, 31%, 52%);
273
+ --bc-lightest-legacy: var(--black-legacy-025);
274
+ --bc-lighter-legacy: var(--black-legacy-050);
275
+ --bc-light-legacy: var(--black-legacy-075);
276
+ --bc-medium-legacy: var(--black-legacy-100);
277
+ --bc-dark-legacy: var(--black-legacy-150);
278
+ --bc-darker-legacy: var(--black-legacy-200);
279
+ --fc-dark-legacy: var(--black-legacy-900);
280
+ --fc-medium-legacy: var(--black-legacy-700);
281
+ --fc-light-legacy: var(--black-legacy-500);
282
+ --focus-ring-success-legacy: hsla(140, 40%, 75%, 0.4);
283
+ --focus-ring-warning-legacy: hsla(47, 79%, 58%, 0.4);
284
+ --focus-ring-error-legacy: hsla(358, 62%, 52%, 0.3);
285
+ --focus-ring-muted-legacy: hsla(0, 0%, 100%, 0.1);
286
+ }
287
+
288
+ body.theme-dark,
289
+ body:not(.theme-dark) .theme-dark__forced,
290
+ body.theme-dark .themed,
291
+ body:not(.theme-dark) .theme-dark__forced .themed {
292
+ color: var(--theme-body-font-color);
293
+ --theme-primary-color-legacy-h: var(--theme-dark-primary-color-legacy-h, var(--theme-base-primary-color-legacy-h));
294
+ --theme-primary-color-legacy-s: var(--theme-dark-primary-color-legacy-s, var(--theme-base-primary-color-legacy-s));
295
+ --theme-primary-color-legacy-l: var(--theme-dark-primary-color-legacy-l, var(--theme-base-primary-color-legacy-l));
296
+ --theme-primary-color-legacy-r: var(--theme-dark-primary-color-legacy-r, var(--theme-base-primary-color-legacy-r));
297
+ --theme-primary-color-legacy-g: var(--theme-dark-primary-color-legacy-g, var(--theme-base-primary-color-legacy-g));
298
+ --theme-primary-color-legacy-b: var(--theme-dark-primary-color-legacy-b, var(--theme-base-primary-color-legacy-b));
299
+ --theme-secondary-color-legacy-h: var(--theme-dark-secondary-color-legacy-h, var(--theme-base-secondary-color-legacy-h));
300
+ --theme-secondary-color-legacy-s: var(--theme-dark-secondary-color-legacy-s, var(--theme-base-secondary-color-legacy-s));
301
+ --theme-secondary-color-legacy-l: var(--theme-dark-secondary-color-legacy-l, var(--theme-base-secondary-color-legacy-l));
302
+ --theme-secondary-color-legacy-r: var(--theme-dark-secondary-color-legacy-r, var(--theme-base-secondary-color-legacy-r));
303
+ --theme-secondary-color-legacy-g: var(--theme-dark-secondary-color-legacy-g, var(--theme-base-secondary-color-legacy-g));
304
+ --theme-secondary-color-legacy-b: var(--theme-dark-secondary-color-legacy-b, var(--theme-base-secondary-color-legacy-b));
305
+ --theme-primary-color-legacy: hsl(var(--theme-primary-color-legacy-h), var(--theme-primary-color-legacy-s), var(--theme-primary-color-legacy-l));
306
+ --theme-secondary-color-legacy: hsl(var(--theme-secondary-color-legacy-h), var(--theme-secondary-color-legacy-s), var(--theme-secondary-color-legacy-l));
307
+ --theme-primary-legacy-025: hsl(var(--theme-primary-color-legacy-h), clamp(10%, calc(var(--theme-primary-color-legacy-s) - 73.3%), 90%), clamp(20%, calc(var(--theme-primary-color-legacy-l) - 31%), 100%));
308
+ --theme-primary-legacy-050: hsl(var(--theme-primary-color-legacy-h), clamp(10%, calc(var(--theme-primary-color-legacy-s) - 47%), 90%), clamp(20%, calc(var(--theme-primary-color-legacy-l) - 15%), 100%));
309
+ --theme-primary-legacy-075: hsl(var(--theme-primary-color-legacy-h), clamp(10%, calc(var(--theme-primary-color-legacy-s) - 39%), 90%), clamp(20%, calc(var(--theme-primary-color-legacy-l) - 13%), 100%));
310
+ --theme-primary-legacy-100: hsl(var(--theme-primary-color-legacy-h), clamp(10%, calc(var(--theme-primary-color-legacy-s) - 32%), 90%), clamp(20%, calc(var(--theme-primary-color-legacy-l) - 11%), 100%));
311
+ --theme-primary-legacy-150: hsl(var(--theme-primary-color-legacy-h), clamp(10%, calc(var(--theme-primary-color-legacy-s) - 23%), 90%), clamp(20%, calc(var(--theme-primary-color-legacy-l) - 9%), 100%));
312
+ --theme-primary-legacy-200: hsl(var(--theme-primary-color-legacy-h), clamp(10%, calc(var(--theme-primary-color-legacy-s) - 15%), 90%), clamp(20%, calc(var(--theme-primary-color-legacy-l) - 7%), 100%));
313
+ --theme-primary-legacy-300: hsl(var(--theme-primary-color-legacy-h), clamp(10%, calc(var(--theme-primary-color-legacy-s) - 7%), 90%), clamp(20%, calc(var(--theme-primary-color-legacy-l) - 5%), 100%));
314
+ --theme-primary-legacy-350: var(--theme-primary-color-legacy);
315
+ --theme-primary-legacy-400: rgb(calc(53.55 + var(--theme-primary-color-legacy-r) * 0.79), calc(53.55 + var(--theme-primary-color-legacy-g) * 0.79), calc(53.55 + var(--theme-primary-color-legacy-b) * 0.79));
316
+ --theme-primary-legacy-500: rgb(calc(91.8 + var(--theme-primary-color-legacy-r) * 0.64), calc(91.8 + var(--theme-primary-color-legacy-g) * 0.64), calc(91.8 + var(--theme-primary-color-legacy-b) * 0.64));
317
+ --theme-primary-legacy-600: rgb(calc(130.05 + var(--theme-primary-color-legacy-r) * 0.49), calc(130.05 + var(--theme-primary-color-legacy-g) * 0.49), calc(130.05 + var(--theme-primary-color-legacy-b) * 0.49));
318
+ --theme-primary-legacy-700: rgb(calc(168.3 + var(--theme-primary-color-legacy-r) * 0.34), calc(168.3 + var(--theme-primary-color-legacy-g) * 0.34), calc(168.3 + var(--theme-primary-color-legacy-b) * 0.34));
319
+ --theme-primary-legacy-800: rgb(calc(206.55 + var(--theme-primary-color-legacy-r) * 0.19), calc(206.55 + var(--theme-primary-color-legacy-g) * 0.19), calc(206.55 + var(--theme-primary-color-legacy-b) * 0.19));
320
+ --theme-primary-legacy-900: rgb(calc(244.8 + var(--theme-primary-color-legacy-r) * 0.04), calc(244.8 + var(--theme-primary-color-legacy-g) * 0.04), calc(244.8 + var(--theme-primary-color-legacy-b) * 0.04));
321
+ --theme-secondary-legacy-025: hsl(var(--theme-secondary-color-legacy-h), clamp(10%, calc(var(--theme-secondary-color-legacy-s) - 73.3%), 90%), clamp(20%, calc(var(--theme-secondary-color-legacy-l) - 31%), 100%));
322
+ --theme-secondary-legacy-050: hsl(var(--theme-secondary-color-legacy-h), clamp(10%, calc(var(--theme-secondary-color-legacy-s) - 47%), 90%), clamp(20%, calc(var(--theme-secondary-color-legacy-l) - 15%), 100%));
323
+ --theme-secondary-legacy-075: hsl(var(--theme-secondary-color-legacy-h), clamp(10%, calc(var(--theme-secondary-color-legacy-s) - 39%), 90%), clamp(20%, calc(var(--theme-secondary-color-legacy-l) - 13%), 100%));
324
+ --theme-secondary-legacy-100: hsl(var(--theme-secondary-color-legacy-h), clamp(10%, calc(var(--theme-secondary-color-legacy-s) - 32%), 90%), clamp(20%, calc(var(--theme-secondary-color-legacy-l) - 11%), 100%));
325
+ --theme-secondary-legacy-150: hsl(var(--theme-secondary-color-legacy-h), clamp(10%, calc(var(--theme-secondary-color-legacy-s) - 23%), 90%), clamp(20%, calc(var(--theme-secondary-color-legacy-l) - 9%), 100%));
326
+ --theme-secondary-legacy-200: hsl(var(--theme-secondary-color-legacy-h), clamp(10%, calc(var(--theme-secondary-color-legacy-s) - 15%), 90%), clamp(20%, calc(var(--theme-secondary-color-legacy-l) - 7%), 100%));
327
+ --theme-secondary-legacy-300: hsl(var(--theme-secondary-color-legacy-h), clamp(10%, calc(var(--theme-secondary-color-legacy-s) - 7%), 90%), clamp(20%, calc(var(--theme-secondary-color-legacy-l) - 5%), 100%));
328
+ --theme-secondary-legacy-350: var(--theme-secondary-color-legacy);
329
+ --theme-secondary-legacy-400: rgb(calc(53.55 + var(--theme-secondary-color-legacy-r) * 0.79), calc(53.55 + var(--theme-secondary-color-legacy-g) * 0.79), calc(53.55 + var(--theme-secondary-color-legacy-b) * 0.79));
330
+ --theme-secondary-legacy-500: rgb(calc(91.8 + var(--theme-secondary-color-legacy-r) * 0.64), calc(91.8 + var(--theme-secondary-color-legacy-g) * 0.64), calc(91.8 + var(--theme-secondary-color-legacy-b) * 0.64));
331
+ --theme-secondary-legacy-600: rgb(calc(130.05 + var(--theme-secondary-color-legacy-r) * 0.49), calc(130.05 + var(--theme-secondary-color-legacy-g) * 0.49), calc(130.05 + var(--theme-secondary-color-legacy-b) * 0.49));
332
+ --theme-secondary-legacy-700: rgb(calc(168.3 + var(--theme-secondary-color-legacy-r) * 0.34), calc(168.3 + var(--theme-secondary-color-legacy-g) * 0.34), calc(168.3 + var(--theme-secondary-color-legacy-b) * 0.34));
333
+ --theme-secondary-legacy-800: rgb(calc(206.55 + var(--theme-secondary-color-legacy-r) * 0.19), calc(206.55 + var(--theme-secondary-color-legacy-g) * 0.19), calc(206.55 + var(--theme-secondary-color-legacy-b) * 0.19));
334
+ --theme-secondary-legacy-900: rgb(calc(244.8 + var(--theme-secondary-color-legacy-r) * 0.04), calc(244.8 + var(--theme-secondary-color-legacy-g) * 0.04), calc(244.8 + var(--theme-secondary-color-legacy-b) * 0.04));
335
+ --focus-ring-legacy: hsla(var(--theme-secondary-color-legacy-h), var(--theme-secondary-color-legacy-s), var(--theme-secondary-color-legacy-l), 0.25);
336
+ }
337
+
338
+ @media (prefers-color-scheme: dark) {
339
+ body.theme-system {
340
+ --white-legacy: hsl(0, 0%, 17.5%);
341
+ --black-legacy: hsl(0, 0%, 100%);
342
+ --black-legacy-025: hsl(0, 0%, 22.5%);
343
+ --black-legacy-050: hsl(0, 0%, 24%);
344
+ --black-legacy-075: hsl(210, 4%, 26%);
345
+ --black-legacy-100: hsl(210, 4.5%, 30.5%);
346
+ --black-legacy-150: hsl(210, 5%, 35%);
347
+ --black-legacy-200: hsl(210, 5.5%, 43.5%);
348
+ --black-legacy-300: hsl(210, 6.5%, 52%);
349
+ --black-legacy-350: hsl(210, 7%, 61%);
350
+ --black-legacy-400: hsl(210, 8%, 65%);
351
+ --black-legacy-500: hsl(210, 8%, 70%);
352
+ --black-legacy-600: hsl(210, 7%, 78.5%);
353
+ --black-legacy-700: hsl(210, 8%, 82.5%);
354
+ --black-legacy-750: hsl(210, 9%, 86.5%);
355
+ --black-legacy-800: hsl(210, 9%, 91.5%);
356
+ --black-legacy-900: hsl(210, 4%, 95%);
357
+ --orange-legacy-050: hsl(27, 16.5%, 23.9%);
358
+ --orange-legacy-100: hsl(27, 30%, 28.4%);
359
+ --orange-legacy-200: hsl(27, 50%, 36.9%);
360
+ --orange-legacy-300: hsl(27, 70%, 47.3%);
361
+ --orange-legacy-400: hsl(27, 90.5%, 54.9%);
362
+ --orange-legacy-500: hsl(27, 100%, 59%);
363
+ --orange-legacy-600: hsl(27, 100%, 68.4%);
364
+ --orange-legacy-700: hsl(27, 89.5%, 74.1%);
365
+ --orange-legacy-800: hsl(27, 92%, 85.7%);
366
+ --orange-legacy-900: hsl(27, 95%, 91.8%);
367
+ --blue-legacy-050: hsl(206, 40%, 23%);
368
+ --blue-legacy-100: hsl(206, 44%, 26%);
369
+ --blue-legacy-200: hsl(206, 46%, 30%);
370
+ --blue-legacy-300: hsl(206, 53%, 35%);
371
+ --blue-legacy-400: hsl(209, 56%, 43%);
372
+ --blue-legacy-500: hsl(206, 64%, 51%);
373
+ --blue-legacy-600: hsl(206, 100%, 60%);
374
+ --blue-legacy-700: hsl(206, 90%, 74%);
375
+ --blue-legacy-800: hsl(206, 95%, 86%);
376
+ --blue-legacy-900: hsl(206, 91%, 91.5%);
377
+ --powder-legacy-050: hsl(205, 5%, 27%);
378
+ --powder-legacy-100: hsl(205, 14%, 28%);
379
+ --powder-legacy-200: hsl(205, 17.5%, 32%);
380
+ --powder-legacy-300: hsl(205, 19.5%, 37%);
381
+ --powder-legacy-400: hsl(205, 22.5%, 44%);
382
+ --powder-legacy-500: hsl(205, 29%, 54%);
383
+ --powder-legacy-600: hsl(205, 50%, 65.5%);
384
+ --powder-legacy-700: hsl(205, 46.5%, 73.5%);
385
+ --powder-legacy-800: hsl(205, 49.5%, 87%);
386
+ --powder-legacy-900: hsl(205, 100%, 95%);
387
+ --green-legacy-025: hsl(140, 18%, 22%);
388
+ --green-legacy-050: hsl(140, 18%, 25%);
389
+ --green-legacy-100: hsl(140, 22.5%, 31%);
390
+ --green-legacy-200: hsl(140, 23.5%, 37%);
391
+ --green-legacy-300: hsl(140, 25%, 40.5%);
392
+ --green-legacy-400: hsl(140, 27.5%, 48.5%);
393
+ --green-legacy-500: hsl(140, 35%, 54.5%);
394
+ --green-legacy-600: hsl(140, 40%, 61.5%);
395
+ --green-legacy-700: hsl(140, 39.5%, 69.5%);
396
+ --green-legacy-800: hsl(140, 39.5%, 78.5%);
397
+ --green-legacy-900: hsl(140, 38%, 86.5%);
398
+ --yellow-legacy-050: hsl(47, 13%, 24.5%);
399
+ --yellow-legacy-100: hsl(47, 19%, 27%);
400
+ --yellow-legacy-200: hsl(47, 30.5%, 31%);
401
+ --yellow-legacy-300: hsl(47, 37%, 36%);
402
+ --yellow-legacy-400: hsl(47, 45.5%, 42.5%);
403
+ --yellow-legacy-500: hsl(47, 55.5%, 48%);
404
+ --yellow-legacy-600: hsl(47, 67.5%, 55.5%);
405
+ --yellow-legacy-700: hsl(47, 84.5%, 64%);
406
+ --yellow-legacy-800: hsl(47, 90%, 72.5%);
407
+ --yellow-legacy-900: hsl(47, 93%, 83.5%);
408
+ --red-legacy-025: hsl(1, 10%, 24%);
409
+ --red-legacy-050: hsl(1, 30%, 26.5%);
410
+ --red-legacy-100: hsl(1, 35%, 33%);
411
+ --red-legacy-200: hsl(1, 37%, 38.5%);
412
+ --red-legacy-300: hsl(1, 39%, 43.5%);
413
+ --red-legacy-400: hsl(1, 42%, 49%);
414
+ --red-legacy-500: hsl(1, 50%, 54%);
415
+ --red-legacy-600: hsl(1, 56.5%, 59.5%);
416
+ --red-legacy-700: hsl(1, 62.5%, 65.5%);
417
+ --red-legacy-800: hsl(1, 64%, 74%);
418
+ --red-legacy-900: hsl(1, 65.5%, 85.5%);
419
+ --gold-legacy: hsl(48, 100%, 50%);
420
+ --gold-legacy-lighter: hsl(48, 22%, 30%);
421
+ --gold-legacy-darker: hsl(45, 100%, 47%);
422
+ --silver-legacy: hsl(210, 6%, 72%);
423
+ --silver-legacy-lighter: hsl(0, 0%, 26%);
424
+ --silver-legacy-darker: hsl(210, 3%, 61%);
425
+ --bronze-legacy: hsl(28, 38%, 67%);
426
+ --bronze-legacy-lighter: hsl(28, 13%, 27%);
427
+ --bronze-legacy-darker: hsl(28, 31%, 52%);
428
+ --bc-lightest-legacy: var(--black-legacy-025);
429
+ --bc-lighter-legacy: var(--black-legacy-050);
430
+ --bc-light-legacy: var(--black-legacy-075);
431
+ --bc-medium-legacy: var(--black-legacy-100);
432
+ --bc-dark-legacy: var(--black-legacy-150);
433
+ --bc-darker-legacy: var(--black-legacy-200);
434
+ --fc-dark-legacy: var(--black-legacy-900);
435
+ --fc-medium-legacy: var(--black-legacy-700);
436
+ --fc-light-legacy: var(--black-legacy-500);
437
+ --focus-ring-success-legacy: hsla(140, 40%, 75%, 0.4);
438
+ --focus-ring-warning-legacy: hsla(47, 79%, 58%, 0.4);
439
+ --focus-ring-error-legacy: hsla(358, 62%, 52%, 0.3);
440
+ --focus-ring-muted-legacy: hsla(0, 0%, 100%, 0.1);
441
+ }
442
+
443
+ body.theme-system,
444
+ body.theme-system .themed {
445
+ color: var(--theme-body-font-color);
446
+ --theme-primary-color-legacy-h: var(--theme-dark-primary-color-legacy-h, var(--theme-base-primary-color-legacy-h));
447
+ --theme-primary-color-legacy-s: var(--theme-dark-primary-color-legacy-s, var(--theme-base-primary-color-legacy-s));
448
+ --theme-primary-color-legacy-l: var(--theme-dark-primary-color-legacy-l, var(--theme-base-primary-color-legacy-l));
449
+ --theme-primary-color-legacy-r: var(--theme-dark-primary-color-legacy-r, var(--theme-base-primary-color-legacy-r));
450
+ --theme-primary-color-legacy-g: var(--theme-dark-primary-color-legacy-g, var(--theme-base-primary-color-legacy-g));
451
+ --theme-primary-color-legacy-b: var(--theme-dark-primary-color-legacy-b, var(--theme-base-primary-color-legacy-b));
452
+ --theme-secondary-color-legacy-h: var(--theme-dark-secondary-color-legacy-h, var(--theme-base-secondary-color-legacy-h));
453
+ --theme-secondary-color-legacy-s: var(--theme-dark-secondary-color-legacy-s, var(--theme-base-secondary-color-legacy-s));
454
+ --theme-secondary-color-legacy-l: var(--theme-dark-secondary-color-legacy-l, var(--theme-base-secondary-color-legacy-l));
455
+ --theme-secondary-color-legacy-r: var(--theme-dark-secondary-color-legacy-r, var(--theme-base-secondary-color-legacy-r));
456
+ --theme-secondary-color-legacy-g: var(--theme-dark-secondary-color-legacy-g, var(--theme-base-secondary-color-legacy-g));
457
+ --theme-secondary-color-legacy-b: var(--theme-dark-secondary-color-legacy-b, var(--theme-base-secondary-color-legacy-b));
458
+ --theme-primary-color-legacy: hsl(var(--theme-primary-color-legacy-h), var(--theme-primary-color-legacy-s), var(--theme-primary-color-legacy-l));
459
+ --theme-secondary-color-legacy: hsl(var(--theme-secondary-color-legacy-h), var(--theme-secondary-color-legacy-s), var(--theme-secondary-color-legacy-l));
460
+ --theme-primary-legacy-025: hsl(var(--theme-primary-color-legacy-h), clamp(10%, calc(var(--theme-primary-color-legacy-s) - 73.3%), 90%), clamp(20%, calc(var(--theme-primary-color-legacy-l) - 31%), 100%));
461
+ --theme-primary-legacy-050: hsl(var(--theme-primary-color-legacy-h), clamp(10%, calc(var(--theme-primary-color-legacy-s) - 47%), 90%), clamp(20%, calc(var(--theme-primary-color-legacy-l) - 15%), 100%));
462
+ --theme-primary-legacy-075: hsl(var(--theme-primary-color-legacy-h), clamp(10%, calc(var(--theme-primary-color-legacy-s) - 39%), 90%), clamp(20%, calc(var(--theme-primary-color-legacy-l) - 13%), 100%));
463
+ --theme-primary-legacy-100: hsl(var(--theme-primary-color-legacy-h), clamp(10%, calc(var(--theme-primary-color-legacy-s) - 32%), 90%), clamp(20%, calc(var(--theme-primary-color-legacy-l) - 11%), 100%));
464
+ --theme-primary-legacy-150: hsl(var(--theme-primary-color-legacy-h), clamp(10%, calc(var(--theme-primary-color-legacy-s) - 23%), 90%), clamp(20%, calc(var(--theme-primary-color-legacy-l) - 9%), 100%));
465
+ --theme-primary-legacy-200: hsl(var(--theme-primary-color-legacy-h), clamp(10%, calc(var(--theme-primary-color-legacy-s) - 15%), 90%), clamp(20%, calc(var(--theme-primary-color-legacy-l) - 7%), 100%));
466
+ --theme-primary-legacy-300: hsl(var(--theme-primary-color-legacy-h), clamp(10%, calc(var(--theme-primary-color-legacy-s) - 7%), 90%), clamp(20%, calc(var(--theme-primary-color-legacy-l) - 5%), 100%));
467
+ --theme-primary-legacy-350: var(--theme-primary-color-legacy);
468
+ --theme-primary-legacy-400: rgb(calc(53.55 + var(--theme-primary-color-legacy-r) * 0.79), calc(53.55 + var(--theme-primary-color-legacy-g) * 0.79), calc(53.55 + var(--theme-primary-color-legacy-b) * 0.79));
469
+ --theme-primary-legacy-500: rgb(calc(91.8 + var(--theme-primary-color-legacy-r) * 0.64), calc(91.8 + var(--theme-primary-color-legacy-g) * 0.64), calc(91.8 + var(--theme-primary-color-legacy-b) * 0.64));
470
+ --theme-primary-legacy-600: rgb(calc(130.05 + var(--theme-primary-color-legacy-r) * 0.49), calc(130.05 + var(--theme-primary-color-legacy-g) * 0.49), calc(130.05 + var(--theme-primary-color-legacy-b) * 0.49));
471
+ --theme-primary-legacy-700: rgb(calc(168.3 + var(--theme-primary-color-legacy-r) * 0.34), calc(168.3 + var(--theme-primary-color-legacy-g) * 0.34), calc(168.3 + var(--theme-primary-color-legacy-b) * 0.34));
472
+ --theme-primary-legacy-800: rgb(calc(206.55 + var(--theme-primary-color-legacy-r) * 0.19), calc(206.55 + var(--theme-primary-color-legacy-g) * 0.19), calc(206.55 + var(--theme-primary-color-legacy-b) * 0.19));
473
+ --theme-primary-legacy-900: rgb(calc(244.8 + var(--theme-primary-color-legacy-r) * 0.04), calc(244.8 + var(--theme-primary-color-legacy-g) * 0.04), calc(244.8 + var(--theme-primary-color-legacy-b) * 0.04));
474
+ --theme-secondary-legacy-025: hsl(var(--theme-secondary-color-legacy-h), clamp(10%, calc(var(--theme-secondary-color-legacy-s) - 73.3%), 90%), clamp(20%, calc(var(--theme-secondary-color-legacy-l) - 31%), 100%));
475
+ --theme-secondary-legacy-050: hsl(var(--theme-secondary-color-legacy-h), clamp(10%, calc(var(--theme-secondary-color-legacy-s) - 47%), 90%), clamp(20%, calc(var(--theme-secondary-color-legacy-l) - 15%), 100%));
476
+ --theme-secondary-legacy-075: hsl(var(--theme-secondary-color-legacy-h), clamp(10%, calc(var(--theme-secondary-color-legacy-s) - 39%), 90%), clamp(20%, calc(var(--theme-secondary-color-legacy-l) - 13%), 100%));
477
+ --theme-secondary-legacy-100: hsl(var(--theme-secondary-color-legacy-h), clamp(10%, calc(var(--theme-secondary-color-legacy-s) - 32%), 90%), clamp(20%, calc(var(--theme-secondary-color-legacy-l) - 11%), 100%));
478
+ --theme-secondary-legacy-150: hsl(var(--theme-secondary-color-legacy-h), clamp(10%, calc(var(--theme-secondary-color-legacy-s) - 23%), 90%), clamp(20%, calc(var(--theme-secondary-color-legacy-l) - 9%), 100%));
479
+ --theme-secondary-legacy-200: hsl(var(--theme-secondary-color-legacy-h), clamp(10%, calc(var(--theme-secondary-color-legacy-s) - 15%), 90%), clamp(20%, calc(var(--theme-secondary-color-legacy-l) - 7%), 100%));
480
+ --theme-secondary-legacy-300: hsl(var(--theme-secondary-color-legacy-h), clamp(10%, calc(var(--theme-secondary-color-legacy-s) - 7%), 90%), clamp(20%, calc(var(--theme-secondary-color-legacy-l) - 5%), 100%));
481
+ --theme-secondary-legacy-350: var(--theme-secondary-color-legacy);
482
+ --theme-secondary-legacy-400: rgb(calc(53.55 + var(--theme-secondary-color-legacy-r) * 0.79), calc(53.55 + var(--theme-secondary-color-legacy-g) * 0.79), calc(53.55 + var(--theme-secondary-color-legacy-b) * 0.79));
483
+ --theme-secondary-legacy-500: rgb(calc(91.8 + var(--theme-secondary-color-legacy-r) * 0.64), calc(91.8 + var(--theme-secondary-color-legacy-g) * 0.64), calc(91.8 + var(--theme-secondary-color-legacy-b) * 0.64));
484
+ --theme-secondary-legacy-600: rgb(calc(130.05 + var(--theme-secondary-color-legacy-r) * 0.49), calc(130.05 + var(--theme-secondary-color-legacy-g) * 0.49), calc(130.05 + var(--theme-secondary-color-legacy-b) * 0.49));
485
+ --theme-secondary-legacy-700: rgb(calc(168.3 + var(--theme-secondary-color-legacy-r) * 0.34), calc(168.3 + var(--theme-secondary-color-legacy-g) * 0.34), calc(168.3 + var(--theme-secondary-color-legacy-b) * 0.34));
486
+ --theme-secondary-legacy-800: rgb(calc(206.55 + var(--theme-secondary-color-legacy-r) * 0.19), calc(206.55 + var(--theme-secondary-color-legacy-g) * 0.19), calc(206.55 + var(--theme-secondary-color-legacy-b) * 0.19));
487
+ --theme-secondary-legacy-900: rgb(calc(244.8 + var(--theme-secondary-color-legacy-r) * 0.04), calc(244.8 + var(--theme-secondary-color-legacy-g) * 0.04), calc(244.8 + var(--theme-secondary-color-legacy-b) * 0.04));
488
+ --focus-ring-legacy: hsla(var(--theme-secondary-color-legacy-h), var(--theme-secondary-color-legacy-s), var(--theme-secondary-color-legacy-l), 0.25);
489
+ }
490
+ }
491
+
492
+ body.theme-highcontrast:not(.theme-dark),
493
+ body.theme-dark.theme-highcontrast .theme-light__forced,
494
+ body.theme-system.theme-highcontrast .theme-light__forced {
495
+ --white-legacy: hsl(0, 0%, 100%);
496
+ --black-legacy: hsl(0, 0%, 0%);
497
+ --black-legacy-025: hsl(210, 8%, 97.5%);
498
+ --black-legacy-050: hsl(210, 8%, 95%);
499
+ --black-legacy-075: hsl(210, 8%, 92.5%);
500
+ --black-legacy-100: hsl(210, 8%, 90%);
501
+ --black-legacy-150: hsl(210, 8%, 87.5%);
502
+ --black-legacy-200: hsl(210, 8%, 85%);
503
+ --black-legacy-300: hsl(210, 8%, 35%);
504
+ --black-legacy-350: hsl(210, 8%, 32.5%);
505
+ --black-legacy-400: hsl(210, 8%, 30%);
506
+ --black-legacy-500: hsl(210, 8%, 25%);
507
+ --black-legacy-600: hsl(210, 8%, 20%);
508
+ --black-legacy-700: hsl(210, 8%, 15%);
509
+ --black-legacy-750: hsl(210, 8%, 10%);
510
+ --black-legacy-800: hsl(210, 8%, 5%);
511
+ --black-legacy-900: hsl(0, 0%, 0%);
512
+ --orange-legacy-050: hsl(27, 100%, 93%);
513
+ --orange-legacy-100: hsl(27, 100%, 90%);
514
+ --orange-legacy-200: hsl(27, 100%, 86%);
515
+ --orange-legacy-300: hsl(27, 100%, 81%);
516
+ --orange-legacy-400: hsl(27, 100%, 34%);
517
+ --orange-legacy-500: hsl(27, 100%, 29%);
518
+ --orange-legacy-600: hsl(27, 100%, 24%);
519
+ --orange-legacy-700: hsl(27, 100%, 19%);
520
+ --orange-legacy-800: hsl(27, 100%, 13%);
521
+ --orange-legacy-900: hsl(27, 100%, 8%);
522
+ --blue-legacy-050: hsl(206, 100%, 94%);
523
+ --blue-legacy-100: hsl(206, 100%, 92%);
524
+ --blue-legacy-200: hsl(206, 100%, 89%);
525
+ --blue-legacy-300: hsl(206, 100%, 86%);
526
+ --blue-legacy-400: hsl(206, 100%, 25%);
527
+ --blue-legacy-500: hsl(206, 100%, 20%);
528
+ --blue-legacy-600: hsl(206, 100%, 15%);
529
+ --blue-legacy-700: hsl(206, 100%, 10%);
530
+ --blue-legacy-800: hsl(206, 100%, 7.5%);
531
+ --blue-legacy-900: hsl(206, 100%, 5%);
532
+ --powder-legacy-050: hsl(205, 100%, 95%);
533
+ --powder-legacy-100: hsl(205, 85%, 93%);
534
+ --powder-legacy-200: hsl(205, 75%, 89%);
535
+ --powder-legacy-300: hsl(205, 70%, 86%);
536
+ --powder-legacy-400: hsl(205, 55%, 28%);
537
+ --powder-legacy-500: hsl(205, 60%, 24%);
538
+ --powder-legacy-600: hsl(205, 70%, 20%);
539
+ --powder-legacy-700: hsl(205, 75%, 16%);
540
+ --powder-legacy-800: hsl(205, 75%, 12%);
541
+ --powder-legacy-900: hsl(205, 75%, 8%);
542
+ --green-legacy-025: hsl(140, 100%, 94%);
543
+ --green-legacy-050: hsl(140, 100%, 91%);
544
+ --green-legacy-100: hsl(140, 100%, 87%);
545
+ --green-legacy-200: hsl(140, 100%, 83%);
546
+ --green-legacy-300: hsl(140, 100%, 78%);
547
+ --green-legacy-400: hsl(140, 100%, 18%);
548
+ --green-legacy-500: hsl(140, 100%, 15%);
549
+ --green-legacy-600: hsl(140, 100%, 12%);
550
+ --green-legacy-700: hsl(140, 100%, 9%);
551
+ --green-legacy-800: hsl(140, 100%, 6%);
552
+ --green-legacy-900: hsl(140, 100%, 3%);
553
+ --yellow-legacy-050: hsl(47, 100%, 92%);
554
+ --yellow-legacy-100: hsl(47, 100%, 88%);
555
+ --yellow-legacy-200: hsl(47, 95%, 83%);
556
+ --yellow-legacy-300: hsl(47, 95%, 75%);
557
+ --yellow-legacy-400: hsl(47, 100%, 28%);
558
+ --yellow-legacy-500: hsl(47, 100%, 26%);
559
+ --yellow-legacy-600: hsl(47, 100%, 23%);
560
+ --yellow-legacy-700: hsl(47, 100%, 19%);
561
+ --yellow-legacy-800: hsl(47, 100%, 13%);
562
+ --yellow-legacy-900: hsl(47, 100%, 7%);
563
+ --red-legacy-025: hsl(358, 100%, 97%);
564
+ --red-legacy-050: hsl(358, 100%, 94%);
565
+ --red-legacy-100: hsl(358, 100%, 92%);
566
+ --red-legacy-200: hsl(358, 100%, 89%);
567
+ --red-legacy-300: hsl(358, 100%, 86%);
568
+ --red-legacy-400: hsl(358, 100%, 35%);
569
+ --red-legacy-500: hsl(358, 100%, 29%);
570
+ --red-legacy-600: hsl(358, 100%, 23%);
571
+ --red-legacy-700: hsl(358, 100%, 17%);
572
+ --red-legacy-800: hsl(358, 100%, 11%);
573
+ --red-legacy-900: hsl(358, 100%, 7%);
574
+ --gold-legacy: hsl(48, 100%, 50%);
575
+ --gold-legacy-lighter: hsl(48, 100%, 91%);
576
+ --gold-legacy-darker: hsl(45, 100%, 20%);
577
+ --silver-legacy: hsl(210, 6%, 72%);
578
+ --silver-legacy-lighter: hsl(210, 6%, 91%);
579
+ --silver-legacy-darker: hsl(210, 6%, 30%);
580
+ --bronze-legacy: hsl(28, 38%, 65%);
581
+ --bronze-legacy-lighter: hsl(28, 40%, 92%);
582
+ --bronze-legacy-darker: hsl(28, 31%, 25%);
583
+ --bc-lightest-legacy: var(--black-legacy-400);
584
+ --bc-lighter-legacy: var(--black-legacy-400);
585
+ --bc-light-legacy: var(--black-legacy-400);
586
+ --bc-medium-legacy: var(--black-legacy-400);
587
+ --bc-dark-legacy: var(--black-legacy-700);
588
+ --bc-darker-legacy: var(--black-legacy-900);
589
+ --fc-dark-legacy: var(--black-legacy-900);
590
+ --fc-medium-legacy: var(--black-legacy-700);
591
+ --fc-light-legacy: var(--black-legacy-500);
592
+ --focus-ring-legacy: hsla(206, 100%, 40%, 0.9);
593
+ --focus-ring-success-legacy: hsla(140, 40%, 40%, 0.9);
594
+ --focus-ring-warning-legacy: hsla(47, 76%, 46%, 0.9);
595
+ --focus-ring-error-legacy: hsla(358, 62%, 47%, 0.9);
596
+ --focus-ring-muted-legacy: hsla(210, 8%, 55%, 0.95);
597
+ --theme-primary-color-legacy: var(--orange-legacy-400);
598
+ --theme-primary-legacy-025: var(--orange-legacy-050);
599
+ --theme-primary-legacy-050: var(--orange-legacy-050);
600
+ --theme-primary-legacy-075: var(--orange-legacy-050);
601
+ --theme-primary-legacy-100: var(--orange-legacy-100);
602
+ --theme-primary-legacy-150: var(--orange-legacy-100);
603
+ --theme-primary-legacy-200: var(--orange-legacy-200);
604
+ --theme-primary-legacy-300: var(--orange-legacy-300);
605
+ --theme-primary-legacy-350: var(--orange-legacy-300);
606
+ --theme-primary-legacy-400: var(--orange-legacy-400);
607
+ --theme-primary-legacy-500: var(--orange-legacy-500);
608
+ --theme-primary-legacy-600: var(--orange-legacy-600);
609
+ --theme-primary-legacy-700: var(--orange-legacy-700);
610
+ --theme-primary-legacy-800: var(--orange-legacy-800);
611
+ --theme-primary-legacy-900: var(--orange-legacy-900);
612
+ --theme-secondary-color-legacy: var(--blue-legacy-400);
613
+ --theme-secondary-legacy-025: var(--blue-legacy-050);
614
+ --theme-secondary-legacy-050: var(--blue-legacy-050);
615
+ --theme-secondary-legacy-075: var(--blue-legacy-050);
616
+ --theme-secondary-legacy-100: var(--blue-legacy-100);
617
+ --theme-secondary-legacy-150: var(--blue-legacy-100);
618
+ --theme-secondary-legacy-200: var(--blue-legacy-200);
619
+ --theme-secondary-legacy-300: var(--blue-legacy-300);
620
+ --theme-secondary-legacy-350: var(--blue-legacy-300);
621
+ --theme-secondary-legacy-400: var(--blue-legacy-400);
622
+ --theme-secondary-legacy-500: var(--blue-legacy-500);
623
+ --theme-secondary-legacy-600: var(--blue-legacy-600);
624
+ --theme-secondary-legacy-700: var(--blue-legacy-700);
625
+ --theme-secondary-legacy-800: var(--blue-legacy-800);
626
+ --theme-secondary-legacy-900: var(--blue-legacy-900);
627
+ }
628
+
629
+ body.theme-dark.theme-highcontrast,
630
+ body.theme-highcontrast:not(.theme-dark) .theme-dark__forced {
631
+ --white-legacy: hsl(0, 0%, 0%);
632
+ --black-legacy: hsl(0, 0%, 100%);
633
+ --black-legacy-025: hsl(210, 8%, 2.5%);
634
+ --black-legacy-050: hsl(210, 8%, 5%);
635
+ --black-legacy-075: hsl(210, 8%, 7.5%);
636
+ --black-legacy-100: hsl(210, 8%, 10%);
637
+ --black-legacy-150: hsl(210, 8%, 12.5%);
638
+ --black-legacy-200: hsl(210, 8%, 15%);
639
+ --black-legacy-300: hsl(210, 8%, 65%);
640
+ --black-legacy-350: hsl(210, 8%, 67.5%);
641
+ --black-legacy-400: hsl(210, 8%, 70%);
642
+ --black-legacy-500: hsl(210, 8%, 75%);
643
+ --black-legacy-600: hsl(210, 8%, 80%);
644
+ --black-legacy-700: hsl(210, 8%, 85%);
645
+ --black-legacy-750: hsl(210, 8%, 90%);
646
+ --black-legacy-800: hsl(210, 8%, 95%);
647
+ --black-legacy-900: hsl(0, 0%, 100%);
648
+ --orange-legacy-050: hsl(27, 100%, 7%);
649
+ --orange-legacy-100: hsl(27, 100%, 9%);
650
+ --orange-legacy-200: hsl(27, 100%, 15%);
651
+ --orange-legacy-300: hsl(27, 100%, 22%);
652
+ --orange-legacy-400: hsl(27, 100%, 64%);
653
+ --orange-legacy-500: hsl(27, 100%, 71%);
654
+ --orange-legacy-600: hsl(27, 100%, 77%);
655
+ --orange-legacy-700: hsl(27, 100%, 82%);
656
+ --orange-legacy-800: hsl(27, 100%, 87%);
657
+ --orange-legacy-900: hsl(27, 100%, 91%);
658
+ --blue-legacy-050: hsl(206, 100%, 7%);
659
+ --blue-legacy-100: hsl(206, 100%, 11%);
660
+ --blue-legacy-200: hsl(206, 100%, 17%);
661
+ --blue-legacy-300: hsl(206, 100%, 24%);
662
+ --blue-legacy-400: hsl(206, 100%, 75%);
663
+ --blue-legacy-500: hsl(206, 100%, 80%);
664
+ --blue-legacy-600: hsl(206, 100%, 85%);
665
+ --blue-legacy-700: hsl(206, 100%, 90%);
666
+ --blue-legacy-800: hsl(206, 100%, 92.5%);
667
+ --blue-legacy-900: hsl(206, 100%, 95%);
668
+ --powder-legacy-050: hsl(205, 100%, 7%);
669
+ --powder-legacy-100: hsl(205, 95%, 10%);
670
+ --powder-legacy-200: hsl(205, 80%, 14%);
671
+ --powder-legacy-300: hsl(205, 76%, 19%);
672
+ --powder-legacy-400: hsl(205, 55%, 72%);
673
+ --powder-legacy-500: hsl(205, 60%, 76%);
674
+ --powder-legacy-600: hsl(205, 70%, 80%);
675
+ --powder-legacy-700: hsl(205, 75%, 84%);
676
+ --powder-legacy-800: hsl(205, 75%, 88%);
677
+ --powder-legacy-900: hsl(205, 75%, 92%);
678
+ --green-legacy-025: hsl(140, 100%, 5%);
679
+ --green-legacy-050: hsl(140, 100%, 6%);
680
+ --green-legacy-100: hsl(140, 100%, 7%);
681
+ --green-legacy-200: hsl(140, 100%, 11%);
682
+ --green-legacy-300: hsl(140, 100%, 15%);
683
+ --green-legacy-400: hsl(140, 100%, 65%);
684
+ --green-legacy-500: hsl(140, 100%, 71%);
685
+ --green-legacy-600: hsl(140, 100%, 77%);
686
+ --green-legacy-700: hsl(140, 100%, 83%);
687
+ --green-legacy-800: hsl(140, 100%, 89%);
688
+ --green-legacy-900: hsl(140, 100%, 94%);
689
+ --yellow-legacy-050: hsl(47, 100%, 6%);
690
+ --yellow-legacy-100: hsl(47, 100%, 9%);
691
+ --yellow-legacy-200: hsl(47, 100%, 14%);
692
+ --yellow-legacy-300: hsl(47, 100%, 20%);
693
+ --yellow-legacy-400: hsl(47, 100%, 55%);
694
+ --yellow-legacy-500: hsl(47, 100%, 63%);
695
+ --yellow-legacy-600: hsl(47, 100%, 71%);
696
+ --yellow-legacy-700: hsl(47, 100%, 79%);
697
+ --yellow-legacy-800: hsl(47, 100%, 87%);
698
+ --yellow-legacy-900: hsl(47, 100%, 95%);
699
+ --red-legacy-025: hsl(358, 100%, 7%);
700
+ --red-legacy-050: hsl(358, 100%, 9%);
701
+ --red-legacy-100: hsl(358, 100%, 12%);
702
+ --red-legacy-200: hsl(358, 100%, 17%);
703
+ --red-legacy-300: hsl(358, 100%, 22%);
704
+ --red-legacy-400: hsl(358, 100%, 70%);
705
+ --red-legacy-500: hsl(358, 100%, 75%);
706
+ --red-legacy-600: hsl(358, 100%, 80%);
707
+ --red-legacy-700: hsl(358, 100%, 85%);
708
+ --red-legacy-800: hsl(358, 100%, 90%);
709
+ --red-legacy-900: hsl(358, 100%, 95%);
710
+ --gold-legacy: hsl(48, 100%, 50%);
711
+ --gold-legacy-lighter: hsl(45, 100%, 9%);
712
+ --gold-legacy-darker: hsl(45, 100%, 80%);
713
+ --silver-legacy: hsl(210, 6%, 72%);
714
+ --silver-legacy-lighter: hsl(210, 5%, 9%);
715
+ --silver-legacy-darker: hsl(210, 5%, 70%);
716
+ --bronze-legacy: hsl(28, 38%, 65%);
717
+ --bronze-legacy-lighter: hsl(28, 40%, 8%);
718
+ --bronze-legacy-darker: hsl(28, 46.7%, 75%);
719
+ --bc-lightest-legacy: var(--black-legacy-400);
720
+ --bc-lighter-legacy: var(--black-legacy-400);
721
+ --bc-light-legacy: var(--black-legacy-400);
722
+ --bc-medium-legacy: var(--black-legacy-400);
723
+ --bc-dark-legacy: var(--black-legacy-700);
724
+ --bc-darker-legacy: var(--black-legacy-900);
725
+ --focus-ring-legacy: hsla(206, 100%, 40%, 0.9);
726
+ --focus-ring-success-legacy: hsla(140, 40%, 40%, 0.9);
727
+ --focus-ring-warning-legacy: hsla(47, 76%, 46%, 0.9);
728
+ --focus-ring-error-legacy: hsla(358, 62%, 47%, 0.9);
729
+ --focus-ring-muted-legacy: hsla(210, 8%, 55%, 0.95);
730
+ --fc-dark-legacy: var(--black-legacy-900);
731
+ --fc-medium-legacy: var(--black-legacy-700);
732
+ --fc-light-legacy: var(--black-legacy-500);
733
+ --theme-primary-color-legacy: var(--orange-legacy-400);
734
+ --theme-primary-legacy-025: var(--orange-legacy-050);
735
+ --theme-primary-legacy-050: var(--orange-legacy-050);
736
+ --theme-primary-legacy-075: var(--orange-legacy-050);
737
+ --theme-primary-legacy-100: var(--orange-legacy-100);
738
+ --theme-primary-legacy-150: var(--orange-legacy-100);
739
+ --theme-primary-legacy-200: var(--orange-legacy-200);
740
+ --theme-primary-legacy-300: var(--orange-legacy-300);
741
+ --theme-primary-legacy-350: var(--orange-legacy-300);
742
+ --theme-primary-legacy-400: var(--orange-legacy-400);
743
+ --theme-primary-legacy-500: var(--orange-legacy-500);
744
+ --theme-primary-legacy-600: var(--orange-legacy-600);
745
+ --theme-primary-legacy-700: var(--orange-legacy-700);
746
+ --theme-primary-legacy-800: var(--orange-legacy-800);
747
+ --theme-primary-legacy-900: var(--orange-legacy-900);
748
+ --theme-secondary-color-legacy: var(--blue-legacy-400);
749
+ --theme-secondary-legacy-025: var(--blue-legacy-050);
750
+ --theme-secondary-legacy-050: var(--blue-legacy-050);
751
+ --theme-secondary-legacy-075: var(--blue-legacy-050);
752
+ --theme-secondary-legacy-100: var(--blue-legacy-100);
753
+ --theme-secondary-legacy-150: var(--blue-legacy-100);
754
+ --theme-secondary-legacy-200: var(--blue-legacy-200);
755
+ --theme-secondary-legacy-300: var(--blue-legacy-300);
756
+ --theme-secondary-legacy-350: var(--blue-legacy-300);
757
+ --theme-secondary-legacy-400: var(--blue-legacy-400);
758
+ --theme-secondary-legacy-500: var(--blue-legacy-500);
759
+ --theme-secondary-legacy-600: var(--blue-legacy-600);
760
+ --theme-secondary-legacy-700: var(--blue-legacy-700);
761
+ --theme-secondary-legacy-800: var(--blue-legacy-800);
762
+ --theme-secondary-legacy-900: var(--blue-legacy-900);
763
+ }
764
+
765
+ @media (prefers-color-scheme: dark) {
766
+ body.theme-system.theme-highcontrast {
767
+ --white-legacy: hsl(0, 0%, 0%);
768
+ --black-legacy: hsl(0, 0%, 100%);
769
+ --black-legacy-025: hsl(210, 8%, 2.5%);
770
+ --black-legacy-050: hsl(210, 8%, 5%);
771
+ --black-legacy-075: hsl(210, 8%, 7.5%);
772
+ --black-legacy-100: hsl(210, 8%, 10%);
773
+ --black-legacy-150: hsl(210, 8%, 12.5%);
774
+ --black-legacy-200: hsl(210, 8%, 15%);
775
+ --black-legacy-300: hsl(210, 8%, 65%);
776
+ --black-legacy-350: hsl(210, 8%, 67.5%);
777
+ --black-legacy-400: hsl(210, 8%, 70%);
778
+ --black-legacy-500: hsl(210, 8%, 75%);
779
+ --black-legacy-600: hsl(210, 8%, 80%);
780
+ --black-legacy-700: hsl(210, 8%, 85%);
781
+ --black-legacy-750: hsl(210, 8%, 90%);
782
+ --black-legacy-800: hsl(210, 8%, 95%);
783
+ --black-legacy-900: hsl(0, 0%, 100%);
784
+ --orange-legacy-050: hsl(27, 100%, 7%);
785
+ --orange-legacy-100: hsl(27, 100%, 9%);
786
+ --orange-legacy-200: hsl(27, 100%, 15%);
787
+ --orange-legacy-300: hsl(27, 100%, 22%);
788
+ --orange-legacy-400: hsl(27, 100%, 64%);
789
+ --orange-legacy-500: hsl(27, 100%, 71%);
790
+ --orange-legacy-600: hsl(27, 100%, 77%);
791
+ --orange-legacy-700: hsl(27, 100%, 82%);
792
+ --orange-legacy-800: hsl(27, 100%, 87%);
793
+ --orange-legacy-900: hsl(27, 100%, 91%);
794
+ --blue-legacy-050: hsl(206, 100%, 7%);
795
+ --blue-legacy-100: hsl(206, 100%, 11%);
796
+ --blue-legacy-200: hsl(206, 100%, 17%);
797
+ --blue-legacy-300: hsl(206, 100%, 24%);
798
+ --blue-legacy-400: hsl(206, 100%, 75%);
799
+ --blue-legacy-500: hsl(206, 100%, 80%);
800
+ --blue-legacy-600: hsl(206, 100%, 85%);
801
+ --blue-legacy-700: hsl(206, 100%, 90%);
802
+ --blue-legacy-800: hsl(206, 100%, 92.5%);
803
+ --blue-legacy-900: hsl(206, 100%, 95%);
804
+ --powder-legacy-050: hsl(205, 100%, 7%);
805
+ --powder-legacy-100: hsl(205, 95%, 10%);
806
+ --powder-legacy-200: hsl(205, 80%, 14%);
807
+ --powder-legacy-300: hsl(205, 76%, 19%);
808
+ --powder-legacy-400: hsl(205, 55%, 72%);
809
+ --powder-legacy-500: hsl(205, 60%, 76%);
810
+ --powder-legacy-600: hsl(205, 70%, 80%);
811
+ --powder-legacy-700: hsl(205, 75%, 84%);
812
+ --powder-legacy-800: hsl(205, 75%, 88%);
813
+ --powder-legacy-900: hsl(205, 75%, 92%);
814
+ --green-legacy-025: hsl(140, 100%, 5%);
815
+ --green-legacy-050: hsl(140, 100%, 6%);
816
+ --green-legacy-100: hsl(140, 100%, 7%);
817
+ --green-legacy-200: hsl(140, 100%, 11%);
818
+ --green-legacy-300: hsl(140, 100%, 15%);
819
+ --green-legacy-400: hsl(140, 100%, 65%);
820
+ --green-legacy-500: hsl(140, 100%, 71%);
821
+ --green-legacy-600: hsl(140, 100%, 77%);
822
+ --green-legacy-700: hsl(140, 100%, 83%);
823
+ --green-legacy-800: hsl(140, 100%, 89%);
824
+ --green-legacy-900: hsl(140, 100%, 94%);
825
+ --yellow-legacy-050: hsl(47, 100%, 6%);
826
+ --yellow-legacy-100: hsl(47, 100%, 9%);
827
+ --yellow-legacy-200: hsl(47, 100%, 14%);
828
+ --yellow-legacy-300: hsl(47, 100%, 20%);
829
+ --yellow-legacy-400: hsl(47, 100%, 55%);
830
+ --yellow-legacy-500: hsl(47, 100%, 63%);
831
+ --yellow-legacy-600: hsl(47, 100%, 71%);
832
+ --yellow-legacy-700: hsl(47, 100%, 79%);
833
+ --yellow-legacy-800: hsl(47, 100%, 87%);
834
+ --yellow-legacy-900: hsl(47, 100%, 95%);
835
+ --red-legacy-025: hsl(358, 100%, 7%);
836
+ --red-legacy-050: hsl(358, 100%, 9%);
837
+ --red-legacy-100: hsl(358, 100%, 12%);
838
+ --red-legacy-200: hsl(358, 100%, 17%);
839
+ --red-legacy-300: hsl(358, 100%, 22%);
840
+ --red-legacy-400: hsl(358, 100%, 70%);
841
+ --red-legacy-500: hsl(358, 100%, 75%);
842
+ --red-legacy-600: hsl(358, 100%, 80%);
843
+ --red-legacy-700: hsl(358, 100%, 85%);
844
+ --red-legacy-800: hsl(358, 100%, 90%);
845
+ --red-legacy-900: hsl(358, 100%, 95%);
846
+ --gold-legacy: hsl(48, 100%, 50%);
847
+ --gold-legacy-lighter: hsl(45, 100%, 9%);
848
+ --gold-legacy-darker: hsl(45, 100%, 80%);
849
+ --silver-legacy: hsl(210, 6%, 72%);
850
+ --silver-legacy-lighter: hsl(210, 5%, 9%);
851
+ --silver-legacy-darker: hsl(210, 5%, 70%);
852
+ --bronze-legacy: hsl(28, 38%, 65%);
853
+ --bronze-legacy-lighter: hsl(28, 40%, 8%);
854
+ --bronze-legacy-darker: hsl(28, 46.7%, 75%);
855
+ --bc-lightest-legacy: var(--black-legacy-400);
856
+ --bc-lighter-legacy: var(--black-legacy-400);
857
+ --bc-light-legacy: var(--black-legacy-400);
858
+ --bc-medium-legacy: var(--black-legacy-400);
859
+ --bc-dark-legacy: var(--black-legacy-700);
860
+ --bc-darker-legacy: var(--black-legacy-900);
861
+ --focus-ring-legacy: hsla(206, 100%, 40%, 0.9);
862
+ --focus-ring-success-legacy: hsla(140, 40%, 40%, 0.9);
863
+ --focus-ring-warning-legacy: hsla(47, 76%, 46%, 0.9);
864
+ --focus-ring-error-legacy: hsla(358, 62%, 47%, 0.9);
865
+ --focus-ring-muted-legacy: hsla(210, 8%, 55%, 0.95);
866
+ --fc-dark-legacy: var(--black-legacy-900);
867
+ --fc-medium-legacy: var(--black-legacy-700);
868
+ --fc-light-legacy: var(--black-legacy-500);
869
+ --theme-primary-color-legacy: var(--orange-legacy-400);
870
+ --theme-primary-legacy-025: var(--orange-legacy-050);
871
+ --theme-primary-legacy-050: var(--orange-legacy-050);
872
+ --theme-primary-legacy-075: var(--orange-legacy-050);
873
+ --theme-primary-legacy-100: var(--orange-legacy-100);
874
+ --theme-primary-legacy-150: var(--orange-legacy-100);
875
+ --theme-primary-legacy-200: var(--orange-legacy-200);
876
+ --theme-primary-legacy-300: var(--orange-legacy-300);
877
+ --theme-primary-legacy-350: var(--orange-legacy-300);
878
+ --theme-primary-legacy-400: var(--orange-legacy-400);
879
+ --theme-primary-legacy-500: var(--orange-legacy-500);
880
+ --theme-primary-legacy-600: var(--orange-legacy-600);
881
+ --theme-primary-legacy-700: var(--orange-legacy-700);
882
+ --theme-primary-legacy-800: var(--orange-legacy-800);
883
+ --theme-primary-legacy-900: var(--orange-legacy-900);
884
+ --theme-secondary-color-legacy: var(--blue-legacy-400);
885
+ --theme-secondary-legacy-025: var(--blue-legacy-050);
886
+ --theme-secondary-legacy-050: var(--blue-legacy-050);
887
+ --theme-secondary-legacy-075: var(--blue-legacy-050);
888
+ --theme-secondary-legacy-100: var(--blue-legacy-100);
889
+ --theme-secondary-legacy-150: var(--blue-legacy-100);
890
+ --theme-secondary-legacy-200: var(--blue-legacy-200);
891
+ --theme-secondary-legacy-300: var(--blue-legacy-300);
892
+ --theme-secondary-legacy-350: var(--blue-legacy-300);
893
+ --theme-secondary-legacy-400: var(--blue-legacy-400);
894
+ --theme-secondary-legacy-500: var(--blue-legacy-500);
895
+ --theme-secondary-legacy-600: var(--blue-legacy-600);
896
+ --theme-secondary-legacy-700: var(--blue-legacy-700);
897
+ --theme-secondary-legacy-800: var(--blue-legacy-800);
898
+ --theme-secondary-legacy-900: var(--blue-legacy-900);
899
+ }
900
+ }
901
+ "
902
+ `;