The Problem Page + PocketOS Case Study

Qpoint needs a page that frames the problem AI agents create for organizations — before pitching the solution. The PocketOS incident (April 25, 2026) is the sharpest version of this story: a Cursor agent deleted a production database in 9 seconds. We have a polished case study PDF (design/inbox/QPT.2026.pocket-os-case-study.03.pdf) and a header design ready. This page establishes the "why" that makes the rest of the site land.

Create a "The Problem" page on www.qpoint.io with two sections:

1. Header + problem framing — "AI agents are everywhere. You have no idea what they're doing." General explanation of the challenge with AI agents in organizations.
2. PocketOS case study — A web-native version of the case study PDF, telling the 9-second disaster story as a scrollable narrative.

• In: Content generation, basic page structure, case study narrative
• Out: Final visual design (Mark will do a manual design revision pass, then we update code to match)

A content-complete page at /the-problem with the problem framing and case study narrative. Ready for Mark's design revision pass (Phase 2).

1. Content + structure — Generate page content and basic layout in code — complete 2026-05-20
2. Manual design revision — Mark takes the live page into Illustrator/Figma and refines the design
3. Design implementation — Update code to match the revised designs

• Branch: the-problem-page (rebased onto main after qcontrol-initial merged via PR #58)

• Draft item: "Design + Build Page - The Problem" (project item PVTI_lADOBr8XCs4BYSspzgtUmoM)
• Project: qpoint-io/projects/7 — "The AI Agent Company"
• Status: Phase 1 complete, awaiting design revision

Phase 1 — Content + Structure (2026-05-20)

• Created /the-problem page with 5 components: Hero, CaseStudy, Timeline, Confession, Impact
• Content sourced from case study PDF (v03) and policy starter pack
• Sections: problem framing header, 3 hero stats, 9-second timeline, agent confession quotes, customer impact + social media wall, CTAs to QControl
• Added "The Problem" link to desktop and mobile nav
• Also fixed HMR perf: removed unused exposeConfig, added node_modules to Vite watcher ignore list

• Header design: Screenshot provided — "AI agents are everywhere. You have no idea what they're doing." with agent/pawn illustration grid
• Case study PDF: ../design/inbox/QPT.2026.pocket-os-case-study.03.pdf (v03, 5+ pages)
• Case study content in design project: ../design/brand/ai_policy_starter_pack.md (PocketOS narrative)
• Policy system context: ../design/cycles/c45.ai-agent-policy-pages/ (agent policy pages on design site)

The Problem (header area)

• Headline: "AI agents are everywhere. You have no idea what they're doing."
• Subtext: Agents run on developer machines, CI pipelines, production servers — acting autonomously, making tool calls, reading files, opening network connections. Existing security stacks can't see any of it.
• Supporting illustration: agent pawn grid showing files accessed, tools/skills, sub agents, MCP servers, network requests — with red warning indicators

PocketOS Case Study

From the PDF:

• 9 Seconds to Disaster — title + three stats (9 seconds, 1 API call, 3 months of data)
• Executive Summary — Cursor agent + Claude Opus deleted PocketOS production DB
• Act 1: What Happened — The setup, the 9-second timeline (routine task → credential mismatch → token hunting → overprivileged token → unguarded API call → total destruction)
• Act 2: The Agent's Confession — Agent's written statement, Cursor's safety track record, Railway MCP timing
• Act 3: The Customer Impact — Rental car businesses arriving to find data gone, social media reaction
• Acts 4–6 (from rest of PDF) — Why it happened, how Qpoint prevents it, lessons