fix: hoist prompt toast to App.vue so it survives ChoicePanel unmount after selection

src/components/ChoicePanel.vue

@@ -11,13 +11,12 @@ const props = defineProps<{
 
 const emit = defineEmits<{
   choose: [index: number]
+  prompt: [text: string]
 }>()
 
 const { t } = useI18n()
 const focusIndex = ref(0)
 const btnRefs = ref<(HTMLButtonElement | null)[]>([])
-const toastText = ref('')
-const toastVisible = ref(false)
 
 function timerPercent(): number {
   if (props.timerTotal <= 0) return 0
@@ -58,9 +57,7 @@ function onKeydown(e: KeyboardEvent, index: number) {
 function handleChoose(index: number) {
   const choice = props.choices[index]
   if (choice?.prompt) {
-    toastText.value = choice.prompt
-    toastVisible.value = true
-    setTimeout(() => { toastVisible.value = false }, 2200)
+    emit('prompt', choice.prompt)
   }
   emit('choose', index)
 }
@@ -90,10 +87,6 @@ function handleChoose(index: number) {
         {{ t(choice.textKey || choice.text) }}
       </button>
     </div>
-
-    <Transition name="toast-fade">
-      <div class="prompt-toast" v-if="toastVisible">{{ toastText }}</div>
-    </Transition>
   </div>
 </template>
 
@@ -191,26 +184,4 @@ function handleChoose(index: number) {
   border-color: rgba(255, 193, 7, 0.7);
   box-shadow: 0 0 12px rgba(255, 193, 7, 0.3);
 }
-
-.prompt-toast {
-  position: absolute;
-  top: 50%;
-  left: 50%;
-  transform: translate(-50%, -50%);
-  padding: 14px 32px;
-  font-size: 18px;
-  color: #ffc107;
-  background: rgba(0, 0, 0, 0.85);
-  border: 1px solid rgba(255, 193, 7, 0.4);
-  border-radius: 6px;
-  letter-spacing: 2px;
-  text-align: center;
-  white-space: nowrap;
-  pointer-events: none;
-}
-
-.toast-fade-enter-active { transition: opacity 0.3s ease; }
-.toast-fade-leave-active { transition: opacity 0.6s ease; }
-.toast-fade-enter-from,
-.toast-fade-leave-to { opacity: 0; }
 </style>