refactor(web): resolve Mantine/CSS rule violations in mid-session auth UI

- App.tsx: replace the inline `style={{}}` on the re-auth banner wrapper with
  Mantine style props (pos/top/bg) plus a `.reauth-banner-bar` class for the
  z-index/box-shadow that have no Mantine shorthand.
- App.tsx: extract the ~100-line inline `onAuthorize` and the inline `onCancel`
  step-up handlers into named `handleStepUpAuthorize`/`handleStepUpCancel`.
- ReAuthBanner: move the flat `styles={{ root }}` (background/border) into a
  `reauth` Alert theme variant; replace the raw `<span>` with `<Text>`.
- StepUpAuthModal: extract the inline `onClick` wrapper into `handleAuthorize`.

No behavior change; validate + integration green.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01DZyeWManYTvcXxjcrhxSQc

clients/web/src/components/groups/ReAuthBanner/ReAuthBanner.tsx

@@ -1,4 +1,4 @@
-import { Alert, Button, Group } from "@mantine/core";
+import { Alert, Button, Group, Text } from "@mantine/core";
 
 export interface ReAuthBannerProps {
   message: string;
@@ -14,19 +14,15 @@ export function ReAuthBanner({
   return (
     <Alert
       color="red"
-      variant="light"
+      variant="reauth"
       title="Re-authentication required"
       withCloseButton
       onClose={onDismiss}
-      styles={{
-        root: {
-          backgroundColor: "var(--mantine-color-body)",
-          border: "1px solid var(--mantine-color-red-3)",
-        },
-      }}
     >
       <Group justify="space-between" align="center" wrap="nowrap" gap="md">
-        <span>{message}</span>
+        <Text component="span" size="sm">
+          {message}
+        </Text>
         <Button size="xs" variant="filled" onClick={onReauthenticate}>
           Re-authenticate
         </Button>

clients/web/src/components/groups/StepUpAuthModal/StepUpAuthModal.tsx

@@ -30,6 +30,7 @@ export function StepUpAuthModal({
 }: StepUpAuthModalProps) {
   const additionalScopes = challenge ? stepUpAdditionalScopes(challenge) : [];
   const ema = enterpriseManaged === true;
+  const handleAuthorize = () => void onAuthorize();
 
   return (
     <Modal
@@ -79,7 +80,7 @@ export function StepUpAuthModal({
           <Button variant="default" onClick={onCancel}>
             Cancel
           </Button>
-          <Button onClick={() => void onAuthorize()}>Authorize</Button>
+          <Button onClick={handleAuthorize}>Authorize</Button>
         </Actions>
       </Stack>
     </Modal>