
/* bottom-nav.css v1.1 — namespaced to avoid conflicts */
:root {
  --bn-bg: #ffffff;
  --bn-text: #111111;
  --bn-muted: #8a8a8a;
  --bn-border: #e5e5e5;
  --bn-active: #0077ff;
  --bn-z: 50;
  --bn-font: system-ui, -apple-system, Segoe UI, Roboto, Arial, "Noto Sans", "Helvetica Neue", sans-serif;
}
.bn-container { position: sticky; bottom: 0; left: 0; right: 0; z-index: var(--bn-z); background: var(--bn-bg); border-top: 1px solid var(--bn-border); font-family: var(--bn-font); }
.bn-nav { max-width: 1000px; margin: 0 auto; }
.bn-list { display: flex; align-items: center; justify-content: center; gap: 0; list-style: none; padding: 0.5rem 0.75rem; margin: 0; white-space: nowrap; overflow-x: auto; }
.bn-item { display: inline-flex; align-items: center; }
.bn-link { display: inline-block; padding: 0.25rem 0.5rem; text-decoration: none; color: var(--bn-text); font-size: 0.95rem; line-height: 1.25; border-radius: 6px; }
.bn-link:focus-visible { outline: 2px solid var(--bn-active); outline-offset: 2px; }
.bn-link:hover { text-decoration: underline; }
.bn-sep { color: var(--bn-muted); padding: 0 0.35rem; user-select: none; }
.bn-link.active { color: var(--bn-active); font-weight: 600; }
/* Locale toggle */
.bn-locale { margin-left: 0.5rem; }
.bn-locale .bn-link { font-size: 0.85rem; }
.bn-locale .bn-link[aria-current="true"] { font-weight: 700; }
@media (prefers-color-scheme: dark) {
  :root { --bn-bg: #111111; --bn-text: #efefef; --bn-muted: #9a9a9a; --bn-border: #2a2a2a; --bn-active: #4da3ff; }
  .bn-link:hover { text-decoration: none; }
}
