inventario

Replicate or extend Inventario UI in `frontend/` to match the `design-mocks/` reference pixel-for-pixel — same Tailwind tokens, same spacing, same shadcn/ui component anatomy. Use when implementing a design, matching a mockup, porting a screen from the mock, building a new page or component for `frontend/src/**`, or fixing visual fidelity drift. Triggers on phrases like "implement design", "match the mockup", "port from design-mocks", "pixel-perfect", "make it look like the mock", "convert mock to code", "UI fidelity", or any request to author markup, classNames, or component composition for `frontend/src/**` when an analogous file exists in `design-mocks/src/**`. Provides a path-to-path index plus ready-to-paste TSX patterns for badges, buttons, dialogs, layout primitives, and typography. Companion to `frontend-work` — that skill handles pre-flight/post-flight; this one carries the replication recipes. Skip for backend/test/types-only changes or when no visual analogue exists in the mock.

Generate local screenshots of the Inventario React frontend via `e2e/screenshots.mjs` and review them visually for bugs (unresolved i18n keys, broken layout, wrong currency, truncated dates, dark-mode regressions, missing fallbacks). Use for visual testing, UI review, dark-mode checks, verifying frontend appearance, checking how a page looks, or eyeballing visual regressions. Triggers on phrases like "screenshot the app", "check how it looks", "visual review", "verify the UI", "post screenshots on the issue", or "make sure the page renders right". After a frontend change in `frontend/`, OFFER this review to the user — never auto-runs. On further explicit user request, captures may be published to an `assets/screenshots-ISSUE` branch via `e2e/push-screenshots.sh` and embedded as an Issue/PR comment via `mcp__github_and_git__add_issue_comment`. Strict rule — never produce screenshots, push them, or comment on Issues without an explicit user "yes" per step. Skip for backend-only, docs-only, type-only, or pure-te

Orchestrate any task that touches `frontend/` (React 19 + Tailwind v4 + shadcn/ui). Activates whenever the agent is about to read, modify, add, or design files under `frontend/src/`, including new pages, new components, layout/styling work, sidebar/app-shell changes, route additions, i18n key edits, theme/density work, and form/data work that has a visual surface. Enforces design fidelity against `design-mocks/` (read-only mirror of upstream `inventario-design`), points at `devdocs/frontend/` as the operating manual, requires logging deviations in `devdocs/frontend/design-deviations.md`, and offers post-change visual review plus optional Issue-comment publication via the `screenshot-review` skill and `e2e/push-screenshots.sh`. Skip for backend-only changes (`go/`), type-only generation (`src/types/api.d.ts`), pure docs changes, or test-only edits.

Run, reproduce, and debug Playwright e2e tests for Inventario locally. Use this skill when the user asks to "run e2e tests", "reproduce a failing playwright test", "debug a flaky e2e", or when "PR has failing E2E checks" — anything where the answer involves `npx playwright test`, the `e2e/` directory, the docker-compose e2e stack, or Playwright artifacts (test-results, traces, reports). Skip for unit tests (`make test`, vitest), Go tests (`go test`), or anything that doesn't touch `e2e/`.