feat(mobile): iOS polish — theme-color, safe-area, dvh, tap-highlight

MOB-19: Add a viewport Viewport export with viewportFit: 'cover' and
themeColor entries for light (#faf7f2) / dark (#1a1612), plus the
appleWebApp metadata for the home-screen status bar style and title.
Manifest's stale #3b82f6 theme_color updated to match brand cream.

MOB-20: Apply env(safe-area-inset-*) to the sticky chrome — the top
header gets max(padding, inset-left/right) so the logo and tab links
clear the notch in landscape; the bottom tab bar already had
inset-bottom and now also gets inset-left/right.

MOB-21: Replace 100vh with 100dvh in body min-height, modal max-heights,
the map view container, and the fullscreen map. Older engines fall
back via the duplicated vh declaration.

MOB-22: Set -webkit-tap-highlight-color: transparent on body to
suppress the iOS Safari grey flash; add a generic touch-pointer
:active rule (opacity 0.7) so taps still register visually on plain
anchors and bare buttons. Components with their own :active styling
are unaffected.

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

nextjs-app/components/HomeView.module.css

@@ -142,7 +142,7 @@
   display: grid;
   grid-template-columns: 1fr 340px;
   gap: 1rem;
-  height: calc(100vh - 280px);
+  height: calc(100dvh - 280px);
   min-height: 520px;
   max-height: 800px;
 }
@@ -467,7 +467,7 @@
   .mapViewContainer {
     grid-template-columns: 1fr;
     grid-template-rows: 1fr;
-    height: calc(100vh - 280px);
+    height: calc(100dvh - 280px);
     min-height: 400px;
   }
 

nextjs-app/components/Navigation.module.css

@@ -10,7 +10,9 @@
 .container {
   max-width: 1400px;
   margin: 0 auto;
-  padding: 0 1.5rem;
+  /* Add the safe-area inset to horizontal padding so the header content
+     clears the notch in landscape on iPhones. */
+  padding-inline: max(1.5rem, env(safe-area-inset-left)) max(1.5rem, env(safe-area-inset-right));
   display: flex;
   justify-content: space-between;
   align-items: center;
@@ -231,8 +233,10 @@
     background: var(--bg-card, white);
     border-top: 1px solid var(--border-color, #e5dfd5);
     box-shadow: 0 -2px 12px rgba(26, 22, 18, 0.06);
-    /* Respect iPhone home-indicator inset */
+    /* Respect iPhone home-indicator (bottom) and notch (left/right in
+       landscape) insets so the tab content never sits under system UI. */
     padding-bottom: env(safe-area-inset-bottom, 0);
+    padding-inline: env(safe-area-inset-left, 0) env(safe-area-inset-right, 0);
     /* Compensate for iOS Chrome's auto-hiding URL bar — Navigation.tsx
        writes the offset based on the Visual Viewport API. translate3d
        (instead of translateY) forces hardware compositing so the bar

nextjs-app/components/SchoolMap.module.css

@@ -7,6 +7,7 @@
 .mapWrapper.fullscreen {
   width: 100vw;
   height: 100vh;
+  height: 100dvh;
 }
 
 .fullscreenBtn {