Create a single-page SPA (Single Page Application) for an interactive Xkcd experience. The app should allow users to browse Xkcd comics, view them, and interact with them.
**Core Functionality:**
1. **Fetch Comics:** Use the Xkcd API (https://xkcd.com/about) to fetch comic data (title, alt text, image URL, number, date).
2. **Display Comic:** Show the current comic, its title, and its alt text (tooltip on hover).
3. **Navigation:** Implement 'Previous Comic', 'Next Comic', and 'Random Comic' buttons. Also, allow direct comic number input.
4. **Search:** Basic search functionality to find comics by title or keywords in the alt text. Display search results as a list of comic numbers and titles.
5. **Interactivity (MVP):** For at least 5-10 popular comics (e.g., 'Explain xkcd'), add a small, unique interactive element. This could be a subtle animation triggered by hover, a small controllable element within the comic image, or a 'play' button for animated comics. The interactivity should be directly related to the comic's content.
**Frontend Framework:** Choose a modern JavaScript framework like React, Vue, or Svelte.
**Styling:**
* Mimic the general aesthetic of Xkcd (simple, somewhat hand-drawn feel) but keep it clean and functional.
* Ensure responsiveness for desktop and mobile devices.
**API Integration:**
* Handle API calls efficiently. Cache fetched comic data locally where appropriate.
* Display loading states and error messages gracefully.
**Code Structure:** Organize the code into components (e.g., `ComicViewer`, `Navigation`, `SearchBar`, `InteractiveElement`). Use clear, readable code with appropriate comments.
**Deployment:** The final output should be runnable code for a static site deployment.