feat(sw): add step header process tokens and align docs

packages/ui/ai/DESIGN_RULES.md

@@ -30,7 +30,7 @@ Brown·Orange 계열 팔레트(`--hm-sem-palette-brown-*`, `--hm-sem-palette-ora
 | 페이지·콘텐츠 배경 | `--hm-sem-bg-content` | Beige |
 | 카드·팝업 표면 | `--hm-sem-bg-surface` | White |
 | 보조 면 | `--hm-sem-bg-subtle` | warm-neutral-muted |
-| 브랜드 배경(gradient) | `--hm-sem-bg-brand`, `--hm-sem-bg-brown`, `--hm-sem-bg-orange` | 세로 gradient(GNB·Brand 버튼 면) |
+| 브랜드 배경(gradient) | `--hm-sem-bg-brand`, `--hm-sem-bg-brown`, `--hm-sem-bg-orange` | 공통 세로 gradient 배경(소비 화면 배경용). 패키지 컴포넌트(GNB·Button·Dashboard)에는 자동 연결되지 않음 — GNB 면은 `--hm-gnb-background`(저장소 `docs/guidelines/runtime-theme-contract.md` "Brown·Orange 공통 Background") |
 | 기본 글자 | `--hm-sem-fg-primary` | green-dark-1 |
 | 보조 글자 | `--hm-sem-fg-secondary` | warm-neutral-dark |
 | placeholder | `--hm-sem-fg-placeholder` | gray-500 |

packages/ui/src/theme/lnb.css

@@ -1,5 +1,5 @@
 /* LNB pattern (layout visual reference: D:\컴포넌트\ui-viz Patterns/LNB, implementation: HM Collapsible + plain elements).
-   A 272px green column: horizontal 5-stop surface, brand on top, menu in the middle, text-only profile at the bottom. The current
+   A 240px green column (--hm-lnb-width; 272px before 2026-11-09): horizontal 5-stop surface, brand on top, menu in the middle, text-only profile at the bottom. The current
    item is a Beige face (left corners rounded) that runs to the content edge and joins it through two concave corners; hover is
    Black 10% to the same edge; an open group is a Black 8% face with a 1px green line. Spacing values are pattern-local. */
 :root, [data-hm-theme] {