feat(frontend): slice 2 — migrate 11 shared components to shadcn/Tailwind

Web UI rework. Shared-components slice (drift prevention):
- Migrate SectionCard, SelectionRailCard, TabbedCard, MetricCard,
  DiskSpaceCard, HoverEditButton, DialogFooter, ConfirmDialog,
  LibraryOverview, NowPlaying, SessionActivityPanel off @mui
- HoverEditButton: MUI IconButton + EditOutlined -> Button + lucide Pencil
- Status mapping uses the success Badge variant (chart-2) for healthy
- Exported APIs preserved so consuming pages still compile (no page edits)
- 11 behavioral Vitest component tests added

Gate: build + lint + test green.

frontend/src/components/__tests__/SelectionRailCard.test.tsx

@@ -0,0 +1,33 @@
+import { describe, it, expect } from "vitest";
+import { render, screen } from "@testing-library/react";
+import { SelectionRailCard } from "../SelectionRailCard";
+
+describe("SelectionRailCard", () => {
+	it("renders the title, body, and footer and honors minHeight", () => {
+		render(
+			<SelectionRailCard
+				title="Saved tasks"
+				description="Pick one"
+				minHeight={200}
+				footer={<button type="button">New task</button>}
+			>
+				<div>Task A</div>
+			</SelectionRailCard>,
+		);
+		expect(screen.getByText("Saved tasks")).toBeInTheDocument();
+		expect(screen.getByText("Task A")).toBeInTheDocument();
+		expect(
+			screen.getByRole("button", { name: "New task" }),
+		).toBeInTheDocument();
+		// minHeight is applied to the Card via inline style.
+		const card = screen
+			.getByText("Saved tasks")
+			.closest("[data-slot='card']") as HTMLElement | null;
+		expect(card?.style.minHeight).toBe("200px");
+	});
+
+	it("renders without a footer", () => {
+		render(<SelectionRailCard title="No footer">body</SelectionRailCard>);
+		expect(screen.getByText("No footer")).toBeInTheDocument();
+	});
+});