Merge Core main into german/hal-644-ar: Arabic on the Vue UI

Main moved the UI to Vue views and Pinia stores, so the Arabic changes to
the old DOM controllers now live in their views: the rail legend range
comes from formatScaleRange (keeping units a source supplies as given),
the voice timeout options are worded by Intl unit formatting in
VoiceControl, and the scene editor's JSON fields stay left to right in
SceneDialog. Main's CCTV status line, launch panel and calibration values
keep the Arabic isolates and Western-digit formatting.

isolate() and keepCodesWithValues() read the locale through getLocale(),
which follows the page's vue-i18n instance, and the Intl formatters take
intlLocale(getLocale()). A language switch now applies in place, and
applyDocumentLanguage sets <html dir> on every switch, so the page mirrors
without a reload.

The icon rails and their tips are placed with logical properties, so they
stay on the outer side of the mirrored stacks; Cyber's new stack offsets,
padding and edge lines are logical too, and rtl.css moves Cyber's right
stack to its new rail clearance. Main removed the Context mini radio, so its
right-to-left rules and test go.

The Arabic catalog gains main's new strings and drops the ones main no
longer uses; the other catalogs keep main's new keys and the branch's
landing labels.

src/ui/styles/cyber.css

@@ -41,8 +41,6 @@
   min-height: 0;
   overflow-y: auto;
   overscroll-behavior: contain;
-  scrollbar-width: thin;
-  scrollbar-color: rgba(165, 188, 199, 0.35) transparent;
 }
 
 :root[data-ui-theme='cyber'] .cctv-panel-inner > .cyber-panel-body {
@@ -68,8 +66,6 @@
   min-height: 0;
   overflow-y: auto;
   overscroll-behavior: contain;
-  scrollbar-width: thin;
-  scrollbar-color: rgba(165, 188, 199, 0.35) transparent;
 }
 
 :root[data-ui-theme='cyber'] #pp-toggles > .pp-panel-body > * {
@@ -82,6 +78,8 @@
 
 :root[data-ui-theme='cyber'] {
   color-scheme: dark;
+  --scroll-thumb: rgba(165, 188, 199, 0.35);
+  --scroll-track: transparent;
   --cyber-red: #c45454;
   --cyber-red-bright: #e16666;
   --cyber-slate: #26343a;
@@ -796,6 +794,12 @@
   accent-color: var(--cyber-red);
 }
 
+/* Street Level's range wears Cyber's slider accent like every other range. */
+:root[data-ui-theme='cyber'] .sl-range {
+  --accent: inherit;
+  --accent-glow: inherit;
+}
+
 :root[data-ui-theme='cyber']
   :where(button, a[href], input, select, textarea):focus-visible {
   outline-color: var(--cyber-red-bright) !important;
@@ -1441,6 +1445,15 @@
   text-shadow: 0 0 6px var(--cyber-red);
 }
 
+/* Cyber frames each mode button itself; the shared segmented track would
+   draw a third, blue frame around them. */
+:root[data-ui-theme='cyber'] .global-context-modes {
+  gap: 7px;
+  padding: 0;
+  border: 0;
+  background: none;
+}
+
 :root[data-ui-theme='cyber'] .dock-tray-toggle,
 :root[data-ui-theme='cyber'] .context-mode-button {
   background-color: rgba(38, 52, 58, 0.95);
@@ -1552,10 +1565,6 @@
   clip-path: polygon(12px 0, 100% 0, calc(100% - 12px) 100%, 0 100%);
 }
 
-#intel-hud[data-variant='cyber'] .hud-top-bar {
-  display: none;
-}
-
 /* Cyber keeps the useful style and locality readouts, not fictional IDs. */
 #intel-hud[data-variant='cyber'] .hud-top-left .hud-classification,
 #intel-hud[data-variant='cyber'] .hud-top-left .hud-system {
@@ -1645,12 +1654,27 @@
   }
 
   :root[data-ui-theme='cyber'] #left-panel-stack {
+    /* The stack holds still, so its rail needs no offset (leftPanelRail.js). */
+    --panel-stack-top-pinned: 1;
     top: var(--cyber-left-rail-top) !important;
     bottom: calc(2vh + 13rem);
-    inset-inline-start: 54px;
+    inset-inline-start: calc(54px + var(--panel-rail-clearance));
     width: 300px;
     padding-inline-start: 10px;
-    border-inline-start: 1px solid rgba(196, 84, 84, 0.72);
+    border-inline-start: 1px solid transparent;
+  }
+
+  /* An edge line marks each side's open panel, mirrored left and right. */
+  :root[data-ui-theme='cyber']
+    body:not(.cockpit-mode)
+    #left-panel-stack:has(> [data-panel-id]:not(.collapsed, [hidden])) {
+    border-inline-start-color: rgba(196, 84, 84, 0.72);
+  }
+
+  :root[data-ui-theme='cyber']
+    body:not(.cockpit-mode)
+    #right-context-rail:has(> [data-panel-id]:not(.collapsed, [hidden])) {
+    border-inline-end-color: rgba(196, 84, 84, 0.72);
   }
 
   :root[data-ui-theme='cyber']
@@ -1669,6 +1693,13 @@
     flex: 0 0 auto;
   }
 
+  /* The panel rail lists the collapsed panels. */
+  :root[data-ui-theme='cyber']
+    #left-panel-stack.layout-focus.layout-exclusive
+    > [data-panel-id].collapsed {
+    display: none;
+  }
+
   :root[data-ui-theme='cyber']
     #left-panel-stack
     > :is(#data-panel, #scene-panel) {
@@ -1722,8 +1753,11 @@
   :root[data-ui-theme='cyber'] #right-context-rail {
     --right-display-collapsed-width: var(--cyber-panel-collapsed-width);
     --right-context-collapsed-width: var(--cyber-panel-collapsed-width);
-    right: 62px;
-    width: 312px;
+    /* The edge line and its gap keep the panels where they were. */
+    right: calc(51px + var(--panel-rail-clearance));
+    width: 323px;
+    padding-inline-end: 10px;
+    border-inline-end: 1px solid transparent;
   }
 
   /* The map rails now use one visible expanded width. Keeping the rail itself
@@ -1792,8 +1826,11 @@
     isolation: isolate;
     min-height: 132px;
     flex: 1 1 auto;
-    border-style: solid;
-    border-color: rgba(206, 222, 226, 0.14);
+    place-content: center;
+    padding: 12px;
+    border: 1px solid rgba(206, 222, 226, 0.14);
+    border-radius: 7px;
+    text-align: center;
     overflow: hidden;
     background:
       linear-gradient(
@@ -1855,7 +1892,6 @@
     background-size: 78px 78px;
   }
 
-  #intel-hud[data-variant='cyber'] .hud-top-bar,
   #intel-hud[data-variant='cyber'] .hud-bottom-bar {
     display: none;
   }
@@ -2492,15 +2528,13 @@
   );
 }
 
-:root[data-ui-theme='cyber']
-  body.cockpit-mode
-  :is(.cockpit-context-header, .cockpit-signal-header) {
+:root[data-ui-theme='cyber'] body.cockpit-mode .cockpit-card-header {
   border-bottom-color: rgba(105, 203, 209, 0.25);
 }
 
 :root[data-ui-theme='cyber']
   body.cockpit-mode
-  :is(.cockpit-context-kicker, .cockpit-signal-kicker, .cockpit-route-kicker) {
+  :is(.cockpit-card-kicker, .cockpit-route-kicker) {
   color: var(--cockpit-caution);
 }