mock: バリアントのバッジをノードより後に描き、キーの下に隠れないようにする

バッジは NodeSvg の再帰の中で各バリアントグループの <g> に描いていたため、
後から描かれる兄弟のキーに隠れていた。選択の描画層の後に PhyBadgeLayer を置き、
位置は純粋関数 variantBadges でワールド座標に直して正立で描く。
フォーカス中、フォーカス外のバッジは薄く描き、クリックを受けない。

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01NznQtmVPoQAnietqwr1auL

mock/tests/phyLogic.test.ts

@@ -13,6 +13,7 @@ import {
   resolveKey,
   snap,
   selectionFrames,
+  variantBadges,
   tabOrder,
   treeIndex,
   visibleNodeIds,
@@ -69,6 +70,34 @@ describe("PHY pure interaction rules", () => {
     const candidateOnly = selectionFrames(roots, [], {}, "target")[0]!;
     expect([candidateOnly.selected, candidateOnly.candidate]).toEqual([false, true]);
   });
+  it("places variant badges at the rotated group's top-right corner, upright", () => {
+    const key = (id: string): PhyNode => ({
+      type: "key",
+      id,
+      profile: "p",
+      transform: { x: 0, y: 0, rotation: 0 },
+      size: { w: 2, h: 1 },
+    });
+    const roots: PhyNode[] = [
+      {
+        type: "variantGroup",
+        id: "g",
+        name: "G",
+        transform: { x: 1, y: 1, rotation: 90 },
+        default: "a",
+        children: [
+          { type: "variant", id: "a", name: "A", children: [key("ka")] },
+          { type: "variant", id: "b", name: "B", children: [] },
+        ],
+      },
+    ];
+    const [badge] = variantBadges(roots, {}, 10);
+    // ローカル (2 + 0.4, -2 - 0.4) を90度回して (1, 1) だけ動かす
+    expect(badge!.group.id).toBe("g");
+    expect(badge!.x).toBeCloseTo(1 + 2.4);
+    expect(badge!.y).toBeCloseTo(1 + 2.4);
+    expect(badge!.size).toBeCloseTo(2);
+  });
   it("removes ancestors and descendants from mixed selections", () => {
     expect(normalizeSelection(phy, ["c", "k"])).toEqual(["k"]);
     expect(normalizeSelection(phy, ["k", "c"])).toEqual(["c"]);