Celebration animations for purchases, XP gains & achievement unlocks

- New global celebration system: celebration-store (queue) + CelebrationOverlay
  (animated: count-up XP, filling bar, level-up pop, achievement cards; plays
  levelUp/award sounds; tap or auto-dismiss). Rendered in page.tsx.
- Shop: every purchase now celebrates — XP packs animate XP gain + level-up,
  cosmetics show a "purchased!" pop. Newly-unlocked achievements (diffed from
  the profile before/after) animate too.
- XP purchases now actually evaluate achievements: gamification.evaluateAchievements
  (client) + Gamification.EvaluateAchievements (server, called in ShopBuy xp path)
  unlock level milestones + grant their coins.

Verified live: buying XP took L1→L5, unlocked level_5 server-side and credited its
reward. tsc + dotnet + next build clean; images rebuilt :1500/:1505.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

src/lib/online/mock-service.ts

@@ -11,6 +11,7 @@ import {
   addXp,
   applyMatchResult,
   dailyRewardFor,
+  evaluateAchievements,
   faNum,
   xpNeededForLevel,
 } from "./gamification";
@@ -898,7 +899,10 @@ export class MockOnlineService implements OnlineService {
         return { ok: false, messageFa: "سکه کافی نیست", messageEn: "Not enough coins" };
       const pack = XP_PACKS.find((x) => x.id === id)!;
       const lvl = addXp(p.level, p.xp, pack.xp);
-      this.profile = { ...p, coins: p.coins - item.price, level: lvl.level, xp: lvl.xp };
+      const leveled = { ...p, coins: p.coins - item.price, level: lvl.level, xp: lvl.xp };
+      // unlock any level milestones the new level reaches
+      const { profile: evaluated } = evaluateAchievements(leveled);
+      this.profile = evaluated;
       this.saveProfile();
       return { ok: true, profile: this.profile, messageFa: "امتیاز اضافه شد", messageEn: "XP added" };
     }