Add and refine PR video sound design

DECISIONS.md

@@ -53,3 +53,7 @@
 - PR video approach: use Remotion for frame-accurate React motion graphics and `@remotion/player` for in-app preview at `/pr-video` before rendering.
 - Remotion dependency policy: keep `remotion`, `@remotion/cli`, and `@remotion/player` on the same exact version to avoid render/runtime mismatches.
 - Remotion styling bridge: use `@remotion/tailwind` so Vite preview and Remotion CLI renders share the same Tailwind v3 visual system.
+
+## 2026-06-13
+- Remotion sound design: use `@remotion/sfx` at the same exact Remotion version for predefined motion-graphic SFX cues instead of hand-generating local audio assets.
+- PR video BGM: use a locally generated light musical WAV under `public/audio/pr-video/` with Remotion fade controls, avoiding external music licensing and network-dependent playback.

package.json

@@ -26,6 +26,7 @@
 		"@radix-ui/react-separator": "^1.1.8",
 		"@radix-ui/react-slot": "^1.2.4",
 		"@remotion/player": "4.0.475",
+		"@remotion/sfx": "4.0.475",
 		"@tanstack/react-query": "^5.90.21",
 		"class-variance-authority": "^0.7.1",
 		"clsx": "^2.1.1",

src/features/pr-video/components/pr-video-player.tsx

@@ -7,7 +7,6 @@ export function PrVideoPlayer() {
 	return (
 		<div className="overflow-hidden rounded-lg border border-white/10 bg-slate-950 shadow-[0_28px_90px_rgba(15,23,42,0.35)]">
 			<Player
-				autoPlay
 				clickToPlay
 				component={TeamPoPrVideo}
 				compositionHeight={TEAM_PO_PR_VIDEO.height}