Keep view mode across tabs and speed up recommendation pipeline

templates/annual_summary.html

@@ -142,6 +142,48 @@
         line-height: 1.18;
     }
 
+    body[data-view-mode="dual"] .summary-panel {
+        grid-template-columns: minmax(250px, 300px) minmax(0, 1fr);
+        gap: 12px;
+        min-height: calc(100vh - 150px);
+    }
+
+    body[data-view-mode="dual"] .summary-overview {
+        gap: 10px;
+    }
+
+    body[data-view-mode="dual"] .metric-grid {
+        grid-template-columns: 1fr;
+        gap: 8px;
+    }
+
+    body[data-view-mode="dual"] .summary-overview .stat-card {
+        min-height: 64px;
+        padding: 10px 11px;
+    }
+
+    body[data-view-mode="dual"] .summary-overview .stat-card .value {
+        font-size: 18px;
+    }
+
+    body[data-view-mode="dual"] .chart-stack {
+        grid-template-columns: repeat(2, minmax(0, 1fr));
+        gap: 12px;
+        align-items: stretch;
+        min-height: 100%;
+    }
+
+    body[data-view-mode="dual"] .chart-box {
+        padding: 12px 12px 14px;
+        min-height: 100%;
+    }
+
+    body[data-view-mode="dual"] .chart-svg,
+    body[data-view-mode="dual"] .expense-chart-svg {
+        aspect-ratio: 1560 / 620;
+        min-height: 360px;
+    }
+
     @media (max-width: 1000px) {
         .summary-layout,
         .summary-panel,