diff --git a/src/app.css b/src/app.css
index d64ce87f..14502ff0 100644
--- a/src/app.css
+++ b/src/app.css
@@ -388,11 +388,14 @@ button.carousel-dot {
   backdrop-filter: none !important;
 }
 button.carousel-dot:hover,
-button.carousel-dot.active {
+button.carousel-dot.active,
+button.carousel-dot[disabled].active {
   color: var(--link-color) !important;
 }
-button.carousel-dot.active {
-  pointer-events: none;
+button.carousel-dot.active,
+button.carousel-dot[disabled].active {
+  opacity: 1;
+  transform: scale(2) translateY(-.5px);
 }
 @media (hover: hover) {
   .carousel-top-controls {
diff --git a/src/components/status.jsx b/src/components/status.jsx
index 0f81b2b2..23ad9a1b 100644
--- a/src/components/status.jsx
+++ b/src/components/status.jsx
@@ -1005,6 +1005,7 @@ function Status({
                   <button
                     key={media.id}
                     type="button"
+                    disabled={i === showMediaModal}
                     class={`plain carousel-dot ${
                       i === showMediaModal ? 'active' : ''
                     }`}