feat: use howler

src/routes/-/RootLayout/components/Navigation/Navigation.tsx

@@ -23,7 +23,7 @@ import rouletteIcon from "./assets/roulette.svg";
 import tasksIcon from "./assets/tasks.svg";
 import earningsIcon from "./assets/earnings.svg";
 import tg, { useTelegramViewportValue } from "@/tg";
-import { usePlaySound } from "@/audio";
+import { useAudioStore } from "@/audio";
 
 const ANIMATION_DURATION = 0.2;
 const SPRING_ANIMATION = {
@@ -193,7 +193,7 @@ function MenuBar({ labelKey, icon, delay, active, onClick }: MenuBarProps) {
 }
 
 export default function Navigation() {
-  const play = usePlaySound();
+  const play = useAudioStore((s) => s.play);
   const matchRoute = useMatchRoute();
   const navigate = useNavigate();
   const [menuOpen, setMenuOpen] = useState<number>(0);