@charset "utf-8";
/* ============================================================
   hb-actions.css - 控制页动作区改版
   - 右侧：17 个常用动作竖排方块（跟着手机一起缩放）
   - 左侧：7 个次要动作折叠进「更多功能」卡片
   - 原底部 24 宫格整块隐藏（按钮已搬走）
   ============================================================ */

/* 原底部工具栏：高度塌成 0（不能 display:none！
   一键解锁 / 黑屏遮挡 / 系统更新 等弹窗是渲染在这组按钮内部的，
   整块隐藏会把弹窗一起藏掉） */
[data-hb-bar]{
  height:0 !important;min-height:0 !important;max-height:0 !important;
  padding:0 !important;margin:0 !important;border:0 !important;
  overflow:visible !important;background:transparent !important;box-shadow:none !important;
}
[data-hb-bar] > div:first-child{height:0 !important;min-height:0 !important;overflow:visible !important}
[data-hb-bar] > div:first-child > div{height:0 !important;min-height:0 !important;overflow:visible !important}
/* 只把原按钮本身藏掉，grid 容器保留（弹窗是它的兄弟节点） */
.hb-actions-src > button{display:none !important}

/* ---------- 右侧动作条 ---------- */
.hb-act{
  position:absolute;z-index:19;
  padding:0;margin:0;
}
.hb-act-grid{
  display:flex;flex-direction:column;gap:3px;
  padding:5px;
  border-radius:14px;
  background:rgba(255,255,255,.8);
  border:1px solid rgba(219,231,246,.95);
  box-shadow:0 18px 40px -30px rgba(12,18,34,.55),0 2px 8px -6px rgba(15,23,42,.2);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
}
.hb-act-btn{
  width:88px;height:34px;padding:0 4px;margin:0;
  display:inline-flex;align-items:center;justify-content:center;gap:4px;
  border-radius:8px;border:1px solid #dfe8f6;
  background:linear-gradient(180deg,#ffffff 0%,#f4f8fd 100%);
  color:#475569;font-size:9.5px;font-weight:600;line-height:1.1;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  cursor:pointer;
  box-shadow:0 1px 1px rgba(15,23,42,.04),inset 0 1px 0 rgba(255,255,255,.95);
  transition:transform .14s ease,border-color .14s ease,color .14s ease,background .14s ease,box-shadow .14s ease;
}
.hb-act-btn svg{width:14px;height:14px;flex:none;stroke-width:1.9;shape-rendering:geometricPrecision}
.hb-act-btn:hover{border-color:#bfd3ff;color:#1d4ed8;background:linear-gradient(180deg,#ffffff,#eef5ff);box-shadow:0 8px 16px -12px rgba(37,99,235,.75)}
.hb-act-btn:active{transform:scale(.95)}
.hb-act-btn:disabled{opacity:.45;cursor:default}

/* ---------- 方块版（大屏）：图标在上、文字在下，2 列 9 行 ---------- */
.hb-act.sq .hb-act-grid{
  display:grid;
  grid-template-columns:repeat(2,72px);
  gap:4px;padding:7px;border-radius:16px;
}
.hb-act.sq .hb-act-btn{
  width:72px;height:64px;padding:0 3px;
  flex-direction:column;justify-content:center;gap:4px;
  border-radius:11px;font-size:12px;font-weight:600;line-height:1.15;
  letter-spacing:.1px;color:#334155;
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
  text-rendering:geometricPrecision;
}
/* 图标放大 + 线宽补偿：SVG 从 15px 拉到 21px 后原来的细线会发虚 */
.hb-act.sq .hb-act-btn svg{
  width:22px;height:22px;flex:none;
  stroke-width:1.9;
  shape-rendering:geometricPrecision;
  overflow:visible;
}
.hb-act.sq .hb-act-btn span,
.hb-act.sq .hb-act-btn > *:not(svg){
  max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  font-size:inherit;line-height:inherit;
}

/* ---------- 左侧「更多功能」折叠卡 ---------- */
.hb-more{
  position:fixed;z-index:21;
  width:236px;
  background:#fff;
  border:1px solid #e6ecf7;
  border-radius:14px;
  box-shadow:0 20px 44px -34px rgba(12,18,34,.5),0 1px 2px rgba(12,18,34,.04);
  overflow:hidden;
}
.hb-more-head{
  display:flex;align-items:center;gap:7px;width:100%;
  height:36px;padding:0 10px;margin:0;
  border:0;border-radius:0;background:#fff;
  color:#0f1a33;font-size:12px;font-weight:700;cursor:pointer;
  transition:background .16s ease;
}
.hb-more-head:hover{background:#f7faff}
.hb-more.is-open .hb-more-head{background:linear-gradient(180deg,#f9fbff,#eef4ff);border-bottom:1px solid #eef3fb}
.hb-more-ico{width:15px;height:15px;color:#7c3aed;display:grid;place-items:center;flex:none}
.hb-more-ico svg{width:15px;height:15px}
.hb-more-title{flex:1;text-align:left;letter-spacing:.2px}
.hb-more-count{font-size:10px;font-weight:700;color:#7c3aed;background:#f3ecff;border-radius:999px;padding:2px 6px;line-height:1.2;flex:none}
.hb-more-chev{width:14px;height:14px;color:#8b97ab;display:grid;place-items:center;flex:none;transition:transform .26s cubic-bezier(.4,0,.2,1)}
.hb-more-chev svg{width:13px;height:13px}
.hb-more.is-open .hb-more-chev{transform:rotate(180deg)}
.hb-more-body{
  max-height:0;overflow:hidden;opacity:0;
  transition:max-height .3s cubic-bezier(.4,0,.2,1),opacity .2s ease;
  overscroll-behavior:contain;
}
.hb-more.is-open .hb-more-body{opacity:1}
.hb-more-body::-webkit-scrollbar{width:6px}
.hb-more-body::-webkit-scrollbar-thumb{background:#dfe6f2;border-radius:6px}
.hb-more-inner{padding:7px 8px 8px}
.hb-more-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px}
.hb-more-grid button{
  height:27px;padding:0 5px;margin:0;
  display:inline-flex;align-items:center;justify-content:center;gap:4px;
  border-radius:7px;border:1px solid #e3eafa;
  background:linear-gradient(180deg,#ffffff 0%,#f8fbff 100%);
  color:#3d4a61;font-size:11.5px;font-weight:600;line-height:1;
  -webkit-font-smoothing:antialiased;text-rendering:geometricPrecision;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  cursor:pointer;
}
.hb-more-grid button svg{width:13px;height:13px;flex:none;stroke-width:1.9}
.hb-more-grid button:hover{border-color:#cfc0ff;color:#6d28d9;background:#f7f2ff}
.hb-more-grid button:active{transform:scale(.96)}
.hb-more-grid button:disabled{opacity:.45;cursor:default}

/* 弹窗打开时收起浮层（弹窗渲染在 app 容器内，层级比这些自绘控件低） */
html.hb-modal-open .hb-act,
html.hb-modal-open .hb-more,
html.hb-modal-open .hb-quick,
html.hb-modal-open .hb-quick-aux,
html.hb-modal-open .hb-ctl-info,
html.hb-modal-open .hb-admgr{
  opacity:0 !important;
  pointer-events:none !important;
  transition:opacity .12s ease;
}
