diff --git a/src/routes/hunter/HuntLobby.svelte b/src/routes/hunter/HuntLobby.svelte
index 00d07bf..8822828 100644
--- a/src/routes/hunter/HuntLobby.svelte
+++ b/src/routes/hunter/HuntLobby.svelte
@@ -170,7 +170,9 @@
     return 'ONGOING'
   }
 
-  const approved = $derived(Object.values(itemStatuses).filter(s => s.itemFoundStatus === 'APPROVED').length)
+  const approved  = $derived(Object.values(itemStatuses).filter(s => s.itemFoundStatus === 'APPROVED').length)
+  const submitted = $derived(Object.values(itemStatuses).filter(s => s.itemFoundStatus === 'SUBMITTED').length)
+  const rejected  = $derived(Object.values(itemStatuses).filter(s => s.itemFoundStatus === 'REJECTED').length)
 </script>
 
 <div class="pb-20">
@@ -189,8 +191,12 @@
         <p class="text-sm text-base-content/50 mt-0.5">Team: <span class="font-medium text-base-content/70">{myTeam.name}</span></p>
         {#if items.length > 0}
           <div class="flex items-center gap-2 mt-2">
-            <progress class="progress progress-primary flex-1 h-1.5" value={approved} max={items.length}></progress>
-            <span class="text-xs font-medium text-primary">{approved}/{items.length}</span>
+            <div class="flex-1 h-2 rounded-full overflow-hidden bg-base-300 flex">
+              <div class="bg-success h-full transition-all" style="width: {approved  / items.length * 100}%"></div>
+              <div class="bg-warning h-full transition-all" style="width: {submitted / items.length * 100}%"></div>
+              <div class="bg-error   h-full transition-all" style="width: {rejected  / items.length * 100}%"></div>
+            </div>
+            <span class="text-xs font-medium text-base-content/60">{approved}/{items.length}</span>
           </div>
         {/if}
       {/if}