/* ============================================================================
 *  统一请求生命周期的 UI：loading 按钮 / toast+重试 / 任务坞 / 启动异常徽标
 *  刻意做成自包含（不依赖 app.css 的变量，即使 app.js 崩了也能正常显示）
 * ==========================================================================*/

/* ---- 按钮 loading 态：点了必定有反应 ---- */
.spzz-busy {
  position: relative;
  opacity: .72;
  cursor: progress !important;
  pointer-events: none;
}
.spzz-busy::after {
  content: '';
  display: inline-block;
  width: 9px; height: 9px;
  margin-left: 6px;
  vertical-align: -1px;
  border: 1.5px solid currentColor;
  border-right-color: transparent;
  border-radius: 50%;
  animation: spzz-spin .7s linear infinite;
}
@keyframes spzz-spin { to { transform: rotate(360deg); } }

/* ---- 状态文本 ---- */
.spzz-st-loading { color: #a99cff; }
.spzz-st-ok      { color: #34d69f; }
.spzz-st-err     { color: #e06060; }
.spzz-retry {
  margin-left: 8px;
  padding: 1px 8px;
  font-size: 11px;
  line-height: 1.6;
  border: 1px solid rgba(224, 96, 96, .55);
  border-radius: 4px;
  background: rgba(224, 96, 96, .12);
  color: #ffb4b4;
  cursor: pointer;
}
.spzz-retry:hover { background: rgba(224, 96, 96, .24); }

/* ---- Toast ---- */
.spzz-toasts {
  position: fixed;
  left: 50%; top: 16px;
  transform: translateX(-50%);
  z-index: 99999;
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-items: center;
  pointer-events: none;
}
.spzz-toast {
  pointer-events: auto;
  display: flex;
  align-items: center;
  gap: 10px;
  max-width: min(560px, 92vw);
  padding: 8px 14px;
  border-radius: 8px;
  font-size: 12.5px;
  line-height: 1.55;
  color: #eef1f7;
  background: rgba(24, 26, 38, .96);
  border: 1px solid rgba(111, 92, 255, .38);
  box-shadow: 0 8px 26px rgba(0, 0, 0, .45);
  animation: spzz-toast-in .22s ease;
}
.spzz-toast.out { opacity: 0; transform: translateY(-6px); transition: all .24s ease; }
.spzz-toast-err  { border-color: rgba(224, 96, 96, .6);  background: rgba(46, 22, 26, .97); }
.spzz-toast-ok   { border-color: rgba(78, 201, 160, .55); }
.spzz-toast-warn { border-color: rgba(224, 176, 96, .55); }
.spzz-toast-act {
  flex-shrink: 0;
  padding: 2px 10px;
  font-size: 11.5px;
  border-radius: 5px;
  border: 1px solid rgba(255, 255, 255, .32);
  background: rgba(255, 255, 255, .1);
  color: #fff;
  cursor: pointer;
}
.spzz-toast-act:hover { background: rgba(255, 255, 255, .2); }
@keyframes spzz-toast-in { from { opacity: 0; transform: translateY(-8px); } }

/* ---- 任务坞：右下角，随时知道「有什么在跑」 ---- */
.spzz-dock {
  position: fixed;
  right: 14px; bottom: 14px;
  z-index: 99998;
  min-width: 210px;
  max-width: 320px;
  padding: 6px;
  border-radius: 9px;
  background: rgba(24, 26, 38, .95);
  border: 1px solid rgba(111, 92, 255, .32);
  box-shadow: 0 10px 28px rgba(0, 0, 0, .5);
  font-size: 11.5px;
  color: #dfe3ee;
}
.spzz-dock-row {
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 4px 5px;
}
.spzz-dock-name {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.spzz-dock-bar {
  flex-shrink: 0;
  width: 54px; height: 4px;
  border-radius: 3px;
  background: rgba(255, 255, 255, .13);
  overflow: hidden;
}
.spzz-dock-bar > i {
  display: block;
  height: 100%;
  background: #6f5cff;
  transition: width .2s;
}
.spzz-dock-spin {
  flex-shrink: 0;
  width: 10px; height: 10px;
  border: 1.5px solid #a99cff;
  border-right-color: transparent;
  border-radius: 50%;
  animation: spzz-spin .7s linear infinite;
}
.spzz-dock-x {
  flex-shrink: 0;
  width: 16px; height: 16px;
  padding: 0;
  border: none;
  border-radius: 4px;
  background: transparent;
  color: #8c92a0;
  font-size: 10px;
  cursor: pointer;
}
.spzz-dock-x:hover { background: rgba(224, 96, 96, .2); color: #ffb4b4; }

/* ---- 启动异常徽标：模块崩了要「看得见」，不要静默变砖 ---- */
.spzz-boot-badge {
  position: fixed;
  left: 14px; bottom: 14px;
  z-index: 99997;
  padding: 5px 11px;
  border-radius: 7px;
  font-size: 11.5px;
  color: #ffd9a0;
  background: rgba(58, 40, 20, .95);
  border: 1px solid rgba(224, 176, 96, .5);
  cursor: pointer;
}
.spzz-boot-badge:hover { background: rgba(80, 54, 24, .98); }