/* 全站壳层图标：导航 / 页脚 / 登录 / 账户 / 升级，跟随主题与断点自适应 */

.kx-sprite { position: absolute; width: 0; height: 0; overflow: hidden; }

.kx-ico {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 1em;
  height: 1em;
  font-size: 16px;
  line-height: 1;
  color: inherit;
  vertical-align: -0.125em;
}
.kx-ico svg {
  width: 1em;
  height: 1em;
  display: block;
  fill: none;
  stroke: currentColor;
}
.kx-ico--xs { font-size: 13px; }
.kx-ico--sm { font-size: 14px; }
.kx-ico--md { font-size: 16px; }
.kx-ico--lg { font-size: 20px; }
.kx-ico--xl { font-size: 24px; }

.kx-ico-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  border-radius: 10px;
  flex-shrink: 0;
  color: var(--xh-accent, var(--ui-accent, #c9a96e));
  background:
    linear-gradient(145deg,
      color-mix(in srgb, var(--xh-accent, var(--ui-accent, #c9a96e)) 16%, transparent),
      color-mix(in srgb, var(--xh-accent, var(--ui-accent, #c9a96e)) 6%, transparent));
  border: 1px solid color-mix(in srgb, var(--xh-accent, var(--ui-accent, #c9a96e)) 28%, transparent);
  box-shadow: 0 1px 0 color-mix(in srgb, #fff 18%, transparent) inset;
}
.kx-ico-badge .kx-ico { font-size: 15px; color: inherit; }
.kx-ico-badge--lg {
  width: 2.75rem;
  height: 2.75rem;
  border-radius: 14px;
}
.kx-ico-badge--lg .kx-ico { font-size: 20px; }
.kx-ico-badge--soft {
  background: color-mix(in srgb, var(--xh-surface-2, var(--ui-surface-raised, #fff)) 88%, transparent);
  border-color: var(--xh-line, var(--ui-border, rgba(133, 96, 49, .18)));
  color: var(--xh-body, var(--ui-text-2, #615445));
}

.kx-ico-row {
  display: inline-flex;
  align-items: center;
  gap: .45em;
}

/* —— 站点导航 —— */
.xh-site-nav-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.xh-site-nav-link .kx-ico {
  font-size: 14px;
  opacity: .78;
  transition: opacity .2s ease, transform .2s ease;
}
.xh-site-nav-link:hover .kx-ico,
.xh-site-nav-link.is-active .kx-ico {
  opacity: 1;
  transform: translateY(-0.5px);
}
.xh-site-nav-login,
.xh-site-nav-trial,
.xh-site-nav-pricing,
.xh-site-nav-cta {
  gap: 6px !important;
}
.xh-site-nav-login .kx-ico,
.xh-site-nav-trial .kx-ico,
.xh-site-nav-pricing .kx-ico,
.xh-site-nav-cta .kx-ico {
  font-size: 13px;
}
.xh-site-nav-account-menu a,
.xh-site-nav-account-menu button {
  display: flex;
  align-items: center;
  gap: 8px;
}
.xh-site-nav-account-menu .kx-ico {
  font-size: 14px;
  opacity: .75;
  color: var(--xh-accent, #c9a96e);
}

.mobile-menu-link,
.mobile-menu-item,
.mm-btn {
  display: inline-flex !important;
  align-items: center;
  gap: 8px;
}
.mobile-menu-link .kx-ico-badge {
  width: 1.7rem;
  height: 1.7rem;
  border-radius: 8px;
}
.mobile-menu-link .kx-ico-badge .kx-ico { font-size: 13px; }
.mobile-menu-item .kx-ico {
  font-size: 15px;
  color: var(--xh-accent, #c9a96e);
}
.mobile-menu-group-title {
  display: flex;
  align-items: center;
  gap: 6px;
}
.mobile-menu-group-title .kx-ico {
  font-size: 12px;
  opacity: .7;
}

/* —— 页脚 —— */
.xh-footer-links a,
.museum-footer .footer-links a,
.ix-footer-legal a {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.xh-footer-links .kx-ico,
.museum-footer .footer-links .kx-ico,
.ix-footer-legal .kx-ico {
  font-size: 13px;
  opacity: .7;
}
.xh-brand-title,
.museum-footer .brand-title {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

/* —— 首页 —— */
.ix-strip-item {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.ix-strip-item .kx-ico-badge {
  width: 1.65rem;
  height: 1.65rem;
  border-radius: 8px;
}
.ix-strip-item .kx-ico-badge .kx-ico { font-size: 13px; }
.ix-hero-value li {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.ix-hero-value .kx-ico {
  font-size: 13px;
  color: var(--xh-accent, #c9a96e);
}
.ix-path-index {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.ix-flow-rail li {
  position: relative;
}
.ix-flow-rail li h3 {
  display: flex;
  align-items: center;
  gap: 8px;
}
.ix-flow-rail .kx-ico-badge {
  width: 1.85rem;
  height: 1.85rem;
}
.ix-benefit-list li {
  display: flex;
  align-items: flex-start;
  gap: 8px;
}
.ix-benefit-list .kx-ico {
  margin-top: 2px;
  color: var(--xh-accent, #c9a96e);
  font-size: 15px;
}
.ix-cta,
.ix-btn-ghost {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

/* —— 登录页 —— */
.xh-auth-brand {
  display: inline-flex;
  align-items: center;
  gap: 10px;
}
.xh-auth-back {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.qf-auth-perk {
  display: inline-flex !important;
  align-items: center;
  gap: 6px;
}
.qf-auth-perk .kx-ico {
  font-size: 13px;
  color: var(--xh-accent, #c9a96e);
}
.qf-auth-channel-btn {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: 6px;
}
.qf-auth-submit .kx-ico {
  font-size: 14px;
}

/* —— 账户中心 —— */
.account-page .page-kicker {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.account-page .page-kicker .kx-ico-badge {
  width: 1.5rem;
  height: 1.5rem;
  border-radius: 7px;
}
.account-page .page-kicker .kx-ico-badge .kx-ico { font-size: 12px; }
.account-page .ac-badge {
  gap: 5px;
}
.account-page .ac-badge .kx-ico { font-size: 12px; }
.account-page .metric small,
.account-page .ac-chip small {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.account-page .metric small .kx-ico,
.account-page .ac-chip small .kx-ico {
  font-size: 13px;
  color: var(--xh-accent, #4f8cff);
}
.account-page .tab {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.account-page .tab .kx-ico { font-size: 13px; opacity: .8; }
.account-page .tab.active .kx-ico { opacity: 1; }
.account-page .quick-actions a,
.account-page .quick-actions button {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.account-page .buy,
.account-page .btn-ghost {
  gap: 6px;
}

/* —— 升级 / 方案卡 —— */
.pay-layout-hero h1,
.pay-group-head h2 {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
.pay-layout-hero h1 .kx-ico-badge,
.pay-group-head h2 .kx-ico-badge {
  width: 2.2rem;
  height: 2.2rem;
}
.scheme-top h3 {
  display: flex;
  align-items: center;
  gap: 8px;
}
.scheme-top h3 .kx-ico {
  font-size: 16px;
  color: var(--xh-accent, #23654a);
}
.scheme-list li {
  display: flex;
  align-items: flex-start;
  gap: 8px;
}
.scheme-list li > .kx-ico {
  margin-top: 2px;
  flex-shrink: 0;
  font-size: 13px;
  color: var(--xh-accent, #23654a);
  opacity: .85;
}
.scheme-list li.warn > .kx-ico {
  color: #b45309;
}

/* —— 断点适配 —— */
@media (max-width: 900px) {
  .xh-site-nav-link .kx-ico { font-size: 13px; }
  .kx-ico-badge { width: 1.85rem; height: 1.85rem; border-radius: 9px; }
  .kx-ico-badge .kx-ico { font-size: 14px; }
}
@media (max-width: 640px) {
  .xh-site-nav-links .xh-site-nav-link .kx-ico { display: none; }
  .ix-hero-value .kx-ico { font-size: 12px; }
  .pay-layout-hero h1 .kx-ico-badge,
  .pay-group-head h2 .kx-ico-badge {
    width: 1.9rem;
    height: 1.9rem;
  }
}
@media (prefers-reduced-motion: reduce) {
  .xh-site-nav-link .kx-ico { transition: none; }
}