diff --git a/app/courrier/page.tsx b/app/courrier/page.tsx
index 7ef80ff7..e1ea1135 100644
--- a/app/courrier/page.tsx
+++ b/app/courrier/page.tsx
@@ -525,8 +525,7 @@ export default function CourrierPage() {
           bcc: email.bcc,
           flags: email.flags || [],
           raw: email.body || ''
-        }))
-        .sort((a: Email, b: Email) => new Date(b.date).getTime() - new Date(a.date).getTime());
+        }));
 
       // Only update unread count if we're in the Inbox folder
       if (currentView === 'INBOX') {
@@ -536,13 +535,27 @@ export default function CourrierPage() {
         setUnreadCount(unreadInboxEmails);
       }
       
+      // Sort emails by date, ensuring most recent first
+      const sortedEmails = processedEmails.sort((a: Email, b: Email) => {
+        const dateA = new Date(a.date).getTime();
+        const dateB = new Date(b.date).getTime();
+        return dateB - dateA; // Most recent first
+      });
+      
       if (isLoadMore) {
-        setEmails(prev => [...prev, ...processedEmails].sort((a: Email, b: Email) => 
-          new Date(b.date).getTime() - new Date(a.date).getTime()
-        ));
+        // When loading more, merge with existing emails and re-sort
+        setEmails(prev => {
+          const combined = [...prev, ...sortedEmails];
+          return combined.sort((a: Email, b: Email) => {
+            const dateA = new Date(a.date).getTime();
+            const dateB = new Date(b.date).getTime();
+            return dateB - dateA; // Most recent first
+          });
+        });
         setPage(prev => prev + 1);
       } else {
-        setEmails(processedEmails);
+        // For initial load or refresh, just use the sorted emails
+        setEmails(sortedEmails);
         setPage(1);
       }
 
@@ -1157,7 +1170,7 @@ export default function CourrierPage() {
   );
 
   // Add back the handleReply function
-  const handleReply = (type: 'reply' | 'reply-all' | 'forward') => {
+  const handleReply = async (type: 'reply' | 'reply-all' | 'forward') => {
     if (!selectedEmail) return;
 
     const getReplyTo = () => {
@@ -1178,45 +1191,51 @@ export default function CourrierPage() {
       return subject.startsWith('Re:') ? subject : `Re: ${subject}`;
     };
 
-    // Get the formatted original email content
-    const originalContent = getReplyBody(selectedEmail, type);
-    
-    // Create a clean structure with clear separation
-    const formattedContent = `
-      <div class="compose-area" contenteditable="true" style="min-height: 100px; padding: 10px; border: 1px solid #e5e7eb; border-radius: 4px; margin-bottom: 20px;"></div>
-      <div class="quoted-content" contenteditable="false" style="color: #6b7280; font-size: 0.875rem;">
-        ${type === 'forward' ? `
-          <div style="margin-bottom: 10px;">
-            ---------- Forwarded message ---------<br/>
-            From: ${selectedEmail.from}<br/>
-            Date: ${new Date(selectedEmail.date).toLocaleString()}<br/>
-            Subject: ${selectedEmail.subject}<br/>
-            To: ${selectedEmail.to}<br/>
-            ${selectedEmail.cc ? `Cc: ${selectedEmail.cc}<br/>` : ''}
-          </div>
-        ` : `
-          <div style="margin-bottom: 10px;">
-            On ${new Date(selectedEmail.date).toLocaleString()}, ${selectedEmail.from} wrote:
-          </div>
-        `}
-        <blockquote style="margin: 0; padding-left: 1em; border-left: 2px solid #e5e7eb;">
-          ${originalContent}
-        </blockquote>
-      </div>
-    `;
+    try {
+      // Get the decoded content first
+      const decoded = await decodeEmail(selectedEmail.body);
+      
+      // Create a clean structure with clear separation
+      const formattedContent = `
+        <div class="compose-area" contenteditable="true" style="min-height: 100px; padding: 10px; color: #000000;">
+          <br/>
+          ${type === 'forward' ? `
+            <div style="border-top: 1px solid #e5e7eb; padding-top: 20px; margin-top: 20px; color: #6b7280; font-size: 0.875rem;">
+              ---------- Forwarded message ---------<br/>
+              From: ${selectedEmail.from}<br/>
+              Date: ${new Date(selectedEmail.date).toLocaleString()}<br/>
+              Subject: ${selectedEmail.subject}<br/>
+              To: ${selectedEmail.to}<br/>
+              ${selectedEmail.cc ? `Cc: ${selectedEmail.cc}<br/>` : ''}
+              <br/>
+              ${decoded.html || decoded.text || ''}
+            </div>
+          ` : `
+            <div style="border-top: 1px solid #e5e7eb; padding-top: 20px; margin-top: 20px; color: #6b7280; font-size: 0.875rem;">
+              On ${new Date(selectedEmail.date).toLocaleString()}, ${selectedEmail.from} wrote:
+            </div>
+            <blockquote style="margin: 0; padding-left: 1em; border-left: 2px solid #e5e7eb; color: #6b7280;">
+              ${decoded.html || decoded.text || ''}
+            </blockquote>
+          `}
+        </div>
+      `;
 
-    // Update the compose form
-    setComposeTo(getReplyTo());
-    setComposeCc(getReplyCc());
-    setComposeSubject(getReplySubject());
-    setComposeBody(formattedContent);
-    setComposeBcc('');
+      // Update the compose form
+      setComposeTo(getReplyTo());
+      setComposeCc(getReplyCc());
+      setComposeSubject(getReplySubject());
+      setComposeBody(formattedContent);
+      setComposeBcc('');
 
-    // Show the compose form and CC field for Reply All
-    setShowCompose(true);
-    setShowCc(type === 'reply-all');
-    setShowBcc(false);
-    setAttachments([]);
+      // Show the compose form and CC field for Reply All
+      setShowCompose(true);
+      setShowCc(type === 'reply-all');
+      setShowBcc(false);
+      setAttachments([]);
+    } catch (error) {
+      console.error('Error preparing reply:', error);
+    }
   };
 
   // Add back the toggleStarred function