feat(설정 마우스): 카카오 공용 지도도 화면 옮기기 단추를 따름 — 가운데 늘 · 오른쪽 고르면 오른쪽도 (PLAN 588-5 · 요구 445 C3)

- 옮기기 단추 = 설정(isAuxPanButton) · 끌기 중 놓침 = buttonMask · 오른쪽 끌기 뒤 메뉴 안 뜸
- 왼쪽 끌기 · 표지 누름 · 손가락 = 카카오 제 것 그대로 · 휠 방향 그대로
- 시험: 설정 오른쪽 · 가운데 늘 · 왼쪽 안 가로챔 대조

Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>

ui_template/ui_template_kakao_map.ts

@@ -8,13 +8,19 @@
  *   (244-10) SDK 못 받음(도메인 미등록 401) = 지금 주소(location.origin) 등록 안내 한 줄
  *   (560-3) 바탕 종류 = `setType("ROADMAP" | "HYBRID")`(위성 + 지명) · 단추는 부르는 쪽 부품
  *   (585-1) 마우스 = ☰ [설정] 따름 — 휠 = 설정 확대 방향(카카오 제 휠은 잡는 단계에서 막음 · 한 단씩) ·
- *     가운데 끌기 = 옮김 · 왼쪽 끌기 · 손가락 = 카카오 제 것 · 표지 색 = `MapPin.color`(이름표 바탕)
+ *     옮기기 단추(588-5) = 설정(가운데 늘 · 오른쪽 고르면 오른쪽도) 끌기 = 옮김 · 왼쪽 끌기(표지 누름 포함)
+ *     · 손가락 = 카카오 제 것 · 표지 색 = `MapPin.color`(이름표 바탕)
  * ========================================================================== */
 
 import "./ui_template_kakao_map.css";
 import { API_BASE_URL } from "@config/config_frontend";
 import { el } from "./ui_template_elements";
-import { wheelEventIn } from "../A00_Common/input_prefs";
+import {
+  buttonMask,
+  guardMenuAfterDrag,
+  isAuxPanButton,
+  wheelEventIn,
+} from "../A00_Common/input_prefs";
 
 export const NO_MAP =
   "카카오 JavaScript 키 · 도메인 등록 필요 — 지도 대신 [그림 변경]으로 넣으세요";
@@ -146,7 +152,7 @@ function label(p: MapPin): HTMLElement {
 }
 
 /** 585-1 설정 따름 — 휠(잡는 단계 · 카카오에 안 넘김) = 설정 방향 한 단 · 마우스 자리 고정 ·
- *  가운데 끌기 = 옮김. 왼쪽 끌기 · 손가락은 카카오 제 것. */
+ *  설정 옮기기 단추(가운데 · 오른쪽) 끌기 = 옮김. 왼쪽 끌기 · 손가락은 카카오 제 것(왼쪽 옮김도 같음). */
 function followMouse(box: HTMLElement, map: KMap, maps: KakaoMaps): void {
   const pointAt = (x: number, y: number): LatLng =>
     map.getProjection().coordsFromContainerPoint(new maps.Point(x, y));
@@ -164,14 +170,15 @@ function followMouse(box: HTMLElement, map: KMap, maps: KakaoMaps): void {
     },
     { capture: true, passive: false },
   );
-  let drag: { id: number; x: number; y: number } | null = null;
+  let drag: { id: number; x: number; y: number; button: number } | null = null;
   box.addEventListener(
     "pointerdown",
     (event) => {
-      if (event.button !== 1) return;
+      if (event.pointerType !== "mouse" || !isAuxPanButton(event.button)) return;
       event.preventDefault(); // 브라우저 자동 굴림 막음
       event.stopPropagation();
-      drag = { id: event.pointerId, x: event.clientX, y: event.clientY };
+      guardMenuAfterDrag(event);
+      drag = { id: event.pointerId, x: event.clientX, y: event.clientY, button: event.button };
       box.setPointerCapture(event.pointerId);
     },
     { capture: true },
@@ -180,7 +187,7 @@ function followMouse(box: HTMLElement, map: KMap, maps: KakaoMaps): void {
     "pointermove",
     (event) => {
       if (!drag || event.pointerId !== drag.id) return;
-      if (!(event.buttons & 4)) return void (drag = null);
+      if (!(event.buttons & buttonMask(drag.button))) return void (drag = null);
       event.stopPropagation();
       const [dx, dy] = [event.clientX - drag.x, event.clientY - drag.y];
       [drag.x, drag.y] = [event.clientX, event.clientY];