/* Grund-Styling für den Viewport */
#viewport {
    cursor: default;
    user-select: none;
    -webkit-tap-highlight-color: transparent;
}

/* Basis-Klasse für alle beweglichen Objekte (Kiesel, Gras, Busch) */
.game-asset {
    position: absolute;
    /* Optimiert die Performance für mobile Geräte (iPad) */
    will-change: transform, top, left;
    pointer-events: none;
}

/* Größe und Aussehen des Pfads */
#pfad-container {
    position: absolute;
    bottom: 0;
    left: 50%;
	transform: translateX(-50%);    
	width: 100%;
    height: 90vh;
    transform-origin: bottom;
}

#pfad-container img {
    width: 100%;
    height: 100%;
    object-fit: fill;
}

/* Z-Index Logik: 
   26: Kiesel (liegen oben auf dem Pfad)
   24: Pflanzen (liegen seitlich, leicht "hinter" der Pfad-Kante)
*/
.layer-path { 
    z-index: 25; 
    /* Ein scharfer, dunkler Schatten direkt unter dem Stein */
    filter: drop-shadow(0 4px 2px rgba(0,0,0,0.5)); 
}

.layer-side { 
    z-index: 24; 
    /* Ein weicherer Schatten für Pflanzen */
    filter: drop-shadow(0 2px 3px rgba(0,0,0,0.3)); 
}

/* Versteckt Scrollbars auf dem iPad */
body {
    -ms-overflow-style: none;
    scrollbar-width: none;
}
body::-webkit-scrollbar {
    display: none;
}