feat(app): mobile improvements — native-feel viewport, keyboard, HIG tabs, PWA fix

- Lock viewport: position:fixed on html/body prevents iOS bounce scroll
- No zoom on input focus: maximum-scale=1, user-scalable=no
- Keyboard-responsive chat: visualViewport API detects keyboard, hides
  tab bar, scrolls chat to bottom, scrollIntoView on input focus
- iOS HIG tab bar: 49pt height, vertical icon+label, safe-area-inset-bottom
- PWA fix: manifest start_url/scope/id changed from '/' to './' for
  subpath deployment compatibility
- PlayerBar: variant prop (fixed/inline), inline on mobile above tab bar,
  fixed on desktop. No more overlap with tab bar.

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

packages/app/src/App.vue

@@ -2,7 +2,7 @@
   <div class="h-dvh flex flex-col" :class="currentTheme">
     <RouterView />
     <ArticleOverlay />
-    <PlayerBar />
+    <PlayerBar v-if="!isMobile" />
     <PassphraseDialog
       :visible="showPassphrase"
       :is-creating="isCreatingPassphrase"
@@ -13,7 +13,7 @@
 </template>
 
 <script setup lang="ts">
-import { ref, onMounted, onUnmounted } from 'vue'
+import { ref, computed, onMounted, onUnmounted } from 'vue'
 import { RouterView } from 'vue-router'
 import { useTheme } from '@/composables/useTheme'
 import { useArchy } from '@/composables/useArchy'
@@ -30,6 +30,10 @@ import {
 const { currentTheme, initTheme } = useTheme()
 const archy = useArchy()
 
+const windowWidth = ref(window.innerWidth)
+const isMobile = computed(() => windowWidth.value < 1024)
+function onResize() { windowWidth.value = window.innerWidth }
+
 const showPassphrase = ref(false)
 const isCreatingPassphrase = ref(false)
 
@@ -54,6 +58,7 @@ async function handlePassphraseSubmit(passphrase: string) {
 
 onMounted(() => {
   initTheme()
+  window.addEventListener('resize', onResize)
 
   // Initialize Archy bridge when running embedded in Archipelago
   archy.init()
@@ -67,6 +72,7 @@ onMounted(() => {
 })
 
 onUnmounted(() => {
+  window.removeEventListener('resize', onResize)
   archy.destroy()
 })
 </script>