@font-face {
  src: url('../font/font.woff2') format('woff2') !important;
  font-family: Inter !important;
  font-style: normal !important;
  font-weight: 100 900 !important;
  font-display: swap !important;
}

*:not(#settings_ui *) {
  border: none !important;
  outline: none !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
  font-family: Inter, system-ui !important;
}

*:not(#app, #app *:not(h1), #settings_ui *) {
  margin: 0 !important;
}

*:not(#settings_ui *, ._eaglercraftX_mobile_press_any_key *) {
  color: #fff !important;
}

*:not(#app, #app *:not(h1, span), ._eaglercraftX_mobile_press_any_key, ._eaglercraftX_mobile_press_any_key *, #settings_ui *) {
  padding: 0 !important;
  cursor: default !important;
}

body {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  background-color: #000 !important;
}

body, #launch, #game_frame, ._eaglercraftX_mobile_press_any_key, ._eaglercraftX_canvas_element {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
}

#game_frame, #launch {
  transition: opacity 1s !important;
}

#game_frame {
  pointer-events: all !important;
}

body:not(.game) #game_frame *:not(:has(._eaglercraftX_mobile_press_any_key), ._eaglercraftX_mobile_press_any_key, ._eaglercraftX_mobile_press_any_key *) {
  opacity: 0 !important;
  pointer-events: none !important;
}

._eaglercraftX_mobile_press_any_key {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  background-color: #00000010 !important;
}

._eaglercraftX_mobile_press_any_key *:not(._eaglercraftX_mobile_launch_client) {
  order: -1 !important;
  color: #ddd !important;
}

._eaglercraftX_mobile_press_any_key p:has(._eaglercraftX_mobile_launch_client) {
  order: 1 !important;
}

._eaglercraftX_mobile_launch_client {
  color: #fff !important;
}

._eaglercraftX_wrapper_element {
  background-color: #00000000 !important;
}

._eaglercraftX_canvas_element {
  z-index: 1 !important;
}

._eaglercraftX_crash_element {
  text-align: left !important;
}

body:has(._eaglercraftX_crash_element)
  :not(
    ._eaglercraftX_wrapper_element,
    ._eaglercraftX_wrapper_element img:first-of-type,
    ._eaglercraftX_crash_element,
    ._eaglercraftX_crash_element *
  ) {
  display: none !important;
}

#app {
  display: flex !important;
  flex-direction: column !important;
  max-width: 1280px !important;
  margin: 0 auto !important;
  padding: 2rem !important;
  text-align: center !important;
  background-color: #00000040 !important;
}

h1 {
  font-size: 3.2em !important;
  line-height: 1.1 !important;
}

span {
  margin-bottom: 1rem !important;
}

#buttons {
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
}

button:not(.button) {
  border: none !important;
  padding: 0.6em 1.2em !important;
  font-size: 1em !important;
  font-weight: 500 !important;
  font-family: inherit !important;
  cursor: pointer !important;
  min-width: 150px !important;
  background-color: #00000050 !important;
}

button:not(.button):hover {
  background-color: #00000080 !important;
}

button:not(.button):focus,
button:not(.button):focus-visible {
  outline: none !important;
}

body:has(._eaglercraftX_mobile_launch_client) #launch * {
  display: none !important;
}

#launch {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  flex-direction: column !important;
  backdrop-filter: blur(20px) !important;
  background-color: #00000080 !important;
}

#launch h1 {
  margin-bottom: 10px !important;
}

#launch span {
  margin-bottom: 5px !important;
}

body:not(.launch):not(.game) #launch {
  opacity: 0 !important;
  pointer-events: none !important;
}

#launch-detail {
  display: block !important;
  color: #6c7086 !important;
  width: 50vw !important;
  overflow: hidden !important;
  white-space: nowrap !important;
  text-overflow: ellipsis !important;
}

#launch-progress {
  width: 50vw !important;
  border-radius: 4px !important;
  background-color: #808080 !important;
}

#launch-progress-bar {
  height: 8px !important;
  width: 0;
  background: linear-gradient(
    90deg,
    #7D32E6,
    #6F2CCE,
    #5F26B4
  );
}

#parallax-bg {
  position: fixed !important;
  width: 110vw !important;
  height: 110vh !important;
  top: -5vh !important;
  left: -5vw !important;
  background-image: url('../img/bg.jpg') !important;
  background-size: cover !important;
  background-position: center !important;
  will-change: transform !important;
  pointer-events: none !important;
  z-index: -1 !important;
  filter: blur(30px) !important;
}

#settings_ui *:not(#account_status) {
  text-align: left !important;
}

#settings_ui .tabs {
  display: none !important;
}

@media screen and (max-aspect-ratio: 1/1) {
  #parallax-bg {
    transform: none !important;
  }
}