feat: apply #28B smart breakeven + #31B H1 EMA20 filter, add backtests #26-#32

Live trading optimizations (cumulative: $2,807 net, 81.8% WR, Sharpe 3.97):
- #28B: Smart breakeven locks profit at entry + 0.5x ATR instead of fixed $2
- #31B: H1 Price vs EMA20 filter — BUY only when H1 bullish, SELL only when bearish

Backtests #26-#32 (7 scripts testing sell improvement, regime-aware entry,
confluence scoring, dynamic RR, multi-TF H1, and ML exit optimizer).
Winners: #28B (+$229), #31B (+$343). Failed: #26, #27, #29, #30, #32.

Also includes: web dashboard redesign, Docker setup, startup scripts.

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

web-dashboard/src/components/dashboard/regime-card.tsx

@@ -1,44 +1,74 @@
 "use client";
 
 import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
-import { Activity } from "lucide-react";
+import { Badge } from "@/components/ui/badge";
+import { Activity, Clock } from "lucide-react";
+import { cn, getConfidenceColor } from "@/lib/utils";
 
 interface RegimeCardProps {
   name: string;
   volatility: number;
   confidence: number;
+  updatedAt?: string;
+  h1Bias?: string;
 }
 
-export function RegimeCard({ name, volatility, confidence }: RegimeCardProps) {
-  const getRegimeColor = (regime: string) => {
-    if (regime.toLowerCase().includes('high')) return 'text-red-500';
-    if (regime.toLowerCase().includes('low')) return 'text-green-500';
-    return 'text-amber-500';
+export function RegimeCard({ name, volatility, confidence, updatedAt, h1Bias }: RegimeCardProps) {
+  const getRegimeBadgeVariant = (regime: string) => {
+    const lower = regime.toLowerCase();
+    if (lower.includes("high") || lower.includes("volatile") || lower.includes("crisis")) return "danger";
+    if (lower.includes("low") || lower.includes("ranging")) return "success";
+    if (lower.includes("trend")) return "info";
+    return "warning";
   };
 
+  const confidencePercent = confidence * 100;
+
   return (
-    <Card className="bg-card/50 backdrop-blur">
-      <CardHeader className="pb-2">
-        <CardTitle className="text-sm font-medium text-muted-foreground flex items-center gap-2">
-          <Activity className="h-4 w-4" />
-          MARKET REGIME
+    <Card className="glass">
+      <CardHeader>
+        <CardTitle className="text-[11px] font-medium text-muted-foreground flex items-center gap-1.5 uppercase tracking-wider">
+          <Activity className="h-3.5 w-3.5" />
+          Market Regime
+          {updatedAt && (
+            <span className="ml-auto flex items-center gap-1 text-[10px] text-muted-foreground/60 font-number normal-case tracking-normal">
+              <Clock className="h-2.5 w-2.5" />
+              {updatedAt}
+            </span>
+          )}
         </CardTitle>
       </CardHeader>
-      <CardContent className="space-y-3">
-        <div className="text-center">
-          <span className={`text-lg font-bold ${getRegimeColor(name)}`}>
-            {name || '---'}
-          </span>
-        </div>
+      <CardContent className="space-y-2">
+        <Badge variant={getRegimeBadgeVariant(name) as any} className="text-xs font-bold">
+          {name || "Unknown"}
+        </Badge>
 
         <div className="flex justify-between items-center">
-          <span className="text-sm text-muted-foreground">Volatility</span>
-          <span className="font-semibold">{volatility.toFixed(2)}</span>
+          <span className="text-[11px] text-muted-foreground">Volatility</span>
+          <span className="text-sm font-semibold font-number">{volatility.toFixed(2)}</span>
         </div>
         <div className="flex justify-between items-center">
-          <span className="text-sm text-muted-foreground">Confidence</span>
-          <span className="font-semibold">{(confidence * 100).toFixed(0)}%</span>
+          <span className="text-[11px] text-muted-foreground">Confidence</span>
+          <span className={cn(
+            "text-sm font-semibold font-number",
+            getConfidenceColor(confidencePercent)
+          )}>
+            {confidencePercent.toFixed(0)}%
+          </span>
         </div>
+        {h1Bias && (
+          <div className="flex justify-between items-center pt-1 border-t border-border">
+            <span className="text-[11px] text-muted-foreground">H1 Bias</span>
+            <span className={cn(
+              "text-xs font-bold",
+              h1Bias === "BULLISH" ? "text-success" :
+              h1Bias === "BEARISH" ? "text-danger" :
+              "text-muted-foreground"
+            )}>
+              {h1Bias === "BULLISH" ? "↑ " : h1Bias === "BEARISH" ? "↓ " : ""}{h1Bias}
+            </span>
+          </div>
+        )}
       </CardContent>
     </Card>
   );