/* "online now / visitors" line at the top of the history pane, and the opt-out button in the Privacy Policy. */
#visitorStats { display: flex; align-items: center; justify-content: center; gap: 6px; flex: 0 0 auto;
  padding: 4px 10px 2px; font-size: 12px; line-height: 1.4; color: var(--text); opacity: 0.78; letter-spacing: 0;
  font-variant-numeric: tabular-nums; user-select: none; }
#visitorStats[hidden] { display: none !important; }
#visitorStats .vs-dot { width: 7px; height: 7px; border-radius: 50%; background: #3ddc84; box-shadow: 0 0 0 0 rgba(61,220,132,.55); animation: vs-pulse 2.4s ease-out infinite; flex: 0 0 auto; }
#visitorStats .vs-info { box-sizing: border-box; display: inline-flex !important; align-items: center; justify-content: center; width: 16px !important; min-width: 16px !important; max-width: 16px; height: 16px !important; min-height: 16px !important; margin: 0 !important; padding: 0 !important; border-radius: 50%; border: 1px solid currentColor; background: transparent; color: inherit;
  font: italic 600 10px/1 Georgia, serif; cursor: pointer; opacity: .7; flex: 0 0 16px; }
#visitorStats .vs-info:hover, #visitorStats .vs-info:focus-visible { opacity: 1; outline: none; }
@keyframes vs-pulse { 0% { box-shadow: 0 0 0 0 rgba(61,220,132,.55); } 70% { box-shadow: 0 0 0 6px rgba(61,220,132,0); } 100% { box-shadow: 0 0 0 0 rgba(61,220,132,0); } }
@media (prefers-reduced-motion: reduce) { #visitorStats .vs-dot { animation: none; } }
.vs-optout { font: inherit; padding: 8px 14px; border-radius: 8px; border: 1px solid var(--primary, #4c9aff); background: transparent; color: var(--primary, #4c9aff); cursor: pointer; }
/* Portrait phones: the container's 10px padding made the line sit low (about 21px under the header, 2px above the list).
   Pull it up and rebalance so the text is centred between the header rule and the history card. */
@media (max-width: 600px) and (orientation: portrait) {
  #visitorStats { margin-top: -10px; padding: 5px 10px 12px; }
}