Redesign avatars as a gods/legends pantheon (custom SVG medallions)

Replaced the childish animal emoji avatars with custom inline-SVG "deity
medallions" (gradient disc + gold ring + heraldic emblem) — Athena, Zeus,
Poseidon, Horus, Odin, Thor, Cyrus, Simorgh, Ishtar, Nike, etc. IDs unchanged
so owned avatars keep working; Avatar renders the art (emoji fallback for legacy
ids). Shop now shows the art + the god name (was generic "Avatar").

Files: components/online/avatarArt.tsx (new art + pantheon map), Avatar.tsx
(render art), ShopScreen Preview (avatar → <Avatar/>), mock-service avatar shop
names from AVATAR_ART.

Verified: tsc + next build clean; web rebuilt on :1500.

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

src/components/screens/ShopScreen.tsx

@@ -5,6 +5,7 @@ import { Check, Coins, Lock, Sparkles, X } from "lucide-react";
 import { useEffect, useState } from "react";
 import { ScreenHeader, ScreenShell } from "@/components/online/ScreenHeader";
 import { Sticker } from "@/components/online/Sticker";
+import { Avatar } from "@/components/online/Avatar";
 import { CoinsPill } from "@/components/online/CoinsPill";
 import { useSessionStore } from "@/lib/session-store";
 import { useI18n } from "@/lib/i18n";
@@ -63,7 +64,9 @@ function Preview({ item, size }: { item: ShopItem; size: number }) {
           🏷️
         </span>
       );
-    default: // avatar, reactionpack, xp → emoji glyph
+    case "avatar":
+      return <Avatar id={item.id} size={size} />;
+    default: // reactionpack, xp → emoji glyph
       return <span style={{ fontSize: size * 0.82, lineHeight: 1 }}>{item.kind === "xp" ? "⚡" : item.preview}</span>;
   }
 }