中控顶栏改为居中大标题「期权中控」，下方导航居中，退出放右上角。

Co-authored-by: Cursor <cursoragent@cursor.com>

static/hub.css

@@ -49,25 +49,73 @@ a { color: var(--accent-2); text-decoration: none; }
 a:hover { color: #7dd3fc; }
 
 .topbar {
+  position: relative;
   display: flex;
-  justify-content: flex-start;
+  flex-direction: column;
   align-items: center;
-  padding: 12px 20px;
+  justify-content: center;
+  gap: 10px;
+  min-height: 96px;
+  padding: 18px 88px 16px;
   border-bottom: 1px solid var(--line);
   background: rgba(8, 14, 26, 0.75);
   backdrop-filter: blur(12px);
 }
-.topbar nav a {
+.topbar-brand {
-  margin-right: 16px;
+  font-family: var(--font-display);
+  font-size: clamp(1.55rem, 2.1vw, 2.05rem);
+  font-weight: 600;
+  letter-spacing: 0.38em;
+  text-indent: 0.38em;
+  color: #f4f8ff;
+  line-height: 1.15;
+}
+.topbar-brand:hover {
+  color: #ffffff;
+}
+.topbar-nav {
+  display: flex;
+  justify-content: center;
+  flex-wrap: wrap;
+  gap: 4px 22px;
+}
+.topbar-nav a {
   color: var(--muted);
   font-weight: 500;
-  letter-spacing: 0.02em;
+  letter-spacing: 0.06em;
+  padding: 2px 0;
 }
-.topbar nav a:last-child { margin-right: 0; }
+.topbar-nav a.active {
-.topbar nav a.active {
   color: var(--accent);
   text-shadow: 0 0 18px rgba(34, 211, 238, 0.35);
 }
+.topbar-logout {
+  position: absolute;
+  top: 16px;
+  right: 22px;
+  color: var(--muted);
+  font-size: 0.82rem;
+  letter-spacing: 0.04em;
+}
+.topbar-logout:hover {
+  color: #e8f1ff;
+}
+@media (max-width: 720px) {
+  .topbar {
+    min-height: 0;
+    padding: 14px 16px 12px;
+    gap: 8px;
+  }
+  .topbar-brand {
+    letter-spacing: 0.22em;
+    text-indent: 0.22em;
+    font-size: 1.35rem;
+  }
+  .topbar-logout {
+    top: 12px;
+    right: 14px;
+  }
+}
 
 .main { padding: 16px; max-width: 1200px; margin: 0 auto; }
 /* 总览保持 1800;工作台外壳全屏(内嵌客户端带鱼屏自锁 1800) */
@@ -807,7 +855,7 @@ button, .btn {
   background: rgba(34, 211, 238, 0.16);
   border-color: rgba(34, 211, 238, 0.35);
 }
-.desk-main { display: flex; flex-direction: column; min-height: calc(100vh - 70px); min-width: 0; }
+.desk-main { display: flex; flex-direction: column; min-height: calc(100vh - 130px); min-width: 0; }
 .desk-toolbar {
   display: flex; gap: 10px; align-items: center; flex-wrap: wrap;
   margin-bottom: 8px;
@@ -815,7 +863,7 @@ button, .btn {
 .desk-frame {
   flex: 1;
   width: 100%;
-  min-height: calc(100vh - 130px);
+  min-height: calc(100vh - 190px);
   border: 1px solid var(--line);
   border-radius: var(--radius);
   background: #000;

templates/base.html

@@ -4,20 +4,21 @@
   <meta charset="utf-8">
   <meta name="viewport" content="width=device-width, initial-scale=1">
   <title>{% block title %}期权中控{% endblock %}</title>
-  <link rel="stylesheet" href="{{ url_for('static', filename='hub.css') }}?v=17">
+  <link rel="stylesheet" href="{{ url_for('static', filename='hub.css') }}?v=18">
 </head>
 <body class="{% if request.path.startswith('/login') %}page-login{% elif request.path.startswith('/desk') %}page-desk{% elif request.path.startswith('/stats') %}page-stats{% elif request.path.startswith('/instances') %}page-instances{% elif request.path == '/' %}page-dashboard{% endif %}">
   {% if session.get('logged_in') %}
   <header class="topbar">
-    <nav>
+    <a href="/" class="topbar-brand">期权中控</a>
+    <nav class="topbar-nav">
       <a href="/" class="{% if request.path == '/' %}active{% endif %}">总览</a>
       <a href="/cond_orders" class="{% if request.path.startswith('/cond_orders') %}active{% endif %}">条件单</a>
       <a href="/instances" class="{% if request.path.startswith('/instances') %}active{% endif %}">实例</a>
       <a href="/desk" class="{% if request.path.startswith('/desk') %}active{% endif %}">工作台</a>
       <a href="/stats" class="{% if request.path.startswith('/stats') %}active{% endif %}">数据统计</a>
       <a href="/settings" class="{% if request.path.startswith('/settings') %}active{% endif %}">系统设置</a>
-      <a href="/logout">退出</a>
     </nav>
+    <a href="/logout" class="topbar-logout">退出</a>
   </header>
   {% endif %}
   <main class="main">