[css-forms] Add select list box styles (#12908)

Author: lukewarlow

css-forms-1/Overview.bs

@@ -895,14 +895,12 @@ input[type=radio]:checked::checkmark {
     width: 100%;
 }
 ```
-## Selects & buttons ## {#stylesheet-select-button}
 
-```css
-select {
-  /* Base appearance select always sizes based on its contents. */
-  field-sizing: content !important;
-}
+## Buttons (and button-like controls) ## {#stylesheet-button}
+
+Selects are only button-like when they're a [drop-down box](https://html.spec.whatwg.org/multipage/rendering.html#drop-down-box).
 
+```css
 button,
 ::file-selector-button,
 select,
@@ -953,17 +951,11 @@ input:is([type="color"], [type="button"], [type="reset"], [type="submit"]) {
 :disabled::file-selector-button {
   color: color-mix(in srgb, currentColor 50%, transparent);
 }
+```
 
-select > button:first-child {
-  /* Prevents button from setting font, color, or background-color */
-  all: unset;
-
-  /* Prevents duplicate box decorations */
-  display: contents;
+## Selects ## {#stylesheet-select}
 
-  /* Prevents button activation behavior so select can handle events */
-  interactivity: inert !important;
-}
+```css
 select option {
   /* These min-size rules ensure accessibility by following WCAG rules:
    * https://www.w3.org/WAI/WCAG22/Understanding/target-size-minimum.html
@@ -1020,6 +1012,27 @@ select option {
   /* this creates a full bleed hover highlight */
   padding-inline: 0.5em;
 }
+```
+
+### Drop-down box selects ### {#stylesheet-dropdown-select}
+
+These styles should apply when the select is a [drop-down box](https://html.spec.whatwg.org/multipage/rendering.html#drop-down-box).
+
+```css
+select {
+  field-sizing: content !important;
+}
+
+select > button:first-child {
+  /* Prevents button from setting font, color, or background-color */
+  all: unset;
+
+  /* Prevents duplicate box decorations */
+  display: contents;
+
+  /* Prevents button activation behavior so select can handle events */
+  interactivity: inert !important;
+}
 
 select::picker-icon {
   /* margin-inline-start pushes the icon to the right of the box */
@@ -1062,6 +1075,18 @@ select::picker-icon {
 }
 ```
 
+### List box selects ### {#stylesheet-listbox-select}
+
+These styles should apply when the select is a [list box](https://html.spec.whatwg.org/multipage/rendering.html#list-box).
+
+```css
+select {
+	overflow: auto;
+  display: inline-block;
+  block-size: calc(max(24px, 1lh) * attr(size type(<integer>), 4));
+}
+```
+
 <h2 class=no-num id=changes>Changes</h2>
 
 <h3 class=no-num id=changes-20250325>Since the