Apple Tv+ subtitle offsets downward

appletv_subtitle.js

/**
 * Paste it in the console of a browser tab which is playing the video with subtitle turned on.
 * The JavaScript code access to `shadowRoot` of the DOM elements and inject inline CSS by <style> tag.
 * And print the subtitle to the console panel.
 * It aims to help people do not want to be distracted by subtitle, but sometimes want to read it.
 * Good for language learners! (I guess ;-)
 *
 * Note: CSS selectors are subject to change by Apple without any notices.
 *
 * @domain: https://tv.apple.com/hk/show/
 *
 * @author: oktak
 * @date: 2020-09-18
 */
document.querySelectorAll("apple-tv-plus-player.hydrated")[0].shadowRoot.querySelectorAll('amp-video-player-internal')[0].shadowRoot.querySelectorAll('amp-video-player')[0].style.overflow = "visible";

var a = document.createElement("style");
a.innerHTML = `
.video-container > div div div { top: 100px !important; }
.video-container div { background: none transparent !important; }
`;

var parent = document.querySelectorAll("apple-tv-plus-player.hydrated")[0].shadowRoot.querySelectorAll('amp-video-player-internal')[0].shadowRoot.querySelectorAll('amp-video-player')[0].shadowRoot.querySelectorAll('.video-container')[0]
var ref = document.querySelectorAll("apple-tv-plus-player.hydrated")[0].shadowRoot.querySelectorAll('amp-video-player-internal')[0].shadowRoot.querySelectorAll('amp-video-player')[0].shadowRoot.querySelectorAll('.video-container > video')[0]
parent.insertBefore(a, ref);

setInterval(function () {
  try {
    console.log(document.querySelectorAll("apple-tv-plus-player.hydrated")[0].shadowRoot.querySelectorAll('amp-video-player-internal')[0].shadowRoot.querySelectorAll('amp-video-player')[0].shadowRoot.querySelectorAll('.video-container')[0].innerText)
  } catch (e) {
    // NOP
  }
}, 160);