Bonus Bar Builder

Your Code:

<div id="sideBonus" style="position:fixed;top:100px;right:0;width:280px;background:linear-gradient(180deg,royalblue,magenta);color:gold;font-family:'Playfair Display',serif;box-shadow:-2px 0 6px rgba(0,0,0,0.2);z-index:9999;padding:1rem 1rem 1rem 1rem;border-radius:12px 0 0 12px;animation:pulse 2s infinite;">
  <button onclick="document.getElementById('sideBonus').style.display='none';document.getElementById('showSideBonus').style.display='block';" aria-label="Close bonus message" title="Close" style="position:absolute;top:10px;right:10px;background:gold;color:royalblue;border:none;border-radius:50%;width:26px;height:26px;font-weight:bold;font-size:1.1rem;cursor:pointer;">×</button>
  <h2 style="margin-top:2.5rem;">{{HEADLINE}}</h2>
  <p style="margin:0 0 0.5rem;font-size:0.9rem;">{{SUBTEXT}}</p>
  <a href="{{URL}}" style="display:inline-block;background:gold;color:royalblue;font-weight:bold;text-decoration:none;padding:0.4rem 0.75rem;border-radius:5px;" target="_blank">Access Bonus</a>
</div>
<div id="showSideBonus" style="display:none;position:fixed;bottom:10px;right:10px;z-index:9999;">
  <button onclick="document.getElementById('sideBonus').style.display='block';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>