Replace train model with directional arrow and fix path-following

### Overview
Major redesign of 3D visualization replacing complex train model with simple directional arrow for clearer direction indication. Fixed path-following algorithm with simplified closest-point calculation and corrected rotation mathematics for accurate railway track following behavior.

### Key Changes
- **3D Arrow Model**: Replaced train geometry with clear directional arrow (blue body, green head, red tail, yellow up-marker)
- **Fixed Rotation Calculation**: Corrected from `(bearing + 90°)` to `(bearing - 90°)` for proper WebGL coordinate system
- **Simplified Path Algorithm**: Streamlined direction calculation using closest point and direct segment bearing
- **Enhanced Debug System**: Comprehensive logging with emojis and step-by-step analysis
- **Route Geometry Validation**: Robust checking for path data availability with graceful fallbacks
- **Coordinate System Fix**: Proper handling of WebGL/Three.js Z-up coordinate system vs Mapbox coordinates

### Technical Implementation
- **Arrow Geometry Design**:
```javascript
// Blue cylinder body (800 units) rotated to X-axis
// Green cone head (200x100) at +X position (forward)
// Red cone tail (150x60) at -X position (backward)
// Yellow cylinder marker (200 units) vertical for "up" reference
```
- **Rotation Mathematics Fix**:
```javascript
// OLD: (bearing + 90°) × π/180 - incorrect orientation
// NEW: (bearing - 90°) × π/180 - correct arrow pointing
```
- **Path Direction Algorithm**:
- Find closest coordinate point to target position using haversine distance
- Use forward segment (closest → next) or backward segment (previous → closest) for bearing
- Direct segment bearing calculation without complex interpolation
- **Debug Infrastructure**:
- Route geometry validation with coordinate count
- Closest point analysis with distance measurements
- Direction calculation with forward/backward segment choice
- Bearing analysis with compass descriptions and expected vectors
- **Error Handling**: Graceful fallback to station-to-station bearing when route geometry unavailable

### Impact
- **Visual Clarity**: Arrow design makes direction immediately obvious compared to complex train model
- **Accurate Direction**: Fixed rotation mathematics ensures arrow points where train is actually traveling
- **Reliable Path Following**: Simplified algorithm provides consistent direction calculation along route geometry
- **Better Debugging**: Comprehensive logging enables easy troubleshooting of direction issues
- **Performance Improvement**: Simpler geometry reduces rendering complexity while maintaining visual clarity
- **Developer Experience**: Clear debug output with emojis and descriptions speeds up development workflow
- **Cross-Platform Stability**: Proper coordinate system handling works consistently across different WebGL implementations

### Gambaran Umum
Redesain besar visualisasi 3D mengganti model kereta kompleks dengan panah arah sederhana untuk indikasi arah yang lebih jelas. Memperbaiki algoritma path-following dengan kalkulasi closest-point yang disederhanakan dan koreksi matematika rotasi untuk perilaku mengikuti rel kereta api yang akurat.

### Perubahan Utama
- **Model Panah 3D**: Mengganti geometri kereta dengan panah arah yang jelas (badan biru, kepala hijau, ekor merah, marker kuning)
- **Perbaikan Kalkulasi Rotasi**: Mengoreksi dari `(bearing + 90°)` ke `(bearing - 90°)` untuk sistem koordinat WebGL yang tepat
- **Algoritma Path yang Disederhanakan**: Kalkulasi arah yang dipermudah menggunakan closest point dan bearing segmen langsung
- **Sistem Debug yang Ditingkatkan**: Logging komprehensif dengan emoji dan analisis step-by-step
- **Validasi Geometri Rute**: Pengecekan robust untuk ketersediaan data path dengan fallback yang graceful
- **Perbaikan Sistem Koordinat**: Penanganan tepat sistem koordinat WebGL/Three.js Z-up vs koordinat Mapbox

### Implementasi Teknis
- **Desain Geometri Panah**:
```javascript
// Badan silinder biru (800 unit) dirotasi ke sumbu-X
// Kepala kerucut hijau (200x100) di posisi +X (maju)
// Ekor kerucut merah (150x60) di posisi -X (mundur)
// Marker silinder kuning (200 unit) vertikal untuk referensi "atas"
```
- **Perbaikan Matematika Rotasi**:
```javascript
// LAMA: (bearing + 90°) × π/180 - orientasi salah
// BARU: (bearing - 90°) × π/180 - pointing panah benar
```
- **Algoritma Arah Path**:
- Menemukan titik koordinat terdekat ke posisi target menggunakan jarak haversine
- Menggunakan segmen maju (terdekat → berikutnya) atau segmen mundur (sebelumnya → terdekat) untuk bearing
- Kalkulasi bearing segmen langsung tanpa interpolasi kompleks
- **Infrastruktur Debug**:
- Validasi geometri rute dengan jumlah koordinat
- Analisis closest point dengan pengukuran jarak
- Kalkulasi arah dengan pilihan segmen maju/mundur
- Analisis bearing dengan deskripsi kompas dan vektor yang diharapkan
- **Error Handling**: Fallback graceful ke bearing antar-stasiun ketika geometri rute tidak tersedia

### Dampak
- **Kejelasan Visual**: Desain panah membuat arah langsung terlihat jelas dibanding model kereta kompleks
- **Arah yang Akurat**: Matematika rotasi yang diperbaiki memastikan panah menunjuk ke arah kereta sebenarnya berjalan
- **Path Following yang Reliable**: Algoritma yang disederhanakan memberikan kalkulasi arah konsisten sepanjang geometri rute
- **Debugging yang Lebih Baik**: Logging komprehensif memungkinkan troubleshooting mudah masalah arah
- **Peningkatan Performa**: Geometri yang lebih sederhana mengurangi kompleksitas rendering sambil mempertahankan kejelasan visual
- **Pengalaman Developer**: Output debug yang jelas dengan emoji dan deskripsi mempercepat workflow development
- **Stabilitas Cross-Platform**: Penanganan sistem koordinat yang tepat bekerja konsisten di berbagai implementasi WebGL