diff --git a/EXE/Freelancer.exe b/EXE/Freelancer.exe
index 754b0ed8..c2086647 100755
Binary files a/EXE/Freelancer.exe and b/EXE/Freelancer.exe differ
diff --git a/EXE/remui/base.rml b/EXE/remui/base.rml
index 8f81c341..34badd71 100644
--- a/EXE/remui/base.rml
+++ b/EXE/remui/base.rml
@@ -115,7 +115,19 @@
         .chips { display: flex; flex-direction: row; flex-wrap: wrap; margin-bottom: 8dp; }
         .chips .chip { margin: 0 6dp 6dp 0; }
         .chips .chip.on { color: #f2b13c; border-color: #f2b13c; }
-    </style>
+        /* BUILD: the system map the planned site is placed on (the nav map's look: 8 x 8 cells, north on top) */
+        .sitemap { position: relative; width: 380dp; height: 380dp; margin: 6dp 0; background-color: #05080d; border: 1dp #5cc8f040; overflow: hidden; cursor: crosshair; }
+        .sitemap .dot { position: absolute; width: 0; height: 0; pointer-events: none; }
+        .sitemap .dot .s { position: absolute; left: -3dp; top: -3dp; width: 6dp; height: 6dp; border-radius: 3dp; background-color: #8197ad; }
+        .sitemap .dot .l { position: absolute; left: 8dp; top: -7dp; white-space: nowrap; font-size: 11dp; color: #8197ad; }
+        .sitemap .sun .s { left: -8dp; top: -8dp; width: 16dp; height: 16dp; border-radius: 8dp; background-color: #f2c94c; }
+        .sitemap .planet .s { left: -6dp; top: -6dp; width: 12dp; height: 12dp; border-radius: 6dp; background-color: #3d79b8; }
+        .sitemap .station .s { left: -5dp; top: -5dp; width: 10dp; height: 10dp; border-radius: 0; background-color: #5cc8f0; }
+        .sitemap .hole .s { left: -6dp; top: -6dp; width: 10dp; height: 10dp; border: 2dp #ef6a5b; background-color: transparent; }
+        .sitemap .mine .s { left: -4dp; top: -4dp; width: 8dp; height: 8dp; border-radius: 0; background-color: #7cf27c; }
+        .sitemap .site .s { left: -4dp; top: -4dp; width: 8dp; height: 8dp; border-radius: 0; border: 1dp #7cf27c; background-color: transparent; }
+        .sitemap .mark { position: absolute; width: 0; height: 0; pointer-events: none; }
+        .sitemap .mark .m { position: absolute; left: -9dp; top: -9dp; width: 14dp; height: 14dp; border: 2dp #f2b13c; background-color: #f2b13c40; }
 </head>
 <body class="window">
     <div class="win-head" data-model="base">
@@ -365,11 +377,17 @@
                         </div>
                         <div class="hint sys-info">{{ type_info }}</div>
                         <div data-if="sys_mine">
-                            <div class="amount"><span class="label">Distance</span><input class="range" type="range" min="50" max="2000" step="50" data-value="dist"/><span class="v">{{ dist_text }}</span></div>
+                            <!-- the system map (a nav map clone): click where the site shall stand, drag to move it -->
+                            <div id="sitemap" class="sitemap">
+                                <div class="dot" data-for="d : site_dots" data-class-sun="d.cls == 'sun'" data-class-planet="d.cls == 'planet'" data-class-station="d.cls == 'station'"
+                                     data-class-hole="d.cls == 'hole' || d.cls == 'gate'" data-class-mine="d.cls == 'mine'" data-class-site="d.cls == 'site'"
+                                     data-style-left="d.left" data-style-top="d.top"><div class="s"></div><span class="l" data-if="d.label != ''">{{ d.label }}</span></div>
+                                <div class="mark" data-if="mark_set" data-style-left="mark_left" data-style-top="mark_top"><div class="m" data-style-transform="mark_rot"></div></div>
+                            </div>
+                            <div class="hint">{{ mark_set ? 'Planned at ' + mark_text + ' - drag to move it.' : 'Click the map where the site shall stand.' }}</div>
                             <div class="amount"><span class="label">Turn</span><input class="range" type="range" min="0" max="345" step="15" data-value="turn"/><span class="v">{{ turn_text }}</span></div>
                             <div class="actions">
-                                <div class="btn" data-class-primary="show_site" data-action="show-site">{{ show_site ? 'Hide planned site' : 'Show site' }}<div class="tip">Shows the planned site as a ghost ahead of your ship; the sliders move it.</div></div>
-                                <div class="btn primary" data-action="site">{{ site_text }}<div class="tip">Builds a construction site of the picked type where the planned site is. Deliver its wares under Objects.</div></div>
+                                <div class="btn primary" data-class-disabled="!mark_set" data-action="site">{{ site_text }}<div class="tip">Builds a construction site of the picked type where it is planned on the map. Deliver its wares in space (target it, trade) or fund it - traders bring them.</div></div>
                             </div>
                         </div>
                         <div class="hint" data-if="!sys_mine &amp;&amp; sys_in">Claim the system to build here.</div>
diff --git a/EXE/remui/sitetrade.rml b/EXE/remui/sitetrade.rml
new file mode 100644
index 00000000..212f7577
--- /dev/null
+++ b/EXE/remui/sitetrade.rml
@@ -0,0 +1,89 @@
+<rml>
+<head>
+    <title>Construction site</title>
+    <link type="text/rcss" href="rem.rcss"/>
+    <style>
+        .cols { flex: 1; display: flex; flex-direction: row; min-height: 0; }
+        .col { flex: 1; display: flex; flex-direction: column; min-width: 0; min-height: 0; margin-right: 14dp; }
+        .col.last { margin-right: 0; }
+        .col h3 { margin-bottom: 6dp; }
+        .sub { font-size: 12dp; margin-bottom: 6dp; color: #8197ad; }
+        .lst { flex: 1; overflow-y: auto; background-color: #5cc8f008; }
+        .it { display: flex; flex-direction: row; align-items: center; padding: 6dp 10dp; border-bottom: 1dp #ffffff08; border-left: 2dp #00000000; }
+        .it:hover { background-color: #122033; }
+        .it.picked { border-left-color: #f2b13c; background-color: #f2b13c1a; }
+        .it.dim { color: #8197ad; }
+        .it .n { flex: 1; min-width: 0; font-size: 14dp; }
+        .it .c { font-family: "IBM Plex Mono"; font-size: 12dp; color: #f2b13c; margin-left: 8dp; }
+        .it .o { font-family: "IBM Plex Mono"; font-size: 11dp; color: #5cc8f0; margin-left: 8dp; }
+        .bar { height: 6dp; background-color: #ffffff10; margin: 4dp 0 10dp 0; }
+        .bar .fill { height: 6dp; background-color: #f2b13c; }
+        .move { margin-top: 12dp; padding: 12dp; display: flex; flex-direction: row; align-items: center; border-left: 3dp #f2b13c; background-color: #5cc8f010; }
+        .move .t { flex: 1; min-width: 0; }
+        .move .t .n { font-family: "Saira SemiCondensed"; font-weight: 600; font-size: 17dp; }
+        .move .t .a { font-family: "IBM Plex Mono"; color: #f2b13c; margin-top: 2dp; }
+        .move .range { width: 220dp; margin: 0 10dp; }
+        .move .btn { margin: 0 0 0 6dp; }
+        .fund { margin-top: 12dp; padding: 12dp; display: flex; flex-direction: row; align-items: center; border-left: 3dp #5cc8f0; background-color: #5cc8f010; }
+        .fund .t { flex: 1; min-width: 0; }
+        .fund .t .n { font-family: "Saira SemiCondensed"; font-weight: 600; font-size: 15dp; }
+        .fund .t .a { font-size: 12dp; color: #8197ad; margin-top: 2dp; }
+        .fund .btn { margin: 0 0 0 6dp; }
+        .foot2 { display: flex; flex-direction: row; align-items: center; margin-top: 12dp; }
+        .foot2 .hint { flex: 1; }
+        .foot2 .btn { margin: 0 0 0 8dp; }
+    </style>
+</head>
+<body class="window" data-model="sitetrade">
+    <div class="win-head">
+        <img class="head-ico" src="3db:INTERFACE/REM/IMAGES/icon_cargo.3db"/>
+        <span class="title">CONSTRUCTION SITE</span><span class="sl">\\\</span>
+        <span class="spacer"></span>
+        <span class="close" data-action="close">&#215;</span>
+    </div>
+    <div class="win-main">
+        <div class="content" style="display: flex; flex-direction: column;">
+            <div class="t" style="font-family: 'Saira SemiCondensed'; font-weight: 600; font-size: 18dp;">{{ title }}</div>
+            <div class="hint">{{ line }}</div>
+            <div class="bar"><div class="fill" data-style-width="progress + '%'"></div></div>
+            <div class="cols">
+                <div class="col">
+                    <h3>Your cargo</h3>
+                    <div class="sub">Click a ware the site needs</div>
+                    <div class="lst">
+                        <div class="hint" style="padding: 10dp;" data-if="hold.size == 0">Your hold is empty.</div>
+                        <div class="it" data-for="i : hold" data-class-picked="i.selected" data-class-dim="!i.useful" data-action="pick" data-attr-data-arg="i.key">
+                            <span class="n">{{ i.name }}</span><span class="c">{{ i.hold }}</span>
+                        </div>
+                    </div>
+                </div>
+                <div class="col last">
+                    <h3>The site needs</h3>
+                    <div class="sub">Delivered / needed - ordered from the traders</div>
+                    <div class="lst">
+                        <div class="hint" style="padding: 10dp;" data-if="needs.size == 0">Nothing - all wares are in.</div>
+                        <div class="it" data-for="i : needs" data-class-picked="i.selected" data-class-dim="!i.useful" data-action="pick" data-attr-data-arg="i.key">
+                            <span class="n">{{ i.name }}</span><span class="c">{{ i.need }}</span><span class="o" data-if="i.ordered != ''">{{ i.ordered }}</span>
+                        </div>
+                    </div>
+                </div>
+            </div>
+            <div class="move" data-if="can_deliver">
+                <div class="t"><div class="n">{{ pick_name }}</div><div class="a">{{ qty_text }}</div></div>
+                <input class="range" type="range" min="1" step="1" data-attr-max="qty_max" data-value="qty"/>
+                <div class="btn" data-action="all">Max</div>
+                <div class="btn primary" data-action="deliver">Deliver<div class="tip">Hands the amount from your hold to the site.</div></div>
+            </div>
+            <div class="fund" data-if="owner">
+                <div class="t"><div class="n">{{ fund_title }}</div><div class="a">{{ fund_line }}</div></div>
+                <div class="btn" data-if="funded" data-action="unfund">Take orders back<div class="tip">Withdraws the site's buy orders - the escrow goes back to your bank.</div></div>
+                <div class="btn primary" data-if="can_fund" data-action="fund">{{ fund_button }}<div class="tip">Places buy orders on the Galactic Market for what the site still lacks; the price is paid from your bank as escrow. Trader pilots fly the wares in.</div></div>
+            </div>
+            <div class="foot2">
+                <span class="hint">{{ status }}</span>
+                <div class="btn" data-action="close">Close</div>
+            </div>
+        </div>
+    </div>
+</body>
+</rml>