/* THE DAY SWITCH (day-switch.js, 2026-10-01): Today, Tomorrow, later game days, All. The site's
   own tokens, so both themes follow. A row of pill buttons; the chosen one is brass. On a phone
   the row scrolls sideways rather than wrapping, so it stays one line under the tabs. */
.day-switch {
  display: inline-flex; gap: 4px; padding: 3px; max-width: 100%;
  border: 1px solid var(--line); border-radius: 14px; background: var(--bg-lift, transparent);
  overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch;
}
.day-switch::-webkit-scrollbar { display: none; }
.day-switch__b {
  flex: none; display: grid; justify-items: center; gap: 2px; min-width: 76px; min-height: 44px; padding: 6px 12px;
  border: 0; border-radius: 11px; background: none; color: var(--muted); font: inherit; cursor: pointer;
  transition: background 140ms ease, color 140ms ease;
}
.day-switch__b:hover:not(:disabled) { color: var(--text); background: var(--panel-2, rgba(255, 255, 255, 0.04)); }
.day-switch__b:focus-visible { outline: 2px solid var(--focus, var(--brass)); outline-offset: 2px; }
/* Above hover, which a phone keeps on the button just tapped. */
.day-switch__b[aria-pressed="true"], .day-switch__b[aria-pressed="true"]:hover:not(:disabled) { background: var(--brass); color: #141208; }
.day-switch__l { font: 800 13px/1.1 var(--display, inherit), sans-serif; letter-spacing: .04em; white-space: nowrap; }
.day-switch__s { font: 600 10.5px/1.1 var(--body, inherit), sans-serif; white-space: nowrap; opacity: .85; font-variant-numeric: tabular-nums; }
.day-switch__b[aria-pressed="true"] .day-switch__s { opacity: .75; }
.day-switch__b.is-empty { cursor: default; opacity: .45; }
.day-switch__b--all { min-width: 64px; }
@media (prefers-reduced-motion: reduce) { .day-switch__b { transition: none; } }
@media (max-width: 640px) {
  .day-switch { display: flex; width: 100%; }
  .day-switch__b { flex: 1 0 auto; min-width: 70px; padding: 6px 10px; }
}
