# 회의록: 모바일 에디터 중첩 들여쓰기 최적화

> **일시**: 2026-02-11 12:15
> **참석자**: Jay (PM), Sarah (UX), Michael (Frontend Tech Lead)
> **안건**: 모바일 기기(InsuWiki)에서 깊은 단계의 리스트 가독성 저하 문제 해결

---

## 1. 문제 분석 (Jay)
- **현황**: 모바일 화면에서 리스트가 5단계 이상 중첩될 경우, 좌측 여백(Indentation)이 과도하여 콘텐츠 영역이 급격히 좁아짐.
- **데이터**: `ol` (숫자 리스트)의 경우 레벨당 `2.5rem (40px)`씩 들여쓰기가 적용됨. 5단계면 `200px` 소모 (모바일 화면의 50% 이상).
- **증상**: `1.1.1.1.1.`과 같은 긴 번호가 본문을 침범하거나 줄바꿈을 유발함.

## 2. 기술적 해결 방안 (Michael)

### 2.1. Media Query 적용 (`max-width: 640px`)
모바일 환경에서만 리스트 스타일을 재정의하여 PC 경험은 유지하되 모바일 가독성을 확보합니다.

### 2.2. 상세 조정 내역

| 구분 | 항목 | PC (기존) | Mobile (변경안) | 효과 |
| :--- | :--- | :--- | :--- | :--- |
| **순서 없는 목록 (UL)** | `padding-left` | `1.25rem` (20px) | **`0.75rem` (12px)** | 들여쓰기 40% 축소 |
| | Bullet 위치 (`left`) | `-1rem` | **`-0.6rem`** | 마커 위치 조정 |
| **순서 있는 목록 (OL)** | `padding-left` | `2.5rem` (40px) | **`1.25rem` (20px)** | **들여쓰기 50% 대폭 축소** |
| | Number Box 너비 | `3.25rem` | **`1.8rem`** | 숫자 공간 최적화 |
| | Number Box 위치 (`left`) | `-3.25rem` | **`-1.8rem`** | 숫자 위치 조정 |
| | Font Size | `0.85rem` | **`0.75rem`** | 숫자 크기 축소 |

*참고: OL의 경우 숫자가 길어질 수 있으나(예: 1.1.1.1.1.), 모바일에서는 공간 확보가 최우선이므로 숫자 박스 너비를 줄이고 우측 정렬을 유지합니다.*

## 3. 결정 사항 (Action Items)
- `globals.css` 하단에 모바일 전용(`@media (max-width: 640px)`) 오버라이딩 스타일 추가.
- `padding-left`를 공격적으로 줄여 콘텐츠 영역 최대화.

## 4. 추가 피드백 반영 (13:00)
- **사용자 요청**: "조금 더 들여쓰기 간격을 줄였으면 좋겠다." (Ultra Compact Mode)
- **최종 적용 수치**:
    - **OL (숫자)**: `20px` → **`12.8px (0.8rem)`** (PC 대비 32%)
    - **UL (블릿)**: `12px` → **`9.6px (0.6rem)`**
    - 숫자 박스 너비와 자간도 극한으로 축소하여 모바일 가독성 최적화 완료.

---
*본 문서는 `.agent/workflows/create-doc.md` 지침에 따라 작성되었습니다.*