Default Component - Copy this React, Tailwind Component to your project

"Please create a responsively designed Snake game in a single HTML file, combining HTML, CSS, and JavaScript. Ensure an engaging UI/UX with the following requirements: Gameplay Mechanics: Snake movement using arrow keys (handle direction changes smoothly). Wall collision detection (display game over state). Self collision detection (avoid backward movement). Snake growth upon eating food (randomly placed food). Score tracking (display live score and high score). Dynamic speed increase (speed up as score rises). UI/UX Specifications: Dark mode theme with vibrant snake/food colors. Responsive grid layout (adjustable grid size, e.g., 20x20). Sleek start screen with play button. Game over overlay with restart button. Hover effects on controls and food. Technical Constraints: Single file implementation (no external assets). Use vanilla JavaScript (no libraries). Implement requestAnimationFrame for smooth frame updates. Include code comments for clarity. Wishlist (optional for bonus points): Smooth snake turning animations using CSS transforms. Sound effects (minimal, e.g., "nom" on food eat). Variable difficulty settings. Example Output: A playable game where the snake grows by eating food, with snappy controls and a polished interface." Key Improvements Made: Clarified specific gameplay mechanics (e.g., collision detection rules, score tracking). Added technical constraints (single file, no libraries) to guide code structure. Expanded UI/UX details (responsive grid, overlays, animations). Added optional bonuses for creativity while keeping core requirements strict. Defined scope with a clear example output.