overlay要素の取得の場面で、idを振らずにclassだけ指定していたため、
querySelectorで取得する必要があり、セレクターを指定するので .overlay となる。

上記の流れで、まだ理解できない部分があり、ご質問させて頂きました。
「overlay」の前に「.」を付けなければならいのは、

セレクターを指定する時のルールのようなもの。と考えて良いのでしょうか。

querySelectorについて、MDN公式サイト、JavaScriptDOM編 02要素の取得等を拝見しましたが、
まだ理解ができず、質問させて頂きました。お忙しい中ですが、よろしくお願い致します。