/* tenshin_nav.css -- the fleet's navigation bar (tenshin_nav.js). Synced from website/dropins/: edit the drop-in.
 * The bar's own colours, light and dark, so it looks the same in every game; a game places the bar (a flex row,
 * right-aligned in its top bar) and never restyles its buttons. Modelled on Fading Wilds' /live bar. */
:root {
  --tn-nav-bg: #171a1f; --tn-nav-edge: #2f343c; --tn-nav-ink: #e8eaed; --tn-nav-dim: #8b93a0;
  --tn-nav-accent: #e0b24a; --tn-nav-play: #5fd68a; --tn-nav-play-ink: #06210f;
}
:root[data-theme="light"] {
  --tn-nav-bg: #ffffff; --tn-nav-edge: #cfd3da; --tn-nav-ink: #1d2026; --tn-nav-dim: #5c6370;
  --tn-nav-accent: #9a6f0e; --tn-nav-play: #2f8a4c; --tn-nav-play-ink: #ffffff;
}
.tn-nav { display: flex; align-items: center; gap: 6px; flex-wrap: nowrap; white-space: nowrap;
  font: 12px/1 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; }
.tn-nav-ver { color: var(--tn-nav-dim); font: 11px/1 ui-monospace, Consolas, monospace; margin-right: 2px; }
.tn-nav-btn { display: inline-flex; align-items: center; min-height: 24px; padding: 0 10px; box-sizing: border-box;
  background: var(--tn-nav-bg); color: var(--tn-nav-ink); border: 1px solid var(--tn-nav-edge); border-radius: 6px;
  font: inherit; text-decoration: none; cursor: pointer; }
.tn-nav-btn:hover, .tn-nav-btn:focus-visible { border-color: var(--tn-nav-accent); outline: none; }
/* A page's own a:hover (0,1,1) out-ranks .tn-nav-btn: the bar keeps its colours on hover and focus. */
.tn-nav .tn-nav-btn:hover, .tn-nav .tn-nav-btn:focus-visible { color: var(--tn-nav-ink); text-decoration: none; }
.tn-nav .tn-nav-play:hover, .tn-nav .tn-nav-play:focus-visible { color: var(--tn-nav-play-ink); }
.tn-nav-ghost { background: transparent; }
.tn-nav-theme { padding: 0 8px; min-width: 28px; justify-content: center; font-size: 14px; }
.tn-nav-play { background: var(--tn-nav-play); color: var(--tn-nav-play-ink); border-color: transparent; font-weight: 600; }
.tn-nav-out { display: contents; margin: 0; }
.tn-nav-last { display: contents; }
/* Narrow screens: the build and About go first; Feedback, Tenshin Arts, the theme and Sign out stay. */
@media (max-width: 640px) {
  .tn-nav-ver, .tn-nav-about { display: none; }
  .tn-nav-btn { padding: 0 8px; }
}
