.search-select { position: relative; display: flex; width: 100%; min-width: 0; }
.games-body :is(.search-select,.search-select-popup) {
  --ap-surface: var(--arena-surface); --ap-ink: var(--arena-text); --ap-line: var(--arena-line);
  --ap-soft: var(--arena-surface-raised); --ap-muted: var(--arena-muted); --ap-accent: var(--arena-mint); --ap-radius: 7px;
}
.search-select .search-select-native {
  position: absolute !important; width: 1px !important; height: 1px !important;
  padding: 0 !important; margin: 0 !important; border: 0 !important;
  clip-path: inset(50%) !important; overflow: hidden !important; pointer-events: none !important;
}
html body .search-select .search-select-input {
  width: 100%; min-width: 0; min-height: 44px; margin: 0; padding: 12px 40px 12px 14px;
  font: inherit; font-size: 16px; line-height: 1.5; text-overflow: ellipsis;
  border: 1px solid var(--ap-line,var(--line)); border-radius: var(--ap-radius,7px);
  background: var(--ap-surface,var(--surface)); color: var(--ap-ink,var(--text));
  box-shadow: none; appearance: none;
}
.search-select-input::-webkit-search-cancel-button { appearance: none; }
.search-select-input::-webkit-search-decoration { appearance: none; }
html body .search-select .search-select-input:focus {
  border-color: var(--ap-accent,var(--purple)); outline: 2px solid var(--ap-accent,var(--purple)); outline-offset: 2px; box-shadow: none;
}
html body .search-select .search-select-input[aria-invalid=true] { border-color: var(--danger,#b33a54); }
html body .search-select .search-select-input:disabled { opacity: .55; cursor: not-allowed; }
html body .search-select .search-select-toggle {
  position: absolute; inset-inline-end: 1px; top: 1px; bottom: 1px;
  width: 38px; min-width: 0; min-height: 0; margin: 0; padding: 0;
  display: grid; place-items: center; border: 0; border-radius: 0; background: transparent;
  color: var(--ap-ink,var(--text)); font: 22px/1 var(--font-body); box-shadow: none;
  transform: none; cursor: pointer;
}
html body .search-select .search-select-toggle:disabled { opacity: .5; cursor: not-allowed; }
.search-select-popup {
  position: fixed; inset: auto; z-index: 120; margin: 0; padding: 4px;
  display: flex; flex-direction: column; box-sizing: border-box; overflow: hidden;
  border: 1px solid var(--ap-line,var(--line)); border-radius: var(--ap-radius,7px);
  background: var(--ap-surface,var(--surface)); color: var(--ap-ink,var(--text));
  font: 400 15px/1.5 var(--font-body); text-align: start;
}
.search-select-popup[hidden], .search-select[hidden] { display: none !important; }
.search-select-list { min-height: 0; overflow: auto; overscroll-behavior: contain; touch-action: pan-y; }
.search-select-option { position: relative; padding: 10px 28px 10px 10px; min-height: 44px; box-sizing: border-box; overflow-wrap: anywhere; cursor: pointer; border-radius: 4px; }
.search-select-option small { display: block; font-size: 12px; color: var(--ap-muted,var(--muted)); }
.search-select-check { position: absolute; inset-inline-end: 8px; top: 10px; }
.search-select-option:is(:hover,.is-active) { background: var(--ap-soft,var(--purple-soft)); }
.search-select-option.is-active { outline: 1px solid var(--ap-accent,var(--purple)); outline-offset: -1px; }
.search-select-option[aria-disabled=true] { opacity: .5; cursor: not-allowed; }
.search-select-status { flex: 0 0 auto; padding: 8px 10px 5px; font-size: 12px; color: var(--ap-muted,var(--muted)); border-top: 1px solid var(--ap-line,var(--line)); }
@media (forced-colors: active) { .search-select-option.is-active { outline: 2px solid Highlight; } }