@media (min-width: 1024px) {
  html, body, #root {
    background: #000;
  }

  main.pt-14.px-4.min-h-screen > div.max-w-lg.mx-auto.py-4 {
    max-width: 1200px !important;
    padding-left: 24px;
    padding-right: 24px;
  }

  .w-full.max-w-sm,
  .w-full.max-w-md {
    max-width: 460px !important;
  }

  nav.bottom-nav {
    left: 50% !important;
    transform: translateX(-50%) !important;
    width: min(1200px, calc(100vw - 48px)) !important;
    border: 1px solid rgba(212, 175, 55, 0.12);
    border-bottom: none;
    border-radius: 18px 18px 0 0;
    background: rgba(0, 0, 0, 0.92);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
  }

  .fixed.inset-0 .max-w-xs,
  .fixed.inset-0 .max-w-sm,
  .fixed.inset-0 .max-w-md,
  .fixed.inset-0 .max-w-lg {
    max-width: 560px !important;
  }

  .grid.grid-cols-2.gap-3,
  .grid.grid-cols-2.gap-4 {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .grid.grid-cols-3.gap-3,
  .grid.grid-cols-3.gap-4 {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }

  .grid.grid-cols-4,
  .grid.grid-cols-5,
  .grid.grid-cols-6,
  .grid.grid-cols-7 {
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)) !important;
  }

  .min-h-screen.bg-black.flex.flex-col.items-center.justify-center.px-6.py-8 > .relative.z-10.w-full.max-w-sm {
    max-width: 460px !important;
  }
}
