diff --git a/src/app.css b/src/app.css
index 39638365..a1ea5444 100644
--- a/src/app.css
+++ b/src/app.css
@@ -1009,6 +1009,9 @@ a[href^='http'][rel*='nofollow']:visited:not(:has(div)) {
 :is(.carousel-top-controls, .carousel-controls)[hidden] {
   opacity: 0;
 }
+.carousel-controls {
+  top: 45%;
+}
 
 :is(.button, button).carousel-button,
 button.carousel-dot {
diff --git a/src/components/media-modal.jsx b/src/components/media-modal.jsx
index 77c5dfee..eeba6405 100644
--- a/src/components/media-modal.jsx
+++ b/src/components/media-modal.jsx
@@ -84,6 +84,13 @@ function MediaModal({
     };
   }, []);
 
+  useEffect(() => {
+    let timer = setTimeout(() => {
+      carouselRef.current?.focus?.();
+    }, 100);
+    return () => clearTimeout(timer);
+  }, []);
+
   return (
     <div class="media-modal-container">
       <div