diff --git a/frontend/src/routes/login/+page.svelte b/frontend/src/routes/login/+page.svelte
index f1c0785f..261d3798 100644
--- a/frontend/src/routes/login/+page.svelte
+++ b/frontend/src/routes/login/+page.svelte
@@ -9,7 +9,7 @@ const localeMap = { DE: 'de', EN: 'en', ES: 'es' } as const;
 const activeLocale = $derived(getLocale().toUpperCase());
 </script>
 
-<div class="relative flex min-h-screen flex-col bg-surface">
+<div class="relative flex min-h-screen flex-col bg-canvas">
 	<!-- DGB purple accent strip -->
 	<div class="h-1 bg-brand-purple"></div>