diff --git a/Mobile-Expensify b/Mobile-Expensify
index 56b3c41ffcc..ff7dc596e57 160000
--- a/Mobile-Expensify
+++ b/Mobile-Expensify
@@ -1 +1 @@
-Subproject commit 56b3c41ffcc17e76ee067daf27e9309d0eb2fcd9
+Subproject commit ff7dc596e57ba85cb0a7365da514ab733f4aca56
diff --git a/src/pages/iou/request/step/IOURequestStepScan/components/MobileWebCameraView.tsx b/src/pages/iou/request/step/IOURequestStepScan/components/MobileWebCameraView.tsx
index a20acca1985..e859d1771c8 100644
--- a/src/pages/iou/request/step/IOURequestStepScan/components/MobileWebCameraView.tsx
+++ b/src/pages/iou/request/step/IOURequestStepScan/components/MobileWebCameraView.tsx
@@ -1,5 +1,5 @@
 import {useIsFocused} from '@react-navigation/native';
-import React, {useCallback, useEffect, useReducer, useRef, useState} from 'react';
+import React, {useEffect, useReducer, useRef, useState} from 'react';
 import type {LayoutRectangle} from 'react-native';
 import {StyleSheet, View} from 'react-native';
 import type {OnyxEntry} from 'react-native-onyx';
@@ -36,6 +36,39 @@ import {isEmptyObject} from '@src/types/utils/EmptyObject';
 import NavigationAwareCamera from './NavigationAwareCamera/WebCamera';
 import ReceiptPreviews from './ReceiptPreviews';
 
+/**
+ * Eagerly query camera permission state at module load time so the result
+ * is available synchronously (or near-synchronously) when the component mounts.
+ * This avoids a loading-spinner flash when permission is already granted.
+ */
+let cachedPermissionState: PermissionState | undefined;
+if (typeof navigator !== 'undefined' && navigator.permissions) {
+    navigator.permissions
+        .query({name: 'camera'})
+        .then((status) => {
+            cachedPermissionState = status.state;
+            status.addEventListener('change', () => {
+                cachedPermissionState = status.state;
+            });
+        })
+        .catch(() => {
+            cachedPermissionState = 'denied';
+        });
+}
+
+function queryCameraPermission(): Promise<PermissionState> {
+    if (cachedPermissionState !== undefined) {
+        return Promise.resolve(cachedPermissionState);
+    }
+    if (typeof navigator === 'undefined' || !navigator.permissions) {
+        return Promise.resolve('denied' as PermissionState);
+    }
+    return navigator.permissions
+        .query({name: 'camera'})
+        .then((status) => status.state)
+        .catch((): PermissionState => 'denied');
+}
+
 type MobileWebCameraViewProps = {
     initialTransaction: OnyxEntry<Transaction>;
     initialTransactionID: string;
@@ -101,11 +134,12 @@ function MobileWebCameraView({
     const lazyIllustrations = useMemoizedLazyIllustrations(['MultiScan', 'Hand', 'Shutter']);
     const lazyIcons = useMemoizedLazyExpensifyIcons(['Bolt', 'Gallery', 'ReceiptMultiple', 'boltSlash']);
     const isTabActive = useIsFocused();
-    const [cameraPermissionState, setCameraPermissionState] = useState<PermissionState | undefined>('prompt');
+    const [cameraPermissionState, setCameraPermissionState] = useState<PermissionState | undefined>(() => cachedPermissionState ?? 'prompt');
     const [isFlashLightOn, toggleFlashlight] = useReducer((state: boolean) => !state, false);
     const [isTorchAvailable, setIsTorchAvailable] = useState(false);
-    const [isQueriedPermissionState, setIsQueriedPermissionState] = useState(false);
-    const [videoConstraints, setVideoConstraints] = useState<MediaTrackConstraints>();
+    const [isQueriedPermissionState, setIsQueriedPermissionState] = useState(() => cachedPermissionState !== undefined);
+    const [deviceConstraints, setDeviceConstraints] = useState<MediaTrackConstraints>();
+    const videoConstraints = isTabActive ? deviceConstraints : undefined;
     const cameraRef = useRef<Webcam>(null);
     const trackRef = useRef<MediaStreamTrack | null>(null);
     const viewfinderLayout = useRef<LayoutRectangle>(null);
@@ -115,7 +149,7 @@ function MobileWebCameraView({
      * On phones that have ultra-wide lens, react-webcam uses ultra-wide by default.
      * The last deviceId is of regular lens camera.
      */
-    const requestCameraPermission = useCallback(() => {
+    const requestCameraPermission = () => {
         const defaultConstraints = {facingMode: {exact: 'environment'}};
         navigator.mediaDevices
             .getUserMedia({video: {facingMode: {exact: 'environment'}, zoom: {ideal: 1}}})
@@ -135,12 +169,12 @@ function MobileWebCameraView({
                         }
                     }
                     if (deviceId) {
-                        setVideoConstraints({deviceId});
+                        setDeviceConstraints({deviceId});
                         return;
                     }
                 }
                 if (!navigator.mediaDevices.enumerateDevices) {
-                    setVideoConstraints(defaultConstraints);
+                    setDeviceConstraints(defaultConstraints);
                     return;
                 }
                 navigator.mediaDevices.enumerateDevices().then((devices) => {
@@ -153,30 +187,26 @@ function MobileWebCameraView({
                         }
                     }
                     if (!lastBackDeviceId) {
-                        setVideoConstraints(defaultConstraints);
+                        setDeviceConstraints(defaultConstraints);
                         return;
                     }
-                    setVideoConstraints({deviceId: lastBackDeviceId});
+                    setDeviceConstraints({deviceId: lastBackDeviceId});
                 });
             })
             .catch(() => {
-                setVideoConstraints(defaultConstraints);
+                setDeviceConstraints(defaultConstraints);
                 setCameraPermissionState('denied');
             });
-    }, []);
+    };
 
     useEffect(() => {
         if (!isTabActive) {
-            setVideoConstraints(undefined);
             return;
         }
-        navigator.permissions
-            .query({
-                name: 'camera',
-            })
-            .then((permissionState) => {
-                setCameraPermissionState(permissionState.state);
-                if (permissionState.state === 'granted') {
+        queryCameraPermission()
+            .then((state) => {
+                setCameraPermissionState(state);
+                if (state === 'granted') {
                     requestCameraPermission();
                 }
             })
@@ -186,9 +216,8 @@ function MobileWebCameraView({
             .finally(() => {
                 setIsQueriedPermissionState(true);
             });
-        // We only want to get the camera permission status when the component is mounted
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [isTabActive]);
+        // We want to refresh camera permission status when the tab is focused because the user could have changed permissions while the tab was backgrounded.
+    }, [isTabActive, requestCameraPermission]);
 
     useEffect(
         () => () => {
@@ -214,46 +243,43 @@ function MobileWebCameraView({
         setIsTorchAvailable('torch' in capabilities && !!capabilities.torch);
     };
 
-    const clearTorchConstraints = useCallback(() => {
+    const clearTorchConstraints = () => {
         if (!trackRef.current) {
             return;
         }
         trackRef.current.applyConstraints({
             advanced: [{torch: false}],
         });
-    }, []);
+    };
 
-    const onCapture = useCallback(
-        (file: FileObject, filename: string, source: string) => {
-            const transaction =
-                isMultiScanEnabled && initialTransaction?.receipt?.source
-                    ? buildOptimisticTransactionAndCreateDraft({
-                          initialTransaction,
-                          currentUserPersonalDetails,
-                          reportID,
-                      })
-                    : initialTransaction;
-            const transactionID = transaction?.transactionID ?? initialTransactionID;
-            const newReceiptFiles = [...receiptFiles, {file, source, transactionID}];
+    const onCapture = (file: FileObject, filename: string, source: string) => {
+        const transaction =
+            isMultiScanEnabled && initialTransaction?.receipt?.source
+                ? buildOptimisticTransactionAndCreateDraft({
+                      initialTransaction,
+                      currentUserPersonalDetails,
+                      reportID,
+                  })
+                : initialTransaction;
+        const transactionID = transaction?.transactionID ?? initialTransactionID;
+        const newReceiptFiles = [...receiptFiles, {file, source, transactionID}];
 
-            setMoneyRequestReceipt(transactionID, source, filename, !isEditing, file.type);
-            setReceiptFiles(newReceiptFiles);
+        setMoneyRequestReceipt(transactionID, source, filename, !isEditing, file.type);
+        setReceiptFiles(newReceiptFiles);
 
-            if (isMultiScanEnabled) {
-                return;
-            }
+        if (isMultiScanEnabled) {
+            return;
+        }
 
-            if (isEditing) {
-                updateScanAndNavigate(file, source);
-                return;
-            }
+        if (isEditing) {
+            updateScanAndNavigate(file, source);
+            return;
+        }
 
-            submitReceipts(newReceiptFiles);
-        },
-        [isMultiScanEnabled, initialTransaction, currentUserPersonalDetails, reportID, initialTransactionID, receiptFiles, isEditing, submitReceipts, setReceiptFiles, updateScanAndNavigate],
-    );
+        submitReceipts(newReceiptFiles);
+    };
 
-    const getScreenshot = useCallback(() => {
+    const getScreenshot = () => {
         if (!cameraRef.current) {
             requestCameraPermission();
             return;
@@ -298,9 +324,9 @@ function MobileWebCameraView({
             endSpan(CONST.TELEMETRY.SPAN_RECEIPT_CAPTURE);
             onCapture(file, filename, source);
         });
-    }, [isMultiScanEnabled, showBlink, requestCameraPermission, onCapture]);
+    };
 
-    const capturePhoto = useCallback(() => {
+    const capturePhoto = () => {
         if (trackRef.current && isFlashLightOn) {
             trackRef.current
                 .applyConstraints({
@@ -316,7 +342,7 @@ function MobileWebCameraView({
         }
 
         getScreenshot();
-    }, [isFlashLightOn, getScreenshot, clearTorchConstraints]);
+    };
 
     return (
         <StepScreenWrapper