/* Native browser tint is advisory. Root backgrounds also serve Safari's edge fill. */
html{background-color:var(--menu-browser-brand,#6C63FF)!important}
body{background-color:var(--menu-browser-brand,#6C63FF)!important}

/* Content retains the selected theme; only the surrounding canvas uses branding. */
.selector-shell{background-color:var(--bg);min-height:100svh}
.link-page{background-color:var(--menu-browser-page-bg,#F4F5FA)}
body.menu-browser-legacy{background-image:linear-gradient(var(--bg),var(--bg))}

/* Extend media to the viewport edges, but keep interactive hero content safe. */
@supports(padding:max(0px,env(safe-area-inset-top))){
 .cin-hero-top{padding-top:max(24px,env(safe-area-inset-top));padding-left:max(30px,env(safe-area-inset-left));padding-right:max(30px,env(safe-area-inset-right))}
 .selector-hero .hero-top{padding-top:env(safe-area-inset-top);padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right)}
 body.menu-layout-cinematic .header{padding-top:max(12px,env(safe-area-inset-top))}
 body:not(.menu-layout-cinematic):not(.menu-browser-legacy) .header{padding-top:max(10px,env(safe-area-inset-top))}
 body:not(.menu-layout-cinematic):is(.menu-header-style-campaign,.menu-header-style-floating-showcase) .header{padding-top:max(13px,env(safe-area-inset-top))}
 body:not(.menu-layout-cinematic).menu-header-smart.header-smart-mounted .header{padding-top:max(8px,env(safe-area-inset-top))}
}
@media(max-width:700px){
 .cin-hero-top{padding-top:max(20px,env(safe-area-inset-top));padding-left:max(20px,env(safe-area-inset-left));padding-right:max(20px,env(safe-area-inset-right))}
}