diff --git a/admin-spa/src/components/PageHeader.tsx b/admin-spa/src/components/PageHeader.tsx
index d8d95df..98fd738 100644
--- a/admin-spa/src/components/PageHeader.tsx
+++ b/admin-spa/src/components/PageHeader.tsx
@@ -1,5 +1,6 @@
 import React from 'react';
 import { usePageHeader } from '@/contexts/PageHeaderContext';
+import { useLocation } from 'react-router-dom';
 
 interface PageHeaderProps {
   fullscreen?: boolean;
@@ -8,15 +9,21 @@ interface PageHeaderProps {
 
 export function PageHeader({ fullscreen = false, hideOnDesktop = false }: PageHeaderProps) {
   const { title, action } = usePageHeader();
+  const location = useLocation();
 
   if (!title) return null;
 
+  // Only apply max-w-5xl for settings pages (boxed layout)
+  // All other pages should be full width
+  const isSettingsPage = location.pathname.startsWith('/settings');
+  const containerClass = isSettingsPage ? 'w-full max-w-5xl mx-auto' : 'w-full';
+
   // PageHeader is now ABOVE submenu in DOM order
   // z-20 ensures it stays on top when both are sticky
   // Only hide on desktop if explicitly requested (for mobile-only headers)
   return (
     <div className={`sticky top-0 z-20 border-b bg-background ${hideOnDesktop ? 'md:hidden' : ''}`}>
-      <div className="w-full max-w-5xl mx-auto px-4 py-3 flex items-center justify-between min-w-0">
+      <div className={`${containerClass} px-4 py-3 flex items-center justify-between min-w-0`}>
         <div className="min-w-0 flex-1">
           <h1 className="text-lg font-semibold truncate">{title}</h1>
         </div>