/* Center the visible perspective buttons independently of adjacent actions. */
body #controlbar.controlbar {
  display: flex;
  align-items: stretch;
  justify-content: center;
  gap: 6px !important;
  top: calc(max(12px, env(safe-area-inset-top)) + 52px) !important;
  left: 50% !important;
  right: auto !important;
  width: max-content !important;
  max-width: calc(100% - 24px) !important;
  transform: translateX(-50%) !important;
}

body #controlbar.controlbar [data-control-mode] {
  flex: 0 0 auto;
  width: 100px !important;
  min-width: 0 !important;
  white-space: nowrap;
}

body #controlbar.controlbar .move-speed-control {
  position: absolute;
  top: 0;
  bottom: 0;
  left: calc(100% + 6px);
}

body #controlbar.controlbar .control-trade-entry {
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
}

body[data-device="mobile"] #controlbar.controlbar,
body[data-forced-landscape="true"] #controlbar.controlbar {
  gap: 4px !important;
}

body[data-device="mobile"] #controlbar.controlbar [data-control-mode],
body[data-forced-landscape="true"] #controlbar.controlbar [data-control-mode] {
  width: 56px !important;
  padding: 0 4px !important;
}

body[data-device="mobile"] #controlbar.controlbar .move-speed-control,
body[data-forced-landscape="true"] #controlbar.controlbar .move-speed-control {
  left: calc(100% + 4px);
  width: 68px !important;
}
#mobilePad[data-mode="thirdPerson"][data-jump-disabled="true"] #jumpButton {
  display: none !important;
}