Bezüglich deiner zwei Probleme:
Ich weiß nicht was du mit zeilenumbruch und Leerzeile erzeugst meinst. Es generiert einen ein- ausklappbaren Block. Dass hier etwas "ein-" und ausgeblendet wird ist der Sinn und Zweck des Elements.
Ob es für dich von der Funktion her brauchbar ist kannst aber im Endeffekt nur du entscheiden.

Man färbt Sachen nicht mit <a class="">...</a> ein sondern unr mit einer Klasse. Ich denke du wolltest den header farblich hervorheben? Dort macht ein a-tag natürlich 0 sinn, da die summary schon ein klick-event definiert hat. Das wäre wie wenn man einen Link in einem Link platziert. Wenn du das Element stylen willst dann gib ihm einfach direkt eine Klasse:

<summary class="my-style"> ... </summary>

Deine alte, praktikable Lösung ist deprecated, also veraltet. Du kannst sie natürlich verwenden, dann muss dir aber bewusst sein, dass sie auch nur auf alten Geräten / Browsern funktioniert.
Die neue, mit viel Technik + viel Arbeit verbundene Lösung ist auch nicht schwer umzusetzen wenn der Grundaufbau eines Projekts stimmt.

Wie gesagt, wenn du dich nicht viel mit Javascript etc. auseinandersetzen willst dann ist <a target="_blank">...</a> deine sicherste Lösung. Das funktioniert auch noch in 100 Jahren (wage ich zu behaupten)

Ansonsten heißt es: Am Ball bleiben und seine Seite zeitgemäß bauen. Wobei ein target="_blank" genauso zeitgemäß ist.