diff --git a/src/app/global-error.tsx b/src/app/global-error.tsx
index b909a6b..1c17f12 100644
--- a/src/app/global-error.tsx
+++ b/src/app/global-error.tsx
@@ -1,8 +1,11 @@
 "use client";
 
 // global-error.tsx — Next.js special page, rendered OUTSIDE the root layout.
-// It must be fully self-contained: no ThemeProvider, no Sonner, no context hooks.
-// Replaces the entire <html> + <body> tree when a global error occurs.
+// Must be fully self-contained: no ThemeProvider, no Sonner, no context hooks.
+// dynamic = 'force-dynamic' prevents static prerendering which crashes because
+// the build tries to resolve the full module graph including layout providers.
+
+export const dynamic = "force-dynamic";
 
 export default function GlobalError({
   error,
diff --git a/src/components/ui/sonner.tsx b/src/components/ui/sonner.tsx
index 957524e..b48dd04 100755
--- a/src/components/ui/sonner.tsx
+++ b/src/components/ui/sonner.tsx
@@ -1,14 +1,15 @@
 "use client"
 
-import { useTheme } from "next-themes"
 import { Toaster as Sonner, ToasterProps } from "sonner"
 
+// NOTE: We intentionally do NOT import useTheme from next-themes here.
+// During global-error prerendering, ThemeProvider is not mounted, and
+// useTheme() crashes with "Cannot read properties of null (reading 'useContext')".
+// Instead, we read the theme from the <html> class attribute (set by next-themes).
 const Toaster = ({ ...props }: ToasterProps) => {
-  const { theme = "system" } = useTheme()
-
   return (
     <Sonner
-      theme={theme as ToasterProps["theme"]}
+      theme="system"
       className="toaster group"
       style={
         {