update

frontend/src/components/Lesemodus.vue

@@ -56,9 +56,16 @@ const gesperrt = computed(() =>
   && !fertig.value.has(screen.value.baustein))
 function vor() { if (!gesperrt.value && pos.value < screens.value.length - 1) pos.value++ }
 function zurueck() { if (pos.value > 0) pos.value-- }
+const buehne = ref(null)
 function taste(e) {
   if (e.key === 'ArrowRight') vor()
   else if (e.key === 'ArrowLeft') zurueck()
+  // Pfeil hoch/runter scrollen die Bühne — der innere Scroller hat nie Fokus,
+  // ohne das hier bewegen die Tasten also gar nichts
+  else if (e.key === 'ArrowDown' || e.key === 'ArrowUp') {
+    e.preventDefault()
+    buehne.value?.scrollBy({ top: e.key === 'ArrowDown' ? 140 : -140, behavior: 'smooth' })
+  }
 }
 
 // Wisch-Navigation (mobil): klar horizontal + kurz genug = blättern.
@@ -185,7 +192,7 @@ onUnmounted(() => {
       <button class="lm-x" title="Schließen" @click="schliessen">✕</button>
     </header>
 
-    <main class="lm-buehne">
+    <main ref="buehne" class="lm-buehne">
       <section v-if="screen.typ === 'intro'" class="lm-screen lm-intro">
         <div class="lm-kapnr">Kapitel {{ screen.nr }} / {{ screen.von }}</div>
         <h1>{{ screen.kap.titel }}</h1>

frontend/src/style.css

@@ -302,7 +302,8 @@ table.kennzahlen th { color: var(--dim); }
   background: var(--karte); color: var(--text); cursor: pointer; font-size: 14px;
 }
 .lm-fuss button:disabled { opacity: 0.4; cursor: default; }
-.lm-buehne { flex: 1; overflow-y: auto; }   /* Block-Scroll: Padding am Ende bleibt erhalten */
+.lm-buehne { flex: 1; overflow-y: auto; scrollbar-width: none; }   /* Block-Scroll: Padding am Ende bleibt erhalten */
+.lm-buehne::-webkit-scrollbar { display: none; }  /* Scrollbalken unsichtbar, Scrollen bleibt */
 .lm-screen {
   width: 100%; max-width: 760px; margin: 0 auto; padding: 40px 24px 96px;
   font-family: 'Inter Variable', system-ui, sans-serif;   /* Lesetypografie wie im Guide */