Tighten phone hub layout: single-column monitor and chart-first market.

Hide duplicate page titles on phone, compact toolbars, and denser calculator forms without changing desktop/tablet shells.

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

manual_trading_hub/static/app.css

@@ -3817,7 +3817,8 @@ body.login-page {
   }
 
   .grid-monitor.grid-monitor-tiles {
-    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
+    /* 手机监控单列,避免统计与交易所卡并排挤字 */
+    grid-template-columns: 1fr !important;
     gap: 10px;
   }
 
@@ -4049,42 +4050,131 @@ body.login-page {
     display: none !important;
   }
 
+  /* 顶栏一行:省纵向空间,底栏已标当前页 */
+  body.hub-phone .app-header {
+    flex-direction: row;
+    align-items: center;
+    gap: 8px;
+    padding: 6px 0;
+    margin-bottom: 4px;
+  }
+
+  body.hub-phone .brand-sub {
+    display: none;
+  }
+
+  body.hub-phone .brand-title {
+    font-size: 12px;
+    letter-spacing: 0.02em;
+  }
+
   body.hub-phone .header-right {
-    grid-template-columns: 1fr auto auto;
+    display: flex;
-    grid-template-rows: auto;
+    flex-wrap: nowrap;
+    align-items: center;
+    justify-content: flex-end;
+    gap: 6px;
+    width: auto;
+    margin-left: auto;
+    grid-template-columns: none;
+    grid-template-rows: none;
+  }
+
+  body.hub-phone .header-right .theme-toggle {
+    transform: scale(0.92);
+    transform-origin: center right;
+  }
+
+  body.hub-phone button.ghost#btn-logout {
+    min-height: 32px;
+    padding: 4px 10px;
+    font-size: 12px;
   }
 
   body.hub-phone .app-shell {
     padding-bottom: calc(var(--hub-m-tabbar-h) + max(10px, env(safe-area-inset-bottom)));
   }
 
-  body.hub-phone .page-head h1 {
+  /* 四页标题与底栏重复,手机隐藏 */
-    font-size: 1.05rem;
+  body.hub-phone #page-monitor > .page-head,
+  body.hub-phone #page-market > .page-head,
+  body.hub-phone #page-calculator > .page-head,
+  body.hub-phone #page-ai > .page-head {
+    display: none;
   }
 
-  body.hub-phone .page-head .head-tag {
+  /* —— 监控 —— */
-    font-size: 0.62rem;
+  body.hub-phone .grid-monitor.grid-monitor-tiles {
+    grid-template-columns: 1fr !important;
+    gap: 10px;
+  }
+
+  body.hub-phone .hub-tile {
+    min-height: 0;
+  }
+
+  body.hub-phone .hub-tile .hub-tile-body {
+    min-height: 0;
+    padding: 12px 14px;
+  }
+
+  body.hub-phone .hub-tile-pnl {
+    font-size: 22px;
+  }
+
+  body.hub-phone .monitor-stats-card .monitor-stats-grid {
+    grid-template-columns: repeat(3, minmax(0, 1fr));
+    gap: 6px;
+  }
+
+  body.hub-phone .monitor-stat-cell {
+    padding: 8px 6px;
+  }
+
+  body.hub-phone .monitor-stat-label {
+    font-size: 10px;
+  }
+
+  body.hub-phone .monitor-stat-value {
+    font-size: 14px;
+  }
+
+  body.hub-phone #page-monitor .host-status-panel {
+    margin-bottom: 8px;
+  }
+
+  body.hub-phone #page-monitor .host-status-summary {
+    padding: 8px 10px;
+    gap: 6px 8px;
+  }
+
+  body.hub-phone #page-monitor .host-status-summary-text {
+    font-size: 11px;
   }
 
-  /* 监控:工具条单列优先 */
   body.hub-phone #page-monitor .toolbar {
-    display: grid;
+    display: flex;
-    grid-template-columns: 1fr 1fr;
+    flex-wrap: wrap;
-    gap: 8px;
     align-items: center;
+    gap: 8px;
+    padding: 8px 10px;
+    margin-bottom: 10px;
   }
 
-  body.hub-phone #page-monitor .toolbar .primary {
+  body.hub-phone #page-monitor .toolbar .primary,
-    grid-column: 1;
-  }
-
   body.hub-phone #page-monitor .toolbar .danger {
-    grid-column: 2;
+    flex: 1 1 auto;
+    min-height: 36px;
+    padding: 6px 10px;
+    font-size: 13px;
   }
 
   body.hub-phone #page-monitor .toolbar .chk-label {
-    grid-column: 1 / -1;
+    order: 3;
+    flex: 1 1 100%;
+    margin: 0;
     font-size: 11px;
+    color: var(--muted);
   }
 
   body.hub-phone #page-monitor .toolbar .toolbar-spacer {
@@ -4092,37 +4182,192 @@ body.login-page {
   }
 
   body.hub-phone #page-monitor .toolbar .toolbar-meta {
-    grid-column: 1 / -1;
+    order: 4;
+    flex: 1 1 100%;
+    font-size: 10px;
+    opacity: 0.85;
   }
 
-  body.hub-phone #page-monitor .host-status-panel {
+  /* —— 行情:控件收短,图表优先 —— */
+  body.hub-phone #page-market .market-toolbar {
+    display: grid;
+    grid-template-columns: 1fr 1fr;
+    gap: 6px 8px;
+    align-items: end;
+    padding: 8px 10px;
     margin-bottom: 8px;
   }
 
-  /* 行情:减噪,图表吃高度 */
+  body.hub-phone #page-market .market-field > span {
-  body.hub-phone #page-market .page-head {
+    font-size: 10px;
-    margin-bottom: 4px;
+    margin-bottom: 2px;
+  }
+
+  body.hub-phone #page-market .market-field select,
+  body.hub-phone #page-market .market-field input {
+    min-height: 34px;
+    padding: 4px 8px;
+    font-size: 13px;
+  }
+
+  body.hub-phone #page-market .market-field-symbol {
+    grid-column: 1 / -1;
+  }
+
+  body.hub-phone #page-market .market-field-symbol .market-symbol-wrap {
+    flex-direction: column;
+    gap: 6px;
+  }
+
+  body.hub-phone #page-market .market-scan-tabs {
+    width: 100%;
+    flex-wrap: nowrap;
+    overflow-x: auto;
+    -webkit-overflow-scrolling: touch;
+    scrollbar-width: none;
+    padding-bottom: 1px;
+  }
+
+  body.hub-phone #page-market .market-scan-tabs::-webkit-scrollbar {
+    display: none;
+  }
+
+  body.hub-phone #page-market .market-scan-tab {
+    min-height: 30px;
+    padding: 0 10px;
+    font-size: 11px;
+  }
+
+  body.hub-phone #page-market .market-toolbar #market-load {
+    grid-column: 1;
+    min-height: 34px;
+    padding: 6px 10px;
+  }
+
+  body.hub-phone #page-market .market-toolbar #market-refresh {
+    grid-column: 2;
+    min-height: 34px;
+    padding: 6px 8px;
+    font-size: 11px;
+  }
+
+  body.hub-phone #page-market .market-toolbar .toolbar-meta {
+    display: none;
+  }
+
+  body.hub-phone #page-market #market-status {
+    display: none;
+  }
+
+  body.hub-phone #page-market #market-status.err,
+  body.hub-phone #page-market #market-status.warn {
+    display: block;
+    font-size: 11px;
+    margin: 0 0 6px;
+  }
+
+  body.hub-phone #page-market .market-vol-rank-anchor {
+    margin: 0 0 6px;
   }
 
   body.hub-phone #page-market .market-chart-wrap {
-    min-height: min(52vh, 420px);
+    min-height: min(58vh, 480px);
+    height: min(58vh, 480px);
   }
 
-  body.hub-phone #page-market .market-ohlcv-title .market-day-split-opt {
+  body.hub-phone #page-market .market-ohlcv-bar {
-    font-size: 11px;
+    padding: 8px 10px 6px;
+  }
+
+  body.hub-phone #page-market .market-ohlcv-title {
+    gap: 6px;
+    margin-bottom: 2px;
+  }
+
+  /* 交易所/币种已在顶栏出现,图表内重复标签隐藏 */
+  body.hub-phone #page-market .mkt-exchange-tag,
+  body.hub-phone #page-market #mkt-symbol-label,
+  body.hub-phone #page-market #mkt-tf-label {
+    display: none;
+  }
+
+  body.hub-phone #page-market .market-day-split-opt {
+    display: none;
+  }
+
+  body.hub-phone #page-market .market-chart-actions {
+    margin-left: 0;
+    width: 100%;
+    justify-content: flex-start;
+  }
+
+  body.hub-phone #page-market .market-ohlcv-row {
+    gap: 4px 10px;
+    font-size: 12px;
+  }
+
+  /* —— 计算器 —— */
+  body.hub-phone #page-calculator .toolbar {
+    display: flex;
+    align-items: center;
+    gap: 8px;
+    padding: 6px 10px;
+    margin-bottom: 8px;
+  }
+
+  body.hub-phone #page-calculator .toolbar .primary {
+    min-height: 32px;
+    padding: 4px 12px;
+    font-size: 12px;
+  }
+
+  body.hub-phone #page-calculator .toolbar .toolbar-meta {
+    font-size: 10px;
   }
 
-  /* 计算器:卡片间距收紧 */
   body.hub-phone #page-calculator .calc-layout {
-    gap: 12px;
+    gap: 10px;
   }
 
   body.hub-phone #page-calculator .calc-card {
-    padding: 14px 12px;
+    padding: 12px 12px 14px;
+  }
+
+  body.hub-phone #page-calculator .calc-card h2 {
+    margin: 0 0 6px;
+    font-size: 14px;
   }
 
   body.hub-phone #page-calculator .calc-hint {
-    font-size: 11px;
+    display: none;
+  }
+
+  body.hub-phone #page-calculator .calc-form-grid {
+    grid-template-columns: 1fr 1fr;
+    gap: 8px 10px;
+  }
+
+  body.hub-phone #page-calculator .calc-field-span2 {
+    grid-column: 1 / -1;
+  }
+
+  body.hub-phone #page-calculator .calc-market-info {
+    font-size: 10px;
+    line-height: 1.35;
+    padding: 6px 8px;
+    max-height: 3.2em;
+    overflow: hidden;
+  }
+
+  body.hub-phone #page-calculator .calc-field span {
+    font-size: 10px;
+  }
+
+  body.hub-phone #page-calculator .calc-field input,
+  body.hub-phone #page-calculator .calc-field select {
+    min-height: 34px;
+    padding: 4px 8px;
+    font-size: 13px;
   }
 
   .hub-mobile-tabbar {

manual_trading_hub/static/app.js

@@ -1742,9 +1742,8 @@
       return;
     }
     if (isMobileLayout()) {
-      gridEl.style.gridTemplateColumns = options.statsFirst
+      // 手机一律单列:统计卡与三所卡不再并排挤字
-        ? "1fr"
+      gridEl.style.gridTemplateColumns = "1fr";
-        : "repeat(2, minmax(0, 1fr))";
       return;
     }
     if (options.statsFirst) {

manual_trading_hub/static/index.html

@@ -15,7 +15,7 @@
   <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
   <link href="https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;600&family=Orbitron:wght@500;600;700&display=swap" rel="stylesheet" media="print" onload="this.media='all'" />
   <noscript><link href="https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;600&family=Orbitron:wght@500;600;700&display=swap" rel="stylesheet" /></noscript>
-      <link rel="stylesheet" href="/assets/app.css?v=20260715-hub-phone-shell" />
+      <link rel="stylesheet" href="/assets/app.css?v=20260715-hub-phone-clean" />
   <link rel="stylesheet" href="/assets/trade_stats_calendar.css?v=4" />
   <link rel="stylesheet" href="/assets/account_risk_badge.css?v=4" />
   <script src="/assets/account_risk_badge.js?v=4"></script>
@@ -1295,6 +1295,6 @@
   <script src="/assets/options_expiry_countdown.js?v=1"></script>
   <script src="/assets/options_position_cards.js?v=1"></script>
   <script src="/assets/backup.js?v=1"></script>
-  <script src="/assets/app.js?v=20260715-hub-phone-shell"></script>
+  <script src="/assets/app.js?v=20260715-hub-phone-clean"></script>
 </body>
 </html>