[Agent] RTL layout support for Arabic and other RTL locales #657

Problem and evidence

Arabic (ar) is offered in the language selector. Commit 38e90865 made web/js/i18n.js set <html dir="rtl"> for RTL locales (ar, he, fa, ur), but the layout itself isn't mirrored:

• The CSS (web/css/*.css) and about 140 Tailwind utilities in web/js use physical directions (ml-*, mr-*, pl-*, pr-*, left-*, right-*, text-left, text-right). They don't flip under dir="rtl".
• Icons and chevrons that imply direction (back/forward, calendar prev/next, carousel and slideshow arrows, drawer slide-in) point the wrong way.

Expected behavior and scope

• Switch to logical properties: Tailwind v4 ms-* / me-* / ps-* / pe-* / start-* / end-* / text-start / text-end, and CSS margin-inline-start, inset-inline-end, etc. Leave physical properties only where the direction is truly physical (for example video PTZ arrows, which map to camera motion and must not flip).
• Mirror direction-implying icons under [dir="rtl"] (for example transform: scaleX(-1) or swapped icons). Don't mirror media: video, snapshots, floor-plan images or timelines (time keeps running left to right, a common RTL convention for media scrubbers; note the decision in the PR).
• Check the main pages: Header/nav, Live grid and tile overlays, Recordings, Timeline, Settings, Streams modal, the toast position, and modals.

Acceptance criteria

• With the language set to Arabic: nav, forms, tables and modals read right to left, padding and alignment look correct, and there's no horizontal overflow at phone width.
• Switching back to English gives exactly the current layout, with no visual regressions in LTR.
• PTZ direction buttons and the timeline scrubber are not mirrored.

Validation

• cd web && npx vite build, npm run lint, npm test.
• Screenshots of LTR and RTL for the main pages in the PR (scripts/capture-screenshots.js can help).

Constraints and rollback

• Styling only. No translation changes (tracked separately).
• Rollback: revert. dir="rtl" alone is today's behavior.