레이어 패널을 [200]SheetMe 아웃라인으로 교체 — 페이지 노드·선택 밴드·드래그 재정렬

[200] 의 패널은 코드로 Border 를 쌓는 비가상화 렌더고 SheetMe 는 가상화 ListBox 다.
골격은 SheetMe 것을 지키고 겉모습과 조작 표면만 옮겼다 — 통째로 베끼면 1,067 컨트롤
서식에서 검색어 한 글자마다 수천 비주얼을 다시 만들게 되고, [200] 에 대응물이 없는
컨테이너 자식 재귀 표시가 사라진다.

구조
- 페이지를 별도 섹션이 아니라 아웃라인의 최상위 노드로. 접기·복제·삭제·컨트롤 수·현재 강조
- 맨 아래 '+ 페이지 추가' 행
- 목록 순서를 뒤집었다 — 이제 맨 위가 z-order 최상위(캔버스에서 위에 겹쳐 보이는 것이 목록 위)
- 들여쓰기 12 / 32 / +16
- 레이어 패널을 LayerPanelView 로 분리(MainView.xaml 이 1,000줄을 넘겼고, 진단 렌더러가
  이 패널만 따로 찍어 라이트·다크·선택 상태를 검사할 수 있어야 한다)

선택 표시
- IsSelected 가 아니라 Highlight 3상태(None/Blue/Navy)가 배경을 그린다. 그룹 전원 선택 시
  폴더는 파랑, 멤버는 서브트리 배경이 되고 맞닿는 모서리를 각지게 해 하나의 블록으로 이어진다
- 밴드 위에서는 아이콘·보조 텍스트 색도 함께 뒤집는다. 안 그러면 눈·자물쇠가 1.6:1 로 묻혀
  선택한 행에서만 잠금 상태가 안 보이는 상태가 된다
- 신설 토큰 3종(B.LayerSel / B.LayerSubtree / B.OnSelMuted) — [200] 원본값은 각각
  흰 글자 3.00:1, 다크 밴드 1.03:1, 라이트 밴드 1.14:1 로 이 저장소가 이미 기각한 값이다

기능
- 드래그로 z-order 재정렬(삽입선 어도너). 임의 index 이동 연산 MoveWithinParent 신설
- 페이지 복제 — 컨트롤 이름을 전부 새로 발급하고 그룹도 복제본끼리 다시 묶는다
  ([200] 은 GroupId 를 그대로 둬서 복제 그룹이 원본과 gid 를 공유한다)
- 페이지 헤더 클릭 → 캔버스가 그 페이지로 이동(ScrollToPage)
- 데이터 배선 배지 — 값이 조회·데이터소스에서 오는 컨트롤 표시
- 검색칩에 테두리(라이트에서 B.Input=B.Panel 이라 경계 대비가 1.00:1 이었다)

이식하지 않은 것: 컨트롤 행 인라인 개명. [200] 이 고치는 값은 표시 전용 별칭이지만
SheetMe 의 컨트롤 이름은 외부 참조 키라 목록에서 무심코 고치면 배선이 끊긴다.
더블클릭은 요청대로 캔버스 이동을 유지하고, 그룹 행에서만 이름 편집으로 간다.

동반 수정: 눈·자물쇠 토글에 되돌리기 지점 추가(400ms 코얼레스), 그룹 이름 비우기 경로가
스냅숏 없이 지워지던 것, 숨김 흐리기를 행 전체가 아니라 이름 줄에만.

편집 스모크의 레이어 검사 19 → 42건. 회귀: 테스트 124/124, 편집 스모크 실패 0,
DB 왕복 1,271건 diff 0/예외 0, 종이 렌더 P062 바이트 동일.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>

src/SheetMe.Designer/Diagnostics/DialogShots.cs

@@ -128,9 +128,68 @@ public static class DialogShots
             ("12-inspector-behavior", () => HostInspector(designer, "TextBox1", InspectorTab.Behavior)),
             ("13-layer-type-filter", () => new Views.LayerTypeFilterDialog(
                 designer.LayerTypeCandidates(), new[] { "Label" })),
+            // 레이어 아웃라인 — 선택 없음 / 컨트롤 하나 선택 / 그룹 전체 선택 세 상태를 각각 찍는다.
+            // 강조는 IsSelected 가 아니라 Highlight 3상태가 그리므로 눈으로 확인할 경로가 이것뿐이다.
+            ("14-layer-plain", () => HostLayerPanel(designer, LayerShotMode.None)),
+            ("15-layer-selected", () => HostLayerPanel(designer, LayerShotMode.Single)),
+            ("16-layer-group", () => HostLayerPanel(designer, LayerShotMode.Group)),
         };
     }
 
+    /// <summary>레이어 패널 스냅숏의 선택 상태</summary>
+    private enum LayerShotMode
+    {
+        /// <summary>선택 없음</summary>
+        None,
+
+        /// <summary>컨트롤 하나 선택 — 파란 밴드 하나</summary>
+        Single,
+
+        /// <summary>그룹 전체 선택 — 폴더 파랑 + 멤버 서브트리, 이어진 블록</summary>
+        Group,
+    }
+
+    /// <summary>
+    /// 레이어 패널을 실제 패널 폭(255px)의 창에 담는다.
+    /// MainViewModel 을 통째로 만들면 DB 조회가 딸려 오므로, 패널이 읽는 <c>CurrentDesigner</c> 하나만
+    /// 들고 있는 최소 DataContext 를 세워 준다.
+    /// </summary>
+    private static Window HostLayerPanel(DesignerViewModel designer, LayerShotMode mode)
+    {
+        designer.Selection.Clear();
+        designer.SetLayerTypeFilter(Array.Empty<string>());
+        designer.LayerFilter = string.Empty;
+
+        var page = designer.Pages[0];
+        if (mode != LayerShotMode.None && page.Controls.Count >= 3)
+        {
+            designer.Selection.Set(new[] { page.Controls[^1], page.Controls[^2] });
+            designer.GroupSelection();
+            if (mode == LayerShotMode.Single)
+            {
+                designer.Selection.SetSingle(page.Controls[0]);
+            }
+        }
+        designer.RebuildLayerRows();
+
+        return new Window
+        {
+            Title = $"레이어 — {mode}",
+            Width = 255,
+            Height = 620,
+            Content = new Views.LayerPanelView { DataContext = new LayerShotContext(designer) },
+            Background = Application.Current.TryFindResource("B.Panel") as Brush,
+        };
+    }
+
+    /// <summary>패널이 바인딩하는 <c>CurrentDesigner</c> 만 노출하는 스냅숏 전용 DataContext</summary>
+    private sealed class LayerShotContext
+    {
+        public LayerShotContext(DesignerViewModel designer) => CurrentDesigner = designer;
+
+        public DesignerViewModel CurrentDesigner { get; }
+    }
+
     /// <summary>인스펙터를 실제 패널 폭(300px)의 창에 담는다 — 컨트롤 하나를 선택한 상태로</summary>
     private static Window HostInspector(DesignerViewModel designer, string controlId,
         InspectorTab tab = InspectorTab.Design)