diff --git a/src/views/AgentChat/index.js b/src/views/AgentChat/index.js
index c6f3d81c..fdd8e52b 100644
--- a/src/views/AgentChat/index.js
+++ b/src/views/AgentChat/index.js
@@ -1,6 +1,6 @@
 // src/views/AgentChat/index.js
 // 超炫酷的 AI 投研助手 - Hero UI 版本
-// 模仿 Google AI Studio 风格
+// 使用 CSS 动画替代 Framer Motion（避免版本冲突）
 
 import React, { useState, useEffect, useRef } from 'react';
 import {
@@ -22,20 +22,15 @@ import {
   Tab,
   ScrollShadow,
   Kbd,
-  Snippet,
   Accordion,
   AccordionItem,
 } from '@heroui/react';
-import { motion, AnimatePresence } from 'framer-motion';
 import { useAuth } from '@contexts/AuthContext';
 import { logger } from '@utils/logger';
 import axios from 'axios';
-import { useToast } from '@chakra-ui/react'; // 继续使用 Chakra 的 Toast
+import { useToast } from '@chakra-ui/react';
 
-// Framer Motion 包装组件
-const MotionDiv = motion.div;
-
-// 图标 - 使用 Hero UI 推荐的 Lucide Icons
+// 图标 - 使用 Lucide Icons
 import {
   Send,
   Plus,
@@ -156,16 +151,13 @@ const AgentChat = () => {
 
   // ==================== API 调用函数 ====================
 
-  // 加载会话列表
   const loadSessions = async () => {
     if (!user?.id) return;
-
     setIsLoadingSessions(true);
     try {
       const response = await axios.get('/mcp/agent/sessions', {
         params: { user_id: user.id, limit: 50 },
       });
-
       if (response.data.success) {
         setSessions(response.data.data);
       }
@@ -176,15 +168,12 @@ const AgentChat = () => {
     }
   };
 
-  // 加载会话历史
   const loadSessionHistory = async (sessionId) => {
     if (!sessionId) return;
-
     try {
       const response = await axios.get(`/mcp/agent/history/${sessionId}`, {
         params: { limit: 100 },
       });
-
       if (response.data.success) {
         const history = response.data.data;
         const formattedMessages = history.map((msg, idx) => ({
@@ -195,7 +184,6 @@ const AgentChat = () => {
           stepResults: msg.steps ? JSON.parse(msg.steps) : null,
           timestamp: msg.timestamp,
         }));
-
         setMessages(formattedMessages);
       }
     } catch (error) {
@@ -203,7 +191,6 @@ const AgentChat = () => {
     }
   };
 
-  // 创建新会话
   const createNewSession = () => {
     setCurrentSessionId(null);
     setMessages([
@@ -216,13 +203,11 @@ const AgentChat = () => {
     ]);
   };
 
-  // 切换会话
   const switchSession = (sessionId) => {
     setCurrentSessionId(sessionId);
     loadSessionHistory(sessionId);
   };
 
-  // 发送消息
   const handleSendMessage = async () => {
     if (!inputValue.trim() || isProcessing) return;
 
@@ -238,14 +223,12 @@ const AgentChat = () => {
     setIsProcessing(true);
 
     try {
-      // 显示思考状态
       addMessage({
         type: MessageTypes.AGENT_THINKING,
         content: '正在分析你的问题...',
         timestamp: new Date().toISOString(),
       });
 
-      // 调用后端 API
       const response = await axios.post('/mcp/agent/chat', {
         message: userInput,
         conversation_history: messages
@@ -262,17 +245,14 @@ const AgentChat = () => {
         tools: selectedTools,
       });
 
-      // 移除思考消息
       setMessages((prev) => prev.filter((m) => m.type !== MessageTypes.AGENT_THINKING));
 
       if (response.data.success) {
         const data = response.data;
-
         if (data.session_id && !currentSessionId) {
           setCurrentSessionId(data.session_id);
         }
 
-        // 显示执行计划
         if (data.plan) {
           addMessage({
             type: MessageTypes.AGENT_PLAN,
@@ -282,7 +262,6 @@ const AgentChat = () => {
           });
         }
 
-        // 显示执行步骤
         if (data.steps && data.steps.length > 0) {
           addMessage({
             type: MessageTypes.AGENT_EXECUTING,
@@ -293,10 +272,8 @@ const AgentChat = () => {
           });
         }
 
-        // 移除执行中消息
         setMessages((prev) => prev.filter((m) => m.type !== MessageTypes.AGENT_EXECUTING));
 
-        // 显示最终结果
         addMessage({
           type: MessageTypes.AGENT_RESPONSE,
           content: data.final_answer || data.message || '处理完成',
@@ -310,7 +287,6 @@ const AgentChat = () => {
       }
     } catch (error) {
       logger.error('Agent chat error', error);
-
       setMessages((prev) =>
         prev.filter(
           (m) => m.type !== MessageTypes.AGENT_THINKING && m.type !== MessageTypes.AGENT_EXECUTING
@@ -318,7 +294,6 @@ const AgentChat = () => {
       );
 
       const errorMessage = error.response?.data?.error || error.message || '处理失败';
-
       addMessage({
         type: MessageTypes.ERROR,
         content: `处理失败：${errorMessage}`,
@@ -338,12 +313,10 @@ const AgentChat = () => {
     }
   };
 
-  // 添加消息
   const addMessage = (message) => {
     setMessages((prev) => [...prev, { ...message, id: Date.now() + Math.random() }]);
   };
 
-  // 自动滚动到底部
   const scrollToBottom = () => {
     messagesEndRef.current?.scrollIntoView({ behavior: 'smooth' });
   };
@@ -352,7 +325,6 @@ const AgentChat = () => {
     scrollToBottom();
   }, [messages]);
 
-  // 处理键盘事件
   const handleKeyPress = (e) => {
     if (e.key === 'Enter' && !e.shiftKey) {
       e.preventDefault();
@@ -360,7 +332,6 @@ const AgentChat = () => {
     }
   };
 
-  // 初始化
   useEffect(() => {
     if (user) {
       loadSessions();
@@ -368,13 +339,11 @@ const AgentChat = () => {
     }
   }, [user]);
 
-  // 筛选会话
   const filteredSessions = sessions.filter(
     (session) =>
       !searchQuery || session.last_message?.toLowerCase().includes(searchQuery.toLowerCase())
   );
 
-  // 快捷问题
   const quickQuestions = [
     { text: '全面分析贵州茅台', emoji: '📊' },
     { text: '今日涨停股票分析', emoji: '🔥' },
@@ -384,138 +353,116 @@ const AgentChat = () => {
 
   return (
     <div className="flex h-screen bg-gradient-to-br from-gray-50 to-blue-50 dark:from-gray-900 dark:to-gray-800 overflow-hidden">
-      {/* 左侧栏 - 历史记录 */}
-      <AnimatePresence>
-        {isLeftSidebarOpen && (
-          <MotionDiv
-            initial={{ x: -320, opacity: 0 }}
-            animate={{ x: 0, opacity: 1 }}
-            exit={{ x: -320, opacity: 0 }}
-            transition={{ type: 'spring', stiffness: 300, damping: 30 }}
-            className="w-80 flex flex-col bg-white/80 dark:bg-gray-800/80 backdrop-blur-xl border-r border-gray-200 dark:border-gray-700 shadow-xl"
-          >
-            {/* 侧边栏头部 */}
-            <div className="p-4 border-b border-gray-200 dark:border-gray-700">
-              <div className="flex items-center justify-between mb-3">
-                <div className="flex items-center gap-2">
-                  <MessageSquare className="w-5 h-5" />
-                  <h2 className="text-lg font-bold">对话历史</h2>
-                </div>
-                <Button
-                  isIconOnly
-                  size="sm"
-                  variant="light"
-                  onPress={() => setIsLeftSidebarOpen(false)}
-                >
-                  <ChevronLeft className="w-4 h-4" />
-                </Button>
+      {/* 左侧栏 */}
+      {isLeftSidebarOpen && (
+        <div className="w-80 flex flex-col bg-white/80 dark:bg-gray-800/80 backdrop-blur-xl border-r border-gray-200 dark:border-gray-700 shadow-xl animate-slide-in-left">
+          <div className="p-4 border-b border-gray-200 dark:border-gray-700">
+            <div className="flex items-center justify-between mb-3">
+              <div className="flex items-center gap-2">
+                <MessageSquare className="w-5 h-5" />
+                <h2 className="text-lg font-bold">对话历史</h2>
               </div>
-
               <Button
-                color="primary"
-                variant="shadow"
-                startContent={<Plus className="w-4 h-4" />}
-                onPress={createNewSession}
-                className="w-full mb-3"
-              >
-                新建对话
-              </Button>
-
-              <Input
-                placeholder="搜索对话..."
-                value={searchQuery}
-                onChange={(e) => setSearchQuery(e.target.value)}
-                startContent={<Search className="w-4 h-4 text-gray-400" />}
+                isIconOnly
                 size="sm"
-                variant="bordered"
-              />
+                variant="light"
+                onPress={() => setIsLeftSidebarOpen(false)}
+              >
+                <ChevronLeft className="w-4 h-4" />
+              </Button>
             </div>
 
-            {/* 会话列表 */}
-            <ScrollShadow className="flex-1 p-2">
-              {isLoadingSessions ? (
-                <div className="flex items-center justify-center h-40">
-                  <Spinner />
-                </div>
-              ) : filteredSessions.length === 0 ? (
-                <div className="flex flex-col items-center justify-center h-40 text-gray-400">
-                  <MessageSquare className="w-8 h-8 mb-2 opacity-30" />
-                  <p className="text-sm">{searchQuery ? '没有找到匹配的对话' : '暂无对话记录'}</p>
-                </div>
-              ) : (
-                <div className="space-y-2">
-                  {filteredSessions.map((session, index) => (
-                    <MotionDiv
-                      key={session.session_id}
-                      initial={{ x: -20, opacity: 0 }}
-                      animate={{ x: 0, opacity: 1 }}
-                      transition={{ delay: index * 0.05 }}
-                    >
-                      <Card
-                        isPressable
-                        isHoverable
-                        onPress={() => switchSession(session.session_id)}
-                        className={`${
-                          currentSessionId === session.session_id
-                            ? 'bg-primary-50 dark:bg-primary-900/20 border-primary-500'
-                            : ''
-                        }`}
-                      >
-                        <CardBody className="p-3">
-                          <div className="flex justify-between items-start">
-                            <div className="flex-1 min-w-0">
-                              <p className="text-sm font-medium line-clamp-2 mb-1">
-                                {session.last_message || '新对话'}
-                              </p>
-                              <div className="flex items-center gap-2 text-xs text-gray-500">
-                                <Clock className="w-3 h-3" />
-                                <span>
-                                  {new Date(session.last_timestamp).toLocaleDateString('zh-CN', {
-                                    month: 'numeric',
-                                    day: 'numeric',
-                                    hour: 'numeric',
-                                    minute: 'numeric',
-                                  })}
-                                </span>
-                                <Badge size="sm" color="primary" variant="flat">
-                                  {session.message_count}
-                                </Badge>
-                              </div>
-                            </div>
-                            <Button isIconOnly size="sm" variant="light">
-                              <MoreVertical className="w-4 h-4" />
-                            </Button>
-                          </div>
-                        </CardBody>
-                      </Card>
-                    </MotionDiv>
-                  ))}
-                </div>
-              )}
-            </ScrollShadow>
+            <Button
+              color="primary"
+              variant="shadow"
+              startContent={<Plus className="w-4 h-4" />}
+              onPress={createNewSession}
+              className="w-full mb-3"
+            >
+              新建对话
+            </Button>
 
-            {/* 用户信息 */}
-            <div className="p-4 border-t border-gray-200 dark:border-gray-700">
-              <div className="flex items-center gap-3">
-                <Avatar src={user?.avatar} name={user?.nickname} size="sm" />
-                <div className="flex-1 min-w-0">
-                  <p className="text-sm font-medium truncate">{user?.nickname || '未登录'}</p>
-                  <p className="text-xs text-gray-500 truncate">{user?.id || 'anonymous'}</p>
-                </div>
+            <Input
+              placeholder="搜索对话..."
+              value={searchQuery}
+              onChange={(e) => setSearchQuery(e.target.value)}
+              startContent={<Search className="w-4 h-4 text-gray-400" />}
+              size="sm"
+              variant="bordered"
+            />
+          </div>
+
+          <ScrollShadow className="flex-1 p-2">
+            {isLoadingSessions ? (
+              <div className="flex items-center justify-center h-40">
+                <Spinner />
+              </div>
+            ) : filteredSessions.length === 0 ? (
+              <div className="flex flex-col items-center justify-center h-40 text-gray-400">
+                <MessageSquare className="w-8 h-8 mb-2 opacity-30" />
+                <p className="text-sm">{searchQuery ? '没有找到匹配的对话' : '暂无对话记录'}</p>
+              </div>
+            ) : (
+              <div className="space-y-2">
+                {filteredSessions.map((session) => (
+                  <Card
+                    key={session.session_id}
+                    isPressable
+                    isHoverable
+                    onPress={() => switchSession(session.session_id)}
+                    className={`transition-all ${
+                      currentSessionId === session.session_id
+                        ? 'bg-primary-50 dark:bg-primary-900/20 border-primary-500'
+                        : ''
+                    }`}
+                  >
+                    <CardBody className="p-3">
+                      <div className="flex justify-between items-start">
+                        <div className="flex-1 min-w-0">
+                          <p className="text-sm font-medium line-clamp-2 mb-1">
+                            {session.last_message || '新对话'}
+                          </p>
+                          <div className="flex items-center gap-2 text-xs text-gray-500">
+                            <Clock className="w-3 h-3" />
+                            <span>
+                              {new Date(session.last_timestamp).toLocaleDateString('zh-CN', {
+                                month: 'numeric',
+                                day: 'numeric',
+                                hour: 'numeric',
+                                minute: 'numeric',
+                              })}
+                            </span>
+                            <Badge size="sm" color="primary" variant="flat">
+                              {session.message_count}
+                            </Badge>
+                          </div>
+                        </div>
+                        <Button isIconOnly size="sm" variant="light">
+                          <MoreVertical className="w-4 h-4" />
+                        </Button>
+                      </div>
+                    </CardBody>
+                  </Card>
+                ))}
+              </div>
+            )}
+          </ScrollShadow>
+
+          <div className="p-4 border-t border-gray-200 dark:border-gray-700">
+            <div className="flex items-center gap-3">
+              <Avatar src={user?.avatar} name={user?.nickname} size="sm" />
+              <div className="flex-1 min-w-0">
+                <p className="text-sm font-medium truncate">{user?.nickname || '未登录'}</p>
+                <p className="text-xs text-gray-500 truncate">{user?.id || 'anonymous'}</p>
               </div>
             </div>
-          </MotionDiv>
-        )}
-      </AnimatePresence>
+          </div>
+        </div>
+      )}
 
       {/* 中间主聊天区域 */}
       <div className="flex-1 flex flex-col">
-        {/* 聊天头部 */}
-        <MotionDiv
-          initial={{ y: -20, opacity: 0 }}
-          animate={{ y: 0, opacity: 1 }}
-          className="bg-white/70 dark:bg-gray-800/70 backdrop-blur-xl border-b border-gray-200 dark:border-gray-700 px-6 py-4 shadow-sm"
-        >
+        <div className="bg-white/70 dark:bg-gray-800/70 backdrop-blur-xl border-b border-gray-200 dark:border-gray-700 px-6 py-4 shadow-sm">
           <div className="flex items-center justify-between">
             <div className="flex items-center gap-4">
               {!isLeftSidebarOpen && (
@@ -529,17 +476,12 @@ const AgentChat = () => {
                 </Button>
               )}
 
-              <MotionDiv
-                animate={{ rotate: [0, 360] }}
-                transition={{ duration: 3, repeat: Infinity, ease: 'linear' }}
-              >
-                <Avatar
-                  icon={<Cpu className="w-6 h-6" />}
-                  classNames={{
-                    base: 'bg-gradient-to-br from-purple-500 to-pink-500',
-                  }}
-                />
-              </MotionDiv>
+              <Avatar
+                icon={<Cpu className="w-6 h-6" />}
+                classNames={{
+                  base: 'bg-gradient-to-br from-purple-500 to-pink-500 animate-spin-slow',
+                }}
+              />
 
               <div>
                 <h1 className="text-xl font-bold bg-gradient-to-r from-blue-600 to-purple-600 bg-clip-text text-transparent">
@@ -579,35 +521,21 @@ const AgentChat = () => {
               )}
             </div>
           </div>
-        </MotionDiv>
+        </div>
 
-        {/* 消息列表 */}
         <ScrollShadow className="flex-1 p-6">
           <div className="max-w-4xl mx-auto space-y-4">
-            <AnimatePresence>
-              {messages.map((message, index) => (
-                <MotionDiv
-                  key={message.id}
-                  initial={{ opacity: 0, y: 20 }}
-                  animate={{ opacity: 1, y: 0 }}
-                  exit={{ opacity: 0, y: -20 }}
-                  transition={{ delay: index * 0.1 }}
-                >
-                  <MessageRenderer message={message} userAvatar={user?.avatar} />
-                </MotionDiv>
-              ))}
-            </AnimatePresence>
+            {messages.map((message) => (
+              <div key={message.id} className="animate-fade-in">
+                <MessageRenderer message={message} userAvatar={user?.avatar} />
+              </div>
+            ))}
             <div ref={messagesEndRef} />
           </div>
         </ScrollShadow>
 
-        {/* 快捷问题 */}
         {messages.length <= 2 && !isProcessing && (
-          <MotionDiv
-            initial={{ y: 20, opacity: 0 }}
-            animate={{ y: 0, opacity: 1 }}
-            className="px-6 py-3"
-          >
+          <div className="px-6 py-3 animate-fade-in">
             <div className="max-w-4xl mx-auto">
               <p className="text-xs text-gray-500 mb-2 font-medium flex items-center gap-1">
                 <Sparkles className="w-3 h-3" />
@@ -615,32 +543,26 @@ const AgentChat = () => {
               </p>
               <div className="grid grid-cols-2 gap-2">
                 {quickQuestions.map((question, idx) => (
-                  <MotionDiv key={idx} whileHover={{ scale: 1.02 }} whileTap={{ scale: 0.98 }}>
-                    <Button
-                      variant="bordered"
-                      color="primary"
-                      className="w-full justify-start h-auto py-3"
-                      onPress={() => {
-                        setInputValue(question.text);
-                        inputRef.current?.focus();
-                      }}
-                    >
-                      <span className="mr-2">{question.emoji}</span>
-                      {question.text}
-                    </Button>
-                  </MotionDiv>
+                  <Button
+                    key={idx}
+                    variant="bordered"
+                    color="primary"
+                    className="w-full justify-start h-auto py-3 hover:scale-105 transition-transform"
+                    onPress={() => {
+                      setInputValue(question.text);
+                      inputRef.current?.focus();
+                    }}
+                  >
+                    <span className="mr-2">{question.emoji}</span>
+                    {question.text}
+                  </Button>
                 ))}
               </div>
             </div>
-          </MotionDiv>
+          </div>
         )}
 
-        {/* 输入框 */}
-        <MotionDiv
-          initial={{ y: 20, opacity: 0 }}
-          animate={{ y: 0, opacity: 1 }}
-          className="bg-white/70 dark:bg-gray-800/70 backdrop-blur-xl border-t border-gray-200 dark:border-gray-700 px-6 py-4"
-        >
+        <div className="bg-white/70 dark:bg-gray-800/70 backdrop-blur-xl border-t border-gray-200 dark:border-gray-700 px-6 py-4">
           <div className="max-w-4xl mx-auto">
             <div className="flex gap-2">
               <Input
@@ -654,26 +576,23 @@ const AgentChat = () => {
                 variant="bordered"
                 classNames={{
                   input: 'text-base',
-                  inputWrapper: 'border-2 hover:border-primary-500',
+                  inputWrapper: 'border-2 hover:border-primary-500 transition-colors',
                 }}
               />
-              <MotionDiv whileHover={{ scale: 1.05 }} whileTap={{ scale: 0.95 }}>
-                <Button
-                  isIconOnly
-                  color="primary"
-                  variant="shadow"
-                  size="lg"
-                  onPress={handleSendMessage}
-                  isLoading={isProcessing}
-                  isDisabled={!inputValue.trim() || isProcessing}
-                  className="bg-gradient-to-r from-blue-500 to-purple-500"
-                >
-                  {!isProcessing && <Send className="w-5 h-5" />}
-                </Button>
-              </MotionDiv>
+              <Button
+                isIconOnly
+                color="primary"
+                variant="shadow"
+                size="lg"
+                onPress={handleSendMessage}
+                isLoading={isProcessing}
+                isDisabled={!inputValue.trim() || isProcessing}
+                className="bg-gradient-to-r from-blue-500 to-purple-500 hover:scale-105 transition-transform"
+              >
+                {!isProcessing && <Send className="w-5 h-5" />}
+              </Button>
             </div>
 
-            {/* 键盘提示 */}
             <div className="flex items-center gap-4 mt-2 text-xs text-gray-500">
               <div className="flex items-center gap-1">
                 <Kbd keys={['enter']}>Enter</Kbd>
@@ -687,134 +606,185 @@ const AgentChat = () => {
               </div>
             </div>
           </div>
-        </MotionDiv>
+        </div>
       </div>
 
-      {/* 右侧栏 - 模型和工具配置 */}
-      <AnimatePresence>
-        {isRightSidebarOpen && (
-          <MotionDiv
-            initial={{ x: 320, opacity: 0 }}
-            animate={{ x: 0, opacity: 1 }}
-            exit={{ x: 320, opacity: 0 }}
-            transition={{ type: 'spring', stiffness: 300, damping: 30 }}
-            className="w-80 flex flex-col bg-white/80 dark:bg-gray-800/80 backdrop-blur-xl border-l border-gray-200 dark:border-gray-700 shadow-xl"
-          >
-            {/* 侧边栏头部 */}
-            <div className="p-4 border-b border-gray-200 dark:border-gray-700">
-              <div className="flex items-center justify-between">
-                <div className="flex items-center gap-2">
-                  <Settings className="w-5 h-5" />
-                  <h2 className="text-lg font-bold">配置中心</h2>
-                </div>
-                <Button
-                  isIconOnly
-                  size="sm"
-                  variant="light"
-                  onPress={() => setIsRightSidebarOpen(false)}
-                >
-                  <ChevronRight className="w-4 h-4" />
-                </Button>
+      {/* 右侧栏 */}
+      {isRightSidebarOpen && (
+        <div className="w-80 flex flex-col bg-white/80 dark:bg-gray-800/80 backdrop-blur-xl border-l border-gray-200 dark:border-gray-700 shadow-xl animate-slide-in-right">
+          <div className="p-4 border-b border-gray-200 dark:border-gray-700">
+            <div className="flex items-center justify-between">
+              <div className="flex items-center gap-2">
+                <Settings className="w-5 h-5" />
+                <h2 className="text-lg font-bold">配置中心</h2>
               </div>
+              <Button
+                isIconOnly
+                size="sm"
+                variant="light"
+                onPress={() => setIsRightSidebarOpen(false)}
+              >
+                <ChevronRight className="w-4 h-4" />
+              </Button>
             </div>
+          </div>
 
-            {/* 配置面板 */}
-            <ScrollShadow className="flex-1 p-4">
-              <Tabs aria-label="配置选项" variant="underlined">
-                <Tab key="model" title="模型">
-                  <div className="space-y-3 mt-4">
-                    {AVAILABLE_MODELS.map((model) => (
-                      <MotionDiv
-                        key={model.id}
-                        whileHover={{ scale: 1.02 }}
-                        whileTap={{ scale: 0.98 }}
-                      >
-                        <Card
-                          isPressable
-                          onPress={() => setSelectedModel(model.id)}
-                          className={`${
-                            selectedModel === model.id
-                              ? 'border-2 border-' + model.color + '-500 bg-' + model.color + '-50'
-                              : 'border-2 border-transparent'
-                          }`}
-                        >
-                          <CardBody className="p-4">
-                            <div className="flex justify-between items-start">
-                              <div className="flex gap-3">
-                                <div className={'text-' + model.color + '-500'}>{model.icon}</div>
-                                <div>
-                                  <p className="font-bold text-sm">{model.name}</p>
-                                  <p className="text-xs text-gray-600 mt-1">{model.description}</p>
-                                </div>
-                              </div>
-                              {selectedModel === model.id && (
-                                <Check className="w-5 h-5 text-success-500" />
-                              )}
+          <ScrollShadow className="flex-1 p-4">
+            <Tabs aria-label="配置选项" variant="underlined">
+              <Tab key="model" title="模型">
+                <div className="space-y-3 mt-4">
+                  {AVAILABLE_MODELS.map((model) => (
+                    <Card
+                      key={model.id}
+                      isPressable
+                      onPress={() => setSelectedModel(model.id)}
+                      className={`hover:scale-102 transition-transform ${
+                        selectedModel === model.id
+                          ? 'border-2 border-' + model.color + '-500 bg-' + model.color + '-50'
+                          : 'border-2 border-transparent'
+                      }`}
+                    >
+                      <CardBody className="p-4">
+                        <div className="flex justify-between items-start">
+                          <div className="flex gap-3">
+                            <div className={'text-' + model.color + '-500'}>{model.icon}</div>
+                            <div>
+                              <p className="font-bold text-sm">{model.name}</p>
+                              <p className="text-xs text-gray-600 mt-1">{model.description}</p>
                             </div>
-                          </CardBody>
-                        </Card>
-                      </MotionDiv>
-                    ))}
-                  </div>
-                </Tab>
+                          </div>
+                          {selectedModel === model.id && (
+                            <Check className="w-5 h-5 text-success-500" />
+                          )}
+                        </div>
+                      </CardBody>
+                    </Card>
+                  ))}
+                </div>
+              </Tab>
 
-                <Tab key="tools" title="工具">
-                  <div className="mt-4">
-                    <p className="text-sm text-gray-600 mb-3">选择 AI 可以使用的工具</p>
-                    <CheckboxGroup value={selectedTools} onValueChange={setSelectedTools}>
-                      <div className="space-y-2">
-                        {AVAILABLE_TOOLS.map((tool) => (
-                          <MotionDiv key={tool.id} whileHover={{ x: 4 }}>
-                            <Checkbox value={tool.id} size="sm">
-                              <div className="flex items-center gap-2">
-                                {tool.icon}
-                                <span className="text-sm">{tool.name}</span>
-                              </div>
-                            </Checkbox>
-                          </MotionDiv>
-                        ))}
-                      </div>
-                    </CheckboxGroup>
-                  </div>
-                </Tab>
+              <Tab key="tools" title="工具">
+                <div className="mt-4">
+                  <p className="text-sm text-gray-600 mb-3">选择 AI 可以使用的工具</p>
+                  <CheckboxGroup value={selectedTools} onValueChange={setSelectedTools}>
+                    <div className="space-y-2">
+                      {AVAILABLE_TOOLS.map((tool) => (
+                        <Checkbox key={tool.id} value={tool.id} size="sm">
+                          <div className="flex items-center gap-2">
+                            {tool.icon}
+                            <span className="text-sm">{tool.name}</span>
+                          </div>
+                        </Checkbox>
+                      ))}
+                    </div>
+                  </CheckboxGroup>
+                </div>
+              </Tab>
 
-                <Tab key="stats" title="统计">
-                  <Card className="mt-4" variant="bordered">
-                    <CardBody className="p-4 space-y-3">
-                      <div className="flex justify-between items-center">
-                        <span className="text-sm text-gray-600">历史会话</span>
-                        <Badge color="primary" variant="flat">
-                          {sessions.length}
-                        </Badge>
-                      </div>
-                      <Divider />
-                      <div className="flex justify-between items-center">
-                        <span className="text-sm text-gray-600">当前消息</span>
-                        <Badge color="success" variant="flat">
-                          {messages.length}
-                        </Badge>
-                      </div>
-                      <Divider />
-                      <div className="flex justify-between items-center">
-                        <span className="text-sm text-gray-600">启用工具</span>
-                        <Badge color="secondary" variant="flat">
-                          {selectedTools.length}
-                        </Badge>
-                      </div>
-                    </CardBody>
-                  </Card>
-                </Tab>
-              </Tabs>
-            </ScrollShadow>
-          </MotionDiv>
-        )}
-      </AnimatePresence>
+              <Tab key="stats" title="统计">
+                <Card className="mt-4" variant="bordered">
+                  <CardBody className="p-4 space-y-3">
+                    <div className="flex justify-between items-center">
+                      <span className="text-sm text-gray-600">历史会话</span>
+                      <Badge color="primary" variant="flat">
+                        {sessions.length}
+                      </Badge>
+                    </div>
+                    <Divider />
+                    <div className="flex justify-between items-center">
+                      <span className="text-sm text-gray-600">当前消息</span>
+                      <Badge color="success" variant="flat">
+                        {messages.length}
+                      </Badge>
+                    </div>
+                    <Divider />
+                    <div className="flex justify-between items-center">
+                      <span className="text-sm text-gray-600">启用工具</span>
+                      <Badge color="secondary" variant="flat">
+                        {selectedTools.length}
+                      </Badge>
+                    </div>
+                  </CardBody>
+                </Card>
+              </Tab>
+            </Tabs>
+          </ScrollShadow>
+        </div>
+      )}
+
+      <style>{`
+        @keyframes fade-in {
+          from {
+            opacity: 0;
+            transform: translateY(10px);
+          }
+          to {
+            opacity: 1;
+            transform: translateY(0);
+          }
+        }
+
+        @keyframes slide-in-left {
+          from {
+            transform: translateX(-100%);
+            opacity: 0;
+          }
+          to {
+            transform: translateX(0);
+            opacity: 1;
+          }
+        }
+
+        @keyframes slide-in-right {
+          from {
+            transform: translateX(100%);
+            opacity: 0;
+          }
+          to {
+            transform: translateX(0);
+            opacity: 1;
+          }
+        }
+
+        @keyframes spin-slow {
+          from {
+            transform: rotate(0deg);
+          }
+          to {
+            transform: rotate(360deg);
+          }
+        }
+
+        .animate-fade-in {
+          animation: fade-in 0.3s ease-out;
+        }
+
+        .animate-slide-in-left {
+          animation: slide-in-left 0.3s ease-out;
+        }
+
+        .animate-slide-in-right {
+          animation: slide-in-right 0.3s ease-out;
+        }
+
+        .animate-spin-slow {
+          animation: spin-slow 3s linear infinite;
+        }
+
+        .hover\\:scale-102:hover {
+          transform: scale(1.02);
+        }
+
+        .hover\\:scale-105:hover {
+          transform: scale(1.05);
+        }
+      `}</style>
     </div>
   );
 };
 
 /**
- * 消息渲染器组件
+ * 消息渲染器
  */
 const MessageRenderer = ({ message, userAvatar }) => {
   switch (message.type) {
@@ -822,13 +792,11 @@ const MessageRenderer = ({ message, userAvatar }) => {
       return (
         <div className="flex justify-end">
           <div className="flex items-start gap-3 max-w-[75%]">
-            <MotionDiv whileHover={{ scale: 1.02 }}>
-              <Card className="bg-gradient-to-br from-blue-500 to-purple-500" shadow="lg">
-                <CardBody className="px-5 py-3">
-                  <p className="text-sm text-white whitespace-pre-wrap">{message.content}</p>
-                </CardBody>
-              </Card>
-            </MotionDiv>
+            <Card className="bg-gradient-to-br from-blue-500 to-purple-500 hover:scale-102 transition-transform" shadow="lg">
+              <CardBody className="px-5 py-3">
+                <p className="text-sm text-white whitespace-pre-wrap">{message.content}</p>
+              </CardBody>
+            </Card>
             <Avatar src={userAvatar} icon={<User className="w-4 h-4" />} size="sm" />
           </div>
         </div>
@@ -840,26 +808,19 @@ const MessageRenderer = ({ message, userAvatar }) => {
           <div className="flex items-start gap-3 max-w-[75%]">
             <Avatar
               icon={<Cpu className="w-4 h-4" />}
-              classNames={{
-                base: 'bg-gradient-to-br from-purple-500 to-pink-500',
-              }}
+              classNames={{ base: 'bg-gradient-to-br from-purple-500 to-pink-500' }}
               size="sm"
             />
-            <MotionDiv
-              animate={{ scale: [1, 1.02, 1] }}
-              transition={{ duration: 1.5, repeat: Infinity }}
-            >
-              <Card shadow="sm" variant="bordered">
-                <CardBody className="px-5 py-3">
-                  <div className="flex items-center gap-3">
-                    <Spinner size="sm" color="secondary" />
-                    <p className="text-sm text-purple-600 dark:text-purple-400 font-medium">
-                      {message.content}
-                    </p>
-                  </div>
-                </CardBody>
-              </Card>
-            </MotionDiv>
+            <Card shadow="sm" variant="bordered">
+              <CardBody className="px-5 py-3">
+                <div className="flex items-center gap-3">
+                  <Spinner size="sm" color="secondary" />
+                  <p className="text-sm text-purple-600 dark:text-purple-400 font-medium">
+                    {message.content}
+                  </p>
+                </div>
+              </CardBody>
+            </Card>
           </div>
         </div>
       );
@@ -870,57 +831,50 @@ const MessageRenderer = ({ message, userAvatar }) => {
           <div className="flex items-start gap-3 max-w-[85%]">
             <Avatar
               icon={<Cpu className="w-4 h-4" />}
-              classNames={{
-                base: 'bg-gradient-to-br from-blue-500 to-purple-500',
-              }}
+              classNames={{ base: 'bg-gradient-to-br from-blue-500 to-purple-500' }}
               size="sm"
             />
             <div className="flex-1 space-y-3">
-              <MotionDiv whileHover={{ scale: 1.01 }}>
-                <Card shadow="lg">
-                  <CardBody className="px-5 py-4">
-                    <p className="text-sm whitespace-pre-wrap leading-relaxed">{message.content}</p>
+              <Card shadow="lg" className="hover:scale-101 transition-transform">
+                <CardBody className="px-5 py-4">
+                  <p className="text-sm whitespace-pre-wrap leading-relaxed">{message.content}</p>
 
-                    {/* 操作按钮 */}
-                    <div className="flex items-center gap-2 mt-3 pt-3 border-t border-gray-200">
-                      <Tooltip content="复制回答">
-                        <Button
-                          isIconOnly
-                          size="sm"
-                          variant="light"
-                          onPress={() => navigator.clipboard.writeText(message.content)}
-                        >
-                          <Copy className="w-4 h-4" />
-                        </Button>
-                      </Tooltip>
-                      <Tooltip content="好评">
-                        <Button isIconOnly size="sm" variant="light">
-                          <ThumbsUp className="w-4 h-4" />
-                        </Button>
-                      </Tooltip>
-                      <Tooltip content="差评">
-                        <Button isIconOnly size="sm" variant="light">
-                          <ThumbsDown className="w-4 h-4" />
-                        </Button>
-                      </Tooltip>
+                  <div className="flex items-center gap-2 mt-3 pt-3 border-t border-gray-200">
+                    <Tooltip content="复制回答">
+                      <Button
+                        isIconOnly
+                        size="sm"
+                        variant="light"
+                        onPress={() => navigator.clipboard.writeText(message.content)}
+                      >
+                        <Copy className="w-4 h-4" />
+                      </Button>
+                    </Tooltip>
+                    <Tooltip content="好评">
+                      <Button isIconOnly size="sm" variant="light">
+                        <ThumbsUp className="w-4 h-4" />
+                      </Button>
+                    </Tooltip>
+                    <Tooltip content="差评">
+                      <Button isIconOnly size="sm" variant="light">
+                        <ThumbsDown className="w-4 h-4" />
+                      </Button>
+                    </Tooltip>
 
-                      {/* 元数据 */}
-                      {message.metadata && (
-                        <div className="flex-1 flex items-center justify-end gap-3 text-xs text-gray-500">
-                          <span>步骤: {message.metadata.total_steps}</span>
-                          <span>✓ {message.metadata.successful_steps}</span>
-                          {message.metadata.failed_steps > 0 && (
-                            <span>✗ {message.metadata.failed_steps}</span>
-                          )}
-                          <span>⏱ {message.metadata.total_execution_time?.toFixed(1)}s</span>
-                        </div>
-                      )}
-                    </div>
-                  </CardBody>
-                </Card>
-              </MotionDiv>
+                    {message.metadata && (
+                      <div className="flex-1 flex items-center justify-end gap-3 text-xs text-gray-500">
+                        <span>步骤: {message.metadata.total_steps}</span>
+                        <span>✓ {message.metadata.successful_steps}</span>
+                        {message.metadata.failed_steps > 0 && (
+                          <span>✗ {message.metadata.failed_steps}</span>
+                        )}
+                        <span>⏱ {message.metadata.total_execution_time?.toFixed(1)}s</span>
+                      </div>
+                    )}
+                  </div>
+                </CardBody>
+              </Card>
 
-              {/* 执行步骤（可展开） */}
               {message.stepResults && message.stepResults.length > 0 && (
                 <StepResultsPanel stepResults={message.stepResults} />
               )}
@@ -938,16 +892,11 @@ const MessageRenderer = ({ message, userAvatar }) => {
               classNames={{ base: 'bg-danger-500' }}
               size="sm"
             />
-            <MotionDiv
-              animate={{ x: [-2, 2, -2, 2, 0] }}
-              transition={{ duration: 0.4 }}
-            >
-              <Card className="border-2 border-danger-500 bg-danger-50">
-                <CardBody className="px-5 py-3">
-                  <p className="text-sm text-danger-700">{message.content}</p>
-                </CardBody>
-              </Card>
-            </MotionDiv>
+            <Card className="border-2 border-danger-500 bg-danger-50">
+              <CardBody className="px-5 py-3">
+                <p className="text-sm text-danger-700">{message.content}</p>
+              </CardBody>
+            </Card>
           </div>
         </div>
       );
@@ -958,7 +907,7 @@ const MessageRenderer = ({ message, userAvatar }) => {
 };
 
 /**
- * 步骤结果面板组件
+ * 步骤结果面板
  */
 const StepResultsPanel = ({ stepResults }) => {
   return (
@@ -975,49 +924,41 @@ const StepResultsPanel = ({ stepResults }) => {
       >
         <div className="space-y-2">
           {stepResults.map((result, idx) => (
-            <MotionDiv
+            <Card
               key={idx}
-              initial={{ x: -20, opacity: 0 }}
-              animate={{ x: 0, opacity: 1 }}
-              transition={{ delay: idx * 0.1 }}
+              className={`border-l-4 ${
+                result.status === 'success'
+                  ? 'border-l-success-500 bg-success-50'
+                  : result.status === 'failed'
+                  ? 'border-l-danger-500 bg-danger-50'
+                  : 'border-l-gray-500 bg-gray-50'
+              }`}
             >
-              <Card
-                className={`border-l-4 ${
-                  result.status === 'success'
-                    ? 'border-l-success-500 bg-success-50'
-                    : result.status === 'failed'
-                    ? 'border-l-danger-500 bg-danger-50'
-                    : 'border-l-gray-500 bg-gray-50'
-                }`}
-              >
-                <CardBody className="p-3">
-                  <div className="flex justify-between items-start mb-1">
-                    <div className="flex items-center gap-2">
-                      <p className="text-xs font-bold">
-                        步骤 {idx + 1}: {result.tool}
-                      </p>
-                      <Chip
-                        size="sm"
-                        color={
-                          result.status === 'success'
-                            ? 'success'
-                            : result.status === 'failed'
-                            ? 'danger'
-                            : 'default'
-                        }
-                        variant="flat"
-                      >
-                        {result.status}
-                      </Chip>
-                    </div>
-                    <p className="text-xs text-gray-500">{result.execution_time?.toFixed(2)}s</p>
+              <CardBody className="p-3">
+                <div className="flex justify-between items-start mb-1">
+                  <div className="flex items-center gap-2">
+                    <p className="text-xs font-bold">
+                      步骤 {idx + 1}: {result.tool}
+                    </p>
+                    <Chip
+                      size="sm"
+                      color={
+                        result.status === 'success'
+                          ? 'success'
+                          : result.status === 'failed'
+                          ? 'danger'
+                          : 'default'
+                      }
+                      variant="flat"
+                    >
+                      {result.status}
+                    </Chip>
                   </div>
-                  {result.error && (
-                    <p className="text-xs text-danger-600 mt-1">⚠️ {result.error}</p>
-                  )}
-                </CardBody>
-              </Card>
-            </MotionDiv>
+                  <p className="text-xs text-gray-500">{result.execution_time?.toFixed(2)}s</p>
+                </div>
+                {result.error && <p className="text-xs text-danger-600 mt-1">⚠️ {result.error}</p>}
+              </CardBody>
+            </Card>
           ))}
         </div>
       </AccordionItem>