(() => {
  const old = document.getElementById('btp20-webhook-panel');
  if (old) old.remove();

  const panel = document.createElement('div');
  panel.id = 'btp20-webhook-panel';
  panel.style.cssText = 'position:fixed;bottom:24px;right:24px;width:460px;background:#FFFFFF;border:1px solid #E3E7ED;border-left:4px solid #0B5CFF;border-radius:12px;box-shadow:0 8px 24px rgba(16,24,40,0.12);padding:16px 20px;z-index:99999;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:#101828;';

  panel.innerHTML = `
    <div style="display:flex;align-items:center;justify-content:space-between;margin-bottom:10px;">
      <div style="display:flex;align-items:center;gap:8px;">
        <span style="display:inline-block;width:8px;height:8px;border-radius:50%;background:#12B76A;"></span>
        <strong style="font-size:14px;font-weight:600;color:#101828;">Webhook 自动化分发 & 推送集成联动</strong>
      </div>
      <span style="font-size:12px;background:#EAF1FF;color:#0B5CFF;padding:2px 8px;border-radius:10px;font-weight:500;">出海实时联动</span>
    </div>
    <div style="font-size:12px;line-height:1.6;color:#667085;background:#F7F8FA;border:1px solid #E3E7ED;border-radius:8px;padding:10px 12px;">
      <div><strong>流转事件:</strong> <span style="color:#101828;">John Doe (Acme Global Corp)</span> <span style="color:#F79009;">new</span> ➔ <span style="color:#12B76A;font-weight:600;">hot</span></div>
      <div style="margin-top:4px;"><strong>推送目标:</strong> <span style="color:#0B5CFF;word-break:break-all;">https://api.omnicard.ai/webhook/lead-flow</span></div>
      <div style="margin-top:4px;"><strong>验签机制:</strong> <code style="font-size:11px;background:#FFFFFF;padding:1px 4px;border:1px solid #E3E7ED;border-radius:4px;color:#101828;">HMAC-SHA256 (7f8a3c9b1d5e2f4a...)</code></div>
      <div style="margin-top:4px;display:flex;justify-content:space-between;">
        <span><strong>HTTP状态:</strong> <span style="color:#12B76A;font-weight:600;">200 OK (重试: 1次)</span></span>
        <span style="color:#98A2B3;">2026-09-21 01:32:15</span>
      </div>
    </div>
    <div style="margin-top:8px;display:flex;align-items:center;justify-content:space-between;font-size:11px;color:#667085;">
      <span>雷达通知渠道: <strong>CrmRadarPushService [Active]</strong></span>
      <span>流转审计: <strong>已归档 #8921</strong></span>
    </div>
  `;

  document.body.appendChild(panel);
  return 'panel injected successfully';
})();