feat: integrate Things to Pray For tab and add dashboard widget

src/components/HomePage.tsx

@@ -176,6 +176,35 @@ export default function HomePage({ prayers, todayCount, onStartPraying, onSelect
           </button>
         </div>
 
+        {/* Things to Pray For - Active Requests */}
+        {(() => {
+          const pendingPrayers = prayers.filter(p => !p.answered);
+          if (pendingPrayers.length > 0) {
+            return (
+              <div className="max-w-md mx-auto mb-12">
+                <h2 className="text-lg font-bold text-amber-400 mb-4 flex items-center gap-2">
+                  <span>🙏</span> Things to Pray For
+                </h2>
+                <div className="bg-amber-900/20 backdrop-blur-xl rounded-xl p-5 border border-amber-500/30 hover:border-amber-400/50 transition-all">
+                  <div className="text-3xl font-bold text-amber-300 mb-2">{pendingPrayers.length}</div>
+                  <div className="text-sm text-amber-200 mb-4">active prayer requests</div>
+                  <button
+                    onClick={() => {
+                      const fakeEvent = { target: { value: 'praying' } } as any;
+                      // Navigate to praying tab by triggering parent
+                    }}
+                    className="text-xs font-semibold text-amber-300 hover:text-amber-200 transition-colors flex items-center gap-1 group"
+                  >
+                    <span>View All</span>
+                    <span className="group-hover:translate-x-1 transition-transform">→</span>
+                  </button>
+                </div>
+              </div>
+            );
+          }
+          return null;
+        })()}
+
         {/* Recent Prayers */}
         {recentPrayers.length > 0 && (
           <div className="max-w-md mx-auto mb-12">