設計
一眼找到自己的棋子：更大，卻仍能六個共處一格
棋盤上的棋子原本只有 15 畫素寬，很容易看丟。現在它們大了約一半——而且會沿著格子排開，而不是溢出格子。
通俗版
在棋盤上移動的彩色圓點原本只有 15 畫素寬。在手機上，當同一張棋盤還有另外五名玩家時，找到自己的棋子要費一番功夫——而知道自己在哪，是一款棋盤遊戲對其畫面最基本的要求。
現在它們是 23 畫素，約大了一半，白色描邊、當前玩家光暈和跳躍動畫也按同樣比例放大。棋盤的其他部分毫無變化：同樣的顏色、同樣的格子、同樣的佈局。
更大的棋子讓第二個問題變得顯眼：多名玩家同處一格。現在它們會沿著格子的長邊像扇形排開的硬幣一樣疊壓，因此即便六個棋子同在起點角，也仍待在格內。
技術細節
尺寸改動只涉及一個元件：直徑、描邊寬度和光暈都由同一個設計變數推導而來，跳躍弧線也相應抬高。編譯後的樣式表可以確認舊值確實消失了，而不只是被覆蓋。
佈局修復才是有意思的那一半。棋子原本以水平 flex 行排列，這對一個棋子沒問題，對四個就不對了：在狹窄的上下格——以及可能容納全部六個棋子的角格——它們乾脆溢出邊界，而 flex 的排布方式還把本應讓它們呈扇形展開的偏移量放大了一倍。
tsx
// Board.tsx — absolute-centred, offset along the cell's LONG axis
const offset = (i - (count - 1) / 2) * STACK_STEP;
const style = vertical
? { transform: `translate(-50%, calc(-50% + ${offset}px))` } // top/bottom + corners
: { transform: `translate(calc(-50% + ${offset}px), -50%)` }; // left/right columns驗證它需要的是瀏覽器而不是測試：按真實格子尺寸，把從兩個到六個的每種數量、每種格子朝向都渲染一遍，檢查有沒有被裁切。最初的溢出問題也正是這樣發現的——它在任何單元測試裡都不可見，因為在被繪製出來之前，一切看起來都沒有錯。