From ac4ff63438089228f935014cac75504b3f7f3a5a Mon Sep 17 00:00:00 2001
From: Maze Winther <mazewinther@gmail.com>
Date: Tue, 1 Jul 2025 15:02:34 +0200
Subject: [PATCH] fix: ensure playback ruler appears above everything else

---
 apps/web/src/components/editor/timeline.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/apps/web/src/components/editor/timeline.tsx b/apps/web/src/components/editor/timeline.tsx
index b16250e..71e4aa5 100644
--- a/apps/web/src/components/editor/timeline.tsx
+++ b/apps/web/src/components/editor/timeline.tsx
@@ -984,7 +984,7 @@ export function Timeline() {
 
                 {/* Playhead in ruler (scrubbable) */}
                 <div
-                  className="absolute top-0 bottom-0 w-0.5 bg-red-500 pointer-events-auto z-10 cursor-ew-resize"
+                  className="absolute top-0 bottom-0 w-0.5 bg-red-500 pointer-events-auto z-50 cursor-ew-resize"
                   style={{ left: `${playheadPosition * 50 * zoomLevel}px` }}
                   onMouseDown={handlePlayheadMouseDown}
                 >
@@ -1118,7 +1118,7 @@ export function Timeline() {
                     {/* Playhead for tracks area (scrubbable) */}
                     {tracks.length > 0 && (
                       <div
-                        className="absolute top-0 w-0.5 bg-red-500 pointer-events-auto z-20 cursor-ew-resize"
+                        className="absolute top-0 w-0.5 bg-red-500 pointer-events-auto z-50 cursor-ew-resize"
                         style={{
                           left: `${playheadPosition * 50 * zoomLevel}px`,
                           height: `${tracks.length * 60}px`,