/* Ticket #4（03）：燃料经济 HUD 样式 —— 顶栏燃料徽章 + 聚能斗按钮 + 飘字反馈 */

/* 燃料徽章（与 .ark-chip 同族，金色点缀） */
.ark-fuel-chip {
  color: var(--ark-text);
  border-color: #4a5a86;
}

/* 聚能斗按钮：深空能量槽质感，仅一次性 transition，无循环动画 */
.ark-fuel-btn {
  padding: 3px 14px;
  border: 1px solid #3b5b8f;
  border-radius: 999px;
  font-size: 13px;
  font-family: inherit;
  color: #9fd0ff;
  background: linear-gradient(180deg, #1a2b4a, #0d1526);
  cursor: pointer;
  transition: border-color 0.25s ease, box-shadow 0.25s ease, transform 0.15s ease,
    color 0.25s ease, background 0.25s ease;
}

.ark-fuel-btn:hover {
  border-color: #7fb7ff;
  box-shadow: 0 0 8px rgba(80, 140, 255, 0.45);
}

.ark-fuel-btn:active {
  transform: scale(0.95);
}

.ark-fuel-btn:disabled {
  opacity: 0.6;
  cursor: default;
  box-shadow: none;
}

/* 今日已领取：熄灭态 */
.ark-fuel-btn.claimed {
  color: #7d8aa5;
  border-color: #33405a;
  background: #101a2c;
  cursor: default;
}

/* 飘字反馈：fixed 定位 + 一次性上浮淡出 transition */
.ark-fuel-float {
  position: fixed;
  z-index: 999;
  transform: translate(-50%, 0);
  font-size: 15px;
  font-weight: 700;
  color: var(--ark-gold);
  text-shadow: 0 0 6px rgba(255, 200, 60, 0.6);
  pointer-events: none;
  opacity: 1;
  transition: transform 0.9s ease-out, opacity 0.9s ease-out;
  will-change: transform, opacity;
}

.ark-fuel-float.fly {
  transform: translate(-50%, -46px);
  opacity: 0;
}

.ark-fuel-float.warn {
  color: var(--ark-text-dim);
  text-shadow: none;
  font-weight: 400;
}