/* ═══════════════════════════════════════════════════════════════
   设计系统 — Kraken
   Kraken Purple #7132f5 / 白底 / 近黑 #101114 / 冷灰中性 / 绿涨红跌
   IBM Plex Sans (自托管) + 中文系统字体
   ═══════════════════════════════════════════════════════════════ */

@font-face {
  font-family: "IBM Plex Sans"; font-style: normal; font-weight: 400;
  font-display: swap; src: url("../vendor/fonts/ibmplex-400.woff2") format("woff2");
}
@font-face {
  font-family: "IBM Plex Sans"; font-style: normal; font-weight: 500;
  font-display: swap; src: url("../vendor/fonts/ibmplex-500.woff2") format("woff2");
}
@font-face {
  font-family: "IBM Plex Sans"; font-style: normal; font-weight: 600;
  font-display: swap; src: url("../vendor/fonts/ibmplex-600.woff2") format("woff2");
}
@font-face {
  font-family: "IBM Plex Sans"; font-style: normal; font-weight: 700;
  font-display: swap; src: url("../vendor/fonts/ibmplex-700.woff2") format("woff2");
}

:root {
  --bg: #f6f6fb;
  --card: #ffffff;
  --ink: #101114;
  --ink-2: #686b82;
  --ink-3: #9497a9;
  --line: #ececf1;
  --border: #dedee5;

  --primary: #7132f5;
  --primary-deep: #5741d8;
  --primary-soft: #f0ebfe;
  --primary-subtle: rgba(113, 50, 245, 0.10);
  --grad-purple: linear-gradient(150deg, #7132f5 0%, #5b1ecf 100%);
  --grad-dark: linear-gradient(155deg, #1b1335 0%, #2d1a63 58%, #3a1e8a 100%);

  /* 字面色（不随方向变）*/
  --red: #e5484d;
  --red-bg: rgba(229, 72, 77, 0.11);
  --green: #149e61;
  --green-bg: rgba(20, 158, 97, 0.12);
  --green-ink: #026b3f;

  /* 涨跌方向：A股惯例 红涨绿跌 */
  --up: var(--red);
  --up-bg: var(--red-bg);
  --down: var(--green);
  --down-bg: var(--green-bg);
  --warn: #b76b00;
  --warn-bg: rgba(183, 107, 0, 0.12);
  --purple: #7132f5;
  --purple-bg: var(--primary-soft);

  --radius: 16px;
  --radius-sm: 12px;
  --radius-chip: 8px;
  --shadow: 0 4px 24px rgba(16, 17, 20, 0.04);
  --shadow-micro: 0 1px 4px rgba(16, 24, 40, 0.05);
  --shadow-tab: 0 -4px 24px rgba(16, 24, 40, 0.06);

  --tabbar-h: 76px;
}

* { box-sizing: border-box; margin: 0; padding: 0; }

html { -webkit-text-size-adjust: 100%; }

body {
  font-family: "IBM Plex Sans", "PingFang SC", "HarmonyOS Sans SC",
    "Microsoft YaHei", -apple-system, system-ui, sans-serif;
  background: var(--bg);
  color: var(--ink);
  font-size: 15px;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}

#app {
  max-width: 480px;
  margin: 0 auto;
  min-height: 100vh;
  min-height: 100dvh;
  position: relative;
}

.page {
  padding: 18px 16px calc(var(--tabbar-h) + 24px);
  animation: page-in 0.22s ease;
}

@keyframes page-in {
  from { opacity: 0; transform: translateY(6px); }
  to { opacity: 1; transform: none; }
}

/* ─── 数字字体 ─────────────────────────────────────────────── */

.num {
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum";
}

/* ─── 页头 ────────────────────────────────────────────────── */

.page-head { margin: 6px 2px 16px; }
.page-head .hello { color: var(--ink-2); font-size: 13px; }
.page-head h1 { font-size: 26px; font-weight: 700; letter-spacing: -0.6px; }
.page-head-row {
  display: flex; align-items: center; justify-content: space-between;
}

/* ─── 卡片 ────────────────────────────────────────────────── */

.card {
  background: var(--card);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  border: 1px solid var(--line);
  padding: 16px;
  margin-bottom: 14px;
}

.card-press { transition: transform 0.12s ease; cursor: pointer; }
.card-press:active { transform: scale(0.98); }

.section-row {
  display: flex; align-items: baseline; justify-content: space-between;
  margin: 18px 2px 12px;
}
.section-row h2 { font-size: 18px; font-weight: 700; letter-spacing: -0.4px; }
.section-row .more {
  font-size: 13px; color: var(--primary); text-decoration: none; font-weight: 500;
  background: none; border: none; cursor: pointer;
}

/* ─── 紫色主卡（首页情绪卡）──────────────────────────────── */

.hero-blue {
  background: var(--grad-purple);
  color: #fff;
  border-radius: var(--radius);
  padding: 18px 18px 20px;
  margin-bottom: 14px;
  box-shadow: 0 10px 28px rgba(113, 50, 245, 0.30);
}
.hero-blue .hero-top {
  display: flex; justify-content: space-between; align-items: center;
  font-size: 13px; opacity: 0.85;
}
.hero-blue .hero-main {
  font-size: 40px; font-weight: 700; letter-spacing: -1px; margin: 8px 0 14px;
}
.hero-blue .hero-stats { display: flex; gap: 0; }
.hero-blue .hero-stat { flex: 1; }
.hero-blue .hero-stat .lbl { font-size: 12px; opacity: 0.75; }
.hero-blue .hero-stat .val { font-size: 22px; font-weight: 700; margin-top: 2px; }

/* ─── 标签 / 徽章 ─────────────────────────────────────────── */

.chip {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 3px 10px; border-radius: var(--radius-chip);
  font-size: 12px; font-weight: 500;
  white-space: nowrap;
  background: rgba(104, 107, 130, 0.12); color: #484b5e;
}
.chip.blue { background: var(--primary-soft); color: var(--primary); }
.chip.green { background: var(--green-bg); color: var(--green-ink); }
.chip.red { background: var(--red-bg); color: var(--red); }
.chip.amber { background: var(--warn-bg); color: var(--warn); }
.chip.purple { background: var(--primary-soft); color: var(--primary); }

.pct {
  display: inline-flex; align-items: center; gap: 3px;
  font-size: 13px; font-weight: 600;
  padding: 2px 8px; border-radius: 6px;
}
.pct.up { color: var(--up); background: var(--up-bg); }
.pct.down { color: var(--down); background: var(--down-bg); }
.pct.flat { color: var(--ink-2); background: rgba(104, 107, 130, 0.10); }

/* ─── 筛选 chips（推荐页）────────────────────────────────── */

.filter-row {
  display: flex; gap: 10px; overflow-x: auto; padding: 2px;
  margin-bottom: 14px; scrollbar-width: none;
}
.filter-row::-webkit-scrollbar { display: none; }
.filter-chip {
  flex-shrink: 0; padding: 8px 16px; border-radius: 10px;
  font-size: 14px; font-weight: 500; cursor: pointer;
  background: var(--card); color: var(--ink-2);
  border: 1px solid var(--border);
}
.filter-chip.active {
  background: var(--primary); color: #fff; border-color: var(--primary);
}

/* ─── 通知条 ─────────────────────────────────────────────── */

.notice {
  display: flex; align-items: center; gap: 10px;
  background: var(--primary-soft);
  border-top: 1px solid #e7ddfc; border-bottom: 1px solid #e7ddfc;
  margin: 0 -16px 14px; padding: 10px 16px;
  font-size: 13px;
}
.notice .nt { color: var(--primary); font-weight: 600; }
.notice .ns { color: var(--ink-2); font-size: 12px; }
.notice-dot {
  width: 8px; height: 8px; border-radius: 50%;
  background: var(--primary); flex-shrink: 0;
}

/* ─── 个股推荐卡 ─────────────────────────────────────────── */

.auction-head {
  display: flex; align-items: center; justify-content: space-between;
  gap: 10px; margin: 4px 2px 10px;
}
.auction-head h2 {
  font-size: 18px; font-weight: 700; letter-spacing: 0;
}
.auction-sub {
  color: var(--ink-3); font-size: 12px; margin-top: 2px;
}
.auction-actions {
  display: flex; gap: 6px; flex-shrink: 0;
}
.auction-actions .btn.small {
  padding-left: 10px; padding-right: 10px;
}
.auction-note {
  display: flex; align-items: center; gap: 8px;
  color: var(--ink-2); font-size: 12px; line-height: 1.45;
  background: #fff; border: 1px solid var(--line);
  border-radius: var(--radius-sm); padding: 10px 12px; margin-bottom: 10px;
}
.auction-note.warn {
  background: var(--warn-bg); color: var(--warn);
  border-color: rgba(183, 107, 0, 0.22);
}
.auction-card {
  background: var(--card); border-radius: var(--radius);
  box-shadow: var(--shadow); border: 1px solid #e7ddfc;
  padding: 16px; margin-bottom: 12px;
}
.auction-card.clickable { cursor: pointer; transition: transform .12s, box-shadow .12s, border-color .12s; }
.auction-card.clickable:active { transform: scale(0.99); }
.auction-card.clickable:hover { box-shadow: 0 6px 22px rgba(113, 50, 245, 0.10); border-color: #d9ccfb; }
.auction-metrics {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px;
  margin-top: 12px;
}
.auction-metrics > div {
  border: 1px solid var(--line); border-radius: 8px;
  padding: 7px 8px; background: #fafafe;
}
.auction-metrics span {
  display: block; color: var(--ink-3); font-size: 11px;
}
.auction-metrics b {
  display: block; font-size: 14px; margin-top: 1px;
}
.auction-empty {
  color: var(--ink-3); font-size: 13px; text-align: center;
  padding: 12px 0 18px;
}
.auction-logic {
  border: 1px solid #e7ddfc; border-radius: var(--radius-sm);
  background: #fff; padding: 12px; margin: 2px 0 14px;
}
.logic-title {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  font-size: 13px; font-weight: 700; color: var(--ink);
  margin-bottom: 8px;
}
.logic-grid {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
}
.logic-grid span {
  color: var(--primary); background: var(--primary-soft);
  border-radius: 8px; padding: 5px 8px; font-size: 11.5px; font-weight: 600;
}
.logic-note {
  margin-top: 8px; color: var(--ink-3); font-size: 11.5px; line-height: 1.45;
}
.sector-map {
  display: grid; gap: 6px; margin-top: 9px;
}
.sector-map-row {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  border: 1px solid var(--line); border-radius: 8px;
  background: #fafafe; padding: 7px 8px;
}
.sector-map-row b {
  display: block; color: var(--ink); font-size: 12px;
}
.sector-map-row span {
  display: block; color: var(--ink-3); font-size: 11px; margin-top: 1px;
}
.sector-map-row > .num {
  color: var(--primary); font-size: 14px; font-weight: 800;
}
.ai-sector-map .sector-map-row {
  background: #fff; border-color: #e7ddfc;
}
.auction-record-head {
  display: flex; align-items: center; justify-content: space-between;
  gap: 10px; margin: 16px 2px 10px;
}
.auction-record-head h2 {
  font-size: 18px; font-weight: 700; letter-spacing: 0;
}
.auction-track-summary {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px;
  margin-bottom: 10px;
}
.auction-track-summary > div {
  background: var(--card); border: 1px solid var(--line);
  border-radius: 8px; padding: 8px 9px;
}
.auction-track-summary span {
  display: block; color: var(--ink-3); font-size: 11px;
}
.auction-track-summary b {
  display: block; color: var(--ink); font-size: 15px; margin-top: 1px;
}
.auction-track-summary b.up,
.record-side b.up,
.record-stock-return.up { color: var(--up); }
.auction-track-summary b.down,
.record-side b.down,
.record-stock-return.down { color: var(--down); }
.auction-track-summary b.flat,
.record-side b.flat,
.record-stock-return.flat { color: var(--ink-2); }
.auction-record-card {
  background: var(--card); border-radius: var(--radius);
  box-shadow: var(--shadow); border: 1px solid var(--line);
  padding: 14px; margin-bottom: 12px;
}
.record-top {
  display: flex; align-items: flex-start; justify-content: space-between;
  gap: 12px; padding-bottom: 10px; border-bottom: 1px solid var(--line);
}
.record-main { min-width: 0; flex: 1; }
.record-date { font-size: 15px; font-weight: 800; color: var(--ink); }
.record-names {
  color: var(--ink-2); font-size: 12px; margin-top: 2px;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.record-side {
  display: flex; flex-direction: column; align-items: flex-end;
  gap: 3px; flex-shrink: 0;
}
.record-side b { font-size: 20px; line-height: 1.05; color: var(--ink); }
.record-side small { color: var(--ink-3); font-size: 11px; }
.record-stock {
  display: grid; grid-template-columns: minmax(0, 1fr) auto auto auto;
  align-items: center; gap: 8px; padding: 9px 0;
  border-bottom: 1px dashed var(--border); cursor: pointer;
}
.record-stock:last-child { border-bottom: none; padding-bottom: 0; }
.record-stock-main { min-width: 0; }
.record-stock-main b {
  display: block; font-size: 13.5px; color: var(--ink);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.record-stock-main span {
  display: block; color: var(--ink-3); font-size: 11px; margin-top: 1px;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.record-stock-price {
  color: var(--ink-2); font-size: 11.5px; white-space: nowrap;
}
.record-stock-return {
  font-size: 13px; font-weight: 800; min-width: 58px; text-align: right;
}

.stock-card {
  background: var(--card); border-radius: var(--radius);
  box-shadow: var(--shadow); border: 1px solid var(--line);
  padding: 16px; margin-bottom: 12px;
}
.stock-card.clickable { cursor: pointer; transition: transform .12s, box-shadow .12s, border-color .12s; }
.stock-card.clickable:active { transform: scale(0.99); }
.stock-card.clickable:hover { box-shadow: 0 6px 22px rgba(113, 50, 245, 0.10); border-color: #e2d8fb; }
.stock-row { display: flex; align-items: flex-start; gap: 12px; }
.stock-no {
  width: 34px; height: 34px; border-radius: 10px; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  font-size: 14px; font-weight: 700;
  background: var(--primary-soft); color: var(--primary);
}
.stock-no.amber { background: var(--warn-bg); color: var(--warn); }
.stock-no.gray { background: rgba(104, 107, 130, 0.10); color: var(--ink-2); }
.stock-main { flex: 1; min-width: 0; }
.stock-name { font-size: 16px; font-weight: 700; letter-spacing: -0.2px; }
.stock-sub { font-size: 12px; color: var(--ink-3); margin-top: 1px; }
.stock-side { text-align: right; flex-shrink: 0; }
.stock-price { font-size: 18px; font-weight: 700; }
.stock-tags { display: flex; gap: 6px; margin-top: 10px; flex-wrap: wrap; }
.stock-bar {
  height: 4px; border-radius: 999px; background: var(--line);
  margin-top: 12px; overflow: hidden;
}
.stock-bar > i {
  display: block; height: 100%; border-radius: 999px;
  background: var(--primary);
  transition: width 0.5s ease;
}
.stock-bar > i.mid { background: #a78bfa; }
.stock-bar > i.low { background: var(--ink-3); }

/* ─── 情绪总闸横幅 ───────────────────────────────────────── */

.regime-banner {
  background: var(--warn-bg); color: var(--warn);
  border: 1px solid rgba(183, 107, 0, 0.25);
  border-radius: var(--radius-sm); padding: 10px 14px;
  font-size: 13px; font-weight: 600; line-height: 1.5;
  margin-bottom: 14px;
}

/* ─── 追高风险提示（推荐卡）────────────────────────────────── */

.chase-warn {
  margin-top: 8px; padding: 7px 10px;
  background: var(--warn-bg); color: var(--warn);
  border-radius: 8px; font-size: 12px; font-weight: 500; line-height: 1.4;
}

/* ─── 轮动接力雷达（首页）──────────────────────────────────── */

.relay-card {
  background: linear-gradient(135deg, #f0ebfe 0%, #eaf3ff 100%);
  border: 1px solid #e2d8fb; border-radius: var(--radius);
  padding: 14px 16px; margin-bottom: 14px;
}
.relay-head {
  display: flex; align-items: baseline; justify-content: space-between;
  margin-bottom: 8px;
}
.relay-head > span:first-child { font-size: 15px; font-weight: 700; }
.relay-sub { font-size: 11px; color: var(--ink-3); }
.relay-row {
  display: flex; align-items: center; gap: 8px;
  padding: 6px 0; font-size: 13px;
  border-top: 1px solid rgba(113, 50, 245, 0.08);
}
.relay-name { font-weight: 600; min-width: 72px; }
.relay-net { font-weight: 700; }
.relay-lead { margin-left: auto; font-size: 11px; }

/* ─── 行业解读卡（首页）──────────────────────────────────── */

.sector-card {
  background: var(--card); border-radius: var(--radius);
  box-shadow: var(--shadow); border: 1px solid var(--line);
  padding: 14px 16px; margin-bottom: 10px; cursor: pointer;
  transition: box-shadow .12s, border-color .12s;
}
.sector-card:active { transform: scale(0.995); }
.sector-card:hover { border-color: #e2d8fb; }
.sec-head { display: flex; align-items: center; justify-content: space-between; }
.sec-title { display: flex; align-items: center; gap: 8px; }
.sec-name { font-size: 16px; font-weight: 700; letter-spacing: -0.2px; }
.sec-meta { display: flex; gap: 12px; font-size: 12px; margin-top: 6px; }
.sec-summary { font-size: 13.5px; color: var(--ink-2); line-height: 1.5; margin-top: 8px; }
.sec-detail {
  margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--line);
  animation: page-in 0.18s ease;
}
.sec-block { margin-bottom: 10px; }
.sec-label { font-size: 12px; font-weight: 700; margin-bottom: 3px; }
.sec-text { font-size: 13px; color: var(--ink); line-height: 1.65; }
.sec-disc { font-size: 11px; color: var(--ink-3); margin-top: 6px; line-height: 1.5; }
.sec-more {
  text-align: center; font-size: 11px; color: var(--primary);
  margin-top: 10px; font-weight: 500;
}

/* ─── 深色头图（复盘页）──────────────────────────────────── */

.hero-dark {
  background: var(--grad-dark);
  color: #fff;
  margin: -18px -16px 16px;
  padding: 20px 18px 26px;
  border-radius: 0 0 26px 26px;
}
.hero-dark .hd-top {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 14px;
}
.hero-dark .hd-title { font-size: 15px; font-weight: 600; opacity: 0.95; }
.hero-dark .hd-date {
  display: inline-flex; padding: 4px 12px; border-radius: 999px;
  background: rgba(255, 255, 255, 0.12); font-size: 12px; margin-bottom: 12px;
}
.hero-dark h1 { font-size: 28px; line-height: 1.3; font-weight: 700; letter-spacing: -0.6px; }
.hero-dark .hd-chips { display: flex; gap: 8px; margin-top: 14px; }
.hero-dark .hd-chip {
  padding: 5px 12px; border-radius: 999px; font-size: 12px; font-weight: 500;
  background: rgba(255, 255, 255, 0.1); border: 1px solid rgba(255,255,255,0.16);
}
.hero-dark .hd-chip.r { color: #ff9b9b; }  /* 大盘上涨=红 */
.hero-dark .hd-chip.g { color: #5fd6a0; }  /* 大盘下跌=绿 */
.hero-dark .hd-chip.b { color: #b9a5ff; }

.icon-btn {
  width: 36px; height: 36px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  background: rgba(255, 255, 255, 0.12); border: none; color: inherit;
  cursor: pointer;
}

/* ─── 指数三卡 ───────────────────────────────────────────── */

.idx-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.idx-cell { border-radius: var(--radius-sm); padding: 10px 4px; text-align: center; }
.idx-cell .nm { font-size: 12px; color: var(--ink-2); }
.idx-cell .pr { font-size: 17px; font-weight: 700; margin-top: 2px; }
.idx-cell .pc { font-size: 12px; font-weight: 600; margin-top: 1px; }
.idx-cell.up { background: var(--up-bg); } .idx-cell.up .pc { color: var(--up); }
.idx-cell.down { background: var(--down-bg); } .idx-cell.down .pc { color: var(--down); }
.idx-cell.flat { background: rgba(104, 107, 130, 0.08); } .idx-cell.flat .pc { color: var(--ink-2); }

/* ─── AI 内容块 ──────────────────────────────────────────── */

.ai-head { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; }
.ai-ico {
  width: 38px; height: 38px; border-radius: 12px; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  background: var(--grad-purple); color: #fff;
}
.ai-quote {
  background: var(--primary-soft); border: 1px solid #e7ddfc;
  border-radius: var(--radius-sm); padding: 12px 14px; font-size: 14px;
}
.ai-quote .q-title {
  color: var(--primary); font-weight: 700; font-size: 13px; margin-bottom: 6px;
}
.ai-body { font-size: 14px; line-height: 1.75; color: #2b2d3a; }
.ai-body h3 { font-size: 15px; margin: 14px 0 6px; letter-spacing: -0.2px; }
.ai-body p { margin: 8px 0; }
.ai-body li { margin: 4px 0 4px 18px; }
.ai-body strong { color: var(--ink); }

.debate-bubble {
  border-radius: var(--radius-sm); padding: 12px 14px; margin-bottom: 10px;
  font-size: 14px; line-height: 1.7; border-left: 3px solid var(--ink-3);
  background: rgba(104, 107, 130, 0.06);
}
.debate-bubble .db-role { font-weight: 700; font-size: 13px; margin-bottom: 4px; }
.debate-bubble.bull { border-color: var(--red); background: var(--red-bg); }
.debate-bubble.bull .db-role { color: var(--red); }
.debate-bubble.bear { border-color: var(--green); background: var(--green-bg); }
.debate-bubble.bear .db-role { color: var(--green); }
.debate-bubble.judge { border-color: var(--primary); background: var(--primary-soft); }
.debate-bubble.judge .db-role { color: var(--primary); }

/* ─── 多智能体意见摘要 ────────────────────────────────────── */
.agents-opinions {
  display: flex; flex-direction: column; gap: 6px;
  margin-bottom: 14px;
  padding: 10px 12px;
  background: var(--primary-subtle);
  border-radius: var(--radius-sm);
  border: 1px solid #e7ddfc;
}
.ao-item {
  display: flex; align-items: center; gap: 6px;
  font-size: 13px; flex-wrap: wrap;
}
.ao-icon { font-size: 14px; flex-shrink: 0; }
.ao-name { font-weight: 600; color: var(--ink); min-width: 68px; }
.ao-conf { font-size: 12px; min-width: 32px; }
.ao-summary { color: var(--ink-2); flex: 1; min-width: 120px; }

/* ─── 列表行 ─────────────────────────────────────────────── */

.row-item {
  display: flex; align-items: center; gap: 12px;
  padding: 12px 0; border-bottom: 1px solid var(--line);
}
.row-item:last-child { border-bottom: none; padding-bottom: 2px; }
.row-item:first-child { padding-top: 2px; }
.row-main { flex: 1; min-width: 0; }
.row-title { font-size: 15px; font-weight: 600; }
.row-sub { font-size: 12px; color: var(--ink-3); margin-top: 1px; }
.row-side { text-align: right; }

/* ─── 按钮 ───────────────────────────────────────────────── */

.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  border: none; border-radius: 12px; cursor: pointer;
  font-size: 15px; font-weight: 600;
  padding: 13px 16px; width: 100%;
  background: var(--primary); color: #fff;
  transition: opacity 0.15s, transform 0.12s, box-shadow 0.15s;
}
.btn:active { transform: scale(0.98); }
.btn:disabled { opacity: 0.5; cursor: default; }
.btn.ghost {
  background: var(--card); color: var(--primary-deep);
  border: 1px solid var(--primary-deep);
}
.btn.small { width: auto; padding: 9px 16px; font-size: 13px; border-radius: 10px; }

/* ─── 表单 ───────────────────────────────────────────────── */

.field { margin-bottom: 14px; }
.field label {
  display: block; font-size: 13px; color: var(--ink-2); margin-bottom: 6px;
}
.field input {
  width: 100%; border: 1px solid var(--border); border-radius: var(--radius-sm);
  padding: 12px; font-size: 15px; background: var(--card);
  outline: none; color: var(--ink);
}
.field input:focus { border-color: var(--primary); box-shadow: 0 0 0 3px var(--primary-subtle); }
.field .hint { font-size: 12px; color: var(--ink-3); margin-top: 4px; }

/* ─── 骨架屏 / 空态 ──────────────────────────────────────── */

.skeleton {
  border-radius: var(--radius-sm); background: linear-gradient(90deg,
    #ececf1 25%, #f6f6f9 45%, #ececf1 65%);
  background-size: 200% 100%;
  animation: shimmer 1.3s infinite;
}
@keyframes shimmer { to { background-position: -200% 0; } }

.empty {
  text-align: center; color: var(--ink-3); padding: 36px 16px; font-size: 14px;
}
.empty .em-ico { font-size: 34px; margin-bottom: 8px; }

/* ─── 任务进度条 ─────────────────────────────────────────── */

.job-banner {
  display: flex; align-items: center; gap: 10px;
  background: var(--primary-soft); color: var(--primary);
  border-radius: var(--radius-sm); padding: 10px 14px;
  font-size: 13px; margin-bottom: 14px;
}
.spinner {
  width: 16px; height: 16px; flex-shrink: 0;
  border: 2px solid rgba(113, 50, 245, 0.25); border-top-color: var(--primary);
  border-radius: 50%; animation: spin 0.8s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }

/* ─── 提示 toast ─────────────────────────────────────────── */

.toast {
  position: fixed; left: 50%; bottom: calc(var(--tabbar-h) + 24px);
  transform: translateX(-50%);
  background: var(--ink); color: #fff;
  padding: 10px 18px; border-radius: 12px; font-size: 13px;
  z-index: 99; max-width: 86%; text-align: center;
  box-shadow: 0 8px 28px rgba(16, 17, 20, 0.22);
  animation: toast-in 0.2s ease;
}
@keyframes toast-in {
  from { opacity: 0; transform: translate(-50%, 8px); }
  to { opacity: 1; transform: translate(-50%, 0); }
}

/* ─── 底部 Tab 栏 ────────────────────────────────────────── */

.tabbar {
  position: fixed; bottom: 0; left: 50%; transform: translateX(-50%);
  width: 100%; max-width: 480px; z-index: 50;
  padding: 8px 8px calc(8px + env(safe-area-inset-bottom));
  background: rgba(255, 255, 255, 0.96);
  backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
  border-radius: 24px 24px 0 0;
  border-top: 1px solid var(--line);
  box-shadow: var(--shadow-tab);
  display: flex; align-items: flex-end; gap: 2px;
  overflow-x: auto; -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.tabbar::-webkit-scrollbar { display: none; }
.tabbar.public {
  justify-content: center;
  gap: 16px;
  overflow-x: hidden;
}
.tab-item {
  flex: 0 0 auto; min-width: 52px; border: none; background: none; cursor: pointer;
  display: flex; flex-direction: column; align-items: center; gap: 4px;
  padding: 8px 4px; border-radius: 12px;
  color: var(--ink-3); font-size: 11px; font-weight: 500;
  transition: background 0.18s, color 0.18s;
  -webkit-tap-highlight-color: transparent;
  user-select: none;
}
/* SVG 不截获点击事件 */
.tab-item svg, .tab-item span { pointer-events: none; }
.tab-item svg { width: 22px; height: 22px; }
.tab-item.active { background: var(--primary); color: #fff; }
.tabbar.public .tab-item {
  flex: 0 0 82px;
  min-width: 82px;
  padding-inline: 8px;
}

/* 中间推荐按钮：凸起大圆形 */
.tab-item.center {
  background: var(--grad-purple);
  color: #fff;
  width: 56px; height: 56px; flex: 0 0 56px;
  border-radius: 50%;
  padding: 0;
  margin-bottom: 4px;
  box-shadow: 0 6px 20px rgba(113, 50, 245, 0.42);
  font-size: 10px;
  gap: 2px;
}
.tab-item.center svg { width: 24px; height: 24px; }

/* ─── 工具 ───────────────────────────────────────────────── */

.muted { color: var(--ink-3); font-size: 12px; }
.up-text { color: var(--up); }
.down-text { color: var(--down); }
.mt8 { margin-top: 8px; } .mt12 { margin-top: 12px; } .mt16 { margin-top: 16px; }
.flex { display: flex; align-items: center; }
.flex-between { display: flex; align-items: center; justify-content: space-between; }
.gap8 { gap: 8px; }

/* ─── 资金流向（复盘页）──────────────────────────────────── */

.ff-row {
  display: flex; align-items: center; gap: 8px;
  padding: 7px 0; border-bottom: 1px solid var(--line);
  font-size: 13px;
}
.ff-row:last-child { border-bottom: none; }
.ff-name { font-weight: 600; min-width: 76px; }
.ff-net { font-weight: 700; margin-left: auto; }
.ff-net.in { color: var(--red); }
.ff-net.out { color: var(--green); }
.ff-lead { font-size: 11px; }
.ff-divider {
  margin: 8px 0 2px; font-size: 11px; color: var(--ink-3);
  border-top: 1px dashed var(--border); padding-top: 8px;
}

/* ─── AI 战绩（复盘页）──────────────────────────────────── */

.sc-hero {
  text-align: center; padding: 6px 0 12px;
  border-bottom: 1px solid var(--line); margin-bottom: 10px;
}
.sc-big { font-size: 34px; font-weight: 800; line-height: 1.1; }
.sc-hero-sub { font-size: 12px; color: var(--ink-2); margin-top: 4px; }
.sc-row {
  display: flex; align-items: center; gap: 10px;
  padding: 8px 0; border-bottom: 1px solid var(--line); font-size: 13px;
}
.sc-row:last-of-type { border-bottom: none; }
.sc-cnt { min-width: 40px; }
.sc-rate { font-weight: 700; }
.sc-ret { margin-left: auto; font-size: 12px; }

/* ─── 个股详情弹层 ────────────────────────────────────────── */
.sd-mask {
  position: fixed; inset: 0; z-index: 200;
  background: rgba(16, 17, 20, 0.45);
  display: flex; align-items: flex-end; justify-content: center;
  animation: sd-fade .18s ease;
}
@keyframes sd-fade { from { opacity: 0; } to { opacity: 1; } }
.sd-sheet {
  width: 100%; max-width: 560px; max-height: 92vh; overflow-y: auto;
  background: var(--card);
  border-radius: 20px 20px 0 0;
  padding: 16px 16px calc(16px + env(safe-area-inset-bottom));
  animation: sd-up .22s cubic-bezier(.2, .8, .25, 1);
}
@keyframes sd-up { from { transform: translateY(24px); } to { transform: translateY(0); } }
.sd-head { display: flex; align-items: flex-start; justify-content: space-between; }
.sd-name { font-size: 18px; font-weight: 700; letter-spacing: -0.3px; }
.sd-code { font-size: 12px; color: var(--ink-3); margin-top: 2px; }
.sd-close {
  border: none; background: rgba(104, 107, 130, 0.10); color: var(--ink-2);
  width: 30px; height: 30px; border-radius: 50%; font-size: 14px;
  cursor: pointer; flex-shrink: 0;
}
.sd-loading, .sd-error {
  display: flex; align-items: center; gap: 8px;
  padding: 28px 4px; color: var(--ink-2); font-size: 14px; justify-content: center;
}
.sd-error { color: var(--down); }
.sd-quote { margin: 14px 0 4px; }
.sd-quote .sd-price { font-size: 30px; font-weight: 700; line-height: 1.1; color: var(--ink); }
.sd-quote .sd-chg { font-size: 14px; font-weight: 600; margin-top: 2px; color: var(--ink-2); }
.sd-quote.up .sd-price, .sd-quote.up .sd-chg { color: var(--up); }
.sd-quote.down .sd-price, .sd-quote.down .sd-chg { color: var(--down); }
.sd-src { font-size: 11px; color: var(--ink-3); margin-top: 4px; }
.sd-grid {
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: 8px 12px; margin: 12px 0;
  padding: 12px; background: var(--bg); border-radius: var(--radius-sm);
}
.sd-grid > div { display: flex; flex-direction: column; }
.sd-grid span { font-size: 11px; color: var(--ink-3); }
.sd-grid b { font-size: 14px; font-weight: 700; margin-top: 1px; }
/* 趋势判定行 */
.sd-trend {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  padding: 9px 12px; margin-bottom: 12px;
  background: var(--bg); border-radius: var(--radius-sm);
}
.sd-trend-checks { display: flex; gap: 6px; }
.sd-trend-checks i {
  font-style: normal; font-size: 10.5px; padding: 1px 7px;
  border-radius: 6px; background: rgba(104, 107, 130, 0.10); color: var(--ink-3);
}
.sd-trend-checks i.ok { background: var(--red-bg); color: var(--red); }
.sd-trend-levels { margin-left: auto; font-size: 11.5px; color: var(--ink-2); }

/* 交易参考行 */
.sd-plan {
  display: flex; align-items: flex-start; gap: 8px;
  padding: 9px 12px; margin-bottom: 12px;
  border-radius: var(--radius-sm); font-size: 12.5px; line-height: 1.55;
}
.sd-plan.ok  { background: var(--red-bg); color: var(--red); }
.sd-plan.mid { background: var(--warn-bg); color: var(--warn); }
.sd-plan.bad { background: var(--green-bg); color: var(--green-ink); }
.sd-plan-label { font-weight: 700; flex-shrink: 0; }
.sd-plan-text { font-weight: 500; }

.sd-chart-wrap { margin-top: 6px; }
.sd-legend { display: flex; gap: 12px; font-size: 11px; padding: 2px 2px 6px; }
.sd-chart { width: 100%; height: 320px; }
.sd-foot { text-align: center; padding: 16px; }

/* AI 六维深度分析 */
.sd-an { margin-top: 16px; border-top: 1px solid var(--line); padding-top: 14px; }
.sd-an-head { display: flex; align-items: center; justify-content: space-between; }
.sd-an-title { font-size: 15px; font-weight: 700; letter-spacing: -0.2px; }
.sd-an-loading {
  display: flex; align-items: center; gap: 8px;
  padding: 20px 4px; color: var(--ink-2); font-size: 13px; justify-content: center;
}
.sd-an-empty { text-align: center; padding: 14px 4px 4px; }
.sd-an-oneliner {
  font-size: 15px; font-weight: 700; color: var(--ink);
  margin: 12px 0; line-height: 1.5; letter-spacing: -0.2px;
}
.sd-cat {
  background: var(--bg); border-radius: var(--radius-sm);
  padding: 10px 12px; margin-bottom: 14px;
}
.sd-cat-tags { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 8px; }
.sd-cat-item { display: flex; flex-direction: column; padding: 5px 0; }
.sd-cat-item + .sd-cat-item { border-top: 1px dashed var(--border); }
.sd-cat-meta { font-size: 11px; color: var(--ink-3); }
.sd-cat-text { font-size: 13px; color: var(--ink); line-height: 1.5; margin-top: 1px; }

.sd-dim { margin-bottom: 12px; }
.sd-dim-top { display: flex; align-items: center; gap: 6px; margin-bottom: 5px; }
.sd-dim-name { font-size: 13px; font-weight: 700; color: var(--ink); }
.sd-dim-badge {
  font-size: 10px; padding: 1px 6px; border-radius: 6px; font-weight: 600;
}
.sd-dim-badge.backed { background: var(--green-bg); color: var(--green-ink); }
.sd-dim-badge.infer { background: rgba(104, 107, 130, 0.12); color: var(--ink-3); }
.sd-dim-score { font-size: 12px; color: var(--ink-2); margin-left: auto; }
.sd-dim-bar {
  height: 5px; background: var(--line); border-radius: 3px; overflow: hidden;
}
.sd-dim-bar i { display: block; height: 100%; background: var(--primary); border-radius: 3px; }
.sd-dim-bar i.mid { background: var(--warn); }
.sd-dim-bar i.low { background: var(--ink-3); }
.sd-dim-text { font-size: 13px; color: var(--ink-2); line-height: 1.6; margin-top: 5px; }

.sd-risk {
  background: var(--down-bg); border-radius: var(--radius-sm);
  padding: 10px 12px; margin: 8px 0; font-size: 13px; color: #b42318; line-height: 1.6;
}
.sd-risk-label { font-weight: 800; margin-right: 6px; }
.sd-disclaimer { font-size: 11px; color: var(--ink-3); margin-top: 10px; line-height: 1.5; }

/* ── 新功能通用 ── */
.loading-spin { text-align: center; padding: 40px 0; color: var(--ink-3); font-size: 14px; }
.empty-hint { text-align: center; padding: 60px 0; color: var(--ink-3); font-size: 14px; }
.btn-icon { background: none; border: 1px solid var(--border); border-radius: 8px; padding: 6px 10px; cursor: pointer; display: flex; align-items: center; }
.btn-icon:disabled { opacity: 0.4; }
.total-badge { font-size: 12px; color: var(--ink-3); margin-left: 8px; }
.search-input { width: 100%; box-sizing: border-box; border: 1px solid var(--border); border-radius: 10px; padding: 8px 12px; font-size: 14px; background: var(--card); color: var(--ink); outline: none; margin-bottom: 8px; }
.sort-row { display: flex; gap: 6px; margin-bottom: 8px; }
.sort-btn { padding: 4px 10px; border-radius: 20px; border: 1px solid var(--border); background: var(--card); font-size: 12px; cursor: pointer; color: var(--ink-2); }
.sort-btn.active { background: var(--primary-soft); color: var(--primary); border-color: var(--primary); }

/* ── 题材中心 ── */
.themes-layout { display: flex; gap: 12px; min-height: 70vh; }
.themes-sidebar { width: 160px; flex-shrink: 0; }
.themes-detail { flex: 1; min-width: 0; }
/* 桌面显示两列，手机显示单列 */
.themes-desktop { display: flex; }
.themes-mobile { display: none; }
@media (max-width: 600px) {
  .themes-desktop { display: none !important; }
  .themes-mobile { display: block; }
  .auction-actions { flex-wrap: wrap; justify-content: flex-end; }
  .auction-note { align-items: flex-start; flex-wrap: wrap; }
  .auction-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .record-stock { grid-template-columns: minmax(0, 1fr) auto; }
  .record-stock-price { display: none; }
}
.mobile-toolbar { margin-bottom: 8px; }
.mobile-detail-head { padding: 10px 0; border-bottom: 1px solid var(--line); margin-bottom: 12px; flex-wrap: wrap; gap: 8px; }
.back-btn { background: none; border: 1px solid var(--border); border-radius: 8px; padding: 4px 10px; font-size: 13px; cursor: pointer; color: var(--primary); flex-shrink: 0; }
.board-list { overflow-y: auto; max-height: 70vh; }
.board-item { padding: 8px 10px; border-radius: 10px; cursor: pointer; margin-bottom: 4px; border: 1px solid transparent; }
.board-item:hover { background: var(--bg); }
.board-item.active { background: var(--primary-soft); border-color: var(--primary); }
.board-item-main { display: flex; justify-content: space-between; align-items: center; }
.board-name { font-size: 12px; font-weight: 500; color: var(--ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 90px; }
.board-pct { font-size: 12px; font-weight: 600; }
.board-pct.up { color: var(--up); }
.board-pct.down { color: var(--down); }
.board-item-sub { display: flex; align-items: center; gap: 4px; margin-top: 3px; font-size: 11px; color: var(--ink-3); }
.limit-badge { background: var(--up-bg); color: var(--up); border-radius: 4px; padding: 0 4px; font-size: 10px; }
.up-down-bar { flex: 1; height: 3px; background: var(--down-bg); border-radius: 2px; overflow: hidden; }
.up-bar { height: 100%; background: var(--up); border-radius: 2px; }
.detail-head { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; }
.detail-name { font-size: 16px; font-weight: 700; }
.detail-pct { font-size: 15px; font-weight: 700; }
.detail-pct.up { color: var(--up); }
.detail-pct.down { color: var(--down); }
.stock-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(80px, 1fr)); gap: 6px; }
.stock-cell { background: var(--card); border-radius: 8px; padding: 6px 8px; cursor: pointer; border: 1px solid var(--border); text-align: center; }
.stock-cell:active { opacity: 0.7; }
.stock-cell.up { border-color: var(--up); background: var(--up-bg); }
.stock-cell.down { border-color: var(--down-bg); }
.stock-cell.limit_up { border-color: var(--up); background: var(--up); }
.stock-cell.limit_up .cell-name, .stock-cell.limit_up .cell-pct { color: #fff; }
.cell-name { font-size: 11px; font-weight: 500; color: var(--ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cell-pct { font-size: 11px; font-weight: 600; margin-top: 2px; }
.cell-pct.up { color: var(--up); }
.cell-pct.down { color: var(--down); }

/* ── 涨停筛选 ── */
.filter-chips { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 12px; }
.filter-table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.filter-table { width: 100%; border-collapse: collapse; font-size: 12px; white-space: nowrap; }
.filter-table th { background: var(--bg); padding: 8px 10px; text-align: left; font-weight: 600; color: var(--ink-2); border-bottom: 1px solid var(--border); position: sticky; top: 0; }
.filter-table th.sortable { cursor: pointer; user-select: none; }
.filter-table th.sortable:hover { color: var(--primary); }
.filter-table td { padding: 8px 10px; border-bottom: 1px solid var(--line); vertical-align: middle; }
.filter-table tr.clickable-row { cursor: pointer; }
.filter-table tr.clickable-row:hover td { background: var(--bg); }
.stock-name-cell { font-weight: 600; font-size: 13px; color: var(--ink); }
.stock-code-cell { font-size: 11px; color: var(--ink-3); margin-top: 1px; }
.continuous-badge { display: inline-block; padding: 2px 6px; border-radius: 6px; font-size: 11px; font-weight: 700; background: var(--up-bg); color: var(--up); }
.continuous-badge.c1 { background: var(--bg); color: var(--ink-3); }
.continuous-badge.c2 { background: #fff3e0; color: #e65100; }
.continuous-badge.c3 { background: #fce4ec; color: #c62828; }
.continuous-badge.c4, .continuous-badge.c5, .continuous-badge.c6, .continuous-badge.c7, .continuous-badge.c8, .continuous-badge.c9 { background: var(--up-bg); color: var(--up); }
.mono { font-family: monospace; }
.industry-tag { background: var(--primary-soft); color: var(--primary); border-radius: 4px; padding: 1px 5px; font-size: 10px; margin-right: 4px; }
.reason-cell { max-width: 140px; }
.reason-text { font-size: 11px; color: var(--ink-2); }

/* ── 板块轮动 ── */
.type-tabs { display: flex; gap: 8px; margin-bottom: 10px; }
.type-tab { padding: 6px 16px; border-radius: 20px; border: 1px solid var(--border); background: var(--card); font-size: 13px; cursor: pointer; }
.type-tab.active { background: var(--primary); color: #fff; border-color: var(--primary); }
.summary-row { font-size: 12px; color: var(--ink-2); display: flex; gap: 10px; margin-bottom: 10px; }
.summary-row .up { color: var(--up); font-weight: 600; }
.summary-row .down { color: var(--down); font-weight: 600; }
.summary-row .muted { color: var(--ink-3); }
.chart-wrap { background: var(--card); border-radius: var(--radius); padding: 8px; margin-bottom: 10px; }
.legend-row { font-size: 11px; color: var(--ink-2); display: flex; align-items: center; gap: 4px; margin-bottom: 12px; padding: 0 4px; }
.dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; }
.dot.up { background: var(--up); }
.dot.down { background: var(--down); }
.sector-section { margin-bottom: 16px; }
.section-title { font-size: 13px; font-weight: 700; margin-bottom: 8px; padding: 4px 0; border-left: 3px solid var(--primary); padding-left: 8px; }
.strong-title { border-left-color: var(--up); }
.weak-title { border-left-color: #f59e0b; }
.sector-table { width: 100%; border-collapse: collapse; font-size: 12px; }
.sector-table th { background: var(--bg); padding: 6px 8px; text-align: right; font-weight: 600; color: var(--ink-2); border-bottom: 1px solid var(--border); }
.sector-table th:first-child { text-align: left; }
.sector-table td { padding: 7px 8px; border-bottom: 1px solid var(--line); text-align: right; }
.sector-table td:first-child { text-align: left; font-weight: 500; max-width: 100px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ── 可视化分析 ── */
.visual-tabs { display: flex; gap: 8px; margin-bottom: 12px; border-bottom: 1px solid var(--border); }
.v-tab { padding: 8px 16px; border: none; background: none; font-size: 13px; cursor: pointer; color: var(--ink-2); border-bottom: 2px solid transparent; margin-bottom: -1px; }
.v-tab.active { color: var(--primary); border-bottom-color: var(--primary); font-weight: 600; }
.days-picker { display: flex; gap: 4px; margin-left: auto; }
.day-btn { padding: 4px 10px; border-radius: 16px; border: 1px solid var(--border); background: var(--card); font-size: 11px; cursor: pointer; color: var(--ink-2); }
.day-btn.active { background: var(--primary-soft); color: var(--primary); border-color: var(--primary); }
.chart-title { font-size: 13px; font-weight: 600; color: var(--ink-2); margin-bottom: 6px; }

/* ── 异动中心 ── */
.anomaly-tabs { display: flex; gap: 8px; margin-bottom: 14px; }
.a-tab { flex: 1; padding: 8px; border-radius: 10px; border: 1px solid var(--border); background: var(--card); font-size: 13px; cursor: pointer; color: var(--ink-2); text-align: center; }
.a-tab.active { background: var(--primary-soft); color: var(--primary); border-color: var(--primary); font-weight: 600; }
.count-badge { display: inline-block; background: var(--primary-subtle); color: var(--primary); border-radius: 10px; padding: 0 6px; font-size: 11px; margin-left: 4px; }
.anomaly-card { background: var(--card); border-radius: var(--radius-sm); padding: 12px 14px; margin-bottom: 10px; border: 1px solid var(--border); cursor: pointer; }
.anomaly-card:active { opacity: 0.8; }
.anomaly-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 6px; }
.anomaly-info { display: flex; align-items: center; gap: 6px; }
.anomaly-info .stock-name { font-weight: 700; font-size: 14px; }
.anomaly-info .stock-code { font-size: 11px; color: var(--ink-3); }
.deviation-badge { background: var(--up-bg); color: var(--up); border-radius: 8px; padding: 3px 10px; font-size: 13px; font-weight: 700; }
.anomaly-trigger { font-size: 12px; color: var(--up); font-weight: 600; margin-bottom: 4px; }
.anomaly-rule { font-size: 11px; color: var(--ink-3); margin-bottom: 6px; line-height: 1.5; }
.anomaly-meta { display: flex; gap: 6px; flex-wrap: wrap; }
.status-tag { background: var(--primary-soft); color: var(--primary); border-radius: 4px; padding: 2px 6px; font-size: 11px; }
.continuous-tag { background: var(--up-bg); color: var(--up); border-radius: 4px; padding: 2px 6px; font-size: 11px; }
.open-tag { background: #fff3e0; color: #e65100; border-radius: 4px; padding: 2px 6px; font-size: 11px; }

/* ── 公开市场复盘 ── */
.review-metrics {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px; margin-bottom: 16px;
}
.review-metric {
  background: var(--card); border: 1px solid var(--line);
  border-radius: 8px; padding: 10px 12px;
  box-shadow: var(--shadow-micro);
}
.review-metric span {
  display: block; color: var(--ink-3); font-size: 12px; margin-bottom: 2px;
}
.review-metric b {
  display: block; font-size: 22px; font-weight: 800; line-height: 1.15;
}
.review-section { margin-bottom: 18px; }
.review-row {
  display: flex; align-items: center; justify-content: space-between;
  gap: 10px; min-width: 0;
  background: var(--card); border: 1px solid var(--line);
  border-radius: 8px; padding: 10px 12px; margin-bottom: 8px;
  box-shadow: var(--shadow-micro);
}
.review-row.clickable { cursor: pointer; transition: transform .12s, border-color .12s; }
.review-row.clickable:active { transform: scale(0.99); }
.review-row.clickable:hover { border-color: #e2d8fb; }
.review-row > div:first-child {
  min-width: 0; display: flex; flex-direction: column; gap: 2px;
}
.review-row b {
  font-size: 14px; font-weight: 700; color: var(--ink);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.review-row span {
  font-size: 12px; color: var(--ink-2);
  overflow-wrap: anywhere;
}
.review-row > .pct,
.review-row > .num { flex-shrink: 0; }
.review-row-side {
  flex-shrink: 0; display: flex; flex-direction: column;
  align-items: flex-end; gap: 4px;
}
.review-data-notice {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin: 14px 0;
  padding: 10px 12px;
  border-left: 3px solid #f59e0b;
  background: #fff8e8;
  color: #7a4a00;
  font-size: 13px;
  line-height: 1.5;
}

.review-data-notice b {
  flex: 0 0 auto;
  color: #5e3900;
}