feat: 안드로이드 하이브리드 앱(Capacitor) 구성

- capacitor.config + android/ 네이티브 프로젝트
- 앱 전용 빌드(.env.capacitor, build:app), 뒤로가기·safe-area
- docs/ANDROID.md

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

src/assets/main.css

@@ -4,6 +4,14 @@
   font-weight: normal;
 }
 
+/* 네이티브 앱(Capacitor) safe-area: 상단 상태바 / 하단 제스처바 영역 확보 */
+html.is-native .layout-top {
+  padding-top: env(safe-area-inset-top);
+}
+html.is-native .layout-bottom {
+  padding-bottom: env(safe-area-inset-bottom);
+}
+
 a,
 .green {
   text-decoration: none;

src/capacitor.js

@@ -0,0 +1,19 @@
+// Capacitor 네이티브(안드로이드) 통합. 웹에서는 no-op.
+import { Capacitor } from '@capacitor/core'
+import { App as CapApp } from '@capacitor/app'
+
+export function setupCapacitor(router) {
+  if (!Capacitor.isNativePlatform()) return
+
+  // 안드로이드 하드웨어 뒤로가기 → 라우터 뒤로, 더 못 가면 앱 종료
+  CapApp.addListener('backButton', ({ canGoBack }) => {
+    if (canGoBack && window.history.length > 1) {
+      router.back()
+    } else {
+      CapApp.exitApp()
+    }
+  })
+
+  // 네이티브 표시용 클래스 (safe-area 등 스타일 분기)
+  document.documentElement.classList.add('is-native')
+}

src/main.js

@@ -5,6 +5,7 @@ import { createPinia } from 'pinia'
 
 import App from './App.vue'
 import router from './router'
+import { setupCapacitor } from './capacitor'
 
 const app = createApp(App)
 
@@ -12,3 +13,6 @@ app.use(createPinia())
 app.use(router)
 
 app.mount('#app')
+
+// 네이티브 앱(안드로이드)일 때만 동작 (웹은 no-op)
+setupCapacitor(router)