feat: inclui ranking por plataforma na sintese da home

app/pages/(protected)/home/index.vue

@@ -221,7 +221,7 @@
         </aside>
       </section>
 
-      <section class="grid min-w-0 gap-4 xl:grid-cols-3" aria-label="Prévia dos serviços">
+      <section class="grid min-w-0 gap-4 sm:grid-cols-2 xl:grid-cols-4" aria-label="Prévia dos serviços">
         <article v-for="service in servicePreviews" :key="service.title"
           class="grid min-w-0 gap-4 rounded-2xl border border-[#e7e5e4] bg-white p-4 shadow-[0_4px_16px_rgba(0,0,0,0.04)] sm:p-5 md:p-6">
           <div class="flex items-start justify-between gap-3">
@@ -286,6 +286,7 @@ useHead({
 })
 
 const RANKINGS_API_BASE_URL = 'https://api-ranking-jogos-production.up.railway.app/api/v1'
+const COMPARE_API_BASE_URL = 'https://ranking-plataforma.onrender.com'
 const WISHLIST_API_BASE_URL = 'https://gameverse-wishlist-production.up.railway.app'
 const CATALOG_API_BASE_URL = 'https://catalogo-jogos-sd-production.up.railway.app'
 const GIFT_CARD_API_BASE_URL = 'https://giftcardapipedro-production.up.railway.app/api'
@@ -353,6 +354,12 @@ const gamerProfile = reactive({
   data: null
 })
 
+const rankingPlataforma = reactive({
+  isLoading: true,
+  error: '',
+  items: []
+})
+
 const isRedirecting = ref(false)
 
 const userName = computed(
@@ -382,6 +389,9 @@ const totalGiftBalance = computed(() =>
   giftCards.items.reduce((sum, card) => sum + Number(card.balance ?? 0), 0)
 )
 const favoriteNames = computed(() => favorites.items.map((item) => item.game_id).filter(Boolean))
+const rankingPlataformaItems = computed(() =>
+  rankingPlataforma.items.slice(0, 3).map((g) => `${g.name} · ${g.platform} · ${g.score}`)
+)
 const catalogNames = computed(() => catalog.items.map((item) => item.title).filter(Boolean))
 const giftCardCodes = computed(() =>
   giftCards.items.map((item) => `${item.code} · ${formatCurrency(item.balance)}`).filter(Boolean)
@@ -448,6 +458,11 @@ const shortcuts = [
     to: '/ranking-jogos',
     icon: 'mdi:trophy-outline'
   },
+  {
+    label: 'Ranking por plataforma',
+    to: '/ranking-plataforma',
+    icon: 'mdi:layers-outline'
+  },
   {
     label: 'Novo jogo no catálogo',
     to: '/catalogo/criar',
@@ -496,6 +511,18 @@ const servicePreviews = computed(() => [
     empty: 'Nenhum gift card emitido.',
     to: '/gift-card',
     action: 'Gerenciar gift cards'
+  },
+  {
+    badge: 'Plataformas',
+    badgeClass: 'bg-[rgba(196,184,232,0.56)]',
+    title: 'Ranking por plataforma',
+    icon: 'mdi:layers-outline',
+    loading: rankingPlataforma.isLoading,
+    error: rankingPlataforma.error,
+    items: rankingPlataformaItems.value,
+    empty: 'Nenhum dado disponível.',
+    to: '/ranking-plataforma',
+    action: 'Ver ranking completo'
   }
 ])
 
@@ -619,6 +646,24 @@ async function fetchGiftCards() {
   }
 }
 
+async function fetchRankingPlataforma() {
+  rankingPlataforma.isLoading = true
+  rankingPlataforma.error = ''
+
+  try {
+    const data = await $fetch(`${COMPARE_API_BASE_URL}/compare`, {
+      headers: authHeaders()
+    })
+    rankingPlataforma.items = Array.isArray(data?.data) ? data.data : []
+  } catch (error) {
+    if (await tratarErroAuth(error)) return
+    rankingPlataforma.items = []
+    rankingPlataforma.error = error?.data?.message ?? 'Erro ao carregar ranking por plataforma.'
+  } finally {
+    rankingPlataforma.isLoading = false
+  }
+}
+
 async function fetchGamerProfile() {
   gamerProfile.isLoading = true
   gamerProfile.error = ''
@@ -648,7 +693,8 @@ onMounted(() => {
     fetchFavorites(),
     fetchCatalog(),
     fetchGiftCards(),
-    fetchGamerProfile()
+    fetchGamerProfile(),
+    fetchRankingPlataforma()
   ])
 })
 </script>