Media Queriesをemで分岐させるMixin

#pxベースでの分岐は限界
Media Queriesの分岐といえばpxベースがポピュラーですが、
2K/4K,iPhone4/5/6/plus,iPad mini/Air/Pro,Android 以下略と、
カオスな状態になりそれぞれ指定するのが手間すぎるため、
pxベースでの指定は限界な気がします。

そこで、emで分岐するMixinをオススメします。

##Sass

@mixin breakpoint($point) {
   @if $point == desktop {
        @media (min-width: 90.063em) { @content ; }
    }
    @else if $point == laptop {
        @media (min-width: 64.063em) and (max-width: 90em) { @content ; }
    }
    @else if $point == tablet {
        @media (min-width: 40.063em) and (max-width: 64em) { @content ; }
    }
    @else if $point == mobileonly {
        @media (max-width: 40em)  { @content ; }
    }
}

##CSS

div{
	@include breakpoint(mobileonly) {
		margin: 8px;
	}
	@include breakpoint(tablet) {
		margin: 16px;
	}
	@include breakpoint(laptop) {
		margin: 24px;
	}
	@include breakpoint(desktop) {
		margin: 32px;
	}
}

laptopはWXGAデバイスで適応されます。

2016/06/30 追記
ベースのフォントサイズを16pxとしています