feat(M02): 구조물 조합 다이어그램 [작게] · [크게] · [한눈에] = 아이콘 단추(− · + · ⤢ · 글은 title · aria-label)(128-1)

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01MgChuAcyBqUkhHMTXomQC7

M02_MasterTemplete/M02_MasterTemplete_Labor_Diagram.css

@@ -17,6 +17,12 @@
   gap: var(--spacing-8);
 }
 
+/* 아이콘 단추(128-1) — 기호 하나 · 정사각에 가깝게 */
+.m02-labordg__icon {
+  min-width: 1.75rem;
+  font-size: var(--text-body);
+}
+
 .m02-labordg__zoom {
   min-width: 3em;
   font-weight: var(--font-weight-bold);

M02_MasterTemplete/M02_MasterTemplete_Labor_Diagram.ts

@@ -251,6 +251,14 @@ function mountShell(host: HTMLElement): State {
     children: [world],
   });
   const label = el("span", { className: "m02-labordg__zoom" });
+  /** 아이콘 단추(128-1) — 공용 단추 + B05 · B06 확대 단추와 같은 기호 · 글은 title · aria-label */
+  const icon = (glyph: string, key: keyof typeof TEXT, onClick: () => void): HTMLButtonElement => {
+    const b = createButton({ label: glyph, variant: "ghost", size: "sm", onClick });
+    b.classList.add("m02-labordg__icon");
+    b.title = td(key);
+    b.setAttribute("aria-label", td(key));
+    return b;
+  };
   const st: State = {
     view: { x: 0, y: 0, zoom: 1, fitted: false },
     viewport,
@@ -263,24 +271,9 @@ function mountShell(host: HTMLElement): State {
     el("div", {
       className: "m02-labordg__bar",
       children: [
-        createButton({
-          label: td("Zoom_Out"),
-          variant: "ghost",
-          size: "sm",
-          onClick: () => zoomAt(st, 1 / 1.2),
-        }),
-        createButton({
-          label: td("Zoom_In"),
-          variant: "ghost",
-          size: "sm",
-          onClick: () => zoomAt(st, 1.2),
-        }),
-        createButton({
-          label: td("Fit"),
-          variant: "ghost",
-          size: "sm",
-          onClick: () => fit(st, true),
-        }),
+        icon("−", "Zoom_Out", () => zoomAt(st, 1 / 1.2)),
+        icon("+", "Zoom_In", () => zoomAt(st, 1.2)),
+        icon("⤢", "Fit", () => fit(st, true)),
         label,
         el("span", { className: "m02-labordg__hint", text: td("Hint") }),
       ],