G1000: two-way sim sync, more PFD/MFD fidelity, authentic dialogs

Sync (FlyWithLua companions in plugins/ + server/fmssync.js):
- FMS flight-plan two-way sync (App <-> in-sim FMS) via fms-sync.lua
- G1000 UI-state publish (page/range/inset) via ui-sync.lua + CDI source,
  baro, map-range follow
- Terrain awareness: elevation grid probe (terrain-probe.lua) -> red/yellow
  MFD overlay vs aircraft altitude

PFD:
- AFCS mode annunciation bar from autopilot _status datarefs
- CDI source GPS/VLOC colouring, BRG1/BRG2 pointers + DME windows, marker beacons
- magenta speed/altitude trend vectors, selected-altitude alerting
- time-based (frame-rate-independent) smoothing for attitude/heading/tapes

MFD:
- nav data bar (DTK/ETE/active leg), airways overlay from earth_awy.dat,
  compass rose anchored to the ownship

Dialogs (NEAREST/FLIGHTPLAN/DIRECT-TO/PROCEDURES):
- flat, square, embedded G1000 look (no shadow/rounded/transparency)
- compact lower-right placement, no close X (softkey toggles), single window
- NEAREST 2-line entries (ILS/VFR, COM freq, runway length), PROC action menu

Service worker: network-first HTML so reloads pick up new builds (cache v2).

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

web/src/components/DirectTo.jsx

@@ -49,11 +49,10 @@ export default function DirectTo({ xp, onClose }) {
   };
 
   return (
-    <div className="dlg-backdrop" onClick={onClose}>
+    <div className="gwin-backdrop" onClick={onClose}>
       <div className="dlg dto" onClick={(e) => e.stopPropagation()}>
-        <div className="dlg-head"><span className="dto-arrow">D→</span> DIRECT TO</div>
+        <div className="dlg-head">DIRECT TO</div>
         <div className="dto-body">
-          <label className="dto-lbl">WAYPOINT</label>
           <input
             ref={inputRef}
             className="dto-input"
@@ -74,11 +73,16 @@ export default function DirectTo({ xp, onClose }) {
             </div>
           )}
           {sel && (
-            <div className="dto-sel">
-              <span className="dto-id">{sel.id}</span>
-              <span className="dto-type">{sel.type}</span>
-              {preview && <span className="dto-vec">{String(Math.round(preview.brg)).padStart(3, '0')}° · {preview.dist.toFixed(1)} NM</span>}
-            </div>
+            <>
+              <div className="dto-tgt"><span className="dto-id">{sel.id}</span><span className="dto-type">{sel.type}</span></div>
+              <div className="dto-grid">
+                <b>ALT</b><span>_____FT</span><b>OFFSET</b><span>+0NM</span>
+                <b>BRG</b><span>{preview ? `${String(Math.round(preview.brg)).padStart(3, '0')}°` : '___°'}</span>
+                <b>DIS</b><span>{preview ? `${preview.dist.toFixed(1)}NM` : '__._NM'}</span>
+                <b>CRS</b><span>{preview ? `${String(Math.round(preview.brg)).padStart(3, '0')}°` : '___°'}</span>
+                <span /><span />
+              </div>
+            </>
           )}
         </div>
         <div className="dlg-actions">