fix: remove will-change from nav-bottom and add iOS height fallback

will-change: transform on a position:relative flex child causes iOS WebKit
to composite the element at an incorrect position - creating a visible gap
below the nav bar. Remove it; CSS transform transitions use hardware
acceleration automatically on modern iOS without this hint.

Add -webkit-fill-available before 100dvh on .app-shell as a fallback for
iOS WebKit versions where 100dvh is computed slightly smaller than the
actual WKWebView height.

CHANGELOG.md

@@ -7,6 +7,11 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ## [Unreleased]
 
+## [0.20.5] - 2026-04-16
+
+### Fixed
+- iOS PWA: persistent gap between the bottom navigation bar and the physical screen edge. Two root causes addressed: (1) `will-change: transform` on the flex-child nav caused iOS WebKit's compositor to misplace the GPU layer — removed permanently; CSS `transform` transitions work with hardware acceleration on modern iOS without this hint. (2) Added `-webkit-fill-available` as a height fallback before `100dvh` on `.app-shell` to guard against iOS WebKit versions where `100dvh` is computed slightly smaller than the actual WKWebView height.
+
 ## [0.20.4] - 2026-04-16
 
 ### Fixed

package.json

@@ -1,6 +1,6 @@
 {
   "name": "oikos",
-  "version": "0.20.4",
+  "version": "0.20.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/glass.css

@@ -349,7 +349,8 @@ textarea.form-input {
     transform var(--transition-base) var(--ease-out),
     background-color var(--transition-fast),
     box-shadow var(--transition-fast);
-  will-change: transform;
+  /* will-change: transform absichtlich weggelassen - auf iOS (WebKit) korrumpiert die
+   * dauerhafte GPU-Layer-Promotion eines position:relative Flex-Kinds dessen Position. */
 }
 
 .nav-bottom--hidden {

public/styles/layout.css

@@ -17,6 +17,10 @@
 .app-shell {
   display: flex;
   flex-direction: column;
+  /* -webkit-fill-available als iOS-Fallback: In manchen iOS-WebKit-Versionen
+   * ist 100dvh minimal kleiner als die tatsächliche WKWebView-Höhe, was zu einem
+   * sichtbaren Streifen unten führt. -webkit-fill-available füllt zuverlässig. */
+  height: -webkit-fill-available;
   height: 100dvh;
 }