I’m using the WeasyPrint library to generate PDFs from HTML and CSS. I want to add a watermark diagonally at the center of each page in the generated PDF. I’ve tried using the following CSS code:

@page {
  size: A3 portrait;
  margin: 47.5mm 0mm 27.5mm 0mm;

  @bottom-center {
    content: counter(page);
    height: 15mm;
  }

  @top-left {
    /* ... */
  }

  @top-center {
    /* ... */
  }

  @top-right {
    /* ... */
  }

  @bottom-right {
    content: "Hello world!";
    color: rgba(0, 0, 0, 0.516);
    font-size: 48px;
    font-weight: bold;
    transform: rotate(-45deg);
    transform-origin: bottom left;
  }
}

However, this code places the watermark at the bottom-right corner of the page instead of the center. I’ve tried adjusting the transform-origin property, but I can’t seem to get the watermark to align diagonally at the center of the page.
How can I align the watermark diagonally at the center of the page in the PDF generated with WeasyPrint?