:root {
--bg-page: #0a0b0f; --bg-card: #121318; --bg-elevated: #181920;
--bg-hover: #1c1d24; --border: #26272e; --border-light: #1c1d24;
--text-primary: #f5f5f7; --text-secondary: #a0a0a8; --text-tertiary: #5c5c64;
--green-bg: #238636; --green-text: #3fb950; --green-hover: #2ea043;
--red-bg: #da3633; --red-text: #f85149; --red-hover: #f85149;
--blue: #d4af37; --blue-hover: #e8c878; --yellow: #b8942e;
--accent: #d4af37; --green: #3fb950; --red: #f85149; --cyan: #2dd4bf; --orange: #f0883e; --purple: #a371f7;
--outcome-up: #30a159; --outcome-down: #e23939;
--outcome-up-bg: rgba(48, 161, 89, 0.15); --outcome-down-bg: rgba(226, 57, 57, 0.15);
--radius-sm: 6px; --radius-md: 8px; --radius-lg: 12px;
--shadow: 0 1px 3px rgba(0,0,0,0.4), 0 1px 2px rgba(0,0,0,0.5);
}
/* ===== 🆕 2026-09-17 用户要求：白天底色版本（底色跟随主题变量，自动/手动切换见 themeBtn）===== */
:root[data-theme="light"] {
--bg-page: #f4f6f9; --bg-card: #ffffff; --bg-elevated: #eef1f5;
--bg-hover: #e7ebf1; --border: #d6dce4; --border-light: #e8ecf1;
--text-primary: #12181f; --text-secondary: #3d464f; --text-tertiary: #4f5a66;
--green-bg: #1f8a3b; --green-text: #15803d; --green-hover: #166534;
--red-bg: #c62828; --red-text: #c62828; --red-hover: #a01818;
--blue: #9a7b1a; --blue-hover: #8a6d1f; --yellow: #a16207;
--accent: #9a7b1a; --green: #1f8a3b; --red: #c62828; --cyan: #0d9488; --orange: #b45309; --purple: #7c3aed;
--outcome-up: #1f8a3b; --outcome-down: #cc2222;
--outcome-up-bg: rgba(31,138,59,0.12); --outcome-down-bg: rgba(204,34,34,0.12);
--shadow: 0 1px 3px rgba(16,24,40,0.10), 0 1px 2px rgba(16,24,40,0.06);
}
:root[data-theme="light"] .header,
:root[data-theme="light"] .strategy-bar { background: linear-gradient(135deg,#eef3fa,#e2e9f3) !important; }
:root[data-theme="light"] .header-left h1 { color: var(--blue); }
:root[data-theme="light"] .manual-link:hover { color: #fff; }
:root[data-theme="light"] .modal-overlay { background: rgba(15,23,42,0.45); }
.theme-btn { color: var(--yellow); border-color: var(--yellow); background: transparent; cursor: pointer; font-family: inherit; }
.theme-btn:hover { background: var(--yellow); color: #fff; }
* { margin: 0; padding: 0; box-sizing: border-box; }
/* ===== 🆕 2026-09-17 界面分级：一级管理/子账户 = 钱包+面板，隐藏 SDT/双向/套利 与 手动交易记录/统计 ===== */
html[data-level="1"] .lvl-hide, html[data-level="2"] .lvl-hide { display: none !important; }
html[data-level="1"] [id^="modSdt_"], html[data-level="1"] [id^="modSbt_"], html[data-level="1"] [id^="modArb_"],
html[data-level="2"] [id^="modSdt_"], html[data-level="2"] [id^="modSbt_"], html[data-level="2"] [id^="modArb_"] { display: none !important; }
/* 🆕 2026-09-17 追加：钱包卡片「跟随: 面板」开关 + ⚙️弹窗里的 智能体/四象/反熔 开关 → 一级/子账户一律不显示 */
html[data-level="1"] [id^="modPanel_"], html[data-level="2"] [id^="modPanel_"],
html[data-level="1"] [id^="wm_regime_btn_"], html[data-level="1"] [id^="wm_quad_btn_"], html[data-level="1"] [id^="wm_fuse_btn_"],
html[data-level="2"] [id^="wm_regime_btn_"], html[data-level="2"] [id^="wm_quad_btn_"], html[data-level="2"] [id^="wm_fuse_btn_"] { display: none !important; }
body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; background: var(--bg-page); color: var(--text-primary); min-height: 100vh; font-size: 16px; }
.container { max-width: 1400px; margin: 0 auto; padding: 16px; }
/* ===== Login Modal ===== */
#loginOverlay {
position: fixed; top: 0; left: 0; right: 0; bottom: 0;
background: rgba(0,0,0,0.6); z-index: 9999;
display: flex; align-items: center; justify-content: center;
backdrop-filter: blur(12px);
-webkit-backdrop-filter: blur(12px);
}
.modal-overlay {
position: fixed; top: 0; left: 0; right: 0; bottom: 0;
background: rgba(0,0,0,0.7); z-index: 9999;
display: none; align-items: center; justify-content: center;
}
/* 登录弹窗：底板模糊，输入框始终清晰 */
#loginOverlay .modal-box {
filter: none;
opacity: 1;
transition: none;
transform: none;
}
.modal-overlay.fullscreen {
align-items: stretch; padding: 0;
}
.modal-overlay.fullscreen .modal-box {
width: 100vw !important; max-width: 100vw !important;
height: 100vh; max-height: 100vh !important;
border-radius: 0; border: none;
}
.modal-box {
background: var(--bg-card); border: 1px solid var(--border);
border-radius: var(--radius-lg); padding: 32px;
width: 380px; max-width: 90vw;
box-shadow: 0 8px 32px rgba(0,0,0,0.5);
/* 🔴 批74：内容高于视口时必须能滚（原先只有 max-height 没有 overflow ⇒ 按钮被推到视口外够不到）*/
max-height: 92vh; overflow-y: auto; overscroll-behavior: contain;
}
.modal-box h2 { text-align: center; margin-bottom: 20px; color: var(--blue); font-size: 23px; }
.modal-box .sub { text-align: center; color: var(--text-secondary); font-size: 14px; margin-bottom: 24px; }
.modal-box label { display: block; font-size: 13px; color: var(--text-secondary); margin-bottom: 4px; }
.modal-box input {
width: 100%; padding: 10px 12px; margin-bottom: 14px;
background: var(--bg-elevated); border: 1px solid var(--border);
border-radius: var(--radius-sm); color: var(--text-primary); font-size: 15px;
}
.modal-box input:focus { outline: none; border-color: var(--blue); }
.btn-login {
width: 100%; padding: 12px;
background: linear-gradient(135deg, #e8c878, #c9a24b);
border: none; border-radius: var(--radius-sm);
color: #000; font-size: 16px; font-weight: 700; cursor: pointer;
}
.btn-login:hover { filter: brightness(1.1); }
.login-error { color: var(--red-text); font-size: 14px; text-align: center; margin-top: 8px; display: none; }
/* ===== Buttons ===== */
.btn {
display: inline-flex; align-items: center; justify-content: center; gap: 4px;
padding: 8px 16px; border-radius: var(--radius-sm);
font-size: 14px; font-weight: 600; cursor: pointer; transition: all 0.15s; border: 1px solid transparent;
background: var(--bg-elevated); color: var(--text-primary);
}
.btn:hover { filter: brightness(1.15); }
.btn:disabled { opacity: 0.5; cursor: not-allowed; }
.btn-sm { padding: 4px 10px; font-size: 13px; }
.btn-xs { padding: 2px 8px; font-size: 12px; }
.btn-success { background: var(--green-bg); border-color: var(--green-text); color: #fff; }
.btn-danger { background: var(--red-bg); border-color: var(--red-text); color: #fff; }
.btn-outline { background: transparent; border-color: var(--border); }
.btn-primary { background: var(--blue); color: #000; border-color: var(--blue); }
.btn-ghost { background: transparent; border-color: transparent; color: var(--text-primary); }
.btn-ghost:hover { background: var(--bg-hover); }
.zoom-btn {
background: var(--bg-elevated); border: 1px solid var(--border);
border-radius: 4px; color: var(--text-primary); cursor: pointer;
font-size: 15px; line-height: 1; padding: 2px 8px; font-weight: 700;
}
.zoom-btn:hover { background: var(--bg-hover); border-color: var(--blue); }
.zoom-btn.active { background: rgba(88,166,255,0.18); border-color: var(--blue); color: var(--blue); font-weight: 700; }
/* ===== Header ===== */
.header {
background: linear-gradient(135deg, #0a0b0f, #121318);
padding: 8px 16px; border-radius: var(--radius-lg);
margin-bottom: 12px; border: 1px solid var(--border);
display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 8px;
}
.header-left { display: flex; align-items: center; gap: 12px; }
.header-left h1 { font-size: 21px; color: var(--blue); }
.header-left p { color: var(--text-secondary); font-size: 13px; margin-top: 1px; }
.manual-link {
color: var(--blue); text-decoration: none; font-size: 14px;
padding: 4px 10px; border: 1px solid var(--blue); border-radius: 6px;
transition: all 0.2s; white-space: nowrap;
}
.manual-link:hover { background: var(--blue); color: #000; }
.header-right { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.user-badge {
display: flex; align-items: center; gap: 8px;
background: var(--bg-elevated); padding: 4px 12px;
border-radius: var(--radius-md); border: 1px solid var(--border);
font-size: 13px;
}
.user-badge .level1 { color: var(--yellow); font-weight: 700; }
.user-badge .level2 { color: var(--text-secondary); }
.user-badge .logout { color: var(--text-tertiary); cursor: pointer; font-size: 12px; }
.user-badge .logout:hover { color: var(--red-text); }
/* ===== Multi Strategy Bar ===== */
.strategy-bar {
background: var(--bg-card); border: 1px solid var(--border);
border-radius: var(--radius-md); padding: 10px 16px;
margin-bottom: 12px; display: flex; justify-content: space-between;
align-items: center; flex-wrap: wrap; gap: 8px;
}
.strategy-bar .left { display: flex; align-items: center; gap: 12px; font-size: 17px; font-weight: 600; }
.strategy-bar .right { display: flex; align-items: center; gap: 8px; }
/* ===== Wallet Section ===== */
.wallet-section { margin-bottom: 12px; }
.wallet-grid { display: grid; gap: 12px; }
.wallet-grid.cols-1 { grid-template-columns: 1fr; }
.wallet-grid.cols-2 { grid-template-columns: 1fr 1fr; }
.wallet-grid.cols-3 { grid-template-columns: 1fr 1fr 1fr; }
.wallet-grid.cols-4 { grid-template-columns: 1fr 1fr 1fr 1fr; }
@media (max-width: 900px) {
.wallet-grid.cols-4 { grid-template-columns: 1fr 1fr; }
.wallet-grid.cols-3 { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 600px) {
.wallet-grid.cols-2, .wallet-grid.cols-3, .wallet-grid.cols-4 { grid-template-columns: 1fr; }
}
.wallet-card {
background: var(--bg-card); border: 1px solid var(--border);
border-radius: 12px; padding: 16px 18px;
box-shadow: 0 2px 8px rgba(0,0,0,0.15);
display: flex; flex-direction: column; gap: 10px;
}
.wallet-card .top { display: flex; justify-content: space-between; align-items: center; }
/* 🆕 2026-10-10 模拟钱包（体验金）：只换配色，不打"模拟"字样 —— 青色边框/底色与实盘钱包区分 */
.wallet-card.sim-wallet {
border: 1px solid rgba(57,197,207,0.55);
background: linear-gradient(180deg, rgba(57,197,207,0.10), var(--bg-card) 58%);
box-shadow: 0 2px 10px rgba(57,197,207,0.16);
}
.wallet-card.sim-wallet .name { color: var(--cyan); }
.wallet-card.sim-wallet .pusd { color: var(--cyan); }
.wallet-card .name { font-weight: 700; font-size: 21px; }
.wallet-card .addr { font-size: 13px; color: var(--text-tertiary); font-family: monospace; margin-left: 6px; }
.wallet-card .actions { display: flex; align-items: center; gap: 6px; flex-shrink: 0; }
.wallet-card .bals { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.wallet-card .pusd { font-size: 25px; font-weight: 700; color: var(--green-text); font-family: monospace; }
.wallet-card .pol { font-size: 14px; color: var(--text-tertiary); font-family: monospace; }
.wallet-card .profit-status { font-size: 13px; color: var(--text-secondary); }
.wallet-card .strategy-tags { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; font-size: 14px; }
.wallet-card .tag { font-weight: 600; }
.wallet-card .tag.adx-active { color: var(--green-text); }
.wallet-card .tag.jinjiu-active { color: var(--yellow); }
.wallet-card .strategy-line { color: var(--text-secondary); font-size: 14px; }
.wallet-card .tf-label { font-weight: 600; }
.wallet-card .tf-label.tf-5m { color: var(--blue); }
.wallet-card .tf-label.tf-15m { color: var(--yellow); }
.wallet-card .bottom-row { display: flex; justify-content: space-between; align-items: center; gap: 8px; flex-wrap: wrap; }
/* 清理：safe-key样式不再使用 */
.delete-btn { color: var(--text-tertiary); cursor: pointer; font-size: 13px; }
.delete-btn:hover { color: var(--red-text); }
.owner-badge { font-size: 12px; color: var(--blue); margin-left: 4px; }
/* ===== Strategy Config Bar ===== */
.strategy-config-bar {
background: var(--bg-card); border: 1px solid var(--border);
border-radius: var(--radius-md); padding: 12px 16px;
margin-bottom: 12px; display: flex; gap: 16px; flex-wrap: wrap;
}
.strategy-config-bar .config-card {
background: var(--bg-elevated); border-radius: var(--radius-sm);
padding: 10px 14px; flex: 1; min-width: 200px;
}
.strategy-config-bar .config-card .title { font-size: 14px; font-weight: 600; margin-bottom: 6px; }
.strategy-config-bar .config-card .body { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: 14px; }
.strategy-config-bar input[type="number"] {
width: 60px; background: var(--bg-page); border: 1px solid var(--border);
border-radius: 3px; color: var(--text-primary); padding: 4px 6px; font-size: 14px; text-align: center;
}
.strategy-config-bar input[type="checkbox"] { width: 16px; height: 16px; cursor: pointer; }
.strategy-config-bar label { display: flex; align-items: center; gap: 4px; cursor: pointer; }
/* ===== Collapsible Panel ===== */
.collapsible-header {
background: var(--bg-card); border: 1px solid var(--border);
border-radius: var(--radius-md); padding: 10px 16px;
margin-bottom: 2px; cursor: pointer; user-select: none;
display: flex; justify-content: space-between; align-items: center;
}
.collapsible-header:hover { background: var(--bg-hover); }
.collapsible-header .arrow { transition: transform 0.2s; font-size: 13px; }
.collapsible-header .arrow.open { transform: rotate(180deg); }
.collapsible-body {
background: var(--bg-card); border: 1px solid var(--border);
border-top: none; border-radius: 0 0 var(--radius-md) var(--radius-md);
padding: 12px 16px; display: none;
}
.collapsible-body.open { display: block; }
/* ===== Chart Section ===== */
.chart-section {
background: var(--bg-card); border: 1px solid var(--border);
border-radius: var(--radius-md); padding: 12px; margin-bottom: 12px;
}
.chart-top {
display: flex; justify-content: space-between; align-items: center;
flex-wrap: wrap; gap: 8px; margin-bottom: 8px;
}
.chart-title { font-size: 17px; font-weight: 600; cursor: pointer; }
.chart-title:hover { color: var(--blue); }
.chart-price-area { display: flex; align-items: center; gap: 12px; }
.chart-main-price { font-size: 29px; font-weight: 700; font-family: monospace; color: var(--green-text); }
.chart-sub-info { font-size: 13px; color: var(--text-secondary); display: flex; gap: 12px; align-items: center; }
.chart-countdown { font-size: 15px; font-weight: 700; color: var(--yellow); font-family: monospace; }
canvas#candleChart { width: 100%; background: var(--bg-elevated); border: 1px solid var(--border); border-radius: var(--radius-md); }
/* ===== Tab Navigation ===== */
.tab-nav {
display: flex; gap: 4px; margin-bottom: 12px;
background: var(--bg-card); border: 1px solid var(--border);
border-radius: var(--radius-md); padding: 4px;
}
.tab-btn {
flex: 1; padding: 8px 12px; border: none; border-radius: var(--radius-sm);
background: transparent; color: var(--text-secondary); font-size: 14px;
cursor: pointer; transition: all 0.15s; font-weight: 600;
}
.tab-btn:hover { background: var(--bg-hover); color: var(--text-primary); }
.tab-btn.active { background: var(--bg-elevated); color: var(--blue); border: 1px solid var(--border); }
.tab-panel { display: none; }
.tab-panel.active { display: block; }
/* ===== Manual Trading ===== */
.manual-trading {
background: var(--bg-card); border: 1px solid var(--border);
border-radius: var(--radius-md); padding: 16px; margin-bottom: 12px;
}
.manual-tf-selector { display: flex; gap: 8px; margin-bottom: 10px; }
.manual-tf-btn {
padding: 6px 16px; border-radius: var(--radius-sm); border: 1px solid var(--border);
background: var(--bg-elevated); color: var(--text-secondary); cursor: pointer; font-size: 14px; font-weight: 600;
}
.manual-tf-btn.active { border-color: var(--blue); color: var(--blue); background: rgba(88,166,255,0.1); }
.manual-market-info { font-size: 14px; color: var(--text-secondary); margin-bottom: 10px; }
.manual-btc-price { font-size: 33px; font-weight: 700; font-family: monospace; color: var(--green-text); text-align: center; margin: 6px 0; }
.manual-outcomes { display: flex; gap: 12px; margin: 10px 0; }
.outcome-btn {
flex: 1; padding: 16px; border: 2px solid; border-radius: var(--radius-lg);
cursor: pointer; text-align: center; transition: all 0.15s;
font-weight: 700; font-size: 17px;
}
.outcome-btn.up { background: var(--outcome-up-bg); border-color: var(--outcome-up); color: var(--outcome-up); }
.outcome-btn.up:hover, .outcome-btn.up.selected { background: var(--outcome-up); color: #fff; }
.outcome-btn.down { background: var(--outcome-down-bg); border-color: var(--outcome-down); color: var(--outcome-down); }
.outcome-btn.down:hover, .outcome-btn.down.selected { background: var(--outcome-down); color: #fff; }
.outcome-btn .outcome-price { font-size: 23px; display: block; margin: 4px 0; }
.outcome-btn .outcome-pct { font-size: 14px; opacity: 0.8; }
.manual-amounts { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin: 10px 0; }
.amt-btn {
padding: 6px 14px; border-radius: var(--radius-sm); border: 1px solid var(--border);
background: var(--bg-elevated); color: var(--text-primary); cursor: pointer; font-size: 14px; font-weight: 600;
}
.amt-btn.active { border-color: var(--green-text); color: var(--green-text); background: rgba(63,185,80,0.1); }
.amt-btn .win-est { display: block; font-size: 12px; color: var(--green-text); font-weight: 400; }
.manual-custom-amt {
width: 80px; background: var(--bg-elevated); border: 1px solid var(--border);
border-radius: 3px; color: var(--text-primary); padding: 6px 8px; font-size: 14px; text-align: center;
}
.manual-order-summary { font-size: 14px; color: var(--text-secondary); padding: 8px; background: var(--bg-elevated); border-radius: var(--radius-sm); margin: 8px 0; }
.manual-submit-btn {
width: 100%; padding: 14px; border: none; border-radius: var(--radius-md);
font-size: 19px; font-weight: 700; cursor: pointer; color: #fff;
background: linear-gradient(135deg, var(--outcome-up), var(--outcome-down));
}
.manual-submit-btn:disabled { opacity: 0.5; cursor: not-allowed; }
/* ===== Strategy Config & Win Rate Panel ===== */
.strategy-config-panel { margin-bottom: 12px; }
.strategy-config-panel .summary-text { font-size: 14px; color: var(--text-secondary); }
.date-filter-row {
display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
margin-bottom: 12px; padding: 8px; background: var(--bg-elevated);
border-radius: var(--radius-sm); font-size: 14px;
}
.date-filter-row input[type="date"] {
background: var(--bg-page); border: 1px solid var(--border);
border-radius: 3px; color: var(--text-primary); padding: 3px 6px; font-size: 13px;
}
/* 🆕 2026-09-06 日期/时间框深色适配：微信/安卓内核常忽略 color 属性→值文本黑字看不清底色；
   -webkit-text-fill-color 强制值文本白色（含iOS/WebKit），color-scheme:dark 让日历控件走深色 */
input[type="date"], input[type="time"] {
  color-scheme: dark;
  -webkit-text-fill-color: var(--text-primary);
}
.date-filter-row .df-btn {
padding: 3px 10px; border-radius: 3px; border: 1px solid var(--border);
background: transparent; color: var(--text-secondary); cursor: pointer; font-size: 13px;
}
.date-filter-row .df-btn:hover { background: var(--bg-hover); }
.date-filter-row .df-btn.active { border-color: var(--blue); color: var(--blue); }
.strategy-family-table {
width: 100%; border-collapse: collapse; font-size: 14px; margin-bottom: 16px;
}
.strategy-family-table th, .strategy-family-table td {
padding: 6px 8px; border: 1px solid var(--border-light); text-align: center;
}
.strategy-family-table th { background: var(--bg-hover); font-weight: 600; }
.strategy-family-table .family-title { text-align: left; font-weight: 700; font-size: 15px; color: var(--blue); padding: 8px; background: var(--bg-elevated); }
.strategy-family-table .family-sub { text-align: left; font-size: 12px; color: var(--text-tertiary); padding: 2px 8px; }
.strategy-family-table .direction-toggle { cursor: pointer; padding: 2px 6px; border-radius: 3px; font-size: 13px; }
.strategy-family-table .direction-toggle:hover { background: var(--bg-hover); }
.strategy-family-table .stat-cell { font-size: 12px; }
.strategy-family-table .chart-btn { cursor: pointer; font-size: 15px; }
.strategy-family-table .chart-btn:hover { opacity: 0.7; }
.strategy-family-table input[type="radio"] { cursor: pointer; }
/* ===== Trading Settings ===== */
.settings-info { margin-bottom: 12px; }
.settings-info ol { padding-left: 20px; font-size: 14px; color: var(--text-secondary); line-height: 1.8; }
.settings-info ol li { margin-bottom: 4px; }
/* ===== Profit Sharing Section ===== */
.profit-section { margin-bottom: 12px; }
.profit-section .profit-card {
background: var(--bg-card); border: 1px solid var(--border);
border-radius: var(--radius-md); padding: 12px 16px;
}
/* ===== User Management Panel ===== */
.user-panel { margin-bottom: 12px; }
.user-panel .user-card {
background: var(--bg-card); border: 1px solid var(--border);
border-radius: var(--radius-md); padding: 12px 16px;
}
/* ===== Win Rate Modal ===== */
#wrModal { z-index: 9997; }
#pnlChartModal { z-index: 9999; will-change: transform; }
#pnlChartModal .modal-box { position: relative; z-index: 10000; }
#wrModal .modal-box { width: 600px; max-height: 80vh; overflow-y: auto; }
/* ===== Toast ===== */
.toast {
position: fixed; bottom: 20px; right: 20px; z-index: 99999;
background: var(--bg-elevated); border: 1px solid var(--border);
border-radius: var(--radius-md); padding: 12px 20px;
box-shadow: 0 4px 12px rgba(0,0,0,0.4);
display: none; font-size: 14px; max-width: 350px;
}
/* ===== Utility ===== */
.flex { display: flex; }
.flex-wrap { flex-wrap: wrap; }
.gap-2 { gap: 2px; }
.gap-4 { gap: 4px; }
.gap-8 { gap: 8px; }
.gap-12 { gap: 12px; }
.items-center { align-items: center; }
.justify-between { justify-content: space-between; }
.text-secondary { color: var(--text-secondary); }
.text-tertiary { color: var(--text-tertiary); }
.text-center { text-align: center; }
.mt-4 { margin-top: 4px; }
.mt-8 { margin-top: 8px; }
.mb-4 { margin-bottom: 4px; }
.mb-8 { margin-bottom: 8px; }
.p-8 { padding: 8px; }
.p-12 { padding: 12px; }
/* ===== 🚀 手机端适配 ===== */
@media (max-width: 768px) {
.container { padding: 8px; }
.header { padding: 8px 10px; gap: 6px; }
.header-left img { height: 28px !important; }
.header-right { justify-content: flex-end; gap: 6px; }
.user-badge { font-size: 12px; padding: 3px 8px; }
.wallet-grid.cols-2, .wallet-grid.cols-3, .wallet-grid.cols-4 { grid-template-columns: 1fr; }
.wallet-card { padding: 10px 12px; }
.wallet-card .top { flex-direction: column; align-items: stretch; gap: 6px; }
.wallet-card .top > div:first-child { justify-content: flex-start; }
.wallet-card .actions { flex-direction: column; align-items: flex-start; gap: 2px; }
.wallet-card .actions .btn[data-action] { font-size: 12px !important; padding: 3px 10px !important; }
.wallet-card .actions > div:last-child { margin-top: 0 !important; text-align: left !important; }
.strategy-mode-bar { flex-direction: column; align-items: stretch; gap: 6px; padding: 8px 10px !important; }
.strategy-mode-bar > * { font-size: 13px !important; }
.modal-box { padding: 20px 16px; width: 95vw; max-width: 95vw !important; max-height: 90vh !important; overflow-y: auto; -webkit-overflow-scrolling: touch; overscroll-behavior: contain; }
.modal-box h2 { font-size: 19px; }
.admin-section { padding: 10px; }
.admin-section h3 { font-size: 15px; }
.strategy-table-wrap { overflow-x: auto; margin: 0 -8px; padding: 0 8px; }
.strategy-table { font-size: 13px; min-width: 500px; }
.strategy-table th, .strategy-table td { padding: 4px 6px; }
.strategy-table .s-cell { min-width: 70px; }
.chart-trading-row { flex-direction: column !important; }
.chart-trading-row > div { flex: none !important; width: 100% !important; }
.manual-trading { margin-top: 8px; }
.manual-trading { padding: 10px; }
.manual-trading .mt-header { font-size: 15px; }
.manual-countdown { font-size: 16px !important; }
.manual-countdown span { font-size: 17px !important; }
.mt-outcomes { gap: 6px; }
.mt-outcomes .outcome-btn { padding: 8px 12px; font-size: 14px; }
.date-filter-row { flex-wrap: wrap; gap: 4px; }
.date-filter-row .df-btn { font-size: 12px; padding: 4px 8px; }
.date-filter-row input[type="date"] { font-size: 12px; padding: 4px; max-width: 110px; }
.tabs { overflow-x: auto; white-space: nowrap; -webkit-overflow-scrolling: touch; }
.tabs .tab { font-size: 13px; padding: 6px 10px; white-space: nowrap; }
.stat-summary { flex-wrap: wrap; gap: 4px; }
.stat-summary > * { font-size: 13px; padding: 4px 8px; }
.section-title { font-size: 15px !important; }
.orderbook-wrap { flex-direction: column !important; gap: 4px; }


.footer { padding: 12px 8px; font-size: 12px; }
.admin-panel-section { padding: 10px; }
.admin-panel-section h3 { font-size: 15px; }
.sub-user-row { flex-wrap: wrap; gap: 4px; }
.sub-user-row > * { font-size: 13px; }
.param-group { flex-wrap: wrap; gap: 4px; }
.param-group label { font-size: 12px; }
.param-group input { font-size: 13px; padding: 4px 6px; max-width: 80px; }
.btn { font-size: 13px; padding: 6px 12px; }
.btn-xs { font-size: 11px; padding: 2px 6px; }
.btn-sm { font-size: 12px; padding: 4px 8px; }
.manual-custom-amt { width: 80px !important; font-size: 14px; }
.amt-presets { gap: 3px; }
.amt-presets .btn { font-size: 12px; padding: 4px 8px; min-width: 36px; }
.mt-actions { flex-wrap: wrap; gap: 4px; }
.mt-actions .btn { flex: 1; min-width: 60px; font-size: 13px; padding: 8px 10px; }
.strategy-config-inline { flex-direction: column; align-items: stretch !important; padding: 8px 10px !important; }
.strategy-config-inline > * { width: 100%; justify-content: space-between; }
.btn-middle { display: inline-flex; justify-content: center; align-items: center; }
/* 🆕 2026-08-16: 手机端 智能动态/智能双向 弹窗缩窄 + 内部上下滑动 */
#sdtModal .modal-box, #sbtModal .modal-box { width: 100vw; max-width: 100vw; height: 100vh; max-height: 100vh; border-radius: 0; overflow-y: auto; -webkit-overflow-scrolling: touch; }
#sdtModal .modal-box > div:first-child, #sbtModal .modal-box > div:first-child { flex-wrap: wrap; gap: 4px; }
#sdtModal .modal-box h2, #sbtModal .modal-box h2 { font-size: 13px !important; }
#sdtModal .modal-box > div:first-child > div:last-child, #sbtModal .modal-box > div:first-child > div:last-child { flex-wrap: wrap; }
#sdtSummary, #sbtSummary { grid-template-columns: 1fr 1fr; }
#sdtChartWrap, #sbtChartWrap { height: 110px; flex-shrink: 0; }
#sdtBarChart, #sbtBarChart { max-height: 110px; }
/* 手机端明细区不再被 flex 压缩——整个弹窗上下滚动，明细自然高度 */
#sdtModal .modal-box > div:last-child, #sbtModal .modal-box > div:last-child { flex: none !important; min-height: auto !important; overflow: visible !important; }
}
/* 小屏手机 */
@media (max-width: 480px) {
.container { padding: 4px; }
.header-left h1 { font-size: 16px; }
.header-right .btn-ghost { font-size: 12px; padding: 4px 8px; }
.wallet-card .card-header .name { font-size: 15px !important; }
.wallet-card .balances .bal-val { font-size: 15px !important; }
.modal-box { padding: 16px 12px; }
.modal-box h2 { font-size: 17px; }
.strategy-table { font-size: 12px; min-width: 420px; }
.strategy-table th, .strategy-table td { padding: 3px 4px; }
.manual-trading .mt-header { font-size: 14px; }
.mt-outcomes .outcome-btn { padding: 6px 10px; font-size: 13px; }
/* 🆕 2026-08-16: 小屏手机 智能动态/双向 弹窗内部布局——汇总卡片更紧凑、明细区可上下滑动 */
#sdtSummary, #sbtSummary { grid-template-columns: 1fr 1fr; gap: 4px; }
#sdtSummary > div, #sbtSummary > div { padding: 4px 6px !important; }
#sdtSummary > div > div, #sbtSummary > div > div { font-size: 11px !important; }
#sdtByDir, #sbtByDir, #sdtTradesList, #sbtTradesList { font-size: 11px !important; }
#sdtByDir table, #sbtByDir table, #sdtTradesList table, #sbtTradesList table { font-size: 11px !important; }
#sdtChartWrap, #sbtChartWrap { height: 90px; }
#sdtBarChart, #sbtBarChart { max-height: 90px; }
#sdtModal .modal-box > div:last-child > div > div, #sbtModal .modal-box > div:last-child > div > div { overflow-x: auto; }
}

/* 🆕 2026-09-21 手机窄屏（分账弹窗）：表格缩排 + 横向可滑动提示，避免内容挤出框外 */
.profit-tbl { table-layout: auto; }
.profit-scroll-hint { display: none; font-size: 11px; color: var(--text-tertiary); text-align: right; padding: 0 14px 4px 0; }
@media (max-width: 480px) {
  .profit-tbl { font-size: 11px !important; }
  .profit-tbl th, .profit-tbl td { padding: 4px 4px !important; white-space: nowrap; }
  .profit-scroll-hint { display: block; }
}
@keyframes svcMarquee{0%{transform:translateX(0)}100%{transform:translateX(-100%)}}
/* 🆕 2026-09-27 手机版顶栏优化：手册/桌面/自动/语言 四个按钮在窄屏不再出框（320~390 实测） */
@media (max-width: 480px) {
  .header { padding: 7px 8px; gap: 6px; }
  .header-left { gap: 6px; flex-wrap: wrap; min-width: 0; }
  .header-left .manual-link, .header-left .theme-btn { font-size: 12px; padding: 3px 7px; flex-shrink: 0; }
  .header-right { gap: 4px; }
  .user-badge { padding: 2px 6px; }
}
@media (max-width: 360px) {
  .header-left { gap: 4px; }
  .header-left .manual-link, .header-left .theme-btn { font-size: 11px; padding: 2px 6px; }
}

/* 🆕 2026-09-27 长弹窗统一：限高 86vh + 内容区纵向滑动 + 头部与底部按钮固定
   用法：<div class="modal-box mb-fit"> ... <div class="mb-grow">可滚动内容</div> ... </div> */
.modal-box.mb-fit { max-height: 86vh; display: flex; flex-direction: column; overscroll-behavior: contain; }
.modal-box.mb-fit > * { flex-shrink: 0; }
.modal-box.mb-fit > .mb-grow { flex: 1 1 auto; min-height: 0; overflow-y: auto; -webkit-overflow-scrolling: touch; }
.modal-box.mb-fit > .mb-grow::-webkit-scrollbar { width: 6px; }
.modal-box.mb-fit > .mb-grow::-webkit-scrollbar-thumb { background: rgba(255,255,255,.22); border-radius: 3px; }
.modal-box.mb-fit > .mb-grow::-webkit-scrollbar-track { background: transparent; }

/* 🆕 2026-09-27 交易总控栏（第二模块）：英文/日文等长文案在手机上溢出 → 收紧并允许换行 */
.strategy-bar .sb-group { max-width: 100%; }
.strategy-bar .sb-group > span, .strategy-bar .sb-group > button { white-space: normal; }
@media (max-width: 480px) {
  .strategy-bar { padding: 8px 10px !important; gap: 6px !important; }
  .strategy-bar .sb-group { gap: 8px !important; row-gap: 6px !important; font-size: 13px !important; }
  .strategy-bar .sb-group > span { font-size: 12px !important; }
  .strategy-bar .sb-group > button { font-size: 12px !important; padding: 3px 9px !important; }
  .strategy-bar .sb-group > #multiStrategyStatus { font-size: 13px !important; }
  .strategy-bar .sb-group > #walletCount { font-size: 12px !important; }
}

/* 🔴 2026-10-04 语言胶囊：登录 / 注册 / 修改密码 卡右上角（跟随浏览器语言，可手动切换） */
.modal-box.lang-host { position: relative; }
.lang-pill {
position: absolute; top: 10px; right: 10px; z-index: 2;
font-size: 12.5px; line-height: 1.2; padding: 4px 11px;
background: var(--bg-elevated); color: var(--text-secondary);
border: 1px solid var(--border); border-radius: 14px;
cursor: pointer; font-family: inherit; white-space: nowrap;
}
.lang-pill:hover { border-color: var(--blue); color: var(--blue); }
@media (max-width: 480px) {
  .lang-pill { top: 8px; right: 8px; font-size: 12px; padding: 3px 9px; }
}

/* 🔴 2026-10-06 批7：智能通道 —— 模块弹窗里放开「智能体 / 四象 / 反熔」三个套系勾选（一级/二级默认隐藏） */
html.smart-ch[data-level="1"] [id^="wm_regime_btn_"], html.smart-ch[data-level="1"] [id^="wm_quad_btn_"], html.smart-ch[data-level="1"] [id^="wm_fuse_btn_"],
html.smart-ch[data-level="2"] [id^="wm_regime_btn_"], html.smart-ch[data-level="2"] [id^="wm_quad_btn_"], html.smart-ch[data-level="2"] [id^="wm_fuse_btn_"] { display: inline-block !important; }
/* 🔴 批17（用户点名·手机版）：智能通道数据弹窗顶部筛选行允许换行 —— 原来不换行会被挤成
   竖向细长按钮（合计/今日/近2日 竖排），现在窄屏自动折行、按钮保持同一行高，整齐对齐。
   仅作用于智能通道（html.smart-ch），面板通道完全不受影响。 */
/* 🔴 批23：筛选行折行改成两个通道都生效（窄屏不再被挤成竖排细长按钮、看不清） */
#sdtModal .modal-box > div:nth-child(2),
#sbtModal .modal-box > div:nth-child(2) { flex-wrap: wrap; row-gap: 6px; }
#sdtModal .modal-box > div:nth-child(2) > button,
#sbtModal .modal-box > div:nth-child(2) > button { flex: 0 0 auto; white-space: nowrap; }
html.smart-ch #sdtModal .modal-box > div:nth-child(2) > input[type="date"],
html.smart-ch #sbtModal .modal-box > div:nth-child(2) > input[type="date"] { flex: 0 1 130px; min-width: 108px; }
/* 🔴 批18（用户点名·手机版）：方向明细 + 交易明细 不再跟柱状图挤在一块、也不让弹窗无限拉长 ——
   给「明细区」一个带下滑条的框（框内滚动），框更长、视野更好。仅手机窄屏 + 仅智能通道生效。 */
@media (max-width: 600px) {
  html.smart-ch #sdtModal .modal-box > div:last-child,
  html.smart-ch #sbtModal .modal-box > div:last-child {
    max-height: 42vh; overflow-y: scroll; scrollbar-gutter: stable;
    border: 1px solid var(--border); border-radius: 6px;
    padding: 6px 8px; background: var(--bg-elevated); margin-bottom: 4px;
  }
  html.smart-ch #sdtModal .modal-box > div:last-child::-webkit-scrollbar,
  html.smart-ch #sbtModal .modal-box > div:last-child::-webkit-scrollbar { width: 6px; }
  html.smart-ch #sdtModal .modal-box > div:last-child::-webkit-scrollbar-thumb,
  html.smart-ch #sbtModal .modal-box > div:last-child::-webkit-scrollbar-thumb { background: var(--border); border-radius: 3px; }
  /* 柱状图框固定高度，不再被明细区挤占（有空数据时也是一条整齐的框） */
  html.smart-ch #sdtChartWrap, html.smart-ch #sbtChartWrap { min-height: 108px; }
}
/* 🔴 批24（用户点名）：①日期窗口输入框缩小并与上一行筛选按钮并排；
   ②方向明细/交易明细优先给高度（最需要查询的就是这两块），内部自己滚动。两个通道统一。 */
#sdtModal .modal-box > div:nth-child(2) input[type="date"],
#sbtModal .modal-box > div:nth-child(2) input[type="date"] {
  flex: 0 0 118px !important; width: 118px !important; min-width: 0 !important; max-width: 118px !important;
  height: 24px !important; padding: 0 4px !important; font-size: 12px !important;
  box-sizing: border-box; line-height: 22px;
}
#sdtModal .modal-box > div:nth-child(2) > span,
#sbtModal .modal-box > div:nth-child(2) > span { flex: 0 0 auto; }
#sdtModal .modal-box > div:nth-child(2),
#sbtModal .modal-box > div:nth-child(2) { align-items: center; }
/* 明细区：给足高度（而不是被上面挤到最小），超出在自己的框里滚动 */
#sdtModal .modal-box > div:last-child, #sbtModal .modal-box > div:last-child {
  flex: 1 1 auto !important; min-height: 46vh !important; overflow-y: auto !important;
}
@media (max-width: 768px) {
  #sdtModal .modal-box > div:last-child, #sbtModal .modal-box > div:last-child {
    flex: 0 0 auto !important; min-height: 50vh !important; max-height: none !important; overflow-y: auto !important;
  }
}
/* 🔴 批27（用户点名）：总账户（面板通道）的「方向明细 + 交易明细」也是固定高度的框 + 自己往下滑（原本没有下滑条）。
   两个通道统一：框高固定，内容多就在框里滑，不再靠整个弹窗滚动。 */
#sdtModal .modal-box > div:last-child, #sbtModal .modal-box > div:last-child {
  border: 1px solid var(--border) !important; border-radius: 6px !important;
  padding: 6px 8px !important; background: var(--bg-elevated) !important;
  scrollbar-gutter: stable; overflow-y: auto !important;
}
#sdtModal .modal-box > div:last-child::-webkit-scrollbar,
#sbtModal .modal-box > div:last-child::-webkit-scrollbar { width: 8px; }
#sdtModal .modal-box > div:last-child::-webkit-scrollbar-thumb,
#sbtModal .modal-box > div:last-child::-webkit-scrollbar-thumb { background: #b8942e; border-radius: 4px; }
#sdtModal .modal-box > div:last-child::-webkit-scrollbar-track,
#sbtModal .modal-box > div:last-child::-webkit-scrollbar-track { background: transparent; }
@media (max-width: 768px) {
  #sdtModal .modal-box > div:last-child, #sbtModal .modal-box > div:last-child {
    flex: 0 0 auto !important; height: 54vh !important; min-height: 54vh !important; max-height: 54vh !important;
    overflow-y: auto !important;
  }
}
/* 🔴 批28（用户点名·总账户）：明细框在电脑宽屏也要"限高 + 下滑条" ——
   之前只在手机上给了固定高度，宽屏靠 flex 撑（弹窗不限高时就没有下滑条，内容被切掉）。 */
#sdtModal .modal-box > div:last-child, #sbtModal .modal-box > div:last-child {
  max-height: 52vh !important; min-height: 30vh !important;
}
/* 🔴 批53（用户点名·微信手机版）登录卡右上角「🌐 简体中文」语言胶囊改小 + 不再压住标题 ——
   原样：position:absolute 钉在右上角，微信里字体放大后胶囊会盖住标题「⚡泽铉交易系统」；
   现在：窄屏下改为「独立一行、右对齐、贴标题上方」，字号 12px→11px、内边距 3px9px→2px8px，
   无论微信字体放大多少都不会再压字。仅窄屏（≤600px）；桌面端保持原样（右上角浮起）。
   注：上一版误改的「界面语言弹窗变小」已撤除（用户圈的是这个胶囊，不是弹窗）。 */
@media (max-width: 600px) {
  .modal-box.lang-host .lang-pill {
    position: static !important;
    display: block;
    width: fit-content;
    margin: 0 0 6px auto;          /* 右对齐、自成一行，标题自动落在它下面 */
    font-size: 11px !important;
    line-height: 1.2 !important;
    padding: 2px 8px !important;
    border-radius: 10px !important;
  }
  .modal-box.lang-host h2 { margin-top: 0 !important; }
}
/* 🔴 批54（用户点名）：登录窗口隐藏「🌐 简体中文」语言胶囊 ——
   系统已按浏览器语言自动切换（i18n.js detectBrowserLang：zh-Hant→繁中 / zh→简中 / ja / ko / en，其它语言兜底英文），
   登录页不再需要手动切换入口，胶囊藏在登录卡上（版面更干净）。
   登录后仍可在顶部工具栏「🔤 语言」里随时切换（走同一个语言弹窗）。
   只隐藏登录卡（#loginOverlay）上的胶囊；注册 / 修改密码卡与顶部按钮一律不动，需要一起隐藏说一声。 */
#loginOverlay .lang-pill { display: none !important; }
/* 🔴 批55（用户点名）：登录卡标题「⚡」改用系统图标（由 logo.jpg 中心裁切，去掉水印、放大主体，小尺寸更清晰），
   副标题「Polymarket 多钱包自动交易平台」字号调小（14px → 12.5px）。
   仅登录卡；标题文字不变（i18n 词条「泽铉交易系统」在 en/ja/ko/繁中 均已存在，去掉 ⚡ 不影响翻译）。 */
.brand-ico {
  display: inline-block;
  width: 1.4em; height: 1.4em; object-fit: cover;
  border-radius: 26%; vertical-align: -0.3em; margin-right: 7px;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, .10);
}
#loginOverlay .sub { font-size: 12.5px; }

/* 🔴 批74b（2026-10-11 用户报「语言切换胶囊点击没反应」）：
   根因 = #langModal 用默认 z-index 9999，而注册弹窗 10003 / 改密 10004 / 协议 10002 / 通道 10003
   ⇒ 语言弹窗被压在下面，看起来“点了没反应”（实际已打开）。
   修法 = 语言弹窗置于所有弹窗之上（最高业务弹窗 10004，toast/横幅 99999 仍在其上）。 */
#langModal { z-index: 10010; }
#langModal .modal-box { position: relative; z-index: 10011; }

/* 🆕 2026-10-15 升级1：登录密码框「👁️ 显示/隐藏」按钮（只作用于登录卡，注册/改密卡不动） */
.pwd-wrap { position: relative; }
.pwd-wrap input { padding-right: 42px !important; margin-bottom: 0 !important; box-sizing: border-box; }
.pwd-eye {
  position: absolute; right: 6px; top: 50%; transform: translateY(-50%);
  background: none; border: none; cursor: pointer;
  font-size: 17px; line-height: 1; padding: 4px 6px;
  color: var(--text-secondary); opacity: .85;
}
.pwd-eye:hover { opacity: 1; color: var(--text-primary); }

/* 🆕 2026-10-15 升级2：账号安全 → 查看/代管名下账户 → 「📈 登录状态」列 + 弹窗 */
.ls-cell { flex: 0 0 auto; white-space: nowrap; cursor: pointer; user-select: none; }
.ls-cell:hover { text-decoration: underline; }
.ls-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 5px 0; border-bottom: 1px solid var(--border-light); }
.ls-row:last-child { border-bottom: none; }
.ls-lbl { color: var(--text-secondary); font-size: 12.5px; }
.ls-val { color: var(--text-primary); font-size: 13px; white-space: nowrap; text-align: right; }
.ls-tbl { width: 100%; border-collapse: collapse; font-size: 12px; }
.ls-tbl th { text-align: left; color: var(--text-tertiary); font-weight: 500; padding: 3px 5px; border-bottom: 1px solid var(--border); white-space: nowrap; }
.ls-tbl td { padding: 3px 5px; border-bottom: 1px solid var(--border-light); color: var(--text-secondary); }
.ls-scroll { max-height: 34vh; overflow-y: auto; overscroll-behavior: contain; }
@media (max-width: 600px) {
  .ls-cell { font-size: 10px !important; }
  .ls-tbl { font-size: 11px; }
}
/* 🆕 2026-10-15 体育板块：分支切换 + 体育版面 */
.branch-bar { display:flex; gap:8px; margin-bottom:12px; background:var(--bg-card); border:1px solid var(--border); border-radius:var(--radius-md); padding:6px; }
.branch-btn { flex:1; padding:9px 0; font-size:15px; font-weight:600; border-radius:6px; border:1px solid transparent; background:transparent; color:var(--text-secondary); cursor:pointer; transition:all .15s; }
.branch-btn.active { background:var(--accent); color:#08131a; }
body.sports-mode #app > *:not(#headerSection):not(#branchBar):not(#sportsPanel):not(#toast):not(.modal-overlay) { display:none !important; }
body.sports-mode #sportsPanel { display:block !important; }
.sports-top { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:8px; margin-bottom:12px; }
.sports-title { font-weight:700; font-size:17px; }
.sports-stats-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(110px,1fr)); gap:8px; margin-bottom:10px; }
.sports-stat { background:var(--bg-card); border:1px solid var(--border); border-radius:var(--radius-sm); padding:10px; text-align:center; }
.sports-stat .v { font-size:19px; font-weight:700; }
.sports-stat .k { font-size:12px; color:var(--text-tertiary); margin-top:2px; }
.sports-card { background:var(--bg-card); border:1px solid var(--border); border-radius:var(--radius-md); padding:12px; }
.sports-card-title { font-size:14px; font-weight:600; margin-bottom:8px; }
.sports-table { width:100%; border-collapse:collapse; font-size:13px; }
.sports-table th { text-align:left; color:var(--text-tertiary); font-weight:500; padding:5px 6px; border-bottom:1px solid var(--border); white-space:nowrap; }
.sports-table td { padding:5px 6px; border-bottom:1px solid var(--border-light); color:var(--text-secondary); white-space:nowrap; }
.sports-table tr:last-child td { border-bottom:none; }
/* 🆕 手机版：体育表格/钱包/统计 横向滚动，不溢出屏幕 */
#sportsLegs, #sportsWallets, #sportsStats { overflow-x:auto; -webkit-overflow-scrolling:touch; }

/* hide lang pill on register card (lang follows browser) */
#registerOverlay .lang-pill { display: none !important; }

/* register/changePass modal: frosted-glass backdrop, same as login */
#registerOverlay, #changePassOverlay {
  background: rgba(0,0,0,0.6);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}