diff --git a/packages/roomkit-react/src/Prebuilt/components/Settings/DeviceSettings.jsx b/packages/roomkit-react/src/Prebuilt/components/Settings/DeviceSettings.jsx
index 2f6ec91a17..2c81a581c1 100644
--- a/packages/roomkit-react/src/Prebuilt/components/Settings/DeviceSettings.jsx
+++ b/packages/roomkit-react/src/Prebuilt/components/Settings/DeviceSettings.jsx
@@ -146,7 +146,7 @@ const DeviceSelector = ({ title, devices, selection, onChange, icon, children =
               open={open}
             />
             <Dropdown.Portal>
-              <Dropdown.Content align="start" sideOffset={8} css={{ w: ref.current?.clientWidth, zIndex: 1000 }}>
+              <Dropdown.Content align="start" sideOffset={8} css={{ w: ref.current?.clientWidth, zIndex: 1001 }}>
                 {devices.map(device => {
                   return (
                     <Dropdown.Item
diff --git a/packages/roomkit-react/src/Prebuilt/components/Settings/SettingsModal.jsx b/packages/roomkit-react/src/Prebuilt/components/Settings/SettingsModal.jsx
index dc79b5073b..6d93d18890 100644
--- a/packages/roomkit-react/src/Prebuilt/components/Settings/SettingsModal.jsx
+++ b/packages/roomkit-react/src/Prebuilt/components/Settings/SettingsModal.jsx
@@ -91,6 +91,7 @@ const MobileSettingModal = ({
       <Sheet.Content
         css={{
           bg: '$surface_dim',
+          overflowY: 'auto',
         }}
       >
         <Sheet.Title css={{ py: '$10', px: '$8', alignItems: 'center' }}>
@@ -120,8 +121,8 @@ const MobileSettingModal = ({
             direction="column"
             css={{
               px: '$8',
-              maxHeight: '80vh',
-              overflowY: 'scroll',
+              pb: '$8',
+              overflowY: 'auto',
             }}
           >
             {settingsList