/* =========================================================
   反馈层：飘字 / 波纹 / 闪屏 / 提示卡 / 公告 / 新收容高亮（fx.js）
   ========================================================= */

.fx-layer {
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 300;
  overflow: hidden;
}

/* 飘字 */
.fx-float {
  position: fixed;
  font-family: monospace;
  font-weight: 700;
  letter-spacing: 0.5px;
  white-space: nowrap;
  color: #fff;
  transform: translate(-50%, -50%);
  animation: fxRise 0.8s cubic-bezier(0.22, 0.75, 0.3, 1) forwards;
  will-change: transform, opacity;
}

@keyframes fxRise {
  0% {
    transform: translate(-50%, -50%) scale(0.6);
    opacity: 0;
  }
  14% {
    transform: translate(-50%, -62%) scale(1.12);
    opacity: 1;
  }
  58% {
    opacity: 1;
  }
  100% {
    transform: translate(calc(-50% + var(--dx, 0px)), calc(-50% - 48px)) scale(0.92);
    opacity: 0;
  }
}

/* 点数飘字：从来源飞向顶栏总点数（fx.money） */
.fx-fly {
  position: fixed;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.2px;
  white-space: nowrap;
  pointer-events: none;
  transform: translate(-50%, -50%);
  will-change: transform, opacity;
}

/* 加钱绿 / 扣钱红 */
.fx-fly.pos {
  color: #4ade80;
  text-shadow: 0 0 12px rgba(74, 222, 128, 0.55);
}

.fx-fly.neg {
  color: #ff5a5a;
  text-shadow: 0 0 12px rgba(255, 90, 90, 0.5);
}

/* 闪屏 */
.fx-flash {
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 310;
  opacity: 0;
}

/* 脉冲：按钮外围一圈圈淡波 */
.fx-wave {
  position: fixed;
  pointer-events: none;
  border-radius: 4px;
  opacity: 0;
  animation: fxWave 1s cubic-bezier(0.25, 0.7, 0.4, 1) both;
}

@keyframes fxWave {
  0% {
    box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.16);
    opacity: 0;
  }
  14% {
    opacity: 1;
  }
  100% {
    box-shadow: 0 0 0 30px rgba(255, 255, 255, 0);
    opacity: 0;
  }
}

.currency-val.bump {
  animation: fxBump 0.22s ease-out;
}

@keyframes fxBump {
  50% {
    transform: scale(1.07);
    color: #fff;
    text-shadow: 0 0 14px rgba(255, 255, 255, 0.65);
  }
}

/* 收容提示卡 */
.fx-toast-box {
  position: fixed;
  top: 62px;
  left: 50%;
  transform: translateX(-50%);
  width: calc(100% - 28px);
  max-width: 432px;
  z-index: 320;
  pointer-events: none;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.fx-toast {
  position: relative;
  overflow: hidden;
  background: rgba(10, 11, 14, 0.96);
  border: 1px solid var(--border-light);
  border-left: 3px solid var(--c, #fff);
  padding: 8px 10px 10px;
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.55), 0 8px 24px rgba(0, 0, 0, 0.6);
  animation: fxToastIn 0.28s cubic-bezier(0.2, 0.9, 0.3, 1) both;
}

/* 一道竖线横扫而过 */
.fx-toast::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 1px;
  background: rgba(255, 255, 255, 0.6);
  box-shadow: 0 0 10px rgba(255, 255, 255, 0.5);
  opacity: 0;
  animation: fxToastScan 0.52s ease-in-out 0.05s 1 forwards;
  pointer-events: none;
}

@keyframes fxToastScan {
  0% {
    left: 0;
    opacity: 0;
  }
  14% {
    opacity: 1;
  }
  84% {
    opacity: 1;
  }
  100% {
    left: 100%;
    opacity: 0;
  }
}

@keyframes fxToastIn {
  from {
    opacity: 0;
    transform: translateY(-12px) scale(0.98);
  }
  to {
    opacity: 1;
    transform: none;
  }
}

.fx-toast.out {
  animation: fxToastOut 0.24s ease-in forwards;
}

@keyframes fxToastOut {
  to {
    opacity: 0;
    transform: translateY(-8px);
  }
}

.fx-toast-top {
  display: flex;
  align-items: baseline;
  gap: 6px;
}

.fx-toast-tag {
  font-family: monospace;
  font-size: 9px;
  color: var(--c);
  border: 1px solid var(--c);
  padding: 0 3px;
  flex-shrink: 0;
}

.fx-toast-name {
  font-size: 12px;
  color: #fff;
  font-weight: 600;
  letter-spacing: 0.5px;
}

.fx-toast-line {
  font-family: monospace;
  font-size: 9.5px;
  color: var(--text-dim);
  margin-top: 4px;
}

.fx-plus {
  color: #fff;
}

.fx-toast.major {
  box-shadow: 0 0 0 1px var(--c), 0 0 26px -4px var(--c), 0 8px 26px rgba(0, 0, 0, 0.65);
}

.fx-toast.major .fx-toast-name {
  color: var(--c);
  text-shadow: 0 0 12px var(--c);
  font-size: 13px;
}

/* 居中公告 */
.fx-announce {
  position: fixed;
  left: 50%;
  top: 45%;
  transform: translate(-50%, -50%);
  z-index: 315;
  pointer-events: none;
  text-align: center;
  padding: 13px 24px;
  min-width: 210px;
  background: rgba(8, 9, 10, 0.88);
  border-top: 1px solid var(--c);
  border-bottom: 1px solid var(--c);
  animation: fxAnn 2.2s ease-out forwards;
}

@keyframes fxAnn {
  0% {
    opacity: 0;
    transform: translate(-50%, -50%) scale(0.94);
    letter-spacing: 8px;
  }
  12% {
    opacity: 1;
    transform: translate(-50%, -50%) scale(1);
    letter-spacing: 2px;
  }
  76% { opacity: 1; }
  100% {
    opacity: 0;
    transform: translate(-50%, -56%) scale(1);
  }
}

.fx-ann-title {
  font-size: 14px;
  color: #fff;
  letter-spacing: 2px;
}

.fx-ann-sub {
  font-size: 9.5px;
  color: var(--text-dim);
  font-family: monospace;
  margin-top: 6px;
  line-height: 1.6;
}

/* 新收容卡片高亮：纸面上过一道亮。
   卡片自己带歪角（transform），所以这里只动 filter，别抢 transform。 */
.item-card.fresh {
  animation: fxFresh 2.5s ease-out;
}

@keyframes fxFresh {
  0%   { filter: brightness(1.28) saturate(1.1); }
  30%  { filter: brightness(1.1); }
  100% { filter: brightness(1); }
}

/* 档案盒：整只盒子被照亮一下 */
.set-panel.fresh {
  animation: fxFreshSet 2.5s ease-out;
}

@keyframes fxFreshSet {
  0%   { filter: brightness(1.18); }
  100% { filter: brightness(1); }
}
