I'm trying to generate a page with a fixed header which has the same color as theme-color and therefore the address bar. I tried to use grid layout or just position: fixed, both have undesired effects. grid, example: https://2qzht.csb.app The content only scrolls with mouse-wheel (or touch on mobile). It's not scrollable on Apple Watch with the crown. fixed, example: https://cdv9k.csb.app Content is scrollable with keyboard and Apple Watch crown. The translucent address bar in Safari 15 now shows the content as it scrolls by and therefore distorting the experience with having the same color at the top of the page including the address bar. I didn't find a fix for the scrolling issue and didn't find anything to disable the translucent address bar or even set the color to the same value as the address bar (including the translucent effect). I found (on some apple pages) that "backdrop-filter: saturate(180%) blur(20px);" might deliver a similar effect, but this is still different than the address bar and breaks if a background-image is used. Is there any way to fix those?