移动端添加汉堡菜单和侧边导航栏，优化交互体验

前端改动：
- 添加移动端汉堡菜单按钮（右上角）
- 创建侧边导航栏（从右侧滑入）
  - 包含主导航菜单项
  - 包含文档和控制台链接
  - 包含登录/注册功能
  - 已登录状态显示用户信息和操作菜单
- 移动端隐藏桌面导航链接（文档、控制台、登录、注册）
- 侧边栏支持点击遮罩层、关闭按钮、导航链接关闭
- 实现桌面端和移动端登录状态同步
- 使用 MutationObserver 监听登录状态变化

样式改动：
- 汉堡菜单三条杠动画效果（点击变叉号）
- 侧边栏深色科技风格，渐变背景
- 侧边栏从右侧滑入动画，带遮罩层
- 导航项 hover 效果和滑动动画
- 用户头像和信息卡片样式
- 响应式适配（767px、575px 断点）

交互优化：
- banner-list 快速入口卡片改为一行两个（grid 布局）
- 调整幻灯片进度条位置（767px: bottom 40px，575px: bottom 60px）
- 避免进度条和按钮重合

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>

public/header.html

@@ -29,16 +29,16 @@
       </div>
     </div>
     <div class="nav-right">
-      <a href="/document.html" class="nav-text-link">文档</a>
-      <span class="nav-divider">|</span>
-      <a href="/home.htm" class="nav-text-link">控制台</a>
-      <span class="nav-divider">|</span>
-      <div class="no-login" style="display: none;">
+      <a href="/document.html" class="nav-text-link nav-desktop-link">文档</a>
+      <span class="nav-divider nav-desktop-link">|</span>
+      <a href="/home.htm" class="nav-text-link nav-desktop-link">控制台</a>
+      <span class="nav-divider nav-desktop-link">|</span>
+      <div class="no-login nav-desktop-link" style="display: none;">
         <span class="nav-text-link" id="loginBtn">登录</span>
         <span class="nav-divider">|</span>
         <div class="btn btn-normal" id="registBtn"><span class="regist-text">立即注册</span></div>
       </div>
-      <div class="login-in " style="display: none;">
+      <div class="login-in nav-desktop-link" style="display: none;">
         <div id="headImg" class="head-img"></div>
         <span class="ml-10 font-el1 name" id="username"></span>
         <div class="login-menu animated fadeIn">
@@ -51,6 +51,12 @@
           <div class="login-menu-item" id="logout">退出账户</div>
         </div>
       </div>
+      <!-- 移动端汉堡菜单按钮 -->
+      <div class="mobile-menu-toggle" id="mobileMenuToggle">
+        <span></span>
+        <span></span>
+        <span></span>
+      </div>
     </div>
   </div>
 
@@ -90,7 +96,76 @@
 
 </div>
 
-
+<!-- 移动端侧边导航栏 -->
+<div class="mobile-sidebar" id="mobileSidebar">
+  <div class="mobile-sidebar-overlay" id="mobileSidebarOverlay"></div>
+  <div class="mobile-sidebar-content">
+    <div class="mobile-sidebar-header">
+      <div class="mobile-sidebar-logo">
+        <img src="{$data.official_website_logo|default='/web/BlackFruit-web/assets/img/index/logo.png'}" alt="">
+      </div>
+      <div class="mobile-sidebar-close" id="mobileSidebarClose">
+        <span>✕</span>
+      </div>
+    </div>
+    <div class="mobile-sidebar-body">
+      <!-- 主导航菜单 -->
+      {if isset($data.header_nav) && !empty($data.header_nav)}
+        {foreach $data.header_nav as $k=>$item}
+          {if $k > 0}
+            <div class="mobile-nav-item">
+              {if !empty($item.file_address)}
+                <a href="{$item.file_address}" {if !empty($item.blank)}target="_blank"{/if} class="mobile-nav-link">
+                  {$item.name}
+                </a>
+              {else /}
+                <div class="mobile-nav-link">{$item.name}</div>
+              {/if}
+            </div>
+          {/if}
+        {/foreach}
+      {/if}
+      <!-- 分隔线 -->
+      <div class="mobile-nav-divider"></div>
+      <!-- 文档和控制台 -->
+      <div class="mobile-nav-item">
+        <a href="/document.html" class="mobile-nav-link">文档</a>
+      </div>
+      <div class="mobile-nav-item">
+        <a href="/home.htm" class="mobile-nav-link">控制台</a>
+      </div>
+      <!-- 登录注册（未登录状态） -->
+      <div class="mobile-nav-actions mobile-no-login" style="display: none;">
+        <div class="mobile-nav-item">
+          <span class="mobile-nav-link" id="mobileLoginBtn">登录</span>
+        </div>
+        <div class="mobile-nav-item">
+          <div class="mobile-nav-btn" id="mobileRegistBtn">立即注册</div>
+        </div>
+      </div>
+      <!-- 用户信息（已登录状态） -->
+      <div class="mobile-nav-user mobile-login-in" style="display: none;">
+        <div class="mobile-nav-divider"></div>
+        <div class="mobile-user-info">
+          <div class="mobile-user-avatar" id="mobileHeadImg"></div>
+          <div class="mobile-user-name" id="mobileUsername"></div>
+        </div>
+        <div class="mobile-nav-item">
+          <span class="mobile-nav-link" id="mobileAccountBtn">账户信息</span>
+        </div>
+        <div class="mobile-nav-item">
+          <span class="mobile-nav-link" id="mobileFinanceBtn">未付款订单</span>
+        </div>
+        <div class="mobile-nav-item">
+          <span class="mobile-nav-link" id="mobileTicketBtn">我的工单</span>
+        </div>
+        <div class="mobile-nav-item">
+          <span class="mobile-nav-link" id="mobileLogout">退出账户</span>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
 
 <!-- 侧边 -->
 <!-- 回到顶部按钮 - 独立在侧边工具栏上方 -->