/* ==========================================================================
   嘉消战系统 · 指挥中心主题（视觉覆盖层）
   --------------------------------------------------------------------------
   这是叠加在 frontend/dist 构建产物之上的样式覆盖层，不是前端源码的一部分。
   前端一旦重新构建并覆盖 dist，本文件的引用会丢失，需要重新在 index.html
   里挂上，或（更好）把这里的设计 token 搬进前端源码。

   作用范围限定在顶部导航 .nav、队站首页 .db 两棵子树，以及首页自己的
   两个弹窗（class="dlg-personnel"，见文末一节）。其余页面（人员管理、车辆
   调整等）与其它 el-dialog 保持原样，避免在无法逐页验证的情况下破坏
   Element Plus 组件。

   dist 里的原样式是 Vue scoped 样式，选择器形如 .db-header[data-v-xxxxxxx]，
   特异度 (0,2,0)。这里统一用 #app 前缀把特异度抬到 (1,x,0) 稳定压过，
   既不依赖那个会随构建变化的 hash，也不用满屏 !important。
   ========================================================================== */

:root {
  /* 飞行甲板分层：靠亮度递进，不靠重阴影和彩光 */
  --cc-bg-0: #0e141f;
  --cc-bg-1: #121a28;
  --cc-bg-2: #182233;

  --cc-panel: rgba(255, 255, 255, 0.035);
  --cc-panel-hi: rgba(255, 255, 255, 0.055);
  --cc-line: rgba(180, 196, 220, 0.12);
  --cc-line-soft: rgba(180, 196, 220, 0.07);

  --cc-text: #e8eef8;
  --cc-text-dim: #b4c0d4;
  --cc-text-mute: #7d8ba3;

  --cc-red: #e85d6a;
  --cc-red-deep: #c42a3c;
  --cc-gold: #d4b46a;
  --cc-green: #3ecf86;
  --cc-blue: #5b9be8;
  --cc-orange: #e09a45;

  --cc-shadow: none;
  --cc-shadow-lg: none;
}

/* ---------- 全局底 ---------- */

#app {
  background: var(--cc-bg-0);
}

/* 深色页面下让滚动条也跟着走，否则右侧会留一条刺眼的白条。
   element 全局写了 * { scrollbar-color: #c1c1c1 #f1f1f1 }，这里整体改成深色细条、透明轨道 */
html, body,
#app, #app *,
.el-overlay, .el-overlay *,
.el-popper, .el-popper * {
  scrollbar-width: thin;
  scrollbar-color: rgba(180, 196, 220, .22) transparent;
}
#app .db ::-webkit-scrollbar { width: 8px; height: 8px; }
#app .db ::-webkit-scrollbar-track { background: transparent; }
#app .db ::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, .12);
  border-radius: 4px;
}
#app .db ::-webkit-scrollbar-thumb:hover { background: rgba(255, 255, 255, .2); }

/* ==========================================================================
   顶部导航
   ========================================================================== */

#app .nav {
  height: 56px;
  padding: 0 28px;
  background: rgba(10, 14, 22, .88);
  border-bottom: 1px solid var(--cc-line);
  box-shadow: none;
  backdrop-filter: blur(16px);
}

/* 顶栏下沿一道极细的红金渐变，是整套视觉的"签名" */
#app .nav::after {
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: -1px;
  height: 1px;
  background: linear-gradient(90deg,
    transparent 0%,
    rgba(217, 32, 56, .5) 18%,
    rgba(246, 196, 83, .55) 50%,
    rgba(217, 32, 56, .5) 82%,
    transparent 100%);
  pointer-events: none;
}

#app .nav__logo-img {
  width: 30px;
  height: 30px;
  filter: drop-shadow(0 0 8px rgba(255, 77, 94, .45));
}

#app .nav__logo-text {
  font-size: 17px;
  letter-spacing: 3px;
  background: linear-gradient(135deg, #ffffff 0%, #cfe0ff 55%, #9db8e8 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

#app .nav__item {
  color: var(--cc-text-dim);
  font-size: 13px;
  letter-spacing: .5px;
  border-radius: 8px;
  padding: 7px 16px;
  position: relative;
  transition: color .18s ease, background .18s ease;
}

#app .nav__item:hover {
  color: var(--cc-text);
  background: rgba(255, 255, 255, .06);
}

#app .nav__item.active {
  color: #fff;
  background: linear-gradient(180deg, rgba(255, 77, 94, .22), rgba(255, 77, 94, .10));
  box-shadow: inset 0 0 0 1px rgba(255, 77, 94, .35);
  font-weight: 600;
}

/* 选中项底部的小高亮，替代原来单调的蓝底 */
#app .nav__item.active::after {
  content: "";
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: -1px;
  width: 22px;
  height: 2px;
  border-radius: 2px;
  background: var(--cc-red);
  box-shadow: 0 0 10px var(--cc-red);
}

#app .nav__user-trigger {
  border-radius: 9px;
  padding: 6px 12px;
  border: 1px solid transparent;
  transition: background .18s ease, border-color .18s ease;
}

#app .nav__user-trigger:hover {
  background: rgba(255, 255, 255, .06);
  border-color: var(--cc-line);
}

#app .nav__username { color: var(--cc-text); }
#app .nav__arrow { color: var(--cc-text-mute); }
#app .nav__user-trigger:hover .nav__arrow { color: var(--cc-text-dim); }

#app .nav__role {
  background: linear-gradient(135deg, rgba(246, 196, 83, .22), rgba(246, 196, 83, .10));
  color: var(--cc-gold);
  box-shadow: inset 0 0 0 1px rgba(246, 196, 83, .3);
  letter-spacing: .5px;
}

/* ==========================================================================
   首页容器
   ========================================================================== */

#app .db {
  color: var(--cc-text);
  background-color: var(--cc-bg-0);
  background-image:
    linear-gradient(rgba(180, 196, 220, .035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(180, 196, 220, .035) 1px, transparent 1px),
    radial-gradient(900px 380px at 50% -12%, rgba(196, 42, 60, .07), transparent 58%),
    linear-gradient(180deg, var(--cc-bg-1) 0%, var(--cc-bg-0) 100%);
  background-size: 48px 48px, 48px 48px, auto, auto;
  background-attachment: fixed;
}

/* ---------- 标语条 ---------- */

/* 原版把标语用 position:absolute + left:50% 居中，标语一长就会顶到右侧时钟上
   （实测两者只差 2px）。这里改成真正的三栏网格，列之间不可能重叠。 */
#app .db-header {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 20px;
  padding: 12px 28px;
  background: rgba(14, 20, 31, .55);
  border-bottom: 1px solid var(--cc-line);
  backdrop-filter: blur(14px);
}

#app .db-header__left {
  flex: none;
  justify-self: start;
}

#app .db-header__center {
  position: static;
  left: auto;
  transform: none;
  justify-self: center;
}

#app .db-header__right { justify-self: end; }

#app .db-station {
  font-size: 15px;
  letter-spacing: 1.5px;
  color: var(--cc-text);
  display: flex;
  align-items: center;
  gap: 9px;
}

#app .db-station::before { display: none; }

/* 十六字誓词：整套设计的视觉主角 */
#app .db-motto {
  font-size: 18px;
  font-weight: 700;
  letter-spacing: 10px;
  text-indent: 10px;
  white-space: nowrap;
  color: #d8c49a;
  background: none;
  -webkit-text-fill-color: #d8c49a;
  filter: none;
}

#app .db-time {
  font-size: 22px;
  font-weight: 400;
  color: #f2f6ff;
  letter-spacing: 1.5px;
  font-variant-numeric: tabular-nums;
  font-family: ui-monospace, "SF Mono", "Menlo", "Consolas", monospace;
  text-shadow: none;
}

#app .db-date {
  font-size: 11.5px;
  color: var(--cc-text-mute);
  letter-spacing: .6px;
}

#app .db-live {
  background: rgba(62, 207, 134, .08);
  border: 1px solid rgba(62, 207, 134, .28);
  color: #7ed9a8;
  border-radius: 4px;
  padding: 4px 10px;
  letter-spacing: 1.2px;
  box-shadow: none;
}

#app .db-live__dot {
  background: #3ecf86;
  box-shadow: none;
}

#app .db-back-btn {
  background: linear-gradient(135deg, rgba(255, 77, 94, .18), rgba(255, 77, 94, .07));
  border: 1px solid rgba(255, 77, 94, .32);
  color: #ff8b96;
  border-radius: 8px;
}

#app .db-back-btn:hover {
  background: rgba(255, 77, 94, .26);
  color: #fff;
}

#app .db-body { padding: 18px 24px 22px; gap: 18px; }

/* ==========================================================================
   KPI 卡片
   ========================================================================== */

/* 原样式是 flex:1 等分，但 flex-basis:0 时外框最小也得是 padding+border，
   四张图标卡右侧留了 104px，在位率卡就会被挤成最窄的一张。改成 grid 等分外框。 */
#app .db-kpis {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 14px;
}

#app .kpi {
  position: relative;
  box-sizing: border-box;   /* 五张卡 flex:1 等分的是外框宽度，而不是扣掉各自 padding 之后的内容宽 */
  min-width: 0;
  padding: 16px 104px 16px 20px;
  border-radius: 8px;
  background: #161e2d;
  border: 1px solid var(--cc-line);
  box-shadow: none;
  overflow: hidden;
  cursor: pointer;
  transition: transform .2s cubic-bezier(.2, .7, .3, 1),
              border-color .2s ease,
              background-color .2s ease,
              box-shadow .2s ease;
}

#app .kpi::before { display: none; }

#app .kpi::after { display: none; }

/* KPI 动态图标：Freepik「Emergency Brigade」Lineal Color（透明动态 WebP，自带动画） */
#app .kpi__ico {
  position: absolute;
  top: 50%;
  right: 14px;
  width: 80px;
  height: 80px;
  margin-top: -40px;
  pointer-events: none;
}

#app .kpi__ico img {
  display: block;
  width: 80px;
  height: 80px;
  object-fit: contain;
  filter: drop-shadow(0 4px 10px rgba(0, 0, 0, .35));
  transition: transform .25s cubic-bezier(.2, .7, .3, 1);
}

#app .kpi:hover .kpi__ico img { transform: translateY(-2px) scale(1.08); }

/* 警灯图形矮而宽，等边框里显小，单独放大一点（要排在通用 hover 规则之后） */
#app .kpi--orange .kpi__ico img { transform: scale(1.18); }
#app .kpi--orange:hover .kpi__ico img { transform: translateY(-2px) scale(1.27); }

/* Flaticon 免费授权的署名行。.db 高 100vh 且从导航栏下方开始，底部 56px 被裁掉，
   所以按视口定位，贴在右下角面板的空白区里。 */
#app .db-credit {
  position: fixed;
  right: 30px;
  bottom: 8px;
  z-index: 5;
  font-size: 11px;
  line-height: 1;
  letter-spacing: .2px;
  color: rgba(138, 151, 173, .5);
}

#app .db-credit a {
  color: inherit;
  text-decoration: none;
}

#app .db-credit a:hover { color: rgba(200, 211, 230, .9); }

/* 悬停：卡片微抬、边框染成本卡的主色、投一层同色淡影；按下回落 */
#app .kpi:hover {
  transform: translateY(-2px);
  background: #192335;
  border-color: rgba(210, 224, 255, .3);
  border-color: color-mix(in srgb, var(--kpi-accent) 55%, transparent);
  box-shadow: 0 12px 28px -16px color-mix(in srgb, var(--kpi-accent) 75%, transparent),
              inset 0 1px 0 rgba(255, 255, 255, .05);
}

#app .kpi:active {
  transform: translateY(0) scale(.995);
  transition-duration: .08s;
}

@keyframes cc-kpi-in {
  from { opacity: 0; transform: translateY(5px); }
  to { opacity: 1; transform: none; }
}

/* 数值变化时轻微放大一下 */
@keyframes cc-kpi-bump {
  0%   { transform: scale(1); }
  35%  { transform: scale(1.09); }
  100% { transform: scale(1); }
}

#app .kpi--green  { --kpi-accent: var(--cc-green); }
#app .kpi--orange { --kpi-accent: var(--cc-orange); }
#app .kpi--blue   { --kpi-accent: var(--cc-blue); }

/* 总人数没有颜色修饰类，夹在四张彩色卡里会显得发灰。
   它是首要指标，给消防红并稍作强调。 */
#app .db-kpis > .kpi:first-child { --kpi-accent: var(--cc-red); }

/* 数字：放大、染成本卡主色（掺白提亮），后面跟一个小单位 */
#app .kpi__num {
  display: flex;
  align-items: baseline;
  gap: 6px;
  font-size: 42px;
  font-weight: 750;
  line-height: 1;
  letter-spacing: -.8px;
  font-variant-numeric: tabular-nums;
  font-family: ui-monospace, "SF Mono", "Menlo", "Consolas", monospace;
  color: #f4f7fc;
  color: color-mix(in srgb, var(--kpi-accent) 72%, #fff);
  text-shadow: none;
  transform-origin: left center;
  transition: color .2s ease, text-shadow .2s ease;
  /* 入场由卡片的 cc-rise 和 JS 数字滚动负责；这里不再叠动画，
     否则 .is-bump 结束后 animation 回切会把淡入重放一遍 */
}

#app .kpi__num::after {
  content: "人";
  font: 500 13px/1 -apple-system, "PingFang SC", "Microsoft YaHei", system-ui, sans-serif;
  letter-spacing: 1px;
  color: var(--cc-text-mute);
  transition: color .2s ease;
}

#app .kpi--blue .kpi__num::after { content: "辆"; }

#app .kpi:hover .kpi__num {
  color: color-mix(in srgb, var(--kpi-accent) 55%, #fff);
  text-shadow: 0 0 22px color-mix(in srgb, var(--kpi-accent) 55%, transparent);
}

#app .kpi:hover .kpi__num::after { color: var(--cc-text-dim); }

#app .kpi__num.is-bump,
#app .kpi-rate__text.is-bump { animation: cc-kpi-bump .6s cubic-bezier(.2, .8, .3, 1); }

@media (prefers-reduced-motion: reduce) {
  #app .kpi__num.is-bump,
  #app .kpi-rate__text.is-bump { animation: none; }
}

/* 标签：提亮、拉开字距；悬停时右侧浮出"查看明细 ›"，提示这张卡能点 */
#app .kpi__label {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  color: var(--cc-text-dim);
  letter-spacing: 2px;
  margin-top: 9px;
  white-space: nowrap;
  transition: color .2s ease;
}

#app .kpi:hover .kpi__label { color: var(--cc-text); }

#app .kpi__label::after,
#app .kpi-rate__label::after {
  content: "查看明细 ›";
  font-size: 11px;
  letter-spacing: .5px;
  color: var(--kpi-accent);
  opacity: 0;
  transform: translateX(-6px);
  transition: opacity .2s ease, transform .22s cubic-bezier(.2, .7, .3, 1);
}

#app .kpi:hover .kpi__label::after,
#app .kpi-rate:hover .kpi-rate__label::after {
  opacity: 1;
  transform: none;
}

/* ---------- 在位率仪表 ----------
   Vue 只画了一个细圆环。dash-fix 在 .kpi-rate__ring 里另画一只 270° 仪表
   （svg.cc-gauge：轨道、刻度、80% 目标标、渐变弧、发光端点），把百分数放大
   成 .cc-rate__num 摆在右侧，环心 .cc-gauge__center 放"在位/总数"。
   原 svg 和 .kpi-rate__text 隐掉但留在 DOM：数字滚动仍写在原文字上，仪表跟着走。
   状态色走 [data-cc-state=warn|good]（dash-fix 按 80% 目标判定），不碰 Vue 的 class。
   注意：不要给 <svg>/path 加 CSS filter，Chromium 会按矩形 bbox 做滤镜。 */

#app .kpi-rate {
  --kpi-accent: var(--cc-gold);
  --rate-num: #f3d58a;
  --rate-cap: #ffe8b0;
  position: relative;
  box-sizing: border-box;
  display: grid;
  grid-template-columns: 76px minmax(0, 1fr);
  grid-template-rows: auto auto auto;
  gap: 0 16px;              /* 原样式的 gap:12px 会连带 row-gap，这里显式归零 */
  align-items: center;
  padding: 12px 20px 12px 18px;
  border-radius: 8px;
  background: #161e2d;
  border: 1px solid var(--cc-line);
  box-shadow: none;
  flex: 1;
  min-width: 200px;
  overflow: hidden;
  cursor: pointer;
  transition: transform .2s cubic-bezier(.2, .7, .3, 1),
              border-color .2s ease,
              background-color .2s ease,
              box-shadow .2s ease;
}

#app .kpi-rate[data-cc-state="good"] {
  --kpi-accent: var(--cc-green);
  --rate-num: #8ae9b9;
  --rate-cap: #d8ffea;
}

#app .kpi-rate::before { display: none; }

#app .kpi-rate:hover {
  transform: translateY(-2px);
  background: #192335;
  border-color: rgba(210, 224, 255, .3);
  border-color: color-mix(in srgb, var(--kpi-accent) 55%, transparent);
  box-shadow: 0 12px 28px -16px color-mix(in srgb, var(--kpi-accent) 75%, transparent),
              inset 0 1px 0 rgba(255, 255, 255, .05);
}

#app .kpi-rate:active {
  transform: translateY(0) scale(.995);
  transition-duration: .08s;
}

/* 表盘容器：原来是裁成圆的 68px 小环，现在放大并允许刻度露在弧外 */
#app .kpi-rate__ring {
  position: relative;
  grid-column: 1;
  grid-row: 1 / 4;
  width: 76px;
  height: 76px;
  flex-shrink: 0;
  border-radius: 0;
  overflow: visible;
  background: transparent !important;
  box-shadow: none;
  filter: none !important;
}

/* Vue 原来的圆环和环心文字：隐藏但保留 */
#app .kpi-rate__ring > svg:not(.cc-gauge) { display: none !important; }
#app .kpi-rate__text { display: none !important; }

#app .kpi-rate__ring svg.cc-gauge {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  overflow: visible;
  transform: none;
  background: none !important;
  filter: none !important;
}

#app .cc-gauge__track {
  fill: none;
  stroke: rgba(255, 255, 255, .075);
  stroke-width: 6.5;
  stroke-linecap: round;
}

#app .cc-gauge__tick {
  stroke: rgba(180, 196, 220, .28);
  stroke-width: 1.2;
  stroke-linecap: round;
}

#app .cc-gauge__tick.is-major {
  stroke: rgba(180, 196, 220, .5);
  stroke-width: 1.6;
}

/* 80% 目标标：一枚指向弧线的小三角 */
#app .cc-gauge__goal {
  fill: rgba(232, 238, 248, .85);
}

/* 渐变描边由 dash-fix 按状态写在 stroke 属性上（url(#ccGaugeWarn|Good)），
   外链 CSS 里的 url(#id) 在 SPA 路由下解析不稳，不在这里写 */
#app .cc-gauge__fill {
  fill: none;
  stroke-width: 6.5;
  stroke-linecap: round;
}

#app .cc-gauge__halo {
  fill: var(--rate-cap);
  opacity: .22;
}

#app .cc-gauge__cap {
  fill: var(--rate-cap);
  stroke: rgba(14, 20, 31, .9);
  stroke-width: 1.4;
}

/* 环心：在位 / 总数 */
#app .cc-gauge__center {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -46%);
  font-size: 11.5px;
  font-weight: 600;
  letter-spacing: .3px;
  line-height: 1;
  font-variant-numeric: tabular-nums;
  font-family: ui-monospace, "SF Mono", "Menlo", "Consolas", monospace;
  color: var(--cc-text-dim);
  white-space: nowrap;
  pointer-events: none;
}

/* 右侧三行：标签 / 大百分数 / 状态行 */
#app .kpi-rate__label {
  grid-column: 2;
  grid-row: 1;
  align-self: end;
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  color: var(--cc-text-dim);
  letter-spacing: 2px;
  white-space: nowrap;
  transition: color .2s ease;
}

#app .kpi-rate:hover .kpi-rate__label { color: var(--cc-text); }

#app .cc-rate__num {
  grid-column: 2;
  grid-row: 2;
  margin: 4px 0 3px;
  font-size: 30px;
  font-weight: 750;
  line-height: 1;
  letter-spacing: -.6px;
  font-variant-numeric: tabular-nums;
  font-family: ui-monospace, "SF Mono", "Menlo", "Consolas", monospace;
  color: var(--rate-num);
  transform-origin: left center;
  white-space: nowrap;
  transition: color .3s ease, text-shadow .2s ease;
}

#app .kpi-rate:hover .cc-rate__num {
  text-shadow: 0 0 22px color-mix(in srgb, var(--kpi-accent) 55%, transparent);
}

#app .cc-rate__num.is-bump { animation: cc-kpi-bump .6s cubic-bezier(.2, .8, .3, 1); }

#app .cc-rate__sub {
  grid-column: 2;
  grid-row: 3;
  align-self: start;
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  letter-spacing: .6px;
  color: var(--cc-text-mute);
  white-space: nowrap;
}

#app .cc-rate__dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--kpi-accent);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--kpi-accent) 22%, transparent);
  flex-shrink: 0;
}

#app .cc-rate__state { color: var(--kpi-accent); font-weight: 600; }
#app .cc-rate__sep { opacity: .5; }

@media (prefers-reduced-motion: reduce) {
  #app .cc-rate__num.is-bump { animation: none; }
}

/* ==========================================================================
   面板
   ========================================================================== */

#app .db-content { gap: 18px; grid-template-columns: 360px 1fr; }

#app .db-panel {
  border-radius: 8px;
  background: #141c2a;
  border: 1px solid var(--cc-line);
  box-shadow: none;
  backdrop-filter: none;
}

#app .db-panel__head {
  padding: 14px 18px;
  border-bottom: 1px solid var(--cc-line-soft);
  background: linear-gradient(180deg, rgba(255, 255, 255, .03), transparent);
}

#app .db-panel__head h3 {
  font-size: 14px;
  color: var(--cc-text);
  letter-spacing: 2px;
  display: flex;
  align-items: center;
  gap: 9px;
}

#app .db-panel__head h3::before { display: none; }

#app .db-badge {
  background: rgba(255, 255, 255, .04);
  color: var(--cc-text-dim);
  border: 1px solid var(--cc-line);
  border-radius: 4px;
  padding: 2px 8px;
  letter-spacing: .5px;
}

#app .db-panel__body { padding: 14px 18px; }

/* ==========================================================================
   人员动态
   ========================================================================== */

#app .pn-section__title {
  color: var(--cc-text-dim);
  letter-spacing: 1.4px;
  font-size: 12px;
  margin-bottom: 10px;
  padding-bottom: 8px;
  border-bottom: 1px dashed var(--cc-line-soft);
}

#app .pn-dot { box-shadow: 0 0 9px currentColor; }
#app .pn-dot.green { background: var(--cc-green); color: var(--cc-green); }
#app .pn-dot.orange { background: var(--cc-orange); color: var(--cc-orange); }

#app .pn-row {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 10px;
  border-radius: 8px;
  border: 1px solid transparent;
  cursor: pointer;
  transition: background .16s ease, border-color .16s ease, transform .16s ease;
}

#app .pn-row__bar {
  width: 3px;
  height: 16px;
  border-radius: 2px;
  flex-shrink: 0;
}

#app .pn-row:hover {
  background: rgba(255, 255, 255, .04);
  border-color: var(--cc-line);
  transform: none;
}

#app .pn-row__name {
  color: var(--cc-text-dim);
  font-size: 13px;
  letter-spacing: .5px;
  min-width: 56px;
}

#app .pn-row__count {
  color: #fff;
  font-size: 14px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  min-width: 36px;
}

#app .pn-row__track {
  flex: 1;
  height: 5px;
  background: rgba(255, 255, 255, .07);
  border-radius: 3px;
  overflow: hidden;
}

#app .pn-row__fill {
  height: 100%;
  border-radius: 3px;
  box-shadow: 0 0 10px -1px currentColor;
}

/* ==========================================================================
   车辆概要 · 姓名牌排班板
   ========================================================================== */

#app .db-panel--vehicles .vt,
#app .db-panel--vehicles .empty-state {
  display: none !important;
}

#app .db-panel--vehicles .db-panel__body {
  background: transparent;
}

#app .vb {
  width: 100%;
  min-height: 220px;
  padding: 4px 0 0;
  background: transparent;
  border-radius: 0;
}

#app .vb-head,
#app .vb-row {
  display: grid;
  grid-template-columns: 102px repeat(10, minmax(0, 1fr));
  gap: 6px;
  align-items: stretch;
}

#app .vb-head {
  padding: 0 2px 8px;
  margin-bottom: 6px;
  border-bottom: 1px dashed var(--cc-line-soft);
}

#app .vb-h {
  font-size: 11px;
  letter-spacing: 1.6px;
  color: #d5deee;
  text-align: center;
  font-weight: 700;
}

#app .vb-h.is-cmd { color: #ff8b96; }
#app .vb-h.is-drv { color: #7eecb0; }
#app .vb-h.is-tx { color: #9fe4e6; }
#app .vb-h.is-safe { color: #f6c453; }
#app .vb-h.is-lead { color: #ff9a4d; }

#app .vb-row {
  padding: 5px 2px;
  border-radius: 8px;
}

#app .vb-row:hover {
  background: rgba(255, 255, 255, .03);
}

#app .vb-car {
  position: relative;
  box-sizing: border-box;
  height: 100%;
  min-height: 40px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 4px;
  padding: 6px 6px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, .11) 0%, rgba(255, 255, 255, 0) 42%),
    linear-gradient(165deg, #44506c 0%, #2c364f 52%, #1f273a 100%);
  border: 1px solid rgba(214, 196, 152, .32);
  border-radius: 6px;
  box-shadow:
    0 1px 0 rgba(255, 255, 255, .16) inset,
    0 8px 18px -10px rgba(0, 0, 0, .72);
  overflow: hidden;
}

#app .vb-car::before {
  content: "";
  position: absolute;
  left: 0;
  top: 7px;
  bottom: 7px;
  width: 2px;
  border-radius: 2px;
  background: #d8c08a;
}

#app .vb-row.is-duty .vb-car::before {
  background: #3ee08c;
  box-shadow: 0 0 8px rgba(47, 217, 127, .5);
}

#app .vb-row.is-standby .vb-car::before {
  background: #f6c453;
  box-shadow: 0 0 8px rgba(246, 196, 83, .45);
}

#app .vb-car__name {
  color: #f4efe4;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .3px;
  line-height: 1.15;
  text-align: center;
  white-space: nowrap;
}

#app .vb-car__meta {
  color: #c9b896;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .6px;
  line-height: 1;
  padding: 0;
  border-radius: 0;
  background: none;
  text-align: center;
}

#app .vb-row.is-duty .vb-car__meta {
  color: #8ee0b4;
  background: none;
}

#app .vb-row.is-standby .vb-car__meta {
  color: #f0d28a;
  background: none;
}

#app .vb-plate {
  box-sizing: border-box;
  height: 100%;
  min-height: 40px;
  min-width: 0;
  border: 1px solid transparent;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 5px;
  padding: 4px 7px;
  text-align: center;
  background: linear-gradient(180deg, #f6f0e2 0%, #e4d8be 100%);
  color: #2b2416;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: .2px;
  border-radius: 4px;
  box-shadow:
    0 1px 0 rgba(255, 255, 255, .45) inset,
    0 2px 5px rgba(0, 0, 0, .35);
}

#app .vb-av {
  width: 24px;
  height: 24px;
  border-radius: 3px;
  object-fit: cover;
  flex-shrink: 0;
  background: rgba(0, 0, 0, .08);
}

#app .vb-av--fallback {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  font-weight: 800;
  background: rgba(43, 36, 22, .12);
}

#app .vb-plate__name {
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  text-align: center;
  line-height: 1.2;
}

#app .vb-plate.tone-red {
  background: linear-gradient(180deg, #ff8a93 0%, #e83d4d 100%);
  color: #fff8f8;
  box-shadow:
    0 1px 0 rgba(255, 255, 255, .28) inset,
    0 0 0 1px rgba(255, 77, 94, .45),
    0 2px 6px rgba(0, 0, 0, .4);
}

#app .vb-plate.tone-red .vb-av--fallback {
  background: rgba(255, 255, 255, .22);
  color: #fff;
}

#app .vb-plate.tone-green {
  background: linear-gradient(180deg, #8ef0b6 0%, #2fd97f 100%);
  color: #083318;
  box-shadow:
    0 1px 0 rgba(255, 255, 255, .4) inset,
    0 0 0 1px rgba(47, 217, 127, .4),
    0 2px 6px rgba(0, 0, 0, .35);
}

#app .vb-plate.tone-cyan {
  background: linear-gradient(180deg, #d5f6f6 0%, #8fd4d6 100%);
}

#app .vb-plate.tone-gold {
  background: linear-gradient(180deg, #ffe08a 0%, #f0b429 100%);
  color: #3a2a08;
  box-shadow:
    0 1px 0 rgba(255, 255, 255, .4) inset,
    0 0 0 1px rgba(246, 196, 83, .45),
    0 2px 6px rgba(0, 0, 0, .35);
}

#app .vb-plate.tone-orange {
  background: linear-gradient(180deg, #ffb072 0%, #e86a1a 100%);
  color: #3a1608;
  box-shadow:
    0 1px 0 rgba(255, 255, 255, .35) inset,
    0 0 0 1px rgba(255, 138, 58, .45),
    0 2px 6px rgba(0, 0, 0, .4);
}

#app .vb-plate.is-empty {
  justify-content: center;
  background: rgba(8, 12, 22, .38);
  box-shadow: none;
  border-color: transparent;
  color: transparent;
}

/* ==========================================================================
   车辆概要表（旧表，被排班板替换后隐藏）
   ========================================================================== */

#app .vt th {
  color: var(--cc-text-mute);
  font-size: 11px;
  letter-spacing: 1.4px;
  padding: 10px 12px;
  border-bottom: 1px solid var(--cc-line);
  background: rgba(255, 255, 255, .022);
}

#app .vt td {
  padding: 13px 12px;
  color: var(--cc-text-dim);
  border-bottom: 1px solid var(--cc-line-soft);
}

#app .vt tbody tr {
  transition: background .16s ease;
}

#app .vt tbody tr:hover {
  background: rgba(77, 159, 255, .07);
}

#app .vt-name {
  color: #fff;
  letter-spacing: .8px;
}

#app .vt-type { color: var(--cc-text-mute); }

#app .vt-num {
  color: var(--cc-text-dim);
  font-variant-numeric: tabular-nums;
}

#app .vt-total {
  color: #8cc2ff;
  font-weight: 800;
  font-size: 14px;
}

#app .vt-highlight { color: #8cc2ff; }
#app .vt-empty { color: var(--cc-text-mute); }

/* 状态胶囊：半透明底 + 描边 + 外发光，比纯色块更"贵" */
#app .vt-status {
  border-radius: 999px;
  padding: 3px 11px;
  letter-spacing: .8px;
  border: 1px solid transparent;
}

#app .vt-status.status-active {
  background: rgba(47, 217, 127, .14);
  border-color: rgba(47, 217, 127, .34);
  color: #5deba0;
  box-shadow: 0 0 12px -3px rgba(47, 217, 127, .55);
}

#app .vt-status.status-backup {
  background: rgba(255, 162, 58, .14);
  border-color: rgba(255, 162, 58, .34);
  color: #ffbe76;
}

#app .vt-status.status-maintenance {
  background: rgba(246, 196, 83, .14);
  border-color: rgba(246, 196, 83, .34);
  color: #f7d488;
}

#app .vt-status.status-default {
  background: rgba(255, 255, 255, .06);
  border-color: var(--cc-line);
  color: var(--cc-text-mute);
}

/* ==========================================================================
   空状态
   ========================================================================== */

#app .db .empty-state,
#app .db .empty,
#app .db .no-data {
  color: var(--cc-text-mute);
}

/* ==========================================================================
   入场动效：让首屏"落位"而不是硬切
   ========================================================================== */

@media (prefers-reduced-motion: no-preference) {
  /* fill-mode 用 backwards：动画结束后不再钉住 transform，否则会压掉 hover 的抬起 */
  #app .kpi,
  #app .kpi-rate,
  #app .db-panel {
    animation: cc-rise .5s cubic-bezier(.2, .7, .3, 1) backwards;
  }

  #app .db-kpis > *:nth-child(1) { animation-delay: .02s; }
  #app .db-kpis > *:nth-child(2) { animation-delay: .06s; }
  #app .db-kpis > *:nth-child(3) { animation-delay: .10s; }
  #app .db-kpis > *:nth-child(4) { animation-delay: .14s; }
  #app .db-kpis > *:nth-child(5) { animation-delay: .18s; }
  #app .db-content > *:nth-child(1) { animation-delay: .20s; }
  #app .db-content > *:nth-child(2) { animation-delay: .24s; }
}

@keyframes cc-rise {
  from { opacity: 0; transform: translateY(10px); }
  to   { opacity: 1; transform: none; }
}

/* ==========================================================================
   首页弹窗（人员详情 / 跟车动态情况）
   --------------------------------------------------------------------------
   el-dialog 会被 teleport 到 body，不在 #app .db 之下，所以这一节不能写 #app。
   两个弹窗都带 class="dlg-personnel"，就用它做作用域，其它页面的弹窗不受影响。
   dist 里的 scoped 规则形如 .dlg-name[data-v-xxx]，特异度 (0,2,0)，且该 CSS 块
   随路由懒加载、排在本文件之后，同特异度会赢，所以这里统一用
   .el-overlay .el-dialog.dlg-personnel 前缀把特异度抬到 (0,3,0)。
   dash-fix 自绘的 #dash-fix-dialog 也套同一套 class，共用这份样式。
   ========================================================================== */

/* 遮罩：压暗 + 轻微模糊，让弹窗从页面里"浮"出来 */
.el-overlay:has(> .el-overlay-dialog > .dlg-personnel),
#dash-fix-dialog.el-overlay {
  background: rgba(6, 10, 18, .72) !important;
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
}

.el-overlay .el-dialog.dlg-personnel {
  --el-dialog-bg-color: #121a29;
  --el-dialog-padding-primary: 0px;
  padding: 0;
  background: linear-gradient(180deg, #16202f 0%, #111827 100%);
  border: 1px solid rgba(180, 196, 220, .16);
  border-radius: 12px;
  box-shadow:
    0 40px 90px -30px rgba(0, 0, 0, .9),
    0 0 0 1px rgba(0, 0, 0, .5),
    inset 0 1px 0 rgba(255, 255, 255, .05);
  overflow: hidden;
  color: var(--cc-text-dim);
}

/* ---------- 头部 ---------- */
.el-overlay .el-dialog.dlg-personnel .el-dialog__header {
  position: relative;
  margin: 0;
  padding: 18px 60px 14px 24px;
  border-bottom: 1px solid rgba(180, 196, 220, .1);
  cursor: default;
}

.el-overlay .el-dialog.dlg-personnel .el-dialog__title,
.el-overlay .el-dialog.dlg-personnel .dlg-header-title {
  font-size: 16px;
  font-weight: 650;
  letter-spacing: .6px;
  color: var(--cc-text);
}

.el-overlay .el-dialog.dlg-personnel .dlg-header-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 0;
}

.el-overlay .el-dialog.dlg-personnel .dlg-header-datetime {
  font-size: 12px;
  font-weight: 500;
  letter-spacing: .6px;
  font-variant-numeric: tabular-nums;
  font-family: ui-monospace, "SF Mono", "Menlo", "Consolas", monospace;
  color: var(--cc-text-mute);
}

.el-overlay .el-dialog.dlg-personnel .el-dialog__headerbtn {
  top: 12px;
  right: 14px;
  width: 32px;
  height: 32px;
  border-radius: 6px;
  color: var(--cc-text-mute);
  transition: background-color .15s ease, color .15s ease;
}

.el-overlay .el-dialog.dlg-personnel .el-dialog__headerbtn .el-dialog__close {
  color: inherit;
  font-size: 16px;
}

.el-overlay .el-dialog.dlg-personnel .el-dialog__headerbtn:hover {
  background: rgba(255, 255, 255, .07);
  color: var(--cc-text);
}

.el-overlay .el-dialog.dlg-personnel .el-dialog__headerbtn:hover .el-dialog__close { color: inherit; }

/* ---------- 主体 ---------- */
.el-overlay .el-dialog.dlg-personnel .el-dialog__body {
  padding: 10px 14px 12px 20px;
  max-height: min(62vh, 560px);
  overflow-y: auto;
  color: var(--cc-text-dim);
  scrollbar-width: thin;
  scrollbar-color: rgba(255, 255, 255, .14) transparent;
}

.el-overlay .el-dialog.dlg-personnel .el-dialog__body::-webkit-scrollbar { width: 8px; }
.el-overlay .el-dialog.dlg-personnel .el-dialog__body::-webkit-scrollbar-track { background: transparent; }
.el-overlay .el-dialog.dlg-personnel .el-dialog__body::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, .12);
  border-radius: 4px;
}
.el-overlay .el-dialog.dlg-personnel .el-dialog__body::-webkit-scrollbar-thumb:hover { background: rgba(255, 255, 255, .2); }

.el-overlay .el-dialog.dlg-personnel .dlg-empty {
  padding: 48px 0;
  text-align: center;
  font-size: 13px;
  letter-spacing: 1px;
  color: var(--cc-text-mute);
}

/* 人员列表 */
.el-overlay .el-dialog.dlg-personnel .dlg-list {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.el-overlay .el-dialog.dlg-personnel .dlg-item {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 9px 12px;
  border-radius: 8px;
  border: 1px solid transparent;
  transition: background-color .15s ease, border-color .15s ease;
}

.el-overlay .el-dialog.dlg-personnel .dlg-item:hover {
  background: rgba(255, 255, 255, .04);
  border-color: rgba(180, 196, 220, .1);
}

.el-overlay .el-dialog.dlg-personnel .dlg-idx {
  width: 24px;
  height: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  border-radius: 6px;
  background: rgba(255, 255, 255, .06);
  font-size: 11px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  font-family: ui-monospace, "SF Mono", "Menlo", "Consolas", monospace;
  color: var(--cc-text-mute);
}

.el-overlay .el-dialog.dlg-personnel .dlg-avatar,
.el-overlay .el-dialog.dlg-personnel .el-avatar,
#dash-fix-dialog .dash-fix-avatar {
  flex-shrink: 0;
  width: 40px;
  height: 40px;
  border-radius: 6px !important;
  border: 1px solid rgba(180, 196, 220, .22);
  background: #1c2637;
  color: var(--cc-text-dim);
  font-weight: 600;
  object-fit: cover;
  overflow: hidden;
}

.el-overlay .el-dialog.dlg-personnel .el-avatar img { border-radius: 5px !important; }

.el-overlay .el-dialog.dlg-personnel .dlg-info { flex: 1; min-width: 0; }

.el-overlay .el-dialog.dlg-personnel .dlg-name-row {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 3px;
}

.el-overlay .el-dialog.dlg-personnel .dlg-name {
  font-size: 14px;
  font-weight: 650;
  letter-spacing: .3px;
  color: var(--cc-text);
}

.el-overlay .el-dialog.dlg-personnel .dlg-meta {
  font-size: 12px;
  color: var(--cc-text-mute);
}

.el-overlay .el-dialog.dlg-personnel .dlg-sep { margin: 0 5px; opacity: .6; }

.el-overlay .el-dialog.dlg-personnel .dlg-phone {
  font-size: 13px;
  letter-spacing: .4px;
  font-variant-numeric: tabular-nums;
  font-family: ui-monospace, "SF Mono", "Menlo", "Consolas", monospace;
  color: var(--cc-text-dim);
  white-space: nowrap;
}

/* 分组分隔行（按车 / 按假期阶段） */
.el-overlay .el-dialog.dlg-personnel .dlg-group-divider {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 12px 12px 6px;
  margin-top: 8px;
}

.el-overlay .el-dialog.dlg-personnel .dlg-group-divider.dlg-group-first { margin-top: 0; padding-top: 4px; }

/* 分组点和分组名也挂着 .phase-* class，原样式会给它们套上浅色底和描边，
   在深色底上就成了一块亮斑，这里清掉。 */
.el-overlay .el-dialog.dlg-personnel .dlg-group-dot {
  width: 7px;
  height: 7px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  flex-shrink: 0;
  box-shadow: 0 0 0 3px rgba(255, 255, 255, .05);
  animation: none;
}

.el-overlay .el-dialog.dlg-personnel .dlg-group-label {
  padding: 0;
  border: 0;
  background: transparent !important;
  font-size: 12px;
  font-weight: 650;
  letter-spacing: 1px;
  white-space: nowrap;
  flex-shrink: 0;
  animation: none;
}

.el-overlay .el-dialog.dlg-personnel .dlg-group-line {
  flex: 1;
  height: 1px;
  background: linear-gradient(to right, rgba(180, 196, 220, .2), transparent);
}

.el-overlay .el-dialog.dlg-personnel .dlg-group-count {
  font-size: 11px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  color: var(--cc-text-mute);
  flex-shrink: 0;
}

/* 状态 / 阶段 / 车辆 标签：半透明底 + 同色描边，和首页车牌板一个语气 */
.el-overlay .el-dialog.dlg-personnel .dlg-status,
.el-overlay .el-dialog.dlg-personnel .dlg-phase-tag,
.el-overlay .el-dialog.dlg-personnel .dlg-vehicle,
.el-overlay .el-dialog.dlg-personnel .vt-status {
  --tag: 160, 172, 192;
  display: inline-block;
  padding: 3px 9px;
  border-radius: 5px;
  font-size: 11px;
  font-weight: 650;
  letter-spacing: .5px;
  line-height: 1.3;
  white-space: nowrap;
  flex-shrink: 0;
  background: rgba(var(--tag), .14);
  color: rgb(var(--tag));
  border: 1px solid rgba(var(--tag), .32);
}

.el-overlay .el-dialog.dlg-personnel .dlg-vehicle { padding: 1px 7px; font-size: 10.5px; }

.el-overlay .el-dialog.dlg-personnel .status-green,
.el-overlay .el-dialog.dlg-personnel .status-active,
.el-overlay .el-dialog.dlg-personnel .phase-on-leave,
.el-overlay .el-dialog.dlg-personnel .vehicle-color-3 { --tag: 96, 222, 158; }

.el-overlay .el-dialog.dlg-personnel .status-blue,
.el-overlay .el-dialog.dlg-personnel .phase-preparing,
.el-overlay .el-dialog.dlg-personnel .vehicle-color-2 { --tag: 122, 176, 245; }

.el-overlay .el-dialog.dlg-personnel .status-orange,
.el-overlay .el-dialog.dlg-personnel .status-backup,
.el-overlay .el-dialog.dlg-personnel .status-maintenance,
.el-overlay .el-dialog.dlg-personnel .phase-today-leave,
.el-overlay .el-dialog.dlg-personnel .phase-tomorrow-return,
.el-overlay .el-dialog.dlg-personnel .vehicle-color-5 { --tag: 240, 176, 90; }

.el-overlay .el-dialog.dlg-personnel .status-red,
.el-overlay .el-dialog.dlg-personnel .phase-today-return,
.el-overlay .el-dialog.dlg-personnel .phase-overdue,
.el-overlay .el-dialog.dlg-personnel .vehicle-color-1 { --tag: 245, 120, 130; }

.el-overlay .el-dialog.dlg-personnel .status-purple,
.el-overlay .el-dialog.dlg-personnel .vehicle-color-4 { --tag: 186, 160, 255; }

.el-overlay .el-dialog.dlg-personnel .status-pink { --tag: 245, 140, 190; }
.el-overlay .el-dialog.dlg-personnel .status-indigo { --tag: 150, 160, 255; }

.el-overlay .el-dialog.dlg-personnel .status-teal,
.el-overlay .el-dialog.dlg-personnel .vehicle-color-6 { --tag: 80, 220, 205; }

.el-overlay .el-dialog.dlg-personnel .status-default { --tag: 150, 162, 184; }

/* 分组点/分组名的阶段色（无内联色时生效），跟标签同一套调色 */
.el-overlay .el-dialog.dlg-personnel .dlg-group-dot.phase-overdue,
.el-overlay .el-dialog.dlg-personnel .dlg-group-dot.phase-today-return { background: rgb(245, 120, 130); }
.el-overlay .el-dialog.dlg-personnel .dlg-group-dot.phase-tomorrow-return,
.el-overlay .el-dialog.dlg-personnel .dlg-group-dot.phase-today-leave { background: rgb(240, 176, 90); }
.el-overlay .el-dialog.dlg-personnel .dlg-group-dot.phase-preparing { background: rgb(122, 176, 245); }
.el-overlay .el-dialog.dlg-personnel .dlg-group-dot.phase-on-leave { background: rgb(96, 222, 158); }
.el-overlay .el-dialog.dlg-personnel .dlg-group-label.phase-overdue,
.el-overlay .el-dialog.dlg-personnel .dlg-group-label.phase-today-return { color: rgb(245, 120, 130); }
.el-overlay .el-dialog.dlg-personnel .dlg-group-label.phase-tomorrow-return,
.el-overlay .el-dialog.dlg-personnel .dlg-group-label.phase-today-leave { color: rgb(240, 176, 90); }
.el-overlay .el-dialog.dlg-personnel .dlg-group-label.phase-preparing { color: rgb(122, 176, 245); }
.el-overlay .el-dialog.dlg-personnel .dlg-group-label.phase-on-leave { color: rgb(96, 222, 158); }

/* 阶段区（休假天数等） */
.el-overlay .el-dialog.dlg-personnel .dlg-phase-area {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 4px;
  flex-shrink: 0;
  min-width: 84px;
}

.el-overlay .el-dialog.dlg-personnel .dlg-phase-time,
.el-overlay .el-dialog.dlg-personnel .dlg-days-row {
  font-size: 10.5px;
  letter-spacing: .3px;
  font-variant-numeric: tabular-nums;
  color: var(--cc-text-mute);
  white-space: nowrap;
}

.el-overlay .el-dialog.dlg-personnel .dlg-days-row { display: flex; align-items: center; gap: 5px; }
.el-overlay .el-dialog.dlg-personnel .dlg-days-item b { font-weight: 700; margin: 0 1px; color: var(--cc-text-dim); }
.el-overlay .el-dialog.dlg-personnel .dlg-days-sep { color: rgba(180, 196, 220, .25); font-size: 9px; }
.el-overlay .el-dialog.dlg-personnel .dlg-days-used b { color: #f0b05a; }
.el-overlay .el-dialog.dlg-personnel .dlg-days-remain b { color: #60de9e; }

/* 车辆表 */
.el-overlay .el-dialog.dlg-personnel .vt {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  font-size: 13px;
}

.el-overlay .el-dialog.dlg-personnel .vt th {
  padding: 8px 12px 10px;
  text-align: left;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 1.2px;
  color: var(--cc-text-mute);
  border-bottom: 1px solid rgba(180, 196, 220, .14);
  white-space: nowrap;
}

.el-overlay .el-dialog.dlg-personnel .vt td {
  padding: 12px;
  color: var(--cc-text-dim);
  border-bottom: 1px solid rgba(180, 196, 220, .06);
  transition: background-color .15s ease;
}

.el-overlay .el-dialog.dlg-personnel .vt tbody tr:last-child td { border-bottom-color: transparent; }
.el-overlay .el-dialog.dlg-personnel .vt tbody tr:hover td { background: rgba(255, 255, 255, .035); }
.el-overlay .el-dialog.dlg-personnel .vt tbody tr td:first-child { border-radius: 6px 0 0 6px; }
.el-overlay .el-dialog.dlg-personnel .vt tbody tr td:last-child { border-radius: 0 6px 6px 0; }

.el-overlay .el-dialog.dlg-personnel .vt-name {
  font-weight: 650;
  letter-spacing: .3px;
  color: var(--cc-text);
  white-space: nowrap;
}

.el-overlay .el-dialog.dlg-personnel .vt-type { font-size: 12px; color: var(--cc-text-mute); }

.el-overlay .el-dialog.dlg-personnel .vt-num {
  text-align: center !important;
  font-variant-numeric: tabular-nums;
  font-family: ui-monospace, "SF Mono", "Menlo", "Consolas", monospace;
}

.el-overlay .el-dialog.dlg-personnel .vt-total { font-weight: 800; color: #8fc0ff; }
.el-overlay .el-dialog.dlg-personnel .vt-highlight { font-weight: 600; color: #a7c8f5; }
.el-overlay .el-dialog.dlg-personnel .vt-empty { color: rgba(125, 139, 163, .6); font-style: normal; letter-spacing: 1px; }

/* ---------- 底部 ---------- */
.el-overlay .el-dialog.dlg-personnel .el-dialog__footer {
  padding: 12px 20px 16px;
  border-top: 1px solid rgba(180, 196, 220, .1);
  text-align: right;
}

.el-overlay .el-dialog.dlg-personnel .el-dialog__footer .el-button,
.el-overlay .el-dialog.dlg-personnel .el-dialog__footer .el-button--default {
  height: 34px;
  padding: 0 20px;
  border-radius: 6px;
  font-size: 13px;
  letter-spacing: 1px;
  color: var(--cc-text-dim);
  background: rgba(255, 255, 255, .04);
  border: 1px solid rgba(180, 196, 220, .22);
  box-shadow: none;
  transition: background-color .15s ease, border-color .15s ease, color .15s ease;
}

.el-overlay .el-dialog.dlg-personnel .el-dialog__footer .el-button:hover {
  color: var(--cc-text);
  background: rgba(255, 255, 255, .08);
  border-color: rgba(212, 180, 106, .55);
}

.el-overlay .el-dialog.dlg-personnel .el-dialog__footer .el-button:active {
  background: rgba(255, 255, 255, .05);
}

/* ==========================================================================
   车辆调整页（/admin-station/vehicle-adjustment）· 整页重做
   --------------------------------------------------------------------------
   原来只把顶部车辆卡做精、页面其余仍是浅灰白底，和指挥台脱节。这里整页改成同一套
   飞行甲板：深底网格、细描边分层。车辆卡用左侧状态条辨认，选中靠亮度和内描边，
   不靠角标对勾和外发光。座位条是 dash-fix 写入的 10 格 .v-card__seats。
   新增 / 编辑车辆弹窗由 dash-fix 挂 .tech-dialog.pm-dialog。
   ========================================================================== */

#app .vehicles-container {
  color: var(--cc-text);
  font-family: -apple-system, "PingFang SC", "Microsoft YaHei", system-ui, sans-serif;
  height: calc(100vh - 56px);
  padding: 16px 22px 18px;
  gap: 14px;
  background-color: var(--cc-bg-0);
  background-image:
    linear-gradient(rgba(180, 196, 220, .035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(180, 196, 220, .035) 1px, transparent 1px),
    radial-gradient(900px 380px at 50% -12%, rgba(196, 42, 60, .07), transparent 58%),
    linear-gradient(180deg, var(--cc-bg-1) 0%, var(--cc-bg-0) 100%);
  background-size: 48px 48px, 48px 48px, auto, auto;
  background-attachment: fixed;
  --el-bg-color: #141c2a;
  --el-fill-color-blank: rgba(10, 15, 24, .7);
  --el-text-color-primary: var(--cc-text);
  --el-text-color-regular: var(--cc-text-dim);
  --el-text-color-placeholder: var(--cc-text-mute);
  --el-border-color: rgba(180, 196, 220, .18);
  --el-color-primary: #5b9be8;
}

/* ---------- 顶部车辆选择条 ---------- */
#app .vehicles-container .vehicle-selection-bar {
  padding: 12px 14px 14px;
  border-radius: 8px;
  background: #141c2a;
  border: 1px solid var(--cc-line);
  box-shadow: none;
}

#app .vehicles-container .title-text {
  font-size: 13px;
  font-weight: 650;
  letter-spacing: 2.5px;
  color: var(--cc-text-mute);
}

#app .vehicles-container .title-count {
  font-size: 12px;
  letter-spacing: 1px;
  color: var(--cc-text-dim);
  font-variant-numeric: tabular-nums;
  font-family: ui-monospace, "SF Mono", "Menlo", "Consolas", monospace;
}

#app .vehicles-container .add-vehicle-btn {
  height: 30px;
  padding: 0 12px;
  border-radius: 4px;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 1px;
  color: #d7e6f8;
  background: rgba(91, 155, 232, .14);
  border: 1px solid rgba(91, 155, 232, .4);
  box-shadow: none;
  transition: background-color .15s ease, border-color .15s ease, color .15s ease;
}

#app .vehicles-container .add-vehicle-btn:hover {
  color: #fff;
  background: rgba(91, 155, 232, .24);
  border-color: rgba(91, 155, 232, .7);
  transform: none;
  filter: none;
  box-shadow: none;
}

#app .vehicles-container .add-vehicle-btn:active {
  background: rgba(91, 155, 232, .32);
}

#app .vehicles-container .vehicle-strip {
  display: flex;
  gap: 8px;
  padding: 0;
}

#app .vehicles-container .vehicle-strip::-webkit-scrollbar { height: 3px; }
#app .vehicles-container .vehicle-strip::-webkit-scrollbar-track { background: transparent; }
#app .vehicles-container .vehicle-strip::-webkit-scrollbar-thumb { background: rgba(180, 196, 220, .18); border-radius: 2px; }

#app .v-card {
  --acc: #7d8ba3;
  --acc-rgb: 125, 139, 163;
  position: relative;
  flex: 1 1 0;
  min-width: 0;
  border: 1px solid var(--cc-line);
  border-radius: 8px;
  background:
    radial-gradient(160px 80px at 100% 0%, rgba(var(--acc-rgb), .10), transparent 70%),
    linear-gradient(180deg, #131c2b, #0f1724);
  box-shadow: 0 1px 0 rgba(255, 255, 255, .03) inset;
  overflow: hidden;
  cursor: pointer;
  transform: translateY(0);
  transition: transform .24s cubic-bezier(.2, .7, .3, 1),
              border-color .2s ease,
              box-shadow .24s ease;
}

/* 顶部一条身份色光带；选中 / 悬停时点亮 */
#app .v-card::before {
  content: "";
  position: absolute;
  left: 10px;
  right: 10px;
  top: 0;
  height: 2px;
  border-radius: 0 0 2px 2px;
  background: linear-gradient(90deg, transparent, rgb(var(--acc-rgb)) 30%, rgb(var(--acc-rgb)) 70%, transparent);
  opacity: .35;
  pointer-events: none;
  transition: opacity .2s ease, left .2s ease, right .2s ease;
}

/* 四角括号：选中态的 HUD 标记 */
#app .v-card::after {
  content: "";
  position: absolute;
  inset: 3px;
  border-radius: 6px;
  pointer-events: none;
  opacity: 0;
  transform: scale(1.05);
  --l: linear-gradient(rgb(var(--acc-rgb)), rgb(var(--acc-rgb)));
  background:
    var(--l) left 0 top 0 / 12px 1.5px,   var(--l) left 0 top 0 / 1.5px 12px,
    var(--l) right 0 top 0 / 12px 1.5px,  var(--l) right 0 top 0 / 1.5px 12px,
    var(--l) left 0 bottom 0 / 12px 1.5px, var(--l) left 0 bottom 0 / 1.5px 12px,
    var(--l) right 0 bottom 0 / 12px 1.5px, var(--l) right 0 bottom 0 / 1.5px 12px;
  background-repeat: no-repeat;
  transition: opacity .22s ease, transform .3s cubic-bezier(.2, .8, .3, 1);
}

#app .v-card:hover {
  transform: translateY(-2px);
  border-color: rgba(var(--acc-rgb), .45);
  box-shadow: 0 14px 28px -18px rgba(var(--acc-rgb), .65), 0 1px 0 rgba(255, 255, 255, .04) inset;
}
#app .v-card:hover::before { opacity: .9; left: 0; right: 0; }

#app .v-card:active { transform: translateY(0) scale(.99); transition-duration: .08s; }

/* 选中态：外框、四角括号、顶部光带统一用红色，状态胶囊和座位格仍保留各自身份色 */
#app .v-card--selected,
#app .v-card--selected:hover {
  --sel-rgb: 232, 93, 106;
  border-color: rgba(var(--sel-rgb), .75);
  background:
    radial-gradient(200px 100px at 100% 0%, rgba(var(--sel-rgb), .18), transparent 70%),
    linear-gradient(180deg, #1c1a2c, #141522);
  box-shadow: 0 0 0 1px rgba(var(--sel-rgb), .2) inset, 0 16px 32px -20px rgba(var(--sel-rgb), .75);
}
#app .v-card--selected::before {
  opacity: 1;
  left: 0;
  right: 0;
  background: linear-gradient(90deg, transparent, rgb(var(--sel-rgb)) 30%, rgb(var(--sel-rgb)) 70%, transparent);
}
#app .v-card--selected::after {
  opacity: 1;
  transform: scale(1);
  --l: linear-gradient(rgb(var(--sel-rgb)), rgb(var(--sel-rgb)));
}
#app .v-card--selected .v-card__name { color: #fff; }
#app .v-card--selected .v-card__crew,
#app .v-card--selected:hover .v-card__crew { color: #ffb3b9; }

#app .v-card--fault { border-color: rgba(232, 93, 106, .4); }
#app .v-card--fault:hover { border-color: rgba(232, 93, 106, .65); }

/* 身份色：执勤绿、备勤蓝、维保 / 加油 / 驻防 / 后勤琥珀、故障红、训练紫、归队青、公务蓝、停用灰 */
#app .v-card:has(.status-on-duty)                       { --acc: #3ecf86; --acc-rgb: 62, 207, 134; }
#app .v-card:has(.status-standby)                       { --acc: #5b9be8; --acc-rgb: 91, 155, 232; }
#app .v-card:has(.status-maintenance),
#app .v-card:has(.status-refueling),
#app .v-card:has(.status-stationed),
#app .v-card:has(.status-logistics)                     { --acc: #e09a45; --acc-rgb: 224, 154, 69; }
#app .v-card:has(.status-fault),
#app .v-card:has(.status-repair)                        { --acc: #e85d6a; --acc-rgb: 232, 93, 106; }
#app .v-card:has(.status-training),
#app .v-card:has(.status-exercise),
#app .v-card:has(.status-research),
#app .v-card:has(.status-cross-training)                { --acc: #a78bfa; --acc-rgb: 167, 139, 250; }
#app .v-card:has(.status-returning)                     { --acc: #4cc2d8; --acc-rgb: 76, 194, 216; }
#app .v-card:has(.status-linked)                        { --acc: #2dd4bf; --acc-rgb: 45, 212, 191; }
#app .v-card:has(.status-official)                      { --acc: #5b9be8; --acc-rgb: 91, 155, 232; }
#app .v-card:has(.status-off-duty)                      { --acc: #7d8ba3; --acc-rgb: 125, 139, 163; }

#app .v-card__body { position: relative; padding: 13px 12px 4px 13px; }
#app .v-card__row1 { margin-bottom: 8px; align-items: center; }

#app .v-card__name {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-width: 0;
  font-size: 14.5px;
  font-weight: 650;
  letter-spacing: .6px;
  color: var(--cc-text-dim);
  transition: color .2s ease;
}
/* 名字前的彩色消防车，和执勤车辆页同一张图；选中 / 悬停时轻微前冲 */
#app .v-card__name::before {
  content: "";
  flex: none;
  width: 22px;
  height: 17px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 24'%3E%3Crect x='14' y='1.6' width='16.4' height='1.6' rx='.4' fill='%23cfd6e0'/%3E%3Crect x='14' y='4.9' width='16.4' height='1.6' rx='.4' fill='%23cfd6e0'/%3E%3Crect x='14' y='1.6' width='1.6' height='4.9' fill='%23e5eaf1'/%3E%3Crect x='21.4' y='1.6' width='1.6' height='4.9' fill='%23e5eaf1'/%3E%3Crect x='28.8' y='1.6' width='1.6' height='4.9' fill='%23e5eaf1'/%3E%3Cpath d='M2 11.2L7.2 5.8h7.4v11.6H2z' fill='%23e63946'/%3E%3Cpath d='M8.4 7.4h5v3.6h-6.4z' fill='%23a9dcf7'/%3E%3Crect x='8.2' y='3.5' width='4.4' height='1.9' rx='.5' fill='%23ffb703'/%3E%3Cpath d='M14.6 8.6h13.2l2.8 3.8v5H14.6z' fill='%23d62839'/%3E%3Crect x='14.6' y='12.6' width='16' height='1.5' fill='%23f8f9fa'/%3E%3Crect x='16.4' y='9.8' width='3.6' height='2.1' rx='.3' fill='%23a9dcf7'/%3E%3Crect x='1.4' y='15.4' width='29.6' height='1.6' rx='.3' fill='%23b8c0cc'/%3E%3Ccircle cx='8.2' cy='20.2' r='2.6' fill='%231f2933'/%3E%3Ccircle cx='23.8' cy='20.2' r='2.6' fill='%231f2933'/%3E%3Ccircle cx='8.2' cy='20.2' r='1' fill='%239aa5b1'/%3E%3Ccircle cx='23.8' cy='20.2' r='1' fill='%239aa5b1'/%3E%3C/svg%3E") center / contain no-repeat;
  filter: drop-shadow(0 1px 2px rgba(0, 0, 0, .5)) saturate(.85);
  transition: transform .25s cubic-bezier(.2, .7, .3, 1), filter .2s ease;
}
#app .v-card:hover .v-card__name { color: var(--cc-text); }
#app .v-card:hover .v-card__name::before { transform: translateX(2px); filter: drop-shadow(0 1px 2px rgba(0, 0, 0, .5)) saturate(1.05); }
#app .v-card--selected .v-card__name { color: #fff; }
#app .v-card--selected .v-card__name::before { filter: drop-shadow(0 0 5px rgba(232, 93, 106, .6)) saturate(1.1); }
/* 备勤 / 维保 / 故障的车：图标压灰一点，一眼区分不在勤 */
#app .v-card:has(.status-standby) .v-card__name::before,
#app .v-card:has(.status-maintenance) .v-card__name::before,
#app .v-card:has(.status-refueling) .v-card__name::before,
#app .v-card:has(.status-logistics) .v-card__name::before { filter: drop-shadow(0 1px 2px rgba(0, 0, 0, .5)) saturate(.35) brightness(.85); }
#app .v-card:has(.status-fault) .v-card__name::before,
#app .v-card:has(.status-repair) .v-card__name::before { filter: drop-shadow(0 1px 2px rgba(0, 0, 0, .5)) grayscale(.7) brightness(.7); }

/* 状态胶囊：身份色描边 + 呼吸点（执勤 / 归队才呼吸） */
#app .v-card__status {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 2px 7px 2px 6px;
  border-radius: 4px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 1px;
  background: rgba(var(--acc-rgb), .12);
  color: rgb(var(--acc-rgb));
  border: 1px solid rgba(var(--acc-rgb), .32);
  box-shadow: none;
}
#app .v-card__status::before {
  content: "";
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: rgb(var(--acc-rgb));
  box-shadow: 0 0 6px rgba(var(--acc-rgb), .9);
}
#app .v-card:has(.status-on-duty) .v-card__status::before,
#app .v-card:has(.status-returning) .v-card__status::before { animation: vc-blink 2s ease-in-out infinite; }

/* 第二行：车牌 + 车型 */
#app .v-card__row2 { gap: 8px; align-items: center; font-size: 11px; color: var(--cc-text-mute); }

/* 车牌：白底黑字的应急牌，「应急」两字红色（文本由 dash-fix 去掉【】并拆出应急） */
#app .v-card__row2 .v-card__plate {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  height: 18px;
  padding: 0 6px 0 5px;
  border-radius: 3px;
  font-family: ui-monospace, "SF Mono", "Menlo", "Consolas", monospace;
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 1px;
  color: #10161f;
  background: linear-gradient(180deg, #f8f9fb, #e4e8ee);
  border: 1px solid #b9c2cf;
  box-shadow: 0 1px 0 rgba(255, 255, 255, .6) inset, 0 1px 2px rgba(0, 0, 0, .4);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  transition: transform .2s ease, box-shadow .2s ease;
}
#app .v-card__row2 .v-card__plate::before {
  content: "";
  width: 3px;
  height: 10px;
  border-radius: 1px;
  background: linear-gradient(180deg, #2d6bd6, #1c4ea8);
  margin-right: 1px;
}
#app .v-card__row2 .v-card__plate i { font-style: normal; color: #d0242f; font-weight: 800; letter-spacing: .5px; }
#app .v-card:hover .v-card__row2 .v-card__plate { transform: translateY(-1px); box-shadow: 0 1px 0 rgba(255, 255, 255, .6) inset, 0 3px 6px rgba(0, 0, 0, .5); }

#app .v-card__row2 .v-card__type {
  padding: 1px 6px;
  margin-left: 0;
  border-radius: 3px;
  background: rgba(255, 255, 255, .05);
  color: var(--cc-text-dim);
  font-weight: 600;
  letter-spacing: 1px;
  border: 1px solid var(--cc-line-soft);
}
#app .v-card__row2 .v-card__type::before { content: none; }

/* 页脚：人数 + 操作 + 十格座位 */
#app .v-card__footer {
  position: relative;
  padding: 6px 12px 17px 13px;
  min-height: 40px;
}
#app .v-card__footer::before { content: none; display: none; }

#app .v-card__crew {
  display: inline-flex;
  align-items: baseline;
  gap: 1px;
  font-size: 24px;
  font-weight: 700;
  letter-spacing: -.8px;
  line-height: 1;
  font-variant-numeric: tabular-nums;
  font-family: ui-monospace, "SF Mono", "Menlo", "Consolas", monospace;
  color: var(--cc-text);
  transition: color .2s ease;
}
#app .v-card__crew small {
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 1px;
  color: var(--cc-text-mute);
  margin-left: 3px;
}
#app .v-card__crew.is-bump { animation: cc-kpi-bump .45s cubic-bezier(.2, .8, .3, 1); }
#app .v-card--selected .v-card__crew,
#app .v-card:hover .v-card__crew { color: rgb(var(--acc-rgb)); }
#app .v-card[data-crew="0"] .v-card__crew { color: var(--cc-text-mute); font-weight: 500; }
#app .v-card[data-crew="0"]:hover .v-card__crew { color: var(--cc-text-dim); }

#app .v-card__seats {
  position: absolute;
  left: 13px;
  right: 12px;
  bottom: 8px;
  display: flex;
  gap: 3px;
  height: 3px;
  pointer-events: none;
}
#app .v-card__seats i {
  flex: 1 1 0;
  min-width: 0;
  height: 3px;
  border-radius: 1px;
  background: rgba(255, 255, 255, .07);
  transform-origin: left center;
  transition: background-color .3s ease, box-shadow .3s ease, transform .3s cubic-bezier(.2, .8, .3, 1);
}
#app .v-card__seats i.is-on { background: rgb(var(--acc-rgb)); box-shadow: 0 0 6px rgba(var(--acc-rgb), .55); }
#app .v-card__seats i:nth-child(2)  { transition-delay: .03s; }
#app .v-card__seats i:nth-child(3)  { transition-delay: .06s; }
#app .v-card__seats i:nth-child(4)  { transition-delay: .09s; }
#app .v-card__seats i:nth-child(5)  { transition-delay: .12s; }
#app .v-card__seats i:nth-child(6)  { transition-delay: .15s; }
#app .v-card__seats i:nth-child(7)  { transition-delay: .18s; }
#app .v-card__seats i:nth-child(8)  { transition-delay: .21s; }
#app .v-card__seats i:nth-child(9)  { transition-delay: .24s; }
#app .v-card__seats i:nth-child(10) { transition-delay: .27s; }
#app .v-card:hover .v-card__seats i.is-on { transform: scaleY(1.6); }
#app .v-card[data-crew="0"] .v-card__seats i { background: rgba(255, 255, 255, .05); }

#app .v-card__actions {
  gap: 4px;
  opacity: 0;
  transform: translateY(3px);
  transition: opacity .18s ease, transform .18s ease;
}
#app .v-card:hover .v-card__actions { opacity: 1; transform: none; }

#app .v-action {
  width: 22px;
  height: 22px;
  border-radius: 5px;
  background: rgba(255, 255, 255, .04);
  border: 1px solid var(--cc-line);
  color: var(--cc-text-mute);
  box-shadow: none;
  transition: background-color .15s ease, border-color .15s ease, color .15s ease, transform .15s ease;
}
#app .v-action:hover { background: rgba(91, 155, 232, .16); border-color: rgba(91, 155, 232, .5); color: #c5dbf7; transform: translateY(-1px); }
#app .v-action--danger:hover { background: rgba(232, 93, 106, .16); border-color: rgba(232, 93, 106, .5); color: #ffb3b9; }

/* 入场：逐张上浮 */
@media (prefers-reduced-motion: no-preference) {
  #app .vehicle-strip .v-card { animation: vc-in .45s cubic-bezier(.2, .7, .3, 1) backwards; }
  #app .vehicle-strip .v-card:nth-child(2) { animation-delay: .05s; }
  #app .vehicle-strip .v-card:nth-child(3) { animation-delay: .10s; }
  #app .vehicle-strip .v-card:nth-child(4) { animation-delay: .15s; }
  #app .vehicle-strip .v-card:nth-child(5) { animation-delay: .20s; }
  #app .vehicle-strip .v-card:nth-child(6) { animation-delay: .25s; }
  #app .vehicle-strip .v-card:nth-child(n+7) { animation-delay: .30s; }
}

@keyframes vc-in {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: translateY(0); }
}
@keyframes vc-blink {
  0%, 100% { opacity: 1; }
  50%      { opacity: .28; }
}

@media (prefers-reduced-motion: reduce) {
  #app .vehicle-strip .v-card { animation: none; }
  #app .v-card:has(.status-on-duty) .v-card__status::before,
  #app .v-card:has(.status-returning) .v-card__status::before { animation: none; }
  #app .v-card__crew.is-bump { animation: none; }
}

/* ---------- 左侧人员名单 ---------- */
#app .vehicles-container .info-container {
  flex: 1;
  min-height: 0;
  gap: 16px;
}

#app .vehicles-container .personnel-list-container {
  flex: 0 0 320px;
  width: 320px;
  height: auto;
  max-height: none;
  padding: 14px 12px 10px;
  border-radius: 8px;
  background: #141c2a;
  border: 1px solid var(--cc-line);
  box-shadow: none;
}

#app .vehicles-container .personnel-list-container.drag-over {
  border: 1px dashed rgba(232, 93, 106, .7);
  background: rgba(232, 93, 106, .08);
  box-shadow: inset 0 0 0 1px rgba(232, 93, 106, .2);
}

#app .vehicles-container .drag-hint {
  background: rgba(232, 93, 106, .92);
  border: 1px solid rgba(255, 179, 185, .4);
  border-radius: 10px;
  letter-spacing: 1px;
}

#app .vehicles-container .personnel-header { margin-bottom: 12px; }
#app .vehicles-container .title-row { color: var(--cc-text); }
#app .vehicles-container .title-section { font-size: 15px; font-weight: 650; letter-spacing: 2px; color: var(--cc-text); }
#app .vehicles-container .count-section {
  font-size: 11px;
  letter-spacing: 1px;
  color: var(--cc-text-mute);
  background: rgba(255, 255, 255, .04);
  border: 1px solid var(--cc-line-soft);
  padding: 2px 8px;
  border-radius: 4px;
}

#app .vehicles-container .search-section .el-input__wrapper {
  min-height: 32px;
  padding: 0 10px;
  border-radius: 6px;
  background: rgba(10, 15, 24, .7);
  border: 1px solid var(--cc-line);
  box-shadow: none !important;
}

#app .vehicles-container .search-section .el-input__wrapper.is-focus {
  border-color: rgba(91, 155, 232, .7);
  box-shadow: 0 0 0 3px rgba(91, 155, 232, .15) !important;
}

#app .vehicles-container .search-section .el-input__inner { color: var(--cc-text); font-size: 13px; }
#app .vehicles-container .search-section .el-input__inner::placeholder { color: var(--cc-text-mute); }
/* 人员列表滚动条：默认隐形，鼠标进入模块才显示细圆条
   （element 全局给了 * { scrollbar-width: thin; scrollbar-color: 浅色 }，这会让 ::-webkit-scrollbar 失效，所以先还原成 auto） */
#app .vehicles-container .personnel-list {
  scrollbar-width: auto;
  scrollbar-color: auto;
  scrollbar-gutter: stable;
  padding-right: 2px;
}
#app .vehicles-container .personnel-list::-webkit-scrollbar { width: 6px; height: 6px; }
#app .vehicles-container .personnel-list::-webkit-scrollbar-track { background: transparent; }
#app .vehicles-container .personnel-list::-webkit-scrollbar-thumb {
  background: transparent;
  border-radius: 3px;
  border: 1px solid transparent;
  background-clip: padding-box;
}
#app .vehicles-container .personnel-list-container:hover .personnel-list::-webkit-scrollbar-thumb {
  background-color: rgba(180, 196, 220, .28);
}
#app .vehicles-container .personnel-list-container:hover .personnel-list::-webkit-scrollbar-thumb:hover,
#app .vehicles-container .personnel-list::-webkit-scrollbar-thumb:active {
  background-color: rgba(180, 196, 220, .5);
}
@supports not selector(::-webkit-scrollbar) {
  #app .vehicles-container .personnel-list { scrollbar-width: thin; scrollbar-color: transparent transparent; }
  #app .vehicles-container .personnel-list-container:hover .personnel-list { scrollbar-color: rgba(180, 196, 220, .28) transparent; }
}

#app .vehicles-container .personnel-item {
  padding: 8px 10px;
  margin-bottom: 5px;
  border-radius: 7px;
  background: rgba(255, 255, 255, .03);
  border: 1px solid var(--cc-line-soft);
  border-left: 3px solid transparent;
  box-shadow: none;
  transition: transform .15s ease, background-color .15s ease, border-color .15s ease;
}

#app .vehicles-container .personnel-item:hover {
  background: rgba(91, 155, 232, .08);
  border-color: rgba(91, 155, 232, .35);
  transform: translateX(2px);
  box-shadow: none;
}

#app .vehicles-container .personnel-item.dragging {
  opacity: .4;
  background: rgba(91, 155, 232, .06);
  border: 1px dashed rgba(91, 155, 232, .5);
  transform: scale(.97);
}

#app .vehicles-container .personnel-item.in-current-vehicle {
  border-left-color: #3ecf86;
  background: rgba(62, 207, 134, .08);
}

#app .vehicles-container .personnel-item.in-vehicle:not(.in-current-vehicle) {
  border-left-color: #d4b46a;
  background: rgba(212, 180, 106, .07);
  opacity: .78;
}

#app .vehicles-container .personnel-item.non-draggable:not(.in-vehicle) {
  opacity: .45;
  border-left-color: var(--cc-line);
}

#app .vehicles-container .person-avatar {
  width: 36px;
  height: 36px;
  border-radius: 7px;
  border: 1px solid rgba(180, 196, 220, .2);
  background: #1b2636;
}

#app .vehicles-container .person-name { font-size: 13.5px; font-weight: 600; letter-spacing: .6px; color: var(--cc-text); }

#app .vehicles-container .person-duty-tag {
  font-size: 10px;
  letter-spacing: .4px;
  color: #9cc0f1;
  background: rgba(91, 155, 232, .12);
  border: 1px solid rgba(91, 155, 232, .3);
  padding: 1px 6px;
}

#app .vehicles-container .specialty-labels .specialty-tag {
  font-size: 10px;
  color: var(--cc-text-mute);
  background: rgba(255, 255, 255, .05);
  border: 1px solid var(--cc-line-soft);
  box-shadow: none;
  padding: 1px 5px;
  border-radius: 3px;
}

#app .vehicles-container .badge-current-vehicle {
  color: #8ae9b9;
  background: rgba(62, 207, 134, .12);
  border: 1px solid rgba(62, 207, 134, .35);
}

#app .vehicles-container .badge-other-vehicle {
  color: #f3d58a;
  background: rgba(212, 180, 106, .12);
  border: 1px solid rgba(212, 180, 106, .35);
}

#app .vehicles-container .badge-status {
  color: var(--cc-text-mute);
  background: rgba(255, 255, 255, .04);
  border: 1px solid var(--cc-line-soft);
}

#app .vehicles-container .empty-personnel { color: var(--cc-text-mute); font-style: normal; letter-spacing: 1px; }

/* ---------- 右侧跟车排班板 ---------- */
#app .vehicles-container .vehicle-personnel-container {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  padding: 16px 18px;
  border-radius: 8px;
  background: #141c2a;
  border: 1px solid var(--cc-line);
  box-shadow: none;
  backdrop-filter: none;
}

#app .vehicles-container .section-header { margin-bottom: 14px; }
#app .vehicles-container .section-header h3 {
  font-size: 16px;
  font-weight: 650;
  letter-spacing: 1.5px;
  color: var(--cc-text);
}

#app .vehicles-container .section-actions .el-button {
  height: 32px;
  padding: 0 12px;
  border-radius: 6px;
  font-size: 12.5px;
  letter-spacing: 1px;
  color: #f3d58a;
  background: rgba(212, 180, 106, .10);
  border: 1px solid rgba(212, 180, 106, .4);
}

#app .vehicles-container .section-actions .el-button:hover {
  color: #ffe6a8;
  background: rgba(212, 180, 106, .18);
  border-color: rgba(212, 180, 106, .65);
}

#app .vehicles-container .vehicle-personnel-cards {
  gap: 15px;
  padding: 0;
  max-width: 100%;
  min-width: 0;
  overflow: hidden;
}

#app .vehicles-container .cards-row,
#app .vehicles-container .first-row,
#app .vehicles-container .second-row {
  display: flex;
  gap: 15px;
  width: 100%;
  min-width: 0;
  overflow: hidden;
}

#app .vehicles-container .first-row,
#app .vehicles-container .second-row {
  height: 240px;
}

#app .vehicles-container .personnel-card-large,
#app .vehicles-container .personnel-card-large.vehicle-info-card {
  flex: 0 0 480px;
  width: 480px;
  max-width: 480px;
  height: 240px !important;
  background: #121a28;
  border: 1px solid var(--cc-line);
  border-radius: 8px;
  box-shadow: none;
  padding: 14px;
  overflow: hidden;
  position: relative;
}

#app .vehicles-container .vehicle-info-content { height: 100%; gap: 14px; overflow: hidden; }
#app .vehicles-container .vehicle-image-container {
  width: 46%;
  height: 100%;
  border-radius: 6px;
  background: #0c121c;
  flex-shrink: 0;
  position: relative;
  overflow: hidden;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, .05) inset;
}
#app .vehicles-container .vehicle-image-container::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(180deg, transparent 60%, rgba(8, 12, 20, .55));
}
#app .vehicles-container .vehicle-image {
  transition: transform .5s cubic-bezier(.2, .7, .3, 1);
}
#app .vehicles-container .vehicle-info-card:hover .vehicle-image { transform: scale(1.04); }
#app .vehicles-container .no-image { color: var(--cc-text-mute); }
#app .vehicles-container .vehicle-details {
  flex: 1;
  min-width: 0;
  padding: 0;
  overflow: hidden;
  background: none;
}

#app .vehicles-container .vehicle-info-title {
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 2px;
  color: var(--cc-text-mute);
  border-bottom: 1px solid var(--cc-line-soft);
}

#app .vehicles-container .remark-content {
  flex: 1;
  min-width: 0;
  font-size: 13px;
  line-height: 1.55;
  color: var(--cc-text-dim);
  font-family: inherit;
  white-space: pre-wrap;
  word-break: break-word;
  overflow-wrap: anywhere;
  overflow-y: auto;
}

/* ===== 车辆信息 → 参数表（dash-fix 把「【水】1吨」解析成 键/值 行） ===== */
#app .vehicle-details.v-details--spec .remark-content { display: none; }
#app .vehicle-details.v-details--spec .vehicle-info-title {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  margin-bottom: 6px;
  padding-bottom: 6px;
}
#app .v-spec__n,
#app .v-spec-full__n {
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0;
  font-style: normal;
  color: var(--cc-text-mute);
  padding: 1px 6px;
  border-radius: 999px;
  background: rgba(255, 255, 255, .05);
  border: 1px solid var(--cc-line-soft);
  font-variant-numeric: tabular-nums;
}

#app .v-spec {
  flex: 1;
  min-height: 0;
  min-width: 0;
  overflow: hidden;
  position: relative;
  display: flex;
  flex-direction: column;
  scrollbar-width: none;
}
#app .v-spec::-webkit-scrollbar { display: none; }

#app .v-spec__row {
  display: flex;
  align-items: baseline;
  gap: 10px;
  min-height: 25px;
  padding: 3px 0;
  border-bottom: 1px dashed rgba(255, 255, 255, .06);
  font-size: 12px;
  line-height: 1.4;
  animation: v-spec-in .32s cubic-bezier(.2, .7, .3, 1) both;
  animation-delay: calc(var(--i, 0) * 28ms);
}
#app .v-spec__row:last-child { border-bottom: 0; }
#app .v-spec__k {
  flex: none;
  color: var(--cc-text-mute);
  letter-spacing: .3px;
  white-space: nowrap;
  position: relative;
  padding-left: 10px;
}
#app .v-spec__k::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  width: 4px;
  height: 4px;
  margin-top: -2px;
  border-radius: 1px;
  transform: rotate(45deg);
  background: rgba(232, 93, 106, .75);
}
#app .v-spec__v {
  flex: 1;
  min-width: 0;
  text-align: right;
  color: var(--cc-text);
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
#app .v-spec__row--plain .v-spec__v {
  text-align: left;
  font-weight: 500;
  color: var(--cc-text-dim);
  white-space: normal;
}
#app .v-spec__row:hover .v-spec__v { color: #fff; }
#app .v-spec__row:hover .v-spec__k { color: var(--cc-text-dim); }

/* 放不下：底部渐隐 + 提示 */
#app .v-spec.is-overflow::after {
  content: "悬停查看全部参数";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 44px;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  padding-bottom: 2px;
  font-size: 10px;
  letter-spacing: 1px;
  color: var(--cc-text-mute);
  background: linear-gradient(180deg, rgba(18, 26, 40, 0), #121a28 70%);
  pointer-events: none;
}
#app .on-duty-vehicles .v-spec.is-overflow::after {
  background: linear-gradient(180deg, rgba(18, 26, 40, 0), #121a28 70%);
}
#app .on-duty-vehicles .v-spec__row { min-height: 23px; padding: 2px 0; font-size: 11.5px; }

#app .v-spec__empty {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--cc-text-mute);
  font-size: 12px;
  letter-spacing: 1px;
  border: 1px dashed var(--cc-line);
  border-radius: 6px;
}

/* 悬停在文字区：整卡展开成两列完整参数面板 */
#app .v-spec-full {
  position: absolute;
  inset: 8px;
  z-index: 6;
  display: flex;
  flex-direction: column;
  padding: 12px 16px 10px;
  border-radius: 8px;
  background: rgba(13, 19, 31, .985);
  -webkit-backdrop-filter: blur(6px);
          backdrop-filter: blur(6px);
  border: 1px solid rgba(232, 93, 106, .35);
  box-shadow: 0 0 0 1px rgba(232, 93, 106, .12) inset, 0 20px 40px -18px rgba(0, 0, 0, .8);
  opacity: 0;
  transform: translateY(8px) scale(.985);
  pointer-events: none;
  transition: opacity .22s ease, transform .26s cubic-bezier(.2, .7, .3, 1);
}
#app .v-spec-full::before {
  content: "";
  position: absolute;
  top: 0;
  left: 12%;
  right: 12%;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(232, 93, 106, .9), transparent);
}
#app .vehicle-info-card:has(.v-spec.is-overflow):has(.vehicle-details:hover) .v-spec-full,
#app .personnel-card-large:has(.v-spec.is-overflow):has(.vehicle-details:hover) .v-spec-full,
#app :is(.vehicle-info-card, .personnel-card-large):has(.v-spec.is-overflow) .v-spec-full:hover {
  opacity: 1;
  transform: none;
  pointer-events: auto;
}
#app .v-spec-full__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 2px;
  color: var(--cc-text-mute);
  padding-bottom: 8px;
  margin-bottom: 6px;
  border-bottom: 1px solid var(--cc-line-soft);
}
#app .v-spec-full__grid {
  flex: 1;
  min-height: 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
  column-gap: 22px;
  align-content: start;
  overflow-y: auto;
  scrollbar-width: none;
}
#app .v-spec-full__grid::-webkit-scrollbar { display: none; }
#app .v-spec-full__grid .v-spec__row {
  min-height: 27px;
  font-size: 12px;
  animation: none;
  opacity: 0;
  transform: translateY(4px);
  transition: opacity .25s ease, transform .3s cubic-bezier(.2, .7, .3, 1);
  transition-delay: calc(var(--i, 0) * 18ms);
}
#app .vehicle-info-card:has(.v-spec.is-overflow):has(.vehicle-details:hover) .v-spec-full__grid .v-spec__row,
#app .personnel-card-large:has(.v-spec.is-overflow):has(.vehicle-details:hover) .v-spec-full__grid .v-spec__row,
#app :is(.vehicle-info-card, .personnel-card-large):has(.v-spec.is-overflow) .v-spec-full:hover .v-spec-full__grid .v-spec__row {
  opacity: 1;
  transform: none;
}
#app .v-spec-full__grid .v-spec__row--plain { grid-column: 1 / -1; }

@keyframes v-spec-in {
  from { opacity: 0; transform: translateX(-6px); }
  to { opacity: 1; transform: none; }
}

#app .vehicles-container .small-cards-container {
  flex: 1;
  min-width: 0;
  display: flex;
  gap: 15px;
  height: 100%;
}

#app .vehicles-container .personnel-card-small {
  flex: 1 1 0;
  width: auto;
  min-width: 0;
  max-width: 150px;
  height: 100%;
  background: rgba(255, 255, 255, .025);
  border: 1px dashed rgba(180, 196, 220, .22);
  border-radius: 8px;
  box-shadow: none;
  padding: 5px;
  overflow: hidden;
  transition: transform .2s cubic-bezier(.2, .7, .3, 1), border-color .2s ease, background-color .2s ease, box-shadow .2s ease;
}

#app .vehicles-container .personnel-card-small:hover {
  transform: translateY(-2px);
  border-color: rgba(91, 155, 232, .45);
  background: rgba(91, 155, 232, .06);
}

#app .vehicles-container .personnel-card-small.drag-over {
  border: 1px solid rgba(91, 155, 232, .75) !important;
  background: rgba(91, 155, 232, .14) !important;
  box-shadow: 0 0 0 3px rgba(91, 155, 232, .16), 0 14px 28px -16px rgba(91, 155, 232, .7);
  transform: scale(1.03);
}

#app .vehicles-container .personnel-card-small.drag-over .empty-text { color: #9cc0f1; }

#app .vehicles-container .personnel-card-small.position-6-occupied {
  border-color: rgba(212, 180, 106, .55) !important;
  background: rgba(212, 180, 106, .08) !important;
  box-shadow: 0 0 0 1px rgba(212, 180, 106, .18);
}

#app .vehicles-container .personnel-card-small.position-7-occupied {
  border-color: rgba(224, 154, 69, .55) !important;
  background: rgba(224, 154, 69, .08) !important;
  box-shadow: 0 0 0 1px rgba(224, 154, 69, .18);
}

#app .vehicles-container .personnel-card-small.position-6-occupied .person-card-content,
#app .vehicles-container .personnel-card-small.position-7-occupied .person-card-content { background: transparent !important; }

#app .vehicles-container .assigned-personnel-item {
  background: transparent;
  box-shadow: none;
  border-radius: 0;
}

#app .vehicles-container .assigned-personnel-item:hover { box-shadow: none; transform: none; }

#app .vehicles-container .person-avatar-container {
  border-radius: 0;
  box-shadow: none;
  background: #1b2636;
}

#app .vehicles-container .person-card-avatar { border-radius: 0; background: #1b2636; }
#app .vehicles-container .person-card-default-avatar { background: #1b2636; color: var(--cc-text-dim); border-radius: 0; }

#app .vehicles-container .person-card-role-name {
  padding: 6px 4px 4px;
  font-size: 12.5px;
  font-weight: 650;
  letter-spacing: .6px;
  color: var(--cc-text);
  background: #10171f;
  border-top: 1px solid var(--cc-line-soft);
}

#app .vehicles-container .person-card-specialty {
  padding: 4px 4px 7px;
  background: #10171f;
  border-top: 0;
  min-height: 26px;
}

#app .vehicles-container .personnel-card-small .specialty-tag {
  background: rgba(91, 155, 232, .12);
  color: #9cc0f1;
  border: 1px solid rgba(91, 155, 232, .32);
  box-shadow: none;
  border-radius: 4px;
  font-size: 9.5px;
  font-weight: 600;
  letter-spacing: .3px;
  padding: 1px 6px;
}

#app .vehicles-container .personnel-card-small .specialty-tag:hover { transform: none; box-shadow: none; }
#app .vehicles-container .specialty-empty { color: var(--cc-text-mute); font-style: normal; }

#app .vehicles-container .empty-text {
  color: var(--cc-text-mute);
  letter-spacing: .5px;
  font-weight: 500;
}

#app .vehicles-container .empty-text::before { color: rgba(180, 196, 220, .35); }
#app .vehicles-container .personnel-card-small:hover .empty-text::before { color: #9cc0f1; }
#app .vehicles-container .personnel-card-small.drag-over .empty-text::before { color: #7fb2f2; }

@media (prefers-reduced-motion: no-preference) {
  #app .vehicles-container .vehicle-selection-bar { animation: cc-rise .4s cubic-bezier(.2, .7, .3, 1) backwards; }
  #app .vehicles-container .personnel-list-container { animation: cc-rise .45s cubic-bezier(.2, .7, .3, 1) .05s backwards; }
  #app .vehicles-container .vehicle-personnel-container { animation: cc-rise .5s cubic-bezier(.2, .7, .3, 1) .1s backwards; }
}

/* ==========================================================================
   超管控制台（/super/dashboard）· 整页重做
   --------------------------------------------------------------------------
   原版是紫粉霓虹渐变 + emoji 图标。这里改成和队站首页同一套"飞行甲板"语言：
   深海军蓝底 + 极淡网格、细描边分层、等宽白数字、状态用同色半透明胶囊。
   emoji 全部隐掉，换成 CSS mask 的线性图标（跟随 currentColor），
   三张统计卡右侧放和首页同款的动态插画（/icons/*.webp）。
   动态：数字滚动（dash-fix）、进度条从 0 长出、卡片错位入场、悬停抬起、在线态呼吸。
   选择器统一 #app .super-dashboard 前缀，特异度 (1,2,0) 稳定压过 scoped 的 (0,2,0)。
   ========================================================================== */

#app .super-dashboard {
  --sa-red: #e85d6a; --sa-blue: #5b9be8; --sa-green: #3ecf86; --sa-gold: #d4b46a; --sa-orange: #e09a45; --sa-cyan: #4cc2d8;
  --i-building: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 21h18'/%3E%3Cpath d='M5 21V7l7-4 7 4v14'/%3E%3Cpath d='M9 9h1M9 12.5h1M9 16h1'/%3E%3Cpath d='M14 9h1M14 12.5h1M14 16h1'/%3E%3Cpath d='M11 21v-3h2v3'/%3E%3C/svg%3E");
  --i-activity: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 12h4l3-8 4 16 3-8h4'/%3E%3C/svg%3E");
  --i-chart: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 20v-8'/%3E%3Cpath d='M10 20V5'/%3E%3Cpath d='M16 20v-5'/%3E%3Cpath d='M2 20h20'/%3E%3C/svg%3E");
  --i-unlock: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 11h14v10H5z'/%3E%3Cpath d='M8 11V7a4 4 0 0 1 7.6-1.7'/%3E%3Cpath d='M12 15v2'/%3E%3C/svg%3E");
  --i-download: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3v12'/%3E%3Cpath d='M7 10l5 5 5-5'/%3E%3Cpath d='M4 20h16'/%3E%3C/svg%3E");
  --i-trash: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 7h16'/%3E%3Cpath d='M10 11v6M14 11v6'/%3E%3Cpath d='M6 7l1 13h10l1-13'/%3E%3Cpath d='M9 7V4h6v3'/%3E%3C/svg%3E");
  --i-alert: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3.5 21.5 20H2.5z'/%3E%3Cpath d='M12 9.5v5'/%3E%3Cpath d='M12 17.5h.01'/%3E%3C/svg%3E");
  --i-filetext: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 3H6v18h12V7z'/%3E%3Cpath d='M14 3v4h4'/%3E%3Cpath d='M9 12h6M9 16h6'/%3E%3C/svg%3E");
  --i-refresh: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 11a8 8 0 0 0-14.3-3.6'/%3E%3Cpath d='M4 13a8 8 0 0 0 14.3 3.6'/%3E%3Cpath d='M4 4v4.5h4.5'/%3E%3Cpath d='M20 20v-4.5h-4.5'/%3E%3C/svg%3E");
  --i-filter: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 5h16l-6 8v6l-4-2v-4z'/%3E%3C/svg%3E");
  --i-sliders: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 6h9M17 6h3'/%3E%3Cpath d='M4 12h3M11 12h9'/%3E%3Cpath d='M4 18h11M19 18h1'/%3E%3Cpath d='M13 4v4M7 10v4M15 16v4'/%3E%3C/svg%3E");
  --i-list: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 6h12M8 12h12M8 18h12'/%3E%3Cpath d='M4 6h.01M4 12h.01M4 18h.01'/%3E%3C/svg%3E");
  --i-check: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21a9 9 0 1 0 0-18 9 9 0 0 0 0 18z'/%3E%3Cpath d='M8 12l3 3 5-6'/%3E%3C/svg%3E");
  --i-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14'/%3E%3Cpath d='M13 6l6 6-6 6'/%3E%3C/svg%3E");
  color: var(--cc-text);
  font-family: -apple-system, "PingFang SC", "Microsoft YaHei", system-ui, sans-serif;
  background-color: var(--cc-bg-0);
  background-image:
    linear-gradient(rgba(180, 196, 220, .035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(180, 196, 220, .035) 1px, transparent 1px),
    radial-gradient(900px 380px at 50% -12%, rgba(196, 42, 60, .07), transparent 58%),
    linear-gradient(180deg, var(--cc-bg-1) 0%, var(--cc-bg-0) 100%);
  background-size: 48px 48px, 48px 48px, auto, auto;
  background-attachment: fixed;
}

#app .super-dashboard::before { display: none; }

/* 通用：把 emoji 变成 mask 图标 */
#app .super-dashboard .sa-ico,
#app .super-dashboard .title-icon,
#app .super-dashboard .station-icon,
#app .super-dashboard .action-icon,
#app .super-dashboard .check-icon,
#app .super-dashboard .empty-icon,
#app .super-dashboard .refresh-btn > span:first-child,
#app .super-dashboard .filter-btn > span:first-child,
#app .super-dashboard .clear-btn > span:first-child {
  display: inline-block;
  width: 16px;
  height: 16px;
  font-size: 0 !important;
  line-height: 0;
  color: inherit;
  background-color: currentColor;
  -webkit-mask: var(--i) center / contain no-repeat;
          mask: var(--i) center / contain no-repeat;
  flex-shrink: 0;
  opacity: 1;
}

/* ---------- 头部 ---------- */
#app .super-dashboard .dashboard-header {
  padding: 14px 28px;
  background: rgba(17, 24, 39, .92);
  border-bottom: 1px solid var(--cc-line);
  box-shadow: none;
  backdrop-filter: blur(8px);
}

#app .super-dashboard .main-title {
  font-size: 20px;
  font-weight: 650;
  letter-spacing: 3px;
  color: var(--cc-text);
  background: none;
  -webkit-text-fill-color: currentColor;
}

#app .super-dashboard .sub-title {
  margin-top: 3px;
  font-size: 11px;
  letter-spacing: 2.5px;
  color: var(--cc-text-mute);
}

#app .super-dashboard .date-text {
  font-size: 11px;
  letter-spacing: 1.5px;
  color: var(--cc-text-mute);
  margin-bottom: 2px;
}

#app .super-dashboard .time-text {
  font-size: 28px;
  font-weight: 600;
  letter-spacing: 2px;
  font-variant-numeric: tabular-nums;
  font-family: ui-monospace, "SF Mono", "Menlo", "Consolas", monospace;
  color: var(--cc-text);
  background: none;
  -webkit-text-fill-color: currentColor;
}

#app .super-dashboard .system-status {
  gap: 8px;
  padding: 5px 12px;
  border-radius: 4px;
  background: rgba(62, 207, 134, .08);
  border: 1px solid rgba(62, 207, 134, .28);
}

#app .super-dashboard .system-status span {
  font-size: 12px;
  letter-spacing: 1.2px;
  color: #7ed9a8;
}

#app .super-dashboard .status-indicator {
  width: 7px;
  height: 7px;
  background: var(--sa-green);
  box-shadow: 0 0 0 0 rgba(62, 207, 134, .5);
  animation: sa-pulse 2.2s ease-out infinite;
}

@keyframes sa-pulse {
  0%   { box-shadow: 0 0 0 0 rgba(62, 207, 134, .55); }
  70%  { box-shadow: 0 0 0 7px rgba(62, 207, 134, 0); }
  100% { box-shadow: 0 0 0 0 rgba(62, 207, 134, 0); }
}

#app .super-dashboard .dashboard-content { padding: 20px 28px 24px; gap: 18px; }

/* ---------- 三张统计卡 ---------- */
#app .super-dashboard .stats-row { gap: 14px; }

#app .super-dashboard .stat-card {
  --acc: var(--sa-blue);
  position: relative;
  gap: 0;
  min-height: 104px;
  padding: 16px 112px 16px 20px;
  border-radius: 8px;
  background: #161e2d;
  border: 1px solid var(--cc-line);
  box-shadow: none;
  overflow: hidden;
  transition: transform .2s cubic-bezier(.2, .7, .3, 1), border-color .2s ease, background-color .2s ease, box-shadow .2s ease;
}

#app .super-dashboard .stat-users    { --acc: var(--sa-red); }
#app .super-dashboard .stat-stations { --acc: var(--sa-blue); }
#app .super-dashboard .stat-online   { --acc: var(--sa-green); }

#app .super-dashboard .stat-card::before,
#app .super-dashboard .stat-decoration { display: none; }

#app .super-dashboard .stat-card:hover {
  transform: translateY(-2px);
  background: #192335;
  border-color: color-mix(in srgb, var(--acc) 55%, transparent);
  box-shadow: 0 12px 28px -16px color-mix(in srgb, var(--acc) 75%, transparent), inset 0 1px 0 rgba(255, 255, 255, .05);
}

/* 图标位：emoji 隐掉，换成首页同款动态插画 */
#app .super-dashboard .stat-icon {
  position: absolute;
  top: 50%;
  right: 14px;
  width: 80px;
  height: 80px;
  margin-top: -40px;
  border: 0;
  border-radius: 0;
  background: center / contain no-repeat;
  filter: drop-shadow(0 4px 10px rgba(0, 0, 0, .35));
  transition: transform .25s cubic-bezier(.2, .7, .3, 1);
}

#app .super-dashboard .stat-icon span { display: none; }
#app .super-dashboard .stat-card:hover .stat-icon { transform: translateY(-2px) scale(1.08); }
#app .super-dashboard .stat-users .stat-icon    { background-image: url("/icons/kpi-people.webp"); }
#app .super-dashboard .stat-stations .stat-icon { background-image: url("/icons/kpi-station.webp"); }
#app .super-dashboard .stat-online .stat-icon   { background-image: url("/icons/kpi-online.webp"); }

#app .super-dashboard .stat-value {
  display: flex;
  align-items: baseline;
  gap: 6px;
  margin-bottom: 9px;
  font-size: 42px;
  font-weight: 750;
  line-height: 1;
  letter-spacing: -.8px;
  font-variant-numeric: tabular-nums;
  font-family: ui-monospace, "SF Mono", "Menlo", "Consolas", monospace;
  color: color-mix(in srgb, var(--acc) 72%, #fff);
  transform-origin: left center;
  transition: color .2s ease, text-shadow .2s ease;
}

#app .super-dashboard .stat-value::after {
  content: "人";
  font: 500 13px/1 -apple-system, "PingFang SC", "Microsoft YaHei", system-ui, sans-serif;
  letter-spacing: 1px;
  color: var(--cc-text-mute);
}

#app .super-dashboard .stat-stations .stat-value::after { content: "个"; }
#app .super-dashboard .stat-card:hover .stat-value { text-shadow: 0 0 22px color-mix(in srgb, var(--acc) 55%, transparent); }
#app .super-dashboard .stat-value.is-bump { animation: cc-kpi-bump .6s cubic-bezier(.2, .8, .3, 1); }

#app .super-dashboard .stat-label {
  font-size: 13px;
  font-weight: 400;
  letter-spacing: 2px;
  color: var(--cc-text-dim);
}

/* 在线用户：标签前加一颗呼吸的绿点 */
#app .super-dashboard .stat-online .stat-label { display: flex; align-items: center; gap: 8px; }
#app .super-dashboard .stat-online .stat-label::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--sa-green);
  animation: sa-pulse 2.2s ease-out infinite;
}

/* ---------- 版面 ----------
   原版 .main-grid 是「队站面板 | 右栏」两列，队站面板被拉到和右栏一样高，站少时下面一大片空；
   登录记录另起一行占满整宽。这里让 .main-grid display:contents，把它的两个孩子和登录记录
   一起放进 .dashboard-content 的网格：左列 = 队站统计 + 登录记录，右列 = IP 解锁 + 系统管理。 */
#app .super-dashboard .dashboard-content {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 380px;
  grid-template-areas:
    "stats    stats"
    "stations right"
    "logs     right";
  align-items: start;
  gap: 18px;
}

#app .super-dashboard .stats-row     { grid-area: stats; }
#app .super-dashboard .main-grid     { display: contents; }
#app .super-dashboard .station-panel { grid-area: stations; }
#app .super-dashboard .right-panels  { grid-area: right; gap: 18px; }
#app .super-dashboard .logs-panel    { grid-area: logs; }

@media (max-width: 1100px) {
  #app .super-dashboard .dashboard-content {
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas: "stats" "stations" "right" "logs";
  }
}

#app .super-dashboard .panel {
  border-radius: 8px;
  background: #141c2a;
  border: 1px solid var(--cc-line);
  box-shadow: none;
}

#app .super-dashboard .panel-header {
  padding: 13px 18px;
  background: linear-gradient(180deg, rgba(255, 255, 255, .03), transparent);
  border-bottom: 1px solid var(--cc-line-soft);
}

#app .super-dashboard .panel-title {
  gap: 9px;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 2px;
  color: var(--cc-text);
}

#app .super-dashboard .title-icon { color: var(--cc-text-mute); }
#app .super-dashboard .station-panel .title-icon { --i: var(--i-activity); color: var(--sa-red); }
#app .super-dashboard .ip-panel .title-icon      { --i: var(--i-unlock);   color: var(--sa-gold); }
#app .super-dashboard .actions-panel .title-icon { --i: var(--i-sliders);  color: var(--sa-blue); }
#app .super-dashboard .logs-panel .title-icon    { --i: var(--i-list);     color: var(--sa-cyan); }

#app .super-dashboard .panel-body { padding: 16px 18px; }
#app .super-dashboard .station-panel { min-height: 0; }

/* 幽灵按钮：刷新 / 筛选 / 清除记录 */
#app .super-dashboard .refresh-btn,
#app .super-dashboard .filter-btn,
#app .super-dashboard .clear-btn {
  gap: 7px;
  height: 30px;
  padding: 0 12px;
  border-radius: 5px;
  font-size: 12px;
  letter-spacing: 1px;
  background: rgba(255, 255, 255, .03);
  border: 1px solid var(--cc-line);
  color: var(--cc-text-dim);
  transition: background-color .15s ease, border-color .15s ease, color .15s ease, transform .15s ease;
}

#app .super-dashboard .refresh-btn > span:first-child { --i: var(--i-refresh); width: 14px; height: 14px; }
#app .super-dashboard .filter-btn  > span:first-child { --i: var(--i-filter);  width: 14px; height: 14px; }
#app .super-dashboard .clear-btn   > span:first-child { --i: var(--i-trash);   width: 14px; height: 14px; }

#app .super-dashboard .refresh-btn:hover,
#app .super-dashboard .filter-btn:hover {
  color: var(--cc-text);
  background: rgba(255, 255, 255, .06);
  border-color: rgba(91, 155, 232, .55);
}

#app .super-dashboard .refresh-btn:active > span:first-child { animation: sa-spin .5s ease; }
@keyframes sa-spin { to { transform: rotate(360deg); } }

#app .super-dashboard .clear-btn { color: #f0a0a8; }
#app .super-dashboard .clear-btn:hover { color: #ffc2c7; background: rgba(232, 93, 106, .1); border-color: rgba(232, 93, 106, .5); }

/* ---------- 队站卡 ---------- */
#app .super-dashboard .station-grid { grid-template-columns: repeat(auto-fill, minmax(255px, 1fr)); gap: 14px; align-content: start; }

#app .super-dashboard .station-card {
  --acc: var(--sa-green);
  --acc-rgb: 62, 207, 134;
  position: relative;
  padding: 16px 18px 14px;
  border-radius: 8px;
  background: #161e2d;
  border: 1px solid var(--cc-line);
  box-shadow: none;
  overflow: hidden;
  transition: transform .22s cubic-bezier(.2, .7, .3, 1), border-color .22s ease, background-color .22s ease, box-shadow .22s ease;
}

#app .super-dashboard .station-card:has(.rate-medium) { --acc: var(--sa-gold); --acc-rgb: 212, 180, 106; }
#app .super-dashboard .station-card:has(.rate-low)    { --acc: var(--sa-red);  --acc-rgb: 232, 93, 106; }

#app .super-dashboard .station-card::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: radial-gradient(160px 80px at 100% 0%, rgba(var(--acc-rgb), .10), transparent 70%);
  pointer-events: none;
}

#app .super-dashboard .station-card:hover {
  transform: translateY(-3px);
  background: #192335;
  border-color: rgba(var(--acc-rgb), .55);
  box-shadow: 0 14px 28px -16px rgba(var(--acc-rgb), .6), inset 0 1px 0 rgba(255, 255, 255, .05);
}

#app .super-dashboard .station-card:active { transform: translateY(-1px) scale(.99); transition-duration: .08s; }

#app .super-dashboard .station-top { margin-bottom: 12px; }

#app .super-dashboard .station-name {
  gap: 8px;
  font-size: 14px;
  font-weight: 650;
  letter-spacing: .5px;
  color: var(--cc-text);
}

#app .super-dashboard .station-icon { --i: var(--i-building); width: 16px; height: 16px; color: var(--cc-text-mute); }
#app .super-dashboard .station-card:hover .station-icon { color: var(--acc); }

#app .super-dashboard .rate-badge {
  padding: 2px 8px;
  border-radius: 4px;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .3px;
  font-variant-numeric: tabular-nums;
  font-family: ui-monospace, "SF Mono", "Menlo", "Consolas", monospace;
  background: rgba(var(--acc-rgb), .12);
  color: rgb(var(--acc-rgb));
  border: 1px solid rgba(var(--acc-rgb), .35);
}

#app .super-dashboard .rate-badge.rate-high,
#app .super-dashboard .rate-badge.rate-medium,
#app .super-dashboard .rate-badge.rate-low {
  background: rgba(var(--acc-rgb), .12);
  color: color-mix(in srgb, rgb(var(--acc-rgb)) 75%, #fff);
  border-color: rgba(var(--acc-rgb), .35);
}

#app .super-dashboard .station-stats { gap: 28px; margin: 4px 0 14px; }
#app .super-dashboard .mini-stat { gap: 3px; }
#app .super-dashboard .mini-label { font-size: 11px; letter-spacing: 1.5px; color: var(--cc-text-mute); }

#app .super-dashboard .mini-value {
  font-size: 24px;
  font-weight: 700;
  line-height: 1;
  font-variant-numeric: tabular-nums;
  font-family: ui-monospace, "SF Mono", "Menlo", "Consolas", monospace;
  color: var(--cc-text);
  transform-origin: left center;
}

#app .super-dashboard .mini-value.on-duty  { color: #8ae9b9; }
#app .super-dashboard .mini-value.off-duty { color: #f0a0a8; }
#app .super-dashboard .mini-value.is-bump  { animation: cc-kpi-bump .6s cubic-bezier(.2, .8, .3, 1); }

/* 进度条：进场从 0 长到位 */
#app .super-dashboard .station-progress {
  height: 4px;
  margin-bottom: 12px;
  border-radius: 2px;
  background: rgba(255, 255, 255, .07);
  overflow: hidden;
}

#app .super-dashboard .station-progress .progress-fill {
  border-radius: 2px;
  background: linear-gradient(90deg, rgba(var(--acc-rgb), .7), rgb(var(--acc-rgb)));
  box-shadow: 0 0 10px rgba(var(--acc-rgb), .45);
  transform-origin: left center;
  animation: sa-grow .9s cubic-bezier(.2, .7, .3, 1) both;
  transition: width .6s cubic-bezier(.2, .7, .3, 1);
}

@keyframes sa-grow {
  from { transform: scaleX(0); }
  to   { transform: scaleX(1); }
}

#app .super-dashboard .enter-hint {
  gap: 6px;
  font-size: 11px;
  letter-spacing: 1px;
  color: var(--cc-text-mute);
}

#app .super-dashboard .station-card:hover .enter-hint { color: color-mix(in srgb, var(--acc) 80%, #fff); }

#app .super-dashboard .enter-hint .arrow {
  display: inline-block;
  width: 14px;
  height: 14px;
  font-size: 0;
  background-color: currentColor;
  -webkit-mask: var(--i-arrow) center / contain no-repeat;
          mask: var(--i-arrow) center / contain no-repeat;
}

#app .super-dashboard .empty-state { color: var(--cc-text-mute); letter-spacing: 1px; }
#app .super-dashboard .empty-icon { --i: var(--i-chart); width: 36px; height: 36px; color: var(--cc-text-mute); opacity: .6; }

/* ---------- IP 解锁 ---------- */
#app .super-dashboard .ip-input,
#app .super-dashboard .filter-input,
#app .super-dashboard .filter-select,
#app .super-dashboard .page-size-select {
  background: rgba(10, 15, 24, .7);
  border: 1px solid var(--cc-line);
  border-radius: 5px;
  color: var(--cc-text);
  font-size: 13px;
  transition: border-color .15s ease, box-shadow .15s ease;
}

#app .super-dashboard .ip-input { padding: 9px 12px; }
#app .super-dashboard .ip-input::placeholder,
#app .super-dashboard .filter-input::placeholder { color: var(--cc-text-mute); }

#app .super-dashboard .ip-input:focus,
#app .super-dashboard .filter-input:focus,
#app .super-dashboard .filter-select:focus {
  border-color: rgba(91, 155, 232, .7);
  box-shadow: 0 0 0 3px rgba(91, 155, 232, .15);
}

#app .super-dashboard .unlock-btn,
#app .super-dashboard .search-btn {
  padding: 9px 16px;
  border-radius: 5px;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 1px;
  color: #0e141f;
  background: linear-gradient(180deg, #7fb2f2, #5b9be8);
  border: 1px solid rgba(91, 155, 232, .6);
  box-shadow: none;
  transition: transform .15s ease, box-shadow .15s ease, filter .15s ease;
}

#app .super-dashboard .unlock-btn:hover:not(:disabled),
#app .super-dashboard .search-btn:hover {
  transform: translateY(-1px);
  filter: brightness(1.06);
  box-shadow: 0 8px 18px -10px rgba(91, 155, 232, .8);
}

#app .super-dashboard .locked-list { background: rgba(255, 255, 255, .025); border: 1px solid var(--cc-line-soft); border-radius: 6px; }
#app .super-dashboard .list-header { font-size: 12px; letter-spacing: 1px; color: var(--cc-text-dim); }
#app .super-dashboard .count-badge { border-radius: 4px; background: rgba(232, 93, 106, .14); color: #f0a0a8; border: 1px solid rgba(232, 93, 106, .35); }
#app .super-dashboard .locked-item { border-radius: 6px; background: rgba(232, 93, 106, .06); border: 1px solid rgba(232, 93, 106, .2); }
#app .super-dashboard .ip-address { font-family: ui-monospace, "SF Mono", "Menlo", "Consolas", monospace; color: var(--cc-text); }
#app .super-dashboard .ip-time { color: #f0a0a8; }
#app .super-dashboard .mini-unlock-btn { border-radius: 4px; background: rgba(255, 255, 255, .04); border: 1px solid var(--cc-line); color: var(--cc-text-dim); }
#app .super-dashboard .mini-unlock-btn:hover { color: var(--cc-text); border-color: rgba(91, 155, 232, .55); background: rgba(91, 155, 232, .1); }

#app .super-dashboard .no-locked { gap: 8px; padding: 18px; font-size: 12px; letter-spacing: 1px; color: var(--cc-text-mute); }
#app .super-dashboard .check-icon { --i: var(--i-check); width: 16px; height: 16px; color: var(--sa-green); }

/* ---------- 系统管理 ---------- */
#app .super-dashboard .action-grid { gap: 10px; }

#app .super-dashboard .action-btn {
  --acc: var(--sa-blue);
  --acc-rgb: 91, 155, 232;
  gap: 9px;
  padding: 14px 10px 12px;
  border-radius: 8px;
  background: #161e2d;
  border: 1px solid var(--cc-line);
  color: var(--cc-text-dim);
  font-size: 12px;
  letter-spacing: 1px;
  transition: transform .18s cubic-bezier(.2, .7, .3, 1), border-color .18s ease, background-color .18s ease, color .18s ease, box-shadow .18s ease;
}

#app .super-dashboard .action-btn.warning { --acc: var(--sa-gold);   --acc-rgb: 212, 180, 106; }
#app .super-dashboard .action-btn.info    { --acc: var(--sa-cyan);   --acc-rgb: 76, 194, 216; }
#app .super-dashboard .action-btn.success { --acc: var(--sa-green);  --acc-rgb: 62, 207, 134; }
#app .super-dashboard .action-btn.danger  { --acc: var(--sa-red);    --acc-rgb: 232, 93, 106; }

#app .super-dashboard .action-btn:hover,
#app .super-dashboard .action-btn.warning:hover,
#app .super-dashboard .action-btn.info:hover,
#app .super-dashboard .action-btn.success:hover,
#app .super-dashboard .action-btn.danger:hover {
  transform: translateY(-2px);
  color: var(--cc-text);
  background: #192335;
  border-color: rgba(var(--acc-rgb), .55);
  box-shadow: 0 12px 24px -16px rgba(var(--acc-rgb), .8);
}

#app .super-dashboard .action-btn:active { transform: translateY(0) scale(.98); transition-duration: .08s; }

#app .super-dashboard .action-icon {
  width: 22px;
  height: 22px;
  color: var(--acc);
  transition: transform .18s ease;
}

#app .super-dashboard .action-btn:hover .action-icon { transform: translateY(-1px) scale(1.08); }
#app .super-dashboard .action-grid .action-btn:nth-child(1) .action-icon { --i: var(--i-chart); }
#app .super-dashboard .action-grid .action-btn:nth-child(2) .action-icon { --i: var(--i-unlock); }
#app .super-dashboard .action-grid .action-btn:nth-child(3) .action-icon { --i: var(--i-download); }
#app .super-dashboard .action-grid .action-btn:nth-child(4) .action-icon { --i: var(--i-trash); }
#app .super-dashboard .action-grid .action-btn:nth-child(5) .action-icon { --i: var(--i-alert); }
#app .super-dashboard .action-grid .action-btn:nth-child(6) .action-icon { --i: var(--i-filetext); }

/* ---------- 登录记录 ---------- */
#app .super-dashboard .logs-panel { max-height: none; }
#app .super-dashboard .filter-section { background: rgba(255, 255, 255, .02); border-bottom: 1px solid var(--cc-line-soft); }
#app .super-dashboard .filter-item label { font-size: 11px; letter-spacing: 1.5px; color: var(--cc-text-mute); }
#app .super-dashboard .reset-btn { border-radius: 5px; border: 1px solid var(--cc-line); color: var(--cc-text-dim); }
#app .super-dashboard .reset-btn:hover { color: var(--cc-text); border-color: rgba(180, 196, 220, .35); }

#app .super-dashboard .logs-table { border-collapse: separate; border-spacing: 0; }

#app .super-dashboard .logs-table th {
  padding: 9px 14px 10px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 1.5px;
  color: var(--cc-text-mute);
  background: transparent;
  border-bottom: 1px solid var(--cc-line);
}

#app .super-dashboard .logs-table td {
  padding: 11px 14px;
  color: var(--cc-text-dim);
  border-bottom: 1px solid var(--cc-line-soft);
  transition: background-color .15s ease;
}

#app .super-dashboard .logs-table tbody tr:hover td { background: rgba(255, 255, 255, .035); }
#app .super-dashboard .username { color: var(--cc-text); letter-spacing: .3px; }
#app .super-dashboard .ip,
#app .super-dashboard .time { font-family: ui-monospace, "SF Mono", "Menlo", "Consolas", monospace; font-variant-numeric: tabular-nums; }
#app .super-dashboard .ip { color: var(--cc-text-dim); }
#app .super-dashboard .time { font-size: 12px; color: var(--cc-text-mute); }
#app .super-dashboard .device { color: var(--cc-text-mute); }
#app .super-dashboard .fail-reason { color: #f0a0a8; }

#app .super-dashboard .user-type-badge,
#app .super-dashboard .status-badge {
  --tag: 150, 162, 184;
  padding: 2px 8px;
  border-radius: 4px;
  font-size: 11px;
  font-weight: 650;
  letter-spacing: .5px;
  background: rgba(var(--tag), .13);
  color: rgb(var(--tag));
  border: 1px solid rgba(var(--tag), .32);
}

#app .super-dashboard .user-type-badge.super   { --tag: 245, 120, 130; }
#app .super-dashboard .user-type-badge.admin   { --tag: 240, 190, 100; }
#app .super-dashboard .user-type-badge.station { --tag: 122, 176, 245; }
#app .super-dashboard .user-type-badge.user    { --tag: 96, 222, 158; }
#app .super-dashboard .status-badge.success    { --tag: 96, 222, 158; }
#app .super-dashboard .status-badge.failed     { --tag: 245, 120, 130; }

#app .super-dashboard .pagination { border-top: 1px solid var(--cc-line-soft); }
#app .super-dashboard .total { font-size: 12px; letter-spacing: .5px; color: var(--cc-text-mute); font-variant-numeric: tabular-nums; }
#app .super-dashboard .page-info { font-family: ui-monospace, "SF Mono", "Menlo", "Consolas", monospace; color: var(--cc-text-dim); }

#app .super-dashboard .page-btn {
  border-radius: 5px;
  background: rgba(255, 255, 255, .03);
  border: 1px solid var(--cc-line);
  color: var(--cc-text-dim);
}

#app .super-dashboard .page-btn:hover:not(:disabled) { color: var(--cc-text); background: rgba(255, 255, 255, .06); border-color: rgba(91, 155, 232, .55); }

#app .super-dashboard .dashboard-footer {
  padding: 12px 28px;
  font-size: 11px;
  letter-spacing: 2px;
  color: var(--cc-text-mute);
  background: transparent;
  border-top: 1px solid var(--cc-line-soft);
}

/* ---------- 入场 ---------- */
@media (prefers-reduced-motion: no-preference) {
  #app .super-dashboard .stat-card,
  #app .super-dashboard .panel { animation: cc-rise .5s cubic-bezier(.2, .7, .3, 1) backwards; }
  #app .super-dashboard .stats-row > :nth-child(2) { animation-delay: .05s; }
  #app .super-dashboard .stats-row > :nth-child(3) { animation-delay: .10s; }
  #app .super-dashboard .station-panel { animation-delay: .16s; }
  #app .super-dashboard .ip-panel { animation-delay: .20s; }
  #app .super-dashboard .actions-panel { animation-delay: .24s; }
  #app .super-dashboard .logs-panel { animation-delay: .28s; }
  #app .super-dashboard .station-card { animation: cc-rise .45s cubic-bezier(.2, .7, .3, 1) backwards; }
  #app .super-dashboard .station-card:nth-child(2) { animation-delay: .06s; }
  #app .super-dashboard .station-card:nth-child(3) { animation-delay: .12s; }
  #app .super-dashboard .station-card:nth-child(4) { animation-delay: .18s; }
  #app .super-dashboard .station-card:nth-child(n+5) { animation-delay: .24s; }
}

@media (prefers-reduced-motion: reduce) {
  #app .super-dashboard .status-indicator,
  #app .super-dashboard .stat-online .stat-label::before,
  #app .super-dashboard .station-progress .progress-fill { animation: none; }
}

/* ---------- 超管控制台 · 队站管理员在线状态（dash-fix 注入） ---------- */
#app .super-dashboard .station-name { flex-wrap: wrap; row-gap: 6px; }

#app .super-dashboard .sa-presence {
  --p: 125, 139, 163;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 2px 8px 2px 7px;
  border-radius: 4px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .5px;
  line-height: 1.3;
  color: rgb(var(--p));
  background: rgba(var(--p), .10);
  border: 1px solid rgba(var(--p), .28);
  white-space: nowrap;
}

#app .super-dashboard .sa-presence::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: rgb(var(--p));
  flex-shrink: 0;
}

#app .super-dashboard .sa-presence.is-online { --p: 62, 207, 134; }
#app .super-dashboard .sa-presence.is-online::before { animation: sa-pulse 2s ease-out infinite; }
#app .super-dashboard .sa-presence.is-recent { --p: 212, 180, 106; }
#app .super-dashboard .sa-presence.is-off,
#app .super-dashboard .sa-presence.is-unknown { --p: 125, 139, 163; }
#app .super-dashboard .sa-presence.is-off::before { background: transparent; box-shadow: inset 0 0 0 1.5px rgb(var(--p)); }

/* 在线用户卡下面的名单 */
#app .super-dashboard .stat-online { padding-bottom: 14px; }

#app .super-dashboard .sa-online-list {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  margin-top: 10px;
  max-width: calc(100% - 8px);
}

#app .super-dashboard .sa-online-head {
  width: 100%;
  font-size: 11px;
  letter-spacing: 1px;
  color: var(--cc-text-mute);
  font-variant-numeric: tabular-nums;
}

#app .super-dashboard .sa-online-item,
#app .super-dashboard .sa-online-more,
#app .super-dashboard .sa-online-empty {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 2px 8px;
  border-radius: 4px;
  font-size: 11px;
  letter-spacing: .3px;
  color: var(--cc-text-dim);
  background: rgba(255, 255, 255, .04);
  border: 1px solid var(--cc-line);
  white-space: nowrap;
}

#app .super-dashboard .sa-online-item i {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--sa-gold);
}

#app .super-dashboard .sa-online-item.is-online i { background: var(--sa-green); animation: sa-pulse 2s ease-out infinite; }
#app .super-dashboard .sa-online-item.is-online { color: var(--cc-text); border-color: rgba(62, 207, 134, .35); }
#app .super-dashboard .sa-online-empty { color: var(--cc-text-mute); border-style: dashed; }

/* 右下角上线 / 离线提示 */
#sa-toasts {
  position: fixed;
  right: 24px;
  bottom: 24px;
  z-index: 5000;
  display: flex;
  flex-direction: column;
  gap: 8px;
  pointer-events: none;
}

.sa-toast {
  --p: 62, 207, 134;
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 260px;
  padding: 10px 14px;
  border-radius: 8px;
  background: rgba(17, 24, 39, .96);
  border: 1px solid rgba(var(--p), .45);
  box-shadow: 0 16px 40px -20px rgba(0, 0, 0, .9), 0 0 0 1px rgba(0, 0, 0, .4);
  color: #e8eef8;
  font: 13px/1.3 -apple-system, "PingFang SC", "Microsoft YaHei", system-ui, sans-serif;
  letter-spacing: .3px;
  animation: sa-toast-in .28s cubic-bezier(.2, .8, .3, 1.2) both;
  transition: opacity .4s ease, transform .4s ease;
}

.sa-toast.is-off { --p: 125, 139, 163; }
.sa-toast.is-leaving { opacity: 0; transform: translateX(16px); }

.sa-toast__dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: rgb(var(--p));
  box-shadow: 0 0 0 3px rgba(var(--p), .22);
  flex-shrink: 0;
}

.sa-toast__time {
  margin-left: auto;
  font-size: 11px;
  color: #7d8ba3;
  font-variant-numeric: tabular-nums;
  font-family: ui-monospace, "SF Mono", "Menlo", "Consolas", monospace;
}

@keyframes sa-toast-in {
  from { opacity: 0; transform: translateY(10px) scale(.98); }
  to   { opacity: 1; transform: none; }
}

/* ==========================================================================
   队站管理（/super/stations）+ 三个弹窗（.tech-dialog）
   --------------------------------------------------------------------------
   页面本身沿用控制台的"飞行甲板"语言；emoji 换成 CSS mask 图标。
   三个弹窗原来只套上了一半样式（dist 里写的是 .tech-dialog .el-dialog，但 class 就挂在
   .el-dialog 自己身上，后代选择器匹配不到），结果白底弹窗配了深色输入框、浅色标题，
   标题几乎看不见。这里按 .el-overlay .el-dialog.tech-dialog 完整重写。
   ========================================================================== */

:root {
  --i-building: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 21h18'/%3E%3Cpath d='M5 21V7l7-4 7 4v14'/%3E%3Cpath d='M9 9h1M9 12.5h1M9 16h1'/%3E%3Cpath d='M14 9h1M14 12.5h1M14 16h1'/%3E%3Cpath d='M11 21v-3h2v3'/%3E%3C/svg%3E");
  --i-pencil: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 20h4l10.5-10.5a2.1 2.1 0 0 0-3-3L5 17v3'/%3E%3Cpath d='M13.5 6.5l3 3'/%3E%3C/svg%3E");
  --i-key: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 3a6 6 0 1 0-5.4 8.6L3 18v3h3l1-1v-2h2l1-1v-2h2l1.4-1.4A6 6 0 1 0 15 3z'/%3E%3Cpath d='M16 8h.01'/%3E%3C/svg%3E");
  --i-trash2: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 7h16'/%3E%3Cpath d='M10 11v6M14 11v6'/%3E%3Cpath d='M6 7l1 13h10l1-13'/%3E%3Cpath d='M9 7V4h6v3'/%3E%3C/svg%3E");
  --i-user: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 12a4 4 0 1 0 0-8 4 4 0 0 0 0 8z'/%3E%3Cpath d='M4 21a8 8 0 0 1 16 0'/%3E%3C/svg%3E");
  --i-calendar: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 6h16v15H4z'/%3E%3Cpath d='M4 10h16'/%3E%3Cpath d='M8 3v5M16 3v5'/%3E%3C/svg%3E");
  --i-link: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10 14a4 4 0 0 0 5.7 0l3-3a4 4 0 0 0-5.7-5.7l-1 1'/%3E%3Cpath d='M14 10a4 4 0 0 0-5.7 0l-3 3a4 4 0 0 0 5.7 5.7l1-1'/%3E%3C/svg%3E");
  --i-copy: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 8h11v13H8z'/%3E%3Cpath d='M5 16H4V3h11v1'/%3E%3C/svg%3E");
  --i-info: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21a9 9 0 1 0 0-18 9 9 0 0 0 0 18z'/%3E%3Cpath d='M12 11v5'/%3E%3Cpath d='M12 8h.01'/%3E%3C/svg%3E");
  --i-plus: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 5v14'/%3E%3Cpath d='M5 12h14'/%3E%3C/svg%3E");
  --i-shield: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3l8 3v6c0 4.5-3.5 7.5-8 9-4.5-1.5-8-4.5-8-9V6z'/%3E%3Cpath d='M9 12l2 2 4-4'/%3E%3C/svg%3E");
  --i-check: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21a9 9 0 1 0 0-18 9 9 0 0 0 0 18z'/%3E%3Cpath d='M8 12l3 3 5-6'/%3E%3C/svg%3E");
  --i-alert2: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3.5 21.5 20H2.5z'/%3E%3Cpath d='M12 9.5v5'/%3E%3Cpath d='M12 17.5h.01'/%3E%3C/svg%3E");
}

#app .stations-page {
  color: var(--cc-text);
  font-family: -apple-system, "PingFang SC", "Microsoft YaHei", system-ui, sans-serif;
  padding: 20px 28px 28px;
  background-color: var(--cc-bg-0);
  background-image:
    linear-gradient(rgba(180, 196, 220, .035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(180, 196, 220, .035) 1px, transparent 1px),
    radial-gradient(900px 380px at 50% -12%, rgba(196, 42, 60, .07), transparent 58%),
    linear-gradient(180deg, var(--cc-bg-1) 0%, var(--cc-bg-0) 100%);
  background-size: 48px 48px, 48px 48px, auto, auto;
  background-attachment: fixed;
}

#app .stations-page::before { display: none; }

/* mask 图标通用体 */
#app .stations-page .st-ico,
#app .stations-page .btn-icon,
#app .stations-page .info-icon,
#app .stations-page .share-icon,
#app .stations-page .station-avatar span,
#app .stations-page .empty-icon {
  display: inline-block;
  width: 16px;
  height: 16px;
  font-size: 0 !important;
  line-height: 0;
  background-color: currentColor;
  -webkit-mask: var(--i) center / contain no-repeat;
          mask: var(--i) center / contain no-repeat;
  flex-shrink: 0;
}

/* ---------- 页头 ---------- */
#app .stations-page .page-header {
  margin-bottom: 18px;
  padding: 14px 20px;
  border-radius: 8px;
  background: #141c2a;
  border: 1px solid var(--cc-line);
  box-shadow: none;
}

#app .stations-page .main-title {
  font-size: 20px;
  font-weight: 650;
  letter-spacing: 3px;
  color: var(--cc-text);
  background: none;
  -webkit-text-fill-color: currentColor;
}

#app .stations-page .sub-title { margin-top: 4px; font-size: 12px; letter-spacing: 1.5px; color: var(--cc-text-mute); }

#app .stations-page .add-btn,
#app .stations-page .empty-btn {
  gap: 8px;
  height: 36px;
  padding: 0 16px;
  border-radius: 6px;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 1px;
  color: #0e141f;
  background: linear-gradient(180deg, #7fb2f2, #5b9be8);
  border: 1px solid rgba(91, 155, 232, .6);
  box-shadow: none;
  transition: transform .15s ease, box-shadow .15s ease, filter .15s ease;
}

#app .stations-page .add-btn:hover,
#app .stations-page .empty-btn:hover {
  transform: translateY(-1px);
  filter: brightness(1.06);
  box-shadow: 0 10px 22px -12px rgba(91, 155, 232, .9);
}

#app .stations-page .add-btn:active { transform: translateY(0); }
#app .stations-page .btn-icon { --i: var(--i-plus); width: 14px; height: 14px; }

/* ---------- 卡片 ---------- */
#app .stations-page .stations-grid { grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); gap: 16px; }

#app .stations-page .station-card {
  position: relative;
  border-radius: 8px;
  background: #141c2a;
  border: 1px solid var(--cc-line);
  box-shadow: none;
  overflow: hidden;
  transition: transform .22s cubic-bezier(.2, .7, .3, 1), border-color .22s ease, background-color .22s ease, box-shadow .22s ease;
}

#app .stations-page .station-card::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: radial-gradient(220px 120px at 100% 0%, rgba(91, 155, 232, .10), transparent 70%);
  pointer-events: none;
  opacity: 0;
  transition: opacity .25s ease;
}

#app .stations-page .station-card:hover {
  transform: translateY(-3px);
  background: #172130;
  border-color: rgba(91, 155, 232, .5);
  box-shadow: 0 16px 32px -18px rgba(91, 155, 232, .7), inset 0 1px 0 rgba(255, 255, 255, .05);
}

#app .stations-page .station-card:hover::after { opacity: 1; }

#app .stations-page .card-header { position: relative; z-index: 1; padding: 18px 18px 0; }

#app .stations-page .station-avatar {
  width: 48px;
  height: 48px;
  border-radius: 8px;
  color: var(--sa-blue, #5b9be8);
  background: rgba(91, 155, 232, .1);
  border: 1px solid rgba(91, 155, 232, .3);
  box-shadow: none;
  transition: transform .25s cubic-bezier(.2, .7, .3, 1), background-color .2s ease;
}

#app .stations-page .station-avatar span { --i: var(--i-building); width: 24px; height: 24px; }
#app .stations-page .station-card:hover .station-avatar { transform: translateY(-2px) scale(1.04); background: rgba(91, 155, 232, .16); }

#app .stations-page .card-actions { gap: 6px; }

#app .stations-page .action-btn {
  position: relative;
  width: 32px;
  height: 32px;
  border-radius: 6px;
  font-size: 0;
  color: var(--cc-text-mute);
  background: rgba(255, 255, 255, .03);
  border: 1px solid var(--cc-line);
  transition: transform .15s ease, background-color .15s ease, border-color .15s ease, color .15s ease;
}

#app .stations-page .action-btn::before {
  content: "";
  width: 15px;
  height: 15px;
  background-color: currentColor;
  -webkit-mask: var(--i) center / contain no-repeat;
          mask: var(--i) center / contain no-repeat;
}

#app .stations-page .card-actions .action-btn:nth-child(1) { --i: var(--i-pencil); }
#app .stations-page .card-actions .action-btn:nth-child(2) { --i: var(--i-key); }
#app .stations-page .card-actions .action-btn:nth-child(3) { --i: var(--i-trash2); }

#app .stations-page .action-btn:hover {
  transform: translateY(-1px);
  color: var(--cc-text);
  background: rgba(91, 155, 232, .12);
  border-color: rgba(91, 155, 232, .5);
}

#app .stations-page .card-actions .action-btn:nth-child(2):hover { color: #f3d58a; background: rgba(212, 180, 106, .12); border-color: rgba(212, 180, 106, .5); }
#app .stations-page .action-btn.danger:hover { color: #ffb3b9; background: rgba(232, 93, 106, .12); border-color: rgba(232, 93, 106, .5); }

#app .stations-page .card-body { position: relative; z-index: 1; padding: 14px 18px 16px; }

#app .stations-page .station-name {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  margin: 0 0 14px;
  font-size: 18px;
  font-weight: 650;
  letter-spacing: .6px;
  color: var(--cc-text);
}

#app .stations-page .info-list { gap: 8px; }

#app .stations-page .info-row {
  gap: 10px;
  padding: 9px 12px;
  border-radius: 6px;
  background: rgba(255, 255, 255, .03);
  border: 1px solid var(--cc-line-soft);
}

#app .stations-page .info-icon { width: 14px; height: 14px; color: var(--cc-text-mute); }
#app .stations-page .info-list .info-row:nth-child(1) .info-icon { --i: var(--i-user); }
#app .stations-page .info-list .info-row:nth-child(2) .info-icon { --i: var(--i-calendar); }
#app .stations-page .info-label { min-width: 56px; font-size: 11px; letter-spacing: 1.5px; color: var(--cc-text-mute); }

#app .stations-page .info-value {
  font-size: 13px;
  letter-spacing: .3px;
  font-variant-numeric: tabular-nums;
  font-family: ui-monospace, "SF Mono", "Menlo", "Consolas", monospace;
  color: var(--cc-text);
}

/* 分享链接：从蓝色渐变块改成安静的描边区 */
#app .stations-page .share-section {
  position: relative;
  z-index: 1;
  margin: 0 18px 18px;
  padding: 12px 14px;
  border-radius: 6px;
  background: rgba(76, 194, 216, .05);
  border: 1px solid rgba(76, 194, 216, .22);
}

#app .stations-page .share-header { gap: 8px; margin-bottom: 10px; font-size: 12px; font-weight: 600; letter-spacing: 1.5px; color: #7fd4e4; }
#app .stations-page .share-icon { --i: var(--i-link); width: 14px; height: 14px; }
#app .stations-page .share-input-group { gap: 8px; margin-bottom: 8px; }

#app .stations-page .share-input {
  padding: 8px 10px;
  border-radius: 5px;
  font-size: 11.5px;
  letter-spacing: .2px;
  color: var(--cc-text-dim);
  background: rgba(10, 15, 24, .7);
  border: 1px solid var(--cc-line);
  font-family: ui-monospace, "SF Mono", "Menlo", "Consolas", monospace;
  transition: border-color .15s ease;
}

#app .stations-page .share-input:focus { border-color: rgba(76, 194, 216, .6); }

#app .stations-page .copy-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 0 12px;
  border-radius: 5px;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 1px;
  color: #9fe3ef;
  background: rgba(76, 194, 216, .1);
  border: 1px solid rgba(76, 194, 216, .38);
  box-shadow: none;
  transition: transform .15s ease, background-color .15s ease, border-color .15s ease;
}

#app .stations-page .copy-btn::before {
  content: "";
  width: 13px;
  height: 13px;
  background-color: currentColor;
  -webkit-mask: var(--i-copy) center / contain no-repeat;
          mask: var(--i-copy) center / contain no-repeat;
}

#app .stations-page .copy-btn:hover { transform: translateY(-1px); background: rgba(76, 194, 216, .18); border-color: rgba(76, 194, 216, .6); box-shadow: none; }
#app .stations-page .copy-btn:active { transform: translateY(0) scale(.97); }

#app .stations-page .share-tip {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  letter-spacing: .3px;
  color: var(--cc-text-mute);
  opacity: 1;
}

#app .stations-page .share-tip::before {
  content: "";
  width: 12px;
  height: 12px;
  flex-shrink: 0;
  background-color: currentColor;
  -webkit-mask: var(--i-info) center / contain no-repeat;
          mask: var(--i-info) center / contain no-repeat;
}

#app .stations-page .empty-state { border-radius: 8px; background: #141c2a; border: 1px dashed var(--cc-line); }
#app .stations-page .empty-icon { --i: var(--i-building); width: 40px; height: 40px; color: var(--cc-text-mute); opacity: .6; }
#app .stations-page .empty-text { letter-spacing: 1px; color: var(--cc-text-mute); }

/* 入场 */
@media (prefers-reduced-motion: no-preference) {
  #app .stations-page .page-header { animation: cc-rise .45s cubic-bezier(.2, .7, .3, 1) backwards; }
  #app .stations-page .station-card { animation: cc-rise .5s cubic-bezier(.2, .7, .3, 1) backwards; }
  #app .stations-page .station-card:nth-child(2) { animation-delay: .06s; }
  #app .stations-page .station-card:nth-child(3) { animation-delay: .12s; }
  #app .stations-page .station-card:nth-child(4) { animation-delay: .18s; }
  #app .stations-page .station-card:nth-child(n+5) { animation-delay: .24s; }
}

/* 队站管理页也显示管理员在线胶囊（dash-fix 注入，复用控制台那套样式的变量） */
#app .stations-page .sa-presence {
  --p: 125, 139, 163;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 2px 8px 2px 7px;
  border-radius: 4px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .5px;
  line-height: 1.3;
  color: rgb(var(--p));
  background: rgba(var(--p), .10);
  border: 1px solid rgba(var(--p), .28);
  white-space: nowrap;
}

#app .stations-page .sa-presence::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: rgb(var(--p)); flex-shrink: 0; }
#app .stations-page .sa-presence.is-online { --p: 62, 207, 134; }
#app .stations-page .sa-presence.is-online::before { animation: sa-pulse 2s ease-out infinite; }
#app .stations-page .sa-presence.is-recent { --p: 212, 180, 106; }
#app .stations-page .sa-presence.is-off::before { background: transparent; box-shadow: inset 0 0 0 1.5px rgb(var(--p)); }

/* ---------- 三个弹窗 ---------- */
.el-overlay:has(> .el-overlay-dialog > .tech-dialog) {
  background: rgba(6, 10, 18, .72) !important;
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
}

.el-overlay .el-dialog.tech-dialog {
  --el-dialog-bg-color: #121a29;
  padding: 0;
  background: linear-gradient(180deg, #16202f 0%, #111827 100%);
  border: 1px solid rgba(180, 196, 220, .16);
  border-radius: 12px;
  box-shadow: 0 40px 90px -30px rgba(0, 0, 0, .9), 0 0 0 1px rgba(0, 0, 0, .5), inset 0 1px 0 rgba(255, 255, 255, .05);
  overflow: hidden;
  color: var(--cc-text-dim);
}

.el-overlay .el-dialog.tech-dialog .el-dialog__header {
  margin: 0;
  padding: 18px 60px 14px 24px;
  background: none;
  border-bottom: 1px solid rgba(180, 196, 220, .1);
  cursor: default;
}

.el-overlay .el-dialog.tech-dialog .el-dialog__title {
  font-size: 16px;
  font-weight: 650;
  letter-spacing: .6px;
  color: var(--cc-text);
}

.el-overlay .el-dialog.tech-dialog .el-dialog__headerbtn {
  top: 12px;
  right: 14px;
  width: 32px;
  height: 32px;
  border-radius: 6px;
  color: var(--cc-text-mute);
  transition: background-color .15s ease, color .15s ease;
}

.el-overlay .el-dialog.tech-dialog .el-dialog__headerbtn .el-dialog__close { color: inherit; font-size: 16px; }
.el-overlay .el-dialog.tech-dialog .el-dialog__headerbtn:hover { background: rgba(255, 255, 255, .07); color: var(--cc-text); }
.el-overlay .el-dialog.tech-dialog .el-dialog__headerbtn:hover .el-dialog__close { color: inherit; }

.el-overlay .el-dialog.tech-dialog .el-dialog__body { padding: 22px 24px 8px; color: var(--cc-text-dim); }

.el-overlay .el-dialog.tech-dialog .el-form-item { margin-bottom: 18px; }

.el-overlay .el-dialog.tech-dialog .el-form-item__label {
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 1.5px;
  color: var(--cc-text-mute);
}

.el-overlay .el-dialog.tech-dialog .el-form-item.is-required .el-form-item__label::before,
.el-overlay .el-dialog.tech-dialog .el-form-item__label::before { color: #f0a0a8; }

.el-overlay .el-dialog.tech-dialog .el-input__wrapper {
  padding: 1px 12px;
  border-radius: 6px;
  background: rgba(10, 15, 24, .7);
  border: 1px solid rgba(180, 196, 220, .16);
  box-shadow: none !important;
  transition: border-color .15s ease, box-shadow .15s ease;
}

.el-overlay .el-dialog.tech-dialog .el-input__wrapper:hover { border-color: rgba(180, 196, 220, .3); }

.el-overlay .el-dialog.tech-dialog .el-input__wrapper.is-focus {
  border-color: rgba(91, 155, 232, .7);
  box-shadow: 0 0 0 3px rgba(91, 155, 232, .15) !important;
}

.el-overlay .el-dialog.tech-dialog .el-input__inner {
  height: 36px;
  font-size: 14px;
  letter-spacing: .3px;
  color: var(--cc-text);
}

.el-overlay .el-dialog.tech-dialog .el-input__inner::placeholder { color: var(--cc-text-mute); }
.el-overlay .el-dialog.tech-dialog .el-input__icon,
.el-overlay .el-dialog.tech-dialog .el-input__password { color: var(--cc-text-mute); }
.el-overlay .el-dialog.tech-dialog .el-input__password:hover { color: var(--cc-text); }

/* 「生成强密码」是 el-input 的 append 槽 */
.el-overlay .el-dialog.tech-dialog .el-input-group__append {
  padding: 0;
  background: transparent;
  border: 0;
  box-shadow: none;
}

.el-overlay .el-dialog.tech-dialog .el-input-group--append .el-input__wrapper { border-radius: 6px 0 0 6px; border-right: 0; }

.el-overlay .el-dialog.tech-dialog .el-input-group__append .el-button {
  height: 38px;
  margin: 0;
  padding: 0 12px;
  border-radius: 0 6px 6px 0;
  font-size: 12px;
  letter-spacing: 1px;
  color: #f3d58a;
  background: rgba(212, 180, 106, .1);
  border: 1px solid rgba(212, 180, 106, .4);
}

.el-overlay .el-dialog.tech-dialog .el-input-group__append .el-button:hover { background: rgba(212, 180, 106, .18); color: #ffe6a8; }

/* 密码规则提示（el-alert） */
.el-overlay .el-dialog.tech-dialog .el-alert {
  padding: 10px 12px;
  border-radius: 6px;
  background: rgba(212, 180, 106, .08);
  border: 1px solid rgba(212, 180, 106, .3);
}

.el-overlay .el-dialog.tech-dialog .el-alert--info { background: rgba(91, 155, 232, .08); border-color: rgba(91, 155, 232, .3); }
.el-overlay .el-dialog.tech-dialog .el-alert .el-alert__icon { color: #f3d58a; }
.el-overlay .el-dialog.tech-dialog .el-alert--info .el-alert__icon { color: #9cc0f1; }
.el-overlay .el-dialog.tech-dialog .el-alert__title { font-size: 12px; line-height: 1.6; letter-spacing: .3px; color: var(--cc-text-dim); }

.el-overlay .el-dialog.tech-dialog .el-dialog__footer {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  padding: 14px 20px 16px;
  border-top: 1px solid rgba(180, 196, 220, .1);
}

.el-overlay .el-dialog.tech-dialog .el-dialog__footer .el-button {
  height: 34px;
  padding: 0 18px;
  border-radius: 6px;
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 1px;
  margin: 0;
  transition: background-color .15s ease, border-color .15s ease, color .15s ease, transform .15s ease, filter .15s ease;
}

.el-overlay .el-dialog.tech-dialog .el-dialog__footer .el-button--default {
  color: var(--cc-text-dim);
  background: rgba(255, 255, 255, .04);
  border: 1px solid rgba(180, 196, 220, .22);
}

.el-overlay .el-dialog.tech-dialog .el-dialog__footer .el-button--default:hover { color: var(--cc-text); background: rgba(255, 255, 255, .08); border-color: rgba(180, 196, 220, .4); }

.el-overlay .el-dialog.tech-dialog .el-dialog__footer .el-button--primary {
  color: #0e141f;
  font-weight: 600;
  background: linear-gradient(180deg, #7fb2f2, #5b9be8);
  border: 1px solid rgba(91, 155, 232, .6);
}

.el-overlay .el-dialog.tech-dialog .el-dialog__footer .el-button--primary:hover { transform: translateY(-1px); filter: brightness(1.06); background: linear-gradient(180deg, #7fb2f2, #5b9be8); }

/* 复制成功的瞬时反馈（dash-fix 加 .is-copied 1.6 秒） */
#app .stations-page .copy-btn.is-copied {
  color: #8ae9b9;
  background: rgba(62, 207, 134, .12);
  border-color: rgba(62, 207, 134, .5);
}
#app .stations-page .copy-btn.is-copied::before {
  -webkit-mask-image: var(--i-check);
          mask-image: var(--i-check);
}

/* ==========================================================================
   人员管理（/admin-station/users）· 花名册
   --------------------------------------------------------------------------
   页面本体是 Element Plus 表格 + 一条筛选栏，原样式是白底浅灰卡片。这里沿用控制台的
   深色"飞行甲板"语言：页头（dash-fix 注入 .pm-head：标题 + 总数/在队/非在队/账号 四枚
   统计 + 在位率条）、筛选栏收成一条工具条、表格换深色皮肤并按列做排版
   （姓名加粗、电话/日期等宽数字、服役年限带小进度条、状态改成带色点的胶囊）。
   动效：行入场渐入、悬停行左侧亮一道蓝边、头像悬停放大 + 浮出大图名牌、
   数字滚动、批量删除按钮选中后"武装"发光。
   表头单元格的背景/内边距是 Vue 写在 style 上的行内样式，需要 !important 压过。
   弹窗（修改状态 / 新增编辑 / 详情 / 开通账号 / 重置密码）由 dash-fix 挂上
   .tech-dialog.pm-dialog 复用队站管理页那套深色弹窗壳，这里只补表单里
   select / 日期 / descriptions / 上传区等部件；下拉与日期面板等 popper 挂在 body 上，
   用 dash-fix 打在 body 的 .pm-page 做范围。
   ========================================================================== */

#app .staff-management-container {
  color: var(--cc-text);
  font-family: -apple-system, "PingFang SC", "Microsoft YaHei", system-ui, sans-serif;
  padding: 18px 22px 28px;
  min-height: calc(100vh - 56px);
  background-color: var(--cc-bg-0);
  background-image:
    linear-gradient(rgba(180, 196, 220, .035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(180, 196, 220, .035) 1px, transparent 1px),
    radial-gradient(900px 380px at 50% -12%, rgba(196, 42, 60, .07), transparent 58%),
    linear-gradient(180deg, var(--cc-bg-1) 0%, var(--cc-bg-0) 100%);
  background-size: 48px 48px, 48px 48px, auto, auto;
  background-attachment: fixed;

  /* Element Plus 组件变量：这一页里的输入框 / 选择器 / 复选框 / 卡片统一走深色 */
  --el-bg-color: #141c2a;
  --el-bg-color-overlay: #16202f;
  --el-fill-color-blank: rgba(10, 15, 24, .7);
  --el-fill-color-light: rgba(255, 255, 255, .04);
  --el-fill-color-lighter: rgba(255, 255, 255, .03);
  --el-fill-color: rgba(255, 255, 255, .06);
  --el-text-color-primary: var(--cc-text);
  --el-text-color-regular: var(--cc-text-dim);
  --el-text-color-secondary: var(--cc-text-mute);
  --el-text-color-placeholder: var(--cc-text-mute);
  --el-border-color: rgba(180, 196, 220, .18);
  --el-border-color-hover: rgba(180, 196, 220, .32);
  --el-border-color-light: rgba(180, 196, 220, .14);
  --el-border-color-lighter: rgba(180, 196, 220, .10);
  --el-border-color-extra-light: rgba(180, 196, 220, .07);
  --el-color-primary: #5b9be8;
  --el-color-primary-light-9: rgba(91, 155, 232, .12);
  --el-checkbox-bg-color: rgba(10, 15, 24, .7);
  --el-checkbox-input-border: 1px solid rgba(180, 196, 220, .35);
  --el-checkbox-input-border-color-hover: #5b9be8;
  --el-checkbox-checked-bg-color: #5b9be8;
  --el-checkbox-checked-input-border-color: #5b9be8;
  --el-checkbox-checked-icon-color: #0e141f;
}

/* ---------- 页头（dash-fix 注入） ---------- */
@property --pm-rate { syntax: "<number>"; inherits: true; initial-value: 0; }

#app .staff-management-container .pm-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  margin: 0 0 14px;
  padding: 4px 2px 16px;
  border-bottom: 1px solid var(--cc-line-soft);
}

/* 左：眉标 / 标题 / 副标，左侧一条红色渐隐竖线 */
#app .staff-management-container .pm-head__l {
  position: relative;
  padding-left: 16px;
}
#app .staff-management-container .pm-head__l::before {
  content: "";
  position: absolute;
  left: 0;
  top: 4px;
  bottom: 4px;
  width: 3px;
  border-radius: 2px;
  background: linear-gradient(180deg, #e85d6a, rgba(232, 93, 106, .15));
  box-shadow: 0 0 10px rgba(232, 93, 106, .45);
}
#app .staff-management-container .pm-head__en {
  font-size: 10.5px;
  font-weight: 600;
  letter-spacing: 3.5px;
  text-transform: uppercase;
  color: var(--cc-text-mute);
  font-family: ui-monospace, "SF Mono", "Menlo", "Consolas", monospace;
}
#app .staff-management-container .pm-head__title {
  margin-top: 4px;
  font-size: 24px;
  font-weight: 700;
  letter-spacing: 3px;
  line-height: 1.15;
  color: var(--cc-text);
}
#app .staff-management-container .pm-head__sub {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 9px;
  font-size: 12px;
  letter-spacing: 1px;
  color: var(--cc-text-mute);
}
#app .staff-management-container .pm-head__dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--cc-green);
  box-shadow: 0 0 8px var(--cc-green);
  animation: sa-pulse 2.2s ease-out infinite;
}
#app .staff-management-container .pm-head__station { color: var(--cc-text-dim); font-weight: 600; }
#app .staff-management-container .pm-head__date,
#app .staff-management-container .pm-head__clock {
  font-variant-numeric: tabular-nums;
  font-family: ui-monospace, "SF Mono", "Menlo", "Consolas", monospace;
  letter-spacing: .5px;
}
#app .staff-management-container .pm-head__date::before,
#app .staff-management-container .pm-head__clock::before {
  content: "";
  display: inline-block;
  width: 1px;
  height: 10px;
  margin-right: 10px;
  vertical-align: -1px;
  background: var(--cc-line);
}
#app .staff-management-container .pm-head__clock { color: var(--cc-text-dim); }
#app .staff-management-container .pm-head__clock:empty,
#app .staff-management-container .pm-head__date:empty { display: none; }

/* 右：一块统一的指标面板，五格用细线分隔 */
#app .staff-management-container .pm-head__stats {
  position: relative;
  display: flex;
  align-items: stretch;
  gap: 0;
  border-radius: 10px;
  background: linear-gradient(180deg, #151e2d, #121a28);
  border: 1px solid var(--cc-line);
  box-shadow: 0 18px 40px -28px rgba(0, 0, 0, .9);
  overflow: hidden;
}
#app .staff-management-container .pm-head__stats::before {
  content: "";
  position: absolute;
  top: 0;
  left: 6%;
  right: 6%;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(180, 196, 220, .35), transparent);
  pointer-events: none;
}

#app .staff-management-container .pm-stat {
  --p: 180, 196, 220;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  min-width: 112px;
  padding: 12px 20px 11px;
  border-right: 1px solid var(--cc-line-soft);
  background: transparent;
  transition: background-color .2s ease;
}
#app .staff-management-container .pm-stat::before { display: none; }
#app .staff-management-container .pm-stat::after {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(140px 70px at 50% 120%, rgba(var(--p), .18), transparent 70%);
  opacity: 0;
  transition: opacity .25s ease;
  pointer-events: none;
}
#app .staff-management-container .pm-stat:hover { background: rgba(255, 255, 255, .025); }
#app .staff-management-container .pm-stat:hover::after { opacity: 1; }

#app .staff-management-container .pm-stat__num {
  display: inline-block;
  font-size: 26px;
  line-height: 1;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  font-family: ui-monospace, "SF Mono", "Menlo", "Consolas", monospace;
  color: #f2f6ff;
  transform-origin: left center;
}
#app .staff-management-container .pm-stat__num.is-bump { animation: cc-kpi-bump .6s cubic-bezier(.2, .8, .3, 1); }

#app .staff-management-container .pm-stat__label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  letter-spacing: 1.5px;
  color: var(--cc-text-mute);
  white-space: nowrap;
}
#app .staff-management-container .pm-stat__label::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: rgb(var(--p));
  box-shadow: 0 0 6px rgba(var(--p), .8);
}

#app .staff-management-container .pm-stat--total { --p: 232, 93, 106; }
#app .staff-management-container .pm-stat--on    { --p: 62, 207, 134; }
#app .staff-management-container .pm-stat--off   { --p: 224, 154, 69; }
#app .staff-management-container .pm-stat--acc   { --p: 91, 155, 232; }

/* 在位率：环形仪表（conic-gradient 按 --pm-rate 走），≥80% 绿，否则橙 */
#app .staff-management-container .pm-ratio {
  --p: 224, 154, 69;
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 12px;
  width: auto;
  min-width: 150px;
  padding: 10px 20px 10px 16px;
  border: 0;
  border-radius: 0;
  background: rgba(var(--p), .05);
  transition: background-color .3s ease;
}
#app .staff-management-container .pm-head[data-rate="good"] .pm-ratio { --p: 62, 207, 134; }
#app .staff-management-container .pm-ratio:hover { background: rgba(var(--p), .10); }

#app .staff-management-container .pm-ratio__bar {
  order: -1;
  position: relative;
  flex: none;
  width: 46px;
  height: 46px;
  border-radius: 50%;
  background: conic-gradient(rgb(var(--p)) calc(var(--pm-rate, 0) * 1%), rgba(255, 255, 255, .07) 0);
  -webkit-mask: radial-gradient(farthest-side, transparent calc(100% - 5px), #000 calc(100% - 4px));
          mask: radial-gradient(farthest-side, transparent calc(100% - 5px), #000 calc(100% - 4px));
  filter: drop-shadow(0 0 6px rgba(var(--p), .45));
  transition: --pm-rate .9s cubic-bezier(.2, .7, .3, 1), background .3s ease;
  overflow: visible;
}
#app .staff-management-container .pm-ratio__bar i { display: none; }
/* 80% 目标刻度：环上的一小段亮线 */
#app .staff-management-container .pm-ratio__bar::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 50%;
  background: conic-gradient(transparent 79.2%, rgba(232, 238, 248, .9) 79.2% 80.8%, transparent 80.8%);
  left: auto;
  top: auto;
  bottom: auto;
  width: auto;
}

#app .staff-management-container .pm-ratio__txt {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 4px;
  font-size: 11px;
  letter-spacing: 1.5px;
  color: var(--cc-text-mute);
  white-space: nowrap;
}
#app .staff-management-container .pm-ratio__txt b {
  font-size: 22px;
  line-height: 1;
  font-weight: 700;
  letter-spacing: 0;
  color: rgb(var(--p));
  font-variant-numeric: tabular-nums;
  font-family: ui-monospace, "SF Mono", "Menlo", "Consolas", monospace;
}
#app .staff-management-container .pm-ratio__txt span::after {
  content: " · 目标 80%";
  letter-spacing: .5px;
  opacity: .7;
}

/* ---------- 工具条（原 .search-bar） ---------- */
#app .staff-management-container .search-bar {
  margin-bottom: 14px;
  padding: 12px 16px;
  border-radius: 8px;
  background: #141c2a;
  border: 1px solid var(--cc-line);
  box-shadow: none;
}

#app .staff-management-container .search-bar .el-row {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 10px;
  margin: 0 !important;
}

#app .staff-management-container .search-bar .el-col {
  flex: 0 0 auto !important;
  width: auto !important;
  max-width: none !important;
  padding: 0 !important;
}

#app .staff-management-container .search-bar .el-col:last-child { margin-left: auto; }
#app .staff-management-container .search-bar .el-col:last-child > div { gap: 8px !important; }

/* 搜索框：聚焦时拉长 */
#app .staff-management-container .search-bar .el-input {
  width: 220px !important;
  transition: width .25s cubic-bezier(.2, .7, .3, 1);
}

#app .staff-management-container .search-bar .el-input:focus-within { width: 290px !important; }
#app .staff-management-container .search-bar .el-select { width: 180px !important; }

#app .staff-management-container .search-bar .el-input__wrapper,
#app .staff-management-container .search-bar .el-select__wrapper {
  min-height: 36px;
  padding: 0 12px;
  border-radius: 6px;
  background: rgba(10, 15, 24, .7);
  border: 1px solid var(--cc-line);
  box-shadow: none !important;
  transition: border-color .15s ease, box-shadow .15s ease;
}

#app .staff-management-container .search-bar .el-input__wrapper:hover,
#app .staff-management-container .search-bar .el-select__wrapper.is-hovering { border-color: rgba(180, 196, 220, .32); }

#app .staff-management-container .search-bar .el-input__wrapper.is-focus,
#app .staff-management-container .search-bar .el-select__wrapper.is-focused {
  border-color: rgba(91, 155, 232, .7);
  box-shadow: 0 0 0 3px rgba(91, 155, 232, .15) !important;
}

#app .staff-management-container .search-bar .el-input__inner {
  height: 34px;
  font-size: 13px;
  letter-spacing: .3px;
  color: var(--cc-text);
}

#app .staff-management-container .search-bar .el-input__inner::placeholder { color: var(--cc-text-mute); }
#app .staff-management-container .search-bar .el-input__prefix .el-icon,
#app .staff-management-container .search-bar .el-input__suffix .el-icon,
#app .staff-management-container .search-bar .el-select__caret { color: var(--cc-text-mute); }
#app .staff-management-container .search-bar .el-input__wrapper.is-focus .el-input__prefix .el-icon { color: #9cc0f1; }
#app .staff-management-container .search-bar .el-select__placeholder { color: var(--cc-text); font-size: 13px; }
#app .staff-management-container .search-bar .el-select__placeholder.is-transparent { color: var(--cc-text-mute); }

/* ---------- 按钮 ---------- */
#app .staff-management-container .el-button {
  height: 36px;
  padding: 0 14px;
  border-radius: 6px;
  font-size: 13px;
  font-weight: 500;
  letter-spacing: .8px;
  color: var(--cc-text-dim);
  background: rgba(255, 255, 255, .04);
  border: 1px solid rgba(180, 196, 220, .22);
  box-shadow: none;
  transition: transform .15s ease, background-color .15s ease, border-color .15s ease, color .15s ease, box-shadow .15s ease, filter .15s ease;
}

#app .staff-management-container .el-button .el-icon { font-size: 14px; }
#app .staff-management-container .el-button + .el-button { margin-left: 0; }

#app .staff-management-container .el-button--small { height: 28px; padding: 0 10px; font-size: 12px; }

#app .staff-management-container .el-button.is-text {
  height: auto;
  min-height: 0;
  background: transparent;
  border-color: transparent;
  box-shadow: none;
}

#app .staff-management-container .el-button.is-text:hover { transform: none; background: rgba(255, 255, 255, .07); border-color: transparent; }
#app .staff-management-container .el-button--danger.is-text { color: #e85d6a; }
#app .staff-management-container .el-button--danger.is-text:hover { color: #ffb3b9; background: rgba(232, 93, 106, .14); }

#app .staff-management-container .el-button:hover,
#app .staff-management-container .el-button:focus-visible {
  transform: translateY(-1px);
  color: var(--cc-text);
  background: rgba(91, 155, 232, .12);
  border-color: rgba(91, 155, 232, .5);
}

#app .staff-management-container .el-button:active { transform: translateY(0); }

#app .staff-management-container .el-button--primary {
  color: #0e141f;
  font-weight: 600;
  background: linear-gradient(180deg, #7fb2f2, #5b9be8);
  border-color: rgba(91, 155, 232, .6);
}

#app .staff-management-container .el-button--primary:hover,
#app .staff-management-container .el-button--primary:focus-visible {
  color: #0e141f;
  background: linear-gradient(180deg, #7fb2f2, #5b9be8);
  border-color: rgba(91, 155, 232, .6);
  filter: brightness(1.06);
  box-shadow: 0 10px 22px -12px rgba(91, 155, 232, .9);
}

#app .staff-management-container .el-button--warning {
  color: #f3d58a;
  background: rgba(212, 180, 106, .10);
  border-color: rgba(212, 180, 106, .45);
}

#app .staff-management-container .el-button--warning:hover,
#app .staff-management-container .el-button--warning:focus-visible {
  color: #ffe6a8;
  background: rgba(212, 180, 106, .18);
  border-color: rgba(212, 180, 106, .7);
  box-shadow: 0 10px 22px -14px rgba(212, 180, 106, .9);
}

/* 批量删除：没选人时是灰掉的幽灵；选中人后变红并缓慢呼吸，提示"已武装" */
#app .staff-management-container .card-actions .el-button--danger.is-disabled,
#app .staff-management-container .card-actions .el-button--danger.is-disabled:hover {
  transform: none;
  color: var(--cc-text-mute);
  background: rgba(255, 255, 255, .02);
  border-color: var(--cc-line-soft);
  opacity: .55;
  box-shadow: none;
}

#app .staff-management-container .card-actions .el-button--danger:not(.is-disabled) {
  color: #ffb3b9;
  background: rgba(232, 93, 106, .12);
  border-color: rgba(232, 93, 106, .55);
  animation: pm-armed 1.8s ease-in-out infinite;
}

#app .staff-management-container .card-actions .el-button--danger:not(.is-disabled):hover {
  color: #fff;
  background: linear-gradient(180deg, #ef7c87, #e85d6a);
  border-color: rgba(232, 93, 106, .8);
  animation: none;
  box-shadow: 0 10px 22px -12px rgba(232, 93, 106, .95);
}

@keyframes pm-armed {
  0%, 100% { box-shadow: 0 0 0 0 rgba(232, 93, 106, .35); }
  50%      { box-shadow: 0 0 0 5px rgba(232, 93, 106, 0); }
}

/* 已选人数（dash-fix 注入在批量删除按钮左侧） */
#app .staff-management-container .pm-sel {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 26px;
  padding: 0 10px;
  margin-right: 10px;
  border-radius: 5px;
  font-size: 12px;
  letter-spacing: 1px;
  color: #9cc0f1;
  background: rgba(91, 155, 232, .10);
  border: 1px solid rgba(91, 155, 232, .35);
  animation: cc-rise .25s cubic-bezier(.2, .7, .3, 1) backwards;
}

#app .staff-management-container .pm-sel b {
  font-weight: 700;
  font-size: 13px;
  color: #fff;
  font-variant-numeric: tabular-nums;
  font-family: ui-monospace, "SF Mono", "Menlo", "Consolas", monospace;
}

/* ---------- 表格卡片 ---------- */
#app .staff-management-container .table-card {
  border-radius: 8px;
  background: #141c2a;
  border: 1px solid var(--cc-line);
  box-shadow: none !important;
  overflow: hidden;
  color: var(--cc-text);
}

#app .staff-management-container .table-card .el-card__body { padding: 0; }

#app .staff-management-container .card-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 13px 18px;
  border-bottom: 1px solid var(--cc-line);
  background: #10171f;
}

#app .staff-management-container .card-title {
  font-size: 15px;
  font-weight: 650;
  letter-spacing: 2px;
  color: var(--cc-text);
}

#app .staff-management-container .card-actions { display: flex; align-items: center; }

/* ---------- 表格 ---------- */
#app .staff-management-container .personnel-table {
  --el-table-bg-color: #141c2a;
  --el-table-tr-bg-color: #141c2a;
  --el-table-header-bg-color: #10171f;
  --el-table-border-color: var(--cc-line-soft);
  --el-table-border: 1px solid var(--cc-line-soft);
  --el-table-text-color: var(--cc-text-dim);
  --el-table-header-text-color: var(--cc-text-mute);
  --el-table-row-hover-bg-color: #1a2536;
  --el-table-current-row-bg-color: #1a2740;
  --el-table-fixed-left-column: inset 10px 0 10px -10px rgba(0, 0, 0, .7);
  --el-table-fixed-right-column: inset -10px 0 10px -10px rgba(0, 0, 0, .7);
  border-radius: 0;
  background: #141c2a;
  color: var(--cc-text-dim);
}

#app .staff-management-container .personnel-table .el-table__inner-wrapper::before { background: var(--cc-line-soft); }

#app .staff-management-container .personnel-table th.el-table__cell {
  padding: 11px 8px !important;
  background: #10171f !important;
  border-bottom: 1px solid var(--cc-line) !important;
  font-size: 11.5px;
  font-weight: 600 !important;
  letter-spacing: 1.5px;
  color: var(--cc-text-mute);
}

#app .staff-management-container .personnel-table th.el-table__cell .cell { line-height: 1.4; }
#app .staff-management-container .personnel-table .cell { padding: 0 6px; }
#app .staff-management-container .personnel-table td:nth-child(7) .cell { white-space: nowrap; font-size: 12.5px; letter-spacing: 0; }
#app .staff-management-container .personnel-table .caret-wrapper { height: 22px; }
#app .staff-management-container .personnel-table .sort-caret.ascending { border-bottom-color: rgba(125, 139, 163, .6); }
#app .staff-management-container .personnel-table .sort-caret.descending { border-top-color: rgba(125, 139, 163, .6); }
#app .staff-management-container .personnel-table .ascending .sort-caret.ascending { border-bottom-color: #5b9be8; }
#app .staff-management-container .personnel-table .descending .sort-caret.descending { border-top-color: #5b9be8; }

#app .staff-management-container .personnel-table td.el-table__cell {
  border-bottom: 1px solid var(--cc-line-soft);
  font-size: 13px;
  color: var(--cc-text-dim);
  transition: background-color .15s ease, box-shadow .15s ease;
}

#app .staff-management-container .personnel-table .el-table__body tr:hover,
#app .staff-management-container .personnel-table .el-table__body tr:hover > td.el-table__cell {
  background-color: #1a2536 !important;
}

#app .staff-management-container .personnel-table .el-table__body tr:hover > td.el-table__cell:first-child {
  box-shadow: inset 3px 0 0 var(--cc-blue);
}

/* 勾选的行：整行蓝染 + 左侧亮边 */
#app .staff-management-container .personnel-table .el-table__body tr:has(.el-checkbox.is-checked) > td.el-table__cell {
  background-color: #1a2740 !important;
}

#app .staff-management-container .personnel-table .el-table__body tr:has(.el-checkbox.is-checked) > td.el-table__cell:first-child {
  box-shadow: inset 3px 0 0 var(--cc-blue);
}

#app .staff-management-container .personnel-table .el-checkbox__inner {
  width: 15px;
  height: 15px;
  border-radius: 4px;
  transition: background-color .15s ease, border-color .15s ease, transform .15s ease;
}

#app .staff-management-container .personnel-table .el-checkbox__inner::after { border-color: #0e141f; }
#app .staff-management-container .personnel-table .el-checkbox__input.is-indeterminate .el-checkbox__inner::before { background-color: #0e141f; }
#app .staff-management-container .personnel-table .el-checkbox__input.is-checked .el-checkbox__inner { transform: scale(1.06); box-shadow: 0 0 0 3px rgba(91, 155, 232, .18); }

/* 行入场：行渐显，单元格内容轻微上浮 */
@keyframes pm-row-in { from { opacity: 0; } to { opacity: 1; } }
@keyframes pm-cell-in { from { transform: translateY(6px); } to { transform: none; } }

@media (prefers-reduced-motion: no-preference) {
  #app .staff-management-container .personnel-table .el-table__body tr { animation: pm-row-in .45s ease-out backwards; }
  #app .staff-management-container .personnel-table .el-table__body tr > td .cell { animation: pm-cell-in .45s cubic-bezier(.2, .7, .3, 1) backwards; }
  #app .staff-management-container .personnel-table .el-table__body tr:nth-child(2),
  #app .staff-management-container .personnel-table .el-table__body tr:nth-child(2) > td .cell { animation-delay: .04s; }
  #app .staff-management-container .personnel-table .el-table__body tr:nth-child(3),
  #app .staff-management-container .personnel-table .el-table__body tr:nth-child(3) > td .cell { animation-delay: .08s; }
  #app .staff-management-container .personnel-table .el-table__body tr:nth-child(4),
  #app .staff-management-container .personnel-table .el-table__body tr:nth-child(4) > td .cell { animation-delay: .12s; }
  #app .staff-management-container .personnel-table .el-table__body tr:nth-child(5),
  #app .staff-management-container .personnel-table .el-table__body tr:nth-child(5) > td .cell { animation-delay: .16s; }
  #app .staff-management-container .personnel-table .el-table__body tr:nth-child(6),
  #app .staff-management-container .personnel-table .el-table__body tr:nth-child(6) > td .cell { animation-delay: .20s; }
  #app .staff-management-container .personnel-table .el-table__body tr:nth-child(7),
  #app .staff-management-container .personnel-table .el-table__body tr:nth-child(7) > td .cell { animation-delay: .24s; }
  #app .staff-management-container .personnel-table .el-table__body tr:nth-child(8),
  #app .staff-management-container .personnel-table .el-table__body tr:nth-child(8) > td .cell { animation-delay: .28s; }
  #app .staff-management-container .personnel-table .el-table__body tr:nth-child(9),
  #app .staff-management-container .personnel-table .el-table__body tr:nth-child(9) > td .cell { animation-delay: .32s; }
  #app .staff-management-container .personnel-table .el-table__body tr:nth-child(n+10),
  #app .staff-management-container .personnel-table .el-table__body tr:nth-child(n+10) > td .cell { animation-delay: .36s; }
  #app .staff-management-container .pm-head { animation: cc-rise .45s cubic-bezier(.2, .7, .3, 1) backwards; }
  #app .staff-management-container .search-bar { animation: cc-rise .45s cubic-bezier(.2, .7, .3, 1) .05s backwards; }
  #app .staff-management-container .table-card { animation: cc-rise .5s cubic-bezier(.2, .7, .3, 1) .1s backwards; }
}

/* 列排版（列序固定：1 勾选 2 序号 3 头像 4 姓名 5 出生 6 年龄 7 电话 8 学历
   9 特长 10 职务 11 岗位 12 入队 13 服役年限 14 状态 15 账号 16 操作） */
#app .staff-management-container .personnel-table td:nth-child(2) .cell {
  font-size: 12px;
  color: var(--cc-text-mute);
  font-variant-numeric: tabular-nums;
  font-family: ui-monospace, "SF Mono", "Menlo", "Consolas", monospace;
}

#app .staff-management-container .personnel-table td:nth-child(3) .cell { overflow: visible; }

#app .staff-management-container .personnel-table .el-avatar {
  width: 40px;
  height: 40px;
  border-radius: 8px !important;
  background: #1b2636;
  border: 1px solid rgba(180, 196, 220, .2);
  box-shadow: none !important;
  font-size: 15px;
  font-weight: 600;
  color: var(--cc-text-dim);
  cursor: zoom-in;
  transition: transform .2s cubic-bezier(.2, .7, .3, 1), border-color .2s ease, box-shadow .2s ease;
}

#app .staff-management-container .personnel-table .el-avatar img,
#app .staff-management-container .personnel-table .el-avatar .el-avatar__inner { border-radius: 7px !important; }

#app .staff-management-container .personnel-table tr:hover .el-avatar,
#app .staff-management-container .personnel-table .el-avatar:hover {
  transform: scale(1.08);
  border-color: rgba(91, 155, 232, .7);
  box-shadow: 0 0 0 3px rgba(91, 155, 232, .16) !important;
}

#app .staff-management-container .personnel-table td:nth-child(4) .cell {
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 1px;
  color: var(--cc-text);
}

#app .staff-management-container .personnel-table td:nth-child(5) .cell,
#app .staff-management-container .personnel-table td:nth-child(6) .cell,
#app .staff-management-container .personnel-table td:nth-child(7) .cell,
#app .staff-management-container .personnel-table td:nth-child(12) .cell,
#app .staff-management-container .personnel-table td:nth-child(13) .cell {
  font-variant-numeric: tabular-nums;
  font-family: ui-monospace, "SF Mono", "Menlo", "Consolas", monospace;
  letter-spacing: .3px;
}

#app .staff-management-container .personnel-table td:nth-child(5) .cell,
#app .staff-management-container .personnel-table td:nth-child(6) .cell,
#app .staff-management-container .personnel-table td:nth-child(12) .cell { color: var(--cc-text-mute); }
#app .staff-management-container .personnel-table td:nth-child(7) .cell { color: var(--cc-text-dim); }
#app .staff-management-container .personnel-table td:nth-child(8) .cell { color: var(--cc-text-mute); }

#app .staff-management-container .personnel-table td:nth-child(9) .cell {
  font-size: 12px;
  line-height: 1.55;
  color: var(--cc-text-mute);
}

#app .staff-management-container .personnel-table td:nth-child(10) .cell,
#app .staff-management-container .personnel-table td:nth-child(11) .cell { color: var(--cc-text-dim); }

/* 服役年限：文字下方一条 56px 的小进度条，--yrs（0~1，25 年满格）由 dash-fix 写在 td 上 */
#app .staff-management-container .personnel-table td:nth-child(13) .cell {
  position: relative;
  padding-bottom: 8px;
  color: var(--cc-text);
}

#app .staff-management-container .personnel-table td:nth-child(13) .cell::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 0;
  width: 56px;
  height: 3px;
  margin-left: -28px;
  border-radius: 2px;
  background: rgba(255, 255, 255, .07);
}

#app .staff-management-container .personnel-table td:nth-child(13) .cell::before {
  content: "";
  position: absolute;
  left: calc(50% - 28px);
  bottom: 0;
  z-index: 1;
  width: calc(56px * var(--yrs, 0));
  height: 3px;
  border-radius: 2px;
  background: linear-gradient(90deg, var(--cc-blue), #9cc0f1);
  box-shadow: 0 0 6px rgba(91, 155, 232, .5);
  transition: width .8s cubic-bezier(.2, .7, .3, 1);
}

/* 状态 / 账号胶囊：半透明底 + 描边 + 色点，颜色按状态分组（data-st 由 dash-fix 写） */
#app .staff-management-container .personnel-table .el-tag {
  --p: 125, 139, 163;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 26px;
  padding: 0 10px 0 8px;
  border-radius: 6px;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .5px;
  line-height: 1;
  color: rgb(var(--p));
  background: rgba(var(--p), .10);
  border: 1px solid rgba(var(--p), .32);
  transition: transform .15s ease, background-color .15s ease, border-color .15s ease, box-shadow .15s ease;
}

#app .staff-management-container .personnel-table .el-tag::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 50%;
  flex-shrink: 0;
  background: rgb(var(--p));
  box-shadow: 0 0 6px rgba(var(--p), .8);
}

#app .staff-management-container .personnel-table .el-tag .el-tag__content { display: inline-flex; align-items: center; gap: 4px; }
#app .staff-management-container .personnel-table .el-tag .el-icon { font-size: 12px; opacity: .7; margin-left: 0 !important; }

#app .staff-management-container .personnel-table .el-tag--success { --p: 62, 207, 134; }
#app .staff-management-container .personnel-table .el-tag--primary { --p: 91, 155, 232; }
#app .staff-management-container .personnel-table .el-tag--warning { --p: 224, 154, 69; }
#app .staff-management-container .personnel-table .el-tag--danger  { --p: 232, 93, 106; }
#app .staff-management-container .personnel-table .el-tag--info    { --p: 125, 139, 163; }

#app .staff-management-container .personnel-table .el-tag[data-st="在队"] { --p: 62, 207, 134; }
#app .staff-management-container .personnel-table .el-tag[data-st="已跟车"],
#app .staff-management-container .personnel-table .el-tag[data-st="培训"] { --p: 91, 155, 232; }
#app .staff-management-container .personnel-table .el-tag[data-st="公务"],
#app .staff-management-container .personnel-table .el-tag[data-st="后勤保障"],
#app .staff-management-container .personnel-table .el-tag[data-st="值班值守"] { --p: 76, 194, 216; }
#app .staff-management-container .personnel-table .el-tag[data-st="事假"] { --p: 224, 154, 69; }
#app .staff-management-container .personnel-table .el-tag[data-st="休假"],
#app .staff-management-container .personnel-table .el-tag[data-st="疗养"] { --p: 212, 180, 106; }
#app .staff-management-container .personnel-table .el-tag[data-st="伤病"] { --p: 232, 93, 106; }
#app .staff-management-container .personnel-table .el-tag[data-st="驻防"],
#app .staff-management-container .personnel-table .el-tag[data-st="集训"] { --p: 167, 139, 250; }
#app .staff-management-container .personnel-table .el-tag[data-st^="借调"] { --p: 156, 163, 175; }

/* 状态胶囊可点（改状态）：悬停抬起、加亮 */
#app .staff-management-container .personnel-table .el-tag[title]:hover {
  transform: translateY(-1px);
  background: rgba(var(--p), .2);
  border-color: rgba(var(--p), .65);
  box-shadow: 0 8px 16px -10px rgba(var(--p), .9);
}

/* 账号未开通：空心点 */
#app .staff-management-container .personnel-table td:nth-child(15) .el-tag--info::before {
  background: transparent;
  box-shadow: inset 0 0 0 1.5px rgb(var(--p));
}

/* 操作按钮（固定列） */
#app .staff-management-container .personnel-table .el-button--small {
  height: 28px;
  padding: 0 10px 0 12px;
  font-size: 12px;
  letter-spacing: 1px;
  color: #9cc0f1;
  background: rgba(91, 155, 232, .10);
  border: 1px solid rgba(91, 155, 232, .4);
}

#app .staff-management-container .personnel-table .el-button--small .el-icon--right { margin-left: 4px; transition: transform .2s ease; }

#app .staff-management-container .personnel-table .el-button--small:hover,
#app .staff-management-container .personnel-table .el-dropdown:has([aria-expanded="true"]) .el-button--small {
  color: #0e141f;
  background: linear-gradient(180deg, #7fb2f2, #5b9be8);
  border-color: rgba(91, 155, 232, .6);
  box-shadow: 0 8px 18px -10px rgba(91, 155, 232, .9);
}

#app .staff-management-container .personnel-table .el-dropdown:has([aria-expanded="true"]) .el-button--small .el-icon--right { transform: rotate(180deg); }

#app .staff-management-container .personnel-table .el-table-fixed-column--right.is-first-column::before { box-shadow: var(--el-table-fixed-right-column); }

/* 滚动条 / 空态 / 加载 */
#app .staff-management-container .personnel-table .el-scrollbar__thumb { background: rgba(180, 196, 220, .22); }
#app .staff-management-container .personnel-table .el-scrollbar__thumb:hover { background: rgba(180, 196, 220, .38); }
#app .staff-management-container .personnel-table .el-table__empty-text { color: var(--cc-text-mute); letter-spacing: 1px; }
#app .staff-management-container .el-loading-mask { background: rgba(14, 20, 31, .72); }
#app .staff-management-container .el-loading-spinner .path { stroke: #5b9be8; }

/* ---------- 表尾 ---------- */
#app .staff-management-container .table-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 11px 18px;
  border-top: 1px solid var(--cc-line);
  background: #10171f;
}

/* Vue 原来的"共 N 条数据"藏起来（保留给它更新），显示由 dash-fix 镜像出来的 .pm-count */
#app .staff-management-container .table-footer .stats-text { display: none; }

#app .staff-management-container .pm-count {
  font-size: 12px;
  letter-spacing: 1.5px;
  color: var(--cc-text-mute);
}

#app .staff-management-container .pm-count b {
  display: inline-block;
  margin: 0 3px;
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 0;
  color: var(--cc-text);
  font-variant-numeric: tabular-nums;
  font-family: ui-monospace, "SF Mono", "Menlo", "Consolas", monospace;
}

#app .staff-management-container .pm-count b.is-bump { animation: cc-kpi-bump .6s cubic-bezier(.2, .8, .3, 1); }
#app .staff-management-container .pm-count .pm-count__f { color: #f3d58a; }

#app .staff-management-container .pm-stamp {
  font-size: 11px;
  letter-spacing: 1px;
  color: var(--cc-text-mute);
  font-variant-numeric: tabular-nums;
  font-family: ui-monospace, "SF Mono", "Menlo", "Consolas", monospace;
}

/* ---------- 头像浮出名牌（dash-fix 挂在 body 上） ---------- */
.pm-peek {
  position: fixed;
  z-index: 3000;
  width: 172px;
  box-sizing: border-box;
  padding: 8px 8px 10px;
  border-radius: 10px;
  background: #16202f;
  border: 1px solid rgba(180, 196, 220, .18);
  box-shadow: 0 30px 70px -24px rgba(0, 0, 0, .95), 0 0 0 1px rgba(0, 0, 0, .5);
  pointer-events: none;
  opacity: 0;
  transform: translateY(6px) scale(.96);
  transition: opacity .18s ease, transform .22s cubic-bezier(.2, .7, .3, 1);
}

.pm-peek.is-on { opacity: 1; transform: none; }

.pm-peek img {
  display: block;
  width: 100%;
  height: 156px;
  margin: 0 auto;
  object-fit: cover;
  border-radius: 7px;
  background: #1b2636;
}

.pm-peek__name {
  margin-top: 9px;
  font-size: 15px;
  font-weight: 650;
  letter-spacing: 1.5px;
  color: #e8eef8;
  font-family: -apple-system, "PingFang SC", "Microsoft YaHei", system-ui, sans-serif;
}

.pm-peek__sub {
  margin-top: 3px;
  font-size: 11px;
  letter-spacing: .5px;
  color: #7d8ba3;
  font-family: -apple-system, "PingFang SC", "Microsoft YaHei", system-ui, sans-serif;
}

.pm-peek__st {
  --p: 125, 139, 163;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin-top: 8px;
  padding: 2px 8px 2px 7px;
  border-radius: 4px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .5px;
  color: rgb(var(--p));
  background: rgba(var(--p), .1);
  border: 1px solid rgba(var(--p), .3);
}

.pm-peek__st::before { content: ""; width: 5px; height: 5px; border-radius: 50%; background: rgb(var(--p)); }
.pm-peek__st[data-st="在队"] { --p: 62, 207, 134; }
.pm-peek__st[data-st="已跟车"], .pm-peek__st[data-st="培训"] { --p: 91, 155, 232; }
.pm-peek__st[data-st="公务"], .pm-peek__st[data-st="后勤保障"], .pm-peek__st[data-st="值班值守"] { --p: 76, 194, 216; }
.pm-peek__st[data-st="事假"] { --p: 224, 154, 69; }
.pm-peek__st[data-st="休假"], .pm-peek__st[data-st="疗养"] { --p: 212, 180, 106; }
.pm-peek__st[data-st="伤病"] { --p: 232, 93, 106; }
.pm-peek__st[data-st="驻防"], .pm-peek__st[data-st="集训"] { --p: 167, 139, 250; }

/* ---------- 挂在 body 上的 popper：下拉 / 选择 / 日期面板（仅本页，body.pm-page 由 dash-fix 打） ---------- */
body.pm-page .el-popper.el-select__popper,
body.pm-page .el-popper.el-dropdown__popper,
body.pm-page .el-popper.el-picker__popper,
body.pm-page .el-popper.leave-info-popover {
  --el-bg-color: #16202f;
  --el-bg-color-overlay: #16202f;
  --el-fill-color-blank: #16202f;
  --el-fill-color-light: rgba(91, 155, 232, .12);
  --el-fill-color-lighter: rgba(255, 255, 255, .04);
  --el-fill-color: rgba(255, 255, 255, .06);
  --el-text-color-primary: #e8eef8;
  --el-text-color-regular: #b4c0d4;
  --el-text-color-secondary: #7d8ba3;
  --el-text-color-placeholder: #7d8ba3;
  --el-border-color: rgba(180, 196, 220, .18);
  --el-border-color-light: rgba(180, 196, 220, .14);
  --el-border-color-lighter: rgba(180, 196, 220, .10);
  --el-border-color-extra-light: rgba(180, 196, 220, .07);
  --el-color-primary: #5b9be8;
  --el-color-primary-light-9: rgba(91, 155, 232, .14);
  --el-datepicker-text-color: #b4c0d4;
  --el-datepicker-off-text-color: rgba(125, 139, 163, .45);
  --el-datepicker-header-text-color: #e8eef8;
  --el-datepicker-icon-color: #7d8ba3;
  --el-datepicker-border-color: rgba(180, 196, 220, .14);
  --el-datepicker-inner-border-color: rgba(180, 196, 220, .10);
  --el-datepicker-inrange-bg-color: rgba(91, 155, 232, .15);
  --el-datepicker-inrange-hover-bg-color: rgba(91, 155, 232, .25);
  --el-datepicker-active-color: #5b9be8;
  --el-datepicker-hover-text-color: #9cc0f1;
  background: #16202f !important;
  border: 1px solid rgba(180, 196, 220, .16) !important;
  border-radius: 8px !important;
  box-shadow: 0 26px 60px -22px rgba(0, 0, 0, .95), 0 0 0 1px rgba(0, 0, 0, .45) !important;
  color: #b4c0d4;
}

body.pm-page .el-popper.el-select__popper .el-popper__arrow::before,
body.pm-page .el-popper.el-dropdown__popper .el-popper__arrow::before,
body.pm-page .el-popper.el-picker__popper .el-popper__arrow::before,
body.pm-page .el-popper.leave-info-popover .el-popper__arrow::before {
  background: #16202f !important;
  border-color: rgba(180, 196, 220, .16) !important;
}

body.pm-page .el-popper .el-scrollbar__thumb { background: rgba(180, 196, 220, .22); }

/* 选择器下拉项 */
body.pm-page .el-select-dropdown__list { padding: 6px 0; }

body.pm-page .el-select-dropdown__item {
  height: 34px;
  line-height: 34px;
  margin: 0 6px;
  padding: 0 12px;
  border-radius: 5px;
  font-size: 13px;
  letter-spacing: .5px;
  color: #b4c0d4;
  transition: background-color .12s ease, color .12s ease;
}

body.pm-page .el-select-dropdown__item.is-hovering,
body.pm-page .el-select-dropdown__item:hover { background: rgba(91, 155, 232, .12); color: #e8eef8; }
body.pm-page .el-select-dropdown__item.is-selected { color: #9cc0f1; font-weight: 600; }
body.pm-page .el-select-dropdown__item.is-disabled { color: rgba(125, 139, 163, .5); }
body.pm-page .el-select-dropdown.is-multiple .el-select-dropdown__item.is-selected::after { background-color: #9cc0f1; }

/* 操作下拉菜单 */
body.pm-page .el-dropdown-menu { padding: 6px; background: transparent; }

body.pm-page .el-dropdown-menu__item {
  padding: 8px 14px;
  border-radius: 5px;
  font-size: 13px;
  letter-spacing: .8px;
  line-height: 1.4;
  color: #b4c0d4;
  transition: background-color .12s ease, color .12s ease, padding-left .12s ease;
}

body.pm-page .el-dropdown-menu__item:not(.is-disabled):hover,
body.pm-page .el-dropdown-menu__item:not(.is-disabled):focus {
  padding-left: 18px;
  background: rgba(91, 155, 232, .12);
  color: #e8eef8;
}

body.pm-page .el-dropdown-menu__item--divided { margin: 4px 0; border-top: 1px solid rgba(180, 196, 220, .1); }
body.pm-page .el-dropdown-menu__item:last-child:not(.is-disabled):hover { color: #ffb3b9; background: rgba(232, 93, 106, .12); }

/* 休假详情气泡 */
body.pm-page .el-popper.leave-info-popover { padding: 0 !important; overflow: hidden; }
body.pm-page .leave-info-header { letter-spacing: 1px; }
body.pm-page .leave-info-label { color: #7d8ba3; letter-spacing: 1px; }
body.pm-page .leave-info-value { color: #e8eef8; font-variant-numeric: tabular-nums; }
body.pm-page .leave-info-value.leave-days { color: #f3d58a; }
body.pm-page .leave-info-value.leave-note { color: #b4c0d4; }
body.pm-page .leave-info-row + .leave-info-row { border-top: 1px dashed rgba(180, 196, 220, .12); }

/* 日期 / 时间面板 */
body.pm-page .el-picker-panel { background: transparent; color: #b4c0d4; }
body.pm-page .el-picker-panel__footer,
body.pm-page .el-date-picker__time-header { background: transparent; border-color: rgba(180, 196, 220, .1); }
body.pm-page .el-date-picker__header-label,
body.pm-page .el-picker-panel__icon-btn { color: #e8eef8; }
body.pm-page .el-picker-panel__icon-btn:hover,
body.pm-page .el-date-picker__header-label:hover { color: #9cc0f1; }
body.pm-page .el-date-table th { color: #7d8ba3; border-bottom-color: rgba(180, 196, 220, .12); }
body.pm-page .el-date-table td.today .el-date-table-cell__text { color: #9cc0f1; }
body.pm-page .el-date-table td.current:not(.disabled) .el-date-table-cell__text,
body.pm-page .el-month-table td.current:not(.disabled) .cell,
body.pm-page .el-year-table td.current:not(.disabled) .cell { background: #5b9be8; color: #0e141f; }
body.pm-page .el-date-table td.available:hover,
body.pm-page .el-month-table td .cell:hover,
body.pm-page .el-year-table td .cell:hover { color: #9cc0f1; }
body.pm-page .el-month-table td .cell,
body.pm-page .el-year-table td .cell { color: #b4c0d4; }
body.pm-page .el-time-panel { background: #16202f; border-color: rgba(180, 196, 220, .16); color: #b4c0d4; }
body.pm-page .el-time-panel__footer { border-top-color: rgba(180, 196, 220, .1); }
body.pm-page .el-time-panel__btn { color: #b4c0d4; }
body.pm-page .el-time-panel__btn.confirm { color: #9cc0f1; }
body.pm-page .el-time-spinner__item { color: #7d8ba3; }
body.pm-page .el-time-spinner__item.is-active:not(.is-disabled) { color: #e8eef8; }
body.pm-page .el-time-spinner__item:hover:not(.is-disabled):not(.is-active) { background: rgba(91, 155, 232, .12); }
body.pm-page .el-time-panel__content::after,
body.pm-page .el-time-panel__content::before { border-color: rgba(180, 196, 220, .12); }
body.pm-page .el-picker-panel .el-input__wrapper { background: rgba(10, 15, 24, .7); box-shadow: 0 0 0 1px rgba(180, 196, 220, .16) inset; }
body.pm-page .el-picker-panel .el-input__inner { color: #e8eef8; }
body.pm-page .el-picker-panel__footer .el-button { color: #b4c0d4; background: rgba(255, 255, 255, .04); border-color: rgba(180, 196, 220, .22); }
body.pm-page .el-picker-panel__footer .el-button.is-text { background: transparent; border-color: transparent; }
body.pm-page .el-picker-panel__footer .el-button:hover { color: #e8eef8; border-color: rgba(91, 155, 232, .5); }

/* ---------- 弹窗：复用 .tech-dialog 壳，补本页表单部件 ---------- */
.el-overlay .el-dialog.pm-dialog {
  --el-bg-color: #16202f;
  --el-bg-color-overlay: #16202f;
  --el-fill-color-blank: rgba(10, 15, 24, .7);
  --el-fill-color-light: rgba(255, 255, 255, .04);
  --el-fill-color-lighter: rgba(255, 255, 255, .03);
  --el-fill-color: rgba(255, 255, 255, .06);
  --el-text-color-primary: var(--cc-text);
  --el-text-color-regular: var(--cc-text-dim);
  --el-text-color-secondary: var(--cc-text-mute);
  --el-text-color-placeholder: var(--cc-text-mute);
  --el-border-color: rgba(180, 196, 220, .18);
  --el-border-color-hover: rgba(180, 196, 220, .32);
  --el-border-color-light: rgba(180, 196, 220, .14);
  --el-border-color-lighter: rgba(180, 196, 220, .10);
  --el-border-color-extra-light: rgba(180, 196, 220, .07);
  --el-disabled-bg-color: rgba(255, 255, 255, .03);
  --el-disabled-text-color: var(--cc-text-mute);
  --el-disabled-border-color: rgba(180, 196, 220, .12);
  --el-color-primary: #5b9be8;
  --el-color-primary-light-9: rgba(91, 155, 232, .12);
  --el-descriptions-table-border: 1px solid rgba(180, 196, 220, .12);
  --el-descriptions-item-bordered-label-background: rgba(255, 255, 255, .04);
}

.el-overlay .el-dialog.pm-dialog .el-dialog__body { padding: 20px 24px 8px; }

/* 输入类：el-input 已由 .tech-dialog 管；这里补 select / 大号 / 禁用 */
.el-overlay .el-dialog.pm-dialog .el-select__wrapper {
  min-height: 38px;
  padding: 2px 12px;
  border-radius: 6px;
  background: rgba(10, 15, 24, .7);
  border: 1px solid rgba(180, 196, 220, .16);
  box-shadow: none !important;
  transition: border-color .15s ease, box-shadow .15s ease;
}

.el-overlay .el-dialog.pm-dialog .el-select--large .el-select__wrapper,
.el-overlay .el-dialog.pm-dialog .el-input--large .el-input__wrapper { min-height: 40px; }
.el-overlay .el-dialog.pm-dialog .el-input--large .el-input__inner { height: 38px; }
.el-overlay .el-dialog.pm-dialog .el-select__wrapper.is-hovering { border-color: rgba(180, 196, 220, .3); }
.el-overlay .el-dialog.pm-dialog .el-select__wrapper.is-focused { border-color: rgba(91, 155, 232, .7); box-shadow: 0 0 0 3px rgba(91, 155, 232, .15) !important; }
.el-overlay .el-dialog.pm-dialog .el-select__placeholder { color: var(--cc-text); font-size: 14px; }
.el-overlay .el-dialog.pm-dialog .el-select__placeholder.is-transparent { color: var(--cc-text-mute); }
.el-overlay .el-dialog.pm-dialog .el-select__caret { color: var(--cc-text-mute); }
.el-overlay .el-dialog.pm-dialog .el-select__input { color: var(--cc-text); }

.el-overlay .el-dialog.pm-dialog .el-input.is-disabled .el-input__wrapper {
  background: rgba(255, 255, 255, .03);
  border-color: rgba(180, 196, 220, .12);
}

.el-overlay .el-dialog.pm-dialog .el-input.is-disabled .el-input__inner { color: var(--cc-text-dim); -webkit-text-fill-color: var(--cc-text-dim); }

/* 多选里的小标签 & 当前状态标签 */
.el-overlay .el-dialog.pm-dialog .el-tag {
  --p: 125, 139, 163;
  height: 24px;
  padding: 0 8px;
  border-radius: 5px;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .5px;
  color: rgb(var(--p));
  background: rgba(var(--p), .1);
  border: 1px solid rgba(var(--p), .32);
}

.el-overlay .el-dialog.pm-dialog .el-tag--success { --p: 62, 207, 134; }
.el-overlay .el-dialog.pm-dialog .el-tag--primary { --p: 91, 155, 232; }
.el-overlay .el-dialog.pm-dialog .el-tag--warning { --p: 224, 154, 69; }
.el-overlay .el-dialog.pm-dialog .el-tag--danger  { --p: 232, 93, 106; }
.el-overlay .el-dialog.pm-dialog .el-tag .el-tag__close { color: rgb(var(--p)); }
.el-overlay .el-dialog.pm-dialog .el-tag .el-tag__close:hover { background: rgba(var(--p), .3); color: #fff; }

/* 新增 / 编辑：分区从白卡改成描边区，标题改小字距标签 */
.el-overlay .el-dialog.pm-dialog .form-container { padding: 0 0 8px; max-height: 60vh; }
.el-overlay .el-dialog.pm-dialog .form-container::-webkit-scrollbar { width: 6px; }
.el-overlay .el-dialog.pm-dialog .form-container::-webkit-scrollbar-thumb { background: rgba(180, 196, 220, .22); border-radius: 3px; }

.el-overlay .el-dialog.pm-dialog .avatar-section,
.el-overlay .el-dialog.pm-dialog .form-section {
  margin-bottom: 14px;
  padding: 16px 18px 4px;
  border-radius: 8px;
  background: rgba(255, 255, 255, .025);
  border: 1px solid var(--cc-line-soft);
}

.el-overlay .el-dialog.pm-dialog .avatar-section { padding-bottom: 16px; }

.el-overlay .el-dialog.pm-dialog .section-title {
  margin: 0 0 14px;
  padding: 0;
  border: 0;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 2px;
  color: var(--cc-text-mute);
}

.el-overlay .el-dialog.pm-dialog .avatar-form-item { margin-bottom: 0; }
.el-overlay .el-dialog.pm-dialog .avatar-form-item .el-form-item__content { margin-left: 0 !important; }

.el-overlay .el-dialog.pm-dialog .avatar-uploader-enhanced .upload-area {
  width: 112px;
  height: 112px;
  border: 1px dashed rgba(180, 196, 220, .3);
  border-radius: 8px;
  background: rgba(10, 15, 24, .5);
  color: var(--cc-text-mute);
  transition: border-color .2s ease, background-color .2s ease, transform .2s ease;
}

.el-overlay .el-dialog.pm-dialog .avatar-uploader-enhanced .upload-area:hover {
  border-color: rgba(91, 155, 232, .7);
  background: rgba(91, 155, 232, .08);
  transform: translateY(-1px);
}

.el-overlay .el-dialog.pm-dialog .upload-placeholder { color: var(--cc-text-mute); }
.el-overlay .el-dialog.pm-dialog .upload-icon { font-size: 24px; margin-bottom: 6px; }
.el-overlay .el-dialog.pm-dialog .upload-text { font-size: 12px; letter-spacing: 1px; }
.el-overlay .el-dialog.pm-dialog .tip-text { font-size: 12px; letter-spacing: .3px; color: var(--cc-text-mute); }

.el-overlay .el-dialog.pm-dialog .form-item-enhanced .el-form-item__label { color: var(--cc-text-mute); }
.el-overlay .el-dialog.pm-dialog .el-form-item__error { color: #ffb3b9; }
.el-overlay .el-dialog.pm-dialog .el-form-item.is-error .el-input__wrapper,
.el-overlay .el-dialog.pm-dialog .el-form-item.is-error .el-select__wrapper { border-color: rgba(232, 93, 106, .7); }

.el-overlay .el-dialog.pm-dialog .dialog-footer-enhanced,
.el-overlay .el-dialog.pm-dialog .dialog-footer {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  padding: 0;
  border: 0;
  background: transparent;
}

.el-overlay .el-dialog.pm-dialog .el-dialog__footer .el-button--large { height: 36px; }

/* 人员详情 */
.el-overlay .el-dialog.pm-dialog .staff-details { padding: 0 0 12px; }

.el-overlay .el-dialog.pm-dialog .staff-header {
  margin-bottom: 16px;
  padding: 16px 18px;
  border-radius: 8px;
  background: rgba(255, 255, 255, .025);
  border: 1px solid var(--cc-line-soft);
}

.el-overlay .el-dialog.pm-dialog .avatar-square-large {
  width: 84px;
  height: 84px;
  border-radius: 8px;
  background: #1b2636;
  border: 1px solid var(--cc-line);
}

.el-overlay .el-dialog.pm-dialog .staff-basic-info h3 { margin: 0 0 6px; font-size: 20px; font-weight: 650; letter-spacing: 1.5px; color: var(--cc-text); }
.el-overlay .el-dialog.pm-dialog .staff-basic-info p { margin: 0 0 10px; font-size: 13px; letter-spacing: .5px; color: var(--cc-text-mute); }

.el-overlay .el-dialog.pm-dialog .el-descriptions__body { background: transparent; }
.el-overlay .el-dialog.pm-dialog .el-descriptions__table.is-bordered .el-descriptions__cell { border-color: rgba(180, 196, 220, .12); padding: 10px 12px; }
.el-overlay .el-dialog.pm-dialog .el-descriptions__label.is-bordered-label { width: 96px; font-size: 12px; letter-spacing: 1px; color: var(--cc-text-mute); background: rgba(255, 255, 255, .04); }
.el-overlay .el-dialog.pm-dialog .el-descriptions__content { font-size: 13px; color: var(--cc-text); font-variant-numeric: tabular-nums; }

/* 弹窗里的 el-alert（开通账号密码规则）已由 .tech-dialog 管 */

/* 操作菜单项前的小图标（data-i 由 dash-fix 按文字写） */
body.pm-page .el-dropdown-menu__item[data-i] { display: flex; align-items: center; gap: 9px; }

body.pm-page .el-dropdown-menu__item[data-i]::before {
  content: "";
  width: 14px;
  height: 14px;
  flex-shrink: 0;
  opacity: .75;
  background-color: currentColor;
  -webkit-mask: var(--i) center / contain no-repeat;
          mask: var(--i) center / contain no-repeat;
}

body.pm-page .el-dropdown-menu__item[data-i="详情"] { --i: var(--i-info); }
body.pm-page .el-dropdown-menu__item[data-i="编辑"] { --i: var(--i-pencil); }
body.pm-page .el-dropdown-menu__item[data-i="开通账号"] { --i: var(--i-user); }
body.pm-page .el-dropdown-menu__item[data-i="重置密码"] { --i: var(--i-key); }
body.pm-page .el-dropdown-menu__item[data-i="删除"] { --i: var(--i-trash2); }

/* 弹窗里的状态标签也按状态上色（data-st 由 dash-fix 写） */
.el-overlay .el-dialog.pm-dialog .el-tag[data-st="在队"], .el-overlay .el-dialog.pm-dialog .el-tag[data-st="在职"] { --p: 62, 207, 134; }
.el-overlay .el-dialog.pm-dialog .el-tag[data-st="已跟车"], .el-overlay .el-dialog.pm-dialog .el-tag[data-st="培训"] { --p: 91, 155, 232; }
.el-overlay .el-dialog.pm-dialog .el-tag[data-st="公务"], .el-overlay .el-dialog.pm-dialog .el-tag[data-st="后勤保障"], .el-overlay .el-dialog.pm-dialog .el-tag[data-st="值班值守"] { --p: 76, 194, 216; }
.el-overlay .el-dialog.pm-dialog .el-tag[data-st="事假"] { --p: 224, 154, 69; }
.el-overlay .el-dialog.pm-dialog .el-tag[data-st="休假"], .el-overlay .el-dialog.pm-dialog .el-tag[data-st="疗养"] { --p: 212, 180, 106; }
.el-overlay .el-dialog.pm-dialog .el-tag[data-st="伤病"] { --p: 232, 93, 106; }
.el-overlay .el-dialog.pm-dialog .el-tag[data-st="驻防"], .el-overlay .el-dialog.pm-dialog .el-tag[data-st="集训"] { --p: 167, 139, 250; }

/* 单人删除 / 分组删除的 MessageBox（挂在 body 上） */
body.pm-page .el-overlay-message-box { background: rgba(6, 10, 18, .72); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }

body.pm-page .el-message-box {
  --el-messagebox-title-color: #e8eef8;
  --el-messagebox-content-color: #b4c0d4;
  padding: 0;
  border-radius: 12px;
  background: linear-gradient(180deg, #16202f 0%, #111827 100%);
  border: 1px solid rgba(180, 196, 220, .16);
  box-shadow: 0 40px 90px -30px rgba(0, 0, 0, .9), 0 0 0 1px rgba(0, 0, 0, .5), inset 0 1px 0 rgba(255, 255, 255, .05);
  overflow: hidden;
}

body.pm-page .el-message-box__header { padding: 16px 52px 12px 22px; border-bottom: 1px solid rgba(180, 196, 220, .1); }
body.pm-page .el-message-box__title { font-size: 15px; font-weight: 650; letter-spacing: .6px; color: #e8eef8; }
body.pm-page .el-message-box__headerbtn { top: 10px; right: 12px; width: 32px; height: 32px; border-radius: 6px; }
body.pm-page .el-message-box__headerbtn .el-message-box__close { color: #7d8ba3; }
body.pm-page .el-message-box__headerbtn:hover { background: rgba(255, 255, 255, .07); }
body.pm-page .el-message-box__headerbtn:hover .el-message-box__close { color: #e8eef8; }
body.pm-page .el-message-box__content { padding: 18px 22px; font-size: 14px; line-height: 1.6; color: #b4c0d4; }
body.pm-page .el-message-box__status.el-icon { color: #e09a45; }
body.pm-page .el-message-box__btns { padding: 12px 18px 16px; gap: 10px; border-top: 1px solid rgba(180, 196, 220, .1); }

body.pm-page .el-message-box__btns .el-button {
  height: 34px;
  padding: 0 18px;
  margin: 0;
  border-radius: 6px;
  font-size: 13px;
  letter-spacing: 1px;
  color: #b4c0d4;
  background: rgba(255, 255, 255, .04);
  border: 1px solid rgba(180, 196, 220, .22);
}

body.pm-page .el-message-box__btns .el-button:hover { color: #e8eef8; background: rgba(255, 255, 255, .08); border-color: rgba(180, 196, 220, .4); }

body.pm-page .el-message-box__btns .el-button--primary {
  color: #fff;
  font-weight: 600;
  background: linear-gradient(180deg, #ef7c87, #e85d6a);
  border-color: rgba(232, 93, 106, .7);
}

body.pm-page .el-message-box__btns .el-button--primary:hover { color: #fff; filter: brightness(1.06); background: linear-gradient(180deg, #ef7c87, #e85d6a); border-color: rgba(232, 93, 106, .9); }

/* ==========================================================================
   人员管理页 · 其余弹窗：批量导入 / 批量导入头像 / 批量删除确认 / 休假分组管理 / 归队日历
   --------------------------------------------------------------------------
   这些弹窗默认不 append-to-body，就渲染在 .staff-management-container 里，所以页面级的
   按钮 / 变量已经先套上了一半；dash-fix 再给本页所有 .el-dialog 挂 .tech-dialog.pm-dialog。
   这里补每个弹窗自己的部件。批量删除确认原样式带大量 !important（红渐变白底），
   需要同等 !important + 更高特异度压回来。
   ========================================================================== */

/* ---------- 通用：弹窗里的 el-table（导入预览）/ 上传拖拽区 / 表单区块标题 ---------- */
.el-overlay .el-dialog.pm-dialog .el-table {
  --el-table-bg-color: #121a28;
  --el-table-tr-bg-color: #121a28;
  --el-table-header-bg-color: #10171f;
  --el-table-border-color: var(--cc-line-soft);
  --el-table-border: 1px solid var(--cc-line-soft);
  --el-table-text-color: var(--cc-text-dim);
  --el-table-header-text-color: var(--cc-text-mute);
  --el-table-row-hover-bg-color: #1a2536;
  background: #121a28;
  color: var(--cc-text-dim);
}

.el-overlay .el-dialog.pm-dialog .el-table th.el-table__cell { font-size: 11.5px; letter-spacing: 1px; color: var(--cc-text-mute); }
.el-overlay .el-dialog.pm-dialog .el-table .el-scrollbar__thumb { background: rgba(180, 196, 220, .22); }
.el-overlay .el-dialog.pm-dialog .el-table__empty-text { color: var(--cc-text-mute); }

.el-overlay .el-dialog.pm-dialog .el-upload-dragger {
  padding: 36px 24px;
  border: 1px dashed rgba(180, 196, 220, .3);
  border-radius: 10px;
  background: rgba(10, 15, 24, .5);
  transition: border-color .2s ease, background-color .2s ease, transform .2s ease;
}

.el-overlay .el-dialog.pm-dialog .el-upload-dragger:hover,
.el-overlay .el-dialog.pm-dialog .el-upload-dragger.is-dragover {
  border-color: rgba(91, 155, 232, .7);
  background: rgba(91, 155, 232, .07);
}

.el-overlay .el-dialog.pm-dialog .el-upload-dragger.is-dragover { border-width: 1px; padding: 36px 24px; }
.el-overlay .el-dialog.pm-dialog .el-upload-dragger:hover .upload-icon-large { transform: translateY(-4px); color: #9cc0f1; }

.el-overlay .el-dialog.pm-dialog .upload-icon-large {
  font-size: 40px;
  color: var(--cc-text-mute);
  transition: transform .25s cubic-bezier(.2, .7, .3, 1), color .2s ease;
}

.el-overlay .el-dialog.pm-dialog .upload-text-main { font-size: 15px; letter-spacing: 1px; color: var(--cc-text); }
.el-overlay .el-dialog.pm-dialog .upload-text-sub { font-size: 13px; color: var(--cc-text-mute); }
.el-overlay .el-dialog.pm-dialog .upload-link { color: #9cc0f1; font-style: normal; font-weight: 600; }
.el-overlay .el-dialog.pm-dialog .upload-link:hover { color: #c5dbf7; text-decoration: underline; }
.el-overlay .el-dialog.pm-dialog .upload-format { gap: 6px; }
.el-overlay .el-dialog.pm-dialog .upload-format .el-tag { height: 22px; font-size: 11px; letter-spacing: .5px; }

.el-overlay .el-dialog.pm-dialog .el-upload-list__item { color: var(--cc-text-dim); border-radius: 6px; }
.el-overlay .el-dialog.pm-dialog .el-upload-list__item:hover { background: rgba(255, 255, 255, .04); }
.el-overlay .el-dialog.pm-dialog .el-upload-list__item-name { color: var(--cc-text-dim); }

/* 区块小标题（上传头像文件 / 使用说明 / 导入格式要求） */
.el-overlay .el-dialog.pm-dialog .upload-section h4,
.el-overlay .el-dialog.pm-dialog .batch-tips h4,
.el-overlay .el-dialog.pm-dialog .preview-section h4,
.el-overlay .el-dialog.pm-dialog .tips-header h4 {
  margin: 0 0 12px;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 2px;
  color: var(--cc-text-mute);
}

.el-overlay .el-dialog.pm-dialog .preview-section h4::before { display: none; }

/* ---------- 批量导入人员信息 ---------- */
.el-overlay .el-dialog.pm-dialog.import-dialog-enhanced { max-height: none; }
.el-overlay .el-dialog.pm-dialog.import-dialog-enhanced .el-dialog__body { padding: 0; max-height: 64vh; overflow-y: auto; }
.el-overlay .el-dialog.pm-dialog.import-dialog-enhanced .el-dialog__body::-webkit-scrollbar { width: 6px; }
.el-overlay .el-dialog.pm-dialog.import-dialog-enhanced .el-dialog__body::-webkit-scrollbar-thumb { background: rgba(180, 196, 220, .22); border-radius: 3px; }
.el-overlay .el-dialog.pm-dialog .import-upload-enhanced,
.el-overlay .el-dialog.pm-dialog .import-preview-enhanced { padding: 22px 24px 18px; }

/* 步骤条 */
.el-overlay .el-dialog.pm-dialog .import-steps { margin-bottom: 22px; }
.el-overlay .el-dialog.pm-dialog .step { opacity: 1; }

.el-overlay .el-dialog.pm-dialog .step-icon {
  width: 36px;
  height: 36px;
  font-size: 15px;
  color: var(--cc-text-mute);
  background: rgba(255, 255, 255, .04);
  border: 1px solid var(--cc-line);
  transition: background-color .25s ease, border-color .25s ease, color .25s ease, box-shadow .25s ease, transform .25s ease;
}

.el-overlay .el-dialog.pm-dialog .step.active .step-icon {
  color: #0e141f;
  background: linear-gradient(180deg, #7fb2f2, #5b9be8);
  border-color: rgba(91, 155, 232, .7);
  box-shadow: 0 0 0 4px rgba(91, 155, 232, .16), 0 8px 18px -10px rgba(91, 155, 232, .9);
  transform: scale(1.06);
}

.el-overlay .el-dialog.pm-dialog .step.completed .step-icon {
  color: #0e141f;
  background: linear-gradient(180deg, #62dca0, #3ecf86);
  border-color: rgba(62, 207, 134, .7);
}

.el-overlay .el-dialog.pm-dialog .step-text { font-size: 12px; letter-spacing: 1.5px; color: var(--cc-text-mute); }
.el-overlay .el-dialog.pm-dialog .step.active .step-text { color: var(--cc-text); }
.el-overlay .el-dialog.pm-dialog .step.completed .step-text { color: #8ae9b9; }
.el-overlay .el-dialog.pm-dialog .step-line { width: 64px; height: 1px; margin: 0 16px 24px; background: var(--cc-line); transition: background-color .3s ease; }
.el-overlay .el-dialog.pm-dialog .step-line.completed { background: rgba(62, 207, 134, .6); }

/* 拖拽区：外层虚线框去掉，只留 el-upload-dragger 一层 */
.el-overlay .el-dialog.pm-dialog .upload-dragger-enhanced,
.el-overlay .el-dialog.pm-dialog .avatar-batch-uploader { padding: 0; border: 0; border-radius: 10px; }
.el-overlay .el-dialog.pm-dialog .upload-dragger-enhanced .el-upload-dragger { padding: 40px 24px; }
.el-overlay .el-dialog.pm-dialog .upload-animation { display: none; }

/* 格式说明 */
.el-overlay .el-dialog.pm-dialog .import-tips-enhanced,
.el-overlay .el-dialog.pm-dialog .batch-tips {
  margin: 16px 0;
  padding: 14px 16px;
  border-radius: 8px;
  background: rgba(255, 255, 255, .025);
  border: 1px solid var(--cc-line-soft);
}

.el-overlay .el-dialog.pm-dialog .tips-header { margin-bottom: 10px; gap: 8px; }
.el-overlay .el-dialog.pm-dialog .tips-header h4 { margin: 0; }
.el-overlay .el-dialog.pm-dialog .tips-icon { font-size: 15px; margin-right: 0; color: #9cc0f1; }
.el-overlay .el-dialog.pm-dialog .tips-content { gap: 7px; }
.el-overlay .el-dialog.pm-dialog .tip-item { font-size: 12.5px; letter-spacing: .3px; color: var(--cc-text-dim); }
.el-overlay .el-dialog.pm-dialog .tip-icon { font-size: 13px; color: #3ecf86; }
.el-overlay .el-dialog.pm-dialog .template-download { margin-top: 4px; }

.el-overlay .el-dialog.pm-dialog .batch-tips ul { padding-left: 18px; }
.el-overlay .el-dialog.pm-dialog .batch-tips li { margin-bottom: 6px; font-size: 12.5px; letter-spacing: .3px; color: var(--cc-text-dim); }
.el-overlay .el-dialog.pm-dialog .batch-tips li::marker { color: var(--cc-text-mute); }
.el-overlay .el-dialog.pm-dialog .batch-tips strong { color: var(--cc-text); font-weight: 600; }

.el-overlay .el-dialog.pm-dialog .batch-tips code {
  padding: 1px 6px;
  border-radius: 4px;
  font-size: 11.5px;
  color: #f3d58a;
  background: rgba(212, 180, 106, .1);
  border: 1px solid rgba(212, 180, 106, .28);
  font-family: ui-monospace, "SF Mono", "Menlo", "Consolas", monospace;
}

/* 预览：三枚统计 + 表格 */
.el-overlay .el-dialog.pm-dialog .preview-stats { gap: 12px; margin-bottom: 16px; }

.el-overlay .el-dialog.pm-dialog .preview-stats .stat-item {
  --p: 180, 196, 220;
  position: relative;
  flex: 1;
  padding: 10px 14px 9px 16px;
  border-radius: 8px;
  background: rgba(255, 255, 255, .025);
  border: 1px solid var(--cc-line);
  text-align: left;
  overflow: hidden;
}

.el-overlay .el-dialog.pm-dialog .preview-stats .stat-item::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background: rgb(var(--p)); opacity: .85; }
.el-overlay .el-dialog.pm-dialog .preview-stats .stat-item:nth-child(2) { --p: 62, 207, 134; }
.el-overlay .el-dialog.pm-dialog .preview-stats .stat-item:nth-child(3) { --p: 232, 93, 106; }

.el-overlay .el-dialog.pm-dialog .stat-number {
  font-size: 22px;
  line-height: 1.1;
  font-weight: 700;
  color: #fff;
  font-variant-numeric: tabular-nums;
  font-family: ui-monospace, "SF Mono", "Menlo", "Consolas", monospace;
}

.el-overlay .el-dialog.pm-dialog .stat-number.valid { color: #8ae9b9; }
.el-overlay .el-dialog.pm-dialog .stat-number.invalid { color: #ffb3b9; }
.el-overlay .el-dialog.pm-dialog .stat-label { margin-top: 3px; font-size: 11px; letter-spacing: 1.5px; color: var(--cc-text-mute); }
.el-overlay .el-dialog.pm-dialog .preview-table { border: 1px solid var(--cc-line); border-radius: 8px; overflow: hidden; }
.el-overlay .el-dialog.pm-dialog .error-text { color: #ffb3b9; }
.el-overlay .el-dialog.pm-dialog .success-text { color: #8ae9b9; }

/* 进度态（导入 / 头像 / 删除三处结构略有不同，一起收） */
.el-overlay .el-dialog.pm-dialog .import-progress-only,
.el-overlay .el-dialog.pm-dialog .delete-progress-only { min-height: 180px; padding: 20px 24px; }

.el-overlay .el-dialog.pm-dialog .import-progress-container,
.el-overlay .el-dialog.pm-dialog .avatar-progress-only {
  margin: 0;
  padding: 26px 28px;
  border-radius: 10px;
  background: rgba(255, 255, 255, .025);
  border: 1px solid var(--cc-line);
}

.el-overlay .el-dialog.pm-dialog .avatar-progress-only { margin: 20px 24px; }
.el-overlay .el-dialog.pm-dialog .progress-header h4 { color: var(--cc-text); font-size: 14px; letter-spacing: 1px; }
.el-overlay .el-dialog.pm-dialog .loading-text,
.el-overlay .el-dialog.pm-dialog .avatar-progress-container .loading-text,
.el-overlay .el-dialog.pm-dialog .delete-progress-container .loading-text { color: var(--cc-text); font-size: 14px; letter-spacing: .5px; }

.el-overlay .el-dialog.pm-dialog .loading-bar-background {
  --height: 14px;
  width: 100%;
  padding: 3px;
  background: rgba(10, 15, 24, .7);
  border: 1px solid var(--cc-line);
  box-shadow: none;
}

.el-overlay .el-dialog.pm-dialog .loading-bar-background .loading-bar { --height: 6px; background: linear-gradient(90deg, #5b9be8, #9cc0f1); box-shadow: 0 0 10px rgba(91, 155, 232, .6); }

.el-overlay .el-dialog.pm-dialog .loading-bar-bg,
.el-overlay .el-dialog.pm-dialog .avatar-progress-container .loading-bar-bg,
.el-overlay .el-dialog.pm-dialog .delete-progress-container .loading-bar-bg { height: 6px; border-radius: 3px; background: rgba(255, 255, 255, .06); box-shadow: none; }

.el-overlay .el-dialog.pm-dialog .avatar-progress-container .loading-bar { background: linear-gradient(90deg, #5b9be8, #9cc0f1); box-shadow: 0 0 10px rgba(91, 155, 232, .6); }
.el-overlay .el-dialog.pm-dialog .delete-progress-container .loading-bar { background: linear-gradient(90deg, #e85d6a, #ffb3b9); box-shadow: 0 0 10px rgba(232, 93, 106, .6); }

.el-overlay .el-dialog.pm-dialog .progress-percentage,
.el-overlay .el-dialog.pm-dialog .loading-percentage,
.el-overlay .el-dialog.pm-dialog .avatar-progress-container .loading-percentage,
.el-overlay .el-dialog.pm-dialog .delete-progress-container .loading-percentage {
  color: var(--cc-text-dim);
  font-variant-numeric: tabular-nums;
  font-family: ui-monospace, "SF Mono", "Menlo", "Consolas", monospace;
}

/* ---------- 批量导入头像 ---------- */
.el-overlay .el-dialog.pm-dialog.batch-avatar-dialog .el-dialog__body { padding: 0; max-height: 66vh; overflow-y: auto; }
.el-overlay .el-dialog.pm-dialog.batch-avatar-dialog .el-dialog__body::-webkit-scrollbar { width: 6px; }
.el-overlay .el-dialog.pm-dialog.batch-avatar-dialog .el-dialog__body::-webkit-scrollbar-thumb { background: rgba(180, 196, 220, .22); border-radius: 3px; }
.el-overlay .el-dialog.pm-dialog .batch-avatar-content { padding: 22px 24px 8px; }
.el-overlay .el-dialog.pm-dialog .upload-section,
.el-overlay .el-dialog.pm-dialog .preview-section { margin-bottom: 18px; }
.el-overlay .el-dialog.pm-dialog .batch-tips { margin: 0 0 16px; }

.el-overlay .el-dialog.pm-dialog .avatar-preview-grid { gap: 12px; padding: 2px; }
.el-overlay .el-dialog.pm-dialog .avatar-preview-grid::-webkit-scrollbar-track { background: transparent; }
.el-overlay .el-dialog.pm-dialog .avatar-preview-grid::-webkit-scrollbar-thumb { background: rgba(180, 196, 220, .22); }

.el-overlay .el-dialog.pm-dialog .avatar-preview-item {
  --p: 180, 196, 220;
  padding: 12px;
  gap: 12px;
  border-radius: 8px;
  background: rgba(255, 255, 255, .025);
  border: 1px solid var(--cc-line);
  box-shadow: none;
  transition: transform .2s cubic-bezier(.2, .7, .3, 1), border-color .2s ease, background-color .2s ease, box-shadow .2s ease;
}

.el-overlay .el-dialog.pm-dialog .avatar-preview-item:hover { transform: translateY(-2px); border-color: rgba(var(--p), .55); box-shadow: 0 14px 28px -18px rgba(var(--p), .8); }
.el-overlay .el-dialog.pm-dialog .avatar-preview-item.matched { --p: 62, 207, 134; background: rgba(62, 207, 134, .06); border-color: rgba(62, 207, 134, .35); }
.el-overlay .el-dialog.pm-dialog .avatar-preview-item.unmatched { --p: 232, 93, 106; background: rgba(232, 93, 106, .06); border-color: rgba(232, 93, 106, .35); }
.el-overlay .el-dialog.pm-dialog .avatar-preview-item.matched:hover,
.el-overlay .el-dialog.pm-dialog .avatar-preview-item.unmatched:hover { border-color: rgba(var(--p), .7); }

.el-overlay .el-dialog.pm-dialog .avatar-preview-image { width: 64px; height: 64px; border-radius: 8px; border: 1px solid rgba(var(--p), .4); background: #1b2636; }
.el-overlay .el-dialog.pm-dialog .avatar-preview-item.matched .avatar-preview-image,
.el-overlay .el-dialog.pm-dialog .avatar-preview-item.unmatched .avatar-preview-image { border-color: rgba(var(--p), .55); }
.el-overlay .el-dialog.pm-dialog .file-name { font-size: 13px; color: var(--cc-text); margin-bottom: 4px; }
.el-overlay .el-dialog.pm-dialog .avatar-preview-item.matched .file-name::before { color: #3ecf86; }
.el-overlay .el-dialog.pm-dialog .avatar-preview-item.unmatched .file-name::before { color: #e85d6a; }
.el-overlay .el-dialog.pm-dialog .file-size { font-size: 11px; letter-spacing: .5px; color: var(--cc-text-mute); margin-bottom: 8px; font-family: ui-monospace, "SF Mono", "Menlo", "Consolas", monospace; }

.el-overlay .el-dialog.pm-dialog .remove-btn {
  top: 8px;
  right: 8px;
  width: 22px;
  height: 22px;
  padding: 0;
  color: #ffb3b9;
  background: rgba(232, 93, 106, .12);
  border: 1px solid rgba(232, 93, 106, .45);
}

.el-overlay .el-dialog.pm-dialog .remove-btn:hover { color: #fff; background: #e85d6a; border-color: #e85d6a; transform: scale(1.08); }

/* ---------- 批量删除确认（压掉原来的红渐变白底） ---------- */
.el-overlay .el-dialog.pm-dialog.delete-confirm-dialog {
  border-radius: 12px !important;
  box-shadow: 0 40px 90px -30px rgba(0, 0, 0, .9), 0 0 0 1px rgba(232, 93, 106, .25), inset 0 1px 0 rgba(255, 255, 255, .05) !important;
}

.el-overlay .el-dialog.pm-dialog.delete-confirm-dialog .el-dialog__header {
  padding: 18px 60px 14px 24px !important;
  background: linear-gradient(180deg, rgba(232, 93, 106, .16), rgba(232, 93, 106, 0)) !important;
  border-bottom: 1px solid rgba(232, 93, 106, .2) !important;
}

.el-overlay .el-dialog.pm-dialog.delete-confirm-dialog .el-dialog__title { font-size: 16px !important; font-weight: 650 !important; color: #ffb3b9 !important; text-shadow: none !important; letter-spacing: 1px; }
.el-overlay .el-dialog.pm-dialog.delete-confirm-dialog .el-dialog__headerbtn { top: 12px !important; right: 14px !important; }
.el-overlay .el-dialog.pm-dialog.delete-confirm-dialog .el-dialog__headerbtn .el-dialog__close { color: var(--cc-text-mute) !important; font-size: 16px !important; font-weight: 400 !important; }
.el-overlay .el-dialog.pm-dialog.delete-confirm-dialog .el-dialog__headerbtn:hover .el-dialog__close { color: var(--cc-text) !important; }
.el-overlay .el-dialog.pm-dialog.delete-confirm-dialog .el-dialog__body { padding: 20px 24px 6px !important; background: transparent !important; }
.el-overlay .el-dialog.pm-dialog.delete-confirm-dialog .el-dialog__footer { padding: 0 20px 18px !important; background: transparent !important; border-top: 0 !important; }

.el-overlay .el-dialog.pm-dialog .delete-confirm-content {
  padding: 30px 26px 26px;
  border-radius: 10px;
  background: rgba(232, 93, 106, .06);
  border: 1px solid rgba(232, 93, 106, .22);
}

.el-overlay .el-dialog.pm-dialog .delete-confirm-content::before { height: 2px; background: linear-gradient(90deg, #e85d6a, #e09a45, #e85d6a); background-size: 200% 100%; }
.el-overlay .el-dialog.pm-dialog .warning-icon { margin-bottom: 18px; filter: drop-shadow(0 0 14px rgba(224, 154, 69, .55)); }
.el-overlay .el-dialog.pm-dialog .confirm-message h3 { margin: 0 0 12px; font-size: 18px; font-weight: 650; letter-spacing: 2px; color: var(--cc-text); text-shadow: none; }
.el-overlay .el-dialog.pm-dialog .confirm-message p { margin: 0 0 10px; font-size: 14px; font-weight: 400; letter-spacing: .3px; color: var(--cc-text-dim); }
.el-overlay .el-dialog.pm-dialog .confirm-message p strong { color: #ffb3b9; font-size: 18px; font-family: ui-monospace, "SF Mono", "Menlo", "Consolas", monospace; }
.el-overlay .el-dialog.pm-dialog .warning-text { background: none; -webkit-text-fill-color: #f0b46a; color: #f0b46a !important; font-weight: 500; font-size: 13px; letter-spacing: .5px; }

.el-overlay .el-dialog.pm-dialog .delete-dialog-footer { justify-content: flex-end; gap: 10px; padding: 0; }

.el-overlay .el-dialog.pm-dialog .delete-dialog-footer .el-button.cancel-btn-enhanced {
  height: 36px;
  padding: 0 18px !important;
  border-radius: 6px !important;
  font-weight: 500 !important;
  color: var(--cc-text-dim) !important;
  background: rgba(255, 255, 255, .04) !important;
  border: 1px solid rgba(180, 196, 220, .22) !important;
  box-shadow: none !important;
}

.el-overlay .el-dialog.pm-dialog .delete-dialog-footer .el-button.cancel-btn-enhanced:hover { color: var(--cc-text) !important; background: rgba(255, 255, 255, .08) !important; border-color: rgba(180, 196, 220, .4) !important; transform: translateY(-1px) !important; }

.el-overlay .el-dialog.pm-dialog .delete-dialog-footer .el-button.delete-btn-enhanced {
  height: 36px;
  padding: 0 18px !important;
  border-radius: 6px !important;
  font-weight: 600 !important;
  letter-spacing: 1px;
  background: linear-gradient(180deg, #ef7c87, #e85d6a) !important;
  border: 1px solid rgba(232, 93, 106, .8) !important;
  box-shadow: 0 10px 22px -12px rgba(232, 93, 106, .95) !important;
}

.el-overlay .el-dialog.pm-dialog .delete-dialog-footer .el-button.delete-btn-enhanced:hover { background: linear-gradient(180deg, #f28c96, #ec6b77) !important; border-color: rgba(232, 93, 106, 1) !important; transform: translateY(-1px) !important; }

/* ---------- 休假分组管理（.lg-dialog，95vw 的排班板） ---------- */
.el-overlay .el-dialog.pm-dialog.lg-dialog .el-dialog__header { padding: 14px 60px 12px 22px; }
.el-overlay .el-dialog.pm-dialog.lg-dialog .el-dialog__body { padding: 0; }
.el-overlay .el-dialog.pm-dialog.lg-dialog .el-dialog__footer { padding: 12px 20px 14px; }
.el-overlay .el-dialog.pm-dialog .lg-dialog-header { padding-right: 0; }
.el-overlay .el-dialog.pm-dialog .lg-dialog-title { font-size: 16px; font-weight: 650; letter-spacing: 2px; color: var(--cc-text); }
.el-overlay .el-dialog.pm-dialog .lg-dialog-time { font-size: 12px; letter-spacing: .5px; color: var(--cc-text-mute); font-family: ui-monospace, "SF Mono", "Menlo", "Consolas", monospace; }

.el-overlay .el-dialog.pm-dialog .lg-page { background: transparent; max-height: 80vh; }

.el-overlay .el-dialog.pm-dialog .lg-topbar {
  margin: 16px 20px 0;
  padding: 10px 14px;
  gap: 8px;
  border-radius: 8px;
  background: #10171f;
  border: 1px solid var(--cc-line);
}

.el-overlay .el-dialog.pm-dialog .lg-chip {
  --p: 180, 196, 220;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 26px;
  padding: 0 10px;
  border-radius: 5px;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .8px;
  color: rgb(var(--p));
  background: rgba(var(--p), .10);
  border: 1px solid rgba(var(--p), .3);
  font-variant-numeric: tabular-nums;
}

.el-overlay .el-dialog.pm-dialog .lg-chip-green { --p: 62, 207, 134; }
.el-overlay .el-dialog.pm-dialog .lg-chip-red { --p: 232, 93, 106; }
.el-overlay .el-dialog.pm-dialog .lg-chip-green::before,
.el-overlay .el-dialog.pm-dialog .lg-chip-red::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: rgb(var(--p)); box-shadow: 0 0 6px rgba(var(--p), .8); }
.el-overlay .el-dialog.pm-dialog .lg-sim-divider { height: 20px; background: var(--cc-line); }

/* 实况一组：第一枚「46人」前面挂个「实况」小标，四枚实线胶囊；进入模拟后整组压暗，只当基线 */
.el-overlay .el-dialog.pm-dialog .lg-topbar > .lg-chip:first-child { padding-left: 8px; }
.el-overlay .el-dialog.pm-dialog .lg-topbar > .lg-chip:first-child::before {
  content: "实况";
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 1.5px;
  color: var(--cc-text-mute);
  padding-right: 7px;
  margin-right: 1px;
  border-right: 1px solid var(--cc-line);
}
.el-overlay .el-dialog.pm-dialog .lg-topbar:has(.lg-sim-active) .lg-chip:not(.lg-chip-sim) {
  opacity: .5;
  filter: saturate(.35);
  transition: opacity .2s ease, filter .2s ease;
}
.el-overlay .el-dialog.pm-dialog .lg-topbar:has(.lg-sim-active) .lg-chip:not(.lg-chip-sim):hover { opacity: 1; filter: none; }

/* 模拟一组：琥珀色虚线胶囊，字更亮；三枚连着「退出模拟」按钮成一个色块 */
.el-overlay .el-dialog.pm-dialog .lg-chip-sim,
.el-overlay .el-dialog.pm-dialog .lg-chip-sim.lg-chip-green,
.el-overlay .el-dialog.pm-dialog .lg-chip-sim.lg-chip-red {
  --p: 212, 180, 106;
  color: #ffe6a8;
  background: rgba(212, 180, 106, .13);
  border: 1px dashed rgba(212, 180, 106, .62);
  animation: lg-sim-in .28s cubic-bezier(.2, .8, .3, 1) backwards;
}
.el-overlay .el-dialog.pm-dialog .lg-chip-sim + .lg-chip-sim { animation-delay: .05s; }
.el-overlay .el-dialog.pm-dialog .lg-chip-sim + .lg-chip-sim + .lg-chip-sim { animation-delay: .1s; }
/* 模拟在位率那枚：胶囊仍是琥珀，只有色点按达标 / 不达标变绿红 */
.el-overlay .el-dialog.pm-dialog .lg-chip-sim.lg-chip-green::before { background: #3ecf86; box-shadow: 0 0 6px rgba(62, 207, 134, .8); }
.el-overlay .el-dialog.pm-dialog .lg-chip-sim.lg-chip-red::before { background: #e85d6a; box-shadow: 0 0 6px rgba(232, 93, 106, .8); }

/* 模拟改动汇总（dash-fix 注入 .lg-sim-changes）：「改动 N · 张三、李四 · 还原」 */
.el-overlay .el-dialog.pm-dialog .lg-sim-changes {
  display: inline-flex;
  align-items: center;
  gap: 0;
  height: 26px;
  padding: 0 4px 0 10px;
  border-radius: 5px;
  font-size: 12px;
  color: var(--cc-text-mute);
  background: rgba(255, 255, 255, .03);
  border: 1px solid var(--cc-line);
  white-space: nowrap;
  transition: border-color .2s ease, background-color .2s ease;
  animation: lg-sim-in .28s cubic-bezier(.2, .8, .3, 1) .15s backwards;
}
.el-overlay .el-dialog.pm-dialog .lg-sim-changes.is-dirty {
  color: #ffe6a8;
  background: rgba(212, 180, 106, .16);
  border-color: rgba(212, 180, 106, .75);
  box-shadow: 0 0 0 3px rgba(212, 180, 106, .10);
}
.el-overlay .el-dialog.pm-dialog .lg-sim-changes__n {
  font-weight: 700;
  letter-spacing: .8px;
  font-variant-numeric: tabular-nums;
  cursor: default;
}
.el-overlay .el-dialog.pm-dialog .lg-sim-changes.is-dirty .lg-sim-changes__n { cursor: pointer; }
/* 模拟开着时东西多，工具条间距收一档，1400 宽一行放得下 */
.el-overlay .el-dialog.pm-dialog .lg-topbar:has(.lg-sim-active) { gap: 6px; }
.el-overlay .el-dialog.pm-dialog .lg-topbar:has(.lg-sim-active) .lg-chip:not(.lg-chip-sim) { padding: 0 8px; }

/* 名单：悬停时从胶囊下方弹出的小面板，一行一个「谁 → 改成什么」，点面板跳到下一个改过的人 */
.el-overlay .el-dialog.pm-dialog .lg-sim-changes { position: relative; }
.el-overlay .el-dialog.pm-dialog .lg-sim-changes__names {
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  z-index: 20;
  min-width: 150px;
  padding: 8px 12px;
  border-radius: 6px;
  font-style: normal;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.8;
  letter-spacing: .5px;
  white-space: pre-line;
  text-align: left;
  color: var(--cc-text);
  background: #10171f;
  border: 1px solid rgba(212, 180, 106, .55);
  box-shadow: 0 14px 30px -12px rgba(0, 0, 0, .8);
  cursor: pointer;
  opacity: 0;
  transform: translateY(-4px);
  pointer-events: none;
  transition: opacity .16s ease, transform .16s ease;
}
.el-overlay .el-dialog.pm-dialog .lg-sim-changes__names::before {
  content: "";
  position: absolute;
  top: -5px;
  left: 14px;
  width: 8px;
  height: 8px;
  transform: rotate(45deg);
  background: #10171f;
  border-left: 1px solid rgba(212, 180, 106, .55);
  border-top: 1px solid rgba(212, 180, 106, .55);
}
.el-overlay .el-dialog.pm-dialog .lg-sim-changes.is-dirty:hover .lg-sim-changes__names { opacity: 1; transform: none; pointer-events: auto; }
.el-overlay .el-dialog.pm-dialog .lg-sim-changes__revert {
  display: none;
  height: 20px;
  margin-left: 8px;
  padding: 0 8px;
  border-radius: 3px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 1px;
  color: #0e141f;
  background: #d4b46a;
  border: 0;
  cursor: pointer;
  font-family: inherit;
  transition: background-color .15s ease;
}
.el-overlay .el-dialog.pm-dialog .lg-sim-changes.is-dirty .lg-sim-changes__revert { display: inline-block; }
.el-overlay .el-dialog.pm-dialog .lg-sim-changes__revert:hover { background: #ecd08a; }

/* 被改过的人：琥珀描边 + 右上角「已改」角标，状态条也换琥珀 */
.el-overlay .el-dialog.pm-dialog .lg-row.lg-row-changed {
  border-color: rgba(212, 180, 106, .6) !important;
  box-shadow: inset 0 0 0 1px rgba(212, 180, 106, .18);
}
.el-overlay .el-dialog.pm-dialog .lg-row.lg-row-changed::before { background: #d4b46a !important; }
.el-overlay .el-dialog.pm-dialog .lg-row.lg-row-changed::after {
  content: "改→" attr(data-sim-to);
  position: absolute;
  top: 0;
  right: 0;
  padding: 1px 6px 2px 7px;
  border-radius: 0 0 0 5px;
  font-size: 9.5px;
  font-weight: 700;
  letter-spacing: 1px;
  color: #0e141f;
  background: #d4b46a;
  pointer-events: none;
}
.el-overlay .el-dialog.pm-dialog .lg-row.lg-row-changed .lg-sim-btn { box-shadow: 0 0 0 2px rgba(212, 180, 106, .35); }
.el-overlay .el-dialog.pm-dialog .lg-row.lg-row-flash { animation: lg-row-flash 1.2s ease-out; }

@keyframes lg-row-flash {
  0%   { background: rgba(212, 180, 106, .45); }
  100% { background: transparent; }
}
@keyframes lg-sim-in {
  from { opacity: 0; transform: translateX(-6px); }
  to   { opacity: 1; transform: none; }
}
@media (prefers-reduced-motion: reduce) {
  .el-overlay .el-dialog.pm-dialog .lg-chip-sim { animation: none; }
}

.el-overlay .el-dialog.pm-dialog .lg-sim-toggle {
  height: 26px;
  display: inline-flex;
  align-items: center;
  padding: 0 10px;
  border-radius: 5px;
  font-size: 12px;
  letter-spacing: 1px;
  color: var(--cc-text-dim);
  background: rgba(255, 255, 255, .04);
  border: 1px solid rgba(180, 196, 220, .22);
  transition: background-color .15s ease, border-color .15s ease, color .15s ease;
}

.el-overlay .el-dialog.pm-dialog .lg-sim-toggle:hover { color: var(--cc-text); background: rgba(255, 255, 255, .08); border-color: rgba(180, 196, 220, .4); }
.el-overlay .el-dialog.pm-dialog .lg-sim-toggle.lg-sim-active {
  gap: 6px;
  color: #ffe6a8 !important;
  background: rgba(212, 180, 106, .16) !important;
  border-color: rgba(212, 180, 106, .6) !important;
}
.el-overlay .el-dialog.pm-dialog .lg-sim-toggle.lg-sim-active::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #d4b46a;
  box-shadow: 0 0 6px rgba(212, 180, 106, .9);
  animation: vc-blink 1.6s ease-in-out infinite;
}

/* 模拟模式：工具条和成员卡都切成琥珀色描边，一眼知道现在看的是假设，不是实况 */
.el-overlay .el-dialog.pm-dialog .lg-topbar:has(.lg-sim-active) {
  border-color: rgba(212, 180, 106, .45);
  background: linear-gradient(180deg, rgba(212, 180, 106, .06), transparent 60%), #10171f;
}
.el-overlay .el-dialog.pm-dialog .lg-scroll:has(.lg-sim-btn) .lg-card { --p: 212, 180, 106; }
.el-overlay .el-dialog.pm-dialog .lg-scroll:has(.lg-sim-btn) .lg-card:has(.lg-head-remote) { --p: 212, 180, 106; }
.el-overlay .el-dialog.pm-dialog .lg-scroll:has(.lg-sim-btn) .lg-card:has(.lg-head-cadre) { --p: 212, 180, 106; }
.el-overlay .el-dialog.pm-dialog .lg-scroll:has(.lg-sim-btn) .lg-card-head { border-bottom-style: dashed; }

/* 日历入口：小台历 */
.el-overlay .el-dialog.pm-dialog .lg-cal-btn {
  width: 34px;
  height: 36px;
  border-radius: 6px;
  border: 1px solid var(--cc-line);
  box-shadow: none;
  transition: transform .15s ease, border-color .15s ease, box-shadow .15s ease;
}

.el-overlay .el-dialog.pm-dialog .lg-cal-btn:hover { transform: translateY(-1px); border-color: rgba(232, 93, 106, .6); box-shadow: 0 8px 16px -10px rgba(232, 93, 106, .9); }
.el-overlay .el-dialog.pm-dialog .lg-cal-btn-top { background: linear-gradient(180deg, #ef7c87, #e85d6a); color: #fff; font-size: 8px; line-height: 12px; letter-spacing: .5px; }
.el-overlay .el-dialog.pm-dialog .lg-cal-btn-day { background: #141c2a; color: var(--cc-text); font-size: 14px; font-weight: 700; }

/* 三个建组按钮：本地组沿用蓝色主按钮；外地 / 干部是写在 style 上的橙 / 紫实底，压成同色描边 */
.el-overlay .el-dialog.pm-dialog .lg-topbar .el-button { height: 32px; padding: 0 12px; font-size: 12.5px; }
.el-overlay .el-dialog.pm-dialog .lg-topbar .el-button[style*="245, 158, 11"] { color: #f7c66b !important; background: rgba(245, 158, 11, .12) !important; border-color: rgba(245, 158, 11, .5) !important; }
.el-overlay .el-dialog.pm-dialog .lg-topbar .el-button[style*="245, 158, 11"]:hover { background: rgba(245, 158, 11, .22) !important; border-color: rgba(245, 158, 11, .75) !important; color: #ffe0a3 !important; }
.el-overlay .el-dialog.pm-dialog .lg-topbar .el-button[style*="139, 92, 246"] { color: #c4b5fd !important; background: rgba(139, 92, 246, .14) !important; border-color: rgba(139, 92, 246, .5) !important; }
.el-overlay .el-dialog.pm-dialog .lg-topbar .el-button[style*="139, 92, 246"]:hover { background: rgba(139, 92, 246, .24) !important; border-color: rgba(139, 92, 246, .75) !important; color: #ddd6fe !important; }

.el-overlay .el-dialog.pm-dialog .lg-scroll { padding: 14px 20px 20px; }
.el-overlay .el-dialog.pm-dialog .lg-scroll::-webkit-scrollbar { width: 6px; }
.el-overlay .el-dialog.pm-dialog .lg-scroll::-webkit-scrollbar-thumb { background: rgba(180, 196, 220, .22); border-radius: 3px; }
.el-overlay .el-dialog.pm-dialog .lg-grid { gap: 12px; }

/* 分组卡 */
.el-overlay .el-dialog.pm-dialog .lg-card {
  --p: 91, 155, 232;
  border-radius: 8px;
  background: #141c2a;
  border: 1px solid var(--cc-line);
  transition: transform .2s cubic-bezier(.2, .7, .3, 1), border-color .2s ease, box-shadow .2s ease;
}

.el-overlay .el-dialog.pm-dialog .lg-card:hover { transform: translateY(-2px); border-color: rgba(var(--p), .45); box-shadow: 0 16px 32px -20px rgba(var(--p), .8); }
.el-overlay .el-dialog.pm-dialog .lg-card.lg-card-warn { border-color: rgba(232, 93, 106, .45); box-shadow: 0 0 0 1px rgba(232, 93, 106, .12); }
.el-overlay .el-dialog.pm-dialog .lg-card:has(.lg-head-remote) { --p: 245, 158, 11; }
.el-overlay .el-dialog.pm-dialog .lg-card:has(.lg-head-cadre) { --p: 139, 92, 246; }

.el-overlay .el-dialog.pm-dialog .lg-card-head {
  padding: 10px 12px 10px 10px;
  gap: 8px;
  background: rgba(var(--p), .09);
  border-bottom: 1px solid rgba(var(--p), .22);
}

.el-overlay .el-dialog.pm-dialog .lg-head-local,
.el-overlay .el-dialog.pm-dialog .lg-head-remote,
.el-overlay .el-dialog.pm-dialog .lg-head-cadre { background: rgba(var(--p), .09); }
.el-overlay .el-dialog.pm-dialog .lg-card-title,
.el-overlay .el-dialog.pm-dialog .lg-head-local .lg-card-title,
.el-overlay .el-dialog.pm-dialog .lg-head-remote .lg-card-title,
.el-overlay .el-dialog.pm-dialog .lg-head-cadre .lg-card-title { font-size: 14px; font-weight: 650; letter-spacing: 1px; color: var(--cc-text); }
.el-overlay .el-dialog.pm-dialog .lg-card-handle,
.el-overlay .el-dialog.pm-dialog .lg-head-local .lg-card-handle,
.el-overlay .el-dialog.pm-dialog .lg-head-remote .lg-card-handle,
.el-overlay .el-dialog.pm-dialog .lg-head-cadre .lg-card-handle { color: rgba(var(--p), .55); }
.el-overlay .el-dialog.pm-dialog .lg-card-handle:hover { color: rgb(var(--p)); }

.el-overlay .el-dialog.pm-dialog .lg-card-badge {
  padding: 2px 8px;
  border-radius: 4px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .3px;
  font-variant-numeric: tabular-nums;
  font-family: ui-monospace, "SF Mono", "Menlo", "Consolas", monospace;
}

.el-overlay .el-dialog.pm-dialog .badge-ok { color: #8ae9b9; background: rgba(62, 207, 134, .12); border: 1px solid rgba(62, 207, 134, .35); }
.el-overlay .el-dialog.pm-dialog .badge-bad { color: #ffb3b9; background: rgba(232, 93, 106, .12); border: 1px solid rgba(232, 93, 106, .35); }
.el-overlay .el-dialog.pm-dialog .lg-card-alert { color: #ffb3b9; background: rgba(232, 93, 106, .14); border: 1px solid rgba(232, 93, 106, .4); border-radius: 4px; font-size: 10.5px; letter-spacing: .5px; }

.el-overlay .el-dialog.pm-dialog .lg-card-body { padding: 8px 10px; gap: 5px; }

.el-overlay .el-dialog.pm-dialog .lg-row {
  position: relative;
  gap: 10px;
  padding: 7px 8px 7px 10px;
  border-radius: 6px;
  background: rgba(255, 255, 255, .025);
  border: 1px solid var(--cc-line-soft);
  overflow: hidden;
  transition: background-color .15s ease, border-color .15s ease, transform .15s ease;
}

/* 左侧 2px 状态条：在位绿、休假红，模拟切换时颜色跟着走 */
.el-overlay .el-dialog.pm-dialog .lg-row:not(.lg-row-empty)::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 2px;
  background: rgba(62, 207, 134, .7);
  transition: background-color .2s ease;
}

.el-overlay .el-dialog.pm-dialog .lg-row:hover { background: rgba(255, 255, 255, .05); border-color: var(--cc-line); }
.el-overlay .el-dialog.pm-dialog .lg-row-leave { background: rgba(232, 93, 106, .07); border-color: rgba(232, 93, 106, .26); }
.el-overlay .el-dialog.pm-dialog .lg-row-leave::before { background: rgba(232, 93, 106, .9); }
.el-overlay .el-dialog.pm-dialog .lg-row-leave:hover { background: rgba(232, 93, 106, .12); border-color: rgba(232, 93, 106, .42); }
.el-overlay .el-dialog.pm-dialog .lg-row-leave .lg-row-name { color: var(--cc-text-dim); }
.el-overlay .el-dialog.pm-dialog .lg-row-leave .lg-row-avatar { filter: saturate(.55) brightness(.85); }

.el-overlay .el-dialog.pm-dialog .lg-row-idx {
  width: 20px;
  height: 20px;
  border-radius: 5px;
  font-size: 11px;
  color: var(--cc-text-mute);
  background: rgba(255, 255, 255, .05);
  border: 1px solid var(--cc-line-soft);
  font-family: ui-monospace, "SF Mono", "Menlo", "Consolas", monospace;
}

.el-overlay .el-dialog.pm-dialog .lg-row-leave .lg-row-idx { color: #ffb3b9; border-color: rgba(232, 93, 106, .35); background: rgba(232, 93, 106, .1); }
.el-overlay .el-dialog.pm-dialog .lg-row-avatar { border: 1px solid rgba(180, 196, 220, .25); background: #1b2636; transition: transform .2s ease, border-color .2s ease; }
.el-overlay .el-dialog.pm-dialog .lg-row:hover .lg-row-avatar { transform: scale(1.06); border-color: rgba(91, 155, 232, .6); }
.el-overlay .el-dialog.pm-dialog .lg-row-leave .lg-row-avatar { border-color: rgba(232, 93, 106, .45); }
.el-overlay .el-dialog.pm-dialog .lg-row-name { font-size: 13.5px; font-weight: 600; letter-spacing: .8px; color: var(--cc-text); margin-bottom: 3px; }

/* 状态改成带色点的小胶囊 */
.el-overlay .el-dialog.pm-dialog .lg-row-st {
  --p: 180, 196, 220;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  height: 18px;
  padding: 0 7px 0 6px;
  border-radius: 3px;
  font-size: 10.5px;
  font-weight: 600;
  letter-spacing: .8px;
  color: rgb(var(--p));
  background: rgba(var(--p), .10);
  border: 1px solid rgba(var(--p), .28);
}
.el-overlay .el-dialog.pm-dialog .lg-row-st::before {
  content: "";
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: rgb(var(--p));
}
.el-overlay .el-dialog.pm-dialog .st-ok { --p: 62, 207, 134; color: #8ae9b9; }
.el-overlay .el-dialog.pm-dialog .st-leave { --p: 232, 93, 106; color: #ffb3b9; }
.el-overlay .el-dialog.pm-dialog .lg-row-return { font-size: 10.5px; letter-spacing: .3px; color: var(--cc-text-mute); font-variant-numeric: tabular-nums; }
.el-overlay .el-dialog.pm-dialog .lg-row .el-button.is-text { color: var(--cc-text-mute) !important; opacity: .55; transition: opacity .15s ease, color .15s ease, background-color .15s ease; }
.el-overlay .el-dialog.pm-dialog .lg-row:hover .el-button.is-text { opacity: 1; }
.el-overlay .el-dialog.pm-dialog .lg-row .el-button.is-text:hover { color: #ffb3b9 !important; background: rgba(232, 93, 106, .14); }

.el-overlay .el-dialog.pm-dialog .lg-row-empty { background: transparent; border: 1px dashed rgba(180, 196, 220, .25) !important; }
.el-overlay .el-dialog.pm-dialog .lg-row-empty:hover { background: rgba(91, 155, 232, .08); border-color: rgba(91, 155, 232, .6) !important; }
.el-overlay .el-dialog.pm-dialog .lg-row-empty .lg-row-idx { opacity: .5; color: var(--cc-text-mute) !important; }
.el-overlay .el-dialog.pm-dialog .lg-row-add { color: var(--cc-text-mute); font-size: 12px; letter-spacing: .5px; }
.el-overlay .el-dialog.pm-dialog .lg-row-empty:hover .lg-row-add { color: #9cc0f1; }

.el-overlay .el-dialog.pm-dialog .lg-card-foot {
  padding: 7px 14px;
  font-size: 11.5px;
  letter-spacing: .5px;
  color: var(--cc-text-mute);
  background: #10171f;
  border-top: 1px solid var(--cc-line-soft);
  font-variant-numeric: tabular-nums;
}

.el-overlay .el-dialog.pm-dialog .lg-card-foot span[style*="22, 163, 74"] { color: #3ecf86 !important; }
.el-overlay .el-dialog.pm-dialog .lg-card-foot span[style*="220, 38, 38"] { color: #ffb3b9 !important; }
.el-overlay .el-dialog.pm-dialog .lg-empty-state { color: var(--cc-text-mute); letter-spacing: 1px; }

/* 模拟模式：「→休假 / →在位」文字按钮改成开关。
   .lg-sim-btn-leave = 此人当前在位（点了变休假），滑块靠左、绿；
   .lg-sim-btn-ok    = 此人当前休假（点了变在位），滑块靠右、红。 */
.el-overlay .el-dialog.pm-dialog .lg-sim-btn {
  --p: 62, 207, 134;
  position: relative;
  width: 38px;
  height: 20px;
  padding: 0;
  border-radius: 10px;
  font-size: 0;
  line-height: 0;
  color: transparent;
  background: rgba(var(--p), .14);
  border: 1px solid rgba(var(--p), .45);
  cursor: pointer;
  flex-shrink: 0;
  transition: background-color .2s ease, border-color .2s ease, box-shadow .2s ease;
}
.el-overlay .el-dialog.pm-dialog .lg-sim-btn::after {
  content: "";
  position: absolute;
  top: 2px;
  left: 2px;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: rgb(var(--p));
  box-shadow: 0 1px 3px rgba(0, 0, 0, .45);
  transition: transform .22s cubic-bezier(.2, .8, .3, 1), background-color .2s ease;
}
.el-overlay .el-dialog.pm-dialog .lg-sim-btn:hover { background: rgba(var(--p), .24); border-color: rgba(var(--p), .7); box-shadow: 0 0 0 3px rgba(var(--p), .12); }
.el-overlay .el-dialog.pm-dialog .lg-sim-btn:active::after { width: 17px; }
.el-overlay .el-dialog.pm-dialog .lg-sim-btn-leave { --p: 62, 207, 134; }
.el-overlay .el-dialog.pm-dialog .lg-sim-btn-ok { --p: 232, 93, 106; }
.el-overlay .el-dialog.pm-dialog .lg-sim-btn-ok::after { transform: translateX(18px); }
.el-overlay .el-dialog.pm-dialog .lg-sim-btn-ok:active::after { transform: translateX(15px); }

/* 卡片入场 */
@media (prefers-reduced-motion: no-preference) {
  .el-overlay .el-dialog.pm-dialog .lg-card { animation: cc-rise .45s cubic-bezier(.2, .7, .3, 1) backwards; }
  .el-overlay .el-dialog.pm-dialog .lg-card:nth-child(2) { animation-delay: .05s; }
  .el-overlay .el-dialog.pm-dialog .lg-card:nth-child(3) { animation-delay: .10s; }
  .el-overlay .el-dialog.pm-dialog .lg-card:nth-child(4) { animation-delay: .15s; }
  .el-overlay .el-dialog.pm-dialog .lg-card:nth-child(n+5) { animation-delay: .2s; }
}

/* ===== 休假分组 · 二次打磨：KPI 块 / 分组进度线 / 座位条 / 归队倒计时（结构由 dash-fix lgDecorTick 注入） ===== */
.el-overlay .el-dialog.pm-dialog .lg-topbar { padding: 8px 12px; gap: 6px; }
.el-overlay .el-dialog.pm-dialog .lg-topbar .el-button,
.el-overlay .el-dialog.pm-dialog .lg-sim-toggle,
.el-overlay .el-dialog.pm-dialog .lg-sim-changes,
.el-overlay .el-dialog.pm-dialog .lg-cal-btn { height: 36px; }
.el-overlay .el-dialog.pm-dialog .lg-sim-toggle { padding: 0 12px; border-radius: 6px; }
.el-overlay .el-dialog.pm-dialog .lg-sim-changes { border-radius: 6px; }
.el-overlay .el-dialog.pm-dialog .lg-sim-divider { height: 26px; }

/* 胶囊 → KPI 小块：上标签下数字 */
.el-overlay .el-dialog.pm-dialog .lg-chip.lg-kpi {
  position: relative;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 0;
  height: 36px;
  min-width: 68px;
  padding: 0 12px;
  border-radius: 6px;
  overflow: hidden;
  background: linear-gradient(180deg, rgba(var(--p), .10), rgba(var(--p), .04));
  border-color: rgba(var(--p), .26);
  transition: border-color .2s ease, transform .2s ease;
}
.el-overlay .el-dialog.pm-dialog .lg-chip.lg-kpi:hover { border-color: rgba(var(--p), .55); }
.el-overlay .el-dialog.pm-dialog .lg-chip-green.lg-kpi::before,
.el-overlay .el-dialog.pm-dialog .lg-chip-red.lg-kpi::before { display: none; }
.el-overlay .el-dialog.pm-dialog .lg-kpi__l {
  font-size: 9.5px;
  font-weight: 600;
  line-height: 1;
  letter-spacing: 1.5px;
  color: var(--cc-text-mute);
}
.el-overlay .el-dialog.pm-dialog .lg-kpi__v {
  margin-top: 4px;
  font-size: 15px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: .3px;
  color: var(--cc-text);
  font-variant-numeric: tabular-nums;
  font-family: ui-monospace, "SF Mono", "Menlo", "Consolas", monospace;
}
.el-overlay .el-dialog.pm-dialog .lg-kpi__v small { margin-left: 2px; font-size: 10px; font-weight: 600; color: var(--cc-text-mute); font-family: inherit; }
.el-overlay .el-dialog.pm-dialog .lg-chip-green.lg-kpi .lg-kpi__v { color: #8ae9b9; }
.el-overlay .el-dialog.pm-dialog .lg-chip-red.lg-kpi .lg-kpi__v { color: #ffb3b9; }
.el-overlay .el-dialog.pm-dialog .lg-chip-sim.lg-kpi .lg-kpi__v { color: #ffe6a8; }
.el-overlay .el-dialog.pm-dialog .lg-chip-sim.lg-kpi .lg-kpi__l { color: rgba(255, 230, 168, .6); }

/* 第一块左侧竖排「实况」小标，替代原先的前缀文字 */
.el-overlay .el-dialog.pm-dialog .lg-topbar > .lg-chip.lg-kpi:first-child { padding-left: 24px; }
.el-overlay .el-dialog.pm-dialog .lg-topbar > .lg-chip.lg-kpi:first-child::before {
  content: "实况";
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 15px;
  padding: 0;
  margin: 0;
  border: 0;
  border-right: 1px solid rgba(var(--p), .22);
  writing-mode: vertical-rl;
  font-size: 8.5px;
  font-weight: 700;
  letter-spacing: 2px;
  color: var(--cc-text-dim);
  background: rgba(var(--p), .10);
}

/* 在位率块：底部一条按比例点亮的光带 */
.el-overlay .el-dialog.pm-dialog .lg-kpi--rate { min-width: 96px; }
.el-overlay .el-dialog.pm-dialog .lg-kpi--rate::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  height: 2px;
  width: calc(var(--rate, 0) * 1%);
  background: linear-gradient(90deg, rgba(var(--p), .5), rgb(var(--p)));
  box-shadow: 0 0 8px rgba(var(--p), .8);
  transition: width .7s cubic-bezier(.2, .7, .3, 1);
}
.el-overlay .el-dialog.pm-dialog .lg-chip-sim.lg-kpi--rate.lg-chip-green::after { background: linear-gradient(90deg, rgba(62, 207, 134, .5), #3ecf86); box-shadow: 0 0 8px rgba(62, 207, 134, .8); }
.el-overlay .el-dialog.pm-dialog .lg-chip-sim.lg-kpi--rate.lg-chip-red::after { background: linear-gradient(90deg, rgba(232, 93, 106, .5), #e85d6a); box-shadow: 0 0 8px rgba(232, 93, 106, .8); }

/* 分组卡：卡头下沿一条按在位率点亮的进度线 */
.el-overlay .el-dialog.pm-dialog .lg-card {
  --s: 62, 207, 134;
  background: linear-gradient(180deg, rgba(var(--p), .05), transparent 46%), #141c2a;
}
.el-overlay .el-dialog.pm-dialog .lg-card:has(.badge-bad) { --s: 232, 93, 106; }
.el-overlay .el-dialog.pm-dialog .lg-card-head { position: relative; }
.el-overlay .el-dialog.pm-dialog .lg-card-head::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -1px;
  height: 2px;
  width: calc(var(--pct, 0) * 1%);
  background: linear-gradient(90deg, rgba(var(--s), .45), rgb(var(--s)));
  box-shadow: 0 0 8px rgba(var(--s), .7);
  transition: width .7s cubic-bezier(.2, .7, .3, 1), background .3s ease;
  pointer-events: none;
}
.el-overlay .el-dialog.pm-dialog .lg-card-badge { border-radius: 4px; }
.el-overlay .el-dialog.pm-dialog .lg-card-head .el-button.is-text { opacity: .45; transition: opacity .15s ease; }
.el-overlay .el-dialog.pm-dialog .lg-card:hover .lg-card-head .el-button.is-text { opacity: 1; }

/* 卡脚：座位条 + 「n/cap 人」靠左，在位 / 休假 靠右 */
.el-overlay .el-dialog.pm-dialog .lg-card-foot {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 10px;
  padding: 7px 12px;
}
.el-overlay .el-dialog.pm-dialog .lg-card-foot > .lg-foot-bar + span { margin-right: auto; }
.el-overlay .el-dialog.pm-dialog .lg-card-foot > span[style] {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-weight: 600;
}
.el-overlay .el-dialog.pm-dialog .lg-card-foot > span[style]::before { content: ""; width: 5px; height: 5px; border-radius: 50%; background: currentColor; box-shadow: 0 0 5px currentColor; }
.el-overlay .el-dialog.pm-dialog .lg-foot-bar {
  display: inline-flex;
  align-items: center;
  gap: 3px;
}
.el-overlay .el-dialog.pm-dialog .lg-foot-bar i {
  width: 14px;
  height: 5px;
  border-radius: 2px;
  background: rgba(180, 196, 220, .12);
  box-shadow: inset 0 0 0 1px rgba(180, 196, 220, .10);
  animation: lg-cell-in .4s cubic-bezier(.2, .7, .3, 1) both;
  animation-delay: calc(var(--i, 0) * 45ms);
  transition: background-color .3s ease, box-shadow .3s ease;
}
.el-overlay .el-dialog.pm-dialog .lg-foot-bar i.is-ok { background: #3ecf86; box-shadow: 0 0 6px rgba(62, 207, 134, .6); }
.el-overlay .el-dialog.pm-dialog .lg-foot-bar i.is-leave { background: #e85d6a; box-shadow: 0 0 6px rgba(232, 93, 106, .6); }
@keyframes lg-cell-in {
  from { opacity: 0; transform: scaleX(.3); }
  to { opacity: 1; transform: none; }
}

/* 归队时间后面挂倒计时标：今日绿、1–3 天琥珀、更远灰、逾期红 */
.el-overlay .el-dialog.pm-dialog .lg-row-return {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: 2px;
}
.el-overlay .el-dialog.pm-dialog .lg-row-return[data-rel]::after {
  content: attr(data-rel);
  height: 15px;
  padding: 0 5px;
  border-radius: 3px;
  font-size: 9.5px;
  font-weight: 700;
  line-height: 15px;
  letter-spacing: .5px;
  color: #0e141f;
  background: #d4b46a;
  white-space: nowrap;
}
.el-overlay .el-dialog.pm-dialog .lg-row[data-ret="far"] .lg-row-return::after { color: var(--cc-text-dim); background: rgba(255, 255, 255, .08); font-weight: 600; }
.el-overlay .el-dialog.pm-dialog .lg-row[data-ret="today"] .lg-row-return::after { color: #0e141f; background: #3ecf86; }
.el-overlay .el-dialog.pm-dialog .lg-row[data-ret="over"] .lg-row-return::after { color: #fff; background: #e85d6a; }
.el-overlay .el-dialog.pm-dialog .lg-row[data-ret="today"]::before { animation: vc-blink 1.6s ease-in-out infinite; }

/* 成员行：头像多一圈状态色描边，悬停时更明确 */
.el-overlay .el-dialog.pm-dialog .lg-row:not(.lg-row-empty) .lg-row-avatar { box-shadow: 0 0 0 2px rgba(62, 207, 134, .18); }
.el-overlay .el-dialog.pm-dialog .lg-row-leave .lg-row-avatar { box-shadow: 0 0 0 2px rgba(232, 93, 106, .2); }

/* ---------- 归队日历（.cal-dialog） ---------- */
.el-overlay .el-dialog.pm-dialog.cal-dialog .el-dialog__body { padding: 14px 22px 8px; }
.el-overlay .el-dialog.pm-dialog .lg-calendar { background: transparent; border: 0; padding: 0; margin: 0; }
.el-overlay .el-dialog.pm-dialog .lg-cal-header { gap: 14px; margin-bottom: 10px; }
.el-overlay .el-dialog.pm-dialog .lg-cal-header .el-button.is-text { width: 30px; height: 30px; padding: 0; border-radius: 6px; color: var(--cc-text-dim); }
.el-overlay .el-dialog.pm-dialog .lg-cal-header .el-button.is-text:hover { color: var(--cc-text); background: rgba(255, 255, 255, .07); }
.el-overlay .el-dialog.pm-dialog .lg-cal-title { font-size: 15px; font-weight: 650; letter-spacing: 2px; color: var(--cc-text); font-variant-numeric: tabular-nums; }
.el-overlay .el-dialog.pm-dialog .lg-cal-grid { gap: 4px; }
.el-overlay .el-dialog.pm-dialog .lg-cal-weekday { font-size: 11px; letter-spacing: 2px; color: var(--cc-text-mute); }

.el-overlay .el-dialog.pm-dialog .lg-cal-day {
  min-height: 66px;
  border-radius: 6px;
  border: 1px solid transparent;
  transition: background-color .15s ease, border-color .15s ease, transform .15s ease;
}

.el-overlay .el-dialog.pm-dialog .lg-cal-day:not(.lg-cal-empty) { background: rgba(255, 255, 255, .025); border-color: var(--cc-line-soft); }
.el-overlay .el-dialog.pm-dialog .lg-cal-day:not(.lg-cal-empty):hover { background: rgba(255, 255, 255, .06); border-color: var(--cc-line); transform: translateY(-1px); }
.el-overlay .el-dialog.pm-dialog .lg-cal-today { background: rgba(91, 155, 232, .12) !important; border-color: rgba(91, 155, 232, .6) !important; box-shadow: 0 0 0 3px rgba(91, 155, 232, .12); }
.el-overlay .el-dialog.pm-dialog .lg-cal-has { background: rgba(232, 93, 106, .08) !important; border-color: rgba(232, 93, 106, .3) !important; }
.el-overlay .el-dialog.pm-dialog .lg-cal-has:hover { background: rgba(232, 93, 106, .14) !important; border-color: rgba(232, 93, 106, .5) !important; }
.el-overlay .el-dialog.pm-dialog .lg-cal-num { font-size: 13px; color: var(--cc-text); font-variant-numeric: tabular-nums; font-family: ui-monospace, "SF Mono", "Menlo", "Consolas", monospace; }
.el-overlay .el-dialog.pm-dialog .lg-cal-today .lg-cal-num { color: #9cc0f1; }
.el-overlay .el-dialog.pm-dialog .lunar-lunar { color: var(--cc-text-mute); }
.el-overlay .el-dialog.pm-dialog .lunar-jieqi { color: #3ecf86; }
.el-overlay .el-dialog.pm-dialog .lunar-festival { color: #f3d58a; }

.el-overlay .el-dialog.pm-dialog .lg-cal-dot {
  margin-top: 3px;
  padding: 1px 7px;
  border-radius: 4px;
  font-size: 10px;
  letter-spacing: .3px;
  color: #ffb3b9;
  background: rgba(232, 93, 106, .16);
  border: 1px solid rgba(232, 93, 106, .4);
  transition: background-color .15s ease, transform .15s ease;
}

.el-overlay .el-dialog.pm-dialog .lg-cal-dot:hover { background: rgba(232, 93, 106, .3); transform: translateY(-1px); }

/* 日历气泡（挂在 body） */
body.pm-page .el-popper.lg-cal-popover {
  background: #16202f !important;
  border: 1px solid rgba(180, 196, 220, .16) !important;
  border-radius: 8px !important;
  box-shadow: 0 26px 60px -22px rgba(0, 0, 0, .95), 0 0 0 1px rgba(0, 0, 0, .45) !important;
  color: #b4c0d4;
}

body.pm-page .el-popper.lg-cal-popover .el-popper__arrow::before { background: #16202f !important; border-color: rgba(180, 196, 220, .16) !important; }
body.pm-page .lg-cal-pop-title { padding: 8px 12px; background: rgba(232, 93, 106, .16); border-bottom: 1px solid rgba(232, 93, 106, .3); color: #ffb3b9; font-size: 12px; letter-spacing: 1px; }
body.pm-page .lg-cal-pop-item { color: #e8eef8; font-size: 13px; letter-spacing: .5px; }
body.pm-page .lg-cal-pop-item .el-avatar { border: 1px solid rgba(180, 196, 220, .25); }
body.pm-page .lg-cal-pop-group { color: #7d8ba3; background: rgba(255, 255, 255, .06); border: 1px solid rgba(180, 196, 220, .12); border-radius: 4px; }

/* 禁用态的主按钮（确认上传 / 确认导入 未就绪时）：压暗，不再抬起发光 */
#app .staff-management-container .el-button--primary.is-disabled,
#app .staff-management-container .el-button--primary.is-disabled:hover,
.el-overlay .el-dialog.pm-dialog .el-button--primary.is-disabled,
.el-overlay .el-dialog.pm-dialog .el-button--primary.is-disabled:hover {
  transform: none;
  filter: none;
  box-shadow: none;
  opacity: .45;
  cursor: not-allowed;
}

/* 车辆调整 · 新增 / 编辑车辆弹窗（dash-fix 挂 .pm-dialog） */
.el-overlay .el-dialog.pm-dialog .dialog-content { gap: 22px; }
.el-overlay .el-dialog.pm-dialog .upload-title { font-size: 12px; font-weight: 600; letter-spacing: 2px; color: var(--cc-text-mute); }
.el-overlay .el-dialog.pm-dialog .upload-container {
  padding: 12px;
  border-radius: 8px;
  background: rgba(255, 255, 255, .025);
  border: 1px solid var(--cc-line-soft);
}

.el-overlay .el-dialog.pm-dialog .upload-content { color: var(--cc-text-mute); }
.el-overlay .el-dialog.pm-dialog .upload-icon { color: var(--cc-text-mute); }
.el-overlay .el-dialog.pm-dialog .upload-text { color: var(--cc-text-mute); letter-spacing: .5px; }
.el-overlay .el-dialog.pm-dialog .image-preview { border-radius: 8px; overflow: hidden; border: 1px solid var(--cc-line); }
.el-overlay .el-dialog.pm-dialog .image-actions .el-button { color: var(--cc-text-dim); }

/* ===== 新增 / 编辑车辆（dash-fix 挂 .veh-dialog）：左表单分区，右侧照片 + 实时预览拼成一张车辆卡 ===== */
.el-overlay .el-dialog.pm-dialog.veh-dialog { --el-dialog-width: min(960px, 92vw) !important; }
.el-overlay .el-dialog.pm-dialog.veh-dialog .el-dialog__header { padding: 18px 60px 14px 24px; }
.el-overlay .el-dialog.pm-dialog.veh-dialog .el-dialog__title {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-size: 17px;
  font-weight: 650;
  letter-spacing: 2px;
}
.el-overlay .el-dialog.pm-dialog.veh-dialog .el-dialog__title::before {
  content: "";
  width: 22px;
  height: 17px;
  flex: none;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 24'%3E%3Crect x='14' y='1.6' width='16.4' height='1.6' rx='.4' fill='%23cfd6e0'/%3E%3Crect x='14' y='4.9' width='16.4' height='1.6' rx='.4' fill='%23cfd6e0'/%3E%3Cpath d='M2 11.2L7.2 5.8h7.4v11.6H2z' fill='%23e63946'/%3E%3Cpath d='M8.4 7.4h5v3.6h-6.4z' fill='%23a9dcf7'/%3E%3Crect x='8.2' y='3.5' width='4.4' height='1.9' rx='.5' fill='%23ffb703'/%3E%3Cpath d='M14.6 8.6h13.2l2.8 3.8v5H14.6z' fill='%23d62839'/%3E%3Crect x='14.6' y='12.6' width='16' height='1.5' fill='%23f8f9fa'/%3E%3Crect x='1.4' y='15.4' width='29.6' height='1.6' rx='.3' fill='%23b8c0cc'/%3E%3Ccircle cx='8.2' cy='20.2' r='2.6' fill='%231f2933'/%3E%3Ccircle cx='23.8' cy='20.2' r='2.6' fill='%231f2933'/%3E%3C/svg%3E") center / contain no-repeat;
}
.el-overlay .el-dialog.pm-dialog.veh-dialog .veh-dlg-sub {
  display: block;
  margin-top: 4px;
  font-size: 10.5px;
  font-weight: 600;
  letter-spacing: 2.5px;
  color: var(--cc-text-mute);
  font-family: ui-monospace, "SF Mono", "Menlo", "Consolas", monospace;
}
.el-overlay .el-dialog.pm-dialog.veh-dialog .el-dialog__body { padding: 20px 24px 8px; }
.el-overlay .el-dialog.pm-dialog.veh-dialog .dialog-content { gap: 26px; align-items: flex-start; }
.el-overlay .el-dialog.pm-dialog.veh-dialog .form-section {
  flex: 1;
  min-width: 0;
  padding: 18px 20px 6px;
  border-radius: 10px;
  background: rgba(255, 255, 255, .02);
  border: 1px solid var(--cc-line-soft);
}

/* 表单分区标题 */
.el-overlay .el-dialog.pm-dialog.veh-dialog .form-section::before,
.el-overlay .el-dialog.pm-dialog.veh-dialog .veh-remark::before {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 2px;
  color: var(--cc-text-mute);
}
.el-overlay .el-dialog.pm-dialog.veh-dialog .form-section::before { content: "基本信息"; margin-bottom: 16px; }
.el-overlay .el-dialog.pm-dialog.veh-dialog .veh-remark {
  position: relative;
  margin-top: 10px;
  margin-bottom: 34px;
  padding-top: 36px;
  border-top: 1px dashed var(--cc-line-soft);
}
.el-overlay .el-dialog.pm-dialog.veh-dialog .veh-remark::before {
  content: "车辆参数";
  position: absolute;
  top: 12px;
  left: 0;
}

.el-overlay .el-dialog.pm-dialog.veh-dialog .el-form-item { margin-bottom: 16px; }
.el-overlay .el-dialog.pm-dialog.veh-dialog .el-form-item__label {
  font-size: 12.5px;
  letter-spacing: 1px;
  color: var(--cc-text-dim);
  padding-right: 16px;
}
.el-overlay .el-dialog.pm-dialog.veh-dialog .el-form-item.is-required .el-form-item__label::before { color: #e85d6a; }
.el-overlay .el-dialog.pm-dialog.veh-dialog .el-input__wrapper,
.el-overlay .el-dialog.pm-dialog.veh-dialog .el-select__wrapper {
  min-height: 38px;
  border-radius: 7px;
  background: rgba(10, 15, 24, .7);
  box-shadow: 0 0 0 1px rgba(180, 196, 220, .16) inset !important;
  transition: box-shadow .15s ease, background-color .15s ease;
}
.el-overlay .el-dialog.pm-dialog.veh-dialog .el-input__wrapper:hover,
.el-overlay .el-dialog.pm-dialog.veh-dialog .el-select__wrapper:hover { box-shadow: 0 0 0 1px rgba(180, 196, 220, .32) inset !important; }
.el-overlay .el-dialog.pm-dialog.veh-dialog .el-input__wrapper.is-focus,
.el-overlay .el-dialog.pm-dialog.veh-dialog .el-select__wrapper.is-focused {
  box-shadow: 0 0 0 1px rgba(91, 155, 232, .8) inset, 0 0 0 3px rgba(91, 155, 232, .15) !important;
}
.el-overlay .el-dialog.pm-dialog.veh-dialog .el-input__inner { font-size: 14px; letter-spacing: .5px; color: var(--cc-text); }
/* 车牌输入用等宽数字 */
.el-overlay .el-dialog.pm-dialog.veh-dialog .el-form-item:nth-child(4) .el-input__inner {
  letter-spacing: 1.5px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}

/* 备注：高一点，下面挂提示（内容由 dash-fix 写到 data-hint） */
.el-overlay .el-dialog.pm-dialog.veh-dialog .veh-remark .el-textarea__inner {
  min-height: 150px !important;
  padding: 10px 12px;
  border-radius: 7px;
  font-size: 13px;
  line-height: 1.7;
  resize: vertical;
}
.el-overlay .el-dialog.pm-dialog.veh-dialog .veh-remark::after {
  content: attr(data-hint);
  position: absolute;
  left: 100px;
  bottom: -22px;
  padding-left: 15px;
  font-size: 11px;
  letter-spacing: .3px;
  color: var(--cc-text-mute);
  white-space: nowrap;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%237d8ba3' stroke-width='1.4'%3E%3Ccircle cx='8' cy='8' r='6.2'/%3E%3Cpath d='M8 7v4M8 5v.2'/%3E%3C/svg%3E") 0 1px / 11px 11px no-repeat;
}

/* 右栏：照片 + 预览拼成一张卡 */
.el-overlay .el-dialog.pm-dialog.veh-dialog .upload-section { width: 272px; flex: none; }
.el-overlay .el-dialog.pm-dialog.veh-dialog .upload-title { margin-bottom: 10px; letter-spacing: 2px; }
.el-overlay .el-dialog.pm-dialog.veh-dialog .upload-container {
  position: relative;
  padding: 0;
  border-radius: 10px 10px 0 0;
  border: 1px solid var(--cc-line);
  border-bottom: 0;
  background: #0c121c;
  overflow: hidden;
}
.el-overlay .el-dialog.pm-dialog.veh-dialog .image-preview { border: 0; border-radius: 0; position: relative; }
.el-overlay .el-dialog.pm-dialog.veh-dialog .preview-image {
  height: 176px;
  margin: 0;
  border-radius: 0;
  image-rendering: auto;
  filter: none;
  background: #0c121c;
  transition: transform .5s cubic-bezier(.2, .7, .3, 1);
}
.el-overlay .el-dialog.pm-dialog.veh-dialog .image-preview:hover .preview-image { transform: scale(1.04); }
.el-overlay .el-dialog.pm-dialog.veh-dialog .image-preview::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(180deg, transparent 55%, rgba(8, 12, 20, .7));
}
.el-overlay .el-dialog.pm-dialog.veh-dialog .image-actions {
  position: absolute;
  right: 10px;
  bottom: 10px;
  z-index: 2;
  opacity: 0;
  transform: translateY(4px);
  transition: opacity .18s ease, transform .2s ease;
}
.el-overlay .el-dialog.pm-dialog.veh-dialog .image-preview:hover .image-actions { opacity: 1; transform: none; }
.el-overlay .el-dialog.pm-dialog.veh-dialog .image-actions .el-button {
  height: 26px;
  padding: 0 10px;
  font-size: 11.5px;
  letter-spacing: 1px;
  color: #ffb3b9 !important;
  background: rgba(20, 12, 16, .75) !important;
  border: 1px solid rgba(232, 93, 106, .55) !important;
  -webkit-backdrop-filter: blur(6px);
          backdrop-filter: blur(6px);
}
.el-overlay .el-dialog.pm-dialog.veh-dialog .image-actions .el-button:hover { background: rgba(232, 93, 106, .3) !important; color: #fff !important; }

/* 没照片时：虚线投放区 */
.el-overlay .el-dialog.pm-dialog.veh-dialog .upload-area,
.el-overlay .el-dialog.pm-dialog.veh-dialog .vehicle-upload,
.el-overlay .el-dialog.pm-dialog.veh-dialog .el-upload--picture-card {
  width: 100%;
  height: 176px;
  margin: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  display: flex;
  align-items: center;
  justify-content: center;
}
.el-overlay .el-dialog.pm-dialog.veh-dialog .el-upload--picture-card {
  margin: 10px;
  width: calc(100% - 20px);
  height: 156px;
  border-radius: 8px;
  border: 1px dashed rgba(180, 196, 220, .3);
  background:
    radial-gradient(120px 60px at 50% 100%, rgba(91, 155, 232, .12), transparent 70%),
    rgba(255, 255, 255, .02);
  transition: border-color .15s ease, background-color .15s ease;
}
.el-overlay .el-dialog.pm-dialog.veh-dialog .el-upload--picture-card:hover { border-color: rgba(91, 155, 232, .7); background-color: rgba(91, 155, 232, .06); }
.el-overlay .el-dialog.pm-dialog.veh-dialog .upload-content { padding: 0; gap: 8px; }
.el-overlay .el-dialog.pm-dialog.veh-dialog .upload-icon {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  line-height: 1;
  color: #9cc0f1;
  background: rgba(91, 155, 232, .14);
  border: 1px solid rgba(91, 155, 232, .35);
}
.el-overlay .el-dialog.pm-dialog.veh-dialog .upload-text { font-size: 12px; letter-spacing: 1px; }

/* 预览卡（dash-fix 生成，跟车辆选择条上的卡片一个语言） */
.el-overlay .el-dialog.pm-dialog.veh-dialog .veh-preview {
  --acc: #7d8ba3;
  --acc-rgb: 125, 139, 163;
  position: relative;
  padding: 12px 14px 10px;
  border: 1px solid var(--cc-line);
  border-top: 1px solid rgba(var(--acc-rgb), .35);
  border-radius: 0 0 10px 10px;
  background:
    radial-gradient(200px 80px at 100% 0%, rgba(var(--acc-rgb), .14), transparent 70%),
    linear-gradient(180deg, #141c2a, #111827);
  transition: border-color .25s ease, background .25s ease;
}
.el-overlay .el-dialog.pm-dialog.veh-dialog .veh-preview::before {
  content: "";
  position: absolute;
  top: -1px;
  left: 10%;
  right: 10%;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--acc), transparent);
  transition: background .25s ease;
}
.el-overlay .el-dialog.pm-dialog.veh-dialog .veh-preview[data-st="on-duty"] { --acc: #3ecf86; --acc-rgb: 62, 207, 134; }
.el-overlay .el-dialog.pm-dialog.veh-dialog .veh-preview[data-st="standby"] { --acc: #5b9be8; --acc-rgb: 91, 155, 232; }
.el-overlay .el-dialog.pm-dialog.veh-dialog .veh-preview[data-st="maintain"] { --acc: #e0a945; --acc-rgb: 224, 169, 69; }
.el-overlay .el-dialog.pm-dialog.veh-dialog .veh-preview[data-st="fault"] { --acc: #e85d6a; --acc-rgb: 232, 93, 106; }
.el-overlay .el-dialog.pm-dialog.veh-dialog .veh-preview[data-st="training"] { --acc: #a78bfa; --acc-rgb: 167, 139, 250; }
.el-overlay .el-dialog.pm-dialog.veh-dialog .veh-preview[data-st="returning"] { --acc: #4cc2d8; --acc-rgb: 76, 194, 216; }

.el-overlay .el-dialog.pm-dialog.veh-dialog .veh-preview__row1 { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.el-overlay .el-dialog.pm-dialog.veh-dialog .veh-preview__name {
  font-size: 16px;
  font-weight: 700;
  letter-spacing: 1.5px;
  color: #f2f6ff;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.el-overlay .el-dialog.pm-dialog.veh-dialog .veh-preview__st {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  height: 20px;
  padding: 0 8px 0 7px;
  border-radius: 10px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 1px;
  color: var(--acc);
  background: rgba(var(--acc-rgb), .12);
  border: 1px solid rgba(var(--acc-rgb), .35);
  white-space: nowrap;
  transition: color .25s ease, background-color .25s ease, border-color .25s ease;
}
.el-overlay .el-dialog.pm-dialog.veh-dialog .veh-preview__st i {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--acc);
  box-shadow: 0 0 6px rgba(var(--acc-rgb), .9);
}
.el-overlay .el-dialog.pm-dialog.veh-dialog .veh-preview[data-st="on-duty"] .veh-preview__st i { animation: vc-blink 1.6s ease-in-out infinite; }

.el-overlay .el-dialog.pm-dialog.veh-dialog .veh-preview__row2 { display: flex; align-items: center; gap: 10px; margin-top: 10px; }
.el-overlay .el-dialog.pm-dialog.veh-dialog .veh-preview__plate {
  display: inline-flex;
  align-items: stretch;
  height: 22px;
  border-radius: 4px;
  overflow: hidden;
  background: #f3f5f8;
  border: 1px solid #c9d1dc;
  box-shadow: 0 1px 0 rgba(255, 255, 255, .5) inset, 0 2px 4px rgba(0, 0, 0, .4);
  font-family: ui-monospace, "SF Mono", "Menlo", "Consolas", monospace;
}
.el-overlay .el-dialog.pm-dialog.veh-dialog .veh-preview__plate-body {
  display: inline-flex;
  align-items: center;
  padding: 0 8px 0 9px;
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: 1.5px;
  color: #1a2230;
}
.el-overlay .el-dialog.pm-dialog.veh-dialog .veh-preview__plate-body::before {
  content: "";
  width: 4px;
  margin: 0 7px 0 -9px;
  background: linear-gradient(180deg, #2f6fd6, #1e4fa8);
}
.el-overlay .el-dialog.pm-dialog.veh-dialog .veh-preview__plate-tag {
  display: inline-flex;
  align-items: center;
  padding: 0 6px;
  font-size: 10.5px;
  font-weight: 700;
  font-style: normal;
  letter-spacing: 1px;
  color: #fff;
  background: #d62839;
}
.el-overlay .el-dialog.pm-dialog.veh-dialog .veh-preview__plate.is-empty { opacity: .45; }
.el-overlay .el-dialog.pm-dialog.veh-dialog .veh-preview__type {
  font-size: 12px;
  letter-spacing: 1px;
  color: var(--cc-text-dim);
  padding-left: 10px;
  border-left: 1px solid var(--cc-line);
}
.el-overlay .el-dialog.pm-dialog.veh-dialog .veh-preview__foot {
  margin-top: 10px;
  padding-top: 8px;
  border-top: 1px dashed var(--cc-line-soft);
  font-size: 10px;
  letter-spacing: 2px;
  color: var(--cc-text-mute);
  text-align: right;
}

.el-overlay .el-dialog.pm-dialog.veh-dialog .el-dialog__footer { padding: 14px 24px 18px; }
.el-overlay .el-dialog.pm-dialog.veh-dialog .dialog-footer { display: inline-flex; gap: 10px; }
.el-overlay .el-dialog.pm-dialog.veh-dialog .el-dialog__footer .el-button { height: 36px; padding: 0 22px; letter-spacing: 2px; }

.el-overlay .el-dialog.pm-dialog .el-textarea__inner {
  padding: 8px 12px;
  border-radius: 6px;
  font-size: 14px;
  letter-spacing: .3px;
  color: var(--cc-text);
  background: rgba(10, 15, 24, .7);
  border: 1px solid rgba(180, 196, 220, .16);
  box-shadow: none;
  transition: border-color .15s ease;
}

.el-overlay .el-dialog.pm-dialog .el-textarea__inner:hover { border-color: rgba(180, 196, 220, .3); }
.el-overlay .el-dialog.pm-dialog .el-textarea__inner:focus {
  border-color: rgba(91, 155, 232, .7);
  box-shadow: 0 0 0 3px rgba(91, 155, 232, .15);
}

/* ==========================================================================
   执勤车辆（/admin-station/vehicles）· 对齐指挥台
   --------------------------------------------------------------------------
   原版已经是深蓝底，但色相偏冷、状态胶囊是实心底、消防车是 emoji，和首页 / 花名册
   不统一。这里换同一套底、细描边按钮、状态色点胶囊、线性消防车图标。
   ========================================================================== */

#app .on-duty-vehicles {
  color: var(--cc-text);
  font-family: -apple-system, "PingFang SC", "Microsoft YaHei", system-ui, sans-serif;
  min-height: calc(100vh - 56px);
  background-color: var(--cc-bg-0);
  background-image:
    linear-gradient(rgba(180, 196, 220, .035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(180, 196, 220, .035) 1px, transparent 1px),
    radial-gradient(900px 380px at 50% -12%, rgba(196, 42, 60, .07), transparent 58%),
    linear-gradient(180deg, var(--cc-bg-1) 0%, var(--cc-bg-0) 100%);
  background-size: 48px 48px, 48px 48px, auto, auto;
  background-attachment: fixed;
}

#app .on-duty-vehicles::before,
#app .on-duty-vehicles::after { display: none; }

#app .on-duty-vehicles .header-section {
  padding: 16px 28px 10px;
  border-bottom: 1px solid var(--cc-line-soft);
  margin-bottom: 4px;
}

#app .on-duty-vehicles .page-title h1 {
  font-size: 22px;
  font-weight: 650;
  letter-spacing: 3px;
  color: var(--cc-text);
  text-shadow: none;
}

#app .on-duty-vehicles .subtitle {
  margin-top: 4px;
  font-size: 12px;
  letter-spacing: 1.5px;
  color: var(--cc-text-mute);
}

#app .on-duty-vehicles .datetime-display { color: var(--cc-text); }
#app .on-duty-vehicles .current-time {
  font-size: 22px;
  font-weight: 400;
  letter-spacing: 1.5px;
  color: #f2f6ff;
  font-variant-numeric: tabular-nums;
  font-family: ui-monospace, "SF Mono", "Menlo", "Consolas", monospace;
}

#app .on-duty-vehicles .current-date {
  font-size: 12px;
  letter-spacing: 1px;
  color: var(--cc-text-mute);
  opacity: 1;
}

#app .on-duty-vehicles .duty-layout { padding: 16px 22px 22px; gap: 14px; }

#app .on-duty-vehicles .vehicle-selection {
  width: 268px;
  padding: 14px 12px 12px;
  border-radius: 8px;
  background: #141c2a;
  border: 1px solid var(--cc-line);
  box-shadow: none;
}

#app .on-duty-vehicles .vehicle-section-title {
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 2.5px;
  color: var(--cc-text-mute);
  text-align: left;
  border-bottom: 1px solid var(--cc-line);
  padding: 0 4px 10px;
  margin: 0 0 12px;
}

#app .on-duty-vehicles .vehicle-button {
  --p: 125, 139, 163;
  margin-bottom: 6px;
  padding: 10px 12px;
  border-radius: 7px;
  background: rgba(255, 255, 255, .03);
  border: 1px solid var(--cc-line-soft);
  border-left: 3px solid rgb(var(--p));
  transition: transform .15s ease, background-color .15s ease, border-color .15s ease, box-shadow .15s ease;
}

#app .on-duty-vehicles .vehicle-button:hover {
  background: rgba(91, 155, 232, .08);
  border-color: rgba(91, 155, 232, .35);
  transform: translateX(2px);
}

#app .on-duty-vehicles .vehicle-button.active {
  background: rgba(91, 155, 232, .12);
  border: 1px solid rgba(91, 155, 232, .5);
  border-left: 3px solid #5b9be8;
  box-shadow: 0 10px 22px -16px rgba(91, 155, 232, .8);
}

#app .on-duty-vehicles .vehicle-button.active .vehicle-name { color: var(--cc-text); }

/* 状态色：边条 + 胶囊，不再实心块 */
#app .on-duty-vehicles .vehicle-button.status-on-duty     { --p: 91, 155, 232; }
#app .on-duty-vehicles .vehicle-button.status-standby     { --p: 62, 207, 134; }
#app .on-duty-vehicles .vehicle-button.status-maintenance,
#app .on-duty-vehicles .vehicle-button.status-refueling,
#app .on-duty-vehicles .vehicle-button.status-stationed   { --p: 224, 154, 69; }
#app .on-duty-vehicles .vehicle-button.status-fault,
#app .on-duty-vehicles .vehicle-button.status-repair      { --p: 232, 93, 106; }
#app .on-duty-vehicles .vehicle-button.status-training,
#app .on-duty-vehicles .vehicle-button.status-exercise,
#app .on-duty-vehicles .vehicle-button.status-research    { --p: 167, 139, 250; }
#app .on-duty-vehicles .vehicle-button.status-returning,
#app .on-duty-vehicles .vehicle-button.status-official    { --p: 76, 194, 216; }
#app .on-duty-vehicles .vehicle-button.status-linked      { --p: 45, 212, 191; }
#app .on-duty-vehicles .vehicle-button.status-off-duty,
#app .on-duty-vehicles .vehicle-button.status-default     { --p: 125, 139, 163; }

#app .on-duty-vehicles .vehicle-name { font-size: 14.5px; font-weight: 650; letter-spacing: .4px; color: var(--cc-text); }
#app .on-duty-vehicles .vehicle-type {
  font-size: 11px;
  color: var(--cc-text-mute);
  background: rgba(255, 255, 255, .05);
  border: 1px solid var(--cc-line-soft);
}

#app .on-duty-vehicles .vehicle-status-tag {
  min-width: 44px;
  padding: 2px 8px;
  border-radius: 4px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .5px;
  color: rgb(var(--p));
  background: rgba(var(--p), .12);
  border: 1px solid rgba(var(--p), .38);
}

#app .on-duty-vehicles .vehicle-button.status-on-duty .vehicle-status-tag,
#app .on-duty-vehicles .vehicle-button.status-standby .vehicle-status-tag,
#app .on-duty-vehicles .vehicle-button.status-maintenance .vehicle-status-tag,
#app .on-duty-vehicles .vehicle-button.status-off-duty .vehicle-status-tag,
#app .on-duty-vehicles .vehicle-button.status-returning .vehicle-status-tag,
#app .on-duty-vehicles .vehicle-button.status-linked .vehicle-status-tag,
#app .on-duty-vehicles .vehicle-button.status-training .vehicle-status-tag,
#app .on-duty-vehicles .vehicle-button.status-research .vehicle-status-tag,
#app .on-duty-vehicles .vehicle-button.status-cross-training .vehicle-status-tag,
#app .on-duty-vehicles .vehicle-button.status-stationed .vehicle-status-tag,
#app .on-duty-vehicles .vehicle-button.status-refueling .vehicle-status-tag,
#app .on-duty-vehicles .vehicle-button.status-fault .vehicle-status-tag,
#app .on-duty-vehicles .vehicle-button.status-repair .vehicle-status-tag,
#app .on-duty-vehicles .vehicle-button.status-exercise .vehicle-status-tag,
#app .on-duty-vehicles .vehicle-button.status-official .vehicle-status-tag,
#app .on-duty-vehicles .vehicle-button.status-default .vehicle-status-tag {
  background: rgba(var(--p), .12);
  color: rgb(var(--p));
}

#app .on-duty-vehicles .vehicle-personnel-count {
  min-width: 36px;
  padding: 2px 8px;
  border-radius: 4px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .3px;
  color: #9cc0f1;
  background: rgba(91, 155, 232, .14);
  border: 1px solid rgba(91, 155, 232, .32);
  font-variant-numeric: tabular-nums;
  font-family: ui-monospace, "SF Mono", "Menlo", "Consolas", monospace;
}

/* 消防车：emoji 隐掉，换成彩色消防车（红车身、云梯、警灯），各平台长得一样 */
#app .on-duty-vehicles .vehicle-icon.fire-truck-icon {
  width: 36px;
  height: 27px;
  font-size: 0 !important;
  line-height: 0;
  color: transparent;
  background-color: transparent;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 24'%3E%3Crect x='14' y='1.6' width='16.4' height='1.6' rx='.4' fill='%23cfd6e0'/%3E%3Crect x='14' y='4.9' width='16.4' height='1.6' rx='.4' fill='%23cfd6e0'/%3E%3Crect x='14' y='1.6' width='1.6' height='4.9' fill='%23e5eaf1'/%3E%3Crect x='21.4' y='1.6' width='1.6' height='4.9' fill='%23e5eaf1'/%3E%3Crect x='28.8' y='1.6' width='1.6' height='4.9' fill='%23e5eaf1'/%3E%3Cpath d='M2 11.2L7.2 5.8h7.4v11.6H2z' fill='%23e63946'/%3E%3Cpath d='M8.4 7.4h5v3.6h-6.4z' fill='%23a9dcf7'/%3E%3Crect x='8.2' y='3.5' width='4.4' height='1.9' rx='.5' fill='%23ffb703'/%3E%3Cpath d='M14.6 8.6h13.2l2.8 3.8v5H14.6z' fill='%23d62839'/%3E%3Crect x='14.6' y='12.6' width='16' height='1.5' fill='%23f8f9fa'/%3E%3Crect x='16.4' y='9.8' width='3.6' height='2.1' rx='.3' fill='%23a9dcf7'/%3E%3Crect x='1.4' y='15.4' width='29.6' height='1.6' rx='.3' fill='%23b8c0cc'/%3E%3Ccircle cx='8.2' cy='20.2' r='2.6' fill='%231f2933'/%3E%3Ccircle cx='23.8' cy='20.2' r='2.6' fill='%231f2933'/%3E%3Ccircle cx='8.2' cy='20.2' r='1' fill='%239aa5b1'/%3E%3Ccircle cx='23.8' cy='20.2' r='1' fill='%239aa5b1'/%3E%3C/svg%3E");
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
  -webkit-mask: none;
          mask: none;
  filter: drop-shadow(0 2px 4px rgba(0, 0, 0, .45));
  transition: transform .2s cubic-bezier(.2, .7, .3, 1);
}

#app .on-duty-vehicles .vehicle-button:hover .vehicle-icon.fire-truck-icon { transform: scale(1.08); }

#app .on-duty-vehicles .vehicle-detail {
  padding: 16px 18px 18px;
  border-radius: 8px;
  background: #141c2a;
  border: 1px solid var(--cc-line);
  box-shadow: none;
}

#app .on-duty-vehicles .section-header { margin-bottom: 14px; }
#app .on-duty-vehicles .section-header h3 {
  font-size: 16px;
  font-weight: 650;
  letter-spacing: 1.5px;
  color: var(--cc-text);
  text-shadow: none;
}

#app .on-duty-vehicles .vehicle-name-tag {
  padding: 3px 10px;
  border-radius: 5px;
  font-size: 13px;
  font-weight: 650;
  letter-spacing: .5px;
  color: #9cc0f1;
  background: rgba(91, 155, 232, .12);
  border: 1px solid rgba(91, 155, 232, .4);
  box-shadow: none;
}

#app .on-duty-vehicles .vehicle-personnel-cards { gap: 12px; }

/* 每一行固定同一高度：车辆信息多少行、人多人少都不会把卡片拉长/压扁 */
#app .on-duty-vehicles { --od-row-h: clamp(200px, 26vh, 300px); }
#app .on-duty-vehicles .cards-row,
#app .on-duty-vehicles .first-row,
#app .on-duty-vehicles .second-row,
#app .on-duty-vehicles .third-row,
body.fullscreen-mode #app .on-duty-vehicles .cards-row,
body.fullscreen-mode #app .on-duty-vehicles .first-row,
body.fullscreen-mode #app .on-duty-vehicles .second-row,
body.fullscreen-mode #app .on-duty-vehicles .third-row {
  height: var(--od-row-h) !important;
  min-height: 0 !important;
  max-height: var(--od-row-h) !important;
  grid-auto-rows: var(--od-row-h);
  align-items: stretch;
}
body.fullscreen-mode #app .on-duty-vehicles { --od-row-h: clamp(220px, 28vh, 340px); }
/* 没人的空行不占位 */
#app .on-duty-vehicles .cards-row:empty,
body.fullscreen-mode #app .on-duty-vehicles .cards-row:empty { display: none !important; }

#app .on-duty-vehicles .personnel-card-small,
body.fullscreen-mode #app .on-duty-vehicles .personnel-card-small {
  height: 100%;
  min-height: 0 !important;
}
#app .on-duty-vehicles .person-card-content { height: 100%; min-height: 0; }
/* 头像不再用正方形撑高，而是吃掉剩余高度，裁切居中 */
#app .on-duty-vehicles .person-avatar-container {
  aspect-ratio: auto;
  flex: 1 1 0;
  min-height: 0;
  width: 100%;
}
#app .on-duty-vehicles .person-avatar-container img,
#app .on-duty-vehicles .person-avatar {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 20%;
}
#app .on-duty-vehicles .person-card-role-name,
#app .on-duty-vehicles .person-card-specialty { flex-shrink: 0; }

#app .on-duty-vehicles .vehicle-info-card {
  background: #121a28;
  border: 1px solid var(--cc-line);
  border-radius: 8px;
  box-shadow: none;
  overflow: hidden;
  position: relative;
  height: 100%;
  min-height: 0;
}
#app .on-duty-vehicles .vehicle-info-content { height: 100%; min-height: 0; }
#app .on-duty-vehicles .vehicle-details { min-height: 0; overflow: hidden; }
#app .on-duty-vehicles .vehicle-details.v-details--spec { padding: 12px 14px; display: flex; flex-direction: column; }

#app .on-duty-vehicles .vehicle-image-container { background: #0c121c; }
#app .on-duty-vehicles .vehicle-details {
  background: linear-gradient(180deg, rgba(255, 255, 255, .03), transparent);
}

#app .on-duty-vehicles .vehicle-info-title {
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 2px;
  color: var(--cc-text-mute);
  border-bottom: 1px solid var(--cc-line-soft);
}

#app .on-duty-vehicles .remark-content {
  font-size: 13px;
  line-height: 1.65;
  color: var(--cc-text-dim);
  font-family: inherit;
  white-space: pre-wrap;
  word-break: break-word;
}

#app .on-duty-vehicles .personnel-card-small {
  background: rgba(255, 255, 255, .025);
  border: 1px solid var(--cc-line);
  border-radius: 8px;
  overflow: hidden;
  transition: transform .2s cubic-bezier(.2, .7, .3, 1), border-color .2s ease, box-shadow .2s ease;
}

#app .on-duty-vehicles .personnel-card-small:hover {
  transform: translateY(-3px);
  border-color: rgba(91, 155, 232, .5);
  box-shadow: 0 16px 32px -18px rgba(91, 155, 232, .7);
}

#app .on-duty-vehicles .person-card-role-name {
  font-size: 12.5px;
  font-weight: 650;
  letter-spacing: .6px;
  color: var(--cc-text);
  background: #10171f;
  border-top: 1px solid var(--cc-line-soft);
}

#app .on-duty-vehicles .person-card-specialty { background: #10171f; border-top: 0; }

#app .on-duty-vehicles .specialty-tag {
  background: rgba(91, 155, 232, .12);
  color: #9cc0f1;
  border: 1px solid rgba(91, 155, 232, .32);
  box-shadow: none;
  border-radius: 4px;
}

#app .on-duty-vehicles .specialty-empty { color: var(--cc-text-mute); font-style: normal; }
#app .on-duty-vehicles .person-card-default-avatar { background: #1b2636; color: var(--cc-text-dim); }
#app .on-duty-vehicles .vehicle-detail.empty-detail { color: var(--cc-text-mute); }
#app .on-duty-vehicles .empty-prompt { letter-spacing: 1px; color: var(--cc-text-mute); }

#app .on-duty-vehicles .progress-ring { color: #5b9be8; }
#app .on-duty-vehicles .progress-number { color: var(--cc-text); font-variant-numeric: tabular-nums; }
#app .on-duty-vehicles .carousel-info { color: var(--cc-text-mute); }

@media (prefers-reduced-motion: no-preference) {
  #app .on-duty-vehicles .header-section { animation: cc-rise .4s cubic-bezier(.2, .7, .3, 1) backwards; }
  #app .on-duty-vehicles .vehicle-selection { animation: cc-rise .45s cubic-bezier(.2, .7, .3, 1) .05s backwards; }
  #app .on-duty-vehicles .vehicle-detail { animation: cc-rise .5s cubic-bezier(.2, .7, .3, 1) .1s backwards; }
  #app .on-duty-vehicles .vehicle-button { animation: cc-rise .4s cubic-bezier(.2, .7, .3, 1) backwards; }
  #app .on-duty-vehicles .vehicle-button:nth-child(2) { animation-delay: .04s; }
  #app .on-duty-vehicles .vehicle-button:nth-child(3) { animation-delay: .08s; }
  #app .on-duty-vehicles .vehicle-button:nth-child(4) { animation-delay: .12s; }
  #app .on-duty-vehicles .vehicle-button:nth-child(5) { animation-delay: .16s; }
  #app .on-duty-vehicles .vehicle-button:nth-child(n+6) { animation-delay: .2s; }
}
