feat(M02): 47-5 일위대가 줄 누름 = 고름 하이라이트 · [옵션] 단추로 넣을 값 모달 · 줄 단추 공용 묶음

- 단가산출 로직 표 줄 누름 = 고른 줄 하이라이트(로직 키 · 다시 그려도 유지) · 넣을 값 모달은 새 [옵션] 단추
- 줄 단추 이름 위로 · 아래로 · 옵션 · 삭제(빨강) · 카드 갈래 = 옵션 · 삭제
- 공용 단추 묶음 `ui-btn-group` · 간격 토큰 `--btn-group-gap`(4px) — 이 표에만 적용
- 시험: test_m02_card_shell 낡은 글 맞춤 + 47-5 확인 · 화면 시나리오 ui_checks/47-5_일위대가_줄_고름.js

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

M02_MasterTemplete/M02_MasterTemplete_Labor_Detail.ts

@@ -2,7 +2,8 @@
  * M02_MasterTemplete_Labor_Detail.ts
  * 일위대가 상세(39-3) — 구조물 열마다 하나(`labor/<열>.json`) · UI_Main 종류 `labor` 가 이 부품을 붙임
  * (양식 길 읽기 · [저장] · [다시 읽기]는 UI_Main). 차례 = 정보(단위 · 본뜬) → 담은 로직 → 자재목록 → 다이어그램.
- *  · 담은 로직 줄 누름 = 입력 모달(`Labor_Input`) · [확인] = 화면 캐시만 · 저장은 [저장]
+ *  · 담은 로직 줄 누름 = 고름(하이라이트 · 다시 그려도 유지 · 47-5) · [옵션] = 입력 모달(`Labor_Input`) ·
+ *    [확인] = 화면 캐시만 · 저장은 [저장]
  *  · 금액 = 서버 calc(기준 ③ · 최신 응답만 · 저장 안 함) · 고칠 때마다 뒤에서 다시 셈
  *  · 같은 로직 두 번 · 같은 자재 두 번 막음 · 빈 일위대가도 저장 됨
  * ========================================================================== */
@@ -57,8 +58,8 @@ export interface LaborDetailOptions {
   onChanged: (dirty: boolean) => void;
   /** 「면적산출에서 잇기」 — 그 열 면적산출 상세로(옮겨 가면 참 · 취소 = 거짓 · 없으면 단추 없음) */
   goArea: GoArea | null;
-  /** 구조물 조합 카드 갈래(43-4) — 단가산출 로직 표 + 자재목록만 · 올리기 · 내리기 · 로직 추가 ·
-   * 정보(단위 · 본뜬) · 다이어그램 없음 · 빼기 · 자재 추가 · 줄 · 수량 모달은 상세와 같음 */
+  /** 구조물 조합 카드 갈래(43-4) — 단가산출 로직 표 + 자재목록만 · 위로 · 아래로 · 로직 추가 ·
+   * 정보(단위 · 본뜬) · 다이어그램 없음 · 옵션 · 삭제 · 자재 추가 · 줄 · 수량 모달은 상세와 같음 */
   card?: boolean;
 }
 
@@ -84,6 +85,8 @@ export function mountLaborDetail(
   let seq = 0;
   let timer = 0;
   let alive = true;
+  /** 고른 줄 로직 키(47-5) — 키로 둬서 순서가 바뀌어도 따라감 */
+  let picked: string | null = null;
   /** 그 열 면적산출의 알약 → 칸 · 값(저장본 · 서버 calc 와 같은 것) */
   let links = new Map<string, { 칸: string; 값: number | null }>();
   const cells = (): Map<string, string> => new Map([...links].map(([k, v]) => [k, v.칸]));
@@ -133,17 +136,18 @@ export function mountLaborDetail(
   const draw = (): void => {
     logicHost.replaceChildren(
       logicTable(
-        { rows: cur.담은로직, logics, calc, fail, cells: cells() },
-        // 읽기만이면 순서 · 빼기 없음(줄 누름 = 보기 모달은 둠)
+        { rows: cur.담은로직, logics, calc, fail, cells: cells(), selected: picked },
+        // 읽기만이면 순서 · 삭제 없음([옵션] = 보기 모달은 둠)
         edit
           ? {
-              open: openRow,
+              open: pick,
+              option: openRow,
               qty: openQty,
               ...(opt.card ? {} : { move }),
               remove: removeRow,
               alias: setAlias,
             }
-          : { open: openRow },
+          : { open: pick, option: openRow },
       ),
     );
     matHost.replaceChildren(
@@ -265,7 +269,14 @@ export function mountLaborDetail(
     [cur.담은로직[i], cur.담은로직[j]] = [cur.담은로직[j], cur.담은로직[i]];
     changed();
   }
+  /** 줄 고름(47-5) — 하이라이트만(표만 · 다이어그램 안 다시 그림) · 화면 캐시 안 바뀜 */
+  function pick(i: number): void {
+    picked = cur.담은로직[i].로직;
+    for (const tr of logicHost.querySelectorAll<HTMLElement>("[data-labor-logic],[data-labor-opt]"))
+      tr.classList.toggle("is-selected", (tr.dataset.laborLogic ?? tr.dataset.laborOpt) === picked);
+  }
   function removeRow(i: number): void {
+    if (cur.담은로직[i].로직 === picked) picked = null;
     cur.담은로직.splice(i, 1);
     changed();
   }