# 🧬 Helix CSS Loader Π‘Π»ΠΎΠΆΠ½Ρ‹ΠΉ Π°Π½ΠΈΠΌΠΈΡ€ΠΎΠ²Π°Π½Π½Ρ‹ΠΉ Π»ΠΎΠ°Π΄Π΅Ρ€, ΠΈΠΌΠΈΡ‚ΠΈΡ€ΡƒΡŽΡ‰ΠΈΠΉ Π²Ρ€Π°Ρ‰Π΅Π½ΠΈΠ΅ Π΄Π²ΠΎΠΉΠ½ΠΎΠΉ спирали (DNA Helix). ΠŸΠΎΡΡ‚Ρ€ΠΎΠ΅Π½ Π½Π° чистом CSS с использованиСм 26 Π°Π½ΠΈΠΌΠΈΡ€ΠΎΠ²Π°Π½Π½Ρ‹Ρ… элСмСнтов. ### ΠžΡΠΎΠ±Π΅Π½Π½ΠΎΡΡ‚ΠΈ - **3D Illusion**: Π­Ρ„Ρ„Π΅ΠΊΡ‚ объСма достигаСтся Π·Π° счСт синхронизации пСрСмСщСния (`translate3d`), измСнСния ΠΌΠ°ΡΡˆΡ‚Π°Π±Π° (`scale`) ΠΈ управлСния слоями (`z-index`). - **Smooth Gradient**: Π€ΠΎΠ½ с использованиСм `linear-gradient` ΠΏΠΎΠ΄Ρ‡Π΅Ρ€ΠΊΠΈΠ²Π°Π΅Ρ‚ Π³Π»ΡƒΠ±ΠΈΠ½Ρƒ Π°Π½ΠΈΠΌΠ°Ρ†ΠΈΠΈ. - **Pure CSS**: НС Ρ‚Ρ€Π΅Π±ΡƒΠ΅Ρ‚ JavaScript, вся Π»ΠΎΠ³ΠΈΠΊΠ° завязана Π½Π° Π·Π°Π΄Π΅Ρ€ΠΆΠΊΠ°Ρ… (`animation-delay`) для ΠΊΠ°ΠΆΠ΄ΠΎΠ³ΠΎ ΠΎΡ‚Π΄Π΅Π»ΡŒΠ½ΠΎΠ³ΠΎ "ΡƒΠ·Π»Π°" спирали. ### ВСхничСскиС Π΄Π΅Ρ‚Π°Π»ΠΈ - **Movement**: ΠšΠ»ΡŽΡ‡Π΅Π²ΠΎΠΉ ΠΊΠ°Π΄Ρ€ `@keyframes movement` ΠΎΡ‚Π²Π΅Ρ‡Π°Π΅Ρ‚ Π·Π° Π²Π΅Ρ€Ρ‚ΠΈΠΊΠ°Π»ΡŒΠ½ΠΎΠ΅ ΠΏΠ΅Ρ€Π΅ΠΌΠ΅Ρ‰Π΅Π½ΠΈΠ΅. - **Size/Opacity**: `@keyframes size-opacity` создаСт эффСкт приблиТСния ΠΈ удалСния Ρ‚ΠΎΡ‡Π΅ΠΊ, мСняя ΠΈΡ… Ρ€Π°Π·ΠΌΠ΅Ρ€ ΠΈ ΠΏΡ€ΠΎΠ·Ρ€Π°Ρ‡Π½ΠΎΡΡ‚ΡŒ. - **Dual Color**: Π§Π΅Ρ‚Π½Ρ‹Π΅ ΠΈ Π½Π΅Ρ‡Π΅Ρ‚Π½Ρ‹Π΅ элСмСнты ΠΈΠΌΠ΅ΡŽΡ‚ Ρ€Π°Π·Π½Ρ‹Π΅ Ρ†Π²Π΅Ρ‚Π° (Π±Π΅Π»Ρ‹ΠΉ ΠΈ ярко-Ρ€ΠΎΠ·ΠΎΠ²Ρ‹ΠΉ) для Π²ΠΈΠ·ΡƒΠ°Π»ΡŒΠ½ΠΎΠ³ΠΎ раздСлСния Π΄Π²ΡƒΡ… Π½ΠΈΡ‚Π΅ΠΉ спирали.