diff --git a/public/views/accounts.html b/public/views/accounts.html
index f78347e..b9c39da 100644
--- a/public/views/accounts.html
+++ b/public/views/accounts.html
@@ -2,14 +2,16 @@
     <!-- Compact Header -->
     <div class="flex items-center justify-between gap-4 mb-6">
         <!-- Title with inline subtitle -->
-        <div class="flex items-baseline gap-3">
+        <div class="flex flex-wrap items-center gap-4">
             <h1 class="text-2xl font-bold text-white tracking-tight" x-text="$store.global.t('accountManagement')">
                 Account Management
             </h1>
-            <span class="text-[10px] font-mono text-gray-600 uppercase tracking-[0.15em]"
-                  x-text="$store.global.t('manageTokens')">
-                Manage Google Account tokens and authorization states
-            </span>
+            <div class="flex items-center h-6 px-3 rounded-full bg-space-800/80 border border-space-border/50 shadow-sm backdrop-blur-sm">
+                <span class="text-[10px] font-mono text-gray-400 uppercase tracking-wider"
+                      x-text="$store.global.t('manageTokens')">
+                    Manage Google Account tokens and authorization states
+                </span>
+            </div>
         </div>
 
         <!-- Action Buttons -->
diff --git a/public/views/dashboard.html b/public/views/dashboard.html
index a413da6..cec319c 100644
--- a/public/views/dashboard.html
+++ b/public/views/dashboard.html
@@ -2,18 +2,20 @@
     <!-- Compact Header -->
     <div class="flex items-center justify-between gap-4 mb-6">
         <!-- Title with inline subtitle -->
-        <div class="flex items-baseline gap-3">
+        <div class="flex flex-wrap items-center gap-4">
             <h1 class="text-2xl font-bold text-white tracking-tight" x-text="$store.global.t('dashboard')">
                 Dashboard
             </h1>
-            <span class="text-[10px] font-mono text-gray-600 uppercase tracking-[0.15em]"
-                  x-text="$store.global.t('systemDesc')">
-                CLAUDE PROXY SYSTEM
-            </span>
+            <div class="flex items-center h-6 px-3 rounded-full bg-space-800/80 border border-space-border/50 shadow-sm backdrop-blur-sm">
+                <span class="text-[10px] font-mono text-gray-400 uppercase tracking-wider"
+                      x-text="$store.global.t('systemDesc')">
+                    CLAUDE PROXY SYSTEM
+                </span>
+            </div>
         </div>
 
         <!-- Compact Status Indicator -->
-        <div class="flex items-center gap-2 px-2.5 py-1.5 rounded-lg bg-space-900/60 border border-space-border/40">
+        <div class="flex items-center gap-2 px-2.5 py-1.5 rounded-lg bg-space-900/60 border border-space-border/40 whitespace-nowrap flex-shrink-0">
             <div class="relative flex items-center justify-center">
                 <span class="absolute w-1.5 h-1.5 bg-neon-green rounded-full animate-ping opacity-75"></span>
                 <span class="relative w-1.5 h-1.5 bg-neon-green rounded-full"></span>
diff --git a/public/views/models.html b/public/views/models.html
index 5efcde1..aa687e7 100644
--- a/public/views/models.html
+++ b/public/views/models.html
@@ -2,14 +2,16 @@
     <!-- Compact Header -->
     <div class="flex items-center justify-between gap-4 mb-6">
         <!-- Title with inline subtitle -->
-        <div class="flex items-baseline gap-3">
+        <div class="flex flex-wrap items-center gap-4">
             <h1 class="text-2xl font-bold text-white tracking-tight" x-text="$store.global.t('models')">
                 Models
             </h1>
-            <span class="text-[10px] font-mono text-gray-600 uppercase tracking-[0.15em]"
-                  x-text="$store.global.t('modelsPageDesc')">
-                Real-time quota and status for all available models.
-            </span>
+            <div class="flex items-center h-6 px-3 rounded-full bg-space-800/80 border border-space-border/50 shadow-sm backdrop-blur-sm">
+                <span class="text-[10px] font-mono text-gray-400 uppercase tracking-wider"
+                      x-text="$store.global.t('modelsPageDesc')">
+                    Real-time quota and status for all available models.
+                </span>
+            </div>
         </div>
 
         <!-- Search Bar -->