お世話になります。
今回のレッスンの、ボタンのクリックイベントの指示した通り、

btn.classList.add('inactive');

がうまく反映されませんでした。
自分のコードを確認すると、CSS のボタン周りの書き方が、

・レッスン: button
・自分のコード: #btn

となっていたのが原因だったようです。
button に直すと、レッスン通りの挙動を示しました。

なぜ button の場合はレッスン通り「.inactive」が反映され、#btn で指示するとうまく反映されないのでしょうか。
CSS の詳細度？というやつ？

そのへんいまいち理解できておらず、調べてはみましたが、なぜそうなるのか理由が見つけられませんでした。はっきりした理由があれば教えていただけないでしょうか。