@parrot-co/parrot-ui 0.0.81 → 0.0.82

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/styles.css ADDED
@@ -0,0 +1,4327 @@
1
+ * {
2
+ box-sizing: border-box;
3
+ margin: 0;
4
+ padding: 0;
5
+ }
6
+
7
+ button {
8
+ outline: none;
9
+ border: none;
10
+ -webkit-appearance: none;
11
+ -moz-appearance: none;
12
+ appearance: none;
13
+ }
14
+
15
+ a {
16
+ text-decoration: none;
17
+ }
18
+
19
+ .parrot-theme {
20
+ --scaling: 1;
21
+ }
22
+
23
+ .parrot-theme:where([data-scaling="90%"]) {
24
+ --scaling: 0.9;
25
+ }
26
+
27
+ .parrot-theme:where([data-scaling="95%"]) {
28
+ --scaling: 0.95;
29
+ }
30
+
31
+ .parrot-theme:where([data-scaling="100%"]) {
32
+ --scaling: 1;
33
+ }
34
+
35
+ .parrot-theme:where([data-scaling="105%"]) {
36
+ --scaling: 1.05;
37
+ }
38
+
39
+ .parrot-theme:where([data-scaling="110%"]) {
40
+ --scaling: 1.1;
41
+ }
42
+
43
+ /* space step = 4px */
44
+
45
+ .parrot-theme {
46
+ --space-unit: 0.25rem;
47
+ --space-none: 0px;
48
+ --space-px: 1px;
49
+ --space-0_5: calc(0.5 * var(--space-unit) * var(--scaling));
50
+ --space-1: calc(1 * var(--space-unit) * var(--scaling));
51
+ --space-1_5: calc(1.5 * var(--space-unit) * var(--scaling));
52
+ --space-2: calc(2 * var(--space-unit) * var(--scaling));
53
+ --space-2_5: calc(2.5 * var(--space-unit) * var(--scaling));
54
+ --space-3: calc(3 * var(--space-unit) * var(--scaling));
55
+ --space-3_5: calc(3.5 * var(--space-unit) * var(--scaling));
56
+ --space-4: calc(4 * var(--space-unit) * var(--scaling));
57
+ --space-5: calc(5 * var(--space-unit) * var(--scaling));
58
+ --space-6: calc(6 * var(--space-unit) * var(--scaling));
59
+ --space-7: calc(7 * var(--space-unit) * var(--scaling));
60
+ --space-8: calc(8 * var(--space-unit) * var(--scaling));
61
+ --space-9: calc(9 * var(--space-unit) * var(--scaling));
62
+ --space-10: calc(10 * var(--space-unit) * var(--scaling));
63
+ --space-11: calc(11 * var(--space-unit) * var(--scaling));
64
+ --space-12: calc(12 * var(--space-unit) * var(--scaling));
65
+ --space-14: calc(14 * var(--space-unit) * var(--scaling));
66
+ --space-16: calc(16 * var(--space-unit) * var(--scaling));
67
+ --space-20: calc(20 * var(--space-unit) * var(--scaling));
68
+ --space-24: calc(24 * var(--space-unit) * var(--scaling));
69
+ --space-28: calc(28 * var(--space-unit) * var(--scaling));
70
+ --space-32: calc(32 * var(--space-unit) * var(--scaling));
71
+ --space-36: calc(36 * var(--space-unit) * var(--scaling));
72
+ --space-40: calc(40 * var(--space-unit) * var(--scaling));
73
+ --space-44: calc(44 * var(--space-unit) * var(--scaling));
74
+ --space-48: calc(48 * var(--space-unit) * var(--scaling));
75
+ --space-52: calc(52 * var(--space-unit) * var(--scaling));
76
+ --space-56: calc(56 * var(--space-unit) * var(--scaling));
77
+ --space-60: calc(60 * var(--space-unit) * var(--scaling));
78
+ --space-64: calc(64 * var(--space-unit) * var(--scaling));
79
+ --space-72: calc(72 * var(--space-unit) * var(--scaling));
80
+ --space-80: calc(80 * var(--space-unit) * var(--scaling));
81
+ --space-96: calc(96 * var(--space-unit) * var(--scaling));
82
+ }
83
+
84
+ .parrot-theme {
85
+ --line-height-normal: calc(1 * var(--scaling));
86
+ --line-height-shorter: calc(1.25 * var(--scaling));
87
+ --line-height-short: calc(1.375 * var(--scaling));
88
+ --line-height-base: calc(1.5 * var(--scaling));
89
+ --line-height-tall: calc(1.625 * var(--scaling));
90
+ --line-height-taller: calc(2 * var(--scaling));
91
+ }
92
+
93
+ .parrot-theme {
94
+ --font-size-1_5: var(--space-1_5);
95
+ --font-size-2: var(--space-2);
96
+ --font-size-2_5: var(--space-2_5);
97
+ --font-size-3: var(--space-3);
98
+ --font-size-3_5: var(--space-3_5);
99
+ --font-size-4: var(--space-4);
100
+ --font-size-5: var(--space-5);
101
+ --font-size-6: var(--space-6);
102
+ --font-size-7: var(--space-7);
103
+ --font-size-8: var(--space-8);
104
+ --font-size-9: var(--space-9);
105
+ --font-size-10: var(--space-10);
106
+ --font-size-11: var(--space-11);
107
+ --font-size-12: var(--space-12);
108
+ --font-size-13: var(--space-13);
109
+ --font-size-14: var(--space-14);
110
+ --font-size-16: var(--space-16);
111
+ --font-size-18: var(--space-18);
112
+ --font-size-20: var(--space-20);
113
+ --font-size-22: var(--space-22);
114
+ --font-size-24: var(--space-24);
115
+ --font-size-28: var(--space-28);
116
+ --font-size-32: var(--space-32);
117
+ --font-size-36: var(--space-36);
118
+ }
119
+
120
+ .parrot-theme .position-relative {
121
+ position: relative;
122
+ }
123
+
124
+ .parrot-theme .position-absolute {
125
+ position: absolute;
126
+ }
127
+
128
+ .parrot-theme .position-fixed {
129
+ position: fixed;
130
+ }
131
+
132
+ .parrot-theme .position-sticky {
133
+ position: sticky;
134
+ }
135
+
136
+ .parrot-theme .position-static {
137
+ position: static;
138
+ }
139
+
140
+ .parrot-theme .display-none {
141
+ display: none;
142
+ }
143
+
144
+ .parrot-theme .display-block {
145
+ display: block;
146
+ }
147
+
148
+ .parrot-theme .display-inline {
149
+ display: inline;
150
+ }
151
+
152
+ .parrot-theme .display-inline-block {
153
+ display: inline-block;
154
+ }
155
+
156
+ .parrot-theme .display-flex {
157
+ display: flex;
158
+ }
159
+
160
+ .parrot-theme .display-inline-flex {
161
+ display: inline-flex;
162
+ }
163
+
164
+ .parrot-theme .display-grid {
165
+ display: grid;
166
+ }
167
+
168
+ .parrot-theme .stretch-x {
169
+ width: 100%;
170
+ }
171
+
172
+ .parrot-theme .stretch-y {
173
+ height: 100%;
174
+ }
175
+
176
+ .parrot-theme .stretch-xy {
177
+ width: 100%;
178
+ height: 100%;
179
+ }
180
+
181
+ .parrot-theme .flex-direction-row {
182
+ flex-direction: row;
183
+ }
184
+
185
+ .parrot-theme .flex-direction-row-reverse {
186
+ flex-direction: row-reverse;
187
+ }
188
+
189
+ .parrot-theme .flex-direction-column {
190
+ flex-direction: column;
191
+ }
192
+
193
+ .parrot-theme .flex-direction-column-reverse {
194
+ flex-direction: column-reverse;
195
+ }
196
+
197
+ .parrot-theme .flex-wrap {
198
+ flex-wrap: wrap;
199
+ }
200
+
201
+ .parrot-theme .flex-nowrap {
202
+ flex-wrap: nowrap;
203
+ }
204
+
205
+ .parrot-theme .flex-wrap-reverse {
206
+ flex-wrap: wrap-reverse;
207
+ }
208
+
209
+ .parrot-theme .flex-justify-start {
210
+ justify-content: flex-start;
211
+ }
212
+
213
+ .parrot-theme .flex-justify-end {
214
+ justify-content: flex-end;
215
+ }
216
+
217
+ .parrot-theme .flex-justify-center {
218
+ justify-content: center;
219
+ }
220
+
221
+ .parrot-theme .flex-justify-space-between {
222
+ justify-content: space-between;
223
+ }
224
+
225
+ .parrot-theme .flex-justify-space-around {
226
+ justify-content: space-around;
227
+ }
228
+
229
+ .parrot-theme .flex-justify-space-evenly {
230
+ justify-content: space-evenly;
231
+ }
232
+
233
+ .parrot-theme .flex-align-start {
234
+ align-items: flex-start;
235
+ }
236
+
237
+ .parrot-theme .flex-align-end {
238
+ align-items: flex-end;
239
+ }
240
+
241
+ .parrot-theme .flex-align-center {
242
+ align-items: center;
243
+ }
244
+
245
+ .parrot-theme .flex-align-baseline {
246
+ align-items: baseline;
247
+ }
248
+
249
+ .parrot-theme .flex-align-stretch {
250
+ align-items: stretch;
251
+ }
252
+
253
+ .parrot-theme .gap-none {
254
+ gap: 0;
255
+ }
256
+
257
+ .parrot-theme .gap-4xs {
258
+ gap: var(--space-0_5);
259
+ }
260
+
261
+ .parrot-theme .gap-3xs {
262
+ gap: var(--space-1);
263
+ }
264
+
265
+ .parrot-theme .gap-2xs {
266
+ gap: var(--space-2);
267
+ }
268
+
269
+ .parrot-theme .gap-xs {
270
+ gap: var(--space-2_5);
271
+ }
272
+
273
+ .parrot-theme .gap-sm {
274
+ gap: var(--space-3);
275
+ }
276
+
277
+ .parrot-theme .gap-md {
278
+ gap: var(--space-3_5);
279
+ }
280
+
281
+ .parrot-theme .gap-lg {
282
+ gap: var(--space-4);
283
+ }
284
+
285
+ .parrot-theme .gap-xl {
286
+ gap: var(--space-6);
287
+ }
288
+
289
+ .parrot-theme .gap-2xl {
290
+ gap: var(--space-8);
291
+ }
292
+
293
+ .parrot-theme .gap-3xl {
294
+ gap: var(--space-10);
295
+ }
296
+
297
+ .parrot-theme .gap-4xl {
298
+ gap: var(--space-12);
299
+ }
300
+
301
+ .parrot-theme .row-gap-none {
302
+ row-gap: 0;
303
+ }
304
+
305
+ .parrot-theme .row-gap-4xs {
306
+ row-gap: var(--space-0_5);
307
+ }
308
+
309
+ .parrot-theme .row-gap-3xs {
310
+ row-gap: var(--space-1);
311
+ }
312
+
313
+ .parrot-theme .row-gap-2xs {
314
+ row-gap: var(--space-2);
315
+ }
316
+
317
+ .parrot-theme .row-gap-xs {
318
+ row-gap: var(--space-2_5);
319
+ }
320
+
321
+ .parrot-theme .row-gap-sm {
322
+ row-gap: var(--space-3);
323
+ }
324
+
325
+ .parrot-theme .row-gap-md {
326
+ row-gap: var(--space-3_5);
327
+ }
328
+
329
+ .parrot-theme .row-gap-lg {
330
+ row-gap: var(--space-4);
331
+ }
332
+
333
+ .parrot-theme .row-gap-xl {
334
+ row-gap: var(--space-6);
335
+ }
336
+
337
+ .parrot-theme .row-gap-2xl {
338
+ row-gap: var(--space-8);
339
+ }
340
+
341
+ .parrot-theme .row-gap-3xl {
342
+ row-gap: var(--space-10);
343
+ }
344
+
345
+ .parrot-theme .row-gap-4xl {
346
+ row-gap: var(--space-12);
347
+ }
348
+
349
+ .parrot-theme .column-gap-none {
350
+ -moz-column-gap: 0;
351
+ column-gap: 0;
352
+ }
353
+
354
+ .parrot-theme .column-gap-4xs {
355
+ -moz-column-gap: var(--space-0_5);
356
+ column-gap: var(--space-0_5);
357
+ }
358
+
359
+ .parrot-theme .column-gap-3xs {
360
+ -moz-column-gap: var(--space-1);
361
+ column-gap: var(--space-1);
362
+ }
363
+
364
+ .parrot-theme .column-gap-2xs {
365
+ -moz-column-gap: var(--space-2);
366
+ column-gap: var(--space-2);
367
+ }
368
+
369
+ .parrot-theme .column-gap-xs {
370
+ -moz-column-gap: var(--space-2_5);
371
+ column-gap: var(--space-2_5);
372
+ }
373
+
374
+ .parrot-theme .column-gap-sm {
375
+ -moz-column-gap: var(--space-3);
376
+ column-gap: var(--space-3);
377
+ }
378
+
379
+ .parrot-theme .column-gap-md {
380
+ -moz-column-gap: var(--space-3_5);
381
+ column-gap: var(--space-3_5);
382
+ }
383
+
384
+ .parrot-theme .column-gap-lg {
385
+ -moz-column-gap: var(--space-4);
386
+ column-gap: var(--space-4);
387
+ }
388
+
389
+ .parrot-theme .column-gap-xl {
390
+ -moz-column-gap: var(--space-6);
391
+ column-gap: var(--space-6);
392
+ }
393
+
394
+ .parrot-theme .column-gap-2xl {
395
+ -moz-column-gap: var(--space-8);
396
+ column-gap: var(--space-8);
397
+ }
398
+
399
+ .parrot-theme .column-gap-3xl {
400
+ -moz-column-gap: var(--space-10);
401
+ column-gap: var(--space-10);
402
+ }
403
+
404
+ .parrot-theme .column-gap-4xl {
405
+ -moz-column-gap: var(--space-12);
406
+ column-gap: var(--space-12);
407
+ }
408
+
409
+ .parrot-theme .columns-1 {
410
+ grid-template-columns: repeat(1, minmax(0, 1fr));
411
+ }
412
+
413
+ .parrot-theme .columns-2 {
414
+ grid-template-columns: repeat(2, minmax(0, 1fr));
415
+ }
416
+
417
+ .parrot-theme .columns-3 {
418
+ grid-template-columns: repeat(3, minmax(0, 1fr));
419
+ }
420
+
421
+ .parrot-theme .columns-4 {
422
+ grid-template-columns: repeat(4, minmax(0, 1fr));
423
+ }
424
+
425
+ .parrot-theme .columns-5 {
426
+ grid-template-columns: repeat(5, minmax(0, 1fr));
427
+ }
428
+
429
+ .parrot-theme .columns-6 {
430
+ grid-template-columns: repeat(6, minmax(0, 1fr));
431
+ }
432
+
433
+ .parrot-theme .columns-7 {
434
+ grid-template-columns: repeat(7, minmax(0, 1fr));
435
+ }
436
+
437
+ .parrot-theme .columns-8 {
438
+ grid-template-columns: repeat(8, minmax(0, 1fr));
439
+ }
440
+
441
+ .parrot-theme .columns-9 {
442
+ grid-template-columns: repeat(9, minmax(0, 1fr));
443
+ }
444
+
445
+ .parrot-theme .columns-10 {
446
+ grid-template-columns: repeat(10, minmax(0, 1fr));
447
+ }
448
+
449
+ .parrot-theme .columns-11 {
450
+ grid-template-columns: repeat(11, minmax(0, 1fr));
451
+ }
452
+
453
+ .parrot-theme .columns-12 {
454
+ grid-template-columns: repeat(12, minmax(0, 1fr));
455
+ }
456
+
457
+ .parrot-theme .col-span-1 {
458
+ grid-column: span 1;
459
+ }
460
+
461
+ .parrot-theme .col-span-2 {
462
+ grid-column: span 2;
463
+ }
464
+
465
+ .parrot-theme .col-span-3 {
466
+ grid-column: span 3;
467
+ }
468
+
469
+ .parrot-theme .col-span-4 {
470
+ grid-column: span 4;
471
+ }
472
+
473
+ .parrot-theme .col-span-5 {
474
+ grid-column: span 5;
475
+ }
476
+
477
+ .parrot-theme .col-span-6 {
478
+ grid-column: span 6;
479
+ }
480
+
481
+ .parrot-theme .col-span-7 {
482
+ grid-column: span 7;
483
+ }
484
+
485
+ .parrot-theme .col-span-8 {
486
+ grid-column: span 8;
487
+ }
488
+
489
+ .parrot-theme .col-span-9 {
490
+ grid-column: span 9;
491
+ }
492
+
493
+ .parrot-theme .col-span-10 {
494
+ grid-column: span 10;
495
+ }
496
+
497
+ .parrot-theme .col-span-11 {
498
+ grid-column: span 11;
499
+ }
500
+
501
+ .parrot-theme .col-span-12 {
502
+ grid-column: span 12;
503
+ }
504
+
505
+ .parrot-theme .flex-shrink-none {
506
+ flex-shrink: 0;
507
+ }
508
+
509
+ .parrot-theme {
510
+ --radius-factor: 1;
511
+ --radius-full: 0px;
512
+ }
513
+
514
+ .parrot-theme:where([data-radius]),
515
+ .parrot-theme [data-radius] {
516
+ --radius-2xs: calc(2px * var(--scaling) * var(--radius-factor));
517
+ --radius-xs: calc(4px * var(--scaling) * var(--radius-factor));
518
+ --radius-sm: calc(6px * var(--scaling) * var(--radius-factor));
519
+ --radius-md: calc(8px * var(--scaling) * var(--radius-factor));
520
+ --radius-lg: calc(12px * var(--scaling) * var(--radius-factor));
521
+ --radius-xl: calc(16px * var(--scaling) * var(--radius-factor));
522
+ }
523
+
524
+ .parrot-theme:where([data-radius="none"]),
525
+ .parrot-theme [data-radius="none"] {
526
+ --radius-factor: 0;
527
+ }
528
+
529
+ .parrot-theme:where([data-radius="sm"]),
530
+ .parrot-theme [data-radius="sm"] {
531
+ --radius-factor: 0.5;
532
+ }
533
+
534
+ .parrot-theme:where([data-radius="md"]),
535
+ .parrot-theme [data-radius="md"] {
536
+ --radius-factor: 1;
537
+ }
538
+
539
+ .parrot-theme:where([data-radius="lg"]),
540
+ .parrot-theme [data-radius="lg"] {
541
+ --radius-factor: 1.5;
542
+ }
543
+
544
+ .parrot-theme:where([data-radius="full"]),
545
+ .parrot-theme [data-radius="full"] {
546
+ --radius-factor: 2;
547
+ --radius-full: 999px;
548
+ }
549
+
550
+ :root, .light, .light-theme {
551
+ --tomato-1: hsl(10, 100%, 99.4%);
552
+ --tomato-2: hsl(8, 100%, 98.4%);
553
+ --tomato-3: hsl(8, 100%, 96.6%);
554
+ --tomato-4: hsl(8, 100%, 94.3%);
555
+ --tomato-5: hsl(8, 92.8%, 91.0%);
556
+ --tomato-6: hsl(9, 84.7%, 86.3%);
557
+ --tomato-7: hsl(10, 77.3%, 79.5%);
558
+ --tomato-8: hsl(10, 71.6%, 71.0%);
559
+ --tomato-9: hsl(10, 78.0%, 54.0%);
560
+ --tomato-10: hsl(10, 71.4%, 49.4%);
561
+ --tomato-11: hsl(10, 82.0%, 42.0%);
562
+ --tomato-12: hsl(8, 50.0%, 24.0%);
563
+ }
564
+
565
+ .dark, .dark-theme {
566
+ --tomato-1: hsl(10, 23.0%, 9.4%);
567
+ --tomato-2: hsl(10, 39.0%, 11.6%);
568
+ --tomato-3: hsl(9, 48.3%, 15.5%);
569
+ --tomato-4: hsl(9, 53.0%, 18.1%);
570
+ --tomato-5: hsl(9, 57.0%, 20.7%);
571
+ --tomato-6: hsl(9, 61.8%, 24.5%);
572
+ --tomato-7: hsl(9, 68.4%, 31.1%);
573
+ --tomato-8: hsl(10, 80.4%, 43.9%);
574
+ --tomato-9: hsl(10, 78.0%, 54.0%);
575
+ --tomato-10: hsl(10, 88.4%, 64.1%);
576
+ --tomato-11: hsl(10, 100%, 72.0%);
577
+ --tomato-12: hsl(10, 85.0%, 89.0%);
578
+ }
579
+
580
+ :root, .light, .light-theme {
581
+ --tomato-a1: hsla(0, 100%, 51.0%, 0.012);
582
+ --tomato-a2: hsla(8, 100%, 51.0%, 0.032);
583
+ --tomato-a3: hsla(7, 100%, 50.2%, 0.067);
584
+ --tomato-a4: hsla(8, 100%, 50.1%, 0.114);
585
+ --tomato-a5: hsla(7, 99.5%, 47.9%, 0.173);
586
+ --tomato-a6: hsla(9, 99.9%, 46.2%, 0.255);
587
+ --tomato-a7: hsla(10, 99.8%, 43.6%, 0.365);
588
+ --tomato-a8: hsla(10, 99.5%, 41.8%, 0.499);
589
+ --tomato-a9: hsla(10, 99.9%, 43.8%, 0.820);
590
+ --tomato-a10: hsla(10, 100%, 41.1%, 0.859);
591
+ --tomato-a11: hsla(10, 99.9%, 37.3%, 0.926);
592
+ --tomato-a12: hsla(8, 99.5%, 13.7%, 0.879);
593
+ }
594
+
595
+ .dark, .dark-theme {
596
+ --tomato-a1: hsla(0, 100%, 49.3%, 0.022);
597
+ --tomato-a2: hsla(0, 100%, 49.8%, 0.074);
598
+ --tomato-a3: hsla(9, 100%, 49.9%, 0.152);
599
+ --tomato-a4: hsla(9, 99.5%, 52.7%, 0.204);
600
+ --tomato-a5: hsla(9, 99.5%, 53.8%, 0.256);
601
+ --tomato-a6: hsla(9, 99.6%, 54.6%, 0.334);
602
+ --tomato-a7: hsla(9, 99.7%, 55.0%, 0.477);
603
+ --tomato-a8: hsla(10, 99.9%, 54.2%, 0.771);
604
+ --tomato-a9: hsla(10, 99.9%, 59.5%, 0.888);
605
+ --tomato-a10: hsla(10, 99.8%, 66.8%, 0.953);
606
+ --tomato-a11: hsla(10, 100%, 72.0%, 1);
607
+ --tomato-a12: hsla(10, 99.7%, 90.4%, 0.983);
608
+ }
609
+
610
+ :root, .light, .light-theme {
611
+ --red-1: hsl(359, 100%, 99.4%);
612
+ --red-2: hsl(0, 100%, 98.4%);
613
+ --red-3: hsl(360, 100%, 96.8%);
614
+ --red-4: hsl(360, 97.9%, 94.8%);
615
+ --red-5: hsl(360, 90.2%, 91.9%);
616
+ --red-6: hsl(360, 81.7%, 87.8%);
617
+ --red-7: hsl(359, 74.2%, 81.7%);
618
+ --red-8: hsl(359, 69.5%, 74.3%);
619
+ --red-9: hsl(358, 75.0%, 59.0%);
620
+ --red-10: hsl(358, 67.4%, 54.6%);
621
+ --red-11: hsl(358, 65.0%, 47.0%);
622
+ --red-12: hsl(350, 63.0%, 24.0%);
623
+ }
624
+
625
+ .dark, .dark-theme {
626
+ --red-1: hsl(353, 23.0%, 9.8%);
627
+ --red-2: hsl(354, 30.2%, 12.4%);
628
+ --red-3: hsl(353, 40.8%, 16.4%);
629
+ --red-4: hsl(353, 46.3%, 19.2%);
630
+ --red-5: hsl(353, 51.2%, 22.1%);
631
+ --red-6: hsl(353, 57.3%, 26.2%);
632
+ --red-7: hsl(354, 65.7%, 33.2%);
633
+ --red-8: hsl(358, 75.0%, 47.1%);
634
+ --red-9: hsl(358, 75.0%, 59.0%);
635
+ --red-10: hsl(359, 84.8%, 67.6%);
636
+ --red-11: hsl(358, 100%, 76.0%);
637
+ --red-12: hsl(350, 100%, 91.0%);
638
+ }
639
+
640
+ :root, .light, .light-theme {
641
+ --red-a1: hsla(0, 100%, 51.0%, 0.012);
642
+ --red-a2: hsla(0, 100%, 51.0%, 0.032);
643
+ --red-a3: hsla(0, 100%, 50.2%, 0.063);
644
+ --red-a4: hsla(0, 100%, 50.0%, 0.102);
645
+ --red-a5: hsla(0, 99.9%, 47.5%, 0.153);
646
+ --red-a6: hsla(0, 99.5%, 44.9%, 0.224);
647
+ --red-a7: hsla(359, 99.7%, 42.7%, 0.318);
648
+ --red-a8: hsla(359, 99.6%, 41.1%, 0.436);
649
+ --red-a9: hsla(358, 99.9%, 42.9%, 0.718);
650
+ --red-a10: hsla(358, 99.9%, 40.2%, 0.761);
651
+ --red-a11: hsla(358, 99.8%, 36.7%, 0.836);
652
+ --red-a12: hsla(351, 99.9%, 16.6%, 0.910);
653
+ }
654
+
655
+ .dark, .dark-theme {
656
+ --red-a1: hsla(0, 100%, 49.0%, 0.031);
657
+ --red-a2: hsla(354, 100%, 49.8%, 0.074);
658
+ --red-a3: hsla(353, 99.3%, 55.9%, 0.152);
659
+ --red-a4: hsla(352, 99.8%, 56.5%, 0.208);
660
+ --red-a5: hsla(354, 99.3%, 57.5%, 0.265);
661
+ --red-a6: hsla(354, 99.8%, 57.5%, 0.351);
662
+ --red-a7: hsla(354, 99.7%, 56.6%, 0.503);
663
+ --red-a8: hsla(358, 99.8%, 56.1%, 0.806);
664
+ --red-a9: hsla(358, 99.8%, 65.3%, 0.888);
665
+ --red-a10: hsla(359, 99.9%, 70.9%, 0.944);
666
+ --red-a11: hsla(358, 100%, 76.1%, 1);
667
+ --red-a12: hsla(350, 100%, 91.0%, 1);
668
+ }
669
+
670
+ :root, .light, .light-theme {
671
+ --crimson-1: hsl(332, 100%, 99.4%);
672
+ --crimson-2: hsl(330, 100%, 98.4%);
673
+ --crimson-3: hsl(331, 85.6%, 96.6%);
674
+ --crimson-4: hsl(331, 78.1%, 94.2%);
675
+ --crimson-5: hsl(332, 72.1%, 91.1%);
676
+ --crimson-6: hsl(333, 67.0%, 86.7%);
677
+ --crimson-7: hsl(335, 63.5%, 80.4%);
678
+ --crimson-8: hsl(336, 62.3%, 72.9%);
679
+ --crimson-9: hsl(336, 80.0%, 57.8%);
680
+ --crimson-10: hsl(336, 71.3%, 52.8%);
681
+ --crimson-11: hsl(336, 75.0%, 45.5%);
682
+ --crimson-12: hsl(332, 63.0%, 23.5%);
683
+ }
684
+
685
+ .dark, .dark-theme {
686
+ --crimson-1: hsl(335, 20.0%, 9.6%);
687
+ --crimson-2: hsl(336, 32.3%, 12.2%);
688
+ --crimson-3: hsl(336, 40.2%, 16.0%);
689
+ --crimson-4: hsl(336, 44.4%, 18.5%);
690
+ --crimson-5: hsl(336, 48.4%, 21.3%);
691
+ --crimson-6: hsl(336, 53.9%, 25.5%);
692
+ --crimson-7: hsl(336, 62.7%, 32.8%);
693
+ --crimson-8: hsl(336, 80.0%, 45.1%);
694
+ --crimson-9: hsl(336, 80.0%, 57.8%);
695
+ --crimson-10: hsl(339, 87.0%, 67.2%);
696
+ --crimson-11: hsl(341, 100%, 76.0%);
697
+ --crimson-12: hsl(330, 90.0%, 91.0%);
698
+ }
699
+
700
+ :root, .light, .light-theme {
701
+ --crimson-a1: hsla(340, 100%, 51.0%, 0.012);
702
+ --crimson-a2: hsla(330, 100%, 51.0%, 0.032);
703
+ --crimson-a3: hsla(332, 99.1%, 47.1%, 0.063);
704
+ --crimson-a4: hsla(331, 99.9%, 44.3%, 0.102);
705
+ --crimson-a5: hsla(333, 99.9%, 42.3%, 0.153);
706
+ --crimson-a6: hsla(333, 99.5%, 40.5%, 0.224);
707
+ --crimson-a7: hsla(335, 99.7%, 39.1%, 0.322);
708
+ --crimson-a8: hsla(336, 99.5%, 38.5%, 0.440);
709
+ --crimson-a9: hsla(336, 99.9%, 44.3%, 0.761);
710
+ --crimson-a10: hsla(336, 100%, 41.5%, 0.808);
711
+ --crimson-a11: hsla(336, 99.8%, 38.5%, 0.887);
712
+ --crimson-a12: hsla(332, 99.8%, 16.3%, 0.914);
713
+ }
714
+
715
+ .dark, .dark-theme {
716
+ --crimson-a1: hsla(354, 100%, 49.3%, 0.022);
717
+ --crimson-a2: hsla(338, 100%, 49.8%, 0.074);
718
+ --crimson-a3: hsla(335, 99.8%, 54.7%, 0.143);
719
+ --crimson-a4: hsla(336, 99.4%, 56.6%, 0.191);
720
+ --crimson-a5: hsla(336, 99.8%, 57.8%, 0.247);
721
+ --crimson-a6: hsla(336, 99.3%, 58.1%, 0.330);
722
+ --crimson-a7: hsla(336, 99.9%, 57.5%, 0.485);
723
+ --crimson-a8: hsla(336, 99.8%, 54.4%, 0.793);
724
+ --crimson-a9: hsla(336, 99.9%, 62.7%, 0.905);
725
+ --crimson-a10: hsla(339, 99.8%, 70.1%, 0.953);
726
+ --crimson-a11: hsla(341, 100%, 76.1%, 1);
727
+ --crimson-a12: hsla(330, 99.3%, 91.6%, 0.992);
728
+ }
729
+
730
+ :root, .light, .light-theme {
731
+ --pink-1: hsl(322, 100%, 99.4%);
732
+ --pink-2: hsl(323, 100%, 98.4%);
733
+ --pink-3: hsl(323, 86.3%, 96.5%);
734
+ --pink-4: hsl(323, 78.7%, 94.2%);
735
+ --pink-5: hsl(323, 72.2%, 91.1%);
736
+ --pink-6: hsl(323, 66.3%, 86.6%);
737
+ --pink-7: hsl(323, 62.0%, 80.1%);
738
+ --pink-8: hsl(323, 60.3%, 72.4%);
739
+ --pink-9: hsl(322, 65.0%, 54.5%);
740
+ --pink-10: hsl(322, 62.0%, 49.6%);
741
+ --pink-11: hsl(322, 75.0%, 44.0%);
742
+ --pink-12: hsl(320, 70.0%, 23.2%);
743
+ }
744
+
745
+ .dark, .dark-theme {
746
+ --pink-1: hsl(318, 25.0%, 9.6%);
747
+ --pink-2: hsl(318, 32.3%, 12.2%);
748
+ --pink-3: hsl(318, 37.1%, 15.7%);
749
+ --pink-4: hsl(319, 39.8%, 18.1%);
750
+ --pink-5: hsl(319, 42.3%, 20.8%);
751
+ --pink-6: hsl(319, 45.8%, 24.9%);
752
+ --pink-7: hsl(320, 51.2%, 32.2%);
753
+ --pink-8: hsl(322, 60.0%, 46.1%);
754
+ --pink-9: hsl(322, 65.0%, 54.5%);
755
+ --pink-10: hsl(324, 71.5%, 63.2%);
756
+ --pink-11: hsl(325, 90.0%, 75.0%);
757
+ --pink-12: hsl(325, 90.0%, 90.5%);
758
+ }
759
+
760
+ :root, .light, .light-theme {
761
+ --pink-a1: hsla(320, 100%, 51.0%, 0.012);
762
+ --pink-a2: hsla(323, 100%, 51.0%, 0.032);
763
+ --pink-a3: hsla(323, 98.9%, 47.3%, 0.067);
764
+ --pink-a4: hsla(323, 99.9%, 44.3%, 0.102);
765
+ --pink-a5: hsla(324, 99.9%, 42.3%, 0.153);
766
+ --pink-a6: hsla(323, 99.5%, 39.6%, 0.224);
767
+ --pink-a7: hsla(323, 99.7%, 38.5%, 0.322);
768
+ --pink-a8: hsla(323, 99.5%, 37.7%, 0.444);
769
+ --pink-a9: hsla(322, 99.7%, 39.3%, 0.750);
770
+ --pink-a10: hsla(322, 99.9%, 37.9%, 0.812);
771
+ --pink-a11: hsla(322, 99.8%, 37.1%, 0.891);
772
+ --pink-a12: hsla(320, 99.6%, 17.6%, 0.930);
773
+ }
774
+
775
+ .dark, .dark-theme {
776
+ --pink-a1: hsla(331, 100%, 49.0%, 0.031);
777
+ --pink-a2: hsla(319, 100%, 49.8%, 0.074);
778
+ --pink-a3: hsla(318, 98.8%, 55.9%, 0.135);
779
+ --pink-a4: hsla(319, 99.4%, 59.0%, 0.178);
780
+ --pink-a5: hsla(319, 99.8%, 60.9%, 0.221);
781
+ --pink-a6: hsla(319, 99.8%, 61.2%, 0.299);
782
+ --pink-a7: hsla(320, 99.9%, 61.9%, 0.433);
783
+ --pink-a8: hsla(322, 100%, 61.1%, 0.710);
784
+ --pink-a9: hsla(322, 99.8%, 64.2%, 0.823);
785
+ --pink-a10: hsla(324, 99.7%, 70.2%, 0.884);
786
+ --pink-a11: hsla(325, 99.6%, 76.8%, 0.975);
787
+ --pink-a12: hsla(326, 99.3%, 91.2%, 0.992);
788
+ }
789
+
790
+ :root, .light, .light-theme {
791
+ --plum-1: hsl(292, 90.0%, 99.4%);
792
+ --plum-2: hsl(300, 100%, 98.6%);
793
+ --plum-3: hsl(299, 71.2%, 96.4%);
794
+ --plum-4: hsl(299, 62.0%, 93.8%);
795
+ --plum-5: hsl(298, 56.1%, 90.5%);
796
+ --plum-6: hsl(296, 51.3%, 85.8%);
797
+ --plum-7: hsl(295, 48.2%, 78.9%);
798
+ --plum-8: hsl(292, 47.7%, 70.8%);
799
+ --plum-9: hsl(292, 45.0%, 51.0%);
800
+ --plum-10: hsl(292, 50.2%, 46.9%);
801
+ --plum-11: hsl(292, 60.0%, 42.5%);
802
+ --plum-12: hsl(291, 57.0%, 23.2%);
803
+ }
804
+
805
+ .dark, .dark-theme {
806
+ --plum-1: hsl(301, 20.0%, 9.4%);
807
+ --plum-2: hsl(300, 28.8%, 11.6%);
808
+ --plum-3: hsl(299, 31.8%, 15.5%);
809
+ --plum-4: hsl(298, 33.4%, 18.3%);
810
+ --plum-5: hsl(297, 34.6%, 21.0%);
811
+ --plum-6: hsl(296, 36.0%, 25.1%);
812
+ --plum-7: hsl(295, 37.9%, 32.7%);
813
+ --plum-8: hsl(292, 40.2%, 47.8%);
814
+ --plum-9: hsl(292, 45.0%, 51.0%);
815
+ --plum-10: hsl(291, 51.2%, 60.2%);
816
+ --plum-11: hsl(290, 70.0%, 74.0%);
817
+ --plum-12: hsl(300, 60.0%, 89.5%);
818
+ }
819
+
820
+ :root, .light, .light-theme {
821
+ --plum-a1: hsla(280, 100%, 51.0%, 0.012);
822
+ --plum-a2: hsla(300, 100%, 51.0%, 0.028);
823
+ --plum-a3: hsla(300, 99.0%, 40.9%, 0.063);
824
+ --plum-a4: hsla(300, 99.9%, 38.5%, 0.102);
825
+ --plum-a5: hsla(298, 98.2%, 35.9%, 0.150);
826
+ --plum-a6: hsla(297, 99.6%, 33.7%, 0.216);
827
+ --plum-a7: hsla(295, 99.7%, 32.6%, 0.314);
828
+ --plum-a8: hsla(292, 99.6%, 32.4%, 0.432);
829
+ --plum-a9: hsla(292, 99.9%, 31.0%, 0.710);
830
+ --plum-a10: hsla(292, 99.9%, 30.8%, 0.765);
831
+ --plum-a11: hsla(292, 99.8%, 30.7%, 0.832);
832
+ --plum-a12: hsla(291, 100%, 14.8%, 0.902);
833
+ }
834
+
835
+ .dark, .dark-theme {
836
+ --plum-a1: hsla(300, 100%, 49.3%, 0.022);
837
+ --plum-a2: hsla(300, 100%, 49.7%, 0.061);
838
+ --plum-a3: hsla(300, 98.6%, 59.2%, 0.122);
839
+ --plum-a4: hsla(298, 99.3%, 62.9%, 0.165);
840
+ --plum-a5: hsla(297, 99.7%, 65.0%, 0.208);
841
+ --plum-a6: hsla(296, 99.7%, 66.9%, 0.273);
842
+ --plum-a7: hsla(295, 100%, 68.6%, 0.394);
843
+ --plum-a8: hsla(292, 99.7%, 69.7%, 0.637);
844
+ --plum-a9: hsla(292, 99.7%, 68.6%, 0.702);
845
+ --plum-a10: hsla(291, 99.8%, 74.2%, 0.784);
846
+ --plum-a11: hsla(290, 99.7%, 80.0%, 0.914);
847
+ --plum-a12: hsla(300, 99.1%, 93.4%, 0.953);
848
+ }
849
+
850
+ :root, .light, .light-theme {
851
+ --purple-1: hsl(280, 65.0%, 99.4%);
852
+ --purple-2: hsl(276, 100%, 99.0%);
853
+ --purple-3: hsl(276, 83.1%, 97.0%);
854
+ --purple-4: hsl(275, 76.4%, 94.7%);
855
+ --purple-5: hsl(275, 70.8%, 91.8%);
856
+ --purple-6: hsl(274, 65.4%, 87.8%);
857
+ --purple-7: hsl(273, 61.0%, 81.7%);
858
+ --purple-8: hsl(272, 60.0%, 73.5%);
859
+ --purple-9: hsl(272, 51.0%, 54.0%);
860
+ --purple-10: hsl(272, 46.8%, 50.3%);
861
+ --purple-11: hsl(272, 50.0%, 45.8%);
862
+ --purple-12: hsl(270, 50.0%, 25.0%);
863
+ }
864
+
865
+ .dark, .dark-theme {
866
+ --purple-1: hsl(284, 20.0%, 9.6%);
867
+ --purple-2: hsl(284, 31.1%, 12.0%);
868
+ --purple-3: hsl(282, 35.1%, 16.8%);
869
+ --purple-4: hsl(281, 36.9%, 20.1%);
870
+ --purple-5: hsl(280, 38.1%, 23.0%);
871
+ --purple-6: hsl(278, 39.5%, 27.3%);
872
+ --purple-7: hsl(276, 41.1%, 35.1%);
873
+ --purple-8: hsl(272, 42.7%, 50.0%);
874
+ --purple-9: hsl(272, 51.0%, 54.0%);
875
+ --purple-10: hsl(271, 57.8%, 61.2%);
876
+ --purple-11: hsl(270, 90.0%, 78.0%);
877
+ --purple-12: hsl(275, 75.0%, 91.5%);
878
+ }
879
+
880
+ :root, .light, .light-theme {
881
+ --purple-a1: hsla(300, 94.3%, 34.6%, 0.012);
882
+ --purple-a2: hsla(276, 100%, 51.0%, 0.020);
883
+ --purple-a3: hsla(277, 99.6%, 46.5%, 0.055);
884
+ --purple-a4: hsla(274, 97.9%, 44.3%, 0.095);
885
+ --purple-a5: hsla(276, 98.6%, 42.0%, 0.142);
886
+ --purple-a6: hsla(275, 100%, 39.2%, 0.200);
887
+ --purple-a7: hsla(273, 99.2%, 38.2%, 0.295);
888
+ --purple-a8: hsla(272, 99.7%, 37.6%, 0.424);
889
+ --purple-a9: hsla(272, 99.6%, 34.0%, 0.695);
890
+ --purple-a10: hsla(272, 99.7%, 32.0%, 0.730);
891
+ --purple-a11: hsla(272, 99.8%, 29.7%, 0.773);
892
+ --purple-a12: hsla(270, 99.6%, 14.4%, 0.875);
893
+ }
894
+
895
+ .dark, .dark-theme {
896
+ --purple-a1: hsla(278, 100%, 49.3%, 0.022);
897
+ --purple-a2: hsla(283, 100%, 49.5%, 0.070);
898
+ --purple-a3: hsla(282, 98.8%, 59.8%, 0.148);
899
+ --purple-a4: hsla(281, 99.0%, 62.4%, 0.200);
900
+ --purple-a5: hsla(280, 99.7%, 64.2%, 0.247);
901
+ --purple-a6: hsla(278, 99.2%, 65.7%, 0.317);
902
+ --purple-a7: hsla(276, 99.7%, 67.5%, 0.442);
903
+ --purple-a8: hsla(272, 100%, 68.8%, 0.684);
904
+ --purple-a9: hsla(272, 99.7%, 68.7%, 0.754);
905
+ --purple-a10: hsla(271, 99.7%, 72.6%, 0.819);
906
+ --purple-a11: hsla(270, 99.6%, 79.6%, 0.975);
907
+ --purple-a12: hsla(275, 99.1%, 93.3%, 0.979);
908
+ }
909
+
910
+ :root, .light, .light-theme {
911
+ --violet-1: hsl(255, 65.0%, 99.4%);
912
+ --violet-2: hsl(252, 100%, 99.0%);
913
+ --violet-3: hsl(252, 96.9%, 97.4%);
914
+ --violet-4: hsl(252, 91.5%, 95.5%);
915
+ --violet-5: hsl(252, 85.1%, 93.0%);
916
+ --violet-6: hsl(252, 77.8%, 89.4%);
917
+ --violet-7: hsl(252, 71.0%, 83.7%);
918
+ --violet-8: hsl(252, 68.6%, 76.3%);
919
+ --violet-9: hsl(252, 56.0%, 57.5%);
920
+ --violet-10: hsl(251, 48.1%, 53.5%);
921
+ --violet-11: hsl(250, 43.0%, 48.0%);
922
+ --violet-12: hsl(250, 43.0%, 26.0%);
923
+ }
924
+
925
+ .dark, .dark-theme {
926
+ --violet-1: hsl(250, 20.0%, 10.2%);
927
+ --violet-2: hsl(255, 30.3%, 12.9%);
928
+ --violet-3: hsl(254, 33.3%, 18.4%);
929
+ --violet-4: hsl(253, 34.6%, 22.1%);
930
+ --violet-5: hsl(253, 35.5%, 25.5%);
931
+ --violet-6: hsl(252, 36.6%, 30.5%);
932
+ --violet-7: hsl(251, 37.8%, 39.0%);
933
+ --violet-8: hsl(250, 46.2%, 54.1%);
934
+ --violet-9: hsl(252, 56.0%, 57.5%);
935
+ --violet-10: hsl(253, 63.2%, 64.1%);
936
+ --violet-11: hsl(255, 100%, 80.0%);
937
+ --violet-12: hsl(250, 93.0%, 93.0%);
938
+ }
939
+
940
+ :root, .light, .light-theme {
941
+ --violet-a1: hsla(270, 94.3%, 34.6%, 0.012);
942
+ --violet-a2: hsla(252, 100%, 51.0%, 0.020);
943
+ --violet-a3: hsla(254, 100%, 50.0%, 0.051);
944
+ --violet-a4: hsla(251, 98.3%, 48.2%, 0.087);
945
+ --violet-a5: hsla(252, 99.0%, 45.7%, 0.130);
946
+ --violet-a6: hsla(251, 99.1%, 44.0%, 0.189);
947
+ --violet-a7: hsla(252, 99.5%, 41.7%, 0.279);
948
+ --violet-a8: hsla(252, 100%, 40.7%, 0.400);
949
+ --violet-a9: hsla(252, 99.9%, 35.8%, 0.663);
950
+ --violet-a10: hsla(251, 99.6%, 32.5%, 0.691);
951
+ --violet-a11: hsla(250, 99.8%, 28.4%, 0.726);
952
+ --violet-a12: hsla(249, 100%, 13.1%, 0.851);
953
+ }
954
+
955
+ .dark, .dark-theme {
956
+ --violet-a1: hsla(240, 100%, 49.0%, 0.031);
957
+ --violet-a2: hsla(255, 98.3%, 51.9%, 0.083);
958
+ --violet-a3: hsla(255, 99.8%, 62.8%, 0.169);
959
+ --violet-a4: hsla(252, 99.0%, 65.8%, 0.226);
960
+ --violet-a5: hsla(253, 99.1%, 67.2%, 0.278);
961
+ --violet-a6: hsla(253, 100%, 68.5%, 0.355);
962
+ --violet-a7: hsla(251, 99.5%, 69.8%, 0.490);
963
+ --violet-a8: hsla(250, 99.7%, 70.8%, 0.728);
964
+ --violet-a9: hsla(252, 99.7%, 70.0%, 0.793);
965
+ --violet-a10: hsla(253, 99.9%, 73.5%, 0.853);
966
+ --violet-a11: hsla(255, 100%, 80.0%, 1);
967
+ --violet-a12: hsla(249, 99.5%, 93.5%, 0.996);
968
+ }
969
+
970
+ :root, .light, .light-theme {
971
+ --indigo-1: hsl(225, 60.0%, 99.4%);
972
+ --indigo-2: hsl(223, 100%, 98.6%);
973
+ --indigo-3: hsl(223, 98.4%, 97.1%);
974
+ --indigo-4: hsl(223, 92.9%, 95.0%);
975
+ --indigo-5: hsl(224, 87.1%, 92.0%);
976
+ --indigo-6: hsl(224, 81.9%, 87.8%);
977
+ --indigo-7: hsl(225, 77.4%, 82.1%);
978
+ --indigo-8: hsl(226, 75.4%, 74.5%);
979
+ --indigo-9: hsl(226, 70.0%, 55.5%);
980
+ --indigo-10: hsl(226, 58.6%, 51.3%);
981
+ --indigo-11: hsl(226, 55.0%, 45.0%);
982
+ --indigo-12: hsl(226, 50.0%, 24.0%);
983
+ }
984
+
985
+ .dark, .dark-theme {
986
+ --indigo-1: hsl(229, 24.0%, 10.0%);
987
+ --indigo-2: hsl(230, 36.4%, 12.9%);
988
+ --indigo-3: hsl(228, 42.7%, 18.1%);
989
+ --indigo-4: hsl(227, 45.6%, 21.4%);
990
+ --indigo-5: hsl(227, 47.8%, 24.4%);
991
+ --indigo-6: hsl(226, 50.3%, 28.8%);
992
+ --indigo-7: hsl(226, 53.3%, 36.6%);
993
+ --indigo-8: hsl(226, 60.0%, 52.0%);
994
+ --indigo-9: hsl(226, 70.0%, 55.5%);
995
+ --indigo-10: hsl(230, 73.9%, 63.3%);
996
+ --indigo-11: hsl(235, 100%, 80.0%);
997
+ --indigo-12: hsl(235, 93.0%, 93.0%);
998
+ }
999
+
1000
+ :root, .light, .light-theme {
1001
+ --indigo-a1: hsla(240, 92.6%, 26.5%, 0.008);
1002
+ --indigo-a2: hsla(223, 100%, 51.0%, 0.028);
1003
+ --indigo-a3: hsla(224, 100%, 50.1%, 0.059);
1004
+ --indigo-a4: hsla(223, 98.0%, 48.5%, 0.099);
1005
+ --indigo-a5: hsla(225, 98.6%, 46.4%, 0.150);
1006
+ --indigo-a6: hsla(224, 99.5%, 44.9%, 0.224);
1007
+ --indigo-a7: hsla(225, 99.7%, 43.9%, 0.318);
1008
+ --indigo-a8: hsla(226, 99.5%, 43.1%, 0.448);
1009
+ --indigo-a9: hsla(226, 100%, 41.2%, 0.757);
1010
+ --indigo-a10: hsla(226, 99.8%, 37.1%, 0.773);
1011
+ --indigo-a11: hsla(226, 99.6%, 31.1%, 0.797);
1012
+ --indigo-a12: hsla(226, 99.5%, 13.7%, 0.879);
1013
+ }
1014
+
1015
+ .dark, .dark-theme {
1016
+ --indigo-a1: hsla(240, 100%, 49.5%, 0.035);
1017
+ --indigo-a2: hsla(232, 100%, 50.0%, 0.091);
1018
+ --indigo-a3: hsla(228, 99.8%, 56.8%, 0.182);
1019
+ --indigo-a4: hsla(228, 99.2%, 59.5%, 0.239);
1020
+ --indigo-a5: hsla(227, 99.5%, 59.9%, 0.295);
1021
+ --indigo-a6: hsla(225, 99.6%, 60.9%, 0.373);
1022
+ --indigo-a7: hsla(226, 99.6%, 62.2%, 0.516);
1023
+ --indigo-a8: hsla(226, 100%, 63.4%, 0.788);
1024
+ --indigo-a9: hsla(226, 99.9%, 63.4%, 0.853);
1025
+ --indigo-a10: hsla(230, 99.7%, 69.5%, 0.897);
1026
+ --indigo-a11: hsla(235, 100%, 80.0%, 1);
1027
+ --indigo-a12: hsla(236, 99.5%, 93.5%, 0.996);
1028
+ }
1029
+
1030
+ :root, .light, .light-theme {
1031
+ --blue-1: hsl(206, 100%, 99.2%);
1032
+ --blue-2: hsl(210, 100%, 98.0%);
1033
+ --blue-3: hsl(209, 100%, 96.5%);
1034
+ --blue-4: hsl(210, 98.8%, 94.0%);
1035
+ --blue-5: hsl(209, 95.0%, 90.1%);
1036
+ --blue-6: hsl(209, 81.2%, 84.5%);
1037
+ --blue-7: hsl(208, 77.5%, 76.9%);
1038
+ --blue-8: hsl(206, 81.9%, 65.3%);
1039
+ --blue-9: hsl(206, 100%, 50.0%);
1040
+ --blue-10: hsl(208, 93.5%, 47.4%);
1041
+ --blue-11: hsl(211, 90.0%, 42.0%);
1042
+ --blue-12: hsl(216, 71.0%, 23.0%);
1043
+ }
1044
+
1045
+ .dark, .dark-theme {
1046
+ --blue-1: hsl(212, 35.0%, 9.2%);
1047
+ --blue-2: hsl(216, 50.0%, 11.8%);
1048
+ --blue-3: hsl(214, 57.6%, 15.6%);
1049
+ --blue-4: hsl(214, 62.3%, 18.4%);
1050
+ --blue-5: hsl(213, 66.6%, 21.1%);
1051
+ --blue-6: hsl(212, 72.6%, 25.2%);
1052
+ --blue-7: hsl(211, 81.3%, 32.4%);
1053
+ --blue-8: hsl(211, 85.2%, 47.8%);
1054
+ --blue-9: hsl(206, 100%, 50.0%);
1055
+ --blue-10: hsl(206, 100%, 61.8%);
1056
+ --blue-11: hsl(205, 100%, 71.0%);
1057
+ --blue-12: hsl(205, 100%, 88.0%);
1058
+ }
1059
+
1060
+ :root, .light, .light-theme {
1061
+ --blue-a1: hsla(210, 100%, 51.0%, 0.016);
1062
+ --blue-a2: hsla(210, 100%, 51.0%, 0.040);
1063
+ --blue-a3: hsla(210, 100%, 50.3%, 0.071);
1064
+ --blue-a4: hsla(210, 100%, 50.1%, 0.118);
1065
+ --blue-a5: hsla(209, 99.1%, 49.2%, 0.193);
1066
+ --blue-a6: hsla(209, 99.5%, 45.3%, 0.283);
1067
+ --blue-a7: hsla(208, 99.9%, 43.8%, 0.412);
1068
+ --blue-a8: hsla(206, 99.8%, 45.1%, 0.632);
1069
+ --blue-a9: hsla(206, 100%, 50.0%, 1);
1070
+ --blue-a10: hsla(208, 99.9%, 45.8%, 0.969);
1071
+ --blue-a11: hsla(211, 100%, 39.4%, 0.957);
1072
+ --blue-a12: hsla(216, 99.6%, 17.5%, 0.934);
1073
+ }
1074
+
1075
+ .dark, .dark-theme {
1076
+ --blue-a1: hsla(240, 100%, 49.5%, 0.035);
1077
+ --blue-a2: hsla(227, 100%, 50.0%, 0.091);
1078
+ --blue-a3: hsla(216, 100%, 50.0%, 0.169);
1079
+ --blue-a4: hsla(214, 100%, 49.8%, 0.226);
1080
+ --blue-a5: hsla(213, 99.8%, 50.5%, 0.286);
1081
+ --blue-a6: hsla(212, 99.8%, 51.5%, 0.377);
1082
+ --blue-a7: hsla(211, 99.8%, 51.4%, 0.546);
1083
+ --blue-a8: hsla(211, 99.9%, 53.3%, 0.875);
1084
+ --blue-a9: hsla(206, 100%, 50.0%, 1);
1085
+ --blue-a10: hsla(206, 100%, 61.8%, 1);
1086
+ --blue-a11: hsla(205, 100%, 71.0%, 1);
1087
+ --blue-a12: hsla(206, 100%, 88.0%, 1);
1088
+ }
1089
+
1090
+ :root, .light, .light-theme {
1091
+ --cyan-1: hsl(185, 60.0%, 98.7%);
1092
+ --cyan-2: hsl(185, 73.3%, 97.1%);
1093
+ --cyan-3: hsl(186, 70.2%, 94.4%);
1094
+ --cyan-4: hsl(186, 63.8%, 90.6%);
1095
+ --cyan-5: hsl(187, 58.3%, 85.4%);
1096
+ --cyan-6: hsl(188, 54.6%, 78.4%);
1097
+ --cyan-7: hsl(189, 53.7%, 68.7%);
1098
+ --cyan-8: hsl(189, 60.3%, 52.5%);
1099
+ --cyan-9: hsl(190, 95.0%, 39.0%);
1100
+ --cyan-10: hsl(191, 91.2%, 36.8%);
1101
+ --cyan-11: hsl(192, 85.0%, 31.0%);
1102
+ --cyan-12: hsl(192, 70.0%, 16.5%);
1103
+ }
1104
+
1105
+ .dark, .dark-theme {
1106
+ --cyan-1: hsl(192, 60.0%, 7.2%);
1107
+ --cyan-2: hsl(193, 51.1%, 8.8%);
1108
+ --cyan-3: hsl(193, 51.9%, 11.9%);
1109
+ --cyan-4: hsl(193, 52.6%, 14.1%);
1110
+ --cyan-5: hsl(193, 53.4%, 16.5%);
1111
+ --cyan-6: hsl(192, 54.6%, 20.1%);
1112
+ --cyan-7: hsl(192, 56.6%, 26.5%);
1113
+ --cyan-8: hsl(192, 59.8%, 39.0%);
1114
+ --cyan-9: hsl(190, 95.0%, 39.0%);
1115
+ --cyan-10: hsl(190, 84.0%, 46.0%);
1116
+ --cyan-11: hsl(190, 90.0%, 54.0%);
1117
+ --cyan-12: hsl(190, 80.0%, 84.0%);
1118
+ }
1119
+
1120
+ :root, .light, .light-theme {
1121
+ --cyan-a1: hsla(195, 95.2%, 41.2%, 0.020);
1122
+ --cyan-a2: hsla(185, 99.9%, 42.3%, 0.051);
1123
+ --cyan-a3: hsla(186, 97.8%, 42.2%, 0.095);
1124
+ --cyan-a4: hsla(186, 99.9%, 38.5%, 0.153);
1125
+ --cyan-a5: hsla(187, 99.3%, 36.6%, 0.232);
1126
+ --cyan-a6: hsla(188, 99.4%, 35.4%, 0.334);
1127
+ --cyan-a7: hsla(189, 99.6%, 35.0%, 0.483);
1128
+ --cyan-a8: hsla(189, 99.9%, 37.6%, 0.761);
1129
+ --cyan-a9: hsla(190, 99.8%, 37.8%, 0.981);
1130
+ --cyan-a10: hsla(191, 99.9%, 34.6%, 0.969);
1131
+ --cyan-a11: hsla(192, 100%, 27.6%, 0.953);
1132
+ --cyan-a12: hsla(192, 99.2%, 12.3%, 0.950);
1133
+ }
1134
+
1135
+ .dark, .dark-theme {
1136
+ --cyan-a1: hsla(223, 100%, 49.3%, 0.022);
1137
+ --cyan-a2: hsla(207, 100%, 49.3%, 0.044);
1138
+ --cyan-a3: hsla(197, 100%, 49.6%, 0.096);
1139
+ --cyan-a4: hsla(194, 100%, 49.7%, 0.135);
1140
+ --cyan-a5: hsla(193, 99.5%, 50.2%, 0.178);
1141
+ --cyan-a6: hsla(192, 99.3%, 53.7%, 0.239);
1142
+ --cyan-a7: hsla(192, 100%, 57.5%, 0.355);
1143
+ --cyan-a8: hsla(192, 99.8%, 60.0%, 0.585);
1144
+ --cyan-a9: hsla(190, 100%, 50.0%, 0.736);
1145
+ --cyan-a10: hsla(190, 99.8%, 53.5%, 0.832);
1146
+ --cyan-a11: hsla(190, 99.8%, 56.3%, 0.949);
1147
+ --cyan-a12: hsla(190, 99.6%, 86.7%, 0.966);
1148
+ }
1149
+
1150
+ :root, .light, .light-theme {
1151
+ --teal-1: hsl(165, 60.0%, 98.8%);
1152
+ --teal-2: hsl(169, 64.7%, 96.7%);
1153
+ --teal-3: hsl(169, 59.8%, 94.0%);
1154
+ --teal-4: hsl(169, 53.1%, 90.2%);
1155
+ --teal-5: hsl(170, 47.1%, 85.0%);
1156
+ --teal-6: hsl(170, 42.6%, 77.9%);
1157
+ --teal-7: hsl(170, 39.9%, 68.1%);
1158
+ --teal-8: hsl(172, 42.1%, 52.5%);
1159
+ --teal-9: hsl(173, 80.0%, 36.0%);
1160
+ --teal-10: hsl(173, 83.4%, 32.5%);
1161
+ --teal-11: hsl(174, 90.0%, 25.2%);
1162
+ --teal-12: hsl(174, 65.0%, 14.5%);
1163
+ }
1164
+
1165
+ .dark, .dark-theme {
1166
+ --teal-1: hsl(167, 50.0%, 6.7%);
1167
+ --teal-2: hsl(166, 55.0%, 7.8%);
1168
+ --teal-3: hsl(167, 52.9%, 10.6%);
1169
+ --teal-4: hsl(168, 52.5%, 12.7%);
1170
+ --teal-5: hsl(169, 52.6%, 14.8%);
1171
+ --teal-6: hsl(169, 53.1%, 18.0%);
1172
+ --teal-7: hsl(171, 54.9%, 23.8%);
1173
+ --teal-8: hsl(173, 59.8%, 34.1%);
1174
+ --teal-9: hsl(173, 80.0%, 36.0%);
1175
+ --teal-10: hsl(172, 89.5%, 38.8%);
1176
+ --teal-11: hsl(170, 90.0%, 44.5%);
1177
+ --teal-12: hsl(163, 70.0%, 81.0%);
1178
+ }
1179
+
1180
+ :root, .light, .light-theme {
1181
+ --teal-a1: hsla(165, 95.2%, 41.2%, 0.020);
1182
+ --teal-a2: hsla(169, 99.5%, 39.4%, 0.055);
1183
+ --teal-a3: hsla(167, 97.6%, 38.1%, 0.095);
1184
+ --teal-a4: hsla(168, 98.1%, 34.6%, 0.150);
1185
+ --teal-a5: hsla(170, 99.4%, 32.3%, 0.220);
1186
+ --teal-a6: hsla(170, 99.7%, 30.1%, 0.314);
1187
+ --teal-a7: hsla(170, 99.3%, 28.7%, 0.448);
1188
+ --teal-a8: hsla(172, 99.8%, 29.7%, 0.675);
1189
+ --teal-a9: hsla(173, 99.8%, 31.1%, 0.930);
1190
+ --teal-a10: hsla(173, 99.7%, 28.7%, 0.946);
1191
+ --teal-a11: hsla(174, 99.8%, 23.3%, 0.977);
1192
+ --teal-a12: hsla(174, 99.0%, 10.0%, 0.950);
1193
+ }
1194
+
1195
+ .dark, .dark-theme {
1196
+ --teal-a1: hsla(120, 100%, 48.3%, 0.009);
1197
+ --teal-a2: hsla(141, 100%, 49.0%, 0.031);
1198
+ --teal-a3: hsla(161, 100%, 49.8%, 0.074);
1199
+ --teal-a4: hsla(167, 100%, 49.7%, 0.109);
1200
+ --teal-a5: hsla(167, 100%, 49.8%, 0.148);
1201
+ --teal-a6: hsla(169, 99.2%, 52.5%, 0.200);
1202
+ --teal-a7: hsla(171, 99.3%, 56.5%, 0.304);
1203
+ --teal-a8: hsla(173, 99.9%, 59.0%, 0.498);
1204
+ --teal-a9: hsla(173, 99.8%, 52.7%, 0.611);
1205
+ --teal-a10: hsla(172, 99.9%, 50.8%, 0.706);
1206
+ --teal-a11: hsla(170, 99.8%, 51.6%, 0.832);
1207
+ --teal-a12: hsla(163, 99.4%, 85.9%, 0.936);
1208
+ }
1209
+
1210
+ :root, .light, .light-theme {
1211
+ --green-1: hsl(136, 50.0%, 98.9%);
1212
+ --green-2: hsl(138, 62.5%, 96.9%);
1213
+ --green-3: hsl(139, 55.2%, 94.5%);
1214
+ --green-4: hsl(140, 48.7%, 91.0%);
1215
+ --green-5: hsl(141, 43.7%, 86.0%);
1216
+ --green-6: hsl(143, 40.3%, 79.0%);
1217
+ --green-7: hsl(146, 38.5%, 69.0%);
1218
+ --green-8: hsl(151, 40.2%, 54.1%);
1219
+ --green-9: hsl(151, 55.0%, 41.5%);
1220
+ --green-10: hsl(152, 57.5%, 37.6%);
1221
+ --green-11: hsl(153, 67.0%, 28.5%);
1222
+ --green-12: hsl(155, 40.0%, 16.5%);
1223
+ }
1224
+
1225
+ .dark, .dark-theme {
1226
+ --green-1: hsl(146, 30.0%, 7.4%);
1227
+ --green-2: hsl(154, 31.8%, 8.6%);
1228
+ --green-3: hsl(154, 37.6%, 11.5%);
1229
+ --green-4: hsl(154, 41.0%, 13.6%);
1230
+ --green-5: hsl(154, 43.7%, 15.7%);
1231
+ --green-6: hsl(154, 46.7%, 18.7%);
1232
+ --green-7: hsl(153, 50.3%, 24.4%);
1233
+ --green-8: hsl(151, 52.2%, 36.1%);
1234
+ --green-9: hsl(151, 55.0%, 41.5%);
1235
+ --green-10: hsl(151, 55.2%, 46.7%);
1236
+ --green-11: hsl(151, 65.0%, 54.0%);
1237
+ --green-12: hsl(144, 70.0%, 82.0%);
1238
+ }
1239
+
1240
+ :root, .light, .light-theme {
1241
+ --green-a1: hsla(140, 94.9%, 38.7%, 0.016);
1242
+ --green-a2: hsla(138, 99.9%, 38.5%, 0.051);
1243
+ --green-a3: hsla(139, 97.7%, 36.9%, 0.087);
1244
+ --green-a4: hsla(139, 98.5%, 32.7%, 0.134);
1245
+ --green-a5: hsla(141, 100%, 30.4%, 0.200);
1246
+ --green-a6: hsla(142, 99.0%, 28.9%, 0.295);
1247
+ --green-a7: hsla(146, 99.5%, 27.6%, 0.428);
1248
+ --green-a8: hsla(151, 99.5%, 28.8%, 0.644);
1249
+ --green-a9: hsla(151, 99.9%, 28.0%, 0.812);
1250
+ --green-a10: hsla(152, 99.6%, 25.8%, 0.840);
1251
+ --green-a11: hsla(153, 99.9%, 21.0%, 0.906);
1252
+ --green-a12: hsla(155, 99.9%, 7.4%, 0.902);
1253
+ }
1254
+
1255
+ .dark, .dark-theme {
1256
+ --green-a1: hsla(120, 100%, 43.9%, 0.005);
1257
+ --green-a2: hsla(120, 100%, 49.3%, 0.022);
1258
+ --green-a3: hsla(149, 100%, 49.5%, 0.070);
1259
+ --green-a4: hsla(154, 100%, 49.7%, 0.109);
1260
+ --green-a5: hsla(153, 98.9%, 53.1%, 0.148);
1261
+ --green-a6: hsla(155, 99.1%, 55.5%, 0.200);
1262
+ --green-a7: hsla(152, 99.3%, 59.1%, 0.304);
1263
+ --green-a8: hsla(151, 99.6%, 62.4%, 0.503);
1264
+ --green-a9: hsla(151, 99.6%, 62.4%, 0.607);
1265
+ --green-a10: hsla(151, 100%, 62.9%, 0.697);
1266
+ --green-a11: hsla(151, 99.9%, 63.5%, 0.823);
1267
+ --green-a12: hsla(144, 99.6%, 86.6%, 0.940);
1268
+ }
1269
+
1270
+ :root, .light, .light-theme {
1271
+ --grass-1: hsl(116, 50.0%, 98.9%);
1272
+ --grass-2: hsl(120, 60.0%, 97.1%);
1273
+ --grass-3: hsl(120, 53.6%, 94.8%);
1274
+ --grass-4: hsl(121, 47.5%, 91.4%);
1275
+ --grass-5: hsl(122, 42.6%, 86.5%);
1276
+ --grass-6: hsl(124, 39.0%, 79.7%);
1277
+ --grass-7: hsl(126, 37.1%, 70.2%);
1278
+ --grass-8: hsl(131, 38.1%, 56.3%);
1279
+ --grass-9: hsl(131, 41.0%, 46.5%);
1280
+ --grass-10: hsl(132, 43.1%, 42.2%);
1281
+ --grass-11: hsl(133, 50.0%, 32.5%);
1282
+ --grass-12: hsl(131, 30.0%, 18.0%);
1283
+ }
1284
+
1285
+ .dark, .dark-theme {
1286
+ --grass-1: hsl(146, 30.0%, 7.4%);
1287
+ --grass-2: hsl(138, 20.8%, 9.4%);
1288
+ --grass-3: hsl(138, 25.8%, 12.5%);
1289
+ --grass-4: hsl(138, 28.4%, 14.8%);
1290
+ --grass-5: hsl(137, 30.3%, 17.1%);
1291
+ --grass-6: hsl(137, 32.3%, 20.6%);
1292
+ --grass-7: hsl(135, 34.4%, 27.1%);
1293
+ --grass-8: hsl(131, 35.3%, 40.0%);
1294
+ --grass-9: hsl(131, 41.0%, 46.5%);
1295
+ --grass-10: hsl(131, 41.7%, 55.0%);
1296
+ --grass-11: hsl(131, 50.0%, 63.0%);
1297
+ --grass-12: hsl(120, 60.0%, 85.0%);
1298
+ }
1299
+
1300
+ :root, .light, .light-theme {
1301
+ --grass-a1: hsla(120, 94.9%, 38.7%, 0.016);
1302
+ --grass-a2: hsla(120, 94.9%, 38.7%, 0.048);
1303
+ --grass-a3: hsla(120, 98.0%, 35.5%, 0.079);
1304
+ --grass-a4: hsla(120, 98.7%, 31.5%, 0.126);
1305
+ --grass-a5: hsla(122, 98.5%, 29.9%, 0.193);
1306
+ --grass-a6: hsla(125, 99.2%, 27.9%, 0.283);
1307
+ --grass-a7: hsla(125, 99.9%, 27.0%, 0.408);
1308
+ --grass-a8: hsla(131, 100%, 27.6%, 0.604);
1309
+ --grass-a9: hsla(131, 99.7%, 26.3%, 0.726);
1310
+ --grass-a10: hsla(132, 99.9%, 24.0%, 0.761);
1311
+ --grass-a11: hsla(133, 99.5%, 19.5%, 0.840);
1312
+ --grass-a12: hsla(131, 99.1%, 6.3%, 0.875);
1313
+ }
1314
+
1315
+ .dark, .dark-theme {
1316
+ --grass-a1: hsla(120, 100%, 43.9%, 0.005);
1317
+ --grass-a2: hsla(120, 100%, 49.3%, 0.022);
1318
+ --grass-a3: hsla(139, 97.9%, 54.2%, 0.070);
1319
+ --grass-a4: hsla(137, 99.8%, 60.3%, 0.104);
1320
+ --grass-a5: hsla(138, 99.8%, 62.9%, 0.143);
1321
+ --grass-a6: hsla(136, 99.7%, 66.7%, 0.195);
1322
+ --grass-a7: hsla(135, 99.7%, 68.4%, 0.299);
1323
+ --grass-a8: hsla(131, 99.7%, 71.3%, 0.494);
1324
+ --grass-a9: hsla(131, 99.5%, 69.2%, 0.620);
1325
+ --grass-a10: hsla(131, 100%, 73.5%, 0.710);
1326
+ --grass-a11: hsla(131, 99.8%, 76.6%, 0.797);
1327
+ --grass-a12: hsla(120, 99.1%, 90.3%, 0.936);
1328
+ }
1329
+
1330
+ :root, .light, .light-theme {
1331
+ --orange-1: hsl(24, 70.0%, 99.0%);
1332
+ --orange-2: hsl(22, 100%, 97.8%);
1333
+ --orange-3: hsl(34, 100%, 91.7%);
1334
+ --orange-4: hsl(33, 100%, 86.6%);
1335
+ --orange-5: hsl(31, 100%, 82.2%);
1336
+ --orange-6: hsl(27, 100%, 78.4%);
1337
+ --orange-7: hsl(21, 100%, 74.5%);
1338
+ --orange-8: hsl(19, 80.1%, 64.5%);
1339
+ --orange-9: hsl(24, 94.0%, 50.0%);
1340
+ --orange-10: hsl(24, 100%, 46.5%);
1341
+ --orange-11: hsl(16, 45.0%, 41.5%);
1342
+ --orange-12: hsl(16, 50.0%, 23.0%);
1343
+ }
1344
+
1345
+ .dark, .dark-theme {
1346
+ --orange-1: hsl(30, 70.0%, 7.2%);
1347
+ --orange-2: hsl(29, 81.4%, 8.4%);
1348
+ --orange-3: hsl(26, 68.4%, 12.0%);
1349
+ --orange-4: hsl(25, 64.6%, 14.9%);
1350
+ --orange-5: hsl(25, 64.3%, 17.8%);
1351
+ --orange-6: hsl(25, 65.7%, 21.9%);
1352
+ --orange-7: hsl(25, 67.7%, 29.4%);
1353
+ --orange-8: hsl(25, 70.3%, 44.9%);
1354
+ --orange-9: hsl(24, 94.0%, 50.0%);
1355
+ --orange-10: hsl(24, 100%, 58.5%);
1356
+ --orange-11: hsl(24, 100%, 70.0%);
1357
+ --orange-12: hsl(30, 100%, 88.0%);
1358
+ }
1359
+
1360
+ :root, .light, .light-theme {
1361
+ --orange-a1: hsla(20, 94.9%, 38.7%, 0.016);
1362
+ --orange-a2: hsla(22, 100%, 51.0%, 0.044);
1363
+ --orange-a3: hsla(34, 100%, 50.1%, 0.165);
1364
+ --orange-a4: hsla(33, 100%, 50.1%, 0.267);
1365
+ --orange-a5: hsla(31, 100%, 50.0%, 0.357);
1366
+ --orange-a6: hsla(27, 100%, 50.1%, 0.432);
1367
+ --orange-a7: hsla(21, 100%, 50.0%, 0.510);
1368
+ --orange-a8: hsla(19, 99.7%, 44.5%, 0.640);
1369
+ --orange-a9: hsla(24, 99.9%, 48.4%, 0.969);
1370
+ --orange-a10: hsla(24, 100%, 46.5%, 1);
1371
+ --orange-a11: hsla(16, 99.8%, 24.2%, 0.773);
1372
+ --orange-a12: hsla(16, 99.4%, 13.1%, 0.887);
1373
+ }
1374
+
1375
+ .dark, .dark-theme {
1376
+ --orange-a1: hsla(0, 100%, 49.0%, 0.031);
1377
+ --orange-a2: hsla(0, 100%, 50.0%, 0.065);
1378
+ --orange-a3: hsla(13, 100%, 49.7%, 0.122);
1379
+ --orange-a4: hsla(20, 100%, 50.0%, 0.169);
1380
+ --orange-a5: hsla(24, 100%, 50.0%, 0.221);
1381
+ --orange-a6: hsla(25, 99.8%, 51.4%, 0.299);
1382
+ --orange-a7: hsla(25, 99.8%, 54.7%, 0.442);
1383
+ --orange-a8: hsla(25, 99.8%, 57.3%, 0.741);
1384
+ --orange-a9: hsla(24, 99.9%, 51.4%, 0.966);
1385
+ --orange-a10: hsla(24, 100%, 58.4%, 1);
1386
+ --orange-a11: hsla(24, 100%, 70.0%, 1);
1387
+ --orange-a12: hsla(30, 100%, 88.0%, 1);
1388
+ }
1389
+
1390
+ :root, .light, .light-theme {
1391
+ --brown-1: hsl(30, 40.0%, 99.1%);
1392
+ --brown-2: hsl(30, 50.0%, 97.6%);
1393
+ --brown-3: hsl(30, 52.5%, 94.6%);
1394
+ --brown-4: hsl(30, 53.0%, 91.2%);
1395
+ --brown-5: hsl(29, 52.9%, 86.8%);
1396
+ --brown-6: hsl(29, 52.5%, 80.9%);
1397
+ --brown-7: hsl(29, 51.5%, 72.8%);
1398
+ --brown-8: hsl(28, 50.0%, 63.1%);
1399
+ --brown-9: hsl(28, 34.0%, 51.0%);
1400
+ --brown-10: hsl(26, 31.7%, 46.9%);
1401
+ --brown-11: hsl(25, 30.0%, 39.0%);
1402
+ --brown-12: hsl(20, 15.0%, 21.0%);
1403
+ }
1404
+
1405
+ .dark, .dark-theme {
1406
+ --brown-1: hsl(22, 15.0%, 8.7%);
1407
+ --brown-2: hsl(26, 13.2%, 10.4%);
1408
+ --brown-3: hsl(26, 17.4%, 13.6%);
1409
+ --brown-4: hsl(26, 19.6%, 16.2%);
1410
+ --brown-5: hsl(27, 21.3%, 19.0%);
1411
+ --brown-6: hsl(27, 23.2%, 23.0%);
1412
+ --brown-7: hsl(27, 25.4%, 30.4%);
1413
+ --brown-8: hsl(28, 27.8%, 45.1%);
1414
+ --brown-9: hsl(28, 34.0%, 51.0%);
1415
+ --brown-10: hsl(28, 38.0%, 58.3%);
1416
+ --brown-11: hsl(28, 50.0%, 72.0%);
1417
+ --brown-12: hsl(35, 60.0%, 87.0%);
1418
+ }
1419
+
1420
+ :root, .light, .light-theme {
1421
+ --brown-a1: hsla(30, 94.3%, 34.6%, 0.012);
1422
+ --brown-a2: hsla(30, 94.3%, 34.6%, 0.036);
1423
+ --brown-a3: hsla(30, 97.7%, 33.9%, 0.083);
1424
+ --brown-a4: hsla(31, 98.5%, 34.2%, 0.134);
1425
+ --brown-a5: hsla(29, 100%, 34.3%, 0.200);
1426
+ --brown-a6: hsla(28, 99.2%, 34.6%, 0.291);
1427
+ --brown-a7: hsla(29, 99.8%, 33.8%, 0.412);
1428
+ --brown-a8: hsla(28, 100%, 33.3%, 0.553);
1429
+ --brown-a9: hsla(28, 99.9%, 25.5%, 0.655);
1430
+ --brown-a10: hsla(26, 99.6%, 22.0%, 0.679);
1431
+ --brown-a11: hsla(24, 99.6%, 16.0%, 0.726);
1432
+ --brown-a12: hsla(19, 98.8%, 3.9%, 0.820);
1433
+ }
1434
+
1435
+ .dark, .dark-theme {
1436
+ --brown-a1: hsla(0, 100%, 48.3%, 0.009);
1437
+ --brown-a2: hsla(24, 100%, 50.0%, 0.026);
1438
+ --brown-a3: hsla(25, 98.5%, 67.7%, 0.074);
1439
+ --brown-a4: hsla(26, 97.8%, 70.6%, 0.109);
1440
+ --brown-a5: hsla(26, 98.9%, 72.6%, 0.152);
1441
+ --brown-a6: hsla(27, 99.6%, 74.5%, 0.208);
1442
+ --brown-a7: hsla(28, 98.8%, 75.6%, 0.317);
1443
+ --brown-a8: hsla(28, 99.6%, 76.4%, 0.533);
1444
+ --brown-a9: hsla(28, 99.5%, 74.1%, 0.646);
1445
+ --brown-a10: hsla(28, 99.6%, 77.7%, 0.715);
1446
+ --brown-a11: hsla(28, 99.5%, 83.4%, 0.845);
1447
+ --brown-a12: hsla(34, 99.7%, 91.7%, 0.944);
1448
+ }
1449
+
1450
+ /* brights (black foreground) */
1451
+
1452
+ :root, .light, .light-theme {
1453
+ --sky-1: hsl(193, 100%, 98.8%);
1454
+ --sky-2: hsl(193, 100%, 97.3%);
1455
+ --sky-3: hsl(192, 100%, 94.3%);
1456
+ --sky-4: hsl(193, 93.5%, 90.9%);
1457
+ --sky-5: hsl(193, 79.3%, 85.9%);
1458
+ --sky-6: hsl(194, 66.1%, 78.8%);
1459
+ --sky-7: hsl(194, 60.0%, 69.4%);
1460
+ --sky-8: hsl(193, 65.2%, 56.1%);
1461
+ --sky-9: hsl(193, 98.0%, 74.0%);
1462
+ --sky-10: hsl(193, 90.0%, 71.0%);
1463
+ --sky-11: hsl(200, 60.0%, 36.0%);
1464
+ --sky-12: hsl(195, 50.0%, 20.0%);
1465
+ }
1466
+
1467
+ .dark, .dark-theme {
1468
+ --sky-1: hsl(205, 45.0%, 8.6%);
1469
+ --sky-2: hsl(202, 49.0%, 10.0%);
1470
+ --sky-3: hsl(201, 50.8%, 13.2%);
1471
+ --sky-4: hsl(201, 52.1%, 15.8%);
1472
+ --sky-5: hsl(201, 53.3%, 18.4%);
1473
+ --sky-6: hsl(200, 54.9%, 22.2%);
1474
+ --sky-7: hsl(200, 57.2%, 29.3%);
1475
+ --sky-8: hsl(200, 60.0%, 44.1%);
1476
+ --sky-9: hsl(193, 98.0%, 74.0%);
1477
+ --sky-10: hsl(192, 100%, 77.0%);
1478
+ --sky-11: hsl(195, 100%, 66.0%);
1479
+ --sky-12: hsl(192, 100%, 88.0%);
1480
+ }
1481
+
1482
+ :root, .light, .light-theme {
1483
+ --sky-a1: hsla(190, 100%, 51.0%, 0.024);
1484
+ --sky-a2: hsla(193, 100%, 50.1%, 0.055);
1485
+ --sky-a3: hsla(192, 100%, 50.1%, 0.114);
1486
+ --sky-a4: hsla(193, 99.4%, 47.9%, 0.177);
1487
+ --sky-a5: hsla(194, 100%, 44.5%, 0.251);
1488
+ --sky-a6: hsla(194, 100%, 40.0%, 0.353);
1489
+ --sky-a7: hsla(194, 99.6%, 37.7%, 0.491);
1490
+ --sky-a8: hsla(193, 99.8%, 39.5%, 0.726);
1491
+ --sky-a9: hsla(193, 99.9%, 49.6%, 0.514);
1492
+ --sky-a10: hsla(193, 100%, 47.5%, 0.553);
1493
+ --sky-a11: hsla(200, 100%, 25.2%, 0.855);
1494
+ --sky-a12: hsla(195, 100%, 11.3%, 0.902);
1495
+ }
1496
+
1497
+ .dark, .dark-theme {
1498
+ --sky-a1: hsla(234, 100%, 49.5%, 0.035);
1499
+ --sky-a2: hsla(215, 100%, 49.7%, 0.061);
1500
+ --sky-a3: hsla(204, 100%, 50.0%, 0.117);
1501
+ --sky-a4: hsla(201, 100%, 49.8%, 0.161);
1502
+ --sky-a5: hsla(202, 99.8%, 52.8%, 0.208);
1503
+ --sky-a6: hsla(200, 99.3%, 56.0%, 0.278);
1504
+ --sky-a7: hsla(200, 99.8%, 58.6%, 0.403);
1505
+ --sky-a8: hsla(200, 99.8%, 60.8%, 0.676);
1506
+ --sky-a9: hsla(193, 99.9%, 74.4%, 0.996);
1507
+ --sky-a10: hsla(192, 100%, 77.1%, 1);
1508
+ --sky-a11: hsla(195, 100%, 66.1%, 1);
1509
+ --sky-a12: hsla(192, 100%, 88.0%, 1);
1510
+ }
1511
+
1512
+ :root, .light, .light-theme {
1513
+ --mint-1: hsl(165, 80.0%, 98.8%);
1514
+ --mint-2: hsl(164, 88.2%, 96.7%);
1515
+ --mint-3: hsl(164, 80.4%, 92.6%);
1516
+ --mint-4: hsl(165, 71.6%, 88.4%);
1517
+ --mint-5: hsl(165, 61.0%, 83.4%);
1518
+ --mint-6: hsl(166, 50.2%, 76.7%);
1519
+ --mint-7: hsl(166, 43.3%, 67.2%);
1520
+ --mint-8: hsl(168, 45.0%, 52.9%);
1521
+ --mint-9: hsl(167, 70.0%, 72.0%);
1522
+ --mint-10: hsl(167, 62.0%, 69.0%);
1523
+ --mint-11: hsl(172, 50.0%, 30.5%);
1524
+ --mint-12: hsl(171, 50.0%, 17.5%);
1525
+ }
1526
+
1527
+ .dark, .dark-theme {
1528
+ --mint-1: hsl(173, 50.0%, 6.6%);
1529
+ --mint-2: hsl(174, 51.2%, 8.0%);
1530
+ --mint-3: hsl(174, 53.5%, 10.6%);
1531
+ --mint-4: hsl(174, 55.1%, 12.6%);
1532
+ --mint-5: hsl(173, 56.6%, 14.8%);
1533
+ --mint-6: hsl(173, 58.3%, 17.9%);
1534
+ --mint-7: hsl(172, 60.1%, 23.6%);
1535
+ --mint-8: hsl(170, 59.8%, 35.1%);
1536
+ --mint-9: hsl(167, 70.0%, 72.0%);
1537
+ --mint-10: hsl(163, 80.0%, 77.0%);
1538
+ --mint-11: hsl(167, 70.0%, 58.0%);
1539
+ --mint-12: hsl(155, 70.0%, 86.5%);
1540
+ }
1541
+
1542
+ :root, .light, .light-theme {
1543
+ --mint-a1: hsla(168, 95.4%, 42.8%, 0.024);
1544
+ --mint-a2: hsla(164, 99.1%, 47.1%, 0.063);
1545
+ --mint-a3: hsla(164, 98.9%, 44.4%, 0.134);
1546
+ --mint-a4: hsla(165, 100%, 42.2%, 0.200);
1547
+ --mint-a5: hsla(166, 99.7%, 37.6%, 0.267);
1548
+ --mint-a6: hsla(166, 99.2%, 33.3%, 0.350);
1549
+ --mint-a7: hsla(166, 99.7%, 30.5%, 0.471);
1550
+ --mint-a8: hsla(168, 99.7%, 31.1%, 0.683);
1551
+ --mint-a9: hsla(167, 99.8%, 41.4%, 0.475);
1552
+ --mint-a10: hsla(167, 100%, 38.3%, 0.502);
1553
+ --mint-a11: hsla(172, 99.4%, 18.1%, 0.848);
1554
+ --mint-a12: hsla(171, 99.7%, 9.7%, 0.914);
1555
+ }
1556
+
1557
+ .dark, .dark-theme {
1558
+ --mint-a1: hsla(120, 100%, 43.9%, 0.005);
1559
+ --mint-a2: hsla(165, 100%, 49.0%, 0.031);
1560
+ --mint-a3: hsla(174, 100%, 49.8%, 0.074);
1561
+ --mint-a4: hsla(172, 100%, 49.8%, 0.113);
1562
+ --mint-a5: hsla(172, 100%, 49.9%, 0.152);
1563
+ --mint-a6: hsla(173, 100%, 50.0%, 0.208);
1564
+ --mint-a7: hsla(173, 99.8%, 54.7%, 0.312);
1565
+ --mint-a8: hsla(170, 99.6%, 59.2%, 0.516);
1566
+ --mint-a9: hsla(167, 99.6%, 78.4%, 0.910);
1567
+ --mint-a10: hsla(163, 99.5%, 80.5%, 0.949);
1568
+ --mint-a11: hsla(167, 99.8%, 65.8%, 0.862);
1569
+ --mint-a12: hsla(156, 99.7%, 89.9%, 0.957);
1570
+ }
1571
+
1572
+ :root, .light, .light-theme {
1573
+ --lime-1: hsl(85, 50.0%, 98.7%);
1574
+ --lime-2: hsl(85, 66.7%, 96.5%);
1575
+ --lime-3: hsl(85, 76.8%, 91.7%);
1576
+ --lime-4: hsl(84, 71.6%, 86.6%);
1577
+ --lime-5: hsl(83, 62.5%, 80.8%);
1578
+ --lime-6: hsl(81, 51.6%, 73.6%);
1579
+ --lime-7: hsl(79, 41.5%, 64.4%);
1580
+ --lime-8: hsl(77, 40.2%, 52.2%);
1581
+ --lime-9: hsl(81, 80.0%, 66.0%);
1582
+ --lime-10: hsl(81, 75.0%, 60.0%);
1583
+ --lime-11: hsl(75, 40.0%, 29.0%);
1584
+ --lime-12: hsl(75, 40.0%, 18.0%);
1585
+ }
1586
+
1587
+ .dark, .dark-theme {
1588
+ --lime-1: hsl(75, 55.0%, 6.0%);
1589
+ --lime-2: hsl(78, 41.5%, 8.0%);
1590
+ --lime-3: hsl(81, 38.1%, 11.0%);
1591
+ --lime-4: hsl(81, 39.4%, 13.1%);
1592
+ --lime-5: hsl(81, 40.8%, 15.3%);
1593
+ --lime-6: hsl(80, 42.6%, 18.4%);
1594
+ --lime-7: hsl(78, 45.4%, 24.0%);
1595
+ --lime-8: hsl(75, 49.7%, 35.1%);
1596
+ --lime-9: hsl(81, 80.0%, 66.0%);
1597
+ --lime-10: hsl(75, 85.0%, 60.0%);
1598
+ --lime-11: hsl(70, 70.0%, 50.0%);
1599
+ --lime-12: hsl(80, 80.0%, 85.0%);
1600
+ }
1601
+
1602
+ :root, .light, .light-theme {
1603
+ --lime-a1: hsla(80, 93.8%, 31.4%, 0.020);
1604
+ --lime-a2: hsla(85, 99.3%, 40.2%, 0.059);
1605
+ --lime-a3: hsla(84, 98.6%, 43.6%, 0.146);
1606
+ --lime-a4: hsla(83, 99.4%, 41.7%, 0.232);
1607
+ --lime-a5: hsla(83, 99.8%, 38.8%, 0.314);
1608
+ --lime-a6: hsla(81, 100%, 33.8%, 0.400);
1609
+ --lime-a7: hsla(79, 100%, 29.3%, 0.502);
1610
+ --lime-a8: hsla(77, 99.8%, 28.7%, 0.671);
1611
+ --lime-a9: hsla(81, 99.9%, 44.6%, 0.612);
1612
+ --lime-a10: hsla(81, 100%, 43.0%, 0.702);
1613
+ --lime-a11: hsla(75, 99.5%, 14.3%, 0.828);
1614
+ --lime-a12: hsla(75, 98.9%, 8.0%, 0.891);
1615
+ }
1616
+
1617
+ .dark, .dark-theme {
1618
+ --lime-a1: hsla(74, 99.8%, 4.7%, 0.709);
1619
+ --lime-a2: hsla(114, 100%, 49.3%, 0.022);
1620
+ --lime-a3: hsla(89, 100%, 50.0%, 0.065);
1621
+ --lime-a4: hsla(84, 100%, 49.8%, 0.100);
1622
+ --lime-a5: hsla(81, 98.9%, 53.0%, 0.135);
1623
+ --lime-a6: hsla(80, 99.0%, 57.6%, 0.187);
1624
+ --lime-a7: hsla(78, 99.5%, 60.9%, 0.282);
1625
+ --lime-a8: hsla(75, 99.6%, 63.3%, 0.477);
1626
+ --lime-a9: hsla(81, 99.8%, 70.5%, 0.927);
1627
+ --lime-a10: hsla(75, 99.8%, 63.5%, 0.936);
1628
+ --lime-a11: hsla(70, 99.9%, 58.0%, 0.836);
1629
+ --lime-a12: hsla(80, 99.5%, 87.6%, 0.966);
1630
+ }
1631
+
1632
+ :root, .light, .light-theme {
1633
+ --yellow-1: hsl(60, 54.0%, 98.5%);
1634
+ --yellow-2: hsl(52, 100%, 93.9%);
1635
+ --yellow-3: hsl(53, 100%, 88.9%);
1636
+ --yellow-4: hsl(53, 93.7%, 83.9%);
1637
+ --yellow-5: hsl(52, 84.7%, 78.7%);
1638
+ --yellow-6: hsl(51, 73.0%, 72.4%);
1639
+ --yellow-7: hsl(48, 59.6%, 64.3%);
1640
+ --yellow-8: hsl(46, 55.0%, 52.9%);
1641
+ --yellow-9: hsl(53, 96.0%, 58.0%);
1642
+ --yellow-10: hsl(52, 95.0%, 52.0%);
1643
+ --yellow-11: hsl(42, 50.0%, 31.0%);
1644
+ --yellow-12: hsl(42, 40.0%, 20.0%);
1645
+ }
1646
+
1647
+ .dark, .dark-theme {
1648
+ --yellow-1: hsl(45, 100%, 5.5%);
1649
+ --yellow-2: hsl(44, 78.9%, 7.5%);
1650
+ --yellow-3: hsl(44, 61.9%, 10.6%);
1651
+ --yellow-4: hsl(44, 57.5%, 13.0%);
1652
+ --yellow-5: hsl(45, 57.0%, 15.2%);
1653
+ --yellow-6: hsl(46, 57.5%, 18.3%);
1654
+ --yellow-7: hsl(47, 58.5%, 24.0%);
1655
+ --yellow-8: hsl(50, 59.8%, 35.1%);
1656
+ --yellow-9: hsl(53, 96.0%, 58.0%);
1657
+ --yellow-10: hsl(53, 96.8%, 67.5%);
1658
+ --yellow-11: hsl(55, 100%, 60.0%);
1659
+ --yellow-12: hsl(53, 100%, 84.0%);
1660
+ }
1661
+
1662
+ :root, .light, .light-theme {
1663
+ --yellow-a1: hsla(60, 94.3%, 34.6%, 0.024);
1664
+ --yellow-a2: hsla(52, 100%, 50.2%, 0.122);
1665
+ --yellow-a3: hsla(53, 100%, 50.1%, 0.224);
1666
+ --yellow-a4: hsla(53, 99.8%, 48.2%, 0.314);
1667
+ --yellow-a5: hsla(52, 99.5%, 46.1%, 0.393);
1668
+ --yellow-a6: hsla(51, 99.7%, 42.3%, 0.479);
1669
+ --yellow-a7: hsla(48, 99.8%, 37.3%, 0.569);
1670
+ --yellow-a8: hsla(46, 99.8%, 35.5%, 0.730);
1671
+ --yellow-a9: hsla(53, 99.9%, 49.1%, 0.824);
1672
+ --yellow-a10: hsla(52, 99.8%, 48.8%, 0.938);
1673
+ --yellow-a11: hsla(42, 99.4%, 18.5%, 0.844);
1674
+ --yellow-a12: hsla(42, 99.3%, 9.0%, 0.879);
1675
+ }
1676
+
1677
+ .dark, .dark-theme {
1678
+ --yellow-a1: hsla(0, 100%, 48.3%, 0.018);
1679
+ --yellow-a2: hsla(17, 100%, 49.3%, 0.044);
1680
+ --yellow-a3: hsla(36, 100%, 49.8%, 0.087);
1681
+ --yellow-a4: hsla(41, 100%, 49.7%, 0.122);
1682
+ --yellow-a5: hsla(44, 100%, 49.8%, 0.161);
1683
+ --yellow-a6: hsla(46, 99.2%, 50.8%, 0.213);
1684
+ --yellow-a7: hsla(47, 99.4%, 55.2%, 0.317);
1685
+ --yellow-a8: hsla(50, 99.6%, 59.2%, 0.516);
1686
+ --yellow-a9: hsla(53, 99.9%, 58.9%, 0.983);
1687
+ --yellow-a10: hsla(53, 99.7%, 68.2%, 0.988);
1688
+ --yellow-a11: hsla(55, 100%, 60.0%, 1);
1689
+ --yellow-a12: hsla(53, 100%, 83.9%, 1);
1690
+ }
1691
+
1692
+ :root, .light, .light-theme {
1693
+ --amber-1: hsl(39, 70.0%, 99.0%);
1694
+ --amber-2: hsl(40, 100%, 96.5%);
1695
+ --amber-3: hsl(45, 100%, 90.8%);
1696
+ --amber-4: hsl(44, 100%, 85.8%);
1697
+ --amber-5: hsl(40, 100%, 81.5%);
1698
+ --amber-6: hsl(39, 83.6%, 75.4%);
1699
+ --amber-7: hsl(37, 66.9%, 68.2%);
1700
+ --amber-8: hsl(35, 59.8%, 60.0%);
1701
+ --amber-9: hsl(42, 100%, 62.0%);
1702
+ --amber-10: hsl(42, 100%, 55.0%);
1703
+ --amber-11: hsl(25, 50.0%, 38.0%);
1704
+ --amber-12: hsl(25, 40.0%, 22.0%);
1705
+ }
1706
+
1707
+ .dark, .dark-theme {
1708
+ --amber-1: hsl(36, 100%, 6.1%);
1709
+ --amber-2: hsl(36, 80.5%, 8.0%);
1710
+ --amber-3: hsl(35, 63.4%, 11.4%);
1711
+ --amber-4: hsl(34, 58.8%, 14.1%);
1712
+ --amber-5: hsl(34, 58.1%, 16.7%);
1713
+ --amber-6: hsl(35, 58.3%, 20.5%);
1714
+ --amber-7: hsl(35, 59.0%, 27.4%);
1715
+ --amber-8: hsl(36, 60.2%, 41.4%);
1716
+ --amber-9: hsl(42, 100%, 62.0%);
1717
+ --amber-10: hsl(43, 100%, 64.0%);
1718
+ --amber-11: hsl(43, 100%, 65.0%);
1719
+ --amber-12: hsl(41, 100%, 85.0%);
1720
+ }
1721
+
1722
+ :root, .light, .light-theme {
1723
+ --amber-a1: hsla(40, 94.9%, 38.7%, 0.016);
1724
+ --amber-a2: hsla(40, 100%, 50.3%, 0.071);
1725
+ --amber-a3: hsla(45, 100%, 50.2%, 0.185);
1726
+ --amber-a4: hsla(44, 100%, 50.1%, 0.283);
1727
+ --amber-a5: hsla(40, 100%, 50.1%, 0.369);
1728
+ --amber-a6: hsla(39, 100%, 45.7%, 0.451);
1729
+ --amber-a7: hsla(37, 99.7%, 40.1%, 0.530);
1730
+ --amber-a8: hsla(35, 99.7%, 37.5%, 0.640);
1731
+ --amber-a9: hsla(42, 100%, 50.0%, 0.761);
1732
+ --amber-a10: hsla(42, 100%, 50.1%, 0.899);
1733
+ --amber-a11: hsla(25, 99.9%, 23.5%, 0.812);
1734
+ --amber-a12: hsla(24, 99.6%, 10.2%, 0.867);
1735
+ }
1736
+
1737
+ .dark, .dark-theme {
1738
+ --amber-a1: hsla(0, 100%, 49.0%, 0.031);
1739
+ --amber-a2: hsla(6, 100%, 49.4%, 0.057);
1740
+ --amber-a3: hsla(24, 100%, 50.0%, 0.104);
1741
+ --amber-a4: hsla(30, 100%, 50.0%, 0.143);
1742
+ --amber-a5: hsla(33, 100%, 49.8%, 0.187);
1743
+ --amber-a6: hsla(34, 99.6%, 53.1%, 0.256);
1744
+ --amber-a7: hsla(35, 99.8%, 57.3%, 0.377);
1745
+ --amber-a8: hsla(36, 99.9%, 60.3%, 0.628);
1746
+ --amber-a9: hsla(42, 100%, 62.0%, 1);
1747
+ --amber-a10: hsla(43, 100%, 63.9%, 1);
1748
+ --amber-a11: hsla(43, 100%, 65.1%, 1);
1749
+ --amber-a12: hsla(41, 100%, 85.1%, 1);
1750
+ }
1751
+
1752
+ /* metals */
1753
+
1754
+ :root, .light, .light-theme {
1755
+ --gold-1: hsl(50, 20.0%, 99.1%);
1756
+ --gold-2: hsl(47, 52.9%, 96.7%);
1757
+ --gold-3: hsl(46, 38.2%, 93.7%);
1758
+ --gold-4: hsl(44, 32.7%, 90.1%);
1759
+ --gold-5: hsl(43, 29.9%, 85.7%);
1760
+ --gold-6: hsl(41, 28.3%, 79.8%);
1761
+ --gold-7: hsl(39, 27.6%, 71.9%);
1762
+ --gold-8: hsl(36, 27.2%, 61.8%);
1763
+ --gold-9: hsl(36, 20.0%, 49.5%);
1764
+ --gold-10: hsl(36, 19.9%, 44.9%);
1765
+ --gold-11: hsl(36, 20.0%, 37.0%);
1766
+ --gold-12: hsl(36, 16.0%, 20.0%);
1767
+ }
1768
+
1769
+ .dark, .dark-theme {
1770
+ --gold-1: hsl(44, 9.0%, 8.3%);
1771
+ --gold-2: hsl(45, 8.0%, 9.8%);
1772
+ --gold-3: hsl(44, 9.5%, 13.0%);
1773
+ --gold-4: hsl(43, 10.5%, 15.6%);
1774
+ --gold-5: hsl(42, 11.2%, 18.5%);
1775
+ --gold-6: hsl(41, 12.1%, 22.6%);
1776
+ --gold-7: hsl(39, 13.2%, 29.8%);
1777
+ --gold-8: hsl(35, 14.8%, 45.1%);
1778
+ --gold-9: hsl(36, 20.0%, 49.5%);
1779
+ --gold-10: hsl(36, 21.9%, 56.8%);
1780
+ --gold-11: hsl(35, 30.0%, 71.0%);
1781
+ --gold-12: hsl(35, 25.0%, 88.0%);
1782
+ }
1783
+
1784
+ :root, .light, .light-theme {
1785
+ --gold-a1: hsla(60, 89.3%, 18.3%, 0.012);
1786
+ --gold-a2: hsla(47, 99.9%, 34.6%, 0.051);
1787
+ --gold-a3: hsla(45, 97.0%, 27.9%, 0.087);
1788
+ --gold-a4: hsla(46, 98.0%, 25.4%, 0.134);
1789
+ --gold-a5: hsla(43, 98.4%, 22.6%, 0.185);
1790
+ --gold-a6: hsla(41, 99.7%, 22.0%, 0.259);
1791
+ --gold-a7: hsla(38, 99.8%, 21.5%, 0.357);
1792
+ --gold-a8: hsla(36, 99.3%, 21.5%, 0.487);
1793
+ --gold-a9: hsla(36, 99.9%, 16.2%, 0.604);
1794
+ --gold-a10: hsla(36, 99.1%, 13.9%, 0.640);
1795
+ --gold-a11: hsla(36, 99.8%, 10.6%, 0.706);
1796
+ --gold-a12: hsla(38, 98.0%, 3.8%, 0.832);
1797
+ }
1798
+
1799
+ .dark, .dark-theme {
1800
+ --gold-a1: hsla(45, 99.2%, 3.8%, 0.209);
1801
+ --gold-a2: hsla(42, 100%, 50.0%, 0.013);
1802
+ --gold-a3: hsla(50, 99.6%, 77.3%, 0.052);
1803
+ --gold-a4: hsla(45, 97.6%, 81.5%, 0.087);
1804
+ --gold-a5: hsla(42, 96.5%, 83.3%, 0.122);
1805
+ --gold-a6: hsla(39, 98.3%, 84.3%, 0.178);
1806
+ --gold-a7: hsla(39, 98.6%, 85.2%, 0.269);
1807
+ --gold-a8: hsla(35, 99.4%, 85.7%, 0.468);
1808
+ --gold-a9: hsla(36, 99.8%, 82.1%, 0.550);
1809
+ --gold-a10: hsla(36, 99.7%, 85.0%, 0.628);
1810
+ --gold-a11: hsla(35, 99.9%, 88.9%, 0.775);
1811
+ --gold-a12: hsla(36, 98.3%, 96.7%, 0.901);
1812
+ }
1813
+
1814
+ :root, .light, .light-theme {
1815
+ --bronze-1: hsl(15, 30.0%, 99.1%);
1816
+ --bronze-2: hsl(17, 63.6%, 97.8%);
1817
+ --bronze-3: hsl(17, 42.1%, 95.2%);
1818
+ --bronze-4: hsl(17, 35.2%, 92.1%);
1819
+ --bronze-5: hsl(17, 31.5%, 88.2%);
1820
+ --bronze-6: hsl(17, 29.0%, 83.0%);
1821
+ --bronze-7: hsl(17, 26.9%, 75.6%);
1822
+ --bronze-8: hsl(17, 25.1%, 66.5%);
1823
+ --bronze-9: hsl(17, 20.0%, 54.0%);
1824
+ --bronze-10: hsl(17, 17.9%, 49.3%);
1825
+ --bronze-11: hsl(15, 20.0%, 41.0%);
1826
+ --bronze-12: hsl(12, 22.0%, 21.5%);
1827
+ }
1828
+
1829
+ .dark, .dark-theme {
1830
+ --bronze-1: hsl(17, 10.0%, 8.8%);
1831
+ --bronze-2: hsl(15, 7.7%, 10.2%);
1832
+ --bronze-3: hsl(15, 10.2%, 13.9%);
1833
+ --bronze-4: hsl(16, 11.5%, 16.8%);
1834
+ --bronze-5: hsl(16, 12.4%, 19.7%);
1835
+ --bronze-6: hsl(16, 13.4%, 24.1%);
1836
+ --bronze-7: hsl(17, 14.7%, 31.9%);
1837
+ --bronze-8: hsl(18, 16.0%, 47.6%);
1838
+ --bronze-9: hsl(17, 20.0%, 54.0%);
1839
+ --bronze-10: hsl(18, 23.6%, 60.8%);
1840
+ --bronze-11: hsl(18, 35.0%, 74.0%);
1841
+ --bronze-12: hsl(22, 35.0%, 89.0%);
1842
+ }
1843
+
1844
+ :root, .light, .light-theme {
1845
+ --bronze-a1: hsla(0, 89.3%, 18.3%, 0.012);
1846
+ --bronze-a2: hsla(17, 95.1%, 40.1%, 0.036);
1847
+ --bronze-a3: hsla(18, 98.3%, 29.8%, 0.067);
1848
+ --bronze-a4: hsla(17, 99.6%, 26.0%, 0.106);
1849
+ --bronze-a5: hsla(19, 99.6%, 23.8%, 0.157);
1850
+ --bronze-a6: hsla(17, 99.2%, 22.5%, 0.220);
1851
+ --bronze-a7: hsla(18, 99.7%, 21.6%, 0.310);
1852
+ --bronze-a8: hsla(17, 99.5%, 20.2%, 0.420);
1853
+ --bronze-a9: hsla(18, 99.9%, 16.7%, 0.553);
1854
+ --bronze-a10: hsla(17, 99.0%, 14.9%, 0.597);
1855
+ --bronze-a11: hsla(15, 99.5%, 12.0%, 0.671);
1856
+ --bronze-a12: hsla(12, 98.7%, 5.7%, 0.832);
1857
+ }
1858
+
1859
+ .dark, .dark-theme {
1860
+ --bronze-a1: hsla(0, 100%, 43.9%, 0.005);
1861
+ --bronze-a2: hsla(15, 92.7%, 53.0%, 0.018);
1862
+ --bronze-a3: hsla(17, 99.6%, 78.8%, 0.065);
1863
+ --bronze-a4: hsla(18, 99.5%, 81.1%, 0.104);
1864
+ --bronze-a5: hsla(15, 98.2%, 82.8%, 0.139);
1865
+ --bronze-a6: hsla(18, 97.7%, 82.9%, 0.200);
1866
+ --bronze-a7: hsla(17, 99.4%, 84.2%, 0.299);
1867
+ --bronze-a8: hsla(18, 99.4%, 84.8%, 0.507);
1868
+ --bronze-a9: hsla(18, 99.1%, 84.3%, 0.594);
1869
+ --bronze-a10: hsla(19, 100%, 86.0%, 0.671);
1870
+ --bronze-a11: hsla(18, 99.9%, 88.7%, 0.814);
1871
+ --bronze-a12: hsla(21, 97.9%, 95.7%, 0.923);
1872
+ }
1873
+
1874
+ /* grays */
1875
+
1876
+ :root, .light, .light-theme {
1877
+ --gray-1: hsl(0, 0%, 99.0%);
1878
+ --gray-2: hsl(0, 0%, 97.5%);
1879
+ --gray-3: hsl(0, 0%, 94.6%);
1880
+ --gray-4: hsl(0, 0%, 92.0%);
1881
+ --gray-5: hsl(0, 0%, 89.5%);
1882
+ --gray-6: hsl(0, 0%, 86.8%);
1883
+ --gray-7: hsl(0, 0%, 83.0%);
1884
+ --gray-8: hsl(0, 0%, 73.2%);
1885
+ --gray-9: hsl(0, 0%, 55.2%);
1886
+ --gray-10: hsl(0, 0%, 50.3%);
1887
+ --gray-11: hsl(0, 0%, 39.3%);
1888
+ --gray-12: hsl(0, 0%, 12.5%);
1889
+ }
1890
+
1891
+ .dark, .dark-theme {
1892
+ --gray-1: hsl(0, 0%, 9.5%);
1893
+ --gray-2: hsl(0, 0%, 10.5%);
1894
+ --gray-3: hsl(0, 0%, 15.8%);
1895
+ --gray-4: hsl(0, 0%, 18.9%);
1896
+ --gray-5: hsl(0, 0%, 21.7%);
1897
+ --gray-6: hsl(0, 0%, 24.7%);
1898
+ --gray-7: hsl(0, 0%, 29.1%);
1899
+ --gray-8: hsl(0, 0%, 37.5%);
1900
+ --gray-9: hsl(0, 0%, 43.0%);
1901
+ --gray-10: hsl(0, 0%, 50.7%);
1902
+ --gray-11: hsl(0, 0%, 69.5%);
1903
+ --gray-12: hsl(0, 0%, 93.5%);
1904
+ }
1905
+
1906
+ :root, .light, .light-theme {
1907
+ --gray-a1: hsla(0, 0%, 0%, 0.012);
1908
+ --gray-a2: hsla(0, 0%, 0%, 0.024);
1909
+ --gray-a3: hsla(0, 0%, 0%, 0.055);
1910
+ --gray-a4: hsla(0, 0%, 0%, 0.078);
1911
+ --gray-a5: hsla(0, 0%, 0%, 0.106);
1912
+ --gray-a6: hsla(0, 0%, 0%, 0.133);
1913
+ --gray-a7: hsla(0, 0%, 0%, 0.169);
1914
+ --gray-a8: hsla(0, 0%, 0%, 0.267);
1915
+ --gray-a9: hsla(0, 0%, 0%, 0.447);
1916
+ --gray-a10: hsla(0, 0%, 0%, 0.498);
1917
+ --gray-a11: hsla(0, 0%, 0%, 0.608);
1918
+ --gray-a12: hsla(0, 0%, 0%, 0.875);
1919
+ }
1920
+
1921
+ .dark, .dark-theme {
1922
+ --gray-a1: hsla(0, 0%, 100%, 0);
1923
+ --gray-a2: hsla(0, 0%, 100%, 0.013);
1924
+ --gray-a3: hsla(0, 0%, 100%, 0.069);
1925
+ --gray-a4: hsla(0, 0%, 100%, 0.104);
1926
+ --gray-a5: hsla(0, 0%, 100%, 0.134);
1927
+ --gray-a6: hsla(0, 0%, 100%, 0.169);
1928
+ --gray-a7: hsla(0, 0%, 100%, 0.216);
1929
+ --gray-a8: hsla(0, 0%, 100%, 0.312);
1930
+ --gray-a9: hsla(0, 0%, 100%, 0.372);
1931
+ --gray-a10: hsla(0, 0%, 100%, 0.455);
1932
+ --gray-a11: hsla(0, 0%, 100%, 0.662);
1933
+ --gray-a12: hsla(0, 0%, 100%, 0.926);
1934
+ }
1935
+
1936
+ :root, .light, .light-theme {
1937
+ --mauve-1: hsl(300, 26.0%, 99.0%);
1938
+ --mauve-2: hsl(270, 20.0%, 98.0%);
1939
+ --mauve-3: hsl(267, 13.8%, 95.3%);
1940
+ --mauve-4: hsl(265, 12.2%, 92.7%);
1941
+ --mauve-5: hsl(263, 11.6%, 90.3%);
1942
+ --mauve-6: hsl(261, 11.1%, 87.7%);
1943
+ --mauve-7: hsl(257, 10.8%, 84.3%);
1944
+ --mauve-8: hsl(249, 10.4%, 75.5%);
1945
+ --mauve-9: hsl(252, 6.0%, 57.3%);
1946
+ --mauve-10: hsl(250, 5.0%, 52.3%);
1947
+ --mauve-11: hsl(252, 5.0%, 40.7%);
1948
+ --mauve-12: hsl(260, 10.0%, 13.5%);
1949
+ }
1950
+
1951
+ .dark, .dark-theme {
1952
+ --mauve-1: hsl(300, 5.0%, 9.5%);
1953
+ --mauve-2: hsl(300, 7.1%, 11.0%);
1954
+ --mauve-3: hsl(290, 6.2%, 16.2%);
1955
+ --mauve-4: hsl(285, 5.8%, 19.5%);
1956
+ --mauve-5: hsl(280, 5.6%, 22.4%);
1957
+ --mauve-6: hsl(276, 5.4%, 25.7%);
1958
+ --mauve-7: hsl(269, 5.3%, 30.3%);
1959
+ --mauve-8: hsl(258, 5.0%, 39.2%);
1960
+ --mauve-9: hsl(250, 5.0%, 45.0%);
1961
+ --mauve-10: hsl(252, 4.3%, 52.3%);
1962
+ --mauve-11: hsl(250, 6.0%, 70.5%);
1963
+ --mauve-12: hsl(240, 7.0%, 93.8%);
1964
+ }
1965
+
1966
+ :root, .light, .light-theme {
1967
+ --mauve-a1: hsla(300, 89.3%, 18.3%, 0.012);
1968
+ --mauve-a2: hsla(270, 89.3%, 18.3%, 0.024);
1969
+ --mauve-a3: hsla(270, 98.8%, 14.4%, 0.055);
1970
+ --mauve-a4: hsla(264, 93.8%, 12.6%, 0.083);
1971
+ --mauve-a5: hsla(270, 98.4%, 10.9%, 0.110);
1972
+ --mauve-a6: hsla(266, 94.9%, 10.5%, 0.138);
1973
+ --mauve-a7: hsla(255, 97.2%, 9.3%, 0.173);
1974
+ --mauve-a8: hsla(249, 98.4%, 9.6%, 0.271);
1975
+ --mauve-a9: hsla(249, 99.9%, 5.7%, 0.451);
1976
+ --mauve-a10: hsla(250, 99.8%, 4.7%, 0.502);
1977
+ --mauve-a11: hsla(252, 98.8%, 3.2%, 0.612);
1978
+ --mauve-a12: hsla(257, 96.0%, 1.6%, 0.879);
1979
+ }
1980
+
1981
+ .dark, .dark-theme {
1982
+ --mauve-a1: hsla(300, 100%, 43.9%, 0.005);
1983
+ --mauve-a2: hsla(300, 99.7%, 69.7%, 0.026);
1984
+ --mauve-a3: hsla(288, 96.3%, 88.3%, 0.087);
1985
+ --mauve-a4: hsla(280, 96.6%, 90.3%, 0.126);
1986
+ --mauve-a5: hsla(280, 98.8%, 92.4%, 0.156);
1987
+ --mauve-a6: hsla(274, 98.7%, 92.9%, 0.195);
1988
+ --mauve-a7: hsla(270, 98.6%, 93.6%, 0.247);
1989
+ --mauve-a8: hsla(258, 98.4%, 94.3%, 0.351);
1990
+ --mauve-a9: hsla(251, 98.3%, 94.7%, 0.416);
1991
+ --mauve-a10: hsla(251, 99.3%, 95.6%, 0.498);
1992
+ --mauve-a11: hsla(253, 98.2%, 97.4%, 0.693);
1993
+ --mauve-a12: hsla(240, 82.2%, 99.5%, 0.936);
1994
+ }
1995
+
1996
+ :root, .light, .light-theme {
1997
+ --slate-1: hsl(240, 22.0%, 99.0%);
1998
+ --slate-2: hsl(240, 20.0%, 98.0%);
1999
+ --slate-3: hsl(239, 13.4%, 95.4%);
2000
+ --slate-4: hsl(238, 11.8%, 92.9%);
2001
+ --slate-5: hsl(237, 11.1%, 90.5%);
2002
+ --slate-6: hsl(236, 10.6%, 87.9%);
2003
+ --slate-7: hsl(234, 10.4%, 84.4%);
2004
+ --slate-8: hsl(231, 10.2%, 75.1%);
2005
+ --slate-9: hsl(230, 6.0%, 57.0%);
2006
+ --slate-10: hsl(227, 5.2%, 51.8%);
2007
+ --slate-11: hsl(220, 6.0%, 40.0%);
2008
+ --slate-12: hsl(210, 12.0%, 12.5%);
2009
+ }
2010
+
2011
+ .dark, .dark-theme {
2012
+ --slate-1: hsl(240, 5.0%, 9.8%);
2013
+ --slate-2: hsl(240, 6.9%, 11.4%);
2014
+ --slate-3: hsl(227, 6.7%, 16.4%);
2015
+ --slate-4: hsl(222, 6.6%, 19.4%);
2016
+ --slate-5: hsl(218, 6.5%, 22.1%);
2017
+ --slate-6: hsl(214, 6.4%, 25.1%);
2018
+ --slate-7: hsl(209, 6.2%, 29.4%);
2019
+ --slate-8: hsl(202, 5.8%, 37.5%);
2020
+ --slate-9: hsl(220, 6.0%, 44.0%);
2021
+ --slate-10: hsl(218, 5.3%, 51.5%);
2022
+ --slate-11: hsl(220, 7.0%, 70.0%);
2023
+ --slate-12: hsl(220, 7.0%, 93.5%);
2024
+ }
2025
+
2026
+ :root, .light, .light-theme {
2027
+ --slate-a1: hsla(240, 89.3%, 18.3%, 0.012);
2028
+ --slate-a2: hsla(240, 89.3%, 18.3%, 0.024);
2029
+ --slate-a3: hsla(240, 99.7%, 11.6%, 0.051);
2030
+ --slate-a4: hsla(240, 93.2%, 10.6%, 0.079);
2031
+ --slate-a5: hsla(240, 98.8%, 9.4%, 0.106);
2032
+ --slate-a6: hsla(240, 94.6%, 9.3%, 0.134);
2033
+ --slate-a7: hsla(233, 97.2%, 9.3%, 0.173);
2034
+ --slate-a8: hsla(231, 98.1%, 9.4%, 0.275);
2035
+ --slate-a9: hsla(231, 99.6%, 5.6%, 0.455);
2036
+ --slate-a10: hsla(230, 99.5%, 4.7%, 0.506);
2037
+ --slate-a11: hsla(220, 98.0%, 3.8%, 0.624);
2038
+ --slate-a12: hsla(210, 95.1%, 1.9%, 0.891);
2039
+ }
2040
+
2041
+ .dark, .dark-theme {
2042
+ --slate-a1: hsla(240, 92.7%, 53.0%, 0.009);
2043
+ --slate-a2: hsla(240, 92.5%, 72.7%, 0.031);
2044
+ --slate-a3: hsla(230, 99.3%, 87.0%, 0.091);
2045
+ --slate-a4: hsla(223, 97.1%, 88.8%, 0.126);
2046
+ --slate-a5: hsla(223, 99.0%, 91.1%, 0.156);
2047
+ --slate-a6: hsla(218, 97.1%, 91.5%, 0.191);
2048
+ --slate-a7: hsla(210, 97.4%, 91.7%, 0.243);
2049
+ --slate-a8: hsla(202, 97.3%, 93.4%, 0.334);
2050
+ --slate-a9: hsla(219, 97.6%, 93.2%, 0.412);
2051
+ --slate-a10: hsla(217, 98.3%, 94.7%, 0.494);
2052
+ --slate-a11: hsla(218, 98.5%, 96.8%, 0.693);
2053
+ --slate-a12: hsla(220, 87.4%, 99.3%, 0.936);
2054
+ }
2055
+
2056
+ :root, .light, .light-theme {
2057
+ --sage-1: hsl(155, 30.0%, 98.8%);
2058
+ --sage-2: hsl(150, 14.3%, 97.3%);
2059
+ --sage-3: hsl(150, 8.0%, 94.5%);
2060
+ --sage-4: hsl(150, 6.0%, 92.0%);
2061
+ --sage-5: hsl(150, 4.9%, 89.5%);
2062
+ --sage-6: hsl(150, 4.3%, 86.7%);
2063
+ --sage-7: hsl(150, 3.7%, 82.8%);
2064
+ --sage-8: hsl(150, 2.9%, 72.9%);
2065
+ --sage-9: hsl(155, 3.5%, 54.2%);
2066
+ --sage-10: hsl(158, 2.9%, 49.3%);
2067
+ --sage-11: hsl(155, 3.0%, 38.5%);
2068
+ --sage-12: hsl(155, 12.0%, 11.5%);
2069
+ }
2070
+
2071
+ .dark, .dark-theme {
2072
+ --sage-1: hsl(155, 7.0%, 9.2%);
2073
+ --sage-2: hsl(150, 7.7%, 10.2%);
2074
+ --sage-3: hsl(151, 5.5%, 15.2%);
2075
+ --sage-4: hsl(152, 4.7%, 18.3%);
2076
+ --sage-5: hsl(153, 4.2%, 21.1%);
2077
+ --sage-6: hsl(153, 3.7%, 24.2%);
2078
+ --sage-7: hsl(154, 3.3%, 28.7%);
2079
+ --sage-8: hsl(156, 2.6%, 37.1%);
2080
+ --sage-9: hsl(155, 6.0%, 41.5%);
2081
+ --sage-10: hsl(157, 4.6%, 49.2%);
2082
+ --sage-11: hsl(155, 5.0%, 68.3%);
2083
+ --sage-12: hsl(155, 7.0%, 93.0%);
2084
+ }
2085
+
2086
+ :root, .light, .light-theme {
2087
+ --sage-a1: hsla(150, 92.6%, 26.5%, 0.016);
2088
+ --sage-a2: hsla(150, 86.2%, 14.2%, 0.032);
2089
+ --sage-a3: hsla(150, 95.7%, 6.9%, 0.059);
2090
+ --sage-a4: hsla(160, 89.0%, 7.6%, 0.087);
2091
+ --sage-a5: hsla(140, 96.8%, 5.5%, 0.110);
2092
+ --sage-a6: hsla(140, 88.8%, 4.8%, 0.138);
2093
+ --sage-a7: hsla(140, 91.7%, 3.6%, 0.177);
2094
+ --sage-a8: hsla(150, 93.2%, 3.0%, 0.279);
2095
+ --sage-a9: hsla(158, 97.0%, 3.4%, 0.475);
2096
+ --sage-a10: hsla(163, 97.0%, 2.7%, 0.522);
2097
+ --sage-a11: hsla(160, 95.5%, 2.0%, 0.628);
2098
+ --sage-a12: hsla(154, 93.5%, 1.6%, 0.899);
2099
+ }
2100
+
2101
+ .dark, .dark-theme {
2102
+ --sage-a1: hsla(126, 100%, 43.9%, 0.005);
2103
+ --sage-a2: hsla(150, 92.7%, 53.0%, 0.018);
2104
+ --sage-a3: hsla(150, 95.5%, 88.9%, 0.074);
2105
+ --sage-a4: hsla(156, 93.3%, 90.4%, 0.109);
2106
+ --sage-a5: hsla(150, 94.8%, 94.0%, 0.139);
2107
+ --sage-a6: hsla(156, 92.8%, 93.9%, 0.174);
2108
+ --sage-a7: hsla(156, 92.4%, 95.3%, 0.226);
2109
+ --sage-a8: hsla(156, 91.7%, 96.6%, 0.317);
2110
+ --sage-a9: hsla(157, 99.8%, 93.3%, 0.381);
2111
+ --sage-a10: hsla(158, 96.8%, 95.2%, 0.464);
2112
+ --sage-a11: hsla(158, 98.1%, 97.6%, 0.667);
2113
+ --sage-a12: hsla(150, 88.0%, 99.5%, 0.927);
2114
+ }
2115
+
2116
+ :root, .light, .light-theme {
2117
+ --olive-1: hsl(110, 20.0%, 99.0%);
2118
+ --olive-2: hsl(120, 16.7%, 97.6%);
2119
+ --olive-3: hsl(118, 8.4%, 94.8%);
2120
+ --olive-4: hsl(116, 6.0%, 92.1%);
2121
+ --olive-5: hsl(115, 4.9%, 89.4%);
2122
+ --olive-6: hsl(113, 4.2%, 86.5%);
2123
+ --olive-7: hsl(111, 3.6%, 82.6%);
2124
+ --olive-8: hsl(105, 2.9%, 72.9%);
2125
+ --olive-9: hsl(110, 3.0%, 54.5%);
2126
+ --olive-10: hsl(105, 2.7%, 49.4%);
2127
+ --olive-11: hsl(110, 3.0%, 38.5%);
2128
+ --olive-12: hsl(110, 8.0%, 12.0%);
2129
+ }
2130
+
2131
+ .dark, .dark-theme {
2132
+ --olive-1: hsl(110, 5.0%, 9.2%);
2133
+ --olive-2: hsl(120, 5.7%, 10.4%);
2134
+ --olive-3: hsl(120, 4.3%, 15.4%);
2135
+ --olive-4: hsl(120, 3.9%, 18.5%);
2136
+ --olive-5: hsl(120, 3.6%, 21.2%);
2137
+ --olive-6: hsl(120, 3.3%, 24.3%);
2138
+ --olive-7: hsl(120, 3.0%, 28.7%);
2139
+ --olive-8: hsl(120, 2.6%, 37.1%);
2140
+ --olive-9: hsl(110, 6.0%, 41.5%);
2141
+ --olive-10: hsl(106, 4.6%, 49.3%);
2142
+ --olive-11: hsl(110, 5.0%, 68.8%);
2143
+ --olive-12: hsl(110, 7.0%, 93.0%);
2144
+ }
2145
+
2146
+ :root, .light, .light-theme {
2147
+ --olive-a1: hsla(120, 89.3%, 18.3%, 0.012);
2148
+ --olive-a2: hsla(120, 87.7%, 16.0%, 0.028);
2149
+ --olive-a3: hsla(120, 97.6%, 7.3%, 0.055);
2150
+ --olive-a4: hsla(120, 85.8%, 5.5%, 0.083);
2151
+ --olive-a5: hsla(120, 95.2%, 3.7%, 0.110);
2152
+ --olive-a6: hsla(120, 87.7%, 4.7%, 0.142);
2153
+ --olive-a7: hsla(100, 90.6%, 3.6%, 0.181);
2154
+ --olive-a8: hsla(105, 93.2%, 3.0%, 0.279);
2155
+ --olive-a9: hsla(103, 97.1%, 3.0%, 0.471);
2156
+ --olive-a10: hsla(110, 97.1%, 2.3%, 0.518);
2157
+ --olive-a11: hsla(110, 95.5%, 2.0%, 0.628);
2158
+ --olive-a12: hsla(108, 92.4%, 1.2%, 0.891);
2159
+ }
2160
+
2161
+ .dark, .dark-theme {
2162
+ --olive-a1: hsla(120, 100%, 43.9%, 0.005);
2163
+ --olive-a2: hsla(120, 90.5%, 63.9%, 0.018);
2164
+ --olive-a3: hsla(120, 94.1%, 91.6%, 0.074);
2165
+ --olive-a4: hsla(120, 91.8%, 92.2%, 0.109);
2166
+ --olive-a5: hsla(120, 94.8%, 94.0%, 0.139);
2167
+ --olive-a6: hsla(120, 91.2%, 95.1%, 0.174);
2168
+ --olive-a7: hsla(120, 97.5%, 96.4%, 0.221);
2169
+ --olive-a8: hsla(120, 91.7%, 96.6%, 0.317);
2170
+ --olive-a9: hsla(106, 99.8%, 93.3%, 0.381);
2171
+ --olive-a10: hsla(104, 96.8%, 95.2%, 0.464);
2172
+ --olive-a11: hsla(105, 100%, 97.7%, 0.671);
2173
+ --olive-a12: hsla(120, 88.0%, 99.5%, 0.927);
2174
+ }
2175
+
2176
+ :root, .light, .light-theme {
2177
+ --sand-1: hsl(50, 20.0%, 99.0%);
2178
+ --sand-2: hsl(60, 7.7%, 97.5%);
2179
+ --sand-3: hsl(59, 5.8%, 94.5%);
2180
+ --sand-4: hsl(58, 5.3%, 91.8%);
2181
+ --sand-5: hsl(57, 5.1%, 89.0%);
2182
+ --sand-6: hsl(56, 5.0%, 86.0%);
2183
+ --sand-7: hsl(54, 4.9%, 81.8%);
2184
+ --sand-8: hsl(51, 5.0%, 72.4%);
2185
+ --sand-9: hsl(60, 3.0%, 53.9%);
2186
+ --sand-10: hsl(60, 2.6%, 49.0%);
2187
+ --sand-11: hsl(50, 2.5%, 38.0%);
2188
+ --sand-12: hsl(50, 8.0%, 12.0%);
2189
+ }
2190
+
2191
+ .dark, .dark-theme {
2192
+ --sand-1: hsl(60, 6.0%, 9.0%);
2193
+ --sand-2: hsl(60, 1.9%, 10.4%);
2194
+ --sand-3: hsl(56, 2.4%, 15.4%);
2195
+ --sand-4: hsl(53, 2.7%, 18.4%);
2196
+ --sand-5: hsl(51, 2.9%, 21.2%);
2197
+ --sand-6: hsl(49, 3.1%, 24.3%);
2198
+ --sand-7: hsl(47, 3.3%, 28.7%);
2199
+ --sand-8: hsl(43, 3.7%, 37.1%);
2200
+ --sand-9: hsl(50, 4.0%, 41.8%);
2201
+ --sand-10: hsl(48, 3.5%, 49.5%);
2202
+ --sand-11: hsl(50, 5.0%, 68.3%);
2203
+ --sand-12: hsl(56, 7.0%, 93.0%);
2204
+ }
2205
+
2206
+ :root, .light, .light-theme {
2207
+ --sand-a1: hsla(60, 89.3%, 18.3%, 0.012);
2208
+ --sand-a2: hsla(60, 78.1%, 9.0%, 0.028);
2209
+ --sand-a3: hsla(60, 95.7%, 6.9%, 0.059);
2210
+ --sand-a4: hsla(60, 84.4%, 5.3%, 0.087);
2211
+ --sand-a5: hsla(60, 93.5%, 3.7%, 0.114);
2212
+ --sand-a6: hsla(60, 86.7%, 4.6%, 0.146);
2213
+ --sand-a7: hsla(48, 92.1%, 5.5%, 0.193);
2214
+ --sand-a8: hsla(51, 94.5%, 5.0%, 0.291);
2215
+ --sand-a9: hsla(60, 96.6%, 3.0%, 0.475);
2216
+ --sand-a10: hsla(60, 96.5%, 2.3%, 0.522);
2217
+ --sand-a11: hsla(60, 94.0%, 1.7%, 0.632);
2218
+ --sand-a12: hsla(48, 92.4%, 1.2%, 0.891);
2219
+ }
2220
+
2221
+ .dark, .dark-theme {
2222
+ --sand-a1: hsla(60, 98.4%, 4.7%, 0.084);
2223
+ --sand-a2: hsla(60, 99.4%, 84.8%, 0.013);
2224
+ --sand-a3: hsla(60, 85.5%, 93.4%, 0.070);
2225
+ --sand-a4: hsla(60, 97.7%, 96.1%, 0.104);
2226
+ --sand-a5: hsla(45, 94.8%, 94.0%, 0.139);
2227
+ --sand-a6: hsla(45, 91.2%, 95.1%, 0.174);
2228
+ --sand-a7: hsla(48, 92.4%, 95.3%, 0.226);
2229
+ --sand-a8: hsla(43, 95.9%, 95.5%, 0.321);
2230
+ --sand-a9: hsla(47, 98.1%, 95.2%, 0.377);
2231
+ --sand-a10: hsla(47, 96.1%, 96.0%, 0.464);
2232
+ --sand-a11: hsla(52, 98.1%, 97.6%, 0.667);
2233
+ --sand-a12: hsla(60, 88.0%, 99.5%, 0.927);
2234
+ }
2235
+
2236
+ /* overlays */
2237
+
2238
+ :root {
2239
+ --black-a1: hsla(0, 0%, 0%, 0.012);
2240
+ --black-a2: hsla(0, 0%, 0%, 0.024);
2241
+ --black-a3: hsla(0, 0%, 0%, 0.055);
2242
+ --black-a4: hsla(0, 0%, 0%, 0.078);
2243
+ --black-a5: hsla(0, 0%, 0%, 0.106);
2244
+ --black-a6: hsla(0, 0%, 0%, 0.133);
2245
+ --black-a7: hsla(0, 0%, 0%, 0.169);
2246
+ --black-a8: hsla(0, 0%, 0%, 0.267);
2247
+ --black-a9: hsla(0, 0%, 0%, 0.447);
2248
+ --black-a10: hsla(0, 0%, 0%, 0.498);
2249
+ --black-a11: hsla(0, 0%, 0%, 0.608);
2250
+ --black-a12: hsla(0, 0%, 0%, 0.875);
2251
+ }
2252
+
2253
+ :root {
2254
+ --white-a1: hsla(0, 0%, 0%, 0);
2255
+ --white-a2: hsla(0, 0%, 100%, 0.013);
2256
+ --white-a3: hsla(0, 0%, 100%, 0.069);
2257
+ --white-a4: hsla(0, 0%, 100%, 0.104);
2258
+ --white-a5: hsla(0, 0%, 100%, 0.134);
2259
+ --white-a6: hsla(0, 0%, 100%, 0.169);
2260
+ --white-a7: hsla(0, 0%, 100%, 0.216);
2261
+ --white-a8: hsla(0, 0%, 100%, 0.312);
2262
+ --white-a9: hsla(0, 0%, 100%, 0.372);
2263
+ --white-a10: hsla(0, 0%, 100%, 0.455);
2264
+ --white-a11: hsla(0, 0%, 100%, 0.662);
2265
+ --white-a12: hsla(0, 0%, 100%, 0.926);
2266
+ }
2267
+
2268
+ .parrot-theme {
2269
+ --color-sucess: var(--green-10);
2270
+ --color-error: var(--tomato-10);
2271
+ --color-warning: var(--amber-10);
2272
+ --color-info: var(--blue-10);
2273
+ }
2274
+
2275
+ [data-color="sand"] {
2276
+ --color-1: var(--sand-1);
2277
+ --color-a1: var(--sand-a1);
2278
+ --color-2: var(--sand-2);
2279
+ --color-a2: var(--sand-a2);
2280
+ --color-3: var(--sand-3);
2281
+ --color-a3: var(--sand-a3);
2282
+ --color-4: var(--sand-4);
2283
+ --color-a4: var(--sand-a4);
2284
+ --color-5: var(--sand-5);
2285
+ --color-a5: var(--sand-a5);
2286
+ --color-6: var(--sand-6);
2287
+ --color-a6: var(--sand-a6);
2288
+ --color-7: var(--sand-7);
2289
+ --color-a7: var(--sand-a7);
2290
+ --color-8: var(--sand-8);
2291
+ --color-a8: var(--sand-a8);
2292
+ --color-9: var(--sand-9);
2293
+ --color-a9: var(--sand-a9);
2294
+ --color-10: var(--sand-10);
2295
+ --color-a10: var(--sand-a10);
2296
+ --color-11: var(--sand-11);
2297
+ --color-a11: var(--sand-a11);
2298
+ --color-12: var(--sand-12);
2299
+ --color-a12: var(--sand-a12);
2300
+ --color-contrast: white;
2301
+ }
2302
+
2303
+ [data-color="olive"] {
2304
+ --color-1: var(--olive-1);
2305
+ --color-a1: var(--olive-a1);
2306
+ --color-2: var(--olive-2);
2307
+ --color-a2: var(--olive-a2);
2308
+ --color-3: var(--olive-3);
2309
+ --color-a3: var(--olive-a3);
2310
+ --color-4: var(--olive-4);
2311
+ --color-a4: var(--olive-a4);
2312
+ --color-5: var(--olive-5);
2313
+ --color-a5: var(--olive-a5);
2314
+ --color-6: var(--olive-6);
2315
+ --color-a6: var(--olive-a6);
2316
+ --color-7: var(--olive-7);
2317
+ --color-a7: var(--olive-a7);
2318
+ --color-8: var(--olive-8);
2319
+ --color-a8: var(--olive-a8);
2320
+ --color-9: var(--olive-9);
2321
+ --color-a9: var(--olive-a9);
2322
+ --color-10: var(--olive-10);
2323
+ --color-a10: var(--olive-a10);
2324
+ --color-11: var(--olive-11);
2325
+ --color-a11: var(--olive-a11);
2326
+ --color-12: var(--olive-12);
2327
+ --color-a12: var(--olive-a12);
2328
+ --color-contrast: white;
2329
+ }
2330
+
2331
+ [data-color="sage"] {
2332
+ --color-1: var(--sage-1);
2333
+ --color-a1: var(--sage-a1);
2334
+ --color-2: var(--sage-2);
2335
+ --color-a2: var(--sage-a2);
2336
+ --color-3: var(--sage-3);
2337
+ --color-a3: var(--sage-a3);
2338
+ --color-4: var(--sage-4);
2339
+ --color-a4: var(--sage-a4);
2340
+ --color-5: var(--sage-5);
2341
+ --color-a5: var(--sage-a5);
2342
+ --color-6: var(--sage-6);
2343
+ --color-a6: var(--sage-a6);
2344
+ --color-7: var(--sage-7);
2345
+ --color-a7: var(--sage-a7);
2346
+ --color-8: var(--sage-8);
2347
+ --color-a8: var(--sage-a8);
2348
+ --color-9: var(--sage-9);
2349
+ --color-a9: var(--sage-a9);
2350
+ --color-10: var(--sage-10);
2351
+ --color-a10: var(--sage-a10);
2352
+ --color-11: var(--sage-11);
2353
+ --color-a11: var(--sage-a11);
2354
+ --color-12: var(--sage-12);
2355
+ --color-a12: var(--sage-a12);
2356
+ --color-contrast: white;
2357
+ }
2358
+
2359
+ [data-color="slate"] {
2360
+ --color-1: var(--slate-1);
2361
+ --color-a1: var(--slate-a1);
2362
+ --color-2: var(--slate-2);
2363
+ --color-a2: var(--slate-a2);
2364
+ --color-3: var(--slate-3);
2365
+ --color-a3: var(--slate-a3);
2366
+ --color-4: var(--slate-4);
2367
+ --color-a4: var(--slate-a4);
2368
+ --color-5: var(--slate-5);
2369
+ --color-a5: var(--slate-a5);
2370
+ --color-6: var(--slate-6);
2371
+ --color-a6: var(--slate-a6);
2372
+ --color-7: var(--slate-7);
2373
+ --color-a7: var(--slate-a7);
2374
+ --color-8: var(--slate-8);
2375
+ --color-a8: var(--slate-a8);
2376
+ --color-9: var(--slate-9);
2377
+ --color-a9: var(--slate-a9);
2378
+ --color-10: var(--slate-10);
2379
+ --color-a10: var(--slate-a10);
2380
+ --color-11: var(--slate-11);
2381
+ --color-a11: var(--slate-a11);
2382
+ --color-12: var(--slate-12);
2383
+ --color-a12: var(--slate-a12);
2384
+ --color-contrast: white;
2385
+ }
2386
+
2387
+ [data-color="mauve"] {
2388
+ --color-1: var(--mauve-1);
2389
+ --color-a1: var(--mauve-a1);
2390
+ --color-2: var(--mauve-2);
2391
+ --color-a2: var(--mauve-a2);
2392
+ --color-3: var(--mauve-3);
2393
+ --color-a3: var(--mauve-a3);
2394
+ --color-4: var(--mauve-4);
2395
+ --color-a4: var(--mauve-a4);
2396
+ --color-5: var(--mauve-5);
2397
+ --color-a5: var(--mauve-a5);
2398
+ --color-6: var(--mauve-6);
2399
+ --color-a6: var(--mauve-a6);
2400
+ --color-7: var(--mauve-7);
2401
+ --color-a7: var(--mauve-a7);
2402
+ --color-8: var(--mauve-8);
2403
+ --color-a8: var(--mauve-a8);
2404
+ --color-9: var(--mauve-9);
2405
+ --color-a9: var(--mauve-a9);
2406
+ --color-10: var(--mauve-10);
2407
+ --color-a10: var(--mauve-a10);
2408
+ --color-11: var(--mauve-11);
2409
+ --color-a11: var(--mauve-a11);
2410
+ --color-12: var(--mauve-12);
2411
+ --color-a12: var(--mauve-a12);
2412
+ --color-contrast: white;
2413
+ }
2414
+
2415
+ [data-color="gray"] {
2416
+ --color-1: var(--gray-1);
2417
+ --color-a1: var(--gray-a1);
2418
+ --color-2: var(--gray-2);
2419
+ --color-a2: var(--gray-a2);
2420
+ --color-3: var(--gray-3);
2421
+ --color-a3: var(--gray-a3);
2422
+ --color-4: var(--gray-4);
2423
+ --color-a4: var(--gray-a4);
2424
+ --color-5: var(--gray-5);
2425
+ --color-a5: var(--gray-a5);
2426
+ --color-6: var(--gray-6);
2427
+ --color-a6: var(--gray-a6);
2428
+ --color-7: var(--gray-7);
2429
+ --color-a7: var(--gray-a7);
2430
+ --color-8: var(--gray-8);
2431
+ --color-a8: var(--gray-a8);
2432
+ --color-9: var(--gray-9);
2433
+ --color-a9: var(--gray-a9);
2434
+ --color-10: var(--gray-10);
2435
+ --color-a10: var(--gray-a10);
2436
+ --color-11: var(--gray-11);
2437
+ --color-a11: var(--gray-a11);
2438
+ --color-12: var(--gray-12);
2439
+ --color-a12: var(--gray-a12);
2440
+ --color-contrast: white;
2441
+ }
2442
+
2443
+ [data-color="bronze"] {
2444
+ --color-1: var(--bronze-1);
2445
+ --color-a1: var(--bronze-a1);
2446
+ --color-2: var(--bronze-2);
2447
+ --color-a2: var(--bronze-a2);
2448
+ --color-3: var(--bronze-3);
2449
+ --color-a3: var(--bronze-a3);
2450
+ --color-4: var(--bronze-4);
2451
+ --color-a4: var(--bronze-a4);
2452
+ --color-5: var(--bronze-5);
2453
+ --color-a5: var(--bronze-a5);
2454
+ --color-6: var(--bronze-6);
2455
+ --color-a6: var(--bronze-a6);
2456
+ --color-7: var(--bronze-7);
2457
+ --color-a7: var(--bronze-a7);
2458
+ --color-8: var(--bronze-8);
2459
+ --color-a8: var(--bronze-a8);
2460
+ --color-9: var(--bronze-9);
2461
+ --color-a9: var(--bronze-a9);
2462
+ --color-10: var(--bronze-10);
2463
+ --color-a10: var(--bronze-a10);
2464
+ --color-11: var(--bronze-11);
2465
+ --color-a11: var(--bronze-a11);
2466
+ --color-12: var(--bronze-12);
2467
+ --color-a12: var(--bronze-a12);
2468
+ --color-contrast: white;
2469
+ }
2470
+
2471
+ [data-color="gold"] {
2472
+ --color-1: var(--gold-1);
2473
+ --color-a1: var(--gold-a1);
2474
+ --color-2: var(--gold-2);
2475
+ --color-a2: var(--gold-a2);
2476
+ --color-3: var(--gold-3);
2477
+ --color-a3: var(--gold-a3);
2478
+ --color-4: var(--gold-4);
2479
+ --color-a4: var(--gold-a4);
2480
+ --color-5: var(--gold-5);
2481
+ --color-a5: var(--gold-a5);
2482
+ --color-6: var(--gold-6);
2483
+ --color-a6: var(--gold-a6);
2484
+ --color-7: var(--gold-7);
2485
+ --color-a7: var(--gold-a7);
2486
+ --color-8: var(--gold-8);
2487
+ --color-a8: var(--gold-a8);
2488
+ --color-9: var(--gold-9);
2489
+ --color-a9: var(--gold-a9);
2490
+ --color-10: var(--gold-10);
2491
+ --color-a10: var(--gold-a10);
2492
+ --color-11: var(--gold-11);
2493
+ --color-a11: var(--gold-a11);
2494
+ --color-12: var(--gold-12);
2495
+ --color-a12: var(--gold-a12);
2496
+ --color-contrast: white;
2497
+ }
2498
+
2499
+ [data-color="amber"] {
2500
+ --color-1: var(--amber-1);
2501
+ --color-a1: var(--amber-a1);
2502
+ --color-2: var(--amber-2);
2503
+ --color-a2: var(--amber-a2);
2504
+ --color-3: var(--amber-3);
2505
+ --color-a3: var(--amber-a3);
2506
+ --color-4: var(--amber-4);
2507
+ --color-a4: var(--amber-a4);
2508
+ --color-5: var(--amber-5);
2509
+ --color-a5: var(--amber-a5);
2510
+ --color-6: var(--amber-6);
2511
+ --color-a6: var(--amber-a6);
2512
+ --color-7: var(--amber-7);
2513
+ --color-a7: var(--amber-a7);
2514
+ --color-8: var(--amber-8);
2515
+ --color-a8: var(--amber-a8);
2516
+ --color-9: var(--amber-9);
2517
+ --color-a9: var(--amber-a9);
2518
+ --color-10: var(--amber-10);
2519
+ --color-a10: var(--amber-a10);
2520
+ --color-11: var(--amber-11);
2521
+ --color-a11: var(--amber-a11);
2522
+ --color-12: var(--amber-12);
2523
+ --color-a12: var(--amber-a12);
2524
+ --color-contrast: --amber-12;
2525
+ }
2526
+
2527
+ [data-color="yellow"] {
2528
+ --color-1: var(--yellow-1);
2529
+ --color-a1: var(--yellow-a1);
2530
+ --color-2: var(--yellow-2);
2531
+ --color-a2: var(--yellow-a2);
2532
+ --color-3: var(--yellow-3);
2533
+ --color-a3: var(--yellow-a3);
2534
+ --color-4: var(--yellow-4);
2535
+ --color-a4: var(--yellow-a4);
2536
+ --color-5: var(--yellow-5);
2537
+ --color-a5: var(--yellow-a5);
2538
+ --color-6: var(--yellow-6);
2539
+ --color-a6: var(--yellow-a6);
2540
+ --color-7: var(--yellow-7);
2541
+ --color-a7: var(--yellow-a7);
2542
+ --color-8: var(--yellow-8);
2543
+ --color-a8: var(--yellow-a8);
2544
+ --color-9: var(--yellow-9);
2545
+ --color-a9: var(--yellow-a9);
2546
+ --color-10: var(--yellow-10);
2547
+ --color-a10: var(--yellow-a10);
2548
+ --color-11: var(--yellow-11);
2549
+ --color-a11: var(--yellow-a11);
2550
+ --color-12: var(--yellow-12);
2551
+ --color-a12: var(--yellow-a12);
2552
+ --color-contrast: --yellow-12;
2553
+ }
2554
+
2555
+ [data-color="lime"] {
2556
+ --color-1: var(--lime-1);
2557
+ --color-a1: var(--lime-a1);
2558
+ --color-2: var(--lime-2);
2559
+ --color-a2: var(--lime-a2);
2560
+ --color-3: var(--lime-3);
2561
+ --color-a3: var(--lime-a3);
2562
+ --color-4: var(--lime-4);
2563
+ --color-a4: var(--lime-a4);
2564
+ --color-5: var(--lime-5);
2565
+ --color-a5: var(--lime-a5);
2566
+ --color-6: var(--lime-6);
2567
+ --color-a6: var(--lime-a6);
2568
+ --color-7: var(--lime-7);
2569
+ --color-a7: var(--lime-a7);
2570
+ --color-8: var(--lime-8);
2571
+ --color-a8: var(--lime-a8);
2572
+ --color-9: var(--lime-9);
2573
+ --color-a9: var(--lime-a9);
2574
+ --color-10: var(--lime-10);
2575
+ --color-a10: var(--lime-a10);
2576
+ --color-11: var(--lime-11);
2577
+ --color-a11: var(--lime-a11);
2578
+ --color-12: var(--lime-12);
2579
+ --color-a12: var(--lime-a12);
2580
+ --color-contrast: --lime-12;
2581
+ }
2582
+
2583
+ [data-color="mint"] {
2584
+ --color-1: var(--mint-1);
2585
+ --color-a1: var(--mint-a1);
2586
+ --color-2: var(--mint-2);
2587
+ --color-a2: var(--mint-a2);
2588
+ --color-3: var(--mint-3);
2589
+ --color-a3: var(--mint-a3);
2590
+ --color-4: var(--mint-4);
2591
+ --color-a4: var(--mint-a4);
2592
+ --color-5: var(--mint-5);
2593
+ --color-a5: var(--mint-a5);
2594
+ --color-6: var(--mint-6);
2595
+ --color-a6: var(--mint-a6);
2596
+ --color-7: var(--mint-7);
2597
+ --color-a7: var(--mint-a7);
2598
+ --color-8: var(--mint-8);
2599
+ --color-a8: var(--mint-a8);
2600
+ --color-9: var(--mint-9);
2601
+ --color-a9: var(--mint-a9);
2602
+ --color-10: var(--mint-10);
2603
+ --color-a10: var(--mint-a10);
2604
+ --color-11: var(--mint-11);
2605
+ --color-a11: var(--mint-a11);
2606
+ --color-12: var(--mint-12);
2607
+ --color-a12: var(--mint-a12);
2608
+ --color-contrast: --mint-12;
2609
+ }
2610
+
2611
+ [data-color="sky"] {
2612
+ --color-1: var(--sky-1);
2613
+ --color-a1: var(--sky-a1);
2614
+ --color-2: var(--sky-2);
2615
+ --color-a2: var(--sky-a2);
2616
+ --color-3: var(--sky-3);
2617
+ --color-a3: var(--sky-a3);
2618
+ --color-4: var(--sky-4);
2619
+ --color-a4: var(--sky-a4);
2620
+ --color-5: var(--sky-5);
2621
+ --color-a5: var(--sky-a5);
2622
+ --color-6: var(--sky-6);
2623
+ --color-a6: var(--sky-a6);
2624
+ --color-7: var(--sky-7);
2625
+ --color-a7: var(--sky-a7);
2626
+ --color-8: var(--sky-8);
2627
+ --color-a8: var(--sky-a8);
2628
+ --color-9: var(--sky-9);
2629
+ --color-a9: var(--sky-a9);
2630
+ --color-10: var(--sky-10);
2631
+ --color-a10: var(--sky-a10);
2632
+ --color-11: var(--sky-11);
2633
+ --color-a11: var(--sky-a11);
2634
+ --color-12: var(--sky-12);
2635
+ --color-a12: var(--sky-a12);
2636
+ --color-contrast: --sky-12;
2637
+ }
2638
+
2639
+ [data-color="brown"] {
2640
+ --color-1: var(--brown-1);
2641
+ --color-a1: var(--brown-a1);
2642
+ --color-2: var(--brown-2);
2643
+ --color-a2: var(--brown-a2);
2644
+ --color-3: var(--brown-3);
2645
+ --color-a3: var(--brown-a3);
2646
+ --color-4: var(--brown-4);
2647
+ --color-a4: var(--brown-a4);
2648
+ --color-5: var(--brown-5);
2649
+ --color-a5: var(--brown-a5);
2650
+ --color-6: var(--brown-6);
2651
+ --color-a6: var(--brown-a6);
2652
+ --color-7: var(--brown-7);
2653
+ --color-a7: var(--brown-a7);
2654
+ --color-8: var(--brown-8);
2655
+ --color-a8: var(--brown-a8);
2656
+ --color-9: var(--brown-9);
2657
+ --color-a9: var(--brown-a9);
2658
+ --color-10: var(--brown-10);
2659
+ --color-a10: var(--brown-a10);
2660
+ --color-11: var(--brown-11);
2661
+ --color-a11: var(--brown-a11);
2662
+ --color-12: var(--brown-12);
2663
+ --color-a12: var(--brown-a12);
2664
+ --color-contrast: white;
2665
+ }
2666
+
2667
+ [data-color="orange"] {
2668
+ --color-1: var(--orange-1);
2669
+ --color-a1: var(--orange-a1);
2670
+ --color-2: var(--orange-2);
2671
+ --color-a2: var(--orange-a2);
2672
+ --color-3: var(--orange-3);
2673
+ --color-a3: var(--orange-a3);
2674
+ --color-4: var(--orange-4);
2675
+ --color-a4: var(--orange-a4);
2676
+ --color-5: var(--orange-5);
2677
+ --color-a5: var(--orange-a5);
2678
+ --color-6: var(--orange-6);
2679
+ --color-a6: var(--orange-a6);
2680
+ --color-7: var(--orange-7);
2681
+ --color-a7: var(--orange-a7);
2682
+ --color-8: var(--orange-8);
2683
+ --color-a8: var(--orange-a8);
2684
+ --color-9: var(--orange-9);
2685
+ --color-a9: var(--orange-a9);
2686
+ --color-10: var(--orange-10);
2687
+ --color-a10: var(--orange-a10);
2688
+ --color-11: var(--orange-11);
2689
+ --color-a11: var(--orange-a11);
2690
+ --color-12: var(--orange-12);
2691
+ --color-a12: var(--orange-a12);
2692
+ --color-contrast: white;
2693
+ }
2694
+
2695
+ [data-color="grass"] {
2696
+ --color-1: var(--grass-1);
2697
+ --color-a1: var(--grass-a1);
2698
+ --color-2: var(--grass-2);
2699
+ --color-a2: var(--grass-a2);
2700
+ --color-3: var(--grass-3);
2701
+ --color-a3: var(--grass-a3);
2702
+ --color-4: var(--grass-4);
2703
+ --color-a4: var(--grass-a4);
2704
+ --color-5: var(--grass-5);
2705
+ --color-a5: var(--grass-a5);
2706
+ --color-6: var(--grass-6);
2707
+ --color-a6: var(--grass-a6);
2708
+ --color-7: var(--grass-7);
2709
+ --color-a7: var(--grass-a7);
2710
+ --color-8: var(--grass-8);
2711
+ --color-a8: var(--grass-a8);
2712
+ --color-9: var(--grass-9);
2713
+ --color-a9: var(--grass-a9);
2714
+ --color-10: var(--grass-10);
2715
+ --color-a10: var(--grass-a10);
2716
+ --color-11: var(--grass-11);
2717
+ --color-a11: var(--grass-a11);
2718
+ --color-12: var(--grass-12);
2719
+ --color-a12: var(--grass-a12);
2720
+ --color-contrast: white;
2721
+ }
2722
+
2723
+ [data-color="green"] {
2724
+ --color-1: var(--green-1);
2725
+ --color-a1: var(--green-a1);
2726
+ --color-2: var(--green-2);
2727
+ --color-a2: var(--green-a2);
2728
+ --color-3: var(--green-3);
2729
+ --color-a3: var(--green-a3);
2730
+ --color-4: var(--green-4);
2731
+ --color-a4: var(--green-a4);
2732
+ --color-5: var(--green-5);
2733
+ --color-a5: var(--green-a5);
2734
+ --color-6: var(--green-6);
2735
+ --color-a6: var(--green-a6);
2736
+ --color-7: var(--green-7);
2737
+ --color-a7: var(--green-a7);
2738
+ --color-8: var(--green-8);
2739
+ --color-a8: var(--green-a8);
2740
+ --color-9: var(--green-9);
2741
+ --color-a9: var(--green-a9);
2742
+ --color-10: var(--green-10);
2743
+ --color-a10: var(--green-a10);
2744
+ --color-11: var(--green-11);
2745
+ --color-a11: var(--green-a11);
2746
+ --color-12: var(--green-12);
2747
+ --color-a12: var(--green-a12);
2748
+ --color-contrast: white;
2749
+ }
2750
+
2751
+ [data-color="teal"] {
2752
+ --color-1: var(--teal-1);
2753
+ --color-a1: var(--teal-a1);
2754
+ --color-2: var(--teal-2);
2755
+ --color-a2: var(--teal-a2);
2756
+ --color-3: var(--teal-3);
2757
+ --color-a3: var(--teal-a3);
2758
+ --color-4: var(--teal-4);
2759
+ --color-a4: var(--teal-a4);
2760
+ --color-5: var(--teal-5);
2761
+ --color-a5: var(--teal-a5);
2762
+ --color-6: var(--teal-6);
2763
+ --color-a6: var(--teal-a6);
2764
+ --color-7: var(--teal-7);
2765
+ --color-a7: var(--teal-a7);
2766
+ --color-8: var(--teal-8);
2767
+ --color-a8: var(--teal-a8);
2768
+ --color-9: var(--teal-9);
2769
+ --color-a9: var(--teal-a9);
2770
+ --color-10: var(--teal-10);
2771
+ --color-a10: var(--teal-a10);
2772
+ --color-11: var(--teal-11);
2773
+ --color-a11: var(--teal-a11);
2774
+ --color-12: var(--teal-12);
2775
+ --color-a12: var(--teal-a12);
2776
+ --color-contrast: white;
2777
+ }
2778
+
2779
+ [data-color="cyan"] {
2780
+ --color-1: var(--cyan-1);
2781
+ --color-a1: var(--cyan-a1);
2782
+ --color-2: var(--cyan-2);
2783
+ --color-a2: var(--cyan-a2);
2784
+ --color-3: var(--cyan-3);
2785
+ --color-a3: var(--cyan-a3);
2786
+ --color-4: var(--cyan-4);
2787
+ --color-a4: var(--cyan-a4);
2788
+ --color-5: var(--cyan-5);
2789
+ --color-a5: var(--cyan-a5);
2790
+ --color-6: var(--cyan-6);
2791
+ --color-a6: var(--cyan-a6);
2792
+ --color-7: var(--cyan-7);
2793
+ --color-a7: var(--cyan-a7);
2794
+ --color-8: var(--cyan-8);
2795
+ --color-a8: var(--cyan-a8);
2796
+ --color-9: var(--cyan-9);
2797
+ --color-a9: var(--cyan-a9);
2798
+ --color-10: var(--cyan-10);
2799
+ --color-a10: var(--cyan-a10);
2800
+ --color-11: var(--cyan-11);
2801
+ --color-a11: var(--cyan-a11);
2802
+ --color-12: var(--cyan-12);
2803
+ --color-a12: var(--cyan-a12);
2804
+ --color-contrast: white;
2805
+ }
2806
+
2807
+ [data-color="blue"] {
2808
+ --color-1: var(--blue-1);
2809
+ --color-a1: var(--blue-a1);
2810
+ --color-2: var(--blue-2);
2811
+ --color-a2: var(--blue-a2);
2812
+ --color-3: var(--blue-3);
2813
+ --color-a3: var(--blue-a3);
2814
+ --color-4: var(--blue-4);
2815
+ --color-a4: var(--blue-a4);
2816
+ --color-5: var(--blue-5);
2817
+ --color-a5: var(--blue-a5);
2818
+ --color-6: var(--blue-6);
2819
+ --color-a6: var(--blue-a6);
2820
+ --color-7: var(--blue-7);
2821
+ --color-a7: var(--blue-a7);
2822
+ --color-8: var(--blue-8);
2823
+ --color-a8: var(--blue-a8);
2824
+ --color-9: var(--blue-9);
2825
+ --color-a9: var(--blue-a9);
2826
+ --color-10: var(--blue-10);
2827
+ --color-a10: var(--blue-a10);
2828
+ --color-11: var(--blue-11);
2829
+ --color-a11: var(--blue-a11);
2830
+ --color-12: var(--blue-12);
2831
+ --color-a12: var(--blue-a12);
2832
+ --color-contrast: white;
2833
+ }
2834
+
2835
+ [data-color="indigo"] {
2836
+ --color-1: var(--indigo-1);
2837
+ --color-a1: var(--indigo-a1);
2838
+ --color-2: var(--indigo-2);
2839
+ --color-a2: var(--indigo-a2);
2840
+ --color-3: var(--indigo-3);
2841
+ --color-a3: var(--indigo-a3);
2842
+ --color-4: var(--indigo-4);
2843
+ --color-a4: var(--indigo-a4);
2844
+ --color-5: var(--indigo-5);
2845
+ --color-a5: var(--indigo-a5);
2846
+ --color-6: var(--indigo-6);
2847
+ --color-a6: var(--indigo-a6);
2848
+ --color-7: var(--indigo-7);
2849
+ --color-a7: var(--indigo-a7);
2850
+ --color-8: var(--indigo-8);
2851
+ --color-a8: var(--indigo-a8);
2852
+ --color-9: var(--indigo-9);
2853
+ --color-a9: var(--indigo-a9);
2854
+ --color-10: var(--indigo-10);
2855
+ --color-a10: var(--indigo-a10);
2856
+ --color-11: var(--indigo-11);
2857
+ --color-a11: var(--indigo-a11);
2858
+ --color-12: var(--indigo-12);
2859
+ --color-a12: var(--indigo-a12);
2860
+ --color-contrast: white;
2861
+ }
2862
+
2863
+ [data-color="violet"] {
2864
+ --color-1: var(--violet-1);
2865
+ --color-a1: var(--violet-a1);
2866
+ --color-2: var(--violet-2);
2867
+ --color-a2: var(--violet-a2);
2868
+ --color-3: var(--violet-3);
2869
+ --color-a3: var(--violet-a3);
2870
+ --color-4: var(--violet-4);
2871
+ --color-a4: var(--violet-a4);
2872
+ --color-5: var(--violet-5);
2873
+ --color-a5: var(--violet-a5);
2874
+ --color-6: var(--violet-6);
2875
+ --color-a6: var(--violet-a6);
2876
+ --color-7: var(--violet-7);
2877
+ --color-a7: var(--violet-a7);
2878
+ --color-8: var(--violet-8);
2879
+ --color-a8: var(--violet-a8);
2880
+ --color-9: var(--violet-9);
2881
+ --color-a9: var(--violet-a9);
2882
+ --color-10: var(--violet-10);
2883
+ --color-a10: var(--violet-a10);
2884
+ --color-11: var(--violet-11);
2885
+ --color-a11: var(--violet-a11);
2886
+ --color-12: var(--violet-12);
2887
+ --color-a12: var(--violet-a12);
2888
+ --color-contrast: white;
2889
+ }
2890
+
2891
+ [data-color="purple"] {
2892
+ --color-1: var(--purple-1);
2893
+ --color-a1: var(--purple-a1);
2894
+ --color-2: var(--purple-2);
2895
+ --color-a2: var(--purple-a2);
2896
+ --color-3: var(--purple-3);
2897
+ --color-a3: var(--purple-a3);
2898
+ --color-4: var(--purple-4);
2899
+ --color-a4: var(--purple-a4);
2900
+ --color-5: var(--purple-5);
2901
+ --color-a5: var(--purple-a5);
2902
+ --color-6: var(--purple-6);
2903
+ --color-a6: var(--purple-a6);
2904
+ --color-7: var(--purple-7);
2905
+ --color-a7: var(--purple-a7);
2906
+ --color-8: var(--purple-8);
2907
+ --color-a8: var(--purple-a8);
2908
+ --color-9: var(--purple-9);
2909
+ --color-a9: var(--purple-a9);
2910
+ --color-10: var(--purple-10);
2911
+ --color-a10: var(--purple-a10);
2912
+ --color-11: var(--purple-11);
2913
+ --color-a11: var(--purple-a11);
2914
+ --color-12: var(--purple-12);
2915
+ --color-a12: var(--purple-a12);
2916
+ --color-contrast: white;
2917
+ }
2918
+
2919
+ [data-color="plum"] {
2920
+ --color-1: var(--plum-1);
2921
+ --color-a1: var(--plum-a1);
2922
+ --color-2: var(--plum-2);
2923
+ --color-a2: var(--plum-a2);
2924
+ --color-3: var(--plum-3);
2925
+ --color-a3: var(--plum-a3);
2926
+ --color-4: var(--plum-4);
2927
+ --color-a4: var(--plum-a4);
2928
+ --color-5: var(--plum-5);
2929
+ --color-a5: var(--plum-a5);
2930
+ --color-6: var(--plum-6);
2931
+ --color-a6: var(--plum-a6);
2932
+ --color-7: var(--plum-7);
2933
+ --color-a7: var(--plum-a7);
2934
+ --color-8: var(--plum-8);
2935
+ --color-a8: var(--plum-a8);
2936
+ --color-9: var(--plum-9);
2937
+ --color-a9: var(--plum-a9);
2938
+ --color-10: var(--plum-10);
2939
+ --color-a10: var(--plum-a10);
2940
+ --color-11: var(--plum-11);
2941
+ --color-a11: var(--plum-a11);
2942
+ --color-12: var(--plum-12);
2943
+ --color-a12: var(--plum-a12);
2944
+ --color-contrast: white;
2945
+ }
2946
+
2947
+ [data-color="pink"] {
2948
+ --color-1: var(--pink-1);
2949
+ --color-a1: var(--pink-a1);
2950
+ --color-2: var(--pink-2);
2951
+ --color-a2: var(--pink-a2);
2952
+ --color-3: var(--pink-3);
2953
+ --color-a3: var(--pink-a3);
2954
+ --color-4: var(--pink-4);
2955
+ --color-a4: var(--pink-a4);
2956
+ --color-5: var(--pink-5);
2957
+ --color-a5: var(--pink-a5);
2958
+ --color-6: var(--pink-6);
2959
+ --color-a6: var(--pink-a6);
2960
+ --color-7: var(--pink-7);
2961
+ --color-a7: var(--pink-a7);
2962
+ --color-8: var(--pink-8);
2963
+ --color-a8: var(--pink-a8);
2964
+ --color-9: var(--pink-9);
2965
+ --color-a9: var(--pink-a9);
2966
+ --color-10: var(--pink-10);
2967
+ --color-a10: var(--pink-a10);
2968
+ --color-11: var(--pink-11);
2969
+ --color-a11: var(--pink-a11);
2970
+ --color-12: var(--pink-12);
2971
+ --color-a12: var(--pink-a12);
2972
+ --color-contrast: white;
2973
+ }
2974
+
2975
+ [data-color="crimson"] {
2976
+ --color-1: var(--crimson-1);
2977
+ --color-a1: var(--crimson-a1);
2978
+ --color-2: var(--crimson-2);
2979
+ --color-a2: var(--crimson-a2);
2980
+ --color-3: var(--crimson-3);
2981
+ --color-a3: var(--crimson-a3);
2982
+ --color-4: var(--crimson-4);
2983
+ --color-a4: var(--crimson-a4);
2984
+ --color-5: var(--crimson-5);
2985
+ --color-a5: var(--crimson-a5);
2986
+ --color-6: var(--crimson-6);
2987
+ --color-a6: var(--crimson-a6);
2988
+ --color-7: var(--crimson-7);
2989
+ --color-a7: var(--crimson-a7);
2990
+ --color-8: var(--crimson-8);
2991
+ --color-a8: var(--crimson-a8);
2992
+ --color-9: var(--crimson-9);
2993
+ --color-a9: var(--crimson-a9);
2994
+ --color-10: var(--crimson-10);
2995
+ --color-a10: var(--crimson-a10);
2996
+ --color-11: var(--crimson-11);
2997
+ --color-a11: var(--crimson-a11);
2998
+ --color-12: var(--crimson-12);
2999
+ --color-a12: var(--crimson-a12);
3000
+ --color-contrast: white;
3001
+ }
3002
+
3003
+ [data-color="red"] {
3004
+ --color-1: var(--red-1);
3005
+ --color-a1: var(--red-a1);
3006
+ --color-2: var(--red-2);
3007
+ --color-a2: var(--red-a2);
3008
+ --color-3: var(--red-3);
3009
+ --color-a3: var(--red-a3);
3010
+ --color-4: var(--red-4);
3011
+ --color-a4: var(--red-a4);
3012
+ --color-5: var(--red-5);
3013
+ --color-a5: var(--red-a5);
3014
+ --color-6: var(--red-6);
3015
+ --color-a6: var(--red-a6);
3016
+ --color-7: var(--red-7);
3017
+ --color-a7: var(--red-a7);
3018
+ --color-8: var(--red-8);
3019
+ --color-a8: var(--red-a8);
3020
+ --color-9: var(--red-9);
3021
+ --color-a9: var(--red-a9);
3022
+ --color-10: var(--red-10);
3023
+ --color-a10: var(--red-a10);
3024
+ --color-11: var(--red-11);
3025
+ --color-a11: var(--red-a11);
3026
+ --color-12: var(--red-12);
3027
+ --color-a12: var(--red-a12);
3028
+ --color-contrast: white;
3029
+ }
3030
+
3031
+ [data-color="tomato"] {
3032
+ --color-1: var(--tomato-1);
3033
+ --color-a1: var(--tomato-a1);
3034
+ --color-2: var(--tomato-2);
3035
+ --color-a2: var(--tomato-a2);
3036
+ --color-3: var(--tomato-3);
3037
+ --color-a3: var(--tomato-a3);
3038
+ --color-4: var(--tomato-4);
3039
+ --color-a4: var(--tomato-a4);
3040
+ --color-5: var(--tomato-5);
3041
+ --color-a5: var(--tomato-a5);
3042
+ --color-6: var(--tomato-6);
3043
+ --color-a6: var(--tomato-a6);
3044
+ --color-7: var(--tomato-7);
3045
+ --color-a7: var(--tomato-a7);
3046
+ --color-8: var(--tomato-8);
3047
+ --color-a8: var(--tomato-a8);
3048
+ --color-9: var(--tomato-9);
3049
+ --color-a9: var(--tomato-a9);
3050
+ --color-10: var(--tomato-10);
3051
+ --color-a10: var(--tomato-a10);
3052
+ --color-11: var(--tomato-11);
3053
+ --color-a11: var(--tomato-a11);
3054
+ --color-12: var(--tomato-12);
3055
+ --color-a12: var(--tomato-a12);
3056
+ --color-contrast: white;
3057
+ }
3058
+
3059
+ [data-variant="solid"] {
3060
+ background-color: var(--color-9);
3061
+ color: var(--color-contrast);
3062
+ fill: var(--color-contrast);
3063
+ }
3064
+
3065
+ [data-variant="solid"]:not([data-color="gray"], [data-interactive="false"]):hover {
3066
+ background-color: var(--color-10);
3067
+ }
3068
+
3069
+ [data-variant="solid"]:not([data-color="gray"], [data-interactive="false"]):active {
3070
+ filter: brightness(0.95) saturate(1.1);
3071
+ }
3072
+
3073
+ [data-variant="solid"]:where([data-color="gray"]) {
3074
+ background-color: var(--color-12);
3075
+ }
3076
+
3077
+ [data-variant="outline"] {
3078
+ background-color: transparent;
3079
+ color: var(--color-11);
3080
+ border: 1.5px solid var(--color-4);
3081
+ fill: var(--color-11);
3082
+ }
3083
+
3084
+ [data-variant="outline"]:not([data-interactive="false"]):hover {
3085
+ background-color: var(--color-2);
3086
+ }
3087
+
3088
+ [data-variant="outline"]:active {
3089
+ background-color: var(--color-3);
3090
+ }
3091
+
3092
+ [data-variant="light"] {
3093
+ background-color: var(--color-3);
3094
+ color: var(--color-11);
3095
+ fill: var(--color-11);
3096
+ }
3097
+
3098
+ [data-variant="light"]:not([data-interactive="false"]):hover {
3099
+ background-color: var(--color-4);
3100
+ }
3101
+
3102
+ [data-variant="light"]:not([data-interactive="false"]):active {
3103
+ background-color: var(--color-5);
3104
+ }
3105
+
3106
+ [data-variant="pastel"] {
3107
+ background-color: var(--color-6);
3108
+ color: var(--color-12);
3109
+ fill: var(--color-12);
3110
+ }
3111
+
3112
+ [data-variant="lightOutline"] {
3113
+ background-color: var(--color-2);
3114
+ color: var(--color-11);
3115
+ border: 1.5px solid var(--color-6);
3116
+ fill: var(--color-11);
3117
+ }
3118
+
3119
+ [data-variant="lightOutline"]:not([data-interactive="false"]):hover {
3120
+ background-color: var(--color-3);
3121
+ }
3122
+
3123
+ [data-variant="lightOutline"]:not([data-interactive="false"]):active {
3124
+ background-color: var(--color-4);
3125
+ }
3126
+
3127
+ [data-variant="solidMono"] {
3128
+ color: var(--color-12);
3129
+ background-color: var(--color-9);
3130
+ fill: var(--color-12);
3131
+ }
3132
+
3133
+ [data-variant="ghost"] {
3134
+ background-color: transparent;
3135
+ color: var(--color-11);
3136
+ fill: var(--color-11);
3137
+ }
3138
+
3139
+ [data-variant="ghost"]:not([data-interactive="false"]):hover {
3140
+ background-color: var(--color-2);
3141
+ }
3142
+
3143
+ [data-variant="ghost"]:not([data-interactive="false"]):active {
3144
+ background-color: var(--color-3);
3145
+ }
3146
+
3147
+ /* https://tailwindcss.com/docs/box-shadow */
3148
+
3149
+ .parrot-theme {
3150
+ --shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
3151
+ --shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
3152
+ --shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -1px rgb(0 0 0 / 0.06);
3153
+ --shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1),
3154
+ 0 4px 6px -2px rgb(0 0 0 / 0.05);
3155
+ --shadow-xl: 0 20px 25px -5px rgb(0 0 0 / 0.1),
3156
+ 0 8px 10px -6px rgb(0 0 0 / 0.01);
3157
+ --shadow-2xl: 0 25px 50px -12px rgb(0 0 0 / 0.25);
3158
+ --shadow-none: none;
3159
+ --focus-ring: 0 0 0 3px var(--color-a6);
3160
+ --focus-ring-error: 0 0 0 3px var(--tomato-a5);
3161
+ }
3162
+
3163
+ .parrot-theme {
3164
+ --font-weight-light: 300;
3165
+ --font-weight-regular: 400;
3166
+ --font-weight-medium: 500;
3167
+ --font-weight-semi-bold: 600;
3168
+ --font-weight-bold: 700;
3169
+ }
3170
+
3171
+ .parrot-theme {
3172
+ --sans-serif-font-stack: -apple-system, BlinkMacSystemFont,
3173
+ "Segoe UI (Custom)", Roboto, "Helvetica Neue", "Open Sans (Custom)",
3174
+ system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji";
3175
+ --serif-font-stack: "Times New Roman", "Times", serif;
3176
+ --code-font-stack: "Menlo", "Consolas (Custom)", "Bitstream Vera Sans Mono",
3177
+ monospace, "Apple Color Emoji", "Segoe UI Emoji";
3178
+ }
3179
+
3180
+ .parrot-theme {
3181
+ --default-font-family: var(--sans-serif-font-stack);
3182
+ --default-line-height: var(--line-height-short);
3183
+ --default-font-size: var(--font-size-sm);
3184
+ --default-font-weight: var(--font-weight-regular);
3185
+ }
3186
+
3187
+ .parrot-theme {
3188
+ overflow-wrap: break-word;
3189
+ font-family: var(--default-font-family);
3190
+ font-size: var(--default-font-size);
3191
+ /* line-height: var(--default-line-height); */
3192
+ -webkit-text-size-adjust: none;
3193
+ -moz-text-size-adjust: none;
3194
+ text-size-adjust: none;
3195
+ }
3196
+
3197
+ .p-avatar {
3198
+ --avatar-size: var(--space-4);
3199
+ height: var(--avatar-size);
3200
+ width: var(--avatar-size);
3201
+ display: inline-flex;
3202
+ align-items: center;
3203
+ justify-content: center;
3204
+ overflow: hidden;
3205
+ position: relative;
3206
+ transition: all 250ms ease-in-out;
3207
+ -webkit-user-select: none;
3208
+ -moz-user-select: none;
3209
+ user-select: none;
3210
+ flex-shrink: 0;
3211
+ }
3212
+
3213
+ .p-avatar img {
3214
+ width: 100%;
3215
+ height: 100%;
3216
+ -o-object-fit: cover;
3217
+ object-fit: cover;
3218
+ -o-object-position: center;
3219
+ object-position: center;
3220
+ border-radius: inherit;
3221
+ }
3222
+
3223
+ .p-avatar.avatar-size-2xs {
3224
+ --avatar-size: var(--space-4);
3225
+ border-radius: max(var(--radius-xs), var(--radius-full));
3226
+ font-size: var(--font-size-3);
3227
+ }
3228
+
3229
+ .p-avatar.avatar-size-xs {
3230
+ --avatar-size: var(--space-6);
3231
+ border-radius: max(var(--radius-sm), var(--radius-full));
3232
+ font-size: var(--font-size-4);
3233
+ }
3234
+
3235
+ .p-avatar.avatar-size-sm {
3236
+ --avatar-size: var(--space-8);
3237
+ border-radius: max(var(--radius-md), var(--radius-full));
3238
+ font-size: var(--font-size-4);
3239
+ }
3240
+
3241
+ .p-avatar.avatar-size-md {
3242
+ --avatar-size: var(--space-10);
3243
+ border-radius: max(var(--radius-lg), var(--radius-full));
3244
+ font-size: var(--font-size-5);
3245
+ }
3246
+
3247
+ .p-avatar.avatar-size-lg {
3248
+ --avatar-size: var(--space-12);
3249
+ border-radius: max(var(--radius-lg), var(--radius-full));
3250
+ font-size: var(--font-size-5);
3251
+ }
3252
+
3253
+ .p-avatar.avatar-size-xl {
3254
+ --avatar-size: var(--space-14);
3255
+ border-radius: max(var(--radius-lg), var(--radius-full));
3256
+ font-size: var(--font-size-6);
3257
+ }
3258
+
3259
+ .p-avatar.avatar-size-2xl {
3260
+ --avatar-size: var(--space-16);
3261
+ border-radius: max(var(--radius-xl), var(--radius-full));
3262
+ font-size: var(--font-size-6);
3263
+ }
3264
+
3265
+ .p-avatar.avatar-size-3xl {
3266
+ --avatar-size: var(--space-20);
3267
+ border-radius: max(var(--radius-xl), var(--radius-full));
3268
+ font-size: var(--font-size-6);
3269
+ }
3270
+
3271
+ .parrot-theme .p-button {
3272
+ --base-button-height: var(--space-4);
3273
+ --base-button-padding: var(--space-3);
3274
+ --base-button-font-weight: var(--font-weight-regular);
3275
+
3276
+ display: inline-flex;
3277
+ justify-content: center;
3278
+ align-items: center;
3279
+ height: var(--base-button-height);
3280
+ font-family: var(--sans-serif-font-stack);
3281
+ padding-left: var(--base-button-padding);
3282
+ padding-right: var(--base-button-padding);
3283
+ -webkit-user-select: none;
3284
+ -moz-user-select: none;
3285
+ user-select: none;
3286
+ flex-shrink: 0;
3287
+ gap: var(--space-4xs);
3288
+ font-weight: var(--base-button-font-weight);
3289
+ }
3290
+
3291
+ .parrot-theme .p-button:focus {
3292
+ box-shadow: 0 0 0 3px var(--color-a5);
3293
+ }
3294
+
3295
+ .parrot-theme .p-button[data-loading="true"] {
3296
+ pointer-events: none;
3297
+ }
3298
+
3299
+ .parrot-theme .p-button:is([data-icon-button="true"]) {
3300
+ --base-button-padding: 0 !important;
3301
+ width: var(--base-button-height);
3302
+ }
3303
+
3304
+ .parrot-theme .p-button:disabled {
3305
+ opacity: 0.5;
3306
+ pointer-events: none;
3307
+ cursor: not-allowed;
3308
+ background: var(--gray-4);
3309
+ color: var(--gray-10);
3310
+ }
3311
+
3312
+ .parrot-theme .p-button.button-size-xs {
3313
+ --base-button-height: var(--space-6);
3314
+ border-radius: max(var(--radius-xs), var(--radius-full));
3315
+ font-size: var(--font-size-3);
3316
+ }
3317
+
3318
+ .parrot-theme .p-button.button-size-sm {
3319
+ --base-button-height: var(--space-8);
3320
+ --base-button-padding: var(--space-3);
3321
+ border-radius: max(var(--radius-sm), var(--radius-full));
3322
+ font-size: var(--font-size-3_5);
3323
+ }
3324
+
3325
+ .parrot-theme .p-button.button-size-md {
3326
+ --base-button-height: var(--space-10);
3327
+ border-radius: max(var(--radius-md), var(--radius-full));
3328
+ font-size: var(--font-size-3_5);
3329
+ }
3330
+
3331
+ .parrot-theme .p-button.button-size-lg {
3332
+ --base-button-height: var(--space-11);
3333
+ border-radius: max(var(--radius-md), var(--radius-full));
3334
+ font-size: var(--font-size-3_5);
3335
+ }
3336
+
3337
+ .parrot-theme .p-button.button-size-xl {
3338
+ --base-button-height: var(--space-12);
3339
+ border-radius: max(var(--radius-lg), var(--radius-full));
3340
+ font-size: var(--font-size-4);
3341
+ }
3342
+
3343
+ .parrot-theme .p-input-group .add-on {
3344
+ position: absolute;
3345
+ width: var(--base-input-height);
3346
+ display: flex;
3347
+ align-items: center;
3348
+ justify-content: center;
3349
+ height: var(--base-input-height);
3350
+ color: var(--color-11);
3351
+ }
3352
+
3353
+ .parrot-theme .p-input-group .add-on-left {
3354
+ left: 0;
3355
+ }
3356
+
3357
+ .parrot-theme .p-input-group .add-on-right {
3358
+ right: 0;
3359
+ }
3360
+
3361
+ .parrot-theme .p-input-group:where([data-size="xs"]),
3362
+ .parrot-theme .p-input-group.input-size-xs {
3363
+ --base-input-height: var(--space-6);
3364
+ --base-radius: max(var(--radius-xs), var(--radius-full));
3365
+ --base-font-size: var(--font-size-3);
3366
+ }
3367
+
3368
+ .parrot-theme .p-input-group:where([data-size="sm"]),
3369
+ .parrot-theme .p-input-group.input-size-sm {
3370
+ --base-input-height: var(--space-8);
3371
+ --base-radius: max(var(--radius-sm), var(--radius-full));
3372
+ --base-font-size: var(--font-size-3_5);
3373
+ }
3374
+
3375
+ .parrot-theme .p-input-group:where([data-size="md"]),
3376
+ .parrot-theme .p-input-group.input-size-md {
3377
+ --base-input-height: var(--space-10);
3378
+ --base-radius: max(var(--radius-md), var(--radius-full));
3379
+ --base-font-size: var(--font-size-3_5);
3380
+ }
3381
+
3382
+ .parrot-theme .p-input-group:where([data-size="lg"]),
3383
+ .parrot-theme .p-input-group.input-size-lg {
3384
+ --base-input-height: var(--space-11);
3385
+ --base-radius: max(var(--radius-md), var(--radius-full));
3386
+ --base-font-size: var(--font-size-3_5);
3387
+ }
3388
+
3389
+ .parrot-theme .p-input-group:where([data-size="xl"]),
3390
+ .parrot-theme .p-input-group.input-size-xl {
3391
+ --base-input-height: var(--space-12);
3392
+ --base-radius: max(var(--radius-lg), var(--radius-full));
3393
+ --base-font-size: var(--font-size-4);
3394
+ }
3395
+
3396
+ .parrot-theme .p-input {
3397
+ height: var(--base-input-height);
3398
+ border-radius: var(--base-radius);
3399
+ -webkit-appearance: none;
3400
+ -moz-appearance: none;
3401
+ appearance: none;
3402
+ width: 100%;
3403
+ outline: none;
3404
+ letter-spacing: 0.1px;
3405
+ font-family: var(--default-font-family);
3406
+ font-size: var(--base-font-size);
3407
+ color: var(--color-12);
3408
+ padding: 0 var(--space-2);
3409
+ }
3410
+
3411
+ .parrot-theme .p-input:focus {
3412
+ border: 1.5px solid var(--color-5);
3413
+ box-shadow: 0 0 0 3px var(--color-a4);
3414
+ }
3415
+
3416
+ .parrot-theme .p-input:where([data-has-left-addon="true"]) {
3417
+ padding-left: var(--base-input-height);
3418
+ }
3419
+
3420
+ .parrot-theme .p-input:where([data-has-right-addon="true"]) {
3421
+ padding-right: var(--base-input-height);
3422
+ }
3423
+
3424
+ .parrot-theme .p-input::-moz-placeholder {
3425
+ font-weight: var(--font-weight-regular);
3426
+ color: var(--color-a7);
3427
+ opacity: 1;
3428
+ }
3429
+
3430
+ .parrot-theme .p-input::placeholder {
3431
+ font-weight: var(--font-weight-regular);
3432
+ color: var(--color-a7);
3433
+ opacity: 1;
3434
+ }
3435
+
3436
+ .parrot-theme .p-input:disabled,
3437
+ .parrot-theme .p-input:where([data-disabled="true"]) {
3438
+ opacity: 0.5;
3439
+ cursor: not-allowed;
3440
+ }
3441
+
3442
+ .parrot-theme .p-input:where([data-has-error="true"]):focus,
3443
+ .parrot-theme .p-input:where([data-has-error="true"]):focus-within {
3444
+ border: 1.5px solid var(--tomato-7);
3445
+ box-shadow: var(--focus-ring-error);
3446
+ }
3447
+
3448
+ .parrot-theme .p-input:where([data-appearance="filled"]),
3449
+ .parrot-theme .p-input.appearance-filled {
3450
+ background: var(--color-3);
3451
+ border: 1.5px solid transparent;
3452
+ }
3453
+
3454
+ .parrot-theme .p-input:where([data-appearance="outline"]),
3455
+ .parrot-theme .p-input.appearance-outline {
3456
+ background: white;
3457
+ border: 1.5px solid var(--color-4);
3458
+ }
3459
+
3460
+ .parrot-theme .p-input:where([data-appearance="filled-outline"]),
3461
+ .parrot-theme .p-input.appearance-filled-outline {
3462
+ background: var(--color-2);
3463
+ border: 1.5px solid var(--color-5);
3464
+ }
3465
+
3466
+ .p-space:where([data-compact="true"]) .space-item:not(.space-item-first, .space-item-last) {
3467
+ border-radius: 0px;
3468
+ }
3469
+
3470
+ .p-space:where([data-compact="true"]) .space-item:not(.space-item-end) {
3471
+ margin-inline-end: -1px;
3472
+ }
3473
+
3474
+ .p-space:where([data-compact="true"]) .space-item-first {
3475
+ border-start-end-radius: 0px;
3476
+ border-end-end-radius: 0px;
3477
+ }
3478
+
3479
+ .p-space:where([data-compact="true"]) .space-item-last {
3480
+ border-start-start-radius: 0px;
3481
+ border-end-start-radius: 0px;
3482
+ }
3483
+
3484
+ .p-space:where([data-compact="true"]) .compact-item-wrapper-adjust {
3485
+ margin-inline-end: -1px;
3486
+ }
3487
+
3488
+ .p-text {
3489
+ --base-text-size: inherit;
3490
+ text-decoration: none;
3491
+ letter-spacing: 0.1px;
3492
+ font-family: var(--default-font-family);
3493
+ font-size: var(--base-text-size);
3494
+ color: var(--color-10);
3495
+ }
3496
+
3497
+ .p-text[data-color="inherit"] {
3498
+ color: inherit;
3499
+ }
3500
+
3501
+ .p-text:is([data-color="gray"][data-text-variant="default"]) {
3502
+ color: var(--color-12);
3503
+ }
3504
+
3505
+ .p-text:where([data-text-variant="light"]) {
3506
+ color: var(--color-8);
3507
+ }
3508
+
3509
+ .p-text:where([data-text-variant="lighter"]) {
3510
+ color: var(--color-7);
3511
+ }
3512
+
3513
+ .p-text:where([data-text-variant="dark"]) {
3514
+ color: var(--color-10);
3515
+ }
3516
+
3517
+ .p-text:where([data-numeric="true"]),
3518
+ .p-text.text-numeric {
3519
+ font-variant-numeric: tabular-nums;
3520
+ }
3521
+
3522
+ .p-text:where([data-italic="true"]),
3523
+ .p-text.text-italic {
3524
+ font-style: italic;
3525
+ }
3526
+
3527
+ .p-text:where([data-underline="true"]),
3528
+ .p-text.text-underline {
3529
+ text-decoration: underline;
3530
+ }
3531
+
3532
+ .p-text.text-highlight {
3533
+ background-color: var(--color-3);
3534
+ color: var(--color-11);
3535
+ }
3536
+
3537
+ .p-text.text-size-4xs {
3538
+ --base-text-size: var(--font-size-2);
3539
+ }
3540
+
3541
+ .p-text.text-size-3xs {
3542
+ --base-text-size: var(--font-size-2);
3543
+ }
3544
+
3545
+ .p-text.text-size-2xs {
3546
+ --base-text-size: var(--font-size-2_5);
3547
+ }
3548
+
3549
+ .p-text.text-size-xs {
3550
+ --base-text-size: var(--font-size-3);
3551
+ }
3552
+
3553
+ .p-text.text-size-sm {
3554
+ --base-text-size: var(--font-size-3_5);
3555
+ }
3556
+
3557
+ .p-text.text-size-md {
3558
+ --base-text-size: var(--font-size-4);
3559
+ }
3560
+
3561
+ .p-text.text-size-lg {
3562
+ --base-text-size: var(--font-size-5);
3563
+ }
3564
+
3565
+ .p-text.text-size-xl {
3566
+ --base-text-size: var(--font-size-6);
3567
+ }
3568
+
3569
+ .p-text.text-size-2xl {
3570
+ --base-text-size: var(--font-size-8);
3571
+ }
3572
+
3573
+ .p-text.text-size-3xl {
3574
+ --base-text-size: var(--font-size-10);
3575
+ }
3576
+
3577
+ .p-text.text-size-4xl {
3578
+ --base-text-size: var(--font-size-12);
3579
+ }
3580
+
3581
+ .p-text.text-align-left {
3582
+ text-align: left;
3583
+ }
3584
+
3585
+ .p-text.text-align-center {
3586
+ text-align: center;
3587
+ }
3588
+
3589
+ .p-text.text-align-right {
3590
+ text-align: right;
3591
+ }
3592
+
3593
+ .p-text.text-align-justify {
3594
+ text-align: justify;
3595
+ }
3596
+
3597
+ .p-text.text-transform-uppercase {
3598
+ text-transform: uppercase;
3599
+ }
3600
+
3601
+ .p-text.text-transform-lowercase {
3602
+ text-transform: lowercase;
3603
+ }
3604
+
3605
+ .p-text.text-transform-capitalize {
3606
+ text-transform: capitalize;
3607
+ }
3608
+
3609
+ .p-text.text-weight-light {
3610
+ font-weight: var(--font-weight-light);
3611
+ }
3612
+
3613
+ .p-text.text-weight-regular {
3614
+ font-weight: var(--font-weight-regular);
3615
+ }
3616
+
3617
+ .p-text.text-weight-medium {
3618
+ font-weight: var(--font-weight-medium);
3619
+ }
3620
+
3621
+ .p-text.text-weight-semi-bold {
3622
+ font-weight: var(--font-weight-semi-bold);
3623
+ }
3624
+
3625
+ .p-text.text-weight-bold {
3626
+ font-weight: var(--font-weight-bold);
3627
+ }
3628
+
3629
+ .p-text.text-line-height-normal {
3630
+ line-height: var(--line-height-normal);
3631
+ }
3632
+
3633
+ .p-text.text-line-height-shorter {
3634
+ line-height: var(--line-height-shorter);
3635
+ }
3636
+
3637
+ .p-text.text-line-height-short {
3638
+ line-height: var(--line-height-short);
3639
+ }
3640
+
3641
+ .p-text.text-line-height-base {
3642
+ line-height: var(--line-height-base);
3643
+ }
3644
+
3645
+ .p-text.text-line-height-tall {
3646
+ line-height: var(--line-height-tall);
3647
+ }
3648
+
3649
+ .p-text.text-line-height-taller {
3650
+ line-height: var(--line-height-taller);
3651
+ }
3652
+
3653
+ .parrot-theme .list-box-wrapper {
3654
+ list-style: none;
3655
+ border: 1px solid var(--gray-a3);
3656
+ border-radius: max(var(--radius-md), var(--radius-full));
3657
+ padding: var(--space-1) var(--space-1);
3658
+ box-shadow: var(--shadow-sm);
3659
+ background: white;
3660
+ max-height: 300px;
3661
+ overflow-y: scroll;
3662
+ }
3663
+
3664
+ .parrot-theme .list-option {
3665
+ list-style: none;
3666
+ font-size: var(--font-size-3_5);
3667
+ font-weight: var(--font-weight-regular);
3668
+ padding: var(--space-2) var(--space-2);
3669
+ outline: none;
3670
+ border-radius: max(var(--radius-sm), var(--radius-full));
3671
+ cursor: pointer;
3672
+ }
3673
+
3674
+ .parrot-theme .list-option:where([data-pressed="true"]),
3675
+ .parrot-theme .list-option[data-pressed="true"] {
3676
+ background: var(--gray-4);
3677
+ }
3678
+
3679
+ .parrot-theme .list-option:where([data-disabled="true"]) {
3680
+ opacity: 0.5;
3681
+ }
3682
+
3683
+ .parrot-theme .list-option:where([data-focus-visible="true"]),
3684
+ .parrot-theme .list-option[data-focus-visible="true"],
3685
+ .parrot-theme .list-option:where([data-focused="true"]),
3686
+ .parrot-theme .list-option[data-focused="true"] {
3687
+ background: var(--color-3);
3688
+ color: var(--color-11);
3689
+ }
3690
+
3691
+ .parrot-theme .list-option:where([data-selected="true"]),
3692
+ .parrot-theme .list-option[data-selected="true"] {
3693
+ background: var(--color-11);
3694
+ color: var(--color-contrast);
3695
+ }
3696
+
3697
+ .parrot-theme .list-separator {
3698
+ height: 1px;
3699
+ background: var(--gray-3);
3700
+ }
3701
+
3702
+ .parrot-theme .p-select {
3703
+ padding: 8px;
3704
+ display: flex;
3705
+ align-items: center;
3706
+ justify-content: space-between;
3707
+ min-height: var(--base-button-height);
3708
+ height: auto;
3709
+ outline: none;
3710
+ }
3711
+
3712
+ .parrot-theme .p-select .selector {
3713
+ flex-shrink: 0;
3714
+ color: var(--color-9);
3715
+ }
3716
+
3717
+ .parrot-theme .custom-checkbox-label {
3718
+ display: flex;
3719
+ align-items: center;
3720
+ gap: var(--space-3);
3721
+ font-family: var(--default-font-family);
3722
+ }
3723
+
3724
+ .parrot-theme .custom-checkbox-label:where([data-disabled="true"]) {
3725
+ opacity: 0.5;
3726
+ cursor: not-allowed;
3727
+ }
3728
+
3729
+ .parrot-theme .fake-checkbox {
3730
+ --base-size: var(--space-3);
3731
+ transition: all 150ms cubic-bezier(0.4, 0, 0.2, 1);
3732
+ display: inline-flex;
3733
+ align-items: center;
3734
+ justify-content: center;
3735
+ border-width: 1.5px;
3736
+ border-style: solid;
3737
+ height: var(--base-size);
3738
+ width: var(--base-size);
3739
+ border-radius: max(var(--radius-xs), var(--radius-full));
3740
+ }
3741
+
3742
+ .parrot-theme .fake-checkbox:where([data-size="xs"]) {
3743
+ --base-size: var(--space-3);
3744
+ }
3745
+
3746
+ .parrot-theme .fake-checkbox:where([data-size="sm"]) {
3747
+ --base-size: var(--space-4);
3748
+ }
3749
+
3750
+ .parrot-theme .fake-checkbox:where([data-size="md"]) {
3751
+ --base-size: var(--space-5);
3752
+ }
3753
+
3754
+ .parrot-theme .fake-checkbox:where([data-size="lg"]) {
3755
+ --base-size: var(--space-6);
3756
+ }
3757
+
3758
+ .parrot-theme .fake-checkbox:where([data-size="xl"]) {
3759
+ --base-size: var(--space-7);
3760
+ }
3761
+
3762
+ .parrot-theme .fake-checkbox:where([data-checked="true"]),
3763
+ .parrot-theme .fake-checkbox[data-checked="true"] {
3764
+ background-color: var(--color-10);
3765
+ border-color: transparent;
3766
+ }
3767
+
3768
+ .parrot-theme .fake-checkbox:where([data-focused="true"]) {
3769
+ box-shadow: var(--focus-ring);
3770
+ }
3771
+
3772
+ .parrot-theme .fake-checkbox:where([data-indeterminate="true"]) {
3773
+ background-color: var(--gray-4);
3774
+ border-color: transparent;
3775
+ }
3776
+
3777
+ .parrot-theme .fake-checkbox:where([data-appearance="outline"]) {
3778
+ background-color: transparent;
3779
+ border-color: var(--gray-6);
3780
+ }
3781
+
3782
+ .parrot-theme .fake-checkbox:where([data-appearance="filled"]) {
3783
+ background-color: var(--color-4);
3784
+ border-color: transparent;
3785
+ }
3786
+
3787
+ .parrot-theme .color-button {
3788
+ --base-height: var(--space-6);
3789
+ -webkit-appearance: none;
3790
+ -moz-appearance: none;
3791
+ appearance: none;
3792
+ border: none;
3793
+ outline: none;
3794
+ cursor: pointer;
3795
+ color: white;
3796
+ display: inline-flex;
3797
+ align-items: center;
3798
+ justify-content: center;
3799
+ height: var(--base-height);
3800
+ width: var(--base-height);
3801
+ border-radius: max(var(--radius-sm), var(--radius-full));
3802
+ }
3803
+
3804
+ .parrot-theme .color-button:where([data-size="sm"]) {
3805
+ --base-height: var(--space-6);
3806
+ }
3807
+
3808
+ .parrot-theme .color-button:where([data-size="md"]) {
3809
+ --base-height: var(--space-8);
3810
+ }
3811
+
3812
+ .parrot-theme .color-button:where([data-size="lg"]) {
3813
+ --base-height: var(--space-10);
3814
+ }
3815
+
3816
+ .parrot-theme .date-field {
3817
+ position: relative;
3818
+ overflow: hidden;
3819
+ }
3820
+
3821
+ .parrot-theme .date-input-segment {
3822
+ outline: none;
3823
+ font-variant-numeric: tabular-nums;
3824
+ text-align: center;
3825
+ padding: 0 1px;
3826
+ font-size: var(--font-size-3_5);
3827
+ transition: all 100ms ease-out;
3828
+ }
3829
+
3830
+ .parrot-theme .date-input-segment [data-placeholder="true"] {
3831
+ color: var(--gray-8);
3832
+ }
3833
+
3834
+ .parrot-theme .date-input-segment:focus {
3835
+ background: var(--color-4);
3836
+ color: var(--color-10);
3837
+ }
3838
+
3839
+ .parrot-theme .calendar-wrapper {
3840
+ background-color: white;
3841
+ border-radius: max(var(--radius-sm), var(--radius-full));
3842
+ box-shadow: var(--shadow-sm);
3843
+ padding: 16px 24px;
3844
+ }
3845
+
3846
+ .parrot-theme .date-cell {
3847
+ --size: 32px;
3848
+ width: var(--size);
3849
+ height: var(--size);
3850
+ display: flex;
3851
+ align-items: center;
3852
+ justify-content: center;
3853
+ border-radius: max(var(--radius-sm), var(--radius-full));
3854
+ outline: none;
3855
+ font-size: var(--font-size-3_5);
3856
+ cursor: pointer;
3857
+ }
3858
+
3859
+ .parrot-theme .date-cell[data-focus-visible="true"] {
3860
+ /* background-color: var(--color-4); */
3861
+ color: var(--color-10);
3862
+ box-shadow: 0 0 0 3px var(--color-a6);
3863
+ border: 1.5px solid var(--color-5);
3864
+ }
3865
+
3866
+ .parrot-theme .date-cell[data-hidden="true"] {
3867
+ visibility: hidden;
3868
+ }
3869
+
3870
+ .parrot-theme .date-cell[data-disabled="true"],
3871
+ .parrot-theme .date-cell[data-unavailable="true"] {
3872
+ color: var(--gray-8);
3873
+ cursor: not-allowed;
3874
+ }
3875
+
3876
+ .parrot-theme .date-cell[data-selected="true"] {
3877
+ background-color: var(--color-10);
3878
+ color: var(--color-contrast);
3879
+ }
3880
+
3881
+ .parrot-theme .file-uploader-wrapper {
3882
+ display: flex;
3883
+ border-style: dashed;
3884
+ border-width: 1px;
3885
+ border-color: var(--color-5);
3886
+ padding: var(--space-3);
3887
+ border-radius: max(var(--radius-sm), var(--radius-full));
3888
+ }
3889
+
3890
+ .parrot-theme .file-uploader-wrapper[data-dropping="true"] {
3891
+ box-shadow: 0 0 0 3px var(--color-a5);
3892
+ border-color: var(--color-6);
3893
+ background-color: var(--color-1);
3894
+ color: var(--color-9);
3895
+ }
3896
+
3897
+ .parrot-theme .file-uploader-wrapper[data-state="idle"] {
3898
+ color: var(--color-9);
3899
+ }
3900
+
3901
+ .parrot-theme .file-uploader-wrapper[data-state="loading"] {
3902
+ color: var(--color-9);
3903
+ }
3904
+
3905
+ .parrot-theme .file-uploader-wrapper[data-state="success"] {
3906
+ border-color: var(--green-5);
3907
+ border-style: solid;
3908
+ background-color: var(--green-1);
3909
+ color: var(--green-10);
3910
+ }
3911
+
3912
+ .parrot-theme .file-uploader-wrapper[data-state="error"] {
3913
+ border-color: var(--tomato-5);
3914
+ border-style: solid;
3915
+ background-color: var(--tomato-1);
3916
+ color: var(--tomato-10);
3917
+ }
3918
+
3919
+ .parrot-theme .file-uploader-wrapper[data-state="error"] .state-icon {
3920
+ color: var(--tomato-10);
3921
+ }
3922
+
3923
+ @keyframes spin {
3924
+ from {
3925
+ transform: rotate(0deg);
3926
+ }
3927
+ to {
3928
+ transform: rotate(360deg);
3929
+ }
3930
+ }
3931
+
3932
+ .parrot-theme .loader-wrapper {
3933
+ display: inline-flex;
3934
+ animation: spin 700ms linear infinite;
3935
+ }
3936
+
3937
+ .parrot-theme .loader-svg {
3938
+ --base-size: var(--space-3);
3939
+ overflow: hidden;
3940
+ overflow-clip-margin: content-box;
3941
+ height: var(--base-size);
3942
+ width: var(--base-size);
3943
+ }
3944
+
3945
+ .parrot-theme .loader-svg[data-size="xs"] {
3946
+ --base-size: var(--space-5);
3947
+ }
3948
+
3949
+ .parrot-theme .loader-svg[data-size="sm"] {
3950
+ --base-size: var(--space-6);
3951
+ }
3952
+
3953
+ .parrot-theme .loader-svg[data-size="md"] {
3954
+ --base-size: var(--space-8);
3955
+ }
3956
+
3957
+ .parrot-theme .loader-svg[data-size="lg"] {
3958
+ --base-size: var(--space-10);
3959
+ }
3960
+
3961
+ .parrot-theme .loader-svg[data-size="xl"] {
3962
+ --base-size: var(--space-12);
3963
+ }
3964
+
3965
+ .parrot-theme .loader-svg[data-size="2xl"] {
3966
+ --base-size: var(--space-14);
3967
+ }
3968
+
3969
+ .parrot-theme .loader-svg[data-size="3xl"] {
3970
+ --base-size: var(--space-20);
3971
+ }
3972
+
3973
+ .parrot-theme.modal-underlay {
3974
+ position: fixed;
3975
+ top: 0px;
3976
+ right: 0px;
3977
+ bottom: 0px;
3978
+ left: 0px;
3979
+ background: var(--black-a8);
3980
+ width: 100vw;
3981
+ height: 100vh;
3982
+ }
3983
+
3984
+ .parrot-theme .modal-container {
3985
+ display: grid;
3986
+ width: 100vw;
3987
+ height: 100vh;
3988
+ padding: 12px;
3989
+ }
3990
+
3991
+ .parrot-theme .modal-content {
3992
+ background: white;
3993
+ border-radius: var(--radius-md);
3994
+ display: grid;
3995
+ grid-template-rows: 1fr, 60px;
3996
+ flex-direction: column;
3997
+ }
3998
+
3999
+ .parrot-theme .modal-content[data-variant="modal"] {
4000
+ align-self: center;
4001
+ justify-self: center;
4002
+ }
4003
+
4004
+ .parrot-theme .modal-content[data-variant="drawer"] {
4005
+ justify-self: end;
4006
+ }
4007
+
4008
+ .parrot-theme .modal-footer {
4009
+ padding: var(--space-4);
4010
+ align-self: flex-end;
4011
+ }
4012
+
4013
+ .parrot-theme .modal-head {
4014
+ padding: var(--space-4);
4015
+ border-bottom: 1px solid var(--gray-3);
4016
+ }
4017
+
4018
+ .parrot-theme .modal-body {
4019
+ padding: var(--space-4);
4020
+ }
4021
+
4022
+ .parrot-theme .tag {
4023
+ --base-tag-height: var(--space-4);
4024
+ --base-tag-padding: var(--space-2);
4025
+ --base-tag-font-size: var(--font-size-3);
4026
+ display: inline-flex;
4027
+ gap: var(--space-1_5);
4028
+ align-items: center;
4029
+ height: var(--base-tag-height);
4030
+ border-radius: max(var(--radius-sm), var(--radius-full));
4031
+ padding: 0 var(--base-tag-padding);
4032
+ font-size: var(--base-tag-font-size);
4033
+ }
4034
+
4035
+ .parrot-theme .tag[data-size="xs"] {
4036
+ --base-tag-padding: var(--space-1_5);
4037
+ border-radius: max(var(--radius-xs), var(--radius-full));
4038
+ }
4039
+
4040
+ .parrot-theme .tag[data-size="sm"] {
4041
+ --base-tag-height: var(--space-5);
4042
+ --base-tag-font-size: var(--font-size-3_5);
4043
+ border-radius: max(var(--radius-xs), var(--radius-full));
4044
+ }
4045
+
4046
+ .parrot-theme .tag[data-size="md"] {
4047
+ --base-tag-height: var(--space-6);
4048
+ --base-tag-font-size: var(--font-size-3_5);
4049
+ }
4050
+
4051
+ .parrot-theme .tag[data-size="lg"] {
4052
+ --base-tag-height: var(--space-7);
4053
+ --base-tag-font-size: var(--font-size-3_5);
4054
+ }
4055
+
4056
+ .parrot-theme .tag[data-size="xl"] {
4057
+ --base-tag-height: var(--space-8);
4058
+ --base-tag-font-size: var(--font-size-3_5);
4059
+ }
4060
+
4061
+ .parrot-theme .tag-field {
4062
+ display: flex;
4063
+ align-items: center;
4064
+ flex-wrap: wrap;
4065
+ padding: 4px;
4066
+ gap: var(--space-1_5);
4067
+ height: auto;
4068
+ min-height: var(--base-input-height);
4069
+ }
4070
+
4071
+ .parrot-theme .tag-field:focus-within {
4072
+ border: 1.5px solid var(--color-5);
4073
+ box-shadow: 0 0 0 3px var(--color-a4);
4074
+ }
4075
+
4076
+ .parrot-theme .tag-field-input {
4077
+ border: none;
4078
+ background: transparent;
4079
+ outline: none;
4080
+ min-width: 4px;
4081
+ width: 100%;
4082
+ margin-inline-start: 4px;
4083
+ writing-mode: horizontal-tb;
4084
+ }
4085
+
4086
+ .parrot-theme .p-text-area {
4087
+ padding: 12px;
4088
+ outline: none;
4089
+ resize: none;
4090
+ min-height: 100px;
4091
+ border-radius: var(--radius-md);
4092
+ font-size: var(--font-size-3_5);
4093
+ line-height: var(--line-height-short);
4094
+ }
4095
+
4096
+ .parrot-theme .p-text-area[data-resize="horizonal"] {
4097
+ resize: horizontal;
4098
+ }
4099
+
4100
+ .parrot-theme .p-text-area[data-resize="vertical"] {
4101
+ resize: vertical;
4102
+ }
4103
+
4104
+ .parrot-theme .p-text-area[data-resize="both"] {
4105
+ resize: both;
4106
+ }
4107
+
4108
+ .parrot-theme .p-switch {
4109
+ --base-switch-track-height: var(--space-4);
4110
+ --base-switch-padding: var(--space-0_5);
4111
+ --base-switch-border-width: 1px;
4112
+ display: flex;
4113
+ align-items: center;
4114
+ padding: var(--base-switch-padding);
4115
+ height: var(--base-switch-track-height);
4116
+ border: 1px solid transparent;
4117
+ background-color: var(--gray-5);
4118
+ border-radius: var(--base-switch-track-height);
4119
+ }
4120
+
4121
+ .parrot-theme .p-switch[data-disabled="true"] {
4122
+ opacity: 0.5;
4123
+ }
4124
+
4125
+ .parrot-theme .p-switch[data-selected="true"] {
4126
+ background-color: var(--color-11);
4127
+ }
4128
+
4129
+ .parrot-theme .p-switch[data-selected="true"] .thumb {
4130
+ transform: translateX(100%);
4131
+ }
4132
+
4133
+ .parrot-theme .p-switch[data-focused="true"] {
4134
+ box-shadow: 0 0 0 3px var(--color-a6);
4135
+ border-color: var(--color-5);
4136
+ }
4137
+
4138
+ .parrot-theme .p-switch[data-focused="true"][data-selected="true"] {
4139
+ border-color: transparent;
4140
+ }
4141
+
4142
+ .parrot-theme .p-switch[data-size="sm"] {
4143
+ width: 26px;
4144
+ }
4145
+
4146
+ .parrot-theme .p-switch[data-size="md"] {
4147
+ --base-switch-track-height: var(--space-5);
4148
+ width: 34px;
4149
+ }
4150
+
4151
+ .parrot-theme .p-switch[data-size="lg"] {
4152
+ --base-switch-track-height: var(--space-7);
4153
+ width: 50px;
4154
+ }
4155
+
4156
+ .parrot-theme .p-switch .thumb {
4157
+ height: 100%;
4158
+ width: calc(
4159
+ var(--base-switch-track-height) - (2 * var(--base-switch-padding)) -
4160
+ (2 * var(--base-switch-border-width))
4161
+ );
4162
+ background-color: white;
4163
+ will-change: transform;
4164
+ border-radius: var(--base-switch-track-height);
4165
+ box-shadow: 0 0 0 1px var(--gray-5);
4166
+ transition: all 300ms ease-out;
4167
+ }
4168
+
4169
+ .parrot-theme .p-switch .thumb[data-pressed="true"] {
4170
+ width: calc(
4171
+ var(--base-switch-track-height) - (2 * var(--base-switch-padding)) -
4172
+ (2 * var(--base-switch-border-width)) + 4px
4173
+ );
4174
+ }
4175
+
4176
+ .parrot-theme .p-switch .thumb[data-pressed="true"][data-selected="true"] {
4177
+ margin-left: -8px;
4178
+ }
4179
+
4180
+ .parrot-theme .p-separator {
4181
+ display: flex;
4182
+ height: 1px;
4183
+ background: var(--color-3);
4184
+ flex-shrink: 0;
4185
+ }
4186
+
4187
+ .parrot-theme .p-separator[data-orientation="horizontal"] {
4188
+ width: 100%;
4189
+ }
4190
+
4191
+ .parrot-theme .p-separator[data-orientation="vertical"] {
4192
+ width: 1px;
4193
+ height: 100%;
4194
+ }
4195
+
4196
+ .parrot-theme .p-separator[data-opacity="faint"] {
4197
+ background: var(--color-3);
4198
+ }
4199
+
4200
+ .parrot-theme .p-separator[data-opacity="medium"] {
4201
+ background: var(--color-5);
4202
+ }
4203
+
4204
+ .parrot-theme .p-separator[data-opacity="strong"] {
4205
+ background: var(--color-8);
4206
+ }
4207
+
4208
+ .parrot-theme .p-radio {
4209
+ display: flex;
4210
+ align-items: center;
4211
+ gap: var(--space-2);
4212
+ }
4213
+
4214
+ .parrot-theme .p-radio[data-disabled="true"] {
4215
+ opacity: 0.5;
4216
+ cursor: not-allowed;
4217
+ }
4218
+
4219
+ .parrot-theme .p-fake-radio {
4220
+ --base-radio-size: var(--space-3);
4221
+ border-radius: 50%;
4222
+ border-width: 1px;
4223
+ border-color: var(--color-6);
4224
+ border-style: solid;
4225
+ transition: border 150ms;
4226
+ flex-shrink: 0;
4227
+ flex-grow: 0;
4228
+ height: var(--base-radio-size);
4229
+ width: var(--base-radio-size);
4230
+ }
4231
+
4232
+ .parrot-theme .p-fake-radio[data-checked="true"] {
4233
+ border-color: var(--color-10);
4234
+ border-width: thick;
4235
+ }
4236
+
4237
+ .parrot-theme .p-fake-radio[data-size="xs"] {
4238
+ }
4239
+
4240
+ .parrot-theme .p-fake-radio[data-size="sm"] {
4241
+ --base-radio-size: var(--space-4);
4242
+ }
4243
+
4244
+ .parrot-theme .p-fake-radio[data-size="md"] {
4245
+ --base-radio-size: var(--space-5);
4246
+ }
4247
+
4248
+ .parrot-theme .p-fake-radio[data-size="lg"] {
4249
+ --base-radio-size: var(--space-6);
4250
+ }
4251
+
4252
+ .parrot-theme .p-fake-radio[data-size="xl"] {
4253
+ --base-radio-size: var(--space-7);
4254
+ }
4255
+
4256
+ .parrot-theme .p-radio-card {
4257
+ padding: var(--space-3);
4258
+ border-radius: max(var(--radius-md), var(--radius-full));
4259
+ display: flex;
4260
+ gap: var(--space-3);
4261
+ border-color: transparent;
4262
+ border-style: solid;
4263
+ transition: all 150ms ease-out;
4264
+ }
4265
+
4266
+ .parrot-theme .p-radio-card[data-checked="true"] {
4267
+ background-color: var(--color-2);
4268
+ border-color: var(--color-6);
4269
+ }
4270
+
4271
+ .parrot-theme .p-radio-card[data-appearance="outline"] {
4272
+ background-color: white;
4273
+ border-color: var(--color-4);
4274
+ }
4275
+
4276
+ .parrot-theme .p-radio-card[data-appearance="filled"] {
4277
+ background-color: var(--color-2);
4278
+ }
4279
+
4280
+ .parrot-theme .p-timeline-item {
4281
+ position: relative;
4282
+ }
4283
+
4284
+ .parrot-theme .p-timeline-indicator-container {
4285
+ width: auto;
4286
+ height: auto;
4287
+ justify-content: center;
4288
+ }
4289
+
4290
+ .parrot-theme .p-timeline-item-tail {
4291
+ border-inline-start: 1px solid var(--gray-4);
4292
+ height: 100%;
4293
+ width: 1;
4294
+ }
4295
+
4296
+ .parrot-theme .p-timeline-default-indicator {
4297
+ width: 12px;
4298
+ height: 12px;
4299
+ border-radius: 16px;
4300
+ border-width: 3px;
4301
+ }
4302
+
4303
+ .parrot-theme .p-timeline-item-content {
4304
+ padding-bottom: 20px;
4305
+ padding-left: 12px;
4306
+ }
4307
+
4308
+ .parrot-theme .p-tab-list {
4309
+ display: flex;
4310
+ gap: var(--space-3);
4311
+ border-bottom: 1px solid var(--gray-5);
4312
+ margin-bottom: var(--space-3);
4313
+ position: relative;
4314
+ }
4315
+
4316
+ .parrot-theme .p-tab {
4317
+ display: flex;
4318
+ padding-bottom: var(--space-3);
4319
+ color: var(--gray-8);
4320
+ outline: none;
4321
+ font-size: var(--font-size-3_5);
4322
+ cursor: pointer;
4323
+ }
4324
+
4325
+ .parrot-theme .p-tab[data-selected="true"] {
4326
+ color: var(--gray-12);
4327
+ }