Center funds bar and stack USDT/USDC on two lines.

Co-authored-by: Cursor <cursoragent@cursor.com>

frontend/src/components/FundsBar.tsx

@@ -26,11 +26,31 @@ function fmtU(n: number | null | undefined) {
   return `${n.toFixed(2)}U`;
 }
 
+function fmtUsdc(n: number | null | undefined) {
+  if (n == null || Number.isNaN(n)) return "—";
+  return `${n.toFixed(2)} USDC`;
+}
+
 function pnlClass(n: number | null | undefined) {
   if (n == null || Number.isNaN(n) || n === 0) return "";
   return n > 0 ? "pos-pnl-profit" : "pos-pnl-loss";
 }
 
+function DualCcy({
+  usdt,
+  usdc,
+}: {
+  usdt: number | null | undefined;
+  usdc: number | null | undefined;
+}) {
+  return (
+    <div className="funds-dual">
+      <div className="funds-value mono">{fmtU(usdt)}</div>
+      <div className="funds-value funds-value--sub mono">{fmtUsdc(usdc)}</div>
+    </div>
+  );
+}
+
 export default function FundsBar() {
   const [s, setS] = useState<FundsSummary | null>(null);
 
@@ -80,26 +100,24 @@ export default function FundsBar() {
                 : "—"}
             </div>
           </div>
-          <div className="funds-item funds-item--money">
+          <div className="funds-item">
             <div className="funds-label">总资金</div>
             <div className="funds-value mono">{fmtU(s.total_funds)}</div>
           </div>
-          <div className="funds-item funds-item--money">
+          <div className="funds-item funds-item--dual">
             <div className="funds-label">资金账户</div>
-            <div className="funds-value mono">
-              {s.funding_label || fmtU(s.funding_usdt)}
-            </div>
+            <DualCcy usdt={s.funding_usdt} usdc={s.funding_usdc} />
           </div>
-          <div className="funds-item funds-item--money">
+          <div className="funds-item funds-item--dual">
             <div className="funds-label">交易账户</div>
-            <div className="funds-value mono">
-              {s.trading_label || fmtU(s.trading_usdt)}
-            </div>
+            <DualCcy usdt={s.trading_usdt} usdc={s.trading_usdc} />
           </div>
-          <div className="funds-item funds-item--pnl funds-item--money">
+          <div className="funds-item funds-item--pnl">
             <div className="funds-label">实时盈亏</div>
             <div className={`funds-value mono ${pnlClass(s.realtime_pnl)}`}>
-              {s.realtime_pnl == null ? "—" : fmtU(s.realtime_pnl)}
+              {s.realtime_pnl == null
+                ? "—"
+                : `${s.realtime_pnl > 0 ? "+" : ""}${fmtU(s.realtime_pnl)}`}
             </div>
           </div>
         </div>

frontend/src/styles/app.css

@@ -191,55 +191,67 @@ input {
   display: flex;
   flex-wrap: nowrap;
   gap: 0;
-  padding: 2px 0 4px;
+  padding: 4px 0 2px;
   overflow-x: auto;
   -webkit-overflow-scrolling: touch;
   scrollbar-width: thin;
+  align-items: stretch;
+  min-height: 56px;
 }
 
 .funds-item {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
   flex: 1 1 0;
   min-width: 72px;
-  padding: 4px 10px;
+  padding: 4px 8px;
   border-right: 1px solid var(--line);
+  text-align: center;
 }
 
 .funds-item:first-child {
-  padding-left: 0;
+  padding-left: 4px;
 }
 
 .funds-item:last-child {
   border-right: none;
-  padding-right: 0;
+  padding-right: 4px;
 }
 
 .funds-item--primary .funds-value {
   color: var(--accent);
+  font-size: 1.02rem;
+  font-weight: 700;
 }
 
 .funds-label {
-  font-size: 11px;
+  font-size: 0.72rem;
   color: var(--muted);
   line-height: 1.2;
-  margin-bottom: 2px;
+  margin-bottom: 6px;
   white-space: nowrap;
 }
 
 .funds-value {
-  font-size: 13px;
+  font-size: 0.95rem;
   font-weight: 600;
-  line-height: 1.25;
+  line-height: 1.3;
   white-space: nowrap;
+  color: var(--text);
 }
 
-.funds-item--money .funds-value {
-  font-size: 16px;
-  font-weight: 700;
-  letter-spacing: 0.01em;
+.funds-dual {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 2px;
 }
 
-.funds-item--money .funds-label {
-  font-size: 12px;
+.funds-value--sub {
+  font-size: 0.95rem;
+  font-weight: 600;
 }
 
 .funds-item--pnl .funds-value {