diff --git a/.github/workflows/e2e.yml b/.github/workflows/e2e.yml
index a5b861a4..d9f9719f 100644
--- a/.github/workflows/e2e.yml
+++ b/.github/workflows/e2e.yml
@@ -19,9 +19,9 @@ jobs:
     timeout-minutes: 10
     steps:
       - uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
-      - uses: actions/setup-node@53b83947a5a98c8d113130e565377fae1a50d02f # v6.3.0
+      - uses: actions/setup-node@48b55a011bda9f5d6aeb4c2d9c7362e8dae4041e # v6.4.0
         with:
-          node-version: lts/*
+          node-version: 24
       - run: npm ci --workspace=components --include=dev
       - run: npm run sync --workspace=components
       - run: npm ci --workspace=mock-sveltekit
diff --git a/components/src/maplibre/MapStyle/SWRDataLabDark.stories.svelte b/components/src/maplibre/MapStyle/SWRDataLabDark.stories.svelte
index a3ab4a37..fb768b95 100644
--- a/components/src/maplibre/MapStyle/SWRDataLabDark.stories.svelte
+++ b/components/src/maplibre/MapStyle/SWRDataLabDark.stories.svelte
@@ -80,39 +80,27 @@
 		</div>
 	</DesignTokens>
 </Story>
-<Story asChild name="fix/251">
+
+<Story asChild name="Bodensee z9">
 	<DesignTokens theme="dark">
 		<div class="grid">
 			<div class="container">
-				<Map
-					showDebug
-					style={SWRDataLabDark()}
-					initialLocation={{
-						lng: 10.005803094126804,
-						lat: 53.54086081679415,
-						zoom: 14.215291362684706,
-						pitch: 0
-					}}
-				>
+				<Map showDebug style={SWRDataLabDark()} initialLocation={locations.bodensee}>
 					<AttributionControl position="bottom-left" />
 				</Map>
 			</div>
 		</div>
 	</DesignTokens>
 </Story>
-<Story asChild name="fix/200">
+
+<Story asChild name="Frankfurt z11">
 	<DesignTokens theme="dark">
 		<div class="grid">
 			<div class="container">
 				<Map
 					showDebug
-					style={SWRDataLabDark()}
-					initialLocation={{
-						lng: 8.96467732459405,
-						lat: 48.93101909877453,
-						zoom: 13.507311695217375,
-						pitch: 0
-					}}
+					style={SWRDataLabDark({ enableBuildingExtrusions: true })}
+					initialLocation={locations.frankfurt}
 				>
 					<AttributionControl position="bottom-left" />
 				</Map>
@@ -120,38 +108,36 @@
 		</div>
 	</DesignTokens>
 </Story>
-<Story asChild name="fix/173">
+<Story asChild name="Berlin z12">
 	<DesignTokens theme="dark">
 		<div class="grid">
 			<div class="container">
-				<Map showDebug style={SWRDataLabDark()} initialLocation={{ ...locations.berlin, zoom: 11 }}>
+				<Map showDebug style={SWRDataLabDark()} initialLocation={locations.berlin}>
 					<AttributionControl position="bottom-left" />
 				</Map>
 			</div>
 		</div>
 	</DesignTokens>
 </Story>
-
-<Story asChild name="Bodensee z9">
+<Story asChild name="Stuttgart z13">
 	<DesignTokens theme="dark">
 		<div class="grid">
 			<div class="container">
-				<Map showDebug style={SWRDataLabDark()} initialLocation={locations.bodensee}>
+				<Map showDebug style={SWRDataLabDark()} initialLocation={locations.stugge}>
 					<AttributionControl position="bottom-left" />
 				</Map>
 			</div>
 		</div>
 	</DesignTokens>
 </Story>
-
-<Story asChild name="Frankfurt z11">
+<Story asChild name="Baden-Baden z15">
 	<DesignTokens theme="dark">
 		<div class="grid">
 			<div class="container">
 				<Map
 					showDebug
-					style={SWRDataLabDark({ enableBuildingExtrusions: true })}
-					initialLocation={locations.frankfurt}
+					style={SWRDataLabDark({ enableBuildingExtrusions: false, enableHillshade: true })}
+					initialLocation={locations.badenBaden}
 				>
 					<AttributionControl position="bottom-left" />
 				</Map>
@@ -159,36 +145,47 @@
 		</div>
 	</DesignTokens>
 </Story>
-<Story asChild name="Berlin z12">
+<Story asChild name="Motorway Interchange z14">
 	<DesignTokens theme="dark">
 		<div class="grid">
 			<div class="container">
-				<Map showDebug style={SWRDataLabDark()} initialLocation={locations.berlin}>
+				<Map showDebug style={SWRDataLabDark()} initialLocation={locations.motorwayz14}>
 					<AttributionControl position="bottom-left" />
 				</Map>
 			</div>
 		</div>
 	</DesignTokens>
 </Story>
-<Story asChild name="Stuttgart z13">
+<Story asChild name="Building Extrusions">
 	<DesignTokens theme="dark">
 		<div class="grid">
 			<div class="container">
-				<Map showDebug style={SWRDataLabDark()} initialLocation={locations.stugge}>
+				<Map
+					showDebug
+					style={SWRDataLabDark({ enableBuildingExtrusions: true })}
+					maxZoom={20}
+					initialLocation={locations.buildings}
+				>
+					<GeocoderControl languages="de" service="maptiler" key="V32kPHZjMa0Mkn6YvSzA" />
 					<AttributionControl position="bottom-left" />
 				</Map>
 			</div>
 		</div>
 	</DesignTokens>
 </Story>
-<Story asChild name="Baden-Baden z15">
+<Story asChild name="fix/251">
 	<DesignTokens theme="dark">
 		<div class="grid">
 			<div class="container">
 				<Map
 					showDebug
-					style={SWRDataLabDark({ enableBuildingExtrusions: false, enableHillshade: true })}
-					initialLocation={locations.badenBaden}
+					style={SWRDataLabDark()}
+					initialLocation={{
+						lng: 10.005803094126804,
+						lat: 53.54086081679415,
+						zoom: 14.215291362684706,
+						pitch: 0
+					}}
 				>
 					<AttributionControl position="bottom-left" />
 				</Map>
@@ -196,28 +193,52 @@
 		</div>
 	</DesignTokens>
 </Story>
-<Story asChild name="Motorway Interchange z14">
+<Story asChild name="fix/200">
 	<DesignTokens theme="dark">
 		<div class="grid">
 			<div class="container">
-				<Map showDebug style={SWRDataLabDark()} initialLocation={locations.motorwayz14}>
+				<Map
+					showDebug
+					style={SWRDataLabDark()}
+					initialLocation={{
+						lng: 8.96467732459405,
+						lat: 48.93101909877453,
+						zoom: 13.507311695217375,
+						pitch: 0
+					}}
+				>
 					<AttributionControl position="bottom-left" />
 				</Map>
 			</div>
 		</div>
 	</DesignTokens>
 </Story>
-<Story asChild name="Building Extrusions">
+<Story asChild name="fix/173">
+	<DesignTokens theme="dark">
+		<div class="grid">
+			<div class="container">
+				<Map showDebug style={SWRDataLabDark()} initialLocation={{ ...locations.berlin, zoom: 11 }}>
+					<AttributionControl position="bottom-left" />
+				</Map>
+			</div>
+		</div>
+	</DesignTokens>
+</Story>
+<Story asChild name="fix/391">
 	<DesignTokens theme="dark">
 		<div class="grid">
 			<div class="container">
 				<Map
 					showDebug
-					style={SWRDataLabDark({ enableBuildingExtrusions: true })}
+					style={SWRDataLabDark()}
 					maxZoom={20}
-					initialLocation={locations.buildings}
+					initialLocation={{
+						lng: 7.162106315605001,
+						lat: 50.56038132182053,
+						zoom: 13.440582725369412,
+						pitch: 0
+					}}
 				>
-					<GeocoderControl languages="de" service="maptiler" key="V32kPHZjMa0Mkn6YvSzA" />
 					<AttributionControl position="bottom-left" />
 				</Map>
 			</div>
diff --git a/components/src/maplibre/MapStyle/components/Landuse.ts b/components/src/maplibre/MapStyle/components/Landuse.ts
index 5cba58dd..144a9ffb 100644
--- a/components/src/maplibre/MapStyle/components/Landuse.ts
+++ b/components/src/maplibre/MapStyle/components/Landuse.ts
@@ -313,7 +313,7 @@ export default function makeLanduse(tokens): any {
 			'source-layer': 'dam_polygons',
 			filter: ['==', 'kind', 'dam'],
 			paint: {
-				'fill-color': 'hsl(33,0%,95%)',
+				'fill-color': tokens.sand,
 				'fill-opacity': {
 					stops: [
 						[12, 0],
@@ -328,7 +328,7 @@ export default function makeLanduse(tokens): any {
 			'source-layer': 'dam_lines',
 			filter: ['==', 'kind', 'dam'],
 			paint: {
-				'line-color': 'hsl(205,0%,85%)'
+				'line-color': tokens.sand
 			},
 			layout: {
 				'line-cap': 'round',