diff --git a/components/src/ChartList/ChartList.svelte b/components/src/ChartList/ChartList.svelte
index cf179fbf..d59d4626 100644
--- a/components/src/ChartList/ChartList.svelte
+++ b/components/src/ChartList/ChartList.svelte
@@ -49,12 +49,6 @@
 </main>
 
 <style>
-	:global(*) {
-		margin: 0;
-		padding: 0;
-		box-sizing: border-box;
-		color: inherit;
-	}
 	main {
 		display: flex;
 		justify-content: center;
diff --git a/components/src/maplibre/AttributionControl/AttributionControl.svelte b/components/src/maplibre/AttributionControl/AttributionControl.svelte
index 59880de4..06c6cd64 100644
--- a/components/src/maplibre/AttributionControl/AttributionControl.svelte
+++ b/components/src/maplibre/AttributionControl/AttributionControl.svelte
@@ -17,7 +17,7 @@
 	})}
 />
 
-<style>
+<style lang="scss">
 	:global {
 		.maplibregl-ctrl.maplibregl-ctrl-attrib {
 			font-size: var(--fs-small-3);
diff --git a/components/src/maplibre/GeocoderControl/GeocoderControl.svelte b/components/src/maplibre/GeocoderControl/GeocoderControl.svelte
index b9d35753..5e66c52c 100644
--- a/components/src/maplibre/GeocoderControl/GeocoderControl.svelte
+++ b/components/src/maplibre/GeocoderControl/GeocoderControl.svelte
@@ -57,7 +57,7 @@
 
 <MapControl control={geocoder} position="top-left" />
 
-<style>
+<style lang="scss">
 	:global {
 		.maplibregl-ctrl-geocoder {
 			background-color: #fff;
diff --git a/components/src/maplibre/Map/Map.svelte b/components/src/maplibre/Map/Map.svelte
index 077cca6b..a6c92c6c 100644
--- a/components/src/maplibre/Map/Map.svelte
+++ b/components/src/maplibre/Map/Map.svelte
@@ -113,7 +113,7 @@
 	{/if}
 </div>
 
-<style>
+<style lang="scss">
 	.container {
 		width: 100%;
 		height: 100%;
diff --git a/components/src/maplibre/NavigationControl/NavigationControl.svelte b/components/src/maplibre/NavigationControl/NavigationControl.svelte
index 7b08a9e3..b0612852 100644
--- a/components/src/maplibre/NavigationControl/NavigationControl.svelte
+++ b/components/src/maplibre/NavigationControl/NavigationControl.svelte
@@ -19,7 +19,7 @@
 
 <MapControl control={new maplibre.NavigationControl({ showCompass, visualizePitch })} {position} />
 
-<style>
+<style lang="scss">
 	:global {
 		button.maplibregl-ctrl-zoom-out .maplibregl-ctrl-icon {
 			background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='29' height='29' viewBox='0 0 29 29' xmlns='http://www.w3.org/2000/svg' fill='%23333'%3E%3Cpath d='M10 13c-.75 0-1.5.75-1.5 1.5S9.25 16 10 16h9c.75 0 1.5-.75 1.5-1.5S19.75 13 19 13h-9z'/%3E%3C/svg%3E");
diff --git a/components/src/maplibre/ScaleControl/ScaleControl.svelte b/components/src/maplibre/ScaleControl/ScaleControl.svelte
index 7eac37d8..8cf874cb 100644
--- a/components/src/maplibre/ScaleControl/ScaleControl.svelte
+++ b/components/src/maplibre/ScaleControl/ScaleControl.svelte
@@ -12,7 +12,7 @@
 
 <MapControl control={new maplibre.ScaleControl({ maxWidth, unit })} {position} />
 
-<style>
+<style lang="scss">
 	:global {
 		.maplibregl-ctrl-scale {
 			color: inherit;
diff --git a/components/src/maplibre/Tooltip/Tooltip.svelte b/components/src/maplibre/Tooltip/Tooltip.svelte
index f8edd203..bb486858 100644
--- a/components/src/maplibre/Tooltip/Tooltip.svelte
+++ b/components/src/maplibre/Tooltip/Tooltip.svelte
@@ -67,7 +67,7 @@
 	{@render children?.()}
 </div>
 
-<style>
+<style lang="scss">
 	.container {
 		background: white;
 		padding: 0.75em;