feat: always show Most Prayed For box with motivational message when empty

src/components/HomePage.tsx

@@ -208,15 +208,22 @@ export default function HomePage({ prayers, todayCount, onStartPraying, onSelect
             </div>
 
             {/* Most Prayed For */}
-            {mostPrayedFor && (
             <div className="bg-pink-900/20 backdrop-blur-xl rounded-xl p-4 border border-pink-500/30">
               <div className="text-pink-300 text-xs font-semibold mb-2">💝 Most Prayed For</div>
+              {mostPrayedFor ? (
+                <>
                   <div className="text-sm font-bold text-pink-200 line-clamp-1">{mostPrayedFor[0]}</div>
                   <div className="text-xs text-pink-400 mt-2">{mostPrayedFor[1]} times</div>
-              </div>
+                </>
+              ) : (
+                <>
+                  <div className="text-sm font-bold text-pink-200">Start praying!</div>
+                  <div className="text-xs text-pink-400 mt-2">Click "Mark Prayed" to build your prayer focus</div>
+                </>
               )}
             </div>
           </div>
+        </div>
 
         {/* CTA Button */}
         <div className="max-w-md mx-auto mb-12">