:root {
  --x6698-bottom-nav-bg: #050711;
  --x6698-bottom-nav-page-bg: #020817;
}

html body #app .vantabbar.van-tabbar,
html body #app .vantabbar.van-tabbar--fixed,
html body uni-app .vantabbar.van-tabbar,
html body uni-app .vantabbar.van-tabbar--fixed {
  background: var(--x6698-bottom-nav-bg) !important;
  background-color: var(--x6698-bottom-nav-bg) !important;
  background-image: none !important;
  opacity: 1 !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  box-sizing: content-box !important;
  padding-bottom: env(safe-area-inset-bottom, 0px) !important;
  border-top: 1px solid rgba(255, 213, 88, 0.28) !important;
  box-shadow: 0 -4px 14px rgba(0, 0, 0, 0.58) !important;
}

html body #app .vantabbar.van-tabbar .van-tabbar-item,
html body uni-app .vantabbar.van-tabbar .van-tabbar-item {
  background: var(--x6698-bottom-nav-bg) !important;
  background-color: var(--x6698-bottom-nav-bg) !important;
  background-image: none !important;
  opacity: 1 !important;
}

html body #app .vantabbar.van-tabbar .van-tabbar-item--active,
html body uni-app .vantabbar.van-tabbar .van-tabbar-item--active {
  background: linear-gradient(180deg, #7e1d20 0%, #451017 100%) #5d151b !important;
  background-color: #5d151b !important;
}

@media (max-width: 520px) {
  html,
  body,
  body > uni-app,
  #app {
    background-color: var(--x6698-bottom-nav-page-bg) !important;
  }

  html body #app .vantabbar.van-tabbar,
  html body uni-app .vantabbar.van-tabbar {
    height: 1.08rem !important;
    min-height: 1.08rem !important;
  }
}

@media (min-width: 521px) {
  html body #app .vantabbar.van-tabbar,
  html body uni-app .vantabbar.van-tabbar {
    height: 48px !important;
    min-height: 48px !important;
  }
}
