diff --git a/web/src/components/Shell.jsx b/web/src/components/Shell.jsx
index 8318745..9e66382 100644
--- a/web/src/components/Shell.jsx
+++ b/web/src/components/Shell.jsx
@@ -1,6 +1,73 @@
-import { useState, useRef, useEffect, useCallback } from 'react'
+import { useState, useRef, useEffect, useCallback, useMemo } from 'react'
+import { Terminal as XTerm } from '@xterm/xterm'
+import { FitAddon } from '@xterm/addon-fit'
+import { WebLinksAddon } from '@xterm/addon-web-links'
+import { Plus, X, Monitor, Globe, ChevronDown, Pencil, Trash2, Search, Copy, Send, Eye, Bot } from 'lucide-react'
+import '@xterm/xterm/css/xterm.css'
 import { useI18n } from '../i18n'
-import { Monitor } from 'lucide-react'
+
+const AI_TAB_ID = 0
+const MAX_TABS = 7
+const SHELL_MAX_TOKENS = 100000
+const TABS_STORAGE_KEY = 'muyue_shell_tabs'
+const TERMINAL_BUFFER_KEY = 'muyue_terminal_buffers'
+
+function renderContent(text) {
+  const parts = []
+  const codeBlockRegex = /(```[\s\S]*?```)/g
+  let match
+  let lastIndex = 0
+  while ((match = codeBlockRegex.exec(text)) !== null) {
+    if (match.index > lastIndex) {
+      parts.push({ type: 'text', content: text.slice(lastIndex, match.index) })
+    }
+    const full = match[1]
+    const firstNewline = full.indexOf('\n')
+    const lang = firstNewline > -1 ? full.slice(3, firstNewline).trim() : ''
+    const code = firstNewline > -1 ? full.slice(firstNewline + 1, -3) : full.slice(3, -3)
+    parts.push({ type: 'code', lang, content: code })
+    lastIndex = match.index + full.length
+  }
+  if (lastIndex < text.length) {
+    const remaining = text.slice(lastIndex)
+    const openBlock = remaining.match(/```(\w*)\n?([\s\S]*)$/)
+    if (openBlock) {
+      if (openBlock.index > 0) {
+        parts.push({ type: 'text', content: remaining.slice(0, openBlock.index) })
+      }
+      parts.push({ type: 'code', lang: openBlock[1] || '', content: openBlock[2] || '' })
+    } else {
+      parts.push({ type: 'text', content: remaining })
+    }
+  }
+  return parts
+}
+
+function formatText(text) {
+  let html = text
+    .replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;')
+
+  html = html
+    .replace(/\*\*(.+?)\*\*/g, '<strong>$1</strong>')
+    .replace(/`([^`]+)`/g, '<code class="inline-code">$1</code>')
+    .replace(/^### (.+)$/gm, '<h4 class="msg-h4">$1</h4>')
+    .replace(/^## (.+)$/gm, '<h3 class="msg-h3">$1</h3>')
+    .replace(/^# (.+)$/gm, '<h2 class="msg-h2">$1</h2>')
+    .replace(/^\s*[-*] (.+)$/gm, '<div class="msg-bullet">• $1</div>')
+    .replace(/^\s*(\d+)[.)] (.+)$/gm, '<div class="msg-step"><span class="msg-step-num">$1</span> $2</div>')
+    .replace(/\n/g, '<br/>')
+
+  html = html
+    .replace(/<br\/>\s*<br\/>/g, '<br/>')
+    .replace(/<br\/>\s*(<h[234]|<div class="msg-)/g, '$1')
+    .replace(/(<\/h[234]|<\/div>)\s*<br\/>/g, '$1')
+    .replace(/\s+on\w+=["'][^"']*["']/gi, '')
+    .replace(/javascript:/gi, '')
+    .replace(/data:/gi, '')
+
+  return html
+}
+
 // === Style thème système pour xterm ===
 function getCSSVariable(varName) {
   if (typeof document === 'undefined') return null;
@@ -237,9 +304,6 @@ function connectWebSocket(term, fitAddon, initPayload, onStateChange, onFirstMes
 }
 
 export default function Shell({ api }) {
-  const MAX_TABS = 7
-  const TABS_STORAGE_KEY = 'muyue_shell_tabs'
-  const TERMINAL_BUFFER_KEY = 'muyue_terminal_buffers'
   const { t } = useI18n()
   const tabsRef = useRef({})
   const nextIdRef = useRef(1)