feat: v5 — boxing poster fight cards, 12-char names, diverse mock bots

- Fight Card page: dramatic poster background with cross-hatch, spotlights,
  vignettes, corner brackets, scan lines; 3D VS orb with punch animation;
  selectable undercard with main event always pinned at top
- PosterSprite: high-quality 480px poster frame with 6-pass renderer
  (aura, glow, bevel, specular, particles); PixelGlove component
- 12-char bot name limit across all forms and server validation
- Mock bots: all 100 now have diverse archetypes (25 types), 25% human
  fighters; seedMockBots updates existing bots on restart
- Leaderboard: inline SpritePreview next to each bot name
- Nostr auth: persistent login, nsec copy button
- Wallet: NWC + Lightning Address, ranked fight flow
- Server: payments, ranked queue, customization endpoint

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

frontend/src/components/PosterSprite.vue

@@ -0,0 +1,50 @@
+<script setup lang="ts">
+import { ref, onMounted, watch } from 'vue'
+import { generatePosterFrame } from '../game/sprites/poster'
+import { ANIMATIONS } from '../game/sprites'
+
+const props = defineProps<{
+  seed: string
+  archetype?: string
+  tier?: number
+  size?: number
+  pose?: keyof typeof ANIMATIONS
+  glowColor?: 'cyan' | 'pink' | 'purple' | 'yellow'
+}>()
+
+const imgSrc = ref('')
+
+async function generate() {
+  // Always render at high resolution (480px) for quality, display size is controlled by CSS
+  imgSrc.value = await generatePosterFrame(
+    props.seed,
+    props.tier || 0,
+    props.archetype,
+    props.pose || 'attack',
+    480,
+    undefined,
+    props.glowColor || 'cyan',
+  )
+}
+
+onMounted(() => generate())
+
+watch(() => [props.seed, props.archetype, props.tier, props.pose, props.glowColor], () => generate())
+</script>
+
+<template>
+  <img
+    v-if="imgSrc"
+    :src="imgSrc"
+    alt=""
+    class="poster-sprite-img"
+    :style="{ width: `${size || 400}px`, height: `${size || 400}px` }"
+  />
+</template>
+
+<style scoped>
+.poster-sprite-img {
+  image-rendering: pixelated;
+  display: block;
+}
+</style>