영역 4 — /haru + /settings 깊이 평가

파일 단위 책임 분석 + 분리 권장. 근거 함께 제시.

/haru/page.tsx — 467줄, 책임 6개 혼재

현재 한 파일에 다음이 섞여 있습니다:

책임	현재 위치	분리 후 위치 (권장)
1. 메시지 fetch/save 상태	page.tsx 안 useState 다수	`hooks/useChatMessages.ts`
2. 키워드 감지 (운동·수면·커피·감정)	page.tsx 안 함수들	`lib/chat/keywords.ts`
3. 자동 저장 로직	page.tsx 안 `autoSaveFromChat()`	`hooks/useAutoSave.ts`
4. 마크다운 → HTML 변환	page.tsx 안 `renderMarkdown()`	`lib/markdown.ts`
5. 메시지 한 개 렌더	page.tsx JSX 인라인	`components/chat/ChatMessage.tsx`
6. 입력 영역	page.tsx JSX 인라인	`components/chat/ChatInput.tsx`
+ 신규 자동 저장 토스트	없음 — 사용자가 저장됐는지 모름	`components/ui/Toast.tsx` (재사용)

근거: 단일 책임 원칙(SRP). 467줄 한 파일은 AI도 사람도 reasoning 부담이 크고, 같은 키워드 로직을 친구 페이지 외에서 재사용할 때도 막힘. 분리하면 채팅 페이지가 ~80줄로 축소되고 각 책임이 독립 테스트·교체 가능.

/settings/page.tsx — 213줄, 양호

관찰	판단
파일 크기 적정 (213줄)	✓ 분리 불필요
API Key `type="password"`	✓ 기본 마스킹 OK
localStorage 저장	! 브라우저 평문 저장 — 단일 사용자 PWA로는 허용. 다중 기기 사용 시 Supabase 비밀 테이블로 이동 검토 (후속)
Calendar 동기화 UX	✓ syncing 상태 + 결과 메시지 명확
"친구들(모미/마음) AI 대화" 문구	✗ friends deprecate → "하루(어시스턴트) 대화에 사용"
버전 정보 노출 (있는지 확인 필요)	→ Stage 8에서 추가됨, 유지

영역 4 결정 (한꺼번에 채택 권장)

hooks 2개 + lib 2개 + components 2개로 추출. 채팅 페이지 본체 ~80줄.

채팅에서 "수면 7시간 저장됨" 같은 짧은 메시지가 1.5초간 화면에 떴다 사라지는 UI. 사용자가 자동 저장 결과를 인지하게 됨.

"친구들(모미/마음) AI 대화에 사용됩니다" → "하루(어시스턴트) 대화에 사용됩니다"

friends/page.tsx + CharacterTabs.tsx + MaeumView.tsx + MomiView.tsx (briefing 폴더 외 import 0회 확인됨). ~900줄 제거.

※ 1·2·3·4 모두 채택 권장. 다음 화면(영역 5 — 아키텍처/성능)이 이어집니다.