diff --git a/frontend/src/routes/(public)/login/+page.svelte b/frontend/src/routes/(public)/login/+page.svelte
index 79a85b8..dc77604 100644
--- a/frontend/src/routes/(public)/login/+page.svelte
+++ b/frontend/src/routes/(public)/login/+page.svelte
@@ -1,4 +1,5 @@
 <script lang="ts">
+	import BrandPanel from '$lib/auth/BrandPanel.svelte';
 	import LoginForm from '$lib/auth/LoginForm.svelte';
 
 	let { form } = $props();
@@ -10,13 +11,7 @@
 
 <!-- Mobile: stacked, Desktop: side by side -->
 <div class="flex min-h-screen flex-col md:flex-row">
-	<div
-		class="bg-[var(--green)] flex flex-col items-center justify-center
-			px-6 py-7 text-center
-			md:w-1/2 md:min-h-screen md:px-10 md:py-12"
-	>
-		<span class="font-[var(--font-display)] text-4xl text-white font-medium">Mealprep</span>
-	</div>
+	<BrandPanel />
 	<div class="flex flex-1 flex-col items-start justify-center px-[20px] py-[24px] md:items-center md:px-[56px] md:py-[48px]">
 		<div class="w-full max-w-[380px]">
 			<LoginForm {form} />