.mod-navigation
	.content
		max-width: 14em
	.navball
		background: #444
		box-shadow: inset 0 .2em .7em #000, inset 0 1px 0 #000, 0 1px 0 #fff
		width: 1em
		height: 1em
		border-radius: 50%
		position: relative
		&::after
			content: ''
			display: block
			position: absolute
			width: 1em
			height: 1em
			top: 50%
			left: 50%
			transform: translate(-50%, -50%)
			border-radius: 50%
			border: 3px solid #f00

.mod-navigation
	.content
		max-width: 14em
	.navball
		background: #444
		box-shadow: inset 0 .2em .7em #000, inset 0 1px 0 #000, 0 1px 0 #fff
		width: 1em
		height: 1em
		border-radius: 50%
		position: relative
		&::before
			content: ''
			display: block
			position: absolute
			width: 100%
			height: 100%
			border-radius: 50%
			top: 0
			top: 0
			background: radial-gradient(ellipse 150% 100% at 50% 5%, rgba(#fff, 0), rgba(#fff, .2) 50%, rgba(#fff, .0) 50%, rgba(#fff, .2))
		&::after
			content: ''
			display: block
			position: absolute
			width: 1em
			height: 1em
			top: 50%
			left: 50%
			transform: translate(-50%, -50%)
			border-radius: 50%
			border: 3px solid #f00

Add subtle gloss on navball
Add subtle gloss on navball
