html:has(#canvas){--scene-surface-color: var(--color-off-white, #f0f2f5)}html:has(#canvas).is-black-bg{--scene-surface-color: var(--color-black, #000)}html:has(#canvas).is-blue-bg{--scene-surface-color: var(--color-blue, #96fc0a)}html:has(#canvas):has(#header.--is-projects){--scene-surface-color: var(--project-details-bg, #f0f2f5)}html:has(#canvas),body:has(>#canvas){background-color:var(--scene-surface-color)}@media(max-width:812px){html:has(#canvas):has(#header.--menu-opened){--scene-surface-color: var(--ui-green, #96fc0a)}}#header-background{visibility:hidden;transition:opacity .4s .4s,visibility 0s .8s}#header-background.--opened{visibility:visible;opacity:1;transition:opacity .4s,visibility 0s}#header-menu.--opened{pointer-events:auto}@media(min-width:1000px){#header-background.--opened{opacity:.2}}@media(max-width:812px){#home-hero-title{margin-top:calc(max(48px,var(--header-size) * 3.1) + 12px)}}@supports (-webkit-touch-callout: none) and (height: 100lvh){@media(hover:none)and (pointer:coarse){html:has(#canvas),body:has(>#canvas){height:100lvh}body:has(>#canvas){position:relative}#canvas,#ui{position:absolute;top:0;left:0}#header{position:absolute;top:0;padding-top:calc(var(--base-padding-y) + env(safe-area-inset-top,0px))}#home-hero{padding-top:calc(var(--base-padding-y) + env(safe-area-inset-top,0px))}@media(max-width:1000px){#header-menu{top:calc(var(--base-padding-y) * 2 + 3 * var(--header-size) + env(safe-area-inset-top,0px));max-height:calc(100dvh - var(--base-padding-y) * 2 - 3 * var(--header-size) - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px))}}}}