顶栏固定单行 + 侧栏信息架构重构（接口/历史分段切换）

- 修复窄窗口下顶栏按钮被压缩导致中文逐字竖排：按钮 whitespace-nowrap + shrink-0，
  header flex-nowrap + 横向滚动兜底；协议徽标 xl 以下隐藏；实测 header 恒定 48px、零换行按钮
- 侧栏重构：历史上移——搜索框下「接口 | 历史(计数)」分段切换（历史为高频最近使用），
  历史视图含清空按钮；底部只留跨视图导航（自动化测试）+ 外链（官网与价格），职责单一
- 分段控件样式（panel-3 底、active 白底浮起）；复验截图评审通过

packages/ui/src/components/TopBar.tsx

@@ -155,7 +155,7 @@ export function TopBar() {
 
   return (
     <header
-      className="ops-panel ops-divider flex h-12 shrink-0 items-center justify-between gap-3 px-4"
+      className="ops-panel ops-divider flex h-12 shrink-0 flex-nowrap items-center justify-between gap-3 overflow-x-auto px-4"
       style={{ zIndex: 30 }}
     >
       <div className="flex items-center gap-3">
@@ -163,7 +163,7 @@ export function TopBar() {
           <Logo size={26} />
           <span className="text-[14px] font-bold tracking-tight">OpsxAPI</span>
         </div>
-        <span className="ops-chip" style={{ padding: "1px 8px", fontSize: 10 }}>
+        <span className="ops-chip hidden whitespace-nowrap xl:inline-flex" style={{ padding: "1px 8px", fontSize: 10 }}>
           HTTP · GraphQL · WS · SSE · Socket.IO · MQTT
         </span>
       </div>