@agentuity/workbench 0.0.104 → 0.0.106

package/dist/standalone.css

@@ -2,128 +2,87 @@
 @import url('https://fonts.googleapis.com/css2?family=Geist+Mono:wght@100..900&family=Geist:wght@100..900&display=block');
 @layer properties;
 :root {
-  --background: hsl(0 0% 100%);
-  --foreground: hsl(240 10% 3.9%);
-  --card: hsl(0 0% 100%);
-  --card-foreground: hsl(240 10% 3.9%);
-  --popover: hsl(0 0% 100%);
-  --popover-foreground: hsl(240 10% 3.9%);
-  --primary: hsl(240 5.9% 10%);
-  --primary-foreground: hsl(0 0% 98%);
-  --secondary: hsl(240 4.8% 95.9%);
-  --secondary-foreground: hsl(240 5.9% 10%);
-  --muted: hsl(240 4.8% 95.9%);
-  --muted-foreground: hsl(240 3.8% 46.1%);
-  --accent: hsl(240 4.8% 95.9%);
-  --accent-foreground: hsl(240 5.9% 10%);
-  --destructive: hsl(347 77% 50%);
-  --destructive-foreground: hsl(0 0% 98%);
-  --border: hsl(240 5.9% 90%);
-  --input: hsl(240 5.9% 90%);
-  --ring: hsl(240 10% 3.9%);
-  --chart-1: hsl(12 76% 61%);
-  --chart-2: hsl(173 58% 39%);
-  --chart-3: hsl(197 37% 24%);
-  --chart-4: hsl(43 74% 66%);
-  --chart-5: hsl(27 87% 67%);
+  --background: 0 0% 100%;
+  --foreground: 240 10% 3.9%;
+  --card: 0 0% 100%;
+  --card-foreground: 240 10% 3.9%;
+  --popover: 0 0% 100%;
+  --popover-foreground: 240 10% 3.9%;
+  --primary: 240 5.9% 10%;
+  --primary-foreground: 0 0% 98%;
+  --secondary: 240 4.8% 95.9%;
+  --secondary-foreground: 240 5.9% 10%;
+  --muted: 240 4.8% 95.9%;
+  --muted-foreground: 240 3.8% 46.1%;
+  --accent: 240 4.8% 95.9%;
+  --accent-foreground: 240 5.9% 10%;
+  --destructive: 347 77% 50%;
+  --destructive-foreground: 0 0% 98%;
+  --border: 240 5.9% 90%;
+  --input: 240 5.9% 90%;
+  --ring: 240 10% 3.9%;
+  --chart-1: 12 76% 61%;
+  --chart-2: 173 58% 39%;
+  --chart-3: 197 37% 24%;
+  --chart-4: 43 74% 66%;
+  --chart-5: 27 87% 67%;
   --radius: 0.5rem;
-  --sidebar-background: hsl(0 0% 98%);
-  --sidebar-foreground: hsl(240 5.3% 26.1%);
-  --sidebar-primary: hsl(240 5.9% 10%);
-  --sidebar-primary-foreground: hsl(0 0% 98%);
-  --sidebar-accent: hsl(240 4.8% 95.9%);
-  --sidebar-accent-foreground: hsl(240 5.9% 10%);
-  --sidebar-border: hsl(220 13% 91%);
-  --sidebar-ring: hsl(217.2 91.2% 59.8%);
+  --sidebar-background: 0 0% 98%;
+  --sidebar-foreground: 240 5.3% 26.1%;
+  --sidebar-primary: 240 5.9% 10%;
+  --sidebar-primary-foreground: 0 0% 98%;
+  --sidebar-accent: 240 4.8% 95.9%;
+  --sidebar-accent-foreground: 240 5.9% 10%;
+  --sidebar-border: 220 13% 91%;
+  --sidebar-ring: 217.2 91.2% 59.8%;
 }
 .dark {
-  --background: hsl(240 10% 3.9%);
-  --foreground: hsl(0 0% 98%);
-  --card: hsl(240 10% 3.9%);
-  --card-foreground: hsl(0 0% 98%);
-  --popover: hsl(240 10% 3.9%);
-  --popover-foreground: hsl(0 0% 98%);
-  --primary: hsl(0 0% 98%);
-  --primary-foreground: hsl(240 5.9% 10%);
-  --secondary: hsl(240 3.7% 15.9%);
-  --secondary-foreground: hsl(0 0% 98%);
-  --muted: hsl(240 3.7% 15.9%);
-  --muted-foreground: hsl(240 5% 64.9%);
-  --accent: hsl(240 3.7% 15.9%);
-  --accent-foreground: hsl(0 0% 98%);
-  --destructive: hsl(345 83% 41%);
-  --destructive-foreground: hsl(0 0% 98%);
-  --border: hsl(240 3.7% 15.9%);
-  --input: hsl(240 3.7% 15.9%);
-  --ring: hsl(240 4.9% 83.9%);
-  --chart-1: hsl(220 70% 50%);
-  --chart-2: hsl(160 60% 45%);
-  --chart-3: hsl(30 80% 55%);
-  --chart-4: hsl(280 65% 60%);
-  --chart-5: hsl(340 75% 55%);
-  --sidebar-background: hsl(240 5.9% 10%);
-  --sidebar-foreground: hsl(240 4.8% 95.9%);
-  --sidebar-primary: hsl(224.3 76.3% 48%);
-  --sidebar-primary-foreground: hsl(0 0% 100%);
-  --sidebar-accent: hsl(240 3.7% 15.9%);
-  --sidebar-accent-foreground: hsl(240 4.8% 95.9%);
-  --sidebar-border: hsl(240 3.7% 15.9%);
-  --sidebar-ring: hsl(217.2 91.2% 59.8%);
+  --background: 240 10% 3.9%;
+  --foreground: 0 0% 98%;
+  --card: 240 10% 3.9%;
+  --card-foreground: 0 0% 98%;
+  --popover: 240 10% 3.9%;
+  --popover-foreground: 0 0% 98%;
+  --primary: 0 0% 98%;
+  --primary-foreground: 240 5.9% 10%;
+  --secondary: 240 3.7% 15.9%;
+  --secondary-foreground: 0 0% 98%;
+  --muted: 240 3.7% 15.9%;
+  --muted-foreground: 240 5% 64.9%;
+  --accent: 240 3.7% 15.9%;
+  --accent-foreground: 0 0% 98%;
+  --destructive: 345 83% 41%;
+  --destructive-foreground: 0 0% 98%;
+  --border: 240 3.7% 15.9%;
+  --input: 240 3.7% 15.9%;
+  --ring: 240 4.9% 83.9%;
+  --chart-1: 220 70% 50%;
+  --chart-2: 160 60% 45%;
+  --chart-3: 30 80% 55%;
+  --chart-4: 280 65% 60%;
+  --chart-5: 340 75% 55%;
+  --sidebar-background: 240 5.9% 10%;
+  --sidebar-foreground: 240 4.8% 95.9%;
+  --sidebar-primary: 224.3 76.3% 48%;
+  --sidebar-primary-foreground: 0 0% 100%;
+  --sidebar-accent: 240 3.7% 15.9%;
+  --sidebar-accent-foreground: 240 4.8% 95.9%;
+  --sidebar-border: 240 3.7% 15.9%;
+  --sidebar-ring: 217.2 91.2% 59.8%;
 }
 :root, :host {
-  --color-background: var(--background);
-  --color-muted-foreground: var(--muted-foreground);
+  --color-gray-200: oklch(0.92 0.004 286.32);
+  --color-gray-800: oklch(0.274 0.006 286.033);
+  --color-background: hsl(var(--background));
+  --color-muted-foreground: hsl(var(--muted-foreground));
   --color-amber-400: oklch(82.8% 0.189 84.429);
   --color-amber-500: oklch(76.9% 0.188 70.08);
   --color-amber-600: oklch(66.6% 0.179 58.318);
-  --color-emerald-50: oklch(97.9% 0.021 166.113);
-  --color-emerald-100: oklch(95% 0.052 163.051);
-  --color-emerald-200: oklch(90.5% 0.093 164.15);
-  --color-emerald-300: oklch(84.5% 0.143 164.978);
-  --color-emerald-400: oklch(76.5% 0.177 163.223);
-  --color-emerald-500: oklch(69.6% 0.17 162.48);
-  --color-emerald-600: oklch(59.6% 0.145 163.225);
-  --color-emerald-700: oklch(50.8% 0.118 165.612);
-  --color-emerald-800: oklch(43.2% 0.095 166.913);
-  --color-emerald-900: oklch(37.8% 0.077 168.94);
-  --color-emerald-950: oklch(26.2% 0.051 172.552);
-  --color-sky-50: oklch(97.7% 0.013 236.62);
-  --color-sky-100: oklch(95.1% 0.026 236.824);
-  --color-sky-200: oklch(90.1% 0.058 230.902);
-  --color-sky-300: oklch(82.8% 0.111 230.318);
-  --color-sky-400: oklch(74.6% 0.16 232.661);
-  --color-sky-500: oklch(68.5% 0.169 237.323);
-  --color-sky-600: oklch(58.8% 0.158 241.966);
-  --color-sky-700: oklch(50% 0.134 242.749);
-  --color-sky-800: oklch(44.3% 0.11 240.79);
-  --color-sky-900: oklch(39.1% 0.09 240.876);
-  --color-sky-950: oklch(29.3% 0.066 243.157);
-  --color-rose-50: oklch(96.9% 0.015 12.422);
-  --color-rose-100: oklch(94.1% 0.03 12.58);
-  --color-rose-200: oklch(89.2% 0.058 10.001);
-  --color-rose-300: oklch(81% 0.117 11.638);
-  --color-rose-400: oklch(71.2% 0.194 13.428);
-  --color-rose-500: oklch(64.5% 0.246 16.439);
-  --color-rose-600: oklch(58.6% 0.253 17.585);
-  --color-rose-700: oklch(51.4% 0.222 16.935);
-  --color-rose-800: oklch(45.5% 0.188 13.697);
-  --color-rose-900: oklch(41% 0.159 10.272);
-  --color-rose-950: oklch(27.1% 0.105 12.094);
-  --color-zinc-50: oklch(98.5% 0 0);
-  --color-zinc-100: oklch(96.7% 0.001 286.375);
-  --color-zinc-200: oklch(92% 0.004 286.32);
-  --color-zinc-300: oklch(87.1% 0.006 286.286);
-  --color-zinc-400: oklch(70.5% 0.015 286.067);
-  --color-zinc-500: oklch(55.2% 0.016 285.938);
-  --color-zinc-600: oklch(44.2% 0.017 285.786);
-  --color-zinc-700: oklch(37% 0.013 285.805);
-  --color-zinc-800: oklch(27.4% 0.006 286.033);
-  --color-zinc-900: oklch(21% 0.006 285.885);
-  --color-zinc-950: oklch(14.1% 0.005 285.823);
   --color-black: #000;
   --color-white: #fff;
   --spacing: 0.25rem;
   --container-lg: 32rem;
+  --container-xl: 36rem;
   --text-xs: 0.75rem;
   --text-xs--line-height: calc(1 / 0.75);
   --text-sm: 0.875rem;
@@ -135,15 +94,14 @@
   --font-weight-normal: 400;
   --font-weight-medium: 500;
   --font-weight-semibold: 600;
-  --tracking-wide: 0.025em;
   --tracking-widest: 0.1em;
   --radius-xs: 0.125rem;
   --animate-spin: spin 1s linear infinite;
   --animate-pulse: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
   --default-transition-duration: 150ms;
   --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
-  --default-font-family: 'Geist';
-  --default-mono-font-family: 'Geist Mono';
+  --default-font-family: 'Geist', ui-sans-serif, system-ui, sans-serif;
+  --default-mono-font-family: 'Geist Mono', ui-monospace, monospace;
 }
 @keyframes accordion-down {
   from {
@@ -175,6 +133,13 @@
     content: '';
   }
 }
+body {
+  scrollbar-width: thin;
+  scrollbar-color: var(--color-gray-200) transparent;
+}
+.dark body {
+  scrollbar-color: var(--color-gray-800) transparent;
+}
 button:not([disabled]):not([aria-disabled='true']), [role='button']:not([disabled]):not([aria-disabled='true']) {
   cursor: pointer;
 }
@@ -182,6 +147,7 @@ button:not([disabled]):not([aria-disabled='true']), [role='button']:not([disable
   content: '.';
   display: inline-block;
   width: 1em;
+  text-align: left;
   animation: ellipsis 1.5s steps(4, end) infinite;
 }
 @layer theme, base, components, utilities;
@@ -361,14 +327,11 @@ button:not([disabled]):not([aria-disabled='true']), [role='button']:not([disable
   .static {
     position: static;
   }
-  .sticky {
-    position: sticky;
-  }
   .inset-0 {
     inset: calc(var(--spacing) * 0);
   }
-  .top-2 {
-    top: calc(var(--spacing) * 2);
+  .top-1 {
+    top: calc(var(--spacing) * 1);
   }
   .top-4 {
     top: calc(var(--spacing) * 4);
@@ -376,14 +339,17 @@ button:not([disabled]):not([aria-disabled='true']), [role='button']:not([disable
   .top-\[50\%\] {
     top: 50%;
   }
+  .right-1 {
+    right: calc(var(--spacing) * 1);
+  }
   .right-2 {
     right: calc(var(--spacing) * 2);
   }
   .right-4 {
     right: calc(var(--spacing) * 4);
   }
-  .bottom-4 {
-    bottom: calc(var(--spacing) * 4);
+  .bottom-0 {
+    bottom: calc(var(--spacing) * 0);
   }
   .left-2 {
     left: calc(var(--spacing) * 2);
@@ -397,6 +363,12 @@ button:not([disabled]):not([aria-disabled='true']), [role='button']:not([disable
   .z-50 {
     z-index: 50;
   }
+  .z-100 {
+    z-index: 100;
+  }
+  .z-101 {
+    z-index: 101;
+  }
   .order-first {
     order: -9999;
   }
@@ -494,6 +466,10 @@ button:not([disabled]):not([aria-disabled='true']), [role='button']:not([disable
     width: calc(var(--spacing) * 6);
     height: calc(var(--spacing) * 6);
   }
+  .size-7 {
+    width: calc(var(--spacing) * 7);
+    height: calc(var(--spacing) * 7);
+  }
   .size-8 {
     width: calc(var(--spacing) * 8);
     height: calc(var(--spacing) * 8);
@@ -510,9 +486,6 @@ button:not([disabled]):not([aria-disabled='true']), [role='button']:not([disable
     width: 100%;
     height: 100%;
   }
-  .h-2 {
-    height: calc(var(--spacing) * 2);
-  }
   .h-2\.5 {
     height: calc(var(--spacing) * 2.5);
   }
@@ -570,9 +543,6 @@ button:not([disabled]):not([aria-disabled='true']), [role='button']:not([disable
   .w-0 {
     width: calc(var(--spacing) * 0);
   }
-  .w-2 {
-    width: calc(var(--spacing) * 2);
-  }
   .w-2\.5 {
     width: calc(var(--spacing) * 2.5);
   }
@@ -612,6 +582,9 @@ button:not([disabled]):not([aria-disabled='true']), [role='button']:not([disable
   .max-w-full {
     max-width: 100%;
   }
+  .max-w-xl {
+    max-width: var(--container-xl);
+  }
   .min-w-0 {
     min-width: calc(var(--spacing) * 0);
   }
@@ -649,6 +622,14 @@ button:not([disabled]):not([aria-disabled='true']), [role='button']:not([disable
     --tw-translate-x: -50%;
     translate: var(--tw-translate-x) var(--tw-translate-y);
   }
+  .-translate-y-1\/2 {
+    --tw-translate-y: calc(calc(1/2 * 100%) * -1);
+    translate: var(--tw-translate-x) var(--tw-translate-y);
+  }
+  .translate-y-0 {
+    --tw-translate-y: calc(var(--spacing) * 0);
+    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);
@@ -769,13 +750,6 @@ button:not([disabled]):not([aria-disabled='true']), [role='button']:not([disable
       margin-block-end: calc(calc(var(--spacing) * 1) * calc(1 - var(--tw-space-y-reverse)));
     }
   }
-  .space-y-2 {
-    :where(& > :not(:last-child)) {
-      --tw-space-y-reverse: 0;
-      margin-block-start: calc(calc(var(--spacing) * 2) * var(--tw-space-y-reverse));
-      margin-block-end: calc(calc(var(--spacing) * 2) * calc(1 - var(--tw-space-y-reverse)));
-    }
-  }
   .space-y-3 {
     :where(& > :not(:last-child)) {
       --tw-space-y-reverse: 0;
@@ -783,13 +757,6 @@ button:not([disabled]):not([aria-disabled='true']), [role='button']:not([disable
       margin-block-end: calc(calc(var(--spacing) * 3) * calc(1 - var(--tw-space-y-reverse)));
     }
   }
-  .space-y-6 {
-    :where(& > :not(:last-child)) {
-      --tw-space-y-reverse: 0;
-      margin-block-start: calc(calc(var(--spacing) * 6) * var(--tw-space-y-reverse));
-      margin-block-end: calc(calc(var(--spacing) * 6) * calc(1 - var(--tw-space-y-reverse)));
-    }
-  }
   .truncate {
     overflow: hidden;
     text-overflow: ellipsis;
@@ -798,6 +765,9 @@ button:not([disabled]):not([aria-disabled='true']), [role='button']:not([disable
   .overflow-hidden {
     overflow: hidden;
   }
+  .overflow-x-auto {
+    overflow-x: auto;
+  }
   .overflow-x-hidden {
     overflow-x: hidden;
   }
@@ -859,10 +829,10 @@ button:not([disabled]):not([aria-disabled='true']), [role='button']:not([disable
     border-style: none;
   }
   .border-border {
-    border-color: var(--border);
+    border-color: hsl(var(--border));
   }
   .border-input {
-    border-color: var(--input);
+    border-color: hsl(var(--input));
   }
   .border-t-transparent {
     border-top-color: transparent;
@@ -871,13 +841,13 @@ button:not([disabled]):not([aria-disabled='true']), [role='button']:not([disable
     border-left-color: transparent;
   }
   .bg-accent {
-    background-color: var(--accent);
+    background-color: hsl(var(--accent));
   }
   .bg-amber-500 {
     background-color: var(--color-amber-500);
   }
   .bg-background {
-    background-color: var(--background);
+    background-color: hsl(var(--background));
   }
   .bg-black\/50 {
     background-color: color-mix(in srgb, #000 50%, transparent);
@@ -886,44 +856,50 @@ button:not([disabled]):not([aria-disabled='true']), [role='button']:not([disable
     }
   }
   .bg-border {
-    background-color: var(--border);
+    background-color: hsl(var(--border));
   }
   .bg-destructive {
-    background-color: var(--destructive);
+    background-color: hsl(var(--destructive));
   }
   .bg-destructive\/10 {
-    background-color: var(--destructive);
+    background-color: hsl(var(--destructive));
     @supports (color: color-mix(in lab, red, red)) {
-      background-color: color-mix(in oklab, var(--destructive) 10%, transparent);
+      background-color: color-mix(in oklab, hsl(var(--destructive)) 10%, transparent);
     }
   }
   .bg-foreground {
-    background-color: var(--foreground);
+    background-color: hsl(var(--foreground));
   }
   .bg-green-500 {
-    background-color: var(--color-emerald-500);
+    background-color: oklch(0.696 0.17 162.48);
+  }
+  .bg-input\/30 {
+    background-color: hsl(var(--input));
+    @supports (color: color-mix(in lab, red, red)) {
+      background-color: color-mix(in oklab, hsl(var(--input)) 30%, transparent);
+    }
   }
   .bg-muted {
-    background-color: var(--muted);
+    background-color: hsl(var(--muted));
   }
   .bg-popover {
-    background-color: var(--popover);
+    background-color: hsl(var(--popover));
   }
   .bg-primary {
-    background-color: var(--primary);
+    background-color: hsl(var(--primary));
   }
   .bg-red-500 {
-    background-color: var(--color-rose-500);
+    background-color: oklch(0.645 0.246 16.439);
   }
   .bg-secondary {
-    background-color: var(--secondary);
+    background-color: hsl(var(--secondary));
+  }
+  .bg-secondary\! {
+    background-color: hsl(var(--secondary)) !important;
   }
   .bg-transparent {
     background-color: transparent;
   }
-  .bg-none {
-    background-image: none;
-  }
   .bg-\[length\:250\%_100\%\,auto\] {
     background-size: 250% 100%,auto;
   }
@@ -937,10 +913,10 @@ button:not([disabled]):not([aria-disabled='true']), [role='button']:not([disable
     fill: currentcolor;
   }
   .fill-cyan-600 {
-    fill: #00cccc;
+    fill: oklch(0.7653 0.1306 194.77);
   }
   .fill-foreground {
-    fill: var(--foreground);
+    fill: hsl(var(--foreground));
   }
   .object-contain {
     object-fit: contain;
@@ -990,6 +966,9 @@ button:not([disabled]):not([aria-disabled='true']), [role='button']:not([disable
   .px-4 {
     padding-inline: calc(var(--spacing) * 4);
   }
+  .px-4\.5 {
+    padding-inline: calc(var(--spacing) * 4.5);
+  }
   .px-6 {
     padding-inline: calc(var(--spacing) * 6);
   }
@@ -1002,6 +981,9 @@ button:not([disabled]):not([aria-disabled='true']), [role='button']:not([disable
   .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);
   }
@@ -1014,6 +996,9 @@ button:not([disabled]):not([aria-disabled='true']), [role='button']:not([disable
   .py-8 {
     padding-block: calc(var(--spacing) * 8);
   }
+  .pt-0 {
+    padding-top: calc(var(--spacing) * 0);
+  }
   .pt-3 {
     padding-top: calc(var(--spacing) * 3);
   }
@@ -1026,9 +1011,6 @@ button:not([disabled]):not([aria-disabled='true']), [role='button']:not([disable
   .pr-8 {
     padding-right: calc(var(--spacing) * 8);
   }
-  .pb-0 {
-    padding-bottom: calc(var(--spacing) * 0);
-  }
   .pb-3 {
     padding-bottom: calc(var(--spacing) * 3);
   }
@@ -1048,7 +1030,7 @@ button:not([disabled]):not([aria-disabled='true']), [role='button']:not([disable
     text-align: right;
   }
   .font-mono {
-    font-family: 'Geist Mono';
+    font-family: 'Geist Mono', ui-monospace, monospace;
   }
   .text-base {
     font-size: var(--text-base);
@@ -1066,6 +1048,10 @@ button:not([disabled]):not([aria-disabled='true']), [role='button']:not([disable
     font-size: var(--text-xs);
     line-height: var(--tw-leading, var(--text-xs--line-height));
   }
+  .text-xs\! {
+    font-size: var(--text-xs) !important;
+    line-height: var(--tw-leading, var(--text-xs--line-height)) !important;
+  }
   .leading-none {
     --tw-leading: 1;
     line-height: 1;
@@ -1082,10 +1068,6 @@ button:not([disabled]):not([aria-disabled='true']), [role='button']:not([disable
     --tw-font-weight: var(--font-weight-semibold);
     font-weight: var(--font-weight-semibold);
   }
-  .tracking-wide {
-    --tw-tracking: var(--tracking-wide);
-    letter-spacing: var(--tracking-wide);
-  }
   .tracking-widest {
     --tw-tracking: var(--tracking-widest);
     letter-spacing: var(--tracking-widest);
@@ -1096,47 +1078,56 @@ button:not([disabled]):not([aria-disabled='true']), [role='button']:not([disable
   .whitespace-nowrap {
     white-space: nowrap;
   }
+  .whitespace-pre-wrap {
+    white-space: pre-wrap;
+  }
   .text-accent-foreground {
-    color: var(--accent-foreground);
+    color: hsl(var(--accent-foreground));
   }
   .text-amber-600 {
     color: var(--color-amber-600);
   }
   .text-background {
-    color: var(--background);
+    color: hsl(var(--background));
   }
   .text-destructive {
-    color: var(--destructive);
+    color: hsl(var(--destructive));
   }
   .text-foreground {
-    color: var(--foreground);
-  }
-  .text-foreground\! {
-    color: var(--foreground) !important;
+    color: hsl(var(--foreground));
   }
   .text-green-500 {
-    color: var(--color-emerald-500);
+    color: oklch(0.696 0.17 162.48);
   }
   .text-green-600 {
-    color: var(--color-emerald-600);
+    color: oklch(0.596 0.145 163.225);
+  }
+  .text-inherit {
+    color: inherit;
   }
   .text-muted-foreground {
-    color: var(--muted-foreground);
+    color: hsl(var(--muted-foreground));
+  }
+  .text-muted-foreground\/70 {
+    color: hsl(var(--muted-foreground));
+    @supports (color: color-mix(in lab, red, red)) {
+      color: color-mix(in oklab, hsl(var(--muted-foreground)) 70%, transparent);
+    }
   }
   .text-popover-foreground {
-    color: var(--popover-foreground);
+    color: hsl(var(--popover-foreground));
   }
   .text-primary {
-    color: var(--primary);
+    color: hsl(var(--primary));
   }
   .text-primary-foreground {
-    color: var(--primary-foreground);
+    color: hsl(var(--primary-foreground));
   }
   .text-red-600 {
-    color: var(--color-rose-600);
+    color: oklch(0.586 0.253 17.585);
   }
   .text-secondary-foreground {
-    color: var(--secondary-foreground);
+    color: hsl(var(--secondary-foreground));
   }
   .text-transparent {
     color: transparent;
@@ -1144,15 +1135,15 @@ button:not([disabled]):not([aria-disabled='true']), [role='button']:not([disable
   .text-white {
     color: var(--color-white);
   }
-  .uppercase {
-    text-transform: uppercase;
-  }
   .underline-offset-4 {
     text-underline-offset: 4px;
   }
   .opacity-0 {
     opacity: 0%;
   }
+  .opacity-10\! {
+    opacity: 10% !important;
+  }
   .opacity-50 {
     opacity: 50%;
   }
@@ -1182,19 +1173,15 @@ button:not([disabled]):not([aria-disabled='true']), [role='button']:not([disable
     --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);
   }
-  .ring {
-    --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-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-border {
-    --tw-ring-color: var(--border);
+    --tw-ring-color: hsl(var(--border));
   }
   .ring-offset-background {
-    --tw-ring-offset-color: var(--background);
+    --tw-ring-offset-color: hsl(var(--background));
   }
   .outline-hidden {
     --tw-outline-style: none;
@@ -1237,6 +1224,10 @@ button:not([disabled]):not([aria-disabled='true']), [role='button']:not([disable
     --tw-duration: 200ms;
     transition-duration: 200ms;
   }
+  .duration-300 {
+    --tw-duration: 300ms;
+    transition-duration: 300ms;
+  }
   .animate-in {
     animation-name: enter;
     animation-duration: 150ms;
@@ -1260,6 +1251,9 @@ button:not([disabled]):not([aria-disabled='true']), [role='button']:not([disable
   .duration-200 {
     animation-duration: 200ms;
   }
+  .duration-300 {
+    animation-duration: 300ms;
+  }
   .fade-in-0 {
     --tw-enter-opacity: 0;
   }
@@ -1302,29 +1296,14 @@ button:not([disabled]):not([aria-disabled='true']), [role='button']:not([disable
       opacity: 50%;
     }
   }
-  .group-\[\.is-assistant\]\:bg-secondary {
-    &:is(:where(.group):is(.is-assistant) *) {
-      background-color: var(--secondary);
-    }
-  }
-  .group-\[\.is-assistant\]\:text-foreground {
-    &:is(:where(.group):is(.is-assistant) *) {
-      color: var(--foreground);
-    }
-  }
   .group-\[\.is-user\]\:max-w-\[80\%\] {
     &:is(:where(.group):is(.is-user) *) {
       max-width: 80%;
     }
   }
-  .group-\[\.is-user\]\:bg-primary {
-    &:is(:where(.group):is(.is-user) *) {
-      background-color: var(--primary);
-    }
-  }
   .group-\[\.is-user\]\:bg-secondary {
     &:is(:where(.group):is(.is-user) *) {
-      background-color: var(--secondary);
+      background-color: hsl(var(--secondary));
     }
   }
   .group-\[\.is-user\]\:px-4 {
@@ -1339,28 +1318,23 @@ button:not([disabled]):not([aria-disabled='true']), [role='button']:not([disable
   }
   .group-\[\.is-user\]\:text-foreground {
     &:is(:where(.group):is(.is-user) *) {
-      color: var(--foreground);
-    }
-  }
-  .group-\[\.is-user\]\:text-primary-foreground {
-    &:is(:where(.group):is(.is-user) *) {
-      color: var(--primary-foreground);
+      color: hsl(var(--foreground));
     }
   }
   .selection\:bg-primary {
     & *::selection {
-      background-color: var(--primary);
+      background-color: hsl(var(--primary));
     }
     &::selection {
-      background-color: var(--primary);
+      background-color: hsl(var(--primary));
     }
   }
   .selection\:text-primary-foreground {
     & *::selection {
-      color: var(--primary-foreground);
+      color: hsl(var(--primary-foreground));
     }
     &::selection {
-      color: var(--primary-foreground);
+      color: hsl(var(--primary-foreground));
     }
   }
   .file\:inline-flex {
@@ -1398,12 +1372,12 @@ button:not([disabled]):not([aria-disabled='true']), [role='button']:not([disable
   }
   .file\:text-foreground {
     &::file-selector-button {
-      color: var(--foreground);
+      color: hsl(var(--foreground));
     }
   }
   .placeholder\:text-muted-foreground {
     &::placeholder {
-      color: var(--muted-foreground);
+      color: hsl(var(--muted-foreground));
     }
   }
   .after\:absolute {
@@ -1440,16 +1414,23 @@ button:not([disabled]):not([aria-disabled='true']), [role='button']:not([disable
   .hover\:bg-accent {
     &:hover {
       @media (hover: hover) {
-        background-color: var(--accent);
+        background-color: hsl(var(--accent));
+      }
+    }
+  }
+  .hover\:bg-background {
+    &:hover {
+      @media (hover: hover) {
+        background-color: hsl(var(--background));
       }
     }
   }
   .hover\:bg-destructive\/90 {
     &:hover {
       @media (hover: hover) {
-        background-color: var(--destructive);
+        background-color: hsl(var(--destructive));
         @supports (color: color-mix(in lab, red, red)) {
-          background-color: color-mix(in oklab, var(--destructive) 90%, transparent);
+          background-color: color-mix(in oklab, hsl(var(--destructive)) 90%, transparent);
         }
       }
     }
@@ -1457,9 +1438,9 @@ button:not([disabled]):not([aria-disabled='true']), [role='button']:not([disable
   .hover\:bg-primary\/90 {
     &:hover {
       @media (hover: hover) {
-        background-color: var(--primary);
+        background-color: hsl(var(--primary));
         @supports (color: color-mix(in lab, red, red)) {
-          background-color: color-mix(in oklab, var(--primary) 90%, transparent);
+          background-color: color-mix(in oklab, hsl(var(--primary)) 90%, transparent);
         }
       }
     }
@@ -1467,9 +1448,9 @@ button:not([disabled]):not([aria-disabled='true']), [role='button']:not([disable
   .hover\:bg-secondary\/80 {
     &:hover {
       @media (hover: hover) {
-        background-color: var(--secondary);
+        background-color: hsl(var(--secondary));
         @supports (color: color-mix(in lab, red, red)) {
-          background-color: color-mix(in oklab, var(--secondary) 80%, transparent);
+          background-color: color-mix(in oklab, hsl(var(--secondary)) 80%, transparent);
         }
       }
     }
@@ -1484,21 +1465,21 @@ button:not([disabled]):not([aria-disabled='true']), [role='button']:not([disable
   .hover\:text-accent-foreground {
     &:hover {
       @media (hover: hover) {
-        color: var(--accent-foreground);
+        color: hsl(var(--accent-foreground));
       }
     }
   }
   .hover\:text-destructive {
     &:hover {
       @media (hover: hover) {
-        color: var(--destructive);
+        color: hsl(var(--destructive));
       }
     }
   }
   .hover\:text-foreground {
     &:hover {
       @media (hover: hover) {
-        color: var(--foreground);
+        color: hsl(var(--foreground));
       }
     }
   }
@@ -1518,12 +1499,12 @@ button:not([disabled]):not([aria-disabled='true']), [role='button']:not([disable
   }
   .focus\:bg-accent {
     &:focus {
-      background-color: var(--accent);
+      background-color: hsl(var(--accent));
     }
   }
   .focus\:text-accent-foreground {
     &:focus {
-      color: var(--accent-foreground);
+      color: hsl(var(--accent-foreground));
     }
   }
   .focus\:ring-2 {
@@ -1534,7 +1515,7 @@ button:not([disabled]):not([aria-disabled='true']), [role='button']:not([disable
   }
   .focus\:ring-ring {
     &:focus {
-      --tw-ring-color: var(--ring);
+      --tw-ring-color: hsl(var(--ring));
     }
   }
   .focus\:ring-offset-2 {
@@ -1555,7 +1536,7 @@ button:not([disabled]):not([aria-disabled='true']), [role='button']:not([disable
   }
   .focus-visible\:border-ring {
     &:focus-visible {
-      border-color: var(--ring);
+      border-color: hsl(var(--ring));
     }
   }
   .focus-visible\:ring-0 {
@@ -1578,22 +1559,22 @@ button:not([disabled]):not([aria-disabled='true']), [role='button']:not([disable
   }
   .focus-visible\:ring-destructive\/20 {
     &:focus-visible {
-      --tw-ring-color: var(--destructive);
+      --tw-ring-color: hsl(var(--destructive));
       @supports (color: color-mix(in lab, red, red)) {
-        --tw-ring-color: color-mix(in oklab, var(--destructive) 20%, transparent);
+        --tw-ring-color: color-mix(in oklab, hsl(var(--destructive)) 20%, transparent);
       }
     }
   }
   .focus-visible\:ring-ring {
     &:focus-visible {
-      --tw-ring-color: var(--ring);
+      --tw-ring-color: hsl(var(--ring));
     }
   }
   .focus-visible\:ring-ring\/50 {
     &:focus-visible {
-      --tw-ring-color: var(--ring);
+      --tw-ring-color: hsl(var(--ring));
       @supports (color: color-mix(in lab, red, red)) {
-        --tw-ring-color: color-mix(in oklab, var(--ring) 50%, transparent);
+        --tw-ring-color: color-mix(in oklab, hsl(var(--ring)) 50%, transparent);
       }
     }
   }
@@ -1636,7 +1617,7 @@ button:not([disabled]):not([aria-disabled='true']), [role='button']:not([disable
   }
   .has-\[\[data-slot\=input-group-control\]\:focus-visible\]\:border-ring {
     &:has(*:is([data-slot=input-group-control]:focus-visible)) {
-      border-color: var(--ring);
+      border-color: hsl(var(--ring));
     }
   }
   .has-\[\[data-slot\=input-group-control\]\:focus-visible\]\:ring-\[3px\] {
@@ -1647,15 +1628,15 @@ button:not([disabled]):not([aria-disabled='true']), [role='button']:not([disable
   }
   .has-\[\[data-slot\=input-group-control\]\:focus-visible\]\:ring-ring\/50 {
     &:has(*:is([data-slot=input-group-control]:focus-visible)) {
-      --tw-ring-color: var(--ring);
+      --tw-ring-color: hsl(var(--ring));
       @supports (color: color-mix(in lab, red, red)) {
-        --tw-ring-color: color-mix(in oklab, var(--ring) 50%, transparent);
+        --tw-ring-color: color-mix(in oklab, hsl(var(--ring)) 50%, transparent);
       }
     }
   }
   .has-\[\[data-slot\]\[aria-invalid\=true\]\]\:border-destructive {
     &:has(*:is([data-slot][aria-invalid=true])) {
-      border-color: var(--destructive);
+      border-color: hsl(var(--destructive));
     }
   }
   .has-\[\>\[data-align\=block-end\]\]\:h-auto {
@@ -1730,14 +1711,14 @@ button:not([disabled]):not([aria-disabled='true']), [role='button']:not([disable
   }
   .aria-invalid\:border-destructive {
     &[aria-invalid="true"] {
-      border-color: var(--destructive);
+      border-color: hsl(var(--destructive));
     }
   }
   .aria-invalid\:ring-destructive\/20 {
     &[aria-invalid="true"] {
-      --tw-ring-color: var(--destructive);
+      --tw-ring-color: hsl(var(--destructive));
       @supports (color: color-mix(in lab, red, red)) {
-        --tw-ring-color: color-mix(in oklab, var(--destructive) 20%, transparent);
+        --tw-ring-color: color-mix(in oklab, hsl(var(--destructive)) 20%, transparent);
       }
     }
   }
@@ -1833,17 +1814,17 @@ button:not([disabled]):not([aria-disabled='true']), [role='button']:not([disable
   }
   .data-\[placeholder\]\:text-muted-foreground {
     &[data-placeholder] {
-      color: var(--muted-foreground);
+      color: hsl(var(--muted-foreground));
     }
   }
   .data-\[selected\=true\]\:bg-accent {
     &[data-selected="true"] {
-      background-color: var(--accent);
+      background-color: hsl(var(--accent));
     }
   }
   .data-\[selected\=true\]\:text-accent-foreground {
     &[data-selected="true"] {
-      color: var(--accent-foreground);
+      color: hsl(var(--accent-foreground));
     }
   }
   .data-\[side\=bottom\]\:translate-y-1 {
@@ -1961,17 +1942,17 @@ button:not([disabled]):not([aria-disabled='true']), [role='button']:not([disable
   }
   .data-\[state\=open\]\:bg-accent {
     &[data-state="open"] {
-      background-color: var(--accent);
+      background-color: hsl(var(--accent));
     }
   }
   .data-\[state\=open\]\:text-accent-foreground {
     &[data-state="open"] {
-      color: var(--accent-foreground);
+      color: hsl(var(--accent-foreground));
     }
   }
   .data-\[state\=open\]\:text-muted-foreground {
     &[data-state="open"] {
-      color: var(--muted-foreground);
+      color: hsl(var(--muted-foreground));
     }
   }
   .data-\[state\=open\]\:animate-in {
@@ -1997,15 +1978,15 @@ button:not([disabled]):not([aria-disabled='true']), [role='button']:not([disable
   }
   .data-\[variant\=destructive\]\:text-destructive {
     &[data-variant="destructive"] {
-      color: var(--destructive);
+      color: hsl(var(--destructive));
     }
   }
   .data-\[variant\=destructive\]\:focus\:bg-destructive\/10 {
     &[data-variant="destructive"] {
       &:focus {
-        background-color: var(--destructive);
+        background-color: hsl(var(--destructive));
         @supports (color: color-mix(in lab, red, red)) {
-          background-color: color-mix(in oklab, var(--destructive) 10%, transparent);
+          background-color: color-mix(in oklab, hsl(var(--destructive)) 10%, transparent);
         }
       }
     }
@@ -2013,7 +1994,7 @@ button:not([disabled]):not([aria-disabled='true']), [role='button']:not([disable
   .data-\[variant\=destructive\]\:focus\:text-destructive {
     &[data-variant="destructive"] {
       &:focus {
-        color: var(--destructive);
+        color: hsl(var(--destructive));
       }
     }
   }
@@ -2081,22 +2062,27 @@ button:not([disabled]):not([aria-disabled='true']), [role='button']:not([disable
   }
   .dark\:border-input {
     &:is(.dark *) {
-      border-color: var(--input);
+      border-color: hsl(var(--input));
+    }
+  }
+  .dark\:bg-background {
+    &:is(.dark *) {
+      background-color: hsl(var(--background));
     }
   }
   .dark\:bg-destructive\/60 {
     &:is(.dark *) {
-      background-color: var(--destructive);
+      background-color: hsl(var(--destructive));
       @supports (color: color-mix(in lab, red, red)) {
-        background-color: color-mix(in oklab, var(--destructive) 60%, transparent);
+        background-color: color-mix(in oklab, hsl(var(--destructive)) 60%, transparent);
       }
     }
   }
   .dark\:bg-input\/30 {
     &:is(.dark *) {
-      background-color: var(--input);
+      background-color: hsl(var(--input));
       @supports (color: color-mix(in lab, red, red)) {
-        background-color: color-mix(in oklab, var(--input) 30%, transparent);
+        background-color: color-mix(in oklab, hsl(var(--input)) 30%, transparent);
       }
     }
   }
@@ -2107,7 +2093,7 @@ button:not([disabled]):not([aria-disabled='true']), [role='button']:not([disable
   }
   .dark\:fill-cyan-500 {
     &:is(.dark *) {
-      fill: #00ffff;
+      fill: oklch(0.9054 0.15455 194.769);
     }
   }
   .dark\:text-amber-400 {
@@ -2117,33 +2103,66 @@ button:not([disabled]):not([aria-disabled='true']), [role='button']:not([disable
   }
   .dark\:text-green-400 {
     &:is(.dark *) {
-      color: var(--color-emerald-400);
+      color: oklch(0.765 0.177 163.223);
     }
   }
   .dark\:text-red-400 {
     &:is(.dark *) {
-      color: var(--color-rose-400);
+      color: oklch(0.712 0.194 13.428);
+    }
+  }
+  .dark\:hover\:border-border\/50 {
+    &:is(.dark *) {
+      &:hover {
+        @media (hover: hover) {
+          border-color: hsl(var(--border));
+          @supports (color: color-mix(in lab, red, red)) {
+            border-color: color-mix(in oklab, hsl(var(--border)) 50%, transparent);
+          }
+        }
+      }
+    }
+  }
+  .dark\:hover\:border-border\/70 {
+    &:is(.dark *) {
+      &:hover {
+        @media (hover: hover) {
+          border-color: hsl(var(--border));
+          @supports (color: color-mix(in lab, red, red)) {
+            border-color: color-mix(in oklab, hsl(var(--border)) 70%, transparent);
+          }
+        }
+      }
     }
   }
   .dark\:hover\:bg-accent\/50 {
     &:is(.dark *) {
       &:hover {
         @media (hover: hover) {
-          background-color: var(--accent);
+          background-color: hsl(var(--accent));
           @supports (color: color-mix(in lab, red, red)) {
-            background-color: color-mix(in oklab, var(--accent) 50%, transparent);
+            background-color: color-mix(in oklab, hsl(var(--accent)) 50%, transparent);
           }
         }
       }
     }
   }
+  .dark\:hover\:bg-background {
+    &:is(.dark *) {
+      &:hover {
+        @media (hover: hover) {
+          background-color: hsl(var(--background));
+        }
+      }
+    }
+  }
   .dark\:hover\:bg-input\/50 {
     &:is(.dark *) {
       &:hover {
         @media (hover: hover) {
-          background-color: var(--input);
+          background-color: hsl(var(--input));
           @supports (color: color-mix(in lab, red, red)) {
-            background-color: color-mix(in oklab, var(--input) 50%, transparent);
+            background-color: color-mix(in oklab, hsl(var(--input)) 50%, transparent);
           }
         }
       }
@@ -2152,9 +2171,9 @@ button:not([disabled]):not([aria-disabled='true']), [role='button']:not([disable
   .dark\:focus-visible\:ring-destructive\/40 {
     &:is(.dark *) {
       &:focus-visible {
-        --tw-ring-color: var(--destructive);
+        --tw-ring-color: hsl(var(--destructive));
         @supports (color: color-mix(in lab, red, red)) {
-          --tw-ring-color: color-mix(in oklab, var(--destructive) 40%, transparent);
+          --tw-ring-color: color-mix(in oklab, hsl(var(--destructive)) 40%, transparent);
         }
       }
     }
@@ -2162,9 +2181,9 @@ button:not([disabled]):not([aria-disabled='true']), [role='button']:not([disable
   .dark\:aria-invalid\:ring-destructive\/40 {
     &:is(.dark *) {
       &[aria-invalid="true"] {
-        --tw-ring-color: var(--destructive);
+        --tw-ring-color: hsl(var(--destructive));
         @supports (color: color-mix(in lab, red, red)) {
-          --tw-ring-color: color-mix(in oklab, var(--destructive) 40%, transparent);
+          --tw-ring-color: color-mix(in oklab, hsl(var(--destructive)) 40%, transparent);
         }
       }
     }
@@ -2173,63 +2192,75 @@ button:not([disabled]):not([aria-disabled='true']), [role='button']:not([disable
     &:is(.dark *) {
       &[data-variant="destructive"] {
         &:focus {
-          background-color: var(--destructive);
+          background-color: hsl(var(--destructive));
           @supports (color: color-mix(in lab, red, red)) {
-            background-color: color-mix(in oklab, var(--destructive) 20%, transparent);
+            background-color: color-mix(in oklab, hsl(var(--destructive)) 20%, transparent);
           }
         }
       }
     }
   }
-  .\[\&_\.monaco-editor\]\:\!bg-transparent {
+  .\[\&_\.monaco-editor\]\:bg-transparent\! {
     & .monaco-editor {
       background-color: transparent !important;
     }
   }
-  .\[\&_\.monaco-editor\]\:\!shadow-none {
+  .\[\&_\.monaco-editor\]\:shadow-none\! {
     & .monaco-editor {
       --tw-shadow: 0 0 #0000 !important;
       box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow) !important;
     }
   }
-  .\[\&_\.monaco-editor_\.scroll-decoration\]\:\!hidden {
+  .\[\&_\.monaco-editor_\.scroll-decoration\]\:hidden\! {
     & .monaco-editor .scroll-decoration {
       display: none !important;
     }
   }
-  .\[\&_\.monaco-editor-background\]\:\!bg-transparent {
+  .\[\&_\.monaco-editor-background\]\:bg-transparent\! {
     & .monaco-editor-background {
       background-color: transparent !important;
     }
   }
-  .\[\&_\.monaco-scrollable-element\]\:\!shadow-none {
+  .\[\&_\.monaco-scrollable-element\]\:shadow-none\! {
     & .monaco-scrollable-element {
       --tw-shadow: 0 0 #0000 !important;
       box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow) !important;
     }
   }
-  .\[\&_\.monaco-scrollable-element\>\.shadow\.top\]\:\!hidden {
+  .\[\&_\.monaco-scrollable-element\>\.shadow\.top\]\:hidden\! {
     & .monaco-scrollable-element>.shadow.top {
       display: none !important;
     }
   }
-  .\[\&_\.overflow-guard\]\:\!shadow-none {
+  .\[\&_\.native-edit-context\]\:outline-gray-200\! {
+    & .native-edit-context {
+      outline-color: oklch(0.92 0.004 286.32) !important;
+    }
+  }
+  .\[\&_\.native-edit-context\]\:dark\:outline-gray-800\! {
+    & .native-edit-context {
+      &:is(.dark *) {
+        outline-color: oklch(0.274 0.006 286.033) !important;
+      }
+    }
+  }
+  .\[\&_\.overflow-guard\]\:shadow-none\! {
     & .overflow-guard {
       --tw-shadow: 0 0 #0000 !important;
       box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow) !important;
     }
   }
-  .\[\&_\.scroll-decoration\]\:\!hidden {
+  .\[\&_\.scroll-decoration\]\:hidden\! {
     & .scroll-decoration {
       display: none !important;
     }
   }
-  .\[\&_\.shadow\.top\]\:\!hidden {
+  .\[\&_\.shadow\.top\]\:hidden\! {
     & .shadow.top {
       display: none !important;
     }
   }
-  .\[\&_\.view-lines\]\:\!bg-transparent {
+  .\[\&_\.view-lines\]\:bg-transparent\! {
     & .view-lines {
       background-color: transparent !important;
     }
@@ -2258,7 +2289,7 @@ button:not([disabled]):not([aria-disabled='true']), [role='button']:not([disable
   }
   .\[\&_\[cmdk-group-heading\]\]\:text-muted-foreground {
     & [cmdk-group-heading] {
-      color: var(--muted-foreground);
+      color: hsl(var(--muted-foreground));
     }
   }
   .\[\&_\[cmdk-group\]\]\:px-2 {
@@ -2308,7 +2339,7 @@ button:not([disabled]):not([aria-disabled='true']), [role='button']:not([disable
   }
   .\[\&_code\]\:font-mono {
     & code {
-      font-family: 'Geist Mono';
+      font-family: 'Geist Mono', ui-monospace, monospace;
     }
   }
   .\[\&_code\]\:text-sm {
@@ -2317,6 +2348,22 @@ button:not([disabled]):not([aria-disabled='true']), [role='button']:not([disable
       line-height: var(--tw-leading, var(--text-sm--line-height));
     }
   }
+  .\[\&_code\]\:text-xs\! {
+    & code {
+      font-size: var(--text-xs) !important;
+      line-height: var(--tw-leading, var(--text-xs--line-height)) !important;
+    }
+  }
+  .\[\&_pre\]\:p-0\! {
+    & pre {
+      padding: calc(var(--spacing) * 0) !important;
+    }
+  }
+  .\[\&_pre\]\:py-3\! {
+    & pre {
+      padding-block: calc(var(--spacing) * 3) !important;
+    }
+  }
   .\[\&_svg\]\:pointer-events-none {
     & svg {
       pointer-events: none;
@@ -2335,7 +2382,7 @@ button:not([disabled]):not([aria-disabled='true']), [role='button']:not([disable
   }
   .\[\&_svg\:not\(\[class\*\=\'text-\'\]\)\]\:text-muted-foreground {
     & svg:not([class*='text-']) {
-      color: var(--muted-foreground);
+      color: hsl(var(--muted-foreground));
     }
   }
   .\[\.border-b\]\:pb-3 {
@@ -2379,11 +2426,16 @@ button:not([disabled]):not([aria-disabled='true']), [role='button']:not([disable
     &[data-variant="destructive"] {
       :is(& > *) {
         &:is(svg) {
-          color: var(--destructive) !important;
+          color: hsl(var(--destructive)) !important;
         }
       }
     }
   }
+  .\[\&\>div\>div\>pre\]\:bg-transparent\! {
+    &>div>div>pre {
+      background-color: transparent !important;
+    }
+  }
   .has-\[\>\[data-align\=block-end\]\]\:\[\&\>input\]\:pt-3 {
     &:has(>[data-align=block-end]) {
       &>input {
@@ -2424,7 +2476,7 @@ button:not([disabled]):not([aria-disabled='true']), [role='button']:not([disable
   }
   .\[\&\>pre\]\:bg-background\! {
     &>pre {
-      background-color: var(--background) !important;
+      background-color: hsl(var(--background)) !important;
     }
   }
   .\[\&\>pre\]\:p-4 {
@@ -2438,9 +2490,14 @@ button:not([disabled]):not([aria-disabled='true']), [role='button']:not([disable
       line-height: var(--tw-leading, var(--text-sm--line-height));
     }
   }
+  .\[\&\>pre\]\:whitespace-pre-wrap {
+    &>pre {
+      white-space: pre-wrap;
+    }
+  }
   .\[\&\>pre\]\:text-foreground\! {
     &>pre {
-      color: var(--foreground) !important;
+      color: hsl(var(--foreground)) !important;
     }
   }
   .\[\&\>svg\]\:size-2\.5 {
@@ -2463,12 +2520,12 @@ button:not([disabled]):not([aria-disabled='true']), [role='button']:not([disable
   }
   .\[\&\[aria-expanded\=\"true\"\]\]\:bg-accent {
     &[aria-expanded="true"] {
-      background-color: var(--accent);
+      background-color: hsl(var(--accent));
     }
   }
   .\[\&\[aria-expanded\=\"true\"\]\]\:text-foreground {
     &[aria-expanded="true"] {
-      color: var(--foreground);
+      color: hsl(var(--foreground));
     }
   }
   .\[\&\[data-panel-group-direction\=vertical\]\>div\]\:rotate-90 {
@@ -2485,13 +2542,13 @@ button:not([disabled]):not([aria-disabled='true']), [role='button']:not([disable
     padding: calc(var(--spacing) * 0);
   }
   :root {
-    font-family: 'Geist';
+    font-family: 'Geist', ui-sans-serif, system-ui, sans-serif;
   }
   * {
-    border-color: var(--border);
-    outline-color: var(--ring);
+    border-color: hsl(var(--border));
+    outline-color: hsl(var(--ring));
     @supports (color: color-mix(in lab, red, red)) {
-      outline-color: color-mix(in oklab, var(--ring) 50%, transparent);
+      outline-color: color-mix(in oklab, hsl(var(--ring)) 50%, transparent);
     }
   }
   #root {
@@ -2501,8 +2558,8 @@ button:not([disabled]):not([aria-disabled='true']), [role='button']:not([disable
     height: 100%;
     width: 100%;
     flex-direction: column;
-    background-color: var(--background);
-    color: var(--foreground);
+    background-color: hsl(var(--background));
+    color: hsl(var(--foreground));
   }
 }
 @keyframes enter {