@jrgermain/stylesheet 0.4.1 → 0.5.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.
package/dist/index.css CHANGED
@@ -1,2818 +1,2 @@
1
- *, :before, :after {
2
- box-sizing: border-box;
3
- margin: 0;
4
- }
5
-
6
- :where(:focus-visible) {
7
- outline: var(--border-m) solid var(--color-brand-5);
8
- }
9
-
10
- html {
11
- -webkit-text-size-adjust: none;
12
- -moz-text-size-adjust: none;
13
- text-size-adjust: none;
14
- --lightningcss-light: initial;
15
- --lightningcss-dark: ;
16
- color-scheme: light dark;
17
- }
18
-
19
- @media (prefers-color-scheme: dark) {
20
- html {
21
- --lightningcss-light: ;
22
- --lightningcss-dark: initial;
23
- }
24
- }
25
-
26
- body {
27
- background-color: var(--color-body);
28
- color: var(--color-body-text);
29
- margin: 0;
30
- }
31
-
32
- img, picture, video, iframe {
33
- max-width: 100%;
34
- display: block;
35
- }
36
-
37
- :root, ::backdrop {
38
- --color-brand-1: var(--lightningcss-light, #08003b) var(--lightningcss-dark, #e5edff);
39
- --color-brand-2: var(--lightningcss-light, #190074) var(--lightningcss-dark, #bbc9ff);
40
- --color-brand-3: var(--lightningcss-light, #290fa3) var(--lightningcss-dark, #93a4ff);
41
- --color-brand-4: var(--lightningcss-light, #3c35cb) var(--lightningcss-dark, #6f7dff);
42
- --color-brand-5: #545be7;
43
- --color-brand-6: var(--lightningcss-light, #6f7dff) var(--lightningcss-dark, #3c35cb);
44
- --color-brand-7: var(--lightningcss-light, #93a4ff) var(--lightningcss-dark, #290fa3);
45
- --color-brand-8: var(--lightningcss-light, #bbc9ff) var(--lightningcss-dark, #190074);
46
- --color-brand-9: var(--lightningcss-light, #e5edff) var(--lightningcss-dark, #08003b);
47
- --color-brand-transparent: var(--lightningcss-light, #545be766) var(--lightningcss-dark, #545be780);
48
- --color-brand-extra-transparent: var(--lightningcss-light, #545be733) var(--lightningcss-dark, #545be759);
49
- --color-red-1: var(--lightningcss-light, #240000) var(--lightningcss-dark, #ffe3dc);
50
- --color-red-2: var(--lightningcss-light, #4d0000) var(--lightningcss-dark, #ffb4a5);
51
- --color-red-3: var(--lightningcss-light, #7a0000) var(--lightningcss-dark, #ff7c68);
52
- --color-red-4: var(--lightningcss-light, #a90000) var(--lightningcss-dark, #f0503d);
53
- --color-red-5: #cc2a1b;
54
- --color-red-6: var(--lightningcss-light, #f0503d) var(--lightningcss-dark, #a90000);
55
- --color-red-7: var(--lightningcss-light, #ff7c68) var(--lightningcss-dark, #7a0000);
56
- --color-red-8: var(--lightningcss-light, #ffb4a5) var(--lightningcss-dark, #4d0000);
57
- --color-red-9: var(--lightningcss-light, #ffe3dc) var(--lightningcss-dark, #240000);
58
- --color-red-transparent: var(--lightningcss-light, #cc2a1b66) var(--lightningcss-dark, #cc2a1b80);
59
- --color-red-extra-transparent: var(--lightningcss-light, #cc2a1b33) var(--lightningcss-dark, #cc2a1b59);
60
- --color-orange-1: var(--lightningcss-light, #1c0300) var(--lightningcss-dark, #ffe6cc);
61
- --color-orange-2: var(--lightningcss-light, #3e1200) var(--lightningcss-dark, #ffb87e);
62
- --color-orange-3: var(--lightningcss-light, #632500) var(--lightningcss-dark, #f98f3a);
63
- --color-orange-4: var(--lightningcss-light, #8b3a00) var(--lightningcss-dark, #d76f04);
64
- --color-orange-5: #b45100;
65
- --color-orange-6: var(--lightningcss-light, #d76f04) var(--lightningcss-dark, #8b3a00);
66
- --color-orange-7: var(--lightningcss-light, #f98f3a) var(--lightningcss-dark, #632500);
67
- --color-orange-8: var(--lightningcss-light, #ffb87e) var(--lightningcss-dark, #3e1200);
68
- --color-orange-9: var(--lightningcss-light, #ffe6cc) var(--lightningcss-dark, #1c0300);
69
- --color-orange-transparent: var(--lightningcss-light, #b4510066) var(--lightningcss-dark, #b4510080);
70
- --color-orange-extra-transparent: var(--lightningcss-light, #b4510033) var(--lightningcss-dark, #b4510059);
71
- --color-yellow-1: var(--lightningcss-light, #140900) var(--lightningcss-dark, #f8edc1);
72
- --color-yellow-2: var(--lightningcss-light, #2f1e00) var(--lightningcss-dark, #efcb72);
73
- --color-yellow-3: var(--lightningcss-light, #4e3700) var(--lightningcss-dark, #dfb22b);
74
- --color-yellow-4: var(--lightningcss-light, #7a5700) var(--lightningcss-dark, #c89808);
75
- --color-yellow-5: #a57c00;
76
- --color-yellow-6: var(--lightningcss-light, #c89808) var(--lightningcss-dark, #7a5700);
77
- --color-yellow-7: var(--lightningcss-light, #dfb22b) var(--lightningcss-dark, #4e3700);
78
- --color-yellow-8: var(--lightningcss-light, #efcb72) var(--lightningcss-dark, #2f1e00);
79
- --color-yellow-9: var(--lightningcss-light, #f8edc1) var(--lightningcss-dark, #140900);
80
- --color-yellow-transparent: var(--lightningcss-light, #a57c0066) var(--lightningcss-dark, #a57c0080);
81
- --color-yellow-extra-transparent: var(--lightningcss-light, #a57c0033) var(--lightningcss-dark, #a57c0059);
82
- --color-green-1: var(--lightningcss-light, #011000) var(--lightningcss-dark, #dafbc4);
83
- --color-green-2: var(--lightningcss-light, #0c2a00) var(--lightningcss-dark, #a4e472);
84
- --color-green-3: var(--lightningcss-light, #1d4600) var(--lightningcss-dark, #7dc53a);
85
- --color-green-4: var(--lightningcss-light, #2f6500) var(--lightningcss-dark, #5fa500);
86
- --color-green-5: #438500;
87
- --color-green-6: var(--lightningcss-light, #5fa500) var(--lightningcss-dark, #2f6500);
88
- --color-green-7: var(--lightningcss-light, #7dc53a) var(--lightningcss-dark, #1d4600);
89
- --color-green-8: var(--lightningcss-light, #a4e472) var(--lightningcss-dark, #0c2a00);
90
- --color-green-9: var(--lightningcss-light, #dafbc4) var(--lightningcss-dark, #011000);
91
- --color-green-transparent: var(--lightningcss-light, #43850066) var(--lightningcss-dark, #43850080);
92
- --color-green-extra-transparent: var(--lightningcss-light, #43850033) var(--lightningcss-dark, #43850059);
93
- --color-sky-1: var(--lightningcss-light, #001011) var(--lightningcss-dark, #caf9f8);
94
- --color-sky-2: var(--lightningcss-light, #002a2b) var(--lightningcss-dark, #76e2e2);
95
- --color-sky-3: var(--lightningcss-light, #004747) var(--lightningcss-dark, #00c8c9);
96
- --color-sky-4: var(--lightningcss-light, #006566) var(--lightningcss-dark, #00a7a8);
97
- --color-sky-5: #008586;
98
- --color-sky-6: var(--lightningcss-light, #00a7a8) var(--lightningcss-dark, #006566);
99
- --color-sky-7: var(--lightningcss-light, #00c8c9) var(--lightningcss-dark, #004747);
100
- --color-sky-8: var(--lightningcss-light, #76e2e2) var(--lightningcss-dark, #002a2b);
101
- --color-sky-9: var(--lightningcss-light, #caf9f8) var(--lightningcss-dark, #001011);
102
- --color-sky-transparent: var(--lightningcss-light, #00858666) var(--lightningcss-dark, #00858680);
103
- --color-sky-extra-transparent: var(--lightningcss-light, #00858633) var(--lightningcss-dark, #00858659);
104
- --color-blue-1: var(--lightningcss-light, #00003e) var(--lightningcss-dark, #ddf0ff);
105
- --color-blue-2: var(--lightningcss-light, #00007a) var(--lightningcss-dark, #a9cfff);
106
- --color-blue-3: var(--lightningcss-light, #002b97) var(--lightningcss-dark, #74adff);
107
- --color-blue-4: var(--lightningcss-light, #004abd) var(--lightningcss-dark, #3988ff);
108
- --color-blue-5: #1c69e3;
109
- --color-blue-6: var(--lightningcss-light, #3988ff) var(--lightningcss-dark, #004abd);
110
- --color-blue-7: var(--lightningcss-light, #74adff) var(--lightningcss-dark, #002b97);
111
- --color-blue-8: var(--lightningcss-light, #a9cfff) var(--lightningcss-dark, #00007a);
112
- --color-blue-9: var(--lightningcss-light, #ddf0ff) var(--lightningcss-dark, #00003e);
113
- --color-blue-transparent: var(--lightningcss-light, #1c69e366) var(--lightningcss-dark, #1c69e380);
114
- --color-blue-extra-transparent: var(--lightningcss-light, #1c69e333) var(--lightningcss-dark, #1c69e359);
115
- --color-purple-1: var(--lightningcss-light, #170029) var(--lightningcss-dark, #fbe4ff);
116
- --color-purple-2: var(--lightningcss-light, #370054) var(--lightningcss-dark, #e8b6ff);
117
- --color-purple-3: var(--lightningcss-light, #5a0085) var(--lightningcss-dark, #ce8dfc);
118
- --color-purple-4: var(--lightningcss-light, #7819a8) var(--lightningcss-dark, #b562ea);
119
- --color-purple-5: #9640ca;
120
- --color-purple-6: var(--lightningcss-light, #b562ea) var(--lightningcss-dark, #7819a8);
121
- --color-purple-7: var(--lightningcss-light, #ce8dfc) var(--lightningcss-dark, #5a0085);
122
- --color-purple-8: var(--lightningcss-light, #e8b6ff) var(--lightningcss-dark, #370054);
123
- --color-purple-9: var(--lightningcss-light, #fbe4ff) var(--lightningcss-dark, #170029);
124
- --color-purple-transparent: var(--lightningcss-light, #9640ca66) var(--lightningcss-dark, #9640ca80);
125
- --color-purple-extra-transparent: var(--lightningcss-light, #9640ca33) var(--lightningcss-dark, #9640ca59);
126
- --color-magenta-1: var(--lightningcss-light, #21000c) var(--lightningcss-dark, #ffe1f0);
127
- --color-magenta-2: var(--lightningcss-light, #480023) var(--lightningcss-dark, #ffadd0);
128
- --color-magenta-3: var(--lightningcss-light, #73003d) var(--lightningcss-dark, #fe7cb1);
129
- --color-magenta-4: var(--lightningcss-light, #9b0058) var(--lightningcss-dark, #e45193);
130
- --color-magenta-5: #c32775;
131
- --color-magenta-6: var(--lightningcss-light, #e45193) var(--lightningcss-dark, #9b0058);
132
- --color-magenta-7: var(--lightningcss-light, #fe7cb1) var(--lightningcss-dark, #73003d);
133
- --color-magenta-8: var(--lightningcss-light, #ffadd0) var(--lightningcss-dark, #480023);
134
- --color-magenta-9: var(--lightningcss-light, #ffe1f0) var(--lightningcss-dark, #21000c);
135
- --color-magenta-transparent: var(--lightningcss-light, #c3277566) var(--lightningcss-dark, #c3277580);
136
- --color-magenta-extra-transparent: var(--lightningcss-light, #c3277533) var(--lightningcss-dark, #c3277559);
137
- --color-gray-1: var(--lightningcss-light, #090b0f) var(--lightningcss-dark, #eceff4);
138
- --color-gray-2: var(--lightningcss-light, #202226) var(--lightningcss-dark, #cbced3);
139
- --color-gray-3: var(--lightningcss-light, #383b3f) var(--lightningcss-dark, #abaeb3);
140
- --color-gray-4: var(--lightningcss-light, #53555a) var(--lightningcss-dark, #8d8f94);
141
- --color-gray-5: #6f7276;
142
- --color-gray-6: var(--lightningcss-light, #8d8f94) var(--lightningcss-dark, #53555a);
143
- --color-gray-7: var(--lightningcss-light, #abaeb3) var(--lightningcss-dark, #383b3f);
144
- --color-gray-8: var(--lightningcss-light, #cbced3) var(--lightningcss-dark, #202226);
145
- --color-gray-9: var(--lightningcss-light, #eceff4) var(--lightningcss-dark, #090b0f);
146
- --color-gray-transparent: var(--lightningcss-light, #6f727666) var(--lightningcss-dark, #6f727680);
147
- --color-gray-extra-transparent: var(--lightningcss-light, #6f727633) var(--lightningcss-dark, #6f727659);
148
- --color-body: var(--lightningcss-light, #f9fafc) var(--lightningcss-dark, #14161a);
149
- --color-body-alt: var(--lightningcss-light, #fff) var(--lightningcss-dark, #010203);
150
- --color-body-text: var(--lightningcss-light, #030305) var(--lightningcss-dark, #fff);
151
- --color-body-text-alt: var(--lightningcss-light, #404247) var(--lightningcss-dark, #ccced0);
152
- --color-shadow: var(--lightningcss-light, #45484c26) var(--lightningcss-dark, #00000166);
153
- --color-outline: var(--lightningcss-light, #d8dbe0) var(--lightningcss-dark, #434549);
154
- --font-size-xs: clamp(.6944rem, .6855rem + .0446vw, .72rem);
155
- --font-size-s: clamp(.8331rem, .8099rem + .1163vw, .9rem);
156
- --font-size-m: clamp(1rem, .9565rem + .2174vw, 1.125rem);
157
- --font-size-l: clamp(1.2rem, 1.1283rem + .3587vw, 1.4063rem);
158
- --font-size-xl: clamp(1.44rem, 1.3293rem + .5533vw, 1.7581rem);
159
- --font-size-2xl: clamp(1.7281rem, 1.5649rem + .8163vw, 2.1975rem);
160
- --font-size-3xl: clamp(2.0738rem, 1.8396rem + 1.1707vw, 2.7469rem);
161
- --font-size-4xl: clamp(2.4881rem, 2.1594rem + 1.6435vw, 3.4331rem);
162
- --font-weight-light: 300;
163
- --font-weight-normal: 400;
164
- --font-weight-semibold: 600;
165
- --font-weight-bold: 700;
166
- --font-weight-black: 900;
167
- --font-family-body: "Avenir Next", avenir, corbel, source-sans-pro, "DejaVu Sans", ui-sans-serif, sans-serif;
168
- --font-family-heading: seravek, "Gill Sans Nova", cantarell, verdana, "DejaVu Sans", ui-sans-serif, sans-serif;
169
- --font-family-mono: ui-monospace, "Source Code Pro", ui-monospace, monospace;
170
- --space-3xs: clamp(4px, 3.6528px + .1087vw, 5px);
171
- --space-2xs: clamp(8px, 7.6528px + .1087vw, 9px);
172
- --space-xs: clamp(12px, 11.304px + .2174vw, 14px);
173
- --space-s: clamp(16px, 15.304px + .2174vw, 18px);
174
- --space-m: clamp(24px, 22.9568px + .3261vw, 27px);
175
- --space-l: clamp(32px, 30.608px + .4348vw, 36px);
176
- --space-xl: clamp(48px, 45.9136px + .6522vw, 54px);
177
- --space-2xl: clamp(64px, 61.2176px + .8696vw, 72px);
178
- --space-3xl: clamp(96px, 91.8256px + 1.3043vw, 108px);
179
- --space-body: clamp(12px, 6.7824px + 1.6304vw, 27px);
180
- --radius-none: 0;
181
- --radius-s: 3px;
182
- --radius-m: 6px;
183
- --radius-l: 12px;
184
- --radius-xl: 24px;
185
- --radius-2xl: 64px;
186
- --radius-full: 9999px;
187
- --shadow-none: none;
188
- --shadow-s: 0 1px 3px -1px var(--color-shadow);
189
- --shadow-m: 0 1px 7px -1px var(--color-shadow);
190
- --shadow-l: var(--shadow-s), 0 1px 11px -1px var(--color-shadow);
191
- --shadow-xl: var(--shadow-m), 0 1px 15px -1px var(--color-shadow);
192
- --border-none: 0;
193
- --border-s: 1px;
194
- --border-m: 2px;
195
- --border-l: 5px;
196
- --border-xl: 8px;
197
- --opacity-disabled: var(--lightningcss-light, .65) var(--lightningcss-dark, .5);
198
- }
199
-
200
- .alert, .banner {
201
- font-family: var(--font-family-body);
202
- font-size: var(--font-size-m);
203
- font-weight: var(--font-weight-normal);
204
- color: var(--color-body-text);
205
- background: linear-gradient(var(--alert-bg-color), var(--alert-bg-color)) padding-box, linear-gradient(to right, var(--alert-border-start-color), var(--alert-border-end-color)) border-box;
206
- border: var(--border-m) solid transparent;
207
- line-height: 1.4;
208
- display: block;
209
- position: relative;
210
- }
211
-
212
- :is(.alert, .banner) > * {
213
- line-height: 1.4;
214
- }
215
-
216
- @media print {
217
- :is(.alert, .banner) {
218
- border-color: var(--alert-border-start-color);
219
- }
220
- }
221
-
222
- :is(.alert, .banner):before, :is(.alert, .banner):after {
223
- content: "";
224
- print-color-adjust: exact;
225
- width: 2em;
226
- height: 2em;
227
- margin-block: auto;
228
- position: absolute;
229
- inset-block: 0;
230
- }
231
-
232
- :is(.alert, .banner):before {
233
- z-index: 2;
234
- -webkit-mask-image: var(--alert-icon);
235
- mask-image: var(--alert-icon);
236
- background-color: var(--alert-border-start-color);
237
- scale: .5;
238
- -webkit-mask-size: contain;
239
- mask-size: contain;
240
- -webkit-mask-repeat: no-repeat;
241
- mask-repeat: no-repeat;
242
- }
243
-
244
- :is(.alert, .banner):after {
245
- z-index: 1;
246
- border-radius: var(--radius-full);
247
- border: 3px solid var(--alert-border-start-color);
248
- background-color: var(--lightningcss-light, #fffe) var(--lightningcss-dark, #000e);
249
- scale: .75;
250
- }
251
-
252
- :is(.alert, .banner).error {
253
- --alert-bg-color: var(--color-red-9);
254
- --alert-border-start-color: var(--color-red-5);
255
- --alert-border-end-color: var(--color-red-6);
256
- --alert-dismiss-icon-color: var(--color-red-4);
257
- --alert-dismiss-hover-bg: var(--color-red-extra-transparent);
258
- --alert-dismiss-focus-bg: var(--color-red-transparent);
259
- --alert-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='none' stroke='currentColor' stroke-linecap='round' stroke-linejoin='round' stroke-width='64' d='M368 368L144 144M368 144L144 368' /%3E%3C/svg%3E");
260
- }
261
-
262
- :is(.alert, .banner).warning {
263
- --alert-bg-color: var(--color-yellow-9);
264
- --alert-border-start-color: var(--color-yellow-5);
265
- --alert-border-end-color: var(--color-yellow-6);
266
- --alert-dismiss-icon-color: var(--color-yellow-4);
267
- --alert-dismiss-hover-bg: var(--color-yellow-extra-transparent);
268
- --alert-dismiss-focus-bg: var(--color-yellow-transparent);
269
- --alert-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M256 80c-8.66 0-16.58 7.36-16 16l8 216a8 8 0 008 8h0a8 8 0 008-8l8-216c.58-8.64-7.34-16-16-16z' fill='none' stroke='currentColor' stroke-linecap='round' stroke-linejoin='round' stroke-width='64' /%3E%3Ccircle cx='256' cy='436' r='24' fill='none' stroke='currentColor' stroke-linecap='round' stroke-linejoin='round' stroke-width='48' /%3E%3C/svg%3E");
270
- }
271
-
272
- :is(.alert, .banner).success {
273
- --alert-bg-color: var(--color-green-9);
274
- --alert-border-start-color: var(--color-green-5);
275
- --alert-border-end-color: var(--color-green-6);
276
- --alert-dismiss-icon-color: var(--color-green-4);
277
- --alert-dismiss-hover-bg: var(--color-green-extra-transparent);
278
- --alert-dismiss-focus-bg: var(--color-green-transparent);
279
- --alert-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='none' stroke='currentColor' stroke-linecap='round' stroke-linejoin='round' stroke-width='64' d='M416 128L192 384l-96-96' /%3E%3C/svg%3E");
280
- }
281
-
282
- :is(.alert, .banner).info {
283
- --alert-bg-color: var(--color-sky-9);
284
- --alert-border-start-color: var(--color-sky-5);
285
- --alert-border-end-color: var(--color-sky-6);
286
- --alert-dismiss-icon-color: var(--color-sky-4);
287
- --alert-dismiss-hover-bg: var(--color-sky-extra-transparent);
288
- --alert-dismiss-focus-bg: var(--color-sky-transparent);
289
- --alert-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='none' stroke='currentColor' stroke-linecap='round' stroke-linejoin='round' stroke-width='64' d='M196 220h64v172' /%3E%3Cpath fill='none' stroke='currentColor' stroke-linecap='round' stroke-miterlimit='10' stroke-width='64' d='M187 396h138' /%3E%3Ccircle cx='253 ' cy='118' r='44' /%3E%3C/svg%3E");
290
- }
291
-
292
- .alert-title, .banner-title {
293
- font-family: var(--font-family-heading);
294
- font-weight: var(--font-weight-bold);
295
- color: var(--alert-border-start-color);
296
- margin: 0;
297
- margin-block-end: .15em;
298
- font-size: .85em;
299
- line-height: 1;
300
- }
301
-
302
- .modal, .drawer, .modal::backdrop, .drawer::backdrop {
303
- --dialog-starting-opacity: .25;
304
- --dialog-starting-transform: translateY(8px);
305
- --dialog-open-opacity: 1;
306
- --dialog-open-transform: translate(0);
307
- --dialog-ending-opacity: 0;
308
- --dialog-ending-transform: translateY(-4px) scale(.97);
309
- --dialog-backdrop-starting-opacity: 0;
310
- --dialog-backdrop-open-opacity: var(--lightningcss-light, .75) var(--lightningcss-dark, .85);
311
- --dialog-backdrop-ending-opacity: 0;
312
- --dialog-backdrop-color: var(--lightningcss-light, var(--color-gray-2)) var(--lightningcss-dark, var(--color-gray-8));
313
- }
314
-
315
- @media (prefers-reduced-motion) {
316
- :is(.modal, .drawer, .modal::backdrop, .drawer::backdrop) {
317
- --dialog-starting-transform: translate(0);
318
- --dialog-ending-transform: translate(0);
319
- }
320
- }
321
-
322
- .modal, .drawer {
323
- box-shadow: var(--shadow-xl);
324
- border: var(--border-s) solid var(--color-outline);
325
- border-radius: var(--radius-l);
326
- background-color: var(--color-body-alt);
327
- color: var(--color-body-text);
328
- flex-direction: column;
329
- gap: 0;
330
- padding: 0;
331
- }
332
-
333
- :is(.modal, .drawer)::backdrop {
334
- background-color: var(--dialog-backdrop-color);
335
- }
336
-
337
- :is(.modal, .drawer)[open] {
338
- display: flex;
339
- }
340
-
341
- .modal-header, .drawer-header {
342
- font-family: var(--font-family-heading);
343
- font-size: var(--font-size-m);
344
- font-weight: var(--font-weight-bold);
345
- padding: var(--space-m);
346
- color: var(--color-brand-3);
347
- flex-shrink: 0;
348
- justify-content: space-between;
349
- align-items: center;
350
- margin: 0;
351
- padding-block-end: var(--space-xs);
352
- line-height: 1;
353
- display: flex;
354
- }
355
-
356
- :is(.modal-header, .drawer-header) h1, :is(.modal-header, .drawer-header) h2, :is(.modal-header, .drawer-header) h3, :is(.modal-header, .drawer-header) h4, :is(.modal-header, .drawer-header) h5, :is(.modal-header, .drawer-header) h6 {
357
- color: inherit;
358
- font-size: inherit;
359
- font-weight: inherit;
360
- margin: 0;
361
- }
362
-
363
- .modal-body, .drawer-body {
364
- padding: var(--space-m);
365
- flex-shrink: 1;
366
- margin: 0;
367
- padding-block-start: var(--space-xs);
368
- display: block;
369
- overflow: auto;
370
- }
371
-
372
- @supports (transition-behavior: allow-discrete) and (overlay: none) {
373
- .modal, .drawer {
374
- animation: unset;
375
- }
376
- }
377
-
378
- .button.dismiss {
379
- --button-fg-color: var(--color-body-text);
380
- --button-bg-color: transparent;
381
- --button-border-color: transparent;
382
- --button-hover-bg-color: var(--color-gray-extra-transparent);
383
- --button-focus-ring-color: transparent;
384
- --button-shadow: none;
385
- width: 3em;
386
- height: 3em;
387
- font-size: .75rem;
388
- }
389
-
390
- .button.dismiss:is(:focus-visible, .focus) {
391
- --button-bg-color: var(--color-gray-transparent);
392
- --button-hover-bg-color: transparent;
393
- }
394
-
395
- .button.dismiss:after {
396
- content: "";
397
- background-color: currentColor;
398
- width: 1.8em;
399
- height: 1.8em;
400
- -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='none' stroke='currentColor' stroke-linecap='round' stroke-linejoin='round' stroke-width='32' d='M368 368L144 144M368 144L144 368' /%3E%3C/svg%3E");
401
- mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='none' stroke='currentColor' stroke-linecap='round' stroke-linejoin='round' stroke-width='32' d='M368 368L144 144M368 144L144 368' /%3E%3C/svg%3E");
402
- -webkit-mask-size: contain;
403
- mask-size: contain;
404
- -webkit-mask-repeat: no-repeat;
405
- mask-repeat: no-repeat;
406
- }
407
-
408
- .accordion {
409
- width: 100%;
410
- }
411
-
412
- .accordion details {
413
- background-color: var(--color-body-alt);
414
- width: 100%;
415
- padding-block: 0;
416
- padding-inline: var(--space-xs);
417
- border-radius: var(--radius-m);
418
- border: var(--border-s) solid var(--color-outline);
419
- box-shadow: var(--shadow-s);
420
- font-family: var(--font-family-body);
421
- font-size: var(--font-size-m);
422
- font-weight: var(--font-weight-normal);
423
- }
424
-
425
- @media (prefers-reduced-motion: no-preference) {
426
- .accordion details {
427
- transition: padding .15s;
428
- }
429
- }
430
-
431
- .accordion details + details {
432
- border-block-start: 0;
433
- }
434
-
435
- .accordion details:not(:first-of-type) {
436
- border-start-start-radius: 0;
437
- border-start-end-radius: 0;
438
- }
439
-
440
- .accordion details:not(:last-of-type) {
441
- border-end-end-radius: 0;
442
- border-end-start-radius: 0;
443
- }
444
-
445
- .accordion details[open] {
446
- padding-block-end: var(--space-xs);
447
- }
448
-
449
- .accordion details[open] summary {
450
- border-block-end-color: var(--color-outline);
451
- margin-block-end: var(--space-xs);
452
- }
453
-
454
- .accordion details[open] summary:before {
455
- rotate: none;
456
- }
457
-
458
- .accordion details[open] summary:not(:active, .active, :hover, .hover) {
459
- color: var(--color-brand-3);
460
- }
461
-
462
- .accordion summary {
463
- font-family: var(--font-family-heading);
464
- font-size: var(--font-size-m);
465
- font-weight: var(--font-weight-bold);
466
- cursor: pointer;
467
- border-block-end: var(--border-s) dashed transparent;
468
- padding: var(--space-xs);
469
- margin-block: 0;
470
- margin-inline: calc(-1 * var(--space-xs));
471
- color: var(--color-body-text);
472
- -webkit-user-select: none;
473
- user-select: none;
474
- padding-inline-start: calc(var(--space-xs) + 1em);
475
- line-height: 1;
476
- list-style: none;
477
- transition-property: color, border-color;
478
- transition-duration: .15s;
479
- transition-timing-function: ease;
480
- position: relative;
481
- }
482
-
483
- @media (prefers-reduced-motion: no-preference) {
484
- .accordion summary {
485
- transition-property: color, border-color, padding, margin;
486
- }
487
- }
488
-
489
- .accordion summary:is(:hover, .hover) {
490
- color: var(--lightningcss-light, var(--color-brand-4)) var(--lightningcss-dark, var(--color-brand-2));
491
- }
492
-
493
- .accordion summary:is(:active, .active) {
494
- color: var(--lightningcss-light, var(--color-brand-2)) var(--lightningcss-dark, var(--color-brand-4));
495
- }
496
-
497
- .accordion summary::-webkit-details-marker {
498
- display: none;
499
- }
500
-
501
- .accordion summary:before {
502
- content: var(--lightningcss-light, url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m6 9l6 6l6-6' /%3E%3C/svg%3E")) var(--lightningcss-dark, url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='white' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m6 9l6 6l6-6' /%3E%3C/svg%3E"));
503
- width: 1em;
504
- height: 1em;
505
- margin: auto;
506
- transition: rotate .2s;
507
- display: inline-block;
508
- position: absolute;
509
- inset-block: 0;
510
- inset-inline-start: calc(var(--space-xs) / 2);
511
- rotate: -90deg;
512
- }
513
-
514
- .accordion summary:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)):before {
515
- rotate: 90deg;
516
- }
517
-
518
- @media (prefers-reduced-motion) {
519
- .accordion summary {
520
- transition-property: color, border-color;
521
- }
522
-
523
- .accordion summary:before {
524
- transition: none;
525
- }
526
- }
527
-
528
- .accordion.subtle details {
529
- box-shadow: none;
530
- padding-inline: var(--space-2xs);
531
- background-color: #0000;
532
- border: 0;
533
- }
534
-
535
- .accordion.subtle details[open] summary {
536
- margin-block-end: var(--space-2xs);
537
- }
538
-
539
- .accordion.subtle summary {
540
- padding: var(--space-2xs);
541
- border-block-end: 0;
542
- padding-inline-start: calc(var(--space-2xs) + 1em);
543
- }
544
-
545
- .alert {
546
- border-radius: var(--radius-s);
547
- padding: var(--space-2xs);
548
- border-start-start-radius: calc(var(--space-2xs) + 2em);
549
- border-end-start-radius: calc(var(--space-2xs) + 2em);
550
- padding-inline-start: calc(var(--space-2xs) + 2em);
551
- }
552
-
553
- .alert:before, .alert:after {
554
- inset-inline-start: calc(var(--space-2xs) * .5);
555
- }
556
-
557
- .app {
558
- --app-max-content-width: 110rem;
559
- --app-header-height: clamp(50px, 3.5rem, 70px);
560
- --app-sidebar-width: clamp(300px, 18rem, 400px);
561
- width: 100%;
562
- min-height: 100svh;
563
- font-family: var(--font-family-body);
564
- font-size: var(--font-size-m);
565
- flex-direction: column;
566
- display: flex;
567
- position: relative;
568
- }
569
-
570
- .app-header {
571
- height: var(--app-header-height);
572
- width: 100%;
573
- color: var(--lightningcss-light, var(--color-brand-3)) var(--lightningcss-dark, var(--color-brand-2));
574
- background-color: var(--color-body-alt);
575
- border-bottom: var(--border-l) solid var(--color-brand-transparent);
576
- box-shadow: var(--shadow-s);
577
- flex: none;
578
- position: sticky;
579
- left: 0;
580
- }
581
-
582
- .app-header-content {
583
- width: 100%;
584
- height: 100%;
585
- max-width: var(--app-max-content-width);
586
- padding-inline: var(--space-body);
587
- justify-content: space-between;
588
- align-items: center;
589
- gap: var(--space-s);
590
- margin-inline: auto;
591
- display: flex;
592
- }
593
-
594
- .app-header-section {
595
- align-items: center;
596
- height: 100%;
597
- margin: 0;
598
- display: flex;
599
- }
600
-
601
- .app-header-section:only-child {
602
- margin-inline: auto;
603
- }
604
-
605
- .app-header-section:first-child {
606
- margin-inline-end: auto;
607
- }
608
-
609
- .app-header-section:first-child .app-header-item:first-child {
610
- margin-inline-start: calc(-1 * var(--space-xs));
611
- }
612
-
613
- .app-header-section:last-child .app-header-item:last-child {
614
- margin-inline-end: calc(-1 * var(--space-xs));
615
- }
616
-
617
- .app-header-section:nth-child(n+3):before {
618
- content: "";
619
- background-color: var(--color-outline);
620
- height: 2rem;
621
- width: var(--border-s);
622
- right: calc(var(--space-s) / 2);
623
- position: relative;
624
- }
625
-
626
- .app-header-item {
627
- cursor: pointer;
628
- height: 100%;
629
- color: inherit;
630
- font-weight: var(--font-weight-semibold);
631
- padding-inline: var(--space-xs);
632
- border-radius: var(--radius-m);
633
- border: var(--border-m) solid var(--color-body-alt);
634
- align-items: center;
635
- text-decoration: none;
636
- transition-property: color, background-color;
637
- transition-duration: .2s;
638
- transition-timing-function: ease;
639
- display: flex;
640
- position: relative;
641
- }
642
-
643
- .app-header-item:hover {
644
- background-color: var(--color-brand-extra-transparent);
645
- }
646
-
647
- .app-header-item:active {
648
- background-color: var(--color-brand-transparent);
649
- }
650
-
651
- .app-header-item:focus-visible {
652
- background-color: var(--color-brand-extra-transparent);
653
- outline-offset: calc(-1 * var(--border-m));
654
- }
655
-
656
- .app-header-item:is([aria-current], .current) {
657
- font-weight: var(--font-weight-bold);
658
- }
659
-
660
- .app-header-item:is([aria-current], .current):after {
661
- opacity: 1;
662
- }
663
-
664
- .app-header-item:after {
665
- content: "";
666
- width: 100%;
667
- height: var(--border-l);
668
- bottom: calc(-1 * (var(--border-l) + var(--border-m)));
669
- opacity: 0;
670
- background-color: currentColor;
671
- border-radius: 1px;
672
- position: absolute;
673
- left: 0;
674
- }
675
-
676
- .app-body {
677
- width: 100%;
678
- max-width: var(--app-max-content-width);
679
- flex-direction: row;
680
- flex: none;
681
- margin-inline: auto;
682
- display: flex;
683
- position: relative;
684
- }
685
-
686
- .app-sidebar {
687
- transition: opacity .15s ease, display .15s allow-discrete;
688
- width: var(--app-sidebar-width);
689
- opacity: 1;
690
- border-inline-end: var(--border-s) dashed var(--color-outline);
691
- flex: none;
692
- }
693
-
694
- .app-sidebar-content {
695
- height: 100dvh;
696
- position: sticky;
697
- top: 0;
698
- overflow: auto;
699
- }
700
-
701
- .app-sidebar-section:first-of-type {
702
- margin-block-start: var(--space-body);
703
- }
704
-
705
- .app-sidebar-section:not(:last-of-type) {
706
- margin-block-end: var(--space-xs);
707
- }
708
-
709
- .app-sidebar-section:last-of-type {
710
- margin-block-end: var(--space-body);
711
- }
712
-
713
- .app-sidebar-heading {
714
- margin: 0 var(--space-body) var(--space-3xs);
715
- font-size: 1.2rem;
716
- font-weight: var(--font-weight-semibold);
717
- }
718
-
719
- .app-sidebar-item {
720
- margin: 0 var(--space-2xs);
721
- padding: var(--space-2xs) calc(var(--space-body) - var(--space-2xs));
722
- border-radius: var(--radius-l);
723
- color: var(--color-body-text-alt);
724
- font-weight: var(--font-weight-normal);
725
- -webkit-user-select: none;
726
- user-select: none;
727
- font-size: 1rem;
728
- text-decoration: none;
729
- transition-property: color, background-color, box-shadow;
730
- transition-duration: .2s;
731
- transition-timing-function: ease;
732
- display: block;
733
- }
734
-
735
- .app-sidebar-item:hover {
736
- background-color: var(--color-brand-extra-transparent);
737
- }
738
-
739
- .app-sidebar-item:active {
740
- color: var(--color-brand-1);
741
- }
742
-
743
- .app-sidebar-item:is([aria-current], .current) {
744
- color: var(--color-brand-4);
745
- font-weight: var(--font-weight-bold);
746
- }
747
-
748
- .app-sidebar-item:hover:active {
749
- background-color: var(--color-brand-transparent);
750
- }
751
-
752
- .app-sidebar-item:focus-visible {
753
- outline-offset: 0;
754
- background-color: var(--color-brand-extra-transparent);
755
- }
756
-
757
- .app-sidebar-toggle {
758
- width: 2.75rem;
759
- margin-inline-start: 1rem;
760
- transition-property: color, background-color;
761
- transition-duration: .2s;
762
- transition-timing-function: ease;
763
- display: none;
764
- }
765
-
766
- .app-sidebar-toggle:has(input:focus-visible) {
767
- outline: var(--border-m) solid var(--color-brand-5);
768
- outline-offset: calc(-1 * var(--border-m));
769
- }
770
-
771
- .app-sidebar-toggle:before {
772
- content: "";
773
- height: 100%;
774
- width: var(--border-s);
775
- background-color: var(--color-outline);
776
- position: absolute;
777
- top: 0;
778
- left: -.5rem;
779
- }
780
-
781
- .app-sidebar-toggle > div {
782
- opacity: 1;
783
- background-color: currentColor;
784
- border-radius: 2px;
785
- width: 1.75rem;
786
- height: 2px;
787
- transition-property: transform, opacity;
788
- transition-duration: .2s;
789
- transition-timing-function: ease;
790
- position: absolute;
791
- top: 50%;
792
- left: 50%;
793
- }
794
-
795
- .app-sidebar-toggle > div:first-of-type {
796
- transform: translateY(calc(-50% - .45rem))translateX(-50%);
797
- }
798
-
799
- .app-sidebar-toggle > div:nth-of-type(2) {
800
- transform: translateY(-50%)translateX(-50%);
801
- }
802
-
803
- .app-sidebar-toggle > div:nth-of-type(3) {
804
- transform: translateY(calc(.45rem - 50%))translateX(-50%);
805
- }
806
-
807
- .app-sidebar-toggle:has(input:checked) > div:first-of-type {
808
- transform: translateY(-50%)translateX(-50%)rotate(45deg);
809
- }
810
-
811
- .app-sidebar-toggle:has(input:checked) > div:nth-of-type(2) {
812
- opacity: 0;
813
- transform: translateY(-50%)translateX(-50%)rotate3d(0, 1, 0, 90deg);
814
- }
815
-
816
- .app-sidebar-toggle:has(input:checked) > div:nth-of-type(3) {
817
- transform: translateY(-50%)translateX(-50%)rotate(-45deg);
818
- }
819
-
820
- .app-content {
821
- width: 100%;
822
- padding: var(--space-body);
823
- position: relative;
824
- }
825
-
826
- .app-sidebar ~ .app-content {
827
- width: calc(100% - var(--app-sidebar-width));
828
- }
829
-
830
- @media (max-width: calc(55rem - .001px)) {
831
- .app-sidebar ~ .app-content {
832
- width: 100%;
833
- }
834
-
835
- .app-sidebar {
836
- top: var(--app-header-height);
837
- opacity: 1;
838
- -webkit-backdrop-filter: blur(24px) saturate(120%);
839
- backdrop-filter: blur(24px) saturate(120%);
840
- z-index: 9;
841
- background-color: var(--lightningcss-light, #fffc) var(--lightningcss-dark, #000a);
842
- border-right: 0;
843
- width: 100vw;
844
- position: fixed;
845
- left: 0;
846
- }
847
-
848
- .app-sidebar:after {
849
- content: initial;
850
- }
851
-
852
- .app-sidebar-toggle {
853
- display: initial;
854
- }
855
-
856
- .app-sidebar-content {
857
- height: calc(100dvh - var(--app-header-height));
858
- }
859
-
860
- .app:not(:has(.app-sidebar-toggle input:checked)) .app-sidebar {
861
- opacity: 0;
862
- display: none;
863
- }
864
-
865
- .app:has(.app-sidebar-toggle input:checked) {
866
- overflow: hidden;
867
- }
868
-
869
- .app:has(.app-sidebar-toggle input:checked) > .banner {
870
- display: none;
871
- }
872
-
873
- .app:has(.app-sidebar-toggle input:checked) .app-header {
874
- z-index: 10;
875
- position: fixed;
876
- top: 0;
877
- }
878
-
879
- .app:has(.app-sidebar-toggle input:checked) .app-content {
880
- top: var(--app-header-height);
881
- }
882
- }
883
-
884
- .app:has(dialog:modal) {
885
- overflow: hidden;
886
- }
887
-
888
- .banner {
889
- width: 100%;
890
- padding: var(--space-xs);
891
- border-inline-width: 0;
892
- padding-inline-start: calc(var(--space-xs) + 2em);
893
- }
894
-
895
- .banner:has(.button.dismiss) {
896
- padding-inline-end: calc(var(--space-xs) + 2em);
897
- }
898
-
899
- .banner:before, .banner:after {
900
- inset-inline-start: calc(var(--space-xs) * .5);
901
- }
902
-
903
- .banner + .banner {
904
- border-block-start-width: 0;
905
- }
906
-
907
- .banner .button.dismiss {
908
- --button-fg-color: var(--alert-dismiss-icon-color);
909
- --button-hover-bg-color: var(--alert-dismiss-hover-bg);
910
- margin: auto;
911
- position: absolute;
912
- inset-block: 0;
913
- inset-inline-end: var(--space-3xs);
914
- }
915
-
916
- .banner .button.dismiss:is(:focus-visible, .focus) {
917
- --button-bg-color: var(--alert-dismiss-focus-bg);
918
- }
919
-
920
- .button {
921
- --button-shadow: var(--shadow-s);
922
- --button-hover-bg-color: var(--button-border-color);
923
- box-sizing: border-box;
924
- cursor: pointer;
925
- border-style: solid;
926
- border-width: var(--border-s);
927
- border-radius: var(--radius-m);
928
- min-width: 3em;
929
- min-height: 2.6em;
930
- line-height: 1;
931
- font-family: var(--font-family-body);
932
- box-shadow: var(--button-shadow);
933
- -webkit-user-select: none;
934
- user-select: none;
935
- color: var(--button-fg-color);
936
- background-color: var(--button-bg-color);
937
- border-color: var(--button-border-color);
938
- font-size: 1rem;
939
- font-weight: var(--button-font-weight);
940
- outline: 0;
941
- justify-content: center;
942
- align-items: center;
943
- gap: .5em;
944
- padding-block: .75em;
945
- padding-inline: 1.25em;
946
- text-decoration: none;
947
- transition-property: box-shadow, background-color, transform, opacity;
948
- transition-duration: .2s;
949
- transition-timing-function: ease;
950
- display: inline-flex;
951
- position: relative;
952
- overflow: hidden;
953
- transform: scale(1);
954
- }
955
-
956
- .button:before {
957
- content: "";
958
- background-color: var(--button-hover-bg-color);
959
- z-index: -1;
960
- opacity: 0;
961
- border-radius: 2em;
962
- width: 4em;
963
- height: 4em;
964
- margin: auto;
965
- transition-property: opacity, width, height, border-radius;
966
- transition-duration: .2s;
967
- transition-timing-function: ease;
968
- position: absolute;
969
- inset: 0;
970
- }
971
-
972
- .button:is(:focus-visible, .focus) {
973
- box-shadow: var(--button-shadow), 0 0 0 .1em var(--button-border-color), 0 0 0 calc(.2em + var(--border-s)) var(--button-focus-ring-color);
974
- }
975
-
976
- .button:is(:active, .active) {
977
- transform: scale(.98);
978
- }
979
-
980
- @media screen and (-webkit-max-device-pixel-ratio: 1.999), screen and (max-resolution: 1.999dppx) {
981
- .button:is(:active, .active) {
982
- transform: translateY(1px);
983
- }
984
- }
985
-
986
- .button:is(:hover, .hover) {
987
- text-decoration: none;
988
- }
989
-
990
- .button:is(:hover, .hover):before {
991
- opacity: 1;
992
- border-radius: 5px;
993
- width: 100%;
994
- height: 100%;
995
- }
996
-
997
- .button:is(:hover, .hover):is(input) {
998
- background-color: var(--button-hover-bg-color);
999
- }
1000
-
1001
- .button.primary {
1002
- --button-fg-color: white;
1003
- --button-bg-color: var(--color-brand-5);
1004
- --button-border-color: var(--color-brand-4);
1005
- --button-font-weight: var(--font-weight-bold);
1006
- --button-focus-ring-color: var(--color-brand-transparent);
1007
- }
1008
-
1009
- .button.primary.red {
1010
- --button-bg-color: var(--color-red-5);
1011
- --button-border-color: var(--color-red-4);
1012
- --button-focus-ring-color: var(--color-red-transparent);
1013
- }
1014
-
1015
- .button.primary.orange {
1016
- --button-bg-color: var(--color-orange-5);
1017
- --button-border-color: var(--color-orange-4);
1018
- --button-focus-ring-color: var(--color-orange-transparent);
1019
- }
1020
-
1021
- .button.primary.yellow {
1022
- --button-bg-color: var(--color-yellow-5);
1023
- --button-border-color: var(--color-yellow-4);
1024
- --button-focus-ring-color: var(--color-yellow-transparent);
1025
- }
1026
-
1027
- .button.primary.green {
1028
- --button-bg-color: var(--color-green-5);
1029
- --button-border-color: var(--color-green-4);
1030
- --button-focus-ring-color: var(--color-green-transparent);
1031
- }
1032
-
1033
- .button.primary.sky {
1034
- --button-bg-color: var(--color-sky-5);
1035
- --button-border-color: var(--color-sky-4);
1036
- --button-focus-ring-color: var(--color-sky-transparent);
1037
- }
1038
-
1039
- .button.primary.blue {
1040
- --button-bg-color: var(--color-blue-5);
1041
- --button-border-color: var(--color-blue-4);
1042
- --button-focus-ring-color: var(--color-blue-transparent);
1043
- }
1044
-
1045
- .button.primary.purple {
1046
- --button-bg-color: var(--color-purple-5);
1047
- --button-border-color: var(--color-purple-4);
1048
- --button-focus-ring-color: var(--color-purple-transparent);
1049
- }
1050
-
1051
- .button.primary.magenta {
1052
- --button-bg-color: var(--color-magenta-5);
1053
- --button-border-color: var(--color-magenta-4);
1054
- --button-focus-ring-color: var(--color-magenta-transparent);
1055
- }
1056
-
1057
- .button.primary.gray {
1058
- --button-bg-color: var(--color-gray-5);
1059
- --button-border-color: var(--color-gray-4);
1060
- --button-focus-ring-color: var(--color-gray-transparent);
1061
- }
1062
-
1063
- .button:not(.primary, .subtle, .close, .dismiss) {
1064
- --button-fg-color: var(--color-body-text);
1065
- --button-bg-color: var(--color-gray-9);
1066
- --button-border-color: var(--color-gray-8);
1067
- --button-font-weight: var(--font-weight-normal);
1068
- --button-focus-ring-color: var(--color-gray-extra-transparent);
1069
- }
1070
-
1071
- .button:is(.subtle, .close) {
1072
- --button-fg-color: var(--color-brand-4);
1073
- --button-bg-color: transparent;
1074
- --button-border-color: transparent;
1075
- --button-hover-bg-color: var(--color-brand-extra-transparent);
1076
- --button-font-weight: var(--font-weight-bold);
1077
- --button-focus-ring-color: transparent;
1078
- --button-shadow: none;
1079
- }
1080
-
1081
- .button:is(.subtle, .close):is(:focus-visible, .focus) {
1082
- --button-bg-color: var(--color-brand-transparent);
1083
- --button-hover-bg-color: transparent;
1084
- }
1085
-
1086
- .button:is(.subtle, .close).red {
1087
- --button-fg-color: var(--color-red-4);
1088
- --button-hover-bg-color: var(--color-red-extra-transparent);
1089
- }
1090
-
1091
- .button:is(.subtle, .close).red:is(:focus-visible, .focus) {
1092
- --button-bg-color: var(--color-red-transparent);
1093
- }
1094
-
1095
- .button:is(.subtle, .close).orange {
1096
- --button-fg-color: var(--color-orange-4);
1097
- --button-hover-bg-color: var(--color-orange-extra-transparent);
1098
- }
1099
-
1100
- .button:is(.subtle, .close).orange:is(:focus-visible, .focus) {
1101
- --button-bg-color: var(--color-orange-transparent);
1102
- }
1103
-
1104
- .button:is(.subtle, .close).yellow {
1105
- --button-fg-color: var(--color-yellow-4);
1106
- --button-hover-bg-color: var(--color-yellow-extra-transparent);
1107
- }
1108
-
1109
- .button:is(.subtle, .close).yellow:is(:focus-visible, .focus) {
1110
- --button-bg-color: var(--color-yellow-transparent);
1111
- }
1112
-
1113
- .button:is(.subtle, .close).green {
1114
- --button-fg-color: var(--color-green-4);
1115
- --button-hover-bg-color: var(--color-green-extra-transparent);
1116
- }
1117
-
1118
- .button:is(.subtle, .close).green:is(:focus-visible, .focus) {
1119
- --button-bg-color: var(--color-green-transparent);
1120
- }
1121
-
1122
- .button:is(.subtle, .close).sky {
1123
- --button-fg-color: var(--color-sky-4);
1124
- --button-hover-bg-color: var(--color-sky-extra-transparent);
1125
- }
1126
-
1127
- .button:is(.subtle, .close).sky:is(:focus-visible, .focus) {
1128
- --button-bg-color: var(--color-sky-transparent);
1129
- }
1130
-
1131
- .button:is(.subtle, .close).blue {
1132
- --button-fg-color: var(--color-blue-4);
1133
- --button-hover-bg-color: var(--color-blue-extra-transparent);
1134
- }
1135
-
1136
- .button:is(.subtle, .close).blue:is(:focus-visible, .focus) {
1137
- --button-bg-color: var(--color-blue-transparent);
1138
- }
1139
-
1140
- .button:is(.subtle, .close).purple {
1141
- --button-fg-color: var(--color-purple-4);
1142
- --button-hover-bg-color: var(--color-purple-extra-transparent);
1143
- }
1144
-
1145
- .button:is(.subtle, .close).purple:is(:focus-visible, .focus) {
1146
- --button-bg-color: var(--color-purple-transparent);
1147
- }
1148
-
1149
- .button:is(.subtle, .close).magenta {
1150
- --button-fg-color: var(--color-magenta-4);
1151
- --button-hover-bg-color: var(--color-magenta-extra-transparent);
1152
- }
1153
-
1154
- .button:is(.subtle, .close).magenta:is(:focus-visible, .focus) {
1155
- --button-bg-color: var(--color-magenta-transparent);
1156
- }
1157
-
1158
- .button:is(.subtle, .close).gray {
1159
- --button-fg-color: var(--color-gray-4);
1160
- --button-hover-bg-color: var(--color-gray-extra-transparent);
1161
- }
1162
-
1163
- .button:is(.subtle, .close).gray:is(:focus-visible, .focus) {
1164
- --button-bg-color: var(--color-gray-transparent);
1165
- }
1166
-
1167
- .button:is(.small, .close, .dismiss) {
1168
- font-size: .8rem;
1169
- }
1170
-
1171
- .button.large {
1172
- font-size: 1.2rem;
1173
- }
1174
-
1175
- .button:is(.icon, .close, .dismiss) {
1176
- border-radius: var(--radius-full);
1177
- aspect-ratio: 1;
1178
- min-width: 0;
1179
- min-height: 0;
1180
- }
1181
-
1182
- .button:is(.icon, .close, .dismiss):is(.subtle, .close):before {
1183
- width: 75%;
1184
- height: 75%;
1185
- }
1186
-
1187
- .button:is(.icon, .close, .dismiss):is(.subtle, .close):is(:hover, .hover):before {
1188
- border-radius: 100%;
1189
- width: 100%;
1190
- height: 100%;
1191
- }
1192
-
1193
- .button:is(.icon, .close, .dismiss).icon {
1194
- padding: .5em;
1195
- }
1196
-
1197
- .button:is(.icon, .close, .dismiss).close, .button:is(.icon, .close, .dismiss).dismiss {
1198
- padding: .3em;
1199
- }
1200
-
1201
- .button:is(.icon, .close, .dismiss):not(.subtle, .close, .dismiss):before {
1202
- content: unset;
1203
- }
1204
-
1205
- .button:is(.icon, .close, .dismiss):not(.subtle, .close, .dismiss):is(:hover, .hover) {
1206
- background-color: var(--button-hover-bg-color);
1207
- }
1208
-
1209
- .button:is(:disabled, .disabled, [aria-disabled="true"]) {
1210
- opacity: var(--opacity-disabled);
1211
- cursor: not-allowed;
1212
- transform: scale(1);
1213
- }
1214
-
1215
- .button:is(:disabled, .disabled, [aria-disabled="true"]):is(:hover, .hover):before {
1216
- opacity: 0;
1217
- }
1218
-
1219
- .button.loading {
1220
- cursor: progress;
1221
- }
1222
-
1223
- .button.loading:before {
1224
- animation: 1.2s ease-in-out infinite forwards button-loading-bg;
1225
- opacity: 1 !important;
1226
- border-radius: inherit !important;
1227
- height: 100% !important;
1228
- }
1229
-
1230
- .button.loading:is(:disabled, .disabled, [aria-disabled="true"]) {
1231
- cursor: wait;
1232
- }
1233
-
1234
- @keyframes button-loading-bg {
1235
- 0% {
1236
- width: 0;
1237
- margin: 0 auto 0 0;
1238
- }
1239
-
1240
- 50% {
1241
- width: 100%;
1242
- }
1243
-
1244
- 100% {
1245
- width: 0;
1246
- margin: 0 0 0 auto;
1247
- }
1248
- }
1249
-
1250
- .card {
1251
- background-color: var(--color-body-alt);
1252
- border-radius: var(--radius-l);
1253
- border: var(--border-s) solid var(--color-outline);
1254
- box-shadow: var(--shadow-m);
1255
- padding: var(--space-m);
1256
- font-family: var(--font-family-body);
1257
- font-size: var(--font-size-m);
1258
- font-weight: var(--font-weight-normal);
1259
- }
1260
-
1261
- .card.secondary {
1262
- background-color: var(--color-body);
1263
- border-radius: var(--radius-m);
1264
- box-shadow: var(--shadow-s);
1265
- padding: var(--space-s);
1266
- }
1267
-
1268
- .card-title {
1269
- font-family: var(--font-family-heading);
1270
- text-wrap: balance;
1271
- overflow-wrap: break-word;
1272
- line-height: 1.15;
1273
- font-size: var(--font-size-l);
1274
- font-weight: var(--font-weight-bold);
1275
- color: var(--color-brand-3);
1276
- margin-block: 0 var(--space-xs);
1277
- }
1278
-
1279
- .card.secondary .card-title {
1280
- font-size: var(--font-size-m);
1281
- margin-block-end: var(--space-2xs);
1282
- }
1283
-
1284
- .chip {
1285
- --chip-fg-color: white;
1286
- --chip-bg-color: var(--color-brand-6);
1287
- --chip-border-color: var(--lightningcss-light, var(--color-brand-7)) var(--lightningcss-dark, var(--color-brand-5));
1288
- --chip-focus-color: var(--color-brand-transparent);
1289
- --chip-bg-color-active: var(--lightningcss-light, var(--color-brand-5)) var(--lightningcss-dark, var(--color-brand-7));
1290
- border-radius: var(--radius-full);
1291
- font-size: var(--font-size-s);
1292
- font-family: var(--font-family-body);
1293
- font-weight: var(--font-weight-normal);
1294
- padding-block: var(--space-3xs);
1295
- padding-inline: var(--space-xs);
1296
- background-color: var(--chip-bg-color);
1297
- border: var(--border-s) solid var(--chip-border-color);
1298
- color: var(--chip-fg-color);
1299
- cursor: default;
1300
- appearance: none;
1301
- flex-shrink: 0;
1302
- align-items: center;
1303
- line-height: 1.2;
1304
- text-decoration: none;
1305
- transition-property: box-shadow, background-color, border-color;
1306
- transition-duration: .2s;
1307
- transition-timing-function: ease;
1308
- display: inline-flex;
1309
- }
1310
-
1311
- .chip:is(:focus-visible, .focus) {
1312
- box-shadow: 0 0 0 .2em var(--chip-focus-color);
1313
- }
1314
-
1315
- .chip.clickable {
1316
- cursor: pointer;
1317
- box-shadow: var(--shadow-s);
1318
- }
1319
-
1320
- .chip.clickable:is(:focus-visible, .focus) {
1321
- box-shadow: var(--shadow-s), 0 0 0 .2em var(--chip-focus-color);
1322
- outline: 0;
1323
- }
1324
-
1325
- .chip.clickable:is(:hover, .hover) {
1326
- background-color: var(--chip-border-color);
1327
- }
1328
-
1329
- .chip.clickable:is(:active, .active) {
1330
- background-color: var(--chip-bg-color-active);
1331
- border-color: var(--chip-bg-color-active);
1332
- }
1333
-
1334
- .chip.red {
1335
- --chip-bg-color: var(--color-red-6);
1336
- --chip-border-color: var(--lightningcss-light, var(--color-red-7)) var(--lightningcss-dark, var(--color-red-5));
1337
- --chip-focus-color: var(--color-red-transparent);
1338
- --chip-bg-color-active: var(--lightningcss-light, var(--color-red-5)) var(--lightningcss-dark, var(--color-red-7));
1339
- }
1340
-
1341
- .chip.orange {
1342
- --chip-bg-color: var(--color-orange-6);
1343
- --chip-border-color: var(--lightningcss-light, var(--color-orange-7)) var(--lightningcss-dark, var(--color-orange-5));
1344
- --chip-focus-color: var(--color-orange-transparent);
1345
- --chip-bg-color-active: var(--lightningcss-light, var(--color-orange-5)) var(--lightningcss-dark, var(--color-orange-7));
1346
- }
1347
-
1348
- .chip.yellow {
1349
- --chip-bg-color: var(--color-yellow-6);
1350
- --chip-border-color: var(--lightningcss-light, var(--color-yellow-7)) var(--lightningcss-dark, var(--color-yellow-5));
1351
- --chip-focus-color: var(--color-yellow-transparent);
1352
- --chip-bg-color-active: var(--lightningcss-light, var(--color-yellow-5)) var(--lightningcss-dark, var(--color-yellow-7));
1353
- }
1354
-
1355
- .chip.green {
1356
- --chip-bg-color: var(--color-green-6);
1357
- --chip-border-color: var(--lightningcss-light, var(--color-green-7)) var(--lightningcss-dark, var(--color-green-5));
1358
- --chip-focus-color: var(--color-green-transparent);
1359
- --chip-bg-color-active: var(--lightningcss-light, var(--color-green-5)) var(--lightningcss-dark, var(--color-green-7));
1360
- }
1361
-
1362
- .chip.sky {
1363
- --chip-bg-color: var(--color-sky-6);
1364
- --chip-border-color: var(--lightningcss-light, var(--color-sky-7)) var(--lightningcss-dark, var(--color-sky-5));
1365
- --chip-focus-color: var(--color-sky-transparent);
1366
- --chip-bg-color-active: var(--lightningcss-light, var(--color-sky-5)) var(--lightningcss-dark, var(--color-sky-7));
1367
- }
1368
-
1369
- .chip.blue {
1370
- --chip-bg-color: var(--color-blue-6);
1371
- --chip-border-color: var(--lightningcss-light, var(--color-blue-7)) var(--lightningcss-dark, var(--color-blue-5));
1372
- --chip-focus-color: var(--color-blue-transparent);
1373
- --chip-bg-color-active: var(--lightningcss-light, var(--color-blue-5)) var(--lightningcss-dark, var(--color-blue-7));
1374
- }
1375
-
1376
- .chip.purple {
1377
- --chip-bg-color: var(--color-purple-6);
1378
- --chip-border-color: var(--lightningcss-light, var(--color-purple-7)) var(--lightningcss-dark, var(--color-purple-5));
1379
- --chip-focus-color: var(--color-purple-transparent);
1380
- --chip-bg-color-active: var(--lightningcss-light, var(--color-purple-5)) var(--lightningcss-dark, var(--color-purple-7));
1381
- }
1382
-
1383
- .chip.magenta {
1384
- --chip-bg-color: var(--color-magenta-6);
1385
- --chip-border-color: var(--lightningcss-light, var(--color-magenta-7)) var(--lightningcss-dark, var(--color-magenta-5));
1386
- --chip-focus-color: var(--color-magenta-transparent);
1387
- --chip-bg-color-active: var(--lightningcss-light, var(--color-magenta-5)) var(--lightningcss-dark, var(--color-magenta-7));
1388
- }
1389
-
1390
- .chip.gray {
1391
- --chip-bg-color: var(--color-gray-6);
1392
- --chip-border-color: var(--lightningcss-light, var(--color-gray-7)) var(--lightningcss-dark, var(--color-gray-5));
1393
- --chip-focus-color: var(--color-gray-transparent);
1394
- --chip-bg-color-active: var(--lightningcss-light, var(--color-gray-5)) var(--lightningcss-dark, var(--color-gray-7));
1395
- }
1396
-
1397
- .chip.black {
1398
- --chip-bg-color: black;
1399
- --chip-border-color: var(--lightningcss-light, var(--color-gray-4)) var(--lightningcss-dark, var(--color-gray-7));
1400
- --chip-focus-color: var(--color-gray-transparent);
1401
- --chip-bg-color-active: var(--lightningcss-light, var(--color-gray-1)) var(--lightningcss-dark, var(--color-gray-8));
1402
- }
1403
-
1404
- .chip.white {
1405
- --chip-fg-color: black;
1406
- --chip-bg-color: white;
1407
- --chip-border-color: var(--lightningcss-light, var(--color-gray-8)) var(--lightningcss-dark, var(--color-gray-2));
1408
- --chip-focus-color: var(--color-gray-transparent);
1409
- --chip-bg-color-active: var(--lightningcss-light, var(--color-gray-7)) var(--lightningcss-dark, var(--color-gray-3));
1410
- }
1411
-
1412
- .chip-delete {
1413
- margin-inline: var(--space-3xs) calc(-1 * var(--space-2xs));
1414
- border: var(--border-s) solid var(--chip-border-color);
1415
- border-radius: var(--radius-full);
1416
- cursor: pointer;
1417
- -webkit-user-select: none;
1418
- user-select: none;
1419
- width: 2em;
1420
- height: 2em;
1421
- box-shadow: none;
1422
- background-color: #0002;
1423
- outline: 0;
1424
- padding: 0;
1425
- font-size: .6em;
1426
- transition-property: background-color, border-color;
1427
- transition-duration: .2s;
1428
- transition-timing-function: ease;
1429
- display: inline-flex;
1430
- position: relative;
1431
- overflow: hidden;
1432
- }
1433
-
1434
- .chip-delete:after {
1435
- content: "";
1436
- background-color: var(--chip-fg-color);
1437
- width: 1.7em;
1438
- height: 1.7em;
1439
- margin: auto;
1440
- -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='none' stroke='currentColor' stroke-linecap='round' stroke-linejoin='round' stroke-width='32' d='M368 368L144 144M368 144L144 368' /%3E%3C/svg%3E");
1441
- mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='none' stroke='currentColor' stroke-linecap='round' stroke-linejoin='round' stroke-width='32' d='M368 368L144 144M368 144L144 368' /%3E%3C/svg%3E");
1442
- -webkit-mask-position: center;
1443
- mask-position: center;
1444
- -webkit-mask-size: contain;
1445
- mask-size: contain;
1446
- -webkit-mask-repeat: no-repeat;
1447
- mask-repeat: no-repeat;
1448
- }
1449
-
1450
- .chip-delete:is(:focus-visible, .focus) {
1451
- border-color: var(--chip-fg-color);
1452
- }
1453
-
1454
- .chip-delete:is(:hover, .hover, :focus-visible, .focus) {
1455
- background-color: #0001;
1456
- }
1457
-
1458
- .chip-delete:is(:active, .active) {
1459
- background-color: #0003;
1460
- }
1461
-
1462
- .divider, .markdown-output :is(hr, br) {
1463
- background-color: var(--color-outline);
1464
- width: 100%;
1465
- height: var(--border-s);
1466
- margin: var(--space-xs) 0;
1467
- print-color-adjust: exact;
1468
- border: 0;
1469
- outline: 0;
1470
- display: block;
1471
- }
1472
-
1473
- :is(.divider, .markdown-output :is(hr, br)).vertical {
1474
- width: var(--border-s);
1475
- height: 100%;
1476
- min-height: 1em;
1477
- margin: 0 var(--space-xs);
1478
- display: inline-block;
1479
- }
1480
-
1481
- .divider.invisible, .markdown-output br {
1482
- visibility: hidden;
1483
- }
1484
-
1485
- .drawer {
1486
- --dialog-starting-opacity: .5;
1487
- border: 0;
1488
- border-radius: 0;
1489
- margin: 0;
1490
- position: fixed;
1491
- inset: 0;
1492
- overflow: auto;
1493
- }
1494
-
1495
- .drawer.left {
1496
- right: auto;
1497
- }
1498
-
1499
- @media (prefers-reduced-motion: no-preference) {
1500
- .drawer.left {
1501
- --dialog-starting-transform: translateX(-16px);
1502
- --dialog-ending-transform: translateX(-16px);
1503
- }
1504
- }
1505
-
1506
- .drawer.top {
1507
- bottom: auto;
1508
- }
1509
-
1510
- @media (prefers-reduced-motion: no-preference) {
1511
- .drawer.top {
1512
- --dialog-starting-transform: translateY(-16px);
1513
- --dialog-ending-transform: translateY(-16px);
1514
- }
1515
- }
1516
-
1517
- .drawer.right {
1518
- left: auto;
1519
- }
1520
-
1521
- @media (prefers-reduced-motion: no-preference) {
1522
- .drawer.right {
1523
- --dialog-starting-transform: translateX(16px);
1524
- --dialog-ending-transform: translateX(16px);
1525
- }
1526
- }
1527
-
1528
- .drawer.bottom {
1529
- top: auto;
1530
- }
1531
-
1532
- @media (prefers-reduced-motion: no-preference) {
1533
- .drawer.bottom {
1534
- --dialog-starting-transform: translateY(16px);
1535
- --dialog-ending-transform: translateY(16px);
1536
- }
1537
- }
1538
-
1539
- .drawer.top, .drawer.bottom {
1540
- width: 100dvw;
1541
- max-width: unset;
1542
- height: auto;
1543
- min-height: min(100dvh, 250px);
1544
- max-height: 100dvh;
1545
- }
1546
-
1547
- :is(.drawer.top, .drawer.bottom).small {
1548
- height: 300px;
1549
- }
1550
-
1551
- :is(.drawer.top, .drawer.bottom).medium {
1552
- height: 450px;
1553
- }
1554
-
1555
- :is(.drawer.top, .drawer.bottom).large {
1556
- height: 600px;
1557
- }
1558
-
1559
- .drawer.left, .drawer.right {
1560
- height: 100dvh;
1561
- max-height: unset;
1562
- width: auto;
1563
- min-width: min(100dvw, 300px);
1564
- max-width: 100dvw;
1565
- }
1566
-
1567
- :is(.drawer.left, .drawer.right).small {
1568
- width: 350px;
1569
- }
1570
-
1571
- :is(.drawer.left, .drawer.right).medium {
1572
- width: 450px;
1573
- }
1574
-
1575
- :is(.drawer.left, .drawer.right).large {
1576
- width: 700px;
1577
- }
1578
-
1579
- .drawer-header {
1580
- font-size: var(--font-size-l);
1581
- }
1582
-
1583
- .drawer-body {
1584
- height: 100%;
1585
- }
1586
-
1587
- .drawer-footer {
1588
- padding: var(--space-xs);
1589
- gap: var(--space-xs);
1590
- flex-shrink: 0;
1591
- justify-content: flex-start;
1592
- margin: 0;
1593
- margin-block-start: auto;
1594
- display: flex;
1595
- }
1596
-
1597
- .drawer-footer > * {
1598
- width: 100%;
1599
- }
1600
-
1601
- .field {
1602
- --field-gap: var(--space-2xs);
1603
- --field-padding: .5em;
1604
- --field-radius: var(--radius-m);
1605
- gap: var(--field-gap);
1606
- color: var(--color-body-text);
1607
- line-height: 1;
1608
- font-weight: var(--font-weight-semibold);
1609
- font-size: var(--font-size-m);
1610
- font-family: var(--font-family-body);
1611
- flex-direction: column;
1612
- transition-property: color, box-shadow;
1613
- transition-duration: .2s;
1614
- transition-timing-function: ease;
1615
- display: inline-flex;
1616
- }
1617
-
1618
- .field.compact, .fieldset.compact .field {
1619
- --field-gap: calc(.9 * var(--space-2xs));
1620
- --field-padding: .33em;
1621
- --field-radius: var(--radius-s);
1622
- font-size: calc(.9 * var(--font-size-m));
1623
- }
1624
-
1625
- .field:focus-within {
1626
- color: var(--color-brand-5);
1627
- }
1628
-
1629
- .field:has(:user-invalid, .field[aria-invalid="true"]) {
1630
- color: var(--color-red-5);
1631
- }
1632
-
1633
- .field:has(:user-invalid, .field[aria-invalid="true"]) .error-message {
1634
- opacity: 1;
1635
- }
1636
-
1637
- .field:has([readonly]):focus-within {
1638
- color: var(--color-gray-5);
1639
- }
1640
-
1641
- .field:user-invalid {
1642
- color: var(--color-red-5);
1643
- }
1644
-
1645
- .field input:not([type="button"], [type="checkbox"], [type="file"], [type="hidden"], [type="image"], [type="radio"], [type="range"], [type="reset"], [type="submit"]), .field select, .field textarea {
1646
- color: var(--color-body-text);
1647
- border: var(--border-s) solid var(--color-outline);
1648
- padding: var(--field-padding);
1649
- border-radius: var(--field-radius);
1650
- background-color: var(--lightningcss-light, #fff) var(--lightningcss-dark, #000);
1651
- font-family: inherit;
1652
- font-size: 1em;
1653
- transition-property: color, box-shadow, border-color;
1654
- transition-duration: .2s;
1655
- transition-timing-function: ease;
1656
- }
1657
-
1658
- :is(.field input:not([type="button"], [type="checkbox"], [type="file"], [type="hidden"], [type="image"], [type="radio"], [type="range"], [type="reset"], [type="submit"]), .field select, .field textarea):focus {
1659
- border-color: var(--color-brand-5);
1660
- box-shadow: 0 0 0 .1em var(--color-brand-5), 0 0 0 calc(.2em + var(--border-s)) var(--color-brand-transparent);
1661
- outline: 0;
1662
- }
1663
-
1664
- :is(.field input:not([type="button"], [type="checkbox"], [type="file"], [type="hidden"], [type="image"], [type="radio"], [type="range"], [type="reset"], [type="submit"]), .field select, .field textarea):disabled {
1665
- opacity: var(--opacity-disabled);
1666
- cursor: not-allowed;
1667
- }
1668
-
1669
- :is(.field input:not([type="button"], [type="checkbox"], [type="file"], [type="hidden"], [type="image"], [type="radio"], [type="range"], [type="reset"], [type="submit"]), .field select, .field textarea)[readonly] {
1670
- border-style: dashed;
1671
- }
1672
-
1673
- :is(.field input:not([type="button"], [type="checkbox"], [type="file"], [type="hidden"], [type="image"], [type="radio"], [type="range"], [type="reset"], [type="submit"]), .field select, .field textarea)[readonly]:focus {
1674
- border-style: solid;
1675
- border-color: var(--color-gray-5);
1676
- box-shadow: 0 0 0 .1em var(--color-gray-5), 0 0 0 calc(.2em + var(--border-s)) var(--color-gray-transparent);
1677
- outline: 0;
1678
- }
1679
-
1680
- :is(:is(.field input:not([type="button"], [type="checkbox"], [type="file"], [type="hidden"], [type="image"], [type="radio"], [type="range"], [type="reset"], [type="submit"]), .field select, .field textarea):user-invalid, :is(.field input:not([type="button"], [type="checkbox"], [type="file"], [type="hidden"], [type="image"], [type="radio"], [type="range"], [type="reset"], [type="submit"]), .field select, .field textarea)[aria-invalid="true"]) {
1681
- border-color: var(--color-red-5);
1682
- box-shadow: 0 0 0 .1em var(--color-red-5);
1683
- }
1684
-
1685
- :is(:is(.field input:not([type="button"], [type="checkbox"], [type="file"], [type="hidden"], [type="image"], [type="radio"], [type="range"], [type="reset"], [type="submit"]), .field select, .field textarea):user-invalid, :is(.field input:not([type="button"], [type="checkbox"], [type="file"], [type="hidden"], [type="image"], [type="radio"], [type="range"], [type="reset"], [type="submit"]), .field select, .field textarea)[aria-invalid="true"]):focus {
1686
- border-color: var(--color-red-5);
1687
- box-shadow: 0 0 0 .1em var(--color-red-5), 0 0 0 calc(.2em + var(--border-s)) var(--color-red-transparent);
1688
- outline: 0;
1689
- }
1690
-
1691
- .field input[type="color"] {
1692
- cursor: pointer;
1693
- block-size: auto;
1694
- inline-size: auto;
1695
- }
1696
-
1697
- .field input[type="color"]::-webkit-color-swatch-wrapper {
1698
- padding: 0;
1699
- }
1700
-
1701
- .field input[type="color"]::-webkit-color-swatch {
1702
- border-radius: var(--radius-s);
1703
- border: 0;
1704
- block-size: 1em;
1705
- inline-size: 1.62em;
1706
- }
1707
-
1708
- .field input[type="color"]::-moz-color-swatch {
1709
- border-radius: var(--radius-s);
1710
- border: 0;
1711
- block-size: 1em;
1712
- inline-size: 1.62em;
1713
- }
1714
-
1715
- .field select {
1716
- background-image: var(--lightningcss-light, url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-linecap='round' stroke-linejoin='round' stroke-width='1' d='m6 9l6 6l6-6' /%3E%3C/svg%3E")) var(--lightningcss-dark, url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='white' stroke-linecap='round' stroke-linejoin='round' stroke-width='1' d='m6 9l6 6l6-6' /%3E%3C/svg%3E"));
1717
- cursor: pointer;
1718
- appearance: none;
1719
- background-position: right .25em center;
1720
- background-repeat: no-repeat;
1721
- background-size: auto 75%;
1722
- padding-inline-end: calc(2 * var(--space-2xs) + 1em);
1723
- }
1724
-
1725
- .field select:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
1726
- background-position: .25em 50%;
1727
- }
1728
-
1729
- .field .help-text {
1730
- color: var(--color-body-text-alt);
1731
- font-size: .9em;
1732
- font-weight: var(--font-weight-normal);
1733
- margin: -.25em 0 0;
1734
- position: relative;
1735
- }
1736
-
1737
- .field .error-message {
1738
- opacity: 0;
1739
- font-size: .9em;
1740
- font-weight: var(--font-weight-semibold);
1741
- border: 0;
1742
- align-items: center;
1743
- gap: 2px;
1744
- margin: 0;
1745
- padding: 0;
1746
- transition: opacity .2s;
1747
- display: flex;
1748
- }
1749
-
1750
- .field .error-message:before {
1751
- content: "";
1752
- background-color: currentColor;
1753
- width: 1.2em;
1754
- height: 1.2em;
1755
- display: inline-block;
1756
- -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M256 48C141.31 48 48 141.31 48 256s93.31 208 208 208 208-93.31 208-208S370.69 48 256 48zm75.31 260.69a16 16 0 11-22.62 22.62L256 278.63l-52.69 52.68a16 16 0 01-22.62-22.62L233.37 256l-52.68-52.69a16 16 0 0122.62-22.62L256 233.37l52.69-52.68a16 16 0 0122.62 22.62L278.63 256z' /%3E%3C/svg%3E");
1757
- mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M256 48C141.31 48 48 141.31 48 256s93.31 208 208 208 208-93.31 208-208S370.69 48 256 48zm75.31 260.69a16 16 0 11-22.62 22.62L256 278.63l-52.69 52.68a16 16 0 01-22.62-22.62L233.37 256l-52.68-52.69a16 16 0 0122.62-22.62L256 233.37l52.69-52.68a16 16 0 0122.62 22.62L278.63 256z' /%3E%3C/svg%3E");
1758
- -webkit-mask-position: center;
1759
- mask-position: center;
1760
- -webkit-mask-size: contain;
1761
- mask-size: contain;
1762
- -webkit-mask-repeat: no-repeat;
1763
- mask-repeat: no-repeat;
1764
- }
1765
-
1766
- .field .input-group {
1767
- flex-direction: row;
1768
- align-items: stretch;
1769
- display: flex;
1770
- }
1771
-
1772
- .field .input-group > * {
1773
- z-index: 1;
1774
- border-radius: 0 !important;
1775
- }
1776
-
1777
- .field .input-group > :first-child {
1778
- border-start-start-radius: var(--field-radius) !important;
1779
- border-end-start-radius: var(--field-radius) !important;
1780
- }
1781
-
1782
- .field .input-group > :last-child {
1783
- border-start-end-radius: var(--field-radius) !important;
1784
- border-end-end-radius: var(--field-radius) !important;
1785
- }
1786
-
1787
- .field .input-group > :focus-visible {
1788
- z-index: 2;
1789
- }
1790
-
1791
- .field .input-group > :is(.prefix, .suffix, .action) {
1792
- -webkit-user-select: none;
1793
- user-select: none;
1794
- -webkit-user-drag: none;
1795
- font-weight: var(--font-weight-normal);
1796
- color: var(--color-gray-3);
1797
- background-color: var(--color-gray-9);
1798
- border: var(--border-s) solid var(--color-outline);
1799
- padding: var(--field-padding) calc(2 * var(--field-padding));
1800
- justify-content: center;
1801
- align-items: center;
1802
- font-size: .9em;
1803
- display: flex;
1804
- }
1805
-
1806
- .field .input-group > :is(.prefix, .suffix, .action) :is(img, svg) {
1807
- width: auto;
1808
- height: 1.15em;
1809
- }
1810
-
1811
- .field .input-group > .prefix {
1812
- border-inline-end: 0;
1813
- }
1814
-
1815
- .field .input-group > .suffix {
1816
- border-inline-start: 0;
1817
- }
1818
-
1819
- .field .input-group > .action {
1820
- cursor: pointer;
1821
- color: var(--color-brand-3);
1822
- border-inline-start: 0;
1823
- transition-property: box-shadow, background-color;
1824
- transition-duration: .2s;
1825
- transition-timing-function: ease;
1826
- }
1827
-
1828
- .field .input-group > .action:hover {
1829
- background-color: var(--color-gray-8);
1830
- }
1831
-
1832
- .field .input-group > .action:active {
1833
- background-color: var(--color-gray-7);
1834
- }
1835
-
1836
- .field .input-group > .action:focus-visible {
1837
- border-color: var(--color-brand-5);
1838
- border-inline-start-width: var(--border-s);
1839
- box-shadow: 0 0 0 .1em var(--color-brand-5), 0 0 0 calc(.2em + var(--border-s)) var(--color-brand-transparent);
1840
- border-inline-start-style: solid;
1841
- outline: 0;
1842
- }
1843
-
1844
- .field .input-group > :is(input, select, textarea) {
1845
- width: 100%;
1846
- }
1847
-
1848
- .field .input-group > :is(input, select, textarea):has( ~ .action:focus-visible) {
1849
- border-inline-end-width: 0;
1850
- }
1851
-
1852
- input[type="checkbox"], input[type="radio"] {
1853
- accent-color: var(--color-brand-5);
1854
- }
1855
-
1856
- fieldset.fieldset {
1857
- border: var(--border-s) solid var(--color-outline);
1858
- border-radius: var(--radius-s);
1859
- background-color: var(--color-body);
1860
- color: var(--color-body-text);
1861
- }
1862
-
1863
- fieldset.fieldset legend {
1864
- font-family: var(--font-family-heading);
1865
- font-weight: var(--font-weight-bold);
1866
- transition: color .2s;
1867
- }
1868
-
1869
- fieldset.fieldset:focus-within legend {
1870
- color: var(--color-brand-5);
1871
- }
1872
-
1873
- .form {
1874
- max-width: 60ch;
1875
- margin-inline-end: auto;
1876
- }
1877
-
1878
- .flow, .stack, .separate, .space {
1879
- gap: var(--space-s);
1880
- display: flex !important;
1881
- }
1882
-
1883
- :is(.flow, .stack, .separate, .space).densest {
1884
- gap: var(--space-3xs);
1885
- }
1886
-
1887
- :is(.flow, .stack, .separate, .space).denser {
1888
- gap: var(--space-2xs);
1889
- }
1890
-
1891
- :is(.flow, .stack, .separate, .space).dense {
1892
- gap: var(--space-xs);
1893
- }
1894
-
1895
- :is(.flow, .stack, .separate, .space).sparse {
1896
- gap: var(--space-m);
1897
- }
1898
-
1899
- :is(.flow, .stack, .separate, .space).sparser {
1900
- gap: var(--space-l);
1901
- }
1902
-
1903
- :is(.flow, .stack, .separate, .space).sparsest {
1904
- gap: var(--space-xl);
1905
- }
1906
-
1907
- :is(.flow, .stack, .separate, .space).horizontal, :is(.flow, .stack, .separate, .space).horizontally {
1908
- flex-direction: row;
1909
- }
1910
-
1911
- :is(.flow, .stack, .separate, .space).vertical, :is(.flow, .stack, .separate, .space).vertically {
1912
- flex-direction: column;
1913
- }
1914
-
1915
- .flow {
1916
- flex-wrap: wrap;
1917
- justify-content: start;
1918
- align-items: center;
1919
- }
1920
-
1921
- .stack {
1922
- flex-wrap: nowrap;
1923
- justify-content: start;
1924
- align-items: stretch;
1925
- }
1926
-
1927
- .separate {
1928
- flex-wrap: nowrap;
1929
- justify-content: space-between;
1930
- align-items: center;
1931
- }
1932
-
1933
- .space {
1934
- flex-wrap: wrap;
1935
- justify-content: space-evenly;
1936
- align-items: center;
1937
- }
1938
-
1939
- .heading-1, .heading-2, .heading-3, .heading-4, .heading-5, .heading-6, .markdown-output :is(h1, h2, h3, h4, h5, h6) {
1940
- font-family: var(--font-family-heading);
1941
- text-wrap: balance;
1942
- overflow-wrap: break-word;
1943
- margin-block: .75em .3em;
1944
- line-height: 1.15;
1945
- }
1946
-
1947
- .heading-1, .markdown-output h1 {
1948
- font-size: var(--font-size-4xl);
1949
- font-weight: var(--font-weight-black);
1950
- margin-block-start: 0;
1951
- }
1952
-
1953
- .app-content > :is(.heading-1, .markdown-output h1):first-of-type {
1954
- margin-block-start: 0;
1955
- }
1956
-
1957
- .heading-2, .markdown-output h2 {
1958
- font-size: var(--font-size-3xl);
1959
- font-weight: var(--font-weight-bold);
1960
- }
1961
-
1962
- .heading-3, .markdown-output h3 {
1963
- font-size: var(--font-size-2xl);
1964
- font-weight: var(--font-weight-bold);
1965
- }
1966
-
1967
- .heading-4, .markdown-output h4 {
1968
- font-size: var(--font-size-xl);
1969
- font-weight: var(--font-weight-semibold);
1970
- }
1971
-
1972
- .heading-5, .markdown-output h5 {
1973
- font-size: var(--font-size-l);
1974
- font-weight: var(--font-weight-semibold);
1975
- }
1976
-
1977
- .heading-6, .markdown-output h6 {
1978
- font-size: var(--font-size-m);
1979
- font-weight: var(--font-weight-bold);
1980
- }
1981
-
1982
- .highlight, .markdown-output mark {
1983
- background-color: var(--lightningcss-light, var(--color-yellow-8)) var(--lightningcss-dark, var(--color-yellow-7));
1984
- color: var(--lightningcss-light, var(--color-yellow-2)) var(--lightningcss-dark, var(--color-yellow-1));
1985
- print-color-adjust: exact;
1986
- }
1987
-
1988
- .highlight.removed, .markdown-output del {
1989
- background-color: var(--color-red-8);
1990
- color: var(--color-red-2);
1991
- -webkit-text-decoration-skip-ink: none;
1992
- text-decoration-skip-ink: none;
1993
- text-decoration-line: line-through;
1994
- text-decoration-thickness: var(--border-m);
1995
- -webkit-text-decoration-color: var(--color-red-4);
1996
- text-decoration-color: var(--color-red-4);
1997
- print-color-adjust: exact;
1998
- transition: text-decoration-color .15s;
1999
- }
2000
-
2001
- :is(.highlight.removed, .markdown-output del):hover {
2002
- text-decoration-color: #0000;
2003
- }
2004
-
2005
- .highlight.added, .markdown-output ins {
2006
- background-color: var(--color-green-8);
2007
- color: var(--color-green-2);
2008
- text-decoration-thickness: var(--border-m);
2009
- -webkit-text-decoration-color: var(--color-green-4);
2010
- text-decoration-color: var(--color-green-4);
2011
- text-underline-offset: .1em;
2012
- print-color-adjust: exact;
2013
- }
2014
-
2015
- .highlight.target {
2016
- background-color: var(--color-brand-8);
2017
- color: var(--lightningcss-light, var(--color-brand-2)) var(--lightningcss-dark, var(--color-brand-1));
2018
- print-color-adjust: exact;
2019
- }
2020
-
2021
- ::target-text {
2022
- background-color: var(--color-brand-8);
2023
- color: var(--lightningcss-light, var(--color-brand-2)) var(--lightningcss-dark, var(--color-brand-1));
2024
- print-color-adjust: exact;
2025
- }
2026
-
2027
- .link, .markdown-output a {
2028
- color: var(--color-sky-4);
2029
- font-weight: var(--font-weight-semibold);
2030
- text-decoration-line: underline;
2031
- -webkit-text-decoration-color: var(--color-sky-transparent);
2032
- text-decoration-color: var(--color-sky-transparent);
2033
- -webkit-text-decoration-skip-ink: all;
2034
- text-decoration-skip-ink: all;
2035
- text-decoration-thickness: var(--border-m);
2036
- text-underline-offset: .1em;
2037
- cursor: pointer;
2038
- transition: text-decoration-color .2s;
2039
- }
2040
-
2041
- :is(.link, .markdown-output a):is(:hover, .hover) {
2042
- text-decoration-color: currentColor;
2043
- }
2044
-
2045
- :is(.link, .markdown-output a):focus-visible {
2046
- outline-offset: 1px;
2047
- }
2048
-
2049
- [target="_blank"]:is(.link, .button, .markdown-output a):not(.no-external-icon):after {
2050
- content: "";
2051
- print-color-adjust: exact;
2052
- background-color: var(--color-gray-5);
2053
- vertical-align: baseline;
2054
- width: .85em;
2055
- height: .85em;
2056
- margin-left: .1em;
2057
- display: inline-block;
2058
- -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1em' height='1em' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23ffffff' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6m4-3h6v6m-11 5L21 3' /%3E%3C/svg%3E");
2059
- mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1em' height='1em' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23ffffff' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6m4-3h6v6m-11 5L21 3' /%3E%3C/svg%3E");
2060
- -webkit-mask-size: contain;
2061
- mask-size: contain;
2062
- -webkit-mask-repeat: no-repeat;
2063
- mask-repeat: no-repeat;
2064
- }
2065
-
2066
- a.button[target="_blank"]:not(.no-external-icon):after {
2067
- background-color: currentColor;
2068
- }
2069
-
2070
- meter.meter {
2071
- appearance: none;
2072
- block-size: 1em;
2073
- inline-size: 100%;
2074
- }
2075
-
2076
- @supports selector(::-moz-meter-bar) {
2077
- meter.meter {
2078
- border-radius: var(--radius-s);
2079
- block-size: 1em;
2080
- inline-size: 100%;
2081
- box-shadow: inset 0 0 0 var(--border-s) var(--color-outline);
2082
- background: var(--color-gray-9);
2083
- box-sizing: border-box;
2084
- border: 0;
2085
- display: block;
2086
- overflow: clip;
2087
- }
2088
- }
2089
-
2090
- .meter::-webkit-meter-bar {
2091
- border-radius: var(--radius-s);
2092
- block-size: 1em;
2093
- inline-size: 100%;
2094
- box-shadow: inset 0 0 0 var(--border-s) var(--color-outline);
2095
- background: var(--color-gray-9);
2096
- box-sizing: border-box;
2097
- border: 0;
2098
- display: block;
2099
- overflow: clip;
2100
- }
2101
-
2102
- .meter::-webkit-meter-optimum-value {
2103
- border-radius: var(--radius-s);
2104
- border: var(--border-s) solid transparent;
2105
- box-sizing: border-box;
2106
- }
2107
-
2108
- .meter::-webkit-meter-suboptimum-value {
2109
- border-radius: var(--radius-s);
2110
- border: var(--border-s) solid transparent;
2111
- box-sizing: border-box;
2112
- }
2113
-
2114
- .meter::-webkit-meter-even-less-good-value {
2115
- border-radius: var(--radius-s);
2116
- border: var(--border-s) solid transparent;
2117
- box-sizing: border-box;
2118
- }
2119
-
2120
- .meter::-webkit-meter-inner-element {
2121
- display: inline-block;
2122
- position: relative;
2123
- }
2124
-
2125
- .meter::-moz-meter-bar {
2126
- border-radius: var(--radius-s);
2127
- border: var(--border-s) solid transparent;
2128
- box-sizing: border-box;
2129
- }
2130
-
2131
- .meter::-webkit-meter-optimum-value {
2132
- background: var(--color-green-6);
2133
- border-color: var(--color-green-5);
2134
- }
2135
-
2136
- .meter:-moz-meter-optimum::-moz-meter-bar {
2137
- background: var(--color-green-6);
2138
- border-color: var(--color-green-5);
2139
- }
2140
-
2141
- .meter::-webkit-meter-suboptimum-value {
2142
- background: var(--lightningcss-light, var(--color-yellow-7)) var(--lightningcss-dark, var(--color-yellow-4));
2143
- border-color: var(--lightningcss-light, var(--color-yellow-6)) var(--lightningcss-dark, var(--color-yellow-3));
2144
- }
2145
-
2146
- .meter:-moz-meter-sub-optimum::-moz-meter-bar {
2147
- background: var(--lightningcss-light, var(--color-yellow-7)) var(--lightningcss-dark, var(--color-yellow-4));
2148
- border-color: var(--lightningcss-light, var(--color-yellow-6)) var(--lightningcss-dark, var(--color-yellow-3));
2149
- }
2150
-
2151
- .meter::-webkit-meter-even-less-good-value {
2152
- background: var(--color-red-6);
2153
- border-color: var(--color-red-5);
2154
- }
2155
-
2156
- .meter:-moz-meter-sub-sub-optimum::-moz-meter-bar {
2157
- background: var(--color-red-6);
2158
- border-color: var(--color-red-5);
2159
- }
2160
-
2161
- .modal {
2162
- max-height: calc(100svh - 4 * var(--space-body));
2163
- max-width: calc(100svw - 4 * var(--space-body));
2164
- margin: auto;
2165
- }
2166
-
2167
- .modal.small {
2168
- width: 400px;
2169
- }
2170
-
2171
- .modal.medium {
2172
- width: 650px;
2173
- }
2174
-
2175
- .modal.large {
2176
- width: 900px;
2177
- }
2178
-
2179
- .modal-footer {
2180
- padding: var(--space-xs);
2181
- gap: var(--space-2xs);
2182
- background-color: var(--color-body);
2183
- border-block-start: var(--border-s) solid var(--color-outline);
2184
- flex-shrink: 0;
2185
- justify-content: flex-start;
2186
- margin: 0;
2187
- display: flex;
2188
- }
2189
-
2190
- @media screen and (max-width: 500px) {
2191
- .modal-footer {
2192
- flex-direction: column;
2193
- justify-content: stretch;
2194
- width: 100%;
2195
- }
2196
- }
2197
-
2198
- .modal-footer .button:not(.small, .medium, .large) {
2199
- font-size: .9rem;
2200
- }
2201
-
2202
- @keyframes indeterminate-progress {
2203
- from {
2204
- opacity: .2;
2205
- }
2206
-
2207
- to {
2208
- opacity: .8;
2209
- }
2210
- }
2211
-
2212
- progress.progress {
2213
- appearance: none;
2214
- block-size: 1em;
2215
- inline-size: 100%;
2216
- }
2217
-
2218
- @supports selector(::-moz-progress-bar) {
2219
- progress.progress {
2220
- border-radius: var(--radius-s);
2221
- block-size: 1em;
2222
- inline-size: 100%;
2223
- box-shadow: inset 0 0 0 var(--border-s) var(--color-outline);
2224
- background: var(--color-gray-9);
2225
- box-sizing: border-box;
2226
- border: 0;
2227
- display: block;
2228
- overflow: clip;
2229
- }
2230
- }
2231
-
2232
- .progress::-webkit-progress-bar {
2233
- border-radius: var(--radius-s);
2234
- block-size: 1em;
2235
- inline-size: 100%;
2236
- box-shadow: inset 0 0 0 var(--border-s) var(--color-outline);
2237
- background: var(--color-gray-9);
2238
- box-sizing: border-box;
2239
- border: 0;
2240
- display: block;
2241
- overflow: clip;
2242
- }
2243
-
2244
- .progress::-webkit-progress-value {
2245
- border-radius: var(--radius-s);
2246
- border: var(--border-s) solid transparent;
2247
- box-sizing: border-box;
2248
- background: var(--color-blue-6);
2249
- border-color: var(--color-blue-5);
2250
- }
2251
-
2252
- .progress::-moz-progress-bar {
2253
- border-radius: var(--radius-s);
2254
- border: var(--border-s) solid transparent;
2255
- box-sizing: border-box;
2256
- background: var(--color-blue-6);
2257
- border-color: var(--color-blue-5);
2258
- }
2259
-
2260
- .progress:indeterminate::-webkit-progress-value {
2261
- background: var(--color-blue-6);
2262
- border-color: var(--color-blue-5);
2263
- opacity: .5;
2264
- animation: 1s linear infinite alternate indeterminate-progress;
2265
- inline-size: 100% !important;
2266
- }
2267
-
2268
- .progress:indeterminate::-moz-progress-bar {
2269
- background: var(--color-blue-6);
2270
- border-color: var(--color-blue-5);
2271
- opacity: .5;
2272
- animation: 1s linear infinite alternate indeterminate-progress;
2273
- inline-size: 100% !important;
2274
- }
2275
-
2276
- .quote, .markdown-output blockquote {
2277
- color: var(--color-body-text-alt);
2278
- border-inline-start: var(--border-l) solid var(--color-gray-transparent);
2279
- padding: var(--space-3xs);
2280
- line-height: 1.25;
2281
- font-family: var(--font-family-body);
2282
- font-size: var(--font-size-m);
2283
- font-weight: var(--font-weight-normal);
2284
- margin: 0;
2285
- padding-inline-start: var(--space-xs);
2286
- display: block;
2287
- position: relative;
2288
- }
2289
-
2290
- :is(.quote, .markdown-output blockquote) footer {
2291
- font-size: var(--font-size-s);
2292
- font-style: initial;
2293
- color: var(--color-body-text);
2294
- font-weight: var(--font-weight-semibold);
2295
- margin-block-start: .5em;
2296
- }
2297
-
2298
- :is(.quote, .markdown-output blockquote) footer cite {
2299
- font-weight: var(--font-weight-normal);
2300
- font-style: italic;
2301
- }
2302
-
2303
- @keyframes skeleton-pulse-light {
2304
- from {
2305
- opacity: .14;
2306
- }
2307
-
2308
- to {
2309
- opacity: .21;
2310
- }
2311
- }
2312
-
2313
- @keyframes skeleton-pulse-dark {
2314
- from {
2315
- opacity: .28;
2316
- }
2317
-
2318
- to {
2319
- opacity: .36;
2320
- }
2321
- }
2322
-
2323
- .skeleton {
2324
- print-color-adjust: exact;
2325
- border-radius: var(--radius-s) !important;
2326
- background-color: var(--color-gray-5) !important;
2327
- box-shadow: 0 !important;
2328
- pointer-events: none !important;
2329
- color: #0000 !important;
2330
- background-image: none !important;
2331
- border: 0 !important;
2332
- outline: 0 !important;
2333
- animation: 1s infinite alternate skeleton-pulse-light !important;
2334
- -webkit-mask-image: none !important;
2335
- mask-image: none !important;
2336
- }
2337
-
2338
- .skeleton.paragraph, .skeleton.heading {
2339
- inline-size: 100%;
2340
- }
2341
-
2342
- .skeleton:is(.paragraph, .heading, .chip, .card-title):before {
2343
- content: ".";
2344
- }
2345
-
2346
- .skeleton:is(.button, .chip):empty {
2347
- min-inline-size: 5em;
2348
- }
2349
-
2350
- .skeleton.card-title {
2351
- inline-size: 40%;
2352
- overflow: hidden;
2353
- }
2354
-
2355
- .skeleton:before, .skeleton:after, .skeleton > * {
2356
- visibility: hidden !important;
2357
- }
2358
-
2359
- @media (prefers-color-scheme: dark) {
2360
- .skeleton {
2361
- animation-name: skeleton-pulse-dark !important;
2362
- }
2363
- }
2364
-
2365
- .skip-link {
2366
- z-index: 100;
2367
- top: var(--space-body);
2368
- left: var(--space-body);
2369
- background-color: var(--color-brand-5);
2370
- padding: var(--space-xs);
2371
- border-radius: var(--radius-m);
2372
- border: .25em solid var(--color-brand-4);
2373
- color: var(--color-body-alt);
2374
- font-weight: var(--font-weight-bold);
2375
- font-family: var(--font-family-body);
2376
- font-size: var(--font-size-m);
2377
- box-shadow: var(--shadow-l), 0 0 0 .2em var(--color-brand-transparent);
2378
- vertical-align: middle;
2379
- opacity: .25;
2380
- pointer-events: none;
2381
- outline: 0;
2382
- line-height: 1;
2383
- text-decoration: none;
2384
- transition: opacity .3s;
2385
- display: inline-block;
2386
- position: fixed;
2387
- }
2388
-
2389
- .skip-link kbd {
2390
- font-weight: initial;
2391
- background-color: var(--color-brand-4) !important;
2392
- color: inherit !important;
2393
- border: 0 !important;
2394
- margin-inline-start: var(--space-2xs) !important;
2395
- font-size: 1.2em !important;
2396
- }
2397
-
2398
- .skip-link:focus, .skip-link.static {
2399
- opacity: 1;
2400
- }
2401
-
2402
- .skip-link.static {
2403
- pointer-events: unset;
2404
- position: static;
2405
- }
2406
-
2407
- input[type="range"].slider {
2408
- appearance: none;
2409
- cursor: pointer;
2410
- background: none;
2411
- block-size: 1.25em;
2412
- font-size: 1rem;
2413
- }
2414
-
2415
- @media (pointer: coarse) {
2416
- input[type="range"].slider {
2417
- font-size: 1.5rem;
2418
- }
2419
- }
2420
-
2421
- input[type="range"].slider:disabled {
2422
- opacity: var(--opacity-disabled);
2423
- cursor: not-allowed;
2424
- }
2425
-
2426
- input[type="range"].slider:focus-visible {
2427
- outline: 0;
2428
- }
2429
-
2430
- input[type="range"].slider:focus-visible::-webkit-slider-thumb {
2431
- border-color: var(--color-brand-5);
2432
- box-shadow: 0 0 0 .2em var(--color-brand-transparent);
2433
- }
2434
-
2435
- input[type="range"].slider:focus-visible::-moz-range-thumb {
2436
- border-color: var(--color-brand-5);
2437
- box-shadow: 0 0 0 .2em var(--color-brand-transparent);
2438
- }
2439
-
2440
- input[type="range"].slider:enabled:active::-webkit-slider-thumb {
2441
- border-color: var(--color-brand-5);
2442
- }
2443
-
2444
- @media screen and (-webkit-min-device-pixel-ratio: 2), screen and (min-resolution: 2dppx) {
2445
- input[type="range"].slider:enabled:active::-webkit-slider-thumb:active {
2446
- transform: scale(.9);
2447
- }
2448
- }
2449
-
2450
- input[type="range"].slider:enabled:active::-moz-range-thumb {
2451
- border-color: var(--color-brand-5);
2452
- }
2453
-
2454
- @media screen and (-webkit-min-device-pixel-ratio: 2), screen and (min-resolution: 2dppx) {
2455
- input[type="range"].slider:enabled:active::-moz-range-thumb:active {
2456
- transform: scale(.9);
2457
- }
2458
- }
2459
-
2460
- input[type="range"].slider::-webkit-slider-runnable-track {
2461
- border-radius: var(--radius-full);
2462
- background-color: var(--lightningcss-light, var(--color-gray-8)) var(--lightningcss-dark, var(--color-gray-6));
2463
- print-color-adjust: exact;
2464
- block-size: .25em;
2465
- inline-size: 100%;
2466
- }
2467
-
2468
- input[type="range"].slider::-moz-range-track {
2469
- border-radius: var(--radius-full);
2470
- background-color: var(--lightningcss-light, var(--color-gray-8)) var(--lightningcss-dark, var(--color-gray-6));
2471
- print-color-adjust: exact;
2472
- block-size: .25em;
2473
- inline-size: 100%;
2474
- }
2475
-
2476
- input[type="range"].slider::-webkit-slider-thumb {
2477
- border-radius: var(--radius-full);
2478
- width: 1.25em;
2479
- height: 1.25em;
2480
- box-shadow: var(--shadow-s);
2481
- border: var(--border-s) solid var(--color-outline);
2482
- appearance: none;
2483
- background-color: #fff;
2484
- margin-block-start: -.5em;
2485
- transition-property: border-color, box-shadow, transform;
2486
- transition-duration: .2s;
2487
- transition-timing-function: ease;
2488
- }
2489
-
2490
- input[type="range"].slider::-moz-range-thumb {
2491
- border-radius: var(--radius-full);
2492
- width: 1.25em;
2493
- height: 1.25em;
2494
- box-shadow: var(--shadow-s);
2495
- border: var(--border-s) solid var(--color-outline);
2496
- background-color: #fff;
2497
- transition-property: border-color, box-shadow, transform;
2498
- transition-duration: .2s;
2499
- transition-timing-function: ease;
2500
- }
2501
-
2502
- label.switch {
2503
- cursor: pointer;
2504
- inline-size: 100%;
2505
- font-weight: var(--font-weight-semibold);
2506
- justify-content: space-between;
2507
- align-items: center;
2508
- gap: var(--space-3xs);
2509
- font-size: var(--font-size-m);
2510
- font-family: var(--font-family-body);
2511
- display: flex;
2512
- }
2513
-
2514
- label.switch.small {
2515
- font-size: var(--font-size-s);
2516
- }
2517
-
2518
- input[type="checkbox"].switch, label.switch input[type="checkbox"] {
2519
- print-color-adjust: exact;
2520
- appearance: none;
2521
- border-radius: var(--radius-full);
2522
- background-color: var(--lightningcss-light, var(--color-gray-8)) var(--lightningcss-dark, var(--color-gray-5));
2523
- border: .1em solid var(--color-gray-7);
2524
- cursor: pointer;
2525
- flex: none;
2526
- block-size: 1.8em;
2527
- inline-size: 3em;
2528
- font-size: 1rem;
2529
- transition-property: background-color, box-shadow, border-color;
2530
- transition-duration: .2s;
2531
- transition-timing-function: ease;
2532
- position: relative;
2533
- }
2534
-
2535
- :is(input[type="checkbox"].switch, label.switch input[type="checkbox"]):after {
2536
- content: "";
2537
- border-radius: var(--radius-full);
2538
- width: 1.4em;
2539
- height: 1.4em;
2540
- box-shadow: var(--shadow-s);
2541
- background-color: #fff;
2542
- transition-property: border-color, transform;
2543
- transition-duration: .2s;
2544
- transition-timing-function: ease;
2545
- position: absolute;
2546
- inset-block-start: .1em;
2547
- inset-inline-start: .1em;
2548
- transform: translateX(0);
2549
- }
2550
-
2551
- :is(input[type="checkbox"].switch, label.switch input[type="checkbox"]):disabled {
2552
- opacity: var(--opacity-disabled);
2553
- cursor: not-allowed;
2554
- }
2555
-
2556
- :is(input[type="checkbox"].switch, label.switch input[type="checkbox"]):is(:focus-visible, .focus) {
2557
- border-color: var(--color-gray-6);
2558
- box-shadow: 0 0 0 .2em var(--color-gray-transparent);
2559
- outline: 0;
2560
- }
2561
-
2562
- :is(input[type="checkbox"].switch, label.switch input[type="checkbox"]):checked {
2563
- background-color: var(--lightningcss-light, var(--color-brand-6)) var(--lightningcss-dark, var(--color-brand-5));
2564
- border-color: var(--lightningcss-light, var(--color-brand-5)) var(--lightningcss-dark, var(--color-brand-6));
2565
- }
2566
-
2567
- :is(input[type="checkbox"].switch, label.switch input[type="checkbox"]):checked:after {
2568
- transform: translateX(1.2em);
2569
- }
2570
-
2571
- :is(input[type="checkbox"].switch, label.switch input[type="checkbox"]):checked:is(:focus-visible, .focus) {
2572
- box-shadow: 0 0 0 .2em var(--color-brand-transparent);
2573
- }
2574
-
2575
- :is(input[type="checkbox"].switch, label.switch input[type="checkbox"]):is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)):checked:after {
2576
- transform: translateX(-1.2em);
2577
- }
2578
-
2579
- input[type="checkbox"].switch.small, label.switch.small input[type="checkbox"] {
2580
- font-size: .8rem;
2581
- }
2582
-
2583
- table.table, .markdown-output table {
2584
- --table-bg-odd: var(--color-body-alt);
2585
- --table-bg-even: var(--color-body);
2586
- --table-vertical-border: var(--border-s);
2587
- background-color: var(--color-body-alt);
2588
- border-collapse: separate;
2589
- border-spacing: 0;
2590
- font-size: var(--font-size-m);
2591
- border: var(--border-s) solid var(--color-outline);
2592
- border-radius: var(--radius-s);
2593
- color: var(--color-body-text);
2594
- font-family: var(--font-family-body);
2595
- font-weight: var(--font-weight-normal);
2596
- }
2597
-
2598
- :is(table.table, .markdown-output table).subtle {
2599
- --table-bg-odd: transparent;
2600
- --table-bg-even: transparent;
2601
- --table-vertical-border: 0;
2602
- border: 0;
2603
- }
2604
-
2605
- :is(table.table, .markdown-output table).dense :is(th, td) {
2606
- padding: var(--space-3xs) var(--space-2xs);
2607
- }
2608
-
2609
- :is(table.table, .markdown-output table).sparse :is(th, td) {
2610
- padding: var(--space-xs) var(--space-s);
2611
- }
2612
-
2613
- :is(table.table, .markdown-output table) caption {
2614
- font-family: var(--font-family-heading);
2615
- line-height: 1.15;
2616
- font-size: var(--font-size-l);
2617
- font-weight: var(--font-weight-semibold);
2618
- text-align: start;
2619
- margin: 0 0 var(--space-2xs);
2620
- }
2621
-
2622
- :is(table.table, .markdown-output table) th, :is(table.table, .markdown-output table) td {
2623
- padding: var(--space-2xs) var(--space-xs);
2624
- }
2625
-
2626
- :is(table.table, .markdown-output table) th, :is(table.table, .markdown-output table) tfoot td {
2627
- font-weight: var(--font-weight-bold);
2628
- font-family: var(--font-family-heading);
2629
- text-align: center;
2630
- }
2631
-
2632
- :is(table.table, .markdown-output table) th {
2633
- border-block-end: var(--border-m) solid var(--color-outline);
2634
- }
2635
-
2636
- :is(table.table, .markdown-output table) tfoot td {
2637
- border-block-start: var(--border-m) solid var(--color-outline);
2638
- }
2639
-
2640
- :is(table.table, .markdown-output table) td {
2641
- text-align: unset;
2642
- }
2643
-
2644
- :is(table.table, .markdown-output table) :is(th, tfoot td):not(:last-of-type) {
2645
- border-inline-end: var(--table-vertical-border) dashed var(--color-outline);
2646
- }
2647
-
2648
- :is(table.table, .markdown-output table) td:not(tfoot td, :last-of-type) {
2649
- border-inline-end: var(--table-vertical-border) solid var(--color-outline);
2650
- }
2651
-
2652
- :is(table.table, .markdown-output table) tr:not(:last-of-type) td {
2653
- border-block-end: var(--border-s) solid var(--color-outline);
2654
- }
2655
-
2656
- :is(table.table, .markdown-output table) tbody tr:nth-child(odd), :is(table.table, .markdown-output table) tbody:has(tr:last-of-type:nth-child(2n)) + tfoot tr {
2657
- background-color: var(--table-bg-even);
2658
- }
2659
-
2660
- :is(table.table, .markdown-output table) tbody tr:nth-child(2n) {
2661
- background-color: var(--table-bg-odd);
2662
- }
2663
-
2664
- .paragraph, .markdown-output p {
2665
- font-family: var(--font-family-body);
2666
- font-weight: var(--font-weight-normal);
2667
- text-wrap: pretty;
2668
- hanging-punctuation: first;
2669
- overflow-wrap: break-word;
2670
- margin: .75em 0;
2671
- line-height: 1.6;
2672
- }
2673
-
2674
- :is(.paragraph, .markdown-output p):first-child {
2675
- margin-block-start: 0;
2676
- }
2677
-
2678
- :is(.paragraph, .markdown-output p):last-child {
2679
- margin-block-end: 0;
2680
- }
2681
-
2682
- .abbreviation, .markdown-output abbr[title] {
2683
- text-decoration-line: underline;
2684
- text-decoration-style: dotted;
2685
- text-decoration-thickness: var(--border-m);
2686
- -webkit-text-decoration-color: var(--color-gray-6);
2687
- text-decoration-color: var(--color-gray-6);
2688
- text-underline-offset: .1em;
2689
- display: inline;
2690
- }
2691
-
2692
- .bold, .markdown-output strong, .markdown-output b {
2693
- font-weight: var(--font-weight-bold);
2694
- }
2695
-
2696
- .italic, .markdown-output em {
2697
- font-style: italic;
2698
- }
2699
-
2700
- .underline {
2701
- text-decoration-line: underline;
2702
- }
2703
-
2704
- .strikethrough, .markdown-output s {
2705
- text-decoration-line: line-through;
2706
- }
2707
-
2708
- .underline.strikethrough {
2709
- text-decoration-line: underline line-through;
2710
- }
2711
-
2712
- .small-text, .markdown-output small {
2713
- vertical-align: baseline;
2714
- font-size: .75em;
2715
- }
2716
-
2717
- .subscript, .superscript, .markdown-output sub, .markdown-output sup {
2718
- vertical-align: baseline;
2719
- font-size: .75em;
2720
- line-height: 0;
2721
- position: relative;
2722
- }
2723
-
2724
- .subscript, .markdown-output sub {
2725
- inset-block-end: -.25em;
2726
- }
2727
-
2728
- .superscript, .markdown-output sup {
2729
- inset-block-start: -.5em;
2730
- }
2731
-
2732
- .code, .markdown-output code {
2733
- font-family: var(--font-family-mono);
2734
- background-color: var(--color-gray-extra-transparent);
2735
- color: var(--color-gray-1);
2736
- border-radius: var(--radius-s);
2737
- padding: .25ch .5ch;
2738
- font-size: .9em;
2739
- display: inline;
2740
- }
2741
-
2742
- :is(.code, .markdown-output code).invert {
2743
- color: var(--color-gray-9);
2744
- }
2745
-
2746
- .link .code, .markdown-output a code {
2747
- -webkit-text-decoration: inherit;
2748
- text-decoration: inherit;
2749
- -webkit-text-decoration-color: inherit;
2750
- text-decoration-color: inherit;
2751
- text-decoration-thickness: inherit;
2752
- color: inherit;
2753
- }
2754
-
2755
- .key, .skip-link kbd, .markdown-output kbd {
2756
- border: var(--border-s) solid var(--color-gray-8);
2757
- border-radius: var(--radius-m);
2758
- font-size: .9em;
2759
- font-weight: var(--font-weight-semibold);
2760
- font-family: var(--font-family-body);
2761
- background-color: var(--color-gray-9);
2762
- color: var(--color-body-text);
2763
- border-bottom-width: 3px;
2764
- margin: 0 .25ch;
2765
- padding: 0 .5ch;
2766
- display: inline;
2767
- }
2768
-
2769
- .visually-hidden, .sr-only, .app-sidebar-toggle input, .skip-link:not(:focus, .static) {
2770
- clip: rect(1px, 1px, 1px, 1px);
2771
- clip-path: inset(50%);
2772
- width: 1px;
2773
- height: 1px;
2774
- margin: -1px;
2775
- padding: 0;
2776
- position: absolute;
2777
- overflow: hidden;
2778
- }
2779
-
2780
- dialog:is(.modal, .drawer)[open] {
2781
- transform: var(--dialog-open-transform);
2782
- opacity: var(--dialog-open-opacity);
2783
- display: flex;
2784
- }
2785
-
2786
- dialog:is(.modal, .drawer)[open]::backdrop {
2787
- opacity: var(--dialog-backdrop-open-opacity);
2788
- }
2789
-
2790
- dialog:is(.modal, .drawer) {
2791
- transform: var(--dialog-ending-transform);
2792
- opacity: var(--dialog-ending-opacity);
2793
- transition: transform .15s ease, opacity .15s ease, display .15s ease allow-discrete, overlay .15s ease allow-discrete;
2794
- }
2795
-
2796
- dialog:is(.modal, .drawer)::backdrop {
2797
- opacity: var(--dialog-backdrop-ending-opacity);
2798
- transition: transform .15s ease, opacity .15s ease, display .15s ease allow-discrete, overlay .15s ease allow-discrete;
2799
- }
2800
-
2801
- @starting-style {
2802
- dialog:is(.modal, .drawer)[open] {
2803
- transform: var(--dialog-starting-transform);
2804
- opacity: var(--dialog-starting-opacity);
2805
- }
2806
-
2807
- dialog:is(.modal, .drawer)[open]::backdrop {
2808
- opacity: var(--dialog-backdrop-starting-opacity);
2809
- }
2810
- }
2811
-
2812
- @starting-style {
2813
- .app > .sidebar {
2814
- opacity: 0;
2815
- }
2816
- }
2817
-
1
+ *,:before,:after{box-sizing:border-box;margin:0}:where(:focus-visible){outline:var(--border-m)solid var(--color-brand-5)}html{-webkit-text-size-adjust:none;-moz-text-size-adjust:none;text-size-adjust:none;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark}@media (prefers-color-scheme:dark){html{--lightningcss-light: ;--lightningcss-dark:initial}}body{background-color:var(--color-body);color:var(--color-body-text);margin:0}img,picture,video,iframe{max-width:100%;display:block}:root,::backdrop{--color-brand-1:var(--lightningcss-light,#08003b)var(--lightningcss-dark,#e5edff);--color-brand-2:var(--lightningcss-light,#190074)var(--lightningcss-dark,#bbc9ff);--color-brand-3:var(--lightningcss-light,#290fa3)var(--lightningcss-dark,#93a4ff);--color-brand-4:var(--lightningcss-light,#3c35cb)var(--lightningcss-dark,#6f7dff);--color-brand-5:#545be7;--color-brand-6:var(--lightningcss-light,#6f7dff)var(--lightningcss-dark,#3c35cb);--color-brand-7:var(--lightningcss-light,#93a4ff)var(--lightningcss-dark,#290fa3);--color-brand-8:var(--lightningcss-light,#bbc9ff)var(--lightningcss-dark,#190074);--color-brand-9:var(--lightningcss-light,#e5edff)var(--lightningcss-dark,#08003b);--color-brand-transparent:var(--lightningcss-light,#545be766)var(--lightningcss-dark,#545be780);--color-brand-extra-transparent:var(--lightningcss-light,#545be733)var(--lightningcss-dark,#545be759);--color-red-1:var(--lightningcss-light,#240000)var(--lightningcss-dark,#ffe3dc);--color-red-2:var(--lightningcss-light,#4d0000)var(--lightningcss-dark,#ffb4a5);--color-red-3:var(--lightningcss-light,#7a0000)var(--lightningcss-dark,#ff7c68);--color-red-4:var(--lightningcss-light,#a90000)var(--lightningcss-dark,#f0503d);--color-red-5:#cc2a1b;--color-red-6:var(--lightningcss-light,#f0503d)var(--lightningcss-dark,#a90000);--color-red-7:var(--lightningcss-light,#ff7c68)var(--lightningcss-dark,#7a0000);--color-red-8:var(--lightningcss-light,#ffb4a5)var(--lightningcss-dark,#4d0000);--color-red-9:var(--lightningcss-light,#ffe3dc)var(--lightningcss-dark,#240000);--color-red-transparent:var(--lightningcss-light,#cc2a1b66)var(--lightningcss-dark,#cc2a1b80);--color-red-extra-transparent:var(--lightningcss-light,#cc2a1b33)var(--lightningcss-dark,#cc2a1b59);--color-orange-1:var(--lightningcss-light,#1c0300)var(--lightningcss-dark,#ffe6cc);--color-orange-2:var(--lightningcss-light,#3e1200)var(--lightningcss-dark,#ffb87e);--color-orange-3:var(--lightningcss-light,#632500)var(--lightningcss-dark,#f98f3a);--color-orange-4:var(--lightningcss-light,#8b3a00)var(--lightningcss-dark,#d76f04);--color-orange-5:#b45100;--color-orange-6:var(--lightningcss-light,#d76f04)var(--lightningcss-dark,#8b3a00);--color-orange-7:var(--lightningcss-light,#f98f3a)var(--lightningcss-dark,#632500);--color-orange-8:var(--lightningcss-light,#ffb87e)var(--lightningcss-dark,#3e1200);--color-orange-9:var(--lightningcss-light,#ffe6cc)var(--lightningcss-dark,#1c0300);--color-orange-transparent:var(--lightningcss-light,#b4510066)var(--lightningcss-dark,#b4510080);--color-orange-extra-transparent:var(--lightningcss-light,#b4510033)var(--lightningcss-dark,#b4510059);--color-yellow-1:var(--lightningcss-light,#140900)var(--lightningcss-dark,#f8edc1);--color-yellow-2:var(--lightningcss-light,#2f1e00)var(--lightningcss-dark,#efcb72);--color-yellow-3:var(--lightningcss-light,#4e3700)var(--lightningcss-dark,#dfb22b);--color-yellow-4:var(--lightningcss-light,#7a5700)var(--lightningcss-dark,#c89808);--color-yellow-5:#a57c00;--color-yellow-6:var(--lightningcss-light,#c89808)var(--lightningcss-dark,#7a5700);--color-yellow-7:var(--lightningcss-light,#dfb22b)var(--lightningcss-dark,#4e3700);--color-yellow-8:var(--lightningcss-light,#efcb72)var(--lightningcss-dark,#2f1e00);--color-yellow-9:var(--lightningcss-light,#f8edc1)var(--lightningcss-dark,#140900);--color-yellow-transparent:var(--lightningcss-light,#a57c0066)var(--lightningcss-dark,#a57c0080);--color-yellow-extra-transparent:var(--lightningcss-light,#a57c0033)var(--lightningcss-dark,#a57c0059);--color-green-1:var(--lightningcss-light,#011000)var(--lightningcss-dark,#dafbc4);--color-green-2:var(--lightningcss-light,#0c2a00)var(--lightningcss-dark,#a4e472);--color-green-3:var(--lightningcss-light,#1d4600)var(--lightningcss-dark,#7dc53a);--color-green-4:var(--lightningcss-light,#2f6500)var(--lightningcss-dark,#5fa500);--color-green-5:#438500;--color-green-6:var(--lightningcss-light,#5fa500)var(--lightningcss-dark,#2f6500);--color-green-7:var(--lightningcss-light,#7dc53a)var(--lightningcss-dark,#1d4600);--color-green-8:var(--lightningcss-light,#a4e472)var(--lightningcss-dark,#0c2a00);--color-green-9:var(--lightningcss-light,#dafbc4)var(--lightningcss-dark,#011000);--color-green-transparent:var(--lightningcss-light,#43850066)var(--lightningcss-dark,#43850080);--color-green-extra-transparent:var(--lightningcss-light,#43850033)var(--lightningcss-dark,#43850059);--color-sky-1:var(--lightningcss-light,#001011)var(--lightningcss-dark,#caf9f8);--color-sky-2:var(--lightningcss-light,#002a2b)var(--lightningcss-dark,#76e2e2);--color-sky-3:var(--lightningcss-light,#004747)var(--lightningcss-dark,#00c8c9);--color-sky-4:var(--lightningcss-light,#006566)var(--lightningcss-dark,#00a7a8);--color-sky-5:#008586;--color-sky-6:var(--lightningcss-light,#00a7a8)var(--lightningcss-dark,#006566);--color-sky-7:var(--lightningcss-light,#00c8c9)var(--lightningcss-dark,#004747);--color-sky-8:var(--lightningcss-light,#76e2e2)var(--lightningcss-dark,#002a2b);--color-sky-9:var(--lightningcss-light,#caf9f8)var(--lightningcss-dark,#001011);--color-sky-transparent:var(--lightningcss-light,#00858666)var(--lightningcss-dark,#00858680);--color-sky-extra-transparent:var(--lightningcss-light,#00858633)var(--lightningcss-dark,#00858659);--color-blue-1:var(--lightningcss-light,#00003e)var(--lightningcss-dark,#ddf0ff);--color-blue-2:var(--lightningcss-light,#00007a)var(--lightningcss-dark,#a9cfff);--color-blue-3:var(--lightningcss-light,#002b97)var(--lightningcss-dark,#74adff);--color-blue-4:var(--lightningcss-light,#004abd)var(--lightningcss-dark,#3988ff);--color-blue-5:#1c69e3;--color-blue-6:var(--lightningcss-light,#3988ff)var(--lightningcss-dark,#004abd);--color-blue-7:var(--lightningcss-light,#74adff)var(--lightningcss-dark,#002b97);--color-blue-8:var(--lightningcss-light,#a9cfff)var(--lightningcss-dark,#00007a);--color-blue-9:var(--lightningcss-light,#ddf0ff)var(--lightningcss-dark,#00003e);--color-blue-transparent:var(--lightningcss-light,#1c69e366)var(--lightningcss-dark,#1c69e380);--color-blue-extra-transparent:var(--lightningcss-light,#1c69e333)var(--lightningcss-dark,#1c69e359);--color-purple-1:var(--lightningcss-light,#170029)var(--lightningcss-dark,#fbe4ff);--color-purple-2:var(--lightningcss-light,#370054)var(--lightningcss-dark,#e8b6ff);--color-purple-3:var(--lightningcss-light,#5a0085)var(--lightningcss-dark,#ce8dfc);--color-purple-4:var(--lightningcss-light,#7819a8)var(--lightningcss-dark,#b562ea);--color-purple-5:#9640ca;--color-purple-6:var(--lightningcss-light,#b562ea)var(--lightningcss-dark,#7819a8);--color-purple-7:var(--lightningcss-light,#ce8dfc)var(--lightningcss-dark,#5a0085);--color-purple-8:var(--lightningcss-light,#e8b6ff)var(--lightningcss-dark,#370054);--color-purple-9:var(--lightningcss-light,#fbe4ff)var(--lightningcss-dark,#170029);--color-purple-transparent:var(--lightningcss-light,#9640ca66)var(--lightningcss-dark,#9640ca80);--color-purple-extra-transparent:var(--lightningcss-light,#9640ca33)var(--lightningcss-dark,#9640ca59);--color-magenta-1:var(--lightningcss-light,#21000c)var(--lightningcss-dark,#ffe1f0);--color-magenta-2:var(--lightningcss-light,#480023)var(--lightningcss-dark,#ffadd0);--color-magenta-3:var(--lightningcss-light,#73003d)var(--lightningcss-dark,#fe7cb1);--color-magenta-4:var(--lightningcss-light,#9b0058)var(--lightningcss-dark,#e45193);--color-magenta-5:#c32775;--color-magenta-6:var(--lightningcss-light,#e45193)var(--lightningcss-dark,#9b0058);--color-magenta-7:var(--lightningcss-light,#fe7cb1)var(--lightningcss-dark,#73003d);--color-magenta-8:var(--lightningcss-light,#ffadd0)var(--lightningcss-dark,#480023);--color-magenta-9:var(--lightningcss-light,#ffe1f0)var(--lightningcss-dark,#21000c);--color-magenta-transparent:var(--lightningcss-light,#c3277566)var(--lightningcss-dark,#c3277580);--color-magenta-extra-transparent:var(--lightningcss-light,#c3277533)var(--lightningcss-dark,#c3277559);--color-gray-1:var(--lightningcss-light,#090b0f)var(--lightningcss-dark,#eceff4);--color-gray-2:var(--lightningcss-light,#202226)var(--lightningcss-dark,#cbced3);--color-gray-3:var(--lightningcss-light,#383b3f)var(--lightningcss-dark,#abaeb3);--color-gray-4:var(--lightningcss-light,#53555a)var(--lightningcss-dark,#8d8f94);--color-gray-5:#6f7276;--color-gray-6:var(--lightningcss-light,#8d8f94)var(--lightningcss-dark,#53555a);--color-gray-7:var(--lightningcss-light,#abaeb3)var(--lightningcss-dark,#383b3f);--color-gray-8:var(--lightningcss-light,#cbced3)var(--lightningcss-dark,#202226);--color-gray-9:var(--lightningcss-light,#eceff4)var(--lightningcss-dark,#090b0f);--color-gray-transparent:var(--lightningcss-light,#6f727666)var(--lightningcss-dark,#6f727680);--color-gray-extra-transparent:var(--lightningcss-light,#6f727633)var(--lightningcss-dark,#6f727659);--color-body:var(--lightningcss-light,#f9fafc)var(--lightningcss-dark,#14161a);--color-body-alt:var(--lightningcss-light,#fff)var(--lightningcss-dark,#010203);--color-body-text:var(--lightningcss-light,#030305)var(--lightningcss-dark,#fff);--color-body-text-alt:var(--lightningcss-light,#404247)var(--lightningcss-dark,#ccced0);--color-shadow:var(--lightningcss-light,#45484c26)var(--lightningcss-dark,#00000166);--color-outline:var(--lightningcss-light,#d8dbe0)var(--lightningcss-dark,#434549);--font-size-xs:clamp(.6944rem,.6855rem + .0446vw,.72rem);--font-size-s:clamp(.8331rem,.8099rem + .1163vw,.9rem);--font-size-m:clamp(1rem,.9565rem + .2174vw,1.125rem);--font-size-l:clamp(1.2rem,1.1283rem + .3587vw,1.4063rem);--font-size-xl:clamp(1.44rem,1.3293rem + .5533vw,1.7581rem);--font-size-2xl:clamp(1.7281rem,1.5649rem + .8163vw,2.1975rem);--font-size-3xl:clamp(2.0738rem,1.8396rem + 1.1707vw,2.7469rem);--font-size-4xl:clamp(2.4881rem,2.1594rem + 1.6435vw,3.4331rem);--font-weight-light:300;--font-weight-normal:400;--font-weight-semibold:600;--font-weight-bold:700;--font-weight-black:900;--font-family-body:"Avenir Next",avenir,corbel,source-sans-pro,"DejaVu Sans",ui-sans-serif,sans-serif;--font-family-heading:seravek,"Gill Sans Nova",cantarell,verdana,"DejaVu Sans",ui-sans-serif,sans-serif;--font-family-mono:ui-monospace,"Source Code Pro",ui-monospace,monospace;--space-3xs:clamp(4px,3.6528px + .1087vw,5px);--space-2xs:clamp(8px,7.6528px + .1087vw,9px);--space-xs:clamp(12px,11.304px + .2174vw,14px);--space-s:clamp(16px,15.304px + .2174vw,18px);--space-m:clamp(24px,22.9568px + .3261vw,27px);--space-l:clamp(32px,30.608px + .4348vw,36px);--space-xl:clamp(48px,45.9136px + .6522vw,54px);--space-2xl:clamp(64px,61.2176px + .8696vw,72px);--space-3xl:clamp(96px,91.8256px + 1.3043vw,108px);--space-body:clamp(12px,6.7824px + 1.6304vw,27px);--radius-none:0;--radius-s:3px;--radius-m:6px;--radius-l:12px;--radius-xl:24px;--radius-2xl:64px;--radius-full:9999px;--shadow-none:none;--shadow-s:0 1px 3px -1px var(--color-shadow);--shadow-m:0 1px 7px -1px var(--color-shadow);--shadow-l:var(--shadow-s),0 1px 11px -1px var(--color-shadow);--shadow-xl:var(--shadow-m),0 1px 15px -1px var(--color-shadow);--border-none:0;--border-s:1px;--border-m:2px;--border-l:5px;--border-xl:8px;--opacity-disabled:var(--lightningcss-light,.65)var(--lightningcss-dark,.5)}.alert,.banner{font-family:var(--font-family-body);font-size:var(--font-size-m);font-weight:var(--font-weight-normal);color:var(--color-body-text);background:linear-gradient(var(--alert-bg-color),var(--alert-bg-color))padding-box,linear-gradient(to right,var(--alert-border-start-color),var(--alert-border-end-color))border-box;border:var(--border-m)solid transparent;line-height:1.4;display:block;position:relative}:is(.alert,.banner)>*{line-height:1.4}@media print{:is(.alert,.banner){border-color:var(--alert-border-start-color)}}:is(.alert,.banner):before,:is(.alert,.banner):after{content:"";print-color-adjust:exact;width:2em;height:2em;margin-block:auto;position:absolute;inset-block:0}:is(.alert,.banner):before{z-index:2;-webkit-mask-image:var(--alert-icon);mask-image:var(--alert-icon);background-color:var(--alert-border-start-color);scale:.5;-webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}:is(.alert,.banner):after{z-index:1;border-radius:var(--radius-full);border:3px solid var(--alert-border-start-color);background-color:var(--lightningcss-light,#fffe)var(--lightningcss-dark,#000e);scale:.75}:is(.alert,.banner).error{--alert-bg-color:var(--color-red-9);--alert-border-start-color:var(--color-red-5);--alert-border-end-color:var(--color-red-6);--alert-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='none' stroke='currentColor' stroke-linecap='round' stroke-linejoin='round' stroke-width='64' d='M368 368L144 144M368 144L144 368' /%3E%3C/svg%3E")}:is(.alert,.banner).warning{--alert-bg-color:var(--color-yellow-9);--alert-border-start-color:var(--color-yellow-5);--alert-border-end-color:var(--color-yellow-6);--alert-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M256 80c-8.66 0-16.58 7.36-16 16l8 216a8 8 0 008 8h0a8 8 0 008-8l8-216c.58-8.64-7.34-16-16-16z' fill='none' stroke='currentColor' stroke-linecap='round' stroke-linejoin='round' stroke-width='64' /%3E%3Ccircle cx='256' cy='436' r='24' fill='none' stroke='currentColor' stroke-linecap='round' stroke-linejoin='round' stroke-width='48' /%3E%3C/svg%3E")}:is(.alert,.banner).success{--alert-bg-color:var(--color-green-9);--alert-border-start-color:var(--color-green-5);--alert-border-end-color:var(--color-green-6);--alert-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='none' stroke='currentColor' stroke-linecap='round' stroke-linejoin='round' stroke-width='64' d='M416 128L192 384l-96-96' /%3E%3C/svg%3E")}:is(.alert,.banner).info{--alert-bg-color:var(--color-sky-9);--alert-border-start-color:var(--color-sky-5);--alert-border-end-color:var(--color-sky-6);--alert-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='none' stroke='currentColor' stroke-linecap='round' stroke-linejoin='round' stroke-width='64' d='M196 220h64v172' /%3E%3Cpath fill='none' stroke='currentColor' stroke-linecap='round' stroke-miterlimit='10' stroke-width='64' d='M187 396h138' /%3E%3Ccircle cx='253 ' cy='118' r='44' /%3E%3C/svg%3E")}.alert-title,.banner-title{font-family:var(--font-family-heading);font-weight:var(--font-weight-bold);color:var(--alert-border-start-color);margin:0;margin-block-end:.15em;font-size:.85em;line-height:1}.modal,.drawer,.modal::backdrop,.drawer::backdrop{--dialog-starting-opacity:.25;--dialog-starting-transform:translateY(8px);--dialog-open-opacity:1;--dialog-open-transform:translate(0);--dialog-ending-opacity:0;--dialog-ending-transform:translateY(-4px)scale(.97);--dialog-backdrop-starting-opacity:0;--dialog-backdrop-open-opacity:var(--lightningcss-light,.75)var(--lightningcss-dark,.85);--dialog-backdrop-ending-opacity:0;--dialog-backdrop-color:var(--lightningcss-light,var(--color-gray-2))var(--lightningcss-dark,var(--color-gray-8))}@media (prefers-reduced-motion){:is(.modal,.drawer,.modal::backdrop,.drawer::backdrop){--dialog-starting-transform:translate(0);--dialog-ending-transform:translate(0)}}.modal,.drawer{box-shadow:var(--shadow-xl);border:var(--border-s)solid var(--color-outline);border-radius:var(--radius-l);background-color:var(--color-body-alt);color:var(--color-body-text);flex-direction:column;gap:0;padding:0}:is(.modal,.drawer)::backdrop{background-color:var(--dialog-backdrop-color)}:is(.modal,.drawer)[open]{display:flex}.modal-header,.drawer-header{font-family:var(--font-family-heading);font-size:var(--font-size-m);font-weight:var(--font-weight-bold);padding:var(--space-m);color:var(--color-brand-3);flex-shrink:0;justify-content:space-between;align-items:center;margin:0;padding-block-end:var(--space-xs);line-height:1;display:flex}:is(.modal-header,.drawer-header) h1,:is(.modal-header,.drawer-header) h2,:is(.modal-header,.drawer-header) h3,:is(.modal-header,.drawer-header) h4,:is(.modal-header,.drawer-header) h5,:is(.modal-header,.drawer-header) h6{color:inherit;font-size:inherit;font-weight:inherit;margin:0}.modal-body,.drawer-body{padding:var(--space-m);flex-shrink:1;margin:0;padding-block-start:var(--space-xs);display:block;overflow:auto}@supports (transition-behavior:allow-discrete) and (overlay:none){.modal,.drawer{animation:unset}}dialog:is(.modal,.drawer)[open]{transform:var(--dialog-open-transform);opacity:var(--dialog-open-opacity);display:flex}dialog:is(.modal,.drawer)[open]::backdrop{opacity:var(--dialog-backdrop-open-opacity)}dialog:is(.modal,.drawer){transform:var(--dialog-ending-transform);opacity:var(--dialog-ending-opacity);transition:transform .15s ease,opacity .15s ease,display .15s ease allow-discrete,overlay .15s ease allow-discrete}dialog:is(.modal,.drawer)::backdrop{opacity:var(--dialog-backdrop-ending-opacity);transition:transform .15s ease,opacity .15s ease,display .15s ease allow-discrete,overlay .15s ease allow-discrete}@starting-style{dialog:is(.modal,.drawer)[open]{transform:var(--dialog-starting-transform);opacity:var(--dialog-starting-opacity)}dialog:is(.modal,.drawer)[open]::backdrop{opacity:var(--dialog-backdrop-starting-opacity)}}.button.dismiss{--button-fg-color:var(--color-body-text);--button-bg-color:transparent;--button-border-color:transparent;--button-hover-bg-color:var(--color-gray-extra-transparent);--button-focus-ring-color:transparent;--button-shadow:none;width:3em;height:3em;font-size:.75rem}.button.dismiss:is(:focus-visible,.focus){--button-bg-color:var(--color-gray-transparent);--button-hover-bg-color:transparent}.button.dismiss:after{content:"";background-color:currentColor;width:1.8em;height:1.8em;-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='none' stroke='currentColor' stroke-linecap='round' stroke-linejoin='round' stroke-width='32' d='M368 368L144 144M368 144L144 368' /%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='none' stroke='currentColor' stroke-linecap='round' stroke-linejoin='round' stroke-width='32' d='M368 368L144 144M368 144L144 368' /%3E%3C/svg%3E");-webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}.accordion{width:100%}.accordion details{background-color:var(--color-body-alt);width:100%;padding-block:0;padding-inline:var(--space-xs);border-radius:var(--radius-m);border:var(--border-s)solid var(--color-outline);box-shadow:var(--shadow-s);font-family:var(--font-family-body);font-size:var(--font-size-m);font-weight:var(--font-weight-normal)}@media (prefers-reduced-motion:no-preference){.accordion details{transition:padding .15s}}.accordion details+details{border-block-start:0}.accordion details:not(:first-of-type){border-start-start-radius:0;border-start-end-radius:0}.accordion details:not(:last-of-type){border-end-end-radius:0;border-end-start-radius:0}.accordion details[open]{padding-block-end:var(--space-xs)}.accordion details[open] summary{border-block-end-color:var(--color-outline);margin-block-end:var(--space-xs)}.accordion details[open] summary:before{rotate:none}.accordion details[open] summary:not(:active,.active,:hover,.hover){color:var(--color-brand-3)}.accordion summary{font-family:var(--font-family-heading);font-size:var(--font-size-m);font-weight:var(--font-weight-bold);cursor:pointer;border-block-end:var(--border-s)dashed transparent;padding:var(--space-xs);margin-block:0;margin-inline:calc(-1*var(--space-xs));color:var(--color-body-text);-webkit-user-select:none;user-select:none;padding-inline-start:calc(var(--space-xs) + 1em);line-height:1;list-style:none;transition-property:color,border-color;transition-duration:.15s;transition-timing-function:ease;position:relative}@media (prefers-reduced-motion:no-preference){.accordion summary{transition-property:color,border-color,padding,margin}}.accordion summary:is(:hover,.hover){color:var(--lightningcss-light,var(--color-brand-4))var(--lightningcss-dark,var(--color-brand-2))}.accordion summary:is(:active,.active){color:var(--lightningcss-light,var(--color-brand-2))var(--lightningcss-dark,var(--color-brand-4))}.accordion summary::-webkit-details-marker{display:none}.accordion summary:before{content:var(--lightningcss-light,url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m6 9l6 6l6-6' /%3E%3C/svg%3E"))var(--lightningcss-dark,url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='white' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m6 9l6 6l6-6' /%3E%3C/svg%3E"));width:1em;height:1em;margin:auto;transition:rotate .2s;display:inline-block;position:absolute;inset-block:0;inset-inline-start:calc(var(--space-xs)/2);rotate:-90deg}.accordion summary:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)):before{rotate:90deg}@media (prefers-reduced-motion){.accordion summary{transition-property:color,border-color}.accordion summary:before{transition:none}}.accordion.subtle details{box-shadow:none;padding-inline:var(--space-2xs);background-color:#0000;border:0}.accordion.subtle details[open] summary{margin-block-end:var(--space-2xs)}.accordion.subtle summary{padding:var(--space-2xs);border-block-end:0;padding-inline-start:calc(var(--space-2xs) + 1em)}.alert{border-radius:var(--radius-s);padding:var(--space-2xs);border-start-start-radius:calc(var(--space-2xs) + 2em);border-end-start-radius:calc(var(--space-2xs) + 2em);padding-inline-start:calc(var(--space-2xs) + 2em)}.alert:before,.alert:after{inset-inline-start:calc(var(--space-2xs)*.5)}.app{--app-max-content-width:110rem;--app-header-height:clamp(50px,3.5rem,70px);--app-sidebar-width:clamp(300px,18rem,400px);width:100%;min-height:100svh;font-family:var(--font-family-body);font-size:var(--font-size-m);flex-direction:column;display:flex;position:relative}.app-header{height:var(--app-header-height);width:100%;color:var(--lightningcss-light,var(--color-brand-3))var(--lightningcss-dark,var(--color-brand-2));background-color:var(--color-body-alt);border-bottom:var(--border-l)solid var(--color-brand-transparent);box-shadow:var(--shadow-s);flex:none;position:sticky;left:0}.app-header-content{width:100%;height:100%;max-width:var(--app-max-content-width);padding-inline:var(--space-body);justify-content:space-between;align-items:center;gap:var(--space-s);margin-inline:auto;display:flex}.app-header-section{align-items:center;height:100%;margin:0;display:flex}.app-header-section:only-child{margin-inline:auto}.app-header-section:first-child{margin-inline-end:auto}.app-header-section:first-child .app-header-item:first-child{margin-inline-start:calc(-1*var(--space-xs))}.app-header-section:last-child .app-header-item:last-child{margin-inline-end:calc(-1*var(--space-xs))}.app-header-section:nth-child(n+3):before{content:"";background-color:var(--color-outline);height:2rem;width:var(--border-s);right:calc(var(--space-s)/2);position:relative}.app-header-item{cursor:pointer;height:100%;color:inherit;font-weight:var(--font-weight-semibold);padding-inline:var(--space-xs);border-radius:var(--radius-m);border:var(--border-m)solid var(--color-body-alt);align-items:center;text-decoration:none;transition-property:color,background-color;transition-duration:.2s;transition-timing-function:ease;display:flex;position:relative}.app-header-item:hover{background-color:var(--color-brand-extra-transparent)}.app-header-item:active{background-color:var(--color-brand-transparent)}.app-header-item:focus-visible{background-color:var(--color-brand-extra-transparent);outline-offset:calc(-1*var(--border-m))}.app-header-item:is([aria-current],.current){font-weight:var(--font-weight-bold)}.app-header-item:is([aria-current],.current):after{opacity:1}.app-header-item:after{content:"";width:100%;height:var(--border-l);bottom:calc(-1*(var(--border-l) + var(--border-m)));opacity:0;background-color:currentColor;border-radius:1px;position:absolute;left:0}.app-body{width:100%;max-width:var(--app-max-content-width);flex-direction:row;flex:none;margin-inline:auto;display:flex;position:relative}.app-sidebar{transition:opacity .15s ease,display .15s allow-discrete;width:var(--app-sidebar-width);opacity:1;border-inline-end:var(--border-s)dashed var(--color-outline);flex:none}.app-sidebar-content{height:100dvh;position:sticky;top:0;overflow:auto}.app-sidebar-section:first-of-type{margin-block-start:var(--space-body)}.app-sidebar-section:not(:last-of-type){margin-block-end:var(--space-xs)}.app-sidebar-section:last-of-type{margin-block-end:var(--space-body)}.app-sidebar-heading{margin:0 var(--space-body)var(--space-3xs);font-size:1.2rem;font-weight:var(--font-weight-semibold)}.app-sidebar-item{margin:0 var(--space-2xs);padding:var(--space-2xs)calc(var(--space-body) - var(--space-2xs));border-radius:var(--radius-l);color:var(--color-body-text-alt);font-weight:var(--font-weight-normal);-webkit-user-select:none;user-select:none;font-size:1rem;text-decoration:none;transition-property:color,background-color,box-shadow;transition-duration:.2s;transition-timing-function:ease;display:block}.app-sidebar-item:hover{background-color:var(--color-brand-extra-transparent)}.app-sidebar-item:active{color:var(--color-brand-1)}.app-sidebar-item:is([aria-current],.current){color:var(--color-brand-4);font-weight:var(--font-weight-bold)}.app-sidebar-item:hover:active{background-color:var(--color-brand-transparent)}.app-sidebar-item:focus-visible{outline-offset:0;background-color:var(--color-brand-extra-transparent)}.app-sidebar-toggle{width:2.75rem;margin-inline-start:1rem;transition-property:color,background-color;transition-duration:.2s;transition-timing-function:ease;display:none}.app-sidebar-toggle:has(input:focus-visible){outline:var(--border-m)solid var(--color-brand-5);outline-offset:calc(-1*var(--border-m))}.app-sidebar-toggle:before{content:"";height:100%;width:var(--border-s);background-color:var(--color-outline);position:absolute;top:0;left:-.5rem}.app-sidebar-toggle>div{opacity:1;background-color:currentColor;border-radius:2px;width:1.75rem;height:2px;transition-property:transform,opacity;transition-duration:.2s;transition-timing-function:ease;position:absolute;top:50%;left:50%}.app-sidebar-toggle>div:first-of-type{transform:translateY(calc(-50% - .45rem))translate(-50%)}.app-sidebar-toggle>div:nth-of-type(2){transform:translateY(-50%)translate(-50%)}.app-sidebar-toggle>div:nth-of-type(3){transform:translateY(calc(.45rem - 50%))translate(-50%)}.app-sidebar-toggle:has(input:checked)>div:first-of-type{transform:translateY(-50%)translate(-50%)rotate(45deg)}.app-sidebar-toggle:has(input:checked)>div:nth-of-type(2){opacity:0;transform:translateY(-50%)translate(-50%)rotateY(90deg)}.app-sidebar-toggle:has(input:checked)>div:nth-of-type(3){transform:translateY(-50%)translate(-50%)rotate(-45deg)}.app-content{width:100%;padding:var(--space-body);position:relative}.app-sidebar~.app-content{width:calc(100% - var(--app-sidebar-width))}@media (max-width:calc(55rem - .001px)){.app-sidebar~.app-content{width:100%}.app-sidebar{top:var(--app-header-height);opacity:1;-webkit-backdrop-filter:blur(24px)saturate(120%);backdrop-filter:blur(24px)saturate(120%);z-index:9;background-color:var(--lightningcss-light,#fffc)var(--lightningcss-dark,#000a);border-right:0;width:100vw;position:fixed;left:0}.app-sidebar:after{content:initial}.app-sidebar-toggle{display:initial}.app-sidebar-content{height:calc(100dvh - var(--app-header-height))}.app:not(:has(.app-sidebar-toggle input:checked)) .app-sidebar{opacity:0;display:none}.app:has(.app-sidebar-toggle input:checked){overflow:hidden}.app:has(.app-sidebar-toggle input:checked)>.banner{display:none}.app:has(.app-sidebar-toggle input:checked) .app-header{z-index:10;position:fixed;top:0}.app:has(.app-sidebar-toggle input:checked) .app-content{top:var(--app-header-height)}}.app:has(dialog:modal){overflow:hidden}@starting-style{.app>.sidebar{opacity:0}}.banner{width:100%;padding:var(--space-xs);border-inline-width:0;padding-inline-start:calc(var(--space-xs) + 2em)}.banner:has(.button.dismiss){padding-inline-end:calc(var(--space-xs) + 2em)}.banner:before,.banner:after{inset-inline-start:calc(var(--space-xs)*.5)}.banner+.banner{border-block-start-width:0}.banner.error{--banner-dismiss-icon-color:var(--color-red-4);--banner-dismiss-hover-bg:var(--color-red-extra-transparent);--banner-dismiss-focus-bg:var(--color-red-transparent)}.banner.warning{--banner-dismiss-icon-color:var(--color-yellow-4);--banner-dismiss-hover-bg:var(--color-yellow-extra-transparent);--banner-dismiss-focus-bg:var(--color-yellow-transparent)}.banner.success{--banner-dismiss-icon-color:var(--color-green-4);--banner-dismiss-hover-bg:var(--color-green-extra-transparent);--banner-dismiss-focus-bg:var(--color-green-transparent)}.banner.info{--banner-dismiss-icon-color:var(--color-sky-4);--banner-dismiss-hover-bg:var(--color-sky-extra-transparent);--banner-dismiss-focus-bg:var(--color-sky-transparent)}.banner .button.dismiss{--button-fg-color:var(--banner-dismiss-icon-color);--button-hover-bg-color:var(--banner-dismiss-hover-bg);margin:auto;position:absolute;inset-block:0;inset-inline-end:var(--space-3xs)}.banner .button.dismiss:is(:focus-visible,.focus){--button-bg-color:var(--banner-dismiss-focus-bg)}.button{--button-shadow:var(--shadow-s);--button-hover-bg-color:var(--button-border-color);box-sizing:border-box;cursor:pointer;border-style:solid;border-width:var(--border-s);border-radius:var(--radius-m);min-width:3em;min-height:2.6em;line-height:1;font-family:var(--font-family-body);box-shadow:var(--button-shadow);-webkit-user-select:none;user-select:none;color:var(--button-fg-color);background-color:var(--button-bg-color);border-color:var(--button-border-color);font-size:1rem;font-weight:var(--button-font-weight);outline:0;justify-content:center;align-items:center;gap:.5em;padding-block:.75em;padding-inline:1.25em;text-decoration:none;transition-property:box-shadow,background-color,transform,opacity;transition-duration:.2s;transition-timing-function:ease;display:inline-flex;position:relative;overflow:hidden;transform:scale(1)}.button:before{content:"";background-color:var(--button-hover-bg-color);z-index:-1;opacity:0;border-radius:2em;width:4em;height:4em;margin:auto;transition-property:opacity,width,height,border-radius;transition-duration:.2s;transition-timing-function:ease;position:absolute;inset:0}.button:is(:focus-visible,.focus){box-shadow:var(--button-shadow),0 0 0 .1em var(--button-border-color),0 0 0 calc(.2em + var(--border-s))var(--button-focus-ring-color)}.button:is(:active,.active){transform:scale(.98)}@media screen and (-webkit-max-device-pixel-ratio:1.999),screen and (max-resolution:1.999dppx){.button:is(:active,.active){transform:translateY(1px)}}.button:is(:hover,.hover){text-decoration:none}.button:is(:hover,.hover):before{opacity:1;border-radius:5px;width:100%;height:100%}.button:is(:hover,.hover):is(input){background-color:var(--button-hover-bg-color)}.button.primary{--button-fg-color:white;--button-bg-color:var(--color-brand-5);--button-border-color:var(--color-brand-4);--button-font-weight:var(--font-weight-bold);--button-focus-ring-color:var(--color-brand-transparent)}.button.primary.red{--button-bg-color:var(--color-red-5);--button-border-color:var(--color-red-4);--button-focus-ring-color:var(--color-red-transparent)}.button.primary.orange{--button-bg-color:var(--color-orange-5);--button-border-color:var(--color-orange-4);--button-focus-ring-color:var(--color-orange-transparent)}.button.primary.yellow{--button-bg-color:var(--color-yellow-5);--button-border-color:var(--color-yellow-4);--button-focus-ring-color:var(--color-yellow-transparent)}.button.primary.green{--button-bg-color:var(--color-green-5);--button-border-color:var(--color-green-4);--button-focus-ring-color:var(--color-green-transparent)}.button.primary.sky{--button-bg-color:var(--color-sky-5);--button-border-color:var(--color-sky-4);--button-focus-ring-color:var(--color-sky-transparent)}.button.primary.blue{--button-bg-color:var(--color-blue-5);--button-border-color:var(--color-blue-4);--button-focus-ring-color:var(--color-blue-transparent)}.button.primary.purple{--button-bg-color:var(--color-purple-5);--button-border-color:var(--color-purple-4);--button-focus-ring-color:var(--color-purple-transparent)}.button.primary.magenta{--button-bg-color:var(--color-magenta-5);--button-border-color:var(--color-magenta-4);--button-focus-ring-color:var(--color-magenta-transparent)}.button.primary.gray{--button-bg-color:var(--color-gray-5);--button-border-color:var(--color-gray-4);--button-focus-ring-color:var(--color-gray-transparent)}.button:not(.primary,.subtle,.close,.dismiss){--button-fg-color:var(--color-body-text);--button-bg-color:var(--color-gray-9);--button-border-color:var(--color-gray-8);--button-font-weight:var(--font-weight-normal);--button-focus-ring-color:var(--color-gray-extra-transparent)}.button:is(.subtle,.close){--button-fg-color:var(--color-brand-4);--button-bg-color:transparent;--button-border-color:transparent;--button-hover-bg-color:var(--color-brand-extra-transparent);--button-font-weight:var(--font-weight-bold);--button-focus-ring-color:transparent;--button-shadow:none}.button:is(.subtle,.close):is(:focus-visible,.focus){--button-bg-color:var(--color-brand-transparent);--button-hover-bg-color:transparent}.button:is(.subtle,.close).red{--button-fg-color:var(--color-red-4);--button-hover-bg-color:var(--color-red-extra-transparent)}.button:is(.subtle,.close).red:is(:focus-visible,.focus){--button-bg-color:var(--color-red-transparent)}.button:is(.subtle,.close).orange{--button-fg-color:var(--color-orange-4);--button-hover-bg-color:var(--color-orange-extra-transparent)}.button:is(.subtle,.close).orange:is(:focus-visible,.focus){--button-bg-color:var(--color-orange-transparent)}.button:is(.subtle,.close).yellow{--button-fg-color:var(--color-yellow-4);--button-hover-bg-color:var(--color-yellow-extra-transparent)}.button:is(.subtle,.close).yellow:is(:focus-visible,.focus){--button-bg-color:var(--color-yellow-transparent)}.button:is(.subtle,.close).green{--button-fg-color:var(--color-green-4);--button-hover-bg-color:var(--color-green-extra-transparent)}.button:is(.subtle,.close).green:is(:focus-visible,.focus){--button-bg-color:var(--color-green-transparent)}.button:is(.subtle,.close).sky{--button-fg-color:var(--color-sky-4);--button-hover-bg-color:var(--color-sky-extra-transparent)}.button:is(.subtle,.close).sky:is(:focus-visible,.focus){--button-bg-color:var(--color-sky-transparent)}.button:is(.subtle,.close).blue{--button-fg-color:var(--color-blue-4);--button-hover-bg-color:var(--color-blue-extra-transparent)}.button:is(.subtle,.close).blue:is(:focus-visible,.focus){--button-bg-color:var(--color-blue-transparent)}.button:is(.subtle,.close).purple{--button-fg-color:var(--color-purple-4);--button-hover-bg-color:var(--color-purple-extra-transparent)}.button:is(.subtle,.close).purple:is(:focus-visible,.focus){--button-bg-color:var(--color-purple-transparent)}.button:is(.subtle,.close).magenta{--button-fg-color:var(--color-magenta-4);--button-hover-bg-color:var(--color-magenta-extra-transparent)}.button:is(.subtle,.close).magenta:is(:focus-visible,.focus){--button-bg-color:var(--color-magenta-transparent)}.button:is(.subtle,.close).gray{--button-fg-color:var(--color-gray-4);--button-hover-bg-color:var(--color-gray-extra-transparent)}.button:is(.subtle,.close).gray:is(:focus-visible,.focus){--button-bg-color:var(--color-gray-transparent)}.button:is(.small,.close,.dismiss){font-size:.8rem}.button.large{font-size:1.2rem}.button:is(.icon,.close,.dismiss){border-radius:var(--radius-full);aspect-ratio:1;min-width:0;min-height:0}.button:is(.icon,.close,.dismiss):is(.subtle,.close):before{width:75%;height:75%}.button:is(.icon,.close,.dismiss):is(.subtle,.close):is(:hover,.hover):before{border-radius:100%;width:100%;height:100%}.button:is(.icon,.close,.dismiss).icon{padding:.5em}.button:is(.icon,.close,.dismiss).close,.button:is(.icon,.close,.dismiss).dismiss{padding:.3em}.button:is(.icon,.close,.dismiss):not(.subtle,.close,.dismiss):before{content:unset}.button:is(.icon,.close,.dismiss):not(.subtle,.close,.dismiss):is(:hover,.hover){background-color:var(--button-hover-bg-color)}.button:is(:disabled,.disabled,[aria-disabled=true]){opacity:var(--opacity-disabled);cursor:not-allowed;transform:scale(1)}.button:is(:disabled,.disabled,[aria-disabled=true]):is(:hover,.hover):before{opacity:0}.button.loading{cursor:progress}.button.loading:before{animation:1.2s ease-in-out infinite forwards button-loading-bg;opacity:1!important;border-radius:inherit!important;height:100%!important}.button.loading:is(:disabled,.disabled,[aria-disabled=true]){cursor:wait}@keyframes button-loading-bg{0%{width:0;margin:0 auto 0 0}50%{width:100%}to{width:0;margin:0 0 0 auto}}.card{background-color:var(--color-body-alt);border-radius:var(--radius-l);border:var(--border-s)solid var(--color-outline);box-shadow:var(--shadow-m);padding:var(--space-m);font-family:var(--font-family-body);font-size:var(--font-size-m);font-weight:var(--font-weight-normal)}.card.secondary{background-color:var(--color-body);border-radius:var(--radius-m);box-shadow:var(--shadow-s);padding:var(--space-s)}.card-title{font-family:var(--font-family-heading);text-wrap:balance;overflow-wrap:break-word;line-height:1.15;font-size:var(--font-size-l);font-weight:var(--font-weight-bold);color:var(--color-brand-3);margin-block:0 var(--space-xs)}.card.secondary .card-title{font-size:var(--font-size-m);margin-block-end:var(--space-2xs)}.chip{--chip-fg-color:white;--chip-bg-color:var(--color-brand-6);--chip-border-color:var(--lightningcss-light,var(--color-brand-7))var(--lightningcss-dark,var(--color-brand-5));--chip-focus-color:var(--color-brand-transparent);--chip-bg-color-active:var(--lightningcss-light,var(--color-brand-5))var(--lightningcss-dark,var(--color-brand-7));border-radius:var(--radius-full);font-size:var(--font-size-s);font-family:var(--font-family-body);font-weight:var(--font-weight-normal);padding-block:var(--space-3xs);padding-inline:var(--space-xs);background-color:var(--chip-bg-color);border:var(--border-s)solid var(--chip-border-color);color:var(--chip-fg-color);cursor:default;appearance:none;flex-shrink:0;align-items:center;line-height:1.2;text-decoration:none;transition-property:box-shadow,background-color,border-color;transition-duration:.2s;transition-timing-function:ease;display:inline-flex}.chip:is(:focus-visible,.focus){box-shadow:0 0 0 .2em var(--chip-focus-color)}.chip.clickable{cursor:pointer;box-shadow:var(--shadow-s)}.chip.clickable:is(:focus-visible,.focus){box-shadow:var(--shadow-s),0 0 0 .2em var(--chip-focus-color);outline:0}.chip.clickable:is(:hover,.hover){background-color:var(--chip-border-color)}.chip.clickable:is(:active,.active){background-color:var(--chip-bg-color-active);border-color:var(--chip-bg-color-active)}.chip.red{--chip-bg-color:var(--color-red-6);--chip-border-color:var(--lightningcss-light,var(--color-red-7))var(--lightningcss-dark,var(--color-red-5));--chip-focus-color:var(--color-red-transparent);--chip-bg-color-active:var(--lightningcss-light,var(--color-red-5))var(--lightningcss-dark,var(--color-red-7))}.chip.orange{--chip-bg-color:var(--color-orange-6);--chip-border-color:var(--lightningcss-light,var(--color-orange-7))var(--lightningcss-dark,var(--color-orange-5));--chip-focus-color:var(--color-orange-transparent);--chip-bg-color-active:var(--lightningcss-light,var(--color-orange-5))var(--lightningcss-dark,var(--color-orange-7))}.chip.yellow{--chip-bg-color:var(--color-yellow-6);--chip-border-color:var(--lightningcss-light,var(--color-yellow-7))var(--lightningcss-dark,var(--color-yellow-5));--chip-focus-color:var(--color-yellow-transparent);--chip-bg-color-active:var(--lightningcss-light,var(--color-yellow-5))var(--lightningcss-dark,var(--color-yellow-7))}.chip.green{--chip-bg-color:var(--color-green-6);--chip-border-color:var(--lightningcss-light,var(--color-green-7))var(--lightningcss-dark,var(--color-green-5));--chip-focus-color:var(--color-green-transparent);--chip-bg-color-active:var(--lightningcss-light,var(--color-green-5))var(--lightningcss-dark,var(--color-green-7))}.chip.sky{--chip-bg-color:var(--color-sky-6);--chip-border-color:var(--lightningcss-light,var(--color-sky-7))var(--lightningcss-dark,var(--color-sky-5));--chip-focus-color:var(--color-sky-transparent);--chip-bg-color-active:var(--lightningcss-light,var(--color-sky-5))var(--lightningcss-dark,var(--color-sky-7))}.chip.blue{--chip-bg-color:var(--color-blue-6);--chip-border-color:var(--lightningcss-light,var(--color-blue-7))var(--lightningcss-dark,var(--color-blue-5));--chip-focus-color:var(--color-blue-transparent);--chip-bg-color-active:var(--lightningcss-light,var(--color-blue-5))var(--lightningcss-dark,var(--color-blue-7))}.chip.purple{--chip-bg-color:var(--color-purple-6);--chip-border-color:var(--lightningcss-light,var(--color-purple-7))var(--lightningcss-dark,var(--color-purple-5));--chip-focus-color:var(--color-purple-transparent);--chip-bg-color-active:var(--lightningcss-light,var(--color-purple-5))var(--lightningcss-dark,var(--color-purple-7))}.chip.magenta{--chip-bg-color:var(--color-magenta-6);--chip-border-color:var(--lightningcss-light,var(--color-magenta-7))var(--lightningcss-dark,var(--color-magenta-5));--chip-focus-color:var(--color-magenta-transparent);--chip-bg-color-active:var(--lightningcss-light,var(--color-magenta-5))var(--lightningcss-dark,var(--color-magenta-7))}.chip.gray{--chip-bg-color:var(--color-gray-6);--chip-border-color:var(--lightningcss-light,var(--color-gray-7))var(--lightningcss-dark,var(--color-gray-5));--chip-focus-color:var(--color-gray-transparent);--chip-bg-color-active:var(--lightningcss-light,var(--color-gray-5))var(--lightningcss-dark,var(--color-gray-7))}.chip.black{--chip-bg-color:black;--chip-border-color:var(--lightningcss-light,var(--color-gray-4))var(--lightningcss-dark,var(--color-gray-7));--chip-focus-color:var(--color-gray-transparent);--chip-bg-color-active:var(--lightningcss-light,var(--color-gray-1))var(--lightningcss-dark,var(--color-gray-8))}.chip.white{--chip-fg-color:black;--chip-bg-color:white;--chip-border-color:var(--lightningcss-light,var(--color-gray-8))var(--lightningcss-dark,var(--color-gray-2));--chip-focus-color:var(--color-gray-transparent);--chip-bg-color-active:var(--lightningcss-light,var(--color-gray-7))var(--lightningcss-dark,var(--color-gray-3))}.chip-delete{margin-inline:var(--space-3xs)calc(-1*var(--space-2xs));border:var(--border-s)solid var(--chip-border-color);border-radius:var(--radius-full);cursor:pointer;-webkit-user-select:none;user-select:none;width:2em;height:2em;box-shadow:none;background-color:#0002;outline:0;padding:0;font-size:.6em;transition-property:background-color,border-color;transition-duration:.2s;transition-timing-function:ease;display:inline-flex;position:relative;overflow:hidden}.chip-delete:after{content:"";background-color:var(--chip-fg-color);width:1.7em;height:1.7em;margin:auto;-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='none' stroke='currentColor' stroke-linecap='round' stroke-linejoin='round' stroke-width='32' d='M368 368L144 144M368 144L144 368' /%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='none' stroke='currentColor' stroke-linecap='round' stroke-linejoin='round' stroke-width='32' d='M368 368L144 144M368 144L144 368' /%3E%3C/svg%3E");-webkit-mask-position:50%;mask-position:50%;-webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}.chip-delete:is(:focus-visible,.focus){border-color:var(--chip-fg-color)}.chip-delete:is(:hover,.hover,:focus-visible,.focus){background-color:#0001}.chip-delete:is(:active,.active){background-color:#0003}.divider,.markdown-output :is(hr,br){background-color:var(--color-outline);width:100%;height:var(--border-s);margin:var(--space-xs)0;print-color-adjust:exact;border:0;outline:0;display:block}:is(.divider,.markdown-output :is(hr,br)).vertical{width:var(--border-s);height:100%;min-height:1em;margin:0 var(--space-xs);display:inline-block}.divider.invisible,.markdown-output br{visibility:hidden}.drawer{--dialog-starting-opacity:.5;border:0;border-radius:0;margin:0;position:fixed;inset:0;overflow:auto}.drawer.left{right:auto}@media (prefers-reduced-motion:no-preference){.drawer.left{--dialog-starting-transform:translateX(-16px);--dialog-ending-transform:translateX(-16px)}}.drawer.top{bottom:auto}@media (prefers-reduced-motion:no-preference){.drawer.top{--dialog-starting-transform:translateY(-16px);--dialog-ending-transform:translateY(-16px)}}.drawer.right{left:auto}@media (prefers-reduced-motion:no-preference){.drawer.right{--dialog-starting-transform:translateX(16px);--dialog-ending-transform:translateX(16px)}}.drawer.bottom{top:auto}@media (prefers-reduced-motion:no-preference){.drawer.bottom{--dialog-starting-transform:translateY(16px);--dialog-ending-transform:translateY(16px)}}.drawer.top,.drawer.bottom{width:100dvw;max-width:unset;height:auto;min-height:min(100dvh,250px);max-height:100dvh}:is(.drawer.top,.drawer.bottom).small{height:300px}:is(.drawer.top,.drawer.bottom).medium{height:450px}:is(.drawer.top,.drawer.bottom).large{height:600px}.drawer.left,.drawer.right{height:100dvh;max-height:unset;width:auto;min-width:min(100dvw,300px);max-width:100dvw}:is(.drawer.left,.drawer.right).small{width:350px}:is(.drawer.left,.drawer.right).medium{width:450px}:is(.drawer.left,.drawer.right).large{width:700px}.drawer-header{font-size:var(--font-size-l)}.drawer-body{height:100%}.drawer-footer{padding:var(--space-xs);gap:var(--space-xs);flex-shrink:0;justify-content:flex-start;margin:0;margin-block-start:auto;display:flex}.drawer-footer>*{width:100%}.field{--field-gap:var(--space-2xs);--field-padding:.5em;--field-radius:var(--radius-m);gap:var(--field-gap);color:var(--color-body-text);line-height:1;font-weight:var(--font-weight-semibold);font-size:var(--font-size-m);font-family:var(--font-family-body);flex-direction:column;transition-property:color,box-shadow;transition-duration:.2s;transition-timing-function:ease;display:inline-flex}.field.compact,.fieldset.compact .field{--field-gap:calc(.9*var(--space-2xs));--field-padding:.33em;--field-radius:var(--radius-s);font-size:calc(.9*var(--font-size-m))}.field:focus-within{color:var(--color-brand-5)}.field:has(:user-invalid,[aria-invalid=true]){color:var(--color-red-5)}.field:has(:user-invalid,[aria-invalid=true]) .error-message{opacity:1}.field:has([readonly]):focus-within{color:var(--color-gray-5)}.field input:not([type=button],[type=checkbox],[type=file],[type=hidden],[type=image],[type=radio],[type=range],[type=reset],[type=submit]),.field select,.field textarea{color:var(--color-body-text);border:var(--border-s)solid var(--color-outline);padding:var(--field-padding);border-radius:var(--field-radius);background-color:var(--lightningcss-light,#fff)var(--lightningcss-dark,#000);font-family:inherit;font-size:1em;transition-property:color,box-shadow,border-color;transition-duration:.2s;transition-timing-function:ease}:is(.field input:not([type=button],[type=checkbox],[type=file],[type=hidden],[type=image],[type=radio],[type=range],[type=reset],[type=submit]),.field select,.field textarea):focus{border-color:var(--color-brand-5);box-shadow:0 0 0 .1em var(--color-brand-5),0 0 0 calc(.2em + var(--border-s))var(--color-brand-transparent);outline:0}:is(.field input:not([type=button],[type=checkbox],[type=file],[type=hidden],[type=image],[type=radio],[type=range],[type=reset],[type=submit]),.field select,.field textarea):focus-visible{outline:0}:is(.field input:not([type=button],[type=checkbox],[type=file],[type=hidden],[type=image],[type=radio],[type=range],[type=reset],[type=submit]),.field select,.field textarea):disabled{opacity:var(--opacity-disabled);cursor:not-allowed}:is(.field input:not([type=button],[type=checkbox],[type=file],[type=hidden],[type=image],[type=radio],[type=range],[type=reset],[type=submit]),.field select,.field textarea)[readonly]{border-style:dashed}:is(.field input:not([type=button],[type=checkbox],[type=file],[type=hidden],[type=image],[type=radio],[type=range],[type=reset],[type=submit]),.field select,.field textarea)[readonly]:focus{border-style:solid;border-color:var(--color-gray-5);box-shadow:0 0 0 .1em var(--color-gray-5),0 0 0 calc(.2em + var(--border-s))var(--color-gray-transparent);outline:0}:is(:is(.field input:not([type=button],[type=checkbox],[type=file],[type=hidden],[type=image],[type=radio],[type=range],[type=reset],[type=submit]),.field select,.field textarea):user-invalid,:is(.field input:not([type=button],[type=checkbox],[type=file],[type=hidden],[type=image],[type=radio],[type=range],[type=reset],[type=submit]),.field select,.field textarea)[aria-invalid=true]){border-color:var(--color-red-5);box-shadow:0 0 0 .1em var(--color-red-5)}:is(:is(.field input:not([type=button],[type=checkbox],[type=file],[type=hidden],[type=image],[type=radio],[type=range],[type=reset],[type=submit]),.field select,.field textarea):user-invalid,:is(.field input:not([type=button],[type=checkbox],[type=file],[type=hidden],[type=image],[type=radio],[type=range],[type=reset],[type=submit]),.field select,.field textarea)[aria-invalid=true]):focus{border-color:var(--color-red-5);box-shadow:0 0 0 .1em var(--color-red-5),0 0 0 calc(.2em + var(--border-s))var(--color-red-transparent);outline:0}.field input[type=color]{cursor:pointer;block-size:auto;inline-size:auto}.field input[type=color]::-webkit-color-swatch-wrapper{padding:0}.field input[type=color]::-webkit-color-swatch{border-radius:var(--radius-s);border:0;block-size:1em;inline-size:1.62em}.field input[type=color]::-moz-color-swatch{border-radius:var(--radius-s);border:0;block-size:1em;inline-size:1.62em}.field select{background-image:var(--lightningcss-light,url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-linecap='round' stroke-linejoin='round' stroke-width='1' d='m6 9l6 6l6-6' /%3E%3C/svg%3E"))var(--lightningcss-dark,url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='white' stroke-linecap='round' stroke-linejoin='round' stroke-width='1' d='m6 9l6 6l6-6' /%3E%3C/svg%3E"));cursor:pointer;appearance:none;background-position:right .25em center;background-repeat:no-repeat;background-size:auto 75%;padding-inline-end:calc(2*var(--space-2xs) + 1em)}.field select:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)){background-position:.25em 50%}.field .help-text{color:var(--color-body-text-alt);font-size:.9em;font-weight:var(--font-weight-normal);margin:-.25em 0 0;position:relative}.field .error-message{opacity:0;font-size:.9em;font-weight:var(--font-weight-semibold);border:0;align-items:center;gap:2px;margin:0;padding:0;transition:opacity .2s;display:flex}.field .error-message:before{content:"";background-color:currentColor;width:1.2em;height:1.2em;display:inline-block;-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M256 48C141.31 48 48 141.31 48 256s93.31 208 208 208 208-93.31 208-208S370.69 48 256 48zm75.31 260.69a16 16 0 11-22.62 22.62L256 278.63l-52.69 52.68a16 16 0 01-22.62-22.62L233.37 256l-52.68-52.69a16 16 0 0122.62-22.62L256 233.37l52.69-52.68a16 16 0 0122.62 22.62L278.63 256z' /%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M256 48C141.31 48 48 141.31 48 256s93.31 208 208 208 208-93.31 208-208S370.69 48 256 48zm75.31 260.69a16 16 0 11-22.62 22.62L256 278.63l-52.69 52.68a16 16 0 01-22.62-22.62L233.37 256l-52.68-52.69a16 16 0 0122.62-22.62L256 233.37l52.69-52.68a16 16 0 0122.62 22.62L278.63 256z' /%3E%3C/svg%3E");-webkit-mask-position:50%;mask-position:50%;-webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}.field .input-group{flex-direction:row;align-items:stretch;display:flex}.field .input-group>*{z-index:1;border-radius:0!important}.field .input-group>:is(:user-invalid,[aria-invalid=true]){z-index:2}.field .input-group>:first-child{border-start-start-radius:var(--field-radius)!important;border-end-start-radius:var(--field-radius)!important}.field .input-group>:last-child{border-start-end-radius:var(--field-radius)!important;border-end-end-radius:var(--field-radius)!important}.field .input-group>:focus-visible{z-index:3}.field .input-group>:is(.prefix,.suffix,.action){-webkit-user-select:none;user-select:none;-webkit-user-drag:none;font-weight:var(--font-weight-normal);color:var(--color-gray-3);background-color:var(--color-gray-9);border:var(--border-s)solid var(--color-outline);padding:var(--field-padding)calc(2*var(--field-padding));justify-content:center;align-items:center;font-size:.9em;display:flex}.field .input-group>:is(.prefix,.suffix,.action) :is(img,svg){width:auto;height:1.15em}.field .input-group>.prefix{border-inline-end:0}.field .input-group>.suffix{border-inline-start:0}.field .input-group>.action{cursor:pointer;color:var(--color-brand-3);border-inline-start:0;transition-property:box-shadow,background-color;transition-duration:.2s;transition-timing-function:ease}.field .input-group>.action:hover{background-color:var(--color-gray-8)}.field .input-group>.action:active{background-color:var(--color-gray-7)}.field .input-group>.action:focus-visible{border-color:var(--color-brand-5);border-inline-start-width:var(--border-s);box-shadow:0 0 0 .11em var(--color-brand-5),0 0 0 calc(.22em + var(--border-s))var(--color-brand-transparent);border-inline-start-style:solid;outline:0}.field .input-group>:is(input,select,textarea){width:100%}.field .input-group>:is(input,select,textarea):has(~.action:focus-visible){border-inline-end-width:0}input[type=checkbox],input[type=radio]{accent-color:var(--color-brand-5)}fieldset.fieldset{border:var(--border-s)solid var(--color-outline);border-radius:var(--radius-s);background-color:var(--color-body);color:var(--color-body-text)}fieldset.fieldset legend{font-family:var(--font-family-heading);font-weight:var(--font-weight-bold);transition:color .2s}fieldset.fieldset:focus-within legend{color:var(--color-brand-5)}.form{max-width:60ch;margin-inline-end:auto}.flow,.stack,.separate,.space{gap:var(--space-s);display:flex!important}:is(.flow,.stack,.separate,.space).densest{gap:var(--space-3xs)}:is(.flow,.stack,.separate,.space).denser{gap:var(--space-2xs)}:is(.flow,.stack,.separate,.space).dense{gap:var(--space-xs)}:is(.flow,.stack,.separate,.space).sparse{gap:var(--space-m)}:is(.flow,.stack,.separate,.space).sparser{gap:var(--space-l)}:is(.flow,.stack,.separate,.space).sparsest{gap:var(--space-xl)}:is(.flow,.stack,.separate,.space).horizontal,:is(.flow,.stack,.separate,.space).horizontally{flex-direction:row}:is(.flow,.stack,.separate,.space).vertical,:is(.flow,.stack,.separate,.space).vertically{flex-direction:column}.flow{flex-wrap:wrap;justify-content:start;align-items:center}.stack{flex-wrap:nowrap;justify-content:start;align-items:stretch}.separate{flex-wrap:nowrap;justify-content:space-between;align-items:center}.space{flex-wrap:wrap;justify-content:space-evenly;align-items:center}.heading-1,.heading-2,.heading-3,.heading-4,.heading-5,.heading-6,.markdown-output :is(h1,h2,h3,h4,h5,h6){font-family:var(--font-family-heading);text-wrap:balance;overflow-wrap:break-word;margin-block:.75em .3em;line-height:1.15}.heading-1,.markdown-output h1{font-size:var(--font-size-4xl);font-weight:var(--font-weight-black);margin-block-start:0}.app-content>:is(.heading-1,.markdown-output h1):first-of-type{margin-block-start:0}.heading-2,.markdown-output h2{font-size:var(--font-size-3xl);font-weight:var(--font-weight-bold)}.heading-3,.markdown-output h3{font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold)}.heading-4,.markdown-output h4{font-size:var(--font-size-xl);font-weight:var(--font-weight-semibold)}.heading-5,.markdown-output h5{font-size:var(--font-size-l);font-weight:var(--font-weight-semibold)}.heading-6,.markdown-output h6{font-size:var(--font-size-m);font-weight:var(--font-weight-bold)}.highlight,.markdown-output mark{background-color:var(--lightningcss-light,var(--color-yellow-8))var(--lightningcss-dark,var(--color-yellow-7));color:var(--lightningcss-light,var(--color-yellow-2))var(--lightningcss-dark,var(--color-yellow-1));print-color-adjust:exact}.highlight.removed,.markdown-output del{background-color:var(--color-red-8);color:var(--color-red-2);-webkit-text-decoration-skip-ink:none;text-decoration-skip-ink:none;text-decoration-line:line-through;text-decoration-thickness:var(--border-m);-webkit-text-decoration-color:var(--color-red-4);text-decoration-color:var(--color-red-4);print-color-adjust:exact;transition:text-decoration-color .15s}:is(.highlight.removed,.markdown-output del):hover{text-decoration-color:#0000}.highlight.added,.markdown-output ins{background-color:var(--color-green-8);color:var(--color-green-2);text-decoration-thickness:var(--border-m);-webkit-text-decoration-color:var(--color-green-4);text-decoration-color:var(--color-green-4);text-underline-offset:.1em;print-color-adjust:exact}.highlight.target{background-color:var(--color-brand-8);color:var(--lightningcss-light,var(--color-brand-2))var(--lightningcss-dark,var(--color-brand-1));print-color-adjust:exact}::target-text{background-color:var(--color-brand-8);color:var(--lightningcss-light,var(--color-brand-2))var(--lightningcss-dark,var(--color-brand-1));print-color-adjust:exact}.link,.markdown-output a{color:var(--color-sky-4);font-weight:var(--font-weight-semibold);text-decoration-line:underline;-webkit-text-decoration-color:var(--color-sky-transparent);text-decoration-color:var(--color-sky-transparent);-webkit-text-decoration-skip-ink:all;text-decoration-skip-ink:all;text-decoration-thickness:var(--border-m);text-underline-offset:.1em;cursor:pointer;transition:text-decoration-color .2s}:is(.link,.markdown-output a):is(:hover,.hover){text-decoration-color:currentColor}:is(.link,.markdown-output a):focus-visible{outline-offset:1px}[target=_blank]:is(.link,.button,.markdown-output a):not(.no-external-icon):after{content:"";print-color-adjust:exact;background-color:var(--color-gray-5);vertical-align:baseline;width:.85em;height:.85em;margin-left:.1em;display:inline-block;-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1em' height='1em' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23ffffff' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6m4-3h6v6m-11 5L21 3' /%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1em' height='1em' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23ffffff' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6m4-3h6v6m-11 5L21 3' /%3E%3C/svg%3E");-webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}a.button[target=_blank]:not(.no-external-icon):after{background-color:currentColor}meter.meter{appearance:none;block-size:1em;inline-size:100%}@supports selector(::-moz-meter-bar){meter.meter{border-radius:var(--radius-s);block-size:1em;inline-size:100%;box-shadow:inset 0 0 0 var(--border-s)var(--color-outline);background:var(--color-gray-9);box-sizing:border-box;border:0;display:block;overflow:clip}}.meter::-webkit-meter-bar{border-radius:var(--radius-s);block-size:1em;inline-size:100%;box-shadow:inset 0 0 0 var(--border-s)var(--color-outline);background:var(--color-gray-9);box-sizing:border-box;border:0;display:block;overflow:clip}.meter::-webkit-meter-optimum-value{border-radius:var(--radius-s);border:var(--border-s)solid transparent;box-sizing:border-box}.meter::-webkit-meter-suboptimum-value{border-radius:var(--radius-s);border:var(--border-s)solid transparent;box-sizing:border-box}.meter::-webkit-meter-even-less-good-value{border-radius:var(--radius-s);border:var(--border-s)solid transparent;box-sizing:border-box}.meter::-webkit-meter-inner-element{display:inline-block;position:relative}.meter::-moz-meter-bar{border-radius:var(--radius-s);border:var(--border-s)solid transparent;box-sizing:border-box}.meter::-webkit-meter-optimum-value{background:var(--color-green-6);border-color:var(--color-green-5)}.meter:-moz-meter-optimum::-moz-meter-bar{background:var(--color-green-6);border-color:var(--color-green-5)}.meter::-webkit-meter-suboptimum-value{background:var(--lightningcss-light,var(--color-yellow-7))var(--lightningcss-dark,var(--color-yellow-4));border-color:var(--lightningcss-light,var(--color-yellow-6))var(--lightningcss-dark,var(--color-yellow-3))}.meter:-moz-meter-sub-optimum::-moz-meter-bar{background:var(--lightningcss-light,var(--color-yellow-7))var(--lightningcss-dark,var(--color-yellow-4));border-color:var(--lightningcss-light,var(--color-yellow-6))var(--lightningcss-dark,var(--color-yellow-3))}.meter::-webkit-meter-even-less-good-value{background:var(--color-red-6);border-color:var(--color-red-5)}.meter:-moz-meter-sub-sub-optimum::-moz-meter-bar{background:var(--color-red-6);border-color:var(--color-red-5)}.modal{max-height:calc(100svh - 4*var(--space-body));max-width:calc(100svw - 4*var(--space-body));margin:auto}.modal.small{width:400px}.modal.medium{width:650px}.modal.large{width:900px}.modal-footer{padding:var(--space-xs);gap:var(--space-2xs);background-color:var(--color-body);border-block-start:var(--border-s)solid var(--color-outline);flex-shrink:0;justify-content:flex-start;margin:0;display:flex}@media screen and (max-width:500px){.modal-footer{flex-direction:column;justify-content:stretch;width:100%}}.modal-footer .button:not(.small,.medium,.large){font-size:.9rem}@keyframes indeterminate-progress{0%{opacity:.2}to{opacity:.8}}progress.progress{appearance:none;block-size:1em;inline-size:100%}@supports selector(::-moz-progress-bar){progress.progress{border-radius:var(--radius-s);block-size:1em;inline-size:100%;box-shadow:inset 0 0 0 var(--border-s)var(--color-outline);background:var(--color-gray-9);box-sizing:border-box;border:0;display:block;overflow:clip}}.progress::-webkit-progress-bar{border-radius:var(--radius-s);block-size:1em;inline-size:100%;box-shadow:inset 0 0 0 var(--border-s)var(--color-outline);background:var(--color-gray-9);box-sizing:border-box;border:0;display:block;overflow:clip}.progress::-webkit-progress-value{border-radius:var(--radius-s);border:var(--border-s)solid transparent;box-sizing:border-box;background:var(--color-blue-6);border-color:var(--color-blue-5)}.progress::-moz-progress-bar{border-radius:var(--radius-s);border:var(--border-s)solid transparent;box-sizing:border-box;background:var(--color-blue-6);border-color:var(--color-blue-5)}.progress:indeterminate::-webkit-progress-value{background:var(--color-blue-6);border-color:var(--color-blue-5);opacity:.5;animation:1s linear infinite alternate indeterminate-progress;inline-size:100%!important}.progress:indeterminate::-moz-progress-bar{background:var(--color-blue-6);border-color:var(--color-blue-5);opacity:.5;animation:1s linear infinite alternate indeterminate-progress;inline-size:100%!important}.quote,.markdown-output blockquote{color:var(--color-body-text-alt);border-inline-start:var(--border-l)solid var(--color-gray-transparent);padding:var(--space-3xs);line-height:1.25;font-family:var(--font-family-body);font-size:var(--font-size-m);font-weight:var(--font-weight-normal);margin:0;padding-inline-start:var(--space-xs);display:block;position:relative}:is(.quote,.markdown-output blockquote) footer{font-size:var(--font-size-s);font-style:initial;color:var(--color-body-text);font-weight:var(--font-weight-semibold);margin-block-start:.5em}:is(.quote,.markdown-output blockquote) footer cite{font-weight:var(--font-weight-normal);font-style:italic}@keyframes skeleton-pulse-light{0%{opacity:.14}to{opacity:.21}}@keyframes skeleton-pulse-dark{0%{opacity:.28}to{opacity:.36}}.skeleton{print-color-adjust:exact;border-radius:var(--radius-s)!important;background-color:var(--color-gray-5)!important;box-shadow:0!important;pointer-events:none!important;color:#0000!important;background-image:none!important;border:0!important;outline:0!important;animation:1s infinite alternate skeleton-pulse-light!important;-webkit-mask-image:none!important;mask-image:none!important}.skeleton.paragraph,.skeleton.heading{inline-size:100%}.skeleton:is(.paragraph,.heading,.chip,.card-title):before{content:"."}.skeleton:is(.button,.chip):empty{min-inline-size:5em}.skeleton.card-title{inline-size:40%;overflow:hidden}.skeleton:before,.skeleton:after,.skeleton>*{visibility:hidden!important}@media (prefers-color-scheme:dark){.skeleton{animation-name:skeleton-pulse-dark!important}}.skip-link{z-index:100;top:var(--space-body);left:var(--space-body);background-color:var(--color-brand-5);padding:var(--space-xs);border-radius:var(--radius-m);border:.25em solid var(--color-brand-4);color:var(--color-body-alt);font-weight:var(--font-weight-bold);font-family:var(--font-family-body);font-size:var(--font-size-m);box-shadow:var(--shadow-l),0 0 0 .2em var(--color-brand-transparent);vertical-align:middle;opacity:.25;pointer-events:none;outline:0;line-height:1;text-decoration:none;transition:opacity .3s;display:inline-block;position:fixed}.skip-link kbd{font-weight:initial;background-color:var(--color-brand-4)!important;color:inherit!important;border:0!important;margin-inline-start:var(--space-2xs)!important;font-size:1.2em!important}.skip-link:focus,.skip-link.static{opacity:1}.skip-link.static{pointer-events:unset;position:static}input[type=range].slider{appearance:none;cursor:pointer;background:0 0;block-size:1.25em;font-size:1rem}@media (pointer:coarse){input[type=range].slider{font-size:1.5rem}}input[type=range].slider:disabled{opacity:var(--opacity-disabled);cursor:not-allowed}input[type=range].slider:focus-visible{outline:0}input[type=range].slider:focus-visible::-webkit-slider-thumb{border-color:var(--color-brand-5);box-shadow:0 0 0 .2em var(--color-brand-transparent)}input[type=range].slider:focus-visible::-moz-range-thumb{border-color:var(--color-brand-5);box-shadow:0 0 0 .2em var(--color-brand-transparent)}input[type=range].slider:enabled:active::-webkit-slider-thumb{border-color:var(--color-brand-5)}@media screen and (-webkit-min-device-pixel-ratio:2),screen and (min-resolution:2dppx){input[type=range].slider:enabled:active::-webkit-slider-thumb:active{transform:scale(.9)}}input[type=range].slider:enabled:active::-moz-range-thumb{border-color:var(--color-brand-5)}@media screen and (-webkit-min-device-pixel-ratio:2),screen and (min-resolution:2dppx){input[type=range].slider:enabled:active::-moz-range-thumb:active{transform:scale(.9)}}input[type=range].slider::-webkit-slider-runnable-track{border-radius:var(--radius-full);background-color:var(--lightningcss-light,var(--color-gray-8))var(--lightningcss-dark,var(--color-gray-6));print-color-adjust:exact;block-size:.25em;inline-size:100%}input[type=range].slider::-moz-range-track{border-radius:var(--radius-full);background-color:var(--lightningcss-light,var(--color-gray-8))var(--lightningcss-dark,var(--color-gray-6));print-color-adjust:exact;block-size:.25em;inline-size:100%}input[type=range].slider::-webkit-slider-thumb{border-radius:var(--radius-full);width:1.25em;height:1.25em;box-shadow:var(--shadow-s);border:var(--border-s)solid var(--color-outline);appearance:none;background-color:#fff;margin-block-start:-.5em;transition-property:border-color,box-shadow,transform;transition-duration:.2s;transition-timing-function:ease}input[type=range].slider::-moz-range-thumb{border-radius:var(--radius-full);width:1.25em;height:1.25em;box-shadow:var(--shadow-s);border:var(--border-s)solid var(--color-outline);background-color:#fff;transition-property:border-color,box-shadow,transform;transition-duration:.2s;transition-timing-function:ease}label.switch{cursor:pointer;inline-size:100%;font-weight:var(--font-weight-semibold);justify-content:space-between;align-items:center;gap:var(--space-3xs);font-size:var(--font-size-m);font-family:var(--font-family-body);display:flex}label.switch.small{font-size:var(--font-size-s)}input[type=checkbox].switch,label.switch input[type=checkbox]{print-color-adjust:exact;appearance:none;border-radius:var(--radius-full);background-color:var(--lightningcss-light,var(--color-gray-8))var(--lightningcss-dark,var(--color-gray-5));border:.1em solid var(--color-gray-7);cursor:pointer;flex:none;block-size:1.8em;inline-size:3em;font-size:1rem;transition-property:background-color,box-shadow,border-color;transition-duration:.2s;transition-timing-function:ease;position:relative}:is(input[type=checkbox].switch,label.switch input[type=checkbox]):after{content:"";border-radius:var(--radius-full);width:1.4em;height:1.4em;box-shadow:var(--shadow-s);background-color:#fff;transition-property:border-color,transform;transition-duration:.2s;transition-timing-function:ease;position:absolute;inset-block-start:.1em;inset-inline-start:.1em;transform:translate(0)}:is(input[type=checkbox].switch,label.switch input[type=checkbox]):disabled{opacity:var(--opacity-disabled);cursor:not-allowed}:is(input[type=checkbox].switch,label.switch input[type=checkbox]):is(:focus-visible,.focus){border-color:var(--color-gray-6);box-shadow:0 0 0 .2em var(--color-gray-transparent);outline:0}:is(input[type=checkbox].switch,label.switch input[type=checkbox]):checked{background-color:var(--lightningcss-light,var(--color-brand-6))var(--lightningcss-dark,var(--color-brand-5));border-color:var(--lightningcss-light,var(--color-brand-5))var(--lightningcss-dark,var(--color-brand-6))}:is(input[type=checkbox].switch,label.switch input[type=checkbox]):checked:after{transform:translate(1.2em)}:is(input[type=checkbox].switch,label.switch input[type=checkbox]):checked:is(:focus-visible,.focus){box-shadow:0 0 0 .2em var(--color-brand-transparent)}:is(input[type=checkbox].switch,label.switch input[type=checkbox]):is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)):checked:after{transform:translate(-1.2em)}input[type=checkbox].switch.small,label.switch.small input[type=checkbox]{font-size:.8rem}table.table,.markdown-output table{--table-bg-odd:var(--color-body-alt);--table-bg-even:var(--color-body);--table-vertical-border:var(--border-s);background-color:var(--color-body-alt);border-collapse:separate;border-spacing:0;font-size:var(--font-size-m);border:var(--border-s)solid var(--color-outline);border-radius:var(--radius-s);color:var(--color-body-text);font-family:var(--font-family-body);font-weight:var(--font-weight-normal)}:is(table.table,.markdown-output table).subtle{--table-bg-odd:transparent;--table-bg-even:transparent;--table-vertical-border:0;border:0}:is(table.table,.markdown-output table).dense :is(th,td){padding:var(--space-3xs)var(--space-2xs)}:is(table.table,.markdown-output table).sparse :is(th,td){padding:var(--space-xs)var(--space-s)}:is(table.table,.markdown-output table) caption{font-family:var(--font-family-heading);line-height:1.15;font-size:var(--font-size-l);font-weight:var(--font-weight-semibold);text-align:start;margin:0 0 var(--space-2xs)}:is(table.table,.markdown-output table) th,:is(table.table,.markdown-output table) td{padding:var(--space-2xs)var(--space-xs)}:is(table.table,.markdown-output table) th,:is(table.table,.markdown-output table) tfoot td{font-weight:var(--font-weight-bold);font-family:var(--font-family-heading);text-align:center}:is(table.table,.markdown-output table) th{border-block-end:var(--border-m)solid var(--color-outline)}:is(table.table,.markdown-output table) tfoot td{border-block-start:var(--border-m)solid var(--color-outline)}:is(table.table,.markdown-output table) td{text-align:unset}:is(table.table,.markdown-output table) :is(th,tfoot td):not(:last-of-type){border-inline-end:var(--table-vertical-border)dashed var(--color-outline)}:is(table.table,.markdown-output table) td:not(tfoot td,:last-of-type){border-inline-end:var(--table-vertical-border)solid var(--color-outline)}:is(table.table,.markdown-output table) tr:not(:last-of-type) td{border-block-end:var(--border-s)solid var(--color-outline)}:is(table.table,.markdown-output table) tbody tr:nth-child(odd),:is(table.table,.markdown-output table) tbody:has(tr:last-of-type:nth-child(2n))+tfoot tr{background-color:var(--table-bg-even)}:is(table.table,.markdown-output table) tbody tr:nth-child(2n){background-color:var(--table-bg-odd)}.paragraph,.markdown-output p{font-family:var(--font-family-body);font-weight:var(--font-weight-normal);text-wrap:pretty;hanging-punctuation:first;overflow-wrap:break-word;margin:.75em 0;line-height:1.6}:is(.paragraph,.markdown-output p):first-child{margin-block-start:0}:is(.paragraph,.markdown-output p):last-child{margin-block-end:0}.abbreviation,.markdown-output abbr[title]{text-decoration-line:underline;text-decoration-style:dotted;text-decoration-thickness:var(--border-m);-webkit-text-decoration-color:var(--color-gray-6);text-decoration-color:var(--color-gray-6);text-underline-offset:.1em;display:inline}.bold,.markdown-output strong,.markdown-output b{font-weight:var(--font-weight-bold)}.italic,.markdown-output em{font-style:italic}.underline{text-decoration-line:underline}.strikethrough,.markdown-output s{text-decoration-line:line-through}.underline.strikethrough{text-decoration-line:underline line-through}.small-text,.markdown-output small{vertical-align:baseline;font-size:.75em}.subscript,.superscript,.markdown-output sub,.markdown-output sup{vertical-align:baseline;font-size:.75em;line-height:0;position:relative}.subscript,.markdown-output sub{inset-block-end:-.25em}.superscript,.markdown-output sup{inset-block-start:-.5em}.code,.markdown-output code{font-family:var(--font-family-mono);background-color:var(--color-gray-extra-transparent);color:var(--color-gray-1);border-radius:var(--radius-s);padding:.25ch .5ch;font-size:.9em;display:inline}:is(.code,.markdown-output code).invert{color:var(--color-gray-9)}.link .code,.markdown-output a code{-webkit-text-decoration:inherit;text-decoration:inherit;-webkit-text-decoration-color:inherit;text-decoration-color:inherit;text-decoration-thickness:inherit;color:inherit}.key,.skip-link kbd,.markdown-output kbd{border:var(--border-s)solid var(--color-gray-8);border-radius:var(--radius-m);font-size:.9em;font-weight:var(--font-weight-semibold);font-family:var(--font-family-body);background-color:var(--color-gray-9);color:var(--color-body-text);border-bottom-width:3px;margin:0 .25ch;padding:0 .5ch;display:inline}.visually-hidden,.sr-only,.app-sidebar-toggle input,.skip-link:not(:focus,.static){clip:rect(1px,1px,1px,1px);clip-path:inset(50%);width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}
2818
2
  /*# sourceMappingURL=./index.css.map */