fix(ui): iOS safe-area 겹침 수정 — 헤더·하단 내비 콘텐츠 눌림 해결

- border-box 전역에서 고정 height 가 safe-area 패딩을 포함해 콘텐츠 행이 눌리던 문제
- AppBottomNav: height = calc(56px + safe-area-inset-bottom) → 아이콘 행 온전한 56px + 홈인디케이터 분리
- AppHeader: height → min-height → layout-top 상단 safe-area 패딩만큼 헤더가 커지도록

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

src/components/layout/AppBottomNav.vue

@@ -74,8 +74,10 @@ function goSettings() {
   display: flex;
   align-items: stretch;
   justify-content: space-around;
-  height: 56px;
+  /* 아이콘 행은 항상 56px 확보 + 그 아래로 홈 인디케이터(safe-area) 공간을 더한다.
-  /* 안드로이드 소프트키(시스템 내비게이션 바) 위에 위치 */
+     (box-sizing:border-box 전역이라 height 에 인셋을 더해야 아이콘 행이 눌리지 않음) */
+  height: calc(56px + env(safe-area-inset-bottom, 0));
+  /* 안드로이드 소프트키·iOS 홈 인디케이터 영역 확보 */
   padding-bottom: env(safe-area-inset-bottom, 0);
   background: var(--color-background-soft);
   border-top: 1px solid var(--color-border);

src/components/layout/AppHeader.vue

@@ -80,7 +80,9 @@ async function handleLogout() {
   display: flex;
   align-items: center;
   justify-content: space-between;
-  height: 56px;
+  /* height 대신 min-height — 네이티브에서 layout-top 이 상단 safe-area 패딩을 더하므로
+     (box-sizing:border-box) 고정 height 면 콘텐츠가 눌린다. min-height 로 헤더가 커지게. */
+  min-height: 56px;
   padding: 0 1.5rem;
   background: var(--color-background-soft);
   border-bottom: 1px solid var(--color-border);