diff --git a/src/index.js b/src/index.js
index 510b097c..9d3dc670 100755
--- a/src/index.js
+++ b/src/index.js
@@ -6,6 +6,9 @@ import { BrowserRouter as Router } from 'react-router-dom';
 import './styles/brainwave.css';
 import './styles/brainwave-colors.css';
 
+// 导入 Bytedesk 客服系统 z-index 覆盖样式（必须在所有样式之后导入）
+import './styles/bytedesk-override.css';
+
 // Import the main App component
 import App from './App';
 
diff --git a/src/styles/bytedesk-override.css b/src/styles/bytedesk-override.css
new file mode 100644
index 00000000..b479b0b1
--- /dev/null
+++ b/src/styles/bytedesk-override.css
@@ -0,0 +1,35 @@
+/**
+ * Bytedesk 客服系统 z-index 覆盖样式
+ *
+ * 问题: Bytedesk 默认 z-index 为 10001，项目中部分元素使用 z-index: 99999
+ * 导致客服 iframe 在首页被内容区覆盖，不可见
+ *
+ * 解决方案: 将所有 Bytedesk 相关元素的 z-index 提升到 999999
+ * 确保客服窗口始终显示在最上层
+ */
+
+/* Bytedesk 主容器 - 客服图标按钮 */
+[class*="bytedesk"],
+[id*="bytedesk"],
+[class*="BytedeskWeb"] {
+  z-index: 999999 !important;
+}
+
+/* Bytedesk iframe - 聊天窗口 */
+iframe[src*="bytedesk"],
+iframe[src*="/chat/"],
+iframe[src*="/visitor/"] {
+  z-index: 999999 !important;
+}
+
+/* Bytedesk 覆盖层（如果存在） */
+.bytedesk-overlay,
+[class*="bytedesk-overlay"] {
+  z-index: 999998 !important;
+}
+
+/* Bytedesk 通知气泡 */
+.bytedesk-badge,
+[class*="bytedesk-badge"] {
+  z-index: 1000000 !important;
+}