feat: redesign fortune wheel UI and add to mobile nav

- Add wheel button to mobile bottom nav (replaces Support when enabled)
- Slow down LED lights animation (250ms -> 600ms)
- Replace result modal with inline card in Wheel.tsx
- Add haptic feedback on spin result
- AdminWheel.tsx: inline prize editing instead of modal
- AdminWheel.tsx: drag-and-drop for prize reordering
- AdminWheel.tsx: live wheel preview on desktop
- AdminWheel.tsx: group settings into sections
- Replace confirm() with native dialog
- Add translations for all languages

src/components/layout/AppShell/AppShell.tsx

@@ -300,7 +300,7 @@ export function AppShell({ children }: AppShellProps) {
 
   // BackButton for Telegram Mini App
   // Don't show back button on main tab pages (bottom nav) - users navigate via tabs
-  const mainTabPaths = ['/', '/subscription', '/balance', '/referral', '/support'];
+  const mainTabPaths = ['/', '/subscription', '/balance', '/referral', '/support', '/wheel'];
   const isMainTabPage = mainTabPaths.includes(location.pathname);
   const handleBack = useCallback(() => {
     if (mobileMenuOpen) {
@@ -505,6 +505,7 @@ export function AppShell({ children }: AppShellProps) {
       <MobileBottomNav
         isKeyboardOpen={isKeyboardOpen}
         referralEnabled={referralTerms?.is_enabled}
+        wheelEnabled={wheelConfig?.is_enabled}
       />
     </div>
   );

src/components/layout/AppShell/MobileBottomNav.tsx

@@ -6,14 +6,19 @@ import { cn } from '@/lib/utils';
 import { usePlatform } from '@/platform';
 
 // Icons
-import { HomeIcon, SubscriptionIcon, WalletIcon, UsersIcon, ChatIcon } from './icons';
+import { HomeIcon, SubscriptionIcon, WalletIcon, UsersIcon, ChatIcon, WheelIcon } from './icons';
 
 interface MobileBottomNavProps {
   isKeyboardOpen: boolean;
   referralEnabled?: boolean;
+  wheelEnabled?: boolean;
 }
 
-export function MobileBottomNav({ isKeyboardOpen, referralEnabled }: MobileBottomNavProps) {
+export function MobileBottomNav({
+  isKeyboardOpen,
+  referralEnabled,
+  wheelEnabled,
+}: MobileBottomNavProps) {
   const { t } = useTranslation();
   const location = useLocation();
   const { haptic } = usePlatform();
@@ -21,12 +26,15 @@ export function MobileBottomNav({ isKeyboardOpen, referralEnabled }: MobileBotto
   const isActive = (path: string) => location.pathname === path;
 
   // Core navigation items for bottom bar
+  // When wheel is enabled, it replaces Support in the bottom nav (Support is still accessible via hamburger menu)
   const coreItems = [
     { path: '/', label: t('nav.dashboard'), icon: HomeIcon },
     { path: '/subscription', label: t('nav.subscription'), icon: SubscriptionIcon },
     { path: '/balance', label: t('nav.balance'), icon: WalletIcon },
     ...(referralEnabled ? [{ path: '/referral', label: t('nav.referral'), icon: UsersIcon }] : []),
-    { path: '/support', label: t('nav.support'), icon: ChatIcon },
+    ...(wheelEnabled
+      ? [{ path: '/wheel', label: t('nav.wheel'), icon: WheelIcon }]
+      : [{ path: '/support', label: t('nav.support'), icon: ChatIcon }]),
   ];
 
   const handleNavClick = () => {