i18n(ar): mirror the layout right to left

- The title, style indicator and both rails swap sides in RTL through logical
  properties (inset-inline-*, margin-inline-*, border-inline-start); LTR
  computes the same values. The Display/Context rail keeps its physical
  `right` for the credit-clearance model and swaps in rtl.css above 720px.
- rtl.css: no letter-spacing on Arabic (it tears joined letters apart);
  Noto Sans Arabic leads the Arabic font stacks so words are not set in a
  fixed-pitch fallback; the intel HUD and cockpit instruments stay a
  left-to-right instrument overlay; media transport and the radio dial stay
  left to right; feed headlines and station names take their own direction;
  the moved rail's arrows flip.
- isolate(): a quantity in RTL text (2.7 كم, -18.0°) is wrapped in
  first-strong isolates so its digits do not join a neighbouring Latin run.

Co-Authored-By: Claude Opus 5.5 <[email protected]>

src/ui/styles/foundation.css

@@ -492,7 +492,7 @@ body.cockpit-mode #cockpit-cloud-effects.active {
 #title-bar {
   position: fixed;
   top: 32px;
-  left: 36px;
+  inset-inline-start: 36px;
   z-index: 100;
   pointer-events: none;
   user-select: none;
@@ -501,7 +501,7 @@ body.cockpit-mode #cockpit-cloud-effects.active {
 #title-bar .title-glow {
   position: absolute;
   top: -20px;
-  left: -20px;
+  inset-inline-start: -20px;
   width: 200px;
   height: 80px;
   background: radial-gradient(ellipse, var(--accent-dim) 0%, transparent 70%);
@@ -626,11 +626,11 @@ body.cockpit-mode #cockpit-cloud-effects.active {
 #style-indicator {
   position: fixed;
   top: 32px;
-  right: 36px;
+  inset-inline-end: 36px;
   z-index: 100;
   pointer-events: none;
   user-select: none;
-  text-align: right;
+  text-align: end;
 }
 
 #style-indicator .indicator-label {