*{border:0;box-sizing:border-box;margin:0;padding:0}:root{--hue:223;--bg:hsl(var(--hue),90%,95%);--fg:hsl(var(--hue),90%,5%);--trans-dur:0.3s}.ip{width:6rem;height:3rem}.ip__track{stroke:hsl(var(--hue),90%,90%);transition:stroke var(--trans-dur)}.ip__worm1,.ip__worm2{animation:worm1 2s linear infinite}.ip__worm2{animation-name:worm2}@media (prefers-color-scheme:dark){:root{--bg:hsl(var(--hue),90%,5%);--fg:hsl(var(--hue),90%,95%)}.ip__track{stroke:hsl(var(--hue),90%,15%)}}@keyframes worm1{0%{stroke-dashoffset:0}50%{animation-timing-function:steps(1);stroke-dashoffset:-358}50.01%{animation-timing-function:linear;stroke-dashoffset:358}to{stroke-dashoffset:0}}@keyframes worm2{0%{stroke-dashoffset:358}50%{stroke-dashoffset:0}to{stroke-dashoffset:-358}}