refactor(game): 重构项目结构,优化链路, 移动端适配

- 移除 useGameBoardVm 数据层实施说明文档
- 移除核心玩法与前端规则摘要文档
- 移除游戏模块数据与界面分层第一阶段实施稿文档
- 清理与数据层重构相关的技术方案说明
- 删除关于 PC 和 Mobile 界面分离的设计规划
- 移除 view-model hooks 架构设计相关内容

src/features/game/components/mobile/mobile-header.tsx

@@ -7,15 +7,15 @@ import {
   VolumeX,
   Wifi,
 } from 'lucide-react'
+import { motion } from 'motion/react'
 import { useTranslation } from 'react-i18next'
 import avatar from '@/assets/system/avatar.webp'
+import chatImage from '@/assets/system/chat.webp'
 import diamond from '@/assets/system/diamond.webp'
 import logo from '@/assets/system/logo.webp'
 import { SmartImage } from '@/components/smart-image.tsx'
-import {
-  useHeaderClockLabel,
-  useHeaderVm,
-} from '@/features/game/hooks/use-header-vm'
+import { useHeaderClockLabel, useHeaderVm } from '@/hooks/use-header-vm'
+import { useModalStore } from '@/store'
 
 function MobileHeaderClock() {
   const systemTimeLabel = useHeaderClockLabel()
@@ -29,6 +29,7 @@ function MobileHeaderClock() {
 
 export function MobileHeader() {
   const { t } = useTranslation()
+  const setModalOpen = useModalStore((state) => state.setModalOpen)
   const {
     authStatus,
     currentLanguageLabel,
@@ -53,7 +54,7 @@ export function MobileHeader() {
 
   return (
     <header className="sticky top-0 z-30 h-design-62">
-      <div className="border-b-2 border-[#787553] bg-[#020B14]] bg-[#020B14] flex h-design-33 w-full items-center">
+      <div className="border-b-2 border-[#787553] bg-[#020B14] flex h-design-33 w-full items-center">
         <div className="flex h-design-23 w-design-130 shrink-0 items-center justify-center border-r border-[rgba(128,223,231,0.45)] px-design-10">
           <SmartImage
             src={logo}
@@ -64,6 +65,20 @@ export function MobileHeader() {
           />
         </div>
 
+        <button
+          type="button"
+          onClick={onOpenLanguage}
+          className={`${actionButtonClassName} !px-design-10 justify-between`}
+        >
+          <SmartImage
+            src={currentLanguageOption.icon}
+            alt={currentLanguageLabel}
+            className="h-design-14 w-design-14 shrink-0 rounded-full"
+            imgClassName="object-cover"
+          />
+          <div className="min-w-0 truncate">{currentLanguageLabel}</div>
+        </button>
+
         {authStatus === 'authenticated' ? (
           <div className="flex h-full min-w-0 flex-1 items-center justify-end gap-design-7 px-design-9">
             <button
@@ -213,19 +228,20 @@ export function MobileHeader() {
             </div>
           </button>
 
-          <button
+          <motion.button
             type="button"
-            onClick={onOpenLanguage}
-            className={`${actionButtonClassName} !px-design-10 justify-between`}
+            onClick={() => setModalOpen('desktopSupport', true)}
+            whileTap={{
+              scale: 0.95,
+            }}
+            whileHover={{ scale: 1.05 }}
           >
             <SmartImage
-              src={currentLanguageOption.icon}
-              alt={currentLanguageLabel}
-              className="h-design-14 w-design-14 shrink-0 rounded-full"
-              imgClassName="object-cover"
+              className={'h-design-20 w-design-20 cursor-pointer'}
+              alt={'chatImage'}
+              src={chatImage}
             />
-            <div className="min-w-0 truncate">{currentLanguageLabel}</div>
-          </button>
+          </motion.button>
         </div>
       </div>
     </header>