Why a positive offset-y moves the shadow downwards

Tell us what’s happening:
hi all

I ve been wondering. Why the positive offset y of the shadow moves the shadow downwards and not upwards. while a negative offset y moves the shadow upwards.

Logical anything positive y is upwards and negative is downwards. or am i mistaken?

Your code so far


<style>
.center {
  position: absolute;
  margin: auto;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100px;
  height: 100px;
  background-color: transparent;
  border-radius: 50%;
  box-shadow: 25px 10px 0px 0px blue;
}

</style>
<div class="center"></div>

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 6.3; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/81.0.4044.138 Safari/537.36.

Challenge: Create a Graphic Using CSS

Link to the challenge:

This one explains it well: https://graphicdesign.stackexchange.com/questions/62964/add-drop-shadow-to-one-side-only