Purpose
Render and animate the drawing-on of four L-shaped corner brackets at the canvas corners. Creates a "film print" / "magazine spread" visual frame around the content. Once drawn, the marks stay static for the rest of the spot.
Params
{
"size_px": 60,
"stroke_width_px": 3,
"stroke_color": "#1F1F1F",
"offset_from_edge_px": 80, // distance from canvas edge
"draw_duration_per_corner_frames": 14,
"per_corner_stagger_frames": 3,
"draw_order": ["top-left", "top-right", "bottom-right", "bottom-left"],
"fade_after_draw": false // stays full opacity after draw }
## Behaviour
For each corner:
1. Render an L-shape (two perpendicular lines) at the corner.
2. Stroke-on with `stroke-dasharray` / `stroke-dashoffset` animation.
3. Each corner starts `per_corner_stagger_frames` after the previous one.
After all 4 corners draw-on, they stay static.
## Style pack overrides
- **SP-C (editorial-cinematic)** — default. Renders at scene 1, persists.
- Other packs: not used.
## Quality Checks
- All 4 corners draw-on by `4 * per_corner_stagger_frames + draw_duration_per_corner_frames`.
- Marks sit at consistent offset from canvas edges.
- Draw order produces a clockwise (or counter-clockwise) sequence.
## Failure Modes
- **Marks pop in instead of drawing on.** Stroke-dashoffset not applied. Verify SVG path is being animated.
- **Marks offset inconsistent.** Use canvas-relative positioning, not parent-relative.
- **Marks too thick / too thin.** Stroke width should be 2-4px for editorial feel.