fix(sw): 2026-10-21 SW design review and responsive header without More from 760px

User-approved design review (2026-10-21):
- SW Header: from 760px up nothing moves into More; the five menus stay with their
  titles (titles and values ellipsize), file name shrinks to 96px. Open next to the
  logo no longer blocks field shrinking above 760px (760/768 overflow fixed, also for
  configured `controls` headers). Dropdown yellow ring inside the button, black seam.
- Property Bar values as read-only red text; property popup "=" labels, read-only
  black values, per-entry hover with pointer.
- Home Menu recent files (3 rows, path + name caption, empty preview), Footer + slot
  guide off by default, Viewer file list without icons, Storybook widths 1920-760.
- Tests: old More expectations (integrated-improvement, keyboard-dismiss,
  footer-popup-viewer-refinement, storybook-cleanup-stage1) moved to the new rule;
  functional checks kept.

packages/sw/ai/DESIGN_RULES.md

@@ -82,7 +82,9 @@
 
 ## 7. 반응형 (`SWHeader` 전용)
 
-Container `hm-sw-header` 기준 Breakpoint: **< 1800** 선/문자/치수스타일 → More, **< 1180** 그리기모드 숨김, **< 1080** 상세보기 → More·창 이동 24px(창 영역 176), **< 900** 색상 → More, **< 640** 인쇄·K → More·창 이동 숨김(창 영역 64), **< 520** 레이어 상태 아이콘 숨김. More에서 고른 필드는 첫 칸(레이어 자리)에 표시되고 Dropdown이 바로 열립니다(UI 상태만, 데이터 Callback 없음).
+**760px 이상(2026-10-21 사용자 결정):** More 없이 5개 메뉴(레이어·색상·선스타일·문자스타일·치수스타일)를 항상 Header에 둡니다. 로고 옆 Open 유무와 관계없이 넘치지 않으며, 좁아질수록 **< 1800** 그리기모드 글자·선/치수 그림 숨김·간격 축소 → 파일명 축소(최소 96px, `…`) → 정보값 `…` 순으로 공간을 줄입니다. 메뉴 타이틀은 모든 폭에서 표시하며 공간이 부족하면 `…`로 줄어듭니다. **< 1080** 레이어 상태 아이콘·색상 칩·글꼴 이름 숨김, **≤ 900** 선스타일은 선스타일 값만. Dropdown 열기·닫기는 그대로입니다. 아래 Breakpoint·실측 More는 **760px 미만**에만 적용됩니다.
+
+760px 미만 Container `hm-sw-header` 기준 Breakpoint: **< 1800** 선/문자/치수스타일 → More, **< 1180** 그리기모드 숨김, **< 1080** 상세보기 → More·창 이동 24px(창 영역 176), **< 900** 색상 → More, **< 640** 인쇄·K → More·창 이동 숨김(창 영역 64), **< 520** 레이어 상태 아이콘 숨김. More에서 고른 필드는 첫 칸(레이어 자리)에 표시되고 Dropdown이 바로 열립니다(UI 상태만, 데이터 Callback 없음).
 
 실측 More(2026-10-19): Breakpoint 위에서 객체 수정 영역의 실제 남은 공간을 측정해, `leading`·`tools`·긴 라벨 등으로 표시할 수 없는 메뉴만 같은 단계 순서(선/문자/치수 → 그리기모드 → 속성 블록 → 색상 → 구성형의 인쇄·K, 같은 단계는 오른쪽부터)로 More에 옮기고 공간이 생기면 역순으로 돌려놓습니다. 로고 옆 Open이 가장 먼저 옮겨집니다(좁아질 때). 넓어질 때(2026-10-20 수정안 A): Breakpoint로 막 돌아온 부분(인쇄·K, 색상, 속성 블록, 선/문자/치수, 그리기모드)은 실제 남은 공간이 있을 때만 돌아오고 없으면 More에 남으며, 다시 나타난 Open은 넓어지는 동안 다른 부분 때문에 More로 돌아가지 않습니다. 충분히 넓으면 모두 돌아옵니다. 메뉴 열기·닫기는 Header 요소의 위치·폭을 바꾸지 않습니다. 호스트 요소(`leading`·`tools`)는 More로 옮기지 않으므로 폭이 좁은 화면에는 많이 넣지 않습니다.
 
@@ -108,7 +110,9 @@ Container `hm-sw-header` 기준 Breakpoint: **< 1800** 선/문자/치수스타
 | 동작 | Non-modal(Dim·Portal·Focus trap 없음). Escape는 Popup 안이면 그 Popup, 밖이면 최근 사용 Popup 하나. `autoFocus`면 열릴 때 Focus, 안에서 닫히면 원래 위치로 | — |
 
 - **Header 필드 Dropdown(`SWHeaderLayerMenu`·`SWHeaderColorMenu`·선/문자/치수 스타일)은 SWHeader 전용 디자인입니다.** Popup 안에 넣지 않습니다(2026-10-20 사용자 확정). Popup의 레이어·색상·선스타일은 속성창 컨트롤 `SWPopupPropertyRow`(속성창과 같은 `picker` 필드: 레이어 26:12250, 색상 26:12170, 선스타일 26:12388 — 값 `#E60403`, Hover 1px `rgba(33,29,19,.4)`, On `#211D13`, 목록은 고정 Overlay)를 씁니다. 그 밖의 행은 `SWPopupRow` + `SWHeaderInput`.
-- 선택 목록(단위 등)은 `SWSelect`입니다(native select, 28px · 좌우 8 · 1px `#948871` · radius 4 · 면 `#F1ECE1` · 12px 검정, 플랫폼 화살표·옵션 목록). 뷰어 축척 지정 팝업과 같은 모양이고 뷰어 패널 안에서는 `--hm-sw-viewer-panel-*` 값을 따릅니다. 토큰 `--hm-sw-select-border-color`·`-background`·`-text`.
+- 선택 목록(단위 등)은 `SWSelect`입니다(native select, 28px · 좌우 8 · 1px `#948871` · radius 4 · 면 `#F1ECE1` · 12px, 플랫폼 화살표·옵션 목록). 선택값은 변경 가능한 값이라 `#E60403`(2026-10-21), Disabled 값과 옵션 목록은 검정입니다. 뷰어 축척 지정 팝업과 같은 모양이고 뷰어 패널 안에서는 `--hm-sw-viewer-panel-*` 값(글자색 포함)을 따릅니다. 토큰 `--hm-sw-select-border-color`·`-background`·`-text`(Disabled 값·옵션 목록; Popup 안 선택값 빨강은 규칙으로 적용).
+- **속성값 색상(2026-10-21 사용자 확정):** 빨강 `#E60403`은 실제로 수정 가능한 값에만 씁니다. 밝은 속성창·Popup에서 수정할 수 없는 값(`readOnly`·`type: "computed"`·Disabled, Callback 없는 행)은 검정입니다. 어두운 속성Bar는 Bar에서 편집하지 않는 값을 포커스 없는 텍스트(`<output>`)로 보여 주며, 속성창에서 수정하는 값(원의 반지름·지름·원주·면적)은 빨강을 유지합니다. 클릭할 수 있다는 이유만으로 빨강을 쓰지 않습니다.
+- **속성창 입력(2026-10-21):** 숫자 값(선 가중치 포함)의 편집 Input은 값 영역 전체 너비를 채웁니다. 투명도는 값 + `annotation`(예 `(ByL)`)이 하나의 편집 상자이고 그 뒤에 게이지바·단위가 옵니다. 속성창 선꼴(`picker: "lineStyle"`) Dropdown은 선 종류 목록 1열(미리보기 + 이름)만 표시합니다. `menus.lineWeights`·`lineScale` 등은 속성창 Dropdown에 표시되지 않으며 SWHeader 선스타일 필드는 기존 3열을 유지합니다.
 - 게이지바는 `SWSlider`입니다. 모양 선택 우선순위: ① `appearance` Prop(명시) → ② 기본 `"panel"`. 테마 연동은 토큰 범위입니다: `panel` = `--hm-sw-slider-panel-track`(`#E0DACE`)·`-range`(`#266651`)·`-thumb`(`#FFFFFF`), `property` = `--hm-sw-property-range-fill`·`-fill-edge`·`-track`·`-highlight`(속성창과 같은 토큰). `SWTheme style`·Runtime 토큰 Override로 두 모양의 색이 함께 바뀌며, 테마 전체에서 기본 `appearance`를 바꾸는 설정은 없습니다. 새 색을 만들지 않습니다.
 - Popup 하단 버튼의 SW 디자인은 없습니다. 임의 색·크기로 만들지 말고 `@hm-design/ui` `Button` 등 기존 컴포넌트를 쓰거나 사용자에게 디자인을 확인합니다.