diff --git a/components/ComposeEmail.tsx b/components/ComposeEmail.tsx
index eb08d6a4..bc0614dc 100644
--- a/components/ComposeEmail.tsx
+++ b/components/ComposeEmail.tsx
@@ -132,6 +132,19 @@ export default function ComposeEmail({
             // Parse the email to get headers and content - using the same function as panel 3
             const decoded = await decodeEmail(emailToProcess.content);
             
+            // This is exactly how panel 3 handles email content - simple sanitization of HTML or showing text
+            let cleanContent = '';
+            
+            if (decoded.html) {
+              // Just sanitize the HTML directly - same as panel 3
+              cleanContent = DOMPurify.sanitize(decoded.html);
+            } else if (decoded.text) {
+              // Use whitespace-pre-wrap for text - same as panel 3
+              cleanContent = `<div class="whitespace-pre-wrap">${decoded.text}</div>`;
+            } else {
+              cleanContent = '<div>No displayable content available</div>';
+            }
+            
             // Format the content based on reply type
             const quotedContent = type === 'forward' ? `
               <div class="forwarded-message" style="border-top: 1px solid #e5e7eb; padding-top: 20px; margin-top: 20px; color: #6b7280; font-size: 0.875rem;">
@@ -142,15 +155,15 @@ export default function ComposeEmail({
                 To: ${decoded.to || ''}<br/>
                 ${decoded.cc ? `Cc: ${decoded.cc}<br/>` : ''}
               </div>
-              <div class="message-content" style="margin-top: 10px; border: 1px solid #e5e7eb; padding: 10px; border-radius: 4px; max-height: 300px; overflow-y: auto; color: #374151;">
-                ${decoded.html ? DOMPurify.sanitize(decoded.html) : (decoded.text ? `<pre style="white-space: pre-wrap; word-break: break-word; font-family: system-ui, sans-serif; margin: 0;">${decoded.text}</pre>` : 'No content available')}
+              <div class="message-content prose prose-sm max-w-none" style="margin-top: 10px; border: 1px solid #e5e7eb; padding: 10px; border-radius: 4px; max-height: 300px; overflow-y: auto; color: #374151;">
+                ${cleanContent}
               </div>
             ` : `
               <div class="quoted-message" style="border-top: 1px solid #e5e7eb; padding-top: 20px; margin-top: 20px; color: #6b7280; font-size: 0.875rem;">
                 On ${decoded.date ? decoded.date.toLocaleString() : new Date().toLocaleString()}, ${decoded.from || 'Unknown Sender'} wrote:
               </div>
-              <div class="message-content" style="margin: 10px 0 0 10px; padding: 10px; border-left: 2px solid #e5e7eb; border: 1px solid #e5e7eb; border-radius: 4px; max-height: 300px; overflow-y: auto; color: #374151;">
-                ${decoded.html ? DOMPurify.sanitize(decoded.html) : (decoded.text ? `<pre style="white-space: pre-wrap; word-break: break-word; font-family: system-ui, sans-serif; margin: 0;">${decoded.text}</pre>` : 'No content available')}
+              <div class="message-content prose prose-sm max-w-none" style="margin: 10px 0 0 10px; padding: 10px; border-left: 2px solid #e5e7eb; border: 1px solid #e5e7eb; border-radius: 4px; max-height: 300px; overflow-y: auto; color: #374151;">
+                ${cleanContent}
               </div>
             `;