docs: illustrate Cloudflare architecture and refresh README

[fang2hou]

Purpose and impact

Make the README useful to developers evaluating or self-hosting share. Remove the maintainer's private instance URL, clarify the self-hosted Cloudflare deployment, and add one architecture diagram covering Workers, per-user SQLite Durable Objects, R2, Static Assets, WebSockets, GitHub OAuth, and Discord's SSR and dynamic OG image flow.

Refresh the first screenshot from the application on the latest main with English UI, a highlighted TypeScript snippet, a plain-text note, and a PNG/CSV/JSON collection. Capture only after fonts and animations settle, with a cream rounded background and transparent corners.

Implementation and risks

The editable diagram source and regeneration script use existing IBM Plex Sans/Mono and resvg dependencies. The script checks all 72 label bounds and outlines the fonts for consistent GitHub rendering. Asset documentation explains regeneration. Changes are limited to documentation, media, and its offline build script; application behavior and deployment settings are unchanged.

Validation

• node scripts/build-architecture.mjs: all 72 label bounds pass; outlined SVG renders without font buffers.
• mise run test: quality gate and build pass; 4 favicon tests and 40 Worker integration tests pass.
• Visual review: architecture text stays inside cards, rounded connectors are consistent, and the screenshot has no mode-switch remnants.
• PNG inspection: 2080×2310 RGBA, transparent pixels at all four corners, opaque cream background.
• git diff --check: passes.