diff --git a/package-lock.json b/package-lock.json
index 31a3d8b4..b120a6ca 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -13,6 +13,7 @@
         "axios": "^1.6.2",
         "compression": "^1.7.4",
         "cors": "^2.8.5",
+        "dayjs": "^1.11.20",
         "dotenv": "^16.3.1",
         "express": "^4.21.2",
         "express-rate-limit": "^7.5.0",
@@ -3901,6 +3902,12 @@
         "node": ">=18"
       }
     },
+    "node_modules/dayjs": {
+      "version": "1.11.20",
+      "resolved": "https://registry.npmjs.org/dayjs/-/dayjs-1.11.20.tgz",
+      "integrity": "sha512-YbwwqR/uYpeoP4pu043q+LTDLFBLApUP6VxRihdfNTqu4ubqMlGDLd6ErXhEgsyvY0K6nCs7nggYumAN+9uEuQ==",
+      "license": "MIT"
+    },
     "node_modules/debug": {
       "version": "4.4.3",
       "resolved": "https://registry.npmjs.org/debug/-/debug-4.4.3.tgz",
diff --git a/package.json b/package.json
index fd230181..777d7f44 100644
--- a/package.json
+++ b/package.json
@@ -25,6 +25,7 @@
     "axios": "^1.6.2",
     "compression": "^1.7.4",
     "cors": "^2.8.5",
+    "dayjs": "^1.11.20",
     "dotenv": "^16.3.1",
     "express": "^4.21.2",
     "express-rate-limit": "^7.5.0",
diff --git a/src/App.jsx b/src/App.jsx
index 6e23e5f3..07bd54f3 100644
--- a/src/App.jsx
+++ b/src/App.jsx
@@ -320,7 +320,7 @@ const App = () => {
 
   const propagation = usePropagation(config.location, dxLocation, config.propagation);
   const mySpots = useMySpots(config.callsign);
-  const satellites = useSatellites(config.location);
+  const satellites = useSatellites(config.location, config.satellite);
   const localWeather = useWeather(config.location, config.allUnits);
   const dxWeather = useWeather(dxLocation, config.allUnits);
   const localAlerts = useWeatherAlerts(config.location);
diff --git a/src/components/SettingsPanel.jsx b/src/components/SettingsPanel.jsx
index ef63adb3..34b58588 100644
--- a/src/components/SettingsPanel.jsx
+++ b/src/components/SettingsPanel.jsx
@@ -49,6 +49,8 @@ export const SettingsPanel = ({
   const [gridSquare, setGridSquare] = useState(config?.locator || '');
   const [lat, setLat] = useState(config?.location?.lat ?? 0);
   const [lon, setLon] = useState(config?.location?.lon ?? 0);
+  const [stationAlt, setStationAlt] = useState(config?.location?.stationAlt ?? 100);
+  const [minElev, setMinElev] = useState(config?.satellite?.minElev ?? 5.0);
   const [layout, setLayout] = useState(config?.layout || 'modern');
   const [mouseZoom, setMouseZoom] = useState(config?.mouseZoom || 50);
   const [timezone, setTimezone] = useState(config?.timezone || '');
@@ -179,6 +181,8 @@ export const SettingsPanel = ({
       setheaderSize(config.headerSize || 1.0);
       setLat(config.location?.lat ?? 0);
       setLon(config.location?.lon ?? 0);
+      setStationAlt(config.location?.stationAlt ?? 100);
+      setMinElev(config.satellite?.minElev ?? 5.0);
       setLayout(config.layout || 'modern');
       setMouseZoom(config.mouseZoom || 50);
       setTimezone(config.timezone || '');
@@ -419,7 +423,8 @@ export const SettingsPanel = ({
       headerSize: headerSize,
       swapHeaderClocks,
       showMutualReception,
-      location: { lat: parseFloat(lat), lon: parseFloat(lon) },
+      location: { lat: parseFloat(lat) || 0, lon: parseFloat(lon) || 0, stationAlt: parseInt(stationAlt) || 100 },
+      satellite: { minElev: parseFloat(minElev) || 5.0 },
       theme,
       customTheme,
       layout,
@@ -3360,6 +3365,75 @@ export const SettingsPanel = ({
                             Footprints
                           </label>
                         </div>
+
+                        {/* station altitude and minimum elevation inputs */}
+                        <div
+                          style={{ display: 'grid', gridTemplateColumns: '1fr 1fr', gap: '12px', marginBottom: '12px' }}
+                        >
+                          <div>
+                            <label
+                              style={{
+                                display: 'block',
+                                marginBottom: '6px',
+                                color: 'var(--text-muted)',
+                                fontSize: '11px',
+                                textTransform: 'uppercase',
+                              }}
+                            >
+                              Station Altitude [m]
+                            </label>
+                            <input
+                              type="number"
+                              step="1"
+                              value={isNaN(stationAlt) ? '' : stationAlt}
+                              onChange={(e) => setStationAlt(e.target.valueAsNumber ?? 100)}
+                              style={{
+                                width: '100%',
+                                padding: '10px',
+                                background: 'var(--bg-tertiary)',
+                                border: '1px solid var(--border-color)',
+                                borderRadius: '6px',
+                                color: 'var(--text-primary)',
+                                fontSize: '14px',
+                                fontFamily: 'JetBrains Mono, monospace',
+                                boxSizing: 'border-box',
+                              }}
+                            />
+                          </div>
+                          <div>
+                            <label
+                              style={{
+                                display: 'block',
+                                marginBottom: '6px',
+                                color: 'var(--text-muted)',
+                                fontSize: '11px',
+                                textTransform: 'uppercase',
+                              }}
+                            >
+                              Minimum Elevation [°]
+                            </label>
+                            <input
+                              type="number"
+                              step="0.1"
+                              min="-89.0"
+                              max="89.0"
+                              value={isNaN(minElev) ? '' : minElev}
+                              onChange={(e) => setMinElev(e.target.valueAsNumber ?? 5.0)}
+                              style={{
+                                width: '100%',
+                                padding: '10px',
+                                background: 'var(--bg-tertiary)',
+                                border: '1px solid var(--border-color)',
+                                borderRadius: '6px',
+                                color: 'var(--text-primary)',
+                                fontSize: '14px',
+                                fontFamily: 'JetBrains Mono, monospace',
+                                boxSizing: 'border-box',
+                              }}
+                            />
+                          </div>
+                        </div>
+
                         {/* Lead Time Slider WIP
 						<div style={{ marginTop: '8px' }}>
 						  <label style={{
diff --git a/src/hooks/useSatellites.js b/src/hooks/useSatellites.js
index 778bca7e..d1ad387f 100644
--- a/src/hooks/useSatellites.js
+++ b/src/hooks/useSatellites.js
@@ -11,7 +11,7 @@ function round(value, decimals) {
   return Math.round(value * factor) / factor;
 }
 
-export const useSatellites = (observerLocation) => {
+export const useSatellites = (observerLocation, satelliteConfig) => {
   const [data, setData] = useState([]);
   const [loading, setLoading] = useState(true);
   const [tleData, setTleData] = useState({});
@@ -51,7 +51,7 @@ export const useSatellites = (observerLocation) => {
       const observerGd = {
         longitude: satellite.degreesToRadians(observerLocation.lon),
         latitude: satellite.degreesToRadians(observerLocation.lat),
-        height: 0.1, // km above sea level
+        height: (observerLocation.stationAlt || 100) / 1000, // above sea level [km], stationAlt is [m]), defaults to 100m
       };
 
       Object.entries(tleData).forEach(([name, tle]) => {
@@ -82,10 +82,13 @@ export const useSatellites = (observerLocation) => {
           const elevation = satellite.radiansToDegrees(lookAngles.elevation);
           const rangeSat = lookAngles.rangeSat;
 
-          // Calculate range-rate and doppler factor, only if satellite is above horizon
+          const isVisible = elevation >= satelliteConfig.minElev; // visible only if above minimum elevation
+
+          // Calculate range-rate and doppler factor, only if satellite is visible
           let dopplerFactor = 1;
           let rangeRate = 0;
-          if (elevation > 0) {
+
+          if (isVisible) {
             const observerEcf = satellite.geodeticToEcf(observerGd);
             const velocityEcf = satellite.eciToEcf(velocityEci, gmst);
             dopplerFactor = satellite.dopplerFactor(observerEcf, positionEcf, velocityEcf);
@@ -125,6 +128,8 @@ export const useSatellites = (observerLocation) => {
 
           positions.push({
             name: tle.name || name,
+            tle1: line1,
+            tle2: line2,
             lat,
             lon,
             alt: round(alt, 1),
@@ -134,7 +139,7 @@ export const useSatellites = (observerLocation) => {
             range: round(rangeSat, 1),
             rangeRate: round(rangeRate, 3),
             dopplerFactor: round(dopplerFactor, 9),
-            isVisible: elevation > 0,
+            isVisible, // visible if above minimum elevation
             isPopular: tle.priority <= 2,
             track,
             footprintRadius: Math.round(footprintRadius),
diff --git a/src/plugins/layers/useSatelliteLayer.js b/src/plugins/layers/useSatelliteLayer.js
index 1df58a5a..e6019a96 100644
--- a/src/plugins/layers/useSatelliteLayer.js
+++ b/src/plugins/layers/useSatelliteLayer.js
@@ -1,8 +1,10 @@
 import { useEffect, useRef, useState } from 'react';
 import { useTranslation } from 'react-i18next';
-import * as satellite from 'satellite.js';
 import { addMinimizeToggle } from './addMinimizeToggle.js';
 import { replicatePoint, replicatePath } from '../../utils/geo.js';
+import Orbit from '../../utils/orbit.js';
+import dayjs from 'dayjs';
+import useAppConfig from '../../hooks/app/useAppConfig.js';
 
 export const metadata = {
   id: 'satellites',
@@ -23,6 +25,7 @@ export const metadata = {
 export const useLayer = ({ map, enabled, satellites, setSatellites, opacity, config, allUnits }) => {
   const layerGroupRef = useRef(null);
   const { t } = useTranslation();
+  const { config: globalConfig } = useAppConfig();
 
   // 1. Multi-select state (Wipes on browser close)
   const [selectedSats, setSelectedSats] = useState(() => {
@@ -52,56 +55,12 @@ export const useLayer = ({ map, enabled, satellites, setSatellites, opacity, con
       const response = await fetch('/api/satellites/tle');
       const data = await response.json();
 
-      const observerGd = {
-        latitude: satellite.degreesToRadians(config?.lat ?? 43.44),
-        longitude: satellite.degreesToRadians(config?.lon ?? -88.63),
-        height: (config?.alt || 260) / 1000,
-      };
-
       const satArray = Object.keys(data).map((name) => {
         const satData = data[name];
-        let isVisible = false;
-        let az = 0,
-          el = 0,
-          range = 0;
-        const leadTrack = [];
-
-        if (satData.line1 && satData.line2) {
-          const satrec = satellite.twoline2satrec(satData.line1, satData.line2);
-          const now = new Date();
-          const positionAndVelocity = satellite.propagate(satrec, now);
-          const gmst = satellite.gstime(now);
-
-          if (positionAndVelocity.position) {
-            const positionEcf = satellite.eciToEcf(positionAndVelocity.position, gmst);
-            const lookAngles = satellite.ecfToLookAngles(observerGd, positionEcf);
-
-            az = lookAngles.azimuth * (180 / Math.PI);
-            el = lookAngles.elevation * (180 / Math.PI);
-            range = lookAngles.rangeSat;
-            isVisible = el > 0;
-          }
-
-          const minutesToPredict = config?.leadTimeMins || 45;
-          for (let i = 0; i <= minutesToPredict; i += 2) {
-            const futureTime = new Date(now.getTime() + i * 60000);
-            const posVel = satellite.propagate(satrec, futureTime);
-            if (posVel.position) {
-              const fGmst = satellite.gstime(futureTime);
-              const geodetic = satellite.eciToGeodetic(posVel.position, fGmst);
-              leadTrack.push([satellite.degreesLat(geodetic.latitude), satellite.degreesLong(geodetic.longitude)]);
-            }
-          }
-        }
 
         return {
           ...satData,
           name,
-          visible: isVisible,
-          azimuth: az,
-          elevation: el,
-          range: range,
-          leadTrack,
         };
       });
 
@@ -177,6 +136,20 @@ export const useLayer = ({ map, enabled, satellites, setSatellites, opacity, con
           });
         }
       };
+
+      // Prevent map from capturing events on the window
+      win.addEventListener('wheel', (e) => {
+        e.stopPropagation();
+      });
+      win.addEventListener('mousedown', (e) => {
+        e.stopPropagation();
+      });
+      win.addEventListener('mousemove', (e) => {
+        e.stopPropagation();
+      });
+      win.addEventListener('mouseup', (e) => {
+        e.stopPropagation();
+      });
     }
 
     win.style.top = `${winPos.top}px`;
@@ -197,7 +170,7 @@ export const useLayer = ({ map, enabled, satellites, setSatellites, opacity, con
         <button class="sat-data-window-minimize"
                 onclick="window.__satWinToggleMinimize()"
                 title="${winMinimized ? 'Expand' : 'Minimize'}"
-                style="background:none; border:none; color:#888; cursor:pointer;
+                style="background:none; border:none; color: #888; cursor:pointer;
                        font-size:10px; line-height:1; padding:2px 4px; margin:0;">
           ${winMinimized ? '▶' : '▼'}
         </button>
@@ -258,38 +231,78 @@ export const useLayer = ({ map, enabled, satellites, setSatellites, opacity, con
           return `
         <div class="sat-card" style="border-bottom: 1px solid #004444; margin-bottom: 10px; padding-bottom: 8px;">
           <div style="display:flex; justify-content:space-between; align-items:center; margin-bottom:4px;">
-            <strong style="color:#ffffff; font-size: 14px;">${sat.name}</strong>
+            <button onclick="openSatellitePredict('${sat.name}', '${sat.tle1}', '${sat.tle2}')"
+                    style="background: #440000; border: 1px solid #ff4444; padding: 3px 3px; border-radius: 3px; cursor: pointer;">
+              <strong style="color:#ffffff; font-size: 14px;">${sat.name}</strong>
+            </button>
             <button onclick="window.toggleSat('${sat.name}')" 
                     style="background:none; border:none; color:#ff4444; cursor:pointer; font-weight:bold; font-size:20px; padding: 0 5px;">✕</button>
           </div>
           <table style="width:100%; font-size:11px; border-collapse: collapse;">
-            <tr><td style="color:#888; padding:2px 0;">${t('station.settings.satellites.latitude')}:</td><td align="right" style="padding:2px 0;">${sat.lat.toFixed(2)}°</td></tr>
-            <tr><td style="color:#888; padding:2px 0;">${t('station.settings.satellites.longitude')}:</td><td align="right" style="padding:2px 0;">${sat.lon.toFixed(2)}°</td></tr>
-            <tr><td style="color:#888; padding:2px 0;">${t('station.settings.satellites.speed')}:</td><td align="right" style="padding:2px 0;">${speedStr}</td></tr>
-            <tr><td style="color:#888; padding:2px 0;">${t('station.settings.satellites.altitude')}:</td><td align="right" style="padding:2px 0;">${altitudeStr}</td></tr>
-            <tr><td style="color:#888; padding:2px 0;">${t('station.settings.satellites.azimuth_elevation')}:</td><td align="right" style="padding:2px 0;">${sat.azimuth}° / ${sat.elevation}°</td></tr>
+
+            <!-- section 1: satellite position and motion -->
+            <table style="background-color: #302115; width:100%; font-size:11px; style="color: #888; padding:2px 0;"">
+            <tr>
+              <td>${t('station.settings.satellites.latitude')}:</td>
+              <td align="right" style="padding:2px 0;">${sat.lat.toFixed(2)}°</td>
+            </tr>
+            <tr>
+              <td>${t('station.settings.satellites.longitude')}:</td>
+              <td align="right" style="padding:2px 0;">${sat.lon.toFixed(2)}°</td>
+            </tr>
+            <tr>
+              <td>${t('station.settings.satellites.altitude')}:</td>
+              <td align="right" style="padding:2px 0;">${altitudeStr}</td>
+            </tr>
+            <tr>
+              <td>${t('station.settings.satellites.speed')}:</td>
+              <td align="right" style="padding:2px 0;">${speedStr}</td>
+            </tr>
+            </table>
+
+            <!-- section 2: relative location and visibility -->
+            <table style="width:100%; background-color: ${isVisible ? '#00f800' : '#252e17'}; font-size:11px; color: ${isVisible ? '#000' : '#888'}; padding:2px 0;">
+            <tr><td>${t('station.settings.satellites.azimuth_elevation')}:</td><td align="right">${sat.azimuth}° / ${sat.elevation}°</td></tr>
 
             ${
               isVisible
                 ? `
-              <tr><td style="color:#888; padding:2px 0;">${t('station.settings.satellites.range')}:</td><td align="right" style="padding:2px 0;">${(sat.range * (isMetric ? 1 : km_to_miles_factor)).toFixed(0)} ${distanceUnitsStr}</td></tr>
-              <tr><td style="color:#888; padding:2px 0;">${t('station.settings.satellites.rangeRate')}:</td><td align="right" style="padding:2px 0;">${(sat.rangeRate * (isMetric ? 1 : km_to_miles_factor)).toFixed(2)} ${rangeRateUnitsStr}</td></tr>
-              <tr><td style="color:#888; padding:2px 0;">${t('station.settings.satellites.dopplerFactor')}:</td><td align="right" style="padding:2px 0;">${sat.dopplerFactor.toFixed(7)}</td></tr>
+              <tr>
+                <td>${t('station.settings.satellites.range')}:</td>
+                <td align="right">${(sat.range * (isMetric ? 1 : km_to_miles_factor)).toFixed(0)} ${distanceUnitsStr}</td>
+              </tr>
+              <tr>
+                <td>${t('station.settings.satellites.rangeRate')}:</td>
+                <td align="right">${(sat.rangeRate * (isMetric ? 1 : km_to_miles_factor)).toFixed(2)} ${rangeRateUnitsStr}</td>
+              </tr>
+              <tr>
+                <td>${t('station.settings.satellites.dopplerFactor')}:</td>
+                <td align="right">${sat.dopplerFactor.toFixed(7)}</td>
+              </tr>
             `
                 : ``
             }
 
-            <tr><td style="color:#888; padding:2px 0;">${t('station.settings.satellites.mode')}:</td><td align="right" style="color:#ffa500; padding:2px 0;">${sat.mode || 'N/A'}</td></tr>
-            ${sat.downlink ? `<tr><td style="color:#888; padding:2px 0;">${t('station.settings.satellites.downlink')}:</td><td align="right" style="color:#00ffcc; padding:2px 0;">${sat.downlink}</td></tr>` : ''}
-            ${sat.uplink ? `<tr><td style="color:#888; padding:2px 0;">${t('station.settings.satellites.uplink')}:</td><td align="right" style="color:#ffcc00; padding:2px 0;">${sat.uplink}</td></tr>` : ''}
-            ${sat.tone ? `<tr><td style="color:#888; padding:2px 0;">${t('station.settings.satellites.tone')}:</td><td align="right" style="padding:2px 0;">${sat.tone}</td></tr>` : ''}
-            <tr><td style="color:#888; padding:2px 0;">${t('station.settings.satellites.status')}:</td>
-                <td align="right" class="${isVisible ? 'sat-visible-blink' : ''}" style="padding:2px 0;">
-                  ${isVisible ? `<span style="color:#00ff88;">${t('station.settings.satellites.visible')}</span>` : `<span style="color:#666;">${t('station.settings.satellites.belowHorizon')}</span>`}
-                </td>
+            <tr>
+              <td>${t('station.settings.satellites.status')}:</td>
+              <td align="right">${isVisible ? `${t('station.settings.satellites.visible')}` : `${t('station.settings.satellites.belowHorizon')}`}</td>
+            </tr>
+            </table>
+
+            <!-- section 3: miscellaneous satellite information -->
+            <table style="background-color: #233b46; width:100%; font-size:11px; color: #888; padding:2px 0;">
+            <tr>
+              <td>${t('station.settings.satellites.mode')}:</td>
+              <td align="right" style="color:#ffa500; padding:2px 0;">${sat.mode || 'N/A'}</td>
             </tr>
-          </table>
-          ${sat.notes ? `<div style="font-size:9px; color:#666; margin-top:4px; font-style:italic;">${sat.notes}</div>` : ''}
+            ${sat.downlink ? `<tr><td>${t('station.settings.satellites.downlink')}:</td><td align="right" style="color:#00ffcc;">${sat.downlink}</td></tr>` : ''}
+            ${sat.uplink ? `<tr><td>${t('station.settings.satellites.uplink')}:</td><td align="right" style="color:#ffcc00;">${sat.uplink}</td></tr>` : ''}
+            ${sat.tone ? `<tr><td>${t('station.settings.satellites.tone')}:</td><td align="right">${sat.tone}</td></tr>` : ''}
+            </table>
+
+            </table>
+
+            ${sat.notes ? `<div style="font-size:9px; color:#666; margin-top:4px; font-style:italic;">${sat.notes}</div>` : ''}
         </div>
       `;
         })
@@ -427,5 +440,209 @@ export const useLayer = ({ map, enabled, satellites, setSatellites, opacity, con
     if (enabled) renderSatellites();
   }, [satellites, selectedSats, allUnits, opacity, config, winMinimized]);
 
+  /********************************************************************************************/
+  // Expose satellite prediction panel function
+  useEffect(() => {
+    window.openSatellitePredict = (satName, tle1, tle2) => {
+      if (!satName || !satellites) return;
+
+      // Find the satellite data
+      const sat = satellites.find((s) => s.name === satName);
+      if (!sat) {
+        alert(`Satellite ${satName} not found`);
+        return;
+      }
+
+      const orbit = new Orbit(sat.name, `${sat.name}\n${tle1}\n${tle2}`);
+      orbit.error && console.warn('Satellite orbit error:', orbit.error);
+
+      const groundStation = {
+        latitude: globalConfig.location.lat,
+        longitude: globalConfig.location.lon,
+        height: globalConfig.location.stationAlt, // above sea level [m]
+      };
+
+      const startDate = dayjs().toDate(); // from now
+      const endDate = dayjs(startDate).add(7, 'day').toDate(); // until 7 days from now
+      const minElevation = globalConfig.satellite.minElev;
+      const maxPasses = 25;
+      const passes = orbit.computePassesElevation(groundStation, startDate, endDate, minElevation, maxPasses);
+
+      // Function to generate modal content
+      const generateModalContent = (currentPasses) => {
+        return `
+          <div style="text-align: center; margin-bottom: 16px; border-bottom: 2px solid var(--accent-red); padding-bottom: 12px;">
+            <h2 style="margin: 0; color: var(--accent-red); font-size: 24px;">🛰 ${satName}</h2>
+            <p style="margin: 8px 0 0 0; color: var(--text-muted); font-size: 12px;">Satellite Prediction Details</p>
+          </div>
+
+          <div style="margin-top: 16px;">
+            <h3 style="margin: 0 0 8px 0; color: var(--accent-red); font-size: 18px;">Upcoming Passes</h3>
+            <table style="width: 100%; border-collapse: collapse; font-size: 10px; border: 1px solid var(--text-muted);">
+              <thead>
+                <tr style="background: rgba(0,0,0,0.3); padding: 2px; border-bottom: 2px solid var(--text-muted);">
+                  <th colspan="3" style="border-right: 3px double var(--text-muted); padding: 4px;">Start</th>
+                  <th colspan="3" style="border-right: 3px double var(--text-muted); padding: 4px;">Apex</th>
+                  <th colspan="2" style="border-right: 3px double var(--text-muted); padding: 4px;">End</th>
+                  <th style="padding: 4px;">Duration</th>
+                </tr>
+                <tr style="background: rgba(0,0,0,0.3); padding: 2px; border-bottom: 2px solid var(--text-muted);">
+                  <th style="border-right: 1px solid var(--text-muted); padding: 4px;">Time</th>
+                  <th style="border-right: 1px solid var(--text-muted); padding: 4px;">From Now</th>
+                  <th style="border-right: 3px double var(--text-muted); padding: 4px;">Az [°]</th>
+                  <th style="border-right: 1px solid var(--text-muted); padding: 4px;">Time</th>
+                  <th style="border-right: 1px solid var(--text-muted); padding: 4px;">Az [°]</th>
+                  <th style="border-right: 3px double var(--text-muted); padding: 4px;">El [°]</th>
+                  <th style="border-right: 1px solid var(--text-muted); padding: 4px;">Time</th>
+                  <th style="border-right: 3px double var(--text-muted); padding: 4px;">Az [°]</th>
+                  <th style="padding: 4px;">[mins]</th>
+                </tr>
+              </thead>
+              <tbody>
+                ${currentPasses
+                  .map((pass) => {
+                    const azimuthStart = pass.azimuthStart.toFixed(0);
+                    const azimuthApex = pass.azimuthApex.toFixed(0);
+                    const azimuthEnd = pass.azimuthEnd.toFixed(0);
+                    const maxElevation = pass.maxElevation.toFixed(0);
+                    const durationMins = (pass.duration / 60000).toFixed(1);
+                    const startTime = dayjs(pass.start).format('YYYY-MM-DD HH:mm:ss');
+                    const apexTime = dayjs(pass.apex).format('YYYY-MM-DD HH:mm:ss');
+                    const endTime = dayjs(pass.end).format('YYYY-MM-DD HH:mm:ss');
+                    const secsFromNow = dayjs(pass.start).diff(dayjs(), 'second');
+
+                    const isActive = secsFromNow <= 0 && dayjs().isBefore(dayjs(pass.end));
+                    const isPast = secsFromNow <= 0 && dayjs().isAfter(dayjs(pass.end));
+
+                    if (isPast) {
+                      return ``; // skip past passes
+                    }
+
+                    const timeFromNow = isActive
+                      ? 'ACTIVE'
+                      : secsFromNow > 3600
+                        ? `${String(Math.floor(secsFromNow / 3600)).padStart(2, '0')}:${String(Math.floor((secsFromNow % 3600) / 60)).padStart(2, '0')}:${String(secsFromNow % 60).padStart(2, '0')}`
+                        : secsFromNow > 60
+                          ? `00:${String(Math.floor(secsFromNow / 60)).padStart(2, '0')}:${String(secsFromNow % 60).padStart(2, '0')}`
+                          : `00:00:${String(secsFromNow).padStart(2, '0')}`;
+
+                    return `<tr style="background: rgba(0,0,0,0.1); text-align: center; border-bottom: 1px solid var(--text-muted);">
+                    <td style="border-right: 1px solid var(--text-muted); padding: 4px;">${startTime}</td>
+                    <td style="border-right: 1px solid var(--text-muted); padding: 4px;">${timeFromNow}</td>
+                    <td style="border-right: 3px double var(--text-muted); padding: 4px;">${azimuthStart}</td>
+                    <td style="border-right: 1px solid var(--text-muted); padding: 4px;">${apexTime}</td>
+                    <td style="border-right: 1px solid var(--text-muted); padding: 4px;">${azimuthApex}</td>
+                    <td style="border-right: 3px double var(--text-muted); padding: 4px;">${maxElevation}</td>
+                    <td style="border-right: 1px solid var(--text-muted); padding: 4px;">${endTime}</td>
+                    <td style="border-right: 3px double var(--text-muted); padding: 4px;">${azimuthEnd}</td>
+                    <td style="padding: 4px;">${durationMins}</td>
+                  </tr>`;
+                  })
+                  .join('')}
+              </tbody>
+            </table>
+          </div>
+
+          <div style="text-align: center; margin-top: 16px;">
+            <button onclick="document.getElementById('${modalId}').remove(); clearInterval(window.satellitePredictInterval);" style="
+              background: var(--accent-cyan);
+              border: 1px solid var(--accent-cyan);
+              color: var(--bg-primary);
+              padding: 8px 16px;
+              border-radius: 4px;
+              cursor: pointer;
+              font-weight: bold;
+              font-size: 12px;
+            ">
+              Close
+            </button>
+          </div>
+        `;
+      };
+
+      // Create a modal overlay
+      const modalId = 'satellite-predict-modal';
+      let modal = document.getElementById(modalId);
+
+      if (modal) {
+        modal.remove();
+      }
+
+      // Create modal elements
+      modal = document.createElement('div');
+      modal.id = modalId;
+      modal.style.cssText = `
+        position: fixed;
+        top: 0;
+        left: 0;
+        right: 0;
+        bottom: 0;
+        background: rgba(0, 0, 0, 0.6);
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        z-index: 10000;
+      `;
+
+      const content = document.createElement('div');
+      content.style.cssText = `
+        background: var(--bg-primary);
+        border: 2px solid var(--accent-red);
+        border-radius: 8px;
+        padding: 20px;
+        max-width: 95vw;
+        width: 50vw;
+        max-height: 90vh;
+        overflow-y: auto;
+        overflow-x: auto;
+        box-shadow: 0 4px 20px rgba(0, 0, 0, 0.5);
+        font-family: 'JetBrains Mono', monospace;
+        color: var(--text-primary);
+      `;
+
+      content.innerHTML = generateModalContent(passes);
+
+      modal.appendChild(content);
+      document.body.appendChild(modal);
+
+      const currentStartDate = dayjs().toDate();
+      const currentEndDate = dayjs(currentStartDate).add(7, 'day').toDate();
+      const currentPasses = orbit.computePassesElevation(
+        groundStation,
+        currentStartDate,
+        currentEndDate,
+        minElevation,
+        maxPasses,
+      );
+
+      // update modal every second, satellite data currentPasses is not updated unless modal is reopened,
+      // or if satellite layer is updated for instance if TLE data changes
+      const updatePasses = () => {
+        content.innerHTML = generateModalContent(currentPasses);
+      };
+
+      window.satellitePredictInterval = setInterval(updatePasses, 1000); // one second
+
+      // Close on backdrop click
+      modal.addEventListener('click', (e) => {
+        if (e.target === modal) {
+          modal.remove();
+          clearInterval(window.satellitePredictInterval);
+        }
+      });
+
+      // Close on Enter or Escape key
+      const handleKeyDown = (e) => {
+        if (e.key === 'Enter' || e.key === 'Escape') {
+          modal.remove();
+          clearInterval(window.satellitePredictInterval);
+          document.removeEventListener('keydown', handleKeyDown);
+        }
+      };
+      document.addEventListener('keydown', handleKeyDown);
+    };
+  }, [satellites, globalConfig]);
+  /********************************************************************************************/
+
   return null;
 };
diff --git a/src/utils/config.js b/src/utils/config.js
index ac5a62be..84058d78 100644
--- a/src/utils/config.js
+++ b/src/utils/config.js
@@ -20,7 +20,8 @@ export const DEFAULT_CONFIG = {
   callsign: 'N0CALL',
   headerSize: 1.0, // Float multiplies base px size (0.1 to 2.0)
   locator: '',
-  location: { lat: 40.015, lon: -105.2705 }, // Boulder, CO (default)
+  location: { lat: 40.015, lon: -105.2705, stationAlt: 100 }, // Boulder, CO (default), altitude [m]
+  satellite: { minElev: 5 }, // Minimum elevation for satellite visibility (degrees)
   defaultDX: { lat: 35.6762, lon: 139.6503 }, // Tokyo
   units: 'imperial', // 'imperial' or 'metric'
   allUnits: { dist: 'imperial', temp: 'imperial', press: 'imperial' },
diff --git a/src/utils/orbit.js b/src/utils/orbit.js
new file mode 100644
index 00000000..4fe89b8d
--- /dev/null
+++ b/src/utils/orbit.js
@@ -0,0 +1,265 @@
+/*
+https://github.com/Flowm/satvis/blob/next/src/modules/Orbit.js
+
+MIT License
+
+Copyright (c) 2018 Florian Mauracher
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.
+*/
+
+import * as satellitejs from 'satellite.js';
+import dayjs from 'dayjs';
+
+const deg2rad = Math.PI / 180;
+const rad2deg = 180 / Math.PI;
+
+export default class Orbit {
+  constructor(name, tle) {
+    this.name = name;
+    this.tle = tle.split('\n');
+    this.satrec = satellitejs.twoline2satrec(this.tle[1], this.tle[2]);
+  }
+
+  get satnum() {
+    return this.satrec.satnum;
+  }
+
+  get error() {
+    return this.satrec.error;
+  }
+
+  get julianDate() {
+    return this.satrec.jdsatepoch;
+  }
+
+  get orbitalPeriod() {
+    const meanMotionRad = this.satrec.no;
+    const period = (2 * Math.PI) / meanMotionRad;
+    return period;
+  }
+
+  positionECI(time) {
+    const result = satellitejs.propagate(this.satrec, time);
+    return result ? result.position : null;
+  }
+
+  positionECF(time) {
+    const positionEci = this.positionECI(time);
+    if (!positionEci) return null;
+    const gmst = satellitejs.gstime(time);
+    const positionEcf = satellitejs.eciToEcf(positionEci, gmst);
+    return positionEcf;
+  }
+
+  positionGeodetic(timestamp, calculateVelocity = false) {
+    const result = satellitejs.propagate(this.satrec, timestamp);
+    if (!result) return null;
+    const { position: positionEci, velocity: velocityVector } = result;
+    const gmst = satellitejs.gstime(timestamp);
+    const positionGd = satellitejs.eciToGeodetic(positionEci, gmst);
+
+    return {
+      longitude: positionGd.longitude * rad2deg,
+      latitude: positionGd.latitude * rad2deg,
+      height: positionGd.height * 1000,
+      ...(calculateVelocity && {
+        velocity: Math.sqrt(
+          velocityVector.x * velocityVector.x +
+            velocityVector.y * velocityVector.y +
+            velocityVector.z * velocityVector.z,
+        ),
+      }),
+    };
+  }
+
+  computePassesElevation(
+    groundStationPosition,
+    startDate = dayjs().toDate(),
+    endDate = dayjs(startDate).add(7, 'day').toDate(),
+    minElevation = 5,
+    maxPasses = 50,
+  ) {
+    const groundStation = { ...groundStationPosition };
+    groundStation.latitude *= deg2rad;
+    groundStation.longitude *= deg2rad;
+    groundStation.height /= 1000;
+
+    const date = new Date(startDate);
+    const passes = [];
+    let pass = false;
+    let ongoingPass = false;
+    let lastElevation = 0;
+    // eslint-disable-next-line no-unmodified-loop-condition -- date is mutated via setMinutes/setSeconds
+    while (date < endDate) {
+      const positionEcf = this.positionECF(date);
+      if (!positionEcf) {
+        date.setMinutes(date.getMinutes() + 1);
+        continue;
+      }
+      const lookAngles = satellitejs.ecfToLookAngles(groundStation, positionEcf);
+      const elevation = lookAngles.elevation / deg2rad;
+
+      if (elevation > minElevation) {
+        if (!ongoingPass) {
+          // Start of new pass
+          pass = {
+            name: this.name,
+            start: date.getTime(),
+            azimuthStart: lookAngles.azimuth,
+            maxElevation: elevation,
+            azimuthApex: lookAngles.azimuth,
+          };
+          ongoingPass = true;
+        } else if (elevation > pass.maxElevation) {
+          // Ongoing pass
+          pass.maxElevation = elevation;
+          pass.apex = date.getTime();
+          pass.azimuthApex = lookAngles.azimuth;
+        }
+        date.setSeconds(date.getSeconds() + 5);
+      } else if (ongoingPass) {
+        // End of pass
+        pass.end = date.getTime();
+        pass.duration = pass.end - pass.start;
+        pass.azimuthEnd = lookAngles.azimuth;
+        pass.azimuthStart /= deg2rad;
+        pass.azimuthApex /= deg2rad;
+        pass.azimuthEnd /= deg2rad;
+        passes.push(pass);
+        if (passes.length > maxPasses) {
+          break;
+        }
+        ongoingPass = false;
+        lastElevation = -180;
+        date.setMinutes(date.getMinutes() + this.orbitalPeriod * 0.05); // modified from original 0.5 value to make first pass calculation more reliable
+      } else {
+        const deltaElevation = elevation - lastElevation;
+        lastElevation = elevation;
+        if (deltaElevation < 0) {
+          date.setMinutes(date.getMinutes() + this.orbitalPeriod * 0.05); // modified from original 0.5 value to make first pass calculation more reliable
+          lastElevation = -180;
+        } else if (elevation < -20) {
+          date.setMinutes(date.getMinutes() + 5);
+        } else if (elevation < -5) {
+          date.setMinutes(date.getMinutes() + 1);
+        } else if (elevation < -1) {
+          date.setSeconds(date.getSeconds() + 5);
+        } else {
+          date.setSeconds(date.getSeconds() + 2);
+        }
+      }
+    }
+    return passes;
+  }
+
+  computePassesSwath(
+    groundStationPosition,
+    swathKm,
+    startDate = dayjs().toDate(),
+    endDate = dayjs(startDate).add(7, 'day').toDate(),
+    maxPasses = 50,
+  ) {
+    const groundStation = { ...groundStationPosition };
+    groundStation.latitude *= deg2rad;
+    groundStation.longitude *= deg2rad;
+    groundStation.height /= 1000;
+
+    const date = new Date(startDate);
+    const passes = [];
+    let pass = false;
+    let ongoingPass = false;
+    let lastDistance = Number.MAX_VALUE;
+
+    // eslint-disable-next-line no-unmodified-loop-condition -- date is mutated via setMinutes/setSeconds
+    while (date < endDate) {
+      const positionGeodetic = this.positionGeodetic(date);
+      if (!positionGeodetic) {
+        date.setMinutes(date.getMinutes() + 1);
+        continue;
+      }
+
+      // Convert satellite position to radians for calculations
+      const satLat = positionGeodetic.latitude * deg2rad;
+      const satLon = positionGeodetic.longitude * deg2rad;
+
+      // Calculate great circle distance between satellite and ground station
+      const deltaLat = satLat - groundStation.latitude;
+      const deltaLon = satLon - groundStation.longitude;
+      const a =
+        Math.sin(deltaLat / 2) * Math.sin(deltaLat / 2) +
+        Math.cos(groundStation.latitude) * Math.cos(satLat) * Math.sin(deltaLon / 2) * Math.sin(deltaLon / 2);
+      const c = 2 * Math.atan2(Math.sqrt(a), Math.sqrt(1 - a));
+      const earthRadius = 6371; // Earth radius in km
+      const distanceKm = earthRadius * c;
+
+      // Check if ground station is within swath
+      const halfSwath = swathKm / 2;
+      const withinSwath = distanceKm <= halfSwath;
+
+      if (withinSwath) {
+        if (!ongoingPass) {
+          // Start of new pass
+          pass = {
+            name: this.name,
+            start: date.getTime(),
+            minDistance: distanceKm,
+            minDistanceTime: date.getTime(),
+            swathWidth: swathKm,
+          };
+          ongoingPass = true;
+        } else if (distanceKm < pass.minDistance) {
+          // Update minimum distance (closest approach)
+          pass.minDistance = distanceKm;
+          pass.minDistanceTime = date.getTime();
+        }
+        date.setSeconds(date.getSeconds() + 30); // 30 second steps during pass
+      } else if (ongoingPass) {
+        // End of pass
+        pass.end = date.getTime();
+        pass.duration = pass.end - pass.start;
+        passes.push(pass);
+        if (passes.length >= maxPasses) {
+          break;
+        }
+        ongoingPass = false;
+        lastDistance = Number.MAX_VALUE;
+        // Skip ahead to avoid immediate re-entry
+        date.setMinutes(date.getMinutes() + Math.max(5, this.orbitalPeriod * 0.1));
+      } else {
+        // Not in pass, adjust time step based on distance and previous distance
+        const deltaDistance = distanceKm - lastDistance;
+        lastDistance = distanceKm;
+
+        if (deltaDistance > 0 && distanceKm > halfSwath * 3) {
+          // Moving away and far from swath, skip ahead more
+          date.setMinutes(date.getMinutes() + Math.max(10, this.orbitalPeriod * 0.2));
+        } else if (distanceKm > halfSwath * 2) {
+          // Moderately far from swath
+          date.setMinutes(date.getMinutes() + 5);
+        } else {
+          // Getting closer to swath, use smaller time steps
+          date.setMinutes(date.getMinutes() + 1);
+        }
+      }
+    }
+
+    return passes;
+  }
+}