@brumaombra/ui-vintage 0.6.6 → 0.6.8

package/dist/style.css

@@ -22,6 +22,15 @@
       --tw-space-y-reverse: 0;
       --tw-space-x-reverse: 0;
       --tw-border-style: solid;
+      --tw-gradient-position: initial;
+      --tw-gradient-from: #0000;
+      --tw-gradient-via: #0000;
+      --tw-gradient-to: #0000;
+      --tw-gradient-stops: initial;
+      --tw-gradient-via-stops: initial;
+      --tw-gradient-from-position: 0%;
+      --tw-gradient-via-position: 50%;
+      --tw-gradient-to-position: 100%;
       --tw-leading: initial;
       --tw-font-weight: initial;
       --tw-tracking: initial;
@@ -69,10 +78,10 @@
       --tw-backdrop-sepia: initial;
       --tw-duration: initial;
       --tw-ease: initial;
-      --tw-content: "";
       --tw-scale-x: 1;
       --tw-scale-y: 1;
       --tw-scale-z: 1;
+      --tw-content: "";
       --tw-animation-delay: 0s;
       --tw-animation-direction: normal;
       --tw-animation-duration: initial;
@@ -126,6 +135,7 @@
     --color-green-100: oklch(96.2% .044 156.743);
     --color-green-200: oklch(92.5% .084 155.995);
     --color-green-400: oklch(79.2% .209 151.711);
+    --color-green-500: oklch(72.3% .219 149.579);
     --color-green-600: oklch(62.7% .194 149.214);
     --color-green-700: oklch(52.7% .154 150.069);
     --color-green-800: oklch(44.8% .119 151.328);
@@ -135,6 +145,7 @@
     --color-blue-100: oklch(93.2% .032 255.585);
     --color-blue-200: oklch(88.2% .059 254.128);
     --color-blue-400: oklch(70.7% .165 254.624);
+    --color-blue-500: oklch(62.3% .214 259.815);
     --color-blue-600: oklch(54.6% .245 262.881);
     --color-blue-700: oklch(48.8% .243 264.376);
     --color-blue-800: oklch(42.4% .199 265.638);
@@ -143,6 +154,7 @@
     --color-gray-100: oklch(96.7% .003 264.542);
     --color-gray-400: oklch(70.7% .022 261.325);
     --color-gray-600: oklch(44.6% .03 256.802);
+    --color-gray-800: oklch(27.8% .033 256.848);
     --color-black: #000;
     --color-white: #fff;
     --spacing: .25rem;
@@ -150,6 +162,7 @@
     --container-md: 28rem;
     --container-lg: 32rem;
     --container-xl: 36rem;
+    --container-4xl: 56rem;
     --container-6xl: 72rem;
     --container-7xl: 80rem;
     --text-xs: .75rem;
@@ -168,6 +181,8 @@
     --text-3xl--line-height: calc(2.25 / 1.875);
     --text-4xl: 2.25rem;
     --text-4xl--line-height: calc(2.5 / 2.25);
+    --text-6xl: 3.75rem;
+    --text-6xl--line-height: 1;
     --font-weight-normal: 400;
     --font-weight-semibold: 600;
     --font-weight-bold: 700;
@@ -180,6 +195,7 @@
     --ease-in-out: cubic-bezier(.4, 0, .2, 1);
     --animate-spin: spin 1s linear infinite;
     --animate-pulse: pulse 2s cubic-bezier(.4, 0, .6, 1) infinite;
+    --aspect-video: 16 / 9;
     --default-transition-duration: .15s;
     --default-transition-timing-function: cubic-bezier(.4, 0, .2, 1);
     --default-font-family: var(--font-sans);
@@ -489,6 +505,10 @@
     position: relative;
   }
 
+  .static {
+    position: static;
+  }
+
   .sticky {
     position: sticky;
   }
@@ -541,6 +561,14 @@
     top: 50%;
   }
 
+  .top-\[140px\] {
+    top: 140px;
+  }
+
+  .top-\[calc\(50\%-4rem\)\] {
+    top: calc(50% - 4rem);
+  }
+
   .right-0 {
     right: calc(var(--spacing) * 0);
   }
@@ -565,6 +593,10 @@
     right: calc(var(--spacing) * 4);
   }
 
+  .right-\[calc\(50\%-600px\)\] {
+    right: calc(50% - 600px);
+  }
+
   .bottom-0 {
     bottom: calc(var(--spacing) * 0);
   }
@@ -573,10 +605,22 @@
     bottom: calc(var(--spacing) * 3);
   }
 
+  .bottom-4 {
+    bottom: calc(var(--spacing) * 4);
+  }
+
   .left-0 {
     left: calc(var(--spacing) * 0);
   }
 
+  .left-1\/2 {
+    left: 50%;
+  }
+
+  .left-2 {
+    left: calc(var(--spacing) * 2);
+  }
+
   .left-\[4px\] {
     left: 4px;
   }
@@ -687,6 +731,10 @@
     margin-block: calc(var(--spacing) * 1);
   }
 
+  .my-4 {
+    margin-block: calc(var(--spacing) * 4);
+  }
+
   .my-6 {
     margin-block: calc(var(--spacing) * 6);
   }
@@ -695,6 +743,10 @@
     margin-inline-end: calc(var(--spacing) * -1);
   }
 
+  .me-3 {
+    margin-inline-end: calc(var(--spacing) * 3);
+  }
+
   .mt-0\.5 {
     margin-top: calc(var(--spacing) * .5);
   }
@@ -719,6 +771,10 @@
     margin-top: calc(var(--spacing) * 6);
   }
 
+  .mt-8 {
+    margin-top: calc(var(--spacing) * 8);
+  }
+
   .mt-12 {
     margin-top: calc(var(--spacing) * 12);
   }
@@ -735,6 +791,10 @@
     margin-right: calc(var(--spacing) * 2);
   }
 
+  .mr-3 {
+    margin-right: calc(var(--spacing) * 3);
+  }
+
   .mr-4 {
     margin-right: calc(var(--spacing) * 4);
   }
@@ -743,6 +803,10 @@
     margin-bottom: calc(var(--spacing) * 1);
   }
 
+  .mb-2 {
+    margin-bottom: calc(var(--spacing) * 2);
+  }
+
   .mb-3 {
     margin-bottom: calc(var(--spacing) * 3);
   }
@@ -751,14 +815,30 @@
     margin-bottom: calc(var(--spacing) * 4);
   }
 
+  .mb-5 {
+    margin-bottom: calc(var(--spacing) * 5);
+  }
+
   .mb-6 {
     margin-bottom: calc(var(--spacing) * 6);
   }
 
+  .mb-8 {
+    margin-bottom: calc(var(--spacing) * 8);
+  }
+
+  .mb-12 {
+    margin-bottom: calc(var(--spacing) * 12);
+  }
+
   .-ml-1 {
     margin-left: calc(var(--spacing) * -1);
   }
 
+  .ml-1 {
+    margin-left: calc(var(--spacing) * 1);
+  }
+
   .ml-2 {
     margin-left: calc(var(--spacing) * 2);
   }
@@ -778,6 +858,13 @@
     overflow: hidden;
   }
 
+  .line-clamp-2 {
+    -webkit-line-clamp: 2;
+    -webkit-box-orient: vertical;
+    display: -webkit-box;
+    overflow: hidden;
+  }
+
   .line-clamp-3 {
     -webkit-line-clamp: 3;
     -webkit-box-orient: vertical;
@@ -809,6 +896,10 @@
     display: inline;
   }
 
+  .inline-block {
+    display: inline-block;
+  }
+
   .inline-flex {
     display: inline-flex;
   }
@@ -837,6 +928,10 @@
     aspect-ratio: 1;
   }
 
+  .aspect-video {
+    aspect-ratio: var(--aspect-video);
+  }
+
   .size-2\.5 {
     width: calc(var(--spacing) * 2.5);
     height: calc(var(--spacing) * 2.5);
@@ -954,6 +1049,18 @@
     height: calc(var(--spacing) * 28);
   }
 
+  .h-36 {
+    height: calc(var(--spacing) * 36);
+  }
+
+  .h-48 {
+    height: calc(var(--spacing) * 48);
+  }
+
+  .h-56 {
+    height: calc(var(--spacing) * 56);
+  }
+
   .h-\[52px\] {
     height: 52px;
   }
@@ -978,6 +1085,14 @@
     max-height: var(--reka-select-content-available-height);
   }
 
+  .max-h-0 {
+    max-height: calc(var(--spacing) * 0);
+  }
+
+  .max-h-96 {
+    max-height: calc(var(--spacing) * 96);
+  }
+
   .max-h-\[300px\] {
     max-height: 300px;
   }
@@ -1022,6 +1137,10 @@
     min-height: 100svh;
   }
 
+  .\!w-8 {
+    width: calc(var(--spacing) * 8) !important;
+  }
+
   .w-\(--sidebar-width\) {
     width: var(--sidebar-width);
   }
@@ -1046,6 +1165,18 @@
     width: 83.3333%;
   }
 
+  .w-8 {
+    width: calc(var(--spacing) * 8);
+  }
+
+  .w-9 {
+    width: calc(var(--spacing) * 9);
+  }
+
+  .w-10 {
+    width: calc(var(--spacing) * 10);
+  }
+
   .w-12 {
     width: calc(var(--spacing) * 12);
   }
@@ -1098,6 +1229,10 @@
     max-width: var(--skeleton-width);
   }
 
+  .max-w-4xl {
+    max-width: var(--container-4xl);
+  }
+
   .max-w-6xl {
     max-width: var(--container-6xl);
   }
@@ -1118,6 +1253,10 @@
     max-width: var(--container-md);
   }
 
+  .max-w-none {
+    max-width: none;
+  }
+
   .max-w-sm {
     max-width: var(--container-sm);
   }
@@ -1158,7 +1297,7 @@
     flex-shrink: 0;
   }
 
-  .grow {
+  .flex-grow, .grow {
     flex-grow: 1;
   }
 
@@ -1217,6 +1356,10 @@
     rotate: 45deg;
   }
 
+  .rotate-180 {
+    rotate: 180deg;
+  }
+
   .transform {
     transform: var(--tw-rotate-x, ) var(--tw-rotate-y, ) var(--tw-rotate-z, ) var(--tw-skew-x, ) var(--tw-skew-y, );
   }
@@ -1273,6 +1416,10 @@
     grid-template-columns: 0 1fr;
   }
 
+  .\!flex-row {
+    flex-direction: row !important;
+  }
+
   .flex-col {
     flex-direction: column;
   }
@@ -1353,6 +1500,10 @@
     gap: calc(var(--spacing) * 4);
   }
 
+  .gap-5 {
+    gap: calc(var(--spacing) * 5);
+  }
+
   .gap-6 {
     gap: calc(var(--spacing) * 6);
   }
@@ -1365,6 +1516,18 @@
     gap: calc(var(--spacing) * 8);
   }
 
+  :where(.\!space-y-6 > :not(:last-child)) {
+    --tw-space-y-reverse: 0 !important;
+    margin-block-start: calc(calc(var(--spacing) * 6) * var(--tw-space-y-reverse)) !important;
+    margin-block-end: calc(calc(var(--spacing) * 6) * calc(1 - var(--tw-space-y-reverse))) !important;
+  }
+
+  :where(.space-y-1 > :not(:last-child)) {
+    --tw-space-y-reverse: 0;
+    margin-block-start: calc(calc(var(--spacing) * 1) * var(--tw-space-y-reverse));
+    margin-block-end: calc(calc(var(--spacing) * 1) * calc(1 - var(--tw-space-y-reverse)));
+  }
+
   :where(.space-y-2 > :not(:last-child)) {
     --tw-space-y-reverse: 0;
     margin-block-start: calc(calc(var(--spacing) * 2) * var(--tw-space-y-reverse));
@@ -1395,6 +1558,12 @@
     margin-block-end: calc(calc(var(--spacing) * 8) * calc(1 - var(--tw-space-y-reverse)));
   }
 
+  :where(.space-y-12 > :not(:last-child)) {
+    --tw-space-y-reverse: 0;
+    margin-block-start: calc(calc(var(--spacing) * 12) * var(--tw-space-y-reverse));
+    margin-block-end: calc(calc(var(--spacing) * 12) * calc(1 - var(--tw-space-y-reverse)));
+  }
+
   :where(.space-x-1 > :not(:last-child)) {
     --tw-space-x-reverse: 0;
     margin-inline-start: calc(calc(var(--spacing) * 1) * var(--tw-space-x-reverse));
@@ -1435,6 +1604,10 @@
     overflow: hidden;
   }
 
+  .overflow-x-auto {
+    overflow-x: auto;
+  }
+
   .overflow-x-hidden {
     overflow-x: hidden;
   }
@@ -1455,6 +1628,10 @@
     border-radius: 2px;
   }
 
+  .rounded-\[4px\] {
+    border-radius: 4px;
+  }
+
   .rounded-\[inherit\] {
     border-radius: inherit;
   }
@@ -1574,6 +1751,10 @@
     border-left-color: #0000;
   }
 
+  .\!bg-\[var\(--text-primary-light\)\] {
+    background-color: var(--text-primary-light) !important;
+  }
+
   .bg-\(--bg-surface-light\) {
     background-color: var(--bg-surface-light);
   }
@@ -1590,6 +1771,10 @@
     background-color: var(--text-secondary-light);
   }
 
+  .bg-\[var\(--bg-card-light\)\] {
+    background-color: var(--bg-card-light);
+  }
+
   .bg-\[var\(--bg-main-light\)\] {
     background-color: var(--bg-main-light);
   }
@@ -1602,6 +1787,10 @@
     background-color: var(--bg-surface-light);
   }
 
+  .bg-\[var\(--border-light\)\] {
+    background-color: var(--border-light);
+  }
+
   .bg-amber-50 {
     background-color: var(--color-amber-50);
   }
@@ -1610,6 +1799,10 @@
     background-color: var(--background);
   }
 
+  .bg-black {
+    background-color: var(--color-black);
+  }
+
   .bg-black\/45 {
     background-color: #00000073;
   }
@@ -1624,6 +1817,14 @@
     background-color: var(--color-blue-50);
   }
 
+  .bg-blue-400 {
+    background-color: var(--color-blue-400);
+  }
+
+  .bg-blue-700 {
+    background-color: var(--color-blue-700);
+  }
+
   .bg-border {
     background-color: var(--border);
   }
@@ -1644,6 +1845,10 @@
     background-color: var(--color-green-50);
   }
 
+  .bg-green-500 {
+    background-color: var(--color-green-500);
+  }
+
   .bg-muted, .bg-muted\/50 {
     background-color: var(--muted);
   }
@@ -1686,10 +1891,36 @@
     background-color: var(--color-yellow-50);
   }
 
+  .bg-gradient-to-l {
+    --tw-gradient-position: to left in oklab;
+    background-image: linear-gradient(var(--tw-gradient-stops));
+  }
+
+  .bg-gradient-to-r {
+    --tw-gradient-position: to right in oklab;
+    background-image: linear-gradient(var(--tw-gradient-stops));
+  }
+
   .bg-\[linear-gradient\(to_right\,\#80808012_1px\,transparent_1px\)\,linear-gradient\(to_bottom\,\#80808012_1px\,transparent_1px\)\] {
     background-image: linear-gradient(to right, #80808012 1px, #0000 1px), linear-gradient(#80808012 1px, #0000 1px);
   }
 
+  .from-transparent {
+    --tw-gradient-from: transparent;
+    --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));
+  }
+
+  .via-\[var\(--border-light\)\] {
+    --tw-gradient-via: var(--border-light);
+    --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);
+    --tw-gradient-stops: var(--tw-gradient-via-stops);
+  }
+
+  .to-\[var\(--border-light\)\] {
+    --tw-gradient-to: var(--border-light);
+    --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));
+  }
+
   .bg-\[size\:20px_20px\] {
     background-size: 20px 20px;
   }
@@ -1702,14 +1933,26 @@
     object-fit: contain;
   }
 
+  .object-cover {
+    object-fit: cover;
+  }
+
   .\!p-0 {
     padding: calc(var(--spacing) * 0) !important;
   }
 
+  .\!p-3 {
+    padding: calc(var(--spacing) * 3) !important;
+  }
+
   .\!p-4 {
     padding: calc(var(--spacing) * 4) !important;
   }
 
+  .\!p-5 {
+    padding: calc(var(--spacing) * 5) !important;
+  }
+
   .p-0 {
     padding: calc(var(--spacing) * 0);
   }
@@ -1734,6 +1977,10 @@
     padding: calc(var(--spacing) * 4);
   }
 
+  .p-5 {
+    padding: calc(var(--spacing) * 5);
+  }
+
   .p-6 {
     padding: calc(var(--spacing) * 6);
   }
@@ -1742,6 +1989,10 @@
     padding: 1px;
   }
 
+  .px-0 {
+    padding-inline: calc(var(--spacing) * 0);
+  }
+
   .px-1 {
     padding-inline: calc(var(--spacing) * 1);
   }
@@ -1854,6 +2105,10 @@
     padding-bottom: calc(var(--spacing) * 5);
   }
 
+  .\!pl-6 {
+    padding-left: calc(var(--spacing) * 6) !important;
+  }
+
   .pl-2 {
     padding-left: calc(var(--spacing) * 2);
   }
@@ -1878,11 +2133,21 @@
     vertical-align: top;
   }
 
+  .\!text-xs {
+    font-size: var(--text-xs) !important;
+    line-height: var(--tw-leading, var(--text-xs--line-height)) !important;
+  }
+
   .text-2xl {
     font-size: var(--text-2xl);
     line-height: var(--tw-leading, var(--text-2xl--line-height));
   }
 
+  .text-3xl {
+    font-size: var(--text-3xl);
+    line-height: var(--tw-leading, var(--text-3xl--line-height));
+  }
+
   .text-4xl {
     font-size: var(--text-4xl);
     line-height: var(--tw-leading, var(--text-4xl--line-height));
@@ -2124,6 +2389,10 @@
     color: #0000;
   }
 
+  .text-white {
+    color: var(--color-white);
+  }
+
   .text-yellow-700 {
     color: var(--color-yellow-700);
   }
@@ -2273,6 +2542,12 @@
     transition-duration: var(--tw-duration, var(--default-transition-duration));
   }
 
+  .transition-\[height\,opacity\] {
+    transition-property: height, opacity;
+    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
+    transition-duration: var(--tw-duration, var(--default-transition-duration));
+  }
+
   .transition-\[left\,right\,width\] {
     transition-property: left, right, width;
     transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
@@ -2337,6 +2612,11 @@
     transition-duration: .3s;
   }
 
+  .duration-500 {
+    --tw-duration: .5s;
+    transition-duration: .5s;
+  }
+
   .ease-in-out {
     --tw-ease: var(--ease-in-out);
     transition-timing-function: var(--ease-in-out);
@@ -2375,6 +2655,13 @@
   }
 
   @media (hover: hover) {
+    .group-hover\:scale-110:is(:where(.group):hover *) {
+      --tw-scale-x: 110%;
+      --tw-scale-y: 110%;
+      --tw-scale-z: 110%;
+      scale: var(--tw-scale-x) var(--tw-scale-y);
+    }
+
     .group-hover\:opacity-100:is(:where(.group):hover *), .group-hover\/menu-item\:opacity-100:is(:where(.group\/menu-item):hover *) {
       opacity: 1;
     }
@@ -2681,6 +2968,11 @@
   }
 
   @media (hover: hover) {
+    .hover\:-translate-y-1:hover {
+      --tw-translate-y: calc(var(--spacing) * -1);
+      translate: var(--tw-translate-x) var(--tw-translate-y);
+    }
+
     .hover\:scale-105:hover {
       --tw-scale-x: 105%;
       --tw-scale-y: 105%;
@@ -2718,14 +3010,30 @@
       background-color: var(--color-blue-100);
     }
 
+    .hover\:bg-blue-500:hover {
+      background-color: var(--color-blue-500);
+    }
+
+    .hover\:bg-blue-800:hover {
+      background-color: var(--color-blue-800);
+    }
+
     .hover\:bg-gray-100:hover {
       background-color: var(--color-gray-100);
     }
 
+    .hover\:bg-gray-800:hover {
+      background-color: var(--color-gray-800);
+    }
+
     .hover\:bg-green-100:hover {
       background-color: var(--color-green-100);
     }
 
+    .hover\:bg-green-600:hover {
+      background-color: var(--color-green-600);
+    }
+
     .hover\:bg-muted\/50:hover {
       background-color: var(--muted);
     }
@@ -2744,6 +3052,10 @@
       background-color: var(--sidebar-accent);
     }
 
+    .hover\:bg-transparent:hover {
+      background-color: #0000;
+    }
+
     .hover\:bg-yellow-100:hover {
       background-color: var(--color-yellow-100);
     }
@@ -2752,6 +3064,10 @@
       color: var(--text-primary-light);
     }
 
+    .hover\:text-\[var\(--text-secondary-light\)\]:hover {
+      color: var(--text-secondary-light);
+    }
+
     .hover\:text-foreground:hover {
       color: var(--foreground);
     }
@@ -2764,6 +3080,10 @@
       text-decoration-line: underline;
     }
 
+    .hover\:opacity-75:hover {
+      opacity: .75;
+    }
+
     .hover\:opacity-80:hover {
       opacity: .8;
     }
@@ -3379,6 +3699,26 @@
     margin-top: calc(var(--spacing) * -1);
   }
 
+  @media (prefers-reduced-motion: reduce) {
+    .motion-reduce\:transition-none {
+      transition-property: none;
+    }
+
+    @media (hover: hover) {
+      .motion-reduce\:hover\:translate-y-0:hover {
+        --tw-translate-y: calc(var(--spacing) * 0);
+        translate: var(--tw-translate-x) var(--tw-translate-y);
+      }
+
+      .motion-reduce\:hover\:scale-100:hover {
+        --tw-scale-x: 100%;
+        --tw-scale-y: 100%;
+        --tw-scale-z: 100%;
+        scale: var(--tw-scale-x) var(--tw-scale-y);
+      }
+    }
+  }
+
   @media not all and (min-width: 40rem) {
     .max-sm\:\[display\:-webkit-box\] {
       display: -webkit-box;
@@ -3426,10 +3766,18 @@
       bottom: calc(var(--spacing) * 6);
     }
 
+    .sm\:my-12 {
+      margin-block: calc(var(--spacing) * 12);
+    }
+
     .sm\:mt-0 {
       margin-top: calc(var(--spacing) * 0);
     }
 
+    .sm\:mt-16 {
+      margin-top: calc(var(--spacing) * 16);
+    }
+
     .sm\:mr-4 {
       margin-right: calc(var(--spacing) * 4);
     }
@@ -3438,6 +3786,10 @@
       margin-bottom: calc(var(--spacing) * 0);
     }
 
+    .sm\:mb-8 {
+      margin-bottom: calc(var(--spacing) * 8);
+    }
+
     .sm\:flex {
       display: flex;
     }
@@ -3461,6 +3813,10 @@
       height: calc(var(--spacing) * 10);
     }
 
+    .sm\:\!h-4 {
+      height: calc(var(--spacing) * 4) !important;
+    }
+
     .sm\:h-5 {
       height: calc(var(--spacing) * 5);
     }
@@ -3473,6 +3829,14 @@
       min-height: calc(var(--spacing) * 12);
     }
 
+    .sm\:\!w-4 {
+      width: calc(var(--spacing) * 4) !important;
+    }
+
+    .sm\:\!w-7 {
+      width: calc(var(--spacing) * 7) !important;
+    }
+
     .sm\:w-5 {
       width: calc(var(--spacing) * 5);
     }
@@ -3525,6 +3889,10 @@
       align-items: center;
     }
 
+    .sm\:items-end {
+      align-items: flex-end;
+    }
+
     .sm\:items-start {
       align-items: flex-start;
     }
@@ -3541,6 +3909,10 @@
       justify-content: flex-start;
     }
 
+    .sm\:\!gap-3 {
+      gap: calc(var(--spacing) * 3) !important;
+    }
+
     .sm\:\!gap-6 {
       gap: calc(var(--spacing) * 6) !important;
     }
@@ -3565,6 +3937,18 @@
       gap: calc(var(--spacing) * 3);
     }
 
+    .sm\:gap-4 {
+      gap: calc(var(--spacing) * 4);
+    }
+
+    .sm\:gap-6 {
+      gap: calc(var(--spacing) * 6);
+    }
+
+    .sm\:gap-8 {
+      gap: calc(var(--spacing) * 8);
+    }
+
     .sm\:gap-x-4 {
       column-gap: calc(var(--spacing) * 4);
     }
@@ -3615,6 +3999,16 @@
       text-align: left;
     }
 
+    .sm\:\!text-3xl {
+      font-size: var(--text-3xl) !important;
+      line-height: var(--tw-leading, var(--text-3xl--line-height)) !important;
+    }
+
+    .sm\:\!text-xs {
+      font-size: var(--text-xs) !important;
+      line-height: var(--tw-leading, var(--text-xs--line-height)) !important;
+    }
+
     .sm\:text-base {
       font-size: var(--text-base);
       line-height: var(--tw-leading, var(--text-base--line-height));
@@ -3637,6 +4031,18 @@
   }
 
   @media (min-width: 48rem) {
+    .md\:my-6 {
+      margin-block: calc(var(--spacing) * 6);
+    }
+
+    .md\:mt-10 {
+      margin-top: calc(var(--spacing) * 10);
+    }
+
+    .md\:mb-8 {
+      margin-bottom: calc(var(--spacing) * 8);
+    }
+
     .md\:block {
       display: block;
     }
@@ -3645,6 +4051,18 @@
       display: flex;
     }
 
+    .md\:\!h-10 {
+      height: calc(var(--spacing) * 10) !important;
+    }
+
+    .md\:h-80 {
+      height: calc(var(--spacing) * 80);
+    }
+
+    .md\:\!w-10 {
+      width: calc(var(--spacing) * 10) !important;
+    }
+
     .md\:w-auto {
       width: auto;
     }
@@ -3689,6 +4107,24 @@
       gap: calc(var(--spacing) * 16);
     }
 
+    :where(.md\:\!space-y-8 > :not(:last-child)) {
+      --tw-space-y-reverse: 0 !important;
+      margin-block-start: calc(calc(var(--spacing) * 8) * var(--tw-space-y-reverse)) !important;
+      margin-block-end: calc(calc(var(--spacing) * 8) * calc(1 - var(--tw-space-y-reverse))) !important;
+    }
+
+    .md\:p-8 {
+      padding: calc(var(--spacing) * 8);
+    }
+
+    .md\:px-3 {
+      padding-inline: calc(var(--spacing) * 3);
+    }
+
+    .md\:py-2 {
+      padding-block: calc(var(--spacing) * 2);
+    }
+
     .md\:py-12 {
       padding-block: calc(var(--spacing) * 12);
     }
@@ -3697,6 +4133,16 @@
       text-align: right;
     }
 
+    .md\:\!text-4xl {
+      font-size: var(--text-4xl) !important;
+      line-height: var(--tw-leading, var(--text-4xl--line-height)) !important;
+    }
+
+    .md\:\!text-base {
+      font-size: var(--text-base) !important;
+      line-height: var(--tw-leading, var(--text-base--line-height)) !important;
+    }
+
     .md\:text-2xl {
       font-size: var(--text-2xl);
       line-height: var(--tw-leading, var(--text-2xl--line-height));
@@ -3707,6 +4153,11 @@
       line-height: var(--tw-leading, var(--text-3xl--line-height));
     }
 
+    .md\:text-6xl {
+      font-size: var(--text-6xl);
+      line-height: var(--tw-leading, var(--text-6xl--line-height));
+    }
+
     .md\:text-lg {
       font-size: var(--text-lg);
       line-height: var(--tw-leading, var(--text-lg--line-height));
@@ -3758,6 +4209,14 @@
       grid-column: span 2 / span 2;
     }
 
+    .lg\:mt-16 {
+      margin-top: calc(var(--spacing) * 16);
+    }
+
+    .lg\:mb-12 {
+      margin-bottom: calc(var(--spacing) * 12);
+    }
+
     .lg\:grid-cols-2 {
       grid-template-columns: repeat(2, minmax(0, 1fr));
     }
@@ -3782,6 +4241,10 @@
       justify-content: space-between;
     }
 
+    .lg\:gap-8 {
+      gap: calc(var(--spacing) * 8);
+    }
+
     .lg\:px-8 {
       padding-inline: calc(var(--spacing) * 8);
     }
@@ -3804,6 +4267,14 @@
       grid-column: span 3 / span 3;
     }
 
+    .xl\:\!block {
+      display: block !important;
+    }
+
+    .xl\:hidden {
+      display: none;
+    }
+
     .xl\:grid-cols-3 {
       grid-template-columns: repeat(3, minmax(0, 1fr));
     }
@@ -3921,6 +4392,10 @@
     background-color: var(--bg-card-dark) !important;
   }
 
+  .dark\:\!bg-\[var\(--text-primary-dark\)\]:where(.dark, .dark *) {
+    background-color: var(--text-primary-dark) !important;
+  }
+
   .dark\:\!bg-blue-900\/10:where(.dark, .dark *) {
     background-color: #1c398e1a !important;
   }
@@ -3973,6 +4448,10 @@
     background-color: var(--text-secondary-dark);
   }
 
+  .dark\:bg-\[var\(--bg-card-dark\)\]:where(.dark, .dark *) {
+    background-color: var(--bg-card-dark);
+  }
+
   .dark\:bg-\[var\(--bg-main-dark\)\]:where(.dark, .dark *) {
     background-color: var(--bg-main-dark);
   }
@@ -3985,6 +4464,10 @@
     background-color: var(--bg-surface-dark);
   }
 
+  .dark\:bg-\[var\(--border-dark\)\]:where(.dark, .dark *) {
+    background-color: var(--border-dark);
+  }
+
   .dark\:bg-amber-950\/30:where(.dark, .dark *) {
     background-color: #4619014d;
   }
@@ -4033,6 +4516,17 @@
     background-image: linear-gradient(to right, #ffffff0d 1px, #0000 1px), linear-gradient(#ffffff0d 1px, #0000 1px);
   }
 
+  .dark\:via-\[var\(--border-dark\)\]:where(.dark, .dark *) {
+    --tw-gradient-via: var(--border-dark);
+    --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);
+    --tw-gradient-stops: var(--tw-gradient-via-stops);
+  }
+
+  .dark\:to-\[var\(--border-dark\)\]:where(.dark, .dark *) {
+    --tw-gradient-to: var(--border-dark);
+    --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));
+  }
+
   .dark\:\!text-\(--button-primary-foreground-dark\):where(.dark, .dark *) {
     color: var(--button-primary-foreground-dark) !important;
   }
@@ -4205,6 +4699,10 @@
     .dark\:hover\:text-\(--text-primary-dark\):where(.dark, .dark *):hover, .dark\:hover\:text-\[var\(--text-primary-dark\)\]:where(.dark, .dark *):hover {
       color: var(--text-primary-dark);
     }
+
+    .dark\:hover\:text-\[var\(--text-secondary-dark\)\]:where(.dark, .dark *):hover {
+      color: var(--text-secondary-dark);
+    }
   }
 
   .dark\:focus-visible\:border-\(--border-hover-dark\):where(.dark, .dark *):focus-visible {
@@ -4808,6 +5306,57 @@ body {
   initial-value: solid;
 }
 
+@property --tw-gradient-position {
+  syntax: "*";
+  inherits: false
+}
+
+@property --tw-gradient-from {
+  syntax: "<color>";
+  inherits: false;
+  initial-value: #0000;
+}
+
+@property --tw-gradient-via {
+  syntax: "<color>";
+  inherits: false;
+  initial-value: #0000;
+}
+
+@property --tw-gradient-to {
+  syntax: "<color>";
+  inherits: false;
+  initial-value: #0000;
+}
+
+@property --tw-gradient-stops {
+  syntax: "*";
+  inherits: false
+}
+
+@property --tw-gradient-via-stops {
+  syntax: "*";
+  inherits: false
+}
+
+@property --tw-gradient-from-position {
+  syntax: "<length-percentage>";
+  inherits: false;
+  initial-value: 0%;
+}
+
+@property --tw-gradient-via-position {
+  syntax: "<length-percentage>";
+  inherits: false;
+  initial-value: 50%;
+}
+
+@property --tw-gradient-to-position {
+  syntax: "<length-percentage>";
+  inherits: false;
+  initial-value: 100%;
+}
+
 @property --tw-leading {
   syntax: "*";
   inherits: false
@@ -5054,12 +5603,6 @@ body {
   inherits: false
 }
 
-@property --tw-content {
-  syntax: "*";
-  inherits: false;
-  initial-value: "";
-}
-
 @property --tw-scale-x {
   syntax: "*";
   inherits: false;
@@ -5078,6 +5621,12 @@ body {
   initial-value: 1;
 }
 
+@property --tw-content {
+  syntax: "*";
+  inherits: false;
+  initial-value: "";
+}
+
 @keyframes spin {
   to {
     transform: rotate(360deg);
@@ -5106,6 +5655,42 @@ body {
   }
 }
 
+.slide-enter-active[data-v-dac6f921],
+.slide-leave-active[data-v-dac6f921] {
+    transition: transform 0.75s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.75s cubic-bezier(0.22, 1, 0.36, 1), filter 0.75s cubic-bezier(0.22, 1, 0.36, 1);
+    will-change: transform, opacity, filter;
+}
+.slide-enter-from[data-direction="forward"][data-v-dac6f921] {
+    opacity: 0;
+    transform: translateX(12%) scale(0.985);
+    filter: blur(4px);
+}
+.slide-leave-to[data-direction="forward"][data-v-dac6f921] {
+    opacity: 0;
+    transform: translateX(-12%) scale(0.985);
+    filter: blur(4px);
+}
+.slide-enter-from[data-direction="backward"][data-v-dac6f921] {
+    opacity: 0;
+    transform: translateX(-12%) scale(0.985);
+    filter: blur(4px);
+}
+.slide-leave-to[data-direction="backward"][data-v-dac6f921] {
+    opacity: 0;
+    transform: translateX(12%) scale(0.985);
+    filter: blur(4px);
+}
+.slide-leave-active[data-v-dac6f921] {
+    position: absolute;
+    width: 100%;
+}
+.slide-enter-to[data-v-dac6f921],
+.slide-leave-from[data-v-dac6f921] {
+    opacity: 1;
+    transform: translateX(0) scale(1);
+    filter: blur(0);
+}
+
 .toast-enter-active[data-v-09cd0f70],
 .toast-leave-active[data-v-09cd0f70] {
     transition: all 0.3s ease-in-out;