@sailingrotevista/rotevista-dash 7.0.45 → 8.0.1

package/README.md

@@ -1,90 +1,48 @@
-# @sailingrotevista/rotevista-dash
+# Sailing Dashboard Pro (React + TypeScript)
 
-## Sailing Dashboard Pro (v6.0)
-
-A tactical marine dashboard and advanced monitoring system for sailboats, designed to run as a Web App (PWA) fully integrated into the **Signal K** ecosystem. Specifically optimized for precision rendering on boat tablets (such as iPads and Samsung Galaxy Tab Active) and built to run efficiently on low-resource gateways like the **Victron Cerbo GX** (running Venus OS Large) or Raspberry Pi.
+A tactical marine dashboard and advanced monitoring system for sailboats, built with React, TypeScript, and Vite. Designed to run seamlessly as a Progressive Web App (PWA) with Signal K integration, optimized for precision rendering on boat tablets (such as iPads and rugged Android tablets) and running on onboard systems (Victron Cerbo GX, Venus OS, or Raspberry Pi).
 
 ---
 
 ## Core Features
 
-### 📈 Server-Side RAM-Buffered History
-Unlike traditional dashboards that store history in the volatile memory of the client browser (wiping it whenever the screen locks or the browser reloads), this dashboard performs continuous background logging in RAM directly within the Signal K server process. Upon startup, the client instantly loads up to 60 minutes of pre-populated history via a fast JSON API endpoint, ensuring fully drawn, stable charts from the very first second the page is opened.
-
-### 🔋 Extreme Low-Power Architecture (Battery Saver)
-Engineered for long-range cruising without overheating your mobile devices or draining the boat's house batteries:
-*   **Event-Driven SVG Redraw:** Complex SVG chart elements are not redrawn on a blind timer. Instead, they are redrawn *only* when a new historical data point is appended to the buffer (reducing the browser's active SVG layout and paint cycles by **93%**).
-*   **Virtual-DOM Text Protection (`safeSetText`):** Digital text readouts are updated only if their numerical value has actually changed since the previous second, bypassing expensive browser style and layout calculations (*reflow/repaint*).
-*   **Zero-Overhead Analog Needles:** Pointers (AWA, TWA, Leeway) snap instantly to their new positions at 1Hz instead of forcing continuous 60fps style interpolations, allowing the tablet's GPU to rest in a low-power idle state.
-
-### 🧭 Weather Compass & True Wind Direction (TWD) Trends
-*   **Tactical Trend (Short-term):** Instantly detects lift or header shifts by comparing the 2-second moving average of True Wind Angle (TWA) with the 10-second average.
-*   **Strategic Trend (Long-term):** Flashing green (CW) and red (CCW) dots on the TWD mini-compass indicate meteorological wind rotations, comparing the last 1 minute of wind with a stable strategic baseline of **15 minutes** under sail or **60 minutes** at anchor.
-*   **Absolute UTC Epoch Snapping:** Time windows on both the server and any connected clients are locked to absolute UTC second boundaries (00, 10, 20, 30, 40, 50). This eliminates phase offsets and ensures identical tactical trends across all devices on the boat.
-
-### 🛡️ Shallow Water Alarms & Geometric Safety Lines
-*   Automatically draws high-visibility dashed safety lines across the depth chart background to indicate **Warning (Yellow, e.g. 3.5m)** and **Danger (Red, e.g. 2.5m)** thresholds.
-*   **Non-Scaling Vector Effects:** By using `vector-effect="non-scaling-stroke"`, these lines and the active depth curve remain perfectly sharp, thin, and professional regardless of whether the widget is small or zoomed to full screen.
-*   **Adaptive 0-Baseline:** In shallow water, the chart minimum is locked to 0 for keel safety; in deep water, the scale floats freely (e.g., 98m to 102m) to reveal the fine contour details of the seabed.
-
-### 🔌 Smart Source Locking (Zero-Config)
-An intelligent background algorithm assigns priority scores to active hardware sources on your boat (e.g. Yacht Devices N2K GPS vs a generic USB GPS) and locks onto the highest-quality sensor, switching to a backup only if a signal dropout occurs.
-
-### ⏰ Sleep & Power-Save Watchdog
-Detects when the tablet is unlocked or the browser wakes up a tab from *Power Save* mode, automatically closing orphaned WebSockets, reconnecting, and downloading the latest server-logged history in milliseconds to resume fluid, gap-free operation.
+### 📈 Real-Time & Historical Sparklines
+- **Adaptive Scales:** Automatic standard or Hercules zoom mode with snap-to-grid resolution.
+- **Dynamic Reef & Danger Thresholds:** Visual warnings (Orange 1st Reef, Red 2nd Reef, Purple storm) and customizable depth safety lines with acoustic alerts.
+- **Elastic History Gap Handling:** Smooth data rendering without synthetic gaps.
 
-### 🎮 Smart Local Development Auto-Detection
-The dashboard automatically detects if it is running locally on your Mac/PC via the `file://` protocol or on `localhost`. In this mode, it still connects to your boat's Cerbo GX over Wi-Fi to stream real-time data, but **bypasses the server's configuration, preserving your local `CONFIG` edits** so you can test scales, alarms, and steps instantly.
+### 🧭 Dual Central Instruments: Analog Gauge & Weather Radar
+- **Analog Wind Gauge:** Real-time Apparent Wind Angle (AWA), True Wind Angle (TWA), Apparent Wind Speed (AWS), Leeway angle, and Ground Track vector.
+- **Tactical & Gybe Alarms:** Visual and acoustic alarms for deep downwind gybe danger with hysteresis anti-chatter state machine.
+- **Historical Weather Radar:** 8-ring historical true wind direction (TWD) and true wind speed (TWS) radar with Open-Meteo future forecast interpolation and live boat heading alignment.
+- **Quick Switch:** 1-second hold on the TWD mini-compass switches to the historical radar; click anywhere on the radar to return to the analog gauge.
 
----
-
-## System Requirements
+### 🌙 Night Mode & Tactical Focus Mode
+- **Tactical Red Night Mode:** 1-second press on the central hotspot toggles full tactical red night mode to preserve night vision.
+- **Fullscreen Mode:** Tap the central hotspot to toggle browser fullscreen.
+- **Tactical Focus Mode:** 1-second press on any data box expands that instrument into high-visibility split-screen mode.
 
-*   **Server:** Signal K Node Server (v1.20.0 or higher) installed on a Victron Cerbo GX, Raspberry Pi, or onboard PC.
-*   **Client:** Any modern PWA-compliant browser supporting ES6 (Safari on iPadOS/iOS, Samsung Internet, Chrome on Android, Chrome/Safari on macOS/Windows).
+### 📡 Signal K & Simulation Engine
+- Automatically connects to Signal K WebSocket (`ws://${host}/signalk/v1/stream`) when running aboard.
+- Automatically falls back to an integrated dynamic simulation engine when running standalone or in browser previews, keeping all instruments, graphs, and tactical trends active.
 
 ---
 
-## Signal K Data Requirements
-
-### Required Foundational Paths
-To derive, calculate, and display the entire suite of tactical data, the dashboard must receive the following raw paths from your boat's NMEA network:
+## Development
 
-*   `navigation.speedThroughWater` (STW - Speed through water)
-*   `navigation.speedOverGround` (SOG - Speed over ground)
-*   `navigation.courseOverGroundTrue` (COG - Course over ground)
-*   `navigation.headingTrue` (True Heading - *If missing, the system automatically falls back to Magnetic Heading*)
-*   `environment.wind.speedApparent` (AWS - Apparent wind speed)
-*   `environment.wind.angleApparent` (AWA - Apparent wind angle)
-*   `environment.depth.belowTransducer` (Depth below keel/transducer)
-*   `navigation.position` (GPS Latitude and Longitude - used for hemisphere detection and CSV logging)
+```bash
+# Install dependencies
+npm install
 
-### Optional / Native Fallback Paths (Surgically Supported)
-The dashboard operates on a **"Native First, Fallback Second"** architecture. If any of the following calculated paths are transmitted natively by your boat's instruments, the dashboard will utilize them directly to preserve their calibration. If they are missing, the system silently activates its own local vector formulas:
+# Start Vite development server (Port 3000)
+npm run dev
 
-*   `environment.wind.speedTrue` (**Optional** - Native True Wind Speed in m/s; falls back to local calculation if missing)
-*   `environment.wind.directionTrue` (**Optional** - Native True Wind Direction in radians; falls back to local calculation if missing)
-*   `navigation.headingMagnetic` (**Optional** - Magnetic Heading; automatically used if True Heading is missing on the network)
-*   `navigation.magneticVariation` (**Optional** - Magnetic Variation; used to calibrate the Magnetic Heading fallback to True)
+# Production build
+npm run build
+```
 
 ---
 
-## Installation
-
-The dashboard is distributed as a standard Signal K Node Server plugin and Web App.
-
-### Installation via Signal K App Store (Recommended)
-1. Access your Signal K admin panel (`http://<boat-ip>:3000`).
-2. Navigate to **App Store** -> **Available**.
-3. Search for `@sailingrotevista/rotevista-dash` and click **Install**.
-4. Go to **Plugins Config**, activate the **Rotevista Dash Configuration** plugin, and configure your boat's safety thresholds (Draft, alarm offsets, and strategic chart timelines).
-5. Click **Save**. The Signal K server will restart, apply the configurations, and initiate background history logging in RAM.
-
-### Accessing the Dashboard
-Once installed, the dashboard is accessible on your local network by typing into your tablet or computer browser:
-```text
-http://<boat-ip>:3000/@sailingrotevista/rotevista-dash/
-For the best experience in the cockpit, tap your browser's share button and select "Add to Home Screen" to run it as a standalone, distraction-free application.
+## License
 
-License
 This project is licensed under the MIT License - see the LICENSE file for details.

package/bun.lock

@@ -0,0 +1,157 @@
+{
+  "lockfileVersion": 2,
+  "configVersion": 1,
+  "workspaces": {
+    "": {
+      "name": "@sailingrotevista/rotevista-dash",
+      "dependencies": {
+        "react": "^19.3.1",
+        "react-dom": "^19.3.1",
+      },
+      "devDependencies": {
+        "@types/react": "^19.3.0",
+        "@types/react-dom": "^19.3.0",
+        "@vitejs/plugin-react": "^6.1.2",
+        "typescript": "^7.0.2",
+        "vite": "^8.3.4",
+      },
+    },
+  },
+  "packages": {
+    "@oxc-project/types": ["@oxc-project/types@0.154.0", "", {}, "sha512-KYOUGQFlLWR+s4QMV2Q9ko38TZm7EdO87Qm7rvZLqk/webse/cDjtyxKhg/47l0byCbs/k46LT8qc4PKjAikzA=="],
+
+    "@rolldown/binding-android-arm-eabi": ["@rolldown/binding-android-arm-eabi@1.2.14", "", { "os": "android", "cpu": "arm" }, "sha512-aWR+XKH9+rW7m5fWq/5360J3mHycrx/o6xZM2DQFdJnTMdyP7/WzxPjhtLbVWdKo2y612/4U1bWqb3HQhiF7vg=="],
+
+    "@rolldown/binding-android-arm64": ["@rolldown/binding-android-arm64@1.2.14", "", { "os": "android", "cpu": "arm64" }, "sha512-QiVxHofl6A8lQU7WAtOUY4QMVZXohxwz7WJJoeh8NBEUyKfIkMRKhYyq8az/1RypNiIXzNTtiS6KwHz0erxYRQ=="],
+
+    "@rolldown/binding-darwin-arm64": ["@rolldown/binding-darwin-arm64@1.2.14", "", { "os": "darwin", "cpu": "arm64" }, "sha512-lTQOzHuBIooh3jIr5XINQkjPGEuGy+Dsy0meXDr6Sjty0b99kYgGh4uBC/8mJX1T0kC8d6S0aPP1Y+bHkh6aBw=="],
+
+    "@rolldown/binding-darwin-x64": ["@rolldown/binding-darwin-x64@1.2.14", "", { "os": "darwin", "cpu": "x64" }, "sha512-hyMKEGatjmBYCs/Q4sbIcL/GqpFEqsX3wc+HYVQ/85A4rxc1o7rPm4DUI4GV4k/h0ITddwFSGpqQunI14GXjTA=="],
+
+    "@rolldown/binding-freebsd-x64": ["@rolldown/binding-freebsd-x64@1.2.14", "", { "os": "freebsd", "cpu": "x64" }, "sha512-u371GbXoVXrEgP20PwzoGNOdAOqAMhzo19JzzY+V4YmmnC+DTOoqdbMu+O+54emM59Mik/UdrtWgcuEDKWRPKA=="],
+
+    "@rolldown/binding-linux-arm-gnueabihf": ["@rolldown/binding-linux-arm-gnueabihf@1.2.14", "", { "os": "linux", "cpu": "arm" }, "sha512-BqwKsdZQf6EqVWr8fv2MrDYzAvOZ7+NYFSJESRGs87fkseEhs0TU9TXgRJTkZoRRkxTizyEg1LKUXfU3/78uqg=="],
+
+    "@rolldown/binding-linux-arm64-gnu": ["@rolldown/binding-linux-arm64-gnu@1.2.14", "", { "os": "linux", "cpu": "arm64" }, "sha512-SD9kY8M009x/7s57Z1dgUVlP5+uYBgKQK0Tkr1WIWngrtUJmRCW1RJFMY7QDla2khXhmg2i5Io7MUjcmZNZ/KQ=="],
+
+    "@rolldown/binding-linux-arm64-musl": ["@rolldown/binding-linux-arm64-musl@1.2.14", "", { "os": "linux", "cpu": "arm64" }, "sha512-BJ2CL19M6uuWesMgnqJzgxoI+N+eV7b0A9O9vLV42y+gitC41fNa8KElau1tHVzuLWX5GzEuxMPhAO0tQXQMkg=="],
+
+    "@rolldown/binding-linux-ppc64-gnu": ["@rolldown/binding-linux-ppc64-gnu@1.2.14", "", { "os": "linux", "cpu": "ppc64" }, "sha512-4+Kl8daPV8NDHaD7mfCcc1pRM+Qg7ab8DyMm5FG5WoZgv4h2i3KFN1CybYBNbQqmuYm7ftJLvmMI1eHYJ22S/Q=="],
+
+    "@rolldown/binding-linux-s390x-gnu": ["@rolldown/binding-linux-s390x-gnu@1.2.14", "", { "os": "linux", "cpu": "s390x" }, "sha512-V/h8ePq1fKDrmtFMz6xcCN3DKvuvMRrwwD1q0PkBeeo4DpK64biaKvqWGVxqCeYKqeRk7gE7/iKPxLCn08O97A=="],
+
+    "@rolldown/binding-linux-x64-gnu": ["@rolldown/binding-linux-x64-gnu@1.2.14", "", { "os": "linux", "cpu": "x64" }, "sha512-WxalXzgrLVpKC93xfpaJ3gCXUWzeCr+FRCbDVD2mUAy4L6Vo3lNVz0epUEUpxPWJkLNYUwM4OSIikv36OJ9mLg=="],
+
+    "@rolldown/binding-linux-x64-musl": ["@rolldown/binding-linux-x64-musl@1.2.14", "", { "os": "linux", "cpu": "x64" }, "sha512-3G3tnAmTpdk9jO3GQtyHXqeFD2SlecfTws/Y3M2mmj9nMBwwuLT4kur8sZKeu7ENUHSpVO3cIsm5A52LEWWwlg=="],
+
+    "@rolldown/binding-openharmony-arm64": ["@rolldown/binding-openharmony-arm64@1.2.14", "", { "os": "none", "cpu": "arm64" }, "sha512-qyr5XiNGxm2ytx17vvtcJ9nXn6v1gENETi503bJx3OGwZ1tSonj7BosxbMa/xeAfSl5iS9X6KjEWYXLu6v1L7Q=="],
+
+    "@rolldown/binding-win32-arm64-msvc": ["@rolldown/binding-win32-arm64-msvc@1.2.14", "", { "os": "win32", "cpu": "arm64" }, "sha512-oA4o5o0S2yB199YyYXDzKUv1Z56Rc+mgOjwm7Z/vJ9Z8igiDPYvoOuDyo6g7AK/ZaF09nPhDKVnGBcYHO11GXA=="],
+
+    "@rolldown/binding-win32-x64-msvc": ["@rolldown/binding-win32-x64-msvc@1.2.14", "", { "os": "win32", "cpu": "x64" }, "sha512-9mE94bf2GZUaR/fUSXCMpBoWkctu421Mi0ORpm4zqfbkjKep7RxzPFa5etcGs5h+2KApoWBOA/hAJa/7saGgEQ=="],
+
+    "@rolldown/pluginutils": ["@rolldown/pluginutils@1.0.1", "", {}, "sha512-2j9bGt5Jh8hj+vPtgzPtl72j0yRxHAyumoo6TNfAjsLB04UtpSvPbPcDcBMxz7n+9CYB0c1GxQFxYRg2jimqGw=="],
+
+    "@types/react": ["@types/react@19.3.0", "", { "dependencies": { "csstype": "^3.2.2" } }, "sha512-N0rFCuH9YoxG9/m61l9MfpJKfmLOVU0em7ipIz6TRgSSkvReLB9vL85GB+yr8Bs5leqpvg96JSwF4ZS1s4viQg=="],
+
+    "@types/react-dom": ["@types/react-dom@19.3.0", "", { "peerDependencies": { "@types/react": "^19.3.0" } }, "sha512-ZI7bU42mZXXKHn/qNLEw2IrbiINU7X5+vfgdixBHkCNpYWXjKgfQ/P+uyGb5CjOLB9UcnTeg3rylQtV2hym44Q=="],
+
+    "@typescript/typescript-aix-ppc64": ["@typescript/typescript-aix-ppc64@7.0.2", "", { "os": "aix", "cpu": "ppc64" }, "sha512-MTKKkWB7p/0E9xi1d1tHtZ5PiLkGEMIq88pK2CubZjOsLtYTLqhgIgi6zepFa+9GHZ6h05NMCkQxGKiPXMxXtQ=="],
+
+    "@typescript/typescript-darwin-arm64": ["@typescript/typescript-darwin-arm64@7.0.2", "", { "os": "darwin", "cpu": "arm64" }, "sha512-gowzar9MwS/aRWp6f3a4KUqzRjAZjOsmGNCM6LcTgXum+dBfgsBVMN+AgvOCCbguXyick6LJhpBszxMebJ8syA=="],
+
+    "@typescript/typescript-darwin-x64": ["@typescript/typescript-darwin-x64@7.0.2", "", { "os": "darwin", "cpu": "x64" }, "sha512-SZ9xZInqApNlNGc9s0W1VSsktYSOe9cFqNOIqmN1Gs8SmkjKZYFt017G4VwPxASInODuAdbTW7sXiFUf893RgA=="],
+
+    "@typescript/typescript-freebsd-arm64": ["@typescript/typescript-freebsd-arm64@7.0.2", "", { "os": "freebsd", "cpu": "arm64" }, "sha512-W5NH4y/J0plIIS5b2xvTEkU7JFxyqdMAOgf+Ilhl0vHQXKO5dZoxd+C/jEtq56c4F3wk71RB4BMRQ2XdI+bwYQ=="],
+
+    "@typescript/typescript-freebsd-x64": ["@typescript/typescript-freebsd-x64@7.0.2", "", { "os": "freebsd", "cpu": "x64" }, "sha512-UMGDx5sTpzNw3WiPebH7l90IWfJggEd+egHt/q6p7/Cm3zqoV7VxkGXt+3DxPIw8CcmvAB0j3sVVfbhX+M4Tpw=="],
+
+    "@typescript/typescript-linux-arm": ["@typescript/typescript-linux-arm@7.0.2", "", { "os": "linux", "cpu": "arm" }, "sha512-gffT3xPz9sR7j/YJExkyPntrI0P2EP9XbOyWzth2/Gs0RstK+90RBcO0ncXoXy/beYll1SXw846Nf2zdnEz0QQ=="],
+
+    "@typescript/typescript-linux-arm64": ["@typescript/typescript-linux-arm64@7.0.2", "", { "os": "linux", "cpu": "arm64" }, "sha512-Qh4eU4/y3yDjnfjjyPYihMj5/ODIlmt+Bzu17OI+fiSRDW57QmU5SiN63exPRNJPKUzcc1INa1NXdrJ+MqHjUQ=="],
+
+    "@typescript/typescript-linux-loong64": ["@typescript/typescript-linux-loong64@7.0.2", "", { "os": "linux", "cpu": "none" }, "sha512-uEHck9i8hoAzXPiYRib1O7miOnz23SxIeVl6F4LXox+qov1K35jHcEW6VHKvZI+pyvl7fZEP4MCU5LYvIq1GuQ=="],
+
+    "@typescript/typescript-linux-mips64el": ["@typescript/typescript-linux-mips64el@7.0.2", "", { "os": "linux", "cpu": "none" }, "sha512-R4KvAMnE43W5Qeqb0Ly56O3mWMWIAgsMyz36DCaycd5nbg/9kzm0liw3JocfRqyJY0KPmzFjbswozXyW0DnIYA=="],
+
+    "@typescript/typescript-linux-ppc64": ["@typescript/typescript-linux-ppc64@7.0.2", "", { "os": "linux", "cpu": "ppc64" }, "sha512-DORx5b3sd/4S7eayxm4FQv+A7CrkUIGRaHiwI8oiHTAI1fAPWhF4J0vAlkC8biAlHSVVwxMQ3tjZ2/DVbnQiiA=="],
+
+    "@typescript/typescript-linux-riscv64": ["@typescript/typescript-linux-riscv64@7.0.2", "", { "os": "linux", "cpu": "none" }, "sha512-wf0jqEDOjrPRnKwYRyyJDRo11KMbvMFrU+q4zqKyChODBzvlkbhNQfKvLxQCcwTpdDaXSHZTVuh0JoCrKCUMHQ=="],
+
+    "@typescript/typescript-linux-s390x": ["@typescript/typescript-linux-s390x@7.0.2", "", { "os": "linux", "cpu": "s390x" }, "sha512-IkwJc3L7yhytWd/ewjyxNDfOmswCm9GWMJT/ue/dU4aZNbwZeYAetq42VyLmsmSjvoX7z74X6ZaYCtzAr0EuGw=="],
+
+    "@typescript/typescript-linux-x64": ["@typescript/typescript-linux-x64@7.0.2", "", { "os": "linux", "cpu": "x64" }, "sha512-EYdf2cNg7rgCWJnxCdJ+F3V39O8ihb37eHAu1LK8oAFizgTQbPOK7zHHXbPt8rX24COqODXeI3sIf0fCXG7H/A=="],
+
+    "@typescript/typescript-netbsd-arm64": ["@typescript/typescript-netbsd-arm64@7.0.2", "", { "os": "none", "cpu": "arm64" }, "sha512-+polYF4MF04aPpO5FTkHran9yUQDSXqy5GiSDKpsll5jy3l3+g9QLhpf39T+ePtefhXLOGrLl0QIjkQP6VnelA=="],
+
+    "@typescript/typescript-netbsd-x64": ["@typescript/typescript-netbsd-x64@7.0.2", "", { "os": "none", "cpu": "x64" }, "sha512-8YIT0EHM/3dq10ZOVF/A7pc/YSMtbcecct4rWtexrnSCHOPcpC2KTLXfTCR6vDpnSiY12heNb1GiN/wu+T/FyA=="],
+
+    "@typescript/typescript-openbsd-arm64": ["@typescript/typescript-openbsd-arm64@7.0.2", "", { "os": "openbsd", "cpu": "arm64" }, "sha512-APT8+ClYnuYm1u9+kgGXoMj2VzWzcymwh2gNSQVySHfkRDGOTVkoWLjCmOQSaO+PoqQ57B0flRp9SA+7GnnkzQ=="],
+
+    "@typescript/typescript-openbsd-x64": ["@typescript/typescript-openbsd-x64@7.0.2", "", { "os": "openbsd", "cpu": "x64" }, "sha512-yX7s+Q0Dln0Dt9tEzZsAjXXR/+ytBM7AlglaqyeMPxQszJ1JhlJdZ6jLA+IzldHtflX81em7lDao1xXu+aRRkg=="],
+
+    "@typescript/typescript-sunos-x64": ["@typescript/typescript-sunos-x64@7.0.2", "", { "os": "sunos", "cpu": "x64" }, "sha512-dLJDGaLZ1D4HPQn62u1n8mBDkJREwMsAkCdkwd4Ieqw+x3TUyTsqY0YiBCtE6H6OzzgGk3iuZ3vFWRS+E8/d1g=="],
+
+    "@typescript/typescript-win32-arm64": ["@typescript/typescript-win32-arm64@7.0.2", "", { "os": "win32", "cpu": "arm64" }, "sha512-Gyl1Vy6OsWesLzmq+EP0Fb7b4Nid5232AvcA2SFcdYreldpNtYFFofPjnt62y9hQy7VTaZp65ICJjuAQRaVcIQ=="],
+
+    "@typescript/typescript-win32-x64": ["@typescript/typescript-win32-x64@7.0.2", "", { "os": "win32", "cpu": "x64" }, "sha512-0BQ3HkAHHlKLSp1qRvf3SUhGpGsDuhB/jgFw75guyqbxJqEaS0Cw/VFO8i2nHglJUzQCRtMMR/IBAKE3ETMC4g=="],
+
+    "@vitejs/plugin-react": ["@vitejs/plugin-react@6.1.2", "", { "dependencies": { "@rolldown/pluginutils": "^1.0.1" }, "peerDependencies": { "@rolldown/plugin-babel": "^0.1.7 || ^0.2.0", "babel-plugin-react-compiler": "^1.0.0", "oxc-transform-react": "^0.152.0", "vite": "^8.0.0" }, "optionalPeers": ["@rolldown/plugin-babel", "babel-plugin-react-compiler", "oxc-transform-react"] }, "sha512-fhJNGUdscQa4HkI0xFxwonWyhnVReCPDbXI7FH7jmzpnVCrFQI7PRrhWecO263610vOrs9tr2Y4xcf8uAdFxbw=="],
+
+    "csstype": ["csstype@3.2.3", "", {}, "sha512-z1HGKcYy2xA8AGQfwrn0PAy+PB7X/GSj3UVJW9qKyn43xWa+gl5nXmU4qqLMRzWVLFC8KusUX8T/0kCiOYpAIQ=="],
+
+    "detect-libc": ["detect-libc@2.1.2", "", {}, "sha512-Btj2BOOO83o3WyH59e8MgXsxEQVcarkUOpEYrubB0urwnN10yQ364rsiByU11nZlqWYZm05i/of7io4mzihBtQ=="],
+
+    "fdir": ["fdir@6.5.0", "", { "peerDependencies": { "picomatch": "^3 || ^4" }, "optionalPeers": ["picomatch"] }, "sha512-tIbYtZbucOs0BRGqPJkshJUYdL+SDH7dVM8gjy+ERp3WAUjLEFJE+02kanyHtwjWOnwrKYBiwAmM0p4kLJAnXg=="],
+
+    "fsevents": ["fsevents@2.3.3", "", { "os": "darwin" }, "sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw=="],
+
+    "lightningcss": ["lightningcss@1.33.0", "", { "dependencies": { "detect-libc": "^2.0.3" }, "optionalDependencies": { "lightningcss-android-arm64": "1.33.0", "lightningcss-darwin-arm64": "1.33.0", "lightningcss-darwin-x64": "1.33.0", "lightningcss-freebsd-x64": "1.33.0", "lightningcss-linux-arm-gnueabihf": "1.33.0", "lightningcss-linux-arm64-gnu": "1.33.0", "lightningcss-linux-arm64-musl": "1.33.0", "lightningcss-linux-x64-gnu": "1.33.0", "lightningcss-linux-x64-musl": "1.33.0", "lightningcss-win32-arm64-msvc": "1.33.0", "lightningcss-win32-x64-msvc": "1.33.0" } }, "sha512-WkUDrojuJs0xkgGf2udWxa3yGBRxPtxUkB79i6aCZLRgc7PM8fZe9TosfPDcvEpQZbuFASnHYmRLBLUbmLOIIA=="],
+
+    "lightningcss-android-arm64": ["lightningcss-android-arm64@1.33.0", "", { "os": "android", "cpu": "arm64" }, "sha512-gEpRTalKdosp4Bb8qWtc2iOgE5SeIHlpS1up9bFq2wAyYhl1UdTObYiHe98zEM9SQvSoqQZ1IQD0JNpg3Ml5pg=="],
+
+    "lightningcss-darwin-arm64": ["lightningcss-darwin-arm64@1.33.0", "", { "os": "darwin", "cpu": "arm64" }, "sha512-Sciaz8eenNTKn9b3t7+xr0ipTp9YxKQY4npwQ3mrRuL0BAVHBLyZxofhaKBAVtzmtRZ/zTyo0/to4B1uWG/Djg=="],
+
+    "lightningcss-darwin-x64": ["lightningcss-darwin-x64@1.33.0", "", { "os": "darwin", "cpu": "x64" }, "sha512-Z5UPAxzrjlWNNyGy6i65cJzzvgJ5D3T6wMvs+gWpY9d7qRhANrxqAp6LhxIgZhWEw18RfJTGcRxjuLIBr+m8XQ=="],
+
+    "lightningcss-freebsd-x64": ["lightningcss-freebsd-x64@1.33.0", "", { "os": "freebsd", "cpu": "x64" }, "sha512-QQM/Ti/hQajJwCY+RiWuCZ9sdtI/XQk7nDK5vC8kkdwixezOlDgvDx7+RT+QjK6FcFT4MpsuoBnHIo/O3StRRg=="],
+
+    "lightningcss-linux-arm-gnueabihf": ["lightningcss-linux-arm-gnueabihf@1.33.0", "", { "os": "linux", "cpu": "arm" }, "sha512-N7FVBe6iS24MlM6R/4RBTxGhQheZGs7tiQ9U32UtF75NzP5Q7xWPRqLBCKxlRQRk3rY1jCIPLzx7WzOhuUIRLQ=="],
+
+    "lightningcss-linux-arm64-gnu": ["lightningcss-linux-arm64-gnu@1.33.0", "", { "os": "linux", "cpu": "arm64" }, "sha512-j2v/itmy4HlNxlc6voKXYgBqNi0Ng2LShg4z7GufpEgs05P+2suBVyi9I6YHq5uoVFx9ETin3eCEhLVyXGQnKg=="],
+
+    "lightningcss-linux-arm64-musl": ["lightningcss-linux-arm64-musl@1.33.0", "", { "os": "linux", "cpu": "arm64" }, "sha512-yiO5ROMuYQgXbC60yjZU5CYSFZGKXL0HFATXt9mHJn1+zW55oCtMI9NfcVhYLMFDL7gV7oBPon/EmMMGg2OvtQ=="],
+
+    "lightningcss-linux-x64-gnu": ["lightningcss-linux-x64-gnu@1.33.0", "", { "os": "linux", "cpu": "x64" }, "sha512-ar+Ju7LmcN0Jo4FpL4hpFybwNG9/3A/Br5KW2n2jyODg3MEZXaDYADdemoNS+BDNfMgKvylJLj4S5tyRActuAg=="],
+
+    "lightningcss-linux-x64-musl": ["lightningcss-linux-x64-musl@1.33.0", "", { "os": "linux", "cpu": "x64" }, "sha512-RYiYbkokw0trfKqqzfF55lginwEPrD3OJDfTuJzFs1MK6iFnDenaz1fqLLtX4ITG3OktJQXOeTaw1awrBAlZPw=="],
+
+    "lightningcss-win32-arm64-msvc": ["lightningcss-win32-arm64-msvc@1.33.0", "", { "os": "win32", "cpu": "arm64" }, "sha512-1K+MPfLSFVpphzpdbfkhlWk6wBrTObBzS2T6db10PNOZgR9GoVsAWzwNyuhUYYbTp23j+4RrncfujZ4uAzXvwA=="],
+
+    "lightningcss-win32-x64-msvc": ["lightningcss-win32-x64-msvc@1.33.0", "", { "os": "win32", "cpu": "x64" }, "sha512-OlEICDx/Xl0FqSp4bry8zFnCvGpig3Gl4gCquvYwHuqJKEC1+n9NgDniFvqHGmMv1ZkqDJrDqKKSykTDX+ehuA=="],
+
+    "nanoid": ["nanoid@3.3.20", "", { "bin": { "nanoid": "bin/nanoid.cjs" } }, "sha512-uKdg2G3GNCKQn9byYOpxbGqrT2fGO5KRt5J/8b3pok8rT6qxGWF6hxMyJiEYtAf+FVyYuD9hRaDqX5uPFYJ4ZQ=="],
+
+    "picocolors": ["picocolors@1.1.1", "", {}, "sha512-xceH2snhtb5M9liqDsmEw56le376mTZkEX/jEb/RxNFyegNul7eNslCXP9FDj/Lcu0X8KEyMceP2ntpaHrDEVA=="],
+
+    "picomatch": ["picomatch@4.0.7", "", {}, "sha512-qcJu88Q2IWqJsDD529JKMdwGm/dvInW4HvQnRwiH9JtihJvzGOscDtHE3x1pBKeUOTysQ8kVmLnJ2kJu7yhcGA=="],
+
+    "postcss": ["postcss@8.5.30", "", { "dependencies": { "nanoid": "^3.3.20", "picocolors": "^1.1.1", "source-map-js": "^1.2.2" } }, "sha512-zkd+e9S1AQHhmaBKye9zlFHWjOwVgqXl1q3ECYy8561K7qxR2cREf/STLskulBFd78k6AOFeA+ff1TtEzk9bAA=="],
+
+    "react": ["react@19.3.1", "", {}, "sha512-QNhWdt7nrgVWWQG58QuGsAR3jv3Hbe4mb4vz7w2csnHavciZJgda1CPNaldF6eVxv90ud3jUXpKlHL69gO38yw=="],
+
+    "react-dom": ["react-dom@19.3.1", "", { "dependencies": { "scheduler": "^0.28.0" }, "peerDependencies": { "react": "^19.3.1" } }, "sha512-Y0bARz53lhEC1NMCASs0/j+faB/zqt3R8hpvg1e8+61ZVJ4UL0UdC4cBbXfZMcIuhrfgeILTLe+ZeBCavQPtKQ=="],
+
+    "rolldown": ["rolldown@1.2.14", "", { "dependencies": { "@oxc-project/types": "=0.154.0", "@rolldown/pluginutils": "^1.0.0" }, "optionalDependencies": { "@rolldown/binding-android-arm-eabi": "1.2.14", "@rolldown/binding-android-arm64": "1.2.14", "@rolldown/binding-darwin-arm64": "1.2.14", "@rolldown/binding-darwin-x64": "1.2.14", "@rolldown/binding-freebsd-x64": "1.2.14", "@rolldown/binding-linux-arm-gnueabihf": "1.2.14", "@rolldown/binding-linux-arm64-gnu": "1.2.14", "@rolldown/binding-linux-arm64-musl": "1.2.14", "@rolldown/binding-linux-ppc64-gnu": "1.2.14", "@rolldown/binding-linux-s390x-gnu": "1.2.14", "@rolldown/binding-linux-x64-gnu": "1.2.14", "@rolldown/binding-linux-x64-musl": "1.2.14", "@rolldown/binding-openharmony-arm64": "1.2.14", "@rolldown/binding-win32-arm64-msvc": "1.2.14", "@rolldown/binding-win32-x64-msvc": "1.2.14" }, "bin": { "rolldown": "./bin/cli.mjs" } }, "sha512-eTBTTqMR6uHKLgcUqpJP8ntzDI6V4LYA8negAMBEI7gkgVvOdrx6VsvS2Ym+83KhOPdLCHWJu0w7UQFJZhHKNw=="],
+
+    "scheduler": ["scheduler@0.28.0", "", {}, "sha512-juorfCmIkIw8tT+p5BXSm6PJjQF/ycEYmKyzURCIt/RaZIhL+PulbQ9Yu2z1HdOJDdqDTlxA1+xKBmHXJsczAw=="],
+
+    "source-map-js": ["source-map-js@1.2.2", "", {}, "sha512-KGj/8Y43x35aZVDtt+J4mK1hoLGHULMYfSkODJNQjNDC3oW1PqPoxMwo0pLUsWM/UEGzON/NxeHywEfNXNP3Vw=="],
+
+    "tinyglobby": ["tinyglobby@0.2.17", "", { "dependencies": { "fdir": "^6.5.0", "picomatch": "^4.0.4" } }, "sha512-wXR/dYpcqKmfWpEdZjiKJOwCNFndD0DMnrW/cYjVGttEkBfVgcLFHoNrlj47mjOVic9yyNu65alsgF4NQyTa2g=="],
+
+    "typescript": ["typescript@7.0.2", "", { "optionalDependencies": { "@typescript/typescript-aix-ppc64": "7.0.2", "@typescript/typescript-darwin-arm64": "7.0.2", "@typescript/typescript-darwin-x64": "7.0.2", "@typescript/typescript-freebsd-arm64": "7.0.2", "@typescript/typescript-freebsd-x64": "7.0.2", "@typescript/typescript-linux-arm": "7.0.2", "@typescript/typescript-linux-arm64": "7.0.2", "@typescript/typescript-linux-loong64": "7.0.2", "@typescript/typescript-linux-mips64el": "7.0.2", "@typescript/typescript-linux-ppc64": "7.0.2", "@typescript/typescript-linux-riscv64": "7.0.2", "@typescript/typescript-linux-s390x": "7.0.2", "@typescript/typescript-linux-x64": "7.0.2", "@typescript/typescript-netbsd-arm64": "7.0.2", "@typescript/typescript-netbsd-x64": "7.0.2", "@typescript/typescript-openbsd-arm64": "7.0.2", "@typescript/typescript-openbsd-x64": "7.0.2", "@typescript/typescript-sunos-x64": "7.0.2", "@typescript/typescript-win32-arm64": "7.0.2", "@typescript/typescript-win32-x64": "7.0.2" }, "bin": { "tsc": "bin/tsc" } }, "sha512-8FYau96o3NKOhbjKi/qNvG/W5jhzxkbdm5sj9AbZ/5T5sWqn3hJgLfGx27sRKZWTvyzCP8dLRBTf5tBTSRVUNA=="],
+
+    "vite": ["vite@8.3.4", "", { "dependencies": { "lightningcss": "^1.33.0", "picomatch": "^4.0.7", "postcss": "^8.5.29", "rolldown": "~1.2.12", "tinyglobby": "^0.2.17" }, "optionalDependencies": { "fsevents": "~2.3.3" }, "peerDependencies": { "@types/node": "^20.19.0 || >=22.12.0", "@vitejs/devtools": "^0.7.1", "esbuild": "^0.27.0 || ^0.28.0", "jiti": ">=1.21.0", "less": "^4.0.0", "sass": "^1.70.0", "sass-embedded": "^1.70.0", "stylus": ">=0.54.8", "sugarss": "^5.0.0", "terser": "^5.16.0", "tsx": "^4.8.1", "yaml": "^2.4.2" }, "optionalPeers": ["@types/node", "@vitejs/devtools", "esbuild", "jiti", "less", "sass", "sass-embedded", "stylus", "sugarss", "terser", "tsx", "yaml"], "bin": { "vite": "bin/vite.js" } }, "sha512-IftLE8phJhdNRIGNEV4JCCvfNScoZQVfcXaN8TQropWGJtOHcu+iAB9pHcuGvmEb/kddw0LBe/jS8ztdC6xdiQ=="],
+  }
+}

package/index.html

@@ -1,264 +1,22 @@
 <!DOCTYPE html>
 <html lang="it">
-    <head>
-        <meta charset="UTF-8">
-        <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
-        <meta name="apple-mobile-web-app-capable" content="yes">
-        <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
-        <link rel="manifest" href="manifest.json">
-        
-        <!-- Icona standard per la scheda del browser (Favicon) -->
-        <link rel="icon" type="image/png" href="icons/dash.png">
-        
-        <!-- Icona per Bookmark e schermata Home su Apple iPad, iPhone e Mac -->
-        <link rel="apple-touch-icon" href="icons/dash.png">
-        <title>Sailing Dashboard Pro</title>
-        <link rel="stylesheet" href="style.css">
-    </head>
-<body>
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
+    <meta name="apple-mobile-web-app-capable" content="yes" />
+    <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
+    <meta name="description" content="Tactical marine wind dashboard with navigation and course aids, analog wind gauge, historical weather radar, and depth alerts." />
+    <meta property="og:title" content="Sailing Dashboard Pro" />
+    <meta property="og:description" content="Tactical marine wind dashboard with navigation and course aids, analog wind gauge, historical weather radar, and depth alerts." />
+    <link rel="manifest" href="./manifest.json" />
     
-    <div class="main-container">
-
-        <!-- COLONNA SINISTRA -->
-        <div class="data-box box-stw">
-            <div class="label-row"><span class="label">STW</span><span class="unit">kts</span></div>
-            <span class="value" id="stw">0.0</span>
-            <div class="graph-wrapper">
-                <svg class="sparkline" id="stw-graph" viewBox="0 0 200 40" preserveAspectRatio="none"></svg>
-                <div class="scale-labels" id="stw-scale"></div>
-            </div>
-        </div>
-
-        <div class="data-box box-sog">
-            <div class="label-row"><span class="label" id="sog-vmg-label">SOG</span><span class="unit">kts</span></div>
-            <span class="value" id="sog">0.0</span>
-            <div class="graph-wrapper">
-                <svg class="sparkline" id="sog-graph" viewBox="0 0 200 40" preserveAspectRatio="none"></svg>
-                <div class="scale-labels" id="sog-scale"></div>
-            </div>
-        </div>
-
-        <div class="data-box box-hdg">
-            <div class="label-row"><span class="label">HEADING (MEAN)</span></div>
-            <span class="value-large" id="hdg">000&deg;</span>
-        </div>
-
-        <div class="data-box box-cog">
-            <div class="label-row"><span class="label">COG (MEAN)</span></div>
-            <span class="value-large" id="cog">000&deg;</span>
-        </div>
-
-        <div class="data-box box-tack">
-                    <div class="label-row"><span class="label" id="tack-label">TACK</span></div>
-                    <div class="dual-value-container">
-                <div class="dual-value-col tack-hdg-col">
-                    <span class="dual-label">HDG</span>
-                    <span class="value dual-val" id="tack-hdg">---&deg;</span>
-                </div>
-                <div class="dual-value-col tack-cog-col">
-                    <span class="dual-label">COG</span>
-                    <span class="value dual-val" id="tack-cog">---&deg;</span>
-                </div>
-            </div>
-        </div>
-
-        <!-- BUSSOLA CENTRALE -->
-                <div class="box-gauge">
-                    <!-- STATO CONNESSIONE -->
-                    <div id="status" class="offline">OFFLINE</div>
-                    
-                    <!-- BUSSOLA 1: ANALOGICA STANDARD (Visibile all'avvio) -->
-                    <svg id="wind-gauge" viewBox="35 38 330 395" preserveAspectRatio="xMidYMid meet">
-                        <defs>
-                            <clipPath id="boat-clip"><circle cx="200" cy="200" r="50" /></clipPath>
-                            <linearGradient id="axiom-grad" x1="0%" y1="0%" x2="0%" y2="100%">
-                                <stop offset="0%" style="stop-color:#ffffff;stop-opacity:1" />
-                                <stop offset="100%" style="stop-color:#888888;stop-opacity:1" />
-                            </linearGradient>
-                            <linearGradient id="leeway-grad" x1="0%" y1="0%" x2="100%" y2="0%">
-                                <stop offset="0%" style="stop-color:#ff0000;stop-opacity:1" />
-                                <stop offset="25%" style="stop-color:#ff8800;stop-opacity:1" />
-                                <stop offset="50%" style="stop-color:#00ff00;stop-opacity:1" />
-                                <stop offset="75%" style="stop-color:#ff8800;stop-opacity:1" />
-                                <stop offset="100%" style="stop-color:#ff0000;stop-opacity:1" />
-                            </linearGradient>
-                            <linearGradient id="leeway-night-grad" x1="0%" y1="0%" x2="100%" y2="0%">
-                                <stop offset="0%" style="stop-color:#ff0000;stop-opacity:1" />
-                                <stop offset="50%" style="stop-color:#330000;stop-opacity:1" />
-                                <stop offset="100%" style="stop-color:#ff0000;stop-opacity:1" />
-                            </linearGradient>
-                            <clipPath id="leeway-clip">
-                                <rect id="leeway-mask-rect" x="125" y="0" width="0" height="12" rx="2" />
-                            </clipPath>
-                            <filter id="center-glow" x="-20%" y="-20%" width="140%" height="140%">
-                                <feDropShadow dx="0" dy="0" stdDeviation="8" flood-color="#aaaaaa" flood-opacity="0.5" />
-                            </filter>
-                        </defs>
-                        
-                        <circle cx="200" cy="200" r="160" fill="#050505" />
-                        <circle cx="200" cy="200" r="125" fill="#121212" />
-                        
-                        <path d="M 82.0 101.0 A 154 154 0 0 1 142.3 57.2" fill="none" stroke="#ff0000" stroke-width="12" />
-                        <path d="M 257.7 57.2 A 154 154 0 0 1 318.0 101.0" fill="none" stroke="#00ff00" stroke-width="12" />
-                        <path d="M 265.1 339.6 A 154 154 0 0 1 134.9 339.6" fill="none" stroke="#ff8800" stroke-width="12" />
-                        
-                        <g id="ticks"></g>
-                        
-                        <g id="tick-labels" fill="#bbb" text-anchor="middle" dominant-baseline="middle" font-family="Arial" font-weight="bold">
-                            <text font-size="16" transform="translate(200, 74)">0</text>
-                            <text font-size="16" transform="translate(326, 200) rotate(90)">90</text>
-                            <text font-size="16" transform="translate(74, 200) rotate(-90)">90</text>
-                            <text font-size="16" transform="translate(200, 326) rotate(180)">180</text>
-                            <text font-size="11" transform="translate(262.5, 91.7) rotate(30)">30</text>
-                            <text font-size="11" transform="translate(308.3, 137.5) rotate(60)">60</text>
-                            <text font-size="11" transform="translate(308.3, 262.5) rotate(120)">120</text>
-                            <text font-size="11" transform="translate(262.5, 308.3) rotate(150)">150</text>
-                            <text font-size="11" transform="translate(137.5, 91.7) rotate(-30)">30</text>
-                            <text font-size="11" transform="translate(91.7, 137.5) rotate(-60)">60</text>
-                            <text font-size="11" transform="translate(91.7, 262.5) rotate(-120)">120</text>
-                            <text font-size="11" transform="translate(137.5, 308.3) rotate(-150)">150</text>
-                        </g>
-                        
-                        <g id="track-pointer" transform="rotate(0, 200, 200)">
-                            <path d="M200,42 L194,58 L206,58 Z" fill="#007aff" stroke="#fff" stroke-width="0.5" />
-                        </g>
-                        
-                        <circle id="fullscreen-hotspot" cx="200" cy="200" r="55" fill="#181818" stroke="#333" stroke-width="1" filter="url(#center-glow)" cursor="pointer" />
-                        
-                        <path id="boat-icon" d="M200,150 Q165,185 170,250 Q165,190 200,173 Q235,190 230,250 Q235,185 200,150 Z"
-                              fill="url(#axiom-grad)" transform="translate(0, 5)" clip-path="url(#boat-clip)" style="pointer-events: none;" />
-                        
-                        <g id="aws-display-group" transform="translate(200, 265)">
-                            <text x="0" y="0" fill="#777" font-size="10" font-weight="bold" text-anchor="middle" text-transform="uppercase">Apparent Wind kts</text>
-                            <text id="aws-val-svg" x="0" y="42" fill="#fff" font-size="52" font-weight="bold" text-anchor="middle">0.0</text>
-                        </g>
-
-                        <g id="awa-pointer" transform="rotate(0, 200, 200)" opacity="0.9">
-                            <path d="M 200,70 L 213,95 L 200,145 L 187,95 Z" fill="#ff8c00" stroke="#000" stroke-width="1" />
-                            <text x="200" y="90" fill="#000" font-size="10" font-weight="900" text-anchor="middle" font-family="Arial Black">A</text>
-                        </g>
-
-                        <g id="twa-pointer" transform="rotate(0, 200, 200)" opacity="0.9">
-                            <path d="M 200,92 A 8,8 0 0 1 208,100 C 208,108 200,128 200,128 C 200,128 192,108 192,100 A 8,8 0 0 1 200,92 Z"
-                                  fill="#ffff00" stroke="#000" stroke-width="0.8" />
-                            <text x="200" y="106" fill="#000" font-size="9" font-weight="900" text-anchor="middle" font-family="Arial Black">T</text>
-                            <circle id="trend-gauge-cw"  cx="215" cy="110" r="4" fill="#bbb" />
-                            <circle id="trend-gauge-ccw" cx="185" cy="110" r="4" fill="#bbb" />
-                        </g>
-                        
-                        <g transform="translate(75, 395)">
-                            <text x="125" y="-12" id="leeway-val" fill="#aaa" font-size="11" text-anchor="middle" font-weight="bold">LEEWAY: 0.0&deg;</text>
-                            <rect x="0" y="0" width="250" height="12" fill="#222" rx="3" />
-                            <rect x="0" y="0" width="250" height="12" fill="url(#leeway-grad)" clip-path="url(#leeway-clip)" rx="3" />
-                            <g stroke="#555" stroke-width="1">
-                                <line x1="0" y1="-2" x2="0" y2="14" /><line x1="62.5" y1="2" x2="62.5" y2="10" />
-                                <line x1="125" y1="-2" x2="125" y2="14" /><line x1="187.5" y1="2" x2="187.5" y2="10" />
-                                <line x1="250" y1="-2" x2="250" y2="14" />
-                            </g>
-                            <g fill="#555" font-size="8" text-anchor="middle" font-weight="bold">
-                                <text x="0" y="24">-20&deg;</text><text x="62.5" y="24">-10</text>
-                                <text x="125" y="24">0&deg;</text><text x="187.5" y="24">10</text>
-                                <text x="250" y="24">20&deg;</text>
-                            </g>
-                        </g>
-                    </svg>
-
-                    <!-- BUSSOLA 2: RADAR HISTORICAL (Nascosto all'avvio) -->
-                    <svg id="wind-radar" viewBox="35 38 330 395" preserveAspectRatio="xMidYMid meet" style="display: none;">
-                        <defs id="radar-gradients">
-                            <clipPath id="radar-boat-clip"><circle cx="200" cy="200" r="50" /></clipPath>
-                            <filter id="radar-center-glow" x="-20%" y="-20%" width="140%" height="140%">
-                                <feDropShadow dx="0" dy="0" stdDeviation="8" flood-color="#aaaaaa" flood-opacity="0.5" />
-                            </filter>
-                        </defs>
-                        
-                        <circle cx="200" cy="200" r="160" fill="rgb(252, 252, 252)" />
-                        <circle cx="200" cy="200" r="125" fill="rgb(240, 240, 240)" />
-                        
-                        <g id="radar-ticks"></g>
-                        
-                        <g id="radar-tick-labels" fill="#000000" text-anchor="middle" dominant-baseline="middle" font-family="Arial" font-weight="bold">
-                            <text font-size="16" transform="translate(200, 74)">N</text>
-                            <text font-size="16" transform="translate(326, 200) rotate(90)">E</text>
-                            <text font-size="16" transform="translate(74, 200) rotate(-90)">W</text>
-                            <text font-size="16" transform="translate(200, 326) rotate(180)">S</text>
-                            
-                            <text font-size="11" transform="translate(262.5, 91.7) rotate(30)">30</text>
-                            <text font-size="11" transform="translate(308.3, 137.5) rotate(60)">60</text>
-                            <text font-size="11" transform="translate(308.3, 262.5) rotate(120)">120</text>
-                            <text font-size="11" transform="translate(262.5, 308.3) rotate(150)">150</text>
-                            <text font-size="11" transform="translate(137.5, 91.7) rotate(-30)">330</text>
-                            <text font-size="11" transform="translate(91.7, 137.5) rotate(-60)">300</text>
-                            <text font-size="11" transform="translate(91.7, 262.5) rotate(-120)">240</text>
-                            <text font-size="11" transform="translate(137.5, 308.3) rotate(-150)">210</text>
-                        </g>
-
-                        <circle id="ora-orbit" cx="200" cy="200" r="67.2" fill="none" stroke="#cfd8dc" stroke-width="1.2" stroke-dasharray="4, 4" />
-                        <g id="radar-rings"></g>
-
-                        <circle id="radar-hotspot" cx="200" cy="200" r="55" fill="rgb(238, 238, 238)" stroke="#e0e0e0" stroke-width="1" filter="url(#radar-center-glow)" cursor="pointer" />
-                        <path id="radar-boat-icon" d="M200,150 Q165,185 170,250 Q165,190 200,173 Q235,190 230,250 Q235,185 200,150 Z"
-                              fill="#000000" transform="translate(0, 5)" clip-path="url(#radar-boat-clip)" style="pointer-events: none;" />
-                    </svg>
-                </div>
-
-        <!-- COLONNA DESTRA -->
-        <!-- NOTA: Etichetta a SX e Unità a DX nel codice, il CSS usa row-reverse per specchiarli sul bordo -->
-        <div class="data-box box-depth">
-            <div class="label-row"><span class="label">DEPTH</span><span class="unit">m</span></div>
-            <span class="value" id="depth">--.-</span>
-            <div class="graph-wrapper">
-                <div class="scale-labels" id="depth-scale"></div>
-                <svg class="sparkline" id="depth-graph" viewBox="0 0 200 40" preserveAspectRatio="none"></svg>
-            </div>
-        </div>
-
-        <div class="data-box box-tws">
-            <div class="label-row">
-                <span class="label" id="tws-aws-label">TWS</span>
-                <span class="unit">kts</span>
-            </div>
-            <span class="value" id="tws">0.0</span>
-            <div class="graph-wrapper">
-                <div class="scale-labels" id="tws-scale"></div>
-                <svg class="sparkline" id="tws-graph" viewBox="0 0 200 40" preserveAspectRatio="none"></svg>
-            </div>
-        </div>
-
-        <div class="data-box box-twa">
-            <div class="label-row"><span class="label">TWA (MEAN)</span></div>
-            <span class="value-large" id="twa-avg">---&deg;</span>
-        </div>
-
-        <div class="data-box box-awa">
-            <div class="label-row"><span class="label">AWA (MEAN)</span></div>
-            <span class="value-large" id="awa-avg">---&deg;</span>
-        </div>
-
-        <div class="data-box box-twd">
-            <div class="label-row"><span class="label">TWD (MEAN)</span></div>
-            <div class="value-with-compass">
-                <svg class="mini-compass" viewBox="0 0 40 40">
-                    <circle cx="20" cy="20" r="18.5" fill="none" stroke="rgba(0,0,0,0.1)" stroke-width="1.2"/>
-                    <text x="20" y="8" fill="#e74c3c" font-size="5.5" text-anchor="middle" font-weight="900">N</text>
-                    <text x="20" y="36" fill="#000" font-size="5.5" text-anchor="middle" font-weight="900">S</text>
-                    <g id="twd-boat-wrap" transform="rotate(0, 20, 20)">
-                        <path d="M 20,17 L 17,26 L 20,24.5 L 23,26 Z" fill="#000" opacity="0.3" />
-                    </g>
-                    <g id="twd-arrow" transform="rotate(0, 20, 20)">
-                        <path id="twd-wind-chevron" d="M 17,5 L 20,7.5 L 23,5" fill="none" stroke="#000" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round" />
-                        <circle id="trend-dot-cw" cx="24" cy="7.5" r="1.5" fill="#bbb" />
-                        <circle id="trend-dot-ccw" cx="16" cy="7.5" r="1.5" fill="#bbb" />
-                    </g>
-                </svg>
-                <span class="value-large" id="twd-avg">---&deg;</span>
-            </div>
-        </div>
-    </div>
-    <script src="utils.js"></script>
-    <script src="charts.js"></script>
-    <script src="gauge.js"></script>
-    <script src="weather-radar.js"></script>
-    <script src="app.js?v=6.0"></script>
-</body>
+    <!-- Favicon & Home screen bookmark icons -->
+    <link rel="icon" type="image/png" href="./icons/dash.png" />
+    <link rel="apple-touch-icon" href="./icons/dash.png" />
+    <title>Sailing Dashboard Pro</title>
+  </head>
+  <body>
+    <div id="root"></div>
+    <script type="module" src="/src/main.tsx"></script>
+  </body>
 </html>