/* ==========================================================
   AURA_ASCENSION_25D_FOUNDATION_V1
   ========================================================== */

.aura-play-page-shell
.game-shell {
  isolation: isolate;
}


.aura-webgl-stage {
  position: absolute;

  z-index: 6;

  inset: 0;

  width: 100%;
  height: 100%;

  overflow: hidden;

  border-radius: inherit;

  pointer-events: none;

  opacity: 0;

  transition:
    opacity
    420ms ease;

  contain:
    strict;
}


.aura-webgl-stage canvas {
  display: block;

  width: 100% !important;
  height: 100% !important;

  pointer-events: none;

  opacity: .88;

  mix-blend-mode:
    screen;
}


/*
 * Do not show WebGL atmosphere over holder verification.
 */

.aura-play-page-shell
.game-shell:has(
  .wallet-gate[hidden]
)
.aura-webgl-stage,

.aura-play-page-shell
.game-shell.aura-play-arena-unlocked
.aura-webgl-stage,

.aura-play-page-shell
.game-shell.aura-play-run-active
.aura-webgl-stage {
  opacity: 1;
}


/*
 * Keep gameplay HUD / menus above the presentation layer.
 */

.aura-play-page-shell
.game-shell
.game-hud,

.aura-play-page-shell
.game-shell
.level-up-overlay,

.aura-play-page-shell
.game-shell
.game-over-overlay,

.aura-play-page-shell
.game-shell
[data-upgrade-overlay],

.aura-play-page-shell
.game-shell
[data-boss-shell] {
  position: relative;

  z-index: 20;
}


@media (max-width: 700px) {

  .aura-webgl-stage canvas {
    opacity: .68;
  }

}


@media (prefers-reduced-motion: reduce) {

  .aura-webgl-stage {
    transition: none;
  }

}


/* AURA_ASCENSION_25D_FOUNDATION_V1 */
