Say how many search results there are, in a combobox

M3's search accessibility page asks that results be announced when they
appear and read as a list. The bar now wraps its input in a
role="combobox" that carries aria-expanded and aria-controls — ARIA gives
a bare textbox neither — the results container is a role="list", and a
polite live region counts the results whenever the view's DOM settles.

Plan step 13, finding IN-01.

Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01Qwx5USif3wFFmxtHg5U1g9

resources/css/components/search.css

@@ -11,9 +11,11 @@
  *
  *   [data-search]            the root; data-open, data-full-screen
  *     [data-search-bar]      the pill, above the view
- *       [data-search-leading], [data-search-input], [data-search-clear], [data-search-trailing]
+ *       [data-search-leading], [data-search-field] (the combobox around [data-search-input]),
+ *       [data-search-clear], [data-search-trailing]
  *     [data-search-view]     the container behind the bar
  *       [data-search-results]
+ *     [data-search-status]   the polite live region that counts the results
  */
 
 @layer components {
@@ -86,6 +88,14 @@
         outline-offset: -3px;
     }
 
+    /* The combobox wrapper is only a role holder; it has to lay out as the input used to. */
+    [data-search-field] {
+        display: flex;
+        flex: 1 1 0%;
+        min-width: 0;
+        height: 100%;
+    }
+
     [data-search-input] {
         flex: 1 1 0%;
         min-width: 0;