render-incident-report-image

Self-Evolving Skill: This skill improves through use. If instructions are wrong, parameters drifted, or a workaround was needed — fix this file immediately, don't defer. Only update for real, reproducible issues.

Render a clean monospace report PNG via the TS core pushover_core.ts render (Satori → vector SVG → @resvg/resvg-js → PNG).

Device-calibrated facts (verified on a physical iPhone 13 mini, 2026-05-30)

• 72-column hard wrap is comfortably legible inline without pinch-zoom (40/56/72 all tested; 72 confirmed fine).
• Pushover fits images to width — it never crops horizontally. Earlier "right-edge trimmed" images were a renderer bug (no wrapping), not Pushover.
• No practical pixel-height ceiling: a 30,000 px-tall image scrolls/zooms fine, far under the 5 MB attachment cap → render the whole report in one tall image, never paginate.
• Auto-fit width (2026-06-01): 72 cols is the MAX wrap, not a fixed canvas width. The canvas is sized to the longest actual line (maxChars × 18px advance + 48px pad, monospace ⇒ exact/deterministic), so short reports don't waste right-margin whitespace — Pushover scales the snug image up, rendering text larger. (e.g. a 43-char digest: 1344 → 822 px, ~1.6× bigger on screen.) No image post-processing needed.

Usage