diff --git a/src/trx-client/trx-frontend/trx-frontend-http/assets/web/app.js b/src/trx-client/trx-frontend/trx-frontend-http/assets/web/app.js
index de26d45..47ae486 100644
--- a/src/trx-client/trx-frontend/trx-frontend-http/assets/web/app.js
+++ b/src/trx-client/trx-frontend/trx-frontend-http/assets/web/app.js
@@ -1762,14 +1762,19 @@ function tunedFrequencyForCenterCoverage(centerHz, freqHz = lastFreqHz, bandwidt
   return alignFreqToRigStep(Math.round(clampedHz));
 }
 
+// Optimistic center freq: updated immediately on each arrow click so that
+// rapid clicks accumulate rather than all starting from the same stale frame.
+let spectrumCenterPendingHz = null;
+
 async function shiftSpectrumCenter(direction) {
   if (!lastSpectrumData || !Number.isFinite(direction) || direction === 0) return;
   const sampleRate = effectiveSpectrumCoverageSpanHz(lastSpectrumData.sample_rate);
-  const currentCenterHz = Number(lastSpectrumData.center_hz);
+  const currentCenterHz = spectrumCenterPendingHz ?? Number(lastSpectrumData.center_hz);
   if (!Number.isFinite(sampleRate) || sampleRate <= 0 || !Number.isFinite(currentCenterHz)) return;
 
   const stepHz = Math.max(50_000, Math.round(sampleRate * 0.35));
   const nextCenterHz = alignFreqToRigStep(Math.round(currentCenterHz + direction * stepHz));
+  spectrumCenterPendingHz = nextCenterHz;
   showHint("Shifting spectrum…", 900);
   await postPath(`/set_center_freq?hz=${nextCenterHz}`);
   if (centerFreqEl && !centerFreqDirty) {
@@ -6517,6 +6522,10 @@ function startSpectrumStreaming() {
       const rds = lastSpectrumData?.rds;
       lastSpectrumData = { bins, center_hz: centerHz, sample_rate: sampleRate, rds };
       window.lastSpectrumData = lastSpectrumData;
+      // Server confirmed a new center — clear optimistic pending value.
+      if (spectrumCenterPendingHz !== null && Math.abs(centerHz - spectrumCenterPendingHz) < 1000) {
+        spectrumCenterPendingHz = null;
+      }
       lastSpectrumRenderData = buildSpectrumRenderData(lastSpectrumData);
       settlePendingSpectrumFrameWaiters(lastSpectrumData);
       pushSpectrumPeakHoldFrame(lastSpectrumRenderData);
diff --git a/src/trx-client/trx-frontend/trx-frontend-http/assets/web/style.css b/src/trx-client/trx-frontend/trx-frontend-http/assets/web/style.css
index d6952d5..916699a 100644
--- a/src/trx-client/trx-frontend/trx-frontend-http/assets/web/style.css
+++ b/src/trx-client/trx-frontend/trx-frontend-http/assets/web/style.css
@@ -2049,16 +2049,8 @@ button:focus-visible, input:focus-visible, select:focus-visible {
     width: 1.5rem;
     height: 2.35rem;
   }
-  .spectrum-bookmark-side {
-    width: 5.85rem;
-    gap: 0.22rem;
-  }
-  .spectrum-bookmark-side-left {
-    left: -7.85rem;
-  }
-  .spectrum-bookmark-side-right {
-    right: -7.85rem;
-  }
+  /* Bookmark side panels need too much horizontal space on narrow screens */
+  .spectrum-bookmark-side { display: none !important; }
   .spectrum-bookmark-side .spectrum-bookmark-chip {
     font-size: 0.58rem;
     padding: 2px 6px;
@@ -2281,7 +2273,7 @@ button:focus-visible, input:focus-visible, select:focus-visible {
 }
 .spectrum-edge-shift {
   position: absolute;
-  top: calc((var(--spectrum-plot-height) - var(--overview-plot-height)) / 2);
+  top: calc(var(--spectrum-plot-height) / 2);
   transform: translateY(-50%);
   z-index: 8;
   width: 1.7rem;
@@ -2410,7 +2402,7 @@ button:focus-visible, input:focus-visible, select:focus-visible {
 }
 .spectrum-bookmark-side {
   position: absolute;
-  top: calc((var(--spectrum-plot-height) - var(--overview-plot-height)) / 2);
+  top: calc(var(--spectrum-plot-height) / 2);
   transform: translateY(-50%);
   z-index: 7;
   width: 7.25rem;