We already decided on UA styles for base appearance drop-down single-select elements here: #10857

I'd like to decide on UA styles for listbox select elements, with or without the multiple attribute. Most of the styles from drop-down single-selects can be reused, but here are some changes I'd like to propose. Until #7422 gets resolved, I'm going to write these with a :has-picker pseudo-class.

Make these style which currently apply to the select element only apply to drop-down selects:

select:has-picker {
  border-radius: 0.5em;
  padding-block: 0.25em;
  padding-inline: 0.5em;
  min-block-size: calc-size(auto, max(size, 24px, 1lh));
  min-inline-size: calc-size(auto, max(size, 24px));
  display: inline-flex;
  gap: 0.5em;
  field-sizing: content !important;
  box-sizing: border-box;
}

Add these styles which only apply to listbox selects:

select:not(:has-picker) {
  display: inline-block;
  overflow-inline: auto;
  overflow-block: auto;
}

Change the selectors of the hover/active/disabled rules to only apply when the select has a picker:

select:has-picker:enabled:hover {
  ...
}
select:has-picker:enabled:active {
  ...
}
select:has-picker:disabled {
  ...
}