diff --git a/front/src/ui/player/controls/index.tsx b/front/src/ui/player/controls/index.tsx
index c1730000..b93b293b 100644
--- a/front/src/ui/player/controls/index.tsx
+++ b/front/src/ui/player/controls/index.tsx
@@ -1,4 +1,4 @@
-import { useState } from "react";
+import { useCallback, useState } from "react";
 import type { ViewProps } from "react-native";
 import { StyleSheet, View } from "react-native";
 import { useSafeAreaInsets } from "react-native-safe-area-context";
@@ -35,7 +35,7 @@ export const Controls = ({
 	const isTouch = useIsTouch();
 
 	const [hover, setHover] = useState(false);
-	const [menuOpenned, setMenu] = useState(false);
+	const [menuOpened, setMenuOpened] = useState(false);
 
 	const hoverControls = {
 		onPointerEnter: (e) => {
@@ -46,11 +46,17 @@ export const Controls = ({
 		},
 	} satisfies ViewProps;
 
+	const setMenu = useCallback((val: boolean) => {
+		setMenuOpened(val);
+		// Disable hover since the menu overlay makes the pointer leave unreliable.
+		if (!val) setHover(false);
+	}, []);
+
 	return (
 		<View {...css(StyleSheet.absoluteFillObject)}>
 			<TouchControls
 				player={player}
-				forceShow={hover || menuOpenned}
+				forceShow={hover || menuOpened}
 				{...css(StyleSheet.absoluteFillObject)}
 			>
 				<Back