/* ============================================================
 * 逻辑化筛选面板（官方标签 + 自由标签）
 * 设计：官方标签与自由标签平级，AND 交叉过滤，⊘ 排除（NOT），全不选=全部
 * 依赖变量：--surface-primary / --border / --apple-blue 等
 * ============================================================ */
.filter-panel {
  display: none;
  margin: 0 0 16px;
  border: 1px solid var(--border);
  border-radius: 14px;
  background: var(--surface-primary, #fff);
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.06);
  overflow: hidden;
}
.filter-panel .fp-head {
  display: flex; align-items: center; gap: 10px;
  padding: 10px 16px;
  background: linear-gradient(135deg, rgba(0, 122, 255, 0.06), rgba(52, 199, 89, 0.06));
  border-bottom: 1px solid var(--border);
}
.filter-panel .fp-title { font-size: 14px; font-weight: 700; color: var(--text-primary); white-space: nowrap; }
.filter-panel .fp-sub { font-size: 12px; color: var(--text-tertiary, #8a8a8e); flex: 1; }
.filter-panel .fp-close {
  border: none; background: transparent; cursor: pointer; font-size: 13px;
  color: var(--text-tertiary, #8a8a8e); padding: 2px 8px; border-radius: 6px;
}
.filter-panel .fp-close:hover { background: var(--bg-secondary, #f2f2f7); color: var(--text-primary); }

.filter-panel .fp-body {
  padding: 12px 16px;
  display: grid; grid-template-columns: 1fr 1fr; gap: 14px;
}
@media (max-width: 720px) { .filter-panel .fp-body { grid-template-columns: 1fr; } }

.filter-panel .fp-zone { min-width: 0; }
.filter-panel .fp-zone-title {
  font-size: 12px; font-weight: 700; color: var(--text-secondary);
  margin-bottom: 8px; display: flex; align-items: baseline; gap: 6px;
}
.filter-panel .fp-zone-title small { font-weight: 400; color: var(--text-tertiary, #8a8a8e); }

.filter-panel .fp-group { margin-bottom: 8px; }
.filter-panel .fp-group-title { font-size: 11px; color: var(--text-tertiary, #8a8a8e); margin-bottom: 4px; }
.filter-panel .fp-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.filter-panel .fp-chips-scroll { max-height: 100px; overflow-y: auto; }

.filter-panel .fp-chip {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 4px 10px; font-size: 12px; border-radius: 999px;
  background: var(--bg-secondary, #f2f2f7); color: var(--text-secondary);
  cursor: pointer; user-select: none; transition: all 0.15s;
  border: 1px solid transparent;
}
.filter-panel .fp-chip:hover { background: var(--bg-tertiary, #e5e5ea); color: var(--text-primary); }
.filter-panel .fp-chip-on { background: var(--apple-blue); color: #fff; box-shadow: 0 2px 6px rgba(0, 122, 255, 0.35); }
.filter-panel .fp-chip-on:hover { background: var(--apple-blue); color: #fff; }
.filter-panel .fp-chip-no { background: var(--danger, #ff3b30); color: #fff; box-shadow: 0 2px 6px rgba(255, 59, 48, 0.35); text-decoration: line-through; }
.filter-panel .fp-chip-no:hover { background: var(--danger, #ff3b30); color: #fff; }

.filter-panel .fp-x { font-style: normal; font-size: 10px; opacity: 0.55; padding: 0 2px; border-radius: 4px; }
.filter-panel .fp-chip:hover .fp-x { opacity: 1; }
.filter-panel .fp-chip .fp-x:hover { opacity: 1; background: rgba(0, 0, 0, 0.15); }
.filter-panel .fp-empty { font-size: 12px; color: var(--text-tertiary, #8a8a8e); padding: 4px 0; }

.filter-panel .fp-foot {
  display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
  padding: 10px 16px; border-top: 1px solid var(--border);
  background: var(--bg-secondary, #f2f2f7);
}
.filter-panel .fp-expr {
  font-size: 12px; color: var(--text-secondary); flex: 1; word-break: break-all;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}
.filter-panel .fp-expr .fp-hl-op, .filter-panel .fp-expr .fp-hl-paren,
.filter-panel .fp-expr .fp-hl-field, .filter-panel .fp-expr .fp-hl-cmp,
.filter-panel .fp-expr .fp-hl-val, .filter-panel .fp-expr .fp-hl-word { font-size: 12px; }
.filter-panel .fp-expr-empty {
  color: var(--text-tertiary, #8a8a8e);
  font-family: -apple-system, "PingFang SC", "Microsoft YaHei", sans-serif;
}
.filter-panel .fp-reset {
  border: 1px solid var(--border); background: #fff; color: var(--text-secondary);
  font-size: 12px; padding: 5px 14px; border-radius: 999px; cursor: pointer; transition: all 0.15s;
}
.filter-panel .fp-reset:hover { background: var(--danger, #ff3b30); border-color: var(--danger, #ff3b30); color: #fff; }

/* 触发按钮 */
.filter-open-btn {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 8px 16px; font-size: 13px; border: none; border-radius: var(--radius-full);
  background: var(--surface-primary); color: var(--text-secondary);
  cursor: pointer; transition: all var(--transition-fast); box-shadow: var(--shadow-sm);
}
.filter-open-btn:hover { background: var(--surface-secondary); color: var(--text-primary); }
.filter-open-btn.active { background: var(--apple-blue); color: #fff; box-shadow: 0 2px 8px rgba(0, 122, 255, 0.3); }
.filter-badge {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 18px; height: 18px; padding: 0 5px; border-radius: 999px;
  background: var(--danger, #ff3b30); color: #fff; font-size: 11px; font-weight: 700;
}

/* ============ 深色模式 ============ */
body.dark-mode .filter-panel { background: var(--dm-bg-card, #1c1f2a); border-color: var(--dm-border, #2c2f3a); box-shadow: 0 4px 16px rgba(0, 0, 0, 0.3); }
body.dark-mode .filter-panel .fp-head { background: linear-gradient(135deg, rgba(0, 122, 255, 0.14), rgba(52, 199, 89, 0.14)); border-color: var(--dm-border, #2c2f3a); }
body.dark-mode .filter-panel .fp-title { color: var(--dm-text-primary, #e8e8ef); }
body.dark-mode .filter-panel .fp-sub { color: var(--dm-text-muted, #8b8e9c); }
body.dark-mode .filter-panel .fp-zone-title { color: var(--dm-text-secondary, #b9bcc8); }
body.dark-mode .filter-panel .fp-chip { background: var(--dm-bg-hover, #272a36); color: var(--dm-text-secondary, #b9bcc8); }
body.dark-mode .filter-panel .fp-chip:hover { background: var(--dm-bg-elevated, #313542); color: var(--dm-text-primary, #e8e8ef); }
body.dark-mode .filter-panel .fp-chip-on { background: var(--dm-accent, #0a84ff); color: #fff; }
body.dark-mode .filter-panel .fp-chip-no { background: var(--dm-danger, #ff453a); color: #fff; }
body.dark-mode .filter-panel .fp-empty { color: var(--dm-text-muted, #8b8e9c); }
body.dark-mode .filter-panel .fp-foot { background: var(--dm-bg-secondary, #171a23); border-color: var(--dm-border, #2c2f3a); }
body.dark-mode .filter-panel .fp-expr { color: var(--dm-text-secondary, #b9bcc8); }
body.dark-mode .filter-panel .fp-expr-empty { color: var(--dm-text-muted, #8b8e9c); }
body.dark-mode .filter-panel .fp-reset { background: var(--dm-bg-elevated, #313542); border-color: var(--dm-border, #2c2f3a); color: var(--dm-text-secondary, #b9bcc8); }
body.dark-mode .filter-panel .fp-reset:hover { background: var(--dm-danger, #ff453a); border-color: var(--dm-danger, #ff453a); color: #fff; }
body.dark-mode .filter-open-btn { background: var(--dm-bg-card, #1c1f2a); color: var(--dm-text-secondary, #b9bcc8); }
body.dark-mode .filter-open-btn:hover { background: var(--dm-bg-hover, #272a36); color: var(--dm-text-primary, #e8e8ef); }
body.dark-mode .filter-open-btn.active { background: var(--dm-accent, #0a84ff); color: #fff; }
body.dark-mode .filter-badge { background: var(--dm-danger, #ff453a); color: #fff; }

/* ============ 第三阶段：Tab 页签 ============ */
.filter-panel .fp-tabs { display: flex; gap: 4px; margin-left: auto; }
.filter-panel .fp-tab {
  border: 1px solid var(--border); background: var(--surface-primary, #fff);
  color: var(--text-tertiary, #8a8a8e); font-size: 12px; padding: 4px 12px;
  border-radius: 999px; cursor: pointer; transition: all 0.15s; white-space: nowrap;
}
.filter-panel .fp-tab:hover { color: var(--text-primary); }
.filter-panel .fp-tab.active { background: var(--apple-blue); border-color: var(--apple-blue); color: #fff; font-weight: 600; }
@media (max-width: 720px) {
  .filter-panel .fp-tabs { margin-left: 0; width: 100%; justify-content: flex-start; flex-wrap: wrap; }
  .filter-panel .fp-head { flex-wrap: wrap; }
}

/* ============ 第三阶段：表达式输入 ============ */
.filter-panel .fp-expr-box, .filter-panel .fp-builder { grid-column: 1 / -1; min-width: 0; }
.filter-panel .fp-expr-label { font-size: 12px; color: var(--text-secondary); margin-bottom: 8px; }
.filter-panel .fp-expr-label b { color: var(--apple-blue); }
.filter-panel .fp-expr-input {
  width: 100%; box-sizing: border-box; min-height: 40px; height: auto;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 13px;
  padding: 8px 12px; border: 1px solid var(--border); border-radius: 10px;
  background: var(--surface-primary, #fff); color: var(--text-primary);
}
.filter-panel .fp-expr-input:focus { outline: none; border-color: var(--apple-blue); box-shadow: 0 0 0 3px rgba(0, 122, 255, 0.15); }
.filter-panel .fp-expr-actions { display: flex; align-items: center; gap: 8px; margin-top: 8px; flex-wrap: wrap; }
.filter-panel .fp-expr-status { font-size: 12px; padding: 3px 10px; border-radius: 999px; }
.filter-panel .fp-expr-status.fp-st-ok { background: rgba(52, 199, 89, 0.12); color: #1d9e45; }
.filter-panel .fp-expr-status.fp-st-err { background: rgba(255, 59, 48, 0.12); color: var(--danger, #ff3b30); }
.filter-panel .fp-expr-status.fp-st-warn { background: rgba(255, 149, 0, 0.15); color: #c77800; }
.filter-panel .fp-expr-help { font-size: 11px; color: var(--text-tertiary, #8a8a8e); }

/* ============ 通用小按钮 ============ */
.filter-panel .fp-btn {
  border: 1px solid var(--border); background: var(--surface-primary, #fff);
  color: var(--text-secondary); font-size: 12px; padding: 5px 12px; border-radius: 999px;
  cursor: pointer; transition: all 0.15s; white-space: nowrap;
}
.filter-panel .fp-btn:hover { border-color: var(--apple-blue); color: var(--apple-blue); }
.filter-panel .fp-btn-primary { background: var(--apple-blue); border-color: var(--apple-blue); color: #fff; font-weight: 600; }
.filter-panel .fp-btn-primary:hover { background: #0a6cd6; color: #fff; }

/* ============ 第四阶段：可视化构建器 ============ */
.filter-panel .fp-builder { display: flex; flex-direction: column; gap: 8px; }
.filter-panel .fp-b-row {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  padding: 8px 10px; border: 1px solid var(--border); border-radius: 10px;
  background: var(--bg-secondary, #f2f2f7);
}
.filter-panel .fp-b-conn { min-width: 72px; padding: 4px 6px; border-radius: 8px; border: 1px solid var(--border); font-size: 12px; font-weight: 700; color: var(--apple-blue); background: var(--surface-primary, #fff); }
.filter-panel .fp-b-conn-first { visibility: hidden; }
.filter-panel .fp-b-scope { padding: 4px 6px; border-radius: 8px; border: 1px solid var(--border); font-size: 12px; background: var(--surface-primary, #fff); color: var(--text-secondary); }
.filter-panel .fp-b-tag { flex: 1; min-width: 140px; padding: 5px 10px; border: 1px solid var(--border); border-radius: 8px; font-size: 13px; background: var(--surface-primary, #fff); color: var(--text-primary); }
.filter-panel .fp-b-tag:focus { outline: none; border-color: var(--apple-blue); }
.filter-panel .fp-b-neg { display: inline-flex; align-items: center; gap: 4px; font-size: 12px; color: var(--text-tertiary, #8a8a8e); cursor: pointer; user-select: none; }
.filter-panel .fp-b-neg input { accent-color: var(--danger, #ff3b30); }
.filter-panel .fp-b-neg span { font-weight: 700; color: var(--danger, #ff3b30); }
.filter-panel .fp-b-del { border: none; background: transparent; color: var(--text-tertiary, #8a8a8e); cursor: pointer; font-size: 13px; padding: 2px 6px; border-radius: 6px; }
.filter-panel .fp-b-del:hover { background: rgba(255, 59, 48, 0.12); color: var(--danger, #ff3b30); }
.filter-panel .fp-b-actions { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }

/* ============ 第五阶段：方案保存/加载 ============ */
.filter-panel .fp-schemes { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.filter-panel .fp-scheme-sel {
  padding: 5px 10px; border: 1px solid var(--border); border-radius: 999px;
  font-size: 12px; background: var(--surface-primary, #fff); color: var(--text-secondary);
  max-width: 180px; cursor: pointer;
}
.filter-panel .fp-scheme-sel:focus { outline: none; border-color: var(--apple-blue); }

/* ============ 第三~五阶段：深色模式 ============ */
body.dark-mode .filter-panel .fp-tab { background: var(--dm-bg-card, #1c1f2a); border-color: var(--dm-border, #2c2f3a); color: var(--dm-text-muted, #8b8e9c); }
body.dark-mode .filter-panel .fp-tab:hover { color: var(--dm-text-primary, #e8e8ef); }
body.dark-mode .filter-panel .fp-tab.active { background: var(--dm-accent, #0a84ff); border-color: var(--dm-accent, #0a84ff); color: #fff; }
body.dark-mode .filter-panel .fp-expr-label { color: var(--dm-text-secondary, #b9bcc8); }
body.dark-mode .filter-panel .fp-expr-label b { color: var(--dm-accent, #0a84ff); }
body.dark-mode .filter-panel .fp-expr-input { background: var(--dm-bg-elevated, #313542); border-color: var(--dm-border, #2c2f3a); color: var(--dm-text-primary, #e8e8ef); }
body.dark-mode .filter-panel .fp-expr-input:focus { border-color: var(--dm-accent, #0a84ff); box-shadow: 0 0 0 3px rgba(10, 132, 255, 0.2); }
body.dark-mode .filter-panel .fp-expr-status.fp-st-ok { background: rgba(48, 209, 88, 0.15); color: #30d158; }
body.dark-mode .filter-panel .fp-expr-status.fp-st-err { background: rgba(255, 69, 58, 0.15); color: var(--dm-danger, #ff453a); }
body.dark-mode .filter-panel .fp-expr-status.fp-st-warn { background: rgba(255, 159, 10, 0.18); color: #ff9f0a; }
body.dark-mode .filter-panel .fp-expr-help { color: var(--dm-text-muted, #8b8e9c); }
body.dark-mode .filter-panel .fp-btn { background: var(--dm-bg-elevated, #313542); border-color: var(--dm-border, #2c2f3a); color: var(--dm-text-secondary, #b9bcc8); }
body.dark-mode .filter-panel .fp-btn:hover { border-color: var(--dm-accent, #0a84ff); color: var(--dm-accent, #0a84ff); }
body.dark-mode .filter-panel .fp-btn-primary { background: var(--dm-accent, #0a84ff); border-color: var(--dm-accent, #0a84ff); color: #fff; }
body.dark-mode .filter-panel .fp-btn-primary:hover { color: #fff; }
body.dark-mode .filter-panel .fp-b-row { background: var(--dm-bg-secondary, #171a23); border-color: var(--dm-border, #2c2f3a); }
body.dark-mode .filter-panel .fp-b-conn, body.dark-mode .filter-panel .fp-b-scope, body.dark-mode .filter-panel .fp-b-tag { background: var(--dm-bg-elevated, #313542); border-color: var(--dm-border, #2c2f3a); color: var(--dm-text-primary, #e8e8ef); }
body.dark-mode .filter-panel .fp-b-conn { color: var(--dm-accent, #0a84ff); }
body.dark-mode .filter-panel .fp-b-neg { color: var(--dm-text-muted, #8b8e9c); }
body.dark-mode .filter-panel .fp-b-del:hover { background: rgba(255, 69, 58, 0.15); color: var(--dm-danger, #ff453a); }
body.dark-mode .filter-panel .fp-scheme-sel { background: var(--dm-bg-elevated, #313542); border-color: var(--dm-border, #2c2f3a); color: var(--dm-text-secondary, #b9bcc8); }

/* ============ Tab4：搜索引擎指令构造器 ============ */
.filter-panel .fp-eg-box { grid-column: 1 / -1; min-width: 0; display: flex; flex-direction: column; gap: 10px; }

.filter-panel .fp-eg-top { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.filter-panel .fp-eg-top-label { font-size: 12px; color: var(--text-secondary); }
.filter-panel .fp-eg-top-sub { font-size: 11px; color: var(--text-tertiary, #8a8a8e); flex: 1; min-width: 180px; }
.filter-panel .fp-eg-mode-btn {
  border: 1px solid var(--border); background: var(--surface-primary, #fff);
  color: var(--text-tertiary, #8a8a8e); font-size: 12px; padding: 4px 12px;
  border-radius: 999px; cursor: pointer; transition: all 0.15s;
}
.filter-panel .fp-eg-mode-btn:hover { color: var(--text-primary); }
.filter-panel .fp-eg-mode-btn.active { background: var(--apple-blue); border-color: var(--apple-blue); color: #fff; font-weight: 600; }

.filter-panel .fp-eg-actions { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }

.filter-panel .fp-eg-gui { display: flex; flex-direction: column; gap: 8px; }
.filter-panel .fp-eg-sec {
  border: 1px solid var(--border); border-radius: 10px;
  padding: 8px 10px; background: var(--bg-secondary, #f2f2f7);
}
.filter-panel .fp-eg-sec-dead { opacity: 0.75; background: rgba(142, 142, 147, 0.06); }
.filter-panel .fp-eg-sec-title { font-size: 12px; font-weight: 600; color: var(--text-secondary); margin-bottom: 6px; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.filter-panel .fp-eg-sec-title small { font-weight: 400; color: var(--text-tertiary, #8a8a8e); }
.filter-panel .fp-eg-btns { display: flex; flex-wrap: wrap; gap: 6px; }

.filter-panel .fp-eg-btn {
  position: relative;
  border: 1px solid var(--border); background: var(--surface-primary, #fff);
  color: var(--text-secondary); font-size: 12px; padding: 4px 10px; border-radius: 8px;
  cursor: pointer; transition: all 0.15s; white-space: nowrap;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}
.filter-panel .fp-eg-btn:hover { border-color: var(--apple-blue); color: var(--apple-blue); }
.filter-panel .fp-eg-btn.active { background: var(--apple-blue); border-color: var(--apple-blue); color: #fff; font-weight: 600; }
.filter-panel .fp-eg-eng {
  font-style: normal; font-family: -apple-system, "PingFang SC", "Microsoft YaHei", sans-serif;
  font-size: 9px; color: var(--text-tertiary, #8a8a8e);
  background: rgba(142, 142, 147, 0.12); border-radius: 4px; padding: 0 4px; margin-left: 4px;
  vertical-align: 1px;
}
.filter-panel .fp-eg-btn.active .fp-eg-eng { color: rgba(255, 255, 255, 0.85); background: rgba(255, 255, 255, 0.18); }
.filter-panel .fp-eg-dead-btn {
  cursor: not-allowed; color: var(--text-tertiary, #8a8a8e);
  text-decoration: line-through; border-style: dashed;
}
.filter-panel .fp-eg-dead-btn:hover { border-color: var(--border); color: var(--text-tertiary, #8a8a8e); }
.filter-panel .fp-eg-dead-mark { font-style: normal; font-size: 9px; margin-left: 4px; vertical-align: 1px; }

.filter-panel .fp-eg-menu-wrap { position: relative; }
.filter-panel .fp-eg-menu {
  position: absolute; z-index: 50; top: 0; left: 0;
  display: flex; flex-wrap: wrap; gap: 4px; max-width: 320px;
  background: var(--surface-primary, #fff); border: 1px solid var(--border);
  border-radius: 10px; padding: 8px; box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
}
.filter-panel .fp-eg-menu-item {
  border: 1px solid var(--border); background: var(--bg-secondary, #f2f2f7);
  color: var(--text-secondary); font-size: 12px; padding: 3px 9px; border-radius: 6px;
  cursor: pointer; transition: all 0.12s;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}
.filter-panel .fp-eg-menu-item:hover { border-color: var(--apple-blue); color: var(--apple-blue); background: var(--surface-primary, #fff); }

.filter-panel .fp-eg-preview {
  border: 1px solid var(--border); border-radius: 10px; padding: 10px 12px;
  background: var(--surface-primary, #fff);
}
.filter-panel .fp-eg-pv-title { font-size: 12px; font-weight: 600; color: var(--text-secondary); margin-bottom: 6px; }
.filter-panel .fp-eg-expr {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 13px;
  color: var(--text-primary); word-break: break-all; line-height: 1.6;
  background: var(--bg-secondary, #f2f2f7); border-radius: 8px; padding: 8px 10px; min-height: 20px;
}
.filter-panel .fp-eg-suggest { margin-top: 8px; font-size: 12px; color: var(--text-secondary); display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.filter-panel .fp-eg-complete {
  border: 1px dashed var(--apple-blue); background: rgba(0, 122, 255, 0.08);
  color: var(--apple-blue); font-size: 11px; padding: 2px 8px; border-radius: 999px; cursor: pointer;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}
.filter-panel .fp-eg-complete:hover { background: var(--apple-blue); color: #fff; }
.filter-panel .fp-eg-tips { font-size: 11px; color: var(--text-tertiary, #8a8a8e); margin-top: 6px; }

/* Tab4：深色模式 */
body.dark-mode .filter-panel .fp-eg-top-label { color: var(--dm-text-secondary, #b9bcc8); }
body.dark-mode .filter-panel .fp-eg-top-sub { color: var(--dm-text-muted, #8b8e9c); }
body.dark-mode .filter-panel .fp-eg-mode-btn { background: var(--dm-bg-card, #1c1f2a); border-color: var(--dm-border, #2c2f3a); color: var(--dm-text-muted, #8b8e9c); }
body.dark-mode .filter-panel .fp-eg-mode-btn:hover { color: var(--dm-text-primary, #e8e8ef); }
body.dark-mode .filter-panel .fp-eg-mode-btn.active { background: var(--dm-accent, #0a84ff); border-color: var(--dm-accent, #0a84ff); color: #fff; }
body.dark-mode .filter-panel .fp-eg-sec { background: var(--dm-bg-secondary, #171a23); border-color: var(--dm-border, #2c2f3a); }
body.dark-mode .filter-panel .fp-eg-sec-dead { background: rgba(142, 142, 147, 0.08); }
body.dark-mode .filter-panel .fp-eg-sec-title { color: var(--dm-text-secondary, #b9bcc8); }
body.dark-mode .filter-panel .fp-eg-sec-title small { color: var(--dm-text-muted, #8b8e9c); }
body.dark-mode .filter-panel .fp-eg-btn { background: var(--dm-bg-elevated, #313542); border-color: var(--dm-border, #2c2f3a); color: var(--dm-text-secondary, #b9bcc8); }
body.dark-mode .filter-panel .fp-eg-btn:hover { border-color: var(--dm-accent, #0a84ff); color: var(--dm-accent, #0a84ff); }
body.dark-mode .filter-panel .fp-eg-btn.active { background: var(--dm-accent, #0a84ff); border-color: var(--dm-accent, #0a84ff); color: #fff; }
body.dark-mode .filter-panel .fp-eg-eng { color: var(--dm-text-muted, #8b8e9c); background: rgba(255, 255, 255, 0.08); }
body.dark-mode .filter-panel .fp-eg-btn.active .fp-eg-eng { color: rgba(255, 255, 255, 0.85); background: rgba(255, 255, 255, 0.18); }
body.dark-mode .filter-panel .fp-eg-dead-btn, body.dark-mode .filter-panel .fp-eg-dead-btn:hover { color: var(--dm-text-muted, #8b8e9c); border-color: var(--dm-border, #2c2f3a); }
body.dark-mode .filter-panel .fp-eg-menu { background: var(--dm-bg-elevated, #313542); border-color: var(--dm-border, #2c2f3a); box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4); }
body.dark-mode .filter-panel .fp-eg-menu-item { background: var(--dm-bg-secondary, #171a23); border-color: var(--dm-border, #2c2f3a); color: var(--dm-text-secondary, #b9bcc8); }
body.dark-mode .filter-panel .fp-eg-menu-item:hover { border-color: var(--dm-accent, #0a84ff); color: var(--dm-accent, #0a84ff); background: var(--dm-bg-card, #1c1f2a); }
body.dark-mode .filter-panel .fp-eg-preview { background: var(--dm-bg-card, #1c1f2a); border-color: var(--dm-border, #2c2f3a); }
body.dark-mode .filter-panel .fp-eg-pv-title { color: var(--dm-text-secondary, #b9bcc8); }
body.dark-mode .filter-panel .fp-eg-expr { background: var(--dm-bg-secondary, #171a23); color: var(--dm-text-primary, #e8e8ef); }
body.dark-mode .filter-panel .fp-eg-suggest { color: var(--dm-text-secondary, #b9bcc8); }
body.dark-mode .filter-panel .fp-eg-complete { border-color: var(--dm-accent, #0a84ff); background: rgba(10, 132, 255, 0.12); color: var(--dm-accent, #0a84ff); }
body.dark-mode .filter-panel .fp-eg-complete:hover { background: var(--dm-accent, #0a84ff); color: #fff; }
body.dark-mode .filter-panel .fp-eg-tips { color: var(--dm-text-muted, #8b8e9c); }

/* ============ 统一语法说明面板（搜索与过滤共用） ============ */
.filter-panel .fp-help-btn {
  border: 1px solid var(--border); background: var(--surface-primary, #fff);
  color: var(--text-tertiary, #8a8a8e); font-size: 12px; padding: 4px 12px;
  border-radius: 999px; cursor: pointer; transition: all 0.15s; white-space: nowrap;
}
.filter-panel .fp-help-btn:hover { color: var(--text-primary); }
.filter-panel .fp-help-btn.active { background: #fff4d6; border-color: #ffb800; color: #b06f00; font-weight: 600; }

.filter-panel .fp-help {
  display: flex; flex-direction: column; gap: 8px;
  grid-column: 1 / -1; margin: 0 16px 10px;
  border: 1px solid var(--border); border-radius: 10px; padding: 10px 12px;
  background: var(--bg-secondary, #f2f2f7);
}
.filter-panel .fp-help-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 8px; }
.filter-panel .fp-help-card {
  background: var(--surface-primary, #fff); border: 1px solid var(--border);
  border-radius: 8px; padding: 8px 10px;
}
.filter-panel .fp-help-title { font-size: 12px; font-weight: 600; color: var(--text-primary); margin-bottom: 4px; }
.filter-panel .fp-help-card p { font-size: 11px; color: var(--text-secondary); margin: 0 0 4px; line-height: 1.6; }
.filter-panel .fp-help-card b { color: var(--apple-blue); }
.filter-panel .fp-help-card code, .filter-panel .fp-help-warn code {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 11px; color: var(--text-primary);
  background: var(--bg-secondary, #f2f2f7); border-radius: 4px; padding: 1px 5px;
}
.filter-panel .fp-help-warn {
  font-size: 11px; color: #b06f00; background: rgba(255, 184, 0, 0.10);
  border: 1px dashed rgba(255, 184, 0, 0.45); border-radius: 8px; padding: 6px 10px; line-height: 1.8;
}
.filter-panel .fp-help-adv { font-size: 11px; color: var(--text-tertiary, #8a8a8e); }

/* ============ 表达式语法高亮预览 ============ */
.filter-panel .fp-expr-hl {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 13px; line-height: 1.7; color: var(--text-secondary);
  word-break: break-all; min-height: 20px;
  background: var(--bg-secondary, #f2f2f7); border-radius: 8px; padding: 6px 10px;
  border: 1px dashed var(--border);
}
.filter-panel .fp-hl-ph { color: var(--text-tertiary, #8a8a8e); font-family: -apple-system, "PingFang SC", "Microsoft YaHei", sans-serif; font-size: 12px; }
.filter-panel .fp-hl-op { color: #b06f00; font-weight: 700; background: rgba(255, 184, 0, 0.14); border-radius: 4px; padding: 0 4px; }
.filter-panel .fp-hl-paren { color: #af52de; font-weight: 700; }
.filter-panel .fp-hl-field { color: #198754; font-weight: 600; }
.filter-panel .fp-hl-cmp { color: #d4380d; font-weight: 700; font-style: normal; }
.filter-panel .fp-hl-val { color: #0b5ed7; }
.filter-panel .fp-hl-word { color: var(--text-primary); }
.filter-panel .fp-hl-gap { display: inline-block; width: 0.4em; }

/* 统一语法说明面板 + 高亮：深色模式 */
body.dark-mode .filter-panel .fp-help-btn { background: var(--dm-bg-card, #1c1f2a); border-color: var(--dm-border, #2c2f3a); color: var(--dm-text-muted, #8b8e9c); }
body.dark-mode .filter-panel .fp-help-btn:hover { color: var(--dm-text-primary, #e8e8ef); }
body.dark-mode .filter-panel .fp-help-btn.active { background: rgba(255, 184, 0, 0.16); border-color: #b06f00; color: #ffd666; }
body.dark-mode .filter-panel .fp-help { background: var(--dm-bg-secondary, #171a23); border-color: var(--dm-border, #2c2f3a); }
body.dark-mode .filter-panel .fp-help-card { background: var(--dm-bg-card, #1c1f2a); border-color: var(--dm-border, #2c2f3a); }
body.dark-mode .filter-panel .fp-help-title { color: var(--dm-text-primary, #e8e8ef); }
body.dark-mode .filter-panel .fp-help-card p { color: var(--dm-text-secondary, #b9bcc8); }
body.dark-mode .filter-panel .fp-help-card b { color: var(--dm-accent, #0a84ff); }
body.dark-mode .filter-panel .fp-help-card code, body.dark-mode .filter-panel .fp-help-warn code { color: var(--dm-text-primary, #e8e8ef); background: var(--dm-bg-elevated, #313542); }
body.dark-mode .filter-panel .fp-help-warn { color: #ffd666; background: rgba(255, 184, 0, 0.08); border-color: rgba(255, 184, 0, 0.35); }
body.dark-mode .filter-panel .fp-help-adv { color: var(--dm-text-muted, #8b8e9c); }
body.dark-mode .filter-panel .fp-expr-hl { background: var(--dm-bg-secondary, #171a23); border-color: var(--dm-border, #2c2f3a); color: var(--dm-text-secondary, #b9bcc8); }
body.dark-mode .filter-panel .fp-hl-ph { color: var(--dm-text-muted, #8b8e9c); }
body.dark-mode .filter-panel .fp-hl-op { color: #ffd666; background: rgba(255, 184, 0, 0.12); }
body.dark-mode .filter-panel .fp-hl-paren { color: #d78cff; }
body.dark-mode .filter-panel .fp-hl-field { color: #69db7c; }
body.dark-mode .filter-panel .fp-hl-cmp { color: #ff8787; }
body.dark-mode .filter-panel .fp-hl-val { color: #74c0fc; }
body.dark-mode .filter-panel .fp-hl-word { color: var(--dm-text-primary, #e8e8ef); }

/* ============ 插件市场生态（设计·第三/四阶段） ============ */
.filter-panel .fp-plug-market { display: flex; flex-direction: column; gap: 10px; }
.filter-panel .fp-plug-head { font-size: 14px; font-weight: 700; color: var(--text-primary); }
.filter-panel .fp-plug-head small { font-size: 11px; font-weight: 400; color: var(--text-tertiary, #8a8a8e); }
.filter-panel .fp-plug-card {
  display: flex; align-items: center; gap: 12px;
  border: 1px solid var(--border); border-radius: 12px; padding: 10px 12px;
  background: var(--surface-primary, #fff); transition: all 0.15s;
}
.filter-panel .fp-plug-card:hover { border-color: var(--apple-blue); box-shadow: 0 2px 10px rgba(0, 122, 255, 0.08); }
.filter-panel .fp-plug-card.active { border-color: rgba(52, 199, 89, 0.6); background: rgba(52, 199, 89, 0.04); }
.filter-panel .fp-plug-icon {
  flex: 0 0 42px; height: 42px; border-radius: 10px;
  display: flex; align-items: center; justify-content: center;
  font-size: 20px; background: var(--bg-secondary, #f2f2f7); border: 1px solid var(--border);
}
.filter-panel .fp-plug-main { flex: 1; min-width: 0; }
.filter-panel .fp-plug-name { font-size: 13px; font-weight: 700; color: var(--text-primary); display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.filter-panel .fp-plug-meta { font-size: 11px; font-weight: 400; color: var(--text-tertiary, #8a8a8e); }
.filter-panel .fp-plug-desc { font-size: 12px; color: var(--text-secondary); line-height: 1.6; margin-top: 2px; }
.filter-panel .fp-plug-toggle {
  flex: 0 0 auto; border: 1px solid var(--apple-blue); background: var(--surface-primary, #fff);
  color: var(--apple-blue); font-size: 12px; font-weight: 600; padding: 5px 14px;
  border-radius: 999px; cursor: pointer; transition: all 0.15s; white-space: nowrap;
}
.filter-panel .fp-plug-toggle:hover { background: var(--apple-blue); color: #fff; }
.filter-panel .fp-plug-toggle.on { background: var(--apple-green, #34c759); border-color: var(--apple-green, #34c759); color: #fff; }
.filter-panel .fp-plug-note { font-size: 11px; color: var(--text-tertiary, #8a8a8e); line-height: 1.7; }

/* 插件效果：底部匹配徽标 */
.filter-panel .fp-plug-match {
  flex: 0 0 auto; align-self: center; font-size: 12px; font-weight: 600;
  color: #b06f00; background: rgba(255, 184, 0, 0.14); border-radius: 999px; padding: 3px 10px;
  white-space: nowrap; cursor: default;
}
/* 插件效果：相关标签推荐 */
.filter-panel .fp-suggest {
  border: 1px dashed var(--border); border-radius: 10px; padding: 8px 12px;
  background: linear-gradient(135deg, rgba(0, 122, 255, 0.05), rgba(52, 199, 89, 0.05)); margin-bottom: 10px;
}
.filter-panel .fp-suggest-title { font-size: 12px; font-weight: 600; color: var(--text-primary); margin-bottom: 6px; }
.filter-panel .fp-suggest-title small { font-weight: 400; color: var(--text-tertiary, #8a8a8e); }
.filter-panel .fp-chip-suggest { cursor: pointer; }
.filter-panel .fp-chip-suggest:hover { border-color: var(--apple-blue); color: var(--apple-blue); }
/* 插件效果：引擎场景模板 */
.filter-panel .fp-eg-tpls { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 8px; }
.filter-panel .fp-eg-tpl {
  border: 1px solid var(--border); background: var(--surface-primary, #fff);
  color: var(--text-secondary); font-size: 12px; padding: 4px 12px; border-radius: 999px;
  cursor: pointer; transition: all 0.15s;
}
.filter-panel .fp-eg-tpl:hover { border-color: var(--apple-blue); color: var(--apple-blue); background: rgba(0, 122, 255, 0.06); }

/* 插件市场：深色模式 */
body.dark-mode .filter-panel .fp-plug-head { color: var(--dm-text-primary, #e8e8ef); }
body.dark-mode .filter-panel .fp-plug-head small { color: var(--dm-text-muted, #8b8e9c); }
body.dark-mode .filter-panel .fp-plug-card { background: var(--dm-bg-card, #1c1f2a); border-color: var(--dm-border, #2c2f3a); }
body.dark-mode .filter-panel .fp-plug-card.active { border-color: rgba(52, 199, 89, 0.7); background: rgba(52, 199, 89, 0.08); }
body.dark-mode .filter-panel .fp-plug-icon { background: var(--dm-bg-secondary, #171a23); border-color: var(--dm-border, #2c2f3a); }
body.dark-mode .filter-panel .fp-plug-name { color: var(--dm-text-primary, #e8e8ef); }
body.dark-mode .filter-panel .fp-plug-meta { color: var(--dm-text-muted, #8b8e9c); }
body.dark-mode .filter-panel .fp-plug-desc { color: var(--dm-text-secondary, #b9bcc8); }
body.dark-mode .filter-panel .fp-plug-toggle { background: var(--dm-bg-card, #1c1f2a); border-color: var(--dm-accent, #0a84ff); color: var(--dm-accent, #0a84ff); }
body.dark-mode .filter-panel .fp-plug-toggle:hover { background: var(--dm-accent, #0a84ff); color: #fff; }
body.dark-mode .filter-panel .fp-plug-note { color: var(--dm-text-muted, #8b8e9c); }
body.dark-mode .filter-panel .fp-plug-match { color: #ffd666; background: rgba(255, 184, 0, 0.12); }
body.dark-mode .filter-panel .fp-suggest { border-color: var(--dm-border, #2c2f3a); }
body.dark-mode .filter-panel .fp-suggest-title { color: var(--dm-text-primary, #e8e8ef); }
body.dark-mode .filter-panel .fp-suggest-title small { color: var(--dm-text-muted, #8b8e9c); }
body.dark-mode .filter-panel .fp-eg-tpl { background: var(--dm-bg-card, #1c1f2a); border-color: var(--dm-border, #2c2f3a); color: var(--dm-text-secondary, #b9bcc8); }
body.dark-mode .filter-panel .fp-eg-tpl:hover { border-color: var(--dm-accent, #0a84ff); color: var(--dm-accent, #0a84ff); }
