<!doctype html>
<html><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1">
<style>
*{box-sizing:border-box;margin:0;padding:0}
html,body{width:100%;height:100%;overflow:hidden;background:#0f0f10;font-family:ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
.stage{position:absolute;inset:0;display:grid;place-items:center;container-type:size}
svg{width:22cqw}.r{fill:none;stroke-width:4;stroke-linecap:round;transform-origin:50px 50px}
.r1{stroke:#7dd3b0;animation:sp 1.2s linear infinite}.r2{stroke:#f5b942;animation:sp 1.8s linear infinite reverse}.r3{stroke:#78716c;animation:sp 2.4s linear infinite}
@keyframes sp{to{transform:rotate(360deg)}}
</style></head>
<body><div class="stage"><svg viewBox="0 0 100 100"><circle class="r r1" cx="50" cy="50" r="20" stroke-dasharray="94 126"/><circle class="r r2" cx="50" cy="50" r="30" stroke-dasharray="141 189"/><circle class="r r3" cx="50" cy="50" r="40" stroke-dasharray="188 252"/></svg></div></body></html>