fix: eliminate black gap below bottom nav in iOS PWA standalone mode

iOS reserves the home indicator area outside the CSS viewport, leaving
a black strip below the bottom navigation. A fixed body::after pseudo-
element now fills this zone with the surface color. Also added explicit
background-color on body for consistent rendering.

CHANGELOG.md

@@ -7,6 +7,11 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ## [Unreleased]
 
+## [0.19.5] - 2026-04-14
+
+### Fixed
+- iOS PWA: black gap below bottom navigation in standalone mode - iOS reserves the home indicator area outside the CSS viewport, leaving a visible black strip. A fixed `::after` pseudo-element on `body` now fills this area with the surface color. Also added explicit `background-color` to `body` element.
+
 ## [0.19.4] - 2026-04-14
 
 ### Fixed

package.json

@@ -1,6 +1,6 @@
 {
   "name": "oikos",
-  "version": "0.19.4",
+  "version": "0.19.5",
   "description": "Self-hosted family planner - calendar, tasks, shopping, meal planning, budget and more. Private, open-source, no subscription.",
   "main": "server/index.js",
   "type": "module",

public/styles/pwa.css

@@ -76,4 +76,19 @@ nav,
   .app-content {
     overscroll-behavior-y: contain;
   }
+
+  /* iOS PWA: Schwarzen Streifen unter der Nav verhindern.
+   * iOS reserviert den Home-Indicator-Bereich unterhalb des CSS-Viewports.
+   * Ein ::after-Element mit fester Position füllt diesen Bereich mit der
+   * Surface-Farbe, sodass kein schwarzer Spalt sichtbar ist. */
+  body::after {
+    content: '';
+    position: fixed;
+    bottom: 0;
+    left: 0;
+    right: 0;
+    height: env(safe-area-inset-bottom, 0px);
+    background-color: var(--color-surface);
+    z-index: var(--z-nav);
+  }
 }

public/styles/reset.css

@@ -29,6 +29,7 @@ html {
 body {
   height: 100dvh;
   overflow: hidden;
+  background-color: var(--color-bg);
 }
 
 img, svg, video {