diff --git a/layouts/shortcodes/world-map.html b/layouts/shortcodes/world-map.html
index 7c28a38..1a67a44 100644
--- a/layouts/shortcodes/world-map.html
+++ b/layouts/shortcodes/world-map.html
@@ -5,8 +5,8 @@
 .ifk-map-wrap { max-width: 100%; margin: 2rem 0; }
 .ifk-map-wrap h3 { text-align: center; margin-bottom: 0.5rem; font-size: 1.25rem; }
 .ifk-map-subtitle { text-align: center; color: #666; font-size: 0.85rem; margin-bottom: 1rem; }
-.ifk-map-container { position: relative; width: 100%; height: 420px; border-radius: 8px; overflow: hidden; background: #fff; }
-.ifk-map-svg { width: 100%; height: 100%; display: block; cursor: grab; }
+.ifk-map-container { position: relative; width: 100%; height: 420px; border-radius: 8px; overflow: hidden; background: #c8d3df; }
+.ifk-map-svg { width: 100%; height: 100%; display: block; cursor: grab; shape-rendering: crispEdges; }
 .ifk-map-svg:active { cursor: grabbing; }
 .ifk-map-svg .country { stroke: #94a3b8; stroke-width: 0.3; transition: stroke-width 0.15s; }
 .ifk-map-svg .country.has-data:hover { stroke: #667eea; stroke-width: 1.2; cursor: pointer; }
@@ -33,7 +33,7 @@
   <h3>{{ if eq $lang "de" }}Interaktive Weltkarte: Kinderschutzgesetze{{ else if eq $lang "fr" }}Carte interactive : lois de protection de l'enfance{{ else }}Interactive Map: Child Protection Laws{{ end }}</h3>
   <p class="ifk-map-subtitle">{{ if eq $lang "de" }}Klicken Sie auf ein Land für Details{{ else if eq $lang "fr" }}Cliquez sur un pays pour plus de détails{{ else }}Click a country for details{{ end }}</p>
   <div class="ifk-map-container" id="ifk-map-container">
-    <svg class="ifk-map-svg" id="ifk-map-svg" xmlns="http://www.w3.org/2000/svg"></svg>
+    <svg class="ifk-map-svg" id="ifk-map-svg" xmlns="http://www.w3.org/2000/svg" shape-rendering="crispEdges"></svg>
     <div class="ifk-map-controls">
       <button id="ifk-zoom-in" title="Zoom in">+</button>
       <button id="ifk-zoom-out" title="Zoom out">&minus;</button>
@@ -117,14 +117,7 @@
       var geo = topojson.feature(topo, topo.objects.countries);
       var borders = topojson.mesh(topo, topo.objects.countries, function(a, b) { return a !== b; });
 
-      // Ocean background
-      var ocean = document.createElementNS('http://www.w3.org/2000/svg', 'rect');
-      ocean.setAttribute('width', W);
-      ocean.setAttribute('height', H);
-      ocean.setAttribute('fill', '#c8d3df');
-      svg.appendChild(ocean);
-
-      // Country fills
+      // Country fills (ocean is CSS background on container)
       geo.features.forEach(function(f) {
         var id = String(f.id).padStart(3, '0');
         var c = byIsoNum[id];