style(usage): keep filters single-bordered and fixed width

Remove the nested filter outline and stop usage filter controls from resizing with their selected text.

src/components/SelectMenu.tsx

@@ -55,7 +55,7 @@ export function SelectMenu({
     const placeAbove = spaceBelow < minimumHeight && spaceAbove > spaceBelow;
     const available = placeAbove ? spaceAbove : spaceBelow;
     const height = Math.min(preferredHeight, Math.max(Math.min(minimumHeight, available), available));
-    const width = Math.max(rect.width, 180);
+    const width = Math.min(320, Math.max(rect.width, 180));
     const maxLeft = Math.max(edgeGap, window.innerWidth - edgeGap - width);
     const left = Math.min(Math.max(edgeGap, rect.left), maxLeft);
     const desiredTop = placeAbove ? rect.top - triggerGap - height : rect.bottom + triggerGap;

src/styles/usage-subpages.css

@@ -98,29 +98,42 @@
   background: var(--usage-page-hover);
 }
 
-/* Keep every usage filter visible. Each select sizes to its option text. */
-.usage-records-page .usage-filter-group {
-  display: flex;
-  flex-wrap: wrap;
-  align-items: center;
-  grid-template-columns: none;
+/* One fixed-width control per filter. The menu fills the outer field. */
+.usage-records-page .usage-filter-item {
+  width: auto;
+  min-width: 0;
+  padding: 0;
+  overflow: hidden;
 }
 
-.usage-records-page .usage-filter-item {
-  flex: 0 0 auto;
-  width: max-content;
-  max-width: 100%;
-  min-width: 0;
+.usage-records-page .usage-filter-item .select-menu,
+.usage-records-page .usage-filter-item .select-menu-trigger {
+  width: 100%;
+  height: 100%;
+  min-height: 0;
+  border: 0;
+  border-radius: inherit;
+  background: transparent;
+  box-shadow: none;
+}
+
+.usage-records-page .usage-filter-item .select-menu-trigger {
+  grid-template-columns: minmax(0, 1fr) 16px;
   padding: 0 10px 0 12px;
 }
 
+.usage-records-page .usage-filter-item .select-menu-trigger:hover:not(:disabled),
+.usage-records-page .usage-filter-item .select-menu.open .select-menu-trigger {
+  border-color: transparent;
+  background: transparent;
+}
+
 .usage-records-page .usage-filter-item select {
-  width: max-content;
+  width: 100%;
   max-width: 100%;
   min-width: 0;
-  field-sizing: content;
   padding: 0 20px 0 0;
-  background-color: var(--bg-primary);
+  background-color: transparent;
   color: var(--text-primary);
   color-scheme: inherit;
 }