singularity-components 0.1.103 → 0.1.105

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.
@@ -0,0 +1,1876 @@
1
+ /* src/tailwind.css */
2
+ @layer properties;
3
+ :root {
4
+ --sg-black: 0 0% 15%;
5
+ --sg-black-muted: 0 0% 45%;
6
+ --sg-black-accent: 30 10% 18%;
7
+ --sg-white: 30 20% 98%;
8
+ --sg-white-muted: 30 8% 85%;
9
+ --sg-white-accent: 210 12% 96%;
10
+ --sg-pink: 330 90% 65%;
11
+ --sg-gray-light: 240 5% 96%;
12
+ --sg-gray: 240 4% 46%;
13
+ --sg-gray-dark: 240 6% 10%;
14
+ --sg-blue-light: 212 95% 95%;
15
+ --sg-blue: 212 95% 53%;
16
+ --sg-blue-dark: 212 95% 33%;
17
+ --sg-blue-foreground: 0 0% 100%;
18
+ --sg-green-light: 142 76% 95%;
19
+ --sg-green: 142 76% 42%;
20
+ --sg-green-dark: 142 76% 22%;
21
+ --sg-green-foreground: 0 0% 100%;
22
+ --sg-orange-light: 24 95% 95%;
23
+ --sg-orange: 24 95% 53%;
24
+ --sg-orange-dark: 24 95% 33%;
25
+ --sg-orange-foreground: 0 0% 100%;
26
+ --sg-red-light: 0 72% 95%;
27
+ --sg-red: 0 72% 51%;
28
+ --sg-red-dark: 0 72% 31%;
29
+ --sg-red-foreground: 0 0% 100%;
30
+ --sg-primary-light: 220 90% 70%;
31
+ --sg-primary: 220 90% 50%;
32
+ --sg-primary-dark: 220 90% 30%;
33
+ --sg-primary-foreground: 0 0% 100%;
34
+ --sg-secondary-light: 30 90% 70%;
35
+ --sg-secondary: 30 90% 50%;
36
+ --sg-secondary-dark: 30 90% 30%;
37
+ --sg-secondary-foreground: 0 0% 100%;
38
+ --sg-spacing-1: 0.25rem;
39
+ --sg-spacing-2: 0.5rem;
40
+ --sg-spacing-3: 0.75rem;
41
+ --sg-spacing-4: 1rem;
42
+ --sg-spacing-6: 1.5rem;
43
+ --sg-spacing-8: 2rem;
44
+ --sg-spacing-12: 3rem;
45
+ --sg-spacing-16: 4rem;
46
+ --sg-spacing-20: 5rem;
47
+ --sg-spacing-24: 6rem;
48
+ --sg-spacing-28: 7rem;
49
+ --sg-spacing-32: 8rem;
50
+ --sg-spacing-36: 9rem;
51
+ --sg-spacing-40: 10rem;
52
+ }
53
+ @layer theme, base, components, utilities;
54
+ @layer theme {
55
+ :root,
56
+ :host {
57
+ --sg-spacing: 0.25rem;
58
+ --sg-container-2xl: 42rem;
59
+ --sg-container-4xl: 56rem;
60
+ --sg-text-xs: 0.75rem;
61
+ --sg-text-xs--line-height: calc(1 / 0.75);
62
+ --sg-text-sm: 0.875rem;
63
+ --sg-text-sm--line-height: calc(1.25 / 0.875);
64
+ --sg-text-base: 1rem;
65
+ --sg-text-base--line-height: calc(1.5 / 1);
66
+ --sg-text-lg: 1.125rem;
67
+ --sg-text-lg--line-height: calc(1.75 / 1.125);
68
+ --sg-text-xl: 1.25rem;
69
+ --sg-text-xl--line-height: calc(1.75 / 1.25);
70
+ --sg-text-2xl: 1.5rem;
71
+ --sg-text-2xl--line-height: calc(2 / 1.5);
72
+ --sg-text-3xl: 1.875rem;
73
+ --sg-text-3xl--line-height: calc(2.25 / 1.875);
74
+ --sg-text-4xl: 2.25rem;
75
+ --sg-text-4xl--line-height: calc(2.5 / 2.25);
76
+ --sg-text-5xl: 3rem;
77
+ --sg-text-5xl--line-height: 1;
78
+ --sg-font-weight-normal: 400;
79
+ --sg-font-weight-medium: 500;
80
+ --sg-font-weight-semibold: 600;
81
+ --sg-font-weight-bold: 700;
82
+ --sg-tracking-tight: -0.025em;
83
+ --sg-leading-relaxed: 1.625;
84
+ --sg-radius-2xl: 1rem;
85
+ --sg-animate-spin: spin 1s linear infinite;
86
+ --sg-animate-pulse: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
87
+ --sg-default-transition-duration: 150ms;
88
+ --sg-default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
89
+ --sg-default-font-family: Inter;
90
+ --sg-default-mono-font-family: "JetBrains Mono";
91
+ --sg-color-black: hsl(var(--sg-black));
92
+ --sg-color-white: hsl(var(--sg-white));
93
+ --sg-color-background: hsl(var(--sg-color-background));
94
+ --sg-color-foreground: hsl(var(--sg-color-foreground));
95
+ --sg-color-muted-foreground: hsl(var(--sg-color-muted-foreground));
96
+ }
97
+ }
98
+ @layer base {
99
+ *,
100
+ ::after,
101
+ ::before,
102
+ ::backdrop,
103
+ ::file-selector-button {
104
+ box-sizing: border-box;
105
+ margin: 0;
106
+ padding: 0;
107
+ border: 0 solid;
108
+ }
109
+ html,
110
+ :host {
111
+ line-height: 1.5;
112
+ -webkit-text-size-adjust: 100%;
113
+ tab-size: 4;
114
+ font-family: var(--sg-default-font-family, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");
115
+ font-feature-settings: var(--sg-default-font-feature-settings, normal);
116
+ font-variation-settings: var(--sg-default-font-variation-settings, normal);
117
+ -webkit-tap-highlight-color: transparent;
118
+ }
119
+ hr {
120
+ height: 0;
121
+ color: inherit;
122
+ border-top-width: 1px;
123
+ }
124
+ abbr:where([title]) {
125
+ -webkit-text-decoration: underline dotted;
126
+ text-decoration: underline dotted;
127
+ }
128
+ h1,
129
+ h2,
130
+ h3,
131
+ h4,
132
+ h5,
133
+ h6 {
134
+ font-size: inherit;
135
+ font-weight: inherit;
136
+ }
137
+ a {
138
+ color: inherit;
139
+ -webkit-text-decoration: inherit;
140
+ text-decoration: inherit;
141
+ }
142
+ b,
143
+ strong {
144
+ font-weight: bolder;
145
+ }
146
+ code,
147
+ kbd,
148
+ samp,
149
+ pre {
150
+ font-family: var(--sg-default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);
151
+ font-feature-settings: var(--sg-default-mono-font-feature-settings, normal);
152
+ font-variation-settings: var(--sg-default-mono-font-variation-settings, normal);
153
+ font-size: 1em;
154
+ }
155
+ small {
156
+ font-size: 80%;
157
+ }
158
+ sub,
159
+ sup {
160
+ font-size: 75%;
161
+ line-height: 0;
162
+ position: relative;
163
+ vertical-align: baseline;
164
+ }
165
+ sub {
166
+ bottom: -0.25em;
167
+ }
168
+ sup {
169
+ top: -0.5em;
170
+ }
171
+ table {
172
+ text-indent: 0;
173
+ border-color: inherit;
174
+ border-collapse: collapse;
175
+ }
176
+ :-moz-focusring {
177
+ outline: auto;
178
+ }
179
+ progress {
180
+ vertical-align: baseline;
181
+ }
182
+ summary {
183
+ display: list-item;
184
+ }
185
+ ol,
186
+ ul,
187
+ menu {
188
+ list-style: none;
189
+ }
190
+ img,
191
+ svg,
192
+ video,
193
+ canvas,
194
+ audio,
195
+ iframe,
196
+ embed,
197
+ object {
198
+ display: block;
199
+ vertical-align: middle;
200
+ }
201
+ img,
202
+ video {
203
+ max-width: 100%;
204
+ height: auto;
205
+ }
206
+ button,
207
+ input,
208
+ select,
209
+ optgroup,
210
+ textarea,
211
+ ::file-selector-button {
212
+ font: inherit;
213
+ font-feature-settings: inherit;
214
+ font-variation-settings: inherit;
215
+ letter-spacing: inherit;
216
+ color: inherit;
217
+ border-radius: 0;
218
+ background-color: transparent;
219
+ opacity: 1;
220
+ }
221
+ :where(select:is([multiple], [size])) optgroup {
222
+ font-weight: bolder;
223
+ }
224
+ :where(select:is([multiple], [size])) optgroup option {
225
+ padding-inline-start: 20px;
226
+ }
227
+ ::file-selector-button {
228
+ margin-inline-end: 4px;
229
+ }
230
+ ::placeholder {
231
+ opacity: 1;
232
+ }
233
+ @supports (not (-webkit-appearance: -apple-pay-button)) or (contain-intrinsic-size: 1px) {
234
+ ::placeholder {
235
+ color: currentcolor;
236
+ @supports (color: color-mix(in lab, red, red)) {
237
+ color: color-mix(in oklab, currentcolor 50%, transparent);
238
+ }
239
+ }
240
+ }
241
+ textarea {
242
+ resize: vertical;
243
+ }
244
+ ::-webkit-search-decoration {
245
+ -webkit-appearance: none;
246
+ }
247
+ ::-webkit-date-and-time-value {
248
+ min-height: 1lh;
249
+ text-align: inherit;
250
+ }
251
+ ::-webkit-datetime-edit {
252
+ display: inline-flex;
253
+ }
254
+ ::-webkit-datetime-edit-fields-wrapper {
255
+ padding: 0;
256
+ }
257
+ ::-webkit-datetime-edit,
258
+ ::-webkit-datetime-edit-year-field,
259
+ ::-webkit-datetime-edit-month-field,
260
+ ::-webkit-datetime-edit-day-field,
261
+ ::-webkit-datetime-edit-hour-field,
262
+ ::-webkit-datetime-edit-minute-field,
263
+ ::-webkit-datetime-edit-second-field,
264
+ ::-webkit-datetime-edit-millisecond-field,
265
+ ::-webkit-datetime-edit-meridiem-field {
266
+ padding-block: 0;
267
+ }
268
+ ::-webkit-calendar-picker-indicator {
269
+ line-height: 1;
270
+ }
271
+ :-moz-ui-invalid {
272
+ box-shadow: none;
273
+ }
274
+ button,
275
+ input:where([type=button], [type=reset], [type=submit]),
276
+ ::file-selector-button {
277
+ appearance: button;
278
+ }
279
+ ::-webkit-inner-spin-button,
280
+ ::-webkit-outer-spin-button {
281
+ height: auto;
282
+ }
283
+ [hidden]:where(:not([hidden=until-found])) {
284
+ display: none !important;
285
+ }
286
+ }
287
+ @layer utilities {
288
+ .sg\:pointer-events-none {
289
+ pointer-events: none;
290
+ }
291
+ .sg\:absolute {
292
+ position: absolute;
293
+ }
294
+ .sg\:relative {
295
+ position: relative;
296
+ }
297
+ .sg\:inset-0 {
298
+ inset: calc(var(--sg-spacing) * 0);
299
+ }
300
+ .sg\:inset-\[18\%\] {
301
+ inset: 18%;
302
+ }
303
+ .sg\:top-4 {
304
+ top: calc(var(--sg-spacing) * 4);
305
+ }
306
+ .sg\:left-4 {
307
+ left: calc(var(--sg-spacing) * 4);
308
+ }
309
+ .sg\:z-10 {
310
+ z-index: 10;
311
+ }
312
+ .sg\:col-start-2 {
313
+ grid-column-start: 2;
314
+ }
315
+ .sg\:mx-auto {
316
+ margin-inline: auto;
317
+ }
318
+ .sg\:my-4 {
319
+ margin-block: calc(var(--sg-spacing) * 4);
320
+ }
321
+ .sg\:mt-4 {
322
+ margin-top: calc(var(--sg-spacing) * 4);
323
+ }
324
+ .sg\:mt-12 {
325
+ margin-top: calc(var(--sg-spacing) * 12);
326
+ }
327
+ .sg\:mt-auto {
328
+ margin-top: auto;
329
+ }
330
+ .sg\:mb-2 {
331
+ margin-bottom: calc(var(--sg-spacing) * 2);
332
+ }
333
+ .sg\:mb-3 {
334
+ margin-bottom: calc(var(--sg-spacing) * 3);
335
+ }
336
+ .sg\:mb-4 {
337
+ margin-bottom: calc(var(--sg-spacing) * 4);
338
+ }
339
+ .sg\:mb-6 {
340
+ margin-bottom: calc(var(--sg-spacing) * 6);
341
+ }
342
+ .sg\:mb-8 {
343
+ margin-bottom: calc(var(--sg-spacing) * 8);
344
+ }
345
+ .sg\:ml-2 {
346
+ margin-left: calc(var(--sg-spacing) * 2);
347
+ }
348
+ .sg\:line-clamp-1 {
349
+ overflow: hidden;
350
+ display: -webkit-box;
351
+ -webkit-box-orient: vertical;
352
+ -webkit-line-clamp: 1;
353
+ }
354
+ .sg\:flex {
355
+ display: flex;
356
+ }
357
+ .sg\:grid {
358
+ display: grid;
359
+ }
360
+ .sg\:inline-block {
361
+ display: inline-block;
362
+ }
363
+ .sg\:inline-flex {
364
+ display: inline-flex;
365
+ }
366
+ .sg\:aspect-\[16\/7\] {
367
+ aspect-ratio: 16/7;
368
+ }
369
+ .sg\:size-2 {
370
+ width: calc(var(--sg-spacing) * 2);
371
+ height: calc(var(--sg-spacing) * 2);
372
+ }
373
+ .sg\:size-4 {
374
+ width: calc(var(--sg-spacing) * 4);
375
+ height: calc(var(--sg-spacing) * 4);
376
+ }
377
+ .sg\:size-9 {
378
+ width: calc(var(--sg-spacing) * 9);
379
+ height: calc(var(--sg-spacing) * 9);
380
+ }
381
+ .sg\:h-4 {
382
+ height: calc(var(--sg-spacing) * 4);
383
+ }
384
+ .sg\:h-5 {
385
+ height: calc(var(--sg-spacing) * 5);
386
+ }
387
+ .sg\:h-8 {
388
+ height: calc(var(--sg-spacing) * 8);
389
+ }
390
+ .sg\:h-9 {
391
+ height: calc(var(--sg-spacing) * 9);
392
+ }
393
+ .sg\:h-10 {
394
+ height: calc(var(--sg-spacing) * 10);
395
+ }
396
+ .sg\:h-12 {
397
+ height: calc(var(--sg-spacing) * 12);
398
+ }
399
+ .sg\:h-48 {
400
+ height: calc(var(--sg-spacing) * 48);
401
+ }
402
+ .sg\:h-\[100px\] {
403
+ height: 100px;
404
+ }
405
+ .sg\:h-full {
406
+ height: 100%;
407
+ }
408
+ .sg\:min-h-4 {
409
+ min-height: calc(var(--sg-spacing) * 4);
410
+ }
411
+ .sg\:w-4 {
412
+ width: calc(var(--sg-spacing) * 4);
413
+ }
414
+ .sg\:w-5 {
415
+ width: calc(var(--sg-spacing) * 5);
416
+ }
417
+ .sg\:w-8 {
418
+ width: calc(var(--sg-spacing) * 8);
419
+ }
420
+ .sg\:w-12 {
421
+ width: calc(var(--sg-spacing) * 12);
422
+ }
423
+ .sg\:w-\[100px\] {
424
+ width: 100px;
425
+ }
426
+ .sg\:w-fit {
427
+ width: fit-content;
428
+ }
429
+ .sg\:w-full {
430
+ width: 100%;
431
+ }
432
+ .sg\:max-w-2xl {
433
+ max-width: var(--sg-container-2xl);
434
+ }
435
+ .sg\:max-w-4xl {
436
+ max-width: var(--sg-container-4xl);
437
+ }
438
+ .sg\:max-w-\[768px\] {
439
+ max-width: 768px;
440
+ }
441
+ .sg\:max-w-none {
442
+ max-width: none;
443
+ }
444
+ .sg\:min-w-0 {
445
+ min-width: calc(var(--sg-spacing) * 0);
446
+ }
447
+ .sg\:flex-1 {
448
+ flex: 1;
449
+ }
450
+ .sg\:shrink-0 {
451
+ flex-shrink: 0;
452
+ }
453
+ .sg\:caption-bottom {
454
+ caption-side: bottom;
455
+ }
456
+ .sg\:translate-y-0\.5 {
457
+ --tw-translate-y: calc(var(--sg-spacing) * 0.5);
458
+ translate: var(--tw-translate-x) var(--tw-translate-y);
459
+ }
460
+ .sg\:animate-pulse {
461
+ animation: var(--sg-animate-pulse);
462
+ }
463
+ .sg\:animate-spin {
464
+ animation: var(--sg-animate-spin);
465
+ }
466
+ .sg\:cursor-pointer {
467
+ cursor: pointer;
468
+ }
469
+ .sg\:list-inside {
470
+ list-style-position: inside;
471
+ }
472
+ .sg\:list-decimal {
473
+ list-style-type: decimal;
474
+ }
475
+ .sg\:list-disc {
476
+ list-style-type: disc;
477
+ }
478
+ .sg\:grid-cols-1 {
479
+ grid-template-columns: repeat(1, minmax(0, 1fr));
480
+ }
481
+ .sg\:grid-cols-\[0_1fr\] {
482
+ grid-template-columns: 0 1fr;
483
+ }
484
+ .sg\:flex-col {
485
+ flex-direction: column;
486
+ }
487
+ .sg\:flex-wrap {
488
+ flex-wrap: wrap;
489
+ }
490
+ .sg\:items-center {
491
+ align-items: center;
492
+ }
493
+ .sg\:items-start {
494
+ align-items: flex-start;
495
+ }
496
+ .sg\:justify-between {
497
+ justify-content: space-between;
498
+ }
499
+ .sg\:justify-center {
500
+ justify-content: center;
501
+ }
502
+ .sg\:justify-items-start {
503
+ justify-items: start;
504
+ }
505
+ .sg\:gap-1 {
506
+ gap: calc(var(--sg-spacing) * 1);
507
+ }
508
+ .sg\:gap-1\.5 {
509
+ gap: calc(var(--sg-spacing) * 1.5);
510
+ }
511
+ .sg\:gap-2 {
512
+ gap: calc(var(--sg-spacing) * 2);
513
+ }
514
+ .sg\:gap-3 {
515
+ gap: calc(var(--sg-spacing) * 3);
516
+ }
517
+ .sg\:gap-4 {
518
+ gap: calc(var(--sg-spacing) * 4);
519
+ }
520
+ .sg\:gap-5 {
521
+ gap: calc(var(--sg-spacing) * 5);
522
+ }
523
+ .sg\:gap-6 {
524
+ gap: calc(var(--sg-spacing) * 6);
525
+ }
526
+ .sg\:gap-7 {
527
+ gap: calc(var(--sg-spacing) * 7);
528
+ }
529
+ .sg\:gap-8 {
530
+ gap: calc(var(--sg-spacing) * 8);
531
+ }
532
+ .sg\:gap-9 {
533
+ gap: calc(var(--sg-spacing) * 9);
534
+ }
535
+ .sg\:gap-10 {
536
+ gap: calc(var(--sg-spacing) * 10);
537
+ }
538
+ .sg\:space-y-1\.5 {
539
+ :where(& > :not(:last-child)) {
540
+ --tw-space-y-reverse: 0;
541
+ margin-block-start: calc(calc(var(--sg-spacing) * 1.5) * var(--tw-space-y-reverse));
542
+ margin-block-end: calc(calc(var(--sg-spacing) * 1.5) * calc(1 - var(--tw-space-y-reverse)));
543
+ }
544
+ }
545
+ .sg\:space-y-2 {
546
+ :where(& > :not(:last-child)) {
547
+ --tw-space-y-reverse: 0;
548
+ margin-block-start: calc(calc(var(--sg-spacing) * 2) * var(--tw-space-y-reverse));
549
+ margin-block-end: calc(calc(var(--sg-spacing) * 2) * calc(1 - var(--tw-space-y-reverse)));
550
+ }
551
+ }
552
+ .sg\:space-y-6 {
553
+ :where(& > :not(:last-child)) {
554
+ --tw-space-y-reverse: 0;
555
+ margin-block-start: calc(calc(var(--sg-spacing) * 6) * var(--tw-space-y-reverse));
556
+ margin-block-end: calc(calc(var(--sg-spacing) * 6) * calc(1 - var(--tw-space-y-reverse)));
557
+ }
558
+ }
559
+ .sg\:gap-y-0\.5 {
560
+ row-gap: calc(var(--sg-spacing) * 0.5);
561
+ }
562
+ .sg\:overflow-hidden {
563
+ overflow: hidden;
564
+ }
565
+ .sg\:overflow-x-auto {
566
+ overflow-x: auto;
567
+ }
568
+ .sg\:rounded {
569
+ border-radius: 0.25rem;
570
+ }
571
+ .sg\:rounded-2xl {
572
+ border-radius: var(--sg-radius-2xl);
573
+ }
574
+ .sg\:rounded-full {
575
+ border-radius: calc(infinity * 1px);
576
+ }
577
+ .sg\:rounded-lg {
578
+ border-radius: var(--radius);
579
+ }
580
+ .sg\:rounded-md {
581
+ border-radius: calc(var(--radius) - 2px);
582
+ }
583
+ .sg\:rounded-xl {
584
+ border-radius: calc(var(--radius) + 4px);
585
+ }
586
+ .sg\:border {
587
+ border-style: var(--tw-border-style);
588
+ border-width: 1px;
589
+ }
590
+ .sg\:border-0 {
591
+ border-style: var(--tw-border-style);
592
+ border-width: 0px;
593
+ }
594
+ .sg\:border-t {
595
+ border-top-style: var(--tw-border-style);
596
+ border-top-width: 1px;
597
+ }
598
+ .sg\:border-b {
599
+ border-bottom-style: var(--tw-border-style);
600
+ border-bottom-width: 1px;
601
+ }
602
+ .sg\:border-l-4 {
603
+ border-left-style: var(--tw-border-style);
604
+ border-left-width: 4px;
605
+ }
606
+ .sg\:border-\[hsl\(var\(--sg-primary\)\)\] {
607
+ border-color: hsl(var(--sg-primary));
608
+ }
609
+ .sg\:border-border {
610
+ border-color: hsl(var(--sg-border));
611
+ }
612
+ .sg\:border-input {
613
+ border-color: var(--input);
614
+ }
615
+ .sg\:border-transparent {
616
+ border-color: transparent;
617
+ }
618
+ .sg\:bg-\[hsl\(var\(--sg-gradient-1\)\)\] {
619
+ background-color: hsl(var(--sg-gradient-1));
620
+ }
621
+ .sg\:bg-\[hsl\(var\(--sg-gradient-2\)\)\] {
622
+ background-color: hsl(var(--sg-gradient-2));
623
+ }
624
+ .sg\:bg-accent {
625
+ background-color: hsl(var(--sg-accent));
626
+ }
627
+ .sg\:bg-background {
628
+ background-color: hsl(var(--sg-color-background));
629
+ }
630
+ .sg\:bg-black {
631
+ background-color: hsl(var(--sg-black));
632
+ }
633
+ .sg\:bg-border {
634
+ background-color: hsl(var(--sg-border));
635
+ }
636
+ .sg\:bg-card {
637
+ background-color: var(--card);
638
+ }
639
+ .sg\:bg-destructive {
640
+ background-color: hsl(var(--sg-red));
641
+ }
642
+ .sg\:bg-muted {
643
+ background-color: hsl(var(--sg-color-muted-background));
644
+ }
645
+ .sg\:bg-muted\/50 {
646
+ background-color: hsl(var(--sg-color-muted-background));
647
+ @supports (color: color-mix(in lab, red, red)) {
648
+ background-color: color-mix(in oklab, hsl(var(--sg-color-muted-background)) 50%, transparent);
649
+ }
650
+ }
651
+ .sg\:bg-orange {
652
+ background-color: hsl(var(--sg-orange));
653
+ }
654
+ .sg\:bg-pink {
655
+ background-color: hsl(var(--sg-pink));
656
+ }
657
+ .sg\:bg-primary {
658
+ background-color: hsl(var(--sg-primary));
659
+ }
660
+ .sg\:bg-secondary {
661
+ background-color: hsl(var(--sg-secondary));
662
+ }
663
+ .sg\:bg-transparent {
664
+ background-color: transparent;
665
+ }
666
+ .sg\:bg-white {
667
+ background-color: hsl(var(--sg-white));
668
+ }
669
+ .sg\:bg-gradient-to-br {
670
+ --tw-gradient-position: to bottom right in oklab;
671
+ background-image: linear-gradient(var(--tw-gradient-stops));
672
+ }
673
+ .sg\:bg-gradient-to-r {
674
+ --tw-gradient-position: to right in oklab;
675
+ background-image: linear-gradient(var(--tw-gradient-stops));
676
+ }
677
+ .sg\:bg-gradient-to-t {
678
+ --tw-gradient-position: to top in oklab;
679
+ background-image: linear-gradient(var(--tw-gradient-stops));
680
+ }
681
+ .sg\:bg-\[conic-gradient\(hsl\(var\(--sg-gradient-1\)\)\,hsl\(var\(--sg-gradient-2\)\)\,hsl\(var\(--sg-primary\)\)\,hsl\(var\(--sg-gradient-1\)\)\)\] {
682
+ background-image:
683
+ conic-gradient(
684
+ hsl(var(--sg-gradient-1)),
685
+ hsl(var(--sg-gradient-2)),
686
+ hsl(var(--sg-primary)),
687
+ hsl(var(--sg-gradient-1)));
688
+ }
689
+ .sg\:bg-\[linear-gradient\(135deg\,hsl\(var\(--sg-primary-light\)\)_0\%\,hsl\(var\(--sg-pink\)\)_50\%\,hsl\(var\(--sg-orange\)\)_100\%\)\] {
690
+ background-image:
691
+ linear-gradient(
692
+ 135deg,
693
+ hsl(var(--sg-primary-light)) 0%,
694
+ hsl(var(--sg-pink)) 50%,
695
+ hsl(var(--sg-orange)) 100%);
696
+ }
697
+ .sg\:bg-\[linear-gradient\(135deg\,hsl\(var\(--sg-primary-light\)\/0\.1\)_0\%\,hsl\(var\(--sg-pink\)\/0\.1\)_50\%\,hsl\(var\(--sg-orange\)\/0\.1\)_100\%\)\] {
698
+ background-image:
699
+ linear-gradient(
700
+ 135deg,
701
+ hsl(var(--sg-primary-light)/0.1) 0%,
702
+ hsl(var(--sg-pink)/0.1) 50%,
703
+ hsl(var(--sg-orange)/0.1) 100%);
704
+ }
705
+ .sg\:bg-\[radial-gradient\(1200px_300px_at_10\%_-20\%\,hsl\(var\(--sg-gradient-1\)\/0\.15\)\,transparent\)\,radial-gradient\(800px_200px_at_90\%_-20\%\,hsl\(var\(--sg-gradient-2\)\/0\.15\)\,transparent\)\] {
706
+ background-image:
707
+ radial-gradient(
708
+ 1200px 300px at 10% -20%,
709
+ hsl(var(--sg-gradient-1)/0.15),
710
+ transparent),
711
+ radial-gradient(
712
+ 800px 200px at 90% -20%,
713
+ hsl(var(--sg-gradient-2)/0.15),
714
+ transparent);
715
+ }
716
+ .sg\:from-\[hsl\(var\(--sg-blue\)\)\] {
717
+ --tw-gradient-from: hsl(var(--sg-blue));
718
+ --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));
719
+ }
720
+ .sg\:from-\[hsl\(var\(--sg-pink\)\)\] {
721
+ --tw-gradient-from: hsl(var(--sg-pink));
722
+ --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));
723
+ }
724
+ .sg\:from-\[hsl\(var\(--sg-primary\)\)\] {
725
+ --tw-gradient-from: hsl(var(--sg-primary));
726
+ --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));
727
+ }
728
+ .sg\:from-background {
729
+ --tw-gradient-from: hsl(var(--sg-color-background));
730
+ --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));
731
+ }
732
+ .sg\:from-background\/80 {
733
+ --tw-gradient-from: hsl(var(--sg-color-background));
734
+ @supports (color: color-mix(in lab, red, red)) {
735
+ --tw-gradient-from: color-mix(in oklab, hsl(var(--sg-color-background)) 80%, transparent);
736
+ }
737
+ --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));
738
+ }
739
+ .sg\:via-\[hsl\(var\(--sg-pink\)\)\] {
740
+ --tw-gradient-via: hsl(var(--sg-pink));
741
+ --tw-gradient-via-stops:
742
+ var(--tw-gradient-position),
743
+ var(--tw-gradient-from) var(--tw-gradient-from-position),
744
+ var(--tw-gradient-via) var(--tw-gradient-via-position),
745
+ var(--tw-gradient-to) var(--tw-gradient-to-position);
746
+ --tw-gradient-stops: var(--tw-gradient-via-stops);
747
+ }
748
+ .sg\:via-background\/20 {
749
+ --tw-gradient-via: hsl(var(--sg-color-background));
750
+ @supports (color: color-mix(in lab, red, red)) {
751
+ --tw-gradient-via: color-mix(in oklab, hsl(var(--sg-color-background)) 20%, transparent);
752
+ }
753
+ --tw-gradient-via-stops:
754
+ var(--tw-gradient-position),
755
+ var(--tw-gradient-from) var(--tw-gradient-from-position),
756
+ var(--tw-gradient-via) var(--tw-gradient-via-position),
757
+ var(--tw-gradient-to) var(--tw-gradient-to-position);
758
+ --tw-gradient-stops: var(--tw-gradient-via-stops);
759
+ }
760
+ .sg\:to-\[hsl\(var\(--sg-orange\)\)\] {
761
+ --tw-gradient-to: hsl(var(--sg-orange));
762
+ --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));
763
+ }
764
+ .sg\:to-\[hsl\(var\(--sg-pink\)\)\] {
765
+ --tw-gradient-to: hsl(var(--sg-pink));
766
+ --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));
767
+ }
768
+ .sg\:to-background\/60 {
769
+ --tw-gradient-to: hsl(var(--sg-color-background));
770
+ @supports (color: color-mix(in lab, red, red)) {
771
+ --tw-gradient-to: color-mix(in oklab, hsl(var(--sg-color-background)) 60%, transparent);
772
+ }
773
+ --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));
774
+ }
775
+ .sg\:to-transparent {
776
+ --tw-gradient-to: transparent;
777
+ --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));
778
+ }
779
+ .sg\:bg-clip-text {
780
+ background-clip: text;
781
+ }
782
+ .sg\:object-cover {
783
+ object-fit: cover;
784
+ }
785
+ .sg\:p-2 {
786
+ padding: calc(var(--sg-spacing) * 2);
787
+ }
788
+ .sg\:p-4 {
789
+ padding: calc(var(--sg-spacing) * 4);
790
+ }
791
+ .sg\:p-6 {
792
+ padding: calc(var(--sg-spacing) * 6);
793
+ }
794
+ .sg\:px-1\.5 {
795
+ padding-inline: calc(var(--sg-spacing) * 1.5);
796
+ }
797
+ .sg\:px-2 {
798
+ padding-inline: calc(var(--sg-spacing) * 2);
799
+ }
800
+ .sg\:px-3 {
801
+ padding-inline: calc(var(--sg-spacing) * 3);
802
+ }
803
+ .sg\:px-4 {
804
+ padding-inline: calc(var(--sg-spacing) * 4);
805
+ }
806
+ .sg\:px-6 {
807
+ padding-inline: calc(var(--sg-spacing) * 6);
808
+ }
809
+ .sg\:py-0\.5 {
810
+ padding-block: calc(var(--sg-spacing) * 0.5);
811
+ }
812
+ .sg\:py-1 {
813
+ padding-block: calc(var(--sg-spacing) * 1);
814
+ }
815
+ .sg\:py-2 {
816
+ padding-block: calc(var(--sg-spacing) * 2);
817
+ }
818
+ .sg\:py-3 {
819
+ padding-block: calc(var(--sg-spacing) * 3);
820
+ }
821
+ .sg\:py-4 {
822
+ padding-block: calc(var(--sg-spacing) * 4);
823
+ }
824
+ .sg\:py-8 {
825
+ padding-block: calc(var(--sg-spacing) * 8);
826
+ }
827
+ .sg\:py-12 {
828
+ padding-block: calc(var(--sg-spacing) * 12);
829
+ }
830
+ .sg\:py-20 {
831
+ padding-block: calc(var(--sg-spacing) * 20);
832
+ }
833
+ .sg\:pt-0 {
834
+ padding-top: calc(var(--sg-spacing) * 0);
835
+ }
836
+ .sg\:pb-1 {
837
+ padding-bottom: calc(var(--sg-spacing) * 1);
838
+ }
839
+ .sg\:pb-4 {
840
+ padding-bottom: calc(var(--sg-spacing) * 4);
841
+ }
842
+ .sg\:pl-4 {
843
+ padding-left: calc(var(--sg-spacing) * 4);
844
+ }
845
+ .sg\:text-center {
846
+ text-align: center;
847
+ }
848
+ .sg\:text-left {
849
+ text-align: left;
850
+ }
851
+ .sg\:align-\[-0\.125em\] {
852
+ vertical-align: -0.125em;
853
+ }
854
+ .sg\:align-middle {
855
+ vertical-align: middle;
856
+ }
857
+ .sg\:text-2xl {
858
+ font-size: var(--sg-text-2xl);
859
+ line-height: var(--tw-leading, var(--sg-text-2xl--line-height));
860
+ }
861
+ .sg\:text-3xl {
862
+ font-size: var(--sg-text-3xl);
863
+ line-height: var(--tw-leading, var(--sg-text-3xl--line-height));
864
+ }
865
+ .sg\:text-base {
866
+ font-size: var(--sg-text-base);
867
+ line-height: var(--tw-leading, var(--sg-text-base--line-height));
868
+ }
869
+ .sg\:text-lg {
870
+ font-size: var(--sg-text-lg);
871
+ line-height: var(--tw-leading, var(--sg-text-lg--line-height));
872
+ }
873
+ .sg\:text-sm {
874
+ font-size: var(--sg-text-sm);
875
+ line-height: var(--tw-leading, var(--sg-text-sm--line-height));
876
+ }
877
+ .sg\:text-xl {
878
+ font-size: var(--sg-text-xl);
879
+ line-height: var(--tw-leading, var(--sg-text-xl--line-height));
880
+ }
881
+ .sg\:text-xs {
882
+ font-size: var(--sg-text-xs);
883
+ line-height: var(--tw-leading, var(--sg-text-xs--line-height));
884
+ }
885
+ .sg\:leading-none {
886
+ --tw-leading: 1;
887
+ line-height: 1;
888
+ }
889
+ .sg\:font-bold {
890
+ --tw-font-weight: var(--sg-font-weight-bold);
891
+ font-weight: var(--sg-font-weight-bold);
892
+ }
893
+ .sg\:font-medium {
894
+ --tw-font-weight: var(--sg-font-weight-medium);
895
+ font-weight: var(--sg-font-weight-medium);
896
+ }
897
+ .sg\:font-normal {
898
+ --tw-font-weight: var(--sg-font-weight-normal);
899
+ font-weight: var(--sg-font-weight-normal);
900
+ }
901
+ .sg\:font-semibold {
902
+ --tw-font-weight: var(--sg-font-weight-semibold);
903
+ font-weight: var(--sg-font-weight-semibold);
904
+ }
905
+ .sg\:tracking-tight {
906
+ --tw-tracking: var(--sg-tracking-tight);
907
+ letter-spacing: var(--sg-tracking-tight);
908
+ }
909
+ .sg\:whitespace-nowrap {
910
+ white-space: nowrap;
911
+ }
912
+ .sg\:text-black {
913
+ color: hsl(var(--sg-black));
914
+ }
915
+ .sg\:text-card-foreground {
916
+ color: var(--card-foreground);
917
+ }
918
+ .sg\:text-destructive {
919
+ color: hsl(var(--sg-red));
920
+ }
921
+ .sg\:text-foreground {
922
+ color: hsl(var(--sg-color-foreground));
923
+ }
924
+ .sg\:text-foreground\/60 {
925
+ color: hsl(var(--sg-color-foreground));
926
+ @supports (color: color-mix(in lab, red, red)) {
927
+ color: color-mix(in oklab, hsl(var(--sg-color-foreground)) 60%, transparent);
928
+ }
929
+ }
930
+ .sg\:text-gray {
931
+ color: hsl(var(--sg-gray));
932
+ }
933
+ .sg\:text-muted-foreground {
934
+ color: hsl(var(--sg-color-muted-foreground));
935
+ }
936
+ .sg\:text-orange {
937
+ color: hsl(var(--sg-orange));
938
+ }
939
+ .sg\:text-pink {
940
+ color: hsl(var(--sg-pink));
941
+ }
942
+ .sg\:text-primary {
943
+ color: hsl(var(--sg-primary));
944
+ }
945
+ .sg\:text-primary-foreground {
946
+ color: hsl(var(--sg-primary-foreground));
947
+ }
948
+ .sg\:text-secondary {
949
+ color: hsl(var(--sg-secondary));
950
+ }
951
+ .sg\:text-secondary-foreground {
952
+ color: hsl(var(--sg-secondary-foreground));
953
+ }
954
+ .sg\:text-transparent {
955
+ color: transparent;
956
+ }
957
+ .sg\:text-white {
958
+ color: hsl(var(--sg-white));
959
+ }
960
+ .sg\:italic {
961
+ font-style: italic;
962
+ }
963
+ .sg\:underline-offset-4 {
964
+ text-underline-offset: 4px;
965
+ }
966
+ .sg\:opacity-20 {
967
+ opacity: 20%;
968
+ }
969
+ .sg\:shadow-lg {
970
+ --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));
971
+ box-shadow:
972
+ var(--tw-inset-shadow),
973
+ var(--tw-inset-ring-shadow),
974
+ var(--tw-ring-offset-shadow),
975
+ var(--tw-ring-shadow),
976
+ var(--tw-shadow);
977
+ }
978
+ .sg\:shadow-xs {
979
+ --tw-shadow: 0 1px 2px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.05));
980
+ box-shadow:
981
+ var(--tw-inset-shadow),
982
+ var(--tw-inset-ring-shadow),
983
+ var(--tw-ring-offset-shadow),
984
+ var(--tw-ring-shadow),
985
+ var(--tw-shadow);
986
+ }
987
+ .sg\:ring-1 {
988
+ --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
989
+ box-shadow:
990
+ var(--tw-inset-shadow),
991
+ var(--tw-inset-ring-shadow),
992
+ var(--tw-ring-offset-shadow),
993
+ var(--tw-ring-shadow),
994
+ var(--tw-shadow);
995
+ }
996
+ .sg\:ring-border\/60 {
997
+ --tw-ring-color: hsl(var(--sg-border));
998
+ @supports (color: color-mix(in lab, red, red)) {
999
+ --tw-ring-color: color-mix(in oklab, hsl(var(--sg-border)) 60%, transparent);
1000
+ }
1001
+ }
1002
+ .sg\:ring-gray\/60 {
1003
+ --tw-ring-color: hsl(var(--sg-gray));
1004
+ @supports (color: color-mix(in lab, red, red)) {
1005
+ --tw-ring-color: color-mix(in oklab, hsl(var(--sg-gray)) 60%, transparent);
1006
+ }
1007
+ }
1008
+ .sg\:transition-\[color\,box-shadow\] {
1009
+ transition-property: color, box-shadow;
1010
+ transition-timing-function: var(--tw-ease, var(--sg-default-transition-timing-function));
1011
+ transition-duration: var(--tw-duration, var(--sg-default-transition-duration));
1012
+ }
1013
+ .sg\:transition-all {
1014
+ transition-property: all;
1015
+ transition-timing-function: var(--tw-ease, var(--sg-default-transition-timing-function));
1016
+ transition-duration: var(--tw-duration, var(--sg-default-transition-duration));
1017
+ }
1018
+ .sg\:transition-colors {
1019
+ transition-property:
1020
+ color,
1021
+ background-color,
1022
+ border-color,
1023
+ outline-color,
1024
+ text-decoration-color,
1025
+ fill,
1026
+ stroke,
1027
+ --tw-gradient-from,
1028
+ --tw-gradient-via,
1029
+ --tw-gradient-to;
1030
+ transition-timing-function: var(--tw-ease, var(--sg-default-transition-timing-function));
1031
+ transition-duration: var(--tw-duration, var(--sg-default-transition-duration));
1032
+ }
1033
+ .sg\:transition-opacity {
1034
+ transition-property: opacity;
1035
+ transition-timing-function: var(--tw-ease, var(--sg-default-transition-timing-function));
1036
+ transition-duration: var(--tw-duration, var(--sg-default-transition-duration));
1037
+ }
1038
+ .sg\:transition-transform {
1039
+ transition-property:
1040
+ transform,
1041
+ translate,
1042
+ scale,
1043
+ rotate;
1044
+ transition-timing-function: var(--tw-ease, var(--sg-default-transition-timing-function));
1045
+ transition-duration: var(--tw-duration, var(--sg-default-transition-duration));
1046
+ }
1047
+ .sg\:duration-200 {
1048
+ --tw-duration: 200ms;
1049
+ transition-duration: 200ms;
1050
+ }
1051
+ .sg\:duration-300 {
1052
+ --tw-duration: 300ms;
1053
+ transition-duration: 300ms;
1054
+ }
1055
+ .sg\:duration-500 {
1056
+ --tw-duration: 500ms;
1057
+ transition-duration: 500ms;
1058
+ }
1059
+ .sg\:outline-none {
1060
+ --tw-outline-style: none;
1061
+ outline-style: none;
1062
+ }
1063
+ .sg\:\[mask\:radial-gradient\(farthest-side\,transparent_62\%\,black_63\%\)\] {
1064
+ mask:
1065
+ radial-gradient(
1066
+ farthest-side,
1067
+ transparent 62%,
1068
+ black 63%);
1069
+ }
1070
+ .sg\:duration-200 {
1071
+ animation-duration: 200ms;
1072
+ }
1073
+ .sg\:duration-300 {
1074
+ animation-duration: 300ms;
1075
+ }
1076
+ .sg\:duration-500 {
1077
+ animation-duration: 500ms;
1078
+ }
1079
+ .sg\:group-hover\:scale-105 {
1080
+ &:is(:where(.sg\:group):hover *) {
1081
+ @media (hover: hover) {
1082
+ --tw-scale-x: 105%;
1083
+ --tw-scale-y: 105%;
1084
+ --tw-scale-z: 105%;
1085
+ scale: var(--tw-scale-x) var(--tw-scale-y);
1086
+ }
1087
+ }
1088
+ }
1089
+ .sg\:group-hover\:scale-110 {
1090
+ &:is(:where(.sg\:group):hover *) {
1091
+ @media (hover: hover) {
1092
+ --tw-scale-x: 110%;
1093
+ --tw-scale-y: 110%;
1094
+ --tw-scale-z: 110%;
1095
+ scale: var(--tw-scale-x) var(--tw-scale-y);
1096
+ }
1097
+ }
1098
+ }
1099
+ .sg\:group-hover\:text-\[hsl\(var\(--sg-primary\)\)\] {
1100
+ &:is(:where(.sg\:group):hover *) {
1101
+ @media (hover: hover) {
1102
+ color: hsl(var(--sg-primary));
1103
+ }
1104
+ }
1105
+ }
1106
+ .sg\:group-hover\:opacity-30 {
1107
+ &:is(:where(.sg\:group):hover *) {
1108
+ @media (hover: hover) {
1109
+ opacity: 30%;
1110
+ }
1111
+ }
1112
+ }
1113
+ .sg\:selection\:bg-primary {
1114
+ & *::selection {
1115
+ background-color: hsl(var(--sg-primary));
1116
+ }
1117
+ &::selection {
1118
+ background-color: hsl(var(--sg-primary));
1119
+ }
1120
+ }
1121
+ .sg\:selection\:text-primary-foreground {
1122
+ & *::selection {
1123
+ color: hsl(var(--sg-primary-foreground));
1124
+ }
1125
+ &::selection {
1126
+ color: hsl(var(--sg-primary-foreground));
1127
+ }
1128
+ }
1129
+ .sg\:file\:inline-flex {
1130
+ &::file-selector-button {
1131
+ display: inline-flex;
1132
+ }
1133
+ }
1134
+ .sg\:file\:h-7 {
1135
+ &::file-selector-button {
1136
+ height: calc(var(--sg-spacing) * 7);
1137
+ }
1138
+ }
1139
+ .sg\:file\:border-0 {
1140
+ &::file-selector-button {
1141
+ border-style: var(--tw-border-style);
1142
+ border-width: 0px;
1143
+ }
1144
+ }
1145
+ .sg\:file\:bg-transparent {
1146
+ &::file-selector-button {
1147
+ background-color: transparent;
1148
+ }
1149
+ }
1150
+ .sg\:file\:text-sm {
1151
+ &::file-selector-button {
1152
+ font-size: var(--sg-text-sm);
1153
+ line-height: var(--tw-leading, var(--sg-text-sm--line-height));
1154
+ }
1155
+ }
1156
+ .sg\:file\:font-medium {
1157
+ &::file-selector-button {
1158
+ --tw-font-weight: var(--sg-font-weight-medium);
1159
+ font-weight: var(--sg-font-weight-medium);
1160
+ }
1161
+ }
1162
+ .sg\:file\:text-foreground {
1163
+ &::file-selector-button {
1164
+ color: hsl(var(--sg-color-foreground));
1165
+ }
1166
+ }
1167
+ .sg\:placeholder\:text-muted-foreground {
1168
+ &::placeholder {
1169
+ color: hsl(var(--sg-color-muted-foreground));
1170
+ }
1171
+ }
1172
+ .sg\:first\:mt-0 {
1173
+ &:first-child {
1174
+ margin-top: calc(var(--sg-spacing) * 0);
1175
+ }
1176
+ }
1177
+ .sg\:last\:border-b-0 {
1178
+ &:last-child {
1179
+ border-bottom-style: var(--tw-border-style);
1180
+ border-bottom-width: 0px;
1181
+ }
1182
+ }
1183
+ .sg\:hover\:bg-accent {
1184
+ &:hover {
1185
+ @media (hover: hover) {
1186
+ background-color: hsl(var(--sg-accent));
1187
+ }
1188
+ }
1189
+ }
1190
+ .sg\:hover\:bg-destructive\/90 {
1191
+ &:hover {
1192
+ @media (hover: hover) {
1193
+ background-color: hsl(var(--sg-red));
1194
+ @supports (color: color-mix(in lab, red, red)) {
1195
+ background-color: color-mix(in oklab, hsl(var(--sg-red)) 90%, transparent);
1196
+ }
1197
+ }
1198
+ }
1199
+ }
1200
+ .sg\:hover\:bg-muted\/50 {
1201
+ &:hover {
1202
+ @media (hover: hover) {
1203
+ background-color: hsl(var(--sg-color-muted-background));
1204
+ @supports (color: color-mix(in lab, red, red)) {
1205
+ background-color: color-mix(in oklab, hsl(var(--sg-color-muted-background)) 50%, transparent);
1206
+ }
1207
+ }
1208
+ }
1209
+ }
1210
+ .sg\:hover\:bg-primary\/90 {
1211
+ &:hover {
1212
+ @media (hover: hover) {
1213
+ background-color: hsl(var(--sg-primary));
1214
+ @supports (color: color-mix(in lab, red, red)) {
1215
+ background-color: color-mix(in oklab, hsl(var(--sg-primary)) 90%, transparent);
1216
+ }
1217
+ }
1218
+ }
1219
+ }
1220
+ .sg\:hover\:bg-secondary\/80 {
1221
+ &:hover {
1222
+ @media (hover: hover) {
1223
+ background-color: hsl(var(--sg-secondary));
1224
+ @supports (color: color-mix(in lab, red, red)) {
1225
+ background-color: color-mix(in oklab, hsl(var(--sg-secondary)) 80%, transparent);
1226
+ }
1227
+ }
1228
+ }
1229
+ }
1230
+ .sg\:hover\:text-accent-foreground {
1231
+ &:hover {
1232
+ @media (hover: hover) {
1233
+ color: hsl(var(--sg-accent-foreground));
1234
+ }
1235
+ }
1236
+ }
1237
+ .sg\:hover\:underline {
1238
+ &:hover {
1239
+ @media (hover: hover) {
1240
+ text-decoration-line: underline;
1241
+ }
1242
+ }
1243
+ }
1244
+ .sg\:hover\:shadow-lg {
1245
+ &:hover {
1246
+ @media (hover: hover) {
1247
+ --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));
1248
+ box-shadow:
1249
+ var(--tw-inset-shadow),
1250
+ var(--tw-inset-ring-shadow),
1251
+ var(--tw-ring-offset-shadow),
1252
+ var(--tw-ring-shadow),
1253
+ var(--tw-shadow);
1254
+ }
1255
+ }
1256
+ }
1257
+ .sg\:focus-visible\:border-ring {
1258
+ &:focus-visible {
1259
+ border-color: var(--ring);
1260
+ }
1261
+ }
1262
+ .sg\:focus-visible\:ring-\[3px\] {
1263
+ &:focus-visible {
1264
+ --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
1265
+ box-shadow:
1266
+ var(--tw-inset-shadow),
1267
+ var(--tw-inset-ring-shadow),
1268
+ var(--tw-ring-offset-shadow),
1269
+ var(--tw-ring-shadow),
1270
+ var(--tw-shadow);
1271
+ }
1272
+ }
1273
+ .sg\:focus-visible\:ring-destructive\/20 {
1274
+ &:focus-visible {
1275
+ --tw-ring-color: hsl(var(--sg-red));
1276
+ @supports (color: color-mix(in lab, red, red)) {
1277
+ --tw-ring-color: color-mix(in oklab, hsl(var(--sg-red)) 20%, transparent);
1278
+ }
1279
+ }
1280
+ }
1281
+ .sg\:focus-visible\:ring-ring\/50 {
1282
+ &:focus-visible {
1283
+ --tw-ring-color: var(--ring);
1284
+ @supports (color: color-mix(in lab, red, red)) {
1285
+ --tw-ring-color: color-mix(in oklab, var(--ring) 50%, transparent);
1286
+ }
1287
+ }
1288
+ }
1289
+ .sg\:disabled\:pointer-events-none {
1290
+ &:disabled {
1291
+ pointer-events: none;
1292
+ }
1293
+ }
1294
+ .sg\:disabled\:cursor-not-allowed {
1295
+ &:disabled {
1296
+ cursor: not-allowed;
1297
+ }
1298
+ }
1299
+ .sg\:disabled\:opacity-50 {
1300
+ &:disabled {
1301
+ opacity: 50%;
1302
+ }
1303
+ }
1304
+ .sg\:has-\[\>svg\]\:grid-cols-\[calc\(var\(--sg-spacing\)\*4\)_1fr\] {
1305
+ &:has(> svg) {
1306
+ grid-template-columns: calc(var(--sg-spacing) * 4) 1fr;
1307
+ }
1308
+ }
1309
+ .sg\:has-\[\>svg\]\:gap-x-3 {
1310
+ &:has(> svg) {
1311
+ column-gap: calc(var(--sg-spacing) * 3);
1312
+ }
1313
+ }
1314
+ .sg\:has-\[\>svg\]\:px-2\.5 {
1315
+ &:has(> svg) {
1316
+ padding-inline: calc(var(--sg-spacing) * 2.5);
1317
+ }
1318
+ }
1319
+ .sg\:has-\[\>svg\]\:px-3 {
1320
+ &:has(> svg) {
1321
+ padding-inline: calc(var(--sg-spacing) * 3);
1322
+ }
1323
+ }
1324
+ .sg\:has-\[\>svg\]\:px-4 {
1325
+ &:has(> svg) {
1326
+ padding-inline: calc(var(--sg-spacing) * 4);
1327
+ }
1328
+ }
1329
+ .sg\:aria-invalid\:border-destructive {
1330
+ &[aria-invalid=true] {
1331
+ border-color: hsl(var(--sg-red));
1332
+ }
1333
+ }
1334
+ .sg\:aria-invalid\:ring-destructive\/20 {
1335
+ &[aria-invalid=true] {
1336
+ --tw-ring-color: hsl(var(--sg-red));
1337
+ @supports (color: color-mix(in lab, red, red)) {
1338
+ --tw-ring-color: color-mix(in oklab, hsl(var(--sg-red)) 20%, transparent);
1339
+ }
1340
+ }
1341
+ }
1342
+ .sg\:data-\[orientation\=horizontal\]\:h-px {
1343
+ &[data-orientation=horizontal] {
1344
+ height: 1px;
1345
+ }
1346
+ }
1347
+ .sg\:data-\[orientation\=horizontal\]\:w-full {
1348
+ &[data-orientation=horizontal] {
1349
+ width: 100%;
1350
+ }
1351
+ }
1352
+ .sg\:data-\[orientation\=vertical\]\:h-full {
1353
+ &[data-orientation=vertical] {
1354
+ height: 100%;
1355
+ }
1356
+ }
1357
+ .sg\:data-\[orientation\=vertical\]\:w-px {
1358
+ &[data-orientation=vertical] {
1359
+ width: 1px;
1360
+ }
1361
+ }
1362
+ .sg\:\*\:data-\[slot\=alert-description\]\:text-destructive\/90 {
1363
+ :is(& > *) {
1364
+ &[data-slot=alert-description] {
1365
+ color: hsl(var(--sg-red));
1366
+ @supports (color: color-mix(in lab, red, red)) {
1367
+ color: color-mix(in oklab, hsl(var(--sg-red)) 90%, transparent);
1368
+ }
1369
+ }
1370
+ }
1371
+ }
1372
+ .sg\:data-\[state\=selected\]\:bg-muted {
1373
+ &[data-state=selected] {
1374
+ background-color: hsl(var(--sg-color-muted-background));
1375
+ }
1376
+ }
1377
+ .sg\:md\:grid-cols-2 {
1378
+ @media (width >= 48rem) {
1379
+ grid-template-columns: repeat(2, minmax(0, 1fr));
1380
+ }
1381
+ }
1382
+ .sg\:md\:grid-cols-3 {
1383
+ @media (width >= 48rem) {
1384
+ grid-template-columns: repeat(3, minmax(0, 1fr));
1385
+ }
1386
+ }
1387
+ .sg\:md\:grid-cols-4 {
1388
+ @media (width >= 48rem) {
1389
+ grid-template-columns: repeat(4, minmax(0, 1fr));
1390
+ }
1391
+ }
1392
+ .sg\:md\:grid-cols-\[2fr_1fr\] {
1393
+ @media (width >= 48rem) {
1394
+ grid-template-columns: 2fr 1fr;
1395
+ }
1396
+ }
1397
+ .sg\:md\:px-0 {
1398
+ @media (width >= 48rem) {
1399
+ padding-inline: calc(var(--sg-spacing) * 0);
1400
+ }
1401
+ }
1402
+ .sg\:md\:text-4xl {
1403
+ @media (width >= 48rem) {
1404
+ font-size: var(--sg-text-4xl);
1405
+ line-height: var(--tw-leading, var(--sg-text-4xl--line-height));
1406
+ }
1407
+ }
1408
+ .sg\:md\:text-sm {
1409
+ @media (width >= 48rem) {
1410
+ font-size: var(--sg-text-sm);
1411
+ line-height: var(--tw-leading, var(--sg-text-sm--line-height));
1412
+ }
1413
+ }
1414
+ .sg\:lg\:text-2xl {
1415
+ @media (width >= 64rem) {
1416
+ font-size: var(--sg-text-2xl);
1417
+ line-height: var(--tw-leading, var(--sg-text-2xl--line-height));
1418
+ }
1419
+ }
1420
+ .sg\:lg\:text-3xl {
1421
+ @media (width >= 64rem) {
1422
+ font-size: var(--sg-text-3xl);
1423
+ line-height: var(--tw-leading, var(--sg-text-3xl--line-height));
1424
+ }
1425
+ }
1426
+ .sg\:lg\:text-5xl {
1427
+ @media (width >= 64rem) {
1428
+ font-size: var(--sg-text-5xl);
1429
+ line-height: var(--tw-leading, var(--sg-text-5xl--line-height));
1430
+ }
1431
+ }
1432
+ .sg\:dark\:bg-destructive\/60 {
1433
+ &:is(.dark *) {
1434
+ background-color: hsl(var(--sg-red));
1435
+ @supports (color: color-mix(in lab, red, red)) {
1436
+ background-color: color-mix(in oklab, hsl(var(--sg-red)) 60%, transparent);
1437
+ }
1438
+ }
1439
+ }
1440
+ .sg\:dark\:bg-input\/30 {
1441
+ &:is(.dark *) {
1442
+ background-color: var(--input);
1443
+ @supports (color: color-mix(in lab, red, red)) {
1444
+ background-color: color-mix(in oklab, var(--input) 30%, transparent);
1445
+ }
1446
+ }
1447
+ }
1448
+ .sg\:dark\:hover\:bg-accent\/50 {
1449
+ &:is(.dark *) {
1450
+ &:hover {
1451
+ @media (hover: hover) {
1452
+ background-color: hsl(var(--sg-accent));
1453
+ @supports (color: color-mix(in lab, red, red)) {
1454
+ background-color: color-mix(in oklab, hsl(var(--sg-accent)) 50%, transparent);
1455
+ }
1456
+ }
1457
+ }
1458
+ }
1459
+ }
1460
+ .sg\:dark\:focus-visible\:ring-destructive\/40 {
1461
+ &:is(.dark *) {
1462
+ &:focus-visible {
1463
+ --tw-ring-color: hsl(var(--sg-red));
1464
+ @supports (color: color-mix(in lab, red, red)) {
1465
+ --tw-ring-color: color-mix(in oklab, hsl(var(--sg-red)) 40%, transparent);
1466
+ }
1467
+ }
1468
+ }
1469
+ }
1470
+ .sg\:dark\:aria-invalid\:ring-destructive\/40 {
1471
+ &:is(.dark *) {
1472
+ &[aria-invalid=true] {
1473
+ --tw-ring-color: hsl(var(--sg-red));
1474
+ @supports (color: color-mix(in lab, red, red)) {
1475
+ --tw-ring-color: color-mix(in oklab, hsl(var(--sg-red)) 40%, transparent);
1476
+ }
1477
+ }
1478
+ }
1479
+ }
1480
+ .sg\:\[\&_p\]\:leading-relaxed {
1481
+ & p {
1482
+ --tw-leading: var(--sg-leading-relaxed);
1483
+ line-height: var(--sg-leading-relaxed);
1484
+ }
1485
+ }
1486
+ .sg\:\[\&_svg\]\:pointer-events-none {
1487
+ & svg {
1488
+ pointer-events: none;
1489
+ }
1490
+ }
1491
+ .sg\:\[\&_svg\]\:shrink-0 {
1492
+ & svg {
1493
+ flex-shrink: 0;
1494
+ }
1495
+ }
1496
+ .sg\:\[\&_svg\:not\(\[class\*\=size-\]\)\]\:size-4 {
1497
+ & svg:not([class*=size-]) {
1498
+ width: calc(var(--sg-spacing) * 4);
1499
+ height: calc(var(--sg-spacing) * 4);
1500
+ }
1501
+ }
1502
+ .sg\:\[\&_tr\]\:border-b {
1503
+ & tr {
1504
+ border-bottom-style: var(--tw-border-style);
1505
+ border-bottom-width: 1px;
1506
+ }
1507
+ }
1508
+ .sg\:\[\&_tr\:last-child\]\:border-0 {
1509
+ & tr:last-child {
1510
+ border-style: var(--tw-border-style);
1511
+ border-width: 0px;
1512
+ }
1513
+ }
1514
+ .sg\:\[\&\:has\(\[role\=checkbox\]\)\]\:pr-0 {
1515
+ &:has([role=checkbox]) {
1516
+ padding-right: calc(var(--sg-spacing) * 0);
1517
+ }
1518
+ }
1519
+ .sg\:\[\&\>\[role\=checkbox\]\]\:translate-y-\[2px\] {
1520
+ & > [role=checkbox] {
1521
+ --tw-translate-y: 2px;
1522
+ translate: var(--tw-translate-x) var(--tw-translate-y);
1523
+ }
1524
+ }
1525
+ .sg\:\[\&\>svg\]\:pointer-events-none {
1526
+ & > svg {
1527
+ pointer-events: none;
1528
+ }
1529
+ }
1530
+ .sg\:\[\&\>svg\]\:size-3 {
1531
+ & > svg {
1532
+ width: calc(var(--sg-spacing) * 3);
1533
+ height: calc(var(--sg-spacing) * 3);
1534
+ }
1535
+ }
1536
+ .sg\:\[\&\>svg\]\:size-4 {
1537
+ & > svg {
1538
+ width: calc(var(--sg-spacing) * 4);
1539
+ height: calc(var(--sg-spacing) * 4);
1540
+ }
1541
+ }
1542
+ .sg\:\[\&\>svg\]\:translate-y-0\.5 {
1543
+ & > svg {
1544
+ --tw-translate-y: calc(var(--sg-spacing) * 0.5);
1545
+ translate: var(--tw-translate-x) var(--tw-translate-y);
1546
+ }
1547
+ }
1548
+ .sg\:\[\&\>svg\]\:text-current {
1549
+ & > svg {
1550
+ color: currentcolor;
1551
+ }
1552
+ }
1553
+ .sg\:\[\&\>tr\]\:last\:border-b-0 {
1554
+ & > tr {
1555
+ &:last-child {
1556
+ border-bottom-style: var(--tw-border-style);
1557
+ border-bottom-width: 0px;
1558
+ }
1559
+ }
1560
+ }
1561
+ .sg\:\[\&\[data-state\=open\]\>svg\]\:rotate-180 {
1562
+ &[data-state=open] > svg {
1563
+ rotate: 180deg;
1564
+ }
1565
+ }
1566
+ .sg\:\[a\&\]\:hover\:bg-accent {
1567
+ a& {
1568
+ &:hover {
1569
+ @media (hover: hover) {
1570
+ background-color: hsl(var(--sg-accent));
1571
+ }
1572
+ }
1573
+ }
1574
+ }
1575
+ .sg\:\[a\&\]\:hover\:bg-destructive\/90 {
1576
+ a& {
1577
+ &:hover {
1578
+ @media (hover: hover) {
1579
+ background-color: hsl(var(--sg-red));
1580
+ @supports (color: color-mix(in lab, red, red)) {
1581
+ background-color: color-mix(in oklab, hsl(var(--sg-red)) 90%, transparent);
1582
+ }
1583
+ }
1584
+ }
1585
+ }
1586
+ }
1587
+ .sg\:\[a\&\]\:hover\:bg-primary\/90 {
1588
+ a& {
1589
+ &:hover {
1590
+ @media (hover: hover) {
1591
+ background-color: hsl(var(--sg-primary));
1592
+ @supports (color: color-mix(in lab, red, red)) {
1593
+ background-color: color-mix(in oklab, hsl(var(--sg-primary)) 90%, transparent);
1594
+ }
1595
+ }
1596
+ }
1597
+ }
1598
+ }
1599
+ .sg\:\[a\&\]\:hover\:bg-secondary\/90 {
1600
+ a& {
1601
+ &:hover {
1602
+ @media (hover: hover) {
1603
+ background-color: hsl(var(--sg-secondary));
1604
+ @supports (color: color-mix(in lab, red, red)) {
1605
+ background-color: color-mix(in oklab, hsl(var(--sg-secondary)) 90%, transparent);
1606
+ }
1607
+ }
1608
+ }
1609
+ }
1610
+ }
1611
+ .sg\:\[a\&\]\:hover\:text-accent-foreground {
1612
+ a& {
1613
+ &:hover {
1614
+ @media (hover: hover) {
1615
+ color: hsl(var(--sg-accent-foreground));
1616
+ }
1617
+ }
1618
+ }
1619
+ }
1620
+ }
1621
+ :root {
1622
+ --sg-color-background: var(--sg-color-white);
1623
+ --sg-color-foreground: var(--sg-color-black);
1624
+ --sg-color-muted-background: var(--sg-white-muted);
1625
+ --sg-color-muted-foreground: var(--sg-black-muted);
1626
+ --sg-gradient-1: var(--sg-pink);
1627
+ --sg-gradient-2: var(--sg-primary);
1628
+ --sg-border: var(--sg-black-muted);
1629
+ --sg-accent: var(--sg-white-accent);
1630
+ --sg-accent-foreground: var(--sg-black-accent);
1631
+ --card: oklch(1 0 0);
1632
+ --card-foreground: oklch(0.145 0 0);
1633
+ --popover: oklch(1 0 0);
1634
+ --popover-foreground: oklch(0.145 0 0);
1635
+ --input: oklch(0.922 0 0);
1636
+ --ring: oklch(0.708 0 0);
1637
+ --chart-1: oklch(0.646 0.222 41.116);
1638
+ --chart-2: oklch(0.6 0.118 184.704);
1639
+ --chart-3: oklch(0.398 0.07 227.392);
1640
+ --chart-4: oklch(0.828 0.189 84.429);
1641
+ --chart-5: oklch(0.769 0.188 70.08);
1642
+ --radius: 0.625rem;
1643
+ --sidebar: oklch(0.985 0 0);
1644
+ --sidebar-foreground: oklch(0.145 0 0);
1645
+ --sidebar-primary: oklch(0.205 0 0);
1646
+ --sidebar-primary-foreground: oklch(0.985 0 0);
1647
+ --sidebar-accent: oklch(0.97 0 0);
1648
+ --sidebar-accent-foreground: oklch(0.205 0 0);
1649
+ --sidebar-border: oklch(0.922 0 0);
1650
+ --sidebar-ring: oklch(0.708 0 0);
1651
+ }
1652
+ .dark {
1653
+ --sg-color-background: var(--sg-black);
1654
+ --sg-color-foreground: var(--sg-white);
1655
+ --sg-color-muted-background: var(--sg-black-muted);
1656
+ --sg-color-muted-foreground: var(--sg-white-muted);
1657
+ --sg-gradient-1: var(--sg-pink);
1658
+ --sg-gradient-2: var(--sg-primary-light);
1659
+ --sg-border: var(--sg-white-muted);
1660
+ --sg-accent: var(--sg-black-accent);
1661
+ --sg-accent-foreground: var(--sg-white-accent);
1662
+ --card: oklch(0.145 0 0);
1663
+ --card-foreground: oklch(0.985 0 0);
1664
+ --popover: oklch(0.145 0 0);
1665
+ --popover-foreground: oklch(0.985 0 0);
1666
+ --primary: oklch(0.985 0 0);
1667
+ --primary-foreground: oklch(0.205 0 0);
1668
+ --secondary: oklch(0.269 0 0);
1669
+ --secondary-foreground: oklch(0.985 0 0);
1670
+ --destructive: oklch(0.396 0.141 25.723);
1671
+ --destructive-foreground: oklch(0.637 0.237 25.331);
1672
+ --input: oklch(0.269 0 0);
1673
+ --ring: oklch(0.439 0 0);
1674
+ --chart-1: oklch(0.488 0.243 264.376);
1675
+ --chart-2: oklch(0.696 0.17 162.48);
1676
+ --chart-3: oklch(0.769 0.188 70.08);
1677
+ --chart-4: oklch(0.627 0.265 303.9);
1678
+ --chart-5: oklch(0.645 0.246 16.439);
1679
+ --sidebar: oklch(0.205 0 0);
1680
+ --sidebar-foreground: oklch(0.985 0 0);
1681
+ --sidebar-primary: oklch(0.488 0.243 264.376);
1682
+ --sidebar-primary-foreground: oklch(0.985 0 0);
1683
+ --sidebar-accent: oklch(0.269 0 0);
1684
+ --sidebar-accent-foreground: oklch(0.985 0 0);
1685
+ --sidebar-border: oklch(0.269 0 0);
1686
+ --sidebar-ring: oklch(0.439 0 0);
1687
+ }
1688
+ @layer base {
1689
+ * {
1690
+ border-color: hsl(var(--sg-border));
1691
+ outline-color: var(--ring);
1692
+ @supports (color: color-mix(in lab, red, red)) {
1693
+ outline-color: color-mix(in oklab, var(--ring) 50%, transparent);
1694
+ }
1695
+ }
1696
+ body {
1697
+ background-color: hsl(var(--sg-color-background));
1698
+ color: hsl(var(--sg-color-foreground));
1699
+ }
1700
+ }
1701
+ @layer utilities {
1702
+ .text-gradient-brand {
1703
+ background-image:
1704
+ linear-gradient(
1705
+ 90deg,
1706
+ hsl(var(--sg-gradient-1)) 0%,
1707
+ hsl(var(--sg-gradient-2)) 50%,
1708
+ hsl(var(--sg-primary)) 100%);
1709
+ -webkit-background-clip: text;
1710
+ background-clip: text;
1711
+ color: transparent;
1712
+ }
1713
+ }
1714
+ .gradient-hero {
1715
+ background:
1716
+ linear-gradient(
1717
+ 135deg,
1718
+ hsl(var(--sg-primary-light)) 0%,
1719
+ hsl(var(--sg-pink)) 50%,
1720
+ hsl(var(--sg-orange)) 100%);
1721
+ }
1722
+ @keyframes enter {
1723
+ from {
1724
+ opacity: var(--tw-enter-opacity, 1);
1725
+ 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));
1726
+ }
1727
+ }
1728
+ @keyframes exit {
1729
+ to {
1730
+ opacity: var(--tw-exit-opacity, 1);
1731
+ 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));
1732
+ }
1733
+ }
1734
+ @property --tw-translate-x { syntax: "*"; inherits: false; initial-value: 0; }
1735
+ @property --tw-translate-y { syntax: "*"; inherits: false; initial-value: 0; }
1736
+ @property --tw-translate-z { syntax: "*"; inherits: false; initial-value: 0; }
1737
+ @property --tw-space-y-reverse { syntax: "*"; inherits: false; initial-value: 0; }
1738
+ @property --tw-border-style { syntax: "*"; inherits: false; initial-value: solid; }
1739
+ @property --tw-gradient-position { syntax: "*"; inherits: false; }
1740
+ @property --tw-gradient-from { syntax: "<color>"; inherits: false; initial-value: #0000; }
1741
+ @property --tw-gradient-via { syntax: "<color>"; inherits: false; initial-value: #0000; }
1742
+ @property --tw-gradient-to { syntax: "<color>"; inherits: false; initial-value: #0000; }
1743
+ @property --tw-gradient-stops { syntax: "*"; inherits: false; }
1744
+ @property --tw-gradient-via-stops { syntax: "*"; inherits: false; }
1745
+ @property --tw-gradient-from-position { syntax: "<length-percentage>"; inherits: false; initial-value: 0%; }
1746
+ @property --tw-gradient-via-position { syntax: "<length-percentage>"; inherits: false; initial-value: 50%; }
1747
+ @property --tw-gradient-to-position { syntax: "<length-percentage>"; inherits: false; initial-value: 100%; }
1748
+ @property --tw-leading { syntax: "*"; inherits: false; }
1749
+ @property --tw-font-weight { syntax: "*"; inherits: false; }
1750
+ @property --tw-tracking { syntax: "*"; inherits: false; }
1751
+ @property --tw-shadow { syntax: "*"; inherits: false; initial-value: 0 0 #0000; }
1752
+ @property --tw-shadow-color { syntax: "*"; inherits: false; }
1753
+ @property --tw-shadow-alpha { syntax: "<percentage>"; inherits: false; initial-value: 100%; }
1754
+ @property --tw-inset-shadow { syntax: "*"; inherits: false; initial-value: 0 0 #0000; }
1755
+ @property --tw-inset-shadow-color { syntax: "*"; inherits: false; }
1756
+ @property --tw-inset-shadow-alpha { syntax: "<percentage>"; inherits: false; initial-value: 100%; }
1757
+ @property --tw-ring-color { syntax: "*"; inherits: false; }
1758
+ @property --tw-ring-shadow { syntax: "*"; inherits: false; initial-value: 0 0 #0000; }
1759
+ @property --tw-inset-ring-color { syntax: "*"; inherits: false; }
1760
+ @property --tw-inset-ring-shadow { syntax: "*"; inherits: false; initial-value: 0 0 #0000; }
1761
+ @property --tw-ring-inset { syntax: "*"; inherits: false; }
1762
+ @property --tw-ring-offset-width { syntax: "<length>"; inherits: false; initial-value: 0px; }
1763
+ @property --tw-ring-offset-color { syntax: "*"; inherits: false; initial-value: #fff; }
1764
+ @property --tw-ring-offset-shadow { syntax: "*"; inherits: false; initial-value: 0 0 #0000; }
1765
+ @property --tw-duration { syntax: "*"; inherits: false; }
1766
+ @property --tw-scale-x { syntax: "*"; inherits: false; initial-value: 1; }
1767
+ @property --tw-scale-y { syntax: "*"; inherits: false; initial-value: 1; }
1768
+ @property --tw-scale-z { syntax: "*"; inherits: false; initial-value: 1; }
1769
+ @keyframes spin {
1770
+ to {
1771
+ transform: rotate(360deg);
1772
+ }
1773
+ }
1774
+ @keyframes pulse {
1775
+ 50% {
1776
+ opacity: 0.5;
1777
+ }
1778
+ }
1779
+ @layer properties {
1780
+ @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
1781
+ *,
1782
+ ::before,
1783
+ ::after,
1784
+ ::backdrop {
1785
+ --tw-translate-x: 0;
1786
+ --tw-translate-y: 0;
1787
+ --tw-translate-z: 0;
1788
+ --tw-space-y-reverse: 0;
1789
+ --tw-border-style: solid;
1790
+ --tw-gradient-position: initial;
1791
+ --tw-gradient-from: #0000;
1792
+ --tw-gradient-via: #0000;
1793
+ --tw-gradient-to: #0000;
1794
+ --tw-gradient-stops: initial;
1795
+ --tw-gradient-via-stops: initial;
1796
+ --tw-gradient-from-position: 0%;
1797
+ --tw-gradient-via-position: 50%;
1798
+ --tw-gradient-to-position: 100%;
1799
+ --tw-leading: initial;
1800
+ --tw-font-weight: initial;
1801
+ --tw-tracking: initial;
1802
+ --tw-shadow: 0 0 #0000;
1803
+ --tw-shadow-color: initial;
1804
+ --tw-shadow-alpha: 100%;
1805
+ --tw-inset-shadow: 0 0 #0000;
1806
+ --tw-inset-shadow-color: initial;
1807
+ --tw-inset-shadow-alpha: 100%;
1808
+ --tw-ring-color: initial;
1809
+ --tw-ring-shadow: 0 0 #0000;
1810
+ --tw-inset-ring-color: initial;
1811
+ --tw-inset-ring-shadow: 0 0 #0000;
1812
+ --tw-ring-inset: initial;
1813
+ --tw-ring-offset-width: 0px;
1814
+ --tw-ring-offset-color: #fff;
1815
+ --tw-ring-offset-shadow: 0 0 #0000;
1816
+ --tw-duration: initial;
1817
+ --tw-scale-x: 1;
1818
+ --tw-scale-y: 1;
1819
+ --tw-scale-z: 1;
1820
+ }
1821
+ }
1822
+ }
1823
+
1824
+ /* src/css/variables.css */
1825
+ :root {
1826
+ --sg-black: 0 0% 15%;
1827
+ --sg-black-muted: 0 0% 45%;
1828
+ --sg-black-accent: 30 10% 18%;
1829
+ --sg-white: 30 20% 98%;
1830
+ --sg-white-muted: 30 8% 85%;
1831
+ --sg-white-accent: 210 12% 96%;
1832
+ --sg-pink: 330 90% 65%;
1833
+ --sg-gray-light: 240 5% 96%;
1834
+ --sg-gray: 240 4% 46%;
1835
+ --sg-gray-dark: 240 6% 10%;
1836
+ --sg-blue-light: 212 95% 95%;
1837
+ --sg-blue: 212 95% 53%;
1838
+ --sg-blue-dark: 212 95% 33%;
1839
+ --sg-blue-foreground: 0 0% 100%;
1840
+ --sg-green-light: 142 76% 95%;
1841
+ --sg-green: 142 76% 42%;
1842
+ --sg-green-dark: 142 76% 22%;
1843
+ --sg-green-foreground: 0 0% 100%;
1844
+ --sg-orange-light: 24 95% 95%;
1845
+ --sg-orange: 24 95% 53%;
1846
+ --sg-orange-dark: 24 95% 33%;
1847
+ --sg-orange-foreground: 0 0% 100%;
1848
+ --sg-red-light: 0 72% 95%;
1849
+ --sg-red: 0 72% 51%;
1850
+ --sg-red-dark: 0 72% 31%;
1851
+ --sg-red-foreground: 0 0% 100%;
1852
+ --sg-primary-light: 220 90% 70%;
1853
+ --sg-primary: 220 90% 50%;
1854
+ --sg-primary-dark: 220 90% 30%;
1855
+ --sg-primary-foreground: 0 0% 100%;
1856
+ --sg-secondary-light: 30 90% 70%;
1857
+ --sg-secondary: 30 90% 50%;
1858
+ --sg-secondary-dark: 30 90% 30%;
1859
+ --sg-secondary-foreground: 0 0% 100%;
1860
+ --sg-spacing-1: 0.25rem;
1861
+ --sg-spacing-2: 0.5rem;
1862
+ --sg-spacing-3: 0.75rem;
1863
+ --sg-spacing-4: 1rem;
1864
+ --sg-spacing-6: 1.5rem;
1865
+ --sg-spacing-8: 2rem;
1866
+ --sg-spacing-12: 3rem;
1867
+ --sg-spacing-16: 4rem;
1868
+ --sg-spacing-20: 5rem;
1869
+ --sg-spacing-24: 6rem;
1870
+ --sg-spacing-28: 7rem;
1871
+ --sg-spacing-32: 8rem;
1872
+ --sg-spacing-36: 9rem;
1873
+ --sg-spacing-40: 10rem;
1874
+ }
1875
+ /*! tailwindcss v4.1.14 | MIT License | https://tailwindcss.com */
1876
+ /*# sourceMappingURL=ssr.css.map */