fix(ui): agent status bar clipping and compact item layout

[bertheto]

Problem

When agents have been offline for more than one hour, they are shown in a compact mode in the agent status bar. The previous implementation stacked three elements vertically (avatar emoji / offline char / state emoji), making each item ~66px tall. Combined with the fixed height: 56px on the status bar and overflow-y: hidden, items were clipped on top and bottom, making the bar unusable.

Additionally, the ? character used when no offline duration was available provided no meaningful information to the user.

Changes

src/static/index.html

• Remove BOM character (invalid in UTF-8 HTML documents)
• Replace height: 56px with min-height: 64px on #agent-status-bar
• Add align-items: center for proper vertical centering of items
• Add flex-shrink: 0 to prevent the bar from collapsing
• Switch overflow-y: hidden to overflow-y: visible to stop clipping
• Reduce vertical padding from 8px to 6px
• Bump cache-busting versions for modified JS files

src/static/js/shared-agent-status.js

• Replace "?" with "∞" when offlineTimeStr is null (duration unknown)
• Replace "?" fallback with "~" for unexpected time string formats

src/static/js/components/acb-agent-status-item.js

• Render long-offline items in a single horizontal row using the existing agent-status-emoji-row flex container instead of stacking vertically
• Add a title tooltip on the offline char: "Offline since unknown time" for ∞, or "Offline {duration}" otherwise

Visual result

Before: items clipped, ? char with no meaning.
After: single-row compact item fits within the bar, ∞ with tooltip explains the unknown duration.