From a4d30a204228c4354786b83d9cc82568ada502d6 Mon Sep 17 00:00:00 2001
From: erjemin <erjemin@gmail.com>
Date: Wed, 2 Sep 2026 01:12:09 +0300
Subject: [PATCH] =?UTF-8?q?mod:=20=D0=B3=D0=B0=D0=BB=D0=B5=D1=80=D0=B5?=
 =?UTF-8?q?=D1=8F=20(5)=20=D0=BA=D0=BE=D0=BC=D0=BC=D0=B5=D0=BD=D1=82=D0=B0?=
 =?UTF-8?q?=D1=80=D0=B8=D0=B8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 hypn0/hypn0_site/services/halftone.py   | 21 ++++++++++++++++-----
 hypn0/templates/block/gallery_card.html |  4 ++++
 2 files changed, 20 insertions(+), 5 deletions(-)

diff --git a/hypn0/hypn0_site/services/halftone.py b/hypn0/hypn0_site/services/halftone.py
index a214532..eafe915 100644
--- a/hypn0/hypn0_site/services/halftone.py
+++ b/hypn0/hypn0_site/services/halftone.py
@@ -229,6 +229,9 @@ def generate_halftone_svg(
     fill_style = f"fill:{clean_color};stroke:{clean_color};opacity:{opacity:.2f};"
 
     if is_animated:
+        # Управление паузой/запуском через CSS Custom Property --hypn0-play.
+        # По умолчанию running (для живого превью и детального просмотра).
+        # В галерее значение переопределяется на paused для 0% нагрузки на процессор.
         anim_rule = (
             f"animation:noise {duration:.2f}s ease-in-out infinite alternate;"
             f"animation-delay:var(--d);"
@@ -270,15 +273,20 @@ def generate_halftone_svg(
 def prepare_gallery_svg(svg_content: str) -> str:
     """
     Модифицирует SVG для долговременного хранения в галерее:
-    добавляет CSS Custom Property (--hypn0-play: paused), которое наследуется
-    внутрь элементов и теневых деревьев <use>. В изолированном контексте (Shadow DOM или <img>)
-    анимация заморожена по умолчанию (0% нагрузки на CPU), а при наведении (:hover или :host(:hover))
-    запускается.
+    внедряет CSS Custom Property (--hypn0-play: paused), которое свободно наследуется
+    внутрь элементов и теневых деревьев <use>.
+
+    Логика работы:
+    1. В покое (--hypn0-play: paused): 0% потребления CPU и GPU браузера в ленте галереи.
+    2. При наведении курсора (:host(:hover) в Shadow DOM или svg:hover при открытии файла):
+       значение переключается на running, и анимация оживает.
     """
     if not svg_content:
         return svg_content
 
     # Наследуемая переменная паузы и оверрайд стилей фигур
+    # Важно: селектор :host(:hover) работает при вставке в Shadow DOM карточки,
+    # а svg:hover работает, если файл открыт напрямую в браузере.
     hover_css = (
         "svg{--hypn0-play:paused}"
         ":host(:hover) svg,svg:hover{--hypn0-play:running!important}"
@@ -294,7 +302,10 @@ def prepare_gallery_svg(svg_content: str) -> str:
 def prepare_active_svg(svg_content: str) -> str:
     """
     Возвращает полностью активный SVG без паузы анимации вне ховера
-    для страницы детального просмотра и скачивания пользователем.
+    для страницы детального просмотра (/gallery/<hash_id>) и скачивания пользователем.
+
+    Удаляет оверрайды пауз (--hypn0-play: paused), восстанавливая оригинальные
+    авторские цвета, прозрачности и непрерывную живую анимацию на полной мощности.
     """
     if not svg_content:
         return svg_content
diff --git a/hypn0/templates/block/gallery_card.html b/hypn0/templates/block/gallery_card.html
index d1f8ddc..9942c10 100644
--- a/hypn0/templates/block/gallery_card.html
+++ b/hypn0/templates/block/gallery_card.html
@@ -9,6 +9,8 @@
      title="{{ item.s_title }}">
     <div class="hypn0-card-svg w-full h-full flex items-center justify-center drop-shadow-sm transition-transform duration-300 group-hover:scale-105 border-0">
       <template shadowrootmode="open">
+        {# Declarative Shadow DOM: изолирует ID (<defs id="s1"..>) и стили каждой картины в галерее. #}
+        {# В отличие от <img>, события мыши не блокируются, а в отличие от обычного inline SVG нет конфликтов идентификаторов. #}
         <style>
           :host {
             display: flex;
@@ -23,6 +25,8 @@
             height: 100%;
             object-fit: contain;
           }
+          {# В покое внутри SVG действует --hypn0-play: paused (0% нагрузки на CPU). #}
+          {# При наведении мыши на хост-карточку переопределяем переменную на running, и анимация оживает. #}
           :host(:hover) svg, svg:hover {
             --hypn0-play: running !important;
           }