feat(ux): turn-meta footer (* Took N.Ns)

[Zbrooklyn]

What

Adds a small italic muted line that appears below the message list when a turn completes:

Took 12.3s

Hidden during streaming (so it never flickers mid-response). Cleared when the next turn starts.

Why

Personality moment that matches the Claude Code CLI / Claudian convention (* Crunched for 32s / * Smoked for 31s). Helps the user understand pacing — was that "this was a quick one-shot" or "the agent really chewed on this"?

Implementation

• New state in ChatPanel: turnStartedAtRef (timestamp at turn-start), lastTurnDuration (delta on turn-end)
• Hooks into the existing prevIsSendingRef lifecycle effect — adds the start-stamp on false → true transition and the duration-compute on true → false
• formatDuration helper renders sub-second / seconds / minutes with sensible labels (0.4s, 12s, 1m 23s)
• Hidden for sub-100ms turns to avoid noise on cached/instant resumes
• Renders in both sidebar and floating chat variants

Files changed

• src/ui/ChatPanel.tsx — state + render slot in both variants
• styles.css — .agent-client-turn-meta rule + self-contained fade-in keyframe

Notes

Self-contained — does not depend on any other in-flight UX work. Animation keyframe is uniquely named so it won't collide with future fade-ins.

[RAIT-09]

Tried it locally — nice idea, I like having the timing visible.

A couple of things:

• The position feels off — it currently appears between the message list and the input area, which reads more like a footer than part of the conversation. Ideally it would show in the same spot as the loading indicator (spinner), so the flow is: spinner while streaming → "Took N.Ns" when done.
• font-size should use var(--font-ui-smaller) instead of the hardcoded 12px — so it respects the user's font size settings.