Align funds to OKX funding/trading only; fold rules; match settings width.

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

frontend/src/components/FundsBar.tsx

@@ -11,8 +11,10 @@ export type FundsSummary = {
   total_funds: number | null;
   funding_usdt: number | null;
   trading_usdt: number | null;
-  options_funding_label: string;
-  options_trading_label: string;
+  funding_usdc?: number | null;
+  trading_usdc?: number | null;
+  funding_label?: string;
+  trading_label?: string;
   realtime_pnl: number | null;
   usdc_usdt_rate?: number;
   perp_inst_id?: string;
@@ -84,19 +86,15 @@ export default function FundsBar() {
           </div>
           <div className="funds-item funds-item--money">
             <div className="funds-label">资金账户</div>
-            <div className="funds-value mono">{fmtU(s.funding_usdt)}</div>
+            <div className="funds-value mono">
+              {s.funding_label || fmtU(s.funding_usdt)}
+            </div>
           </div>
           <div className="funds-item funds-item--money">
             <div className="funds-label">交易账户</div>
-            <div className="funds-value mono">{fmtU(s.trading_usdt)}</div>
-          </div>
-          <div className="funds-item funds-item--money">
-            <div className="funds-label">期权资金账户</div>
-            <div className="funds-value mono">{s.options_funding_label}</div>
-          </div>
-          <div className="funds-item funds-item--money">
-            <div className="funds-label">期权交易账户</div>
-            <div className="funds-value mono">{s.options_trading_label}</div>
+            <div className="funds-value mono">
+              {s.trading_label || fmtU(s.trading_usdt)}
+            </div>
           </div>
           <div className="funds-item funds-item--pnl funds-item--money">
             <div className="funds-label">实时盈亏</div>

frontend/src/pages/Settings.tsx

@@ -115,6 +115,7 @@ export default function SettingsPage() {
   const [xferFrom, setXferFrom] = useState("funding");
   const [xferTo, setXferTo] = useState("trading");
   const [usdcRate, setUsdcRate] = useState<number | null>(null);
+  const [fundsRulesOpen, setFundsRulesOpen] = useState(false);
 
   function loadRuntime() {
     apiFetch<RuntimeSettings>("/api/settings/runtime")
@@ -1061,13 +1062,24 @@ export default function SettingsPage() {
         <div className="card settings-card">
           {fundsErr ? <div className="err">{fundsErr}</div> : null}
           {fundsOk ? <div className="settings-ok">{fundsOk}</div> : null}
+
+          <RulesFold
+            open={fundsRulesOpen}
+            onToggle={() => setFundsRulesOpen((v) => !v)}
+          >
+            <p>
+              币种兑换：对齐 OKX 现货市价 USDC-USDT，在<strong>资金账户</strong>
+              内完成 USDT↔USDC。参考价{" "}
+              {usdcRate != null ? `1 USDC ≈ ${usdcRate.toFixed(4)} USDT` : "—"}。
+            </p>
+            <p>
+              账户划转：仅<strong>资金账户 ↔ 交易账户</strong>
+              （USDT/USDC）。OKX 永续与期权均在交易账户，无单独期权资金/期权交易账户。
+            </p>
+          </RulesFold>
+
           <section className="settings-section">
             <h3>币种兑换（USDT ↔ USDC）</h3>
-            <p className="meta" style={{ marginTop: 0 }}>
-              对齐 OKX 现货市价 USDC-USDT。参考价{" "}
-              {usdcRate != null ? `1 USDC ≈ ${usdcRate.toFixed(4)} USDT` : "—"}
-              。兑换发生在资金账户侧（USDT↔期权资金 USDC）。
-            </p>
             <div className="settings-fields">
               <div className="field">
                 <label htmlFor="convertDir">方向</label>
@@ -1130,11 +1142,7 @@ export default function SettingsPage() {
 
           <section className="settings-section">
             <h3>账户划转</h3>
-            <p className="meta" style={{ marginTop: 0 }}>
-              资金账户 ↔ 交易账户（USDT/USDC）。期权侧可用 options_funding /
-              options_trading。
-            </p>
-            <div className="settings-fields">
+            <div className="settings-xfer-row">
               <div className="field">
                 <label htmlFor="xferCcy">币种</label>
                 <select
@@ -1153,12 +1161,14 @@ export default function SettingsPage() {
                 <select
                   id="xferFrom"
                   value={xferFrom}
-                  onChange={(e) => setXferFrom(e.target.value)}
+                  onChange={(e) => {
+                    const v = e.target.value === "trading" ? "trading" : "funding";
+                    setXferFrom(v);
+                    setXferTo(v === "funding" ? "trading" : "funding");
+                  }}
                 >
                   <option value="funding">资金账户</option>
                   <option value="trading">交易账户</option>
-                  <option value="options_funding">期权资金</option>
-                  <option value="options_trading">期权交易</option>
                 </select>
               </div>
               <div className="field">
@@ -1166,12 +1176,14 @@ export default function SettingsPage() {
                 <select
                   id="xferTo"
                   value={xferTo}
-                  onChange={(e) => setXferTo(e.target.value)}
+                  onChange={(e) => {
+                    const v = e.target.value === "trading" ? "trading" : "funding";
+                    setXferTo(v);
+                    setXferFrom(v === "funding" ? "trading" : "funding");
+                  }}
                 >
                   <option value="funding">资金账户</option>
                   <option value="trading">交易账户</option>
-                  <option value="options_funding">期权资金</option>
-                  <option value="options_trading">期权交易</option>
                 </select>
               </div>
               <div className="field">
@@ -1185,43 +1197,43 @@ export default function SettingsPage() {
                   onChange={(e) => setXferAmt(Number(e.target.value))}
                 />
               </div>
-            </div>
-            <div className="settings-actions">
-              <button
-                className="btn"
-                type="button"
-                disabled={loading}
-                onClick={async () => {
-                  setFundsErr("");
-                  setFundsOk("");
-                  setLoading(true);
-                  try {
-                    await apiFetch("/api/funds/transfer", {
-                      method: "POST",
-                      body: JSON.stringify({
-                        ccy: xferCcy,
-                        amount: xferAmt,
-                        from_account: xferFrom,
-                        to_account: xferTo,
-                      }),
-                    });
-                    setFundsOk("划转成功，顶部资金条将刷新");
-                  } catch (e) {
-                    setFundsErr(e instanceof Error ? e.message : String(e));
-                  } finally {
-                    setLoading(false);
-                  }
-                }}
-              >
-                划转
-              </button>
+              <div className="settings-xfer-action">
+                <button
+                  className="btn"
+                  type="button"
+                  disabled={loading}
+                  onClick={async () => {
+                    setFundsErr("");
+                    setFundsOk("");
+                    setLoading(true);
+                    try {
+                      await apiFetch("/api/funds/transfer", {
+                        method: "POST",
+                        body: JSON.stringify({
+                          ccy: xferCcy,
+                          amount: xferAmt,
+                          from_account: xferFrom,
+                          to_account: xferTo,
+                        }),
+                      });
+                      setFundsOk("划转成功，顶部资金条将刷新");
+                    } catch (e) {
+                      setFundsErr(e instanceof Error ? e.message : String(e));
+                    } finally {
+                      setLoading(false);
+                    }
+                  }}
+                >
+                  划转
+                </button>
+              </div>
             </div>
           </section>
         </div>
       ) : null}
 
       {tab === "account" ? (
-        <div className="card settings-card settings-card-narrow">
+        <div className="card settings-card">
           {err ? <div className="err">{err}</div> : null}
           {ok ? <div className="settings-ok">{ok}</div> : null}
           <form onSubmit={onSaveCreds} className="settings-account-form">

frontend/src/styles/app.css

@@ -1118,18 +1118,19 @@ input {
   border-color: rgba(240, 185, 11, 0.55);
 }
 
-/* Settings: ultrawide + tablet */
+/* Settings: 与顶栏资金卡同宽（由 .app-container 约束） */
 .settings-page {
   width: 100%;
-  max-width: 1200px;
+  max-width: none;
 }
 
 .settings-card {
   width: 100%;
+  max-width: none;
 }
 
 .settings-card-narrow {
-  max-width: 640px;
+  max-width: none;
 }
 
 .settings-lead {
@@ -1280,15 +1281,39 @@ input {
 }
 
 @media (min-width: 1100px) {
-  .settings-page {
-    max-width: 1320px;
-  }
-
   .settings-fields {
     grid-template-columns: repeat(3, minmax(0, 1fr));
   }
 }
 
+.settings-xfer-row {
+  display: grid;
+  grid-template-columns: repeat(4, minmax(0, 1fr)) auto;
+  gap: 12px 14px;
+  align-items: end;
+}
+
+.settings-xfer-row .field {
+  margin-bottom: 0;
+  min-width: 0;
+}
+
+.settings-xfer-action {
+  display: flex;
+  align-items: flex-end;
+  padding-bottom: 1px;
+}
+
+@media (max-width: 900px) {
+  .settings-xfer-row {
+    grid-template-columns: repeat(2, minmax(0, 1fr));
+  }
+
+  .settings-xfer-action {
+    grid-column: 1 / -1;
+  }
+}
+
 @media (max-width: 699px) {
   .settings-fields .field {
     margin-bottom: 14px;