@media (max-width: 820px) {
  #mobileNav,
  .mobileNav,
  .mobile-nav {
    position: fixed !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;

    height: 58px !important;
    min-height: 58px !important;
    max-height: 58px !important;

    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    transform: none !important;
    margin: 0 !important;
    padding: 0 2px env(safe-area-inset-bottom) !important;
    z-index: 9999 !important;
  }

  html,
  body {
    width: 100% !important;
    height: 100% !important;
    max-height: 100% !important;
    overflow: hidden !important;
    overscroll-behavior: none !important;
  }

  body { position: fixed !important; inset: 0 !important; padding: 0 !important; }
  .app,
  .shell { width: 100% !important; height: 100% !important; min-height: 0 !important; overflow: hidden !important; }

  #market { height: calc(100dvh - 58px - env(safe-area-inset-bottom)) !important; overflow: hidden !important; }
  #market .workspace,
  #market .market-space { height: 100% !important; min-height: 0 !important; overflow: hidden !important; }
  #market .market-space { padding-bottom: 0 !important; display: flex !important; flex-direction: column !important; }
  #market .chart-stage { position: relative !important; flex: 1 1 auto !important; height: auto !important; min-height: 0 !important; max-height: none !important; margin: 0 !important; overflow: hidden !important; }
  #market .chart-host { position: absolute !important; inset: 0 !important; width: 100% !important; height: 100% !important; }
  #market,
  #chartStage,
  #chart,
  #chart canvas { touch-action: none !important; overscroll-behavior: none !important; }

  .secondary-screen.active { height: calc(100dvh - 58px - env(safe-area-inset-bottom)) !important; overflow-y: auto !important; touch-action: pan-y !important; }
}