feat(ui): add SelectMenu component and replace native selects

Introduce a reusable SelectMenu component and replace native select
controls across the UI. This centralizes select behavior and styling,
enabling grouped options, placeholders, and a consistent popup
interaction. Add comprehensive CSS and light-theme tweaks, and update
rebase action styling to integrate the new control.

- Add a unified SelectMenu component and wire change handlers.
- Implement .select-menu styles, popup behavior, and theme overrides.
- Replace ad-hoc native selects in dialogs and rebase UI for consistency.

src/lib/components/AppSettingsDialog.svelte

@@ -37,6 +37,7 @@
     ExternalToolsSettings,
     ToolOpenMode,
   } from "../types";
+  import SelectMenu from "./SelectMenu.svelte";
 
   type SettingsPage = "general" | "tools";
 
@@ -390,17 +391,17 @@
 
               <label class="tool-default-field">
                 <span>{isGerman ? `Standardprogramm für ${toolLabel(activeToolKind)}` : `Default application for ${toolLabel(activeToolKind)}`}</span>
-                <select value={tools[activeToolKind].preset} onchange={(event) => changePreset(activeToolKind, event.currentTarget.value)} aria-label={isGerman ? `Standardprogramm für ${toolLabel(activeToolKind)}` : `Default application for ${toolLabel(activeToolKind)}`}>
-                  {#if availablePresets(activeToolKind).length > 0}
-                    <optgroup label={isGerman ? "Installiert" : "Installed"}>
-                      {#each availablePresets(activeToolKind) as preset}<option value={preset.id}>✓ {preset.label}</option>{/each}
-                    </optgroup>
-                  {/if}
-                  <optgroup label={isGerman ? "Weitere unterstützte Programme" : "Other supported applications"}>
-                    {#each otherPresets(activeToolKind) as preset}<option value={preset.id}>{preset.label}</option>{/each}
-                  </optgroup>
-                  <option value="custom">{isGerman ? "Eigenes Programm auswählen…" : "Choose a custom application…"}</option>
-                </select>
+                <SelectMenu
+                  class="tool-preset-select"
+                  value={tools[activeToolKind].preset}
+                  options={[
+                    ...availablePresets(activeToolKind).map((preset) => ({ value: preset.id, label: `Installed - ${preset.label}`, group: isGerman ? "Installiert" : "Installed" })),
+                    ...otherPresets(activeToolKind).map((preset) => ({ value: preset.id, label: preset.label, group: isGerman ? "Weitere unterstützte Programme" : "Other supported applications" })),
+                    { value: "custom", label: isGerman ? "Eigenes Programm auswählen..." : "Choose a custom application..." },
+                  ]}
+                  ariaLabel={isGerman ? `Standardprogramm für ${toolLabel(activeToolKind)}` : `Default application for ${toolLabel(activeToolKind)}`}
+                  onChange={(value) => changePreset(activeToolKind, value)}
+                />
                 <small>{isGerman ? "Diese Auswahl wird gespeichert und für alle passenden Aktionen verwendet." : "This selection is saved and used for every matching action."}</small>
               </label>
 
@@ -504,8 +505,8 @@
   .tool-open-mode button span { max-width: 100%; overflow: hidden; font-size: 11px; font-weight: 800; text-overflow: ellipsis; white-space: nowrap; }
   .tool-open-mode button small { color: var(--color-ink-faint); font-size: 9px; font-weight: 550; }
   .tool-default-field, .tool-advanced-panel label { display: grid; gap: 6px; min-width: 0; color: var(--color-ink-muted); font-size: 10.5px; font-weight: 750; }
-  .tool-default-field select, .tool-advanced-panel input, .tool-advanced-panel textarea { width: 100%; min-width: 0; border: 1px solid var(--color-border); border-radius: 7px; color: var(--color-ink); background: var(--color-surface-raised); font: inherit; }
-  .tool-default-field select { height: 38px; padding: 0 11px; font-size: 12px; font-weight: 700; }
+  .tool-advanced-panel input, .tool-advanced-panel textarea { width: 100%; min-width: 0; border: 1px solid var(--color-border); border-radius: 7px; color: var(--color-ink); background: var(--color-surface-raised); font: inherit; }
+  :global(.tool-preset-select .select-menu-trigger) { height: 38px; min-height: 38px; padding: 0 11px; border-color: var(--color-border); font-size: 12px; font-weight: 700; }
   .tool-default-field small { color: var(--color-ink-faint); font-size: 9.5px; font-weight: 500; }
   .tool-usage-callout { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: start; gap: 10px; padding: 10px 11px; border-left: 2px solid var(--color-accent); border-radius: 0 7px 7px 0; background: color-mix(in srgb, var(--color-accent) 6%, transparent); }
   .tool-usage-callout span { color: var(--color-accent); font-size: 9.5px; font-weight: 850; text-transform: uppercase; letter-spacing: .04em; }