.audience-switch {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  padding: 3px;
  border: 1px solid #ffffff20;
  border-radius: 999px;
  background: #111111ed;
  box-shadow: 0 4px 24px #00000033;
  font: 500 12px/1.2 "DM Sans", ui-sans-serif, system-ui, sans-serif;
  letter-spacing: .01em;
  backdrop-filter: blur(14px);
}
.audience-switch .audience-switch__option {
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 36px;
  gap: 8px;
  padding: 0 15px;
  border: 1px solid transparent;
  border-radius: 999px;
  color: #949494;
  background: transparent;
  text-decoration: none;
  white-space: nowrap;
  transition: color 180ms ease, background 180ms ease, border-color 180ms ease;
}
.audience-switch__option > span {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: currentColor;
  opacity: .45;
}
.audience-switch .audience-switch__option[aria-current="page"] {
  border-color: #eeeeee;
  color: #f1f1f1;
  background: #252525;
}
.audience-switch__option[aria-current="page"] > span { opacity: 1; }
.audience-switch .audience-switch__option:hover { color: #fff; background: #252525; }
.audience-switch .audience-switch__option:focus-visible { outline: 2px solid #fff; outline-offset: 3px; }
@media (prefers-reduced-motion: reduce) { .audience-switch .audience-switch__option { transition: none; } }