CSS + HTML Code for buttons

I need your help to implement the CSS and HTML code for two buttons as shown in the screenshot. I've also included the Figma file and the two SVG icons. The dark gray boxes are div elements, and once the project starts I will share with you the html and css code for those gray boxes. Then you will help with implementing the code for the two circular buttons with these requirements: 1. the end result of the code should look exactly like the circular buttons in the files I've shared. This should be tested in the latest versions of Chrome and Firefox. 2. the dropped shadows under the buttons should disappear when the button is pressed, and the shadow reappears when the button is released. 3. The 3 green arrows show the distance from the top right corner of the parent div, and the width or radius of the button, these should be clearly indicated as parameters in the code. 4. The delivered html code has a single parent element that when I added as child to the gray box dive the circular buttons appear above the gray box at the top right corner of the gray box. 5. I should be able to add one javascript function to the onclick event of the left button and another javascript function to the right button. 6. This should be done purely in HTML and CSS, no javascript should be used. I will pay tips for clean and well organized CSS code. The same goes for modern CSS 3 code. This will be the first of several other small CSS and HTML projects that I will put on freelancer.com over the next 3 to 6 months.