feat(mobile): native-feel sticky top bar + bottom tab nav

Replaces the floating pill nav with persistent mobile chrome that
frames scrolling content the way iOS/Android native apps do.

New components:
- TopBar: brand left, contextual action right (Admin pill for admins,
  bell for saved, Login button when logged out)
- BottomNav: 4-tab fixed nav (Search, Scan [elevated center FAB],
  Saved, Profile). Saved/Profile disabled when logged out, tapping
  opens LoginModal
- icons.jsx: 5 stroke-based SVG icons (Search, Scan, Bell, User, Cog)
  plus Logo; replaces emoji in nav chrome

Behavior changes:
- App.jsx: tracks publicScreen ('home'|'scan'|'search') so BottomNav
  can drive both top-level view + inner screen
- PublicView: screen state lifted to App via props (back-compat
  defaults preserved so existing call sites don't break)
- App.css: old mobile .view-switcher block hidden (replaced by
  BottomNav); .app padding bumped to clear the fixed bottom bar

Desktop (>768px) unchanged — existing centered pill nav still works,
new components hidden via display:none.

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

frontend/src/components/BottomNav.css

@@ -0,0 +1,89 @@
+/* BottomNav — mobile-only fixed bottom tab bar. Desktop hides via display:none above 768px. */
+
+.bottom-nav {
+  display: none;
+}
+
+@media (max-width: 768px) {
+  .bottom-nav {
+    display: grid;
+    grid-template-columns: repeat(4, 1fr);
+    position: fixed;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    z-index: 50;
+    padding: 0.4rem 0.5rem calc(0.4rem + env(safe-area-inset-bottom));
+    background: var(--glass-bg);
+    -webkit-backdrop-filter: saturate(180%) blur(20px);
+    backdrop-filter: saturate(180%) blur(20px);
+    border-top: 1px solid var(--border);
+  }
+
+  .bottom-nav-item {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: flex-end;
+    gap: 0.25rem;
+    padding: 0.25rem 0.25rem 0.1rem;
+    background: transparent;
+    border: none;
+    cursor: pointer;
+    color: var(--text-muted);
+    font: inherit;
+    -webkit-tap-highlight-color: transparent;
+    transition: color 0.15s;
+  }
+
+  .bottom-nav-item.disabled {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  .nav-icon-wrap {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    width: 2.5rem;
+    height: 2.5rem;
+    border-radius: 999px;
+    color: inherit;
+    transition: background 0.2s, color 0.2s, transform 0.2s;
+  }
+
+  /* Elevated center tab (Scan) — sits above the bar like iOS center FAB */
+  .bottom-nav-item:nth-child(2) {
+    margin-top: -1.1rem;
+  }
+
+  .nav-icon-wrap--elevated {
+    background: var(--primary);
+    color: #fff;
+    width: 3.25rem;
+    height: 3.25rem;
+    box-shadow:
+      0 0 0 4px var(--glass-bg),
+      0 8px 18px rgba(15, 118, 110, 0.4),
+      0 2px 6px rgba(15, 118, 110, 0.25);
+  }
+
+  .bottom-nav-item.active .nav-label {
+    color: var(--primary);
+    font-weight: 700;
+  }
+
+  .bottom-nav-item.active .nav-icon-wrap:not(.nav-icon-wrap--elevated) {
+    color: var(--primary);
+  }
+
+  .bottom-nav-item:active .nav-icon-wrap--elevated {
+    transform: scale(0.94);
+  }
+
+  .nav-label {
+    font-size: 0.68rem;
+    line-height: 1;
+    letter-spacing: 0.01em;
+  }
+}