Bonus Bar Builder

Your Code:

<div id="popupOverlay" style="position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,0.7);z-index:9998;display:flex;justify-content:center;align-items:center;">
  <div style="background:linear-gradient(135deg,royalblue,magenta);color:gold;font-family:'Playfair Display',serif;padding:2rem;max-width:500px;width:90%;border-radius:16px;text-align:center;animation:pulse 2s infinite;position:relative;">
    <button onclick="document.getElementById('popupOverlay').style.display='none';document.getElementById('showPopupBonus').style.display='block';" aria-label="Close bonus message" title="Close" style="position:absolute;top:10px;right:14px;background:gold;color:royalblue;border:none;border-radius:50%;font-size:1.1rem;width:26px;height:26px;cursor:pointer;">×</button>
    <h2>{{HEADLINE}}</h2>
    <p>{{SUBTEXT}}</p>
    <a href="{{URL}}" style="background:gold;color:royalblue;text-decoration:none;padding:0.6rem 1.2rem;border-radius:6px;font-weight:bold;" target="_blank">Access Bonus</a>
  </div>
</div>
<div id="showPopupBonus" style="display:none;position:fixed;bottom:10px;right:10px;z-index:9999;">
  <button onclick="document.getElementById('popupOverlay').style.display='flex';this.style.display='none';" style="background:gold;color:royalblue;padding:0.4rem 0.75rem;border:none;border-radius:5px;font-weight:bold;">Show Bonus</button>
</div>