:root {
  --event-category-local: #8b5cf6;
  --event-category-raid-day: #f9735b;
  --event-category-raids: #dc3d4b;
  --event-category-community-day: #27845b;
  --event-category-max-battles: #3478c8;
  --event-category-research: #0891b2;
  --event-category-spotlight-hour: #c17b12;
  --event-category-stamp-rally: #be4b83;
  --event-category-other: #687386;
}

a.event-calendar-range.event-category-local,
a.event-month-calendar-range.event-category-local { background: #5939a7; border-color: #a889fa; }
a.event-calendar-range.event-category-raid-day,
a.event-month-calendar-range.event-category-raid-day { background: #a64130; border-color: #ff9b83; }
a.event-calendar-range.event-category-raids,
a.event-month-calendar-range.event-category-raids { background: #a52e3b; border-color: #ff8991; }
a.event-calendar-range.event-category-community-day,
a.event-month-calendar-range.event-category-community-day { background: #176342; border-color: #74d8a1; }
a.event-calendar-range.event-category-max-battles,
a.event-month-calendar-range.event-category-max-battles { background: #285c9c; border-color: #8cbcff; }
a.event-calendar-range.event-category-research,
a.event-month-calendar-range.event-category-research { background: #087187; border-color: #70d8e8; }
a.event-calendar-range.event-category-spotlight-hour,
a.event-month-calendar-range.event-category-spotlight-hour { background: #87540e; border-color: #ffd166; }
a.event-calendar-range.event-category-stamp-rally,
a.event-month-calendar-range.event-category-stamp-rally { background: #8f315f; border-color: #f2a0c5; }
a.event-calendar-range.event-category-other,
a.event-month-calendar-range.event-category-other { background: #4b5668; border-color: #a8b3c3; }

.event-category-local { --event-category-accent: var(--event-category-local); --event-category-surface: #5939a7; }
.event-category-raid-day { --event-category-accent: var(--event-category-raid-day); --event-category-surface: #a64130; }
.event-category-raids { --event-category-accent: var(--event-category-raids); --event-category-surface: #a52e3b; }
.event-category-community-day { --event-category-accent: var(--event-category-community-day); --event-category-surface: #176342; }
.event-category-max-battles { --event-category-accent: var(--event-category-max-battles); --event-category-surface: #285c9c; }
.event-category-research { --event-category-accent: var(--event-category-research); --event-category-surface: #087187; }
.event-category-spotlight-hour { --event-category-accent: var(--event-category-spotlight-hour); --event-category-surface: #87540e; }
.event-category-stamp-rally { --event-category-accent: var(--event-category-stamp-rally); --event-category-surface: #8f315f; }
.event-category-other { --event-category-accent: var(--event-category-other); --event-category-surface: #4b5668; }

.event-category-swatch,
.event-calendar-legend-dot[class*="event-category-"] { background: var(--event-category-accent); }
.event-category-swatch { width: 11px; height: 11px; flex: 0 0 11px; border: 1px solid rgba(255, 255, 255, .45); border-radius: 50%; }

span.event-calendar-spot[class*="event-category-"],
span.event-month-calendar-spot[class*="event-category-"] {
  border-left-color: var(--event-category-accent);
  background: var(--event-category-surface);
}
.event-calendar-event[class*="event-category-"],
.event-month-calendar-event[class*="event-category-"] { border-left: 3px solid var(--event-category-accent); }

.event-category-menu { display: grid; gap: 3px; padding: 6px; }
.event-category-option,
.event-calendar-legend .event-category-option {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 40px;
  padding: 7px 10px;
  border: 1px solid transparent;
  border-radius: 7px;
  color: inherit;
  font: inherit;
  text-align: left;
  background: transparent;
  cursor: pointer;
  touch-action: manipulation;
}
.event-category-option:hover { background: rgba(255, 255, 255, .08); }
.event-category-option[aria-pressed="true"],
.event-category-option[aria-current="true"] { border-color: rgba(255, 255, 255, .2); background: rgba(255, 255, 255, .1); }
.event-category-option:focus-visible { outline: 3px solid #b8a2ff; outline-offset: 2px; }
.event-category-option[aria-pressed="true"] .event-category-swatch { box-shadow: 0 0 0 2px rgba(255, 255, 255, .2); }

@media (max-width: 720px) {
  .event-calendar-legend.event-category-options {
    display: flex;
    flex-wrap: nowrap;
    max-width: 100%;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    padding: 4px 2px 8px;
    scrollbar-width: thin;
    -webkit-overflow-scrolling: touch;
  }
  .event-calendar-legend.event-category-options .event-category-option { flex: 0 0 auto; }
}