.header-navigation-group { gap: 10px; }
.header-navigation-group > nav { gap: 18px; }
.header-tools { gap: 4px; }
.view-counter {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  min-width: 32px;
  min-height: 32px;
  color: rgb(var(--color-on-surface-variant));
  font-family: "JetBrains Mono", ui-monospace, monospace;
  font-size: 11px;
  line-height: 1;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.view-counter svg { width: 15px; height: 15px; flex-shrink: 0; opacity: .7; }
.theme-toggle-btn .theme-icon { width: 16px; height: 16px; flex-shrink: 0; }
.theme-toggle-btn .theme-moon { display: none; }
html.dark .theme-toggle-btn .theme-sun { display: none; }
html.dark .theme-toggle-btn .theme-moon { display: block; }
.view-counter[data-state="ready"] #view-count { animation: views-arrive 240ms ease-out; }
.view-counter[data-state="unavailable"] { opacity: .5; }
@keyframes views-arrive {
  from { opacity: 0; transform: translateY(3px); }
  to { opacity: 1; transform: translateY(0); }
}
@media (prefers-reduced-motion: reduce) {
  .view-counter[data-state="ready"] #view-count { animation: none; }
}