.site-header .brand-wordmark {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 4px 9px;
}
.site-header .app-version {
  display: inline-flex;
  align-items: center;
  border: 1px solid rgba(71, 215, 172, .24);
  border-radius: 7px;
  padding: 3px 7px;
  background: rgba(71, 215, 172, .07);
  color: var(--accent);
  font: 600 .75rem/1.2 ui-monospace, SFMono-Regular, monospace;
  letter-spacing: 0;
  white-space: nowrap;
}
.app-version[hidden] { display: none !important; }
@media (max-width: 360px) {
  .site-header .brand { font-size: 1rem; gap: 6px; }
  .site-header .brand img { width: 32px; height: 32px; }
  .site-header .brand-wordmark { gap: 3px 5px; }
  .site-header .app-version { padding: 3px 5px; }
  .site-header .menu-toggle { width: 36px; height: 36px; flex-shrink: 0; }
}