feat(creator): 完成达人端前端页面开发

- 新增申诉中心页面（列表、详情、新建申诉）
- 新增申诉次数管理页面（按任务显示配额，支持向代理商申请）
- 新增个人中心页面（达人ID复制、菜单导航）
- 新增个人信息编辑、账户设置、消息通知设置页面
- 新增帮助中心和历史记录页面
- 新增脚本提交和视频提交页面
- 优化消息中心页面（消息详情跳转）
- 优化任务详情页面布局和交互
- 更新 ResponsiveLayout、Sidebar、ReviewSteps 通用组件

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

frontend/components/layout/ResponsiveLayout.tsx

@@ -1,44 +1,96 @@
 'use client'
 
-import { useEffect, useState } from 'react'
-import { MobileLayout } from './MobileLayout'
-import { DesktopLayout } from './DesktopLayout'
+import { useState, useEffect } from 'react'
+import { Menu, X } from 'lucide-react'
+import { Sidebar } from '../navigation/Sidebar'
+import { cn } from '@/lib/utils'
 
 interface ResponsiveLayoutProps {
   children: React.ReactNode
   role?: 'creator' | 'agency' | 'brand'
-  showBottomNav?: boolean
+  className?: string
 }
 
 export function ResponsiveLayout({
   children,
   role = 'creator',
-  showBottomNav = true,
+  className = '',
 }: ResponsiveLayoutProps) {
-  const [isMobile, setIsMobile] = useState(true)
+  const [isMobile, setIsMobile] = useState(false)
+  const [sidebarOpen, setSidebarOpen] = useState(false)
 
   useEffect(() => {
     const checkMobile = () => {
-      setIsMobile(window.innerWidth < 1024)
+      const mobile = window.innerWidth < 1024
+      setIsMobile(mobile)
+      // 大屏幕自动关闭抽屉
+      if (!mobile) {
+        setSidebarOpen(false)
+      }
     }
-
     checkMobile()
     window.addEventListener('resize', checkMobile)
     return () => window.removeEventListener('resize', checkMobile)
   }, [])
 
-  if (isMobile) {
-    return (
-      <MobileLayout role={role} showBottomNav={showBottomNav}>
-        {children}
-      </MobileLayout>
-    )
-  }
+  // 点击遮罩关闭侧边栏
+  const closeSidebar = () => setSidebarOpen(false)
 
   return (
-    <DesktopLayout role={role}>
-      {children}
-    </DesktopLayout>
+    <div className={cn('min-h-screen bg-bg-page', className)}>
+      {/* 移动端：汉堡菜单按钮 */}
+      {isMobile && !sidebarOpen && (
+        <button
+          type="button"
+          onClick={() => setSidebarOpen(true)}
+          className="fixed top-4 left-4 z-50 w-10 h-10 rounded-xl bg-bg-card flex items-center justify-center card-shadow"
+        >
+          <Menu className="w-5 h-5 text-text-primary" />
+        </button>
+      )}
+
+      {/* 移动端：遮罩层 */}
+      {isMobile && sidebarOpen && (
+        <div
+          className="fixed inset-0 z-40 bg-black/50 transition-opacity"
+          onClick={closeSidebar}
+        />
+      )}
+
+      {/* 侧边栏 */}
+      <div
+        className={cn(
+          'fixed left-0 top-0 bottom-0 z-sidebar transition-transform duration-300',
+          isMobile
+            ? sidebarOpen
+              ? 'translate-x-0'
+              : '-translate-x-full'
+            : 'translate-x-0'
+        )}
+      >
+        <Sidebar role={role} />
+        {/* 移动端：关闭按钮 */}
+        {isMobile && sidebarOpen && (
+          <button
+            type="button"
+            onClick={closeSidebar}
+            className="absolute top-4 right-4 w-8 h-8 rounded-lg bg-bg-elevated flex items-center justify-center"
+          >
+            <X className="w-4 h-4 text-text-secondary" />
+          </button>
+        )}
+      </div>
+
+      {/* 主内容区 */}
+      <main
+        className={cn(
+          'min-h-screen transition-all duration-300',
+          isMobile ? 'ml-0 pt-16 px-4 pb-6' : 'ml-[260px] p-8'
+        )}
+      >
+        {children}
+      </main>
+    </div>
   )
 }