@nswds/app 1.18.2 → 1.19.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (10) hide show
  1. package/dist/globals.css +1713 -1093
  2. package/dist/index.cjs +3980 -2624
  3. package/dist/index.cjs.map +1 -1
  4. package/dist/index.d.cts +239 -132
  5. package/dist/index.d.ts +239 -132
  6. package/dist/index.js +3946 -2590
  7. package/dist/index.js.map +1 -1
  8. package/dist/styles.css +1694 -1098
  9. package/dist/styles.css.map +1 -1
  10. package/package.json +4 -4
package/dist/globals.css CHANGED
@@ -1,4 +1,4 @@
1
- /*! tailwindcss v4.1.3 | MIT License | https://tailwindcss.com */
1
+ /*! tailwindcss v4.1.5 | MIT License | https://tailwindcss.com */
2
2
  @layer properties;
3
3
  @layer theme, base, components, utilities;
4
4
  @layer theme {
@@ -35,7 +35,6 @@
35
35
  --color-slate-700: oklch(37.2% 0.044 257.287);
36
36
  --color-slate-800: oklch(27.9% 0.041 260.031);
37
37
  --color-slate-900: oklch(20.8% 0.042 265.755);
38
- --color-gray-50: oklch(98.5% 0.002 247.839);
39
38
  --color-gray-100: oklch(96.7% 0.003 264.542);
40
39
  --color-gray-200: oklch(92.8% 0.006 264.531);
41
40
  --color-gray-300: oklch(87.2% 0.01 258.338);
@@ -70,8 +69,7 @@
70
69
  --text-3xl--line-height: calc(2.25 / 1.875);
71
70
  --text-4xl: 2.25rem;
72
71
  --text-4xl--line-height: calc(2.5 / 2.25);
73
- --text-5xl: 3rem;
74
- --text-5xl--line-height: 1;
72
+ --font-weight-light: 300;
75
73
  --font-weight-normal: 400;
76
74
  --font-weight-medium: 500;
77
75
  --font-weight-semibold: 600;
@@ -85,45 +83,42 @@
85
83
  --radius-lg: 0.5rem;
86
84
  --radius-xl: 0.75rem;
87
85
  --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
86
+ --animate-spin: spin 1s linear infinite;
88
87
  --animate-pulse: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
89
88
  --blur-sm: 8px;
90
89
  --default-transition-duration: 150ms;
91
90
  --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
92
91
  --default-font-family: var(--font-sans);
93
92
  --default-mono-font-family: var(--font-mono);
94
- --color-nsw-grey-50: oklch(0.985025 0 0);
95
- --color-nsw-grey-100: oklch(0.9700500000000001 0 0);
96
- --color-nsw-grey-200: oklch(0.9401 0 0);
97
- --color-nsw-grey-300: oklch(0.9016 0.0039 294.435);
98
- --color-nsw-grey-400: oklch(0.8631 0.0078 228.87);
99
- --color-nsw-grey-500: oklch(0.6447499999999999 0.0095 230.745);
100
- --color-nsw-grey-600: oklch(0.4264 0.0112 232.62);
101
- --color-nsw-grey-700: oklch(0.3479 0.0108 237.35000000000002);
102
- --color-nsw-grey-800: oklch(0.2694 0.0104 242.08);
103
- --color-nsw-grey-850: oklch(0.22225499999999998 0.00884 242.08);
104
- --color-nsw-grey-900: oklch(0.17511 0.00728 242.08);
105
- --color-nsw-grey-950: oklch(0.127965 0.005719999999999999 242.08);
106
- --color-nsw-blue-800: oklch(0.29 0.1173 259.84);
107
- --color-nsw-red-600: oklch(0.562 0.2175 20.33);
108
- --color-primary-light: oklch(0.36127499999999996 0.145425 260.07);
109
- --color-primary: oklch(0.29 0.1173 259.84);
110
- --color-primary-dark: oklch(0.23925 0.099705 259.84);
111
- --color-primary-darker: oklch(0.1885 0.08211 259.84);
112
- --color-secondary: oklch(0.9267 0.0417 227.89);
113
- --color-secondary-dark: oklch(0.9110499999999999 0.0543 226.8175);
114
- --color-secondary-darker: oklch(0.8954 0.0669 225.745);
115
- --color-tertiary: oklch(0.5751 0.2298 260.76);
116
- --color-tertiary-dark: oklch(0.503825 0.201675 260.53);
117
- --color-accent: oklch(0.562 0.2175 20.33);
118
- --color-accent-dark: oklch(0.50075 0.19485 19.529999999999998);
119
- --color-success: oklch(0.549 0.1849 142.8);
120
- --color-success-dark: oklch(0.452925 0.157165 142.8);
121
- --color-warning: oklch(0.5833 0.169705 43.9973);
122
- --color-warning-dark: oklch(0.4812225 0.14424925 43.9973);
123
- --color-error: oklch(0.502 0.1927 18.08);
124
- --color-error-dark: oklch(0.41415 0.16379500000000002 18.08);
125
- --color-info: oklch(0.4506 0.1233 262.35);
126
- --color-info-dark: oklch(0.371745 0.10480500000000001 262.35);
93
+ --color-nsw-grey-50: oklch(0.9850175274112574 0 0);
94
+ --color-nsw-grey-100: oklch(0.9700350548225147 0 0);
95
+ --color-nsw-grey-200: oklch(0.9400701096450296 0 0);
96
+ --color-nsw-grey-300: oklch(0.9015833129261941 0.0038881189007590215 228.8687380011113);
97
+ --color-nsw-grey-400: oklch(0.8630965162073586 0.007776237801518043 228.8687380011113);
98
+ --color-nsw-grey-500: oklch(0.6447616500965888 0.009489236713901311 230.74294411759388);
99
+ --color-nsw-grey-600: oklch(0.426426783985819 0.011202235626284581 232.61715023407646);
100
+ --color-nsw-grey-700: oklch(0.3479196456937804 0.010781103557482309 237.35049475166784);
101
+ --color-nsw-grey-800: oklch(0.26941250740174183 0.010359971488680036 242.08383926925922);
102
+ --color-nsw-grey-850: oklch(0.222265318606437 0.00880597576537803 242.08383926925922);
103
+ --color-nsw-grey-900: oklch(0.17511812981113217 0.007251980042076026 242.08383926925922);
104
+ --color-nsw-grey-950: oklch(0.12797094101582737 0.005697984318774021 242.08383926925922);
105
+ --color-nsw-blue-800: oklch(0.2899986864508513 0.11729574451023282 259.841936589881);
106
+ --color-nsw-red-600: oklch(0.5619554183945837 0.2175050118438328 20.33356497329407);
107
+ --color-primary-200: oklch(0.9266735792514218 0.04166332334226081 227.890755564881);
108
+ --color-primary-250: oklch(0.9110280326138016 0.05428316129852959 226.81685418252806);
109
+ --color-primary-600: oklch(0.5751126532766045 0.2298336295034379 260.75633298199585);
110
+ --color-primary-700: oklch(0.43255566986372795 0.17356468700683536 260.29913478593846);
111
+ --color-primary-800: oklch(0.2899986864508513 0.11729574451023282 259.841936589881);
112
+ --color-accent-600: oklch(0.5619554183945837 0.2175050118438328 20.33356497329407);
113
+ --color-grey-50: oklch(0.9850175274112574 0 0);
114
+ --color-grey-100: oklch(0.9700350548225147 0 0);
115
+ --color-grey-200: oklch(0.9400701096450296 0 0);
116
+ --color-grey-300: oklch(0.9015833129261941 0.0038881189007590215 228.8687380011113);
117
+ --color-grey-400: oklch(0.8630965162073586 0.007776237801518043 228.8687380011113);
118
+ --color-grey-500: oklch(0.6447616500965888 0.009489236713901311 230.74294411759388);
119
+ --color-grey-600: oklch(0.426426783985819 0.011202235626284581 232.61715023407646);
120
+ --color-grey-800: oklch(0.26941250740174183 0.010359971488680036 242.08383926925922);
121
+ --color-grey-900: oklch(0.17511812981113217 0.007251980042076026 242.08383926925922);
127
122
  }
128
123
  }
129
124
  @layer base {
@@ -416,6 +411,9 @@
416
411
  .right-0 {
417
412
  right: calc(var(--spacing) * 0);
418
413
  }
414
+ .right-1 {
415
+ right: calc(var(--spacing) * 1);
416
+ }
419
417
  .right-2 {
420
418
  right: calc(var(--spacing) * 2);
421
419
  }
@@ -479,12 +477,12 @@
479
477
  .m-0\.5 {
480
478
  margin: calc(var(--spacing) * 0.5);
481
479
  }
480
+ .m-auto {
481
+ margin: auto;
482
+ }
482
483
  .-mx-1 {
483
484
  margin-inline: calc(var(--spacing) * -1);
484
485
  }
485
- .-mx-\[calc\(--spacing\(1\)-1px\)\] {
486
- margin-inline: calc(calc(calc(var(--spacing) * 1) - 1px) * -1);
487
- }
488
486
  .mx-1 {
489
487
  margin-inline: calc(var(--spacing) * 1);
490
488
  }
@@ -500,6 +498,9 @@
500
498
  .my-6 {
501
499
  margin-block: calc(var(--spacing) * 6);
502
500
  }
501
+ .my-8 {
502
+ margin-block: calc(var(--spacing) * 8);
503
+ }
503
504
  .me-1 {
504
505
  margin-inline-end: calc(var(--spacing) * 1);
505
506
  }
@@ -560,12 +561,6 @@
560
561
  .mb-4 {
561
562
  margin-bottom: calc(var(--spacing) * 4);
562
563
  }
563
- .mb-6 {
564
- margin-bottom: calc(var(--spacing) * 6);
565
- }
566
- .mb-8 {
567
- margin-bottom: calc(var(--spacing) * 8);
568
- }
569
564
  .-ml-0 {
570
565
  margin-left: calc(var(--spacing) * -0);
571
566
  }
@@ -614,6 +609,9 @@
614
609
  .hidden {
615
610
  display: none;
616
611
  }
612
+ .inline {
613
+ display: inline;
614
+ }
617
615
  .inline-block {
618
616
  display: inline-block;
619
617
  }
@@ -678,10 +676,6 @@
678
676
  width: calc(var(--spacing) * 10);
679
677
  height: calc(var(--spacing) * 10);
680
678
  }
681
- .size-\[2\.75rem\] {
682
- width: 2.75rem;
683
- height: 2.75rem;
684
- }
685
679
  .size-\[max\(100\%\,2\.75rem\)\] {
686
680
  width: max(100%, 2.75rem);
687
681
  height: max(100%, 2.75rem);
@@ -753,6 +747,9 @@
753
747
  .h-auto {
754
748
  height: auto;
755
749
  }
750
+ .h-fit {
751
+ height: fit-content;
752
+ }
756
753
  .h-full {
757
754
  height: 100%;
758
755
  }
@@ -813,6 +810,9 @@
813
810
  .w-10 {
814
811
  width: calc(var(--spacing) * 10);
815
812
  }
813
+ .w-12 {
814
+ width: calc(var(--spacing) * 12);
815
+ }
816
816
  .w-48 {
817
817
  width: calc(var(--spacing) * 48);
818
818
  }
@@ -828,6 +828,9 @@
828
828
  .w-80 {
829
829
  width: calc(var(--spacing) * 80);
830
830
  }
831
+ .w-96 {
832
+ width: calc(var(--spacing) * 96);
833
+ }
831
834
  .w-\[44px\] {
832
835
  width: 44px;
833
836
  }
@@ -837,6 +840,9 @@
837
840
  .w-\[100px\] {
838
841
  width: 100px;
839
842
  }
843
+ .w-\[180px\] {
844
+ width: 180px;
845
+ }
840
846
  .w-\[400px\] {
841
847
  width: 400px;
842
848
  }
@@ -998,12 +1004,18 @@
998
1004
  rotate: 45deg;
999
1005
  }
1000
1006
  .transform {
1001
- transform: var(--tw-rotate-x) var(--tw-rotate-y) var(--tw-rotate-z) var(--tw-skew-x)
1002
- var(--tw-skew-y);
1007
+ transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,)
1008
+ var(--tw-skew-y,);
1003
1009
  }
1004
1010
  .animate-pulse {
1005
1011
  animation: var(--animate-pulse);
1006
1012
  }
1013
+ .animate-spin {
1014
+ animation: var(--animate-spin);
1015
+ }
1016
+ .cursor-auto {
1017
+ cursor: auto;
1018
+ }
1007
1019
  .cursor-default {
1008
1020
  cursor: default;
1009
1021
  }
@@ -1118,6 +1130,12 @@
1118
1130
  .gap-9 {
1119
1131
  gap: calc(var(--spacing) * 9);
1120
1132
  }
1133
+ .gap-\[calc\(--spacing\(1\)\*1\.5\)\] {
1134
+ gap: calc(calc(var(--spacing) * 1) * 1.5);
1135
+ }
1136
+ .gap-\[calc\(--spacing\(2\)\)\] {
1137
+ gap: calc(calc(var(--spacing) * 2));
1138
+ }
1121
1139
  .space-y-2 {
1122
1140
  :where(& > :not(:last-child)) {
1123
1141
  --tw-space-y-reverse: 0;
@@ -1286,6 +1304,10 @@
1286
1304
  border-style: var(--tw-border-style);
1287
1305
  border-width: 1px;
1288
1306
  }
1307
+ .border-0 {
1308
+ border-style: var(--tw-border-style);
1309
+ border-width: 0px;
1310
+ }
1289
1311
  .border-1 {
1290
1312
  border-style: var(--tw-border-style);
1291
1313
  border-width: 1px;
@@ -1322,6 +1344,24 @@
1322
1344
  --tw-border-style: dashed;
1323
1345
  border-style: dashed;
1324
1346
  }
1347
+ .border-\(--badge-bg\) {
1348
+ border-color: var(--badge-bg);
1349
+ }
1350
+ .border-\(--badge-bg\)\/50 {
1351
+ border-color: var(--badge-bg);
1352
+ @supports (color: color-mix(in lab, red, red)) {
1353
+ border-color: color-mix(in oklab, var(--badge-bg) 50%, transparent);
1354
+ }
1355
+ }
1356
+ .border-\(--btn-bg\) {
1357
+ border-color: var(--btn-bg);
1358
+ }
1359
+ .border-\(--btn-bg\)\/50 {
1360
+ border-color: var(--btn-bg);
1361
+ @supports (color: color-mix(in lab, red, red)) {
1362
+ border-color: color-mix(in oklab, var(--btn-bg) 50%, transparent);
1363
+ }
1364
+ }
1325
1365
  .border-\(--toggle-border\) {
1326
1366
  border-color: var(--toggle-border);
1327
1367
  }
@@ -1340,6 +1380,19 @@
1340
1380
  .border-gray-300 {
1341
1381
  border-color: var(--color-gray-300);
1342
1382
  }
1383
+ .border-grey-200 {
1384
+ border-color: oklch(0.9400701096450296 0 0);
1385
+ }
1386
+ .border-grey-950 {
1387
+ border-color: oklch(0.12797094101582737 0.005697984318774021 242.08383926925922);
1388
+ }
1389
+ .border-grey-950\/10 {
1390
+ border-color: color-mix(
1391
+ in oklab,
1392
+ oklch(0.12797094101582737 0.005697984318774021 242.08383926925922) 10%,
1393
+ transparent
1394
+ );
1395
+ }
1343
1396
  .border-input {
1344
1397
  border-color: var(--input);
1345
1398
  }
@@ -1349,9 +1402,6 @@
1349
1402
  .border-nsw-grey-400 {
1350
1403
  border-color: var(--color-nsw-grey-400);
1351
1404
  }
1352
- .border-primary {
1353
- border-color: oklch(0.29 0.1173 259.84);
1354
- }
1355
1405
  .border-red-400 {
1356
1406
  border-color: var(--color-red-400);
1357
1407
  }
@@ -1367,12 +1417,33 @@
1367
1417
  .border-l-transparent {
1368
1418
  border-left-color: transparent;
1369
1419
  }
1370
- .bg-\(--badge-bg\) {
1420
+ .bg-\(--badge-bg\)\/5 {
1371
1421
  background-color: var(--badge-bg);
1422
+ @supports (color: color-mix(in lab, red, red)) {
1423
+ background-color: color-mix(in oklab, var(--badge-bg) 5%, transparent);
1424
+ }
1425
+ }
1426
+ .bg-\(--badge-border\) {
1427
+ background-color: var(--badge-border);
1428
+ }
1429
+ .bg-\(--btn-bg\)\/5 {
1430
+ background-color: var(--btn-bg);
1431
+ @supports (color: color-mix(in lab, red, red)) {
1432
+ background-color: color-mix(in oklab, var(--btn-bg) 5%, transparent);
1433
+ }
1434
+ }
1435
+ .bg-\(--btn-bg\)\/10 {
1436
+ background-color: var(--btn-bg);
1437
+ @supports (color: color-mix(in lab, red, red)) {
1438
+ background-color: color-mix(in oklab, var(--btn-bg) 10%, transparent);
1439
+ }
1372
1440
  }
1373
1441
  .bg-\(--btn-border\) {
1374
1442
  background-color: var(--btn-border);
1375
1443
  }
1444
+ .bg-\(--btn-transparent\) {
1445
+ background-color: var(--btn-transparent);
1446
+ }
1376
1447
  .bg-background {
1377
1448
  background-color: var(--background);
1378
1449
  }
@@ -1391,15 +1462,31 @@
1391
1462
  .bg-border {
1392
1463
  background-color: var(--border);
1393
1464
  }
1394
- .bg-gray-50 {
1395
- background-color: var(--color-gray-50);
1465
+ .bg-gray-800 {
1466
+ background-color: var(--color-gray-800);
1396
1467
  }
1397
- .bg-gray-100 {
1398
- background-color: var(--color-gray-100);
1468
+ .bg-gray-900 {
1469
+ background-color: var(--color-gray-900);
1399
1470
  }
1400
1471
  .bg-green-50 {
1401
1472
  background-color: var(--color-green-50);
1402
1473
  }
1474
+ .bg-grey-50 {
1475
+ background-color: oklch(0.9850175274112574 0 0);
1476
+ }
1477
+ .bg-grey-100 {
1478
+ background-color: oklch(0.9700350548225147 0 0);
1479
+ }
1480
+ .bg-grey-950 {
1481
+ background-color: oklch(0.12797094101582737 0.005697984318774021 242.08383926925922);
1482
+ }
1483
+ .bg-grey-950\/\[2\.5\%\] {
1484
+ background-color: color-mix(
1485
+ in oklab,
1486
+ oklch(0.12797094101582737 0.005697984318774021 242.08383926925922) 2.5%,
1487
+ transparent
1488
+ );
1489
+ }
1403
1490
  .bg-muted {
1404
1491
  background-color: var(--muted);
1405
1492
  }
@@ -1424,21 +1511,19 @@
1424
1511
  .bg-nsw-grey-800 {
1425
1512
  background-color: var(--color-nsw-grey-800);
1426
1513
  }
1427
- .bg-primary {
1428
- background-color: oklch(0.29 0.1173 259.84);
1514
+ .bg-primary-800 {
1515
+ background-color: oklch(0.2899986864508513 0.11729574451023282 259.841936589881);
1429
1516
  }
1430
- .bg-primary\/10 {
1431
- background-color: color-mix(in oklab, oklch(0.29 0.1173 259.84) 10%, transparent);
1432
- }
1433
- .bg-primary\/20 {
1434
- background-color: color-mix(in oklab, oklch(0.29 0.1173 259.84) 20%, transparent);
1517
+ .bg-primary-800\/10 {
1518
+ background-color: color-mix(
1519
+ in oklab,
1520
+ oklch(0.2899986864508513 0.11729574451023282 259.841936589881) 10%,
1521
+ transparent
1522
+ );
1435
1523
  }
1436
1524
  .bg-purple-50 {
1437
1525
  background-color: var(--color-purple-50);
1438
1526
  }
1439
- .bg-secondary {
1440
- background-color: oklch(0.9267 0.0417 227.89);
1441
- }
1442
1527
  .bg-transparent {
1443
1528
  background-color: transparent;
1444
1529
  }
@@ -1483,8 +1568,8 @@
1483
1568
  .fill-nsw-red-600 {
1484
1569
  fill: var(--color-nsw-red-600);
1485
1570
  }
1486
- .fill-primary {
1487
- fill: oklch(0.29 0.1173 259.84);
1571
+ .fill-primary-800 {
1572
+ fill: oklch(0.2899986864508513 0.11729574451023282 259.841936589881);
1488
1573
  }
1489
1574
  .p-0 {
1490
1575
  padding: calc(var(--spacing) * 0);
@@ -1495,9 +1580,6 @@
1495
1580
  .p-2 {
1496
1581
  padding: calc(var(--spacing) * 2);
1497
1582
  }
1498
- .p-3 {
1499
- padding: calc(var(--spacing) * 3);
1500
- }
1501
1583
  .p-4 {
1502
1584
  padding: calc(var(--spacing) * 4);
1503
1585
  }
@@ -1519,6 +1601,12 @@
1519
1601
  .p-px {
1520
1602
  padding: 1px;
1521
1603
  }
1604
+ .px-0 {
1605
+ padding-inline: calc(var(--spacing) * 0);
1606
+ }
1607
+ .px-0\.5 {
1608
+ padding-inline: calc(var(--spacing) * 0.5);
1609
+ }
1522
1610
  .px-1 {
1523
1611
  padding-inline: calc(var(--spacing) * 1);
1524
1612
  }
@@ -1543,24 +1631,27 @@
1543
1631
  .px-6 {
1544
1632
  padding-inline: calc(var(--spacing) * 6);
1545
1633
  }
1546
- .px-\[calc\(--spacing\(1\)-1px\)\] {
1547
- padding-inline: calc(calc(var(--spacing) * 1) - 1px);
1634
+ .px-\[calc\(--spacing\(1\)\*1\.5\)\] {
1635
+ padding-inline: calc(calc(var(--spacing) * 1) * 1.5);
1548
1636
  }
1549
- .px-\[calc\(--spacing\(3\)-1px\)\] {
1550
- padding-inline: calc(calc(var(--spacing) * 3) - 1px);
1637
+ .px-\[calc\(--spacing\(2\)\)\] {
1638
+ padding-inline: calc(calc(var(--spacing) * 2));
1551
1639
  }
1552
- .px-\[calc\(--spacing\(3\.5\)-1px\)\] {
1553
- padding-inline: calc(calc(var(--spacing) * 3.5) - 1px);
1640
+ .px-\[calc\(--spacing\(2\)\*1\.25\)\] {
1641
+ padding-inline: calc(calc(var(--spacing) * 2) * 1.25);
1554
1642
  }
1555
1643
  .px-\[calc\(--spacing\(4\)-1px\)\] {
1556
1644
  padding-inline: calc(calc(var(--spacing) * 4) - 1px);
1557
1645
  }
1646
+ .px-\[calc\(--spacing\(5\)-1px\)\] {
1647
+ padding-inline: calc(calc(var(--spacing) * 5) - 1px);
1648
+ }
1649
+ .px-\[calc\(--spacing\(6\)-1px\)\] {
1650
+ padding-inline: calc(calc(var(--spacing) * 6) - 1px);
1651
+ }
1558
1652
  .py-0 {
1559
1653
  padding-block: calc(var(--spacing) * 0);
1560
1654
  }
1561
- .py-0\.5 {
1562
- padding-block: calc(var(--spacing) * 0.5);
1563
- }
1564
1655
  .py-1 {
1565
1656
  padding-block: calc(var(--spacing) * 1);
1566
1657
  }
@@ -1585,21 +1676,24 @@
1585
1676
  .py-6 {
1586
1677
  padding-block: calc(var(--spacing) * 6);
1587
1678
  }
1588
- .py-12 {
1589
- padding-block: calc(var(--spacing) * 12);
1590
- }
1591
1679
  .py-16 {
1592
1680
  padding-block: calc(var(--spacing) * 16);
1593
1681
  }
1594
- .py-\[calc\(--spacing\(2\)-1px\)\] {
1595
- padding-block: calc(calc(var(--spacing) * 2) - 1px);
1682
+ .py-\[calc\(--spacing\(1\)\)\] {
1683
+ padding-block: calc(calc(var(--spacing) * 1));
1596
1684
  }
1597
- .py-\[calc\(--spacing\(2\.5\)-1px\)\] {
1598
- padding-block: calc(calc(var(--spacing) * 2.5) - 1px);
1685
+ .py-\[calc\(--spacing\(1\)\*0\.5\)\] {
1686
+ padding-block: calc(calc(var(--spacing) * 1) * 0.5);
1599
1687
  }
1600
1688
  .py-\[calc\(--spacing\(3\)-1px\)\] {
1601
1689
  padding-block: calc(calc(var(--spacing) * 3) - 1px);
1602
1690
  }
1691
+ .py-\[calc\(--spacing\(4\)-1px\)\] {
1692
+ padding-block: calc(calc(var(--spacing) * 4) - 1px);
1693
+ }
1694
+ .py-\[calc\(--spacing\(5\)-1px\)\] {
1695
+ padding-block: calc(calc(var(--spacing) * 5) - 1px);
1696
+ }
1603
1697
  .pt-0 {
1604
1698
  padding-top: calc(var(--spacing) * 0);
1605
1699
  }
@@ -1627,6 +1721,12 @@
1627
1721
  .pr-8 {
1628
1722
  padding-right: calc(var(--spacing) * 8);
1629
1723
  }
1724
+ .pr-12 {
1725
+ padding-right: calc(var(--spacing) * 12);
1726
+ }
1727
+ .pb-0 {
1728
+ padding-bottom: calc(var(--spacing) * 0);
1729
+ }
1630
1730
  .pb-4 {
1631
1731
  padding-bottom: calc(var(--spacing) * 4);
1632
1732
  }
@@ -1688,6 +1788,10 @@
1688
1788
  font-size: var(--text-base);
1689
1789
  line-height: var(--tw-leading, var(--text-base--line-height));
1690
1790
  }
1791
+ .text-base\/5 {
1792
+ font-size: var(--text-base);
1793
+ line-height: calc(var(--spacing) * 5);
1794
+ }
1691
1795
  .text-base\/6 {
1692
1796
  font-size: var(--text-base);
1693
1797
  line-height: calc(var(--spacing) * 6);
@@ -1720,10 +1824,81 @@
1720
1824
  font-size: var(--text-xs);
1721
1825
  line-height: var(--tw-leading, var(--text-xs--line-height));
1722
1826
  }
1827
+ .text-\[calc\(var\(--font-size-1\)_\*_var\(--heading-font-size-adjust\)\)\] {
1828
+ font-size: calc(var(--font-size-1) * var(--heading-font-size-adjust));
1829
+ }
1830
+ .text-\[calc\(var\(--font-size-2\)_\*_var\(--heading-font-size-adjust\)\)\] {
1831
+ font-size: calc(var(--font-size-2) * var(--heading-font-size-adjust));
1832
+ }
1833
+ .text-\[calc\(var\(--font-size-3\)_\*_var\(--heading-font-size-adjust\)\)\] {
1834
+ font-size: calc(var(--font-size-3) * var(--heading-font-size-adjust));
1835
+ }
1836
+ .text-\[calc\(var\(--font-size-4\)_\*_var\(--heading-font-size-adjust\)\)\] {
1837
+ font-size: calc(var(--font-size-4) * var(--heading-font-size-adjust));
1838
+ }
1839
+ .text-\[calc\(var\(--font-size-5\)_\*_var\(--heading-font-size-adjust\)\)\] {
1840
+ font-size: calc(var(--font-size-5) * var(--heading-font-size-adjust));
1841
+ }
1842
+ .text-\[calc\(var\(--font-size-6\)_\*_var\(--heading-font-size-adjust\)\)\] {
1843
+ font-size: calc(var(--font-size-6) * var(--heading-font-size-adjust));
1844
+ }
1845
+ .text-\[calc\(var\(--font-size-7\)_\*_var\(--heading-font-size-adjust\)\)\] {
1846
+ font-size: calc(var(--font-size-7) * var(--heading-font-size-adjust));
1847
+ }
1848
+ .text-\[calc\(var\(--font-size-8\)_\*_var\(--heading-font-size-adjust\)\)\] {
1849
+ font-size: calc(var(--font-size-8) * var(--heading-font-size-adjust));
1850
+ }
1851
+ .text-\[calc\(var\(--font-size-9\)_\*_var\(--heading-font-size-adjust\)\)\] {
1852
+ font-size: calc(var(--font-size-9) * var(--heading-font-size-adjust));
1853
+ }
1854
+ .leading-\[var\(--heading-line-height-1\)\] {
1855
+ --tw-leading: var(--heading-line-height-1);
1856
+ line-height: var(--heading-line-height-1);
1857
+ }
1858
+ .leading-\[var\(--heading-line-height-2\)\] {
1859
+ --tw-leading: var(--heading-line-height-2);
1860
+ line-height: var(--heading-line-height-2);
1861
+ }
1862
+ .leading-\[var\(--heading-line-height-3\)\] {
1863
+ --tw-leading: var(--heading-line-height-3);
1864
+ line-height: var(--heading-line-height-3);
1865
+ }
1866
+ .leading-\[var\(--heading-line-height-4\)\] {
1867
+ --tw-leading: var(--heading-line-height-4);
1868
+ line-height: var(--heading-line-height-4);
1869
+ }
1870
+ .leading-\[var\(--heading-line-height-5\)\] {
1871
+ --tw-leading: var(--heading-line-height-5);
1872
+ line-height: var(--heading-line-height-5);
1873
+ }
1874
+ .leading-\[var\(--heading-line-height-6\)\] {
1875
+ --tw-leading: var(--heading-line-height-6);
1876
+ line-height: var(--heading-line-height-6);
1877
+ }
1878
+ .leading-\[var\(--heading-line-height-7\)\] {
1879
+ --tw-leading: var(--heading-line-height-7);
1880
+ line-height: var(--heading-line-height-7);
1881
+ }
1882
+ .leading-\[var\(--heading-line-height-8\)\] {
1883
+ --tw-leading: var(--heading-line-height-8);
1884
+ line-height: var(--heading-line-height-8);
1885
+ }
1886
+ .leading-\[var\(--heading-line-height-9\)\] {
1887
+ --tw-leading: var(--heading-line-height-9);
1888
+ line-height: var(--heading-line-height-9);
1889
+ }
1890
+ .leading-\[var\(--line-height\)\] {
1891
+ --tw-leading: var(--line-height);
1892
+ line-height: var(--line-height);
1893
+ }
1723
1894
  .leading-none {
1724
1895
  --tw-leading: 1;
1725
1896
  line-height: 1;
1726
1897
  }
1898
+ .font-\[var\(--heading-font-family\)\] {
1899
+ --tw-font-weight: var(--heading-font-family);
1900
+ font-weight: var(--heading-font-family);
1901
+ }
1727
1902
  .font-bold {
1728
1903
  --tw-font-weight: var(--font-weight-bold);
1729
1904
  font-weight: var(--font-weight-bold);
@@ -1740,6 +1915,42 @@
1740
1915
  --tw-font-weight: var(--font-weight-semibold);
1741
1916
  font-weight: var(--font-weight-semibold);
1742
1917
  }
1918
+ .tracking-\[calc\(var\(--letter-spacing-1\)_\+_var\(--heading-letter-spacing\)\)\] {
1919
+ --tw-tracking: calc(var(--letter-spacing-1) + var(--heading-letter-spacing));
1920
+ letter-spacing: calc(var(--letter-spacing-1) + var(--heading-letter-spacing));
1921
+ }
1922
+ .tracking-\[calc\(var\(--letter-spacing-2\)_\+_var\(--heading-letter-spacing\)\)\] {
1923
+ --tw-tracking: calc(var(--letter-spacing-2) + var(--heading-letter-spacing));
1924
+ letter-spacing: calc(var(--letter-spacing-2) + var(--heading-letter-spacing));
1925
+ }
1926
+ .tracking-\[calc\(var\(--letter-spacing-3\)_\+_var\(--heading-letter-spacing\)\)\] {
1927
+ --tw-tracking: calc(var(--letter-spacing-3) + var(--heading-letter-spacing));
1928
+ letter-spacing: calc(var(--letter-spacing-3) + var(--heading-letter-spacing));
1929
+ }
1930
+ .tracking-\[calc\(var\(--letter-spacing-4\)_\+_var\(--heading-letter-spacing\)\)\] {
1931
+ --tw-tracking: calc(var(--letter-spacing-4) + var(--heading-letter-spacing));
1932
+ letter-spacing: calc(var(--letter-spacing-4) + var(--heading-letter-spacing));
1933
+ }
1934
+ .tracking-\[calc\(var\(--letter-spacing-5\)_\+_var\(--heading-letter-spacing\)\)\] {
1935
+ --tw-tracking: calc(var(--letter-spacing-5) + var(--heading-letter-spacing));
1936
+ letter-spacing: calc(var(--letter-spacing-5) + var(--heading-letter-spacing));
1937
+ }
1938
+ .tracking-\[calc\(var\(--letter-spacing-6\)_\+_var\(--heading-letter-spacing\)\)\] {
1939
+ --tw-tracking: calc(var(--letter-spacing-6) + var(--heading-letter-spacing));
1940
+ letter-spacing: calc(var(--letter-spacing-6) + var(--heading-letter-spacing));
1941
+ }
1942
+ .tracking-\[calc\(var\(--letter-spacing-7\)_\+_var\(--heading-letter-spacing\)\)\] {
1943
+ --tw-tracking: calc(var(--letter-spacing-7) + var(--heading-letter-spacing));
1944
+ letter-spacing: calc(var(--letter-spacing-7) + var(--heading-letter-spacing));
1945
+ }
1946
+ .tracking-\[calc\(var\(--letter-spacing-8\)_\+_var\(--heading-letter-spacing\)\)\] {
1947
+ --tw-tracking: calc(var(--letter-spacing-8) + var(--heading-letter-spacing));
1948
+ letter-spacing: calc(var(--letter-spacing-8) + var(--heading-letter-spacing));
1949
+ }
1950
+ .tracking-\[calc\(var\(--letter-spacing-9\)_\+_var\(--heading-letter-spacing\)\)\] {
1951
+ --tw-tracking: calc(var(--letter-spacing-9) + var(--heading-letter-spacing));
1952
+ letter-spacing: calc(var(--letter-spacing-9) + var(--heading-letter-spacing));
1953
+ }
1743
1954
  .tracking-tight {
1744
1955
  --tw-tracking: var(--tracking-tight);
1745
1956
  letter-spacing: var(--tracking-tight);
@@ -1766,8 +1977,17 @@
1766
1977
  .whitespace-nowrap {
1767
1978
  white-space: nowrap;
1768
1979
  }
1769
- .text-accent-dark {
1770
- color: oklch(0.50075 0.19485 19.529999999999998);
1980
+ .text-\(--badge-bg\) {
1981
+ color: var(--badge-bg);
1982
+ }
1983
+ .text-\(--badge-text\) {
1984
+ color: var(--badge-text);
1985
+ }
1986
+ .text-\(--btn-bg\) {
1987
+ color: var(--btn-bg);
1988
+ }
1989
+ .text-\(--btn-text\) {
1990
+ color: var(--btn-text);
1771
1991
  }
1772
1992
  .text-blue-500 {
1773
1993
  color: var(--color-blue-500);
@@ -1781,29 +2001,35 @@
1781
2001
  .text-current {
1782
2002
  color: currentcolor;
1783
2003
  }
1784
- .text-error-dark {
1785
- color: oklch(0.41415 0.16379500000000002 18.08);
1786
- }
1787
2004
  .text-foreground {
1788
2005
  color: var(--foreground);
1789
2006
  }
1790
2007
  .text-gray-500 {
1791
2008
  color: var(--color-gray-500);
1792
2009
  }
1793
- .text-gray-600 {
1794
- color: var(--color-gray-600);
1795
- }
1796
- .text-gray-800 {
1797
- color: var(--color-gray-800);
1798
- }
1799
2010
  .text-gray-900 {
1800
2011
  color: var(--color-gray-900);
1801
2012
  }
1802
2013
  .text-green-500 {
1803
2014
  color: var(--color-green-500);
1804
2015
  }
1805
- .text-info-dark {
1806
- color: oklch(0.371745 0.10480500000000001 262.35);
2016
+ .text-grey-300 {
2017
+ color: oklch(0.9015833129261941 0.0038881189007590215 228.8687380011113);
2018
+ }
2019
+ .text-grey-500 {
2020
+ color: oklch(0.6447616500965888 0.009489236713901311 230.74294411759388);
2021
+ }
2022
+ .text-grey-600 {
2023
+ color: oklch(0.426426783985819 0.011202235626284581 232.61715023407646);
2024
+ }
2025
+ .text-grey-800 {
2026
+ color: oklch(0.26941250740174183 0.010359971488680036 242.08383926925922);
2027
+ }
2028
+ .text-grey-900 {
2029
+ color: oklch(0.17511812981113217 0.007251980042076026 242.08383926925922);
2030
+ }
2031
+ .text-grey-950 {
2032
+ color: oklch(0.12797094101582737 0.005697984318774021 242.08383926925922);
1807
2033
  }
1808
2034
  .text-muted-foreground {
1809
2035
  color: var(--muted-foreground);
@@ -1817,35 +2043,26 @@
1817
2043
  .text-nsw-grey-800 {
1818
2044
  color: var(--color-nsw-grey-800);
1819
2045
  }
1820
- .text-primary {
1821
- color: oklch(0.29 0.1173 259.84);
2046
+ .text-primary-700 {
2047
+ color: oklch(0.43255566986372795 0.17356468700683536 260.29913478593846);
1822
2048
  }
1823
- .text-primary-dark {
1824
- color: oklch(0.23925 0.099705 259.84);
2049
+ .text-primary-750 {
2050
+ color: oklch(0.3612771781572896 0.1454302157585341 260.07053568790974);
1825
2051
  }
1826
- .text-primary-light {
1827
- color: oklch(0.36127499999999996 0.145425 260.07);
2052
+ .text-primary-800 {
2053
+ color: oklch(0.2899986864508513 0.11729574451023282 259.841936589881);
1828
2054
  }
1829
2055
  .text-purple-500 {
1830
2056
  color: var(--color-purple-500);
1831
2057
  }
1832
- .text-secondary {
1833
- color: oklch(0.9267 0.0417 227.89);
1834
- }
1835
2058
  .text-slate-500 {
1836
2059
  color: var(--color-slate-500);
1837
2060
  }
1838
2061
  .text-slate-900 {
1839
2062
  color: var(--color-slate-900);
1840
2063
  }
1841
- .text-success-dark {
1842
- color: oklch(0.452925 0.157165 142.8);
1843
- }
1844
- .text-tertiary-dark {
1845
- color: oklch(0.503825 0.201675 260.53);
1846
- }
1847
- .text-warning-dark {
1848
- color: oklch(0.4812225 0.14424925 43.9973);
2064
+ .text-transparent {
2065
+ color: transparent;
1849
2066
  }
1850
2067
  .text-white {
1851
2068
  color: var(--color-white);
@@ -1865,8 +2082,15 @@
1865
2082
  .underline {
1866
2083
  text-decoration-line: underline;
1867
2084
  }
1868
- .decoration-1 {
1869
- text-decoration-thickness: 1px;
2085
+ .decoration-primary-800 {
2086
+ text-decoration-color: oklch(0.2899986864508513 0.11729574451023282 259.841936589881);
2087
+ }
2088
+ .decoration-primary-800\/50 {
2089
+ text-decoration-color: color-mix(
2090
+ in oklab,
2091
+ oklch(0.2899986864508513 0.11729574451023282 259.841936589881) 50%,
2092
+ transparent
2093
+ );
1870
2094
  }
1871
2095
  .underline-offset-4 {
1872
2096
  text-underline-offset: 4px;
@@ -1964,6 +2188,9 @@
1964
2188
  --tw-ring-color: color-mix(in oklab, var(--ring) 50%, transparent);
1965
2189
  }
1966
2190
  }
2191
+ .ring-offset-white {
2192
+ --tw-ring-offset-color: var(--color-white);
2193
+ }
1967
2194
  .outline-hidden {
1968
2195
  --tw-outline-style: none;
1969
2196
  outline-style: none;
@@ -2006,7 +2233,12 @@
2006
2233
  rotate,
2007
2234
  filter,
2008
2235
  -webkit-backdrop-filter,
2009
- backdrop-filter;
2236
+ backdrop-filter,
2237
+ display,
2238
+ visibility,
2239
+ content-visibility,
2240
+ overlay,
2241
+ pointer-events;
2010
2242
  transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
2011
2243
  transition-duration: var(--tw-duration, var(--default-transition-duration));
2012
2244
  }
@@ -2015,6 +2247,11 @@
2015
2247
  transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
2016
2248
  transition-duration: var(--tw-duration, var(--default-transition-duration));
2017
2249
  }
2250
+ .transition-\[width\,box-shadow\,background-color\] {
2251
+ transition-property: width, box-shadow, background-color;
2252
+ transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
2253
+ transition-duration: var(--tw-duration, var(--default-transition-duration));
2254
+ }
2018
2255
  .transition-all {
2019
2256
  transition-property: all;
2020
2257
  transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
@@ -2074,233 +2311,330 @@
2074
2311
  --tw-outline-style: none;
2075
2312
  outline-style: none;
2076
2313
  }
2314
+ .select-auto {
2315
+ -webkit-user-select: auto;
2316
+ user-select: auto;
2317
+ }
2077
2318
  .select-none {
2078
2319
  -webkit-user-select: none;
2079
2320
  user-select: none;
2080
2321
  }
2081
- .\[--badge-bg\:transparent\] {
2082
- --badge-bg: transparent;
2322
+ .\[--badge-bg\:var\(--color-accent-600\)\] {
2323
+ --badge-bg: var(--color-accent-600);
2324
+ }
2325
+ .\[--badge-bg\:var\(--color-grey-200\)\] {
2326
+ --badge-bg: var(--color-grey-200);
2327
+ }
2328
+ .\[--badge-bg\:var\(--color-grey-600\)\] {
2329
+ --badge-bg: var(--color-grey-600);
2330
+ }
2331
+ .\[--badge-bg\:var\(--color-primary-200\)\] {
2332
+ --badge-bg: var(--color-primary-200);
2333
+ }
2334
+ .\[--badge-bg\:var\(--color-primary-600\)\] {
2335
+ --badge-bg: var(--color-primary-600);
2336
+ }
2337
+ .\[--badge-bg\:var\(--color-primary-800\)\] {
2338
+ --badge-bg: var(--color-primary-800);
2339
+ }
2340
+ .\[--badge-bg\:var\(--color-white\)\] {
2341
+ --badge-bg: var(--color-white);
2342
+ }
2343
+ .\[--badge-border\:var\(--color-accent-600\)\]\/90 {
2344
+ --badge-border: color-mix(
2345
+ in srgb,
2346
+ oklch(0.5619554183945837 0.2175050118438328 20.33356497329407) 90%,
2347
+ transparent
2348
+ );
2349
+ @supports (color: color-mix(in lab, red, red)) {
2350
+ --badge-border: color-mix(in oklab, var(--color-accent-600) 90%, transparent);
2351
+ }
2083
2352
  }
2084
- .\[--badge-bg\:var\(--color-accent\)\]\/10 {
2085
- --badge-bg: color-mix(in srgb, oklch(0.562 0.2175 20.33) 10%, transparent);
2353
+ .\[--badge-border\:var\(--color-grey-200\)\]\/90 {
2354
+ --badge-border: color-mix(in srgb, oklch(0.9400701096450296 0 0) 90%, transparent);
2086
2355
  @supports (color: color-mix(in lab, red, red)) {
2087
- --badge-bg: color-mix(in oklab, var(--color-accent) 10%, transparent);
2356
+ --badge-border: color-mix(in oklab, var(--color-grey-200) 90%, transparent);
2088
2357
  }
2089
2358
  }
2090
- .\[--badge-bg\:var\(--color-error\)\]\/10 {
2091
- --badge-bg: color-mix(in srgb, oklch(0.502 0.1927 18.08) 10%, transparent);
2359
+ .\[--badge-border\:var\(--color-grey-600\)\]\/90 {
2360
+ --badge-border: color-mix(
2361
+ in srgb,
2362
+ oklch(0.426426783985819 0.011202235626284581 232.61715023407646) 90%,
2363
+ transparent
2364
+ );
2092
2365
  @supports (color: color-mix(in lab, red, red)) {
2093
- --badge-bg: color-mix(in oklab, var(--color-error) 10%, transparent);
2366
+ --badge-border: color-mix(in oklab, var(--color-grey-600) 90%, transparent);
2094
2367
  }
2095
2368
  }
2096
- .\[--badge-bg\:var\(--color-info\)\]\/10 {
2097
- --badge-bg: color-mix(in srgb, oklch(0.4506 0.1233 262.35) 10%, transparent);
2369
+ .\[--badge-border\:var\(--color-primary-200\)\]\/90 {
2370
+ --badge-border: color-mix(
2371
+ in srgb,
2372
+ oklch(0.9266735792514218 0.04166332334226081 227.890755564881) 90%,
2373
+ transparent
2374
+ );
2098
2375
  @supports (color: color-mix(in lab, red, red)) {
2099
- --badge-bg: color-mix(in oklab, var(--color-info) 10%, transparent);
2376
+ --badge-border: color-mix(in oklab, var(--color-primary-200) 90%, transparent);
2100
2377
  }
2101
2378
  }
2102
- .\[--badge-bg\:var\(--color-nsw-grey-700\)\]\/10 {
2103
- --badge-bg: color-mix(in srgb, oklch(0.3479 0.0108 237.35000000000002) 10%, transparent);
2379
+ .\[--badge-border\:var\(--color-primary-600\)\]\/90 {
2380
+ --badge-border: color-mix(
2381
+ in srgb,
2382
+ oklch(0.5751126532766045 0.2298336295034379 260.75633298199585) 90%,
2383
+ transparent
2384
+ );
2104
2385
  @supports (color: color-mix(in lab, red, red)) {
2105
- --badge-bg: color-mix(in oklab, var(--color-nsw-grey-700) 10%, transparent);
2386
+ --badge-border: color-mix(in oklab, var(--color-primary-600) 90%, transparent);
2106
2387
  }
2107
2388
  }
2108
- .\[--badge-bg\:var\(--color-primary\)\] {
2109
- --badge-bg: var(--color-primary);
2389
+ .\[--badge-border\:var\(--color-primary-800\)\]\/90 {
2390
+ --badge-border: color-mix(
2391
+ in srgb,
2392
+ oklch(0.2899986864508513 0.11729574451023282 259.841936589881) 90%,
2393
+ transparent
2394
+ );
2395
+ @supports (color: color-mix(in lab, red, red)) {
2396
+ --badge-border: color-mix(in oklab, var(--color-primary-800) 90%, transparent);
2397
+ }
2110
2398
  }
2111
- .\[--badge-bg\:var\(--color-primary\)\]\/10 {
2112
- --badge-bg: color-mix(in srgb, oklch(0.29 0.1173 259.84) 10%, transparent);
2399
+ .\[--badge-border\:var\(--color-white\)\]\/90 {
2400
+ --badge-border: color-mix(in srgb, #fff 90%, transparent);
2113
2401
  @supports (color: color-mix(in lab, red, red)) {
2114
- --badge-bg: color-mix(in oklab, var(--color-primary) 10%, transparent);
2402
+ --badge-border: color-mix(in oklab, var(--color-white) 90%, transparent);
2115
2403
  }
2116
2404
  }
2117
- .\[--badge-bg\:var\(--color-secondary\)\]\/80 {
2118
- --badge-bg: color-mix(in srgb, oklch(0.9267 0.0417 227.89) 80%, transparent);
2405
+ .\[--badge-hover-overlay\:var\(--color-accent-600\)\]\/10 {
2406
+ --badge-hover-overlay: color-mix(
2407
+ in srgb,
2408
+ oklch(0.5619554183945837 0.2175050118438328 20.33356497329407) 10%,
2409
+ transparent
2410
+ );
2119
2411
  @supports (color: color-mix(in lab, red, red)) {
2120
- --badge-bg: color-mix(in oklab, var(--color-secondary) 80%, transparent);
2412
+ --badge-hover-overlay: color-mix(in oklab, var(--color-accent-600) 10%, transparent);
2121
2413
  }
2122
2414
  }
2123
- .\[--badge-bg\:var\(--color-success\)\]\/10 {
2124
- --badge-bg: color-mix(in srgb, oklch(0.549 0.1849 142.8) 10%, transparent);
2415
+ .\[--badge-hover-overlay\:var\(--color-grey-200\)\]\/10 {
2416
+ --badge-hover-overlay: color-mix(in srgb, oklch(0.9400701096450296 0 0) 10%, transparent);
2125
2417
  @supports (color: color-mix(in lab, red, red)) {
2126
- --badge-bg: color-mix(in oklab, var(--color-success) 10%, transparent);
2418
+ --badge-hover-overlay: color-mix(in oklab, var(--color-grey-200) 10%, transparent);
2127
2419
  }
2128
2420
  }
2129
- .\[--badge-bg\:var\(--color-tertiary\)\]\/10 {
2130
- --badge-bg: color-mix(in srgb, oklch(0.5751 0.2298 260.76) 10%, transparent);
2421
+ .\[--badge-hover-overlay\:var\(--color-primary-200\)\]\/30 {
2422
+ --badge-hover-overlay: color-mix(
2423
+ in srgb,
2424
+ oklch(0.9266735792514218 0.04166332334226081 227.890755564881) 30%,
2425
+ transparent
2426
+ );
2131
2427
  @supports (color: color-mix(in lab, red, red)) {
2132
- --badge-bg: color-mix(in oklab, var(--color-tertiary) 10%, transparent);
2428
+ --badge-hover-overlay: color-mix(in oklab, var(--color-primary-200) 30%, transparent);
2133
2429
  }
2134
2430
  }
2135
- .\[--badge-bg\:var\(--color-warning\)\]\/10 {
2136
- --badge-bg: color-mix(in srgb, oklch(0.5833 0.169705 43.9973) 10%, transparent);
2431
+ .\[--badge-hover-overlay\:var\(--color-primary-600\)\]\/10 {
2432
+ --badge-hover-overlay: color-mix(
2433
+ in srgb,
2434
+ oklch(0.5751126532766045 0.2298336295034379 260.75633298199585) 10%,
2435
+ transparent
2436
+ );
2137
2437
  @supports (color: color-mix(in lab, red, red)) {
2138
- --badge-bg: color-mix(in oklab, var(--color-warning) 10%, transparent);
2438
+ --badge-hover-overlay: color-mix(in oklab, var(--color-primary-600) 10%, transparent);
2139
2439
  }
2140
2440
  }
2141
- .\[--badge-bg\:var\(--color-white\)\]\/10 {
2142
- --badge-bg: color-mix(in srgb, #fff 10%, transparent);
2441
+ .\[--badge-hover-overlay\:var\(--color-primary-800\)\]\/10 {
2442
+ --badge-hover-overlay: color-mix(
2443
+ in srgb,
2444
+ oklch(0.2899986864508513 0.11729574451023282 259.841936589881) 10%,
2445
+ transparent
2446
+ );
2143
2447
  @supports (color: color-mix(in lab, red, red)) {
2144
- --badge-bg: color-mix(in oklab, var(--color-white) 10%, transparent);
2448
+ --badge-hover-overlay: color-mix(in oklab, var(--color-primary-800) 10%, transparent);
2145
2449
  }
2146
2450
  }
2147
- .\[--badge-bg\:white\] {
2148
- --badge-bg: white;
2451
+ .\[--badge-text\:var\(--color-grey-800\)\] {
2452
+ --badge-text: var(--color-grey-800);
2453
+ }
2454
+ .\[--badge-text\:var\(--color-primary-800\)\] {
2455
+ --badge-text: var(--color-primary-800);
2149
2456
  }
2150
- .\[--btn-bg\:var\(--color-accent\)\] {
2151
- --btn-bg: var(--color-accent);
2457
+ .\[--badge-text\:var\(--color-white\)\] {
2458
+ --badge-text: var(--color-white);
2152
2459
  }
2153
- .\[--btn-bg\:var\(--color-error\)\] {
2154
- --btn-bg: var(--color-error);
2460
+ .\[--btn-bg\:var\(--color-accent-600\)\] {
2461
+ --btn-bg: var(--color-accent-600);
2155
2462
  }
2156
- .\[--btn-bg\:var\(--color-nsw-grey-600\)\] {
2157
- --btn-bg: var(--color-nsw-grey-600);
2463
+ .\[--btn-bg\:var\(--color-grey-200\)\] {
2464
+ --btn-bg: var(--color-grey-200);
2158
2465
  }
2159
- .\[--btn-bg\:var\(--color-primary\)\] {
2160
- --btn-bg: var(--color-primary);
2466
+ .\[--btn-bg\:var\(--color-grey-600\)\] {
2467
+ --btn-bg: var(--color-grey-600);
2161
2468
  }
2162
- .\[--btn-bg\:var\(--color-secondary\)\] {
2163
- --btn-bg: var(--color-secondary);
2469
+ .\[--btn-bg\:var\(--color-primary-200\)\] {
2470
+ --btn-bg: var(--color-primary-200);
2164
2471
  }
2165
- .\[--btn-bg\:var\(--color-tertiary\)\] {
2166
- --btn-bg: var(--color-tertiary);
2472
+ .\[--btn-bg\:var\(--color-primary-600\)\] {
2473
+ --btn-bg: var(--color-primary-600);
2167
2474
  }
2168
- .\[--btn-bg\:white\] {
2169
- --btn-bg: white;
2475
+ .\[--btn-bg\:var\(--color-primary-800\)\] {
2476
+ --btn-bg: var(--color-primary-800);
2170
2477
  }
2171
- .\[--btn-border\:var\(--color-accent-dark\)\]\/90 {
2172
- --btn-border: color-mix(in srgb, oklch(0.50075 0.19485 19.529999999999998) 90%, transparent);
2478
+ .\[--btn-bg\:var\(--color-white\)\] {
2479
+ --btn-bg: var(--color-white);
2480
+ }
2481
+ .\[--btn-border\:var\(--color-accent-600\)\]\/90 {
2482
+ --btn-border: color-mix(
2483
+ in srgb,
2484
+ oklch(0.5619554183945837 0.2175050118438328 20.33356497329407) 90%,
2485
+ transparent
2486
+ );
2173
2487
  @supports (color: color-mix(in lab, red, red)) {
2174
- --btn-border: color-mix(in oklab, var(--color-accent-dark) 90%, transparent);
2488
+ --btn-border: color-mix(in oklab, var(--color-accent-600) 90%, transparent);
2175
2489
  }
2176
2490
  }
2177
- .\[--btn-border\:var\(--color-error-dark\)\]\/90 {
2178
- --btn-border: color-mix(in srgb, oklch(0.41415 0.16379500000000002 18.08) 90%, transparent);
2491
+ .\[--btn-border\:var\(--color-grey-200\)\] {
2492
+ --btn-border: var(--color-grey-200);
2493
+ }
2494
+ .\[--btn-border\:var\(--color-grey-600\)\]\/90 {
2495
+ --btn-border: color-mix(
2496
+ in srgb,
2497
+ oklch(0.426426783985819 0.011202235626284581 232.61715023407646) 90%,
2498
+ transparent
2499
+ );
2179
2500
  @supports (color: color-mix(in lab, red, red)) {
2180
- --btn-border: color-mix(in oklab, var(--color-error-dark) 90%, transparent);
2501
+ --btn-border: color-mix(in oklab, var(--color-grey-600) 90%, transparent);
2181
2502
  }
2182
2503
  }
2183
- .\[--btn-border\:var\(--color-nsw-grey-200\)\] {
2184
- --btn-border: var(--color-nsw-grey-200);
2185
- }
2186
- .\[--btn-border\:var\(--color-nsw-grey-700\)\]\/90 {
2187
- --btn-border: color-mix(in srgb, oklch(0.3479 0.0108 237.35000000000002) 90%, transparent);
2504
+ .\[--btn-border\:var\(--color-primary-200\)\]\/90 {
2505
+ --btn-border: color-mix(
2506
+ in srgb,
2507
+ oklch(0.9266735792514218 0.04166332334226081 227.890755564881) 90%,
2508
+ transparent
2509
+ );
2188
2510
  @supports (color: color-mix(in lab, red, red)) {
2189
- --btn-border: color-mix(in oklab, var(--color-nsw-grey-700) 90%, transparent);
2511
+ --btn-border: color-mix(in oklab, var(--color-primary-200) 90%, transparent);
2190
2512
  }
2191
2513
  }
2192
- .\[--btn-border\:var\(--color-nsw-grey-800\)\]\/10 {
2193
- --btn-border: color-mix(in srgb, oklch(0.2694 0.0104 242.08) 10%, transparent);
2514
+ .\[--btn-border\:var\(--color-primary-600\)\]\/90 {
2515
+ --btn-border: color-mix(
2516
+ in srgb,
2517
+ oklch(0.5751126532766045 0.2298336295034379 260.75633298199585) 90%,
2518
+ transparent
2519
+ );
2194
2520
  @supports (color: color-mix(in lab, red, red)) {
2195
- --btn-border: color-mix(in oklab, var(--color-nsw-grey-800) 10%, transparent);
2521
+ --btn-border: color-mix(in oklab, var(--color-primary-600) 90%, transparent);
2196
2522
  }
2197
2523
  }
2198
- .\[--btn-border\:var\(--color-primary-dark\)\]\/90 {
2199
- --btn-border: color-mix(in srgb, oklch(0.23925 0.099705 259.84) 90%, transparent);
2524
+ .\[--btn-border\:var\(--color-primary-800\)\]\/90 {
2525
+ --btn-border: color-mix(
2526
+ in srgb,
2527
+ oklch(0.2899986864508513 0.11729574451023282 259.841936589881) 90%,
2528
+ transparent
2529
+ );
2200
2530
  @supports (color: color-mix(in lab, red, red)) {
2201
- --btn-border: color-mix(in oklab, var(--color-primary-dark) 90%, transparent);
2531
+ --btn-border: color-mix(in oklab, var(--color-primary-800) 90%, transparent);
2202
2532
  }
2203
2533
  }
2204
- .\[--btn-border\:var\(--color-secondary-dark\)\]\/80 {
2205
- --btn-border: color-mix(in srgb, oklch(0.9110499999999999 0.0543 226.8175) 80%, transparent);
2534
+ .\[--btn-border\:var\(--color-white\)\]\/90 {
2535
+ --btn-border: color-mix(in srgb, #fff 90%, transparent);
2206
2536
  @supports (color: color-mix(in lab, red, red)) {
2207
- --btn-border: color-mix(in oklab, var(--color-secondary-dark) 80%, transparent);
2537
+ --btn-border: color-mix(in oklab, var(--color-white) 90%, transparent);
2208
2538
  }
2209
2539
  }
2210
- .\[--btn-border\:var\(--color-tertiary-dark\)\]\/90 {
2211
- --btn-border: color-mix(in srgb, oklch(0.503825 0.201675 260.53) 90%, transparent);
2540
+ .\[--btn-hover-overlay\:var\(--color-accent-600\)\]\/10 {
2541
+ --btn-hover-overlay: color-mix(
2542
+ in srgb,
2543
+ oklch(0.5619554183945837 0.2175050118438328 20.33356497329407) 10%,
2544
+ transparent
2545
+ );
2212
2546
  @supports (color: color-mix(in lab, red, red)) {
2213
- --btn-border: color-mix(in oklab, var(--color-tertiary-dark) 90%, transparent);
2547
+ --btn-hover-overlay: color-mix(in oklab, var(--color-accent-600) 10%, transparent);
2214
2548
  }
2215
2549
  }
2216
- .\[--btn-hover-overlay\:var\(--color-nsw-grey-800\)\]\/\[2\.5\%\] {
2217
- --btn-hover-overlay: color-mix(in srgb, oklch(0.2694 0.0104 242.08) 2.5%, transparent);
2550
+ .\[--btn-hover-overlay\:var\(--color-grey-200\)\]\/50 {
2551
+ --btn-hover-overlay: color-mix(in srgb, oklch(0.9400701096450296 0 0) 50%, transparent);
2218
2552
  @supports (color: color-mix(in lab, red, red)) {
2219
- --btn-hover-overlay: color-mix(in oklab, var(--color-nsw-grey-800) 2.5%, transparent);
2553
+ --btn-hover-overlay: color-mix(in oklab, var(--color-grey-200) 50%, transparent);
2220
2554
  }
2221
2555
  }
2222
- .\[--btn-hover-overlay\:var\(--color-nsw-grey-850\)\]\/10 {
2556
+ .\[--btn-hover-overlay\:var\(--color-grey-600\)\]\/10 {
2223
2557
  --btn-hover-overlay: color-mix(
2224
2558
  in srgb,
2225
- oklch(0.22225499999999998 0.00884 242.08) 10%,
2559
+ oklch(0.426426783985819 0.011202235626284581 232.61715023407646) 10%,
2226
2560
  transparent
2227
2561
  );
2228
2562
  @supports (color: color-mix(in lab, red, red)) {
2229
- --btn-hover-overlay: color-mix(in oklab, var(--color-nsw-grey-850) 10%, transparent);
2563
+ --btn-hover-overlay: color-mix(in oklab, var(--color-grey-600) 10%, transparent);
2230
2564
  }
2231
2565
  }
2232
- .\[--btn-hover-overlay\:var\(--color-white\)\]\/10 {
2233
- --btn-hover-overlay: color-mix(in srgb, #fff 10%, transparent);
2566
+ .\[--btn-hover-overlay\:var\(--color-primary-200\)\]\/10 {
2567
+ --btn-hover-overlay: color-mix(
2568
+ in srgb,
2569
+ oklch(0.9266735792514218 0.04166332334226081 227.890755564881) 10%,
2570
+ transparent
2571
+ );
2234
2572
  @supports (color: color-mix(in lab, red, red)) {
2235
- --btn-hover-overlay: color-mix(in oklab, var(--color-white) 10%, transparent);
2573
+ --btn-hover-overlay: color-mix(in oklab, var(--color-primary-200) 10%, transparent);
2236
2574
  }
2237
2575
  }
2238
- .\[--btn-hover-overlay\:var\(--color-white\)\]\/25 {
2239
- --btn-hover-overlay: color-mix(in srgb, #fff 25%, transparent);
2576
+ .\[--btn-hover-overlay\:var\(--color-primary-600\)\]\/10 {
2577
+ --btn-hover-overlay: color-mix(
2578
+ in srgb,
2579
+ oklch(0.5751126532766045 0.2298336295034379 260.75633298199585) 10%,
2580
+ transparent
2581
+ );
2240
2582
  @supports (color: color-mix(in lab, red, red)) {
2241
- --btn-hover-overlay: color-mix(in oklab, var(--color-white) 25%, transparent);
2583
+ --btn-hover-overlay: color-mix(in oklab, var(--color-primary-600) 10%, transparent);
2242
2584
  }
2243
2585
  }
2244
- .\[--btn-icon\:var\(--color-nsw-grey-800\)\] {
2245
- --btn-icon: var(--color-nsw-grey-800);
2246
- }
2247
- .\[--btn-icon\:var\(--color-primary\)\] {
2248
- --btn-icon: var(--color-primary);
2249
- }
2250
- .\[--btn-icon\:var\(--color-white\)\] {
2251
- --btn-icon: var(--color-white);
2252
- }
2253
- .\[--focus-outline\:var\(--color-accent-dark\)\] {
2254
- --focus-outline: var(--color-accent-dark);
2255
- }
2256
- .\[--focus-outline\:var\(--color-error-dark\)\] {
2257
- --focus-outline: var(--color-error-dark);
2258
- }
2259
- .\[--focus-outline\:var\(--color-info-dark\)\] {
2260
- --focus-outline: var(--color-info-dark);
2261
- }
2262
- .\[--focus-outline\:var\(--color-nsw-grey-400\)\] {
2263
- --focus-outline: var(--color-nsw-grey-400);
2264
- }
2265
- .\[--focus-outline\:var\(--color-nsw-grey-700\)\]\/25 {
2266
- --focus-outline: color-mix(in srgb, oklch(0.3479 0.0108 237.35000000000002) 25%, transparent);
2586
+ .\[--btn-hover-overlay\:var\(--color-primary-800\)\]\/10 {
2587
+ --btn-hover-overlay: color-mix(
2588
+ in srgb,
2589
+ oklch(0.2899986864508513 0.11729574451023282 259.841936589881) 10%,
2590
+ transparent
2591
+ );
2267
2592
  @supports (color: color-mix(in lab, red, red)) {
2268
- --focus-outline: color-mix(in oklab, var(--color-nsw-grey-700) 25%, transparent);
2593
+ --btn-hover-overlay: color-mix(in oklab, var(--color-primary-800) 10%, transparent);
2269
2594
  }
2270
2595
  }
2271
- .\[--focus-outline\:var\(--color-primary\)\] {
2272
- --focus-outline: var(--color-primary);
2273
- }
2274
- .\[--focus-outline\:var\(--color-primary\)\]\/35 {
2275
- --focus-outline: color-mix(in srgb, oklch(0.29 0.1173 259.84) 35%, transparent);
2596
+ .\[--btn-hover-overlay\:var\(--color-white\)\]\/15 {
2597
+ --btn-hover-overlay: color-mix(in srgb, #fff 15%, transparent);
2276
2598
  @supports (color: color-mix(in lab, red, red)) {
2277
- --focus-outline: color-mix(in oklab, var(--color-primary) 35%, transparent);
2599
+ --btn-hover-overlay: color-mix(in oklab, var(--color-white) 15%, transparent);
2278
2600
  }
2279
2601
  }
2280
- .\[--focus-outline\:var\(--color-primary\)\]\/40 {
2281
- --focus-outline: color-mix(in srgb, oklch(0.29 0.1173 259.84) 40%, transparent);
2282
- @supports (color: color-mix(in lab, red, red)) {
2283
- --focus-outline: color-mix(in oklab, var(--color-primary) 40%, transparent);
2284
- }
2602
+ .\[--btn-text\:var\(--color-grey-800\)\] {
2603
+ --btn-text: var(--color-grey-800);
2285
2604
  }
2286
- .\[--focus-outline\:var\(--color-secondary-darker\)\] {
2287
- --focus-outline: var(--color-secondary-darker);
2605
+ .\[--btn-text\:var\(--color-primary-800\)\] {
2606
+ --btn-text: var(--color-primary-800);
2288
2607
  }
2289
- .\[--focus-outline\:var\(--color-success-dark\)\] {
2290
- --focus-outline: var(--color-success-dark);
2608
+ .\[--btn-text\:white\] {
2609
+ --btn-text: white;
2291
2610
  }
2292
- .\[--focus-outline\:var\(--color-tertiary\)\]\/35 {
2293
- --focus-outline: color-mix(in srgb, oklch(0.5751 0.2298 260.76) 35%, transparent);
2294
- @supports (color: color-mix(in lab, red, red)) {
2295
- --focus-outline: color-mix(in oklab, var(--color-tertiary) 35%, transparent);
2296
- }
2611
+ .\[--focus-outline\:var\(--color-accent-600\)\] {
2612
+ --focus-outline: var(--color-accent-600);
2613
+ }
2614
+ .\[--focus-outline\:var\(--color-grey-300\)\] {
2615
+ --focus-outline: var(--color-grey-300);
2616
+ }
2617
+ .\[--focus-outline\:var\(--color-grey-600\)\] {
2618
+ --focus-outline: var(--color-grey-600);
2297
2619
  }
2298
- .\[--focus-outline\:var\(--color-warning-dark\)\] {
2299
- --focus-outline: var(--color-warning-dark);
2620
+ .\[--focus-outline\:var\(--color-primary-200\)\] {
2621
+ --focus-outline: var(--color-primary-200);
2622
+ }
2623
+ .\[--focus-outline\:var\(--color-primary-600\)\] {
2624
+ --focus-outline: var(--color-primary-600);
2625
+ }
2626
+ .\[--focus-outline\:var\(--color-primary-800\)\] {
2627
+ --focus-outline: var(--color-primary-800);
2300
2628
  }
2301
2629
  .\[--focus-outline\:var\(--color-white\)\] {
2302
2630
  --focus-outline: var(--color-white);
2303
2631
  }
2632
+ .\[--leading-trim-end\:var\(--heading-leading-trim-end\)\] {
2633
+ --leading-trim-end: var(--heading-leading-trim-end);
2634
+ }
2635
+ .\[--leading-trim-start\:var\(--heading-leading-trim-start\)\] {
2636
+ --leading-trim-start: var(--heading-leading-trim-start);
2637
+ }
2304
2638
  .\[--toggle-border\:var\(--color-nsw-grey-200\)\] {
2305
2639
  --toggle-border: var(--color-nsw-grey-200);
2306
2640
  }
@@ -2325,6 +2659,15 @@
2325
2659
  .zoom-in-95 {
2326
2660
  --tw-enter-scale: 0.95;
2327
2661
  }
2662
+ .group-focus-within\:bg-primary-800\/10 {
2663
+ &:is(:where(.group):focus-within *) {
2664
+ background-color: color-mix(
2665
+ in oklab,
2666
+ oklch(0.2899986864508513 0.11729574451023282 259.841936589881) 10%,
2667
+ transparent
2668
+ );
2669
+ }
2670
+ }
2328
2671
  .group-hover\:fill-nsw-grey-900 {
2329
2672
  &:is(:where(.group):hover *) {
2330
2673
  @media (hover: hover) {
@@ -2339,154 +2682,49 @@
2339
2682
  }
2340
2683
  }
2341
2684
  }
2342
- .group-data-active\:bg-nsw-grey-300 {
2343
- &:is(:where(.group)[data-active] *) {
2344
- background-color: var(--color-nsw-grey-300);
2345
- }
2346
- }
2347
- .group-data-active\:bg-primary\/5 {
2685
+ .group-data-active\:border-\(--badge-bg\) {
2348
2686
  &:is(:where(.group)[data-active] *) {
2349
- background-color: color-mix(in oklab, oklch(0.29 0.1173 259.84) 5%, transparent);
2687
+ border-color: var(--badge-bg);
2350
2688
  }
2351
2689
  }
2352
- .group-data-hover\:border-nsw-grey-300 {
2690
+ .group-data-hover\:border-\(--badge-bg\) {
2353
2691
  &:is(:where(.group)[data-hover] *) {
2354
- border-color: var(--color-nsw-grey-300);
2692
+ border-color: var(--badge-bg);
2355
2693
  }
2356
2694
  }
2357
- .group-data-hover\:bg-nsw-grey-200 {
2358
- &:is(:where(.group)[data-hover] *) {
2359
- background-color: var(--color-nsw-grey-200);
2695
+ .group-data-\[disabled\=true\]\:pointer-events-none {
2696
+ &:is(:where(.group)[data-disabled='true'] *) {
2697
+ pointer-events: none;
2360
2698
  }
2361
2699
  }
2362
- .group-data-hover\:bg-primary\/10 {
2363
- &:is(:where(.group)[data-hover] *) {
2364
- background-color: color-mix(in oklab, oklch(0.29 0.1173 259.84) 10%, transparent);
2700
+ .group-data-\[disabled\=true\]\:opacity-50 {
2701
+ &:is(:where(.group)[data-disabled='true'] *) {
2702
+ opacity: 50%;
2365
2703
  }
2366
2704
  }
2367
- .group-data-hover\:\[--badge-bg\:var\(--color-accent\)\]\/20 {
2368
- &:is(:where(.group)[data-hover] *) {
2369
- --badge-bg: color-mix(in srgb, oklch(0.562 0.2175 20.33) 20%, transparent);
2370
- @supports (color: color-mix(in lab, red, red)) {
2371
- --badge-bg: color-mix(in oklab, var(--color-accent) 20%, transparent);
2372
- }
2705
+ .group-data-\[state\=open\]\:rotate-90 {
2706
+ &:is(:where(.group)[data-state='open'] *) {
2707
+ rotate: 90deg;
2373
2708
  }
2374
2709
  }
2375
- .group-data-hover\:\[--badge-bg\:var\(--color-error\)\]\/20 {
2376
- &:is(:where(.group)[data-hover] *) {
2377
- --badge-bg: color-mix(in srgb, oklch(0.502 0.1927 18.08) 20%, transparent);
2378
- @supports (color: color-mix(in lab, red, red)) {
2379
- --badge-bg: color-mix(in oklab, var(--color-error) 20%, transparent);
2380
- }
2710
+ .group-data-\[state\=open\]\:rotate-180 {
2711
+ &:is(:where(.group)[data-state='open'] *) {
2712
+ rotate: 180deg;
2381
2713
  }
2382
2714
  }
2383
- .group-data-hover\:\[--badge-bg\:var\(--color-info\)\]\/20 {
2384
- &:is(:where(.group)[data-hover] *) {
2385
- --badge-bg: color-mix(in srgb, oklch(0.4506 0.1233 262.35) 20%, transparent);
2386
- @supports (color: color-mix(in lab, red, red)) {
2387
- --badge-bg: color-mix(in oklab, var(--color-info) 20%, transparent);
2388
- }
2715
+ .group-data-\[vaul-drawer-direction\=bottom\]\/drawer-content\:block {
2716
+ &:is(:where(.group\/drawer-content)[data-vaul-drawer-direction='bottom'] *) {
2717
+ display: block;
2389
2718
  }
2390
2719
  }
2391
- .group-data-hover\:\[--badge-bg\:var\(--color-nsw-grey-700\)\]\/20 {
2392
- &:is(:where(.group)[data-hover] *) {
2393
- --badge-bg: color-mix(in srgb, oklch(0.3479 0.0108 237.35000000000002) 20%, transparent);
2394
- @supports (color: color-mix(in lab, red, red)) {
2395
- --badge-bg: color-mix(in oklab, var(--color-nsw-grey-700) 20%, transparent);
2396
- }
2720
+ .group-data-\[viewport\=false\]\/navigation-menu\:top-full {
2721
+ &:is(:where(.group\/navigation-menu)[data-viewport='false'] *) {
2722
+ top: 100%;
2397
2723
  }
2398
2724
  }
2399
- .group-data-hover\:\[--badge-bg\:var\(--color-nsw-grey-800\)\]\/10 {
2400
- &:is(:where(.group)[data-hover] *) {
2401
- --badge-bg: color-mix(in srgb, oklch(0.2694 0.0104 242.08) 10%, transparent);
2402
- @supports (color: color-mix(in lab, red, red)) {
2403
- --badge-bg: color-mix(in oklab, var(--color-nsw-grey-800) 10%, transparent);
2404
- }
2405
- }
2406
- }
2407
- .group-data-hover\:\[--badge-bg\:var\(--color-primary\)\]\/20 {
2408
- &:is(:where(.group)[data-hover] *) {
2409
- --badge-bg: color-mix(in srgb, oklch(0.29 0.1173 259.84) 20%, transparent);
2410
- @supports (color: color-mix(in lab, red, red)) {
2411
- --badge-bg: color-mix(in oklab, var(--color-primary) 20%, transparent);
2412
- }
2413
- }
2414
- }
2415
- .group-data-hover\:\[--badge-bg\:var\(--color-primary-dark\)\] {
2416
- &:is(:where(.group)[data-hover] *) {
2417
- --badge-bg: var(--color-primary-dark);
2418
- }
2419
- }
2420
- .group-data-hover\:\[--badge-bg\:var\(--color-secondary-dark\)\] {
2421
- &:is(:where(.group)[data-hover] *) {
2422
- --badge-bg: var(--color-secondary-dark);
2423
- }
2424
- }
2425
- .group-data-hover\:\[--badge-bg\:var\(--color-success\)\]\/20 {
2426
- &:is(:where(.group)[data-hover] *) {
2427
- --badge-bg: color-mix(in srgb, oklch(0.549 0.1849 142.8) 20%, transparent);
2428
- @supports (color: color-mix(in lab, red, red)) {
2429
- --badge-bg: color-mix(in oklab, var(--color-success) 20%, transparent);
2430
- }
2431
- }
2432
- }
2433
- .group-data-hover\:\[--badge-bg\:var\(--color-tertiary\)\]\/20 {
2434
- &:is(:where(.group)[data-hover] *) {
2435
- --badge-bg: color-mix(in srgb, oklch(0.5751 0.2298 260.76) 20%, transparent);
2436
- @supports (color: color-mix(in lab, red, red)) {
2437
- --badge-bg: color-mix(in oklab, var(--color-tertiary) 20%, transparent);
2438
- }
2439
- }
2440
- }
2441
- .group-data-hover\:\[--badge-bg\:var\(--color-warning\)\]\/20 {
2442
- &:is(:where(.group)[data-hover] *) {
2443
- --badge-bg: color-mix(in srgb, oklch(0.5833 0.169705 43.9973) 20%, transparent);
2444
- @supports (color: color-mix(in lab, red, red)) {
2445
- --badge-bg: color-mix(in oklab, var(--color-warning) 20%, transparent);
2446
- }
2447
- }
2448
- }
2449
- .group-data-hover\:\[--badge-bg\:var\(--color-white\)\]\/20 {
2450
- &:is(:where(.group)[data-hover] *) {
2451
- --badge-bg: color-mix(in srgb, #fff 20%, transparent);
2452
- @supports (color: color-mix(in lab, red, red)) {
2453
- --badge-bg: color-mix(in oklab, var(--color-white) 20%, transparent);
2454
- }
2455
- }
2456
- }
2457
- .group-data-\[disabled\=true\]\:pointer-events-none {
2458
- &:is(:where(.group)[data-disabled='true'] *) {
2459
- pointer-events: none;
2460
- }
2461
- }
2462
- .group-data-\[disabled\=true\]\:opacity-50 {
2463
- &:is(:where(.group)[data-disabled='true'] *) {
2464
- opacity: 50%;
2465
- }
2466
- }
2467
- .group-data-\[state\=open\]\:rotate-90 {
2468
- &:is(:where(.group)[data-state='open'] *) {
2469
- rotate: 90deg;
2470
- }
2471
- }
2472
- .group-data-\[state\=open\]\:rotate-180 {
2473
- &:is(:where(.group)[data-state='open'] *) {
2474
- rotate: 180deg;
2475
- }
2476
- }
2477
- .group-data-\[vaul-drawer-direction\=bottom\]\/drawer-content\:block {
2478
- &:is(:where(.group\/drawer-content)[data-vaul-drawer-direction='bottom'] *) {
2479
- display: block;
2480
- }
2481
- }
2482
- .group-data-\[viewport\=false\]\/navigation-menu\:top-full {
2483
- &:is(:where(.group\/navigation-menu)[data-viewport='false'] *) {
2484
- top: 100%;
2485
- }
2486
- }
2487
- .group-data-\[viewport\=false\]\/navigation-menu\:mt-1\.5 {
2488
- &:is(:where(.group\/navigation-menu)[data-viewport='false'] *) {
2489
- margin-top: calc(var(--spacing) * 1.5);
2725
+ .group-data-\[viewport\=false\]\/navigation-menu\:mt-1\.5 {
2726
+ &:is(:where(.group\/navigation-menu)[data-viewport='false'] *) {
2727
+ margin-top: calc(var(--spacing) * 1.5);
2490
2728
  }
2491
2729
  }
2492
2730
  .group-data-\[viewport\=false\]\/navigation-menu\:overflow-hidden {
@@ -2526,6 +2764,16 @@
2526
2764
  animation-duration: 200ms;
2527
2765
  }
2528
2766
  }
2767
+ .group-\[\.w-full\]\:flex-row {
2768
+ &:is(:where(.group):is(.w-full) *) {
2769
+ flex-direction: row;
2770
+ }
2771
+ }
2772
+ .peer-focus\:pointer-events-auto {
2773
+ &:is(:where(.peer):focus ~ *) {
2774
+ pointer-events: auto;
2775
+ }
2776
+ }
2529
2777
  .peer-disabled\:cursor-not-allowed {
2530
2778
  &:is(:where(.peer):disabled ~ *) {
2531
2779
  cursor: not-allowed;
@@ -2536,14 +2784,6 @@
2536
2784
  opacity: 50%;
2537
2785
  }
2538
2786
  }
2539
- .selection\:bg-primary {
2540
- & *::selection {
2541
- background-color: oklch(0.29 0.1173 259.84);
2542
- }
2543
- &::selection {
2544
- background-color: oklch(0.29 0.1173 259.84);
2545
- }
2546
- }
2547
2787
  .file\:inline-flex {
2548
2788
  &::file-selector-button {
2549
2789
  display: inline-flex;
@@ -2582,11 +2822,36 @@
2582
2822
  color: var(--foreground);
2583
2823
  }
2584
2824
  }
2825
+ .placeholder\:text-grey-500 {
2826
+ &::placeholder {
2827
+ color: oklch(0.6447616500965888 0.009489236713901311 230.74294411759388);
2828
+ }
2829
+ }
2830
+ .placeholder\:text-grey-700 {
2831
+ &::placeholder {
2832
+ color: oklch(0.3479196456937804 0.010781103557482309 237.35049475166784);
2833
+ }
2834
+ }
2585
2835
  .placeholder\:text-muted-foreground {
2586
2836
  &::placeholder {
2587
2837
  color: var(--muted-foreground);
2588
2838
  }
2589
2839
  }
2840
+ .placeholder\:text-transparent {
2841
+ &::placeholder {
2842
+ color: transparent;
2843
+ }
2844
+ }
2845
+ .placeholder\:opacity-0 {
2846
+ &::placeholder {
2847
+ opacity: 0%;
2848
+ }
2849
+ }
2850
+ .placeholder\:opacity-100 {
2851
+ &::placeholder {
2852
+ opacity: 100%;
2853
+ }
2854
+ }
2590
2855
  .before\:absolute {
2591
2856
  &::before {
2592
2857
  content: var(--tw-content);
@@ -2605,18 +2870,78 @@
2605
2870
  z-index: calc(10 * -1);
2606
2871
  }
2607
2872
  }
2873
+ .before\:mb-\[calc\(var\(--leading-trim-start\,var\(--default-leading-trim-start\)\)-var\(--line-height\,calc\(1em\*var\(--default-line-height\)\)\)\/2\)\] {
2874
+ &::before {
2875
+ content: var(--tw-content);
2876
+ margin-bottom: calc(
2877
+ var(--leading-trim-start, var(--default-leading-trim-start)) -
2878
+ var(--line-height, calc(1em * var(--default-line-height))) / 2
2879
+ );
2880
+ }
2881
+ }
2882
+ .before\:table {
2883
+ &::before {
2884
+ content: var(--tw-content);
2885
+ display: table;
2886
+ }
2887
+ }
2608
2888
  .before\:rounded-\[calc\(var\(--radius-sm\)-1px\)\] {
2609
2889
  &::before {
2610
2890
  content: var(--tw-content);
2611
2891
  border-radius: calc(var(--radius-sm) - 1px);
2612
2892
  }
2613
2893
  }
2894
+ .before\:bg-\(--badge-bg\) {
2895
+ &::before {
2896
+ content: var(--tw-content);
2897
+ background-color: var(--badge-bg);
2898
+ }
2899
+ }
2900
+ .before\:bg-\(--badge-bg\)\/5 {
2901
+ &::before {
2902
+ content: var(--tw-content);
2903
+ background-color: var(--badge-bg);
2904
+ @supports (color: color-mix(in lab, red, red)) {
2905
+ background-color: color-mix(in oklab, var(--badge-bg) 5%, transparent);
2906
+ }
2907
+ }
2908
+ }
2614
2909
  .before\:bg-\(--btn-bg\) {
2615
2910
  &::before {
2616
2911
  content: var(--tw-content);
2617
2912
  background-color: var(--btn-bg);
2618
2913
  }
2619
2914
  }
2915
+ .before\:bg-\(--btn-bg\)\/5 {
2916
+ &::before {
2917
+ content: var(--tw-content);
2918
+ background-color: var(--btn-bg);
2919
+ @supports (color: color-mix(in lab, red, red)) {
2920
+ background-color: color-mix(in oklab, var(--btn-bg) 5%, transparent);
2921
+ }
2922
+ }
2923
+ }
2924
+ .before\:bg-\(--btn-bg\)\/10 {
2925
+ &::before {
2926
+ content: var(--tw-content);
2927
+ background-color: var(--btn-bg);
2928
+ @supports (color: color-mix(in lab, red, red)) {
2929
+ background-color: color-mix(in oklab, var(--btn-bg) 10%, transparent);
2930
+ }
2931
+ }
2932
+ }
2933
+ .before\:bg-\(--btn-transparent\) {
2934
+ &::before {
2935
+ content: var(--tw-content);
2936
+ background-color: var(--btn-transparent);
2937
+ }
2938
+ }
2939
+ .before\:bg-transparent {
2940
+ &::before {
2941
+ content: var(--tw-content);
2942
+ background-color: transparent;
2943
+ }
2944
+ }
2620
2945
  .before\:shadow-sm {
2621
2946
  &::before {
2622
2947
  content: var(--tw-content);
@@ -2628,6 +2953,27 @@
2628
2953
  var(--tw-ring-shadow), var(--tw-shadow);
2629
2954
  }
2630
2955
  }
2956
+ .before\:content-\[\"\"\] {
2957
+ &::before {
2958
+ content: var(--tw-content);
2959
+ --tw-content: '';
2960
+ content: var(--tw-content);
2961
+ }
2962
+ }
2963
+ .before\:content-\[\\\"\\\"\] {
2964
+ &::before {
2965
+ content: var(--tw-content);
2966
+ --tw-content: \"\";
2967
+ content: var(--tw-content);
2968
+ }
2969
+ }
2970
+ .before\:content-none {
2971
+ &::before {
2972
+ content: var(--tw-content);
2973
+ --tw-content: none;
2974
+ content: none;
2975
+ }
2976
+ }
2631
2977
  .after\:absolute {
2632
2978
  &::after {
2633
2979
  content: var(--tw-content);
@@ -2658,6 +3004,21 @@
2658
3004
  z-index: calc(10 * -1);
2659
3005
  }
2660
3006
  }
3007
+ .after\:mt-\[calc\(var\(--leading-trim-end\,var\(--default-leading-trim-end\)\)-var\(--line-height\,calc\(1em\*var\(--default-line-height\)\)\)\/2\)\] {
3008
+ &::after {
3009
+ content: var(--tw-content);
3010
+ margin-top: calc(
3011
+ var(--leading-trim-end, var(--default-leading-trim-end)) -
3012
+ var(--line-height, calc(1em * var(--default-line-height))) / 2
3013
+ );
3014
+ }
3015
+ }
3016
+ .after\:table {
3017
+ &::after {
3018
+ content: var(--tw-content);
3019
+ display: table;
3020
+ }
3021
+ }
2661
3022
  .after\:w-1 {
2662
3023
  &::after {
2663
3024
  content: var(--tw-content);
@@ -2677,17 +3038,41 @@
2677
3038
  border-radius: calc(var(--radius-sm) - 1px);
2678
3039
  }
2679
3040
  }
2680
- .after\:shadow-\[shadow\:inset_0_1px_--theme\(--color-white\/15\%\)\] {
3041
+ .after\:content-\[\"\"\] {
2681
3042
  &::after {
2682
3043
  content: var(--tw-content);
2683
- --tw-shadow: inset 0 1px var(--tw-shadow-color, color-mix(in srgb, #fff 15%, transparent));
2684
- @supports (color: color-mix(in lab, red, red)) {
2685
- --tw-shadow: inset 0 1px
2686
- var(--tw-shadow-color, color-mix(in oklab, var(--color-white) 15%, transparent));
3044
+ --tw-content: '';
3045
+ content: var(--tw-content);
3046
+ }
3047
+ }
3048
+ .after\:content-\[\\\"\\\"\] {
3049
+ &::after {
3050
+ content: var(--tw-content);
3051
+ --tw-content: \"\";
3052
+ content: var(--tw-content);
3053
+ }
3054
+ }
3055
+ .after\:content-none {
3056
+ &::after {
3057
+ content: var(--tw-content);
3058
+ --tw-content: none;
3059
+ content: none;
3060
+ }
3061
+ }
3062
+ .group-data-active\:after\:bg-\(--badge-hover-overlay\) {
3063
+ &:is(:where(.group)[data-active] *) {
3064
+ &::after {
3065
+ content: var(--tw-content);
3066
+ background-color: var(--badge-hover-overlay);
3067
+ }
3068
+ }
3069
+ }
3070
+ .group-data-hover\:after\:bg-\(--badge-hover-overlay\) {
3071
+ &:is(:where(.group)[data-hover] *) {
3072
+ &::after {
3073
+ content: var(--tw-content);
3074
+ background-color: var(--badge-hover-overlay);
2687
3075
  }
2688
- box-shadow:
2689
- var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow),
2690
- var(--tw-ring-shadow), var(--tw-shadow);
2691
3076
  }
2692
3077
  }
2693
3078
  .first\:rounded-l-sm {
@@ -2732,13 +3117,6 @@
2732
3117
  }
2733
3118
  }
2734
3119
  }
2735
- .hover\:bg-accent {
2736
- &:hover {
2737
- @media (hover: hover) {
2738
- background-color: oklch(0.562 0.2175 20.33);
2739
- }
2740
- }
2741
- }
2742
3120
  .hover\:bg-blue-100 {
2743
3121
  &:hover {
2744
3122
  @media (hover: hover) {
@@ -2760,48 +3138,52 @@
2760
3138
  }
2761
3139
  }
2762
3140
  }
2763
- .hover\:bg-muted\/50 {
3141
+ .hover\:bg-grey-100 {
2764
3142
  &:hover {
2765
3143
  @media (hover: hover) {
2766
- background-color: var(--muted);
2767
- @supports (color: color-mix(in lab, red, red)) {
2768
- background-color: color-mix(in oklab, var(--muted) 50%, transparent);
2769
- }
3144
+ background-color: oklch(0.9700350548225147 0 0);
2770
3145
  }
2771
3146
  }
2772
3147
  }
2773
- .hover\:bg-nsw-grey-100 {
3148
+ .hover\:bg-grey-300 {
2774
3149
  &:hover {
2775
3150
  @media (hover: hover) {
2776
- background-color: var(--color-nsw-grey-100);
3151
+ background-color: oklch(0.9015833129261941 0.0038881189007590215 228.8687380011113);
2777
3152
  }
2778
3153
  }
2779
3154
  }
2780
- .hover\:bg-primary\/10 {
3155
+ .hover\:bg-muted\/50 {
2781
3156
  &:hover {
2782
3157
  @media (hover: hover) {
2783
- background-color: color-mix(in oklab, oklch(0.29 0.1173 259.84) 10%, transparent);
3158
+ background-color: var(--muted);
3159
+ @supports (color: color-mix(in lab, red, red)) {
3160
+ background-color: color-mix(in oklab, var(--muted) 50%, transparent);
3161
+ }
2784
3162
  }
2785
3163
  }
2786
3164
  }
2787
- .hover\:bg-primary\/90 {
3165
+ .hover\:bg-nsw-grey-100 {
2788
3166
  &:hover {
2789
3167
  @media (hover: hover) {
2790
- background-color: color-mix(in oklab, oklch(0.29 0.1173 259.84) 90%, transparent);
3168
+ background-color: var(--color-nsw-grey-100);
2791
3169
  }
2792
3170
  }
2793
3171
  }
2794
- .hover\:bg-purple-100 {
3172
+ .hover\:bg-primary-800\/10 {
2795
3173
  &:hover {
2796
3174
  @media (hover: hover) {
2797
- background-color: var(--color-purple-100);
3175
+ background-color: color-mix(
3176
+ in oklab,
3177
+ oklch(0.2899986864508513 0.11729574451023282 259.841936589881) 10%,
3178
+ transparent
3179
+ );
2798
3180
  }
2799
3181
  }
2800
3182
  }
2801
- .hover\:bg-secondary\/80 {
3183
+ .hover\:bg-purple-100 {
2802
3184
  &:hover {
2803
3185
  @media (hover: hover) {
2804
- background-color: color-mix(in oklab, oklch(0.9267 0.0417 227.89) 80%, transparent);
3186
+ background-color: var(--color-purple-100);
2805
3187
  }
2806
3188
  }
2807
3189
  }
@@ -2827,17 +3209,17 @@
2827
3209
  }
2828
3210
  }
2829
3211
  }
2830
- .hover\:text-gray-600 {
3212
+ .hover\:text-green-600 {
2831
3213
  &:hover {
2832
3214
  @media (hover: hover) {
2833
- color: var(--color-gray-600);
3215
+ color: var(--color-green-600);
2834
3216
  }
2835
3217
  }
2836
3218
  }
2837
- .hover\:text-green-600 {
3219
+ .hover\:text-grey-600 {
2838
3220
  &:hover {
2839
3221
  @media (hover: hover) {
2840
- color: var(--color-green-600);
3222
+ color: oklch(0.426426783985819 0.011202235626284581 232.61715023407646);
2841
3223
  }
2842
3224
  }
2843
3225
  }
@@ -2855,17 +3237,24 @@
2855
3237
  }
2856
3238
  }
2857
3239
  }
2858
- .hover\:text-primary {
3240
+ .hover\:text-primary-700 {
2859
3241
  &:hover {
2860
3242
  @media (hover: hover) {
2861
- color: oklch(0.29 0.1173 259.84);
3243
+ color: oklch(0.43255566986372795 0.17356468700683536 260.29913478593846);
2862
3244
  }
2863
3245
  }
2864
3246
  }
2865
- .hover\:text-primary-darkest {
3247
+ .hover\:text-primary-800 {
2866
3248
  &:hover {
2867
3249
  @media (hover: hover) {
2868
- color: oklch(0.13774999999999998 0.064515 259.84);
3250
+ color: oklch(0.2899986864508513 0.11729574451023282 259.841936589881);
3251
+ }
3252
+ }
3253
+ }
3254
+ .hover\:text-primary-850 {
3255
+ &:hover {
3256
+ @media (hover: hover) {
3257
+ color: oklch(0.23924891632195233 0.0997013828336979 259.841936589881);
2869
3258
  }
2870
3259
  }
2871
3260
  }
@@ -2927,9 +3316,13 @@
2927
3316
  z-index: 10;
2928
3317
  }
2929
3318
  }
2930
- .focus\:bg-primary\/10 {
3319
+ .focus\:bg-primary-800\/10 {
2931
3320
  &:focus {
2932
- background-color: color-mix(in oklab, oklch(0.29 0.1173 259.84) 10%, transparent);
3321
+ background-color: color-mix(
3322
+ in oklab,
3323
+ oklch(0.2899986864508513 0.11729574451023282 259.841936589881) 10%,
3324
+ transparent
3325
+ );
2933
3326
  }
2934
3327
  }
2935
3328
  .focus\:outline {
@@ -2970,37 +3363,14 @@
2970
3363
  outline-color: var(--btn-bg);
2971
3364
  }
2972
3365
  }
2973
- .focus\:outline-\(--toggle-border\) {
2974
- &:focus {
2975
- outline-color: var(--toggle-border);
2976
- }
2977
- }
2978
- .focus\:outline-\[var\(--focus-outline\)\] {
3366
+ .focus\:outline-\(--focus-outline\) {
2979
3367
  &:focus {
2980
3368
  outline-color: var(--focus-outline);
2981
3369
  }
2982
3370
  }
2983
- .focus\:outline-nsw-grey-200 {
2984
- &:focus {
2985
- outline-color: var(--color-nsw-grey-200);
2986
- }
2987
- }
2988
- .focus\:outline-nsw-grey-300 {
2989
- &:focus {
2990
- outline-color: var(--color-nsw-grey-300);
2991
- }
2992
- }
2993
- .focus\:outline-nsw-grey-800\/20 {
2994
- &:focus {
2995
- outline-color: color-mix(in srgb, oklch(0.2694 0.0104 242.08) 20%, transparent);
2996
- @supports (color: color-mix(in lab, red, red)) {
2997
- outline-color: color-mix(in oklab, var(--color-nsw-grey-800) 20%, transparent);
2998
- }
2999
- }
3000
- }
3001
- .focus\:outline-primary {
3371
+ .focus\:outline-\(--toggle-border\) {
3002
3372
  &:focus {
3003
- outline-color: oklch(0.29 0.1173 259.84);
3373
+ outline-color: var(--toggle-border);
3004
3374
  }
3005
3375
  }
3006
3376
  .focus-visible\:z-10 {
@@ -3022,6 +3392,15 @@
3022
3392
  var(--tw-ring-shadow), var(--tw-shadow);
3023
3393
  }
3024
3394
  }
3395
+ .focus-visible\:ring-2 {
3396
+ &:focus-visible {
3397
+ --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width))
3398
+ var(--tw-ring-color, currentcolor);
3399
+ box-shadow:
3400
+ var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow),
3401
+ var(--tw-ring-shadow), var(--tw-shadow);
3402
+ }
3403
+ }
3025
3404
  .focus-visible\:ring-4 {
3026
3405
  &:focus-visible {
3027
3406
  --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(4px + var(--tw-ring-offset-width))
@@ -3049,6 +3428,15 @@
3049
3428
  var(--tw-ring-shadow), var(--tw-shadow);
3050
3429
  }
3051
3430
  }
3431
+ .focus-visible\:ring-primary-650\/70 {
3432
+ &:focus-visible {
3433
+ --tw-ring-color: color-mix(
3434
+ in oklab,
3435
+ oklch(0.5038341615701663 0.20169915825513662 260.52773388396713) 70%,
3436
+ transparent
3437
+ );
3438
+ }
3439
+ }
3052
3440
  .focus-visible\:ring-ring {
3053
3441
  &:focus-visible {
3054
3442
  --tw-ring-color: var(--ring);
@@ -3069,6 +3457,13 @@
3069
3457
  var(--tw-ring-offset-color);
3070
3458
  }
3071
3459
  }
3460
+ .focus-visible\:ring-offset-2 {
3461
+ &:focus-visible {
3462
+ --tw-ring-offset-width: 2px;
3463
+ --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width)
3464
+ var(--tw-ring-offset-color);
3465
+ }
3466
+ }
3072
3467
  .focus-visible\:outline-hidden {
3073
3468
  &:focus-visible {
3074
3469
  --tw-outline-style: none;
@@ -3090,6 +3485,12 @@
3090
3485
  outline-color: var(--ring);
3091
3486
  }
3092
3487
  }
3488
+ .focus-visible\:outline-none {
3489
+ &:focus-visible {
3490
+ --tw-outline-style: none;
3491
+ outline-style: none;
3492
+ }
3493
+ }
3093
3494
  .disabled\:pointer-events-none {
3094
3495
  &:disabled {
3095
3496
  pointer-events: none;
@@ -3120,62 +3521,9 @@
3120
3521
  column-gap: calc(var(--spacing) * 3);
3121
3522
  }
3122
3523
  }
3123
- .aria-invalid\:border-error {
3124
- &[aria-invalid='true'] {
3125
- border-color: oklch(0.502 0.1927 18.08);
3126
- }
3127
- }
3128
- .aria-invalid\:ring-error\/20 {
3129
- &[aria-invalid='true'] {
3130
- --tw-ring-color: color-mix(in oklab, oklch(0.502 0.1927 18.08) 20%, transparent);
3131
- }
3132
- }
3133
- .data-active\:bg-nsw-grey-300 {
3134
- &[data-active] {
3135
- background-color: var(--color-nsw-grey-300);
3136
- }
3137
- }
3138
- .data-active\:bg-primary {
3139
- &[data-active] {
3140
- background-color: oklch(0.29 0.1173 259.84);
3141
- }
3142
- }
3143
- .data-active\:text-white {
3144
- &[data-active] {
3145
- color: var(--color-white);
3146
- }
3147
- }
3148
- .data-active\:\[--btn-border\:var\(--color-nsw-grey-300\)\] {
3149
- &[data-active] {
3150
- --btn-border: var(--color-nsw-grey-300);
3151
- }
3152
- }
3153
- .data-active\:\[--btn-border\:var\(--color-nsw-grey-850\)\]\/15 {
3154
- &[data-active] {
3155
- --btn-border: color-mix(in srgb, oklch(0.22225499999999998 0.00884 242.08) 15%, transparent);
3156
- @supports (color: color-mix(in lab, red, red)) {
3157
- --btn-border: color-mix(in oklab, var(--color-nsw-grey-850) 15%, transparent);
3158
- }
3159
- }
3160
- }
3161
- .data-active\:\[--btn-icon\:var\(--color-nsw-grey-50\)\] {
3524
+ .data-active\:border-\(--btn-bg\) {
3162
3525
  &[data-active] {
3163
- --btn-icon: var(--color-nsw-grey-50);
3164
- }
3165
- }
3166
- .data-active\:\[--btn-icon\:var\(--color-nsw-grey-850\)\] {
3167
- &[data-active] {
3168
- --btn-icon: var(--color-nsw-grey-850);
3169
- }
3170
- }
3171
- .data-active\:\[--btn-icon\:var\(--color-nsw-grey-900\)\] {
3172
- &[data-active] {
3173
- --btn-icon: var(--color-nsw-grey-900);
3174
- }
3175
- }
3176
- .data-active\:\[--btn-icon\:var\(--color-white\)\] {
3177
- &[data-active] {
3178
- --btn-icon: var(--color-white);
3526
+ border-color: var(--btn-bg);
3179
3527
  }
3180
3528
  }
3181
3529
  .data-active\:after\:bg-\(--btn-hover-overlay\) {
@@ -3218,47 +3566,14 @@
3218
3566
  }
3219
3567
  }
3220
3568
  }
3221
- .data-hover\:bg-nsw-grey-200 {
3222
- &[data-hover] {
3223
- background-color: var(--color-nsw-grey-200);
3224
- }
3225
- }
3226
- .data-hover\:bg-primary {
3227
- &[data-hover] {
3228
- background-color: oklch(0.29 0.1173 259.84);
3229
- }
3230
- }
3231
- .data-hover\:text-white {
3232
- &[data-hover] {
3233
- color: var(--color-white);
3234
- }
3235
- }
3236
- .data-hover\:\[--btn-border\:var\(--color-nsw-grey-850\)\]\/15 {
3237
- &[data-hover] {
3238
- --btn-border: color-mix(in srgb, oklch(0.22225499999999998 0.00884 242.08) 15%, transparent);
3239
- @supports (color: color-mix(in lab, red, red)) {
3240
- --btn-border: color-mix(in oklab, var(--color-nsw-grey-850) 15%, transparent);
3241
- }
3242
- }
3243
- }
3244
- .data-hover\:\[--btn-icon\:var\(--color-nsw-grey-50\)\] {
3569
+ .data-hover\:border-\(--btn-bg\) {
3245
3570
  &[data-hover] {
3246
- --btn-icon: var(--color-nsw-grey-50);
3571
+ border-color: var(--btn-bg);
3247
3572
  }
3248
3573
  }
3249
- .data-hover\:\[--btn-icon\:var\(--color-nsw-grey-850\)\] {
3574
+ .data-hover\:decoration-primary-800 {
3250
3575
  &[data-hover] {
3251
- --btn-icon: var(--color-nsw-grey-850);
3252
- }
3253
- }
3254
- .data-hover\:\[--btn-icon\:var\(--color-nsw-grey-900\)\] {
3255
- &[data-hover] {
3256
- --btn-icon: var(--color-nsw-grey-900);
3257
- }
3258
- }
3259
- .data-hover\:\[--btn-icon\:var\(--color-white\)\] {
3260
- &[data-hover] {
3261
- --btn-icon: var(--color-white);
3576
+ text-decoration-color: oklch(0.2899986864508513 0.11729574451023282 259.841936589881);
3262
3577
  }
3263
3578
  }
3264
3579
  .data-hover\:after\:bg-\(--btn-hover-overlay\) {
@@ -3269,19 +3584,27 @@
3269
3584
  }
3270
3585
  }
3271
3586
  }
3272
- .data-\[active\=true\]\:hover\:bg-primary\/10 {
3587
+ .data-\[active\=true\]\:hover\:bg-primary-800\/10 {
3273
3588
  &[data-active='true'] {
3274
3589
  &:hover {
3275
3590
  @media (hover: hover) {
3276
- background-color: color-mix(in oklab, oklch(0.29 0.1173 259.84) 10%, transparent);
3591
+ background-color: color-mix(
3592
+ in oklab,
3593
+ oklch(0.2899986864508513 0.11729574451023282 259.841936589881) 10%,
3594
+ transparent
3595
+ );
3277
3596
  }
3278
3597
  }
3279
3598
  }
3280
3599
  }
3281
- .data-\[active\=true\]\:focus\:bg-primary\/10 {
3600
+ .data-\[active\=true\]\:focus\:bg-primary-800\/10 {
3282
3601
  &[data-active='true'] {
3283
3602
  &:focus {
3284
- background-color: color-mix(in oklab, oklch(0.29 0.1173 259.84) 10%, transparent);
3603
+ background-color: color-mix(
3604
+ in oklab,
3605
+ oklch(0.2899986864508513 0.11729574451023282 259.841936589881) 10%,
3606
+ transparent
3607
+ );
3285
3608
  }
3286
3609
  }
3287
3610
  }
@@ -3479,9 +3802,13 @@
3479
3802
  color: var(--muted-foreground);
3480
3803
  }
3481
3804
  }
3482
- .data-\[selected\=true\]\:bg-primary\/10 {
3805
+ .data-\[selected\=true\]\:bg-primary-800\/10 {
3483
3806
  &[data-selected='true'] {
3484
- background-color: color-mix(in oklab, oklch(0.29 0.1173 259.84) 10%, transparent);
3807
+ background-color: color-mix(
3808
+ in oklab,
3809
+ oklch(0.2899986864508513 0.11729574451023282 259.841936589881) 10%,
3810
+ transparent
3811
+ );
3485
3812
  }
3486
3813
  }
3487
3814
  .data-\[side\=bottom\]\:translate-y-1 {
@@ -3545,17 +3872,17 @@
3545
3872
  }
3546
3873
  }
3547
3874
  }
3548
- .\*\:data-\[slot\=icon\]\:-mx-0\.5 {
3875
+ .\*\:data-\[slot\=icon\]\:-mx-0\.25 {
3549
3876
  :is(& > *) {
3550
3877
  &[data-slot='icon'] {
3551
- margin-inline: calc(var(--spacing) * -0.5);
3878
+ margin-inline: calc(var(--spacing) * -0.25);
3552
3879
  }
3553
3880
  }
3554
3881
  }
3555
- .\*\:data-\[slot\=icon\]\:my-0\.5 {
3882
+ .\*\:data-\[slot\=icon\]\:my-0\.25 {
3556
3883
  :is(& > *) {
3557
3884
  &[data-slot='icon'] {
3558
- margin-block: calc(var(--spacing) * 0.5);
3885
+ margin-block: calc(var(--spacing) * 0.25);
3559
3886
  }
3560
3887
  }
3561
3888
  }
@@ -3650,11 +3977,6 @@
3650
3977
  }
3651
3978
  }
3652
3979
  }
3653
- .data-\[state\=active\]\:border-accent {
3654
- &[data-state='active'] {
3655
- border-color: oklch(0.562 0.2175 20.33);
3656
- }
3657
- }
3658
3980
  .data-\[state\=active\]\:bg-background {
3659
3981
  &[data-state='active'] {
3660
3982
  background-color: var(--background);
@@ -3686,14 +4008,14 @@
3686
4008
  translate: var(--tw-translate-x) var(--tw-translate-y);
3687
4009
  }
3688
4010
  }
3689
- .data-\[state\=checked\]\:border-primary {
4011
+ .data-\[state\=checked\]\:border-primary-800 {
3690
4012
  &[data-state='checked'] {
3691
- border-color: oklch(0.29 0.1173 259.84);
4013
+ border-color: oklch(0.2899986864508513 0.11729574451023282 259.841936589881);
3692
4014
  }
3693
4015
  }
3694
- .data-\[state\=checked\]\:bg-primary {
4016
+ .data-\[state\=checked\]\:bg-primary-800 {
3695
4017
  &[data-state='checked'] {
3696
- background-color: oklch(0.29 0.1173 259.84);
4018
+ background-color: oklch(0.2899986864508513 0.11729574451023282 259.841936589881);
3697
4019
  }
3698
4020
  }
3699
4021
  .data-\[state\=closed\]\:duration-300 {
@@ -3806,9 +4128,13 @@
3806
4128
  background-color: var(--color-nsw-grey-100);
3807
4129
  }
3808
4130
  }
3809
- .data-\[state\=on\]\:bg-primary\/10 {
4131
+ .data-\[state\=on\]\:bg-primary-800\/10 {
3810
4132
  &[data-state='on'] {
3811
- background-color: color-mix(in oklab, oklch(0.29 0.1173 259.84) 10%, transparent);
4133
+ background-color: color-mix(
4134
+ in oklab,
4135
+ oklch(0.2899986864508513 0.11729574451023282 259.841936589881) 10%,
4136
+ transparent
4137
+ );
3812
4138
  }
3813
4139
  }
3814
4140
  .data-\[state\=on\]\:bg-purple-500 {
@@ -3826,9 +4152,13 @@
3826
4152
  color: var(--color-white);
3827
4153
  }
3828
4154
  }
3829
- .data-\[state\=open\]\:bg-primary\/10 {
4155
+ .data-\[state\=open\]\:bg-primary-800\/10 {
3830
4156
  &[data-state='open'] {
3831
- background-color: color-mix(in oklab, oklch(0.29 0.1173 259.84) 10%, transparent);
4157
+ background-color: color-mix(
4158
+ in oklab,
4159
+ oklch(0.2899986864508513 0.11729574451023282 259.841936589881) 10%,
4160
+ transparent
4161
+ );
3832
4162
  }
3833
4163
  }
3834
4164
  .data-\[state\=open\]\:duration-500 {
@@ -3915,19 +4245,27 @@
3915
4245
  }
3916
4246
  }
3917
4247
  }
3918
- .data-\[state\=open\]\:hover\:bg-primary\/10 {
4248
+ .data-\[state\=open\]\:hover\:bg-primary-800\/10 {
3919
4249
  &[data-state='open'] {
3920
4250
  &:hover {
3921
4251
  @media (hover: hover) {
3922
- background-color: color-mix(in oklab, oklch(0.29 0.1173 259.84) 10%, transparent);
4252
+ background-color: color-mix(
4253
+ in oklab,
4254
+ oklch(0.2899986864508513 0.11729574451023282 259.841936589881) 10%,
4255
+ transparent
4256
+ );
3923
4257
  }
3924
4258
  }
3925
4259
  }
3926
4260
  }
3927
- .data-\[state\=open\]\:focus\:bg-primary\/10 {
4261
+ .data-\[state\=open\]\:focus\:bg-primary-800\/10 {
3928
4262
  &[data-state='open'] {
3929
4263
  &:focus {
3930
- background-color: color-mix(in oklab, oklch(0.29 0.1173 259.84) 10%, transparent);
4264
+ background-color: color-mix(
4265
+ in oklab,
4266
+ oklch(0.2899986864508513 0.11729574451023282 259.841936589881) 10%,
4267
+ transparent
4268
+ );
3931
4269
  }
3932
4270
  }
3933
4271
  }
@@ -3963,25 +4301,202 @@
3963
4301
  --tw-enter-opacity: 0;
3964
4302
  }
3965
4303
  }
3966
- .data-\[variant\=outline\]\:border-l-0 {
3967
- &[data-variant='outline'] {
3968
- border-left-style: var(--tw-border-style);
3969
- border-left-width: 0px;
4304
+ .data-\[variant\=outline\]\:border-l-0 {
4305
+ &[data-variant='outline'] {
4306
+ border-left-style: var(--tw-border-style);
4307
+ border-left-width: 0px;
4308
+ }
4309
+ }
4310
+ .data-\[variant\=outline\]\:shadow-xs {
4311
+ &[data-variant='outline'] {
4312
+ --tw-shadow: 0 1px 2px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.05));
4313
+ box-shadow:
4314
+ var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow),
4315
+ var(--tw-ring-shadow), var(--tw-shadow);
4316
+ }
4317
+ }
4318
+ .data-\[variant\=outline\]\:\[--badge-hover-overlay\:var\(--color-grey-200\)\]\/20 {
4319
+ &[data-variant='outline'] {
4320
+ --badge-hover-overlay: color-mix(in srgb, oklch(0.9400701096450296 0 0) 20%, transparent);
4321
+ @supports (color: color-mix(in lab, red, red)) {
4322
+ --badge-hover-overlay: color-mix(in oklab, var(--color-grey-200) 20%, transparent);
4323
+ }
4324
+ }
4325
+ }
4326
+ .data-\[variant\=outline\]\:first\:border-l {
4327
+ &[data-variant='outline'] {
4328
+ &:first-child {
4329
+ border-left-style: var(--tw-border-style);
4330
+ border-left-width: 1px;
4331
+ }
4332
+ }
4333
+ }
4334
+ .data-\[variant\=soft\]\:\[--badge-bg\:var\(--color-grey-500\)\] {
4335
+ &[data-variant='soft'] {
4336
+ --badge-bg: var(--color-grey-500);
4337
+ }
4338
+ }
4339
+ .data-\[variant\=soft\]\:\[--btn-bg\:var\(--color-grey-400\)\] {
4340
+ &[data-variant='soft'] {
4341
+ --btn-bg: var(--color-grey-400);
4342
+ }
4343
+ }
4344
+ .data-\[variant\=soft\]\:\[--focus-outline\:var\(--color-accent-600\)\]\/20 {
4345
+ &[data-variant='soft'] {
4346
+ --focus-outline: color-mix(
4347
+ in srgb,
4348
+ oklch(0.5619554183945837 0.2175050118438328 20.33356497329407) 20%,
4349
+ transparent
4350
+ );
4351
+ @supports (color: color-mix(in lab, red, red)) {
4352
+ --focus-outline: color-mix(in oklab, var(--color-accent-600) 20%, transparent);
4353
+ }
4354
+ }
4355
+ }
4356
+ .data-\[variant\=soft\]\:\[--focus-outline\:var\(--color-grey-600\)\]\/20 {
4357
+ &[data-variant='soft'] {
4358
+ --focus-outline: color-mix(
4359
+ in srgb,
4360
+ oklch(0.426426783985819 0.011202235626284581 232.61715023407646) 20%,
4361
+ transparent
4362
+ );
4363
+ @supports (color: color-mix(in lab, red, red)) {
4364
+ --focus-outline: color-mix(in oklab, var(--color-grey-600) 20%, transparent);
4365
+ }
4366
+ }
4367
+ }
4368
+ .data-\[variant\=soft\]\:\[--focus-outline\:var\(--color-primary-200\)\]\/20 {
4369
+ &[data-variant='soft'] {
4370
+ --focus-outline: color-mix(
4371
+ in srgb,
4372
+ oklch(0.9266735792514218 0.04166332334226081 227.890755564881) 20%,
4373
+ transparent
4374
+ );
4375
+ @supports (color: color-mix(in lab, red, red)) {
4376
+ --focus-outline: color-mix(in oklab, var(--color-primary-200) 20%, transparent);
4377
+ }
4378
+ }
4379
+ }
4380
+ .data-\[variant\=soft\]\:\[--focus-outline\:var\(--color-primary-600\)\]\/20 {
4381
+ &[data-variant='soft'] {
4382
+ --focus-outline: color-mix(
4383
+ in srgb,
4384
+ oklch(0.5751126532766045 0.2298336295034379 260.75633298199585) 20%,
4385
+ transparent
4386
+ );
4387
+ @supports (color: color-mix(in lab, red, red)) {
4388
+ --focus-outline: color-mix(in oklab, var(--color-primary-600) 20%, transparent);
4389
+ }
4390
+ }
4391
+ }
4392
+ .data-\[variant\=soft\]\:\[--focus-outline\:var\(--color-primary-800\)\]\/20 {
4393
+ &[data-variant='soft'] {
4394
+ --focus-outline: color-mix(
4395
+ in srgb,
4396
+ oklch(0.2899986864508513 0.11729574451023282 259.841936589881) 20%,
4397
+ transparent
4398
+ );
4399
+ @supports (color: color-mix(in lab, red, red)) {
4400
+ --focus-outline: color-mix(in oklab, var(--color-primary-800) 20%, transparent);
4401
+ }
4402
+ }
4403
+ }
4404
+ .data-\[variant\=soft\]\:\[--focus-outline\:var\(--color-white\)\]\/20 {
4405
+ &[data-variant='soft'] {
4406
+ --focus-outline: color-mix(in srgb, #fff 20%, transparent);
4407
+ @supports (color: color-mix(in lab, red, red)) {
4408
+ --focus-outline: color-mix(in oklab, var(--color-white) 20%, transparent);
4409
+ }
4410
+ }
4411
+ }
4412
+ .data-\[variant\=solid\]\:text-grey-800 {
4413
+ &[data-variant='solid'] {
4414
+ color: oklch(0.26941250740174183 0.010359971488680036 242.08383926925922);
4415
+ }
4416
+ }
4417
+ .data-\[variant\=solid\]\:\[--badge-hover-overlay\:var\(--color-grey-400\)\]\/50 {
4418
+ &[data-variant='solid'] {
4419
+ --badge-hover-overlay: color-mix(
4420
+ in srgb,
4421
+ oklch(0.8630965162073586 0.007776237801518043 228.8687380011113) 50%,
4422
+ transparent
4423
+ );
4424
+ @supports (color: color-mix(in lab, red, red)) {
4425
+ --badge-hover-overlay: color-mix(in oklab, var(--color-grey-400) 50%, transparent);
4426
+ }
4427
+ }
4428
+ }
4429
+ .data-\[variant\=solid\]\:\[--badge-hover-overlay\:var\(--color-primary-250\)\] {
4430
+ &[data-variant='solid'] {
4431
+ --badge-hover-overlay: var(--color-primary-250);
4432
+ }
4433
+ }
4434
+ .data-\[variant\=solid\]\:\[--badge-hover-overlay\:var\(--color-white\)\]\/10 {
4435
+ &[data-variant='solid'] {
4436
+ --badge-hover-overlay: color-mix(in srgb, #fff 10%, transparent);
4437
+ @supports (color: color-mix(in lab, red, red)) {
4438
+ --badge-hover-overlay: color-mix(in oklab, var(--color-white) 10%, transparent);
4439
+ }
4440
+ }
4441
+ }
4442
+ .data-\[variant\=solid\]\:\[--btn-hover-overlay\:var\(--color-grey-800\)\]\/10 {
4443
+ &[data-variant='solid'] {
4444
+ --btn-hover-overlay: color-mix(
4445
+ in srgb,
4446
+ oklch(0.26941250740174183 0.010359971488680036 242.08383926925922) 10%,
4447
+ transparent
4448
+ );
4449
+ @supports (color: color-mix(in lab, red, red)) {
4450
+ --btn-hover-overlay: color-mix(in oklab, var(--color-grey-800) 10%, transparent);
4451
+ }
4452
+ }
4453
+ }
4454
+ .data-\[variant\=solid\]\:\[--btn-hover-overlay\:var\(--color-primary-800\)\]\/10 {
4455
+ &[data-variant='solid'] {
4456
+ --btn-hover-overlay: color-mix(
4457
+ in srgb,
4458
+ oklch(0.2899986864508513 0.11729574451023282 259.841936589881) 10%,
4459
+ transparent
4460
+ );
4461
+ @supports (color: color-mix(in lab, red, red)) {
4462
+ --btn-hover-overlay: color-mix(in oklab, var(--color-primary-800) 10%, transparent);
4463
+ }
4464
+ }
4465
+ }
4466
+ .data-\[variant\=solid\]\:\[--btn-hover-overlay\:var\(--color-white\)\]\/10 {
4467
+ &[data-variant='solid'] {
4468
+ --btn-hover-overlay: color-mix(in srgb, #fff 10%, transparent);
4469
+ @supports (color: color-mix(in lab, red, red)) {
4470
+ --btn-hover-overlay: color-mix(in oklab, var(--color-white) 10%, transparent);
4471
+ }
4472
+ }
4473
+ }
4474
+ .data-\[variant\=surface\]\:\[--badge-bg\:var\(--color-grey-500\)\] {
4475
+ &[data-variant='surface'] {
4476
+ --badge-bg: var(--color-grey-500);
4477
+ }
4478
+ }
4479
+ .data-\[variant\=surface\]\:\[--btn-bg\:var\(--color-grey-400\)\] {
4480
+ &[data-variant='surface'] {
4481
+ --btn-bg: var(--color-grey-400);
3970
4482
  }
3971
4483
  }
3972
- .data-\[variant\=outline\]\:shadow-xs {
3973
- &[data-variant='outline'] {
3974
- --tw-shadow: 0 1px 2px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.05));
3975
- box-shadow:
3976
- var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow),
3977
- var(--tw-ring-shadow), var(--tw-shadow);
4484
+ .data-\[variant\=surface\]\:\[--focus-outline\:var\(--color-grey-600\)\] {
4485
+ &[data-variant='surface'] {
4486
+ --focus-outline: var(--color-grey-600);
3978
4487
  }
3979
4488
  }
3980
- .data-\[variant\=outline\]\:first\:border-l {
3981
- &[data-variant='outline'] {
3982
- &:first-child {
3983
- border-left-style: var(--tw-border-style);
3984
- border-left-width: 1px;
4489
+ .data-\[variant\=surface\]\:data-active\:\[--btn-border\:var\(--color-grey-300\)\] {
4490
+ &[data-variant='surface'] {
4491
+ &[data-active] {
4492
+ --btn-border: var(--color-grey-300);
4493
+ }
4494
+ }
4495
+ }
4496
+ .data-\[variant\=surface\]\:data-hover\:\[--btn-border\:var\(--color-grey-300\)\] {
4497
+ &[data-variant='surface'] {
4498
+ &[data-hover] {
4499
+ --btn-border: var(--color-grey-300);
3985
4500
  }
3986
4501
  }
3987
4502
  }
@@ -4156,34 +4671,34 @@
4156
4671
  padding-inline: calc(var(--spacing) * 6);
4157
4672
  }
4158
4673
  }
4159
- .sm\:px-\[calc\(--spacing\(2\.5\)-1px\)\] {
4674
+ .sm\:px-\[calc\(--spacing\(3\.5\)-1px\)\] {
4160
4675
  @media (width >= 40rem) {
4161
- padding-inline: calc(calc(var(--spacing) * 2.5) - 1px);
4676
+ padding-inline: calc(calc(var(--spacing) * 3.5) - 1px);
4162
4677
  }
4163
4678
  }
4164
- .sm\:px-\[calc\(--spacing\(3\)-1px\)\] {
4679
+ .sm\:px-\[calc\(--spacing\(4\.5\)-1px\)\] {
4165
4680
  @media (width >= 40rem) {
4166
- padding-inline: calc(calc(var(--spacing) * 3) - 1px);
4681
+ padding-inline: calc(calc(var(--spacing) * 4.5) - 1px);
4167
4682
  }
4168
4683
  }
4169
- .sm\:px-\[calc\(--spacing\(3\.5\)-1px\)\] {
4684
+ .sm\:px-\[calc\(--spacing\(5\.5\)-1px\)\] {
4170
4685
  @media (width >= 40rem) {
4171
- padding-inline: calc(calc(var(--spacing) * 3.5) - 1px);
4686
+ padding-inline: calc(calc(var(--spacing) * 5.5) - 1px);
4172
4687
  }
4173
4688
  }
4174
- .sm\:py-\[calc\(--spacing\(1\)-1px\)\] {
4689
+ .sm\:py-\[calc\(--spacing\(2\)-1px\)\] {
4175
4690
  @media (width >= 40rem) {
4176
- padding-block: calc(calc(var(--spacing) * 1) - 1px);
4691
+ padding-block: calc(calc(var(--spacing) * 2) - 1px);
4177
4692
  }
4178
4693
  }
4179
- .sm\:py-\[calc\(--spacing\(1\.5\)-1px\)\] {
4694
+ .sm\:py-\[calc\(--spacing\(3\)-1px\)\] {
4180
4695
  @media (width >= 40rem) {
4181
- padding-block: calc(calc(var(--spacing) * 1.5) - 1px);
4696
+ padding-block: calc(calc(var(--spacing) * 3) - 1px);
4182
4697
  }
4183
4698
  }
4184
- .sm\:py-\[calc\(--spacing\(2\)-1px\)\] {
4699
+ .sm\:py-\[calc\(--spacing\(4\)-1px\)\] {
4185
4700
  @media (width >= 40rem) {
4186
- padding-block: calc(calc(var(--spacing) * 2) - 1px);
4701
+ padding-block: calc(calc(var(--spacing) * 4) - 1px);
4187
4702
  }
4188
4703
  }
4189
4704
  .sm\:pr-2\.5 {
@@ -4211,6 +4726,12 @@
4211
4726
  text-align: left;
4212
4727
  }
4213
4728
  }
4729
+ .sm\:text-sm\/5 {
4730
+ @media (width >= 40rem) {
4731
+ font-size: var(--text-sm);
4732
+ line-height: calc(var(--spacing) * 5);
4733
+ }
4734
+ }
4214
4735
  .sm\:text-sm\/6 {
4215
4736
  @media (width >= 40rem) {
4216
4737
  font-size: var(--text-sm);
@@ -4223,11 +4744,16 @@
4223
4744
  line-height: calc(var(--spacing) * 5);
4224
4745
  }
4225
4746
  }
4226
- .sm\:\*\:data-\[slot\=icon\]\:my-1 {
4747
+ .sm\:text-\[0\.8125rem\] {
4748
+ @media (width >= 40rem) {
4749
+ font-size: 0.8125rem;
4750
+ }
4751
+ }
4752
+ .sm\:\*\:data-\[slot\=icon\]\:my-0\.5 {
4227
4753
  @media (width >= 40rem) {
4228
4754
  :is(& > *) {
4229
4755
  &[data-slot='icon'] {
4230
- margin-block: calc(var(--spacing) * 1);
4756
+ margin-block: calc(var(--spacing) * 0.5);
4231
4757
  }
4232
4758
  }
4233
4759
  }
@@ -4311,21 +4837,11 @@
4311
4837
  grid-template-columns: repeat(4, minmax(0, 1fr));
4312
4838
  }
4313
4839
  }
4314
- .md\:grid-cols-7 {
4315
- @media (width >= 48rem) {
4316
- grid-template-columns: repeat(7, minmax(0, 1fr));
4317
- }
4318
- }
4319
4840
  .md\:grid-cols-19 {
4320
4841
  @media (width >= 48rem) {
4321
4842
  grid-template-columns: repeat(19, minmax(0, 1fr));
4322
4843
  }
4323
4844
  }
4324
- .md\:flex-row {
4325
- @media (width >= 48rem) {
4326
- flex-direction: row;
4327
- }
4328
- }
4329
4845
  .md\:text-sm {
4330
4846
  @media (width >= 48rem) {
4331
4847
  font-size: var(--text-sm);
@@ -4446,18 +4962,6 @@
4446
4962
  text-align: left;
4447
4963
  }
4448
4964
  }
4449
- .lg\:text-3xl {
4450
- @media (width >= 64rem) {
4451
- font-size: var(--text-3xl);
4452
- line-height: var(--tw-leading, var(--text-3xl--line-height));
4453
- }
4454
- }
4455
- .lg\:text-5xl {
4456
- @media (width >= 64rem) {
4457
- font-size: var(--text-5xl);
4458
- line-height: var(--tw-leading, var(--text-5xl--line-height));
4459
- }
4460
- }
4461
4965
  .lg\:text-sm {
4462
4966
  @media (width >= 64rem) {
4463
4967
  font-size: var(--text-sm);
@@ -4529,27 +5033,50 @@
4529
5033
  display: none;
4530
5034
  }
4531
5035
  }
4532
- .dark\:border-gray-600 {
5036
+ .dark\:border-\(--badge-bg\) {
4533
5037
  &:where([data-theme='dark'], [data-theme='dark'] *) {
4534
- border-color: var(--color-gray-600);
5038
+ border-color: var(--badge-bg);
4535
5039
  }
4536
5040
  }
4537
- .dark\:border-nsw-grey-50 {
5041
+ .dark\:border-\(--badge-bg\)\/50 {
4538
5042
  &:where([data-theme='dark'], [data-theme='dark'] *) {
4539
- border-color: var(--color-nsw-grey-50);
5043
+ border-color: var(--badge-bg);
5044
+ @supports (color: color-mix(in lab, red, red)) {
5045
+ border-color: color-mix(in oklab, var(--badge-bg) 50%, transparent);
5046
+ }
5047
+ }
5048
+ }
5049
+ .dark\:border-\(--btn-bg\) {
5050
+ &:where([data-theme='dark'], [data-theme='dark'] *) {
5051
+ border-color: var(--btn-bg);
4540
5052
  }
4541
5053
  }
4542
- .dark\:border-nsw-grey-200\/10 {
5054
+ .dark\:border-\(--btn-bg\)\/50 {
4543
5055
  &:where([data-theme='dark'], [data-theme='dark'] *) {
4544
- border-color: color-mix(in srgb, oklch(0.9401 0 0) 10%, transparent);
5056
+ border-color: var(--btn-bg);
4545
5057
  @supports (color: color-mix(in lab, red, red)) {
4546
- border-color: color-mix(in oklab, var(--color-nsw-grey-200) 10%, transparent);
5058
+ border-color: color-mix(in oklab, var(--btn-bg) 50%, transparent);
4547
5059
  }
4548
5060
  }
4549
5061
  }
5062
+ .dark\:border-gray-600 {
5063
+ &:where([data-theme='dark'], [data-theme='dark'] *) {
5064
+ border-color: var(--color-gray-600);
5065
+ }
5066
+ }
5067
+ .dark\:border-grey-600 {
5068
+ &:where([data-theme='dark'], [data-theme='dark'] *) {
5069
+ border-color: oklch(0.426426783985819 0.011202235626284581 232.61715023407646);
5070
+ }
5071
+ }
5072
+ .dark\:border-nsw-grey-50 {
5073
+ &:where([data-theme='dark'], [data-theme='dark'] *) {
5074
+ border-color: var(--color-nsw-grey-50);
5075
+ }
5076
+ }
4550
5077
  .dark\:border-nsw-grey-200\/15 {
4551
5078
  &:where([data-theme='dark'], [data-theme='dark'] *) {
4552
- border-color: color-mix(in srgb, oklch(0.9401 0 0) 15%, transparent);
5079
+ border-color: color-mix(in srgb, oklch(0.9400701096450296 0 0) 15%, transparent);
4553
5080
  @supports (color: color-mix(in lab, red, red)) {
4554
5081
  border-color: color-mix(in oklab, var(--color-nsw-grey-200) 15%, transparent);
4555
5082
  }
@@ -4557,7 +5084,7 @@
4557
5084
  }
4558
5085
  .dark\:border-nsw-grey-200\/20 {
4559
5086
  &:where([data-theme='dark'], [data-theme='dark'] *) {
4560
- border-color: color-mix(in srgb, oklch(0.9401 0 0) 20%, transparent);
5087
+ border-color: color-mix(in srgb, oklch(0.9400701096450296 0 0) 20%, transparent);
4561
5088
  @supports (color: color-mix(in lab, red, red)) {
4562
5089
  border-color: color-mix(in oklab, var(--color-nsw-grey-200) 20%, transparent);
4563
5090
  }
@@ -4581,24 +5108,83 @@
4581
5108
  }
4582
5109
  }
4583
5110
  }
5111
+ .dark\:border-white\/20 {
5112
+ &:where([data-theme='dark'], [data-theme='dark'] *) {
5113
+ border-color: color-mix(in srgb, #fff 20%, transparent);
5114
+ @supports (color: color-mix(in lab, red, red)) {
5115
+ border-color: color-mix(in oklab, var(--color-white) 20%, transparent);
5116
+ }
5117
+ }
5118
+ }
4584
5119
  .dark\:bg-\(--badge-bg\) {
4585
5120
  &:where([data-theme='dark'], [data-theme='dark'] *) {
4586
5121
  background-color: var(--badge-bg);
4587
5122
  }
4588
5123
  }
5124
+ .dark\:bg-\(--badge-bg\)\/20 {
5125
+ &:where([data-theme='dark'], [data-theme='dark'] *) {
5126
+ background-color: var(--badge-bg);
5127
+ @supports (color: color-mix(in lab, red, red)) {
5128
+ background-color: color-mix(in oklab, var(--badge-bg) 20%, transparent);
5129
+ }
5130
+ }
5131
+ }
5132
+ .dark\:bg-\(--badge-bg\)\/30 {
5133
+ &:where([data-theme='dark'], [data-theme='dark'] *) {
5134
+ background-color: var(--badge-bg);
5135
+ @supports (color: color-mix(in lab, red, red)) {
5136
+ background-color: color-mix(in oklab, var(--badge-bg) 30%, transparent);
5137
+ }
5138
+ }
5139
+ }
4589
5140
  .dark\:bg-\(--btn-bg\) {
4590
5141
  &:where([data-theme='dark'], [data-theme='dark'] *) {
4591
5142
  background-color: var(--btn-bg);
4592
5143
  }
4593
5144
  }
4594
- .dark\:bg-blue-950 {
5145
+ .dark\:bg-\(--btn-bg\)\/20 {
4595
5146
  &:where([data-theme='dark'], [data-theme='dark'] *) {
4596
- background-color: var(--color-blue-950);
5147
+ background-color: var(--btn-bg);
5148
+ @supports (color: color-mix(in lab, red, red)) {
5149
+ background-color: color-mix(in oklab, var(--btn-bg) 20%, transparent);
5150
+ }
5151
+ }
5152
+ }
5153
+ .dark\:bg-\(--btn-bg\)\/30 {
5154
+ &:where([data-theme='dark'], [data-theme='dark'] *) {
5155
+ background-color: var(--btn-bg);
5156
+ @supports (color: color-mix(in lab, red, red)) {
5157
+ background-color: color-mix(in oklab, var(--btn-bg) 30%, transparent);
5158
+ }
5159
+ }
5160
+ }
5161
+ .dark\:bg-\[--badge-hover-overlay\:var\(--color-primary-800\)\]\/40 {
5162
+ &:where([data-theme='dark'], [data-theme='dark'] *) {
5163
+ background-color: color-mix(
5164
+ in srgb,
5165
+ oklch(0.2899986864508513 0.11729574451023282 259.841936589881) 40%,
5166
+ transparent
5167
+ );
5168
+ @supports (color: color-mix(in lab, red, red)) {
5169
+ background-color: color-mix(in oklab, var(--color-primary-800) 40%, transparent);
5170
+ }
5171
+ }
5172
+ }
5173
+ .dark\:bg-\[--btn-hover-overlay\:var\(--color-primary-800\)\]\/40 {
5174
+ &:where([data-theme='dark'], [data-theme='dark'] *) {
5175
+ background-color: color-mix(
5176
+ in srgb,
5177
+ oklch(0.2899986864508513 0.11729574451023282 259.841936589881) 40%,
5178
+ transparent
5179
+ );
5180
+ @supports (color: color-mix(in lab, red, red)) {
5181
+ background-color: color-mix(in oklab, var(--color-primary-800) 40%, transparent);
5182
+ }
4597
5183
  }
4598
5184
  }
4599
- .dark\:bg-gray-700 {
5185
+ .dark\:bg-blue-950 {
4600
5186
  &:where([data-theme='dark'], [data-theme='dark'] *) {
4601
- background-color: var(--color-gray-700);
5187
+ background-color: var(--color-blue-950);
4602
5188
  }
4603
5189
  }
4604
5190
  .dark\:bg-gray-800 {
@@ -4606,9 +5192,19 @@
4606
5192
  background-color: var(--color-gray-800);
4607
5193
  }
4608
5194
  }
4609
- .dark\:bg-gray-900 {
5195
+ .dark\:bg-grey-700 {
5196
+ &:where([data-theme='dark'], [data-theme='dark'] *) {
5197
+ background-color: oklch(0.3479196456937804 0.010781103557482309 237.35049475166784);
5198
+ }
5199
+ }
5200
+ .dark\:bg-grey-800 {
4610
5201
  &:where([data-theme='dark'], [data-theme='dark'] *) {
4611
- background-color: var(--color-gray-900);
5202
+ background-color: oklch(0.26941250740174183 0.010359971488680036 242.08383926925922);
5203
+ }
5204
+ }
5205
+ .dark\:bg-grey-900 {
5206
+ &:where([data-theme='dark'], [data-theme='dark'] *) {
5207
+ background-color: oklch(0.17511812981113217 0.007251980042076026 242.08383926925922);
4612
5208
  }
4613
5209
  }
4614
5210
  .dark\:bg-input\/30 {
@@ -4621,7 +5217,7 @@
4621
5217
  }
4622
5218
  .dark\:bg-nsw-grey-100\/20 {
4623
5219
  &:where([data-theme='dark'], [data-theme='dark'] *) {
4624
- background-color: color-mix(in srgb, oklch(0.9700500000000001 0 0) 20%, transparent);
5220
+ background-color: color-mix(in srgb, oklch(0.9700350548225147 0 0) 20%, transparent);
4625
5221
  @supports (color: color-mix(in lab, red, red)) {
4626
5222
  background-color: color-mix(in oklab, var(--color-nsw-grey-100) 20%, transparent);
4627
5223
  }
@@ -4645,11 +5241,11 @@
4645
5241
  background-color: transparent;
4646
5242
  }
4647
5243
  }
4648
- .dark\:bg-white\/15 {
5244
+ .dark\:bg-white\/5 {
4649
5245
  &:where([data-theme='dark'], [data-theme='dark'] *) {
4650
- background-color: color-mix(in srgb, #fff 15%, transparent);
5246
+ background-color: color-mix(in srgb, #fff 5%, transparent);
4651
5247
  @supports (color: color-mix(in lab, red, red)) {
4652
- background-color: color-mix(in oklab, var(--color-white) 15%, transparent);
5248
+ background-color: color-mix(in oklab, var(--color-white) 5%, transparent);
4653
5249
  }
4654
5250
  }
4655
5251
  }
@@ -4668,39 +5264,29 @@
4668
5264
  color: var(--color-gray-400);
4669
5265
  }
4670
5266
  }
4671
- .dark\:text-muted-foreground {
4672
- &:where([data-theme='dark'], [data-theme='dark'] *) {
4673
- color: var(--muted-foreground);
4674
- }
4675
- }
4676
- .dark\:text-nsw-grey-200 {
5267
+ .dark\:text-grey-200 {
4677
5268
  &:where([data-theme='dark'], [data-theme='dark'] *) {
4678
- color: var(--color-nsw-grey-200);
5269
+ color: oklch(0.9400701096450296 0 0);
4679
5270
  }
4680
5271
  }
4681
- .dark\:text-nsw-grey-400 {
4682
- &:where([data-theme='dark'], [data-theme='dark'] *) {
4683
- color: var(--color-nsw-grey-400);
4684
- }
4685
- }
4686
- .dark\:text-nsw-grey-800 {
5272
+ .dark\:text-grey-400 {
4687
5273
  &:where([data-theme='dark'], [data-theme='dark'] *) {
4688
- color: var(--color-nsw-grey-800);
5274
+ color: oklch(0.8630965162073586 0.007776237801518043 228.8687380011113);
4689
5275
  }
4690
5276
  }
4691
- .dark\:text-primary {
5277
+ .dark\:text-muted-foreground {
4692
5278
  &:where([data-theme='dark'], [data-theme='dark'] *) {
4693
- color: oklch(0.29 0.1173 259.84);
5279
+ color: var(--muted-foreground);
4694
5280
  }
4695
5281
  }
4696
- .dark\:text-primary-dark {
5282
+ .dark\:text-nsw-grey-400 {
4697
5283
  &:where([data-theme='dark'], [data-theme='dark'] *) {
4698
- color: oklch(0.23925 0.099705 259.84);
5284
+ color: var(--color-nsw-grey-400);
4699
5285
  }
4700
5286
  }
4701
- .dark\:text-secondary {
5287
+ .dark\:text-primary-500 {
4702
5288
  &:where([data-theme='dark'], [data-theme='dark'] *) {
4703
- color: oklch(0.9267 0.0417 227.89);
5289
+ color: oklch(0.719602022988773 0.1609881523353869 242.17574150873253);
4704
5290
  }
4705
5291
  }
4706
5292
  .dark\:text-slate-400 {
@@ -4713,11 +5299,11 @@
4713
5299
  color: var(--color-white);
4714
5300
  }
4715
5301
  }
4716
- .dark\:text-white\/80 {
5302
+ .dark\:decoration-white\/50 {
4717
5303
  &:where([data-theme='dark'], [data-theme='dark'] *) {
4718
- color: color-mix(in srgb, #fff 80%, transparent);
5304
+ text-decoration-color: color-mix(in srgb, #fff 50%, transparent);
4719
5305
  @supports (color: color-mix(in lab, red, red)) {
4720
- color: color-mix(in oklab, var(--color-white) 80%, transparent);
5306
+ text-decoration-color: color-mix(in oklab, var(--color-white) 50%, transparent);
4721
5307
  }
4722
5308
  }
4723
5309
  }
@@ -4742,73 +5328,9 @@
4742
5328
  var(--tw-backdrop-sepia,);
4743
5329
  }
4744
5330
  }
4745
- .dark\:\[--badge-bg\:var\(--color-accent\)\]\/50 {
4746
- &:where([data-theme='dark'], [data-theme='dark'] *) {
4747
- --badge-bg: color-mix(in srgb, oklch(0.562 0.2175 20.33) 50%, transparent);
4748
- @supports (color: color-mix(in lab, red, red)) {
4749
- --badge-bg: color-mix(in oklab, var(--color-accent) 50%, transparent);
4750
- }
4751
- }
4752
- }
4753
- .dark\:\[--badge-bg\:var\(--color-error\)\]\/50 {
4754
- &:where([data-theme='dark'], [data-theme='dark'] *) {
4755
- --badge-bg: color-mix(in srgb, oklch(0.502 0.1927 18.08) 50%, transparent);
4756
- @supports (color: color-mix(in lab, red, red)) {
4757
- --badge-bg: color-mix(in oklab, var(--color-error) 50%, transparent);
4758
- }
4759
- }
4760
- }
4761
- .dark\:\[--badge-bg\:var\(--color-info\)\]\/50 {
4762
- &:where([data-theme='dark'], [data-theme='dark'] *) {
4763
- --badge-bg: color-mix(in srgb, oklch(0.4506 0.1233 262.35) 50%, transparent);
4764
- @supports (color: color-mix(in lab, red, red)) {
4765
- --badge-bg: color-mix(in oklab, var(--color-info) 50%, transparent);
4766
- }
4767
- }
4768
- }
4769
- .dark\:\[--badge-bg\:var\(--color-nsw-grey-100\)\] {
4770
- &:where([data-theme='dark'], [data-theme='dark'] *) {
4771
- --badge-bg: var(--color-nsw-grey-100);
4772
- }
4773
- }
4774
- .dark\:\[--badge-bg\:var\(--color-primary\)\]\/90 {
4775
- &:where([data-theme='dark'], [data-theme='dark'] *) {
4776
- --badge-bg: color-mix(in srgb, oklch(0.29 0.1173 259.84) 90%, transparent);
4777
- @supports (color: color-mix(in lab, red, red)) {
4778
- --badge-bg: color-mix(in oklab, var(--color-primary) 90%, transparent);
4779
- }
4780
- }
4781
- }
4782
- .dark\:\[--badge-bg\:var\(--color-secondary\)\]\/30 {
5331
+ .dark\:\[--badge-bg\:var\(--color-grey-600\)\] {
4783
5332
  &:where([data-theme='dark'], [data-theme='dark'] *) {
4784
- --badge-bg: color-mix(in srgb, oklch(0.9267 0.0417 227.89) 30%, transparent);
4785
- @supports (color: color-mix(in lab, red, red)) {
4786
- --badge-bg: color-mix(in oklab, var(--color-secondary) 30%, transparent);
4787
- }
4788
- }
4789
- }
4790
- .dark\:\[--badge-bg\:var\(--color-success\)\]\/50 {
4791
- &:where([data-theme='dark'], [data-theme='dark'] *) {
4792
- --badge-bg: color-mix(in srgb, oklch(0.549 0.1849 142.8) 50%, transparent);
4793
- @supports (color: color-mix(in lab, red, red)) {
4794
- --badge-bg: color-mix(in oklab, var(--color-success) 50%, transparent);
4795
- }
4796
- }
4797
- }
4798
- .dark\:\[--badge-bg\:var\(--color-tertiary\)\]\/50 {
4799
- &:where([data-theme='dark'], [data-theme='dark'] *) {
4800
- --badge-bg: color-mix(in srgb, oklch(0.5751 0.2298 260.76) 50%, transparent);
4801
- @supports (color: color-mix(in lab, red, red)) {
4802
- --badge-bg: color-mix(in oklab, var(--color-tertiary) 50%, transparent);
4803
- }
4804
- }
4805
- }
4806
- .dark\:\[--badge-bg\:var\(--color-warning\)\]\/50 {
4807
- &:where([data-theme='dark'], [data-theme='dark'] *) {
4808
- --badge-bg: color-mix(in srgb, oklch(0.5833 0.169705 43.9973) 50%, transparent);
4809
- @supports (color: color-mix(in lab, red, red)) {
4810
- --badge-bg: color-mix(in oklab, var(--color-warning) 50%, transparent);
4811
- }
5333
+ --badge-bg: var(--color-grey-600);
4812
5334
  }
4813
5335
  }
4814
5336
  .dark\:\[--badge-bg\:var\(--color-white\)\] {
@@ -4816,310 +5338,167 @@
4816
5338
  --badge-bg: var(--color-white);
4817
5339
  }
4818
5340
  }
4819
- .dark\:\[--badge-bg\:white\]\/15 {
4820
- &:where([data-theme='dark'], [data-theme='dark'] *) {
4821
- --badge-bg: color-mix(in oklab, white 15%, transparent);
4822
- }
4823
- }
4824
- .dark\:\[--btn-bg\:var\(--color-nsw-grey-600\)\] {
4825
- &:where([data-theme='dark'], [data-theme='dark'] *) {
4826
- --btn-bg: var(--color-nsw-grey-600);
4827
- }
4828
- }
4829
- .dark\:\[--btn-bg\:var\(--color-nsw-grey-800\)\] {
4830
- &:where([data-theme='dark'], [data-theme='dark'] *) {
4831
- --btn-bg: var(--color-nsw-grey-800);
4832
- }
4833
- }
4834
- .dark\:\[--btn-bg\:var\(--color-primary-light\)\] {
4835
- &:where([data-theme='dark'], [data-theme='dark'] *) {
4836
- --btn-bg: var(--color-primary-light);
4837
- }
4838
- }
4839
- .dark\:\[--btn-bg\:white\] {
4840
- &:where([data-theme='dark'], [data-theme='dark'] *) {
4841
- --btn-bg: white;
4842
- }
4843
- }
4844
- .dark\:\[--btn-hover-overlay\:var\(--color-nsw-grey-800\)\]\/5 {
5341
+ .dark\:\[--badge-border\:var\(--color-grey-600\)\]\/90 {
4845
5342
  &:where([data-theme='dark'], [data-theme='dark'] *) {
4846
- --btn-hover-overlay: color-mix(in srgb, oklch(0.2694 0.0104 242.08) 5%, transparent);
4847
- @supports (color: color-mix(in lab, red, red)) {
4848
- --btn-hover-overlay: color-mix(in oklab, var(--color-nsw-grey-800) 5%, transparent);
4849
- }
4850
- }
4851
- }
4852
- .dark\:\[--btn-hover-overlay\:var\(--color-primary-dark\)\]\/5 {
4853
- &:where([data-theme='dark'], [data-theme='dark'] *) {
4854
- --btn-hover-overlay: color-mix(in srgb, oklch(0.23925 0.099705 259.84) 5%, transparent);
4855
- @supports (color: color-mix(in lab, red, red)) {
4856
- --btn-hover-overlay: color-mix(in oklab, var(--color-primary-dark) 5%, transparent);
4857
- }
4858
- }
4859
- }
4860
- .dark\:\[--btn-hover-overlay\:var\(--color-white\)\]\/5 {
4861
- &:where([data-theme='dark'], [data-theme='dark'] *) {
4862
- --btn-hover-overlay: color-mix(in srgb, #fff 5%, transparent);
4863
- @supports (color: color-mix(in lab, red, red)) {
4864
- --btn-hover-overlay: color-mix(in oklab, var(--color-white) 5%, transparent);
4865
- }
4866
- }
4867
- }
4868
- .dark\:\[--btn-icon\:var\(--color-primary-dark\)\] {
4869
- &:where([data-theme='dark'], [data-theme='dark'] *) {
4870
- --btn-icon: var(--color-primary-dark);
4871
- }
4872
- }
4873
- .dark\:\[--btn-icon\:var\(--color-white\)\] {
4874
- &:where([data-theme='dark'], [data-theme='dark'] *) {
4875
- --btn-icon: var(--color-white);
4876
- }
4877
- }
4878
- .dark\:\[--focus-outline\:var\(--color-accent-dark\)\]\/80 {
4879
- &:where([data-theme='dark'], [data-theme='dark'] *) {
4880
- --focus-outline: color-mix(
4881
- in srgb,
4882
- oklch(0.50075 0.19485 19.529999999999998) 80%,
4883
- transparent
4884
- );
4885
- @supports (color: color-mix(in lab, red, red)) {
4886
- --focus-outline: color-mix(in oklab, var(--color-accent-dark) 80%, transparent);
4887
- }
4888
- }
4889
- }
4890
- .dark\:\[--focus-outline\:var\(--color-error-dark\)\]\/80 {
4891
- &:where([data-theme='dark'], [data-theme='dark'] *) {
4892
- --focus-outline: color-mix(
4893
- in srgb,
4894
- oklch(0.41415 0.16379500000000002 18.08) 80%,
4895
- transparent
4896
- );
4897
- @supports (color: color-mix(in lab, red, red)) {
4898
- --focus-outline: color-mix(in oklab, var(--color-error-dark) 80%, transparent);
4899
- }
4900
- }
4901
- }
4902
- .dark\:\[--focus-outline\:var\(--color-info-dark\)\]\/80 {
4903
- &:where([data-theme='dark'], [data-theme='dark'] *) {
4904
- --focus-outline: color-mix(
5343
+ --badge-border: color-mix(
4905
5344
  in srgb,
4906
- oklch(0.371745 0.10480500000000001 262.35) 80%,
5345
+ oklch(0.426426783985819 0.011202235626284581 232.61715023407646) 90%,
4907
5346
  transparent
4908
5347
  );
4909
5348
  @supports (color: color-mix(in lab, red, red)) {
4910
- --focus-outline: color-mix(in oklab, var(--color-info-dark) 80%, transparent);
4911
- }
4912
- }
4913
- }
4914
- .dark\:\[--focus-outline\:var\(--color-primary-light\)\] {
4915
- &:where([data-theme='dark'], [data-theme='dark'] *) {
4916
- --focus-outline: var(--color-primary-light);
4917
- }
4918
- }
4919
- .dark\:\[--focus-outline\:var\(--color-secondary\)\]\/55 {
4920
- &:where([data-theme='dark'], [data-theme='dark'] *) {
4921
- --focus-outline: color-mix(in srgb, oklch(0.9267 0.0417 227.89) 55%, transparent);
4922
- @supports (color: color-mix(in lab, red, red)) {
4923
- --focus-outline: color-mix(in oklab, var(--color-secondary) 55%, transparent);
5349
+ --badge-border: color-mix(in oklab, var(--color-grey-600) 90%, transparent);
4924
5350
  }
4925
5351
  }
4926
5352
  }
4927
- .dark\:\[--focus-outline\:var\(--color-success-dark\)\]\/80 {
5353
+ .dark\:\[--badge-border\:var\(--color-white\)\]\/90 {
4928
5354
  &:where([data-theme='dark'], [data-theme='dark'] *) {
4929
- --focus-outline: color-mix(in srgb, oklch(0.452925 0.157165 142.8) 80%, transparent);
5355
+ --badge-border: color-mix(in srgb, #fff 90%, transparent);
4930
5356
  @supports (color: color-mix(in lab, red, red)) {
4931
- --focus-outline: color-mix(in oklab, var(--color-success-dark) 80%, transparent);
5357
+ --badge-border: color-mix(in oklab, var(--color-white) 90%, transparent);
4932
5358
  }
4933
5359
  }
4934
5360
  }
4935
- .dark\:\[--focus-outline\:var\(--color-tertiary\)\]\/80 {
5361
+ .dark\:\[--badge-hover-overlay\:var\(--color-grey-200\)\]\/20 {
4936
5362
  &:where([data-theme='dark'], [data-theme='dark'] *) {
4937
- --focus-outline: color-mix(in srgb, oklch(0.5751 0.2298 260.76) 80%, transparent);
5363
+ --badge-hover-overlay: color-mix(in srgb, oklch(0.9400701096450296 0 0) 20%, transparent);
4938
5364
  @supports (color: color-mix(in lab, red, red)) {
4939
- --focus-outline: color-mix(in oklab, var(--color-tertiary) 80%, transparent);
5365
+ --badge-hover-overlay: color-mix(in oklab, var(--color-grey-200) 20%, transparent);
4940
5366
  }
4941
5367
  }
4942
5368
  }
4943
- .dark\:\[--focus-outline\:var\(--color-warning-dark\)\]\/80 {
5369
+ .dark\:\[--badge-hover-overlay\:var\(--color-primary-800\)\]\/50 {
4944
5370
  &:where([data-theme='dark'], [data-theme='dark'] *) {
4945
- --focus-outline: color-mix(in srgb, oklch(0.4812225 0.14424925 43.9973) 80%, transparent);
4946
- @supports (color: color-mix(in lab, red, red)) {
4947
- --focus-outline: color-mix(in oklab, var(--color-warning-dark) 80%, transparent);
4948
- }
4949
- }
4950
- }
4951
- .dark\:\[--focus-outline\:var\(--color-white\)\] {
4952
- &:where([data-theme='dark'], [data-theme='dark'] *) {
4953
- --focus-outline: var(--color-white);
4954
- }
4955
- }
4956
- .dark\:\[--focus-outline\:var\(--color-white\)\]\/25 {
4957
- &:where([data-theme='dark'], [data-theme='dark'] *) {
4958
- --focus-outline: color-mix(in srgb, #fff 25%, transparent);
5371
+ --badge-hover-overlay: color-mix(
5372
+ in srgb,
5373
+ oklch(0.2899986864508513 0.11729574451023282 259.841936589881) 50%,
5374
+ transparent
5375
+ );
4959
5376
  @supports (color: color-mix(in lab, red, red)) {
4960
- --focus-outline: color-mix(in oklab, var(--color-white) 25%, transparent);
5377
+ --badge-hover-overlay: color-mix(in oklab, var(--color-primary-800) 50%, transparent);
4961
5378
  }
4962
5379
  }
4963
5380
  }
4964
- .dark\:\[--focus-outline\:white\] {
4965
- &:where([data-theme='dark'], [data-theme='dark'] *) {
4966
- --focus-outline: white;
4967
- }
4968
- }
4969
- .dark\:\[--focus-outline\:white\]\/30 {
5381
+ .dark\:\[--badge-text\:var\(--color-grey-800\)\] {
4970
5382
  &:where([data-theme='dark'], [data-theme='dark'] *) {
4971
- --focus-outline: color-mix(in oklab, white 30%, transparent);
5383
+ --badge-text: var(--color-grey-800);
4972
5384
  }
4973
5385
  }
4974
- .dark\:\[--toggle-border\:white\]\/40 {
5386
+ .dark\:\[--badge-text\:var\(--color-white\)\] {
4975
5387
  &:where([data-theme='dark'], [data-theme='dark'] *) {
4976
- --toggle-border: color-mix(in oklab, white 40%, transparent);
5388
+ --badge-text: var(--color-white);
4977
5389
  }
4978
5390
  }
4979
- .dark\:group-hover\:fill-nsw-grey-500 {
5391
+ .dark\:\[--btn-bg\:var\(--color-grey-600\)\] {
4980
5392
  &:where([data-theme='dark'], [data-theme='dark'] *) {
4981
- &:is(:where(.group):hover *) {
4982
- @media (hover: hover) {
4983
- fill: var(--color-nsw-grey-500);
4984
- }
4985
- }
5393
+ --btn-bg: var(--color-grey-600);
4986
5394
  }
4987
5395
  }
4988
- .dark\:group-data-active\:bg-white\/15 {
5396
+ .dark\:\[--btn-bg\:var\(--color-white\)\] {
4989
5397
  &:where([data-theme='dark'], [data-theme='dark'] *) {
4990
- &:is(:where(.group)[data-active] *) {
4991
- background-color: color-mix(in srgb, #fff 15%, transparent);
4992
- @supports (color: color-mix(in lab, red, red)) {
4993
- background-color: color-mix(in oklab, var(--color-white) 15%, transparent);
4994
- }
4995
- }
5398
+ --btn-bg: var(--color-white);
4996
5399
  }
4997
5400
  }
4998
- .dark\:group-data-hover\:border-nsw-grey-200\/20 {
5401
+ .dark\:\[--btn-border\:var\(--color-grey-600\)\]\/90 {
4999
5402
  &:where([data-theme='dark'], [data-theme='dark'] *) {
5000
- &:is(:where(.group)[data-hover] *) {
5001
- border-color: color-mix(in srgb, oklch(0.9401 0 0) 20%, transparent);
5002
- @supports (color: color-mix(in lab, red, red)) {
5003
- border-color: color-mix(in oklab, var(--color-nsw-grey-200) 20%, transparent);
5004
- }
5403
+ --btn-border: color-mix(
5404
+ in srgb,
5405
+ oklch(0.426426783985819 0.011202235626284581 232.61715023407646) 90%,
5406
+ transparent
5407
+ );
5408
+ @supports (color: color-mix(in lab, red, red)) {
5409
+ --btn-border: color-mix(in oklab, var(--color-grey-600) 90%, transparent);
5005
5410
  }
5006
5411
  }
5007
5412
  }
5008
- .dark\:group-data-hover\:bg-white\/10 {
5413
+ .dark\:\[--btn-border\:var\(--color-white\)\]\/90 {
5009
5414
  &:where([data-theme='dark'], [data-theme='dark'] *) {
5010
- &:is(:where(.group)[data-hover] *) {
5011
- background-color: color-mix(in srgb, #fff 10%, transparent);
5012
- @supports (color: color-mix(in lab, red, red)) {
5013
- background-color: color-mix(in oklab, var(--color-white) 10%, transparent);
5014
- }
5415
+ --btn-border: color-mix(in srgb, #fff 90%, transparent);
5416
+ @supports (color: color-mix(in lab, red, red)) {
5417
+ --btn-border: color-mix(in oklab, var(--color-white) 90%, transparent);
5015
5418
  }
5016
5419
  }
5017
5420
  }
5018
- .dark\:group-data-hover\:bg-white\/20 {
5421
+ .dark\:\[--btn-hover-overlay\:var\(--color-grey-600\)\]\/50 {
5019
5422
  &:where([data-theme='dark'], [data-theme='dark'] *) {
5020
- &:is(:where(.group)[data-hover] *) {
5021
- background-color: color-mix(in srgb, #fff 20%, transparent);
5022
- @supports (color: color-mix(in lab, red, red)) {
5023
- background-color: color-mix(in oklab, var(--color-white) 20%, transparent);
5024
- }
5423
+ --btn-hover-overlay: color-mix(
5424
+ in srgb,
5425
+ oklch(0.426426783985819 0.011202235626284581 232.61715023407646) 50%,
5426
+ transparent
5427
+ );
5428
+ @supports (color: color-mix(in lab, red, red)) {
5429
+ --btn-hover-overlay: color-mix(in oklab, var(--color-grey-600) 50%, transparent);
5025
5430
  }
5026
5431
  }
5027
5432
  }
5028
- .dark\:group-data-hover\:\[--badge-bg\:var\(--color-accent\)\]\/80 {
5433
+ .dark\:\[--btn-hover-overlay\:var\(--color-primary-800\)\]\/50 {
5029
5434
  &:where([data-theme='dark'], [data-theme='dark'] *) {
5030
- &:is(:where(.group)[data-hover] *) {
5031
- --badge-bg: color-mix(in srgb, oklch(0.562 0.2175 20.33) 80%, transparent);
5032
- @supports (color: color-mix(in lab, red, red)) {
5033
- --badge-bg: color-mix(in oklab, var(--color-accent) 80%, transparent);
5034
- }
5435
+ --btn-hover-overlay: color-mix(
5436
+ in srgb,
5437
+ oklch(0.2899986864508513 0.11729574451023282 259.841936589881) 50%,
5438
+ transparent
5439
+ );
5440
+ @supports (color: color-mix(in lab, red, red)) {
5441
+ --btn-hover-overlay: color-mix(in oklab, var(--color-primary-800) 50%, transparent);
5035
5442
  }
5036
5443
  }
5037
5444
  }
5038
- .dark\:group-data-hover\:\[--badge-bg\:var\(--color-error\)\]\/80 {
5445
+ .dark\:\[--btn-hover-overlay\:var\(--color-white\)\]\/10 {
5039
5446
  &:where([data-theme='dark'], [data-theme='dark'] *) {
5040
- &:is(:where(.group)[data-hover] *) {
5041
- --badge-bg: color-mix(in srgb, oklch(0.502 0.1927 18.08) 80%, transparent);
5042
- @supports (color: color-mix(in lab, red, red)) {
5043
- --badge-bg: color-mix(in oklab, var(--color-error) 80%, transparent);
5044
- }
5447
+ --btn-hover-overlay: color-mix(in srgb, #fff 10%, transparent);
5448
+ @supports (color: color-mix(in lab, red, red)) {
5449
+ --btn-hover-overlay: color-mix(in oklab, var(--color-white) 10%, transparent);
5045
5450
  }
5046
5451
  }
5047
5452
  }
5048
- .dark\:group-data-hover\:\[--badge-bg\:var\(--color-info\)\]\/80 {
5453
+ .dark\:\[--btn-hover-overlay\:var\(--color-white\)\]\/15 {
5049
5454
  &:where([data-theme='dark'], [data-theme='dark'] *) {
5050
- &:is(:where(.group)[data-hover] *) {
5051
- --badge-bg: color-mix(in srgb, oklch(0.4506 0.1233 262.35) 80%, transparent);
5052
- @supports (color: color-mix(in lab, red, red)) {
5053
- --badge-bg: color-mix(in oklab, var(--color-info) 80%, transparent);
5054
- }
5455
+ --btn-hover-overlay: color-mix(in srgb, #fff 15%, transparent);
5456
+ @supports (color: color-mix(in lab, red, red)) {
5457
+ --btn-hover-overlay: color-mix(in oklab, var(--color-white) 15%, transparent);
5055
5458
  }
5056
5459
  }
5057
5460
  }
5058
- .dark\:group-data-hover\:\[--badge-bg\:var\(--color-nsw-grey-100\)\] {
5461
+ .dark\:\[--btn-text\:var\(--color-grey-800\)\] {
5059
5462
  &:where([data-theme='dark'], [data-theme='dark'] *) {
5060
- &:is(:where(.group)[data-hover] *) {
5061
- --badge-bg: var(--color-nsw-grey-100);
5062
- }
5463
+ --btn-text: var(--color-grey-800);
5063
5464
  }
5064
5465
  }
5065
- .dark\:group-data-hover\:\[--badge-bg\:var\(--color-nsw-grey-200\)\] {
5466
+ .dark\:\[--btn-text\:white\] {
5066
5467
  &:where([data-theme='dark'], [data-theme='dark'] *) {
5067
- &:is(:where(.group)[data-hover] *) {
5068
- --badge-bg: var(--color-nsw-grey-200);
5069
- }
5468
+ --btn-text: white;
5070
5469
  }
5071
5470
  }
5072
- .dark\:group-data-hover\:\[--badge-bg\:var\(--color-primary-light\)\] {
5471
+ .dark\:\[--focus-outline\:var\(--color-grey-100\)\] {
5073
5472
  &:where([data-theme='dark'], [data-theme='dark'] *) {
5074
- &:is(:where(.group)[data-hover] *) {
5075
- --badge-bg: var(--color-primary-light);
5076
- }
5473
+ --focus-outline: var(--color-grey-100);
5077
5474
  }
5078
5475
  }
5079
- .dark\:group-data-hover\:\[--badge-bg\:var\(--color-secondary\)\]\/45 {
5476
+ .dark\:\[--focus-outline\:var\(--color-grey-500\)\] {
5080
5477
  &:where([data-theme='dark'], [data-theme='dark'] *) {
5081
- &:is(:where(.group)[data-hover] *) {
5082
- --badge-bg: color-mix(in srgb, oklch(0.9267 0.0417 227.89) 45%, transparent);
5083
- @supports (color: color-mix(in lab, red, red)) {
5084
- --badge-bg: color-mix(in oklab, var(--color-secondary) 45%, transparent);
5085
- }
5086
- }
5478
+ --focus-outline: var(--color-grey-500);
5087
5479
  }
5088
5480
  }
5089
- .dark\:group-data-hover\:\[--badge-bg\:var\(--color-success\)\]\/80 {
5481
+ .dark\:\[--focus-outline\:var\(--color-grey-600\)\] {
5090
5482
  &:where([data-theme='dark'], [data-theme='dark'] *) {
5091
- &:is(:where(.group)[data-hover] *) {
5092
- --badge-bg: color-mix(in srgb, oklch(0.549 0.1849 142.8) 80%, transparent);
5093
- @supports (color: color-mix(in lab, red, red)) {
5094
- --badge-bg: color-mix(in oklab, var(--color-success) 80%, transparent);
5095
- }
5096
- }
5483
+ --focus-outline: var(--color-grey-600);
5097
5484
  }
5098
5485
  }
5099
- .dark\:group-data-hover\:\[--badge-bg\:var\(--color-tertiary\)\]\/80 {
5486
+ .dark\:\[--focus-outline\:var\(--color-white\)\] {
5100
5487
  &:where([data-theme='dark'], [data-theme='dark'] *) {
5101
- &:is(:where(.group)[data-hover] *) {
5102
- --badge-bg: color-mix(in srgb, oklch(0.5751 0.2298 260.76) 80%, transparent);
5103
- @supports (color: color-mix(in lab, red, red)) {
5104
- --badge-bg: color-mix(in oklab, var(--color-tertiary) 80%, transparent);
5105
- }
5106
- }
5488
+ --focus-outline: var(--color-white);
5107
5489
  }
5108
5490
  }
5109
- .dark\:group-data-hover\:\[--badge-bg\:var\(--color-warning\)\]\/80 {
5491
+ .dark\:\[--toggle-border\:white\]\/40 {
5110
5492
  &:where([data-theme='dark'], [data-theme='dark'] *) {
5111
- &:is(:where(.group)[data-hover] *) {
5112
- --badge-bg: color-mix(in srgb, oklch(0.5833 0.169705 43.9973) 80%, transparent);
5113
- @supports (color: color-mix(in lab, red, red)) {
5114
- --badge-bg: color-mix(in oklab, var(--color-warning) 80%, transparent);
5115
- }
5116
- }
5493
+ --toggle-border: color-mix(in oklab, white 40%, transparent);
5117
5494
  }
5118
5495
  }
5119
- .dark\:group-data-hover\:\[--badge-bg\:white\]\/20 {
5496
+ .dark\:group-hover\:fill-nsw-grey-500 {
5120
5497
  &:where([data-theme='dark'], [data-theme='dark'] *) {
5121
- &:is(:where(.group)[data-hover] *) {
5122
- --badge-bg: color-mix(in oklab, white 20%, transparent);
5498
+ &:is(:where(.group):hover *) {
5499
+ @media (hover: hover) {
5500
+ fill: var(--color-nsw-grey-500);
5501
+ }
5123
5502
  }
5124
5503
  }
5125
5504
  }
@@ -5138,6 +5517,17 @@
5138
5517
  }
5139
5518
  }
5140
5519
  }
5520
+ .dark\:before\:bg-white\/5 {
5521
+ &:where([data-theme='dark'], [data-theme='dark'] *) {
5522
+ &::before {
5523
+ content: var(--tw-content);
5524
+ background-color: color-mix(in srgb, #fff 5%, transparent);
5525
+ @supports (color: color-mix(in lab, red, red)) {
5526
+ background-color: color-mix(in oklab, var(--color-white) 5%, transparent);
5527
+ }
5528
+ }
5529
+ }
5530
+ }
5141
5531
  .dark\:after\:-inset-px {
5142
5532
  &:where([data-theme='dark'], [data-theme='dark'] *) {
5143
5533
  &::after {
@@ -5172,6 +5562,15 @@
5172
5562
  }
5173
5563
  }
5174
5564
  }
5565
+ .dark\:hover\:bg-grey-700 {
5566
+ &:where([data-theme='dark'], [data-theme='dark'] *) {
5567
+ &:hover {
5568
+ @media (hover: hover) {
5569
+ background-color: oklch(0.3479196456937804 0.010781103557482309 237.35049475166784);
5570
+ }
5571
+ }
5572
+ }
5573
+ }
5175
5574
  .dark\:hover\:bg-input\/50 {
5176
5575
  &:where([data-theme='dark'], [data-theme='dark'] *) {
5177
5576
  &:hover {
@@ -5223,218 +5622,338 @@
5223
5622
  }
5224
5623
  }
5225
5624
  }
5226
- .hover\:dark\:text-gray-300 {
5625
+ .hover\:dark\:text-grey-300 {
5227
5626
  &:hover {
5228
5627
  @media (hover: hover) {
5229
5628
  &:where([data-theme='dark'], [data-theme='dark'] *) {
5230
- color: var(--color-gray-300);
5629
+ color: oklch(0.9015833129261941 0.0038881189007590215 228.8687380011113);
5231
5630
  }
5232
5631
  }
5233
5632
  }
5234
5633
  }
5235
- .dark\:hover\:outline-white\/10 {
5634
+ .dark\:hover\:\[--toggle-border\:white\]\/50 {
5236
5635
  &:where([data-theme='dark'], [data-theme='dark'] *) {
5237
5636
  &:hover {
5238
5637
  @media (hover: hover) {
5239
- outline-color: color-mix(in srgb, #fff 10%, transparent);
5240
- @supports (color: color-mix(in lab, red, red)) {
5241
- outline-color: color-mix(in oklab, var(--color-white) 10%, transparent);
5242
- }
5638
+ --toggle-border: color-mix(in oklab, white 50%, transparent);
5243
5639
  }
5244
5640
  }
5245
5641
  }
5246
5642
  }
5247
- .dark\:hover\:\[--toggle-border\:white\]\/50 {
5643
+ .dark\:data-hover\:decoration-white {
5248
5644
  &:where([data-theme='dark'], [data-theme='dark'] *) {
5249
- &:hover {
5250
- @media (hover: hover) {
5251
- --toggle-border: color-mix(in oklab, white 50%, transparent);
5252
- }
5645
+ &[data-hover] {
5646
+ text-decoration-color: var(--color-white);
5253
5647
  }
5254
5648
  }
5255
5649
  }
5256
- .dark\:focus\:outline-nsw-grey-300\/20 {
5650
+ .dark\:data-\[state\=active\]\:bg-input\/30 {
5257
5651
  &:where([data-theme='dark'], [data-theme='dark'] *) {
5258
- &:focus {
5259
- outline-color: color-mix(in srgb, oklch(0.9016 0.0039 294.435) 20%, transparent);
5652
+ &[data-state='active'] {
5653
+ background-color: var(--input);
5260
5654
  @supports (color: color-mix(in lab, red, red)) {
5261
- outline-color: color-mix(in oklab, var(--color-nsw-grey-300) 20%, transparent);
5655
+ background-color: color-mix(in oklab, var(--input) 30%, transparent);
5262
5656
  }
5263
5657
  }
5264
5658
  }
5265
5659
  }
5266
- .dark\:focus\:outline-white {
5660
+ .dark\:data-\[state\=active\]\:text-foreground {
5267
5661
  &:where([data-theme='dark'], [data-theme='dark'] *) {
5268
- &:focus {
5269
- outline-color: var(--color-white);
5662
+ &[data-state='active'] {
5663
+ color: var(--foreground);
5270
5664
  }
5271
5665
  }
5272
5666
  }
5273
- .dark\:aria-invalid\:ring-error\/40 {
5667
+ .dark\:data-\[state\=checked\]\:bg-primary-800 {
5274
5668
  &:where([data-theme='dark'], [data-theme='dark'] *) {
5275
- &[aria-invalid='true'] {
5276
- --tw-ring-color: color-mix(in oklab, oklch(0.502 0.1927 18.08) 40%, transparent);
5669
+ &[data-state='checked'] {
5670
+ background-color: oklch(0.2899986864508513 0.11729574451023282 259.841936589881);
5277
5671
  }
5278
5672
  }
5279
5673
  }
5280
- .dark\:data-active\:bg-white {
5674
+ .dark\:data-\[state\=on\]\:bg-white\/10 {
5281
5675
  &:where([data-theme='dark'], [data-theme='dark'] *) {
5282
- &[data-active] {
5283
- background-color: var(--color-white);
5676
+ &[data-state='on'] {
5677
+ background-color: color-mix(in srgb, #fff 10%, transparent);
5678
+ @supports (color: color-mix(in lab, red, red)) {
5679
+ background-color: color-mix(in oklab, var(--color-white) 10%, transparent);
5680
+ }
5284
5681
  }
5285
5682
  }
5286
5683
  }
5287
- .dark\:data-active\:bg-white\/10 {
5684
+ .dark\:data-\[state\=on\]\:text-white {
5288
5685
  &:where([data-theme='dark'], [data-theme='dark'] *) {
5289
- &[data-active] {
5290
- background-color: color-mix(in srgb, #fff 10%, transparent);
5686
+ &[data-state='on'] {
5687
+ color: var(--color-white);
5688
+ }
5689
+ }
5690
+ }
5691
+ .dark\:data-\[state\=unchecked\]\:bg-foreground {
5692
+ &:where([data-theme='dark'], [data-theme='dark'] *) {
5693
+ &[data-state='unchecked'] {
5694
+ background-color: var(--foreground);
5695
+ }
5696
+ }
5697
+ }
5698
+ .dark\:data-\[state\=unchecked\]\:bg-input\/80 {
5699
+ &:where([data-theme='dark'], [data-theme='dark'] *) {
5700
+ &[data-state='unchecked'] {
5701
+ background-color: var(--input);
5291
5702
  @supports (color: color-mix(in lab, red, red)) {
5292
- background-color: color-mix(in oklab, var(--color-white) 10%, transparent);
5703
+ background-color: color-mix(in oklab, var(--input) 80%, transparent);
5293
5704
  }
5294
5705
  }
5295
5706
  }
5296
5707
  }
5297
- .dark\:data-active\:text-primary {
5708
+ .dark\:data-\[variant\=ghost\]\:bg-transparent {
5298
5709
  &:where([data-theme='dark'], [data-theme='dark'] *) {
5299
- &[data-active] {
5300
- color: oklch(0.29 0.1173 259.84);
5710
+ &[data-variant='ghost'] {
5711
+ background-color: transparent;
5301
5712
  }
5302
5713
  }
5303
5714
  }
5304
- .dark\:data-active\:\[--btn-icon\:var\(--color-nsw-grey-50\)\] {
5715
+ .dark\:data-\[variant\=outline\]\:border-\[--badge-hover-overlay\:var\(--color-primary-700\)\] {
5305
5716
  &:where([data-theme='dark'], [data-theme='dark'] *) {
5306
- &[data-active] {
5307
- --btn-icon: var(--color-nsw-grey-50);
5717
+ &[data-variant='outline'] {
5718
+ border-color: var(--color-primary-700);
5308
5719
  }
5309
5720
  }
5310
5721
  }
5311
- .dark\:data-active\:\[--btn-icon\:var\(--color-primary\)\] {
5722
+ .dark\:data-\[variant\=outline\]\:border-\[--btn-hover-overlay\:var\(--color-primary-700\)\] {
5312
5723
  &:where([data-theme='dark'], [data-theme='dark'] *) {
5313
- &[data-active] {
5314
- --btn-icon: var(--color-primary);
5724
+ &[data-variant='outline'] {
5725
+ border-color: var(--color-primary-700);
5315
5726
  }
5316
5727
  }
5317
5728
  }
5318
- .dark\:data-active\:\[--btn-icon\:var\(--color-primary-darker\)\] {
5729
+ .dark\:data-\[variant\=outline\]\:\[--btn-border\:var\(--color-grey-600\)\] {
5319
5730
  &:where([data-theme='dark'], [data-theme='dark'] *) {
5320
- &[data-active] {
5321
- --btn-icon: var(--color-primary-darker);
5731
+ &[data-variant='outline'] {
5732
+ --btn-border: var(--color-grey-600);
5322
5733
  }
5323
5734
  }
5324
5735
  }
5325
- .dark\:data-active\:\[--btn-icon\:var\(--color-white\)\] {
5736
+ .dark\:data-\[variant\=outline\]\:\[--focus-outline\:var\(--color-grey-100\)\]\/30 {
5326
5737
  &:where([data-theme='dark'], [data-theme='dark'] *) {
5327
- &[data-active] {
5328
- --btn-icon: var(--color-white);
5738
+ &[data-variant='outline'] {
5739
+ --focus-outline: color-mix(in srgb, oklch(0.9700350548225147 0 0) 30%, transparent);
5740
+ @supports (color: color-mix(in lab, red, red)) {
5741
+ --focus-outline: color-mix(in oklab, var(--color-grey-100) 30%, transparent);
5742
+ }
5329
5743
  }
5330
5744
  }
5331
5745
  }
5332
- .dark\:data-hover\:bg-white {
5746
+ .dark\:data-\[variant\=soft\]\:\[--btn-bg\:var\(--color-grey-400\)\] {
5333
5747
  &:where([data-theme='dark'], [data-theme='dark'] *) {
5334
- &[data-hover] {
5335
- background-color: var(--color-white);
5748
+ &[data-variant='soft'] {
5749
+ --btn-bg: var(--color-grey-400);
5336
5750
  }
5337
5751
  }
5338
5752
  }
5339
- .dark\:data-hover\:bg-white\/10 {
5753
+ .dark\:data-\[variant\=soft\]\:\[--focus-outline\:var\(--color-accent-600\)\]\/60 {
5340
5754
  &:where([data-theme='dark'], [data-theme='dark'] *) {
5341
- &[data-hover] {
5342
- background-color: color-mix(in srgb, #fff 10%, transparent);
5755
+ &[data-variant='soft'] {
5756
+ --focus-outline: color-mix(
5757
+ in srgb,
5758
+ oklch(0.5619554183945837 0.2175050118438328 20.33356497329407) 60%,
5759
+ transparent
5760
+ );
5343
5761
  @supports (color: color-mix(in lab, red, red)) {
5344
- background-color: color-mix(in oklab, var(--color-white) 10%, transparent);
5762
+ --focus-outline: color-mix(in oklab, var(--color-accent-600) 60%, transparent);
5345
5763
  }
5346
5764
  }
5347
5765
  }
5348
5766
  }
5349
- .dark\:data-hover\:text-primary {
5767
+ .dark\:data-\[variant\=soft\]\:\[--focus-outline\:var\(--color-grey-200\)\]\/20 {
5350
5768
  &:where([data-theme='dark'], [data-theme='dark'] *) {
5351
- &[data-hover] {
5352
- color: oklch(0.29 0.1173 259.84);
5769
+ &[data-variant='soft'] {
5770
+ --focus-outline: color-mix(in srgb, oklch(0.9400701096450296 0 0) 20%, transparent);
5771
+ @supports (color: color-mix(in lab, red, red)) {
5772
+ --focus-outline: color-mix(in oklab, var(--color-grey-200) 20%, transparent);
5773
+ }
5353
5774
  }
5354
5775
  }
5355
5776
  }
5356
- .dark\:data-hover\:\[--btn-icon\:var\(--color-nsw-grey-50\)\] {
5777
+ .dark\:data-\[variant\=soft\]\:\[--focus-outline\:var\(--color-grey-200\)\]\/30 {
5357
5778
  &:where([data-theme='dark'], [data-theme='dark'] *) {
5358
- &[data-hover] {
5359
- --btn-icon: var(--color-nsw-grey-50);
5779
+ &[data-variant='soft'] {
5780
+ --focus-outline: color-mix(in srgb, oklch(0.9400701096450296 0 0) 30%, transparent);
5781
+ @supports (color: color-mix(in lab, red, red)) {
5782
+ --focus-outline: color-mix(in oklab, var(--color-grey-200) 30%, transparent);
5783
+ }
5360
5784
  }
5361
5785
  }
5362
5786
  }
5363
- .dark\:data-hover\:\[--btn-icon\:var\(--color-primary\)\] {
5787
+ .dark\:data-\[variant\=soft\]\:\[--focus-outline\:var\(--color-primary-200\)\]\/60 {
5364
5788
  &:where([data-theme='dark'], [data-theme='dark'] *) {
5365
- &[data-hover] {
5366
- --btn-icon: var(--color-primary);
5789
+ &[data-variant='soft'] {
5790
+ --focus-outline: color-mix(
5791
+ in srgb,
5792
+ oklch(0.9266735792514218 0.04166332334226081 227.890755564881) 60%,
5793
+ transparent
5794
+ );
5795
+ @supports (color: color-mix(in lab, red, red)) {
5796
+ --focus-outline: color-mix(in oklab, var(--color-primary-200) 60%, transparent);
5797
+ }
5367
5798
  }
5368
5799
  }
5369
5800
  }
5370
- .dark\:data-hover\:\[--btn-icon\:var\(--color-primary-darker\)\] {
5801
+ .dark\:data-\[variant\=soft\]\:\[--focus-outline\:var\(--color-primary-600\)\]\/60 {
5371
5802
  &:where([data-theme='dark'], [data-theme='dark'] *) {
5372
- &[data-hover] {
5373
- --btn-icon: var(--color-primary-darker);
5803
+ &[data-variant='soft'] {
5804
+ --focus-outline: color-mix(
5805
+ in srgb,
5806
+ oklch(0.5751126532766045 0.2298336295034379 260.75633298199585) 60%,
5807
+ transparent
5808
+ );
5809
+ @supports (color: color-mix(in lab, red, red)) {
5810
+ --focus-outline: color-mix(in oklab, var(--color-primary-600) 60%, transparent);
5811
+ }
5374
5812
  }
5375
5813
  }
5376
5814
  }
5377
- .dark\:data-hover\:\[--btn-icon\:var\(--color-white\)\] {
5815
+ .dark\:data-\[variant\=soft\]\:\[--focus-outline\:var\(--color-primary-800\)\]\/60 {
5378
5816
  &:where([data-theme='dark'], [data-theme='dark'] *) {
5379
- &[data-hover] {
5380
- --btn-icon: var(--color-white);
5817
+ &[data-variant='soft'] {
5818
+ --focus-outline: color-mix(
5819
+ in srgb,
5820
+ oklch(0.2899986864508513 0.11729574451023282 259.841936589881) 60%,
5821
+ transparent
5822
+ );
5823
+ @supports (color: color-mix(in lab, red, red)) {
5824
+ --focus-outline: color-mix(in oklab, var(--color-primary-800) 60%, transparent);
5825
+ }
5381
5826
  }
5382
5827
  }
5383
5828
  }
5384
- .dark\:data-\[state\=active\]\:bg-input\/30 {
5829
+ .dark\:data-\[variant\=solid\]\:bg-\[--badge-hover-overlay\:var\(--color-primary-800\)\] {
5385
5830
  &:where([data-theme='dark'], [data-theme='dark'] *) {
5386
- &[data-state='active'] {
5387
- background-color: var(--input);
5831
+ &[data-variant='solid'] {
5832
+ background-color: var(--color-primary-800);
5833
+ }
5834
+ }
5835
+ }
5836
+ .dark\:data-\[variant\=solid\]\:bg-\[--btn-hover-overlay\:var\(--color-primary-800\)\] {
5837
+ &:where([data-theme='dark'], [data-theme='dark'] *) {
5838
+ &[data-variant='solid'] {
5839
+ background-color: var(--color-primary-800);
5840
+ }
5841
+ }
5842
+ }
5843
+ .dark\:data-\[variant\=solid\]\:text-grey-800 {
5844
+ &:where([data-theme='dark'], [data-theme='dark'] *) {
5845
+ &[data-variant='solid'] {
5846
+ color: oklch(0.26941250740174183 0.010359971488680036 242.08383926925922);
5847
+ }
5848
+ }
5849
+ }
5850
+ .dark\:data-\[variant\=solid\]\:\[--badge-hover-overlay\:var\(--color-white\)\]\/5 {
5851
+ &:where([data-theme='dark'], [data-theme='dark'] *) {
5852
+ &[data-variant='solid'] {
5853
+ --badge-hover-overlay: color-mix(in srgb, #fff 5%, transparent);
5388
5854
  @supports (color: color-mix(in lab, red, red)) {
5389
- background-color: color-mix(in oklab, var(--input) 30%, transparent);
5855
+ --badge-hover-overlay: color-mix(in oklab, var(--color-white) 5%, transparent);
5390
5856
  }
5391
5857
  }
5392
5858
  }
5393
5859
  }
5394
- .dark\:data-\[state\=active\]\:text-foreground {
5860
+ .dark\:data-\[variant\=solid\]\:\[--btn-hover-overlay\:var\(--color-white\)\]\/5 {
5395
5861
  &:where([data-theme='dark'], [data-theme='dark'] *) {
5396
- &[data-state='active'] {
5397
- color: var(--foreground);
5862
+ &[data-variant='solid'] {
5863
+ --btn-hover-overlay: color-mix(in srgb, #fff 5%, transparent);
5864
+ @supports (color: color-mix(in lab, red, red)) {
5865
+ --btn-hover-overlay: color-mix(in oklab, var(--color-white) 5%, transparent);
5866
+ }
5398
5867
  }
5399
5868
  }
5400
5869
  }
5401
- .dark\:data-\[state\=checked\]\:bg-primary {
5870
+ .dark\:data-\[variant\=surface\]\:border-\[--badge-hover-overlay\:var\(--color-primary-700\)\]\/60 {
5402
5871
  &:where([data-theme='dark'], [data-theme='dark'] *) {
5403
- &[data-state='checked'] {
5404
- background-color: oklch(0.29 0.1173 259.84);
5872
+ &[data-variant='surface'] {
5873
+ border-color: color-mix(
5874
+ in srgb,
5875
+ oklch(0.43255566986372795 0.17356468700683536 260.29913478593846) 60%,
5876
+ transparent
5877
+ );
5878
+ @supports (color: color-mix(in lab, red, red)) {
5879
+ border-color: color-mix(in oklab, var(--color-primary-700) 60%, transparent);
5880
+ }
5405
5881
  }
5406
5882
  }
5407
5883
  }
5408
- .dark\:data-\[state\=on\]\:bg-white\/10 {
5884
+ .dark\:data-\[variant\=surface\]\:border-\[--btn-hover-overlay\:var\(--color-primary-700\)\]\/60 {
5409
5885
  &:where([data-theme='dark'], [data-theme='dark'] *) {
5410
- &[data-state='on'] {
5411
- background-color: color-mix(in srgb, #fff 10%, transparent);
5886
+ &[data-variant='surface'] {
5887
+ border-color: color-mix(
5888
+ in srgb,
5889
+ oklch(0.43255566986372795 0.17356468700683536 260.29913478593846) 60%,
5890
+ transparent
5891
+ );
5412
5892
  @supports (color: color-mix(in lab, red, red)) {
5413
- background-color: color-mix(in oklab, var(--color-white) 10%, transparent);
5893
+ border-color: color-mix(in oklab, var(--color-primary-700) 60%, transparent);
5414
5894
  }
5415
5895
  }
5416
5896
  }
5417
5897
  }
5418
- .dark\:data-\[state\=on\]\:text-white {
5898
+ .dark\:data-\[variant\=surface\]\:\[--btn-bg\:var\(--color-grey-400\)\] {
5419
5899
  &:where([data-theme='dark'], [data-theme='dark'] *) {
5420
- &[data-state='on'] {
5421
- color: var(--color-white);
5900
+ &[data-variant='surface'] {
5901
+ --btn-bg: var(--color-grey-400);
5422
5902
  }
5423
5903
  }
5424
5904
  }
5425
- .dark\:data-\[state\=unchecked\]\:bg-foreground {
5905
+ .dark\:data-\[variant\=surface\]\:\[--focus-outline\:var\(--color-grey-200\)\]\/20 {
5426
5906
  &:where([data-theme='dark'], [data-theme='dark'] *) {
5427
- &[data-state='unchecked'] {
5428
- background-color: var(--foreground);
5907
+ &[data-variant='surface'] {
5908
+ --focus-outline: color-mix(in srgb, oklch(0.9400701096450296 0 0) 20%, transparent);
5909
+ @supports (color: color-mix(in lab, red, red)) {
5910
+ --focus-outline: color-mix(in oklab, var(--color-grey-200) 20%, transparent);
5911
+ }
5429
5912
  }
5430
5913
  }
5431
5914
  }
5432
- .dark\:data-\[state\=unchecked\]\:bg-input\/80 {
5915
+ .dark\:data-\[variant\=surface\]\:\[--focus-outline\:var\(--color-white\)\]\/70 {
5433
5916
  &:where([data-theme='dark'], [data-theme='dark'] *) {
5434
- &[data-state='unchecked'] {
5435
- background-color: var(--input);
5917
+ &[data-variant='surface'] {
5918
+ --focus-outline: color-mix(in srgb, #fff 70%, transparent);
5436
5919
  @supports (color: color-mix(in lab, red, red)) {
5437
- background-color: color-mix(in oklab, var(--input) 80%, transparent);
5920
+ --focus-outline: color-mix(in oklab, var(--color-white) 70%, transparent);
5921
+ }
5922
+ }
5923
+ }
5924
+ }
5925
+ .dark\:data-\[variant\=surface\]\:data-active\:border-\[--badge-hover-overlay\:var\(--color-primary-700\)\] {
5926
+ &:where([data-theme='dark'], [data-theme='dark'] *) {
5927
+ &[data-variant='surface'] {
5928
+ &[data-active] {
5929
+ border-color: var(--color-primary-700);
5930
+ }
5931
+ }
5932
+ }
5933
+ }
5934
+ .dark\:data-\[variant\=surface\]\:data-active\:border-\[--btn-hover-overlay\:var\(--color-primary-700\)\] {
5935
+ &:where([data-theme='dark'], [data-theme='dark'] *) {
5936
+ &[data-variant='surface'] {
5937
+ &[data-active] {
5938
+ border-color: var(--color-primary-700);
5939
+ }
5940
+ }
5941
+ }
5942
+ }
5943
+ .dark\:data-\[variant\=surface\]\:data-hover\:border-\[--badge-hover-overlay\:var\(--color-primary-700\)\] {
5944
+ &:where([data-theme='dark'], [data-theme='dark'] *) {
5945
+ &[data-variant='surface'] {
5946
+ &[data-hover] {
5947
+ border-color: var(--color-primary-700);
5948
+ }
5949
+ }
5950
+ }
5951
+ }
5952
+ .dark\:data-\[variant\=surface\]\:data-hover\:border-\[--btn-hover-overlay\:var\(--color-primary-700\)\] {
5953
+ &:where([data-theme='dark'], [data-theme='dark'] *) {
5954
+ &[data-variant='surface'] {
5955
+ &[data-hover] {
5956
+ border-color: var(--color-primary-700);
5438
5957
  }
5439
5958
  }
5440
5959
  }
@@ -5691,38 +6210,104 @@
5691
6210
  }
5692
6211
  }
5693
6212
  :root {
5694
- --background: var(--color-white);
5695
- --foreground: var(--color-nsw-grey-800);
5696
- --muted: var(--color-nsw-grey-100);
5697
- --muted-foreground: var(--color-nsw-grey-600);
5698
- --border: var(--color-nsw-grey-100);
5699
- --input: var(--color-nsw-grey-200);
5700
- --ring: var(--color-nsw-grey-600);
5701
- }
5702
- [data-theme='dark'] {
5703
- --background: var(--color-nsw-grey-900);
5704
- --foreground: var(--color-nsw-grey-50);
5705
- --muted: var(--color-nsw-grey-600);
5706
- --muted-foreground: var(--color-nsw-grey-200);
5707
- --border: var(--color-nsw-grey-100) / 10;
5708
- --input: var(--color-nsw-grey-50);
5709
- --ring: var(--color-nsw-grey-200);
5710
- }
5711
- @layer base {
5712
- * {
5713
- border-color: var(--border);
5714
- outline-color: var(--ring);
5715
- @supports (color: color-mix(in lab, red, red)) {
5716
- outline-color: color-mix(in oklab, var(--ring) 50%, transparent);
5717
- }
5718
- }
5719
- body {
5720
- background-color: var(--background);
5721
- color: var(--foreground);
5722
- }
5723
- [inert] ::-webkit-scrollbar {
5724
- display: none;
5725
- }
6213
+ --font-size-1: calc(12px * var(--scaling));
6214
+ --font-size-2: calc(14px * var(--scaling));
6215
+ --font-size-3: calc(16px * var(--scaling));
6216
+ --font-size-4: calc(18px * var(--scaling));
6217
+ --font-size-5: calc(20px * var(--scaling));
6218
+ --font-size-6: calc(24px * var(--scaling));
6219
+ --font-size-7: calc(28px * var(--scaling));
6220
+ --font-size-8: calc(35px * var(--scaling));
6221
+ --font-size-9: calc(60px * var(--scaling));
6222
+ --font-weight-light: 300;
6223
+ --font-weight-regular: 400;
6224
+ --font-weight-medium: 500;
6225
+ --font-weight-bold: 700;
6226
+ --line-height-1: calc(16px * var(--scaling));
6227
+ --line-height-2: calc(20px * var(--scaling));
6228
+ --line-height-3: calc(24px * var(--scaling));
6229
+ --line-height-4: calc(26px * var(--scaling));
6230
+ --line-height-5: calc(28px * var(--scaling));
6231
+ --line-height-6: calc(30px * var(--scaling));
6232
+ --line-height-7: calc(36px * var(--scaling));
6233
+ --line-height-8: calc(40px * var(--scaling));
6234
+ --line-height-9: calc(60px * var(--scaling));
6235
+ --letter-spacing-1: 0.0025em;
6236
+ --letter-spacing-2: 0em;
6237
+ --letter-spacing-3: 0em;
6238
+ --letter-spacing-4: -0.0025em;
6239
+ --letter-spacing-5: -0.005em;
6240
+ --letter-spacing-6: -0.00625em;
6241
+ --letter-spacing-7: -0.0075em;
6242
+ --letter-spacing-8: -0.01em;
6243
+ --letter-spacing-9: -0.025em;
6244
+ --default-font-family:
6245
+ 'Public Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue',
6246
+ 'Open Sans', system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji';
6247
+ --default-font-size: var(--font-size-3);
6248
+ --default-font-style: normal;
6249
+ --default-font-weight: var(--font-weight-regular);
6250
+ --default-line-height: 1.5;
6251
+ --default-letter-spacing: 0em;
6252
+ --default-leading-trim-start: 0.42em;
6253
+ --default-leading-trim-end: 0.36em;
6254
+ --heading-font-family: var(--default-font-family);
6255
+ --heading-font-size-adjust: 1;
6256
+ --heading-font-style: normal;
6257
+ --heading-leading-trim-start: var(--default-leading-trim-start);
6258
+ --heading-leading-trim-end: var(--default-leading-trim-end);
6259
+ --heading-letter-spacing: 0em;
6260
+ --heading-line-height-1: calc(16px * var(--scaling));
6261
+ --heading-line-height-2: calc(18px * var(--scaling));
6262
+ --heading-line-height-3: calc(22px * var(--scaling));
6263
+ --heading-line-height-4: calc(24px * var(--scaling));
6264
+ --heading-line-height-5: calc(26px * var(--scaling));
6265
+ --heading-line-height-6: calc(30px * var(--scaling));
6266
+ --heading-line-height-7: calc(36px * var(--scaling));
6267
+ --heading-line-height-8: calc(40px * var(--scaling));
6268
+ --heading-line-height-9: calc(60px * var(--scaling));
6269
+ --code-font-family:
6270
+ 'Menlo', 'Consolas (Custom)', 'Bitstream Vera Sans Mono', monospace, 'Apple Color Emoji',
6271
+ 'Segoe UI Emoji';
6272
+ --code-font-size-adjust: 0.95;
6273
+ --code-font-style: normal;
6274
+ --code-font-weight: inherit;
6275
+ --code-letter-spacing: -0.007em;
6276
+ --code-padding-top: 0.1em;
6277
+ --code-padding-bottom: 0.1em;
6278
+ --code-padding-left: 0.25em;
6279
+ --code-padding-right: 0.25em;
6280
+ --strong-font-family: var(--default-font-family);
6281
+ --strong-font-size-adjust: 1;
6282
+ --strong-font-style: inherit;
6283
+ --strong-font-weight: var(--font-weight-bold);
6284
+ --strong-letter-spacing: 0em;
6285
+ --em-font-family: 'Times New Roman', 'Times', serif;
6286
+ --em-font-size-adjust: 1.18;
6287
+ --em-font-style: italic;
6288
+ --em-font-weight: inherit;
6289
+ --em-letter-spacing: -0.025em;
6290
+ --quote-font-family: 'Times New Roman', 'Times', serif;
6291
+ --quote-font-size-adjust: 1.18;
6292
+ --quote-font-style: italic;
6293
+ --quote-font-weight: inherit;
6294
+ --quote-letter-spacing: -0.025em;
6295
+ --tab-active-letter-spacing: -0.01em;
6296
+ --tab-active-word-spacing: 0em;
6297
+ --tab-inactive-letter-spacing: 0em;
6298
+ --tab-inactive-word-spacing: 0em;
6299
+ }
6300
+ body {
6301
+ overflow-wrap: break-word;
6302
+ font-family: var(--default-font-family);
6303
+ font-size: var(--default-font-size);
6304
+ font-weight: var(--default-font-weight);
6305
+ font-style: var(--default-font-style);
6306
+ line-height: var(--default-line-height);
6307
+ letter-spacing: var(--default-letter-spacing);
6308
+ text-size-adjust: none;
6309
+ -webkit-font-smoothing: antialiased;
6310
+ -moz-osx-font-smoothing: grayscale;
5726
6311
  }
5727
6312
  code[class*='language-'],
5728
6313
  pre[class*='language-'] {
@@ -6274,6 +6859,41 @@ code.language-html .token.comment {
6274
6859
  .dark #carbonads .carbon-poweredby {
6275
6860
  --tw-bg-opacity: 1;
6276
6861
  }
6862
+ :root {
6863
+ --scaling: 1;
6864
+ --background: var(--color-white);
6865
+ --foreground: var(--color-grey-800);
6866
+ --muted: var(--color-grey-100);
6867
+ --muted-foreground: var(--color-grey-600);
6868
+ --border: var(--color-grey-100);
6869
+ --input: var(--color-grey-200);
6870
+ --ring: var(--color-grey-600);
6871
+ }
6872
+ [data-theme='dark'] {
6873
+ --background: var(--color-grey-900);
6874
+ --foreground: var(--color-grey-50);
6875
+ --muted: var(--color-grey-600);
6876
+ --muted-foreground: var(--color-grey-200);
6877
+ --border: var(--color-grey-100) / 10;
6878
+ --input: var(--color-grey-50);
6879
+ --ring: var(--color-grey-200);
6880
+ }
6881
+ @layer base {
6882
+ * {
6883
+ border-color: var(--border);
6884
+ outline-color: var(--ring);
6885
+ @supports (color: color-mix(in lab, red, red)) {
6886
+ outline-color: color-mix(in oklab, var(--ring) 50%, transparent);
6887
+ }
6888
+ }
6889
+ body {
6890
+ background-color: var(--background);
6891
+ color: var(--foreground);
6892
+ }
6893
+ [inert] ::-webkit-scrollbar {
6894
+ display: none;
6895
+ }
6896
+ }
6277
6897
  @keyframes enter {
6278
6898
  from {
6279
6899
  opacity: var(--tw-enter-opacity, 1);
@@ -6323,27 +6943,22 @@ code.language-html .token.comment {
6323
6943
  @property --tw-rotate-x {
6324
6944
  syntax: '*';
6325
6945
  inherits: false;
6326
- initial-value: rotateX(0);
6327
6946
  }
6328
6947
  @property --tw-rotate-y {
6329
6948
  syntax: '*';
6330
6949
  inherits: false;
6331
- initial-value: rotateY(0);
6332
6950
  }
6333
6951
  @property --tw-rotate-z {
6334
6952
  syntax: '*';
6335
6953
  inherits: false;
6336
- initial-value: rotateZ(0);
6337
6954
  }
6338
6955
  @property --tw-skew-x {
6339
6956
  syntax: '*';
6340
6957
  inherits: false;
6341
- initial-value: skewX(0);
6342
6958
  }
6343
6959
  @property --tw-skew-y {
6344
6960
  syntax: '*';
6345
6961
  inherits: false;
6346
- initial-value: skewY(0);
6347
6962
  }
6348
6963
  @property --tw-space-y-reverse {
6349
6964
  syntax: '*';
@@ -6533,6 +7148,11 @@ code.language-html .token.comment {
6533
7148
  initial-value: '';
6534
7149
  inherits: false;
6535
7150
  }
7151
+ @keyframes spin {
7152
+ to {
7153
+ transform: rotate(360deg);
7154
+ }
7155
+ }
6536
7156
  @keyframes pulse {
6537
7157
  50% {
6538
7158
  opacity: 0.5;
@@ -6551,11 +7171,11 @@ code.language-html .token.comment {
6551
7171
  --tw-scale-x: 1;
6552
7172
  --tw-scale-y: 1;
6553
7173
  --tw-scale-z: 1;
6554
- --tw-rotate-x: rotateX(0);
6555
- --tw-rotate-y: rotateY(0);
6556
- --tw-rotate-z: rotateZ(0);
6557
- --tw-skew-x: skewX(0);
6558
- --tw-skew-y: skewY(0);
7174
+ --tw-rotate-x: initial;
7175
+ --tw-rotate-y: initial;
7176
+ --tw-rotate-z: initial;
7177
+ --tw-skew-x: initial;
7178
+ --tw-skew-y: initial;
6559
7179
  --tw-space-y-reverse: 0;
6560
7180
  --tw-space-x-reverse: 0;
6561
7181
  --tw-border-style: solid;