Limit dashboard spending to top 10 categories and fix nav double-highlight

Show top 10 categories in spending breakdown with label indicating the limit.
Fix account-scoped transactions highlighting both Accounts and Transactions
nav items by excluding sub-route match when account-transactions is active.

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

frontend/src/components/layout/AppLayout.vue

@@ -159,10 +159,10 @@ const navItems = [
 
 function isNavActive(navRoute: string) {
   if (route.path === navRoute) return true
-  // Highlight parent nav for sub-routes (e.g. /loans/:id highlights Loans)
-  if (navRoute !== '/' && route.path.startsWith(navRoute + '/')) return true
   // Highlight "Transactions" when viewing account-scoped transactions
   if (navRoute === '/transactions' && route.name === 'account-transactions') return true
+  // Highlight parent nav for sub-routes, but not when account-transactions takes priority
+  if (navRoute !== '/' && route.name !== 'account-transactions' && route.path.startsWith(navRoute + '/')) return true
   return false
 }
 

frontend/src/views/dashboard/DashboardView.vue

@@ -51,7 +51,7 @@
 
         <v-col cols="12" md="6">
           <v-card>
-            <v-card-title><v-icon class="mr-2">mdi-chart-pie</v-icon>Spending This Month</v-card-title>
+            <v-card-title><v-icon class="mr-2">mdi-chart-pie</v-icon>Spending This Month (Top 10 Categories)</v-card-title>
             <v-card-text>
               <div class="text-h5 mb-2">{{ formatCurrency(dashboard.spendingSummary.thisMonth) }}</div>
               <div class="text-caption" :class="dashboard.spendingSummary.changePercent <= 0 ? 'text-success' : 'text-error'">