Safari is not showing the top 1 pixel of the webpage?

With the following HTML:

<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Document</title>
  <style>
    body {
      margin: 0;
      padding: 0;
    }
    div {
      border: 1px solid yellow;
      height: 100px;
    }
  </style>
</head>
<body>
  <div></div>
</body>
</html>

This page is hosted on https://vrot.nl/test.html.

If you open this in Safari, the top border of the div is not shown. You have to scroll the page down to see the top border, it's inside the "rubber band effect" area so to speak.

No other browsers have this problem it seems. What is causing this, and how can I work around this so that all browsers look the same?

Solution

It seems to only affect Safari, and only in Dark Mode. So, this bit of CSS fixes the issue:

@supports (-webkit-hyphens:none) {
  @media (prefers-color-scheme: dark) {
    body {
      padding-top: 1px;
    }
  }
}

It's crazy that this is necessary though. I've submitted a bug report to Apple (FB12075967).