Adopt shared WebUI layout primitives

webui/src/features/cases/CaseDetailPage.tsx

@@ -1,7 +1,7 @@
 import { Archive, ArrowLeft, Save, Scale, Share2 } from "lucide-react";
 import { useCallback, useEffect, useMemo, useRef, useState } from "react";
 import { useParams } from "react-router";
-import {
+import { ActionToolbar,
   ActionBlockerHint,
   Button,
   DocumentationHelpLink,
@@ -181,7 +181,7 @@ export default function CaseDetailPage({ settings, auth }: PlatformRouteContext)
   return (
     <main className="cases-page">
       <div className="case-detail-shell">
-        <div className="case-detail-toolbar">
+        <ActionToolbar className="case-detail-toolbar">
           <button type="button" className="btn btn-ghost" onClick={() => navigate("/cases")}>
             <ArrowLeft size={16} aria-hidden="true" />
             Cases
@@ -215,7 +215,7 @@ export default function CaseDetailPage({ settings, auth }: PlatformRouteContext)
             </div>
           ) : null}
           <DocumentationHelpLink reference={CASES_DOCUMENTATION} />
-        </div>
+        </ActionToolbar>
         <PageScrollViewport className="case-detail-viewport">
           {error &&
             <DismissibleAlert tone="danger" resetKey={error}>