nicotine

<style> .snake-box{ position:relative; width:380px; height:190px; background:#1b1b1b; border:1px solid #444; overflow:hidden; } .seg, .apple{ position:absolute; top:0; left:0; width:12px; height:12px; border-radius:3px; } .seg{ offset-path:path('M10 10 H350 V170 H10 Z'); offset-rotate:0deg; animation:move 8s linear infinite; animation-delay:calc((5 - var(--i)) * -0.112s); background:hsl(130, 45%, calc(78% - var(--i) * 7%)); } .seg:nth-child(2){ background:#e5534b; } /* голова */ .apple{ left:344px; top:84px; /* (350,90) - центр */ background:#e5534b; border-radius:50%; animation:eat 8s linear infinite; animation-delay:-0.56s; } @keyframes move{ from{ offset-distance:0%; } to{ offset-distance:100%; } } @keyframes eat{ 0%,41.9%{ opacity:1; transform:scale(1); } 42%,55%{ opacity:0; transform:scale(0); } 56%,100%{ opacity:1; transform:scale(1); } } </style>