1

src/components/puzzle-runtime/PuzzleRuntimeShell.tsx

@@ -331,7 +331,8 @@ type PuzzleHintDemoState = {
 
 /**
  * 拼图运行时壳层。
- * 前端仅维护轻量选中态与拖拽目标，交换、合并、拆分与通关全部以后端快照为准。
+ * 前端维护运行时即时交互：交换、拖动、合并、拆分与本关通关在前端裁决。
+ * 后端继续负责开始关卡、下一关候选、道具扣费、排行榜等服务侧能力。
  */
 export function PuzzleRuntimeShell({
   run,
@@ -1110,11 +1111,11 @@ export function PuzzleRuntimeShell({
           </div>
         </div>
 
-        <div className="absolute inset-0 flex items-center justify-center p-3 pt-28 pb-32 sm:p-4">
+        <div className="absolute inset-0 flex items-center justify-center px-1 py-3 pt-28 pb-32 sm:p-4">
           <div
             ref={boardRef}
             data-testid="puzzle-board"
-            className="relative grid aspect-[9/16] w-full max-w-[min(96vw,calc(56.25vh_-_8.5rem))] touch-none select-none overflow-hidden rounded-[1.2rem] border border-white/16 bg-white/8 shadow-[0_30px_80px_rgba(0,0,0,0.35)] backdrop-blur-sm sm:rounded-[1.45rem]"
+            className="relative grid aspect-square w-full max-w-[min(99vw,calc(100vh_-_16.5rem))] touch-none select-none overflow-hidden rounded-[1.2rem] border border-white/16 bg-white/8 shadow-[0_30px_80px_rgba(0,0,0,0.35)] backdrop-blur-sm sm:max-w-[min(92vw,calc(100vh_-_17rem))] sm:rounded-[1.45rem]"
             style={{
               gridTemplateColumns: `repeat(${board.cols}, minmax(0, 1fr))`,
               gridTemplateRows: `repeat(${board.rows}, minmax(0, 1fr))`,