refactor molecule components to use .withProps() subcomponents and extract inline code

- Add UnstyledButton listItem theme variant to replace inline style for border-radius
- Extract subcomponent constants with .withProps() across all molecules
- Replace raw <span /> with Mantine <Flex /> in ResourcePreviewPanel
- Extract inline template literals and expressions to named functions

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

clients/web/src/components/molecules/LogControls/LogControls.tsx

@@ -31,6 +31,11 @@ const LEVEL_COLORS: Record<string, { c: string; fw?: number }> = {
   emergency: { c: "red", fw: 900 },
 };
 
+const ToolbarButton = Button.withProps({
+  variant: "light",
+  size: "sm",
+});
+
 export interface LogControlsProps {
   currentLevel: string;
   filterText: string;
@@ -93,12 +98,8 @@ export function LogControls({
       })}
 
       <Group>
-        <Button variant="light" size="sm" onClick={onClear}>
-          Clear
-        </Button>
-        <Button variant="light" size="sm" onClick={onExport}>
-          Export
-        </Button>
+        <ToolbarButton onClick={onClear}>Clear</ToolbarButton>
+        <ToolbarButton onClick={onExport}>Export</ToolbarButton>
       </Group>
     </Stack>
   );