Cross-Browser Typography QA

Purpose

Use this skill when web text looks clipped, flattened, wrapped incorrectly, misaligned, or materially different between Chromium and WebKit/Safari. Treat text rendering as both a geometry problem and a visual paint problem: passing DOM bounds does not prove that every glyph is intact.

Triggers

• Lowercase descenders such as g, j, p, q, or y appear cut off.
• Gradient or transparent text looks flattened at the baseline.
• A heading fits within its element but still looks clipped.
• Safari and Chromium disagree on line height, wrapping, button labels, or heavy font weights.
• A deployed fix appears absent despite a successful upload or publish message.

Workflow

1. Reproduce the exact defect