/* Barra di navigazione in basso — solo telefono */
.bottom-nav { display: none; }
@media (max-width: 899px) {
  body { padding-bottom: calc(76px + env(safe-area-inset-bottom)); }
  .bottom-nav {
    display: grid; grid-auto-flow: column; grid-auto-columns: 1fr;
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 50;
    background: rgba(13, 35, 64, .97);
    -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
    border-top: 1px solid var(--border);
    padding: 6px max(6px, env(safe-area-inset-left)) calc(6px + env(safe-area-inset-bottom)) max(6px, env(safe-area-inset-right));
  }
  .bottom-nav button {
    position: relative; width: auto; margin: 0; min-height: 56px; padding: 6px 2px 4px;
    display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px;
    background: transparent; border: 0; border-radius: 12px; color: var(--text-muted, var(--muted));
    font-size: .72rem; font-weight: 600; letter-spacing: .01em; line-height: 1.1;
    -webkit-tap-highlight-color: transparent;
  }
  .bottom-nav button:hover { background: transparent; }
  .bottom-nav svg { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
  .bottom-nav button[aria-current="page"] { color: #fff; background: rgba(108, 140, 255, .18); }
  .bottom-nav button[aria-current="page"] svg { stroke: var(--accent); }
  .bottom-nav button:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }
  .nav-badge { position: absolute; top: 4px; left: calc(50% + 6px); min-width: 18px; height: 18px; padding: 0 5px; border-radius: 9px; background: var(--accent); color: #fff; font-size: .65rem; font-weight: 700; line-height: 18px; text-align: center; }
  .nav-badge[hidden] { display: none; }
  body[data-tab="info"] #installBtn { display: none !important; } /* in Info c'è già il pulsante grande */
}