refactor(web): sweep AGENTS.md TypeScript + Mantine rule violations (#1771)

Codebase-wide sweep bringing the web client into strict compliance with the AGENTS.md TypeScript and Mantine/React conventions: ~170 inline 2+-static-prop elements extracted to named .withProps() constants across ~77 files, the AGENTS.md rule wording tightened to match (static-prop boundary + Accordion/Transition/data-*/Box exemptions), a real ScreenStage Box->Flex layout regression fixed (direction: column) with a Storybook regression guard, and an App.tsx double-cast tightened. Closes #1762.

clients/web/src/components/elements/ExpandToggle/ExpandToggle.tsx

@@ -14,6 +14,12 @@ export interface ExpandToggleProps {
   ariaLabel?: string;
 }
 
+const ExpandActionIcon = ActionIcon.withProps({
+  variant: "subtle",
+  color: "gray",
+  size: "md",
+});
+
 /**
  * Icon toggle for a per-entry expand/collapse control (Protocol, Network, and
  * Task cards). Uses the same expand/collapse-vertical icons as the list-level
@@ -31,16 +37,13 @@ export function ExpandToggle({
   const label = expanded ? "Collapse" : "Expand";
   return (
     <Tooltip label={label}>
-      <ActionIcon
-        variant="subtle"
-        color="gray"
-        size="md"
+      <ExpandActionIcon
         aria-label={ariaLabel ?? label}
         aria-expanded={expanded}
         onClick={onToggle}
       >
         <Icon size={16} />
-      </ActionIcon>
+      </ExpandActionIcon>
     </Tooltip>
   );
 }