fix(studio): make the player store the single source of truth for selection

setSelectedElementId now always collapses to one element (genuine user intent); a new
setSelectionAnchor moves the anchor within a multi-selection without collapsing it, used
only by the DOM-to-store sync echoes so a group survives a gesture.

applyDomSelection mirrors the whole DOM group into the store via setSelection instead of
writing only the anchor, so the store stays authoritative and a preview click collapses
while a preserved-group echo keeps every member.

packages/studio/src/hooks/useDomEditWiring.ts

@@ -171,12 +171,13 @@ export function useDomEditWiring({
 
   useEffect(() => {
     if (!domEditSelection?.id) return;
-    const { selectedElementId, elements, setSelectedElementId } = usePlayerStore.getState();
+    const { selectedElementId, elements, setSelectionAnchor } = usePlayerStore.getState();
     // Resolve through the canonical resolver (source-file + ancestor + active-comp
     // fallback) rather than a narrow domId/id match, so a sub-composition selection
-    // maps to the same clip the rest of the selection pipeline picks.
+    // maps to the same clip the rest of the selection pipeline picks. Use the
+    // anchor-only setter: this is a DOM->store echo and must not collapse a group.
     const key = resolveTimelineIdForSelection(domEditSelection, elements, activeCompPath);
-    if (key && key !== selectedElementId) setSelectedElementId(key);
+    if (key && key !== selectedElementId) setSelectionAnchor(key);
   }, [domEditSelection, activeCompPath]);
 
   // ── GSAP cache sync ──

packages/studio/src/hooks/useDomSelection.ts

@@ -203,12 +203,24 @@ export function useDomSelection({
           setRightCollapsed(false);
           setRightPanelTab("design");
         }
-        const nextSelectedTimelineId = resolveTimelineIdForSelection(
+        // Mirror the whole DOM group to the store so it stays the single source of
+        // truth: a single selection collapses to one id; a preserved group (echo
+        // during a gesture) keeps every member instead of shrinking to the anchor.
+        const anchorId = resolveTimelineIdForSelection(
           nextSelection,
           timelineElements,
           activeCompPath,
         );
-        setSelectedTimelineElementId(nextSelectedTimelineId);
+        const groupIds = nextGroup
+          .map((selection) =>
+            resolveTimelineIdForSelection(selection, timelineElements, activeCompPath),
+          )
+          .filter((id): id is string => Boolean(id));
+        if (groupIds.length > 0) {
+          usePlayerStore.getState().setSelection(groupIds, anchorId);
+        } else {
+          setSelectedTimelineElementId(anchorId);
+        }
         return;
       }