diff --git a/src/renderer/App.tsx b/src/renderer/App.tsx
index e19bf8c..4f27a5c 100644
--- a/src/renderer/App.tsx
+++ b/src/renderer/App.tsx
@@ -1,7 +1,14 @@
 import { AppShell } from './components/layout/AppShell';
+import { ModalLayer } from './components/modals/ModalLayer';
+import { useWelcomeTrigger } from './hooks/use-welcome-trigger';
 
 function App() {
-  return <AppShell />;
+  useWelcomeTrigger();
+  return (
+    <>
+      <AppShell />
+      <ModalLayer />
+    </>
+  );
 }
-
-export default App;
\ No newline at end of file
+export default App;
diff --git a/src/renderer/hooks/use-welcome-trigger.ts b/src/renderer/hooks/use-welcome-trigger.ts
new file mode 100644
index 0000000..a931720
--- /dev/null
+++ b/src/renderer/hooks/use-welcome-trigger.ts
@@ -0,0 +1,15 @@
+import { useEffect } from 'react';
+import { useAppStore } from '@/stores/app-store';
+import { useSettingsStore } from '@/stores/settings-store';
+
+/**
+ * On first mount, if the user hasn't dismissed the welcome dialog, open it.
+ * Call once at the top of App.tsx.
+ */
+export function useWelcomeTrigger() {
+  useEffect(() => {
+    if (!useSettingsStore.getState().welcomeDismissed) {
+      useAppStore.getState().openModal('welcome');
+    }
+  }, []);
+}