Error Feedback Service + friendly error handling across all pages

- Error Feedback Service: POST /api/feedback saves to JSONL, GET with admin token
- ErrorFeedback component: warm amber tones, friendly messages, 'Report Issue' button
- Replaced ALL red-themed error displays across 15+ pages with ErrorFeedback
- Kind classification: network, auth, location, upgrade, default messages
- QA test suite v2: 8-layer testing (system, API, render, scenario, edge, mobile, perf, security)
- Browser-based visual QA with Playwright (Layer 9)

src/app/profile/page.tsx

@@ -20,6 +20,7 @@ import {
   Gift,
 } from "lucide-react";
 import PremiumBadge from "@/components/PremiumBadge";
+import ErrorFeedback from "@/components/ErrorFeedback";
 
 const VALID_MADHABS = ["Hanafi", "Maliki", "Shafi'i", "Hanbali"];
 
@@ -232,17 +233,14 @@ export default function ProfilePage() {
             Edit Profile
           </h3>
 
-          {saveMessage && (
-            <div
-              className={`mb-4 p-3 rounded-xl text-sm text-center ${
-                saveMessage === "Profile updated successfully"
-                  ? "bg-emerald-900/20 border border-emerald-800/40 text-emerald-400"
-                  : "bg-red-900/20 border border-red-800/40 text-red-400"
-              }`}
-            >
+          {saveMessage === "Profile updated successfully" && (
+            <div className="mb-4 p-3 rounded-xl text-sm text-center bg-emerald-900/20 border border-emerald-800/40 text-emerald-400">
               {saveMessage}
             </div>
           )}
+          {saveMessage && saveMessage !== "Profile updated successfully" && (
+            <ErrorFeedback error={saveMessage} kind="default" onRetry={() => setSaveMessage("")} context="profile" />
+          )}
 
           <form onSubmit={handleSave} className="space-y-4">
             {/* Name */}