/* Mobile bottom navigation — frontend only */
.bottom-nav {
  display: none;
}

@media (max-width: 900px) {
  .bottom-nav {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 80;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    align-items: stretch;
    gap: 0;
    min-height: 64px;
    padding: 6px 8px calc(6px + env(safe-area-inset-bottom, 0px));
    background: rgba(11, 18, 32, 0.94);
    border-top: 1px solid rgba(248, 250, 252, 0.1);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
  }

  .bottom-nav__item {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    min-height: 52px;
    padding: 6px 4px;
    border-radius: 14px;
    color: rgba(232, 238, 245, 0.62);
    text-decoration: none;
    font: 600 0.68rem/1 "DM Sans", system-ui, sans-serif;
    letter-spacing: 0.02em;
    transition: color 0.2s ease, background 0.2s ease;
  }

  .bottom-nav__item svg {
    width: 22px;
    height: 22px;
    flex-shrink: 0;
  }

  .bottom-nav__item:active {
    background: rgba(248, 250, 252, 0.08);
  }

  .bottom-nav__item.is-active {
    color: #f8fafc;
    background: rgba(248, 250, 252, 0.1);
  }

  .bottom-nav--compact {
    grid-template-columns: repeat(2, 1fr);
  }

  /* Extra footer strip clashes with fixed bottom nav on mobile */
  .legal-strip {
    display: none;
  }
}