diff --git a/src/app/(home)/stats/_components/live-matches-tab.tsx b/src/app/(home)/stats/_components/live-matches-tab.tsx
index b684149..37e78f4 100644
--- a/src/app/(home)/stats/_components/live-matches-tab.tsx
+++ b/src/app/(home)/stats/_components/live-matches-tab.tsx
@@ -1,40 +1,11 @@
 'use client'
 
 import { useState } from 'react'
+import { sumBy } from 'remeda'
 import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'
 import type { ActiveMatchQueue } from '@/server/services/botlatro.service'
-import {
-  CASUAL_QUEUE_ID,
-  LEGACY_QUEUE_ID,
-  RANKED_QUEUE_ID,
-  SANDBOX_QUEUE_ID,
-  SMALLWORLD_QUEUE_ID,
-  VANILLA_QUEUE_ID,
-} from '@/shared/constants'
 import { api } from '@/trpc/react'
 
-const QUEUE_ORDER = [
-  Number(RANKED_QUEUE_ID),
-  Number(LEGACY_QUEUE_ID),
-  Number(SMALLWORLD_QUEUE_ID),
-  Number(SANDBOX_QUEUE_ID),
-  Number(CASUAL_QUEUE_ID),
-]
-
-const HIDDEN_QUEUES = new Set([Number(VANILLA_QUEUE_ID)])
-
-function sortAndFilterQueues(queues: ActiveMatchQueue[]): ActiveMatchQueue[] {
-  return queues
-    .filter((q) => !HIDDEN_QUEUES.has(q.queue_id))
-    .sort((a, b) => {
-      const ai = QUEUE_ORDER.indexOf(a.queue_id)
-      const bi = QUEUE_ORDER.indexOf(b.queue_id)
-      const aOrder = ai === -1 ? QUEUE_ORDER.length : ai
-      const bOrder = bi === -1 ? QUEUE_ORDER.length : bi
-      return aOrder - bOrder
-    })
-}
-
 export function LiveMatchesTab() {
   const [liveQueues, setLiveQueues] = useState<ActiveMatchQueue[] | null>(null)
   const { data: initialQueues } = api.playerState.getActiveMatches.useQuery(
@@ -46,20 +17,24 @@ export function LiveMatchesTab() {
     onData: (event) => setLiveQueues(event.data),
   })
 
-  const queues = sortAndFilterQueues(liveQueues ?? initialQueues ?? [])
+  const queues = liveQueues ?? initialQueues ?? []
+  const total = sumBy(queues, (q) => q.active_matches)
 
   return (
     <div className='grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-6'>
+      <QueueCard label='Total' count={total} />
       {queues.map((queue) => (
-        <QueueCard key={queue.queue_id} queue={queue} />
+        <QueueCard
+          key={queue.queue_id}
+          label={queue.queue_name}
+          count={queue.active_matches}
+        />
       ))}
     </div>
   )
 }
 
-function QueueCard({ queue }: { queue: ActiveMatchQueue }) {
-  const count = queue.active_matches
-
+function QueueCard({ label, count }: { label: string; count: number }) {
   return (
     <Card>
       <CardHeader className='pb-2'>
@@ -68,7 +43,7 @@ function QueueCard({ queue }: { queue: ActiveMatchQueue }) {
             <span className='absolute inline-flex h-full w-full animate-ping rounded-full bg-emerald-400 opacity-75' />
             <span className='relative inline-flex h-2 w-2 rounded-full bg-emerald-500' />
           </span>
-          {queue.queue_name}
+          {label}
         </CardTitle>
       </CardHeader>
       <CardContent>