/**
 * XIC Multi-Wallet Connector v2.1
 * 支持：MetaMask、TronLink、OKX Wallet、Trust Wallet、TokenPocket、Bitget Wallet、Phantom
 * 修复：MetaMask 连接失败、缓存问题、移动端兼容
 */
(function () {
  'use strict';

  // ─── 样式 ─────────────────────────────────────────────────────────────────────
  const STYLES = `
    @keyframes xicFadeIn { from { opacity:0; transform:translateY(-10px) scale(0.97); } to { opacity:1; transform:translateY(0) scale(1); } }
    @keyframes xicOverlayIn { from { opacity:0; } to { opacity:1; } }
    @keyframes xicToastIn { from { opacity:0; transform:translateX(-50%) translateY(20px); } to { opacity:1; transform:translateX(-50%) translateY(0); } }
    @keyframes xicSpin { from { transform:rotate(0deg); } to { transform:rotate(360deg); } }

    #xic-wallet-overlay {
      display: none;
      position: fixed;
      inset: 0;
      background: rgba(0,0,0,0.75);
      backdrop-filter: blur(6px);
      z-index: 999998;
      align-items: center;
      justify-content: center;
      animation: xicOverlayIn 0.25s ease;
    }
    #xic-wallet-overlay.open { display: flex; }

    #xic-wallet-modal {
      background: linear-gradient(145deg, #1a1b2e, #16213e);
      border: 1px solid rgba(99,102,241,0.3);
      border-radius: 20px;
      padding: 28px;
      width: 420px;
      max-width: calc(100vw - 32px);
      max-height: 90vh;
      overflow-y: auto;
      box-shadow: 0 25px 60px rgba(0,0,0,0.6), 0 0 0 1px rgba(255,255,255,0.05);
      animation: xicFadeIn 0.3s cubic-bezier(0.34,1.56,0.64,1);
      font-family: 'Plus Jakarta Sans', 'Inter', -apple-system, sans-serif;
    }

    #xic-wallet-modal::-webkit-scrollbar { width: 4px; }
    #xic-wallet-modal::-webkit-scrollbar-track { background: transparent; }
    #xic-wallet-modal::-webkit-scrollbar-thumb { background: rgba(99,102,241,0.4); border-radius: 2px; }

    .xic-modal-header {
      display: flex;
      align-items: center;
      justify-content: space-between;
      margin-bottom: 6px;
    }
    .xic-modal-title {
      font-size: 20px;
      font-weight: 700;
      color: #fff;
      letter-spacing: -0.3px;
    }
    .xic-modal-subtitle {
      font-size: 13px;
      color: rgba(255,255,255,0.5);
      margin-bottom: 20px;
    }
    #xic-close-btn {
      background: rgba(255,255,255,0.08);
      border: none;
      color: rgba(255,255,255,0.7);
      width: 32px;
      height: 32px;
      border-radius: 8px;
      cursor: pointer;
      font-size: 16px;
      display: flex;
      align-items: center;
      justify-content: center;
      transition: all 0.2s;
      flex-shrink: 0;
    }
    #xic-close-btn:hover { background: rgba(255,255,255,0.15); color: #fff; }

    .xic-wallet-grid {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 10px;
      margin-bottom: 16px;
    }

    .xic-wallet-btn {
      background: rgba(255,255,255,0.05);
      border: 1px solid rgba(255,255,255,0.08);
      border-radius: 14px;
      padding: 14px 12px;
      cursor: pointer;
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 8px;
      transition: all 0.2s;
      position: relative;
      text-align: center;
    }
    .xic-wallet-btn:hover {
      background: rgba(99,102,241,0.15);
      border-color: rgba(99,102,241,0.4);
      transform: translateY(-2px);
      box-shadow: 0 8px 24px rgba(99,102,241,0.2);
    }
    .xic-wallet-btn:active { transform: translateY(0); }
    .xic-wallet-btn.loading { pointer-events: none; opacity: 0.7; }
    .xic-wallet-btn.detected {
      border-color: rgba(16,185,129,0.4);
      background: rgba(16,185,129,0.06);
    }

    .xic-wallet-icon {
      width: 44px;
      height: 44px;
      border-radius: 12px;
      overflow: hidden;
      flex-shrink: 0;
    }
    .xic-wallet-icon svg, .xic-wallet-icon img { width: 100%; height: 100%; }

    .xic-wallet-name {
      font-size: 13px;
      font-weight: 600;
      color: #fff;
      line-height: 1.2;
    }
    .xic-wallet-desc {
      font-size: 11px;
      color: rgba(255,255,255,0.45);
      line-height: 1.3;
    }
    .xic-wallet-network {
      font-size: 10px;
      font-weight: 600;
      padding: 2px 8px;
      border-radius: 20px;
      background: rgba(99,102,241,0.2);
      color: rgba(99,102,241,0.9);
      letter-spacing: 0.3px;
    }
    .xic-detected-dot {
      position: absolute;
      top: 10px;
      right: 10px;
      width: 8px;
      height: 8px;
      background: #10b981;
      border-radius: 50%;
      box-shadow: 0 0 6px #10b981;
    }
    .xic-spinner {
      width: 20px;
      height: 20px;
      border: 2px solid rgba(255,255,255,0.2);
      border-top-color: #fff;
      border-radius: 50%;
      animation: xicSpin 0.8s linear infinite;
      margin: 0 auto;
    }

    .xic-modal-footer {
      text-align: center;
      font-size: 12px;
      color: rgba(255,255,255,0.35);
      padding-top: 12px;
      border-top: 1px solid rgba(255,255,255,0.06);
    }
    .xic-modal-footer a {
      color: rgba(99,102,241,0.8);
      text-decoration: none;
    }
    .xic-modal-footer a:hover { color: #818cf8; text-decoration: underline; }

    .xic-install-hint {
      background: rgba(245,158,11,0.1);
      border: 1px solid rgba(245,158,11,0.25);
      border-radius: 12px;
      padding: 12px 14px;
      margin-top: 12px;
      font-size: 12px;
      color: rgba(255,255,255,0.7);
      display: none;
    }
    .xic-install-hint.show { display: block; }
    .xic-install-hint strong { color: #fbbf24; }
    .xic-install-hint a {
      color: #fbbf24;
      font-weight: 600;
      text-decoration: none;
    }
    .xic-install-hint a:hover { text-decoration: underline; }

    .xic-connected-banner {
      background: linear-gradient(135deg, rgba(16,185,129,0.15), rgba(5,150,105,0.1));
      border: 1px solid rgba(16,185,129,0.3);
      border-radius: 12px;
      padding: 12px 16px;
      margin-bottom: 16px;
      display: none;
      align-items: center;
      gap: 10px;
    }
    .xic-connected-banner.show { display: flex; }
    .xic-connected-dot {
      width: 10px;
      height: 10px;
      background: #10b981;
      border-radius: 50%;
      box-shadow: 0 0 8px #10b981;
      flex-shrink: 0;
    }
    .xic-connected-text { flex: 1; }
    .xic-connected-label { font-size: 11px; color: rgba(255,255,255,0.5); }
    .xic-connected-addr { font-size: 13px; font-weight: 600; color: #10b981; font-family: monospace; }
    .xic-disconnect-btn {
      background: rgba(239,68,68,0.15);
      border: 1px solid rgba(239,68,68,0.3);
      color: #f87171;
      border-radius: 8px;
      padding: 4px 10px;
      font-size: 11px;
      cursor: pointer;
      transition: all 0.2s;
    }
    .xic-disconnect-btn:hover { background: rgba(239,68,68,0.25); }
  `;

  // ─── 钱包配置 ─────────────────────────────────────────────────────────────────
  const WALLETS = [
    {
      id: 'metamask',
      name: 'MetaMask',
      desc: '最流行的以太坊钱包',
      network: 'ETH/BSC',
      installUrl: 'https://metamask.io/download/',
      icon: `<svg viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg"><rect width="40" height="40" rx="10" fill="#F6851B"/><path d="M32 10L22.5 17L24.3 13L32 10Z" fill="#E2761B"/><path d="M8 10L17.4 17.1L15.7 13L8 10Z" fill="#E4761B"/><path d="M28.7 26.5L26.1 30.5L31.4 32L33 26.6L28.7 26.5Z" fill="#E4761B"/><path d="M7 26.6L8.6 32L13.9 30.5L11.3 26.5L7 26.6Z" fill="#E4761B"/><path d="M13.6 21.5L12 24L17.2 24.3L17 18.8L13.6 21.5Z" fill="#E4761B"/><path d="M26.4 21.5L22.9 18.7L22.8 24.3L28 24L26.4 21.5Z" fill="#E4761B"/><path d="M13.9 30.5L16.8 29L14.3 26.6L13.9 30.5Z" fill="#E4761B"/><path d="M23.2 29L26.1 30.5L25.7 26.6L23.2 29Z" fill="#E4761B"/></svg>`,
      detect: () => {
        // 检测 MetaMask：window.ethereum.isMetaMask 或 window.ethereum providers 数组
        if (window.ethereum) {
          if (window.ethereum.isMetaMask) return true;
          if (window.ethereum.providers) {
            return window.ethereum.providers.some(p => p.isMetaMask);
          }
        }
        return false;
      },
      connect: connectMetaMask,
    },
    {
      id: 'tronlink',
      name: 'TronLink',
      desc: 'TRON 官方钱包',
      network: 'TRON',
      installUrl: 'https://www.tronlink.org/',
      icon: `<svg viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg"><rect width="40" height="40" rx="10" fill="#EF0027"/><path d="M20 8L32 15V25L20 32L8 25V15L20 8Z" fill="#FF3355" opacity="0.3"/><path d="M20 10L30 16.5V23.5L20 30L10 23.5V16.5L20 10Z" fill="white" opacity="0.9"/><path d="M20 14L26 17.5V24.5L20 28L14 24.5V17.5L20 14Z" fill="#EF0027"/></svg>`,
      detect: () => !!(window.tronLink || (window.tronWeb && window.tronWeb.ready)),
      connect: connectTronLink,
    },
    {
      id: 'okx',
      name: 'OKX Wallet',
      desc: 'OKX 多链钱包',
      network: 'TRON/ETH',
      installUrl: 'https://www.okx.com/web3',
      icon: `<svg viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg"><rect width="40" height="40" rx="10" fill="#000"/><rect x="10" y="10" width="8" height="8" rx="1" fill="white"/><rect x="22" y="10" width="8" height="8" rx="1" fill="white"/><rect x="16" y="16" width="8" height="8" rx="1" fill="white"/><rect x="10" y="22" width="8" height="8" rx="1" fill="white"/><rect x="22" y="22" width="8" height="8" rx="1" fill="white"/></svg>`,
      detect: () => !!(window.okxwallet || (window.ethereum && window.ethereum.isOkxWallet)),
      connect: connectOKX,
    },
    {
      id: 'trust',
      name: 'Trust Wallet',
      desc: '币安官方钱包',
      network: 'TRON/ETH',
      installUrl: 'https://trustwallet.com/download',
      icon: `<svg viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg"><rect width="40" height="40" rx="10" fill="#3375BB"/><path d="M20 8L30 12V20C30 25.5 25.5 30.5 20 32C14.5 30.5 10 25.5 10 20V12L20 8Z" fill="white"/><path d="M16 20L18.5 22.5L24 17" stroke="#3375BB" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"/></svg>`,
      detect: () => !!(window.trustwallet || (window.ethereum && window.ethereum.isTrust)),
      connect: connectTrust,
    },
    {
      id: 'tokenpocket',
      name: 'TokenPocket',
      desc: '多链 DeFi 钱包',
      network: 'TRON/ETH',
      installUrl: 'https://www.tokenpocket.pro/',
      icon: `<svg viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg"><rect width="40" height="40" rx="10" fill="#2980FE"/><rect x="10" y="12" width="20" height="4" rx="2" fill="white"/><rect x="10" y="18" width="14" height="4" rx="2" fill="white"/><rect x="10" y="24" width="17" height="4" rx="2" fill="white"/></svg>`,
      detect: () => !!(window.tokenpocket || (window.ethereum && window.ethereum.isTokenPocket)),
      connect: connectTokenPocket,
    },
    {
      id: 'bitget',
      name: 'Bitget Wallet',
      desc: 'Bitget 交易所钱包',
      network: 'TRON/ETH',
      installUrl: 'https://web3.bitget.com/zh-CN/wallet-download',
      icon: `<svg viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg"><rect width="40" height="40" rx="10" fill="#00F0FF"/><path d="M12 20C12 15.6 15.6 12 20 12C22.2 12 24.2 12.9 25.7 14.3L28 12C26 10.1 23.1 9 20 9C13.9 9 9 13.9 9 20C9 26.1 13.9 31 20 31C23.1 31 26 29.9 28 28L25.7 25.7C24.2 27.1 22.2 28 20 28C15.6 28 12 24.4 12 20Z" fill="#1A1A2E"/></svg>`,
      detect: () => !!(window.bitkeep || (window.ethereum && window.ethereum.isBitKeep)),
      connect: connectBitget,
    },
    {
      id: 'phantom',
      name: 'Phantom',
      desc: 'Solana & 多链钱包',
      network: 'SOL/ETH',
      installUrl: 'https://phantom.app/download',
      icon: `<svg viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg"><rect width="40" height="40" rx="10" fill="#AB9FF2"/><path d="M20 9C14 9 9 14 9 20C9 26 14 31 20 31C26 31 31 26 31 20C31 14 26 9 20 9ZM20 27C16.1 27 13 23.9 13 20C13 16.1 16.1 13 20 13C23.9 13 27 16.1 27 20C27 23.9 23.9 27 20 27Z" fill="white"/><circle cx="17" cy="19" r="2" fill="white"/><circle cx="23" cy="19" r="2" fill="white"/></svg>`,
      detect: () => !!(window.phantom),
      connect: connectPhantom,
    },
  ];

  // ─── 状态 ─────────────────────────────────────────────────────────────────────
  let currentWallet = null;
  let currentAddress = null;
  let modalEl = null;
  let overlayEl = null;
  let isInjected = false;
  let installHintEl = null;
  let connectedBannerEl = null;

  // ─── 工具函数 ─────────────────────────────────────────────────────────────────
  function shortenAddr(addr) {
    if (!addr) return '';
    if (addr.length > 20) return addr.slice(0, 8) + '...' + addr.slice(-6);
    return addr;
  }

  function showToast(msg, type = 'info') {
    const colors = { info: '#6366f1', success: '#10b981', error: '#ef4444', warn: '#f59e0b' };
    // 移除已有 toast
    document.querySelectorAll('.xic-toast').forEach(t => t.remove());
    const toast = document.createElement('div');
    toast.className = 'xic-toast';
    toast.style.cssText = `
      position:fixed; bottom:28px; left:50%; transform:translateX(-50%);
      background:${colors[type] || colors.info}; color:#fff;
      padding:12px 24px; border-radius:12px; font-size:14px; font-weight:600;
      z-index:9999999; box-shadow:0 8px 32px rgba(0,0,0,0.4);
      font-family:'Plus Jakarta Sans','Inter',sans-serif;
      animation: xicToastIn 0.3s ease;
      pointer-events:none; white-space:nowrap; max-width:90vw;
    `;
    toast.textContent = msg;
    document.body.appendChild(toast);
    setTimeout(() => toast.remove(), 4000);
  }

  function getEthProvider() {
    // 获取 MetaMask provider（处理多钱包共存的情况）
    if (!window.ethereum) return null;
    if (window.ethereum.isMetaMask) return window.ethereum;
    // 多钱包共存时，从 providers 数组中找 MetaMask
    if (window.ethereum.providers) {
      const mm = window.ethereum.providers.find(p => p.isMetaMask);
      if (mm) return mm;
    }
    return null;
  }

  // ─── 钱包连接函数 ─────────────────────────────────────────────────────────────
  async function connectMetaMask() {
    const provider = getEthProvider();

    if (!provider) {
      // 检测是否是移动端
      const isMobile = /Android|iPhone|iPad|iPod/i.test(navigator.userAgent);
      if (isMobile) {
        // 移动端：尝试通过 MetaMask 深链接打开
        
        console.log("[XIC] MetaMask mobile deeplink blocked");
        throw new Error('正在跳转到 MetaMask App...');
      }
      // 桌面端：显示安装提示
      showInstallHint('metamask');
      throw new Error('MetaMask 未安装');
    }

    try {
      // 请求账户授权
      const accounts = await provider.request({ method: 'eth_requestAccounts' });
      if (!accounts || accounts.length === 0) {
        throw new Error('用户拒绝了连接请求');
      }

      const address = accounts[0];

      // 获取当前链信息
      let chainId = null;
      try {
        chainId = await provider.request({ method: 'eth_chainId' });
      } catch (e) {}

      console.log('[XIC Wallet] MetaMask 连接成功:', address, 'chainId:', chainId);
      return { address, type: 'eth', chainId };
    } catch (err) {
      if (err.code === 4001) {
        throw new Error('用户取消了连接');
      }
      if (err.code === -32002) {
        throw new Error('MetaMask 正在等待确认，请打开 MetaMask 扩展');
      }
      throw err;
    }
  }

  async function connectTronLink() {
    // 方式1：新版 TronLink API
    if (window.tronLink) {
      try {
        const res = await window.tronLink.request({ method: 'tron_requestAccounts' });
        if (res && (res.code === 200 || res.code === 4000)) {
          await new Promise(r => setTimeout(r, 500));
          const addr = window.tronWeb?.defaultAddress?.base58;
          if (addr) return { address: addr, type: 'tron' };
        }
      } catch (e) {
        console.warn('[XIC Wallet] TronLink new API failed:', e);
      }
    }
    // 方式2：旧版 tronWeb
    if (window.tronWeb && window.tronWeb.ready) {
      const addr = window.tronWeb.defaultAddress?.base58;
      if (addr) return { address: addr, type: 'tron' };
    }
    // 未安装
    showInstallHint('tronlink');
    throw new Error('请先安装 TronLink 钱包');
  }

  async function connectOKX() {
    // OKX TRON
    if (window.okxwallet?.tronLink) {
      try {
        const res = await window.okxwallet.tronLink.request({ method: 'tron_requestAccounts' });
        if (res?.code === 200) {
          const addr = window.okxwallet.tronLink.tronWeb?.defaultAddress?.base58;
          if (addr) return { address: addr, type: 'tron' };
        }
      } catch (e) {}
    }
    // OKX ETH
    if (window.okxwallet) {
      try {
        const accounts = await window.okxwallet.request({ method: 'eth_requestAccounts' });
        if (accounts?.[0]) return { address: accounts[0], type: 'eth' };
      } catch (e) {}
    }
    // 通用 ethereum（OKX 注入）
    if (window.ethereum?.isOkxWallet) {
      const accounts = await window.ethereum.request({ method: 'eth_requestAccounts' });
      if (accounts?.[0]) return { address: accounts[0], type: 'eth' };
    }
    showInstallHint('okx');
    throw new Error('请先安装 OKX Wallet');
  }

  async function connectTrust() {
    if (window.trustwallet) {
      try {
        const accounts = await window.trustwallet.request({ method: 'eth_requestAccounts' });
        if (accounts?.[0]) return { address: accounts[0], type: 'eth' };
      } catch (e) {}
    }
    if (window.ethereum?.isTrust) {
      const accounts = await window.ethereum.request({ method: 'eth_requestAccounts' });
      if (accounts?.[0]) return { address: accounts[0], type: 'eth' };
    }
    // 移动端深链接
    const isMobile = /Android|iPhone|iPad|iPod/i.test(navigator.userAgent);
    if (isMobile) {
      console.log("[XIC] Trust Wallet deeplink blocked");
      throw new Error('正在跳转到 Trust Wallet...');
    }
    showInstallHint('trust');
    throw new Error('请先安装 Trust Wallet');
  }

  async function connectTokenPocket() {
    if (window.tokenpocket) {
      try {
        const accounts = await window.tokenpocket.request({ method: 'eth_requestAccounts' });
        if (accounts?.[0]) return { address: accounts[0], type: 'eth' };
      } catch (e) {}
    }
    if (window.ethereum?.isTokenPocket) {
      const accounts = await window.ethereum.request({ method: 'eth_requestAccounts' });
      if (accounts?.[0]) return { address: accounts[0], type: 'eth' };
    }
    showInstallHint('tokenpocket');
    throw new Error('请先安装 TokenPocket');
  }

  async function connectBitget() {
    if (window.bitkeep?.ethereum) {
      try {
        const accounts = await window.bitkeep.ethereum.request({ method: 'eth_requestAccounts' });
        if (accounts?.[0]) return { address: accounts[0], type: 'eth' };
      } catch (e) {}
    }
    if (window.ethereum?.isBitKeep) {
      const accounts = await window.ethereum.request({ method: 'eth_requestAccounts' });
      if (accounts?.[0]) return { address: accounts[0], type: 'eth' };
    }
    showInstallHint('bitget');
    throw new Error('请先安装 Bitget Wallet');
  }

  async function connectPhantom() {
    if (window.phantom?.ethereum) {
      try {
        const accounts = await window.phantom.ethereum.request({ method: 'eth_requestAccounts' });
        if (accounts?.[0]) return { address: accounts[0], type: 'eth' };
      } catch (e) {}
    }
    if (window.phantom?.solana) {
      try {
        const resp = await window.phantom.solana.connect();
        if (resp?.publicKey) return { address: resp.publicKey.toString(), type: 'sol' };
      } catch (e) {}
    }
    showInstallHint('phantom');
    throw new Error('请先安装 Phantom 钱包');
  }

  // ─── 安装提示 ─────────────────────────────────────────────────────────────────
  function showInstallHint(walletId) {
    const wallet = WALLETS.find(w => w.id === walletId);
    if (!wallet || !installHintEl) return;
    installHintEl.innerHTML = `
      <strong>⚠️ ${wallet.name} 未安装</strong><br>
      请先安装 ${wallet.name} 钱包扩展，然后刷新页面重试。<br>
      <a href="${wallet.installUrl}" target="_blank" rel="noopener">👉 点击下载 ${wallet.name}</a>
    `;
    installHintEl.classList.add('show');
  }

  // ─── 连接成功处理 ─────────────────────────────────────────────────────────────
  function onConnected(address, wallet) {
    currentAddress = address;
    currentWallet = wallet;

    // 更新 modal 内的已连接横幅
    if (connectedBannerEl) {
      connectedBannerEl.querySelector('.xic-connected-addr').textContent = shortenAddr(address);
      connectedBannerEl.querySelector('.xic-connected-label').textContent = `已连接 ${wallet.name}`;
      connectedBannerEl.classList.add('show');
    }

    // 更新导航栏按钮
    updateNavbarBtn(address);

    // 关闭弹窗
    setTimeout(() => closeModal(), 800);

    // 显示成功提示
    showToast(`✅ ${wallet.name} 连接成功：${shortenAddr(address)}`, 'success');

    // 监听账户变更
    if (wallet.id === 'metamask') {
      const provider = getEthProvider();
      if (provider) {
        provider.on('accountsChanged', (accounts) => {
          if (accounts.length === 0) {
            onDisconnected();
          } else {
            currentAddress = accounts[0];
            updateNavbarBtn(accounts[0]);
          }
        });
      }
    }
  }

  function onDisconnected() {
    currentAddress = null;
    currentWallet = null;
    if (connectedBannerEl) connectedBannerEl.classList.remove('show');
    updateNavbarBtn(null);
    showToast('钱包已断开连接', 'warn');
  }

  function updateNavbarBtn(address) {
    const btn = findConnectBtn();
    if (!btn) return;
    if (address) {
      btn.textContent = shortenAddr(address);
      btn.style.cssText = `
        background: linear-gradient(135deg, #10b981, #059669) !important;
        color: #fff !important;
        border: none !important;
        border-radius: 10px !important;
        padding: 10px 18px !important;
        font-weight: 700 !important;
        cursor: pointer !important;
        font-size: 13px !important;
      `;
    } else {
      btn.textContent = 'Connect Wallet';
      btn.style.cssText = '';
    }
  }

  // ─── 渲染钱包列表 ─────────────────────────────────────────────────────────────
  function renderWalletGrid() {
    const grid = modalEl.querySelector('.xic-wallet-grid');
    if (!grid) return;
    grid.innerHTML = '';

    WALLETS.forEach(wallet => {
      const detected = wallet.detect();
      const btn = document.createElement('button');
      btn.className = 'xic-wallet-btn' + (detected ? ' detected' : '');
      btn.innerHTML = `
        ${detected ? '<span class="xic-detected-dot"></span>' : ''}
        <div class="xic-wallet-icon">${wallet.icon}</div>
        <div class="xic-wallet-name">${wallet.name}</div>
        <div class="xic-wallet-desc">${wallet.desc}</div>
        <div class="xic-wallet-network">${wallet.network}</div>
      `;
      btn.addEventListener('click', () => handleWalletClick(wallet, btn));
      grid.appendChild(btn);
    });
  }

  async function handleWalletClick(wallet, btn) {
    // 隐藏安装提示
    if (installHintEl) installHintEl.classList.remove('show');

    // 显示加载状态
    const originalHTML = btn.innerHTML;
    btn.classList.add('loading');
    btn.innerHTML = `<div class="xic-spinner"></div><div class="xic-wallet-name" style="margin-top:8px">连接中...</div>`;

    try {
      const result = await wallet.connect();
      onConnected(result.address, wallet);
    } catch (err) {
      console.error('[XIC Wallet] 连接失败:', err);
      // 恢复按钮状态
      btn.classList.remove('loading');
      btn.innerHTML = originalHTML;

      const msg = err.message || '连接失败';
      if (!msg.includes('未安装') && !msg.includes('Not installed')) {
        showToast('❌ ' + msg, 'error');
      }
    }
  }

  // ─── 创建弹窗 ─────────────────────────────────────────────────────────────────
  function createModal() {
    // 注入样式
    if (!document.getElementById('xic-wallet-styles')) {
      const style = document.createElement('style');
      style.id = 'xic-wallet-styles';
      style.textContent = STYLES;
      document.head.appendChild(style);
    }

    // 创建遮罩层
    overlayEl = document.createElement('div');
    overlayEl.id = 'xic-wallet-overlay';

    // 创建弹窗
    modalEl = document.createElement('div');
    modalEl.id = 'xic-wallet-modal';
    modalEl.innerHTML = `
      <div class="xic-modal-header">
        <div class="xic-modal-title">连接钱包</div>
        <button id="xic-close-btn">✕</button>
      </div>
      <div class="xic-modal-subtitle">选择您的钱包以继续购买 XIC</div>

      <div class="xic-connected-banner">
        <div class="xic-connected-dot"></div>
        <div class="xic-connected-text">
          <div class="xic-connected-label">已连接</div>
          <div class="xic-connected-addr"></div>
        </div>
        <button class="xic-disconnect-btn">断开</button>
      </div>

      <div class="xic-wallet-grid"></div>

      <div class="xic-install-hint"></div>

      <div class="xic-modal-footer">
        没有钱包？
        <a href="https://metamask.io/download/" target="_blank" rel="noopener">下载 MetaMask</a>
        或
        <a href="https://www.tronlink.org/" target="_blank" rel="noopener">下载 TronLink</a>
      </div>
    `;

    overlayEl.appendChild(modalEl);
    document.body.appendChild(overlayEl);

    // 获取引用
    connectedBannerEl = modalEl.querySelector('.xic-connected-banner');
    installHintEl = modalEl.querySelector('.xic-install-hint');

    // 关闭按钮
    modalEl.querySelector('#xic-close-btn').addEventListener('click', closeModal);

    // 断开连接按钮
    modalEl.querySelector('.xic-disconnect-btn').addEventListener('click', () => {
      onDisconnected();
      closeModal();
    });

    // 点击遮罩关闭
    overlayEl.addEventListener('click', (e) => {
      if (e.target === overlayEl) closeModal();
    });

    // ESC 关闭
    document.addEventListener('keydown', (e) => {
      if (e.key === 'Escape') closeModal();
    });

    // 渲染钱包列表
    renderWalletGrid();
  }

  // ─── 弹窗控制 ─────────────────────────────────────────────────────────────────
  function openModal() {
    if (!overlayEl) createModal();
    overlayEl.classList.add('open');
    // 刷新检测状态
    renderWalletGrid();
    // 如果已连接，显示已连接状态
    if (currentAddress && connectedBannerEl) {
      connectedBannerEl.querySelector('.xic-connected-addr').textContent = shortenAddr(currentAddress);
      connectedBannerEl.querySelector('.xic-connected-label').textContent = `已连接 ${currentWallet?.name || ''}`;
      connectedBannerEl.classList.add('show');
    }
    if (installHintEl) installHintEl.classList.remove('show');
  }

  function closeModal() {
    if (overlayEl) overlayEl.classList.remove('open');
  }

  // ─── 找到连接按钮 ─────────────────────────────────────────────────────────────
  function findConnectBtn() {
    const selectors = [
      'button[class*="wallet"]',
      'button[class*="connect"]',
      'button[class*="Connect"]',
    ];
    // 先用文本匹配
    const allBtns = document.querySelectorAll('button');
    for (const btn of allBtns) {
      const text = (btn.textContent || '').trim();
      if (
        text === 'Select Wallet' ||
        text === 'Connect Wallet' ||
        text === 'Connect' ||
        text.startsWith('Connecting') ||
        text === 'Change wallet'
      ) {
        return btn;
      }
    }
    // 再用 class 匹配
    for (const sel of selectors) {
      const el = document.querySelector(sel);
      if (el) return el;
    }
    return null;
  }

  // ─── 注入拦截器 ───────────────────────────────────────────────────────────────
  function injectInterceptor() {
    const btn = findConnectBtn();
    if (btn && !btn.dataset.xicInjected) {
      // 克隆按钮移除原有监听器
      const newBtn = btn.cloneNode(true);
      newBtn.dataset.xicInjected = 'true';
      newBtn.addEventListener('click', (e) => {
        e.stopPropagation();
        e.preventDefault();
        openModal();
      });
      btn.parentNode.replaceChild(newBtn, btn);
      isInjected = true;
      console.log('[XIC Wallet] v2.1 多钱包连接器已注入');
    }
  }

  // ─── 暴露全局 API ─────────────────────────────────────────────────────────────
  window.XICWallet = {
    open: openModal,
    close: closeModal,
    getAddress: () => currentAddress,
    getWallet: () => currentWallet,
    isConnected: () => !!currentAddress,
    disconnect: onDisconnected,
  };

  // ─── 初始化 ───────────────────────────────────────────────────────────────────
  function init() {
    // 使用 MutationObserver 持续监听 DOM
    const observer = new MutationObserver(() => {
      if (!isInjected) injectInterceptor();
    });

    if (document.body) {
      observer.observe(document.body, { childList: true, subtree: true });
      injectInterceptor();
    } else {
      document.addEventListener('DOMContentLoaded', () => {
        observer.observe(document.body, { childList: true, subtree: true });
        injectInterceptor();
      });
    }

    // 多次重试确保注入成功（React 渲染后）
    [500, 1000, 1500, 2500, 4000].forEach(delay => {
      setTimeout(() => {
        if (!isInjected) injectInterceptor();
      }, delay);
    });
  }

  init();
})();
