/superloopy-frontend

name: superloopy-frontend
description: Use only after explicit Codex `$superloopy:superloopy-frontend` or Claude Code `/superloopy:superloopy-frontend` invocation for supported screen-based application UI across browser-hosted Web, interactive deployed content-led Web, desktop, mobile/tablet, embedded/hybrid, Qt, custom-rendered, or mixed targets, such a task started with a leading `loopy` or `루피`, or an active Superloopy loop explicitly routing it here. Do not activate from UI, frontend, desktop, mobile, or framework vocabulary alone, or for TV, wearable, XR, automotive, game UI, TUI, static media/document artifacts, or non-UI work.

Superloopy Frontend

Activation

Open your reply with `SUPERLOOPY FRONTEND ENABLED`. If another active Superloopy mode mandates its own first line, print that first and this marker on the next line.

**Explicit activation only.** Engage when the user invokes `$superloopy:superloopy-frontend` in Codex or `/superloopy:superloopy-frontend` in Claude Code for a supported screen-based application UI task, begins such a task with a leading `loopy` or `루피`, or an already-active Superloopy loop explicitly routes that task here. Interactive deployed content-led Web such as a campaign, publication, or landing experience is supported when navigation, forms, consent, localization, or another user journey is being built or validated; a static image, video, slide deck, document, or other non-interactive artifact is not. A plain mention of UI, frontend, desktop, mobile, SwiftUI, Tauri, Flutter, Qt, QML, Widgets, or a visible symptom is not authorization to activate this workflow. TV, wearable, XR, automotive, game UI, TUI, static media/document artifacts, and backend, API, data, concurrency, or infrastructure work stay with their primary workflows.

Inspect and route

Resolve the facts that determine ownership and proof before choosing references:

• affected users, job, and outcome, marking each as evidence, assumption, or unknown with confidence;
• deployed OS, device, desktop environment, and session;
• public, authenticated, private/internal, installed, embedded, native-control, custom-rendered, or mixed composition;
• renderer and its semantic and accessibility model;
• client, shell, service, document, and state ownership;
• framework, runtime, provider, backend, and supported version;
• package, sandbox, update or distribution channel, and persistence boundary; and
• supported input, locale, accessibility services, and target validation capability.

For a Qt route, also resolve the minimum Qt version. Inspect repository evidence first. Ask the minimum necessary questions only when material unknowns would change the route or result; batch independent unknowns when more than one must be answered. Load the smallest applicable union:

| Requested surface | Load | | --- | --- | | Browser-hosted DOM/document Web | [`references/ux.md`](references/ux.md) + [`references/web.md`](references/web.md) | | Browser-hosted canvas/custom-rendered Web | [`references/ux.md`](references/ux.md) + [`references/web.md`](references/web.md) + [`references/renderer.md`](references/renderer.md) | | Installed PWA or browser extension | [`references/ux.md`](references/ux.md) + [`references/web.md`](references/web.md) | | Embedded HTML on desktop | [`references/ux.md`](references/ux.md) + [`references/web.md`](references/web.md) + [`references/desktop.md`](references/desktop.md) + [`references/hybrid.md`](references/hybrid.md) | | Embedded HTML on mobile | [`references/ux.md`](references/ux.md) + [`references/web.md`](references/web.md) + [`references/mobile.md`](references/mobile.md) + [`references/hybrid.md`](references/hybrid.md) | | Native/custom desktop | [`references/ux.md`](references/ux.md) + [`references/desktop.md`](references/desktop.md) | | Qt Widgets on desktop | [`references/ux.md`](references/ux.md) + [`references/desktop.md`](references/desktop.md) + [`references/qt.md`](references/qt.md) + [`references/qt-widgets.md`](references/qt-widgets.md) + [`references/qt-qa.md`](references/qt-qa.md) | | Qt Widgets on mobile or tablet | [`references/ux.md`](references/ux.md) + [`references/mobile.md`](references/mobile.md) + [`references/qt.md`](references/qt.md) + [`references/qt-widgets.md`](references/qt-widgets.md) + [`references/qt-qa.md`](references/qt-qa.md) | | Qt Quick/QML on desktop | [`references/ux.md`](references/ux.md) + [`references/desktop.md`](references/desktop.md) + [`references/qt.md`](references/qt.md) + [`references/qt-quick.md`](references/qt-quick.md) + [`references/qt-qa.md`](references/qt-qa.md) | | Qt Quick/QML on mobile or tablet | [`references/ux.md`](references/ux.md) + [`references/mobile.md`](references/mobile.md) + [`references/qt.md`](references/qt.md) + [`references/qt-quick.md`](references/qt-quick.md) + [`references/qt-qa.md`](references/qt-qa.md) | | Qt Widgets on WebAssembly | [`references/ux.md`](references/ux.md) + [`references/web.md`](references/web.md) + [`references/renderer.md`](references/renderer.md) + [`references/qt.md`](references/qt.md) + [`references/qt-widgets.md`](references/qt-widgets.md) + [`references/qt-qa.md`](references/qt-qa.md) | | Qt Quick/QML on WebAssembly | [`references/ux.md`](references/ux.md) + [`references/web.md`](references/web.md) + [`references/renderer.md`](references/renderer.md) + [`references/qt.md`](references/qt.md) + [`references/qt-quick.md`](references/qt-quick.md) + [`references/qt-qa.md`](references/qt-qa.md) | | Mixed Qt Widgets + Qt Quick on WebAssembly | [`references/ux.md`](references/ux.md) + [`references/web.md`](references/web.md) + [`references/renderer.md`](references/renderer.md) + [`references/qt.md`](references/qt.md) + [`references/qt-widgets.md`](references/qt-widgets.md) + [`references/qt-quick.md`](references/qt-quick.md) + [`references/qt-qa.md`](references/qt-qa.md) | | Mixed Qt Widgets + Qt Quick on desktop | [`references/ux.md`](references/ux.md) + [`references/desktop