@nswds/app 1.9.0 → 1.10.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 (12) hide show
  1. package/dist/globals.css +460 -224
  2. package/dist/index.cjs +4466 -885
  3. package/dist/index.cjs.map +1 -1
  4. package/dist/index.d.cts +653 -274
  5. package/dist/index.d.ts +653 -274
  6. package/dist/index.js +4403 -816
  7. package/dist/index.js.map +1 -1
  8. package/dist/styles.css +540 -250
  9. package/dist/styles.css.map +1 -1
  10. package/dist/styles.d.cts +1 -2
  11. package/dist/styles.d.ts +1 -2
  12. package/package.json +2 -2
package/dist/globals.css CHANGED
@@ -2,9 +2,11 @@
2
2
  @layer properties;
3
3
  @layer theme, base, components, utilities;
4
4
  @layer theme {
5
- :root, :host {
6
- --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",
7
- "Courier New", monospace;
5
+ :root,
6
+ :host {
7
+ --font-mono:
8
+ ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New',
9
+ monospace;
8
10
  --color-green-500: oklch(72.3% 0.219 149.579);
9
11
  --color-slate-200: oklch(92.9% 0.013 255.508);
10
12
  --color-slate-300: oklch(86.9% 0.022 252.894);
@@ -15,24 +17,20 @@
15
17
  --color-slate-800: oklch(27.9% 0.041 260.031);
16
18
  --color-slate-900: oklch(20.8% 0.042 265.755);
17
19
  --color-gray-800: oklch(27.8% 0.033 256.848);
18
- --color-zinc-400: oklch(70.5% 0.015 286.067);
19
- --color-zinc-500: oklch(55.2% 0.016 285.938);
20
- --color-zinc-600: oklch(44.2% 0.017 285.786);
21
- --color-zinc-700: oklch(37% 0.013 285.805);
22
- --color-zinc-900: oklch(21% 0.006 285.885);
23
20
  --color-black: #000;
24
21
  --color-white: #fff;
25
22
  --spacing: 0.25rem;
26
23
  --container-sm: 24rem;
27
24
  --container-md: 28rem;
28
25
  --container-2xl: 42rem;
29
- --container-5xl: 64rem;
30
26
  --text-xs: 0.75rem;
31
27
  --text-xs--line-height: calc(1 / 0.75);
32
28
  --text-sm: 0.875rem;
33
29
  --text-sm--line-height: calc(1.25 / 0.875);
34
30
  --text-base: 1rem;
35
31
  --text-base--line-height: calc(1.5 / 1);
32
+ --text-lg: 1.125rem;
33
+ --text-lg--line-height: calc(1.75 / 1.125);
36
34
  --text-2xl: 1.5rem;
37
35
  --text-2xl--line-height: calc(2 / 1.5);
38
36
  --text-3xl: 1.875rem;
@@ -56,25 +54,42 @@
56
54
  --color-nsw-grey-100: oklch(0.9700500000000001 0 0);
57
55
  --color-nsw-grey-200: oklch(0.9401 0 0);
58
56
  --color-nsw-grey-400: oklch(0.8631 0.0078 228.87);
57
+ --color-nsw-grey-500: oklch(0.6447499999999999 0.0095 230.745);
59
58
  --color-nsw-grey-600: oklch(0.4264 0.0112 232.62);
59
+ --color-nsw-grey-700: oklch(0.3479 0.0108 237.35000000000002);
60
60
  --color-nsw-grey-800: oklch(0.2694 0.0104 242.08);
61
+ --color-nsw-grey-900: oklch(0.17511 0.00728 242.08);
61
62
  --color-nsw-grey-950: oklch(0.127965 0.005719999999999999 242.08);
62
63
  --color-nsw-blue-800: oklch(0.29 0.1173 259.84);
63
64
  --color-nsw-red-600: oklch(0.562 0.2175 20.33);
64
65
  }
65
66
  }
66
67
  @layer base {
67
- *, ::after, ::before, ::backdrop, ::file-selector-button {
68
+ *,
69
+ ::after,
70
+ ::before,
71
+ ::backdrop,
72
+ ::file-selector-button {
68
73
  box-sizing: border-box;
69
74
  margin: 0;
70
75
  padding: 0;
71
76
  border: 0 solid;
72
77
  }
73
- html, :host {
78
+ html,
79
+ :host {
74
80
  line-height: 1.5;
75
81
  -webkit-text-size-adjust: 100%;
76
82
  tab-size: 4;
77
- font-family: var(--default-font-family, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");
83
+ font-family: var(
84
+ --default-font-family,
85
+ ui-sans-serif,
86
+ system-ui,
87
+ sans-serif,
88
+ 'Apple Color Emoji',
89
+ 'Segoe UI Emoji',
90
+ 'Segoe UI Symbol',
91
+ 'Noto Color Emoji'
92
+ );
78
93
  font-feature-settings: var(--default-font-feature-settings, normal);
79
94
  font-variation-settings: var(--default-font-variation-settings, normal);
80
95
  -webkit-tap-highlight-color: transparent;
@@ -88,7 +103,12 @@
88
103
  -webkit-text-decoration: underline dotted;
89
104
  text-decoration: underline dotted;
90
105
  }
91
- h1, h2, h3, h4, h5, h6 {
106
+ h1,
107
+ h2,
108
+ h3,
109
+ h4,
110
+ h5,
111
+ h6 {
92
112
  font-size: inherit;
93
113
  font-weight: inherit;
94
114
  }
@@ -97,11 +117,25 @@
97
117
  -webkit-text-decoration: inherit;
98
118
  text-decoration: inherit;
99
119
  }
100
- b, strong {
120
+ b,
121
+ strong {
101
122
  font-weight: bolder;
102
123
  }
103
- code, kbd, samp, pre {
104
- font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);
124
+ code,
125
+ kbd,
126
+ samp,
127
+ pre {
128
+ font-family: var(
129
+ --default-mono-font-family,
130
+ ui-monospace,
131
+ SFMono-Regular,
132
+ Menlo,
133
+ Monaco,
134
+ Consolas,
135
+ 'Liberation Mono',
136
+ 'Courier New',
137
+ monospace
138
+ );
105
139
  font-feature-settings: var(--default-mono-font-feature-settings, normal);
106
140
  font-variation-settings: var(--default-mono-font-variation-settings, normal);
107
141
  font-size: 1em;
@@ -109,7 +143,8 @@
109
143
  small {
110
144
  font-size: 80%;
111
145
  }
112
- sub, sup {
146
+ sub,
147
+ sup {
113
148
  font-size: 75%;
114
149
  line-height: 0;
115
150
  position: relative;
@@ -135,18 +170,33 @@
135
170
  summary {
136
171
  display: list-item;
137
172
  }
138
- ol, ul, menu {
173
+ ol,
174
+ ul,
175
+ menu {
139
176
  list-style: none;
140
177
  }
141
- img, svg, video, canvas, audio, iframe, embed, object {
178
+ img,
179
+ svg,
180
+ video,
181
+ canvas,
182
+ audio,
183
+ iframe,
184
+ embed,
185
+ object {
142
186
  display: block;
143
187
  vertical-align: middle;
144
188
  }
145
- img, video {
189
+ img,
190
+ video {
146
191
  max-width: 100%;
147
192
  height: auto;
148
193
  }
149
- button, input, select, optgroup, textarea, ::file-selector-button {
194
+ button,
195
+ input,
196
+ select,
197
+ optgroup,
198
+ textarea,
199
+ ::file-selector-button {
150
200
  font: inherit;
151
201
  font-feature-settings: inherit;
152
202
  font-variation-settings: inherit;
@@ -168,7 +218,7 @@
168
218
  ::placeholder {
169
219
  opacity: 1;
170
220
  }
171
- @supports (not (-webkit-appearance: -apple-pay-button)) or (contain-intrinsic-size: 1px) {
221
+ @supports (not (-webkit-appearance: -apple-pay-button)) or (contain-intrinsic-size: 1px) {
172
222
  ::placeholder {
173
223
  color: currentcolor;
174
224
  @supports (color: color-mix(in lab, red, red)) {
@@ -192,19 +242,30 @@
192
242
  ::-webkit-datetime-edit-fields-wrapper {
193
243
  padding: 0;
194
244
  }
195
- ::-webkit-datetime-edit, ::-webkit-datetime-edit-year-field, ::-webkit-datetime-edit-month-field, ::-webkit-datetime-edit-day-field, ::-webkit-datetime-edit-hour-field, ::-webkit-datetime-edit-minute-field, ::-webkit-datetime-edit-second-field, ::-webkit-datetime-edit-millisecond-field, ::-webkit-datetime-edit-meridiem-field {
245
+ ::-webkit-datetime-edit,
246
+ ::-webkit-datetime-edit-year-field,
247
+ ::-webkit-datetime-edit-month-field,
248
+ ::-webkit-datetime-edit-day-field,
249
+ ::-webkit-datetime-edit-hour-field,
250
+ ::-webkit-datetime-edit-minute-field,
251
+ ::-webkit-datetime-edit-second-field,
252
+ ::-webkit-datetime-edit-millisecond-field,
253
+ ::-webkit-datetime-edit-meridiem-field {
196
254
  padding-block: 0;
197
255
  }
198
256
  :-moz-ui-invalid {
199
257
  box-shadow: none;
200
258
  }
201
- button, input:where([type="button"], [type="reset"], [type="submit"]), ::file-selector-button {
259
+ button,
260
+ input:where([type='button'], [type='reset'], [type='submit']),
261
+ ::file-selector-button {
202
262
  appearance: button;
203
263
  }
204
- ::-webkit-inner-spin-button, ::-webkit-outer-spin-button {
264
+ ::-webkit-inner-spin-button,
265
+ ::-webkit-outer-spin-button {
205
266
  height: auto;
206
267
  }
207
- [hidden]:where(:not([hidden="until-found"])) {
268
+ [hidden]:where(:not([hidden='until-found'])) {
208
269
  display: none !important;
209
270
  }
210
271
  }
@@ -255,7 +316,7 @@
255
316
  top: calc(var(--spacing) * 1);
256
317
  }
257
318
  .top-1\/2 {
258
- top: calc(1/2 * 100%);
319
+ top: calc(1 / 2 * 100%);
259
320
  }
260
321
  .top-4 {
261
322
  top: calc(var(--spacing) * 4);
@@ -285,7 +346,7 @@
285
346
  left: calc(var(--spacing) * 1);
286
347
  }
287
348
  .left-1\/2 {
288
- left: calc(1/2 * 100%);
349
+ left: calc(1 / 2 * 100%);
289
350
  }
290
351
  .z-10 {
291
352
  z-index: 10;
@@ -302,12 +363,18 @@
302
363
  .row-start-1 {
303
364
  grid-row-start: 1;
304
365
  }
366
+ .-m-1 {
367
+ margin: calc(var(--spacing) * -1);
368
+ }
305
369
  .mx-auto {
306
370
  margin-inline: auto;
307
371
  }
308
372
  .-my-5 {
309
373
  margin-block: calc(var(--spacing) * -5);
310
374
  }
375
+ .my-4 {
376
+ margin-block: calc(var(--spacing) * 4);
377
+ }
311
378
  .mt-1 {
312
379
  margin-top: calc(var(--spacing) * 1);
313
380
  }
@@ -459,7 +526,7 @@
459
526
  width: calc(var(--spacing) * 3);
460
527
  }
461
528
  .w-3\/4 {
462
- width: calc(3/4 * 100%);
529
+ width: calc(3 / 4 * 100%);
463
530
  }
464
531
  .w-4 {
465
532
  width: calc(var(--spacing) * 4);
@@ -473,17 +540,14 @@
473
540
  .w-10 {
474
541
  width: calc(var(--spacing) * 10);
475
542
  }
476
- .w-12 {
477
- width: calc(var(--spacing) * 12);
478
- }
479
543
  .w-48 {
480
544
  width: calc(var(--spacing) * 48);
481
545
  }
482
546
  .w-56 {
483
547
  width: calc(var(--spacing) * 56);
484
548
  }
485
- .w-80 {
486
- width: calc(var(--spacing) * 80);
549
+ .w-64 {
550
+ width: calc(var(--spacing) * 64);
487
551
  }
488
552
  .w-\[50vw\] {
489
553
  width: 50vw;
@@ -550,7 +614,7 @@
550
614
  translate: var(--tw-translate-x) var(--tw-translate-y);
551
615
  }
552
616
  .-translate-x-1\/2 {
553
- --tw-translate-x: calc(calc(1/2 * 100%) * -1);
617
+ --tw-translate-x: calc(calc(1 / 2 * 100%) * -1);
554
618
  translate: var(--tw-translate-x) var(--tw-translate-y);
555
619
  }
556
620
  .-translate-y-1 {
@@ -558,7 +622,7 @@
558
622
  translate: var(--tw-translate-x) var(--tw-translate-y);
559
623
  }
560
624
  .-translate-y-1\/2 {
561
- --tw-translate-y: calc(calc(1/2 * 100%) * -1);
625
+ --tw-translate-y: calc(calc(1 / 2 * 100%) * -1);
562
626
  translate: var(--tw-translate-x) var(--tw-translate-y);
563
627
  }
564
628
  .-scale-x-100 {
@@ -566,7 +630,8 @@
566
630
  scale: var(--tw-scale-x) var(--tw-scale-y);
567
631
  }
568
632
  .transform {
569
- transform: var(--tw-rotate-x) var(--tw-rotate-y) var(--tw-rotate-z) var(--tw-skew-x) var(--tw-skew-y);
633
+ transform: var(--tw-rotate-x) var(--tw-rotate-y) var(--tw-rotate-z) var(--tw-skew-x)
634
+ var(--tw-skew-y);
570
635
  }
571
636
  .cursor-pointer {
572
637
  cursor: pointer;
@@ -592,6 +657,9 @@
592
657
  .flex-col {
593
658
  flex-direction: column;
594
659
  }
660
+ .flex-row {
661
+ flex-direction: row;
662
+ }
595
663
  .flex-row-reverse {
596
664
  flex-direction: row-reverse;
597
665
  }
@@ -640,13 +708,6 @@
640
708
  .gap-9 {
641
709
  gap: calc(var(--spacing) * 9);
642
710
  }
643
- .space-y-2 {
644
- :where(& > :not(:last-child)) {
645
- --tw-space-y-reverse: 0;
646
- margin-block-start: calc(calc(var(--spacing) * 2) * var(--tw-space-y-reverse));
647
- margin-block-end: calc(calc(var(--spacing) * 2) * calc(1 - var(--tw-space-y-reverse)));
648
- }
649
- }
650
711
  .space-y-3 {
651
712
  :where(& > :not(:last-child)) {
652
713
  --tw-space-y-reverse: 0;
@@ -661,13 +722,6 @@
661
722
  margin-block-end: calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse)));
662
723
  }
663
724
  }
664
- .space-y-6 {
665
- :where(& > :not(:last-child)) {
666
- --tw-space-y-reverse: 0;
667
- margin-block-start: calc(calc(var(--spacing) * 6) * var(--tw-space-y-reverse));
668
- margin-block-end: calc(calc(var(--spacing) * 6) * calc(1 - var(--tw-space-y-reverse)));
669
- }
670
- }
671
725
  .space-y-8 {
672
726
  :where(& > :not(:last-child)) {
673
727
  --tw-space-y-reverse: 0;
@@ -675,13 +729,6 @@
675
729
  margin-block-end: calc(calc(var(--spacing) * 8) * calc(1 - var(--tw-space-y-reverse)));
676
730
  }
677
731
  }
678
- .space-y-10 {
679
- :where(& > :not(:last-child)) {
680
- --tw-space-y-reverse: 0;
681
- margin-block-start: calc(calc(var(--spacing) * 10) * var(--tw-space-y-reverse));
682
- margin-block-end: calc(calc(var(--spacing) * 10) * calc(1 - var(--tw-space-y-reverse)));
683
- }
684
- }
685
732
  .space-y-12 {
686
733
  :where(& > :not(:last-child)) {
687
734
  --tw-space-y-reverse: 0;
@@ -692,6 +739,12 @@
692
739
  .gap-x-1 {
693
740
  column-gap: calc(var(--spacing) * 1);
694
741
  }
742
+ .gap-x-2 {
743
+ column-gap: calc(var(--spacing) * 2);
744
+ }
745
+ .gap-x-4 {
746
+ column-gap: calc(var(--spacing) * 4);
747
+ }
695
748
  .gap-x-12 {
696
749
  column-gap: calc(var(--spacing) * 12);
697
750
  }
@@ -702,6 +755,9 @@
702
755
  margin-inline-end: calc(calc(var(--spacing) * 2) * calc(1 - var(--tw-space-x-reverse)));
703
756
  }
704
757
  }
758
+ .gap-y-3 {
759
+ row-gap: calc(var(--spacing) * 3);
760
+ }
705
761
  .self-start {
706
762
  align-self: flex-start;
707
763
  }
@@ -722,6 +778,9 @@
722
778
  .overflow-y-auto {
723
779
  overflow-y: auto;
724
780
  }
781
+ .rounded {
782
+ border-radius: 0.25rem;
783
+ }
725
784
  .rounded-full {
726
785
  border-radius: calc(infinity * 1px);
727
786
  }
@@ -749,10 +808,6 @@
749
808
  border-style: var(--tw-border-style);
750
809
  border-width: 1px;
751
810
  }
752
- .border-2 {
753
- border-style: var(--tw-border-style);
754
- border-width: 2px;
755
- }
756
811
  .border-t {
757
812
  border-top-style: var(--tw-border-style);
758
813
  border-top-width: 1px;
@@ -787,15 +842,6 @@
787
842
  .border-transparent {
788
843
  border-color: transparent;
789
844
  }
790
- .border-zinc-900 {
791
- border-color: var(--color-zinc-900);
792
- }
793
- .border-zinc-900\/5 {
794
- border-color: color-mix(in srgb, oklch(21% 0.006 285.885) 5%, transparent);
795
- @supports (color: color-mix(in lab, red, red)) {
796
- border-color: color-mix(in oklab, var(--color-zinc-900) 5%, transparent);
797
- }
798
- }
799
845
  .bg-background {
800
846
  background-color: var(--background);
801
847
  }
@@ -808,9 +854,18 @@
808
854
  background-color: color-mix(in oklab, var(--color-black) 50%, transparent);
809
855
  }
810
856
  }
857
+ .bg-border {
858
+ background-color: var(--border);
859
+ }
811
860
  .bg-nsw-grey-50 {
812
861
  background-color: var(--color-nsw-grey-50);
813
862
  }
863
+ .bg-nsw-grey-100 {
864
+ background-color: var(--color-nsw-grey-100);
865
+ }
866
+ .bg-nsw-grey-200 {
867
+ background-color: var(--color-nsw-grey-200);
868
+ }
814
869
  .bg-nsw-grey-600 {
815
870
  background-color: var(--color-nsw-grey-600);
816
871
  }
@@ -835,7 +890,12 @@
835
890
  }
836
891
  .from-nsw-grey-600 {
837
892
  --tw-gradient-from: var(--color-nsw-grey-600);
838
- --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
893
+ --tw-gradient-stops: var(
894
+ --tw-gradient-via-stops,
895
+ var(--tw-gradient-position),
896
+ var(--tw-gradient-from) var(--tw-gradient-from-position),
897
+ var(--tw-gradient-to) var(--tw-gradient-to-position)
898
+ );
839
899
  }
840
900
  .fill-current {
841
901
  fill: currentcolor;
@@ -846,14 +906,20 @@
846
906
  .fill-nsw-grey-600 {
847
907
  fill: var(--color-nsw-grey-600);
848
908
  }
909
+ .fill-nsw-grey-700 {
910
+ fill: var(--color-nsw-grey-700);
911
+ }
849
912
  .fill-nsw-red-600 {
850
913
  fill: var(--color-nsw-red-600);
851
914
  }
852
915
  .fill-primary {
853
916
  fill: oklch(0.29 0.1173 259.84);
854
917
  }
855
- .fill-zinc-700 {
856
- fill: var(--color-zinc-700);
918
+ .p-0 {
919
+ padding: calc(var(--spacing) * 0);
920
+ }
921
+ .p-1 {
922
+ padding: calc(var(--spacing) * 1);
857
923
  }
858
924
  .p-3 {
859
925
  padding: calc(var(--spacing) * 3);
@@ -861,6 +927,9 @@
861
927
  .p-4 {
862
928
  padding: calc(var(--spacing) * 4);
863
929
  }
930
+ .p-6 {
931
+ padding: calc(var(--spacing) * 6);
932
+ }
864
933
  .p-\[3px\] {
865
934
  padding: 3px;
866
935
  }
@@ -888,6 +957,9 @@
888
957
  .py-0 {
889
958
  padding-block: calc(var(--spacing) * 0);
890
959
  }
960
+ .py-0\.5 {
961
+ padding-block: calc(var(--spacing) * 0.5);
962
+ }
891
963
  .py-1 {
892
964
  padding-block: calc(var(--spacing) * 1);
893
965
  }
@@ -909,6 +981,9 @@
909
981
  .py-16 {
910
982
  padding-block: calc(var(--spacing) * 16);
911
983
  }
984
+ .pt-4 {
985
+ padding-top: calc(var(--spacing) * 4);
986
+ }
912
987
  .pt-6 {
913
988
  padding-top: calc(var(--spacing) * 6);
914
989
  }
@@ -921,6 +996,9 @@
921
996
  .pr-8 {
922
997
  padding-right: calc(var(--spacing) * 8);
923
998
  }
999
+ .pb-4 {
1000
+ padding-bottom: calc(var(--spacing) * 4);
1001
+ }
924
1002
  .pb-16 {
925
1003
  padding-bottom: calc(var(--spacing) * 16);
926
1004
  }
@@ -964,6 +1042,10 @@
964
1042
  font-size: var(--text-base);
965
1043
  line-height: calc(var(--spacing) * 8);
966
1044
  }
1045
+ .text-lg {
1046
+ font-size: var(--text-lg);
1047
+ line-height: var(--tw-leading, var(--text-lg--line-height));
1048
+ }
967
1049
  .text-sm {
968
1050
  font-size: var(--text-sm);
969
1051
  line-height: var(--tw-leading, var(--text-sm--line-height));
@@ -996,6 +1078,12 @@
996
1078
  --tw-tracking: var(--tracking-tight);
997
1079
  letter-spacing: var(--tracking-tight);
998
1080
  }
1081
+ .text-pretty {
1082
+ text-wrap: pretty;
1083
+ }
1084
+ .text-wrap {
1085
+ text-wrap: wrap;
1086
+ }
999
1087
  .whitespace-nowrap {
1000
1088
  white-space: nowrap;
1001
1089
  }
@@ -1011,6 +1099,9 @@
1011
1099
  .text-nsw-blue-800 {
1012
1100
  color: var(--color-nsw-blue-800);
1013
1101
  }
1102
+ .text-nsw-grey-600 {
1103
+ color: var(--color-nsw-grey-600);
1104
+ }
1014
1105
  .text-primary {
1015
1106
  color: oklch(0.29 0.1173 259.84);
1016
1107
  }
@@ -1026,9 +1117,6 @@
1026
1117
  .text-white {
1027
1118
  color: var(--color-white);
1028
1119
  }
1029
- .text-zinc-600 {
1030
- color: var(--color-zinc-600);
1031
- }
1032
1120
  .lowercase {
1033
1121
  text-transform: lowercase;
1034
1122
  }
@@ -1049,35 +1137,59 @@
1049
1137
  opacity: 70%;
1050
1138
  }
1051
1139
  .shadow-lg {
1052
- --tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 4px 6px -4px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
1053
- box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
1140
+ --tw-shadow:
1141
+ 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / 0.1)),
1142
+ 0 4px 6px -4px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
1143
+ box-shadow:
1144
+ var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow),
1145
+ var(--tw-ring-shadow), var(--tw-shadow);
1054
1146
  }
1055
1147
  .shadow-md {
1056
- --tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
1057
- box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
1148
+ --tw-shadow:
1149
+ 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)),
1150
+ 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
1151
+ box-shadow:
1152
+ var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow),
1153
+ var(--tw-ring-shadow), var(--tw-shadow);
1058
1154
  }
1059
1155
  .shadow-none {
1060
1156
  --tw-shadow: 0 0 #0000;
1061
- box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
1157
+ box-shadow:
1158
+ var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow),
1159
+ var(--tw-ring-shadow), var(--tw-shadow);
1062
1160
  }
1063
1161
  .shadow-sm {
1064
- --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
1065
- box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
1162
+ --tw-shadow:
1163
+ 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)),
1164
+ 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
1165
+ box-shadow:
1166
+ var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow),
1167
+ var(--tw-ring-shadow), var(--tw-shadow);
1066
1168
  }
1067
1169
  .shadow-xs {
1068
1170
  --tw-shadow: 0 1px 2px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.05));
1069
- box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
1171
+ box-shadow:
1172
+ var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow),
1173
+ var(--tw-ring-shadow), var(--tw-shadow);
1070
1174
  }
1071
1175
  .shadow-slate-900 {
1072
1176
  --tw-shadow-color: oklch(20.8% 0.042 265.755);
1073
1177
  @supports (color: color-mix(in lab, red, red)) {
1074
- --tw-shadow-color: color-mix(in oklab, var(--color-slate-900) var(--tw-shadow-alpha), transparent);
1178
+ --tw-shadow-color: color-mix(
1179
+ in oklab,
1180
+ var(--color-slate-900) var(--tw-shadow-alpha),
1181
+ transparent
1182
+ );
1075
1183
  }
1076
1184
  }
1077
1185
  .shadow-slate-900\/5 {
1078
1186
  --tw-shadow-color: color-mix(in srgb, oklch(20.8% 0.042 265.755) 5%, transparent);
1079
1187
  @supports (color: color-mix(in lab, red, red)) {
1080
- --tw-shadow-color: color-mix(in oklab, color-mix(in oklab, var(--color-slate-900) 5%, transparent) var(--tw-shadow-alpha), transparent);
1188
+ --tw-shadow-color: color-mix(
1189
+ in oklab,
1190
+ color-mix(in oklab, var(--color-slate-900) 5%, transparent) var(--tw-shadow-alpha),
1191
+ transparent
1192
+ );
1081
1193
  }
1082
1194
  }
1083
1195
  .ring-offset-background {
@@ -1088,16 +1200,41 @@
1088
1200
  outline-width: 1px;
1089
1201
  }
1090
1202
  .backdrop-filter {
1091
- -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
1092
- backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
1203
+ -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,)
1204
+ var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,)
1205
+ var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,)
1206
+ var(--tw-backdrop-sepia,);
1207
+ backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,)
1208
+ var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,)
1209
+ var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,)
1210
+ var(--tw-backdrop-sepia,);
1093
1211
  }
1094
1212
  .transition {
1095
- transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter;
1213
+ transition-property:
1214
+ color,
1215
+ background-color,
1216
+ border-color,
1217
+ outline-color,
1218
+ text-decoration-color,
1219
+ fill,
1220
+ stroke,
1221
+ --tw-gradient-from,
1222
+ --tw-gradient-via,
1223
+ --tw-gradient-to,
1224
+ opacity,
1225
+ box-shadow,
1226
+ transform,
1227
+ translate,
1228
+ scale,
1229
+ rotate,
1230
+ filter,
1231
+ -webkit-backdrop-filter,
1232
+ backdrop-filter;
1096
1233
  transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
1097
1234
  transition-duration: var(--tw-duration, var(--default-transition-duration));
1098
1235
  }
1099
1236
  .transition-\[color\,box-shadow\] {
1100
- transition-property: color,box-shadow;
1237
+ transition-property: color, box-shadow;
1101
1238
  transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
1102
1239
  transition-duration: var(--tw-duration, var(--default-transition-duration));
1103
1240
  }
@@ -1145,25 +1282,25 @@
1145
1282
  .ease-in-out {
1146
1283
  animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
1147
1284
  }
1148
- .group-hover\:fill-zinc-900 {
1285
+ .group-hover\:fill-nsw-grey-900 {
1149
1286
  &:is(:where(.group):hover *) {
1150
1287
  @media (hover: hover) {
1151
- fill: var(--color-zinc-900);
1288
+ fill: var(--color-nsw-grey-900);
1152
1289
  }
1153
1290
  }
1154
1291
  }
1155
1292
  .group-data-\[disabled\=true\]\:pointer-events-none {
1156
- &:is(:where(.group)[data-disabled="true"] *) {
1293
+ &:is(:where(.group)[data-disabled='true'] *) {
1157
1294
  pointer-events: none;
1158
1295
  }
1159
1296
  }
1160
1297
  .group-data-\[disabled\=true\]\:opacity-50 {
1161
- &:is(:where(.group)[data-disabled="true"] *) {
1298
+ &:is(:where(.group)[data-disabled='true'] *) {
1162
1299
  opacity: 50%;
1163
1300
  }
1164
1301
  }
1165
1302
  .group-data-\[state\=open\]\:rotate-90 {
1166
- &:is(:where(.group)[data-state="open"] *) {
1303
+ &:is(:where(.group)[data-state='open'] *) {
1167
1304
  rotate: 90deg;
1168
1305
  }
1169
1306
  }
@@ -1177,9 +1314,9 @@
1177
1314
  opacity: 50%;
1178
1315
  }
1179
1316
  }
1180
- .peer-data-\[state\=checked\]\:border-primary {
1181
- &:is(:where(.peer)[data-state="checked"] ~ *) {
1182
- border-color: oklch(0.29 0.1173 259.84);
1317
+ .peer-data-\[state\=checked\]\:border-nsw-grey-600 {
1318
+ &:is(:where(.peer)[data-state='checked'] ~ *) {
1319
+ border-color: var(--color-nsw-grey-600);
1183
1320
  }
1184
1321
  }
1185
1322
  .hover\:z-10 {
@@ -1206,13 +1343,6 @@
1206
1343
  }
1207
1344
  }
1208
1345
  }
1209
- .hover\:bg-accent {
1210
- &:hover {
1211
- @media (hover: hover) {
1212
- background-color: oklch(0.562 0.2175 20.33);
1213
- }
1214
- }
1215
- }
1216
1346
  .hover\:bg-primary\/10 {
1217
1347
  &:hover {
1218
1348
  @media (hover: hover) {
@@ -1249,6 +1379,13 @@
1249
1379
  }
1250
1380
  }
1251
1381
  }
1382
+ .hover\:text-nsw-grey-600 {
1383
+ &:hover {
1384
+ @media (hover: hover) {
1385
+ color: var(--color-nsw-grey-600);
1386
+ }
1387
+ }
1388
+ }
1252
1389
  .hover\:text-slate-600 {
1253
1390
  &:hover {
1254
1391
  @media (hover: hover) {
@@ -1270,6 +1407,13 @@
1270
1407
  }
1271
1408
  }
1272
1409
  }
1410
+ .hover\:decoration-2 {
1411
+ &:hover {
1412
+ @media (hover: hover) {
1413
+ text-decoration-thickness: 2px;
1414
+ }
1415
+ }
1416
+ }
1273
1417
  .hover\:opacity-100 {
1274
1418
  &:hover {
1275
1419
  @media (hover: hover) {
@@ -1284,14 +1428,18 @@
1284
1428
  }
1285
1429
  .focus\:ring-2 {
1286
1430
  &:focus {
1287
- --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
1288
- box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
1431
+ --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width))
1432
+ var(--tw-ring-color, currentcolor);
1433
+ box-shadow:
1434
+ var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow),
1435
+ var(--tw-ring-shadow), var(--tw-shadow);
1289
1436
  }
1290
1437
  }
1291
1438
  .focus\:ring-offset-2 {
1292
1439
  &:focus {
1293
1440
  --tw-ring-offset-width: 2px;
1294
- --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
1441
+ --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width)
1442
+ var(--tw-ring-offset-color);
1295
1443
  }
1296
1444
  }
1297
1445
  .focus\:outline-hidden {
@@ -1311,8 +1459,11 @@
1311
1459
  }
1312
1460
  .focus-visible\:ring-\[3px\] {
1313
1461
  &:focus-visible {
1314
- --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
1315
- box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
1462
+ --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(3px + var(--tw-ring-offset-width))
1463
+ var(--tw-ring-color, currentcolor);
1464
+ box-shadow:
1465
+ var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow),
1466
+ var(--tw-ring-shadow), var(--tw-shadow);
1316
1467
  }
1317
1468
  }
1318
1469
  .focus-visible\:outline-1 {
@@ -1337,44 +1488,68 @@
1337
1488
  }
1338
1489
  }
1339
1490
  .has-data-\[slot\=card-action\]\:grid-cols-\[1fr_auto\] {
1340
- &:has(*[data-slot="card-action"]) {
1491
+ &:has(*[data-slot='card-action']) {
1341
1492
  grid-template-columns: 1fr auto;
1342
1493
  }
1343
1494
  }
1344
1495
  .has-\[\>svg\]\:px-2\.5 {
1345
- &:has(>svg) {
1496
+ &:has(> svg) {
1346
1497
  padding-inline: calc(var(--spacing) * 2.5);
1347
1498
  }
1348
1499
  }
1349
1500
  .has-\[\>svg\]\:px-3 {
1350
- &:has(>svg) {
1501
+ &:has(> svg) {
1351
1502
  padding-inline: calc(var(--spacing) * 3);
1352
1503
  }
1353
1504
  }
1354
1505
  .has-\[\>svg\]\:px-4 {
1355
- &:has(>svg) {
1506
+ &:has(> svg) {
1356
1507
  padding-inline: calc(var(--spacing) * 4);
1357
1508
  }
1358
1509
  }
1510
+ .data-\[orientation\=horizontal\]\:h-px {
1511
+ &[data-orientation='horizontal'] {
1512
+ height: 1px;
1513
+ }
1514
+ }
1515
+ .data-\[orientation\=horizontal\]\:w-full {
1516
+ &[data-orientation='horizontal'] {
1517
+ width: 100%;
1518
+ }
1519
+ }
1520
+ .data-\[orientation\=vertical\]\:h-full {
1521
+ &[data-orientation='vertical'] {
1522
+ height: 100%;
1523
+ }
1524
+ }
1525
+ .data-\[orientation\=vertical\]\:w-px {
1526
+ &[data-orientation='vertical'] {
1527
+ width: 1px;
1528
+ }
1529
+ }
1359
1530
  .data-\[state\=active\]\:bg-background {
1360
- &[data-state="active"] {
1531
+ &[data-state='active'] {
1361
1532
  background-color: var(--background);
1362
1533
  }
1363
1534
  }
1364
1535
  .data-\[state\=active\]\:shadow-sm {
1365
- &[data-state="active"] {
1366
- --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
1367
- box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
1536
+ &[data-state='active'] {
1537
+ --tw-shadow:
1538
+ 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)),
1539
+ 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
1540
+ box-shadow:
1541
+ var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow),
1542
+ var(--tw-ring-shadow), var(--tw-shadow);
1368
1543
  }
1369
1544
  }
1370
1545
  .data-\[state\=closed\]\:duration-300 {
1371
- &[data-state="closed"] {
1546
+ &[data-state='closed'] {
1372
1547
  --tw-duration: 300ms;
1373
1548
  transition-duration: 300ms;
1374
1549
  }
1375
1550
  }
1376
1551
  .data-\[state\=closed\]\:animate-out {
1377
- &[data-state="closed"] {
1552
+ &[data-state='closed'] {
1378
1553
  animation-name: exit;
1379
1554
  animation-duration: 150ms;
1380
1555
  --tw-exit-opacity: initial;
@@ -1385,58 +1560,58 @@
1385
1560
  }
1386
1561
  }
1387
1562
  .data-\[state\=closed\]\:duration-300 {
1388
- &[data-state="closed"] {
1563
+ &[data-state='closed'] {
1389
1564
  animation-duration: 300ms;
1390
1565
  }
1391
1566
  }
1392
1567
  .data-\[state\=closed\]\:fade-out-0 {
1393
- &[data-state="closed"] {
1568
+ &[data-state='closed'] {
1394
1569
  --tw-exit-opacity: 0;
1395
1570
  }
1396
1571
  }
1397
1572
  .data-\[state\=closed\]\:slide-out-to-bottom {
1398
- &[data-state="closed"] {
1573
+ &[data-state='closed'] {
1399
1574
  --tw-exit-translate-y: 100%;
1400
1575
  }
1401
1576
  }
1402
1577
  .data-\[state\=closed\]\:slide-out-to-left {
1403
- &[data-state="closed"] {
1578
+ &[data-state='closed'] {
1404
1579
  --tw-exit-translate-x: -100%;
1405
1580
  }
1406
1581
  }
1407
1582
  .data-\[state\=closed\]\:slide-out-to-right {
1408
- &[data-state="closed"] {
1583
+ &[data-state='closed'] {
1409
1584
  --tw-exit-translate-x: 100%;
1410
1585
  }
1411
1586
  }
1412
1587
  .data-\[state\=closed\]\:slide-out-to-top {
1413
- &[data-state="closed"] {
1588
+ &[data-state='closed'] {
1414
1589
  --tw-exit-translate-y: -100%;
1415
1590
  }
1416
1591
  }
1417
1592
  .data-\[state\=on\]\:bg-primary\/10 {
1418
- &[data-state="on"] {
1593
+ &[data-state='on'] {
1419
1594
  background-color: color-mix(in oklab, oklch(0.29 0.1173 259.84) 10%, transparent);
1420
1595
  }
1421
1596
  }
1422
1597
  .data-\[state\=on\]\:text-foreground {
1423
- &[data-state="on"] {
1598
+ &[data-state='on'] {
1424
1599
  color: var(--foreground);
1425
1600
  }
1426
1601
  }
1427
1602
  .data-\[state\=open\]\:bg-secondary {
1428
- &[data-state="open"] {
1603
+ &[data-state='open'] {
1429
1604
  background-color: oklch(0.9267 0.0417 227.89);
1430
1605
  }
1431
1606
  }
1432
1607
  .data-\[state\=open\]\:duration-500 {
1433
- &[data-state="open"] {
1608
+ &[data-state='open'] {
1434
1609
  --tw-duration: 500ms;
1435
1610
  transition-duration: 500ms;
1436
1611
  }
1437
1612
  }
1438
1613
  .data-\[state\=open\]\:animate-in {
1439
- &[data-state="open"] {
1614
+ &[data-state='open'] {
1440
1615
  animation-name: enter;
1441
1616
  animation-duration: 150ms;
1442
1617
  --tw-enter-opacity: initial;
@@ -1447,45 +1622,47 @@
1447
1622
  }
1448
1623
  }
1449
1624
  .data-\[state\=open\]\:duration-500 {
1450
- &[data-state="open"] {
1625
+ &[data-state='open'] {
1451
1626
  animation-duration: 500ms;
1452
1627
  }
1453
1628
  }
1454
1629
  .data-\[state\=open\]\:fade-in-0 {
1455
- &[data-state="open"] {
1630
+ &[data-state='open'] {
1456
1631
  --tw-enter-opacity: 0;
1457
1632
  }
1458
1633
  }
1459
1634
  .data-\[state\=open\]\:slide-in-from-bottom {
1460
- &[data-state="open"] {
1635
+ &[data-state='open'] {
1461
1636
  --tw-enter-translate-y: 100%;
1462
1637
  }
1463
1638
  }
1464
1639
  .data-\[state\=open\]\:slide-in-from-left {
1465
- &[data-state="open"] {
1640
+ &[data-state='open'] {
1466
1641
  --tw-enter-translate-x: -100%;
1467
1642
  }
1468
1643
  }
1469
1644
  .data-\[state\=open\]\:slide-in-from-right {
1470
- &[data-state="open"] {
1645
+ &[data-state='open'] {
1471
1646
  --tw-enter-translate-x: 100%;
1472
1647
  }
1473
1648
  }
1474
1649
  .data-\[state\=open\]\:slide-in-from-top {
1475
- &[data-state="open"] {
1650
+ &[data-state='open'] {
1476
1651
  --tw-enter-translate-y: -100%;
1477
1652
  }
1478
1653
  }
1479
1654
  .data-\[variant\=outline\]\:border-l {
1480
- &[data-variant="outline"] {
1655
+ &[data-variant='outline'] {
1481
1656
  border-left-style: var(--tw-border-style);
1482
1657
  border-left-width: 1px;
1483
1658
  }
1484
1659
  }
1485
1660
  .data-\[variant\=outline\]\:shadow-xs {
1486
- &[data-variant="outline"] {
1661
+ &[data-variant='outline'] {
1487
1662
  --tw-shadow: 0 1px 2px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.05));
1488
- box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
1663
+ box-shadow:
1664
+ var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow),
1665
+ var(--tw-ring-shadow), var(--tw-shadow);
1489
1666
  }
1490
1667
  }
1491
1668
  .sm\:mr-8 {
@@ -1599,14 +1776,9 @@
1599
1776
  height: calc(var(--spacing) * 14);
1600
1777
  }
1601
1778
  }
1602
- .lg\:w-96 {
1603
- @media (width >= 64rem) {
1604
- width: calc(var(--spacing) * 96);
1605
- }
1606
- }
1607
- .lg\:max-w-5xl {
1779
+ .lg\:w-80 {
1608
1780
  @media (width >= 64rem) {
1609
- max-width: var(--container-5xl);
1781
+ width: calc(var(--spacing) * 80);
1610
1782
  }
1611
1783
  }
1612
1784
  .lg\:max-w-none {
@@ -1634,6 +1806,16 @@
1634
1806
  grid-template-columns: repeat(5, minmax(0, 1fr));
1635
1807
  }
1636
1808
  }
1809
+ .lg\:justify-end {
1810
+ @media (width >= 64rem) {
1811
+ justify-content: flex-end;
1812
+ }
1813
+ }
1814
+ .lg\:justify-start {
1815
+ @media (width >= 64rem) {
1816
+ justify-content: flex-start;
1817
+ }
1818
+ }
1637
1819
  .lg\:px-8 {
1638
1820
  @media (width >= 64rem) {
1639
1821
  padding-inline: calc(var(--spacing) * 8);
@@ -1644,11 +1826,21 @@
1644
1826
  padding-right: calc(var(--spacing) * 0);
1645
1827
  }
1646
1828
  }
1829
+ .lg\:pr-12 {
1830
+ @media (width >= 64rem) {
1831
+ padding-right: calc(var(--spacing) * 12);
1832
+ }
1833
+ }
1647
1834
  .lg\:pl-8 {
1648
1835
  @media (width >= 64rem) {
1649
1836
  padding-left: calc(var(--spacing) * 8);
1650
1837
  }
1651
1838
  }
1839
+ .lg\:text-left {
1840
+ @media (width >= 64rem) {
1841
+ text-align: left;
1842
+ }
1843
+ }
1652
1844
  .lg\:text-sm {
1653
1845
  @media (width >= 64rem) {
1654
1846
  font-size: var(--text-sm);
@@ -1710,11 +1902,6 @@
1710
1902
  padding-right: calc(var(--spacing) * 6);
1711
1903
  }
1712
1904
  }
1713
- .xl\:pr-16 {
1714
- @media (width >= 80rem) {
1715
- padding-right: calc(var(--spacing) * 16);
1716
- }
1717
- }
1718
1905
  .dark\:block {
1719
1906
  &:where(.dark, .dark *) {
1720
1907
  display: block;
@@ -1807,29 +1994,32 @@
1807
1994
  color: var(--color-white);
1808
1995
  }
1809
1996
  }
1810
- .dark\:text-zinc-400 {
1811
- &:where(.dark, .dark *) {
1812
- color: var(--color-zinc-400);
1813
- }
1814
- }
1815
1997
  .dark\:shadow-none {
1816
1998
  &:where(.dark, .dark *) {
1817
1999
  --tw-shadow: 0 0 #0000;
1818
- box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
2000
+ box-shadow:
2001
+ var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow),
2002
+ var(--tw-ring-shadow), var(--tw-shadow);
1819
2003
  }
1820
2004
  }
1821
2005
  .dark\:backdrop-blur-sm {
1822
2006
  &:where(.dark, .dark *) {
1823
2007
  --tw-backdrop-blur: blur(var(--blur-sm));
1824
- -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
1825
- backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
2008
+ -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,)
2009
+ var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,)
2010
+ var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,)
2011
+ var(--tw-backdrop-sepia,);
2012
+ backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,)
2013
+ var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,)
2014
+ var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,)
2015
+ var(--tw-backdrop-sepia,);
1826
2016
  }
1827
2017
  }
1828
- .dark\:group-hover\:fill-zinc-500 {
2018
+ .dark\:group-hover\:fill-nsw-grey-500 {
1829
2019
  &:where(.dark, .dark *) {
1830
2020
  &:is(:where(.group):hover *) {
1831
2021
  @media (hover: hover) {
1832
- fill: var(--color-zinc-500);
2022
+ fill: var(--color-nsw-grey-500);
1833
2023
  }
1834
2024
  }
1835
2025
  }
@@ -1884,7 +2074,7 @@
1884
2074
  }
1885
2075
  .dark\:data-\[state\=active\]\:text-foreground {
1886
2076
  &:where(.dark, .dark *) {
1887
- &[data-state="active"] {
2077
+ &[data-state='active'] {
1888
2078
  color: var(--foreground);
1889
2079
  }
1890
2080
  }
@@ -1905,9 +2095,9 @@
1905
2095
  height: calc(var(--spacing) * 4);
1906
2096
  }
1907
2097
  }
1908
- .\[\&\:has\(\[data-state\=checked\]\)\]\:border-primary {
1909
- &:has([data-state=checked]) {
1910
- border-color: oklch(0.29 0.1173 259.84);
2098
+ .\[\&\:has\(\[data-state\=checked\]\)\]\:border-nsw-grey-400 {
2099
+ &:has([data-state='checked']) {
2100
+ border-color: var(--color-nsw-grey-400);
1911
2101
  }
1912
2102
  }
1913
2103
  .\[\.border-b\]\:pb-6 {
@@ -1920,9 +2110,20 @@
1920
2110
  padding-top: calc(var(--spacing) * 6);
1921
2111
  }
1922
2112
  }
2113
+ .\[\&\>svg\]\:pointer-events-none {
2114
+ & > svg {
2115
+ pointer-events: none;
2116
+ }
2117
+ }
2118
+ .\[\&\>svg\]\:size-3 {
2119
+ & > svg {
2120
+ width: calc(var(--spacing) * 3);
2121
+ height: calc(var(--spacing) * 3);
2122
+ }
2123
+ }
1923
2124
  .dark\:\[\@supports\(backdrop-filter\:blur\(0\)\)\]\:bg-slate-900\/75 {
1924
2125
  &:where(.dark, .dark *) {
1925
- @supports (backdrop-filter:blur(0)) {
2126
+ @supports (backdrop-filter: blur(0)) {
1926
2127
  background-color: color-mix(in srgb, oklch(20.8% 0.042 265.755) 75%, transparent);
1927
2128
  @supports (color: color-mix(in lab, red, red)) {
1928
2129
  background-color: color-mix(in oklab, var(--color-slate-900) 75%, transparent);
@@ -1930,6 +2131,33 @@
1930
2131
  }
1931
2132
  }
1932
2133
  }
2134
+ .\[a\&\]\:hover\:bg-accent {
2135
+ a& {
2136
+ &:hover {
2137
+ @media (hover: hover) {
2138
+ background-color: oklch(0.562 0.2175 20.33);
2139
+ }
2140
+ }
2141
+ }
2142
+ }
2143
+ .\[a\&\]\:hover\:bg-primary\/90 {
2144
+ a& {
2145
+ &:hover {
2146
+ @media (hover: hover) {
2147
+ background-color: color-mix(in oklab, oklch(0.29 0.1173 259.84) 90%, transparent);
2148
+ }
2149
+ }
2150
+ }
2151
+ }
2152
+ .\[a\&\]\:hover\:bg-secondary\/90 {
2153
+ a& {
2154
+ &:hover {
2155
+ @media (hover: hover) {
2156
+ background-color: color-mix(in oklab, oklch(0.9267 0.0417 227.89) 90%, transparent);
2157
+ }
2158
+ }
2159
+ }
2160
+ }
1933
2161
  }
1934
2162
  :root {
1935
2163
  --background: #ffffff;
@@ -1959,256 +2187,264 @@
1959
2187
  @keyframes enter {
1960
2188
  from {
1961
2189
  opacity: var(--tw-enter-opacity, 1);
1962
- transform: translate3d(var(--tw-enter-translate-x, 0), var(--tw-enter-translate-y, 0), 0) scale3d(var(--tw-enter-scale, 1), var(--tw-enter-scale, 1), var(--tw-enter-scale, 1)) rotate(var(--tw-enter-rotate, 0));
2190
+ transform: translate3d(var(--tw-enter-translate-x, 0), var(--tw-enter-translate-y, 0), 0)
2191
+ scale3d(var(--tw-enter-scale, 1), var(--tw-enter-scale, 1), var(--tw-enter-scale, 1))
2192
+ rotate(var(--tw-enter-rotate, 0));
1963
2193
  }
1964
2194
  }
1965
2195
  @keyframes exit {
1966
2196
  to {
1967
2197
  opacity: var(--tw-exit-opacity, 1);
1968
- transform: translate3d(var(--tw-exit-translate-x, 0), var(--tw-exit-translate-y, 0), 0) scale3d(var(--tw-exit-scale, 1), var(--tw-exit-scale, 1), var(--tw-exit-scale, 1)) rotate(var(--tw-exit-rotate, 0));
2198
+ transform: translate3d(var(--tw-exit-translate-x, 0), var(--tw-exit-translate-y, 0), 0)
2199
+ scale3d(var(--tw-exit-scale, 1), var(--tw-exit-scale, 1), var(--tw-exit-scale, 1))
2200
+ rotate(var(--tw-exit-rotate, 0));
1969
2201
  }
1970
2202
  }
1971
2203
  @property --tw-translate-x {
1972
- syntax: "*";
2204
+ syntax: '*';
1973
2205
  inherits: false;
1974
2206
  initial-value: 0;
1975
2207
  }
1976
2208
  @property --tw-translate-y {
1977
- syntax: "*";
2209
+ syntax: '*';
1978
2210
  inherits: false;
1979
2211
  initial-value: 0;
1980
2212
  }
1981
2213
  @property --tw-translate-z {
1982
- syntax: "*";
2214
+ syntax: '*';
1983
2215
  inherits: false;
1984
2216
  initial-value: 0;
1985
2217
  }
1986
2218
  @property --tw-scale-x {
1987
- syntax: "*";
2219
+ syntax: '*';
1988
2220
  inherits: false;
1989
2221
  initial-value: 1;
1990
2222
  }
1991
2223
  @property --tw-scale-y {
1992
- syntax: "*";
2224
+ syntax: '*';
1993
2225
  inherits: false;
1994
2226
  initial-value: 1;
1995
2227
  }
1996
2228
  @property --tw-scale-z {
1997
- syntax: "*";
2229
+ syntax: '*';
1998
2230
  inherits: false;
1999
2231
  initial-value: 1;
2000
2232
  }
2001
2233
  @property --tw-rotate-x {
2002
- syntax: "*";
2234
+ syntax: '*';
2003
2235
  inherits: false;
2004
2236
  initial-value: rotateX(0);
2005
2237
  }
2006
2238
  @property --tw-rotate-y {
2007
- syntax: "*";
2239
+ syntax: '*';
2008
2240
  inherits: false;
2009
2241
  initial-value: rotateY(0);
2010
2242
  }
2011
2243
  @property --tw-rotate-z {
2012
- syntax: "*";
2244
+ syntax: '*';
2013
2245
  inherits: false;
2014
2246
  initial-value: rotateZ(0);
2015
2247
  }
2016
2248
  @property --tw-skew-x {
2017
- syntax: "*";
2249
+ syntax: '*';
2018
2250
  inherits: false;
2019
2251
  initial-value: skewX(0);
2020
2252
  }
2021
2253
  @property --tw-skew-y {
2022
- syntax: "*";
2254
+ syntax: '*';
2023
2255
  inherits: false;
2024
2256
  initial-value: skewY(0);
2025
2257
  }
2026
2258
  @property --tw-space-y-reverse {
2027
- syntax: "*";
2259
+ syntax: '*';
2028
2260
  inherits: false;
2029
2261
  initial-value: 0;
2030
2262
  }
2031
2263
  @property --tw-space-x-reverse {
2032
- syntax: "*";
2264
+ syntax: '*';
2033
2265
  inherits: false;
2034
2266
  initial-value: 0;
2035
2267
  }
2036
2268
  @property --tw-border-style {
2037
- syntax: "*";
2269
+ syntax: '*';
2038
2270
  inherits: false;
2039
2271
  initial-value: solid;
2040
2272
  }
2041
2273
  @property --tw-gradient-position {
2042
- syntax: "*";
2274
+ syntax: '*';
2043
2275
  inherits: false;
2044
2276
  }
2045
2277
  @property --tw-gradient-from {
2046
- syntax: "<color>";
2278
+ syntax: '<color>';
2047
2279
  inherits: false;
2048
2280
  initial-value: #0000;
2049
2281
  }
2050
2282
  @property --tw-gradient-via {
2051
- syntax: "<color>";
2283
+ syntax: '<color>';
2052
2284
  inherits: false;
2053
2285
  initial-value: #0000;
2054
2286
  }
2055
2287
  @property --tw-gradient-to {
2056
- syntax: "<color>";
2288
+ syntax: '<color>';
2057
2289
  inherits: false;
2058
2290
  initial-value: #0000;
2059
2291
  }
2060
2292
  @property --tw-gradient-stops {
2061
- syntax: "*";
2293
+ syntax: '*';
2062
2294
  inherits: false;
2063
2295
  }
2064
2296
  @property --tw-gradient-via-stops {
2065
- syntax: "*";
2297
+ syntax: '*';
2066
2298
  inherits: false;
2067
2299
  }
2068
2300
  @property --tw-gradient-from-position {
2069
- syntax: "<length-percentage>";
2301
+ syntax: '<length-percentage>';
2070
2302
  inherits: false;
2071
2303
  initial-value: 0%;
2072
2304
  }
2073
2305
  @property --tw-gradient-via-position {
2074
- syntax: "<length-percentage>";
2306
+ syntax: '<length-percentage>';
2075
2307
  inherits: false;
2076
2308
  initial-value: 50%;
2077
2309
  }
2078
2310
  @property --tw-gradient-to-position {
2079
- syntax: "<length-percentage>";
2311
+ syntax: '<length-percentage>';
2080
2312
  inherits: false;
2081
2313
  initial-value: 100%;
2082
2314
  }
2083
2315
  @property --tw-leading {
2084
- syntax: "*";
2316
+ syntax: '*';
2085
2317
  inherits: false;
2086
2318
  }
2087
2319
  @property --tw-font-weight {
2088
- syntax: "*";
2320
+ syntax: '*';
2089
2321
  inherits: false;
2090
2322
  }
2091
2323
  @property --tw-tracking {
2092
- syntax: "*";
2324
+ syntax: '*';
2093
2325
  inherits: false;
2094
2326
  }
2095
2327
  @property --tw-shadow {
2096
- syntax: "*";
2328
+ syntax: '*';
2097
2329
  inherits: false;
2098
2330
  initial-value: 0 0 #0000;
2099
2331
  }
2100
2332
  @property --tw-shadow-color {
2101
- syntax: "*";
2333
+ syntax: '*';
2102
2334
  inherits: false;
2103
2335
  }
2104
2336
  @property --tw-shadow-alpha {
2105
- syntax: "<percentage>";
2337
+ syntax: '<percentage>';
2106
2338
  inherits: false;
2107
2339
  initial-value: 100%;
2108
2340
  }
2109
2341
  @property --tw-inset-shadow {
2110
- syntax: "*";
2342
+ syntax: '*';
2111
2343
  inherits: false;
2112
2344
  initial-value: 0 0 #0000;
2113
2345
  }
2114
2346
  @property --tw-inset-shadow-color {
2115
- syntax: "*";
2347
+ syntax: '*';
2116
2348
  inherits: false;
2117
2349
  }
2118
2350
  @property --tw-inset-shadow-alpha {
2119
- syntax: "<percentage>";
2351
+ syntax: '<percentage>';
2120
2352
  inherits: false;
2121
2353
  initial-value: 100%;
2122
2354
  }
2123
2355
  @property --tw-ring-color {
2124
- syntax: "*";
2356
+ syntax: '*';
2125
2357
  inherits: false;
2126
2358
  }
2127
2359
  @property --tw-ring-shadow {
2128
- syntax: "*";
2360
+ syntax: '*';
2129
2361
  inherits: false;
2130
2362
  initial-value: 0 0 #0000;
2131
2363
  }
2132
2364
  @property --tw-inset-ring-color {
2133
- syntax: "*";
2365
+ syntax: '*';
2134
2366
  inherits: false;
2135
2367
  }
2136
2368
  @property --tw-inset-ring-shadow {
2137
- syntax: "*";
2369
+ syntax: '*';
2138
2370
  inherits: false;
2139
2371
  initial-value: 0 0 #0000;
2140
2372
  }
2141
2373
  @property --tw-ring-inset {
2142
- syntax: "*";
2374
+ syntax: '*';
2143
2375
  inherits: false;
2144
2376
  }
2145
2377
  @property --tw-ring-offset-width {
2146
- syntax: "<length>";
2378
+ syntax: '<length>';
2147
2379
  inherits: false;
2148
2380
  initial-value: 0px;
2149
2381
  }
2150
2382
  @property --tw-ring-offset-color {
2151
- syntax: "*";
2383
+ syntax: '*';
2152
2384
  inherits: false;
2153
2385
  initial-value: #fff;
2154
2386
  }
2155
2387
  @property --tw-ring-offset-shadow {
2156
- syntax: "*";
2388
+ syntax: '*';
2157
2389
  inherits: false;
2158
2390
  initial-value: 0 0 #0000;
2159
2391
  }
2160
2392
  @property --tw-outline-style {
2161
- syntax: "*";
2393
+ syntax: '*';
2162
2394
  inherits: false;
2163
2395
  initial-value: solid;
2164
2396
  }
2165
2397
  @property --tw-backdrop-blur {
2166
- syntax: "*";
2398
+ syntax: '*';
2167
2399
  inherits: false;
2168
2400
  }
2169
2401
  @property --tw-backdrop-brightness {
2170
- syntax: "*";
2402
+ syntax: '*';
2171
2403
  inherits: false;
2172
2404
  }
2173
2405
  @property --tw-backdrop-contrast {
2174
- syntax: "*";
2406
+ syntax: '*';
2175
2407
  inherits: false;
2176
2408
  }
2177
2409
  @property --tw-backdrop-grayscale {
2178
- syntax: "*";
2410
+ syntax: '*';
2179
2411
  inherits: false;
2180
2412
  }
2181
2413
  @property --tw-backdrop-hue-rotate {
2182
- syntax: "*";
2414
+ syntax: '*';
2183
2415
  inherits: false;
2184
2416
  }
2185
2417
  @property --tw-backdrop-invert {
2186
- syntax: "*";
2418
+ syntax: '*';
2187
2419
  inherits: false;
2188
2420
  }
2189
2421
  @property --tw-backdrop-opacity {
2190
- syntax: "*";
2422
+ syntax: '*';
2191
2423
  inherits: false;
2192
2424
  }
2193
2425
  @property --tw-backdrop-saturate {
2194
- syntax: "*";
2426
+ syntax: '*';
2195
2427
  inherits: false;
2196
2428
  }
2197
2429
  @property --tw-backdrop-sepia {
2198
- syntax: "*";
2430
+ syntax: '*';
2199
2431
  inherits: false;
2200
2432
  }
2201
2433
  @property --tw-duration {
2202
- syntax: "*";
2434
+ syntax: '*';
2203
2435
  inherits: false;
2204
2436
  }
2205
2437
  @property --tw-ease {
2206
- syntax: "*";
2438
+ syntax: '*';
2207
2439
  inherits: false;
2208
2440
  }
2209
2441
  @layer properties {
2210
- @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
2211
- *, ::before, ::after, ::backdrop {
2442
+ @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or
2443
+ ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
2444
+ *,
2445
+ ::before,
2446
+ ::after,
2447
+ ::backdrop {
2212
2448
  --tw-translate-x: 0;
2213
2449
  --tw-translate-y: 0;
2214
2450
  --tw-translate-z: 0;