/* 分站工具页 · 与主站蓝白胶囊风格区分（跟随模版 CSS 变量） */
.shop-tools-page {
  background: transparent;
  margin-bottom: 8px;
}

.shop-tools-switcher {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin: 0 0 16px;
}

.shop-tools-switcher__item {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 44px;
  padding: 10px 12px;
  border-radius: 4px;
  border: 1px solid var(--shop-line, #e6e2d8);
  background: #fff;
  color: var(--shop-slate, #3a3835);
  font-size: 13px;
  font-weight: 700;
  text-decoration: none !important;
  letter-spacing: 0.02em;
  transition: background .15s ease, border-color .15s ease, color .15s ease;
}

.shop-tools-switcher__item .uil {
  font-size: 16px;
  color: var(--shop-gold, #b8975a);
}

.shop-tools-switcher__item:hover {
  background: var(--shop-accent-soft, #f3eee4);
  border-color: rgba(184, 151, 90, 0.35);
  color: var(--shop-ink, #141414);
}

.shop-tools-switcher__item.is-active {
  background: var(--shop-accent, #1a1a1a);
  border-color: var(--shop-accent-deep, #0d0d0d);
  color: #f5f2eb;
  box-shadow: 0 6px 16px rgba(20, 20, 20, 0.12);
}

.shop-tools-switcher__item.is-active .uil {
  color: var(--shop-gold-mid, #c9a96e);
}

.shop-tools-kicker {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 10px;
  padding: 4px 10px;
  border-radius: 4px;
  border: 1px solid rgba(184, 151, 90, 0.35);
  background: var(--shop-accent-soft, #f3eee4);
  color: var(--shop-ink, #141414);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.14em;
}

/* 覆盖三项工具页主站蓝白样式 */
.shop-tools-page .fblive-card,
.shop-tools-page .twofa-card,
.shop-tools-page .am-card {
  background: #fff !important;
  border: 1px solid var(--shop-line, #e6e2d8) !important;
  border-radius: 6px !important;
  box-shadow: 0 10px 28px rgba(20, 20, 20, 0.05) !important;
  padding: 20px !important;
}

.shop-tools-page .fblive-title,
.shop-tools-page .twofa-title,
.shop-tools-page .am-title {
  color: var(--shop-ink, #141414) !important;
  font-weight: 700 !important;
  letter-spacing: 0.04em;
}

.shop-tools-page .fblive-line,
.shop-tools-page .twofa-line,
.shop-tools-page .am-line {
  background: linear-gradient(90deg, transparent, var(--shop-gold, #b8975a), transparent) !important;
}

.shop-tools-page .fblive-top-note,
.shop-tools-page .twofa-top-note,
.shop-tools-page .am-desc,
.shop-tools-page .twofa-help,
.shop-tools-page .twofa-result-tip {
  color: var(--shop-muted, #8a857c) !important;
}

.shop-tools-page .fblive-label,
.shop-tools-page .twofa-label,
.shop-tools-page .am-label,
.shop-tools-page .fblive-list-title {
  color: var(--shop-slate, #3a3835) !important;
}

.shop-tools-page .fblive-input,
.shop-tools-page .twofa-input,
.shop-tools-page .am-input,
.shop-tools-page .fblive-result-area {
  border-radius: 4px !important;
  border-color: var(--shop-line, #e6e2d8) !important;
  background: #fcfbf9 !important;
}

.shop-tools-page .fblive-input:focus,
.shop-tools-page .twofa-input:focus,
.shop-tools-page .am-input:focus {
  border-color: var(--shop-gold, #b8975a) !important;
  box-shadow: 0 0 0 3px rgba(184, 151, 90, 0.16) !important;
}

.shop-tools-page .fblive-check-btn,
.shop-tools-page .twofa-generate-btn,
.shop-tools-page .am-query-btn,
.shop-tools-page .fblive-copy-btn--live {
  border-radius: 4px !important;
  border: 1px solid var(--shop-accent-deep, #0d0d0d) !important;
  background: var(--shop-accent, #1a1a1a) !important;
  background-image: none !important;
  box-shadow: 0 4px 14px rgba(20, 20, 20, 0.12) !important;
  font-weight: 700 !important;
  filter: none !important;
}

.shop-tools-page .fblive-check-btn:hover,
.shop-tools-page .twofa-generate-btn:hover,
.shop-tools-page .am-query-btn:hover,
.shop-tools-page .fblive-copy-btn--live:hover {
  background: var(--shop-accent-deep, #0d0d0d) !important;
  background-image: none !important;
  color: #fff !important;
  filter: none !important;
}

.shop-tools-page .fblive-clear-btn,
.shop-tools-page .twofa-clear-btn,
.shop-tools-page .am-clear-btn {
  border-radius: 4px !important;
  border: 1px solid rgba(184, 151, 90, 0.4) !important;
  background: #fff !important;
  color: var(--shop-ink, #141414) !important;
  box-shadow: none !important;
  transform: none !important;
}

.shop-tools-page .fblive-clear-btn:hover,
.shop-tools-page .twofa-clear-btn:hover,
.shop-tools-page .am-clear-btn:hover {
  background: var(--shop-accent-soft, #f3eee4) !important;
  border-color: var(--shop-gold, #b8975a) !important;
  color: var(--shop-ink, #141414) !important;
  transform: none !important;
  box-shadow: none !important;
}

.shop-tools-page .fblive-copy-btn--die {
  border-radius: 4px !important;
  background: #8b3a3a !important;
  border: 1px solid #6e2e2e !important;
}

.shop-tools-page .am-result,
.shop-tools-page .twofa-table-wrap {
  border-radius: 4px !important;
  border-color: var(--shop-line, #e6e2d8) !important;
  background: #faf9f6 !important;
}

.shop-tools-page .am-result a {
  color: var(--shop-ink, #141414) !important;
  border-bottom: 1px solid var(--shop-gold, #b8975a);
}

.shop-tools-page .twofa-table thead th {
  background: #f5f3ee !important;
  color: var(--shop-slate, #3a3835) !important;
}

.shop-tools-page .twofa-code-copy {
  color: var(--shop-ink, #141414) !important;
  font-weight: 800;
}

.shop-tools-page .progress.fblive-progress {
  border-radius: 4px !important;
  background: #eceae4 !important;
}

.shop-tools-page .fblive-progress .progress-bar {
  background: var(--shop-accent, #1a1a1a) !important;
}

@media (max-width: 767.98px) {
  .shop-tools-switcher {
    grid-template-columns: 1fr;
    gap: 8px;
  }
  .shop-tools-switcher__item {
    justify-content: flex-start;
    padding-left: 14px;
  }
}