Letter O
Visit the official puzzle page (affiliate link!) to play it yourself. If you buy a course from CSSBattle through my affiliate link, I receive a share of it!
| 1 |  | 
| 2 |  | 
| 3 |  | 
| 4 |  | 
| 5 |  | 
| 6 |  | 
| 7 |  | 
| 8 |  | 
| 9 |  | 
| 10 |  | 
| 11 |  | 
| 12 |  | 
| 13 |  | 
| 14 |  | 
Today, I learned a lot. While this thing didn't really look like something new, I learned multiple things today! For example, all of us thought we need a second element inside to create the inner radial of the border. So with this solution I learned:
Using a border-radius larger than the border-size results in inner radius
			being curved as well.
You can use both default AND inset on box-shadow on the same element.
| 1 |  | 
| 2 |  | 
| 3 |  | 
| 4 |  | 
| 5 |  | 
| 6 |  | 
| 7 |  | 
| 8 |  | 
| 9 |  | 
| 10 |  | 
| 11 |  | 
| 12 |  | 
| 13 |  | 
| 14 |  | 
Instead of using box-shadow, you can use the filter: drop-shadow to have
			shadows in transparent regions. This allows having just one of them.
| 1 |  | 
Oh and this was the minimal solution I found. No elements necessary!