/* Paint through the real safe area. Important controls stay below its inset. */
html[data-syoper-edge="v1"]{
 --syoper-edge-native-top:env(safe-area-inset-top,0px);
 --syoper-edge-safe-top:max(env(safe-area-inset-top,0px),var(--syoper-shell-safe-top,0px));
}
html[data-syoper-edge="v1"][data-syoper-active-tab="shop"]{background-color:#210012}
html[data-syoper-edge="v1"][data-syoper-active-tab="home"]{background-color:#090909}
html[data-syoper-edge="v1"].syoper-tab-away[data-syoper-active-tab="shop"] body{background:#210012}
html[data-syoper-edge="v1"].syoper-tab-away[data-syoper-active-tab="home"] body{background:#090909}
html[data-syoper-edge="v1"] body.shop-front[data-shop-redesign="pink-v1"]{--shop-safe-top:var(--syoper-edge-safe-top)}
html[data-syoper-edge="v1"] body[data-surface="discovery"] .discovery-head{top:calc(6px + var(--syoper-edge-safe-top))}

/* The iframe element is itself a separate dark canvas, outside its child document. */
html[data-syoper-edge="v1"][data-syoper-active-tab="shop"] #syoper-tab-frame{background:#210012}
html[data-syoper-edge="v1"][data-syoper-active-tab="home"] #syoper-tab-frame{background:#090909}