From c791df7b0dc007c20e1f3e394d8c33e1f8f19f0a Mon Sep 17 00:00:00 2001
From: erjemin <erjemin@gmail.com>
Date: Sun, 16 Aug 2026 17:41:34 +0300
Subject: [PATCH] =?UTF-8?q?mod:=20=D0=B8=D0=BD=D1=82=D0=B5=D1=80=D1=84?=
 =?UTF-8?q?=D0=B5=D0=B9=D1=81=20(5)=20=D0=B1=D0=BE=D0=BB=D1=8C=D1=88=D0=B5?=
 =?UTF-8?q?=20=D0=B2=D0=B0=D1=80=D0=B8=D0=B0=D0=BD=D1=82=D0=BE=D0=B2=20?=
 =?UTF-8?q?=D0=B3=D0=BB=D1=8E=D0=BA=D0=BE-=D1=82=D0=BE=D1=87=D0=B5=D0=BA?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 hypn0/templates/index.html | 117 ++++++++++++++++++++++++++++++++++---
 1 file changed, 108 insertions(+), 9 deletions(-)

diff --git a/hypn0/templates/index.html b/hypn0/templates/index.html
index 29db7e1..ed94d5e 100644
--- a/hypn0/templates/index.html
+++ b/hypn0/templates/index.html
@@ -46,23 +46,122 @@
         <div class="space-y-6">
           <!-- Таб: Стиль (Фигуры) -->
           <div x-show="activeTab === 'style'" class="grid grid-cols-4 gap-2">
-            <label class="cursor-pointer group">
+            <!-- 1. Круг -->
+            <label class="cursor-pointer group" title="Круг">
               <input type="radio" name="shape" value="circle" class="hidden peer" checked>
-              <div
-                class="aspect-square flex items-center justify-center border-2 border-stone-100 dark:border-zinc-800 rounded-lg peer-checked:border-emerald-500 peer-checked:bg-emerald-50/10 transition-all">
-                <div class="w-6 h-6 rounded-full bg-stone-400 group-hover:bg-emerald-500"></div>
+              <div class="aspect-square flex flex-col items-center justify-center p-2 border-2 border-stone-100 dark:border-zinc-800 rounded-xl peer-checked:border-emerald-500 peer-checked:bg-emerald-50/10 transition-all hover:border-stone-300 dark:hover:border-zinc-700">
+                <div class="w-6 h-6 rounded-full bg-stone-400 group-hover:bg-emerald-500 peer-checked:bg-emerald-500 transition-colors"></div>
               </div>
             </label>
-            <label class="cursor-pointer group">
+
+            <!-- 2. Кольцо (Бублик) -->
+            <label class="cursor-pointer group" title="Кольцо">
+              <input type="radio" name="shape" value="ring" class="hidden peer">
+              <div class="aspect-square flex flex-col items-center justify-center p-2 border-2 border-stone-100 dark:border-zinc-800 rounded-xl peer-checked:border-emerald-500 peer-checked:bg-emerald-50/10 transition-all hover:border-stone-300 dark:hover:border-zinc-700">
+                <div class="w-6 h-6 rounded-full border-[6px] border-stone-400 group-hover:border-emerald-500 peer-checked:border-emerald-500 transition-colors"></div>
+              </div>
+            </label>
+
+            <!-- 3. Треугольник -->
+            <label class="cursor-pointer group" title="Треугольник">
+              <input type="radio" name="shape" value="triangle" class="hidden peer">
+              <div class="aspect-square flex flex-col items-center justify-center p-2 border-2 border-stone-100 dark:border-zinc-800 rounded-xl peer-checked:border-emerald-500 peer-checked:bg-emerald-50/10 transition-all hover:border-stone-300 dark:hover:border-zinc-700">
+                <svg class="w-6 h-6 fill-stone-400 group-hover:fill-emerald-500 peer-checked:fill-emerald-500 transition-colors" viewBox="0 0 24 24">
+                  <path d="M12 4L2 20h20L12 4z"/>
+                </svg>
+              </div>
+            </label>
+
+            <!-- 4. Квадрат -->
+            <label class="cursor-pointer group" title="Квадрат">
               <input type="radio" name="shape" value="square" class="hidden peer">
-              <div
-                class="aspect-square flex items-center justify-center border-2 border-stone-100 dark:border-zinc-800 rounded-lg peer-checked:border-emerald-500 peer-checked:bg-emerald-50/10 transition-all">
-                <div class="w-6 h-6 bg-stone-400 group-hover:bg-emerald-500"></div>
+              <div class="aspect-square flex flex-col items-center justify-center p-2 border-2 border-stone-100 dark:border-zinc-800 rounded-xl peer-checked:border-emerald-500 peer-checked:bg-emerald-50/10 transition-all hover:border-stone-300 dark:hover:border-zinc-700">
+                <div class="w-5 h-5 rounded-xs bg-stone-400 group-hover:bg-emerald-500 peer-checked:bg-emerald-500 transition-colors"></div>
               </div>
             </label>
-            <!-- Другие фигуры добавятся позже -->
+
+            <!-- 5. Ромб (Бриллиант) -->
+            <label class="cursor-pointer group" title="Ромб">
+              <input type="radio" name="shape" value="diamond" class="hidden peer">
+              <div class="aspect-square flex flex-col items-center justify-center p-2 border-2 border-stone-100 dark:border-zinc-800 rounded-xl peer-checked:border-emerald-500 peer-checked:bg-emerald-50/10 transition-all hover:border-stone-300 dark:hover:border-zinc-700">
+                <div class="w-5 h-5 rotate-45 rounded-xs bg-stone-400 group-hover:bg-emerald-500 peer-checked:bg-emerald-500 transition-colors"></div>
+              </div>
+            </label>
+
+            <!-- 6. Шестиугольник (Гексагон) -->
+            <label class="cursor-pointer group" title="Гексагон">
+              <input type="radio" name="shape" value="hexagon" class="hidden peer">
+              <div class="aspect-square flex flex-col items-center justify-center p-2 border-2 border-stone-100 dark:border-zinc-800 rounded-xl peer-checked:border-emerald-500 peer-checked:bg-emerald-50/10 transition-all hover:border-stone-300 dark:hover:border-zinc-700">
+                <svg class="w-6 h-6 fill-stone-400 group-hover:fill-emerald-500 peer-checked:fill-emerald-500 transition-colors" viewBox="0 0 24 24">
+                  <path d="M12 2l8.66 5v10L12 22l-8.66-5V7L12 2z"/>
+                </svg>
+              </div>
+            </label>
+
+            <!-- 7. Звездочка -->
+            <label class="cursor-pointer group" title="Звезда">
+              <input type="radio" name="shape" value="star" class="hidden peer">
+              <div class="aspect-square flex flex-col items-center justify-center p-2 border-2 border-stone-100 dark:border-zinc-800 rounded-xl peer-checked:border-emerald-500 peer-checked:bg-emerald-50/10 transition-all hover:border-stone-300 dark:hover:border-zinc-700">
+                <svg class="w-6 h-6 fill-stone-400 group-hover:fill-emerald-500 peer-checked:fill-emerald-500 transition-colors" viewBox="0 0 24 24">
+                  <path d="M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z"/>
+                </svg>
+              </div>
+            </label>
+
+            <!-- 8. Сердечко -->
+            <label class="cursor-pointer group" title="Сердечко">
+              <input type="radio" name="shape" value="heart" class="hidden peer">
+              <div class="aspect-square flex flex-col items-center justify-center p-2 border-2 border-stone-100 dark:border-zinc-800 rounded-xl peer-checked:border-emerald-500 peer-checked:bg-emerald-50/10 transition-all hover:border-stone-300 dark:hover:border-zinc-700">
+                <svg class="w-6 h-6 fill-stone-400 group-hover:fill-emerald-500 peer-checked:fill-emerald-500 transition-colors" viewBox="0 0 24 24">
+                  <path d="M12 21.35l-1.45-1.32C5.4 15.36 2 12.28 2 8.5 2 5.42 4.42 3 7.5 3c1.74 0 3.41.81 4.5 2.09C13.09 3.81 14.76 3 16.5 3 19.58 3 22 5.42 22 8.5c0 3.78-3.4 6.86-8.55 11.54L12 21.35z"/>
+                </svg>
+              </div>
+            </label>
+
+            <!-- 9. Крестик / Плюс -->
+            <label class="cursor-pointer group" title="Крестик">
+              <input type="radio" name="shape" value="cross" class="hidden peer">
+              <div class="aspect-square flex flex-col items-center justify-center p-2 border-2 border-stone-100 dark:border-zinc-800 rounded-xl peer-checked:border-emerald-500 peer-checked:bg-emerald-50/10 transition-all hover:border-stone-300 dark:hover:border-zinc-700">
+                <svg class="w-6 h-6 fill-stone-400 group-hover:fill-emerald-500 peer-checked:fill-emerald-500 transition-colors" viewBox="0 0 24 24">
+                  <path d="M19 10.5h-5.5V5a1.5 1.5 0 00-3 0v5.5H5a1.5 1.5 0 000 3h5.5V19a1.5 1.5 0 003 0v-5.5H19a1.5 1.5 0 000-3z"/>
+                </svg>
+              </div>
+            </label>
+
+            <!-- 10. Черточка / Линия -->
+            <label class="cursor-pointer group" title="Линия">
+              <input type="radio" name="shape" value="line" class="hidden peer">
+              <div class="aspect-square flex flex-col items-center justify-center p-2 border-2 border-stone-100 dark:border-zinc-800 rounded-xl peer-checked:border-emerald-500 peer-checked:bg-emerald-50/10 transition-all hover:border-stone-300 dark:hover:border-zinc-700">
+                <div class="w-5 h-1 rounded-full bg-stone-400 group-hover:bg-emerald-500 peer-checked:bg-emerald-500 transition-colors"></div>
+              </div>
+            </label>
+
+
+            <!-- 11. Волна / Синусоида -->
+            <label class="cursor-pointer group" title="Волна">
+              <input type="radio" name="shape" value="wave" class="hidden peer">
+              <div class="aspect-square flex flex-col items-center justify-center p-2 border-2 border-stone-100 dark:border-zinc-800 rounded-xl peer-checked:border-emerald-500 peer-checked:bg-emerald-50/10 transition-all hover:border-stone-300 dark:hover:border-zinc-700">
+                <svg class="w-6 h-6 stroke-stone-400 group-hover:stroke-emerald-500 peer-checked:stroke-emerald-500 transition-colors" fill="none" stroke-width="2.5" stroke-linecap="round" viewBox="0 0 24 24">
+                  <path d="M2 12c2.5-4 5.5-4 8 0s5.5 4 8 0 3.5-4 4-4"/>
+                </svg>
+              </div>
+            </label>
+
+            <!-- 12. Двоичный блок 3x3 -->
+            <label class="cursor-pointer group" title="Матрица 3x3 (0/1)">
+              <input type="radio" name="shape" value="binary" class="hidden peer">
+              <div class="aspect-square flex flex-col items-center justify-center p-1 border-2 border-stone-100 dark:border-zinc-800 rounded-xl peer-checked:border-emerald-500 peer-checked:bg-emerald-50/10 transition-all hover:border-stone-300 dark:hover:border-zinc-700">
+                <div class="grid grid-cols-2 gap-0.5 font-mono text-[14px] leading-[12px] font-black text-stone-400 group-hover:text-emerald-500 peer-checked:text-emerald-500 transition-colors select-none">
+                  <span>1</span><span>0</span>
+                  <span>0</span><span>1</span>
+                </div>
+              </div>
+            </label>
+
           </div>
 
+
+
           <!-- Таб: Цвет -->
           <div x-show="activeTab === 'color'" class="space-y-4">
             <div class="flex items-center justify-between pb-1 border-b border-stone-100 dark:border-zinc-800">