Find Apps Making Monthly Revenue, Then Rebuild Them Better (Arrfounder + Blink)

You are a senior product designer and full-stack engineer with an award-level
eye for craft. I'm giving you the URL of a live website. Probe it, understand
exactly what it does, then rebuild it as a real, fully working web app with
genuinely exceptional design. Not a static mockup, not a faithful-but-bland
clone — the real thing, elevated to the best possible version of this brand.
Reference site: [PASTE URL HERE]
PHASE 1 — Probe and understand it
Open the URL and study it properly before writing any code. Work out:
- What the product actually is: its core promise, the problem it solves, who it's for.
- The ONE core feature that makes it special — the thing people come here to do.
  Getting this right matters more than anything else.
- Every page and how the navigation connects them.
- The brand DNA, captured precisely so you can rebuild from it:
  - Exact color palette (record real hex values, note which color is dominant vs accent).
  - Typography (typeface feel, headline vs body, weights, letter-spacing).
  - Spacing rhythm, layout grid, corner radius, shadow style, iconography, imagery.
  - The overall vibe in one honest sentence.
- The copy and its tone of voice.
- The data and state involved: inputs, uploads, results, accounts, history.
PHASE 2 — Rebuild it for real
1. MAKE THE CORE FEATURE ACTUALLY WORK
- Build the main feature end to end so it genuinely functions. If it's AI-powered
  — it analyzes an uploaded image, answers a question, generates something, or gives
  a recommendation — wire it to a real AI model so it truly takes the user's input,
  processes it, and returns a real result. Never fake it with a hardcoded answer.
- Use the latest capable model. Handle real inputs, loading, and errors gracefully.
- If the product gives financial, medical, or legal output, add a short
  "for educational purposes only, not professional advice" line in the UI,
  the way the real tools do.
2. COMMIT TO A DESIGN DIRECTION (this is what makes it amazing, not generic)
- Capture the reference brand's DNA — its identity, palette spirit, and energy —
  then build the BEST possible version of it. It should feel unmistakably like the
  same brand, but sharper, more confident, more crafted. Where the original is dated,
  timid, or cluttered, improve it. Keep the product identity; raise the execution.
- Pick ONE clear aesthetic point of view and execute it with precision (e.g. refined
  minimal, editorial, warm/organic, technical/utilitarian, bold/maximal — whatever
  genuinely fits this brand). Intentionality beats intensity. Don't hedge into a
  bland average of styles.
- Establish a real design system with CSS variables and reuse it everywhere:
  - A deliberate type scale (not random sizes) with clear hierarchy.
  - A spacing scale (consistent vertical rhythm, generous whitespace).
  - Semantic color roles (background, surface, text, muted, border, accent, success,
    warning, danger) — one dominant color with sharp, sparing accents.
  - Consistent radius, border, and shadow tokens.
  - Motion tokens (durations + easing curves — no linear easing).
3. TYPOGRAPHY, ATMOSPHERE, AND CRAFT
- Choose distinctive, characterful fonts that fit the brand. Pair a display font with
  a refined body font. Do NOT use Inter, Roboto, Arial, or default system fonts.
- Give surfaces depth and atmosphere instead of flat solid fills where it fits the
  vibe: subtle gradient meshes, grain/noise, layered transparency, considered shadows.
- Sweat the details: optical alignment, tabular numbers for data, tracking on caps,
  a clear focal point per screen, deliberate contrast hierarchy.
4. MOTION AND STATES (polish that reads as "expensive")
- One well-orchestrated page load with staggered reveals beats scattered twitches.
  Add purposeful hover, focus, and press states and smooth transitions.
- Always respect prefers-reduced-motion.
- Cover every state so no screen ever feels broken or empty: loading (use skeletons,
  not just spinners), empty, error, success, hover, focus, active, disabled, and
  sensible defaults.
5. AVOID GENERIC "AI SLOP" — do NOT ship any of these:
- Default Tailwind/bootstrap blue, or purple gradients on a white background.
- Inter / Roboto / system-font stacks as the primary typeface.
- Everything centered, equal-weight cards in a plain 3-up grid, no hierarchy.
- Emoji used as UI icons (use a real icon set).
- Lorem ipsum or obviously placeholder copy.
- Timid, evenly-distributed color with no dominant tone and no real accent.
6. RESULT PRESENTATION
- Present the core feature's output in a clean, designed layout that fits the product:
  cards, labels, scores, color-coding, and a clear verdict. Make the result the hero
  moment of the whole app — the thing worth screenshotting.
7. BUILD THE WHOLE FLOW
- Recreate the supporting pages too: landing page, sign up / sign in, and wherever
  the core feature lives.
- Seed everything with realistic sample data so no screen ever looks empty.
- Fully responsive — flawless on mobile and desktop, no horizontal scroll, tap targets
  sized for thumbs.
- Accessibility is part of the craft: real contrast ratios, visible focus rings,
  keyboard navigation, semantic HTML, alt text.
- If anything is unclear, make a smart product decision and keep going. Never stop to
  ask — build the most sensible version.
8. SELF-QA BEFORE YOU CALL IT DONE (do not skip)
- Actually view your build at mobile (~390px) and desktop widths — take screenshots.
- Review them against everything above: hierarchy, spacing rhythm, font choice,
  dominant-color discipline, motion, all states, responsiveness, the anti-slop list.
- Fix what looks off. Repeat until it genuinely looks designed, not generated.
When you're done, give me a working app I can click through end to end with the core
feature fully functional, plus a short summary of what you built, the design direction
you chose and why, and how the main flow works.

Now add a full set of comparison pages so the site can rank on Google and pull in
search traffic. These are part of the SAME site — reuse the exact design system,
tokens, fonts, and components from the app you just built. They must look every bit
as designed as the app, never like a bolted-on SEO afterthought.
RESEARCH FIRST
- Take the original brand at the URL I gave you and research the market to find 5 to 8
  real competing or alternative products in the same category. Pick the closest and
  most-searched ones.
THEN BUILD
- A comparison hub at /compare listing every comparison with a short blurb and a link.
- One comparison page per competitor at a clean slug like /compare/[competitor-name].
- One page comparing THIS app against the original brand at the URL.
MAKE EVERY COMPARISON PAGE RANK
- A keyword-targeted page title and H1, e.g.
  "[This app] vs [Competitor]: features, pricing, and which is better in 2026".
- A unique meta description and Open Graph tags per page.
- A side-by-side comparison built as a DESIGNED component (not a raw HTML table):
  key features, pricing, free option, speed, accuracy, ease of use, and pros/cons for
  each. Use the design system — clear column hierarchy, readable on mobile, tasteful
  use of the accent color and check/cross marks.
- A short honest intro and a clear verdict. Favor this app where it genuinely wins, but
  stay fair and accurate. Do NOT invent fake weaknesses — dishonest comparisons get
  penalized by Google and kill trust.
- An FAQ answering what people actually type, e.g. "Is [this app] a good [Competitor]
  alternative?" and "[Competitor] vs [this app], which is better?".
- Structured data (Product, FAQPage, BreadcrumbList) so pages can earn rich results.
- A clear, well-designed CTA on every page sending the reader to sign up and try the
  core feature.
- Internal links from the landing page to the hub, and between the comparison pages.
Target the searches people actually make: "[brand] alternative", "[brand] vs
[competitor]", "best [category] tool", and "[competitor] alternatives".
Also tidy up SEO across the whole site: semantic HTML, fast load, a descriptive title
and meta description on every page, a sitemap, and clean readable URLs.