add graphics concepts (icon, splash-screen)

@graphics/bundle-boiler-icon.svg

@@ -0,0 +1,110 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+  <!-- 64x64 Version - Updated with bolder lines -->
+  <g id="icon-64" transform="translate(0,0)">
+    <svg viewBox="0 0 64 64" width="64" height="64">
+      <!-- Background -->
+      <rect x="0" y="0" width="64" height="64" fill="#0a0a0a" rx="8"/>
+      
+      <!-- Pot Body - Increased stroke width -->
+      <path d="M16 20 
+               C16 20, 14 12, 24 12 
+               L40 12 
+               C50 12, 48 20, 48 20
+               C55 25, 54 40, 52 52 
+               C52 54, 12 54, 12 52
+               C10 40, 9 25, 16 20 Z" 
+            fill="#1a1a1a" stroke="#00ff00" stroke-width="3"/>
+      
+      <!-- Pot Neck - Increased stroke width -->
+      <path d="M24 12 C24 8, 40 8, 40 12" stroke="#00ff00" stroke-width="3" fill="none"/>
+      
+      <!-- Steam - Slightly thicker -->
+      <path d="M28 6 Q32 2 36 6" stroke="#00ff00" stroke-width="2" opacity="0.6">
+        <animate attributeName="opacity" values="0.6;0.3;0.6" dur="2s" repeatCount="indefinite"/>
+      </path>
+      
+      <!-- Gears - Made larger -->
+      <g class="falling-gears">
+        <path d="M14 30 L18 26 L22 30 L18 34 Z" fill="#00cc00" transform="rotate(45, 18, 30)">
+          <animateTransform attributeName="transform" type="rotate" from="0 18 30" to="360 18 30" dur="3s" repeatCount="indefinite"/>
+        </path>
+        
+        <path d="M41 35 L45 31 L49 35 L45 39 Z" fill="#33ff33" transform="rotate(-30, 45, 35)">
+          <animateTransform attributeName="transform" type="rotate" from="360 45 35" to="0 45 35" dur="2s" repeatCount="indefinite"/>
+        </path>
+        
+        <path d="M29 45 L33 41 L37 45 L33 49 Z" fill="#00ff66" transform="rotate(15, 33, 45)">
+          <animateTransform attributeName="transform" type="rotate" from="0 33 45" to="360 33 45" dur="2.5s" repeatCount="indefinite"/>
+        </path>
+      </g>
+      
+      <!-- Glowing Elements - Made larger -->
+      <circle cx="25" cy="25" r="4" fill="#00ff00">
+        <animate attributeName="opacity" values="1;0.5;1" dur="1s" repeatCount="indefinite"/>
+      </circle>
+      <circle cx="40" cy="20" r="3" fill="#33ff33">
+        <animate attributeName="opacity" values="0.5;1;0.5" dur="1.5s" repeatCount="indefinite"/>
+      </circle>
+    </svg>
+  </g>
+
+  <!-- 32x32 Version -->
+  <g id="icon-32" transform="translate(80,0)">
+    <svg viewBox="0 0 32 32" width="32" height="32">
+      <!-- Background -->
+      <rect x="0" y="0" width="32" height="32" fill="#0a0a0a" rx="4"/>
+      
+      <!-- Simplified Pot - Increased stroke width -->
+      <path d="M8 10 
+               C8 10, 7 6, 12 6 
+               L20 6 
+               C25 6, 24 10, 24 10
+               C28 12, 27 20, 26 26 
+               C26 27, 6 27, 6 26
+               C5 20, 4 12, 8 10 Z" 
+            fill="#1a1a1a" stroke="#00ff00" stroke-width="2"/>
+      
+      <!-- Pot Neck - Increased stroke width -->
+      <path d="M12 6 C12 4, 20 4, 20 6" stroke="#00ff00" stroke-width="2" fill="none"/>
+      
+      <!-- Larger Gears -->
+      <path d="M9 15 L12 12 L15 15 L12 18 Z" fill="#00cc00">
+        <animateTransform attributeName="transform" type="rotate" from="0 12 15" to="360 12 15" dur="3s" repeatCount="indefinite"/>
+      </path>
+      <path d="M17 18 L20 15 L23 18 L20 21 Z" fill="#33ff33">
+        <animateTransform attributeName="transform" type="rotate" from="360 20 18" to="0 20 18" dur="2s" repeatCount="indefinite"/>
+      </path>
+
+      <!-- Glowing dot -->
+      <circle cx="16" cy="12" r="2" fill="#00ff00">
+        <animate attributeName="opacity" values="1;0.5;1" dur="1s" repeatCount="indefinite"/>
+      </circle>
+    </svg>
+  </g>
+
+  <!-- 16x16 Version -->
+  <g id="icon-16" transform="translate(128,0)">
+    <svg viewBox="0 0 16 16" width="16" height="16">
+      <!-- Background -->
+      <rect x="0" y="0" width="16" height="16" fill="#0a0a0a" rx="2"/>
+      
+      <!-- Minimal Pot - Increased stroke width -->
+      <path d="M4.5 5 
+               C4.5 5, 4 3, 6 3 
+               L10 3 
+               C12 3, 11.5 5, 11.5 5
+               C13 6, 12.5 10, 12 12.5 
+               C12 13, 4 13, 4 12.5
+               C3.5 10, 3 6, 4.5 5 Z" 
+            fill="#1a1a1a" stroke="#00ff00" stroke-width="1.5"/>
+      
+      <!-- Larger Gear -->
+      <path d="M6 8 L7.5 6.5 L9 8 L7.5 9.5 Z" fill="#00cc00">
+        <animateTransform attributeName="transform" type="rotate" from="0 7.5 8" to="360 7.5 8" dur="3s" repeatCount="indefinite"/>
+      </path>
+
+      <!-- Larger glowing dot -->
+      <circle cx="10" cy="6" r="1.2" fill="#00ff00"/>
+    </svg>
+  </g>
+</svg>

@graphics/splash-screen.svg

@@ -0,0 +1,109 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 800 400">
+  <!-- Background with gradient -->
+  <defs>
+    <linearGradient id="bgGradient" x1="0%" y1="0%" x2="100%" y2="100%">
+      <stop offset="0%" style="stop-color:#0a0a0a;stop-opacity:1" />
+      <stop offset="100%" style="stop-color:#1a1a1a;stop-opacity:1" />
+    </linearGradient>
+    
+    <!-- Glow filter -->
+    <filter id="greenGlow">
+      <feGaussianBlur stdDeviation="2" result="coloredBlur"/>
+      <feMerge>
+        <feMergeNode in="coloredBlur"/>
+        <feMergeNode in="SourceGraphic"/>
+      </feMerge>
+    </filter>
+  </defs>
+
+  <!-- Main background -->
+  <rect width="800" height="400" fill="url(#bgGradient)"/>
+  
+  <!-- Grid pattern -->
+  <path d="M0 40 L800 40 M0 80 L800 80 M0 120 L800 120 M0 160 L800 160 
+           M0 200 L800 200 M0 240 L800 240 M0 280 L800 280 M0 320 L800 320 M0 360 L800 360"
+        stroke="#00ff00" stroke-width="0.5" stroke-opacity="0.1"/>
+  <path d="M40 0 L40 400 M80 0 L80 400 M120 0 L120 400 M160 0 L160 400 
+           M200 0 L200 400 M240 0 L240 400 M280 0 L280 400 M320 0 L320 400"
+        stroke="#00ff00" stroke-width="0.5" stroke-opacity="0.1"/>
+
+  <!-- Main Boiler Logo -->
+  <g transform="translate(400,160) scale(2)">
+    <!-- Pot Body -->
+    <path d="M-20 10 
+             C-20 10, -22 2, -12 2 
+             L12 2 
+             C22 2, 20 10, 20 10
+             C27 15, 26 30, 24 42 
+             C24 44, -24 44, -24 42
+             C-26 30, -27 15, -20 10 Z" 
+          fill="#1a1a1a" stroke="#00ff00" stroke-width="3" filter="url(#greenGlow)"/>
+    
+    <!-- Pot Neck -->
+    <path d="M-12 2 C-12 -2, 12 -2, 12 2" stroke="#00ff00" stroke-width="3" fill="none" filter="url(#greenGlow)"/>
+    
+    <!-- Steam with more curls -->
+    <path d="M-8 -4 Q-4 -8 0 -6 T8 -4" stroke="#00ff00" stroke-width="2" opacity="0.6" filter="url(#greenGlow)">
+      <animate attributeName="opacity" values="0.6;0.3;0.6" dur="2s" repeatCount="indefinite"/>
+    </path>
+    
+    <!-- Additional steam -->
+    <path d="M-4 -3 Q0 -7 4 -3" stroke="#00ff00" stroke-width="1.5" opacity="0.4" filter="url(#greenGlow)">
+      <animate attributeName="opacity" values="0.4;0.1;0.4" dur="1.5s" repeatCount="indefinite"/>
+    </path>
+    
+    <!-- Animated Gears - Now more of them -->
+    <path d="M-16 20 L-12 16 L-8 20 L-12 24 Z" fill="#00cc00">
+      <animateTransform attributeName="transform" type="rotate" from="0 -12 20" to="360 -12 20" dur="3s" repeatCount="indefinite"/>
+    </path>
+    <path d="M12 25 L16 21 L20 25 L16 29 Z" fill="#33ff33">
+      <animateTransform attributeName="transform" type="rotate" from="360 16 25" to="0 16 25" dur="2s" repeatCount="indefinite"/>
+    </path>
+    
+    <!-- New Hexagonal Gear -->
+    <path d="M-4 30 L-2 27 L2 27 L4 30 L2 33 L-2 33 Z" fill="#00ff66">
+      <animateTransform attributeName="transform" type="rotate" from="0 0 30" to="360 0 30" dur="4s" repeatCount="indefinite"/>
+    </path>
+    
+    <!-- Small Round Gear -->
+    <path d="M-8 35 L-6 33 L-4 35 L-6 37 Z" fill="#00cc00">
+      <animateTransform attributeName="transform" type="rotate" from="360 -6 35" to="0 -6 35" dur="1.5s" repeatCount="indefinite"/>
+    </path>
+    
+    <!-- Triangle piece -->
+    <path d="M8 15 L11 12 L14 15" stroke="#33ff33" fill="none" stroke-width="1">
+      <animate attributeName="transform" values="translate(0,0);translate(0,2);translate(0,0)" dur="1s" repeatCount="indefinite"/>
+    </path>
+    
+    <!-- Circuit-like lines -->
+    <path d="M-10 15 H-5 M5 15 H10" stroke="#00ff00" stroke-width="1" opacity="0.8"/>
+    <path d="M-8 25 H-3 M3 25 H8" stroke="#00ff00" stroke-width="1" opacity="0.8"/>
+    
+    <!-- Glowing dots -->
+    <circle cx="-10" cy="30" r="1" fill="#00ff00">
+      <animate attributeName="opacity" values="1;0.3;1" dur="1s" repeatCount="indefinite"/>
+    </circle>
+    <circle cx="10" cy="35" r="1" fill="#00ff00">
+      <animate attributeName="opacity" values="0.3;1;0.3" dur="1.2s" repeatCount="indefinite"/>
+    </circle>
+    <circle cx="0" cy="20" r="1.2" fill="#33ff33">
+      <animate attributeName="opacity" values="0.7;0.2;0.7" dur="0.8s" repeatCount="indefinite"/>
+    </circle>
+  </g>
+
+  <!-- Title Text -->
+  <text x="400" y="320" fill="#00ff00" font-family="Arial, sans-serif" font-size="48" text-anchor="middle" 
+        filter="url(#greenGlow)" font-weight="bold">
+    BundleBoiler
+  </text>
+  
+  <!-- Loading Bar -->
+  <rect x="300" y="350" width="200" height="4" fill="#1a1a1a" stroke="#00ff00" stroke-width="1"/>
+  <rect x="300" y="350" width="0" height="4" fill="#00ff00">
+    <animate attributeName="width" values="0;200" dur="2s" repeatCount="indefinite"/>
+  </rect>
+
+  <!-- Version Text -->
+  <text x="400" y="380" fill="#00ff00" font-family="Arial, sans-serif" font-size="14" text-anchor="middle" 
+        opacity="0.7">Version 1.0.0</text>
+</svg>