diff --git a/src/client/src/routes/+page.svelte b/src/client/src/routes/+page.svelte
index a2e5482..c264daf 100644
--- a/src/client/src/routes/+page.svelte
+++ b/src/client/src/routes/+page.svelte
@@ -127,57 +127,50 @@
 
     <!-- Store picker by category -->
     {#if storesByCategory().length > 0}
-      <div class="mt-6 space-y-3">
+      <div class="mt-6 space-y-4">
         {#each storesByCategory() as group}
           <div>
             <!-- Category header -->
             <button
               onclick={() => toggleCategory(group.category.id)}
-              class="flex items-center gap-2 mb-1.5 group/cat"
+              class="flex items-center gap-2.5 mb-1 w-full text-left hover:bg-surface-hover/50 -mx-2 px-2 py-1 rounded transition-colors"
             >
-              <span class="w-3 h-3 rounded-sm border flex items-center justify-center flex-shrink-0 transition-colors
+              <span class="w-3.5 h-3.5 rounded border flex items-center justify-center flex-shrink-0 transition-colors
                 {isCategorySelected(group.category.id)
-                  ? 'border-accent/50 bg-accent/20'
+                  ? 'border-accent bg-accent'
                   : isCategoryPartial(group.category.id)
-                    ? 'border-accent/30 bg-accent/10'
-                    : 'border-text-tertiary/30'}">
+                    ? 'border-accent bg-accent/50'
+                    : 'border-text-tertiary/40'}">
                 {#if isCategorySelected(group.category.id)}
-                  <svg class="w-2 h-2 text-accent-text" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="3">
+                  <svg class="w-2.5 h-2.5 text-white" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="3">
                     <path stroke-linecap="round" stroke-linejoin="round" d="M4.5 12.75l6 6 9-13.5" />
                   </svg>
                 {:else if isCategoryPartial(group.category.id)}
-                  <span class="w-1.5 h-0.5 bg-accent-text rounded-full"></span>
+                  <span class="w-2 h-0.5 bg-white rounded-full"></span>
                 {/if}
               </span>
-              <span class="text-2xs font-medium uppercase tracking-wider transition-colors
-                {isCategorySelected(group.category.id) ? 'text-text-secondary' : 'text-text-tertiary'}
-                group-hover/cat:text-text-primary"
-                style="color: {isCategorySelected(group.category.id) ? group.category.color : ''}">
-                {group.category.name}
-              </span>
+              <span class="text-xs font-medium text-text-primary">{group.category.name}</span>
+              <span class="text-2xs text-text-tertiary">({group.stores.length})</span>
             </button>
 
-            <!-- Store chips -->
-            <div class="flex flex-wrap gap-1.5 pl-5">
+            <!-- Store list -->
+            <div class="pl-6 space-y-0.5">
               {#each group.stores as store}
                 <button
                   onclick={() => toggleStore(store.id)}
-                  class="flex items-center gap-1.5 text-2xs px-2 py-1 rounded border transition-colors duration-100
-                    {selectedStoreIds.has(store.id)
-                      ? 'bg-accent-muted border-accent/30 text-accent-text hover:bg-accent/20'
-                      : 'bg-surface border-surface-border text-text-tertiary line-through opacity-50 hover:opacity-75'}"
+                  class="flex items-center gap-2.5 w-full text-left -mx-2 px-2 py-1 rounded transition-colors hover:bg-surface-hover/50"
                 >
-                  <span class="w-3 h-3 rounded-sm border flex items-center justify-center flex-shrink-0
+                  <span class="w-3.5 h-3.5 rounded border flex items-center justify-center flex-shrink-0 transition-colors
                     {selectedStoreIds.has(store.id)
-                      ? 'border-accent/50 bg-accent/20'
-                      : 'border-text-tertiary/30'}">
+                      ? 'border-accent bg-accent'
+                      : 'border-text-tertiary/40'}">
                     {#if selectedStoreIds.has(store.id)}
-                      <svg class="w-2 h-2 text-accent-text" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="3">
+                      <svg class="w-2.5 h-2.5 text-white" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="3">
                         <path stroke-linecap="round" stroke-linejoin="round" d="M4.5 12.75l6 6 9-13.5" />
                       </svg>
                     {/if}
                   </span>
-                  {store.name}
+                  <span class="text-xs transition-colors {selectedStoreIds.has(store.id) ? 'text-text-primary' : 'text-text-tertiary'}">{store.name}</span>
                 </button>
               {/each}
             </div>