Make the card-chooser selection trigger a primary dropdown button

The "N selected" bulk-selection trigger was a flat teal pill that read as
a regression from the previous dropdown. Keep BoxelDropdown + Menu (the
right primitives for an action menu) and restyle the trigger as a proper
primary dropdown button, modeled on the boxel-ui primary Button / highlight
ContextButton:

- highlight fill with --boxel-highlight-foreground text, deepening to
  --boxel-highlight-hover on hover and while the menu is open
- roomier internal spacing and a taller min-height so the content is no
  longer squished
- keyboard focus draws a ring outside the button and no longer darkens the
  fill (deepening is reserved for hover / open)
- the caret flips to point up while the menu is open

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

Author: lukemelia

packages/host/app/components/card-search/search-result-header.gts

@@ -141,23 +141,35 @@ export default class SearchResultHeader extends Component<Signature> {
         gap: var(--boxel-sp-xs);
       }
 
+      /* Primary dropdown trigger (not a flat pill): the highlight fill
+         with its readable foreground, deepening on hover and while the
+         menu is open. Modeled on the boxel-ui primary button / highlight
+         ContextButton so it reads as a standard dropdown control rather
+         than a one-off chip. */
       .selection-dropdown-trigger {
         display: inline-flex;
         align-items: center;
-        gap: var(--boxel-sp-5xs);
-        min-height: 1.625rem;
-        padding: 0 var(--boxel-sp-xs);
+        gap: var(--boxel-sp-xxs);
+        min-height: 2rem;
+        padding-inline: var(--boxel-sp-xs);
         border: none;
-        border-radius: 0.375rem;
+        border-radius: var(--boxel-border-radius-sm);
         background-color: var(--boxel-highlight);
-        color: var(--boxel-dark);
+        color: var(--boxel-highlight-foreground);
         font: 700 var(--boxel-font-sm);
         cursor: pointer;
+        transition: background-color var(--boxel-transition);
       }
       .selection-dropdown-trigger:hover,
-      .selection-dropdown-trigger:focus-visible {
+      .selection-dropdown-trigger[aria-expanded='true'] {
         background-color: var(--boxel-highlight-hover);
       }
+      /* Keyboard focus shows a ring just outside the button; the fill is
+         not darkened on focus (deepening is reserved for hover / open). */
+      .selection-dropdown-trigger:focus-visible {
+        outline: 2px solid var(--boxel-highlight);
+        outline-offset: 2px;
+      }
       .selection-trigger-icon {
         width: 0.875rem;
         height: 0.875rem;
@@ -169,6 +181,12 @@ export default class SearchResultHeader extends Component<Signature> {
       }
       .dropdown-arrow {
         flex-shrink: 0;
+        transition: transform var(--boxel-transition);
+      }
+      /* Caret flips to point up while the menu is open, matching the
+         standard dropdown affordance. */
+      .selection-dropdown-trigger[aria-expanded='true'] .dropdown-arrow {
+        transform: rotate(180deg);
       }
       .selection-menu {
         --boxel-menu-item-content-padding: var(--boxel-sp-xs) var(--boxel-sp-sm);