[css-env-1] Specify viewport environment variable property propagation into subframes

[flackr]

css-env section 2 defines several viewport geometry environment variables. These make sense when used in the the top frame, but I think we should specify when or how these are propagated to sub frames. I created a demo showing a typical example of a subframe using a safe area to avoid drawing into the unsafe region.

On iOS Safari the safe area is always set in sub frames leads to it insetting from the frame box:

In the above screenshot, the phone is in landscape. The camera notch occupies the left of the screen and the application switcher bar occupies the bottom leading to those safe areas. The safe area on the right is presumably added for symmetry.

On Android Chrome, you can see the safe area behavior by fullscreening the frame:

On the fullscreen android view, there is only a left safe area to avoid the camera notch.

However, currently on Android Chrome if you fullscreen the inner frame we don't set the safe area in the main frame even though the main frame should also avoid the notch:

It makes sense that the root frame has those safe areas but the sub frame is positioned by the root frame in a safe area so shouldn't have any safe area. It is possible that the root frame has positioned the sub frame outside of the safe area edges but as a default behavior I don't think we should give the sub frames the safe area.

If you make the subframe fullscreen, then it makes sense that we should begin giving it a safe area since it will draw to the edges of the screen despite its normal placement in the root frame.

TLDR, I'm proposing we specify that for these screen environment variables, subframes should only get their value when they are fullscreen. The main frame should always have the safe area set even when sub frames are full screen, as it does occupy the full screen space and should also avoid the safe area.