:root {
  color-scheme: dark;
}

html,
body,
#root {
  background: #041830 !important;
}

body {
  background: #041830 !important;
}

.aurora-shell {
  background:
    linear-gradient(180deg, rgba(4, 24, 48, 0.35) 0%, rgba(2, 10, 24, 0.72) 100%),
    url("./gfx/bg.jpg") center top / cover no-repeat !important;
}

.aurora-mesh,
.aurora-orb,
.game-stage-mesh,
.game-stage-orb {
  opacity: 0 !important;
  animation: none !important;
}

.game-stage-shell {
  background:
    linear-gradient(180deg, rgba(6, 24, 52, 0.12), rgba(2, 10, 24, 0.22)),
    rgba(6, 22, 48, 0.28) !important;
  border-color: rgba(80, 160, 255, 0.22) !important;
  box-shadow:
    inset 0 1px 0 rgba(180, 220, 255, 0.12),
    0 28px 70px rgba(0, 0, 0, 0.45) !important;
}

.mobile-ui-card,
.desktop-app-sidebar-inner section,
.desktop-app-sidebar .mobile-ui-card {
  background: rgba(8, 22, 48, 0.92) !important;
  border-color: rgba(80, 160, 255, 0.2) !important;
}

.intro-loader {
  background:
    linear-gradient(180deg, rgba(4, 16, 36, 0.55), rgba(2, 8, 20, 0.78)),
    url("./gfx/splash.jpg") center / cover no-repeat !important;
}

.intro-loader__title {
  height: 4.4rem;
  background: url("./gfx/logo-wide.png") center / contain no-repeat;
  color: transparent !important;
  text-shadow: none !important;
}

.intro-loader__progress-bar {
  background: linear-gradient(90deg, #3aa0ff, #f0c014) !important;
}

.play-cta-button {
  background: linear-gradient(180deg, #f6d15a, #e0a020) !important;
  border-color: rgba(255, 230, 140, 0.35) !important;
  color: #2a1a00 !important;
}
