fix(email-viewer): Enable horizontal scroll for wide HTML emails

- Change overflow-hidden to overflow-x-auto on email body container
- Add CSS for email-content-wrapper with inline-block display
- Use width: max-content on email-content to respect intrinsic width
- Prevent tables with width="100%" from shrinking below content

Also updates dependencies:
- next: 16.0.10 -> 16.1.1
- react/react-dom: 19.2.1 -> 19.2.3
- next-intl: 4.5.8 -> 4.6.1
- tailwindcss: 4.1.17 -> 4.1.18
- eslint: 9.39.1 -> 9.39.2
- jmap-jam: 0.11.0 -> 0.13.1
- lucide-react: 0.556.0 -> 0.562.0

app/globals.css

@@ -87,12 +87,29 @@ body {
 }
 
 /* Enhanced Email Content Styling */
+
+/* Wrapper uses inline-block to size to content, enabling horizontal scroll */
+.email-content-wrapper {
+  display: inline-block;
+  min-width: 100%;
+}
+
 .email-content {
   font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
   font-size: 0.9375rem;
   line-height: 1.6;
   color: var(--color-foreground);
   max-width: none;
+  /* Size to content's natural width, don't shrink below it */
+  width: max-content;
+  min-width: 100%;
+}
+
+/* Prevent tables with width="100%" from shrinking below their content */
+.email-content table[width="100%"],
+.email-content table[style*="width:100%"],
+.email-content table[style*="width: 100%"] {
+  min-width: max-content;
 }
 
 .email-content p {

components/email/email-viewer.tsx

@@ -1195,7 +1195,7 @@ export function EmailViewer({
           )}
 
           {/* Email Body */}
-          <div className="bg-background rounded-lg shadow-sm border border-border overflow-hidden">
+          <div className="bg-background rounded-lg shadow-sm border border-border overflow-x-auto">
             <div className="email-content-wrapper p-6">
               {emailContent.isHtml ? (
                 <div

package.json

@@ -35,30 +35,30 @@
     "clsx": "^2.1.1",
     "date-fns": "^4.1.0",
     "dompurify": "^3.2.7",
-    "jmap-jam": "^0.11.0",
-    "lucide-react": "^0.556.0",
-    "next": "^16.0.8",
+    "jmap-jam": "^0.13.1",
+    "lucide-react": "^0.562.0",
+    "next": "^16.1.1",
     "next-auth": "^4.24.11",
-    "next-intl": "^4.5.8",
-    "react": "^19.2.1",
-    "react-dom": "^19.2.1",
+    "next-intl": "^4.6.1",
+    "react": "^19.2.3",
+    "react-dom": "^19.2.3",
     "tailwind-merge": "^3.3.1",
     "zustand": "^5.0.9"
   },
   "devDependencies": {
-    "@tailwindcss/postcss": "^4",
+    "@tailwindcss/postcss": "^4.1.18",
     "@types/node": "^22",
     "@types/react": "^19",
     "@types/react-dom": "^19",
-    "@typescript-eslint/eslint-plugin": "^8.49.0",
-    "@typescript-eslint/parser": "^8.49.0",
-    "eslint": "^9.39.1",
-    "eslint-config-next": "^16.0.8",
+    "@typescript-eslint/eslint-plugin": "^8.50.1",
+    "@typescript-eslint/parser": "^8.50.1",
+    "eslint": "^9.39.2",
+    "eslint-config-next": "^16.1.1",
     "eslint-plugin-react": "^7.37.5",
     "globals": "^16.5.0",
     "husky": "^9.1.7",
     "lint-staged": "^16.2.7",
-    "tailwindcss": "^4.1.17",
+    "tailwindcss": "^4.1.18",
     "typescript": "^5"
   }
 }