body {
    font-family: Arial, sans-serif;
    text-align: center;
    background-color: #f0f8ff;
    overflow: hidden; /* ซ่อน scrollbar */
}

#train-selection {
    background-color: #e0e0e0;
    padding: 10px;
    margin-bottom: 20px;
    border-radius: 10px;
}

.train-part {
    width: 100px;
    cursor: grab;
    margin: 0 10px;
}

#game-world {
    position: relative;
    width: 100%;
    height: 300px;
    margin: 0 auto;
    overflow: hidden;
    border: 2px solid #333;
}

#scenery {
    background-image: url('https://i.imgur.com/O6E42Tj.png');
    background-size: cover;
    width: 200%; /* ทำให้พื้นหลังกว้างพอที่จะเลื่อนได้ */
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    /* animation จะถูกเพิ่มโดย JavaScript */
}

#track-container {
    position: absolute;
    bottom: 50px; /* ตำแหน่งของรางรถไฟ */
    width: 100%;
    height: 150px;
    display: flex;
    align-items: flex-end;
    padding-left: 20px;
}

#track-container .train-part-placed {
    width: 100px;
    margin-right: -15px; /* ทำให้ตู้รถไฟซ้อนกันเล็กน้อย */
    position: relative;
    z-index: 1;
}

#controls button {
    font-size: 1.2em;
    padding: 10px 20px;
    margin: 20px 10px;
    cursor: pointer;
}

/* Animation สำหรับพื้นหลัง */
.scenery-running {
    animation: slide-scenery 10s linear infinite;
}

@keyframes slide-scenery {
    from { transform: translateX(0); }
    to { transform: translateX(-50%); }
}