What problem does it solve? It guides developers through safely modifying the static webapp frontend (webapp/) — a Vite + React 19 + Motion site reading a committed JSON snapshot — without breaking its custom i18n layer, semantic theme tokens, onboarding tutorial, or BYOK key manager. ## Core Features & Use Cases - Bilingual PT/EN i18n: Custom React Context (DICTS + useStrings + LocaleProvider) with browser locale detection via resolveLocale and a strict both-dicts key-parity rule enforced by tests. - Semantic design tokens: Dark/light theming via tokens.css semantic layer (data-theme or prefers-color-scheme), so new surfaces work in both themes with no extra CSS. - Onboarding tutorial & BYOK modal: Apple-style tutorial with AnimatePresence and focus trap, plus a provider-aware key manager for OpenRouter and DeepSeek direct keys. - Use Case: When adding a new UI string to the webapp, follow the skill to add it to both pt and en dicts, keep the parity test green, and verify with npm test, npm run build, and a Playwright drive. ## Quick Start Ask the AI to add a new translated UI string to the webapp and verify it with the i18n parity test and a Vite build.