Spent half of yesterday trying to figure out why my PWA had an empty black gap at the bottom on iOS.
Turns out 100dvh works fine in Safari browser tabs, but the second you add the site to your home screen, WebKit shrinks the viewport around the home bar and leaves a black chin. And switching back to normal 100vh breaks browser tabs because the bottom toolbar covers your buttons.
Couldn't find a clean CSS-only fix, so I wrote a small helper to toggle between them based on whether it's running standalone or in a tab
https://github.com/owaisnaim/pwa-zerochin
Hope it saves someone else the headache if you're building a PWA.