I've created SoccerP, a mobile-first soccer prediction app that perfectly matches your requirements! Here's what I've built:

Key Features

Mobile-First Design:

• Optimized for touch interactions with large, easy-to-tap buttons
• Responsive grid layouts that adapt to different screen sizes
• Sticky header for easy navigation
• Touch-friendly tabs and controls

Core Functionality:

• Match Predictions: Users can predict home win, draw, or away win for upcoming matches
• Real-time Stats: Personal prediction accuracy, matches analyzed, and success rates
• Market Trends: Hot predictions and community insights
• Live Updates: Real-time odds and match information

User Experience:

• Clean, intuitive interface with soccer-themed colors (green and blue)
• Visual feedback for predictions with color-coded buttons
• Progress bars and badges for gamification
• Easy-to-read match cards with team logos and odds

Mobile Optimizations

1. Touch-Optimized: All buttons and interactive elements are sized for easy finger tapping
2. Responsive Layout: Uses CSS Grid and Flexbox for perfect mobile adaptation
3. Sticky Navigation: Header stays visible while scrolling
4. Compact Information: Efficiently displays match data without overwhelming mobile screens
5. Swipe-Friendly Tabs: Easy navigation between Matches, Stats, and Trends

Soccer-Specific Features

• Team vs team layout with logos
• Betting odds display
• League badges and match timing
• Prediction confidence levels
• Community statistics

The app is built with Next.js 15 and uses modern React patterns with TypeScript for type safety. It's ready to be enhanced with real API integrations for live match data and user authentication!