优化推荐位置居中显示逻辑，计算画布偏移量以提升用户交互体验。

src/app/focus/page.tsx

@@ -264,16 +264,44 @@ export default function FocusMode() {
 
   // 处理定位到推荐位置
   const handleLocateRecommended = useCallback(() => {
-    if (focusState.recommendedCell) {
-      // 计算需要的偏移量使推荐格子居中
+    if (focusState.recommendedCell && gridDimensions) {
       const { row, col } = focusState.recommendedCell;
-      // 这里简化处理，实际需要根据画布尺寸计算
+      
+      // 计算格子大小（与FocusCanvas中的计算保持一致）
+      const cellSize = Math.max(15, Math.min(40, 300 / Math.max(gridDimensions.N, gridDimensions.M)));
+      
+      // 计算推荐格子在画布上的像素位置（格子中心）
+      const targetX = (col + 0.5) * cellSize;
+      const targetY = (row + 0.5) * cellSize;
+      
+      // 计算画布总尺寸
+      const canvasWidth = gridDimensions.N * cellSize;
+      const canvasHeight = gridDimensions.M * cellSize;
+      
+      // 假设可视区域的尺寸（减去UI元素的空间）
+      const viewportWidth = window.innerWidth;
+      const viewportHeight = window.innerHeight - 200; // 减去顶部和底部UI的高度
+      
+      // 计算需要的偏移量，使目标位置居中显示
+      // 考虑到transform: scale() translate()的顺序，offset是在缩放后应用的
+      // 我们需要让画布中心对齐到视口中心，然后再偏移到目标位置
+      const canvasCenterX = canvasWidth / 2;
+      const canvasCenterY = canvasHeight / 2;
+      
+      // 目标位置相对画布中心的偏移
+      const targetOffsetX = targetX - canvasCenterX;
+      const targetOffsetY = targetY - canvasCenterY;
+      
+      // 最终偏移量：让画布中心对齐视口中心，然后减去目标偏移
+      const offsetX = (viewportWidth / 2) / focusState.canvasScale - canvasCenterX - targetOffsetX;
+      const offsetY = (viewportHeight / 2) / focusState.canvasScale - canvasCenterY - targetOffsetY;
+      
       setFocusState(prev => ({
         ...prev,
-        canvasOffset: { x: -col * 20, y: -row * 20 } // 假设每个格子20px
+        canvasOffset: { x: offsetX, y: offsetY }
       }));
     }
-  }, [focusState.recommendedCell]);
+  }, [focusState.recommendedCell, focusState.canvasScale, gridDimensions]);
 
   if (!mappedPixelData || !gridDimensions) {
     return (