四階段使用同一份檔案骨架。Checkpoint 只逐項完成任務，Solution 不加入延伸功能。
| 任務 | 完成標記 | 修改檔案 | 修改位置 | 可見結果 |
|---|---|---|---|---|
| TASK-01 讓圖片跟著容器縮放 | DONE-01 | style.css | .hero-media img | 320px 寬度不再出現圖片造成的水平捲動 |
| TASK-02 設定由內容決定的卡片斷點 | DONE-02 | style.css | .work-grid 與 680px media query | 手機一欄、較寬畫面兩欄 |
| TASK-03 讓手機導覽可換行且好點擊 | DONE-03 | style.css | .portfolio-nav 與導覽連結 | 導覽不溢出，每個連結保有足夠內距 |
階段差異
starter/：三項 TASK 都保留，先讀骨架與預測結果。checkpoint-1/：只完成 DONE-01。checkpoint-2/：保留 DONE-01，再完成 DONE-02。solution/：只在相同位置完成 DONE-03；沒有無關重構。
人工驗收
提供 320px、768px、桌機三張截圖，並在 320px 逐一點開導覽連結。