diff --git a/components/layout/sidebar.tsx b/components/layout/sidebar.tsx
index ec5df08..636ef75 100644
--- a/components/layout/sidebar.tsx
+++ b/components/layout/sidebar.tsx
@@ -3,7 +3,7 @@
 import { useState } from 'react';
 import Link from 'next/link';
 import { usePathname } from 'next/navigation';
-import { cn } from '@/lib/utils';
+import { cn } from '@/public/lib/utils';
 import { Button } from '@/components/ui/button';
 import { Separator } from '@/components/ui/separator';
 import {
diff --git a/components/pages/login.tsx b/components/pages/login.tsx
index e064c77..0d156f5 100644
--- a/components/pages/login.tsx
+++ b/components/pages/login.tsx
@@ -31,11 +31,11 @@ export default function Login() {
           <form className="">
             <div className="mb-3">
               <label className="form-label">电子邮箱地址</label>
-              <input placeholder="电子邮箱地址" required className="form-control" type="email" value="" />
+              <input placeholder="电子邮箱地址" required className="form-control" type="email" defaultValue="" />
             </div>
             <div className="mb-3">
               <label className="form-label">密码</label>
-              <input placeholder="密码" required className="form-control" type="password" value="" />
+              <input placeholder="密码" required className="form-control" type="password" defaultValue="" />
               <div className="d-flex justify-content-end mt-1">
                 <a className="auth-link small" href="/forgot-password" data-discover="true">忘记密码？</a>
               </div>
diff --git a/components/ui/accordion.tsx b/components/ui/accordion.tsx
index 84bf2eb..9282e24 100644
--- a/components/ui/accordion.tsx
+++ b/components/ui/accordion.tsx
@@ -4,7 +4,7 @@ import * as React from 'react';
 import * as AccordionPrimitive from '@radix-ui/react-accordion';
 import { ChevronDown } from 'lucide-react';
 
-import { cn } from '@/lib/utils';
+import { cn } from '@/public/lib/utils';
 
 const Accordion = AccordionPrimitive.Root;
 
diff --git a/components/ui/alert-dialog.tsx b/components/ui/alert-dialog.tsx
index 5cba559..0eeac88 100644
--- a/components/ui/alert-dialog.tsx
+++ b/components/ui/alert-dialog.tsx
@@ -3,7 +3,7 @@
 import * as React from 'react';
 import * as AlertDialogPrimitive from '@radix-ui/react-alert-dialog';
 
-import { cn } from '@/lib/utils';
+import { cn } from '@/public/lib/utils';
 import { buttonVariants } from '@/components/ui/button';
 
 const AlertDialog = AlertDialogPrimitive.Root;
diff --git a/components/ui/alert.tsx b/components/ui/alert.tsx
index d2b59cc..8da01b2 100644
--- a/components/ui/alert.tsx
+++ b/components/ui/alert.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { cva, type VariantProps } from 'class-variance-authority';
 
-import { cn } from '@/lib/utils';
+import { cn } from '@/public/lib/utils';
 
 const alertVariants = cva(
   'relative w-full rounded-lg border p-4 [&>svg~*]:pl-7 [&>svg+div]:translate-y-[-3px] [&>svg]:absolute [&>svg]:left-4 [&>svg]:top-4 [&>svg]:text-foreground',
diff --git a/components/ui/avatar.tsx b/components/ui/avatar.tsx
index 1346957..4d76589 100644
--- a/components/ui/avatar.tsx
+++ b/components/ui/avatar.tsx
@@ -3,7 +3,7 @@
 import * as React from 'react';
 import * as AvatarPrimitive from '@radix-ui/react-avatar';
 
-import { cn } from '@/lib/utils';
+import { cn } from '@/public/lib/utils';
 
 const Avatar = React.forwardRef<
   React.ElementRef<typeof AvatarPrimitive.Root>,
diff --git a/components/ui/badge.tsx b/components/ui/badge.tsx
index 2eb790a..e0bec66 100644
--- a/components/ui/badge.tsx
+++ b/components/ui/badge.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { cva, type VariantProps } from 'class-variance-authority';
 
-import { cn } from '@/lib/utils';
+import { cn } from '@/public/lib/utils';
 
 const badgeVariants = cva(
   'inline-flex items-center rounded-full border 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',
diff --git a/components/ui/breadcrumb.tsx b/components/ui/breadcrumb.tsx
index 8b62197..2a5ddc3 100644
--- a/components/ui/breadcrumb.tsx
+++ b/components/ui/breadcrumb.tsx
@@ -2,7 +2,7 @@ import * as React from 'react';
 import { Slot } from '@radix-ui/react-slot';
 import { ChevronRight, MoreHorizontal } from 'lucide-react';
 
-import { cn } from '@/lib/utils';
+import { cn } from '@/public/lib/utils';
 
 const Breadcrumb = React.forwardRef<
   HTMLElement,
diff --git a/components/ui/button.tsx b/components/ui/button.tsx
index 81e2e6e..ce0de24 100644
--- a/components/ui/button.tsx
+++ b/components/ui/button.tsx
@@ -2,7 +2,7 @@ import * as React from 'react';
 import { Slot } from '@radix-ui/react-slot';
 import { cva, type VariantProps } from 'class-variance-authority';
 
-import { cn } from '@/lib/utils';
+import { cn } from '@/public/lib/utils';
 
 const buttonVariants = cva(
   'inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50',
diff --git a/components/ui/calendar.tsx b/components/ui/calendar.tsx
index 7ee4f82..634dd4e 100644
--- a/components/ui/calendar.tsx
+++ b/components/ui/calendar.tsx
@@ -4,7 +4,7 @@ import * as React from 'react';
 import { ChevronLeft, ChevronRight } from 'lucide-react';
 import { DayPicker } from 'react-day-picker';
 
-import { cn } from '@/lib/utils';
+import { cn } from '@/public/lib/utils';
 import { buttonVariants } from '@/components/ui/button';
 
 export type CalendarProps = React.ComponentProps<typeof DayPicker>;
diff --git a/components/ui/card.tsx b/components/ui/card.tsx
index 520ecb4..3d05471 100644
--- a/components/ui/card.tsx
+++ b/components/ui/card.tsx
@@ -1,6 +1,6 @@
 import * as React from 'react';
 
-import { cn } from '@/lib/utils';
+import { cn } from '@/public/lib/utils';
 
 const Card = React.forwardRef<
   HTMLDivElement,
diff --git a/components/ui/carousel.tsx b/components/ui/carousel.tsx
index f689200..fc6eca8 100644
--- a/components/ui/carousel.tsx
+++ b/components/ui/carousel.tsx
@@ -6,7 +6,7 @@ import useEmblaCarousel, {
 } from 'embla-carousel-react';
 import { ArrowLeft, ArrowRight } from 'lucide-react';
 
-import { cn } from '@/lib/utils';
+import { cn } from '@/public/lib/utils';
 import { Button } from '@/components/ui/button';
 
 type CarouselApi = UseEmblaCarouselType[1];
diff --git a/components/ui/character-tab-content.tsx b/components/ui/character-tab-content.tsx
index 90ac3a4..469bf5f 100644
--- a/components/ui/character-tab-content.tsx
+++ b/components/ui/character-tab-content.tsx
@@ -1,7 +1,7 @@
 import React, { useState, useRef } from 'react';
 import { motion, AnimatePresence } from 'framer-motion';
 import { Upload, Library, Play, Pause, RefreshCw, Wand2 } from 'lucide-react';
-import { cn } from '@/lib/utils';
+import { cn } from '@/public/lib/utils';
 import { GlassIconButton } from './glass-icon-button';
 import { ReplaceCharacterModal } from './replace-character-modal';
 
diff --git a/components/ui/chart.tsx b/components/ui/chart.tsx
index 9b6a04b..ab5e290 100644
--- a/components/ui/chart.tsx
+++ b/components/ui/chart.tsx
@@ -3,7 +3,7 @@
 import * as React from 'react';
 import * as RechartsPrimitive from 'recharts';
 
-import { cn } from '@/lib/utils';
+import { cn } from '@/public/lib/utils';
 
 // Format: { THEME_NAME: CSS_SELECTOR }
 const THEMES = { light: '', dark: '.dark' } as const;
diff --git a/components/ui/checkbox.tsx b/components/ui/checkbox.tsx
index 13a6a29..ba34379 100644
--- a/components/ui/checkbox.tsx
+++ b/components/ui/checkbox.tsx
@@ -4,7 +4,7 @@ import * as React from 'react';
 import * as CheckboxPrimitive from '@radix-ui/react-checkbox';
 import { Check } from 'lucide-react';
 
-import { cn } from '@/lib/utils';
+import { cn } from '@/public/lib/utils';
 
 const Checkbox = React.forwardRef<
   React.ElementRef<typeof CheckboxPrimitive.Root>,
diff --git a/components/ui/command.tsx b/components/ui/command.tsx
index 5b9ca50..9bb6d46 100644
--- a/components/ui/command.tsx
+++ b/components/ui/command.tsx
@@ -5,7 +5,7 @@ import { type DialogProps } from '@radix-ui/react-dialog';
 import { Command as CommandPrimitive } from 'cmdk';
 import { Search } from 'lucide-react';
 
-import { cn } from '@/lib/utils';
+import { cn } from '@/public/lib/utils';
 import { Dialog, DialogContent } from '@/components/ui/dialog';
 
 const Command = React.forwardRef<
diff --git a/components/ui/context-menu.tsx b/components/ui/context-menu.tsx
index 1046ab8..59fed5f 100644
--- a/components/ui/context-menu.tsx
+++ b/components/ui/context-menu.tsx
@@ -4,7 +4,7 @@ import * as React from 'react';
 import * as ContextMenuPrimitive from '@radix-ui/react-context-menu';
 import { Check, ChevronRight, Circle } from 'lucide-react';
 
-import { cn } from '@/lib/utils';
+import { cn } from '@/public/lib/utils';
 
 const ContextMenu = ContextMenuPrimitive.Root;
 
diff --git a/components/ui/dialog.tsx b/components/ui/dialog.tsx
index b552952..a207dd1 100644
--- a/components/ui/dialog.tsx
+++ b/components/ui/dialog.tsx
@@ -4,7 +4,7 @@ import * as React from 'react';
 import * as DialogPrimitive from '@radix-ui/react-dialog';
 import { X } from 'lucide-react';
 
-import { cn } from '@/lib/utils';
+import { cn } from '@/public/lib/utils';
 
 const Dialog = DialogPrimitive.Root;
 
diff --git a/components/ui/drawer.tsx b/components/ui/drawer.tsx
index f78fb47..3423633 100644
--- a/components/ui/drawer.tsx
+++ b/components/ui/drawer.tsx
@@ -3,7 +3,7 @@
 import * as React from 'react';
 import { Drawer as DrawerPrimitive } from 'vaul';
 
-import { cn } from '@/lib/utils';
+import { cn } from '@/public/lib/utils';
 
 const Drawer = ({
   shouldScaleBackground = true,
diff --git a/components/ui/dropdown-menu.tsx b/components/ui/dropdown-menu.tsx
index 283467c..5f5007c 100644
--- a/components/ui/dropdown-menu.tsx
+++ b/components/ui/dropdown-menu.tsx
@@ -4,7 +4,7 @@ import * as React from 'react';
 import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';
 import { Check, ChevronRight, Circle } from 'lucide-react';
 
-import { cn } from '@/lib/utils';
+import { cn } from '@/public/lib/utils';
 
 const DropdownMenu = DropdownMenuPrimitive.Root;
 
diff --git a/components/ui/edit-modal.tsx b/components/ui/edit-modal.tsx
index f6055c6..316f16d 100644
--- a/components/ui/edit-modal.tsx
+++ b/components/ui/edit-modal.tsx
@@ -3,7 +3,7 @@
 import React, { useState, useEffect } from 'react';
 import { motion, AnimatePresence } from 'framer-motion';
 import { X, FileText, Users, Video, Music, Scissors, Settings } from 'lucide-react';
-import { cn } from '@/lib/utils';
+import { cn } from '@/public/lib/utils';
 import { ScriptTabContent } from './script-tab-content';
 import { VideoTabContent } from './video-tab-content';
 import { SettingsTabContent } from './settings-tab-content';
diff --git a/components/ui/form.tsx b/components/ui/form.tsx
index b9fb860..470d28a 100644
--- a/components/ui/form.tsx
+++ b/components/ui/form.tsx
@@ -12,7 +12,7 @@ import {
   useFormContext,
 } from 'react-hook-form';
 
-import { cn } from '@/lib/utils';
+import { cn } from '@/public/lib/utils';
 import { Label } from '@/components/ui/label';
 
 const Form = FormProvider;
diff --git a/components/ui/generate-video-modal.tsx b/components/ui/generate-video-modal.tsx
index a9ba2be..dc98189 100644
--- a/components/ui/generate-video-modal.tsx
+++ b/components/ui/generate-video-modal.tsx
@@ -3,7 +3,7 @@
 import React, { useState } from 'react';
 import { motion, AnimatePresence } from 'framer-motion';
 import { X, ChevronDown } from 'lucide-react';
-import { cn } from '@/lib/utils';
+import { cn } from '@/public/lib/utils';
 
 interface GenerateVideoModalProps {
   isOpen: boolean;
diff --git a/components/ui/glass-icon-button.tsx b/components/ui/glass-icon-button.tsx
index a7742d8..291b694 100644
--- a/components/ui/glass-icon-button.tsx
+++ b/components/ui/glass-icon-button.tsx
@@ -3,7 +3,7 @@
 import React, { forwardRef } from 'react';
 import { motion } from 'framer-motion';
 import { LucideIcon } from 'lucide-react';
-import { cn } from '@/lib/utils';
+import { cn } from '@/public/lib/utils';
 
 // Define props without the ref
 interface GlassIconButtonProps {
diff --git a/components/ui/hover-card.tsx b/components/ui/hover-card.tsx
index 1c9816e..97bd87f 100644
--- a/components/ui/hover-card.tsx
+++ b/components/ui/hover-card.tsx
@@ -3,7 +3,7 @@
 import * as React from 'react';
 import * as HoverCardPrimitive from '@radix-ui/react-hover-card';
 
-import { cn } from '@/lib/utils';
+import { cn } from '@/public/lib/utils';
 
 const HoverCard = HoverCardPrimitive.Root;
 
diff --git a/components/ui/input-otp.tsx b/components/ui/input-otp.tsx
index e7f1585..019b6a5 100644
--- a/components/ui/input-otp.tsx
+++ b/components/ui/input-otp.tsx
@@ -4,7 +4,7 @@ import * as React from 'react';
 import { OTPInput, OTPInputContext } from 'input-otp';
 import { Dot } from 'lucide-react';
 
-import { cn } from '@/lib/utils';
+import { cn } from '@/public/lib/utils';
 
 const InputOTP = React.forwardRef<
   React.ElementRef<typeof OTPInput>,
diff --git a/components/ui/input.tsx b/components/ui/input.tsx
index c982112..f0ad956 100644
--- a/components/ui/input.tsx
+++ b/components/ui/input.tsx
@@ -1,6 +1,6 @@
 import * as React from 'react';
 
-import { cn } from '@/lib/utils';
+import { cn } from '@/public/lib/utils';
 
 export interface InputProps
   extends React.InputHTMLAttributes<HTMLInputElement> {}
diff --git a/components/ui/label.tsx b/components/ui/label.tsx
index 1e24ec0..08c1780 100644
--- a/components/ui/label.tsx
+++ b/components/ui/label.tsx
@@ -4,7 +4,7 @@ import * as React from 'react';
 import * as LabelPrimitive from '@radix-ui/react-label';
 import { cva, type VariantProps } from 'class-variance-authority';
 
-import { cn } from '@/lib/utils';
+import { cn } from '@/public/lib/utils';
 
 const labelVariants = cva(
   'text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70'
diff --git a/components/ui/menubar.tsx b/components/ui/menubar.tsx
index 045ad98..2b1acb3 100644
--- a/components/ui/menubar.tsx
+++ b/components/ui/menubar.tsx
@@ -4,7 +4,7 @@ import * as React from 'react';
 import * as MenubarPrimitive from '@radix-ui/react-menubar';
 import { Check, ChevronRight, Circle } from 'lucide-react';
 
-import { cn } from '@/lib/utils';
+import { cn } from '@/public/lib/utils';
 
 const MenubarMenu = MenubarPrimitive.Menu;
 
diff --git a/components/ui/music-tab-content.tsx b/components/ui/music-tab-content.tsx
index 65ed9b1..75789ce 100644
--- a/components/ui/music-tab-content.tsx
+++ b/components/ui/music-tab-content.tsx
@@ -3,7 +3,7 @@
 import React, { useState, useRef } from 'react';
 import { motion, AnimatePresence } from 'framer-motion';
 import { Upload, Library, Play, Pause, RefreshCw, Music2, Volume2 } from 'lucide-react';
-import { cn } from '@/lib/utils';
+import { cn } from '@/public/lib/utils';
 import { GlassIconButton } from './glass-icon-button';
 import { ReplaceMusicModal } from './replace-music-modal';
 
diff --git a/components/ui/navigation-menu.tsx b/components/ui/navigation-menu.tsx
index 97ec318..d5e3ac7 100644
--- a/components/ui/navigation-menu.tsx
+++ b/components/ui/navigation-menu.tsx
@@ -3,7 +3,7 @@ import * as NavigationMenuPrimitive from '@radix-ui/react-navigation-menu';
 import { cva } from 'class-variance-authority';
 import { ChevronDown } from 'lucide-react';
 
-import { cn } from '@/lib/utils';
+import { cn } from '@/public/lib/utils';
 
 const NavigationMenu = React.forwardRef<
   React.ElementRef<typeof NavigationMenuPrimitive.Root>,
diff --git a/components/ui/pagination.tsx b/components/ui/pagination.tsx
index 7462acc..15f25ca 100644
--- a/components/ui/pagination.tsx
+++ b/components/ui/pagination.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { ChevronLeft, ChevronRight, MoreHorizontal } from 'lucide-react';
 
-import { cn } from '@/lib/utils';
+import { cn } from '@/public/lib/utils';
 import { ButtonProps, buttonVariants } from '@/components/ui/button';
 
 const Pagination = ({ className, ...props }: React.ComponentProps<'nav'>) => (
diff --git a/components/ui/popover.tsx b/components/ui/popover.tsx
index f224d5e..580ee26 100644
--- a/components/ui/popover.tsx
+++ b/components/ui/popover.tsx
@@ -3,7 +3,7 @@
 import * as React from 'react';
 import * as PopoverPrimitive from '@radix-ui/react-popover';
 
-import { cn } from '@/lib/utils';
+import { cn } from '@/public/lib/utils';
 
 const Popover = PopoverPrimitive.Root;
 
diff --git a/components/ui/progress.tsx b/components/ui/progress.tsx
index 6b51c44..c175665 100644
--- a/components/ui/progress.tsx
+++ b/components/ui/progress.tsx
@@ -1,7 +1,7 @@
 'use client';
 
 import * as React from 'react';
-import { cn } from '@/lib/utils';
+import { cn } from '@/public/lib/utils';
 
 interface ProgressProps {
   value?: number;
diff --git a/components/ui/radio-group.tsx b/components/ui/radio-group.tsx
index acd55f3..97ffdf6 100644
--- a/components/ui/radio-group.tsx
+++ b/components/ui/radio-group.tsx
@@ -4,7 +4,7 @@ import * as React from 'react';
 import * as RadioGroupPrimitive from '@radix-ui/react-radio-group';
 import { Circle } from 'lucide-react';
 
-import { cn } from '@/lib/utils';
+import { cn } from '@/public/lib/utils';
 
 const RadioGroup = React.forwardRef<
   React.ElementRef<typeof RadioGroupPrimitive.Root>,
diff --git a/components/ui/replace-character-modal.tsx b/components/ui/replace-character-modal.tsx
index 7b7d53f..0fcc923 100644
--- a/components/ui/replace-character-modal.tsx
+++ b/components/ui/replace-character-modal.tsx
@@ -3,7 +3,7 @@
 import React, { useState, useEffect } from 'react';
 import { motion, AnimatePresence } from 'framer-motion';
 import { X, Upload, Library, Wand2, Search, Image, Plus, ChevronDown } from 'lucide-react';
-import { cn } from '@/lib/utils';
+import { cn } from '@/public/lib/utils';
 
 interface ReplaceCharacterModalProps {
   isOpen: boolean;
diff --git a/components/ui/replace-music-modal.tsx b/components/ui/replace-music-modal.tsx
index 18fb44b..afa6bd1 100644
--- a/components/ui/replace-music-modal.tsx
+++ b/components/ui/replace-music-modal.tsx
@@ -3,7 +3,7 @@
 import React, { useState, useEffect } from 'react';
 import { motion, AnimatePresence } from 'framer-motion';
 import { Upload, Library, Search, Music2, ChevronDown } from 'lucide-react';
-import { cn } from '@/lib/utils';
+import { cn } from '@/public/lib/utils';
 
 interface ReplaceMusicModalProps {
   isOpen: boolean;
diff --git a/components/ui/replace-video-modal.tsx b/components/ui/replace-video-modal.tsx
index f70b410..7f013b7 100644
--- a/components/ui/replace-video-modal.tsx
+++ b/components/ui/replace-video-modal.tsx
@@ -3,7 +3,7 @@
 import React, { useState, useEffect } from 'react';
 import { motion, AnimatePresence } from 'framer-motion';
 import { X, Upload, Library, Wand2, Search, FileVideo, Plus, ChevronDown } from 'lucide-react';
-import { cn } from '@/lib/utils';
+import { cn } from '@/public/lib/utils';
 import { GenerateVideoModal } from './generate-video-modal';
 
 interface ReplaceVideoModalProps {
diff --git a/components/ui/resizable.tsx b/components/ui/resizable.tsx
index bbd3eb8..9d99861 100644
--- a/components/ui/resizable.tsx
+++ b/components/ui/resizable.tsx
@@ -3,7 +3,7 @@
 import { GripVertical } from 'lucide-react';
 import * as ResizablePrimitive from 'react-resizable-panels';
 
-import { cn } from '@/lib/utils';
+import { cn } from '@/public/lib/utils';
 
 const ResizablePanelGroup = ({
   className,
diff --git a/components/ui/script-tab-content.tsx b/components/ui/script-tab-content.tsx
index d1bce78..e32630c 100644
--- a/components/ui/script-tab-content.tsx
+++ b/components/ui/script-tab-content.tsx
@@ -4,7 +4,7 @@ import React, { useRef, useEffect } from 'react';
 import { motion, AnimatePresence } from 'framer-motion';
 import { Trash2, RefreshCw } from 'lucide-react';
 import { GlassIconButton } from './glass-icon-button';
-import { cn } from '@/lib/utils';
+import { cn } from '@/public/lib/utils';
 
 interface ScriptTabContentProps {
   taskSketch: any[];
diff --git a/components/ui/scroll-area.tsx b/components/ui/scroll-area.tsx
index 75c68fa..2502aba 100644
--- a/components/ui/scroll-area.tsx
+++ b/components/ui/scroll-area.tsx
@@ -3,7 +3,7 @@
 import * as React from 'react';
 import * as ScrollAreaPrimitive from '@radix-ui/react-scroll-area';
 
-import { cn } from '@/lib/utils';
+import { cn } from '@/public/lib/utils';
 
 const ScrollArea = React.forwardRef<
   React.ElementRef<typeof ScrollAreaPrimitive.Root>,
diff --git a/components/ui/select.tsx b/components/ui/select.tsx
index 9f3ef21..656bf3b 100644
--- a/components/ui/select.tsx
+++ b/components/ui/select.tsx
@@ -4,7 +4,7 @@ import * as React from 'react';
 import * as SelectPrimitive from '@radix-ui/react-select';
 import { Check, ChevronDown, ChevronUp } from 'lucide-react';
 
-import { cn } from '@/lib/utils';
+import { cn } from '@/public/lib/utils';
 
 const Select = SelectPrimitive.Root;
 
diff --git a/components/ui/separator.tsx b/components/ui/separator.tsx
index da04061..e0c5968 100644
--- a/components/ui/separator.tsx
+++ b/components/ui/separator.tsx
@@ -3,7 +3,7 @@
 import * as React from 'react';
 import * as SeparatorPrimitive from '@radix-ui/react-separator';
 
-import { cn } from '@/lib/utils';
+import { cn } from '@/public/lib/utils';
 
 const Separator = React.forwardRef<
   React.ElementRef<typeof SeparatorPrimitive.Root>,
diff --git a/components/ui/settings-tab-content.tsx b/components/ui/settings-tab-content.tsx
index bb5695a..cd9af35 100644
--- a/components/ui/settings-tab-content.tsx
+++ b/components/ui/settings-tab-content.tsx
@@ -1,7 +1,7 @@
 import React, { useState } from 'react';
 import { motion, AnimatePresence } from 'framer-motion';
 import { Check, ChevronDown, Volume2, Music, Mic, Radio } from 'lucide-react';
-import { cn } from '@/lib/utils';
+import { cn } from '@/public/lib/utils';
 
 interface SettingsTabContentProps {
   onSettingChange?: (key: string, value: any) => void;
diff --git a/components/ui/sheet.tsx b/components/ui/sheet.tsx
index 257a927..02ec096 100644
--- a/components/ui/sheet.tsx
+++ b/components/ui/sheet.tsx
@@ -5,7 +5,7 @@ import * as SheetPrimitive from '@radix-ui/react-dialog';
 import { cva, type VariantProps } from 'class-variance-authority';
 import { X } from 'lucide-react';
 
-import { cn } from '@/lib/utils';
+import { cn } from '@/public/lib/utils';
 
 const Sheet = SheetPrimitive.Root;
 
diff --git a/components/ui/skeleton.tsx b/components/ui/skeleton.tsx
index a626d9b..6775dd8 100644
--- a/components/ui/skeleton.tsx
+++ b/components/ui/skeleton.tsx
@@ -1,4 +1,4 @@
-import { cn } from '@/lib/utils';
+import { cn } from '@/public/lib/utils';
 
 function Skeleton({
   className,
diff --git a/components/ui/slider.tsx b/components/ui/slider.tsx
index d25bb55..213dc8e 100644
--- a/components/ui/slider.tsx
+++ b/components/ui/slider.tsx
@@ -3,7 +3,7 @@
 import * as React from 'react';
 import * as SliderPrimitive from '@radix-ui/react-slider';
 
-import { cn } from '@/lib/utils';
+import { cn } from '@/public/lib/utils';
 
 const Slider = React.forwardRef<
   React.ElementRef<typeof SliderPrimitive.Root>,
diff --git a/components/ui/switch.tsx b/components/ui/switch.tsx
index fcdbe8b..cafefc3 100644
--- a/components/ui/switch.tsx
+++ b/components/ui/switch.tsx
@@ -3,7 +3,7 @@
 import * as React from 'react';
 import * as SwitchPrimitives from '@radix-ui/react-switch';
 
-import { cn } from '@/lib/utils';
+import { cn } from '@/public/lib/utils';
 
 const Switch = React.forwardRef<
   React.ElementRef<typeof SwitchPrimitives.Root>,
diff --git a/components/ui/table.tsx b/components/ui/table.tsx
index 33a1209..d9ce441 100644
--- a/components/ui/table.tsx
+++ b/components/ui/table.tsx
@@ -1,6 +1,6 @@
 import * as React from 'react';
 
-import { cn } from '@/lib/utils';
+import { cn } from '@/public/lib/utils';
 
 const Table = React.forwardRef<
   HTMLTableElement,
diff --git a/components/ui/tabs.tsx b/components/ui/tabs.tsx
index 7315537..76325fb 100644
--- a/components/ui/tabs.tsx
+++ b/components/ui/tabs.tsx
@@ -3,7 +3,7 @@
 import * as React from 'react';
 import * as TabsPrimitive from '@radix-ui/react-tabs';
 
-import { cn } from '@/lib/utils';
+import { cn } from '@/public/lib/utils';
 
 const Tabs = TabsPrimitive.Root;
 
diff --git a/components/ui/textarea.tsx b/components/ui/textarea.tsx
index 4ca0611..de49c90 100644
--- a/components/ui/textarea.tsx
+++ b/components/ui/textarea.tsx
@@ -1,6 +1,6 @@
 import * as React from 'react';
 
-import { cn } from '@/lib/utils';
+import { cn } from '@/public/lib/utils';
 
 export interface TextareaProps
   extends React.TextareaHTMLAttributes<HTMLTextAreaElement> {}
diff --git a/components/ui/toast.tsx b/components/ui/toast.tsx
index bd67dce..f410d8a 100644
--- a/components/ui/toast.tsx
+++ b/components/ui/toast.tsx
@@ -5,7 +5,7 @@ import * as ToastPrimitives from '@radix-ui/react-toast';
 import { cva, type VariantProps } from 'class-variance-authority';
 import { X } from 'lucide-react';
 
-import { cn } from '@/lib/utils';
+import { cn } from '@/public/lib/utils';
 
 const ToastProvider = ToastPrimitives.Provider;
 
diff --git a/components/ui/toggle-group.tsx b/components/ui/toggle-group.tsx
index a26cbc6..6d5cb9b 100644
--- a/components/ui/toggle-group.tsx
+++ b/components/ui/toggle-group.tsx
@@ -4,7 +4,7 @@ import * as React from 'react';
 import * as ToggleGroupPrimitive from '@radix-ui/react-toggle-group';
 import { type VariantProps } from 'class-variance-authority';
 
-import { cn } from '@/lib/utils';
+import { cn } from '@/public/lib/utils';
 import { toggleVariants } from '@/components/ui/toggle';
 
 const ToggleGroupContext = React.createContext<
diff --git a/components/ui/toggle.tsx b/components/ui/toggle.tsx
index edae4a9..6ed0ac1 100644
--- a/components/ui/toggle.tsx
+++ b/components/ui/toggle.tsx
@@ -4,7 +4,7 @@ import * as React from 'react';
 import * as TogglePrimitive from '@radix-ui/react-toggle';
 import { cva, type VariantProps } from 'class-variance-authority';
 
-import { cn } from '@/lib/utils';
+import { cn } from '@/public/lib/utils';
 
 const toggleVariants = cva(
   'inline-flex items-center justify-center rounded-md text-sm font-medium ring-offset-background transition-colors hover:bg-muted hover:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=on]:bg-accent data-[state=on]:text-accent-foreground',
diff --git a/components/ui/tooltip.tsx b/components/ui/tooltip.tsx
index e015b75..02a4593 100644
--- a/components/ui/tooltip.tsx
+++ b/components/ui/tooltip.tsx
@@ -3,7 +3,7 @@
 import * as React from 'react';
 import * as TooltipPrimitive from '@radix-ui/react-tooltip';
 
-import { cn } from '@/lib/utils';
+import { cn } from '@/public/lib/utils';
 
 const TooltipProvider = TooltipPrimitive.Provider;
 
diff --git a/components/ui/video-tab-content.tsx b/components/ui/video-tab-content.tsx
index f66dbdb..b709957 100644
--- a/components/ui/video-tab-content.tsx
+++ b/components/ui/video-tab-content.tsx
@@ -4,7 +4,7 @@ import React, { useRef, useEffect } from 'react';
 import { motion, AnimatePresence } from 'framer-motion';
 import { Trash2, RefreshCw, Play, Pause, Volume2, VolumeX, Upload, Library, Wand2 } from 'lucide-react';
 import { GlassIconButton } from './glass-icon-button';
-import { cn } from '@/lib/utils';
+import { cn } from '@/public/lib/utils';
 import { ReplaceVideoModal } from './replace-video-modal';
 
 interface VideoTabContentProps {
diff --git a/components/vanta-halo-background.tsx b/components/vanta-halo-background.tsx
index db00e87..3aad519 100644
--- a/components/vanta-halo-background.tsx
+++ b/components/vanta-halo-background.tsx
@@ -3,6 +3,7 @@
 
 import React, { useRef, useEffect, memo } from 'react'
 import dynamic from 'next/dynamic'
+// Import THREE only once and use it consistently
 import * as THREE from 'three'
 
 interface VantaHaloBackgroundProps {
@@ -27,7 +28,7 @@ const preloadVantaScript = () => {
   const link2 = document.createElement('link')
   link2.rel = 'preload'
   link2.as = 'script'
-  link2.href = '/lib/vanta.halo.min.js'  // 确保路径正确
+  link2.href = '/lib/vanta.halo.min.js'
   document.head.appendChild(link2)
 }
 
@@ -67,7 +68,7 @@ const VantaHaloBackground = memo(({ onLoaded }: VantaHaloBackgroundProps) => {
             if (window.VANTA && window.VANTA.HALO) {
               effectInstance.current = window.VANTA.HALO({
                 el: vantaRef.current,
-                THREE,
+                THREE, // Pass the imported THREE instance
                 mouseControls: true,
                 touchControls: true,
                 gyroControls: false,
diff --git a/lib/utils.ts b/public/lib/utils.ts
similarity index 100%
rename from lib/utils.ts
rename to public/lib/utils.ts
diff --git a/lib/vanta.halo.min.js b/public/lib/vanta.halo.min.js
similarity index 100%
rename from lib/vanta.halo.min.js
rename to public/lib/vanta.halo.min.js