html {
  width: 100% !important;
  min-height: 100% !important;
  height: auto !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior-y: auto !important;
  -webkit-overflow-scrolling: touch !important;
  touch-action: pan-y pinch-zoom !important;
}

body,
body.arcanis-mobile-v800 {
  position: relative !important;
  inset: auto !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 100vh !important;
  min-height: 100dvh !important;
  height: auto !important;
  max-height: none !important;
  margin: 0 !important;
  overflow-x: hidden !important;
  overflow-y: visible !important;
  overscroll-behavior-y: auto !important;
  -webkit-overflow-scrolling: touch !important;
  touch-action: pan-y pinch-zoom !important;
}

#app,#root,#main,main,#menu,.app,.app-shell,.page,.page-shell,.screen,
.screen-content,.view,.view-content,.content,.main-content,.hall-shell,
.hall-main,.tabpane,#mobileHallDashboard,[data-page],[data-screen],[role="main"] {
  position: relative !important;
  inset: auto !important;
  top: auto !important;
  right: auto !important;
  bottom: auto !important;
  left: auto !important;
  width: 100% !important;
  min-width: 0 !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: visible !important;
  transform: none !important;
  contain: none !important;
  will-change: auto !important;
  touch-action: pan-y pinch-zoom !important;
}

.page.active,.screen.active,.tabpane.active,[data-page].active,[data-screen].active {
  max-height: none !important;
  overflow: visible !important;
}

@media (min-width: 1100px) {
  body { padding-bottom: 24px !important; }

  .hall-main,.main-content,[role="main"] {
    box-sizing: border-box !important;
    padding-bottom: 48px !important;
  }
}

@media (max-width: 1099px) {
  .hall-main {
    box-sizing: border-box !important;
    padding-bottom: calc(118px + env(safe-area-inset-bottom, 0px)) !important;
  }

  .m800-topbar,.m800-bottom-nav,.bottom-nav,.bottom-navigation,.mobile-nav,.tab-bar {
    position: fixed !important;
  }
}

.modal,.dialog,.popup,.overlay-panel,[role="dialog"] {
  max-height: calc(100dvh - 24px) !important;
  overflow-y: auto !important;
  -webkit-overflow-scrolling: touch !important;
  touch-action: pan-y pinch-zoom !important;
}

#game.active,
body.online-match #game.active,
body.offline-match #game.active,
body.chronicle-match #game.active {
  position: fixed !important;
  inset: 0 !important;
  width: 100vw !important;
  height: 100dvh !important;
  max-height: 100dvh !important;
  overflow: hidden !important;
  touch-action: none !important;
}

#game:not(.active) {
  position: relative !important;
  inset: auto !important;
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
}

body::before,body::after,#menu::before,#menu::after,
.hall-shell::before,.hall-shell::after {
  pointer-events: none !important;
}

html.arcanis-real-modal-open,
body.arcanis-real-modal-open {
  overflow: hidden !important;
  height: 100% !important;
}
