diff --git a/src/renderer/src/App.tsx b/src/renderer/src/App.tsx
index f96a8ec..b20bd3d 100644
--- a/src/renderer/src/App.tsx
+++ b/src/renderer/src/App.tsx
@@ -3,24 +3,6 @@ import { FluentProvider, makeStyles, tokens } from '@fluentui/react-components'
 import { Sidebar } from './components/Sidebar'
 import { DownloadsView } from './components/DownloadsView'
 import { Onboarding } from './components/Onboarding'
-
-// Code-split the non-default tabs (PERF8): Downloads is the launch tab and stays
-// eager, but Library/History/Terminal/Settings load their chunks on first visit so
-// they (and their slice of Fluent) aren't in the initial bundle. The stores these
-// views use are imported eagerly elsewhere (App's `useDownloads` + `./store/sources`,
-// and downloads → history), so lazy-loading the *view* never delays store startup.
-const LibraryView = lazy(() =>
-  import('./components/LibraryView').then((m) => ({ default: m.LibraryView }))
-)
-const HistoryView = lazy(() =>
-  import('./components/HistoryView').then((m) => ({ default: m.HistoryView }))
-)
-const TerminalView = lazy(() =>
-  import('./components/TerminalView').then((m) => ({ default: m.TerminalView }))
-)
-const SettingsView = lazy(() =>
-  import('./components/SettingsView').then((m) => ({ default: m.SettingsView }))
-)
 import { CommandPalette, type PaletteAction } from './components/CommandPalette'
 import { LiveRegion } from './components/LiveRegion'
 import { Toaster } from './components/ui/Toaster'
@@ -39,6 +21,24 @@ import { queueSummaryOf } from './store/queueStats'
 import { useResolvedDark } from './store/systemTheme'
 import { logError } from './reportError'
 
+// Code-split the non-default tabs (PERF8): Downloads is the launch tab and stays
+// eager, but Library/History/Terminal/Settings load their chunks on first visit so
+// they (and their slice of Fluent) aren't in the initial bundle. The stores these
+// views use are imported eagerly above (`useDownloads` + `./store/sources`, and
+// downloads → history), so lazy-loading the *view* never delays store startup.
+const LibraryView = lazy(() =>
+  import('./components/LibraryView').then((m) => ({ default: m.LibraryView }))
+)
+const HistoryView = lazy(() =>
+  import('./components/HistoryView').then((m) => ({ default: m.HistoryView }))
+)
+const TerminalView = lazy(() =>
+  import('./components/TerminalView').then((m) => ({ default: m.TerminalView }))
+)
+const SettingsView = lazy(() =>
+  import('./components/SettingsView').then((m) => ({ default: m.SettingsView }))
+)
+
 // How often to check whether a scheduled ('saved' + due) download should promote
 // to the queue. 15s is plenty for the minute-granularity times the picker offers.
 const SCHEDULE_TICK_MS = 15_000
diff --git a/src/renderer/src/components/ui/Toaster.tsx b/src/renderer/src/components/ui/Toaster.tsx
index 0866a8d..dc8f468 100644
--- a/src/renderer/src/components/ui/Toaster.tsx
+++ b/src/renderer/src/components/ui/Toaster.tsx
@@ -1,4 +1,11 @@
-import { Caption1, Button, makeStyles, tokens, shorthands } from '@fluentui/react-components'
+import {
+  Caption1,
+  Button,
+  makeStyles,
+  mergeClasses,
+  tokens,
+  shorthands
+} from '@fluentui/react-components'
 import {
   DismissRegular,
   ErrorCircleFilled,
@@ -76,7 +83,7 @@ export function Toaster(): React.JSX.Element | null {
     <div className={styles.stack} role="status" aria-live="polite">
       {toasts.map((t) => (
         <div key={t.id} className={styles.toast}>
-          <span className={`${styles.icon} ${toneClass[t.tone]}`}>{ICONS[t.tone]}</span>
+          <span className={mergeClasses(styles.icon, toneClass[t.tone])}>{ICONS[t.tone]}</span>
           <Caption1 className={styles.message}>{t.message}</Caption1>
           <Button
             size="small"