style: remove !important and normalise specificity in split-pane CSS

The previous rule used a high-specificity ID selector combined with
!important to force display:flex on the split pane, which was both
unnecessary (ID specificity already wins over .term-pane) and
inconsistent with the other two rules in the same block.

Replace all three split-active rules with uniform class-based selectors
(.split-active .term-pane-split, .split-active .resize-split) and add
the corresponding classes to the elements in index.html. No !important
is needed — two-class specificity cleanly overrides the single-class
.term-pane base rule.

Author: VivanRajath

src/style.css

@@ -273,9 +273,9 @@ html, body { height: 100%; background: var(--bg); color: var(--text);
 .term-pane.active { display: flex; }
 .term-pane-inner { flex: 1; min-height: 0; position: relative; }
 
-#terminal-panes.split-active .term-pane.active { display: flex; flex: 1; }
-#terminal-panes.split-active #terminal-pane-split { display: flex !important; flex: 1; }
-#terminal-panes.split-active #resize-terminal-split { display: block; margin: 0 2px; }
+.split-active .term-pane.active { display: flex; flex: 1; }
+.split-active .term-pane-split { display: flex; flex: 1; }
+.split-active .resize-split { display: block; margin: 0 2px; }
 
 .xterm { height: 100%; }
 .xterm-viewport { overflow-y: auto !important; }