Move constant inline styles into makeStyles

frontend/src/pages/DashboardPage.tsx

@@ -31,6 +31,12 @@ const useStyles = makeStyles({
     flexDirection: "column",
     gap: tokens.spacingVerticalM,
   },
+  filterRow: {
+    display: "flex",
+    alignItems: "center",
+    gap: tokens.spacingHorizontalM,
+    flexWrap: "wrap",
+  },
   sectionHeader: {
     display: "flex",
     alignItems: "center",
@@ -89,7 +95,7 @@ export function DashboardPage(): React.JSX.Element {
       {/* ------------------------------------------------------------------ */}
       {/* Global filter bar                                                  */}
       {/* ------------------------------------------------------------------ */}
-      <div style={{ display: "flex", alignItems: "center", gap: tokens.spacingHorizontalM, flexWrap: "wrap" }}>
+      <div className={styles.filterRow}>
         <DashboardFilterBar
           timeRange={timeRange}
           onTimeRangeChange={setTimeRange}