*{box-sizing:border-box}

html,body{margin:0;padding:0;
  background:radial-gradient(120% 80% at 50% 38%,#2a1430 0%,#120a16 58%,#06040a 100%);
  background-color:#08060a;
  font-family:"PingFang SC","Helvetica Neue",Arial,sans-serif;

  overflow:hidden;height:100%}

#pixi{position:fixed;left:0;top:0;right:0;bottom:0;z-index:35;pointer-events:auto;
  background:#08060a}
#pixi canvas{display:block}

body.render-pixi #pixi{background:transparent}
body.render-pixi #pixi canvas{opacity:0}
body.render-pixi.paint-ready #pixi canvas{opacity:1;transition:opacity .45s ease}
@media (prefers-reduced-motion:reduce){body.render-pixi.paint-ready #pixi canvas{transition:none}}

@media all and (display-mode: standalone), all and (display-mode: fullscreen) {
  html,body{height:100vh;height:100lvh}
  #pixi{bottom:auto;height:100vh;height:100lvh}
}