/* === 全局基础 === */
body {
  font-family: "Microsoft YaHei", sans-serif;
  background-color: #0e0e0e;
  color: #e0e0e0;
  margin: 0;
  padding: 0;
}


/* === 等级颜色 === */
.lvl1 { color: #00ff00; }
.lvl2 { color: #33aaff; }
.lvl3 { color: #bb66ff; }
.lvl4 { color: #ffaa33; }


/* === 按钮样式 === */
button {
  margin: 6px;
  padding: 8px 12px;
  border: none;
  border-radius: 8px;
  background: #333;
  color: #eee;
  cursor: pointer;
  transition: 0.2s;
  font-size: 14px;
}
button:hover {
  background: #555;
  transform: scale(1.05);
}


/* === 提示 === */
.hint {
  font-size: 13px;
  color: #888;
  background: #1a1a1a;
  padding: 6px 8px;
  border-left: 3px solid #ffaa33;
  border-radius: 4px;
  margin: 8px 0;
}


/* === 轻量提示 === */
#toastStack {
  position: fixed;
  left: 50%;
  top: calc(18px + env(safe-area-inset-top, 0px));
  z-index: 2800;
  display: grid;
  gap: 8px;
  width: min(340px, calc(100vw - 24px));
  pointer-events: none;
  transform: translateX(-50%);
}

.toast {
  padding: 10px 12px;
  color: #eee;
  background: rgba(28, 28, 28, 0.96);
  border: 1px solid #444;
  border-left: 4px solid #ffaa33;
  border-radius: 8px;
  box-shadow: 0 8px 24px rgba(0,0,0,0.35);
  font-size: 14px;
  line-height: 1.45;
  opacity: 0;
  transform: translateY(-8px);
  transition: opacity 0.2s ease, transform 0.2s ease;
}

.toast.show {
  opacity: 1;
  transform: translateY(0);
}

.toast-info {
  border-left-color: #33aaff;
}

.toast-success {
  border-left-color: #43c767;
}

.toast-warning {
  border-left-color: #ffaa33;
}

.toast-danger {
  border-left-color: #ff6666;
}


/* === 新物品获得动画 === */
.new-item {
  animation: pulse 0.6s ease-out;
}
@keyframes pulse {
  0% { transform: scale(1); }
  50% { transform: scale(1.1); background: #556; }
  100% { transform: scale(1); }
}

/* === 玩家状态变化动画 === */
.damage-flash {
  animation: damageFlash 0.6s ease;
}
.heal-flash {
  animation: healFlash 0.6s ease;
}
@keyframes damageFlash {
  0% { background: #400; }
  50% { background: #a00; }
  100% { background: none; }
}
@keyframes healFlash {
  0% { background: #040; }
  50% { background: #0f0; }
  100% { background: none; }
}

/* === 界面淡入淡出动画 === */
.fade-in { animation: fadeIn 0.6s ease; }
.fade-out { animation: fadeOut 0.6s ease; }
@keyframes fadeIn { from {opacity:0;} to {opacity:1;} }
@keyframes fadeOut { from {opacity:1;} to {opacity:0;} }

