The other way round

こんばんは ('0')/
色々お伝えする件がありますが順を追って。

-----
まず、ブログタイトル下の2本の水平線については根本的に解消する必要がありますので以下の手順に従ってください。

先日加えた #header-banner の overflow-x: hidden; の一行を削除します。
次に、このルールセットの直近、下の方を目で追ってもらうと
#blog-title のセレクタがありますので、このルールセット内の

text-transform: uppercase;
  animation: zoomIn 1.5s;

の2行を削除し、代わりに

overflow: hidden;

の1行を追加。先日のプロパティは overflow-x でしたが今回は overflow なので注意。
続いてこのすぐ下には
#blog-title a というセレクタがあります。このルールセット最終に以下の3行を追加

display: inline-block;
  text-transform: uppercase;
  animation: zoomIn 1.5s;

この処理で水平線下のシャドウが見えるようになります。
内緒さんの場合は背景色を濃くされていますので、シャドウの色 --base-shadow-color については調整が必要かと思います。
(コントラストが強くなってしまうため、もう少し暗い色にされた方が良いです)

-----
ダークモードについて

Son-Of-Valkyrieはダークモード非対応テンプレートです。なので対応させるにはご自身でやって頂く他ありませんが、このテンプレートは元々ダーク調なのですからダークモードに対応させても意味がありません。

ダークモードには2種類あります
・OSダークモード
・ブラウザ固有ダークモード(拡張機能含む)

製作者あるいは管理人が対応できるのは『OSダークモード』の方だけです。対応の仕方は「prefers-color-scheme: dark を利用して対応CSSを書く」ことです。

ブラウザのダークモードというのは、OSダークモードの対応・非対応に関わらず、どのサイトでも一定の色相(hue)を超えていたら強制的に調整をする、というものです。

OSダークモードは作者の意図を完全に実現できますが、ブラウザダークモードの方はできません。何故なら『ブラウザ固有』つまり各ブラウザの腹一つの調整です。そのブラウザ・拡張機能自体も無数に存在しており、全てに対応させるのは不可能ですし、そもそも『ブラウザのモードがあるかどうか、あるならONにしたかしていないか』の見分けはできません(技術的にできないというよりもブラウザ種何100何1000と分岐できるはずがないという意味です)

ブラウザダークモードの利用意義というのは、OSダークモード非対応のサイトを強制的にダークにする、という使い方なので、元が暗色背景ならばOS・ブラウザ共にダークモードを利用する意味はないですよね。
ブラウザのダークモードは「各ブラウザの基準に沿って半ば勝手に変わってしまう」のですから、同じ色彩を保つというのが無理筋です (∵`)
OSダークモードは管理人の意思決定ですが、ブラウザダークモードは閲覧者個人の権利、という感じです。

管理者にだけ表示を許可する