@pactor-app/ui 1.20.0 → 1.22.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.
package/styles.css CHANGED
@@ -9,8 +9,15 @@
9
9
  --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",
10
10
  "Courier New", monospace;
11
11
  --spacing: 0.25rem;
12
+ --breakpoint-sm: 40rem;
13
+ --breakpoint-md: 48rem;
14
+ --breakpoint-lg: 64rem;
15
+ --breakpoint-xl: 80rem;
12
16
  --container-sm: 24rem;
13
17
  --container-lg: 32rem;
18
+ --container-xl: 36rem;
19
+ --container-2xl: 42rem;
20
+ --container-3xl: 48rem;
14
21
  --text-xs: 0.75rem;
15
22
  --text-xs--line-height: calc(1 / 0.75);
16
23
  --text-sm: 0.875rem;
@@ -27,6 +34,8 @@
27
34
  --text-3xl--line-height: calc(2.25 / 1.875);
28
35
  --text-4xl: 2.25rem;
29
36
  --text-4xl--line-height: calc(2.5 / 2.25);
37
+ --text-5xl: 3rem;
38
+ --text-5xl--line-height: 1;
30
39
  --font-weight-normal: 400;
31
40
  --font-weight-medium: 500;
32
41
  --font-weight-semibold: 600;
@@ -39,6 +48,7 @@
39
48
  --ease-out: cubic-bezier(0, 0, 0.2, 1);
40
49
  --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
41
50
  --animate-spin: spin 1s linear infinite;
51
+ --animate-ping: ping 1s cubic-bezier(0, 0, 0.2, 1) infinite;
42
52
  --animate-pulse: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
43
53
  --default-transition-duration: 150ms;
44
54
  --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
@@ -195,6 +205,9 @@
195
205
  }
196
206
  }
197
207
  @layer utilities {
208
+ .\@container {
209
+ container-type: inline-size;
210
+ }
198
211
  .pointer-events-none {
199
212
  pointer-events: none;
200
213
  }
@@ -248,18 +261,30 @@
248
261
  .top-0 {
249
262
  top: 0px;
250
263
  }
264
+ .top-1 {
265
+ top: var(--spacing);
266
+ }
251
267
  .top-1\.5 {
252
268
  top: calc(var(--spacing) * 1.5);
253
269
  }
254
270
  .top-1\/2 {
255
271
  top: calc(1 / 2 * 100%);
256
272
  }
273
+ .top-2 {
274
+ top: calc(var(--spacing) * 2);
275
+ }
276
+ .top-3 {
277
+ top: calc(var(--spacing) * 3);
278
+ }
257
279
  .top-3\.5 {
258
280
  top: calc(var(--spacing) * 3.5);
259
281
  }
260
282
  .top-4 {
261
283
  top: calc(var(--spacing) * 4);
262
284
  }
285
+ .top-5 {
286
+ top: calc(var(--spacing) * 5);
287
+ }
263
288
  .top-14 {
264
289
  top: calc(var(--spacing) * 14);
265
290
  }
@@ -287,12 +312,27 @@
287
312
  .right-4 {
288
313
  right: calc(var(--spacing) * 4);
289
314
  }
315
+ .right-10 {
316
+ right: calc(var(--spacing) * 10);
317
+ }
290
318
  .-bottom-12 {
291
319
  bottom: calc(var(--spacing) * -12);
292
320
  }
293
321
  .bottom-0 {
294
322
  bottom: 0px;
295
323
  }
324
+ .bottom-1 {
325
+ bottom: var(--spacing);
326
+ }
327
+ .bottom-4 {
328
+ bottom: calc(var(--spacing) * 4);
329
+ }
330
+ .bottom-10 {
331
+ bottom: calc(var(--spacing) * 10);
332
+ }
333
+ .bottom-full {
334
+ bottom: 100%;
335
+ }
296
336
  .-left-12 {
297
337
  left: calc(var(--spacing) * -12);
298
338
  }
@@ -302,12 +342,24 @@
302
342
  .left-1\/2 {
303
343
  left: calc(1 / 2 * 100%);
304
344
  }
345
+ .left-2 {
346
+ left: calc(var(--spacing) * 2);
347
+ }
305
348
  .left-3 {
306
349
  left: calc(var(--spacing) * 3);
307
350
  }
351
+ .left-4 {
352
+ left: calc(var(--spacing) * 4);
353
+ }
354
+ .left-\[7px\] {
355
+ left: 7px;
356
+ }
308
357
  .left-\[50\%\] {
309
358
  left: 50%;
310
359
  }
360
+ .left-auto {
361
+ left: auto;
362
+ }
311
363
  .isolate {
312
364
  isolation: isolate;
313
365
  }
@@ -317,9 +369,15 @@
317
369
  .z-20 {
318
370
  z-index: 20;
319
371
  }
372
+ .z-40 {
373
+ z-index: 40;
374
+ }
320
375
  .z-50 {
321
376
  z-index: 50;
322
377
  }
378
+ .z-\[90\] {
379
+ z-index: 90;
380
+ }
323
381
  .z-\[100\] {
324
382
  z-index: 100;
325
383
  }
@@ -356,12 +414,24 @@
356
414
  max-width: 96rem;
357
415
  }
358
416
  }
417
+ .m-0 {
418
+ margin: 0px;
419
+ }
359
420
  .-mx-1 {
360
421
  margin-inline: calc(var(--spacing) * -1);
361
422
  }
423
+ .mx-0\.5 {
424
+ margin-inline: calc(var(--spacing) * 0.5);
425
+ }
426
+ .mx-1 {
427
+ margin-inline: var(--spacing);
428
+ }
362
429
  .mx-2 {
363
430
  margin-inline: calc(var(--spacing) * 2);
364
431
  }
432
+ .mx-3 {
433
+ margin-inline: calc(var(--spacing) * 3);
434
+ }
365
435
  .mx-3\.5 {
366
436
  margin-inline: calc(var(--spacing) * 3.5);
367
437
  }
@@ -380,6 +450,9 @@
380
450
  .mt-0\.5 {
381
451
  margin-top: calc(var(--spacing) * 0.5);
382
452
  }
453
+ .mt-1 {
454
+ margin-top: var(--spacing);
455
+ }
383
456
  .mt-1\.5 {
384
457
  margin-top: calc(var(--spacing) * 1.5);
385
458
  }
@@ -389,6 +462,9 @@
389
462
  .mt-3 {
390
463
  margin-top: calc(var(--spacing) * 3);
391
464
  }
465
+ .mt-3\.5 {
466
+ margin-top: calc(var(--spacing) * 3.5);
467
+ }
392
468
  .mt-4 {
393
469
  margin-top: calc(var(--spacing) * 4);
394
470
  }
@@ -398,6 +474,18 @@
398
474
  .mt-auto {
399
475
  margin-top: auto;
400
476
  }
477
+ .-mr-0\.5 {
478
+ margin-right: calc(var(--spacing) * -0.5);
479
+ }
480
+ .mb-1 {
481
+ margin-bottom: var(--spacing);
482
+ }
483
+ .mb-2 {
484
+ margin-bottom: calc(var(--spacing) * 2);
485
+ }
486
+ .mb-3 {
487
+ margin-bottom: calc(var(--spacing) * 3);
488
+ }
401
489
  .mb-4 {
402
490
  margin-bottom: calc(var(--spacing) * 4);
403
491
  }
@@ -407,15 +495,27 @@
407
495
  .-ml-4 {
408
496
  margin-left: calc(var(--spacing) * -4);
409
497
  }
498
+ .-ml-px {
499
+ margin-left: -1px;
500
+ }
501
+ .ml-0\.5 {
502
+ margin-left: calc(var(--spacing) * 0.5);
503
+ }
410
504
  .ml-1 {
411
505
  margin-left: var(--spacing);
412
506
  }
413
507
  .ml-4 {
414
508
  margin-left: calc(var(--spacing) * 4);
415
509
  }
510
+ .ml-5 {
511
+ margin-left: calc(var(--spacing) * 5);
512
+ }
416
513
  .ml-6 {
417
514
  margin-left: calc(var(--spacing) * 6);
418
515
  }
516
+ .ml-\[13px\] {
517
+ margin-left: 13px;
518
+ }
419
519
  .ml-auto {
420
520
  margin-left: auto;
421
521
  }
@@ -437,6 +537,12 @@
437
537
  -webkit-box-orient: vertical;
438
538
  -webkit-line-clamp: 2;
439
539
  }
540
+ .line-clamp-3 {
541
+ overflow: hidden;
542
+ display: -webkit-box;
543
+ -webkit-box-orient: vertical;
544
+ -webkit-line-clamp: 3;
545
+ }
440
546
  .block {
441
547
  display: block;
442
548
  }
@@ -458,6 +564,9 @@
458
564
  .inline-flex {
459
565
  display: inline-flex;
460
566
  }
567
+ .list-item {
568
+ display: list-item;
569
+ }
461
570
  .table {
462
571
  display: table;
463
572
  }
@@ -476,6 +585,36 @@
476
585
  .aspect-square {
477
586
  aspect-ratio: 1 / 1;
478
587
  }
588
+ .scrollbar-subtle {
589
+ scrollbar-width: thin;
590
+ scrollbar-color: var(--muted-foreground) transparent;
591
+ @supports (color: color-mix(in lab, red, red)) {
592
+ scrollbar-color: color-mix(in oklch, var(--muted-foreground) 30%, transparent) transparent;
593
+ }
594
+ &::-webkit-scrollbar {
595
+ width: 6px;
596
+ height: 6px;
597
+ }
598
+ &::-webkit-scrollbar-track {
599
+ background: transparent;
600
+ }
601
+ &::-webkit-scrollbar-thumb {
602
+ background: var(--muted-foreground);
603
+ @supports (color: color-mix(in lab, red, red)) {
604
+ background: color-mix(in oklch, var(--muted-foreground) 25%, transparent);
605
+ }
606
+ border-radius: 999px;
607
+ }
608
+ &::-webkit-scrollbar-thumb:hover {
609
+ background: var(--muted-foreground);
610
+ @supports (color: color-mix(in lab, red, red)) {
611
+ background: color-mix(in oklch, var(--muted-foreground) 45%, transparent);
612
+ }
613
+ }
614
+ &::-webkit-scrollbar-corner {
615
+ background: transparent;
616
+ }
617
+ }
479
618
  .size-1\.5 {
480
619
  width: calc(var(--spacing) * 1.5);
481
620
  height: calc(var(--spacing) * 1.5);
@@ -500,6 +639,10 @@
500
639
  width: calc(var(--spacing) * 4);
501
640
  height: calc(var(--spacing) * 4);
502
641
  }
642
+ .size-5 {
643
+ width: calc(var(--spacing) * 5);
644
+ height: calc(var(--spacing) * 5);
645
+ }
503
646
  .size-6 {
504
647
  width: calc(var(--spacing) * 6);
505
648
  height: calc(var(--spacing) * 6);
@@ -520,16 +663,30 @@
520
663
  width: calc(var(--spacing) * 10);
521
664
  height: calc(var(--spacing) * 10);
522
665
  }
666
+ .size-12 {
667
+ width: calc(var(--spacing) * 12);
668
+ height: calc(var(--spacing) * 12);
669
+ }
670
+ .size-24 {
671
+ width: calc(var(--spacing) * 24);
672
+ height: calc(var(--spacing) * 24);
673
+ }
523
674
  .size-full {
524
675
  width: 100%;
525
676
  height: 100%;
526
677
  }
678
+ .h-1 {
679
+ height: var(--spacing);
680
+ }
527
681
  .h-1\.5 {
528
682
  height: calc(var(--spacing) * 1.5);
529
683
  }
530
684
  .h-2 {
531
685
  height: calc(var(--spacing) * 2);
532
686
  }
687
+ .h-3 {
688
+ height: calc(var(--spacing) * 3);
689
+ }
533
690
  .h-4 {
534
691
  height: calc(var(--spacing) * 4);
535
692
  }
@@ -560,8 +717,11 @@
560
717
  .h-24 {
561
718
  height: calc(var(--spacing) * 24);
562
719
  }
563
- .h-64 {
564
- height: calc(var(--spacing) * 64);
720
+ .h-32 {
721
+ height: calc(var(--spacing) * 32);
722
+ }
723
+ .h-36 {
724
+ height: calc(var(--spacing) * 36);
565
725
  }
566
726
  .h-\[1\.15rem\] {
567
727
  height: 1.15rem;
@@ -569,6 +729,9 @@
569
729
  .h-\[calc\(100\%-1px\)\] {
570
730
  height: calc(100% - 1px);
571
731
  }
732
+ .h-\[calc\(100\%-20px\)\] {
733
+ height: calc(100% - 20px);
734
+ }
572
735
  .h-\[calc\(100vh-3\.5rem\)\] {
573
736
  height: calc(100vh - 3.5rem);
574
737
  }
@@ -590,15 +753,39 @@
590
753
  .max-h-\(--available-height\) {
591
754
  max-height: var(--available-height);
592
755
  }
756
+ .max-h-40 {
757
+ max-height: calc(var(--spacing) * 40);
758
+ }
759
+ .max-h-48 {
760
+ max-height: calc(var(--spacing) * 48);
761
+ }
762
+ .max-h-64 {
763
+ max-height: calc(var(--spacing) * 64);
764
+ }
765
+ .max-h-72 {
766
+ max-height: calc(var(--spacing) * 72);
767
+ }
593
768
  .max-h-96 {
594
769
  max-height: calc(var(--spacing) * 96);
595
770
  }
771
+ .max-h-\[32rem\] {
772
+ max-height: 32rem;
773
+ }
774
+ .max-h-\[40\%\] {
775
+ max-height: 40%;
776
+ }
596
777
  .max-h-\[70vh\] {
597
778
  max-height: 70vh;
598
779
  }
780
+ .max-h-\[80vh\] {
781
+ max-height: 80vh;
782
+ }
599
783
  .max-h-\[300px\] {
600
784
  max-height: 300px;
601
785
  }
786
+ .max-h-full {
787
+ max-height: 100%;
788
+ }
602
789
  .min-h-0 {
603
790
  min-height: 0px;
604
791
  }
@@ -623,6 +810,9 @@
623
810
  .w-\(--sidebar-width\) {
624
811
  width: var(--sidebar-width);
625
812
  }
813
+ .w-1\/2 {
814
+ width: calc(1 / 2 * 100%);
815
+ }
626
816
  .w-2 {
627
817
  width: calc(var(--spacing) * 2);
628
818
  }
@@ -638,6 +828,9 @@
638
828
  .w-5 {
639
829
  width: calc(var(--spacing) * 5);
640
830
  }
831
+ .w-6 {
832
+ width: calc(var(--spacing) * 6);
833
+ }
641
834
  .w-7 {
642
835
  width: calc(var(--spacing) * 7);
643
836
  }
@@ -653,12 +846,18 @@
653
846
  .w-12 {
654
847
  width: calc(var(--spacing) * 12);
655
848
  }
849
+ .w-14 {
850
+ width: calc(var(--spacing) * 14);
851
+ }
656
852
  .w-16 {
657
853
  width: calc(var(--spacing) * 16);
658
854
  }
659
855
  .w-24 {
660
856
  width: calc(var(--spacing) * 24);
661
857
  }
858
+ .w-32 {
859
+ width: calc(var(--spacing) * 32);
860
+ }
662
861
  .w-40 {
663
862
  width: calc(var(--spacing) * 40);
664
863
  }
@@ -668,6 +867,9 @@
668
867
  .w-52 {
669
868
  width: calc(var(--spacing) * 52);
670
869
  }
870
+ .w-56 {
871
+ width: calc(var(--spacing) * 56);
872
+ }
671
873
  .w-64 {
672
874
  width: calc(var(--spacing) * 64);
673
875
  }
@@ -677,9 +879,18 @@
677
879
  .w-80 {
678
880
  width: calc(var(--spacing) * 80);
679
881
  }
882
+ .w-\[52px\] {
883
+ width: 52px;
884
+ }
885
+ .w-\[61\.8cqw\] {
886
+ width: 61.8cqw;
887
+ }
680
888
  .w-\[100px\] {
681
889
  width: 100px;
682
890
  }
891
+ .w-\[264px\] {
892
+ width: 264px;
893
+ }
683
894
  .w-auto {
684
895
  width: auto;
685
896
  }
@@ -698,6 +909,9 @@
698
909
  .max-w-\(--skeleton-width\) {
699
910
  max-width: var(--skeleton-width);
700
911
  }
912
+ .max-w-2xl {
913
+ max-width: var(--container-2xl);
914
+ }
701
915
  .max-w-\[80\%\] {
702
916
  max-width: 80%;
703
917
  }
@@ -710,9 +924,27 @@
710
924
  .max-w-max {
711
925
  max-width: max-content;
712
926
  }
927
+ .max-w-none {
928
+ max-width: none;
929
+ }
930
+ .max-w-screen-lg {
931
+ max-width: var(--breakpoint-lg);
932
+ }
933
+ .max-w-screen-md {
934
+ max-width: var(--breakpoint-md);
935
+ }
936
+ .max-w-screen-sm {
937
+ max-width: var(--breakpoint-sm);
938
+ }
939
+ .max-w-screen-xl {
940
+ max-width: var(--breakpoint-xl);
941
+ }
713
942
  .max-w-sm {
714
943
  max-width: var(--container-sm);
715
944
  }
945
+ .max-w-xl {
946
+ max-width: var(--container-xl);
947
+ }
716
948
  .min-w-\(--anchor-width\) {
717
949
  min-width: var(--anchor-width);
718
950
  }
@@ -722,6 +954,9 @@
722
954
  .min-w-5 {
723
955
  min-width: calc(var(--spacing) * 5);
724
956
  }
957
+ .min-w-6 {
958
+ min-width: calc(var(--spacing) * 6);
959
+ }
725
960
  .min-w-8 {
726
961
  min-width: calc(var(--spacing) * 8);
727
962
  }
@@ -827,12 +1062,18 @@
827
1062
  .animate-out {
828
1063
  animation: exit var(--tw-animation-duration,var(--tw-duration,.15s))var(--tw-ease,ease)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none);
829
1064
  }
1065
+ .animate-ping {
1066
+ animation: var(--animate-ping);
1067
+ }
830
1068
  .animate-pulse {
831
1069
  animation: var(--animate-pulse);
832
1070
  }
833
1071
  .animate-spin {
834
1072
  animation: var(--animate-spin);
835
1073
  }
1074
+ .cursor-crosshair {
1075
+ cursor: crosshair;
1076
+ }
836
1077
  .cursor-default {
837
1078
  cursor: default;
838
1079
  }
@@ -845,9 +1086,18 @@
845
1086
  .cursor-pointer {
846
1087
  cursor: pointer;
847
1088
  }
1089
+ .cursor-zoom-in {
1090
+ cursor: zoom-in;
1091
+ }
1092
+ .cursor-zoom-out {
1093
+ cursor: zoom-out;
1094
+ }
848
1095
  .touch-none {
849
1096
  touch-action: none;
850
1097
  }
1098
+ .resize {
1099
+ resize: both;
1100
+ }
851
1101
  .resize-none {
852
1102
  resize: none;
853
1103
  }
@@ -881,9 +1131,18 @@
881
1131
  .auto-rows-min {
882
1132
  grid-auto-rows: min-content;
883
1133
  }
1134
+ .grid-cols-1 {
1135
+ grid-template-columns: repeat(1, minmax(0, 1fr));
1136
+ }
884
1137
  .grid-cols-2 {
885
1138
  grid-template-columns: repeat(2, minmax(0, 1fr));
886
1139
  }
1140
+ .grid-cols-3 {
1141
+ grid-template-columns: repeat(3, minmax(0, 1fr));
1142
+ }
1143
+ .grid-cols-4 {
1144
+ grid-template-columns: repeat(4, minmax(0, 1fr));
1145
+ }
887
1146
  .grid-cols-\[0_1fr\] {
888
1147
  grid-template-columns: 0 1fr;
889
1148
  }
@@ -899,6 +1158,9 @@
899
1158
  .flex-row {
900
1159
  flex-direction: row;
901
1160
  }
1161
+ .flex-row-reverse {
1162
+ flex-direction: row-reverse;
1163
+ }
902
1164
  .flex-wrap {
903
1165
  flex-wrap: wrap;
904
1166
  }
@@ -977,6 +1239,9 @@
977
1239
  .gap-6 {
978
1240
  gap: calc(var(--spacing) * 6);
979
1241
  }
1242
+ .gap-px {
1243
+ gap: 1px;
1244
+ }
980
1245
  :where(.space-y-5 > :not(:last-child)) {
981
1246
  --tw-space-y-reverse: 0;
982
1247
  margin-block-start: calc(calc(var(--spacing) * 5) * var(--tw-space-y-reverse));
@@ -991,6 +1256,9 @@
991
1256
  .gap-y-2 {
992
1257
  row-gap: calc(var(--spacing) * 2);
993
1258
  }
1259
+ .gap-y-3 {
1260
+ row-gap: calc(var(--spacing) * 3);
1261
+ }
994
1262
  :where(.divide-y > :not(:last-child)) {
995
1263
  --tw-divide-y-reverse: 0;
996
1264
  border-bottom-style: var(--tw-border-style);
@@ -998,6 +1266,9 @@
998
1266
  border-top-width: calc(1px * var(--tw-divide-y-reverse));
999
1267
  border-bottom-width: calc(1px * calc(1 - var(--tw-divide-y-reverse)));
1000
1268
  }
1269
+ :where(.divide-border > :not(:last-child)) {
1270
+ border-color: var(--border);
1271
+ }
1001
1272
  :where(.divide-input > :not(:last-child)) {
1002
1273
  border-color: var(--input);
1003
1274
  }
@@ -1139,6 +1410,9 @@
1139
1410
  .border-border {
1140
1411
  border-color: var(--border);
1141
1412
  }
1413
+ .border-destructive {
1414
+ border-color: var(--destructive);
1415
+ }
1142
1416
  .border-destructive\/50 {
1143
1417
  border-color: var(--destructive);
1144
1418
  @supports (color: color-mix(in lab, red, red)) {
@@ -1223,9 +1497,24 @@
1223
1497
  .bg-\(--switch-thumb\) {
1224
1498
  background-color: var(--switch-thumb);
1225
1499
  }
1500
+ .bg-accent {
1501
+ background-color: var(--accent);
1502
+ }
1226
1503
  .bg-background {
1227
1504
  background-color: var(--background);
1228
1505
  }
1506
+ .bg-background\/70 {
1507
+ background-color: var(--background);
1508
+ @supports (color: color-mix(in lab, red, red)) {
1509
+ background-color: color-mix(in oklab, var(--background) 70%, transparent);
1510
+ }
1511
+ }
1512
+ .bg-background\/80 {
1513
+ background-color: var(--background);
1514
+ @supports (color: color-mix(in lab, red, red)) {
1515
+ background-color: color-mix(in oklab, var(--background) 80%, transparent);
1516
+ }
1517
+ }
1229
1518
  .bg-border {
1230
1519
  background-color: var(--border);
1231
1520
  }
@@ -1241,12 +1530,30 @@
1241
1530
  .bg-destructive {
1242
1531
  background-color: var(--destructive);
1243
1532
  }
1533
+ .bg-destructive\/10 {
1534
+ background-color: var(--destructive);
1535
+ @supports (color: color-mix(in lab, red, red)) {
1536
+ background-color: color-mix(in oklab, var(--destructive) 10%, transparent);
1537
+ }
1538
+ }
1244
1539
  .bg-foreground {
1245
1540
  background-color: var(--foreground);
1246
1541
  }
1542
+ .bg-info {
1543
+ background-color: var(--info);
1544
+ }
1545
+ .bg-info\/10 {
1546
+ background-color: var(--info);
1547
+ @supports (color: color-mix(in lab, red, red)) {
1548
+ background-color: color-mix(in oklab, var(--info) 10%, transparent);
1549
+ }
1550
+ }
1247
1551
  .bg-muted {
1248
1552
  background-color: var(--muted);
1249
1553
  }
1554
+ .bg-muted-foreground {
1555
+ background-color: var(--muted-foreground);
1556
+ }
1250
1557
  .bg-muted\/40 {
1251
1558
  background-color: var(--muted);
1252
1559
  @supports (color: color-mix(in lab, red, red)) {
@@ -1274,15 +1581,36 @@
1274
1581
  .bg-sidebar-border {
1275
1582
  background-color: var(--sidebar-border);
1276
1583
  }
1584
+ .bg-success {
1585
+ background-color: var(--success);
1586
+ }
1587
+ .bg-success\/10 {
1588
+ background-color: var(--success);
1589
+ @supports (color: color-mix(in lab, red, red)) {
1590
+ background-color: color-mix(in oklab, var(--success) 10%, transparent);
1591
+ }
1592
+ }
1277
1593
  .bg-transparent {
1278
1594
  background-color: transparent;
1279
1595
  }
1596
+ .bg-warning {
1597
+ background-color: var(--warning);
1598
+ }
1599
+ .bg-warning\/10 {
1600
+ background-color: var(--warning);
1601
+ @supports (color: color-mix(in lab, red, red)) {
1602
+ background-color: color-mix(in oklab, var(--warning) 10%, transparent);
1603
+ }
1604
+ }
1280
1605
  .scroll-fade-x {
1281
1606
  mask-image: linear-gradient( to right, transparent, black 8px, black calc(100% - 8px), transparent );
1282
1607
  }
1283
1608
  .fill-primary {
1284
1609
  fill: var(--primary);
1285
1610
  }
1611
+ .fill-warning {
1612
+ fill: var(--warning);
1613
+ }
1286
1614
  .object-contain {
1287
1615
  object-fit: contain;
1288
1616
  }
@@ -1295,6 +1623,9 @@
1295
1623
  .p-1 {
1296
1624
  padding: var(--spacing);
1297
1625
  }
1626
+ .p-1\.5 {
1627
+ padding: calc(var(--spacing) * 1.5);
1628
+ }
1298
1629
  .p-2 {
1299
1630
  padding: calc(var(--spacing) * 2);
1300
1631
  }
@@ -1358,6 +1689,9 @@
1358
1689
  .py-2 {
1359
1690
  padding-block: calc(var(--spacing) * 2);
1360
1691
  }
1692
+ .py-2\.5 {
1693
+ padding-block: calc(var(--spacing) * 2.5);
1694
+ }
1361
1695
  .py-3 {
1362
1696
  padding-block: calc(var(--spacing) * 3);
1363
1697
  }
@@ -1370,12 +1704,18 @@
1370
1704
  .py-8 {
1371
1705
  padding-block: calc(var(--spacing) * 8);
1372
1706
  }
1707
+ .py-10 {
1708
+ padding-block: calc(var(--spacing) * 10);
1709
+ }
1373
1710
  .py-\[0\.2rem\] {
1374
1711
  padding-block: 0.2rem;
1375
1712
  }
1376
1713
  .pt-0 {
1377
1714
  padding-top: 0px;
1378
1715
  }
1716
+ .pt-0\.5 {
1717
+ padding-top: calc(var(--spacing) * 0.5);
1718
+ }
1379
1719
  .pt-2 {
1380
1720
  padding-top: calc(var(--spacing) * 2);
1381
1721
  }
@@ -1385,6 +1725,9 @@
1385
1725
  .pt-4 {
1386
1726
  padding-top: calc(var(--spacing) * 4);
1387
1727
  }
1728
+ .pr-2 {
1729
+ padding-right: calc(var(--spacing) * 2);
1730
+ }
1388
1731
  .pr-3 {
1389
1732
  padding-right: calc(var(--spacing) * 3);
1390
1733
  }
@@ -1403,6 +1746,9 @@
1403
1746
  .pb-4 {
1404
1747
  padding-bottom: calc(var(--spacing) * 4);
1405
1748
  }
1749
+ .pb-6 {
1750
+ padding-bottom: calc(var(--spacing) * 6);
1751
+ }
1406
1752
  .pl-2 {
1407
1753
  padding-left: calc(var(--spacing) * 2);
1408
1754
  }
@@ -1412,9 +1758,15 @@
1412
1758
  .pl-4 {
1413
1759
  padding-left: calc(var(--spacing) * 4);
1414
1760
  }
1761
+ .pl-5 {
1762
+ padding-left: calc(var(--spacing) * 5);
1763
+ }
1415
1764
  .pl-6 {
1416
1765
  padding-left: calc(var(--spacing) * 6);
1417
1766
  }
1767
+ .pl-7 {
1768
+ padding-left: calc(var(--spacing) * 7);
1769
+ }
1418
1770
  .text-center {
1419
1771
  text-align: center;
1420
1772
  }
@@ -1427,6 +1779,9 @@
1427
1779
  .align-middle {
1428
1780
  vertical-align: middle;
1429
1781
  }
1782
+ .align-super {
1783
+ vertical-align: super;
1784
+ }
1430
1785
  .font-mono {
1431
1786
  font-family: var(--font-mono);
1432
1787
  }
@@ -1445,6 +1800,10 @@
1445
1800
  font-size: var(--text-4xl);
1446
1801
  line-height: var(--tw-leading, var(--text-4xl--line-height));
1447
1802
  }
1803
+ .text-5xl {
1804
+ font-size: var(--text-5xl);
1805
+ line-height: var(--tw-leading, var(--text-5xl--line-height));
1806
+ }
1448
1807
  .text-base {
1449
1808
  font-size: var(--text-base);
1450
1809
  line-height: var(--tw-leading, var(--text-base--line-height));
@@ -1468,6 +1827,17 @@
1468
1827
  .text-\[0\.8rem\] {
1469
1828
  font-size: 0.8rem;
1470
1829
  }
1830
+ .text-\[10px\] {
1831
+ font-size: 10px;
1832
+ }
1833
+ .leading-4 {
1834
+ --tw-leading: calc(var(--spacing) * 4);
1835
+ line-height: calc(var(--spacing) * 4);
1836
+ }
1837
+ .leading-5 {
1838
+ --tw-leading: calc(var(--spacing) * 5);
1839
+ line-height: calc(var(--spacing) * 5);
1840
+ }
1471
1841
  .leading-7 {
1472
1842
  --tw-leading: calc(var(--spacing) * 7);
1473
1843
  line-height: calc(var(--spacing) * 7);
@@ -1517,9 +1887,15 @@
1517
1887
  .wrap-break-word {
1518
1888
  overflow-wrap: break-word;
1519
1889
  }
1890
+ .break-all {
1891
+ word-break: break-all;
1892
+ }
1520
1893
  .whitespace-nowrap {
1521
1894
  white-space: nowrap;
1522
1895
  }
1896
+ .whitespace-pre-wrap {
1897
+ white-space: pre-wrap;
1898
+ }
1523
1899
  .text-\(--menu-active-foreground\) {
1524
1900
  color: var(--menu-active-foreground);
1525
1901
  }
@@ -1593,6 +1969,9 @@
1593
1969
  .underline-offset-4 {
1594
1970
  text-underline-offset: 4px;
1595
1971
  }
1972
+ .opacity-0 {
1973
+ opacity: 0%;
1974
+ }
1596
1975
  .opacity-50 {
1597
1976
  opacity: 50%;
1598
1977
  }
@@ -1630,6 +2009,10 @@
1630
2009
  --tw-shadow: 0 1px 2px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.05));
1631
2010
  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
1632
2011
  }
2012
+ .ring-2 {
2013
+ --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
2014
+ box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
2015
+ }
1633
2016
  .ring-3 {
1634
2017
  --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
1635
2018
  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
@@ -1643,9 +2026,22 @@
1643
2026
  .ring-card {
1644
2027
  --tw-ring-color: var(--card);
1645
2028
  }
2029
+ .ring-ring {
2030
+ --tw-ring-color: var(--ring);
2031
+ }
2032
+ .ring-ring\/50 {
2033
+ --tw-ring-color: var(--ring);
2034
+ @supports (color: color-mix(in lab, red, red)) {
2035
+ --tw-ring-color: color-mix(in oklab, var(--ring) 50%, transparent);
2036
+ }
2037
+ }
1646
2038
  .ring-sidebar-ring {
1647
2039
  --tw-ring-color: var(--sidebar-ring);
1648
2040
  }
2041
+ .ring-offset-1 {
2042
+ --tw-ring-offset-width: 1px;
2043
+ --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
2044
+ }
1649
2045
  .outline-hidden {
1650
2046
  --tw-outline-style: none;
1651
2047
  outline-style: none;
@@ -1658,6 +2054,10 @@
1658
2054
  outline-style: var(--tw-outline-style);
1659
2055
  outline-width: 1px;
1660
2056
  }
2057
+ .blur {
2058
+ --tw-blur: blur(8px);
2059
+ filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
2060
+ }
1661
2061
  .filter {
1662
2062
  filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
1663
2063
  }
@@ -1757,10 +2157,22 @@
1757
2157
  -webkit-user-select: none;
1758
2158
  user-select: none;
1759
2159
  }
2160
+ .running {
2161
+ animation-play-state: running;
2162
+ }
2163
+ .zoom-in {
2164
+ --tw-enter-scale: 0;
2165
+ }
2166
+ .zoom-out {
2167
+ --tw-exit-scale: 0;
2168
+ }
1760
2169
  .group-focus-within\/menu-item\:opacity-100:is(:where(.group\/menu-item):focus-within *) {
1761
2170
  opacity: 100%;
1762
2171
  }
1763
2172
  @media (hover: hover) {
2173
+ .group-hover\:opacity-100:is(:where(.group):hover *) {
2174
+ opacity: 100%;
2175
+ }
1764
2176
  .group-hover\/menu-item\:opacity-100:is(:where(.group\/menu-item):hover *) {
1765
2177
  opacity: 100%;
1766
2178
  }
@@ -2033,10 +2445,17 @@
2033
2445
  border-top-right-radius: calc(var(--radius) * 0.8);
2034
2446
  border-bottom-right-radius: calc(var(--radius) * 0.8);
2035
2447
  }
2448
+ .last\:border-r-0:last-child {
2449
+ border-right-style: var(--tw-border-style);
2450
+ border-right-width: 0px;
2451
+ }
2036
2452
  .last\:border-b-0:last-child {
2037
2453
  border-bottom-style: var(--tw-border-style);
2038
2454
  border-bottom-width: 0px;
2039
2455
  }
2456
+ .last\:pb-0:last-child {
2457
+ padding-bottom: 0px;
2458
+ }
2040
2459
  .focus-within\:border-ring:focus-within {
2041
2460
  border-color: var(--ring);
2042
2461
  }
@@ -2055,6 +2474,9 @@
2055
2474
  }
2056
2475
  }
2057
2476
  @media (hover: hover) {
2477
+ .hover\:border-primary:hover {
2478
+ border-color: var(--primary);
2479
+ }
2058
2480
  .hover\:bg-\(--calendar-day-hover-background\):hover {
2059
2481
  background-color: var(--calendar-day-hover-background);
2060
2482
  }
@@ -2099,6 +2521,9 @@
2099
2521
  background-color: color-mix(in oklab, var(--muted) 50%, transparent);
2100
2522
  }
2101
2523
  }
2524
+ .hover\:bg-primary:hover {
2525
+ background-color: var(--primary);
2526
+ }
2102
2527
  .hover\:bg-primary\/90:hover {
2103
2528
  background-color: var(--primary);
2104
2529
  }
@@ -2154,6 +2579,9 @@
2154
2579
  .hover\:underline:hover {
2155
2580
  text-decoration-line: underline;
2156
2581
  }
2582
+ .hover\:opacity-80:hover {
2583
+ opacity: 80%;
2584
+ }
2157
2585
  .hover\:opacity-100:hover {
2158
2586
  opacity: 100%;
2159
2587
  }
@@ -2380,6 +2808,9 @@
2380
2808
  .data-\[active\=true\]\:border-ring[data-active="true"] {
2381
2809
  border-color: var(--ring);
2382
2810
  }
2811
+ .data-\[active\=true\]\:bg-accent[data-active="true"] {
2812
+ background-color: var(--accent);
2813
+ }
2383
2814
  .data-\[active\=true\]\:bg-sidebar-accent[data-active="true"] {
2384
2815
  background-color: var(--sidebar-accent);
2385
2816
  }
@@ -2415,6 +2846,9 @@
2415
2846
  .data-\[instant\]\:transition-none[data-instant] {
2416
2847
  transition-property: none;
2417
2848
  }
2849
+ .data-\[open\=true\]\:rotate-90[data-open="true"] {
2850
+ rotate: 90deg;
2851
+ }
2418
2852
  .data-\[orientation\=horizontal\]\:h-px[data-orientation="horizontal"] {
2419
2853
  height: 1px;
2420
2854
  }
@@ -2653,6 +3087,26 @@
2653
3087
  border-bottom-style: var(--tw-border-style);
2654
3088
  border-bottom-width: 1px;
2655
3089
  }
3090
+ @media (prefers-reduced-motion: no-preference) {
3091
+ .motion-safe\:transition-\[left\,width\] {
3092
+ transition-property: left,width;
3093
+ transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
3094
+ transition-duration: var(--tw-duration, var(--default-transition-duration));
3095
+ }
3096
+ .motion-safe\:duration-200 {
3097
+ --tw-duration: 200ms;
3098
+ transition-duration: 200ms;
3099
+ }
3100
+ .motion-safe\:ease-out {
3101
+ --tw-ease: var(--ease-out);
3102
+ transition-timing-function: var(--ease-out);
3103
+ }
3104
+ }
3105
+ @media (prefers-reduced-motion: reduce) {
3106
+ .motion-reduce\:animate-none {
3107
+ animation: none;
3108
+ }
3109
+ }
2656
3110
  @media (width >= 40rem) {
2657
3111
  .sm\:block {
2658
3112
  display: block;
@@ -2660,6 +3114,9 @@
2660
3114
  .sm\:flex {
2661
3115
  display: flex;
2662
3116
  }
3117
+ .sm\:max-w-3xl {
3118
+ max-width: var(--container-3xl);
3119
+ }
2663
3120
  .sm\:max-w-lg {
2664
3121
  max-width: var(--container-lg);
2665
3122
  }
@@ -2669,6 +3126,9 @@
2669
3126
  .sm\:max-w-sm {
2670
3127
  max-width: var(--container-sm);
2671
3128
  }
3129
+ .sm\:grid-cols-2 {
3130
+ grid-template-columns: repeat(2, minmax(0, 1fr));
3131
+ }
2672
3132
  .sm\:flex-row {
2673
3133
  flex-direction: row;
2674
3134
  }
@@ -2889,13 +3349,23 @@
2889
3349
  --tw-leading: var(--leading-relaxed);
2890
3350
  line-height: var(--leading-relaxed);
2891
3351
  }
3352
+ .\[\&_pre\]\:bg-transparent pre {
3353
+ background-color: transparent;
3354
+ }
2892
3355
  .\[\&_svg\]\:pointer-events-none svg {
2893
3356
  pointer-events: none;
2894
3357
  }
3358
+ .\[\&_svg\]\:block svg {
3359
+ display: block;
3360
+ }
2895
3361
  .\[\&_svg\]\:size-3\.5 svg {
2896
3362
  width: calc(var(--spacing) * 3.5);
2897
3363
  height: calc(var(--spacing) * 3.5);
2898
3364
  }
3365
+ .\[\&_svg\]\:size-full svg {
3366
+ width: 100%;
3367
+ height: 100%;
3368
+ }
2899
3369
  .\[\&_svg\]\:shrink-0 svg {
2900
3370
  flex-shrink: 0;
2901
3371
  }
@@ -3259,6 +3729,180 @@
3259
3729
  inherits: false;
3260
3730
  initial-value: 0;
3261
3731
  }
3732
+ .pactor-markdown {
3733
+ --pactor-markdown-fg: var(--foreground, light-dark(#1f2328, #e6edf3));
3734
+ --pactor-markdown-muted-fg: var(--muted-foreground, light-dark(#59636e, #9198a1));
3735
+ --pactor-markdown-border: var(--border, light-dark(#d1d9e0, #3d444d));
3736
+ --pactor-markdown-muted-bg: var(--muted, light-dark(#f6f8fa, #262c36));
3737
+ --pactor-markdown-code-bg: var(--muted, light-dark(#eff1f3, #2a3139));
3738
+ --pactor-markdown-link: var(--primary, light-dark(#0969da, #4493f8));
3739
+ --pactor-markdown-quote-border: var(--border, light-dark(#d1d9e0, #3d444d));
3740
+ --pactor-markdown-radius: var(--radius, 6px);
3741
+ color: var(--pactor-markdown-fg);
3742
+ line-height: 1.75;
3743
+ overflow-wrap: break-word;
3744
+ }
3745
+ .pactor-markdown > :first-child {
3746
+ margin-top: 0;
3747
+ }
3748
+ .pactor-markdown > :last-child {
3749
+ margin-bottom: 0;
3750
+ }
3751
+ .pactor-markdown h1, .pactor-markdown h2, .pactor-markdown h3, .pactor-markdown h4, .pactor-markdown h5, .pactor-markdown h6 {
3752
+ margin: 1.4em 0 0.6em;
3753
+ font-weight: 600;
3754
+ line-height: 1.35;
3755
+ }
3756
+ .pactor-markdown h1 {
3757
+ font-size: 1.5em;
3758
+ padding-bottom: 0.3em;
3759
+ border-bottom: 1px solid var(--pactor-markdown-border);
3760
+ }
3761
+ .pactor-markdown h2 {
3762
+ font-size: 1.3em;
3763
+ padding-bottom: 0.25em;
3764
+ border-bottom: 1px solid var(--pactor-markdown-border);
3765
+ }
3766
+ .pactor-markdown h3 {
3767
+ font-size: 1.15em;
3768
+ }
3769
+ .pactor-markdown h4 {
3770
+ font-size: 1.05em;
3771
+ }
3772
+ .pactor-markdown h5, .pactor-markdown h6 {
3773
+ font-size: 1em;
3774
+ }
3775
+ .pactor-markdown h6 {
3776
+ color: var(--pactor-markdown-muted-fg);
3777
+ }
3778
+ .pactor-markdown p {
3779
+ margin: 0.75em 0;
3780
+ }
3781
+ .pactor-markdown ul, .pactor-markdown ol {
3782
+ margin: 0.75em 0;
3783
+ padding-left: 1.6em;
3784
+ }
3785
+ .pactor-markdown ul {
3786
+ list-style: disc;
3787
+ }
3788
+ .pactor-markdown ul ul {
3789
+ list-style: circle;
3790
+ }
3791
+ .pactor-markdown ul ul ul {
3792
+ list-style: square;
3793
+ }
3794
+ .pactor-markdown ol {
3795
+ list-style: decimal;
3796
+ }
3797
+ .pactor-markdown li::marker {
3798
+ color: var(--pactor-markdown-muted-fg);
3799
+ }
3800
+ .pactor-markdown li + li {
3801
+ margin-top: 0.3em;
3802
+ }
3803
+ .pactor-markdown li > ul, .pactor-markdown li > ol {
3804
+ margin: 0.3em 0;
3805
+ }
3806
+ .pactor-markdown li input[type='checkbox'] {
3807
+ margin: 0 0.45em 0 0;
3808
+ vertical-align: -0.1em;
3809
+ }
3810
+ .pactor-markdown li:has(> input[type='checkbox']:first-child) {
3811
+ list-style: none;
3812
+ margin-left: -1.6em;
3813
+ }
3814
+ .pactor-markdown blockquote {
3815
+ margin: 0.75em 0;
3816
+ padding: 0.4em 1em;
3817
+ border-left: 3px solid var(--pactor-markdown-quote-border);
3818
+ border-radius: 0 var(--pactor-markdown-radius) var(--pactor-markdown-radius) 0;
3819
+ background: var(--pactor-markdown-muted-bg);
3820
+ color: var(--pactor-markdown-muted-fg);
3821
+ }
3822
+ .pactor-markdown blockquote > :first-child {
3823
+ margin-top: 0;
3824
+ }
3825
+ .pactor-markdown blockquote > :last-child {
3826
+ margin-bottom: 0;
3827
+ }
3828
+ .pactor-markdown hr {
3829
+ margin: 1.5em 0;
3830
+ border: 0;
3831
+ border-top: 1px solid var(--pactor-markdown-border);
3832
+ }
3833
+ .pactor-markdown a {
3834
+ color: var(--pactor-markdown-link);
3835
+ text-decoration: none;
3836
+ }
3837
+ .pactor-markdown a:hover {
3838
+ text-decoration: underline;
3839
+ }
3840
+ .pactor-markdown strong {
3841
+ font-weight: 600;
3842
+ }
3843
+ .pactor-markdown mark {
3844
+ padding: 0 0.2em;
3845
+ border-radius: 3px;
3846
+ }
3847
+ .pactor-markdown code, .pactor-markdown pre {
3848
+ font-family: ui-monospace, 'SF Mono', SFMono-Regular, Menlo, Consolas, 'Liberation Mono', monospace;
3849
+ }
3850
+ .pactor-markdown :not(pre) > code {
3851
+ padding: 0.15em 0.4em;
3852
+ border-radius: 4px;
3853
+ background: var(--pactor-markdown-code-bg);
3854
+ font-size: 0.875em;
3855
+ }
3856
+ .pactor-markdown pre {
3857
+ margin: 0.85em 0;
3858
+ padding: 12px 14px;
3859
+ border: 1px solid var(--pactor-markdown-border);
3860
+ border-radius: var(--pactor-markdown-radius);
3861
+ background: var(--pactor-markdown-muted-bg);
3862
+ font-size: 0.875em;
3863
+ line-height: 1.6;
3864
+ overflow-x: auto;
3865
+ }
3866
+ .pactor-markdown pre > code {
3867
+ padding: 0;
3868
+ border: 0;
3869
+ background: transparent;
3870
+ font-size: inherit;
3871
+ }
3872
+ .pactor-markdown table {
3873
+ display: block;
3874
+ width: max-content;
3875
+ max-width: 100%;
3876
+ margin: 0.85em 0;
3877
+ border-collapse: collapse;
3878
+ overflow-x: auto;
3879
+ font-size: 0.925em;
3880
+ }
3881
+ .pactor-markdown th, .pactor-markdown td {
3882
+ padding: 6px 14px;
3883
+ border: 1px solid var(--pactor-markdown-border);
3884
+ }
3885
+ .pactor-markdown th {
3886
+ background: var(--pactor-markdown-muted-bg);
3887
+ font-weight: 600;
3888
+ }
3889
+ .pactor-markdown tr:nth-child(even) td {
3890
+ background: var(--pactor-markdown-muted-bg);
3891
+ }
3892
+ .pactor-markdown img {
3893
+ max-width: 100%;
3894
+ border-radius: var(--pactor-markdown-radius);
3895
+ box-sizing: border-box;
3896
+ }
3897
+ .pactor-markdown .katex {
3898
+ font-size: 1.05em;
3899
+ }
3900
+ .pactor-markdown .katex-display {
3901
+ margin: 0.85em 0;
3902
+ padding: 4px 0;
3903
+ overflow-x: auto;
3904
+ overflow-y: hidden;
3905
+ }
3262
3906
  :root {
3263
3907
  color-scheme: light;
3264
3908
  --radius: 0.625rem;
@@ -3666,6 +4310,12 @@
3666
4310
  transform: rotate(360deg);
3667
4311
  }
3668
4312
  }
4313
+ @keyframes ping {
4314
+ 75%, 100% {
4315
+ transform: scale(2);
4316
+ opacity: 0;
4317
+ }
4318
+ }
3669
4319
  @keyframes pulse {
3670
4320
  50% {
3671
4321
  opacity: 0.5;