diff --git a/src/app/globals.css b/src/app/globals.css
index f25f9d15..7bf30a6e 100644
--- a/src/app/globals.css
+++ b/src/app/globals.css
@@ -20,6 +20,41 @@
 		0 8px 24px rgba(0, 0, 0, 0.1), 0 2px 6px rgba(0, 0, 0, 0.06);
 }
 
+/* The palette lives in plain CSS (`:root` / ThemeVars / the admin remap), so
+   Tailwind does not know these are theme colors and would otherwise skip the
+   `bg-primary`, `bg-destructive`, `text-foreground`, … utilities. Re-declare
+   them as inline theme tokens so shadcn components get their intended colors
+   while value overrides from the runtime theme still apply via the variable. */
+@theme inline {
+	--color-primary: var(--color-primary);
+	--color-primary-hover: var(--color-primary-hover);
+	--color-primary-foreground: var(--color-primary-foreground);
+	--color-background: var(--color-background);
+	--color-foreground: var(--color-foreground);
+	--color-card: var(--color-card);
+	--color-card-foreground: var(--color-card-foreground);
+	--color-popover: var(--color-popover);
+	--color-popover-foreground: var(--color-popover-foreground);
+	--color-secondary: var(--color-secondary);
+	--color-secondary-foreground: var(--color-secondary-foreground);
+	--color-muted: var(--color-muted);
+	--color-muted-foreground: var(--color-muted-foreground);
+	--color-accent: var(--color-accent);
+	--color-accent-foreground: var(--color-accent-foreground);
+	--color-destructive: var(--color-destructive);
+	--color-destructive-foreground: var(--color-destructive-foreground);
+	--color-border: var(--color-border);
+	--color-input: var(--color-input);
+	--color-ring: var(--color-ring);
+	--color-surface: var(--color-surface);
+	--color-text: var(--color-text);
+	--color-text-muted: var(--color-text-muted);
+	--color-success: var(--color-success);
+	--color-warning: var(--color-warning);
+	--color-error: var(--color-error);
+	--color-info: var(--color-info);
+}
+
 /* Default theme variables. ThemeVars may override these at runtime. */
 :root {
 	--color-primary: #eeb425;