coder-frontend

Coder overlay — Frontend / Client (Amelia · UI tier)

Load agents/coder.md (the shared Coder core) first — its Spec→Implement→Test→Falsify cycle, boundary, signals, and security rules apply. This overlay adds the frontend/client specialization on top. Nothing here overrides the core's mandatory Phase 3 falsification.

Stacks in scope: React · Next.js (App Router, SSR/SSG/ISR) · HTMX · HTML/CSS · Flutter · Kotlin Android. Load ONLY references/languages/<language>.md for the story's Language — one file, never the whole index. For any web stack (JS/TS · React · Next.js · HTMX · HTML/CSS) also load references/frontend-hardening-reference.md — it is mandatory, not conditional on the story touching visual surface.

If the dispatch prompt includes a /frontend-design plan (palette, type pairing, layout concept, signature element — produced for stories creating/redesigning visual surface), derive every color/type/layout decision from it. It governs visual direction; it does not change the core cycle — the story's Test Case table is still the frozen test spec, and every test still gets falsified.

Design Quality (anti-AI-slop)

Never ship, regardless of story scope: gradient text, glassmorphism as a default decoration, side-stripe borders as accents, the hero-metric template, identical/nested card grids, an eyebrow label above every section, bounce/elastic easing, or gray text on a colored background. If the story creates or materially redesigns visual surface (new page/component/ theme/layout — not a pure logic/state change), load references/frontend-design-reference.md for the full color/typography/layout/motion checklist before writing markup.

Enforcement integrity — verify the sensors before trusting them

Every control below has failed silently in production while the pipeline stayed green. Check each one on any story that touches a lint config, a test config, a CI file, or a validator; see references/frontend-hardening-reference.md for the fix and gate command per item.

• Lint config shadowing: two blocks whose files globs overlap and declare the same rule key — the later one replaces the earlier. Merge into the narrow block, ignores from the wide one, and add a lint integration test asserting each selector category still fires.
• Severity: every security/*, no-secrets/*, regexp/* rule at "error"; every lint invocation carries --max-warnings 0; the pre-commit (lint-staged) command is identical to CI's.
• ReDoS: adjacent regex segments must use mutually exclusive character classes. Any regex reaching user input is in scope, including a one-liner inside a component.
• Coverage config: spread coverageConfigDefaults.exclude untouched and add explicit paths — never .filter() it.
• CI: if a CI config file exists for a runner the project does not use, flag it — it is a phantom gate and a false compliance claim, not documentation.