docs: add ARCHITECTURE.md to help new contributors understand the system

[paruuup]

Problem

New contributors have to read through the entire README to understand how Webify is structured. There is no dedicated contributor-focused architecture document explaining how the Monaco Editor, live preview engine, URL sharing, and Next.js App Router fit together.

Proposed Solution

Create docs/ARCHITECTURE.md with:

• A Mermaid diagram showing the system flow (Editor → State → iframe Preview + URL Sharing)
• Short explanation of each layer
• Key files for new contributors

Acceptance Criteria

• ARCHITECTURE.md created in docs/
• Mermaid diagram included
• Written explanation below diagram
• Contributor focused and concise

Additional Notes

I would love to work on this issue. Could you please assign it to me?

Planned approach:

• Study the existing README and folder structure
• Create a Mermaid diagram covering the Monaco Editor integration, real-time state management, iframe preview engine, base64 URL sharing, and JSZip file bundling
• Write a layer-by-layer breakdown with key files for contributors

[paruuup]

Hey @Debmallya-03! I've raised this issue and I'd love to work on it. Could you please assign it to me?