.dock { display: none; }

@media (max-width: 760px) {
  .dock {
    display: block;
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 55;
    padding: 0 10px calc(10px + env(safe-area-inset-bottom, 0px));
    pointer-events: none;
  }
  .dock__inner {
    pointer-events: auto;
    display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)) auto; align-items: center; gap: 2px;
    padding: 6px;
    border-radius: 22px;
    background: rgba(15, 26, 39, 0.82);
    backdrop-filter: blur(22px) saturate(160%);
    -webkit-backdrop-filter: blur(22px) saturate(160%);
    box-shadow: 0 0 0 1px var(--ink-line-strong), 0 20px 40px -12px rgba(0, 0, 0, 0.7);
  }
  .dock__tab {
    display: grid; justify-items: center; gap: 2px;
    min-height: 48px; padding: 6px 4px; border-radius: 16px;
    color: var(--on-ink-faint); text-decoration: none; font-size: 10.5px; font-weight: 550;
    transition: color var(--dur-fast), background var(--dur-fast);
  }
  .dock__tab.is-on { color: var(--on-ink); background: rgba(255, 255, 255, 0.07); }
  .dock__tab:active { transform: scale(0.96); }
  .dock__cta {
    display: inline-flex; align-items: center; justify-content: center;
    min-height: 48px; padding: 0 18px; border-radius: 16px;
    background: var(--accent); color: var(--on-accent); font-weight: 600; font-size: 0.9rem; text-decoration: none; white-space: nowrap;
    box-shadow: 0 8px 24px -8px rgba(34, 195, 230, 0.8);
  }
  .dock__cta:active { transform: scale(0.97); }

  /* Keep the last content clear of the dock */
  .foot { padding-bottom: calc(96px + env(safe-area-inset-bottom, 0px)); }
}

body[data-menu="open"] .dock { display: none; }