diff --git a/Manga-Availability-Finder/README.md b/Manga-Availability-Finder/README.md
new file mode 100644
index 0000000..867b349
--- /dev/null
+++ b/Manga-Availability-Finder/README.md
@@ -0,0 +1,145 @@
+# 🔍 Webtoon/Manga Availability Finder
+
+**Live Demo:** [webtoonhunter.lovable.app](https://webtoonhunter.lovable.app)
+
+---
+
+## What is this?
+
+Webtoon/Manga Availability Finder is an AI-powered manga/webtoon availability checker that searches multiple reading platforms simultaneously. It uses the TinyFish Web Agent API for real-time browser automation, deploying parallel browser agents to search and verify availability across multiple platforms.
+
+---
+
+## Demo
+
+<!-- Replace with your demo gif/video -->
+
+https://github.com/user-attachments/assets/7b3ef9be-d4ba-43be-b3b5-ed9ea246c591
+
+---
+
+## Code Snippet
+
+```typescript
+// Call TinyFish Web Agent API with SSE streaming for real-time browser automation
+
+const response = await fetch("https://mino.ai/v1/automation/run-sse", {
+  method: "POST",
+  headers: {
+    "Content-Type": "application/json",
+    "X-API-Key": process.env.MINO_API_KEY,
+  },
+  body: JSON.stringify({
+    url,  // e.g., "https://mangadex.org/search?q=One+Piece"
+    goal: `You are searching for a manga/webtoon called "${mangaTitle}"...
+           STEP 1: Find and use the search bar to enter the title
+           STEP 2: Analyze the search results for matches
+           STEP 3: Return JSON with { found: boolean, match_confidence: string }`,
+    stream: true,
+  }),
+});
+
+// Stream SSE events back to client for live preview
+const reader = response.body?.getReader();
+while (true) {
+  const { done, value } = await reader.read();
+  if (done) break;
+  // Forward streamingUrl + completion events to frontend
+}
+```
+
+---
+
+## How to Run
+
+### Prerequisites
+- Node.js 18+
+- Lovable Cloud account (or Supabase project)
+
+### Environment Variables
+
+| Variable | Description | Required |
+|----------|-------------|----------|
+| `MINO_API_KEY` | TinyFish Web Agent [API key](https://mino.ai) | ✅ |
+| `GEMINI_API_KEY` | API key from [Google AI Studio](https://makersuite.google.com) | ✅ |
+
+### Setup
+
+```bash
+# 1. Clone the repository
+git clone <your-repo-url>
+cd webtoon-hunter
+
+# 2. Install dependencies
+npm install
+
+# 3. Add secrets to your Lovable Cloud / Supabase project
+# Navigate to Settings → Secrets and add:
+#   - TinyFish Web Agent AI KEY
+#   - GEMINI_API_KEY
+
+# 4. Start development server
+npm run dev
+```
+
+---
+
+## Architecture Diagram
+
+```
+┌─────────────────────────────────────────────────────────────────────────────┐
+│                              User Interface                                  │
+│                                                                             │
+│  ┌─────────────┐    ┌──────────────────┐    ┌─────────────────────────────┐ │
+│  │ SearchHero  │───▶│  useMangaSearch  │───▶│  AgentCard (x6 parallel)   │ │
+│  │  Component  │    │      Hook        │    │  with Live Stream Preview   │ │
+│  └─────────────┘    └──────────────────┘    └─────────────────────────────┘ │
+└─────────────────────────────────────────────────────────────────────────────┘
+                                    │
+                                    ▼
+┌─────────────────────────────────────────────────────────────────────────────┐
+│                         Edge Functions (Supabase)                            │
+│                                                                             │
+│  ┌────────────────────────┐         ┌────────────────────────────────────┐  │
+│  │  discover-manga-sites  │         │         search-manga (x6)          │  │
+│  │  (1x per search)       │         │     (parallel browser agents)      │  │
+│  │                        │         │                                    │  │
+│  │  Gemini → Get site URLs│         │  TinyFish API → Browser Automation |  |
+│  │  (+ fallback sites)    │         │  (SSE real-time streaming)         │  │
+│  └────────────────────────┘         └────────────────────────────────────┘  │
+└─────────────────────────────────────────────────────────────────────────────┘
+                                    │
+                                    ▼
+┌─────────────────────────────────────────────────────────────────────────────┐
+│                            External APIs                                     │
+│                                                                             │
+│  ┌────────────────────────┐         ┌────────────────────────────────────┐  │
+│  │      Gemini API        │         │      TinyFish Web Agent API        │  │
+│  │   (Site Discovery)     │         │    (Browser Automation + SSE)      │  │
+│  │      Called: 1x        │         │       Called: 5-6x parallel        │  │
+│  └────────────────────────┘         └────────────────────────────────────┘  │
+└─────────────────────────────────────────────────────────────────────────────┘
+```
+
+### Flow Summary
+
+1. **User enters manga title** → Client triggers search
+2. **Gemini API** discovers 5-6 relevant manga site URLs (with fallback if rate-limited)
+3. **TinyFish Web Agent API** deploys parallel browser agents to each site
+4. **SSE Streaming** provides live browser preview URLs + real-time status updates
+5. **Results** display which sites have the manga available
+
+---
+
+## Tech Stack
+
+- **Frontend:** React, TypeScript, Tailwind CSS, shadcn/ui
+- **Backend:** Supabase Edge Functions (Deno)
+- **APIs:** TinyFish Web Agent (browser automation), Gemini (site discovery)
+- **Streaming:** Server-Sent Events (SSE)
+
+---
+
+## License
+
+MIT
diff --git a/Manga-Availability-Finder/docs/MINO_API_INTEGRATION.md b/Manga-Availability-Finder/docs/MINO_API_INTEGRATION.md
new file mode 100644
index 0000000..9ce2b3c
--- /dev/null
+++ b/Manga-Availability-Finder/docs/MINO_API_INTEGRATION.md
@@ -0,0 +1,380 @@
+# Mino API Integration Documentation
+
+## Product Architecture Overview
+
+This application is a **Manga/Webtoon Finder** that uses AI-powered browser automation to search for manga availability across multiple websites simultaneously.
+
+### System Architecture
+
+```
+┌─────────────────────────────────────────────────────────────────────────────┐
+│                              Client (React)                                  │
+│                                                                             │
+│  ┌─────────────┐    ┌──────────────────┐    ┌─────────────────────────────┐ │
+│  │ SearchHero  │───▶│  useMangaSearch  │───▶│  AgentCard (x6 parallel)   │ │
+│  │  Component  │    │      Hook        │    │  with Live Stream Preview   │ │
+│  └─────────────┘    └──────────────────┘    └─────────────────────────────┘ │
+└─────────────────────────────────────────────────────────────────────────────┘
+                                    │
+                                    ▼
+┌─────────────────────────────────────────────────────────────────────────────┐
+│                         Edge Functions (Supabase)                            │
+│                                                                             │
+│  ┌────────────────────────┐         ┌────────────────────────────────────┐  │
+│  │  discover-manga-sites  │         │         search-manga (x6)          │  │
+│  │  (Called: 1x)          │         │         (Called: 6x parallel)      │  │
+│  │                        │         │                                    │  │
+│  │  Gemini API → Get URLs │         │  Mino API → Browser Automation     │  │
+│  │  (with fallback sites) │         │  (SSE Streaming)                   │  │
+│  └────────────────────────┘         └────────────────────────────────────┘  │
+└─────────────────────────────────────────────────────────────────────────────┘
+                                    │
+                                    ▼
+┌─────────────────────────────────────────────────────────────────────────────┐
+│                            External APIs                                     │
+│                                                                             │
+│  ┌────────────────────────┐         ┌────────────────────────────────────┐  │
+│  │      Gemini API        │         │           Mino API                 │  │
+│  │  (Site Discovery)      │         │    (Browser Automation + SSE)      │  │
+│  └────────────────────────┘         └────────────────────────────────────┘  │
+└─────────────────────────────────────────────────────────────────────────────┘
+```
+
+### API Call Summary
+
+| API | Purpose | Calls per Search | Response Type |
+|-----|---------|------------------|---------------|
+| Gemini API | Discover manga reading sites | 1x | JSON |
+| Mino API | Automate browser search on each site | 5-6x (parallel) | SSE Stream |
+
+### Orchestration Flow
+
+1. **User enters manga title** → Client triggers `useMangaSearch.search(title)`
+2. **Site Discovery** → `discover-manga-sites` edge function calls Gemini API (or uses fallback)
+3. **Agent Initialization** → Client creates 5-6 agent cards in "idle" state
+4. **Parallel Browser Automation** → `search-manga` edge function called for each site simultaneously
+5. **Real-time Updates** → Mino SSE stream provides live browser preview URL + final result
+6. **Results Display** → Each agent card updates independently as results arrive
+
+---
+
+## Code Snippets
+
+### 1. Calling the Mino API (Edge Function)
+
+```typescript
+// supabase/functions/search-manga/index.ts
+
+import { serve } from "https://deno.land/std@0.168.0/http/server.ts";
+
+const corsHeaders = {
+  "Access-Control-Allow-Origin": "*",
+  "Access-Control-Allow-Headers": "authorization, x-client-info, apikey, content-type",
+};
+
+serve(async (req) => {
+  if (req.method === "OPTIONS") {
+    return new Response(null, { headers: corsHeaders });
+  }
+
+  const { url, mangaTitle } = await req.json();
+  const MINO_API_KEY = Deno.env.get("MINO_API_KEY");
+
+  // Define the automation goal (see Goal section below)
+  const goal = `You are searching for a manga/webtoon called "${mangaTitle}"...`;
+
+  // Call Mino API with SSE streaming
+  const response = await fetch("https://mino.ai/v1/automation/run-sse", {
+    method: "POST",
+    headers: {
+      "Content-Type": "application/json",
+      "X-API-Key": MINO_API_KEY,
+    },
+    body: JSON.stringify({
+      url,           // Starting URL (e.g., mangadex.org/search?q=One+Piece)
+      goal,          // Natural language instruction for the browser agent
+      timeout: 60000 // Maximum execution time in milliseconds
+    }),
+  });
+
+  // Stream SSE events back to client
+  // ... (see full implementation below)
+});
+```
+
+### 2. Client-Side SSE Consumption
+
+```typescript
+// src/hooks/useMangaSearch.ts
+
+const searchSite = async (agent: SiteAgent, title: string) => {
+  const response = await fetch(`${supabaseUrl}/functions/v1/search-manga`, {
+    method: "POST",
+    headers: {
+      "Content-Type": "application/json",
+      "Authorization": `Bearer ${supabaseKey}`,
+      "apikey": supabaseKey,
+    },
+    body: JSON.stringify({ url: agent.siteUrl, mangaTitle: title }),
+  });
+
+  // Handle SSE stream
+  const reader = response.body?.getReader();
+  const decoder = new TextDecoder();
+
+  while (true) {
+    const { done, value } = await reader.read();
+    if (done) break;
+
+    const chunk = decoder.decode(value);
+    const lines = chunk.split("\n");
+
+    for (const line of lines) {
+      if (line.startsWith("data: ")) {
+        const data = JSON.parse(line.slice(6));
+
+        // Handle streaming URL for live preview
+        if (data.type === "stream" && data.streamingUrl) {
+          updateAgent(agent.id, { 
+            streamingUrl: data.streamingUrl,
+            statusMessage: "Agent browsing..." 
+          });
+        }
+
+        // Handle completion
+        if (data.type === "complete") {
+          updateAgent(agent.id, {
+            status: data.found ? "found" : "not_found",
+            statusMessage: data.found 
+              ? "Manga found on this site!" 
+              : "Not available on this site",
+          });
+        }
+      }
+    }
+  }
+};
+```
+
+### 3. cURL Example
+
+```bash
+curl -X POST "https://mino.ai/v1/automation/run-sse" \
+  -H "Content-Type: application/json" \
+  -H "X-API-Key: YOUR_MINO_API_KEY" \
+  -d '{
+    "url": "https://mangadex.org/search?q=One%20Piece",
+    "goal": "You are searching for a manga/webtoon called \"One Piece\" on this website...",
+    "timeout": 60000
+  }'
+```
+
+---
+
+## Goal (Prompt)
+
+The following natural language prompt is sent to the Mino API to instruct the browser automation agent:
+
+```
+You are searching for a manga/webtoon called "${mangaTitle}" on this website.
+
+STEP 1 - NAVIGATION:
+If there's a search bar or search input, enter "${mangaTitle}" and submit the search.
+If there's no search bar visible, look for a search icon or link to a search page.
+
+STEP 2 - ANALYZE RESULTS:
+Look at the search results or page content carefully.
+Check if "${mangaTitle}" appears in the results (exact match or very close match).
+
+STEP 3 - RETURN RESULT:
+Return a JSON object:
+{
+  "found": true or false,
+  "manga_title": "${mangaTitle}",
+  "site_url": "current page URL",
+  "match_confidence": "high" or "medium" or "low",
+  "notes": "brief explanation of what you found or didn't find"
+}
+
+IMPORTANT: Only return "found": true if you see a clear match for "${mangaTitle}" in the results.
+```
+
+### Prompt Design Principles
+
+| Principle | Application |
+|-----------|-------------|
+| **Structured Steps** | Breaks down the task into clear navigation → analysis → output phases |
+| **Fallback Handling** | Accounts for sites without visible search bars |
+| **Strict Matching** | Prevents false positives by requiring exact/close matches |
+| **JSON Output** | Ensures machine-parseable response for automation |
+
+---
+
+## Sample Output
+
+### SSE Stream Events
+
+The Mino API returns Server-Sent Events (SSE) during execution. Here's the sequence:
+
+#### Event 1: Streaming URL (Immediate)
+
+```json
+data: {
+  "type": "STREAM_URL",
+  "streamingUrl": "https://stream.mino.ai/session/abc123xyz"
+}
+```
+
+This URL can be embedded in an iframe to show **live browser automation** in real-time.
+
+#### Event 2: Progress Updates (During Execution)
+
+```json
+data: {
+  "type": "PROGRESS",
+  "step": "Entering search query...",
+  "screenshot": "base64_encoded_screenshot_data"
+}
+```
+
+```json
+data: {
+  "type": "PROGRESS", 
+  "step": "Analyzing search results...",
+  "screenshot": "base64_encoded_screenshot_data"
+}
+```
+
+#### Event 3: Completion (Final Result)
+
+```json
+data: {
+  "type": "COMPLETE",
+  "resultJson": {
+    "found": true,
+    "manga_title": "One Piece",
+    "site_url": "https://mangadex.org/title/a1c7c817-4e59-43b7-9365-09675a149a6f/one-piece",
+    "match_confidence": "high",
+    "notes": "Found 'One Piece' by Eiichiro Oda with 1100+ chapters available"
+  },
+  "duration": 12453
+}
+```
+
+### Processed Client Events
+
+The edge function transforms Mino events into simplified client events:
+
+```json
+// Live preview available
+data: {"type": "stream", "streamingUrl": "https://stream.mino.ai/session/abc123xyz"}
+
+// Search complete - manga found
+data: {"type": "complete", "found": true}
+
+// Search complete - manga not found
+data: {"type": "complete", "found": false}
+
+// Error occurred
+data: {"type": "error", "error": "Search failed"}
+```
+
+---
+
+## Error Handling
+
+### Rate Limiting (Gemini API)
+
+When Gemini API returns `429 Too Many Requests`, the system falls back to predefined sites:
+
+```typescript
+const defaultSites = [
+  { name: "MangaDex", url: `https://mangadex.org/search?q=${encodedTitle}` },
+  { name: "MangaKakalot", url: `https://mangakakalot.com/search/story/${encodedTitle}` },
+  { name: "MangaReader", url: `https://mangareader.to/search?keyword=${encodedTitle}` },
+  { name: "Webtoon", url: `https://www.webtoons.com/en/search?keyword=${encodedTitle}` },
+  { name: "Manganato", url: `https://manganato.com/search/story/${encodedTitle}` },
+  { name: "Tapas", url: `https://tapas.io/search?q=${encodedTitle}` },
+];
+```
+
+### Mino API Errors
+
+```typescript
+if (data.type === "ERROR") {
+  const event = `data: ${JSON.stringify({ 
+    type: "error", 
+    error: data.message || "Search failed" 
+  })}\n\n`;
+  controller.enqueue(encoder.encode(event));
+}
+```
+
+---
+
+## Environment Variables
+
+| Variable | Purpose | Where Used |
+|----------|---------|------------|
+| `MINO_API_KEY` | Authenticate with Mino API | `search-manga` edge function |
+| `GEMINI_API_KEY` | Authenticate with Gemini API | `discover-manga-sites` edge function |
+
+---
+
+## Quick Start
+
+1. **Set up secrets** in your Supabase/Lovable Cloud project:
+   - `MINO_API_KEY` - Get from [mino.ai](https://mino.ai)
+   - `GEMINI_API_KEY` - Get from [Google AI Studio](https://makersuite.google.com)
+
+2. **Deploy edge functions** (automatic in Lovable)
+
+3. **Test the flow**:
+   ```typescript
+   import { useMangaSearch } from "@/hooks/useMangaSearch";
+   
+   const { search, agents, isSearching } = useMangaSearch();
+   
+   // Trigger search
+   search("One Piece");
+   
+   // agents array updates in real-time with status and streamingUrl
+   ```
+
+---
+
+## Architecture Diagram (Mermaid)
+
+```mermaid
+sequenceDiagram
+    participant User
+    participant Client as React Client
+    participant Discover as discover-manga-sites
+    participant Search as search-manga (x6)
+    participant Gemini as Gemini API
+    participant Mino as Mino API
+
+    User->>Client: Enter "One Piece"
+    Client->>Discover: POST /discover-manga-sites
+    Discover->>Gemini: Generate site URLs
+    Gemini-->>Discover: [MangaDex, MangaKakalot, ...]
+    Discover-->>Client: { sites: [...] }
+    
+    par Parallel searches
+        Client->>Search: POST /search-manga (MangaDex)
+        Search->>Mino: run-sse (MangaDex URL)
+        Mino-->>Search: SSE: streamingUrl
+        Search-->>Client: SSE: {type: "stream", streamingUrl}
+        Mino-->>Search: SSE: COMPLETE
+        Search-->>Client: SSE: {type: "complete", found: true}
+    and
+        Client->>Search: POST /search-manga (MangaKakalot)
+        Search->>Mino: run-sse (MangaKakalot URL)
+        Mino-->>Search: SSE: streamingUrl
+        Search-->>Client: SSE: {type: "stream", streamingUrl}
+        Mino-->>Search: SSE: COMPLETE
+        Search-->>Client: SSE: {type: "complete", found: false}
+    end
+    
+    Client->>User: Display results with live previews
+```
diff --git a/Manga-Availability-Finder/package.json b/Manga-Availability-Finder/package.json
new file mode 100644
index 0000000..b062cac
--- /dev/null
+++ b/Manga-Availability-Finder/package.json
@@ -0,0 +1,90 @@
+{
+  "name": "vite_react_shadcn_ts",
+  "private": true,
+  "version": "0.0.0",
+  "type": "module",
+  "scripts": {
+    "dev": "vite",
+    "build": "vite build",
+    "build:dev": "vite build --mode development",
+    "lint": "eslint .",
+    "preview": "vite preview",
+    "test": "vitest run",
+    "test:watch": "vitest"
+  },
+  "dependencies": {
+    "@hookform/resolvers": "^3.10.0",
+    "@radix-ui/react-accordion": "^1.2.11",
+    "@radix-ui/react-alert-dialog": "^1.1.14",
+    "@radix-ui/react-aspect-ratio": "^1.1.7",
+    "@radix-ui/react-avatar": "^1.1.10",
+    "@radix-ui/react-checkbox": "^1.3.2",
+    "@radix-ui/react-collapsible": "^1.1.11",
+    "@radix-ui/react-context-menu": "^2.2.15",
+    "@radix-ui/react-dialog": "^1.1.14",
+    "@radix-ui/react-dropdown-menu": "^2.1.15",
+    "@radix-ui/react-hover-card": "^1.1.14",
+    "@radix-ui/react-label": "^2.1.7",
+    "@radix-ui/react-menubar": "^1.1.15",
+    "@radix-ui/react-navigation-menu": "^1.2.13",
+    "@radix-ui/react-popover": "^1.1.14",
+    "@radix-ui/react-progress": "^1.1.7",
+    "@radix-ui/react-radio-group": "^1.3.7",
+    "@radix-ui/react-scroll-area": "^1.2.9",
+    "@radix-ui/react-select": "^2.2.5",
+    "@radix-ui/react-separator": "^1.1.7",
+    "@radix-ui/react-slider": "^1.3.5",
+    "@radix-ui/react-slot": "^1.2.3",
+    "@radix-ui/react-switch": "^1.2.5",
+    "@radix-ui/react-tabs": "^1.1.12",
+    "@radix-ui/react-toast": "^1.2.14",
+    "@radix-ui/react-toggle": "^1.1.9",
+    "@radix-ui/react-toggle-group": "^1.1.10",
+    "@radix-ui/react-tooltip": "^1.2.7",
+    "@supabase/supabase-js": "^2.91.0",
+    "@tanstack/react-query": "^5.83.0",
+    "class-variance-authority": "^0.7.1",
+    "clsx": "^2.1.1",
+    "cmdk": "^1.1.1",
+    "date-fns": "^3.6.0",
+    "embla-carousel-react": "^8.6.0",
+    "input-otp": "^1.4.2",
+    "lucide-react": "^0.462.0",
+    "next-themes": "^0.3.0",
+    "react": "^18.3.1",
+    "react-day-picker": "^8.10.1",
+    "react-dom": "^18.3.1",
+    "react-hook-form": "^7.61.1",
+    "react-resizable-panels": "^2.1.9",
+    "react-router-dom": "^6.30.1",
+    "recharts": "^2.15.4",
+    "sonner": "^1.7.4",
+    "tailwind-merge": "^2.6.0",
+    "tailwindcss-animate": "^1.0.7",
+    "vaul": "^0.9.9",
+    "zod": "^3.25.76"
+  },
+  "devDependencies": {
+    "@eslint/js": "^9.32.0",
+    "@tailwindcss/typography": "^0.5.16",
+    "@testing-library/jest-dom": "^6.6.0",
+    "@testing-library/react": "^16.0.0",
+    "@types/node": "^22.16.5",
+    "@types/react": "^18.3.23",
+    "@types/react-dom": "^18.3.7",
+    "@vitejs/plugin-react-swc": "^3.11.0",
+    "autoprefixer": "^10.4.21",
+    "eslint": "^9.32.0",
+    "eslint-plugin-react-hooks": "^5.2.0",
+    "eslint-plugin-react-refresh": "^0.4.20",
+    "globals": "^15.15.0",
+    "jsdom": "^20.0.3",
+    "lovable-tagger": "^1.1.13",
+    "postcss": "^8.5.6",
+    "tailwindcss": "^3.4.17",
+    "typescript": "^5.8.3",
+    "typescript-eslint": "^8.38.0",
+    "vite": "^5.4.19",
+    "vitest": "^3.2.4"
+  }
+}
diff --git a/Manga-Availability-Finder/public/favicon.ico b/Manga-Availability-Finder/public/favicon.ico
new file mode 100644
index 0000000..3c01d69
Binary files /dev/null and b/Manga-Availability-Finder/public/favicon.ico differ
diff --git a/Manga-Availability-Finder/public/placeholder.svg b/Manga-Availability-Finder/public/placeholder.svg
new file mode 100644
index 0000000..e763910
--- /dev/null
+++ b/Manga-Availability-Finder/public/placeholder.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="1200" height="1200" fill="none"><rect width="1200" height="1200" fill="#EAEAEA" rx="3"/><g opacity=".5"><g opacity=".5"><path fill="#FAFAFA" d="M600.709 736.5c-75.454 0-136.621-61.167-136.621-136.62 0-75.454 61.167-136.621 136.621-136.621 75.453 0 136.62 61.167 136.62 136.621 0 75.453-61.167 136.62-136.62 136.62Z"/><path stroke="#C9C9C9" stroke-width="2.418" d="M600.709 736.5c-75.454 0-136.621-61.167-136.621-136.62 0-75.454 61.167-136.621 136.621-136.621 75.453 0 136.62 61.167 136.62 136.621 0 75.453-61.167 136.62-136.62 136.62Z"/></g><path stroke="url(#a)" stroke-width="2.418" d="M0-1.209h553.581" transform="scale(1 -1) rotate(45 1163.11 91.165)"/><path stroke="url(#b)" stroke-width="2.418" d="M404.846 598.671h391.726"/><path stroke="url(#c)" stroke-width="2.418" d="M599.5 795.742V404.017"/><path stroke="url(#d)" stroke-width="2.418" d="m795.717 796.597-391.441-391.44"/><path fill="#fff" d="M600.709 656.704c-31.384 0-56.825-25.441-56.825-56.824 0-31.384 25.441-56.825 56.825-56.825 31.383 0 56.824 25.441 56.824 56.825 0 31.383-25.441 56.824-56.824 56.824Z"/><g clip-path="url(#e)"><path fill="#666" fill-rule="evenodd" d="M616.426 586.58h-31.434v16.176l3.553-3.554.531-.531h9.068l.074-.074 8.463-8.463h2.565l7.18 7.181V586.58Zm-15.715 14.654 3.698 3.699 1.283 1.282-2.565 2.565-1.282-1.283-5.2-5.199h-6.066l-5.514 5.514-.073.073v2.876a2.418 2.418 0 0 0 2.418 2.418h26.598a2.418 2.418 0 0 0 2.418-2.418v-8.317l-8.463-8.463-7.181 7.181-.071.072Zm-19.347 5.442v4.085a6.045 6.045 0 0 0 6.046 6.045h26.598a6.044 6.044 0 0 0 6.045-6.045v-7.108l1.356-1.355-1.282-1.283-.074-.073v-17.989h-38.689v23.43l-.146.146.146.147Z" clip-rule="evenodd"/></g><path stroke="#C9C9C9" stroke-width="2.418" d="M600.709 656.704c-31.384 0-56.825-25.441-56.825-56.824 0-31.384 25.441-56.825 56.825-56.825 31.383 0 56.824 25.441 56.824 56.825 0 31.383-25.441 56.824-56.824 56.824Z"/></g><defs><linearGradient id="a" x1="554.061" x2="-.48" y1=".083" y2=".087" gradientUnits="userSpaceOnUse"><stop stop-color="#C9C9C9" stop-opacity="0"/><stop offset=".208" stop-color="#C9C9C9"/><stop offset=".792" stop-color="#C9C9C9"/><stop offset="1" stop-color="#C9C9C9" stop-opacity="0"/></linearGradient><linearGradient id="b" x1="796.912" x2="404.507" y1="599.963" y2="599.965" gradientUnits="userSpaceOnUse"><stop stop-color="#C9C9C9" stop-opacity="0"/><stop offset=".208" stop-color="#C9C9C9"/><stop offset=".792" stop-color="#C9C9C9"/><stop offset="1" stop-color="#C9C9C9" stop-opacity="0"/></linearGradient><linearGradient id="c" x1="600.792" x2="600.794" y1="403.677" y2="796.082" gradientUnits="userSpaceOnUse"><stop stop-color="#C9C9C9" stop-opacity="0"/><stop offset=".208" stop-color="#C9C9C9"/><stop offset=".792" stop-color="#C9C9C9"/><stop offset="1" stop-color="#C9C9C9" stop-opacity="0"/></linearGradient><linearGradient id="d" x1="404.85" x2="796.972" y1="403.903" y2="796.02" gradientUnits="userSpaceOnUse"><stop stop-color="#C9C9C9" stop-opacity="0"/><stop offset=".208" stop-color="#C9C9C9"/><stop offset=".792" stop-color="#C9C9C9"/><stop offset="1" stop-color="#C9C9C9" stop-opacity="0"/></linearGradient><clipPath id="e"><path fill="#fff" d="M581.364 580.535h38.689v38.689h-38.689z"/></clipPath></defs></svg>
\ No newline at end of file
diff --git a/Manga-Availability-Finder/public/robots.txt b/Manga-Availability-Finder/public/robots.txt
new file mode 100644
index 0000000..6018e70
--- /dev/null
+++ b/Manga-Availability-Finder/public/robots.txt
@@ -0,0 +1,14 @@
+User-agent: Googlebot
+Allow: /
+
+User-agent: Bingbot
+Allow: /
+
+User-agent: Twitterbot
+Allow: /
+
+User-agent: facebookexternalhit
+Allow: /
+
+User-agent: *
+Allow: /
diff --git a/Manga-Availability-Finder/src/App.tsx b/Manga-Availability-Finder/src/App.tsx
new file mode 100644
index 0000000..18daf2e
--- /dev/null
+++ b/Manga-Availability-Finder/src/App.tsx
@@ -0,0 +1,27 @@
+import { Toaster } from "@/components/ui/toaster";
+import { Toaster as Sonner } from "@/components/ui/sonner";
+import { TooltipProvider } from "@/components/ui/tooltip";
+import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
+import { BrowserRouter, Routes, Route } from "react-router-dom";
+import Index from "./pages/Index";
+import NotFound from "./pages/NotFound";
+
+const queryClient = new QueryClient();
+
+const App = () => (
+  <QueryClientProvider client={queryClient}>
+    <TooltipProvider>
+      <Toaster />
+      <Sonner />
+      <BrowserRouter>
+        <Routes>
+          <Route path="/" element={<Index />} />
+          {/* ADD ALL CUSTOM ROUTES ABOVE THE CATCH-ALL "*" ROUTE */}
+          <Route path="*" element={<NotFound />} />
+        </Routes>
+      </BrowserRouter>
+    </TooltipProvider>
+  </QueryClientProvider>
+);
+
+export default App;
diff --git a/Manga-Availability-Finder/src/components/AgentCard.tsx b/Manga-Availability-Finder/src/components/AgentCard.tsx
new file mode 100644
index 0000000..995611e
--- /dev/null
+++ b/Manga-Availability-Finder/src/components/AgentCard.tsx
@@ -0,0 +1,160 @@
+import { ExternalLink, CheckCircle2, XCircle, Loader2, Globe, Eye } from "lucide-react";
+import { cn } from "@/lib/utils";
+
+export type AgentStatus = "idle" | "searching" | "found" | "not_found" | "error";
+
+interface AgentCardProps {
+  siteName: string;
+  siteUrl: string;
+  status: AgentStatus;
+  statusMessage?: string;
+  streamingUrl?: string;
+  mangaTitle: string;
+}
+
+const statusConfig: Record<AgentStatus, { icon: React.ReactNode; label: string; className: string }> = {
+  idle: {
+    icon: <Globe className="w-4 h-4" />,
+    label: "Ready",
+    className: "text-muted-foreground bg-muted/50",
+  },
+  searching: {
+    icon: <Loader2 className="w-4 h-4 animate-spin" />,
+    label: "Searching...",
+    className: "status-searching",
+  },
+  found: {
+    icon: <CheckCircle2 className="w-4 h-4" />,
+    label: "Found",
+    className: "status-found",
+  },
+  not_found: {
+    icon: <XCircle className="w-4 h-4" />,
+    label: "Not Found",
+    className: "status-not-found",
+  },
+  error: {
+    icon: <XCircle className="w-4 h-4" />,
+    label: "Error",
+    className: "status-not-found",
+  },
+};
+
+export function AgentCard({
+  siteName,
+  siteUrl,
+  status,
+  statusMessage,
+  streamingUrl,
+  mangaTitle,
+}: AgentCardProps) {
+  const config = statusConfig[status];
+
+  return (
+    <div
+      className={cn(
+        "group relative overflow-hidden rounded-xl bg-card border border-border transition-all duration-300 hover-lift",
+        status === "searching" && "animate-pulse-border border-secondary/50",
+        status === "found" && "border-success/50",
+        status === "not_found" && "border-destructive/30"
+      )}
+    >
+      {/* Scanning effect for searching state */}
+      {status === "searching" && (
+        <div className="absolute inset-0 overflow-hidden pointer-events-none">
+          <div className="absolute inset-0 bg-gradient-to-b from-transparent via-secondary/5 to-transparent animate-[scanLine_2s_linear_infinite]" />
+        </div>
+      )}
+
+      {/* Header */}
+      <div className="p-4 border-b border-border/50">
+        <div className="flex items-center justify-between gap-3">
+          <div className="flex items-center gap-3 min-w-0">
+            <div className="w-10 h-10 rounded-lg bg-muted flex items-center justify-center shrink-0">
+              <Globe className="w-5 h-5 text-muted-foreground" />
+            </div>
+            <div className="min-w-0">
+              <h3 className="font-display font-semibold text-foreground truncate">
+                {siteName}
+              </h3>
+              <p className="text-xs text-muted-foreground truncate">{new URL(siteUrl).hostname}</p>
+            </div>
+          </div>
+          
+          <div className={cn("flex items-center gap-1.5 px-2.5 py-1 rounded-full text-xs font-medium shrink-0", config.className)}>
+            {config.icon}
+            <span>{config.label}</span>
+          </div>
+        </div>
+      </div>
+
+      {/* Browser preview area */}
+      <div className="relative aspect-video bg-muted/30">
+        {streamingUrl && status === "searching" ? (
+          <iframe
+            src={streamingUrl}
+            className="w-full h-full border-0"
+            title={`${siteName} browser view`}
+            sandbox="allow-same-origin"
+          />
+        ) : (
+          <div className="absolute inset-0 flex flex-col items-center justify-center gap-2 text-muted-foreground">
+            {status === "idle" && (
+              <>
+                <Eye className="w-8 h-8 opacity-50" />
+                <span className="text-sm">Waiting to start...</span>
+              </>
+            )}
+            {status === "searching" && !streamingUrl && (
+              <>
+                <Loader2 className="w-8 h-8 animate-spin text-secondary" />
+                <span className="text-sm text-secondary">Connecting agent...</span>
+              </>
+            )}
+            {status === "found" && (
+              <div className="text-center p-4">
+                <CheckCircle2 className="w-12 h-12 text-success mx-auto mb-2" />
+                <p className="font-display font-semibold text-success">Found!</p>
+                <p className="text-sm mt-1">"{mangaTitle}" is available</p>
+              </div>
+            )}
+            {status === "not_found" && (
+              <div className="text-center p-4">
+                <XCircle className="w-12 h-12 text-destructive/70 mx-auto mb-2" />
+                <p className="font-display font-semibold text-destructive/70">Not Found</p>
+                <p className="text-sm mt-1">Not available on this site</p>
+              </div>
+            )}
+            {status === "error" && (
+              <div className="text-center p-4">
+                <XCircle className="w-12 h-12 text-destructive/70 mx-auto mb-2" />
+                <p className="font-display font-semibold text-destructive/70">Error</p>
+                <p className="text-sm mt-1">Failed to search</p>
+              </div>
+            )}
+          </div>
+        )}
+      </div>
+
+      {/* Status message */}
+      {statusMessage && (
+        <div className="px-4 py-2 border-t border-border/50 bg-muted/20">
+          <p className="text-xs text-muted-foreground truncate">{statusMessage}</p>
+        </div>
+      )}
+
+      {/* Footer with link */}
+      <div className="p-3 border-t border-border/50">
+        <a
+          href={siteUrl}
+          target="_blank"
+          rel="noopener noreferrer"
+          className="flex items-center justify-center gap-2 text-sm text-muted-foreground hover:text-primary transition-colors"
+        >
+          <span>Visit Site</span>
+          <ExternalLink className="w-4 h-4" />
+        </a>
+      </div>
+    </div>
+  );
+}
diff --git a/Manga-Availability-Finder/src/components/NavLink.tsx b/Manga-Availability-Finder/src/components/NavLink.tsx
new file mode 100644
index 0000000..a561a95
--- /dev/null
+++ b/Manga-Availability-Finder/src/components/NavLink.tsx
@@ -0,0 +1,28 @@
+import { NavLink as RouterNavLink, NavLinkProps } from "react-router-dom";
+import { forwardRef } from "react";
+import { cn } from "@/lib/utils";
+
+interface NavLinkCompatProps extends Omit<NavLinkProps, "className"> {
+  className?: string;
+  activeClassName?: string;
+  pendingClassName?: string;
+}
+
+const NavLink = forwardRef<HTMLAnchorElement, NavLinkCompatProps>(
+  ({ className, activeClassName, pendingClassName, to, ...props }, ref) => {
+    return (
+      <RouterNavLink
+        ref={ref}
+        to={to}
+        className={({ isActive, isPending }) =>
+          cn(className, isActive && activeClassName, isPending && pendingClassName)
+        }
+        {...props}
+      />
+    );
+  },
+);
+
+NavLink.displayName = "NavLink";
+
+export { NavLink };
diff --git a/Manga-Availability-Finder/src/components/ResultsSummary.tsx b/Manga-Availability-Finder/src/components/ResultsSummary.tsx
new file mode 100644
index 0000000..ad6c516
--- /dev/null
+++ b/Manga-Availability-Finder/src/components/ResultsSummary.tsx
@@ -0,0 +1,125 @@
+import { CheckCircle2, XCircle, Loader2, BookOpen } from "lucide-react";
+import { AgentStatus } from "./AgentCard";
+
+interface SearchResult {
+  siteName: string;
+  siteUrl: string;
+  status: AgentStatus;
+}
+
+interface ResultsSummaryProps {
+  mangaTitle: string;
+  results: SearchResult[];
+  isSearching: boolean;
+}
+
+export function ResultsSummary({ mangaTitle, results, isSearching }: ResultsSummaryProps) {
+  const foundCount = results.filter((r) => r.status === "found").length;
+  const searchingCount = results.filter((r) => r.status === "searching").length;
+  const completedCount = results.filter((r) => r.status === "found" || r.status === "not_found" || r.status === "error").length;
+
+  if (results.length === 0) return null;
+
+  return (
+    <div className="bg-card/50 border border-border rounded-xl p-6 backdrop-blur-sm">
+      {/* Header */}
+      <div className="flex items-center gap-3 mb-6">
+        <div className="w-12 h-12 rounded-xl bg-gradient-neon flex items-center justify-center">
+          <BookOpen className="w-6 h-6 text-primary-foreground" />
+        </div>
+        <div>
+          <h2 className="font-display text-xl font-bold text-foreground">
+            Results for "{mangaTitle}"
+          </h2>
+          <p className="text-sm text-muted-foreground">
+            {isSearching ? (
+              <>Searching {searchingCount} site{searchingCount !== 1 ? "s" : ""}...</>
+            ) : (
+              <>Searched {results.length} site{results.length !== 1 ? "s" : ""}</>
+            )}
+          </p>
+        </div>
+      </div>
+
+      {/* Progress bar */}
+      <div className="mb-6">
+        <div className="flex items-center justify-between text-sm mb-2">
+          <span className="text-muted-foreground">Progress</span>
+          <span className="font-medium text-foreground">{completedCount} / {results.length}</span>
+        </div>
+        <div className="h-2 bg-muted rounded-full overflow-hidden">
+          <div
+            className="h-full bg-gradient-neon transition-all duration-500 ease-out"
+            style={{ width: `${(completedCount / results.length) * 100}%` }}
+          />
+        </div>
+      </div>
+
+      {/* Stats */}
+      <div className="grid grid-cols-3 gap-4 mb-6">
+        <div className="text-center p-3 rounded-lg bg-success/10 border border-success/20">
+          <div className="flex items-center justify-center gap-1 text-success mb-1">
+            <CheckCircle2 className="w-4 h-4" />
+            <span className="font-display font-bold text-xl">{foundCount}</span>
+          </div>
+          <p className="text-xs text-muted-foreground">Found</p>
+        </div>
+        <div className="text-center p-3 rounded-lg bg-secondary/10 border border-secondary/20">
+          <div className="flex items-center justify-center gap-1 text-secondary mb-1">
+            <Loader2 className={`w-4 h-4 ${searchingCount > 0 ? "animate-spin" : ""}`} />
+            <span className="font-display font-bold text-xl">{searchingCount}</span>
+          </div>
+          <p className="text-xs text-muted-foreground">Searching</p>
+        </div>
+        <div className="text-center p-3 rounded-lg bg-muted/50 border border-border">
+          <div className="flex items-center justify-center gap-1 text-muted-foreground mb-1">
+            <XCircle className="w-4 h-4" />
+            <span className="font-display font-bold text-xl">
+              {results.filter((r) => r.status === "not_found").length}
+            </span>
+          </div>
+          <p className="text-xs text-muted-foreground">Not Found</p>
+        </div>
+      </div>
+
+      {/* Results list */}
+      <div className="space-y-2 max-h-64 overflow-y-auto scrollbar-cyber">
+        {results.map((result) => (
+          <div
+            key={result.siteUrl}
+            className="flex items-center justify-between p-3 rounded-lg bg-muted/30 border border-border/50"
+          >
+            <div className="flex items-center gap-3 min-w-0">
+              {result.status === "found" && (
+                <CheckCircle2 className="w-5 h-5 text-success shrink-0" />
+              )}
+              {result.status === "not_found" && (
+                <XCircle className="w-5 h-5 text-muted-foreground shrink-0" />
+              )}
+              {result.status === "searching" && (
+                <Loader2 className="w-5 h-5 text-secondary animate-spin shrink-0" />
+              )}
+              {result.status === "error" && (
+                <XCircle className="w-5 h-5 text-destructive shrink-0" />
+              )}
+              {result.status === "idle" && (
+                <div className="w-5 h-5 rounded-full border-2 border-muted-foreground shrink-0" />
+              )}
+              <span className="text-sm font-medium truncate">{result.siteName}</span>
+            </div>
+            {result.status === "found" && (
+              <a
+                href={result.siteUrl}
+                target="_blank"
+                rel="noopener noreferrer"
+                className="text-xs text-primary hover:underline shrink-0"
+              >
+                Read Now →
+              </a>
+            )}
+          </div>
+        ))}
+      </div>
+    </div>
+  );
+}
diff --git a/Manga-Availability-Finder/src/components/SearchHero.tsx b/Manga-Availability-Finder/src/components/SearchHero.tsx
new file mode 100644
index 0000000..7ad88ce
--- /dev/null
+++ b/Manga-Availability-Finder/src/components/SearchHero.tsx
@@ -0,0 +1,109 @@
+import { useState } from "react";
+import { Search, Sparkles } from "lucide-react";
+import { Button } from "@/components/ui/button";
+import { Input } from "@/components/ui/input";
+
+interface SearchHeroProps {
+  onSearch: (query: string) => void;
+  isSearching: boolean;
+}
+
+export function SearchHero({ onSearch, isSearching }: SearchHeroProps) {
+  const [query, setQuery] = useState("");
+
+  const handleSubmit = (e: React.FormEvent) => {
+    e.preventDefault();
+    if (query.trim()) {
+      onSearch(query.trim());
+    }
+  };
+
+  return (
+    <div className="relative min-h-[50vh] flex flex-col items-center justify-center px-4 py-16">
+      {/* Background glow effects */}
+      <div className="absolute inset-0 overflow-hidden pointer-events-none">
+        <div className="absolute top-1/4 left-1/4 w-96 h-96 bg-primary/10 rounded-full blur-[120px]" />
+        <div className="absolute bottom-1/4 right-1/4 w-80 h-80 bg-secondary/10 rounded-full blur-[100px]" />
+        <div className="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 w-[600px] h-[600px] bg-accent/5 rounded-full blur-[150px]" />
+      </div>
+
+      {/* Content */}
+      <div className="relative z-10 max-w-3xl w-full text-center space-y-8">
+        {/* Title */}
+        <div className="space-y-4">
+          <div className="inline-flex items-center gap-2 px-4 py-2 rounded-full bg-muted/50 border border-border text-sm text-muted-foreground backdrop-blur-sm">
+            <Sparkles className="w-4 h-4 text-primary" />
+            <span>AI-Powered Manga Discovery</span>
+          </div>
+          
+          <h1 className="font-display text-4xl md:text-6xl lg:text-7xl font-bold tracking-tight">
+            <span className="text-foreground">Manga</span>
+            <span className="gradient-text">Finder</span>
+          </h1>
+          
+          <p className="text-lg md:text-xl text-muted-foreground max-w-xl mx-auto">
+            Search across multiple manga & webtoon sites simultaneously using AI-powered web agents
+          </p>
+        </div>
+
+        {/* Search Form */}
+        <form onSubmit={handleSubmit} className="relative">
+          <div className="flex flex-col sm:flex-row gap-3 max-w-2xl mx-auto">
+            <div className="relative flex-1">
+              <Search className="absolute left-4 top-1/2 -translate-y-1/2 w-5 h-5 text-muted-foreground" />
+              <Input
+                type="text"
+                placeholder="Enter manga or webtoon title..."
+                value={query}
+                onChange={(e) => setQuery(e.target.value)}
+                className="pl-12 h-14 text-lg bg-card/50 border-border/50 backdrop-blur-sm focus:bg-card"
+                disabled={isSearching}
+              />
+            </div>
+            <Button
+              type="submit"
+              variant="cyber"
+              size="xl"
+              disabled={isSearching || !query.trim()}
+              className="min-w-[140px]"
+            >
+              {isSearching ? (
+                <>
+                  <span className="animate-pulse">Searching</span>
+                  <span className="flex gap-0.5">
+                    <span className="animate-bounce" style={{ animationDelay: "0ms" }}>.</span>
+                    <span className="animate-bounce" style={{ animationDelay: "150ms" }}>.</span>
+                    <span className="animate-bounce" style={{ animationDelay: "300ms" }}>.</span>
+                  </span>
+                </>
+              ) : (
+                <>
+                  <Search className="w-5 h-5" />
+                  Search
+                </>
+              )}
+            </Button>
+          </div>
+        </form>
+
+        {/* Example searches */}
+        <div className="flex flex-wrap justify-center gap-2">
+          <span className="text-sm text-muted-foreground">Try:</span>
+          {["One Piece", "Solo Leveling", "Chainsaw Man", "Tower of God"].map((example) => (
+            <button
+              key={example}
+              onClick={() => {
+                setQuery(example);
+                onSearch(example);
+              }}
+              disabled={isSearching}
+              className="px-3 py-1 text-sm rounded-full bg-muted/50 border border-border hover:border-primary/50 hover:bg-muted transition-all duration-200 disabled:opacity-50"
+            >
+              {example}
+            </button>
+          ))}
+        </div>
+      </div>
+    </div>
+  );
+}
diff --git a/Manga-Availability-Finder/src/components/ui/avatar.tsx b/Manga-Availability-Finder/src/components/ui/avatar.tsx
new file mode 100644
index 0000000..68d21bb
--- /dev/null
+++ b/Manga-Availability-Finder/src/components/ui/avatar.tsx
@@ -0,0 +1,38 @@
+import * as React from "react";
+import * as AvatarPrimitive from "@radix-ui/react-avatar";
+
+import { cn } from "@/lib/utils";
+
+const Avatar = React.forwardRef<
+  React.ElementRef<typeof AvatarPrimitive.Root>,
+  React.ComponentPropsWithoutRef<typeof AvatarPrimitive.Root>
+>(({ className, ...props }, ref) => (
+  <AvatarPrimitive.Root
+    ref={ref}
+    className={cn("relative flex h-10 w-10 shrink-0 overflow-hidden rounded-full", className)}
+    {...props}
+  />
+));
+Avatar.displayName = AvatarPrimitive.Root.displayName;
+
+const AvatarImage = React.forwardRef<
+  React.ElementRef<typeof AvatarPrimitive.Image>,
+  React.ComponentPropsWithoutRef<typeof AvatarPrimitive.Image>
+>(({ className, ...props }, ref) => (
+  <AvatarPrimitive.Image ref={ref} className={cn("aspect-square h-full w-full", className)} {...props} />
+));
+AvatarImage.displayName = AvatarPrimitive.Image.displayName;
+
+const AvatarFallback = React.forwardRef<
+  React.ElementRef<typeof AvatarPrimitive.Fallback>,
+  React.ComponentPropsWithoutRef<typeof AvatarPrimitive.Fallback>
+>(({ className, ...props }, ref) => (
+  <AvatarPrimitive.Fallback
+    ref={ref}
+    className={cn("flex h-full w-full items-center justify-center rounded-full bg-muted", className)}
+    {...props}
+  />
+));
+AvatarFallback.displayName = AvatarPrimitive.Fallback.displayName;
+
+export { Avatar, AvatarImage, AvatarFallback };
diff --git a/Manga-Availability-Finder/src/components/ui/button.tsx b/Manga-Availability-Finder/src/components/ui/button.tsx
new file mode 100644
index 0000000..e0a91da
--- /dev/null
+++ b/Manga-Availability-Finder/src/components/ui/button.tsx
@@ -0,0 +1,51 @@
+import * as React from "react";
+import { Slot } from "@radix-ui/react-slot";
+import { cva, type VariantProps } from "class-variance-authority";
+
+import { cn } from "@/lib/utils";
+
+const buttonVariants = cva(
+  "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-lg text-sm font-medium ring-offset-background transition-all duration-300 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",
+  {
+    variants: {
+      variant: {
+        default: "bg-primary text-primary-foreground hover:bg-primary/90 shadow-lg hover:shadow-primary/30",
+        destructive: "bg-destructive text-destructive-foreground hover:bg-destructive/90",
+        outline: "border border-border bg-transparent hover:bg-muted hover:text-foreground",
+        secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/80",
+        ghost: "hover:bg-muted hover:text-foreground",
+        link: "text-primary underline-offset-4 hover:underline",
+        neon: "relative bg-transparent border-2 border-primary text-primary hover:bg-primary/10 hover:shadow-[0_0_20px_hsl(var(--primary)/0.5)] transition-all duration-300",
+        cyber: "bg-gradient-to-r from-primary via-accent to-secondary text-primary-foreground font-semibold uppercase tracking-wider hover:opacity-90 shadow-[0_0_30px_hsl(var(--primary)/0.4)] hover:shadow-[0_0_40px_hsl(var(--primary)/0.6)]",
+        glow: "bg-card border border-primary/50 text-foreground hover:border-primary hover:shadow-[0_0_20px_hsl(var(--primary)/0.4)]",
+      },
+      size: {
+        default: "h-10 px-4 py-2",
+        sm: "h-9 rounded-md px-3",
+        lg: "h-12 rounded-lg px-8 text-base",
+        xl: "h-14 rounded-xl px-10 text-lg",
+        icon: "h-10 w-10",
+      },
+    },
+    defaultVariants: {
+      variant: "default",
+      size: "default",
+    },
+  },
+);
+
+export interface ButtonProps
+  extends React.ButtonHTMLAttributes<HTMLButtonElement>,
+    VariantProps<typeof buttonVariants> {
+  asChild?: boolean;
+}
+
+const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(
+  ({ className, variant, size, asChild = false, ...props }, ref) => {
+    const Comp = asChild ? Slot : "button";
+    return <Comp className={cn(buttonVariants({ variant, size, className }))} ref={ref} {...props} />;
+  },
+);
+Button.displayName = "Button";
+
+export { Button, buttonVariants };
diff --git a/Manga-Availability-Finder/src/components/ui/card.tsx b/Manga-Availability-Finder/src/components/ui/card.tsx
new file mode 100644
index 0000000..e282748
--- /dev/null
+++ b/Manga-Availability-Finder/src/components/ui/card.tsx
@@ -0,0 +1,43 @@
+import * as React from "react";
+
+import { cn } from "@/lib/utils";
+
+const Card = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(({ className, ...props }, ref) => (
+  <div ref={ref} className={cn("rounded-lg border bg-card text-card-foreground shadow-sm", className)} {...props} />
+));
+Card.displayName = "Card";
+
+const CardHeader = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(
+  ({ className, ...props }, ref) => (
+    <div ref={ref} className={cn("flex flex-col space-y-1.5 p-6", className)} {...props} />
+  ),
+);
+CardHeader.displayName = "CardHeader";
+
+const CardTitle = React.forwardRef<HTMLParagraphElement, React.HTMLAttributes<HTMLHeadingElement>>(
+  ({ className, ...props }, ref) => (
+    <h3 ref={ref} className={cn("text-2xl font-semibold leading-none tracking-tight", className)} {...props} />
+  ),
+);
+CardTitle.displayName = "CardTitle";
+
+const CardDescription = React.forwardRef<HTMLParagraphElement, React.HTMLAttributes<HTMLParagraphElement>>(
+  ({ className, ...props }, ref) => (
+    <p ref={ref} className={cn("text-sm text-muted-foreground", className)} {...props} />
+  ),
+);
+CardDescription.displayName = "CardDescription";
+
+const CardContent = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(
+  ({ className, ...props }, ref) => <div ref={ref} className={cn("p-6 pt-0", className)} {...props} />,
+);
+CardContent.displayName = "CardContent";
+
+const CardFooter = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(
+  ({ className, ...props }, ref) => (
+    <div ref={ref} className={cn("flex items-center p-6 pt-0", className)} {...props} />
+  ),
+);
+CardFooter.displayName = "CardFooter";
+
+export { Card, CardHeader, CardFooter, CardTitle, CardDescription, CardContent };
diff --git a/Manga-Availability-Finder/src/hooks/useMangaSearch.ts b/Manga-Availability-Finder/src/hooks/useMangaSearch.ts
new file mode 100644
index 0000000..cd0fe17
--- /dev/null
+++ b/Manga-Availability-Finder/src/hooks/useMangaSearch.ts
@@ -0,0 +1,199 @@
+import { useState, useCallback } from "react";
+import { supabase } from "@/integrations/supabase/client";
+import { AgentStatus } from "@/components/AgentCard";
+
+export interface SiteAgent {
+  id: string;
+  siteName: string;
+  siteUrl: string;
+  status: AgentStatus;
+  statusMessage?: string;
+  streamingUrl?: string;
+}
+
+export function useMangaSearch() {
+  const [isSearching, setIsSearching] = useState(false);
+  const [agents, setAgents] = useState<SiteAgent[]>([]);
+  const [mangaTitle, setMangaTitle] = useState("");
+
+  const updateAgent = useCallback((id: string, updates: Partial<SiteAgent>) => {
+    setAgents((prev) =>
+      prev.map((agent) => (agent.id === id ? { ...agent, ...updates } : agent))
+    );
+  }, []);
+
+  const searchSite = useCallback(
+    async (agent: SiteAgent, title: string) => {
+      updateAgent(agent.id, {
+        status: "searching",
+        statusMessage: "Connecting to agent...",
+      });
+
+      try {
+        const supabaseUrl = import.meta.env.VITE_SUPABASE_URL;
+        const supabaseKey = import.meta.env.VITE_SUPABASE_PUBLISHABLE_KEY;
+
+        const response = await fetch(
+          `${supabaseUrl}/functions/v1/search-manga`,
+          {
+            method: "POST",
+            headers: {
+              "Content-Type": "application/json",
+              Authorization: `Bearer ${supabaseKey}`,
+              apikey: supabaseKey,
+            },
+            body: JSON.stringify({ url: agent.siteUrl, mangaTitle: title }),
+          }
+        );
+
+        if (!response.ok) {
+          throw new Error(`HTTP error: ${response.status}`);
+        }
+
+        const contentType = response.headers.get("content-type");
+
+        if (contentType?.includes("text/event-stream")) {
+          const reader = response.body?.getReader();
+          if (!reader) throw new Error("No response body");
+
+          const decoder = new TextDecoder();
+
+          let buffer = ""; 
+          let receivedTerminalEvent = false; 
+
+          while (true) {
+            const { done, value } = await reader.read();
+            if (done) break;
+
+            buffer += decoder.decode(value, { stream: true });
+
+            const lines = buffer.split("\n");
+            buffer = lines.pop() ?? "";
+
+            for (const line of lines) {
+              if (!line.startsWith("data: ")) continue;
+
+              try {
+                const data = JSON.parse(line.slice(6));
+
+                if (data.type === "stream" && data.streamingUrl) {
+                  updateAgent(agent.id, {
+                    streamingUrl: data.streamingUrl,
+                    statusMessage: "Agent browsing...",
+                  });
+                }
+
+                if (data.type === "complete") {
+                  receivedTerminalEvent = true; 
+                  updateAgent(agent.id, {
+                    status: data.found ? "found" : "not_found",
+                    statusMessage: data.found
+                      ? "Manga found on this site!"
+                      : "Not available on this site",
+                    streamingUrl: undefined,
+                  });
+                }
+
+                if (data.type === "error") {
+                  receivedTerminalEvent = true; 
+                  updateAgent(agent.id, {
+                    status: "error",
+                    statusMessage: data.error || "Search failed",
+                    streamingUrl: undefined,
+                  });
+                }
+              } catch {
+                // Ignore parse errors (partial JSON handled by buffering)
+              }
+            }
+          }
+
+          if (!receivedTerminalEvent) {
+            updateAgent(agent.id, {
+              status: "error",
+              statusMessage: "Stream ended without completion signal",
+              streamingUrl: undefined,
+            });
+          }
+        } else {
+          const data = await response.json();
+
+          if (data?.found !== undefined) {
+            updateAgent(agent.id, {
+              status: data.found ? "found" : "not_found",
+              statusMessage: data.found
+                ? "Manga found on this site!"
+                : "Not available on this site",
+            });
+          } else if (data?.error) {
+            updateAgent(agent.id, {
+              status: "error",
+              statusMessage: data.error,
+            });
+          }
+        }
+      } catch (error) {
+        console.error(`Error searching ${agent.siteName}:`, error);
+        updateAgent(agent.id, {
+          status: "error",
+          statusMessage:
+            error instanceof Error ? error.message : "Search failed",
+          streamingUrl: undefined,
+        });
+      }
+    },
+    [updateAgent]
+  );
+
+  const search = useCallback(
+    async (title: string) => {
+      setIsSearching(true);
+      setMangaTitle(title);
+      setAgents([]);
+
+      try {
+        const { data: urlsData, error: urlsError } =
+          await supabase.functions.invoke("discover-manga-sites", {
+            body: { mangaTitle: title },
+          });
+
+        if (urlsError) {
+          throw new Error(urlsError.message);
+        }
+
+        const sites: Array<{ name: string; url: string }> =
+          urlsData?.sites || [];
+
+        if (sites.length === 0) {
+          setIsSearching(false);
+          return;
+        }
+
+        const initialAgents: SiteAgent[] = sites.map((site, index) => ({
+          id: `agent-${index}`,
+          siteName: site.name,
+          siteUrl: site.url,
+          status: "idle" as AgentStatus,
+        }));
+
+        setAgents(initialAgents);
+
+        await Promise.all(
+          initialAgents.map((agent) => searchSite(agent, title))
+        );
+      } catch (error) {
+        console.error("Search error:", error);
+      } finally {
+        setIsSearching(false);
+      }
+    },
+    [searchSite]
+  );
+
+  return {
+    isSearching,
+    agents,
+    mangaTitle,
+    search,
+  };
+}
diff --git a/Manga-Availability-Finder/src/integrations/supabase/client.ts b/Manga-Availability-Finder/src/integrations/supabase/client.ts
new file mode 100644
index 0000000..c99452f
--- /dev/null
+++ b/Manga-Availability-Finder/src/integrations/supabase/client.ts
@@ -0,0 +1,17 @@
+// This file is automatically generated. Do not edit it directly.
+import { createClient } from '@supabase/supabase-js';
+import type { Database } from './types';
+
+const SUPABASE_URL = import.meta.env.VITE_SUPABASE_URL;
+const SUPABASE_PUBLISHABLE_KEY = import.meta.env.VITE_SUPABASE_PUBLISHABLE_KEY;
+
+// Import the supabase client like this:
+// import { supabase } from "@/integrations/supabase/client";
+
+export const supabase = createClient<Database>(SUPABASE_URL, SUPABASE_PUBLISHABLE_KEY, {
+  auth: {
+    storage: localStorage,
+    persistSession: true,
+    autoRefreshToken: true,
+  }
+});
diff --git a/Manga-Availability-Finder/src/integrations/supabase/types.ts b/Manga-Availability-Finder/src/integrations/supabase/types.ts
new file mode 100644
index 0000000..54fedf1
--- /dev/null
+++ b/Manga-Availability-Finder/src/integrations/supabase/types.ts
@@ -0,0 +1,155 @@
+export type Json =
+  | string
+  | number
+  | boolean
+  | null
+  | { [key: string]: Json | undefined }
+  | Json[]
+
+export type Database = {
+  // Allows to automatically instantiate createClient with right options
+  // instead of createClient<Database, { PostgrestVersion: 'XX' }>(URL, KEY)
+  __InternalSupabase: {
+    PostgrestVersion: "14.1"
+  }
+  public: {
+    Tables: {
+      [_ in never]: never
+    }
+    Views: {
+      [_ in never]: never
+    }
+    Functions: {
+      [_ in never]: never
+    }
+    Enums: {
+      [_ in never]: never
+    }
+    CompositeTypes: {
+      [_ in never]: never
+    }
+  }
+}
+
+type DatabaseWithoutInternals = Omit<Database, "__InternalSupabase">
+
+type DefaultSchema = DatabaseWithoutInternals[Extract<keyof Database, "public">]
+
+export type Tables<
+  DefaultSchemaTableNameOrOptions extends
+    | keyof (DefaultSchema["Tables"] & DefaultSchema["Views"])
+    | { schema: keyof DatabaseWithoutInternals },
+  TableName extends DefaultSchemaTableNameOrOptions extends {
+    schema: keyof DatabaseWithoutInternals
+  }
+    ? keyof (DatabaseWithoutInternals[DefaultSchemaTableNameOrOptions["schema"]]["Tables"] &
+        DatabaseWithoutInternals[DefaultSchemaTableNameOrOptions["schema"]]["Views"])
+    : never = never,
+> = DefaultSchemaTableNameOrOptions extends {
+  schema: keyof DatabaseWithoutInternals
+}
+  ? (DatabaseWithoutInternals[DefaultSchemaTableNameOrOptions["schema"]]["Tables"] &
+      DatabaseWithoutInternals[DefaultSchemaTableNameOrOptions["schema"]]["Views"])[TableName] extends {
+      Row: infer R
+    }
+    ? R
+    : never
+  : DefaultSchemaTableNameOrOptions extends keyof (DefaultSchema["Tables"] &
+        DefaultSchema["Views"])
+    ? (DefaultSchema["Tables"] &
+        DefaultSchema["Views"])[DefaultSchemaTableNameOrOptions] extends {
+        Row: infer R
+      }
+      ? R
+      : never
+    : never
+
+export type TablesInsert<
+  DefaultSchemaTableNameOrOptions extends
+    | keyof DefaultSchema["Tables"]
+    | { schema: keyof DatabaseWithoutInternals },
+  TableName extends DefaultSchemaTableNameOrOptions extends {
+    schema: keyof DatabaseWithoutInternals
+  }
+    ? keyof DatabaseWithoutInternals[DefaultSchemaTableNameOrOptions["schema"]]["Tables"]
+    : never = never,
+> = DefaultSchemaTableNameOrOptions extends {
+  schema: keyof DatabaseWithoutInternals
+}
+  ? DatabaseWithoutInternals[DefaultSchemaTableNameOrOptions["schema"]]["Tables"][TableName] extends {
+      Insert: infer I
+    }
+    ? I
+    : never
+  : DefaultSchemaTableNameOrOptions extends keyof DefaultSchema["Tables"]
+    ? DefaultSchema["Tables"][DefaultSchemaTableNameOrOptions] extends {
+        Insert: infer I
+      }
+      ? I
+      : never
+    : never
+
+export type TablesUpdate<
+  DefaultSchemaTableNameOrOptions extends
+    | keyof DefaultSchema["Tables"]
+    | { schema: keyof DatabaseWithoutInternals },
+  TableName extends DefaultSchemaTableNameOrOptions extends {
+    schema: keyof DatabaseWithoutInternals
+  }
+    ? keyof DatabaseWithoutInternals[DefaultSchemaTableNameOrOptions["schema"]]["Tables"]
+    : never = never,
+> = DefaultSchemaTableNameOrOptions extends {
+  schema: keyof DatabaseWithoutInternals
+}
+  ? DatabaseWithoutInternals[DefaultSchemaTableNameOrOptions["schema"]]["Tables"][TableName] extends {
+      Update: infer U
+    }
+    ? U
+    : never
+  : DefaultSchemaTableNameOrOptions extends keyof DefaultSchema["Tables"]
+    ? DefaultSchema["Tables"][DefaultSchemaTableNameOrOptions] extends {
+        Update: infer U
+      }
+      ? U
+      : never
+    : never
+
+export type Enums<
+  DefaultSchemaEnumNameOrOptions extends
+    | keyof DefaultSchema["Enums"]
+    | { schema: keyof DatabaseWithoutInternals },
+  EnumName extends DefaultSchemaEnumNameOrOptions extends {
+    schema: keyof DatabaseWithoutInternals
+  }
+    ? keyof DatabaseWithoutInternals[DefaultSchemaEnumNameOrOptions["schema"]]["Enums"]
+    : never = never,
+> = DefaultSchemaEnumNameOrOptions extends {
+  schema: keyof DatabaseWithoutInternals
+}
+  ? DatabaseWithoutInternals[DefaultSchemaEnumNameOrOptions["schema"]]["Enums"][EnumName]
+  : DefaultSchemaEnumNameOrOptions extends keyof DefaultSchema["Enums"]
+    ? DefaultSchema["Enums"][DefaultSchemaEnumNameOrOptions]
+    : never
+
+export type CompositeTypes<
+  PublicCompositeTypeNameOrOptions extends
+    | keyof DefaultSchema["CompositeTypes"]
+    | { schema: keyof DatabaseWithoutInternals },
+  CompositeTypeName extends PublicCompositeTypeNameOrOptions extends {
+    schema: keyof DatabaseWithoutInternals
+  }
+    ? keyof DatabaseWithoutInternals[PublicCompositeTypeNameOrOptions["schema"]]["CompositeTypes"]
+    : never = never,
+> = PublicCompositeTypeNameOrOptions extends {
+  schema: keyof DatabaseWithoutInternals
+}
+  ? DatabaseWithoutInternals[PublicCompositeTypeNameOrOptions["schema"]]["CompositeTypes"][CompositeTypeName]
+  : PublicCompositeTypeNameOrOptions extends keyof DefaultSchema["CompositeTypes"]
+    ? DefaultSchema["CompositeTypes"][PublicCompositeTypeNameOrOptions]
+    : never
+
+export const Constants = {
+  public: {
+    Enums: {},
+  },
+} as const
diff --git a/Manga-Availability-Finder/src/lib/utils.ts b/Manga-Availability-Finder/src/lib/utils.ts
new file mode 100644
index 0000000..a5ef193
--- /dev/null
+++ b/Manga-Availability-Finder/src/lib/utils.ts
@@ -0,0 +1,6 @@
+import { clsx, type ClassValue } from "clsx";
+import { twMerge } from "tailwind-merge";
+
+export function cn(...inputs: ClassValue[]) {
+  return twMerge(clsx(inputs));
+}
diff --git a/Manga-Availability-Finder/src/pages/Index.tsx b/Manga-Availability-Finder/src/pages/Index.tsx
new file mode 100644
index 0000000..2667649
--- /dev/null
+++ b/Manga-Availability-Finder/src/pages/Index.tsx
@@ -0,0 +1,83 @@
+import { SearchHero } from "@/components/SearchHero";
+import { AgentCard } from "@/components/AgentCard";
+import { ResultsSummary } from "@/components/ResultsSummary";
+import { useMangaSearch } from "@/hooks/useMangaSearch";
+
+const Index = () => {
+  const { isSearching, agents, mangaTitle, search } = useMangaSearch();
+
+  return (
+    <div className="min-h-screen bg-background cyber-grid">
+      {/* Hero Section */}
+      <SearchHero onSearch={search} isSearching={isSearching} />
+
+      {/* Results Section */}
+      {agents.length > 0 && (
+        <div className="container mx-auto px-4 pb-16">
+          <div className="grid lg:grid-cols-[1fr_350px] gap-8">
+            {/* Agent Cards Grid */}
+            <div className="space-y-6">
+              <div className="flex items-center justify-between">
+                <h2 className="font-display text-2xl font-bold text-foreground">
+                  Search Agents
+                </h2>
+                <span className="text-sm text-muted-foreground">
+                  {agents.length} site{agents.length !== 1 ? "s" : ""} being searched
+                </span>
+              </div>
+
+              <div className="grid sm:grid-cols-2 xl:grid-cols-3 gap-4">
+                {agents.map((agent, index) => (
+                  <div
+                    key={agent.id}
+                    className="animate-fade-in"
+                    style={{ animationDelay: `${index * 100}ms` }}
+                  >
+                    <AgentCard
+                      siteName={agent.siteName}
+                      siteUrl={agent.siteUrl}
+                      status={agent.status}
+                      statusMessage={agent.statusMessage}
+                      streamingUrl={agent.streamingUrl}
+                      mangaTitle={mangaTitle}
+                    />
+                  </div>
+                ))}
+              </div>
+            </div>
+
+            {/* Results Summary Sidebar */}
+            <div className="lg:sticky lg:top-8 h-fit">
+              <ResultsSummary
+                mangaTitle={mangaTitle}
+                results={agents.map((a) => ({
+                  siteName: a.siteName,
+                  siteUrl: a.siteUrl,
+                  status: a.status,
+                }))}
+                isSearching={isSearching}
+              />
+            </div>
+          </div>
+        </div>
+      )}
+
+      {/* Empty state hint */}
+      {agents.length === 0 && !isSearching && (
+        <div className="container mx-auto px-4 pb-16 text-center">
+          <div className="max-w-md mx-auto p-8 rounded-2xl bg-card/30 border border-border/50 backdrop-blur-sm">
+            <div className="w-16 h-16 mx-auto mb-4 rounded-2xl bg-gradient-neon flex items-center justify-center">
+              <span className="text-3xl">📚</span>
+            </div>
+            <h3 className="font-display text-xl font-semibold mb-2">Ready to Search</h3>
+            <p className="text-muted-foreground">
+              Enter a manga or webtoon title above to search across multiple sites simultaneously
+            </p>
+          </div>
+        </div>
+      )}
+    </div>
+  );
+};
+
+export default Index;
diff --git a/Manga-Availability-Finder/src/pages/NotFound.tsx b/Manga-Availability-Finder/src/pages/NotFound.tsx
new file mode 100644
index 0000000..7bc2234
--- /dev/null
+++ b/Manga-Availability-Finder/src/pages/NotFound.tsx
@@ -0,0 +1,24 @@
+import { useLocation } from "react-router-dom";
+import { useEffect } from "react";
+
+const NotFound = () => {
+  const location = useLocation();
+
+  useEffect(() => {
+    console.error("404 Error: User attempted to access non-existent route:", location.pathname);
+  }, [location.pathname]);
+
+  return (
+    <div className="flex min-h-screen items-center justify-center bg-muted">
+      <div className="text-center">
+        <h1 className="mb-4 text-4xl font-bold">404</h1>
+        <p className="mb-4 text-xl text-muted-foreground">Oops! Page not found</p>
+        <a href="/" className="text-primary underline hover:text-primary/90">
+          Return to Home
+        </a>
+      </div>
+    </div>
+  );
+};
+
+export default NotFound;
diff --git a/Manga-Availability-Finder/supabase/config.toml b/Manga-Availability-Finder/supabase/config.toml
new file mode 100644
index 0000000..1b9048a
--- /dev/null
+++ b/Manga-Availability-Finder/supabase/config.toml
@@ -0,0 +1,7 @@
+project_id = "vodjiazkxpszllbonlck"
+
+[functions.discover-manga-sites]
+verify_jwt = false
+
+[functions.search-manga]
+verify_jwt = false
diff --git a/Manga-Availability-Finder/supabase/functions/discover-manga-sites/index.ts b/Manga-Availability-Finder/supabase/functions/discover-manga-sites/index.ts
new file mode 100644
index 0000000..05c52f9
--- /dev/null
+++ b/Manga-Availability-Finder/supabase/functions/discover-manga-sites/index.ts
@@ -0,0 +1,128 @@
+import { serve } from "https://deno.land/std@0.168.0/http/server.ts";
+
+const corsHeaders = {
+  "Access-Control-Allow-Origin": "*",
+  "Access-Control-Allow-Headers": "authorization, x-client-info, apikey, content-type",
+};
+
+serve(async (req) => {
+  if (req.method === "OPTIONS") {
+    return new Response(null, { headers: corsHeaders });
+  }
+
+  try {
+    const { mangaTitle } = await req.json();
+
+    if (!mangaTitle) {
+      return new Response(
+        JSON.stringify({ error: "mangaTitle is required" }),
+        { status: 400, headers: { ...corsHeaders, "Content-Type": "application/json" } }
+      );
+    }
+
+    const GEMINI_API_KEY = Deno.env.get("GEMINI_API_KEY");
+    if (!GEMINI_API_KEY) {
+      throw new Error("GEMINI_API_KEY is not configured");
+    }
+
+    const prompt = `You are a manga/webtoon site discovery assistant. Given a manga or webtoon title, return a JSON array of 5-6 popular manga/webtoon reading websites where users can potentially find and read this title.
+
+For the manga/webtoon: "${mangaTitle}"
+
+Return ONLY a valid JSON object with this exact structure (no markdown, no code blocks):
+{
+  "sites": [
+    {"name": "Site Name", "url": "https://example.com/search?q=${encodeURIComponent(mangaTitle)}"},
+    ...
+  ]
+}
+
+Include sites like:
+- MangaDex (mangadex.org)
+- MangaKakalot (mangakakalot.com)  
+- MangaReader (mangareader.to)
+- Webtoon (webtoons.com)
+- Tapas (tapas.io)
+- Manganato (manganato.com)
+
+Make sure the URLs include a search query for the manga title where possible. Return exactly 5-6 sites.`;
+
+    const response = await fetch(
+  "https://generativelanguage.googleapis.com/v1beta/models/gemini-2.0-flash:generateContent",
+  {
+    method: "POST",
+    headers: {
+      "Content-Type": "application/json",
+      "x-goog-api-key": GEMINI_API_KEY,
+    },
+    body: JSON.stringify({
+      contents: [{ parts: [{ text: prompt }] }],
+      generationConfig: {
+        temperature: 0.3,
+        maxOutputTokens: 1024,
+      },
+    }),
+  }
+);
+
+
+    // Default sites to use as fallback
+    const defaultSites = [
+      { name: "MangaDex", url: `https://mangadex.org/search?q=${encodeURIComponent(mangaTitle)}` },
+      { name: "MangaKakalot", url: `https://mangakakalot.com/search/story/${encodeURIComponent(mangaTitle.toLowerCase().replace(/\s+/g, '_'))}` },
+      { name: "MangaReader", url: `https://mangareader.to/search?keyword=${encodeURIComponent(mangaTitle)}` },
+      { name: "Webtoon", url: `https://www.webtoons.com/en/search?keyword=${encodeURIComponent(mangaTitle)}` },
+      { name: "Manganato", url: `https://manganato.com/search/story/${encodeURIComponent(mangaTitle.toLowerCase().replace(/\s+/g, '_'))}` },
+      { name: "Tapas", url: `https://tapas.io/search?q=${encodeURIComponent(mangaTitle)}` },
+    ];
+
+    if (!response.ok) {
+      const errorText = await response.text();
+      console.error("Gemini API error:", response.status, errorText);
+      
+      // If rate limited (429) or other errors, use fallback sites instead of failing
+      if (response.status === 429 || response.status >= 500) {
+        console.log("Using fallback sites due to API error");
+        return new Response(
+          JSON.stringify({ sites: defaultSites }),
+          { headers: { ...corsHeaders, "Content-Type": "application/json" } }
+        );
+      }
+      
+      throw new Error(`Gemini API error: ${response.status}`);
+    }
+
+    const data = await response.json();
+    const textContent = data.candidates?.[0]?.content?.parts?.[0]?.text || "";
+
+    // Parse the JSON response
+    let sites: Array<{ name: string; url: string }> = [];
+    try {
+      // Try to extract JSON from the response
+      const jsonMatch = textContent.match(/\{[\s\S]*\}/);
+      if (jsonMatch) {
+        const parsed = JSON.parse(jsonMatch[0]);
+        sites = parsed.sites || [];
+      }
+    } catch (parseError) {
+      console.error("Failed to parse Gemini response:", textContent);
+      sites = defaultSites;
+    }
+    
+    // If no sites found, use defaults
+    if (sites.length === 0) {
+      sites = defaultSites;
+    }
+
+    return new Response(
+      JSON.stringify({ sites }),
+      { headers: { ...corsHeaders, "Content-Type": "application/json" } }
+    );
+  } catch (error) {
+    console.error("Error in discover-manga-sites:", error);
+    return new Response(
+      JSON.stringify({ error: error instanceof Error ? error.message : "Unknown error" }),
+      { status: 500, headers: { ...corsHeaders, "Content-Type": "application/json" } }
+    );
+  }
+});
diff --git a/Manga-Availability-Finder/supabase/functions/search-manga/index.ts b/Manga-Availability-Finder/supabase/functions/search-manga/index.ts
new file mode 100644
index 0000000..90f1487
--- /dev/null
+++ b/Manga-Availability-Finder/supabase/functions/search-manga/index.ts
@@ -0,0 +1,158 @@
+import { serve } from "https://deno.land/std@0.168.0/http/server.ts";
+
+const corsHeaders = {
+  "Access-Control-Allow-Origin": "*",
+  "Access-Control-Allow-Headers": "authorization, x-client-info, apikey, content-type",
+};
+
+serve(async (req) => {
+  if (req.method === "OPTIONS") {
+    return new Response(null, { headers: corsHeaders });
+  }
+
+  try {
+    const { url, mangaTitle } = await req.json();
+
+    if (!url || !mangaTitle) {
+      return new Response(
+        JSON.stringify({ error: "url and mangaTitle are required" }),
+        { status: 400, headers: { ...corsHeaders, "Content-Type": "application/json" } }
+      );
+    }
+
+    const MINO_API_KEY = Deno.env.get("MINO_API_KEY");
+    if (!MINO_API_KEY) {
+      throw new Error("MINO_API_KEY is not configured");
+    }
+
+    const goal = `You are searching for a manga/webtoon called "${mangaTitle}" on this website.
+
+STEP 1 - NAVIGATION:
+If there's a search bar or search input, enter "${mangaTitle}" and submit the search.
+If there's no search bar visible, look for a search icon or link to a search page.
+
+STEP 2 - ANALYZE RESULTS:
+Look at the search results or page content carefully.
+Check if "${mangaTitle}" appears in the results (exact match or very close match).
+
+STEP 3 - RETURN RESULT:
+Return a JSON object:
+{
+  "found": true or false,
+  "manga_title": "${mangaTitle}",
+  "site_url": "current page URL",
+  "match_confidence": "high" or "medium" or "low",
+  "notes": "brief explanation of what you found or didn't find"
+}
+
+IMPORTANT: Only return "found": true if you see a clear match for "${mangaTitle}" in the results.`;
+
+    const response = await fetch("https://mino.ai/v1/automation/run-sse", {
+      method: "POST",
+      headers: {
+        "Content-Type": "application/json",
+        "X-API-Key": MINO_API_KEY,
+      },
+      body: JSON.stringify({
+        url,
+        goal,
+        timeout: 60000,
+      }),
+    });
+
+    if (!response.ok) {
+      const errorText = await response.text();
+      console.error("Mino API error:", response.status, errorText);
+      throw new Error(`Mino API error: ${response.status}`);
+    }
+
+    // Stream SSE events back to client
+    const sseHeaders = {
+      ...corsHeaders,
+      "Content-Type": "text/event-stream",
+      "Cache-Control": "no-cache",
+      "Connection": "keep-alive",
+    };
+
+    const reader = response.body?.getReader();
+    if (!reader) {
+      throw new Error("No response body");
+    }
+
+    const stream = new ReadableStream({
+      async start(controller) {
+        const decoder = new TextDecoder();
+        const encoder = new TextEncoder();
+        let streamingUrlSent = false;
+
+        let buffer = "";
+
+        try {
+          while (true) {
+            const { done, value } = await reader.read();
+            if (done) break;
+
+            buffer += decoder.decode(value, { stream: true }); 
+            const lines = buffer.split("\n");
+            buffer = lines.pop() || "";
+            
+            for (const line of lines) {
+              if (line.startsWith("data: ")) {
+                try {
+                  const data = JSON.parse(line.slice(6));
+
+                  // Send streaming URL immediately when available
+                  if (data.streamingUrl && !streamingUrlSent) {
+                    streamingUrlSent = true;
+                    const event = `data: ${JSON.stringify({ type: "stream", streamingUrl: data.streamingUrl })}\n\n`;
+                    controller.enqueue(encoder.encode(event));
+                  }
+
+                  // Check for completion
+                  if (data.type === "COMPLETE" && data.resultJson) {
+                    let found = false;
+                    try {
+                      const resultData = typeof data.resultJson === 'string' 
+                        ? JSON.parse(data.resultJson) 
+                        : data.resultJson;
+                      found = resultData.found === true;
+                    } catch {
+                      const resultStr = JSON.stringify(data.resultJson).toLowerCase();
+                      found = resultStr.includes('"found": true') || resultStr.includes('"found":true');
+                    }
+                    const event = `data: ${JSON.stringify({ type: "complete", found })}\n\n`;
+                    controller.enqueue(encoder.encode(event));
+                  }
+
+                  // Handle errors
+                  if (data.type === "ERROR") {
+                    const event = `data: ${JSON.stringify({ type: "error", error: data.message || "Search failed" })}\n\n`;
+                    controller.enqueue(encoder.encode(event));
+                  }
+                } catch {
+                  // Ignore parse errors
+                }
+              }
+            }
+          }
+        } catch (error) {
+          const event = `data: ${JSON.stringify({ type: "error", error: "Stream error" })}\n\n`;
+          controller.enqueue(encoder.encode(event));
+        } finally {
+          controller.close();
+        }
+      },
+    });
+
+    return new Response(stream, { headers: sseHeaders });
+  } catch (error) {
+    console.error("Error in search-manga:", error);
+    return new Response(
+      JSON.stringify({ 
+        error: error instanceof Error ? error.message : "Unknown error",
+        found: false 
+      }),
+      { status: 500, headers: { ...corsHeaders, "Content-Type": "application/json" } }
+    );
+  }
+});
diff --git a/Manga-Availability-Finder/tsconfig.json b/Manga-Availability-Finder/tsconfig.json
new file mode 100644
index 0000000..2518773
--- /dev/null
+++ b/Manga-Availability-Finder/tsconfig.json
@@ -0,0 +1,16 @@
+{
+  "files": [],
+  "references": [{ "path": "./tsconfig.app.json" }, { "path": "./tsconfig.node.json" }],
+  "compilerOptions": {
+    "baseUrl": ".",
+    "paths": {
+      "@/*": ["./src/*"]
+    },
+    "noImplicitAny": false,
+    "noUnusedParameters": false,
+    "skipLibCheck": true,
+    "allowJs": true,
+    "noUnusedLocals": false,
+    "strictNullChecks": false
+  }
+}