Add skill: mapbox-custom-rendering-patterns (CustomLayerInterface, THREE.js, WebGL)

## Summary

Custom rendering with Mapbox GL JS is a powerful but poorly documented area. AI assistants typically don't know the `CustomLayerInterface` API or how to integrate THREE.js / raw WebGL into the map render pipeline correctly.

## Topics to cover

- `CustomLayerInterface` - `onAdd`, `render`, `onRemove` lifecycle
- THREE.js integration - shared WebGL context, coordinate projection, camera sync
- Raw WebGL custom layers - shader setup, buffer management, depth testing
- Point clouds and 3D model overlays
- Synchronizing custom layer rendering with map camera and tile loading

## Key patterns a skill should teach

- Correct matrix math for projecting geographic coordinates to clip space
- How to share the WebGL context without corrupting Mapbox's render state
- Frame timing and when to call `map.triggerRepaint()`
- Common mistakes: wrong depth buffer settings, coordinate system confusion, memory leaks from unregistered layers

## Why this matters

Developers building 3D visualizations, AR-adjacent experiences, or high-performance custom effects need this. The base model frequently gives incorrect matrix math or misuses the render lifecycle.

No files or tests are named in the issue. Start by locating how existing skills are structured, then research Mapbox GL JS CustomLayerInterface, THREE.js shared-context rendering, and raw WebGL layers. Done means a skill covering the listed lifecycles, matrix and camera handling, render-state safety, repaint timing, and common mistakes.

Written by the indexing model from the issue text.