/* ================================================
   nav.css — Sticky navigation bar
   ================================================ */

.nav-bar{
  position:sticky;top:0;z-index:1001;
  background:var(--pixel-bg);border-bottom:1px solid var(--border);
  padding:0 16px;backdrop-filter:blur(6px);
  transition:background .5s,border-color .5s;
}
.nav-inner{max-width:780px;margin:0 auto;display:flex;align-items:center;justify-content:center;gap:0;flex-wrap:nowrap}
.nav-link{
  display:inline-block;padding:12px 12px;white-space:nowrap;
  font-family:'Press Start 2P',monospace;font-size:9px;
  color:var(--dim);text-decoration:none;letter-spacing:.12em;
  transition:all .25s;position:relative;
}
.nav-link:hover{color:var(--amber)}
.nav-link.active{color:var(--amber)}
.nav-link.active::after{
  content:'';position:absolute;bottom:8px;left:12px;right:12px;height:1px;
  background:var(--amber);box-shadow:0 0 6px var(--amber-glow);
}
.nav-link .bracket{color:var(--dim);font-size:8px;opacity:.5}
.nav-link:hover .bracket,.nav-link.active .bracket{color:var(--amber);opacity:.8}

@media(max-width:600px){
  .nav-inner{gap:0;overflow-x:auto;justify-content:flex-start;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  .nav-inner::-webkit-scrollbar{display:none}
  .nav-link{padding:10px 8px;font-size:7px;letter-spacing:.08em;white-space:nowrap}
  .nav-link .bracket{font-size:6px}
}