feat: 颜色按钮自适应居中 & 平板横竖屏 CTA 优化

- color-btns 在颜色数少、容器宽时自动居中，溢出时恢复 flex-start 可滚动
- 平板横屏 CTA 适当放大（max-width 240px，字号/高度提升）
- 平板竖屏 CTA 宽度匹配大屏 canvas（min(640px, 84vw)）

templates/coloring/assets/css/tools.css

@@ -250,6 +250,11 @@ body {
   display: none;
 }
 
+/* 颜色按钮不溢出时居中；溢出时恢复为 flex-start 允许滚动 */
+#color-btns.color-btns-centered {
+  justify-content: center;
+}
+
 .color-btn-container {
   position: relative;
   min-width: clamp(42px, 9vh, 56px);
@@ -642,6 +647,20 @@ body {
   }
 }
 
+/* 平板横屏：右侧栏空间更充足，CTA 可以适当放大 */
+@media (orientation: landscape) and (min-height: 600px) {
+  #cta-btn-wrapper {
+    max-width: 240px;
+  }
+
+  #cta-btn-wrapper #cta-btn {
+    height: clamp(52px, 8vh, 64px);
+    font-size: clamp(16px, 2.4vh, 20px);
+    letter-spacing: clamp(1px, 0.35vw, 3px);
+    padding: 0 14px;
+  }
+}
+
 /* 放在通用规则之后：平板竖屏先预留 logo/CTA，再让 game-col 吃掉中间剩余空间 */
 @media (orientation: portrait) and (min-width: 600px) {
   #game-col {
@@ -671,6 +690,14 @@ body {
     flex: 0 0 clamp(58px, 7vh, 76px);
     margin-top: 0;
   }
+
+  #cta-btn-wrapper #cta-btn {
+    width: min(640px, 84vw);
+    max-width: calc(100vw - 96px);
+    height: clamp(48px, 6vh, 64px);
+    font-size: clamp(18px, 2.2vh, 22px);
+    letter-spacing: clamp(1px, 0.3vw, 3px);
+  }
 }
 
 /* ── 宣传界面 ──────────────────────────────────────────── */

templates/coloring/src/filler/index.ts

@@ -115,7 +115,20 @@ async function init() {
     autoNext: true,
   };
 
-  window.addEventListener("resize", () => syncCanvasSize());
+  function syncColorBtnsAlign() {
+    const btns = document.getElementById("color-btns");
+    if (!btns) return;
+    if (btns.scrollWidth > btns.clientWidth) {
+      btns.classList.remove("color-btns-centered");
+    } else {
+      btns.classList.add("color-btns-centered");
+    }
+  }
+
+  window.addEventListener("resize", () => {
+    syncCanvasSize();
+    syncColorBtnsAlign();
+  });
 
   let resource = await loadResource();
 
@@ -247,6 +260,7 @@ async function init() {
   //scene.addLayer(new TextureLayer(scene, fillerData.mapTexure, width, height, width, height))
 
   createButtons(fillerData);
+  syncColorBtnsAlign();
   cssAdjustProgress(fillerData.data.coloredPercent);
 
   workLayer.initTask();