demo · v135
Inset snapshot stage
A schematic phone showing the difference between safe-area-inset-top (variable when the URL bar slides) and safe-area-max-inset-top (the worst-case constant). Toggle the URL bar and watch the green box jitter while the blue box holds steady — that’s why max-inset variables exist.
safe-area-max-inset-top: ?
safe-area-inset-*changes with URL bar / nav.
top: ?, bottom: ?safe-area-max-inset-*constant worst case — layout never jitters.
top: ?, bottom: ?