.vatflow-app-nav {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: var(--vatflow-nav-h, 28px);
  z-index: 700;
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 0 12px;
  background: #0a0e14;
  border-bottom: 1px solid #1e2834;
  font-family: ui-monospace, "SF Mono", "JetBrains Mono", Menlo, Consolas, monospace;
  font-size: 10px;
  letter-spacing: 0.06em;
}

.vatflow-app-nav .vf-brand {
  color: #8a97a3;
  margin-right: 8px;
  white-space: nowrap;
}

.vatflow-app-nav .vf-brand b {
  color: #d4dde6;
  font-weight: 700;
}

.vatflow-app-nav .vf-brand .vf-tagline {
  color: #5c6b78;
  letter-spacing: 0.04em;
}

@media (max-width: 860px) {
  .vatflow-app-nav .vf-brand .vf-tagline { display: none; }
}

.vatflow-app-nav a {
  color: #8a97a3;
  text-decoration: none;
  padding: 3px 8px;
  border-radius: 4px;
  border: 1px solid transparent;
  transition: 0.12s;
  white-space: nowrap;
}

.vatflow-app-nav a:hover {
  color: #d4dde6;
  background: #121820;
  border-color: #2a3848;
}

.vatflow-app-nav a.active {
  color: #e8a838;
  background: rgba(232, 168, 56, 0.12);
  border-color: rgba(232, 168, 56, 0.35);
  font-weight: 700;
}

.vatflow-app-nav .vf-spacer {
  flex: 1;
}

.vatflow-app-nav .vf-privacy {
  color: #5c6b78;
  font-size: 9px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.vatflow-app-nav .vf-privacy:hover {
  color: #8a97a3;
  background: transparent;
  border-color: transparent;
}

/* Sticky header variant (TBFM, tower page) */
.app-header .vatflow-app-nav {
  position: relative;
  flex: none;
}

.tower-page .vatflow-app-nav {
  position: sticky;
}