moving a LOT of stuff around in web ui

webui/src/components/MobileControls/AuxColumn.jsx

@@ -2,6 +2,7 @@
 // Purpose: Assembles the mobile auxiliary controls column, which is the left column by default.
 // Scope: Owns mobile aux/camera/headlight/laser/horn wiring while reusing desktop variation components where intended.
 import { useCallback, useRef } from 'react';
+import './mobileControls.css';
 import { useControlActions, useControlSelector } from '../../controls/index.js';
 import { useManualDockAssist } from '../../features/manualDockAssist/useManualDockAssist.js';
 import HornControl from '../HornControl/index.jsx';

webui/src/components/MobileControls/ControlPadPanel.jsx

@@ -2,6 +2,7 @@
 // Purpose: Provides the mobile movement control pad and speed mode selector.
 // Scope: Converts touch pad cells into keyboard-style drive vectors; movement column owns drive/dock placement.
 import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
+import './mobileControls.css';
 import { useControlActions, useControlSelector } from '../../controls/index.js';
 import { normalizeKeymapEntries } from '../../controls/keymapUtils.js';
 import {

webui/src/components/MobileControls/mobileControls.css

@@ -0,0 +1,8 @@
+  .no-touch-select { user-select: none; -webkit-user-select: none; -ms-user-select: none; -webkit-touch-callout: none; }
+  .mobile-touch-control {
+    /* Suppress browser gestures that compete with deliberate control presses. */
+    user-select: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none;
+    -webkit-touch-callout: none; -webkit-tap-highlight-color: transparent;
+    touch-action: manipulation; overscroll-behavior: contain;
+  }
+  .mobile-drag-control { touch-action: none; }