fix: consolidate WireGuard port config and propagate port changes to UI

- docker-compose: fix WireGuard port mapping to ${WG_PORT}:${WG_PORT} so
  the daemon ListenPort matches the Docker host-to-container binding
- app.py: sync wireguard.port ↔ identity.wireguard_port in both directions
  so changing either keeps them consistent; identity path now also updates
  wg0.conf via wireguard_manager.update_config
- Settings.jsx: remove duplicate wireguard_port from Cell Identity section
  (port is configurable under WireGuard VPN service config); add
  refreshConfig() after saveService so other pages see new values immediately
- WireGuard.jsx: import useConfig() and use service_configs.wireguard.port
  as the reactive port source for endpoint display and port-open warnings

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

webui/src/pages/Settings.jsx

@@ -287,7 +287,7 @@ function Settings() {
   const { refresh: refreshConfig } = useConfig();
 
   // identity
-  const [identity, setIdentity] = useState({ cell_name: '', domain: '', ip_range: '', wireguard_port: 51820 });
+  const [identity, setIdentity] = useState({ cell_name: '', domain: '', ip_range: '' });
   const [identityDirty, setIdentityDirty] = useState(false);
   const [identitySaving, setIdentitySaving] = useState(false);
 
@@ -315,7 +315,6 @@ function Settings() {
         cell_name: cfg.cell_name || '',
         domain: cfg.domain || '',
         ip_range: cfg.ip_range || '',
-        wireguard_port: cfg.wireguard_port || 51820,
       });
       setServiceConfigs(cfg.service_configs || {});
       setBackups(bkRes.data || []);
@@ -360,6 +359,7 @@ function Settings() {
       const res = await cellAPI.updateConfig({ [key]: serviceConfigs[key] });
       setServiceDirty((d) => ({ ...d, [key]: false }));
       _applyResult(res, key);
+      refreshConfig();
     } catch {
       toast(`Failed to save ${key} config`, 'error');
     } finally {
@@ -482,13 +482,6 @@ function Settings() {
               placeholder="172.20.0.0/16"
             />
           </Field>
-          <Field label="WireGuard Port">
-            <NumberInput
-              value={identity.wireguard_port}
-              onChange={(v) => { setIdentity((i) => ({ ...i, wireguard_port: v })); setIdentityDirty(true); }}
-              min={1} max={65535}
-            />
-          </Field>
         </div>
         <div className="flex justify-end mt-4">
           <button