Can I vibecode Simvoly?

Build a highly functional, responsive drag-and-drop website and funnel builder similar to Simvoly.
Use a modern tech stack: React (Next.js), TypeScript, and a database like PostgreSQL (or SQLite for local dev), with a styling solution like Tailwind CSS.

Core Features to Implement:
1. Drag-and-Drop Editor & Page Builder:
- Implement a responsive, container-based layout system allowing users to drag and drop elements (text, images, buttons, forms) onto a canvas.
- Provide a sidebar with pre-built blocks/components that can be dragged onto the page.
- Enable live preview for desktop, tablet, and mobile breakpoints to ensure responsive design.

2. Funnel Builder & Flow Management:
- Create a visual funnel builder that lets users define a sequence of pages (e.g., Landing Page -> Checkout -> Upsell -> Thank You).
- Implement A/B testing logic for funnel steps to track conversion rates.
- Add features specific to sales funnels: order bumps on checkout forms, 1-click upsells, and downsells.

Build a comprehensive, lightning-fast website and sales funnel builder inspired by Simvoly. Your goal is to create a powerful React-based (Next.js) application that allows users to construct high-converting pages using a structured, block-based visual editor with built-in A/B testing and funnel visualization.

Core Features & Functionality:
1. **Block-Based Visual Editor**: A drag-and-drop page builder organized by sections (Hero, Features, Testimonials, Pricing) rather than absolute positioning, ensuring fully responsive output.
2. **Funnel Flow Visualizer**: A visual canvas or step-by-step pipeline view showing the progression of a sales funnel (Landing Page -> Checkout -> Upsell -> Thank You), with the ability to easily add or reorder steps.
3. **A/B Testing Interface**: Seamless functionality to duplicate a funnel step to create a 'Variant B', with split traffic controls and conversion tracking visualization.
4. **Global Styling System**: A centralized design hub to set global typography, color palettes, and button styles that instantly cascade across all pages in a funnel.
5. **E-commerce & Form Elements**: Specialized blocks for customizable lead capture forms, pricing tables, and checkout widgets.

Design & Aesthetics:
- The user interface must be incredibly sleek, professional, and confidence-inspiring, designed for marketers and entrepreneurs.
- Utilize a modern, clean design system with plenty of whitespace, distinct visual hierarchy, and a polished dark or light mode toggle.
- Implement smooth, satisfying drag-and-drop animations, highlighting drop zones with elegant glowing borders or subtle color shifts.
- The funnel visualization should use beautifully routed SVG connecting lines and visually distinct cards for each step.
- Typography should be crisp and highly legible (e.g., Inter, Roboto) for dense data views, with polished iconography throughout.

Technical Requirements:
- Component Architecture: Design a highly extensible JSON schema to represent page structures, where each block is a self-contained React component that knows how to render itself both in the editor and on the published site.
- Drag & Drop: Integrate a robust drag-and-drop library (like dnd-kit or react-beautiful-dnd) optimized for vertical list sorting and block insertion.
- State Management: Utilize Zustand or Redux for managing complex global state, including the active funnel, page schemas, and global design tokens.
- Next.js Optimization: Leverage Next.js features like Server Components or Static Site Generation (SSG) to ensure that the "published" output of the funnels scores 99+ on Lighthouse for performance.
- Typescript: Enforce strict typings for the page schema, ensuring stability and preventing invalid block configurations.