feat(app): 主页新增难度选择UI，游戏页读取localStorage难度参数

app/game/page.tsx

@@ -16,14 +16,12 @@ export default function GamePage() {
   const [hc, setHc] = useState(200)
   const [selectedTower, setSelectedTower] = useState<TowerType | null>(null)
   const [gameReady, setGameReady] = useState(false)
-  // expose setter to game scene via window
   const selectedTowerRef = useRef<TowerType | null>(null)
 
   const handleSelectTower = useCallback((type: TowerType) => {
     const next = selectedTowerRef.current === type ? null : type
     selectedTowerRef.current = next
     setSelectedTower(next)
-    // notify scene
     if (typeof window !== 'undefined') {
       (window as any).__gameSelectTower?.(next)
     }
@@ -39,6 +37,16 @@ export default function GamePage() {
 
       if (!mounted) return
 
+      // 从 localStorage 读取难度，通过 window 变量传给场景
+      if (typeof window !== 'undefined') {
+        const storedDifficulty = localStorage.getItem('game-difficulty')
+        if (storedDifficulty === 'easy' || storedDifficulty === 'normal' || storedDifficulty === 'hard') {
+          ;(window as any).__gameDifficulty = storedDifficulty
+        } else {
+          ;(window as any).__gameDifficulty = 'normal'
+        }
+      }
+
       const GameScene = createGameScene(Phaser)
       const config = createGameConfig('game-canvas-container')
       config.scene = [GameScene]
@@ -49,7 +57,6 @@ export default function GamePage() {
       }
       config.type = Phaser.AUTO
 
-      // expose HC update to React
       if (typeof window !== 'undefined') {
         (window as any).__gameOnHCChange = (val: number) => {
           if (mounted) setHc(val)
@@ -79,6 +86,7 @@ export default function GamePage() {
         delete (window as any).__gameOnTowerDeselect
         delete (window as any).__gameSelectTower
         delete (window as any).__gameReady
+        delete (window as any).__gameDifficulty
       }
     }
   }, [])
@@ -88,14 +96,14 @@ export default function GamePage() {
       className="w-full h-screen flex flex-col overflow-hidden"
       style={{ backgroundColor: '#0A1628' }}
     >
-      {/* Phaser canvas 区域，flex-1 填满剩余高度 */}
+      {/* Phaser canvas 区域 */}
       <div
         id="game-canvas-container"
         className="flex-1 min-h-0 w-full"
         style={{ backgroundColor: '#0A1628' }}
       />
 
-      {/* 底部塔选择面板 — 纯 React DOM，不被 Canvas 遮挡 */}
+      {/* 底部塔选择面板 */}
       <div
         style={{
           backgroundColor: 'rgba(10,18,40,0.97)',
@@ -141,7 +149,6 @@ export default function GamePage() {
                 transform: isSelected ? 'translateY(-3px)' : 'none',
               }}
             >
-              {/* 角色图片 */}
               <div style={{ width: '48px', height: '48px', position: 'relative', flexShrink: 0 }}>
                 {/* eslint-disable-next-line @next/next/no-img-element */}
                 <img
@@ -150,15 +157,12 @@ export default function GamePage() {
                   style={{ width: '100%', height: '100%', objectFit: 'contain', imageRendering: 'auto' }}
                 />
               </div>
-              {/* 名称 */}
               <span style={{ fontFamily: 'VT323, monospace', fontSize: '13px', color: meta.color, textAlign: 'center', lineHeight: 1.1 }}>
                 {meta.name}
               </span>
-              {/* 费用 */}
               <span style={{ fontFamily: "'Press Start 2P', monospace", fontSize: '8px', color: '#A78BFA' }}>
                 {meta.cost} HC
               </span>
-              {/* 描述 */}
               <span style={{ fontFamily: 'VT323, monospace', fontSize: '11px', color: '#64748B', textAlign: 'center' }}>
                 {meta.desc}
               </span>