Strange visual bug on TV Box Chrome browser

I'm developing a web browser based dashboard to replace an old dashboard that will be displayed on TVs via a TV Box (X96 mini).

I'm running into an issue with a visual glitch that is difficult to describe. I've attached a picture below for reference.

I'm only experiencing this issue on the TV box displays. I've tested on a TV plugged into a laptop as well as tested on regular desktop browsers and did not experience the same issue.

The TV box does not have the same issue for other websites. The previous dashboard (developed in Bubble.io) has no issues. The TV box uses Android Webview. The browser is in Desktop mode, but has been tested on the other mode with the same results.

The issue is consistent, always appearing on the right-hand side with the same pattern of smaller to larger.

When I run a custom action to make the browser fullscreen, the problem gets worse. The bug covers most of the right-hand side of the screen from top to bottom with no gaps between the "tears", while also introducing horizontal "tears" that occupy the top half of the screen in strips.

I've attached more images below.

I'll omit most of what I've tried so far since the issue persisted when I removed basically everything.

I created a blank page and added one image (Diagonal lines, to visualize the issue). I removed all onPageLoad actions and set the new page as the landing page. The new landing page contains nothing except the image.

I've tried changing the Canvas setting, the PWA setting, updating the Chrome version on the TV box, using Original Engine Optimization, using more images, fixing the image size to not be affected by resolution, changing the image fill options, changing the zoom on the TV, turning it off and on again, and more that I can't recall off the top of my head.

The issue still persists.