feat: ship as a real iOS-installable PWA, restructure bottom nav, fix safe-area

- Add manifest.webmanifest with standalone display + warm-craft theme colors,
  apple-touch-icon, and 192/512/512-maskable icons (frame-with-sunset glyph).
- Add PWA meta tags + viewport-fit=cover so add-to-home-screen produces a
  true standalone app on iOS instead of a Safari bookmark.
- Drop the Shared bottom-nav tab; the in-page sub-tabs already cover that.
  Three nav tabs total (Home / Library / Settings); pending-share badge
  moves to the Library tab. Predicate-based isActive() now correctly
  disambiguates /library vs /library?tab=shared.
- Safe-area handling: bottom nav, bottom sheet, upload overlay, and #app
  respect env(safe-area-inset-*); sticky Library tabs anchor below the
  iPhone status bar. Introduces --bottom-nav-height token consumed by
  Settings, Library, and the toast.
- LibraryView reactively follows route.query.tab so deep-linking
  /library?tab=shared lands on the right sub-tab.
- Theme-color meta syncs client-side via useTheme.applyTheme so the
  user's chosen theme follows them into Android Chrome's chrome bar.

Test suite expanded to 278 tests / 100% line coverage (99.84% statements,
99.78% branches). Remaining gaps are unreachable defensive code.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

frontend/src/test/components/DevicePicker.test.ts

@@ -110,4 +110,44 @@ describe('DevicePicker', () => {
     expect(wrapper.text()).toContain('Living Room')
     expect(wrapper.text()).toContain('Bedroom')
   })
+
+  // DP-07: Clicking the enabled confirm button emits 'confirm'
+  it('emits confirm when the confirm button is clicked', async () => {
+    const wrapper = mountPicker([1])
+    await wrapper.find('button').trigger('click')
+    expect(wrapper.emitted('confirm')).toBeTruthy()
+  })
+
+  // DP-08: Confirm label adapts to selection count (singular / plural / none)
+  it('renders the singular confirm label for one selected device', () => {
+    const wrapper = mountPicker([1])
+    expect(wrapper.find('button').text()).toBe('Add to 1 frame')
+  })
+
+  it('renders the plural confirm label for multiple selected devices', () => {
+    const wrapper = mountPicker([1, 2])
+    expect(wrapper.find('button').text()).toBe('Add to 2 frames')
+  })
+
+  it('renders the no-selection confirm label when nothing is picked', () => {
+    const wrapper = mountPicker([])
+    expect(wrapper.find('button').text()).toBe('Add to frame')
+  })
+
+  // DP-09: Uploading state — label changes and button is disabled
+  it('shows uploading label and disables the button while uploading', () => {
+    const wrapper = mount(DevicePicker, {
+      props: { modelValue: true, devices, selected: [1], uploading: true },
+    })
+    const btn = wrapper.find('button')
+    expect(btn.text()).toBe('Uploading…')
+    expect((btn.element as HTMLButtonElement).disabled).toBe(true)
+  })
+
+  // DP-10: Forwards update:modelValue from the wrapped sheet
+  it('forwards update:modelValue from the wrapped sheet', async () => {
+    const wrapper = mountPicker([])
+    await wrapper.findComponent({ name: 'BaseBottomSheet' }).vm.$emit('update:modelValue', false)
+    expect(wrapper.emitted('update:modelValue')).toEqual([[false]])
+  })
 })