Merge remote-tracking branch 'origin/main' into authoring-panel

# Conflicts:
#	docs/CURRENT-STATE.md

src/ui/styles/bhote-koshi.css

@@ -518,14 +518,15 @@ html:not([lang='en']) .bhote-event-story-current strong {
   -webkit-line-clamp: 2;
 }
 
-/* Phase / time / sources run long in translation: allow a second line. */
+/* Phase / time / sources / imagery note run long in translation: allow up to
+   three lines so the last status is not cut off. */
 html:not([lang='en']) .bhote-event-story-current small {
   display: -webkit-box;
   margin-top: 3px;
   text-overflow: clip;
   white-space: normal;
   -webkit-box-orient: vertical;
-  -webkit-line-clamp: 2;
+  -webkit-line-clamp: 3;
 }
 
 .bhote-event-actions {

src/ui/styles/cjk.css

@@ -1,6 +1,7 @@
-/* Tight tracking keeps Chinese labels readable; preserve Latin tracking for
-   intel HUD readouts and content marked translate="no", including its containers. */
-html:lang(zh)
+/* Chinese and Japanese text. Tight tracking keeps CJK labels readable;
+   preserve Latin tracking for intel HUD readouts and content marked
+   translate="no", including its containers. */
+html:is(:lang(zh), :lang(ja))
   body
   :not(
     #intel-hud,
@@ -12,40 +13,67 @@ html:lang(zh)
   letter-spacing: 0.02em !important;
 }
 
-/* Keep small Chinese labels legible at a minimum of 9px. */
-html:lang(zh) #command-dock .gev-mic-label,
-html:lang(zh) #command-dock #gev-voice-detail,
-html:lang(zh) .gev-voice-tier-btn,
-html:lang(zh) .panel-layer-toggle {
+/* Japanese line breaking: never start a line with ー, a small kana or closing
+   punctuation (プレビュ / ー). */
+html:lang(ja) body {
+  line-break: strict;
+}
+
+/* Keep small CJK labels legible at a minimum of 9px. */
+html:is(:lang(zh), :lang(ja)) #command-dock .gev-mic-label,
+html:is(:lang(zh), :lang(ja)) #command-dock #gev-voice-detail,
+html:is(:lang(zh), :lang(ja)) .gev-voice-tier-btn,
+html:is(:lang(zh), :lang(ja)) .panel-layer-toggle {
   font-size: 9px;
 }
 
 /* A two-glyph button label must not break between its glyphs. */
-html:lang(zh) .pp-mode-btn {
+html:is(:lang(zh), :lang(ja)) .pp-mode-btn {
+  white-space: nowrap;
+}
+
+/* Japanese segment labels are short words (すべて, 平面): keep each whole. */
+html:lang(ja) .gev-segment {
   white-space: nowrap;
 }
 
 /* Keep unit symbols in their catalog case, including the cockpit readouts. */
-html:lang(zh) #intel-hud *,
-html:lang(zh) #cockpit-hud * {
+html:is(:lang(zh), :lang(ja)) #intel-hud *,
+html:is(:lang(zh), :lang(ja)) #cockpit-hud * {
   text-transform: none;
 }
 
-/* Move short travel modes (步行 / 骑行) to the next line as whole words. */
-html:lang(zh) [data-layer-id='directions'] .data-toggle-meta {
+/* Move short travel modes (步行 / 骑行, 徒歩 / 自転車) to the next line as
+   whole words. */
+html:is(:lang(zh), :lang(ja)) [data-layer-id='directions'] .data-toggle-meta {
   word-break: keep-all;
   overflow-wrap: break-word;
 }
 
 /* Leave room for the complete sensor name and resolution on two lines. */
-html:lang(zh) .recent-imagery-readout .ri-strip {
+html:is(:lang(zh), :lang(ja)) .recent-imagery-readout .ri-strip {
   height: 131px;
 }
-html:lang(zh) .recent-imagery-readout .ri-card {
+html:is(:lang(zh), :lang(ja)) .recent-imagery-readout .ri-card {
   height: 123px;
   grid-template-rows: 42px 13px 22px 11px 18px;
 }
-html:lang(zh) .recent-imagery-readout .ri-card-sensor {
+html:is(:lang(zh), :lang(ja)) .recent-imagery-readout .ri-card-sensor {
   white-space: normal;
   text-overflow: clip;
 }
+
+/* The Japanese imagery slot line wraps at its · separators, never inside a
+   word (プレ / ビュー); a run too long for the line still breaks. */
+html:lang(ja) .recent-imagery-readout .ri-slot-value {
+  word-break: keep-all;
+  overflow-wrap: break-word;
+}
+
+/* Japanese layer status lines wrap at their spaces and · separators, so an
+   age such as 1分以内 stays whole (更新 1 / 分以内); a run too long for the
+   line still breaks. */
+html:lang(ja) .data-toggle-meta {
+  word-break: keep-all;
+  overflow-wrap: break-word;
+}

src/ui/styles/cockpit.css

@@ -730,7 +730,8 @@ html:not([lang='en']) .cockpit-roll-token.is-separator {
 }
 .cockpit-vision-controls {
   display: grid;
-  grid-template-columns: 48px 58px 48px;
+  /* The current style grows for a long translated name (ЗВИЧАЙНИЙ). */
+  grid-template-columns: 48px minmax(58px, max-content) 48px;
   align-items: stretch;
   gap: 2px;
   margin-top: 2px;

src/ui/styles/command-dock-trays.css

@@ -463,17 +463,10 @@ body:not(.ui-clean-view):not(.recording-mode):has(
 }
 
 #intel-hud[data-variant='tactical'] .hud-bottom-left,
-#intel-hud[data-variant='tactical'] .hud-bottom-right,
-#intel-hud[data-variant='operator'] .hud-bottom-left,
-#intel-hud[data-variant='operator'] .hud-bottom-right {
+#intel-hud[data-variant='tactical'] .hud-bottom-right {
   bottom: calc(2vh + 6.5rem);
 }
 
-#intel-hud[data-variant='operator'] .hud-bottom-bar {
-  bottom: calc(2vh + 9.8rem);
-  width: min(48vw, 680px);
-}
-
 #intel-hud[data-variant='minimal'] .hud-bottom-left {
   bottom: calc(2vh + 5.4rem);
 }

src/ui/styles/cyber.css

@@ -747,12 +747,6 @@
   .btn-icon::before {
   content: '◐';
 }
-:root[data-ui-theme='cyber']
-  #command-dock
-  .style-btn[data-style='snow']
-  .btn-icon::before {
-  content: '❄︎';
-}
 
 :root[data-ui-theme='cyber'] :where(#bloom-toggle, #sharpen-toggle) {
   font-size: 0;
@@ -1447,6 +1441,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);
@@ -1558,10 +1561,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 {
@@ -1798,8 +1797,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(
@@ -1861,7 +1863,6 @@
     background-size: 78px 78px;
   }
 
-  #intel-hud[data-variant='cyber'] .hud-top-bar,
   #intel-hud[data-variant='cyber'] .hud-bottom-bar {
     display: none;
   }

src/ui/styles/layers.css

@@ -985,17 +985,16 @@
     animation: none;
   }
 }
+/* Context is read for longer than other panels; it carries no halo. */
 #global-context-panel .panel-glow {
-  position: absolute;
-  inset: -20px;
-  background: radial-gradient(
-    ellipse at center,
-    rgba(98, 181, 255, 0.2) 0%,
-    transparent 62%
-  );
-  filter: blur(20px);
-  opacity: 0.24;
-  pointer-events: none;
+  display: none;
+}
+/* Expanded, its section titles (Context, Radio) stay legible over bright
+   imagery. Cyber keeps its own red titles; collapsed launchers match siblings. */
+:root:not([data-ui-theme='cyber'])
+  #global-context-panel:not(.collapsed)
+  .panel-title {
+  color: var(--text-secondary);
 }
 .global-context-panel-inner {
   position: relative;
@@ -1012,158 +1011,6 @@
   backdrop-filter: blur(24px) saturate(1.4);
   -webkit-backdrop-filter: blur(24px) saturate(1.4);
 }
-.context-radio-dock {
-  position: relative;
-  display: flex;
-  align-items: center;
-}
-.context-radio-toggle {
-  display: grid;
-  width: 28px;
-  height: 28px;
-  place-items: center;
-  padding: 0;
-  border: 1px solid rgba(98, 181, 255, 0.22);
-  border-radius: 6px;
-  color: rgba(143, 207, 255, 0.58);
-  background: rgba(42, 113, 171, 0.08);
-  cursor: pointer;
-  transition:
-    border-color 0.15s ease,
-    color 0.15s ease,
-    background 0.15s ease,
-    box-shadow 0.15s ease;
-}
-.context-radio-toggle .material-symbols-outlined {
-  font-size: 17px;
-}
-.context-radio-toggle:hover,
-.context-radio-toggle:focus-visible {
-  border-color: #79c2ff;
-  color: #fff;
-  outline: none;
-}
-.context-radio-toggle.active {
-  border-color: rgba(101, 247, 255, 0.82);
-  color: #eaffff;
-  background: rgba(0, 212, 255, 0.16);
-  box-shadow:
-    inset 0 0 12px rgba(0, 212, 255, 0.1),
-    0 0 12px rgba(0, 212, 255, 0.2);
-}
-.context-radio-toggle:disabled {
-  opacity: 0.5;
-  cursor: wait;
-}
-.context-radio-mini {
-  position: absolute;
-  z-index: 5;
-  top: calc(100% + 20px);
-  right: -38px;
-  display: none;
-  width: 244px;
-  box-sizing: border-box;
-  gap: 8px;
-  padding: 10px;
-  border: 1px solid rgba(65, 220, 231, 0.28);
-  border-radius: 8px;
-  background: rgba(2, 15, 20, 0.96);
-  box-shadow:
-    0 12px 32px rgba(0, 0, 0, 0.62),
-    inset 0 1px 0 rgba(255, 255, 255, 0.04);
-  backdrop-filter: blur(22px) saturate(1.35);
-  -webkit-backdrop-filter: blur(22px) saturate(1.35);
-}
-.context-radio-mini[hidden] {
-  display: none !important;
-}
-.context-radio-dock.disclosure-open .context-radio-mini {
-  display: grid;
-}
-.context-radio-mini-heading {
-  display: grid;
-  grid-template-columns: auto minmax(0, 1fr) auto;
-  gap: 8px;
-  align-items: center;
-  color: #65f7ff;
-  font: 7px/1.2 var(--font-mono);
-  letter-spacing: 0.12em;
-}
-.context-radio-mini-heading button {
-  display: grid;
-  width: 26px;
-  height: 26px;
-  place-items: center;
-  padding: 0;
-  border: 1px solid rgba(65, 220, 231, 0.28);
-  border-radius: 5px;
-  color: #8feaf2;
-  background: rgba(14, 69, 78, 0.16);
-  cursor: pointer;
-}
-.context-radio-mini-heading button:hover,
-.context-radio-mini-heading button:focus-visible {
-  border-color: #65f7ff;
-  color: #fff;
-  outline: none;
-}
-.context-radio-mini-actions {
-  display: flex;
-  gap: 5px;
-}
-.context-radio-mini-heading .material-symbols-outlined {
-  font-size: 16px;
-}
-.context-radio-mini > .panel-layer-toggle {
-  width: 100%;
-}
-.context-radio-mini-heading strong {
-  overflow: hidden;
-  color: #e8feff;
-  font-size: 8px;
-  font-weight: 500;
-  text-align: right;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-}
-.context-radio-mini-transport {
-  display: grid;
-  grid-template-columns: repeat(3, minmax(0, 1fr));
-  gap: 5px;
-}
-.context-radio-mini-transport button {
-  min-height: 28px;
-  padding: 5px;
-  border: 1px solid rgba(65, 220, 231, 0.28);
-  border-radius: 5px;
-  color: #8feaf2;
-  background: rgba(14, 69, 78, 0.16);
-  font: 8px/1 var(--font-mono);
-  cursor: pointer;
-}
-.context-radio-mini-transport button:hover:not(:disabled),
-.context-radio-mini-transport button:focus-visible:not(:disabled),
-.context-radio-mini-transport button.active {
-  border-color: #65f7ff;
-  color: #fff;
-  outline: none;
-}
-.context-radio-mini-transport button:disabled {
-  opacity: 0.38;
-  cursor: not-allowed;
-}
-.context-radio-mini-volume {
-  display: grid;
-  grid-template-columns: auto minmax(0, 1fr) 30px;
-  gap: 7px;
-  align-items: center;
-  color: var(--text-dim);
-  font: 7px/1 var(--font-mono);
-  letter-spacing: 0.08em;
-}
-.context-radio-mini-volume input {
-  width: 100%;
-}
 .global-context-actions {
   display: grid;
   grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
@@ -1229,40 +1076,44 @@
      rather than relying on the chrome alone. */
   filter: drop-shadow(0 0 5px rgba(150, 210, 255, 0.9));
 }
+/* One segmented control: the two modes read as a single choice. */
 .global-context-modes {
   display: grid;
   grid-template-columns: repeat(2, minmax(0, 1fr));
-  gap: 7px;
-  margin: 0 0 10px;
+  gap: 2px;
+  margin: 0 0 12px;
+  padding: 2px;
+  border: 1px solid rgba(98, 181, 255, 0.22);
+  border-radius: 7px;
+  background: rgba(0, 0, 0, 0.22);
 }
 .context-mode-button {
   display: flex;
   min-width: 0;
-  min-height: 36px;
+  min-height: 34px;
   align-items: center;
   justify-content: center;
   gap: 6px;
-  padding: 7px 8px;
-  border: 1px solid rgba(98, 181, 255, 0.28);
-  border-radius: 6px;
-  color: #8fcfff;
-  background: rgba(42, 113, 171, 0.09);
-  font: 8px/1.15 var(--font-mono);
-  letter-spacing: 0.09em;
+  padding: 6px 8px;
+  border: 1px solid transparent;
+  border-radius: 5px;
+  color: rgba(214, 236, 255, 0.72);
+  background: transparent;
+  font: 600 10px/1.2 var(--font-mono);
+  letter-spacing: 0.06em;
   cursor: pointer;
   transition:
     border-color 0.15s ease,
     color 0.15s ease,
-    background 0.15s ease,
-    box-shadow 0.15s ease;
+    background 0.15s ease;
 }
 .context-mode-button .material-symbols-outlined {
   font-size: 16px;
 }
 .context-mode-button:hover,
 .context-mode-button:focus-visible {
-  border-color: #79c2ff;
   color: #fff;
+  background: rgba(98, 181, 255, 0.08);
   outline: none;
 }
 /* Keep focus distinct when the selected tab owns the accent colors. */
@@ -1272,12 +1123,9 @@
 }
 
 .context-mode-button.active {
-  border-color: rgba(0, 212, 255, 0.75);
-  color: #eaffff;
-  background: rgba(0, 212, 255, 0.14);
-  box-shadow:
-    inset 0 0 16px rgba(0, 212, 255, 0.08),
-    0 0 12px rgba(0, 212, 255, 0.12);
+  border-color: rgba(0, 212, 255, 0.55);
+  color: #fff;
+  background: rgba(0, 212, 255, 0.16);
 }
 .context-mode-button:disabled {
   opacity: 0.55;
@@ -1287,23 +1135,20 @@
 .context-mode-standby[hidden] {
   display: none !important;
 }
+/* Plain guidance under the tabs, not a placeholder box. */
 .context-mode-standby {
   display: grid;
-  min-height: 72px;
-  place-content: center;
   gap: 6px;
-  padding: 12px;
-  border: 1px dashed rgba(98, 181, 255, 0.2);
-  border-radius: 7px;
-  color: rgba(190, 230, 230, 0.5);
-  text-align: center;
-  font: 8px/1.45 var(--font-mono);
-  letter-spacing: 0.1em;
+  padding: 2px 2px 4px;
+  color: rgba(214, 236, 255, 0.72);
+  font: 10px/1.6 var(--font-mono);
+  letter-spacing: 0.02em;
 }
 .context-mode-standby strong {
-  color: #8fcfff;
-  font-size: 9px;
-  letter-spacing: 0.16em;
+  color: var(--text-primary);
+  font-size: 10px;
+  font-weight: 600;
+  letter-spacing: 0.08em;
 }
 .context-mode-view {
   min-height: 0;
@@ -1344,19 +1189,20 @@
 }
 .global-context-actions .panel-layer-toggle {
   width: 100%;
-  min-height: 30px;
+  min-height: 32px;
   padding: 6px 8px;
-  font-size: 8px;
+  font-size: 10px;
+  letter-spacing: 0.06em;
 }
 #global-context-panel #cockpit-entry {
   position: static;
   z-index: auto;
   width: 100%;
-  min-height: 30px;
+  min-height: 32px;
   padding: 5px 8px;
   border-radius: 5px;
   justify-content: center;
-  font-size: 8px;
+  font-size: 10px;
   box-shadow: none;
 }
 #global-context-panel #cockpit-entry .material-symbols-outlined {

src/ui/styles/mobile-shell.css

@@ -107,7 +107,6 @@ body.mobile-shell #top-center-actions {
 /* ── HUD: one compact readout under the top bar ────────────────────────── */
 body.mobile-shell #intel-hud .hud-edge,
 body.mobile-shell #intel-hud .hud-corner,
-body.mobile-shell #intel-hud .hud-top-bar,
 body.mobile-shell #intel-hud .hud-bottom-bar {
   display: none;
 }

src/ui/styles/overlays.css

@@ -124,7 +124,6 @@
   line-height: 1.6;
 }
 
-.hud-top-bar,
 .hud-bottom-bar {
   display: none;
   position: absolute;
@@ -141,24 +140,11 @@
   pointer-events: none;
 }
 
-.hud-top-bar {
-  top: 70px;
-}
-
 .hud-bottom-bar {
   bottom: 110px;
   justify-content: center;
 }
 
-.hud-top-bar-center {
-  opacity: 0.84;
-}
-
-.hud-top-bar-left,
-.hud-top-bar-right {
-  opacity: 0.6;
-}
-
 /* Corner blocks */
 .hud-corner {
   position: absolute;
@@ -298,54 +284,15 @@
   gap: 20px;
 }
 
-#intel-hud[data-variant='tactical'] .hud-top-bar,
 #intel-hud[data-variant='tactical'] .hud-bottom-bar {
   display: none;
 }
 
-#intel-hud[data-variant='operator'] .hud-top-bar,
-#intel-hud[data-variant='operator'] .hud-bottom-bar {
-  display: flex;
-}
-
-#intel-hud[data-variant='operator'] .hud-top-bar {
-  top: max(10vh, 90px);
-  left: 50%;
-  right: auto;
-  width: min(52vw, 720px);
-  transform: translateX(-50%);
-  border-color: rgba(255, 255, 255, 0.24);
-  background: linear-gradient(90deg, rgba(0, 0, 0, 0.56), rgba(8, 26, 34, 0.5));
-  box-shadow: 0 0 24px rgba(0, 255, 255, 0.08);
-}
-
 #intel-hud[data-variant='tactical'] .hud-top-left,
-#intel-hud[data-variant='tactical'] .hud-top-right,
-#intel-hud[data-variant='operator'] .hud-top-left,
-#intel-hud[data-variant='operator'] .hud-top-right {
+#intel-hud[data-variant='tactical'] .hud-top-right {
   top: max(14vh, 136px);
 }
 
-#intel-hud[data-variant='operator'] .hud-bottom-bar {
-  border-color: rgba(255, 255, 255, 0.2);
-  background: linear-gradient(
-    90deg,
-    rgba(0, 0, 0, 0.52),
-    rgba(8, 22, 18, 0.52)
-  );
-}
-
-#intel-hud[data-variant='operator'] .hud-corner {
-  padding: 8px 10px;
-  border: 1px solid rgba(255, 255, 255, 0.16);
-  border-radius: 8px;
-  background: rgba(0, 0, 0, 0.36);
-}
-
-#intel-hud[data-variant='operator'] .hud-bracket {
-  display: none;
-}
-
 #intel-hud[data-variant='minimal'] .hud-top-right,
 #intel-hud[data-variant='minimal'] .hud-bottom-right,
 #intel-hud[data-variant='minimal'] .hud-left-edge,
@@ -378,11 +325,7 @@
 }
 
 :root[data-scope-mask='off']
-  #intel-hud:is(
-    [data-variant='minimal'],
-    [data-variant='operator'],
-    [data-variant='tactical']
-  )
+  #intel-hud:is([data-variant='minimal'], [data-variant='tactical'])
   .hud-readout,
 :root[data-scope-mask='off']:not([data-ui-theme='cyber']) .scene-text-holdout {
   background: rgba(0, 0, 0, 0.7);
@@ -399,11 +342,7 @@
 }
 
 :root[data-scope-mask='off']
-  #intel-hud:is(
-    [data-variant='minimal'],
-    [data-variant='operator'],
-    [data-variant='tactical']
-  )
+  #intel-hud:is([data-variant='minimal'], [data-variant='tactical'])
   .hud-readout {
   display: block;
   width: max-content;
@@ -413,11 +352,7 @@
 }
 
 :root[data-scope-mask='off']
-  #intel-hud:is(
-    [data-variant='minimal'],
-    [data-variant='operator'],
-    [data-variant='tactical']
-  )
+  #intel-hud:is([data-variant='minimal'], [data-variant='tactical'])
   :is(.hud-top-right, .hud-bottom-right)
   .hud-readout,
 :root[data-scope-mask='off']:not([data-ui-theme='cyber'])
@@ -427,38 +362,35 @@
 }
 
 /* Preserve glyph opacity without dimming the vertical backplates. */
-:root[data-scope-mask='off']
-  #intel-hud:is([data-variant='operator'], [data-variant='tactical'])
-  .hud-edge {
+:root[data-scope-mask='off'] #intel-hud[data-variant='tactical'] .hud-edge {
   opacity: 1;
 }
 
 :root[data-scope-mask='off']
-  #intel-hud:is([data-variant='operator'], [data-variant='tactical'])
+  #intel-hud[data-variant='tactical']
   .hud-edge
   .hud-readout
   > * {
   opacity: 0.5;
 }
 
-:root[data-scope-mask='off'] #intel-hud[data-variant='operator'] .hud-corner,
 :root[data-scope-mask='off']
-  #intel-hud:is([data-variant='minimal'], [data-variant='operator'])
-  :is(.hud-top-bar, .hud-bottom-bar) {
+  #intel-hud[data-variant='minimal']
+  .hud-bottom-bar {
   background: transparent;
 }
 
 :root[data-scope-mask='off']
-  #intel-hud:is([data-variant='minimal'], [data-variant='operator'])
-  :is(.hud-top-bar, .hud-bottom-bar) {
+  #intel-hud[data-variant='minimal']
+  .hud-bottom-bar {
   width: fit-content;
   max-width: calc(100vw - 120px);
   gap: 24px;
 }
 
 :root[data-scope-mask='off']
-  #intel-hud:is([data-variant='minimal'], [data-variant='operator'])
-  :is(.hud-top-bar, .hud-bottom-bar)
+  #intel-hud[data-variant='minimal']
+  .hud-bottom-bar
   .hud-readout {
   overflow: hidden;
   white-space: nowrap;

src/ui/styles/radio.css

@@ -461,14 +461,16 @@ html:not([lang='en']) .radio-transport button {
   border-top: 1px solid rgba(98, 181, 255, 0.16);
 }
 .military-awareness-standby strong {
-  color: #79c2ff;
+  color: var(--text-primary);
   font-size: 10px;
-  letter-spacing: 0.1em;
+  font-weight: 600;
+  letter-spacing: 0.08em;
 }
 .military-awareness-standby span {
-  color: #8192a6;
-  font-size: 9px;
-  letter-spacing: 0.05em;
+  color: rgba(214, 236, 255, 0.72);
+  font-size: 10px;
+  line-height: 1.5;
+  letter-spacing: 0.02em;
 }
 .military-awareness-standby button {
   justify-self: start;
@@ -688,6 +690,12 @@ html:not([lang='en']) .data-count {
   text-wrap: balance;
 }
 
+/* The status column keeps its width, so a wide chip (WIRD AKTIVIERT) never
+   overlaps the name; the name wraps in the room left beside it. */
+html:not([lang='en']) .data-toggle-right {
+  flex: none;
+}
+
 /* Row text pieces that must not break inside: a hyphenated code (ADS-B) and
    the space before a " · " separator (see setRowText in layerPanel.js). */
 html:not([lang='en']) .data-keep {

src/ui/styles/responsive.css

@@ -98,25 +98,12 @@
     display: none;
   }
 
-  .hud-top-bar,
   .hud-bottom-bar {
     width: calc(100vw - 24px);
     left: 12px;
     transform: none;
   }
 
-  .hud-top-bar {
-    top: 54px;
-    font-size: 9px;
-  }
-
-  #intel-hud[data-variant='operator'] .hud-top-bar {
-    left: 12px;
-    right: auto;
-    width: calc(100vw - 24px);
-    transform: none;
-  }
-
   .hud-bottom-bar {
     bottom: 90px;
     font-size: 9px;
@@ -205,7 +192,7 @@
      under the expanded panel plus a vertical scrollbar that scrolls nothing
      but glow. Pin the glow to the panel box here — its blur is ink overflow,
      which never scrolls — instead of clipping the rail, which would also clip
-     legitimate content such as the Context radio popover. */
+     legitimate content that extends past a panel's edge. */
   #left-panel-stack .panel-glow,
   #right-context-rail .panel-glow {
     inset: 0;
@@ -228,10 +215,6 @@
   #right-context-rail #global-context-panel.collapsed {
     width: 100%;
   }
-  .context-radio-mini {
-    right: -38px;
-    width: min(244px, calc(100vw - 32px));
-  }
 
   #left-panel-stack > #data-panel,
   #left-panel-stack > #cctv-panel,