Add end-to-end encryption for chat messages (X25519 / NaCl box)

Each device generates its own X25519 key pair on login (tweetnacl); the
private key never leaves localStorage or reaches our server. Messages are
encrypted client-side with the recipient's public key before being sent,
so the backend and anyone intercepting traffic only ever see ciphertext.

- src/lib/e2ee.ts: key generation/registration + encrypt/decrypt (NaCl box)
- Chat thread + matches list: encrypt on send, decrypt on receive/preview,
  with a graceful fallback when a message can't be decrypted on this device
  (e.g. after switching browsers) and full backward compat for legacy
  plaintext messages sent before this change
- Privacy settings page explains the guarantee and its one deliberate
  trade-off: there is no key backup/escrow, so clearing browser data or
  switching devices makes old messages permanently unreadable

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>

src/app/(main)/messages/[id]/page.tsx

@@ -2,7 +2,7 @@
 
 import { useEffect, useRef, useState, useCallback } from "react";
 import { useParams, useRouter } from "next/navigation";
-import { ChevronRight, Send, User } from "lucide-react";
+import { ChevronRight, Send, User, Lock } from "lucide-react";
 import { cn } from "@/lib/utils";
 import { formatApiError } from "@/lib/hooks";
 import { ErrorBanner } from "@/components/ui/ErrorBanner";
@@ -15,8 +15,24 @@ import {
   sendMessage,
   photoUrl,
 } from "@/lib/api";
+import { ensureKeyPair, encryptMessage, decryptMessage } from "@/lib/e2ee";
 
 const POLL_MS = 4000;
+const UNREADABLE = "🔒 این پیام رو نمی‌تونی روی این دستگاه بخونی";
+
+// پیام رمزنگاری‌شده رو برای نمایش رمزگشایی می‌کنه؛ پیام قدیمیِ قبل از E2EE
+// همینجوری برگردونده می‌شه.
+function messageText(
+  m: MessageView,
+  partnerPublicKey: string | undefined,
+  mySecretKey: Uint8Array | null
+): string {
+  if (m.cipher_text && m.nonce) {
+    if (!mySecretKey || !partnerPublicKey) return UNREADABLE;
+    return decryptMessage(m.cipher_text, m.nonce, partnerPublicKey, mySecretKey) ?? UNREADABLE;
+  }
+  return m.text ?? "";
+}
 
 export default function ChatPage() {
   const params = useParams<{ id: string }>();
@@ -28,6 +44,7 @@ export default function ChatPage() {
   const [error, setError] = useState<string | null>(null);
   const [draft, setDraft] = useState("");
   const [sending, setSending] = useState(false);
+  const [mySecretKey, setMySecretKey] = useState<Uint8Array | null>(null);
   const bottomRef = useRef<HTMLDivElement>(null);
   const pollRef = useRef<ReturnType<typeof setInterval> | null>(null);
 
@@ -49,6 +66,9 @@ export default function ChatPage() {
       .catch(() => {});
     // eslint-disable-next-line react-hooks/set-state-in-effect
     refreshMessages();
+    ensureKeyPair()
+      .then((kp) => setMySecretKey(kp.secretKey))
+      .catch(() => {});
 
     pollRef.current = setInterval(refreshMessages, POLL_MS);
     return () => {
@@ -60,13 +80,16 @@ export default function ChatPage() {
     bottomRef.current?.scrollIntoView({ block: "end" });
   }, [messages?.length]);
 
+  const canEncrypt = !!mySecretKey && !!match?.partner_public_key;
+
   async function handleSend() {
     const text = draft.trim();
-    if (!text || sending) return;
+    if (!text || sending || !mySecretKey || !match?.partner_public_key) return;
     setSending(true);
     setDraft("");
     try {
-      const msg = await sendMessage(matchId, text);
+      const { cipherText, nonce } = encryptMessage(text, match.partner_public_key, mySecretKey);
+      const msg = await sendMessage(matchId, cipherText, nonce);
       setMessages((prev) => (prev ? [...prev, msg] : [msg]));
     } catch (err) {
       setError(formatApiError(err));
@@ -118,6 +141,10 @@ export default function ChatPage() {
       </header>
 
       <div className="flex-1 flex flex-col gap-3 px-4 py-4 overflow-y-auto">
+        <p className="flex items-center justify-center gap-1.5 text-[11px] text-(--color-content-tertiary) text-center py-2 px-4 mx-auto">
+          <Lock size={11} />
+          پیام‌ها با رمزنگاری سرتاسری محافظت می‌شن؛ هیچ‌کس جز شما دو نفر، حتی ادمین‌های دلدل، نمی‌تونه بخوندشون.
+        </p>
         {messages.length === 0 ? (
           <p className="text-[13px] text-(--color-content-tertiary) text-center py-8">
             هنوز پیامی نیست؛ اولین نفر باش که سلام می‌ده 👋
@@ -136,7 +163,7 @@ export default function ChatPage() {
                     : "bg-(--color-bg-secondary) text-(--color-content-primary) rounded-2xl rounded-bl-md"
                 )}
               >
-                {m.text}
+                {messageText(m, match?.partner_public_key, mySecretKey)}
               </div>
             </div>
           ))
@@ -146,17 +173,24 @@ export default function ChatPage() {
 
       <ErrorBanner message={error} />
 
+      {!canEncrypt && (
+        <p className="text-[12px] text-(--color-content-tertiary) text-center px-4 pb-1 flex items-center justify-center gap-1.5">
+          <Lock size={12} />
+          طرف مقابل هنوز رمزنگاری سرتاسری رو فعال نکرده؛ تا فعال نشه نمی‌تونی پیام بفرستی.
+        </p>
+      )}
       <div className="flex items-center gap-2 px-4 py-3 border-t border-(--color-border-subtle) pb-[calc(env(safe-area-inset-bottom)+12px)]">
         <input
           value={draft}
           onChange={(e) => setDraft(e.target.value)}
           onKeyDown={(e) => e.key === "Enter" && handleSend()}
           placeholder="پیامت رو بنویس..."
-          className="flex-1 h-11 rounded-(--radius-full) bg-(--color-bg-secondary) px-4 text-[14px] focus:outline-none focus:ring-2 focus:ring-(--color-brand-200)"
+          disabled={!canEncrypt}
+          className="flex-1 h-11 rounded-(--radius-full) bg-(--color-bg-secondary) px-4 text-[14px] focus:outline-none focus:ring-2 focus:ring-(--color-brand-200) disabled:opacity-50"
         />
         <button
           onClick={handleSend}
-          disabled={!draft.trim() || sending}
+          disabled={!draft.trim() || sending || !canEncrypt}
           className="w-11 h-11 rounded-full bg-(--color-brand-500) text-white flex items-center justify-center disabled:opacity-40 shrink-0"
         >
           <Send size={17} />