diff --git a/components/top-navbar.tsx b/components/top-navbar.tsx
index f51ab693f..1ada41943 100644
--- a/components/top-navbar.tsx
+++ b/components/top-navbar.tsx
@@ -473,23 +473,24 @@ export function TopNavbar({
     >
       <div 
         className="relative w-full max-w-[1200px]"
-        style={{ maxHeight: 'calc(100vh - 40px)' }}
+        style={{ maxHeight: 'calc(100vh - 80px)' }}
         onClick={(e) => e.stopPropagation()}
       >
-        {/* 关闭按钮 */}
-        <button
-          onClick={() => {
-            setShowTutorialModal(false);
-            setCurrentTutorialVideo(null);
-          }}
-          className="absolute -top-10 right-0 text-white hover:text-red-400 transition-colors z-10"
-          title="关闭 (ESC)"
-        >
-          <X className="h-8 w-8" />
-        </button>
-        
-        {/* 标题 */}
-        <h3 className="text-white text-lg font-medium mb-3 text-center truncate px-4">{currentTutorialVideo.title}</h3>
+        {/* 标题栏 - 包含标题和关闭按钮 */}
+        <div className="flex items-center justify-between mb-3 px-2">
+          <div className="w-8" /> {/* 占位符保持标题居中 */}
+          <h3 className="text-white text-lg font-medium truncate flex-1 text-center">{currentTutorialVideo.title}</h3>
+          <button
+            onClick={() => {
+              setShowTutorialModal(false);
+              setCurrentTutorialVideo(null);
+            }}
+            className="text-white hover:text-red-400 transition-colors z-10 p-1"
+            title="关闭 (ESC)"
+          >
+            <X className="h-8 w-8" />
+          </button>
+        </div>
         
         {/* 视频播放器 */}
         {currentTutorialVideo.videoUrl.includes('youtube.com') || currentTutorialVideo.videoUrl.includes('youtu.be') ? (