:root {
  margin: 0;
  height: 100vh;
  overflow: hidden;
  font-size: 0.75vmin;
  background: #aaa;
}

section, article {
  width: 100em;
  aspect-ratio: 1;
  position: absolute;
  top: 50%;
  left: 50%;
  translate: -50% -50%;
  display: flex;
  flex-wrap: wrap;
}

article {
  width: 150em;
}

div {
  width: 50em;
  height: 50em;
  position: relative;
  background: red;
  border-radius: 50%;
  
  background:
    repeating-conic-gradient(#06f 0 3.6deg, #000 0 7.2deg, #dd0 0 10.8deg, #fff 0 14.4deg);
  
  & > & {
    translate: -50% -50%;
    top: 50%;
    left: 50%;
    scale: 0.82;
    rotate: -6deg;
    
    & > & > & > & {
      scale: 0.78
    }
  }
}