Executable requirements: a "component" (cropped-element) visual snapshot kind

[missingbulb]

Problem

Every dom leaf renders the whole side panel. So a cross-cutting chrome change (e.g. the header title, the composer copy) re-renders and forces re-approval of every full-panel image — including the ~10 that pin a single comment's internal appearance (author fallback, literal body, time formats, the upvote states), even though the actually-tested requirement didn't change. That's noisy diffs and a diluted approval surface.

Proposal

Add a new snapshot kind — component — that drives the same real render through the harness but crops to a specified element (e.g. li.comment) before rasterizing. Same pixel-exact comparison, same owner-approved committed-PNG baseline, just scoped to the interesting element. A comment-internal requirement then pins an image of just the comment block, stable against unrelated panel chrome.

• Migrate the comment-internal leaves (author fallback, literal body, §4 time formats, §9 upvote states, and the note-list/order leaf) from dom → component (selector: "li.comment" / .comments).
• Keep panel-level states (disabled/empty/read-failure, posting/saved/failed, options) as dom full-panel renders.
• Document the methodology (when to crop vs. render the whole panel) in the executable-requirements principles docs, and suggest further crop candidates.

Follow-up to #22 (whose upvote leaves are among the migration targets).