fix(site,skill): 두레 왼쪽 인셋 리듬 수리 — 제목이 가장자리에 붙어 보이던 사고(v23)

사용자 스크린샷을 픽셀 판정으로 해부: 앱바·검색·칩·카드는 24px에서 시작하는데 h2만 16px — 8px 어긋난 큰 명조 제목이 '가장자리에 붙었다'로 읽혔다. .layout 모바일 인셋을 24px로 통일.
- 게이트 공백: 기존 매트릭스는 오른쪽 오버플로만 검사 — e2e 에 M6 왼쪽 인셋 스위트 신설(60단언, 텍스트 시작점 ≥12px + 헤더-제목 같은 축 ±10px), RED 38 실패로 결함 재현 후 GREEN
- 측정 하자 2건 교정: display:none rect=0 필터, 전폭 컨테이너 보더박스가 아닌 텍스트 시작점 기준
- 스킬 mobile-app-ux.md: '왼쪽 인셋은 하나의 축' 규칙 추가. 시각 기준 갱신, verify L0~L6 전 통과(E2E 1,805단언)

apps/site/public/work/dure-enrollment/index.html

@@ -35,7 +35,7 @@
       rel="stylesheet"
       href="https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500&family=IBM+Plex+Sans+KR:wght@400;500;600&family=Noto+Serif+KR:wght@500;600&display=swap"
     />
-    <link rel="stylesheet" href="./styles/main.css?v=22" />
+    <link rel="stylesheet" href="./styles/main.css?v=23" />
     <link
       rel="icon"
       href="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Crect width='32' height='32' rx='7' fill='%23fafafa'/%3E%3Crect x='6.5' y='6.5' width='19' height='19' rx='4' fill='%23c2410c'/%3E%3Crect x='9.5' y='10' width='5.5' height='4.5' rx='1' fill='%23ffffff'/%3E%3Crect x='16' y='10' width='6.5' height='4.5' rx='1' fill='%23ffffff' opacity='0.8'/%3E%3Crect x='9.5' y='15.8' width='5.5' height='9.2' rx='1' fill='%23ffffff' opacity='0.9'/%3E%3Crect x='16' y='15.8' width='6.5' height='6.2' rx='1' fill='%23ffffff' opacity='0.75'/%3E%3C/svg%3E"

apps/site/public/work/dure-enrollment/styles/main.css

@@ -520,11 +520,13 @@ tbody tr:hover { background: var(--muted); }
   .timetable-panel { position: static; }
   .notice-list li { grid-template-columns: minmax(0, 1fr); gap: var(--space-1); }
   .no-kind, .no-date { justify-self: start; }
-  /* 모바일 앱 — 내비는 바텀 탭으로(HIG·M3), 앱바는 safe-area 를 존중한다 */
+  /* 모바일 앱 — 내비는 바텀 탭으로(HIG·M3), 앱바는 safe-area 를 존중한다.
+     본문 인셋은 앱바(24px)와 같은 축 — 제목이 카드·앱바보다 왼쪽으로 튀면 리듬이
+     무너져 '가장자리에 붙었다'로 읽힌다(실측 사고: 제목 16 vs 앱바·카드 24 혼재) */
   .tabs { display: none; }
   .appbar { padding-top: var(--safe-top); }
   .layout {
-    padding: var(--space-4) max(var(--space-4), var(--safe-right)) calc(72px + var(--safe-bottom)) max(var(--space-4), var(--safe-left));
+    padding: var(--space-4) max(var(--space-5), var(--safe-right)) calc(72px + var(--safe-bottom)) max(var(--space-5), var(--safe-left));
   }
 }
 @media (max-width: 680px) {