diff --git a/src/components/auth/LoginDialog.vue b/src/components/auth/LoginDialog.vue
index 1f2d592..485f1f8 100644
--- a/src/components/auth/LoginDialog.vue
+++ b/src/components/auth/LoginDialog.vue
@@ -125,7 +125,7 @@ function handleKeydown(event: KeyboardEvent) {
 
 <template>
   <Dialog :open="isOpen" @update:open="handleClose">
-    <DialogContent class="sm:max-w-[425px]">
+    <DialogContent class="sm:max-w-[425px] md:max-w-[500px] lg:max-w-[600px] xl:max-w-[700px]">
       <DialogHeader>
         <DialogTitle class="flex items-center gap-2">
           <User class="w-5 h-5" />
diff --git a/src/pages/Login.vue b/src/pages/Login.vue
index 8cd17a7..e12ef3e 100644
--- a/src/pages/Login.vue
+++ b/src/pages/Login.vue
@@ -1,6 +1,6 @@
 <template>
-  <div class="container py-8 space-y-6">
-    <div class="flex flex-col items-center justify-center min-h-[60vh] space-y-8">
+  <div class="w-full px-4 sm:px-6 lg:px-8 xl:px-12 2xl:px-16 py-8 space-y-6">
+    <div class="flex flex-col items-center justify-center min-h-[60vh] space-y-8 max-w-4xl mx-auto">
       <!-- Welcome Section -->
       <div class="text-center space-y-4">
         <div class="flex justify-center">