ui: modernize UI to Mainframe design system

static/header/header.html

@@ -2,16 +2,27 @@
 <header class="app-header">
   <nav class="header-nav">
     <div class="nav-container">
-      <ul class="nav-links">
-        <li>
-          <a href="/" class="nav-link" data-nav="transcription">📝 Phiên Âm</a>
-        </li>
-        <li>
-          <a href="/scraperZLibrary" class="nav-link" data-nav="scraper"
-            >📚 Z-Library Scraper</a
-          >
-        </li>
-      </ul>
+      <!-- Left: Brand -->
+      <div class="nav-left">
+        <a href="/" class="nav-brand">KYLONG.</a>
+      </div>
+
+      <!-- Center: Navigation -->
+      <div class="nav-center">
+        <ul class="nav-links">
+          <li>
+            <a href="/" class="nav-link" data-nav="transcription">Phiên Âm</a>
+          </li>
+          <li>
+            <a href="/scraperZLibrary" class="nav-link" data-nav="scraper">Z-Library</a>
+          </li>
+        </ul>
+      </div>
+
+      <!-- Right: Utility -->
+      <div class="nav-right">
+        <span class="status-badge"><span class="dot"></span> Online</span>
+      </div>
     </div>
   </nav>
 </header>