Collapse the strategy, backtest and sweep panels

Adds a reusable CollapsiblePanel (chevron header, optional summary shown when
collapsed, state persisted in localStorage) and wraps the Strategy, Backtest
and Parameter sweep panels with it, so any single part of the dashboard can be
focused on quickly. Panels stay mounted (v-show) so their form/results state is
preserved across collapse. Includes component tests.

frontend/src/components/BacktestPanel.vue

@@ -1,7 +1,8 @@
 <script setup>
-import { ref } from 'vue'
+import { computed, ref } from 'vue'
 import * as api from '../api'
 import { fmtMoney, fmtPrice, pnlClass, signed } from '../format'
+import CollapsiblePanel from './CollapsiblePanel.vue'
 import EquityChart from './EquityChart.vue'
 import StrategyForm from './StrategyForm.vue'
 
@@ -15,6 +16,12 @@ const error = ref(null)
 const result = ref(null)
 const limit = ref(500)
 
+const summary = computed(() => {
+  if (!result.value || result.value.error) return ''
+  const m = result.value.metrics
+  return `${result.value.symbol} ${result.value.timeframe} · ${signed(m.total_return_pct)}% · ${m.num_trades} trades`
+})
+
 async function run(payload) {
   running.value = true
   error.value = null
@@ -30,15 +37,9 @@ async function run(payload) {
 </script>
 
 <template>
-  <div class="card space-y-3">
-    <div class="flex items-center justify-between">
-      <h2 class="font-semibold">Backtest</h2>
-      <span v-if="result" class="text-xs text-slate-400">
-        {{ result.symbol }} {{ result.timeframe }} · {{ result.equity_curve.length }} candles
-      </span>
-    </div>
-
-    <StrategyForm
+  <CollapsiblePanel title="Backtest" storage-key="backtest" :summary="summary">
+    <div class="space-y-3">
+      <StrategyForm
       :strategies="strategies"
       :busy="running"
       :symbol="status.symbol"
@@ -136,5 +137,6 @@ async function run(payload) {
         </table>
       </div>
     </template>
-  </div>
+    </div>
+  </CollapsiblePanel>
 </template>