feat: add train driving system with 3D model and controls

- Added Train and TrainController classes in train.js
- Created TrainRenderer for Three.js visualization
- Integrated train controls into game.js
- Updated index.html with train UI controls
- Added train control styles to css/styles.css
- Created test file for train module
- Train can accelerate, brake, reverse and stop
- Keyboard controls: W/↑ accelerate, S/↓ brake, R/D reverse, SPACE stop

css/styles.css

@@ -119,3 +119,87 @@ button.active {
     pointer-events: none;
     font-size: 0.85rem;
 }
+
+/* === Train Controls Section === */
+#trainControls {
+    background: var(--panel-bg);
+    padding: 15px;
+    margin-top: 20px;
+    border-radius: 8px;
+    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
+}
+
+#trainControls h3 {
+    color: var(--primary-color);
+    margin-bottom: 15px;
+    font-size: 1.1rem;
+    border-bottom: 2px solid var(--primary-color);
+    padding-bottom: 8px;
+}
+
+.train-btn {
+    display: block;
+    width: 100%;
+    padding: 12px;
+    margin-bottom: 10px;
+    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color-dark) 100%);
+    border: 2px solid var(--secondary-color);
+    color: white;
+    font-weight: bold;
+    border-radius: 6px;
+    cursor: pointer;
+    transition: all 0.3s ease;
+    text-align: center;
+    font-size: 0.9rem;
+}
+
+.train-btn:hover {
+    background: linear-gradient(135deg, var(--primary-color) 0%, var(--secondary-color-dark) 100%);
+    border-color: var(--primary-color);
+    transform: translateY(-2px);
+    box-shadow: 0 4px 12px rgba(255, 107, 0, 0.4);
+}
+
+.train-btn:active {
+    transform: translateY(0);
+    box-shadow: 0 2px 6px rgba(255, 107, 0, 0.3);
+}
+
+#trainStatus {
+    background: rgba(255, 255, 255, 0.1);
+    padding: 12px;
+    margin-top: 12px;
+    border-radius: 6px;
+    font-size: 0.85rem;
+    border-left: 4px solid var(--primary-color);
+}
+
+#trainStatus p {
+    margin: 5px 0;
+    line-height: 1.5;
+}
+
+#trainStatus strong {
+    color: var(--primary-color);
+}
+
+/* Train animation indicator */
+.train-moving-indicator {
+    display: inline-block;
+    width: 8px;
+    height: 8px;
+    background: #00ff00;
+    border-radius: 50%;
+    margin-right: 8px;
+    animation: blink 1s infinite;
+}
+
+@keyframes blink {
+    0%, 100% { opacity: 1; }
+    50% { opacity: 0.3; }
+}
+
+/* Train status colors */
+.status-moving { color: #00ff00; }
+.status-stopped { color: #ff0000; }
+.status-reversing { color: #ff8800; }