:root { color-scheme: dark; --bg:#071018; --panel:#0c1823; --line:#1c2d3a; --text:#edf7ff; --muted:#7f98aa; --cyan:#1ed7c5; --amber:#f3ba2f; --danger:#ff6378; }
* { box-sizing:border-box; }
body { margin:0; min-width:320px; background:radial-gradient(circle at 80% -10%,#123044 0,transparent 38%),var(--bg); color:var(--text); font-family:Inter,"Microsoft YaHei",system-ui,sans-serif; }
.shell { width:min(1440px,calc(100% - 40px)); margin:auto; padding:42px 0 28px; }
.hero { display:flex; align-items:flex-end; justify-content:space-between; gap:30px; margin-bottom:28px; }
.eyebrow { margin:0 0 8px; color:var(--cyan); font-size:12px; font-weight:800; letter-spacing:.18em; }
h1 { margin:0; font-size:clamp(30px,5vw,58px); line-height:1.05; letter-spacing:-.05em; }
.intro { max-width:720px; margin:15px 0 0; color:var(--muted); line-height:1.7; }
button { border:0; border-radius:10px; padding:12px 20px; background:var(--amber); color:#17120a; font-weight:800; cursor:pointer; box-shadow:0 8px 24px #f3ba2f22; }
button:disabled { opacity:.55; cursor:wait; }
.stats { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:12px; }
.stats article { padding:18px 20px; border:1px solid var(--line); border-radius:14px; background:#0c1823cc; }
.stats span,.toolbar label span { display:block; color:var(--muted); font-size:12px; margin-bottom:8px; }
.stats strong { font-size:24px; font-variant-numeric:tabular-nums; }
.toolbar { display:flex; align-items:flex-end; gap:12px; padding:14px; border:1px solid var(--line); border-radius:14px 14px 0 0; background:var(--panel); }
.toolbar label { min-width:190px; }
.toolbar .search { flex:1; }
input,select { width:100%; border:1px solid #294051; border-radius:9px; padding:11px 12px; background:#07131d; color:var(--text); outline:none; }
input:focus,select:focus { border-color:var(--cyan); }
.status { display:flex; align-items:center; gap:8px; padding:10px 2px; margin-left:auto; color:var(--muted); font-size:13px; white-space:nowrap; }
.status i { width:8px; height:8px; border-radius:50%; background:var(--amber); box-shadow:0 0 12px currentColor; }
.status i.ok { background:var(--cyan); }
.status i.error { background:var(--danger); }
.panel { border:1px solid var(--line); border-top:0; border-radius:0 0 14px 14px; overflow:hidden; background:var(--panel); }
.table-wrap { overflow-y:auto; overflow-x:hidden; max-height:68vh; }
table { width:100%; border-collapse:collapse; table-layout:fixed; font-variant-numeric:tabular-nums; }
/* 均匀四列：合约 / ATR率 / 开仓建议 / 操作；fixed 布局杜绝横向滚动条 */
th:nth-child(1) { width:20%; }
th:nth-child(2) { width:34%; }
th:nth-child(3) { width:22%; }
th:nth-child(4) { width:24%; }
th { position:sticky; top:0; z-index:1; padding:13px 16px; background:#10202c; color:var(--muted); font-size:11px; text-align:right; letter-spacing:.05em; white-space:nowrap; }
th:nth-child(1),td:nth-child(1) { text-align:left; }
th:nth-child(3),td.advice-cell { text-align:center; }
td.advice-cell .badge { white-space:nowrap; }
td { padding:14px 16px; border-top:1px solid var(--line); text-align:right; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
tbody tr:hover { background:#122431; }
.symbol { font-weight:800; }
.ratio { color:var(--cyan); font-weight:800; }
.empty { padding:60px; text-align:center; color:var(--muted); }
footer { padding:18px 4px; color:#577083; font-size:12px; text-align:center; }
@media (max-width:800px) { .shell{width:min(100% - 22px,1440px);padding-top:24px}.hero{align-items:flex-start;flex-direction:column}.stats{grid-template-columns:repeat(2,1fr)}.server-grid{grid-template-columns:repeat(2,1fr)}.toolbar{align-items:stretch;flex-wrap:wrap}.toolbar label{min-width:calc(50% - 6px)}.toolbar .search{flex-basis:100%}.status{width:100%}th,td{padding:12px} }

/* ---- 登录与网格面板 ---- */
.card { margin-top:14px; border:1px solid var(--line); border-radius:14px; background:var(--panel); overflow:hidden; }
.card-head { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:16px 20px; border-bottom:1px solid var(--line); background:#10202c; }
.card-head h2 { margin:0; font-size:16px; letter-spacing:.02em; }
.card-body { padding:18px 20px; }
.badge { padding:5px 12px; border-radius:999px; font-size:12px; font-weight:700; background:#1a3140; color:var(--muted); white-space:nowrap; }
.badge.ok { background:#123c36; color:var(--cyan); }
.badge.warn { background:#3c3412; color:var(--amber); }
.badge.err { background:#3c1a20; color:var(--danger); }
.muted { color:var(--muted); line-height:1.7; margin:0 0 8px; }
.small { font-size:12px; }
.btn-row { display:flex; gap:10px; flex-wrap:wrap; margin-top:12px; }
.btn-danger { background:var(--danger); color:#2b060c; box-shadow:0 8px 24px #ff637822; }
.btn-ghost { background:#16303f; color:var(--text); box-shadow:none; }
.auth-body { display:flex; gap:24px; flex-wrap:wrap; }
.qr-area { flex:0 0 240px; text-align:center; }
.qr-img { width:220px; height:220px; border-radius:12px; background:#fff; padding:10px; image-rendering:pixelated; }
.auth-info { flex:1; min-width:260px; }
.grid-form { display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:12px; align-items:end; }
.grid-form .btn-row { grid-column:1 / -1; margin-top:2px; }
.grid-list { margin-top:14px; max-height:300px; overflow:auto; border:1px solid var(--line); border-radius:10px; padding:12px; font-family:ui-monospace,Consolas,monospace; font-size:12px; white-space:pre-wrap; }
.overlay { position:fixed; inset:0; background:#020a12cc; display:flex; align-items:center; justify-content:center; z-index:50; padding:20px; }
/* hidden 属性会被 .overlay 的 display:flex 覆盖，必须强制还原，否则浮层常显 */
[hidden] { display:none !important; }
.confirm-box { width:min(560px,100%); background:var(--panel); border:1px solid var(--line); border-radius:14px; padding:22px 24px; box-shadow:0 24px 60px #00000088; }
.confirm-box h3 { margin:0 0 10px; }
.confirm-box pre { max-height:260px; overflow:auto; background:#07131d; border:1px solid var(--line); border-radius:10px; padding:12px; font-size:12px; }

/* ---- 服务器状态卡片 ---- */
.server-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; }
.server-item { padding:12px 14px; border:1px solid var(--line); border-radius:10px; background:#0e1e2a; }
.server-item span { display:block; color:var(--muted); font-size:11px; margin-bottom:6px; letter-spacing:.03em; }
.server-item b { font-size:15px; font-weight:800; font-variant-numeric:tabular-nums; }
.server-item small { display:block; margin-top:3px; color:var(--muted); font-size:11px; font-weight:500; }
.server-item .meter { height:4px; margin-top:9px; border-radius:4px; background:#1a3140; overflow:hidden; }
.server-item .meter i { display:block; height:100%; width:0; border-radius:inherit; background:var(--cyan); transition:width .5s ease, background .3s; }
.server-item .meter i.warn { background:var(--amber); }
.server-item .meter i.err { background:var(--danger); }

/* ---- 一键中性网格 ---- */
.btn-mini { padding:6px 12px; font-size:12px; border-radius:8px; box-shadow:none; }
td.action { white-space:normal; }
td.action .badge { margin-right:8px; }
td.action button { width:100%; }
td.action button[disabled] { width:auto; min-width:96px; }
.quick-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:8px 18px; margin:10px 0 14px; padding:12px 14px; border:1px solid var(--line); border-radius:10px; background:#07131d; font-size:13px; }
.quick-grid div { display:flex; justify-content:space-between; gap:10px; }
.quick-grid span { color:var(--muted); }
.quick-grid b { font-variant-numeric:tabular-nums; text-align:right; }
.quick-leverage span { display:block; color:var(--muted); font-size:12px; margin-bottom:8px; }
.quick-error { color:var(--danger); }

/* ---- 现有网格展示 ---- */
.head-tools { display:flex; align-items:center; gap:10px; }
/* 登录卡头部按钮竖排：退出登录在上、生成二维码在下 */
.auth-btns { display:flex; flex-direction:column; align-items:stretch; gap:6px; }
.auth-btns button { margin:0; }
.bot-card { margin-bottom:14px; border:1px solid var(--line); border-radius:12px; background:#0a1622; padding:14px 16px; }
.bot-card:last-child { margin-bottom:0; }
.bot-head { display:flex; justify-content:space-between; align-items:center; gap:12px; flex-wrap:wrap; margin-bottom:10px; }
.bot-title { display:flex; align-items:center; gap:8px; flex-wrap:wrap; font-size:15px; }
.bot-title small { margin-left:5px; color:var(--muted); font-weight:500; }
.bot-profit { color:var(--muted); font-size:13px; }
.bot-profit span, .bot-profit b { font-variant-numeric:tabular-nums; margin-left:4px; }
.pos { color:var(--cyan); }
.neg { color:var(--danger); }
.bot-stats { display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:8px 16px; padding:10px 12px; border:1px solid var(--line); border-radius:10px; background:#07131d; font-size:12.5px; }
.bot-stats div { display:flex; justify-content:space-between; gap:8px; }
.bot-stats span { color:var(--muted); }
.bot-stats b { font-variant-numeric:tabular-nums; text-align:right; }
.fills-head { display:flex; justify-content:space-between; align-items:center; gap:10px; margin:12px 2px 8px; color:var(--muted); font-size:12px; }
.fills-head span { font-variant-numeric:tabular-nums; }
.fills-body { max-height:320px; overflow:auto; border:1px solid var(--line); border-radius:10px; background:#07131d; }
.fills-table { width:100%; font-size:12px; }
.fills-table th { position:static; padding:8px 10px; font-size:11px; }
.fills-table td { padding:8px 10px; }
.fills-table th:nth-child(1), .fills-table td:nth-child(1) { text-align:left; }
.btn-mini[disabled] { opacity: 0.4; cursor: not-allowed; }
.fills-table .badge { padding:2px 8px; font-size:11px; }

/* 自动补格卡：运行中网格简单列表（品种 + 状态，无收益明细） */
.bots-simple { margin-top:10px; display:flex; flex-direction:column; gap:8px; }
.bots-simple .bot-line { display:flex; align-items:center; gap:10px; padding:8px 12px; border:1px solid var(--line); border-radius:10px; background:#07131d; }
.bots-simple .bot-line strong { font-size:14px; letter-spacing:.5px; }
.bots-simple .bot-line .badge { padding:2px 8px; font-size:11px; }

/* 自动补格卡：破网修界记录 */
#rangeFixBlock { margin-top:16px; }
#closeGuardBlock { margin-top:16px; }
.rf-head { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:10px 12px; margin-bottom:8px; border:1px solid var(--line); border-radius:10px; background:#0e1e2a; font-weight:800; font-size:13px; letter-spacing:.03em; }
.rf-head .badge { font-weight:700; }
.rf-head .rf-actions { display:flex; align-items:center; gap:8px; }
.rf-head .btn-mini { font-weight:700; }
.rf-line-alert { color:var(--amber); }
.rf-list { display:flex; flex-direction:column; gap:6px; max-height:260px; overflow-y:auto; }
.rf-list .bot-line { align-items:flex-start; padding:7px 12px; }
.rf-list .rf-text { font-size:12px; color:var(--text); line-height:1.55; white-space:normal; word-break:break-all; font-variant-numeric:tabular-nums; }
.rf-list .badge { flex-shrink:0; margin-top:1px; }

/* 破网修界：运行中网格的区间变更表（品种/时间/新区间/新格数/原区间/原格数） */
.rf-table { width:100%; border-collapse:collapse; table-layout:auto; font-size:12px; font-variant-numeric:tabular-nums; }
.rf-table th, .rf-table td { padding:7px 10px; border-bottom:1px solid var(--line); white-space:nowrap; text-align:right; }
.rf-table th { position:static; background:#10202c; color:var(--muted); font-size:11px; font-weight:700; letter-spacing:.03em; }
.rf-table th:nth-child(1), .rf-table td:nth-child(1) { text-align:left; }
.rf-table th:nth-child(2), .rf-table td:nth-child(2) { text-align:left; }
.rf-table th:nth-child(3), .rf-table td:nth-child(3) { text-align:left; }
.rf-table th:nth-child(5), .rf-table td:nth-child(5) { text-align:left; }
.rf-table tbody tr:last-child td { border-bottom:none; }
.rf-table tbody tr:hover td { background:#0e1e2a; }
.rf-table .rf-symbol { font-weight:700; }