@charset "utf-8";
/* ============================================================
   hb-skin.css — 蜂鸟(Hummingbird) 1:1 皮肤层
   结构与度量来自 C:\Users\Administrator\Desktop\蜂鸟 实测
   ============================================================ */

:root{
  --hb-rail:88px;
  --hb-head:64px;
  --hb-card:#fff;
  --hb-th:#f4f7fd;
  --hb-hover:#f7faff;
  --hb-soft:#5c6778;
}

/* ---------- 外壳 ---------- */
html,body{background:#e8eef8 !important}
body{font-family:"IBM Plex Sans","Microsoft YaHei",ui-sans-serif,system-ui,sans-serif !important;color:#0c1222}
#root::before{
  content:"";position:fixed;inset:12px;z-index:0;pointer-events:none;
  background:#fff;border:1px solid #dfe7f5;border-radius:20px;
  box-shadow:0 30px 70px -36px rgba(12,18,34,.30),0 2px 8px rgba(12,18,34,.04);
}
[data-slot="sidebar-wrapper"]{padding:12px !important;background:transparent !important;height:100svh !important;overflow:hidden !important}
main{position:relative;height:calc(100svh - 24px) !important;padding-top:var(--hb-head) !important;overflow:hidden !important;background:transparent !important}
main > div[class*="flex-1"]{
  height:calc(100svh - 24px - var(--hb-head)) !important;
  overflow:auto !important;padding:6px 22px 18px !important;scrollbar-width:thin;
}
main [style*="calc(-64px"]{height:auto !important;min-height:0 !important}
main::-webkit-scrollbar,main > div::-webkit-scrollbar{width:8px;height:8px}
main > div::-webkit-scrollbar-thumb{background:#c8d5ea;border-radius:8px}
main > div::-webkit-scrollbar-track{background:transparent}

/* 无壳模式（控制页 ?standalone=1）：应用不渲染 main>header，
   外壳层不要再预留 64px 顶栏高度，否则顶部出现一条空白。 */
html.zk-standalone main{padding-top:0 !important}
html.zk-standalone main > div.hb-canvas{height:calc(100svh - 24px) !important}
html.zk-standalone main > div[class*="flex-1"]{height:calc(100svh - 24px) !important}


/* ---------- 顶栏（横跨整个外壳，蜂鸟同款） ---------- */
main > header{
  position:absolute !important;top:0;left:calc(-1 * var(--hb-rail)) !important;right:0 !important;
  height:var(--hb-head) !important;z-index:30;
  display:flex !important;align-items:center !important;gap:10px !important;
  padding:0 20px 0 18px !important;margin:0 !important;
  background:#fff !important;border-bottom:1px solid #e7edf8 !important;
  border-radius:20px 20px 0 0;
}
main > header [data-slot="sidebar-trigger"],
main > header [data-slot="separator-root"],
main > header #breadcrumb{display:none !important}

/* 品牌块（由 JS 从侧栏搬入顶栏） */
.hb-brand{display:flex !important;align-items:center;gap:10px;width:272px;flex:none;min-width:0}
.hb-brand .hb-mark{width:40px;height:40px;flex:none;display:block;object-fit:contain}
.hb-brand .hb-brand-txt{display:flex;flex-direction:column;gap:2px;min-width:0}
.hb-brand .hb-brand-row{display:flex;align-items:center;gap:8px;min-width:0}
.hb-brand .hb-name{font-size:19px;font-weight:700;letter-spacing:-.02em;color:#0f1a33;white-space:nowrap;line-height:1.1}
.hb-brand .hb-ultra{
  font-size:9.5px;font-weight:700;letter-spacing:.14em;color:#fff;line-height:1;
  padding:4px 9px;border-radius:999px;
  background:linear-gradient(135deg,#2f6bff,#1f45d8);box-shadow:0 4px 10px -4px rgba(33,85,255,.9);
}
.hb-brand .hb-sub{font-size:10.5px;color:#7c8798;letter-spacing:.06em;line-height:1;white-space:nowrap}

/* 顶栏中间胶囊 */
main > header .flit2-meta{display:flex;align-items:center;gap:7px;margin:0 !important;flex:none}
main > header .flit2-meta .fa-role,
main > header .flit2-meta .fa-ver,
main > header .flit2-meta .fa-full{
  height:26px;padding:0 11px;border-radius:7px;font-size:11.5px;font-weight:600;
  display:inline-flex;align-items:center;gap:5px;border:1px solid transparent;line-height:1;
}
main > header .flit2-meta .fa-role{background:#eef2f9;color:#3a465c}
main > header .flit2-meta .fa-ver{background:#f1ecff;color:#6b4bd6;font-family:"IBM Plex Mono",monospace;font-size:10.5px}
main > header .flit2-meta .fa-full{background:#fff;border-color:#e2e9f6;color:#3a465c;cursor:pointer}
main > header .flit2-meta .fa-full:hover{background:#f3f7ff;border-color:#c8d7ff;color:#2155ff}

/* 顶栏右侧 */
.hb-head-right{margin-left:auto;display:flex;align-items:center;gap:14px;flex:none}
.hb-ping{display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:600;color:#1a2440}
.hb-ping svg{width:15px;height:15px;color:#2155ff}
.hb-cloud{display:inline-flex;align-items:center;gap:7px;font-size:12px;color:#1a2440}
.hb-cloud .hb-cloud-ico{width:22px;height:22px;border-radius:7px;display:grid;place-items:center;background:#edf2ff;color:#2155ff;flex:none}
.hb-cloud .hb-cloud-ico svg{width:13px;height:13px}
.hb-cloud .hb-cloud-txt{display:flex;flex-direction:column;line-height:1.15}
.hb-cloud .hb-cloud-txt b{font-size:11.5px;font-weight:600}
.hb-cloud .hb-cloud-txt span{font-size:9.5px;color:#8b95a6}
.hb-bal{display:inline-flex;align-items:center;gap:7px;font-size:12px;font-weight:600;color:#1a2440}
.hb-bal .hb-coin{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;color:#7a5200;
  background:linear-gradient(160deg,#ffe27a,#ffc02e);box-shadow:0 0 0 2px #fff,0 4px 10px -6px rgba(184,107,0,.8)}
.hb-bal .hb-coin svg{width:12px;height:12px}
.hb-user{display:flex;align-items:center;gap:8px;padding-left:2px}
.hb-user .hb-ava{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;
  background:#e9f0ff;color:#2155ff;font-size:12px;font-weight:700;border:1px solid #d4e0fb;position:relative}
.hb-user .hb-ava::after{content:"";position:absolute;right:0;bottom:0;width:9px;height:9px;border-radius:50%;
  background:#12b76a;border:2px solid #fff}
.hb-user .hb-uname{font-size:13px;font-weight:600;color:#101a2e;line-height:1}
.hb-user .hb-urole{font-size:10px;color:#8b95a6;line-height:1;margin-top:3px}
.hb-user > div{display:flex;flex-direction:column}

/* 顶栏原有的小图标按钮 / 币种控件 */
main > header > div[class*="flex-1"]{min-width:0;overflow:hidden;justify-content:flex-end;display:flex}
main > header > div[class*="flex-1"] > div{gap:8px !important;flex-wrap:nowrap}
main > header input[type="number"],main > header input[type="text"]{
  height:28px !important;border-radius:7px !important;border:1px solid #e2e9f6 !important;
  background:#fff !important;font-size:11.5px !important;color:#1a2440 !important;padding:0 8px !important;
}
main > header [data-slot="select-trigger"],main > header button[role="combobox"]{
  height:28px !important;border-radius:7px !important;border:1px solid #e2e9f6 !important;
  background:#fff !important;font-size:11.5px !important;color:#3a465c !important;padding:0 9px !important;
}
main > header button[data-slot="button"]{height:28px !important;border-radius:7px !important;font-size:11.5px !important}
main > header .flit2-clock{font-size:11px;color:#7c8798;white-space:nowrap}

/* ---------- 侧栏 ---------- */
[data-slot="sidebar-gap"],[data-slot="sidebar-container"],[data-slot="sidebar-inner"]{width:var(--hb-rail) !important}
[data-slot="sidebar-inner"]{background:transparent !important;border:0 !important;box-shadow:none !important}
[data-slot="sidebar-header"]{display:none !important}
[data-slot="sidebar-content"]{padding:74px 0 58px !important;gap:0 !important;overflow-y:auto !important;overflow-x:hidden !important;scrollbar-width:none}
[data-slot="sidebar-content"]::-webkit-scrollbar{width:0;height:0}
[data-slot="sidebar-group"]{padding:0 9px !important}
[data-slot="sidebar-group"] + [data-slot="sidebar-group"]{position:relative;margin-top:9px;padding-top:9px !important}
[data-slot="sidebar-group"] + [data-slot="sidebar-group"]::before{
  content:"";position:absolute;top:0;left:16px;right:16px;height:1px;background:#e9eef8;
}
[data-slot="sidebar-group-content"] > div{
  font-size:8.5px !important;font-weight:600 !important;letter-spacing:.16em !important;
  color:#a6b1c4 !important;text-align:center;padding:9px 0 3px !important;text-transform:uppercase;
  margin:0 !important;line-height:1;
}
[data-slot="sidebar-content"] [data-slot="sidebar-menu-button"]{
  flex-direction:column !important;align-items:center !important;justify-content:center !important;
  gap:4px !important;height:58px !important;width:100% !important;padding:7px 2px !important;
  font-size:10px !important;line-height:1.15 !important;text-align:center !important;
  white-space:normal !important;border:1px solid transparent !important;background:transparent !important;
  color:#5a657a !important;border-radius:14px !important;font-weight:500 !important;
  box-shadow:none !important;
}
[data-slot="sidebar-content"] [data-slot="sidebar-menu-button"] svg{width:21px !important;height:21px !important;stroke-width:1.75 !important;flex:none}
[data-slot="sidebar-content"] [data-slot="sidebar-menu-button"]:hover{background:#f2f6ff !important;color:#2155ff !important}
[data-slot="sidebar-content"] [data-slot="sidebar-menu-button"][data-active="true"]{
  background:linear-gradient(150deg,#2f6bff,#1c48dd) !important;color:#fff !important;border-color:transparent !important;
  box-shadow:0 12px 24px -14px rgba(33,85,255,.95) !important;
}
[data-slot="sidebar-content"] [data-slot="sidebar-menu-button"][data-active="true"] *{color:#fff !important}
[data-slot="sidebar-footer"]{display:none !important}

/* 底部折叠手柄 */
.hb-rail-toggle{
  position:absolute;left:22px;bottom:14px;width:44px;height:40px;z-index:12;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;
  border-radius:12px;border:1px solid #e5ebf7;background:#fff;color:#74809a;cursor:pointer;
  font-size:8.5px;line-height:1;transition:.15s;
}
.hb-rail-toggle svg{width:15px;height:15px}
.hb-rail-toggle:hover{color:#2155ff;border-color:#c9d8ff;background:#f4f8ff}

/* ---------- 页头（居中标题） ---------- */
.hb-head{
  display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:10px;
  padding:6px 2px 16px;position:relative;
}
.hb-head .hb-head-mid{display:flex;flex-direction:column;align-items:center;gap:3px;text-align:center}
.hb-head .hb-head-row{display:flex;align-items:center;gap:9px}
.hb-head .hb-head-ico{
  width:30px;height:30px;border-radius:9px;display:grid;place-items:center;color:#2155ff;background:#edf2ff;flex:none;
}
.hb-head .hb-head-ico svg{width:18px;height:18px}
.hb-head h1{font-size:21px;font-weight:700;letter-spacing:-.02em;color:#0c1222;line-height:1.15;margin:0;white-space:nowrap}
.hb-head h1 em{font-style:normal;color:#2155ff;font-weight:700}
.hb-head .hb-head-sub{font-size:9.5px;letter-spacing:.2em;color:#9aa5b8;font-weight:500;text-transform:uppercase;line-height:1}
.hb-head .hb-head-act{justify-self:end;display:flex;align-items:center;gap:8px}
.hb-head .hb-round{
  width:36px;height:36px;border-radius:50%;border:1px solid #e5ebf7;background:#fff;color:#6b778c;
  display:grid;place-items:center;cursor:pointer;transition:.15s;
}
.hb-head .hb-round:hover{color:#2155ff;border-color:#c9d8ff;background:#f4f8ff;box-shadow:0 8px 18px -14px rgba(33,85,255,.9)}
.hb-head .hb-round svg{width:16px;height:16px;transition:transform .4s}
.hb-head .hb-round:hover svg{transform:rotate(90deg)}

/* ---------- 统计胶囊 ---------- */
.hb-stats{display:grid;grid-template-columns:repeat(var(--hb-cols,6),minmax(0,1fr));gap:12px;margin:0 0 16px}
.hb-stat{
  display:flex;align-items:center;gap:11px;height:62px;padding:0 16px;
  background:#fff;border:1px solid #e3eafa;border-radius:14px;
  box-shadow:0 1px 2px rgba(12,18,34,.03);transition:.16s;
}
.hb-stat:hover{border-color:#c9d8ff;box-shadow:0 12px 26px -22px rgba(33,85,255,.9)}
.hb-stat .hb-stat-ico{
  width:34px;height:34px;border-radius:10px;flex:none;display:grid;place-items:center;color:#fff;
  background:linear-gradient(150deg,#3b76ff,#1f4fe0);box-shadow:0 8px 16px -10px rgba(33,85,255,.9);
}
.hb-stat .hb-stat-ico svg{width:17px;height:17px}
.hb-stat .hb-stat-ico.warn{background:linear-gradient(150deg,#ffb64d,#f09100);box-shadow:0 8px 16px -10px rgba(240,145,0,.9)}
.hb-stat .hb-stat-ico.live{background:linear-gradient(150deg,#22c58b,#0b8f63);box-shadow:0 8px 16px -10px rgba(11,143,99,.9)}
.hb-stat .hb-stat-ico.danger{background:linear-gradient(150deg,#ff7a85,#d33b46);box-shadow:0 8px 16px -10px rgba(196,60,70,.9)}
.hb-stat .hb-stat-txt{display:flex;flex-direction:column;gap:2px;min-width:0}
.hb-stat .hb-stat-num{font-size:19px;font-weight:700;letter-spacing:-.02em;line-height:1;color:#0c1222}
.hb-stat .hb-stat-lbl{font-size:11.5px;color:#6b778c;line-height:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* ---------- 卡片 ---------- */
main [data-slot="card"]{
  background:#fff !important;border:1px solid #e3eafa !important;border-radius:16px !important;
  box-shadow:0 1px 2px rgba(12,18,34,.03) !important;
}
main [data-slot="card"][class*="border-l-4"]{border-left-width:1px !important;border-left-color:#e3eafa !important}
main [data-slot="card-header"]{padding:16px 20px 12px !important;border-bottom:1px solid #f0f4fb}
main [data-slot="card-title"]{font-size:15px !important;font-weight:600 !important;color:#0f1a33}
main [data-slot="card-content"]{padding:16px 20px !important}
main [data-slot="card"] + [data-slot="card"]{margin-top:0}

/* 卡片内小标题 */
main h3,main .text-lg{letter-spacing:-.01em}

/* ---------- 表格 ---------- */
main table{width:100%;border-collapse:separate;border-spacing:0;font-size:12.5px}
main thead th{
  background:#f5f8fe !important;color:#3a465c !important;font-weight:600 !important;font-size:12px !important;
  padding:12px 14px !important;border-bottom:1px solid #e8eefa !important;white-space:nowrap;
  letter-spacing:.01em;
}
main thead th:first-child{border-top-left-radius:10px}
main thead th:last-child{border-top-right-radius:10px}
main tbody td{
  padding:13px 14px !important;border-bottom:1px solid #eff3fb !important;color:#20293d;vertical-align:middle;
}
main tbody tr{background:#fff;transition:background .12s}
main tbody tr:hover{background:#f8fbff}
main tbody tr:last-child td{border-bottom:0 !important}

/* 表格外层：若是卡片内直接 table，给它一点内边距 */
main [data-slot="card-content"] > table{margin:0 -20px;width:calc(100% + 40px)}

/* ---------- 按钮 ---------- */
main button[data-slot="button"]{border-radius:9px !important;font-size:12.5px !important;font-weight:500}
main button[data-slot="button"]:not([class*="bg-primary"]):not([class*="bg-destructive"]){
  border-color:#e3eafa !important;background:#fff !important;color:#3a465c !important;
}
main button[data-slot="button"]:not([class*="bg-primary"]):not([class*="bg-destructive"]):hover{
  background:#f4f8ff !important;border-color:#c9d8ff !important;color:#2155ff !important;
}
main button[data-slot="button"][class*="bg-primary"]{
  background:linear-gradient(150deg,#2f6bff,#1f4fe0) !important;color:#fff !important;
  border-color:transparent !important;box-shadow:0 10px 20px -14px rgba(33,85,255,.95);
}
main button[data-slot="button"][class*="bg-destructive"]{
  background:#fff1f2 !important;color:#c43c46 !important;border-color:#f6d4d8 !important;box-shadow:none !important;
}

/* ---------- 输入 ---------- */
main input:not([type="checkbox"]):not([type="radio"]),main textarea,main select{
  border-radius:9px !important;border-color:#e3eafa !important;background:#fff !important;
  font-size:12.5px !important;color:#1a2440 !important;
}
main input:focus,main textarea:focus,main select:focus{
  border-color:#9db8ff !important;box-shadow:0 0 0 3px rgba(33,85,255,.12) !important;outline:none !important;
}
main input::placeholder,main textarea::placeholder{color:#a9b3c4 !important}

/* ---------- 徽章 ---------- */
main [class*="rounded-full"][class*="bg-green-"],main .bg-emerald-500\/10{background:#e8f7f1 !important;color:#0b8f63 !important;border-color:#bfe6d6 !important}
main [class*="rounded-full"][class*="bg-red-"],main .bg-rose-500\/10{background:#fdf1f2 !important;color:#c43c46 !important;border-color:#f6d4d8 !important}

/* ---------- 分页条 ---------- */
.hb-pager{
  display:flex;align-items:center;justify-content:flex-end;gap:12px;flex-wrap:wrap;
  padding:14px 18px !important;border-top:1px solid #eff3fb;font-size:12px;color:#5c6778;
}
.hb-pager .hb-pg-info{margin-right:auto;color:#8b95a6;font-size:12px}
.hb-pager button,.hb-pager .hb-pg-btn{
  min-width:30px;height:30px;padding:0 9px;border-radius:8px;border:1px solid transparent;background:transparent;
  color:#5c6778;font-size:12px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:4px;
}
.hb-pager button:hover{background:#f2f6ff;color:#2155ff;border-color:#dbe6ff}
.hb-pager button[data-active="true"],.hb-pager .hb-pg-btn.is-on{
  background:#2155ff;color:#fff;border-color:#2155ff;box-shadow:0 8px 16px -12px rgba(33,85,255,.9)}
.hb-pager .hb-pg-size{
  height:30px;border:1px solid #e3eafa;border-radius:8px;background:#fff;color:#3a465c;font-size:12px;padding:0 8px;
}

/* ---------- 水印 ---------- */
.hb-watermark{
  position:absolute;inset:0;pointer-events:none;z-index:0;overflow:hidden;opacity:.55;
  background-image:var(--hb-wm,none);background-repeat:repeat;background-size:420px 300px;
}
main > div[class*="flex-1"]{position:relative}
main > div[class*="flex-1"] > *{position:relative;z-index:1}

/* ---------- 弹窗 ---------- */
[data-slot="dialog-content"],[data-slot="alert-dialog-content"]{
  border-radius:16px !important;border-color:#e3eafa !important;box-shadow:0 40px 80px -32px rgba(12,18,34,.35) !important;
}
[data-slot="dialog-header"] [data-slot="dialog-title"]{font-size:16px;font-weight:600}
[data-slot="popover-content"],[data-slot="dropdown-menu-content"],[data-slot="select-content"]{
  border-radius:12px !important;border-color:#e3eafa !important;box-shadow:0 22px 48px -24px rgba(12,18,34,.35) !important;
}

/* ---------- 全局细节 ---------- */
main .text-muted-foreground{color:#6b778c !important}
main .text-\[10px\],main .text-\[11px\]{letter-spacing:.01em}
main hr{border-color:#eff3fb !important}
main [class*="bg-muted"]{background:#f5f8fe !important}
main [class*="bg-card"]{background:#fff !important}

/* 滚动条 */
main *::-webkit-scrollbar{width:8px;height:8px}
main *::-webkit-scrollbar-thumb{background:#cbd7ea;border-radius:8px}
main *::-webkit-scrollbar-track{background:transparent}

/* 响应式 */
@media (max-width:1500px){
  .hb-brand{width:230px}
  .hb-brand .hb-sub{display:none}
}
@media (max-width:1280px){
  .hb-head-right .hb-cloud{display:none}
  .hb-brand{width:200px}
  main > header .flit2-meta .fa-full{display:none}
}
@media (max-width:1100px){
  .hb-stats{grid-template-columns:repeat(3,minmax(0,1fr))}
}
/* ---------- 控制台 KPI：旧卡片 → 蜂鸟统计胶囊 ---------- */
.hb-hide{display:none !important}
.hb-kpi-grid{display:grid !important;grid-template-columns:repeat(6,minmax(0,1fr)) !important;gap:12px !important;margin-bottom:16px !important}
main [data-slot="card"].hb-kpi{
  height:62px !important;padding:0 !important;border-radius:14px !important;overflow:hidden;
  border:1px solid #e3eafa !important;box-shadow:0 1px 2px rgba(12,18,34,.03) !important;
}
main [data-slot="card"].hb-kpi:hover{border-color:#c9d8ff !important;box-shadow:0 12px 26px -22px rgba(33,85,255,.9) !important}
main [data-slot="card"].hb-kpi [data-slot="card-content"]{
  height:62px !important;padding:0 15px !important;display:grid !important;
  grid-template-columns:auto minmax(0,1fr);
  grid-template-areas:"ico num" "ico lbl";
  align-content:center;column-gap:10px;row-gap:2px;
}
main [data-slot="card"].hb-kpi [data-slot="card-content"] > div:first-child{display:contents !important}
main [data-slot="card"].hb-kpi [data-slot="card-content"] > div:first-child > p{
  grid-area:lbl;font-size:11.5px !important;font-weight:400 !important;color:#6b778c !important;
  text-transform:none !important;letter-spacing:0 !important;margin:0 !important;line-height:1 !important;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
main [data-slot="card"].hb-kpi [data-slot="card-content"] > div:first-child > div{
  grid-area:ico;width:34px !important;height:34px !important;border-radius:10px !important;padding:0 !important;
  display:grid !important;place-items:center !important;
  background:linear-gradient(150deg,#3b76ff,#1f4fe0) !important;color:#fff !important;
  box-shadow:0 8px 16px -10px rgba(33,85,255,.9);
}
main [data-slot="card"].hb-kpi [data-slot="card-content"] > div:first-child > div svg{width:17px !important;height:17px !important;color:#fff !important}
main [data-slot="card"].hb-kpi [data-slot="card-content"] > div:nth-child(2){
  grid-area:num;font-size:19px !important;font-weight:700 !important;line-height:1 !important;
  color:#0c1222 !important;margin:0 !important;letter-spacing:-.02em;
}
main [data-slot="card"].hb-kpi [data-slot="card-content"] > p,
main [data-slot="card"].hb-kpi [data-slot="card-content"] > div:nth-child(n+4){display:none !important}

@media (max-width:1500px){.hb-kpi-grid{grid-template-columns:repeat(3,minmax(0,1fr)) !important}}
@media (max-width:900px){.hb-kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr)) !important}}

/* ---------- 修正：侧栏顶部让位给顶栏、层级 ---------- */
html.hb-init [data-slot="sidebar-content"]{padding:74px 0 58px !important;gap:0 !important}
main > header{z-index:70 !important}
[data-slot="sidebar-container"]{z-index:20 !important}
.hb-brand .hb-name{position:relative;z-index:2;color:#0f1a33 !important;-webkit-text-fill-color:#0f1a33 !important;background:none !important}
.hb-brand .hb-mark{width:38px !important;height:38px !important}

/* 顶栏顺序：品牌 / 胶囊 / 连接状态 / 币种 / 操作 */
main > header > .hb-brand{order:0}
main > header > .flit2-meta{order:1}
main > header > .hb-hdr-cluster{order:2;margin-left:auto;display:flex;align-items:center;gap:14px;flex:none;margin-right:4px}
main > header > div[class*="flex-1"]{order:3;flex:0 1 auto !important}
main > header > button[data-slot="dropdown-menu-trigger"]:not(.hb-user){order:4}
main > header > button[data-slot="button"]{order:4}
main > header > .hb-user{order:5}

/* 蜂鸟顶栏没有时钟/时区，收起以保持一比一 */
main > header .flit2-clock{display:none !important}
main > header select{max-width:96px}

/* 品牌中文字形兜底 */
.hb-brand .hb-name,.hb-brand .hb-sub{font-family:"Microsoft YaHei","IBM Plex Sans",sans-serif !important}
.hb-brand .hb-name{font-weight:700 !important}
.hb-brand svg.hb-mark{width:40px;height:40px;display:block;flex:none}

/* 侧栏尾部状态块隐藏（蜂鸟无） */
[data-slot="sidebar-content"] > div:last-child:not([data-slot="sidebar-group"]){display:none !important}

/* 层级修正：main 需高于 sidebar-container，顶栏才能覆盖在侧栏之上 */
main{z-index:26 !important}
[data-slot="sidebar-container"]{z-index:20 !important}

/* ---------- 品牌改为独立定位（避免被 main overflow 裁切） ---------- */
main > header{padding-left:306px !important}
.hb-brand{
  position:fixed !important;left:30px;top:26px;z-index:80;
  display:flex;align-items:center;gap:10px;width:auto;min-width:0;pointer-events:none;
}
.hb-brand .hb-mark{width:40px;height:40px}
.hb-brand .hb-brand-txt{gap:3px}
.hb-brand .hb-name{font-size:19.5px;line-height:1}
.hb-brand .hb-sub{font-size:10.5px;line-height:1}
@media (max-width:1500px){main > header{padding-left:268px !important}.hb-brand .hb-sub{display:none}}
@media (max-width:1280px){main > header{padding-left:240px !important}}

/* ---------- 汇率控件收纳（保持蜂鸟干净顶栏） ---------- */
main > header > div[class*="flex-1"]{display:none !important}
main > header > div[class*="flex-1"].hb-fx-open{display:flex !important;position:fixed !important;right:18px !important;top:110px !important;left:auto !important;overflow:visible !important;background:#fff;border:1px solid #e3eafa;
  border-radius:12px;padding:10px 12px;box-shadow:0 22px 48px -24px rgba(12,18,34,.35);z-index:90}
.hb-fx-toggle{
  height:26px;padding:0 10px;border-radius:7px;border:1px solid #e2e9f6;background:#fff;color:#3a465c;
  font-size:11.5px;font-weight:600;display:inline-flex;align-items:center;gap:5px;cursor:pointer;
}
.hb-fx-toggle:hover{background:#f3f7ff;border-color:#c8d7ff;color:#2155ff}

/* 顶栏控件排序与表格表头 */
.hb-fx-toggle{order:3}
main thead th{text-align:center !important}
main thead th:first-child{text-align:left !important}

/* ============================================================
   设备列表 1:1（左侧分组面板 + 统计胶囊 + 卡片网格）
   ============================================================ */
main > div.hb-canvas.hb-dev-on{padding-left:278px !important}
.hb-dev-aside{
  position:absolute;left:22px;top:6px;width:236px;bottom:18px;z-index:2;
  background:#fff;border:1px solid #e3eafa;border-radius:16px;padding:14px 12px;
  box-shadow:0 1px 2px rgba(12,18,34,.03);overflow:auto;scrollbar-width:thin;
}
.hb-dev-aside-head{display:flex;align-items:center;gap:9px;padding:2px 2px 10px}
.hb-dev-aside-head .hb-dev-aside-ico{width:32px;height:32px;border-radius:9px;display:grid;place-items:center;color:#2155ff;background:#edf2ff;flex:none}
.hb-dev-aside-head .hb-dev-aside-ico svg{width:17px;height:17px}
.hb-dev-aside-head > div{display:flex;flex-direction:column;min-width:0}
.hb-dev-aside-head b{font-size:14px;font-weight:600;color:#0f1a33;line-height:1.2}
.hb-dev-aside-head span{font-size:10px;color:#8b95a6;line-height:1.3}
.hb-dev-aside-min{margin-left:auto;width:26px;height:26px;border-radius:7px;border:1px solid #e5ebf7;background:#fff;color:#8b95a6;display:grid;place-items:center;cursor:pointer}
.hb-dev-aside-min svg{width:13px;height:13px}
.hb-dev-search{display:flex;align-items:center;gap:7px;height:34px;border:1px solid #e3eafa;border-radius:9px;padding:0 10px;color:#9aa5b8;background:#fff;margin-bottom:6px}
.hb-dev-search svg{width:14px;height:14px;flex:none}
.hb-dev-search input{border:0 !important;box-shadow:none !important;height:30px !important;padding:0 !important;font-size:12px !important;background:transparent !important;outline:none}
.hb-dev-sec{font-size:11px;font-weight:600;color:#3a465c;padding:12px 6px 6px;display:flex;align-items:center;gap:6px}
.hb-dev-sec::before{content:"";width:3px;height:11px;border-radius:2px;background:#2155ff;opacity:.55}
.hb-dev-list{display:flex;flex-direction:column;gap:2px}
.hb-dev-item{
  display:flex;align-items:center;gap:8px;width:100%;height:36px;padding:0 9px;border:0;border-radius:9px;
  background:transparent;color:#3a465c;font-size:12.5px;cursor:pointer;text-align:left;transition:.14s;
}
.hb-dev-item svg{width:15px;height:15px;flex:none;color:#7c8798}
.hb-dev-item:hover{background:#f4f8ff;color:#2155ff}
.hb-dev-item:hover svg{color:#2155ff}
.hb-dev-item.is-on{background:#edf2ff;color:#2155ff;font-weight:600}
.hb-dev-item.is-on svg{color:#2155ff}
.hb-dev-item-t{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hb-dev-item em{font-style:normal;font-size:11px;color:#9aa5b8;background:#f3f6fc;border-radius:999px;padding:1px 7px;min-width:20px;text-align:center}
.hb-dev-item.is-on em{background:#dfe8ff;color:#2155ff}
.hb-dev-empty{font-size:11.5px;color:#a9b3c4;padding:6px 9px}
.hb-dev-tiles{margin-bottom:14px !important}

/* 卡片网格更紧凑，接近蜂鸟 6 列 */
body.hb-dev-page main [data-slot="card"]:has(.text-\[10px\]){border-radius:14px !important}
body.hb-dev-page .hb-dev-main-grid{gap:14px !important}

/* 收起左侧面板 */
body.hb-dev-min main > div.hb-canvas.hb-dev-on{padding-left:22px !important}
body.hb-dev-min .hb-dev-aside{display:none !important}

/* 左侧分组面板改为固定定位（避开容器 padding 影响） */
.hb-dev-aside{position:fixed !important;left:112px !important;top:88px !important;bottom:30px !important;width:236px !important}
body.hb-dev-min .hb-dev-aside{display:none !important}

/* 设备列表统计胶囊统一蜂鸟蓝 */
.hb-dev-tiles .hb-stat-ico{background:linear-gradient(150deg,#3b76ff,#1f4fe0) !important;box-shadow:0 8px 16px -10px rgba(33,85,255,.9) !important}

/* 登录页品牌副标题 */
.fa-brand .fa-name-wrap{display:flex;flex-direction:column;gap:2px;line-height:1}
.fa-brand .fa-sub{font-size:10.5px;color:#8b95a6;letter-spacing:.04em}

/* 水印层修正 */
.hb-watermark{position:fixed !important;left:100px !important;top:76px !important;right:12px !important;bottom:12px !important;
  height:auto !important;inset:auto !important;z-index:0 !important;opacity:1 !important}
main > div[class*="flex-1"] > *{z-index:1}


/* ---------- 汇率弹层里的实时汇率数值 ---------- */
.hb-fx-rate{
  display:inline-flex;align-items:center;gap:7px;margin-right:auto;white-space:nowrap;
  font-size:11.5px;color:#66738a;line-height:1;
}
.hb-fx-rate > span{font-size:11px;color:#8b95a6}
.hb-fx-rate b{font-size:11.5px;font-weight:600;color:#12b76a;font-variant-numeric:tabular-nums}

/* 分组面板只在设备列表页存在（防止残留到黑名单等其它页面） */
body:not(.hb-dev-page) .hb-dev-aside,
body:not(.hb-dev-page) .hb-dev-tiles{display:none !important}

/* ============================================================
   设备分组面板：按需求整体移除（2026-11-01）
   保留 hb-device.js 逻辑，仅隐藏并释放占位
   ============================================================ */
.hb-dev-aside{display:none !important}
main > div.hb-canvas.hb-dev-on{padding-left:22px !important}
body.hb-dev-min main > div.hb-canvas.hb-dev-on{padding-left:22px !important}


/* __PERF__ 2026-11-02：路由切换时先把内容压一帧，等皮肤层（hb-head/hb-stats/表格重排）落位再淡入。
   目的：不再出现「先看到老皮肤 → 一跳变成新皮肤」。只动 opacity/translate，不搬 React 节点。 */
main .hb-canvas{transition:opacity .17s ease-out,transform .19s cubic-bezier(.22,.8,.3,1)}
/* 进入态必须「瞬间」压黑：否则过渡到 0 的过程里老皮肤还是能被看到 */
main .hb-canvas.hb-route-enter{opacity:0;transform:translateY(7px);transition:none}
main .hb-canvas.hb-route-enter .hb-head,
main .hb-canvas.hb-route-enter .hb-stats{animation:none}
main .hb-head,main .hb-stats{animation:hbSkinRise .24s cubic-bezier(.22,.8,.3,1) both}
@keyframes hbSkinRise{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){
  main .hb-canvas{transition:none}
  main .hb-canvas.hb-route-enter{opacity:1;transform:none}
  main .hb-head,main .hb-stats{animation:none}
}