@polderlabs/openkan 0.4.0

package/dist/web/brand/empty-tasks.svg

@@ -0,0 +1,17 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 200" width="320" height="200" role="img" aria-label="No tasks yet">
+  <title>No tasks</title>
+  <desc>Three thin column bars with a hovering card and a downward arrow.</desc>
+  <!-- Three thin column bars at the bottom -->
+  <rect x="64"  y="88" width="18" height="96" rx="4" fill="#e6ebf3" fill-opacity="0.18" stroke="#748098" stroke-width="1"/>
+  <rect x="124" y="88" width="18" height="96" rx="4" fill="#e6ebf3" fill-opacity="0.18" stroke="#748098" stroke-width="1"/>
+  <rect x="184" y="88" width="18" height="96" rx="4" fill="#e6ebf3" fill-opacity="0.18" stroke="#748098" stroke-width="1"/>
+  <!-- Task-card outline hovering above the middle bar -->
+  <rect x="128" y="44" width="64" height="40" rx="6" fill="#1f242c" stroke="#748098" stroke-width="1"/>
+  <rect x="140" y="60" width="40" height="4" rx="2" fill="#748098"/>
+  <!-- Downward arrow from the card to the middle column -->
+  <path d="M160 96 L160 116 M156 112 L160 116 L164 112" stroke="#FF6B5B" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round"/>
+  <!-- Caption glyph: three small horizontal lines -->
+  <rect x="120" y="172" width="80" height="4" rx="2" fill="#748098"/>
+  <rect x="120" y="180" width="60" height="4" rx="2" fill="#748098"/>
+  <rect x="120" y="188" width="40" height="4" rx="2" fill="#748098"/>
+</svg>

package/dist/web/brand/favicon.svg

@@ -0,0 +1,9 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" width="32" height="32" role="img" aria-label="OpenKan">
+  <title>OpenKan</title>
+  <!-- Vertical bar with 1-unit pad for canvas safety -->
+  <rect x="6" y="5" width="4" height="22" rx="0.5" fill="#FF6B5B"/>
+  <!-- Upper diagonal -->
+  <polygon points="10,16 21,5 24,5 13,16" fill="#FF6B5B"/>
+  <!-- Lower diagonal -->
+  <polygon points="13,16 24,27 21,27 10,16" fill="#FF6B5B"/>
+</svg>

package/dist/web/brand/infinity-loader-animated.svg

@@ -0,0 +1,220 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="22" height="12" viewBox="0 0 22 12" fill="none" shape-rendering="crispEdges" role="img" aria-label="Processing">
+  <style>
+    :root {
+      --loader-track: #305770;
+      --loader-track-opacity: 0.59;
+      --loader-trail-5: #1d6889;
+      --loader-trail-5-opacity: 0.41;
+      --loader-trail-4: #168bb1;
+      --loader-trail-4-opacity: 0.57;
+      --loader-trail-3: #1fb8d3;
+      --loader-trail-3-opacity: 0.75;
+      --loader-trail-2: #4be2f2;
+      --loader-trail-2-opacity: 0.88;
+      --loader-trail-1: #aefbff;
+      --loader-trail-1-opacity: 0.96;
+      --loader-halo: #5ce2ef;
+      --loader-halo-opacity: 0.75;
+      --loader-core: #ffffff;
+      --loader-core-opacity: 1;
+    }
+    .track { fill: var(--loader-track, #305770); fill-opacity: var(--loader-track-opacity, 0.59); }
+    .trail-5 { fill: var(--loader-trail-5, #1d6889); fill-opacity: var(--loader-trail-5-opacity, 0.41); }
+    .trail-4 { fill: var(--loader-trail-4, #168bb1); fill-opacity: var(--loader-trail-4-opacity, 0.57); }
+    .trail-3 { fill: var(--loader-trail-3, #1fb8d3); fill-opacity: var(--loader-trail-3-opacity, 0.75); }
+    .trail-2 { fill: var(--loader-trail-2, #4be2f2); fill-opacity: var(--loader-trail-2-opacity, 0.88); }
+    .trail-1 { fill: var(--loader-trail-1, #aefbff); fill-opacity: var(--loader-trail-1-opacity, 0.96); }
+    .halo { fill: var(--loader-halo, #5ce2ef); fill-opacity: var(--loader-halo-opacity, 0.75); }
+    .core { fill: var(--loader-core, #ffffff); fill-opacity: var(--loader-core-opacity, 1); }
+    .frame { opacity: 0; animation: show-frame 2400ms steps(1, end) infinite; }
+    @keyframes show-frame {
+      0%, 4.998% { opacity: 1; }
+      5.000%, 100% { opacity: 0; }
+    }
+    @media (prefers-reduced-motion: reduce) {
+      .frame { animation: none; opacity: 0; }
+      .frame-00 { opacity: 1; }
+    }
+  </style>
+  <path class="track" d="M2 4h1v1h-1zM3 4h1v1h-1zM4 4h1v1h-1zM5 4h1v1h-1zM6 4h1v1h-1zM7 4h1v1h-1zM8 4h1v1h-1zM13 4h1v1h-1zM14 4h1v1h-1zM15 4h1v1h-1zM16 4h1v1h-1zM17 4h1v1h-1zM18 4h1v1h-1zM19 4h1v1h-1zM2 5h1v1h-1zM8 5h1v1h-1zM9 5h1v1h-1zM10 5h1v1h-1zM11 5h1v1h-1zM12 5h1v1h-1zM13 5h1v1h-1zM19 5h1v1h-1zM20 5h1v1h-1zM2 6h1v1h-1zM8 6h1v1h-1zM9 6h1v1h-1zM10 6h1v1h-1zM11 6h1v1h-1zM12 6h1v1h-1zM13 6h1v1h-1zM19 6h1v1h-1zM2 7h1v1h-1zM3 7h1v1h-1zM4 7h1v1h-1zM5 7h1v1h-1zM6 7h1v1h-1zM7 7h1v1h-1zM8 7h1v1h-1zM13 7h1v1h-1zM14 7h1v1h-1zM15 7h1v1h-1zM16 7h1v1h-1zM17 7h1v1h-1zM18 7h1v1h-1zM19 7h1v1h-1z"/>
+  <g class="frame frame-00" style="animation-delay:0ms">
+    <path class="trail-5" d="M6 4h1v1h-1z"/>
+    <path class="trail-4" d="M7 4h1v1h-1z"/>
+    <path class="trail-3" d="M8 4h1v1h-1z"/>
+    <path class="trail-2" d="M9 5h1v1h-1z"/>
+    <path class="trail-1" d="M10 5h1v1h-1z"/>
+    <path class="halo" d="M10 5h1v1h-1zM9 6h1v1h-1zM11 6h1v1h-1zM10 7h1v1h-1z"/>
+    <path class="core" d="M10 6h1v1h-1z"/>
+  </g>
+  <g class="frame frame-01" style="animation-delay:50ms">
+    <path class="trail-5" d="M8 4h1v1h-1z"/>
+    <path class="trail-4" d="M9 5h1v1h-1z"/>
+    <path class="trail-3" d="M10 5h1v1h-1z"/>
+    <path class="trail-2" d="M11 6h1v1h-1z"/>
+    <path class="trail-1" d="M12 6h1v1h-1z"/>
+    <path class="halo" d="M12 5h1v1h-1zM11 6h1v1h-1zM13 6h1v1h-1zM12 7h1v1h-1z"/>
+    <path class="core" d="M12 6h1v1h-1z"/>
+  </g>
+  <g class="frame frame-02" style="animation-delay:100ms">
+    <path class="trail-5" d="M10 5h1v1h-1z"/>
+    <path class="trail-4" d="M11 6h1v1h-1z"/>
+    <path class="trail-3" d="M12 6h1v1h-1z"/>
+    <path class="trail-2" d="M13 7h1v1h-1z"/>
+    <path class="trail-1" d="M14 7h1v1h-1z"/>
+    <path class="halo" d="M14 6h1v1h-1zM13 7h1v1h-1zM15 7h1v1h-1zM14 8h1v1h-1z"/>
+    <path class="core" d="M14 7h1v1h-1z"/>
+  </g>
+  <g class="frame frame-03" style="animation-delay:150ms">
+    <path class="trail-5" d="M12 6h1v1h-1z"/>
+    <path class="trail-4" d="M13 6h1v1h-1z"/>
+    <path class="trail-3" d="M14 7h1v1h-1z"/>
+    <path class="trail-2" d="M15 7h1v1h-1z"/>
+    <path class="trail-1" d="M16 7h1v1h-1z"/>
+    <path class="halo" d="M16 6h1v1h-1zM15 7h1v1h-1zM17 7h1v1h-1zM16 8h1v1h-1z"/>
+    <path class="core" d="M16 7h1v1h-1z"/>
+  </g>
+  <g class="frame frame-04" style="animation-delay:200ms">
+    <path class="trail-5" d="M13 7h1v1h-1z"/>
+    <path class="trail-4" d="M15 7h1v1h-1z"/>
+    <path class="trail-3" d="M16 7h1v1h-1z"/>
+    <path class="trail-2" d="M17 7h1v1h-1z"/>
+    <path class="trail-1" d="M18 7h1v1h-1z"/>
+    <path class="halo" d="M18 6h1v1h-1zM17 7h1v1h-1zM19 7h1v1h-1zM18 8h1v1h-1z"/>
+    <path class="core" d="M18 7h1v1h-1z"/>
+  </g>
+  <g class="frame frame-05" style="animation-delay:250ms">
+    <path class="trail-5" d="M15 7h1v1h-1z"/>
+    <path class="trail-4" d="M17 7h1v1h-1z"/>
+    <path class="trail-3" d="M18 7h1v1h-1z"/>
+    <path class="trail-2" d="M19 7h1v1h-1z"/>
+    <path class="trail-1" d="M19 6h1v1h-1z"/>
+    <path class="halo" d="M20 4h1v1h-1zM19 5h1v1h-1zM21 5h1v1h-1zM20 6h1v1h-1z"/>
+    <path class="core" d="M20 5h1v1h-1z"/>
+  </g>
+  <g class="frame frame-06" style="animation-delay:300ms">
+    <path class="trail-5" d="M18 7h1v1h-1z"/>
+    <path class="trail-4" d="M19 7h1v1h-1z"/>
+    <path class="trail-3" d="M19 6h1v1h-1z"/>
+    <path class="trail-2" d="M19 5h1v1h-1z"/>
+    <path class="trail-1" d="M19 4h1v1h-1z"/>
+    <path class="halo" d="M18 3h1v1h-1zM17 4h1v1h-1zM19 4h1v1h-1zM18 5h1v1h-1z"/>
+    <path class="core" d="M18 4h1v1h-1z"/>
+  </g>
+  <g class="frame frame-07" style="animation-delay:350ms">
+    <path class="trail-5" d="M19 6h1v1h-1z"/>
+    <path class="trail-4" d="M19 5h1v1h-1z"/>
+    <path class="trail-3" d="M19 4h1v1h-1z"/>
+    <path class="trail-2" d="M18 4h1v1h-1z"/>
+    <path class="trail-1" d="M17 4h1v1h-1z"/>
+    <path class="halo" d="M16 3h1v1h-1zM15 4h1v1h-1zM17 4h1v1h-1zM16 5h1v1h-1z"/>
+    <path class="core" d="M16 4h1v1h-1z"/>
+  </g>
+  <g class="frame frame-08" style="animation-delay:400ms">
+    <path class="trail-5" d="M19 4h1v1h-1z"/>
+    <path class="trail-4" d="M18 4h1v1h-1z"/>
+    <path class="trail-3" d="M17 4h1v1h-1z"/>
+    <path class="trail-2" d="M16 4h1v1h-1z"/>
+    <path class="trail-1" d="M15 4h1v1h-1z"/>
+    <path class="halo" d="M14 3h1v1h-1zM13 4h1v1h-1zM15 4h1v1h-1zM14 5h1v1h-1z"/>
+    <path class="core" d="M14 4h1v1h-1z"/>
+  </g>
+  <g class="frame frame-09" style="animation-delay:450ms">
+    <path class="trail-5" d="M17 4h1v1h-1z"/>
+    <path class="trail-4" d="M16 4h1v1h-1z"/>
+    <path class="trail-3" d="M15 4h1v1h-1z"/>
+    <path class="trail-2" d="M14 4h1v1h-1z"/>
+    <path class="trail-1" d="M13 4h1v1h-1z"/>
+    <path class="halo" d="M12 4h1v1h-1zM11 5h1v1h-1zM13 5h1v1h-1zM12 6h1v1h-1z"/>
+    <path class="core" d="M12 5h1v1h-1z"/>
+  </g>
+  <g class="frame frame-10" style="animation-delay:500ms">
+    <path class="trail-5" d="M15 4h1v1h-1z"/>
+    <path class="trail-4" d="M14 4h1v1h-1z"/>
+    <path class="trail-3" d="M13 4h1v1h-1z"/>
+    <path class="trail-2" d="M12 5h1v1h-1z"/>
+    <path class="trail-1" d="M11 5h1v1h-1z"/>
+    <path class="halo" d="M10 5h1v1h-1zM9 6h1v1h-1zM11 6h1v1h-1zM10 7h1v1h-1z"/>
+    <path class="core" d="M10 6h1v1h-1z"/>
+  </g>
+  <g class="frame frame-11" style="animation-delay:550ms">
+    <path class="trail-5" d="M13 4h1v1h-1z"/>
+    <path class="trail-4" d="M12 5h1v1h-1z"/>
+    <path class="trail-3" d="M11 5h1v1h-1z"/>
+    <path class="trail-2" d="M10 6h1v1h-1z"/>
+    <path class="trail-1" d="M9 6h1v1h-1z"/>
+    <path class="halo" d="M9 5h1v1h-1zM8 6h1v1h-1zM10 6h1v1h-1zM9 7h1v1h-1z"/>
+    <path class="core" d="M9 6h1v1h-1z"/>
+  </g>
+  <g class="frame frame-12" style="animation-delay:600ms">
+    <path class="trail-5" d="M11 5h1v1h-1z"/>
+    <path class="trail-4" d="M10 6h1v1h-1z"/>
+    <path class="trail-3" d="M9 6h1v1h-1z"/>
+    <path class="trail-2" d="M8 7h1v1h-1z"/>
+    <path class="trail-1" d="M7 7h1v1h-1z"/>
+    <path class="halo" d="M7 6h1v1h-1zM6 7h1v1h-1zM8 7h1v1h-1zM7 8h1v1h-1z"/>
+    <path class="core" d="M7 7h1v1h-1z"/>
+  </g>
+  <g class="frame frame-13" style="animation-delay:650ms">
+    <path class="trail-5" d="M9 6h1v1h-1z"/>
+    <path class="trail-4" d="M8 6h1v1h-1z"/>
+    <path class="trail-3" d="M7 7h1v1h-1z"/>
+    <path class="trail-2" d="M6 7h1v1h-1z"/>
+    <path class="trail-1" d="M5 7h1v1h-1z"/>
+    <path class="halo" d="M5 6h1v1h-1zM4 7h1v1h-1zM6 7h1v1h-1zM5 8h1v1h-1z"/>
+    <path class="core" d="M5 7h1v1h-1z"/>
+  </g>
+  <g class="frame frame-14" style="animation-delay:700ms">
+    <path class="trail-5" d="M8 7h1v1h-1z"/>
+    <path class="trail-4" d="M6 7h1v1h-1z"/>
+    <path class="trail-3" d="M5 7h1v1h-1z"/>
+    <path class="trail-2" d="M4 7h1v1h-1z"/>
+    <path class="trail-1" d="M3 7h1v1h-1z"/>
+    <path class="halo" d="M3 6h1v1h-1zM2 7h1v1h-1zM4 7h1v1h-1zM3 8h1v1h-1z"/>
+    <path class="core" d="M3 7h1v1h-1z"/>
+  </g>
+  <g class="frame frame-15" style="animation-delay:750ms">
+    <path class="trail-5" d="M6 7h1v1h-1z"/>
+    <path class="trail-4" d="M4 7h1v1h-1z"/>
+    <path class="trail-3" d="M3 7h1v1h-1z"/>
+    <path class="trail-2" d="M2 7h1v1h-1z"/>
+    <path class="trail-1" d="M2 6h1v1h-1z"/>
+    <path class="halo" d="M2 4h1v1h-1zM1 5h1v1h-1zM3 5h1v1h-1zM2 6h1v1h-1z"/>
+    <path class="core" d="M2 5h1v1h-1z"/>
+  </g>
+  <g class="frame frame-16" style="animation-delay:800ms">
+    <path class="trail-5" d="M3 7h1v1h-1z"/>
+    <path class="trail-4" d="M2 7h1v1h-1z"/>
+    <path class="trail-3" d="M2 6h1v1h-1z"/>
+    <path class="trail-2" d="M2 5h1v1h-1z"/>
+    <path class="trail-1" d="M2 4h1v1h-1z"/>
+    <path class="halo" d="M3 3h1v1h-1zM2 4h1v1h-1zM4 4h1v1h-1zM3 5h1v1h-1z"/>
+    <path class="core" d="M3 4h1v1h-1z"/>
+  </g>
+  <g class="frame frame-17" style="animation-delay:850ms">
+    <path class="trail-5" d="M2 6h1v1h-1z"/>
+    <path class="trail-4" d="M2 5h1v1h-1z"/>
+    <path class="trail-3" d="M2 4h1v1h-1z"/>
+    <path class="trail-2" d="M3 4h1v1h-1z"/>
+    <path class="trail-1" d="M4 4h1v1h-1z"/>
+    <path class="halo" d="M5 3h1v1h-1zM4 4h1v1h-1zM6 4h1v1h-1zM5 5h1v1h-1z"/>
+    <path class="core" d="M5 4h1v1h-1z"/>
+  </g>
+  <g class="frame frame-18" style="animation-delay:900ms">
+    <path class="trail-5" d="M2 4h1v1h-1z"/>
+    <path class="trail-4" d="M3 4h1v1h-1z"/>
+    <path class="trail-3" d="M4 4h1v1h-1z"/>
+    <path class="trail-2" d="M5 4h1v1h-1z"/>
+    <path class="trail-1" d="M6 4h1v1h-1z"/>
+    <path class="halo" d="M7 3h1v1h-1zM6 4h1v1h-1zM8 4h1v1h-1zM7 5h1v1h-1z"/>
+    <path class="core" d="M7 4h1v1h-1z"/>
+  </g>
+  <g class="frame frame-19" style="animation-delay:950ms">
+    <path class="trail-5" d="M4 4h1v1h-1z"/>
+    <path class="trail-4" d="M5 4h1v1h-1z"/>
+    <path class="trail-3" d="M6 4h1v1h-1z"/>
+    <path class="trail-2" d="M7 4h1v1h-1z"/>
+    <path class="trail-1" d="M8 4h1v1h-1z"/>
+    <path class="halo" d="M9 4h1v1h-1zM8 5h1v1h-1zM10 5h1v1h-1zM9 6h1v1h-1z"/>
+    <path class="core" d="M9 5h1v1h-1z"/>
+  </g>
+</svg>

package/dist/web/brand/infinity-loader-spritesheet.svg

@@ -0,0 +1,230 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="440" height="12" viewBox="0 0 440 12" fill="none" shape-rendering="crispEdges" role="img" aria-label="Processing">
+  <style>
+    :root {
+      --loader-track: #305770;
+      --loader-track-opacity: 0.59;
+      --loader-trail-5: #1d6889;
+      --loader-trail-5-opacity: 0.41;
+      --loader-trail-4: #168bb1;
+      --loader-trail-4-opacity: 0.57;
+      --loader-trail-3: #1fb8d3;
+      --loader-trail-3-opacity: 0.75;
+      --loader-trail-2: #4be2f2;
+      --loader-trail-2-opacity: 0.88;
+      --loader-trail-1: #aefbff;
+      --loader-trail-1-opacity: 0.96;
+      --loader-halo: #5ce2ef;
+      --loader-halo-opacity: 0.75;
+      --loader-core: #ffffff;
+      --loader-core-opacity: 1;
+    }
+    .track { fill: var(--loader-track, #305770); fill-opacity: var(--loader-track-opacity, 0.59); }
+    .trail-5 { fill: var(--loader-trail-5, #1d6889); fill-opacity: var(--loader-trail-5-opacity, 0.41); }
+    .trail-4 { fill: var(--loader-trail-4, #168bb1); fill-opacity: var(--loader-trail-4-opacity, 0.57); }
+    .trail-3 { fill: var(--loader-trail-3, #1fb8d3); fill-opacity: var(--loader-trail-3-opacity, 0.75); }
+    .trail-2 { fill: var(--loader-trail-2, #4be2f2); fill-opacity: var(--loader-trail-2-opacity, 0.88); }
+    .trail-1 { fill: var(--loader-trail-1, #aefbff); fill-opacity: var(--loader-trail-1-opacity, 0.96); }
+    .halo { fill: var(--loader-halo, #5ce2ef); fill-opacity: var(--loader-halo-opacity, 0.75); }
+    .core { fill: var(--loader-core, #ffffff); fill-opacity: var(--loader-core-opacity, 1); }
+  </style>
+  <g id="frame-00">
+  <path class="track" d="M2 4h1v1h-1zM3 4h1v1h-1zM4 4h1v1h-1zM5 4h1v1h-1zM6 4h1v1h-1zM7 4h1v1h-1zM8 4h1v1h-1zM13 4h1v1h-1zM14 4h1v1h-1zM15 4h1v1h-1zM16 4h1v1h-1zM17 4h1v1h-1zM18 4h1v1h-1zM19 4h1v1h-1zM2 5h1v1h-1zM8 5h1v1h-1zM9 5h1v1h-1zM10 5h1v1h-1zM11 5h1v1h-1zM12 5h1v1h-1zM13 5h1v1h-1zM19 5h1v1h-1zM20 5h1v1h-1zM2 6h1v1h-1zM8 6h1v1h-1zM9 6h1v1h-1zM10 6h1v1h-1zM11 6h1v1h-1zM12 6h1v1h-1zM13 6h1v1h-1zM19 6h1v1h-1zM2 7h1v1h-1zM3 7h1v1h-1zM4 7h1v1h-1zM5 7h1v1h-1zM6 7h1v1h-1zM7 7h1v1h-1zM8 7h1v1h-1zM13 7h1v1h-1zM14 7h1v1h-1zM15 7h1v1h-1zM16 7h1v1h-1zM17 7h1v1h-1zM18 7h1v1h-1zM19 7h1v1h-1z"/>
+  <path class="trail-5" d="M6 4h1v1h-1z"/>
+  <path class="trail-4" d="M7 4h1v1h-1z"/>
+  <path class="trail-3" d="M8 4h1v1h-1z"/>
+  <path class="trail-2" d="M9 5h1v1h-1z"/>
+  <path class="trail-1" d="M10 5h1v1h-1z"/>
+  <path class="halo" d="M10 5h1v1h-1zM9 6h1v1h-1zM11 6h1v1h-1zM10 7h1v1h-1z"/>
+  <path class="core" d="M10 6h1v1h-1z"/>
+  </g>
+  <g id="frame-01">
+  <path class="track" transform="translate(22 0)" d="M2 4h1v1h-1zM3 4h1v1h-1zM4 4h1v1h-1zM5 4h1v1h-1zM6 4h1v1h-1zM7 4h1v1h-1zM8 4h1v1h-1zM13 4h1v1h-1zM14 4h1v1h-1zM15 4h1v1h-1zM16 4h1v1h-1zM17 4h1v1h-1zM18 4h1v1h-1zM19 4h1v1h-1zM2 5h1v1h-1zM8 5h1v1h-1zM9 5h1v1h-1zM10 5h1v1h-1zM11 5h1v1h-1zM12 5h1v1h-1zM13 5h1v1h-1zM19 5h1v1h-1zM20 5h1v1h-1zM2 6h1v1h-1zM8 6h1v1h-1zM9 6h1v1h-1zM10 6h1v1h-1zM11 6h1v1h-1zM12 6h1v1h-1zM13 6h1v1h-1zM19 6h1v1h-1zM2 7h1v1h-1zM3 7h1v1h-1zM4 7h1v1h-1zM5 7h1v1h-1zM6 7h1v1h-1zM7 7h1v1h-1zM8 7h1v1h-1zM13 7h1v1h-1zM14 7h1v1h-1zM15 7h1v1h-1zM16 7h1v1h-1zM17 7h1v1h-1zM18 7h1v1h-1zM19 7h1v1h-1z"/>
+  <path class="trail-5" transform="translate(22 0)" d="M8 4h1v1h-1z"/>
+  <path class="trail-4" transform="translate(22 0)" d="M9 5h1v1h-1z"/>
+  <path class="trail-3" transform="translate(22 0)" d="M10 5h1v1h-1z"/>
+  <path class="trail-2" transform="translate(22 0)" d="M11 6h1v1h-1z"/>
+  <path class="trail-1" transform="translate(22 0)" d="M12 6h1v1h-1z"/>
+  <path class="halo" transform="translate(22 0)" d="M12 5h1v1h-1zM11 6h1v1h-1zM13 6h1v1h-1zM12 7h1v1h-1z"/>
+  <path class="core" transform="translate(22 0)" d="M12 6h1v1h-1z"/>
+  </g>
+  <g id="frame-02">
+  <path class="track" transform="translate(44 0)" d="M2 4h1v1h-1zM3 4h1v1h-1zM4 4h1v1h-1zM5 4h1v1h-1zM6 4h1v1h-1zM7 4h1v1h-1zM8 4h1v1h-1zM13 4h1v1h-1zM14 4h1v1h-1zM15 4h1v1h-1zM16 4h1v1h-1zM17 4h1v1h-1zM18 4h1v1h-1zM19 4h1v1h-1zM2 5h1v1h-1zM8 5h1v1h-1zM9 5h1v1h-1zM10 5h1v1h-1zM11 5h1v1h-1zM12 5h1v1h-1zM13 5h1v1h-1zM19 5h1v1h-1zM20 5h1v1h-1zM2 6h1v1h-1zM8 6h1v1h-1zM9 6h1v1h-1zM10 6h1v1h-1zM11 6h1v1h-1zM12 6h1v1h-1zM13 6h1v1h-1zM19 6h1v1h-1zM2 7h1v1h-1zM3 7h1v1h-1zM4 7h1v1h-1zM5 7h1v1h-1zM6 7h1v1h-1zM7 7h1v1h-1zM8 7h1v1h-1zM13 7h1v1h-1zM14 7h1v1h-1zM15 7h1v1h-1zM16 7h1v1h-1zM17 7h1v1h-1zM18 7h1v1h-1zM19 7h1v1h-1z"/>
+  <path class="trail-5" transform="translate(44 0)" d="M10 5h1v1h-1z"/>
+  <path class="trail-4" transform="translate(44 0)" d="M11 6h1v1h-1z"/>
+  <path class="trail-3" transform="translate(44 0)" d="M12 6h1v1h-1z"/>
+  <path class="trail-2" transform="translate(44 0)" d="M13 7h1v1h-1z"/>
+  <path class="trail-1" transform="translate(44 0)" d="M14 7h1v1h-1z"/>
+  <path class="halo" transform="translate(44 0)" d="M14 6h1v1h-1zM13 7h1v1h-1zM15 7h1v1h-1zM14 8h1v1h-1z"/>
+  <path class="core" transform="translate(44 0)" d="M14 7h1v1h-1z"/>
+  </g>
+  <g id="frame-03">
+  <path class="track" transform="translate(66 0)" d="M2 4h1v1h-1zM3 4h1v1h-1zM4 4h1v1h-1zM5 4h1v1h-1zM6 4h1v1h-1zM7 4h1v1h-1zM8 4h1v1h-1zM13 4h1v1h-1zM14 4h1v1h-1zM15 4h1v1h-1zM16 4h1v1h-1zM17 4h1v1h-1zM18 4h1v1h-1zM19 4h1v1h-1zM2 5h1v1h-1zM8 5h1v1h-1zM9 5h1v1h-1zM10 5h1v1h-1zM11 5h1v1h-1zM12 5h1v1h-1zM13 5h1v1h-1zM19 5h1v1h-1zM20 5h1v1h-1zM2 6h1v1h-1zM8 6h1v1h-1zM9 6h1v1h-1zM10 6h1v1h-1zM11 6h1v1h-1zM12 6h1v1h-1zM13 6h1v1h-1zM19 6h1v1h-1zM2 7h1v1h-1zM3 7h1v1h-1zM4 7h1v1h-1zM5 7h1v1h-1zM6 7h1v1h-1zM7 7h1v1h-1zM8 7h1v1h-1zM13 7h1v1h-1zM14 7h1v1h-1zM15 7h1v1h-1zM16 7h1v1h-1zM17 7h1v1h-1zM18 7h1v1h-1zM19 7h1v1h-1z"/>
+  <path class="trail-5" transform="translate(66 0)" d="M12 6h1v1h-1z"/>
+  <path class="trail-4" transform="translate(66 0)" d="M13 6h1v1h-1z"/>
+  <path class="trail-3" transform="translate(66 0)" d="M14 7h1v1h-1z"/>
+  <path class="trail-2" transform="translate(66 0)" d="M15 7h1v1h-1z"/>
+  <path class="trail-1" transform="translate(66 0)" d="M16 7h1v1h-1z"/>
+  <path class="halo" transform="translate(66 0)" d="M16 6h1v1h-1zM15 7h1v1h-1zM17 7h1v1h-1zM16 8h1v1h-1z"/>
+  <path class="core" transform="translate(66 0)" d="M16 7h1v1h-1z"/>
+  </g>
+  <g id="frame-04">
+  <path class="track" transform="translate(88 0)" d="M2 4h1v1h-1zM3 4h1v1h-1zM4 4h1v1h-1zM5 4h1v1h-1zM6 4h1v1h-1zM7 4h1v1h-1zM8 4h1v1h-1zM13 4h1v1h-1zM14 4h1v1h-1zM15 4h1v1h-1zM16 4h1v1h-1zM17 4h1v1h-1zM18 4h1v1h-1zM19 4h1v1h-1zM2 5h1v1h-1zM8 5h1v1h-1zM9 5h1v1h-1zM10 5h1v1h-1zM11 5h1v1h-1zM12 5h1v1h-1zM13 5h1v1h-1zM19 5h1v1h-1zM20 5h1v1h-1zM2 6h1v1h-1zM8 6h1v1h-1zM9 6h1v1h-1zM10 6h1v1h-1zM11 6h1v1h-1zM12 6h1v1h-1zM13 6h1v1h-1zM19 6h1v1h-1zM2 7h1v1h-1zM3 7h1v1h-1zM4 7h1v1h-1zM5 7h1v1h-1zM6 7h1v1h-1zM7 7h1v1h-1zM8 7h1v1h-1zM13 7h1v1h-1zM14 7h1v1h-1zM15 7h1v1h-1zM16 7h1v1h-1zM17 7h1v1h-1zM18 7h1v1h-1zM19 7h1v1h-1z"/>
+  <path class="trail-5" transform="translate(88 0)" d="M13 7h1v1h-1z"/>
+  <path class="trail-4" transform="translate(88 0)" d="M15 7h1v1h-1z"/>
+  <path class="trail-3" transform="translate(88 0)" d="M16 7h1v1h-1z"/>
+  <path class="trail-2" transform="translate(88 0)" d="M17 7h1v1h-1z"/>
+  <path class="trail-1" transform="translate(88 0)" d="M18 7h1v1h-1z"/>
+  <path class="halo" transform="translate(88 0)" d="M18 6h1v1h-1zM17 7h1v1h-1zM19 7h1v1h-1zM18 8h1v1h-1z"/>
+  <path class="core" transform="translate(88 0)" d="M18 7h1v1h-1z"/>
+  </g>
+  <g id="frame-05">
+  <path class="track" transform="translate(110 0)" d="M2 4h1v1h-1zM3 4h1v1h-1zM4 4h1v1h-1zM5 4h1v1h-1zM6 4h1v1h-1zM7 4h1v1h-1zM8 4h1v1h-1zM13 4h1v1h-1zM14 4h1v1h-1zM15 4h1v1h-1zM16 4h1v1h-1zM17 4h1v1h-1zM18 4h1v1h-1zM19 4h1v1h-1zM2 5h1v1h-1zM8 5h1v1h-1zM9 5h1v1h-1zM10 5h1v1h-1zM11 5h1v1h-1zM12 5h1v1h-1zM13 5h1v1h-1zM19 5h1v1h-1zM20 5h1v1h-1zM2 6h1v1h-1zM8 6h1v1h-1zM9 6h1v1h-1zM10 6h1v1h-1zM11 6h1v1h-1zM12 6h1v1h-1zM13 6h1v1h-1zM19 6h1v1h-1zM2 7h1v1h-1zM3 7h1v1h-1zM4 7h1v1h-1zM5 7h1v1h-1zM6 7h1v1h-1zM7 7h1v1h-1zM8 7h1v1h-1zM13 7h1v1h-1zM14 7h1v1h-1zM15 7h1v1h-1zM16 7h1v1h-1zM17 7h1v1h-1zM18 7h1v1h-1zM19 7h1v1h-1z"/>
+  <path class="trail-5" transform="translate(110 0)" d="M15 7h1v1h-1z"/>
+  <path class="trail-4" transform="translate(110 0)" d="M17 7h1v1h-1z"/>
+  <path class="trail-3" transform="translate(110 0)" d="M18 7h1v1h-1z"/>
+  <path class="trail-2" transform="translate(110 0)" d="M19 7h1v1h-1z"/>
+  <path class="trail-1" transform="translate(110 0)" d="M19 6h1v1h-1z"/>
+  <path class="halo" transform="translate(110 0)" d="M20 4h1v1h-1zM19 5h1v1h-1zM21 5h1v1h-1zM20 6h1v1h-1z"/>
+  <path class="core" transform="translate(110 0)" d="M20 5h1v1h-1z"/>
+  </g>
+  <g id="frame-06">
+  <path class="track" transform="translate(132 0)" d="M2 4h1v1h-1zM3 4h1v1h-1zM4 4h1v1h-1zM5 4h1v1h-1zM6 4h1v1h-1zM7 4h1v1h-1zM8 4h1v1h-1zM13 4h1v1h-1zM14 4h1v1h-1zM15 4h1v1h-1zM16 4h1v1h-1zM17 4h1v1h-1zM18 4h1v1h-1zM19 4h1v1h-1zM2 5h1v1h-1zM8 5h1v1h-1zM9 5h1v1h-1zM10 5h1v1h-1zM11 5h1v1h-1zM12 5h1v1h-1zM13 5h1v1h-1zM19 5h1v1h-1zM20 5h1v1h-1zM2 6h1v1h-1zM8 6h1v1h-1zM9 6h1v1h-1zM10 6h1v1h-1zM11 6h1v1h-1zM12 6h1v1h-1zM13 6h1v1h-1zM19 6h1v1h-1zM2 7h1v1h-1zM3 7h1v1h-1zM4 7h1v1h-1zM5 7h1v1h-1zM6 7h1v1h-1zM7 7h1v1h-1zM8 7h1v1h-1zM13 7h1v1h-1zM14 7h1v1h-1zM15 7h1v1h-1zM16 7h1v1h-1zM17 7h1v1h-1zM18 7h1v1h-1zM19 7h1v1h-1z"/>
+  <path class="trail-5" transform="translate(132 0)" d="M18 7h1v1h-1z"/>
+  <path class="trail-4" transform="translate(132 0)" d="M19 7h1v1h-1z"/>
+  <path class="trail-3" transform="translate(132 0)" d="M19 6h1v1h-1z"/>
+  <path class="trail-2" transform="translate(132 0)" d="M19 5h1v1h-1z"/>
+  <path class="trail-1" transform="translate(132 0)" d="M19 4h1v1h-1z"/>
+  <path class="halo" transform="translate(132 0)" d="M18 3h1v1h-1zM17 4h1v1h-1zM19 4h1v1h-1zM18 5h1v1h-1z"/>
+  <path class="core" transform="translate(132 0)" d="M18 4h1v1h-1z"/>
+  </g>
+  <g id="frame-07">
+  <path class="track" transform="translate(154 0)" d="M2 4h1v1h-1zM3 4h1v1h-1zM4 4h1v1h-1zM5 4h1v1h-1zM6 4h1v1h-1zM7 4h1v1h-1zM8 4h1v1h-1zM13 4h1v1h-1zM14 4h1v1h-1zM15 4h1v1h-1zM16 4h1v1h-1zM17 4h1v1h-1zM18 4h1v1h-1zM19 4h1v1h-1zM2 5h1v1h-1zM8 5h1v1h-1zM9 5h1v1h-1zM10 5h1v1h-1zM11 5h1v1h-1zM12 5h1v1h-1zM13 5h1v1h-1zM19 5h1v1h-1zM20 5h1v1h-1zM2 6h1v1h-1zM8 6h1v1h-1zM9 6h1v1h-1zM10 6h1v1h-1zM11 6h1v1h-1zM12 6h1v1h-1zM13 6h1v1h-1zM19 6h1v1h-1zM2 7h1v1h-1zM3 7h1v1h-1zM4 7h1v1h-1zM5 7h1v1h-1zM6 7h1v1h-1zM7 7h1v1h-1zM8 7h1v1h-1zM13 7h1v1h-1zM14 7h1v1h-1zM15 7h1v1h-1zM16 7h1v1h-1zM17 7h1v1h-1zM18 7h1v1h-1zM19 7h1v1h-1z"/>
+  <path class="trail-5" transform="translate(154 0)" d="M19 6h1v1h-1z"/>
+  <path class="trail-4" transform="translate(154 0)" d="M19 5h1v1h-1z"/>
+  <path class="trail-3" transform="translate(154 0)" d="M19 4h1v1h-1z"/>
+  <path class="trail-2" transform="translate(154 0)" d="M18 4h1v1h-1z"/>
+  <path class="trail-1" transform="translate(154 0)" d="M17 4h1v1h-1z"/>
+  <path class="halo" transform="translate(154 0)" d="M16 3h1v1h-1zM15 4h1v1h-1zM17 4h1v1h-1zM16 5h1v1h-1z"/>
+  <path class="core" transform="translate(154 0)" d="M16 4h1v1h-1z"/>
+  </g>
+  <g id="frame-08">
+  <path class="track" transform="translate(176 0)" d="M2 4h1v1h-1zM3 4h1v1h-1zM4 4h1v1h-1zM5 4h1v1h-1zM6 4h1v1h-1zM7 4h1v1h-1zM8 4h1v1h-1zM13 4h1v1h-1zM14 4h1v1h-1zM15 4h1v1h-1zM16 4h1v1h-1zM17 4h1v1h-1zM18 4h1v1h-1zM19 4h1v1h-1zM2 5h1v1h-1zM8 5h1v1h-1zM9 5h1v1h-1zM10 5h1v1h-1zM11 5h1v1h-1zM12 5h1v1h-1zM13 5h1v1h-1zM19 5h1v1h-1zM20 5h1v1h-1zM2 6h1v1h-1zM8 6h1v1h-1zM9 6h1v1h-1zM10 6h1v1h-1zM11 6h1v1h-1zM12 6h1v1h-1zM13 6h1v1h-1zM19 6h1v1h-1zM2 7h1v1h-1zM3 7h1v1h-1zM4 7h1v1h-1zM5 7h1v1h-1zM6 7h1v1h-1zM7 7h1v1h-1zM8 7h1v1h-1zM13 7h1v1h-1zM14 7h1v1h-1zM15 7h1v1h-1zM16 7h1v1h-1zM17 7h1v1h-1zM18 7h1v1h-1zM19 7h1v1h-1z"/>
+  <path class="trail-5" transform="translate(176 0)" d="M19 4h1v1h-1z"/>
+  <path class="trail-4" transform="translate(176 0)" d="M18 4h1v1h-1z"/>
+  <path class="trail-3" transform="translate(176 0)" d="M17 4h1v1h-1z"/>
+  <path class="trail-2" transform="translate(176 0)" d="M16 4h1v1h-1z"/>
+  <path class="trail-1" transform="translate(176 0)" d="M15 4h1v1h-1z"/>
+  <path class="halo" transform="translate(176 0)" d="M14 3h1v1h-1zM13 4h1v1h-1zM15 4h1v1h-1zM14 5h1v1h-1z"/>
+  <path class="core" transform="translate(176 0)" d="M14 4h1v1h-1z"/>
+  </g>
+  <g id="frame-09">
+  <path class="track" transform="translate(198 0)" d="M2 4h1v1h-1zM3 4h1v1h-1zM4 4h1v1h-1zM5 4h1v1h-1zM6 4h1v1h-1zM7 4h1v1h-1zM8 4h1v1h-1zM13 4h1v1h-1zM14 4h1v1h-1zM15 4h1v1h-1zM16 4h1v1h-1zM17 4h1v1h-1zM18 4h1v1h-1zM19 4h1v1h-1zM2 5h1v1h-1zM8 5h1v1h-1zM9 5h1v1h-1zM10 5h1v1h-1zM11 5h1v1h-1zM12 5h1v1h-1zM13 5h1v1h-1zM19 5h1v1h-1zM20 5h1v1h-1zM2 6h1v1h-1zM8 6h1v1h-1zM9 6h1v1h-1zM10 6h1v1h-1zM11 6h1v1h-1zM12 6h1v1h-1zM13 6h1v1h-1zM19 6h1v1h-1zM2 7h1v1h-1zM3 7h1v1h-1zM4 7h1v1h-1zM5 7h1v1h-1zM6 7h1v1h-1zM7 7h1v1h-1zM8 7h1v1h-1zM13 7h1v1h-1zM14 7h1v1h-1zM15 7h1v1h-1zM16 7h1v1h-1zM17 7h1v1h-1zM18 7h1v1h-1zM19 7h1v1h-1z"/>
+  <path class="trail-5" transform="translate(198 0)" d="M17 4h1v1h-1z"/>
+  <path class="trail-4" transform="translate(198 0)" d="M16 4h1v1h-1z"/>
+  <path class="trail-3" transform="translate(198 0)" d="M15 4h1v1h-1z"/>
+  <path class="trail-2" transform="translate(198 0)" d="M14 4h1v1h-1z"/>
+  <path class="trail-1" transform="translate(198 0)" d="M13 4h1v1h-1z"/>
+  <path class="halo" transform="translate(198 0)" d="M12 4h1v1h-1zM11 5h1v1h-1zM13 5h1v1h-1zM12 6h1v1h-1z"/>
+  <path class="core" transform="translate(198 0)" d="M12 5h1v1h-1z"/>
+  </g>
+  <g id="frame-10">
+  <path class="track" transform="translate(220 0)" d="M2 4h1v1h-1zM3 4h1v1h-1zM4 4h1v1h-1zM5 4h1v1h-1zM6 4h1v1h-1zM7 4h1v1h-1zM8 4h1v1h-1zM13 4h1v1h-1zM14 4h1v1h-1zM15 4h1v1h-1zM16 4h1v1h-1zM17 4h1v1h-1zM18 4h1v1h-1zM19 4h1v1h-1zM2 5h1v1h-1zM8 5h1v1h-1zM9 5h1v1h-1zM10 5h1v1h-1zM11 5h1v1h-1zM12 5h1v1h-1zM13 5h1v1h-1zM19 5h1v1h-1zM20 5h1v1h-1zM2 6h1v1h-1zM8 6h1v1h-1zM9 6h1v1h-1zM10 6h1v1h-1zM11 6h1v1h-1zM12 6h1v1h-1zM13 6h1v1h-1zM19 6h1v1h-1zM2 7h1v1h-1zM3 7h1v1h-1zM4 7h1v1h-1zM5 7h1v1h-1zM6 7h1v1h-1zM7 7h1v1h-1zM8 7h1v1h-1zM13 7h1v1h-1zM14 7h1v1h-1zM15 7h1v1h-1zM16 7h1v1h-1zM17 7h1v1h-1zM18 7h1v1h-1zM19 7h1v1h-1z"/>
+  <path class="trail-5" transform="translate(220 0)" d="M15 4h1v1h-1z"/>
+  <path class="trail-4" transform="translate(220 0)" d="M14 4h1v1h-1z"/>
+  <path class="trail-3" transform="translate(220 0)" d="M13 4h1v1h-1z"/>
+  <path class="trail-2" transform="translate(220 0)" d="M12 5h1v1h-1z"/>
+  <path class="trail-1" transform="translate(220 0)" d="M11 5h1v1h-1z"/>
+  <path class="halo" transform="translate(220 0)" d="M10 5h1v1h-1zM9 6h1v1h-1zM11 6h1v1h-1zM10 7h1v1h-1z"/>
+  <path class="core" transform="translate(220 0)" d="M10 6h1v1h-1z"/>
+  </g>
+  <g id="frame-11">
+  <path class="track" transform="translate(242 0)" d="M2 4h1v1h-1zM3 4h1v1h-1zM4 4h1v1h-1zM5 4h1v1h-1zM6 4h1v1h-1zM7 4h1v1h-1zM8 4h1v1h-1zM13 4h1v1h-1zM14 4h1v1h-1zM15 4h1v1h-1zM16 4h1v1h-1zM17 4h1v1h-1zM18 4h1v1h-1zM19 4h1v1h-1zM2 5h1v1h-1zM8 5h1v1h-1zM9 5h1v1h-1zM10 5h1v1h-1zM11 5h1v1h-1zM12 5h1v1h-1zM13 5h1v1h-1zM19 5h1v1h-1zM20 5h1v1h-1zM2 6h1v1h-1zM8 6h1v1h-1zM9 6h1v1h-1zM10 6h1v1h-1zM11 6h1v1h-1zM12 6h1v1h-1zM13 6h1v1h-1zM19 6h1v1h-1zM2 7h1v1h-1zM3 7h1v1h-1zM4 7h1v1h-1zM5 7h1v1h-1zM6 7h1v1h-1zM7 7h1v1h-1zM8 7h1v1h-1zM13 7h1v1h-1zM14 7h1v1h-1zM15 7h1v1h-1zM16 7h1v1h-1zM17 7h1v1h-1zM18 7h1v1h-1zM19 7h1v1h-1z"/>
+  <path class="trail-5" transform="translate(242 0)" d="M13 4h1v1h-1z"/>
+  <path class="trail-4" transform="translate(242 0)" d="M12 5h1v1h-1z"/>
+  <path class="trail-3" transform="translate(242 0)" d="M11 5h1v1h-1z"/>
+  <path class="trail-2" transform="translate(242 0)" d="M10 6h1v1h-1z"/>
+  <path class="trail-1" transform="translate(242 0)" d="M9 6h1v1h-1z"/>
+  <path class="halo" transform="translate(242 0)" d="M9 5h1v1h-1zM8 6h1v1h-1zM10 6h1v1h-1zM9 7h1v1h-1z"/>
+  <path class="core" transform="translate(242 0)" d="M9 6h1v1h-1z"/>
+  </g>
+  <g id="frame-12">
+  <path class="track" transform="translate(264 0)" d="M2 4h1v1h-1zM3 4h1v1h-1zM4 4h1v1h-1zM5 4h1v1h-1zM6 4h1v1h-1zM7 4h1v1h-1zM8 4h1v1h-1zM13 4h1v1h-1zM14 4h1v1h-1zM15 4h1v1h-1zM16 4h1v1h-1zM17 4h1v1h-1zM18 4h1v1h-1zM19 4h1v1h-1zM2 5h1v1h-1zM8 5h1v1h-1zM9 5h1v1h-1zM10 5h1v1h-1zM11 5h1v1h-1zM12 5h1v1h-1zM13 5h1v1h-1zM19 5h1v1h-1zM20 5h1v1h-1zM2 6h1v1h-1zM8 6h1v1h-1zM9 6h1v1h-1zM10 6h1v1h-1zM11 6h1v1h-1zM12 6h1v1h-1zM13 6h1v1h-1zM19 6h1v1h-1zM2 7h1v1h-1zM3 7h1v1h-1zM4 7h1v1h-1zM5 7h1v1h-1zM6 7h1v1h-1zM7 7h1v1h-1zM8 7h1v1h-1zM13 7h1v1h-1zM14 7h1v1h-1zM15 7h1v1h-1zM16 7h1v1h-1zM17 7h1v1h-1zM18 7h1v1h-1zM19 7h1v1h-1z"/>
+  <path class="trail-5" transform="translate(264 0)" d="M11 5h1v1h-1z"/>
+  <path class="trail-4" transform="translate(264 0)" d="M10 6h1v1h-1z"/>
+  <path class="trail-3" transform="translate(264 0)" d="M9 6h1v1h-1z"/>
+  <path class="trail-2" transform="translate(264 0)" d="M8 7h1v1h-1z"/>
+  <path class="trail-1" transform="translate(264 0)" d="M7 7h1v1h-1z"/>
+  <path class="halo" transform="translate(264 0)" d="M7 6h1v1h-1zM6 7h1v1h-1zM8 7h1v1h-1zM7 8h1v1h-1z"/>
+  <path class="core" transform="translate(264 0)" d="M7 7h1v1h-1z"/>
+  </g>
+  <g id="frame-13">
+  <path class="track" transform="translate(286 0)" d="M2 4h1v1h-1zM3 4h1v1h-1zM4 4h1v1h-1zM5 4h1v1h-1zM6 4h1v1h-1zM7 4h1v1h-1zM8 4h1v1h-1zM13 4h1v1h-1zM14 4h1v1h-1zM15 4h1v1h-1zM16 4h1v1h-1zM17 4h1v1h-1zM18 4h1v1h-1zM19 4h1v1h-1zM2 5h1v1h-1zM8 5h1v1h-1zM9 5h1v1h-1zM10 5h1v1h-1zM11 5h1v1h-1zM12 5h1v1h-1zM13 5h1v1h-1zM19 5h1v1h-1zM20 5h1v1h-1zM2 6h1v1h-1zM8 6h1v1h-1zM9 6h1v1h-1zM10 6h1v1h-1zM11 6h1v1h-1zM12 6h1v1h-1zM13 6h1v1h-1zM19 6h1v1h-1zM2 7h1v1h-1zM3 7h1v1h-1zM4 7h1v1h-1zM5 7h1v1h-1zM6 7h1v1h-1zM7 7h1v1h-1zM8 7h1v1h-1zM13 7h1v1h-1zM14 7h1v1h-1zM15 7h1v1h-1zM16 7h1v1h-1zM17 7h1v1h-1zM18 7h1v1h-1zM19 7h1v1h-1z"/>
+  <path class="trail-5" transform="translate(286 0)" d="M9 6h1v1h-1z"/>
+  <path class="trail-4" transform="translate(286 0)" d="M8 6h1v1h-1z"/>
+  <path class="trail-3" transform="translate(286 0)" d="M7 7h1v1h-1z"/>
+  <path class="trail-2" transform="translate(286 0)" d="M6 7h1v1h-1z"/>
+  <path class="trail-1" transform="translate(286 0)" d="M5 7h1v1h-1z"/>
+  <path class="halo" transform="translate(286 0)" d="M5 6h1v1h-1zM4 7h1v1h-1zM6 7h1v1h-1zM5 8h1v1h-1z"/>
+  <path class="core" transform="translate(286 0)" d="M5 7h1v1h-1z"/>
+  </g>
+  <g id="frame-14">
+  <path class="track" transform="translate(308 0)" d="M2 4h1v1h-1zM3 4h1v1h-1zM4 4h1v1h-1zM5 4h1v1h-1zM6 4h1v1h-1zM7 4h1v1h-1zM8 4h1v1h-1zM13 4h1v1h-1zM14 4h1v1h-1zM15 4h1v1h-1zM16 4h1v1h-1zM17 4h1v1h-1zM18 4h1v1h-1zM19 4h1v1h-1zM2 5h1v1h-1zM8 5h1v1h-1zM9 5h1v1h-1zM10 5h1v1h-1zM11 5h1v1h-1zM12 5h1v1h-1zM13 5h1v1h-1zM19 5h1v1h-1zM20 5h1v1h-1zM2 6h1v1h-1zM8 6h1v1h-1zM9 6h1v1h-1zM10 6h1v1h-1zM11 6h1v1h-1zM12 6h1v1h-1zM13 6h1v1h-1zM19 6h1v1h-1zM2 7h1v1h-1zM3 7h1v1h-1zM4 7h1v1h-1zM5 7h1v1h-1zM6 7h1v1h-1zM7 7h1v1h-1zM8 7h1v1h-1zM13 7h1v1h-1zM14 7h1v1h-1zM15 7h1v1h-1zM16 7h1v1h-1zM17 7h1v1h-1zM18 7h1v1h-1zM19 7h1v1h-1z"/>
+  <path class="trail-5" transform="translate(308 0)" d="M8 7h1v1h-1z"/>
+  <path class="trail-4" transform="translate(308 0)" d="M6 7h1v1h-1z"/>
+  <path class="trail-3" transform="translate(308 0)" d="M5 7h1v1h-1z"/>
+  <path class="trail-2" transform="translate(308 0)" d="M4 7h1v1h-1z"/>
+  <path class="trail-1" transform="translate(308 0)" d="M3 7h1v1h-1z"/>
+  <path class="halo" transform="translate(308 0)" d="M3 6h1v1h-1zM2 7h1v1h-1zM4 7h1v1h-1zM3 8h1v1h-1z"/>
+  <path class="core" transform="translate(308 0)" d="M3 7h1v1h-1z"/>
+  </g>
+  <g id="frame-15">
+  <path class="track" transform="translate(330 0)" d="M2 4h1v1h-1zM3 4h1v1h-1zM4 4h1v1h-1zM5 4h1v1h-1zM6 4h1v1h-1zM7 4h1v1h-1zM8 4h1v1h-1zM13 4h1v1h-1zM14 4h1v1h-1zM15 4h1v1h-1zM16 4h1v1h-1zM17 4h1v1h-1zM18 4h1v1h-1zM19 4h1v1h-1zM2 5h1v1h-1zM8 5h1v1h-1zM9 5h1v1h-1zM10 5h1v1h-1zM11 5h1v1h-1zM12 5h1v1h-1zM13 5h1v1h-1zM19 5h1v1h-1zM20 5h1v1h-1zM2 6h1v1h-1zM8 6h1v1h-1zM9 6h1v1h-1zM10 6h1v1h-1zM11 6h1v1h-1zM12 6h1v1h-1zM13 6h1v1h-1zM19 6h1v1h-1zM2 7h1v1h-1zM3 7h1v1h-1zM4 7h1v1h-1zM5 7h1v1h-1zM6 7h1v1h-1zM7 7h1v1h-1zM8 7h1v1h-1zM13 7h1v1h-1zM14 7h1v1h-1zM15 7h1v1h-1zM16 7h1v1h-1zM17 7h1v1h-1zM18 7h1v1h-1zM19 7h1v1h-1z"/>
+  <path class="trail-5" transform="translate(330 0)" d="M6 7h1v1h-1z"/>
+  <path class="trail-4" transform="translate(330 0)" d="M4 7h1v1h-1z"/>
+  <path class="trail-3" transform="translate(330 0)" d="M3 7h1v1h-1z"/>
+  <path class="trail-2" transform="translate(330 0)" d="M2 7h1v1h-1z"/>
+  <path class="trail-1" transform="translate(330 0)" d="M2 6h1v1h-1z"/>
+  <path class="halo" transform="translate(330 0)" d="M2 4h1v1h-1zM1 5h1v1h-1zM3 5h1v1h-1zM2 6h1v1h-1z"/>
+  <path class="core" transform="translate(330 0)" d="M2 5h1v1h-1z"/>
+  </g>
+  <g id="frame-16">
+  <path class="track" transform="translate(352 0)" d="M2 4h1v1h-1zM3 4h1v1h-1zM4 4h1v1h-1zM5 4h1v1h-1zM6 4h1v1h-1zM7 4h1v1h-1zM8 4h1v1h-1zM13 4h1v1h-1zM14 4h1v1h-1zM15 4h1v1h-1zM16 4h1v1h-1zM17 4h1v1h-1zM18 4h1v1h-1zM19 4h1v1h-1zM2 5h1v1h-1zM8 5h1v1h-1zM9 5h1v1h-1zM10 5h1v1h-1zM11 5h1v1h-1zM12 5h1v1h-1zM13 5h1v1h-1zM19 5h1v1h-1zM20 5h1v1h-1zM2 6h1v1h-1zM8 6h1v1h-1zM9 6h1v1h-1zM10 6h1v1h-1zM11 6h1v1h-1zM12 6h1v1h-1zM13 6h1v1h-1zM19 6h1v1h-1zM2 7h1v1h-1zM3 7h1v1h-1zM4 7h1v1h-1zM5 7h1v1h-1zM6 7h1v1h-1zM7 7h1v1h-1zM8 7h1v1h-1zM13 7h1v1h-1zM14 7h1v1h-1zM15 7h1v1h-1zM16 7h1v1h-1zM17 7h1v1h-1zM18 7h1v1h-1zM19 7h1v1h-1z"/>
+  <path class="trail-5" transform="translate(352 0)" d="M3 7h1v1h-1z"/>
+  <path class="trail-4" transform="translate(352 0)" d="M2 7h1v1h-1z"/>
+  <path class="trail-3" transform="translate(352 0)" d="M2 6h1v1h-1z"/>
+  <path class="trail-2" transform="translate(352 0)" d="M2 5h1v1h-1z"/>
+  <path class="trail-1" transform="translate(352 0)" d="M2 4h1v1h-1z"/>
+  <path class="halo" transform="translate(352 0)" d="M3 3h1v1h-1zM2 4h1v1h-1zM4 4h1v1h-1zM3 5h1v1h-1z"/>
+  <path class="core" transform="translate(352 0)" d="M3 4h1v1h-1z"/>
+  </g>
+  <g id="frame-17">
+  <path class="track" transform="translate(374 0)" d="M2 4h1v1h-1zM3 4h1v1h-1zM4 4h1v1h-1zM5 4h1v1h-1zM6 4h1v1h-1zM7 4h1v1h-1zM8 4h1v1h-1zM13 4h1v1h-1zM14 4h1v1h-1zM15 4h1v1h-1zM16 4h1v1h-1zM17 4h1v1h-1zM18 4h1v1h-1zM19 4h1v1h-1zM2 5h1v1h-1zM8 5h1v1h-1zM9 5h1v1h-1zM10 5h1v1h-1zM11 5h1v1h-1zM12 5h1v1h-1zM13 5h1v1h-1zM19 5h1v1h-1zM20 5h1v1h-1zM2 6h1v1h-1zM8 6h1v1h-1zM9 6h1v1h-1zM10 6h1v1h-1zM11 6h1v1h-1zM12 6h1v1h-1zM13 6h1v1h-1zM19 6h1v1h-1zM2 7h1v1h-1zM3 7h1v1h-1zM4 7h1v1h-1zM5 7h1v1h-1zM6 7h1v1h-1zM7 7h1v1h-1zM8 7h1v1h-1zM13 7h1v1h-1zM14 7h1v1h-1zM15 7h1v1h-1zM16 7h1v1h-1zM17 7h1v1h-1zM18 7h1v1h-1zM19 7h1v1h-1z"/>
+  <path class="trail-5" transform="translate(374 0)" d="M2 6h1v1h-1z"/>
+  <path class="trail-4" transform="translate(374 0)" d="M2 5h1v1h-1z"/>
+  <path class="trail-3" transform="translate(374 0)" d="M2 4h1v1h-1z"/>
+  <path class="trail-2" transform="translate(374 0)" d="M3 4h1v1h-1z"/>
+  <path class="trail-1" transform="translate(374 0)" d="M4 4h1v1h-1z"/>
+  <path class="halo" transform="translate(374 0)" d="M5 3h1v1h-1zM4 4h1v1h-1zM6 4h1v1h-1zM5 5h1v1h-1z"/>
+  <path class="core" transform="translate(374 0)" d="M5 4h1v1h-1z"/>
+  </g>
+  <g id="frame-18">
+  <path class="track" transform="translate(396 0)" d="M2 4h1v1h-1zM3 4h1v1h-1zM4 4h1v1h-1zM5 4h1v1h-1zM6 4h1v1h-1zM7 4h1v1h-1zM8 4h1v1h-1zM13 4h1v1h-1zM14 4h1v1h-1zM15 4h1v1h-1zM16 4h1v1h-1zM17 4h1v1h-1zM18 4h1v1h-1zM19 4h1v1h-1zM2 5h1v1h-1zM8 5h1v1h-1zM9 5h1v1h-1zM10 5h1v1h-1zM11 5h1v1h-1zM12 5h1v1h-1zM13 5h1v1h-1zM19 5h1v1h-1zM20 5h1v1h-1zM2 6h1v1h-1zM8 6h1v1h-1zM9 6h1v1h-1zM10 6h1v1h-1zM11 6h1v1h-1zM12 6h1v1h-1zM13 6h1v1h-1zM19 6h1v1h-1zM2 7h1v1h-1zM3 7h1v1h-1zM4 7h1v1h-1zM5 7h1v1h-1zM6 7h1v1h-1zM7 7h1v1h-1zM8 7h1v1h-1zM13 7h1v1h-1zM14 7h1v1h-1zM15 7h1v1h-1zM16 7h1v1h-1zM17 7h1v1h-1zM18 7h1v1h-1zM19 7h1v1h-1z"/>
+  <path class="trail-5" transform="translate(396 0)" d="M2 4h1v1h-1z"/>
+  <path class="trail-4" transform="translate(396 0)" d="M3 4h1v1h-1z"/>
+  <path class="trail-3" transform="translate(396 0)" d="M4 4h1v1h-1z"/>
+  <path class="trail-2" transform="translate(396 0)" d="M5 4h1v1h-1z"/>
+  <path class="trail-1" transform="translate(396 0)" d="M6 4h1v1h-1z"/>
+  <path class="halo" transform="translate(396 0)" d="M7 3h1v1h-1zM6 4h1v1h-1zM8 4h1v1h-1zM7 5h1v1h-1z"/>
+  <path class="core" transform="translate(396 0)" d="M7 4h1v1h-1z"/>
+  </g>
+  <g id="frame-19">
+  <path class="track" transform="translate(418 0)" d="M2 4h1v1h-1zM3 4h1v1h-1zM4 4h1v1h-1zM5 4h1v1h-1zM6 4h1v1h-1zM7 4h1v1h-1zM8 4h1v1h-1zM13 4h1v1h-1zM14 4h1v1h-1zM15 4h1v1h-1zM16 4h1v1h-1zM17 4h1v1h-1zM18 4h1v1h-1zM19 4h1v1h-1zM2 5h1v1h-1zM8 5h1v1h-1zM9 5h1v1h-1zM10 5h1v1h-1zM11 5h1v1h-1zM12 5h1v1h-1zM13 5h1v1h-1zM19 5h1v1h-1zM20 5h1v1h-1zM2 6h1v1h-1zM8 6h1v1h-1zM9 6h1v1h-1zM10 6h1v1h-1zM11 6h1v1h-1zM12 6h1v1h-1zM13 6h1v1h-1zM19 6h1v1h-1zM2 7h1v1h-1zM3 7h1v1h-1zM4 7h1v1h-1zM5 7h1v1h-1zM6 7h1v1h-1zM7 7h1v1h-1zM8 7h1v1h-1zM13 7h1v1h-1zM14 7h1v1h-1zM15 7h1v1h-1zM16 7h1v1h-1zM17 7h1v1h-1zM18 7h1v1h-1zM19 7h1v1h-1z"/>
+  <path class="trail-5" transform="translate(418 0)" d="M4 4h1v1h-1z"/>
+  <path class="trail-4" transform="translate(418 0)" d="M5 4h1v1h-1z"/>
+  <path class="trail-3" transform="translate(418 0)" d="M6 4h1v1h-1z"/>
+  <path class="trail-2" transform="translate(418 0)" d="M7 4h1v1h-1z"/>
+  <path class="trail-1" transform="translate(418 0)" d="M8 4h1v1h-1z"/>
+  <path class="halo" transform="translate(418 0)" d="M9 4h1v1h-1zM8 5h1v1h-1zM10 5h1v1h-1zM9 6h1v1h-1z"/>
+  <path class="core" transform="translate(418 0)" d="M9 5h1v1h-1z"/>
+  </g>
+</svg>

package/dist/web/brand/logo-wordmark.svg

@@ -0,0 +1,10 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 160 40" width="160" height="40" role="img" aria-label="OpenKan">
+  <title>OpenKan</title>
+  <!-- Mark, vertically centered in left 32px -->
+  <g transform="translate(0, 4)">
+    <rect x="5" y="0" width="4" height="32" rx="0.5" fill="currentColor"/>
+    <polygon points="9,16 21,0 25,0 13,16" fill="currentColor"/>
+    <polygon points="13,16 25,32 21,32 9,16" fill="currentColor"/>
+  </g>
+  <text x="40" y="26" font-family="-apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, 'SF Pro Text', 'Inter', 'Roboto', 'Helvetica Neue', Arial, sans-serif" font-size="20" font-weight="600" letter-spacing="-0.01em" fill="currentColor">OpenKan</text>
+</svg>

package/dist/web/brand/logo.svg

@@ -0,0 +1,9 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" width="32" height="32" role="img" aria-label="OpenKan mark">
+  <title>OpenKan</title>
+  <!-- Vertical bar -->
+  <rect x="5" y="4" width="4" height="24" rx="0.5" fill="currentColor"/>
+  <!-- Upper diagonal -->
+  <polygon points="9,16 21,4 25,4 13,16" fill="currentColor"/>
+  <!-- Lower diagonal -->
+  <polygon points="13,16 25,28 21,28 9,16" fill="currentColor"/>
+</svg>

package/dist/web/brand/pixel-infinity-track.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="22" height="12" viewBox="0 0 22 12" shape-rendering="crispEdges"><g fill="#6d6ff8" opacity=".34"><rect x="11" y="6" width="1" height="1"/><rect x="10" y="5" width="1" height="1"/><rect x="9" y="4" width="1" height="1"/><rect x="8" y="3" width="1" height="1"/><rect x="7" y="2" width="1" height="1"/><rect x="6" y="2" width="1" height="1"/><rect x="5" y="3" width="1" height="1"/><rect x="4" y="4" width="1" height="1"/><rect x="3" y="5" width="1" height="1"/><rect x="3" y="6" width="1" height="1"/><rect x="4" y="7" width="1" height="1"/><rect x="5" y="8" width="1" height="1"/><rect x="6" y="9" width="1" height="1"/><rect x="7" y="9" width="1" height="1"/><rect x="8" y="8" width="1" height="1"/><rect x="9" y="7" width="1" height="1"/><rect x="10" y="6" width="1" height="1"/><rect x="12" y="6" width="1" height="1"/><rect x="13" y="5" width="1" height="1"/><rect x="14" y="4" width="1" height="1"/><rect x="15" y="3" width="1" height="1"/><rect x="16" y="2" width="1" height="1"/><rect x="17" y="2" width="1" height="1"/><rect x="18" y="3" width="1" height="1"/><rect x="19" y="4" width="1" height="1"/><rect x="20" y="5" width="1" height="1"/><rect x="20" y="6" width="1" height="1"/><rect x="19" y="7" width="1" height="1"/><rect x="18" y="8" width="1" height="1"/><rect x="17" y="9" width="1" height="1"/><rect x="16" y="9" width="1" height="1"/><rect x="15" y="8" width="1" height="1"/><rect x="14" y="7" width="1" height="1"/><rect x="13" y="6" width="1" height="1"/></g></svg>

package/dist/web/brand/social-card.svg

@@ -0,0 +1,26 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1200 630" width="1200" height="630" role="img" aria-label="OpenKan — local-first kanban for people and coding agents">
+  <title>OpenKan</title>
+  <desc>Social card with K mark and OpenKan wordmark; tagline below; column silhouettes on the right; coral accent line.</desc>
+  <!-- Background -->
+  <rect width="1200" height="630" fill="#0d1117"/>
+  <!-- K mark 96x96 at x=120, y=240 (scaled 3x from 32x32) -->
+  <g transform="translate(120, 240) scale(3)">
+    <rect x="5" y="0" width="4" height="32" rx="0.5" fill="#e6ebf3"/>
+    <polygon points="9,16 21,0 25,0 13,16" fill="#e6ebf3"/>
+    <polygon points="13,16 25,32 21,32 9,16" fill="#e6ebf3"/>
+  </g>
+  <!-- "OpenKan" at 96px -->
+  <text x="240" y="345" font-family="-apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, 'SF Pro Text', 'Inter', 'Roboto', 'Helvetica Neue', Arial, sans-serif" font-size="96" font-weight="600" letter-spacing="-0.01em" fill="#e6ebf3">OpenKan</text>
+  <!-- Tagline at 28px -->
+  <text x="120" y="400" font-family="-apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, 'SF Pro Text', 'Inter', 'Roboto', 'Helvetica Neue', Arial, sans-serif" font-size="28" font-weight="400" fill="#aeb6c4">Local-first kanban for people and coding agents.</text>
+  <!-- Column silhouettes, right-anchored at x=720; 5 rects of 48 wide, spaced 12 -->
+  <g transform="translate(720, 150)">
+    <rect x="0"   y="240" width="48" height="120" rx="4" fill="rgba(255,107,91,0.12)" stroke="#FF6B5B" stroke-width="1"/>
+    <rect x="60"  y="180" width="48" height="180" rx="4" fill="rgba(255,107,91,0.12)" stroke="#FF6B5B" stroke-width="1"/>
+    <rect x="120" y="120" width="48" height="240" rx="4" fill="rgba(255,107,91,0.12)" stroke="#FF6B5B" stroke-width="1"/>
+    <rect x="180" y="60"  width="48" height="300" rx="4" fill="rgba(255,107,91,0.12)" stroke="#FF6B5B" stroke-width="1"/>
+    <rect x="240" y="0"   width="48" height="360" rx="4" fill="rgba(255,107,91,0.12)" stroke="#FF6B5B" stroke-width="1"/>
+  </g>
+  <!-- Coral accent line below tagline -->
+  <rect x="120" y="476" width="960" height="3" fill="#FF6B5B"/>
+</svg>