/* ===== 全局基础样式（导航 / 卡片 / 按钮 / 表格 / 表单 / 弹窗） ===== */
* { margin: 0; padding: 0; box-sizing: border-box; }
/* 始终预留滚动条位置，避免页面切换时横向跳动 */
html { scrollbar-gutter: stable; }
body {
  font-family: "Microsoft YaHei", "微软雅黑", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  background: linear-gradient(135deg, #eef2ff 0%, #f5f3ff 50%, #fdf2f8 100%);
  background-attachment: fixed;
  color: #1f2937;
  min-height: 100vh;
  -webkit-font-smoothing: antialiased;
}

/* ===== 顶部导航：双行结构（第一行 品牌/模式开关/音效登录，第二行 页签居中），整体吸顶 ===== */
.topbar {
  position: sticky;
  top: 0;
  z-index: 100;
}
.navbar {
  position: relative;
  background: rgba(255,255,255,0.85);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  padding: 0 28px;
  display: flex;
  align-items: center;
  height: 64px;
  box-shadow: 0 1px 3px rgba(0,0,0,0.06), 0 1px 2px rgba(0,0,0,0.04);
}
/* 标题「抢答器」：靠左展示（顶部居中位置让给模式开关） */
.navbar .brand {
  display: flex;
  align-items: center;
  color: #1e293b;
  font-size: 19px;
  font-weight: 700;
  letter-spacing: 0.5px;
}
.navbar .brand-text { display: inline-flex; align-items: center; }
.navbar .brand-icon { margin-right: 8px; }
/* ===== 底部通栏贴底导航（不悬浮、铺满窗口宽度到底边）：图标在上、文字在下，选中态靠图标变化区分（无滑块） ===== */
.pagenav {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 90;
  background: rgba(255,255,255,0.94);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border-top: 1px solid rgba(0,0,0,0.06);
  box-shadow: 0 -2px 12px rgba(15,23,42,0.05);
  padding-bottom: env(safe-area-inset-bottom, 0px);   /* 全面屏手机避让底部指示条 */
}
.nav-tabs {
  position: relative;
  display: flex;
  align-items: stretch;
  max-width: 680px;
  margin: 0 auto;   /* 通栏背景下页签行居中，超宽屏幕不至于把页签拉得过宽 */
}
/* 滑块：紫色渐变药丸，JS 按激活页签位置弹性滑动（上下贴满导航栏边框，左右各内缩 4px 留呼吸空隙） */
.nav-slider {
  position: absolute;
  z-index: 0;
  top: 0;
  bottom: 0;
  left: 0;
  width: 0;
  border-radius: 16px;
  background: linear-gradient(135deg, #6366f1 0%, #8b5cf6 100%);
  box-shadow: 0 2px 10px rgba(99,102,241,0.35);
  pointer-events: none;
}
.nav-slider.animate {
  /* 弹性曲线与全站导航滑块同款（cubic-bezier(.34,1.56,.64,1)） */
  transition: left 0.34s cubic-bezier(0.34, 1.56, 0.64, 1), width 0.34s cubic-bezier(0.34, 1.56, 0.64, 1);
}
/* 页签：上下结构（大图标 + 文字），等分宽度 */
.nav-tab {
  position: relative;
  z-index: 1;
  flex: 1 1 0;
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 4px;
  padding: 10px 4px 9px;
  cursor: pointer;
  color: #94a3b8;
  user-select: none;
  transition: color 0.25s ease;
}
/* 图标：默认灰显（去色 + 半透明） */
.nav-tab-ico {
  width: 46px;
  height: 46px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  font-size: 25px;
  line-height: 1;
  filter: grayscale(1);
  opacity: 0.6;
  transition: filter 0.25s, opacity 0.25s, transform 0.28s cubic-bezier(0.34,1.56,0.64,1), background 0.25s, box-shadow 0.25s;
}
.nav-tab-txt {
  font-size: 13px;
  font-weight: 500;
  line-height: 1;
  white-space: nowrap;
  transition: color 0.25s;
}
/* 悬浮动效：图标恢复色彩并轻微上浮（弹性曲线与全站导航一致） */
.nav-tab:hover .nav-tab-ico { filter: grayscale(0.3); opacity: 0.95; transform: translateY(-1px); }
.nav-tab:hover .nav-tab-txt { color: #64748b; }
/* 点击动效：按下图标回弹 */
.nav-tab:active .nav-tab-ico { transform: scale(0.86); }
/* 选中态：滑块药丸滑动到位 + 图标改变（灰显→复色放大），文字白色加粗立于药丸上 */
.nav-tab.active .nav-tab-ico {
  filter: none;
  opacity: 1;
  transform: scale(1.06);
}
.nav-tab.active .nav-tab-txt { color: #fff; font-weight: 700; }

/* ===== 底部导航中央：快捷开始按钮（＋） ===== */
/* 页签中间的固定空位：给按钮留出落点，避免遮挡「抢答 / 题库」页签 */
.nav-fab-slot { flex: 0 0 64px; }
/* 按钮本体：水平居中 + 与导航栏上下居中对齐（绝对定位于通栏 .pagenav 容器内，顶层） */
.nav-fab {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 54px;
  height: 54px;
  border-radius: 50%;
  border: 3px solid #fff;
  background: linear-gradient(135deg, #6366f1 0%, #8b5cf6 100%);
  color: #fff;
  font-size: 26px;
  font-weight: 400;
  font-family: inherit;
  line-height: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  user-select: none;
  box-shadow: 0 6px 16px rgba(99,102,241,0.45), 0 2px 6px rgba(15,23,42,0.12);
  z-index: 95;
  /* 弹性曲线与导航滑块同款（悬浮上浮、按压回弹） */
  transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1), box-shadow 0.25s ease;
}
.nav-fab:hover {
  transform: translate(-50%, -50%) scale(1.08);
  box-shadow: 0 8px 20px rgba(99,102,241,0.55), 0 3px 7px rgba(15,23,42,0.15);
}
.nav-fab:active { transform: translate(-50%, -50%) scale(0.9); }

/* ===== 页面容器 ===== */
/* 页面底部加大内边距：为底部固定页签导航留出避让空间（导航高约 76 + 余量） */
.page { display: none; padding: 24px 24px 96px; max-width: none; margin: 0 auto; }
.page.active { display: block; }
.page-title {
  font-size: 24px;
  font-weight: 700;
  margin-bottom: 22px;
  color: #1e293b;
  padding-bottom: 14px;
  border-bottom: 1px solid rgba(0,0,0,0.06);
  letter-spacing: 0.3px;
}

/* ===== 卡片 ===== */
.card {
  background: rgba(255,255,255,0.9);
  backdrop-filter: blur(10px);
  border-radius: 16px;
  box-shadow: 0 1px 3px rgba(0,0,0,0.05), 0 4px 20px rgba(0,0,0,0.04);
  border: 1px solid rgba(255,255,255,0.8);
  padding: 24px;
  margin-bottom: 20px;
  transition: box-shadow 0.3s;
}
.card:hover { box-shadow: 0 2px 8px rgba(0,0,0,0.06), 0 8px 30px rgba(0,0,0,0.06); }
.card-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 20px;
  flex-wrap: wrap;
  gap: 12px;
}
.card-title {
  font-size: 17px;
  font-weight: 600;
  color: #1e293b;
  display: flex;
  align-items: center;
  gap: 8px;
}

/* ===== 按钮 ===== */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 9px 20px;
  border: none;
  border-radius: 10px;
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.22s cubic-bezier(0.4,0,0.2,1);
  font-family: inherit;
  white-space: nowrap;
  position: relative;
  overflow: hidden;
}
/* ===== 按钮光晕效果（仅周边光环，不带中心光）===== */
.btn:not(:disabled):hover {
  box-shadow: 0 0 0 1.5px var(--glow, rgba(99,102,241,0.5)),
              0 0 9px var(--glow, rgba(99,102,241,0.45)),
              0 0 18px var(--glow, rgba(99,102,241,0.25));
}
.btn:not(:disabled):active { transform: scale(0.955); }
/* 点击辉光：周边光环迸发后消散（无中心光） */
.btn-glowburst {
  position: absolute;
  inset: 0;
  border-radius: inherit;
  box-shadow: 0 0 10px var(--glow, rgba(255,255,255,0.5)),
              0 0 24px var(--glow, rgba(255,255,255,0.3));
  animation: btnGlowBurst 0.55s cubic-bezier(0.16, 1, 0.3, 1) forwards;
  pointer-events: none;
  z-index: 1;
}
@keyframes btnGlowBurst {
  0%   { opacity: 0.95; transform: scale(0.9); }
  100% { opacity: 0;    transform: scale(1.12); }
}
.btn-primary {
  --glow: rgba(139,92,246,0.55);
  background: linear-gradient(135deg, #6366f1 0%, #8b5cf6 100%);
  color: #fff;
  box-shadow: 0 2px 8px rgba(99,102,241,0.3);
}
.btn-primary:hover { transform: translateY(-1px); }
.btn-success { --glow: rgba(16,185,129,0.55); background: linear-gradient(135deg, #10b981 0%, #059669 100%); color: #fff; box-shadow: 0 2px 8px rgba(16,185,129,0.3); }
.btn-success:hover { transform: translateY(-1px); }
.btn-warn { --glow: rgba(245,158,11,0.55); background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%); color: #fff; box-shadow: 0 2px 8px rgba(245,158,11,0.3); }
.btn-warn:hover { transform: translateY(-1px); }
.btn-danger { --glow: rgba(239,68,68,0.55); background: linear-gradient(135deg, #ef4444 0%, #dc2626 100%); color: #fff; box-shadow: 0 2px 8px rgba(239,68,68,0.3); }
.btn-danger:hover { transform: translateY(-1px); }
.btn-default { --glow: rgba(100,116,139,0.4); background: #f1f5f9; color: #475569; border: 1px solid #e2e8f0; }
.btn-default:hover { background: #e2e8f0; color: #334155; }
.btn-ghost { --glow: rgba(99,102,241,0.45); background: transparent; color: #6366f1; border: 1.5px solid #c7d2fe; }
.btn-ghost:hover { background: #eef2ff; border-color: #a5b4fc; }
.btn-sm { padding: 5px 14px; font-size: 13px; border-radius: 8px; }
.btn:disabled { opacity: 0.5; cursor: not-allowed; transform: none; }
/* 符号旁置（居中文字通用）：固定宽度 + 负右外边距把符号宽度从布局中剥离，
   居中量算只算其后文字本体；符号仍画在文字左侧原位（答案框 ✅ / 居中提示语 ⚠️ 等用） */
.lead-sym {
  display: inline-block;
  width: 1.15em;
  text-align: center;
  margin-right: calc(-1.15em + 0.15em);
}

/* ===== 表格 ===== */
.table-wrap { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; font-size: 14px; }
th, td {
  padding: 13px 12px;
  text-align: left;
  border-bottom: 1px solid #f1f5f9;
}
th {
  background: #f8fafc;
  font-weight: 600;
  color: #475569;
  white-space: nowrap;
  font-size: 13px;
  letter-spacing: 0.3px;
}
tr { transition: background 0.15s; }
tr:hover { background: #f8fafc; }

/* ===== 音效开关 ===== */
.sound-toggle {
  margin-left: auto;
  color: #64748b;
  cursor: pointer;
  font-size: 20px;
  user-select: none;
  padding: 6px 12px;
  border-radius: 10px;
  transition: all 0.2s;
}
.sound-toggle:hover { background: #f1f5f9; color: #334155; }
.sound-toggle.off { opacity: 0.45; }

/* ===== 表单 ===== */
.form-group { margin-bottom: 16px; }
.form-label {
  display: block;
  margin-bottom: 6px;
  font-size: 14px;
  color: #555;
  font-weight: 500;
}
.form-label .req { color: #e53935; }
.form-input, .form-select, .form-textarea {
  width: 100%;
  padding: 10px 14px;
  border: 1.5px solid #e2e8f0;
  border-radius: 10px;
  font-size: 14px;
  font-family: inherit;
  transition: all 0.2s;
  background: #f8fafc;
}
.form-input:focus, .form-select:focus, .form-textarea:focus {
  outline: none;
  border-color: #818cf8;
  background: #fff;
  box-shadow: 0 0 0 3px rgba(129,140,248,0.15);
}
.form-textarea { resize: vertical; min-height: 60px; }
.form-row { display: flex; gap: 16px; flex-wrap: wrap; }
.form-row .form-group { flex: 1; min-width: 200px; }

/* ===== 弹窗 ===== */
.modal-mask {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(15,23,42,0.5);
  backdrop-filter: blur(6px);
  z-index: 999;
  align-items: center;
  justify-content: center;
  animation: fadeIn 0.2s;
}
.modal-mask.show { display: flex; }
.modal {
  position: relative;   /* 供右上角关闭按钮绝对定位 */
  background: #fff;
  border-radius: 18px;
  width: 90%;
  max-width: 600px;
  max-height: 88vh;
  overflow-y: auto;
  padding: 28px;
  box-shadow: 0 25px 50px -12px rgba(0,0,0,0.25);
  animation: modalIn 0.28s cubic-bezier(0.4,0,0.2,1);
}
@keyframes modalIn {
  from { opacity: 0; transform: translateY(16px) scale(0.97); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}
@keyframes fadeIn { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: translateY(0); } }
.modal-title {
  font-size: 19px;
  font-weight: 700;
  margin-bottom: 22px;
  padding-bottom: 16px;
  border-bottom: 1px solid #f1f5f9;
  color: #1e293b;
}
/* 弹窗右上角关闭按钮：悬浮放大+旋转、点击缩小（与大屏控制按钮同款动画） */
.modal-close {
  position: absolute;
  top: 16px;
  right: 16px;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  border: 1px solid #e2e8f0;
  background: #f8fafc;
  color: #64748b;
  font-size: 15px;
  line-height: 1;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  user-select: none;
  transition: background 0.2s, box-shadow 0.25s, color 0.2s, transform 0.28s cubic-bezier(0.34, 1.4, 0.5, 1);
  z-index: 5;
}
.modal-close:hover {
  background: #eef2ff;
  color: #4f46e5;
  border-color: #c7d2fe;
  box-shadow: 0 0 0 1.5px rgba(99,102,241,0.35), 0 0 12px rgba(99,102,241,0.25);
  transform: scale(1.15) rotate(90deg);
}
.modal-close:active { transform: scale(0.88) rotate(90deg); }
/* 带固定关闭按钮的弹窗：外层不滚动，标题+关闭按钮固定头部，内容区滚动 */
.modal-fixed-close { padding: 0; overflow: hidden; max-height: 88vh; display: flex; flex-direction: column; }
.modal-fixed-close .modal-title { margin: 0; padding: 28px 28px 16px; flex-shrink: 0; }
/* 固定关闭按钮弹窗的底部按钮区：外层无内边距，左右/底部单独留白（取消+确定右对齐） */
.modal-fixed-close .modal-footer { margin-top: 8px; padding: 14px 28px 22px; }
.modal-fixed-close .modal-inner-scroll {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  padding: 22px 28px 28px;
  width: 100%;
}
.modal-footer {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  margin-top: 20px;
  padding-top: 16px;
  border-top: 1px solid #f1f5f9;
}
.radio-group { display: flex; gap: 20px; flex-wrap: wrap; }
.radio-group label { display: flex; align-items: center; gap: 5px; cursor: pointer; }

/* ===== 快捷开始弹窗（底部导航中央 ＋） ===== */
/* 步骤1：模式选择卡片 */
.quick-choose { display: flex; gap: 14px; }
.quick-opt {
  flex: 1;
  border: 1.5px solid #e2e8f0;
  border-radius: 14px;
  padding: 24px 12px 20px;
  text-align: center;
  cursor: pointer;
  background: #f8fafc;
  user-select: none;
  transition: all 0.2s;
}
.quick-opt:hover {
  border-color: #a5b4fc;
  background: #eef2ff;
  transform: translateY(-2px);
  box-shadow: 0 6px 16px rgba(99,102,241,0.12);
}
.quick-opt:active { transform: scale(0.96); }
.quick-opt-ico { font-size: 34px; margin-bottom: 8px; }
.quick-opt-name { font-size: 17px; font-weight: 700; color: #1e293b; margin-bottom: 6px; }
.quick-opt-desc { font-size: 12.5px; color: #94a3b8; line-height: 1.6; }
/* 顶部返回链接 */
.quick-back {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  color: #6366f1;
  font-size: 13.5px;
  font-weight: 600;
  cursor: pointer;
  margin-bottom: 14px;
  user-select: none;
}
.quick-back:hover { opacity: 0.75; }
/* 说明文字 */
.quick-tip { font-size: 12.5px; color: #94a3b8; line-height: 1.6; }
/* 步骤2：列表行（复用 act-row 行样式，右侧行动按钮） */
.quick-go {
  flex-shrink: 0;
  border: none;
  border-radius: 999px;
  padding: 9px 20px;
  font-size: 13.5px;
  font-weight: 700;
  font-family: inherit;
  color: #fff;
  cursor: pointer;
  background: linear-gradient(135deg, #6366f1 0%, #8b5cf6 100%);
  box-shadow: 0 2px 8px rgba(99,102,241,0.3);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: transform 0.18s, box-shadow 0.2s;
}
.quick-go:hover { transform: translateY(-1px); box-shadow: 0 4px 12px rgba(99,102,241,0.4); }
.quick-go:active { transform: scale(0.93); }
/* 进行中 → 绿色「继续」 */
.quick-go.continue { background: linear-gradient(135deg, #10b981 0%, #059669 100%); box-shadow: 0 2px 8px rgba(16,185,129,0.3); }
.quick-go.continue:hover { box-shadow: 0 4px 12px rgba(16,185,129,0.4); }
/* 列表底部的新建按钮 */
.quick-new-btn { width: 100%; margin-top: 6px; }
/* 列表滚动容器：超过 5 行时 JS 按实际行高限制可视高度为 5 行，其余滚动查看（列表按创建时间倒序） */
.quick-list { overflow-y: auto; padding-right: 4px; }
.quick-list::-webkit-scrollbar { width: 8px; }
.quick-list::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 8px; }
.quick-list::-webkit-scrollbar-thumb:hover { background: #94a3b8; }
.quick-list::-webkit-scrollbar-track { background: transparent; }
/* 列表行的进入详情指示箭头 */
.quick-row-go { color: #94a3b8; font-size: 20px; font-weight: 700; padding: 0 4px; line-height: 1; }
/* 详情视图：房间/场次信息卡 */
.quick-detail-card {
  border: 1px solid #e2e8f0; border-radius: 12px;
  padding: 14px 16px; margin-bottom: 12px; background: #f8fafc;
}
.quick-detail-card .act-name { font-size: 17px; }
/* 详情视图：进行中卡（继续按钮） */
.quick-run-card {
  display: flex; align-items: center; gap: 14px;
  border: 1px solid #a7f3d0; background: #f0fdf4; border-radius: 12px;
  padding: 14px 16px; margin-bottom: 12px;
}
.qrc-main { flex: 1; min-width: 0; }
.qrc-name { font-size: 15.5px; font-weight: 700; color: #1e293b; margin-bottom: 4px; }
.qrc-sub { font-size: 12.5px; color: #64748b; }
/* 离线提示 */
.quick-offline { text-align: center; padding: 26px 0 10px; }
.quick-offline-ico { font-size: 40px; margin-bottom: 12px; }
.quick-offline-text { font-size: 14px; color: #64748b; line-height: 1.8; margin-bottom: 16px; }
.quick-loading { text-align: center; color: #94a3b8; font-size: 14px; padding: 40px 0; }

/* ===== 空状态（题库表格 / 抢答大屏共用） ===== */
.empty-state {
  text-align: center;
  color: #999;
  padding: 60px 20px;
}
.empty-state .icon { font-size: 56px; margin-bottom: 16px; }

/* 工具类 */
.flex { display: flex; }
.gap-8 { gap: 8px; }
.mb-16 { margin-bottom: 16px; }
.text-right { text-align: right; }

/* 响应式 */
@media (max-width: 768px) {
  /* 窄屏不再压缩顶栏尺寸：导航统一走「设计稿 × 0.85」恒定缩放（见文件末尾「导航独立层」），仅保留安全区避让 */
  /* 顶部安全区：viewport-fit=cover 下避让 iPhone 刘海/状态栏（白底随高度延伸覆盖） */
  .navbar { padding: 0 12px; height: calc(64px + env(safe-area-inset-top, 0px)); padding-top: env(safe-area-inset-top, 0px); }
  /* 手机界面底部预留：安全区之外再固定加 12px，避开系统手势条/浏览器底栏，防止点页签时误触 */
  .pagenav { padding-bottom: calc(env(safe-area-inset-bottom, 0px) + 12px); }
  /* 页面避让同步加大：固定导航变高后内容不被遮挡（桌面端仍为 96px） */
  .page { padding-bottom: calc(96px + env(safe-area-inset-bottom, 0px) + 12px); }
  /* ＋按钮与页签行保持垂直居中（抵消导航底部新增的预留内边距） */
  .nav-fab { top: calc(50% - (12px + env(safe-area-inset-bottom, 0px)) / 2); }
  /* 大屏字号不做窄屏覆盖：统一走设置字号 × --scr-scale（占比恒定缩放），断点两侧连续 */
}

/* ===== 导航独立层：顶部/底部导航固定 85% 视觉尺寸 =====
   不随窗口宽度变化（上面 ≤768px 媒体查询已不再压缩导航尺寸），
   也不受大屏缩放倍率影响（sc/--fscale 只写在 #screen-stage 上，导航在其外、CSS 变量不可达）。
   用 transform: scale 实现（跨引擎行为一致、getBoundingClientRect 可直接量出 54.4px）：
   宽度放大 100/0.85 ≈ 117.647% 再整体缩 0.85 → 视觉恰好铺满窗口宽度；
   顶栏 64px → 视觉 54.4px 恒定，负 margin 收回 9.6px 占位；底栏贴底锚点 left bottom */
.navbar {
  transform: scale(0.85);
  transform-origin: top left;
  width: 117.647%;
  margin-bottom: -9.6px;
}
.pagenav {
  transform: scale(0.85);
  transform-origin: left bottom;
  width: 117.647%;
}

/* ===== 题库多选组件（bankPicker：搜索 + 无上限多选） ===== */
.bp-root { position: relative; }
.bp-box {
  display: flex; align-items: center; gap: 8px;
  border: 1px solid #cbd5e1; border-radius: 10px;
  background: #fff; padding: 8px 12px; cursor: pointer; min-height: 42px;
  transition: border-color .15s, box-shadow .15s;
}
.bp-box:hover { border-color: #6366f1; }
.bp-root.open .bp-box { border-color: #6366f1; box-shadow: 0 0 0 3px rgba(99,102,241,.15); }
.bp-summary { flex: 1; display: flex; flex-wrap: wrap; gap: 6px; align-items: center; min-width: 0; }
.bp-ph { color: #94a3b8; font-size: 14px; }
.bp-pill {
  background: #eef2ff; color: #4f46e5; border: 1px solid #c7d2fe;
  border-radius: 999px; padding: 2px 10px; font-size: 12.5px; max-width: 140px;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.bp-pill.bp-more { background: #f1f5f9; color: #475569; border-color: #cbd5e1; }
.bp-count { color: #64748b; font-size: 12px; margin-left: 2px; }
.bp-caret { color: #94a3b8; transition: transform .2s; flex-shrink: 0; }
.bp-root.open .bp-caret { transform: rotate(180deg); }
.bp-drop {
  display: none; position: absolute; left: 0; right: 0; top: calc(100% + 6px);
  background: #fff; border: 1px solid #e2e8f0; border-radius: 12px;
  box-shadow: 0 12px 32px rgba(15,23,42,.18); z-index: 80; overflow: hidden;
}
.bp-root.open .bp-drop { display: block; }
.bp-searchbox { padding: 10px; border-bottom: 1px solid #f1f5f9; }
.bp-searchbox input {
  width: 100%; padding: 8px 12px; border: 1px solid #e2e8f0; border-radius: 8px;
  font-size: 13.5px; outline: none; background: #f8fafc;
}
.bp-searchbox input:focus { border-color: #6366f1; background: #fff; }

/* ===== 管理端登录门槛（未登录管理员/超管账号前全屏拦截） ===== */
#admin-gate {
  position: fixed; inset: 0; z-index: 100000; display: none;
  align-items: center; justify-content: center;
  padding: calc(24px + env(safe-area-inset-top, 0px)) 24px calc(24px + env(safe-area-inset-bottom, 0px));
  background: linear-gradient(135deg, #0355c1 0%, #04307d 55%, #061e45 100%);
}
#admin-gate .admin-gate-card {
  width: min(400px, 100%); background: #fff; border-radius: 18px;
  padding: 30px 30px 24px; box-shadow: 0 24px 80px rgba(0,0,0,.45);
}
.admin-gate-ico { font-size: 34px; text-align: center; line-height: 1; }
.admin-gate-brand {
  font-size: 21px; font-weight: 800; color: #0f172a;
  text-align: center; margin-top: 10px; letter-spacing: 1px;
}
.admin-gate-sub { font-size: 13.5px; color: #64748b; text-align: center; margin: 8px 0 20px; }
.admin-gate-btn { width: 100%; margin-top: 6px; font-size: 15px; padding: 11px 0; }
.admin-gate-err {
  margin-top: 12px; background: #fef2f2; border: 1px solid #fecaca; color: #dc2626;
  border-radius: 10px; padding: 9px 12px; font-size: 13px; line-height: 1.6;
}
.admin-gate-hint {
  margin-top: 16px; font-size: 12.5px; color: #94a3b8;
  text-align: center; line-height: 1.8;
}
.bp-list { max-height: 240px; overflow-y: auto; padding: 6px; }
.bp-list::-webkit-scrollbar { width: 8px; }
.bp-list::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 8px; }
.bp-item {
  display: flex; align-items: center; gap: 10px; padding: 9px 10px;
  border-radius: 8px; cursor: pointer; font-size: 13.5px;
}
.bp-item:hover { background: #f1f5f9; }
.bp-item.on { background: #eef2ff; }
.bp-item input { accent-color: #6366f1; width: 16px; height: 16px; flex-shrink: 0; }
.bp-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #1e293b; }
.bp-cnt { color: #94a3b8; font-size: 12px; flex-shrink: 0; }
.bp-empty { padding: 18px 0; text-align: center; color: #94a3b8; font-size: 13px; }