fix: wider middle column, narrower detail pane, horizontal scrollbar in table view

frontend/src/components/contacts/ContactList.tsx

@@ -753,7 +753,7 @@ export function ContactList({
 
     return (
       <div className="flex flex-col h-full" data-testid="contact-table-view">
-        <div ref={scrollRef} className="flex-1 overflow-auto" style={{ maxHeight: '70vh' }}>
+        <div ref={scrollRef} className="flex-1 overflow-x-auto overflow-y-auto">
           <table
             className="text-sm"
             style={{

frontend/src/pages/ContactsList.tsx

@@ -550,9 +550,9 @@ export function ContactsListPage() {
 
         {/* Middle: Contact list — resizable */}
         <ResizablePanel
-          initialWidth={400}
+          initialWidth={600}
-          minWidth={250}
+          minWidth={300}
-          maxWidth={600}
+          maxWidth={1200}
           className="border-r border-secondary-200 bg-white"
           data-testid="contact-list-pane"
         >
@@ -579,9 +579,11 @@ export function ContactsListPage() {
           </div>
         </ResizablePanel>
 
-        {/* Right: Detail panel — flex-1, not resizable */}
+        {/* Right: Detail panel — not resizable, limited width */}
         <ResizablePanel
           resizable={false}
+          initialWidth={400}
+          maxWidth={500}
           className="bg-white"
           data-testid="contact-detail-pane"
         >