docs(dev): Playwright 헤드리스 스크린샷 가이드 추가

- screenshot-guide.py: 로컬 Chrome 헤드리스로 7개 주요 페이지 캡처
- 출력 경로: /tmp/bibimbap-screenshots/ (Claude Design 연동용)
- index.md 링크 추가

Co-Authored-By: Claude Sonnet 4.6 (1M context) <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_017mhnv7hDExHaXUmbaYAxZd

docs/development/index.md

@@ -8,6 +8,7 @@
 - [document-category-classification.md](./document-category-classification.md) — 카테고리 분류 기준 (불필요한 카테고리는 프로젝트에 맞게 정리)
 - [agent-output-conventions.md](./agent-output-conventions.md) — 에이전트 출력 규약. 사용자 대면 의사결정 제시문엔 압축 비적용(배경+선택지+권장 풀어쓰기), 압축은 내부 산출물 한정
 - [git-workflow.md](./git-workflow.md) — 브랜치 분류(메인스트림 vs 비-메인스트림) · 비-메인스트림 브랜치 커밋 표준 승인 · push 명시 요청 한정 · Conventional Commits + `Co-Authored-By` 트레일러 규약. CLAUDE.md '작업 원칙' 커밋 정책의 정본.
-- [local-dev-setup.md](./local-dev-setup.md) — 로컬 구동 환경 설정. 업로드 저장 루트(`~/.bibimbap/uploads`, static 트리 밖) 경로 규약 · @Value 기본값 유지 근거 · 자산 이전 이력 · SSRF DNS 캐시 운영 참고.
+- [local-dev-setup.md](./local-dev-setup.md)
+- [screenshot-guide.md](./screenshot-guide.md) — Playwright 헤드리스 스크린샷. `python3 docs/development/screenshot-guide.py` → `/tmp/bibimbap-screenshots/*.png`. Claude Design 등 외부 디자인 툴 연동용. — 로컬 구동 환경 설정. 업로드 저장 루트(`~/.bibimbap/uploads`, static 트리 밖) 경로 규약 · @Value 기본값 유지 근거 · 자산 이전 이력 · SSRF DNS 캐시 운영 참고.
 
 > atp 플러그인 번들 레퍼런스(`agent-team-protocol.md`, `agent-catalog.md`, `documentation-guidelines.md`, `search-tool-matrix.md`)는 플러그인 캐시에 있으며 이 프로젝트로 복사되지 않는다. 에이전트가 `${CLAUDE_PLUGIN_ROOT}/docs/...` 로 직접 참조한다.

docs/development/screenshot-guide.md

@@ -0,0 +1,65 @@
+# 페이지 스크린샷 가이드
+
+앱 실행 중 각 페이지를 파일로 저장하는 방법. Claude Design 등 외부 도구에 전달할 때 사용.
+
+## 전제 조건
+
+- 앱 실행 중 (`docker compose up`)
+- Python 3 + playwright 설치됨
+
+```bash
+pip3 install playwright
+# 브라우저 다운로드 불필요 — 로컬 Chrome 사용
+```
+
+## 스크립트
+
+```python
+import os
+from playwright.sync_api import sync_playwright
+
+CHROME = "/Applications/Google Chrome.app/Contents/MacOS/Google Chrome"
+OUT_DIR = "/tmp/bibimbap-screenshots"
+BASE_URL = "http://localhost:8080"
+
+pages = [
+    ("/", "01-home.png"),
+    ("/login", "02-login.png"),
+    ("/signup", "03-signup.png"),
+    ("/posts", "04-posts-list.png"),
+    ("/recruit", "05-recruit-list.png"),
+    ("/game/3", "06-game-detail.png"),
+    ("/terms", "07-terms.png"),
+]
+
+os.makedirs(OUT_DIR, exist_ok=True)
+
+with sync_playwright() as p:
+    browser = p.chromium.launch(
+        executable_path=CHROME,
+        headless=True,
+        args=["--no-sandbox"]
+    )
+    page = browser.new_page(viewport={"width": 1400, "height": 900})
+
+    for path, filename in pages:
+        page.goto(f"{BASE_URL}{path}", wait_until="networkidle")
+        page.screenshot(path=os.path.join(OUT_DIR, filename), full_page=True)
+        print(f"✓ {filename}")
+
+    browser.close()
+```
+
+## 실행
+
+```bash
+python3 docs/development/screenshot-guide.py
+# 결과: /tmp/bibimbap-screenshots/*.png
+```
+
+## 주의
+
+- 헤드리스 모드는 다크 테마 미적용 (시스템 prefers-color-scheme 무시)
+- 로그인 필요 페이지는 세션 없이 리다이렉트됨
+- `/tmp/bibimbap-screenshots/` 는 재부팅 시 삭제 — 영구 저장 필요하면 경로 변경
+- Claude Design에 넘길 때 "다크 테마로 리디자인" 프롬프트에 명시

docs/development/screenshot-guide.py

@@ -0,0 +1,35 @@
+import os
+from playwright.sync_api import sync_playwright
+
+CHROME = "/Applications/Google Chrome.app/Contents/MacOS/Google Chrome"
+OUT_DIR = "/tmp/bibimbap-screenshots"
+BASE_URL = "http://localhost:8080"
+
+pages = [
+    ("/", "01-home.png"),
+    ("/login", "02-login.png"),
+    ("/signup", "03-signup.png"),
+    ("/posts", "04-posts-list.png"),
+    ("/recruit", "05-recruit-list.png"),
+    ("/game/3", "06-game-detail.png"),
+    ("/terms", "07-terms.png"),
+]
+
+os.makedirs(OUT_DIR, exist_ok=True)
+
+with sync_playwright() as p:
+    browser = p.chromium.launch(
+        executable_path=CHROME,
+        headless=True,
+        args=["--no-sandbox"]
+    )
+    page = browser.new_page(viewport={"width": 1400, "height": 900})
+
+    for path, filename in pages:
+        page.goto(f"{BASE_URL}{path}", wait_until="networkidle")
+        page.screenshot(path=os.path.join(OUT_DIR, filename), full_page=True)
+        print(f"✓ {filename}")
+
+    browser.close()
+
+print(f"\n완료: {OUT_DIR}/")