vtex-css-sanitizer-cli 1.0.3 → 1.0.5

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,1320 @@
1
+ /*! tailwindcss v4.2.1 | MIT License | https://tailwindcss.com */
2
+ @layer properties {
3
+ @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
4
+ *, :before, :after, ::backdrop {
5
+ --tw-space-y-reverse: 0;
6
+ --tw-border-style: solid;
7
+ --tw-gradient-position: initial;
8
+ --tw-gradient-from: #0000;
9
+ --tw-gradient-via: #0000;
10
+ --tw-gradient-to: #0000;
11
+ --tw-gradient-stops: initial;
12
+ --tw-gradient-via-stops: initial;
13
+ --tw-gradient-from-position: 0%;
14
+ --tw-gradient-via-position: 50%;
15
+ --tw-gradient-to-position: 100%;
16
+ --tw-leading: initial;
17
+ --tw-font-weight: initial;
18
+ --tw-tracking: initial;
19
+ --tw-duration: initial;
20
+ --tw-shadow: 0 0 #0000;
21
+ --tw-shadow-color: initial;
22
+ --tw-shadow-alpha: 100%;
23
+ --tw-inset-shadow: 0 0 #0000;
24
+ --tw-inset-shadow-color: initial;
25
+ --tw-inset-shadow-alpha: 100%;
26
+ --tw-ring-color: initial;
27
+ --tw-ring-shadow: 0 0 #0000;
28
+ --tw-inset-ring-color: initial;
29
+ --tw-inset-ring-shadow: 0 0 #0000;
30
+ --tw-ring-inset: initial;
31
+ --tw-ring-offset-width: 0px;
32
+ --tw-ring-offset-color: #fff;
33
+ --tw-ring-offset-shadow: 0 0 #0000;
34
+ }
35
+ }
36
+ }
37
+
38
+ @layer theme {
39
+ :root, :host {
40
+ --font-sans: "Inter", system-ui, -apple-system, sans-serif;
41
+ --font-mono: "JetBrains Mono", "Fira Code", monospace;
42
+ --color-white: #fff;
43
+ --spacing: .25rem;
44
+ --container-md: 28rem;
45
+ --container-lg: 32rem;
46
+ --text-xs: .75rem;
47
+ --text-xs--line-height: calc(1 / .75);
48
+ --text-sm: .875rem;
49
+ --text-sm--line-height: calc(1.25 / .875);
50
+ --text-base: 1rem;
51
+ --text-base--line-height: calc(1.5 / 1);
52
+ --text-lg: 1.125rem;
53
+ --text-lg--line-height: calc(1.75 / 1.125);
54
+ --text-xl: 1.25rem;
55
+ --text-xl--line-height: calc(1.75 / 1.25);
56
+ --text-2xl: 1.5rem;
57
+ --text-2xl--line-height: calc(2 / 1.5);
58
+ --text-3xl: 1.875rem;
59
+ --text-3xl--line-height: calc(2.25 / 1.875);
60
+ --text-5xl: 3rem;
61
+ --text-5xl--line-height: 1;
62
+ --font-weight-medium: 500;
63
+ --font-weight-semibold: 600;
64
+ --font-weight-bold: 700;
65
+ --tracking-wider: .05em;
66
+ --leading-relaxed: 1.625;
67
+ --radius-lg: .5rem;
68
+ --radius-xl: .75rem;
69
+ --radius-2xl: 1rem;
70
+ --animate-spin: spin 1s linear infinite;
71
+ --default-transition-duration: .15s;
72
+ --default-transition-timing-function: cubic-bezier(.4, 0, .2, 1);
73
+ --default-font-family: var(--font-sans);
74
+ --default-mono-font-family: var(--font-mono);
75
+ --color-bg-primary: #0f0f23;
76
+ --color-bg-secondary: #1a1a2e;
77
+ --color-bg-card: #16213e;
78
+ --color-bg-card-hover: #1a2744;
79
+ --color-bg-input: #0e1628;
80
+ --color-accent-pink: #e94560;
81
+ --color-accent-pink-hover: #f25672;
82
+ --color-accent-blue: #4e9af1;
83
+ --color-accent-green: #43d9ad;
84
+ --color-accent-yellow: #ffd073;
85
+ --color-accent-red: #e94560;
86
+ --color-text-primary: #e4e4f0;
87
+ --color-text-secondary: #8892b0;
88
+ --color-text-muted: #5a6480;
89
+ --color-border: #233554;
90
+ --color-border-active: #4e9af1;
91
+ }
92
+ }
93
+
94
+ @layer base {
95
+ *, :after, :before, ::backdrop {
96
+ box-sizing: border-box;
97
+ border: 0 solid;
98
+ margin: 0;
99
+ padding: 0;
100
+ }
101
+
102
+ ::file-selector-button {
103
+ box-sizing: border-box;
104
+ border: 0 solid;
105
+ margin: 0;
106
+ padding: 0;
107
+ }
108
+
109
+ html, :host {
110
+ -webkit-text-size-adjust: 100%;
111
+ tab-size: 4;
112
+ line-height: 1.5;
113
+ 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");
114
+ font-feature-settings: var(--default-font-feature-settings, normal);
115
+ font-variation-settings: var(--default-font-variation-settings, normal);
116
+ -webkit-tap-highlight-color: transparent;
117
+ }
118
+
119
+ hr {
120
+ height: 0;
121
+ color: inherit;
122
+ border-top-width: 1px;
123
+ }
124
+
125
+ abbr:where([title]) {
126
+ -webkit-text-decoration: underline dotted;
127
+ text-decoration: underline dotted;
128
+ }
129
+
130
+ h1, h2, h3, h4, h5, h6 {
131
+ font-size: inherit;
132
+ font-weight: inherit;
133
+ }
134
+
135
+ a {
136
+ color: inherit;
137
+ -webkit-text-decoration: inherit;
138
+ -webkit-text-decoration: inherit;
139
+ -webkit-text-decoration: inherit;
140
+ text-decoration: inherit;
141
+ }
142
+
143
+ b, strong {
144
+ font-weight: bolder;
145
+ }
146
+
147
+ code, kbd, samp, pre {
148
+ font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);
149
+ font-feature-settings: var(--default-mono-font-feature-settings, normal);
150
+ font-variation-settings: var(--default-mono-font-variation-settings, normal);
151
+ font-size: 1em;
152
+ }
153
+
154
+ small {
155
+ font-size: 80%;
156
+ }
157
+
158
+ sub, sup {
159
+ vertical-align: baseline;
160
+ font-size: 75%;
161
+ line-height: 0;
162
+ position: relative;
163
+ }
164
+
165
+ sub {
166
+ bottom: -.25em;
167
+ }
168
+
169
+ sup {
170
+ top: -.5em;
171
+ }
172
+
173
+ table {
174
+ text-indent: 0;
175
+ border-color: inherit;
176
+ border-collapse: collapse;
177
+ }
178
+
179
+ :-moz-focusring {
180
+ outline: auto;
181
+ }
182
+
183
+ progress {
184
+ vertical-align: baseline;
185
+ }
186
+
187
+ summary {
188
+ display: list-item;
189
+ }
190
+
191
+ ol, ul, menu {
192
+ list-style: none;
193
+ }
194
+
195
+ img, svg, video, canvas, audio, iframe, embed, object {
196
+ vertical-align: middle;
197
+ display: block;
198
+ }
199
+
200
+ img, video {
201
+ max-width: 100%;
202
+ height: auto;
203
+ }
204
+
205
+ button, input, select, optgroup, textarea {
206
+ font: inherit;
207
+ font-feature-settings: inherit;
208
+ font-variation-settings: inherit;
209
+ letter-spacing: inherit;
210
+ color: inherit;
211
+ opacity: 1;
212
+ background-color: #0000;
213
+ border-radius: 0;
214
+ }
215
+
216
+ ::file-selector-button {
217
+ font: inherit;
218
+ font-feature-settings: inherit;
219
+ font-variation-settings: inherit;
220
+ letter-spacing: inherit;
221
+ color: inherit;
222
+ opacity: 1;
223
+ background-color: #0000;
224
+ border-radius: 0;
225
+ }
226
+
227
+ :where(select:is([multiple], [size])) optgroup {
228
+ font-weight: bolder;
229
+ }
230
+
231
+ :where(select:is([multiple], [size])) optgroup option {
232
+ padding-inline-start: 20px;
233
+ }
234
+
235
+ ::file-selector-button {
236
+ margin-inline-end: 4px;
237
+ }
238
+
239
+ ::placeholder {
240
+ opacity: 1;
241
+ }
242
+
243
+ @supports (not ((-webkit-appearance: -apple-pay-button))) or (contain-intrinsic-size: 1px) {
244
+ ::placeholder {
245
+ color: currentColor;
246
+ }
247
+
248
+ @supports (color: color-mix(in lab, red, red)) {
249
+ ::placeholder {
250
+ color: color-mix(in oklab, currentcolor 50%, transparent);
251
+ }
252
+ }
253
+ }
254
+
255
+ textarea {
256
+ resize: vertical;
257
+ }
258
+
259
+ ::-webkit-search-decoration {
260
+ -webkit-appearance: none;
261
+ }
262
+
263
+ ::-webkit-date-and-time-value {
264
+ min-height: 1lh;
265
+ text-align: inherit;
266
+ }
267
+
268
+ ::-webkit-datetime-edit {
269
+ display: inline-flex;
270
+ }
271
+
272
+ ::-webkit-datetime-edit-fields-wrapper {
273
+ padding: 0;
274
+ }
275
+
276
+ ::-webkit-datetime-edit {
277
+ padding-block: 0;
278
+ }
279
+
280
+ ::-webkit-datetime-edit-year-field {
281
+ padding-block: 0;
282
+ }
283
+
284
+ ::-webkit-datetime-edit-month-field {
285
+ padding-block: 0;
286
+ }
287
+
288
+ ::-webkit-datetime-edit-day-field {
289
+ padding-block: 0;
290
+ }
291
+
292
+ ::-webkit-datetime-edit-hour-field {
293
+ padding-block: 0;
294
+ }
295
+
296
+ ::-webkit-datetime-edit-minute-field {
297
+ padding-block: 0;
298
+ }
299
+
300
+ ::-webkit-datetime-edit-second-field {
301
+ padding-block: 0;
302
+ }
303
+
304
+ ::-webkit-datetime-edit-millisecond-field {
305
+ padding-block: 0;
306
+ }
307
+
308
+ ::-webkit-datetime-edit-meridiem-field {
309
+ padding-block: 0;
310
+ }
311
+
312
+ ::-webkit-calendar-picker-indicator {
313
+ line-height: 1;
314
+ }
315
+
316
+ :-moz-ui-invalid {
317
+ box-shadow: none;
318
+ }
319
+
320
+ button, input:where([type="button"], [type="reset"], [type="submit"]) {
321
+ appearance: button;
322
+ }
323
+
324
+ ::file-selector-button {
325
+ appearance: button;
326
+ }
327
+
328
+ ::-webkit-inner-spin-button {
329
+ height: auto;
330
+ }
331
+
332
+ ::-webkit-outer-spin-button {
333
+ height: auto;
334
+ }
335
+
336
+ [hidden]:where(:not([hidden="until-found"])) {
337
+ display: none !important;
338
+ }
339
+ }
340
+
341
+ @layer components;
342
+
343
+ @layer utilities {
344
+ .relative {
345
+ position: relative;
346
+ }
347
+
348
+ .mx-auto {
349
+ margin-inline: auto;
350
+ }
351
+
352
+ .mt-0\.5 {
353
+ margin-top: calc(var(--spacing) * .5);
354
+ }
355
+
356
+ .mt-1 {
357
+ margin-top: calc(var(--spacing) * 1);
358
+ }
359
+
360
+ .mt-2 {
361
+ margin-top: calc(var(--spacing) * 2);
362
+ }
363
+
364
+ .mt-3 {
365
+ margin-top: calc(var(--spacing) * 3);
366
+ }
367
+
368
+ .mt-8 {
369
+ margin-top: calc(var(--spacing) * 8);
370
+ }
371
+
372
+ .mb-1 {
373
+ margin-bottom: calc(var(--spacing) * 1);
374
+ }
375
+
376
+ .mb-2 {
377
+ margin-bottom: calc(var(--spacing) * 2);
378
+ }
379
+
380
+ .mb-3 {
381
+ margin-bottom: calc(var(--spacing) * 3);
382
+ }
383
+
384
+ .mb-4 {
385
+ margin-bottom: calc(var(--spacing) * 4);
386
+ }
387
+
388
+ .mb-6 {
389
+ margin-bottom: calc(var(--spacing) * 6);
390
+ }
391
+
392
+ .mb-8 {
393
+ margin-bottom: calc(var(--spacing) * 8);
394
+ }
395
+
396
+ .ml-auto {
397
+ margin-left: auto;
398
+ }
399
+
400
+ .block {
401
+ display: block;
402
+ }
403
+
404
+ .flex {
405
+ display: flex;
406
+ }
407
+
408
+ .h-3 {
409
+ height: calc(var(--spacing) * 3);
410
+ }
411
+
412
+ .h-4 {
413
+ height: calc(var(--spacing) * 4);
414
+ }
415
+
416
+ .h-5 {
417
+ height: calc(var(--spacing) * 5);
418
+ }
419
+
420
+ .h-6 {
421
+ height: calc(var(--spacing) * 6);
422
+ }
423
+
424
+ .h-8 {
425
+ height: calc(var(--spacing) * 8);
426
+ }
427
+
428
+ .h-12 {
429
+ height: calc(var(--spacing) * 12);
430
+ }
431
+
432
+ .h-20 {
433
+ height: calc(var(--spacing) * 20);
434
+ }
435
+
436
+ .h-full {
437
+ height: 100%;
438
+ }
439
+
440
+ .w-3 {
441
+ width: calc(var(--spacing) * 3);
442
+ }
443
+
444
+ .w-4 {
445
+ width: calc(var(--spacing) * 4);
446
+ }
447
+
448
+ .w-5 {
449
+ width: calc(var(--spacing) * 5);
450
+ }
451
+
452
+ .w-6 {
453
+ width: calc(var(--spacing) * 6);
454
+ }
455
+
456
+ .w-8 {
457
+ width: calc(var(--spacing) * 8);
458
+ }
459
+
460
+ .w-12 {
461
+ width: calc(var(--spacing) * 12);
462
+ }
463
+
464
+ .w-20 {
465
+ width: calc(var(--spacing) * 20);
466
+ }
467
+
468
+ .w-full {
469
+ width: 100%;
470
+ }
471
+
472
+ .max-w-\[400px\] {
473
+ max-width: 400px;
474
+ }
475
+
476
+ .max-w-full {
477
+ max-width: 100%;
478
+ }
479
+
480
+ .max-w-lg {
481
+ max-width: var(--container-lg);
482
+ }
483
+
484
+ .max-w-md {
485
+ max-width: var(--container-md);
486
+ }
487
+
488
+ .min-w-0 {
489
+ min-width: calc(var(--spacing) * 0);
490
+ }
491
+
492
+ .flex-1 {
493
+ flex: 1;
494
+ }
495
+
496
+ .shrink-0 {
497
+ flex-shrink: 0;
498
+ }
499
+
500
+ .animate-spin {
501
+ animation: var(--animate-spin);
502
+ }
503
+
504
+ .cursor-not-allowed {
505
+ cursor: not-allowed;
506
+ }
507
+
508
+ .cursor-pointer {
509
+ cursor: pointer;
510
+ }
511
+
512
+ .flex-col {
513
+ flex-direction: column;
514
+ }
515
+
516
+ .items-center {
517
+ align-items: center;
518
+ }
519
+
520
+ .items-start {
521
+ align-items: flex-start;
522
+ }
523
+
524
+ .justify-center {
525
+ justify-content: center;
526
+ }
527
+
528
+ .gap-2 {
529
+ gap: calc(var(--spacing) * 2);
530
+ }
531
+
532
+ .gap-3 {
533
+ gap: calc(var(--spacing) * 3);
534
+ }
535
+
536
+ .gap-4 {
537
+ gap: calc(var(--spacing) * 4);
538
+ }
539
+
540
+ .gap-6 {
541
+ gap: calc(var(--spacing) * 6);
542
+ }
543
+
544
+ :where(.space-y-1 > :not(:last-child)) {
545
+ --tw-space-y-reverse: 0;
546
+ margin-block-start: calc(calc(var(--spacing) * 1) * var(--tw-space-y-reverse));
547
+ margin-block-end: calc(calc(var(--spacing) * 1) * calc(1 - var(--tw-space-y-reverse)));
548
+ }
549
+
550
+ :where(.space-y-2 > :not(:last-child)) {
551
+ --tw-space-y-reverse: 0;
552
+ margin-block-start: calc(calc(var(--spacing) * 2) * var(--tw-space-y-reverse));
553
+ margin-block-end: calc(calc(var(--spacing) * 2) * calc(1 - var(--tw-space-y-reverse)));
554
+ }
555
+
556
+ :where(.space-y-3 > :not(:last-child)) {
557
+ --tw-space-y-reverse: 0;
558
+ margin-block-start: calc(calc(var(--spacing) * 3) * var(--tw-space-y-reverse));
559
+ margin-block-end: calc(calc(var(--spacing) * 3) * calc(1 - var(--tw-space-y-reverse)));
560
+ }
561
+
562
+ :where(.space-y-4 > :not(:last-child)) {
563
+ --tw-space-y-reverse: 0;
564
+ margin-block-start: calc(calc(var(--spacing) * 4) * var(--tw-space-y-reverse));
565
+ margin-block-end: calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse)));
566
+ }
567
+
568
+ :where(.space-y-6 > :not(:last-child)) {
569
+ --tw-space-y-reverse: 0;
570
+ margin-block-start: calc(calc(var(--spacing) * 6) * var(--tw-space-y-reverse));
571
+ margin-block-end: calc(calc(var(--spacing) * 6) * calc(1 - var(--tw-space-y-reverse)));
572
+ }
573
+
574
+ .truncate {
575
+ text-overflow: ellipsis;
576
+ white-space: nowrap;
577
+ overflow: hidden;
578
+ }
579
+
580
+ .overflow-hidden {
581
+ overflow: hidden;
582
+ }
583
+
584
+ .overflow-y-auto {
585
+ overflow-y: auto;
586
+ }
587
+
588
+ .rounded-2xl {
589
+ border-radius: var(--radius-2xl);
590
+ }
591
+
592
+ .rounded-full {
593
+ border-radius: 3.40282e38px;
594
+ }
595
+
596
+ .rounded-lg {
597
+ border-radius: var(--radius-lg);
598
+ }
599
+
600
+ .rounded-xl {
601
+ border-radius: var(--radius-xl);
602
+ }
603
+
604
+ .border {
605
+ border-style: var(--tw-border-style);
606
+ border-width: 1px;
607
+ }
608
+
609
+ .border-2 {
610
+ border-style: var(--tw-border-style);
611
+ border-width: 2px;
612
+ }
613
+
614
+ .border-t {
615
+ border-top-style: var(--tw-border-style);
616
+ border-top-width: 1px;
617
+ }
618
+
619
+ .border-b {
620
+ border-bottom-style: var(--tw-border-style);
621
+ border-bottom-width: 1px;
622
+ }
623
+
624
+ .border-dashed {
625
+ --tw-border-style: dashed;
626
+ border-style: dashed;
627
+ }
628
+
629
+ .border-accent-blue {
630
+ border-color: var(--color-accent-blue);
631
+ }
632
+
633
+ .border-accent-pink {
634
+ border-color: var(--color-accent-pink);
635
+ }
636
+
637
+ .border-accent-red\/30 {
638
+ border-color: #e945604d;
639
+ }
640
+
641
+ @supports (color: color-mix(in lab, red, red)) {
642
+ .border-accent-red\/30 {
643
+ border-color: color-mix(in oklab, var(--color-accent-red) 30%, transparent);
644
+ }
645
+ }
646
+
647
+ .border-border {
648
+ border-color: var(--color-border);
649
+ }
650
+
651
+ .border-t-transparent {
652
+ border-top-color: #0000;
653
+ }
654
+
655
+ .bg-accent-red {
656
+ background-color: var(--color-accent-red);
657
+ }
658
+
659
+ .bg-accent-red\/5 {
660
+ background-color: #e945600d;
661
+ }
662
+
663
+ @supports (color: color-mix(in lab, red, red)) {
664
+ .bg-accent-red\/5 {
665
+ background-color: color-mix(in oklab, var(--color-accent-red) 5%, transparent);
666
+ }
667
+ }
668
+
669
+ .bg-accent-red\/10 {
670
+ background-color: #e945601a;
671
+ }
672
+
673
+ @supports (color: color-mix(in lab, red, red)) {
674
+ .bg-accent-red\/10 {
675
+ background-color: color-mix(in oklab, var(--color-accent-red) 10%, transparent);
676
+ }
677
+ }
678
+
679
+ .bg-accent-yellow {
680
+ background-color: var(--color-accent-yellow);
681
+ }
682
+
683
+ .bg-bg-card {
684
+ background-color: var(--color-bg-card);
685
+ }
686
+
687
+ .bg-bg-input {
688
+ background-color: var(--color-bg-input);
689
+ }
690
+
691
+ .bg-bg-primary {
692
+ background-color: var(--color-bg-primary);
693
+ }
694
+
695
+ .bg-bg-secondary {
696
+ background-color: var(--color-bg-secondary);
697
+ }
698
+
699
+ .bg-gradient-to-br {
700
+ --tw-gradient-position: to bottom right in oklab;
701
+ background-image: linear-gradient(var(--tw-gradient-stops));
702
+ }
703
+
704
+ .bg-gradient-to-r {
705
+ --tw-gradient-position: to right in oklab;
706
+ background-image: linear-gradient(var(--tw-gradient-stops));
707
+ }
708
+
709
+ .from-accent-pink {
710
+ --tw-gradient-from: var(--color-accent-pink);
711
+ --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));
712
+ }
713
+
714
+ .via-accent-blue {
715
+ --tw-gradient-via: var(--color-accent-blue);
716
+ --tw-gradient-via-stops: var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-via) var(--tw-gradient-via-position), var(--tw-gradient-to) var(--tw-gradient-to-position);
717
+ --tw-gradient-stops: var(--tw-gradient-via-stops);
718
+ }
719
+
720
+ .to-accent-blue {
721
+ --tw-gradient-to: var(--color-accent-blue);
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
+
725
+ .to-accent-green {
726
+ --tw-gradient-to: var(--color-accent-green);
727
+ --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));
728
+ }
729
+
730
+ .to-accent-pink-hover {
731
+ --tw-gradient-to: var(--color-accent-pink-hover);
732
+ --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));
733
+ }
734
+
735
+ .p-4 {
736
+ padding: calc(var(--spacing) * 4);
737
+ }
738
+
739
+ .p-6 {
740
+ padding: calc(var(--spacing) * 6);
741
+ }
742
+
743
+ .p-8 {
744
+ padding: calc(var(--spacing) * 8);
745
+ }
746
+
747
+ .px-3 {
748
+ padding-inline: calc(var(--spacing) * 3);
749
+ }
750
+
751
+ .px-4 {
752
+ padding-inline: calc(var(--spacing) * 4);
753
+ }
754
+
755
+ .px-6 {
756
+ padding-inline: calc(var(--spacing) * 6);
757
+ }
758
+
759
+ .py-1\.5 {
760
+ padding-block: calc(var(--spacing) * 1.5);
761
+ }
762
+
763
+ .py-2 {
764
+ padding-block: calc(var(--spacing) * 2);
765
+ }
766
+
767
+ .py-2\.5 {
768
+ padding-block: calc(var(--spacing) * 2.5);
769
+ }
770
+
771
+ .py-3 {
772
+ padding-block: calc(var(--spacing) * 3);
773
+ }
774
+
775
+ .py-4 {
776
+ padding-block: calc(var(--spacing) * 4);
777
+ }
778
+
779
+ .py-16 {
780
+ padding-block: calc(var(--spacing) * 16);
781
+ }
782
+
783
+ .text-center {
784
+ text-align: center;
785
+ }
786
+
787
+ .font-mono {
788
+ font-family: var(--font-mono);
789
+ }
790
+
791
+ .text-2xl {
792
+ font-size: var(--text-2xl);
793
+ line-height: var(--tw-leading, var(--text-2xl--line-height));
794
+ }
795
+
796
+ .text-3xl {
797
+ font-size: var(--text-3xl);
798
+ line-height: var(--tw-leading, var(--text-3xl--line-height));
799
+ }
800
+
801
+ .text-5xl {
802
+ font-size: var(--text-5xl);
803
+ line-height: var(--tw-leading, var(--text-5xl--line-height));
804
+ }
805
+
806
+ .text-base {
807
+ font-size: var(--text-base);
808
+ line-height: var(--tw-leading, var(--text-base--line-height));
809
+ }
810
+
811
+ .text-lg {
812
+ font-size: var(--text-lg);
813
+ line-height: var(--tw-leading, var(--text-lg--line-height));
814
+ }
815
+
816
+ .text-sm {
817
+ font-size: var(--text-sm);
818
+ line-height: var(--tw-leading, var(--text-sm--line-height));
819
+ }
820
+
821
+ .text-xl {
822
+ font-size: var(--text-xl);
823
+ line-height: var(--tw-leading, var(--text-xl--line-height));
824
+ }
825
+
826
+ .text-xs {
827
+ font-size: var(--text-xs);
828
+ line-height: var(--tw-leading, var(--text-xs--line-height));
829
+ }
830
+
831
+ .text-\[10px\] {
832
+ font-size: 10px;
833
+ }
834
+
835
+ .leading-relaxed {
836
+ --tw-leading: var(--leading-relaxed);
837
+ line-height: var(--leading-relaxed);
838
+ }
839
+
840
+ .font-bold {
841
+ --tw-font-weight: var(--font-weight-bold);
842
+ font-weight: var(--font-weight-bold);
843
+ }
844
+
845
+ .font-medium {
846
+ --tw-font-weight: var(--font-weight-medium);
847
+ font-weight: var(--font-weight-medium);
848
+ }
849
+
850
+ .font-semibold {
851
+ --tw-font-weight: var(--font-weight-semibold);
852
+ font-weight: var(--font-weight-semibold);
853
+ }
854
+
855
+ .tracking-wider {
856
+ --tw-tracking: var(--tracking-wider);
857
+ letter-spacing: var(--tracking-wider);
858
+ }
859
+
860
+ .text-accent-blue {
861
+ color: var(--color-accent-blue);
862
+ }
863
+
864
+ .text-accent-green {
865
+ color: var(--color-accent-green);
866
+ }
867
+
868
+ .text-accent-pink {
869
+ color: var(--color-accent-pink);
870
+ }
871
+
872
+ .text-accent-red {
873
+ color: var(--color-accent-red);
874
+ }
875
+
876
+ .text-accent-yellow {
877
+ color: var(--color-accent-yellow);
878
+ }
879
+
880
+ .text-text-muted {
881
+ color: var(--color-text-muted);
882
+ }
883
+
884
+ .text-text-muted\/60 {
885
+ color: #5a648099;
886
+ }
887
+
888
+ @supports (color: color-mix(in lab, red, red)) {
889
+ .text-text-muted\/60 {
890
+ color: color-mix(in oklab, var(--color-text-muted) 60%, transparent);
891
+ }
892
+ }
893
+
894
+ .text-text-primary {
895
+ color: var(--color-text-primary);
896
+ }
897
+
898
+ .text-text-secondary {
899
+ color: var(--color-text-secondary);
900
+ }
901
+
902
+ .text-white {
903
+ color: var(--color-white);
904
+ }
905
+
906
+ .uppercase {
907
+ text-transform: uppercase;
908
+ }
909
+
910
+ .transition-all {
911
+ transition-property: all;
912
+ transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
913
+ transition-duration: var(--tw-duration, var(--default-transition-duration));
914
+ }
915
+
916
+ .transition-colors {
917
+ transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
918
+ transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
919
+ transition-duration: var(--tw-duration, var(--default-transition-duration));
920
+ }
921
+
922
+ .duration-200 {
923
+ --tw-duration: .2s;
924
+ transition-duration: .2s;
925
+ }
926
+
927
+ .duration-300 {
928
+ --tw-duration: .3s;
929
+ transition-duration: .3s;
930
+ }
931
+
932
+ @media (hover: hover) {
933
+ .group-hover\:bg-accent-blue\/10:is(:where(.group):hover *) {
934
+ background-color: #4e9af11a;
935
+ }
936
+
937
+ @supports (color: color-mix(in lab, red, red)) {
938
+ .group-hover\:bg-accent-blue\/10:is(:where(.group):hover *) {
939
+ background-color: color-mix(in oklab, var(--color-accent-blue) 10%, transparent);
940
+ }
941
+ }
942
+
943
+ .group-hover\:text-accent-blue:is(:where(.group):hover *) {
944
+ color: var(--color-accent-blue);
945
+ }
946
+
947
+ .group-hover\:text-text-primary:is(:where(.group):hover *) {
948
+ color: var(--color-text-primary);
949
+ }
950
+
951
+ .hover\:scale-\[1\.02\]:hover {
952
+ scale: 1.02;
953
+ }
954
+
955
+ .hover\:border-accent-blue:hover {
956
+ border-color: var(--color-accent-blue);
957
+ }
958
+
959
+ .hover\:border-accent-red\/40:hover {
960
+ border-color: #e9456066;
961
+ }
962
+
963
+ @supports (color: color-mix(in lab, red, red)) {
964
+ .hover\:border-accent-red\/40:hover {
965
+ border-color: color-mix(in oklab, var(--color-accent-red) 40%, transparent);
966
+ }
967
+ }
968
+
969
+ .hover\:border-accent-yellow\/40:hover {
970
+ border-color: #ffd07366;
971
+ }
972
+
973
+ @supports (color: color-mix(in lab, red, red)) {
974
+ .hover\:border-accent-yellow\/40:hover {
975
+ border-color: color-mix(in oklab, var(--color-accent-yellow) 40%, transparent);
976
+ }
977
+ }
978
+
979
+ .hover\:border-border-active\/30:hover {
980
+ border-color: #4e9af14d;
981
+ }
982
+
983
+ @supports (color: color-mix(in lab, red, red)) {
984
+ .hover\:border-border-active\/30:hover {
985
+ border-color: color-mix(in oklab, var(--color-border-active) 30%, transparent);
986
+ }
987
+ }
988
+
989
+ .hover\:bg-bg-card:hover {
990
+ background-color: var(--color-bg-card);
991
+ }
992
+
993
+ .hover\:bg-bg-card-hover:hover {
994
+ background-color: var(--color-bg-card-hover);
995
+ }
996
+
997
+ .hover\:text-text-primary:hover {
998
+ color: var(--color-text-primary);
999
+ }
1000
+
1001
+ .hover\:underline:hover {
1002
+ text-decoration-line: underline;
1003
+ }
1004
+
1005
+ .hover\:shadow-lg:hover {
1006
+ --tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, #0000001a), 0 4px 6px -4px var(--tw-shadow-color, #0000001a);
1007
+ box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
1008
+ }
1009
+
1010
+ .hover\:shadow-accent-pink\/25:hover {
1011
+ --tw-shadow-color: #e9456040;
1012
+ }
1013
+
1014
+ @supports (color: color-mix(in lab, red, red)) {
1015
+ .hover\:shadow-accent-pink\/25:hover {
1016
+ --tw-shadow-color: color-mix(in oklab, color-mix(in oklab, var(--color-accent-pink) 25%, transparent) var(--tw-shadow-alpha), transparent);
1017
+ }
1018
+ }
1019
+ }
1020
+
1021
+ .active\:scale-\[0\.98\]:active {
1022
+ scale: .98;
1023
+ }
1024
+ }
1025
+
1026
+ @font-face {
1027
+ font-family: Inter;
1028
+ font-style: normal;
1029
+ font-weight: 100 900;
1030
+ font-display: swap;
1031
+ src: url("https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap");
1032
+ }
1033
+
1034
+ * {
1035
+ box-sizing: border-box;
1036
+ margin: 0;
1037
+ padding: 0;
1038
+ }
1039
+
1040
+ html, body, #root {
1041
+ width: 100%;
1042
+ height: 100%;
1043
+ overflow: hidden;
1044
+ }
1045
+
1046
+ body {
1047
+ font-family: var(--font-sans);
1048
+ background-color: var(--color-bg-primary);
1049
+ color: var(--color-text-primary);
1050
+ -webkit-font-smoothing: antialiased;
1051
+ -moz-osx-font-smoothing: grayscale;
1052
+ }
1053
+
1054
+ ::-webkit-scrollbar {
1055
+ width: 6px;
1056
+ }
1057
+
1058
+ ::-webkit-scrollbar-track {
1059
+ background: var(--color-bg-primary);
1060
+ }
1061
+
1062
+ ::-webkit-scrollbar-thumb {
1063
+ background: var(--color-border);
1064
+ border-radius: 3px;
1065
+ }
1066
+
1067
+ ::-webkit-scrollbar-thumb:hover {
1068
+ background: var(--color-text-muted);
1069
+ }
1070
+
1071
+ .drag-region {
1072
+ -webkit-app-region: drag;
1073
+ }
1074
+
1075
+ .no-drag {
1076
+ -webkit-app-region: no-drag;
1077
+ }
1078
+
1079
+ .code-block {
1080
+ background: var(--color-bg-input);
1081
+ border: 1px solid var(--color-border);
1082
+ font-family: var(--font-mono);
1083
+ white-space: pre-wrap;
1084
+ word-break: break-all;
1085
+ border-radius: 8px;
1086
+ padding: 12px 16px;
1087
+ font-size: 13px;
1088
+ line-height: 1.6;
1089
+ overflow-x: auto;
1090
+ }
1091
+
1092
+ input[type="checkbox"] {
1093
+ appearance: none;
1094
+ border: 2px solid var(--color-border);
1095
+ background: var(--color-bg-input);
1096
+ cursor: pointer;
1097
+ border-radius: 4px;
1098
+ flex-shrink: 0;
1099
+ width: 18px;
1100
+ height: 18px;
1101
+ transition: all .15s;
1102
+ position: relative;
1103
+ }
1104
+
1105
+ input[type="checkbox"]:checked {
1106
+ background: var(--color-accent-pink);
1107
+ border-color: var(--color-accent-pink);
1108
+ }
1109
+
1110
+ input[type="checkbox"]:checked:after {
1111
+ content: "✓";
1112
+ color: #fff;
1113
+ font-size: 12px;
1114
+ font-weight: 700;
1115
+ position: absolute;
1116
+ top: -1px;
1117
+ left: 2px;
1118
+ }
1119
+
1120
+ .fade-in {
1121
+ animation: .3s ease-out fadeIn;
1122
+ }
1123
+
1124
+ @keyframes fadeIn {
1125
+ from {
1126
+ opacity: 0;
1127
+ transform: translateY(8px);
1128
+ }
1129
+
1130
+ to {
1131
+ opacity: 1;
1132
+ transform: translateY(0);
1133
+ }
1134
+ }
1135
+
1136
+ @keyframes pulse-glow {
1137
+ 0%, 100% {
1138
+ box-shadow: 0 0 #e945604d;
1139
+ }
1140
+
1141
+ 50% {
1142
+ box-shadow: 0 0 20px 4px #e9456026;
1143
+ }
1144
+ }
1145
+
1146
+ .pulse-glow {
1147
+ animation: 2s ease-in-out infinite pulse-glow;
1148
+ }
1149
+
1150
+ @keyframes spin {
1151
+ to {
1152
+ transform: rotate(360deg);
1153
+ }
1154
+ }
1155
+
1156
+ .animate-spin {
1157
+ animation: 1s linear infinite spin;
1158
+ }
1159
+
1160
+ @property --tw-space-y-reverse {
1161
+ syntax: "*";
1162
+ inherits: false;
1163
+ initial-value: 0;
1164
+ }
1165
+
1166
+ @property --tw-border-style {
1167
+ syntax: "*";
1168
+ inherits: false;
1169
+ initial-value: solid;
1170
+ }
1171
+
1172
+ @property --tw-gradient-position {
1173
+ syntax: "*";
1174
+ inherits: false
1175
+ }
1176
+
1177
+ @property --tw-gradient-from {
1178
+ syntax: "<color>";
1179
+ inherits: false;
1180
+ initial-value: #0000;
1181
+ }
1182
+
1183
+ @property --tw-gradient-via {
1184
+ syntax: "<color>";
1185
+ inherits: false;
1186
+ initial-value: #0000;
1187
+ }
1188
+
1189
+ @property --tw-gradient-to {
1190
+ syntax: "<color>";
1191
+ inherits: false;
1192
+ initial-value: #0000;
1193
+ }
1194
+
1195
+ @property --tw-gradient-stops {
1196
+ syntax: "*";
1197
+ inherits: false
1198
+ }
1199
+
1200
+ @property --tw-gradient-via-stops {
1201
+ syntax: "*";
1202
+ inherits: false
1203
+ }
1204
+
1205
+ @property --tw-gradient-from-position {
1206
+ syntax: "<length-percentage>";
1207
+ inherits: false;
1208
+ initial-value: 0%;
1209
+ }
1210
+
1211
+ @property --tw-gradient-via-position {
1212
+ syntax: "<length-percentage>";
1213
+ inherits: false;
1214
+ initial-value: 50%;
1215
+ }
1216
+
1217
+ @property --tw-gradient-to-position {
1218
+ syntax: "<length-percentage>";
1219
+ inherits: false;
1220
+ initial-value: 100%;
1221
+ }
1222
+
1223
+ @property --tw-leading {
1224
+ syntax: "*";
1225
+ inherits: false
1226
+ }
1227
+
1228
+ @property --tw-font-weight {
1229
+ syntax: "*";
1230
+ inherits: false
1231
+ }
1232
+
1233
+ @property --tw-tracking {
1234
+ syntax: "*";
1235
+ inherits: false
1236
+ }
1237
+
1238
+ @property --tw-duration {
1239
+ syntax: "*";
1240
+ inherits: false
1241
+ }
1242
+
1243
+ @property --tw-shadow {
1244
+ syntax: "*";
1245
+ inherits: false;
1246
+ initial-value: 0 0 #0000;
1247
+ }
1248
+
1249
+ @property --tw-shadow-color {
1250
+ syntax: "*";
1251
+ inherits: false
1252
+ }
1253
+
1254
+ @property --tw-shadow-alpha {
1255
+ syntax: "<percentage>";
1256
+ inherits: false;
1257
+ initial-value: 100%;
1258
+ }
1259
+
1260
+ @property --tw-inset-shadow {
1261
+ syntax: "*";
1262
+ inherits: false;
1263
+ initial-value: 0 0 #0000;
1264
+ }
1265
+
1266
+ @property --tw-inset-shadow-color {
1267
+ syntax: "*";
1268
+ inherits: false
1269
+ }
1270
+
1271
+ @property --tw-inset-shadow-alpha {
1272
+ syntax: "<percentage>";
1273
+ inherits: false;
1274
+ initial-value: 100%;
1275
+ }
1276
+
1277
+ @property --tw-ring-color {
1278
+ syntax: "*";
1279
+ inherits: false
1280
+ }
1281
+
1282
+ @property --tw-ring-shadow {
1283
+ syntax: "*";
1284
+ inherits: false;
1285
+ initial-value: 0 0 #0000;
1286
+ }
1287
+
1288
+ @property --tw-inset-ring-color {
1289
+ syntax: "*";
1290
+ inherits: false
1291
+ }
1292
+
1293
+ @property --tw-inset-ring-shadow {
1294
+ syntax: "*";
1295
+ inherits: false;
1296
+ initial-value: 0 0 #0000;
1297
+ }
1298
+
1299
+ @property --tw-ring-inset {
1300
+ syntax: "*";
1301
+ inherits: false
1302
+ }
1303
+
1304
+ @property --tw-ring-offset-width {
1305
+ syntax: "<length>";
1306
+ inherits: false;
1307
+ initial-value: 0;
1308
+ }
1309
+
1310
+ @property --tw-ring-offset-color {
1311
+ syntax: "*";
1312
+ inherits: false;
1313
+ initial-value: #fff;
1314
+ }
1315
+
1316
+ @property --tw-ring-offset-shadow {
1317
+ syntax: "*";
1318
+ inherits: false;
1319
+ initial-value: 0 0 #0000;
1320
+ }