feat(studio): timeline layer UI — context headers, audio lanes, drop affordances

L4 polish for the stacking-layer timeline:
- Sub-composition layers group under a slim "Inside: <comp>" header with a green
  accent, so it reads that restacking there is scoped to that context.
- Audio clips render in a distinct bottom lane: separator border, muted row bg,
  music glyph in the gutter, beat strip — clearly not part of the z-order stack.
- During a vertical drag, a drop affordance shows join-vs-insert: an "onto"
  target highlights the row (join that layer / same z); "between"/"above"/
  "below" shows an insertion line (new layer here).

New pure helper timelineDropIndicator.ts (+ test) maps placement -> indicator;
row-group rendering extracted into TimelineLayerGroupHeader / TimelineLayerGutter
/ TimelineDropInsertionLine / TimelineDragGhost to keep files under the 600 cap.

packages/studio/src/player/components/TimelineDropInsertionLine.tsx

@@ -0,0 +1,32 @@
+interface TimelineDropInsertionLineProps {
+  edge: "top" | "bottom";
+  accentColor: string;
+}
+
+export function TimelineDropInsertionLine({ edge, accentColor }: TimelineDropInsertionLineProps) {
+  return (
+    <div
+      className="absolute left-0 right-0 pointer-events-none"
+      style={{
+        top: edge === "top" ? -1 : undefined,
+        bottom: edge === "bottom" ? -1 : undefined,
+        height: 2,
+        background: accentColor,
+        boxShadow: `0 0 8px ${accentColor}`,
+        zIndex: 30,
+      }}
+    >
+      <span
+        className="absolute rounded-full"
+        style={{
+          left: 0,
+          top: -3,
+          width: 8,
+          height: 8,
+          background: accentColor,
+          boxShadow: `0 0 8px ${accentColor}`,
+        }}
+      />
+    </div>
+  );
+}