QHTML: antialias rounded corners for gradient

The built-in example for rounded corners works if the background is a solid color, but as soon as I replaced it with a gradient it fails. We need to:

[x] fix gradients
[x] double-check image tiles
[x] (check if there's anything else?)

<html>
  <head>
    <style>
      body { background-color: white; }
      h2 { padding: 4px 10px 4px 10px; 
           background-image:
      repeating-linear-gradient(190deg, rgba(255, 0, 0, 0.5) 40px,
        rgba(255, 153, 0, 0.5) 80px, rgba(255, 255, 0, 0.5) 120px,
        rgba(0, 255, 0, 0.5) 160px, rgba(0, 0, 255, 0.5) 200px,
        rgba(75, 0, 130, 0.5) 240px, rgba(238, 130, 238, 0.5) 280px,
        rgba(255, 0, 0, 0.5) 300px);
           font: bold 130% sans-serif; 
           color: white; 
           width: max-content; 
           background-clip: border-box; 
           border: transparent; 
           border-radius:10px;}
    </style>
  </head>
  <body>
    <h2>Header 2</h2>
  </body>
</html>

mickleness / pumpernickel

QHTML: antialias rounded corners for gradient #80