feat: 优化监控仪表盘 UI

- 添加 appbar 导航栏，支持 Chart/Queues 视图切换
- appbar 切换使用 history API，支持浏览器前进/后退
- 图表视图占满整个可视区域
- queue-modal 共享 appbar 样式
- 修复 queue tab count 字段名大小写问题
- tooltip 跟随鼠标显示在右下方，移除箭头
- 图表 canvas 鼠标样式改为准星
- pause/resume 队列后刷新列表
- example 添加 flag 配置参数

x/monitor/ui/components/help-tooltip.js

@@ -0,0 +1,80 @@
+import { LitElement, html, css } from 'lit';
+
+class HelpTooltip extends LitElement {
+  static properties = {
+    text: { type: String }
+  };
+
+  static styles = css`
+    :host {
+      display: inline-flex;
+      align-items: center;
+      justify-content: center;
+      position: relative;
+    }
+
+    .icon {
+      display: inline-flex;
+      align-items: center;
+      justify-content: center;
+      width: 14px;
+      height: 14px;
+      border-radius: 50%;
+      background: #616161;
+      color: #9e9e9e;
+      font-size: 10px;
+      cursor: help;
+    }
+
+    .icon:hover {
+      background: #757575;
+      color: #e0e0e0;
+    }
+
+    .icon:hover + .tooltip {
+      display: block;
+    }
+
+    .tooltip {
+      display: none;
+      position: absolute;
+      top: 100%;
+      left: 50%;
+      transform: translateX(-50%);
+      margin-top: 8px;
+      padding: 8px 12px;
+      background: #212121;
+      color: #e0e0e0;
+      font-size: 12px;
+      font-weight: normal;
+      border-radius: 4px;
+      white-space: nowrap;
+      z-index: 1000;
+      box-shadow: 0 2px 8px rgba(0,0,0,0.3);
+    }
+
+    .tooltip::before {
+      content: '';
+      position: absolute;
+      bottom: 100%;
+      left: 50%;
+      transform: translateX(-50%);
+      border: 6px solid transparent;
+      border-bottom-color: #212121;
+    }
+  `;
+
+  constructor() {
+    super();
+    this.text = '';
+  }
+
+  render() {
+    return html`
+      <span class="icon">?</span>
+      <span class="tooltip">${this.text}</span>
+    `;
+  }
+}
+
+customElements.define('help-tooltip', HelpTooltip);