@uipath/apollo-wind 0.9.0 → 0.10.0-pr219.eea0372

package/dist/styles.css

@@ -222,9 +222,11 @@
     --container-sm: 24rem;
     --container-md: 28rem;
     --container-lg: 32rem;
+    --container-xl: 36rem;
     --container-2xl: 42rem;
     --container-3xl: 48rem;
     --container-4xl: 56rem;
+    --container-5xl: 64rem;
     --container-6xl: 72rem;
     --container-7xl: 80rem;
     --text-xs: 0.75rem;
@@ -251,9 +253,9 @@
     --tracking-tight: -0.025em;
     --tracking-normal: 0em;
     --tracking-wide: 0.025em;
+    --tracking-wider: 0.05em;
     --tracking-widest: 0.1em;
     --leading-tight: 1.25;
-    --leading-snug: 1.375;
     --leading-normal: 1.5;
     --leading-relaxed: 1.625;
     --radius-xs: 0.125rem;
@@ -267,6 +269,7 @@
     --animate-spin: spin 1s linear infinite;
     --animate-pulse: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
     --blur-sm: 8px;
+    --blur-xl: 24px;
     --aspect-video: 16 / 9;
     --default-transition-duration: 150ms;
     --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
@@ -419,6 +422,59 @@
     --color-gradient-invoked-end: var(--color-gradient-invoked-end);
     --color-gradient-human-start: var(--color-gradient-human-start);
     --color-gradient-human-end: var(--color-gradient-human-end);
+    --color-future-surface: var(--color-future-surface);
+    --color-future-surface-raised: var(--color-future-surface-raised);
+    --color-future-surface-overlay: var(--color-future-surface-overlay);
+    --color-future-surface-hover: var(--color-future-surface-hover);
+    --color-future-surface-muted: var(--color-future-surface-muted);
+    --color-future-surface-inverse: var(--color-future-surface-inverse);
+    --color-future-accent: var(--color-future-accent);
+    --color-future-accent-subtle: var(--color-future-accent-subtle);
+    --color-future-foreground: var(--color-future-foreground);
+    --color-future-foreground-secondary: var(--color-future-foreground-secondary);
+    --color-future-foreground-hover: var(--color-future-foreground-hover);
+    --color-future-foreground-muted: var(--color-future-foreground-muted);
+    --color-future-foreground-subtle: var(--color-future-foreground-subtle);
+    --color-future-foreground-inverse: var(--color-future-foreground-inverse);
+    --color-future-foreground-on-accent: var(--color-future-foreground-on-accent);
+    --color-future-foreground-accent: var(--color-future-foreground-accent);
+    --color-future-foreground-accent-muted: var(--color-future-foreground-accent-muted);
+    --color-future-border: var(--color-future-border);
+    --color-future-border-subtle: var(--color-future-border-subtle);
+    --color-future-border-muted: var(--color-future-border-muted);
+    --color-future-border-deep: var(--color-future-border-deep);
+    --color-future-border-inverse: var(--color-future-border-inverse);
+    --color-future-border-hover: var(--color-future-border-hover);
+    --color-future-ring: var(--color-future-ring);
+    --color-legacy-surface: var(--color-legacy-surface);
+    --color-legacy-surface-raised: var(--color-legacy-surface-raised);
+    --color-legacy-surface-overlay: var(--color-legacy-surface-overlay);
+    --color-legacy-surface-hover: var(--color-legacy-surface-hover);
+    --color-legacy-surface-muted: var(--color-legacy-surface-muted);
+    --color-legacy-surface-inverse: var(--color-legacy-surface-inverse);
+    --color-legacy-surface-disabled: var(--color-legacy-surface-disabled);
+    --color-legacy-surface-selected: var(--color-legacy-surface-selected);
+    --color-legacy-accent: var(--color-legacy-accent);
+    --color-legacy-accent-hover: var(--color-legacy-accent-hover);
+    --color-legacy-accent-lighter: var(--color-legacy-accent-lighter);
+    --color-legacy-accent-darker: var(--color-legacy-accent-darker);
+    --color-legacy-foreground: var(--color-legacy-foreground);
+    --color-legacy-foreground-emp: var(--color-legacy-foreground-emp);
+    --color-legacy-foreground-muted: var(--color-legacy-foreground-muted);
+    --color-legacy-foreground-subtle: var(--color-legacy-foreground-subtle);
+    --color-legacy-foreground-inverse: var(--color-legacy-foreground-inverse);
+    --color-legacy-foreground-link: var(--color-legacy-foreground-link);
+    --color-legacy-foreground-on-accent: var(--color-legacy-foreground-on-accent);
+    --color-legacy-border: var(--color-legacy-border);
+    --color-legacy-border-subtle: var(--color-legacy-border-subtle);
+    --color-legacy-border-disabled: var(--color-legacy-border-disabled);
+    --color-legacy-border-grid: var(--color-legacy-border-grid);
+    --color-legacy-error: var(--color-legacy-error);
+    --color-legacy-success: var(--color-legacy-success);
+    --color-legacy-warning: var(--color-legacy-warning);
+    --color-legacy-info: var(--color-legacy-info);
+    --color-legacy-ring: var(--color-legacy-ring);
+    --color-legacy-logo: var(--color-legacy-logo);
   }
 }
 @layer base {
@@ -573,6 +629,9 @@
   .pointer-events-none {
     pointer-events: none;
   }
+  .collapse {
+    visibility: collapse;
+  }
   .invisible {
     visibility: hidden;
   }
@@ -614,9 +673,6 @@
   .inset-y-0 {
     inset-block: calc(var(--spacing) * 0);
   }
-  .-top-0\.5 {
-    top: calc(var(--spacing) * -0.5);
-  }
   .-top-2 {
     top: calc(var(--spacing) * -2);
   }
@@ -626,50 +682,53 @@
   .top-1\/2 {
     top: calc(1/2 * 100%);
   }
+  .top-2 {
+    top: calc(var(--spacing) * 2);
+  }
   .top-2\.5 {
     top: calc(var(--spacing) * 2.5);
   }
+  .top-3 {
+    top: calc(var(--spacing) * 3);
+  }
   .top-4 {
     top: calc(var(--spacing) * 4);
   }
-  .top-\[1px\] {
-    top: 1px;
+  .top-12 {
+    top: calc(var(--spacing) * 12);
   }
   .top-\[50\%\] {
     top: 50%;
   }
-  .top-\[60\%\] {
-    top: 60%;
+  .-right-1 {
+    right: calc(var(--spacing) * -1);
   }
-  .top-full {
-    top: 100%;
+  .-right-6 {
+    right: calc(var(--spacing) * -6);
   }
-  .-right-0\.5 {
-    right: calc(var(--spacing) * -0.5);
+  .-right-7 {
+    right: calc(var(--spacing) * -7);
   }
-  .-right-1 {
-    right: calc(var(--spacing) * -1);
+  .-right-8 {
+    right: calc(var(--spacing) * -8);
   }
   .right-0 {
     right: calc(var(--spacing) * 0);
   }
+  .right-2 {
+    right: calc(var(--spacing) * 2);
+  }
   .right-3 {
     right: calc(var(--spacing) * 3);
   }
   .right-4 {
     right: calc(var(--spacing) * 4);
   }
-  .right-6 {
-    right: calc(var(--spacing) * 6);
-  }
   .bottom-0 {
     bottom: calc(var(--spacing) * 0);
   }
-  .bottom-4 {
-    bottom: calc(var(--spacing) * 4);
-  }
-  .bottom-6 {
-    bottom: calc(var(--spacing) * 6);
+  .bottom-5 {
+    bottom: calc(var(--spacing) * 5);
   }
   .left-0 {
     left: calc(var(--spacing) * 0);
@@ -686,21 +745,21 @@
   .left-3 {
     left: calc(var(--spacing) * 3);
   }
-  .left-6 {
-    left: calc(var(--spacing) * 6);
-  }
   .left-\[50\%\] {
     left: 50%;
   }
   .z-10 {
     z-index: 10;
   }
+  .z-20 {
+    z-index: 20;
+  }
+  .z-30 {
+    z-index: 30;
+  }
   .z-50 {
     z-index: 50;
   }
-  .z-\[1\] {
-    z-index: 1;
-  }
   .col-span-2 {
     grid-column: span 2 / span 2;
   }
@@ -716,9 +775,6 @@
   .row-span-2 {
     grid-row: span 2 / span 2;
   }
-  .row-span-3 {
-    grid-row: span 3 / span 3;
-  }
   .container {
     width: 100%;
     @media (width >= 40rem) {
@@ -740,9 +796,6 @@
   .m-0 {
     margin: calc(var(--spacing) * 0);
   }
-  .m-1 {
-    margin: calc(var(--spacing) * 1);
-  }
   .m-4 {
     margin: calc(var(--spacing) * 4);
   }
@@ -752,27 +805,45 @@
   .-mx-2 {
     margin-inline: calc(var(--spacing) * -2);
   }
+  .-mx-6 {
+    margin-inline: calc(var(--spacing) * -6);
+  }
+  .mx-0\.5 {
+    margin-inline: calc(var(--spacing) * 0.5);
+  }
   .mx-1 {
     margin-inline: calc(var(--spacing) * 1);
   }
+  .mx-4 {
+    margin-inline: calc(var(--spacing) * 4);
+  }
   .mx-auto {
     margin-inline: auto;
   }
+  .my-0\.5 {
+    margin-block: calc(var(--spacing) * 0.5);
+  }
   .my-1 {
     margin-block: calc(var(--spacing) * 1);
   }
   .my-2 {
     margin-block: calc(var(--spacing) * 2);
   }
+  .my-3 {
+    margin-block: calc(var(--spacing) * 3);
+  }
+  .my-10 {
+    margin-block: calc(var(--spacing) * 10);
+  }
+  .ms-1 {
+    margin-inline-start: calc(var(--spacing) * 1);
+  }
   .mt-0\.5 {
     margin-top: calc(var(--spacing) * 0.5);
   }
   .mt-1 {
     margin-top: calc(var(--spacing) * 1);
   }
-  .mt-1\.5 {
-    margin-top: calc(var(--spacing) * 1.5);
-  }
   .mt-2 {
     margin-top: calc(var(--spacing) * 2);
   }
@@ -791,8 +862,8 @@
   .mt-8 {
     margin-top: calc(var(--spacing) * 8);
   }
-  .mt-16 {
-    margin-top: calc(var(--spacing) * 16);
+  .mt-20 {
+    margin-top: calc(var(--spacing) * 20);
   }
   .mt-24 {
     margin-top: calc(var(--spacing) * 24);
@@ -800,18 +871,21 @@
   .mt-auto {
     margin-top: auto;
   }
+  .-mr-2 {
+    margin-right: calc(var(--spacing) * -2);
+  }
   .mr-1 {
     margin-right: calc(var(--spacing) * 1);
   }
   .mr-2 {
     margin-right: calc(var(--spacing) * 2);
   }
+  .mr-auto {
+    margin-right: auto;
+  }
   .mb-1 {
     margin-bottom: calc(var(--spacing) * 1);
   }
-  .mb-1\.5 {
-    margin-bottom: calc(var(--spacing) * 1.5);
-  }
   .mb-2 {
     margin-bottom: calc(var(--spacing) * 2);
   }
@@ -821,20 +895,20 @@
   .mb-4 {
     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-3 {
     margin-left: calc(var(--spacing) * -3);
   }
-  .-ml-px {
-    margin-left: -1px;
+  .ml-0\.5 {
+    margin-left: calc(var(--spacing) * 0.5);
   }
   .ml-1 {
     margin-left: calc(var(--spacing) * 1);
@@ -860,15 +934,12 @@
     -webkit-box-orient: vertical;
     -webkit-line-clamp: 1;
   }
-  .line-clamp-2 {
-    overflow: hidden;
-    display: -webkit-box;
-    -webkit-box-orient: vertical;
-    -webkit-line-clamp: 2;
-  }
   .block {
     display: block;
   }
+  .contents {
+    display: contents;
+  }
   .flex {
     display: flex;
   }
@@ -881,12 +952,18 @@
   .inline {
     display: inline;
   }
+  .inline-block {
+    display: inline-block;
+  }
   .inline-flex {
     display: inline-flex;
   }
   .table {
     display: table;
   }
+  .aspect-auto {
+    aspect-ratio: auto;
+  }
   .aspect-square {
     aspect-ratio: 1 / 1;
   }
@@ -901,6 +978,16 @@
     width: --cell-size;
     height: --cell-size;
   }
+  .size-full {
+    width: 100%;
+    height: 100%;
+  }
+  .h-0\.5 {
+    height: calc(var(--spacing) * 0.5);
+  }
+  .h-1 {
+    height: calc(var(--spacing) * 1);
+  }
   .h-1\.5 {
     height: calc(var(--spacing) * 1.5);
   }
@@ -982,12 +1069,15 @@
   .h-\[2px\] {
     height: 2px;
   }
-  .h-\[40px\] {
-    height: 40px;
+  .h-\[42px\] {
+    height: 42px;
   }
   .h-\[60px\] {
     height: 60px;
   }
+  .h-\[120px\] {
+    height: 120px;
+  }
   .h-\[140px\] {
     height: 140px;
   }
@@ -997,9 +1087,15 @@
   .h-\[200px\] {
     height: 200px;
   }
+  .h-\[250px\] {
+    height: 250px;
+  }
   .h-\[300px\] {
     height: 300px;
   }
+  .h-\[360px\] {
+    height: 360px;
+  }
   .h-\[400px\] {
     height: 400px;
   }
@@ -1012,15 +1108,9 @@
   .h-\[700px\] {
     height: 700px;
   }
-  .h-\[calc\(75vh-80px\)\] {
-    height: calc(75vh - 80px);
-  }
   .h-\[calc\(100vh-10rem\)\] {
     height: calc(100vh - 10rem);
   }
-  .h-\[var\(--radix-navigation-menu-viewport-height\)\] {
-    height: var(--radix-navigation-menu-viewport-height);
-  }
   .h-\[var\(--radix-select-trigger-height\)\] {
     height: var(--radix-select-trigger-height);
   }
@@ -1036,6 +1126,9 @@
   .h-screen {
     height: 100vh;
   }
+  .max-h-16 {
+    max-height: calc(var(--spacing) * 16);
+  }
   .max-h-40 {
     max-height: calc(var(--spacing) * 40);
   }
@@ -1045,8 +1138,11 @@
   .max-h-\[--radix-select-content-available-height\] {
     max-height: --radix-select-content-available-height;
   }
-  .max-h-\[75vh\] {
-    max-height: 75vh;
+  .max-h-\[85vh\] {
+    max-height: 85vh;
+  }
+  .max-h-\[120px\] {
+    max-height: 120px;
   }
   .max-h-\[300px\] {
     max-height: 300px;
@@ -1057,6 +1153,9 @@
   .max-h-full {
     max-height: 100%;
   }
+  .min-h-0 {
+    min-height: calc(var(--spacing) * 0);
+  }
   .min-h-5 {
     min-height: calc(var(--spacing) * 5);
   }
@@ -1066,11 +1165,14 @@
   .min-h-\[32px\] {
     min-height: 32px;
   }
+  .min-h-\[78px\] {
+    min-height: 78px;
+  }
   .min-h-\[80px\] {
     min-height: 80px;
   }
-  .min-h-\[120px\] {
-    min-height: 120px;
+  .min-h-\[124px\] {
+    min-height: 124px;
   }
   .min-h-\[400px\] {
     min-height: 400px;
@@ -1084,12 +1186,24 @@
   .w-1 {
     width: calc(var(--spacing) * 1);
   }
+  .w-1\.5 {
+    width: calc(var(--spacing) * 1.5);
+  }
+  .w-1\/2 {
+    width: calc(1/2 * 100%);
+  }
+  .w-1\/3 {
+    width: calc(1/3 * 100%);
+  }
   .w-2 {
     width: calc(var(--spacing) * 2);
   }
   .w-2\.5 {
     width: calc(var(--spacing) * 2.5);
   }
+  .w-2\/3 {
+    width: calc(2/3 * 100%);
+  }
   .w-3 {
     width: calc(var(--spacing) * 3);
   }
@@ -1141,12 +1255,24 @@
   .w-24 {
     width: calc(var(--spacing) * 24);
   }
+  .w-28 {
+    width: calc(var(--spacing) * 28);
+  }
   .w-32 {
     width: calc(var(--spacing) * 32);
   }
+  .w-40 {
+    width: calc(var(--spacing) * 40);
+  }
+  .w-44 {
+    width: calc(var(--spacing) * 44);
+  }
   .w-48 {
     width: calc(var(--spacing) * 48);
   }
+  .w-52 {
+    width: calc(var(--spacing) * 52);
+  }
   .w-56 {
     width: calc(var(--spacing) * 56);
   }
@@ -1180,14 +1306,20 @@
   .w-\[40px\] {
     width: 40px;
   }
-  .w-\[41px\] {
-    width: 41px;
+  .w-\[42px\] {
+    width: 42px;
+  }
+  .w-\[50px\] {
+    width: 50px;
   }
-  .w-\[60\%\] {
-    width: 60%;
+  .w-\[60px\] {
+    width: 60px;
   }
-  .w-\[80\%\] {
-    width: 80%;
+  .w-\[70px\] {
+    width: 70px;
+  }
+  .w-\[80px\] {
+    width: 80px;
   }
   .w-\[100px\] {
     width: 100px;
@@ -1195,9 +1327,18 @@
   .w-\[110px\] {
     width: 110px;
   }
+  .w-\[120px\] {
+    width: 120px;
+  }
+  .w-\[140px\] {
+    width: 140px;
+  }
   .w-\[150px\] {
     width: 150px;
   }
+  .w-\[160px\] {
+    width: 160px;
+  }
   .w-\[180px\] {
     width: 180px;
   }
@@ -1213,21 +1354,48 @@
   .w-\[300px\] {
     width: 300px;
   }
+  .w-\[320px\] {
+    width: 320px;
+  }
   .w-\[350px\] {
     width: 350px;
   }
+  .w-\[360px\] {
+    width: 360px;
+  }
   .w-\[400px\] {
     width: 400px;
   }
+  .w-\[420px\] {
+    width: 420px;
+  }
   .w-\[450px\] {
     width: 450px;
   }
+  .w-\[480px\] {
+    width: 480px;
+  }
+  .w-\[500px\] {
+    width: 500px;
+  }
+  .w-\[550px\] {
+    width: 550px;
+  }
   .w-\[600px\] {
     width: 600px;
   }
+  .w-\[680px\] {
+    width: 680px;
+  }
   .w-\[700px\] {
     width: 700px;
   }
+  .w-\[900px\] {
+    width: 900px;
+  }
+  .w-\[930px\] {
+    width: 930px;
+  }
   .w-auto {
     width: auto;
   }
@@ -1237,9 +1405,6 @@
   .w-full {
     width: 100%;
   }
-  .w-max {
-    width: max-content;
-  }
   .w-px {
     width: 1px;
   }
@@ -1252,29 +1417,44 @@
   .max-w-4xl {
     max-width: var(--container-4xl);
   }
+  .max-w-5xl {
+    max-width: var(--container-5xl);
+  }
   .max-w-6xl {
     max-width: var(--container-6xl);
   }
   .max-w-7xl {
     max-width: var(--container-7xl);
   }
+  .max-w-48 {
+    max-width: calc(var(--spacing) * 48);
+  }
+  .max-w-\[6rem\] {
+    max-width: 6rem;
+  }
+  .max-w-\[85\%\] {
+    max-width: 85%;
+  }
   .max-w-\[120px\] {
     max-width: 120px;
   }
   .max-w-\[200px\] {
     max-width: 200px;
   }
-  .max-w-\[240px\] {
-    max-width: 240px;
+  .max-w-\[220px\] {
+    max-width: 220px;
+  }
+  .max-w-\[360px\] {
+    max-width: 360px;
   }
-  .max-w-\[260px\] {
-    max-width: 260px;
+  .max-w-\[477px\] {
+    max-width: 477px;
   }
-  .max-w-\[280px\] {
-    max-width: 280px;
+  .max-w-\[640px\] {
+    max-width: 640px;
   }
-  .max-w-\[320px\] {
-    max-width: 320px;
+  .max-w-\[680px\] {
+    max-width: 680px;
   }
   .max-w-\[800px\] {
     max-width: 800px;
@@ -1282,24 +1462,30 @@
   .max-w-\[calc\(100\%-2rem\)\] {
     max-width: calc(100% - 2rem);
   }
+  .max-w-\[calc\(100\%-32px\)\] {
+    max-width: calc(100% - 32px);
+  }
   .max-w-full {
     max-width: 100%;
   }
   .max-w-lg {
     max-width: var(--container-lg);
   }
-  .max-w-max {
-    max-width: max-content;
-  }
   .max-w-md {
     max-width: var(--container-md);
   }
   .max-w-sm {
     max-width: var(--container-sm);
   }
+  .max-w-xl {
+    max-width: var(--container-xl);
+  }
   .min-w-0 {
     min-width: calc(var(--spacing) * 0);
   }
+  .min-w-5 {
+    min-width: calc(var(--spacing) * 5);
+  }
   .min-w-9 {
     min-width: calc(var(--spacing) * 9);
   }
@@ -1312,18 +1498,12 @@
   .min-w-\[8rem\] {
     min-width: 8rem;
   }
-  .min-w-\[12rem\] {
-    min-width: 12rem;
-  }
   .min-w-\[var\(--radix-select-trigger-width\)\] {
     min-width: var(--radix-select-trigger-width);
   }
   .flex-1 {
     flex: 1;
   }
-  .flex-shrink-0 {
-    flex-shrink: 0;
-  }
   .shrink-0 {
     flex-shrink: 0;
   }
@@ -1345,9 +1525,6 @@
   .origin-\[--radix-hover-card-content-transform-origin\] {
     transform-origin: --radix-hover-card-content-transform-origin;
   }
-  .origin-\[--radix-menubar-content-transform-origin\] {
-    transform-origin: --radix-menubar-content-transform-origin;
-  }
   .origin-\[--radix-popover-content-transform-origin\] {
     transform-origin: --radix-popover-content-transform-origin;
   }
@@ -1372,6 +1549,10 @@
     --tw-translate-y: calc(calc(1/2 * 100%) * -1);
     translate: var(--tw-translate-x) var(--tw-translate-y);
   }
+  .-translate-y-2 {
+    --tw-translate-y: calc(var(--spacing) * -2);
+    translate: var(--tw-translate-x) var(--tw-translate-y);
+  }
   .translate-y-\[-50\%\] {
     --tw-translate-y: -50%;
     translate: var(--tw-translate-x) var(--tw-translate-y);
@@ -1388,15 +1569,26 @@
     --tw-scale-z: 110%;
     scale: var(--tw-scale-x) var(--tw-scale-y);
   }
-  .rotate-45 {
-    rotate: 45deg;
+  .-scale-x-100 {
+    --tw-scale-x: calc(100% * -1);
+    scale: var(--tw-scale-x) var(--tw-scale-y);
+  }
+  .-scale-y-100 {
+    --tw-scale-y: calc(100% * -1);
+    scale: var(--tw-scale-x) var(--tw-scale-y);
   }
   .rotate-90 {
     rotate: 90deg;
   }
+  .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,);
   }
+  .animate-none {
+    animation: none;
+  }
   .animate-pulse {
     animation: var(--animate-pulse);
   }
@@ -1409,6 +1601,12 @@
   .cursor-default {
     cursor: default;
   }
+  .cursor-grab {
+    cursor: grab;
+  }
+  .cursor-help {
+    cursor: help;
+  }
   .cursor-not-allowed {
     cursor: not-allowed;
   }
@@ -1418,9 +1616,6 @@
   .touch-none {
     touch-action: none;
   }
-  .resize {
-    resize: both;
-  }
   .resize-none {
     resize: none;
   }
@@ -1433,8 +1628,8 @@
   .list-disc {
     list-style-type: disc;
   }
-  .list-none {
-    list-style-type: none;
+  .appearance-none {
+    appearance: none;
   }
   .grid-cols-1 {
     grid-template-columns: repeat(1, minmax(0, 1fr));
@@ -1520,18 +1715,39 @@
   .gap-2 {
     gap: calc(var(--spacing) * 2);
   }
+  .gap-2\.5 {
+    gap: calc(var(--spacing) * 2.5);
+  }
   .gap-3 {
     gap: calc(var(--spacing) * 3);
   }
   .gap-4 {
     gap: calc(var(--spacing) * 4);
   }
+  .gap-5 {
+    gap: calc(var(--spacing) * 5);
+  }
   .gap-6 {
     gap: calc(var(--spacing) * 6);
   }
+  .gap-7 {
+    gap: calc(var(--spacing) * 7);
+  }
   .gap-8 {
     gap: calc(var(--spacing) * 8);
   }
+  .gap-10 {
+    gap: calc(var(--spacing) * 10);
+  }
+  .gap-\[15px\] {
+    gap: 15px;
+  }
+  .gap-\[18px\] {
+    gap: 18px;
+  }
+  .gap-\[37px\] {
+    gap: 37px;
+  }
   .space-y-0 {
     :where(& > :not(:last-child)) {
       --tw-space-y-reverse: 0;
@@ -1595,6 +1811,13 @@
       margin-block-end: calc(calc(var(--spacing) * 8) * calc(1 - var(--tw-space-y-reverse)));
     }
   }
+  .space-y-10 {
+    :where(& > :not(:last-child)) {
+      --tw-space-y-reverse: 0;
+      margin-block-start: calc(calc(var(--spacing) * 10) * var(--tw-space-y-reverse));
+      margin-block-end: calc(calc(var(--spacing) * 10) * calc(1 - var(--tw-space-y-reverse)));
+    }
+  }
   .space-y-12 {
     :where(& > :not(:last-child)) {
       --tw-space-y-reverse: 0;
@@ -1612,13 +1835,6 @@
   .gap-x-8 {
     column-gap: calc(var(--spacing) * 8);
   }
-  .space-x-1 {
-    :where(& > :not(:last-child)) {
-      --tw-space-x-reverse: 0;
-      margin-inline-start: calc(calc(var(--spacing) * 1) * var(--tw-space-x-reverse));
-      margin-inline-end: calc(calc(var(--spacing) * 1) * calc(1 - var(--tw-space-x-reverse)));
-    }
-  }
   .space-x-2 {
     :where(& > :not(:last-child)) {
       --tw-space-x-reverse: 0;
@@ -1671,6 +1887,21 @@
   .rounded-3xl {
     border-radius: var(--radius-3xl);
   }
+  .rounded-\[2px\] {
+    border-radius: 2px;
+  }
+  .rounded-\[4px\] {
+    border-radius: 4px;
+  }
+  .rounded-\[10px\] {
+    border-radius: 10px;
+  }
+  .rounded-\[20px\] {
+    border-radius: 20px;
+  }
+  .rounded-\[32px\] {
+    border-radius: 32px;
+  }
   .rounded-\[inherit\] {
     border-radius: inherit;
   }
@@ -1723,12 +1954,8 @@
     border-top-left-radius: var(--radius-md);
     border-bottom-left-radius: var(--radius-md);
   }
-  .rounded-l-none {
-    border-top-left-radius: 0;
-    border-bottom-left-radius: 0;
-  }
-  .rounded-tl-sm {
-    border-top-left-radius: var(--radius-sm);
+  .rounded-tl-2xl {
+    border-top-left-radius: var(--radius-2xl);
   }
   .rounded-r-2xl {
     border-top-right-radius: var(--radius-2xl);
@@ -1738,6 +1965,9 @@
     border-top-right-radius: var(--radius-md);
     border-bottom-right-radius: var(--radius-md);
   }
+  .rounded-tr-2xl {
+    border-top-right-radius: var(--radius-2xl);
+  }
   .rounded-b-2xl {
     border-bottom-right-radius: var(--radius-2xl);
     border-bottom-left-radius: var(--radius-2xl);
@@ -1746,6 +1976,15 @@
     border-bottom-right-radius: var(--radius-md);
     border-bottom-left-radius: var(--radius-md);
   }
+  .rounded-br-\[4px\] {
+    border-bottom-right-radius: 4px;
+  }
+  .rounded-br-sm {
+    border-bottom-right-radius: var(--radius-sm);
+  }
+  .rounded-bl-2xl {
+    border-bottom-left-radius: var(--radius-2xl);
+  }
   .border {
     border-style: var(--tw-border-style);
     border-width: 1px;
@@ -1758,6 +1997,10 @@
     border-style: var(--tw-border-style);
     border-width: 2px;
   }
+  .border-\[1\.5px\] {
+    border-style: var(--tw-border-style);
+    border-width: 1.5px;
+  }
   .border-t {
     border-top-style: var(--tw-border-style);
     border-top-width: 1px;
@@ -1782,10 +2025,6 @@
     border-left-style: var(--tw-border-style);
     border-left-width: 1px;
   }
-  .border-l-0 {
-    border-left-style: var(--tw-border-style);
-    border-left-width: 0px;
-  }
   .border-l-2 {
     border-left-style: var(--tw-border-style);
     border-left-width: 2px;
@@ -1794,30 +2033,21 @@
     --tw-border-style: dashed;
     border-style: dashed;
   }
+  .border-\(--color-border\) {
+    border-color: var(--color-border);
+  }
   .border-border {
     border-color: var(--color-border);
   }
   .border-border-de-emp {
     border-color: var(--color-border-de-emp);
   }
-  .border-border\/20 {
-    border-color: var(--color-border);
-    @supports (color: color-mix(in lab, red, red)) {
-      border-color: color-mix(in oklab, var(--color-border) 20%, transparent);
-    }
-  }
   .border-border\/30 {
     border-color: var(--color-border);
     @supports (color: color-mix(in lab, red, red)) {
       border-color: color-mix(in oklab, var(--color-border) 30%, transparent);
     }
   }
-  .border-border\/40 {
-    border-color: var(--color-border);
-    @supports (color: color-mix(in lab, red, red)) {
-      border-color: color-mix(in oklab, var(--color-border) 40%, transparent);
-    }
-  }
   .border-border\/50 {
     border-color: var(--color-border);
     @supports (color: color-mix(in lab, red, red)) {
@@ -1827,9 +2057,6 @@
   .border-current {
     border-color: currentcolor;
   }
-  .border-destructive {
-    border-color: var(--color-destructive);
-  }
   .border-destructive\/20 {
     border-color: var(--color-destructive);
     @supports (color: color-mix(in lab, red, red)) {
@@ -1842,6 +2069,27 @@
       border-color: color-mix(in oklab, var(--color-destructive) 50%, transparent);
     }
   }
+  .border-future-accent {
+    border-color: var(--color-future-accent);
+  }
+  .border-future-border {
+    border-color: var(--color-future-border);
+  }
+  .border-future-border-deep {
+    border-color: var(--color-future-border-deep);
+  }
+  .border-future-border-hover {
+    border-color: var(--color-future-border-hover);
+  }
+  .border-future-border-inverse {
+    border-color: var(--color-future-border-inverse);
+  }
+  .border-future-border-muted {
+    border-color: var(--color-future-border-muted);
+  }
+  .border-future-border-subtle {
+    border-color: var(--color-future-border-subtle);
+  }
   .border-gray-200 {
     border-color: var(--color-gray-200);
   }
@@ -1860,9 +2108,21 @@
       border-color: color-mix(in oklab, var(--color-green-500) 20%, transparent);
     }
   }
+  .border-hover {
+    border-color: var(--color-hover);
+  }
   .border-input {
     border-color: var(--color-input);
   }
+  .border-legacy-border {
+    border-color: var(--color-legacy-border);
+  }
+  .border-legacy-border-subtle {
+    border-color: var(--color-legacy-border-subtle);
+  }
+  .border-muted {
+    border-color: var(--color-muted);
+  }
   .border-muted-foreground\/25 {
     border-color: var(--color-muted-foreground);
     @supports (color: color-mix(in lab, red, red)) {
@@ -1902,6 +2162,12 @@
       border-color: color-mix(in oklab, var(--color-red-500) 20%, transparent);
     }
   }
+  .border-red-500\/30 {
+    border-color: color-mix(in srgb, oklch(63.7% 0.237 25.331) 30%, transparent);
+    @supports (color: color-mix(in lab, red, red)) {
+      border-color: color-mix(in oklab, var(--color-red-500) 30%, transparent);
+    }
+  }
   .border-ring {
     border-color: var(--color-ring);
   }
@@ -1917,21 +2183,33 @@
       border-color: color-mix(in oklab, var(--color-yellow-500) 20%, transparent);
     }
   }
-  .border-y-border {
-    border-block-color: var(--color-border);
+  .border-zinc-200 {
+    border-color: var(--color-zinc-200);
+  }
+  .border-zinc-600 {
+    border-color: var(--color-zinc-600);
+  }
+  .border-zinc-700 {
+    border-color: var(--color-zinc-700);
+  }
+  .border-zinc-800 {
+    border-color: var(--color-zinc-800);
+  }
+  .border-zinc-900 {
+    border-color: var(--color-zinc-900);
   }
   .border-t-transparent {
     border-top-color: transparent;
   }
-  .border-r-border {
-    border-right-color: var(--color-border);
-  }
-  .border-l-background {
-    border-left-color: var(--color-background);
+  .border-b-transparent {
+    border-bottom-color: transparent;
   }
   .border-l-transparent {
     border-left-color: transparent;
   }
+  .bg-\(--color-bg\) {
+    background-color: var(--color-bg);
+  }
   .bg-\[\#ff0000\] {
     background-color: #ff0000;
   }
@@ -2019,6 +2297,18 @@
   .bg-blue-500 {
     background-color: var(--color-blue-500);
   }
+  .bg-blue-500\/0 {
+    background-color: color-mix(in srgb, oklch(62.3% 0.214 259.815) 0%, transparent);
+    @supports (color: color-mix(in lab, red, red)) {
+      background-color: color-mix(in oklab, var(--color-blue-500) 0%, transparent);
+    }
+  }
+  .bg-blue-500\/10 {
+    background-color: color-mix(in srgb, oklch(62.3% 0.214 259.815) 10%, transparent);
+    @supports (color: color-mix(in lab, red, red)) {
+      background-color: color-mix(in oklab, var(--color-blue-500) 10%, transparent);
+    }
+  }
   .bg-blue-600 {
     background-color: var(--color-blue-600);
   }
@@ -2040,6 +2330,12 @@
   .bg-card {
     background-color: var(--color-card);
   }
+  .bg-card\/50 {
+    background-color: var(--color-card);
+    @supports (color: color-mix(in lab, red, red)) {
+      background-color: color-mix(in oklab, var(--color-card) 50%, transparent);
+    }
+  }
   .bg-cyan-50 {
     background-color: var(--color-cyan-50);
   }
@@ -2076,6 +2372,9 @@
   .bg-destructive {
     background-color: var(--color-destructive);
   }
+  .bg-destructive-foreground {
+    background-color: var(--color-destructive-foreground);
+  }
   .bg-destructive\/10 {
     background-color: var(--color-destructive);
     @supports (color: color-mix(in lab, red, red)) {
@@ -2115,6 +2414,9 @@
   .bg-emerald-950 {
     background-color: var(--color-emerald-950);
   }
+  .bg-foreground {
+    background-color: var(--color-foreground);
+  }
   .bg-fuchsia-50 {
     background-color: var(--color-fuchsia-50);
   }
@@ -2148,6 +2450,57 @@
   .bg-fuchsia-950 {
     background-color: var(--color-fuchsia-950);
   }
+  .bg-future-accent {
+    background-color: var(--color-future-accent);
+  }
+  .bg-future-accent-subtle {
+    background-color: var(--color-future-accent-subtle);
+  }
+  .bg-future-accent\/10 {
+    background-color: var(--color-future-accent);
+    @supports (color: color-mix(in lab, red, red)) {
+      background-color: color-mix(in oklab, var(--color-future-accent) 10%, transparent);
+    }
+  }
+  .bg-future-accent\/60 {
+    background-color: var(--color-future-accent);
+    @supports (color: color-mix(in lab, red, red)) {
+      background-color: color-mix(in oklab, var(--color-future-accent) 60%, transparent);
+    }
+  }
+  .bg-future-border-subtle {
+    background-color: var(--color-future-border-subtle);
+  }
+  .bg-future-surface {
+    background-color: var(--color-future-surface);
+  }
+  .bg-future-surface-hover {
+    background-color: var(--color-future-surface-hover);
+  }
+  .bg-future-surface-inverse {
+    background-color: var(--color-future-surface-inverse);
+  }
+  .bg-future-surface-muted {
+    background-color: var(--color-future-surface-muted);
+  }
+  .bg-future-surface-overlay {
+    background-color: var(--color-future-surface-overlay);
+  }
+  .bg-future-surface-overlay\/50 {
+    background-color: var(--color-future-surface-overlay);
+    @supports (color: color-mix(in lab, red, red)) {
+      background-color: color-mix(in oklab, var(--color-future-surface-overlay) 50%, transparent);
+    }
+  }
+  .bg-future-surface-raised {
+    background-color: var(--color-future-surface-raised);
+  }
+  .bg-future-surface-raised\/50 {
+    background-color: var(--color-future-surface-raised);
+    @supports (color: color-mix(in lab, red, red)) {
+      background-color: color-mix(in oklab, var(--color-future-surface-raised) 50%, transparent);
+    }
+  }
   .bg-gray-50 {
     background-color: var(--color-gray-50);
   }
@@ -2205,6 +2558,12 @@
       background-color: color-mix(in oklab, var(--color-green-500) 5%, transparent);
     }
   }
+  .bg-green-500\/10 {
+    background-color: color-mix(in srgb, oklch(72.3% 0.219 149.579) 10%, transparent);
+    @supports (color: color-mix(in lab, red, red)) {
+      background-color: color-mix(in oklab, var(--color-green-500) 10%, transparent);
+    }
+  }
   .bg-green-600 {
     background-color: var(--color-green-600);
   }
@@ -2253,14 +2612,26 @@
   .bg-indigo-950 {
     background-color: var(--color-indigo-950);
   }
+  .bg-legacy-accent {
+    background-color: var(--color-legacy-accent);
+  }
+  .bg-legacy-surface {
+    background-color: var(--color-legacy-surface);
+  }
+  .bg-legacy-surface-hover {
+    background-color: var(--color-legacy-surface-hover);
+  }
+  .bg-legacy-surface-overlay {
+    background-color: var(--color-legacy-surface-overlay);
+  }
+  .bg-legacy-surface-raised {
+    background-color: var(--color-legacy-surface-raised);
+  }
   .bg-muted {
     background-color: var(--color-muted);
   }
-  .bg-muted\/10 {
-    background-color: var(--color-muted);
-    @supports (color: color-mix(in lab, red, red)) {
-      background-color: color-mix(in oklab, var(--color-muted) 10%, transparent);
-    }
+  .bg-muted-foreground {
+    background-color: var(--color-muted-foreground);
   }
   .bg-muted\/20 {
     background-color: var(--color-muted);
@@ -2364,6 +2735,9 @@
   .bg-primary {
     background-color: var(--color-primary);
   }
+  .bg-primary-foreground {
+    background-color: var(--color-primary-foreground);
+  }
   .bg-primary\/5 {
     background-color: var(--color-primary);
     @supports (color: color-mix(in lab, red, red)) {
@@ -2439,6 +2813,12 @@
       background-color: color-mix(in oklab, var(--color-red-500) 5%, transparent);
     }
   }
+  .bg-red-500\/10 {
+    background-color: color-mix(in srgb, oklch(63.7% 0.237 25.331) 10%, transparent);
+    @supports (color: color-mix(in lab, red, red)) {
+      background-color: color-mix(in oklab, var(--color-red-500) 10%, transparent);
+    }
+  }
   .bg-red-600 {
     background-color: var(--color-red-600);
   }
@@ -2625,6 +3005,9 @@
   .bg-violet-950 {
     background-color: var(--color-violet-950);
   }
+  .bg-white {
+    background-color: var(--color-white);
+  }
   .bg-yellow-50 {
     background-color: var(--color-yellow-50);
   }
@@ -2649,6 +3032,12 @@
       background-color: color-mix(in oklab, var(--color-yellow-500) 5%, transparent);
     }
   }
+  .bg-yellow-500\/10 {
+    background-color: color-mix(in srgb, oklch(79.5% 0.184 86.047) 10%, transparent);
+    @supports (color: color-mix(in lab, red, red)) {
+      background-color: color-mix(in oklab, var(--color-yellow-500) 10%, transparent);
+    }
+  }
   .bg-yellow-600 {
     background-color: var(--color-yellow-600);
   }
@@ -2709,6 +3098,24 @@
     --tw-gradient-position: to right in oklab;
     background-image: linear-gradient(var(--tw-gradient-stops));
   }
+  .bg-future-gradient-1 {
+    background-image: var(--gradient-future-1);
+  }
+  .bg-future-gradient-2 {
+    background-image: var(--gradient-future-2);
+  }
+  .bg-future-gradient-3 {
+    background-image: var(--gradient-future-3);
+  }
+  .bg-future-gradient-4 {
+    background-image: var(--gradient-future-4);
+  }
+  .bg-future-gradient-5 {
+    background-image: var(--gradient-future-5);
+  }
+  .bg-future-gradient-6 {
+    background-image: var(--gradient-future-6);
+  }
   .from-background {
     --tw-gradient-from: var(--color-background);
     --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));
@@ -2717,11 +3124,8 @@
     --tw-gradient-from: var(--color-foreground);
     --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));
   }
-  .from-muted\/50 {
-    --tw-gradient-from: var(--color-muted);
-    @supports (color: color-mix(in lab, red, red)) {
-      --tw-gradient-from: color-mix(in oklab, var(--color-muted) 50%, transparent);
-    }
+  .from-future-surface {
+    --tw-gradient-from: var(--color-future-surface);
     --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));
   }
   .from-primary\/5 {
@@ -2755,8 +3159,8 @@
     }
     --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));
   }
-  .to-muted {
-    --tw-gradient-to: var(--color-muted);
+  .to-future-surface-raised {
+    --tw-gradient-to: var(--color-future-surface-raised);
     --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));
   }
   .to-muted\/20 {
@@ -2783,6 +3187,12 @@
   .fill-current {
     fill: currentcolor;
   }
+  .fill-foreground {
+    fill: var(--color-foreground);
+  }
+  .fill-muted-foreground {
+    fill: var(--color-muted-foreground);
+  }
   .fill-yellow-400 {
     fill: var(--color-yellow-400);
   }
@@ -2798,9 +3208,6 @@
   .p-1 {
     padding: calc(var(--spacing) * 1);
   }
-  .p-1\.5 {
-    padding: calc(var(--spacing) * 1.5);
-  }
   .p-2 {
     padding: calc(var(--spacing) * 2);
   }
@@ -2849,6 +3256,9 @@
   .px-8 {
     padding-inline: calc(var(--spacing) * 8);
   }
+  .px-10 {
+    padding-inline: calc(var(--spacing) * 10);
+  }
   .px-\[--cell-size\] {
     padding-inline: --cell-size;
   }
@@ -2864,12 +3274,18 @@
   .py-2 {
     padding-block: calc(var(--spacing) * 2);
   }
+  .py-2\.5 {
+    padding-block: calc(var(--spacing) * 2.5);
+  }
   .py-3 {
     padding-block: calc(var(--spacing) * 3);
   }
   .py-4 {
     padding-block: calc(var(--spacing) * 4);
   }
+  .py-5 {
+    padding-block: calc(var(--spacing) * 5);
+  }
   .py-6 {
     padding-block: calc(var(--spacing) * 6);
   }
@@ -2891,21 +3307,33 @@
   .pt-0 {
     padding-top: calc(var(--spacing) * 0);
   }
+  .pt-0\.5 {
+    padding-top: calc(var(--spacing) * 0.5);
+  }
   .pt-1 {
     padding-top: calc(var(--spacing) * 1);
   }
   .pt-2 {
     padding-top: calc(var(--spacing) * 2);
   }
+  .pt-2\.5 {
+    padding-top: calc(var(--spacing) * 2.5);
+  }
   .pt-3 {
     padding-top: calc(var(--spacing) * 3);
   }
+  .pt-4 {
+    padding-top: calc(var(--spacing) * 4);
+  }
   .pt-6 {
     padding-top: calc(var(--spacing) * 6);
   }
   .pt-8 {
     padding-top: calc(var(--spacing) * 8);
   }
+  .pt-\[18px\] {
+    padding-top: 18px;
+  }
   .pr-1 {
     padding-right: calc(var(--spacing) * 1);
   }
@@ -2915,12 +3343,24 @@
   .pr-2\.5 {
     padding-right: calc(var(--spacing) * 2.5);
   }
+  .pr-3 {
+    padding-right: calc(var(--spacing) * 3);
+  }
   .pr-4 {
     padding-right: calc(var(--spacing) * 4);
   }
+  .pr-6 {
+    padding-right: calc(var(--spacing) * 6);
+  }
   .pr-8 {
     padding-right: calc(var(--spacing) * 8);
   }
+  .pr-10 {
+    padding-right: calc(var(--spacing) * 10);
+  }
+  .pb-0 {
+    padding-bottom: calc(var(--spacing) * 0);
+  }
   .pb-2 {
     padding-bottom: calc(var(--spacing) * 2);
   }
@@ -2933,8 +3373,11 @@
   .pb-6 {
     padding-bottom: calc(var(--spacing) * 6);
   }
-  .pb-12 {
-    padding-bottom: calc(var(--spacing) * 12);
+  .pl-0 {
+    padding-left: calc(var(--spacing) * 0);
+  }
+  .pl-1 {
+    padding-left: calc(var(--spacing) * 1);
   }
   .pl-2 {
     padding-left: calc(var(--spacing) * 2);
@@ -2945,18 +3388,27 @@
   .pl-3 {
     padding-left: calc(var(--spacing) * 3);
   }
+  .pl-4 {
+    padding-left: calc(var(--spacing) * 4);
+  }
+  .pl-5 {
+    padding-left: calc(var(--spacing) * 5);
+  }
   .pl-6 {
     padding-left: calc(var(--spacing) * 6);
   }
-  .pl-7 {
-    padding-left: calc(var(--spacing) * 7);
-  }
   .pl-8 {
     padding-left: calc(var(--spacing) * 8);
   }
+  .pl-9 {
+    padding-left: calc(var(--spacing) * 9);
+  }
   .pl-10 {
     padding-left: calc(var(--spacing) * 10);
   }
+  .pl-12 {
+    padding-left: calc(var(--spacing) * 12);
+  }
   .text-center {
     text-align: center;
   }
@@ -2972,6 +3424,9 @@
   .font-mono {
     font-family: var(--font-mono);
   }
+  .font-sans {
+    font-family: var(--font-sans);
+  }
   .text-2xl {
     font-size: var(--text-2xl);
     line-height: var(--tw-leading, var(--text-2xl--line-height));
@@ -3007,12 +3462,54 @@
   .text-\[0\.8rem\] {
     font-size: 0.8rem;
   }
+  .text-\[2rem\] {
+    font-size: 2rem;
+  }
   .text-\[9px\] {
     font-size: 9px;
   }
   .text-\[10px\] {
     font-size: 10px;
   }
+  .text-\[11px\] {
+    font-size: 11px;
+  }
+  .text-\[12px\] {
+    font-size: 12px;
+  }
+  .text-\[13px\] {
+    font-size: 13px;
+  }
+  .text-\[15px\] {
+    font-size: 15px;
+  }
+  .text-\[40px\] {
+    font-size: 40px;
+  }
+  .leading-4 {
+    --tw-leading: calc(var(--spacing) * 4);
+    line-height: calc(var(--spacing) * 4);
+  }
+  .leading-5 {
+    --tw-leading: calc(var(--spacing) * 5);
+    line-height: calc(var(--spacing) * 5);
+  }
+  .leading-6 {
+    --tw-leading: calc(var(--spacing) * 6);
+    line-height: calc(var(--spacing) * 6);
+  }
+  .leading-7 {
+    --tw-leading: calc(var(--spacing) * 7);
+    line-height: calc(var(--spacing) * 7);
+  }
+  .leading-9 {
+    --tw-leading: calc(var(--spacing) * 9);
+    line-height: calc(var(--spacing) * 9);
+  }
+  .leading-\[18px\] {
+    --tw-leading: 18px;
+    line-height: 18px;
+  }
   .leading-none {
     --tw-leading: 1;
     line-height: 1;
@@ -3025,10 +3522,6 @@
     --tw-leading: var(--leading-relaxed);
     line-height: var(--leading-relaxed);
   }
-  .leading-snug {
-    --tw-leading: var(--leading-snug);
-    line-height: var(--leading-snug);
-  }
   .leading-tight {
     --tw-leading: var(--leading-tight);
     line-height: var(--leading-tight);
@@ -3053,6 +3546,26 @@
     --tw-font-weight: var(--font-weight-semibold);
     font-weight: var(--font-weight-semibold);
   }
+  .tracking-\[-0\.3px\] {
+    --tw-tracking: -0.3px;
+    letter-spacing: -0.3px;
+  }
+  .tracking-\[-0\.4px\] {
+    --tw-tracking: -0.4px;
+    letter-spacing: -0.4px;
+  }
+  .tracking-\[-0\.6px\] {
+    --tw-tracking: -0.6px;
+    letter-spacing: -0.6px;
+  }
+  .tracking-\[-0\.8px\] {
+    --tw-tracking: -0.8px;
+    letter-spacing: -0.8px;
+  }
+  .tracking-\[-0\.35px\] {
+    --tw-tracking: -0.35px;
+    letter-spacing: -0.35px;
+  }
   .tracking-normal {
     --tw-tracking: var(--tracking-normal);
     letter-spacing: var(--tracking-normal);
@@ -3065,6 +3578,10 @@
     --tw-tracking: var(--tracking-wide);
     letter-spacing: var(--tracking-wide);
   }
+  .tracking-wider {
+    --tw-tracking: var(--tracking-wider);
+    letter-spacing: var(--tracking-wider);
+  }
   .tracking-widest {
     --tw-tracking: var(--tracking-widest);
     letter-spacing: var(--tracking-widest);
@@ -3078,14 +3595,20 @@
   .whitespace-nowrap {
     white-space: nowrap;
   }
+  .whitespace-pre {
+    white-space: pre;
+  }
   .whitespace-pre-wrap {
     white-space: pre-wrap;
   }
   .text-accent-foreground {
     color: var(--color-accent-foreground);
   }
-  .text-background {
-    color: var(--color-background);
+  .text-amber-500 {
+    color: var(--color-amber-500);
+  }
+  .text-blue-400 {
+    color: var(--color-blue-400);
   }
   .text-blue-500 {
     color: var(--color-blue-500);
@@ -3108,6 +3631,54 @@
   .text-foreground {
     color: var(--color-foreground);
   }
+  .text-foreground\/50 {
+    color: var(--color-foreground);
+    @supports (color: color-mix(in lab, red, red)) {
+      color: color-mix(in oklab, var(--color-foreground) 50%, transparent);
+    }
+  }
+  .text-future-accent {
+    color: var(--color-future-accent);
+  }
+  .text-future-foreground {
+    color: var(--color-future-foreground);
+  }
+  .text-future-foreground-accent {
+    color: var(--color-future-foreground-accent);
+  }
+  .text-future-foreground-accent-muted {
+    color: var(--color-future-foreground-accent-muted);
+  }
+  .text-future-foreground-accent\/70 {
+    color: var(--color-future-foreground-accent);
+    @supports (color: color-mix(in lab, red, red)) {
+      color: color-mix(in oklab, var(--color-future-foreground-accent) 70%, transparent);
+    }
+  }
+  .text-future-foreground-accent\/80 {
+    color: var(--color-future-foreground-accent);
+    @supports (color: color-mix(in lab, red, red)) {
+      color: color-mix(in oklab, var(--color-future-foreground-accent) 80%, transparent);
+    }
+  }
+  .text-future-foreground-hover {
+    color: var(--color-future-foreground-hover);
+  }
+  .text-future-foreground-inverse {
+    color: var(--color-future-foreground-inverse);
+  }
+  .text-future-foreground-muted {
+    color: var(--color-future-foreground-muted);
+  }
+  .text-future-foreground-on-accent {
+    color: var(--color-future-foreground-on-accent);
+  }
+  .text-future-foreground-secondary {
+    color: var(--color-future-foreground-secondary);
+  }
+  .text-future-foreground-subtle {
+    color: var(--color-future-foreground-subtle);
+  }
   .text-gray-50 {
     color: var(--color-gray-50);
   }
@@ -3120,6 +3691,9 @@
   .text-gray-600 {
     color: var(--color-gray-600);
   }
+  .text-green-400 {
+    color: var(--color-green-400);
+  }
   .text-green-500 {
     color: var(--color-green-500);
   }
@@ -3132,6 +3706,18 @@
   .text-green-800 {
     color: var(--color-green-800);
   }
+  .text-legacy-foreground {
+    color: var(--color-legacy-foreground);
+  }
+  .text-legacy-foreground-muted {
+    color: var(--color-legacy-foreground-muted);
+  }
+  .text-legacy-foreground-on-accent {
+    color: var(--color-legacy-foreground-on-accent);
+  }
+  .text-legacy-foreground-subtle {
+    color: var(--color-legacy-foreground-subtle);
+  }
   .text-muted-foreground {
     color: var(--color-muted-foreground);
   }
@@ -3153,9 +3739,30 @@
   .text-primary-foreground {
     color: var(--color-primary-foreground);
   }
+  .text-primary\/60 {
+    color: var(--color-primary);
+    @supports (color: color-mix(in lab, red, red)) {
+      color: color-mix(in oklab, var(--color-primary) 60%, transparent);
+    }
+  }
+  .text-primary\/70 {
+    color: var(--color-primary);
+    @supports (color: color-mix(in lab, red, red)) {
+      color: color-mix(in oklab, var(--color-primary) 70%, transparent);
+    }
+  }
+  .text-primary\/80 {
+    color: var(--color-primary);
+    @supports (color: color-mix(in lab, red, red)) {
+      color: color-mix(in oklab, var(--color-primary) 80%, transparent);
+    }
+  }
   .text-purple-600 {
     color: var(--color-purple-600);
   }
+  .text-red-400 {
+    color: var(--color-red-400);
+  }
   .text-red-500 {
     color: var(--color-red-500);
   }
@@ -3168,6 +3775,9 @@
   .text-secondary-foreground {
     color: var(--color-secondary-foreground);
   }
+  .text-transparent {
+    color: transparent;
+  }
   .text-white {
     color: var(--color-white);
   }
@@ -3186,6 +3796,9 @@
   .capitalize {
     text-transform: capitalize;
   }
+  .normal-case {
+    text-transform: none;
+  }
   .uppercase {
     text-transform: uppercase;
   }
@@ -3205,12 +3818,21 @@
   .underline {
     text-decoration-line: underline;
   }
+  .underline-offset-2 {
+    text-underline-offset: 2px;
+  }
   .underline-offset-4 {
     text-underline-offset: 4px;
   }
+  .accent-primary {
+    accent-color: var(--color-primary);
+  }
   .opacity-0 {
     opacity: 0%;
   }
+  .opacity-40 {
+    opacity: 40%;
+  }
   .opacity-50 {
     opacity: 50%;
   }
@@ -3234,6 +3856,14 @@
     --tw-shadow: 0 25px 50px -12px var(--tw-shadow-color, rgb(0 0 0 / 0.25));
     box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
   }
+  .shadow-\[0px_4px_16px_0px_rgba\(0\,0\,0\,0\.25\)\] {
+    --tw-shadow: 0px 4px 16px 0px var(--tw-shadow-color, rgba(0,0,0,0.25));
+    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
+  }
+  .shadow-\[0px_4px_24px_0px_rgba\(0\,0\,0\,0\.25\)\] {
+    --tw-shadow: 0px 4px 24px 0px var(--tw-shadow-color, rgba(0,0,0,0.25));
+    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
+  }
   .shadow-lg {
     --tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 4px 6px -4px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
     box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
@@ -3250,6 +3880,10 @@
     --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
     box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
   }
+  .shadow-xl {
+    --tw-shadow: 0 20px 25px -5px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 8px 10px -6px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
+    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
+  }
   .shadow-xs {
     --tw-shadow: 0 1px 2px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.05));
     box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
@@ -3262,6 +3896,10 @@
     --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
     box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
   }
+  .ring-1 {
+    --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
+    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
+  }
   .ring-2 {
     --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
     box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
@@ -3269,15 +3907,18 @@
   .ring-emerald-500 {
     --tw-ring-color: var(--color-emerald-500);
   }
-  .ring-primary {
-    --tw-ring-color: var(--color-primary);
-  }
-  .ring-primary\/20 {
-    --tw-ring-color: var(--color-primary);
+  .ring-future-accent\/30 {
+    --tw-ring-color: var(--color-future-accent);
     @supports (color: color-mix(in lab, red, red)) {
-      --tw-ring-color: color-mix(in oklab, var(--color-primary) 20%, transparent);
+      --tw-ring-color: color-mix(in oklab, var(--color-future-accent) 30%, transparent);
     }
   }
+  .ring-future-ring {
+    --tw-ring-color: var(--color-future-ring);
+  }
+  .ring-primary {
+    --tw-ring-color: var(--color-primary);
+  }
   .ring-ring {
     --tw-ring-color: var(--color-ring);
   }
@@ -3304,11 +3945,21 @@
     -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,);
     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,);
   }
+  .backdrop-blur-xl {
+    --tw-backdrop-blur: blur(var(--blur-xl));
+    -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,);
+    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,);
+  }
   .transition {
     transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
     transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
     transition-duration: var(--tw-duration, var(--default-transition-duration));
   }
+  .transition-\[width\] {
+    transition-property: width;
+    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
+    transition-duration: var(--tw-duration, var(--default-transition-duration));
+  }
   .transition-all {
     transition-property: all;
     transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
@@ -3329,6 +3980,9 @@
     transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
     transition-duration: var(--tw-duration, var(--default-transition-duration));
   }
+  .transition-none {
+    transition-property: none;
+  }
   .duration-200 {
     --tw-duration: 200ms;
     transition-duration: 200ms;
@@ -3352,16 +4006,6 @@
   .\[--cell-size\:2\.75rem\] {
     --cell-size: 2.75rem;
   }
-  .group-hover\:bg-primary\/10 {
-    &:is(:where(.group):hover *) {
-      @media (hover: hover) {
-        background-color: var(--color-primary);
-        @supports (color: color-mix(in lab, red, red)) {
-          background-color: color-mix(in oklab, var(--color-primary) 10%, transparent);
-        }
-      }
-    }
-  }
   .group-hover\:bg-primary\/50 {
     &:is(:where(.group):hover *) {
       @media (hover: hover) {
@@ -3446,11 +4090,6 @@
       background-color: var(--color-primary);
     }
   }
-  .group-data-\[state\=open\]\:rotate-180 {
-    &:is(:where(.group)[data-state="open"] *) {
-      rotate: 180deg;
-    }
-  }
   .group-data-\[state\=open\]\/section\:rotate-90 {
     &:is(:where(.group\/section)[data-state="open"] *) {
       rotate: 90deg;
@@ -3535,17 +4174,19 @@
       color: var(--color-foreground);
     }
   }
-  .placeholder\:text-muted-foreground {
+  .placeholder\:text-future-foreground-subtle {
     &::placeholder {
-      color: var(--color-muted-foreground);
+      color: var(--color-future-foreground-subtle);
+    }
+  }
+  .placeholder\:text-legacy-foreground-subtle {
+    &::placeholder {
+      color: var(--color-legacy-foreground-subtle);
     }
   }
-  .placeholder\:text-muted-foreground\/50 {
+  .placeholder\:text-muted-foreground {
     &::placeholder {
       color: var(--color-muted-foreground);
-      @supports (color: color-mix(in lab, red, red)) {
-        color: color-mix(in oklab, var(--color-muted-foreground) 50%, transparent);
-      }
     }
   }
   .after\:absolute {
@@ -3579,6 +4220,34 @@
       translate: var(--tw-translate-x) var(--tw-translate-y);
     }
   }
+  .first\:bg-future-surface-hover {
+    &:first-child {
+      background-color: var(--color-future-surface-hover);
+    }
+  }
+  .first\:text-future-foreground {
+    &:first-child {
+      color: var(--color-future-foreground);
+    }
+  }
+  .last\:border-0 {
+    &:last-child {
+      border-style: var(--tw-border-style);
+      border-width: 0px;
+    }
+  }
+  .last\:border-b-0 {
+    &:last-child {
+      border-bottom-style: var(--tw-border-style);
+      border-bottom-width: 0px;
+    }
+  }
+  .even\:border-l {
+    &:nth-child(even) {
+      border-left-style: var(--tw-border-style);
+      border-left-width: 1px;
+    }
+  }
   .hover\:scale-105 {
     &:hover {
       @media (hover: hover) {
@@ -3606,23 +4275,24 @@
       }
     }
   }
-  .hover\:border-border\/60 {
+  .hover\:border-future-accent {
     &:hover {
       @media (hover: hover) {
-        border-color: var(--color-border);
-        @supports (color: color-mix(in lab, red, red)) {
-          border-color: color-mix(in oklab, var(--color-border) 60%, transparent);
-        }
+        border-color: var(--color-future-accent);
       }
     }
   }
-  .hover\:border-border\/70 {
+  .hover\:border-future-border {
     &:hover {
       @media (hover: hover) {
-        border-color: var(--color-border);
-        @supports (color: color-mix(in lab, red, red)) {
-          border-color: color-mix(in oklab, var(--color-border) 70%, transparent);
-        }
+        border-color: var(--color-future-border);
+      }
+    }
+  }
+  .hover\:border-future-border-hover {
+    &:hover {
+      @media (hover: hover) {
+        border-color: var(--color-future-border-hover);
       }
     }
   }
@@ -3643,6 +4313,16 @@
       }
     }
   }
+  .hover\:border-red-500\/50 {
+    &:hover {
+      @media (hover: hover) {
+        border-color: color-mix(in srgb, oklch(63.7% 0.237 25.331) 50%, transparent);
+        @supports (color: color-mix(in lab, red, red)) {
+          border-color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
+        }
+      }
+    }
+  }
   .hover\:bg-accent {
     &:hover {
       @media (hover: hover) {
@@ -3667,6 +4347,13 @@
       }
     }
   }
+  .hover\:bg-blue-100 {
+    &:hover {
+      @media (hover: hover) {
+        background-color: var(--color-blue-100);
+      }
+    }
+  }
   .hover\:bg-blue-600 {
     &:hover {
       @media (hover: hover) {
@@ -3694,6 +4381,57 @@
       }
     }
   }
+  .hover\:bg-future-accent\/10 {
+    &:hover {
+      @media (hover: hover) {
+        background-color: var(--color-future-accent);
+        @supports (color: color-mix(in lab, red, red)) {
+          background-color: color-mix(in oklab, var(--color-future-accent) 10%, transparent);
+        }
+      }
+    }
+  }
+  .hover\:bg-future-accent\/20 {
+    &:hover {
+      @media (hover: hover) {
+        background-color: var(--color-future-accent);
+        @supports (color: color-mix(in lab, red, red)) {
+          background-color: color-mix(in oklab, var(--color-future-accent) 20%, transparent);
+        }
+      }
+    }
+  }
+  .hover\:bg-future-accent\/90 {
+    &:hover {
+      @media (hover: hover) {
+        background-color: var(--color-future-accent);
+        @supports (color: color-mix(in lab, red, red)) {
+          background-color: color-mix(in oklab, var(--color-future-accent) 90%, transparent);
+        }
+      }
+    }
+  }
+  .hover\:bg-future-surface {
+    &:hover {
+      @media (hover: hover) {
+        background-color: var(--color-future-surface);
+      }
+    }
+  }
+  .hover\:bg-future-surface-hover {
+    &:hover {
+      @media (hover: hover) {
+        background-color: var(--color-future-surface-hover);
+      }
+    }
+  }
+  .hover\:bg-future-surface-overlay {
+    &:hover {
+      @media (hover: hover) {
+        background-color: var(--color-future-surface-overlay);
+      }
+    }
+  }
   .hover\:bg-gray-800 {
     &:hover {
       @media (hover: hover) {
@@ -3701,6 +4439,27 @@
       }
     }
   }
+  .hover\:bg-green-50 {
+    &:hover {
+      @media (hover: hover) {
+        background-color: var(--color-green-50);
+      }
+    }
+  }
+  .hover\:bg-legacy-accent-hover {
+    &:hover {
+      @media (hover: hover) {
+        background-color: var(--color-legacy-accent-hover);
+      }
+    }
+  }
+  .hover\:bg-legacy-surface-hover {
+    &:hover {
+      @media (hover: hover) {
+        background-color: var(--color-legacy-surface-hover);
+      }
+    }
+  }
   .hover\:bg-muted {
     &:hover {
       @media (hover: hover) {
@@ -3708,6 +4467,16 @@
       }
     }
   }
+  .hover\:bg-muted-foreground\/20 {
+    &:hover {
+      @media (hover: hover) {
+        background-color: var(--color-muted-foreground);
+        @supports (color: color-mix(in lab, red, red)) {
+          background-color: color-mix(in oklab, var(--color-muted-foreground) 20%, transparent);
+        }
+      }
+    }
+  }
   .hover\:bg-muted\/50 {
     &:hover {
       @media (hover: hover) {
@@ -3755,6 +4524,13 @@
       }
     }
   }
+  .hover\:bg-red-50 {
+    &:hover {
+      @media (hover: hover) {
+        background-color: var(--color-red-50);
+      }
+    }
+  }
   .hover\:bg-red-500 {
     &:hover {
       @media (hover: hover) {
@@ -3800,6 +4576,34 @@
       }
     }
   }
+  .hover\:text-future-foreground {
+    &:hover {
+      @media (hover: hover) {
+        color: var(--color-future-foreground);
+      }
+    }
+  }
+  .hover\:text-future-foreground-hover {
+    &:hover {
+      @media (hover: hover) {
+        color: var(--color-future-foreground-hover);
+      }
+    }
+  }
+  .hover\:text-future-foreground-muted {
+    &:hover {
+      @media (hover: hover) {
+        color: var(--color-future-foreground-muted);
+      }
+    }
+  }
+  .hover\:text-green-700 {
+    &:hover {
+      @media (hover: hover) {
+        color: var(--color-green-700);
+      }
+    }
+  }
   .hover\:text-muted-foreground {
     &:hover {
       @media (hover: hover) {
@@ -3817,6 +4621,20 @@
       }
     }
   }
+  .hover\:text-red-400 {
+    &:hover {
+      @media (hover: hover) {
+        color: var(--color-red-400);
+      }
+    }
+  }
+  .hover\:text-red-700 {
+    &:hover {
+      @media (hover: hover) {
+        color: var(--color-red-700);
+      }
+    }
+  }
   .hover\:no-underline {
     &:hover {
       @media (hover: hover) {
@@ -3831,25 +4649,31 @@
       }
     }
   }
-  .hover\:opacity-100 {
+  .hover\:opacity-80 {
     &:hover {
       @media (hover: hover) {
-        opacity: 100%;
+        opacity: 80%;
       }
     }
   }
-  .hover\:shadow-md {
+  .hover\:opacity-90 {
     &:hover {
       @media (hover: hover) {
-        --tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
-        box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
+        opacity: 90%;
       }
     }
   }
-  .hover\:shadow-sm {
+  .hover\:opacity-100 {
+    &:hover {
+      @media (hover: hover) {
+        opacity: 100%;
+      }
+    }
+  }
+  .hover\:shadow-md {
     &:hover {
       @media (hover: hover) {
-        --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
+        --tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
         box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
       }
     }
@@ -3867,14 +4691,34 @@
       background-color: var(--color-accent);
     }
   }
+  .focus\:bg-future-surface-hover {
+    &:focus {
+      background-color: var(--color-future-surface-hover);
+    }
+  }
   .focus\:text-accent-foreground {
     &:focus {
       color: var(--color-accent-foreground);
     }
   }
-  .focus\:shadow-md {
+  .focus\:text-destructive {
+    &:focus {
+      color: var(--color-destructive);
+    }
+  }
+  .focus\:text-future-foreground {
     &:focus {
-      --tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
+      color: var(--color-future-foreground);
+    }
+  }
+  .focus\:text-red-300 {
+    &:focus {
+      color: var(--color-red-300);
+    }
+  }
+  .focus\:ring-1 {
+    &:focus {
+      --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
       box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
     }
   }
@@ -3884,6 +4728,11 @@
       box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
     }
   }
+  .focus\:ring-future-ring {
+    &:focus {
+      --tw-ring-color: var(--color-future-ring);
+    }
+  }
   .focus\:ring-ring {
     &:focus {
       --tw-ring-color: var(--color-ring);
@@ -3976,6 +4825,11 @@
       scale: var(--tw-scale-x) var(--tw-scale-y);
     }
   }
+  .active\:cursor-grabbing {
+    &:active {
+      cursor: grabbing;
+    }
+  }
   .disabled\:pointer-events-none {
     &:disabled {
       pointer-events: none;
@@ -3986,6 +4840,11 @@
       cursor: not-allowed;
     }
   }
+  .disabled\:opacity-30 {
+    &:disabled {
+      opacity: 30%;
+    }
+  }
   .disabled\:opacity-50 {
     &:disabled {
       opacity: 50%;
@@ -4020,6 +4879,11 @@
       color: var(--color-muted-foreground);
     }
   }
+  .data-\[active\=true\]\:bg-future-surface-overlay {
+    &[data-active="true"] {
+      background-color: var(--color-future-surface-overlay);
+    }
+  }
   .data-\[disabled\]\:pointer-events-none {
     &[data-disabled] {
       pointer-events: none;
@@ -4206,9 +5070,9 @@
       translate: var(--tw-translate-x) var(--tw-translate-y);
     }
   }
-  .data-\[state\=active\]\:border-primary {
+  .data-\[state\=active\]\:border-b-primary {
     &[data-state="active"] {
-      border-color: var(--color-primary);
+      border-bottom-color: var(--color-primary);
     }
   }
   .data-\[state\=active\]\:bg-background {
@@ -4216,11 +5080,6 @@
       background-color: var(--color-background);
     }
   }
-  .data-\[state\=active\]\:bg-transparent {
-    &[data-state="active"] {
-      background-color: transparent;
-    }
-  }
   .data-\[state\=active\]\:text-foreground {
     &[data-state="active"] {
       color: var(--color-foreground);
@@ -4290,14 +5149,6 @@
       background-color: var(--color-accent);
     }
   }
-  .data-\[state\=open\]\:bg-accent\/50 {
-    &[data-state="open"] {
-      background-color: var(--color-accent);
-      @supports (color: color-mix(in lab, red, red)) {
-        background-color: color-mix(in oklab, var(--color-accent) 50%, transparent);
-      }
-    }
-  }
   .data-\[state\=open\]\:bg-secondary {
     &[data-state="open"] {
       background-color: var(--color-secondary);
@@ -4313,26 +5164,16 @@
       color: var(--color-muted-foreground);
     }
   }
-  .data-\[state\=open\]\:duration-500 {
-    &[data-state="open"] {
-      --tw-duration: 500ms;
-      transition-duration: 500ms;
-    }
-  }
-  .data-\[state\=open\]\:hover\:bg-accent {
+  .data-\[state\=open\]\:duration-300 {
     &[data-state="open"] {
-      &:hover {
-        @media (hover: hover) {
-          background-color: var(--color-accent);
-        }
-      }
+      --tw-duration: 300ms;
+      transition-duration: 300ms;
     }
   }
-  .data-\[state\=open\]\:focus\:bg-accent {
+  .data-\[state\=open\]\:duration-500 {
     &[data-state="open"] {
-      &:focus {
-        background-color: var(--color-accent);
-      }
+      --tw-duration: 500ms;
+      transition-duration: 500ms;
     }
   }
   .data-\[state\=selected\]\:bg-muted {
@@ -4366,6 +5207,11 @@
       max-width: var(--container-lg);
     }
   }
+  .sm\:max-w-md {
+    @media (width >= 40rem) {
+      max-width: var(--container-md);
+    }
+  }
   .sm\:max-w-sm {
     @media (width >= 40rem) {
       max-width: var(--container-sm);
@@ -4376,6 +5222,11 @@
       grid-template-columns: repeat(2, minmax(0, 1fr));
     }
   }
+  .sm\:grid-cols-3 {
+    @media (width >= 40rem) {
+      grid-template-columns: repeat(3, minmax(0, 1fr));
+    }
+  }
   .sm\:grid-cols-6 {
     @media (width >= 40rem) {
       grid-template-columns: repeat(6, minmax(0, 1fr));
@@ -4386,11 +5237,6 @@
       flex-direction: row;
     }
   }
-  .sm\:items-center {
-    @media (width >= 40rem) {
-      align-items: center;
-    }
-  }
   .sm\:justify-end {
     @media (width >= 40rem) {
       justify-content: flex-end;
@@ -4415,74 +5261,37 @@
       border-radius: var(--radius-lg);
     }
   }
-  .sm\:text-left {
+  .sm\:border-t-0 {
     @media (width >= 40rem) {
-      text-align: left;
-    }
-  }
-  .md\:absolute {
-    @media (width >= 48rem) {
-      position: absolute;
-    }
-  }
-  .md\:block {
-    @media (width >= 48rem) {
-      display: block;
-    }
-  }
-  .md\:flex {
-    @media (width >= 48rem) {
-      display: flex;
-    }
-  }
-  .md\:hidden {
-    @media (width >= 48rem) {
-      display: none;
-    }
-  }
-  .md\:inline {
-    @media (width >= 48rem) {
-      display: inline;
-    }
-  }
-  .md\:h-4 {
-    @media (width >= 48rem) {
-      height: calc(var(--spacing) * 4);
-    }
-  }
-  .md\:h-8 {
-    @media (width >= 48rem) {
-      height: calc(var(--spacing) * 8);
+      border-top-style: var(--tw-border-style);
+      border-top-width: 0px;
     }
   }
-  .md\:w-4 {
-    @media (width >= 48rem) {
-      width: calc(var(--spacing) * 4);
-    }
-  }
-  .md\:w-8 {
-    @media (width >= 48rem) {
-      width: calc(var(--spacing) * 8);
+  .sm\:border-l {
+    @media (width >= 40rem) {
+      border-left-style: var(--tw-border-style);
+      border-left-width: 1px;
     }
   }
-  .md\:w-\[400px\] {
-    @media (width >= 48rem) {
-      width: 400px;
+  .sm\:px-8 {
+    @media (width >= 40rem) {
+      padding-inline: calc(var(--spacing) * 8);
     }
   }
-  .md\:w-\[500px\] {
-    @media (width >= 48rem) {
-      width: 500px;
+  .sm\:py-6 {
+    @media (width >= 40rem) {
+      padding-block: calc(var(--spacing) * 6);
     }
   }
-  .md\:w-\[var\(--radix-navigation-menu-viewport-width\)\] {
-    @media (width >= 48rem) {
-      width: var(--radix-navigation-menu-viewport-width);
+  .sm\:text-left {
+    @media (width >= 40rem) {
+      text-align: left;
     }
   }
-  .md\:w-auto {
-    @media (width >= 48rem) {
-      width: auto;
+  .sm\:text-3xl {
+    @media (width >= 40rem) {
+      font-size: var(--text-3xl);
+      line-height: var(--tw-leading, var(--text-3xl--line-height));
     }
   }
   .md\:grid-cols-2 {
@@ -4515,77 +5324,15 @@
       flex-direction: row;
     }
   }
-  .md\:p-4 {
-    @media (width >= 48rem) {
-      padding: calc(var(--spacing) * 4);
-    }
-  }
-  .md\:p-6 {
-    @media (width >= 48rem) {
-      padding: calc(var(--spacing) * 6);
-    }
-  }
-  .md\:px-6 {
-    @media (width >= 48rem) {
-      padding-inline: calc(var(--spacing) * 6);
-    }
-  }
-  .md\:px-16 {
-    @media (width >= 48rem) {
-      padding-inline: calc(var(--spacing) * 16);
-    }
-  }
-  .md\:py-3 {
-    @media (width >= 48rem) {
-      padding-block: calc(var(--spacing) * 3);
-    }
-  }
-  .md\:py-20 {
-    @media (width >= 48rem) {
-      padding-block: calc(var(--spacing) * 20);
-    }
-  }
-  .md\:text-4xl {
-    @media (width >= 48rem) {
-      font-size: var(--text-4xl);
-      line-height: var(--tw-leading, var(--text-4xl--line-height));
-    }
-  }
-  .md\:text-lg {
-    @media (width >= 48rem) {
-      font-size: var(--text-lg);
-      line-height: var(--tw-leading, var(--text-lg--line-height));
-    }
-  }
   .md\:text-sm {
     @media (width >= 48rem) {
       font-size: var(--text-sm);
       line-height: var(--tw-leading, var(--text-sm--line-height));
     }
   }
-  .lg\:col-span-3 {
-    @media (width >= 64rem) {
-      grid-column: span 3 / span 3;
-    }
-  }
-  .lg\:col-span-4 {
-    @media (width >= 64rem) {
-      grid-column: span 4 / span 4;
-    }
-  }
-  .lg\:block {
-    @media (width >= 64rem) {
-      display: block;
-    }
-  }
-  .lg\:w-\[500px\] {
-    @media (width >= 64rem) {
-      width: 500px;
-    }
-  }
-  .lg\:w-\[600px\] {
+  .lg\:grid-cols-2 {
     @media (width >= 64rem) {
-      width: 600px;
+      grid-template-columns: repeat(2, minmax(0, 1fr));
     }
   }
   .lg\:grid-cols-3 {
@@ -4603,21 +5350,11 @@
       grid-template-columns: repeat(6, minmax(0, 1fr));
     }
   }
-  .lg\:grid-cols-7 {
-    @media (width >= 64rem) {
-      grid-template-columns: repeat(7, minmax(0, 1fr));
-    }
-  }
   .lg\:grid-cols-12 {
     @media (width >= 64rem) {
       grid-template-columns: repeat(12, minmax(0, 1fr));
     }
   }
-  .lg\:grid-cols-\[\.75fr_1fr\] {
-    @media (width >= 64rem) {
-      grid-template-columns: .75fr 1fr;
-    }
-  }
   .lg\:grid-cols-\[2fr_3fr_3fr\] {
     @media (width >= 64rem) {
       grid-template-columns: 2fr 3fr 3fr;
@@ -4651,6 +5388,84 @@
       color: var(--color-red-400);
     }
   }
+  .\[\&_\.recharts-cartesian-axis-tick_text\]\:fill-muted-foreground {
+    & .recharts-cartesian-axis-tick text {
+      fill: var(--color-muted-foreground);
+    }
+  }
+  .\[\&_\.recharts-cartesian-grid_line\[stroke\=\\\'\#ccc\\\'\]\]\:stroke-border\/50 {
+    & .recharts-cartesian-grid line[stroke=\'#ccc\'] {
+      stroke: var(--color-border);
+      @supports (color: color-mix(in lab, red, red)) {
+        stroke: color-mix(in oklab, var(--color-border) 50%, transparent);
+      }
+    }
+  }
+  .\[\&_\.recharts-curve\.recharts-tooltip-cursor\]\:stroke-border {
+    & .recharts-curve.recharts-tooltip-cursor {
+      stroke: var(--color-border);
+    }
+  }
+  .\[\&_\.recharts-dot\[stroke\=\\\'\#fff\\\'\]\]\:stroke-transparent {
+    & .recharts-dot[stroke=\'#fff\'] {
+      stroke: transparent;
+    }
+  }
+  .\[\&_\.recharts-layer\]\:outline-hidden {
+    & .recharts-layer {
+      --tw-outline-style: none;
+      outline-style: none;
+      @media (forced-colors: active) {
+        outline: 2px solid transparent;
+        outline-offset: 2px;
+      }
+    }
+  }
+  .\[\&_\.recharts-polar-grid_\[stroke\=\\\'\#ccc\\\'\]\]\:stroke-border {
+    & .recharts-polar-grid [stroke=\'#ccc\'] {
+      stroke: var(--color-border);
+    }
+  }
+  .\[\&_\.recharts-radial-bar-background-sector\]\:fill-muted {
+    & .recharts-radial-bar-background-sector {
+      fill: var(--color-muted);
+    }
+  }
+  .\[\&_\.recharts-rectangle\.recharts-tooltip-cursor\]\:fill-muted {
+    & .recharts-rectangle.recharts-tooltip-cursor {
+      fill: var(--color-muted);
+    }
+  }
+  .\[\&_\.recharts-reference-line_\[stroke\=\\\'\#ccc\\\'\]\]\:stroke-border {
+    & .recharts-reference-line [stroke=\'#ccc\'] {
+      stroke: var(--color-border);
+    }
+  }
+  .\[\&_\.recharts-sector\]\:outline-hidden {
+    & .recharts-sector {
+      --tw-outline-style: none;
+      outline-style: none;
+      @media (forced-colors: active) {
+        outline: 2px solid transparent;
+        outline-offset: 2px;
+      }
+    }
+  }
+  .\[\&_\.recharts-sector\[stroke\=\\\'\#fff\\\'\]\]\:stroke-transparent {
+    & .recharts-sector[stroke=\'#fff\'] {
+      stroke: transparent;
+    }
+  }
+  .\[\&_\.recharts-surface\]\:outline-hidden {
+    & .recharts-surface {
+      --tw-outline-style: none;
+      outline-style: none;
+      @media (forced-colors: active) {
+        outline: 2px solid transparent;
+        outline-offset: 2px;
+      }
+    }
+  }
   .\[\&_\[cmdk-group-heading\]\]\:px-2 {
     & [cmdk-group-heading] {
       padding-inline: calc(var(--spacing) * 2);
@@ -4745,6 +5560,12 @@
       height: calc(var(--spacing) * 4);
     }
   }
+  .\[\&_svg\]\:size-5 {
+    & svg {
+      width: calc(var(--spacing) * 5);
+      height: calc(var(--spacing) * 5);
+    }
+  }
   .\[\&_svg\]\:shrink-0 {
     & svg {
       flex-shrink: 0;
@@ -4803,6 +5624,27 @@
       border-bottom-right-radius: var(--radius-md);
     }
   }
+  .\[\&\:not\(\:last-child\)\]\:border-b {
+    &:not(:last-child) {
+      border-bottom-style: var(--tw-border-style);
+      border-bottom-width: 1px;
+    }
+  }
+  .\[\&\>\*\]\:basis-1\/2 {
+    &>* {
+      flex-basis: calc(1/2 * 100%);
+    }
+  }
+  .\[\&\>\*\]\:basis-1\/4 {
+    &>* {
+      flex-basis: calc(1/4 * 100%);
+    }
+  }
+  .\[\&\>\*\]\:justify-center {
+    &>* {
+      justify-content: center;
+    }
+  }
   .\[\&\>button\]\:rounded-none {
     &>button {
       border-radius: 0;
@@ -4856,6 +5698,21 @@
       border-bottom-width: 1px;
     }
   }
+  .\[\&\>div\]\:bg-destructive {
+    &>div {
+      background-color: var(--color-destructive);
+    }
+  }
+  .\[\&\>div\]\:bg-future-accent {
+    &>div {
+      background-color: var(--color-future-accent);
+    }
+  }
+  .\[\&\>div\]\:bg-yellow-500 {
+    &>div {
+      background-color: var(--color-yellow-500);
+    }
+  }
   .\[\&\>span\]\:line-clamp-1 {
     &>span {
       overflow: hidden;
@@ -4901,11 +5758,31 @@
       height: calc(var(--spacing) * 3.5);
     }
   }
+  .\[\&\>svg\]\:h-2\.5 {
+    &>svg {
+      height: calc(var(--spacing) * 2.5);
+    }
+  }
+  .\[\&\>svg\]\:h-3 {
+    &>svg {
+      height: calc(var(--spacing) * 3);
+    }
+  }
   .\[\&\>svg\]\:h-3\.5 {
     &>svg {
       height: calc(var(--spacing) * 3.5);
     }
   }
+  .\[\&\>svg\]\:w-2\.5 {
+    &>svg {
+      width: calc(var(--spacing) * 2.5);
+    }
+  }
+  .\[\&\>svg\]\:w-3 {
+    &>svg {
+      width: calc(var(--spacing) * 3);
+    }
+  }
   .\[\&\>svg\]\:w-3\.5 {
     &>svg {
       width: calc(var(--spacing) * 3.5);
@@ -4921,6 +5798,11 @@
       color: var(--color-foreground);
     }
   }
+  .\[\&\>svg\]\:text-future-foreground-muted {
+    &>svg {
+      color: var(--color-future-foreground-muted);
+    }
+  }
   .\[\&\>svg\]\:text-muted-foreground {
     &>svg {
       color: var(--color-muted-foreground);
@@ -6429,6 +7311,9 @@ body.dark-hc {
   --border: var(--border-dark-hc);
   color-scheme: dark;
 }
+:root {
+  --radius: 0.75rem;
+}
 body.light, body.dark, body.light-hc, body.dark-hc {
   --color-card: var(--color-background-raised);
   --color-card-foreground: var(--color-foreground);
@@ -6468,6 +7353,420 @@ body.light, body.dark, body.light-hc, body.dark-hc {
     color: var(--color-foreground);
   }
 }
+.future-dark {
+  --color-future-surface: #09090b;
+  --color-future-surface-raised: #18181b;
+  --color-future-surface-overlay: #27272a;
+  --color-future-surface-hover: #3f3f46;
+  --color-future-surface-muted: #71717a;
+  --color-future-surface-inverse: #fafafa;
+  --color-future-accent: #0891b2;
+  --color-future-accent-subtle: #083344;
+  --color-future-foreground: #fafafa;
+  --color-future-foreground-secondary: #f4f4f5;
+  --color-future-foreground-hover: #d4d4d8;
+  --color-future-foreground-muted: #a1a1aa;
+  --color-future-foreground-subtle: #71717a;
+  --color-future-foreground-inverse: #09090b;
+  --color-future-foreground-on-accent: #fafafa;
+  --color-future-foreground-accent: #0891b2;
+  --color-future-foreground-accent-muted: #22d3ee;
+  --color-future-border: #3f3f46;
+  --color-future-border-subtle: #27272a;
+  --color-future-border-muted: #18181b;
+  --color-future-border-deep: #09090b;
+  --color-future-border-inverse: #e4e4e7;
+  --color-future-border-hover: #52525b;
+  --color-future-ring: #52525b;
+  --gradient-future-1: linear-gradient(127deg, #3f3f47 25.94%, #27272a 74.06%);
+  --gradient-future-2: linear-gradient(128deg, #09090b 1.26%, #18181b 52.69%);
+  --gradient-future-3: linear-gradient(128deg, #3f3f47 1.26%, #18181b 52.69%);
+  --gradient-future-4: linear-gradient(180deg, #18181b 0%, #27272a 100%);
+  --gradient-future-5: linear-gradient(180deg, #09090b 0%, #18181b 100%);
+  --gradient-future-6: linear-gradient(106deg, #0092b8 28.08%, #053345 71.92%);
+  --color-background: var(--color-future-surface);
+  --color-foreground: var(--color-future-foreground);
+  --color-card: var(--color-future-surface-raised);
+  --color-card-foreground: var(--color-future-foreground);
+  --color-popover: var(--color-future-surface-raised);
+  --color-popover-foreground: var(--color-future-foreground);
+  --color-primary: var(--color-future-accent);
+  --color-primary-foreground: var(--color-future-foreground-on-accent);
+  --color-secondary: var(--color-future-surface-overlay);
+  --color-secondary-foreground: var(--color-future-foreground);
+  --color-muted: var(--color-future-surface-overlay);
+  --color-muted-foreground: var(--color-future-foreground-muted);
+  --color-accent: var(--color-future-surface-hover);
+  --color-accent-foreground: var(--color-future-foreground);
+  --color-destructive: #ef4444;
+  --color-destructive-foreground: #fafafa;
+  --color-border: var(--color-future-border);
+  --color-border-de-emp: var(--color-future-border-subtle);
+  --color-input: var(--color-future-border);
+  --color-ring: var(--color-future-ring);
+}
+.future-light {
+  --color-future-surface: #fafafa;
+  --color-future-surface-raised: #f4f4f5;
+  --color-future-surface-overlay: #e4e4e7;
+  --color-future-surface-hover: #d4d4d8;
+  --color-future-surface-muted: #a1a1aa;
+  --color-future-surface-inverse: #09090b;
+  --color-future-accent: #0891b2;
+  --color-future-accent-subtle: #ecfeff;
+  --color-future-foreground: #09090b;
+  --color-future-foreground-secondary: #18181b;
+  --color-future-foreground-hover: #52525b;
+  --color-future-foreground-muted: #71717a;
+  --color-future-foreground-subtle: #a1a1aa;
+  --color-future-foreground-inverse: #fafafa;
+  --color-future-foreground-on-accent: #fafafa;
+  --color-future-foreground-accent: #0891b2;
+  --color-future-foreground-accent-muted: #0891b2;
+  --color-future-border: #d4d4d8;
+  --color-future-border-subtle: #e4e4e7;
+  --color-future-border-muted: #f4f4f5;
+  --color-future-border-deep: #fafafa;
+  --color-future-border-inverse: #3f3f46;
+  --color-future-border-hover: #a1a1aa;
+  --color-future-ring: #a1a1aa;
+  --gradient-future-1: linear-gradient(127deg, #e4e4e7 25.94%, #f4f4f5 74.06%);
+  --gradient-future-2: linear-gradient(128deg, #fafafa 1.26%, #fafafa 52.69%);
+  --gradient-future-3: linear-gradient(128deg, #e4e4e7 1.26%, #fafafa 52.69%);
+  --gradient-future-4: linear-gradient(180deg, #fafafa 0%, #f4f4f5 100%);
+  --gradient-future-5: linear-gradient(180deg, #fafafa 0%, #fafafa 100%);
+  --gradient-future-6: linear-gradient(106deg, #22d3ee 28.08%, #cffafe 71.92%);
+  --color-background: var(--color-future-surface);
+  --color-foreground: var(--color-future-foreground);
+  --color-card: var(--color-future-surface-raised);
+  --color-card-foreground: var(--color-future-foreground);
+  --color-popover: var(--color-future-surface-raised);
+  --color-popover-foreground: var(--color-future-foreground);
+  --color-primary: var(--color-future-accent);
+  --color-primary-foreground: var(--color-future-foreground-on-accent);
+  --color-secondary: var(--color-future-surface-overlay);
+  --color-secondary-foreground: var(--color-future-foreground);
+  --color-muted: var(--color-future-surface-overlay);
+  --color-muted-foreground: var(--color-future-foreground-muted);
+  --color-accent: var(--color-future-surface-hover);
+  --color-accent-foreground: var(--color-future-foreground);
+  --color-destructive: #ef4444;
+  --color-destructive-foreground: #fafafa;
+  --color-border: var(--color-future-border);
+  --color-border-de-emp: var(--color-future-border-subtle);
+  --color-input: var(--color-future-border);
+  --color-ring: var(--color-future-ring);
+}
+.future-wireframe {
+  --color-future-surface: #ffffff;
+  --color-future-surface-raised: #f9fafb;
+  --color-future-surface-overlay: #f3f4f6;
+  --color-future-surface-hover: #e5e7eb;
+  --color-future-surface-muted: #d1d5db;
+  --color-future-surface-inverse: #374151;
+  --color-future-accent: #6b7280;
+  --color-future-accent-subtle: #f3f4f6;
+  --color-future-foreground: #1f2937;
+  --color-future-foreground-secondary: #374151;
+  --color-future-foreground-hover: #4b5563;
+  --color-future-foreground-muted: #6b7280;
+  --color-future-foreground-subtle: #9ca3af;
+  --color-future-foreground-inverse: #ffffff;
+  --color-future-foreground-on-accent: #ffffff;
+  --color-future-foreground-accent: #4b5563;
+  --color-future-foreground-accent-muted: #6b7280;
+  --color-future-border: #d1d5db;
+  --color-future-border-subtle: #e5e7eb;
+  --color-future-border-muted: #f3f4f6;
+  --color-future-border-deep: #f9fafb;
+  --color-future-border-inverse: #4b5563;
+  --color-future-border-hover: #9ca3af;
+  --color-future-ring: #9ca3af;
+  --gradient-future-1: none;
+  --gradient-future-2: none;
+  --gradient-future-3: none;
+  --gradient-future-4: none;
+  --gradient-future-5: none;
+  --gradient-future-6: none;
+  --color-background: var(--color-future-surface);
+  --color-foreground: var(--color-future-foreground);
+  --color-card: var(--color-future-surface-raised);
+  --color-card-foreground: var(--color-future-foreground);
+  --color-popover: var(--color-future-surface-raised);
+  --color-popover-foreground: var(--color-future-foreground);
+  --color-primary: var(--color-future-accent);
+  --color-primary-foreground: var(--color-future-foreground-on-accent);
+  --color-secondary: var(--color-future-surface-overlay);
+  --color-secondary-foreground: var(--color-future-foreground);
+  --color-muted: var(--color-future-surface-overlay);
+  --color-muted-foreground: var(--color-future-foreground-muted);
+  --color-accent: var(--color-future-surface-hover);
+  --color-accent-foreground: var(--color-future-foreground);
+  --color-destructive: #9ca3af;
+  --color-destructive-foreground: #ffffff;
+  --color-border: var(--color-future-border);
+  --color-border-de-emp: var(--color-future-border-subtle);
+  --color-input: var(--color-future-border);
+  --color-ring: var(--color-future-ring);
+}
+.future-wireframe *, .future-wireframe *::before, .future-wireframe *::after {
+  border-style: dashed !important;
+  box-shadow: none !important;
+}
+.future-vertex {
+  --color-future-surface: oklch(0.21 0.03 258.5);
+  --color-future-surface-raised: oklch(0.233 0.036 254.7);
+  --color-future-surface-overlay: oklch(0.2648 0.0329 254.38);
+  --color-future-surface-hover: oklch(0.3927 0.0289 240.86);
+  --color-future-surface-muted: oklch(0.72 0.03 254.38);
+  --color-future-surface-inverse: oklch(0.985 0 0);
+  --color-future-accent: oklch(0.692 0.1119 207.06);
+  --color-future-accent-subtle: oklch(0.166 0.0283 203.34);
+  --color-future-foreground: oklch(0.985 0 0);
+  --color-future-foreground-secondary: oklch(0.9525 0.011 225.98);
+  --color-future-foreground-hover: oklch(0.9416 0.0145 244.72);
+  --color-future-foreground-muted: oklch(0.72 0.03 254.38);
+  --color-future-foreground-subtle: oklch(0.4594 0.028 264.25);
+  --color-future-foreground-inverse: oklch(0.21 0.03 258.5);
+  --color-future-foreground-on-accent: oklch(0.166 0.0283 203.34);
+  --color-future-foreground-accent: oklch(0.692 0.1119 207.06);
+  --color-future-foreground-accent-muted: oklch(0.573 0.114 211.4);
+  --color-future-border: oklch(0.3068 0.0426 258.29);
+  --color-future-border-subtle: oklch(0.2648 0.0329 254.38);
+  --color-future-border-muted: oklch(0.233 0.036 254.7);
+  --color-future-border-deep: oklch(0.21 0.03 258.5);
+  --color-future-border-inverse: oklch(0.9229 0.0065 252.13);
+  --color-future-border-hover: oklch(0.3927 0.0289 240.86);
+  --color-future-ring: oklch(0.692 0.1119 207.06);
+  --gradient-future-1: linear-gradient(127deg, oklch(0.3927 0.0289 240.86) 25.94%, oklch(0.2648 0.0329 254.38) 74.06%);
+  --gradient-future-2: linear-gradient(128deg, oklch(0.21 0.03 258.5) 1.26%, oklch(0.233 0.036 254.7) 52.69%);
+  --gradient-future-3: linear-gradient(128deg, oklch(0.3927 0.0289 240.86) 1.26%, oklch(0.233 0.036 254.7) 52.69%);
+  --gradient-future-4: linear-gradient(180deg, oklch(0.233 0.036 254.7) 0%, oklch(0.2648 0.0329 254.38) 100%);
+  --gradient-future-5: linear-gradient(180deg, oklch(0.21 0.03 258.5) 0%, oklch(0.233 0.036 254.7) 100%);
+  --gradient-future-6: linear-gradient(106deg, oklch(0.692 0.1119 207.06) 28.08%, oklch(0.166 0.0283 203.34) 71.92%);
+  --color-background: var(--color-future-surface);
+  --color-foreground: var(--color-future-foreground);
+  --color-card: var(--color-future-surface-raised);
+  --color-card-foreground: var(--color-future-foreground);
+  --color-popover: var(--color-future-surface-raised);
+  --color-popover-foreground: var(--color-future-foreground);
+  --color-primary: var(--color-future-accent);
+  --color-primary-foreground: var(--color-future-foreground-on-accent);
+  --color-secondary: var(--color-future-surface-overlay);
+  --color-secondary-foreground: var(--color-future-foreground);
+  --color-muted: var(--color-future-surface-overlay);
+  --color-muted-foreground: var(--color-future-foreground-muted);
+  --color-accent: var(--color-future-surface-hover);
+  --color-accent-foreground: var(--color-future-foreground);
+  --color-destructive: oklch(0.6542 0.2321 28.66);
+  --color-destructive-foreground: oklch(1 0 89.88);
+  --color-border: var(--color-future-border);
+  --color-border-de-emp: var(--color-future-border-subtle);
+  --color-input: var(--color-future-border);
+  --color-ring: var(--color-future-ring);
+}
+.future-canvas {
+  --color-future-surface: #182027;
+  --color-future-surface-raised: #273139;
+  --color-future-surface-overlay: #334049;
+  --color-future-surface-hover: #3e4e58;
+  --color-future-surface-muted: #8a97a0;
+  --color-future-surface-inverse: #f8f9fa;
+  --color-future-accent: #fa4616;
+  --color-future-accent-subtle: #3c2a1e;
+  --color-future-foreground: #f8f9fa;
+  --color-future-foreground-secondary: #f4f5f7;
+  --color-future-foreground-hover: #cfd8dd;
+  --color-future-foreground-muted: #a4b1b8;
+  --color-future-foreground-subtle: #8a97a0;
+  --color-future-foreground-inverse: #182027;
+  --color-future-foreground-on-accent: #ffffff;
+  --color-future-foreground-accent: #fa4616;
+  --color-future-foreground-accent-muted: #ff8f70;
+  --color-future-border: #526069;
+  --color-future-border-subtle: #3e4e58;
+  --color-future-border-muted: #273139;
+  --color-future-border-deep: #182027;
+  --color-future-border-inverse: #cfd8dd;
+  --color-future-border-hover: #8a97a0;
+  --color-future-ring: #fa4616;
+  --gradient-future-1: linear-gradient(127deg, #3e4e58 25.94%, #334049 74.06%);
+  --gradient-future-2: linear-gradient(128deg, #182027 1.26%, #273139 52.69%);
+  --gradient-future-3: linear-gradient(128deg, #3e4e58 1.26%, #273139 52.69%);
+  --gradient-future-4: linear-gradient(180deg, #273139 0%, #334049 100%);
+  --gradient-future-5: linear-gradient(180deg, #182027 0%, #273139 100%);
+  --gradient-future-6: linear-gradient(106deg, #fa4616 28.08%, #3c2a1e 71.92%);
+  --color-background: var(--color-future-surface);
+  --color-foreground: var(--color-future-foreground);
+  --color-card: var(--color-future-surface-raised);
+  --color-card-foreground: var(--color-future-foreground);
+  --color-popover: var(--color-future-surface-raised);
+  --color-popover-foreground: var(--color-future-foreground);
+  --color-primary: var(--color-future-accent);
+  --color-primary-foreground: var(--color-future-foreground-on-accent);
+  --color-secondary: var(--color-future-surface-overlay);
+  --color-secondary-foreground: var(--color-future-foreground);
+  --color-muted: var(--color-future-surface-overlay);
+  --color-muted-foreground: var(--color-future-foreground-muted);
+  --color-accent: var(--color-future-surface-hover);
+  --color-accent-foreground: var(--color-future-foreground);
+  --color-destructive: #ef4444;
+  --color-destructive-foreground: #ffffff;
+  --color-border: var(--color-future-border);
+  --color-border-de-emp: var(--color-future-border-subtle);
+  --color-input: var(--color-future-border);
+  --color-ring: var(--color-future-ring);
+}
+.legacy-dark {
+  --color-legacy-surface: #182027;
+  --color-legacy-surface-raised: #273139;
+  --color-legacy-surface-overlay: #374652;
+  --color-legacy-surface-hover: #526069;
+  --color-legacy-surface-muted: #8a97a0;
+  --color-legacy-surface-inverse: #f8f9fa;
+  --color-legacy-surface-disabled: #273139;
+  --color-legacy-surface-selected: #374652;
+  --color-legacy-accent: #66adff;
+  --color-legacy-accent-hover: #87bfff;
+  --color-legacy-accent-lighter: #00489d;
+  --color-legacy-accent-darker: #badaff;
+  --color-legacy-foreground: #f4f5f7;
+  --color-legacy-foreground-emp: #f8f9fa;
+  --color-legacy-foreground-muted: #cfd8dd;
+  --color-legacy-foreground-subtle: #a4b1b8;
+  --color-legacy-foreground-inverse: #182027;
+  --color-legacy-foreground-link: #66adff;
+  --color-legacy-foreground-on-accent: #182027;
+  --color-legacy-border: #8a97a0;
+  --color-legacy-border-subtle: #526069;
+  --color-legacy-border-disabled: #526069;
+  --color-legacy-border-grid: #273139;
+  --color-legacy-error: #ff8484;
+  --color-legacy-success: #74c94b;
+  --color-legacy-warning: #ffbb27;
+  --color-legacy-info: #42a1ff;
+  --color-legacy-ring: #66adff;
+  --color-legacy-logo: #ffffff;
+  --color-future-surface: var(--color-legacy-surface);
+  --color-future-surface-raised: var(--color-legacy-surface-raised);
+  --color-future-surface-overlay: var(--color-legacy-surface-overlay);
+  --color-future-surface-hover: var(--color-legacy-surface-hover);
+  --color-future-surface-muted: var(--color-legacy-surface-muted);
+  --color-future-surface-inverse: var(--color-legacy-surface-inverse);
+  --color-future-accent: var(--color-legacy-accent);
+  --color-future-accent-subtle: var(--color-legacy-accent-lighter);
+  --color-future-foreground: var(--color-legacy-foreground);
+  --color-future-foreground-secondary: var(--color-legacy-foreground-emp);
+  --color-future-foreground-hover: var(--color-legacy-foreground-muted);
+  --color-future-foreground-muted: var(--color-legacy-foreground-muted);
+  --color-future-foreground-subtle: var(--color-legacy-foreground-subtle);
+  --color-future-foreground-inverse: var(--color-legacy-foreground-inverse);
+  --color-future-foreground-on-accent: var(--color-legacy-foreground-on-accent);
+  --color-future-accent-foreground: var(--color-legacy-accent);
+  --color-future-accent-foreground-muted: var(--color-legacy-accent-hover);
+  --color-future-border: var(--color-legacy-border);
+  --color-future-border-subtle: var(--color-legacy-border-subtle);
+  --color-future-border-muted: var(--color-legacy-border-grid);
+  --color-future-border-deep: var(--color-legacy-border-grid);
+  --color-future-border-inverse: var(--color-legacy-border);
+  --color-future-border-hover: var(--color-legacy-border);
+  --color-future-ring: var(--color-legacy-ring);
+  --color-background: var(--color-legacy-surface);
+  --color-foreground: var(--color-legacy-foreground);
+  --color-card: var(--color-legacy-surface-raised);
+  --color-card-foreground: var(--color-legacy-foreground);
+  --color-popover: var(--color-legacy-surface-raised);
+  --color-popover-foreground: var(--color-legacy-foreground);
+  --color-primary: var(--color-legacy-accent);
+  --color-primary-foreground: var(--color-legacy-foreground-on-accent);
+  --color-secondary: var(--color-legacy-surface-overlay);
+  --color-secondary-foreground: var(--color-legacy-foreground-muted);
+  --color-muted: var(--color-legacy-surface-raised);
+  --color-muted-foreground: var(--color-legacy-foreground-muted);
+  --color-accent: var(--color-legacy-surface-selected);
+  --color-accent-foreground: var(--color-legacy-foreground-emp);
+  --color-destructive: var(--color-legacy-error);
+  --color-border: var(--color-legacy-border-subtle);
+  --color-border-de-emp: var(--color-legacy-border-subtle);
+  --color-input: var(--color-legacy-border-subtle);
+  --color-ring: var(--color-legacy-ring);
+  color-scheme: dark;
+}
+.legacy-light {
+  --color-legacy-surface: #ffffff;
+  --color-legacy-surface-raised: #ffffff;
+  --color-legacy-surface-overlay: #f4f5f7;
+  --color-legacy-surface-hover: #e9f1fa;
+  --color-legacy-surface-muted: #cfd8dd;
+  --color-legacy-surface-inverse: #182027;
+  --color-legacy-surface-disabled: #ecedee;
+  --color-legacy-surface-selected: #e9f1fa;
+  --color-legacy-accent: #0067df;
+  --color-legacy-accent-hover: #0056ba;
+  --color-legacy-accent-lighter: #badaff;
+  --color-legacy-accent-darker: #00489d;
+  --color-legacy-foreground: #273139;
+  --color-legacy-foreground-emp: #182027;
+  --color-legacy-foreground-muted: #526069;
+  --color-legacy-foreground-subtle: #8a97a0;
+  --color-legacy-foreground-inverse: #f8f9fa;
+  --color-legacy-foreground-link: #0067df;
+  --color-legacy-foreground-on-accent: #f8f9fa;
+  --color-legacy-border: #a4b1b8;
+  --color-legacy-border-subtle: #cfd8dd;
+  --color-legacy-border-disabled: #cfd8dd;
+  --color-legacy-border-grid: #f4f5f7;
+  --color-legacy-error: #a6040a;
+  --color-legacy-success: #038108;
+  --color-legacy-warning: #9e6100;
+  --color-legacy-info: #1665b3;
+  --color-legacy-ring: #0067df;
+  --color-legacy-logo: #fa4616;
+  --color-future-surface: var(--color-legacy-surface);
+  --color-future-surface-raised: var(--color-legacy-surface-raised);
+  --color-future-surface-overlay: var(--color-legacy-surface-overlay);
+  --color-future-surface-hover: var(--color-legacy-surface-hover);
+  --color-future-surface-muted: var(--color-legacy-surface-muted);
+  --color-future-surface-inverse: var(--color-legacy-surface-inverse);
+  --color-future-accent: var(--color-legacy-accent);
+  --color-future-accent-subtle: var(--color-legacy-accent-lighter);
+  --color-future-foreground: var(--color-legacy-foreground);
+  --color-future-foreground-secondary: var(--color-legacy-foreground-emp);
+  --color-future-foreground-hover: var(--color-legacy-foreground-muted);
+  --color-future-foreground-muted: var(--color-legacy-foreground-muted);
+  --color-future-foreground-subtle: var(--color-legacy-foreground-subtle);
+  --color-future-foreground-inverse: var(--color-legacy-foreground-inverse);
+  --color-future-foreground-on-accent: var(--color-legacy-foreground-on-accent);
+  --color-future-accent-foreground: var(--color-legacy-accent);
+  --color-future-accent-foreground-muted: var(--color-legacy-accent-hover);
+  --color-future-border: var(--color-legacy-border);
+  --color-future-border-subtle: var(--color-legacy-border-subtle);
+  --color-future-border-muted: var(--color-legacy-border-grid);
+  --color-future-border-deep: var(--color-legacy-border-grid);
+  --color-future-border-inverse: var(--color-legacy-border);
+  --color-future-border-hover: var(--color-legacy-border);
+  --color-future-ring: var(--color-legacy-ring);
+  --color-background: var(--color-legacy-surface);
+  --color-foreground: var(--color-legacy-foreground);
+  --color-card: var(--color-legacy-surface-raised);
+  --color-card-foreground: var(--color-legacy-foreground);
+  --color-popover: var(--color-legacy-surface-raised);
+  --color-popover-foreground: var(--color-legacy-foreground);
+  --color-primary: var(--color-legacy-accent);
+  --color-primary-foreground: var(--color-legacy-foreground-on-accent);
+  --color-secondary: var(--color-legacy-surface-overlay);
+  --color-secondary-foreground: var(--color-legacy-foreground-muted);
+  --color-muted: var(--color-legacy-surface-overlay);
+  --color-muted-foreground: var(--color-legacy-foreground-muted);
+  --color-accent: var(--color-legacy-surface-selected);
+  --color-accent-foreground: var(--color-legacy-foreground-emp);
+  --color-destructive: var(--color-legacy-error);
+  --color-border: var(--color-legacy-border-subtle);
+  --color-border-de-emp: var(--color-legacy-border-subtle);
+  --color-input: var(--color-legacy-border-subtle);
+  --color-ring: var(--color-legacy-ring);
+  color-scheme: light;
+}
 @property --tw-translate-x {
   syntax: "*";
   inherits: false;