Improve page load times and rendering

tests/components/Top.test.tsx

@@ -73,7 +73,7 @@ describe('Top "Create rule" button', () => {
    * in-flight anonymous draft so the wizard always starts fresh. See
    * handleCreateRuleClick in Top.container.tsx for the contract.
    */
-  it("clears anonymous draft + core-value-details localStorage before routing to /create", async () => {
+  it("clears anonymous draft + core-value-details localStorage before routing to /create/informational", async () => {
     window.localStorage.setItem(
       CREATE_FLOW_ANONYMOUS_KEY,
       JSON.stringify({ title: "Stale community" }),
@@ -93,7 +93,7 @@ describe('Top "Create rule" button', () => {
     await userEvent.click(btn);
 
     await waitFor(() => {
-      expect(pushMock).toHaveBeenCalledWith("/create");
+      expect(pushMock).toHaveBeenCalledWith("/create/informational");
     });
     expect(window.localStorage.getItem(CREATE_FLOW_ANONYMOUS_KEY)).toBeNull();
     expect(

tests/components/cards/CaseStudy.test.tsx

@@ -10,22 +10,24 @@ describe("CaseStudy", () => {
     expect(container.querySelector('[data-figma-node="21993-32352"]')).toBeTruthy();
   });
 
-  it("renders built-in raster when visual is omitted (neutral)", () => {
+  it("renders built-in art when visual is omitted (neutral)", () => {
     render(
       <CaseStudy surface="neutral" imageAlt="Food Not Bombs logo" />,
     );
 
     expect(
       screen.getByRole("img", { name: "Food Not Bombs logo" }),
-    ).toHaveAttribute("src");
+    ).toBeTruthy();
   });
 
   it("uses Mutual Aid vector on lavender surface", () => {
     const { container } = render(
       <CaseStudy surface="lavender" imageAlt="Mutual Aid Colorado logo" />,
     );
-    expect(container.querySelector("img")?.getAttribute("src")).toContain(
-      "case-study-mutual-aid.svg",
-    );
+    expect(
+      container.querySelector("[data-case-study-art]")?.getAttribute(
+        "data-case-study-art",
+      ),
+    ).toBe("case-study-mutual-aid");
   });
 });

tests/unit/Layout.test.jsx

@@ -138,10 +138,13 @@ describe("Group layouts (chrome composition)", () => {
 
   test("AppLayout wraps children in <main flex-1> with no footer", () => {
     const tree = AppLayout({ children: <div>app-child</div> });
-    expect(tree.type).toBe("main");
-    expect(tree.props.className).toContain("flex-1");
+    const main = findDescendant(
+      tree,
+      (n) => n?.type === "main" && n.props?.className?.includes("flex-1"),
+    );
+    expect(main).toBeTruthy();
     expect(
-      findDescendant(tree, (n) => typeof n === "string" && n.includes("app-child")),
+      findDescendant(main, (n) => typeof n === "string" && n.includes("app-child")),
     ).toBeTruthy();
   });
 });