Improve audio clip selection contrast and waveform readability

[ChuxiJ]

User Story

As a user, I want clip waveforms to stay dark and the selected clip body to turn light, so that selected content is unmistakable.

Problem

Selected clips keep the same tinted fill and only gain a blue outline, so waveform content and selected state do not separate cleanly.

Root Cause

src/components/timeline/ClipBlock.tsx ties the clip surface and selected treatment to a tinted gradient, while src/components/timeline/ClipWaveform.tsx reuses the clip color for waveform rendering.

Solution

Introduce semantic clip surfaces for default, hover, and selected states. Keep the waveform charcoal or black, switch the selected clip body to an ivory or white fill, and preserve amber or tan tones for unselected audio clips.

Verification

• Add component coverage for selected clip styling
• Capture browser screenshots before and after
• Run npx tsc --noEmit
• Run npm run build

Notes

This issue covers the visual readability part of the clip-selection refresh and should not change clip slicing behavior.