.bug-field{position:fixed;inset:0;z-index:60;pointer-events:none;contain:layout paint}.bug-field[hidden]{display:none}.bug-field .bug{position:absolute;top:0;left:0;width:32px;height:32px;will-change:transform;pointer-events:none}.bug-field .bug>svg{display:block}.bug-field .bug,.bug-field .splat{--bug-line:#06333c;--bug-body:#12a7bd;--bug-head:#00e5ff}.bug-field [data-polarity=cyan]{--bug-line:#06333c;--bug-body:#12a7bd;--bug-head:#00e5ff}.bug-field [data-polarity=magenta]{--bug-line:#4a0b28;--bug-body:#c22160;--bug-head:#ff2d78}.bug-field [data-polarity=gold]{--bug-line:#453005;--bug-body:#cf9a10;--bug-head:#ffc61a}.bug-field .splat{position:absolute;top:0;left:0;width:32px;height:32px;animation:splat-fade 1.1s ease-out forwards}.bug-field .leg{transform-box:view-box;animation:bug-gait-a var(--gait,.3s) ease-in-out infinite}.bug-field .leg-b{animation-name:bug-gait-b}.bug-field .antenna{transform-box:view-box;animation:bug-antenna var(--gait,.3s) ease-in-out infinite}.bug-field .antenna-r{animation-direction:reverse}.bug-field .bug-body{transform-box:view-box;transform-origin:16px 17.5px;animation:bug-rock var(--gait,.3s) ease-in-out infinite}@keyframes splat-fade{0%{opacity:0}12%{opacity:1}100%{opacity:0}}@keyframes bug-gait-a{0%,100%{transform:rotate(-9deg)}50%{transform:rotate(9deg)}}@keyframes bug-gait-b{0%,100%{transform:rotate(9deg)}50%{transform:rotate(-9deg)}}@keyframes bug-antenna{0%,100%{transform:rotate(-5deg)}50%{transform:rotate(5deg)}}@keyframes bug-rock{0%,100%{transform:rotate(-1.6deg)}50%{transform:rotate(1.6deg)}}
.bug-field [data-polarity=orange]{--bug-line:#563219;--bug-body:#c97937;--bug-head:var(--amber)}
.bug-field [data-polarity=red]{--bug-line:#521d19;--bug-body:#a93b32;--bug-head:var(--red)}
.bug-field [data-polarity=silver]{--bug-line:#42484b;--bug-body:var(--silver);--bug-head:#edf0ef}