/* ============================================================
   Watchpilot · hero-panels.css
   Hero 反查区 + 5 面板 grid + AI Thinking Panel + 连板天梯
   (原 main.css 行 3511-6206)
   ============================================================ */

  /* ─── Hero 反查区 ─── */
  .fund-hero {
    padding: 32px 32px 22px 32px;
    border-bottom: 1px solid var(--border-subtle);
    background: var(--bg-main);
  }
  .fund-hero-title {
    font-size: 22px;
    color: var(--text-1);
    line-height: 1.3;
    letter-spacing: -0.4px;
    margin: 0 0 6px 0;
    font-weight: 700;
  }
  .fund-hero-title em {
    font-style: normal;
    font-weight: inherit;
  }
  .fund-hero-sub {
    font-size: 12px;
    color: var(--text-3);
    margin-bottom: 18px;
    line-height: 1.5;
  }
  .fund-search-row {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 14px;
    flex-wrap: wrap;
  }
  .fund-search-input {
    flex: 1;
    min-width: 320px;
    max-width: 480px;
    height: 40px;
    padding: 0 16px;
    border: 1px solid var(--border-strong);
    border-radius: 4px;
    background: var(--bg-card);
    font-size: 14px;
    color: var(--text-1);
    font-family: var(--font-sans);
    transition: border-color 0.12s;
    outline: none;
  }
  .fund-search-input:focus { border-color: var(--accent); }
  .fund-search-input::placeholder { color: var(--text-4); }
  /* 搜索建议下拉 (代码/名称, 复用 /udf/search 全市场索引) */
  .fund-search-box {
    position: relative;
    flex: 1;
    min-width: 320px;
    max-width: 480px;
  }
  .fund-search-box .fund-search-input {
    width: 100%;
    flex: none;
    min-width: 0;
    max-width: none;
  }
  .fund-search-drop {
    position: absolute;
    top: calc(100% + 4px);
    left: 0;
    right: 0;
    z-index: 50;
    background: var(--bg-card);
    border: 1px solid var(--border-strong);
    border-radius: 4px;
    box-shadow: 0 8px 24px rgba(28, 25, 23, 0.12);
    max-height: 320px;
    overflow-y: auto;
  }
  .fund-search-drop.hidden { display: none; }
  .fsd-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 10px;
    padding: 9px 12px;
    cursor: pointer;
    border-bottom: 1px solid var(--border-soft);
  }
  .fsd-row:last-child { border-bottom: none; }
  .fsd-row:hover, .fsd-row.active { background: var(--bg-subtle); }
  .fsd-name {
    font-size: 13px;
    color: var(--text-1);
    font-weight: 500;
  }
  .fsd-meta {
    font-size: 11px;
    color: var(--text-3);
    font-family: var(--font-mono);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
  }
  .fsd-empty {
    padding: 14px 12px;
    font-size: 12px;
    color: var(--text-3);
    text-align: center;
  }
  .fund-recent-label {
    font-size: 11px;
    color: var(--text-3);
    letter-spacing: 0.3px;
  }
  .fund-recent-chip {
    font-size: 12px;
    color: var(--text-2);
    background: var(--bg-subtle);
    border: 1px solid var(--border-subtle);
    padding: 5px 11px;
    border-radius: 3px;
    cursor: pointer;
    transition: all 0.12s;
    user-select: none;
    font-family: var(--font-mono);
  }
  .fund-recent-chip:hover {
    color: var(--text-1);
    border-color: var(--accent);
  }
  .fund-search-btn {
    height: 40px;
    padding: 0 22px;
    background: var(--accent);
    color: white;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-size: 13px;
    font-weight: 600;
    font-family: var(--font-sans);
    letter-spacing: 0.5px;
    transition: opacity 0.12s;
  }
  .fund-search-btn:hover { opacity: 0.88; }
  .fund-hero-meta {
    display: flex;
    align-items: center;
    gap: 22px;
    flex-wrap: wrap;
    padding-top: 14px;
    border-top: 1px solid var(--border-soft);
  }
  .fhm-cell {
    display: flex;
    flex-direction: column;
    gap: 2px;
  }
  .fhm-label {
    font-size: 10px;
    color: var(--text-3);
    text-transform: uppercase;
    letter-spacing: 1px;
    font-weight: 600;
  }
  .fhm-value {
    font-family: var(--font-mono);
    font-size: 16px;
    font-weight: 700;
    color: var(--text-1);
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.3px;
    line-height: 1.2;
  }
  .fhm-value.up { color: var(--up); }
  .fhm-value.down { color: var(--down); }
  .fhm-divider {
    width: 1px;
    height: 26px;
    background: var(--border-subtle);
  }
  .fhm-signals {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-left: auto;
    flex-wrap: wrap;
  }
  .fhm-signal {
    font-size: 11px;
    padding: 3px 9px;
    border-radius: 3px;
    font-weight: 600;
    line-height: 1.4;
    font-family: var(--font-sans);
    letter-spacing: 0.2px;
  }
  .fhm-signal.up { background: var(--up-soft); color: var(--up); }
  .fhm-signal.down { background: var(--down-soft); color: var(--down); }
  .fhm-signal.institution { background: rgba(124, 111, 90, 0.10); color: #7c6f5a; }
  
  /* ─── 5 面板 grid ─── */
  .fund-dashboard {
    padding: 18px 32px 60px 32px;
    display: grid;
    grid-template-columns: 1.35fr 1fr;
    grid-template-rows: auto auto auto;
    gap: 14px;
  }
  @media (max-width: 1100px) {
    .fund-dashboard { grid-template-columns: 1fr; }
  }
  .fund-panel-01 { grid-column: 1; grid-row: 1; }
  .fund-panel-02 { grid-column: 2; grid-row: 1; }
  .fund-panel-03 { grid-column: 1 / -1; grid-row: 2; }
  .fund-panel-04 { grid-column: 1; grid-row: 3; }
  .fund-panel-05 { grid-column: 2; grid-row: 3; }
  @media (max-width: 1100px) {
    .fund-panel-01, .fund-panel-02, .fund-panel-03,
    .fund-panel-04, .fund-panel-05 {
      grid-column: 1;
      grid-row: auto;
    }
  }
  
  .fund-panel {
    background: var(--bg-card);
    border: 1px solid var(--border-subtle);
    display: flex;
    flex-direction: column;
    overflow: hidden;
  }
  .fp-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 16px 10px 16px;
    border-bottom: 1px solid var(--border-subtle);
    gap: 12px;
  }
  .fp-num {
    font-family: var(--font-mono);
    font-size: 10px;
    color: var(--text-4);
    font-weight: 700;
    letter-spacing: 1.5px;
    background: var(--bg-subtle);
    padding: 2px 6px;
    border-radius: 3px;
    margin-right: 8px;
  }
  .fp-title {
    font-size: 13px;
    font-weight: 600;
    color: var(--text-1);
    letter-spacing: -0.1px;
    display: flex;
    align-items: center;
    flex: 1;
    min-width: 0;
  }
  .fp-title em {
    font-style: normal;
    margin: 0;
  }
  /* 仅面板 01 标题里的动态股票名用强调色; 02-05 的静态关键词不强调 */
  .fund-panel-01 .fp-title em { color: var(--important); }
  .fp-mini-tabs {
    display: flex;
    gap: 2px;
  }
  .fp-mini-tab {
    font-size: 11px;
    color: var(--text-3);
    padding: 4px 9px;
    border-radius: 3px;
    cursor: pointer;
    user-select: none;
    transition: all 0.12s;
    background: transparent;
    border: none;
    font-family: var(--font-sans);
  }
  .fp-mini-tab:hover { color: var(--text-1); }
  .fp-mini-tab.active {
    background: var(--accent);
    color: white;
  }
  .fp-body { flex: 1; overflow: hidden; }
  .fp-foot {
    padding: 8px 16px;
    border-top: 1px solid var(--border-subtle);
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 11px;
    color: var(--text-3);
    background: var(--bg-subtle);
  }
  .fp-foot a {
    color: var(--accent);
    text-decoration: none;
    cursor: pointer;
    font-weight: 500;
  }
  .fp-foot a:hover { opacity: 0.7; }
  
  /* 面板 01 表格 */
  .fund01-table, .fund03-table, .fund04-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 12px;
    table-layout: fixed;
  }
  .fund01-table thead th, .fund03-table thead th, .fund04-table thead th {
    text-align: left;
    padding: 9px 8px;
    font-size: 10px;
    font-weight: 600;
    color: var(--text-3);
    letter-spacing: 0.06em;
    text-transform: uppercase;
    border-bottom: 1.5px solid var(--border-strong);
    user-select: none;
    white-space: nowrap;
  }
  .fund01-table thead th.num, .fund03-table thead th.num, .fund04-table thead th.num { text-align: right; }
  .fund01-table tbody tr, .fund03-table tbody tr, .fund04-table tbody tr {
    border-bottom: 1px solid var(--border-subtle);
    cursor: pointer;
    transition: background 0.08s;
  }
  .fund01-table tbody tr:hover, .fund03-table tbody tr:hover, .fund04-table tbody tr:hover { background: var(--bg-subtle); }
  .fund01-table tbody td, .fund03-table tbody td, .fund04-table tbody td {
    padding: 9px 8px;
    color: var(--text-1);
    vertical-align: middle;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 12px;
  }
  .fund01-table tbody td.num, .fund03-table tbody td.num, .fund04-table tbody td.num {
    font-family: var(--font-mono);
    font-variant-numeric: tabular-nums;
    text-align: right;
    font-weight: 500;
    letter-spacing: -0.2px;
  }
  .ft-fund-name {
    font-weight: 600;
    font-size: 12px;
    color: var(--text-1);
    line-height: 1.3;
  }
  .ft-fund-code {
    font-family: var(--font-mono);
    font-size: 10px;
    color: var(--text-3);
    margin-top: 2px;
    font-variant-numeric: tabular-nums;
  }
  .ft-manager {
    font-size: 11px;
    color: var(--text-1);
    font-weight: 500;
    line-height: 1.3;
  }
  .ft-manager-meta {
    font-size: 10px;
    color: var(--text-3);
    margin-top: 1px;
  }
  .ft-rank-chip {
    display: inline-block;
    font-family: var(--font-mono);
    font-size: 10px;
    color: var(--text-2);
    background: var(--bg-subtle);
    border: 1px solid var(--border-subtle);
    padding: 1px 5px;
    border-radius: 3px;
    margin-left: 4px;
    font-variant-numeric: tabular-nums;
    font-weight: 500;
  }
  
  /* 信号胶囊 */
  .ft-signal {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    font-size: 10px;
    padding: 2px 7px;
    border-radius: 3px;
    font-weight: 600;
    line-height: 1.4;
    font-family: var(--font-sans);
    letter-spacing: 0.2px;
    white-space: nowrap;
  }
  .ft-signal.add { background: var(--up-soft); color: var(--up); }
  .ft-signal.reduce { background: var(--down-soft); color: var(--down); }
  .ft-signal.new { background: var(--accent); color: white; }
  .ft-signal.flat {
    background: var(--bg-subtle);
    color: var(--text-3);
    border: 1px solid var(--border-subtle);
  }
  
  /* 面板 02 机构分层 */
  .fund02-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1px;
    background: var(--border-subtle);
    border-bottom: 1px solid var(--border-subtle);
  }
  .fund02-cell {
    background: var(--bg-card);
    padding: 12px 14px;
    cursor: pointer;
    transition: background 0.1s;
  }
  .fund02-cell:hover { background: var(--bg-subtle); }
  .f2c-label {
    font-size: 10px;
    color: var(--text-3);
    text-transform: uppercase;
    letter-spacing: 0.8px;
    font-weight: 600;
    margin-bottom: 4px;
  }
  .f2c-value {
    font-family: var(--font-mono);
    font-size: 18px;
    font-weight: 700;
    color: var(--text-1);
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.5px;
    line-height: 1.15;
    margin-bottom: 3px;
  }
  .f2c-change {
    font-family: var(--font-mono);
    font-size: 11px;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
  }
  .f2c-change.up { color: var(--up); }
  .f2c-change.down { color: var(--down); }
  .f2-distribution {
    padding: 12px 16px;
    border-bottom: 1px solid var(--border-subtle);
  }
  .f2-dist-label {
    font-size: 10px;
    color: var(--text-3);
    text-transform: uppercase;
    letter-spacing: 0.8px;
    font-weight: 600;
    margin-bottom: 7px;
  }
  .f2-dist-bar {
    display: flex;
    height: 8px;
    border-radius: 3px;
    overflow: hidden;
    margin-bottom: 8px;
  }
  .f2-dist-seg-1 { background: var(--accent); }
  .f2-dist-seg-2 { background: #7c6f5a; }
  .f2-dist-seg-3 { background: var(--text-3); }
  .f2-dist-seg-4 { background: var(--text-4); }
  .f2-dist-legend {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 4px 12px;
    font-size: 11px;
    color: var(--text-2);
  }
  .f2-dist-legend-item {
    display: flex;
    align-items: center;
    gap: 6px;
  }
  .f2-dist-dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
  }
  .f2-dist-dot.d1 { background: var(--accent); }
  .f2-dist-dot.d2 { background: #7c6f5a; }
  .f2-dist-dot.d3 { background: var(--text-3); }
  .f2-dist-dot.d4 { background: var(--text-4); }
  .f2-dist-pct {
    font-family: var(--font-mono);
    font-weight: 600;
    color: var(--text-1);
    font-variant-numeric: tabular-nums;
    margin-left: auto;
    font-size: 11px;
  }
  .f2-changes { padding: 4px 0; }
  .f2-change-row {
    display: grid;
    grid-template-columns: 1fr auto auto;
    gap: 10px;
    padding: 7px 16px;
    align-items: center;
    cursor: pointer;
    transition: background 0.08s;
    border-bottom: 1px dashed var(--border-subtle);
  }
  .f2-change-row:last-child { border-bottom: none; }
  .f2-change-row:hover { background: var(--bg-subtle); }
  .f2-change-inst {
    font-size: 11px;
    color: var(--text-1);
    font-weight: 500;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .f2-change-meta {
    font-size: 10px;
    color: var(--text-3);
    font-family: var(--font-mono);
    margin-top: 1px;
  }
  .f2-change-shares {
    font-family: var(--font-mono);
    font-size: 11px;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    text-align: right;
  }
  .f2-change-tag {
    font-size: 10px;
    padding: 1px 6px;
    border-radius: 3px;
    font-weight: 600;
    background: var(--bg-subtle);
    color: var(--text-2);
    border: 1px solid var(--border-subtle);
    white-space: nowrap;
  }
  
  /* 主力散户分层 bar(独家)*/
  .ft-flowbar {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 2px 0;
  }
  .ft-flowbar-bar {
    display: flex;
    width: 130px;
    height: 6px;
    background: var(--bg-subtle);
    border-radius: 3px;
    overflow: hidden;
  }
  .ft-flowbar-main { height: 100%; background: var(--up); }
  .ft-flowbar-main.down { background: var(--down); }
  .ft-flowbar-retail { height: 100%; background: var(--text-3); opacity: 0.55; }
  .ft-flowbar-meta {
    display: flex;
    gap: 12px;
    font-family: var(--font-mono);
    font-size: 10px;
    font-variant-numeric: tabular-nums;
    color: var(--text-3);
    letter-spacing: -0.2px;
  }
  .ft-flowbar-meta span strong {
    color: var(--text-1);
    font-weight: 600;
  }
  .ft-prem {
    display: inline-block;
    font-size: 10px;
    padding: 1px 6px;
    border-radius: 3px;
    font-weight: 600;
    font-family: var(--font-mono);
    font-variant-numeric: tabular-nums;
  }
  .ft-prem.up { background: var(--up-soft); color: var(--up); }
  .ft-prem.down { background: var(--down-soft); color: var(--down); }
  .ft-prem.flat { background: var(--bg-subtle); color: var(--text-3); }
  
  /* sub-tab + 异常计数 */
  .fund03-subtabs {
    display: flex;
    align-items: center;
    gap: 0;
    padding: 0 16px;
    border-bottom: 1px solid var(--border-subtle);
    background: var(--bg-subtle);
  }
  .fund03-subtab {
    font-size: 11px;
    color: var(--text-3);
    padding: 9px 12px;
    cursor: pointer;
    user-select: none;
    transition: all 0.12s;
    border-bottom: 2px solid transparent;
    margin-bottom: -1px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-family: var(--font-sans);
    font-weight: 500;
  }
  .fund03-subtab:hover { color: var(--text-1); }
  .fund03-subtab.active {
    color: var(--text-1);
    border-bottom-color: var(--accent);
    font-weight: 600;
  }
  .fund03-subtab-count {
    font-family: var(--font-mono);
    font-size: 10px;
    background: var(--bg-card);
    color: var(--text-3);
    padding: 1px 5px;
    border-radius: 3px;
    border: 1px solid var(--border-subtle);
    font-weight: 600;
  }
  .fund03-subtab.active .fund03-subtab-count {
    background: var(--accent);
    color: white;
    border-color: var(--accent);
  }
  .fund03-anomaly {
    margin-left: auto;
    font-size: 11px;
    color: var(--up);
    cursor: pointer;
    background: var(--up-soft);
    padding: 4px 10px;
    border-radius: 3px;
    font-weight: 600;
    transition: opacity 0.12s;
  }
  .fund03-anomaly:hover { opacity: 0.8; }
  
  /* 可转债 */
  .ft-cb-name {
    font-weight: 600;
    font-size: 12px;
    color: var(--text-1);
    line-height: 1.3;
  }
  .ft-cb-code {
    font-family: var(--font-mono);
    font-size: 10px;
    color: var(--text-3);
    margin-top: 1px;
  }
  .ft-prem-grade {
    display: inline-block;
    font-size: 10px;
    padding: 1px 6px;
    border-radius: 3px;
    font-weight: 600;
    margin-left: 5px;
  }
  .ft-prem-grade.low { background: var(--down-soft); color: var(--down); }
  .ft-prem-grade.mid { background: var(--bg-subtle); color: var(--text-3); }
  .ft-prem-grade.high { background: var(--up-soft); color: var(--up); }
  
  /* 面板 05 REITs */
  .fund05-list {
    display: flex;
    flex-direction: column;
  }
  .fund05-row {
    display: grid;
    grid-template-columns: 1.5fr 70px 60px 70px;
    gap: 10px;
    padding: 11px 16px;
    align-items: center;
    border-bottom: 1px solid var(--border-subtle);
    cursor: pointer;
    transition: background 0.08s;
  }
  .fund05-row:last-child { border-bottom: none; }
  .fund05-row:hover { background: var(--bg-subtle); }
  .ft-reit-info {
    overflow: hidden;
    min-width: 0;
  }
  .ft-reit-name {
    font-size: 12px;
    font-weight: 600;
    color: var(--text-1);
    line-height: 1.3;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .ft-reit-tag {
    display: inline-block;
    font-size: 10px;
    padding: 1px 6px;
    border-radius: 3px;
    background: rgba(124, 111, 90, 0.10);
    color: #7c6f5a;
    font-weight: 600;
    margin-left: 6px;
    vertical-align: middle;
  }
  .ft-reit-meta {
    font-size: 10px;
    color: var(--text-3);
    margin-top: 1px;
    font-family: var(--font-mono);
  }
  .ft-reit-yield {
    font-family: var(--font-mono);
    font-size: 13px;
    font-weight: 700;
    color: var(--text-1);
    font-variant-numeric: tabular-nums;
    text-align: right;
    letter-spacing: -0.3px;
  }
  .ft-reit-spark {
    width: 60px;
    height: 22px;
    display: block;
  }
  .ft-reit-change {
    font-family: var(--font-mono);
    font-size: 11px;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    text-align: right;
    letter-spacing: -0.2px;
  }
  .ft-reit-change.up { color: var(--up); }
  .ft-reit-change.down { color: var(--down); }
  
  /* Footer */
  .fund-footer {
    padding: 20px 32px 28px 32px;
    text-align: center;
    border-top: 1px solid var(--border-subtle);
    background: var(--bg-main);
  }
  .fund-footer-brand {
    font-family: var(--font-sans);
    font-weight: 600;
    font-size: 14px;
    color: var(--text-2);
    margin-bottom: 6px;
    letter-spacing: -0.2px;
  }
  .fund-footer-meta {
    font-size: 11px;
    color: var(--text-3);
    line-height: 1.6;
  }
  
  /* 顶部摘要条 */
  .data-summary-bar {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    background: var(--bg-card);
    border: 1px solid var(--border-subtle);
    margin-bottom: 16px;
  }
  .summary-cell {
    padding: 14px 18px;
    border-right: 1px solid var(--border-subtle);
    display: flex;
    flex-direction: column;
    gap: 4px;
  }
  .summary-cell:last-child { border-right: none; }
  .summary-label {
    font-size: 11px;
    color: var(--text-3);
    text-transform: uppercase;
    letter-spacing: 1px;
    font-weight: 700;
  }
  .summary-value {
    font-family: var(--font-mono);
    font-size: 22px;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.5px;
    line-height: 1.1;
    color: var(--text-1);
  }
  .summary-meta {
    font-size: 11px;
    color: var(--text-3);
    font-family: var(--font-mono);
    font-variant-numeric: tabular-nums;
  }
  
  /* 指数迷你图条 */
  .data-indices-row {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 16px;
  }
  .idx-mini-card {
    background: var(--bg-card);
    border: 1px solid var(--border-subtle);
    padding: 12px 14px;
    cursor: pointer;
    transition: border-color 0.12s;
  }
  .idx-mini-card:hover { border-color: var(--border-strong); }
  .idx-mini-head {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    margin-bottom: 6px;
  }
  .idx-mini-name {
    font-size: 13px;
    color: var(--text-1);
    font-weight: 600;
  }
  .idx-mini-pct {
    font-family: var(--font-mono);
    font-size: 13px;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
  }
  .idx-mini-value {
    font-family: var(--font-mono);
    font-size: 16px;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.4px;
    margin-bottom: 4px;
  }
  .idx-mini-spark {
    width: 100%;
    height: 26px;
    display: block;
  }
  
  /* 面包屑 */
  .page-breadcrumb {
    display: flex;
    align-items: baseline;
    margin-bottom: 12px;
    gap: 8px;
  }
  .bc-section {
    color: var(--text-3);
    font-size: 12px;
    font-weight: 500;
  }
  .bc-divider {
    color: var(--text-4);
    font-size: 12px;
  }
  .bc-current {
    color: var(--text-1);
    font-size: 16px;
    font-weight: 600;
    letter-spacing: -0.2px;
  }
  
  /* 视图控件(时间筛选 + 密度切换) */
  .data-view-controls {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 12px;
    gap: 16px;
    flex-wrap: wrap;
  }
  .data-time-filter {
    display: flex;
    align-items: center;
    gap: 4px;
  }
  .data-time-filter .label {
    font-size: 12px;
    color: var(--text-3);
    margin-right: 4px;
  }
  .data-time-chip {
    font-size: 13px;
    height: 24px;
    padding: 0 11px;
    color: var(--text-2);
    cursor: pointer;
    border-radius: 4px;
    background: transparent;
    border: none;
    font-family: var(--font-sans);
    transition: all 0.12s;
    user-select: none;
    display: inline-flex;
    align-items: center;
  }
  .data-time-chip:hover { background: var(--bg-hover); color: var(--text-1); }
  .data-time-chip.active {
    background: var(--accent);
    color: white;
  }
  .density-switcher {
    display: inline-flex;
    border: 1px solid var(--border-subtle);
    border-radius: 4px;
    background: var(--bg-card);
  }
  .density-btn {
    width: 28px;
    height: 24px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: var(--text-3);
    border-right: 1px solid var(--border-subtle);
    font-size: 12px;
    user-select: none;
    transition: all 0.12s;
  }
  .density-btn:last-child { border-right: none; }
  .density-btn:hover { color: var(--text-1); }
  .density-btn.active {
    background: var(--accent);
    color: white;
  }
  
  /* 视图切换 */
  .data-view { display: none; }
  .data-view.active { display: block; }
  
  /* 70/30 主表 + 概念柱图 */
  .data-view-body {
    display: grid;
    grid-template-columns: 1fr 320px;
    gap: 16px;
    align-items: start;
    margin-bottom: 20px;
  }
  @media (max-width: 1400px) {
    .data-view-body { grid-template-columns: 1fr; }
    .concept-flow-aside { grid-row: 1; }
  }
  
  /* 个股资金流主表 */
  .flow-table-wrap {
    background: var(--bg-card);
    border: 1px solid var(--border-subtle);
    overflow: hidden;
  }
  .flow-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
    table-layout: fixed;
  }
  .flow-table thead th {
    text-align: left;
    padding: 11px 8px;
    font-size: 11px;
    font-weight: 500;
    color: var(--text-3);
    letter-spacing: 0.04em;
    border-bottom: 1.5px solid var(--border-strong);
    background: var(--bg-card);
    user-select: none;
    cursor: pointer;
    white-space: nowrap;
  }
  .flow-table thead th:hover { color: var(--text-1); }
  .flow-table thead th.num { text-align: right; }
  
  .flow-table tbody tr {
    border-bottom: 1px solid var(--border-subtle);
    cursor: pointer;
    transition: background 0.08s;
  }
  .flow-table tbody tr:hover { background: var(--bg-hover); }
  .flow-table tbody td {
    padding: 10px 8px;
    color: var(--text-1);
    vertical-align: middle;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .flow-table tbody td.num {
    font-family: var(--font-mono);
    font-variant-numeric: tabular-nums;
    text-align: right;
    font-size: 13px;
    font-weight: 500;
    letter-spacing: -0.2px;
  }
  .flow-table .ft-stock-name { font-weight: 600; font-size: 13px; }
  .flow-table .ft-code {
    font-family: var(--font-mono);
    font-size: 11px;
    color: var(--text-3);
    margin-top: 1px;
  }
  
  /* 密度切换 */
  .flow-table.density-compact tbody td { padding: 7px 8px; }
  .flow-table.density-comfortable tbody td { padding: 14px 8px; }
  
  /* 5 日趋势 mini chart */
  .ft-trend {
    display: inline-block;
    width: 50px;
    height: 16px;
    vertical-align: middle;
  }
  
  /* 净流入 inline 条形(横条+数字) */
  .ft-net-bar {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    justify-content: flex-end;
  }
  .ft-net-fill {
    height: 4px;
    background: var(--up);
    max-width: 56px;
    flex-shrink: 0;
  }
  .ft-net-fill.down { background: var(--down); }
  
  /* 概念资金双向柱图(侧栏) */
  .concept-flow-aside {
    background: var(--bg-card);
    border: 1px solid var(--border-subtle);
    padding: 14px 16px;
    align-self: start;
  }
  .concept-flow-head {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    margin-bottom: 12px;
    padding-bottom: 10px;
    border-bottom: 1px solid var(--border-subtle);
  }
  .concept-flow-title {
    font-size: 13px;
    font-weight: 600;
    color: var(--text-1);
  }
  .concept-flow-sub {
    font-size: 11px;
    color: var(--text-3);
    font-family: var(--font-mono);
  }
  .concept-bidir-list {
    display: flex;
    flex-direction: column;
    gap: 6px;
  }
  .concept-bidir-row {
    display: grid;
    grid-template-columns: 1fr 50% 1fr;
    align-items: center;
    height: 24px;
    font-size: 12px;
    cursor: pointer;
    transition: opacity 0.1s;
  }
  .concept-bidir-row:hover { opacity: 0.85; }
  .concept-bidir-name {
    color: var(--text-1);
    font-weight: 500;
    letter-spacing: -0.1px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .concept-bidir-bar-left {
    display: flex;
    justify-content: flex-end;
    padding-right: 4px;
  }
  .concept-bidir-bar-right {
    display: flex;
    justify-content: flex-start;
    padding-left: 4px;
  }
  .concept-bidir-fill {
    height: 12px;
    background: var(--up);
    transition: all 0.15s;
  }
  .concept-bidir-fill.down { background: var(--down); }
  .concept-bidir-value {
    font-family: var(--font-mono);
    font-variant-numeric: tabular-nums;
    font-size: 11px;
    font-weight: 600;
    text-align: left;
    padding-left: 6px;
  }
  .concept-bidir-value.up { color: var(--up); }
  .concept-bidir-value.down { color: var(--down); }
  .concept-bidir-axis {
    grid-column: 1 / 4;
    height: 1px;
    background: var(--border-strong);
    margin: 6px 0;
  }
  
  /* 折叠区(板块热力图) */
  .data-collapse {
    background: var(--bg-card);
    border: 1px solid var(--border-subtle);
    margin-bottom: 16px;
  }
  .data-collapse > summary {
    list-style: none;
    cursor: pointer;
    padding: 12px 18px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    user-select: none;
    font-size: 13px;
    font-weight: 600;
    color: var(--text-1);
  }
  .data-collapse > summary::-webkit-details-marker { display: none; }
  .data-collapse > summary::after {
    content: '▾';
    color: var(--text-3);
    font-size: 11px;
    transition: transform 0.15s;
  }
  .data-collapse[open] > summary::after { transform: rotate(180deg); }
  .data-collapse > summary:hover { background: var(--bg-hover); }
  .data-collapse-body {
    padding: 14px 18px 18px 18px;
    border-top: 1px solid var(--border-subtle);
  }
  
  /* 分页 */
  .data-pagination {
    background: var(--bg-card);
    border: 1px solid var(--border-subtle);
    padding: 11px 18px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 13px;
    color: var(--text-3);
    margin-bottom: 24px;
  }
  
  /* 占位空状态 */
  .data-empty {
    background: var(--bg-card);
    border: 1px solid var(--border-subtle);
    padding: 80px 24px;
    text-align: center;
    color: var(--text-3);
  }
  .data-empty-icon {
    width: 48px;
    height: 48px;
    margin: 0 auto 14px;
    border: 1px solid var(--border-strong);
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: var(--font-mono);
    font-size: 18px;
    color: var(--text-4);
  }
  .data-empty-title {
    font-size: 14px;
    color: var(--text-2);
    margin-bottom: 4px;
    font-weight: 500;
  }
  .data-empty-meta {
    font-size: 12px;
    color: var(--text-3);
  }
