diff --git a/src/components/layout/AppBottomNav.vue b/src/components/layout/AppBottomNav.vue
index 90210ab..3e8f465 100644
--- a/src/components/layout/AppBottomNav.vue
+++ b/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);
diff --git a/src/components/layout/AppHeader.vue b/src/components/layout/AppHeader.vue
index cd9bc29..80c2f26 100644
--- a/src/components/layout/AppHeader.vue
+++ b/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);