docs: 오후 9시 이후 UI 작업 내용 추가

- 입력창 textarea 변환 및 자동 줄바꿈 구현
- 입력창 선택/복사/붙여넣기 문제 해결
- 모바일 활동 버튼 위치 조정
- 모바일 UI 선택 영역 디버깅
- UI 버튼 자동 숨김 시간 단축 (5초→3초)

troubleshooting/250730_happybell80_프론트엔드로빙연결.md

@@ -632,5 +632,116 @@ self.cli_timeout = 60  # 변경 후
 1. **데이터 분리**: UI 텍스트와 메타데이터는 분리하여 관리
 2. **사용자 친화적 단위**: ms보다 초 단위가 직관적
 
+## 오후 9시 23분
+
+### z-index 계층 구조 전면 재정리
+
+**문제**: 여러 UI 요소들의 z-index가 꼬여서 클릭이 안 되는 문제 발생
+
+**z-index 분석**:
+```
+z-10: 입력창 터치 영역 (너무 낮음)
+z-20: 스킬/활동 힌트 띠
+z-30: 메뉴 힌트 띠, 스킬/활동 버튼 영역
+z-40: 메뉴 터치 영역, 패널 배경
+z-50: 헤더, 푸터, 패널, 아바타, 팝업
+```
+
+**해결**:
+1. 메뉴 터치 영역: z-40 → z-30
+2. 메뉴 힌트 띠: z-30 → z-20 (통일)
+3. 입력창 터치 영역: z-10 → z-35
+
+## 오후 9시 26분
+
+### 보내기 버튼 및 아바타 클릭 문제 해결
+
+**문제**:
+1. 보내기 버튼이 클릭되지 않음
+2. 아바타 클릭 시 활동창이 열림
+
+**원인**:
+1. 입력창 터치 영역이 전체를 덮어 버튼을 가림
+2. 활동 버튼 영역이 너무 넓어 아바타 위치와 겹침
+
+**해결**:
+1. 입력창 터치 영역: `inset-x-0` → `left-0 right-[60px]`
+2. 활동 버튼 너비: `w-[10vw] min-w-[50px]` → `w-[35px]`
+
+## 오후 9시 35분
+
+### 입력창 textarea 변환 및 자동 줄바꿈 구현
+
+**요구사항**:
+- 입력창에 긴 텍스트 입력 시 자동 줄바꿈
+- 최대 5줄까지 표시, 초과 시 스크롤
+- Enter: 전송, Shift+Enter: 줄바꿈
+
+**구현**:
+1. **input → textarea 변경**
+2. **Canvas API로 텍스트 너비 측정**:
+   ```tsx
+   const canvas = document.createElement('canvas');
+   const context = canvas.getContext('2d');
+   context.font = `${fontSize}px ${computedStyle.fontFamily}`;
+   const width = context.measureText(line).width;
+   ```
+3. **입력창 너비의 100% 도달 시 자동 줄바꿈**
+4. **rows state로 동적 높이 조정** (1~5줄)
+
+**문제 해결**:
+- 선택/복사/붙여넣기 막힘 → 터치 영역 오버레이 제거
+
+## 오후 9시 46분
+
+### 입력창 선택/복사/붙여넣기 문제 해결
+
+**문제**: 터치 영역 확장용 투명 오버레이가 textarea를 덮어 텍스트 선택 불가
+
+**해결**: 오버레이 div 완전 제거
+- 터치 영역 확장 기능은 포기하고 직접 클릭 방식 채택
+
+## 오후 9시 54분
+
+### 모바일 활동 버튼 위치 조정
+
+**목표**: 스킬 버튼과 시각적 대칭 구현
+
+**과정**:
+1. 활동 버튼 텍스트: "활동" → "최근활동"
+2. 버튼 위치 계산:
+   - 스킬 버튼 상단: 위에서 28.75vh
+   - 활동 버튼 상단: 아래에서 28.75vh + 버튼높이
+3. 여러 시도 끝에 `bottom-[20vh]`로 설정
+
+**선택 영역 정리**:
+- 활동 영역: `top-[35vh] bottom-[60px]` (힌트 띠와 동일)
+- 모든 선택 영역 너비/높이 35px로 통일
+
+## 오후 10시 39분
+
+### 모바일 UI 선택 영역 디버깅
+
+**디버깅 방법**: 반투명 배경색으로 선택 영역 시각화
+- 메뉴: 녹색 (`bg-green-500/20`)
+- 스킬: 파란색 (`bg-blue-500/20`)
+- 활동: 빨간색 (`bg-red-500/20`)
+
+**발견된 문제**:
+1. 활동 선택 영역이 힌트 띠보다 작음
+2. 메뉴 선택 영역 높이가 다른 버튼과 다름
+
+**해결**:
+- 활동 영역을 힌트 띠와 동일하게 조정
+- 메뉴 높이를 35px로 통일
+
+## 오후 10시 47분
+
+### UI 버튼 자동 숨김 시간 단축
+
+**변경**: 5초 → 3초
+- 메뉴 힌트, 스킬 버튼, 활동 버튼 모두 3초로 통일
+- 더 빠른 UI 정리로 사용성 향상
+
 ---
-**작성 완료**: 2025-07-30 21:04
+**작성 완료**: 2025-07-30 23:31