Clean up mech template

public/assets/images/counters.svg

@@ -72,23 +72,24 @@
     </g>
   </g>
 
-  <g id="mech-template">
-    <mask id="mech-template-mask">
-      <circle fill="white" r="36.5"/>
-      <rect x="-16.25" y="-18" width="34.5" height="36" fill="black"/>
-    </mask>
-    <g transform="rotate(0) translate(-2.25, 0)" style="pointer-events: none;">
-      <circle style="stroke: red; stroke-opacity: 0.5; pointer-events: none;" r="36.5"/>
-      <rect style="fill: red; fill-opacity: 0.5;" x="-16.25" y="5.75" width="34.5" height="12.25"/>
-      <rect style="fill: red; fill-opacity: 0.5;" x="-16.25" y="5.75" width="34.5" height="12.25" transform="scale(1 -1)"/>
-      <polyline points="-23,-3 -25,0 -23,3" style="stroke: black;"/>
-      <g mask="url(#mech-template-mask)" style="stroke: white; stroke-opacity: 0.5;">
-        <path d="M -4,0 L -32.55,-16.5 A 36.5 36.5 0 0 0 -32.55,16.5 Z"/>
-        <path d="M 4,0 L 32.55,-16.5 A 36.5 36.5 0 0 1 32.55,16.5 Z"/>
-        <path d="M 0,2.3 L -32.55,-16.5 A 36.5 36.5 0 0 1 0,-36.5 Z"/>
-        <path d="M 0,-2.3 L -32.55,16.5 A 36.5 36.5 0 0 0 0,36.5 Z"/>
-        <path d="M 0,2.3 L 32.55,-16.5 A 36.5 36.5 0 0 0 0,-36.5 Z"/>
-        <path d="M 0,-2.3 L 32.55,16.5 A 36.5 36.5 0 0 1 0,36.5 Z"/>
+  <g id="mech-template" style="pointer-events: none;">
+    <clipPath id="mech-template-clip-path" fill="white" r="36.5">
+      <circle r="36.5"/>
+    </clipPath>
+    <g transform="rotate(0)">
+      <image href="mech_template.png" width="77" height="77" transform="translate(-38.75, -38.5)" style="opacity: 0.2"/>
+      <g class="feet" style="fill: red; fill-opacity: 0.5;">
+        <rect class="left" x="-16.25" y="5.75" width="34.5" height="12.25"/>
+        <rect class="right" x="-16.25" y="5.75" width="34.5" height="12.25" transform="scale(1 -1)"/>
+      </g>
+      <g style="stroke: red; stroke-opacity: 0.5">
+        <circle r="36.5"/>
+        <polyline points="-20,-3 -22,0 -20,3" fill="none"/>
+        <g clip-path="url(#mech-template-clip-path)">
+          <path class="front" d="M -34.64,-15 -21.65,-7.5 M -34.64,15 -21.65,7.5"/>
+          <path class="side" d="M -4.33,-37.5 -4.33,-22.5 M -4.33,37.5 -4.33,22.5"/>
+          <path class="rear" d="M 34.64,-15 21.65,-7.5 M 34.64,15 21.65,7.5"/>
+        </g>
       </g>
     </g>
   </g>

public/assets/images/map4.svg

@@ -42,11 +42,12 @@
         <text class="elevation" x="34" y="56">1</text>
       </g>
     </g>
+    <use href="counters.svg#mech-template"/>
   </defs>
 
   <g class="gameboard">
     <g class="grid">
-      <g class="mapsheets" data-width="8" data-height="8">
+      <g class="mapsheets" data-width="24" data-height="16">
         <g><use class="mapsheet" href="#mapsheet"/></g>
       </g>
     </g>