/* ============================================================
 * 手机版量化交易系统 · 可视化新闻模块  —  深色主题（黑底）
 * ============================================================ */
:root {
  --bg: #000000;            /* 页面 / 手机外壳背景：纯黑 */
  --bg-2: #0a0d12;          /* 弹窗 / 抽屉 / 设置背景 */
  --panel: #12161c;         /* 卡片 / 区块 */
  --panel-2: #161b22;       /* 嵌套面板（metric / macro / social） */
  --panel-3: #1a1f27;       /* 段控 / 标签 / 图标按钮底色 */
  --hover: #232a33;
  --border: #1b212a;
  --border-2: #2a3340;
  --text: #e8eaed;
  --text-2: #aeb6c2;
  --text-3: #707a89;
  --accent: #4d8bff;
  --up: #ff5b5b;            /* 涨 / 正面 红 */
  --down: #2ecc71;          /* 跌 / 负面 绿 */
  --warn: #f5c06a;
}
* { box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
html, body {
  margin: 0; padding: 0; height: 100%; width: 100%;
  font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei", "Segoe UI", sans-serif;
  background: var(--bg); color: var(--text); font-size: 13px; line-height: 1.45;
  -webkit-text-size-adjust: 100%; text-size-adjust: 100%;
  overflow-x: hidden; overscroll-behavior-y: none;
}
#phone {
  position: relative; width: 100%; max-width: 560px; margin: 0 auto;
  height: 100vh; height: 100dvh; height: calc(var(--vh, 1vh) * 100);
  background: var(--bg); display: flex; flex-direction: column; overflow: hidden;
}
button { font-family: inherit; cursor: pointer; border: none; background: none; color: inherit; }
input, select { font-family: inherit; font-size: 13px; color: var(--text); }

/* ---------- 全局滚动条隐藏（消除滑动白条） ---------- */
* { scrollbar-width: none; -ms-overflow-style: none; }
::-webkit-scrollbar { width: 0 !important; height: 0 !important; background: transparent; display: none; }

/* ---------- 应用标题栏 ---------- */
/* 标题栏顶部 padding 由安卓系统状态栏高度决定，自动适配刘海/挖孔屏 */
#app-header {
  min-height: 48px; background: #0c0f15; border-bottom: 1px solid var(--border);
  display: flex; align-items: center; justify-content: space-between;
  padding: env(safe-area-inset-top, 0px) 12px 0; flex: 0 0 auto;
}
#app-header .title { font-size: 17px; font-weight: 700; letter-spacing: .5px; display: flex; align-items: center; gap: 7px; color: var(--text); }
#app-header .title .logo { width: 22px; height: 22px; border-radius: 6px; background: linear-gradient(135deg,#2f6fed,#34c7f0); display: flex; align-items: center; justify-content: center; color: #fff; font-size: 13px; font-weight: 800; }
.hdr-actions { display: flex; gap: 6px; }
.icon-btn {
  width: 34px; height: 34px; border-radius: 9px; background: var(--panel-3); display: flex; align-items: center; justify-content: center; font-size: 15px; transition: .15s;
}
.icon-btn:active { background: var(--hover); transform: scale(.94); }
.icon-btn.rotating { animation: spin .8s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }

/* ---------- 数据状态指示灯 ---------- */
#data-light {
  display: flex; align-items: center; gap: 5px; padding: 3px 9px; border-radius: 20px;
  background: var(--panel-3); font-size: 11px; color: var(--text-2); align-self: center; margin: 4px auto 0; flex: 0 0 auto; width: max-content;
}
#data-light .dot { width: 8px; height: 8px; border-radius: 50%; }
#data-light.synced .dot { background: var(--down); } #data-light.syncing .dot { background: var(--warn); animation: pulse 1s infinite; }
#data-light.error .dot { background: var(--up); }
@keyframes pulse { 50% { opacity: .35; } }

/* ---------- 视图容器 ---------- */
.view {
  flex: 1 1 auto; display: flex; flex-direction: column; min-height: 0; overflow: hidden;
}
.view.active { display: flex; }

/* ---------- 主界面卡片网格 ---------- */
#main-grid, #battle-grid {
  flex: 1 1 auto; display: grid; grid-template-columns: 1fr 1fr; grid-auto-rows: minmax(96px, auto);
  align-content: start; gap: 10px; padding: 12px; padding-bottom: calc(12px + env(safe-area-inset-bottom, 0px));
  min-height: 0; overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

/* ---------- 对抗室卡片网格（与量化·新闻一致的 .card 网格） ---------- */
#battle-grid .span2 { grid-column: 1 / -1; }
.card.no-action { cursor: default; }
.card.no-action:active { transform: none; background: var(--panel); }
.b-overview { min-height: 360px; padding: 16px; overflow: visible; margin-bottom: 0; }
.b-overview .c-head { justify-content: space-between; align-items: center; margin-bottom: 12px; }
.b-overview .c-body { justify-content: flex-start; flex: 0 0 auto; min-height: 0; }
.b-overview .status-pill.auto-evolve { background: rgba(47,111,237,.18); color: #5fb3ff; border: 1px solid rgba(95,179,255,.35); padding: 4px 9px; border-radius: 12px; font-size: 11px; display: inline-flex; align-items: center; gap: 5px; }
.b-overview .status-pill.auto-evolve .pulse-dot { width: 6px; height: 6px; border-radius: 50%; background: #34c759; box-shadow: 0 0 0 0 rgba(52,199,89,.6); animation: pulseDot 1.6s infinite; }
.b-overview-body { display: flex; flex-direction: column; justify-content: flex-start; gap: 14px; }
.b-overview-metrics { display: flex; flex-direction: row; flex-wrap: wrap; gap: 16px 22px; align-items: flex-start; margin-bottom: 4px; }
.b-overview-metrics .ov-m { display: flex; flex-direction: column; line-height: 1.35; min-width: 58px; }
.b-overview-metrics .ov-k { font-size: 10px; color: var(--text-3); margin-bottom: 2px; }
.b-overview-metrics .ov-v { font-size: 18px; font-weight: 800; color: var(--text); }
.b-overview-sub { display: flex; flex-wrap: wrap; gap: 10px 18px; font-size: 11px; color: var(--text-2); line-height: 1.55; padding-top: 8px; }
.b-overview-sub .ov-note b { color: var(--text); font-weight: 700; }
.b-card-grid .c-body { font-size: 12px; color: var(--text-2); }
@keyframes pulseDot { 0% { box-shadow: 0 0 0 0 rgba(52,199,89,.5); } 70% { box-shadow: 0 0 0 5px rgba(52,199,89,0); } 100% { box-shadow: 0 0 0 0 rgba(52,199,89,0); } }
.b-divider { background: transparent; border: none; box-shadow: none; padding: 6px 2px; }
.b-legend-card { margin-top: 40px; }
.b-divider .c-body { font-size: 11px; color: var(--text-3); letter-spacing: 1px; text-align: center; }

/* ---------- 25 组 1v1 对决样式 ---------- */
.battle-loading { flex: 1 1 auto; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; color: var(--text-2); font-size: 13px; }
.battle-loading .spinner { width: 28px; height: 28px; border: 3px solid rgba(255,255,255,.1); border-top-color: var(--accent); border-radius: 50%; animation: spin 1s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }
.battle-pair-line { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; font-size: 11px; margin-bottom: 4px; }
.battle-pair-line .vs { color: var(--text-3); font-weight: 700; }
.stock-vs-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 10px 0; }
.stock-vs-col { display: flex; flex-direction: column; }
.stock-vs-col .stock-card { margin-bottom: 8px; }
.stock-vs-col .stock-card:last-child { margin-bottom: 0; }
.stock-card { background: var(--panel-2); border: 1px solid var(--border); border-radius: 10px; padding: 10px; }
.stock-card.ch { border-left: 3px solid #ff4d6d; }
.stock-card.gk { border-left: 3px solid #4d8bff; }
.stock-card .sc-role { font-size: 12px; font-weight: 700; color: var(--text); margin-bottom: 4px; }
.stock-card .sc-badges { display: flex; flex-wrap: wrap; gap: 4px 6px; margin-bottom: 6px; }
.stock-card .sc-badge { font-size: 10px; color: #6fe3a0; background: rgba(46,204,113,.12); border: 1px solid rgba(46,204,113,.3); padding: 1px 6px; border-radius: 8px; white-space: nowrap; }
.stock-card .sc-stock { font-size: 13px; font-weight: 700; color: var(--text); margin-bottom: 6px; }
.stock-card .sc-code { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; background: rgba(255,255,255,.08); padding: 1px 5px; border-radius: 4px; }
.stock-card .sc-price { font-size: 12px; color: var(--text-2); margin-bottom: 6px; }
.stock-card .sc-price b { color: var(--text); font-size: 14px; margin-right: 6px; }
.stock-card .sc-metrics { display: flex; gap: 10px; font-size: 11px; color: var(--text-2); margin-bottom: 4px; }
.stock-card .sc-note { font-size: 10px; color: var(--text-3); }

/* ---------- 对抗室占位页 ---------- */
.battle-placeholder {
  flex: 1 1 auto; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; color: var(--text-2); text-align: center; padding: 24px;
}
.battle-placeholder .battle-ic { font-size: 48px; line-height: 1; opacity: .7; }
.battle-placeholder .battle-title { font-size: 22px; font-weight: 700; color: var(--text); }
.battle-placeholder .battle-sub { font-size: 13px; color: var(--text-3); }

/* ---------- 底部 TAB 导航 ---------- */
#bottom-tab {
  flex: 0 0 auto; display: flex; background: #0c0f15; border-top: 1px solid var(--border);
  padding: 4px 0 calc(6px + env(safe-area-inset-bottom, 0px));
}
#bottom-tab .tab-item {
  flex: 1 1 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px;
  padding: 6px 0; background: transparent; color: var(--text-3); font-size: 11px; transition: .15s; position: relative;
}
#bottom-tab .tab-item .tab-ic { font-size: 18px; line-height: 1; }
#bottom-tab .tab-item .tab-label { font-size: 11px; }
#bottom-tab .tab-item.active { color: var(--accent); }
#bottom-tab .tab-item.active::after {
  content: ''; position: absolute; top: 0; left: 25%; right: 25%; height: 2px; border-radius: 0 0 2px 2px; background: var(--accent);
}
#bottom-tab .tab-item:active { opacity: .7; }
.card {
  background: var(--panel); border: 1px solid var(--border); border-radius: 14px; padding: 12px; display: flex; flex-direction: column;
  box-shadow: 0 4px 16px rgba(0,0,0,.45); position: relative; overflow: hidden; transition: .15s; cursor: pointer; min-width: 0;
}
.card:active { transform: scale(.98); background: #0e1218; }
.card .c-head { display: flex; align-items: center; gap: 7px; margin-bottom: 8px; }
.card .c-title { font-size: 13px; font-weight: 600; color: var(--text); }
.card .c-body { flex: 1 1 auto; display: flex; flex-direction: column; justify-content: center; }
.card .c-foot { font-size: 10px; color: var(--text-3); margin-top: 4px; }

/* 策略锦标赛总览卡：强制不被父级 .card 裁切/压缩 */
.card.b-overview { overflow: visible; }
.card.b-overview .c-body { flex: 0 0 auto; justify-content: flex-start; min-height: 0; }

/* 策略锦标赛与下方流程图之间的巨大间隔：用一个透明占位行把所有卡片整体下移 */
.b-flow-spacer { grid-column: 1 / -1; height: 500px; background: transparent; border: none; box-shadow: none; padding: 0; }

/* 卡片左侧色条（替代原 emoji 图标） */
.ic1 { border-left: 3px solid #ff4d6d; }
.ic2 { border-left: 3px solid #4d8bff; }
.ic3 { border-left: 3px solid #b06af0; }
.ic4 { border-left: 3px solid #2ecc71; }
.ic5 { border-left: 3px solid #f0a93a; }
.ic6 { border-left: 3px solid #5b6470; }
.ic7 { border-left: 3px solid #22d3ee; }
.ic8 { border-left: 3px solid #f5b301; }
.ic9 { border-left: 3px solid #6366f1; }
.ic10 { border-left: 3px solid #f43f5e; }
.ic11 { border-left: 3px solid #00d2ff; }
.ic12 { border-left: 3px solid #ff6b35; }

.big-num { font-size: 30px; font-weight: 800; line-height: 1; color: var(--text); }
.up { color: var(--up); } .down { color: var(--down); } .flat { color: var(--text-3); }
.sub { font-size: 10px; color: var(--text-3); }
.mini-row { display: flex; gap: 6px; margin-top: 6px; font-size: 11px; color: var(--text-2); }
.news-mini { font-size: 11px; color: var(--text-2); line-height: 1.5; overflow: hidden; }
.news-mini .nrow { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.badge { position: absolute; top: 10px; right: 10px; background: #ff4d6d; color: #fff; font-size: 10px; padding: 1px 7px; border-radius: 10px; font-weight: 600; }

/* ---------- 全屏弹窗容器 ---------- */
#modal-root {
  position: absolute; inset: 0; background: var(--bg-2); z-index: 50;
  display: flex; flex-direction: column; transform: translateY(100%);
  visibility: hidden; pointer-events: none;
  transition: transform .28s cubic-bezier(.22,.61,.36,1), visibility 0s linear .28s;
}
#modal-root.show { display: flex; transform: translateY(0); visibility: visible; pointer-events: auto;
  transition: transform .28s cubic-bezier(.22,.61,.36,1), visibility 0s linear 0s; }
.modal-head {
  flex: 0 0 auto; min-height: 50px; background: #0c0f15; border-bottom: 1px solid var(--border);
  display: flex; align-items: center; justify-content: space-between; padding: env(safe-area-inset-top, 0px) 12px 0; position: sticky; top: 0; z-index: 5;
}
.modal-head .m-title { font-size: 16px; font-weight: 700; display: flex; align-items: center; gap: 8px; color: var(--text); }
.modal-head .m-title .m-ic { width: 22px; height: 22px; border-radius: 7px; display: flex; align-items: center; justify-content: center; color: #fff; font-size: 13px; }
.modal-body { flex: 1 1 auto; overflow-y: auto; -webkit-overflow-scrolling: touch; padding: 12px 12px calc(12px + env(safe-area-inset-bottom, 0px)); }
.close-x { width: 32px; height: 32px; border-radius: 8px; background: var(--panel-3); font-size: 17px; display: flex; align-items: center; justify-content: center; color: var(--text); }
.close-x:active { background: var(--hover); }

/* ---------- 通用面板/区块 ---------- */
.section { background: var(--panel); border: 1px solid var(--border); border-radius: 12px; padding: 12px; margin-bottom: 12px; }
.section h3 { margin: 0 0 10px; font-size: 14px; font-weight: 700; display: flex; align-items: center; gap: 6px; color: var(--text); }
.section h3 .h3-ic { color: var(--accent); }
.section .hint { font-size: 11px; color: var(--text-3); font-weight: 400; margin-left: auto; }
.muted { color: var(--text-3); } .small { font-size: 11px; color: var(--text-2); }

/* ---------- 指标网格 ---------- */
.metric-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.metric { background: var(--panel-2); border-radius: 10px; padding: 10px; }
.metric .m-label { font-size: 11px; color: var(--text-3); }
.metric .m-val { font-size: 20px; font-weight: 800; margin: 3px 0; color: var(--text); }
.metric.click { cursor: pointer; transition: .15s; }
.metric.click:active { background: var(--hover); }
.mini-list { font-size: 11px; color: var(--text-2); margin-top: 4px; }
.mini-list .li { display: flex; justify-content: space-between; padding: 2px 0; }

/* ---------- 宏观卡片 ---------- */
.macro-grid { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; gap: 8px; }
.macro { background: var(--panel-2); border-radius: 9px; padding: 8px; text-align: center; cursor: pointer; transition: .15s; }
.macro:active { background: var(--hover); }
.macro .mk { font-size: 10px; color: var(--text-3); }
.macro .mv { font-size: 16px; font-weight: 800; margin: 2px 0; color: var(--text); }
.macro .md { font-size: 10px; color: var(--text-2); }

/* ---------- 舆情摘要 ---------- */
.social-row { display: flex; gap: 8px; }
.social { flex: 1; background: var(--panel-2); border-radius: 9px; padding: 9px; }
.social .s-name { font-size: 11px; color: var(--text-3); }
.social .s-heat { font-size: 16px; font-weight: 800; color: var(--text); }
.social .s-ratio { font-size: 10px; margin-top: 4px; }
.s-ratio .pos { color: var(--up); } .s-ratio .neg { color: var(--down); }

/* ---------- 图表容器 ---------- */
.chart-wrap { width: 100%; position: relative; overflow: hidden; border-radius: 8px; aspect-ratio: 320 / 150; }
.qb-chart { width: 100%; height: 100%; display: block; }
.chart-pt { cursor: pointer; }
.legend { display: flex; gap: 12px; flex-wrap: wrap; font-size: 11px; margin-top: 6px; color: var(--text-2); }
.legend .lg { display: flex; align-items: center; gap: 4px; }
.legend .lg i { width: 10px; height: 3px; border-radius: 2px; display: inline-block; }
.chart-pop {
  position: absolute; background: #11161d; color: #fff; font-size: 10px; padding: 4px 7px; border-radius: 6px;
  pointer-events: none; transform: translate(-50%, -120%); white-space: nowrap; z-index: 9; opacity: 0; transition: opacity .1s;
}
.chart-pop.show { opacity: 1; }

/* ---------- 时间范围切换 / 标签组 ---------- */
.seg { display: inline-flex; background: var(--panel-3); border-radius: 8px; padding: 2px; gap: 2px; }
.seg button { padding: 4px 10px; border-radius: 6px; font-size: 11px; color: var(--text-2); transition: .15s; }
.seg button.on { background: var(--accent); color: #fff; font-weight: 700; }

.tag-group { display: flex; flex-wrap: wrap; gap: 6px; }
.tag { padding: 5px 11px; border-radius: 16px; background: var(--panel-3); font-size: 11px; color: var(--text-2); transition: .15s; border: 1px solid transparent; }
.tag:active { transform: scale(.95); }
.tag.on { background: var(--accent); color: #fff; font-weight: 600; }

/* ---------- 新闻筛选栏 ---------- */
.filter-bar { background: var(--panel); border: 1px solid var(--border); border-radius: 12px; padding: 10px; margin-bottom: 10px; }
.filter-row { display: flex; gap: 7px; align-items: center; flex-wrap: wrap; margin-bottom: 8px; }
.sel { flex: 1; min-width: 88px; padding: 7px 8px; border: 1px solid var(--border-2); border-radius: 8px; background: var(--panel-2); color: var(--text); font-size: 12px; }
.inp { flex: 1; min-width: 120px; padding: 7px 10px; border: 1px solid var(--border-2); border-radius: 8px; background: var(--panel-2); color: var(--text); }
.inp::placeholder { color: var(--text-3); }
.quick-tags { display: flex; gap: 6px; flex-wrap: wrap; }
.qtag { padding: 5px 11px; border-radius: 16px; background: var(--panel-3); font-size: 11px; color: var(--text-2); }
.qtag.on { background: var(--accent); color: #fff; font-weight: 600; }
.date-range { display: flex; align-items: center; gap: 6px; font-size: 11px; color: var(--text-2); }
.date-range input[type=date] { padding: 5px 7px; border: 1px solid var(--border-2); border-radius: 7px; background: var(--panel-2); color: var(--text); font-size: 11px; }

/* ---------- 新闻列表 ---------- */
.news-list { display: flex; flex-direction: column; gap: 8px; }
.news-item { background: var(--panel); border: 1px solid var(--border); border-radius: 11px; padding: 11px; box-shadow: none; cursor: pointer; transition: .15s; border-left: 3px solid transparent; }
.news-item:active { transform: scale(.99); background: var(--panel-2); }
.news-item.s-正面 { border-left-color: var(--up); }
.news-item.s-负面 { border-left-color: var(--down); }
.news-item.s-中性 { border-left-color: var(--text-3); }
.news-item .n-top { display: flex; justify-content: space-between; align-items: center; gap: 6px; }
.news-item .n-time { font-size: 10px; color: var(--text-3); }
.news-item .n-title { font-size: 13px; font-weight: 600; color: var(--text); margin: 5px 0; line-height: 1.4; }
.news-item .n-meta { display: flex; flex-wrap: wrap; gap: 5px; align-items: center; margin-top: 4px; }
.pill { font-size: 10px; padding: 1px 7px; border-radius: 10px; font-weight: 600; }
.pill.senti-正面 { background: rgba(255,91,91,.16); color: #ff7a7a; }
.pill.senti-负面 { background: rgba(46,204,113,.16); color: #4fd98a; }
.pill.senti-中性 { background: var(--panel-3); color: var(--text-2); }
.pill.evt { background: rgba(77,139,255,.16); color: #7aa8ff; }
.pill.src { background: rgba(176,106,240,.16); color: #c79bff; }
.pill.stock { background: rgba(240,169,58,.16); color: #f5c06a; }
.pill.cv { background: rgba(46,204,113,.18); color: #4fd98a; border: 1px solid rgba(46,204,113,.4); }
.pill.conf { background: rgba(31,143,255,.16); color: #7ab8ff; }
.qbadge { font-size: 9px; padding: 1px 6px; border-radius: 8px; color: #fff; font-weight: 700; }
.qbadge.high { background: var(--down); } .qbadge.mid { background: var(--warn); color: #1c2530; } .qbadge.low { background: var(--up); }

.load-more { width: 100%; padding: 11px; background: rgba(77,139,255,.14); color: #7aa8ff; border-radius: 11px; font-weight: 600; font-size: 13px; margin-top: 4px; }
.load-more:active { background: rgba(77,139,255,.24); }
.list-empty { text-align: center; color: var(--text-3); padding: 30px; font-size: 12px; }

/* ---------- 底部抽屉 ---------- */
#drawer-root {
  position: absolute; left: 0; right: 0; bottom: 0; height: 80%; background: var(--bg-2); z-index: 80;
  border-radius: 18px 18px 0 0; box-shadow: 0 -8px 30px rgba(0,0,0,.5);
  display: flex; flex-direction: column;
  transform: translateY(100%); visibility: hidden; pointer-events: none;
  transition: transform .3s cubic-bezier(.22,.61,.36,1), visibility 0s linear .3s;
}
#drawer-root.show { display: flex; transform: translateY(0); visibility: visible; pointer-events: auto;
  transition: transform .3s cubic-bezier(.22,.61,.36,1), visibility 0s linear 0s; }
.drawer-head { flex: 0 0 auto; padding: 12px; border-bottom: 1px solid var(--border); display: flex; align-items: center; justify-content: space-between; }
.drawer-head .d-title { font-size: 15px; font-weight: 700; color: var(--text); }
.drawer-body { flex: 1 1 auto; overflow-y: auto; padding: 12px 12px calc(12px + env(safe-area-inset-bottom, 0px)); }
.drawer-grip { width: 38px; height: 4px; background: #3a414c; border-radius: 3px; margin: 7px auto 2px; }
.drawer-mask { position: absolute; inset: 0; background: rgba(0,0,0,.5); z-index: 79; display: none; }
.drawer-mask.show { display: block; }

/* ---------- 双模型对比 ---------- */
.model-cmp { display: flex; flex-direction: column; gap: 10px; }
.model { background: var(--panel-2); border-radius: 10px; padding: 10px; }
.model .mh { display: flex; justify-content: space-between; font-size: 12px; font-weight: 600; margin-bottom: 6px; color: var(--text); }
.prog { height: 8px; background: var(--border-2); border-radius: 5px; overflow: hidden; }
.prog > i { display: block; height: 100%; border-radius: 5px; }
.prog-row { display: flex; align-items: center; gap: 8px; margin-top: 5px; }
.prog-row .pl { font-size: 11px; color: var(--text-3); width: 70px; }
.prog-row .pv { font-size: 11px; font-weight: 700; width: 38px; text-align: right; color: var(--text); }
.warn-box { background: rgba(240,169,58,.12); border: 1px solid rgba(240,169,58,.4); border-radius: 9px; padding: 8px; font-size: 11px; color: var(--warn); margin-top: 8px; }
.review-tag { display: inline-block; padding: 2px 9px; border-radius: 10px; font-size: 11px; font-weight: 700; background: rgba(240,169,58,.14); color: var(--warn); }

/* ---------- 事件时间轴 ---------- */
.timeline { position: relative; padding-left: 18px; }
.timeline::before { content: ''; position: absolute; left: 5px; top: 4px; bottom: 4px; width: 2px; background: var(--border-2); }
.tl-item { position: relative; padding: 0 0 14px 4px; }
.tl-item .tl-dot { position: absolute; left: -16px; top: 3px; width: 11px; height: 11px; border-radius: 50%; border: 2px solid var(--bg-2); }
.tl-item .tl-time { font-size: 10px; color: var(--text-3); }
.tl-card { background: var(--panel-2); border-radius: 9px; padding: 8px 10px; margin-top: 3px; }
.tl-card .tl-title { font-size: 12px; font-weight: 600; color: var(--text); }
.tl-card .tl-sub { font-size: 10px; color: var(--text-3); margin-top: 2px; }
.tl-expand { font-size: 10px; color: var(--accent); margin-top: 4px; display: inline-block; }

/* ---------- 信号表格 ---------- */
.tbl { width: 100%; border-collapse: collapse; font-size: 11px; }
.tbl th { text-align: left; padding: 7px 5px; color: var(--text-3); font-weight: 600; border-bottom: 1px solid var(--border); position: sticky; top: 0; background: var(--bg-2); }
.tbl td { padding: 8px 5px; border-bottom: 1px solid var(--border); vertical-align: middle; color: var(--text); }
.tbl tr.row-click { cursor: pointer; }
.tbl tr.row-click:active { background: #16202e; }
.sig-dir { font-size: 10px; padding: 1px 7px; border-radius: 8px; font-weight: 700; color: #fff; white-space: nowrap; }
.sd-强烈买入 { background: var(--up); } .sd-买入 { background: #ff7a59; } .sd-持有 { background: var(--warn); color: #1c2530; } .sd-卖出 { background: var(--down); }
.alpha-bar { width: 54px; }
.alpha-bar .prog { height: 6px; }
.sig-card-view { display: flex; flex-direction: column; gap: 8px; }
.sig-card { background: var(--panel-2); border-radius: 11px; padding: 11px; cursor: pointer; }
.sig-card:active { background: #16202e; }
.sig-card .sc-top { display: flex; justify-content: space-between; align-items: center; }
.sig-card .sc-name { font-size: 14px; font-weight: 700; color: var(--text); }
.sig-card .sc-meta { display: flex; gap: 10px; margin-top: 6px; font-size: 11px; color: var(--text-2); }

/* ---------- 持仓列表 ---------- */
.hold-card { background: var(--panel); border: 1px solid var(--border); border-radius: 11px; padding: 11px; margin-bottom: 8px; }
.hold-card.warnsig { border: 1px solid rgba(240,169,58,.5); }
.hold-card .hc-top { display: flex; justify-content: space-between; align-items: center; }
.hold-card .hc-name { font-size: 14px; font-weight: 700; color: var(--text); }
.hold-card .hc-code { font-size: 10px; color: var(--text-3); }
.hold-card .hc-grid { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 6px; margin-top: 8px; font-size: 11px; }
.hold-card .hc-grid .g .gl { color: var(--text-3); font-size: 10px; }
.hold-card .hc-grid .g .gv { font-weight: 700; font-size: 13px; color: var(--text); }
.ai-pick-card { cursor: pointer; transition: .12s; }
.ai-pick-card:active { transform: scale(.99); background: #181d25; }

/* ---------- 多选股入口 ---------- */
.multi-entry-card { background: rgba(77,139,255,.08); border: 1px dashed var(--accent); border-radius: 12px; padding: 12px; margin-top: 12px; cursor: pointer; transition: .12s; }
.multi-entry-card:active { transform: scale(.99); background: #181d25; }
.multi-entry-card .me-title { font-size: 15px; font-weight: 800; color: var(--accent); }
.multi-entry-card .me-sub { font-size: 11px; color: var(--text-3); margin-top: 4px; line-height: 1.4; }

/* ---------- 多选股组合卡片 ---------- */
.combo-card { background: var(--panel); border: 1px solid var(--border); border-left: 3px solid var(--warn); border-radius: 11px; padding: 11px; margin-bottom: 8px; cursor: pointer; transition: .12s; }
.combo-card:active { transform: scale(.99); background: #181d25; }
.combo-card .cc-top { display: flex; justify-content: space-between; align-items: center; }
.combo-card .cc-name { font-size: 14px; font-weight: 700; color: var(--text); }
.combo-card .cc-tag { font-size: 10px; padding: 2px 7px; border-radius: 7px; background: rgba(240,169,58,.16); color: var(--warn); font-weight: 700; }
.combo-card .cc-stocks { display: flex; flex-wrap: wrap; gap: 6px; margin: 8px 0; }
.combo-card .cc-stocks .cs { font-size: 11px; background: #181d25; padding: 4px 9px; border-radius: 7px; color: var(--text); border: 1px solid var(--border); }
.combo-card .cc-grid { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 6px; font-size: 11px; margin-top: 8px; }
.combo-card .cc-grid .g .gl { color: var(--text-3); font-size: 10px; }
.combo-card .cc-grid .g .gv { font-weight: 700; font-size: 13px; color: var(--text); }
.combo-card .cc-news { margin-top: 8px; }
.combo-card .cc-news .cn-row { font-size: 11px; color: var(--text-2); padding: 4px 0; border-bottom: 1px solid var(--border); }
.combo-card .cc-news .cn-row:last-child { border-bottom: none; }
.combo-card .cc-news .pill { margin-right: 5px; }

/* ---------- 热门概念模块 ---------- */
.hot-tbl { font-size: 10px; }
.hot-tbl th { font-size: 10px; padding: 6px 3px; white-space: nowrap; }
.hot-tbl td { padding: 7px 3px; vertical-align: middle; }
.hot-tbl .hc-rank { font-weight: 800; color: var(--text-3); text-align: center; width: 26px; }
.hot-tbl tr.row-click { cursor: pointer; }
.hot-tbl tr.row-click:active { background: #16202e; }
.status-tag { font-size: 9px; padding: 1px 6px; border-radius: 7px; font-weight: 700; color: #fff; white-space: nowrap; }
.st-up { background: var(--up); }
.st-hot { background: #ff7a59; }
.st-steady { background: var(--warn); color: #1c2530; }
.hot-analysis { background: var(--panel); border: 1px solid var(--border); border-radius: 12px; padding: 10px; }
.hot-analysis .ha-row { display: flex; justify-content: space-between; padding: 6px 0; border-bottom: 1px solid var(--border); font-size: 12px; }
.hot-analysis .ha-row:last-child { border-bottom: none; }
.hot-analysis .ha-k { color: var(--text-3); }
.hot-analysis .ha-v { font-weight: 700; color: var(--text); text-align: right; max-width: 60%; }

/* ---------- 股票五维分类标签 ---------- */
.cat-row { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 5px; }
.cat { font-size: 10px; line-height: 1; padding: 3px 7px; border-radius: 7px; font-weight: 700; color: #fff; white-space: nowrap; }
.cat-market { background: #2f6fed; }
.cat-board { background: #7a5af0; }
.cat-industry { background: #1f9d6b; }
.cat-concept { background: #e0820f; }
.cat-style { background: #0f9db0; }

/* ---------- 智能选股详情抽屉 ---------- */
.pick-detail-head { background: var(--panel); border: 1px solid var(--border); border-radius: 12px; padding: 12px; margin-bottom: 10px; }
.pick-detail-head .pd-name { font-size: 17px; font-weight: 800; color: var(--text); }
.pick-detail-head .pd-sub { font-size: 13px; font-weight: 700; color: var(--text-2); margin-top: 4px; }
.detail-chart { background: var(--panel); border: 1px solid var(--border); border-radius: 12px; padding: 12px; margin-bottom: 14px; overflow: hidden; }
.detail-chart .dc-title { font-size: 14px; font-weight: 900; color: var(--text); margin-bottom: 10px; }
.detail-section { background: var(--panel); border: 1px solid var(--border); border-radius: 12px; padding: 12px; margin-bottom: 14px; }
.detail-section .ds-title { font-size: 14px; font-weight: 900; color: var(--accent); margin-bottom: 10px; padding-bottom: 8px; border-bottom: 1px solid var(--border); }

/* ---------- 因子表 ---------- */
.factor-status { font-size: 10px; padding: 1px 7px; border-radius: 8px; font-weight: 700; }
.fs-正常 { background: rgba(46,204,113,.16); color: #4fd98a; } .fs-警告 { background: rgba(240,169,58,.16); color: var(--warn); } .fs-失效 { background: rgba(255,91,91,.16); color: #ff7a7a; }
.level-tag { font-size: 10px; padding: 1px 7px; border-radius: 8px; font-weight: 800; color: #fff; }
.lv-L0 { background: #5b6470; } .lv-L1 { background: #1f8fff; } .lv-L2 { background: #7a5af0; } .lv-L3 { background: #2f6fed; }
.stars { color: var(--warn); letter-spacing: 1px; }

/* ---------- 按钮 ---------- */
.btn { padding: 9px 16px; border-radius: 10px; font-size: 13px; font-weight: 600; transition: .15s; }
.btn:active { transform: scale(.97); }
.btn-primary { background: var(--accent); color: #fff; }
.btn-primary:active { background: #3a74e0; }
.btn-secondary { background: var(--panel-3); color: var(--text); }
.btn-text { background: transparent; color: var(--accent); padding: 9px 8px; }
.btn-row { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 4px; }
.btn-block { width: 100%; }

/* ---------- 开关 Toggle ---------- */
.toggle { width: 44px; height: 25px; border-radius: 14px; background: var(--border-2); position: relative; transition: .2s; flex: 0 0 auto; }
.toggle.on { background: var(--down); }
.toggle::after { content: ''; position: absolute; top: 2px; left: 2px; width: 21px; height: 21px; background: #fff; border-radius: 50%; transition: .2s; box-shadow: 0 1px 3px rgba(0,0,0,.3); }
.toggle.on::after { left: 21px; }
.set-row { display: flex; align-items: center; justify-content: space-between; padding: 11px 0; border-bottom: 1px solid var(--border); }
.set-row .sl { font-size: 13px; color: var(--text); }
.set-row .sd { font-size: 10px; color: var(--text-3); }
.set-section-t { font-size: 12px; font-weight: 700; color: var(--text-3); margin: 14px 0 4px; }

/* ---------- 滑条 ---------- */
.slider-row { padding: 10px 0; }
.slider-row .sr-top { display: flex; justify-content: space-between; font-size: 12px; margin-bottom: 4px; color: var(--text); }
.slider-row .sr-top .sv { font-weight: 700; color: var(--accent); }
input[type=range] { -webkit-appearance: none; width: 100%; height: 5px; border-radius: 4px; background: var(--border-2); outline: none; }
input[type=range]::-webkit-slider-thumb { -webkit-appearance: none; width: 18px; height: 18px; border-radius: 50%; background: var(--accent); box-shadow: 0 1px 4px rgba(77,139,255,.5); }

/* ---------- 日志查看器 ---------- */
.log-box { background: #05080c; border-radius: 10px; padding: 10px; font-family: "SF Mono", Consolas, monospace; font-size: 10.5px; color: #c7d0db; max-height: 180px; overflow-y: auto; border: 1px solid var(--border); }
.log-box .lg-row { padding: 2px 0; display: flex; gap: 6px; }
.log-box .lg-t { color: #5b6573; }
.log-box .lg-i { color: #7bd17a; } .log-box .lg-w { color: var(--warn); } .log-box .lg-e { color: #ff6b6b; }

/* ---------- 状态指示 / 条件数 ---------- */
.status-chip { display: inline-flex; align-items: center; gap: 6px; padding: 6px 11px; border-radius: 9px; font-size: 12px; font-weight: 600; }
.chip-ok { background: rgba(46,204,113,.16); color: #4fd98a; } .chip-warn { background: rgba(240,169,58,.16); color: var(--warn); } .chip-bad { background: rgba(255,91,91,.16); color: #ff7a7a; } .chip-info { background: rgba(77,139,255,.16); color: #7aa8ff; }
.cond-num { font-size: 26px; font-weight: 800; color: var(--text); }
.cond-num.warn { color: var(--warn); } .cond-num.bad { color: #ff7a7a; }

/* ---------- 热力图图例 ---------- */
.heat-legend { display: flex; gap: 8px; align-items: center; font-size: 10px; color: var(--text-3); margin-top: 6px; }
.heat-legend .bar { width: 120px; height: 8px; border-radius: 4px; background: linear-gradient(90deg,#34c759,#f0c93a,#f0883a,#e23b3b); }

/* ---------- Toast ---------- */
#toast-root { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); z-index: 200; display: flex; flex-direction: column; gap: 8px; align-items: center; pointer-events: none; width: max-content; max-width: 80%; }
.toast { background: rgba(10,14,20,.95); color: #fff; padding: 10px 16px; border-radius: 11px; font-size: 13px; display: flex; align-items: center; gap: 8px; animation: toastIn .25s ease; box-shadow: 0 6px 20px rgba(0,0,0,.5); border: 1px solid var(--border); }
.toast .ti { font-size: 16px; }
@keyframes toastIn { from { opacity: 0; transform: translateY(10px) scale(.95); } }
.toast.out { animation: toastOut .25s ease forwards; }
@keyframes toastOut { to { opacity: 0; transform: translateY(-6px); } }

/* ---------- 加载遮罩 ---------- */
#loading-root { position: absolute; inset: 0; background: rgba(0,0,0,.7); z-index: 150; display: none; align-items: center; justify-content: center; flex-direction: column; gap: 12px; backdrop-filter: blur(2px); }
#loading-root.show { display: flex; }
.ring { width: 42px; height: 42px; border: 4px solid var(--border-2); border-top-color: var(--accent); border-radius: 50%; animation: spin .8s linear infinite; }
.loading-txt { font-size: 12px; color: var(--text-2); }

/* ---------- 设置弹窗 ---------- */
#settings-modal { position: absolute; inset: 0; z-index: 90; background: var(--bg-2);
  display: flex; flex-direction: column; transform: translateY(100%); visibility: hidden; pointer-events: none;
  transition: transform .28s cubic-bezier(.22,.61,.36,1), visibility 0s linear .28s; }
#settings-modal.show { display: flex; transform: translateY(0); visibility: visible; pointer-events: auto;
  transition: transform .28s cubic-bezier(.22,.61,.36,1), visibility 0s linear 0s; }

/* ---------- 杂项 ---------- */
.kv { display: flex; justify-content: space-between; padding: 8px 0; font-size: 13px; border-bottom: 1px solid var(--border); }
.kv .k { color: var(--text-2); font-weight: 700; } .kv .v { font-weight: 800; color: var(--text); }
.evidence-btn { display: inline-flex; align-items: center; gap: 5px; color: var(--accent); font-size: 12px; font-weight: 600; background: rgba(77,139,255,.14); padding: 7px 12px; border-radius: 9px; }
.share-row { display: flex; gap: 8px; margin-top: 10px; }
.share-btn { flex: 1; text-align: center; padding: 9px; border-radius: 10px; background: var(--panel-3); font-size: 12px; font-weight: 600; color: var(--text); }
.share-btn:active { background: var(--hover); }
.fav.on { background: rgba(240,169,58,.16); color: var(--warn); }
.text-edit { width: 100%; min-height: 90px; border: 1px solid var(--border-2); border-radius: 9px; padding: 9px; font-size: 12px; line-height: 1.5; resize: vertical; background: var(--panel-2); color: var(--text); }
.ann-item { display: flex; align-items: center; gap: 8px; padding: 9px; background: var(--panel-2); border-radius: 9px; margin-bottom: 6px; font-size: 11px; }
.ann-item .a-name { font-weight: 700; font-size: 12px; color: var(--text); }
.ann-status { margin-left: auto; font-size: 10px; padding: 2px 8px; border-radius: 8px; font-weight: 700; }
.as-已拉取 { background: rgba(46,204,113,.16); color: #4fd98a; } .as-待拉取 { background: rgba(240,169,58,.16); color: var(--warn); } .as-异常 { background: rgba(255,91,91,.16); color: #ff7a7a; }
.stress-tbl td, .stress-tbl th { text-align: center; }
.stress-tbl .loss { color: #ff7a7a; font-weight: 700; }
.scroll-x { overflow-x: auto; }
.note-line { font-size: 13px; color: var(--text-2); font-weight: 600; line-height: 1.7; }

/* ============================================================
 * 对抗室（策略工厂）视图样式
 * ============================================================ */
#view-battle { overflow-y: auto; -webkit-overflow-scrolling: touch; padding: 16px 16px calc(16px + env(safe-area-inset-bottom, 0px)); gap: 18px; }
.battle-head { background: linear-gradient(135deg, #161b22, #0e1218); border: 1px solid var(--border); border-radius: 14px; padding: 12px; }
.battle-head .bh-title { font-size: 15px; font-weight: 800; color: var(--text); margin-bottom: 10px; }
.bh-stats { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; gap: 8px; margin-bottom: 10px; }
.bh-stats .metric { background: var(--panel-2); padding: 8px; }
.btn-evolution { width: 100%; padding: 9px; border-radius: 10px; background: linear-gradient(135deg, #2f6fed, #34c7f0); color: #fff; font-weight: 700; font-size: 13px; }
.btn-evolution:active { transform: scale(.98); }

.battle-section { background: var(--panel); border: 1px solid var(--border); border-radius: 14px; padding: 12px; }
.battle-section .bs-head { display: flex; align-items: center; gap: 7px; font-size: 14px; font-weight: 700; color: var(--text); margin-bottom: 10px; }
.battle-section .bs-ic { font-size: 16px; }
.battle-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.b-card { background: var(--panel-2); border: 1px solid var(--border); border-radius: 11px; padding: 10px; display: flex; flex-direction: column; gap: 3px; cursor: pointer; position: relative; transition: .15s; min-width: 0; }
.b-card:active { background: var(--hover); transform: scale(.98); }
.b-card .b-c-title { font-size: 13px; font-weight: 700; color: var(--text); }
.b-card .b-c-sub { font-size: 11px; color: var(--text-3); line-height: 1.4; }
.b-card .b-c-go { position: absolute; top: 10px; right: 10px; color: var(--text-3); font-size: 16px; }

/* 三层策略池流程图 */
.pool-flow { display: flex; flex-direction: column; gap: 0; }
.pool-layer { border-radius: 11px; padding: 11px 12px; border: 1px solid var(--border); cursor: pointer; position: relative; }
.pool-layer .pl-tag { display: inline-block; font-size: 10px; font-weight: 700; padding: 1px 8px; border-radius: 8px; color: #fff; margin-bottom: 5px; }
.pool-layer .pl-title { font-size: 13px; font-weight: 700; color: var(--text); }
.pool-layer .pl-sub { font-size: 11px; color: var(--text-3); margin-top: 3px; line-height: 1.4; }
.pool-layer.bottom { background: rgba(77,139,255,.10); }
.pool-layer.bottom .pl-tag { background: #4d8bff; }
.pool-layer.mid { background: rgba(52,199,240,.10); }
.pool-layer.mid .pl-tag { background: #34c7f0; }
.pool-layer.top { background: rgba(176,106,240,.10); }
.pool-layer.top .pl-tag { background: #b06af0; }
.pool-arrow { text-align: center; color: var(--text-3); font-size: 13px; padding: 3px 0; }

/* 判断流程 3 步 */
.flow3 { display: flex; align-items: stretch; gap: 6px; margin-bottom: 10px; }
.flow-step { flex: 1 1 0; background: var(--panel-2); border: 1px solid var(--border); border-radius: 10px; padding: 9px; text-align: center; min-width: 0; }
.flow-step .fs-n { width: 22px; height: 22px; border-radius: 50%; background: var(--accent); color: #fff; font-weight: 800; font-size: 12px; display: flex; align-items: center; justify-content: center; margin: 0 auto 5px; }
.flow-step .fs-t { font-size: 12px; font-weight: 700; color: var(--text); }
.flow-step .fs-d { font-size: 10px; color: var(--text-3); margin-top: 3px; line-height: 1.4; }
.flow-arrow { align-self: center; color: var(--text-3); font-size: 16px; }

/* 训练机制列表 */
.train-list { display: flex; flex-direction: column; gap: 0; }
.tl-item { display: flex; justify-content: space-between; align-items: center; padding: 9px 4px; border-bottom: 1px solid var(--border); font-size: 12px; cursor: pointer; }
.tl-item:active { background: var(--hover); }
.tl-item .tl-k { color: var(--text-2); font-weight: 700; }
.tl-item .tl-v { color: var(--text); font-weight: 600; text-align: right; }

/* 挑战者对决列表 */
.battle-list { display: flex; flex-direction: column; gap: 8px; }
.bt-row { display: flex; align-items: center; gap: 8px; background: var(--panel-2); border: 1px solid var(--border); border-radius: 11px; padding: 9px 10px; cursor: pointer; position: relative; }
.bt-row:active { background: var(--hover); }
.bt-side { flex: 1 1 0; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.bt-side .bt-tag { font-size: 9px; font-weight: 700; color: var(--text-3); }
.bt-side.ch { color: var(--up); font-weight: 700; font-size: 12px; }
.bt-side.gk { color: var(--text-2); font-weight: 700; font-size: 12px; text-align: right; }
.bt-side .bt-m { font-size: 10px; color: var(--text-3); font-weight: 400; }
.bt-vs { font-size: 11px; font-weight: 800; color: var(--text-3); }
.bt-win { position: absolute; top: 8px; right: 10px; font-size: 10px; font-weight: 800; padding: 1px 7px; border-radius: 8px; background: rgba(255,255,255,.06); }
.bt-win.up { color: var(--up); } .bt-win.flat { color: var(--text-3); }

/* 抽屉内表格/质检卡 */
.qc-grid { display: grid; grid-template-columns: 1fr; gap: 8px; margin: 8px 0; }
.qc { background: var(--panel-2); border: 1px solid var(--border); border-radius: 10px; padding: 9px; }
.qc .qc-t { font-size: 13px; font-weight: 700; color: var(--text); }
.qc .qc-d { font-size: 11px; color: var(--text-3); margin: 3px 0; line-height: 1.4; }
.qc .qc-n { font-size: 13px; font-weight: 800; }
.factor-table { display: flex; flex-direction: column; gap: 0; }
.ft-row { display: flex; align-items: center; gap: 8px; padding: 7px 4px; border-bottom: 1px solid var(--border); font-size: 11px; }
.ft-row.dead { opacity: .45; }
.ft-row .ft-name { flex: 1 1 auto; color: var(--text); font-weight: 600; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ft-row .ft-ic, .ft-row .ft-ir { color: var(--text-3); font-size: 10px; }
.ft-row .ft-st { font-weight: 700; font-size: 10px; padding: 1px 6px; border-radius: 7px; }
.ft-st.up { color: var(--up); background: rgba(255,91,91,.12); }
.ft-st.down { color: var(--down); background: rgba(46,204,113,.12); }
.ft-st.flat { color: var(--text-3); background: rgba(255,255,255,.06); }
.formula { background: #0c0f15; border: 1px solid var(--border); border-radius: 8px; padding: 10px; font-size: 12px; color: var(--text-2); line-height: 1.6; font-family: ui-monospace, Menlo, Consolas, monospace; word-break: break-word; }
.lead { font-size: 13px; color: var(--text-2); line-height: 1.7; margin: 0 0 8px; }
.lead b { color: var(--text); }
.chip-up { background: rgba(255,91,91,.16); color: #ff7a7a; } .chip-flat { background: rgba(255,255,255,.08); color: var(--text-2); }
.bt-detail .btd-row { display: flex; justify-content: space-between; font-size: 13px; font-weight: 700; margin-bottom: 8px; }
.bt-detail .status-chip { margin-top: 8px; }

/* ---------- 流程图扩展样式（颜色按图例） ---------- */
.battle-legend { display: flex; flex-wrap: wrap; gap: 6px 10px; margin-bottom: 10px; }
.legend-item { display: inline-flex; align-items: center; gap: 5px; font-size: 10px; color: var(--text-3); background: var(--panel); border: 1px solid var(--border); border-radius: 10px; padding: 3px 7px; }
.legend-dot { width: 7px; height: 7px; border-radius: 50%; }
.legend-real .legend-dot { background: #4d8bff; }
.legend-env .legend-dot { background: #34c7f0; }
.legend-manual .legend-dot { background: #7ee787; border: 1px dashed #7ee787; background: transparent; }
.legend-tournament .legend-dot { background: #b06af0; }
.legend-select .legend-dot { background: #f5c06a; }
.legend-elim .legend-dot { background: #ff5b5b; }
.legend-backtest .legend-dot { background: #4d8bff; }
.legend-sim .legend-dot { background: #ff9f9f; }
.legend-weight .legend-dot { background: #f5e06a; }
.legend-award .legend-dot { background: #ffa726; }
.legend-compete .legend-dot { background: #ff5b5b; }
.legend-rollback .legend-dot { background: #ff8a80; }
.legend-kb .legend-dot { background: #cddc39; }
.legend-report .legend-dot { background: #81c784; }

.battle-actions { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 8px; margin-top: 10px; }
.btn-capital, .btn-rollback { padding: 8px; border-radius: 10px; font-weight: 700; font-size: 12px; border: 1px solid var(--border); background: var(--panel-2); color: var(--text); }
.btn-capital:active, .btn-rollback:active { transform: scale(.98); }
.btn-rollback.active { background: rgba(255,91,91,.16); color: #ff7a7a; border-color: rgba(255,91,91,.35); }

/* 数据同步 / 知识库 / 资金 / 报告 流程条 */
.sync-flow, .kb-flow, .capital-flow, .report-flow { display: flex; align-items: stretch; gap: 4px; overflow-x: auto; padding-bottom: 4px; }
.mini-step { flex: 0 0 auto; min-width: 76px; max-width: 110px; background: var(--panel-2); border: 1px solid var(--border); border-radius: 10px; padding: 8px; text-align: center; }
.mini-step.end { background: rgba(46,204,113,.10); border-color: rgba(46,204,113,.35); }
.mini-step .mini-n { width: 18px; height: 18px; border-radius: 50%; background: var(--accent); color: #fff; font-weight: 800; font-size: 10px; display: flex; align-items: center; justify-content: center; margin: 0 auto 4px; }
.mini-step .mini-t { font-size: 11px; font-weight: 700; color: var(--text); line-height: 1.3; }
.mini-step .mini-d { font-size: 9px; color: var(--text-3); margin-top: 2px; line-height: 1.3; }
.flow-arrow-small { align-self: center; color: var(--text-3); font-size: 12px; }

.hint-row { font-size: 11px; color: var(--text-3); margin-top: 8px; }
.status-pill { display: inline-block; font-size: 10px; font-weight: 700; padding: 1px 7px; border-radius: 8px; }
.status-pill.up { color: var(--down); background: rgba(46,204,113,.12); }
.status-pill.down { color: var(--up); background: rgba(255,91,91,.12); }
.status-pill.flat { color: #f5c06a; background: rgba(245,192,106,.12); }

/* 初始化+策略选择 / 模拟+淘汰 合并行 */
.init-select-row, .sim-elim-row { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }

/* 锦标赛排名预览 */
.tournament-summary { display: flex; gap: 8px; margin-bottom: 8px; }
.tournament-summary .ts-metric { flex: 1 1 0; }
.tournament-summary .metric { background: var(--panel-2); padding: 8px; }
.rank-preview { background: var(--panel-2); border: 1px solid var(--border); border-radius: 10px; overflow: hidden; }
.rp-head, .rp-row { display: grid; grid-template-columns: 36px 1fr 56px 64px 50px; gap: 4px; padding: 7px 10px; font-size: 11px; align-items: center; }
.rp-head { background: rgba(255,255,255,.04); color: var(--text-3); font-weight: 700; }
.rp-row { border-top: 1px solid var(--border); color: var(--text); }
.rp-row .up { color: var(--up); } .rp-row .down { color: var(--down); }

/* 回测三阶段 */
.backtest-stages { display: grid; grid-template-columns: 1fr; gap: 8px; }
.backtest-stages .b-card.passed { border-color: rgba(46,204,113,.45); background: rgba(46,204,113,.08); }
.backtest-stages .b-card.disabled { opacity: .55; }

/* 权重递进 */
.weight-progress { display: flex; align-items: center; justify-content: space-between; gap: 6px; padding: 8px 0; }
.wp-node { flex: 1 1 0; display: flex; flex-direction: column; align-items: center; position: relative; }
.wp-node .wp-dot { width: 14px; height: 14px; border-radius: 50%; background: var(--panel-2); border: 2px solid var(--border); }
.wp-node.active .wp-dot { background: #f5c06a; border-color: #f5c06a; }
.wp-node .wp-label { font-size: 10px; color: var(--text-3); margin-top: 4px; text-align: center; }
.wp-node .wp-line { position: absolute; top: 6px; right: -50%; width: 100%; height: 2px; background: var(--border); z-index: -1; }
.wp-node.active .wp-line { background: #f5c06a; }
.weight-progress-detail { display: flex; align-items: center; justify-content: center; gap: 10px; margin: 8px 0; }
.wpd-node { display: flex; flex-direction: column; align-items: center; gap: 4px; }
.wpd-node .wpd-dot { width: 16px; height: 16px; border-radius: 50%; background: var(--panel-2); border: 2px solid var(--border); }
.wpd-node.active .wpd-dot { background: #f5c06a; border-color: #f5c06a; }
.wpd-node .wpd-label { font-size: 11px; color: var(--text-3); }
.wpd-arrow { color: var(--text-3); font-size: 14px; }

/* 守门者压力 / 回滚 */
.gate-pressure, .rollback-grid { display: flex; flex-direction: column; gap: 6px; }
.gp-row, .rb-row { display: flex; align-items: center; gap: 8px; background: var(--panel-2); border: 1px solid var(--border); border-radius: 10px; padding: 8px 10px; font-size: 11px; }
.gp-row.active, .rb-row.active { border-color: rgba(255,91,91,.45); background: rgba(255,91,91,.08); }
.gp-row .gp-trigger, .rb-row .rb-name { flex: 1 1 auto; color: var(--text); font-weight: 600; }
.gp-row .gp-level { color: #ff7a7a; font-weight: 700; }
.gp-row .gp-action { color: var(--text-3); }
.rb-row .rb-value { color: var(--text-3); }
.rb-row .rb-status { font-weight: 700; }

/* 淘汰流程 */
.elim-flow { display: flex; align-items: center; gap: 6px; margin-bottom: 8px; }

/* 奖励与竞争 */
.awards-row { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.award-card { background: var(--panel-2); border: 1px solid var(--border); border-radius: 11px; padding: 10px; }
.award-card .aw-title { font-size: 12px; font-weight: 700; color: var(--text); margin-bottom: 4px; }
.award-card .aw-sub { font-size: 10px; color: var(--text-3); line-height: 1.4; }
.award-card .aw-winners { margin-top: 6px; font-size: 12px; font-weight: 800; color: var(--down); }
.aw-rank { display: flex; align-items: center; gap: 6px; font-size: 11px; margin-top: 5px; }
.medal { width: 16px; height: 16px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 9px; font-weight: 800; color: #fff; }
.medal-金 { background: #ffd700; color: #5a4a00; }
.medal-银 { background: #c0c0c0; color: #333; }
.medal-铜 { background: #cd7f32; color: #fff; }
.aw-rank .sharpe { margin-left: auto; color: var(--text-3); }

/* 知识库 */
.knowledge-row { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 8px; }
.k-card { background: var(--panel-2); border: 1px solid var(--border); border-radius: 10px; padding: 9px; text-align: center; cursor: pointer; }
.k-card .k-name { font-size: 11px; font-weight: 700; color: var(--text); }
.k-card .k-count { font-size: 18px; font-weight: 800; color: var(--accent); margin: 4px 0; }
.k-card .k-desc { font-size: 9px; color: var(--text-3); line-height: 1.3; }
.knowledge-detail { display: grid; grid-template-columns: 1fr; gap: 8px; }
.kd-card { background: var(--panel-2); border: 1px solid var(--border); border-radius: 10px; padding: 10px; display: flex; align-items: center; gap: 10px; }
.kd-card .kd-name { font-size: 12px; font-weight: 700; color: var(--text); }
.kd-card .kd-count { margin-left: auto; font-size: 16px; font-weight: 800; color: var(--accent); }
.kd-card .kd-desc { font-size: 10px; color: var(--text-3); flex: 1 1 auto; }

.ft-row.highlight { background: rgba(77,139,255,.10); }

/* ============================================================
 * 响应式 / 真机自适应（重点覆盖所有安卓机型）
 * ============================================================ */
/* 点击即时响应，去除移动端 300ms 双击缩放延迟 */
button, .card, a, .icon-btn, .macro, .metric.click, .share-btn, .evi-btn, .evidence-btn { touch-action: manipulation; }
/* 安卓长按易误选文字：交互元素禁选，输入框/文本域保留 */
button, .card, .icon-btn, .macro, .metric.click, .share-btn, .evidence-btn, .close-x, .seg button, .tab { user-select: none; -webkit-user-select: none; }
input, textarea, select, [contenteditable="true"] { user-select: text; -webkit-user-select: text; }
/* 长串（股票代码/数字）在窄屏折行，避免横向溢出 */
.news-mini .nrow, .kv .v, .metric .m-val, .big-num { overflow-wrap: anywhere; word-break: break-word; }

/* 桌面 / 平板预览：保留手机外壳观感（安卓真机 ≤560px 全屏铺满，无外框） */
@media (min-width: 561px) {
  #phone { box-shadow: 0 0 40px rgba(0,0,0,.6); border-radius: 18px; }
  body { background: #06080b; }
}

/* 折叠屏外屏 / 极窄安卓（≤320px）：进一步收窄，保证不溢出 */
@media (max-width: 320px) {
  #main-grid, #battle-grid { gap: 7px; padding: 8px 8px calc(12px + env(safe-area-inset-bottom, 0px)); grid-auto-rows: minmax(80px, auto); }
  .card { padding: 9px; border-radius: 11px; }
  .big-num { font-size: 23px; }
  .card .c-title { font-size: 11px; }
  #app-header .title { font-size: 14px; }
  .c-head { gap: 5px; margin-bottom: 6px; }
}

/* 小屏手机（321–360px）：收窄间距、压缩卡片高度、略缩字号 */
@media (min-width: 321px) and (max-width: 360px) {
  #main-grid, #battle-grid { gap: 8px; padding: 10px 10px calc(14px + env(safe-area-inset-bottom, 0px)); grid-auto-rows: minmax(86px, auto); }
  .card { padding: 10px; border-radius: 12px; }
  .big-num { font-size: 26px; }
  #app-header .title { font-size: 15px; }
  .modal-head .m-title { font-size: 15px; }
  .c-title, .card .c-title { font-size: 12px; }
}

/* 中屏安卓（主流 360–430px，含安全区） */
@media (min-width: 361px) and (max-width: 430px) {
  #main-grid, #battle-grid { grid-auto-rows: minmax(92px, auto); }
}

/* 大屏安卓（如 Ultra / 折叠屏内屏展开 431–560px）：铺满，卡片略放大 */
@media (min-width: 431px) and (max-width: 560px) {
  #main-grid, #battle-grid { grid-auto-rows: minmax(104px, auto); }
  .card { padding: 13px; }
}

/* 矮屏（小高度 / 横屏）：压缩上下栏高度与卡片，避免溢出 */
@media (max-height: 640px) {
  #main-grid, #battle-grid { grid-auto-rows: minmax(78px, auto); }
  .card { padding: 10px; }
  #status-bar { min-height: 22px; }
  #app-header { height: 44px; }
  .modal-head { min-height: 44px; }
}

/* 横屏且很矮：卡片改 3 列，充分利用横向空间 */
@media (orientation: landscape) and (max-height: 520px) {
  #main-grid, #battle-grid { grid-template-columns: 1fr 1fr 1fr; grid-auto-rows: minmax(72px, auto); }
}

/* 超宽屏（桌面大预览）：手机壳居中放大字号可读性 */
@media (min-width: 900px) {
  #phone { max-width: 520px; }
}
.pull-hint { text-align: center; color: var(--text-3); font-size: 11px; padding: 8px; }

/* ============================================================
 * 基金对抗（Fund Battle）PRD V3.2 专用样式
 * ============================================================ */
#view-fund-battle { background: var(--bg); overflow-y: auto; }
#view-fund-battle .battle-placeholder { display: none; }
.fb-root { display: flex; flex-direction: column; gap: 16px; padding: 18px 12px calc(16px + env(safe-area-inset-bottom, 0px)); min-height: 100%; }
.fb-header { display: flex; flex-direction: column; gap: 12px; }
.fb-title { font-size: 20px; font-weight: 800; color: var(--text); line-height: 1.25; letter-spacing: .3px; }
.fb-sub { font-size: 12px; color: var(--text-3); line-height: 1.45; }
.fb-controls { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 2px; }
.fb-btn { flex: 1 1 auto; min-width: 58px; border: 1px solid var(--border); background: var(--panel-2); color: var(--text); border-radius: 10px; padding: 10px 12px; font-size: 12px; font-weight: 700; touch-action: manipulation; }
.fb-btn:active { transform: scale(.98); background: var(--hover); }
.fb-btn.primary { background: var(--accent); color: #fff; border-color: var(--accent); }

.fb-camp-card .c-body { display: flex; flex-direction: column; gap: 14px; }
.fb-camp-row { display: grid; grid-template-columns: 1fr 70px 1fr; gap: 12px; align-items: stretch; }
.fb-camp { background: var(--panel-2); border: 1px solid var(--border); border-radius: 12px; padding: 12px; display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.fb-camp.attacker { border-color: rgba(255,77,109,.45); }
.fb-camp.defender { border-color: rgba(59,130,246,.45); }
.fb-camp-head { font-size: 13px; font-weight: 800; color: var(--text); display: flex; align-items: center; gap: 6px; grid-column: 1 / -1; }
.fb-camp .metric { display: flex; flex-direction: column; gap: 2px; padding: 6px 8px; background: var(--panel); border-radius: 8px; }
.fb-camp .metric .m-k { font-size: 9px; color: var(--text-3); }
.fb-camp .metric .m-v { font-size: 12px; font-weight: 800; color: var(--text); }
.fb-vs { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; }
.fb-vs-score { font-size: 18px; font-weight: 800; color: var(--text); }
.fb-vs-winner { font-size: 10px; color: var(--text-3); text-align: center; }
.fb-system-status { font-size: 11px; color: var(--text-3); text-align: center; margin-top: 6px; padding: 8px 10px; background: var(--panel-2); border: 1px solid var(--border); border-radius: 10px; }

.fb-section-title { font-size: 14px; font-weight: 800; color: var(--text); margin: 4px 0 10px; line-height: 1.35; }
.fb-group-summary { font-size: 11px; color: var(--text-2); background: var(--panel-2); border: 1px solid var(--border); border-radius: 10px; padding: 9px 11px; margin-bottom: 12px; line-height: 1.5; }

/* 25 组 1v1 双列网格：小屏单列，宽屏双列，保持间距不遮挡 */
.fb-group-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
@media (max-width: 380px) { .fb-group-grid { grid-template-columns: 1fr; gap: 10px; } }

.fb-group-card { background: var(--panel-2); border: 1px solid var(--border); border-radius: 13px; padding: 12px; display: flex; flex-direction: column; gap: 8px; cursor: pointer; transition: .12s; position: relative; overflow: hidden; }
.fb-group-card::before { content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: transparent; }
.fb-group-card:active { transform: scale(.99); background: var(--hover); }
.fb-group-card.promoted { border-color: rgba(255,193,7,.55); box-shadow: 0 0 0 1px rgba(255,193,7,.25) inset; }
.fb-group-card.side-atk::before { background: rgba(255,77,109,.75); }
.fb-group-card.side-def::before { background: rgba(59,130,246,.75); }
.fb-group-card.side-none::before { background: var(--border); }
.fb-group-head { font-size: 13px; font-weight: 800; color: var(--text); line-height: 1.35; }
.fb-group-line { display: flex; align-items: flex-start; gap: 4px; font-size: 11px; line-height: 1.5; }
.fb-group-line .fb-group-label { flex: 0 0 auto; color: var(--text-3); font-weight: 700; min-width: 20px; }
.fb-group-line .fb-group-stocks { color: var(--text); word-break: break-all; }
.fb-group-line.atk .fb-group-label { color: #ff7a9a; }
.fb-group-line.def .fb-group-label { color: #7ab8ff; }
.fb-group-foot { display: flex; align-items: center; gap: 8px; margin-top: 2px; }
.fb-group-detail .note-line { font-size: 11px; color: var(--text-2); line-height: 1.5; }

.fb-section-title { font-size: 14px; font-weight: 800; color: var(--text); margin: 4px 0 10px; line-height: 1.35; }
.fb-agent-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; }
@media (min-width: 380px) { .fb-agent-grid { grid-template-columns: repeat(3, 1fr); } }
.fb-agent-card { background: var(--panel-2); border: 1px solid var(--border); border-radius: 11px; padding: 11px; display: flex; flex-direction: column; gap: 8px; cursor: pointer; transition: .12s; }
.fb-agent-card:active { transform: scale(.98); background: var(--hover); }
.fb-agent-head { display: flex; align-items: center; gap: 5px; }
.fb-agent-id { font-size: 13px; font-weight: 800; color: var(--text); }
.fb-agent-role { font-size: 9px; font-weight: 700; padding: 1px 5px; border-radius: 6px; }
.fb-agent-role.attacker { background: rgba(255,77,109,.18); color: #ff7a9a; }
.fb-agent-role.defender { background: rgba(59,130,246,.18); color: #7ab8ff; }
.fb-rank { margin-left: auto; font-size: 10px; color: var(--text-3); }
.fb-agent-name { font-size: 10px; color: var(--text-3); line-height: 1.45; min-height: 30px; }
.fb-agent-metrics { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.fb-agent-metrics .metric { background: var(--panel); border-radius: 7px; padding: 6px; }
.fb-agent-metrics .metric .m-k { font-size: 9px; color: var(--text-3); margin-bottom: 2px; }
.fb-agent-metrics .metric .m-v { font-size: 13px; font-weight: 800; }
.fb-agent-metrics .metric.up .m-v { color: var(--up); }
.fb-agent-metrics .metric.down .m-v { color: var(--down); }
.fb-agent-tags { display: flex; flex-wrap: wrap; gap: 4px; }
.fb-agent-foot { font-size: 9px; color: var(--text-3); }

.fb-detail { display: flex; flex-direction: column; gap: 12px; }
.fb-detail-head { display: flex; align-items: center; gap: 8px; margin-bottom: 4px; }
.fb-detail-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.fb-detail-grid.small { grid-template-columns: repeat(3, 1fr); }
.fb-detail-grid .metric { background: var(--panel-2); border: 1px solid var(--border); border-radius: 9px; padding: 8px; display: flex; flex-direction: column; gap: 3px; }
.fb-detail-grid .metric .m-k { font-size: 9px; color: var(--text-3); }
.fb-detail-grid .metric .m-v { font-size: 13px; font-weight: 800; color: var(--text); }
.fb-eliminated { background: rgba(255,91,91,.16); color: #ff7a7a; border: 1px solid rgba(255,91,91,.35); border-radius: 9px; padding: 10px; font-size: 12px; font-weight: 700; }
.fb-strategy-list { display: flex; flex-direction: column; gap: 6px; }
.fb-strategy-item { background: var(--panel-2); border: 1px solid var(--border); border-radius: 9px; padding: 8px; display: flex; justify-content: space-between; font-size: 11px; }
.fb-lineage { font-size: 11px; color: var(--text-2); line-height: 1.5; }

.fb-report { display: flex; flex-direction: column; gap: 12px; }
.fb-rank-list { display: flex; flex-direction: column; gap: 6px; }
.fb-rank-item { background: var(--panel-2); border: 1px solid var(--border); border-radius: 9px; padding: 9px; display: flex; align-items: center; gap: 8px; font-size: 11px; }
.fb-rank-item b { color: var(--text); }
.fb-rank-item.eliminated { border-color: rgba(255,91,91,.45); background: rgba(255,91,91,.08); }
.fb-rank-item span { color: var(--text-3); }
.fb-empty { text-align: center; color: var(--text-3); padding: 24px; font-size: 13px; }

.tag { font-size: 9px; font-weight: 700; padding: 2px 6px; border-radius: 7px; color: var(--text); }

/* —— 基金对抗：分类主体界面（分好类 · 间隔合理 · 不互相遮挡） —— */
.fb-summary-card { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; background: var(--panel-2); border: 1px solid var(--border); border-radius: 12px; padding: 12px; }
.fb-summary-item { display: flex; flex-direction: column; gap: 3px; align-items: center; text-align: center; }
.fb-summary-item span { font-size: 10px; color: var(--text-3); }
.fb-summary-item b { font-size: 15px; font-weight: 800; color: var(--text); }
@media (max-width: 380px) { .fb-summary-card { grid-template-columns: repeat(2, 1fr); gap: 8px; } }

.fb-cat { background: var(--panel); border: 1px solid var(--border); border-radius: 14px; padding: 12px; }
.fb-cat.promo { border-color: rgba(255,193,7,.5); }
.fb-cat-head { display: flex; align-items: center; gap: 8px; margin-bottom: 12px; }
.fb-cat-ic { font-size: 16px; line-height: 1; }
.fb-cat-title { font-size: 14px; font-weight: 800; color: var(--text); }
.fb-cat-count { margin-left: auto; font-size: 11px; color: var(--text-2); background: var(--panel-2); border: 1px solid var(--border); border-radius: 10px; padding: 3px 9px; white-space: nowrap; }
.fb-cat-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
@media (max-width: 380px) { .fb-cat-grid { grid-template-columns: 1fr; gap: 10px; } }

.fb-status-pill { flex: 1 1 100%; display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 700; padding: 8px 12px; border-radius: 10px; }
.fb-status-pill.on { color: #2ecc71; background: rgba(46,204,113,.12); border: 1px solid rgba(46,204,113,.4); }
.fb-status-pill.off { color: var(--text-3); background: var(--panel-2); border: 1px solid var(--border); }