diff --git a/index.html b/index.html
index 91db746..fd115e7 100644
--- a/index.html
+++ b/index.html
@@ -250,6 +250,7 @@
             align-items: center;
             opacity: 0.7;
             transition: opacity 0.2s;
+            min-width: 0; /* Prevent flex items from overflowing */
         }
         
         .file-item:hover .file-tags {
diff --git a/renderer.js b/renderer.js
index 9db2078..4c92c4e 100644
--- a/renderer.js
+++ b/renderer.js
@@ -90,7 +90,7 @@ function displayFiles(files) {
         <span class="tag-icon extra-tag" data-file-path="${file.path}" title="Mark as Extra">🏷️</span>
         <span class="tag-icon commentary-tag" data-file-path="${file.path}" title="Add Commentary">💬</span>
         <span class="video-preview-btn" data-file-path="${file.path}" title="Preview Video">🎬</span>
-        <button class="play-button" style="visibility: hidden; width: 0; margin: 0; padding: 0;" data-file-path="${file.path}">▶️</button>
+        <button class="play-button" style="visibility: hidden; width: 0; margin: 0; padding: 0; flex-shrink: 0;" data-file-path="${file.path}">▶️</button>
       </div>
     `;