feat: accessibility settings, subtitle/QTE improvements, docs update

src/components/Subtitles.vue

@@ -1,5 +1,6 @@
 <script setup lang="ts">
 import { ref, watch, computed } from 'vue'
+import { useGameStore } from '@/stores/gameStore'
 
 interface SubCue {
   start: number
@@ -14,6 +15,7 @@ const props = defineProps<{
   lang?: string
 }>()
 
+const store = useGameStore()
 const cues = ref<SubCue[]>([])
 const currentText = ref('')
 const loadedUrl = ref('')
@@ -96,7 +98,13 @@ function vttTimeToSeconds(ts: string): number {
 
 <template>
   <div class="subtitles" v-if="currentText">
-    <div class="sub-text">{{ currentText }}</div>
+    <div
+      class="sub-text"
+      :style="{
+        fontSize: store.subFontSize + 'px',
+        background: `rgba(0, 0, 0, ${store.subBgAlpha})`,
+      }"
+    >{{ currentText }}</div>
   </div>
 </template>