# InsuRo 이미지 편집기 UX 수정 — 토글 버튼 크기 + 이미지 fit

## 작업 레벨: Lv.1

## 프로젝트
- InsuRo: `/home/jay/projects/InsuRo`

## 수정 사항

### 1. ">" 토글 버튼 크기 축소
파일: `src/pages/ImageEditor.tsx` (또는 관련 컴포넌트)

현재 ">" 버튼(사이드 패널 토글)이 좌우로 너무 큼.
- ">" 아이콘 이외의 여백(padding)을 약 20px로 축소
- 버튼 전체 너비가 최소화되어야 함 (아이콘 + padding 20px 정도)

### 2. 이미지 업로드 시 작업영역에 fit
현재: 이미지를 불러오면 원본 크기로 왼쪽 상단에 배치되어 빈 여백이 많이 보임.
수정: 이미지가 작업영역(캔버스)에 **딱 맞게(object-fit: contain)** 표시.

구체적으로:
- 이미지를 불러오면 캔버스/작업영역의 가용 크기에 맞게 자동 스케일
- 이미지 주변 빈 여백 최소화 (이미지가 영역을 꽉 채움)
- 이미지는 작업영역 내에서 드래그/이동 불필요 — **고정 위치**
- 크롭 영역 선택 시에만 이미지 위에서 영역 지정

기존에 canvas 또는 fabric.js 등을 사용하고 있다면 해당 라이브러리의 fit/scale 메서드 활용.
순수 CSS라면 `object-fit: contain` + `width: 100%; height: 100%` 적용.

## affected_files
- `src/pages/ImageEditor.tsx` (수정 — 토글 버튼 여백 + 이미지 fit)

## 검증 시나리오
1. ">" 토글 버튼의 좌우 여백이 20px 이내로 축소되었는지 확인
2. 이미지 업로드 → 작업영역에 딱 맞게 표시되는지 확인 (빈 여백 최소)
3. 이미지가 고정 위치 (드래그 이동 안 됨)
4. 크롭 기능 정상 동작
5. 모바일 반응형 확인
6. npm run build 성공