.switcher{--size:2.6rem;cursor:pointer;width:var(--size);height:var(--size);-webkit-appearance:none;-moz-appearance:none;appearance:none;border-radius:999px;outline:none;transition:all .5s;&.dark{scale:.7;color:#e6e6ff;box-shadow:inset calc(var(--size) * .33) calc(var(--size) * -.25) 0}&.light{--ray-size:calc(var(--size) * -0.4);--offset-orthogonal:calc(var(--size) * 0.65);--offset-diagonal:calc(var(--size) * 0.45);transform:scale(.6);color:#fa0;box-shadow:inset 0 0 0 var(--size),calc(var(--offset-orthogonal) * -1) 0 0 var(--ray-size),var(--offset-orthogonal) 0 0 var(--ray-size),0 calc(var(--offset-orthogonal) * -1) 0 var(--ray-size),0 var(--offset-orthogonal) 0 var(--ray-size),calc(var(--offset-diagonal) * -1) calc(var(--offset-diagonal) * -1) 0 var(--ray-size),var(--offset-diagonal) var(--offset-diagonal) 0 var(--ray-size),calc(var(--offset-diagonal) * -1) var(--offset-diagonal) 0 var(--ray-size),var(--offset-diagonal) calc(var(--offset-diagonal) * -1) 0 var(--ray-size)}}