Role & Goal:

You are an expert frontend developer and UI/UX designer. Build a high-fidelity, interactive React prototype for a SaaS product called "Rendar". Rendar is an AI-powered monitoring tool that continuously tests landing pages across thousands of virtual devices and uses AI vision models to spot broken layouts, hidden CTAs, and illegible text.

Tech Stack & Libraries:

• React (Functional components, hooks)
• Tailwind CSS (for all styling)
• Lucide React (for icons)
• Recharts (for the dashboard chart)
• Framer Motion (for smooth transitions and scanning animations)
• date-fns (for relative time formatting)

Design System & Aesthetics:

• Theme: Strict Dark Mode. Sleek, technical, and modern.
• Backgrounds: Use bg-zinc-950 for the main app background, bg-zinc-900 for cards/panels, and bg-zinc-900/50 for subtle hover states.
• Typography: Use 'Inter' for standard UI text and 'JetBrains Mono' for issue IDs, code snippets, and DOM selectors.
• Accents: Use Indigo (indigo-500, indigo-400) for primary actions and active states.
• Status Colors: Rose (rose-500) for critical issues/impact, Yellow/Orange for warnings, Emerald (emerald-500) for healthy metrics. Use glowing drop shadows (e.g., shadow-[0_0_15px_rgba(79,70,229,0.3)]) sparingly on primary buttons and status dots to give a "cyber/technical" feel.

Core Layout:

Create a full-screen layout with a fixed left Sidebar (256px wide) and a dynamic Main Content area.

• Sidebar: Include a logo area with a Zap icon, a "Current Domain" selector (showing rendar.io with a pulsing green status dot), navigation links (Dashboard, Active Issues, Device Matrix, Domains, Alert Rules, Settings) with Lucide icons, and a User Profile block at the bottom.

View 1: The Dashboard (Default View)

• Header: Title "Dashboard", subtitle, a "Search Scans" button, and a prominent Indigo "Run Manual Scan" button.