Use this agent when you need to debug frontend issues, inspect browser console output, or verify UI changes through visual inspection. Examples: <example>Context: User is developing a React component and encountering JavaScript errors. user: 'I'm getting some console errors when I click the crafting button, can you help me debug this?' assistant: 'I'll use the browser-debug-inspector agent to check the console output and inspect the issue.' <commentary>Since the user is reporting console errors, use the browser-debug-inspector agent to examine browser console output and take screenshots to diagnose the problem.</commentary></example> <example>Context: User has made UI changes and wants to verify they look correct. user: 'I just updated the ItemDetailPanel styling, can you check if it looks right?' assistant: 'Let me use the browser-debug-inspector agent to take a screenshot and verify the UI changes.' <commentary>Since the user wants visual verification of UI changes, use the browser-debug-inspector agent to capture screenshots and inspect the visual results.</commentary></example>