.planet-debris{position:absolute;left:-40%;top:35%;width:180%;height:30%;transform:rotate(-27deg);pointer-events:none}
.orbital-fragment{position:absolute;left:0;top:0;width:var(--size);height:calc(var(--size)*.72);offset-path:ellipse(50% 50% at 50% 50%);offset-anchor:center;offset-rotate:auto;clip-path:polygon(8% 29%,34% 0,82% 12%,100% 61%,64% 100%,10% 80%);background:linear-gradient(145deg,#a1b3be 0%,#657883 35%,#293741 70%,#17232e);transform:rotate(var(--spin));animation:planet-debris-orbit var(--period) linear var(--phase) infinite;opacity:.8}
.orbital-fragment:nth-child(3n){clip-path:polygon(20% 0,83% 15%,100% 76%,32% 100%,0 49%)}
/* Hide the far-side fragments while their orbit crosses the planet's disc. */
@keyframes planet-debris-orbit{0%{offset-distance:0%;opacity:.65}12%,38%{opacity:.95}50%{opacity:.55}63%{opacity:.45}65%,85%{opacity:0}87%{opacity:.45}100%{offset-distance:100%;opacity:.65}}
@media(max-width:639px){.orbital-fragment{width:calc(var(--size)*.75);height:calc(var(--size)*.55)}.orbital-fragment:nth-child(n+9){display:none}}
@media(prefers-reduced-motion:reduce){.orbital-fragment{animation:none;offset-distance:20%}.orbital-fragment:not(:first-child){display:none}}
@supports not (offset-path:ellipse(50% 50% at 50% 50%)){.planet-debris{display:none}}