/* Slim site nav shared by / and /beats. Overlays the top of the page, above the world layer. */
.topnav { position: absolute; top: 3.9rem; left: var(--gutter); right: var(--gutter); z-index: var(--z-ui);
  display: flex; flex-wrap: wrap; gap: .2rem 1.4rem; }
@media (min-width: 561px) { .topnav { top: 1.1rem; right: auto; } }
.topnav a { display: inline-flex; align-items: center; min-height: 2.75rem; padding: 0 .2rem;
  min-width: 2.75rem; justify-content: center;
  font: 600 .72rem/1 var(--font-mono); letter-spacing: .14em; text-transform: uppercase; color: var(--color-ink-strong); text-decoration: none; }
.crumbs a { display: inline-flex; align-items: center; min-height: 2.75rem; }
.topnav a:hover, .topnav a[aria-current="page"] { color: var(--color-accent-bright); text-decoration: underline; text-underline-offset: .3em; }
html.gated .topnav { visibility: hidden; }