From 13684d498bf4c184e6fcf9b694c055e11ef75bc8 Mon Sep 17 00:00:00 2001
From: Xin Wang <wangx184@chinatelecom.cn>
Date: Tue, 10 Mar 2026 16:21:58 +0800
Subject: [PATCH] feat/fix(frontend): update shadcn compnents, fix debug drawer
 layout and font sizes

---
 web/components.json          |   25 +
 web/components/UI.tsx        |  329 +-
 web/components/ui/badge.tsx  |   52 +
 web/components/ui/button.tsx |   58 +
 web/components/ui/card.tsx   |  103 +
 web/components/ui/dialog.tsx |  157 +
 web/components/ui/input.tsx  |   20 +
 web/components/ui/select.tsx |  201 ++
 web/components/ui/sheet.tsx  |  133 +
 web/components/ui/switch.tsx |   30 +
 web/components/ui/table.tsx  |  116 +
 web/index.css                |  158 +
 web/index.html               |  113 +-
 web/index.tsx                |    1 +
 web/lib/utils.ts             |    6 +
 web/old_ui.txt               |  Bin 0 -> 21882 bytes
 web/package-lock.json        | 4398 ++++++++++++++++++++++-
 web/package.json             |   21 +-
 web/pages/Assistants.tsx     | 6431 +++++++++++++++++-----------------
 web/vite.config.ts           |   33 +-
 20 files changed, 8700 insertions(+), 3685 deletions(-)
 create mode 100644 web/components.json
 create mode 100644 web/components/ui/badge.tsx
 create mode 100644 web/components/ui/button.tsx
 create mode 100644 web/components/ui/card.tsx
 create mode 100644 web/components/ui/dialog.tsx
 create mode 100644 web/components/ui/input.tsx
 create mode 100644 web/components/ui/select.tsx
 create mode 100644 web/components/ui/sheet.tsx
 create mode 100644 web/components/ui/switch.tsx
 create mode 100644 web/components/ui/table.tsx
 create mode 100644 web/index.css
 create mode 100644 web/lib/utils.ts
 create mode 100644 web/old_ui.txt

diff --git a/web/components.json b/web/components.json
new file mode 100644
index 0000000..46aa2f0
--- /dev/null
+++ b/web/components.json
@@ -0,0 +1,25 @@
+{
+  "$schema": "https://ui.shadcn.com/schema.json",
+  "style": "base-nova",
+  "rsc": false,
+  "tsx": true,
+  "tailwind": {
+    "config": "",
+    "css": "index.css",
+    "baseColor": "neutral",
+    "cssVariables": true,
+    "prefix": ""
+  },
+  "iconLibrary": "lucide",
+  "rtl": false,
+  "aliases": {
+    "components": "@/components",
+    "utils": "@/lib/utils",
+    "ui": "@/components/ui",
+    "lib": "@/lib",
+    "hooks": "@/hooks"
+  },
+  "menuColor": "default",
+  "menuAccent": "subtle",
+  "registries": {}
+}
diff --git a/web/components/UI.tsx b/web/components/UI.tsx
index ad9390d..15b77bc 100644
--- a/web/components/UI.tsx
+++ b/web/components/UI.tsx
@@ -1,63 +1,37 @@
-
 import React from 'react';
 import { X } from 'lucide-react';
 
-// Button
+// Shadcn UI Imports
+import { Button as ShadcnButton } from './ui/button';
+import { Input as ShadcnInput } from './ui/input';
+import { Switch as ShadcnSwitch } from './ui/switch';
+import { Card as ShadcnCard } from './ui/card';
+import { Badge as ShadcnBadge } from './ui/badge';
+import { TableHeader as ShadcnTableHeader, TableRow as ShadcnTableRow, TableHead as ShadcnTableHead, TableCell as ShadcnTableCell } from './ui/table';
+import { Sheet, SheetContent, SheetHeader, SheetTitle } from './ui/sheet';
+import { Dialog as ShadcnDialog, DialogContent, DialogHeader, DialogTitle, DialogFooter } from './ui/dialog';
+
+// Button Wrapper to match old API
 interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
   variant?: 'primary' | 'secondary' | 'outline' | 'ghost' | 'destructive';
   size?: 'sm' | 'md' | 'lg' | 'icon';
 }
+export const Button: React.FC<ButtonProps> = ({ variant = 'primary', size = 'md', className, ...props }) => {
+  const vMap: any = { primary: 'default', secondary: 'secondary', outline: 'outline', ghost: 'ghost', destructive: 'destructive' };
+  const sMap: any = { sm: 'sm', md: 'default', lg: 'lg', icon: 'icon' };
+  return <ShadcnButton variant={vMap[variant] || 'default'} size={sMap[size] || 'default'} className={className} {...props} />;
+}
 
-export const Button: React.FC<ButtonProps> = ({ 
-  className = '', 
-  variant = 'primary', 
-  size = 'md', 
-  children, 
-  ...props 
-}) => {
-  const baseStyles = "inline-flex items-center justify-center rounded-md text-sm font-medium transition-all focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 active:scale-95";
-  
-  const variants = {
-    // Primary: Glow effect
-    primary: "bg-primary text-primary-foreground shadow-[0_0_10px_rgba(6,182,212,0.5)] hover:bg-primary/90 hover:shadow-[0_0_15px_rgba(6,182,212,0.6)]",
-    secondary: "bg-secondary text-secondary-foreground shadow-sm hover:bg-secondary/80",
-    outline: "border border-input bg-transparent shadow-sm hover:bg-accent hover:text-accent-foreground hover:border-primary/50",
-    ghost: "hover:bg-accent hover:text-accent-foreground",
-    destructive: "bg-destructive text-destructive-foreground shadow-sm hover:bg-destructive/90",
-  };
-
-  const sizes = {
-    sm: "h-8 px-3 text-xs",
-    md: "h-9 px-4 py-2",
-    lg: "h-10 px-8",
-    icon: "h-9 w-9",
-  };
-
-  return (
-    <button className={`${baseStyles} ${variants[variant]} ${sizes[size]} ${className}`} {...props}>
-      {children}
-    </button>
-  );
-};
-
-// Input - Removed border, added subtle background
-interface InputProps extends React.InputHTMLAttributes<HTMLInputElement> {}
-
-export const Input: React.FC<InputProps> = ({ className = '', ...props }) => {
-  return (
-    <input
-      className={`flex h-9 w-full rounded-md bg-white/5 px-3 py-1 text-sm shadow-sm transition-colors file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-primary/50 focus-visible:bg-white/10 disabled:cursor-not-allowed disabled:opacity-50 ${className}`}
-      {...props}
-    />
-  );
-};
-
-interface SelectProps extends React.SelectHTMLAttributes<HTMLSelectElement> {}
+// Input and Switch match seamlessly
+export const Input = ShadcnInput;
+export const Switch = ShadcnSwitch;
 
+// Native Select Wrapper to avoid breaking consumers expecting <select><option></select>
+interface SelectProps extends React.SelectHTMLAttributes<HTMLSelectElement> { }
 export const Select: React.FC<SelectProps> = ({ className = '', children, ...props }) => {
   return (
     <select
-      className={`flex h-9 w-full rounded-md border-0 bg-white/5 px-3 py-1 text-sm shadow-sm transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-primary/50 [&>option]:bg-card text-foreground disabled:cursor-not-allowed disabled:opacity-50 ${className}`}
+      className={`flex h-9 w-full rounded-md border border-input bg-transparent px-3 py-1 text-base shadow-sm transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50 md:text-sm [&>option]:bg-card [&>option]:text-foreground ${className}`}
       {...props}
     >
       {children}
@@ -65,143 +39,40 @@ export const Select: React.FC<SelectProps> = ({ className = '', children, ...pro
   );
 };
 
-interface SwitchProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'onChange'> {
-  checked: boolean;
-  onCheckedChange: (checked: boolean) => void;
-}
-
-export const Switch: React.FC<SwitchProps> = ({
-  checked,
-  onCheckedChange,
-  className = '',
-  disabled,
-  ...props
-}) => {
-  return (
-    <button
-      type="button"
-      role="switch"
-      aria-checked={checked}
-      disabled={disabled}
-      onClick={() => {
-        if (!disabled) onCheckedChange(!checked);
-      }}
-      className={`relative h-6 w-11 rounded-full transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/60 focus-visible:ring-offset-1 focus-visible:ring-offset-background disabled:cursor-not-allowed disabled:opacity-50 ${checked ? 'bg-emerald-500/80' : 'bg-white/20'} ${className}`}
-      {...props}
-    >
-      <span
-        className={`absolute left-0.5 top-1/2 h-5 w-5 -translate-y-1/2 rounded-full bg-white shadow transition-transform ${checked ? 'translate-x-5' : 'translate-x-0'}`}
-      />
-    </button>
-  );
-};
-
-// Card - Glassmorphism style, very subtle border
-interface CardProps extends React.HTMLAttributes<HTMLDivElement> {
-  children: React.ReactNode;
-  className?: string;
-}
+// Card Wrapper
+interface CardProps extends React.HTMLAttributes<HTMLDivElement> { children: React.ReactNode; }
 export const Card: React.FC<CardProps> = ({ children, className = '', ...props }) => (
-  <div className={`rounded-xl border border-white/5 bg-card/40 backdrop-blur-md text-card-foreground shadow-sm ${className}`} {...props}>
+  <ShadcnCard className={`bg-card/40 backdrop-blur-md ${className}`} {...props}>
     {children}
-  </div>
+  </ShadcnCard>
 );
 
-// Badge
+// Badge Wrapper for old variants
 interface BadgeProps {
   children: React.ReactNode;
   variant?: 'default' | 'success' | 'warning' | 'outline';
   className?: string;
 }
 export const Badge: React.FC<BadgeProps> = ({ children, variant = 'default', className = '' }) => {
-  const styles = {
-    default: "border-transparent bg-primary/20 text-primary hover:bg-primary/30 border border-primary/20",
-    success: "border-transparent bg-green-500/20 text-green-400 border border-green-500/20",
-    warning: "border-transparent bg-yellow-500/20 text-yellow-400 border border-yellow-500/20",
-    outline: "text-foreground border border-white/10 hover:bg-accent hover:text-accent-foreground",
-  };
-  return (
-    <div className={`inline-flex items-center rounded-md px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 ${styles[variant]} ${className}`}>
-      {children}
-    </div>
-  );
+  let cName = className;
+  let shadcnVariant: any = variant === 'outline' ? 'outline' : 'default';
+
+  if (variant === 'success') {
+    cName += ' border-transparent bg-emerald-500/20 text-emerald-400 hover:bg-emerald-500/30';
+  } else if (variant === 'warning') {
+    cName += ' border-transparent bg-yellow-500/20 text-yellow-400 hover:bg-yellow-500/30';
+  }
+
+  return <ShadcnBadge variant={shadcnVariant} className={cName}>{children}</ShadcnBadge>;
 };
 
-// Table - Subtle borders
-export const TableHeader: React.FC<{ children: React.ReactNode }> = ({ children }) => <thead className="[&_tr]:border-b [&_tr]:border-white/5">{children}</thead>;
+// Table Exports 
+export const TableHeader = ShadcnTableHeader;
+export const TableRow = ShadcnTableRow;
+export const TableHead = ShadcnTableHead;
+export const TableCell = ShadcnTableCell;
 
-interface TableRowProps extends React.HTMLAttributes<HTMLTableRowElement> {
-    children: React.ReactNode;
-    className?: string;
-}
-export const TableRow: React.FC<TableRowProps> = ({ children, className = '', ...props }) => <tr className={`border-b border-white/5 transition-colors hover:bg-white/5 data-[state=selected]:bg-muted ${className}`} {...props}>{children}</tr>;
-
-interface TableHeadProps extends React.ThHTMLAttributes<HTMLTableCellElement> {
-    children: React.ReactNode;
-    className?: string;
-}
-export const TableHead: React.FC<TableHeadProps> = ({ children, className = '', ...props }) => <th className={`h-10 px-4 text-left align-middle text-sm font-medium text-muted-foreground [&:has([role=checkbox])]:pr-0 ${className}`} {...props}>{children}</th>;
-
-interface TableCellProps extends React.TdHTMLAttributes<HTMLTableCellElement> {
-    children: React.ReactNode;
-    className?: string;
-}
-export const TableCell: React.FC<TableCellProps> = ({ children, className = '', ...props }) => <td className={`p-4 align-middle text-sm [&:has([role=checkbox])]:pr-0 ${className}`} {...props}>{children}</td>;
-
-interface LibraryPageShellProps {
-  title: string;
-  primaryAction: React.ReactNode;
-  filterBar: React.ReactNode;
-  children: React.ReactNode;
-}
-
-export const LibraryPageShell: React.FC<LibraryPageShellProps> = ({ title, primaryAction, filterBar, children }) => {
-  return (
-    <div className="space-y-6 animate-in fade-in py-4 pb-10">
-      <div className="flex items-center justify-between">
-        <h1 className="text-2xl font-bold tracking-tight text-white">{title}</h1>
-        {primaryAction}
-      </div>
-      <div className="grid grid-cols-1 md:grid-cols-4 gap-4 bg-card/50 p-4 rounded-lg border border-white/5 shadow-sm">
-        {filterBar}
-      </div>
-      {children}
-    </div>
-  );
-};
-
-interface TableStatusRowProps {
-  colSpan: number;
-  text: string;
-}
-
-export const TableStatusRow: React.FC<TableStatusRowProps> = ({ colSpan, text }) => {
-  return (
-    <TableRow>
-      <TableCell colSpan={colSpan} className="text-center py-8 text-muted-foreground">
-        {text}
-      </TableCell>
-    </TableRow>
-  );
-};
-
-interface LibraryActionCellProps {
-  previewAction?: React.ReactNode;
-  editAction: React.ReactNode;
-  deleteAction: React.ReactNode;
-}
-
-export const LibraryActionCell: React.FC<LibraryActionCellProps> = ({ previewAction, editAction, deleteAction }) => {
-  return (
-    <TableCell className="text-right">
-      {previewAction}
-      {editAction}
-      {deleteAction}
-    </TableCell>
-  );
-};
-
-// Drawer (Side Sheet)
+// Drawer (Side Sheet Wrapper)
 interface DrawerProps {
   isOpen: boolean;
   onClose: () => void;
@@ -209,32 +80,25 @@ interface DrawerProps {
   className?: string;
   children: React.ReactNode;
 }
-
 export const Drawer: React.FC<DrawerProps> = ({ isOpen, onClose, title, className, children }) => {
-  if (!isOpen) return null;
+  // Pass `!w-[85vw]` logic directly down from the parent to naturally override Shadcn specificities safely.
+  const containerClasses = className || 'w-full max-w-md sm:max-w-lg';
 
   return (
-    <div className="fixed inset-0 z-50 flex">
-      {/* Backdrop */}
-      <div className="fixed inset-0 bg-black/60 backdrop-blur-sm transition-opacity" onClick={onClose} />
-      
-      {/* Drawer Content */}
-      <div className={`relative ml-auto flex h-full w-full flex-col bg-background/95 border-l border-white/10 p-6 shadow-2xl animate-in slide-in-from-right ${className || 'max-w-md sm:max-w-lg'}`}>
-        <div className="flex items-center justify-between mb-4 shrink-0">
-          <h2 className="text-lg font-semibold text-foreground">{title}</h2>
-          <Button variant="ghost" size="icon" onClick={onClose}>
-            <X className="h-4 w-4" />
-          </Button>
-        </div>
-        <div className="flex-1 min-h-0 overflow-y-auto">
+    <Sheet open={isOpen} onOpenChange={(open) => { if (!open) onClose(); }}>
+      <SheetContent className={`flex flex-col p-6 bg-background/95 backdrop-blur-md border-l border-white/10 shadow-2xl [&>button]:top-5 [&>button]:right-5 ${containerClasses}`}>
+        <SheetHeader className="mb-2 shrink-0 p-0 text-left">
+          <SheetTitle className="text-lg font-semibold">{title}</SheetTitle>
+        </SheetHeader>
+        <div className="flex-1 min-h-0 overflow-y-auto custom-scrollbar flex flex-col">
           {children}
         </div>
-      </div>
-    </div>
+      </SheetContent>
+    </Sheet>
   );
 };
 
-// Dialog (Modal)
+// Dialog (Modal Wrapper)
 interface DialogProps {
   isOpen: boolean;
   onClose: () => void;
@@ -243,33 +107,66 @@ interface DialogProps {
   footer?: React.ReactNode;
   contentClassName?: string;
 }
-
 export const Dialog: React.FC<DialogProps> = ({ isOpen, onClose, title, children, footer, contentClassName }) => {
-  if (!isOpen) return null;
-
   return (
-    <div className="fixed inset-0 z-50 flex items-center justify-center p-4">
-       <div className="fixed inset-0 bg-black/80 backdrop-blur-sm transition-opacity animate-in fade-in" onClick={onClose} />
-       <div className={`relative z-50 w-full max-w-lg rounded-xl border border-white/10 bg-card p-6 shadow-2xl animate-in zoom-in-95 duration-200 ${contentClassName || ''}`}>
-          <div className="flex flex-col space-y-1.5 text-center sm:text-left mb-4">
-             <h2 className="text-lg font-semibold leading-none tracking-tight">{title}</h2>
-          </div>
-          <div className="py-4">
-            {children}
-          </div>
-          {footer && (
-             <div className="flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2 mt-2">
-                {footer}
-             </div>
-          )}
-          <button 
-             onClick={onClose}
-             className="absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none disabled:pointer-events-none data-[state=open]:bg-accent data-[state=open]:text-muted-foreground"
-          >
-             <X className="h-4 w-4" />
-             <span className="sr-only">Close</span>
-          </button>
-       </div>
-    </div>
+    <ShadcnDialog open={isOpen} onOpenChange={(open) => { if (!open) onClose(); }}>
+      <DialogContent className={`max-h-[95vh] flex flex-col ${contentClassName || ''}`}>
+        <DialogHeader>
+          <DialogTitle>{title}</DialogTitle>
+        </DialogHeader>
+        <div className="py-2 flex-1 min-h-0 overflow-y-auto pr-2 custom-scrollbar">
+          {children}
+        </div>
+        {footer && <DialogFooter>{footer}</DialogFooter>}
+      </DialogContent>
+    </ShadcnDialog>
   );
 };
+
+
+// ---------------------------------------------
+// Custom Application Layout Components
+// ---------------------------------------------
+interface LibraryPageShellProps {
+  title: string;
+  primaryAction: React.ReactNode;
+  filterBar: React.ReactNode;
+  children: React.ReactNode;
+}
+export const LibraryPageShell: React.FC<LibraryPageShellProps> = ({ title, primaryAction, filterBar, children }) => (
+  <div className="space-y-6 animate-in fade-in py-4 pb-10">
+    <div className="flex items-center justify-between">
+      <h1 className="text-2xl font-bold tracking-tight text-foreground">{title}</h1>
+      {primaryAction}
+    </div>
+    <div className="grid grid-cols-1 md:grid-cols-4 gap-4 bg-card/50 p-4 rounded-lg border border-border shadow-sm">
+      {filterBar}
+    </div>
+    {children}
+  </div>
+);
+
+interface TableStatusRowProps {
+  colSpan: number;
+  text: string;
+}
+export const TableStatusRow: React.FC<TableStatusRowProps> = ({ colSpan, text }) => (
+  <TableRow>
+    <TableCell colSpan={colSpan} className="text-center py-8 text-muted-foreground">
+      {text}
+    </TableCell>
+  </TableRow>
+);
+
+interface LibraryActionCellProps {
+  previewAction?: React.ReactNode;
+  editAction: React.ReactNode;
+  deleteAction: React.ReactNode;
+}
+export const LibraryActionCell: React.FC<LibraryActionCellProps> = ({ previewAction, editAction, deleteAction }) => (
+  <TableCell className="text-right whitespace-nowrap">
+    {previewAction}
+    {editAction}
+    {deleteAction}
+  </TableCell>
+);
diff --git a/web/components/ui/badge.tsx b/web/components/ui/badge.tsx
new file mode 100644
index 0000000..b20959d
--- /dev/null
+++ b/web/components/ui/badge.tsx
@@ -0,0 +1,52 @@
+import { mergeProps } from "@base-ui/react/merge-props"
+import { useRender } from "@base-ui/react/use-render"
+import { cva, type VariantProps } from "class-variance-authority"
+
+import { cn } from "@/lib/utils"
+
+const badgeVariants = cva(
+  "group/badge inline-flex h-5 w-fit shrink-0 items-center justify-center gap-1 overflow-hidden rounded-4xl border border-transparent px-2 py-0.5 text-xs font-medium whitespace-nowrap transition-all focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 [&>svg]:pointer-events-none [&>svg]:size-3!",
+  {
+    variants: {
+      variant: {
+        default: "bg-primary text-primary-foreground [a]:hover:bg-primary/80",
+        secondary:
+          "bg-secondary text-secondary-foreground [a]:hover:bg-secondary/80",
+        destructive:
+          "bg-destructive/10 text-destructive focus-visible:ring-destructive/20 dark:bg-destructive/20 dark:focus-visible:ring-destructive/40 [a]:hover:bg-destructive/20",
+        outline:
+          "border-border text-foreground [a]:hover:bg-muted [a]:hover:text-muted-foreground",
+        ghost:
+          "hover:bg-muted hover:text-muted-foreground dark:hover:bg-muted/50",
+        link: "text-primary underline-offset-4 hover:underline",
+      },
+    },
+    defaultVariants: {
+      variant: "default",
+    },
+  }
+)
+
+function Badge({
+  className,
+  variant = "default",
+  render,
+  ...props
+}: useRender.ComponentProps<"span"> & VariantProps<typeof badgeVariants>) {
+  return useRender({
+    defaultTagName: "span",
+    props: mergeProps<"span">(
+      {
+        className: cn(badgeVariants({ variant }), className),
+      },
+      props
+    ),
+    render,
+    state: {
+      slot: "badge",
+      variant,
+    },
+  })
+}
+
+export { Badge, badgeVariants }
diff --git a/web/components/ui/button.tsx b/web/components/ui/button.tsx
new file mode 100644
index 0000000..1a34f87
--- /dev/null
+++ b/web/components/ui/button.tsx
@@ -0,0 +1,58 @@
+import { Button as ButtonPrimitive } from "@base-ui/react/button"
+import { cva, type VariantProps } from "class-variance-authority"
+
+import { cn } from "@/lib/utils"
+
+const buttonVariants = cva(
+  "group/button inline-flex shrink-0 items-center justify-center rounded-lg border border-transparent bg-clip-padding text-sm font-medium whitespace-nowrap transition-all outline-none select-none focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+  {
+    variants: {
+      variant: {
+        default: "bg-primary text-primary-foreground [a]:hover:bg-primary/80",
+        outline:
+          "border-border bg-background hover:bg-muted hover:text-foreground aria-expanded:bg-muted aria-expanded:text-foreground dark:border-input dark:bg-input/30 dark:hover:bg-input/50",
+        secondary:
+          "bg-secondary text-secondary-foreground hover:bg-secondary/80 aria-expanded:bg-secondary aria-expanded:text-secondary-foreground",
+        ghost:
+          "hover:bg-muted hover:text-foreground aria-expanded:bg-muted aria-expanded:text-foreground dark:hover:bg-muted/50",
+        destructive:
+          "bg-destructive/10 text-destructive hover:bg-destructive/20 focus-visible:border-destructive/40 focus-visible:ring-destructive/20 dark:bg-destructive/20 dark:hover:bg-destructive/30 dark:focus-visible:ring-destructive/40",
+        link: "text-primary underline-offset-4 hover:underline",
+      },
+      size: {
+        default:
+          "h-8 gap-1.5 px-2.5 has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2",
+        xs: "h-6 gap-1 rounded-[min(var(--radius-md),10px)] px-2 text-xs in-data-[slot=button-group]:rounded-lg has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3",
+        sm: "h-7 gap-1 rounded-[min(var(--radius-md),12px)] px-2.5 text-[0.8rem] in-data-[slot=button-group]:rounded-lg has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3.5",
+        lg: "h-9 gap-1.5 px-2.5 has-data-[icon=inline-end]:pr-3 has-data-[icon=inline-start]:pl-3",
+        icon: "size-8",
+        "icon-xs":
+          "size-6 rounded-[min(var(--radius-md),10px)] in-data-[slot=button-group]:rounded-lg [&_svg:not([class*='size-'])]:size-3",
+        "icon-sm":
+          "size-7 rounded-[min(var(--radius-md),12px)] in-data-[slot=button-group]:rounded-lg",
+        "icon-lg": "size-9",
+      },
+    },
+    defaultVariants: {
+      variant: "default",
+      size: "default",
+    },
+  }
+)
+
+function Button({
+  className,
+  variant = "default",
+  size = "default",
+  ...props
+}: ButtonPrimitive.Props & VariantProps<typeof buttonVariants>) {
+  return (
+    <ButtonPrimitive
+      data-slot="button"
+      className={cn(buttonVariants({ variant, size, className }))}
+      {...props}
+    />
+  )
+}
+
+export { Button, buttonVariants }
diff --git a/web/components/ui/card.tsx b/web/components/ui/card.tsx
new file mode 100644
index 0000000..9bd5a25
--- /dev/null
+++ b/web/components/ui/card.tsx
@@ -0,0 +1,103 @@
+import * as React from "react"
+
+import { cn } from "@/lib/utils"
+
+function Card({
+  className,
+  size = "default",
+  ...props
+}: React.ComponentProps<"div"> & { size?: "default" | "sm" }) {
+  return (
+    <div
+      data-slot="card"
+      data-size={size}
+      className={cn(
+        "group/card flex flex-col gap-4 overflow-hidden rounded-xl bg-card py-4 text-sm text-card-foreground ring-1 ring-foreground/10 has-data-[slot=card-footer]:pb-0 has-[>img:first-child]:pt-0 data-[size=sm]:gap-3 data-[size=sm]:py-3 data-[size=sm]:has-data-[slot=card-footer]:pb-0 *:[img:first-child]:rounded-t-xl *:[img:last-child]:rounded-b-xl",
+        className
+      )}
+      {...props}
+    />
+  )
+}
+
+function CardHeader({ className, ...props }: React.ComponentProps<"div">) {
+  return (
+    <div
+      data-slot="card-header"
+      className={cn(
+        "group/card-header @container/card-header grid auto-rows-min items-start gap-1 rounded-t-xl px-4 group-data-[size=sm]/card:px-3 has-data-[slot=card-action]:grid-cols-[1fr_auto] has-data-[slot=card-description]:grid-rows-[auto_auto] [.border-b]:pb-4 group-data-[size=sm]/card:[.border-b]:pb-3",
+        className
+      )}
+      {...props}
+    />
+  )
+}
+
+function CardTitle({ className, ...props }: React.ComponentProps<"div">) {
+  return (
+    <div
+      data-slot="card-title"
+      className={cn(
+        "text-base leading-snug font-medium group-data-[size=sm]/card:text-sm",
+        className
+      )}
+      {...props}
+    />
+  )
+}
+
+function CardDescription({ className, ...props }: React.ComponentProps<"div">) {
+  return (
+    <div
+      data-slot="card-description"
+      className={cn("text-sm text-muted-foreground", className)}
+      {...props}
+    />
+  )
+}
+
+function CardAction({ className, ...props }: React.ComponentProps<"div">) {
+  return (
+    <div
+      data-slot="card-action"
+      className={cn(
+        "col-start-2 row-span-2 row-start-1 self-start justify-self-end",
+        className
+      )}
+      {...props}
+    />
+  )
+}
+
+function CardContent({ className, ...props }: React.ComponentProps<"div">) {
+  return (
+    <div
+      data-slot="card-content"
+      className={cn("px-4 group-data-[size=sm]/card:px-3", className)}
+      {...props}
+    />
+  )
+}
+
+function CardFooter({ className, ...props }: React.ComponentProps<"div">) {
+  return (
+    <div
+      data-slot="card-footer"
+      className={cn(
+        "flex items-center rounded-b-xl border-t bg-muted/50 p-4 group-data-[size=sm]/card:p-3",
+        className
+      )}
+      {...props}
+    />
+  )
+}
+
+export {
+  Card,
+  CardHeader,
+  CardFooter,
+  CardTitle,
+  CardAction,
+  CardDescription,
+  CardContent,
+}
diff --git a/web/components/ui/dialog.tsx b/web/components/ui/dialog.tsx
new file mode 100644
index 0000000..807e1fa
--- /dev/null
+++ b/web/components/ui/dialog.tsx
@@ -0,0 +1,157 @@
+"use client"
+
+import * as React from "react"
+import { Dialog as DialogPrimitive } from "@base-ui/react/dialog"
+
+import { cn } from "@/lib/utils"
+import { Button } from "@/components/ui/button"
+import { XIcon } from "lucide-react"
+
+function Dialog({ ...props }: DialogPrimitive.Root.Props) {
+  return <DialogPrimitive.Root data-slot="dialog" {...props} />
+}
+
+function DialogTrigger({ ...props }: DialogPrimitive.Trigger.Props) {
+  return <DialogPrimitive.Trigger data-slot="dialog-trigger" {...props} />
+}
+
+function DialogPortal({ ...props }: DialogPrimitive.Portal.Props) {
+  return <DialogPrimitive.Portal data-slot="dialog-portal" {...props} />
+}
+
+function DialogClose({ ...props }: DialogPrimitive.Close.Props) {
+  return <DialogPrimitive.Close data-slot="dialog-close" {...props} />
+}
+
+function DialogOverlay({
+  className,
+  ...props
+}: DialogPrimitive.Backdrop.Props) {
+  return (
+    <DialogPrimitive.Backdrop
+      data-slot="dialog-overlay"
+      className={cn(
+        "fixed inset-0 isolate z-50 bg-black/10 duration-100 supports-backdrop-filter:backdrop-blur-xs data-open:animate-in data-open:fade-in-0 data-closed:animate-out data-closed:fade-out-0",
+        className
+      )}
+      {...props}
+    />
+  )
+}
+
+function DialogContent({
+  className,
+  children,
+  showCloseButton = true,
+  ...props
+}: DialogPrimitive.Popup.Props & {
+  showCloseButton?: boolean
+}) {
+  return (
+    <DialogPortal>
+      <DialogOverlay />
+      <DialogPrimitive.Popup
+        data-slot="dialog-content"
+        className={cn(
+          "fixed top-1/2 left-1/2 z-50 grid w-full max-w-[calc(100%-2rem)] -translate-x-1/2 -translate-y-1/2 gap-4 rounded-xl bg-background p-4 text-sm ring-1 ring-foreground/10 duration-100 outline-none sm:max-w-sm data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95",
+          className
+        )}
+        {...props}
+      >
+        {children}
+        {showCloseButton && (
+          <DialogPrimitive.Close
+            data-slot="dialog-close"
+            render={
+              <Button
+                variant="ghost"
+                className="absolute top-2 right-2"
+                size="icon-sm"
+              />
+            }
+          >
+            <XIcon
+            />
+            <span className="sr-only">Close</span>
+          </DialogPrimitive.Close>
+        )}
+      </DialogPrimitive.Popup>
+    </DialogPortal>
+  )
+}
+
+function DialogHeader({ className, ...props }: React.ComponentProps<"div">) {
+  return (
+    <div
+      data-slot="dialog-header"
+      className={cn("flex flex-col gap-2", className)}
+      {...props}
+    />
+  )
+}
+
+function DialogFooter({
+  className,
+  showCloseButton = false,
+  children,
+  ...props
+}: React.ComponentProps<"div"> & {
+  showCloseButton?: boolean
+}) {
+  return (
+    <div
+      data-slot="dialog-footer"
+      className={cn(
+        "-mx-4 -mb-4 flex flex-col-reverse gap-2 rounded-b-xl border-t bg-muted/50 p-4 sm:flex-row sm:justify-end",
+        className
+      )}
+      {...props}
+    >
+      {children}
+      {showCloseButton && (
+        <DialogPrimitive.Close render={<Button variant="outline" />}>
+          Close
+        </DialogPrimitive.Close>
+      )}
+    </div>
+  )
+}
+
+function DialogTitle({ className, ...props }: DialogPrimitive.Title.Props) {
+  return (
+    <DialogPrimitive.Title
+      data-slot="dialog-title"
+      className={cn("text-base leading-none font-medium", className)}
+      {...props}
+    />
+  )
+}
+
+function DialogDescription({
+  className,
+  ...props
+}: DialogPrimitive.Description.Props) {
+  return (
+    <DialogPrimitive.Description
+      data-slot="dialog-description"
+      className={cn(
+        "text-sm text-muted-foreground *:[a]:underline *:[a]:underline-offset-3 *:[a]:hover:text-foreground",
+        className
+      )}
+      {...props}
+    />
+  )
+}
+
+export {
+  Dialog,
+  DialogClose,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogOverlay,
+  DialogPortal,
+  DialogTitle,
+  DialogTrigger,
+}
diff --git a/web/components/ui/input.tsx b/web/components/ui/input.tsx
new file mode 100644
index 0000000..7d21bab
--- /dev/null
+++ b/web/components/ui/input.tsx
@@ -0,0 +1,20 @@
+import * as React from "react"
+import { Input as InputPrimitive } from "@base-ui/react/input"
+
+import { cn } from "@/lib/utils"
+
+function Input({ className, type, ...props }: React.ComponentProps<"input">) {
+  return (
+    <InputPrimitive
+      type={type}
+      data-slot="input"
+      className={cn(
+        "h-8 w-full min-w-0 rounded-lg border border-input bg-transparent px-2.5 py-1 text-base transition-colors outline-none file:inline-flex file:h-6 file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:pointer-events-none disabled:cursor-not-allowed disabled:bg-input/50 disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 md:text-sm dark:bg-input/30 dark:disabled:bg-input/80 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40",
+        className
+      )}
+      {...props}
+    />
+  )
+}
+
+export { Input }
diff --git a/web/components/ui/select.tsx b/web/components/ui/select.tsx
new file mode 100644
index 0000000..e8021f5
--- /dev/null
+++ b/web/components/ui/select.tsx
@@ -0,0 +1,201 @@
+"use client"
+
+import * as React from "react"
+import { Select as SelectPrimitive } from "@base-ui/react/select"
+
+import { cn } from "@/lib/utils"
+import { ChevronDownIcon, CheckIcon, ChevronUpIcon } from "lucide-react"
+
+const Select = SelectPrimitive.Root
+
+function SelectGroup({ className, ...props }: SelectPrimitive.Group.Props) {
+  return (
+    <SelectPrimitive.Group
+      data-slot="select-group"
+      className={cn("scroll-my-1 p-1", className)}
+      {...props}
+    />
+  )
+}
+
+function SelectValue({ className, ...props }: SelectPrimitive.Value.Props) {
+  return (
+    <SelectPrimitive.Value
+      data-slot="select-value"
+      className={cn("flex flex-1 text-left", className)}
+      {...props}
+    />
+  )
+}
+
+function SelectTrigger({
+  className,
+  size = "default",
+  children,
+  ...props
+}: SelectPrimitive.Trigger.Props & {
+  size?: "sm" | "default"
+}) {
+  return (
+    <SelectPrimitive.Trigger
+      data-slot="select-trigger"
+      data-size={size}
+      className={cn(
+        "flex w-fit items-center justify-between gap-1.5 rounded-lg border border-input bg-transparent py-2 pr-2 pl-2.5 text-sm whitespace-nowrap transition-colors outline-none select-none focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 data-placeholder:text-muted-foreground data-[size=default]:h-8 data-[size=sm]:h-7 data-[size=sm]:rounded-[min(var(--radius-md),10px)] *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-1.5 dark:bg-input/30 dark:hover:bg-input/50 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+        className
+      )}
+      {...props}
+    >
+      {children}
+      <SelectPrimitive.Icon
+        render={
+          <ChevronDownIcon className="pointer-events-none size-4 text-muted-foreground" />
+        }
+      />
+    </SelectPrimitive.Trigger>
+  )
+}
+
+function SelectContent({
+  className,
+  children,
+  side = "bottom",
+  sideOffset = 4,
+  align = "center",
+  alignOffset = 0,
+  alignItemWithTrigger = true,
+  ...props
+}: SelectPrimitive.Popup.Props &
+  Pick<
+    SelectPrimitive.Positioner.Props,
+    "align" | "alignOffset" | "side" | "sideOffset" | "alignItemWithTrigger"
+  >) {
+  return (
+    <SelectPrimitive.Portal>
+      <SelectPrimitive.Positioner
+        side={side}
+        sideOffset={sideOffset}
+        align={align}
+        alignOffset={alignOffset}
+        alignItemWithTrigger={alignItemWithTrigger}
+        className="isolate z-50"
+      >
+        <SelectPrimitive.Popup
+          data-slot="select-content"
+          data-align-trigger={alignItemWithTrigger}
+          className={cn("relative isolate z-50 max-h-(--available-height) w-(--anchor-width) min-w-36 origin-(--transform-origin) overflow-x-hidden overflow-y-auto rounded-lg bg-popover text-popover-foreground shadow-md ring-1 ring-foreground/10 duration-100 data-[align-trigger=true]:animate-none data-[side=bottom]:slide-in-from-top-2 data-[side=inline-end]:slide-in-from-left-2 data-[side=inline-start]:slide-in-from-right-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95", className )}
+          {...props}
+        >
+          <SelectScrollUpButton />
+          <SelectPrimitive.List>{children}</SelectPrimitive.List>
+          <SelectScrollDownButton />
+        </SelectPrimitive.Popup>
+      </SelectPrimitive.Positioner>
+    </SelectPrimitive.Portal>
+  )
+}
+
+function SelectLabel({
+  className,
+  ...props
+}: SelectPrimitive.GroupLabel.Props) {
+  return (
+    <SelectPrimitive.GroupLabel
+      data-slot="select-label"
+      className={cn("px-1.5 py-1 text-xs text-muted-foreground", className)}
+      {...props}
+    />
+  )
+}
+
+function SelectItem({
+  className,
+  children,
+  ...props
+}: SelectPrimitive.Item.Props) {
+  return (
+    <SelectPrimitive.Item
+      data-slot="select-item"
+      className={cn(
+        "relative flex w-full cursor-default items-center gap-1.5 rounded-md py-1 pr-8 pl-1.5 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground not-data-[variant=destructive]:focus:**:text-accent-foreground data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 *:[span]:last:flex *:[span]:last:items-center *:[span]:last:gap-2",
+        className
+      )}
+      {...props}
+    >
+      <SelectPrimitive.ItemText className="flex flex-1 shrink-0 gap-2 whitespace-nowrap">
+        {children}
+      </SelectPrimitive.ItemText>
+      <SelectPrimitive.ItemIndicator
+        render={
+          <span className="pointer-events-none absolute right-2 flex size-4 items-center justify-center" />
+        }
+      >
+        <CheckIcon className="pointer-events-none" />
+      </SelectPrimitive.ItemIndicator>
+    </SelectPrimitive.Item>
+  )
+}
+
+function SelectSeparator({
+  className,
+  ...props
+}: SelectPrimitive.Separator.Props) {
+  return (
+    <SelectPrimitive.Separator
+      data-slot="select-separator"
+      className={cn("pointer-events-none -mx-1 my-1 h-px bg-border", className)}
+      {...props}
+    />
+  )
+}
+
+function SelectScrollUpButton({
+  className,
+  ...props
+}: React.ComponentProps<typeof SelectPrimitive.ScrollUpArrow>) {
+  return (
+    <SelectPrimitive.ScrollUpArrow
+      data-slot="select-scroll-up-button"
+      className={cn(
+        "top-0 z-10 flex w-full cursor-default items-center justify-center bg-popover py-1 [&_svg:not([class*='size-'])]:size-4",
+        className
+      )}
+      {...props}
+    >
+      <ChevronUpIcon
+      />
+    </SelectPrimitive.ScrollUpArrow>
+  )
+}
+
+function SelectScrollDownButton({
+  className,
+  ...props
+}: React.ComponentProps<typeof SelectPrimitive.ScrollDownArrow>) {
+  return (
+    <SelectPrimitive.ScrollDownArrow
+      data-slot="select-scroll-down-button"
+      className={cn(
+        "bottom-0 z-10 flex w-full cursor-default items-center justify-center bg-popover py-1 [&_svg:not([class*='size-'])]:size-4",
+        className
+      )}
+      {...props}
+    >
+      <ChevronDownIcon
+      />
+    </SelectPrimitive.ScrollDownArrow>
+  )
+}
+
+export {
+  Select,
+  SelectContent,
+  SelectGroup,
+  SelectItem,
+  SelectLabel,
+  SelectScrollDownButton,
+  SelectScrollUpButton,
+  SelectSeparator,
+  SelectTrigger,
+  SelectValue,
+}
diff --git a/web/components/ui/sheet.tsx b/web/components/ui/sheet.tsx
new file mode 100644
index 0000000..927502b
--- /dev/null
+++ b/web/components/ui/sheet.tsx
@@ -0,0 +1,133 @@
+import * as React from "react"
+import { Dialog as SheetPrimitive } from "@base-ui/react/dialog"
+
+import { cn } from "@/lib/utils"
+import { Button } from "@/components/ui/button"
+import { XIcon } from "lucide-react"
+
+function Sheet({ ...props }: SheetPrimitive.Root.Props) {
+  return <SheetPrimitive.Root data-slot="sheet" {...props} />
+}
+
+function SheetTrigger({ ...props }: SheetPrimitive.Trigger.Props) {
+  return <SheetPrimitive.Trigger data-slot="sheet-trigger" {...props} />
+}
+
+function SheetClose({ ...props }: SheetPrimitive.Close.Props) {
+  return <SheetPrimitive.Close data-slot="sheet-close" {...props} />
+}
+
+function SheetPortal({ ...props }: SheetPrimitive.Portal.Props) {
+  return <SheetPrimitive.Portal data-slot="sheet-portal" {...props} />
+}
+
+function SheetOverlay({ className, ...props }: SheetPrimitive.Backdrop.Props) {
+  return (
+    <SheetPrimitive.Backdrop
+      data-slot="sheet-overlay"
+      className={cn(
+        "fixed inset-0 z-50 bg-black/10 transition-opacity duration-150 data-ending-style:opacity-0 data-starting-style:opacity-0 supports-backdrop-filter:backdrop-blur-xs",
+        className
+      )}
+      {...props}
+    />
+  )
+}
+
+function SheetContent({
+  className,
+  children,
+  side = "right",
+  showCloseButton = true,
+  ...props
+}: SheetPrimitive.Popup.Props & {
+  side?: "top" | "right" | "bottom" | "left"
+  showCloseButton?: boolean
+}) {
+  return (
+    <SheetPortal>
+      <SheetOverlay />
+      <SheetPrimitive.Popup
+        data-slot="sheet-content"
+        data-side={side}
+        className={cn(
+          "fixed z-50 flex flex-col gap-4 bg-background bg-clip-padding text-sm shadow-lg transition duration-200 ease-in-out data-ending-style:opacity-0 data-starting-style:opacity-0 data-[side=bottom]:inset-x-0 data-[side=bottom]:bottom-0 data-[side=bottom]:h-auto data-[side=bottom]:border-t data-[side=bottom]:data-ending-style:translate-y-[2.5rem] data-[side=bottom]:data-starting-style:translate-y-[2.5rem] data-[side=left]:inset-y-0 data-[side=left]:left-0 data-[side=left]:h-full data-[side=left]:w-3/4 data-[side=left]:border-r data-[side=left]:data-ending-style:translate-x-[-2.5rem] data-[side=left]:data-starting-style:translate-x-[-2.5rem] data-[side=right]:inset-y-0 data-[side=right]:right-0 data-[side=right]:h-full data-[side=right]:w-3/4 data-[side=right]:border-l data-[side=right]:data-ending-style:translate-x-[2.5rem] data-[side=right]:data-starting-style:translate-x-[2.5rem] data-[side=top]:inset-x-0 data-[side=top]:top-0 data-[side=top]:h-auto data-[side=top]:border-b data-[side=top]:data-ending-style:translate-y-[-2.5rem] data-[side=top]:data-starting-style:translate-y-[-2.5rem] data-[side=left]:sm:max-w-sm data-[side=right]:sm:max-w-sm",
+          className
+        )}
+        {...props}
+      >
+        {children}
+        {showCloseButton && (
+          <SheetPrimitive.Close
+            data-slot="sheet-close"
+            render={
+              <Button
+                variant="ghost"
+                className="absolute top-3 right-3"
+                size="icon-sm"
+              />
+            }
+          >
+            <XIcon
+            />
+            <span className="sr-only">Close</span>
+          </SheetPrimitive.Close>
+        )}
+      </SheetPrimitive.Popup>
+    </SheetPortal>
+  )
+}
+
+function SheetHeader({ className, ...props }: React.ComponentProps<"div">) {
+  return (
+    <div
+      data-slot="sheet-header"
+      className={cn("flex flex-col gap-0.5 p-4", className)}
+      {...props}
+    />
+  )
+}
+
+function SheetFooter({ className, ...props }: React.ComponentProps<"div">) {
+  return (
+    <div
+      data-slot="sheet-footer"
+      className={cn("mt-auto flex flex-col gap-2 p-4", className)}
+      {...props}
+    />
+  )
+}
+
+function SheetTitle({ className, ...props }: SheetPrimitive.Title.Props) {
+  return (
+    <SheetPrimitive.Title
+      data-slot="sheet-title"
+      className={cn("text-base font-medium text-foreground", className)}
+      {...props}
+    />
+  )
+}
+
+function SheetDescription({
+  className,
+  ...props
+}: SheetPrimitive.Description.Props) {
+  return (
+    <SheetPrimitive.Description
+      data-slot="sheet-description"
+      className={cn("text-sm text-muted-foreground", className)}
+      {...props}
+    />
+  )
+}
+
+export {
+  Sheet,
+  SheetTrigger,
+  SheetClose,
+  SheetContent,
+  SheetHeader,
+  SheetFooter,
+  SheetTitle,
+  SheetDescription,
+}
diff --git a/web/components/ui/switch.tsx b/web/components/ui/switch.tsx
new file mode 100644
index 0000000..9498efe
--- /dev/null
+++ b/web/components/ui/switch.tsx
@@ -0,0 +1,30 @@
+import { Switch as SwitchPrimitive } from "@base-ui/react/switch"
+
+import { cn } from "@/lib/utils"
+
+function Switch({
+  className,
+  size = "default",
+  ...props
+}: SwitchPrimitive.Root.Props & {
+  size?: "sm" | "default"
+}) {
+  return (
+    <SwitchPrimitive.Root
+      data-slot="switch"
+      data-size={size}
+      className={cn(
+        "peer group/switch relative inline-flex shrink-0 items-center rounded-full border border-transparent transition-all outline-none after:absolute after:-inset-x-3 after:-inset-y-2 focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 data-[size=default]:h-[18.4px] data-[size=default]:w-[32px] data-[size=sm]:h-[14px] data-[size=sm]:w-[24px] dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 data-checked:bg-primary data-unchecked:bg-input dark:data-unchecked:bg-input/80 data-disabled:cursor-not-allowed data-disabled:opacity-50",
+        className
+      )}
+      {...props}
+    >
+      <SwitchPrimitive.Thumb
+        data-slot="switch-thumb"
+        className="pointer-events-none block rounded-full bg-background ring-0 transition-transform group-data-[size=default]/switch:size-4 group-data-[size=sm]/switch:size-3 group-data-[size=default]/switch:data-checked:translate-x-[calc(100%-2px)] group-data-[size=sm]/switch:data-checked:translate-x-[calc(100%-2px)] dark:data-checked:bg-primary-foreground group-data-[size=default]/switch:data-unchecked:translate-x-0 group-data-[size=sm]/switch:data-unchecked:translate-x-0 dark:data-unchecked:bg-foreground"
+      />
+    </SwitchPrimitive.Root>
+  )
+}
+
+export { Switch }
diff --git a/web/components/ui/table.tsx b/web/components/ui/table.tsx
new file mode 100644
index 0000000..8dc13ae
--- /dev/null
+++ b/web/components/ui/table.tsx
@@ -0,0 +1,116 @@
+"use client"
+
+import * as React from "react"
+
+import { cn } from "@/lib/utils"
+
+function Table({ className, ...props }: React.ComponentProps<"table">) {
+  return (
+    <div
+      data-slot="table-container"
+      className="relative w-full overflow-x-auto"
+    >
+      <table
+        data-slot="table"
+        className={cn("w-full caption-bottom text-sm", className)}
+        {...props}
+      />
+    </div>
+  )
+}
+
+function TableHeader({ className, ...props }: React.ComponentProps<"thead">) {
+  return (
+    <thead
+      data-slot="table-header"
+      className={cn("[&_tr]:border-b", className)}
+      {...props}
+    />
+  )
+}
+
+function TableBody({ className, ...props }: React.ComponentProps<"tbody">) {
+  return (
+    <tbody
+      data-slot="table-body"
+      className={cn("[&_tr:last-child]:border-0", className)}
+      {...props}
+    />
+  )
+}
+
+function TableFooter({ className, ...props }: React.ComponentProps<"tfoot">) {
+  return (
+    <tfoot
+      data-slot="table-footer"
+      className={cn(
+        "border-t bg-muted/50 font-medium [&>tr]:last:border-b-0",
+        className
+      )}
+      {...props}
+    />
+  )
+}
+
+function TableRow({ className, ...props }: React.ComponentProps<"tr">) {
+  return (
+    <tr
+      data-slot="table-row"
+      className={cn(
+        "border-b transition-colors hover:bg-muted/50 data-[state=selected]:bg-muted",
+        className
+      )}
+      {...props}
+    />
+  )
+}
+
+function TableHead({ className, ...props }: React.ComponentProps<"th">) {
+  return (
+    <th
+      data-slot="table-head"
+      className={cn(
+        "h-10 px-2 text-left align-middle font-medium whitespace-nowrap text-foreground [&:has([role=checkbox])]:pr-0",
+        className
+      )}
+      {...props}
+    />
+  )
+}
+
+function TableCell({ className, ...props }: React.ComponentProps<"td">) {
+  return (
+    <td
+      data-slot="table-cell"
+      className={cn(
+        "p-2 align-middle whitespace-nowrap [&:has([role=checkbox])]:pr-0",
+        className
+      )}
+      {...props}
+    />
+  )
+}
+
+function TableCaption({
+  className,
+  ...props
+}: React.ComponentProps<"caption">) {
+  return (
+    <caption
+      data-slot="table-caption"
+      className={cn("mt-4 text-sm text-muted-foreground", className)}
+      {...props}
+    />
+  )
+}
+
+export {
+  Table,
+  TableHeader,
+  TableBody,
+  TableFooter,
+  TableHead,
+  TableRow,
+  TableCell,
+  TableCaption,
+}
diff --git a/web/index.css b/web/index.css
new file mode 100644
index 0000000..dfb5009
--- /dev/null
+++ b/web/index.css
@@ -0,0 +1,158 @@
+@import "tailwindcss";
+@import "tw-animate-css";
+@import "shadcn/tailwind.css";
+@import "@fontsource-variable/geist";
+
+@custom-variant dark (&:is(.dark *));
+
+:root {
+    --background: oklch(1 0 0);
+    --foreground: oklch(0.145 0 0);
+    --card: oklch(1 0 0);
+    --card-foreground: oklch(0.145 0 0);
+    --popover: oklch(1 0 0);
+    --popover-foreground: oklch(0.145 0 0);
+    --primary: oklch(0.205 0 0);
+    --primary-foreground: oklch(0.985 0 0);
+    --secondary: oklch(0.97 0 0);
+    --secondary-foreground: oklch(0.205 0 0);
+    --muted: oklch(0.97 0 0);
+    --muted-foreground: oklch(0.556 0 0);
+    --accent: oklch(0.97 0 0);
+    --accent-foreground: oklch(0.205 0 0);
+    --destructive: oklch(0.58 0.22 27);
+    --border: oklch(0.922 0 0);
+    --input: oklch(0.922 0 0);
+    --ring: oklch(0.708 0 0);
+    --chart-1: oklch(0.809 0.105 251.813);
+    --chart-2: oklch(0.623 0.214 259.815);
+    --chart-3: oklch(0.546 0.245 262.881);
+    --chart-4: oklch(0.488 0.243 264.376);
+    --chart-5: oklch(0.424 0.199 265.638);
+    --radius: 0.625rem;
+    --sidebar: oklch(0.985 0 0);
+    --sidebar-foreground: oklch(0.145 0 0);
+    --sidebar-primary: oklch(0.205 0 0);
+    --sidebar-primary-foreground: oklch(0.985 0 0);
+    --sidebar-accent: oklch(0.97 0 0);
+    --sidebar-accent-foreground: oklch(0.205 0 0);
+    --sidebar-border: oklch(0.922 0 0);
+    --sidebar-ring: oklch(0.708 0 0);
+}
+
+.dark {
+    /* Using the exact colors from your previous custom theme */
+    --background: hsl(224, 71%, 4%);
+    --foreground: hsl(210, 40%, 98%);
+    --card: hsl(224, 71%, 5%);
+    --card-foreground: hsl(210, 40%, 98%);
+    --popover: hsl(224, 71%, 4%);
+    --popover-foreground: hsl(210, 40%, 98%);
+    --primary: hsl(196, 100%, 50%);
+    --primary-foreground: hsl(222.2, 47.4%, 11.2%);
+    --secondary: hsl(217.2, 32.6%, 17.5%);
+    --secondary-foreground: hsl(210, 40%, 98%);
+    --muted: hsl(217.2, 32.6%, 17.5%);
+    --muted-foreground: hsl(215, 20.2%, 65.1%);
+    --accent: hsl(217.2, 32.6%, 17.5%);
+    --accent-foreground: hsl(210, 40%, 98%);
+    --destructive: hsl(0, 62.8%, 30.6%);
+    --destructive-foreground: hsl(210, 40%, 98%);
+    --border: hsl(217.2, 32.6%, 17.5%);
+    --input: hsl(217.2, 32.6%, 17.5%);
+    --ring: hsl(196, 100%, 50%);
+    --chart-1: oklch(0.809 0.105 251.813);
+    --chart-2: oklch(0.623 0.214 259.815);
+    --chart-3: oklch(0.546 0.245 262.881);
+    --chart-4: oklch(0.488 0.243 264.376);
+    --chart-5: oklch(0.424 0.199 265.638);
+    --sidebar: hsl(224, 71%, 5%);
+    --sidebar-foreground: hsl(210, 40%, 98%);
+    --sidebar-primary: hsl(196, 100%, 50%);
+    --sidebar-primary-foreground: hsl(222.2, 47.4%, 11.2%);
+    --sidebar-accent: hsl(217.2, 32.6%, 17.5%);
+    --sidebar-accent-foreground: hsl(210, 40%, 98%);
+    --sidebar-border: hsl(217.2, 32.6%, 17.5%);
+    --sidebar-ring: hsl(196, 100%, 50%);
+}
+
+@theme inline {
+    --font-sans: 'Geist Variable', sans-serif;
+    --color-sidebar-ring: var(--sidebar-ring);
+    --color-sidebar-border: var(--sidebar-border);
+    --color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
+    --color-sidebar-accent: var(--sidebar-accent);
+    --color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
+    --color-sidebar-primary: var(--sidebar-primary);
+    --color-sidebar-foreground: var(--sidebar-foreground);
+    --color-sidebar: var(--sidebar);
+    --color-chart-5: var(--chart-5);
+    --color-chart-4: var(--chart-4);
+    --color-chart-3: var(--chart-3);
+    --color-chart-2: var(--chart-2);
+    --color-chart-1: var(--chart-1);
+    --color-ring: var(--ring);
+    --color-input: var(--input);
+    --color-border: var(--border);
+    --color-destructive: var(--destructive);
+    --color-accent-foreground: var(--accent-foreground);
+    --color-accent: var(--accent);
+    --color-muted-foreground: var(--muted-foreground);
+    --color-muted: var(--muted);
+    --color-secondary-foreground: var(--secondary-foreground);
+    --color-secondary: var(--secondary);
+    --color-primary-foreground: var(--primary-foreground);
+    --color-primary: var(--primary);
+    --color-popover-foreground: var(--popover-foreground);
+    --color-popover: var(--popover);
+    --color-card-foreground: var(--card-foreground);
+    --color-card: var(--card);
+    --color-foreground: var(--foreground);
+    --color-background: var(--background);
+    --radius-sm: calc(var(--radius) * 0.6);
+    --radius-md: calc(var(--radius) * 0.8);
+    --radius-lg: var(--radius);
+    --radius-xl: calc(var(--radius) * 1.4);
+    --radius-2xl: calc(var(--radius) * 1.8);
+    --radius-3xl: calc(var(--radius) * 2.2);
+    --radius-4xl: calc(var(--radius) * 2.6);
+}
+
+@layer base {
+    * {
+        @apply border-border outline-ring/50;
+    }
+
+    body {
+        @apply bg-background text-foreground;
+        /* Subtle Grid Pattern */
+        background-image:
+            linear-gradient(rgba(255, 255, 255, 0.03) 1px, transparent 1px),
+            linear-gradient(90deg, rgba(255, 255, 255, 0.03) 1px, transparent 1px);
+        background-size: 40px 40px;
+        min-height: 100vh;
+    }
+
+    html {
+        @apply font-sans;
+    }
+}
+
+/* Custom Scrollbar styled for dark mode */
+::-webkit-scrollbar {
+    width: 8px;
+    height: 8px;
+}
+
+::-webkit-scrollbar-track {
+    background: transparent;
+}
+
+::-webkit-scrollbar-thumb {
+    background: var(--muted);
+    border-radius: 4px;
+}
+
+::-webkit-scrollbar-thumb:hover {
+    background: var(--primary);
+}
\ No newline at end of file
diff --git a/web/index.html b/web/index.html
index e4201fe..d27e334 100644
--- a/web/index.html
+++ b/web/index.html
@@ -1,122 +1,11 @@
 
 <!DOCTYPE html>
-<html lang="en">
+<html lang="en" class="dark">
   <head>
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>AI视频助手</title>
-    <script src="https://cdn.tailwindcss.com"></script>
-    <script>
-      tailwind.config = {
-        darkMode: 'class',
-        theme: {
-          extend: {
-            colors: {
-              border: "hsl(var(--border))",
-              input: "hsl(var(--input))",
-              ring: "hsl(var(--ring))",
-              background: "hsl(var(--background))",
-              foreground: "hsl(var(--foreground))",
-              primary: {
-                DEFAULT: "hsl(var(--primary))",
-                foreground: "hsl(var(--primary-foreground))",
-              },
-              secondary: {
-                DEFAULT: "hsl(var(--secondary))",
-                foreground: "hsl(var(--secondary-foreground))",
-              },
-              destructive: {
-                DEFAULT: "hsl(var(--destructive))",
-                foreground: "hsl(var(--destructive-foreground))",
-              },
-              muted: {
-                DEFAULT: "hsl(var(--muted))",
-                foreground: "hsl(var(--muted-foreground))",
-              },
-              accent: {
-                DEFAULT: "hsl(var(--accent))",
-                foreground: "hsl(var(--accent-foreground))",
-              },
-              card: {
-                DEFAULT: "hsl(var(--card))",
-                foreground: "hsl(var(--card-foreground))",
-              },
-              popover: {
-                DEFAULT: "hsl(var(--popover))",
-                foreground: "hsl(var(--popover-foreground))",
-              },
-            },
-            borderRadius: {
-              lg: "var(--radius)",
-              md: "calc(var(--radius) - 2px)",
-              sm: "calc(var(--radius) - 4px)",
-            },
-          },
-        },
-      }
-    </script>
-    <style>
-      :root {
-        /* Tech/Dark Theme Palette */
-        --background: 224 71% 4%; /* Very Dark Blue #020817 */
-        --foreground: 210 40% 98%; /* Light Gray/White */
-        
-        --card: 224 71% 5%; /* Slightly lighter than bg, will use transparency */
-        --card-foreground: 210 40% 98%;
- 
-        --popover: 224 71% 4%;
-        --popover-foreground: 210 40% 98%;
- 
-        --primary: 196 100% 50%; /* Cyan/Electric Blue for high tech feel */
-        --primary-foreground: 222.2 47.4% 11.2%;
- 
-        --secondary: 217.2 32.6% 17.5%;
-        --secondary-foreground: 210 40% 98%;
- 
-        --muted: 217.2 32.6% 17.5%;
-        --muted-foreground: 215 20.2% 65.1%;
- 
-        --accent: 217.2 32.6% 17.5%;
-        --accent-foreground: 210 40% 98%;
- 
-        --destructive: 0 62.8% 30.6%;
-        --destructive-foreground: 210 40% 98%;
- 
-        --border: 217.2 32.6% 17.5%;
-        --input: 217.2 32.6% 17.5%;
-        --ring: 196 100% 50%;
-        
-        --radius: 0.5rem;
-      }
-      
-      body {
-        font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
-        background-color: hsl(var(--background));
-        color: hsl(var(--foreground));
-        /* Subtle Grid Pattern */
-        background-image: 
-            linear-gradient(rgba(255, 255, 255, 0.03) 1px, transparent 1px), 
-            linear-gradient(90deg, rgba(255, 255, 255, 0.03) 1px, transparent 1px);
-        background-size: 40px 40px;
-        min-height: 100vh;
-      }
 
-      /* Custom Scrollbar */
-      ::-webkit-scrollbar {
-        width: 8px;
-        height: 8px;
-      }
-      ::-webkit-scrollbar-track {
-        background: transparent; 
-      }
-      ::-webkit-scrollbar-thumb {
-        background: hsl(var(--muted)); 
-        border-radius: 4px;
-      }
-      ::-webkit-scrollbar-thumb:hover {
-        background: hsl(var(--primary)); 
-      }
-    </style>
   <script type="importmap">
 {
   "imports": {
diff --git a/web/index.tsx b/web/index.tsx
index a43dad5..47180f2 100644
--- a/web/index.tsx
+++ b/web/index.tsx
@@ -3,6 +3,7 @@ import ReactDOM from 'react-dom/client';
 import { QueryClientProvider } from '@tanstack/react-query';
 import App from './App';
 import { queryClient } from './services/queryClient';
+import './index.css';
 
 const rootElement = document.getElementById('root');
 if (!rootElement) {
diff --git a/web/lib/utils.ts b/web/lib/utils.ts
new file mode 100644
index 0000000..bd0c391
--- /dev/null
+++ b/web/lib/utils.ts
@@ -0,0 +1,6 @@
+import { clsx, type ClassValue } from "clsx"
+import { twMerge } from "tailwind-merge"
+
+export function cn(...inputs: ClassValue[]) {
+  return twMerge(clsx(inputs))
+}
diff --git a/web/old_ui.txt b/web/old_ui.txt
new file mode 100644
index 0000000000000000000000000000000000000000..b92bd9a99d85ccff7eb478afe2ba9c6c188a63e9
GIT binary patch
literal 21882
zcmd^{Yi}FZ5r+43f&K?pC}O)PBU_2nL{(fQPTLenlOWEA0EUrTH%pCf5M^1ms=wZL
zo--WJoXakkjN>LK1d8PDxz6>SnZy0hzkl8RsypnCyR+`JJMS*KN%u{+*FEia(&v4-
zb}Dx#-7WcK*Kc)y?CO5k(&{^T-N-BUJL;axXouad^q)3HVWf5Wn{=N_%M1BC?M~+7
zpUAg8>9e0!v{$tGI<4-ko5}UP?kcrCk$L#;yLdMn_w(-C?(f|f-6v_Lb6MARnsrZl
zZFP1xuH?_%k&J#UFIMwF#=cIgo5-h2Sr=nGP51uPZOXM<LQAe4r+Y8u`=t9<x;~RJ
zcGB*4t9z$u6-UzVL|S>DXWfDHn90n34N7w5JW=*S`dp?y$`#f%lWVW!nyqLitMUHF
zLL>in)IAH|4(BU09^a(B!Xqf`Qlk4{6*=FaK&1U&x`#s7NKfY)wES3Jw}qmU*EHP`
zdOwvN%(^e-9lC3)Te8aEhjuybtxZY$*u$t|ZIuqO#g0(>Q0Cti+QRR6@7<0+#y^$+
z$QV?)>F%WU<#G|Jvz>Oc*F6$iy-c!1U-rG0xNSV2ij*U1S90f2+9Go^(U_gI64irA
z_fO$DR6mr~FRQz(?YXQQ3E7pq>~NCCLOZ6?6J6d<GRSwRyDMWoPuGzsBpEs}19~`>
zD@XFDy>`;<Q<1mB)M`7ecr(p<A)i%xr_ztUaE`h9dZ8sJB7M{D-sqOrXOh-Elhx@O
zc18D)PDWH(O=W)cg747L*TjzVo^TYK$G)NJ{qC-;NUfl1*QWH?NwmO<eIzZ`=2j4W
zLlSt8e9z_6c<#1?_G<Ug2)7q#&|ig?r`-$rv?mnYm;cyfn}wdaoYQAbC;=_=JCXbO
z9pnw0zbCz1Zm=B(vd`T#|FnB7l=wcq?#cf%k<Ra>^)s34sp#zoq9OOX54#O{-;htd
z-xV#nFIw?L)`abX2j{|_*6P-Ul2AIf>!1Jr==ncL^RLNjBF$?18|hZxjkK%pj-#Jy
zT-=}1p&oBt=y+GSn6Eka3$|YPhK`>L?Y0va_1iSb|Cwkhc3Ed~twzSxu5mY~bKg4A
z0kc3kpU^V3DzQx;RdNdW`b&9TPr6r9!M&hTARi5>k84<co#ni3PitIY-gb*9IqepG
zbQ;H%_L!<oaSu0h8)aG$?UQ-Kwq-&djMh_;Of1fo?DswS<ea|}DT?!9neaK@^P|^2
z-%p>gt{YV!Fo^fT(%5_-R&5QTczfn}A>)3OwJrCK<X?zpoQo#_a~Mrn^Oop}V^8dO
zi9tRVjPj4}xAMQ`&%wOhD{cPc;>weRj%n%CfBgEh->v7rk=dE$I-!t=Lv93<#=Wqg
zYuQ1LWE977Pxrf??bt`SGnbf1J@rz56S|pYnaU{N2tAMI_8pWF?GU&LAA+26Zzj~;
z7V3j<Xo<G|kog^U;J(}OzR!x6G~_je_PvLp`C+W@?ORBH4F2^IkV)vm{w{=5ihljR
z?;*#&HNOp`D(0=RXB&48%lP4I4wmv#&#&_Ci1Z-om+INRa8og%<A#Vg)$hDW5{Rw9
zrkg%vKh6@y0`s{gQUBAje(t{_D#en4k<LZ7K$)QSy@WENZ^4eldsu8AFZYMuu3VMh
z=|j$EGCMrqOGt+JK{1bybe!yqQmKu*hLCcO0wR_j>Sb7Y8GM~%MD@nQD8A;l+V2`=
z69>RAIHY?Z2GRHew5ztF?$<`=SkYQ;)lQc3-Ljgo&3dq*EenX|z{{A4cqHGEIW*n%
zdN>mi`;4<rvB#?RDUQ*$P_c#YWjPyFdK`Sfo3UH7K<UUeJXtLPKhAQM)}xm0pWc@B
zN6i0gJMg%BM>GX}wEV!6WOK2rM8`xW(W<vCU9I6iU(4Xg$gtBGY!xNeM;LEeUWh-t
z5Q-iQT9&T_f6;C$!yGZ!HqOSx9;J;zi*E_XPb7~=UVwZJ`N=Zhb&xFK5At8pKWGpS
z4Hh~HnGzcbyQ!_?xLBv#Y2SXIYx!uNal4c`$SiB-a|~8{B!0$d+h+^CMcWpd4T3+u
zPLJD%_vr0v+Z9ot%~EQM_b;t0JyyYmG4`=pP1?zaoyjggme?w`TdQIYups=V<t$LS
zZfQAlY(}IYmOH<aM=h+Wqy~M;YjrQ>2>D5*jy|`Wd0X2x?_^k!#@|%qBY(p@rdPfb
z)BQNZjc}`^cP$g@&p`HIOw0C@<CseRO%eIMltC@gxZ`xkyh9lJr}H}-vd(cxwZxwv
zq+GzbzNa$BzQ`VN{xX<1@7Ib>Yq{GL{=RuM8?|8~)f;TDA`q=Wk)J2J&<yomiLA&O
zQp>@XS=$(SZKV5_pQxp4HN5OT&E$DY=uSMPl{>p?@AbSY)nxC92dEK(uP4cZ>?i(d
z9vL(N-hiL$k~vbj2ZNFE;XOulsv%_P$un7xe!VEsU7i(X?p8&_uPVNwrlQeEi+|qQ
zS4Sr8e&AbQ8+hC1P>fih@|I91+GppGS)Mwh^HBJuh>d&>H3zM`k<~dDnv+4YxZG-2
z-~r9(zm!j9UdPchcC8gP*_`fKha;wO2<9`H>#{4cORUsljbml6^!=W-`BHXI{O;A%
zT6(pvsx?@4`7A>q{gqPNeL1`4iR`Y^ri{SyJ-~~4Z4pB(ioiSzx|O`#WphOHKzVKP
zO5`Qa`sLrIqM@u8z19qnYTM3S>ejpWlWjM9OU+d^or)f|wXR=U-(|ArLwSNR`P3o2
zkJf=cF6a3J(>0{u&NPq*1vB?)#HT_JZQ*=>Q<9tKqwO>R(oKeyEM7cUfHrHjhw8hZ
z5O|R|b|U*k(*1fKjoOI;tWhnMt7?o>r>!%7->J7)YjV1n#*}nfq+gtM@mRzwyLpwx
zEN8pUlF!K=!P#y{qj$^mm8wl=q9<NE#zT_x^t@w!Kd+3nM|f|pmA-~juk$f=&aw)W
z%hK}uq9(m3f1E&|8V}Yf_ZHh=OW1j&UH)w<vfCcBTzf9>%dh>VtegBeInDmn=dH%9
zKkpH#QtlwvOx=OYL^~@pM7e0mHM{#ZDzJuFuqbe@zj~)OxMg?LcVW5wbc$Cs)H}7#
z*_4=3Pts@&bR(T`usVk0RI7(m71el$tTCr<K<}J11L<mptc5Gfnuf(=<IdM?CQG2_
zY4Uh0-m#iMjK|{rJQiXctya1f>#u3nR$sBJV^NC-hJ31_+2~ifX1>*=!hP(w;-B;s
z5YfOyPFm&FMz>_M<c0h3nUD0j@C?7Kb(~gJk27n_qe^_nuz$+E%9cnFQ3Y#h%lDd`
z(RoKs<q$(?HrDq$6}n6Y??=t%Ow)sT4klvdn-pF6Iv&i?ZXcp?Dt?n}pnK*wf%VJL
zhfqIqvpkO+`D=fRi|jn&s#vC6Id<9O4yzWIt(<zpa<d4naKFqL*0Oe<C|2%Rt!VTR
zDp~oJT$cKx=iJKGexw|Qv$7ZR;w%~w7vIP-#vD6YXRkzft<~c4azAR9`p|#NI)U`j
zu<^2Q7R32CEdAe#o{x)mT|yoTB|sX#L>(~tEYbpN=X87<dT=nH2V`F386{3OIl3YT
zP6mq;Fkp^n3B%(5IS<3#*jn=|ATq@Y<%wLw6fV<!u`ga=Q)Gx7&TY{Z5RB&IJrj+-
zUWuk~I+OFV#Mq$bRbu3REjd_1OH6{DyNk4B_y0;uj6RFB#M(I>--ed-VG_>Dk+VfJ
z#%saPM}l`3O7Is6&x7L6CD;75yp!X3l&~5W+4&H2IaF`-6de4l^M~LKw9+H`PXxbM
zt-X{1#}0MQQqL@5mCohY7p!ub-m7A!F%{TFlq=V%xzR<voZh+IJH^32{j}w7O*6$*
zdDb<@OrG^wJwl~kN^WOIxTTc~>Uz{tR1V;xp6q6g8kN|0Jxix&YqzBpehCy0Hb<K5
zZ#ciZCgb8Omiz6=w)D7=9Eav<TC+0ymgod${p#qDO0oOR4VnE&+PN<*<7H~Mnu8=O
zhG#vH_vlR>J8C53+}9X}mDIFhmDdBZQCDfpysuGN_dAr0SW8(bu)yT?C+gt%YJQ~x
zrSt?f*(%z_yYTs$NPyYaGNZ1)Td})k4uezHc}^_<R%h(%^O${HzHVsGa&&9qi73S_
znzwQSNQl}!KSk__`H|csg5XzFb#&_5tQ>ii^ztOx&J*c#Eb%lJ)gwfc-?lv;V-JVc
z*0zO1J^Jimz8~zGt$a0m=4((Y)>^eCzqGWxjG+^(0FrKWC9ce`P^n&IDX^2qW6Q$v
z3kBN|btA1Oqdl!`XTKEN7;V|Dca-lN8TB?LWyVTt?&~4~FgiMyBf7x5@te0p`Ts(G
z;p)giGZu~)-VJ$&8aoh8gHz%Nr6l@Tb$_yEcoS&3${1s`W-*P*6}NCiTwP7u97*(3
z7j0_MjO%^0__11Nt6i)ucoFrKEvZ+(*Or=E2d<m@Y_;p#ciuMF7u%ETR7+#DuKJnC
z`qP9x$XMMLi-NBtwpI*|^xf&LxyIgYUE<`!S7QCKG)NLyMC0k!c}8kI<fCXAPnPB9
z6F~=#NNC%R0BZZ!mvLmopAxG_I<@sFws1=3niFY>PS|NYrJ4F7i;MVH?_aNu!{L5z
zFV0JyHb?0Ab0RhM<%Tr!Hhw;046-ABxJnwr=|O%+jTCBz<(0fEIy0o**2eYjcd}9<
zHqh>_teG<r6S=zHI4!ss)%UMRu_JX8ooiiA6KVxDpPNjtoyX8@m7i9EYxX;F)=5vU
zy%c2ceD+h9Ip^{9<vAwkY`owzf7j9qszh0v$a!SVnJE@njY8xp;5am3C!A~oe;*0A
zI3K~;Ga?d;jmZ4@sY<H5{>@q$UdLu|E`EDXU+}!0py8LAoL$TF=SS5Qk7w3XWCz;O
zQ=d69x7ev2GtOlFY8^FdWYw(YSjKYi(3b_|=@t6?ieuRcC)e1w)<cnpO?mlseVRmH
z-4AXqmRX}Vk~Hoq2zew52Z@D=mY@@RJP~a|6I)tmaz>;|#k00Qd8Ddwl*g&9`mW_|
z`_Sigk~hr-S!}w|6Pqg4;wk;|$s?@Ke<O|V+3!oaW51Xkr<3k|jV|$hD?Q_-O(C=c
znj;_YCkxQhZW|5XANSOrw-xo-2)vJ#CX1|*gsJdZt+G9x0NvHo8k`$7%^#ALMbWCQ
zacKR0_gdG7kPy$GVf{q+x8><JoL}V15dQH#?zLkq5q;;|$3MBJFOkPk?18?WCcAMy
zfBKEL9*%m5Lp7@8|3jf){uG)%3^pcO`Al@scvS92<C56IIr3w1R8B`wRHTohs^MMt
z#VNlOl(qV^bTo_BwgHQ+&N8@*GyGtIH-Wpx<&DRAf;Ku^WOLh?%JFZGno8^dN;i~5
zOg)`vg(FfbaZ`<w^1SG3sOeR*Bw!@<8H(6;1r-u`I_~9EBK$M_=bs!2+Ai@sj}!L0
z6d&|NdTHf#kq#OHvtI+WedRL#u(isv3UP0K&dqXS>?da46#e;KaGO@XSHoZGGv6Ev
zV?9($;2%i*Bw2W^zr(|JJpqkh9-Zaqz|H%|_eC~CD>>j#lcZHJi`KY!#tJxApB1J^
zpXXPhTg1HBn)5*{%*w}N9NM-pOWeJV7roC!&MUklJ@Xj5?6b()#LAV^O>@fnv_bu~
z3K$(!OuXXlpa)Oc((C23)sS`SG<r8`2T>3dJ{CK$e4G*YNZrH{OP(Ez?ey~)D&J}3
z32dbDIX7jbZSC|Os{{_}kKc#;x1)smH(wruDlP37U&IonH-Hyp7Gkbp+WjF}V2$(8
z^!ya7dDa+#lZnFylux_MN6yd7=l8VMs+NDuNnPwv{?xhg&#S}V)F<Fr4>IZ}->_+B
zqscul?&sEfam}QU+x_0ir1m@ESz8*Giy3V^)kU7;)E;#vyhRE)^-V77L6T$5H=;w<
VzklVlYX6?jb)-)lTi46@?Z3iM#cu!r

literal 0
HcmV?d00001

diff --git a/web/package-lock.json b/web/package-lock.json
index 8693dc4..1531f86 100644
--- a/web/package-lock.json
+++ b/web/package-lock.json
@@ -8,26 +8,57 @@
       "name": "ai视频助手2",
       "version": "0.0.0",
       "dependencies": {
+        "@base-ui/react": "^1.2.0",
+        "@fontsource-variable/geist": "^5.2.8",
         "@google/genai": "^1.39.0",
+        "@tailwindcss/vite": "^4.2.1",
         "@tanstack/react-query": "^5.90.2",
+        "class-variance-authority": "^0.7.1",
+        "clsx": "^2.1.1",
         "lucide-react": "^0.563.0",
         "react": "^19.2.4",
         "react-dom": "^19.2.4",
         "react-router-dom": "^7.13.0",
+        "shadcn": "^4.0.2",
+        "tailwind-merge": "^3.5.0",
+        "tw-animate-css": "^1.4.0",
         "zustand": "^5.0.8"
       },
       "devDependencies": {
         "@types/node": "^22.14.0",
         "@vitejs/plugin-react": "^5.0.0",
+        "autoprefixer": "^10.4.27",
+        "postcss": "^8.5.8",
+        "tailwindcss": "^4.2.1",
         "typescript": "~5.8.2",
         "vite": "^6.2.0"
       }
     },
+    "node_modules/@antfu/ni": {
+      "version": "25.0.0",
+      "resolved": "https://registry.npmjs.org/@antfu/ni/-/ni-25.0.0.tgz",
+      "integrity": "sha512-9q/yCljni37pkMr4sPrI3G4jqdIk074+iukc5aFJl7kmDCCsiJrbZ6zKxnES1Gwg+i9RcDZwvktl23puGslmvA==",
+      "license": "MIT",
+      "dependencies": {
+        "ansis": "^4.0.0",
+        "fzf": "^0.5.2",
+        "package-manager-detector": "^1.3.0",
+        "tinyexec": "^1.0.1"
+      },
+      "bin": {
+        "na": "bin/na.mjs",
+        "nci": "bin/nci.mjs",
+        "ni": "bin/ni.mjs",
+        "nlx": "bin/nlx.mjs",
+        "nr": "bin/nr.mjs",
+        "nun": "bin/nun.mjs",
+        "nup": "bin/nup.mjs"
+      }
+    },
     "node_modules/@babel/code-frame": {
       "version": "7.29.0",
       "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.29.0.tgz",
       "integrity": "sha512-9NhCeYjq9+3uxgdtp20LSiJXJvN0FeCtNGpJxuMFZ1Kv3cWUNb6DOhJwUvcVCzKGR66cw4njwM6hrJLqgOwbcw==",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "@babel/helper-validator-identifier": "^7.28.5",
@@ -42,7 +73,6 @@
       "version": "7.29.0",
       "resolved": "https://registry.npmjs.org/@babel/compat-data/-/compat-data-7.29.0.tgz",
       "integrity": "sha512-T1NCJqT/j9+cn8fvkt7jtwbLBfLC/1y1c7NtCeXFRgzGTsafi68MRv8yzkYSapBnFA6L3U2VSc02ciDzoAJhJg==",
-      "dev": true,
       "license": "MIT",
       "engines": {
         "node": ">=6.9.0"
@@ -52,7 +82,6 @@
       "version": "7.29.0",
       "resolved": "https://registry.npmjs.org/@babel/core/-/core-7.29.0.tgz",
       "integrity": "sha512-CGOfOJqWjg2qW/Mb6zNsDm+u5vFQ8DxXfbM09z69p5Z6+mE1ikP2jUXw+j42Pf1XTYED2Rni5f95npYeuwMDQA==",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "@babel/code-frame": "^7.29.0",
@@ -83,7 +112,6 @@
       "version": "7.29.0",
       "resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.29.0.tgz",
       "integrity": "sha512-vSH118/wwM/pLR38g/Sgk05sNtro6TlTJKuiMXDaZqPUfjTFcudpCOt00IhOfj+1BFAX+UFAlzCU+6WXr3GLFQ==",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "@babel/parser": "^7.29.0",
@@ -96,11 +124,22 @@
         "node": ">=6.9.0"
       }
     },
+    "node_modules/@babel/helper-annotate-as-pure": {
+      "version": "7.27.3",
+      "resolved": "https://registry.npmjs.org/@babel/helper-annotate-as-pure/-/helper-annotate-as-pure-7.27.3.tgz",
+      "integrity": "sha512-fXSwMQqitTGeHLBC08Eq5yXz2m37E4pJX1qAU1+2cNedz/ifv/bVXft90VeSav5nFO61EcNgwr0aJxbyPaWBPg==",
+      "license": "MIT",
+      "dependencies": {
+        "@babel/types": "^7.27.3"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
     "node_modules/@babel/helper-compilation-targets": {
       "version": "7.28.6",
       "resolved": "https://registry.npmjs.org/@babel/helper-compilation-targets/-/helper-compilation-targets-7.28.6.tgz",
       "integrity": "sha512-JYtls3hqi15fcx5GaSNL7SCTJ2MNmjrkHXg4FSpOA/grxK8KwyZ5bubHsCq8FXCkua6xhuaaBit+3b7+VZRfcA==",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "@babel/compat-data": "^7.28.6",
@@ -113,21 +152,53 @@
         "node": ">=6.9.0"
       }
     },
+    "node_modules/@babel/helper-create-class-features-plugin": {
+      "version": "7.28.6",
+      "resolved": "https://registry.npmjs.org/@babel/helper-create-class-features-plugin/-/helper-create-class-features-plugin-7.28.6.tgz",
+      "integrity": "sha512-dTOdvsjnG3xNT9Y0AUg1wAl38y+4Rl4sf9caSQZOXdNqVn+H+HbbJ4IyyHaIqNR6SW9oJpA/RuRjsjCw2IdIow==",
+      "license": "MIT",
+      "dependencies": {
+        "@babel/helper-annotate-as-pure": "^7.27.3",
+        "@babel/helper-member-expression-to-functions": "^7.28.5",
+        "@babel/helper-optimise-call-expression": "^7.27.1",
+        "@babel/helper-replace-supers": "^7.28.6",
+        "@babel/helper-skip-transparent-expression-wrappers": "^7.27.1",
+        "@babel/traverse": "^7.28.6",
+        "semver": "^6.3.1"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      },
+      "peerDependencies": {
+        "@babel/core": "^7.0.0"
+      }
+    },
     "node_modules/@babel/helper-globals": {
       "version": "7.28.0",
       "resolved": "https://registry.npmjs.org/@babel/helper-globals/-/helper-globals-7.28.0.tgz",
       "integrity": "sha512-+W6cISkXFa1jXsDEdYA8HeevQT/FULhxzR99pxphltZcVaugps53THCeiWA8SguxxpSp3gKPiuYfSWopkLQ4hw==",
-      "dev": true,
       "license": "MIT",
       "engines": {
         "node": ">=6.9.0"
       }
     },
+    "node_modules/@babel/helper-member-expression-to-functions": {
+      "version": "7.28.5",
+      "resolved": "https://registry.npmjs.org/@babel/helper-member-expression-to-functions/-/helper-member-expression-to-functions-7.28.5.tgz",
+      "integrity": "sha512-cwM7SBRZcPCLgl8a7cY0soT1SptSzAlMH39vwiRpOQkJlh53r5hdHwLSCZpQdVLT39sZt+CRpNwYG4Y2v77atg==",
+      "license": "MIT",
+      "dependencies": {
+        "@babel/traverse": "^7.28.5",
+        "@babel/types": "^7.28.5"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
     "node_modules/@babel/helper-module-imports": {
       "version": "7.28.6",
       "resolved": "https://registry.npmjs.org/@babel/helper-module-imports/-/helper-module-imports-7.28.6.tgz",
       "integrity": "sha512-l5XkZK7r7wa9LucGw9LwZyyCUscb4x37JWTPz7swwFE/0FMQAGpiWUZn8u9DzkSBWEcK25jmvubfpw2dnAMdbw==",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "@babel/traverse": "^7.28.6",
@@ -141,7 +212,6 @@
       "version": "7.28.6",
       "resolved": "https://registry.npmjs.org/@babel/helper-module-transforms/-/helper-module-transforms-7.28.6.tgz",
       "integrity": "sha512-67oXFAYr2cDLDVGLXTEABjdBJZ6drElUSI7WKp70NrpyISso3plG9SAGEF6y7zbha/wOzUByWWTJvEDVNIUGcA==",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "@babel/helper-module-imports": "^7.28.6",
@@ -155,21 +225,61 @@
         "@babel/core": "^7.0.0"
       }
     },
+    "node_modules/@babel/helper-optimise-call-expression": {
+      "version": "7.27.1",
+      "resolved": "https://registry.npmjs.org/@babel/helper-optimise-call-expression/-/helper-optimise-call-expression-7.27.1.tgz",
+      "integrity": "sha512-URMGH08NzYFhubNSGJrpUEphGKQwMQYBySzat5cAByY1/YgIRkULnIy3tAMeszlL/so2HbeilYloUmSpd7GdVw==",
+      "license": "MIT",
+      "dependencies": {
+        "@babel/types": "^7.27.1"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
     "node_modules/@babel/helper-plugin-utils": {
       "version": "7.28.6",
       "resolved": "https://registry.npmjs.org/@babel/helper-plugin-utils/-/helper-plugin-utils-7.28.6.tgz",
       "integrity": "sha512-S9gzZ/bz83GRysI7gAD4wPT/AI3uCnY+9xn+Mx/KPs2JwHJIz1W8PZkg2cqyt3RNOBM8ejcXhV6y8Og7ly/Dug==",
-      "dev": true,
       "license": "MIT",
       "engines": {
         "node": ">=6.9.0"
       }
     },
+    "node_modules/@babel/helper-replace-supers": {
+      "version": "7.28.6",
+      "resolved": "https://registry.npmjs.org/@babel/helper-replace-supers/-/helper-replace-supers-7.28.6.tgz",
+      "integrity": "sha512-mq8e+laIk94/yFec3DxSjCRD2Z0TAjhVbEJY3UQrlwVo15Lmt7C2wAUbK4bjnTs4APkwsYLTahXRraQXhb1WCg==",
+      "license": "MIT",
+      "dependencies": {
+        "@babel/helper-member-expression-to-functions": "^7.28.5",
+        "@babel/helper-optimise-call-expression": "^7.27.1",
+        "@babel/traverse": "^7.28.6"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      },
+      "peerDependencies": {
+        "@babel/core": "^7.0.0"
+      }
+    },
+    "node_modules/@babel/helper-skip-transparent-expression-wrappers": {
+      "version": "7.27.1",
+      "resolved": "https://registry.npmjs.org/@babel/helper-skip-transparent-expression-wrappers/-/helper-skip-transparent-expression-wrappers-7.27.1.tgz",
+      "integrity": "sha512-Tub4ZKEXqbPjXgWLl2+3JpQAYBJ8+ikpQ2Ocj/q/r0LwE3UhENh7EUabyHjz2kCEsrRY83ew2DQdHluuiDQFzg==",
+      "license": "MIT",
+      "dependencies": {
+        "@babel/traverse": "^7.27.1",
+        "@babel/types": "^7.27.1"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
     "node_modules/@babel/helper-string-parser": {
       "version": "7.27.1",
       "resolved": "https://registry.npmjs.org/@babel/helper-string-parser/-/helper-string-parser-7.27.1.tgz",
       "integrity": "sha512-qMlSxKbpRlAridDExk92nSobyDdpPijUq2DW6oDnUqd0iOGxmQjyqhMIihI9+zv4LPyZdRje2cavWPbCbWm3eA==",
-      "dev": true,
       "license": "MIT",
       "engines": {
         "node": ">=6.9.0"
@@ -179,7 +289,6 @@
       "version": "7.28.5",
       "resolved": "https://registry.npmjs.org/@babel/helper-validator-identifier/-/helper-validator-identifier-7.28.5.tgz",
       "integrity": "sha512-qSs4ifwzKJSV39ucNjsvc6WVHs6b7S03sOh2OcHF9UHfVPqWWALUsNUVzhSBiItjRZoLHx7nIarVjqKVusUZ1Q==",
-      "dev": true,
       "license": "MIT",
       "engines": {
         "node": ">=6.9.0"
@@ -189,7 +298,6 @@
       "version": "7.27.1",
       "resolved": "https://registry.npmjs.org/@babel/helper-validator-option/-/helper-validator-option-7.27.1.tgz",
       "integrity": "sha512-YvjJow9FxbhFFKDSuFnVCe2WxXk1zWc22fFePVNEaWJEu8IrZVlda6N0uHwzZrUM1il7NC9Mlp4MaJYbYd9JSg==",
-      "dev": true,
       "license": "MIT",
       "engines": {
         "node": ">=6.9.0"
@@ -199,7 +307,6 @@
       "version": "7.28.6",
       "resolved": "https://registry.npmjs.org/@babel/helpers/-/helpers-7.28.6.tgz",
       "integrity": "sha512-xOBvwq86HHdB7WUDTfKfT/Vuxh7gElQ+Sfti2Cy6yIWNW05P8iUslOVcZ4/sKbE+/jQaukQAdz/gf3724kYdqw==",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "@babel/template": "^7.28.6",
@@ -213,7 +320,6 @@
       "version": "7.29.0",
       "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.29.0.tgz",
       "integrity": "sha512-IyDgFV5GeDUVX4YdF/3CPULtVGSXXMLh1xVIgdCgxApktqnQV0r7/8Nqthg+8YLGaAtdyIlo2qIdZrbCv4+7ww==",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "@babel/types": "^7.29.0"
@@ -225,6 +331,52 @@
         "node": ">=6.0.0"
       }
     },
+    "node_modules/@babel/plugin-syntax-jsx": {
+      "version": "7.28.6",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-jsx/-/plugin-syntax-jsx-7.28.6.tgz",
+      "integrity": "sha512-wgEmr06G6sIpqr8YDwA2dSRTE3bJ+V0IfpzfSY3Lfgd7YWOaAdlykvJi13ZKBt8cZHfgH1IXN+CL656W3uUa4w==",
+      "license": "MIT",
+      "dependencies": {
+        "@babel/helper-plugin-utils": "^7.28.6"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      },
+      "peerDependencies": {
+        "@babel/core": "^7.0.0-0"
+      }
+    },
+    "node_modules/@babel/plugin-syntax-typescript": {
+      "version": "7.28.6",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-typescript/-/plugin-syntax-typescript-7.28.6.tgz",
+      "integrity": "sha512-+nDNmQye7nlnuuHDboPbGm00Vqg3oO8niRRL27/4LYHUsHYh0zJ1xWOz0uRwNFmM1Avzk8wZbc6rdiYhomzv/A==",
+      "license": "MIT",
+      "dependencies": {
+        "@babel/helper-plugin-utils": "^7.28.6"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      },
+      "peerDependencies": {
+        "@babel/core": "^7.0.0-0"
+      }
+    },
+    "node_modules/@babel/plugin-transform-modules-commonjs": {
+      "version": "7.28.6",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-modules-commonjs/-/plugin-transform-modules-commonjs-7.28.6.tgz",
+      "integrity": "sha512-jppVbf8IV9iWWwWTQIxJMAJCWBuuKx71475wHwYytrRGQ2CWiDvYlADQno3tcYpS/T2UUWFQp3nVtYfK/YBQrA==",
+      "license": "MIT",
+      "dependencies": {
+        "@babel/helper-module-transforms": "^7.28.6",
+        "@babel/helper-plugin-utils": "^7.28.6"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      },
+      "peerDependencies": {
+        "@babel/core": "^7.0.0-0"
+      }
+    },
     "node_modules/@babel/plugin-transform-react-jsx-self": {
       "version": "7.27.1",
       "resolved": "https://registry.npmjs.org/@babel/plugin-transform-react-jsx-self/-/plugin-transform-react-jsx-self-7.27.1.tgz",
@@ -257,11 +409,57 @@
         "@babel/core": "^7.0.0-0"
       }
     },
+    "node_modules/@babel/plugin-transform-typescript": {
+      "version": "7.28.6",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-typescript/-/plugin-transform-typescript-7.28.6.tgz",
+      "integrity": "sha512-0YWL2RFxOqEm9Efk5PvreamxPME8OyY0wM5wh5lHjF+VtVhdneCWGzZeSqzOfiobVqQaNCd2z0tQvnI9DaPWPw==",
+      "license": "MIT",
+      "dependencies": {
+        "@babel/helper-annotate-as-pure": "^7.27.3",
+        "@babel/helper-create-class-features-plugin": "^7.28.6",
+        "@babel/helper-plugin-utils": "^7.28.6",
+        "@babel/helper-skip-transparent-expression-wrappers": "^7.27.1",
+        "@babel/plugin-syntax-typescript": "^7.28.6"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      },
+      "peerDependencies": {
+        "@babel/core": "^7.0.0-0"
+      }
+    },
+    "node_modules/@babel/preset-typescript": {
+      "version": "7.28.5",
+      "resolved": "https://registry.npmjs.org/@babel/preset-typescript/-/preset-typescript-7.28.5.tgz",
+      "integrity": "sha512-+bQy5WOI2V6LJZpPVxY+yp66XdZ2yifu0Mc1aP5CQKgjn4QM5IN2i5fAZ4xKop47pr8rpVhiAeu+nDQa12C8+g==",
+      "license": "MIT",
+      "dependencies": {
+        "@babel/helper-plugin-utils": "^7.27.1",
+        "@babel/helper-validator-option": "^7.27.1",
+        "@babel/plugin-syntax-jsx": "^7.27.1",
+        "@babel/plugin-transform-modules-commonjs": "^7.27.1",
+        "@babel/plugin-transform-typescript": "^7.28.5"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      },
+      "peerDependencies": {
+        "@babel/core": "^7.0.0-0"
+      }
+    },
+    "node_modules/@babel/runtime": {
+      "version": "7.28.6",
+      "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.28.6.tgz",
+      "integrity": "sha512-05WQkdpL9COIMz4LjTxGpPNCdlpyimKppYNoJ5Di5EUObifl8t4tuLuUBBZEpoLYOmfvIWrsp9fCl0HoPRVTdA==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
     "node_modules/@babel/template": {
       "version": "7.28.6",
       "resolved": "https://registry.npmjs.org/@babel/template/-/template-7.28.6.tgz",
       "integrity": "sha512-YA6Ma2KsCdGb+WC6UpBVFJGXL58MDA6oyONbjyF/+5sBgxY/dwkhLogbMT2GXXyU84/IhRw/2D1Os1B/giz+BQ==",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "@babel/code-frame": "^7.28.6",
@@ -276,7 +474,6 @@
       "version": "7.29.0",
       "resolved": "https://registry.npmjs.org/@babel/traverse/-/traverse-7.29.0.tgz",
       "integrity": "sha512-4HPiQr0X7+waHfyXPZpWPfWL/J7dcN1mx9gL6WdQVMbPnF3+ZhSMs8tCxN7oHddJE9fhNE7+lxdnlyemKfJRuA==",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "@babel/code-frame": "^7.29.0",
@@ -295,7 +492,6 @@
       "version": "7.29.0",
       "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.29.0.tgz",
       "integrity": "sha512-LwdZHpScM4Qz8Xw2iKSzS+cfglZzJGvofQICy7W7v4caru4EaAmyUuO6BGrbyQ2mYV11W0U8j5mBhd14dd3B0A==",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "@babel/helper-string-parser": "^7.27.1",
@@ -305,6 +501,227 @@
         "node": ">=6.9.0"
       }
     },
+    "node_modules/@base-ui/react": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/@base-ui/react/-/react-1.2.0.tgz",
+      "integrity": "sha512-O6aEQHcm+QyGTFY28xuwRD3SEJGZOBDpyjN2WvpfWYFVhg+3zfXPysAILqtM0C1kWC82MccOE/v1j+GHXE4qIw==",
+      "license": "MIT",
+      "dependencies": {
+        "@babel/runtime": "^7.28.6",
+        "@base-ui/utils": "0.2.5",
+        "@floating-ui/react-dom": "^2.1.6",
+        "@floating-ui/utils": "^0.2.10",
+        "tabbable": "^6.4.0",
+        "use-sync-external-store": "^1.6.0"
+      },
+      "engines": {
+        "node": ">=14.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/mui-org"
+      },
+      "peerDependencies": {
+        "@types/react": "^17 || ^18 || ^19",
+        "react": "^17 || ^18 || ^19",
+        "react-dom": "^17 || ^18 || ^19"
+      },
+      "peerDependenciesMeta": {
+        "@types/react": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@base-ui/utils": {
+      "version": "0.2.5",
+      "resolved": "https://registry.npmjs.org/@base-ui/utils/-/utils-0.2.5.tgz",
+      "integrity": "sha512-oYC7w0gp76RI5MxprlGLV0wze0SErZaRl3AAkeP3OnNB/UBMb6RqNf6ZSIlxOc9Qp68Ab3C2VOcJQyRs7Xc7Vw==",
+      "license": "MIT",
+      "dependencies": {
+        "@babel/runtime": "^7.28.6",
+        "@floating-ui/utils": "^0.2.10",
+        "reselect": "^5.1.1",
+        "use-sync-external-store": "^1.6.0"
+      },
+      "peerDependencies": {
+        "@types/react": "^17 || ^18 || ^19",
+        "react": "^17 || ^18 || ^19",
+        "react-dom": "^17 || ^18 || ^19"
+      },
+      "peerDependenciesMeta": {
+        "@types/react": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@dotenvx/dotenvx": {
+      "version": "1.54.1",
+      "resolved": "https://registry.npmjs.org/@dotenvx/dotenvx/-/dotenvx-1.54.1.tgz",
+      "integrity": "sha512-41gU3q7v05GM92QPuPUf4CmUw+mmF8p4wLUh6MCRlxpCkJ9ByLcY9jUf6MwrMNmiKyG/rIckNxj9SCfmNCmCqw==",
+      "license": "BSD-3-Clause",
+      "dependencies": {
+        "commander": "^11.1.0",
+        "dotenv": "^17.2.1",
+        "eciesjs": "^0.4.10",
+        "execa": "^5.1.1",
+        "fdir": "^6.2.0",
+        "ignore": "^5.3.0",
+        "object-treeify": "1.1.33",
+        "picomatch": "^4.0.2",
+        "which": "^4.0.0"
+      },
+      "bin": {
+        "dotenvx": "src/cli/dotenvx.js"
+      },
+      "funding": {
+        "url": "https://dotenvx.com"
+      }
+    },
+    "node_modules/@dotenvx/dotenvx/node_modules/commander": {
+      "version": "11.1.0",
+      "resolved": "https://registry.npmjs.org/commander/-/commander-11.1.0.tgz",
+      "integrity": "sha512-yPVavfyCcRhmorC7rWlkHn15b4wDVgVmBA7kV4QVBsF7kv/9TKJAbAXVTxvTnwP8HHKjRCJDClKbciiYS7p0DQ==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=16"
+      }
+    },
+    "node_modules/@dotenvx/dotenvx/node_modules/execa": {
+      "version": "5.1.1",
+      "resolved": "https://registry.npmjs.org/execa/-/execa-5.1.1.tgz",
+      "integrity": "sha512-8uSpZZocAZRBAPIEINJj3Lo9HyGitllczc27Eh5YYojjMFMn8yHMDMaUHE2Jqfq05D/wucwI4JGURyXt1vchyg==",
+      "license": "MIT",
+      "dependencies": {
+        "cross-spawn": "^7.0.3",
+        "get-stream": "^6.0.0",
+        "human-signals": "^2.1.0",
+        "is-stream": "^2.0.0",
+        "merge-stream": "^2.0.0",
+        "npm-run-path": "^4.0.1",
+        "onetime": "^5.1.2",
+        "signal-exit": "^3.0.3",
+        "strip-final-newline": "^2.0.0"
+      },
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/sindresorhus/execa?sponsor=1"
+      }
+    },
+    "node_modules/@dotenvx/dotenvx/node_modules/get-stream": {
+      "version": "6.0.1",
+      "resolved": "https://registry.npmjs.org/get-stream/-/get-stream-6.0.1.tgz",
+      "integrity": "sha512-ts6Wi+2j3jQjqi70w5AlN8DFnkSwC+MqmxEzdEALB2qXZYV3X/b1CTfgPLGJNMeAWxdPfU8FO1ms3NUfaHCPYg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/@dotenvx/dotenvx/node_modules/human-signals": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/human-signals/-/human-signals-2.1.0.tgz",
+      "integrity": "sha512-B4FFZ6q/T2jhhksgkbEW3HBvWIfDW85snkQgawt07S7J5QXTk6BkNV+0yAeZrM5QpMAdYlocGoljn0sJ/WQkFw==",
+      "license": "Apache-2.0",
+      "engines": {
+        "node": ">=10.17.0"
+      }
+    },
+    "node_modules/@dotenvx/dotenvx/node_modules/is-stream": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/is-stream/-/is-stream-2.0.1.tgz",
+      "integrity": "sha512-hFoiJiTl63nn+kstHGBtewWSKnQLpyb155KHheA1l39uvtO9nWIop1p3udqPcUd/xbF1VLMO4n7OI6p7RbngDg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=8"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/@dotenvx/dotenvx/node_modules/isexe": {
+      "version": "3.1.5",
+      "resolved": "https://registry.npmjs.org/isexe/-/isexe-3.1.5.tgz",
+      "integrity": "sha512-6B3tLtFqtQS4ekarvLVMZ+X+VlvQekbe4taUkf/rhVO3d/h0M2rfARm/pXLcPEsjjMsFgrFgSrhQIxcSVrBz8w==",
+      "license": "BlueOak-1.0.0",
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@dotenvx/dotenvx/node_modules/npm-run-path": {
+      "version": "4.0.1",
+      "resolved": "https://registry.npmjs.org/npm-run-path/-/npm-run-path-4.0.1.tgz",
+      "integrity": "sha512-S48WzZW777zhNIrn7gxOlISNAqi9ZC/uQFnRdbeIHhZhCA6UqpkOT8T1G7BvfdgP4Er8gF4sUbaS0i7QvIfCWw==",
+      "license": "MIT",
+      "dependencies": {
+        "path-key": "^3.0.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/@dotenvx/dotenvx/node_modules/onetime": {
+      "version": "5.1.2",
+      "resolved": "https://registry.npmjs.org/onetime/-/onetime-5.1.2.tgz",
+      "integrity": "sha512-kbpaSSGJTWdAY5KPVeMOKXSrPtr8C8C7wodJbcsd51jRnmD+GZu8Y0VoU6Dm5Z4vWr0Ig/1NKuWRKf7j5aaYSg==",
+      "license": "MIT",
+      "dependencies": {
+        "mimic-fn": "^2.1.0"
+      },
+      "engines": {
+        "node": ">=6"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/@dotenvx/dotenvx/node_modules/signal-exit": {
+      "version": "3.0.7",
+      "resolved": "https://registry.npmjs.org/signal-exit/-/signal-exit-3.0.7.tgz",
+      "integrity": "sha512-wnD2ZE+l+SPC/uoS0vXeE9L1+0wuaMqKlfz9AMUo38JsyLSBWSFcHR1Rri62LZc12vLr1gb3jl7iwQhgwpAbGQ==",
+      "license": "ISC"
+    },
+    "node_modules/@dotenvx/dotenvx/node_modules/strip-final-newline": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/strip-final-newline/-/strip-final-newline-2.0.0.tgz",
+      "integrity": "sha512-BrpvfNAE3dcvq7ll3xVumzjKjZQ5tI1sEUIKr3Uoks0XUl45St3FlatVqef9prk4jRDzhW6WZg+3bk93y6pLjA==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=6"
+      }
+    },
+    "node_modules/@dotenvx/dotenvx/node_modules/which": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/which/-/which-4.0.0.tgz",
+      "integrity": "sha512-GlaYyEb07DPxYCKhKzplCWBJtvxZcZMrL+4UkrTSJHHPyZU4mYYTv3qaOe77H7EODLSSopAUFAc6W8U4yqvscg==",
+      "license": "ISC",
+      "dependencies": {
+        "isexe": "^3.1.1"
+      },
+      "bin": {
+        "node-which": "bin/which.js"
+      },
+      "engines": {
+        "node": "^16.13.0 || >=18.0.0"
+      }
+    },
+    "node_modules/@ecies/ciphers": {
+      "version": "0.2.5",
+      "resolved": "https://registry.npmjs.org/@ecies/ciphers/-/ciphers-0.2.5.tgz",
+      "integrity": "sha512-GalEZH4JgOMHYYcYmVqnFirFsjZHeoGMDt9IxEnM9F7GRUUyUksJ7Ou53L83WHJq3RWKD3AcBpo0iQh0oMpf8A==",
+      "license": "MIT",
+      "engines": {
+        "bun": ">=1",
+        "deno": ">=2",
+        "node": ">=16"
+      },
+      "peerDependencies": {
+        "@noble/ciphers": "^1.0.0"
+      }
+    },
     "node_modules/@esbuild/aix-ppc64": {
       "version": "0.25.12",
       "resolved": "https://registry.npmjs.org/@esbuild/aix-ppc64/-/aix-ppc64-0.25.12.tgz",
@@ -312,7 +729,6 @@
       "cpu": [
         "ppc64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -329,7 +745,6 @@
       "cpu": [
         "arm"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -346,7 +761,6 @@
       "cpu": [
         "arm64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -363,7 +777,6 @@
       "cpu": [
         "x64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -380,7 +793,6 @@
       "cpu": [
         "arm64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -397,7 +809,6 @@
       "cpu": [
         "x64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -414,7 +825,6 @@
       "cpu": [
         "arm64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -431,7 +841,6 @@
       "cpu": [
         "x64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -448,7 +857,6 @@
       "cpu": [
         "arm"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -465,7 +873,6 @@
       "cpu": [
         "arm64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -482,7 +889,6 @@
       "cpu": [
         "ia32"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -499,7 +905,6 @@
       "cpu": [
         "loong64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -516,7 +921,6 @@
       "cpu": [
         "mips64el"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -533,7 +937,6 @@
       "cpu": [
         "ppc64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -550,7 +953,6 @@
       "cpu": [
         "riscv64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -567,7 +969,6 @@
       "cpu": [
         "s390x"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -584,7 +985,6 @@
       "cpu": [
         "x64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -601,7 +1001,6 @@
       "cpu": [
         "arm64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -618,7 +1017,6 @@
       "cpu": [
         "x64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -635,7 +1033,6 @@
       "cpu": [
         "arm64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -652,7 +1049,6 @@
       "cpu": [
         "x64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -669,7 +1065,6 @@
       "cpu": [
         "arm64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -686,7 +1081,6 @@
       "cpu": [
         "x64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -703,7 +1097,6 @@
       "cpu": [
         "arm64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -720,7 +1113,6 @@
       "cpu": [
         "ia32"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -737,7 +1129,6 @@
       "cpu": [
         "x64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -747,6 +1138,53 @@
         "node": ">=18"
       }
     },
+    "node_modules/@floating-ui/core": {
+      "version": "1.7.5",
+      "resolved": "https://registry.npmjs.org/@floating-ui/core/-/core-1.7.5.tgz",
+      "integrity": "sha512-1Ih4WTWyw0+lKyFMcBHGbb5U5FtuHJuujoyyr5zTaWS5EYMeT6Jb2AuDeftsCsEuchO+mM2ij5+q9crhydzLhQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@floating-ui/utils": "^0.2.11"
+      }
+    },
+    "node_modules/@floating-ui/dom": {
+      "version": "1.7.6",
+      "resolved": "https://registry.npmjs.org/@floating-ui/dom/-/dom-1.7.6.tgz",
+      "integrity": "sha512-9gZSAI5XM36880PPMm//9dfiEngYoC6Am2izES1FF406YFsjvyBMmeJ2g4SAju3xWwtuynNRFL2s9hgxpLI5SQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@floating-ui/core": "^1.7.5",
+        "@floating-ui/utils": "^0.2.11"
+      }
+    },
+    "node_modules/@floating-ui/react-dom": {
+      "version": "2.1.8",
+      "resolved": "https://registry.npmjs.org/@floating-ui/react-dom/-/react-dom-2.1.8.tgz",
+      "integrity": "sha512-cC52bHwM/n/CxS87FH0yWdngEZrjdtLW/qVruo68qg+prK7ZQ4YGdut2GyDVpoGeAYe/h899rVeOVm6Oi40k2A==",
+      "license": "MIT",
+      "dependencies": {
+        "@floating-ui/dom": "^1.7.6"
+      },
+      "peerDependencies": {
+        "react": ">=16.8.0",
+        "react-dom": ">=16.8.0"
+      }
+    },
+    "node_modules/@floating-ui/utils": {
+      "version": "0.2.11",
+      "resolved": "https://registry.npmjs.org/@floating-ui/utils/-/utils-0.2.11.tgz",
+      "integrity": "sha512-RiB/yIh78pcIxl6lLMG0CgBXAZ2Y0eVHqMPYugu+9U0AeT6YBeiJpf7lbdJNIugFP5SIjwNRgo4DhR1Qxi26Gg==",
+      "license": "MIT"
+    },
+    "node_modules/@fontsource-variable/geist": {
+      "version": "5.2.8",
+      "resolved": "https://registry.npmjs.org/@fontsource-variable/geist/-/geist-5.2.8.tgz",
+      "integrity": "sha512-cJ6m9e+8MQ5dCYJsLylfZrgBh6KkG4bOLckB35Tr9J/EqdkEM6QllH5PxqP1dhTvFup+HtMRPuz9xOjxXJggxw==",
+      "license": "OFL-1.1",
+      "funding": {
+        "url": "https://github.com/sponsors/ayuhito"
+      }
+    },
     "node_modules/@google/genai": {
       "version": "1.39.0",
       "resolved": "https://registry.npmjs.org/@google/genai/-/genai-1.39.0.tgz",
@@ -769,6 +1207,171 @@
         }
       }
     },
+    "node_modules/@hono/node-server": {
+      "version": "1.19.11",
+      "resolved": "https://registry.npmjs.org/@hono/node-server/-/node-server-1.19.11.tgz",
+      "integrity": "sha512-dr8/3zEaB+p0D2n/IUrlPF1HZm586qgJNXK1a9fhg/PzdtkK7Ksd5l312tJX2yBuALqDYBlG20QEbayqPyxn+g==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=18.14.1"
+      },
+      "peerDependencies": {
+        "hono": "^4"
+      }
+    },
+    "node_modules/@inquirer/ansi": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/@inquirer/ansi/-/ansi-1.0.2.tgz",
+      "integrity": "sha512-S8qNSZiYzFd0wAcyG5AXCvUHC5Sr7xpZ9wZ2py9XR88jUz8wooStVx5M6dRzczbBWjic9NP7+rY0Xi7qqK/aMQ==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@inquirer/confirm": {
+      "version": "5.1.21",
+      "resolved": "https://registry.npmjs.org/@inquirer/confirm/-/confirm-5.1.21.tgz",
+      "integrity": "sha512-KR8edRkIsUayMXV+o3Gv+q4jlhENF9nMYUZs9PA2HzrXeHI8M5uDag70U7RJn9yyiMZSbtF5/UexBtAVtZGSbQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@inquirer/core": "^10.3.2",
+        "@inquirer/type": "^3.0.10"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "peerDependencies": {
+        "@types/node": ">=18"
+      },
+      "peerDependenciesMeta": {
+        "@types/node": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@inquirer/core": {
+      "version": "10.3.2",
+      "resolved": "https://registry.npmjs.org/@inquirer/core/-/core-10.3.2.tgz",
+      "integrity": "sha512-43RTuEbfP8MbKzedNqBrlhhNKVwoK//vUFNW3Q3vZ88BLcrs4kYpGg+B2mm5p2K/HfygoCxuKwJJiv8PbGmE0A==",
+      "license": "MIT",
+      "dependencies": {
+        "@inquirer/ansi": "^1.0.2",
+        "@inquirer/figures": "^1.0.15",
+        "@inquirer/type": "^3.0.10",
+        "cli-width": "^4.1.0",
+        "mute-stream": "^2.0.0",
+        "signal-exit": "^4.1.0",
+        "wrap-ansi": "^6.2.0",
+        "yoctocolors-cjs": "^2.1.3"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "peerDependencies": {
+        "@types/node": ">=18"
+      },
+      "peerDependenciesMeta": {
+        "@types/node": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@inquirer/core/node_modules/ansi-regex": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-5.0.1.tgz",
+      "integrity": "sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/@inquirer/core/node_modules/ansi-styles": {
+      "version": "4.3.0",
+      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
+      "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
+      "license": "MIT",
+      "dependencies": {
+        "color-convert": "^2.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/ansi-styles?sponsor=1"
+      }
+    },
+    "node_modules/@inquirer/core/node_modules/emoji-regex": {
+      "version": "8.0.0",
+      "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-8.0.0.tgz",
+      "integrity": "sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==",
+      "license": "MIT"
+    },
+    "node_modules/@inquirer/core/node_modules/string-width": {
+      "version": "4.2.3",
+      "resolved": "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz",
+      "integrity": "sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==",
+      "license": "MIT",
+      "dependencies": {
+        "emoji-regex": "^8.0.0",
+        "is-fullwidth-code-point": "^3.0.0",
+        "strip-ansi": "^6.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/@inquirer/core/node_modules/strip-ansi": {
+      "version": "6.0.1",
+      "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz",
+      "integrity": "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==",
+      "license": "MIT",
+      "dependencies": {
+        "ansi-regex": "^5.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/@inquirer/core/node_modules/wrap-ansi": {
+      "version": "6.2.0",
+      "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-6.2.0.tgz",
+      "integrity": "sha512-r6lPcBGxZXlIcymEu7InxDMhdW0KDxpLgoFLcguasxCaJ/SOIZwINatK9KY/tf+ZrlywOKU0UDj3ATXUBfxJXA==",
+      "license": "MIT",
+      "dependencies": {
+        "ansi-styles": "^4.0.0",
+        "string-width": "^4.1.0",
+        "strip-ansi": "^6.0.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/@inquirer/figures": {
+      "version": "1.0.15",
+      "resolved": "https://registry.npmjs.org/@inquirer/figures/-/figures-1.0.15.tgz",
+      "integrity": "sha512-t2IEY+unGHOzAaVM5Xx6DEWKeXlDDcNPeDyUpsRc6CUhBfU3VQOEl+Vssh7VNp1dR8MdUJBWhuObjXCsVpjN5g==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@inquirer/type": {
+      "version": "3.0.10",
+      "resolved": "https://registry.npmjs.org/@inquirer/type/-/type-3.0.10.tgz",
+      "integrity": "sha512-BvziSRxfz5Ov8ch0z/n3oijRSEcEsHnhggm4xFZe93DHcUCTlutlq9Ox4SVENAfcRD22UQq7T/atg9Wr3k09eA==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      },
+      "peerDependencies": {
+        "@types/node": ">=18"
+      },
+      "peerDependenciesMeta": {
+        "@types/node": {
+          "optional": true
+        }
+      }
+    },
     "node_modules/@isaacs/cliui": {
       "version": "8.0.2",
       "resolved": "https://registry.npmjs.org/@isaacs/cliui/-/cliui-8.0.2.tgz",
@@ -790,7 +1393,6 @@
       "version": "0.3.13",
       "resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.3.13.tgz",
       "integrity": "sha512-2kkt/7niJ6MgEPxF0bYdQ6etZaA+fQvDcLKckhy1yIQOzaoKjBBjSj63/aLVjYE3qhRt5dvM+uUyfCg6UKCBbA==",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "@jridgewell/sourcemap-codec": "^1.5.0",
@@ -801,7 +1403,6 @@
       "version": "2.3.5",
       "resolved": "https://registry.npmjs.org/@jridgewell/remapping/-/remapping-2.3.5.tgz",
       "integrity": "sha512-LI9u/+laYG4Ds1TDKSJW2YPrIlcVYOwi2fUC6xB43lueCjgxV4lffOCZCtYFiH6TNOX+tQKXx97T4IKHbhyHEQ==",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "@jridgewell/gen-mapping": "^0.3.5",
@@ -812,7 +1413,6 @@
       "version": "3.1.2",
       "resolved": "https://registry.npmjs.org/@jridgewell/resolve-uri/-/resolve-uri-3.1.2.tgz",
       "integrity": "sha512-bRISgCIjP20/tbWSPWMEi54QVPRZExkuD9lJL+UIxUKtwVJA8wW1Trb1jMs1RFXo1CBTNZ/5hpC9QvmKWdopKw==",
-      "dev": true,
       "license": "MIT",
       "engines": {
         "node": ">=6.0.0"
@@ -822,20 +1422,171 @@
       "version": "1.5.5",
       "resolved": "https://registry.npmjs.org/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.5.5.tgz",
       "integrity": "sha512-cYQ9310grqxueWbl+WuIUIaiUaDcj7WOq5fVhEljNVgRfOUhY9fy2zTvfoqWsnebh8Sl70VScFbICvJnLKB0Og==",
-      "dev": true,
       "license": "MIT"
     },
     "node_modules/@jridgewell/trace-mapping": {
       "version": "0.3.31",
       "resolved": "https://registry.npmjs.org/@jridgewell/trace-mapping/-/trace-mapping-0.3.31.tgz",
       "integrity": "sha512-zzNR+SdQSDJzc8joaeP8QQoCQr8NuYx2dIIytl1QeBEZHJ9uW6hebsrYgbz8hJwUQao3TWCMtmfV8Nu1twOLAw==",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "@jridgewell/resolve-uri": "^3.1.0",
         "@jridgewell/sourcemap-codec": "^1.4.14"
       }
     },
+    "node_modules/@modelcontextprotocol/sdk": {
+      "version": "1.27.1",
+      "resolved": "https://registry.npmjs.org/@modelcontextprotocol/sdk/-/sdk-1.27.1.tgz",
+      "integrity": "sha512-sr6GbP+4edBwFndLbM60gf07z0FQ79gaExpnsjMGePXqFcSSb7t6iscpjk9DhFhwd+mTEQrzNafGP8/iGGFYaA==",
+      "license": "MIT",
+      "dependencies": {
+        "@hono/node-server": "^1.19.9",
+        "ajv": "^8.17.1",
+        "ajv-formats": "^3.0.1",
+        "content-type": "^1.0.5",
+        "cors": "^2.8.5",
+        "cross-spawn": "^7.0.5",
+        "eventsource": "^3.0.2",
+        "eventsource-parser": "^3.0.0",
+        "express": "^5.2.1",
+        "express-rate-limit": "^8.2.1",
+        "hono": "^4.11.4",
+        "jose": "^6.1.3",
+        "json-schema-typed": "^8.0.2",
+        "pkce-challenge": "^5.0.0",
+        "raw-body": "^3.0.0",
+        "zod": "^3.25 || ^4.0",
+        "zod-to-json-schema": "^3.25.1"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "peerDependencies": {
+        "@cfworker/json-schema": "^4.1.1",
+        "zod": "^3.25 || ^4.0"
+      },
+      "peerDependenciesMeta": {
+        "@cfworker/json-schema": {
+          "optional": true
+        },
+        "zod": {
+          "optional": false
+        }
+      }
+    },
+    "node_modules/@mswjs/interceptors": {
+      "version": "0.41.3",
+      "resolved": "https://registry.npmjs.org/@mswjs/interceptors/-/interceptors-0.41.3.tgz",
+      "integrity": "sha512-cXu86tF4VQVfwz8W1SPbhoRyHJkti6mjH/XJIxp40jhO4j2k1m4KYrEykxqWPkFF3vrK4rgQppBh//AwyGSXPA==",
+      "license": "MIT",
+      "dependencies": {
+        "@open-draft/deferred-promise": "^2.2.0",
+        "@open-draft/logger": "^0.3.0",
+        "@open-draft/until": "^2.0.0",
+        "is-node-process": "^1.2.0",
+        "outvariant": "^1.4.3",
+        "strict-event-emitter": "^0.5.1"
+      },
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@noble/ciphers": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/@noble/ciphers/-/ciphers-1.3.0.tgz",
+      "integrity": "sha512-2I0gnIVPtfnMw9ee9h1dJG7tp81+8Ob3OJb3Mv37rx5L40/b0i7djjCVvGOVqc9AEIQyvyu1i6ypKdFw8R8gQw==",
+      "license": "MIT",
+      "engines": {
+        "node": "^14.21.3 || >=16"
+      },
+      "funding": {
+        "url": "https://paulmillr.com/funding/"
+      }
+    },
+    "node_modules/@noble/curves": {
+      "version": "1.9.7",
+      "resolved": "https://registry.npmjs.org/@noble/curves/-/curves-1.9.7.tgz",
+      "integrity": "sha512-gbKGcRUYIjA3/zCCNaWDciTMFI0dCkvou3TL8Zmy5Nc7sJ47a0jtOeZoTaMxkuqRo9cRhjOdZJXegxYE5FN/xw==",
+      "license": "MIT",
+      "dependencies": {
+        "@noble/hashes": "1.8.0"
+      },
+      "engines": {
+        "node": "^14.21.3 || >=16"
+      },
+      "funding": {
+        "url": "https://paulmillr.com/funding/"
+      }
+    },
+    "node_modules/@noble/hashes": {
+      "version": "1.8.0",
+      "resolved": "https://registry.npmjs.org/@noble/hashes/-/hashes-1.8.0.tgz",
+      "integrity": "sha512-jCs9ldd7NwzpgXDIf6P3+NrHh9/sD6CQdxHyjQI+h/6rDNo88ypBxxz45UDuZHz9r3tNz7N/VInSVoVdtXEI4A==",
+      "license": "MIT",
+      "engines": {
+        "node": "^14.21.3 || >=16"
+      },
+      "funding": {
+        "url": "https://paulmillr.com/funding/"
+      }
+    },
+    "node_modules/@nodelib/fs.scandir": {
+      "version": "2.1.5",
+      "resolved": "https://registry.npmjs.org/@nodelib/fs.scandir/-/fs.scandir-2.1.5.tgz",
+      "integrity": "sha512-vq24Bq3ym5HEQm2NKCr3yXDwjc7vTsEThRDnkp2DK9p1uqLR+DHurm/NOTo0KG7HYHU7eppKZj3MyqYuMBf62g==",
+      "license": "MIT",
+      "dependencies": {
+        "@nodelib/fs.stat": "2.0.5",
+        "run-parallel": "^1.1.9"
+      },
+      "engines": {
+        "node": ">= 8"
+      }
+    },
+    "node_modules/@nodelib/fs.stat": {
+      "version": "2.0.5",
+      "resolved": "https://registry.npmjs.org/@nodelib/fs.stat/-/fs.stat-2.0.5.tgz",
+      "integrity": "sha512-RkhPPp2zrqDAQA/2jNhnztcPAlv64XdhIp7a7454A5ovI7Bukxgt7MX7udwAu3zg1DcpPU0rz3VV1SeaqvY4+A==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 8"
+      }
+    },
+    "node_modules/@nodelib/fs.walk": {
+      "version": "1.2.8",
+      "resolved": "https://registry.npmjs.org/@nodelib/fs.walk/-/fs.walk-1.2.8.tgz",
+      "integrity": "sha512-oGB+UxlgWcgQkgwo8GcEGwemoTFt3FIO9ababBmaGwXIoBKZ+GTy0pP185beGg7Llih/NSHSV2XAs1lnznocSg==",
+      "license": "MIT",
+      "dependencies": {
+        "@nodelib/fs.scandir": "2.1.5",
+        "fastq": "^1.6.0"
+      },
+      "engines": {
+        "node": ">= 8"
+      }
+    },
+    "node_modules/@open-draft/deferred-promise": {
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/@open-draft/deferred-promise/-/deferred-promise-2.2.0.tgz",
+      "integrity": "sha512-CecwLWx3rhxVQF6V4bAgPS5t+So2sTbPgAzafKkVizyi7tlwpcFpdFqq+wqF2OwNBmqFuu6tOyouTuxgpMfzmA==",
+      "license": "MIT"
+    },
+    "node_modules/@open-draft/logger": {
+      "version": "0.3.0",
+      "resolved": "https://registry.npmjs.org/@open-draft/logger/-/logger-0.3.0.tgz",
+      "integrity": "sha512-X2g45fzhxH238HKO4xbSr7+wBS8Fvw6ixhTDuvLd5mqh6bJJCFAPwU9mPDxbcrRtfxv4u5IHCEH77BmxvXmmxQ==",
+      "license": "MIT",
+      "dependencies": {
+        "is-node-process": "^1.2.0",
+        "outvariant": "^1.4.0"
+      }
+    },
+    "node_modules/@open-draft/until": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/@open-draft/until/-/until-2.1.0.tgz",
+      "integrity": "sha512-U69T3ItWHvLwGg5eJ0n3I62nWuE6ilHlmz7zM0npLBRvPRd7e6NYmg54vvRtP5mZG7kZqZCFVdsTWo7BPtBujg==",
+      "license": "MIT"
+    },
     "node_modules/@pkgjs/parseargs": {
       "version": "0.11.0",
       "resolved": "https://registry.npmjs.org/@pkgjs/parseargs/-/parseargs-0.11.0.tgz",
@@ -924,7 +1675,6 @@
       "cpu": [
         "arm"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -938,7 +1688,6 @@
       "cpu": [
         "arm64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -952,7 +1701,6 @@
       "cpu": [
         "arm64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -966,7 +1714,6 @@
       "cpu": [
         "x64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -980,7 +1727,6 @@
       "cpu": [
         "arm64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -994,7 +1740,6 @@
       "cpu": [
         "x64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -1008,7 +1753,6 @@
       "cpu": [
         "arm"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -1022,7 +1766,6 @@
       "cpu": [
         "arm"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -1036,7 +1779,6 @@
       "cpu": [
         "arm64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -1050,7 +1792,6 @@
       "cpu": [
         "arm64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -1064,7 +1805,6 @@
       "cpu": [
         "loong64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -1078,7 +1818,6 @@
       "cpu": [
         "loong64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -1092,7 +1831,6 @@
       "cpu": [
         "ppc64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -1106,7 +1844,6 @@
       "cpu": [
         "ppc64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -1120,7 +1857,6 @@
       "cpu": [
         "riscv64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -1134,7 +1870,6 @@
       "cpu": [
         "riscv64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -1148,7 +1883,6 @@
       "cpu": [
         "s390x"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -1162,7 +1896,6 @@
       "cpu": [
         "x64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -1176,7 +1909,6 @@
       "cpu": [
         "x64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -1190,7 +1922,6 @@
       "cpu": [
         "x64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -1204,7 +1935,6 @@
       "cpu": [
         "arm64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -1218,7 +1948,6 @@
       "cpu": [
         "arm64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -1232,7 +1961,6 @@
       "cpu": [
         "ia32"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -1246,7 +1974,6 @@
       "cpu": [
         "x64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -1260,13 +1987,287 @@
       "cpu": [
         "x64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
         "win32"
       ]
     },
+    "node_modules/@sec-ant/readable-stream": {
+      "version": "0.4.1",
+      "resolved": "https://registry.npmjs.org/@sec-ant/readable-stream/-/readable-stream-0.4.1.tgz",
+      "integrity": "sha512-831qok9r2t8AlxLko40y2ebgSDhenenCatLVeW/uBtnHPyhHOvG0C7TvfgecV+wHzIm5KUICgzmVpWS+IMEAeg==",
+      "license": "MIT"
+    },
+    "node_modules/@sindresorhus/merge-streams": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/@sindresorhus/merge-streams/-/merge-streams-4.0.0.tgz",
+      "integrity": "sha512-tlqY9xq5ukxTUZBmoOp+m61cqwQD5pHJtFY3Mn8CA8ps6yghLH/Hw8UPdqg4OLmFW3IFlcXnQNmo/dh8HzXYIQ==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/@tailwindcss/node": {
+      "version": "4.2.1",
+      "resolved": "https://registry.npmjs.org/@tailwindcss/node/-/node-4.2.1.tgz",
+      "integrity": "sha512-jlx6sLk4EOwO6hHe1oCGm1Q4AN/s0rSrTTPBGPM0/RQ6Uylwq17FuU8IeJJKEjtc6K6O07zsvP+gDO6MMWo7pg==",
+      "license": "MIT",
+      "dependencies": {
+        "@jridgewell/remapping": "^2.3.5",
+        "enhanced-resolve": "^5.19.0",
+        "jiti": "^2.6.1",
+        "lightningcss": "1.31.1",
+        "magic-string": "^0.30.21",
+        "source-map-js": "^1.2.1",
+        "tailwindcss": "4.2.1"
+      }
+    },
+    "node_modules/@tailwindcss/oxide": {
+      "version": "4.2.1",
+      "resolved": "https://registry.npmjs.org/@tailwindcss/oxide/-/oxide-4.2.1.tgz",
+      "integrity": "sha512-yv9jeEFWnjKCI6/T3Oq50yQEOqmpmpfzG1hcZsAOaXFQPfzWprWrlHSdGPEF3WQTi8zu8ohC9Mh9J470nT5pUw==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 20"
+      },
+      "optionalDependencies": {
+        "@tailwindcss/oxide-android-arm64": "4.2.1",
+        "@tailwindcss/oxide-darwin-arm64": "4.2.1",
+        "@tailwindcss/oxide-darwin-x64": "4.2.1",
+        "@tailwindcss/oxide-freebsd-x64": "4.2.1",
+        "@tailwindcss/oxide-linux-arm-gnueabihf": "4.2.1",
+        "@tailwindcss/oxide-linux-arm64-gnu": "4.2.1",
+        "@tailwindcss/oxide-linux-arm64-musl": "4.2.1",
+        "@tailwindcss/oxide-linux-x64-gnu": "4.2.1",
+        "@tailwindcss/oxide-linux-x64-musl": "4.2.1",
+        "@tailwindcss/oxide-wasm32-wasi": "4.2.1",
+        "@tailwindcss/oxide-win32-arm64-msvc": "4.2.1",
+        "@tailwindcss/oxide-win32-x64-msvc": "4.2.1"
+      }
+    },
+    "node_modules/@tailwindcss/oxide-android-arm64": {
+      "version": "4.2.1",
+      "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-android-arm64/-/oxide-android-arm64-4.2.1.tgz",
+      "integrity": "sha512-eZ7G1Zm5EC8OOKaesIKuw77jw++QJ2lL9N+dDpdQiAB/c/B2wDh0QPFHbkBVrXnwNugvrbJFk1gK2SsVjwWReg==",
+      "cpu": [
+        "arm64"
+      ],
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "android"
+      ],
+      "engines": {
+        "node": ">= 20"
+      }
+    },
+    "node_modules/@tailwindcss/oxide-darwin-arm64": {
+      "version": "4.2.1",
+      "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-darwin-arm64/-/oxide-darwin-arm64-4.2.1.tgz",
+      "integrity": "sha512-q/LHkOstoJ7pI1J0q6djesLzRvQSIfEto148ppAd+BVQK0JYjQIFSK3JgYZJa+Yzi0DDa52ZsQx2rqytBnf8Hw==",
+      "cpu": [
+        "arm64"
+      ],
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": ">= 20"
+      }
+    },
+    "node_modules/@tailwindcss/oxide-darwin-x64": {
+      "version": "4.2.1",
+      "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-darwin-x64/-/oxide-darwin-x64-4.2.1.tgz",
+      "integrity": "sha512-/f/ozlaXGY6QLbpvd/kFTro2l18f7dHKpB+ieXz+Cijl4Mt9AI2rTrpq7V+t04nK+j9XBQHnSMdeQRhbGyt6fw==",
+      "cpu": [
+        "x64"
+      ],
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": ">= 20"
+      }
+    },
+    "node_modules/@tailwindcss/oxide-freebsd-x64": {
+      "version": "4.2.1",
+      "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-freebsd-x64/-/oxide-freebsd-x64-4.2.1.tgz",
+      "integrity": "sha512-5e/AkgYJT/cpbkys/OU2Ei2jdETCLlifwm7ogMC7/hksI2fC3iiq6OcXwjibcIjPung0kRtR3TxEITkqgn0TcA==",
+      "cpu": [
+        "x64"
+      ],
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "freebsd"
+      ],
+      "engines": {
+        "node": ">= 20"
+      }
+    },
+    "node_modules/@tailwindcss/oxide-linux-arm-gnueabihf": {
+      "version": "4.2.1",
+      "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-linux-arm-gnueabihf/-/oxide-linux-arm-gnueabihf-4.2.1.tgz",
+      "integrity": "sha512-Uny1EcVTTmerCKt/1ZuKTkb0x8ZaiuYucg2/kImO5A5Y/kBz41/+j0gxUZl+hTF3xkWpDmHX+TaWhOtba2Fyuw==",
+      "cpu": [
+        "arm"
+      ],
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">= 20"
+      }
+    },
+    "node_modules/@tailwindcss/oxide-linux-arm64-gnu": {
+      "version": "4.2.1",
+      "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-linux-arm64-gnu/-/oxide-linux-arm64-gnu-4.2.1.tgz",
+      "integrity": "sha512-CTrwomI+c7n6aSSQlsPL0roRiNMDQ/YzMD9EjcR+H4f0I1SQ8QqIuPnsVp7QgMkC1Qi8rtkekLkOFjo7OlEFRQ==",
+      "cpu": [
+        "arm64"
+      ],
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">= 20"
+      }
+    },
+    "node_modules/@tailwindcss/oxide-linux-arm64-musl": {
+      "version": "4.2.1",
+      "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-linux-arm64-musl/-/oxide-linux-arm64-musl-4.2.1.tgz",
+      "integrity": "sha512-WZA0CHRL/SP1TRbA5mp9htsppSEkWuQ4KsSUumYQnyl8ZdT39ntwqmz4IUHGN6p4XdSlYfJwM4rRzZLShHsGAQ==",
+      "cpu": [
+        "arm64"
+      ],
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">= 20"
+      }
+    },
+    "node_modules/@tailwindcss/oxide-linux-x64-gnu": {
+      "version": "4.2.1",
+      "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-linux-x64-gnu/-/oxide-linux-x64-gnu-4.2.1.tgz",
+      "integrity": "sha512-qMFzxI2YlBOLW5PhblzuSWlWfwLHaneBE0xHzLrBgNtqN6mWfs+qYbhryGSXQjFYB1Dzf5w+LN5qbUTPhW7Y5g==",
+      "cpu": [
+        "x64"
+      ],
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">= 20"
+      }
+    },
+    "node_modules/@tailwindcss/oxide-linux-x64-musl": {
+      "version": "4.2.1",
+      "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-linux-x64-musl/-/oxide-linux-x64-musl-4.2.1.tgz",
+      "integrity": "sha512-5r1X2FKnCMUPlXTWRYpHdPYUY6a1Ar/t7P24OuiEdEOmms5lyqjDRvVY1yy9Rmioh+AunQ0rWiOTPE8F9A3v5g==",
+      "cpu": [
+        "x64"
+      ],
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">= 20"
+      }
+    },
+    "node_modules/@tailwindcss/oxide-wasm32-wasi": {
+      "version": "4.2.1",
+      "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-wasm32-wasi/-/oxide-wasm32-wasi-4.2.1.tgz",
+      "integrity": "sha512-MGFB5cVPvshR85MTJkEvqDUnuNoysrsRxd6vnk1Lf2tbiqNlXpHYZqkqOQalydienEWOHHFyyuTSYRsLfxFJ2Q==",
+      "bundleDependencies": [
+        "@napi-rs/wasm-runtime",
+        "@emnapi/core",
+        "@emnapi/runtime",
+        "@tybys/wasm-util",
+        "@emnapi/wasi-threads",
+        "tslib"
+      ],
+      "cpu": [
+        "wasm32"
+      ],
+      "license": "MIT",
+      "optional": true,
+      "dependencies": {
+        "@emnapi/core": "^1.8.1",
+        "@emnapi/runtime": "^1.8.1",
+        "@emnapi/wasi-threads": "^1.1.0",
+        "@napi-rs/wasm-runtime": "^1.1.1",
+        "@tybys/wasm-util": "^0.10.1",
+        "tslib": "^2.8.1"
+      },
+      "engines": {
+        "node": ">=14.0.0"
+      }
+    },
+    "node_modules/@tailwindcss/oxide-win32-arm64-msvc": {
+      "version": "4.2.1",
+      "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-win32-arm64-msvc/-/oxide-win32-arm64-msvc-4.2.1.tgz",
+      "integrity": "sha512-YlUEHRHBGnCMh4Nj4GnqQyBtsshUPdiNroZj8VPkvTZSoHsilRCwXcVKnG9kyi0ZFAS/3u+qKHBdDc81SADTRA==",
+      "cpu": [
+        "arm64"
+      ],
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": ">= 20"
+      }
+    },
+    "node_modules/@tailwindcss/oxide-win32-x64-msvc": {
+      "version": "4.2.1",
+      "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-win32-x64-msvc/-/oxide-win32-x64-msvc-4.2.1.tgz",
+      "integrity": "sha512-rbO34G5sMWWyrN/idLeVxAZgAKWrn5LiR3/I90Q9MkA67s6T1oB0xtTe+0heoBvHSpbU9Mk7i6uwJnpo4u21XQ==",
+      "cpu": [
+        "x64"
+      ],
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": ">= 20"
+      }
+    },
+    "node_modules/@tailwindcss/vite": {
+      "version": "4.2.1",
+      "resolved": "https://registry.npmjs.org/@tailwindcss/vite/-/vite-4.2.1.tgz",
+      "integrity": "sha512-TBf2sJjYeb28jD2U/OhwdW0bbOsxkWPwQ7SrqGf9sVcoYwZj7rkXljroBO9wKBut9XnmQLXanuDUeqQK0lGg/w==",
+      "license": "MIT",
+      "dependencies": {
+        "@tailwindcss/node": "4.2.1",
+        "@tailwindcss/oxide": "4.2.1",
+        "tailwindcss": "4.2.1"
+      },
+      "peerDependencies": {
+        "vite": "^5.2.0 || ^6 || ^7"
+      }
+    },
     "node_modules/@tanstack/query-core": {
       "version": "5.90.20",
       "resolved": "https://registry.npmjs.org/@tanstack/query-core/-/query-core-5.90.20.tgz",
@@ -1293,6 +2294,53 @@
         "react": "^18 || ^19"
       }
     },
+    "node_modules/@ts-morph/common": {
+      "version": "0.27.0",
+      "resolved": "https://registry.npmjs.org/@ts-morph/common/-/common-0.27.0.tgz",
+      "integrity": "sha512-Wf29UqxWDpc+i61k3oIOzcUfQt79PIT9y/MWfAGlrkjg6lBC1hwDECLXPVJAhWjiGbfBCxZd65F/LIZF3+jeJQ==",
+      "license": "MIT",
+      "dependencies": {
+        "fast-glob": "^3.3.3",
+        "minimatch": "^10.0.1",
+        "path-browserify": "^1.0.1"
+      }
+    },
+    "node_modules/@ts-morph/common/node_modules/balanced-match": {
+      "version": "4.0.4",
+      "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-4.0.4.tgz",
+      "integrity": "sha512-BLrgEcRTwX2o6gGxGOCNyMvGSp35YofuYzw9h1IMTRmKqttAZZVU67bdb9Pr2vUHA8+j3i2tJfjO6C6+4myGTA==",
+      "license": "MIT",
+      "engines": {
+        "node": "18 || 20 || >=22"
+      }
+    },
+    "node_modules/@ts-morph/common/node_modules/brace-expansion": {
+      "version": "5.0.4",
+      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-5.0.4.tgz",
+      "integrity": "sha512-h+DEnpVvxmfVefa4jFbCf5HdH5YMDXRsmKflpf1pILZWRFlTbJpxeU55nJl4Smt5HQaGzg1o6RHFPJaOqnmBDg==",
+      "license": "MIT",
+      "dependencies": {
+        "balanced-match": "^4.0.2"
+      },
+      "engines": {
+        "node": "18 || 20 || >=22"
+      }
+    },
+    "node_modules/@ts-morph/common/node_modules/minimatch": {
+      "version": "10.2.4",
+      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-10.2.4.tgz",
+      "integrity": "sha512-oRjTw/97aTBN0RHbYCdtF1MQfvusSIBQM0IZEgzl6426+8jSC0nF1a/GmnVLpfB9yyr6g6FTqWqiZVbxrtaCIg==",
+      "license": "BlueOak-1.0.0",
+      "dependencies": {
+        "brace-expansion": "^5.0.2"
+      },
+      "engines": {
+        "node": "18 || 20 || >=22"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/isaacs"
+      }
+    },
     "node_modules/@types/babel__core": {
       "version": "7.20.5",
       "resolved": "https://registry.npmjs.org/@types/babel__core/-/babel__core-7.20.5.tgz",
@@ -1342,7 +2390,6 @@
       "version": "1.0.8",
       "resolved": "https://registry.npmjs.org/@types/estree/-/estree-1.0.8.tgz",
       "integrity": "sha512-dWHzHa2WqEXI/O1E9OjrocMTKJl2mSrEolh1Iomrv6U+JuNwaHXsXx9bLu5gG7BUWFIN0skIQJQ/L1rIex4X6w==",
-      "dev": true,
       "license": "MIT"
     },
     "node_modules/@types/node": {
@@ -1354,6 +2401,18 @@
         "undici-types": "~6.21.0"
       }
     },
+    "node_modules/@types/statuses": {
+      "version": "2.0.6",
+      "resolved": "https://registry.npmjs.org/@types/statuses/-/statuses-2.0.6.tgz",
+      "integrity": "sha512-xMAgYwceFhRA2zY+XbEA7mxYbA093wdiW8Vu6gZPGWy9cmOyU9XesH1tNcEWsKFd5Vzrqx5T3D38PWx1FIIXkA==",
+      "license": "MIT"
+    },
+    "node_modules/@types/validate-npm-package-name": {
+      "version": "4.0.2",
+      "resolved": "https://registry.npmjs.org/@types/validate-npm-package-name/-/validate-npm-package-name-4.0.2.tgz",
+      "integrity": "sha512-lrpDziQipxCEeK5kWxvljWYhUvOiB2A9izZd9B2AFarYAkqZshb4lPbRs7zKEic6eGtH8V/2qJW+dPp9OtF6bw==",
+      "license": "MIT"
+    },
     "node_modules/@vitejs/plugin-react": {
       "version": "5.1.2",
       "resolved": "https://registry.npmjs.org/@vitejs/plugin-react/-/plugin-react-5.1.2.tgz",
@@ -1375,6 +2434,19 @@
         "vite": "^4.2.0 || ^5.0.0 || ^6.0.0 || ^7.0.0"
       }
     },
+    "node_modules/accepts": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/accepts/-/accepts-2.0.0.tgz",
+      "integrity": "sha512-5cvg6CtKwfgdmVqY1WIiXKc3Q1bkRqGLi+2W/6ao+6Y7gu/RCwRuAhGEzh5B4KlszSuTLgZYuqFqo5bImjNKng==",
+      "license": "MIT",
+      "dependencies": {
+        "mime-types": "^3.0.0",
+        "negotiator": "^1.0.0"
+      },
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
     "node_modules/agent-base": {
       "version": "7.1.4",
       "resolved": "https://registry.npmjs.org/agent-base/-/agent-base-7.1.4.tgz",
@@ -1384,6 +2456,39 @@
         "node": ">= 14"
       }
     },
+    "node_modules/ajv": {
+      "version": "8.18.0",
+      "resolved": "https://registry.npmjs.org/ajv/-/ajv-8.18.0.tgz",
+      "integrity": "sha512-PlXPeEWMXMZ7sPYOHqmDyCJzcfNrUr3fGNKtezX14ykXOEIvyK81d+qydx89KY5O71FKMPaQ2vBfBFI5NHR63A==",
+      "license": "MIT",
+      "dependencies": {
+        "fast-deep-equal": "^3.1.3",
+        "fast-uri": "^3.0.1",
+        "json-schema-traverse": "^1.0.0",
+        "require-from-string": "^2.0.2"
+      },
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/epoberezkin"
+      }
+    },
+    "node_modules/ajv-formats": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/ajv-formats/-/ajv-formats-3.0.1.tgz",
+      "integrity": "sha512-8iUql50EUR+uUcdRQ3HDqa6EVyo3docL8g5WJ3FNcWmu62IbkGUue/pEyLBW8VGKKucTPgqeks4fIU1DA4yowQ==",
+      "license": "MIT",
+      "dependencies": {
+        "ajv": "^8.0.0"
+      },
+      "peerDependencies": {
+        "ajv": "^8.0.0"
+      },
+      "peerDependenciesMeta": {
+        "ajv": {
+          "optional": true
+        }
+      }
+    },
     "node_modules/ansi-regex": {
       "version": "6.2.2",
       "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-6.2.2.tgz",
@@ -1408,6 +2513,70 @@
         "url": "https://github.com/chalk/ansi-styles?sponsor=1"
       }
     },
+    "node_modules/ansis": {
+      "version": "4.2.0",
+      "resolved": "https://registry.npmjs.org/ansis/-/ansis-4.2.0.tgz",
+      "integrity": "sha512-HqZ5rWlFjGiV0tDm3UxxgNRqsOTniqoKZu0pIAfh7TZQMGuZK+hH0drySty0si0QXj1ieop4+SkSfPZBPPkHig==",
+      "license": "ISC",
+      "engines": {
+        "node": ">=14"
+      }
+    },
+    "node_modules/argparse": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/argparse/-/argparse-2.0.1.tgz",
+      "integrity": "sha512-8+9WqebbFzpX9OR+Wa6O29asIogeRMzcGtAINdpMHHyAg10f05aSFVBbcEqGf/PXw1EjAZ+q2/bEBg3DvurK3Q==",
+      "license": "Python-2.0"
+    },
+    "node_modules/ast-types": {
+      "version": "0.16.1",
+      "resolved": "https://registry.npmjs.org/ast-types/-/ast-types-0.16.1.tgz",
+      "integrity": "sha512-6t10qk83GOG8p0vKmaCr8eiilZwO171AvbROMtvvNiwrTly62t+7XkA8RdIIVbpMhCASAsxgAzdRSwh6nw/5Dg==",
+      "license": "MIT",
+      "dependencies": {
+        "tslib": "^2.0.1"
+      },
+      "engines": {
+        "node": ">=4"
+      }
+    },
+    "node_modules/autoprefixer": {
+      "version": "10.4.27",
+      "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-10.4.27.tgz",
+      "integrity": "sha512-NP9APE+tO+LuJGn7/9+cohklunJsXWiaWEfV3si4Gi/XHDwVNgkwr1J3RQYFIvPy76GmJ9/bW8vyoU1LcxwKHA==",
+      "dev": true,
+      "funding": [
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/postcss/"
+        },
+        {
+          "type": "tidelift",
+          "url": "https://tidelift.com/funding/github/npm/autoprefixer"
+        },
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/ai"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "browserslist": "^4.28.1",
+        "caniuse-lite": "^1.0.30001774",
+        "fraction.js": "^5.3.4",
+        "picocolors": "^1.1.1",
+        "postcss-value-parser": "^4.2.0"
+      },
+      "bin": {
+        "autoprefixer": "bin/autoprefixer"
+      },
+      "engines": {
+        "node": "^10 || ^12 || >=14"
+      },
+      "peerDependencies": {
+        "postcss": "^8.1.0"
+      }
+    },
     "node_modules/balanced-match": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz",
@@ -1438,7 +2607,6 @@
       "version": "2.9.19",
       "resolved": "https://registry.npmjs.org/baseline-browser-mapping/-/baseline-browser-mapping-2.9.19.tgz",
       "integrity": "sha512-ipDqC8FrAl/76p2SSWKSI+H9tFwm7vYqXQrItCuiVPt26Km0jS+NzSsBWAaBusvSbQcfJG+JitdMm+wZAgTYqg==",
-      "dev": true,
       "license": "Apache-2.0",
       "bin": {
         "baseline-browser-mapping": "dist/cli.js"
@@ -1453,6 +2621,30 @@
         "node": "*"
       }
     },
+    "node_modules/body-parser": {
+      "version": "2.2.2",
+      "resolved": "https://registry.npmjs.org/body-parser/-/body-parser-2.2.2.tgz",
+      "integrity": "sha512-oP5VkATKlNwcgvxi0vM0p/D3n2C3EReYVX+DNYs5TjZFn/oQt2j+4sVJtSMr18pdRr8wjTcBl6LoV+FUwzPmNA==",
+      "license": "MIT",
+      "dependencies": {
+        "bytes": "^3.1.2",
+        "content-type": "^1.0.5",
+        "debug": "^4.4.3",
+        "http-errors": "^2.0.0",
+        "iconv-lite": "^0.7.0",
+        "on-finished": "^2.4.1",
+        "qs": "^6.14.1",
+        "raw-body": "^3.0.1",
+        "type-is": "^2.0.1"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/express"
+      }
+    },
     "node_modules/brace-expansion": {
       "version": "2.0.2",
       "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.2.tgz",
@@ -1462,11 +2654,22 @@
         "balanced-match": "^1.0.0"
       }
     },
+    "node_modules/braces": {
+      "version": "3.0.3",
+      "resolved": "https://registry.npmjs.org/braces/-/braces-3.0.3.tgz",
+      "integrity": "sha512-yQbXgO/OSZVD2IsiLlro+7Hf6Q18EJrKSEsdoMzKePKXct3gvD8oLcOQdIzGupr5Fj+EDe8gO/lxc1BzfMpxvA==",
+      "license": "MIT",
+      "dependencies": {
+        "fill-range": "^7.1.1"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
     "node_modules/browserslist": {
       "version": "4.28.1",
       "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.28.1.tgz",
       "integrity": "sha512-ZC5Bd0LgJXgwGqUknZY/vkUQ04r8NXnJZ3yYi4vDmSiZmC/pdSN0NbNRPxZpbtO4uAfDUAFffO8IZoM3Gj8IkA==",
-      "dev": true,
       "funding": [
         {
           "type": "opencollective",
@@ -1502,11 +2705,72 @@
       "integrity": "sha512-zRpUiDwd/xk6ADqPMATG8vc9VPrkck7T07OIx0gnjmJAnHnTVXNQG3vfvWNuiZIkwu9KrKdA1iJKfsfTVxE6NA==",
       "license": "BSD-3-Clause"
     },
+    "node_modules/bundle-name": {
+      "version": "4.1.0",
+      "resolved": "https://registry.npmjs.org/bundle-name/-/bundle-name-4.1.0.tgz",
+      "integrity": "sha512-tjwM5exMg6BGRI+kNmTntNsvdZS1X8BFYS6tnJ2hdH0kVxM6/eVZ2xy+FqStSWvYmtfFMDLIxurorHwDKfDz5Q==",
+      "license": "MIT",
+      "dependencies": {
+        "run-applescript": "^7.0.0"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/bytes": {
+      "version": "3.1.2",
+      "resolved": "https://registry.npmjs.org/bytes/-/bytes-3.1.2.tgz",
+      "integrity": "sha512-/Nf7TyzTx6S3yRJObOAV7956r8cr2+Oj8AC5dt8wSP3BQAoeX58NoHyCU8P8zGkNXStjTSi6fzO6F0pBdcYbEg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
+    "node_modules/call-bind-apply-helpers": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/call-bind-apply-helpers/-/call-bind-apply-helpers-1.0.2.tgz",
+      "integrity": "sha512-Sp1ablJ0ivDkSzjcaJdxEunN5/XvksFJ2sMBFfq6x0ryhQV/2b/KwFe21cMpmHtPOSij8K99/wSfoEuTObmuMQ==",
+      "license": "MIT",
+      "dependencies": {
+        "es-errors": "^1.3.0",
+        "function-bind": "^1.1.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/call-bound": {
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/call-bound/-/call-bound-1.0.4.tgz",
+      "integrity": "sha512-+ys997U96po4Kx/ABpBCqhA9EuxJaQWDQg7295H4hBphv3IZg0boBKuwYpt4YXp6MZ5AmZQnU/tyMTlRpaSejg==",
+      "license": "MIT",
+      "dependencies": {
+        "call-bind-apply-helpers": "^1.0.2",
+        "get-intrinsic": "^1.3.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/callsites": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/callsites/-/callsites-3.1.0.tgz",
+      "integrity": "sha512-P8BjAsXvZS+VIDUI11hHCQEv74YT67YUi5JJFNWIqL235sBmjX4+qx9Muvls5ivyNENctx46xQLQ3aTuE7ssaQ==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=6"
+      }
+    },
     "node_modules/caniuse-lite": {
-      "version": "1.0.30001766",
-      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001766.tgz",
-      "integrity": "sha512-4C0lfJ0/YPjJQHagaE9x2Elb69CIqEPZeG0anQt9SIvIoOH4a4uaRl73IavyO+0qZh6MDLH//DrXThEYKHkmYA==",
-      "dev": true,
+      "version": "1.0.30001777",
+      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001777.tgz",
+      "integrity": "sha512-tmN+fJxroPndC74efCdp12j+0rk0RHwV5Jwa1zWaFVyw2ZxAuPeG8ZgWC3Wz7uSjT3qMRQ5XHZ4COgQmsCMJAQ==",
       "funding": [
         {
           "type": "opencollective",
@@ -1523,6 +2787,168 @@
       ],
       "license": "CC-BY-4.0"
     },
+    "node_modules/chalk": {
+      "version": "5.6.2",
+      "resolved": "https://registry.npmjs.org/chalk/-/chalk-5.6.2.tgz",
+      "integrity": "sha512-7NzBL0rN6fMUW+f7A6Io4h40qQlG+xGmtMxfbnH/K7TAtt8JQWVQK+6g0UXKMeVJoyV5EkkNsErQ8pVD3bLHbA==",
+      "license": "MIT",
+      "engines": {
+        "node": "^12.17.0 || ^14.13 || >=16.0.0"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/chalk?sponsor=1"
+      }
+    },
+    "node_modules/class-variance-authority": {
+      "version": "0.7.1",
+      "resolved": "https://registry.npmjs.org/class-variance-authority/-/class-variance-authority-0.7.1.tgz",
+      "integrity": "sha512-Ka+9Trutv7G8M6WT6SeiRWz792K5qEqIGEGzXKhAE6xOWAY6pPH8U+9IY3oCMv6kqTmLsv7Xh/2w2RigkePMsg==",
+      "license": "Apache-2.0",
+      "dependencies": {
+        "clsx": "^2.1.1"
+      },
+      "funding": {
+        "url": "https://polar.sh/cva"
+      }
+    },
+    "node_modules/cli-cursor": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/cli-cursor/-/cli-cursor-5.0.0.tgz",
+      "integrity": "sha512-aCj4O5wKyszjMmDT4tZj93kxyydN/K5zPWSCe6/0AV/AA1pqe5ZBIw0a2ZfPQV7lL5/yb5HsUreJ6UFAF1tEQw==",
+      "license": "MIT",
+      "dependencies": {
+        "restore-cursor": "^5.0.0"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/cli-spinners": {
+      "version": "2.9.2",
+      "resolved": "https://registry.npmjs.org/cli-spinners/-/cli-spinners-2.9.2.tgz",
+      "integrity": "sha512-ywqV+5MmyL4E7ybXgKys4DugZbX0FC6LnwrhjuykIjnK9k8OQacQ7axGKnjDXWNhns0xot3bZI5h55H8yo9cJg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=6"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/cli-width": {
+      "version": "4.1.0",
+      "resolved": "https://registry.npmjs.org/cli-width/-/cli-width-4.1.0.tgz",
+      "integrity": "sha512-ouuZd4/dm2Sw5Gmqy6bGyNNNe1qt9RpmxveLSO7KcgsTnU7RXfsw+/bukWGo1abgBiMAic068rclZsO4IWmmxQ==",
+      "license": "ISC",
+      "engines": {
+        "node": ">= 12"
+      }
+    },
+    "node_modules/cliui": {
+      "version": "8.0.1",
+      "resolved": "https://registry.npmjs.org/cliui/-/cliui-8.0.1.tgz",
+      "integrity": "sha512-BSeNnyus75C4//NQ9gQt1/csTXyo/8Sb+afLAkzAptFuMsod9HFokGNudZpi/oQV73hnVK+sR+5PVRMd+Dr7YQ==",
+      "license": "ISC",
+      "dependencies": {
+        "string-width": "^4.2.0",
+        "strip-ansi": "^6.0.1",
+        "wrap-ansi": "^7.0.0"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/cliui/node_modules/ansi-regex": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-5.0.1.tgz",
+      "integrity": "sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/cliui/node_modules/ansi-styles": {
+      "version": "4.3.0",
+      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
+      "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
+      "license": "MIT",
+      "dependencies": {
+        "color-convert": "^2.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/ansi-styles?sponsor=1"
+      }
+    },
+    "node_modules/cliui/node_modules/emoji-regex": {
+      "version": "8.0.0",
+      "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-8.0.0.tgz",
+      "integrity": "sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==",
+      "license": "MIT"
+    },
+    "node_modules/cliui/node_modules/string-width": {
+      "version": "4.2.3",
+      "resolved": "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz",
+      "integrity": "sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==",
+      "license": "MIT",
+      "dependencies": {
+        "emoji-regex": "^8.0.0",
+        "is-fullwidth-code-point": "^3.0.0",
+        "strip-ansi": "^6.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/cliui/node_modules/strip-ansi": {
+      "version": "6.0.1",
+      "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz",
+      "integrity": "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==",
+      "license": "MIT",
+      "dependencies": {
+        "ansi-regex": "^5.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/cliui/node_modules/wrap-ansi": {
+      "version": "7.0.0",
+      "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-7.0.0.tgz",
+      "integrity": "sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q==",
+      "license": "MIT",
+      "dependencies": {
+        "ansi-styles": "^4.0.0",
+        "string-width": "^4.1.0",
+        "strip-ansi": "^6.0.0"
+      },
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/wrap-ansi?sponsor=1"
+      }
+    },
+    "node_modules/clsx": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/clsx/-/clsx-2.1.1.tgz",
+      "integrity": "sha512-eYm0QWBtUrBWZWG0d386OGAw16Z995PiOVo2B7bjWSbHedGl5e0ZWaq65kOGgUSNesEIDkB9ISbTg/JK9dhCZA==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=6"
+      }
+    },
+    "node_modules/code-block-writer": {
+      "version": "13.0.3",
+      "resolved": "https://registry.npmjs.org/code-block-writer/-/code-block-writer-13.0.3.tgz",
+      "integrity": "sha512-Oofo0pq3IKnsFtuHqSF7TqBfr71aeyZDVJ0HpmqB7FBM2qEigL0iPONSCZSO9pE9dZTAxANe5XHG9Uy0YMv8cg==",
+      "license": "MIT"
+    },
     "node_modules/color-convert": {
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
@@ -1541,11 +2967,41 @@
       "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==",
       "license": "MIT"
     },
+    "node_modules/commander": {
+      "version": "14.0.3",
+      "resolved": "https://registry.npmjs.org/commander/-/commander-14.0.3.tgz",
+      "integrity": "sha512-H+y0Jo/T1RZ9qPP4Eh1pkcQcLRglraJaSLoyOtHxu6AapkjWVCy2Sit1QQ4x3Dng8qDlSsZEet7g5Pq06MvTgw==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=20"
+      }
+    },
+    "node_modules/content-disposition": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/content-disposition/-/content-disposition-1.0.1.tgz",
+      "integrity": "sha512-oIXISMynqSqm241k6kcQ5UwttDILMK4BiurCfGEREw6+X9jkkpEe5T9FZaApyLGGOnFuyMWZpdolTXMtvEJ08Q==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/express"
+      }
+    },
+    "node_modules/content-type": {
+      "version": "1.0.5",
+      "resolved": "https://registry.npmjs.org/content-type/-/content-type-1.0.5.tgz",
+      "integrity": "sha512-nTjqfcBFEipKdXCv4YDQWCfmcLZKm81ldF0pAopTvyrFGVbcR6P/VAAd5G7N+0tTr8QqiU0tFadD6FK4NtJwOA==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
     "node_modules/convert-source-map": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-2.0.0.tgz",
       "integrity": "sha512-Kvp459HrV2FEJ1CAsi1Ku+MY3kasH19TFykTz2xWmMeq6bk2NU3XXvfJ+Q61m0xktWwt+1HSYf3JZsTms3aRJg==",
-      "dev": true,
       "license": "MIT"
     },
     "node_modules/cookie": {
@@ -1561,6 +3017,58 @@
         "url": "https://opencollective.com/express"
       }
     },
+    "node_modules/cookie-signature": {
+      "version": "1.2.2",
+      "resolved": "https://registry.npmjs.org/cookie-signature/-/cookie-signature-1.2.2.tgz",
+      "integrity": "sha512-D76uU73ulSXrD1UXF4KE2TMxVVwhsnCgfAyTg9k8P6KGZjlXKrOLe4dJQKI3Bxi5wjesZoFXJWElNWBjPZMbhg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=6.6.0"
+      }
+    },
+    "node_modules/cors": {
+      "version": "2.8.6",
+      "resolved": "https://registry.npmjs.org/cors/-/cors-2.8.6.tgz",
+      "integrity": "sha512-tJtZBBHA6vjIAaF6EnIaq6laBBP9aq/Y3ouVJjEfoHbRBcHBAHYcMh/w8LDrk2PvIMMq8gmopa5D4V8RmbrxGw==",
+      "license": "MIT",
+      "dependencies": {
+        "object-assign": "^4",
+        "vary": "^1"
+      },
+      "engines": {
+        "node": ">= 0.10"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/express"
+      }
+    },
+    "node_modules/cosmiconfig": {
+      "version": "9.0.1",
+      "resolved": "https://registry.npmjs.org/cosmiconfig/-/cosmiconfig-9.0.1.tgz",
+      "integrity": "sha512-hr4ihw+DBqcvrsEDioRO31Z17x71pUYoNe/4h6Z0wB72p7MU7/9gH8Q3s12NFhHPfYBBOV3qyfUxmr/Yn3shnQ==",
+      "license": "MIT",
+      "dependencies": {
+        "env-paths": "^2.2.1",
+        "import-fresh": "^3.3.0",
+        "js-yaml": "^4.1.0",
+        "parse-json": "^5.2.0"
+      },
+      "engines": {
+        "node": ">=14"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/d-fischer"
+      },
+      "peerDependencies": {
+        "typescript": ">=4.9.5"
+      },
+      "peerDependenciesMeta": {
+        "typescript": {
+          "optional": true
+        }
+      }
+    },
     "node_modules/cross-spawn": {
       "version": "7.0.6",
       "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-7.0.6.tgz",
@@ -1575,6 +3083,18 @@
         "node": ">= 8"
       }
     },
+    "node_modules/cssesc": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/cssesc/-/cssesc-3.0.0.tgz",
+      "integrity": "sha512-/Tb/JcjK111nNScGob5MNtsntNM1aCNUDipB/TkwZFhyDrrE47SOx/18wF2bbjgc3ZzCSKW1T5nt5EbFoAz/Vg==",
+      "license": "MIT",
+      "bin": {
+        "cssesc": "bin/cssesc"
+      },
+      "engines": {
+        "node": ">=4"
+      }
+    },
     "node_modules/data-uri-to-buffer": {
       "version": "4.0.1",
       "resolved": "https://registry.npmjs.org/data-uri-to-buffer/-/data-uri-to-buffer-4.0.1.tgz",
@@ -1601,6 +3121,122 @@
         }
       }
     },
+    "node_modules/dedent": {
+      "version": "1.7.2",
+      "resolved": "https://registry.npmjs.org/dedent/-/dedent-1.7.2.tgz",
+      "integrity": "sha512-WzMx3mW98SN+zn3hgemf4OzdmyNhhhKz5Ay0pUfQiMQ3e1g+xmTJWp/pKdwKVXhdSkAEGIIzqeuWrL3mV/AXbA==",
+      "license": "MIT",
+      "peerDependencies": {
+        "babel-plugin-macros": "^3.1.0"
+      },
+      "peerDependenciesMeta": {
+        "babel-plugin-macros": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/deepmerge": {
+      "version": "4.3.1",
+      "resolved": "https://registry.npmjs.org/deepmerge/-/deepmerge-4.3.1.tgz",
+      "integrity": "sha512-3sUqbMEc77XqpdNO7FRyRog+eW3ph+GYCbj+rK+uYyRMuwsVy0rMiVtPn+QJlKFvWP/1PYpapqYn0Me2knFn+A==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
+    "node_modules/default-browser": {
+      "version": "5.5.0",
+      "resolved": "https://registry.npmjs.org/default-browser/-/default-browser-5.5.0.tgz",
+      "integrity": "sha512-H9LMLr5zwIbSxrmvikGuI/5KGhZ8E2zH3stkMgM5LpOWDutGM2JZaj460Udnf1a+946zc7YBgrqEWwbk7zHvGw==",
+      "license": "MIT",
+      "dependencies": {
+        "bundle-name": "^4.1.0",
+        "default-browser-id": "^5.0.0"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/default-browser-id": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/default-browser-id/-/default-browser-id-5.0.1.tgz",
+      "integrity": "sha512-x1VCxdX4t+8wVfd1so/9w+vQ4vx7lKd2Qp5tDRutErwmR85OgmfX7RlLRMWafRMY7hbEiXIbudNrjOAPa/hL8Q==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/define-lazy-prop": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/define-lazy-prop/-/define-lazy-prop-3.0.0.tgz",
+      "integrity": "sha512-N+MeXYoqr3pOgn8xfyRPREN7gHakLYjhsHhWGT3fWAiL4IkAt0iDw14QiiEm2bE30c5XX5q0FtAA3CK5f9/BUg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/depd": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/depd/-/depd-2.0.0.tgz",
+      "integrity": "sha512-g7nH6P6dyDioJogAAGprGpCtVImJhpPk/roCzdb3fIh61/s/nPsfR6onyMwkCAR/OlC3yBC0lESvUoQEAssIrw==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
+    "node_modules/detect-libc": {
+      "version": "2.1.2",
+      "resolved": "https://registry.npmjs.org/detect-libc/-/detect-libc-2.1.2.tgz",
+      "integrity": "sha512-Btj2BOOO83o3WyH59e8MgXsxEQVcarkUOpEYrubB0urwnN10yQ364rsiByU11nZlqWYZm05i/of7io4mzihBtQ==",
+      "license": "Apache-2.0",
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/diff": {
+      "version": "8.0.3",
+      "resolved": "https://registry.npmjs.org/diff/-/diff-8.0.3.tgz",
+      "integrity": "sha512-qejHi7bcSD4hQAZE0tNAawRK1ZtafHDmMTMkrrIGgSLl7hTnQHmKCeB45xAcbfTqK2zowkM3j3bHt/4b/ARbYQ==",
+      "license": "BSD-3-Clause",
+      "engines": {
+        "node": ">=0.3.1"
+      }
+    },
+    "node_modules/dotenv": {
+      "version": "17.3.1",
+      "resolved": "https://registry.npmjs.org/dotenv/-/dotenv-17.3.1.tgz",
+      "integrity": "sha512-IO8C/dzEb6O3F9/twg6ZLXz164a2fhTnEWb95H23Dm4OuN+92NmEAlTrupP9VW6Jm3sO26tQlqyvyi4CsnY9GA==",
+      "license": "BSD-2-Clause",
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://dotenvx.com"
+      }
+    },
+    "node_modules/dunder-proto": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/dunder-proto/-/dunder-proto-1.0.1.tgz",
+      "integrity": "sha512-KIN/nDJBQRcXw0MLVhZE9iQHmG68qAVIBg9CqmUYjmQIhgij9U5MFvrqkUL5FbtyyzZuOeOt0zdeRe4UY7ct+A==",
+      "license": "MIT",
+      "dependencies": {
+        "call-bind-apply-helpers": "^1.0.1",
+        "es-errors": "^1.3.0",
+        "gopd": "^1.2.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
     "node_modules/eastasianwidth": {
       "version": "0.2.0",
       "resolved": "https://registry.npmjs.org/eastasianwidth/-/eastasianwidth-0.2.0.tgz",
@@ -1616,11 +3252,33 @@
         "safe-buffer": "^5.0.1"
       }
     },
+    "node_modules/eciesjs": {
+      "version": "0.4.18",
+      "resolved": "https://registry.npmjs.org/eciesjs/-/eciesjs-0.4.18.tgz",
+      "integrity": "sha512-wG99Zcfcys9fZux7Cft8BAX/YrOJLJSZ3jyYPfhZHqN2E+Ffx+QXBDsv3gubEgPtV6dTzJMSQUwk1H98/t/0wQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@ecies/ciphers": "^0.2.5",
+        "@noble/ciphers": "^1.3.0",
+        "@noble/curves": "^1.9.7",
+        "@noble/hashes": "^1.8.0"
+      },
+      "engines": {
+        "bun": ">=1",
+        "deno": ">=2",
+        "node": ">=16"
+      }
+    },
+    "node_modules/ee-first": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/ee-first/-/ee-first-1.1.1.tgz",
+      "integrity": "sha512-WMwm9LhRUo+WUaRN+vRuETqG89IgZphVSNkdFgeb6sS/E4OrDIN7t48CAewSHXc6C8lefD8KKfr5vY61brQlow==",
+      "license": "MIT"
+    },
     "node_modules/electron-to-chromium": {
       "version": "1.5.283",
       "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.283.tgz",
       "integrity": "sha512-3vifjt1HgrGW/h76UEeny+adYApveS9dH2h3p57JYzBSXJIKUJAvtmIytDKjcSCt9xHfrNCFJ7gts6vkhuq++w==",
-      "dev": true,
       "license": "ISC"
     },
     "node_modules/emoji-regex": {
@@ -1629,11 +3287,80 @@
       "integrity": "sha512-L18DaJsXSUk2+42pv8mLs5jJT2hqFkFE4j21wOmgbUqsZ2hL72NsUU785g9RXgo3s0ZNgVl42TiHp3ZtOv/Vyg==",
       "license": "MIT"
     },
+    "node_modules/encodeurl": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/encodeurl/-/encodeurl-2.0.0.tgz",
+      "integrity": "sha512-Q0n9HRi4m6JuGIV1eFlmvJB7ZEVxu93IrMyiMsGC0lrMJMWzRgx6WGquyfQgZVb31vhGgXnfmPNNXmxnOkRBrg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
+    "node_modules/enhanced-resolve": {
+      "version": "5.20.0",
+      "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-5.20.0.tgz",
+      "integrity": "sha512-/ce7+jQ1PQ6rVXwe+jKEg5hW5ciicHwIQUagZkp6IufBoY3YDgdTTY1azVs0qoRgVmvsNB+rbjLJxDAeHHtwsQ==",
+      "license": "MIT",
+      "dependencies": {
+        "graceful-fs": "^4.2.4",
+        "tapable": "^2.3.0"
+      },
+      "engines": {
+        "node": ">=10.13.0"
+      }
+    },
+    "node_modules/env-paths": {
+      "version": "2.2.1",
+      "resolved": "https://registry.npmjs.org/env-paths/-/env-paths-2.2.1.tgz",
+      "integrity": "sha512-+h1lkLKhZMTYjog1VEpJNG7NZJWcuc2DDk/qsqSTRRCOXiLjeQ1d1/udrUGhqMxUgAlwKNZ0cf2uqan5GLuS2A==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=6"
+      }
+    },
+    "node_modules/error-ex": {
+      "version": "1.3.4",
+      "resolved": "https://registry.npmjs.org/error-ex/-/error-ex-1.3.4.tgz",
+      "integrity": "sha512-sqQamAnR14VgCr1A618A3sGrygcpK+HEbenA/HiEAkkUwcZIIB/tgWqHFxWgOyDh4nB4JCRimh79dR5Ywc9MDQ==",
+      "license": "MIT",
+      "dependencies": {
+        "is-arrayish": "^0.2.1"
+      }
+    },
+    "node_modules/es-define-property": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/es-define-property/-/es-define-property-1.0.1.tgz",
+      "integrity": "sha512-e3nRfgfUZ4rNGL232gUgX06QNyyez04KdjFrF+LTRoOXmrOgFKDg4BCdsjW8EnT69eqdYGmRpJwiPVYNrCaW3g==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/es-errors": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/es-errors/-/es-errors-1.3.0.tgz",
+      "integrity": "sha512-Zf5H2Kxt2xjTvbJvP2ZWLEICxA6j+hAmMzIlypy4xcBg1vKVnx89Wy0GbS+kf5cwCVFFzdCFh2XSCFNULS6csw==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/es-object-atoms": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/es-object-atoms/-/es-object-atoms-1.1.1.tgz",
+      "integrity": "sha512-FGgH2h8zKNim9ljj7dankFPcICIK9Cp5bm+c2gQSYePhpaG5+esrLODihIorn+Pe6FGJzWhXQotPv73jTaldXA==",
+      "license": "MIT",
+      "dependencies": {
+        "es-errors": "^1.3.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
     "node_modules/esbuild": {
       "version": "0.25.12",
       "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.25.12.tgz",
       "integrity": "sha512-bbPBYYrtZbkt6Os6FiTLCTFxvq4tt3JKall1vRwshA3fdVztsLAatFaZobhkBC8/BrPetoa0oksYoKXoG4ryJg==",
-      "dev": true,
       "hasInstallScript": true,
       "license": "MIT",
       "bin": {
@@ -1675,23 +3402,213 @@
       "version": "3.2.0",
       "resolved": "https://registry.npmjs.org/escalade/-/escalade-3.2.0.tgz",
       "integrity": "sha512-WUj2qlxaQtO4g6Pq5c29GTcWGDyd8itL8zTlipgECz3JesAiiOKotd8JU6otB3PACgG6xkJUyVhboMS+bje/jA==",
-      "dev": true,
       "license": "MIT",
       "engines": {
         "node": ">=6"
       }
     },
+    "node_modules/escape-html": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/escape-html/-/escape-html-1.0.3.tgz",
+      "integrity": "sha512-NiSupZ4OeuGwr68lGIeym/ksIZMJodUGOSCZ/FSnTxcrekbvqrgdUxlJOMpijaKZVjAJrWrGs/6Jy8OMuyj9ow==",
+      "license": "MIT"
+    },
+    "node_modules/esprima": {
+      "version": "4.0.1",
+      "resolved": "https://registry.npmjs.org/esprima/-/esprima-4.0.1.tgz",
+      "integrity": "sha512-eGuFFw7Upda+g4p+QHvnW0RyTX/SVeJBDM/gCtMARO0cLuT2HcEKnTPvhjV6aGeqrCB/sbNop0Kszm0jsaWU4A==",
+      "license": "BSD-2-Clause",
+      "bin": {
+        "esparse": "bin/esparse.js",
+        "esvalidate": "bin/esvalidate.js"
+      },
+      "engines": {
+        "node": ">=4"
+      }
+    },
+    "node_modules/etag": {
+      "version": "1.8.1",
+      "resolved": "https://registry.npmjs.org/etag/-/etag-1.8.1.tgz",
+      "integrity": "sha512-aIL5Fx7mawVa300al2BnEE4iNvo1qETxLrPI/o05L7z6go7fCw1J6EQmbK4FmJ2AS7kgVF/KEZWufBfdClMcPg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
+    "node_modules/eventsource": {
+      "version": "3.0.7",
+      "resolved": "https://registry.npmjs.org/eventsource/-/eventsource-3.0.7.tgz",
+      "integrity": "sha512-CRT1WTyuQoD771GW56XEZFQ/ZoSfWid1alKGDYMmkt2yl8UXrVR4pspqWNEcqKvVIzg6PAltWjxcSSPrboA4iA==",
+      "license": "MIT",
+      "dependencies": {
+        "eventsource-parser": "^3.0.1"
+      },
+      "engines": {
+        "node": ">=18.0.0"
+      }
+    },
+    "node_modules/eventsource-parser": {
+      "version": "3.0.6",
+      "resolved": "https://registry.npmjs.org/eventsource-parser/-/eventsource-parser-3.0.6.tgz",
+      "integrity": "sha512-Vo1ab+QXPzZ4tCa8SwIHJFaSzy4R6SHf7BY79rFBDf0idraZWAkYrDjDj8uWaSm3S2TK+hJ7/t1CEmZ7jXw+pg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=18.0.0"
+      }
+    },
+    "node_modules/execa": {
+      "version": "9.6.1",
+      "resolved": "https://registry.npmjs.org/execa/-/execa-9.6.1.tgz",
+      "integrity": "sha512-9Be3ZoN4LmYR90tUoVu2te2BsbzHfhJyfEiAVfz7N5/zv+jduIfLrV2xdQXOHbaD6KgpGdO9PRPM1Y4Q9QkPkA==",
+      "license": "MIT",
+      "dependencies": {
+        "@sindresorhus/merge-streams": "^4.0.0",
+        "cross-spawn": "^7.0.6",
+        "figures": "^6.1.0",
+        "get-stream": "^9.0.0",
+        "human-signals": "^8.0.1",
+        "is-plain-obj": "^4.1.0",
+        "is-stream": "^4.0.1",
+        "npm-run-path": "^6.0.0",
+        "pretty-ms": "^9.2.0",
+        "signal-exit": "^4.1.0",
+        "strip-final-newline": "^4.0.0",
+        "yoctocolors": "^2.1.1"
+      },
+      "engines": {
+        "node": "^18.19.0 || >=20.5.0"
+      },
+      "funding": {
+        "url": "https://github.com/sindresorhus/execa?sponsor=1"
+      }
+    },
+    "node_modules/express": {
+      "version": "5.2.1",
+      "resolved": "https://registry.npmjs.org/express/-/express-5.2.1.tgz",
+      "integrity": "sha512-hIS4idWWai69NezIdRt2xFVofaF4j+6INOpJlVOLDO8zXGpUVEVzIYk12UUi2JzjEzWL3IOAxcTubgz9Po0yXw==",
+      "license": "MIT",
+      "dependencies": {
+        "accepts": "^2.0.0",
+        "body-parser": "^2.2.1",
+        "content-disposition": "^1.0.0",
+        "content-type": "^1.0.5",
+        "cookie": "^0.7.1",
+        "cookie-signature": "^1.2.1",
+        "debug": "^4.4.0",
+        "depd": "^2.0.0",
+        "encodeurl": "^2.0.0",
+        "escape-html": "^1.0.3",
+        "etag": "^1.8.1",
+        "finalhandler": "^2.1.0",
+        "fresh": "^2.0.0",
+        "http-errors": "^2.0.0",
+        "merge-descriptors": "^2.0.0",
+        "mime-types": "^3.0.0",
+        "on-finished": "^2.4.1",
+        "once": "^1.4.0",
+        "parseurl": "^1.3.3",
+        "proxy-addr": "^2.0.7",
+        "qs": "^6.14.0",
+        "range-parser": "^1.2.1",
+        "router": "^2.2.0",
+        "send": "^1.1.0",
+        "serve-static": "^2.2.0",
+        "statuses": "^2.0.1",
+        "type-is": "^2.0.1",
+        "vary": "^1.1.2"
+      },
+      "engines": {
+        "node": ">= 18"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/express"
+      }
+    },
+    "node_modules/express-rate-limit": {
+      "version": "8.3.1",
+      "resolved": "https://registry.npmjs.org/express-rate-limit/-/express-rate-limit-8.3.1.tgz",
+      "integrity": "sha512-D1dKN+cmyPWuvB+G2SREQDzPY1agpBIcTa9sJxOPMCNeH3gwzhqJRDWCXW3gg0y//+LQ/8j52JbMROWyrKdMdw==",
+      "license": "MIT",
+      "dependencies": {
+        "ip-address": "10.1.0"
+      },
+      "engines": {
+        "node": ">= 16"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/express-rate-limit"
+      },
+      "peerDependencies": {
+        "express": ">= 4.11"
+      }
+    },
+    "node_modules/express/node_modules/cookie": {
+      "version": "0.7.2",
+      "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.7.2.tgz",
+      "integrity": "sha512-yki5XnKuf750l50uGTllt6kKILY4nQ1eNIQatoXEByZ5dWgnKqbnqmTrBE5B4N7lrMJKQ2ytWMiTO2o0v6Ew/w==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
     "node_modules/extend": {
       "version": "3.0.2",
       "resolved": "https://registry.npmjs.org/extend/-/extend-3.0.2.tgz",
       "integrity": "sha512-fjquC59cD7CyW6urNXK0FBufkZcoiGG80wTuPujX590cB5Ttln20E2UB4S/WARVqhXffZl2LNgS+gQdPIIim/g==",
       "license": "MIT"
     },
+    "node_modules/fast-deep-equal": {
+      "version": "3.1.3",
+      "resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz",
+      "integrity": "sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q==",
+      "license": "MIT"
+    },
+    "node_modules/fast-glob": {
+      "version": "3.3.3",
+      "resolved": "https://registry.npmjs.org/fast-glob/-/fast-glob-3.3.3.tgz",
+      "integrity": "sha512-7MptL8U0cqcFdzIzwOTHoilX9x5BrNqye7Z/LuC7kCMRio1EMSyqRK3BEAUD7sXRq4iT4AzTVuZdhgQ2TCvYLg==",
+      "license": "MIT",
+      "dependencies": {
+        "@nodelib/fs.stat": "^2.0.2",
+        "@nodelib/fs.walk": "^1.2.3",
+        "glob-parent": "^5.1.2",
+        "merge2": "^1.3.0",
+        "micromatch": "^4.0.8"
+      },
+      "engines": {
+        "node": ">=8.6.0"
+      }
+    },
+    "node_modules/fast-uri": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/fast-uri/-/fast-uri-3.1.0.tgz",
+      "integrity": "sha512-iPeeDKJSWf4IEOasVVrknXpaBV0IApz/gp7S2bb7Z4Lljbl2MGJRqInZiUrQwV16cpzw/D3S5j5Julj/gT52AA==",
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/fastify"
+        },
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/fastify"
+        }
+      ],
+      "license": "BSD-3-Clause"
+    },
+    "node_modules/fastq": {
+      "version": "1.20.1",
+      "resolved": "https://registry.npmjs.org/fastq/-/fastq-1.20.1.tgz",
+      "integrity": "sha512-GGToxJ/w1x32s/D2EKND7kTil4n8OVk/9mycTc4VDza13lOvpUZTGX3mFSCtV9ksdGBVzvsyAVLM6mHFThxXxw==",
+      "license": "ISC",
+      "dependencies": {
+        "reusify": "^1.0.4"
+      }
+    },
     "node_modules/fdir": {
       "version": "6.5.0",
       "resolved": "https://registry.npmjs.org/fdir/-/fdir-6.5.0.tgz",
       "integrity": "sha512-tIbYtZbucOs0BRGqPJkshJUYdL+SDH7dVM8gjy+ERp3WAUjLEFJE+02kanyHtwjWOnwrKYBiwAmM0p4kLJAnXg==",
-      "dev": true,
       "license": "MIT",
       "engines": {
         "node": ">=12.0.0"
@@ -1728,6 +3645,54 @@
         "node": "^12.20 || >= 14.13"
       }
     },
+    "node_modules/figures": {
+      "version": "6.1.0",
+      "resolved": "https://registry.npmjs.org/figures/-/figures-6.1.0.tgz",
+      "integrity": "sha512-d+l3qxjSesT4V7v2fh+QnmFnUWv9lSpjarhShNTgBOfA0ttejbQUAlHLitbjkoRiDulW0OPoQPYIGhIC8ohejg==",
+      "license": "MIT",
+      "dependencies": {
+        "is-unicode-supported": "^2.0.0"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/fill-range": {
+      "version": "7.1.1",
+      "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.1.1.tgz",
+      "integrity": "sha512-YsGpe3WHLK8ZYi4tWDg2Jy3ebRz2rXowDxnld4bkQB00cc/1Zw9AWnC0i9ztDJitivtQvaI9KaLyKrc+hBW0yg==",
+      "license": "MIT",
+      "dependencies": {
+        "to-regex-range": "^5.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/finalhandler": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-2.1.1.tgz",
+      "integrity": "sha512-S8KoZgRZN+a5rNwqTxlZZePjT/4cnm0ROV70LedRHZ0p8u9fRID0hJUZQpkKLzro8LfmC8sx23bY6tVNxv8pQA==",
+      "license": "MIT",
+      "dependencies": {
+        "debug": "^4.4.0",
+        "encodeurl": "^2.0.0",
+        "escape-html": "^1.0.3",
+        "on-finished": "^2.4.1",
+        "parseurl": "^1.3.3",
+        "statuses": "^2.0.1"
+      },
+      "engines": {
+        "node": ">= 18.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/express"
+      }
+    },
     "node_modules/foreground-child": {
       "version": "3.3.1",
       "resolved": "https://registry.npmjs.org/foreground-child/-/foreground-child-3.3.1.tgz",
@@ -1756,11 +3721,56 @@
         "node": ">=12.20.0"
       }
     },
+    "node_modules/forwarded": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/forwarded/-/forwarded-0.2.0.tgz",
+      "integrity": "sha512-buRG0fpBtRHSTCOASe6hD258tEubFoRLb4ZNA6NxMVHNw2gOcwHo9wyablzMzOA5z9xA9L1KNjk/Nt6MT9aYow==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
+    "node_modules/fraction.js": {
+      "version": "5.3.4",
+      "resolved": "https://registry.npmjs.org/fraction.js/-/fraction.js-5.3.4.tgz",
+      "integrity": "sha512-1X1NTtiJphryn/uLQz3whtY6jK3fTqoE3ohKs0tT+Ujr1W59oopxmoEh7Lu5p6vBaPbgoM0bzveAW4Qi5RyWDQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": "*"
+      },
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/rawify"
+      }
+    },
+    "node_modules/fresh": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/fresh/-/fresh-2.0.0.tgz",
+      "integrity": "sha512-Rx/WycZ60HOaqLKAi6cHRKKI7zxWbJ31MhntmtwMoaTeF7XFH9hhBp8vITaMidfljRQ6eYWCKkaTK+ykVJHP2A==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
+    "node_modules/fs-extra": {
+      "version": "11.3.4",
+      "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-11.3.4.tgz",
+      "integrity": "sha512-CTXd6rk/M3/ULNQj8FBqBWHYBVYybQ3VPBw0xGKFe3tuH7ytT6ACnvzpIQ3UZtB8yvUKC2cXn1a+x+5EVQLovA==",
+      "license": "MIT",
+      "dependencies": {
+        "graceful-fs": "^4.2.0",
+        "jsonfile": "^6.0.1",
+        "universalify": "^2.0.0"
+      },
+      "engines": {
+        "node": ">=14.14"
+      }
+    },
     "node_modules/fsevents": {
       "version": "2.3.3",
       "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.3.tgz",
       "integrity": "sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==",
-      "dev": true,
       "hasInstallScript": true,
       "license": "MIT",
       "optional": true,
@@ -1771,6 +3781,27 @@
         "node": "^8.16.0 || ^10.6.0 || >=11.0.0"
       }
     },
+    "node_modules/function-bind": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.2.tgz",
+      "integrity": "sha512-7XHNxH7qX9xG5mIwxkhumTox/MIRNcOgDrxWsMt2pAr23WHp6MrRlN7FBSFpCpr+oVO0F744iUgR82nJMfG2SA==",
+      "license": "MIT",
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/fuzzysort": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/fuzzysort/-/fuzzysort-3.1.0.tgz",
+      "integrity": "sha512-sR9BNCjBg6LNgwvxlBd0sBABvQitkLzoVY9MYYROQVX/FvfJ4Mai9LsGhDgd8qYdds0bY77VzYd5iuB+v5rwQQ==",
+      "license": "MIT"
+    },
+    "node_modules/fzf": {
+      "version": "0.5.2",
+      "resolved": "https://registry.npmjs.org/fzf/-/fzf-0.5.2.tgz",
+      "integrity": "sha512-Tt4kuxLXFKHy8KT40zwsUPUkg1CrsgY25FxA2U/j/0WgEDCk3ddc/zLTCCcbSHX9FcKtLuVaDGtGE/STWC+j3Q==",
+      "license": "BSD-3-Clause"
+    },
     "node_modules/gaxios": {
       "version": "7.1.3",
       "resolved": "https://registry.npmjs.org/gaxios/-/gaxios-7.1.3.tgz",
@@ -1804,12 +3835,97 @@
       "version": "1.0.0-beta.2",
       "resolved": "https://registry.npmjs.org/gensync/-/gensync-1.0.0-beta.2.tgz",
       "integrity": "sha512-3hN7NaskYvMDLQY55gnW3NQ+mesEAepTqlg+VEbj7zzqEMBVNhzcGYYeqFo/TlYz6eQiFcp1HcsCZO+nGgS8zg==",
-      "dev": true,
       "license": "MIT",
       "engines": {
         "node": ">=6.9.0"
       }
     },
+    "node_modules/get-caller-file": {
+      "version": "2.0.5",
+      "resolved": "https://registry.npmjs.org/get-caller-file/-/get-caller-file-2.0.5.tgz",
+      "integrity": "sha512-DyFP3BM/3YHTQOCUL/w0OZHR0lpKeGrxotcHWcqNEdnltqFwXVfhEBQ94eIo34AfQpo0rGki4cyIiftY06h2Fg==",
+      "license": "ISC",
+      "engines": {
+        "node": "6.* || 8.* || >= 10.*"
+      }
+    },
+    "node_modules/get-east-asian-width": {
+      "version": "1.5.0",
+      "resolved": "https://registry.npmjs.org/get-east-asian-width/-/get-east-asian-width-1.5.0.tgz",
+      "integrity": "sha512-CQ+bEO+Tva/qlmw24dCejulK5pMzVnUOFOijVogd3KQs07HnRIgp8TGipvCCRT06xeYEbpbgwaCxglFyiuIcmA==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/get-intrinsic": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/get-intrinsic/-/get-intrinsic-1.3.0.tgz",
+      "integrity": "sha512-9fSjSaos/fRIVIp+xSJlE6lfwhES7LNtKaCBIamHsjr2na1BiABJPo0mOjjz8GJDURarmCPGqaiVg5mfjb98CQ==",
+      "license": "MIT",
+      "dependencies": {
+        "call-bind-apply-helpers": "^1.0.2",
+        "es-define-property": "^1.0.1",
+        "es-errors": "^1.3.0",
+        "es-object-atoms": "^1.1.1",
+        "function-bind": "^1.1.2",
+        "get-proto": "^1.0.1",
+        "gopd": "^1.2.0",
+        "has-symbols": "^1.1.0",
+        "hasown": "^2.0.2",
+        "math-intrinsics": "^1.1.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/get-own-enumerable-keys": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/get-own-enumerable-keys/-/get-own-enumerable-keys-1.0.0.tgz",
+      "integrity": "sha512-PKsK2FSrQCyxcGHsGrLDcK0lx+0Ke+6e8KFFozA9/fIQLhQzPaRvJFdcz7+Axg3jUH/Mq+NI4xa5u/UT2tQskA==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=14.16"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/get-proto": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/get-proto/-/get-proto-1.0.1.tgz",
+      "integrity": "sha512-sTSfBjoXBp89JvIKIefqw7U2CCebsc74kiY6awiGogKtoSGbgjYE/G/+l9sF3MWFPNc9IcoOC4ODfKHfxFmp0g==",
+      "license": "MIT",
+      "dependencies": {
+        "dunder-proto": "^1.0.1",
+        "es-object-atoms": "^1.0.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/get-stream": {
+      "version": "9.0.1",
+      "resolved": "https://registry.npmjs.org/get-stream/-/get-stream-9.0.1.tgz",
+      "integrity": "sha512-kVCxPF3vQM/N0B1PmoqVUqgHP+EeVjmZSQn+1oCRPxd2P21P2F19lIgbR3HBosbB1PUhOAoctJnfEn2GbN2eZA==",
+      "license": "MIT",
+      "dependencies": {
+        "@sec-ant/readable-stream": "^0.4.1",
+        "is-stream": "^4.0.1"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
     "node_modules/glob": {
       "version": "10.5.0",
       "resolved": "https://registry.npmjs.org/glob/-/glob-10.5.0.tgz",
@@ -1830,6 +3946,18 @@
         "url": "https://github.com/sponsors/isaacs"
       }
     },
+    "node_modules/glob-parent": {
+      "version": "5.1.2",
+      "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz",
+      "integrity": "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==",
+      "license": "ISC",
+      "dependencies": {
+        "is-glob": "^4.0.1"
+      },
+      "engines": {
+        "node": ">= 6"
+      }
+    },
     "node_modules/google-auth-library": {
       "version": "10.5.0",
       "resolved": "https://registry.npmjs.org/google-auth-library/-/google-auth-library-10.5.0.tgz",
@@ -1857,6 +3985,33 @@
         "node": ">=14"
       }
     },
+    "node_modules/gopd": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/gopd/-/gopd-1.2.0.tgz",
+      "integrity": "sha512-ZUKRh6/kUFoAiTAtTYPZJ3hw9wNxx+BIBOijnlG9PnrJsCcSjs1wyyD6vJpaYtgnzDrKYRSqf3OO6Rfa93xsRg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/graceful-fs": {
+      "version": "4.2.11",
+      "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-4.2.11.tgz",
+      "integrity": "sha512-RbJ5/jmFcNNCcDV5o9eTnBLJ/HszWV0P73bc+Ff4nS/rJj+YaS6IGyiOL0VoBYX+l1Wrl3k63h/KrH+nhJ0XvQ==",
+      "license": "ISC"
+    },
+    "node_modules/graphql": {
+      "version": "16.13.1",
+      "resolved": "https://registry.npmjs.org/graphql/-/graphql-16.13.1.tgz",
+      "integrity": "sha512-gGgrVCoDKlIZ8fIqXBBb0pPKqDgki0Z/FSKNiQzSGj2uEYHr1tq5wmBegGwJx6QB5S5cM0khSBpi/JFHMCvsmQ==",
+      "license": "MIT",
+      "engines": {
+        "node": "^12.22.0 || ^14.16.0 || ^16.0.0 || >=17.0.0"
+      }
+    },
     "node_modules/gtoken": {
       "version": "8.0.0",
       "resolved": "https://registry.npmjs.org/gtoken/-/gtoken-8.0.0.tgz",
@@ -1870,6 +4025,65 @@
         "node": ">=18"
       }
     },
+    "node_modules/has-symbols": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/has-symbols/-/has-symbols-1.1.0.tgz",
+      "integrity": "sha512-1cDNdwJ2Jaohmb3sg4OmKaMBwuC48sYni5HUw2DvsC8LjGTLK9h+eb1X6RyuOHe4hT0ULCW68iomhjUoKUqlPQ==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/hasown": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/hasown/-/hasown-2.0.2.tgz",
+      "integrity": "sha512-0hJU9SCPvmMzIBdZFqNPXWa6dqh7WdH0cII9y+CyS8rG3nL48Bclra9HmKhVVUHyPWNH5Y7xDwAB7bfgSjkUMQ==",
+      "license": "MIT",
+      "dependencies": {
+        "function-bind": "^1.1.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/headers-polyfill": {
+      "version": "4.0.3",
+      "resolved": "https://registry.npmjs.org/headers-polyfill/-/headers-polyfill-4.0.3.tgz",
+      "integrity": "sha512-IScLbePpkvO846sIwOtOTDjutRMWdXdJmXdMvk6gCBHxFO8d+QKOQedyZSxFTTFYRSmlgSTDtXqqq4pcenBXLQ==",
+      "license": "MIT"
+    },
+    "node_modules/hono": {
+      "version": "4.12.6",
+      "resolved": "https://registry.npmjs.org/hono/-/hono-4.12.6.tgz",
+      "integrity": "sha512-KljEp+MeEEEIOT75qBo1UjqqB29fRMtlDEwCxcexOzdkUq6LR/vRvHk5pdROcxyOYyW1niq7Gb5pFVGy5R1eBw==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=16.9.0"
+      }
+    },
+    "node_modules/http-errors": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-2.0.1.tgz",
+      "integrity": "sha512-4FbRdAX+bSdmo4AUFuS0WNiPz8NgFt+r8ThgNWmlrjQjt1Q7ZR9+zTlce2859x4KSXrwIsaeTqDoKQmtP8pLmQ==",
+      "license": "MIT",
+      "dependencies": {
+        "depd": "~2.0.0",
+        "inherits": "~2.0.4",
+        "setprototypeof": "~1.2.0",
+        "statuses": "~2.0.2",
+        "toidentifier": "~1.0.1"
+      },
+      "engines": {
+        "node": ">= 0.8"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/express"
+      }
+    },
     "node_modules/https-proxy-agent": {
       "version": "7.0.6",
       "resolved": "https://registry.npmjs.org/https-proxy-agent/-/https-proxy-agent-7.0.6.tgz",
@@ -1883,6 +4097,110 @@
         "node": ">= 14"
       }
     },
+    "node_modules/human-signals": {
+      "version": "8.0.1",
+      "resolved": "https://registry.npmjs.org/human-signals/-/human-signals-8.0.1.tgz",
+      "integrity": "sha512-eKCa6bwnJhvxj14kZk5NCPc6Hb6BdsU9DZcOnmQKSnO1VKrfV0zCvtttPZUsBvjmNDn8rpcJfpwSYnHBjc95MQ==",
+      "license": "Apache-2.0",
+      "engines": {
+        "node": ">=18.18.0"
+      }
+    },
+    "node_modules/iconv-lite": {
+      "version": "0.7.2",
+      "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.7.2.tgz",
+      "integrity": "sha512-im9DjEDQ55s9fL4EYzOAv0yMqmMBSZp6G0VvFyTMPKWxiSBHUj9NW/qqLmXUwXrrM7AvqSlTCfvqRb0cM8yYqw==",
+      "license": "MIT",
+      "dependencies": {
+        "safer-buffer": ">= 2.1.2 < 3.0.0"
+      },
+      "engines": {
+        "node": ">=0.10.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/express"
+      }
+    },
+    "node_modules/ignore": {
+      "version": "5.3.2",
+      "resolved": "https://registry.npmjs.org/ignore/-/ignore-5.3.2.tgz",
+      "integrity": "sha512-hsBTNUqQTDwkWtcdYI2i06Y/nUBEsNEDJKjWdigLvegy8kDuJAS8uRlpkkcQpyEXL0Z/pjDy5HBmMjRCJ2gq+g==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 4"
+      }
+    },
+    "node_modules/import-fresh": {
+      "version": "3.3.1",
+      "resolved": "https://registry.npmjs.org/import-fresh/-/import-fresh-3.3.1.tgz",
+      "integrity": "sha512-TR3KfrTZTYLPB6jUjfx6MF9WcWrHL9su5TObK4ZkYgBdWKPOFoSoQIdEuTuR82pmtxH2spWG9h6etwfr1pLBqQ==",
+      "license": "MIT",
+      "dependencies": {
+        "parent-module": "^1.0.0",
+        "resolve-from": "^4.0.0"
+      },
+      "engines": {
+        "node": ">=6"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/inherits": {
+      "version": "2.0.4",
+      "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.4.tgz",
+      "integrity": "sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ==",
+      "license": "ISC"
+    },
+    "node_modules/ip-address": {
+      "version": "10.1.0",
+      "resolved": "https://registry.npmjs.org/ip-address/-/ip-address-10.1.0.tgz",
+      "integrity": "sha512-XXADHxXmvT9+CRxhXg56LJovE+bmWnEWB78LB83VZTprKTmaC5QfruXocxzTZ2Kl0DNwKuBdlIhjL8LeY8Sf8Q==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 12"
+      }
+    },
+    "node_modules/ipaddr.js": {
+      "version": "1.9.1",
+      "resolved": "https://registry.npmjs.org/ipaddr.js/-/ipaddr.js-1.9.1.tgz",
+      "integrity": "sha512-0KI/607xoxSToH7GjN1FfSbLoU0+btTicjsQSWQlh/hZykN8KpmMf7uYwPW3R+akZ6R/w18ZlXSHBYXiYUPO3g==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.10"
+      }
+    },
+    "node_modules/is-arrayish": {
+      "version": "0.2.1",
+      "resolved": "https://registry.npmjs.org/is-arrayish/-/is-arrayish-0.2.1.tgz",
+      "integrity": "sha512-zz06S8t0ozoDXMG+ube26zeCTNXcKIPJZJi8hBrF4idCLms4CG9QtK7qBl1boi5ODzFpjswb5JPmHCbMpjaYzg==",
+      "license": "MIT"
+    },
+    "node_modules/is-docker": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/is-docker/-/is-docker-3.0.0.tgz",
+      "integrity": "sha512-eljcgEDlEns/7AXFosB5K/2nCM4P7FQPkGc/DWLy5rmFEWvZayGrik1d9/QIY5nJ4f9YsVvBkA6kJpHn9rISdQ==",
+      "license": "MIT",
+      "bin": {
+        "is-docker": "cli.js"
+      },
+      "engines": {
+        "node": "^12.20.0 || ^14.13.1 || >=16.0.0"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/is-extglob": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz",
+      "integrity": "sha512-SbKbANkN603Vi4jEZv49LeVJMn4yGwsbzZworEoyEiutsN3nJYdbO36zfhGJ6QEDpOZIFkDtnq5JRxmvl3jsoQ==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
     "node_modules/is-fullwidth-code-point": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-3.0.0.tgz",
@@ -1892,6 +4210,156 @@
         "node": ">=8"
       }
     },
+    "node_modules/is-glob": {
+      "version": "4.0.3",
+      "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-4.0.3.tgz",
+      "integrity": "sha512-xelSayHH36ZgE7ZWhli7pW34hNbNl8Ojv5KVmkJD4hBdD3th8Tfk9vYasLM+mXWOZhFkgZfxhLSnrwRr4elSSg==",
+      "license": "MIT",
+      "dependencies": {
+        "is-extglob": "^2.1.1"
+      },
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
+    "node_modules/is-in-ssh": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/is-in-ssh/-/is-in-ssh-1.0.0.tgz",
+      "integrity": "sha512-jYa6Q9rH90kR1vKB6NM7qqd1mge3Fx4Dhw5TVlK1MUBqhEOuCagrEHMevNuCcbECmXZ0ThXkRm+Ymr51HwEPAw==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=20"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/is-inside-container": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/is-inside-container/-/is-inside-container-1.0.0.tgz",
+      "integrity": "sha512-KIYLCCJghfHZxqjYBE7rEy0OBuTd5xCHS7tHVgvCLkx7StIoaxwNW3hCALgEUjFfeRk+MG/Qxmp/vtETEF3tRA==",
+      "license": "MIT",
+      "dependencies": {
+        "is-docker": "^3.0.0"
+      },
+      "bin": {
+        "is-inside-container": "cli.js"
+      },
+      "engines": {
+        "node": ">=14.16"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/is-interactive": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/is-interactive/-/is-interactive-2.0.0.tgz",
+      "integrity": "sha512-qP1vozQRI+BMOPcjFzrjXuQvdak2pHNUMZoeG2eRbiSqyvbEf/wQtEOTOX1guk6E3t36RkaqiSt8A/6YElNxLQ==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/is-node-process": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/is-node-process/-/is-node-process-1.2.0.tgz",
+      "integrity": "sha512-Vg4o6/fqPxIjtxgUH5QLJhwZ7gW5diGCVlXpuUfELC62CuxM1iHcRe51f2W1FDy04Ai4KJkagKjx3XaqyfRKXw==",
+      "license": "MIT"
+    },
+    "node_modules/is-number": {
+      "version": "7.0.0",
+      "resolved": "https://registry.npmjs.org/is-number/-/is-number-7.0.0.tgz",
+      "integrity": "sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.12.0"
+      }
+    },
+    "node_modules/is-obj": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/is-obj/-/is-obj-3.0.0.tgz",
+      "integrity": "sha512-IlsXEHOjtKhpN8r/tRFj2nDyTmHvcfNeu/nrRIcXE17ROeatXchkojffa1SpdqW4cr/Fj6QkEf/Gn4zf6KKvEQ==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/is-plain-obj": {
+      "version": "4.1.0",
+      "resolved": "https://registry.npmjs.org/is-plain-obj/-/is-plain-obj-4.1.0.tgz",
+      "integrity": "sha512-+Pgi+vMuUNkJyExiMBt5IlFoMyKnr5zhJ4Uspz58WOhBF5QoIZkFyNHIbBAtHwzVAgk5RtndVNsDRN61/mmDqg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/is-promise": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/is-promise/-/is-promise-4.0.0.tgz",
+      "integrity": "sha512-hvpoI6korhJMnej285dSg6nu1+e6uxs7zG3BYAm5byqDsgJNWwxzM6z6iZiAgQR4TJ30JmBTOwqZUw3WlyH3AQ==",
+      "license": "MIT"
+    },
+    "node_modules/is-regexp": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/is-regexp/-/is-regexp-3.1.0.tgz",
+      "integrity": "sha512-rbku49cWloU5bSMI+zaRaXdQHXnthP6DZ/vLnfdSKyL4zUzuWnomtOEiZZOd+ioQ+avFo/qau3KPTc7Fjy1uPA==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/is-stream": {
+      "version": "4.0.1",
+      "resolved": "https://registry.npmjs.org/is-stream/-/is-stream-4.0.1.tgz",
+      "integrity": "sha512-Dnz92NInDqYckGEUJv689RbRiTSEHCQ7wOVeALbkOz999YpqT46yMRIGtSNl2iCL1waAZSx40+h59NV/EwzV/A==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/is-unicode-supported": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/is-unicode-supported/-/is-unicode-supported-2.1.0.tgz",
+      "integrity": "sha512-mE00Gnza5EEB3Ds0HfMyllZzbBrmLOX3vfWoj9A9PEnTfratQ/BcaJOuMhnkhjXvb2+FkY3VuHqtAGpTPmglFQ==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/is-wsl": {
+      "version": "3.1.1",
+      "resolved": "https://registry.npmjs.org/is-wsl/-/is-wsl-3.1.1.tgz",
+      "integrity": "sha512-e6rvdUCiQCAuumZslxRJWR/Doq4VpPR82kqclvcS0efgt430SlGIk05vdCN58+VrzgtIcfNODjozVielycD4Sw==",
+      "license": "MIT",
+      "dependencies": {
+        "is-inside-container": "^1.0.0"
+      },
+      "engines": {
+        "node": ">=16"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
     "node_modules/isexe": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/isexe/-/isexe-2.0.0.tgz",
@@ -1913,18 +4381,46 @@
         "@pkgjs/parseargs": "^0.11.0"
       }
     },
+    "node_modules/jiti": {
+      "version": "2.6.1",
+      "resolved": "https://registry.npmjs.org/jiti/-/jiti-2.6.1.tgz",
+      "integrity": "sha512-ekilCSN1jwRvIbgeg/57YFh8qQDNbwDb9xT/qu2DAHbFFZUicIl4ygVaAvzveMhMVr3LnpSKTNnwt8PoOfmKhQ==",
+      "license": "MIT",
+      "bin": {
+        "jiti": "lib/jiti-cli.mjs"
+      }
+    },
+    "node_modules/jose": {
+      "version": "6.2.1",
+      "resolved": "https://registry.npmjs.org/jose/-/jose-6.2.1.tgz",
+      "integrity": "sha512-jUaKr1yrbfaImV7R2TN/b3IcZzsw38/chqMpo2XJ7i2F8AfM/lA4G1goC3JVEwg0H7UldTmSt3P68nt31W7/mw==",
+      "license": "MIT",
+      "funding": {
+        "url": "https://github.com/sponsors/panva"
+      }
+    },
     "node_modules/js-tokens": {
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz",
       "integrity": "sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==",
-      "dev": true,
       "license": "MIT"
     },
+    "node_modules/js-yaml": {
+      "version": "4.1.1",
+      "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-4.1.1.tgz",
+      "integrity": "sha512-qQKT4zQxXl8lLwBtHMWwaTcGfFOZviOJet3Oy/xmGk2gZH677CJM9EvtfdSkgWcATZhj/55JZ0rmy3myCT5lsA==",
+      "license": "MIT",
+      "dependencies": {
+        "argparse": "^2.0.1"
+      },
+      "bin": {
+        "js-yaml": "bin/js-yaml.js"
+      }
+    },
     "node_modules/jsesc": {
       "version": "3.1.0",
       "resolved": "https://registry.npmjs.org/jsesc/-/jsesc-3.1.0.tgz",
       "integrity": "sha512-/sM3dO2FOzXjKQhJuo0Q173wf2KOo8t4I8vHy6lF9poUp7bKT0/NHE8fPX23PwfhnykfqnC2xRxOnVw5XuGIaA==",
-      "dev": true,
       "license": "MIT",
       "bin": {
         "jsesc": "bin/jsesc"
@@ -1942,11 +4438,28 @@
         "bignumber.js": "^9.0.0"
       }
     },
+    "node_modules/json-parse-even-better-errors": {
+      "version": "2.3.1",
+      "resolved": "https://registry.npmjs.org/json-parse-even-better-errors/-/json-parse-even-better-errors-2.3.1.tgz",
+      "integrity": "sha512-xyFwyhro/JEof6Ghe2iz2NcXoj2sloNsWr/XsERDK/oiPCfaNhl5ONfp+jQdAZRQQ0IJWNzH9zIZF7li91kh2w==",
+      "license": "MIT"
+    },
+    "node_modules/json-schema-traverse": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-1.0.0.tgz",
+      "integrity": "sha512-NM8/P9n3XjXhIZn1lLhkFaACTOURQXjWhV4BA/RnOv8xvgqtqpAX9IO4mRQxSx1Rlo4tqzeqb0sOlruaOy3dug==",
+      "license": "MIT"
+    },
+    "node_modules/json-schema-typed": {
+      "version": "8.0.2",
+      "resolved": "https://registry.npmjs.org/json-schema-typed/-/json-schema-typed-8.0.2.tgz",
+      "integrity": "sha512-fQhoXdcvc3V28x7C7BMs4P5+kNlgUURe2jmUT1T//oBRMDrqy1QPelJimwZGo7Hg9VPV3EQV5Bnq4hbFy2vetA==",
+      "license": "BSD-2-Clause"
+    },
     "node_modules/json5": {
       "version": "2.2.3",
       "resolved": "https://registry.npmjs.org/json5/-/json5-2.2.3.tgz",
       "integrity": "sha512-XmOWe7eyHYH14cLdVPoyg+GOH3rYX++KpzrylJwSW98t3Nk+U8XOl8FWKOgwtzdb8lXGf6zYwDUzeHMWfxasyg==",
-      "dev": true,
       "license": "MIT",
       "bin": {
         "json5": "lib/cli.js"
@@ -1955,6 +4468,18 @@
         "node": ">=6"
       }
     },
+    "node_modules/jsonfile": {
+      "version": "6.2.0",
+      "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-6.2.0.tgz",
+      "integrity": "sha512-FGuPw30AdOIUTRMC2OMRtQV+jkVj2cfPqSeWXv1NEAJ1qZ5zb1X6z1mFhbfOB/iy3ssJCD+3KuZ8r8C3uVFlAg==",
+      "license": "MIT",
+      "dependencies": {
+        "universalify": "^2.0.0"
+      },
+      "optionalDependencies": {
+        "graceful-fs": "^4.1.6"
+      }
+    },
     "node_modules/jwa": {
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/jwa/-/jwa-2.0.1.tgz",
@@ -1976,6 +4501,298 @@
         "safe-buffer": "^5.0.1"
       }
     },
+    "node_modules/kleur": {
+      "version": "4.1.5",
+      "resolved": "https://registry.npmjs.org/kleur/-/kleur-4.1.5.tgz",
+      "integrity": "sha512-o+NO+8WrRiQEE4/7nwRJhN1HWpVmJm511pBHUxPLtp0BUISzlBplORYSmTclCnJvQq2tKu/sgl3xVpkc7ZWuQQ==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=6"
+      }
+    },
+    "node_modules/lightningcss": {
+      "version": "1.31.1",
+      "resolved": "https://registry.npmjs.org/lightningcss/-/lightningcss-1.31.1.tgz",
+      "integrity": "sha512-l51N2r93WmGUye3WuFoN5k10zyvrVs0qfKBhyC5ogUQ6Ew6JUSswh78mbSO+IU3nTWsyOArqPCcShdQSadghBQ==",
+      "license": "MPL-2.0",
+      "dependencies": {
+        "detect-libc": "^2.0.3"
+      },
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      },
+      "optionalDependencies": {
+        "lightningcss-android-arm64": "1.31.1",
+        "lightningcss-darwin-arm64": "1.31.1",
+        "lightningcss-darwin-x64": "1.31.1",
+        "lightningcss-freebsd-x64": "1.31.1",
+        "lightningcss-linux-arm-gnueabihf": "1.31.1",
+        "lightningcss-linux-arm64-gnu": "1.31.1",
+        "lightningcss-linux-arm64-musl": "1.31.1",
+        "lightningcss-linux-x64-gnu": "1.31.1",
+        "lightningcss-linux-x64-musl": "1.31.1",
+        "lightningcss-win32-arm64-msvc": "1.31.1",
+        "lightningcss-win32-x64-msvc": "1.31.1"
+      }
+    },
+    "node_modules/lightningcss-android-arm64": {
+      "version": "1.31.1",
+      "resolved": "https://registry.npmjs.org/lightningcss-android-arm64/-/lightningcss-android-arm64-1.31.1.tgz",
+      "integrity": "sha512-HXJF3x8w9nQ4jbXRiNppBCqeZPIAfUo8zE/kOEGbW5NZvGc/K7nMxbhIr+YlFlHW5mpbg/YFPdbnCh1wAXCKFg==",
+      "cpu": [
+        "arm64"
+      ],
+      "license": "MPL-2.0",
+      "optional": true,
+      "os": [
+        "android"
+      ],
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/lightningcss-darwin-arm64": {
+      "version": "1.31.1",
+      "resolved": "https://registry.npmjs.org/lightningcss-darwin-arm64/-/lightningcss-darwin-arm64-1.31.1.tgz",
+      "integrity": "sha512-02uTEqf3vIfNMq3h/z2cJfcOXnQ0GRwQrkmPafhueLb2h7mqEidiCzkE4gBMEH65abHRiQvhdcQ+aP0D0g67sg==",
+      "cpu": [
+        "arm64"
+      ],
+      "license": "MPL-2.0",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/lightningcss-darwin-x64": {
+      "version": "1.31.1",
+      "resolved": "https://registry.npmjs.org/lightningcss-darwin-x64/-/lightningcss-darwin-x64-1.31.1.tgz",
+      "integrity": "sha512-1ObhyoCY+tGxtsz1lSx5NXCj3nirk0Y0kB/g8B8DT+sSx4G9djitg9ejFnjb3gJNWo7qXH4DIy2SUHvpoFwfTA==",
+      "cpu": [
+        "x64"
+      ],
+      "license": "MPL-2.0",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/lightningcss-freebsd-x64": {
+      "version": "1.31.1",
+      "resolved": "https://registry.npmjs.org/lightningcss-freebsd-x64/-/lightningcss-freebsd-x64-1.31.1.tgz",
+      "integrity": "sha512-1RINmQKAItO6ISxYgPwszQE1BrsVU5aB45ho6O42mu96UiZBxEXsuQ7cJW4zs4CEodPUioj/QrXW1r9pLUM74A==",
+      "cpu": [
+        "x64"
+      ],
+      "license": "MPL-2.0",
+      "optional": true,
+      "os": [
+        "freebsd"
+      ],
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/lightningcss-linux-arm-gnueabihf": {
+      "version": "1.31.1",
+      "resolved": "https://registry.npmjs.org/lightningcss-linux-arm-gnueabihf/-/lightningcss-linux-arm-gnueabihf-1.31.1.tgz",
+      "integrity": "sha512-OOCm2//MZJ87CdDK62rZIu+aw9gBv4azMJuA8/KB74wmfS3lnC4yoPHm0uXZ/dvNNHmnZnB8XLAZzObeG0nS1g==",
+      "cpu": [
+        "arm"
+      ],
+      "license": "MPL-2.0",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/lightningcss-linux-arm64-gnu": {
+      "version": "1.31.1",
+      "resolved": "https://registry.npmjs.org/lightningcss-linux-arm64-gnu/-/lightningcss-linux-arm64-gnu-1.31.1.tgz",
+      "integrity": "sha512-WKyLWztD71rTnou4xAD5kQT+982wvca7E6QoLpoawZ1gP9JM0GJj4Tp5jMUh9B3AitHbRZ2/H3W5xQmdEOUlLg==",
+      "cpu": [
+        "arm64"
+      ],
+      "license": "MPL-2.0",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/lightningcss-linux-arm64-musl": {
+      "version": "1.31.1",
+      "resolved": "https://registry.npmjs.org/lightningcss-linux-arm64-musl/-/lightningcss-linux-arm64-musl-1.31.1.tgz",
+      "integrity": "sha512-mVZ7Pg2zIbe3XlNbZJdjs86YViQFoJSpc41CbVmKBPiGmC4YrfeOyz65ms2qpAobVd7WQsbW4PdsSJEMymyIMg==",
+      "cpu": [
+        "arm64"
+      ],
+      "license": "MPL-2.0",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/lightningcss-linux-x64-gnu": {
+      "version": "1.31.1",
+      "resolved": "https://registry.npmjs.org/lightningcss-linux-x64-gnu/-/lightningcss-linux-x64-gnu-1.31.1.tgz",
+      "integrity": "sha512-xGlFWRMl+0KvUhgySdIaReQdB4FNudfUTARn7q0hh/V67PVGCs3ADFjw+6++kG1RNd0zdGRlEKa+T13/tQjPMA==",
+      "cpu": [
+        "x64"
+      ],
+      "license": "MPL-2.0",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/lightningcss-linux-x64-musl": {
+      "version": "1.31.1",
+      "resolved": "https://registry.npmjs.org/lightningcss-linux-x64-musl/-/lightningcss-linux-x64-musl-1.31.1.tgz",
+      "integrity": "sha512-eowF8PrKHw9LpoZii5tdZwnBcYDxRw2rRCyvAXLi34iyeYfqCQNA9rmUM0ce62NlPhCvof1+9ivRaTY6pSKDaA==",
+      "cpu": [
+        "x64"
+      ],
+      "license": "MPL-2.0",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/lightningcss-win32-arm64-msvc": {
+      "version": "1.31.1",
+      "resolved": "https://registry.npmjs.org/lightningcss-win32-arm64-msvc/-/lightningcss-win32-arm64-msvc-1.31.1.tgz",
+      "integrity": "sha512-aJReEbSEQzx1uBlQizAOBSjcmr9dCdL3XuC/6HLXAxmtErsj2ICo5yYggg1qOODQMtnjNQv2UHb9NpOuFtYe4w==",
+      "cpu": [
+        "arm64"
+      ],
+      "license": "MPL-2.0",
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/lightningcss-win32-x64-msvc": {
+      "version": "1.31.1",
+      "resolved": "https://registry.npmjs.org/lightningcss-win32-x64-msvc/-/lightningcss-win32-x64-msvc-1.31.1.tgz",
+      "integrity": "sha512-I9aiFrbd7oYHwlnQDqr1Roz+fTz61oDDJX7n9tYF9FJymH1cIN1DtKw3iYt6b8WZgEjoNwVSncwF4wx/ZedMhw==",
+      "cpu": [
+        "x64"
+      ],
+      "license": "MPL-2.0",
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/lines-and-columns": {
+      "version": "1.2.4",
+      "resolved": "https://registry.npmjs.org/lines-and-columns/-/lines-and-columns-1.2.4.tgz",
+      "integrity": "sha512-7ylylesZQ/PV29jhEDl3Ufjo6ZX7gCqJr5F7PKrqc93v7fzSymt1BpwEU8nAUXs8qzzvqhbjhK5QZg6Mt/HkBg==",
+      "license": "MIT"
+    },
+    "node_modules/log-symbols": {
+      "version": "6.0.0",
+      "resolved": "https://registry.npmjs.org/log-symbols/-/log-symbols-6.0.0.tgz",
+      "integrity": "sha512-i24m8rpwhmPIS4zscNzK6MSEhk0DUWa/8iYQWxhffV8jkI4Phvs3F+quL5xvS0gdQR0FyTCMMH33Y78dDTzzIw==",
+      "license": "MIT",
+      "dependencies": {
+        "chalk": "^5.3.0",
+        "is-unicode-supported": "^1.3.0"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/log-symbols/node_modules/is-unicode-supported": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/is-unicode-supported/-/is-unicode-supported-1.3.0.tgz",
+      "integrity": "sha512-43r2mRvz+8JRIKnWJ+3j8JtjRKZ6GmjzfaE/qiBJnikNnYv/6bagRJ1kUhNk8R5EX/GkobD+r+sfxCPJsiKBLQ==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
     "node_modules/long": {
       "version": "5.3.2",
       "resolved": "https://registry.npmjs.org/long/-/long-5.3.2.tgz",
@@ -1986,7 +4803,6 @@
       "version": "5.1.1",
       "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-5.1.1.tgz",
       "integrity": "sha512-KpNARQA3Iwv+jTA0utUVVbrh+Jlrr1Fv0e56GGzAFOXN7dk/FviaDW8LHmK52DlcH4WP2n6gI8vN1aesBFgo9w==",
-      "dev": true,
       "license": "ISC",
       "dependencies": {
         "yallist": "^3.0.2"
@@ -2001,6 +4817,131 @@
         "react": "^16.5.1 || ^17.0.0 || ^18.0.0 || ^19.0.0"
       }
     },
+    "node_modules/magic-string": {
+      "version": "0.30.21",
+      "resolved": "https://registry.npmjs.org/magic-string/-/magic-string-0.30.21.tgz",
+      "integrity": "sha512-vd2F4YUyEXKGcLHoq+TEyCjxueSeHnFxyyjNp80yg0XV4vUhnDer/lvvlqM/arB5bXQN5K2/3oinyCRyx8T2CQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@jridgewell/sourcemap-codec": "^1.5.5"
+      }
+    },
+    "node_modules/math-intrinsics": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/math-intrinsics/-/math-intrinsics-1.1.0.tgz",
+      "integrity": "sha512-/IXtbwEk5HTPyEwyKX6hGkYXxM9nbj64B+ilVJnC/R6B0pH5G4V3b0pVbL7DBj4tkhBAppbQUlf6F6Xl9LHu1g==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/media-typer": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/media-typer/-/media-typer-1.1.0.tgz",
+      "integrity": "sha512-aisnrDP4GNe06UcKFnV5bfMNPBUw4jsLGaWwWfnH3v02GnBuXX2MCVn5RbrWo0j3pczUilYblq7fQ7Nw2t5XKw==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
+    "node_modules/merge-descriptors": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/merge-descriptors/-/merge-descriptors-2.0.0.tgz",
+      "integrity": "sha512-Snk314V5ayFLhp3fkUREub6WtjBfPdCPY1Ln8/8munuLuiYhsABgBVWsozAG+MWMbVEvcdcpbi9R7ww22l9Q3g==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/merge-stream": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/merge-stream/-/merge-stream-2.0.0.tgz",
+      "integrity": "sha512-abv/qOcuPfk3URPfDzmZU1LKmuw8kT+0nIHvKrKgFrwifol/doWcdA4ZqsWQ8ENrFKkd67Mfpo/LovbIUsbt3w==",
+      "license": "MIT"
+    },
+    "node_modules/merge2": {
+      "version": "1.4.1",
+      "resolved": "https://registry.npmjs.org/merge2/-/merge2-1.4.1.tgz",
+      "integrity": "sha512-8q7VEgMJW4J8tcfVPy8g09NcQwZdbwFEqhe/WZkoIzjn/3TGDwtOCYtXGxA3O8tPzpczCCDgv+P2P5y00ZJOOg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 8"
+      }
+    },
+    "node_modules/micromatch": {
+      "version": "4.0.8",
+      "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-4.0.8.tgz",
+      "integrity": "sha512-PXwfBhYu0hBCPw8Dn0E+WDYb7af3dSLVWKi3HGv84IdF4TyFoC0ysxFd0Goxw7nSv4T/PzEJQxsYsEiFCKo2BA==",
+      "license": "MIT",
+      "dependencies": {
+        "braces": "^3.0.3",
+        "picomatch": "^2.3.1"
+      },
+      "engines": {
+        "node": ">=8.6"
+      }
+    },
+    "node_modules/micromatch/node_modules/picomatch": {
+      "version": "2.3.1",
+      "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.1.tgz",
+      "integrity": "sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=8.6"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/jonschlinkert"
+      }
+    },
+    "node_modules/mime-db": {
+      "version": "1.54.0",
+      "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.54.0.tgz",
+      "integrity": "sha512-aU5EJuIN2WDemCcAp2vFBfp/m4EAhWJnUNSSw0ixs7/kXbd6Pg64EmwJkNdFhB8aWt1sH2CTXrLxo/iAGV3oPQ==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
+    "node_modules/mime-types": {
+      "version": "3.0.2",
+      "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-3.0.2.tgz",
+      "integrity": "sha512-Lbgzdk0h4juoQ9fCKXW4by0UJqj+nOOrI9MJ1sSj4nI8aI2eo1qmvQEie4VD1glsS250n15LsWsYtCugiStS5A==",
+      "license": "MIT",
+      "dependencies": {
+        "mime-db": "^1.54.0"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/express"
+      }
+    },
+    "node_modules/mimic-fn": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/mimic-fn/-/mimic-fn-2.1.0.tgz",
+      "integrity": "sha512-OqbOk5oEQeAZ8WXWydlu9HJjz9WVdEIvamMCcXmuqUYjTknH/sqsWvhQ3vgwKFRR1HpjvNBKQ37nbJgYzGqGcg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=6"
+      }
+    },
+    "node_modules/mimic-function": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/mimic-function/-/mimic-function-5.0.1.tgz",
+      "integrity": "sha512-VP79XUPxV2CigYP3jWwAUFSku2aKqBH7uTAapFWCBqutsbmDo96KY5o8uh6U+/YSIn5OxJnXp73beVkpqMIGhA==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
     "node_modules/minimatch": {
       "version": "9.0.5",
       "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.5.tgz",
@@ -2016,6 +4957,15 @@
         "url": "https://github.com/sponsors/isaacs"
       }
     },
+    "node_modules/minimist": {
+      "version": "1.2.8",
+      "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.8.tgz",
+      "integrity": "sha512-2yyAR8qBkN3YuheJanUpWC5U3bb5osDywNB8RzDVlDwDHbocAJveqqj1u8+SVD7jkWT4yvsHCpWqqWqAxb0zCA==",
+      "license": "MIT",
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
     "node_modules/minipass": {
       "version": "7.1.2",
       "resolved": "https://registry.npmjs.org/minipass/-/minipass-7.1.2.tgz",
@@ -2031,11 +4981,63 @@
       "integrity": "sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA==",
       "license": "MIT"
     },
+    "node_modules/msw": {
+      "version": "2.12.10",
+      "resolved": "https://registry.npmjs.org/msw/-/msw-2.12.10.tgz",
+      "integrity": "sha512-G3VUymSE0/iegFnuipujpwyTM2GuZAKXNeerUSrG2+Eg391wW63xFs5ixWsK9MWzr1AGoSkYGmyAzNgbR3+urw==",
+      "hasInstallScript": true,
+      "license": "MIT",
+      "dependencies": {
+        "@inquirer/confirm": "^5.0.0",
+        "@mswjs/interceptors": "^0.41.2",
+        "@open-draft/deferred-promise": "^2.2.0",
+        "@types/statuses": "^2.0.6",
+        "cookie": "^1.0.2",
+        "graphql": "^16.12.0",
+        "headers-polyfill": "^4.0.2",
+        "is-node-process": "^1.2.0",
+        "outvariant": "^1.4.3",
+        "path-to-regexp": "^6.3.0",
+        "picocolors": "^1.1.1",
+        "rettime": "^0.10.1",
+        "statuses": "^2.0.2",
+        "strict-event-emitter": "^0.5.1",
+        "tough-cookie": "^6.0.0",
+        "type-fest": "^5.2.0",
+        "until-async": "^3.0.2",
+        "yargs": "^17.7.2"
+      },
+      "bin": {
+        "msw": "cli/index.js"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/mswjs"
+      },
+      "peerDependencies": {
+        "typescript": ">= 4.8.x"
+      },
+      "peerDependenciesMeta": {
+        "typescript": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/mute-stream": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/mute-stream/-/mute-stream-2.0.0.tgz",
+      "integrity": "sha512-WWdIxpyjEn+FhQJQQv9aQAYlHoNVdzIzUySNV1gHUPDSdZJ3yZn7pAAbQcV7B56Mvu881q9FZV+0Vx2xC44VWA==",
+      "license": "ISC",
+      "engines": {
+        "node": "^18.17.0 || >=20.5.0"
+      }
+    },
     "node_modules/nanoid": {
       "version": "3.3.11",
       "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.11.tgz",
       "integrity": "sha512-N8SpfPUnUp1bK+PMYW8qSWdl9U+wwNWI4QKxOYDy9JAro3WMX7p2OeVRF9v+347pnakNevPmiHhNmZ2HbFA76w==",
-      "dev": true,
       "funding": [
         {
           "type": "github",
@@ -2050,6 +5052,15 @@
         "node": "^10 || ^12 || ^13.7 || ^14 || >=15.0.1"
       }
     },
+    "node_modules/negotiator": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/negotiator/-/negotiator-1.0.0.tgz",
+      "integrity": "sha512-8Ofs/AUQh8MaEcrlq5xOX0CQ9ypTF5dl78mjlMNfOK08fzpgTHQRQPBxcPlEtIw0yRpws+Zo/3r+5WRby7u3Gg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
     "node_modules/node-domexception": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/node-domexception/-/node-domexception-1.0.0.tgz",
@@ -2092,7 +5103,172 @@
       "version": "2.0.27",
       "resolved": "https://registry.npmjs.org/node-releases/-/node-releases-2.0.27.tgz",
       "integrity": "sha512-nmh3lCkYZ3grZvqcCH+fjmQ7X+H0OeZgP40OierEaAptX4XofMh5kwNbWh7lBduUzCcV/8kZ+NDLCwm2iorIlA==",
-      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/npm-run-path": {
+      "version": "6.0.0",
+      "resolved": "https://registry.npmjs.org/npm-run-path/-/npm-run-path-6.0.0.tgz",
+      "integrity": "sha512-9qny7Z9DsQU8Ou39ERsPU4OZQlSTP47ShQzuKZ6PRXpYLtIFgl/DEBYEXKlvcEa+9tHVcK8CF81Y2V72qaZhWA==",
+      "license": "MIT",
+      "dependencies": {
+        "path-key": "^4.0.0",
+        "unicorn-magic": "^0.3.0"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/npm-run-path/node_modules/path-key": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/path-key/-/path-key-4.0.0.tgz",
+      "integrity": "sha512-haREypq7xkM7ErfgIyA0z+Bj4AGKlMSdlQE2jvJo6huWD1EdkKYV+G/T4nq0YEF2vgTT8kqMFKo1uHn950r4SQ==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/object-assign": {
+      "version": "4.1.1",
+      "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz",
+      "integrity": "sha512-rJgTQnkUnH1sFw8yT6VSU3zD3sWmu6sZhIseY8VX+GRu3P6F7Fu+JNDoXfklElbLJSnc3FUQHVe4cU5hj+BcUg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
+    "node_modules/object-inspect": {
+      "version": "1.13.4",
+      "resolved": "https://registry.npmjs.org/object-inspect/-/object-inspect-1.13.4.tgz",
+      "integrity": "sha512-W67iLl4J2EXEGTbfeHCffrjDfitvLANg0UlX3wFUUSTx92KXRFegMHUVgSqE+wvhAbi4WqjGg9czysTV2Epbew==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/object-treeify": {
+      "version": "1.1.33",
+      "resolved": "https://registry.npmjs.org/object-treeify/-/object-treeify-1.1.33.tgz",
+      "integrity": "sha512-EFVjAYfzWqWsBMRHPMAXLCDIJnpMhdWAqR7xG6M6a2cs6PMFpl/+Z20w9zDW4vkxOFfddegBKq9Rehd0bxWE7A==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 10"
+      }
+    },
+    "node_modules/on-finished": {
+      "version": "2.4.1",
+      "resolved": "https://registry.npmjs.org/on-finished/-/on-finished-2.4.1.tgz",
+      "integrity": "sha512-oVlzkg3ENAhCk2zdv7IJwd/QUD4z2RxRwpkcGY8psCVcCYZNq4wYnVWALHM+brtuJjePWiYF/ClmuDr8Ch5+kg==",
+      "license": "MIT",
+      "dependencies": {
+        "ee-first": "1.1.1"
+      },
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
+    "node_modules/once": {
+      "version": "1.4.0",
+      "resolved": "https://registry.npmjs.org/once/-/once-1.4.0.tgz",
+      "integrity": "sha512-lNaJgI+2Q5URQBkccEKHTQOPaXdUxnZZElQTZY0MFUAuaEqe1E+Nyvgdz/aIyNi6Z9MzO5dv1H8n58/GELp3+w==",
+      "license": "ISC",
+      "dependencies": {
+        "wrappy": "1"
+      }
+    },
+    "node_modules/onetime": {
+      "version": "7.0.0",
+      "resolved": "https://registry.npmjs.org/onetime/-/onetime-7.0.0.tgz",
+      "integrity": "sha512-VXJjc87FScF88uafS3JllDgvAm+c/Slfz06lorj2uAY34rlUu0Nt+v8wreiImcrgAjjIHp1rXpTDlLOGw29WwQ==",
+      "license": "MIT",
+      "dependencies": {
+        "mimic-function": "^5.0.0"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/open": {
+      "version": "11.0.0",
+      "resolved": "https://registry.npmjs.org/open/-/open-11.0.0.tgz",
+      "integrity": "sha512-smsWv2LzFjP03xmvFoJ331ss6h+jixfA4UUV/Bsiyuu4YJPfN+FIQGOIiv4w9/+MoHkfkJ22UIaQWRVFRfH6Vw==",
+      "license": "MIT",
+      "dependencies": {
+        "default-browser": "^5.4.0",
+        "define-lazy-prop": "^3.0.0",
+        "is-in-ssh": "^1.0.0",
+        "is-inside-container": "^1.0.0",
+        "powershell-utils": "^0.1.0",
+        "wsl-utils": "^0.3.0"
+      },
+      "engines": {
+        "node": ">=20"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/ora": {
+      "version": "8.2.0",
+      "resolved": "https://registry.npmjs.org/ora/-/ora-8.2.0.tgz",
+      "integrity": "sha512-weP+BZ8MVNnlCm8c0Qdc1WSWq4Qn7I+9CJGm7Qali6g44e/PUzbjNqJX5NJ9ljlNMosfJvg1fKEGILklK9cwnw==",
+      "license": "MIT",
+      "dependencies": {
+        "chalk": "^5.3.0",
+        "cli-cursor": "^5.0.0",
+        "cli-spinners": "^2.9.2",
+        "is-interactive": "^2.0.0",
+        "is-unicode-supported": "^2.0.0",
+        "log-symbols": "^6.0.0",
+        "stdin-discarder": "^0.2.2",
+        "string-width": "^7.2.0",
+        "strip-ansi": "^7.1.0"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/ora/node_modules/emoji-regex": {
+      "version": "10.6.0",
+      "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-10.6.0.tgz",
+      "integrity": "sha512-toUI84YS5YmxW219erniWD0CIVOo46xGKColeNQRgOzDorgBi1v4D71/OFzgD9GO2UGKIv1C3Sp8DAn0+j5w7A==",
+      "license": "MIT"
+    },
+    "node_modules/ora/node_modules/string-width": {
+      "version": "7.2.0",
+      "resolved": "https://registry.npmjs.org/string-width/-/string-width-7.2.0.tgz",
+      "integrity": "sha512-tsaTIkKW9b4N+AEj+SVA+WhJzV7/zMhcSu78mLKWSk7cXMOSHsBKFWUs0fWwq8QyK3MgJBQRX6Gbi4kYbdvGkQ==",
+      "license": "MIT",
+      "dependencies": {
+        "emoji-regex": "^10.3.0",
+        "get-east-asian-width": "^1.0.0",
+        "strip-ansi": "^7.1.0"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/outvariant": {
+      "version": "1.4.3",
+      "resolved": "https://registry.npmjs.org/outvariant/-/outvariant-1.4.3.tgz",
+      "integrity": "sha512-+Sl2UErvtsoajRDKCE5/dBz4DIvHXQQnAxtQTF04OJxY0+DyZXSo5P5Bb7XYWOh81syohlYL24hbDwxedPUJCA==",
       "license": "MIT"
     },
     "node_modules/package-json-from-dist": {
@@ -2101,6 +5277,69 @@
       "integrity": "sha512-UEZIS3/by4OC8vL3P2dTXRETpebLI2NiI5vIrjaD/5UtrkFX/tNbwjTSRAGC/+7CAo2pIcBaRgWmcBBHcsaCIw==",
       "license": "BlueOak-1.0.0"
     },
+    "node_modules/package-manager-detector": {
+      "version": "1.6.0",
+      "resolved": "https://registry.npmjs.org/package-manager-detector/-/package-manager-detector-1.6.0.tgz",
+      "integrity": "sha512-61A5ThoTiDG/C8s8UMZwSorAGwMJ0ERVGj2OjoW5pAalsNOg15+iQiPzrLJ4jhZ1HJzmC2PIHT2oEiH3R5fzNA==",
+      "license": "MIT"
+    },
+    "node_modules/parent-module": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/parent-module/-/parent-module-1.0.1.tgz",
+      "integrity": "sha512-GQ2EWRpQV8/o+Aw8YqtfZZPfNRWZYkbidE9k5rpl/hC3vtHHBfGm2Ifi6qWV+coDGkrUKZAxE3Lot5kcsRlh+g==",
+      "license": "MIT",
+      "dependencies": {
+        "callsites": "^3.0.0"
+      },
+      "engines": {
+        "node": ">=6"
+      }
+    },
+    "node_modules/parse-json": {
+      "version": "5.2.0",
+      "resolved": "https://registry.npmjs.org/parse-json/-/parse-json-5.2.0.tgz",
+      "integrity": "sha512-ayCKvm/phCGxOkYRSCM82iDwct8/EonSEgCSxWxD7ve6jHggsFl4fZVQBPRNgQoKiuV/odhFrGzQXZwbifC8Rg==",
+      "license": "MIT",
+      "dependencies": {
+        "@babel/code-frame": "^7.0.0",
+        "error-ex": "^1.3.1",
+        "json-parse-even-better-errors": "^2.3.0",
+        "lines-and-columns": "^1.1.6"
+      },
+      "engines": {
+        "node": ">=8"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/parse-ms": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/parse-ms/-/parse-ms-4.0.0.tgz",
+      "integrity": "sha512-TXfryirbmq34y8QBwgqCVLi+8oA3oWx2eAnSn62ITyEhEYaWRlVZ2DvMM9eZbMs/RfxPu/PK/aBLyGj4IrqMHw==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/parseurl": {
+      "version": "1.3.3",
+      "resolved": "https://registry.npmjs.org/parseurl/-/parseurl-1.3.3.tgz",
+      "integrity": "sha512-CiyeOxFT/JZyN5m0z9PfXw4SCBJ6Sygz1Dpl0wqjlhDEGGBP1GnsUVEL0p63hoG1fcj3fHynXi9NYO4nWOL+qQ==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
+    "node_modules/path-browserify": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/path-browserify/-/path-browserify-1.0.1.tgz",
+      "integrity": "sha512-b7uo2UCUOYZcnF/3ID0lulOJi/bafxa1xPe7ZPsammBSpjSWQkjNxlt635YGS2MiR9GjvuXCtz2emr3jbsz98g==",
+      "license": "MIT"
+    },
     "node_modules/path-key": {
       "version": "3.1.1",
       "resolved": "https://registry.npmjs.org/path-key/-/path-key-3.1.1.tgz",
@@ -2132,18 +5371,22 @@
       "integrity": "sha512-JNAzZcXrCt42VGLuYz0zfAzDfAvJWW6AfYlDBQyDV5DClI2m5sAmK+OIO7s59XfsRsWHp02jAJrRadPRGTt6SQ==",
       "license": "ISC"
     },
+    "node_modules/path-to-regexp": {
+      "version": "6.3.0",
+      "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-6.3.0.tgz",
+      "integrity": "sha512-Yhpw4T9C6hPpgPeA28us07OJeqZ5EzQTkbfwuhsUg0c237RomFoETJgmp2sa3F/41gfLE6G5cqcYwznmeEeOlQ==",
+      "license": "MIT"
+    },
     "node_modules/picocolors": {
       "version": "1.1.1",
       "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.1.1.tgz",
       "integrity": "sha512-xceH2snhtb5M9liqDsmEw56le376mTZkEX/jEb/RxNFyegNul7eNslCXP9FDj/Lcu0X8KEyMceP2ntpaHrDEVA==",
-      "dev": true,
       "license": "ISC"
     },
     "node_modules/picomatch": {
       "version": "4.0.3",
       "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-4.0.3.tgz",
       "integrity": "sha512-5gTmgEY/sqK6gFXLIsQNH19lWb4ebPDLA4SdLP7dsWkIXHWlG66oPuVvXSGFPppYZz8ZDZq0dYYrbHfBCVUb1Q==",
-      "dev": true,
       "license": "MIT",
       "engines": {
         "node": ">=12"
@@ -2152,11 +5395,19 @@
         "url": "https://github.com/sponsors/jonschlinkert"
       }
     },
+    "node_modules/pkce-challenge": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/pkce-challenge/-/pkce-challenge-5.0.1.tgz",
+      "integrity": "sha512-wQ0b/W4Fr01qtpHlqSqspcj3EhBvimsdh0KlHhH8HRZnMsEa0ea2fTULOXOS9ccQr3om+GcGRk4e+isrZWV8qQ==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=16.20.0"
+      }
+    },
     "node_modules/postcss": {
-      "version": "8.5.6",
-      "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.5.6.tgz",
-      "integrity": "sha512-3Ybi1tAuwAP9s0r1UQ2J4n5Y0G05bJkpUIO0/bI9MhwmD70S5aTWbXGBwxHrelT+XM1k6dM0pk+SwNkpTRN7Pg==",
-      "dev": true,
+      "version": "8.5.8",
+      "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.5.8.tgz",
+      "integrity": "sha512-OW/rX8O/jXnm82Ey1k44pObPtdblfiuWnrd8X7GJ7emImCOstunGbXUpp7HdBrFQX6rJzn3sPT397Wp5aCwCHg==",
       "funding": [
         {
           "type": "opencollective",
@@ -2181,6 +5432,75 @@
         "node": "^10 || ^12 || >=14"
       }
     },
+    "node_modules/postcss-selector-parser": {
+      "version": "7.1.1",
+      "resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-7.1.1.tgz",
+      "integrity": "sha512-orRsuYpJVw8LdAwqqLykBj9ecS5/cRHlI5+nvTo8LcCKmzDmqVORXtOIYEEQuL9D4BxtA1lm5isAqzQZCoQ6Eg==",
+      "license": "MIT",
+      "dependencies": {
+        "cssesc": "^3.0.0",
+        "util-deprecate": "^1.0.2"
+      },
+      "engines": {
+        "node": ">=4"
+      }
+    },
+    "node_modules/postcss-value-parser": {
+      "version": "4.2.0",
+      "resolved": "https://registry.npmjs.org/postcss-value-parser/-/postcss-value-parser-4.2.0.tgz",
+      "integrity": "sha512-1NNCs6uurfkVbeXG4S8JFT9t19m45ICnif8zWLd5oPSZ50QnwMfK+H3jv408d4jw/7Bttv5axS5IiHoLaVNHeQ==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/powershell-utils": {
+      "version": "0.1.0",
+      "resolved": "https://registry.npmjs.org/powershell-utils/-/powershell-utils-0.1.0.tgz",
+      "integrity": "sha512-dM0jVuXJPsDN6DvRpea484tCUaMiXWjuCn++HGTqUWzGDjv5tZkEZldAJ/UMlqRYGFrD/etByo4/xOuC/snX2A==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=20"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/pretty-ms": {
+      "version": "9.3.0",
+      "resolved": "https://registry.npmjs.org/pretty-ms/-/pretty-ms-9.3.0.tgz",
+      "integrity": "sha512-gjVS5hOP+M3wMm5nmNOucbIrqudzs9v/57bWRHQWLYklXqoXKrVfYW2W9+glfGsqtPgpiz5WwyEEB+ksXIx3gQ==",
+      "license": "MIT",
+      "dependencies": {
+        "parse-ms": "^4.0.0"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/prompts": {
+      "version": "2.4.2",
+      "resolved": "https://registry.npmjs.org/prompts/-/prompts-2.4.2.tgz",
+      "integrity": "sha512-NxNv/kLguCA7p3jE8oL2aEBsrJWgAakBpgmgK6lpPWV+WuOmY6r2/zbAVnP+T8bQlA0nzHXSJSJW0Hq7ylaD2Q==",
+      "license": "MIT",
+      "dependencies": {
+        "kleur": "^3.0.3",
+        "sisteransi": "^1.0.5"
+      },
+      "engines": {
+        "node": ">= 6"
+      }
+    },
+    "node_modules/prompts/node_modules/kleur": {
+      "version": "3.0.3",
+      "resolved": "https://registry.npmjs.org/kleur/-/kleur-3.0.3.tgz",
+      "integrity": "sha512-eTIzlVOSUR+JxdDFepEYcBMtZ9Qqdef+rnzWdRZuMbOywu5tO2w2N7rqjoANZ5k9vywhL6Br1VRjUIgTQx4E8w==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=6"
+      }
+    },
     "node_modules/protobufjs": {
       "version": "7.5.4",
       "resolved": "https://registry.npmjs.org/protobufjs/-/protobufjs-7.5.4.tgz",
@@ -2205,6 +5525,78 @@
         "node": ">=12.0.0"
       }
     },
+    "node_modules/proxy-addr": {
+      "version": "2.0.7",
+      "resolved": "https://registry.npmjs.org/proxy-addr/-/proxy-addr-2.0.7.tgz",
+      "integrity": "sha512-llQsMLSUDUPT44jdrU/O37qlnifitDP+ZwrmmZcoSKyLKvtZxpyV0n2/bD/N4tBAAZ/gJEdZU7KMraoK1+XYAg==",
+      "license": "MIT",
+      "dependencies": {
+        "forwarded": "0.2.0",
+        "ipaddr.js": "1.9.1"
+      },
+      "engines": {
+        "node": ">= 0.10"
+      }
+    },
+    "node_modules/qs": {
+      "version": "6.15.0",
+      "resolved": "https://registry.npmjs.org/qs/-/qs-6.15.0.tgz",
+      "integrity": "sha512-mAZTtNCeetKMH+pSjrb76NAM8V9a05I9aBZOHztWy/UqcJdQYNsf59vrRKWnojAT9Y+GbIvoTBC++CPHqpDBhQ==",
+      "license": "BSD-3-Clause",
+      "dependencies": {
+        "side-channel": "^1.1.0"
+      },
+      "engines": {
+        "node": ">=0.6"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/queue-microtask": {
+      "version": "1.2.3",
+      "resolved": "https://registry.npmjs.org/queue-microtask/-/queue-microtask-1.2.3.tgz",
+      "integrity": "sha512-NuaNSa6flKT5JaSYQzJok04JzTL1CA6aGhv5rfLW3PgqA+M2ChpZQnAC8h8i4ZFkBS8X5RqkDBHA7r4hej3K9A==",
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/feross"
+        },
+        {
+          "type": "patreon",
+          "url": "https://www.patreon.com/feross"
+        },
+        {
+          "type": "consulting",
+          "url": "https://feross.org/support"
+        }
+      ],
+      "license": "MIT"
+    },
+    "node_modules/range-parser": {
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/range-parser/-/range-parser-1.2.1.tgz",
+      "integrity": "sha512-Hrgsx+orqoygnmhFbKaHE6c296J+HTAQXoxEF6gNupROmmGJRoyzfG3ccAveqCBrwr/2yxQ5BVd/GTl5agOwSg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
+    "node_modules/raw-body": {
+      "version": "3.0.2",
+      "resolved": "https://registry.npmjs.org/raw-body/-/raw-body-3.0.2.tgz",
+      "integrity": "sha512-K5zQjDllxWkf7Z5xJdV0/B0WTNqx6vxG70zJE4N0kBs4LovmEYWJzQGxC9bS9RAKu3bgM40lrd5zoLJ12MQ5BA==",
+      "license": "MIT",
+      "dependencies": {
+        "bytes": "~3.1.2",
+        "http-errors": "~2.0.1",
+        "iconv-lite": "~0.7.0",
+        "unpipe": "~1.0.0"
+      },
+      "engines": {
+        "node": ">= 0.10"
+      }
+    },
     "node_modules/react": {
       "version": "19.2.4",
       "resolved": "https://registry.npmjs.org/react/-/react-19.2.4.tgz",
@@ -2274,6 +5666,87 @@
         "react-dom": ">=18"
       }
     },
+    "node_modules/recast": {
+      "version": "0.23.11",
+      "resolved": "https://registry.npmjs.org/recast/-/recast-0.23.11.tgz",
+      "integrity": "sha512-YTUo+Flmw4ZXiWfQKGcwwc11KnoRAYgzAE2E7mXKCjSviTKShtxBsN6YUUBB2gtaBzKzeKunxhUwNHQuRryhWA==",
+      "license": "MIT",
+      "dependencies": {
+        "ast-types": "^0.16.1",
+        "esprima": "~4.0.0",
+        "source-map": "~0.6.1",
+        "tiny-invariant": "^1.3.3",
+        "tslib": "^2.0.1"
+      },
+      "engines": {
+        "node": ">= 4"
+      }
+    },
+    "node_modules/require-directory": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/require-directory/-/require-directory-2.1.1.tgz",
+      "integrity": "sha512-fGxEI7+wsG9xrvdjsrlmL22OMTTiHRwAMroiEeMgq8gzoLC/PQr7RsRDSTLUg/bZAZtF+TVIkHc6/4RIKrui+Q==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
+    "node_modules/require-from-string": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/require-from-string/-/require-from-string-2.0.2.tgz",
+      "integrity": "sha512-Xf0nWe6RseziFMu+Ap9biiUbmplq6S9/p+7w7YXP/JBHhrUDDUhwa+vANyubuqfZWTveU//DYVGsDG7RKL/vEw==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
+    "node_modules/reselect": {
+      "version": "5.1.1",
+      "resolved": "https://registry.npmjs.org/reselect/-/reselect-5.1.1.tgz",
+      "integrity": "sha512-K/BG6eIky/SBpzfHZv/dd+9JBFiS4SWV7FIujVyJRux6e45+73RaUHXLmIR1f7WOMaQ0U1km6qwklRQxpJJY0w==",
+      "license": "MIT"
+    },
+    "node_modules/resolve-from": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/resolve-from/-/resolve-from-4.0.0.tgz",
+      "integrity": "sha512-pb/MYmXstAkysRFx8piNI1tGFNQIFA3vkE3Gq4EuA1dF6gHp/+vgZqsCGJapvy8N3Q+4o7FwvquPJcnZ7RYy4g==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=4"
+      }
+    },
+    "node_modules/restore-cursor": {
+      "version": "5.1.0",
+      "resolved": "https://registry.npmjs.org/restore-cursor/-/restore-cursor-5.1.0.tgz",
+      "integrity": "sha512-oMA2dcrw6u0YfxJQXm342bFKX/E4sG9rbTzO9ptUcR/e8A33cHuvStiYOwH7fszkZlZ1z/ta9AAoPk2F4qIOHA==",
+      "license": "MIT",
+      "dependencies": {
+        "onetime": "^7.0.0",
+        "signal-exit": "^4.1.0"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/rettime": {
+      "version": "0.10.1",
+      "resolved": "https://registry.npmjs.org/rettime/-/rettime-0.10.1.tgz",
+      "integrity": "sha512-uyDrIlUEH37cinabq0AX4QbgV4HbFZ/gqoiunWQ1UqBtRvTTytwhNYjE++pO/MjPTZL5KQCf2bEoJ/BJNVQ5Kw==",
+      "license": "MIT"
+    },
+    "node_modules/reusify": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/reusify/-/reusify-1.1.0.tgz",
+      "integrity": "sha512-g6QUff04oZpHs0eG5p83rFLhHeV00ug/Yf9nZM6fLeUrPguBTkTQOdpAWWspMh55TZfVQDPaN3NQJfbVRAxdIw==",
+      "license": "MIT",
+      "engines": {
+        "iojs": ">=1.0.0",
+        "node": ">=0.10.0"
+      }
+    },
     "node_modules/rimraf": {
       "version": "5.0.10",
       "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-5.0.10.tgz",
@@ -2293,7 +5766,6 @@
       "version": "4.57.1",
       "resolved": "https://registry.npmjs.org/rollup/-/rollup-4.57.1.tgz",
       "integrity": "sha512-oQL6lgK3e2QZeQ7gcgIkS2YZPg5slw37hYufJ3edKlfQSGGm8ICoxswK15ntSzF/a8+h7ekRy7k7oWc3BQ7y8A==",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "@types/estree": "1.0.8"
@@ -2334,6 +5806,67 @@
         "fsevents": "~2.3.2"
       }
     },
+    "node_modules/router": {
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/router/-/router-2.2.0.tgz",
+      "integrity": "sha512-nLTrUKm2UyiL7rlhapu/Zl45FwNgkZGaCpZbIHajDYgwlJCOzLSk+cIPAnsEqV955GjILJnKbdQC1nVPz+gAYQ==",
+      "license": "MIT",
+      "dependencies": {
+        "debug": "^4.4.0",
+        "depd": "^2.0.0",
+        "is-promise": "^4.0.0",
+        "parseurl": "^1.3.3",
+        "path-to-regexp": "^8.0.0"
+      },
+      "engines": {
+        "node": ">= 18"
+      }
+    },
+    "node_modules/router/node_modules/path-to-regexp": {
+      "version": "8.3.0",
+      "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-8.3.0.tgz",
+      "integrity": "sha512-7jdwVIRtsP8MYpdXSwOS0YdD0Du+qOoF/AEPIt88PcCFrZCzx41oxku1jD88hZBwbNUIEfpqvuhjFaMAqMTWnA==",
+      "license": "MIT",
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/express"
+      }
+    },
+    "node_modules/run-applescript": {
+      "version": "7.1.0",
+      "resolved": "https://registry.npmjs.org/run-applescript/-/run-applescript-7.1.0.tgz",
+      "integrity": "sha512-DPe5pVFaAsinSaV6QjQ6gdiedWDcRCbUuiQfQa2wmWV7+xC9bGulGI8+TdRmoFkAPaBXk8CrAbnlY2ISniJ47Q==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/run-parallel": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/run-parallel/-/run-parallel-1.2.0.tgz",
+      "integrity": "sha512-5l4VyZR86LZ/lDxZTR6jqL8AFE2S0IFLMP26AbjsLVADxHdhB/c0GUsH+y39UfCi3dzz8OlQuPmnaJOMoDHQBA==",
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/feross"
+        },
+        {
+          "type": "patreon",
+          "url": "https://www.patreon.com/feross"
+        },
+        {
+          "type": "consulting",
+          "url": "https://feross.org/support"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "queue-microtask": "^1.2.2"
+      }
+    },
     "node_modules/safe-buffer": {
       "version": "5.2.1",
       "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.2.1.tgz",
@@ -2354,6 +5887,12 @@
       ],
       "license": "MIT"
     },
+    "node_modules/safer-buffer": {
+      "version": "2.1.2",
+      "resolved": "https://registry.npmjs.org/safer-buffer/-/safer-buffer-2.1.2.tgz",
+      "integrity": "sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg==",
+      "license": "MIT"
+    },
     "node_modules/scheduler": {
       "version": "0.27.0",
       "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.27.0.tgz",
@@ -2364,18 +5903,114 @@
       "version": "6.3.1",
       "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz",
       "integrity": "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==",
-      "dev": true,
       "license": "ISC",
       "bin": {
         "semver": "bin/semver.js"
       }
     },
+    "node_modules/send": {
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/send/-/send-1.2.1.tgz",
+      "integrity": "sha512-1gnZf7DFcoIcajTjTwjwuDjzuz4PPcY2StKPlsGAQ1+YH20IRVrBaXSWmdjowTJ6u8Rc01PoYOGHXfP1mYcZNQ==",
+      "license": "MIT",
+      "dependencies": {
+        "debug": "^4.4.3",
+        "encodeurl": "^2.0.0",
+        "escape-html": "^1.0.3",
+        "etag": "^1.8.1",
+        "fresh": "^2.0.0",
+        "http-errors": "^2.0.1",
+        "mime-types": "^3.0.2",
+        "ms": "^2.1.3",
+        "on-finished": "^2.4.1",
+        "range-parser": "^1.2.1",
+        "statuses": "^2.0.2"
+      },
+      "engines": {
+        "node": ">= 18"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/express"
+      }
+    },
+    "node_modules/serve-static": {
+      "version": "2.2.1",
+      "resolved": "https://registry.npmjs.org/serve-static/-/serve-static-2.2.1.tgz",
+      "integrity": "sha512-xRXBn0pPqQTVQiC8wyQrKs2MOlX24zQ0POGaj0kultvoOCstBQM5yvOhAVSUwOMjQtTvsPWoNCHfPGwaaQJhTw==",
+      "license": "MIT",
+      "dependencies": {
+        "encodeurl": "^2.0.0",
+        "escape-html": "^1.0.3",
+        "parseurl": "^1.3.3",
+        "send": "^1.2.0"
+      },
+      "engines": {
+        "node": ">= 18"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/express"
+      }
+    },
     "node_modules/set-cookie-parser": {
       "version": "2.7.2",
       "resolved": "https://registry.npmjs.org/set-cookie-parser/-/set-cookie-parser-2.7.2.tgz",
       "integrity": "sha512-oeM1lpU/UvhTxw+g3cIfxXHyJRc/uidd3yK1P242gzHds0udQBYzs3y8j4gCCW+ZJ7ad0yctld8RYO+bdurlvw==",
       "license": "MIT"
     },
+    "node_modules/setprototypeof": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/setprototypeof/-/setprototypeof-1.2.0.tgz",
+      "integrity": "sha512-E5LDX7Wrp85Kil5bhZv46j8jOeboKq5JMmYM3gVGdGH8xFpPWXUMsNrlODCrkoxMEeNi/XZIwuRvY4XNwYMJpw==",
+      "license": "ISC"
+    },
+    "node_modules/shadcn": {
+      "version": "4.0.2",
+      "resolved": "https://registry.npmjs.org/shadcn/-/shadcn-4.0.2.tgz",
+      "integrity": "sha512-U6BxywcVt5Vy+iLdjoyWTPcuz2RQNad09tjJsW8hyKtxlx7VAvzHIvoNxvXN+gxWt/HX8kt/cVNk8AXcmPUaNQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@antfu/ni": "^25.0.0",
+        "@babel/core": "^7.28.0",
+        "@babel/parser": "^7.28.0",
+        "@babel/plugin-transform-typescript": "^7.28.0",
+        "@babel/preset-typescript": "^7.27.1",
+        "@dotenvx/dotenvx": "^1.48.4",
+        "@modelcontextprotocol/sdk": "^1.26.0",
+        "@types/validate-npm-package-name": "^4.0.2",
+        "browserslist": "^4.26.2",
+        "commander": "^14.0.0",
+        "cosmiconfig": "^9.0.0",
+        "dedent": "^1.6.0",
+        "deepmerge": "^4.3.1",
+        "diff": "^8.0.2",
+        "execa": "^9.6.0",
+        "fast-glob": "^3.3.3",
+        "fs-extra": "^11.3.1",
+        "fuzzysort": "^3.1.0",
+        "https-proxy-agent": "^7.0.6",
+        "kleur": "^4.1.5",
+        "msw": "^2.10.4",
+        "node-fetch": "^3.3.2",
+        "open": "^11.0.0",
+        "ora": "^8.2.0",
+        "postcss": "^8.5.6",
+        "postcss-selector-parser": "^7.1.0",
+        "prompts": "^2.4.2",
+        "recast": "^0.23.11",
+        "stringify-object": "^5.0.0",
+        "tailwind-merge": "^3.0.1",
+        "ts-morph": "^26.0.0",
+        "tsconfig-paths": "^4.2.0",
+        "validate-npm-package-name": "^7.0.1",
+        "zod": "^3.24.1",
+        "zod-to-json-schema": "^3.24.6"
+      },
+      "bin": {
+        "shadcn": "dist/index.js"
+      }
+    },
     "node_modules/shebang-command": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/shebang-command/-/shebang-command-2.0.0.tgz",
@@ -2397,6 +6032,78 @@
         "node": ">=8"
       }
     },
+    "node_modules/side-channel": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/side-channel/-/side-channel-1.1.0.tgz",
+      "integrity": "sha512-ZX99e6tRweoUXqR+VBrslhda51Nh5MTQwou5tnUDgbtyM0dBgmhEDtWGP/xbKn6hqfPRHujUNwz5fy/wbbhnpw==",
+      "license": "MIT",
+      "dependencies": {
+        "es-errors": "^1.3.0",
+        "object-inspect": "^1.13.3",
+        "side-channel-list": "^1.0.0",
+        "side-channel-map": "^1.0.1",
+        "side-channel-weakmap": "^1.0.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/side-channel-list": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/side-channel-list/-/side-channel-list-1.0.0.tgz",
+      "integrity": "sha512-FCLHtRD/gnpCiCHEiJLOwdmFP+wzCmDEkc9y7NsYxeF4u7Btsn1ZuwgwJGxImImHicJArLP4R0yX4c2KCrMrTA==",
+      "license": "MIT",
+      "dependencies": {
+        "es-errors": "^1.3.0",
+        "object-inspect": "^1.13.3"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/side-channel-map": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/side-channel-map/-/side-channel-map-1.0.1.tgz",
+      "integrity": "sha512-VCjCNfgMsby3tTdo02nbjtM/ewra6jPHmpThenkTYh8pG9ucZ/1P8So4u4FGBek/BjpOVsDCMoLA/iuBKIFXRA==",
+      "license": "MIT",
+      "dependencies": {
+        "call-bound": "^1.0.2",
+        "es-errors": "^1.3.0",
+        "get-intrinsic": "^1.2.5",
+        "object-inspect": "^1.13.3"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/side-channel-weakmap": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/side-channel-weakmap/-/side-channel-weakmap-1.0.2.tgz",
+      "integrity": "sha512-WPS/HvHQTYnHisLo9McqBHOJk2FkHO/tlpvldyrnem4aeQp4hai3gythswg6p01oSoTl58rcpiFAjF2br2Ak2A==",
+      "license": "MIT",
+      "dependencies": {
+        "call-bound": "^1.0.2",
+        "es-errors": "^1.3.0",
+        "get-intrinsic": "^1.2.5",
+        "object-inspect": "^1.13.3",
+        "side-channel-map": "^1.0.1"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
     "node_modules/signal-exit": {
       "version": "4.1.0",
       "resolved": "https://registry.npmjs.org/signal-exit/-/signal-exit-4.1.0.tgz",
@@ -2409,16 +6116,57 @@
         "url": "https://github.com/sponsors/isaacs"
       }
     },
-    "node_modules/source-map-js": {
-      "version": "1.2.1",
-      "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.2.1.tgz",
-      "integrity": "sha512-UXWMKhLOwVKb728IUtQPXxfYU+usdybtUrK/8uGE8CQMvrhOpwvzDBwj0QhSL7MQc7vIsISBG8VQ8+IDQxpfQA==",
-      "dev": true,
+    "node_modules/sisteransi": {
+      "version": "1.0.5",
+      "resolved": "https://registry.npmjs.org/sisteransi/-/sisteransi-1.0.5.tgz",
+      "integrity": "sha512-bLGGlR1QxBcynn2d5YmDX4MGjlZvy2MRBDRNHLJ8VI6l6+9FUiyTFNJ0IveOSP0bcXgVDPRcfGqA0pjaqUpfVg==",
+      "license": "MIT"
+    },
+    "node_modules/source-map": {
+      "version": "0.6.1",
+      "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
+      "integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==",
       "license": "BSD-3-Clause",
       "engines": {
         "node": ">=0.10.0"
       }
     },
+    "node_modules/source-map-js": {
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.2.1.tgz",
+      "integrity": "sha512-UXWMKhLOwVKb728IUtQPXxfYU+usdybtUrK/8uGE8CQMvrhOpwvzDBwj0QhSL7MQc7vIsISBG8VQ8+IDQxpfQA==",
+      "license": "BSD-3-Clause",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
+    "node_modules/statuses": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/statuses/-/statuses-2.0.2.tgz",
+      "integrity": "sha512-DvEy55V3DB7uknRo+4iOGT5fP1slR8wQohVdknigZPMpMstaKJQWhwiYBACJE3Ul2pTnATihhBYnRhZQHGBiRw==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
+    "node_modules/stdin-discarder": {
+      "version": "0.2.2",
+      "resolved": "https://registry.npmjs.org/stdin-discarder/-/stdin-discarder-0.2.2.tgz",
+      "integrity": "sha512-UhDfHmA92YAlNnCfhmq0VeNL5bDbiZGg7sZ2IvPsXubGkiNa9EC+tUTsjBRsYUAz87btI6/1wf4XoVvQ3uRnmQ==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/strict-event-emitter": {
+      "version": "0.5.1",
+      "resolved": "https://registry.npmjs.org/strict-event-emitter/-/strict-event-emitter-0.5.1.tgz",
+      "integrity": "sha512-vMgjE/GGEPEFnhFub6pa4FmJBRBVOLpIII2hvCZ8Kzb7K0hlHo7mQv6xYrBvCL2LtAIBwFUK8wvuJgTVSQ5MFQ==",
+      "license": "MIT"
+    },
     "node_modules/string-width": {
       "version": "5.1.2",
       "resolved": "https://registry.npmjs.org/string-width/-/string-width-5.1.2.tgz",
@@ -2478,6 +6226,23 @@
         "node": ">=8"
       }
     },
+    "node_modules/stringify-object": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/stringify-object/-/stringify-object-5.0.0.tgz",
+      "integrity": "sha512-zaJYxz2FtcMb4f+g60KsRNFOpVMUyuJgA51Zi5Z1DOTC3S59+OQiVOzE9GZt0x72uBGWKsQIuBKeF9iusmKFsg==",
+      "license": "BSD-2-Clause",
+      "dependencies": {
+        "get-own-enumerable-keys": "^1.0.0",
+        "is-obj": "^3.0.0",
+        "is-regexp": "^3.1.0"
+      },
+      "engines": {
+        "node": ">=14.16"
+      },
+      "funding": {
+        "url": "https://github.com/yeoman/stringify-object?sponsor=1"
+      }
+    },
     "node_modules/strip-ansi": {
       "version": "7.1.2",
       "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-7.1.2.tgz",
@@ -2515,11 +6280,93 @@
         "node": ">=8"
       }
     },
+    "node_modules/strip-bom": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-3.0.0.tgz",
+      "integrity": "sha512-vavAMRXOgBVNF6nyEEmL3DBK19iRpDcoIwW+swQ+CbGiu7lju6t+JklA1MHweoWtadgt4ISVUsXLyDq34ddcwA==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=4"
+      }
+    },
+    "node_modules/strip-final-newline": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/strip-final-newline/-/strip-final-newline-4.0.0.tgz",
+      "integrity": "sha512-aulFJcD6YK8V1G7iRB5tigAP4TsHBZZrOV8pjV++zdUwmeV8uzbY7yn6h9MswN62adStNZFuCIx4haBnRuMDaw==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/tabbable": {
+      "version": "6.4.0",
+      "resolved": "https://registry.npmjs.org/tabbable/-/tabbable-6.4.0.tgz",
+      "integrity": "sha512-05PUHKSNE8ou2dwIxTngl4EzcnsCDZGJ/iCLtDflR/SHB/ny14rXc+qU5P4mG9JkusiV7EivzY9Mhm55AzAvCg==",
+      "license": "MIT"
+    },
+    "node_modules/tagged-tag": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/tagged-tag/-/tagged-tag-1.0.0.tgz",
+      "integrity": "sha512-yEFYrVhod+hdNyx7g5Bnkkb0G6si8HJurOoOEgC8B/O0uXLHlaey/65KRv6cuWBNhBgHKAROVpc7QyYqE5gFng==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=20"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/tailwind-merge": {
+      "version": "3.5.0",
+      "resolved": "https://registry.npmjs.org/tailwind-merge/-/tailwind-merge-3.5.0.tgz",
+      "integrity": "sha512-I8K9wewnVDkL1NTGoqWmVEIlUcB9gFriAEkXkfCjX5ib8ezGxtR3xD7iZIxrfArjEsH7F1CHD4RFUtxefdqV/A==",
+      "license": "MIT",
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/dcastil"
+      }
+    },
+    "node_modules/tailwindcss": {
+      "version": "4.2.1",
+      "resolved": "https://registry.npmjs.org/tailwindcss/-/tailwindcss-4.2.1.tgz",
+      "integrity": "sha512-/tBrSQ36vCleJkAOsy9kbNTgaxvGbyOamC30PRePTQe/o1MFwEKHQk4Cn7BNGaPtjp+PuUrByJehM1hgxfq4sw==",
+      "license": "MIT"
+    },
+    "node_modules/tapable": {
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/tapable/-/tapable-2.3.0.tgz",
+      "integrity": "sha512-g9ljZiwki/LfxmQADO3dEY1CbpmXT5Hm2fJ+QaGKwSXUylMybePR7/67YW7jOrrvjEgL1Fmz5kzyAjWVWLlucg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=6"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/webpack"
+      }
+    },
+    "node_modules/tiny-invariant": {
+      "version": "1.3.3",
+      "resolved": "https://registry.npmjs.org/tiny-invariant/-/tiny-invariant-1.3.3.tgz",
+      "integrity": "sha512-+FbBPE1o9QAYvviau/qC5SE3caw21q3xkvWKBtja5vgqOWIHHJ3ioaq1VPfn/Szqctz2bU/oYeKd9/z5BL+PVg==",
+      "license": "MIT"
+    },
+    "node_modules/tinyexec": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/tinyexec/-/tinyexec-1.0.2.tgz",
+      "integrity": "sha512-W/KYk+NFhkmsYpuHq5JykngiOCnxeVL8v8dFnqxSD8qEEdRfXk1SDM6JzNqcERbcGYj9tMrDQBYV9cjgnunFIg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      }
+    },
     "node_modules/tinyglobby": {
       "version": "0.2.15",
       "resolved": "https://registry.npmjs.org/tinyglobby/-/tinyglobby-0.2.15.tgz",
       "integrity": "sha512-j2Zq4NyQYG5XMST4cbs02Ak8iJUdxRM0XI5QyxXuZOzKOINmWurp3smXu3y5wDcJrptwpSjgXHzIQxR0omXljQ==",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "fdir": "^6.5.0",
@@ -2532,11 +6379,130 @@
         "url": "https://github.com/sponsors/SuperchupuDev"
       }
     },
+    "node_modules/tldts": {
+      "version": "7.0.25",
+      "resolved": "https://registry.npmjs.org/tldts/-/tldts-7.0.25.tgz",
+      "integrity": "sha512-keinCnPbwXEUG3ilrWQZU+CqcTTzHq9m2HhoUP2l7Xmi8l1LuijAXLpAJ5zRW+ifKTNscs4NdCkfkDCBYm352w==",
+      "license": "MIT",
+      "dependencies": {
+        "tldts-core": "^7.0.25"
+      },
+      "bin": {
+        "tldts": "bin/cli.js"
+      }
+    },
+    "node_modules/tldts-core": {
+      "version": "7.0.25",
+      "resolved": "https://registry.npmjs.org/tldts-core/-/tldts-core-7.0.25.tgz",
+      "integrity": "sha512-ZjCZK0rppSBu7rjHYDYsEaMOIbbT+nWF57hKkv4IUmZWBNrBWBOjIElc0mKRgLM8bm7x/BBlof6t2gi/Oq/Asw==",
+      "license": "MIT"
+    },
+    "node_modules/to-regex-range": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/to-regex-range/-/to-regex-range-5.0.1.tgz",
+      "integrity": "sha512-65P7iz6X5yEr1cwcgvQxbbIw7Uk3gOy5dIdtZ4rDveLqhrdJP+Li/Hx6tyK0NEb+2GCyneCMJiGqrADCSNk8sQ==",
+      "license": "MIT",
+      "dependencies": {
+        "is-number": "^7.0.0"
+      },
+      "engines": {
+        "node": ">=8.0"
+      }
+    },
+    "node_modules/toidentifier": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/toidentifier/-/toidentifier-1.0.1.tgz",
+      "integrity": "sha512-o5sSPKEkg/DIQNmH43V0/uerLrpzVedkUh8tGNvaeXpfpuwjKenlSox/2O/BTlZUtEe+JG7s5YhEz608PlAHRA==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.6"
+      }
+    },
+    "node_modules/tough-cookie": {
+      "version": "6.0.0",
+      "resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-6.0.0.tgz",
+      "integrity": "sha512-kXuRi1mtaKMrsLUxz3sQYvVl37B0Ns6MzfrtV5DvJceE9bPyspOqk9xxv7XbZWcfLWbFmm997vl83qUWVJA64w==",
+      "license": "BSD-3-Clause",
+      "dependencies": {
+        "tldts": "^7.0.5"
+      },
+      "engines": {
+        "node": ">=16"
+      }
+    },
+    "node_modules/ts-morph": {
+      "version": "26.0.0",
+      "resolved": "https://registry.npmjs.org/ts-morph/-/ts-morph-26.0.0.tgz",
+      "integrity": "sha512-ztMO++owQnz8c/gIENcM9XfCEzgoGphTv+nKpYNM1bgsdOVC/jRZuEBf6N+mLLDNg68Kl+GgUZfOySaRiG1/Ug==",
+      "license": "MIT",
+      "dependencies": {
+        "@ts-morph/common": "~0.27.0",
+        "code-block-writer": "^13.0.3"
+      }
+    },
+    "node_modules/tsconfig-paths": {
+      "version": "4.2.0",
+      "resolved": "https://registry.npmjs.org/tsconfig-paths/-/tsconfig-paths-4.2.0.tgz",
+      "integrity": "sha512-NoZ4roiN7LnbKn9QqE1amc9DJfzvZXxF4xDavcOWt1BPkdx+m+0gJuPM+S0vCe7zTJMYUP0R8pO2XMr+Y8oLIg==",
+      "license": "MIT",
+      "dependencies": {
+        "json5": "^2.2.2",
+        "minimist": "^1.2.6",
+        "strip-bom": "^3.0.0"
+      },
+      "engines": {
+        "node": ">=6"
+      }
+    },
+    "node_modules/tslib": {
+      "version": "2.8.1",
+      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.8.1.tgz",
+      "integrity": "sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w==",
+      "license": "0BSD"
+    },
+    "node_modules/tw-animate-css": {
+      "version": "1.4.0",
+      "resolved": "https://registry.npmjs.org/tw-animate-css/-/tw-animate-css-1.4.0.tgz",
+      "integrity": "sha512-7bziOlRqH0hJx80h/3mbicLW7o8qLsH5+RaLR2t+OHM3D0JlWGODQKQ4cxbK7WlvmUxpcj6Kgu6EKqjrGFe3QQ==",
+      "license": "MIT",
+      "funding": {
+        "url": "https://github.com/sponsors/Wombosvideo"
+      }
+    },
+    "node_modules/type-fest": {
+      "version": "5.4.4",
+      "resolved": "https://registry.npmjs.org/type-fest/-/type-fest-5.4.4.tgz",
+      "integrity": "sha512-JnTrzGu+zPV3aXIUhnyWJj4z/wigMsdYajGLIYakqyOW1nPllzXEJee0QQbHj+CTIQtXGlAjuK0UY+2xTyjVAw==",
+      "license": "(MIT OR CC0-1.0)",
+      "dependencies": {
+        "tagged-tag": "^1.0.0"
+      },
+      "engines": {
+        "node": ">=20"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/type-is": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/type-is/-/type-is-2.0.1.tgz",
+      "integrity": "sha512-OZs6gsjF4vMp32qrCbiVSkrFmXtG/AZhY3t0iAMrMBiAZyV9oALtXO8hsrHbMXF9x6L3grlFuwW2oAz7cav+Gw==",
+      "license": "MIT",
+      "dependencies": {
+        "content-type": "^1.0.5",
+        "media-typer": "^1.1.0",
+        "mime-types": "^3.0.0"
+      },
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
     "node_modules/typescript": {
       "version": "5.8.3",
       "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.8.3.tgz",
       "integrity": "sha512-p1diW6TqL9L07nNxvRMM7hMMw4c5XOo/1ibL4aAIGmSAt9slTE1Xgw5KWuof2uTOvCg9BY7ZRi+GaF+7sfgPeQ==",
-      "dev": true,
+      "devOptional": true,
       "license": "Apache-2.0",
       "bin": {
         "tsc": "bin/tsc",
@@ -2552,11 +6518,49 @@
       "integrity": "sha512-iwDZqg0QAGrg9Rav5H4n0M64c3mkR59cJ6wQp+7C4nI0gsmExaedaYLNO44eT4AtBBwjbTiGPMlt2Md0T9H9JQ==",
       "license": "MIT"
     },
+    "node_modules/unicorn-magic": {
+      "version": "0.3.0",
+      "resolved": "https://registry.npmjs.org/unicorn-magic/-/unicorn-magic-0.3.0.tgz",
+      "integrity": "sha512-+QBBXBCvifc56fsbuxZQ6Sic3wqqc3WWaqxs58gvJrcOuN83HGTCwz3oS5phzU9LthRNE9VrJCFCLUgHeeFnfA==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/universalify": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/universalify/-/universalify-2.0.1.tgz",
+      "integrity": "sha512-gptHNQghINnc/vTGIk0SOFGFNXw7JVrlRUtConJRlvaw6DuX0wO5Jeko9sWrMBhh+PsYAZ7oXAiOnf/UKogyiw==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 10.0.0"
+      }
+    },
+    "node_modules/unpipe": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/unpipe/-/unpipe-1.0.0.tgz",
+      "integrity": "sha512-pjy2bYhSsufwWlKwPc+l3cN7+wuJlK6uz0YdJEOlQDbl6jo/YlPi4mb8agUkVC8BF7V8NuzeyPNqRksA3hztKQ==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
+    "node_modules/until-async": {
+      "version": "3.0.2",
+      "resolved": "https://registry.npmjs.org/until-async/-/until-async-3.0.2.tgz",
+      "integrity": "sha512-IiSk4HlzAMqTUseHHe3VhIGyuFmN90zMTpD3Z3y8jeQbzLIq500MVM7Jq2vUAnTKAFPJrqwkzr6PoTcPhGcOiw==",
+      "license": "MIT",
+      "funding": {
+        "url": "https://github.com/sponsors/kettanaito"
+      }
+    },
     "node_modules/update-browserslist-db": {
       "version": "1.2.3",
       "resolved": "https://registry.npmjs.org/update-browserslist-db/-/update-browserslist-db-1.2.3.tgz",
       "integrity": "sha512-Js0m9cx+qOgDxo0eMiFGEueWztz+d4+M3rGlmKPT+T4IS/jP4ylw3Nwpu6cpTTP8R1MAC1kF4VbdLt3ARf209w==",
-      "dev": true,
       "funding": [
         {
           "type": "opencollective",
@@ -2583,11 +6587,43 @@
         "browserslist": ">= 4.21.0"
       }
     },
+    "node_modules/use-sync-external-store": {
+      "version": "1.6.0",
+      "resolved": "https://registry.npmjs.org/use-sync-external-store/-/use-sync-external-store-1.6.0.tgz",
+      "integrity": "sha512-Pp6GSwGP/NrPIrxVFAIkOQeyw8lFenOHijQWkUTrDvrF4ALqylP2C/KCkeS9dpUM3KvYRQhna5vt7IL95+ZQ9w==",
+      "license": "MIT",
+      "peerDependencies": {
+        "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0"
+      }
+    },
+    "node_modules/util-deprecate": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz",
+      "integrity": "sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw==",
+      "license": "MIT"
+    },
+    "node_modules/validate-npm-package-name": {
+      "version": "7.0.2",
+      "resolved": "https://registry.npmjs.org/validate-npm-package-name/-/validate-npm-package-name-7.0.2.tgz",
+      "integrity": "sha512-hVDIBwsRruT73PbK7uP5ebUt+ezEtCmzZz3F59BSr2F6OVFnJ/6h8liuvdLrQ88Xmnk6/+xGGuq+pG9WwTuy3A==",
+      "license": "ISC",
+      "engines": {
+        "node": "^20.17.0 || >=22.9.0"
+      }
+    },
+    "node_modules/vary": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/vary/-/vary-1.1.2.tgz",
+      "integrity": "sha512-BNGbWLfd0eUPabhkXUVm0j8uuvREyTh5ovRa/dyow/BqAbZJyC+5fU+IzQOzmAKzYqYRAISoRhdQr3eIZ/PXqg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
     "node_modules/vite": {
       "version": "6.4.1",
       "resolved": "https://registry.npmjs.org/vite/-/vite-6.4.1.tgz",
       "integrity": "sha512-+Oxm7q9hDoLMyJOYfUYBuHQo+dkAloi33apOPP56pzj+vsdJDzr+j1NISE5pyaAuKL4A3UD34qd0lx5+kfKp2g==",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "esbuild": "^0.25.0",
@@ -2773,6 +6809,12 @@
         "node": ">=8"
       }
     },
+    "node_modules/wrappy": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz",
+      "integrity": "sha512-l4Sp/DRseor9wL6EvV2+TuQn63dMkPjZ/sp9XkghTEbV9KlPS1xUsZ3u7/IQO4wxtcFB4bgpQPRcR3QCvezPcQ==",
+      "license": "ISC"
+    },
     "node_modules/ws": {
       "version": "8.19.0",
       "resolved": "https://registry.npmjs.org/ws/-/ws-8.19.0.tgz",
@@ -2794,13 +6836,147 @@
         }
       }
     },
+    "node_modules/wsl-utils": {
+      "version": "0.3.1",
+      "resolved": "https://registry.npmjs.org/wsl-utils/-/wsl-utils-0.3.1.tgz",
+      "integrity": "sha512-g/eziiSUNBSsdDJtCLB8bdYEUMj4jR7AGeUo96p/3dTafgjHhpF4RiCFPiRILwjQoDXx5MqkBr4fwWtR3Ky4Wg==",
+      "license": "MIT",
+      "dependencies": {
+        "is-wsl": "^3.1.0",
+        "powershell-utils": "^0.1.0"
+      },
+      "engines": {
+        "node": ">=20"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/y18n": {
+      "version": "5.0.8",
+      "resolved": "https://registry.npmjs.org/y18n/-/y18n-5.0.8.tgz",
+      "integrity": "sha512-0pfFzegeDWJHJIAmTLRP2DwHjdF5s7jo9tuztdQxAhINCdvS+3nGINqPd00AphqJR/0LhANUS6/+7SCb98YOfA==",
+      "license": "ISC",
+      "engines": {
+        "node": ">=10"
+      }
+    },
     "node_modules/yallist": {
       "version": "3.1.1",
       "resolved": "https://registry.npmjs.org/yallist/-/yallist-3.1.1.tgz",
       "integrity": "sha512-a4UGQaWPH59mOXUYnAG2ewncQS4i4F43Tv3JoAM+s2VDAmS9NsK8GpDMLrCHPksFT7h3K6TOoUNn2pb7RoXx4g==",
-      "dev": true,
       "license": "ISC"
     },
+    "node_modules/yargs": {
+      "version": "17.7.2",
+      "resolved": "https://registry.npmjs.org/yargs/-/yargs-17.7.2.tgz",
+      "integrity": "sha512-7dSzzRQ++CKnNI/krKnYRV7JKKPUXMEh61soaHKg9mrWEhzFWhFnxPxGl+69cD1Ou63C13NUPCnmIcrvqCuM6w==",
+      "license": "MIT",
+      "dependencies": {
+        "cliui": "^8.0.1",
+        "escalade": "^3.1.1",
+        "get-caller-file": "^2.0.5",
+        "require-directory": "^2.1.1",
+        "string-width": "^4.2.3",
+        "y18n": "^5.0.5",
+        "yargs-parser": "^21.1.1"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/yargs-parser": {
+      "version": "21.1.1",
+      "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-21.1.1.tgz",
+      "integrity": "sha512-tVpsJW7DdjecAiFpbIB1e3qxIQsE6NoPc5/eTdrbbIC4h0LVsWhnoa3g+m2HclBIujHzsxZ4VJVA+GUuc2/LBw==",
+      "license": "ISC",
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/yargs/node_modules/ansi-regex": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-5.0.1.tgz",
+      "integrity": "sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/yargs/node_modules/emoji-regex": {
+      "version": "8.0.0",
+      "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-8.0.0.tgz",
+      "integrity": "sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==",
+      "license": "MIT"
+    },
+    "node_modules/yargs/node_modules/string-width": {
+      "version": "4.2.3",
+      "resolved": "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz",
+      "integrity": "sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==",
+      "license": "MIT",
+      "dependencies": {
+        "emoji-regex": "^8.0.0",
+        "is-fullwidth-code-point": "^3.0.0",
+        "strip-ansi": "^6.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/yargs/node_modules/strip-ansi": {
+      "version": "6.0.1",
+      "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz",
+      "integrity": "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==",
+      "license": "MIT",
+      "dependencies": {
+        "ansi-regex": "^5.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/yoctocolors": {
+      "version": "2.1.2",
+      "resolved": "https://registry.npmjs.org/yoctocolors/-/yoctocolors-2.1.2.tgz",
+      "integrity": "sha512-CzhO+pFNo8ajLM2d2IW/R93ipy99LWjtwblvC1RsoSUMZgyLbYFr221TnSNT7GjGdYui6P459mw9JH/g/zW2ug==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/yoctocolors-cjs": {
+      "version": "2.1.3",
+      "resolved": "https://registry.npmjs.org/yoctocolors-cjs/-/yoctocolors-cjs-2.1.3.tgz",
+      "integrity": "sha512-U/PBtDf35ff0D8X8D0jfdzHYEPFxAI7jJlxZXwCSez5M3190m+QobIfh+sWDWSHMCWWJN2AWamkegn6vr6YBTw==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/zod": {
+      "version": "3.25.76",
+      "resolved": "https://registry.npmjs.org/zod/-/zod-3.25.76.tgz",
+      "integrity": "sha512-gzUt/qt81nXsFGKIFcC3YnfEAx5NkunCfnDlvuBSSFS02bcXu4Lmea0AFIUwbLWxWPx3d9p8S5QoaujKcNQxcQ==",
+      "license": "MIT",
+      "funding": {
+        "url": "https://github.com/sponsors/colinhacks"
+      }
+    },
+    "node_modules/zod-to-json-schema": {
+      "version": "3.25.1",
+      "resolved": "https://registry.npmjs.org/zod-to-json-schema/-/zod-to-json-schema-3.25.1.tgz",
+      "integrity": "sha512-pM/SU9d3YAggzi6MtR4h7ruuQlqKtad8e9S0fmxcMi+ueAK5Korys/aWcV9LIIHTVbj01NdzxcnXSN+O74ZIVA==",
+      "license": "ISC",
+      "peerDependencies": {
+        "zod": "^3.25 || ^4"
+      }
+    },
     "node_modules/zustand": {
       "version": "5.0.11",
       "resolved": "https://registry.npmjs.org/zustand/-/zustand-5.0.11.tgz",
diff --git a/web/package.json b/web/package.json
index a4e6e55..795bbde 100644
--- a/web/package.json
+++ b/web/package.json
@@ -9,17 +9,28 @@
     "preview": "vite preview"
   },
   "dependencies": {
-    "@tanstack/react-query": "^5.90.2",
-    "lucide-react": "^0.563.0",
-    "zustand": "^5.0.8",
-    "react-router-dom": "^7.13.0",
+    "@base-ui/react": "^1.2.0",
+    "@fontsource-variable/geist": "^5.2.8",
     "@google/genai": "^1.39.0",
+    "@tailwindcss/vite": "^4.2.1",
+    "@tanstack/react-query": "^5.90.2",
+    "class-variance-authority": "^0.7.1",
+    "clsx": "^2.1.1",
+    "lucide-react": "^0.563.0",
     "react": "^19.2.4",
-    "react-dom": "^19.2.4"
+    "react-dom": "^19.2.4",
+    "react-router-dom": "^7.13.0",
+    "shadcn": "^4.0.2",
+    "tailwind-merge": "^3.5.0",
+    "tw-animate-css": "^1.4.0",
+    "zustand": "^5.0.8"
   },
   "devDependencies": {
     "@types/node": "^22.14.0",
     "@vitejs/plugin-react": "^5.0.0",
+    "autoprefixer": "^10.4.27",
+    "postcss": "^8.5.8",
+    "tailwindcss": "^4.2.1",
     "typescript": "~5.8.2",
     "vite": "^6.2.0"
   }
diff --git a/web/pages/Assistants.tsx b/web/pages/Assistants.tsx
index cee26b1..ec0ba28 100644
--- a/web/pages/Assistants.tsx
+++ b/web/pages/Assistants.tsx
@@ -173,11 +173,11 @@ export const AssistantsPage: React.FC = () => {
   const [debugOpen, setDebugOpen] = useState(false);
   const [hotwordInput, setHotwordInput] = useState('');
   const [toolPickerOpen, setToolPickerOpen] = useState(false);
-  
+
   // Publish Modal State
   const [isPublishModalOpen, setIsPublishModalOpen] = useState(false);
   const [publishTab, setPublishTab] = useState<'web' | 'api'>('web');
-  
+
   const [deleteId, setDeleteId] = useState<string | null>(null);
   const [copySuccess, setCopySuccess] = useState(false);
   const [saveLoading, setSaveLoading] = useState(false);
@@ -197,7 +197,7 @@ export const AssistantsPage: React.FC = () => {
     && persistedAssistantSnapshotById[selectedAssistant.id] !== serializeAssistant(selectedAssistant)
   );
 
-  const filteredAssistants = assistants.filter(a => 
+  const filteredAssistants = assistants.filter(a =>
     a.name.toLowerCase().includes(searchTerm.toLowerCase())
   );
 
@@ -326,27 +326,27 @@ export const AssistantsPage: React.FC = () => {
 
   const confirmDelete = async () => {
     if (deleteId) {
-        try {
-          await deleteAssistant(deleteId);
-          setAssistants(prev => prev.filter(a => a.id !== deleteId));
-          setPersistedAssistantSnapshotById((prev) => {
-            const next = { ...prev };
-            delete next[deleteId];
-            return next;
-          });
-          if (selectedId === deleteId) setSelectedId(null);
-          setDeleteId(null);
-        } catch (error) {
-          console.error(error);
-          alert('删除失败，请稍后重试。');
-        }
+      try {
+        await deleteAssistant(deleteId);
+        setAssistants(prev => prev.filter(a => a.id !== deleteId));
+        setPersistedAssistantSnapshotById((prev) => {
+          const next = { ...prev };
+          delete next[deleteId];
+          return next;
+        });
+        if (selectedId === deleteId) setSelectedId(null);
+        setDeleteId(null);
+      } catch (error) {
+        console.error(error);
+        alert('删除失败，请稍后重试。');
+      }
     }
   };
 
   const updateAssistant = (field: keyof Assistant, value: any) => {
     if (!selectedId) return;
     setAssistants(prev => prev.map(a => a.id === selectedId ? { ...a, [field]: value } : a));
-    
+
     if (field === 'configMode') {
       if (value === 'platform') {
         setActiveTab(TabValue.GLOBAL);
@@ -524,8 +524,8 @@ export const AssistantsPage: React.FC = () => {
     const canonicalToolId = normalizeToolId(toolId);
     const currentTools = (selectedAssistant.tools || []).map((id) => normalizeToolId(id));
     const newTools = currentTools.includes(canonicalToolId)
-        ? currentTools.filter(id => id !== canonicalToolId)
-        : [...currentTools, canonicalToolId];
+      ? currentTools.filter(id => id !== canonicalToolId)
+      : [...currentTools, canonicalToolId];
     updateAssistant('tools', newTools);
   };
 
@@ -645,1020 +645,1006 @@ export const AssistantsPage: React.FC = () => {
   return (
     <div className="flex h-full min-h-0 gap-6 animate-in fade-in">
       {/* LEFT COLUMN: List */}
-      <div className="w-80 flex flex-col gap-4 shrink-0">
+      <div className="w-80 flex flex-col gap-4 shrink-0 pt-4">
         <div className="flex items-center justify-between px-1 text-white">
-            <h2 className="text-xl font-bold tracking-tight text-white">小助手列表</h2>
+          <h2 className="text-lg font-bold tracking-tight text-white">小助手列表</h2>
         </div>
-        
+
         <div className="flex gap-2">
-            <div className="relative flex-1">
-                <Search className="absolute left-2.5 top-2.5 h-4 w-4 text-muted-foreground" />
-                <Input 
-                  placeholder="搜索..." 
-                  className="pl-9 bg-card/50 border-white/5"
-                  value={searchTerm}
-                  onChange={(e) => setSearchTerm(e.target.value)}
-                />
-            </div>
-            <Button size="icon" onClick={handleCreate} title="新建小助手">
-                <Plus className="h-5 w-5" />
-            </Button>
+          <div className="relative flex-1">
+            <Search className="absolute left-2.5 top-2.5 h-4 w-4 text-muted-foreground" />
+            <Input
+              placeholder="搜索..."
+              className="pl-9 bg-card/50 border-white/5"
+              value={searchTerm}
+              onChange={(e) => setSearchTerm(e.target.value)}
+            />
+          </div>
+          <Button size="icon" onClick={handleCreate} title="新建小助手">
+            <Plus className="h-5 w-5" />
+          </Button>
         </div>
 
         <div className="flex-1 overflow-y-auto space-y-2 pr-1 custom-scrollbar">
-            {!isLoading && filteredAssistants.map(assistant => (
-                <div 
-                    key={assistant.id}
-                    onClick={() => setSelectedId(assistant.id)}
-                    className={`group relative flex flex-col p-4 rounded-xl border transition-all cursor-pointer ${
-                        selectedId === assistant.id 
-                        ? 'bg-primary/10 border-primary/40 shadow-[0_0_15px_rgba(6,182,212,0.15)]' 
-                        : 'bg-card/30 border-white/5 hover:bg-white/5 hover:border-white/10'
-                    }`}
-                >
-                    <div className="flex flex-col gap-1.5 mb-2 pr-16 overflow-hidden">
-                        <span className={`font-semibold truncate ${selectedId === assistant.id ? 'text-primary' : 'text-foreground'}`}>
-                            {assistant.name}
-                        </span>
-                        {assistant.configMode && assistant.configMode !== 'none' && (
-                          <div className="flex">
-                            <Badge 
-                              variant="outline" 
-                              className={`text-[9px] uppercase tracking-tighter shrink-0 opacity-70 border-white/10 ${
-                                assistant.configMode === 'platform' ? 'text-cyan-400 bg-cyan-400/5' : 
-                                assistant.configMode === 'dify' ? 'text-blue-400 bg-blue-400/5' : 
-                                'text-purple-400 bg-purple-400/5'
-                              }`}
-                            >
-                              {assistant.configMode === 'platform' ? '内置' : assistant.configMode}
-                            </Badge>
-                          </div>
-                        )}
-                    </div>
-                    
-                    <div className="flex items-center text-xs text-muted-foreground">
-                        <Phone className="h-3 w-3 mr-1.5 opacity-70" />
-                        <span>{assistant.callCount} 次通话</span>
-                    </div>
+          {!isLoading && filteredAssistants.map(assistant => (
+            <div
+              key={assistant.id}
+              onClick={() => setSelectedId(assistant.id)}
+              className={`group relative flex flex-col p-4 rounded-xl border transition-all cursor-pointer ${selectedId === assistant.id
+                ? 'bg-primary/10 border-primary/40 shadow-[0_0_15px_rgba(6,182,212,0.15)]'
+                : 'bg-card/30 border-white/5 hover:bg-white/5 hover:border-white/10'
+                }`}
+            >
+              <div className="flex flex-col gap-1.5 mb-2 pr-16 overflow-hidden">
+                <span className={`font-semibold truncate ${selectedId === assistant.id ? 'text-primary' : 'text-foreground'}`}>
+                  {assistant.name}
+                </span>
+                {assistant.configMode && assistant.configMode !== 'none' && (
+                  <div className="flex">
+                    <Badge
+                      variant="outline"
+                      className={`text-[9px] uppercase tracking-tighter shrink-0 opacity-70 border-white/10 ${assistant.configMode === 'platform' ? 'text-cyan-400 bg-cyan-400/5' :
+                        assistant.configMode === 'dify' ? 'text-blue-400 bg-blue-400/5' :
+                          'text-purple-400 bg-purple-400/5'
+                        }`}
+                    >
+                      {assistant.configMode === 'platform' ? '内置' : assistant.configMode}
+                    </Badge>
+                  </div>
+                )}
+              </div>
 
-                    <div className="absolute right-2 top-2 flex space-x-1 opacity-0 group-hover:opacity-100 transition-opacity bg-background/50 backdrop-blur-sm rounded-lg p-0.5 shadow-lg border border-white/5">
-                        <Button variant="ghost" size="icon" className="h-7 w-7" onClick={(e) => handleCopy(e, assistant)} title="复制">
-                            <Copy className="h-3.5 w-3.5" />
-                        </Button>
-                        <Button variant="ghost" size="icon" className="h-7 w-7 text-destructive hover:text-destructive" onClick={(e) => handleDeleteClick(e, assistant.id)} title="删除">
-                            <Trash2 className="h-3.5 w-3.5" />
-                        </Button>
-                    </div>
-                </div>
-            ))}
-            {!isLoading && filteredAssistants.length === 0 && (
-                <div className="text-center py-10 text-muted-foreground text-sm">
-                    未找到小助手
-                </div>
-            )}
-            {isLoading && (
-                <div className="text-center py-10 text-muted-foreground text-sm">
-                    加载中...
-                </div>
-            )}
+              <div className="flex items-center text-xs text-muted-foreground">
+                <Phone className="h-3 w-3 mr-1.5 opacity-70" />
+                <span>{assistant.callCount} 次通话</span>
+              </div>
+
+              <div className="absolute right-2 top-2 flex space-x-1 opacity-0 group-hover:opacity-100 transition-opacity bg-background/50 backdrop-blur-sm rounded-lg p-0.5 shadow-lg border border-white/5">
+                <Button variant="ghost" size="icon" className="h-7 w-7" onClick={(e) => handleCopy(e, assistant)} title="复制">
+                  <Copy className="h-3.5 w-3.5" />
+                </Button>
+                <Button variant="ghost" size="icon" className="h-7 w-7 text-destructive hover:text-destructive" onClick={(e) => handleDeleteClick(e, assistant.id)} title="删除">
+                  <Trash2 className="h-3.5 w-3.5" />
+                </Button>
+              </div>
+            </div>
+          ))}
+          {!isLoading && filteredAssistants.length === 0 && (
+            <div className="text-center py-10 text-muted-foreground text-sm">
+              未找到小助手
+            </div>
+          )}
+          {isLoading && (
+            <div className="text-center py-10 text-muted-foreground text-sm">
+              加载中...
+            </div>
+          )}
         </div>
       </div>
 
       {/* RIGHT COLUMN: Config Panel */}
       <div className="flex-1 bg-card/20 backdrop-blur-sm border border-white/5 rounded-2xl overflow-hidden flex flex-col relative shadow-xl">
         {selectedAssistant ? (
-            <>
-                {/* Header Area */}
-                <div className="p-6 border-b border-white/5 bg-white/[0.02] space-y-5">
-                    <div className="flex items-start justify-between gap-4">
-                        <div className="flex-1">
-                            <div className="flex items-center gap-2 mb-2">
-                                <label className="text-[10px] text-muted-foreground font-black tracking-widest uppercase ml-1">小助手名称</label>
-                                <div className="flex items-center gap-1.5 px-2 py-0.5 rounded-md bg-white/5 border border-white/10 group/id transition-all hover:bg-white/10">
-                                    <span className="text-[10px] font-mono text-muted-foreground/60 select-all tracking-tight">UUID: {selectedAssistant.id}</span>
-                                    <button 
-                                        onClick={() => handleCopyId(selectedAssistant.id)}
-                                        className="text-muted-foreground hover:text-primary transition-colors flex items-center"
-                                        title="复制ID"
-                                    >
-                                        {copySuccess ? <ClipboardCheck className="h-3 w-3 text-green-400" /> : <Copy className="h-3 w-3" />}
-                                    </button>
-                                </div>
-                            </div>
-                            <Input 
-                                value={selectedAssistant.name}
-                                onChange={(e) => updateAssistant('name', e.target.value)}
-                                className="font-bold bg-white/5 border-white/10 focus:border-primary/50 text-base"
-                            />
-                        </div>
-                        <div className="flex items-center space-x-2 pt-6">
-                             <Button 
-                                variant="secondary" 
-                                onClick={handleOpenDebug} 
-                                className="border border-primary/20 hover:border-primary/50 text-primary hover:text-primary hover:bg-primary/10 shadow-[0_0_15px_rgba(6,182,212,0.1)]"
-                             >
-                                <Play className="mr-2 h-4 w-4" /> 调试
-                            </Button>
-                            <Button 
-                                variant="outline" 
-                                onClick={handleSave} 
-                                disabled={saveLoading}
-                                className="border border-white/10 hover:border-primary/50 text-foreground"
-                             >
-                                <Save className={`mr-2 h-4 w-4 ${saveLoading ? 'animate-pulse' : ''}`} /> {saveLoading ? '正在保存...' : '保存'}
-                            </Button>
-                            <Button 
-                                onClick={() => setIsPublishModalOpen(true)} 
-                                className="shadow-[0_0_20px_rgba(6,182,212,0.3)]"
-                            >
-                                <Rocket className="mr-2 h-4 w-4" /> 发布
-                            </Button>
-                        </div>
+          <>
+            {/* Header Area */}
+            <div className="p-6 border-b border-white/5 bg-white/[0.02] space-y-5">
+              <div className="flex items-start justify-between gap-4">
+                <div className="flex-1">
+                  <div className="flex items-center gap-2 mb-2">
+                    <label className="text-xs text-muted-foreground font-bold tracking-widest uppercase ml-1">小助手名称</label>
+                    <div className="flex items-center gap-1.5 px-2 py-0.5 rounded-md bg-white/5 border border-white/10 group/id transition-all hover:bg-white/10">
+                      <span className="text-xs font-mono text-muted-foreground/60 select-all tracking-tight">UUID: {selectedAssistant.id}</span>
+                      <button
+                        onClick={() => handleCopyId(selectedAssistant.id)}
+                        className="text-muted-foreground hover:text-primary transition-colors flex items-center"
+                        title="复制ID"
+                      >
+                        {copySuccess ? <ClipboardCheck className="h-3 w-3 text-green-400" /> : <Copy className="h-3 w-3" />}
+                      </button>
                     </div>
+                  </div>
+                  <Input
+                    value={selectedAssistant.name}
+                    onChange={(e) => updateAssistant('name', e.target.value)}
+                    className="font-bold bg-white/5 border-white/10 focus:border-primary/50 text-lg"
+                  />
+                </div>
+                <div className="flex items-center space-x-2 pt-6">
+                  <Button
+                    variant="secondary"
+                    onClick={handleOpenDebug}
+                    className="border border-primary/20 hover:border-primary/50 text-primary hover:text-primary hover:bg-primary/10 shadow-[0_0_15px_rgba(6,182,212,0.1)]"
+                  >
+                    <Play className="mr-2 h-4 w-4" /> 调试
+                  </Button>
+                  <Button
+                    variant="outline"
+                    onClick={handleSave}
+                    disabled={saveLoading}
+                    className="border border-white/10 hover:border-primary/50 text-foreground"
+                  >
+                    <Save className={`mr-2 h-4 w-4 ${saveLoading ? 'animate-pulse' : ''}`} /> {saveLoading ? '正在保存...' : '保存'}
+                  </Button>
+                  <Button
+                    onClick={() => setIsPublishModalOpen(true)}
+                    className="shadow-[0_0_20px_rgba(6,182,212,0.3)]"
+                  >
+                    <Rocket className="mr-2 h-4 w-4" /> 发布
+                  </Button>
+                </div>
+              </div>
 
-                    <div className="space-y-2">
-                        <label className="text-[10px] text-muted-foreground font-black tracking-widest uppercase ml-1">配置方式</label>
-                        <div className="relative group w-full">
-                          <select 
-                            className="flex h-10 w-full rounded-md border border-white/10 bg-white/5 px-3 py-1 text-sm shadow-sm transition-all focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-primary/50 text-foreground appearance-none cursor-pointer [&>option]:bg-card"
-                            value={selectedAssistant.configMode || 'none'}
-                            onChange={(e) => updateAssistant('configMode', e.target.value as any)}
+              <div className="space-y-2">
+                <label className="text-xs text-muted-foreground font-bold tracking-widest uppercase ml-1">配置方式</label>
+                <div className="relative group w-full">
+                  <select
+                    className="flex h-10 w-full rounded-md border border-white/10 bg-white/5 px-3 py-1 text-sm shadow-sm transition-all focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-primary/50 text-foreground appearance-none cursor-pointer [&>option]:bg-card"
+                    value={selectedAssistant.configMode || 'none'}
+                    onChange={(e) => updateAssistant('configMode', e.target.value as any)}
+                  >
+                    <option value="none">无</option>
+                    <option value="platform">平台配置</option>
+                    <option value="dify">Dify 接入</option>
+                    <option value="fastgpt">FastGPT 接入</option>
+                  </select>
+                  <ChevronDown className="absolute right-3 top-1/2 -translate-y-1/2 h-4 w-4 text-muted-foreground pointer-events-none group-hover:text-primary transition-colors" />
+                </div>
+              </div>
+
+              {!isNoneConfig && (
+                <div className="flex bg-white/5 p-1 rounded-lg w-fit border border-white/5 animate-in fade-in slide-in-from-top-1">
+                  {selectedAssistant.configMode === 'platform' ? (
+                    <>
+                      <button
+                        onClick={() => setActiveTab(TabValue.GLOBAL)}
+                        className={`px-6 py-1.5 text-sm font-medium rounded-md transition-all ${activeTab === TabValue.GLOBAL ? 'bg-primary text-primary-foreground shadow-sm' : 'text-muted-foreground hover:text-foreground hover:bg-white/5'}`}
+                      >
+                        全局配置
+                      </button>
+                      <button
+                        onClick={() => setActiveTab(TabValue.VOICE)}
+                        className={`px-6 py-1.5 text-sm font-medium rounded-md transition-all ${activeTab === TabValue.VOICE ? 'bg-primary text-primary-foreground shadow-sm' : 'text-muted-foreground hover:text-foreground hover:bg-white/5'}`}
+                      >
+                        语音配置
+                      </button>
+                      <button
+                        onClick={() => setActiveTab(TabValue.TOOLS)}
+                        className={`px-6 py-1.5 text-sm font-medium rounded-md transition-all ${activeTab === TabValue.TOOLS ? 'bg-primary text-primary-foreground shadow-sm' : 'text-muted-foreground hover:text-foreground hover:bg-white/5'}`}
+                      >
+                        工具配置
+                      </button>
+                      <button
+                        onClick={() => setActiveTab(TabValue.KNOWLEDGE)}
+                        className={`px-6 py-1.5 text-sm font-medium rounded-md transition-all ${activeTab === TabValue.KNOWLEDGE ? 'bg-primary text-primary-foreground shadow-sm' : 'text-muted-foreground hover:text-foreground hover:bg-white/5'}`}
+                      >
+                        知识库配置
+                      </button>
+                    </>
+                  ) : (
+                    <>
+                      <button
+                        onClick={() => setActiveTab(TabValue.LINK)}
+                        className={`px-6 py-1.5 text-sm font-medium rounded-md transition-all ${activeTab === TabValue.LINK ? 'bg-primary text-primary-foreground shadow-sm' : 'text-muted-foreground hover:text-foreground hover:bg-white/5'}`}
+                      >
+                        链接设置
+                      </button>
+                      <button
+                        onClick={() => setActiveTab(TabValue.VOICE)}
+                        className={`px-6 py-1.5 text-sm font-medium rounded-md transition-all ${activeTab === TabValue.VOICE ? 'bg-primary text-primary-foreground shadow-sm' : 'text-muted-foreground hover:text-foreground hover:bg-white/5'}`}
+                      >
+                        语音设置
+                      </button>
+                    </>
+                  )}
+                </div>
+              )}
+            </div>
+
+            <div className="flex-1 overflow-y-auto p-8 custom-scrollbar">
+              {isNoneConfig ? (
+                <div className="h-full flex flex-col items-center justify-center text-muted-foreground opacity-40 animate-in fade-in">
+                  <AlertTriangle className="w-12 h-12 mb-4" />
+                  <p className="text-sm font-medium">请先选择配置方式以展开详细设置</p>
+                </div>
+              ) : (
+                <div className="max-w-4xl mx-auto space-y-8 animate-in slide-in-from-bottom-2 duration-300">
+                  {activeTab === TabValue.LINK && isExternalConfig && (
+                    <div className="space-y-6 animate-in fade-in">
+                      <div className="p-4 rounded-xl bg-primary/5 border border-primary/20 flex items-start gap-3 mb-4">
+                        <Database className="w-5 h-5 text-primary shrink-0 mt-0.5" />
+                        <div>
+                          <h4 className="text-sm font-bold text-white mb-1">
+                            接入 {selectedAssistant.configMode === 'dify' ? 'Dify' : 'FastGPT'} 引擎
+                          </h4>
+                          <p className="text-xs text-muted-foreground leading-relaxed">
+                            配置后，视频通话过程中的对话逻辑、知识库检索以及工作流将由外部引擎托管。
+                          </p>
+                        </div>
+                      </div>
+
+                      <div className="space-y-2">
+                        <label className="text-sm font-medium text-white flex items-center">
+                          <Globe className="w-4 h-4 mr-2 text-primary" /> 接口地址 (API URL)
+                        </label>
+                        <Input
+                          value={selectedAssistant.apiUrl || ''}
+                          onChange={(e) => updateAssistant('apiUrl', e.target.value)}
+                          placeholder={selectedAssistant.configMode === 'dify' ? "https://api.dify.ai/v1" : "https://api.fastgpt.in/api/v1"}
+                          className="bg-white/5 border-white/10 focus:border-primary/50 font-mono text-xs"
+                        />
+                      </div>
+
+                      <div className="space-y-2">
+                        <label className="text-sm font-medium text-white flex items-center">
+                          <Terminal className="w-4 h-4 mr-2 text-primary" /> 密钥 (API KEY)
+                        </label>
+                        <Input
+                          type="password"
+                          value={selectedAssistant.apiKey || ''}
+                          onChange={(e) => updateAssistant('apiKey', e.target.value)}
+                          placeholder="请输入应用 API 密钥..."
+                          className="bg-white/5 border-white/10 focus:border-primary/50 font-mono text-xs"
+                        />
+                      </div>
+                    </div>
+                  )}
+
+                  {activeTab === TabValue.GLOBAL && selectedAssistant.configMode === 'platform' && (
+                    <div className="space-y-6">
+                      <div className="space-y-2">
+                        <label className="text-sm font-medium text-white flex items-center">
+                          <BrainCircuit className="w-4 h-4 mr-2 text-primary" /> 大模型 (LLM Model)
+                        </label>
+                        <div className="relative group">
+                          <select
+                            className="flex h-10 w-full rounded-md border border-white/10 bg-white/5 px-3 py-1 text-sm shadow-sm transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-primary/50 [&>option]:bg-card text-foreground appearance-none cursor-pointer"
+                            value={selectedAssistant.llmModelId || ''}
+                            onChange={(e) => updateAssistant('llmModelId', e.target.value)}
                           >
-                            <option value="none">无</option>
-                            <option value="platform">平台配置</option>
-                            <option value="dify">Dify 接入</option>
-                            <option value="fastgpt">FastGPT 接入</option>
+                            <option value="">使用系统默认模型</option>
+                            {llmModels.filter(m => m.type === 'text').map(model => (
+                              <option key={model.id} value={model.id}>{model.name} ({model.vendor})</option>
+                            ))}
                           </select>
                           <ChevronDown className="absolute right-3 top-1/2 -translate-y-1/2 h-4 w-4 text-muted-foreground pointer-events-none group-hover:text-primary transition-colors" />
                         </div>
-                    </div>
+                        <p className="text-xs text-muted-foreground">选择用于驱动该助手对话的大语言模型。</p>
+                      </div>
 
-                    {!isNoneConfig && (
-                      <div className="flex bg-white/5 p-1 rounded-lg w-fit border border-white/5 animate-in fade-in slide-in-from-top-1">
-                          {selectedAssistant.configMode === 'platform' ? (
-                            <>
-                              <button
-                                  onClick={() => setActiveTab(TabValue.GLOBAL)}
-                                  className={`px-6 py-1.5 text-sm font-medium rounded-md transition-all ${activeTab === TabValue.GLOBAL ? 'bg-primary text-primary-foreground shadow-sm' : 'text-muted-foreground hover:text-foreground hover:bg-white/5'}`}
+                      <div className="space-y-2">
+                        <label className="text-sm font-medium text-white flex items-center">
+                          <BotIcon className="w-4 h-4 mr-2 text-primary" /> 提示词 (Prompt)
+                        </label>
+                        <div className="relative">
+                          <textarea
+                            className="flex min-h-[200px] w-full rounded-xl border border-white/10 bg-white/5 px-4 py-3 text-sm shadow-sm placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-primary/50 resize-y text-white"
+                            value={selectedAssistant.prompt}
+                            onChange={(e) => {
+                              const next = e.target.value;
+                              updateAssistant('prompt', next);
+                              updateTemplateSuggestionState('prompt', next, e.currentTarget.selectionStart, e.currentTarget);
+                            }}
+                            onKeyUp={(e) => {
+                              updateTemplateSuggestionState('prompt', e.currentTarget.value, e.currentTarget.selectionStart, e.currentTarget);
+                            }}
+                            onClick={(e) => {
+                              updateTemplateSuggestionState('prompt', e.currentTarget.value, e.currentTarget.selectionStart, e.currentTarget);
+                            }}
+                            onFocus={(e) => {
+                              updateTemplateSuggestionState('prompt', e.currentTarget.value, e.currentTarget.selectionStart, e.currentTarget);
+                            }}
+                            onBlur={() => {
+                              window.setTimeout(() => {
+                                setTemplateSuggestion((prev) => (prev?.field === 'prompt' ? null : prev));
+                              }, 120);
+                            }}
+                            placeholder="设定小助手的人设、语气、行为规范以及业务逻辑..."
+                          />
+                          {templateSuggestion?.field === 'prompt' &&
+                            filteredSystemTemplateVariables.length > 0 &&
+                            typeof document !== 'undefined' &&
+                            createPortal(
+                              <div
+                                className="fixed z-[100] w-[320px] max-w-[calc(100vw-1rem)] rounded-md border border-white/15 bg-black/95 shadow-xl backdrop-blur-md max-h-48 overflow-auto"
+                                style={{
+                                  left: templateSuggestion.anchorLeft,
+                                  top: templateSuggestion.anchorTop,
+                                }}
                               >
-                                  全局配置
+                                {filteredSystemTemplateVariables.map((item) => (
+                                  <button
+                                    key={item.key}
+                                    type="button"
+                                    className="w-full text-left px-3 py-2 hover:bg-white/10 transition-colors"
+                                    onMouseDown={(e) => {
+                                      e.preventDefault();
+                                      applySystemTemplateVariable('prompt', item.key);
+                                    }}
+                                  >
+                                    <div className="text-xs text-cyan-100">{`{{${item.key}}}`}</div>
+                                    <div className="text-[10px] text-muted-foreground mt-0.5">{item.description}</div>
+                                  </button>
+                                ))}
+                              </div>,
+                              document.body
+                            )}
+                        </div>
+                      </div>
+
+                      <div className="space-y-2">
+                        <div className="flex items-center justify-between gap-3">
+                          <label className="text-sm font-medium text-white flex items-center">
+                            <PhoneCall className="w-4 h-4 mr-2 text-primary" /> 首轮发言方
+                          </label>
+                          <div className="inline-flex rounded-lg border border-white/10 bg-white/5 p-1">
+                            <button
+                              type="button"
+                              onClick={() => updateAssistant('firstTurnMode', 'bot_first')}
+                              className={`px-3 py-1 text-xs rounded-md transition-colors ${isBotFirstTurn
+                                ? 'bg-primary text-primary-foreground shadow-sm'
+                                : 'text-muted-foreground hover:text-foreground'
+                                }`}
+                            >
+                              机器人先说
+                            </button>
+                            <button
+                              type="button"
+                              onClick={() => updateAssistant('firstTurnMode', 'user_first')}
+                              className={`px-3 py-1 text-xs rounded-md transition-colors ${isBotFirstTurn
+                                ? 'text-muted-foreground hover:text-foreground'
+                                : 'bg-primary text-primary-foreground shadow-sm'
+                                }`}
+                            >
+                              用户先说
+                            </button>
+                          </div>
+                        </div>
+                        <p className="text-xs text-muted-foreground">
+                          {isBotFirstTurn ? '决定通话接通后由谁先开始第一句对话。' : '当前为“用户先说”，已隐藏开场白设置。'}
+                        </p>
+                      </div>
+
+                      {isBotFirstTurn && (
+                        <div className="space-y-2">
+                          <div className="flex items-center justify-between gap-3">
+                            <label className="text-sm font-medium flex items-center text-white">
+                              <MessageSquare className="w-4 h-4 mr-2 text-primary" /> 开场白
+                            </label>
+                            <div className="inline-flex rounded-lg border border-white/10 bg-white/5 p-1">
+                              <button
+                                type="button"
+                                onClick={() => updateAssistant('generatedOpenerEnabled', false)}
+                                className={`px-3 py-1 text-xs rounded-md transition-colors ${selectedAssistant.generatedOpenerEnabled === true
+                                  ? 'text-muted-foreground hover:text-foreground'
+                                  : 'bg-primary text-primary-foreground shadow-sm'
+                                  }`}
+                              >
+                                手动输入
                               </button>
                               <button
-                                  onClick={() => setActiveTab(TabValue.VOICE)}
-                                  className={`px-6 py-1.5 text-sm font-medium rounded-md transition-all ${activeTab === TabValue.VOICE ? 'bg-primary text-primary-foreground shadow-sm' : 'text-muted-foreground hover:text-foreground hover:bg-white/5'}`}
+                                type="button"
+                                onClick={() => updateAssistant('generatedOpenerEnabled', true)}
+                                className={`px-3 py-1 text-xs rounded-md transition-colors ${selectedAssistant.generatedOpenerEnabled === true
+                                  ? 'bg-primary text-primary-foreground shadow-sm'
+                                  : 'text-muted-foreground hover:text-foreground'
+                                  }`}
                               >
-                                  语音配置
+                                自动生成
                               </button>
-                              <button
-                                  onClick={() => setActiveTab(TabValue.TOOLS)}
-                                  className={`px-6 py-1.5 text-sm font-medium rounded-md transition-all ${activeTab === TabValue.TOOLS ? 'bg-primary text-primary-foreground shadow-sm' : 'text-muted-foreground hover:text-foreground hover:bg-white/5'}`}
-                              >
-                                  工具配置
-                              </button>
-                              <button
-                                  onClick={() => setActiveTab(TabValue.KNOWLEDGE)}
-                                  className={`px-6 py-1.5 text-sm font-medium rounded-md transition-all ${activeTab === TabValue.KNOWLEDGE ? 'bg-primary text-primary-foreground shadow-sm' : 'text-muted-foreground hover:text-foreground hover:bg-white/5'}`}
-                              >
-                                  知识库配置
-                              </button>
-                            </>
+                            </div>
+                          </div>
+                          {selectedAssistant.generatedOpenerEnabled === true ? (
+                            <div className="rounded-md border border-dashed border-white/15 bg-white/5 px-3 py-2 text-xs text-muted-foreground">
+                              自动生成模式下不使用固定开场白文本，仅依据系统提示词生成首句。
+                            </div>
                           ) : (
-                            <>
-                              <button
-                                  onClick={() => setActiveTab(TabValue.LINK)}
-                                  className={`px-6 py-1.5 text-sm font-medium rounded-md transition-all ${activeTab === TabValue.LINK ? 'bg-primary text-primary-foreground shadow-sm' : 'text-muted-foreground hover:text-foreground hover:bg-white/5'}`}
-                              >
-                                  链接设置
-                              </button>
-                              <button
-                                  onClick={() => setActiveTab(TabValue.VOICE)}
-                                  className={`px-6 py-1.5 text-sm font-medium rounded-md transition-all ${activeTab === TabValue.VOICE ? 'bg-primary text-primary-foreground shadow-sm' : 'text-muted-foreground hover:text-foreground hover:bg-white/5'}`}
-                              >
-                                  语音设置
-                              </button>
-                            </>
-                          )}
-                      </div>
-                    )}
-                </div>
-
-                <div className="flex-1 overflow-y-auto p-8 custom-scrollbar">
-                    {isNoneConfig ? (
-                      <div className="h-full flex flex-col items-center justify-center text-muted-foreground opacity-40 animate-in fade-in">
-                          <AlertTriangle className="w-12 h-12 mb-4" />
-                          <p className="text-sm font-medium">请先选择配置方式以展开详细设置</p>
-                      </div>
-                    ) : (
-                      <div className="max-w-4xl mx-auto space-y-8 animate-in slide-in-from-bottom-2 duration-300">
-                        {activeTab === TabValue.LINK && isExternalConfig && (
-                           <div className="space-y-6 animate-in fade-in">
-                              <div className="p-4 rounded-xl bg-primary/5 border border-primary/20 flex items-start gap-3 mb-4">
-                                <Database className="w-5 h-5 text-primary shrink-0 mt-0.5" />
-                                <div>
-                                  <h4 className="text-sm font-bold text-white mb-1">
-                                    接入 {selectedAssistant.configMode === 'dify' ? 'Dify' : 'FastGPT'} 引擎
-                                  </h4>
-                                  <p className="text-xs text-muted-foreground leading-relaxed">
-                                    配置后，视频通话过程中的对话逻辑、知识库检索以及工作流将由外部引擎托管。
-                                  </p>
-                                </div>
-                              </div>
-
-                              <div className="space-y-2">
-                                  <label className="text-sm font-medium text-white flex items-center">
-                                      <Globe className="w-4 h-4 mr-2 text-primary"/> 接口地址 (API URL)
-                                  </label>
-                                  <Input 
-                                      value={selectedAssistant.apiUrl || ''}
-                                      onChange={(e) => updateAssistant('apiUrl', e.target.value)}
-                                      placeholder={selectedAssistant.configMode === 'dify' ? "https://api.dify.ai/v1" : "https://api.fastgpt.in/api/v1"}
-                                      className="bg-white/5 border-white/10 focus:border-primary/50 font-mono text-xs"
-                                  />
-                              </div>
-
-                              <div className="space-y-2">
-                                  <label className="text-sm font-medium text-white flex items-center">
-                                      <Terminal className="w-4 h-4 mr-2 text-primary"/> 密钥 (API KEY)
-                                  </label>
-                                  <Input 
-                                      type="password"
-                                      value={selectedAssistant.apiKey || ''}
-                                      onChange={(e) => updateAssistant('apiKey', e.target.value)}
-                                      placeholder="请输入应用 API 密钥..."
-                                      className="bg-white/5 border-white/10 focus:border-primary/50 font-mono text-xs"
-                                  />
-                              </div>
-                           </div>
-                        )}
-
-                        {activeTab === TabValue.GLOBAL && selectedAssistant.configMode === 'platform' && (
-                            <div className="space-y-6">
-                                <div className="space-y-2">
-                                    <label className="text-sm font-medium text-white flex items-center">
-                                        <BrainCircuit className="w-4 h-4 mr-2 text-primary"/> 大模型 (LLM Model)
-                                    </label>
-                                    <div className="relative group">
-                                        <select
-                                            className="flex h-10 w-full rounded-md border border-white/10 bg-white/5 px-3 py-1 text-sm shadow-sm transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-primary/50 [&>option]:bg-card text-foreground appearance-none cursor-pointer"
-                                            value={selectedAssistant.llmModelId || ''}
-                                            onChange={(e) => updateAssistant('llmModelId', e.target.value)}
-                                        >
-                                            <option value="">使用系统默认模型</option>
-                                            {llmModels.filter(m => m.type === 'text').map(model => (
-                                                <option key={model.id} value={model.id}>{model.name} ({model.vendor})</option>
-                                            ))}
-                                        </select>
-                                        <ChevronDown className="absolute right-3 top-1/2 -translate-y-1/2 h-4 w-4 text-muted-foreground pointer-events-none group-hover:text-primary transition-colors" />
-                                    </div>
-                                    <p className="text-xs text-muted-foreground">选择用于驱动该助手对话的大语言模型。</p>
-                                </div>
-
-                                <div className="space-y-2">
-                                    <label className="text-sm font-medium text-white flex items-center">
-                                        <BotIcon className="w-4 h-4 mr-2 text-primary"/> 提示词 (Prompt)
-                                    </label>
-                                    <div className="relative">
-                                      <textarea 
-                                          className="flex min-h-[200px] w-full rounded-xl border border-white/10 bg-white/5 px-4 py-3 text-sm shadow-sm placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-primary/50 resize-y text-white"
-                                          value={selectedAssistant.prompt}
-                                          onChange={(e) => {
-                                            const next = e.target.value;
-                                            updateAssistant('prompt', next);
-                                            updateTemplateSuggestionState('prompt', next, e.currentTarget.selectionStart, e.currentTarget);
-                                          }}
-                                          onKeyUp={(e) => {
-                                            updateTemplateSuggestionState('prompt', e.currentTarget.value, e.currentTarget.selectionStart, e.currentTarget);
-                                          }}
-                                          onClick={(e) => {
-                                            updateTemplateSuggestionState('prompt', e.currentTarget.value, e.currentTarget.selectionStart, e.currentTarget);
-                                          }}
-                                          onFocus={(e) => {
-                                            updateTemplateSuggestionState('prompt', e.currentTarget.value, e.currentTarget.selectionStart, e.currentTarget);
-                                          }}
-                                          onBlur={() => {
-                                            window.setTimeout(() => {
-                                              setTemplateSuggestion((prev) => (prev?.field === 'prompt' ? null : prev));
-                                            }, 120);
-                                          }}
-                                          placeholder="设定小助手的人设、语气、行为规范以及业务逻辑..."
-                                      />
-                                      {templateSuggestion?.field === 'prompt' &&
-                                        filteredSystemTemplateVariables.length > 0 &&
-                                        typeof document !== 'undefined' &&
-                                        createPortal(
-                                          <div
-                                            className="fixed z-[100] w-[320px] max-w-[calc(100vw-1rem)] rounded-md border border-white/15 bg-black/95 shadow-xl backdrop-blur-md max-h-48 overflow-auto"
-                                            style={{
-                                              left: templateSuggestion.anchorLeft,
-                                              top: templateSuggestion.anchorTop,
-                                            }}
-                                          >
-                                            {filteredSystemTemplateVariables.map((item) => (
-                                              <button
-                                                key={item.key}
-                                                type="button"
-                                                className="w-full text-left px-3 py-2 hover:bg-white/10 transition-colors"
-                                                onMouseDown={(e) => {
-                                                  e.preventDefault();
-                                                  applySystemTemplateVariable('prompt', item.key);
-                                                }}
-                                              >
-                                                <div className="text-xs text-cyan-100">{`{{${item.key}}}`}</div>
-                                                <div className="text-[10px] text-muted-foreground mt-0.5">{item.description}</div>
-                                              </button>
-                                            ))}
-                                          </div>,
-                                          document.body
-                                        )}
-                                    </div>
-                                </div>
-
-                                <div className="space-y-2">
-                                    <div className="flex items-center justify-between gap-3">
-                                        <label className="text-sm font-medium text-white flex items-center">
-                                            <PhoneCall className="w-4 h-4 mr-2 text-primary"/> 首轮发言方
-                                        </label>
-                                        <div className="inline-flex rounded-lg border border-white/10 bg-white/5 p-1">
-                                            <button
-                                              type="button"
-                                              onClick={() => updateAssistant('firstTurnMode', 'bot_first')}
-                                              className={`px-3 py-1 text-xs rounded-md transition-colors ${
-                                                isBotFirstTurn
-                                                  ? 'bg-primary text-primary-foreground shadow-sm'
-                                                  : 'text-muted-foreground hover:text-foreground'
-                                              }`}
-                                            >
-                                              机器人先说
-                                            </button>
-                                            <button
-                                              type="button"
-                                              onClick={() => updateAssistant('firstTurnMode', 'user_first')}
-                                              className={`px-3 py-1 text-xs rounded-md transition-colors ${
-                                                isBotFirstTurn
-                                                  ? 'text-muted-foreground hover:text-foreground'
-                                                  : 'bg-primary text-primary-foreground shadow-sm'
-                                              }`}
-                                            >
-                                              用户先说
-                                            </button>
-                                        </div>
-                                    </div>
-                                    <p className="text-xs text-muted-foreground">
-                                      {isBotFirstTurn ? '决定通话接通后由谁先开始第一句对话。' : '当前为“用户先说”，已隐藏开场白设置。'}
-                                    </p>
-                                </div>
-
-                                {isBotFirstTurn && (
-                                <div className="space-y-2">
-                                    <div className="flex items-center justify-between gap-3">
-                                        <label className="text-sm font-medium flex items-center text-white">
-                                            <MessageSquare className="w-4 h-4 mr-2 text-primary"/> 开场白
-                                        </label>
-                                        <div className="inline-flex rounded-lg border border-white/10 bg-white/5 p-1">
-                                            <button
-                                              type="button"
-                                              onClick={() => updateAssistant('generatedOpenerEnabled', false)}
-                                              className={`px-3 py-1 text-xs rounded-md transition-colors ${
-                                                selectedAssistant.generatedOpenerEnabled === true
-                                                  ? 'text-muted-foreground hover:text-foreground'
-                                                  : 'bg-primary text-primary-foreground shadow-sm'
-                                              }`}
-                                            >
-                                              手动输入
-                                            </button>
-                                            <button
-                                              type="button"
-                                              onClick={() => updateAssistant('generatedOpenerEnabled', true)}
-                                              className={`px-3 py-1 text-xs rounded-md transition-colors ${
-                                                selectedAssistant.generatedOpenerEnabled === true
-                                                  ? 'bg-primary text-primary-foreground shadow-sm'
-                                                  : 'text-muted-foreground hover:text-foreground'
-                                              }`}
-                                            >
-                                              自动生成
-                                            </button>
-                                        </div>
-                                    </div>
-                                    {selectedAssistant.generatedOpenerEnabled === true ? (
-                                      <div className="rounded-md border border-dashed border-white/15 bg-white/5 px-3 py-2 text-xs text-muted-foreground">
-                                        自动生成模式下不使用固定开场白文本，仅依据系统提示词生成首句。
-                                      </div>
-                                    ) : (
-                                      <div className="relative">
-                                        <Input
-                                          value={selectedAssistant.opener}
-                                          onChange={(e) => {
-                                            const next = e.target.value;
-                                            updateAssistant('opener', next);
-                                            updateTemplateSuggestionState('opener', next, e.currentTarget.selectionStart, e.currentTarget);
-                                          }}
-                                          onKeyUp={(e) => {
-                                            updateTemplateSuggestionState('opener', e.currentTarget.value, e.currentTarget.selectionStart, e.currentTarget);
-                                          }}
-                                          onClick={(e) => {
-                                            updateTemplateSuggestionState('opener', e.currentTarget.value, e.currentTarget.selectionStart, e.currentTarget);
-                                          }}
-                                          onFocus={(e) => {
-                                            updateTemplateSuggestionState('opener', e.currentTarget.value, e.currentTarget.selectionStart, e.currentTarget);
-                                          }}
-                                          onBlur={() => {
-                                            window.setTimeout(() => {
-                                              setTemplateSuggestion((prev) => (prev?.field === 'opener' ? null : prev));
-                                            }, 120);
-                                          }}
-                                          placeholder="例如：您好，我是您的专属AI助手..."
-                                          className="bg-white/5 border-white/10 focus:border-primary/50"
-                                        />
-                                        {templateSuggestion?.field === 'opener' &&
-                                          filteredSystemTemplateVariables.length > 0 &&
-                                          typeof document !== 'undefined' &&
-                                          createPortal(
-                                            <div
-                                              className="fixed z-[100] w-[320px] max-w-[calc(100vw-1rem)] rounded-md border border-white/15 bg-black/95 shadow-xl backdrop-blur-md max-h-48 overflow-auto"
-                                              style={{
-                                                left: templateSuggestion.anchorLeft,
-                                                top: templateSuggestion.anchorTop,
-                                              }}
-                                            >
-                                              {filteredSystemTemplateVariables.map((item) => (
-                                                <button
-                                                  key={item.key}
-                                                  type="button"
-                                                  className="w-full text-left px-3 py-2 hover:bg-white/10 transition-colors"
-                                                  onMouseDown={(e) => {
-                                                    e.preventDefault();
-                                                    applySystemTemplateVariable('opener', item.key);
-                                                  }}
-                                                >
-                                                  <div className="text-xs text-cyan-100">{`{{${item.key}}}`}</div>
-                                                  <div className="text-[10px] text-muted-foreground mt-0.5">{item.description}</div>
-                                                </button>
-                                              ))}
-                                            </div>,
-                                            document.body
-                                          )}
-                                      </div>
-                                    )}
-                                    {selectedAssistant.generatedOpenerEnabled !== true && (
-                                      <div className="mt-3 p-3 rounded-lg border border-white/10 bg-white/[0.03] space-y-3">
-                                        <div className="flex items-center justify-between gap-3">
-                                          <label className="text-xs font-semibold text-white flex items-center">
-                                            <Wrench className="w-4 h-4 mr-2 text-primary" />
-                                            开场工具调用（手动模式）
-                                          </label>
-                                          <Button
-                                            type="button"
-                                            variant="secondary"
-                                            size="sm"
-                                            onClick={addManualOpenerToolCall}
-                                            disabled={(selectedAssistant.manualOpenerToolCalls || []).length >= 8}
-                                          >
-                                            <Plus className="w-3.5 h-3.5 mr-1.5" />
-                                            添加
-                                          </Button>
-                                        </div>
-                                        {(selectedAssistant.manualOpenerToolCalls || []).length === 0 ? (
-                                          <div className="text-[11px] text-muted-foreground border border-dashed border-white/10 rounded-md px-2 py-2">
-                                            未配置。可添加 text_msg_prompt / voice_msg_prompt 等工具作为开场动作。
-                                          </div>
-                                        ) : (
-                                          <div className="space-y-2">
-                                            {(selectedAssistant.manualOpenerToolCalls || []).map((call, idx) => (
-                                              <div key={`manual-opener-tool-${idx}`} className="rounded-md border border-white/10 bg-black/20 p-2 space-y-2">
-                                                <div className="grid grid-cols-[1fr_auto] gap-2 items-center">
-                                                  <select
-                                                    className="h-9 rounded-md border border-white/10 bg-white/5 px-2 text-xs text-foreground"
-                                                    value={normalizeToolId(call.toolName || '')}
-                                                    onChange={(e) => updateManualOpenerToolCall(idx, { toolName: e.target.value })}
-                                                  >
-                                                    <option value="">选择已启用工具</option>
-                                                    {normalizeToolId(call.toolName || '') && !openerToolOptions.some((tool: any) => tool.id === normalizeToolId(call.toolName || '')) && (
-                                                      <option value={normalizeToolId(call.toolName || '')}>
-                                                        {`${normalizeToolId(call.toolName || '')} (未启用/不存在)`}
-                                                      </option>
-                                                    )}
-                                                    {openerToolOptions.map((tool: any) => (
-                                                      <option key={tool.id} value={tool.id}>
-                                                        {tool.label}
-                                                      </option>
-                                                    ))}
-                                                  </select>
-                                                  <Button
-                                                    type="button"
-                                                    variant="ghost"
-                                                    size="icon"
-                                                    className="h-9 w-9 text-muted-foreground hover:text-red-300"
-                                                    onClick={() => removeManualOpenerToolCall(idx)}
-                                                    title="删除该工具调用"
-                                                  >
-                                                    <Trash2 className="w-3.5 h-3.5" />
-                                                  </Button>
-                                                </div>
-                                                <div className="flex items-center justify-between gap-2">
-                                                  <p className="text-[11px] text-muted-foreground">参数 JSON</p>
-                                                  {OPENER_TOOL_ARGUMENT_TEMPLATES[normalizeToolId(call.toolName || '')] && (
-                                                    <Button
-                                                      type="button"
-                                                      variant="outline"
-                                                      size="sm"
-                                                      className="h-7 px-2 text-[11px]"
-                                                      onClick={() => applyManualOpenerToolTemplate(idx)}
-                                                    >
-                                                      填充模板
-                                                    </Button>
-                                                  )}
-                                                </div>
-                                                <textarea
-                                                  value={typeof call.arguments === 'string' ? call.arguments : JSON.stringify(call.arguments || {}, null, 2)}
-                                                  onChange={(e) => updateManualOpenerToolCall(idx, { arguments: e.target.value })}
-                                                  rows={3}
-                                                  className="w-full rounded-md border border-white/10 bg-white/5 px-2 py-1.5 text-xs text-foreground"
-                                                  placeholder='参数 JSON（可选），例如 {"msg":"您好，请先选择业务类型"}。可点“填充模板”自动生成。'
-                                                />
-                                              </div>
-                                            ))}
-                                          </div>
-                                        )}
-                                        {openerToolOptions.length === 0 && (
-                                          <p className="text-[11px] text-amber-300/90">
-                                            当前助手未启用任何工具，请先在“工具配置”里添加后再选择。
-                                          </p>
-                                        )}
-                                        <p className="text-[11px] text-muted-foreground">
-                                          按列表顺序执行。参数必须是 JSON 对象；保存时会校验格式。text_msg_prompt / voice_msg_prompt / text_choice_prompt / voice_choice_prompt 支持一键填充模板。
-                                        </p>
-                                      </div>
-                                    )}
-                                    <p className="text-xs text-muted-foreground">
-                                      {selectedAssistant.generatedOpenerEnabled === true
-                                        ? '通话接通后将根据提示词自动生成开场白。'
-                                        : '接通通话后的第一句话。'}
-                                    </p>
-
-                                    <div className="mt-3 p-3 rounded-lg border border-white/10 bg-white/[0.03] space-y-2">
-                                      <div className="flex items-center justify-between gap-3">
-                                        <label className="text-xs font-semibold text-white flex items-center">
-                                          <Volume2 className="w-4 h-4 mr-2 text-primary" />
-                                          使用预加载开场音频
-                                        </label>
-                                        <div className="inline-flex rounded-lg border border-white/10 bg-white/5 p-1">
-                                          <button
-                                            type="button"
-                                            onClick={() => updateAssistant('openerAudioEnabled', false)}
-                                            className={`px-3 py-1 text-xs rounded-md transition-colors ${
-                                              selectedAssistant.openerAudioEnabled === true
-                                                ? 'text-muted-foreground hover:text-foreground'
-                                                : 'bg-primary text-primary-foreground shadow-sm'
-                                            }`}
-                                          >
-                                            关闭
-                                          </button>
-                                          <button
-                                            type="button"
-                                            onClick={() => updateAssistant('openerAudioEnabled', true)}
-                                            className={`px-3 py-1 text-xs rounded-md transition-colors ${
-                                              selectedAssistant.openerAudioEnabled === true
-                                                ? 'bg-primary text-primary-foreground shadow-sm'
-                                                : 'text-muted-foreground hover:text-foreground'
-                                            }`}
-                                          >
-                                            开启
-                                          </button>
-                                        </div>
-                                      </div>
-                                      <div className="flex items-center justify-between gap-3">
-                                        <p className="text-[11px] text-muted-foreground">
-                                          状态：
-                                          {selectedAssistant.openerAudioReady
-                                            ? `已生成 (${Math.round((selectedAssistant.openerAudioDurationMs || 0) / 1000)}s)`
-                                            : '未生成'}
-                                        </p>
-                                        <div className="flex items-center gap-2">
-                                          <Button
-                                            variant="secondary"
-                                            size="sm"
-                                            onClick={handlePreviewOpenerAudio}
-                                            disabled={!selectedAssistant.openerAudioReady || openerAudioGenerating}
-                                          >
-                                            <Play className="w-3.5 h-3.5 mr-1.5" />
-                                            {openerAudioPreviewing ? '播放中...' : '预览'}
-                                          </Button>
-                                          {openerAudioPreviewing && (
-                                            <Button variant="ghost" size="sm" onClick={stopOpenerAudioPreview}>
-                                              <Square className="w-3.5 h-3.5 mr-1.5" />
-                                              停止
-                                            </Button>
-                                          )}
-                                          <Button
-                                            variant="secondary"
-                                            size="sm"
-                                            onClick={handleGenerateOpenerAudio}
-                                            disabled={openerAudioGenerating || selectedAssistant.generatedOpenerEnabled === true}
-                                          >
-                                            {openerAudioGenerating ? '生成中...' : '生成开场预加载音频'}
-                                          </Button>
-                                        </div>
-                                      </div>
-                                      <p className="text-[11px] text-muted-foreground">
-                                        使用当前 TTS 配置生成并保存到后端；引擎可直接播放以降低首包延迟。
-                                      </p>
-                                    </div>
-                                </div>
-                                )}
-
-                            </div>
-                        )}
-
-                        {activeTab === TabValue.KNOWLEDGE && selectedAssistant.configMode === 'platform' && (
-                            <div className="space-y-8 animate-in fade-in">
-                                <div className="space-y-2">
-                                    <label className="text-sm font-medium text-white flex items-center">
-                                        <BrainCircuit className="w-4 h-4 mr-2 text-primary"/> 嵌入模型 (Embedding Model)
-                                    </label>
-                                    <div className="relative group">
-                                        <select
-                                            className="flex h-10 w-full rounded-md border border-white/10 bg-white/5 px-3 py-1 text-sm shadow-sm transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-primary/50 [&>option]:bg-card text-foreground appearance-none cursor-pointer"
-                                            value={selectedAssistant.embeddingModelId || ''}
-                                            onChange={(e) => updateAssistant('embeddingModelId', e.target.value)}
-                                        >
-                                            <option value="">使用系统默认</option>
-                                            {llmModels.filter(m => m.type === 'embedding').map(model => (
-                                                <option key={model.id} value={model.id}>{model.name} ({model.vendor})</option>
-                                            ))}
-                                        </select>
-                                        <ChevronDown className="absolute right-3 top-1/2 -translate-y-1/2 h-4 w-4 text-muted-foreground pointer-events-none group-hover:text-primary transition-colors" />
-                                    </div>
-                                    <p className="text-xs text-muted-foreground">用于将文本转换为向量的嵌入模型。</p>
-                                </div>
-
-                                <div className="space-y-2">
-                                    <label className="text-sm font-medium text-white flex items-center">
-                                        <Filter className="w-4 h-4 mr-2 text-primary"/> 重排模型 (Rerank Model)
-                                    </label>
-                                    <div className="relative group">
-                                        <select
-                                            className="flex h-10 w-full rounded-md border border-white/10 bg-white/5 px-3 py-1 text-sm shadow-sm transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-primary/50 [&>option]:bg-card text-foreground appearance-none cursor-pointer"
-                                            value={selectedAssistant.rerankModelId || ''}
-                                            onChange={(e) => updateAssistant('rerankModelId', e.target.value)}
-                                        >
-                                            <option value="">不使用重排</option>
-                                            {llmModels.filter(m => m.type === 'rerank').map(model => (
-                                                <option key={model.id} value={model.id}>{model.name} ({model.vendor})</option>
-                                            ))}
-                                        </select>
-                                        <ChevronDown className="absolute right-3 top-1/2 -translate-y-1/2 h-4 w-4 text-muted-foreground pointer-events-none group-hover:text-primary transition-colors" />
-                                    </div>
-                                    <p className="text-xs text-muted-foreground">可选配置。重排模型可优化检索结果的相关性排序。</p>
-                                </div>
-
-                                <div className="space-y-2">
-                                    <label className="text-sm font-medium text-white flex items-center">
-                                        <Book className="w-4 h-4 mr-2 text-primary"/> 知识库挂载 (Knowledge Base)
-                                    </label>
-                                    <div className="relative group">
-                                        <select 
-                                            className="flex h-10 w-full rounded-md border border-white/10 bg-white/5 px-3 py-1 text-sm shadow-sm transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-primary/50 [&>option]:bg-card text-foreground appearance-none cursor-pointer"
-                                            value={selectedAssistant.knowledgeBaseId}
-                                            onChange={(e) => updateAssistant('knowledgeBaseId', e.target.value)}
-                                        >
-                                            <option value="">如果不选择，则使用通用大模型知识</option>
-                                            {knowledgeBases.map(kb => (
-                                                <option key={kb.id} value={kb.id}>{kb.name}</option>
-                                            ))}
-                                        </select>
-                                        <ChevronDown className="absolute right-3 top-1/2 -translate-y-1/2 h-4 w-4 text-muted-foreground pointer-events-none group-hover:text-primary transition-colors" />
-                                    </div>
-                                    <p className="text-xs text-muted-foreground">选择助手回答问题时参考的私有知识库。</p>
-                                </div>
-                            </div>
-                        )}
-
-                        {activeTab === TabValue.VOICE && !isNoneConfig && (
-                            <div className="space-y-8">
-                                <div className="space-y-2">
-                                    <label className="text-sm font-medium text-white flex items-center">
-                                        <Ear className="w-4 h-4 mr-2 text-primary"/> 语音识别 (ASR Model)
-                                    </label>
-                                    <div className="relative group">
-                                        <select 
-                                            className="flex h-12 w-full rounded-xl border border-white/10 bg-white/5 px-4 py-1 text-sm shadow-sm transition-all focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-primary/50 [&>option]:bg-card text-foreground appearance-none cursor-pointer"
-                                            value={selectedAssistant.asrModelId || ''}
-                                            onChange={(e) => updateAssistant('asrModelId', e.target.value)}
-                                        >
-                                            <option value="">使用系统默认模型</option>
-                                            {asrModels.map(model => (
-                                                <option key={model.id} value={model.id}>
-                                                    {model.name} ({model.vendor})
-                                                </option>
-                                            ))}
-                                        </select>
-                                        <ChevronDown className="absolute right-4 top-1/2 -translate-y-1/2 h-4 w-4 text-muted-foreground pointer-events-none group-hover:text-primary transition-colors" />
-                                    </div>
-                                    <p className="text-xs text-muted-foreground flex items-center mt-1">
-                                        选择用于识别用户语音输入的模型。
-                                    </p>
-                                </div>
-
-                                <div className="space-y-3">
-                                    <div className="flex items-center justify-between gap-3">
-                                        <label className="text-sm font-medium text-white flex items-center">
-                                            <Mic className="w-4 h-4 mr-2 text-primary"/> 离线 ASR 中间结果
-                                        </label>
-                                        <div className="inline-flex rounded-lg border border-white/10 bg-white/5 p-1">
-                                            <button
-                                              type="button"
-                                              onClick={() => updateAssistant('asrInterimEnabled', false)}
-                                              className={`px-3 py-1 text-xs rounded-md transition-colors ${
-                                                selectedAssistant.asrInterimEnabled === true
-                                                  ? 'text-muted-foreground hover:text-foreground'
-                                                  : 'bg-primary text-primary-foreground shadow-sm'
-                                              }`}
-                                            >
-                                              关闭
-                                            </button>
-                                            <button
-                                              type="button"
-                                              onClick={() => updateAssistant('asrInterimEnabled', true)}
-                                              className={`px-3 py-1 text-xs rounded-md transition-colors ${
-                                                selectedAssistant.asrInterimEnabled === true
-                                                  ? 'bg-primary text-primary-foreground shadow-sm'
-                                                  : 'text-muted-foreground hover:text-foreground'
-                                              }`}
-                                            >
-                                              开启
-                                            </button>
-                                        </div>
-                                    </div>
-                                    <p className="text-xs text-muted-foreground">
-                                        仅影响离线 ASR 模式（OpenAI Compatible / buffered）。默认关闭。
-                                    </p>
-                                </div>
-
-                                <div className="space-y-3">
-                                    <div className="flex items-center justify-between gap-3">
-                                        <label className="text-sm font-medium text-white flex items-center">
-                                            <Volume2 className="w-4 h-4 mr-2 text-primary"/> 语音输出
-                                        </label>
-                                        <div className="inline-flex rounded-lg border border-white/10 bg-white/5 p-1">
-                                            <button
-                                              type="button"
-                                              onClick={() => updateAssistant('voiceOutputEnabled', false)}
-                                              className={`px-3 py-1 text-xs rounded-md transition-colors ${
-                                                selectedAssistant.voiceOutputEnabled !== false
-                                                  ? 'text-muted-foreground hover:text-foreground'
-                                                  : 'bg-primary text-primary-foreground shadow-sm'
-                                              }`}
-                                            >
-                                              关闭
-                                            </button>
-                                            <button
-                                              type="button"
-                                              onClick={() => updateAssistant('voiceOutputEnabled', true)}
-                                              className={`px-3 py-1 text-xs rounded-md transition-colors ${
-                                                selectedAssistant.voiceOutputEnabled !== false
-                                                  ? 'bg-primary text-primary-foreground shadow-sm'
-                                                  : 'text-muted-foreground hover:text-foreground'
-                                              }`}
-                                            >
-                                              开启
-                                            </button>
-                                        </div>
-                                    </div>
-
-                                    <div className="relative group">
-                                        <select 
-                                            className="flex h-12 w-full rounded-xl border border-white/10 bg-white/5 px-4 py-1 text-sm shadow-sm transition-all focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-primary/50 [&>option]:bg-card text-foreground appearance-none cursor-pointer disabled:opacity-50 disabled:cursor-not-allowed"
-                                            value={selectedAssistant.voice}
-                                            onChange={(e) => updateAssistant('voice', e.target.value)}
-                                            disabled={selectedAssistant.voiceOutputEnabled === false}
-                                        >
-                                            <option value="" disabled>请选择声音库中的声音...</option>
-                                            {voices.map(voice => (
-                                                <option key={voice.id} value={voice.id}>
-                                                    {voice.name} ({voice.vendor} - {voice.gender === 'Male' ? '男' : '女'})
-                                                </option>
-                                            ))}
-                                        </select>
-                                        <ChevronDown className="absolute right-4 top-1/2 -translate-y-1/2 h-4 w-4 text-muted-foreground pointer-events-none group-hover:text-primary transition-colors" />
-                                    </div>
-                                    <p className="text-xs text-muted-foreground flex items-center mt-1">
-                                        <Sparkles className="w-3 h-3 mr-1 text-primary opacity-70" />
-                                        {selectedAssistant.voiceOutputEnabled === false
-                                          ? '已关闭语音输出，仅文本回复。开启后可选择音色。'
-                                          : '音色配置同步自声音库。如需添加更多音色，请前往“声音库”模块。'}
-                                    </p>
-                                </div>
-
-                                <div className="space-y-4 pt-2">
-                                    <div className="flex items-center justify-between gap-3">
-                                        <label className="text-sm font-medium text-white flex items-center">
-                                            <ArrowLeftRight className="w-4 h-4 mr-2 text-primary" /> 打断控制
-                                        </label>
-                                        <div className="inline-flex rounded-lg border border-white/10 bg-white/5 p-1">
-                                            <button
-                                              type="button"
-                                              onClick={() => updateAssistant('botCannotBeInterrupted', false)}
-                                              className={`px-3 py-1 text-xs rounded-md transition-colors ${
-                                                selectedAssistant.botCannotBeInterrupted === true
-                                                  ? 'text-muted-foreground hover:text-foreground'
-                                                  : 'bg-primary text-primary-foreground shadow-sm'
-                                              }`}
-                                            >
-                                              可打断
-                                            </button>
-                                            <button
-                                              type="button"
-                                              onClick={() => updateAssistant('botCannotBeInterrupted', true)}
-                                              className={`px-3 py-1 text-xs rounded-md transition-colors ${
-                                                selectedAssistant.botCannotBeInterrupted === true
-                                                  ? 'bg-primary text-primary-foreground shadow-sm'
-                                                  : 'text-muted-foreground hover:text-foreground'
-                                              }`}
-                                            >
-                                              不可打断
-                                            </button>
-                                        </div>
-                                    </div>
-
-                                    {canAdjustInterruptionSensitivity && (
-                                      <>
-                                        <div className="flex justify-between items-center mb-1">
-                                            <label className="text-sm font-medium flex items-center text-white">
-                                                <Timer className="w-4 h-4 mr-2 text-primary"/> 打断灵敏度
-                                            </label>
-                                            <div className="flex items-center gap-2">
-                                                <div className="relative">
-                                                    <Input 
-                                                        type="number"
-                                                        value={selectedAssistant.interruptionSensitivity || 180}
-                                                        onChange={(e) => updateAssistant('interruptionSensitivity', parseInt(e.target.value) || 0)}
-                                                        className="w-20 h-8 text-right pr-7 text-xs font-mono bg-black/40 border-white/5"
-                                                    />
-                                                    <span className="absolute right-2 top-1/2 -translate-y-1/2 text-[10px] text-muted-foreground font-mono">ms</span>
-                                                </div>
-                                            </div>
-                                        </div>
-                                        <div className="flex items-center gap-6">
-                                            <input 
-                                                type="range" 
-                                                min="0" 
-                                                max="2000" 
-                                                step="50" 
-                                                value={selectedAssistant.interruptionSensitivity || 180}
-                                                onChange={(e) => updateAssistant('interruptionSensitivity', parseInt(e.target.value))}
-                                                className="flex-1 h-1.5 bg-secondary rounded-lg appearance-none cursor-pointer accent-primary"
-                                            />
-                                        </div>
-                                        <div className="flex justify-between text-[10px] font-mono uppercase tracking-widest px-0.5 text-muted-foreground opacity-50">
-                                            <span>0ms（极易打断）</span>
-                                            <span>1000ms</span>
-                                            <span>2000ms（较难打断）</span>
-                                        </div>
-                                        <p className="text-xs pt-1 italic text-muted-foreground opacity-60">
-                                            用户持续说话达到该时长后，AI 将停止当前发言并响应。数值越小越敏感，也更容易被噪音触发。
-                                        </p>
-                                      </>
-                                    )}
-                                </div>
-
-                                <div className="space-y-3">
-                                    <label className="text-sm font-medium text-white flex items-center">
-                                        <Mic className="w-4 h-4 mr-2 text-primary"/> ASR 热词优化 (Hotwords)
-                                    </label>
-                                    <div className="flex space-x-2">
-                                        <Input 
-                                            value={hotwordInput}
-                                            onChange={(e) => setHotwordInput(e.target.value)}
-                                            placeholder="输入专有名词或高频词汇..."
-                                            onKeyDown={(e) => e.key === 'Enter' && addHotword()}
-                                            className="bg-white/5 border-white/10"
-                                        />
-                                        <Button variant="secondary" onClick={addHotword} className="px-10 whitespace-nowrap">添加</Button>
-                                    </div>
-                                    <div className="flex flex-wrap gap-2 min-h-[40px] p-2 rounded-lg border border-dashed border-white/10">
-                                        {selectedAssistant.hotwords.length === 0 && (
-                                            <span className="text-xs text-muted-foreground py-1 px-1">暂无热词</span>
-                                        )}
-                                        {selectedAssistant.hotwords.map((word, idx) => (
-                                            <Badge key={idx} variant="outline" className="py-1">
-                                                {word}
-                                                <button onClick={() => removeHotword(word)} className="ml-2 hover:text-destructive transition-colors text-lg leading-none">×</button>
-                                            </Badge>
-                                        ))}
-                                    </div>
-                                    <p className="text-xs text-muted-foreground">添加热词可以提高语音识别特定词汇的准确率。</p>
-                                </div>
-                            </div>
-                        )}
-
-                        {activeTab === TabValue.TOOLS && selectedAssistant.configMode === 'platform' && (
-                            <div className="space-y-8 animate-in fade-in">
-                                <div className="flex items-center justify-between">
-                                    <h3 className="text-[10px] font-black flex items-center text-white uppercase tracking-[0.2em]">
-                                        <Wrench className="w-3.5 h-3.5 mr-2 text-primary" /> 已启用工具
-                                    </h3>
-                                    <button
+                            <div className="relative">
+                              <Input
+                                value={selectedAssistant.opener}
+                                onChange={(e) => {
+                                  const next = e.target.value;
+                                  updateAssistant('opener', next);
+                                  updateTemplateSuggestionState('opener', next, e.currentTarget.selectionStart, e.currentTarget);
+                                }}
+                                onKeyUp={(e) => {
+                                  updateTemplateSuggestionState('opener', e.currentTarget.value, e.currentTarget.selectionStart, e.currentTarget);
+                                }}
+                                onClick={(e) => {
+                                  updateTemplateSuggestionState('opener', e.currentTarget.value, e.currentTarget.selectionStart, e.currentTarget);
+                                }}
+                                onFocus={(e) => {
+                                  updateTemplateSuggestionState('opener', e.currentTarget.value, e.currentTarget.selectionStart, e.currentTarget);
+                                }}
+                                onBlur={() => {
+                                  window.setTimeout(() => {
+                                    setTemplateSuggestion((prev) => (prev?.field === 'opener' ? null : prev));
+                                  }, 120);
+                                }}
+                                placeholder="例如：您好，我是您的专属AI助手..."
+                                className="bg-white/5 border-white/10 focus:border-primary/50"
+                              />
+                              {templateSuggestion?.field === 'opener' &&
+                                filteredSystemTemplateVariables.length > 0 &&
+                                typeof document !== 'undefined' &&
+                                createPortal(
+                                  <div
+                                    className="fixed z-[100] w-[320px] max-w-[calc(100vw-1rem)] rounded-md border border-white/15 bg-black/95 shadow-xl backdrop-blur-md max-h-48 overflow-auto"
+                                    style={{
+                                      left: templateSuggestion.anchorLeft,
+                                      top: templateSuggestion.anchorTop,
+                                    }}
+                                  >
+                                    {filteredSystemTemplateVariables.map((item) => (
+                                      <button
+                                        key={item.key}
                                         type="button"
-                                        onClick={() => setToolPickerOpen(true)}
-                                        className="h-7 w-7 rounded-full border border-white/15 bg-white/5 text-muted-foreground hover:text-white hover:border-primary/50 hover:bg-primary/10 flex items-center justify-center transition-colors"
-                                        title="添加工具"
-                                    >
-                                        <Plus className="w-3.5 h-3.5" />
-                                    </button>
-                                </div>
-
-                                <div className="space-y-4">
-                                    <div className="flex items-center justify-between">
-                                        <h3 className="text-[10px] font-black flex items-center text-primary uppercase tracking-[0.2em]">
-                                            <Wrench className="w-3.5 h-3.5 mr-2" /> 系统指令
-                                        </h3>
-                                    </div>
-                                    <div className="grid grid-cols-1 sm:grid-cols-2 gap-4">
-                                        {activeSystemTools.map(tool => (
-                                            <div
-                                                key={tool.id}
-                                                className="p-4 rounded-xl border border-primary/40 bg-primary/10 shadow-[0_0_15px_rgba(6,182,212,0.1)] relative flex items-start space-x-3"
-                                            >
-                                                <button
-                                                    type="button"
-                                                    onClick={(e) => removeImportedTool(e, tool)}
-                                                    className="absolute -top-1 -right-1 p-0.5 rounded-full bg-destructive text-white hover:scale-110 transition-transform shadow-lg z-10"
-                                                    title="移除工具"
-                                                >
-                                                    <X className="w-3 h-3" />
-                                                </button>
-                                                <div className="p-2 rounded-lg shrink-0 bg-primary text-primary-foreground">
-                                                    {renderToolIcon(tool.icon)}
-                                                </div>
-                                                <div className="flex-1 min-w-0">
-                                                    <div className="text-sm font-bold text-white">{tool.name}</div>
-                                                    <p className="text-[10px] text-muted-foreground line-clamp-1 opacity-70">{tool.description}</p>
-                                                </div>
-                                            </div>
-                                        ))}
-                                        {activeSystemTools.length === 0 && (
-                                            <div className="col-span-full p-4 rounded-xl border border-dashed border-white/10 text-xs text-muted-foreground">
-                                                暂未启用系统指令工具
-                                            </div>
-                                        )}
-                                    </div>
-                                </div>
-
-                                <div className="space-y-4">
-                                    <div className="flex items-center justify-between">
-                                        <h3 className="text-[10px] font-black flex items-center text-blue-400 uppercase tracking-[0.2em]">
-                                            <TrendingUp className="w-3.5 h-3.5 mr-2" /> 信息查询
-                                        </h3>
-                                    </div>
-                                    <div className="grid grid-cols-1 sm:grid-cols-2 gap-4">
-                                        {activeQueryTools.map(tool => (
-                                            <div
-                                                key={tool.id}
-                                                className="p-4 rounded-xl border border-blue-500/40 bg-blue-500/10 shadow-[0_0_15px_rgba(59,130,246,0.1)] relative flex items-start space-x-3"
-                                            >
-                                                <button
-                                                    type="button"
-                                                    onClick={(e) => removeImportedTool(e, tool)}
-                                                    className="absolute -top-1 -right-1 p-0.5 rounded-full bg-destructive text-white hover:scale-110 transition-transform shadow-lg z-10"
-                                                    title="移除工具"
-                                                >
-                                                    <X className="w-3 h-3" />
-                                                </button>
-                                                <div className="p-2 rounded-lg shrink-0 bg-blue-500 text-white">
-                                                    {renderToolIcon(tool.icon)}
-                                                </div>
-                                                <div className="flex-1 min-w-0">
-                                                    <div className="text-sm font-bold text-white">{tool.name}</div>
-                                                    <p className="text-[10px] text-muted-foreground line-clamp-1 opacity-70">{tool.description}</p>
-                                                </div>
-                                            </div>
-                                        ))}
-                                        {activeQueryTools.length === 0 && (
-                                            <div className="col-span-full p-4 rounded-xl border border-dashed border-white/10 text-xs text-muted-foreground">
-                                                暂未启用信息查询工具
-                                            </div>
-                                        )}
-                                    </div>
-                                </div>
-
-                                <div className="p-4 bg-white/5 border border-white/5 rounded-xl text-[10px] text-muted-foreground flex items-center gap-3">
-                                    <Rocket className="w-4 h-4 text-primary shrink-0" />
-                                    <span>提示：此处仅导入工具库中的已有工具。移除仅对当前小助手生效，不会删除工具库。</span>
-                                </div>
+                                        className="w-full text-left px-3 py-2 hover:bg-white/10 transition-colors"
+                                        onMouseDown={(e) => {
+                                          e.preventDefault();
+                                          applySystemTemplateVariable('opener', item.key);
+                                        }}
+                                      >
+                                        <div className="text-xs text-cyan-100">{`{{${item.key}}}`}</div>
+                                        <div className="text-[10px] text-muted-foreground mt-0.5">{item.description}</div>
+                                      </button>
+                                    ))}
+                                  </div>,
+                                  document.body
+                                )}
                             </div>
+                          )}
+                          {selectedAssistant.generatedOpenerEnabled !== true && (
+                            <div className="mt-3 p-3 rounded-lg border border-white/10 bg-white/[0.03] space-y-3">
+                              <div className="flex items-center justify-between gap-3">
+                                <label className="text-xs font-semibold text-white flex items-center">
+                                  <Wrench className="w-4 h-4 mr-2 text-primary" />
+                                  开场工具调用（手动模式）
+                                </label>
+                                <Button
+                                  type="button"
+                                  variant="secondary"
+                                  size="sm"
+                                  onClick={addManualOpenerToolCall}
+                                  disabled={(selectedAssistant.manualOpenerToolCalls || []).length >= 8}
+                                >
+                                  <Plus className="w-3.5 h-3.5 mr-1.5" />
+                                  添加
+                                </Button>
+                              </div>
+                              {(selectedAssistant.manualOpenerToolCalls || []).length === 0 ? (
+                                <div className="text-[11px] text-muted-foreground border border-dashed border-white/10 rounded-md px-2 py-2">
+                                  未配置。可添加 text_msg_prompt / voice_msg_prompt 等工具作为开场动作。
+                                </div>
+                              ) : (
+                                <div className="space-y-2">
+                                  {(selectedAssistant.manualOpenerToolCalls || []).map((call, idx) => (
+                                    <div key={`manual-opener-tool-${idx}`} className="rounded-md border border-white/10 bg-black/20 p-2 space-y-2">
+                                      <div className="grid grid-cols-[1fr_auto] gap-2 items-center">
+                                        <select
+                                          className="h-9 rounded-md border border-white/10 bg-white/5 px-2 text-xs text-foreground"
+                                          value={normalizeToolId(call.toolName || '')}
+                                          onChange={(e) => updateManualOpenerToolCall(idx, { toolName: e.target.value })}
+                                        >
+                                          <option value="">选择已启用工具</option>
+                                          {normalizeToolId(call.toolName || '') && !openerToolOptions.some((tool: any) => tool.id === normalizeToolId(call.toolName || '')) && (
+                                            <option value={normalizeToolId(call.toolName || '')}>
+                                              {`${normalizeToolId(call.toolName || '')} (未启用/不存在)`}
+                                            </option>
+                                          )}
+                                          {openerToolOptions.map((tool: any) => (
+                                            <option key={tool.id} value={tool.id}>
+                                              {tool.label}
+                                            </option>
+                                          ))}
+                                        </select>
+                                        <Button
+                                          type="button"
+                                          variant="ghost"
+                                          size="icon"
+                                          className="h-9 w-9 text-muted-foreground hover:text-red-300"
+                                          onClick={() => removeManualOpenerToolCall(idx)}
+                                          title="删除该工具调用"
+                                        >
+                                          <Trash2 className="w-3.5 h-3.5" />
+                                        </Button>
+                                      </div>
+                                      <div className="flex items-center justify-between gap-2">
+                                        <p className="text-[11px] text-muted-foreground">参数 JSON</p>
+                                        {OPENER_TOOL_ARGUMENT_TEMPLATES[normalizeToolId(call.toolName || '')] && (
+                                          <Button
+                                            type="button"
+                                            variant="outline"
+                                            size="sm"
+                                            className="h-7 px-2 text-[11px]"
+                                            onClick={() => applyManualOpenerToolTemplate(idx)}
+                                          >
+                                            填充模板
+                                          </Button>
+                                        )}
+                                      </div>
+                                      <textarea
+                                        value={typeof call.arguments === 'string' ? call.arguments : JSON.stringify(call.arguments || {}, null, 2)}
+                                        onChange={(e) => updateManualOpenerToolCall(idx, { arguments: e.target.value })}
+                                        rows={3}
+                                        className="w-full rounded-md border border-white/10 bg-white/5 px-2 py-1.5 text-xs text-foreground"
+                                        placeholder='参数 JSON（可选），例如 {"msg":"您好，请先选择业务类型"}。可点“填充模板”自动生成。'
+                                      />
+                                    </div>
+                                  ))}
+                                </div>
+                              )}
+                              {openerToolOptions.length === 0 && (
+                                <p className="text-[11px] text-amber-300/90">
+                                  当前助手未启用任何工具，请先在“工具配置”里添加后再选择。
+                                </p>
+                              )}
+                              <p className="text-[11px] text-muted-foreground">
+                                按列表顺序执行。参数必须是 JSON 对象；保存时会校验格式。text_msg_prompt / voice_msg_prompt / text_choice_prompt / voice_choice_prompt 支持一键填充模板。
+                              </p>
+                            </div>
+                          )}
+                          <p className="text-xs text-muted-foreground">
+                            {selectedAssistant.generatedOpenerEnabled === true
+                              ? '通话接通后将根据提示词自动生成开场白。'
+                              : '接通通话后的第一句话。'}
+                          </p>
+
+                          <div className="mt-3 p-3 rounded-lg border border-white/10 bg-white/[0.03] space-y-2">
+                            <div className="flex items-center justify-between gap-3">
+                              <label className="text-xs font-semibold text-white flex items-center">
+                                <Volume2 className="w-4 h-4 mr-2 text-primary" />
+                                使用预加载开场音频
+                              </label>
+                              <div className="inline-flex rounded-lg border border-white/10 bg-white/5 p-1">
+                                <button
+                                  type="button"
+                                  onClick={() => updateAssistant('openerAudioEnabled', false)}
+                                  className={`px-3 py-1 text-xs rounded-md transition-colors ${selectedAssistant.openerAudioEnabled === true
+                                    ? 'text-muted-foreground hover:text-foreground'
+                                    : 'bg-primary text-primary-foreground shadow-sm'
+                                    }`}
+                                >
+                                  关闭
+                                </button>
+                                <button
+                                  type="button"
+                                  onClick={() => updateAssistant('openerAudioEnabled', true)}
+                                  className={`px-3 py-1 text-xs rounded-md transition-colors ${selectedAssistant.openerAudioEnabled === true
+                                    ? 'bg-primary text-primary-foreground shadow-sm'
+                                    : 'text-muted-foreground hover:text-foreground'
+                                    }`}
+                                >
+                                  开启
+                                </button>
+                              </div>
+                            </div>
+                            <div className="flex items-center justify-between gap-3">
+                              <p className="text-[11px] text-muted-foreground">
+                                状态：
+                                {selectedAssistant.openerAudioReady
+                                  ? `已生成 (${Math.round((selectedAssistant.openerAudioDurationMs || 0) / 1000)}s)`
+                                  : '未生成'}
+                              </p>
+                              <div className="flex items-center gap-2">
+                                <Button
+                                  variant="secondary"
+                                  size="sm"
+                                  onClick={handlePreviewOpenerAudio}
+                                  disabled={!selectedAssistant.openerAudioReady || openerAudioGenerating}
+                                >
+                                  <Play className="w-3.5 h-3.5 mr-1.5" />
+                                  {openerAudioPreviewing ? '播放中...' : '预览'}
+                                </Button>
+                                {openerAudioPreviewing && (
+                                  <Button variant="ghost" size="sm" onClick={stopOpenerAudioPreview}>
+                                    <Square className="w-3.5 h-3.5 mr-1.5" />
+                                    停止
+                                  </Button>
+                                )}
+                                <Button
+                                  variant="secondary"
+                                  size="sm"
+                                  onClick={handleGenerateOpenerAudio}
+                                  disabled={openerAudioGenerating || selectedAssistant.generatedOpenerEnabled === true}
+                                >
+                                  {openerAudioGenerating ? '生成中...' : '生成开场预加载音频'}
+                                </Button>
+                              </div>
+                            </div>
+                            <p className="text-[11px] text-muted-foreground">
+                              使用当前 TTS 配置生成并保存到后端；引擎可直接播放以降低首包延迟。
+                            </p>
+                          </div>
+                        </div>
+                      )}
+
+                    </div>
+                  )}
+
+                  {activeTab === TabValue.KNOWLEDGE && selectedAssistant.configMode === 'platform' && (
+                    <div className="space-y-8 animate-in fade-in">
+                      <div className="space-y-2">
+                        <label className="text-sm font-medium text-white flex items-center">
+                          <BrainCircuit className="w-4 h-4 mr-2 text-primary" /> 嵌入模型 (Embedding Model)
+                        </label>
+                        <div className="relative group">
+                          <select
+                            className="flex h-10 w-full rounded-md border border-white/10 bg-white/5 px-3 py-1 text-sm shadow-sm transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-primary/50 [&>option]:bg-card text-foreground appearance-none cursor-pointer"
+                            value={selectedAssistant.embeddingModelId || ''}
+                            onChange={(e) => updateAssistant('embeddingModelId', e.target.value)}
+                          >
+                            <option value="">使用系统默认</option>
+                            {llmModels.filter(m => m.type === 'embedding').map(model => (
+                              <option key={model.id} value={model.id}>{model.name} ({model.vendor})</option>
+                            ))}
+                          </select>
+                          <ChevronDown className="absolute right-3 top-1/2 -translate-y-1/2 h-4 w-4 text-muted-foreground pointer-events-none group-hover:text-primary transition-colors" />
+                        </div>
+                        <p className="text-xs text-muted-foreground">用于将文本转换为向量的嵌入模型。</p>
+                      </div>
+
+                      <div className="space-y-2">
+                        <label className="text-sm font-medium text-white flex items-center">
+                          <Filter className="w-4 h-4 mr-2 text-primary" /> 重排模型 (Rerank Model)
+                        </label>
+                        <div className="relative group">
+                          <select
+                            className="flex h-10 w-full rounded-md border border-white/10 bg-white/5 px-3 py-1 text-sm shadow-sm transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-primary/50 [&>option]:bg-card text-foreground appearance-none cursor-pointer"
+                            value={selectedAssistant.rerankModelId || ''}
+                            onChange={(e) => updateAssistant('rerankModelId', e.target.value)}
+                          >
+                            <option value="">不使用重排</option>
+                            {llmModels.filter(m => m.type === 'rerank').map(model => (
+                              <option key={model.id} value={model.id}>{model.name} ({model.vendor})</option>
+                            ))}
+                          </select>
+                          <ChevronDown className="absolute right-3 top-1/2 -translate-y-1/2 h-4 w-4 text-muted-foreground pointer-events-none group-hover:text-primary transition-colors" />
+                        </div>
+                        <p className="text-xs text-muted-foreground">可选配置。重排模型可优化检索结果的相关性排序。</p>
+                      </div>
+
+                      <div className="space-y-2">
+                        <label className="text-sm font-medium text-white flex items-center">
+                          <Book className="w-4 h-4 mr-2 text-primary" /> 知识库挂载 (Knowledge Base)
+                        </label>
+                        <div className="relative group">
+                          <select
+                            className="flex h-10 w-full rounded-md border border-white/10 bg-white/5 px-3 py-1 text-sm shadow-sm transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-primary/50 [&>option]:bg-card text-foreground appearance-none cursor-pointer"
+                            value={selectedAssistant.knowledgeBaseId}
+                            onChange={(e) => updateAssistant('knowledgeBaseId', e.target.value)}
+                          >
+                            <option value="">如果不选择，则使用通用大模型知识</option>
+                            {knowledgeBases.map(kb => (
+                              <option key={kb.id} value={kb.id}>{kb.name}</option>
+                            ))}
+                          </select>
+                          <ChevronDown className="absolute right-3 top-1/2 -translate-y-1/2 h-4 w-4 text-muted-foreground pointer-events-none group-hover:text-primary transition-colors" />
+                        </div>
+                        <p className="text-xs text-muted-foreground">选择助手回答问题时参考的私有知识库。</p>
+                      </div>
+                    </div>
+                  )}
+
+                  {activeTab === TabValue.VOICE && !isNoneConfig && (
+                    <div className="space-y-8">
+                      <div className="space-y-2">
+                        <label className="text-sm font-medium text-white flex items-center">
+                          <Ear className="w-4 h-4 mr-2 text-primary" /> 语音识别 (ASR Model)
+                        </label>
+                        <div className="relative group">
+                          <select
+                            className="flex h-12 w-full rounded-xl border border-white/10 bg-white/5 px-4 py-1 text-sm shadow-sm transition-all focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-primary/50 [&>option]:bg-card text-foreground appearance-none cursor-pointer"
+                            value={selectedAssistant.asrModelId || ''}
+                            onChange={(e) => updateAssistant('asrModelId', e.target.value)}
+                          >
+                            <option value="">使用系统默认模型</option>
+                            {asrModels.map(model => (
+                              <option key={model.id} value={model.id}>
+                                {model.name} ({model.vendor})
+                              </option>
+                            ))}
+                          </select>
+                          <ChevronDown className="absolute right-4 top-1/2 -translate-y-1/2 h-4 w-4 text-muted-foreground pointer-events-none group-hover:text-primary transition-colors" />
+                        </div>
+                        <p className="text-xs text-muted-foreground flex items-center mt-1">
+                          选择用于识别用户语音输入的模型。
+                        </p>
+                      </div>
+
+                      <div className="space-y-3">
+                        <div className="flex items-center justify-between gap-3">
+                          <label className="text-sm font-medium text-white flex items-center">
+                            <Mic className="w-4 h-4 mr-2 text-primary" /> 离线 ASR 中间结果
+                          </label>
+                          <div className="inline-flex rounded-lg border border-white/10 bg-white/5 p-1">
+                            <button
+                              type="button"
+                              onClick={() => updateAssistant('asrInterimEnabled', false)}
+                              className={`px-3 py-1 text-xs rounded-md transition-colors ${selectedAssistant.asrInterimEnabled === true
+                                ? 'text-muted-foreground hover:text-foreground'
+                                : 'bg-primary text-primary-foreground shadow-sm'
+                                }`}
+                            >
+                              关闭
+                            </button>
+                            <button
+                              type="button"
+                              onClick={() => updateAssistant('asrInterimEnabled', true)}
+                              className={`px-3 py-1 text-xs rounded-md transition-colors ${selectedAssistant.asrInterimEnabled === true
+                                ? 'bg-primary text-primary-foreground shadow-sm'
+                                : 'text-muted-foreground hover:text-foreground'
+                                }`}
+                            >
+                              开启
+                            </button>
+                          </div>
+                        </div>
+                        <p className="text-xs text-muted-foreground">
+                          仅影响离线 ASR 模式（OpenAI Compatible / buffered）。默认关闭。
+                        </p>
+                      </div>
+
+                      <div className="space-y-3">
+                        <div className="flex items-center justify-between gap-3">
+                          <label className="text-sm font-medium text-white flex items-center">
+                            <Volume2 className="w-4 h-4 mr-2 text-primary" /> 语音输出
+                          </label>
+                          <div className="inline-flex rounded-lg border border-white/10 bg-white/5 p-1">
+                            <button
+                              type="button"
+                              onClick={() => updateAssistant('voiceOutputEnabled', false)}
+                              className={`px-3 py-1 text-xs rounded-md transition-colors ${selectedAssistant.voiceOutputEnabled !== false
+                                ? 'text-muted-foreground hover:text-foreground'
+                                : 'bg-primary text-primary-foreground shadow-sm'
+                                }`}
+                            >
+                              关闭
+                            </button>
+                            <button
+                              type="button"
+                              onClick={() => updateAssistant('voiceOutputEnabled', true)}
+                              className={`px-3 py-1 text-xs rounded-md transition-colors ${selectedAssistant.voiceOutputEnabled !== false
+                                ? 'bg-primary text-primary-foreground shadow-sm'
+                                : 'text-muted-foreground hover:text-foreground'
+                                }`}
+                            >
+                              开启
+                            </button>
+                          </div>
+                        </div>
+
+                        <div className="relative group">
+                          <select
+                            className="flex h-12 w-full rounded-xl border border-white/10 bg-white/5 px-4 py-1 text-sm shadow-sm transition-all focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-primary/50 [&>option]:bg-card text-foreground appearance-none cursor-pointer disabled:opacity-50 disabled:cursor-not-allowed"
+                            value={selectedAssistant.voice}
+                            onChange={(e) => updateAssistant('voice', e.target.value)}
+                            disabled={selectedAssistant.voiceOutputEnabled === false}
+                          >
+                            <option value="" disabled>请选择声音库中的声音...</option>
+                            {voices.map(voice => (
+                              <option key={voice.id} value={voice.id}>
+                                {voice.name} ({voice.vendor} - {voice.gender === 'Male' ? '男' : '女'})
+                              </option>
+                            ))}
+                          </select>
+                          <ChevronDown className="absolute right-4 top-1/2 -translate-y-1/2 h-4 w-4 text-muted-foreground pointer-events-none group-hover:text-primary transition-colors" />
+                        </div>
+                        <p className="text-xs text-muted-foreground flex items-center mt-1">
+                          <Sparkles className="w-3 h-3 mr-1 text-primary opacity-70" />
+                          {selectedAssistant.voiceOutputEnabled === false
+                            ? '已关闭语音输出，仅文本回复。开启后可选择音色。'
+                            : '音色配置同步自声音库。如需添加更多音色，请前往“声音库”模块。'}
+                        </p>
+                      </div>
+
+                      <div className="space-y-4 pt-2">
+                        <div className="flex items-center justify-between gap-3">
+                          <label className="text-sm font-medium text-white flex items-center">
+                            <ArrowLeftRight className="w-4 h-4 mr-2 text-primary" /> 打断控制
+                          </label>
+                          <div className="inline-flex rounded-lg border border-white/10 bg-white/5 p-1">
+                            <button
+                              type="button"
+                              onClick={() => updateAssistant('botCannotBeInterrupted', false)}
+                              className={`px-3 py-1 text-xs rounded-md transition-colors ${selectedAssistant.botCannotBeInterrupted === true
+                                ? 'text-muted-foreground hover:text-foreground'
+                                : 'bg-primary text-primary-foreground shadow-sm'
+                                }`}
+                            >
+                              可打断
+                            </button>
+                            <button
+                              type="button"
+                              onClick={() => updateAssistant('botCannotBeInterrupted', true)}
+                              className={`px-3 py-1 text-xs rounded-md transition-colors ${selectedAssistant.botCannotBeInterrupted === true
+                                ? 'bg-primary text-primary-foreground shadow-sm'
+                                : 'text-muted-foreground hover:text-foreground'
+                                }`}
+                            >
+                              不可打断
+                            </button>
+                          </div>
+                        </div>
+
+                        {canAdjustInterruptionSensitivity && (
+                          <>
+                            <div className="flex justify-between items-center mb-1">
+                              <label className="text-sm font-medium flex items-center text-white">
+                                <Timer className="w-4 h-4 mr-2 text-primary" /> 打断灵敏度
+                              </label>
+                              <div className="flex items-center gap-2">
+                                <div className="relative">
+                                  <Input
+                                    type="number"
+                                    value={selectedAssistant.interruptionSensitivity || 180}
+                                    onChange={(e) => updateAssistant('interruptionSensitivity', parseInt(e.target.value) || 0)}
+                                    className="w-20 h-8 text-right pr-7 text-xs font-mono bg-black/40 border-white/5"
+                                  />
+                                  <span className="absolute right-2 top-1/2 -translate-y-1/2 text-[10px] text-muted-foreground font-mono">ms</span>
+                                </div>
+                              </div>
+                            </div>
+                            <div className="flex items-center gap-6">
+                              <input
+                                type="range"
+                                min="0"
+                                max="2000"
+                                step="50"
+                                value={selectedAssistant.interruptionSensitivity || 180}
+                                onChange={(e) => updateAssistant('interruptionSensitivity', parseInt(e.target.value))}
+                                className="flex-1 h-1.5 bg-secondary rounded-lg appearance-none cursor-pointer accent-primary"
+                              />
+                            </div>
+                            <div className="flex justify-between text-[10px] font-mono uppercase tracking-widest px-0.5 text-muted-foreground opacity-50">
+                              <span>0ms（极易打断）</span>
+                              <span>1000ms</span>
+                              <span>2000ms（较难打断）</span>
+                            </div>
+                            <p className="text-xs pt-1 italic text-muted-foreground opacity-60">
+                              用户持续说话达到该时长后，AI 将停止当前发言并响应。数值越小越敏感，也更容易被噪音触发。
+                            </p>
+                          </>
                         )}
                       </div>
-                    )}
+
+                      <div className="space-y-3">
+                        <label className="text-sm font-medium text-white flex items-center">
+                          <Mic className="w-4 h-4 mr-2 text-primary" /> ASR 热词优化 (Hotwords)
+                        </label>
+                        <div className="flex space-x-2">
+                          <Input
+                            value={hotwordInput}
+                            onChange={(e) => setHotwordInput(e.target.value)}
+                            placeholder="输入专有名词或高频词汇..."
+                            onKeyDown={(e) => e.key === 'Enter' && addHotword()}
+                            className="bg-white/5 border-white/10"
+                          />
+                          <Button variant="secondary" onClick={addHotword} className="px-10 whitespace-nowrap">添加</Button>
+                        </div>
+                        <div className="flex flex-wrap gap-2 min-h-[40px] p-2 rounded-lg border border-dashed border-white/10">
+                          {selectedAssistant.hotwords.length === 0 && (
+                            <span className="text-xs text-muted-foreground py-1 px-1">暂无热词</span>
+                          )}
+                          {selectedAssistant.hotwords.map((word, idx) => (
+                            <Badge key={idx} variant="outline" className="py-1">
+                              {word}
+                              <button onClick={() => removeHotword(word)} className="ml-2 hover:text-destructive transition-colors text-lg leading-none">×</button>
+                            </Badge>
+                          ))}
+                        </div>
+                        <p className="text-xs text-muted-foreground">添加热词可以提高语音识别特定词汇的准确率。</p>
+                      </div>
+                    </div>
+                  )}
+
+                  {activeTab === TabValue.TOOLS && selectedAssistant.configMode === 'platform' && (
+                    <div className="space-y-8 animate-in fade-in">
+                      <div className="flex items-center justify-between">
+                        <h3 className="text-[10px] font-black flex items-center text-white uppercase tracking-[0.2em]">
+                          <Wrench className="w-3.5 h-3.5 mr-2 text-primary" /> 已启用工具
+                        </h3>
+                        <button
+                          type="button"
+                          onClick={() => setToolPickerOpen(true)}
+                          className="h-7 w-7 rounded-full border border-white/15 bg-white/5 text-muted-foreground hover:text-white hover:border-primary/50 hover:bg-primary/10 flex items-center justify-center transition-colors"
+                          title="添加工具"
+                        >
+                          <Plus className="w-3.5 h-3.5" />
+                        </button>
+                      </div>
+
+                      <div className="space-y-4">
+                        <div className="flex items-center justify-between">
+                          <h3 className="text-[10px] font-black flex items-center text-primary uppercase tracking-[0.2em]">
+                            <Wrench className="w-3.5 h-3.5 mr-2" /> 系统指令
+                          </h3>
+                        </div>
+                        <div className="grid grid-cols-1 sm:grid-cols-2 gap-4">
+                          {activeSystemTools.map(tool => (
+                            <div
+                              key={tool.id}
+                              className="p-4 rounded-xl border border-primary/40 bg-primary/10 shadow-[0_0_15px_rgba(6,182,212,0.1)] relative flex items-start space-x-3"
+                            >
+                              <button
+                                type="button"
+                                onClick={(e) => removeImportedTool(e, tool)}
+                                className="absolute -top-1 -right-1 p-0.5 rounded-full bg-destructive text-white hover:scale-110 transition-transform shadow-lg z-10"
+                                title="移除工具"
+                              >
+                                <X className="w-3 h-3" />
+                              </button>
+                              <div className="p-2 rounded-lg shrink-0 bg-primary text-primary-foreground">
+                                {renderToolIcon(tool.icon)}
+                              </div>
+                              <div className="flex-1 min-w-0">
+                                <div className="text-sm font-bold text-white">{tool.name}</div>
+                                <p className="text-[10px] text-muted-foreground line-clamp-1 opacity-70">{tool.description}</p>
+                              </div>
+                            </div>
+                          ))}
+                          {activeSystemTools.length === 0 && (
+                            <div className="col-span-full p-4 rounded-xl border border-dashed border-white/10 text-xs text-muted-foreground">
+                              暂未启用系统指令工具
+                            </div>
+                          )}
+                        </div>
+                      </div>
+
+                      <div className="space-y-4">
+                        <div className="flex items-center justify-between">
+                          <h3 className="text-[10px] font-black flex items-center text-blue-400 uppercase tracking-[0.2em]">
+                            <TrendingUp className="w-3.5 h-3.5 mr-2" /> 信息查询
+                          </h3>
+                        </div>
+                        <div className="grid grid-cols-1 sm:grid-cols-2 gap-4">
+                          {activeQueryTools.map(tool => (
+                            <div
+                              key={tool.id}
+                              className="p-4 rounded-xl border border-blue-500/40 bg-blue-500/10 shadow-[0_0_15px_rgba(59,130,246,0.1)] relative flex items-start space-x-3"
+                            >
+                              <button
+                                type="button"
+                                onClick={(e) => removeImportedTool(e, tool)}
+                                className="absolute -top-1 -right-1 p-0.5 rounded-full bg-destructive text-white hover:scale-110 transition-transform shadow-lg z-10"
+                                title="移除工具"
+                              >
+                                <X className="w-3 h-3" />
+                              </button>
+                              <div className="p-2 rounded-lg shrink-0 bg-blue-500 text-white">
+                                {renderToolIcon(tool.icon)}
+                              </div>
+                              <div className="flex-1 min-w-0">
+                                <div className="text-sm font-bold text-white">{tool.name}</div>
+                                <p className="text-[10px] text-muted-foreground line-clamp-1 opacity-70">{tool.description}</p>
+                              </div>
+                            </div>
+                          ))}
+                          {activeQueryTools.length === 0 && (
+                            <div className="col-span-full p-4 rounded-xl border border-dashed border-white/10 text-xs text-muted-foreground">
+                              暂未启用信息查询工具
+                            </div>
+                          )}
+                        </div>
+                      </div>
+
+                      <div className="p-4 bg-white/5 border border-white/5 rounded-xl text-[10px] text-muted-foreground flex items-center gap-3">
+                        <Rocket className="w-4 h-4 text-primary shrink-0" />
+                        <span>提示：此处仅导入工具库中的已有工具。移除仅对当前小助手生效，不会删除工具库。</span>
+                      </div>
+                    </div>
+                  )}
                 </div>
-            </>
-        ) : (
-            <div className="flex-1 flex flex-col items-center justify-center text-muted-foreground">
-                <div className="w-16 h-16 rounded-2xl bg-white/5 flex items-center justify-center mb-4">
-                    <BotIcon className="h-8 w-8 opacity-50" />
-                </div>
-                <p className="text-lg font-medium">请选择一个小助手</p>
-                <p className="text-sm opacity-60">从左侧列表选择或创建一个新的小助手以开始配置</p>
+              )}
             </div>
+          </>
+        ) : (
+          <div className="flex-1 flex flex-col items-center justify-center text-muted-foreground">
+            <div className="w-16 h-16 rounded-2xl bg-white/5 flex items-center justify-center mb-4">
+              <BotIcon className="h-8 w-8 opacity-50" />
+            </div>
+            <p className="text-lg font-medium">请选择一个小助手</p>
+            <p className="text-sm opacity-60">从左侧列表选择或创建一个新的小助手以开始配置</p>
+          </div>
         )}
       </div>
 
@@ -1668,87 +1654,87 @@ export const AssistantsPage: React.FC = () => {
         onClose={() => setIsPublishModalOpen(false)}
         title="发布小助手"
         footer={
-            <Button onClick={() => setIsPublishModalOpen(false)}>确认</Button>
+          <Button onClick={() => setIsPublishModalOpen(false)}>确认</Button>
         }
       >
         <div className="space-y-6">
-            <div className="flex bg-white/5 p-1 rounded-lg border border-white/10">
-                <button 
-                    onClick={() => setPublishTab('web')}
-                    className={`flex-1 flex items-center justify-center py-2 text-xs font-bold rounded-md transition-all ${publishTab === 'web' ? 'bg-primary text-primary-foreground shadow-lg' : 'text-muted-foreground hover:text-foreground'}`}
-                >
-                    <ExternalLink className="w-3.5 h-3.5 mr-2" /> 网页分享
-                </button>
-                <button 
-                    onClick={() => setPublishTab('api')}
-                    className={`flex-1 flex items-center justify-center py-2 text-xs font-bold rounded-md transition-all ${publishTab === 'api' ? 'bg-primary text-primary-foreground shadow-lg' : 'text-muted-foreground hover:text-foreground'}`}
-                >
-                    <Server className="w-3.5 h-3.5 mr-2" /> API 接入
-                </button>
-            </div>
+          <div className="flex bg-white/5 p-1 rounded-lg border border-white/10">
+            <button
+              onClick={() => setPublishTab('web')}
+              className={`flex-1 flex items-center justify-center py-2 text-xs font-bold rounded-md transition-all ${publishTab === 'web' ? 'bg-primary text-primary-foreground shadow-lg' : 'text-muted-foreground hover:text-foreground'}`}
+            >
+              <ExternalLink className="w-3.5 h-3.5 mr-2" /> 网页分享
+            </button>
+            <button
+              onClick={() => setPublishTab('api')}
+              className={`flex-1 flex items-center justify-center py-2 text-xs font-bold rounded-md transition-all ${publishTab === 'api' ? 'bg-primary text-primary-foreground shadow-lg' : 'text-muted-foreground hover:text-foreground'}`}
+            >
+              <Server className="w-3.5 h-3.5 mr-2" /> API 接入
+            </button>
+          </div>
 
-            {publishTab === 'web' ? (
-                <div className="space-y-4 animate-in fade-in slide-in-from-top-1">
-                    <div className="p-4 rounded-xl bg-primary/5 border border-primary/20 space-y-3">
-                        <div className="flex items-center gap-2 text-primary">
-                            <Zap className="w-4 h-4" />
-                            <h4 className="text-sm font-bold">交互体验站</h4>
-                        </div>
-                        <p className="text-xs text-muted-foreground leading-relaxed">
-                            该链接允许用户通过独立的浏览器页面与您的智能体进行交互。支持：文本对话、实时音频通话以及双向视频通话。
-                        </p>
-                    </div>
-                    <div className="space-y-2">
-                        <label className="text-[10px] text-muted-foreground font-black tracking-widest uppercase">公开访问链接</label>
-                        <div className="flex gap-2">
-                            <Input 
-                                readOnly 
-                                value={`https://ai-video.com/share/${selectedAssistant?.id}`} 
-                                className="bg-white/5 border-white/10 font-mono text-[11px] text-primary"
-                            />
-                            <Button variant="secondary" size="icon" onClick={() => handleCopyId('', `https://ai-video.com/share/${selectedAssistant?.id}`)}>
-                                {copySuccess ? <ClipboardCheck className="h-4 w-4 text-green-400" /> : <Copy className="h-4 w-4" />}
-                            </Button>
-                        </div>
-                    </div>
+          {publishTab === 'web' ? (
+            <div className="space-y-4 animate-in fade-in slide-in-from-top-1">
+              <div className="p-4 rounded-xl bg-primary/5 border border-primary/20 space-y-3">
+                <div className="flex items-center gap-2 text-primary">
+                  <Zap className="w-4 h-4" />
+                  <h4 className="text-sm font-bold">交互体验站</h4>
                 </div>
-            ) : (
-                <div className="space-y-5 animate-in fade-in slide-in-from-top-1">
-                    <div className="space-y-2">
-                        <label className="text-[10px] text-muted-foreground font-black tracking-widest uppercase">API Endpoint (v1)</label>
-                        <div className="flex gap-2">
-                            <Input 
-                                readOnly 
-                                value={`https://api.ai-video.com/v1/call/${selectedAssistant?.id}`} 
-                                className="bg-white/5 border-white/10 font-mono text-[11px]"
-                            />
-                            <Button variant="ghost" size="icon" onClick={() => handleCopyId('', `https://api.ai-video.com/v1/call/${selectedAssistant?.id}`)}>
-                                <Copy className="h-4 w-4" />
-                            </Button>
-                        </div>
-                    </div>
-                    <div className="space-y-2">
-                        <div className="flex items-center justify-between">
-                            <label className="text-[10px] text-muted-foreground font-black tracking-widest uppercase">Secret API KEY</label>
-                            <Badge variant="outline" className="text-[8px] opacity-50">PRIVATE</Badge>
-                        </div>
-                        <div className="flex gap-2">
-                            <Input 
-                                readOnly 
-                                type="password"
-                                value="sk-ai-video-78x29jKkL1M90vX..." 
-                                className="bg-white/5 border-white/10 font-mono text-[11px]"
-                            />
-                            <Button variant="ghost" size="icon" onClick={() => handleCopyId('', "sk-ai-video-78x29jKkL1M90vX...")}>
-                                <Copy className="h-4 w-4" />
-                            </Button>
-                        </div>
-                        <p className="text-[10px] text-muted-foreground italic flex items-center gap-1.5 px-1 mt-2">
-                            <Key className="w-3 h-3" /> API Key 仅用于身份鉴权，请务必妥善保存。
-                        </p>
-                    </div>
+                <p className="text-xs text-muted-foreground leading-relaxed">
+                  该链接允许用户通过独立的浏览器页面与您的智能体进行交互。支持：文本对话、实时音频通话以及双向视频通话。
+                </p>
+              </div>
+              <div className="space-y-2">
+                <label className="text-[10px] text-muted-foreground font-black tracking-widest uppercase">公开访问链接</label>
+                <div className="flex gap-2">
+                  <Input
+                    readOnly
+                    value={`https://ai-video.com/share/${selectedAssistant?.id}`}
+                    className="bg-white/5 border-white/10 font-mono text-[11px] text-primary"
+                  />
+                  <Button variant="secondary" size="icon" onClick={() => handleCopyId('', `https://ai-video.com/share/${selectedAssistant?.id}`)}>
+                    {copySuccess ? <ClipboardCheck className="h-4 w-4 text-green-400" /> : <Copy className="h-4 w-4" />}
+                  </Button>
                 </div>
-            )}
+              </div>
+            </div>
+          ) : (
+            <div className="space-y-5 animate-in fade-in slide-in-from-top-1">
+              <div className="space-y-2">
+                <label className="text-[10px] text-muted-foreground font-black tracking-widest uppercase">API Endpoint (v1)</label>
+                <div className="flex gap-2">
+                  <Input
+                    readOnly
+                    value={`https://api.ai-video.com/v1/call/${selectedAssistant?.id}`}
+                    className="bg-white/5 border-white/10 font-mono text-[11px]"
+                  />
+                  <Button variant="ghost" size="icon" onClick={() => handleCopyId('', `https://api.ai-video.com/v1/call/${selectedAssistant?.id}`)}>
+                    <Copy className="h-4 w-4" />
+                  </Button>
+                </div>
+              </div>
+              <div className="space-y-2">
+                <div className="flex items-center justify-between">
+                  <label className="text-[10px] text-muted-foreground font-black tracking-widest uppercase">Secret API KEY</label>
+                  <Badge variant="outline" className="text-[8px] opacity-50">PRIVATE</Badge>
+                </div>
+                <div className="flex gap-2">
+                  <Input
+                    readOnly
+                    type="password"
+                    value="sk-ai-video-78x29jKkL1M90vX..."
+                    className="bg-white/5 border-white/10 font-mono text-[11px]"
+                  />
+                  <Button variant="ghost" size="icon" onClick={() => handleCopyId('', "sk-ai-video-78x29jKkL1M90vX...")}>
+                    <Copy className="h-4 w-4" />
+                  </Button>
+                </div>
+                <p className="text-[10px] text-muted-foreground italic flex items-center gap-1.5 px-1 mt-2">
+                  <Key className="w-3 h-3" /> API Key 仅用于身份鉴权，请务必妥善保存。
+                </p>
+              </div>
+            </div>
+          )}
         </div>
       </Dialog>
 
@@ -1815,16 +1801,16 @@ export const AssistantsPage: React.FC = () => {
       </Dialog>
 
       {selectedAssistant && (
-         <DebugDrawer 
-           isOpen={debugOpen} 
-           onClose={() => setDebugOpen(false)} 
-           assistant={selectedAssistant}
-           voices={voices}
-           llmModels={llmModels}
-           asrModels={asrModels}
-           tools={tools}
-           textTtsEnabled={selectedAssistant.voiceOutputEnabled !== false}
-         />
+        <DebugDrawer
+          isOpen={debugOpen}
+          onClose={() => setDebugOpen(false)}
+          assistant={selectedAssistant}
+          voices={voices}
+          llmModels={llmModels}
+          asrModels={asrModels}
+          tools={tools}
+          textTtsEnabled={selectedAssistant.voiceOutputEnabled !== false}
+        />
       )}
 
       <Dialog
@@ -1858,31 +1844,31 @@ export const AssistantsPage: React.FC = () => {
       </Dialog>
 
       {/* Delete Confirmation Dialog */}
-      <Dialog 
-        isOpen={!!deleteId} 
-        onClose={() => setDeleteId(null)} 
+      <Dialog
+        isOpen={!!deleteId}
+        onClose={() => setDeleteId(null)}
         title="确认删除"
         footer={
-            <>
-                <Button variant="ghost" onClick={() => setDeleteId(null)}>取消</Button>
-                <Button variant="destructive" onClick={confirmDelete}>确认删除</Button>
-            </>
+          <>
+            <Button variant="ghost" onClick={() => setDeleteId(null)}>取消</Button>
+            <Button variant="destructive" onClick={confirmDelete}>确认删除</Button>
+          </>
         }
       >
         <div className="flex items-center space-x-4">
-            <div className="p-3 bg-destructive/10 rounded-full">
-                <AlertTriangle className="h-6 w-6 text-destructive" />
-            </div>
-            <div>
-                <p className="text-sm text-foreground text-white">
-                    您确定要删除此小助手吗？此操作无法撤销。
-                </p>
-                {deleteId && (
-                    <p className="text-xs text-muted-foreground mt-1">
-                        将要删除: {assistants.find(a => a.id === deleteId)?.name}
-                    </p>
-                )}
-            </div>
+          <div className="p-3 bg-destructive/10 rounded-full">
+            <AlertTriangle className="h-6 w-6 text-destructive" />
+          </div>
+          <div>
+            <p className="text-sm text-foreground text-white">
+              您确定要删除此小助手吗？此操作无法撤销。
+            </p>
+            {deleteId && (
+              <p className="text-xs text-muted-foreground mt-1">
+                将要删除: {assistants.find(a => a.id === deleteId)?.name}
+              </p>
+            )}
+          </div>
         </div>
       </Dialog>
     </div>
@@ -1890,15 +1876,15 @@ export const AssistantsPage: React.FC = () => {
 };
 
 // Icon helper
-const BotIcon = ({className}: {className?: string}) => (
-    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" className={className}>
-        <path d="M12 8V4H8" />
-        <rect width="16" height="12" x="4" y="8" rx="2" />
-        <path d="M2 14h2" />
-        <path d="M20 14h2" />
-        <path d="M15 13v2" />
-        <path d="M9 13v2" />
-    </svg>
+const BotIcon = ({ className }: { className?: string }) => (
+  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" className={className}>
+    <path d="M12 8V4H8" />
+    <rect width="16" height="12" x="4" y="8" rx="2" />
+    <path d="M2 14h2" />
+    <path d="M20 14h2" />
+    <path d="M15 13v2" />
+    <path d="M9 13v2" />
+  </svg>
 );
 
 const TOOL_PARAMETER_HINTS: Record<string, any> = {
@@ -2342,229 +2328,229 @@ export const DebugDrawer: React.FC<{
   sessionMetadataExtras,
   onProtocolEvent,
 }) => {
-  const TARGET_SAMPLE_RATE = 16000;
-  const PCM_FRAME_BYTES = 640; // WS v1 fixed 20ms frame for 16k mono pcm_s16le
-  const downsampleTo16k = (input: Float32Array, inputSampleRate: number): Float32Array => {
-    if (inputSampleRate === TARGET_SAMPLE_RATE) return input;
-    if (inputSampleRate < TARGET_SAMPLE_RATE) return input;
-    const ratio = inputSampleRate / TARGET_SAMPLE_RATE;
-    const outputLength = Math.max(1, Math.round(input.length / ratio));
-    const output = new Float32Array(outputLength);
-    let offsetInput = 0;
-    for (let i = 0; i < outputLength; i += 1) {
-      const nextOffsetInput = Math.min(input.length, Math.round((i + 1) * ratio));
-      let accum = 0;
-      let count = 0;
-      for (let j = offsetInput; j < nextOffsetInput; j += 1) {
-        accum += input[j];
-        count += 1;
+    const TARGET_SAMPLE_RATE = 16000;
+    const PCM_FRAME_BYTES = 640; // WS v1 fixed 20ms frame for 16k mono pcm_s16le
+    const downsampleTo16k = (input: Float32Array, inputSampleRate: number): Float32Array => {
+      if (inputSampleRate === TARGET_SAMPLE_RATE) return input;
+      if (inputSampleRate < TARGET_SAMPLE_RATE) return input;
+      const ratio = inputSampleRate / TARGET_SAMPLE_RATE;
+      const outputLength = Math.max(1, Math.round(input.length / ratio));
+      const output = new Float32Array(outputLength);
+      let offsetInput = 0;
+      for (let i = 0; i < outputLength; i += 1) {
+        const nextOffsetInput = Math.min(input.length, Math.round((i + 1) * ratio));
+        let accum = 0;
+        let count = 0;
+        for (let j = offsetInput; j < nextOffsetInput; j += 1) {
+          accum += input[j];
+          count += 1;
+        }
+        output[i] = count > 0 ? accum / count : input[Math.min(offsetInput, input.length - 1)] || 0;
+        offsetInput = nextOffsetInput;
       }
-      output[i] = count > 0 ? accum / count : input[Math.min(offsetInput, input.length - 1)] || 0;
-      offsetInput = nextOffsetInput;
-    }
-    return output;
-  };
+      return output;
+    };
 
-  const float32ToPcm16 = (input: Float32Array): Int16Array => {
-    const output = new Int16Array(input.length);
-    for (let i = 0; i < input.length; i += 1) {
-      const s = Math.max(-1, Math.min(1, input[i]));
-      output[i] = s < 0 ? Math.round(s * 0x8000) : Math.round(s * 0x7fff);
-    }
-    return output;
-  };
+    const float32ToPcm16 = (input: Float32Array): Int16Array => {
+      const output = new Int16Array(input.length);
+      for (let i = 0; i < input.length; i += 1) {
+        const s = Math.max(-1, Math.min(1, input[i]));
+        output[i] = s < 0 ? Math.round(s * 0x8000) : Math.round(s * 0x7fff);
+      }
+      return output;
+    };
 
-  const [mode, setMode] = useState<'text' | 'voice' | 'video'>('text');
-  const [messages, setMessages] = useState<DebugTranscriptMessage[]>([]);
-  const [inputText, setInputText] = useState('');
-  const [isLoading, setIsLoading] = useState(false);
-  const [callStatus, setCallStatus] = useState<'idle' | 'calling' | 'active'>('idle');
-  const [agentState, setAgentState] = useState<'listening' | 'thinking' | 'speaking'>('listening');
-  const [textPromptDialog, setTextPromptDialog] = useState<DebugTextPromptDialogState>({
-    open: false,
-    message: '',
-    promptType: 'text',
-  });
-  const [choicePromptDialog, setChoicePromptDialog] = useState<DebugChoicePromptDialogState>({ open: false, question: '', options: [] });
-  const textPromptDialogRef = useRef(textPromptDialog);
-  const choicePromptDialogRef = useRef(choicePromptDialog);
-  const promptDialogQueueRef = useRef<DebugPromptQueueItem[]>([]);
-  const promptAudioRef = useRef<HTMLAudioElement | null>(null);
-  const [textSessionStarted, setTextSessionStarted] = useState(false);
-  const [wsStatus, setWsStatus] = useState<'disconnected' | 'connecting' | 'ready' | 'error'>('disconnected');
-  const [wsError, setWsError] = useState('');
-  const wsStatusRef = useRef<'disconnected' | 'connecting' | 'ready' | 'error'>('disconnected');
-  const [resolvedConfigOpen, setResolvedConfigOpen] = useState(false);
-  const [resolvedConfigView, setResolvedConfigView] = useState<string>('');
-  const [captureConfigOpen, setCaptureConfigOpen] = useState(false);
-  const [captureConfigView, setCaptureConfigView] = useState<string>('');
-  const [settingsDrawerOpen, setSettingsDrawerOpen] = useState(false);
-  const [dynamicVariables, setDynamicVariables] = useState<DynamicVariableEntry[]>([]);
-  const [dynamicVariablesError, setDynamicVariablesError] = useState('');
-  const dynamicVariableSeqRef = useRef(0);
-  const wsUrl = useDebugPrefsStore((state) => state.wsUrl);
-  const setWsUrl = useDebugPrefsStore((state) => state.setWsUrl);
-  const aecEnabled = useDebugPrefsStore((state) => state.aecEnabled);
-  const setAecEnabled = useDebugPrefsStore((state) => state.setAecEnabled);
-  const nsEnabled = useDebugPrefsStore((state) => state.nsEnabled);
-  const setNsEnabled = useDebugPrefsStore((state) => state.setNsEnabled);
-  const agcEnabled = useDebugPrefsStore((state) => state.agcEnabled);
-  const setAgcEnabled = useDebugPrefsStore((state) => state.setAgcEnabled);
-  const clientToolEnabledMap = useDebugPrefsStore((state) => state.clientToolEnabledMap);
-  const setClientToolEnabled = useDebugPrefsStore((state) => state.setClientToolEnabled);
-  const hydrateClientToolDefaults = useDebugPrefsStore((state) => state.hydrateClientToolDefaults);
-  const nextDynamicVariableId = () => {
-    dynamicVariableSeqRef.current += 1;
-    return `var_${dynamicVariableSeqRef.current}`;
-  };
-  const isDynamicVariablesLocked =
-    wsStatus === 'connecting'
-    || wsStatus === 'ready'
-    || callStatus === 'calling'
-    || callStatus === 'active'
-    || textSessionStarted;
-  const requiredTemplateVariableKeys = useMemo(() => {
-    const keys = new Set<string>();
-    const includeOpenerTemplate = assistant.generatedOpenerEnabled !== true;
-    extractDynamicTemplateKeys(String(assistant.prompt || '')).forEach((key) => keys.add(key));
-    if (includeOpenerTemplate) {
-      extractDynamicTemplateKeys(String(assistant.opener || '')).forEach((key) => keys.add(key));
-    }
-    return Array.from(keys).sort();
-  }, [assistant.generatedOpenerEnabled, assistant.opener, assistant.prompt]);
-  const missingRequiredDynamicVariableKeys = useMemo(() => {
-    const valuesByKey = new Map<string, string>();
-    for (const row of dynamicVariables) {
-      const key = row.key.trim();
-      if (!key || valuesByKey.has(key)) continue;
-      valuesByKey.set(key, row.value);
-    }
-    return requiredTemplateVariableKeys.filter((key) => {
-      if (SYSTEM_DYNAMIC_VARIABLE_KEY_SET.has(key)) return false;
-      if (!valuesByKey.has(key)) return true;
-      return valuesByKey.get(key) === '';
+    const [mode, setMode] = useState<'text' | 'voice' | 'video'>('text');
+    const [messages, setMessages] = useState<DebugTranscriptMessage[]>([]);
+    const [inputText, setInputText] = useState('');
+    const [isLoading, setIsLoading] = useState(false);
+    const [callStatus, setCallStatus] = useState<'idle' | 'calling' | 'active'>('idle');
+    const [agentState, setAgentState] = useState<'listening' | 'thinking' | 'speaking'>('listening');
+    const [textPromptDialog, setTextPromptDialog] = useState<DebugTextPromptDialogState>({
+      open: false,
+      message: '',
+      promptType: 'text',
     });
-  }, [dynamicVariables, requiredTemplateVariableKeys]);
-  
-  // Media State
-  const videoRef = useRef<HTMLVideoElement>(null);
-  const streamRef = useRef<MediaStream | null>(null);
-  const scrollRef = useRef<HTMLDivElement>(null);
-  const wsRef = useRef<WebSocket | null>(null);
-  const wsReadyRef = useRef(false);
-  const pendingResolveRef = useRef<(() => void) | null>(null);
-  const pendingRejectRef = useRef<((e: Error) => void) | null>(null);
-  const submittedMetadataRef = useRef<Record<string, any> | null>(null);
-  const assistantDraftIndexRef = useRef<number | null>(null);
-  const assistantResponseIndexByIdRef = useRef<Map<string, number>>(new Map());
-  const pendingTtfbByResponseIdRef = useRef<Map<string, number>>(new Map());
-  const interruptedResponseIdsRef = useRef<Set<string>>(new Set());
-  const interruptedDropNoticeKeysRef = useRef<Set<string>>(new Set());
-  const audioCtxRef = useRef<AudioContext | null>(null);
-  const playbackTimeRef = useRef<number>(0);
-  const activeAudioSourcesRef = useRef<Set<AudioBufferSourceNode>>(new Set());
-  const queuedAudioBuffersRef = useRef<AudioBuffer[]>([]);
-  const queuedAudioDurationRef = useRef<number>(0);
-
-  const PLAYBACK_INITIAL_BUFFER_SECONDS = 0.25;
-  const PLAYBACK_MAX_AHEAD_SECONDS = 0.8;
-  const PLAYBACK_SCHEDULE_LEAD_SECONDS = 0.04;
-
-  const [devices, setDevices] = useState<MediaDeviceInfo[]>([]);
-  const [selectedCamera, setSelectedCamera] = useState<string>('');
-  const [selectedMic, setSelectedMic] = useState<string>('');
-  const [isSwapped, setIsSwapped] = useState(false); 
-
-  const micAudioCtxRef = useRef<AudioContext | null>(null);
-  const micSourceRef = useRef<MediaStreamAudioSourceNode | null>(null);
-  const micProcessorRef = useRef<ScriptProcessorNode | null>(null);
-  const micGainRef = useRef<GainNode | null>(null);
-  const micFrameBufferRef = useRef<Uint8Array>(new Uint8Array(0));
-  const userDraftIndexRef = useRef<number | null>(null);
-  const lastUserFinalRef = useRef<string>('');
-  const debugVolumePercentRef = useRef<number>(50);
-  const clientToolEnabledMapRef = useRef<Record<string, boolean>>(clientToolEnabledMap);
-  const isClientToolEnabled = (toolId: string) => clientToolEnabledMap[normalizeToolId(toolId)] !== false;
-  const isClientToolEnabledLive = (toolId: string) => clientToolEnabledMapRef.current[normalizeToolId(toolId)] !== false;
-  const selectedToolSchemas = useMemo(() => {
-    const ids = Array.from(new Set((assistant.tools || []).map((id) => normalizeToolId(id))));
-    const byId = new Map(tools.map((t) => [normalizeToolId(t.id), { ...t, id: normalizeToolId(t.id) }]));
-    return ids.map((id: any) => {
-      const item = byId.get(id);
-      const toolId = item?.id || id;
-      const debugClientTool = DEBUG_CLIENT_TOOLS.find((tool) => tool.id === toolId);
-      if (debugClientTool && !isClientToolEnabled(toolId)) {
-        return null;
+    const [choicePromptDialog, setChoicePromptDialog] = useState<DebugChoicePromptDialogState>({ open: false, question: '', options: [] });
+    const textPromptDialogRef = useRef(textPromptDialog);
+    const choicePromptDialogRef = useRef(choicePromptDialog);
+    const promptDialogQueueRef = useRef<DebugPromptQueueItem[]>([]);
+    const promptAudioRef = useRef<HTMLAudioElement | null>(null);
+    const [textSessionStarted, setTextSessionStarted] = useState(false);
+    const [wsStatus, setWsStatus] = useState<'disconnected' | 'connecting' | 'ready' | 'error'>('disconnected');
+    const [wsError, setWsError] = useState('');
+    const wsStatusRef = useRef<'disconnected' | 'connecting' | 'ready' | 'error'>('disconnected');
+    const [resolvedConfigOpen, setResolvedConfigOpen] = useState(false);
+    const [resolvedConfigView, setResolvedConfigView] = useState<string>('');
+    const [captureConfigOpen, setCaptureConfigOpen] = useState(false);
+    const [captureConfigView, setCaptureConfigView] = useState<string>('');
+    const [settingsDrawerOpen, setSettingsDrawerOpen] = useState(false);
+    const [dynamicVariables, setDynamicVariables] = useState<DynamicVariableEntry[]>([]);
+    const [dynamicVariablesError, setDynamicVariablesError] = useState('');
+    const dynamicVariableSeqRef = useRef(0);
+    const wsUrl = useDebugPrefsStore((state) => state.wsUrl);
+    const setWsUrl = useDebugPrefsStore((state) => state.setWsUrl);
+    const aecEnabled = useDebugPrefsStore((state) => state.aecEnabled);
+    const setAecEnabled = useDebugPrefsStore((state) => state.setAecEnabled);
+    const nsEnabled = useDebugPrefsStore((state) => state.nsEnabled);
+    const setNsEnabled = useDebugPrefsStore((state) => state.setNsEnabled);
+    const agcEnabled = useDebugPrefsStore((state) => state.agcEnabled);
+    const setAgcEnabled = useDebugPrefsStore((state) => state.setAgcEnabled);
+    const clientToolEnabledMap = useDebugPrefsStore((state) => state.clientToolEnabledMap);
+    const setClientToolEnabled = useDebugPrefsStore((state) => state.setClientToolEnabled);
+    const hydrateClientToolDefaults = useDebugPrefsStore((state) => state.hydrateClientToolDefaults);
+    const nextDynamicVariableId = () => {
+      dynamicVariableSeqRef.current += 1;
+      return `var_${dynamicVariableSeqRef.current}`;
+    };
+    const isDynamicVariablesLocked =
+      wsStatus === 'connecting'
+      || wsStatus === 'ready'
+      || callStatus === 'calling'
+      || callStatus === 'active'
+      || textSessionStarted;
+    const requiredTemplateVariableKeys = useMemo(() => {
+      const keys = new Set<string>();
+      const includeOpenerTemplate = assistant.generatedOpenerEnabled !== true;
+      extractDynamicTemplateKeys(String(assistant.prompt || '')).forEach((key) => keys.add(key));
+      if (includeOpenerTemplate) {
+        extractDynamicTemplateKeys(String(assistant.opener || '')).forEach((key) => keys.add(key));
       }
-      const isClientTool = debugClientTool ? true : (item?.category || 'query') === 'system';
-      const waitForResponse = isClientTool
-        ? (item?.waitForResponse ?? DEBUG_CLIENT_TOOL_WAIT_DEFAULTS[toolId] ?? false)
-        : false;
-      const parameterSchema = (item?.parameterSchema && typeof item.parameterSchema === 'object')
-        ? item.parameterSchema
-        : getDefaultToolParameters(toolId);
-      const parameterDefaults = (item?.parameterDefaults && typeof item.parameterDefaults === 'object')
-        ? item.parameterDefaults
-        : undefined;
-      return {
-        type: 'function',
-        executor: isClientTool ? 'client' : 'server',
-        waitForResponse,
-        ...(parameterDefaults && Object.keys(parameterDefaults).length > 0 ? { defaultArgs: parameterDefaults } : {}),
-        function: {
-          name: toolId,
-          description: item?.description || item?.name || debugClientTool?.description || id,
-          parameters: parameterSchema,
+      return Array.from(keys).sort();
+    }, [assistant.generatedOpenerEnabled, assistant.opener, assistant.prompt]);
+    const missingRequiredDynamicVariableKeys = useMemo(() => {
+      const valuesByKey = new Map<string, string>();
+      for (const row of dynamicVariables) {
+        const key = row.key.trim();
+        if (!key || valuesByKey.has(key)) continue;
+        valuesByKey.set(key, row.value);
+      }
+      return requiredTemplateVariableKeys.filter((key) => {
+        if (SYSTEM_DYNAMIC_VARIABLE_KEY_SET.has(key)) return false;
+        if (!valuesByKey.has(key)) return true;
+        return valuesByKey.get(key) === '';
+      });
+    }, [dynamicVariables, requiredTemplateVariableKeys]);
+
+    // Media State
+    const videoRef = useRef<HTMLVideoElement>(null);
+    const streamRef = useRef<MediaStream | null>(null);
+    const scrollRef = useRef<HTMLDivElement>(null);
+    const wsRef = useRef<WebSocket | null>(null);
+    const wsReadyRef = useRef(false);
+    const pendingResolveRef = useRef<(() => void) | null>(null);
+    const pendingRejectRef = useRef<((e: Error) => void) | null>(null);
+    const submittedMetadataRef = useRef<Record<string, any> | null>(null);
+    const assistantDraftIndexRef = useRef<number | null>(null);
+    const assistantResponseIndexByIdRef = useRef<Map<string, number>>(new Map());
+    const pendingTtfbByResponseIdRef = useRef<Map<string, number>>(new Map());
+    const interruptedResponseIdsRef = useRef<Set<string>>(new Set());
+    const interruptedDropNoticeKeysRef = useRef<Set<string>>(new Set());
+    const audioCtxRef = useRef<AudioContext | null>(null);
+    const playbackTimeRef = useRef<number>(0);
+    const activeAudioSourcesRef = useRef<Set<AudioBufferSourceNode>>(new Set());
+    const queuedAudioBuffersRef = useRef<AudioBuffer[]>([]);
+    const queuedAudioDurationRef = useRef<number>(0);
+
+    const PLAYBACK_INITIAL_BUFFER_SECONDS = 0.25;
+    const PLAYBACK_MAX_AHEAD_SECONDS = 0.8;
+    const PLAYBACK_SCHEDULE_LEAD_SECONDS = 0.04;
+
+    const [devices, setDevices] = useState<MediaDeviceInfo[]>([]);
+    const [selectedCamera, setSelectedCamera] = useState<string>('');
+    const [selectedMic, setSelectedMic] = useState<string>('');
+    const [isSwapped, setIsSwapped] = useState(false);
+
+    const micAudioCtxRef = useRef<AudioContext | null>(null);
+    const micSourceRef = useRef<MediaStreamAudioSourceNode | null>(null);
+    const micProcessorRef = useRef<ScriptProcessorNode | null>(null);
+    const micGainRef = useRef<GainNode | null>(null);
+    const micFrameBufferRef = useRef<Uint8Array>(new Uint8Array(0));
+    const userDraftIndexRef = useRef<number | null>(null);
+    const lastUserFinalRef = useRef<string>('');
+    const debugVolumePercentRef = useRef<number>(50);
+    const clientToolEnabledMapRef = useRef<Record<string, boolean>>(clientToolEnabledMap);
+    const isClientToolEnabled = (toolId: string) => clientToolEnabledMap[normalizeToolId(toolId)] !== false;
+    const isClientToolEnabledLive = (toolId: string) => clientToolEnabledMapRef.current[normalizeToolId(toolId)] !== false;
+    const selectedToolSchemas = useMemo(() => {
+      const ids = Array.from(new Set((assistant.tools || []).map((id) => normalizeToolId(id))));
+      const byId = new Map(tools.map((t) => [normalizeToolId(t.id), { ...t, id: normalizeToolId(t.id) }]));
+      return ids.map((id: any) => {
+        const item = byId.get(id);
+        const toolId = item?.id || id;
+        const debugClientTool = DEBUG_CLIENT_TOOLS.find((tool) => tool.id === toolId);
+        if (debugClientTool && !isClientToolEnabled(toolId)) {
+          return null;
+        }
+        const isClientTool = debugClientTool ? true : (item?.category || 'query') === 'system';
+        const waitForResponse = isClientTool
+          ? (item?.waitForResponse ?? DEBUG_CLIENT_TOOL_WAIT_DEFAULTS[toolId] ?? false)
+          : false;
+        const parameterSchema = (item?.parameterSchema && typeof item.parameterSchema === 'object')
+          ? item.parameterSchema
+          : getDefaultToolParameters(toolId);
+        const parameterDefaults = (item?.parameterDefaults && typeof item.parameterDefaults === 'object')
+          ? item.parameterDefaults
+          : undefined;
+        return {
+          type: 'function',
+          executor: isClientTool ? 'client' : 'server',
+          waitForResponse,
+          ...(parameterDefaults && Object.keys(parameterDefaults).length > 0 ? { defaultArgs: parameterDefaults } : {}),
+          function: {
+            name: toolId,
+            description: item?.description || item?.name || debugClientTool?.description || id,
+            parameters: parameterSchema,
+          },
+        };
+      }).filter(Boolean) as Array<Record<string, any>>;
+    }, [assistant.tools, tools, clientToolEnabledMap]);
+
+    const clearResponseTracking = () => {
+      assistantDraftIndexRef.current = null;
+      assistantResponseIndexByIdRef.current.clear();
+      pendingTtfbByResponseIdRef.current.clear();
+      interruptedResponseIdsRef.current.clear();
+      interruptedDropNoticeKeysRef.current.clear();
+    };
+
+    const extractResponseId = (payload: any): string | undefined => {
+      const responseIdRaw = payload?.data?.response_id ?? payload?.response_id ?? payload?.responseId;
+      const responseId = String(responseIdRaw || '').trim();
+      return responseId || undefined;
+    };
+
+    const noteInterruptedDrop = (responseId: string, kind: 'ttfb' | 'delta' | 'final') => {
+      const key = `${responseId}:${kind}`;
+      if (interruptedDropNoticeKeysRef.current.has(key)) return;
+      interruptedDropNoticeKeysRef.current.add(key);
+      if (interruptedDropNoticeKeysRef.current.size > 256) {
+        const oldest = interruptedDropNoticeKeysRef.current.values().next().value as string | undefined;
+        if (oldest) interruptedDropNoticeKeysRef.current.delete(oldest);
+      }
+      setMessages((prev) => [
+        ...prev,
+        {
+          role: 'tool',
+          text: `drop stale ${kind} from interrupted response ${responseId}`,
         },
-      };
-    }).filter(Boolean) as Array<Record<string, any>>;
-  }, [assistant.tools, tools, clientToolEnabledMap]);
+      ]);
+    };
 
-  const clearResponseTracking = () => {
-    assistantDraftIndexRef.current = null;
-    assistantResponseIndexByIdRef.current.clear();
-    pendingTtfbByResponseIdRef.current.clear();
-    interruptedResponseIdsRef.current.clear();
-    interruptedDropNoticeKeysRef.current.clear();
-  };
-
-  const extractResponseId = (payload: any): string | undefined => {
-    const responseIdRaw = payload?.data?.response_id ?? payload?.response_id ?? payload?.responseId;
-    const responseId = String(responseIdRaw || '').trim();
-    return responseId || undefined;
-  };
-
-  const noteInterruptedDrop = (responseId: string, kind: 'ttfb' | 'delta' | 'final') => {
-    const key = `${responseId}:${kind}`;
-    if (interruptedDropNoticeKeysRef.current.has(key)) return;
-    interruptedDropNoticeKeysRef.current.add(key);
-    if (interruptedDropNoticeKeysRef.current.size > 256) {
-      const oldest = interruptedDropNoticeKeysRef.current.values().next().value as string | undefined;
-      if (oldest) interruptedDropNoticeKeysRef.current.delete(oldest);
-    }
-    setMessages((prev) => [
-      ...prev,
-      {
-        role: 'tool',
-        text: `drop stale ${kind} from interrupted response ${responseId}`,
-      },
-    ]);
-  };
-
-  // Initialize
-  useEffect(() => {
-    if (isOpen) {
-      if (mode === 'text') {
-        clearResponseTracking();
-        setMessages([]);
-        setTextSessionStarted(false);
+    // Initialize
+    useEffect(() => {
+      if (isOpen) {
+        if (mode === 'text') {
+          clearResponseTracking();
+          setMessages([]);
+          setTextSessionStarted(false);
+        } else {
+          clearResponseTracking();
+          setMessages([]);
+          setCallStatus('idle');
+          setAgentState('listening');
+        }
       } else {
-        clearResponseTracking();
-        setMessages([]);
-        setCallStatus('idle');
-        setAgentState('listening');
-      }
-    } else {
         setMode('text');
         if (textPromptDialogRef.current.open) {
           closeTextPromptDialog('dismiss', { force: true, skipQueueAdvance: true });
@@ -2587,1491 +2573,1442 @@ export const DebugDrawer: React.FC<{
         setIsSwapped(false);
         setCallStatus('idle');
         setAgentState('listening');
-    }
-  }, [isOpen, assistant, mode]);
-
-  useEffect(() => {
-    hydrateClientToolDefaults(DEBUG_CLIENT_TOOLS.map((tool) => tool.id));
-  }, [hydrateClientToolDefaults]);
-
-  useEffect(() => {
-    wsStatusRef.current = wsStatus;
-  }, [wsStatus]);
-
-  useEffect(() => {
-    textPromptDialogRef.current = textPromptDialog;
-  }, [textPromptDialog]);
-
-  useEffect(() => {
-    choicePromptDialogRef.current = choicePromptDialog;
-  }, [choicePromptDialog]);
-
-  useEffect(() => {
-    dynamicVariableSeqRef.current = 0;
-    setDynamicVariables([]);
-    setDynamicVariablesError('');
-  }, [assistant.id, isOpen]);
-
-  useEffect(() => {
-    clientToolEnabledMapRef.current = clientToolEnabledMap;
-  }, [clientToolEnabledMap]);
-
-  // Auto-scroll logic
-  useEffect(() => {
-      if (scrollRef.current) {
-          scrollRef.current.scrollTop = scrollRef.current.scrollHeight;
       }
-  }, [messages, mode]);
+    }, [isOpen, assistant, mode]);
 
-  // Fetch Devices
-  useEffect(() => {
-    if (isOpen && (mode === 'video' || mode === 'voice')) {
+    useEffect(() => {
+      hydrateClientToolDefaults(DEBUG_CLIENT_TOOLS.map((tool) => tool.id));
+    }, [hydrateClientToolDefaults]);
+
+    useEffect(() => {
+      wsStatusRef.current = wsStatus;
+    }, [wsStatus]);
+
+    useEffect(() => {
+      textPromptDialogRef.current = textPromptDialog;
+    }, [textPromptDialog]);
+
+    useEffect(() => {
+      choicePromptDialogRef.current = choicePromptDialog;
+    }, [choicePromptDialog]);
+
+    useEffect(() => {
+      dynamicVariableSeqRef.current = 0;
+      setDynamicVariables([]);
+      setDynamicVariablesError('');
+    }, [assistant.id, isOpen]);
+
+    useEffect(() => {
+      clientToolEnabledMapRef.current = clientToolEnabledMap;
+    }, [clientToolEnabledMap]);
+
+    // Auto-scroll logic
+    useEffect(() => {
+      if (scrollRef.current) {
+        scrollRef.current.scrollTop = scrollRef.current.scrollHeight;
+      }
+    }, [messages, mode]);
+
+    // Fetch Devices
+    useEffect(() => {
+      if (isOpen && (mode === 'video' || mode === 'voice')) {
         const getDevices = async () => {
-            let permissionStream: MediaStream | null = null;
-            try {
-                permissionStream = await navigator.mediaDevices.getUserMedia({ audio: true, video: mode === 'video' });
-                const dev = await navigator.mediaDevices.enumerateDevices();
-                setDevices(dev);
-                const cams = dev.filter(d => d.kind === 'videoinput');
-                const mics = dev.filter(d => d.kind === 'audioinput');
-                if (cams.length > 0 && !selectedCamera) setSelectedCamera(cams[0].deviceId);
-                if (mics.length > 0 && !selectedMic) setSelectedMic(mics[0].deviceId);
-            } catch (e) {
-                console.error("Error enumerating devices", e);
-            } finally {
-                permissionStream?.getTracks().forEach((track) => track.stop());
-            }
+          let permissionStream: MediaStream | null = null;
+          try {
+            permissionStream = await navigator.mediaDevices.getUserMedia({ audio: true, video: mode === 'video' });
+            const dev = await navigator.mediaDevices.enumerateDevices();
+            setDevices(dev);
+            const cams = dev.filter(d => d.kind === 'videoinput');
+            const mics = dev.filter(d => d.kind === 'audioinput');
+            if (cams.length > 0 && !selectedCamera) setSelectedCamera(cams[0].deviceId);
+            if (mics.length > 0 && !selectedMic) setSelectedMic(mics[0].deviceId);
+          } catch (e) {
+            console.error("Error enumerating devices", e);
+          } finally {
+            permissionStream?.getTracks().forEach((track) => track.stop());
+          }
         };
         getDevices();
-    }
-  }, [isOpen, mode]);
+      }
+    }, [isOpen, mode]);
 
-  const stopMedia = () => {
+    const stopMedia = () => {
       if (streamRef.current) {
         streamRef.current.getTracks().forEach(track => track.stop());
         streamRef.current = null;
       }
-  };
-
-  const stopVoiceCapture = () => {
-    if (micProcessorRef.current) {
-      micProcessorRef.current.onaudioprocess = null;
-      try {
-        micProcessorRef.current.disconnect();
-      } catch {
-        // no-op
-      }
-      micProcessorRef.current = null;
-    }
-    if (micSourceRef.current) {
-      try {
-        micSourceRef.current.disconnect();
-      } catch {
-        // no-op
-      }
-      micSourceRef.current = null;
-    }
-    if (micGainRef.current) {
-      try {
-        micGainRef.current.disconnect();
-      } catch {
-        // no-op
-      }
-      micGainRef.current = null;
-    }
-    if (micAudioCtxRef.current) {
-      void micAudioCtxRef.current.close();
-      micAudioCtxRef.current = null;
-    }
-    micFrameBufferRef.current = new Uint8Array(0);
-    setCaptureConfigView('');
-    stopMedia();
-  };
-
-  const sendFramedMicAudio = (pcm16: Int16Array) => {
-    const ws = wsRef.current;
-    if (!ws || ws.readyState !== WebSocket.OPEN || !wsReadyRef.current) return;
-    if (pcm16.byteLength <= 0) return;
-
-    const chunkBytes = new Uint8Array(pcm16.buffer, pcm16.byteOffset, pcm16.byteLength);
-    const pending = micFrameBufferRef.current;
-    const merged = new Uint8Array(pending.length + chunkBytes.length);
-    merged.set(pending, 0);
-    merged.set(chunkBytes, pending.length);
-
-    let offset = 0;
-    while (merged.length - offset >= PCM_FRAME_BYTES) {
-      ws.send(merged.subarray(offset, offset + PCM_FRAME_BYTES));
-      offset += PCM_FRAME_BYTES;
-    }
-
-    micFrameBufferRef.current = offset >= merged.length ? new Uint8Array(0) : merged.slice(offset);
-  };
-
-  const buildMicConstraints = (): MediaTrackConstraints => ({
-    deviceId: selectedMic ? { exact: selectedMic } : undefined,
-    echoCancellation: aecEnabled,
-    noiseSuppression: nsEnabled,
-    autoGainControl: agcEnabled,
-    channelCount: 1,
-    sampleRate: TARGET_SAMPLE_RATE,
-  });
-
-  const startVoiceCapture = async () => {
-    stopVoiceCapture();
-    const requestedConstraints = buildMicConstraints();
-    const stream = await navigator.mediaDevices.getUserMedia({
-      audio: requestedConstraints,
-      video: false,
-    });
-    streamRef.current = stream;
-    const track = stream.getAudioTracks()[0];
-    if (track) {
-      console.log('Voice capture settings', track.getSettings());
-      setCaptureConfigView(
-        JSON.stringify(
-          {
-            requested: requestedConstraints,
-            applied: track.getSettings(),
-            capabilities: typeof track.getCapabilities === 'function' ? track.getCapabilities() : undefined,
-          },
-          null,
-          2
-        )
-      );
-    }
-
-    const ctx = new AudioContext();
-    if (ctx.state === 'suspended') {
-      await ctx.resume();
-    }
-    micAudioCtxRef.current = ctx;
-    const source = ctx.createMediaStreamSource(stream);
-    const processor = ctx.createScriptProcessor(4096, 1, 1);
-    const silentGain = ctx.createGain();
-    silentGain.gain.value = 0;
-
-    source.connect(processor);
-    processor.connect(silentGain);
-    silentGain.connect(ctx.destination);
-
-    processor.onaudioprocess = (event) => {
-      if (!wsRef.current || wsRef.current.readyState !== WebSocket.OPEN || !wsReadyRef.current) return;
-      const inChannel = event.inputBuffer.getChannelData(0);
-      const downsampled = downsampleTo16k(inChannel, event.inputBuffer.sampleRate);
-      const pcm16 = float32ToPcm16(downsampled);
-      sendFramedMicAudio(pcm16);
     };
 
-    micSourceRef.current = source;
-    micProcessorRef.current = processor;
-    micGainRef.current = silentGain;
-  };
-
-  const ensureAudioContext = async () => {
-    if (!audioCtxRef.current) {
-      audioCtxRef.current = new AudioContext();
-      playbackTimeRef.current = audioCtxRef.current.currentTime;
-    }
-    if (audioCtxRef.current.state === 'suspended') {
-      await audioCtxRef.current.resume();
-    }
-    return audioCtxRef.current;
-  };
-
-  const clearPlaybackQueue = () => {
-    const ctx = audioCtxRef.current;
-    const now = ctx ? ctx.currentTime : 0;
-    playbackTimeRef.current = now;
-    queuedAudioBuffersRef.current = [];
-    queuedAudioDurationRef.current = 0;
-  };
-
-  const stopPlaybackImmediately = () => {
-    activeAudioSourcesRef.current.forEach((source) => {
-      try {
-        source.stop();
-      } catch {
-        // no-op
-      }
-      source.disconnect();
-    });
-    activeAudioSourcesRef.current.clear();
-    clearPlaybackQueue();
-  };
-
-  const emitClientToolResult = (resultPayload: any, toolDisplayName?: string) => {
-    const ws = wsRef.current;
-    if (ws && ws.readyState === WebSocket.OPEN) {
-      ws.send(
-        JSON.stringify({
-          type: 'tool_call.results',
-          results: [resultPayload],
-        })
-      );
-    }
-    const statusCode = Number(resultPayload?.status?.code || 500);
-    const statusMessage = String(resultPayload?.status?.message || 'error');
-    const displayName = toolDisplayName || String(resultPayload?.name || 'unknown_tool');
-    const resultText =
-      statusCode === 200 && typeof resultPayload?.output?.result === 'number'
-        ? `result ${displayName} = ${resultPayload.output.result}`
-        : `result ${displayName} status=${statusCode} ${statusMessage}`;
-    setMessages((prev) => [
-      ...prev,
-      {
-        role: 'tool',
-        text: resultText,
-      },
-    ]);
-  };
-
-  const stopPromptVoicePlayback = () => {
-    if (promptAudioRef.current) {
-      try {
-        promptAudioRef.current.pause();
-      } catch {
-        // no-op
-      }
-      promptAudioRef.current = null;
-    }
-    if (typeof window !== 'undefined' && 'speechSynthesis' in window) {
-      window.speechSynthesis.cancel();
-    }
-  };
-
-  const playPromptVoice = async (text: string) => {
-    const phrase = String(text || '').trim();
-    if (!phrase) return;
-    stopPromptVoicePlayback();
-
-    const canUseAssistantTts = assistant.voiceOutputEnabled !== false && Boolean(assistant.voice);
-    if (canUseAssistantTts) {
-      const selectedVoice = voices.find((item) => item.id === assistant.voice);
-      if (selectedVoice) {
+    const stopVoiceCapture = () => {
+      if (micProcessorRef.current) {
+        micProcessorRef.current.onaudioprocess = null;
         try {
-          const audioUrl = await previewVoice(selectedVoice.id, phrase, assistant.speed);
-          const audio = new Audio(audioUrl);
-          promptAudioRef.current = audio;
-          audio.onended = () => {
-            if (promptAudioRef.current === audio) {
-              promptAudioRef.current = null;
-            }
-          };
-          audio.onerror = () => {
-            if (promptAudioRef.current === audio) {
-              promptAudioRef.current = null;
-            }
-          };
-          await audio.play();
-          return;
-        } catch (err) {
-          console.warn('Assistant TTS preview failed, falling back to speechSynthesis', err);
+          micProcessorRef.current.disconnect();
+        } catch {
+          // no-op
+        }
+        micProcessorRef.current = null;
+      }
+      if (micSourceRef.current) {
+        try {
+          micSourceRef.current.disconnect();
+        } catch {
+          // no-op
+        }
+        micSourceRef.current = null;
+      }
+      if (micGainRef.current) {
+        try {
+          micGainRef.current.disconnect();
+        } catch {
+          // no-op
+        }
+        micGainRef.current = null;
+      }
+      if (micAudioCtxRef.current) {
+        void micAudioCtxRef.current.close();
+        micAudioCtxRef.current = null;
+      }
+      micFrameBufferRef.current = new Uint8Array(0);
+      setCaptureConfigView('');
+      stopMedia();
+    };
+
+    const sendFramedMicAudio = (pcm16: Int16Array) => {
+      const ws = wsRef.current;
+      if (!ws || ws.readyState !== WebSocket.OPEN || !wsReadyRef.current) return;
+      if (pcm16.byteLength <= 0) return;
+
+      const chunkBytes = new Uint8Array(pcm16.buffer, pcm16.byteOffset, pcm16.byteLength);
+      const pending = micFrameBufferRef.current;
+      const merged = new Uint8Array(pending.length + chunkBytes.length);
+      merged.set(pending, 0);
+      merged.set(chunkBytes, pending.length);
+
+      let offset = 0;
+      while (merged.length - offset >= PCM_FRAME_BYTES) {
+        ws.send(merged.subarray(offset, offset + PCM_FRAME_BYTES));
+        offset += PCM_FRAME_BYTES;
+      }
+
+      micFrameBufferRef.current = offset >= merged.length ? new Uint8Array(0) : merged.slice(offset);
+    };
+
+    const buildMicConstraints = (): MediaTrackConstraints => ({
+      deviceId: selectedMic ? { exact: selectedMic } : undefined,
+      echoCancellation: aecEnabled,
+      noiseSuppression: nsEnabled,
+      autoGainControl: agcEnabled,
+      channelCount: 1,
+      sampleRate: TARGET_SAMPLE_RATE,
+    });
+
+    const startVoiceCapture = async () => {
+      stopVoiceCapture();
+      const requestedConstraints = buildMicConstraints();
+      const stream = await navigator.mediaDevices.getUserMedia({
+        audio: requestedConstraints,
+        video: false,
+      });
+      streamRef.current = stream;
+      const track = stream.getAudioTracks()[0];
+      if (track) {
+        console.log('Voice capture settings', track.getSettings());
+        setCaptureConfigView(
+          JSON.stringify(
+            {
+              requested: requestedConstraints,
+              applied: track.getSettings(),
+              capabilities: typeof track.getCapabilities === 'function' ? track.getCapabilities() : undefined,
+            },
+            null,
+            2
+          )
+        );
+      }
+
+      const ctx = new AudioContext();
+      if (ctx.state === 'suspended') {
+        await ctx.resume();
+      }
+      micAudioCtxRef.current = ctx;
+      const source = ctx.createMediaStreamSource(stream);
+      const processor = ctx.createScriptProcessor(4096, 1, 1);
+      const silentGain = ctx.createGain();
+      silentGain.gain.value = 0;
+
+      source.connect(processor);
+      processor.connect(silentGain);
+      silentGain.connect(ctx.destination);
+
+      processor.onaudioprocess = (event) => {
+        if (!wsRef.current || wsRef.current.readyState !== WebSocket.OPEN || !wsReadyRef.current) return;
+        const inChannel = event.inputBuffer.getChannelData(0);
+        const downsampled = downsampleTo16k(inChannel, event.inputBuffer.sampleRate);
+        const pcm16 = float32ToPcm16(downsampled);
+        sendFramedMicAudio(pcm16);
+      };
+
+      micSourceRef.current = source;
+      micProcessorRef.current = processor;
+      micGainRef.current = silentGain;
+    };
+
+    const ensureAudioContext = async () => {
+      if (!audioCtxRef.current) {
+        audioCtxRef.current = new AudioContext();
+        playbackTimeRef.current = audioCtxRef.current.currentTime;
+      }
+      if (audioCtxRef.current.state === 'suspended') {
+        await audioCtxRef.current.resume();
+      }
+      return audioCtxRef.current;
+    };
+
+    const clearPlaybackQueue = () => {
+      const ctx = audioCtxRef.current;
+      const now = ctx ? ctx.currentTime : 0;
+      playbackTimeRef.current = now;
+      queuedAudioBuffersRef.current = [];
+      queuedAudioDurationRef.current = 0;
+    };
+
+    const stopPlaybackImmediately = () => {
+      activeAudioSourcesRef.current.forEach((source) => {
+        try {
+          source.stop();
+        } catch {
+          // no-op
+        }
+        source.disconnect();
+      });
+      activeAudioSourcesRef.current.clear();
+      clearPlaybackQueue();
+    };
+
+    const emitClientToolResult = (resultPayload: any, toolDisplayName?: string) => {
+      const ws = wsRef.current;
+      if (ws && ws.readyState === WebSocket.OPEN) {
+        ws.send(
+          JSON.stringify({
+            type: 'tool_call.results',
+            results: [resultPayload],
+          })
+        );
+      }
+      const statusCode = Number(resultPayload?.status?.code || 500);
+      const statusMessage = String(resultPayload?.status?.message || 'error');
+      const displayName = toolDisplayName || String(resultPayload?.name || 'unknown_tool');
+      const resultText =
+        statusCode === 200 && typeof resultPayload?.output?.result === 'number'
+          ? `result ${displayName} = ${resultPayload.output.result}`
+          : `result ${displayName} status=${statusCode} ${statusMessage}`;
+      setMessages((prev) => [
+        ...prev,
+        {
+          role: 'tool',
+          text: resultText,
+        },
+      ]);
+    };
+
+    const stopPromptVoicePlayback = () => {
+      if (promptAudioRef.current) {
+        try {
+          promptAudioRef.current.pause();
+        } catch {
+          // no-op
+        }
+        promptAudioRef.current = null;
+      }
+      if (typeof window !== 'undefined' && 'speechSynthesis' in window) {
+        window.speechSynthesis.cancel();
+      }
+    };
+
+    const playPromptVoice = async (text: string) => {
+      const phrase = String(text || '').trim();
+      if (!phrase) return;
+      stopPromptVoicePlayback();
+
+      const canUseAssistantTts = assistant.voiceOutputEnabled !== false && Boolean(assistant.voice);
+      if (canUseAssistantTts) {
+        const selectedVoice = voices.find((item) => item.id === assistant.voice);
+        if (selectedVoice) {
+          try {
+            const audioUrl = await previewVoice(selectedVoice.id, phrase, assistant.speed);
+            const audio = new Audio(audioUrl);
+            promptAudioRef.current = audio;
+            audio.onended = () => {
+              if (promptAudioRef.current === audio) {
+                promptAudioRef.current = null;
+              }
+            };
+            audio.onerror = () => {
+              if (promptAudioRef.current === audio) {
+                promptAudioRef.current = null;
+              }
+            };
+            await audio.play();
+            return;
+          } catch (err) {
+            console.warn('Assistant TTS preview failed, falling back to speechSynthesis', err);
+          }
         }
       }
-    }
 
-    if (typeof window !== 'undefined' && 'speechSynthesis' in window) {
-      const utterance = new SpeechSynthesisUtterance(phrase);
-      utterance.lang = assistant.language === 'en' ? 'en-US' : 'zh-CN';
-      window.speechSynthesis.cancel();
-      window.speechSynthesis.speak(utterance);
-    }
-  };
+      if (typeof window !== 'undefined' && 'speechSynthesis' in window) {
+        const utterance = new SpeechSynthesisUtterance(phrase);
+        utterance.lang = assistant.language === 'en' ? 'en-US' : 'zh-CN';
+        window.speechSynthesis.cancel();
+        window.speechSynthesis.speak(utterance);
+      }
+    };
 
-  const hasActivePromptDialog = () => textPromptDialogRef.current.open || choicePromptDialogRef.current.open;
+    const hasActivePromptDialog = () => textPromptDialogRef.current.open || choicePromptDialogRef.current.open;
 
-  const activatePromptDialog = (item: DebugPromptQueueItem) => {
-    if (item.kind === 'text') {
+    const activatePromptDialog = (item: DebugPromptQueueItem) => {
+      if (item.kind === 'text') {
+        const nextVoiceText = String(item.payload.voiceText || '').trim();
+        setTextPromptDialog({
+          open: true,
+          message: item.payload.message,
+          pendingResult: item.payload.pendingResult,
+          promptType: item.payload.promptType || 'text',
+          voiceText: nextVoiceText || undefined,
+        });
+        if (nextVoiceText) {
+          void playPromptVoice(nextVoiceText);
+        }
+        return;
+      }
       const nextVoiceText = String(item.payload.voiceText || '').trim();
-      setTextPromptDialog({
+      setChoicePromptDialog({
         open: true,
-        message: item.payload.message,
+        question: item.payload.question,
+        options: item.payload.options,
         pendingResult: item.payload.pendingResult,
-        promptType: item.payload.promptType || 'text',
+        requireSelection: item.payload.requireSelection === true,
         voiceText: nextVoiceText || undefined,
       });
       if (nextVoiceText) {
         void playPromptVoice(nextVoiceText);
       }
-      return;
-    }
-    const nextVoiceText = String(item.payload.voiceText || '').trim();
-    setChoicePromptDialog({
-      open: true,
-      question: item.payload.question,
-      options: item.payload.options,
-      pendingResult: item.payload.pendingResult,
-      requireSelection: item.payload.requireSelection === true,
-      voiceText: nextVoiceText || undefined,
-    });
-    if (nextVoiceText) {
-      void playPromptVoice(nextVoiceText);
-    }
-  };
+    };
 
-  const enqueuePromptDialog = (item: DebugPromptQueueItem) => {
-    if (hasActivePromptDialog()) {
-      promptDialogQueueRef.current.push(item);
-      return;
-    }
-    activatePromptDialog(item);
-  };
+    const enqueuePromptDialog = (item: DebugPromptQueueItem) => {
+      if (hasActivePromptDialog()) {
+        promptDialogQueueRef.current.push(item);
+        return;
+      }
+      activatePromptDialog(item);
+    };
 
-  const openNextPromptDialog = (force = false) => {
-    if (!force && hasActivePromptDialog()) return;
-    const next = promptDialogQueueRef.current.shift();
-    if (!next) return;
-    activatePromptDialog(next);
-  };
+    const openNextPromptDialog = (force = false) => {
+      if (!force && hasActivePromptDialog()) return;
+      const next = promptDialogQueueRef.current.shift();
+      if (!next) return;
+      activatePromptDialog(next);
+    };
 
-  const closeTextPromptDialog = (action: 'confirm' | 'dismiss', opts?: { force?: boolean; skipQueueAdvance?: boolean }) => {
-    const snapshot = textPromptDialogRef.current;
-    if (!snapshot.open && !opts?.force) return;
-    const pending = snapshot?.pendingResult;
-    const message = snapshot?.message || '';
-    const promptType = snapshot?.promptType === 'voice' ? 'voice' : 'text';
-    stopPromptVoicePlayback();
-    setTextPromptDialog({ open: false, message: '', promptType: 'text' });
-    if (pending?.waitForResponse) {
-      emitClientToolResult(
-        {
-          tool_call_id: pending.toolCallId,
-          name: pending.toolName,
-          output: {
-            message: promptType === 'voice' ? 'voice_prompt_closed' : 'text_prompt_closed',
-            action,
-            msg: message,
-            prompt_type: promptType,
+    const closeTextPromptDialog = (action: 'confirm' | 'dismiss', opts?: { force?: boolean; skipQueueAdvance?: boolean }) => {
+      const snapshot = textPromptDialogRef.current;
+      if (!snapshot.open && !opts?.force) return;
+      const pending = snapshot?.pendingResult;
+      const message = snapshot?.message || '';
+      const promptType = snapshot?.promptType === 'voice' ? 'voice' : 'text';
+      stopPromptVoicePlayback();
+      setTextPromptDialog({ open: false, message: '', promptType: 'text' });
+      if (pending?.waitForResponse) {
+        emitClientToolResult(
+          {
+            tool_call_id: pending.toolCallId,
+            name: pending.toolName,
+            output: {
+              message: promptType === 'voice' ? 'voice_prompt_closed' : 'text_prompt_closed',
+              action,
+              msg: message,
+              prompt_type: promptType,
+            },
+            status: { code: 200, message: 'ok' },
           },
-          status: { code: 200, message: 'ok' },
-        },
-        pending.toolDisplayName
-      );
-    }
-    if (!opts?.skipQueueAdvance) {
-      openNextPromptDialog(true);
-    }
-  };
+          pending.toolDisplayName
+        );
+      }
+      if (!opts?.skipQueueAdvance) {
+        openNextPromptDialog(true);
+      }
+    };
 
-  const closeChoicePromptDialog = (
-    action: 'select' | 'dismiss',
-    selectedOption?: DebugChoicePromptOption,
-    opts?: { force?: boolean; skipQueueAdvance?: boolean }
-  ) => {
-    const snapshot = choicePromptDialogRef.current;
-    if (!snapshot.open && !opts?.force) return;
-    if (snapshot.requireSelection && action !== 'select' && !opts?.force) {
-      return;
-    }
-    const pending = snapshot?.pendingResult;
-    const question = snapshot?.question || '';
-    const options = snapshot?.options || [];
-    stopPromptVoicePlayback();
-    setChoicePromptDialog({ open: false, question: '', options: [] });
-    if (pending?.waitForResponse) {
-      emitClientToolResult(
-        {
-          tool_call_id: pending.toolCallId,
-          name: pending.toolName,
-          output: {
-            message: action === 'select' ? 'choice_selected' : 'choice_dismissed',
-            action,
-            question,
-            option: selectedOption
-              ? {
+    const closeChoicePromptDialog = (
+      action: 'select' | 'dismiss',
+      selectedOption?: DebugChoicePromptOption,
+      opts?: { force?: boolean; skipQueueAdvance?: boolean }
+    ) => {
+      const snapshot = choicePromptDialogRef.current;
+      if (!snapshot.open && !opts?.force) return;
+      if (snapshot.requireSelection && action !== 'select' && !opts?.force) {
+        return;
+      }
+      const pending = snapshot?.pendingResult;
+      const question = snapshot?.question || '';
+      const options = snapshot?.options || [];
+      stopPromptVoicePlayback();
+      setChoicePromptDialog({ open: false, question: '', options: [] });
+      if (pending?.waitForResponse) {
+        emitClientToolResult(
+          {
+            tool_call_id: pending.toolCallId,
+            name: pending.toolName,
+            output: {
+              message: action === 'select' ? 'choice_selected' : 'choice_dismissed',
+              action,
+              question,
+              option: selectedOption
+                ? {
                   id: selectedOption.id,
                   label: selectedOption.label,
                   value: selectedOption.value,
                 }
-              : null,
-            options,
+                : null,
+              options,
+            },
+            status: { code: 200, message: 'ok' },
           },
-          status: { code: 200, message: 'ok' },
-        },
-        pending.toolDisplayName
-      );
-    }
-    if (!opts?.skipQueueAdvance) {
-      openNextPromptDialog(true);
-    }
-  };
-
-  const scheduleQueuedPlayback = (ctx: AudioContext) => {
-    const queue = queuedAudioBuffersRef.current;
-    if (queue.length === 0) return;
-
-    const now = ctx.currentTime;
-    if (playbackTimeRef.current < now) {
-      playbackTimeRef.current = now;
-    }
-
-    const hasActivePlayback = activeAudioSourcesRef.current.size > 0;
-    const minBufferSeconds = hasActivePlayback
-      ? 0
-      : PLAYBACK_INITIAL_BUFFER_SECONDS;
-
-    if (queuedAudioDurationRef.current < minBufferSeconds) {
-      return;
-    }
-
-    while (queue.length > 0 && (playbackTimeRef.current - now) < PLAYBACK_MAX_AHEAD_SECONDS) {
-      const audioBuffer = queue.shift();
-      if (!audioBuffer) break;
-      queuedAudioDurationRef.current = Math.max(0, queuedAudioDurationRef.current - audioBuffer.duration);
-
-      const source = ctx.createBufferSource();
-      source.buffer = audioBuffer;
-      source.connect(ctx.destination);
-      activeAudioSourcesRef.current.add(source);
-      source.onended = () => {
-        activeAudioSourcesRef.current.delete(source);
-        try {
-          source.disconnect();
-        } catch {
-          // no-op
-        }
-        scheduleQueuedPlayback(ctx);
-      };
-
-      const startAt = Math.max(ctx.currentTime + PLAYBACK_SCHEDULE_LEAD_SECONDS, playbackTimeRef.current);
-      source.start(startAt);
-      playbackTimeRef.current = startAt + audioBuffer.duration;
-    }
-  };
-
-  const playPcm16Chunk = async (pcmBuffer: ArrayBuffer) => {
-    if (!textTtsEnabled) return;
-    const ctx = await ensureAudioContext();
-    const int16 = new Int16Array(pcmBuffer);
-    if (int16.length === 0) return;
-
-    const float32 = new Float32Array(int16.length);
-    for (let i = 0; i < int16.length; i += 1) {
-      float32[i] = int16[i] / 32768;
-    }
-
-    const sampleRate = 16000;
-    const audioBuffer = ctx.createBuffer(1, float32.length, sampleRate);
-    audioBuffer.copyToChannel(float32, 0);
-    queuedAudioBuffersRef.current.push(audioBuffer);
-    queuedAudioDurationRef.current += audioBuffer.duration;
-    scheduleQueuedPlayback(ctx);
-  };
-
-  useEffect(() => {
-    const handleStream = async () => {
-      if (isOpen && mode === 'video' && callStatus === 'active') {
-        try {
-          stopMedia();
-          const constraints = {
-              video: selectedCamera ? { deviceId: { exact: selectedCamera } } : true,
-              audio: selectedMic ? { deviceId: { exact: selectedMic } } : true
-          };
-          const stream = await navigator.mediaDevices.getUserMedia(constraints);
-          streamRef.current = stream;
-          if (videoRef.current) {
-            videoRef.current.srcObject = stream;
-          }
-        } catch (err) {
-          console.error("Failed to access camera/mic:", err);
-        }
-      } else if (callStatus !== 'active') {
-        stopMedia();
+          pending.toolDisplayName
+        );
+      }
+      if (!opts?.skipQueueAdvance) {
+        openNextPromptDialog(true);
       }
     };
 
-    handleStream();
-    return () => stopMedia();
-  }, [mode, isOpen, selectedCamera, selectedMic, callStatus]);
+    const scheduleQueuedPlayback = (ctx: AudioContext) => {
+      const queue = queuedAudioBuffersRef.current;
+      if (queue.length === 0) return;
 
-  const handleCall = () => {
-    if (mode !== 'voice') {
-      setCallStatus('calling');
-      setTimeout(() => {
+      const now = ctx.currentTime;
+      if (playbackTimeRef.current < now) {
+        playbackTimeRef.current = now;
+      }
+
+      const hasActivePlayback = activeAudioSourcesRef.current.size > 0;
+      const minBufferSeconds = hasActivePlayback
+        ? 0
+        : PLAYBACK_INITIAL_BUFFER_SECONDS;
+
+      if (queuedAudioDurationRef.current < minBufferSeconds) {
+        return;
+      }
+
+      while (queue.length > 0 && (playbackTimeRef.current - now) < PLAYBACK_MAX_AHEAD_SECONDS) {
+        const audioBuffer = queue.shift();
+        if (!audioBuffer) break;
+        queuedAudioDurationRef.current = Math.max(0, queuedAudioDurationRef.current - audioBuffer.duration);
+
+        const source = ctx.createBufferSource();
+        source.buffer = audioBuffer;
+        source.connect(ctx.destination);
+        activeAudioSourcesRef.current.add(source);
+        source.onended = () => {
+          activeAudioSourcesRef.current.delete(source);
+          try {
+            source.disconnect();
+          } catch {
+            // no-op
+          }
+          scheduleQueuedPlayback(ctx);
+        };
+
+        const startAt = Math.max(ctx.currentTime + PLAYBACK_SCHEDULE_LEAD_SECONDS, playbackTimeRef.current);
+        source.start(startAt);
+        playbackTimeRef.current = startAt + audioBuffer.duration;
+      }
+    };
+
+    const playPcm16Chunk = async (pcmBuffer: ArrayBuffer) => {
+      if (!textTtsEnabled) return;
+      const ctx = await ensureAudioContext();
+      const int16 = new Int16Array(pcmBuffer);
+      if (int16.length === 0) return;
+
+      const float32 = new Float32Array(int16.length);
+      for (let i = 0; i < int16.length; i += 1) {
+        float32[i] = int16[i] / 32768;
+      }
+
+      const sampleRate = 16000;
+      const audioBuffer = ctx.createBuffer(1, float32.length, sampleRate);
+      audioBuffer.copyToChannel(float32, 0);
+      queuedAudioBuffersRef.current.push(audioBuffer);
+      queuedAudioDurationRef.current += audioBuffer.duration;
+      scheduleQueuedPlayback(ctx);
+    };
+
+    useEffect(() => {
+      const handleStream = async () => {
+        if (isOpen && mode === 'video' && callStatus === 'active') {
+          try {
+            stopMedia();
+            const constraints = {
+              video: selectedCamera ? { deviceId: { exact: selectedCamera } } : true,
+              audio: selectedMic ? { deviceId: { exact: selectedMic } } : true
+            };
+            const stream = await navigator.mediaDevices.getUserMedia(constraints);
+            streamRef.current = stream;
+            if (videoRef.current) {
+              videoRef.current.srcObject = stream;
+            }
+          } catch (err) {
+            console.error("Failed to access camera/mic:", err);
+          }
+        } else if (callStatus !== 'active') {
+          stopMedia();
+        }
+      };
+
+      handleStream();
+      return () => stopMedia();
+    }, [mode, isOpen, selectedCamera, selectedMic, callStatus]);
+
+    const handleCall = () => {
+      if (mode !== 'voice') {
+        setCallStatus('calling');
+        setTimeout(() => {
           setCallStatus('active');
           setMessages([{ role: 'model', text: assistant.opener || "Hello!" }]);
-      }, 1500);
-      return;
-    }
-    const launchVoice = async () => {
+        }, 1500);
+        return;
+      }
+      const launchVoice = async () => {
+        try {
+          setCallStatus('calling');
+          clearResponseTracking();
+          setMessages([]);
+          lastUserFinalRef.current = '';
+          setWsError('');
+          setDynamicVariablesError('');
+          closeWs();
+          if (textTtsEnabled) await ensureAudioContext();
+          // Start mic capture before session.start so barge-in works from opener start.
+          await startVoiceCapture();
+          await ensureWsSession();
+          setCallStatus('active');
+        } catch (e) {
+          console.error(e);
+          stopVoiceCapture();
+          setCallStatus('idle');
+          setAgentState('listening');
+          const err = e as Error & { __dynamicVariables?: boolean };
+          if (err.__dynamicVariables) {
+            setWsStatus('disconnected');
+            return;
+          }
+          setWsStatus('error');
+          setWsError(err?.message || 'Failed to start voice call');
+        }
+      };
+      void launchVoice();
+    };
+
+    const handleHangup = () => {
+      if (textPromptDialog.open) {
+        closeTextPromptDialog('dismiss', { force: true, skipQueueAdvance: true });
+      }
+      if (choicePromptDialog.open) {
+        closeChoicePromptDialog('dismiss', undefined, { force: true, skipQueueAdvance: true });
+      }
+      stopPromptVoicePlayback();
+      promptDialogQueueRef.current = [];
+      stopVoiceCapture();
+      stopMedia();
+      closeWs();
+      setCallStatus('idle');
+      setAgentState('listening');
+      clearResponseTracking();
+      setMessages([]);
+      setTextPromptDialog({ open: false, message: '', promptType: 'text' });
+      setChoicePromptDialog({ open: false, question: '', options: [] });
+      lastUserFinalRef.current = '';
+      setIsLoading(false);
+    };
+
+    const handleSend = async () => {
+      if (!inputText.trim()) return;
+      const userMsg = inputText;
+      assistantDraftIndexRef.current = null;
+      setMessages(prev => [...prev, { role: 'user', text: userMsg }]);
+      setInputText('');
+      setIsLoading(true);
+
       try {
-        setCallStatus('calling');
+        setDynamicVariablesError('');
+        if (mode === 'text') {
+          if (textTtsEnabled) await ensureAudioContext();
+          await ensureWsSession();
+          // Interrupt any in-flight response/audio before sending new user utterance.
+          if (wsRef.current?.readyState === WebSocket.OPEN) {
+            wsRef.current.send(JSON.stringify({ type: 'response.cancel', graceful: false }));
+          }
+          stopPlaybackImmediately();
+          wsRef.current?.send(JSON.stringify({ type: 'input.text', text: userMsg }));
+        } else if (mode === 'voice') {
+          await ensureWsSession();
+          wsRef.current?.send(JSON.stringify({ type: 'input.text', text: userMsg }));
+        } else {
+          setTimeout(() => {
+            setMessages(prev => [...prev, { role: 'model', text: `[Mock Response]: Received "${userMsg}"` }]);
+            setIsLoading(false);
+          }, 1000);
+        }
+      } catch (e) {
+        console.error(e);
+        const err = e as Error & { __dynamicVariables?: boolean };
+        if (err.__dynamicVariables) {
+          setIsLoading(false);
+          return;
+        }
+        const errMessage = err?.message || 'Failed to connect to AI service.';
+        setMessages(prev => [...prev, { role: 'model', text: `Error: ${errMessage}` }]);
+        setWsError(errMessage);
+        setIsLoading(false);
+      } finally {
+        if (mode !== 'text') setIsLoading(false);
+      }
+    };
+
+    const handleTextLaunch = async () => {
+      try {
+        setWsError('');
+        setDynamicVariablesError('');
+        // Start every text debug run as a fresh session transcript.
         clearResponseTracking();
         setMessages([]);
         lastUserFinalRef.current = '';
-        setWsError('');
-        setDynamicVariablesError('');
+        // Force a fresh WS session so updated assistant runtime config
+        // (voice/model/provider/speed) is applied on session.start.
         closeWs();
         if (textTtsEnabled) await ensureAudioContext();
-        // Start mic capture before session.start so barge-in works from opener start.
-        await startVoiceCapture();
         await ensureWsSession();
-        setCallStatus('active');
+        setTextSessionStarted(true);
       } catch (e) {
         console.error(e);
-        stopVoiceCapture();
-        setCallStatus('idle');
-        setAgentState('listening');
         const err = e as Error & { __dynamicVariables?: boolean };
         if (err.__dynamicVariables) {
           setWsStatus('disconnected');
+          setTextSessionStarted(false);
           return;
         }
         setWsStatus('error');
-        setWsError(err?.message || 'Failed to start voice call');
+        setWsError(err?.message || 'Failed to connect');
+        setTextSessionStarted(false);
       }
     };
-    void launchVoice();
-  };
 
-  const handleHangup = () => {
-    if (textPromptDialog.open) {
-      closeTextPromptDialog('dismiss', { force: true, skipQueueAdvance: true });
-    }
-    if (choicePromptDialog.open) {
-      closeChoicePromptDialog('dismiss', undefined, { force: true, skipQueueAdvance: true });
-    }
-    stopPromptVoicePlayback();
-    promptDialogQueueRef.current = [];
-    stopVoiceCapture();
-    stopMedia();
-    closeWs();
-    setCallStatus('idle');
-    setAgentState('listening');
-    clearResponseTracking();
-    setMessages([]);
-    setTextPromptDialog({ open: false, message: '', promptType: 'text' });
-    setChoicePromptDialog({ open: false, question: '', options: [] });
-    lastUserFinalRef.current = '';
-    setIsLoading(false);
-  };
-
-  const handleSend = async () => {
-    if (!inputText.trim()) return;
-    const userMsg = inputText;
-    assistantDraftIndexRef.current = null;
-    setMessages(prev => [...prev, { role: 'user', text: userMsg }]);
-    setInputText('');
-    setIsLoading(true);
-
-    try {
+    const addDynamicVariableRow = () => {
+      if (isDynamicVariablesLocked) return;
       setDynamicVariablesError('');
-      if (mode === 'text') {
-        if (textTtsEnabled) await ensureAudioContext();
-        await ensureWsSession();
-        // Interrupt any in-flight response/audio before sending new user utterance.
-        if (wsRef.current?.readyState === WebSocket.OPEN) {
-          wsRef.current.send(JSON.stringify({ type: 'response.cancel', graceful: false }));
+      setDynamicVariables((prev) => {
+        if (prev.length >= DYNAMIC_VARIABLE_MAX_ITEMS) return prev;
+        return [...prev, { id: nextDynamicVariableId(), key: '', value: '' }];
+      });
+    };
+
+    const updateDynamicVariableRow = (rowId: string, field: 'key' | 'value', value: string) => {
+      if (isDynamicVariablesLocked) return;
+      setDynamicVariablesError('');
+      setDynamicVariables((prev) => prev.map((item) => (item.id === rowId ? { ...item, [field]: value } : item)));
+    };
+
+    const removeDynamicVariableRow = (rowId: string) => {
+      if (isDynamicVariablesLocked) return;
+      setDynamicVariablesError('');
+      setDynamicVariables((prev) => prev.filter((item) => item.id !== rowId));
+    };
+
+    const importDynamicVariablesFromPlaceholders = () => {
+      if (isDynamicVariablesLocked) return;
+      setDynamicVariablesError('');
+      setDynamicVariables((prev) => {
+        if (!requiredTemplateVariableKeys.length || prev.length >= DYNAMIC_VARIABLE_MAX_ITEMS) {
+          return prev;
         }
-        stopPlaybackImmediately();
-        wsRef.current?.send(JSON.stringify({ type: 'input.text', text: userMsg }));
-      } else if (mode === 'voice') {
-        await ensureWsSession();
-        wsRef.current?.send(JSON.stringify({ type: 'input.text', text: userMsg }));
-      } else {
-        setTimeout(() => {
-          setMessages(prev => [...prev, { role: 'model', text: `[Mock Response]: Received "${userMsg}"` }]);
-          setIsLoading(false);
-        }, 1000);
-      }
-    } catch (e) {
-      console.error(e);
-      const err = e as Error & { __dynamicVariables?: boolean };
-      if (err.__dynamicVariables) {
-        setIsLoading(false);
-        return;
-      }
-      const errMessage = err?.message || 'Failed to connect to AI service.';
-      setMessages(prev => [...prev, { role: 'model', text: `Error: ${errMessage}` }]);
-      setWsError(errMessage);
-      setIsLoading(false);
-    } finally {
-      if (mode !== 'text') setIsLoading(false);
-    }
-  };
+        const existingKeys = new Set(
+          prev
+            .map((item) => item.key.trim())
+            .filter((key) => key !== '')
+        );
+        const next = [...prev];
+        for (const key of requiredTemplateVariableKeys) {
+          if (next.length >= DYNAMIC_VARIABLE_MAX_ITEMS) break;
+          if (existingKeys.has(key)) continue;
+          next.push({
+            id: nextDynamicVariableId(),
+            key,
+            value: '',
+          });
+          existingKeys.add(key);
+        }
+        return next;
+      });
+    };
 
-  const handleTextLaunch = async () => {
-    try {
-      setWsError('');
-      setDynamicVariablesError('');
-      // Start every text debug run as a fresh session transcript.
-      clearResponseTracking();
-      setMessages([]);
-      lastUserFinalRef.current = '';
-      // Force a fresh WS session so updated assistant runtime config
-      // (voice/model/provider/speed) is applied on session.start.
-      closeWs();
-      if (textTtsEnabled) await ensureAudioContext();
-      await ensureWsSession();
-      setTextSessionStarted(true);
-    } catch (e) {
-      console.error(e);
-      const err = e as Error & { __dynamicVariables?: boolean };
-      if (err.__dynamicVariables) {
-        setWsStatus('disconnected');
-        setTextSessionStarted(false);
-        return;
-      }
-      setWsStatus('error');
-      setWsError(err?.message || 'Failed to connect');
-      setTextSessionStarted(false);
-    }
-  };
+    const createDynamicVariablesError = (message: string): Error & { __dynamicVariables?: boolean } => {
+      const error = new Error(message) as Error & { __dynamicVariables?: boolean };
+      error.__dynamicVariables = true;
+      return error;
+    };
 
-  const addDynamicVariableRow = () => {
-    if (isDynamicVariablesLocked) return;
-    setDynamicVariablesError('');
-    setDynamicVariables((prev) => {
-      if (prev.length >= DYNAMIC_VARIABLE_MAX_ITEMS) return prev;
-      return [...prev, { id: nextDynamicVariableId(), key: '', value: '' }];
-    });
-  };
-
-  const updateDynamicVariableRow = (rowId: string, field: 'key' | 'value', value: string) => {
-    if (isDynamicVariablesLocked) return;
-    setDynamicVariablesError('');
-    setDynamicVariables((prev) => prev.map((item) => (item.id === rowId ? { ...item, [field]: value } : item)));
-  };
-
-  const removeDynamicVariableRow = (rowId: string) => {
-    if (isDynamicVariablesLocked) return;
-    setDynamicVariablesError('');
-    setDynamicVariables((prev) => prev.filter((item) => item.id !== rowId));
-  };
-
-  const importDynamicVariablesFromPlaceholders = () => {
-    if (isDynamicVariablesLocked) return;
-    setDynamicVariablesError('');
-    setDynamicVariables((prev) => {
-      if (!requiredTemplateVariableKeys.length || prev.length >= DYNAMIC_VARIABLE_MAX_ITEMS) {
-        return prev;
-      }
-      const existingKeys = new Set(
-        prev
-          .map((item) => item.key.trim())
-          .filter((key) => key !== '')
-      );
-      const next = [...prev];
-      for (const key of requiredTemplateVariableKeys) {
-        if (next.length >= DYNAMIC_VARIABLE_MAX_ITEMS) break;
-        if (existingKeys.has(key)) continue;
-        next.push({
-          id: nextDynamicVariableId(),
-          key,
-          value: '',
-        });
-        existingKeys.add(key);
-      }
-      return next;
-    });
-  };
-
-  const createDynamicVariablesError = (message: string): Error & { __dynamicVariables?: boolean } => {
-    const error = new Error(message) as Error & { __dynamicVariables?: boolean };
-    error.__dynamicVariables = true;
-    return error;
-  };
-
-  const METADATA_OVERRIDE_WHITELIST = new Set([
-    'firstTurnMode',
-    'greeting',
-    'generatedOpenerEnabled',
-    'manualOpenerToolCalls',
-    'systemPrompt',
-    'output',
-    'bargeIn',
-    'knowledge',
-    'knowledgeBaseId',
-    'openerAudio',
-    'tools',
-  ]);
-  const METADATA_FORBIDDEN_SECRET_TOKENS = ['apikey', 'token', 'secret', 'password', 'authorization'];
-  const isPlainObject = (value: unknown): value is Record<string, any> => Boolean(value) && typeof value === 'object' && !Array.isArray(value);
-  const isForbiddenSecretKey = (key: string): boolean => {
-    const normalized = key.toLowerCase().replace(/[_-]/g, '');
-    return METADATA_FORBIDDEN_SECRET_TOKENS.some((token) => normalized.includes(token));
-  };
-  const stripForbiddenSecretKeysDeep = (value: any): any => {
-    if (Array.isArray(value)) return value.map(stripForbiddenSecretKeysDeep);
-    if (!isPlainObject(value)) return value;
-    return Object.entries(value).reduce<Record<string, any>>((acc, [key, nested]) => {
-      if (isForbiddenSecretKey(key)) return acc;
-      acc[key] = stripForbiddenSecretKeysDeep(nested);
-      return acc;
-    }, {});
-  };
-  const sanitizeMetadataForWs = (raw: unknown): Record<string, any> => {
-    if (!isPlainObject(raw)) return { overrides: {} };
-    const sanitized: Record<string, any> = { overrides: {} };
-
-    if (typeof raw.channel === 'string' && raw.channel.trim()) {
-      sanitized.channel = raw.channel.trim();
-    }
-    if (typeof raw.source === 'string' && raw.source.trim()) {
-      sanitized.source = raw.source.trim();
-    }
-    if (isPlainObject(raw.history) && raw.history.userId !== undefined) {
-      sanitized.history = { userId: raw.history.userId };
-    }
-    if (isPlainObject(raw.dynamicVariables)) {
-      sanitized.dynamicVariables = raw.dynamicVariables;
-    }
-    if (isPlainObject(raw.overrides)) {
-      const overrides = Object.entries(raw.overrides).reduce<Record<string, any>>((acc, [key, value]) => {
-        if (!METADATA_OVERRIDE_WHITELIST.has(key)) return acc;
+    const METADATA_OVERRIDE_WHITELIST = new Set([
+      'firstTurnMode',
+      'greeting',
+      'generatedOpenerEnabled',
+      'manualOpenerToolCalls',
+      'systemPrompt',
+      'output',
+      'bargeIn',
+      'knowledge',
+      'knowledgeBaseId',
+      'openerAudio',
+      'tools',
+    ]);
+    const METADATA_FORBIDDEN_SECRET_TOKENS = ['apikey', 'token', 'secret', 'password', 'authorization'];
+    const isPlainObject = (value: unknown): value is Record<string, any> => Boolean(value) && typeof value === 'object' && !Array.isArray(value);
+    const isForbiddenSecretKey = (key: string): boolean => {
+      const normalized = key.toLowerCase().replace(/[_-]/g, '');
+      return METADATA_FORBIDDEN_SECRET_TOKENS.some((token) => normalized.includes(token));
+    };
+    const stripForbiddenSecretKeysDeep = (value: any): any => {
+      if (Array.isArray(value)) return value.map(stripForbiddenSecretKeysDeep);
+      if (!isPlainObject(value)) return value;
+      return Object.entries(value).reduce<Record<string, any>>((acc, [key, nested]) => {
         if (isForbiddenSecretKey(key)) return acc;
-        acc[key] = stripForbiddenSecretKeysDeep(value);
+        acc[key] = stripForbiddenSecretKeysDeep(nested);
         return acc;
       }, {});
-      sanitized.overrides = overrides;
-    }
-    return sanitized;
-  };
-
-  const formatRuntimeConfigDebugView = (args: {
-    submittedSessionStartMetadata?: Record<string, any> | null;
-    wsResolvedConfig?: Record<string, any> | null;
-  }): string => {
-    const hasWsResolved = Boolean(args.wsResolvedConfig && Object.keys(args.wsResolvedConfig).length > 0);
-    const payload: Record<string, any> = {
-      protocol: 'ws_v1',
-      wsConfigResolvedEvent: hasWsResolved ? 'received' : 'not_emitted',
-      note: hasWsResolved
-        ? 'Optional ws config.resolved event received.'
-        : 'ws config.resolved is optional and disabled by default. Showing local session.start metadata preview.',
     };
-    if (args.submittedSessionStartMetadata) {
-      payload.submittedSessionStartMetadata = args.submittedSessionStartMetadata;
-    }
-    if (hasWsResolved) {
-      payload.wsResolvedConfig = args.wsResolvedConfig;
-    }
-    return JSON.stringify(payload, null, 2);
-  };
+    const sanitizeMetadataForWs = (raw: unknown): Record<string, any> => {
+      if (!isPlainObject(raw)) return { overrides: {} };
+      const sanitized: Record<string, any> = { overrides: {} };
 
-  const buildDynamicVariablesPayload = (): { variables: Record<string, string>; error?: string } => {
-    const variables: Record<string, string> = {};
-    const nonEmptyRows = dynamicVariables
-      .map((row, index) => ({ ...row, index, key: row.key.trim() }))
-      .filter((row) => row.key !== '' || row.value !== '');
-
-    if (nonEmptyRows.length > DYNAMIC_VARIABLE_MAX_ITEMS) {
-      return {
-        variables,
-        error: `Dynamic variable count cannot exceed ${DYNAMIC_VARIABLE_MAX_ITEMS}.`,
-      };
-    }
-
-    for (const row of nonEmptyRows) {
-      if (!row.key) {
-        return {
-          variables,
-          error: `Dynamic variable row ${row.index + 1} is missing key.`,
-        };
+      if (typeof raw.channel === 'string' && raw.channel.trim()) {
+        sanitized.channel = raw.channel.trim();
       }
-      if (!DYNAMIC_VARIABLE_KEY_RE.test(row.key)) {
-        return {
-          variables,
-          error: `Invalid dynamic variable key "${row.key}". Use letters, digits, underscore and start with a letter/underscore.`,
-        };
+      if (typeof raw.source === 'string' && raw.source.trim()) {
+        sanitized.source = raw.source.trim();
       }
-      if (SYSTEM_DYNAMIC_VARIABLE_KEY_SET.has(row.key)) {
-        continue;
+      if (isPlainObject(raw.history) && raw.history.userId !== undefined) {
+        sanitized.history = { userId: raw.history.userId };
       }
-      if (row.value === '') {
-        return {
-          variables,
-          error: `Dynamic variable "${row.key}" is missing value.`,
-        };
+      if (isPlainObject(raw.dynamicVariables)) {
+        sanitized.dynamicVariables = raw.dynamicVariables;
       }
-      if (row.value.length > DYNAMIC_VARIABLE_MAX_VALUE_LENGTH) {
-        return {
-          variables,
-          error: `Dynamic variable "${row.key}" exceeds ${DYNAMIC_VARIABLE_MAX_VALUE_LENGTH} characters.`,
-        };
+      if (isPlainObject(raw.overrides)) {
+        const overrides = Object.entries(raw.overrides).reduce<Record<string, any>>((acc, [key, value]) => {
+          if (!METADATA_OVERRIDE_WHITELIST.has(key)) return acc;
+          if (isForbiddenSecretKey(key)) return acc;
+          acc[key] = stripForbiddenSecretKeysDeep(value);
+          return acc;
+        }, {});
+        sanitized.overrides = overrides;
       }
-      if (Object.prototype.hasOwnProperty.call(variables, row.key)) {
-        return {
-          variables,
-          error: `Duplicate dynamic variable key "${row.key}".`,
-        };
-      }
-      variables[row.key] = row.value;
-    }
-
-    const missingTemplateKeys = requiredTemplateVariableKeys.filter((key) => {
-      if (SYSTEM_DYNAMIC_VARIABLE_KEY_SET.has(key)) return false;
-      return !Object.prototype.hasOwnProperty.call(variables, key);
-    });
-    if (missingTemplateKeys.length > 0) {
-      return {
-        variables,
-        error: `Missing required dynamic variables: ${missingTemplateKeys.join(', ')}`,
-      };
-    }
-
-    return { variables };
-  };
-
-  const buildLocalResolvedRuntime = () => {
-    const warnings: string[] = [];
-    const ttsEnabled = Boolean(textTtsEnabled);
-    const generatedOpenerEnabled = assistant.generatedOpenerEnabled === true;
-    const normalizedManualCalls = normalizeManualOpenerToolCallsForRuntime(assistant.manualOpenerToolCalls, { strictJson: true });
-    if (normalizedManualCalls.error) {
-      setDynamicVariablesError(normalizedManualCalls.error);
-      throw createDynamicVariablesError(normalizedManualCalls.error);
-    }
-    const knowledgeBaseId = String(assistant.knowledgeBaseId || '').trim();
-    const knowledge = knowledgeBaseId
-      ? { enabled: true, kbId: knowledgeBaseId, nResults: 5 }
-      : { enabled: false };
-
-    const localResolved = {
-      warnings,
-      sessionStartMetadata: {
-        overrides: {
-          output: {
-            mode: ttsEnabled ? 'audio' : 'text',
-          },
-          systemPrompt: assistant.prompt || '',
-          firstTurnMode: assistant.firstTurnMode || 'bot_first',
-          greeting: generatedOpenerEnabled ? '' : (assistant.opener || ''),
-          generatedOpenerEnabled,
-          manualOpenerToolCalls: generatedOpenerEnabled ? [] : normalizedManualCalls.calls,
-          bargeIn: {
-            enabled: assistant.botCannotBeInterrupted !== true,
-            minDurationMs: Math.max(0, Number(assistant.interruptionSensitivity ?? 180)),
-          },
-          knowledgeBaseId,
-          knowledge,
-          tools: selectedToolSchemas,
-        },
-        history: {
-          userId: 1,
-        },
-        source: 'web_debug',
-      },
+      return sanitized;
     };
 
-    return localResolved;
-  };
+    const formatRuntimeConfigDebugView = (args: {
+      submittedSessionStartMetadata?: Record<string, any> | null;
+      wsResolvedConfig?: Record<string, any> | null;
+    }): string => {
+      const hasWsResolved = Boolean(args.wsResolvedConfig && Object.keys(args.wsResolvedConfig).length > 0);
+      const payload: Record<string, any> = {
+        protocol: 'ws_v1',
+        wsConfigResolvedEvent: hasWsResolved ? 'received' : 'not_emitted',
+        note: hasWsResolved
+          ? 'Optional ws config.resolved event received.'
+          : 'ws config.resolved is optional and disabled by default. Showing local session.start metadata preview.',
+      };
+      if (args.submittedSessionStartMetadata) {
+        payload.submittedSessionStartMetadata = args.submittedSessionStartMetadata;
+      }
+      if (hasWsResolved) {
+        payload.wsResolvedConfig = args.wsResolvedConfig;
+      }
+      return JSON.stringify(payload, null, 2);
+    };
 
-  const fetchRuntimeMetadata = async (): Promise<Record<string, any>> => {
-    const dynamicVariablesResult = buildDynamicVariablesPayload();
-    if (dynamicVariablesResult.error) {
-      setDynamicVariablesError(dynamicVariablesResult.error);
-      throw createDynamicVariablesError(dynamicVariablesResult.error);
-    }
-    setDynamicVariablesError('');
-    const localResolved = buildLocalResolvedRuntime();
-    const mergedMetadata: Record<string, any> = sanitizeMetadataForWs({
-      ...localResolved.sessionStartMetadata,
-      ...(sessionMetadataExtras || {}),
-    });
-    if (Object.keys(dynamicVariablesResult.variables).length > 0) {
-      mergedMetadata.dynamicVariables = dynamicVariablesResult.variables;
-    }
-    if (!mergedMetadata.channel) {
-      mergedMetadata.channel = 'web_debug';
-    }
-    submittedMetadataRef.current = mergedMetadata;
-    setResolvedConfigView(
-      formatRuntimeConfigDebugView({
-        submittedSessionStartMetadata: mergedMetadata,
-      })
-    );
-    return mergedMetadata;
-  };
+    const buildDynamicVariablesPayload = (): { variables: Record<string, string>; error?: string } => {
+      const variables: Record<string, string> = {};
+      const nonEmptyRows = dynamicVariables
+        .map((row, index) => ({ ...row, index, key: row.key.trim() }))
+        .filter((row) => row.key !== '' || row.value !== '');
 
-  const closeWs = () => {
-    if (wsRef.current && wsRef.current.readyState === WebSocket.OPEN) {
-      wsRef.current.send(JSON.stringify({ type: 'session.stop', reason: 'debug_drawer_closed' }));
-    }
-    wsRef.current?.close();
-    wsRef.current = null;
-    wsReadyRef.current = false;
-    pendingResolveRef.current = null;
-    pendingRejectRef.current = null;
-    clearResponseTracking();
-    userDraftIndexRef.current = null;
-    lastUserFinalRef.current = '';
-    micFrameBufferRef.current = new Uint8Array(0);
-    stopPromptVoicePlayback();
-    promptDialogQueueRef.current = [];
-    setTextPromptDialog({ open: false, message: '', promptType: 'text' });
-    setChoicePromptDialog({ open: false, question: '', options: [] });
-    setTextSessionStarted(false);
-    stopPlaybackImmediately();
-    setAgentState('waiting');
-    if (isOpen) setWsStatus('disconnected');
-  };
+      if (nonEmptyRows.length > DYNAMIC_VARIABLE_MAX_ITEMS) {
+        return {
+          variables,
+          error: `Dynamic variable count cannot exceed ${DYNAMIC_VARIABLE_MAX_ITEMS}.`,
+        };
+      }
 
-  const buildSessionWsUrl = () => {
-    const base = wsUrl.trim();
-    if (!base) return '';
-    try {
-      const parsed = new URL(base);
-      parsed.searchParams.set('assistant_id', assistant.id);
-      return parsed.toString();
-    } catch {
+      for (const row of nonEmptyRows) {
+        if (!row.key) {
+          return {
+            variables,
+            error: `Dynamic variable row ${row.index + 1} is missing key.`,
+          };
+        }
+        if (!DYNAMIC_VARIABLE_KEY_RE.test(row.key)) {
+          return {
+            variables,
+            error: `Invalid dynamic variable key "${row.key}". Use letters, digits, underscore and start with a letter/underscore.`,
+          };
+        }
+        if (SYSTEM_DYNAMIC_VARIABLE_KEY_SET.has(row.key)) {
+          continue;
+        }
+        if (row.value === '') {
+          return {
+            variables,
+            error: `Dynamic variable "${row.key}" is missing value.`,
+          };
+        }
+        if (row.value.length > DYNAMIC_VARIABLE_MAX_VALUE_LENGTH) {
+          return {
+            variables,
+            error: `Dynamic variable "${row.key}" exceeds ${DYNAMIC_VARIABLE_MAX_VALUE_LENGTH} characters.`,
+          };
+        }
+        if (Object.prototype.hasOwnProperty.call(variables, row.key)) {
+          return {
+            variables,
+            error: `Duplicate dynamic variable key "${row.key}".`,
+          };
+        }
+        variables[row.key] = row.value;
+      }
+
+      const missingTemplateKeys = requiredTemplateVariableKeys.filter((key) => {
+        if (SYSTEM_DYNAMIC_VARIABLE_KEY_SET.has(key)) return false;
+        return !Object.prototype.hasOwnProperty.call(variables, key);
+      });
+      if (missingTemplateKeys.length > 0) {
+        return {
+          variables,
+          error: `Missing required dynamic variables: ${missingTemplateKeys.join(', ')}`,
+        };
+      }
+
+      return { variables };
+    };
+
+    const buildLocalResolvedRuntime = () => {
+      const warnings: string[] = [];
+      const ttsEnabled = Boolean(textTtsEnabled);
+      const generatedOpenerEnabled = assistant.generatedOpenerEnabled === true;
+      const normalizedManualCalls = normalizeManualOpenerToolCallsForRuntime(assistant.manualOpenerToolCalls, { strictJson: true });
+      if (normalizedManualCalls.error) {
+        setDynamicVariablesError(normalizedManualCalls.error);
+        throw createDynamicVariablesError(normalizedManualCalls.error);
+      }
+      const knowledgeBaseId = String(assistant.knowledgeBaseId || '').trim();
+      const knowledge = knowledgeBaseId
+        ? { enabled: true, kbId: knowledgeBaseId, nResults: 5 }
+        : { enabled: false };
+
+      const localResolved = {
+        warnings,
+        sessionStartMetadata: {
+          overrides: {
+            output: {
+              mode: ttsEnabled ? 'audio' : 'text',
+            },
+            systemPrompt: assistant.prompt || '',
+            firstTurnMode: assistant.firstTurnMode || 'bot_first',
+            greeting: generatedOpenerEnabled ? '' : (assistant.opener || ''),
+            generatedOpenerEnabled,
+            manualOpenerToolCalls: generatedOpenerEnabled ? [] : normalizedManualCalls.calls,
+            bargeIn: {
+              enabled: assistant.botCannotBeInterrupted !== true,
+              minDurationMs: Math.max(0, Number(assistant.interruptionSensitivity ?? 180)),
+            },
+            knowledgeBaseId,
+            knowledge,
+            tools: selectedToolSchemas,
+          },
+          history: {
+            userId: 1,
+          },
+          source: 'web_debug',
+        },
+      };
+
+      return localResolved;
+    };
+
+    const fetchRuntimeMetadata = async (): Promise<Record<string, any>> => {
+      const dynamicVariablesResult = buildDynamicVariablesPayload();
+      if (dynamicVariablesResult.error) {
+        setDynamicVariablesError(dynamicVariablesResult.error);
+        throw createDynamicVariablesError(dynamicVariablesResult.error);
+      }
+      setDynamicVariablesError('');
+      const localResolved = buildLocalResolvedRuntime();
+      const mergedMetadata: Record<string, any> = sanitizeMetadataForWs({
+        ...localResolved.sessionStartMetadata,
+        ...(sessionMetadataExtras || {}),
+      });
+      if (Object.keys(dynamicVariablesResult.variables).length > 0) {
+        mergedMetadata.dynamicVariables = dynamicVariablesResult.variables;
+      }
+      if (!mergedMetadata.channel) {
+        mergedMetadata.channel = 'web_debug';
+      }
+      submittedMetadataRef.current = mergedMetadata;
+      setResolvedConfigView(
+        formatRuntimeConfigDebugView({
+          submittedSessionStartMetadata: mergedMetadata,
+        })
+      );
+      return mergedMetadata;
+    };
+
+    const closeWs = () => {
+      if (wsRef.current && wsRef.current.readyState === WebSocket.OPEN) {
+        wsRef.current.send(JSON.stringify({ type: 'session.stop', reason: 'debug_drawer_closed' }));
+      }
+      wsRef.current?.close();
+      wsRef.current = null;
+      wsReadyRef.current = false;
+      pendingResolveRef.current = null;
+      pendingRejectRef.current = null;
+      clearResponseTracking();
+      userDraftIndexRef.current = null;
+      lastUserFinalRef.current = '';
+      micFrameBufferRef.current = new Uint8Array(0);
+      stopPromptVoicePlayback();
+      promptDialogQueueRef.current = [];
+      setTextPromptDialog({ open: false, message: '', promptType: 'text' });
+      setChoicePromptDialog({ open: false, question: '', options: [] });
+      setTextSessionStarted(false);
+      stopPlaybackImmediately();
+      setAgentState('waiting');
+      if (isOpen) setWsStatus('disconnected');
+    };
+
+    const buildSessionWsUrl = () => {
+      const base = wsUrl.trim();
+      if (!base) return '';
       try {
-        const parsed = new URL(base, window.location.href);
+        const parsed = new URL(base);
         parsed.searchParams.set('assistant_id', assistant.id);
         return parsed.toString();
       } catch {
-        return base;
+        try {
+          const parsed = new URL(base, window.location.href);
+          parsed.searchParams.set('assistant_id', assistant.id);
+          return parsed.toString();
+        } catch {
+          return base;
+        }
       }
-    }
-  };
+    };
 
-  const ensureWsSession = async () => {
-    if (wsRef.current && wsReadyRef.current && wsRef.current.readyState === WebSocket.OPEN) {
-      return;
-    }
+    const ensureWsSession = async () => {
+      if (wsRef.current && wsReadyRef.current && wsRef.current.readyState === WebSocket.OPEN) {
+        return;
+      }
+
+      if (wsRef.current && wsRef.current.readyState === WebSocket.CONNECTING) {
+        await new Promise<void>((resolve, reject) => {
+          pendingResolveRef.current = resolve;
+          pendingRejectRef.current = reject;
+        });
+        return;
+      }
+
+      const metadata = await fetchRuntimeMetadata();
+      const sessionWsUrl = buildSessionWsUrl();
+      setWsStatus('connecting');
+      setWsError('');
 
-    if (wsRef.current && wsRef.current.readyState === WebSocket.CONNECTING) {
       await new Promise<void>((resolve, reject) => {
         pendingResolveRef.current = resolve;
         pendingRejectRef.current = reject;
-      });
-      return;
-    }
+        const ws = new WebSocket(sessionWsUrl);
+        ws.binaryType = 'arraybuffer';
+        wsRef.current = ws;
 
-    const metadata = await fetchRuntimeMetadata();
-    const sessionWsUrl = buildSessionWsUrl();
-    setWsStatus('connecting');
-    setWsError('');
+        ws.onopen = () => {
+          ws.send(
+            JSON.stringify({
+              type: 'session.start',
+              audio: { encoding: 'pcm_s16le', sample_rate_hz: 16000, channels: 1 },
+              metadata,
+            })
+          );
+        };
 
-    await new Promise<void>((resolve, reject) => {
-      pendingResolveRef.current = resolve;
-      pendingRejectRef.current = reject;
-      const ws = new WebSocket(sessionWsUrl);
-      ws.binaryType = 'arraybuffer';
-      wsRef.current = ws;
-
-      ws.onopen = () => {
-        ws.send(
-          JSON.stringify({
-            type: 'session.start',
-            audio: { encoding: 'pcm_s16le', sample_rate_hz: 16000, channels: 1 },
-            metadata,
-          })
-        );
-      };
-
-      ws.onmessage = (event) => {
-        if (event.data instanceof ArrayBuffer) {
-          void playPcm16Chunk(event.data);
-          return;
-        }
-        if (event.data instanceof Blob) {
-          void event.data.arrayBuffer().then((buf) => playPcm16Chunk(buf));
-          return;
-        }
-        if (typeof event.data !== 'string') return;
-        let payload: any;
-        try {
-          payload = JSON.parse(event.data);
-        } catch {
-          return;
-        }
-
-        const type = payload?.type;
-        if (onProtocolEvent) {
-          onProtocolEvent(payload);
-        }
-        if (type === 'output.audio.start') {
-          // New utterance audio starts: cancel old queued/playing audio to avoid overlap.
-          stopPlaybackImmediately();
-          setAgentState('speaking');
-          return;
-        }
-
-        if (type === 'output.audio.end') {
-          setAgentState('listening');
-          return;
-        }
-
-        if (type === 'response.interrupted') {
-          const interruptedResponseId = extractResponseId(payload);
-          if (interruptedResponseId) {
-            interruptedResponseIdsRef.current.add(interruptedResponseId);
-            if (interruptedResponseIdsRef.current.size > 64) {
-              const oldest = interruptedResponseIdsRef.current.values().next().value as string | undefined;
-              if (oldest) interruptedResponseIdsRef.current.delete(oldest);
-            }
-          }
-          assistantDraftIndexRef.current = null;
-          setIsLoading(false);
-          stopPlaybackImmediately();
-          setAgentState('waiting');
-          return;
-        }
-
-        if (type === 'metrics.ttfb') {
-          const maybeTtfb = Number(payload?.latencyMs ?? payload?.data?.latencyMs);
-          if (!Number.isFinite(maybeTtfb) || maybeTtfb < 0) return;
-          const ttfbMs = Math.round(maybeTtfb);
-          const responseId = extractResponseId(payload);
-          if (responseId && interruptedResponseIdsRef.current.has(responseId)) {
-            noteInterruptedDrop(responseId, 'ttfb');
+        ws.onmessage = (event) => {
+          if (event.data instanceof ArrayBuffer) {
+            void playPcm16Chunk(event.data);
             return;
           }
-          if (responseId) {
-            const indexed = assistantResponseIndexByIdRef.current.get(responseId);
-            if (typeof indexed === 'number') {
-              setMessages((prev) => {
-                if (!prev[indexed] || prev[indexed].role !== 'model') return prev;
-                const next = [...prev];
-                next[indexed] = { ...next[indexed], ttfbMs };
-                return next;
-              });
-            } else {
-              pendingTtfbByResponseIdRef.current.set(responseId, ttfbMs);
-            }
+          if (event.data instanceof Blob) {
+            void event.data.arrayBuffer().then((buf) => playPcm16Chunk(buf));
             return;
           }
-          setMessages((prev) => {
-            for (let i = prev.length - 1; i >= 0; i -= 1) {
-              if (prev[i]?.role === 'model') {
-                const next = [...prev];
-                next[i] = { ...next[i], ttfbMs };
-                return next;
-              }
-            }
-            return prev;
-          });
-          return;
-        }
-
-        if (type === 'assistant.tool_call') {
-          const toolCall = payload?.tool_call || {};
-          const toolCallId = String(payload?.tool_call_id || toolCall?.id || '').trim();
-          const toolName = normalizeToolId(toolCall?.function?.name || toolCall?.name || 'unknown_tool');
-          const toolDisplayName = String(payload?.tool_display_name || toolCall?.displayName || toolName);
-          const executor = String(toolCall?.executor || 'server').toLowerCase();
-          const rawArgs = String(toolCall?.function?.arguments || '');
-          const argText = rawArgs.length > 160 ? `${rawArgs.slice(0, 160)}...` : rawArgs;
-          setMessages((prev) => [
-            ...prev,
-            {
-              role: 'tool',
-              text: `call ${toolDisplayName} executor=${executor}${argText ? ` args=${argText}` : ''}`,
-            },
-          ]);
-          if (executor === 'client' && toolCallId && ws.readyState === WebSocket.OPEN) {
-            let parsedArgs: Record<string, any> = {};
-            if (rawArgs) {
-              try {
-                const candidate = JSON.parse(rawArgs);
-                parsedArgs = candidate && typeof candidate === 'object' ? candidate : {};
-              } catch {
-                parsedArgs = {};
-              }
-            }
-            const waitForResponseRaw = Boolean(
-              payload?.wait_for_response ?? toolCall?.wait_for_response ?? toolCall?.waitForResponse ?? false
-            );
-            const waitForResponse =
-              toolName === 'voice_choice_prompt' || toolName === 'text_choice_prompt' ? true : waitForResponseRaw;
-            const resultPayload: any = {
-              tool_call_id: toolCallId,
-              name: toolName,
-              output: { message: `Unhandled client tool '${toolName}'` },
-              status: { code: 501, message: 'not_implemented' },
-            };
-            if (DEBUG_CLIENT_TOOL_ID_SET.has(toolName) && !isClientToolEnabledLive(toolName)) {
-              resultPayload.output = { message: `Client tool '${toolName}' is disabled in debug settings` };
-              resultPayload.status = { code: 503, message: 'tool_disabled' };
-            }
-            try {
-              if (resultPayload.status.code === 503) {
-                // Keep disabled result as-is.
-              } else if (toolName === 'turn_on_camera') {
-                if (!waitForResponse) {
-                  emitClientToolResult(
-                    {
-                      tool_call_id: toolCallId,
-                      name: toolName,
-                      output: { message: 'camera_on_dispatched' },
-                      status: { code: 200, message: 'ok' },
-                    },
-                    toolDisplayName
-                  );
-                }
-                navigator.mediaDevices
-                  .getUserMedia({
-                    video: selectedCamera ? { deviceId: { exact: selectedCamera } } : true,
-                    audio: false,
-                  })
-                  .then((stream) => {
-                    if (videoRef.current) videoRef.current.srcObject = stream;
-                    streamRef.current = stream;
-                    if (waitForResponse) {
-                      emitClientToolResult(
-                        {
-                          tool_call_id: toolCallId,
-                          name: toolName,
-                          output: {
-                            message: 'camera_on',
-                            tracks: stream.getVideoTracks().length,
-                          },
-                          status: { code: 200, message: 'ok' },
-                        },
-                        toolDisplayName
-                      );
-                    }
-                  })
-                  .catch((err) => {
-                    if (waitForResponse) {
-                      emitClientToolResult(
-                        {
-                          tool_call_id: toolCallId,
-                          name: toolName,
-                          output: {
-                            message: `Client tool '${toolName}' failed`,
-                            error: err instanceof Error ? err.message : String(err),
-                          },
-                          status: { code: 500, message: 'client_tool_failed' },
-                        },
-                        toolDisplayName
-                      );
-                    }
-                  });
-                return;
-              } else if (toolName === 'turn_off_camera') {
-                stopMedia();
-                if (videoRef.current) videoRef.current.srcObject = null;
-                resultPayload.output = { message: 'camera_off' };
-                resultPayload.status = { code: 200, message: 'ok' };
-              } else if (toolName === 'increase_volume') {
-                const rawStep = Number(parsedArgs?.step);
-                const step = Number.isFinite(rawStep) ? Math.max(1, Math.floor(rawStep)) : 1;
-                debugVolumePercentRef.current = Math.min(100, debugVolumePercentRef.current + step);
-                resultPayload.output = {
-                  message: 'volume_increased',
-                  level: debugVolumePercentRef.current,
-                };
-                resultPayload.status = { code: 200, message: 'ok' };
-              } else if (toolName === 'decrease_volume') {
-                const rawStep = Number(parsedArgs?.step);
-                const step = Number.isFinite(rawStep) ? Math.max(1, Math.floor(rawStep)) : 1;
-                debugVolumePercentRef.current = Math.max(0, debugVolumePercentRef.current - step);
-                resultPayload.output = {
-                  message: 'volume_decreased',
-                  level: debugVolumePercentRef.current,
-                };
-                resultPayload.status = { code: 200, message: 'ok' };
-              } else if (toolName === 'voice_msg_prompt' || toolName === 'voice_message_prompt') {
-                const msg = String(parsedArgs?.msg || '').trim();
-                if (!msg) {
-                  resultPayload.output = { message: "Missing required argument 'msg'" };
-                  resultPayload.status = { code: 422, message: 'invalid_arguments' };
-                } else {
-                  enqueuePromptDialog({
-                    kind: 'text',
-                    payload: {
-                      message: msg,
-                      promptType: 'voice',
-                      voiceText: msg,
-                      pendingResult: {
-                        toolCallId: toolCallId,
-                        toolName,
-                        toolDisplayName,
-                        waitForResponse,
-                      },
-                    },
-                  });
-                  if (!waitForResponse) {
-                    resultPayload.output = { message: 'voice_prompt_shown', msg };
-                    resultPayload.status = { code: 200, message: 'ok' };
-                  } else {
-                    return;
-                  }
-                }
-              } else if (toolName === 'text_msg_prompt') {
-                const msg = String(parsedArgs?.msg || '').trim();
-                if (!msg) {
-                  resultPayload.output = { message: "Missing required argument 'msg'" };
-                  resultPayload.status = { code: 422, message: 'invalid_arguments' };
-                } else {
-                  enqueuePromptDialog({
-                    kind: 'text',
-                    payload: {
-                      message: msg,
-                      pendingResult: {
-                        toolCallId: toolCallId,
-                        toolName,
-                        toolDisplayName,
-                        waitForResponse,
-                      },
-                    },
-                  });
-                  if (!waitForResponse) {
-                    resultPayload.output = { message: 'text_prompt_shown', msg };
-                    resultPayload.status = { code: 200, message: 'ok' };
-                  } else {
-                    return;
-                  }
-                }
-              } else if (toolName === 'text_choice_prompt' || toolName === 'voice_choice_prompt') {
-                const question = String(parsedArgs?.question || '').trim();
-                const rawOptions = Array.isArray(parsedArgs?.options) ? parsedArgs.options : [];
-                const options = normalizeChoicePromptOptions(rawOptions);
-                const isVoiceChoicePrompt = toolName === 'voice_choice_prompt';
-                const voiceText = isVoiceChoicePrompt
-                  ? String(parsedArgs?.voice_text || parsedArgs?.voiceText || parsedArgs?.msg || question || '').trim()
-                  : '';
-                const requireSelection = toolName === 'voice_choice_prompt' || toolName === 'text_choice_prompt';
-                if (!question) {
-                  resultPayload.output = { message: "Missing required argument 'question'" };
-                  resultPayload.status = { code: 422, message: 'invalid_arguments' };
-                } else if (options.length < 2) {
-                  resultPayload.output = { message: "Argument 'options' requires at least 2 valid entries" };
-                  resultPayload.status = { code: 422, message: 'invalid_arguments' };
-                } else {
-                  enqueuePromptDialog({
-                    kind: 'choice',
-                    payload: {
-                      question,
-                      options,
-                      pendingResult: {
-                        toolCallId: toolCallId,
-                        toolName,
-                        toolDisplayName,
-                        waitForResponse,
-                      },
-                      requireSelection,
-                      voiceText,
-                    },
-                  });
-                  if (!waitForResponse && !requireSelection) {
-                    resultPayload.output = {
-                      message: `${toolName}_shown`,
-                      question,
-                      options,
-                    };
-                    resultPayload.status = { code: 200, message: 'ok' };
-                  } else {
-                    return;
-                  }
-                }
-              }
-            } catch (err) {
-              resultPayload.output = {
-                message: `Client tool '${toolName}' failed`,
-                error: err instanceof Error ? err.message : String(err),
-              };
-              resultPayload.status = { code: 500, message: 'client_tool_failed' };
-            }
-            emitClientToolResult(resultPayload, toolDisplayName);
-          }
-          return;
-        }
-
-        if (type === 'assistant.tool_result') {
-          const result = payload?.result || {};
-          const toolName = normalizeToolId(result?.name || 'unknown_tool');
-          const toolDisplayName = String(payload?.tool_display_name || toolName);
-          const statusCode = Number(result?.status?.code || 500);
-          const statusMessage = String(result?.status?.message || 'error');
-          const source = String(payload?.source || 'server');
-          const output = result?.output;
-          const resultText =
-            statusCode === 200
-              ? `result ${toolDisplayName} source=${source} ${JSON.stringify(output)}`
-              : `result ${toolDisplayName} source=${source} status=${statusCode} ${statusMessage}`;
-          setMessages((prev) => [...prev, { role: 'tool', text: resultText }]);
-          return;
-        }
-
-        if (type === 'session.started') {
-          wsReadyRef.current = true;
-          setWsStatus('ready');
-          setAgentState('waiting');
-          pendingResolveRef.current?.();
-          pendingResolveRef.current = null;
-          pendingRejectRef.current = null;
-          return;
-        }
-
-        if (type === 'config.resolved') {
-          const resolved = payload?.config || payload?.data?.config;
-          if (resolved) {
-            setResolvedConfigView(
-              formatRuntimeConfigDebugView({
-                submittedSessionStartMetadata: submittedMetadataRef.current,
-                wsResolvedConfig: resolved,
-              })
-            );
-          }
-          return;
-        }
-
-        if (type === 'input.speech_started') {
-          setIsLoading(true);
-          setAgentState('listening');
-          return;
-        }
-
-        if (type === 'input.speech_stopped') {
-          setIsLoading(false);
-          setAgentState('thinking');
-          return;
-        }
-
-        if (type === 'transcript.delta') {
-          const delta = String(payload.text || '');
-          if (!delta) return;
-          setMessages((prev) => {
-            const idx = userDraftIndexRef.current;
-            if (idx === null || !prev[idx] || prev[idx].role !== 'user') {
-              const next = [...prev, { role: 'user' as const, text: delta }];
-              userDraftIndexRef.current = next.length - 1;
-              return next;
-            }
-            const next = [...prev];
-            // ASR interim is typically the latest partial text, not a true text delta.
-            next[idx] = { ...next[idx], text: delta };
-            return next;
-          });
-          return;
-        }
-
-        if (type === 'transcript.final') {
-          const finalText = String(payload.text || '');
-          if (!finalText) {
-            userDraftIndexRef.current = null;
+          if (typeof event.data !== 'string') return;
+          let payload: any;
+          try {
+            payload = JSON.parse(event.data);
+          } catch {
             return;
           }
-          if (lastUserFinalRef.current === finalText) {
-            userDraftIndexRef.current = null;
-            return;
-          }
-          setMessages((prev) => {
-            const idx = userDraftIndexRef.current;
-            userDraftIndexRef.current = null;
-            if (idx !== null && prev[idx] && prev[idx].role === 'user') {
-              const next = [...prev];
-              next[idx] = { ...next[idx], text: finalText || next[idx].text };
-              lastUserFinalRef.current = finalText;
-              return next;
-            }
-            const last = prev[prev.length - 1];
-            if (last?.role === 'user') {
-              const next = [...prev];
-              next[next.length - 1] = { ...last, text: finalText };
-              lastUserFinalRef.current = finalText;
-              return next;
-            }
-            lastUserFinalRef.current = finalText;
-            return [...prev, { role: 'user', text: finalText }];
-          });
-          return;
-        }
 
-        if (type === 'assistant.response.delta') {
-          const delta = String(payload.text || '');
-          if (!delta) return;
-          const responseId = extractResponseId(payload);
-          if (responseId && interruptedResponseIdsRef.current.has(responseId)) {
-            noteInterruptedDrop(responseId, 'delta');
+          const type = payload?.type;
+          if (onProtocolEvent) {
+            onProtocolEvent(payload);
+          }
+          if (type === 'output.audio.start') {
+            // New utterance audio starts: cancel old queued/playing audio to avoid overlap.
+            stopPlaybackImmediately();
+            setAgentState('speaking');
             return;
           }
-          setMessages((prev) => {
-            let idx = assistantDraftIndexRef.current;
-            if (idx === null || !prev[idx] || prev[idx].role !== 'model') {
-              // Tool records can be appended between assistant chunks; recover the
-              // latest model row instead of creating a duplicate assistant row.
-              for (let i = prev.length - 1; i >= 0; i -= 1) {
-                if (prev[i]?.role === 'model') {
-                  if (
-                    responseId
-                    && prev[i].responseId
-                    && prev[i].responseId !== responseId
-                  ) {
-                    break;
-                  }
-                  idx = i;
-                  assistantDraftIndexRef.current = i;
-                  break;
-                }
-                if (prev[i]?.role === 'user') break;
-              }
-            }
-            if (idx === null || !prev[idx] || prev[idx].role !== 'model') {
-              const last = prev[prev.length - 1];
-              if (last?.role === 'model' && last.text === delta) {
-                return prev;
-              }
-              const nextMessage: DebugTranscriptMessage = { role: 'model' as const, text: delta };
-              if (responseId) {
-                nextMessage.responseId = responseId;
-                if (pendingTtfbByResponseIdRef.current.has(responseId)) {
-                  nextMessage.ttfbMs = pendingTtfbByResponseIdRef.current.get(responseId);
-                  pendingTtfbByResponseIdRef.current.delete(responseId);
-                }
-              }
-              const next = [...prev, nextMessage];
-              assistantDraftIndexRef.current = next.length - 1;
-              if (responseId) {
-                assistantResponseIndexByIdRef.current.set(responseId, next.length - 1);
-              }
-              return next;
-            }
-            const next = [...prev];
-            const nextMessage = { ...next[idx], text: next[idx].text + delta };
-            if (responseId && !nextMessage.responseId) {
-              nextMessage.responseId = responseId;
-            }
-            if (
-              responseId
-              && typeof nextMessage.ttfbMs !== 'number'
-              && pendingTtfbByResponseIdRef.current.has(responseId)
-            ) {
-              nextMessage.ttfbMs = pendingTtfbByResponseIdRef.current.get(responseId);
-              pendingTtfbByResponseIdRef.current.delete(responseId);
-            }
-            next[idx] = nextMessage;
-            if (responseId) {
-              assistantResponseIndexByIdRef.current.set(responseId, idx);
-            }
-            return next;
-          });
-          return;
-        }
 
-        if (type === 'assistant.response.final') {
-          const finalText = String(payload.text || '');
-          const responseId = extractResponseId(payload);
-          if (responseId && interruptedResponseIdsRef.current.has(responseId)) {
-            noteInterruptedDrop(responseId, 'final');
+          if (type === 'output.audio.end') {
+            setAgentState('listening');
             return;
           }
-          setMessages((prev) => {
-            let idx = assistantDraftIndexRef.current;
+
+          if (type === 'response.interrupted') {
+            const interruptedResponseId = extractResponseId(payload);
+            if (interruptedResponseId) {
+              interruptedResponseIdsRef.current.add(interruptedResponseId);
+              if (interruptedResponseIdsRef.current.size > 64) {
+                const oldest = interruptedResponseIdsRef.current.values().next().value as string | undefined;
+                if (oldest) interruptedResponseIdsRef.current.delete(oldest);
+              }
+            }
             assistantDraftIndexRef.current = null;
-            if (idx === null || !prev[idx] || prev[idx].role !== 'model') {
+            setIsLoading(false);
+            stopPlaybackImmediately();
+            setAgentState('waiting');
+            return;
+          }
+
+          if (type === 'metrics.ttfb') {
+            const maybeTtfb = Number(payload?.latencyMs ?? payload?.data?.latencyMs);
+            if (!Number.isFinite(maybeTtfb) || maybeTtfb < 0) return;
+            const ttfbMs = Math.round(maybeTtfb);
+            const responseId = extractResponseId(payload);
+            if (responseId && interruptedResponseIdsRef.current.has(responseId)) {
+              noteInterruptedDrop(responseId, 'ttfb');
+              return;
+            }
+            if (responseId) {
+              const indexed = assistantResponseIndexByIdRef.current.get(responseId);
+              if (typeof indexed === 'number') {
+                setMessages((prev) => {
+                  if (!prev[indexed] || prev[indexed].role !== 'model') return prev;
+                  const next = [...prev];
+                  next[indexed] = { ...next[indexed], ttfbMs };
+                  return next;
+                });
+              } else {
+                pendingTtfbByResponseIdRef.current.set(responseId, ttfbMs);
+              }
+              return;
+            }
+            setMessages((prev) => {
               for (let i = prev.length - 1; i >= 0; i -= 1) {
                 if (prev[i]?.role === 'model') {
-                  if (
-                    responseId
-                    && prev[i].responseId
-                    && prev[i].responseId !== responseId
-                  ) {
+                  const next = [...prev];
+                  next[i] = { ...next[i], ttfbMs };
+                  return next;
+                }
+              }
+              return prev;
+            });
+            return;
+          }
+
+          if (type === 'assistant.tool_call') {
+            const toolCall = payload?.tool_call || {};
+            const toolCallId = String(payload?.tool_call_id || toolCall?.id || '').trim();
+            const toolName = normalizeToolId(toolCall?.function?.name || toolCall?.name || 'unknown_tool');
+            const toolDisplayName = String(payload?.tool_display_name || toolCall?.displayName || toolName);
+            const executor = String(toolCall?.executor || 'server').toLowerCase();
+            const rawArgs = String(toolCall?.function?.arguments || '');
+            const argText = rawArgs.length > 160 ? `${rawArgs.slice(0, 160)}...` : rawArgs;
+            setMessages((prev) => [
+              ...prev,
+              {
+                role: 'tool',
+                text: `call ${toolDisplayName} executor=${executor}${argText ? ` args=${argText}` : ''}`,
+              },
+            ]);
+            if (executor === 'client' && toolCallId && ws.readyState === WebSocket.OPEN) {
+              let parsedArgs: Record<string, any> = {};
+              if (rawArgs) {
+                try {
+                  const candidate = JSON.parse(rawArgs);
+                  parsedArgs = candidate && typeof candidate === 'object' ? candidate : {};
+                } catch {
+                  parsedArgs = {};
+                }
+              }
+              const waitForResponseRaw = Boolean(
+                payload?.wait_for_response ?? toolCall?.wait_for_response ?? toolCall?.waitForResponse ?? false
+              );
+              const waitForResponse =
+                toolName === 'voice_choice_prompt' || toolName === 'text_choice_prompt' ? true : waitForResponseRaw;
+              const resultPayload: any = {
+                tool_call_id: toolCallId,
+                name: toolName,
+                output: { message: `Unhandled client tool '${toolName}'` },
+                status: { code: 501, message: 'not_implemented' },
+              };
+              if (DEBUG_CLIENT_TOOL_ID_SET.has(toolName) && !isClientToolEnabledLive(toolName)) {
+                resultPayload.output = { message: `Client tool '${toolName}' is disabled in debug settings` };
+                resultPayload.status = { code: 503, message: 'tool_disabled' };
+              }
+              try {
+                if (resultPayload.status.code === 503) {
+                  // Keep disabled result as-is.
+                } else if (toolName === 'turn_on_camera') {
+                  if (!waitForResponse) {
+                    emitClientToolResult(
+                      {
+                        tool_call_id: toolCallId,
+                        name: toolName,
+                        output: { message: 'camera_on_dispatched' },
+                        status: { code: 200, message: 'ok' },
+                      },
+                      toolDisplayName
+                    );
+                  }
+                  navigator.mediaDevices
+                    .getUserMedia({
+                      video: selectedCamera ? { deviceId: { exact: selectedCamera } } : true,
+                      audio: false,
+                    })
+                    .then((stream) => {
+                      if (videoRef.current) videoRef.current.srcObject = stream;
+                      streamRef.current = stream;
+                      if (waitForResponse) {
+                        emitClientToolResult(
+                          {
+                            tool_call_id: toolCallId,
+                            name: toolName,
+                            output: {
+                              message: 'camera_on',
+                              tracks: stream.getVideoTracks().length,
+                            },
+                            status: { code: 200, message: 'ok' },
+                          },
+                          toolDisplayName
+                        );
+                      }
+                    })
+                    .catch((err) => {
+                      if (waitForResponse) {
+                        emitClientToolResult(
+                          {
+                            tool_call_id: toolCallId,
+                            name: toolName,
+                            output: {
+                              message: `Client tool '${toolName}' failed`,
+                              error: err instanceof Error ? err.message : String(err),
+                            },
+                            status: { code: 500, message: 'client_tool_failed' },
+                          },
+                          toolDisplayName
+                        );
+                      }
+                    });
+                  return;
+                } else if (toolName === 'turn_off_camera') {
+                  stopMedia();
+                  if (videoRef.current) videoRef.current.srcObject = null;
+                  resultPayload.output = { message: 'camera_off' };
+                  resultPayload.status = { code: 200, message: 'ok' };
+                } else if (toolName === 'increase_volume') {
+                  const rawStep = Number(parsedArgs?.step);
+                  const step = Number.isFinite(rawStep) ? Math.max(1, Math.floor(rawStep)) : 1;
+                  debugVolumePercentRef.current = Math.min(100, debugVolumePercentRef.current + step);
+                  resultPayload.output = {
+                    message: 'volume_increased',
+                    level: debugVolumePercentRef.current,
+                  };
+                  resultPayload.status = { code: 200, message: 'ok' };
+                } else if (toolName === 'decrease_volume') {
+                  const rawStep = Number(parsedArgs?.step);
+                  const step = Number.isFinite(rawStep) ? Math.max(1, Math.floor(rawStep)) : 1;
+                  debugVolumePercentRef.current = Math.max(0, debugVolumePercentRef.current - step);
+                  resultPayload.output = {
+                    message: 'volume_decreased',
+                    level: debugVolumePercentRef.current,
+                  };
+                  resultPayload.status = { code: 200, message: 'ok' };
+                } else if (toolName === 'voice_msg_prompt' || toolName === 'voice_message_prompt') {
+                  const msg = String(parsedArgs?.msg || '').trim();
+                  if (!msg) {
+                    resultPayload.output = { message: "Missing required argument 'msg'" };
+                    resultPayload.status = { code: 422, message: 'invalid_arguments' };
+                  } else {
+                    enqueuePromptDialog({
+                      kind: 'text',
+                      payload: {
+                        message: msg,
+                        promptType: 'voice',
+                        voiceText: msg,
+                        pendingResult: {
+                          toolCallId: toolCallId,
+                          toolName,
+                          toolDisplayName,
+                          waitForResponse,
+                        },
+                      },
+                    });
+                    if (!waitForResponse) {
+                      resultPayload.output = { message: 'voice_prompt_shown', msg };
+                      resultPayload.status = { code: 200, message: 'ok' };
+                    } else {
+                      return;
+                    }
+                  }
+                } else if (toolName === 'text_msg_prompt') {
+                  const msg = String(parsedArgs?.msg || '').trim();
+                  if (!msg) {
+                    resultPayload.output = { message: "Missing required argument 'msg'" };
+                    resultPayload.status = { code: 422, message: 'invalid_arguments' };
+                  } else {
+                    enqueuePromptDialog({
+                      kind: 'text',
+                      payload: {
+                        message: msg,
+                        pendingResult: {
+                          toolCallId: toolCallId,
+                          toolName,
+                          toolDisplayName,
+                          waitForResponse,
+                        },
+                      },
+                    });
+                    if (!waitForResponse) {
+                      resultPayload.output = { message: 'text_prompt_shown', msg };
+                      resultPayload.status = { code: 200, message: 'ok' };
+                    } else {
+                      return;
+                    }
+                  }
+                } else if (toolName === 'text_choice_prompt' || toolName === 'voice_choice_prompt') {
+                  const question = String(parsedArgs?.question || '').trim();
+                  const rawOptions = Array.isArray(parsedArgs?.options) ? parsedArgs.options : [];
+                  const options = normalizeChoicePromptOptions(rawOptions);
+                  const isVoiceChoicePrompt = toolName === 'voice_choice_prompt';
+                  const voiceText = isVoiceChoicePrompt
+                    ? String(parsedArgs?.voice_text || parsedArgs?.voiceText || parsedArgs?.msg || question || '').trim()
+                    : '';
+                  const requireSelection = toolName === 'voice_choice_prompt' || toolName === 'text_choice_prompt';
+                  if (!question) {
+                    resultPayload.output = { message: "Missing required argument 'question'" };
+                    resultPayload.status = { code: 422, message: 'invalid_arguments' };
+                  } else if (options.length < 2) {
+                    resultPayload.output = { message: "Argument 'options' requires at least 2 valid entries" };
+                    resultPayload.status = { code: 422, message: 'invalid_arguments' };
+                  } else {
+                    enqueuePromptDialog({
+                      kind: 'choice',
+                      payload: {
+                        question,
+                        options,
+                        pendingResult: {
+                          toolCallId: toolCallId,
+                          toolName,
+                          toolDisplayName,
+                          waitForResponse,
+                        },
+                        requireSelection,
+                        voiceText,
+                      },
+                    });
+                    if (!waitForResponse && !requireSelection) {
+                      resultPayload.output = {
+                        message: `${toolName}_shown`,
+                        question,
+                        options,
+                      };
+                      resultPayload.status = { code: 200, message: 'ok' };
+                    } else {
+                      return;
+                    }
+                  }
+                }
+              } catch (err) {
+                resultPayload.output = {
+                  message: `Client tool '${toolName}' failed`,
+                  error: err instanceof Error ? err.message : String(err),
+                };
+                resultPayload.status = { code: 500, message: 'client_tool_failed' };
+              }
+              emitClientToolResult(resultPayload, toolDisplayName);
+            }
+            return;
+          }
+
+          if (type === 'assistant.tool_result') {
+            const result = payload?.result || {};
+            const toolName = normalizeToolId(result?.name || 'unknown_tool');
+            const toolDisplayName = String(payload?.tool_display_name || toolName);
+            const statusCode = Number(result?.status?.code || 500);
+            const statusMessage = String(result?.status?.message || 'error');
+            const source = String(payload?.source || 'server');
+            const output = result?.output;
+            const resultText =
+              statusCode === 200
+                ? `result ${toolDisplayName} source=${source} ${JSON.stringify(output)}`
+                : `result ${toolDisplayName} source=${source} status=${statusCode} ${statusMessage}`;
+            setMessages((prev) => [...prev, { role: 'tool', text: resultText }]);
+            return;
+          }
+
+          if (type === 'session.started') {
+            wsReadyRef.current = true;
+            setWsStatus('ready');
+            setAgentState('waiting');
+            pendingResolveRef.current?.();
+            pendingResolveRef.current = null;
+            pendingRejectRef.current = null;
+            return;
+          }
+
+          if (type === 'config.resolved') {
+            const resolved = payload?.config || payload?.data?.config;
+            if (resolved) {
+              setResolvedConfigView(
+                formatRuntimeConfigDebugView({
+                  submittedSessionStartMetadata: submittedMetadataRef.current,
+                  wsResolvedConfig: resolved,
+                })
+              );
+            }
+            return;
+          }
+
+          if (type === 'input.speech_started') {
+            setIsLoading(true);
+            setAgentState('listening');
+            return;
+          }
+
+          if (type === 'input.speech_stopped') {
+            setIsLoading(false);
+            setAgentState('thinking');
+            return;
+          }
+
+          if (type === 'transcript.delta') {
+            const delta = String(payload.text || '');
+            if (!delta) return;
+            setMessages((prev) => {
+              const idx = userDraftIndexRef.current;
+              if (idx === null || !prev[idx] || prev[idx].role !== 'user') {
+                const next = [...prev, { role: 'user' as const, text: delta }];
+                userDraftIndexRef.current = next.length - 1;
+                return next;
+              }
+              const next = [...prev];
+              // ASR interim is typically the latest partial text, not a true text delta.
+              next[idx] = { ...next[idx], text: delta };
+              return next;
+            });
+            return;
+          }
+
+          if (type === 'transcript.final') {
+            const finalText = String(payload.text || '');
+            if (!finalText) {
+              userDraftIndexRef.current = null;
+              return;
+            }
+            if (lastUserFinalRef.current === finalText) {
+              userDraftIndexRef.current = null;
+              return;
+            }
+            setMessages((prev) => {
+              const idx = userDraftIndexRef.current;
+              userDraftIndexRef.current = null;
+              if (idx !== null && prev[idx] && prev[idx].role === 'user') {
+                const next = [...prev];
+                next[idx] = { ...next[idx], text: finalText || next[idx].text };
+                lastUserFinalRef.current = finalText;
+                return next;
+              }
+              const last = prev[prev.length - 1];
+              if (last?.role === 'user') {
+                const next = [...prev];
+                next[next.length - 1] = { ...last, text: finalText };
+                lastUserFinalRef.current = finalText;
+                return next;
+              }
+              lastUserFinalRef.current = finalText;
+              return [...prev, { role: 'user', text: finalText }];
+            });
+            return;
+          }
+
+          if (type === 'assistant.response.delta') {
+            const delta = String(payload.text || '');
+            if (!delta) return;
+            const responseId = extractResponseId(payload);
+            if (responseId && interruptedResponseIdsRef.current.has(responseId)) {
+              noteInterruptedDrop(responseId, 'delta');
+              return;
+            }
+            setMessages((prev) => {
+              let idx = assistantDraftIndexRef.current;
+              if (idx === null || !prev[idx] || prev[idx].role !== 'model') {
+                // Tool records can be appended between assistant chunks; recover the
+                // latest model row instead of creating a duplicate assistant row.
+                for (let i = prev.length - 1; i >= 0; i -= 1) {
+                  if (prev[i]?.role === 'model') {
+                    if (
+                      responseId
+                      && prev[i].responseId
+                      && prev[i].responseId !== responseId
+                    ) {
+                      break;
+                    }
+                    idx = i;
+                    assistantDraftIndexRef.current = i;
                     break;
                   }
-                  idx = i;
-                  break;
+                  if (prev[i]?.role === 'user') break;
                 }
-                if (prev[i]?.role === 'user') break;
               }
-            }
-            if (idx !== null && prev[idx] && prev[idx].role === 'model') {
+              if (idx === null || !prev[idx] || prev[idx].role !== 'model') {
+                const last = prev[prev.length - 1];
+                if (last?.role === 'model' && last.text === delta) {
+                  return prev;
+                }
+                const nextMessage: DebugTranscriptMessage = { role: 'model' as const, text: delta };
+                if (responseId) {
+                  nextMessage.responseId = responseId;
+                  if (pendingTtfbByResponseIdRef.current.has(responseId)) {
+                    nextMessage.ttfbMs = pendingTtfbByResponseIdRef.current.get(responseId);
+                    pendingTtfbByResponseIdRef.current.delete(responseId);
+                  }
+                }
+                const next = [...prev, nextMessage];
+                assistantDraftIndexRef.current = next.length - 1;
+                if (responseId) {
+                  assistantResponseIndexByIdRef.current.set(responseId, next.length - 1);
+                }
+                return next;
+              }
               const next = [...prev];
-              const nextMessage = { ...next[idx], text: finalText || next[idx].text };
+              const nextMessage = { ...next[idx], text: next[idx].text + delta };
               if (responseId && !nextMessage.responseId) {
                 nextMessage.responseId = responseId;
               }
@@ -4088,569 +4025,615 @@ export const DebugDrawer: React.FC<{
                 assistantResponseIndexByIdRef.current.set(responseId, idx);
               }
               return next;
+            });
+            return;
+          }
+
+          if (type === 'assistant.response.final') {
+            const finalText = String(payload.text || '');
+            const responseId = extractResponseId(payload);
+            if (responseId && interruptedResponseIdsRef.current.has(responseId)) {
+              noteInterruptedDrop(responseId, 'final');
+              return;
             }
-            if (!finalText) return prev;
-            const last = prev[prev.length - 1];
-            if (last?.role === 'model') {
-              if (last.text === finalText) return prev;
-              if (finalText.startsWith(last.text) || last.text.startsWith(finalText)) {
+            setMessages((prev) => {
+              let idx = assistantDraftIndexRef.current;
+              assistantDraftIndexRef.current = null;
+              if (idx === null || !prev[idx] || prev[idx].role !== 'model') {
+                for (let i = prev.length - 1; i >= 0; i -= 1) {
+                  if (prev[i]?.role === 'model') {
+                    if (
+                      responseId
+                      && prev[i].responseId
+                      && prev[i].responseId !== responseId
+                    ) {
+                      break;
+                    }
+                    idx = i;
+                    break;
+                  }
+                  if (prev[i]?.role === 'user') break;
+                }
+              }
+              if (idx !== null && prev[idx] && prev[idx].role === 'model') {
                 const next = [...prev];
-                next[next.length - 1] = { ...last, text: finalText };
+                const nextMessage = { ...next[idx], text: finalText || next[idx].text };
+                if (responseId && !nextMessage.responseId) {
+                  nextMessage.responseId = responseId;
+                }
+                if (
+                  responseId
+                  && typeof nextMessage.ttfbMs !== 'number'
+                  && pendingTtfbByResponseIdRef.current.has(responseId)
+                ) {
+                  nextMessage.ttfbMs = pendingTtfbByResponseIdRef.current.get(responseId);
+                  pendingTtfbByResponseIdRef.current.delete(responseId);
+                }
+                next[idx] = nextMessage;
+                if (responseId) {
+                  assistantResponseIndexByIdRef.current.set(responseId, idx);
+                }
                 return next;
               }
-            }
-            const nextMessage: DebugTranscriptMessage = { role: 'model', text: finalText };
-            if (responseId) {
-              nextMessage.responseId = responseId;
-              if (pendingTtfbByResponseIdRef.current.has(responseId)) {
-                nextMessage.ttfbMs = pendingTtfbByResponseIdRef.current.get(responseId);
-                pendingTtfbByResponseIdRef.current.delete(responseId);
+              if (!finalText) return prev;
+              const last = prev[prev.length - 1];
+              if (last?.role === 'model') {
+                if (last.text === finalText) return prev;
+                if (finalText.startsWith(last.text) || last.text.startsWith(finalText)) {
+                  const next = [...prev];
+                  next[next.length - 1] = { ...last, text: finalText };
+                  return next;
+                }
               }
-            }
-            const next = [...prev, nextMessage];
-            if (responseId) {
-              assistantResponseIndexByIdRef.current.set(responseId, next.length - 1);
-            }
-            return next;
-          });
-          setIsLoading(false);
-          return;
-        }
+              const nextMessage: DebugTranscriptMessage = { role: 'model', text: finalText };
+              if (responseId) {
+                nextMessage.responseId = responseId;
+                if (pendingTtfbByResponseIdRef.current.has(responseId)) {
+                  nextMessage.ttfbMs = pendingTtfbByResponseIdRef.current.get(responseId);
+                  pendingTtfbByResponseIdRef.current.delete(responseId);
+                }
+              }
+              const next = [...prev, nextMessage];
+              if (responseId) {
+                assistantResponseIndexByIdRef.current.set(responseId, next.length - 1);
+              }
+              return next;
+            });
+            setIsLoading(false);
+            return;
+          }
 
-        if (type === 'error') {
-          const message = String(payload?.message || payload?.data?.error?.message || 'Unknown error');
+          if (type === 'error') {
+            const message = String(payload?.message || payload?.data?.error?.message || 'Unknown error');
+            setWsStatus('error');
+            setWsError(message);
+            setIsLoading(false);
+            const err = new Error(message);
+            pendingRejectRef.current?.(err);
+            pendingResolveRef.current = null;
+            pendingRejectRef.current = null;
+          }
+        };
+
+        ws.onerror = () => {
+          const err = new Error('WebSocket connection error');
           setWsStatus('error');
-          setWsError(message);
+          setWsError(err.message);
           setIsLoading(false);
-          const err = new Error(message);
           pendingRejectRef.current?.(err);
           pendingResolveRef.current = null;
           pendingRejectRef.current = null;
+        };
+
+        ws.onclose = () => {
+          wsReadyRef.current = false;
+          setTextSessionStarted(false);
+          userDraftIndexRef.current = null;
+          stopPlaybackImmediately();
+          if (wsStatusRef.current !== 'error') setWsStatus('disconnected');
+        };
+      });
+    };
+
+    useEffect(() => {
+      if (!isOpen) return;
+      if (!wsRef.current || wsRef.current.readyState !== WebSocket.OPEN) return;
+      // If core TTS-related settings changed while drawer stays open,
+      // reset the active WS session so the next launch uses new metadata.
+      closeWs();
+    }, [isOpen, assistant.id, assistant.voice, assistant.speed]);
+
+    useEffect(() => {
+      if (!textTtsEnabled) {
+        stopPlaybackImmediately();
+      }
+    }, [textTtsEnabled]);
+
+    useEffect(() => {
+      if (!isOpen || mode !== 'voice' || callStatus !== 'active') return;
+      const restartCapture = async () => {
+        try {
+          await startVoiceCapture();
+        } catch (e) {
+          console.error('Failed to restart voice capture with new 3A settings', e);
         }
       };
+      void restartCapture();
+    }, [aecEnabled, nsEnabled, agcEnabled, selectedMic, mode, callStatus, isOpen]);
 
-      ws.onerror = () => {
-        const err = new Error('WebSocket connection error');
-        setWsStatus('error');
-        setWsError(err.message);
-        setIsLoading(false);
-        pendingRejectRef.current?.(err);
-        pendingResolveRef.current = null;
-        pendingRejectRef.current = null;
-      };
+    useEffect(() => {
+      if (!isOpen) return;
+      setResolvedConfigView(
+        formatRuntimeConfigDebugView({
+          submittedSessionStartMetadata: submittedMetadataRef.current,
+        })
+      );
+    }, [isOpen, assistant, voices, llmModels, asrModels, tools]);
 
-      ws.onclose = () => {
-        wsReadyRef.current = false;
-        setTextSessionStarted(false);
-        userDraftIndexRef.current = null;
-        stopPlaybackImmediately();
-        if (wsStatusRef.current !== 'error') setWsStatus('disconnected');
-      };
-    });
-  };
-
-  useEffect(() => {
-    if (!isOpen) return;
-    if (!wsRef.current || wsRef.current.readyState !== WebSocket.OPEN) return;
-    // If core TTS-related settings changed while drawer stays open,
-    // reset the active WS session so the next launch uses new metadata.
-    closeWs();
-  }, [isOpen, assistant.id, assistant.voice, assistant.speed]);
-
-  useEffect(() => {
-    if (!textTtsEnabled) {
-      stopPlaybackImmediately();
-    }
-  }, [textTtsEnabled]);
-
-  useEffect(() => {
-    if (!isOpen || mode !== 'voice' || callStatus !== 'active') return;
-    const restartCapture = async () => {
-      try {
-        await startVoiceCapture();
-      } catch (e) {
-        console.error('Failed to restart voice capture with new 3A settings', e);
-      }
-    };
-    void restartCapture();
-  }, [aecEnabled, nsEnabled, agcEnabled, selectedMic, mode, callStatus, isOpen]);
-
-  useEffect(() => {
-    if (!isOpen) return;
-    setResolvedConfigView(
-      formatRuntimeConfigDebugView({
-        submittedSessionStartMetadata: submittedMetadataRef.current,
-      })
-    );
-  }, [isOpen, assistant, voices, llmModels, asrModels, tools]);
-
-  const renderLocalVideo = (isSmall: boolean) => (
+    const renderLocalVideo = (isSmall: boolean) => (
       <div className={`relative w-full h-full bg-black overflow-hidden ${isSmall ? 'rounded-lg border border-white/20 shadow-lg' : ''}`}>
-          <video ref={videoRef} autoPlay muted playsInline className="w-full h-full object-cover transform scale-x-[-1]" />
-          <div className="absolute top-2 left-2 bg-black/50 px-2 py-0.5 rounded text-[10px] text-white/80">Me</div>
+        <video ref={videoRef} autoPlay muted playsInline className="w-full h-full object-cover transform scale-x-[-1]" />
+        <div className="absolute top-2 left-2 bg-black/50 px-2 py-0.5 rounded text-[10px] text-white/80">Me</div>
       </div>
-  );
+    );
 
-  const renderRemoteVideo = (isSmall: boolean) => (
+    const renderRemoteVideo = (isSmall: boolean) => (
       <div className={`relative w-full h-full bg-slate-900 overflow-hidden flex flex-col items-center justify-center ${isSmall ? 'rounded-lg border border-white/20 shadow-lg' : ''}`}>
-           <div className="relative flex items-center justify-center">
-               <div className={`rounded-full bg-primary/20 animate-pulse ${isSmall ? 'w-16 h-16' : 'w-32 h-32'}`}></div>
-               <div className={`absolute rounded-full bg-primary flex items-center justify-center shadow-[0_0_30px_hsl(var(--primary))] ${isSmall ? 'w-12 h-12' : 'w-24 h-24'}`}>
-                   <Video className={`${isSmall ? 'w-6 h-6' : 'w-10 h-10'} text-primary-foreground`} />
-               </div>
-           </div>
-           {!isSmall && <div className="mt-4 font-mono text-primary animate-pulse text-sm">{assistant.name}</div>}
-      </div>
-  );
-
-  const settingsPanel = (
-    <div className="h-full border-r border-white/10 bg-background/95 backdrop-blur-md shadow-2xl p-3">
-      <div className="flex items-center justify-between mb-2">
-        <h3 className="text-xs font-black tracking-[0.15em] uppercase text-muted-foreground">调试设置</h3>
-        <Button size="icon" variant="ghost" className="h-7 w-7" onClick={() => setSettingsDrawerOpen(false)}>
-          <X className="h-3.5 w-3.5" />
-        </Button>
-      </div>
-
-      <div className="space-y-3">
-        <div className="space-y-1.5">
-          <label className="text-[10px] text-muted-foreground font-black tracking-widest uppercase block">WebSocket Endpoint</label>
-          <Input value={wsUrl} onChange={(e) => setWsUrl(e.target.value)} placeholder="ws://localhost:8000/ws" />
-        </div>
-        <div className="flex items-center justify-between gap-2">
-          <Badge variant="outline" className="text-xs">WS: {wsStatus}</Badge>
-          <Badge variant={textTtsEnabled ? 'outline' : 'secondary'} className="text-xs">
-            TTS: {textTtsEnabled ? 'ON' : 'OFF'}
-          </Badge>
-        </div>
-        <div className="rounded-md border border-white/10 bg-black/20 p-2 space-y-2">
-          <p className="text-[10px] uppercase tracking-widest text-muted-foreground">Audio 3A</p>
-          <label className="inline-flex items-center gap-2 text-xs text-muted-foreground">
-            <input type="checkbox" checked={aecEnabled} onChange={(e) => setAecEnabled(e.target.checked)} className="accent-primary" />
-            Echo Cancellation (AEC)
-          </label>
-          <label className="inline-flex items-center gap-2 text-xs text-muted-foreground">
-            <input type="checkbox" checked={nsEnabled} onChange={(e) => setNsEnabled(e.target.checked)} className="accent-primary" />
-            Noise Suppression (NS)
-          </label>
-          <label className="inline-flex items-center gap-2 text-xs text-muted-foreground">
-            <input type="checkbox" checked={agcEnabled} onChange={(e) => setAgcEnabled(e.target.checked)} className="accent-primary" />
-            Auto Gain Control (AGC)
-          </label>
-        </div>
-        <div className="rounded-md border border-white/10 bg-black/20 p-2 space-y-2">
-          <p className="text-[10px] uppercase tracking-widest text-muted-foreground">Client Tools</p>
-          <p className="text-[11px] text-muted-foreground">滑块控制调试会话内客户端工具是否启用。</p>
-          <div className="space-y-2">
-            {DEBUG_CLIENT_TOOLS.map((tool) => {
-              const enabled = isClientToolEnabled(tool.id);
-              return (
-                <div key={tool.id} className="flex items-center justify-between gap-3 rounded-md border border-white/10 bg-black/20 px-2 py-1.5">
-                  <div className="min-w-0">
-                    <div className="text-[11px] font-mono text-foreground truncate">{tool.name}</div>
-                    <div className="text-[10px] text-muted-foreground truncate">{tool.description}</div>
-                  </div>
-                  <Switch
-                    checked={enabled}
-                    onCheckedChange={(next) => setClientToolEnabled(tool.id, next)}
-                    title={enabled ? '点击关闭' : '点击开启'}
-                    aria-label={`${tool.name} ${enabled ? '开启' : '关闭'}`}
-                  />
-                </div>
-              );
-            })}
+        <div className="relative flex items-center justify-center">
+          <div className={`rounded-full bg-primary/20 animate-pulse ${isSmall ? 'w-16 h-16' : 'w-32 h-32'}`}></div>
+          <div className={`absolute rounded-full bg-primary flex items-center justify-center shadow-[0_0_30px_hsl(var(--primary))] ${isSmall ? 'w-12 h-12' : 'w-24 h-24'}`}>
+            <Video className={`${isSmall ? 'w-6 h-6' : 'w-10 h-10'} text-primary-foreground`} />
           </div>
         </div>
-        <div className="rounded-md border border-white/10 bg-black/20 p-2 space-y-2">
+        {!isSmall && <div className="mt-4 font-mono text-primary animate-pulse text-sm">{assistant.name}</div>}
+      </div>
+    );
+
+    const settingsPanel = (
+      <div className="h-full border-r border-white/10 bg-background/95 backdrop-blur-md shadow-2xl p-3">
+        <div className="flex items-center justify-between mb-2">
+          <h3 className="text-xs font-black tracking-[0.15em] uppercase text-muted-foreground">调试设置</h3>
+          <Button size="icon" variant="ghost" className="h-7 w-7" onClick={() => setSettingsDrawerOpen(false)}>
+            <X className="h-3.5 w-3.5" />
+          </Button>
+        </div>
+
+        <div className="space-y-3">
+          <div className="space-y-1.5">
+            <label className="text-[10px] text-muted-foreground font-black tracking-widest uppercase block">WebSocket Endpoint</label>
+            <Input value={wsUrl} onChange={(e) => setWsUrl(e.target.value)} placeholder="ws://localhost:8000/ws" />
+          </div>
           <div className="flex items-center justify-between gap-2">
-            <p className="text-[10px] uppercase tracking-widest text-muted-foreground">Dynamic Variables</p>
-            <div className="flex items-center gap-1.5">
-              <Button
-                size="sm"
-                variant="ghost"
-                className="h-6 px-2 text-[10px]"
-                onClick={importDynamicVariablesFromPlaceholders}
-                disabled={isDynamicVariablesLocked || requiredTemplateVariableKeys.length === 0 || dynamicVariables.length >= DYNAMIC_VARIABLE_MAX_ITEMS}
-                title={`Import keys from {{placeholder}} in prompt${assistant.generatedOpenerEnabled === true ? '' : '/opener'}`}
-              >
-                Import
-              </Button>
-              <Button
-                size="icon"
-                variant="ghost"
-                className="h-6 w-6"
-                onClick={addDynamicVariableRow}
-                disabled={isDynamicVariablesLocked || dynamicVariables.length >= DYNAMIC_VARIABLE_MAX_ITEMS}
-                title={isDynamicVariablesLocked ? 'Disable editing while session is active' : 'Add variable'}
-              >
-                <Plus className="h-3.5 w-3.5" />
-              </Button>
+            <Badge variant="outline" className="text-xs">WS: {wsStatus}</Badge>
+            <Badge variant={textTtsEnabled ? 'outline' : 'secondary'} className="text-xs">
+              TTS: {textTtsEnabled ? 'ON' : 'OFF'}
+            </Badge>
+          </div>
+          <div className="rounded-md border border-white/10 bg-black/20 p-2 space-y-2">
+            <p className="text-[10px] uppercase tracking-widest text-muted-foreground">Audio 3A</p>
+            <label className="inline-flex items-center gap-2 text-xs text-muted-foreground">
+              <input type="checkbox" checked={aecEnabled} onChange={(e) => setAecEnabled(e.target.checked)} className="accent-primary" />
+              Echo Cancellation (AEC)
+            </label>
+            <label className="inline-flex items-center gap-2 text-xs text-muted-foreground">
+              <input type="checkbox" checked={nsEnabled} onChange={(e) => setNsEnabled(e.target.checked)} className="accent-primary" />
+              Noise Suppression (NS)
+            </label>
+            <label className="inline-flex items-center gap-2 text-xs text-muted-foreground">
+              <input type="checkbox" checked={agcEnabled} onChange={(e) => setAgcEnabled(e.target.checked)} className="accent-primary" />
+              Auto Gain Control (AGC)
+            </label>
+          </div>
+          <div className="rounded-md border border-white/10 bg-black/20 p-2 space-y-2">
+            <p className="text-[10px] uppercase tracking-widest text-muted-foreground">Client Tools</p>
+            <p className="text-[11px] text-muted-foreground">滑块控制调试会话内客户端工具是否启用。</p>
+            <div className="space-y-2">
+              {DEBUG_CLIENT_TOOLS.map((tool) => {
+                const enabled = isClientToolEnabled(tool.id);
+                return (
+                  <div key={tool.id} className="flex items-center justify-between gap-3 rounded-md border border-white/10 bg-black/20 px-2 py-1.5">
+                    <div className="min-w-0">
+                      <div className="text-[11px] font-mono text-foreground truncate">{tool.name}</div>
+                      <div className="text-[10px] text-muted-foreground truncate">{tool.description}</div>
+                    </div>
+                    <Switch
+                      checked={enabled}
+                      onCheckedChange={(next) => setClientToolEnabled(tool.id, next)}
+                      title={enabled ? '点击关闭' : '点击开启'}
+                      aria-label={`${tool.name} ${enabled ? '开启' : '关闭'}`}
+                    />
+                  </div>
+                );
+              })}
             </div>
           </div>
-          <p className="text-[11px] text-muted-foreground">
-            Use placeholders like {'{{customer_name}}'} in prompt{assistant.generatedOpenerEnabled === true ? '' : '/opener'}.
-          </p>
-          <p className="text-[11px] text-muted-foreground">
-            Built-in system vars: {'{{system__time}}'}, {'{{system_utc}}'}, {'{{system_timezone}}'}.
-          </p>
-          {requiredTemplateVariableKeys.length > 0 && (
-            <p className="text-[11px] text-amber-300/90">
-              Required: {requiredTemplateVariableKeys.join(', ')}
-            </p>
-          )}
-          {missingRequiredDynamicVariableKeys.length > 0 && (
-            <p className="text-[11px] text-red-300/90">
-              Missing required dynamic variable: {missingRequiredDynamicVariableKeys.join(', ')}
-            </p>
-          )}
-          {dynamicVariablesError && (
-            <p className="text-[11px] text-red-300/90">
-              {dynamicVariablesError}
-            </p>
-          )}
-          {dynamicVariables.length === 0 ? (
-            <div className="text-[11px] text-muted-foreground/80 border border-dashed border-white/10 rounded-md px-2 py-2">
-              No variables added.
+          <div className="rounded-md border border-white/10 bg-black/20 p-2 space-y-2">
+            <div className="flex items-center justify-between gap-2">
+              <p className="text-[10px] uppercase tracking-widest text-muted-foreground">Dynamic Variables</p>
+              <div className="flex items-center gap-1.5">
+                <Button
+                  size="sm"
+                  variant="ghost"
+                  className="h-6 px-2 text-[10px]"
+                  onClick={importDynamicVariablesFromPlaceholders}
+                  disabled={isDynamicVariablesLocked || requiredTemplateVariableKeys.length === 0 || dynamicVariables.length >= DYNAMIC_VARIABLE_MAX_ITEMS}
+                  title={`Import keys from {{placeholder}} in prompt${assistant.generatedOpenerEnabled === true ? '' : '/opener'}`}
+                >
+                  Import
+                </Button>
+                <Button
+                  size="icon"
+                  variant="ghost"
+                  className="h-6 w-6"
+                  onClick={addDynamicVariableRow}
+                  disabled={isDynamicVariablesLocked || dynamicVariables.length >= DYNAMIC_VARIABLE_MAX_ITEMS}
+                  title={isDynamicVariablesLocked ? 'Disable editing while session is active' : 'Add variable'}
+                >
+                  <Plus className="h-3.5 w-3.5" />
+                </Button>
+              </div>
             </div>
-          ) : (
-            <div className="space-y-2 max-h-52 overflow-auto pr-1">
-              {dynamicVariables.map((row, index) => (
-                <div key={row.id} className="grid grid-cols-[1fr_1fr_auto] gap-2 items-center">
-                  <Input
-                    value={row.key}
-                    onChange={(e) => updateDynamicVariableRow(row.id, 'key', e.target.value)}
-                    placeholder={`key_${index + 1}`}
-                    disabled={isDynamicVariablesLocked}
-                    className="h-8 text-xs"
-                  />
-                  <Input
-                    value={row.value}
-                    onChange={(e) => updateDynamicVariableRow(row.id, 'value', e.target.value)}
-                    placeholder="value"
-                    disabled={isDynamicVariablesLocked}
-                    className="h-8 text-xs"
-                  />
-                  <Button
-                    size="icon"
-                    variant="ghost"
-                    className="h-8 w-8 text-muted-foreground hover:text-red-300"
-                    onClick={() => removeDynamicVariableRow(row.id)}
-                    disabled={isDynamicVariablesLocked}
-                    title="Remove variable"
-                  >
-                    <Trash2 className="h-3.5 w-3.5" />
-                  </Button>
-                </div>
-              ))}
-            </div>
-          )}
-          {isDynamicVariablesLocked && (
             <p className="text-[11px] text-muted-foreground">
-              Editing is locked while conversation is starting/active.
+              Use placeholders like {'{{customer_name}}'} in prompt{assistant.generatedOpenerEnabled === true ? '' : '/opener'}.
             </p>
-          )}
-        </div>
-        <div className="rounded-md border border-white/10 bg-black/30">
-          <button
-            className="w-full px-3 py-2 text-left text-xs text-muted-foreground hover:text-foreground flex items-center justify-between"
-            onClick={() => setCaptureConfigOpen((v) => !v)}
-          >
-            <span>Capture Config Echo</span>
-            <ChevronDown className={`h-3.5 w-3.5 transition-transform ${captureConfigOpen ? 'rotate-180' : ''}`} />
-          </button>
-          {captureConfigOpen && (
-            <pre className="px-3 pb-3 text-[11px] leading-5 text-cyan-100/90 whitespace-pre-wrap break-all max-h-64 overflow-auto">
-              {captureConfigView || 'Voice call not started yet.'}
-            </pre>
-          )}
-        </div>
-        {wsError && <p className="text-xs text-red-400">{wsError}</p>}
-
-        <div className="rounded-md border border-white/10 bg-black/30">
-          <button
-            className="w-full px-3 py-2 text-left text-xs text-muted-foreground hover:text-foreground flex items-center justify-between"
-            onClick={() => setResolvedConfigOpen((v) => !v)}
-          >
-            <span>Session Config Debug</span>
-            <ChevronDown className={`h-3.5 w-3.5 transition-transform ${resolvedConfigOpen ? 'rotate-180' : ''}`} />
-          </button>
-          {resolvedConfigOpen && (
-            <pre className="px-3 pb-3 text-[11px] leading-5 text-cyan-100/90 whitespace-pre-wrap break-all max-h-64 overflow-auto">
-              {resolvedConfigView || 'Preparing session.start metadata preview...'}
-            </pre>
-          )}
-        </div>
-      </div>
-    </div>
-  );
-
-  return (
-    <>
-    <Drawer isOpen={isOpen} onClose={() => { handleHangup(); onClose(); }} title={`调试: ${assistant.name}`} className="w-[90vw] sm:w-[85vw] max-w-none">
-      <div className="relative flex h-full min-h-0 overflow-hidden gap-6">
-        
-        {/* Left Column: Call Interface */}
-        <div className="flex-1 flex flex-col min-h-0 overflow-hidden">
-          <div className="flex items-center gap-2 mb-4 shrink-0">
-            <div className="flex-1 flex justify-center bg-white/5 p-1 rounded-lg">
-              {(['text', 'voice', 'video'] as const).map(m => (
-                <button key={m} className={`flex-1 py-1 text-sm rounded-md transition-all ${mode === m ? 'bg-primary text-primary-foreground shadow' : 'text-muted-foreground hover:bg-white/5'}`} onClick={() => setMode(m)}>
-                  {m === 'text' && <MessageSquare className="inline w-4 h-4 mr-1" />}
-                  {m === 'voice' && <Mic className="inline w-4 h-4 mr-1" />}
-                  {m === 'video' && <Video className="inline w-4 h-4 mr-1" />}
-                  {m === 'text' ? '文本' : m === 'voice' ? '语音' : '视频'}
-                </button>
-              ))}
-            </div>
-            <Button 
-              variant="outline" 
-              size="icon" 
-              className="h-[36px] w-[36px] shrink-0 bg-white/5 border-white/10 hover:bg-white/10 hover:text-primary transition-colors"
-              onClick={() => setSettingsDrawerOpen(true)}
-              title="调试设置"
-            >
-              <Wrench className="h-4 w-4" />
-            </Button>
-          </div>
-
-          <div className="flex-1 min-h-0 overflow-hidden flex flex-col">
-            <div className={`flex-1 overflow-hidden flex flex-col min-h-0 mb-4`}>
-              {mode === 'text' ? (
-                textSessionStarted ? (
-                  <div className="flex-1 flex flex-col items-center justify-center space-y-6 border border-white/5 rounded-xl bg-black/20 animate-in fade-in zoom-in-95 px-6">
-                    <div className="relative">
-                      <div className="absolute inset-0 bg-primary/20 rounded-full blur-2xl animate-pulse"></div>
-                      <div className="relative h-24 w-24 rounded-full bg-white/5 border border-white/10 flex items-center justify-center">
-                        <MessageSquare className="h-10 w-10 text-primary" />
-                      </div>
-                    </div>
-                    <div className="text-center">
-                      <h3 className="text-lg font-bold text-white mb-1">通话中</h3>
-                      <p className="text-xs text-muted-foreground">文本交互测试进行中</p>
-                    </div>
-                  </div>
-                ) : wsStatus === 'connecting' ? (
-                  <div className="flex-1 flex flex-col items-center justify-center space-y-6">
-                    <div className="h-24 w-24 rounded-full bg-primary/20 flex items-center justify-center animate-bounce">
-                      <MessageSquare className="h-10 w-10 text-primary" />
-                    </div>
-                    <div className="text-center">
-                      <p className="text-primary font-mono text-sm tracking-widest animate-pulse">CONNECTING...</p>
-                      <p className="text-xs text-muted-foreground mt-2">正在连接文本调试服务</p>
-                    </div>
-                    <Button onClick={closeWs} variant="destructive" className="rounded-full h-10 px-8">取消</Button>
-                  </div>
-                ) : (
-                  <div className="flex-1 flex flex-col items-center justify-center space-y-6 border border-white/5 rounded-xl bg-black/20 animate-in fade-in zoom-in-95 px-6">
-                    <div className="relative">
-                      <div className="absolute inset-0 bg-primary/20 rounded-full blur-2xl animate-pulse"></div>
-                      <div className="relative h-24 w-24 rounded-full bg-white/5 border border-white/10 flex items-center justify-center">
-                        <MessageSquare className="h-10 w-10 text-muted-foreground" />
-                      </div>
-                    </div>
-                    <div className="text-center">
-                      <h3 className="text-lg font-bold text-white mb-1">准备就绪</h3>
-                      <p className="text-xs text-muted-foreground">点击下方按钮开启人机交互测试</p>
-                    </div>
+            <p className="text-[11px] text-muted-foreground">
+              Built-in system vars: {'{{system__time}}'}, {'{{system_utc}}'}, {'{{system_timezone}}'}.
+            </p>
+            {requiredTemplateVariableKeys.length > 0 && (
+              <p className="text-[11px] text-amber-300/90">
+                Required: {requiredTemplateVariableKeys.join(', ')}
+              </p>
+            )}
+            {missingRequiredDynamicVariableKeys.length > 0 && (
+              <p className="text-[11px] text-red-300/90">
+                Missing required dynamic variable: {missingRequiredDynamicVariableKeys.join(', ')}
+              </p>
+            )}
+            {dynamicVariablesError && (
+              <p className="text-[11px] text-red-300/90">
+                {dynamicVariablesError}
+              </p>
+            )}
+            {dynamicVariables.length === 0 ? (
+              <div className="text-[11px] text-muted-foreground/80 border border-dashed border-white/10 rounded-md px-2 py-2">
+                No variables added.
+              </div>
+            ) : (
+              <div className="space-y-2 max-h-52 overflow-auto pr-1">
+                {dynamicVariables.map((row, index) => (
+                  <div key={row.id} className="grid grid-cols-[1fr_1fr_auto] gap-2 items-center">
+                    <Input
+                      value={row.key}
+                      onChange={(e) => updateDynamicVariableRow(row.id, 'key', e.target.value)}
+                      placeholder={`key_${index + 1}`}
+                      disabled={isDynamicVariablesLocked}
+                      className="h-8 text-xs"
+                    />
+                    <Input
+                      value={row.value}
+                      onChange={(e) => updateDynamicVariableRow(row.id, 'value', e.target.value)}
+                      placeholder="value"
+                      disabled={isDynamicVariablesLocked}
+                      className="h-8 text-xs"
+                    />
                     <Button
-                      onClick={handleTextLaunch}
-                      disabled={wsStatus === 'connecting'}
-                      className="w-48 h-12 rounded-full bg-green-500 hover:bg-green-600 shadow-[0_0_20px_rgba(34,197,94,0.4)] text-base font-bold"
+                      size="icon"
+                      variant="ghost"
+                      className="h-8 w-8 text-muted-foreground hover:text-red-300"
+                      onClick={() => removeDynamicVariableRow(row.id)}
+                      disabled={isDynamicVariablesLocked}
+                      title="Remove variable"
                     >
-                      <PhoneCall className="mr-2 h-5 w-5" /> 发起呼叫
+                      <Trash2 className="h-3.5 w-3.5" />
                     </Button>
                   </div>
-                )
-              ) : callStatus === 'idle' ? (
-                <div className="flex-1 flex flex-col items-center justify-center space-y-6 border border-white/5 rounded-xl bg-black/20 animate-in fade-in zoom-in-95">
-                  <div className="relative">
-                    <div className="absolute inset-0 bg-primary/20 rounded-full blur-2xl animate-pulse"></div>
-                    <div className="relative h-24 w-24 rounded-full bg-white/5 border border-white/10 flex items-center justify-center">
-                      {mode === 'voice' ? <Mic className="h-10 w-10 text-muted-foreground" /> : <Video className="h-10 w-10 text-muted-foreground" />}
-                    </div>
-                  </div>
-                  <div className="text-center">
-                    <h3 className="text-lg font-bold text-white mb-1">准备就绪</h3>
-                    <p className="text-xs text-muted-foreground">点击下方按钮开启人机交互测试</p>
-                  </div>
-                  <Button onClick={handleCall} className="w-48 h-12 rounded-full bg-green-500 hover:bg-green-600 shadow-[0_0_20px_rgba(34,197,94,0.4)] text-base font-bold">
-                    <PhoneCall className="mr-2 h-5 w-5" /> 发起呼叫
-                  </Button>
+                ))}
+              </div>
+            )}
+            {isDynamicVariablesLocked && (
+              <p className="text-[11px] text-muted-foreground">
+                Editing is locked while conversation is starting/active.
+              </p>
+            )}
+          </div>
+          <div className="rounded-md border border-white/10 bg-black/30">
+            <button
+              className="w-full px-3 py-2 text-left text-xs text-muted-foreground hover:text-foreground flex items-center justify-between"
+              onClick={() => setCaptureConfigOpen((v) => !v)}
+            >
+              <span>Capture Config Echo</span>
+              <ChevronDown className={`h-3.5 w-3.5 transition-transform ${captureConfigOpen ? 'rotate-180' : ''}`} />
+            </button>
+            {captureConfigOpen && (
+              <pre className="px-3 pb-3 text-[11px] leading-5 text-cyan-100/90 whitespace-pre-wrap break-all max-h-64 overflow-auto">
+                {captureConfigView || 'Voice call not started yet.'}
+              </pre>
+            )}
+          </div>
+          {wsError && <p className="text-xs text-red-400">{wsError}</p>}
+
+          <div className="rounded-md border border-white/10 bg-black/30">
+            <button
+              className="w-full px-3 py-2 text-left text-xs text-muted-foreground hover:text-foreground flex items-center justify-between"
+              onClick={() => setResolvedConfigOpen((v) => !v)}
+            >
+              <span>Session Config Debug</span>
+              <ChevronDown className={`h-3.5 w-3.5 transition-transform ${resolvedConfigOpen ? 'rotate-180' : ''}`} />
+            </button>
+            {resolvedConfigOpen && (
+              <pre className="px-3 pb-3 text-[11px] leading-5 text-cyan-100/90 whitespace-pre-wrap break-all max-h-64 overflow-auto">
+                {resolvedConfigView || 'Preparing session.start metadata preview...'}
+              </pre>
+            )}
+          </div>
+        </div>
+      </div>
+    );
+
+    return (
+      <>
+        <Drawer isOpen={isOpen} onClose={() => { handleHangup(); onClose(); }} title={`调试: ${assistant.name}`} className="!w-[90vw] sm:!w-[85vw] !max-w-none">
+          <div className="relative flex h-full min-h-0 overflow-hidden gap-6">
+
+            {/* Left Column: Call Interface */}
+            <div className="flex-1 flex flex-col min-h-0 overflow-hidden">
+              <div className="flex items-center gap-2 mb-4 shrink-0">
+                <div className="flex-1 flex justify-center bg-white/5 p-1 rounded-lg">
+                  {(['text', 'voice', 'video'] as const).map(m => (
+                    <button key={m} className={`flex-1 py-1 text-sm rounded-md transition-all ${mode === m ? 'bg-primary text-primary-foreground shadow' : 'text-muted-foreground hover:bg-white/5'}`} onClick={() => setMode(m)}>
+                      {m === 'text' && <MessageSquare className="inline w-4 h-4 mr-1" />}
+                      {m === 'voice' && <Mic className="inline w-4 h-4 mr-1" />}
+                      {m === 'video' && <Video className="inline w-4 h-4 mr-1" />}
+                      {m === 'text' ? '文本' : m === 'voice' ? '语音' : '视频'}
+                    </button>
+                  ))}
                 </div>
-              ) : callStatus === 'calling' ? (
-                mode === 'voice' ? (
-                  <div className="flex-1 flex flex-col items-center justify-center space-y-6">
-                    <div className="h-24 w-24 rounded-full bg-primary/20 flex items-center justify-center animate-bounce">
-                      <Mic className="h-10 w-10 text-primary" />
+                <Button
+                  variant="outline"
+                  size="icon"
+                  className="h-[36px] w-[36px] shrink-0 bg-white/5 border-white/10 hover:bg-white/10 hover:text-primary transition-colors"
+                  onClick={() => setSettingsDrawerOpen(true)}
+                  title="调试设置"
+                >
+                  <Wrench className="h-4 w-4" />
+                </Button>
+              </div>
+
+              <div className="flex-1 min-h-0 overflow-hidden flex flex-col">
+                <div className={`flex-1 overflow-hidden flex flex-col min-h-0 mb-4`}>
+                  {mode === 'text' ? (
+                    textSessionStarted ? (
+                      <div className="flex-1 flex flex-col items-center justify-center space-y-6 border border-white/5 rounded-xl bg-black/20 animate-in fade-in zoom-in-95 px-6">
+                        <div className="relative">
+                          <div className="absolute inset-0 bg-primary/20 rounded-full blur-2xl animate-pulse"></div>
+                          <div className="relative h-24 w-24 rounded-full bg-white/5 border border-white/10 flex items-center justify-center">
+                            <MessageSquare className="h-10 w-10 text-primary" />
+                          </div>
+                        </div>
+                        <div className="text-center">
+                          <h3 className="text-lg font-bold text-white mb-1">通话中</h3>
+                          <p className="text-xs text-muted-foreground">文本交互测试进行中</p>
+                        </div>
+                      </div>
+                    ) : wsStatus === 'connecting' ? (
+                      <div className="flex-1 flex flex-col items-center justify-center space-y-6">
+                        <div className="h-24 w-24 rounded-full bg-primary/20 flex items-center justify-center animate-bounce">
+                          <MessageSquare className="h-10 w-10 text-primary" />
+                        </div>
+                        <div className="text-center">
+                          <p className="text-primary font-mono text-sm tracking-widest animate-pulse">CONNECTING...</p>
+                          <p className="text-xs text-muted-foreground mt-2">正在连接文本调试服务</p>
+                        </div>
+                        <Button onClick={closeWs} variant="destructive" className="rounded-full h-10 px-8">取消</Button>
+                      </div>
+                    ) : (
+                      <div className="flex-1 flex flex-col items-center justify-center space-y-6 border border-white/5 rounded-xl bg-black/20 animate-in fade-in zoom-in-95 px-6">
+                        <div className="relative">
+                          <div className="absolute inset-0 bg-primary/20 rounded-full blur-2xl animate-pulse"></div>
+                          <div className="relative h-24 w-24 rounded-full bg-white/5 border border-white/10 flex items-center justify-center">
+                            <MessageSquare className="h-10 w-10 text-muted-foreground" />
+                          </div>
+                        </div>
+                        <div className="text-center">
+                          <h3 className="text-lg font-bold text-white mb-1">准备就绪</h3>
+                          <p className="text-xs text-muted-foreground">点击下方按钮开启人机交互测试</p>
+                        </div>
+                        <Button
+                          onClick={handleTextLaunch}
+                          disabled={wsStatus === 'connecting'}
+                          className="w-48 h-12 rounded-full bg-green-500 hover:bg-green-600 shadow-[0_0_20px_rgba(34,197,94,0.4)] text-base font-bold"
+                        >
+                          <PhoneCall className="mr-2 h-5 w-5" /> 发起呼叫
+                        </Button>
+                      </div>
+                    )
+                  ) : callStatus === 'idle' ? (
+                    <div className="flex-1 flex flex-col items-center justify-center space-y-6 border border-white/5 rounded-xl bg-black/20 animate-in fade-in zoom-in-95">
+                      <div className="relative">
+                        <div className="absolute inset-0 bg-primary/20 rounded-full blur-2xl animate-pulse"></div>
+                        <div className="relative h-24 w-24 rounded-full bg-white/5 border border-white/10 flex items-center justify-center">
+                          {mode === 'voice' ? <Mic className="h-10 w-10 text-muted-foreground" /> : <Video className="h-10 w-10 text-muted-foreground" />}
+                        </div>
+                      </div>
+                      <div className="text-center">
+                        <h3 className="text-lg font-bold text-white mb-1">准备就绪</h3>
+                        <p className="text-xs text-muted-foreground">点击下方按钮开启人机交互测试</p>
+                      </div>
+                      <Button onClick={handleCall} className="w-48 h-12 rounded-full bg-green-500 hover:bg-green-600 shadow-[0_0_20px_rgba(34,197,94,0.4)] text-base font-bold">
+                        <PhoneCall className="mr-2 h-5 w-5" /> 发起呼叫
+                      </Button>
                     </div>
-                    <div className="text-center">
-                      <p className="text-primary font-mono text-sm tracking-widest animate-pulse">CONNECTING...</p>
-                      <p className="text-xs text-muted-foreground mt-2">正在连接语音调试服务</p>
-                    </div>
-                    <Button onClick={handleHangup} variant="destructive" className="rounded-full h-10 px-8">取消</Button>
-                  </div>
-                ) : (
-                  <div className="flex-1 flex flex-col items-center justify-center space-y-6">
-                    <div className="h-24 w-24 rounded-full bg-primary/20 flex items-center justify-center animate-bounce">
-                      <PhoneCall className="h-10 w-10 text-primary" />
-                    </div>
-                    <div className="text-center">
-                      <p className="text-primary font-mono text-sm tracking-widest animate-pulse">CALLING...</p>
-                      <p className="text-xs text-muted-foreground mt-2">正在连接 AI 服务</p>
-                    </div>
-                    <Button onClick={handleHangup} variant="destructive" className="rounded-full h-10 px-8">取消</Button>
-                  </div>
-                )
-              ) : (
-                <div className="flex-1 flex flex-col min-h-0 space-y-4">
-                  {mode === 'voice' ? (
-                     <div className="flex-1 flex flex-col items-center justify-center space-y-6 border border-white/5 rounded-xl bg-black/20 animate-in fade-in px-6 relative overflow-hidden">
-                        <div className="absolute inset-0 bg-primary/5 rounded-full blur-3xl animate-pulse"></div>
-                        <div className="relative z-10">
+                  ) : callStatus === 'calling' ? (
+                    mode === 'voice' ? (
+                      <div className="flex-1 flex flex-col items-center justify-center space-y-6">
+                        <div className="h-24 w-24 rounded-full bg-primary/20 flex items-center justify-center animate-bounce">
+                          <Mic className="h-10 w-10 text-primary" />
+                        </div>
+                        <div className="text-center">
+                          <p className="text-primary font-mono text-sm tracking-widest animate-pulse">CONNECTING...</p>
+                          <p className="text-xs text-muted-foreground mt-2">正在连接语音调试服务</p>
+                        </div>
+                        <Button onClick={handleHangup} variant="destructive" className="rounded-full h-10 px-8">取消</Button>
+                      </div>
+                    ) : (
+                      <div className="flex-1 flex flex-col items-center justify-center space-y-6">
+                        <div className="h-24 w-24 rounded-full bg-primary/20 flex items-center justify-center animate-bounce">
+                          <PhoneCall className="h-10 w-10 text-primary" />
+                        </div>
+                        <div className="text-center">
+                          <p className="text-primary font-mono text-sm tracking-widest animate-pulse">CALLING...</p>
+                          <p className="text-xs text-muted-foreground mt-2">正在连接 AI 服务</p>
+                        </div>
+                        <Button onClick={handleHangup} variant="destructive" className="rounded-full h-10 px-8">取消</Button>
+                      </div>
+                    )
+                  ) : (
+                    <div className="flex-1 flex flex-col min-h-0 space-y-4">
+                      {mode === 'voice' ? (
+                        <div className="flex-1 flex flex-col items-center justify-center space-y-6 border border-white/5 rounded-xl bg-black/20 animate-in fade-in px-6 relative overflow-hidden">
+                          <div className="absolute inset-0 bg-primary/5 rounded-full blur-3xl animate-pulse"></div>
+                          <div className="relative z-10">
                             <div className="relative">
                               <div className="absolute inset-0 bg-primary/20 rounded-full blur-2xl animate-pulse"></div>
                               <div className="relative h-32 w-32 rounded-full bg-card border border-white/10 flex items-center justify-center shadow-2xl">
-                                  <Mic className="h-12 w-12 text-primary" />
+                                <Mic className="h-12 w-12 text-primary" />
                               </div>
                             </div>
-                        </div>
-                        <div className="text-center z-10">
+                          </div>
+                          <div className="text-center z-10">
                             <h3 className="text-xl font-bold text-white mb-2 tracking-tight">
                               {agentState === 'thinking' ? '思考中...' :
-                               agentState === 'speaking' ? '正在回复...' :
-                               '正在倾听...'}
+                                agentState === 'speaking' ? '正在回复...' :
+                                  '正在倾听...'}
                             </h3>
                             <div className="flex items-center justify-center gap-2">
-                                <span className="relative flex h-2.5 w-2.5">
-                                  <span className={`animate-ping absolute inline-flex h-full w-full rounded-full opacity-75 ${
-                                    agentState === 'thinking' ? 'bg-yellow-400' :
-                                    agentState === 'speaking' ? 'bg-green-400' :
+                              <span className="relative flex h-2.5 w-2.5">
+                                <span className={`animate-ping absolute inline-flex h-full w-full rounded-full opacity-75 ${agentState === 'thinking' ? 'bg-yellow-400' :
+                                  agentState === 'speaking' ? 'bg-green-400' :
                                     'bg-blue-400'
                                   }`}></span>
-                                  <span className={`relative inline-flex rounded-full h-2.5 w-2.5 ${
-                                    agentState === 'thinking' ? 'bg-yellow-500' :
-                                    agentState === 'speaking' ? 'bg-green-500' :
+                                <span className={`relative inline-flex rounded-full h-2.5 w-2.5 ${agentState === 'thinking' ? 'bg-yellow-500' :
+                                  agentState === 'speaking' ? 'bg-green-500' :
                                     'bg-blue-500'
                                   }`}></span>
-                                </span>
-                                <p className={`text-sm font-medium ${
-                                    agentState === 'thinking' ? 'text-yellow-400' :
-                                    agentState === 'speaking' ? 'text-green-400' :
-                                    'text-blue-400'
+                              </span>
+                              <p className={`text-sm font-medium ${agentState === 'thinking' ? 'text-yellow-400' :
+                                agentState === 'speaking' ? 'text-green-400' :
+                                  'text-blue-400'
                                 }`}>
-                                  {agentState === 'thinking' ? 'Thinking' :
-                                   agentState === 'speaking' ? 'Speaking' :
-                                   'Listening'}
-                                </p>
+                                {agentState === 'thinking' ? 'Thinking' :
+                                  agentState === 'speaking' ? 'Speaking' :
+                                    'Listening'}
+                              </p>
                             </div>
+                          </div>
                         </div>
-                     </div>
-                  ) : (
-                    <div className="flex flex-col h-full min-h-0 space-y-3 animate-in fade-in">
-                      <div className="flex gap-2 shrink-0">
-                        <select className="flex-1 text-xs rounded-md border border-white/10 bg-white/5 px-3 py-2 text-foreground appearance-none cursor-pointer focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-primary/50 transition-colors hover:bg-white/10 [&>option]:bg-card [&>option]:text-foreground" value={selectedCamera} onChange={e => setSelectedCamera(e.target.value)}>
-                          {devices.filter(d => d.kind === 'videoinput').map(d => <option key={d.deviceId} value={d.deviceId}>{d.label || 'Camera'}</option>)}
-                        </select>
-                        <select className="flex-1 text-xs rounded-md border border-white/10 bg-white/5 px-3 py-2 text-foreground appearance-none cursor-pointer focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-primary/50 transition-colors hover:bg-white/10 [&>option]:bg-card [&>option]:text-foreground" value={selectedMic} onChange={e => setSelectedMic(e.target.value)}>
-                          {devices.filter(d => d.kind === 'audioinput').map(d => <option key={d.deviceId} value={d.deviceId}>{d.label || 'Mic'}</option>)}
-                        </select>
-                      </div>
-                      <div className="flex-1 flex items-center justify-center relative rounded-xl overflow-hidden border border-white/10 bg-black min-h-0 shadow-inner">
-                        <div className="absolute inset-0 object-cover">{isSwapped ? renderLocalVideo(false) : renderRemoteVideo(false)}</div>
-                        <div className="absolute bottom-4 right-4 w-32 h-44 z-10 rounded-lg overflow-hidden border border-white/20 shadow-2xl transition-transform hover:scale-[1.02]">{isSwapped ? renderRemoteVideo(true) : renderLocalVideo(true)}</div>
-                        <button className="absolute top-4 right-4 z-20 h-10 w-10 rounded-full bg-black/50 backdrop-blur-md flex items-center justify-center text-white border border-white/10 hover:bg-primary/80 transition-all hover:scale-110 shadow-lg" onClick={() => setIsSwapped(!isSwapped)} title="切换视图"><ArrowLeftRight className="h-4 w-4" /></button>
-                      </div>
+                      ) : (
+                        <div className="flex flex-col h-full min-h-0 space-y-3 animate-in fade-in">
+                          <div className="flex gap-2 shrink-0">
+                            <select className="flex-1 text-xs rounded-md border border-white/10 bg-white/5 px-3 py-2 text-foreground appearance-none cursor-pointer focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-primary/50 transition-colors hover:bg-white/10 [&>option]:bg-card [&>option]:text-foreground" value={selectedCamera} onChange={e => setSelectedCamera(e.target.value)}>
+                              {devices.filter(d => d.kind === 'videoinput').map(d => <option key={d.deviceId} value={d.deviceId}>{d.label || 'Camera'}</option>)}
+                            </select>
+                            <select className="flex-1 text-xs rounded-md border border-white/10 bg-white/5 px-3 py-2 text-foreground appearance-none cursor-pointer focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-primary/50 transition-colors hover:bg-white/10 [&>option]:bg-card [&>option]:text-foreground" value={selectedMic} onChange={e => setSelectedMic(e.target.value)}>
+                              {devices.filter(d => d.kind === 'audioinput').map(d => <option key={d.deviceId} value={d.deviceId}>{d.label || 'Mic'}</option>)}
+                            </select>
+                          </div>
+                          <div className="flex-1 flex items-center justify-center relative rounded-xl overflow-hidden border border-white/10 bg-black min-h-0 shadow-inner">
+                            <div className="absolute inset-0 object-cover">{isSwapped ? renderLocalVideo(false) : renderRemoteVideo(false)}</div>
+                            <div className="absolute bottom-4 right-4 w-32 h-44 z-10 rounded-lg overflow-hidden border border-white/20 shadow-2xl transition-transform hover:scale-[1.02]">{isSwapped ? renderRemoteVideo(true) : renderLocalVideo(true)}</div>
+                            <button className="absolute top-4 right-4 z-20 h-10 w-10 rounded-full bg-black/50 backdrop-blur-md flex items-center justify-center text-white border border-white/10 hover:bg-primary/80 transition-all hover:scale-110 shadow-lg" onClick={() => setIsSwapped(!isSwapped)} title="切换视图"><ArrowLeftRight className="h-4 w-4" /></button>
+                          </div>
+                        </div>
+                      )}
                     </div>
                   )}
                 </div>
-              )}
+
+                {/* Hangup / Mic Select area (Left Column Bottom) */}
+                <div className={'shrink-0 space-y-3 mt-auto px-1 mb-1'}>
+                  {mode === 'voice' && callStatus === 'active' && (
+                    <div className="w-full flex items-center gap-2 pb-2">
+                      <span className="text-xs font-medium text-muted-foreground shrink-0 uppercase tracking-wider">麦克风</span>
+                      <select
+                        className="flex-1 text-xs rounded-md border border-white/10 bg-white/5 px-3 py-1.5 text-foreground appearance-none cursor-pointer focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-primary/50 transition-colors hover:bg-white/10 [&>option]:bg-card [&>option]:text-foreground"
+                        value={selectedMic}
+                        onChange={(e) => setSelectedMic(e.target.value)}
+                      >
+                        {devices.filter(d => d.kind === 'audioinput').map(d => (
+                          <option key={d.deviceId} value={d.deviceId}>{d.label || 'Mic'}</option>
+                        ))}
+                      </select>
+                    </div>
+                  )}
+                  <div className="w-full flex justify-center items-center">
+                    {mode === 'text' && textSessionStarted && (
+                      <Button
+                        variant="destructive"
+                        size="lg"
+                        className="w-full font-bold shadow-lg shadow-destructive/20 hover:shadow-destructive/40 transition-all"
+                        onClick={closeWs}
+                      >
+                        <PhoneOff className="h-5 w-5 mr-2" />
+                        结束测试
+                      </Button>
+                    )}
+                    {mode !== 'text' && callStatus === 'active' && (
+                      <Button
+                        variant="destructive"
+                        size="lg"
+                        className="w-full font-bold shadow-lg shadow-destructive/20 hover:shadow-destructive/40 transition-all"
+                        onClick={handleHangup}
+                      >
+                        <PhoneOff className="h-5 w-5 mr-2" />
+                        结束通话
+                      </Button>
+                    )}
+                  </div>
+                </div>
+              </div>
             </div>
 
-            {/* Hangup / Mic Select area (Left Column Bottom) */}
-            <div className={'shrink-0 space-y-3 mt-auto px-1 mb-1'}>
-              {mode === 'voice' && callStatus === 'active' && (
-                <div className="w-full flex items-center gap-2 pb-2">
-                  <span className="text-xs font-medium text-muted-foreground shrink-0 uppercase tracking-wider">麦克风</span>
-                  <select
-                    className="flex-1 text-xs rounded-md border border-white/10 bg-white/5 px-3 py-1.5 text-foreground appearance-none cursor-pointer focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-primary/50 transition-colors hover:bg-white/10 [&>option]:bg-card [&>option]:text-foreground"
-                    value={selectedMic}
-                    onChange={(e) => setSelectedMic(e.target.value)}
-                  >
-                    {devices.filter(d => d.kind === 'audioinput').map(d => (
-                      <option key={d.deviceId} value={d.deviceId}>{d.label || 'Mic'}</option>
-                    ))}
-                  </select>
+            {/* Right Column: Transcript */}
+            <div className="w-[380px] lg:w-[450px] shrink-0 border-l border-white/10 pl-6 flex flex-col min-h-0 h-full">
+              <div className="flex items-center gap-2 mb-4 shrink-0 px-1">
+                <MessageSquare className="h-4 w-4 text-primary" />
+                <h3 className="font-semibold text-foreground tracking-tight">Transcript</h3>
+              </div>
+
+              <div className="flex-1 min-h-0 overflow-hidden flex flex-col bg-card/30 rounded-xl border border-white/5 p-2 mb-4">
+                <div className="flex-1 min-h-0 overflow-y-auto pr-1 custom-scrollbar">
+                  {(messages.length === 0 && !isLoading) ? (
+                    <div className="h-full flex flex-col items-center justify-center text-muted-foreground/60 space-y-3">
+                      <MessageSquare className="h-8 w-8 opacity-20" />
+                      <p className="text-xs">暂无对话记录</p>
+                    </div>
+                  ) : (
+                    <TranscriptionLog scrollRef={scrollRef} messages={messages} isLoading={isLoading} className="pb-4" />
+                  )}
                 </div>
-              )}
-              <div className="w-full flex justify-center items-center">
-                 {mode === 'text' && textSessionStarted && (
-                   <Button
-                     variant="destructive"
-                     size="lg"
-                     className="w-full font-bold shadow-lg shadow-destructive/20 hover:shadow-destructive/40 transition-all"
-                     onClick={closeWs}
-                   >
-                     <PhoneOff className="h-5 w-5 mr-2" />
-                     结束测试
-                   </Button>
-                 )}
-                 {mode !== 'text' && callStatus === 'active' && (
-                   <Button
-                     variant="destructive"
-                     size="lg"
-                     className="w-full font-bold shadow-lg shadow-destructive/20 hover:shadow-destructive/40 transition-all"
-                     onClick={handleHangup}
-                   >
-                     <PhoneOff className="h-5 w-5 mr-2" />
-                     结束通话
-                   </Button>
-                 )}
+              </div>
+
+              {/* Input bar */}
+              <div className="shrink-0 flex items-center gap-2 mt-auto p-1 bg-card/50 rounded-lg border border-white/10 shadow-sm focus-within:border-primary/40 focus-within:ring-1 focus-within:ring-primary/20 transition-all">
+                <Input
+                  value={inputText}
+                  onChange={e => setInputText(e.target.value)}
+                  placeholder={mode === 'text' && !textSessionStarted ? "请先发起呼叫后输入消息..." : (mode === 'text' ? "输入消息..." : "输入文本模拟交互...")}
+                  onKeyDown={e => e.key === 'Enter' && handleSend()}
+                  disabled={mode === 'text' ? !textSessionStarted : (isLoading || callStatus !== 'active')}
+                  className="flex-1 min-w-0 border-0 bg-transparent focus-visible:ring-0 shadow-none px-3"
+                />
+                <Button
+                  size="icon"
+                  className="h-8 w-8 shrink-0 rounded-md bg-primary/90 hover:bg-primary shadow-sm mr-1"
+                  onClick={handleSend}
+                  disabled={mode === 'text' ? !textSessionStarted : (isLoading || callStatus !== 'active')}
+                >
+                  <Send className="h-3.5 w-3.5" />
+                </Button>
               </div>
             </div>
           </div>
-        </div>
-
-        {/* Right Column: Transcript */}
-        <div className="w-[380px] lg:w-[450px] shrink-0 border-l border-white/10 pl-6 flex flex-col min-h-0 h-full">
-           <div className="flex items-center gap-2 mb-4 shrink-0 px-1">
-              <MessageSquare className="h-4 w-4 text-primary" />
-              <h3 className="font-semibold text-foreground tracking-tight">Transcript</h3>
-           </div>
-           
-           <div className="flex-1 min-h-0 overflow-hidden flex flex-col bg-card/30 rounded-xl border border-white/5 p-2 mb-4">
-             <div className="flex-1 min-h-0 overflow-y-auto pr-1 custom-scrollbar">
-                {(messages.length === 0 && !isLoading) ? (
-                   <div className="h-full flex flex-col items-center justify-center text-muted-foreground/60 space-y-3">
-                      <MessageSquare className="h-8 w-8 opacity-20" />
-                      <p className="text-xs">暂无对话记录</p>
-                   </div>
-                ) : (
-                   <TranscriptionLog scrollRef={scrollRef} messages={messages} isLoading={isLoading} className="pb-4" />
-                )}
-             </div>
-           </div>
-
-           {/* Input bar */}
-           <div className="shrink-0 flex items-center gap-2 mt-auto p-1 bg-card/50 rounded-lg border border-white/10 shadow-sm focus-within:border-primary/40 focus-within:ring-1 focus-within:ring-primary/20 transition-all">
-             <Input
-               value={inputText}
-               onChange={e => setInputText(e.target.value)}
-               placeholder={mode === 'text' && !textSessionStarted ? "请先发起呼叫后输入消息..." : (mode === 'text' ? "输入消息..." : "输入文本模拟交互...")}
-               onKeyDown={e => e.key === 'Enter' && handleSend()}
-               disabled={mode === 'text' ? !textSessionStarted : (isLoading || callStatus !== 'active')}
-               className="flex-1 min-w-0 border-0 bg-transparent focus-visible:ring-0 shadow-none px-3"
-             />
-             <Button
-               size="icon"
-               className="h-8 w-8 shrink-0 rounded-md bg-primary/90 hover:bg-primary shadow-sm mr-1"
-               onClick={handleSend}
-               disabled={mode === 'text' ? !textSessionStarted : (isLoading || callStatus !== 'active')}
-             >
-               <Send className="h-3.5 w-3.5" />
-             </Button>
-           </div>
-        </div>
-      </div>
           {textPromptDialog.open && (
             <div className="absolute inset-0 z-40 flex items-center justify-center bg-black/55 backdrop-blur-[1px]">
               <div className="relative w-[92%] max-w-md rounded-xl border border-white/15 bg-card/95 p-4 shadow-2xl animate-in zoom-in-95 duration-200">
@@ -4722,19 +4705,17 @@ export const DebugDrawer: React.FC<{
               </div>
             </div>
           )}
-    </Drawer>
-      {isOpen && (
-        <Dialog 
-          isOpen={settingsDrawerOpen} 
-          onClose={() => setSettingsDrawerOpen(false)} 
-          title="调试设置"
-          contentClassName="max-w-[90vw] md:max-w-[70vw] lg:max-w-2xl h-[85vh] flex flex-col"
-        >
-          <div className="flex-1 min-h-0 overflow-y-auto">
+        </Drawer>
+        {isOpen && (
+          <Dialog
+            isOpen={settingsDrawerOpen}
+            onClose={() => setSettingsDrawerOpen(false)}
+            title="调试设置"
+            contentClassName="max-w-[90vw] md:max-w-[70vw] lg:max-w-2xl"
+          >
             {settingsPanel}
-          </div>
-        </Dialog>
-      )}
-    </>
-  );
-};
+          </Dialog>
+        )}
+      </>
+    );
+  };
diff --git a/web/vite.config.ts b/web/vite.config.ts
index ee5fb8d..9c52977 100644
--- a/web/vite.config.ts
+++ b/web/vite.config.ts
@@ -1,23 +1,24 @@
 import path from 'path';
 import { defineConfig, loadEnv } from 'vite';
 import react from '@vitejs/plugin-react';
+import tailwindcss from '@tailwindcss/vite';
 
 export default defineConfig(({ mode }) => {
-    const env = loadEnv(mode, '.', '');
-    return {
-      server: {
-        port: 3000,
-        host: '0.0.0.0',
-      },
-      plugins: [react()],
-      define: {
-        'process.env.API_KEY': JSON.stringify(env.GEMINI_API_KEY),
-        'process.env.GEMINI_API_KEY': JSON.stringify(env.GEMINI_API_KEY)
-      },
-      resolve: {
-        alias: {
-          '@': path.resolve(__dirname, '.'),
-        }
+  const env = loadEnv(mode, '.', '');
+  return {
+    server: {
+      port: 3000,
+      host: '0.0.0.0',
+    },
+    plugins: [react(), tailwindcss()],
+    define: {
+      'process.env.API_KEY': JSON.stringify(env.GEMINI_API_KEY),
+      'process.env.GEMINI_API_KEY': JSON.stringify(env.GEMINI_API_KEY)
+    },
+    resolve: {
+      alias: {
+        '@': path.resolve(__dirname, '.'),
       }
-    };
+    }
+  };
 });