Shaka 5 upgrade.

package.json

@@ -18,7 +18,7 @@
         "linkify-html": "4.3.2",
         "linkifyjs": "4.3.2",
         "qrcode": "^1.5.3",
-        "shaka-player": "4.16.24",
+        "shaka-player": "5.0.8",
         "vue": "3.5.31",
         "vue-i18n": "11.3.0",
         "vue-router": "5.0.4"
@@ -26,7 +26,7 @@
     "devDependencies": {
         "@iconify-json/fa6-brands": "1.2.6",
         "@iconify-json/fa6-solid": "1.2.4",
-        "@intlify/unplugin-vue-i18n": "6.0.8",
+        "@intlify/unplugin-vue-i18n": "11.1.1",
         "@unocss/eslint-config": "66.4.1",
         "@unocss/preset-icons": "66.4.1",
         "@unocss/preset-uno": "66.4.1",

pnpm-lock.yaml

@@ -30,8 +30,8 @@ importers:
         specifier: ^1.5.3
         version: 1.5.4
       shaka-player:
-        specifier: 4.16.24
+        specifier: 5.0.8
-        version: 4.16.24
+        version: 5.0.8
       vue:
         specifier: 3.5.31
         version: 3.5.31(typescript@5.9.3)
@@ -49,8 +49,8 @@ importers:
         specifier: 1.2.4
         version: 1.2.4
       '@intlify/unplugin-vue-i18n':
-        specifier: 6.0.8
+        specifier: 11.1.1
-        version: 6.0.8(@vue/compiler-dom@3.5.31)(eslint@8.57.1)(rollup@2.80.0)(typescript@5.9.3)(vue-i18n@11.3.0(vue@3.5.31(typescript@5.9.3)))(vue@3.5.31(typescript@5.9.3))
+        version: 11.1.1(@vue/compiler-dom@3.5.31)(eslint@8.57.1)(rollup@2.80.0)(typescript@5.9.3)(vue-i18n@11.3.0(vue@3.5.31(typescript@5.9.3)))(vue@3.5.31(typescript@5.9.3))
       '@unocss/eslint-config':
         specifier: 66.4.1
         version: 66.4.1(eslint@8.57.1)(typescript@5.9.3)
@@ -628,156 +628,312 @@ packages:
     resolution: {integrity: sha512-LwdZHpScM4Qz8Xw2iKSzS+cfglZzJGvofQICy7W7v4caru4EaAmyUuO6BGrbyQ2mYV11W0U8j5mBhd14dd3B0A==}
     engines: {node: '>=6.9.0'}
 
+  '@esbuild/aix-ppc64@0.25.12':
+    resolution: {integrity: sha512-Hhmwd6CInZ3dwpuGTF8fJG6yoWmsToE+vYgD4nytZVxcu1ulHpUQRAB1UJ8+N1Am3Mz4+xOByoQoSZf4D+CpkA==}
+    engines: {node: '>=18'}
+    cpu: [ppc64]
+    os: [aix]
+
   '@esbuild/aix-ppc64@0.27.4':
     resolution: {integrity: sha512-cQPwL2mp2nSmHHJlCyoXgHGhbEPMrEEU5xhkcy3Hs/O7nGZqEpZ2sUtLaL9MORLtDfRvVl2/3PAuEkYZH0Ty8Q==}
     engines: {node: '>=18'}
     cpu: [ppc64]
     os: [aix]
 
+  '@esbuild/android-arm64@0.25.12':
+    resolution: {integrity: sha512-6AAmLG7zwD1Z159jCKPvAxZd4y/VTO0VkprYy+3N2FtJ8+BQWFXU+OxARIwA46c5tdD9SsKGZ/1ocqBS/gAKHg==}
+    engines: {node: '>=18'}
+    cpu: [arm64]
+    os: [android]
+
   '@esbuild/android-arm64@0.27.4':
     resolution: {integrity: sha512-gdLscB7v75wRfu7QSm/zg6Rx29VLdy9eTr2t44sfTW7CxwAtQghZ4ZnqHk3/ogz7xao0QAgrkradbBzcqFPasw==}
     engines: {node: '>=18'}
     cpu: [arm64]
     os: [android]
 
+  '@esbuild/android-arm@0.25.12':
+    resolution: {integrity: sha512-VJ+sKvNA/GE7Ccacc9Cha7bpS8nyzVv0jdVgwNDaR4gDMC/2TTRc33Ip8qrNYUcpkOHUT5OZ0bUcNNVZQ9RLlg==}
+    engines: {node: '>=18'}
+    cpu: [arm]
+    os: [android]
+
   '@esbuild/android-arm@0.27.4':
     resolution: {integrity: sha512-X9bUgvxiC8CHAGKYufLIHGXPJWnr0OCdR0anD2e21vdvgCI8lIfqFbnoeOz7lBjdrAGUhqLZLcQo6MLhTO2DKQ==}
     engines: {node: '>=18'}
     cpu: [arm]
     os: [android]
 
+  '@esbuild/android-x64@0.25.12':
+    resolution: {integrity: sha512-5jbb+2hhDHx5phYR2By8GTWEzn6I9UqR11Kwf22iKbNpYrsmRB18aX/9ivc5cabcUiAT/wM+YIZ6SG9QO6a8kg==}
+    engines: {node: '>=18'}
+    cpu: [x64]
+    os: [android]
+
   '@esbuild/android-x64@0.27.4':
     resolution: {integrity: sha512-PzPFnBNVF292sfpfhiyiXCGSn9HZg5BcAz+ivBuSsl6Rk4ga1oEXAamhOXRFyMcjwr2DVtm40G65N3GLeH1Lvw==}
     engines: {node: '>=18'}
     cpu: [x64]
     os: [android]
 
+  '@esbuild/darwin-arm64@0.25.12':
+    resolution: {integrity: sha512-N3zl+lxHCifgIlcMUP5016ESkeQjLj/959RxxNYIthIg+CQHInujFuXeWbWMgnTo4cp5XVHqFPmpyu9J65C1Yg==}
+    engines: {node: '>=18'}
+    cpu: [arm64]
+    os: [darwin]
+
   '@esbuild/darwin-arm64@0.27.4':
     resolution: {integrity: sha512-b7xaGIwdJlht8ZFCvMkpDN6uiSmnxxK56N2GDTMYPr2/gzvfdQN8rTfBsvVKmIVY/X7EM+/hJKEIbbHs9oA4tQ==}
     engines: {node: '>=18'}
     cpu: [arm64]
     os: [darwin]
 
+  '@esbuild/darwin-x64@0.25.12':
+    resolution: {integrity: sha512-HQ9ka4Kx21qHXwtlTUVbKJOAnmG1ipXhdWTmNXiPzPfWKpXqASVcWdnf2bnL73wgjNrFXAa3yYvBSd9pzfEIpA==}
+    engines: {node: '>=18'}
+    cpu: [x64]
+    os: [darwin]
+
   '@esbuild/darwin-x64@0.27.4':
     resolution: {integrity: sha512-sR+OiKLwd15nmCdqpXMnuJ9W2kpy0KigzqScqHI3Hqwr7IXxBp3Yva+yJwoqh7rE8V77tdoheRYataNKL4QrPw==}
     engines: {node: '>=18'}
     cpu: [x64]
     os: [darwin]
 
+  '@esbuild/freebsd-arm64@0.25.12':
+    resolution: {integrity: sha512-gA0Bx759+7Jve03K1S0vkOu5Lg/85dou3EseOGUes8flVOGxbhDDh/iZaoek11Y8mtyKPGF3vP8XhnkDEAmzeg==}
+    engines: {node: '>=18'}
+    cpu: [arm64]
+    os: [freebsd]
+
   '@esbuild/freebsd-arm64@0.27.4':
     resolution: {integrity: sha512-jnfpKe+p79tCnm4GVav68A7tUFeKQwQyLgESwEAUzyxk/TJr4QdGog9sqWNcUbr/bZt/O/HXouspuQDd9JxFSw==}
     engines: {node: '>=18'}
     cpu: [arm64]
     os: [freebsd]
 
+  '@esbuild/freebsd-x64@0.25.12':
+    resolution: {integrity: sha512-TGbO26Yw2xsHzxtbVFGEXBFH0FRAP7gtcPE7P5yP7wGy7cXK2oO7RyOhL5NLiqTlBh47XhmIUXuGciXEqYFfBQ==}
+    engines: {node: '>=18'}
+    cpu: [x64]
+    os: [freebsd]
+
   '@esbuild/freebsd-x64@0.27.4':
     resolution: {integrity: sha512-2kb4ceA/CpfUrIcTUl1wrP/9ad9Atrp5J94Lq69w7UwOMolPIGrfLSvAKJp0RTvkPPyn6CIWrNy13kyLikZRZQ==}
     engines: {node: '>=18'}
     cpu: [x64]
     os: [freebsd]
 
+  '@esbuild/linux-arm64@0.25.12':
+    resolution: {integrity: sha512-8bwX7a8FghIgrupcxb4aUmYDLp8pX06rGh5HqDT7bB+8Rdells6mHvrFHHW2JAOPZUbnjUpKTLg6ECyzvas2AQ==}
+    engines: {node: '>=18'}
+    cpu: [arm64]
+    os: [linux]
+
   '@esbuild/linux-arm64@0.27.4':
     resolution: {integrity: sha512-7nQOttdzVGth1iz57kxg9uCz57dxQLHWxopL6mYuYthohPKEK0vU0C3O21CcBK6KDlkYVcnDXY099HcCDXd9dA==}
     engines: {node: '>=18'}
     cpu: [arm64]
     os: [linux]
 
+  '@esbuild/linux-arm@0.25.12':
+    resolution: {integrity: sha512-lPDGyC1JPDou8kGcywY0YILzWlhhnRjdof3UlcoqYmS9El818LLfJJc3PXXgZHrHCAKs/Z2SeZtDJr5MrkxtOw==}
+    engines: {node: '>=18'}
+    cpu: [arm]
+    os: [linux]
+
   '@esbuild/linux-arm@0.27.4':
     resolution: {integrity: sha512-aBYgcIxX/wd5n2ys0yESGeYMGF+pv6g0DhZr3G1ZG4jMfruU9Tl1i2Z+Wnj9/KjGz1lTLCcorqE2viePZqj4Eg==}
     engines: {node: '>=18'}
     cpu: [arm]
     os: [linux]
 
+  '@esbuild/linux-ia32@0.25.12':
+    resolution: {integrity: sha512-0y9KrdVnbMM2/vG8KfU0byhUN+EFCny9+8g202gYqSSVMonbsCfLjUO+rCci7pM0WBEtz+oK/PIwHkzxkyharA==}
+    engines: {node: '>=18'}
+    cpu: [ia32]
+    os: [linux]
+
   '@esbuild/linux-ia32@0.27.4':
     resolution: {integrity: sha512-oPtixtAIzgvzYcKBQM/qZ3R+9TEUd1aNJQu0HhGyqtx6oS7qTpvjheIWBbes4+qu1bNlo2V4cbkISr8q6gRBFA==}
     engines: {node: '>=18'}
     cpu: [ia32]
     os: [linux]
 
+  '@esbuild/linux-loong64@0.25.12':
+    resolution: {integrity: sha512-h///Lr5a9rib/v1GGqXVGzjL4TMvVTv+s1DPoxQdz7l/AYv6LDSxdIwzxkrPW438oUXiDtwM10o9PmwS/6Z0Ng==}
+    engines: {node: '>=18'}
+    cpu: [loong64]
+    os: [linux]
+
   '@esbuild/linux-loong64@0.27.4':
     resolution: {integrity: sha512-8mL/vh8qeCoRcFH2nM8wm5uJP+ZcVYGGayMavi8GmRJjuI3g1v6Z7Ni0JJKAJW+m0EtUuARb6Lmp4hMjzCBWzA==}
     engines: {node: '>=18'}
     cpu: [loong64]
     os: [linux]
 
+  '@esbuild/linux-mips64el@0.25.12':
+    resolution: {integrity: sha512-iyRrM1Pzy9GFMDLsXn1iHUm18nhKnNMWscjmp4+hpafcZjrr2WbT//d20xaGljXDBYHqRcl8HnxbX6uaA/eGVw==}
+    engines: {node: '>=18'}
+    cpu: [mips64el]
+    os: [linux]
+
   '@esbuild/linux-mips64el@0.27.4':
     resolution: {integrity: sha512-1RdrWFFiiLIW7LQq9Q2NES+HiD4NyT8Itj9AUeCl0IVCA459WnPhREKgwrpaIfTOe+/2rdntisegiPWn/r/aAw==}
     engines: {node: '>=18'}
     cpu: [mips64el]
     os: [linux]
 
+  '@esbuild/linux-ppc64@0.25.12':
+    resolution: {integrity: sha512-9meM/lRXxMi5PSUqEXRCtVjEZBGwB7P/D4yT8UG/mwIdze2aV4Vo6U5gD3+RsoHXKkHCfSxZKzmDssVlRj1QQA==}
+    engines: {node: '>=18'}
+    cpu: [ppc64]
+    os: [linux]
+
   '@esbuild/linux-ppc64@0.27.4':
     resolution: {integrity: sha512-tLCwNG47l3sd9lpfyx9LAGEGItCUeRCWeAx6x2Jmbav65nAwoPXfewtAdtbtit/pJFLUWOhpv0FpS6GQAmPrHA==}
     engines: {node: '>=18'}
     cpu: [ppc64]
     os: [linux]
 
+  '@esbuild/linux-riscv64@0.25.12':
+    resolution: {integrity: sha512-Zr7KR4hgKUpWAwb1f3o5ygT04MzqVrGEGXGLnj15YQDJErYu/BGg+wmFlIDOdJp0PmB0lLvxFIOXZgFRrdjR0w==}
+    engines: {node: '>=18'}
+    cpu: [riscv64]
+    os: [linux]
+
   '@esbuild/linux-riscv64@0.27.4':
     resolution: {integrity: sha512-BnASypppbUWyqjd1KIpU4AUBiIhVr6YlHx/cnPgqEkNoVOhHg+YiSVxM1RLfiy4t9cAulbRGTNCKOcqHrEQLIw==}
     engines: {node: '>=18'}
     cpu: [riscv64]
     os: [linux]
 
+  '@esbuild/linux-s390x@0.25.12':
+    resolution: {integrity: sha512-MsKncOcgTNvdtiISc/jZs/Zf8d0cl/t3gYWX8J9ubBnVOwlk65UIEEvgBORTiljloIWnBzLs4qhzPkJcitIzIg==}
+    engines: {node: '>=18'}
+    cpu: [s390x]
+    os: [linux]
+
   '@esbuild/linux-s390x@0.27.4':
     resolution: {integrity: sha512-+eUqgb/Z7vxVLezG8bVB9SfBie89gMueS+I0xYh2tJdw3vqA/0ImZJ2ROeWwVJN59ihBeZ7Tu92dF/5dy5FttA==}
     engines: {node: '>=18'}
     cpu: [s390x]
     os: [linux]
 
+  '@esbuild/linux-x64@0.25.12':
+    resolution: {integrity: sha512-uqZMTLr/zR/ed4jIGnwSLkaHmPjOjJvnm6TVVitAa08SLS9Z0VM8wIRx7gWbJB5/J54YuIMInDquWyYvQLZkgw==}
+    engines: {node: '>=18'}
+    cpu: [x64]
+    os: [linux]
+
   '@esbuild/linux-x64@0.27.4':
     resolution: {integrity: sha512-S5qOXrKV8BQEzJPVxAwnryi2+Iq5pB40gTEIT69BQONqR7JH1EPIcQ/Uiv9mCnn05jff9umq/5nqzxlqTOg9NA==}
     engines: {node: '>=18'}
     cpu: [x64]
     os: [linux]
 
+  '@esbuild/netbsd-arm64@0.25.12':
+    resolution: {integrity: sha512-xXwcTq4GhRM7J9A8Gv5boanHhRa/Q9KLVmcyXHCTaM4wKfIpWkdXiMog/KsnxzJ0A1+nD+zoecuzqPmCRyBGjg==}
+    engines: {node: '>=18'}
+    cpu: [arm64]
+    os: [netbsd]
+
   '@esbuild/netbsd-arm64@0.27.4':
     resolution: {integrity: sha512-xHT8X4sb0GS8qTqiwzHqpY00C95DPAq7nAwX35Ie/s+LO9830hrMd3oX0ZMKLvy7vsonee73x0lmcdOVXFzd6Q==}
     engines: {node: '>=18'}
     cpu: [arm64]
     os: [netbsd]
 
+  '@esbuild/netbsd-x64@0.25.12':
+    resolution: {integrity: sha512-Ld5pTlzPy3YwGec4OuHh1aCVCRvOXdH8DgRjfDy/oumVovmuSzWfnSJg+VtakB9Cm0gxNO9BzWkj6mtO1FMXkQ==}
+    engines: {node: '>=18'}
+    cpu: [x64]
+    os: [netbsd]
+
   '@esbuild/netbsd-x64@0.27.4':
     resolution: {integrity: sha512-RugOvOdXfdyi5Tyv40kgQnI0byv66BFgAqjdgtAKqHoZTbTF2QqfQrFwa7cHEORJf6X2ht+l9ABLMP0dnKYsgg==}
     engines: {node: '>=18'}
     cpu: [x64]
     os: [netbsd]
 
+  '@esbuild/openbsd-arm64@0.25.12':
+    resolution: {integrity: sha512-fF96T6KsBo/pkQI950FARU9apGNTSlZGsv1jZBAlcLL1MLjLNIWPBkj5NlSz8aAzYKg+eNqknrUJ24QBybeR5A==}
+    engines: {node: '>=18'}
+    cpu: [arm64]
+    os: [openbsd]
+
   '@esbuild/openbsd-arm64@0.27.4':
     resolution: {integrity: sha512-2MyL3IAaTX+1/qP0O1SwskwcwCoOI4kV2IBX1xYnDDqthmq5ArrW94qSIKCAuRraMgPOmG0RDTA74mzYNQA9ow==}
     engines: {node: '>=18'}
     cpu: [arm64]
     os: [openbsd]
 
+  '@esbuild/openbsd-x64@0.25.12':
+    resolution: {integrity: sha512-MZyXUkZHjQxUvzK7rN8DJ3SRmrVrke8ZyRusHlP+kuwqTcfWLyqMOE3sScPPyeIXN/mDJIfGXvcMqCgYKekoQw==}
+    engines: {node: '>=18'}
+    cpu: [x64]
+    os: [openbsd]
+
   '@esbuild/openbsd-x64@0.27.4':
     resolution: {integrity: sha512-u8fg/jQ5aQDfsnIV6+KwLOf1CmJnfu1ShpwqdwC0uA7ZPwFws55Ngc12vBdeUdnuWoQYx/SOQLGDcdlfXhYmXQ==}
     engines: {node: '>=18'}
     cpu: [x64]
     os: [openbsd]
 
+  '@esbuild/openharmony-arm64@0.25.12':
+    resolution: {integrity: sha512-rm0YWsqUSRrjncSXGA7Zv78Nbnw4XL6/dzr20cyrQf7ZmRcsovpcRBdhD43Nuk3y7XIoW2OxMVvwuRvk9XdASg==}
+    engines: {node: '>=18'}
+    cpu: [arm64]
+    os: [openharmony]
+
   '@esbuild/openharmony-arm64@0.27.4':
     resolution: {integrity: sha512-JkTZrl6VbyO8lDQO3yv26nNr2RM2yZzNrNHEsj9bm6dOwwu9OYN28CjzZkH57bh4w0I2F7IodpQvUAEd1mbWXg==}
     engines: {node: '>=18'}
     cpu: [arm64]
     os: [openharmony]
 
+  '@esbuild/sunos-x64@0.25.12':
+    resolution: {integrity: sha512-3wGSCDyuTHQUzt0nV7bocDy72r2lI33QL3gkDNGkod22EsYl04sMf0qLb8luNKTOmgF/eDEDP5BFNwoBKH441w==}
+    engines: {node: '>=18'}
+    cpu: [x64]
+    os: [sunos]
+
   '@esbuild/sunos-x64@0.27.4':
     resolution: {integrity: sha512-/gOzgaewZJfeJTlsWhvUEmUG4tWEY2Spp5M20INYRg2ZKl9QPO3QEEgPeRtLjEWSW8FilRNacPOg8R1uaYkA6g==}
     engines: {node: '>=18'}
     cpu: [x64]
     os: [sunos]
 
+  '@esbuild/win32-arm64@0.25.12':
+    resolution: {integrity: sha512-rMmLrur64A7+DKlnSuwqUdRKyd3UE7oPJZmnljqEptesKM8wx9J8gx5u0+9Pq0fQQW8vqeKebwNXdfOyP+8Bsg==}
+    engines: {node: '>=18'}
+    cpu: [arm64]
+    os: [win32]
+
   '@esbuild/win32-arm64@0.27.4':
     resolution: {integrity: sha512-Z9SExBg2y32smoDQdf1HRwHRt6vAHLXcxD2uGgO/v2jK7Y718Ix4ndsbNMU/+1Qiem9OiOdaqitioZwxivhXYg==}
     engines: {node: '>=18'}
     cpu: [arm64]
     os: [win32]
 
+  '@esbuild/win32-ia32@0.25.12':
+    resolution: {integrity: sha512-HkqnmmBoCbCwxUKKNPBixiWDGCpQGVsrQfJoVGYLPT41XWF8lHuE5N6WhVia2n4o5QK5M4tYr21827fNhi4byQ==}
+    engines: {node: '>=18'}
+    cpu: [ia32]
+    os: [win32]
+
   '@esbuild/win32-ia32@0.27.4':
     resolution: {integrity: sha512-DAyGLS0Jz5G5iixEbMHi5KdiApqHBWMGzTtMiJ72ZOLhbu/bzxgAe8Ue8CTS3n3HbIUHQz/L51yMdGMeoxXNJw==}
     engines: {node: '>=18'}
     cpu: [ia32]
     os: [win32]
 
+  '@esbuild/win32-x64@0.25.12':
+    resolution: {integrity: sha512-alJC0uCZpTFrSL0CCDjcgleBXPnCrEAhTBILpeAp7M/OFgoqtAetfBzX0xM00MUsVVPpVjlPuMbREqnZCXaTnA==}
+    engines: {node: '>=18'}
+    cpu: [x64]
+    os: [win32]
+
   '@esbuild/win32-x64@0.27.4':
     resolution: {integrity: sha512-+knoa0BDoeXgkNvvV1vvbZX4+hizelrkwmGJBdT17t8FNPwG2lKemmuMZlmaNQ3ws3DKKCxpb4zRZEIp3UxFCg==}
     engines: {node: '>=18'}
@@ -827,9 +983,9 @@ packages:
   '@iconify/utils@2.3.0':
     resolution: {integrity: sha512-GmQ78prtwYW6EtzXRU1rY+KwOKfz32PD7iJh6Iyqw68GiKuoZ2A6pRtzWONz5VQJbp50mEjXh/7NkumtrAgRKA==}
 
-  '@intlify/bundle-utils@10.0.1':
+  '@intlify/bundle-utils@11.1.1':
-    resolution: {integrity: sha512-WkaXfSevtpgtUR4t8K2M6lbR7g03mtOxFeh+vXp5KExvPqS12ppaRj1QxzwRuRI5VUto54A22BjKoBMLyHILWQ==}
+    resolution: {integrity: sha512-dNVVjdkMiOGUT3eLCy8OSwXMtBPzkeHMZ0IMVRnP9zr4dFZPj71B1vWSUkPt9YCQbFo23dvVY5Xe3NMxZCgrsQ==}
-    engines: {node: '>= 18'}
+    engines: {node: '>= 20'}
     peerDependencies:
       petite-vue-i18n: '*'
       vue-i18n: '*'
@@ -855,9 +1011,9 @@ packages:
     resolution: {integrity: sha512-LC6P/uay7rXL5zZ5+5iRJfLs/iUN8apu9tm8YqQVmW3Uq3X4A0dOFUIDuAmB7gAC29wTHOS3EiN/IosNSz0eNQ==}
     engines: {node: '>= 16'}
 
-  '@intlify/unplugin-vue-i18n@6.0.8':
+  '@intlify/unplugin-vue-i18n@11.1.1':
-    resolution: {integrity: sha512-Vvm3KhjE6TIBVUQAk37rBiaYy2M5OcWH0ZcI1XKEsOTeN1o0bErk+zeuXmcrcMc/73YggfI8RoxOUz9EB/69JQ==}
+    resolution: {integrity: sha512-ybuN/Tp7JNddFsZUCrBjYVEWc6RmfxewqO7+RzYSMqxoVzA8LFTyBvVjTxp2hwmNyyXqDgAM4cbshBmPvgRDqw==}
-    engines: {node: '>= 18'}
+    engines: {node: '>= 20'}
     peerDependencies:
       petite-vue-i18n: '*'
       vue: ^3.2.25
@@ -1684,6 +1840,11 @@ packages:
     resolution: {integrity: sha512-w+5mJ3GuFL+NjVtJlvydShqE1eN3h3PbI7/5LAsYJP/2qtuMXjfL2LpHSRqo4b4eSF5K/DH1JXKUAHSB2UW50g==}
     engines: {node: '>= 0.4'}
 
+  esbuild@0.25.12:
+    resolution: {integrity: sha512-bbPBYYrtZbkt6Os6FiTLCTFxvq4tt3JKall1vRwshA3fdVztsLAatFaZobhkBC8/BrPetoa0oksYoKXoG4ryJg==}
+    engines: {node: '>=18'}
+    hasBin: true
+
   esbuild@0.27.4:
     resolution: {integrity: sha512-Rq4vbHnYkK5fws5NF7MYTU68FPRE1ajX7heQ/8QXXWqNgqqJ/GkmmyxIzUnf2Sr/bakf8l54716CcMGHYhMrrQ==}
     engines: {node: '>=18'}
@@ -2480,9 +2641,6 @@ packages:
     resolution: {integrity: sha512-3O/iVVsJAPsOnpwWIeD+d6z/7PmqApyQePUtCndjatj/9I5LylHvt5qluFaBT3I5h3r1ejfR056c+FCv+NnNXg==}
     engines: {node: 18 || 20 || >=22}
 
-  pathe@1.1.2:
-    resolution: {integrity: sha512-whLdWMYL2TwI08hn8/ZqAbrVemu0LNaNNJZX73O6qaIdCTfXutsLhMkjdENX0qhsQ9uIimo4/aQOmXkoon2nDQ==}
-
   pathe@2.0.3:
     resolution: {integrity: sha512-WUjGcAqP1gQacoQe+OBJsFA7Ld4DyXuUIjZ5cc75cLHvJ7dtNsTugphxIADwspS+AraAUePCKrSVtPLFj/F88w==}
 
@@ -2694,8 +2852,8 @@ packages:
     resolution: {integrity: sha512-RJRdvCo6IAnPdsvP/7m6bsQqNnn1FCBX5ZNtFL98MmFF/4xAIJTIg1YbHW5DC2W5SKZanrC6i4HsJqlajw/dZw==}
     engines: {node: '>= 0.4'}
 
-  shaka-player@4.16.24:
+  shaka-player@5.0.8:
-    resolution: {integrity: sha512-y4nJ7Fdzcjcpeg7Nbvuj/Ud12ZJl6srmxF+RgyS59GI9D4/DIA2O74v25M8FiPC3gV5OROSESK6ZXaQGaPcnrA==}
+    resolution: {integrity: sha512-f886rKRvQ0IKhWGk+rINS++YTjTJyc4DT5YypTsHW6wiNV9fiHi2n35+lg5R+hj9RfhqkmJHMjJb3gprUTNa8w==}
     engines: {node: '>=18'}
 
   shebang-command@2.0.0:
@@ -2943,9 +3101,9 @@ packages:
     resolution: {integrity: sha512-5lWVjgi6vuHhJ526bI4nlCOmkCIF3nnfXkCMDeMJrtdvxTs6ZFCM8oNufGTsDbKv/tJ/xj8RpvXjRuPBZJuJog==}
     engines: {node: '>=20.19.0'}
 
-  unplugin@1.16.1:
+  unplugin@2.3.11:
-    resolution: {integrity: sha512-4/u/j4FrCKdi17jaxuJA0jClGxB1AvU2hw/IuayPc4ay1XGaJs/rbb4v5WKwAjNifjmXK9PIFyuPiaK8azyR9w==}
+    resolution: {integrity: sha512-5uKD0nqiYVzlmCRs01Fhs2BdkEgBS3SAVP6ndrBsuK42iC2+JHyxM05Rm9G8+5mkmRtzMZGY8Ct5+mliZxU/Ww==}
-    engines: {node: '>=14.0.0'}
+    engines: {node: '>=18.12.0'}
 
   unplugin@3.0.0:
     resolution: {integrity: sha512-0Mqk3AT2TZCXWKdcoaufeXNukv2mTrEZExeXlHIOZXdqYoHHr4n51pymnwV8x2BOVxwXbK2HLlI7usrqMpycdg==}
@@ -3862,81 +4020,159 @@ snapshots:
       '@babel/helper-string-parser': 7.27.1
       '@babel/helper-validator-identifier': 7.28.5
 
+  '@esbuild/aix-ppc64@0.25.12':
+    optional: true
+
   '@esbuild/aix-ppc64@0.27.4':
     optional: true
 
+  '@esbuild/android-arm64@0.25.12':
+    optional: true
+
   '@esbuild/android-arm64@0.27.4':
     optional: true
 
+  '@esbuild/android-arm@0.25.12':
+    optional: true
+
   '@esbuild/android-arm@0.27.4':
     optional: true
 
+  '@esbuild/android-x64@0.25.12':
+    optional: true
+
   '@esbuild/android-x64@0.27.4':
     optional: true
 
+  '@esbuild/darwin-arm64@0.25.12':
+    optional: true
+
   '@esbuild/darwin-arm64@0.27.4':
     optional: true
 
+  '@esbuild/darwin-x64@0.25.12':
+    optional: true
+
   '@esbuild/darwin-x64@0.27.4':
     optional: true
 
+  '@esbuild/freebsd-arm64@0.25.12':
+    optional: true
+
   '@esbuild/freebsd-arm64@0.27.4':
     optional: true
 
+  '@esbuild/freebsd-x64@0.25.12':
+    optional: true
+
   '@esbuild/freebsd-x64@0.27.4':
     optional: true
 
+  '@esbuild/linux-arm64@0.25.12':
+    optional: true
+
   '@esbuild/linux-arm64@0.27.4':
     optional: true
 
+  '@esbuild/linux-arm@0.25.12':
+    optional: true
+
   '@esbuild/linux-arm@0.27.4':
     optional: true
 
+  '@esbuild/linux-ia32@0.25.12':
+    optional: true
+
   '@esbuild/linux-ia32@0.27.4':
     optional: true
 
+  '@esbuild/linux-loong64@0.25.12':
+    optional: true
+
   '@esbuild/linux-loong64@0.27.4':
     optional: true
 
+  '@esbuild/linux-mips64el@0.25.12':
+    optional: true
+
   '@esbuild/linux-mips64el@0.27.4':
     optional: true
 
+  '@esbuild/linux-ppc64@0.25.12':
+    optional: true
+
   '@esbuild/linux-ppc64@0.27.4':
     optional: true
 
+  '@esbuild/linux-riscv64@0.25.12':
+    optional: true
+
   '@esbuild/linux-riscv64@0.27.4':
     optional: true
 
+  '@esbuild/linux-s390x@0.25.12':
+    optional: true
+
   '@esbuild/linux-s390x@0.27.4':
     optional: true
 
+  '@esbuild/linux-x64@0.25.12':
+    optional: true
+
   '@esbuild/linux-x64@0.27.4':
     optional: true
 
+  '@esbuild/netbsd-arm64@0.25.12':
+    optional: true
+
   '@esbuild/netbsd-arm64@0.27.4':
     optional: true
 
+  '@esbuild/netbsd-x64@0.25.12':
+    optional: true
+
   '@esbuild/netbsd-x64@0.27.4':
     optional: true
 
+  '@esbuild/openbsd-arm64@0.25.12':
+    optional: true
+
   '@esbuild/openbsd-arm64@0.27.4':
     optional: true
 
+  '@esbuild/openbsd-x64@0.25.12':
+    optional: true
+
   '@esbuild/openbsd-x64@0.27.4':
     optional: true
 
+  '@esbuild/openharmony-arm64@0.25.12':
+    optional: true
+
   '@esbuild/openharmony-arm64@0.27.4':
     optional: true
 
+  '@esbuild/sunos-x64@0.25.12':
+    optional: true
+
   '@esbuild/sunos-x64@0.27.4':
     optional: true
 
+  '@esbuild/win32-arm64@0.25.12':
+    optional: true
+
   '@esbuild/win32-arm64@0.27.4':
     optional: true
 
+  '@esbuild/win32-ia32@0.25.12':
+    optional: true
+
   '@esbuild/win32-ia32@0.27.4':
     optional: true
 
+  '@esbuild/win32-x64@0.25.12':
+    optional: true
+
   '@esbuild/win32-x64@0.27.4':
     optional: true
 
@@ -3998,15 +4234,15 @@ snapshots:
     transitivePeerDependencies:
       - supports-color
 
-  '@intlify/bundle-utils@10.0.1(vue-i18n@11.3.0(vue@3.5.31(typescript@5.9.3)))':
+  '@intlify/bundle-utils@11.1.1(vue-i18n@11.3.0(vue@3.5.31(typescript@5.9.3)))':
     dependencies:
       '@intlify/message-compiler': 11.3.0
       '@intlify/shared': 11.3.0
       acorn: 8.16.0
+      esbuild: 0.25.12
       escodegen: 2.1.0
       estree-walker: 2.0.2
       jsonc-eslint-parser: 2.4.2
-      mlly: 1.8.2
       source-map-js: 1.2.1
       yaml-eslint-parser: 1.3.2
     optionalDependencies:
@@ -4030,10 +4266,10 @@ snapshots:
 
   '@intlify/shared@11.3.0': {}
 
-  '@intlify/unplugin-vue-i18n@6.0.8(@vue/compiler-dom@3.5.31)(eslint@8.57.1)(rollup@2.80.0)(typescript@5.9.3)(vue-i18n@11.3.0(vue@3.5.31(typescript@5.9.3)))(vue@3.5.31(typescript@5.9.3))':
+  '@intlify/unplugin-vue-i18n@11.1.1(@vue/compiler-dom@3.5.31)(eslint@8.57.1)(rollup@2.80.0)(typescript@5.9.3)(vue-i18n@11.3.0(vue@3.5.31(typescript@5.9.3)))(vue@3.5.31(typescript@5.9.3))':
     dependencies:
       '@eslint-community/eslint-utils': 4.9.1(eslint@8.57.1)
-      '@intlify/bundle-utils': 10.0.1(vue-i18n@11.3.0(vue@3.5.31(typescript@5.9.3)))
+      '@intlify/bundle-utils': 11.1.1(vue-i18n@11.3.0(vue@3.5.31(typescript@5.9.3)))
       '@intlify/shared': 11.3.0
       '@intlify/vue-i18n-extensions': 8.0.0(@intlify/shared@11.3.0)(@vue/compiler-dom@3.5.31)(vue-i18n@11.3.0(vue@3.5.31(typescript@5.9.3)))(vue@3.5.31(typescript@5.9.3))
       '@rollup/pluginutils': 5.3.0(rollup@2.80.0)
@@ -4041,12 +4277,9 @@ snapshots:
       '@typescript-eslint/typescript-estree': 8.57.2(typescript@5.9.3)
       debug: 4.4.3
       fast-glob: 3.3.3
-      js-yaml: 4.1.1
+      pathe: 2.0.3
-      json5: 2.2.3
-      pathe: 1.1.2
       picocolors: 1.1.1
-      source-map-js: 1.2.1
+      unplugin: 2.3.11
-      unplugin: 1.16.1
       vue: 3.5.31(typescript@5.9.3)
     optionalDependencies:
       vue-i18n: 11.3.0(vue@3.5.31(typescript@5.9.3))
@@ -4985,6 +5218,35 @@ snapshots:
       is-date-object: 1.1.0
       is-symbol: 1.1.1
 
+  esbuild@0.25.12:
+    optionalDependencies:
+      '@esbuild/aix-ppc64': 0.25.12
+      '@esbuild/android-arm': 0.25.12
+      '@esbuild/android-arm64': 0.25.12
+      '@esbuild/android-x64': 0.25.12
+      '@esbuild/darwin-arm64': 0.25.12
+      '@esbuild/darwin-x64': 0.25.12
+      '@esbuild/freebsd-arm64': 0.25.12
+      '@esbuild/freebsd-x64': 0.25.12
+      '@esbuild/linux-arm': 0.25.12
+      '@esbuild/linux-arm64': 0.25.12
+      '@esbuild/linux-ia32': 0.25.12
+      '@esbuild/linux-loong64': 0.25.12
+      '@esbuild/linux-mips64el': 0.25.12
+      '@esbuild/linux-ppc64': 0.25.12
+      '@esbuild/linux-riscv64': 0.25.12
+      '@esbuild/linux-s390x': 0.25.12
+      '@esbuild/linux-x64': 0.25.12
+      '@esbuild/netbsd-arm64': 0.25.12
+      '@esbuild/netbsd-x64': 0.25.12
+      '@esbuild/openbsd-arm64': 0.25.12
+      '@esbuild/openbsd-x64': 0.25.12
+      '@esbuild/openharmony-arm64': 0.25.12
+      '@esbuild/sunos-x64': 0.25.12
+      '@esbuild/win32-arm64': 0.25.12
+      '@esbuild/win32-ia32': 0.25.12
+      '@esbuild/win32-x64': 0.25.12
+
   esbuild@0.27.4:
     optionalDependencies:
       '@esbuild/aix-ppc64': 0.27.4
@@ -5781,8 +6043,6 @@ snapshots:
       lru-cache: 11.2.7
       minipass: 7.1.3
 
-  pathe@1.1.2: {}
-
   pathe@2.0.3: {}
 
   perfect-debounce@1.0.0: {}
@@ -6017,7 +6277,7 @@ snapshots:
       es-errors: 1.3.0
       es-object-atoms: 1.1.1
 
-  shaka-player@4.16.24: {}
+  shaka-player@5.0.8: {}
 
   shebang-command@2.0.0:
     dependencies:
@@ -6314,9 +6574,11 @@ snapshots:
       pathe: 2.0.3
       picomatch: 4.0.4
 
-  unplugin@1.16.1:
+  unplugin@2.3.11:
     dependencies:
+      '@jridgewell/remapping': 2.3.5
       acorn: 8.16.0
+      picomatch: 4.0.4
       webpack-virtual-modules: 0.6.2
 
   unplugin@3.0.0:

src/components/VideoPlayer.vue

@@ -13,23 +13,6 @@
             :loop="selectedAutoLoop"
             playsinline
         />
-        <span
-            id="preview-container"
-            ref="previewContainer"
-            class="absolute bottom-0 z-[2000] mb-[3.5%] hidden flex-col items-center"
-        >
-            <canvas id="preview" ref="preview" class="rounded-sm" />
-            <span
-                v-if="(video?.chapters?.length ?? 0) > 1"
-                class="mt-2 text-sm drop-shadow-[0_0_2px_white] -mb-2 .dark:drop-shadow-[0_0_2px_black]"
-            >
-                {{ video.chapters.findLast(chapter => chapter.start < currentTime)?.title }}
-            </span>
-            <span
-                class="mt-2 w-min rounded-xl bg-white px-2 pb-1 pt-1.5 text-sm .dark:bg-dark-700"
-                v-text="timeFormat(currentTime)"
-            />
-        </span>
         <button
             v-if="inSegment"
             class="skip-segment-button"
@@ -39,7 +22,7 @@
             @click="onClickSkipSegment"
         >
             <span v-t="'actions.skip_segment'" />
-            <i class="material-icons-round">skip_next</i>
+            <i class="skip-segment-icon i-fa6-solid:forward-step" aria-hidden="true" />
         </button>
         <span
             v-if="error > 0"
@@ -91,8 +74,6 @@ import {
     getPreferenceString,
     setPreference,
 } from "@/composables/usePreferences.js";
-import { timeFormat } from "@/composables/useFormatting.js";
-
 const shakaImport = import("shaka-player/dist/shaka-player.ui.js");
 const hotkeysImport = import("hotkeys-js");
 
@@ -121,22 +102,17 @@ const emit = defineEmits(["timeupdate", "ended", "navigateNext"]);
 
 const container = ref(null);
 const videoEl = ref(null);
-const previewContainer = ref(null);
-const preview = ref(null);
 
 const lastUpdate = ref(new Date().getTime());
 const initialSeekComplete = ref(false);
 const destroying = ref(false);
 const inSegment = ref(false);
-const isHoveringTimebar = ref(false);
 const showSpeedModal = ref(false);
 const showCurrentSpeed = ref(false);
 let hideCurrentSpeedTimeout = null;
 const showCurrentVolume = ref(false);
 let hideCurrentVolumeTimeout = null;
 const playbackSpeedInput = ref(null);
-const currentTime = ref(0);
-const seekbarPadding = ref(2);
 const error = ref(0);
 
 let shakaLib = null;
@@ -145,6 +121,8 @@ let uiInstance = null;
 let hotkeysLib = null;
 let shakaPromise = null;
 let hotkeysPromise = null;
+let lastSelectedTextTrack = null;
+let thumbnailVttUrl = null;
 
 const shouldAutoPlay = computed(() => {
     return getPreferenceBoolean("playerAutoPlay", true) && !props.isEmbed;
@@ -209,6 +187,36 @@ function setSpeedFromInput() {
     showSpeedModal.value = false;
 }
 
+function getActiveTextTrack() {
+    return playerInstance?.getTextTracks()?.find(track => track.active) ?? null;
+}
+
+function selectTextTrack(track) {
+    playerInstance.selectTextTrack(track ?? null);
+    if (track) {
+        lastSelectedTextTrack = track;
+    }
+}
+
+function applyPreferredTextTrack() {
+    const textTracks = playerInstance.getTextTracks();
+    const prefSubtitles = getPreferenceString("subtitles", "");
+    const autoDisplayCaptions = getPreferenceBoolean("autoDisplayCaptions", false);
+
+    let selectedTrack = null;
+
+    if (prefSubtitles !== "") {
+        selectedTrack = textTracks.find(textTrack => textTrack.language == prefSubtitles) ?? null;
+    }
+
+    if (!selectedTrack && autoDisplayCaptions) {
+        const prefLang = getPreferenceString("hl", "en").substr(0, 2);
+        selectedTrack = textTracks.find(textTrack => textTrack.language == prefLang) ?? textTracks[0] ?? null;
+    }
+
+    selectTextTrack(selectedTrack);
+}
+
 function updateMarkers() {
     const markers = container.value.querySelector(".shaka-ad-markers");
     const array = ["to right"];
@@ -251,86 +259,63 @@ function updateSponsors() {
     }
 }
 
-function setupSeekbarPreview() {
+function getPreviewFramePage() {
-    if (!props.video.previewFrames) return;
+    const previewFrames = props.video.previewFrames;
-    let seekBar = document.querySelector(".shaka-seek-bar");
+    if (!previewFrames) return null;
-    seekBar.addEventListener("mousemove", e => {
+    if (Array.isArray(previewFrames)) {
-        isHoveringTimebar.value = true;
+        return previewFrames.findLast(Boolean) ?? previewFrames[previewFrames.length - 1] ?? null;
-        const position = (e.offsetX / e.target.offsetWidth) * props.video.duration;
-        showSeekbarPreview(position * 1000);
-    });
-    seekBar.addEventListener("mouseout", () => {
-        isHoveringTimebar.value = false;
-        previewContainer.value.style.display = "none";
-    });
-}
-
-async function showSeekbarPreview(position) {
-    const frame = getFrame(position);
-    const originalImage = await loadImage(frame.url);
-    if (!isHoveringTimebar.value) return;
-
-    const seekBar = document.querySelector(".shaka-seek-bar");
-    const containerEl = previewContainer.value;
-    const canvas = preview.value;
-    const ctx = canvas.getContext("2d");
-
-    const offsetX = frame.positionX * frame.frameWidth;
-    const offsetY = frame.positionY * frame.frameHeight;
-
-    canvas.width = frame.frameWidth > 100 ? frame.frameWidth : frame.frameWidth * 2;
-    canvas.height = frame.frameWidth > 100 ? frame.frameHeight : frame.frameHeight * 2;
-    ctx.drawImage(
-        originalImage,
-        offsetX,
-        offsetY,
-        frame.frameWidth,
-        frame.frameHeight,
-        0,
-        0,
-        canvas.width,
-        canvas.height,
-    );
-
-    const centerOffset = position / props.video.duration / 10;
-    const left = centerOffset - ((0.5 * canvas.width) / seekBar.clientWidth) * 100;
-    const maxLeft = ((seekBar.clientWidth - canvas.clientWidth) / seekBar.clientWidth) * 100 - seekbarPadding.value;
-
-    currentTime.value = position / 1000;
-
-    containerEl.style.left = `max(${seekbarPadding.value}%, min(${left}%, ${maxLeft}%))`;
-    containerEl.style.display = "flex";
-}
-
-function getFrame(position) {
-    let startPosition = 0;
-    const framePage = props.video.previewFrames.at(-1);
-    for (let i = 0; i < framePage.urls.length; i++) {
-        for (let positionY = 0; positionY < framePage.framesPerPageY; positionY++) {
-            for (let positionX = 0; positionX < framePage.framesPerPageX; positionX++) {
-                const endPosition = startPosition + framePage.durationPerFrame;
-                if (position >= startPosition && position <= endPosition) {
-                    return {
-                        url: framePage.urls[i],
-                        positionX: positionX,
-                        positionY: positionY,
-                        frameWidth: framePage.frameWidth,
-                        frameHeight: framePage.frameHeight,
-                    };
-                }
-                startPosition = endPosition;
-            }
-        }
     }
-    return null;
+    return previewFrames;
 }
 
-function loadImage(url) {
+function formatVttTime(milliseconds) {
-    return new Promise(r => {
+    const totalSeconds = Math.floor(milliseconds / 1000);
-        const i = new Image();
+    const hours = Math.floor(totalSeconds / 3600);
-        i.onload = () => r(i);
+    const minutes = Math.floor((totalSeconds % 3600) / 60);
-        i.src = url;
+    const seconds = totalSeconds % 60;
-    });
+    const ms = Math.floor(milliseconds % 1000);
+
+    return `${String(hours).padStart(2, "0")}:${String(minutes).padStart(2, "0")}:${String(seconds).padStart(
+        2,
+        "0",
+    )}.${String(ms).padStart(3, "0")}`;
+}
+
+function buildThumbnailVtt(framePage) {
+    const totalCount =
+        framePage.totalCount ?? framePage.urls.length * framePage.framesPerPageX * framePage.framesPerPageY;
+    const framesPerPage = framePage.framesPerPageX * framePage.framesPerPageY;
+
+    let vtt = "WEBVTT\n\n";
+
+    for (let frameIndex = 0; frameIndex < totalCount; frameIndex++) {
+        const pageIndex = Math.floor(frameIndex / framesPerPage);
+        const frameIndexOnPage = frameIndex % framesPerPage;
+        const xIndex = frameIndexOnPage % framePage.framesPerPageX;
+        const yIndex = Math.floor(frameIndexOnPage / framePage.framesPerPageX);
+        const startTime = frameIndex * framePage.durationPerFrame;
+        const endTime = Math.min((frameIndex + 1) * framePage.durationPerFrame, props.video.duration * 1000);
+
+        vtt += `${formatVttTime(startTime)} --> ${formatVttTime(endTime)}\n`;
+        vtt += `${framePage.urls[pageIndex]}#xywh=${xIndex * framePage.frameWidth},${yIndex * framePage.frameHeight},${
+            framePage.frameWidth
+        },${framePage.frameHeight}\n\n`;
+    }
+
+    return vtt;
+}
+
+async function setupThumbnailTrack() {
+    const framePage = getPreviewFramePage();
+    if (!framePage?.urls?.length) return;
+
+    if (thumbnailVttUrl) {
+        URL.revokeObjectURL(thumbnailVttUrl);
+        thumbnailVttUrl = null;
+    }
+
+    thumbnailVttUrl = URL.createObjectURL(new Blob([buildThumbnailVtt(framePage)], { type: "text/vtt" }));
+    await playerInstance.addThumbnailsTrack(thumbnailVttUrl, "text/vtt");
 }
 
 async function updateProgressDatabase(time) {
@@ -403,7 +388,7 @@ async function setPlayerAttrs(localPlayer, el, uri, mime, shaka) {
 
         uiInstance = new shaka.ui.Overlay(localPlayer, container.value, el);
 
-        const overflowMenuButtons = ["quality", "captions", "picture_in_picture", "playback_rate", "airplay"];
+        const overflowMenuButtons = ["quality", "captions", "picture_in_picture", "playback_rate", "remote"];
 
         if (props.isEmbed) {
             overflowMenuButtons.push("open_new_tab");
@@ -426,11 +411,7 @@ async function setPlayerAttrs(localPlayer, el, uri, mime, shaka) {
     const event = new Event("playerInit");
     window.dispatchEvent(event);
 
-    const player = uiInstance.getControls().getPlayer();
+    playerInstance = localPlayer;
-
-    setupSeekbarPreview();
-
-    playerInstance = player;
 
     const disableVideo = getPreferenceBoolean("listen", false) && !props.video.livestream;
 
@@ -488,15 +469,17 @@ async function setPlayerAttrs(localPlayer, el, uri, mime, shaka) {
         initialSeekComplete.value = true;
     }
 
-    player
+    playerInstance
         .load(uri, startTime, mime)
-        .then(() => {
+        .then(async () => {
             let lang = "en";
             const prefLang = getPreferenceString("hl", "en").substr(0, 2);
-            if (player.getAudioLanguages().includes(prefLang)) lang = prefLang;
+            const audioTracks = playerInstance.getAudioTracks();
-            player.selectAudioLanguage(lang);
+            const audioLanguages = [...new Set(audioTracks.map(t => t.language))];
+            if (audioLanguages.includes(prefLang)) lang = prefLang;
+            const selectedTrack = audioTracks.find(t => t.language === lang);
+            if (selectedTrack) playerInstance.selectAudioTrack(selectedTrack);
 
-            const audioLanguages = player.getAudioLanguages();
             if (audioLanguages.length > 1) {
                 const overflowMenuButtons = uiInstance.getConfiguration().overflowMenuButtons;
                 const newOverflowMenuButtons = [
@@ -513,7 +496,7 @@ async function setPlayerAttrs(localPlayer, el, uri, mime, shaka) {
 
                 var bestAudio = 0;
 
-                const tracks = player
+                const tracks = playerInstance
                     .getVariantTracks()
                     .filter(track => track.language == lang || track.language == "und");
 
@@ -535,36 +518,28 @@ async function setPlayerAttrs(localPlayer, el, uri, mime, shaka) {
                         }
                     });
 
-                player.selectVariantTrack(bestStream, true);
+                playerInstance.selectVariantTrack(bestStream, true);
             }
 
-            props.video.subtitles.map(subtitle => {
+            await Promise.all(
-                player.addTextTrackAsync(
+                props.video.subtitles.map(subtitle => {
-                    subtitle.url,
+                    return playerInstance.addTextTrackAsync(
-                    subtitle.code,
+                        subtitle.url,
-                    "subtitles",
+                        subtitle.code,
-                    subtitle.mimeType,
+                        "subtitles",
-                    null,
+                        subtitle.mimeType,
-                    subtitle.name,
+                        null,
-                );
+                        subtitle.name,
-            });
+                    );
+                }),
+            );
             el.volume = getPreferenceNumber("volume", 1);
             const rate = getPreferenceNumber("rate", 1);
             el.playbackRate = rate;
             el.defaultPlaybackRate = rate;
 
-            const autoDisplayCaptions = getPreferenceBoolean("autoDisplayCaptions", false);
+            applyPreferredTextTrack();
-            playerInstance.setTextTrackVisibility(autoDisplayCaptions);
+            await setupThumbnailTrack();
-
-            const prefSubtitles = getPreferenceString("subtitles", "");
-            if (prefSubtitles !== "") {
-                const textTracks = playerInstance.getTextTracks();
-                const subtitleIdx = textTracks.findIndex(textTrack => textTrack.language == prefSubtitles);
-                if (subtitleIdx != -1) {
-                    playerInstance.setTextTrackVisibility(true);
-                    playerInstance.selectTextTrack(textTracks[subtitleIdx]);
-                }
-            }
         })
         .catch(e => {
             console.error(e);
@@ -748,6 +723,10 @@ async function loadVideo() {
 }
 
 function destroy(hotkeys) {
+    if (thumbnailVttUrl) {
+        URL.revokeObjectURL(thumbnailVttUrl);
+        thumbnailVttUrl = null;
+    }
     if (uiInstance && !document.pictureInPictureElement) {
         uiInstance.destroy();
         uiInstance = undefined;
@@ -792,7 +771,14 @@ onActivated(() => {
                         e.preventDefault();
                         break;
                     case "c":
-                        playerInstance.setTextTrackVisibility(!playerInstance.isTextTrackVisible());
+                        if (getActiveTextTrack()) {
+                            lastSelectedTextTrack = getActiveTextTrack();
+                            playerInstance.selectTextTrack(null);
+                        } else if (lastSelectedTextTrack) {
+                            playerInstance.selectTextTrack(lastSelectedTextTrack);
+                        } else {
+                            selectTextTrack(playerInstance.getTextTracks()[0] ?? null);
+                        }
                         e.preventDefault();
                         break;
                     case "k":
@@ -956,10 +942,6 @@ defineExpose({
     @apply !text-xl;
 }
 
-.shaka-current-time {
-    @apply !text-base;
-}
-
 .shaka-video-container:-webkit-full-screen {
     max-height: none !important;
 }
@@ -979,10 +961,6 @@ defineExpose({
     padding: 0.09em 0;
 }
 
-#shaka-player-ui-time-container {
-    display: none !important;
-}
-
 .skip-segment-button {
     /* position button above player overlay */
     z-index: 1000;
@@ -1009,8 +987,16 @@ defineExpose({
     line-height: 1.5em;
 }
 
-.skip-segment-button .material-icons-round {
+.skip-segment-button .skip-segment-icon {
     font-size: 1.6em !important;
     line-height: inherit !important;
+    margin-left: 0.4em;
+}
+
+/* Override Tailwind preflight's `img { max-width: 100% }` which clamps
+   the sprite-sheet image to the container width and breaks Shaka's
+   transform-based thumbnail cropping. */
+.shaka-player-ui-thumbnail-image {
+    max-width: none !important;
 }
 </style>