diff --git a/.gitignore b/.gitignore
index 14cf026..9191781 100644
--- a/.gitignore
+++ b/.gitignore
@@ -16,7 +16,8 @@ dist/
 .gemini/
 tmp/
 
-# Large Media Directories (Uncomment if they should be ignored to fix 413 error)
-动态绘本/
-故事书封面图/
-*.mp4
+# Large Media Directories
+# (Uncomment below if push fails due to 413 error)
+# 动态绘本/
+# 故事书封面图/
+# *.mp4
diff --git a/Capybara.png b/Capybara.png
new file mode 100644
index 0000000..26f951e
Binary files /dev/null and b/Capybara.png differ
diff --git a/Capybara_icon.png b/Capybara_icon.png
new file mode 100644
index 0000000..681199d
Binary files /dev/null and b/Capybara_icon.png differ
diff --git a/group 1 (2).png b/group 1 (2).png
new file mode 100644
index 0000000..1532f45
Binary files /dev/null and b/group 1 (2).png differ
diff --git a/icons/icon-battery-full.svg b/icons/icon-battery-full.svg
new file mode 100644
index 0000000..a18829c
--- /dev/null
+++ b/icons/icon-battery-full.svg
@@ -0,0 +1,5 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <rect x="2" y="6" width="18" height="12" rx="2" stroke="currentColor" stroke-width="2"/>
+    <path d="M22 10V14" stroke="currentColor" stroke-width="2" stroke-linecap="round"/>
+    <rect x="5" y="9" width="12" height="6" rx="1" fill="currentColor"/>
+</svg>
diff --git a/icons/icon-home-capybara.svg b/icons/icon-home-capybara.svg
new file mode 100644
index 0000000..4ed91eb
--- /dev/null
+++ b/icons/icon-home-capybara.svg
@@ -0,0 +1,5 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <!-- Home: Chunky Capybara (2px grid) -->
+    <!-- Using evenodd rule for subtraction -->
+    <path fill-rule="evenodd" clip-rule="evenodd" d="M4 6 H8 V8 H16 V6 H20 V18 H4 V6 Z M6 10 H8 V12 H6 V10 Z M16 10 H18 V12 H16 V10 Z M10 14 H14 V16 H10 V14 Z" fill="currentColor"/>
+</svg>
diff --git a/icons/icon-home-pixel.svg b/icons/icon-home-pixel.svg
new file mode 100644
index 0000000..ba35807
--- /dev/null
+++ b/icons/icon-home-pixel.svg
@@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <path fill-rule="evenodd" clip-rule="evenodd" d="M4 12 H10 V20 H4 Z M6 14 V18 H8 V14 Z M14 12 H20 V20 H14 Z M16 14 V18 H18 V14 Z M2 12 H22 V10 H2 Z M4 8 H20 V10 H4 Z M6 6 H18 V8 H6 Z M8 4 H16 V6 H8 Z" fill="currentColor"/>
+</svg>
diff --git a/icons/icon-home.svg b/icons/icon-home.svg
new file mode 100644
index 0000000..69cb89a
--- /dev/null
+++ b/icons/icon-home.svg
@@ -0,0 +1,4 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <path d="M3 9L12 2L21 9V20C21 20.5304 20.7893 21.0391 20.4142 21.4142C20.0391 21.7893 19.5304 22 19 22H5C4.46957 22 3.96086 21.7893 3.58579 21.4142C3.21071 21.0391 3 20.5304 3 20V9Z" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+    <path d="M9 22V12H15V22" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>
diff --git a/icons/icon-music-pixel.svg b/icons/icon-music-pixel.svg
new file mode 100644
index 0000000..2d8fcea
--- /dev/null
+++ b/icons/icon-music-pixel.svg
@@ -0,0 +1,13 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <!-- Music: Chunky Double Note (2px grid) -->
+    <!-- Stems (2px wide) -->
+    <rect x="5" y="6" width="2" height="10" fill="currentColor"/>
+    <rect x="15" y="4" width="2" height="10" fill="currentColor"/>
+    <!-- Note Heads (2px height visual weight, actually 4px rects) -->
+    <rect x="3" y="14" width="6" height="4" fill="currentColor"/>
+    <rect x="13" y="12" width="6" height="4" fill="currentColor"/>
+    <!-- Beam (2px stepped) -->
+    <rect x="5" y="6" width="4" height="2" fill="currentColor"/>
+    <rect x="9" y="5" width="4" height="2" fill="currentColor"/>
+    <rect x="13" y="4" width="4" height="2" fill="currentColor"/>
+</svg>
diff --git a/icons/icon-music.svg b/icons/icon-music.svg
new file mode 100644
index 0000000..d47ac97
--- /dev/null
+++ b/icons/icon-music.svg
@@ -0,0 +1,5 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <path d="M9 18V5L21 3V16" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+    <circle cx="6" cy="18" r="3" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+    <circle cx="18" cy="16" r="3" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>
diff --git a/icons/icon-pause.svg b/icons/icon-pause.svg
new file mode 100644
index 0000000..56dd988
--- /dev/null
+++ b/icons/icon-pause.svg
@@ -0,0 +1,4 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect x="6" y="4" width="4" height="16" rx="2" fill="currentColor" />
+<rect x="14" y="4" width="4" height="16" rx="2" fill="currentColor" />
+</svg>
diff --git a/icons/icon-play.svg b/icons/icon-play.svg
new file mode 100644
index 0000000..c5c829a
--- /dev/null
+++ b/icons/icon-play.svg
@@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M5 3L19 12L5 21V3Z" fill="currentColor" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>
diff --git a/icons/icon-product-badge.svg b/icons/icon-product-badge.svg
new file mode 100644
index 0000000..e695782
--- /dev/null
+++ b/icons/icon-product-badge.svg
@@ -0,0 +1,7 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <path fill-rule="evenodd" clip-rule="evenodd" d="M8 2 H16 V4 H20 V8 H22 V16 H20 V20 H16 V22 H8 V20 H4 V16 H2 V8 H4 V4 H8 V2 Z M8 4 H16 V6 H18 V8 H20 V16 H18 V20 H16 V18 H18 V16 H20 V8 H18 V6 H16 V4 H8 Z" fill="currentColor"/>
+    <rect x="6" y="6" width="12" height="12" rx="1" fill="currentColor" fill-opacity="0.3"/>
+    <rect x="9" y="10" width="2" height="2" fill="currentColor"/>
+    <rect x="13" y="10" width="2" height="2" fill="currentColor"/>
+    <rect x="10" y="13" width="4" height="1" fill="currentColor"/>
+</svg>
diff --git a/icons/icon-product-luo.svg b/icons/icon-product-luo.svg
new file mode 100644
index 0000000..6841ed5
--- /dev/null
+++ b/icons/icon-product-luo.svg
@@ -0,0 +1,8 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <!-- Luo Tianyi: Vsinger Logo/Symbol -->
+    <!-- Note/Diamond Shape -->
+    <path d="M12 2L17 7V17L12 22L7 17V7L12 2Z" fill="currentColor" fill-opacity="0.2"/>
+    <path d="M12 4L15 7V17L12 20L9 17V7L12 4Z" fill="currentColor"/>
+    <!-- Mike/Singer hint -->
+    <rect x="11" y="8" width="2" height="6" fill="white"/>
+</svg>
diff --git a/icons/icon-settings-pixel.svg b/icons/icon-settings-pixel.svg
new file mode 100644
index 0000000..1b79d62
--- /dev/null
+++ b/icons/icon-settings-pixel.svg
@@ -0,0 +1,4 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <!-- Gear Body -->
+    <path fill-rule="evenodd" clip-rule="evenodd" d="M10 2 H14 V4 H18 V6 H20 V10 H22 V14 H20 V18 H18 V20 H14 V22 H10 V20 H6 V18 H4 V14 H2 V10 H4 V6 H6 V4 H10 V2 Z M10 8 V10 H8 V14 H10 V16 H14 V14 H16 V10 H14 V8 H10 Z" fill="currentColor"/>
+</svg>
diff --git a/icons/icon-settings.svg b/icons/icon-settings.svg
new file mode 100644
index 0000000..9d78bef
--- /dev/null
+++ b/icons/icon-settings.svg
@@ -0,0 +1,4 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <path d="M12 15C13.6569 15 15 13.6569 15 12C15 10.3431 13.6569 9 12 9C10.3431 9 9 10.3431 9 12C9 13.6569 10.3431 15 12 15Z" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+    <path d="M19.4 15A1.65 1.65 0 0 0 20.3 12a1.65 1.65 0 0 0-.9-3M16 8.3a1.65 1.65 0 0 0 .8-2.5A1.65 1.65 0 0 0 14 5.3M12 4a1.65 1.65 0 0 0 0-3 1.65 1.65 0 0 0 0 3M8 5.3a1.65 1.65 0 0 0-2.8.5 1.65 1.65 0 0 0 .8 2.5M4.6 9a1.65 1.65 0 0 0-.9 3 1.65 1.65 0 0 0 .9 3M8 15.7a1.65 1.65 0 0 0-.8 2.5A1.65 1.65 0 0 0 10 18.7M12 20a1.65 1.65 0 0 0 0 3 1.65 1.65 0 0 0 0-3M16 18.7a1.65 1.65 0 0 0 2.8-.5 1.65 1.65 0 0 0-.8-2.5" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>
diff --git a/icons/icon-shuffle.svg b/icons/icon-shuffle.svg
new file mode 100644
index 0000000..e8e8ccd
--- /dev/null
+++ b/icons/icon-shuffle.svg
@@ -0,0 +1,7 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M16 3L21 3L21 8" stroke="#374151" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M4 20L21 3" stroke="#374151" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M21 16L21 21L16 21" stroke="#374151" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M15 15L21 21" stroke="#374151" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M4 4L9 9" stroke="#374151" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>
diff --git a/icons/icon-story-pixel.svg b/icons/icon-story-pixel.svg
new file mode 100644
index 0000000..2eeae1f
--- /dev/null
+++ b/icons/icon-story-pixel.svg
@@ -0,0 +1,12 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <!-- Story: Chunky Pixel Book (2px grid) -->
+    <!-- Left Page -->
+    <rect x="4" y="6" width="6" height="12" stroke="currentColor" stroke-width="2" fill="none"/>
+    <!-- Right Page -->
+    <rect x="12" y="6" width="6" height="12" stroke="currentColor" stroke-width="2" fill="none"/>
+    <!-- Spine Connection (Pixel block) -->
+    <rect x="10" y="8" width="2" height="8" fill="currentColor"/>
+    <!-- Detail on page (Symbol) -->
+    <rect x="6" y="8" width="2" height="2" fill="currentColor"/>
+    <rect x="14" y="10" width="2" height="2" fill="currentColor"/>
+</svg>
diff --git a/icons/icon-story.svg b/icons/icon-story.svg
new file mode 100644
index 0000000..ae0f426
--- /dev/null
+++ b/icons/icon-story.svg
@@ -0,0 +1,5 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <path d="M4 19.5A2.5 2.5 0 0 1 6.5 17H20" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+    <path d="M6.5 2H20V22H6.5A2.5 2.5 0 0 1 4 19.5V4.5A2.5 2.5 0 0 1 6.5 2Z" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+    <path d="M12 6L13.5 10L17.5 10.5L14.5 13.5L15.5 17.5L12 15L8.5 17.5L9.5 13.5L6.5 10.5L10.5 10L12 6Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>
diff --git a/icons/icon-switch.svg b/icons/icon-switch.svg
new file mode 100644
index 0000000..d4394cf
--- /dev/null
+++ b/icons/icon-switch.svg
@@ -0,0 +1,4 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <path d="M7 16V4M7 4L3 8M7 4L11 8" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+    <path d="M17 8V20M17 20L21 16M17 20L13 16" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>
diff --git a/icons/icon-user-pixel.svg b/icons/icon-user-pixel.svg
new file mode 100644
index 0000000..c712545
--- /dev/null
+++ b/icons/icon-user-pixel.svg
@@ -0,0 +1,9 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <!-- User: Chunky Avatar (2px grid) -->
+    <!-- Head (Outline 2px) -->
+    <rect x="8" y="5" width="8" height="6" stroke="currentColor" stroke-width="2" fill="none"/>
+    <!-- Body (Outline 2px) -->
+    <path d="M5 15H19V19H5V15Z" stroke="currentColor" stroke-width="2" fill="none"/> <!-- Simple block body -->
+    <!-- Connection -->
+    <rect x="10" y="11" width="4" height="4" fill="currentColor"/> <!-- Neck/Connection -->
+</svg>
diff --git a/icons/icon-user.svg b/icons/icon-user.svg
new file mode 100644
index 0000000..389e647
--- /dev/null
+++ b/icons/icon-user.svg
@@ -0,0 +1,4 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <path d="M20 21V19C20 17.9391 19.5786 16.9217 18.8284 16.1716C18.0783 15.4214 17.0609 15 16 15H8C6.93913 15 5.92172 15.4214 5.17157 16.1716C4.42143 16.9217 4 17.9391 4 19V21" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+    <circle cx="12" cy="7" r="4" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>
diff --git a/icons/pixel-badge-ai.svg b/icons/pixel-badge-ai.svg
new file mode 100644
index 0000000..b287fb9
--- /dev/null
+++ b/icons/pixel-badge-ai.svg
@@ -0,0 +1,32 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" width="128" height="128">
+  <!-- Pixel Badge AI - 8-bit style circular screen device -->
+  <style>
+    .frame { fill: #1E3A5F; }
+    .screen { fill: #3B82F6; }
+    .glow { fill: #60A5FA; }
+    .pixel { fill: #FFFFFF; }
+  </style>
+  
+  <!-- Outer frame -->
+  <rect class="frame" x="6" y="6" width="20" height="20"/>
+  <rect class="frame" x="4" y="8" width="2" height="16"/>
+  <rect class="frame" x="26" y="8" width="2" height="16"/>
+  <rect class="frame" x="8" y="4" width="16" height="2"/>
+  <rect class="frame" x="8" y="26" width="16" height="2"/>
+  
+  <!-- Screen glow -->
+  <rect class="glow" x="8" y="8" width="16" height="16" opacity="0.3"/>
+  
+  <!-- Screen -->
+  <rect class="screen" x="10" y="10" width="12" height="12"/>
+  
+  <!-- Pixel face on screen -->
+  <rect class="pixel" x="12" y="12" width="2" height="2"/>
+  <rect class="pixel" x="18" y="12" width="2" height="2"/>
+  <rect class="pixel" x="12" y="18" width="2" height="2"/>
+  <rect class="pixel" x="14" y="20" width="4" height="2"/>
+  <rect class="pixel" x="18" y="18" width="2" height="2"/>
+  
+  <!-- Corner highlights -->
+  <rect class="glow" x="6" y="6" width="2" height="2" opacity="0.5"/>
+</svg>
diff --git a/icons/pixel-badge-basic.svg b/icons/pixel-badge-basic.svg
new file mode 100644
index 0000000..7445837
--- /dev/null
+++ b/icons/pixel-badge-basic.svg
@@ -0,0 +1,28 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" width="128" height="128">
+  <!-- Pixel Badge Basic - 8-bit style circular screen device (gray) -->
+  <style>
+    .frame { fill: #475569; }
+    .screen { fill: #94A3B8; }
+    .light { fill: #CBD5E1; }
+    .pixel { fill: #F1F5F9; }
+  </style>
+  
+  <!-- Outer frame -->
+  <rect class="frame" x="6" y="6" width="20" height="20"/>
+  <rect class="frame" x="4" y="8" width="2" height="16"/>
+  <rect class="frame" x="26" y="8" width="2" height="16"/>
+  <rect class="frame" x="8" y="4" width="16" height="2"/>
+  <rect class="frame" x="8" y="26" width="16" height="2"/>
+  
+  <!-- Screen -->
+  <rect class="screen" x="10" y="10" width="12" height="12"/>
+  
+  <!-- Simple pixel pattern on screen -->
+  <rect class="pixel" x="12" y="12" width="2" height="2"/>
+  <rect class="pixel" x="18" y="12" width="2" height="2"/>
+  <rect class="pixel" x="14" y="16" width="4" height="2"/>
+  <rect class="pixel" x="12" y="18" width="8" height="2"/>
+  
+  <!-- Corner highlights -->
+  <rect class="light" x="6" y="6" width="2" height="2" opacity="0.3"/>
+</svg>
diff --git a/icons/pixel-capybara.svg b/icons/pixel-capybara.svg
new file mode 100644
index 0000000..4285867
--- /dev/null
+++ b/icons/pixel-capybara.svg
@@ -0,0 +1,39 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" width="128" height="128">
+  <!-- Pixel Capybara - 8-bit style -->
+  <style>
+    .body { fill: #D4A574; }
+    .dark { fill: #A67B5B; }
+    .nose { fill: #8B5A3C; }
+    .eye { fill: #2D2D2D; }
+    .cheek { fill: #FFCCCB; }
+  </style>
+  
+  <!-- Body -->
+  <rect class="body" x="8" y="14" width="16" height="12"/>
+  <rect class="body" x="6" y="16" width="2" height="8"/>
+  <rect class="body" x="24" y="16" width="2" height="8"/>
+  
+  <!-- Head -->
+  <rect class="body" x="10" y="8" width="12" height="8"/>
+  <rect class="body" x="8" y="10" width="2" height="4"/>
+  <rect class="body" x="22" y="10" width="2" height="4"/>
+  
+  <!-- Ears -->
+  <rect class="dark" x="8" y="6" width="4" height="4"/>
+  <rect class="dark" x="20" y="6" width="4" height="4"/>
+  
+  <!-- Eyes -->
+  <rect class="eye" x="12" y="10" width="2" height="2"/>
+  <rect class="eye" x="18" y="10" width="2" height="2"/>
+  
+  <!-- Nose -->
+  <rect class="nose" x="14" y="12" width="4" height="2"/>
+  
+  <!-- Cheeks -->
+  <rect class="cheek" x="10" y="12" width="2" height="2" opacity="0.6"/>
+  <rect class="cheek" x="20" y="12" width="2" height="2" opacity="0.6"/>
+  
+  <!-- Legs -->
+  <rect class="dark" x="10" y="24" width="4" height="4"/>
+  <rect class="dark" x="18" y="24" width="4" height="4"/>
+</svg>
diff --git a/icons/pixel-mystery-box.svg b/icons/pixel-mystery-box.svg
new file mode 100644
index 0000000..46f487e
--- /dev/null
+++ b/icons/pixel-mystery-box.svg
@@ -0,0 +1,38 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" width="120" height="120">
+  <!-- Pixel Mystery Box - 8-bit Mario style -->
+  <style>
+    .gold-light { fill: #FCD34D; }
+    .gold-main { fill: #F59E0B; }
+    .gold-dark { fill: #D97706; }
+    .gold-shadow { fill: #92400E; }
+    .question { fill: #92400E; }
+  </style>
+  
+  <!-- Box body -->
+  <rect class="gold-main" x="4" y="4" width="24" height="24"/>
+  
+  <!-- Top highlight -->
+  <rect class="gold-light" x="4" y="4" width="24" height="4"/>
+  <rect class="gold-light" x="4" y="4" width="4" height="24"/>
+  
+  <!-- Bottom shadow -->
+  <rect class="gold-dark" x="4" y="24" width="24" height="4"/>
+  <rect class="gold-dark" x="24" y="4" width="4" height="24"/>
+  
+  <!-- Corner details -->
+  <rect class="gold-shadow" x="24" y="24" width="4" height="4"/>
+  <rect class="gold-light" x="4" y="4" width="4" height="4"/>
+  
+  <!-- Inner border -->
+  <rect class="gold-dark" x="6" y="6" width="20" height="2"/>
+  <rect class="gold-dark" x="6" y="24" width="20" height="2"/>
+  <rect class="gold-dark" x="6" y="6" width="2" height="20"/>
+  <rect class="gold-dark" x="24" y="6" width="2" height="20"/>
+  
+  <!-- Question mark - pixel style -->
+  <rect class="question" x="12" y="10" width="8" height="2"/>
+  <rect class="question" x="18" y="10" width="2" height="6"/>
+  <rect class="question" x="14" y="14" width="4" height="2"/>
+  <rect class="question" x="14" y="16" width="2" height="2"/>
+  <rect class="question" x="14" y="20" width="2" height="2"/>
+</svg>
diff --git a/icons/wifi-1.svg b/icons/wifi-1.svg
new file mode 100644
index 0000000..45f1932
--- /dev/null
+++ b/icons/wifi-1.svg
@@ -0,0 +1,6 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <path d="M12 20L12.01 20" stroke="#8B5CF6" stroke-width="2" stroke-linecap="round"/>
+    <path d="M8.53 16.11C10.45 14.19 13.55 14.19 15.47 16.11" stroke="#E5E7EB" stroke-width="2" stroke-linecap="round"/>
+    <path d="M5 12.55C8.87 8.68 15.13 8.68 19 12.55" stroke="#E5E7EB" stroke-width="2" stroke-linecap="round"/>
+    <path d="M1.42 9C7.26 3.16 16.74 3.16 22.58 9" stroke="#E5E7EB" stroke-width="2" stroke-linecap="round"/>
+</svg>
diff --git a/icons/wifi-2.svg b/icons/wifi-2.svg
new file mode 100644
index 0000000..64e5dc5
--- /dev/null
+++ b/icons/wifi-2.svg
@@ -0,0 +1,6 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <path d="M12 20L12.01 20" stroke="#8B5CF6" stroke-width="2" stroke-linecap="round"/>
+    <path d="M8.53 16.11C10.45 14.19 13.55 14.19 15.47 16.11" stroke="#8B5CF6" stroke-width="2" stroke-linecap="round"/>
+    <path d="M5 12.55C8.87 8.68 15.13 8.68 19 12.55" stroke="#E5E7EB" stroke-width="2" stroke-linecap="round"/>
+    <path d="M1.42 9C7.26 3.16 16.74 3.16 22.58 9" stroke="#E5E7EB" stroke-width="2" stroke-linecap="round"/>
+</svg>
diff --git a/icons/wifi-3.svg b/icons/wifi-3.svg
new file mode 100644
index 0000000..79b62f2
--- /dev/null
+++ b/icons/wifi-3.svg
@@ -0,0 +1,6 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <path d="M12 20L12.01 20" stroke="#8B5CF6" stroke-width="2" stroke-linecap="round"/>
+    <path d="M8.53 16.11C10.45 14.19 13.55 14.19 15.47 16.11" stroke="#8B5CF6" stroke-width="2" stroke-linecap="round"/>
+    <path d="M5 12.55C8.87 8.68 15.13 8.68 19 12.55" stroke="#8B5CF6" stroke-width="2" stroke-linecap="round"/>
+    <path d="M1.42 9C7.26 3.16 16.74 3.16 22.58 9" stroke="#E5E7EB" stroke-width="2" stroke-linecap="round"/>
+</svg>
diff --git a/icons/wifi-4.svg b/icons/wifi-4.svg
new file mode 100644
index 0000000..bfbea17
--- /dev/null
+++ b/icons/wifi-4.svg
@@ -0,0 +1,6 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <path d="M12 20L12.01 20" stroke="#8B5CF6" stroke-width="2" stroke-linecap="round"/>
+    <path d="M8.53 16.11C10.45 14.19 13.55 14.19 15.47 16.11" stroke="#8B5CF6" stroke-width="2" stroke-linecap="round"/>
+    <path d="M5 12.55C8.87 8.68 15.13 8.68 19 12.55" stroke="#8B5CF6" stroke-width="2" stroke-linecap="round"/>
+    <path d="M1.42 9C7.26 3.16 16.74 3.16 22.58 9" stroke="#8B5CF6" stroke-width="2" stroke-linecap="round"/>
+</svg>
diff --git a/kapi写作中.png b/kapi写作中.png
new file mode 100644
index 0000000..9cdad60
Binary files /dev/null and b/kapi写作中.png differ
diff --git a/logo.png b/logo.png
new file mode 100644
index 0000000..c83fb59
Binary files /dev/null and b/logo.png differ
diff --git a/mascot.png b/mascot.png
new file mode 100644
index 0000000..61c6589
Binary files /dev/null and b/mascot.png differ
diff --git a/new logo.png b/new logo.png
new file mode 100644
index 0000000..c83fb59
Binary files /dev/null and b/new logo.png differ
diff --git a/pixel_capybara_eating_guide_1770187625762.png b/pixel_capybara_eating_guide_1770187625762.png
new file mode 100644
index 0000000..4f9b68f
Binary files /dev/null and b/pixel_capybara_eating_guide_1770187625762.png differ
diff --git a/故事书封面图/new_story.png b/故事书封面图/new_story.png
new file mode 100644
index 0000000..ac6ddd4
Binary files /dev/null and b/故事书封面图/new_story.png differ
diff --git a/故事书封面图/三只小猪盖房子.png b/故事书封面图/三只小猪盖房子.png
new file mode 100644
index 0000000..82031c3
Binary files /dev/null and b/故事书封面图/三只小猪盖房子.png differ
diff --git a/故事书封面图/勇敢的小裁缝.png b/故事书封面图/勇敢的小裁缝.png
new file mode 100644
index 0000000..51ce886
Binary files /dev/null and b/故事书封面图/勇敢的小裁缝.png differ
diff --git a/故事书封面图/卡皮巴拉的奇幻漂流.png b/故事书封面图/卡皮巴拉的奇幻漂流.png
new file mode 100644
index 0000000..aecfabc
Binary files /dev/null and b/故事书封面图/卡皮巴拉的奇幻漂流.png differ
diff --git a/故事书封面图/小红帽与大灰狼.png b/故事书封面图/小红帽与大灰狼.png
new file mode 100644
index 0000000..536ed6c
Binary files /dev/null and b/故事书封面图/小红帽与大灰狼.png differ
diff --git a/故事书封面图/杰克与魔豆.png b/故事书封面图/杰克与魔豆.png
new file mode 100644
index 0000000..170fc6b
Binary files /dev/null and b/故事书封面图/杰克与魔豆.png differ
diff --git a/故事书封面图/糖果屋历险记.png b/故事书封面图/糖果屋历险记.png
new file mode 100644
index 0000000..e7e9014
Binary files /dev/null and b/故事书封面图/糖果屋历险记.png differ
diff --git a/首页吉祥物.png b/首页吉祥物.png
new file mode 100644
index 0000000..2838a6c
Binary files /dev/null and b/首页吉祥物.png differ
diff --git a/首页底图.png b/首页底图.png
new file mode 100644
index 0000000..dc3f4c4
Binary files /dev/null and b/首页底图.png differ
diff --git a/首页背景.png b/首页背景.png
new file mode 100644
index 0000000..7af7c31
Binary files /dev/null and b/首页背景.png differ
diff --git a/首页背景2.png b/首页背景2.png
new file mode 100644
index 0000000..320650c
Binary files /dev/null and b/首页背景2.png differ