vibrant-tool 0.1.2 → 0.1.3

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.
@@ -76,15 +76,22 @@
76
76
  :root, :host {
77
77
  --color-red-400: oklch(70.4% .191 22.216);
78
78
  --color-red-500: oklch(63.7% .237 25.331);
79
+ --color-amber-500: oklch(76.9% .188 70.08);
79
80
  --color-yellow-400: oklch(85.2% .199 91.936);
80
81
  --color-green-600: oklch(62.7% .194 149.214);
81
82
  --color-green-700: oklch(52.7% .154 150.069);
82
83
  --color-emerald-200: oklch(90.5% .093 164.15);
84
+ --color-cyan-50: oklch(98.4% .019 200.873);
85
+ --color-cyan-500: oklch(71.5% .143 215.221);
86
+ --color-cyan-600: oklch(60.9% .126 221.723);
83
87
  --color-blue-200: oklch(88.2% .059 254.128);
84
- --color-blue-300: oklch(80.9% .105 251.813);
85
88
  --color-blue-400: oklch(70.7% .165 254.624);
86
89
  --color-blue-500: oklch(62.3% .214 259.815);
87
90
  --color-blue-600: oklch(54.6% .245 262.881);
91
+ --color-rose-600: oklch(58.6% .253 17.585);
92
+ --color-slate-50: oklch(98.4% .003 247.858);
93
+ --color-slate-100: oklch(96.8% .007 247.896);
94
+ --color-gray-50: oklch(98.5% .002 247.839);
88
95
  --color-gray-100: oklch(96.7% .003 264.542);
89
96
  --color-gray-200: oklch(92.8% .006 264.531);
90
97
  --color-gray-300: oklch(87.2% .01 258.338);
@@ -94,8 +101,10 @@
94
101
  --color-gray-700: oklch(37.3% .034 259.733);
95
102
  --color-gray-800: oklch(27.8% .033 256.848);
96
103
  --color-gray-900: oklch(21% .034 264.665);
104
+ --color-neutral-100: oklch(97% 0 0);
97
105
  --color-neutral-200: oklch(92.2% 0 0);
98
106
  --color-neutral-300: oklch(87% 0 0);
107
+ --color-neutral-400: oklch(70.8% 0 0);
99
108
  --color-neutral-600: oklch(43.9% 0 0);
100
109
  --color-neutral-700: oklch(37.1% 0 0);
101
110
  --color-neutral-800: oklch(26.9% 0 0);
@@ -104,6 +113,8 @@
104
113
  --color-black: #000;
105
114
  --color-white: #fff;
106
115
  --spacing: .25rem;
116
+ --container-md: 28rem;
117
+ --container-4xl: 56rem;
107
118
  --text-xs: .75rem;
108
119
  --text-xs--line-height: calc(1 / .75);
109
120
  --text-sm: .875rem;
@@ -135,6 +146,9 @@
135
146
  --radius-3xl: 1.5rem;
136
147
  --ease-in-out: cubic-bezier(.4, 0, .2, 1);
137
148
  --animate-spin: spin 1s linear infinite;
149
+ --animate-ping: ping 1s cubic-bezier(0, 0, .2, 1) infinite;
150
+ --animate-pulse: pulse 2s cubic-bezier(.4, 0, .6, 1) infinite;
151
+ --blur-sm: 8px;
138
152
  --blur-md: 12px;
139
153
  --blur-xl: 24px;
140
154
  --default-transition-duration: .15s;
@@ -436,6 +450,10 @@
436
450
  inset-inline-end: var(--spacing);
437
451
  }
438
452
 
453
+ .-top-1\.5 {
454
+ top: calc(var(--spacing) * -1.5);
455
+ }
456
+
439
457
  .-top-2\.5 {
440
458
  top: calc(var(--spacing) * -2.5);
441
459
  }
@@ -460,12 +478,12 @@
460
478
  top: calc(var(--spacing) * 2);
461
479
  }
462
480
 
463
- .top-10 {
464
- top: calc(var(--spacing) * 10);
481
+ .top-4 {
482
+ top: calc(var(--spacing) * 4);
465
483
  }
466
484
 
467
- .top-12 {
468
- top: calc(var(--spacing) * 12);
485
+ .top-10 {
486
+ top: calc(var(--spacing) * 10);
469
487
  }
470
488
 
471
489
  .top-\[-6px\] {
@@ -548,6 +566,14 @@
548
566
  left: 50%;
549
567
  }
550
568
 
569
+ .left-4 {
570
+ left: calc(var(--spacing) * 4);
571
+ }
572
+
573
+ .-z-10 {
574
+ z-index: calc(10 * -1);
575
+ }
576
+
551
577
  .z-40 {
552
578
  z-index: 40;
553
579
  }
@@ -576,6 +602,10 @@
576
602
  z-index: 9999;
577
603
  }
578
604
 
605
+ .z-\[99999\] {
606
+ z-index: 99999;
607
+ }
608
+
579
609
  .col-span-2 {
580
610
  grid-column: span 2 / span 2;
581
611
  }
@@ -714,6 +744,10 @@
714
744
  display: block;
715
745
  }
716
746
 
747
+ .contents {
748
+ display: contents;
749
+ }
750
+
717
751
  .flex {
718
752
  display: flex;
719
753
  }
@@ -742,6 +776,14 @@
742
776
  height: calc(var(--spacing) * 1.5);
743
777
  }
744
778
 
779
+ .h-2 {
780
+ height: calc(var(--spacing) * 2);
781
+ }
782
+
783
+ .h-2\.5 {
784
+ height: calc(var(--spacing) * 2.5);
785
+ }
786
+
745
787
  .h-3 {
746
788
  height: calc(var(--spacing) * 3);
747
789
  }
@@ -786,6 +828,10 @@
786
828
  height: calc(var(--spacing) * 14);
787
829
  }
788
830
 
831
+ .h-16 {
832
+ height: calc(var(--spacing) * 16);
833
+ }
834
+
789
835
  .h-20 {
790
836
  height: calc(var(--spacing) * 20);
791
837
  }
@@ -826,6 +872,10 @@
826
872
  height: 85dvh;
827
873
  }
828
874
 
875
+ .h-\[85vh\] {
876
+ height: 85vh;
877
+ }
878
+
829
879
  .h-\[calc\(100dvh-180px\)\] {
830
880
  height: calc(100dvh - 180px);
831
881
  }
@@ -858,6 +908,10 @@
858
908
  height: calc(100vh - 288px);
859
909
  }
860
910
 
911
+ .h-auto {
912
+ height: auto;
913
+ }
914
+
861
915
  .h-full {
862
916
  height: 100%;
863
917
  }
@@ -874,10 +928,26 @@
874
928
  max-height: calc(var(--spacing) * 60);
875
929
  }
876
930
 
931
+ .max-h-\[50vh\] {
932
+ max-height: 50vh;
933
+ }
934
+
877
935
  .min-h-0 {
878
936
  min-height: calc(var(--spacing) * 0);
879
937
  }
880
938
 
939
+ .min-h-\[500px\] {
940
+ min-height: 500px;
941
+ }
942
+
943
+ .w-2 {
944
+ width: calc(var(--spacing) * 2);
945
+ }
946
+
947
+ .w-2\.5 {
948
+ width: calc(var(--spacing) * 2.5);
949
+ }
950
+
881
951
  .w-3 {
882
952
  width: calc(var(--spacing) * 3);
883
953
  }
@@ -934,6 +1004,10 @@
934
1004
  width: calc(var(--spacing) * 40);
935
1005
  }
936
1006
 
1007
+ .w-72 {
1008
+ width: calc(var(--spacing) * 72);
1009
+ }
1010
+
937
1011
  .w-80 {
938
1012
  width: calc(var(--spacing) * 80);
939
1013
  }
@@ -954,8 +1028,12 @@
954
1028
  width: 260px;
955
1029
  }
956
1030
 
957
- .w-\[300px\] {
958
- width: 300px;
1031
+ .w-\[290px\] {
1032
+ width: 290px;
1033
+ }
1034
+
1035
+ .w-auto {
1036
+ width: auto;
959
1037
  }
960
1038
 
961
1039
  .w-full {
@@ -970,6 +1048,18 @@
970
1048
  width: 100vw;
971
1049
  }
972
1050
 
1051
+ .max-w-4xl {
1052
+ max-width: var(--container-4xl);
1053
+ }
1054
+
1055
+ .max-w-full {
1056
+ max-width: 100%;
1057
+ }
1058
+
1059
+ .max-w-md {
1060
+ max-width: var(--container-md);
1061
+ }
1062
+
973
1063
  .min-w-\[52px\] {
974
1064
  min-width: 52px;
975
1065
  }
@@ -1009,6 +1099,14 @@
1009
1099
  transform: var(--tw-rotate-x, ) var(--tw-rotate-y, ) var(--tw-rotate-z, ) var(--tw-skew-x, ) var(--tw-skew-y, );
1010
1100
  }
1011
1101
 
1102
+ .animate-ping {
1103
+ animation: var(--animate-ping);
1104
+ }
1105
+
1106
+ .animate-pulse {
1107
+ animation: var(--animate-pulse);
1108
+ }
1109
+
1012
1110
  .animate-spin {
1013
1111
  animation: var(--animate-spin);
1014
1112
  }
@@ -1021,6 +1119,14 @@
1021
1119
  cursor: ew-resize;
1022
1120
  }
1023
1121
 
1122
+ .cursor-grab {
1123
+ cursor: grab;
1124
+ }
1125
+
1126
+ .cursor-help {
1127
+ cursor: help;
1128
+ }
1129
+
1024
1130
  .cursor-not-allowed {
1025
1131
  cursor: not-allowed;
1026
1132
  }
@@ -1214,7 +1320,7 @@
1214
1320
  border-top-right-radius: var(--radius-xl);
1215
1321
  }
1216
1322
 
1217
- .border, .border-1 {
1323
+ .border {
1218
1324
  border-style: var(--tw-border-style);
1219
1325
  border-width: 1px;
1220
1326
  }
@@ -1248,6 +1354,10 @@
1248
1354
  border-color: #02bc71;
1249
1355
  }
1250
1356
 
1357
+ .border-\[\#02bc71\]\/40 {
1358
+ border-color: oklab(69.9534% -.154036 .0673199 / .4);
1359
+ }
1360
+
1251
1361
  .border-\[\#393939\] {
1252
1362
  border-color: #393939;
1253
1363
  }
@@ -1256,6 +1366,10 @@
1256
1366
  border-color: var(--color-blue-500);
1257
1367
  }
1258
1368
 
1369
+ .border-gray-200 {
1370
+ border-color: var(--color-gray-200);
1371
+ }
1372
+
1259
1373
  .border-gray-300 {
1260
1374
  border-color: var(--color-gray-300);
1261
1375
  }
@@ -1292,6 +1406,16 @@
1292
1406
  border-color: var(--color-red-500);
1293
1407
  }
1294
1408
 
1409
+ .border-red-500\/20 {
1410
+ border-color: #fb2c3633;
1411
+ }
1412
+
1413
+ @supports (color: color-mix(in lab, red, red)) {
1414
+ .border-red-500\/20 {
1415
+ border-color: color-mix(in oklab, var(--color-red-500) 20%, transparent);
1416
+ }
1417
+ }
1418
+
1295
1419
  .border-transparent {
1296
1420
  border-color: #0000;
1297
1421
  }
@@ -1358,6 +1482,10 @@
1358
1482
  background-color: #111;
1359
1483
  }
1360
1484
 
1485
+ .bg-\[\#222\] {
1486
+ background-color: #222;
1487
+ }
1488
+
1361
1489
  .bg-\[\#F3F4F6\] {
1362
1490
  background-color: #f3f4f6;
1363
1491
  }
@@ -1366,10 +1494,24 @@
1366
1494
  background-color: #e4e6eb;
1367
1495
  }
1368
1496
 
1497
+ .bg-amber-500 {
1498
+ background-color: var(--color-amber-500);
1499
+ }
1500
+
1369
1501
  .bg-black {
1370
1502
  background-color: var(--color-black);
1371
1503
  }
1372
1504
 
1505
+ .bg-black\/20 {
1506
+ background-color: #0003;
1507
+ }
1508
+
1509
+ @supports (color: color-mix(in lab, red, red)) {
1510
+ .bg-black\/20 {
1511
+ background-color: color-mix(in oklab, var(--color-black) 20%, transparent);
1512
+ }
1513
+ }
1514
+
1373
1515
  .bg-black\/40 {
1374
1516
  background-color: #0006;
1375
1517
  }
@@ -1390,6 +1532,16 @@
1390
1532
  }
1391
1533
  }
1392
1534
 
1535
+ .bg-black\/60 {
1536
+ background-color: #0009;
1537
+ }
1538
+
1539
+ @supports (color: color-mix(in lab, red, red)) {
1540
+ .bg-black\/60 {
1541
+ background-color: color-mix(in oklab, var(--color-black) 60%, transparent);
1542
+ }
1543
+ }
1544
+
1393
1545
  .bg-blue-500 {
1394
1546
  background-color: var(--color-blue-500);
1395
1547
  }
@@ -1408,6 +1560,24 @@
1408
1560
  background-color: var(--color-blue-600);
1409
1561
  }
1410
1562
 
1563
+ .bg-cyan-50 {
1564
+ background-color: var(--color-cyan-50);
1565
+ }
1566
+
1567
+ .bg-gray-50 {
1568
+ background-color: var(--color-gray-50);
1569
+ }
1570
+
1571
+ .bg-gray-50\/90 {
1572
+ background-color: #f9fafbe6;
1573
+ }
1574
+
1575
+ @supports (color: color-mix(in lab, red, red)) {
1576
+ .bg-gray-50\/90 {
1577
+ background-color: color-mix(in oklab, var(--color-gray-50) 90%, transparent);
1578
+ }
1579
+ }
1580
+
1411
1581
  .bg-gray-100 {
1412
1582
  background-color: var(--color-gray-100);
1413
1583
  }
@@ -1426,6 +1596,10 @@
1426
1596
  }
1427
1597
  }
1428
1598
 
1599
+ .bg-gray-300 {
1600
+ background-color: var(--color-gray-300);
1601
+ }
1602
+
1429
1603
  .bg-gray-300\/50 {
1430
1604
  background-color: #d1d5dc80;
1431
1605
  }
@@ -1536,6 +1710,24 @@
1536
1710
  background-color: var(--color-neutral-950);
1537
1711
  }
1538
1712
 
1713
+ .bg-red-500\/10 {
1714
+ background-color: #fb2c361a;
1715
+ }
1716
+
1717
+ @supports (color: color-mix(in lab, red, red)) {
1718
+ .bg-red-500\/10 {
1719
+ background-color: color-mix(in oklab, var(--color-red-500) 10%, transparent);
1720
+ }
1721
+ }
1722
+
1723
+ .bg-rose-600 {
1724
+ background-color: var(--color-rose-600);
1725
+ }
1726
+
1727
+ .bg-slate-50 {
1728
+ background-color: var(--color-slate-50);
1729
+ }
1730
+
1539
1731
  .bg-transparent {
1540
1732
  background-color: #0000;
1541
1733
  }
@@ -1544,6 +1736,16 @@
1544
1736
  background-color: var(--color-white);
1545
1737
  }
1546
1738
 
1739
+ .bg-white\/10 {
1740
+ background-color: #ffffff1a;
1741
+ }
1742
+
1743
+ @supports (color: color-mix(in lab, red, red)) {
1744
+ .bg-white\/10 {
1745
+ background-color: color-mix(in oklab, var(--color-white) 10%, transparent);
1746
+ }
1747
+ }
1748
+
1547
1749
  .bg-white\/20 {
1548
1750
  background-color: #fff3;
1549
1751
  }
@@ -1574,6 +1776,11 @@
1574
1776
  }
1575
1777
  }
1576
1778
 
1779
+ .bg-gradient-to-b {
1780
+ --tw-gradient-position: to bottom in oklab;
1781
+ background-image: linear-gradient(var(--tw-gradient-stops));
1782
+ }
1783
+
1577
1784
  .bg-gradient-to-r {
1578
1785
  --tw-gradient-position: to right in oklab;
1579
1786
  background-image: linear-gradient(var(--tw-gradient-stops));
@@ -1584,11 +1791,21 @@
1584
1791
  --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));
1585
1792
  }
1586
1793
 
1794
+ .from-slate-50 {
1795
+ --tw-gradient-from: var(--color-slate-50);
1796
+ --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));
1797
+ }
1798
+
1587
1799
  .to-\[\#03945a\] {
1588
1800
  --tw-gradient-to: #03945a;
1589
1801
  --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));
1590
1802
  }
1591
1803
 
1804
+ .to-slate-100 {
1805
+ --tw-gradient-to: var(--color-slate-100);
1806
+ --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));
1807
+ }
1808
+
1592
1809
  .object-contain {
1593
1810
  object-fit: contain;
1594
1811
  }
@@ -1597,6 +1814,10 @@
1597
1814
  object-fit: cover;
1598
1815
  }
1599
1816
 
1817
+ .p-0\.5 {
1818
+ padding: calc(var(--spacing) * .5);
1819
+ }
1820
+
1600
1821
  .p-1 {
1601
1822
  padding: calc(var(--spacing) * 1);
1602
1823
  }
@@ -1625,6 +1846,10 @@
1625
1846
  padding: calc(var(--spacing) * 6);
1626
1847
  }
1627
1848
 
1849
+ .p-8 {
1850
+ padding: calc(var(--spacing) * 8);
1851
+ }
1852
+
1628
1853
  .px-1 {
1629
1854
  padding-inline: calc(var(--spacing) * 1);
1630
1855
  }
@@ -1641,6 +1866,10 @@
1641
1866
  padding-inline: calc(var(--spacing) * 3);
1642
1867
  }
1643
1868
 
1869
+ .px-3\.5 {
1870
+ padding-inline: calc(var(--spacing) * 3.5);
1871
+ }
1872
+
1644
1873
  .px-4 {
1645
1874
  padding-inline: calc(var(--spacing) * 4);
1646
1875
  }
@@ -1780,6 +2009,14 @@
1780
2009
  line-height: var(--tw-leading, var(--text-xs--line-height));
1781
2010
  }
1782
2011
 
2012
+ .text-\[8px\] {
2013
+ font-size: 8px;
2014
+ }
2015
+
2016
+ .text-\[9px\] {
2017
+ font-size: 9px;
2018
+ }
2019
+
1783
2020
  .text-\[10px\] {
1784
2021
  font-size: 10px;
1785
2022
  }
@@ -1852,6 +2089,10 @@
1852
2089
  color: var(--color-blue-400);
1853
2090
  }
1854
2091
 
2092
+ .text-cyan-600 {
2093
+ color: var(--color-cyan-600);
2094
+ }
2095
+
1855
2096
  .text-gray-200 {
1856
2097
  color: var(--color-gray-200);
1857
2098
  }
@@ -1872,10 +2113,22 @@
1872
2113
  color: var(--color-gray-600);
1873
2114
  }
1874
2115
 
2116
+ .text-gray-700 {
2117
+ color: var(--color-gray-700);
2118
+ }
2119
+
1875
2120
  .text-gray-800 {
1876
2121
  color: var(--color-gray-800);
1877
2122
  }
1878
2123
 
2124
+ .text-gray-900 {
2125
+ color: var(--color-gray-900);
2126
+ }
2127
+
2128
+ .text-neutral-100 {
2129
+ color: var(--color-neutral-100);
2130
+ }
2131
+
1879
2132
  .text-neutral-200 {
1880
2133
  color: var(--color-neutral-200);
1881
2134
  }
@@ -1884,6 +2137,10 @@
1884
2137
  color: var(--color-neutral-300);
1885
2138
  }
1886
2139
 
2140
+ .text-neutral-400 {
2141
+ color: var(--color-neutral-400);
2142
+ }
2143
+
1887
2144
  .text-neutral-800 {
1888
2145
  color: var(--color-neutral-800);
1889
2146
  }
@@ -1970,6 +2227,10 @@
1970
2227
  opacity: 1;
1971
2228
  }
1972
2229
 
2230
+ .mix-blend-overlay {
2231
+ mix-blend-mode: overlay;
2232
+ }
2233
+
1973
2234
  .shadow {
1974
2235
  --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, #0000001a), 0 1px 2px -1px var(--tw-shadow-color, #0000001a);
1975
2236
  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
@@ -2059,6 +2320,11 @@
2059
2320
  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
2321
  }
2061
2322
 
2323
+ .blur-xl {
2324
+ --tw-blur: blur(var(--blur-xl));
2325
+ 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, );
2326
+ }
2327
+
2062
2328
  .grayscale {
2063
2329
  --tw-grayscale: grayscale(100%);
2064
2330
  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, );
@@ -2084,6 +2350,12 @@
2084
2350
  backdrop-filter: var(--tw-backdrop-blur, ) var(--tw-backdrop-brightness, ) var(--tw-backdrop-contrast, ) var(--tw-backdrop-grayscale, ) var(--tw-backdrop-hue-rotate, ) var(--tw-backdrop-invert, ) var(--tw-backdrop-opacity, ) var(--tw-backdrop-saturate, ) var(--tw-backdrop-sepia, );
2085
2351
  }
2086
2352
 
2353
+ .backdrop-blur-sm {
2354
+ --tw-backdrop-blur: blur(var(--blur-sm));
2355
+ -webkit-backdrop-filter: var(--tw-backdrop-blur, ) var(--tw-backdrop-brightness, ) var(--tw-backdrop-contrast, ) var(--tw-backdrop-grayscale, ) var(--tw-backdrop-hue-rotate, ) var(--tw-backdrop-invert, ) var(--tw-backdrop-opacity, ) var(--tw-backdrop-saturate, ) var(--tw-backdrop-sepia, );
2356
+ backdrop-filter: var(--tw-backdrop-blur, ) var(--tw-backdrop-brightness, ) var(--tw-backdrop-contrast, ) var(--tw-backdrop-grayscale, ) var(--tw-backdrop-hue-rotate, ) var(--tw-backdrop-invert, ) var(--tw-backdrop-opacity, ) var(--tw-backdrop-saturate, ) var(--tw-backdrop-sepia, );
2357
+ }
2358
+
2087
2359
  .backdrop-blur-xl {
2088
2360
  --tw-backdrop-blur: blur(var(--blur-xl));
2089
2361
  -webkit-backdrop-filter: var(--tw-backdrop-blur, ) var(--tw-backdrop-brightness, ) var(--tw-backdrop-contrast, ) var(--tw-backdrop-grayscale, ) var(--tw-backdrop-hue-rotate, ) var(--tw-backdrop-invert, ) var(--tw-backdrop-opacity, ) var(--tw-backdrop-saturate, ) var(--tw-backdrop-sepia, );
@@ -2140,6 +2412,10 @@
2140
2412
  transition-timing-function: var(--ease-in-out);
2141
2413
  }
2142
2414
 
2415
+ .will-change-transform {
2416
+ will-change: transform;
2417
+ }
2418
+
2143
2419
  .outline-none {
2144
2420
  --tw-outline-style: none;
2145
2421
  outline-style: none;
@@ -2150,6 +2426,10 @@
2150
2426
  user-select: none;
2151
2427
  }
2152
2428
 
2429
+ .\[perspective\:1200px\] {
2430
+ perspective: 1200px;
2431
+ }
2432
+
2153
2433
  @media (hover: hover) {
2154
2434
  .group-hover\:scale-105:is(:where(.group):hover *) {
2155
2435
  --tw-scale-x: 105%;
@@ -2158,10 +2438,6 @@
2158
2438
  scale: var(--tw-scale-x) var(--tw-scale-y);
2159
2439
  }
2160
2440
 
2161
- .group-hover\:border-gray-400:is(:where(.group):hover *) {
2162
- border-color: var(--color-gray-400);
2163
- }
2164
-
2165
2441
  .group-hover\:text-white:is(:where(.group):hover *) {
2166
2442
  color: var(--color-white);
2167
2443
  }
@@ -2189,6 +2465,13 @@
2189
2465
  }
2190
2466
 
2191
2467
  @media (hover: hover) {
2468
+ .hover\:scale-110:hover {
2469
+ --tw-scale-x: 110%;
2470
+ --tw-scale-y: 110%;
2471
+ --tw-scale-z: 110%;
2472
+ scale: var(--tw-scale-x) var(--tw-scale-y);
2473
+ }
2474
+
2192
2475
  .hover\:rounded-sm:hover {
2193
2476
  border-radius: var(--radius-sm);
2194
2477
  }
@@ -2213,6 +2496,10 @@
2213
2496
  background-color: #8f99a826;
2214
2497
  }
2215
2498
 
2499
+ .hover\:bg-\[\#333\]:hover {
2500
+ background-color: #333;
2501
+ }
2502
+
2216
2503
  .hover\:bg-\[\#03945a\]:hover {
2217
2504
  background-color: #03945a;
2218
2505
  }
@@ -2225,6 +2512,10 @@
2225
2512
  background-color: var(--color-gray-100);
2226
2513
  }
2227
2514
 
2515
+ .hover\:bg-gray-200:hover {
2516
+ background-color: var(--color-gray-200);
2517
+ }
2518
+
2228
2519
  .hover\:bg-gray-700:hover {
2229
2520
  background-color: var(--color-gray-700);
2230
2521
  }
@@ -2245,6 +2536,16 @@
2245
2536
  background-color: var(--color-neutral-800);
2246
2537
  }
2247
2538
 
2539
+ .hover\:bg-white\/15:hover {
2540
+ background-color: #ffffff26;
2541
+ }
2542
+
2543
+ @supports (color: color-mix(in lab, red, red)) {
2544
+ .hover\:bg-white\/15:hover {
2545
+ background-color: color-mix(in oklab, var(--color-white) 15%, transparent);
2546
+ }
2547
+ }
2548
+
2248
2549
  .hover\:text-\[\#02bc71\]:hover {
2249
2550
  color: #02bc71;
2250
2551
  }
@@ -2287,14 +2588,14 @@
2287
2588
  }
2288
2589
  }
2289
2590
 
2290
- .focus\:border-blue-300:focus {
2291
- border-color: var(--color-blue-300);
2292
- }
2293
-
2294
2591
  .focus\:border-blue-500:focus {
2295
2592
  border-color: var(--color-blue-500);
2296
2593
  }
2297
2594
 
2595
+ .focus\:border-cyan-500:focus {
2596
+ border-color: var(--color-cyan-500);
2597
+ }
2598
+
2298
2599
  .focus\:border-red-500:focus {
2299
2600
  border-color: var(--color-red-500);
2300
2601
  }
@@ -2309,14 +2610,14 @@
2309
2610
  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
2310
2611
  }
2311
2612
 
2312
- .focus\:ring-blue-300:focus {
2313
- --tw-ring-color: var(--color-blue-300);
2314
- }
2315
-
2316
2613
  .focus\:ring-blue-500:focus {
2317
2614
  --tw-ring-color: var(--color-blue-500);
2318
2615
  }
2319
2616
 
2617
+ .focus\:ring-cyan-500:focus {
2618
+ --tw-ring-color: var(--color-cyan-500);
2619
+ }
2620
+
2320
2621
  .focus\:ring-red-500:focus {
2321
2622
  --tw-ring-color: var(--color-red-500);
2322
2623
  }
@@ -2344,6 +2645,10 @@
2344
2645
  scale: .98;
2345
2646
  }
2346
2647
 
2648
+ .active\:cursor-grabbing:active {
2649
+ cursor: grabbing;
2650
+ }
2651
+
2347
2652
  .disabled\:cursor-not-allowed:disabled {
2348
2653
  cursor: not-allowed;
2349
2654
  }
@@ -3028,4 +3333,17 @@ div[class*="driver-stage"], div[id*="driver-stage"], .driver-active-element, #dr
3028
3333
  transform: rotate(360deg);
3029
3334
  }
3030
3335
  }
3336
+
3337
+ @keyframes ping {
3338
+ 75%, 100% {
3339
+ opacity: 0;
3340
+ transform: scale(2);
3341
+ }
3342
+ }
3343
+
3344
+ @keyframes pulse {
3345
+ 50% {
3346
+ opacity: .5;
3347
+ }
3348
+ }
3031
3349
  .driver-active .driver-overlay,.driver-active *{pointer-events:none}.driver-active .driver-active-element,.driver-active .driver-active-element *,.driver-popover,.driver-popover *{pointer-events:auto}@keyframes animate-fade-in{0%{opacity:0}to{opacity:1}}.driver-fade .driver-overlay{animation:animate-fade-in .2s ease-in-out}.driver-fade .driver-popover{animation:animate-fade-in .2s}.driver-popover{all:unset;box-sizing:border-box;color:#2d2d2d;margin:0;padding:15px;border-radius:5px;min-width:250px;max-width:300px;box-shadow:0 1px 10px #0006;z-index:1000000000;position:fixed;top:0;right:0;background-color:#fff}.driver-popover *{font-family:Helvetica Neue,Inter,ui-sans-serif,"Apple Color Emoji",Helvetica,Arial,sans-serif}.driver-popover-title{font:19px/normal sans-serif;font-weight:700;display:block;position:relative;line-height:1.5;zoom:1;margin:0}.driver-popover-close-btn{all:unset;position:absolute;top:0;right:0;width:32px;height:28px;cursor:pointer;font-size:18px;font-weight:500;color:#d2d2d2;z-index:1;text-align:center;transition:color;transition-duration:.2s}.driver-popover-close-btn:hover,.driver-popover-close-btn:focus{color:#2d2d2d}.driver-popover-title[style*=block]+.driver-popover-description{margin-top:5px}.driver-popover-description{margin-bottom:0;font:14px/normal sans-serif;line-height:1.5;font-weight:400;zoom:1}.driver-popover-footer{margin-top:15px;text-align:right;zoom:1;display:flex;align-items:center;justify-content:space-between}.driver-popover-progress-text{font-size:13px;font-weight:400;color:#727272;zoom:1}.driver-popover-footer button{all:unset;display:inline-block;box-sizing:border-box;padding:3px 7px;text-decoration:none;text-shadow:1px 1px 0 #fff;background-color:#fff;color:#2d2d2d;font:12px/normal sans-serif;cursor:pointer;outline:0;zoom:1;line-height:1.3;border:1px solid #ccc;border-radius:3px}.driver-popover-footer .driver-popover-btn-disabled{opacity:.5;pointer-events:none}:not(body):has(>.driver-active-element){overflow:hidden!important}.driver-no-interaction,.driver-no-interaction *{pointer-events:none!important}.driver-popover-footer button:hover,.driver-popover-footer button:focus{background-color:#f7f7f7}.driver-popover-navigation-btns{display:flex;flex-grow:1;justify-content:flex-end}.driver-popover-navigation-btns button+button{margin-left:4px}.driver-popover-arrow{content:"";position:absolute;border:5px solid #fff}.driver-popover-arrow-side-over{display:none}.driver-popover-arrow-side-left{left:100%;border-right-color:transparent;border-bottom-color:transparent;border-top-color:transparent}.driver-popover-arrow-side-right{right:100%;border-left-color:transparent;border-bottom-color:transparent;border-top-color:transparent}.driver-popover-arrow-side-top{top:100%;border-right-color:transparent;border-bottom-color:transparent;border-left-color:transparent}.driver-popover-arrow-side-bottom{bottom:100%;border-left-color:transparent;border-top-color:transparent;border-right-color:transparent}.driver-popover-arrow-side-center{display:none}.driver-popover-arrow-side-left.driver-popover-arrow-align-start,.driver-popover-arrow-side-right.driver-popover-arrow-align-start{top:15px}.driver-popover-arrow-side-top.driver-popover-arrow-align-start,.driver-popover-arrow-side-bottom.driver-popover-arrow-align-start{left:15px}.driver-popover-arrow-align-end.driver-popover-arrow-side-left,.driver-popover-arrow-align-end.driver-popover-arrow-side-right{bottom:15px}.driver-popover-arrow-side-top.driver-popover-arrow-align-end,.driver-popover-arrow-side-bottom.driver-popover-arrow-align-end{right:15px}.driver-popover-arrow-side-left.driver-popover-arrow-align-center,.driver-popover-arrow-side-right.driver-popover-arrow-align-center{top:50%;margin-top:-5px}.driver-popover-arrow-side-top.driver-popover-arrow-align-center,.driver-popover-arrow-side-bottom.driver-popover-arrow-align-center{left:50%;margin-left:-5px}.driver-popover-arrow-none{display:none}