Build a 3.5s motion-graphics video: Letters assemble from a 3D scatter, the mark bounces, and a shockwave locks the brand in.

## Skills
- Use the `remotion-best-practices` skill for all composition code. If this project uses HyperFrames instead of Remotion, use `/hyperframes` with `hyperframes-animation` and keep the same beats.
- Use the `motion-graphics` skill (if installed) for motion direction and polish.
- If there is no Remotion project yet, scaffold one first with the `remotion-create` workflow, then open Studio so I can watch the preview while you build.

## Hooks (set up first)
Merge this into `.claude/settings.json` so every edit is type-checked and every finished turn renders a verification still:
```json
{
  "hooks": {
    "PostToolUse": [
      {
        "matcher": "Edit|Write|MultiEdit",
        "hooks": [
          {
            "type": "command",
            "command": "npx tsc --noEmit -p . 2>&1 | head -30"
          }
        ]
      }
    ],
    "Stop": [
      {
        "hooks": [
          {
            "type": "command",
            "command": "npx remotion still LogoSting out/LogoSting-check.png --frame=73 2>&1 | tail -5"
          }
        ]
      }
    ]
  }
}
```

## Composition
- id `LogoSting`, 1080x1920 (9:16), 30 fps, 105 frames.
- Define a zod schema for the props below and pass them as `defaultProps`, so the copy stays editable in Studio.
- Default props:
```json
{
  "brandName": "Pebble",
  "logoUrl": "",
  "tagline": "Small things, done well."
}
```

## Look
- Colours: background #15122B, surface #29234D, text #F5F1FF, single accent #B69CFF. Use only these.
- Typeface: Syne (load it with `@remotion/google-fonts`), heavy weights for display text, tight negative tracking.
- Motion vocabulary: logo sting, letters flying in from scattered 3D positions with motion blur and locking into a wordmark, rounded logo mark spinning in and doing one squash-and-stretch bounce, double shockwave ring expanding on the lock, tagline rising underneath, solid dark background, centred composition.

## Beats
- 0.0s: a rounded logo mark (monogram "P") spins in from -90° on a bouncy spring.
- 0.2s to 1.1s: the letters of "Pebble" fly in from deterministic scattered 3D positions (translate3d, rotateX/Y, blur) and lock into the wordmark with power4 easing, staggered left to right.
- 1.1s: on lock, a double shockwave ring expands from the centre and the mark does one squash-and-stretch.
- 1.5s: tagline "Small things, done well." rises underneath.

## Rules
- Drive every animation from `useCurrentFrame()` with `interpolate()`/`spring()` and clamped extrapolation. No CSS transitions or Tailwind animation classes.
- Deterministic only: no `Math.random()` or `Date.now()`; use `random(seed)` from remotion.
- Animate transforms and opacity only (`scale`, `translate`, `rotate`); never linear easing for movement.
- Keep key content inside the platform safe area (on 9:16 leave about 220px top and 420px bottom clear). Size display text so the longest word never overflows.
- One accent colour. Strong contrast for all text. No em dashes in on-screen copy.

## Done when
- Studio plays the full 3.5s without errors, and the Stop hook still renders cleanly.
- You have rendered stills at frames 0, 36, 73 and 104 and checked each for overflow, clipped text and contrast.
- Do not render the final MP4 unless I ask.