feat: 홈 대시보드 임시 히어로 이미지 추가

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

src/assets/main.css

@@ -6,7 +6,10 @@
 
 /* 네이티브 앱(Capacitor) safe-area: 상단 상태바 / 하단 제스처바 영역 확보 */
 html.is-native .layout-top {
-  padding-top: env(safe-area-inset-top);
+  /* 상태바 높이(safe-area)에 더해 여유 간격을 줘서 헤더가 상태바에 붙지 않게 */
+  padding-top: calc(env(safe-area-inset-top) + 14px);
+  height: auto;
+  min-height: 56px;
 }
 html.is-native .layout-bottom {
   padding-bottom: env(safe-area-inset-bottom);

src/views/HomeView.vue

@@ -1,31 +1,33 @@
 <script setup>
-// 홈 = 대시보드 (현재는 빈 공간 — 추후 콘텐츠 추가 예정)
+// 홈 = 대시보드 (임시: 히어로 이미지). 추후 요약 위젯으로 교체 예정.
 </script>
 
 <template>
-  <section class="dashboard">
+  <section class="home">
-    <div class="placeholder"></div>
+    <div class="hero"></div>
   </section>
 </template>
 
 <style scoped>
-.dashboard {
+.home {
   max-width: 960px;
   margin: 0 auto;
 }
-h1 {
+/* 임시 히어로 이미지 — public/home-hero.jpg 를 두면 표시됨. 없으면 연한 바다색 배경 */
-  font-size: 1.5rem;
+.hero {
-  margin-bottom: 1rem;
+  width: 100%;
+  min-height: 70vh;
+  border-radius: 10px;
+  background-color: #bfe6fb;
+  background-image: url('/home-hero.jpg');
+  background-size: cover;
+  background-position: center;
+  background-repeat: no-repeat;
 }
-.placeholder {
+@media (max-width: 768px) {
-  display: flex;
+  .hero {
-  align-items: center;
+    min-height: 78vh;
-  justify-content: center;
+    border-radius: 8px;
-  min-height: 40vh;
+  }
-  border: 1px dashed var(--color-border);
-  border-radius: 8px;
-  color: var(--color-text);
-  opacity: 0.5;
-  font-size: 0.95rem;
 }
 </style>