Add svg logo (not fully accurate) and other background images for makima.jp

3 files changed, 32 insertions, 127 deletions

diff --git a/frontend/public/a10-nerve-clips.svg b/frontend/public/a10-nerve-clips.svg
deleted file mode 100644
index d651857..0000000
--- a/frontend/public/a10-nerve-clips.svg
+++ /dev/null
@@ -1,26 +0,0 @@
-<svg width="60" height="24" viewBox="0 0 60 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-  <!-- Left clip -->
-  <g>
-    <!-- Main clip body with curved corner -->
-    <path d="M2 22 Q4 20 6 20 L12 2 L16 2 Q14 4 12 6 L6 22 Z" fill="#dc2626" stroke="#b91c1c" stroke-width="0.5"/>
-    <!-- Inner highlight -->
-    <path d="M3.5 20.5 Q5 19 6.5 19 L12.5 3.5 L14.5 3.5 Q13 5 11.5 6.5 L5.5 20.5 Z" fill="#ef4444" opacity="0.6"/>
-    <!-- Metal reflection -->
-    <path d="M4 19 Q5.5 18 7 18 L13 4 L14 4 Q12.5 5.5 11 7 L5 19 Z" fill="#fca5a5" opacity="0.3"/>
-  </g>
-
-  <!-- Right clip -->
-  <g>
-    <!-- Main clip body with curved corner -->
-    <path d="M58 22 Q56 20 54 20 L48 2 L44 2 Q46 4 48 6 L54 22 Z" fill="#dc2626" stroke="#b91c1c" stroke-width="0.5"/>
-    <!-- Inner highlight -->
-    <path d="M56.5 20.5 Q55 19 53.5 19 L47.5 3.5 L45.5 3.5 Q47 5 48.5 6.5 L54.5 20.5 Z" fill="#ef4444" opacity="0.6"/>
-    <!-- Metal reflection -->
-    <path d="M56 19 Q54.5 18 53 18 L47 4 L46 4 Q47.5 5.5 49 7 L55 19 Z" fill="#fca5a5" opacity="0.3"/>
-  </g>
-
-  <!-- Center connection hints (subtle) -->
-  <circle cx="30" cy="12" r="1" fill="#dc2626" opacity="0.4"/>
-  <circle cx="28" cy="12" r="0.5" fill="#ef4444" opacity="0.3"/>
-  <circle cx="32" cy="12" r="0.5" fill="#ef4444" opacity="0.3"/>
-</svg>
\ No newline at end of file
diff --git a/frontend/public/asuka-headset-logo.svg b/frontend/public/asuka-headset-logo.svg
deleted file mode 100644
index f8ba4c0..0000000
--- a/frontend/public/asuka-headset-logo.svg
+++ /dev/null
@@ -1,101 +0,0 @@
-<svg width="100" height="80" viewBox="0 0 100 80" xmlns="http://www.w3.org/2000/svg">
-  <defs>
-    <!-- White/silver gradient for the main interface -->
-    <linearGradient id="whiteGradient" x1="0%" y1="0%" x2="100%" y2="100%">
-      <stop offset="0%" style="stop-color:#ffffff;stop-opacity:1" />
-      <stop offset="50%" style="stop-color:#f0f0f0;stop-opacity:1" />
-      <stop offset="100%" style="stop-color:#d0d0d0;stop-opacity:1" />
-    </linearGradient>
-
-    <!-- Orange/yellow gradient for accent parts -->
-    <linearGradient id="orangeGradient" x1="0%" y1="0%" x2="100%" y2="100%">
-      <stop offset="0%" style="stop-color:#ffaa00;stop-opacity:1" />
-      <stop offset="50%" style="stop-color:#ff8800;stop-opacity:1" />
-      <stop offset="100%" style="stop-color:#ee6600;stop-opacity:1" />
-    </linearGradient>
-
-    <!-- Red gradient for warning/active elements -->
-    <radialGradient id="redGradient" cx="50%" cy="50%" r="50%">
-      <stop offset="0%" style="stop-color:#ff3333;stop-opacity:1" />
-      <stop offset="100%" style="stop-color:#cc0000;stop-opacity:1" />
-    </radialGradient>
-
-    <!-- Shadow filter -->
-    <filter id="shadow" x="-50%" y="-50%" width="200%" height="200%">
-      <feDropShadow dx="1" dy="2" stdDeviation="2" flood-color="#000000" flood-opacity="0.4"/>
-    </filter>
-
-    <!-- Glow filter -->
-    <filter id="glow" x="-50%" y="-50%" width="200%" height="200%">
-      <feGaussianBlur stdDeviation="2" result="coloredBlur"/>
-      <feMerge>
-        <feMergeNode in="coloredBlur"/>
-        <feMergeNode in="SourceGraphic"/>
-      </feMerge>
-    </filter>
-  </defs>
-
-  <!-- Left A10 nerve connector (the distinctive cat-ear like protrusion) -->
-  <g transform="translate(15, 25)">
-    <!-- Main white interface body -->
-    <ellipse cx="0" cy="5" rx="12" ry="18" fill="url(#whiteGradient)" filter="url(#shadow)"/>
-    <!-- Orange accent stripe -->
-    <rect x="-8" y="-8" width="16" height="4" fill="url(#orangeGradient)" rx="2"/>
-    <!-- Top connector detail -->
-    <rect x="-6" y="-12" width="12" height="6" fill="url(#whiteGradient)" rx="3"/>
-    <!-- Interface ports -->
-    <circle cx="-4" cy="2" r="2" fill="#333333"/>
-    <circle cx="4" cy="2" r="2" fill="#333333"/>
-    <circle cx="0" cy="8" r="2" fill="#333333"/>
-    <!-- Small indicator lights -->
-    <circle cx="-4" cy="-4" r="1.5" fill="url(#redGradient)" filter="url(#glow)"/>
-    <circle cx="4" cy="-4" r="1.5" fill="url(#redGradient)" filter="url(#glow)"/>
-  </g>
-
-  <!-- Right A10 nerve connector (mirrored) -->
-  <g transform="translate(85, 25)">
-    <!-- Main white interface body -->
-    <ellipse cx="0" cy="5" rx="12" ry="18" fill="url(#whiteGradient)" filter="url(#shadow)"/>
-    <!-- Orange accent stripe -->
-    <rect x="-8" y="-8" width="16" height="4" fill="url(#orangeGradient)" rx="2"/>
-    <!-- Top connector detail -->
-    <rect x="-6" y="-12" width="12" height="6" fill="url(#whiteGradient)" rx="3"/>
-    <!-- Interface ports -->
-    <circle cx="-4" cy="2" r="2" fill="#333333"/>
-    <circle cx="4" cy="2" r="2" fill="#333333"/>
-    <circle cx="0" cy="8" r="2" fill="#333333"/>
-    <!-- Small indicator lights -->
-    <circle cx="-4" cy="-4" r="1.5" fill="url(#redGradient)" filter="url(#glow)"/>
-    <circle cx="4" cy="-4" r="1.5" fill="url(#redGradient)" filter="url(#glow)"/>
-  </g>
-
-  <!-- Central connecting band (thin, barely visible like in the reference) -->
-  <path d="M 27 20 Q 50 12 73 20"
-        stroke="url(#whiteGradient)"
-        stroke-width="2"
-        fill="none"
-        opacity="0.7"/>
-
-  <!-- Central forehead interface (small white rectangular piece) -->
-  <g transform="translate(50, 15)">
-    <rect x="-8" y="-3" width="16" height="6" fill="url(#whiteGradient)" rx="2" filter="url(#shadow)"/>
-    <rect x="-6" y="-2" width="12" height="4" fill="url(#orangeGradient)" rx="1"/>
-    <!-- Central indicator -->
-    <circle cx="0" cy="0" r="1.5" fill="url(#redGradient)" filter="url(#glow)"/>
-  </g>
-
-  <!-- Additional connecting wires/cables (very thin lines) -->
-  <path d="M 27 25 Q 35 22 43 24" stroke="#666666" stroke-width="1" fill="none" opacity="0.5"/>
-  <path d="M 73 25 Q 65 22 57 24" stroke="#666666" stroke-width="1" fill="none" opacity="0.5"/>
-
-  <!-- Bottom neural interface details -->
-  <g transform="translate(15, 40)">
-    <rect x="-2" y="0" width="4" height="8" fill="url(#whiteGradient)" rx="1"/>
-    <rect x="-1" y="2" width="2" height="4" fill="url(#orangeGradient)"/>
-  </g>
-
-  <g transform="translate(85, 40)">
-    <rect x="-2" y="0" width="4" height="8" fill="url(#whiteGradient)" rx="1"/>
-    <rect x="-1" y="2" width="2" height="4" fill="url(#orangeGradient)"/>
-  </g>
-</svg>
\ No newline at end of file
diff --git a/frontend/public/logo/crane.svg b/frontend/public/logo/crane.svg
new file mode 100644
index 0000000..b5d5c52
--- /dev/null
+++ b/frontend/public/logo/crane.svg
@@ -0,0 +1,32 @@
+
+<svg width="512" height="512" viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg">
+    <defs>
+        <style>
+            .cls-1 {
+            fill: none;
+            stroke: #000000;
+            stroke-linecap: round;
+            stroke-linejoin: round;
+            stroke-width: 2px;
+            }
+        </style>
+    </defs>
+
+    <!-- Tail & Lower Body -->
+    <path class="cls-1" d="M35,235 L168,290" />
+    <path class="cls-1" d="M35,235 L203,400" />
+
+    <!-- Left Wing (Front) & Main Body Diagonal -->
+    <path class="cls-1" d="M110,105 L203,400 L285,350 L110,105 Z" />
+
+    <!-- Right Wing (Back) -->
+    <path class="cls-1" d="M278,145 L360,270 L250,301 Z" />
+
+    <!-- Head & Neck -->
+    <path class="cls-1" d="M360,270 L403,214 L496,290 L410,255 L355,375 L360,270" />
+
+    <!-- Internal Connections -->
+    <line class="cls-1" x1="250" y1="301" x2="355" y2="375" />
+    <line class="cls-1" x1="355" y1="375" x2="285" y2="350" />
+</svg>
+