.game-canvas-wrapper[data-v-1d4d5174] {
  position: relative;
  width: 100%;
  height: 100%;
  background: #1a1a2e;
  overflow: hidden;
}
.game-canvas-wrapper[data-v-1d4d5174] canvas {
  display: block;
  width: 100%;
  height: 100%;
}

.battle-canvas-layer[data-v-b8806e19] {
  position: absolute;
  inset: 0;
  z-index: 45;          /* 在 battler 精灵(z≤25) 之上、HUD 按钮之下 */
  pointer-events: none;   /* 不拦截点击，按钮始终可点 */
  overflow: hidden;
}
.battle-canvas-layer[data-v-b8806e19] canvas {
  display: block;
  width: 100%;
  height: 100%;
}

.minimap-hud[data-v-d4e3e5cb] {
  pointer-events: none;
}
.minimap-bg[data-v-d4e3e5cb] {
  background: #000000;
  border: 1px solid #555;
  border-radius: 4px;
  padding: 6px;
}
.minimap-bg canvas[data-v-d4e3e5cb] {
  display: block;
  border-radius: 2px;
}
.minimap-name[data-v-d4e3e5cb] {
  font-size: 11px;
  font-family: var(--game-font);
  color: #f5d15f;
  text-align: center;
  margin-top: 4px;
}
.minimap-coords[data-v-d4e3e5cb] {
  display: flex;
  justify-content: center;
  margin-top: 2px;
}
.coord-value[data-v-d4e3e5cb] {
  font-size: 11px;
  font-family: var(--game-font);
  color: #ffdd44;
  font-weight: bold;
}

.quickbar[data-v-be4f50d0] {
  width: 100%;
  background: #000000;
  border-bottom: 1px solid #ffd700;
  display: flex;
  padding: 0;
}
.quickbar-left[data-v-be4f50d0] {
  display: flex;
  gap: 0;
}
.quickbar-right[data-v-be4f50d0] {
  display: flex;
  gap: 1px;
  margin-right: auto;
}
.info-slot[data-v-be4f50d0] {
  width: 48px;
  height: 36px;
  background: rgba(0, 0, 0, 0.4);
  border: 2px solid #ffd700;
  display: flex;
  box-sizing: border-box;
}
.avatar-slot[data-v-be4f50d0] {
  flex-direction: column;
  align-items: center;
  justify-content: center;
  position: relative;
  cursor: pointer;
  overflow: hidden;
}
.avatar-icon[data-v-be4f50d0] {
  font-size: 16px;
  color: #fff;
  font-weight: bold;
  line-height: 1;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.8);
}
.avatar-img[data-v-be4f50d0] {
  width: 210%;
  height: 80%;
  object-fit: cover;
  object-position: center top;
  image-rendering: pixelated;
}
.avatar-level[data-v-be4f50d0] {
  position: absolute;
  bottom: 1px;
  right: 2px;
  font-size: 10px;
  color: #ffffff;
  font-weight: bold;
  line-height: 1;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.9);
}
.stats-slot[data-v-be4f50d0] {
  width: 48px;
  flex-direction: column;
  justify-content: space-between;
  padding: 3px 2px;
  gap: 2px;
  cursor: default;
}
.stat-bar[data-v-be4f50d0] {
  height: 100%;
  border-radius: 0;
  transition: width 0.3s ease;
  min-width: 0;
}
.hp-bar[data-v-be4f50d0] {
  background: linear-gradient(90deg, #e74c3c, #c0392b);
}
.mp-bar[data-v-be4f50d0] {
  background: linear-gradient(90deg, #3498db, #2980b9);
}
.exp-bar[data-v-be4f50d0] {
  background: linear-gradient(90deg, #2ecc71, #27ae60);
}
.quickbar-slot[data-v-be4f50d0] {
  width: 36px;
  height: 36px;
  background: rgba(0, 0, 0, 0.4);
  border: 2px solid #ffd700;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  position: relative;
  transition: all 0.15s ease;
}
.quickbar-slot[data-v-be4f50d0]:hover {
  border-color: #a08060;
  background: rgba(0, 0, 0, 0.5);
}
.quickbar-slot.active[data-v-be4f50d0] {
  border-color: #ffd700;
  background: rgba(255, 215, 0, 0.15);
  box-shadow: 0 0 8px rgba(255, 215, 0, 0.3);
}
.slot-icon[data-v-be4f50d0] {
  width: 28px;
  height: 28px;
  object-fit: contain;
  image-rendering: pixelated;
}


@font-face {
  font-family: 'GameFont';
  src: url('/fonts/VonwaonBitmap-16px.ttf') format('truetype');
}
.attr-fullscreen[data-v-ac46b644] {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 50;
  background-size: 100% 100%;
  background-repeat: no-repeat;
  background-position: center;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  font-family: 'GameFont', 'Microsoft YaHei', sans-serif;
  color: #e8d5b0;
}
.attr-header[data-v-ac46b644] {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 14px 20px;
  flex-shrink: 0;
  position: relative;
}
.attr-title[data-v-ac46b644] {
  font-family: 'GameFont', var(--game-font);
  font-size: 18px;
  color: #ffd700;
  text-shadow: 0 1px 4px rgba(0, 0, 0, 0.9);
}
.close-btn[data-v-ac46b644] {
  position: absolute;
  right: 20px;
  width: 32px;
  height: 32px;
  border: 1px solid #8b7355;
  border-radius: 4px;
  background: rgba(0, 0, 0, 0.4);
  color: #ccc;
  font-size: 16px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s;
}
.close-btn[data-v-ac46b644]:hover {
  background: rgba(200, 50, 50, 0.3);
  border-color: #e74c3c;
  color: #fff;
}
.attr-body[data-v-ac46b644] {
  flex: 1;
  padding: 0 20px 30px;
  display: flex;
  flex-direction: column;
  overflow-y: auto;
}

/* ── 顶部 ── */
.panel-top[data-v-ac46b644] {
  display: flex;
  gap: 80px;
  margin-bottom: 16px;
}
.portrait-section[data-v-ac46b644] {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  flex-shrink: 0;
}
.char-name-top[data-v-ac46b644] {
  font-size: 18px;
  color: #ffd700;
  letter-spacing: 2px;
  text-shadow: 0 2px 6px rgba(0,0,0,0.8);
}
.char-portrait[data-v-ac46b644] {
  width: 70px;
  height: 70px;
  object-fit: cover;
}
.char-level[data-v-ac46b644] {
  font-size: 15px;
  color: #ffd700;
  text-shadow: 0 2px 6px rgba(0,0,0,0.8);
}

/* ── 状态区 ── */
.status-section[data-v-ac46b644] {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 6px;
}
.num-row[data-v-ac46b644] {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
}
.num-label[data-v-ac46b644] { width: 40px; text-align: center; color: #ffd700;
}
.num-value[data-v-ac46b644] { color: #fff; font-weight: bold;
}
.breakthrough-btn[data-v-ac46b644] {
  margin-left: auto;
  padding: 2px 12px;
  background: linear-gradient(180deg, #8b4513, #654321);
  border: 1px solid #ffd700;
  border-radius: 4px;
  color: #ffd700;
  font-size: 12px;
  cursor: pointer;
  font-family: 'GameFont';
}
.breakthrough-btn[data-v-ac46b644]:hover {
  background: linear-gradient(180deg, #a0522d, #8b4513);
}
.info-row[data-v-ac46b644] {
  display: flex;
  justify-content: space-between;
  padding: 1px 4px;
  font-size: 14px;
}
.info-label[data-v-ac46b644] { color: #ffd700;
}
.info-value[data-v-ac46b644] { color: #e8d5b0; font-weight: bold;
}

/* ── 中间 ── */
.panel-middle[data-v-ac46b644] {
  display: flex;
  gap: 16px;
  min-height: 0;
  box-shadow:
    inset 0 0 0 1px #5a3a1b,
    inset 2px 2px 0 rgba(255,255,255,0.1),
    inset -2px -2px 0 rgba(0,0,0,0.15);
  padding: 2px;
}
.divider[data-v-ac46b644] {
  border: none;
  border-top: 1px solid #5a4a3a;
  margin: 0 0 2px;
}
.header-divider[data-v-ac46b644] {
  border: none;
  border-top: 1px solid #5a4a3a;
  margin: 20px 20px;
}
.assign-stats[data-v-ac46b644],
.battle-stats[data-v-ac46b644] {
  flex: 1;
  padding: 14px;
  background: #8b6239;
  border: 1px solid #d4a76a;
}
.mid-title[data-v-ac46b644] {
  font-size: 15px;
  color: #ffd700;
  padding-bottom: 6px;
  margin-bottom: 8px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-family: 'GameFont', var(--game-font);
}

/* 加点 */
.as-row[data-v-ac46b644] {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 0;
}
.as-label[data-v-ac46b644] { flex: 1; font-size: 14px; color: #ffd700;
}
.as-value[data-v-ac46b644] {
  width: 32px;
  text-align: center;
  font-size: 15px;
  color: #ffd700;
  font-weight: bold;
  cursor: pointer;
}
.as-value[data-v-ac46b644]:hover { border-bottom-color: #ffd700;
}
.as-delta[data-v-ac46b644] { color: #7cff7c; font-size: 12px; margin-left: 2px; font-weight: normal;
}
.as-input[data-v-ac46b644] {
  width: 48px;
  text-align: center;
  font-size: 15px;
  color: #ffd700;
  font-weight: bold;
  background: rgba(0,0,0,0.5);
  border: 1px solid #ffd700;
  outline: none;
  padding: 2px 4px;
  -moz-appearance: textfield;
}
.as-input[data-v-ac46b644]::-webkit-inner-spin-button,
.as-input[data-v-ac46b644]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.as-btn[data-v-ac46b644] {
  width: 26px;
  height: 26px;
  border: 1px solid #8b7355;
  border-radius: 4px;
  background: rgba(139,115,85,0.2);
  color: #e8d5b0;
  font-size: 17px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.15s;
  line-height: 1;
}
.as-btn[data-v-ac46b644]:hover:not(:disabled) {
  background: rgba(139,115,85,0.45);
  border-color: #ffd700;
  color: #ffd700;
}
.as-btn[data-v-ac46b644]:disabled { opacity: 0.3; cursor: not-allowed;
}
.as-row.focused[data-v-ac46b644] {
  background: rgba(255, 215, 0, 0.12);
  border-radius: 4px;
  outline: 1px solid rgba(255, 215, 0, 0.4);
  outline-offset: -1px;
}
.as-footer[data-v-ac46b644] {
  display: flex;
  justify-content: space-between;
  font-size: 12px;
  color: #ffd700;
  margin-top: 10px;
  padding-top: 6px;
  border-top: 1px solid #3a3025;
}
.btn-confirm-as[data-v-ac46b644] {
  display: block;
  width: 100%;
  margin-top: 12px;
  padding: 8px 0;
  border: 1px solid #ffd700;
  border-radius: 6px;
  background: linear-gradient(135deg, #6b4423, #8b5a2b);
  color: #ffd700;
  font-size: 14px;
  font-family: 'GameFont', 'Microsoft YaHei', sans-serif;
  cursor: pointer;
  letter-spacing: 3px;
  transition: all 0.2s;
}
.btn-confirm-as.focused[data-v-ac46b644] {
  background: linear-gradient(135deg, #8b5a2b, #a07030);
  box-shadow: 0 0 12px rgba(255,215,0,0.4);
  outline: 2px solid rgba(255, 215, 0, 0.6);
  outline-offset: 1px;
}
.btn-confirm-as[data-v-ac46b644]:hover:not(:disabled) {
  background: linear-gradient(135deg, #8b5a2b, #a07030);
  box-shadow: 0 0 12px rgba(255,215,0,0.2);
}
.btn-confirm-as[data-v-ac46b644]:disabled {
  opacity: 0.4;
  cursor: not-allowed;
}
.potential-badge[data-v-ac46b644] {
  display: block;
  text-align: center;
  font-size: 14px;
  color: #ffd700;
  background: rgba(136,204,0,0.1);
  padding: 4px 8px;
  border-radius: 4px;
  border: 1px solid rgba(136,204,0,0.3);
  margin: 10px 0 0;
}

/* 套装效果 */
.set-bonus-box[data-v-ac46b644] {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  padding: 6px 8px;
  margin-top: 10px;
  border-radius: 4px;
  background: rgba(255, 215, 0, 0.08);
  border: 1px solid rgba(255, 215, 0, 0.35);
}
.set-bonus-box.none[data-v-ac46b644] {
  background: rgba(128, 128, 128, 0.08);
  border-color: rgba(128, 128, 128, 0.3);
}
.sb-label[data-v-ac46b644] { color: #ffd700; font-weight: bold;
}
.sb-tier[data-v-ac46b644] { font-weight: bold; padding: 1px 6px; border-radius: 3px;
}
.sb-tier.gold[data-v-ac46b644] { color: #ffd700; background: rgba(255, 215, 0, 0.18); border: 1px solid #ffd700;
}
.sb-tier.silver[data-v-ac46b644] { color: #d8d8d8; background: rgba(216, 216, 216, 0.15); border: 1px solid #c0c0c0;
}
.sb-tier.bronze[data-v-ac46b644] { color: #e0a060; background: rgba(224, 160, 96, 0.15); border: 1px solid #c08850;
}
.sb-tier.none[data-v-ac46b644] { color: #aaa;
}
.sb-pct[data-v-ac46b644] { color: #7cff7c; font-weight: bold;
}
.sb-min[data-v-ac46b644] { color: #c8b890; font-size: 12px;
}

/* 战斗属性 */
.bs-row[data-v-ac46b644] {
  display: flex;
  justify-content: space-between;
  padding: 4px 0;
  font-size: 14px;
}
.bs-label[data-v-ac46b644] { color: #ffd700;
}
.bs-value[data-v-ac46b644] { color: #e8d5b0; font-weight: bold;
}
.bs-diff[data-v-ac46b644] { color: #4caf50; font-weight: bold; font-size: 12px; margin-left: 4px;
}

@font-face {
  font-family: 'GameFont';
  src: url('/fonts/VonwaonBitmap-16px.ttf') format('truetype');
}
.item-detail-overlay[data-v-7e80b10f] {
  position: fixed; inset: 0; z-index: 99999;
  background: rgba(0,0,0,0.7);
  display: flex; align-items: center; justify-content: center;
}
.item-detail-box[data-v-7e80b10f] {
  /* 外观（青色卡片 + 四角像素装饰）由 src/assets/detail-card.css 统一提供 */
}
.detail-content[data-v-7e80b10f] {
  display: flex; flex-direction: column; gap: 4px;
  font-family: 'GameFont';
}
.detail-row[data-v-7e80b10f] {
  display: flex; align-items: center; gap: 6px;
  font-size: 15px; padding: 1px 0;
}
.detail-label[data-v-7e80b10f] { color: #d9f6fb; flex-shrink: 0;
}
.detail-value[data-v-7e80b10f] { color: #fff;
}
.detail-value.gold[data-v-7e80b10f] { color: #ffd700;
}
/* 强化增量（绿色字体） */
.enh-bonus[data-v-7e80b10f] { color: #7cff7c;
}
.rarity-凡[data-v-7e80b10f] { color: #ffffff;
}
.rarity-良[data-v-7e80b10f] { color: #4dc4ff;
}
.rarity-精[data-v-7e80b10f] { color: #7cff7c;
}
.rarity-极[data-v-7e80b10f] { color: #b388ff;
}
.rarity-神[data-v-7e80b10f] { color: #ff9800;
}
.detail-stars[data-v-7e80b10f] { display: flex; gap: 1px;
}
.star[data-v-7e80b10f] { font-size: 15px; position: relative; display: inline-block;
}
.star-full[data-v-7e80b10f] { color: #ffd700; text-shadow: 0 0 4px rgba(255,215,0,0.5);
}
/* 强化星级 / 附魂月亮太阳（public/tubiao 素材） */
.star-img[data-v-7e80b10f] { width: 15px; height: 15px; image-rendering: pixelated;
}
.soul-img[data-v-7e80b10f] { width: 17px; height: 17px; vertical-align: -2px; image-rendering: pixelated; margin-right: 2px;
}
/* 真正的半星：底层灰★，上层金色★只裁左半（左金右灰） */
.star-half[data-v-7e80b10f] { color: #555;
}
.star-half[data-v-7e80b10f]::before {
  content: '★';
  position: absolute;
  left: 0;
  top: 0;
  width: 50%;
  overflow: hidden;
  color: #ffd700;
  text-shadow: 0 0 4px rgba(255,215,0,0.5);
}
.star-empty[data-v-7e80b10f] { color: #555;
}
.detail-section[data-v-7e80b10f] {
  color: #ffd700; font-size: 12px; font-weight: bold;
  margin-top: 4px; padding-bottom: 1px;
  border-bottom: 1px solid rgba(255,215,0,0.3);
}
.detail-desc[data-v-7e80b10f] {
  margin-top: 4px; padding-top: 4px;
  border-top: 1px solid rgba(0,240,240,0.25);
  font-size: 13px; color: #ffffff; line-height: 1.4;
}

.item-detail-overlay[data-v-88bb5503] {
  position: fixed; inset: 0; z-index: 99999;
  background: rgba(0,0,0,0.7);
  display: flex; align-items: center; justify-content: center;
}
.item-detail-box[data-v-88bb5503] {
  /* 外观（青色卡片 + 四角像素装饰）由 src/assets/detail-card.css 统一提供 */
}
.detail-content[data-v-88bb5503] {
  display: flex; flex-direction: column; gap: 4px;
  font-family: 'GameFont';
}
.detail-row[data-v-88bb5503] {
  display: flex; align-items: center; gap: 6px;
  font-size: 15px; padding: 1px 0;
}
.detail-label[data-v-88bb5503] { color: #d9f6fb; flex-shrink: 0;
}
.detail-value[data-v-88bb5503] { color: #fff;
}
.detail-section[data-v-88bb5503] {
  color: #ffd700; font-size: 12px; font-weight: bold;
  margin-top: 8px; padding-bottom: 1px;
  border-bottom: 1px solid rgba(255,215,0,0.3);
}
.detail-desc[data-v-88bb5503] {
  margin-top: 4px; padding-top: 4px;
  border-top: 1px solid rgba(0,240,240,0.25);
  font-size: 13px; color: #ffffff; line-height: 1.4;
}

@font-face {
  font-family: 'GameFont';
  src: url('/fonts/VonwaonBitmap-16px.ttf') format('truetype');
}
.bag-fullscreen[data-v-e03df762] {
  position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 50;
  background-size: 100% 100%; background-repeat: no-repeat; background-position: center;
  display: flex; flex-direction: column; overflow: hidden; color: #e8d5a3;
  touch-action: manipulation; -webkit-touch-callout: none; -webkit-user-select: none;
  pointer-events: auto;
}
.bag-header[data-v-e03df762] { display: flex; align-items: center; justify-content: center; padding: 20px 20px; flex-shrink: 0; position: relative;
}
.bag-title[data-v-e03df762] { font-family: 'GameFont'; font-size: 22px; color: #ffd700; text-shadow: 0 1px 4px rgba(0,0,0,0.9);
}
.close-btn[data-v-e03df762] { position: absolute; right: 20px; width: 32px; height: 32px; border: 1px solid #8b7355; border-radius: 4px; background: rgba(0,0,0,0.4); color: #ccc; font-size: 18px; cursor: pointer; font-family: 'GameFont';
}

/* ── 上方 30% ── */
.bag-top[data-v-e03df762] { flex: 0 0 32%; display: flex; padding: 25px 12px; gap: 8px; overflow: hidden;
}
.equip-area[data-v-e03df762] { display: flex; flex-direction: column; align-items: center; gap: 1px; flex-shrink: 0; margin-left: 10px;}
.eq-row[data-v-e03df762] { display: flex; align-items: center; gap: 0;
}
.eq-side[data-v-e03df762] { display: flex; flex-direction: column; gap: 3px;
}
.eq-left[data-v-e03df762] { align-items: flex-end;
}
.eq-right[data-v-e03df762] { align-items: flex-start;
}
.char-model-wrap[data-v-e03df762] { width: 60px; height: 90px;  display: flex; align-items: center; justify-content: center; overflow: hidden; margin: 0 2px;
}
.char-model[data-v-e03df762] { width: 110%; height: 110%; object-fit: cover; object-position: center 0%;
}
.char-model-placeholder[data-v-e03df762] { font-size: 12px; color: #888; font-family: 'GameFont';
}
.eq-slot[data-v-e03df762] { width: 35px; height: 35px;  background-image: url("/czjm/zb.png"); display: flex; align-items: center; justify-content: center; font-size: 11px; color: #aaa; cursor: pointer; font-family: 'GameFont';
}
.eq-img[data-v-e03df762] { width: 100%; height: 100%; object-fit: contain; image-rendering: pixelated;
}
.eq-slot[data-v-e03df762]:hover { border-color: #ffd700;}
.eq-slot.selected[data-v-e03df762] { border-color: #ff0000; background: #3a3a00; box-shadow: 0 0 6px rgba(255,215,0,0.4);
}
.eq-slot-top[data-v-e03df762], .eq-slot-bottom[data-v-e03df762] { width: 35px;
}
.eq-bottom-row[data-v-e03df762] { display: flex; gap: 3px; justify-content: center;
}
.attr-area[data-v-e03df762] { flex: 1; display: flex; flex-direction: column; justify-content: flex-start; gap: 8px; font-size: 14px; padding-top: 28px ;overflow-y: auto;
}
.attr-row[data-v-e03df762] { padding: 2px 4px; font-family: 'GameFont'; display: flex; justify-content: space-between;
}
.attr-row span[data-v-e03df762] { flex: 1;
}
.attr-label[data-v-e03df762] { color: #ffc62e; font-weight:bold;}
.attr-value[data-v-e03df762] { color: #fff;
}
.sect-span[data-v-e03df762] { margin-left: 20px;
}

/* ── 中间 40% ── */
.bag-middle[data-v-e03df762] { flex: 0 0 36%; display: flex; flex-direction: column; padding: 5px 12px; overflow: hidden;
}
.bag-tabs[data-v-e03df762] { display: flex; gap: 4px; margin-bottom: 8px;
}
.tab-btn[data-v-e03df762] { padding: 4px 14px; border: 1px solid rgba(139,115,85,0.4); border-radius: 3px; background: rgba(0,0,0,0.4); color: #aaa; cursor: pointer; font-family: 'GameFont'; font-size: 14px;
}
.tab-btn.active[data-v-e03df762] { background: rgba(255,215,0,0.15); border-color: #ffd700; color: #ffd700;
}
.grid-wrapper[data-v-e03df762] { flex: 1; overflow-y: auto; pointer-events: auto;
}
.item-grid[data-v-e03df762] { display: grid; grid-template-columns: repeat(10, 1fr); gap: 2px; pointer-events: auto;
}
.slot-lock[data-v-e03df762] { position: absolute; top: 5px; right: 1px; font-size: 13px; line-height: 1; opacity: 0.95; pointer-events: none;
}
.item-slot[data-v-e03df762] { aspect-ratio: 1;  background-image: url("/czjm/bb.png"); display: flex; flex-direction: column; align-items: center; justify-content: center; cursor: pointer; position: relative; font-size: 11px; font-family: 'GameFont'; touch-action: manipulation; -webkit-tap-highlight-color: transparent; pointer-events: auto;
}
.item-slot.filled[data-v-e03df762] { background: #111;
}
.item-slot.selected[data-v-e03df762] { border-color: #fff;
}
.slot-icon[data-v-e03df762] { width: 100%; height: 100%; object-fit: contain; font-size: 16px; image-rendering: pixelated;
}
.slot-count[data-v-e03df762] { position: absolute; bottom: 1px; right: 2px; font-size: 15px; font-weight: bold; color: #fff; text-shadow: 0 0 3px #000; font-family: 'GameFont';
}
.slot-name[data-v-e03df762] { font-size: 10px; color: #ddd; font-family: 'GameFont';
}

/* ── 下方 ── */
.bag-bottom[data-v-e03df762] { flex: 0 0 18%; display: flex; flex-direction: column; padding: 3px 12px;margin-top: -20px;
}
.detail-area[data-v-e03df762] { flex: 1; background: #8b6239; border: 2px solid #d4a76a; box-shadow: inset 0 0 0 1px #5a3a1b, inset 2px 2px 0 rgba(255,255,255,0.1), inset -2px -2px 0 rgba(0,0,0,0.15); padding: 4px 8px; overflow-y: auto; font-size: 11px; font-family: 'GameFont';
}
.detail-name[data-v-e03df762] { font-size: 13px; margin-bottom: 2px; display: flex; align-items: center; gap: 6px;
}
.name-text[data-v-e03df762] { white-space: nowrap; color: #ffd700;
}
.rarity-white[data-v-e03df762] { color: #ffffff;
}
.rarity-darkblue[data-v-e03df762] { color: #4dc4ff;
}
.rarity-green[data-v-e03df762] { color: #7cff7c;
}
.rarity-purple[data-v-e03df762] { color: #b388ff;
}
.rarity-orange[data-v-e03df762] { color: #ff9800;
}
.detail-stars[data-v-e03df762] { display: inline-flex; align-items: center; gap: 1px;
}
.star-wrap[data-v-e03df762] { display: inline-flex; align-items: center; line-height: 1;
}
.star[data-v-e03df762] { font-size: 14px; text-shadow: 0 0 1px #fff, 0 0 1px #fff, 0 0 1px #fff;
}
.star-full[data-v-e03df762] { color: #ffd700;
}
.star-empty[data-v-e03df762] { color: #555;
}
/* 强化星级 / 附魂月亮太阳（public/tubiao 素材） */
.star-img[data-v-e03df762] { width: 14px; height: 14px; image-rendering: pixelated;
}
.soul-img[data-v-e03df762] { width: 16px; height: 16px; vertical-align: -2px; image-rendering: pixelated; margin-right: 2px;
}
.star-half[data-v-e03df762] { position: relative; color: #555; text-shadow: none; display: inline-block;
}
.star-half-fill[data-v-e03df762] { position: absolute; left: 0; top: 0; overflow: hidden; width: 50%; color: #ffd700; text-shadow: 0 0 1px #fff, 0 0 1px #fff, 0 0 1px #fff;
}
.detail-level[data-v-e03df762] { font-size: 15px; margin-left: 4px;
}
.level-num[data-v-e03df762] { color: #7cff7c;
}
.subtype-name[data-v-e03df762] { color: #ffffff;
}
.inline-stats[data-v-e03df762] { display: flex; flex-wrap: wrap; gap: 4px 8px; margin-top: 5px;}
.stat-sep[data-v-e03df762] {
}
.detail-row[data-v-e03df762] { color: #ffffff;
}
.detail-empty[data-v-e03df762] { color: #ffffff; text-align: center; padding-top: 12px;
}
.detail-stats[data-v-e03df762] { margin-top: 4px; border-top: 1px solid rgba(139,115,85,0.4); padding-top: 4px;
}
.stat-section-label[data-v-e03df762] { color: #ffd700; font-size: 12px; margin-top: 5px;
}
.stat-label[data-v-e03df762] { color: #e8d5a3;
}
.stat-value[data-v-e03df762] { color: #ffffff; margin-left: 6px;
}
/* 强化增量（绿色字体），与查看/强化界面一致 */
.stat-enhan[data-v-e03df762] { color: #7cff7c; margin-left: 1px;
}
.stat-bonus[data-v-e03df762] { color: #b388ff; margin-left: 1px;
}

/* ── 物品操作弹窗 ── */
.menu-overlay[data-v-e03df762] {
  position: fixed; inset: 0; z-index: 99999;
  background: rgba(0,0,0,0.6);
  display: flex; align-items: center; justify-content: center;
}
.menu-box[data-v-e03df762] {
  display: flex; flex-direction: column; align-items: center;
  padding: 20px 28px 18px;
  position: relative;
  margin-top: -50%;
}
.menu-btns[data-v-e03df762] {
  display: flex; flex-direction: column; gap: 4px;
  width: 100%;
  justify-content: center;
  margin-top: 1%;
}
.menu-btn[data-v-e03df762] {
  width: 100%; padding: 8px 30px;
  background: #735131;
  border: 1px solid #ffd700;
  border-radius: 0;
  color: #f5d15f;
  font-family: 'GameFont'; font-size: 12px; letter-spacing: 2px;
  cursor: pointer; outline: none;
  transition: all 0.15s;
}
.menu-btn[data-v-e03df762]:hover {
  background: linear-gradient(180deg, #5a4a3a, #4a3a2a);
  border-color: #c9a84c;
  transform: translateY(-1px);
}
.menu-btn[data-v-e03df762]:active { transform: translateY(0);
}
.menu-btn-disabled[data-v-e03df762] { color: #f5d15f !important; cursor: not-allowed !important;
}
.menu-btn-disabled[data-v-e03df762]:hover { background: none !important;
}
.btn-return[data-v-e03df762] { margin-top: 2px;
}
.money-area[data-v-e03df762] { flex: 0 0 9%; display: flex; justify-content: space-between; align-items: center; padding: 4px 60px; font-size: 16px; font-family: 'GameFont';
}
.money-gold[data-v-e03df762] { color: #ffd700;
}
.money-yuanbao[data-v-e03df762] { color: #aae0ff;
}
/* ── 贩卖数量选择（同商城购买弹窗样式） ── */
.confirm-qty[data-v-e03df762] { display: flex; align-items: center; gap: 12px; justify-content: center; margin: 8px 0;
}
.confirm-qty-btn[data-v-e03df762] {
  width: 32px; height: 32px; border: 1px solid #8b7355; border-radius: 4px;
  background: rgba(80,55,30,0.8); color: #ffd700; font-size: 18px; cursor: pointer;
}
.confirm-qty-btn[data-v-e03df762]:hover { background: #9a7350;
}
.confirm-qty-input[data-v-e03df762] {
  width: 60px; height: 32px; text-align: center; background: rgba(0,0,0,0.4);
  border: 1px solid #8b7355; border-radius: 4px; color: #fff; font-size: 16px; outline: none;
}
.confirm-qty-input[data-v-e03df762]::-webkit-outer-spin-button,
.confirm-qty-input[data-v-e03df762]::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0;
}
.confirm-qty-input[type=number][data-v-e03df762] { -moz-appearance: textfield;
}
/* ── 弹窗通用 ── */
.modal-overlay[data-v-e03df762] {
  position: fixed; inset: 0; background: rgba(0,0,0,0.6); display: flex;
  align-items: center; justify-content: center; z-index: 200;
}
.modal-box[data-v-e03df762] {
  width: 300px; padding: 24px 20px 16px; border-radius: 8px;
}
.modal-header[data-v-e03df762] { text-align: center; padding-bottom: 12px;
}
.modal-title[data-v-e03df762] { color: #ffd700; font-size: 16px; font-weight: bold;
}
.modal-body[data-v-e03df762] { color: #ccc; font-size: 14px; text-align: center;
}
.confirm-total[data-v-e03df762] { color: #ccc; font-size: 14px; margin-top: 4px;
}
.confirm-total-val[data-v-e03df762] { color: #ffd700; font-size: 16px; font-weight: bold;
}
.modal-actions[data-v-e03df762] { display: flex; gap: 16px; justify-content: center; margin-top: 16px;
}
.modal-btn[data-v-e03df762] {
  padding: 6px 24px; border: 1px solid #8b7355; border-radius: 4px;
  background: rgba(80,55,30,0.8); color: #ffd700; font-size: 14px; cursor: pointer;
}
.modal-btn[data-v-e03df762]:hover { background: #9a7350;
}
.modal-btn.confirm[data-v-e03df762] { background: rgba(30,80,30,0.8);
}
.modal-btn.confirm[data-v-e03df762]:hover { background: #3a8a3a;
}
/* ── 一键出售按钮 ── */
.sell-all-btn[data-v-e03df762] {
  background: rgba(150,40,40,0.55);
  border: 1px solid #ff8a8a;
  color: #ffd6d6;
}
.sell-all-btn[data-v-e03df762]:hover {
  background: rgba(190,55,55,0.8);
  border-color: #ffcaca;
  color: #fff;
}
.sell-all-btn[data-v-e03df762]:active { transform: translateY(0);
}
/* ── 一键出售选择弹窗 ── */
.quick-sell-box[data-v-e03df762] { width: 300px; max-height: 70vh; display: flex; flex-direction: column;
}
.quick-sell-sub[data-v-e03df762] { color: #e8d5a3; font-size: 13px; text-align: center; margin-bottom: 10px;
}
.quick-sell-rarities[data-v-e03df762] {
  display: grid; grid-template-columns: 1fr 1fr; gap: 10px;
  padding: 4px 2px;
}
.quick-sell-rarity-btn[data-v-e03df762] {
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px;
  padding: 14px 0; border-radius: 6px; cursor: pointer; font-family: 'GameFont';
  background: rgba(0,0,0,0.35); border: 1px solid rgba(139,115,85,0.5);
  transition: all 0.15s;
}
.quick-sell-rarity-btn[data-v-e03df762]:hover:not(:disabled) { transform: translateY(-1px); filter: brightness(1.15);
}
.quick-sell-rarity-btn[data-v-e03df762]:disabled { opacity: 0.4; cursor: not-allowed;
}
.quick-sell-rarity-name[data-v-e03df762] { font-size: 18px; font-weight: bold;
}
.quick-sell-rarity-count[data-v-e03df762] { font-size: 12px; color: #e8d5a3;
}
/* 各品质配色（与详情页 rarityColorMap 一致） */
.rarity-凡 .quick-sell-rarity-name[data-v-e03df762] { color: #ffffff;
}
.rarity-良 .quick-sell-rarity-name[data-v-e03df762] { color: #4dc4ff;
}
.rarity-精 .quick-sell-rarity-name[data-v-e03df762] { color: #7cff7c;
}
.rarity-极 .quick-sell-rarity-name[data-v-e03df762] { color: #b388ff;
}
/* ── 一键出售二次确认弹窗 ── */
.qs-confirm-count[data-v-e03df762] { font-size: 22px; font-weight: bold; margin: 0 2px;
}
.qs-confirm-tip[data-v-e03df762] { margin-top: 10px; color: #e8d5a3; font-size: 14px;
}

/* ── 风灵丸选坐骑：覆盖背包、展示背包格子的 picker ── */
.picker-overlay[data-v-e03df762] { position: absolute; inset: 0; z-index: 60;
}

@font-face {
  font-family: 'GameFont';
  src: url('/fonts/VonwaonBitmap-16px.ttf') format('truetype');
}
.shop-fullscreen[data-v-f3c86353] {
  position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 50;
  background-size: 100% 100%; background-repeat: no-repeat; background-position: center;
  display: flex; flex-direction: column; overflow: hidden; color: #e8d5a3;
}
.shop-header[data-v-f3c86353] { display: flex; align-items: center; justify-content: center; padding: 20px 20px; flex-shrink: 0; position: relative;
}
.shop-title[data-v-f3c86353] { font-family: 'GameFont'; font-size: 22px; color: #ffd700; text-shadow: 0 1px 4px rgba(0,0,0,0.9);
}
.close-btn[data-v-f3c86353] { position: absolute; right: 20px; width: 32px; height: 32px; border: 1px solid #8b7355; border-radius: 4px; background: rgba(0,0,0,0.4); color: #ccc; font-size: 18px; cursor: pointer; font-family: 'GameFont';
}

/* ── 中间 ── */
.shop-middle[data-v-f3c86353] { flex: 1; display: flex; flex-direction: column; padding: 12px 12px 0; overflow: hidden;
}
.shop-tabs[data-v-f3c86353] { display: flex; gap: 11px; margin-bottom: 8px; margin-top: 10px;}
.tab-btn[data-v-f3c86353] { padding: 4px 14px; border: 1px solid rgba(139,115,85,0.4); border-radius: 3px; background: rgba(0,0,0,0.4); color: #aaa; cursor: pointer; font-family: 'GameFont'; font-size: 14px;
}
.tab-btn.active[data-v-f3c86353] { background: rgba(255,215,0,0.15); border-color: #ffd700; color: #ffd700;
}
.grid-wrapper[data-v-f3c86353] { flex: 1; overflow-y: auto;
}
.item-grid[data-v-f3c86353] { display: grid; grid-template-columns: repeat(10, 1fr); gap: 2px;
}
.item-slot[data-v-f3c86353] { aspect-ratio: 1; border: 1px solid #ffd700; background: #000; display: flex; flex-direction: column; align-items: center; justify-content: center; cursor: pointer; position: relative; font-size: 11px; font-family: 'GameFont';
}
.item-slot.filled[data-v-f3c86353] { background: #111;
}
.item-slot[data-v-f3c86353]:hover { border-color: #ffd700; background: #1a1a00;
}
.item-slot.selected[data-v-f3c86353] { border-color: #ffd700;
}
.slot-icon[data-v-f3c86353] { width: 100%; height: 100%; object-fit: contain; font-size: 16px; image-rendering: pixelated;
}

/* ── 格子下方横排展示 ── */
.shop-info-bar[data-v-f3c86353] {
  flex: 0 0 auto; display: flex; align-items: center; justify-content: space-between;
  padding: 4px 8px; margin: 0 12px;
  border: 1px solid rgba(139,115,85,0.4); background: #735131;
  font-size: 15px; font-family: 'GameFont';
}
.info-name[data-v-f3c86353] { color: #ffd700; font-size: 20px;
}
.info-price[data-v-f3c86353] { color: #aae0ff; font-size: 20px; font-weight: bold;
}

/* ── 底部 ── */
.shop-bottom[data-v-f3c86353] { flex: 0 0 42%; display: flex; flex-direction: column; padding: 0 12px 1%; margin-top: 1%}
.detail-area[data-v-f3c86353] { flex: 1; background: #8b6239; border: 2px solid #d4a76a; box-shadow: inset 0 0 0 1px #5a3a1b, inset 2px 2px 0 rgba(255,255,255,0.1), inset -2px -2px 0 rgba(0,0,0,0.15); padding: 4px 8px; overflow-y: auto; font-size: 20px; font-family: 'GameFont';
}
.detail-name[data-v-f3c86353] { font-size: 13px; margin-bottom: 2px;
}
.name-text[data-v-f3c86353] { white-space: nowrap; color: #ffd700;
}
.detail-desc[data-v-f3c86353] { font-size: 12px; color: #ccc;
}
.detail-row[data-v-f3c86353] { color: #ffffff; font-size: 20px; margin-bottom: 2px;
}
.detail-label[data-v-f3c86353] { color: #e8d5a3;
}
.detail-value[data-v-f3c86353] { color: #fff;
}
.detail-empty[data-v-f3c86353] { color: #ffffff; text-align: center; padding-top: 12px;
}

/* ── 金钱栏 ── */
.money-area[data-v-f3c86353] { flex: 0 0 8%; display: flex; justify-content: space-between; align-items: center; padding: 2px 60px; font-size: 16px; font-family: 'GameFont';
}
.money-gold[data-v-f3c86353] { color: #ffd700;
}
.money-yuanbao[data-v-f3c86353] { color: #aae0ff;
}

/* ── 操作菜单弹窗（跟背包贩卖一致） ── */
.menu-overlay[data-v-f3c86353] {
  position: fixed; inset: 0; z-index: 99999;
  background: rgba(0,0,0,0.6);
  display: flex; align-items: center; justify-content: center;
}
.menu-box[data-v-f3c86353] {
  display: flex; flex-direction: column; align-items: center;
  padding: 10px 28px 18px; position: relative; margin-top: -50%;
}
.menu-btns[data-v-f3c86353] {
  display: flex; flex-direction: column; gap: 4px; width: 100%;
  align-items: center; justify-content: center; margin-top: 10%;
}
.menu-btn[data-v-f3c86353] {
  width: 100%; padding: 5px 30px;
  background: #735131; border: 1px solid #ffd700; border-radius: 0;
  color: #f5d15f; font-family: 'GameFont'; font-size: 15px; letter-spacing: 2px;
  cursor: pointer; outline: none; transition: all 0.15s;
}
.menu-btn[data-v-f3c86353]:hover { background: linear-gradient(180deg, #5a4a3a, #4a3a2a); border-color: #c9a84c; transform: translateY(-1px);
}
.menu-btn[data-v-f3c86353]:active { transform: translateY(0);
}
.btn-return[data-v-f3c86353] { margin-top: 2px;
}

/* ── 购买确认弹窗（跟贩卖确认一致） ── */
.modal-overlay[data-v-f3c86353] {
  position: fixed; inset: 0; z-index: 99999;
  background: rgba(0,0,0,0.6);
  display: flex; align-items: center; justify-content: center;
}
.modal-box[data-v-f3c86353] {
  padding: 24px 28px 18px; min-width: 260px; max-width: 300px; margin-top: -45%;
}
.modal-header[data-v-f3c86353] { text-align: center; margin-bottom: 16px;
}
.modal-title[data-v-f3c86353] { font-family: var(--game-font); font-size: 20px; font-weight: bold; color: #ffd700; text-shadow: 0 1px 4px rgba(0,0,0,0.9);
}
.modal-body[data-v-f3c86353] { font-size: 13px; color: #e8d5a3; line-height: 1.5; margin-bottom: 14px; text-align: center; font-family: var(--game-font);
}
.modal-actions[data-v-f3c86353] { display: flex; gap: 16px; justify-content: center;
}
.modal-btn[data-v-f3c86353] {
  min-width: 100px; padding: 10px 24px;
  border: 1px solid #7a5938; border-radius: 8px;
  font-size: 14px; cursor: pointer; transition: all 0.2s; font-family: var(--game-font);
}
.modal-btn.confirm[data-v-f3c86353] { background: #7a5938; color: #fff;
}
.modal-btn.confirm[data-v-f3c86353]:hover { background: #9a7350;
}
.modal-btn.cancel[data-v-f3c86353] { background: transparent; color: #a09080;
}
.modal-btn.cancel[data-v-f3c86353]:hover { background: rgba(255,255,255,0.05); color: #e0d0c0;
}
.confirm-qty[data-v-f3c86353] { display: flex; align-items: center; gap: 12px; justify-content: center; margin: 8px 0;
}
.confirm-qty-btn[data-v-f3c86353] {
  width: 28px; height: 28px; background: #7a5938; border: 1px solid #7a5938;
  color: #fff; font-size: 16px; cursor: pointer; font-family: 'GameFont';
  display: flex; align-items: center; justify-content: center; border-radius: 4px;
}
.confirm-qty-btn[data-v-f3c86353]:hover { background: #9a7350;
}
.confirm-qty-input[data-v-f3c86353] {
  width: 40px; height: 28px; text-align: center; font-size: 16px; color: #fff;
  background: rgba(0,0,0,0.3); border: 1px solid #7a5938; border-radius: 4px;
  font-family: 'GameFont'; outline: none;
}
.confirm-qty-input[data-v-f3c86353]::-webkit-outer-spin-button,
.confirm-qty-input[data-v-f3c86353]::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0;
}
.confirm-qty-input[type=number][data-v-f3c86353] { -moz-appearance: textfield;
}
.confirm-total[data-v-f3c86353] { font-size: 12px; color: #e8d5a3; margin-top: 4px;
}
.confirm-total-val[data-v-f3c86353] { color: #aae0ff; font-weight: bold;
}
.modal-fade-enter-active[data-v-f3c86353], .modal-fade-leave-active[data-v-f3c86353] { transition: opacity 0.25s ease;
}
.modal-fade-enter-from[data-v-f3c86353], .modal-fade-leave-to[data-v-f3c86353] { opacity: 0;
}
/* 隐藏滚动条 */
.grid-wrapper[data-v-f3c86353]::-webkit-scrollbar { display: none;
}
.detail-area[data-v-f3c86353]::-webkit-scrollbar { display: none;
}
.grid-wrapper[data-v-f3c86353] { scrollbar-width: none; -ms-overflow-style: none;
}
.detail-area[data-v-f3c86353] { scrollbar-width: none; -ms-overflow-style: none;
}

@font-face {
  font-family: 'GameFont';
  src: url('/fonts/VonwaonBitmap-16px.ttf') format('truetype');
}
.settings-fullscreen[data-v-eefc4b00] {
  position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 50;
  background-size: 100% 100%; background-repeat: no-repeat; background-position: center;
  display: flex; flex-direction: column; overflow: hidden; color: #e8d5a3;
}
.settings-header[data-v-eefc4b00] { display: flex; align-items: center; justify-content: center; padding: 20px 20px; flex-shrink: 0; position: relative;
}
.settings-title[data-v-eefc4b00] { font-family: 'GameFont'; font-size: 22px; color: #ffd700; text-shadow: 0 1px 4px rgba(0,0,0,0.9);
}
.close-btn[data-v-eefc4b00] { position: absolute; right: 20px; width: 32px; height: 32px; border: 1px solid #8b7355; border-radius: 4px; background: rgba(0,0,0,0.4); color: #ccc; font-size: 18px; cursor: pointer; font-family: 'GameFont';
}

/* ── 中间 ── */
.settings-middle[data-v-eefc4b00] { flex: 1; display: flex; flex-direction: column; padding: 12px 16px; overflow: hidden;
}
.settings-tabs[data-v-eefc4b00] { display: flex; gap: 11px; margin-bottom: 14px; margin-top: 10px;
}
.tab-btn[data-v-eefc4b00] { padding: 4px 18px; border: 1px solid rgba(139,115,85,0.4); border-radius: 3px; background: rgba(0,0,0,0.4); color: #aaa; cursor: pointer; font-family: 'GameFont'; font-size: 15px;
}
.tab-btn.active[data-v-eefc4b00] { background: rgba(255,215,0,0.15); border-color: #ffd700; color: #ffd700;
}

/* ── 设置项（行式：文字左 + 控件右，点击行选中 → 底部展示说明） ── */
.settings-body[data-v-eefc4b00] { flex: 1; overflow-y: auto;
}
.setting-item[data-v-eefc4b00] {
  border: 2px solid #d4a76a; background: #8b6239;
  box-shadow: inset 0 0 0 1px #5a3a1b, inset 2px 2px 0 rgba(255,255,255,0.1), inset -2px -2px 0 rgba(0,0,0,0.15);
  padding: 10px 12px; margin-bottom: 10px; border-radius: 4px; cursor: pointer;
  transition: outline 0.15s;
}
.setting-item.active[data-v-eefc4b00] { outline: 2px solid #ffd700;
}
.setting-row[data-v-eefc4b00] { display: flex; align-items: center; justify-content: space-between; gap: 10px;
}
.setting-label[data-v-eefc4b00] { font-family: 'GameFont'; font-size: 18px; color: #ffd700; flex-shrink: 0;
}
.fit-options[data-v-eefc4b00] { display: flex; gap: 10px; flex-shrink: 0;
}
.fit-btn[data-v-eefc4b00] {
  font-family: 'GameFont'; font-size: 15px; color: #aaa; background: rgba(0,0,0,0.4);
  border: 1px solid rgba(139,115,85,0.4); border-radius: 3px; padding: 5px 16px; cursor: pointer;
}
.fit-btn.active[data-v-eefc4b00] { background: rgba(255,215,0,0.15); border-color: #ffd700; color: #ffd700;
}

/* ── 加减步进器（值 + −/+ 放设置项行右侧，与文字同一行） ── */
.stepper[data-v-eefc4b00] { display: flex; align-items: center; gap: 8px; flex-shrink: 0;
}
.step-btn[data-v-eefc4b00] {
  font-family: 'GameFont'; font-size: 20px; color: #ffd700; background: rgba(0,0,0,0.4);
  border: 1px solid #8b7355; border-radius: 4px; width: 40px; height: 36px; cursor: pointer;
}
.step-btn[data-v-eefc4b00]:active { background: rgba(255,215,0,0.15);
}
.step-value[data-v-eefc4b00] { font-family: 'GameFont'; font-size: 20px; color: #aae0ff; min-width: 52px; text-align: center;
}

/* ── 底部按钮行（展示区下方：保存 + 返回 并排） ── */
.settings-footer[data-v-eefc4b00] { flex: 0 0 auto; display: flex; justify-content: center; gap: 25%; padding: 10px 0 14px;
}
.save-btn[data-v-eefc4b00] {
  font-family: 'GameFont'; font-size: 15px; color: #fff;
  background: #8b6239; border: 2px solid #d4a76a; border-radius: 4px;
  padding: 5px 25px; cursor: pointer;
  box-shadow: inset 0 0 0 1px #5a3a1b, inset 2px 2px 0 rgba(255,255,255,0.1);
  margin-top: 10px;
}
.save-btn[data-v-eefc4b00]:active { background: #735131;
}
.save-btn[data-v-eefc4b00]:disabled { opacity: 0.6; cursor: not-allowed;
}
.back-btn[data-v-eefc4b00] { background: #3a3a46;
}

/* ── 底部说明展示区（与商城 detail-area 一致） ── */
.settings-detail[data-v-eefc4b00] { flex: 0 0 18%; display: flex; flex-direction: column; padding: 0 12px 2px;
}
.detail-area[data-v-eefc4b00] {
  flex: 1; background: #8b6239; border: 2px solid #d4a76a;
  box-shadow: inset 0 0 0 1px #5a3a1b, inset 2px 2px 0 rgba(255,255,255,0.1), inset -2px -2px 0 rgba(0,0,0,0.15);
  padding: 6px 10px; overflow-y: auto; font-size: 20px; font-family: 'GameFont';
}
.detail-row[data-v-eefc4b00] { color: #ffffff; font-size: 20px; margin-bottom: 2px;
}
.detail-label[data-v-eefc4b00] { color: #e8d5a3;
}
.detail-value[data-v-eefc4b00] { color: #fff; word-break: break-all;
}
.gold[data-v-eefc4b00] { color: #ffd700;
}
.detail-area[data-v-eefc4b00]::-webkit-scrollbar { display: none;
}
.detail-area[data-v-eefc4b00] { scrollbar-width: none; -ms-overflow-style: none;
}

@font-face {
  font-family: 'GameFont';
  src: url('/fonts/VonwaonBitmap-16px.ttf') format('truetype');
}
.profile-fullscreen[data-v-db4c0201] {
  position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 50;
  background-size: 100% 100%; background-repeat: no-repeat; background-position: center;
  display: flex; flex-direction: column; overflow: hidden; color: #e8d5a3;
}
.profile-header[data-v-db4c0201] { display: flex; align-items: center; justify-content: center; padding: 20px 20px; flex-shrink: 0; position: relative;
}
.profile-title[data-v-db4c0201] { font-family: 'GameFont'; font-size: 22px; color: #ffd700; text-shadow: 0 1px 4px rgba(0,0,0,0.9);
}
.close-btn[data-v-db4c0201] { position: absolute; right: 20px; width: 32px; height: 32px; border: 1px solid #8b7355; border-radius: 4px; background: rgba(0,0,0,0.4); color: #ccc; font-size: 18px; cursor: pointer; font-family: 'GameFont';
}

/* ── 主体：左右布局 ── */
.profile-body[data-v-db4c0201] {
  flex: 1; display: flex; padding: 20px 16px; gap: 12px; overflow: hidden;
}

/* ── 左侧：信息列表 ── */
.info-area[data-v-db4c0201] {
  flex: 1; display: flex; flex-direction: column; gap: 8px;
  padding: 8px; 
  overflow-y: auto; font-family: 'GameFont';
}
.info-row[data-v-db4c0201] {
  display: flex; align-items: center; padding: 4px 0;
}
.info-label[data-v-db4c0201] {
  flex: 0 0 50px; color: #e8d5a3; font-size: 16px; font-weight: bold;
}
.info-value[data-v-db4c0201] {
  flex: 1; color: #fff; font-size: 16px; word-break: break-all;font-weight: bold;
}
.info-value.signature[data-v-db4c0201] {
  color: #aaa; font-style: italic;
}
.info-signature[data-v-db4c0201] {
  color: #ffffff; font-size: 15px; font-family: 'GameFont';font-weight: bold;
  word-break: break-all;
}

/* ── 右侧：人物形象 + 装备 ── */
.equip-area[data-v-db4c0201] {
  display: flex; flex-direction: column; align-items: center; gap: 1px;
  flex-shrink: 0; width: 140px;
  margin-top: 10%;
}
.eq-row[data-v-db4c0201] { display: flex; align-items: center; gap: 0;
}
.eq-side[data-v-db4c0201] { display: flex; flex-direction: column; gap: 3px;
}
.eq-left[data-v-db4c0201] { align-items: flex-end;
}
.eq-right[data-v-db4c0201] { align-items: flex-start;
}
.char-model-wrap[data-v-db4c0201] {
  width: 60px; height: 90px;
  display: flex; align-items: center; justify-content: center;
  overflow: hidden; margin: 0 2px;
}
.char-model[data-v-db4c0201] { width: 110%; height: 110%; object-fit: cover; object-position: center 0%;
}
.char-model-placeholder[data-v-db4c0201] { font-size: 12px; color: #888; font-family: 'GameFont';
}
.eq-slot[data-v-db4c0201] {
  width: 35px; height: 35px; border: 1px solid #ffd700;
  background: #000; display: flex; align-items: center; justify-content: center;
  font-size: 11px; color: #aaa; cursor: default; font-family: 'GameFont';
}
.eq-img[data-v-db4c0201] { width: 100%; height: 100%; object-fit: contain; image-rendering: pixelated;
}
.eq-placeholder[data-v-db4c0201] { font-size: 11px; color: #666;
}
.eq-slot-top[data-v-db4c0201], .eq-slot-bottom[data-v-db4c0201] { width: 35px;
}
.eq-bottom-row[data-v-db4c0201] { display: flex; gap: 3px; justify-content: center;
}

/* ── 底部按钮 ── */
.profile-footer[data-v-db4c0201] {
  flex: 0 0 auto; display: flex; justify-content: center; gap: 30%;
  padding: 10px 16px 15px;
}
.footer-btn[data-v-db4c0201] {
  padding: 6px 24px; background: #03c4cd;
  border: 1px solid #009aa1; border-radius: 0;
  color: #ffffff; font-family: 'GameFont'; font-size: 13px;
  cursor: pointer; outline: none; transition: all 0.15s;
}
.footer-btn[data-v-db4c0201]:hover {
  background: linear-gradient(180deg, #03c4cd, #009aa1);
  border-color: #ffffff; transform: translateY(-1px);
}
.footer-btn[data-v-db4c0201]:active { transform: translateY(0);
}

/* ── 装备操作弹窗 ── */
.menu-overlay[data-v-db4c0201] {
  position: fixed; inset: 0; z-index: 99999;
  background: rgba(0,0,0,0.6);
  display: flex; align-items: center; justify-content: center;
}
.menu-box[data-v-db4c0201] {
  display: flex; flex-direction: column; align-items: center;
  padding: 15px 28px 18px;
  position: relative;
  margin-top: -50%;
}
.menu-btns[data-v-db4c0201] {
  display: flex; flex-direction: column; gap: 4px;
  width: 100%;
  align-items: center;
  justify-content: center;
  margin-top: 10%;
}
.menu-btn[data-v-db4c0201] {
  width: 100%; padding: 5px 30px;
  background: #735131;
  border: 1px solid #ffd700;
  border-radius: 0;
  color: #f5d15f;
  font-family: 'GameFont'; font-size: 15px; letter-spacing: 2px;
  cursor: pointer; outline: none;
  transition: all 0.15s;
}
.menu-btn[data-v-db4c0201]:hover {
  background: linear-gradient(180deg, #5a4a3a, #4a3a2a);
  border-color: #c9a84c;
  transform: translateY(-1px);
}
.menu-btn[data-v-db4c0201]:active { transform: translateY(0);
}
.sig-dialog[data-v-db4c0201] {
  width: 280px;
  background: #009aa1;
  border: 1px solid #03c4cd;
  border-radius: 6px;
  padding: 16px;
  display: flex; flex-direction: column; gap: 10px;
  font-family: 'GameFont';
}
.sig-title[data-v-db4c0201] {
  color: #ffd700; font-size: 16px; text-align: center;
  text-shadow: 0 1px 3px rgba(0,0,0,0.8);
}
.sig-textarea[data-v-db4c0201] {
  width: 100%; padding: 8px; box-sizing: border-box;
  background: #03c4cd; border: 1px solid #ffffff; border-radius: 3px;
  color: #fff; font-family: 'GameFont'; font-size: 13px; resize: none; outline: none;
}
.sig-textarea[data-v-db4c0201]:focus { border-color: #ffd700;
}
.sig-footer[data-v-db4c0201] {
  display: flex; align-items: center; justify-content: space-between;
}
.sig-count[data-v-db4c0201] { color: #ffffff; font-size: 11px;
}
.sig-btns[data-v-db4c0201] { display: flex; gap: 8px;
}
.sig-btn[data-v-db4c0201] {
  padding: 4px 16px; background: #03c4cd;
  border: 1px solid #009aa1; border-radius: 0;
  color: #ffffff; font-family: 'GameFont'; font-size: 12px; letter-spacing: 2px;
  cursor: pointer; outline: none;
}
.sig-btn[data-v-db4c0201]:hover { background: 009aa1; border-color: #03c4cd;
}
.sig-btn-cancel[data-v-db4c0201] { border-color: #009aa1; color: #ffffff;
}

/* ── 修改称谓弹窗（统一确认弹窗样式 confirm-dialog pixel-dialog-box） ── */
.confirm-overlay[data-v-db4c0201] {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.55);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 9999;
}
.confirm-dialog[data-v-db4c0201] {
  padding: 30px 40px 20px;
  text-align: center;
}
.confirm-title[data-v-db4c0201] {
  font-family: 'GameFont';
  font-size: 16px;
  color: #ffd700;
  font-weight: bold;
  margin-bottom: 12px;
  letter-spacing: 2px;
}
.confirm-btns[data-v-db4c0201] {
  display: flex;
  gap: 16px;
  justify-content: center;
  margin-top: 14px;
}
.confirm-btn[data-v-db4c0201] {
  padding: 8px 24px;
  border: 1px solid;
  border-radius: 3px;
  font-family: 'GameFont';
  font-size: 13px;
  cursor: pointer;
  transition: all 0.2s;
}
.confirm-yes[data-v-db4c0201] {
  background: rgba(200, 50, 50, 0.2);
  border-color: #a04040;
  color: #e8b0b0;
}
.confirm-yes[data-v-db4c0201]:hover {
  background: rgba(200, 50, 50, 0.45);
  color: #fff;
}
.confirm-no[data-v-db4c0201] {
  background: rgba(80, 80, 90, 0.2);
  border-color: #707080;
  color: #c0c0d0;
}
.confirm-no[data-v-db4c0201]:hover {
  background: rgba(80, 80, 90, 0.45);
  color: #fff;
}
.title-list[data-v-db4c0201] {
  width: 260px;
  max-height: 220px;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.title-option[data-v-db4c0201] {
  padding: 8px 10px;
  background: rgba(0, 0, 0, 0.3);
  border: 1px solid rgba(59, 215, 222, 0.35);
  display: flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
  transition: all 0.15s;
}
.title-option[data-v-db4c0201]:hover {
  border-color: #3BD7DE;
}
.title-option.current[data-v-db4c0201] {
  border-color: #ffd700;
  background: rgba(255, 215, 0, 0.12);
}
.title-option.selected[data-v-db4c0201] {
  box-shadow: 0 0 8px rgba(59, 215, 222, 0.5);
}
.title-name[data-v-db4c0201] {
  color: #3BD7DE;
  font-size: 14px;
}
.title-desc[data-v-db4c0201] {
  flex: 1;
  color: #9adfe3;
  font-size: 11px;
}
.title-tag[data-v-db4c0201] {
  color: #ffd700;
  font-size: 11px;
}
.title-empty[data-v-db4c0201] {
  color: #9adfe3;
  font-size: 13px;
  text-align: center;
  padding: 20px 0;
}

@font-face {
  font-family: 'GameFont';
  src: url('/fonts/VonwaonBitmap-16px.ttf') format('truetype');
}
.friend-panel[data-v-d0d9bc5a] {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 50;
  background-image: url('/czjm/%E9%80%9A%E7%94%A8%E7%95%8C%E9%9D%A2.png');
  background-size: 100% 100%;
  background-repeat: no-repeat;
  display: flex;
  flex-direction: column;
  font-family: 'GameFont';
  box-sizing: border-box;
  padding: 20px 16px 12px;
}
.panel-header[data-v-d0d9bc5a] {
  display: flex; align-items: center; justify-content: center;
  padding: 0px 12px; position: relative;
  color: #ffd700; font-size: 20px; font-weight: bold;
  text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.8);
}
.panel-header .close-btn[data-v-d0d9bc5a] {
  position: absolute; right: 8px;
  width: 28px; height: 28px; border: 1px solid #8b7355; border-radius: 4px;
  background: rgba(0,0,0,0.4); color: #ccc; font-size: 14px;
  cursor: pointer; font-family: 'GameFont'; line-height: 1;
}

/* 商城式标签页 */
.panel-tabs[data-v-d0d9bc5a] {
  display: flex;
  gap: 8px;
  margin-top: 40px;
}
.tab-btn[data-v-d0d9bc5a] {
  padding: 4px 14px;
  border: 1px solid rgba(139, 115, 85, 0.4);
  border-radius: 3px;
  background: rgba(0, 0, 0, 0.4);
  color: #aaa;
  cursor: pointer;
  font-family: 'GameFont';
  font-size: 14px;
  transition: all 0.15s;
}
.tab-btn.active[data-v-d0d9bc5a] {
  background: rgba(255, 215, 0, 0.15);
  border-color: #ffd700;
  color: #ffd700;
}

/* 列表标题行 */
.list-header[data-v-d0d9bc5a] {
  display: flex;
  padding: 8px 10px;
  margin-top: 10px;
  background: rgba(0, 0, 0, 0.35);
  border: 1px solid rgba(139, 115, 85, 0.4);
  border-radius: 3px;
  color: #e8d5a3;
  font-size: 14px;
}
.col-name[data-v-d0d9bc5a] { flex: 1;
}
.col-level[data-v-d0d9bc5a] { width: 50px; text-align: center;
}
.col-affinity[data-v-d0d9bc5a] { width: 90px; text-align: center;
}
.col-status[data-v-d0d9bc5a] { width: 70px; text-align: center;
}

/* 列表内容 */
.list-body[data-v-d0d9bc5a] {
  flex: 1;
  overflow-y: auto;
  max-height: 73%;
  margin-top: 4px;
  display: flex;
  flex-direction: column;
  gap: 3px;
  background: rgba(0, 0, 0, 0.25);
  border: 1px solid rgba(139, 115, 85, 0.4);
  border-radius: 3px;
  padding: 4px;
}
.list-row[data-v-d0d9bc5a] {
  display: flex;
  align-items: center;
  padding: 7px 10px;
  font-size: 14px;
  font-weight: bold;
  color: #f5deb3;
}
.list-row[data-v-d0d9bc5a]:hover { background: #05d6e0;
}
.list-row .col-name[data-v-d0d9bc5a] { color: #ffd700;
}
.list-row.clickable[data-v-d0d9bc5a] {
  cursor: pointer;
}
.list-row.clickable[data-v-d0d9bc5a]:hover {
  filter: brightness(1.12);
}
.online[data-v-d0d9bc5a] { color: #44ff88;
}
.offline[data-v-d0d9bc5a] { color: #ffffff;
}
.empty-tip[data-v-d0d9bc5a] {
  color: #a08060;
  font-size: 13px;
  text-align: center;
  margin: auto 0;
}

/* 分页 */
.pagination[data-v-d0d9bc5a] {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  margin-top: 23px;
}
.page-btn[data-v-d0d9bc5a] {
  padding: 6px 16px;
  background: #03c4cd;
  border: 1px solid #009aa1;
  border-radius: 4px;
  color: #f5deb3;
  font-family: 'GameFont';
  font-size: 13px;
  cursor: pointer;
  transition: all 0.15s;
}
.page-btn[data-v-d0d9bc5a]:hover:not(:disabled) {
  filter: brightness(1.15);
}
.page-btn[data-v-d0d9bc5a]:disabled {
  opacity: 0.4;
  cursor: not-allowed;
}
.page-info[data-v-d0d9bc5a] {
  color: #ffd700;
  font-size: 14px;
}

/* 好友操作菜单（复用背包物品弹窗样式：.pixel-action-box / .pa-corner / .menu-btn 定义于全局 detail-card.css） */
.menu-overlay[data-v-d0d9bc5a] {
  position: fixed;
  top: 0; left: 0;
  width: 100%; height: 100%;
  background: rgba(0, 0, 0, 0.5);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 9999;
}
.menu-box[data-v-d0d9bc5a] {
  width: 240px;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 20px 28px 18px;
  position: relative;
  margin-top: -30%;
}
.menu-btns[data-v-d0d9bc5a] {
  display: flex;
  flex-direction: column;
  gap: 4px;
  width: 100%;
  justify-content: center;
  margin-top: 1%;
}
.menu-btn[data-v-d0d9bc5a] {
  width: 100%; padding: 8px 30px;
  background: #735131;
  border: 1px solid #ffd700;
  border-radius: 0;
  color: #f5d15f;
  font-family: 'GameFont'; font-size: 12px; letter-spacing: 2px;
  cursor: pointer; outline: none;
  transition: all 0.15s;
}
.menu-btn[data-v-d0d9bc5a]:hover {
  background: linear-gradient(180deg, #5a4a3a, #4a3a2a);
  border-color: #c9a84c;
  transform: translateY(-1px);
}
.menu-btn[data-v-d0d9bc5a]:active { transform: translateY(0);
}
.btn-return[data-v-d0d9bc5a] { margin-top: 2px;
}

/* 千里追踪结果弹窗（统一确认弹窗样式） */
.confirm-overlay[data-v-d0d9bc5a] {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.55);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 9999;
}
.confirm-dialog[data-v-d0d9bc5a] {
  padding: 30px 40px 20px;
  text-align: center;
}
.confirm-title[data-v-d0d9bc5a] {
  font-family: 'GameFont';
  font-size: 16px;
  color: #ffd700;
  font-weight: bold;
  margin-bottom: 10px;
  letter-spacing: 2px;
}
.confirm-text[data-v-d0d9bc5a] {
  font-family: 'GameFont';
  font-size: 15px;
  color: #f0e6d3;
  margin-bottom: 20px;
}
.confirm-btns[data-v-d0d9bc5a] {
  display: flex;
  gap: 16px;
  justify-content: center;
}
.confirm-btn[data-v-d0d9bc5a] {
  padding: 8px 24px;
  border: 1px solid;
  border-radius: 3px;
  font-family: 'GameFont';
  font-size: 13px;
  cursor: pointer;
  transition: all 0.2s;
}
.confirm-yes[data-v-d0d9bc5a] {
  background: rgba(200, 50, 50, 0.2);
  border-color: #a04040;
  color: #e8b0b0;
}
.confirm-yes[data-v-d0d9bc5a]:hover {
  background: rgba(200, 50, 50, 0.45);
  color: #fff;
}

.main-menu-overlay[data-v-ce03857b] {
  position: fixed;
  inset: 0;
  z-index: 500;
  background: rgba(0, 0, 0, 0.65);
  display: flex;
  align-items: center;
  justify-content: center;
}

/* ===== 主菜单容器（1:1 照抄 主菜单.html .menu-box） ===== */
.menu-panel[data-v-ce03857b] {
  width: 375px;
  height: 475px;
  box-sizing: border-box;
  background: #1a5f6a;
  border: 4px solid #00e5e5;
  position: relative;
  box-shadow:
    inset 0 0 0 3px #0d3d45,
    0 0 0 2px #00e5e5;
  padding: 60px 20px 20px;
  display: flex;
  flex-direction: column;
  align-items: center;
  font-family: "Microsoft YaHei", "SimHei", sans-serif;
  margin-top: -60%;
}

/* ===== 四角花纹（1:1 照抄 主菜单.html .corner） ===== */
.menu-panel .corner[data-v-ce03857b] {
  position: absolute;
  width: 1px;
  height: 1px;
  background: transparent;
  pointer-events: none;
  z-index: 0;
  box-shadow:
    3px 0px #00e5e5, 4px 0px #00e5e5, 5px 0px #00e5e5, 6px 0px #00e5e5, 7px 0px #00e5e5, 8px 0px #00e5e5,
    11px 0px #00e5e5, 12px 0px #00e5e5, 13px 0px #00e5e5, 14px 0px #00e5e5, 15px 0px #00e5e5, 16px 0px #00e5e5,
    19px 0px #00e5e5, 20px 0px #00e5e5, 21px 0px #00e5e5, 22px 0px #00e5e5, 23px 0px #00e5e5, 24px 0px #00e5e5, 25px 0px #00e5e5, 26px 0px #00e5e5,
    3px 1px #00e5e5, 4px 1px #00e5e5, 5px 1px #00e5e5, 6px 1px #00e5e5, 7px 1px #00e5e5, 8px 1px #00e5e5,
    11px 1px #00e5e5, 12px 1px #00e5e5, 13px 1px #00e5e5, 14px 1px #00e5e5, 15px 1px #00e5e5, 16px 1px #00e5e5,
    19px 1px #00e5e5, 20px 1px #00e5e5, 21px 1px #00e5e5, 22px 1px #00e5e5, 23px 1px #00e5e5, 24px 1px #00e5e5, 25px 1px #00e5e5, 26px 1px #00e5e5,
    3px 2px #00e5e5, 4px 2px #00e5e5, 7px 2px #00e5e5, 8px 2px #00e5e5,
    11px 2px #00e5e5, 12px 2px #00e5e5, 15px 2px #00e5e5, 16px 2px #00e5e5,
    19px 2px #00e5e5, 20px 2px #00e5e5, 25px 2px #00e5e5, 26px 2px #00e5e5,
    3px 3px #00e5e5, 4px 3px #00e5e5, 7px 3px #00e5e5, 8px 3px #00e5e5,
    11px 3px #00e5e5, 12px 3px #00e5e5, 15px 3px #00e5e5, 16px 3px #00e5e5,
    19px 3px #00e5e5, 20px 3px #00e5e5, 25px 3px #00e5e5, 26px 3px #00e5e5,
    3px 4px #00e5e5, 4px 4px #00e5e5, 5px 4px #00e5e5, 6px 4px #00e5e5, 7px 4px #00e5e5, 8px 4px #00e5e5, 9px 4px #00e5e5, 10px 4px #00e5e5, 11px 4px #00e5e5, 12px 4px #00e5e5, 13px 4px #00e5e5, 14px 4px #00e5e5, 15px 4px #00e5e5, 16px 4px #00e5e5,
    19px 4px #00e5e5, 20px 4px #00e5e5, 23px 4px #00e5e5, 24px 4px #00e5e5, 25px 4px #00e5e5, 26px 4px #00e5e5,
    3px 5px #00e5e5, 4px 5px #00e5e5, 5px 5px #00e5e5, 6px 5px #00e5e5, 7px 5px #00e5e5, 8px 5px #00e5e5, 9px 5px #00e5e5, 10px 5px #00e5e5, 11px 5px #00e5e5, 12px 5px #00e5e5, 13px 5px #00e5e5, 14px 5px #00e5e5, 15px 5px #00e5e5, 16px 5px #00e5e5,
    19px 5px #00e5e5, 20px 5px #00e5e5, 23px 5px #00e5e5, 24px 5px #00e5e5, 25px 5px #00e5e5, 26px 5px #00e5e5,
    7px 6px #00e5e5, 8px 6px #00e5e5, 11px 6px #00e5e5, 12px 6px #00e5e5, 19px 6px #00e5e5, 20px 6px #00e5e5,
    7px 7px #00e5e5, 8px 7px #00e5e5, 11px 7px #00e5e5, 12px 7px #00e5e5, 19px 7px #00e5e5, 20px 7px #00e5e5,
    3px 8px #00e5e5, 4px 8px #00e5e5, 5px 8px #00e5e5, 6px 8px #00e5e5, 7px 8px #00e5e5, 8px 8px #00e5e5, 9px 8px #00e5e5, 10px 8px #00e5e5, 11px 8px #00e5e5, 12px 8px #00e5e5, 13px 8px #00e5e5, 14px 8px #00e5e5, 15px 8px #00e5e5, 16px 8px #00e5e5, 17px 8px #00e5e5, 18px 8px #00e5e5, 19px 8px #00e5e5, 20px 8px #00e5e5,
    3px 9px #00e5e5, 4px 9px #00e5e5, 5px 9px #00e5e5, 6px 9px #00e5e5, 7px 9px #00e5e5, 8px 9px #00e5e5, 9px 9px #00e5e5, 10px 9px #00e5e5, 11px 9px #00e5e5, 12px 9px #00e5e5, 13px 9px #00e5e5, 14px 9px #00e5e5, 15px 9px #00e5e5, 16px 9px #00e5e5, 17px 9px #00e5e5, 18px 9px #00e5e5, 19px 9px #00e5e5, 20px 9px #00e5e5,
    3px 10px #00e5e5, 4px 10px #00e5e5, 7px 10px #00e5e5, 8px 10px #00e5e5, 11px 10px #00e5e5, 12px 10px #00e5e5,
    3px 11px #00e5e5, 4px 11px #00e5e5, 7px 11px #00e5e5, 8px 11px #00e5e5, 11px 11px #00e5e5, 12px 11px #00e5e5,
    3px 12px #00e5e5, 4px 12px #00e5e5, 5px 12px #00e5e5, 6px 12px #00e5e5, 7px 12px #00e5e5, 8px 12px #00e5e5, 11px 12px #00e5e5, 12px 12px #00e5e5,
    3px 13px #00e5e5, 4px 13px #00e5e5, 5px 13px #00e5e5, 6px 13px #00e5e5, 7px 13px #00e5e5, 8px 13px #00e5e5, 11px 13px #00e5e5, 12px 13px #00e5e5,
    11px 14px #00e5e5, 12px 14px #00e5e5,
    11px 15px #00e5e5, 12px 15px #00e5e5,
    3px 16px #00e5e5, 4px 16px #00e5e5, 5px 16px #00e5e5, 6px 16px #00e5e5, 7px 16px #00e5e5, 8px 16px #00e5e5, 9px 16px #00e5e5, 10px 16px #00e5e5, 11px 16px #00e5e5, 12px 16px #00e5e5,
    3px 17px #00e5e5, 4px 17px #00e5e5, 5px 17px #00e5e5, 6px 17px #00e5e5, 7px 17px #00e5e5, 8px 17px #00e5e5, 9px 17px #00e5e5, 10px 17px #00e5e5, 11px 17px #00e5e5, 12px 17px #00e5e5,
    3px 18px #00e5e5, 4px 18px #00e5e5,
    3px 19px #00e5e5, 4px 19px #00e5e5,
    3px 20px #00e5e5, 4px 20px #00e5e5, 7px 20px #00e5e5, 8px 20px #00e5e5,
    3px 21px #00e5e5, 4px 21px #00e5e5, 7px 21px #00e5e5, 8px 21px #00e5e5,
    3px 22px #00e5e5, 4px 22px #00e5e5, 5px 22px #00e5e5, 6px 22px #00e5e5, 7px 22px #00e5e5, 8px 22px #00e5e5;
}
.menu-panel .corner.tl[data-v-ce03857b] { top: 5px; left: 4px;
}
.menu-panel .corner.tr[data-v-ce03857b] { top: 5px; right: 4px; transform: scaleX(-1);
}
.menu-panel .corner.bl[data-v-ce03857b] { bottom: 5px; left: 4px; transform: scaleY(-1);
}
.menu-panel .corner.br[data-v-ce03857b] { bottom: 5px; right: 4px; transform: scale(-1, -1);
}

/* ===== 小菱形装饰（1:1 照抄 主菜单.html .gem-small） ===== */
.menu-panel .gem-small[data-v-ce03857b] {
  position: absolute;
  top: 22px;
  width: 20px;
  height: 20px;
  background: linear-gradient(135deg, #e1f5fe 0%, #81d4fa 50%, #4fc3f7 100%);
  transform: rotate(45deg);
  border: 1.5px solid #b3e5fc;
  box-shadow:
    inset 1px 1px 0 0 rgba(255,255,255,0.8),
    inset -1px -1px 0 0 rgba(0,150,200,0.3),
    0 0 3px rgba(79,195,247,0.5);
  z-index: 1;
}
.menu-panel .gem-small[data-v-ce03857b]::after {
  content: '';
  position: absolute;
  top: 3px; left: 3px;
  width: 6px; height: 6px;
  background: rgba(255,255,255,0.7);
  border-radius: 50%;
  filter: blur(1px);
}
.menu-panel .gem-small-left[data-v-ce03857b] { left: 80px;
}
.menu-panel .gem-small-right[data-v-ce03857b] { right: 80px;
}

/* ===== 标题（1:1 照抄 主菜单.html .title-text） ===== */
.menu-panel .title-text[data-v-ce03857b] {
  position: absolute;
  top: 20px;
  left: 50%;
  transform: translateX(-50%);
  color: #e6e6e6;
  font-size: 12px;
  font-weight: bold;
  z-index: 10;
  text-shadow: 0 0 2px rgba(255,255,255,0.5);
  letter-spacing: 2px;
}

/* ===== 网格区域（1:1 照抄 主菜单.html .grid-area / .grid-item） ===== */
.menu-panel .grid-area[data-v-ce03857b] {
  width: 100%;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  margin-top: 8px;
  padding: 0 8px;
  position: relative;
  z-index: 1;
}
.menu-panel .grid-item[data-v-ce03857b] {
  aspect-ratio: 16/10;
  background: #2a9aaa;
  border: 2px solid #00e5e5;
  box-shadow:
    inset 0 0 0 1px #1a8a9a,
    inset 2px 2px 0 rgba(255,255,255,0.15),
    inset -2px -2px 0 rgba(0,0,0,0.1);
  position: relative;
  cursor: pointer;
  transition: all 0.2s;
  display: flex;
  align-items: center;
  justify-content: center;
  user-select: none;
  -webkit-tap-highlight-color: transparent;
}
.menu-panel .grid-item[data-v-ce03857b]:hover {
  background: #3ababa;
  box-shadow:
    inset 0 0 0 1px #1a8a9a,
    inset 2px 2px 0 rgba(255,255,255,0.25),
    inset -2px -2px 0 rgba(0,0,0,0.1),
    0 0 8px rgba(0,229,229,0.3);
}
.menu-panel .grid-item[data-v-ce03857b]:active {
  transform: scale(0.95);
}
.menu-panel .item-label[data-v-ce03857b] {
  color: #e6e6e6;
  font-size: 14px;
  font-weight: bold;
  letter-spacing: 2px;
  text-align: center;
  text-shadow: 0 0 2px rgba(0,0,0,0.4);
}

/* ===== 分割线（1:1 照抄 主菜单.html .divider） ===== */
.menu-panel .divider[data-v-ce03857b] {
  width: calc(100% - 16px);
  height: 2px;
  background: #0d3d45;
  margin: 12px 8px;
  box-shadow: 0 1px 0 rgba(0,229,229,0.2);
  position: relative;
  z-index: 1;
}

/* ===== 底部按钮（1:1 照抄 主菜单.html .bottom-buttons / .menu-btn） ===== */
.menu-panel .bottom-buttons[data-v-ce03857b] {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: auto;
  padding: 0 8px;
  padding-bottom: 4px;
  position: relative;
  z-index: 1;
}
.menu-panel .menu-btn[data-v-ce03857b] {
  width: 100%;
  height: 40px;
  background: #8b6239;
  border: 2px solid #d4a76a;
  box-shadow:
    inset 0 0 0 1px #5a3a1b,
    inset 2px 2px 0 rgba(255,255,255,0.1),
    inset -2px -2px 0 rgba(0,0,0,0.15);
  color: #f5deb3;
  font-size: 14px;
  font-weight: bold;
  letter-spacing: 4px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s;
}
.menu-panel .menu-btn[data-v-ce03857b]:hover {
  background: #a07045;
  box-shadow:
    inset 0 0 0 1px #5a3a1b,
    inset 2px 2px 0 rgba(255,255,255,0.2),
    inset -2px -2px 0 rgba(0,0,0,0.15),
    0 0 8px rgba(212,167,106,0.3);
}

/* 与离队通知 / 组队通知一致：青卡 + 四角像素 + 金色标题 + 红/灰按钮。
   此处加宽容器并放配置表单。 */
.afk-dialog[data-v-fca074b4] {
  width: 380px;
  max-height: 84vh;
  display: flex;
  flex-direction: column;
  margin-top: -45%;
}
.afk-form[data-v-fca074b4] {
  padding: 12px 16px 4px;
  overflow-y: auto;
}
.afk-field[data-v-fca074b4] {
  margin-bottom: 10px;
}
.afk-row[data-v-fca074b4] {
  display: flex;
  gap: 10px;
}
.afk-half[data-v-fca074b4] {
  flex: 1;
}
.afk-label[data-v-fca074b4] {
  display: block;
  font-size: 12px;
  color: #ffd700;
  margin-bottom: 4px;
}
.afk-input[data-v-fca074b4],
.afk-select[data-v-fca074b4] {
  width: 100%;
  background: rgba(0, 0, 0, 0.45);
  border: 1px solid #0aa;
  color: #e8f6f6;
  border-radius: 4px;
  padding: 6px 8px;
  font-size: 13px;
  font-family: inherit;
  box-sizing: border-box;
  outline: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}
/* 聚焦态：去掉浏览器默认蓝色外发光，改用主题绿描边 */
.afk-input[data-v-fca074b4]:focus,
.afk-select[data-v-fca074b4]:focus {
  border-color: #2ee66b;
  box-shadow: 0 0 4px rgba(46, 230, 107, 0.45);
}
/* 数字输入框：去掉浏览器原生上下微调箭头 */
.afk-input[type='number'][data-v-fca074b4] {
  -moz-appearance: textfield;
}
.afk-input[type='number'][data-v-fca074b4]::-webkit-inner-spin-button,
.afk-input[type='number'][data-v-fca074b4]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
/* 下拉框：去掉原生箭头，改用自绘青色箭头 */
.afk-select[data-v-fca074b4] {
  padding-right: 26px;
  background-image: linear-gradient(45deg, transparent 50%, #0aa 50%),
                    linear-gradient(135deg, #0aa 50%, transparent 50%);
  background-position: calc(100% - 15px) calc(50% - 2px), calc(100% - 10px) calc(50% - 2px);
  background-size: 5px 5px, 5px 5px;
  background-repeat: no-repeat;
}
.afk-check[data-v-fca074b4] {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  color: #cfe;
  margin-bottom: 8px;
  cursor: pointer;
}
/* 复选框：去掉浏览器默认蓝色，统一为游戏青色主题 */
.afk-check input[type='checkbox'][data-v-fca074b4] {
  width: 16px;
  height: 16px;
  margin: 0;
  flex: none;
  accent-color: #0aa;
  cursor: pointer;
}
/* 清理品质：一行可勾选的胶囊 */
.afk-clear-block[data-v-fca074b4] {
  border: 1px dashed rgba(0, 170, 170, 0.35);
  border-radius: 6px;
  padding: 8px 10px;
  margin-bottom: 10px;
  background: rgba(0, 40, 40, 0.25);
}
.afk-clear-rarities[data-v-fca074b4] {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
}
.afk-clear-label[data-v-fca074b4] {
  font-size: 12px;
  color: #ffd700;
  margin-right: 2px;
}
.afk-chip[data-v-fca074b4] {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 12px;
  color: #cfe;
  background: rgba(0, 0, 0, 0.35);
  border: 1px solid #0aa;
  border-radius: 12px;
  padding: 3px 10px;
  cursor: pointer;
  user-select: none;
}
.afk-chip input[type='checkbox'][data-v-fca074b4] {
  width: 14px;
  height: 14px;
  margin: 0;
  accent-color: #0aa;
  cursor: pointer;
}
.afk-hint[data-v-fca074b4] {
  font-size: 11px;
  color: #8aa;
  line-height: 1.5;
}
.afk-status[data-v-fca074b4] {
  font-size: 12px;
  color: #7fffd4;
  margin: 6px 0 10px;
  display: flex;
  align-items: center;
  gap: 6px;
}
.afk-status-dot[data-v-fca074b4] {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #2ee66b;
  box-shadow: 0 0 6px #2ee66b;
}
.afk-btns[data-v-fca074b4] {
  flex-direction: column;
  padding: 10px 16px 16px;
}
.afk-btns .confirm-btn[data-v-fca074b4] {
  width: 100%;
}
.afk-stop[data-v-fca074b4] {
  background: #6b2b2b !important;
  border-color: #c0392b !important;
  color: #ffd9d9 !important;
}

/* 复用离队通知样式（青卡 + 四角 + 金标题 + 红/灰按钮），仅调整布局为竖向列表 */
.hangup-dialog[data-v-431f034e] {
  width: 340px;
}
.hangup-list[data-v-431f034e] {
  padding: 14px 16px 6px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.hangup-item[data-v-431f034e] {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
}
.hangup-item-name[data-v-431f034e] {
  font-size: 14px;
}
.hangup-item-badge[data-v-431f034e] {
  font-size: 11px;
  line-height: 1;
  background: #2ee66b;
  color: #042;
  border-radius: 8px;
  padding: 2px 8px;
}
.hangup-btns[data-v-431f034e] {
  flex-direction: column;
  padding: 10px 16px 16px;
}
.hangup-btns .confirm-btn[data-v-431f034e] {
  width: 100%;
}

.afk-summary-dialog[data-v-04a13385] {
  width: 320px;
  max-height: 80vh;
  display: flex;
  flex-direction: column;
}
.afk-summary-body[data-v-04a13385] {
  padding: 6px 16px 4px;
  overflow-y: auto;
  text-align: left;
}
.afk-summary-reason[data-v-04a13385] {
  font-size: 12px;
  color: #ffb3b3;
  background: rgba(120, 30, 30, 0.25);
  border: 1px solid #a04040;
  border-radius: 4px;
  padding: 4px 8px;
  margin-bottom: 10px;
}
.afk-summary-line[data-v-04a13385] {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 13px;
  color: #e8f6f6;
  padding: 3px 0;
  border-bottom: 1px dashed rgba(0, 170, 170, 0.18);
}
.afk-summary-key[data-v-04a13385] {
  color: #ffd700;
}
.afk-summary-val[data-v-04a13385] {
  color: #7fffd4;
  font-weight: bold;
}
.afk-summary-section[data-v-04a13385] {
  margin-top: 10px;
  border-top: 1px solid rgba(0, 170, 170, 0.3);
  padding-top: 8px;
}
.afk-summary-sub[data-v-04a13385] {
  font-size: 13px;
  color: #ffd700;
  margin-bottom: 6px;
  letter-spacing: 1px;
}
.afk-summary-empty[data-v-04a13385] {
  font-size: 13px;
  color: #8aa;
}
.afk-summary-item[data-v-04a13385] {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 13px;
  color: #e8f6f6;
  padding: 3px 0;
}
.afk-summary-item-name[data-v-04a13385] {
  color: #cfe;
}
.afk-summary-item-count[data-v-04a13385] {
  color: #7fffd4;
  font-weight: bold;
}
.afk-summary-clear[data-v-04a13385] {
  flex-wrap: wrap;
  gap: 4px 10px;
  border-bottom: none;
}
.afk-summary-rarity[data-v-04a13385] {
  font-size: 12px;
  color: #9fd;
}

.game-ui[data-v-4cdfcc66] {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 10;
  pointer-events: none;
}
.game-ui[data-v-4cdfcc66]>* {
  pointer-events: auto;
}
.hud-top-right[data-v-4cdfcc66] {
  position: absolute;
  top: 7%;
  right: 5px;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  border: 2px solid #ffd700;
}

/* 界面缩放按钮已移至 App.vue viewport 层（不随缩放，始终可见） */
.network-info[data-v-4cdfcc66] {
  position: absolute;
  top: 10px;
  right: 10px;
  text-align: right;
  display: flex;
  gap: 10px;
}
.ping[data-v-4cdfcc66] {
  font-size: 11px;
  font-family: var(--game-font);
  padding: 4px 8px;
  background: rgba(0, 0, 0, 0.5);
  border-radius: 4px;
}
.ping.good[data-v-4cdfcc66] {
  color: #2ecc71;
}
.ping.bad[data-v-4cdfcc66] {
  color: #e74c3c;
}
.player-count[data-v-4cdfcc66] {
  font-size: 11px;
  font-family: var(--game-font);
  color: #fff;
  background: rgba(0, 0, 0, 0.5);
  padding: 4px 8px;
  border-radius: 4px;
}

/* ── 离队按钮 ── */
.leave-party-btn[data-v-4cdfcc66] {
  position: absolute;
  bottom: 6px;
  right: 6px;
  padding: 5px 14px;
  border: 2px solid #ffd700;
  background: #7a5938;
  color: #ffd700;
  font-family: var(--game-font);
  font-size: 12px;
  cursor: pointer;
  transition: all 0.2s;
  z-index: 20;
}
.leave-party-btn[data-v-4cdfcc66]:hover {
  background: rgba(200, 50, 50, 0.45);
  color: #fff;
}

/* ── 左上角队友信息 ── */
.hud-top-left[data-v-4cdfcc66] {
  position: absolute;
  top: 42px;
  left: 6px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
  z-index: 20;
}
.teammate-chip[data-v-4cdfcc66] {
  display: flex;
  align-items: center;
  gap: 3px;
  padding: 1px 4px 1px 1px;
  background: none;
  border: none;
  border-radius: 0;
}
.teammate-avatar[data-v-4cdfcc66] {
  width: 100px;
  height: 34px;
  border: none;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  overflow: hidden;
}
.teammate-img[data-v-4cdfcc66] {
  width: 150%;
  height: 90%;
  object-fit: cover;
  object-position: center top;
  image-rendering: pixelated;
}
.teammate-letter[data-v-4cdfcc66] {
  font-family: var(--game-font);
  font-size: 9px;
  color: #ffd700;
  line-height: 1;
}
.teammate-name[data-v-4cdfcc66] {
  font-family: var(--game-font);
  font-size: 15px;
  color: #0091db;
  font-weight: bold;
}

/* ── 二次确认弹窗 ── */
.confirm-overlay[data-v-4cdfcc66] {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.55);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 3000;
}
.confirm-dialog[data-v-4cdfcc66] {
  padding: 30px 40px 20px;
  text-align: center;
}
.confirm-text[data-v-4cdfcc66] {
  font-family: var(--game-font);
  font-size: 15px;
  color: #f0e6d3;
  margin-bottom: 20px;
}
.confirm-title[data-v-4cdfcc66] {
  font-family: var(--game-font);
  font-size: 16px;
  color: #ffd700;
  font-weight: bold;
  margin-bottom: 10px;
  letter-spacing: 2px;
}
.confirm-btns[data-v-4cdfcc66] {
  display: flex;
  gap: 16px;
  justify-content: center;
}
.confirm-btn[data-v-4cdfcc66] {
  padding: 8px 24px;
  border: 1px solid;
  border-radius: 3px;
  font-family: var(--game-font);
  font-size: 13px;
  cursor: pointer;
  transition: all 0.2s;
}
.confirm-yes[data-v-4cdfcc66] {
  background: rgba(200, 50, 50, 0.2);
  border-color: #a04040;
  color: #e8b0b0;
}
.confirm-yes[data-v-4cdfcc66]:hover {
  background: rgba(200, 50, 50, 0.45);
  color: #fff;
}
.confirm-no[data-v-4cdfcc66] {
  background: rgba(100, 100, 100, 0.2);
  border-color: #666;
  color: #bbb;
}
.confirm-no[data-v-4cdfcc66]:hover {
  background: rgba(100, 100, 100, 0.4);
  color: #fff;
}

/* ── 太极加载动画 ── */
.loading-overlay[data-v-4cdfcc66] {
  position: absolute;
  top: 50px;
  right: 10px;
  z-index: 100;
  pointer-events: none;
}
.taiji-wrap[data-v-4cdfcc66] {
  position: relative;
  width: 44px;
  height: 44px;
}
.taiji[data-v-4cdfcc66] {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  overflow: hidden;
  position: relative;
  animation: taiji-spin-4cdfcc66 1.2s linear infinite;
  border: 2px solid #e8c84a;
  box-shadow: 0 0 6px rgba(232, 200, 74, 0.5);
  position: absolute;
  top: 6px;
  left: 6px;
}
.taiji-white[data-v-4cdfcc66] {
  position: absolute;
  width: 100%;
  height: 50%;
  background: #f0e6d0;
  top: 0;
}
.taiji-black[data-v-4cdfcc66] {
  position: absolute;
  width: 100%;
  height: 50%;
  background: #2a2a2a;
  bottom: 0;
}

/* 上半白圆 + 下半黑圆构成S形分界 */
.taiji[data-v-4cdfcc66]::before {
  content: '';
  position: absolute;
  width: 50%;
  height: 50%;
  background: #2a2a2a;
  border-radius: 50%;
  top: 25%;
  left: 0;
}
.taiji[data-v-4cdfcc66]::after {
  content: '';
  position: absolute;
  width: 50%;
  height: 50%;
  background: #f0e6d0;
  border-radius: 50%;
  bottom: 25%;
  right: 0;
}

/* 阴眼（白色中的黑点） */
.taiji-eye-black[data-v-4cdfcc66] {
  position: absolute;
  width: 6px;
  height: 6px;
  background: #2a2a2a;
  border-radius: 50%;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 2;
}

/* 阳眼（黑色中的白点） */
.taiji-eye-white[data-v-4cdfcc66] {
  position: absolute;
  width: 6px;
  height: 6px;
  background: #f0e6d0;
  border-radius: 50%;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 2;
}

/* 太极周围的六个黄色眼，均匀包围太极 */
.taiji-dot[data-v-4cdfcc66] {
  position: absolute;
  width: 5px;
  height: 5px;
  background: #e8c84a;
  border-radius: 50%;
  box-shadow: 0 0 4px rgba(232, 200, 74, 0.6);
}

/* 上方 */
.dot1[data-v-4cdfcc66] { top: -2px; left: 50%; transform: translateX(-50%); animation: dot-pulse-4cdfcc66 1.2s ease-in-out infinite;
}
/* 右上 */
.dot2[data-v-4cdfcc66] { top: 5px; right: -2px; animation: dot-pulse-4cdfcc66 1.2s ease-in-out 0.2s infinite;
}
/* 右下 */
.dot3[data-v-4cdfcc66] { bottom: 5px; right: -2px; animation: dot-pulse-4cdfcc66 1.2s ease-in-out 0.4s infinite;
}
/* 下方 */
.dot4[data-v-4cdfcc66] { bottom: -2px; left: 50%; transform: translateX(-50%); animation: dot-pulse-4cdfcc66 1.2s ease-in-out 0.6s infinite;
}
/* 左下 */
.dot5[data-v-4cdfcc66] { bottom: 5px; left: -2px; animation: dot-pulse-4cdfcc66 1.2s ease-in-out 0.8s infinite;
}
/* 左上 */
.dot6[data-v-4cdfcc66] { top: 5px; left: -2px; animation: dot-pulse-4cdfcc66 1.2s ease-in-out 1.0s infinite;
}
@keyframes taiji-spin-4cdfcc66 {
from { transform: rotate(0deg);
}
to { transform: rotate(360deg);
}
}
@keyframes dot-pulse-4cdfcc66 {
0%, 100% { opacity: 0.4; transform: scale(0.8);
}
50% { opacity: 1; transform: scale(1.2);
}
}
.dot1[data-v-4cdfcc66] { animation: dot-pulse-y-4cdfcc66 1.2s ease-in-out infinite;
}
.dot4[data-v-4cdfcc66] { animation: dot-pulse-y-4cdfcc66 1.2s ease-in-out 0.6s infinite;
}
@keyframes dot-pulse-y-4cdfcc66 {
0%, 100% { opacity: 0.4; transform: translateX(-50%) scale(0.8);
}
50% { opacity: 1; transform: translateX(-50%) scale(1.2);
}
}

/* ── Toast 提示 ── */
.toast-msg[data-v-4cdfcc66] {
  position: absolute;
  top: 50px;
  right: 10px;
  z-index: 200;
  padding: 8px 18px;
  border-radius: 6px;
  font-family: var(--game-font);
  font-size: 13px;
  color: #fff;
  pointer-events: none;
  box-shadow: 0 2px 8px rgba(0,0,0,0.4);
}
.toast-msg.success[data-v-4cdfcc66] { background: rgba(46, 204, 113, 0.9);
}
.toast-msg.error[data-v-4cdfcc66] { background: rgba(231, 76, 60, 0.9);
}
.toast-msg.info[data-v-4cdfcc66] { background: rgba(52, 152, 219, 0.9);
}
.toast-fade-enter-active[data-v-4cdfcc66] { transition: opacity 0.2s ease;
}
.toast-fade-leave-active[data-v-4cdfcc66] { transition: opacity 0.5s ease;
}
.toast-fade-enter-from[data-v-4cdfcc66],
.toast-fade-leave-to[data-v-4cdfcc66] { opacity: 0;
}

/* 主菜单按钮 */

.login-overlay[data-v-e744d2a1] {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 100;
  background: #e9e6dd;
  overflow: hidden;
}

/* ── 宣纸留白 · 淡墨远山 ── */
.login-scene[data-v-e744d2a1] {
  position: absolute;
  inset: 0;
  pointer-events: none;
  overflow: hidden;
}
.scene-sky[data-v-e744d2a1] {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, #f6f3ec 0%, #efece4 52%, #e6e2d8 100%);
}
.scene-glow[data-v-e744d2a1] {
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse 58% 40% at 50% 14%, rgba(255, 255, 255, 0.7) 0%, transparent 72%);
}
.scene-range[data-v-e744d2a1] {
  position: absolute;
  inset: 0;
  background-repeat: no-repeat;
}
.scene-range.far[data-v-e744d2a1] {
  background: linear-gradient(180deg, rgba(150, 158, 168, 0.38) 0%, rgba(168, 175, 184, 0.52) 100%);
  clip-path: polygon(0% 56%, 12% 43%, 25% 51%, 38% 39%, 52% 49%, 66% 41%, 80% 50%, 92% 45%, 100% 53%, 100% 100%, 0% 100%);
}
.scene-range.mid[data-v-e744d2a1] {
  background: linear-gradient(180deg, rgba(120, 129, 140, 0.42) 0%, rgba(140, 148, 158, 0.56) 100%);
  clip-path: polygon(0% 66%, 18% 55%, 33% 63%, 48% 53%, 63% 62%, 78% 54%, 100% 61%, 100% 100%, 0% 100%);
}
.scene-range.near[data-v-e744d2a1] {
  background: linear-gradient(180deg, rgba(92, 100, 112, 0.5) 0%, rgba(110, 118, 130, 0.66) 100%);
  clip-path: polygon(0% 79%, 20% 71%, 40% 78%, 60% 73%, 80% 76%, 100% 74%, 100% 100%, 0% 100%);
}
.scene-mist[data-v-e744d2a1] {
  position: absolute;
  left: -20%;
  right: -20%;
  top: 58%;
  height: 26%;
  background: radial-gradient(ellipse 50% 60% at 35% 50%, rgba(255, 255, 255, 0.45) 0%, transparent 70%),
              radial-gradient(ellipse 45% 60% at 72% 50%, rgba(255, 255, 255, 0.4) 0%, transparent 70%);
}
.scene-vignette[data-v-e744d2a1] {
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse at 50% 46%, transparent 54%, rgba(70, 74, 84, 0.14) 100%);
}

/* ── 登录面板（白玻璃 · 墨字 · 四角标） ── */
.login-panel[data-v-e744d2a1] {
  position: relative;
  width: 350px;
  background: rgba(255, 255, 255, 0.82);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border: 1px solid rgba(255, 255, 255, 0.7);
  border-radius: 10px;
  padding: 0 26px 28px;
  box-shadow:
    0 22px 60px rgba(40, 44, 54, 0.18),
    0 0 0 1px rgba(40, 44, 54, 0.06);
}

/* 四角墨色角标 */
.corner[data-v-e744d2a1] {
  position: absolute;
  width: 14px;
  height: 14px;
  border: 1px solid rgba(60, 66, 78, 0.45);
  pointer-events: none;
}
.corner.tl[data-v-e744d2a1] { top: 6px; left: 6px; border-right: none; border-bottom: none;
}
.corner.tr[data-v-e744d2a1] { top: 6px; right: 6px; border-left: none; border-bottom: none;
}
.corner.bl[data-v-e744d2a1] { bottom: 6px; left: 6px; border-right: none; border-top: none;
}
.corner.br[data-v-e744d2a1] { bottom: 6px; right: 6px; border-left: none; border-top: none;
}

/* 顶部标题分区 */
.panel-header[data-v-e744d2a1] {
  margin: 0 -26px 22px;
  padding: 28px 26px 18px;
  border-bottom: 1px solid rgba(40, 44, 54, 0.10);
  background:
    radial-gradient(ellipse 60% 120% at 50% 0%, rgba(40, 44, 54, 0.04) 0%, transparent 70%);
  border-radius: 10px 10px 0 0;
}
.game-title[data-v-e744d2a1] {
  text-align: center;
  font-family: var(--game-font);
  font-size: 30px;
  font-weight: 500;
  color: #2b2f38;
  letter-spacing: 5px;
  margin: 0 0 7px;
}
.game-subtitle[data-v-e744d2a1] {
  text-align: center;
  font-family: var(--game-font);
  font-size: 11px;
  color: #8a8d96;
  letter-spacing: 3px;
  margin: 0;
}
.tab-bar[data-v-e744d2a1] {
  display: flex;
  margin-bottom: 22px;
  border-bottom: 1px solid rgba(40, 44, 54, 0.10);
}
.tab-btn[data-v-e744d2a1] {
  flex: 1;
  padding: 9px 0;
  border: none;
  background: transparent;
  color: #9a9da6;
  font-family: var(--game-font);
  font-size: 14px;
  cursor: pointer;
  letter-spacing: 2px;
  border-bottom: 2px solid transparent;
  margin-bottom: -1px;
  transition: color 0.2s;
}
.tab-btn span[data-v-e744d2a1] {
  color: #3a7d8a;
  font-size: 12px;
}
.tab-btn.active[data-v-e744d2a1] {
  color: #2b2f38;
  border-bottom-color: #3a7d8a;
}
.tab-btn[data-v-e744d2a1]:hover:not(.active) {
  color: #5a5e68;
}
.login-form[data-v-e744d2a1] {
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.input-group[data-v-e744d2a1] {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.input-group label[data-v-e744d2a1] {
  font-family: var(--game-font);
  font-size: 12px;
  color: #6a6d76;
  letter-spacing: 2px;
}
.input-group input[data-v-e744d2a1] {
  padding: 11px 13px;
  background: rgba(255, 255, 255, 0.75);
  border: 1px solid #dadce2;
  border-radius: 4px;
  color: #2b2f38;
  font-family: var(--game-font);
  font-size: 14px;
  outline: none;
  letter-spacing: 1px;
  transition: border-color 0.2s, box-shadow 0.2s;
}
.input-group input[data-v-e744d2a1]:focus {
  border-color: #6b8cce;
  box-shadow: 0 0 0 3px rgba(107, 140, 206, 0.18);
}
.input-group input[data-v-e744d2a1]::placeholder {
  color: #aab0b8;
  letter-spacing: 1px;
}
.error-msg[data-v-e744d2a1] {
  font-family: var(--game-font);
  font-size: 12px;
  color: #c0392b;
  text-align: center;
  margin: 0;
  padding: 6px;
  background: rgba(192, 57, 43, 0.07);
  border-radius: 4px;
}
.submit-btn[data-v-e744d2a1] {
  padding: 13px 0;
  margin-top: 4px;
  background: #2b2f38;
  border: 1px solid #23262c;
  color: #f6f3ec;
  font-family: var(--game-font);
  font-size: 16px;
  font-weight: 500;
  letter-spacing: 4px;
  cursor: pointer;
  border-radius: 4px;
  transition: background 0.2s;
}
.submit-btn[data-v-e744d2a1]:hover {
  background: #3a3e46;
}
.submit-btn[data-v-e744d2a1]:active {
  background: #1e2127;
}
.submit-btn[data-v-e744d2a1]:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}
.remember-checkbox[data-v-e744d2a1] {
  display: flex;
  align-items: center;
  gap: 6px;
  cursor: pointer;
  font-family: var(--game-font);
  font-size: 12px;
  color: #6a6d76;
  letter-spacing: 1px;
  user-select: none;
}
.remember-checkbox input[type="checkbox"][data-v-e744d2a1] {
  width: 14px;
  height: 14px;
  accent-color: #6b8cce;
  cursor: pointer;
}

@font-face {
  font-family: 'GameFont';
  src: url('/fonts/VonwaonBitmap-16px.ttf') format('truetype');
}
.zone-fullscreen[data-v-1df7e897] {
  position: absolute;
  top: 0; left: 0; width: 100%; height: 100%;
  z-index: 50;
  background-size: 100% 100%; background-repeat: no-repeat; background-position: center;
  display: flex; flex-direction: column; overflow: hidden;
}
.zone-header[data-v-1df7e897] {
  display: flex; align-items: center; justify-content: center;
  padding: 14px 20px; flex-shrink: 0; position: relative;
}
.zone-title[data-v-1df7e897] { font-family: var(--game-font); font-size: 18px; color: #ffd700; text-shadow: 0 1px 4px rgba(0,0,0,0.9);
}
.zone-body[data-v-1df7e897] {
  flex: 1; padding: 0 20px 20px; overflow-y: auto;
  position: relative; margin-top: 10%;
}
.zone-list[data-v-1df7e897] {
  display: flex; flex-direction: column; gap: 12px;
}
.zone-card[data-v-1df7e897] {
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 16px; background: rgba(0,0,0,0.35); border: 1px solid #8b7355;
  border-radius: 6px; cursor: pointer; transition: all 0.15s;
}
.zone-card[data-v-1df7e897]:hover { border-color: #ffd700; background: rgba(0,0,0,0.45);
}
.zone-card.selected[data-v-1df7e897] { border-color: #ffd700; background: rgba(255,215,0,0.08); box-shadow: 0 0 8px rgba(255,215,0,0.2);
}
.zone-left[data-v-1df7e897] { display: flex; flex-direction: column; gap: 4px;
}
.zone-name[data-v-1df7e897] { color: #fff; font-size: 16px; font-family: var(--game-font);
}
.zone-tag[data-v-1df7e897] { color: #7cff7c; font-size: 11px;
}
.zone-status[data-v-1df7e897] { display: flex; align-items: center; gap: 6px;
}
.status-dot[data-v-1df7e897] { width: 8px; height: 8px; border-radius: 50%;
}
.dot-流畅[data-v-1df7e897] { background: #7cff7c;
}
.dot-繁忙[data-v-1df7e897] { background: #ffd700;
}
.dot-爆满[data-v-1df7e897] { background: #ff6666;
}
.status-text[data-v-1df7e897] { font-size: 12px;
}
.dot-流畅 + .status-text[data-v-1df7e897] { color: #7cff7c;
}
.dot-繁忙 + .status-text[data-v-1df7e897] { color: #ffd700;
}
.dot-爆满 + .status-text[data-v-1df7e897] { color: #ff6666;
}

.character-area[data-v-3d30a5ad] {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  z-index: 10;
}
.char-bg[data-v-3d30a5ad] {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url('/czjm/%E9%80%9A%E7%94%A8%E7%95%8C%E9%9D%A2.png') center/100% 100% no-repeat;
}
.corner[data-v-3d30a5ad] {
  position: absolute;
  width: 30px;
  height: auto;
  image-rendering: pixelated;
  z-index: 2;
}
.corner-zs[data-v-3d30a5ad] { top: 0; left: 0;
}
.corner-ys[data-v-3d30a5ad] { top: 0; right: 0;
}
.corner-zx[data-v-3d30a5ad] { bottom: 0; left: 0;
}
.corner-yx[data-v-3d30a5ad] { bottom: 0; right: 0;
}
.char-content[data-v-3d30a5ad] {
  position: relative;
  z-index: 3;
  width: 90%;
  padding: 20px 16px 0;
  display: flex;
  flex-direction: column;
  height: 100%;
}
.main-title[data-v-3d30a5ad] {
  text-align: center;
  font-family: var(--game-font);
  font-size: 24px;
  color: #e8c84a;
  text-shadow:
    0 0 8px rgba(200, 150, 30, 0.4),
    0 2px 0 #5a3a0a;
  letter-spacing: 4px;
  margin: 0;
  padding-bottom: 20px;
}
.divider[data-v-3d30a5ad] {
  width: 100%;
  height: 2px;
  background: linear-gradient(90deg,
    transparent 0%,
    rgba(200, 150, 40, 0.3) 20%,
    #c9a84c 50%,
    rgba(200, 150, 40, 0.3) 80%,
    transparent 100%
  );
  flex-shrink: 0;
}
.top-divider[data-v-3d30a5ad] {
  margin-bottom: 14px;
}
.bottom-divider[data-v-3d30a5ad] {
  margin-top: 14px;
  margin-bottom: 8px;
}
.content-body[data-v-3d30a5ad] {
  flex: 1;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
}
.character-list[data-v-3d30a5ad] {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  margin-bottom: 10px;
}
.slots-wrapper[data-v-3d30a5ad] {
  border: 2px solid #1AA8BE;
  padding: 12px;
  margin-bottom: 15%;
}
.slot-grid[data-v-3d30a5ad] {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
}
.character-card[data-v-3d30a5ad] {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  aspect-ratio: 1 / 1;
  padding: 0;
  background: #10515A;
  border: 1px solid #1a8eac;
  cursor: pointer;
  transition: all 0.2s;
}
.character-card.selected[data-v-3d30a5ad] {
  border-color: #c9a84c;
  background: #19A7B5;
  box-shadow: 0 0 10px rgba(200, 150, 40, 0.3);
}
.character-card[data-v-3d30a5ad]:hover {
  border-color: #c9a84c;
  background: #19A7B5;
  box-shadow: 0 0 10px rgba(200, 150, 40, 0.12);
}
.character-card[data-v-3d30a5ad]:active {
  transform: scale(0.98);
}
.char-sprite[data-v-3d30a5ad] {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 6px;
  box-sizing: border-box;
}
.empty-text[data-v-3d30a5ad] {
  font-family: var(--game-font);
  font-size: 16px;
  color: #f5d15f;
}
.sprite-img[data-v-3d30a5ad] {
  width: 100%;
  height: 100%;
  object-fit: contain;
  image-rendering: pixelated;
}
.char-info-box[data-v-3d30a5ad] {
  border: 2px solid #d4a76a;
  padding: 12px 14px;
  margin-bottom: 10px;
  min-height: 50%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 6px;
  background: #8b6239;
  box-shadow:
    inset 0 0 0 1px #5a3a1b,
    inset 2px 2px 0 rgba(255,255,255,0.1),
    inset -2px -2px 0 rgba(0,0,0,0.15);
}
.info-row[data-v-3d30a5ad] {
  display: flex;
  align-items: center;
}
.info-label[data-v-3d30a5ad] {
  font-family: var(--game-font);
  font-size: 13px;
  color: #f5d15f;
  width: 48px;
}
.info-value[data-v-3d30a5ad] {
  font-family: var(--game-font);
  font-size: 13px;
  color: #e0d0a0;
}
.info-muted[data-v-3d30a5ad] {
  color: #e0d0a0;
}
.info-empty[data-v-3d30a5ad] {
  font-family: var(--game-font);
  font-size: 13px;
  color: #f5d15f;
  text-align: center;
}
.dialog-overlay[data-v-3d30a5ad] {
  position: fixed;
  top: -20%;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.6);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 200;
}
.dialog-panel[data-v-3d30a5ad] {
  padding: 30px 28px 20px;
  width: 260px;
  text-align: center;
}
.dialog-title[data-v-3d30a5ad] {
  font-family: var(--game-font);
  font-size: 16px;
  color: #e8c84a;
  letter-spacing: 3px;
  margin: 0 0 8px;
}
.dialog-char-name[data-v-3d30a5ad] {
  font-family: var(--game-font);
  font-size: 18px;
  color: #fff;
  margin: 0 0 16px;
}
.dialog-warn[data-v-3d30a5ad] {
  font-family: var(--game-font);
  font-size: 12px;
  color: #ffcccc;
  margin: 0 0 16px;
}
.dialog-buttons[data-v-3d30a5ad] {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-bottom: 12px;
}
.dialog-btn[data-v-3d30a5ad] {
  padding: 10px 0;
  font-family: var(--game-font);
  font-size: 14px;
  border: 2px solid;
  cursor: pointer;
  letter-spacing: 2px;
  transition: all 0.15s;
}
.dialog-btn.focused[data-v-3d30a5ad] {
  filter: brightness(1.3);
  box-shadow: 0 0 12px rgba(200, 150, 40, 0.5);
  transform: scale(1.03);
}
.dialog-enter[data-v-3d30a5ad] {
  background: #19A7B5;
  border-color: #dab860;
  color: #e0d0a0;
}
.dialog-enter[data-v-3d30a5ad]:active {
  transform: translateY(1px);
}
.dialog-delete[data-v-3d30a5ad] {
  background: rgba(200, 50, 50, 0.15);
  border-color: #c04040;
  color: #e06060;
}
.dialog-delete[data-v-3d30a5ad]:active {
  background: rgba(200, 50, 50, 0.25);
}
.dialog-cancel[data-v-3d30a5ad] {
  background: rgba(200, 150, 40, 0.15);
  border-color: #c9a84c;
  color: #e8c84a;
}
.dialog-cancel[data-v-3d30a5ad]:active {
  background: rgba(200, 150, 40, 0.25);
}
.dialog-danger[data-v-3d30a5ad] {
  background: linear-gradient(180deg, #c04040 0%, #802020 100%);
  border-color: #e06060;
  color: #fff;
}
.dialog-danger[data-v-3d30a5ad]:active:not(:disabled) {
  transform: translateY(1px);
}
.dialog-danger[data-v-3d30a5ad]:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}
.dialog-close[data-v-3d30a5ad] {
  background: none;
  border: none;
  font-family: var(--game-font);
  font-size: 12px;
  color: #e0d0a0;
  cursor: pointer;
  letter-spacing: 1px;
}
.dialog-close[data-v-3d30a5ad]:hover {
  color: #c9a84c;
}

.character-area[data-v-b42b6be5] {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  z-index: 10;
}
.char-bg[data-v-b42b6be5] {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url('/czjm/%E9%80%9A%E7%94%A8%E7%95%8C%E9%9D%A2.png') center/100% 100% no-repeat;
  filter: brightness(0.7);
}
.corner[data-v-b42b6be5] {
  position: absolute;
  width: 30px;
  height: auto;
  image-rendering: pixelated;
  z-index: 2;
}
.corner-zs[data-v-b42b6be5] { top: 0; left: 0;
}
.corner-ys[data-v-b42b6be5] { top: 0; right: 0;
}
.corner-zx[data-v-b42b6be5] { bottom: 0; left: 0;
}
.corner-yx[data-v-b42b6be5] { bottom: 0; right: 0;
}
.char-content[data-v-b42b6be5] {
  position: relative;
  z-index: 3;
  width: 90%;
  padding: 20px 16px 0;
  display: flex;
  flex-direction: column;
  height: 100%;
}
.main-title[data-v-b42b6be5] {
  text-align: center;
  font-family: var(--game-font);
  font-size: 24px;
  color: #e8c84a;
  text-shadow:
    0 0 8px rgba(200, 150, 30, 0.4),
    0 2px 0 #5a3a0a;
  letter-spacing: 4px;
  margin: 0;
  padding-bottom: 20px;
}
.divider[data-v-b42b6be5] {
  width: 100%;
  height: 2px;
  background: linear-gradient(90deg,
    transparent 0%,
    rgba(200, 150, 40, 0.3) 20%,
    #c9a84c 50%,
    rgba(200, 150, 40, 0.3) 80%,
    transparent 100%
  );
  flex-shrink: 0;
}
.top-divider[data-v-b42b6be5] {
  margin-bottom: 14px;
}
.bottom-divider[data-v-b42b6be5] {
  margin-top: 14px;
  margin-bottom: 8px;
}
.content-body[data-v-b42b6be5] {
  flex: 1;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
}
.name-row[data-v-b42b6be5] {
  display: flex;
  align-items: center;
  margin-bottom: 16px;
  gap: 8px;
}
.name-label[data-v-b42b6be5] {
  font-family: var(--game-font);
  font-size: 14px;
  color: #f5d15f;
  white-space: nowrap;
}
.name-input[data-v-b42b6be5] {
  flex: 1;
  padding: 8px 12px;
  font-family: var(--game-font);
  font-size: 13px;
  background: rgba(10, 10, 20, 0.7);
  border: 1px solid #5a4020;
  color: #e0d0a0;
  outline: none;
}
.name-input[data-v-b42b6be5]:focus {
  border-color: #c9a84c;
  box-shadow: 0 0 6px rgba(200, 150, 30, 0.2);
}
.name-input[data-v-b42b6be5]::placeholder {
  color: #555;
}
.create-main[data-v-b42b6be5] {
  display: flex;
  gap: 16px;
  margin-bottom: 16px;
}
.preview-box[data-v-b42b6be5] {
  width: 40%;
  aspect-ratio: 1 / 1;
  border: 2px solid #1AA8BE;
  background: #10515A;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  overflow: hidden;
}
.preview-placeholder[data-v-b42b6be5] {
  font-family: var(--game-font);
  font-size: 16px;
  color: #3a6a7a;
}
.preview-sprite-img[data-v-b42b6be5] {
  width: 100%;
  height: 100%;
  object-fit: contain;
  image-rendering: pixelated;
}
.selectors[data-v-b42b6be5] {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 12px;
  justify-content: center;
}
.select-row[data-v-b42b6be5] {
  display: flex;
  align-items: center;
  gap: 6px;
}
.select-label[data-v-b42b6be5] {
  font-family: var(--game-font);
  font-size: 13px;
  color: #f5d15f;
  white-space: nowrap;
  width: 42px;
}
.game-select[data-v-b42b6be5] {
  flex: 1;
  padding: 8px 10px;
  font-family: var(--game-font);
  font-size: 13px;
  background: rgba(10, 10, 20, 0.7);
  border: 1px solid #5a4020;
  color: #e0d0a0;
  outline: none;
  cursor: pointer;
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%23c9a84c'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 8px center;
  padding-right: 24px;
}
.game-select[data-v-b42b6be5]:focus {
  border-color: #c9a84c;
  box-shadow: 0 0 6px rgba(200, 150, 30, 0.2);
}
.game-select option[data-v-b42b6be5] {
  background: #1a1a2e;
  color: #e0d0a0;
}
.btn-create-char[data-v-b42b6be5] {
  display: block;
  width: 100%;
  padding: 12px;
  font-family: var(--game-font);
  font-size: 16px;
  color: #e0d0a0;
  background: #1a8eac;
  border: 2px solid #19A7B5;
  cursor: pointer;
  letter-spacing: 4px;
  margin-bottom: 10%;
  transition: all 0.15s;
}
.btn-create-char[data-v-b42b6be5]:active:not(:disabled) {
  transform: translateY(2px);
  box-shadow: 0 2px 0 #6b4c10;
}
.btn-create-char[data-v-b42b6be5]:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}
.char-info-box[data-v-b42b6be5] {
  border: 2px solid #d4a76a;
  padding: 12px 14px;
  min-height: 30%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 6px;
  background: #8b6239;
  box-shadow:
    inset 0 0 0 1px #5a3a1b,
    inset 2px 2px 0 rgba(255,255,255,0.1),
    inset -2px -2px 0 rgba(0,0,0,0.15);
}
.info-row[data-v-b42b6be5] {
  display: flex;
  align-items: center;
  gap: 6px;
}
.info-label[data-v-b42b6be5] {
  font-family: var(--game-font);
  font-size: 13px;
  color: #f5d15f;
  width: 48px;
}
.info-value[data-v-b42b6be5] {
  font-family: var(--game-font);
  font-size: 13px;
  color: #e0d0a0;
}
.info-error[data-v-b42b6be5] {
  font-family: var(--game-font);
  font-size: 13px;
  color: #e94560;
}

@font-face {
  font-family: 'GameFont';
  src: url('/fonts/VonwaonBitmap-16px.ttf') format('truetype');
}
.chat-display[data-v-c7c9754b] {
  position: relative;
  width: 100%;
  height: 100%;
  background: #8b6239;
  border: 2px solid #d4a76a;
  box-shadow:
    inset 0 0 0 1px #5a3a1b,
    inset 2px 2px 0 rgba(255,255,255,0.1),
    inset -2px -2px 0 rgba(0,0,0,0.15);
  cursor: pointer;
  transition: background 0.2s, border-color 0.2s;
}
.chat-display.hidden[data-v-c7c9754b] {
  background: transparent;
  border-bottom-color: transparent;
}
.chat-messages[data-v-c7c9754b] {
  width: 100%;
  height: 100%;
  overflow-y: auto;
  padding: 8px 12px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.chat-messages[data-v-c7c9754b]::-webkit-scrollbar {
  width: 4px;
}
.chat-messages[data-v-c7c9754b]::-webkit-scrollbar-track {
  background: rgba(0, 0, 0, 0.2);
}
.chat-messages[data-v-c7c9754b]::-webkit-scrollbar-thumb {
  background: #8a6948;
  border-radius: 2px;
}
.chat-message[data-v-c7c9754b] {
  font-size: 18px;
  line-height: 1.4;
  word-break: break-all;
  font-family: 'GameFont';
  font-weight: bold;
}
.chat-message.system-msg .msg-channel[data-v-c7c9754b],
.chat-message.system-msg .msg-name[data-v-c7c9754b],
.chat-message.system-msg .msg-text[data-v-c7c9754b] {
  color: #ff4444;
  font-weight: bold;
}
.msg-channel[data-v-c7c9754b] {
  margin-right: 4px;
  font-weight: bold;
}
.ch-综合[data-v-c7c9754b] { color: #e8d5a3;
}
.ch-世界[data-v-c7c9754b] { color: #4dc4ff;
}
.ch-私聊[data-v-c7c9754b] { color: #ff69b4;
}
.ch-队伍[data-v-c7c9754b] { color: #44ff88;
}
.ch-宗派[data-v-c7c9754b] { color: #da70d6;
}
.ch-场景[data-v-c7c9754b] { color: #ffaa44;
}
.ch-系统[data-v-c7c9754b] { color: #ff4444;
}
.msg-name[data-v-c7c9754b] {
  color: #ffd700;
  font-weight: bold;
  margin-right: 4px;
}

/* 邪恶值 ≥6：角色名变红 */
.msg-name.evil-name[data-v-c7c9754b] {
  color: #ff3b3b;
}
.msg-text[data-v-c7c9754b] {
  color: #f5deb3;
}

/* 聊天消息里的附件物品文本：紫色高亮（与聊天面板一致） */
.msg-item-link[data-v-c7c9754b] {
  color: #b388ff;
  font-weight: bold;
}
.no-messages[data-v-c7c9754b] {
  color: #a08060;
  font-size: 12px;
  text-align: center;
  margin-top: auto;
  margin-bottom: auto;
}

@font-face {
  font-family: 'GameFont';
  src: url('/fonts/VonwaonBitmap-16px.ttf') format('truetype');
}
.picker-fullscreen[data-v-ef6161ee] {
  position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 50;
  background-size: 100% 100%; background-repeat: no-repeat; background-position: center;
  display: flex; flex-direction: column; overflow: hidden; color: #e8d5a3;
  touch-action: manipulation; -webkit-touch-callout: none; -webkit-user-select: none;
  pointer-events: auto;
}
.bag-header[data-v-ef6161ee] { display: flex; align-items: center; justify-content: center; padding: 20px 20px; flex-shrink: 0; position: relative;
}
.bag-title[data-v-ef6161ee] { font-family: 'GameFont'; font-size: 22px; color: #ffd700; text-shadow: 0 1px 4px rgba(0,0,0,0.9);
}
.close-btn[data-v-ef6161ee] { position: absolute; right: 20px; width: 32px; height: 32px; border: 1px solid #8b7355; border-radius: 4px; background: rgba(0,0,0,0.4); color: #ccc; font-size: 18px; cursor: pointer; font-family: 'GameFont';
}
.bag-middle[data-v-ef6161ee] { flex: 1 1 auto; display: flex; flex-direction: column; padding: 12px 12px; overflow: hidden;margin-top: 15%;
}
.grid-wrapper[data-v-ef6161ee] { flex: 1; overflow-y: auto; pointer-events: auto;
}
.item-grid[data-v-ef6161ee] { display: grid; grid-template-columns: repeat(10, 1fr); gap: 2px; pointer-events: auto;
}
.item-slot[data-v-ef6161ee] { aspect-ratio: 1;  background-image: url("/czjm/bb.png"); display: flex; flex-direction: column; align-items: center; justify-content: center; cursor: pointer; position: relative; font-size: 11px; font-family: 'GameFont'; touch-action: manipulation; -webkit-tap-highlight-color: transparent; pointer-events: auto;
}
.item-slot.filled[data-v-ef6161ee] { background: #111;
}
.item-slot.selected[data-v-ef6161ee] { border-color: #fff;
}
.slot-icon[data-v-ef6161ee] { width: 100%; height: 100%; object-fit: contain; font-size: 16px; image-rendering: pixelated;
}
.slot-count[data-v-ef6161ee] { position: absolute; bottom: 1px; right: 2px; font-size: 15px; font-weight: bold; color: #fff; text-shadow: 0 0 3px #000; font-family: 'GameFont';
}
.bag-bottom[data-v-ef6161ee] { flex: 0 0 40%; display: flex; flex-direction: column; padding: 4px 12px; margin-bottom: 15%;}
.detail-area[data-v-ef6161ee] { flex: 1; background: #8b6239; border: 2px solid #d4a76a; box-shadow: inset 0 0 0 1px #5a3a1b, inset 2px 2px 0 rgba(255,255,255,0.1), inset -2px -2px 0 rgba(0,0,0,0.15); padding: 4px 8px; overflow-y: auto; font-size: 11px; font-family: 'GameFont';
}
.detail-name[data-v-ef6161ee] { font-size: 13px; margin-bottom: 2px; display: flex; align-items: center; gap: 6px; flex-wrap: wrap;
}
.name-text[data-v-ef6161ee] { white-space: nowrap; color: #ffd700;
}
.rarity-white[data-v-ef6161ee] { color: #ffffff;
}
.rarity-darkblue[data-v-ef6161ee] { color: #4dc4ff;
}
.rarity-green[data-v-ef6161ee] { color: #7cff7c;
}
.rarity-purple[data-v-ef6161ee] { color: #b388ff;
}
.rarity-orange[data-v-ef6161ee] { color: #ff9800;
}
.detail-stars[data-v-ef6161ee] { display: inline-flex; align-items: center; gap: 1px;
}
.star-wrap[data-v-ef6161ee] { display: inline-flex; align-items: center; line-height: 1;
}
.star[data-v-ef6161ee] { font-size: 14px; text-shadow: 0 0 1px #fff, 0 0 1px #fff, 0 0 1px #fff;
}
.star-full[data-v-ef6161ee] { color: #ffd700;
}
.star-empty[data-v-ef6161ee] { color: #555;
}
.star-half[data-v-ef6161ee] { position: relative; color: #555; text-shadow: none; display: inline-block;
}
.star-half-fill[data-v-ef6161ee] { position: absolute; left: 0; top: 0; overflow: hidden; width: 50%; color: #ffd700; text-shadow: 0 0 1px #fff, 0 0 1px #fff, 0 0 1px #fff;
}
/* 强化星级 / 附魂月亮太阳（public/tubiao 素材） */
.star-img[data-v-ef6161ee] { width: 14px; height: 14px; image-rendering: pixelated;
}
.soul-img[data-v-ef6161ee] { width: 16px; height: 16px; vertical-align: -2px; image-rendering: pixelated; margin-right: 2px;
}
.detail-level[data-v-ef6161ee] { font-size: 15px; margin-left: 4px;
}
.level-num[data-v-ef6161ee] { color: #7cff7c;
}
.subtype-name[data-v-ef6161ee] { color: #ffffff;
}
.inline-stats[data-v-ef6161ee] { display: flex; flex-wrap: wrap; gap: 4px 8px; margin-top: 5px;
}
.detail-row[data-v-ef6161ee] { color: #ffffff;
}
.detail-empty[data-v-ef6161ee] { color: #ffffff; text-align: center; padding-top: 12px;
}
.detail-stats[data-v-ef6161ee] { margin-top: 4px; border-top: 1px solid rgba(139,115,85,0.4); padding-top: 4px;
}
.stat-section-label[data-v-ef6161ee] { color: #ffd700; font-size: 12px; margin-top: 5px;
}
.stat-label[data-v-ef6161ee] { color: #e8d5a3;
}
.stat-value[data-v-ef6161ee] { color: #ffffff; margin-left: 6px;
}
.stat-enhan[data-v-ef6161ee] { color: #7cff7c; margin-left: 1px;
}
.stat-bonus[data-v-ef6161ee] { color: #b388ff; margin-left: 1px;
}

/* ── 物品操作弹窗 ── */
.menu-overlay[data-v-ef6161ee] {
  position: fixed; inset: 0; z-index: 99999;
  background: rgba(0,0,0,0.6);
  display: flex; align-items: center; justify-content: center;
}
.menu-box[data-v-ef6161ee] {

  display: flex; flex-direction: column; align-items: center;
  padding: 20px 28px 18px;
  position: relative;
  margin-top: -50%;
}
.menu-btns[data-v-ef6161ee] {
  display: flex; flex-direction: column; gap: 4px;
  width: 100%;
  align-items: center;
  justify-content: center;
  margin-top: 1%;
}
.menu-btn[data-v-ef6161ee] {
  width: 100%; padding: 8px 30px;
  background: #735131;
  border: 1px solid #ffd700;
  border-radius: 0;
  color: #f5d15f;
  font-family: 'GameFont'; font-size: 12px; letter-spacing: 2px;
  cursor: pointer; outline: none;
  transition: all 0.15s;
}
.menu-btn[data-v-ef6161ee]:hover {
  background: linear-gradient(180deg, #5a4a3a, #4a3a2a);
  border-color: #c9a84c;
  transform: translateY(-1px);
}
.menu-btn[data-v-ef6161ee]:active { transform: translateY(0);
}
.menu-btn-disabled[data-v-ef6161ee] { color: #f5d15f !important; cursor: not-allowed !important;
}
.menu-btn-disabled[data-v-ef6161ee]:hover { background: none !important;
}
.btn-return[data-v-ef6161ee] { margin-top: 2px;
}

@font-face {
  font-family: 'GameFont';
  src: url('/fonts/VonwaonBitmap-16px.ttf') format('truetype');
}
.compose-panel[data-v-e1584f0b] {
  display: flex;
  flex-direction: column;
  gap: 8px;
  flex: 1;
  font-family: 'GameFont';
  min-height: 0;
}
.compose-tabs[data-v-e1584f0b] {
  display: flex;
  gap: 8px;
  margin-top: 34px;
}
.tab-btn[data-v-e1584f0b] {
  padding: 4px 14px;
  border: 1px solid rgba(139, 115, 85, 0.4);
  border-radius: 3px;
  background: rgba(0, 0, 0, 0.4);
  color: #aaa;
  cursor: pointer;
  font-family: 'GameFont';
  font-size: 14px;
}
.tab-btn.active[data-v-e1584f0b] {
  background: rgba(255, 215, 0, 0.15);
  border-color: #ffd700;
  color: #ffd700;
}
.compose-private-title[data-v-e1584f0b] {
  margin-top: 34px;
  padding: 4px 0;
  font-size: 14px;
  color: #f5deb3;
  text-align: center;
}
.compose-label[data-v-e1584f0b] {
  color: #e8d5a3;
  font-size: 13px;
  letter-spacing: 1px;
  padding: 2px 0;
}
.compose-text[data-v-e1584f0b] {
  width: 100%;
  min-height: 35%;
  box-sizing: border-box;
  background: #8b6239;
  border: 2px solid #d4a76a;
  box-shadow:
    inset 0 0 0 1px #5a3a1b,
    inset 2px 2px 0 rgba(255, 255, 255, 0.1),
    inset -2px -2px 0 rgba(0, 0, 0, 0.15);
  color: #f5deb3;
  font-family: 'GameFont';
  font-size: 14px;
  padding: 8px;
  resize: none;
  outline: none;
  line-height: 1.6;
}
.compose-text[data-v-e1584f0b]::placeholder {
  color: #c9a86a;
}
.compose-row[data-v-e1584f0b] {
  display: flex;
  align-items: center;
  gap: 8px;
}

/* 添加物品按钮：宽度减半（不再 flex:1 占满），右侧留给物品名 */
.compose-btn.item-add-btn[data-v-e1584f0b] {
  flex: 0 0 48%;
  padding: 7px 0;
  font-size: 13px;
}
.picked-items[data-v-e1584f0b] {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}
.picked-item[data-v-e1584f0b] {
  color: #da70d6;
  font-size: 12px;
  white-space: nowrap;
}
.compose-emoji-row[data-v-e1584f0b] {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  padding: 4px 0;
}
.compose-emoji[data-v-e1584f0b] {
  width: 30px;
  height: 30px;
  box-sizing: border-box;
  border: 1px solid transparent;
  border-radius: 3px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  cursor: pointer;
  transition: all 0.15s;
}
.compose-emoji[data-v-e1584f0b]:hover {
  border-color: #ffd700;
  background: rgba(255, 215, 0, 0.12);
}
.compose-emoji[data-v-e1584f0b]:active {
  background: rgba(255, 215, 0, 0.28);
  transform: scale(0.9);
}
.compose-actions[data-v-e1584f0b] {
  display: flex;
  gap: 12px;
  justify-content: center;
  margin-top: auto;
  padding-bottom: 4px;
}

/* 未加入队伍弹窗（统一确认弹窗样式：confirm-dialog pixel-dialog-box，同 GameUI 离队确认） */
.confirm-overlay[data-v-e1584f0b] {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.55);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 9999;
}
.confirm-dialog[data-v-e1584f0b] {
  padding: 30px 40px 20px;
  text-align: center;
}
.confirm-title[data-v-e1584f0b] {
  font-family: 'GameFont';
  font-size: 16px;
  color: #ffd700;
  font-weight: bold;
  margin-bottom: 10px;
  letter-spacing: 2px;
}
.confirm-text[data-v-e1584f0b] {
  font-family: 'GameFont';
  font-size: 15px;
  color: #f0e6d3;
  margin-bottom: 20px;
}
.confirm-btns[data-v-e1584f0b] {
  display: flex;
  gap: 16px;
  justify-content: center;
}
.confirm-btn[data-v-e1584f0b] {
  padding: 8px 24px;
  border: 1px solid;
  border-radius: 3px;
  font-family: 'GameFont';
  font-size: 13px;
  cursor: pointer;
  transition: all 0.2s;
}
.confirm-yes[data-v-e1584f0b] {
  background: rgba(200, 50, 50, 0.2);
  border-color: #a04040;
  color: #e8b0b0;
}
.confirm-yes[data-v-e1584f0b]:hover {
  background: rgba(200, 50, 50, 0.45);
  color: #fff;
}
.confirm-no[data-v-e1584f0b] {
  background: rgba(80, 80, 90, 0.2);
  border-color: #707080;
  color: #c0c0d0;
}
.attach-list[data-v-e1584f0b] {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-bottom: 16px;
  max-height: 220px;
  overflow-y: auto;
}
.attach-item[data-v-e1584f0b] {
  padding: 6px 14px;
  background: rgba(0, 0, 0, 0.35);
  border: 1px solid rgba(139, 115, 85, 0.4);
  border-radius: 3px;
  color: #da70d6;
  font-family: 'GameFont';
  font-size: 14px;
  cursor: pointer;
  transition: all 0.15s;
}
.attach-item[data-v-e1584f0b]:hover {
  border-color: #ffd700;
  color: #ffd700;
}
.compose-btn[data-v-e1584f0b] {
  width: 132px;
  padding: 5px 0;
  background: #8b6239;
  border: 2px solid #d4a76a;
  box-shadow:
    inset 0 0 0 1px #5a3a1b,
    inset 2px 2px 0 rgba(255, 255, 255, 0.1),
    inset -2px -2px 0 rgba(0, 0, 0, 0.15);
  color: #f5deb3;
  font-family: 'GameFont';
  font-size: 13px;
  font-weight: bold;
  letter-spacing: 2px;
  cursor: pointer;
  transition: all 0.15s;
}
.compose-btn[data-v-e1584f0b]:hover {
  filter: brightness(1.15);
}
.compose-btn.primary[data-v-e1584f0b] {
  background: #19A7B5;
}

@font-face {
  font-family: 'GameFont';
  src: url('/fonts/VonwaonBitmap-16px.ttf') format('truetype');
}
.chat-panel[data-v-e80103b4] {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 50;
  background-image: url('/czjm/%E9%80%9A%E7%94%A8%E7%95%8C%E9%9D%A2.png');
  background-size: 100% 100%;
  background-repeat: no-repeat;
  display: flex;
  flex-direction: column;
  font-family: 'GameFont';
  box-sizing: border-box;
  padding: 20px 16px 12px;
}
.chat-header[data-v-e80103b4] {
  display: flex; align-items: center; justify-content: center;
  padding: 0px 12px; position: relative;
  color: #ffd700; font-size: 20px; font-weight: bold;
  text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.8);
}
.chat-header .close-btn[data-v-e80103b4] {
  position: absolute; right: 8px;
  width: 28px; height: 28px; border: 1px solid #8b7355; border-radius: 4px;
  background: rgba(0,0,0,0.4); color: #ccc; font-size: 14px;
  cursor: pointer; font-family: 'GameFont'; line-height: 1;
}

/* 原版频道标签样式 */
.chat-tabs[data-v-e80103b4] {
  display: flex;
  gap: 4px;
  flex-wrap: wrap;
  margin-top: 38px;
}
.chat-tab[data-v-e80103b4] {
  padding: 4px 10px;
  font-size: 13px;
  color: #c0a878;
  cursor: pointer;
  border: 1px solid #5a4a2a;
  border-radius: 3px;
  background: rgba(0, 0, 0, 0.3);
  transition: all 0.2s;
}
.chat-tab[data-v-e80103b4]:hover {
  color: #ffd700;
  border-color: #ffd700;
}
.chat-tab.active[data-v-e80103b4] {
  color: #ffd700;
  border-color: #ffd700;
  background: rgba(255, 215, 0, 0.15);
}
.chat-messages[data-v-e80103b4] {
  flex: 1;
  max-height: 80%;
  overflow-y: auto;
  padding: 8px;
  display: flex;
  flex-direction: column;
  gap: 4px;
  background: rgba(0, 0, 0, 0.25);
  border: 1px solid #5a4a2a;
  border-radius: 4px;
  margin: 4px 0;
}
.chat-messages[data-v-e80103b4]::-webkit-scrollbar {
  width: 4px;
}
.chat-messages[data-v-e80103b4]::-webkit-scrollbar-thumb {
  background: #8a6948;
  border-radius: 2px;
}
.chat-message[data-v-e80103b4] {
  font-size: 18px;
  line-height: 1.5;
  word-break: break-all;
  font-weight: bold;
}
.chat-message.clickable[data-v-e80103b4] {
  cursor: pointer;
}
.chat-message.clickable[data-v-e80103b4]:hover {
  background: rgba(255, 215, 0, 0.08);
}

/* 点击选中的消息：高亮背景，提示当前操作对象 */
.chat-message.selected[data-v-e80103b4] {
  background: rgba(255, 215, 0, 0.2);
  box-shadow: inset 2px 0 0 #ffd700;
}
.chat-message.system-msg .msg-channel[data-v-e80103b4],
.chat-message.system-msg .msg-name[data-v-e80103b4],
.chat-message.system-msg .msg-text[data-v-e80103b4] {
  color: #ff4444;
  font-weight: bold;
}
/* 聊天消息里的附件物品文本：紫色高亮 */
.msg-item-link[data-v-e80103b4] {
  color: #b388ff;
  font-weight: bold;
}
.msg-channel[data-v-e80103b4] {
  margin-right: 4px;
  font-weight: bold;
}
.ch-综合[data-v-e80103b4] { color: #e8d5a3;
}
.ch-世界[data-v-e80103b4] { color: #4dc4ff;
}
.ch-私聊[data-v-e80103b4] { color: #ff69b4;
}
.ch-队伍[data-v-e80103b4] { color: #44ff88;
}
.ch-宗派[data-v-e80103b4] { color: #da70d6;
}
.ch-场景[data-v-e80103b4] { color: #ffaa44;
}
.ch-系统[data-v-e80103b4] { color: #ff4444;
}
.msg-name[data-v-e80103b4] {
  color: #ffd700;
  font-weight: bold;
}

/* 邪恶值 ≥6：角色名变红 */
.msg-name.evil-name[data-v-e80103b4] {
  color: #ff3b3b;
}
.msg-text[data-v-e80103b4] {
  color: #f5deb3;
}
.no-messages[data-v-e80103b4] {
  color: #a08060;
  font-size: 13px;
  text-align: center;
  margin: auto 0;
}

/* 点击消息操作菜单（复用背包物品弹窗样式：.pixel-action-box / .pa-corner / .menu-btn 定义于 assets/detail-card.css 全局样式） */
.menu-overlay[data-v-e80103b4] {
  position: absolute;
  top: 0; left: 0;
  width: 100%; height: 100%;
  background: rgba(0, 0, 0, 0.5);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 60;
}
.menu-box[data-v-e80103b4] {
  width: 260px;
  display: flex; flex-direction: column; align-items: center;
  padding: 20px 28px 18px;
  position: relative;
}
.menu-btns[data-v-e80103b4] {
  display: flex; flex-direction: column; gap: 4px;
  width: 100%;
  justify-content: center;
  margin-top: 1%;
}
.menu-btn[data-v-e80103b4] {
  width: 100%; padding: 8px 30px;
  background: #735131;
  border: 1px solid #ffd700;
  border-radius: 0;
  color: #f5d15f;
  font-family: 'GameFont'; font-size: 12px; letter-spacing: 2px;
  cursor: pointer; outline: none;
  transition: all 0.15s;
}
.menu-btn[data-v-e80103b4]:hover {
  background: linear-gradient(180deg, #5a4a3a, #4a3a2a);
  border-color: #c9a84c;
  transform: translateY(-1px);
}
.menu-btn[data-v-e80103b4]:active { transform: translateY(0);
}
.btn-return[data-v-e80103b4] { margin-top: 2px;
}

/* 未加入队伍弹窗（统一确认弹窗样式：confirm-dialog pixel-dialog-box，同 GameUI 离队确认） */
.confirm-overlay[data-v-e80103b4] {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.55);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 9999;
}
.confirm-dialog[data-v-e80103b4] {
  padding: 30px 40px 20px;
  text-align: center;
}
.confirm-title[data-v-e80103b4] {
  font-family: 'GameFont';
  font-size: 16px;
  color: #ffd700;
  font-weight: bold;
  margin-bottom: 10px;
  letter-spacing: 2px;
}
.confirm-text[data-v-e80103b4] {
  font-family: 'GameFont';
  font-size: 15px;
  color: #f0e6d3;
  margin-bottom: 20px;
}
.confirm-btns[data-v-e80103b4] {
  display: flex;
  gap: 16px;
  justify-content: center;
}
.confirm-btn[data-v-e80103b4] {
  padding: 8px 24px;
  border: 1px solid;
  border-radius: 3px;
  font-family: 'GameFont';
  font-size: 13px;
  cursor: pointer;
  transition: all 0.2s;
}
.confirm-yes[data-v-e80103b4] {
  background: rgba(200, 50, 50, 0.2);
  border-color: #a04040;
  color: #e8b0b0;
}
.confirm-yes[data-v-e80103b4]:hover {
  background: rgba(200, 50, 50, 0.45);
  color: #fff;
}
.confirm-no[data-v-e80103b4] {
  background: rgba(80, 80, 90, 0.2);
  border-color: #707080;
  color: #c0c0d0;
}
.confirm-no[data-v-e80103b4]:hover {
  background: rgba(80, 80, 90, 0.45);
  color: #fff;
}

/* 附件物品列表 */
.attach-list[data-v-e80103b4] {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-bottom: 16px;
  max-height: 220px;
  overflow-y: auto;
}
.attach-item[data-v-e80103b4] {
  padding: 6px 14px;
  background: rgba(0, 0, 0, 0.35);
  border: 1px solid rgba(139, 115, 85, 0.4);
  border-radius: 3px;
  color: #da70d6;
  font-family: 'GameFont';
  font-size: 14px;
  cursor: pointer;
  transition: all 0.15s;
}
.attach-item[data-v-e80103b4]:hover {
  border-color: #ffd700;
  color: #ffd700;
}

.virtual-keyboard[data-v-5061a1fd] {
  position: relative;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 8px 15px;
  box-sizing: border-box;
}
.numpad[data-v-5061a1fd] {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: repeat(4, 1fr);
  gap: 8px;
  width: 50%;
  height: 95%;
}
.num-btn[data-v-5061a1fd] {
  background: linear-gradient(145deg, #4a4a6e, #3a3a5e);
  border: 2px solid #6a6a8e;
  border-radius: 6px;
  color: #fff;
  font-size: clamp(12px, 2.5vw, 16px);
  font-weight: bold;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  user-select: none;
  touch-action: manipulation;
  transition: all 0.1s ease;
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.3);
  min-width: 0;
}
.num-btn[data-v-5061a1fd]:active {
  background: linear-gradient(145deg, #5a5a7e, #4a4a6e);
  transform: scale(0.95);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
}
.num[data-v-5061a1fd] {
  pointer-events: none;
}
.dpad[data-v-5061a1fd] {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: repeat(3, 1fr);
  gap: 8px;
  width: 45%;
  height: 95%;
}
.spacer[data-v-5061a1fd] {
  visibility: hidden;
}
.map-text[data-v-5061a1fd] {
  pointer-events: none;
}
.dir-btn[data-v-5061a1fd] {
  background: linear-gradient(145deg, #3a3a5e, #2a2a4e);
  border: 2px solid #5a5a8e;
  border-radius: 8px;
  color: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  user-select: none;
  touch-action: manipulation;
  transition: transform 0.08s ease, filter 0.08s ease, box-shadow 0.08s ease;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
  min-width: 0;
}
.dir-btn.pressed[data-v-5061a1fd] {
  filter: brightness(1.25);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
  transform: scale(0.9);
}
.dir-btn .arrow[data-v-5061a1fd],
.dir-btn .confirm-text[data-v-5061a1fd],
.dir-btn .soft-text[data-v-5061a1fd],
.dir-btn .party-text[data-v-5061a1fd] {
  pointer-events: none;
  margin: 0;
}

/* 防止被全局弹窗样式 detail-card.css 的 .confirm-text（margin-bottom:20px / 米色 / 15px）污染，
   否则 OK 字会被顶偏、不居中 */
.dir-btn .confirm-text[data-v-5061a1fd] {
  font-size: inherit;
  color: inherit;
  line-height: 1;
}
.dir-btn.up[data-v-5061a1fd] {
  font-size: clamp(14px, 2.8vw, 22px);
}
.dir-btn.soft-left[data-v-5061a1fd],
.dir-btn.soft-right[data-v-5061a1fd] {
  font-size: clamp(10px, 1.8vw, 12px);
  background: linear-gradient(145deg, #5a5a7e, #4a4a6e);
  border-color: #7a7a9e;
}
.dir-btn.down[data-v-5061a1fd],
.dir-btn.left[data-v-5061a1fd],
.dir-btn.right[data-v-5061a1fd] {
  font-size: clamp(14px, 2.8vw, 22px);
}
.dir-btn.party-btn[data-v-5061a1fd] {
  font-size: clamp(9px, 1.6vw, 11px);
  background: linear-gradient(145deg, #5a5a7e, #4a4a6e);
  border-color: #7a7a9e;
}
.dir-btn.nearby-btn[data-v-5061a1fd] {
  font-size: clamp(9px, 1.6vw, 11px);
  background: linear-gradient(145deg, #5a5a7e, #4a4a6e);
  border-color: #7a7a9e;
}
.dir-btn.confirm[data-v-5061a1fd] {
  font-size: clamp(12px, 2vw, 14px);
  background: linear-gradient(145deg, #e74c3c, #c0392b);
  border-color: #ff6b5b;
}


.battle-overlay[data-v-7ceb9642] {
  position: absolute;
  inset: 0;
  /* 战斗背景改为透明，露出底层「当前地图」(GameCanvas) 作为背景；
     仅叠一层极淡暗化保证顶部/底部 UI 文字可读性，地图仍清晰可见。
     想让地图更通透可调低此值（0 = 完全透明），想更暗可调高。 */
  background-color: rgba(0, 0, 0, 0.18);
  /* 释放「第二个群体 AOE」技能时平滑切到纯黑，1s 后平滑恢复透出地图 */
  transition: background-color 0.25s ease;
  z-index: 2000;
  display: flex;
  flex-direction: column;
  font-family: 'GameFont', sans-serif;
}

/* 释放每个门派的「第二个群体 AOE 技能」(赤焰火海/翻江倒海/九天神雷/山崩地裂) 与
   「第二个单体技能」(三味真火/怒波斩/怒雷轰/石破天惊) 时，
   战斗背景切黑 1s，让技能特效在纯黑衬托下更有打击感；战斗 UI 与特效仍渲染其上。 */
.battle-overlay.skill-black-bg[data-v-7ceb9642] {
  background-color: #000;
}
.battle-container[data-v-7ceb9642] {
  flex: 1;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  position: relative;
}
.battle-top-bar[data-v-7ceb9642] {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  background: #6D4E31;
  border: 1px solid #ffd700;
  padding: 0;
}
.quickbar-left[data-v-7ceb9642] {
  display: flex;
  gap: 0;
}
.top-bar-right[data-v-7ceb9642] {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0;
  margin-right: 8px;
}
.info-slot[data-v-7ceb9642] {
  width: 48px;
  height: 36px;
  background: rgba(0, 0, 0, 0.4);
  border: 1px solid #ffd700;
  display: flex;
  box-sizing: border-box;
}
.avatar-slot[data-v-7ceb9642] {
  flex-direction: column;
  align-items: center;
  justify-content: center;
  position: relative;
  cursor: default;
  overflow: hidden;
}
.avatar-img[data-v-7ceb9642] {
  width: 200%;
  height: 70%;
  object-fit: cover;
  object-position: center top;
  image-rendering: pixelated;
}
.avatar-level[data-v-7ceb9642] {
  position: absolute;
  bottom: 1px;
  right: 2px;
  font-size: 7px;
  color: #ffd700;
  font-weight: bold;
  line-height: 1;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.9);
}
.stats-slot[data-v-7ceb9642] {
  width: 80px;
  flex-direction: column;
  justify-content: space-between;
  padding: 3px 2px;
  gap: 2px;
  cursor: default;
}
.stat-bar[data-v-7ceb9642] {
  height: 100%;
  transition: width 0.3s ease;
  min-width: 0;
}
.hp-bar[data-v-7ceb9642] {
  background: linear-gradient(90deg, #e74c3c, #c0392b);
}
.mp-bar[data-v-7ceb9642] {
  background: linear-gradient(90deg, #3498db, #2980b9);
}
.battle-hpmp-values[data-v-7ceb9642] {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 2px;
  padding: 0 8px;
}
.hp-value[data-v-7ceb9642] {
  font-size: 11px;
  color: #ffffff;
  line-height: 1;
}
.mp-value[data-v-7ceb9642] {
  font-size: 11px;
  color: #ffffff;
  line-height: 1;
}
.battle-round-bar[data-v-7ceb9642] {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 2px;
  padding: 4px 8px;
  min-height: 44px;
  background: rgba(0, 0, 0, 0.3);
  border: 1px solid #ffd700;
}
.round-text[data-v-7ceb9642] {
  font-size: 13px;
  color: #ffffff;
  letter-spacing: 2px;
}
.turn-banner[data-v-7ceb9642] {
  font-size: 14px;
  color: #ffd700;
  letter-spacing: 2px;
  font-weight: bold;
  text-shadow: 0 0 8px rgba(255, 215, 0, 0.5);
}
.action-banner[data-v-7ceb9642] {
  font-size: 13px;
  color: #ffffff;
  letter-spacing: 1px;
  font-weight: bold;
  text-shadow: 0 0 8px rgba(255, 255, 255, 0.5);
  animation: fadeInOut-7ceb9642 2s ease-in-out;
}
@keyframes fadeInOut-7ceb9642 {
0% { opacity: 0;
}
15% { opacity: 1;
}
75% { opacity: 1;
}
100% { opacity: 0;
}
}

/* ── 技能特效 ── */
.skill-effect-img[data-v-7ceb9642] {
  width: 100%; height: 100%; object-fit: contain; image-rendering: pixelated;
  will-change: transform, opacity;
}
.countdown-text[data-v-7ceb9642] {
  font-size: 12px;
  color: #ffffff;
}

/* ── 中间战场 ── */
.battle-middle[data-v-7ceb9642] {
  flex: 1;
  display: flex;
  align-items: stretch;
  justify-content: center;
  padding: 0 0 4px;
  position: relative;
}
.fighter-side[data-v-7ceb9642] {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 4px;
  transition: transform 0.15s ease;
  min-width: 0;
  position: relative;
}
.monster-side.gap-wide[data-v-7ceb9642] {
  gap: 24px;
}
.player-side.gap-wide[data-v-7ceb9642] {
  gap: 24px;
}
.player-side.dodging[data-v-7ceb9642] {
  animation: dodgeLeft-7ceb9642 0.6s ease-in-out;
}
.player-side > .player-death-img[data-v-7ceb9642] {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  align-items: center;
  justify-content: center;
  width: 70%;
  max-width: 200px;
  aspect-ratio: 2 / 1;
  pointer-events: none;
}
.player-entry[data-v-7ceb9642] {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  position: relative;
  outline: none;
  -webkit-tap-highlight-color: transparent;
}
.player-entry.dead-entry[data-v-7ceb9642] {
  /* opacity: 0.3; */ /* 半透明效果临时注释：查看无透明效果 */
}
.player-entry .player-death-img[data-v-7ceb9642] {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  align-items: center;
  justify-content: center;
  width: 70%;
  max-width: 200px;
  aspect-ratio: 2 / 1;
  pointer-events: none;
}
.player-entry.dead-entry .player-death-img[data-v-7ceb9642] {
  opacity: 1;
}
.player-entry.dodging .fighter-img-wrap[data-v-7ceb9642] {
  animation: dodgeLeft-7ceb9642 0.6s ease-in-out;
}
.player-entry.hit-knockback .fighter-img-wrap[data-v-7ceb9642] {
  animation: hitKnockbackPlayer-7ceb9642 0.3s ease-in-out;
}
.player-bars[data-v-7ceb9642] {
  display: flex;
  flex-direction: column;
  gap: 2px;
  width: 25%;
}

/* 玩家侧名称和血蓝条右移 */
.player-side .fighter-name[data-v-7ceb9642],
.player-entry .fighter-name[data-v-7ceb9642] {
  margin-left: 20px;
  margin-top: 20px;
}
.player-side .player-bars[data-v-7ceb9642],
.player-entry .player-bars[data-v-7ceb9642] {
  /* 血蓝条相对人物中线的水平偏移：调小 → 血蓝条更靠近人物 */
  margin-left: 8px;
  /* 血蓝条与人物头顶的垂直间距：负值越大（如 -20 → -30）→ 人物上移越多，血蓝条越贴头顶 */
  margin-bottom: -20px;
}
.player-bar-track[data-v-7ceb9642] {
  height: 6px;
  background: rgba(0, 0, 0, 0.5);
  border: 1px solid #5a4020;
}
.fighter-img[data-v-7ceb9642] {
  max-width: 100%;
  max-height: 180px;
  object-fit: contain;
  image-rendering: pixelated;
}

/* 怪物 - sprite 600x200 (3帧, 每帧200x200 1:1) */
.monster-img-wrap[data-v-7ceb9642] {
  width: 55%;
  max-width: 80px;
  aspect-ratio: 1 / 1;
  flex-shrink: 0;
  position: relative;
}

/* PVP 对手角色容器：完全匹配玩家侧尺寸 */
.pvp-char-wrap[data-v-7ceb9642] {
  width: 70% !important;
  max-width: 160px !important;
  aspect-ratio: 1 / 1 !important;
  --char-scale: 1.3;
  padding-bottom: 8%;
}
.monster-fighter-img[data-v-7ceb9642] {
  width: 100%;
  height: 100%;
  background-size: 300% 100%;
  background-position: 0 0;
  background-repeat: no-repeat;
  image-rendering: pixelated;
  overflow: hidden;
}
.monster-img-wrap.monster-attacking[data-v-7ceb9642] {
  animation: monsterAttackMove-7ceb9642 0.8s cubic-bezier(0.34, 1.4, 0.64, 1);
  position: relative;
  z-index: 25;
}

/* PVP 对手攻击动画：和玩家攻击一致的 scale 1.3 + 0.7s，用 monster-dx/dy 变量 */
.monster-img-wrap.pvp-char-wrap.monster-attacking[data-v-7ceb9642] {
  animation: pvpAttackMove-7ceb9642 0.7s ease-in-out;
}
@keyframes monsterAttackMove-7ceb9642 {
0% { transform: translate(0, 0) scale(1);
}
15% { transform: translate(var(--monster-dx), var(--monster-dy)) scale(1);
}
88% { transform: translate(var(--monster-dx), var(--monster-dy)) scale(1);
}
100% { transform: translate(0, 0) scale(1);
}
}
@keyframes pvpAttackMove-7ceb9642 {
0% { transform: translate(0, 0);
}
15% { transform: translate(var(--monster-dx), var(--monster-dy));
}
85% { transform: translate(var(--monster-dx), var(--monster-dy));
}
100% { transform: translate(0, 0);
}
}

/* 玩家 - sprite 2000x200 (5帧, 每帧400x200 2:1) */
.fighter-img-wrap[data-v-7ceb9642] {
  width: 70%;
  max-width: 160px;
  aspect-ratio: 1 / 1;
  flex-shrink: 0;
  position: relative;
  /* 角色缩放系数：放大人物模型但不改布局/容器尺寸（transform 不影响 reflow）。
     center 锚点均匀放大，padding-bottom 给底部留空间，避免挤压血条。 */
  --char-scale: 1.3;
  padding-bottom: 8%;
}
.player-fighter-img[data-v-7ceb9642] {
  width: 100%;
  height: 100%;
  object-fit: contain;
  image-rendering: pixelated;
  /* 仅放大玩家侧人物（含组队队友），与 wrap 的突进/逃跑 transform 分层互不干扰。
     center 锚点均匀扩展，padding-bottom 空间防止溢出容器。 */
  transform: scale(var(--char-scale));
  transition: transform 0.2s ease;
}
.fighter-img-wrap.attacking[data-v-7ceb9642] {
  animation: attackMove-7ceb9642 0.8s cubic-bezier(0.34, 1.4, 0.64, 1);
  position: relative;
  z-index: 25;
}

/* 玩家自己普攻：改为 JS 三阶段串行（移动到位 → 播完整普攻帧 → 移动回来），
   用 transition 跟随 --attack-dx/dy，屏蔽旧的一次性 attackMove 动画，
   避免“边走边打 / 没播完就回位”。队友/对手攻击仍走 .attacking 的 attackMove。 */
.fighter-img-wrap.player-lunging[data-v-7ceb9642] {
  transform: translate(var(--attack-dx, 0px), var(--attack-dy, 0px));
  transition: transform 0.22s cubic-bezier(0.34, 1.4, 0.64, 1);
}
.fighter-img-wrap.player-lunging.attacking[data-v-7ceb9642] {
  animation: none;
}
@keyframes attackMove-7ceb9642 {
0% { transform: translate(0, 0) scale(1);
}
15% { transform: translate(var(--attack-dx), var(--attack-dy)) scale(1);
}
90% { transform: translate(var(--attack-dx), var(--attack-dy)) scale(1);
}
100% { transform: translate(0, 0) scale(1);
}
}
.fighter-img-wrap.fleeing[data-v-7ceb9642] {
  animation: fleeRight-7ceb9642 0.6s ease-in forwards;
}
@keyframes fleeRight-7ceb9642 {
0% { transform: translate(0, 0) scale(1); opacity: 1;
}
100% { transform: translate(300px, 0) scale(0.6); opacity: 0;
}
}
.fighter-name[data-v-7ceb9642] {
  font-size: 15px;
  font-weight: bold;
  font-family: 'GameFont', sans-serif;
  color: #f5d15f;
  letter-spacing: 1px;
  text-align: center;
  position: relative;
  text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000, 0 0 3px #000;
}

/* 红名：战斗界面玩家名称（自己/队友/PVP 敌方对手） */
.fighter-name.fighter-name-evil[data-v-7ceb9642] {
  color: #ff3b3b !important;
}

/* 穿戴的攻击型法宝展示（人物模型右侧悬浮素材） */
.fabao-show-img[data-v-7ceb9642] {
  position: absolute;
  right: 10px;
  top: 30%;
  transform: translateY(-50%);
  width: 30px;
  z-index: 34;
  pointer-events: none;
  image-rendering: pixelated;
}

/* 敌方/怪物（在屏幕右侧）：法宝显示在其左侧，朝向我方 */
.fabao-show-img-left[data-v-7ceb9642] {
  right: auto;
  left: 10px;
}
.monster-name[data-v-7ceb9642] {
  color: #ffffff;
}

/* ── 操作按钮 ── */
.battle-actions-middle[data-v-7ceb9642] {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  flex-direction: column;
  gap: 4px;
  align-items: center;
  padding: 14px 14px;
  z-index: 20;
  min-width: 80px;
}
.action-btn[data-v-7ceb9642] {
  padding: 6px 30px;
  min-width: 60px;
  background: #735131;
  border: 1px solid #ffd700;
  border-radius: 0;
  color: #f5d15f;
  font-family: 'GameFont', sans-serif;
  font-size: 13px;
  letter-spacing: 2px;
  cursor: pointer;
  transition: all 0.15s;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
  outline: none;
  -webkit-tap-highlight-color: transparent;
}
.action-btn[data-v-7ceb9642]:hover {
  background: linear-gradient(180deg, #5a4a3a, #4a3a2a);
  border-color: #c9a84c;
  transform: translateY(-1px);
}
.action-btn[data-v-7ceb9642]:active {
  transform: translateY(0);
}
.action-btn.disabled[data-v-7ceb9642] {
  opacity: 0.5;
  cursor: not-allowed;
  pointer-events: none;
}
.auto-cancel-bar[data-v-7ceb9642] {
  position: absolute;
  bottom: 8px;
  right: 8px;
  z-index: 50;
}
.cancel-auto-btn[data-v-7ceb9642] {
  padding: 8px 18px;
  background: linear-gradient(180deg, #6a3a2a, #4a2a1a);
  border: 2px solid #e74c3c;
  border-radius: 4px;
  color: #f5d15f;
  font-family: 'GameFont', sans-serif;
  font-size: 13px;
  letter-spacing: 2px;
  cursor: pointer;
  transition: all 0.15s;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.5);
  outline: none;
  -webkit-tap-highlight-color: transparent;
}
.cancel-auto-btn[data-v-7ceb9642]:hover {
  background: linear-gradient(180deg, #8a4a3a, #6a3a2a);
  border-color: #c0392b;
}

/* 战斗中快捷「停止挂机」：青绿色调，与取消自动（红）区分 */
.stop-afk-btn[data-v-7ceb9642] {
  padding: 8px 18px;
  background: linear-gradient(180deg, #1f6f5c, #145043);
  border: 2px solid #2ee66b;
  border-radius: 4px;
  color: #eafff5;
  font-family: 'GameFont', sans-serif;
  font-size: 13px;
  letter-spacing: 2px;
  cursor: pointer;
  transition: all 0.15s;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.5);
  outline: none;
  -webkit-tap-highlight-color: transparent;
}
.stop-afk-btn[data-v-7ceb9642]:hover {
  background: linear-gradient(180deg, #2a8c74, #1f6f5c);
  border-color: #6bffb0;
}

/** 选择目标时的返回按钮 */
.back-btn[data-v-7ceb9642] {
  position: absolute;
  bottom: 12px;
  right: 12px;
  padding: 8px 20px;
  background: linear-gradient(180deg, #3a5a6a, #2a3a4a);
  border: 2px solid #5a8aaa;
  border-radius: 4px;
  color: #f5d15f;
  font-family: 'GameFont', sans-serif;
  font-size: 13px;
  letter-spacing: 2px;
  cursor: pointer;
  z-index: 20;
  transition: all 0.15s;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.5);
  outline: none;
  -webkit-tap-highlight-color: transparent;
}
.back-btn[data-v-7ceb9642]:hover {
  background: linear-gradient(180deg, #4a6a7a, #3a4a5a);
  border-color: #7aaaca;
}

/* ── 技能选择面板（与攻击选择框同款样式） ── */
.skill-panel[data-v-7ceb9642] {
  position: absolute; left: 50%; top: 50%;
  transform: translate(-50%, -50%);
  display: flex; flex-direction: column; gap: 2px; align-items: center;
  padding: 10px 10px; z-index: 30; min-width: 80px;
}
.skill-panel-header[data-v-7ceb9642] {
  display: flex; justify-content: space-between; align-items: center;
  width: 100%; margin-bottom: 4px;
}
.skill-panel-header span[data-v-7ceb9642] {
  color: #ffd700; font-family: 'GameFont', sans-serif; font-size: 12px;
  letter-spacing: 1px; white-space: nowrap;
}
.skill-panel-header .skill-close[data-v-7ceb9642] {
  width: 22px; height: 22px; border: 1px solid #ffd700; border-radius: 0;
  background: #735131; color: #f5d15f; font-size: 12px; cursor: pointer;
  font-family: 'GameFont', sans-serif;
}
.skill-list[data-v-7ceb9642] { display: flex; flex-direction: column; gap: 4px; align-items: center; width: 100%;
}
.skill-item[data-v-7ceb9642] {
  width: 100%; box-sizing: border-box;
  padding: 4px 20px; min-width: 0;
  background: #735131; border: 1px solid #ffd700; border-radius: 0;
  color: #f5d15f; font-family: 'GameFont', sans-serif; font-size: 12px;
  letter-spacing: 1px; cursor: pointer; transition: all 0.15s;
  box-shadow: 0 2px 4px rgba(0,0,0,0.3); outline: none;
  text-align: center;
}
.skill-item[data-v-7ceb9642]:hover { background: linear-gradient(180deg, #5a4a3a, #4a3a2a); border-color: #c9a84c; transform: translateY(-1px);
}
.skill-item.disabled[data-v-7ceb9642] { opacity: 0.4; cursor: not-allowed; pointer-events: none;
}
.skill-name[data-v-7ceb9642] { color: #f5d15f; font-size: 12px;
}
.skill-return[data-v-7ceb9642] { border-color: #e74c3c;
}
.mp-enough[data-v-7ceb9642] { color: #7cff7c;
}
.mp-not-enough[data-v-7ceb9642] { color: #ff6666;
}
.skill-hint[data-v-7ceb9642] { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);
  color: #ffd700; font-family: 'GameFont', sans-serif; font-size: 13px;
  z-index: 40; white-space: nowrap; text-shadow: 0 1px 4px rgba(0,0,0,0.9);
}
.target-hint[data-v-7ceb9642] {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  font-size: 16px;
  color: #ffd700;
  text-align: center;
  letter-spacing: 2px;
  animation: pulse-7ceb9642 0.5s ease-in-out infinite alternate;
  white-space: nowrap;
  z-index: 10;
  pointer-events: none;
  background: rgba(0, 0, 0, 0.6);
  padding: 8px 16px;
  border: 1px solid #ffd700;
}
.monster-side:has(~ .target-hint) .monster-entry[data-v-7ceb9642] {
  filter: none;
}

/* PVP 对手排除选目标时的增亮效果 */
.monster-side:has(~ .target-hint) .monster-entry[data-v-7ceb9642]:has(.pvp-char-wrap) {
  filter: none;
}

/* 怪物条目 */
.monster-entry[data-v-7ceb9642] {
  display: flex;
  flex-direction: column;
  align-items: center;
  cursor: pointer;
  width: 100%;
  position: relative;
  outline: none;
  -webkit-tap-highlight-color: transparent;
}
.monster-entry.monster-entry-dead[data-v-7ceb9642] {
  /* opacity: 0.3; */ /* 半透明效果临时注释：查看无透明效果 */
  pointer-events: none;
}
.monster-entry.dodging .monster-img-wrap[data-v-7ceb9642] {
  animation: dodgeRight-7ceb9642 0.6s ease-in-out;
}
.selected-arrow[data-v-7ceb9642] {
  font-size: 14px;
  color: #ffd700;
  text-align: center;
  animation: pulse-7ceb9642 0.6s ease-in-out infinite alternate;
  line-height: 1;
  height: 16px;
}
.monster-body[data-v-7ceb9642] {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 3px;
  width: 100%;
  position: relative;
}
.monster-death-img[data-v-7ceb9642] {
  position: absolute;
  top: 8px;
  left: 50%;
  transform: translateX(-50%);
  width: 55%;
  max-width: 80px;
  aspect-ratio: 1 / 1;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
}
.death-img[data-v-7ceb9642] {
  width: 100%;
  height: 100%;
  object-fit: contain;
  image-rendering: pixelated;
}
@keyframes pulse-7ceb9642 {
from { opacity: 0.4; transform: translateY(0);
}
to   { opacity: 1; transform: translateY(3px);
}
}
@keyframes dodgeRight-7ceb9642 {
0%   { transform: translateX(0);
}
20%  { transform: translateX(12px);
}
80%  { transform: translateX(12px);
}
100% { transform: translateX(0);
}
}
@keyframes dodgeLeft-7ceb9642 {
0%   { transform: translateX(0);
}
20%  { transform: translateX(-12px);
}
80%  { transform: translateX(-12px);
}
100% { transform: translateX(0);
}
}

/* 被击中击退 */
.monster-entry.hit-knockback .monster-body[data-v-7ceb9642] {
  animation: hitKnockbackMonster-7ceb9642 0.3s ease-in-out;
}
.player-side.hit-knockback[data-v-7ceb9642] {
  animation: hitKnockbackPlayer-7ceb9642 0.3s ease-in-out;
}
@keyframes hitKnockbackMonster-7ceb9642 {
0%   { transform: translateX(0);
}
15%  { transform: translateX(-6px);
}
30%  { transform: translateX(12px);
}
50%  { transform: translateX(-4px);
}
70%  { transform: translateX(6px);
}
100% { transform: translateX(0);
}
}
@keyframes hitKnockbackPlayer-7ceb9642 {
0%   { transform: translateX(0);
}
15%  { transform: translateX(6px);
}
30%  { transform: translateX(-12px);
}
50%  { transform: translateX(4px);
}
70%  { transform: translateX(-6px);
}
100% { transform: translateX(0);
}
}

/** 命中闪白效果 */
.hit-flash[data-v-7ceb9642] {
  animation: hitFlash-7ceb9642 0.3s ease-out;
}
@keyframes hitFlash-7ceb9642 {
0%   { filter: brightness(2) saturate(0);
}
50%  { filter: brightness(1.5);
}
100% { filter: brightness(1) saturate(1);
}
}

/* ── 战斗效果层（绝对定位，覆盖在名称位置上） ── */
.effect-on-target[data-v-7ceb9642] {
  position: absolute;
  left: 50%;
  top: 0;
  transform: translateX(-50%);
  pointer-events: none;
  z-index: 200;
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 2px;
  white-space: nowrap;
}
.damage-num[data-v-7ceb9642] {
  font-size: 30px;
  font-weight: 900;
  font-family: 'GameFont', Arial, sans-serif;
  color: #ff4d4d;
  text-shadow:
    0 0 8px rgba(255, 77, 77, 0.9),
    0 0 18px rgba(220, 30, 30, 0.6),
    3px 3px 0 #000,
    -3px -3px 0 #000,
    3px -3px 0 #000,
    -3px 3px 0 #000;
  letter-spacing: 2px;
  animation: damageFloat-7ceb9642 0.8s ease-out;
}
/* 伤害/回血数字素材图（/czjm/xiaoguo/digits/：shang_0~9 / xue_0~9，回血前带 +） */
.num-digit-img[data-v-7ceb9642] {
  height: 46px;
  width: auto;
  display: inline-block;
  vertical-align: middle;
  image-rendering: pixelated;
}
.damage-num.critical .num-digit-img[data-v-7ceb9642] {
  height: 56px; /* 暴击数字放大 */
}
.damage-num.critical[data-v-7ceb9642] {
  color: #ffcc00;
  font-size: 38px;
  text-shadow:
    0 0 8px rgba(255, 200, 0, 0.9),
    0 0 18px rgba(255, 150, 0, 0.6),
    0 0 30px rgba(255, 80, 0, 0.3),
    3px 3px 0 #000,
    -3px -3px 0 #000,
    3px -3px 0 #000,
    -3px 3px 0 #000;
  letter-spacing: 3px;
  animation: critFloat-7ceb9642 0.8s ease-out;
}
.damage-num.heal[data-v-7ceb9642] {
  color: #4ade80;
  font-size: 30px;
  text-shadow:
    0 0 8px rgba(74, 222, 128, 0.9),
    0 0 18px rgba(34, 197, 94, 0.6),
    3px 3px 0 #000,
    -3px -3px 0 #000,
    3px -3px 0 #000,
    -3px 3px 0 #000;
  letter-spacing: 2px;
  animation: healFloat-7ceb9642 0.8s ease-out;
}
@keyframes healFloat-7ceb9642 {
0%   { transform: translateY(-30px) translateX(0) scale(0.5); opacity: 0;
}
15%  { transform: translateY(-22px) translateX(-5px) scale(1.3); opacity: 1;
}
30%  { transform: translateY(-12px) translateX(4px) scale(1.1);
}
50%  { transform: translateY(-2px) translateX(-2px) scale(1);
}
100% { transform: translateY(34px) translateX(0) scale(0.95); opacity: 0.8;
}
}
@keyframes damageFloat-7ceb9642 {
0%   { transform: translateY(0) translateX(0) scale(0.5); opacity: 0;
}
15%  { transform: translateY(-8px) translateX(-4px) scale(1.3); opacity: 1;
}
30%  { transform: translateY(-16px) translateX(3px) scale(1.1);
}
50%  { transform: translateY(-22px) translateX(-2px) scale(1);
}
100% { transform: translateY(-30px) translateX(0) scale(0.95); opacity: 0.8;
}
}
@keyframes critFloat-7ceb9642 {
0%   { transform: translateY(0) translateX(0) scale(0.3); opacity: 0;
}
15%  { transform: translateY(-12px) translateX(-6px) scale(1.6); opacity: 1;
}
35%  { transform: translateY(-22px) translateX(4px) scale(1.2);
}
55%  { transform: translateY(-30px) translateX(-3px) scale(1);
}
100% { transform: translateY(-40px) translateX(0) scale(0.9); opacity: 0.7;
}
}
/* 闪/暴图片飘字的垂直位置（图片样式见下方 dodge-text/crit-text 定义）：
   200px 大图：margin-top 0px，从名称位置开始覆盖人物 */
.crit-text[data-v-7ceb9642] {
  margin-top: 10px; /* 位置微调 */
  /* 爆字水平右移（transform 不影响同排伤害数字的布局） */
  transform: translateX(70px);
}
.dodge-text[data-v-7ceb9642] {
  margin-top: 0px;
}
/* 怪物独立的闪/暴样式，可单独调整位置 */
.monster-crit-text[data-v-7ceb9642] {
  margin-top: -50px; /* PVE 怪物侧爆字：向上移，单独调这里 */
  /* 爆字水平右移（transform 不影响同排伤害数字的布局） */
  transform: translateX(70px);
}
/* PVP 对手爆字独立位置（与 PVE 怪物区分开，互不影响） */
.pvp-opponent-crit[data-v-7ceb9642] {
  margin-top: 10px; /* PVP 对手侧爆字：单独调这里 */
  transform: translateX(70px);
}
/* 玩家/队友侧暴击：爆字 200px 大图占 flex 位把伤害数字推到右侧——
   伤害数字往左拉回显示（wrap transform 不影响布局，爆字位置不动）；怪物/对手侧完全不动 */
.player-side .crit-num-wrap[data-v-7ceb9642],
.player-entry .crit-num-wrap[data-v-7ceb9642] {
  display: inline-block;
}
.player-side .crit-num-wrap.pull-left[data-v-7ceb9642],
.player-entry .crit-num-wrap.pull-left[data-v-7ceb9642] {
  transform: translateX(-100px);
}
/* 怪物/PVP 对手侧暴击：伤害数字往左偏移（wrap transform 不影响布局/爆字位置） */
.monster-entry .crit-num-wrap[data-v-7ceb9642] {
  display: inline-block;
}
.monster-entry .crit-num-wrap.pull-left[data-v-7ceb9642] {
  transform: translateX(-100px);
}
.monster-dodge-text[data-v-7ceb9642] {
  margin-top: 0px; /* 可调整怪物的闪避图片位置（覆盖怪物身上） */
  /* 怪物/对手在右侧：水平翻转使闪避朝左（"闪"字会镜像，用户已确认接受） */
  transform: scaleX(-1);
}
/* 怪物被控制状态指示 */
.controlled-text[data-v-7ceb9642] {
  font-size: 22px;
  margin-left: 4px;
  animation: controlledPulse-7ceb9642 0.8s ease-in-out infinite;
  display: inline-block;
  color: #ff8844;
  font-weight: bold;
}
/* PVP 法宝·混沌 封印状态徽章 */
.sealed-text[data-v-7ceb9642] {
  font-size: 18px;
  margin-left: 4px;
  padding: 0 4px;
  border-radius: 4px;
  display: inline-block;
  color: #fff;
  background: linear-gradient(135deg, #7b2ff7, #9d4edd);
  border: 1px solid #c77dff;
  box-shadow: 0 0 8px rgba(157, 78, 221, 0.8);
  font-weight: bold;
  animation: controlledPulse-7ceb9642 0.8s ease-in-out infinite;
}
@keyframes controlledPulse-7ceb9642 {
0%, 100% { opacity: 1; transform: scale(1);
}
50% { opacity: 0.6; transform: scale(1.3);
}
}
/* Buff 图标 */
.buff-icons[data-v-7ceb9642] {
  position: absolute;
  top: -16px;
  left: -4px;
  display: flex;
  flex-direction: column;
  gap: 1px;
  z-index: 30;
}
.buff-icon[data-v-7ceb9642] {
  font-size: 16px;
  background: rgba(0,0,0,0.5);
  border-radius: 4px;
  padding: 1px 3px;
  line-height: 1;
  color: #ff4828;
  font-weight: bold;
  /* 边框色由内联样式按 buff 字色设置（3px） */
  border: 3px solid transparent;
}
/* 负面效果（诅咒/克制/封印）：虚线边框 + 红色虚下划线，与增益类祝福区分 */
.buff-icon-debuff[data-v-7ceb9642] {
  border-style: dashed !important;
  text-decoration: underline;
  text-decoration-color: #ff3b3b;
  text-decoration-style: dashed;
  text-underline-offset: 2px;
}

/* ── 掉线重连等待层 ── */
.reconnect-overlay[data-v-7ceb9642] {
  position: absolute;
  inset: 0;
  background: rgba(10, 6, 18, 0.75);
  backdrop-filter: blur(4px);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 500;
  animation: reconnectFadeIn-7ceb9642 0.3s ease;
}
@keyframes reconnectFadeIn-7ceb9642 {
from { opacity: 0;
}
to { opacity: 1;
}
}
.reconnect-box[data-v-7ceb9642] {
  position: relative;
  background: linear-gradient(180deg, #2a1e38 0%, #1a1228 50%, #14101f 100%);
  border: 1px solid rgba(184, 134, 11, 0.45);
  border-radius: 8px;
  padding: 24px 40px 20px;
  text-align: center;
  min-width: 200px;
  box-shadow:
    0 0 40px rgba(0, 0, 0, 0.7),
    0 0 80px rgba(100, 60, 140, 0.12),
    inset 0 1px 0 rgba(255, 215, 0, 0.08);
}
.reconnect-icon-wrap[data-v-7ceb9642] {
  width: 48px;
  height: 48px;
  margin: 0 auto 10px;
  border-radius: 50%;
  background: linear-gradient(135deg, rgba(184, 134, 11, 0.15), rgba(184, 134, 11, 0.05));
  border: 1px solid rgba(255, 215, 0, 0.25);
  display: flex;
  align-items: center;
  justify-content: center;
  animation: iconPulse-7ceb9642 2s ease-in-out infinite;
}
@keyframes iconPulse-7ceb9642 {
0%, 100% { transform: scale(1); opacity: 1;
}
50% { transform: scale(1.06); opacity: 0.85;
}
}
.reconnect-icon[data-v-7ceb9642] {
  font-size: 22px;
  line-height: 1;
}
.reconnect-title[data-v-7ceb9642] {
  font-family: var(--game-font);
  font-size: 17px;
  color: #ffd700;
  font-weight: bold;
  margin-bottom: 4px;
  letter-spacing: 4px;
  text-shadow: 0 0 12px rgba(255, 215, 0, 0.35), 0 1px 3px rgba(0, 0, 0, 0.8);
}
.reconnect-player[data-v-7ceb9642] {
  font-family: var(--game-font);
  font-size: 14px;
  color: #e8d5b5;
  margin-bottom: 2px;
  font-weight: bold;
  letter-spacing: 2px;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.6);
}
.reconnect-divider[data-v-7ceb9642] {
  width: 55%;
  height: 1px;
  margin: 12px auto;
  background: linear-gradient(90deg, transparent, rgba(184, 134, 11, 0.35), transparent);
}
.reconnect-hint[data-v-7ceb9642] {
  font-family: var(--game-font);
  font-size: 13px;
  color: #b8a888;
  margin-bottom: 10px;
  letter-spacing: 2px;
}
.reconnect-countdown[data-v-7ceb9642] {
  display: flex;
  align-items: baseline;
  justify-content: center;
  gap: 3px;
  margin-bottom: 4px;
}
.countdown-num[data-v-7ceb9642] {
  font-family: var(--game-font);
  font-size: 44px;
  color: #e74c3c;
  font-weight: bold;
  text-shadow: 0 0 16px rgba(231, 76, 60, 0.4), 0 2px 4px rgba(0, 0, 0, 0.7);
  min-width: 52px;
  display: inline-block;
  line-height: 1;
  animation: countdownPulse-7ceb9642 1s ease-in-out infinite;
}
@keyframes countdownPulse-7ceb9642 {
0%, 100% { transform: scale(1);
}
50% { transform: scale(1.03);
}
}
.countdown-unit[data-v-7ceb9642] {
  font-family: var(--game-font);
  font-size: 14px;
  color: #8a7a65;
  margin-top: 10px;
  letter-spacing: 1px;
}
.reconnect-sub[data-v-7ceb9642] {
  font-family: var(--game-font);
  font-size: 11px;
  color: #6a5a48;
  letter-spacing: 1px;
}
.effect-hit[data-v-7ceb9642],
.effect-hit[data-v-7ceb9642],
.effect-damage[data-v-7ceb9642],
.effect-dodge[data-v-7ceb9642],
.effect-death[data-v-7ceb9642] {
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: center;
}
.effect-hit-img[data-v-7ceb9642],
.effect-death-img[data-v-7ceb9642] {
  width: 100%;
  max-width: 80px;
  image-rendering: pixelated;
}
.flip-h[data-v-7ceb9642] {
  transform: scaleX(-1);
}

/* ── 闪避/暴击图片飘字（素材 /czjm/xiaoguo/：shan.png 7帧、bao.png 9帧，横排帧图） ── */
.dodge-text[data-v-7ceb9642] {
  display: inline-block;
  width: 200px;
  height: 200px;
  background-image: url('/czjm/xiaoguo/shan.png');
  background-repeat: no-repeat;
  background-size: 700% 100%; /* 7 帧横排：单帧 = 容器宽 */
  background-position: 0 0;
  pointer-events: none;
  animation: dodgeFrames-7ceb9642 0.6s steps(7) forwards;
}
.dodge-text.monster-dodge[data-v-7ceb9642] {
  animation: dodgeFrames-7ceb9642 0.6s steps(7) forwards;
}
@keyframes dodgeFrames-7ceb9642 {
from { background-position: 0 0;
}
to { background-position: -1400px 0;
} /* 7 帧 × 200px */
}

/* ── 怪物技能特效（与闪字同位置） ── */
.monster-skill-effect[data-v-7ceb9642] {
  position: absolute; left: 50%; top: 50%;
  transform: translate(-50%, -50%);
  width: 160px; height: 160px;
  z-index: 46; pointer-events: none;
  margin-top: 20px;
  /* 怪物一死 monster-body 会被 visibility:hidden，默认会连后段技能帧一起藏掉
     （一击必杀的天罚此前只播前 1~2 帧，根因在此）。visibility 可被后代覆盖，
     故强制本层可见，使死亡后天罚 3~7 帧仍正常播放。
     同时 monster-entry-dead 会给整列 opacity:0.3，这里一并强制满不透明度，
     避免一击必杀时技能特效被一起变暗。 */
  visibility: visible !important;
  opacity: 1 !important;
}

/* ── 玩家方技能特效 ── */
.player-skill-effect[data-v-7ceb9642] {
  position: absolute; left: 50%; top: 50%;
  transform: translate(-50%, -50%);
  width: 320px; height: 320px;
  z-index: 50; pointer-events: none;
  /* 玩家一死 player-entry 会加 dead-entry（opacity:0.3），会连技能特效一起变暗；
     强制满不透明度，使一击必杀/最后一击致死时特效仍完整清晰播放。 */
  opacity: 1 !important;
}
.player-skill-effect .skill-effect-img[data-v-7ceb9642] {
  width: 100%; height: 100%; object-fit: contain;
}

/* PVP/组队中【对手/怪物技能打到己方】的特效：不放大（与怪物侧 160px 一致），
   避免对端视角看到对方技能特效被 320px 放大 */
.player-skill-effect.skill-effect-from-enemy[data-v-7ceb9642] {
  width: 160px; height: 160px;
}

/* ── AOE群攻技能特效（敌方区域） ── */
.skill-aoe-effect[data-v-7ceb9642] {
  position: absolute; left: 50%; top: 50%;
  transform: translate(-50%, -50%);
  width: 100%; height: 100%;
  z-index: 49; pointer-events: none;
  display: flex; align-items: center; justify-content: center;
}
.skill-aoe-effect .skill-effect-img[data-v-7ceb9642] {
  width: 160%; height: 160%; object-fit: contain; max-width: none;
}

/* ── CSS 伤害数字 ── */
.damage-wrapper[data-v-7ceb9642] {
  display: flex;
  align-items: center;
  gap: 4px;
  animation: damageFloat-7ceb9642 0.8s ease-out forwards;
  pointer-events: none;
}
.damage-text[data-v-7ceb9642] {
  font-family: 'GameFont', var(--game-font), 'SimSun', serif;
  font-size: 28px;
  font-weight: bold;
  color: #ff3333;
  text-shadow:
    0 0 4px #8b0000,
    0 0 8px #500000,
    2px 2px 0 #000;
  letter-spacing: 1px;
  white-space: nowrap;
  pointer-events: none;
}
.damage-text.negative[data-v-7ceb9642] {
  color: #33ff33;
  text-shadow:
    0 0 4px #006600,
    0 0 8px #004400,
    2px 2px 0 #000;
}
.damage-text.critical[data-v-7ceb9642] {
  color: #ffd700;
  text-shadow:
    0 0 4px #b8860b,
    0 0 8px #8b6508,
    2px 2px 0 #000;
}
.crit-text[data-v-7ceb9642] {
  display: inline-block;
  width: 200px;
  height: 200px;
  background-image: url('/czjm/xiaoguo/bao.png');
  background-repeat: no-repeat;
  background-size: 900% 100%; /* 9 帧横排：单帧 = 容器宽 */
  background-position: 0 0;
  pointer-events: none;
  animation: critFrames-7ceb9642 0.8s steps(9) forwards;
}
@keyframes critFrames-7ceb9642 {
from { background-position: 0 0;
}
to { background-position: -1800px 0;
} /* 9 帧 × 200px */
}
.battle-overlay[data-v-7ceb9642] *:focus {
  outline: none;
}
.battle-overlay[data-v-7ceb9642] * {
  -webkit-tap-highlight-color: transparent;
}

.battle-result-overlay[data-v-4753ea42] {
  position: absolute;
  inset: 0;
  z-index: 3000;
  outline: none;
  background: rgba(0, 20, 30, 0.55);
  animation: resultFadeIn-4753ea42 0.3s ease-out;
  display: flex;
  justify-content: center;
  align-items: center;
}
@keyframes resultFadeIn-4753ea42 {
from { opacity: 0;
}
to   { opacity: 1;
}
}
.result-center[data-v-4753ea42] {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
}

/* 结算卡片：包在 .pixel-dialog-box 青卡内 */
.result-card[data-v-4753ea42] {
  padding: 28px 24px;
  width: 80%;
  max-width: 320px;
}
.result-title[data-v-4753ea42] {
  font-size: 16px;
  font-weight: bold;
  letter-spacing: 6px;
  text-shadow: 1px 1px 4px rgba(0,0,0,0.8);
  margin: 0 0 8px;
  padding-bottom: 8px;
}
.result-title.victory[data-v-4753ea42] {
  color: #ffd700;
}
.result-title.defeat[data-v-4753ea42] {
  color: #ff4444;
}
.result-title.flee[data-v-4753ea42] {
  color: #4fc3f7;
}
.result-row[data-v-4753ea42] {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
}
.result-label[data-v-4753ea42] {
  color: #ccc;
  font-size: 13px;
}
.result-value[data-v-4753ea42] {
  font-size: 15px;
  font-weight: bold;
}
.exp-value[data-v-4753ea42] {
  color: #ffffff;
}
.gold-value[data-v-4753ea42] {
  color: #ffd700;
}
.fabao-exp-value[data-v-4753ea42] {
  color: #b388ff;
}
.cultivation-value[data-v-4753ea42] {
  color: #aae0ff;
}
.defeat-exp-value[data-v-4753ea42] {
  color: #ff6666;
}
.levelup-value[data-v-4753ea42] {
  color: #ffd700;
}
.item-value[data-v-4753ea42] {
  color: #81c784;
}
.drop-value[data-v-4753ea42] {
  color: #ffd700;
  font-size: 12px;
}
.rarity-凡[data-v-4753ea42] { color: #ffffff;
}
.rarity-良[data-v-4753ea42] { color: #4dc4ff;
}
.rarity-精[data-v-4753ea42] { color: #7cff7c;
}
.rarity-极[data-v-4753ea42] { color: #b388ff;
}
.rarity-神[data-v-4753ea42] { color: #ff9800;
}
.backpack-full-tip[data-v-4753ea42] { color: #ff6666; font-size: 12px;
}
.mt-4[data-v-4753ea42] {
  height: 4px;
}

.party-fullscreen[data-v-5487efb0] {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 50;
  background-size: 100% 100%;
  background-repeat: no-repeat;
  background-position: center;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.party-header[data-v-5487efb0] {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 14px 20px;
  flex-shrink: 0;
  position: relative;
}
.party-title[data-v-5487efb0] {
  font-family: var(--game-font);
  font-size: 18px;
  color: #ffd700;
  text-shadow: 0 1px 4px rgba(0, 0, 0, 0.9);
}
.close-btn[data-v-5487efb0] {
  position: absolute;
  right: 20px;
  width: 32px;
  height: 32px;
  border: 1px solid #8b7355;
  border-radius: 4px;
  background: rgba(0, 0, 0, 0.4);
  color: #ccc;
  font-size: 16px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s;
}
.close-btn[data-v-5487efb0]:hover {
  background: rgba(200, 50, 50, 0.3);
  border-color: #e74c3c;
  color: #fff;
}
.party-body[data-v-5487efb0] {
  flex: 1;
  padding: 0 20px 20px;
  overflow-y: auto;
  position: relative;
  margin-top: 10%;
}

/* ── 申请通知 ── */
.request-banner[data-v-5487efb0] {
  position: relative;
  padding: 16px 20px;
  margin-bottom: 10px;
}
.request-text[data-v-5487efb0] {
  display: block;
  font-family: var(--game-font);
  font-size: 14px;
  color: #d9f6fb;
  margin-bottom: 10px;
  text-align: center;
}
.request-btns[data-v-5487efb0] {
  display: flex;
  gap: 10px;
  justify-content: center;
}
.btn-sm[data-v-5487efb0] {
  padding: 5px 16px;
  border-radius: 3px;
  border: 1px solid;
  font-family: var(--game-font);
  font-size: 12px;
  cursor: pointer;
  transition: all 0.2s;
}
.btn-sm.accept[data-v-5487efb0] {
  background: rgba(46, 204, 113, 0.25);
  border-color: #2ecc71;
  color: #a0e8c0;
}
.btn-sm.accept[data-v-5487efb0]:hover {
  background: rgba(46, 204, 113, 0.45);
  color: #fff;
}
.btn-sm.reject[data-v-5487efb0] {
  background: rgba(231, 76, 60, 0.25);
  border-color: #e74c3c;
  color: #e8a0a0;
}
.btn-sm.reject[data-v-5487efb0]:hover {
  background: rgba(231, 76, 60, 0.45);
  color: #fff;
}

/* ── Toast 通知弹窗 ── */
.toast-banner[data-v-5487efb0] {
  position: absolute;
  bottom: 80px;
  left: 20px;
  right: 20px;
  max-width: 340px;
  margin: 0 auto;
  padding: 16px 20px;
  z-index: 60;
  text-align: center;
  animation: toastFadeIn-5487efb0 0.3s ease;
}
.toast-text[data-v-5487efb0] {
  font-family: var(--game-font);
  font-size: 14px;
  color: #fff;
}
@keyframes toastFadeIn-5487efb0 {
from { opacity: 0; transform: translateY(-10px);
}
to { opacity: 1; transform: translateY(0);
}
}

/* ── 选项卡 ── */
.tab-bar[data-v-5487efb0] {
  display: flex;
  gap: 0;
  margin-bottom: 14px;
  border: 1px solid #009aa1;
  background: #03c4cd;
}
.tab-btn[data-v-5487efb0] {
  flex: 1;
  padding: 10px 0;
  border: none;
  background: transparent;
  color: #ffffff;
  font-family: var(--game-font);
  font-size: 14px;
  cursor: pointer;
  transition: all 0.25s;
  letter-spacing: 2px;
}
.tab-btn.active[data-v-5487efb0] {
  background: linear-gradient(180deg, rgba(180, 130, 40, 0.25) 0%, rgba(140, 100, 30, 0.1) 100%);
  color: #e8c84a;
  text-shadow: 0 0 8px rgba(200, 150, 40, 0.4);
}

/* ── 空状态 ── */
.empty-state[data-v-5487efb0] {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 50px 0;
  gap: 12px;
}
.empty-text[data-v-5487efb0] {
  font-family: var(--game-font);
  font-size: 14px;
  color: #ffffff;
}
.create-btn[data-v-5487efb0] {
  padding: 10px 40px;
  border-radius: 4px;
  border: 1px solid #5a4020;
  background: rgba(46, 204, 113, 0.15);
  color: #ffffff;
  font-family: var(--game-font);
  font-size: 14px;
  cursor: pointer;
  transition: all 0.2s;
  margin-top: 6px;
}
.create-btn[data-v-5487efb0]:hover {
  background: rgba(46, 204, 113, 0.3);
  color: #fff;
}

/* ── 成员列表 ── */
.member-list[data-v-5487efb0] {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-bottom: 14px;
}
.member-count[data-v-5487efb0] {
  font-family: var(--game-font);
  font-size: 12px;
  color: #fff;
  padding: 2px 0;
}
.member-card[data-v-5487efb0] {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 12px;
}
.member-card[data-v-5487efb0]:hover {
  background: #0ca7ae;
}
.member-card.leader[data-v-5487efb0] {
  background: rgba(190, 0, 228, 0.1);
  border-color: rgba(190, 0, 228, 0.3);
}
.member-info[data-v-5487efb0] {
  flex: 1;
  display: flex;
  align-items: center;
  gap: 8px;
}
.member-name[data-v-5487efb0] {
  font-family: var(--game-font);
  font-size: 14px;
  color: #f0e6d3;
}
.member-level[data-v-5487efb0] {
  font-family: var(--game-font);
  font-size: 12px;
  color: #fff;
}
.leader-tag[data-v-5487efb0] {
  font-family: var(--game-font);
  font-size: 15px;
  color: #be00e4;
  padding: 1px 6px;
  border-radius: 3px;
}
.member-party-tag[data-v-5487efb0] {
  font-family: var(--game-font);
  font-size: 12px;
  color: #ffd700;
  margin-left: 2px;
}
.kick-btn[data-v-5487efb0] {
  font-family: var(--game-font);
  font-size: 11px;
  padding: 4px 12px;
  background: rgba(200, 50, 50, 0.25);
  border: 1px solid #a04040;
  border-radius: 3px;
  color: #e8b0b0;
  cursor: pointer;
  transition: all 0.2s;
}
.kick-btn[data-v-5487efb0]:hover {
  background: rgba(200, 50, 50, 0.45);
  color: #fff;
}
.party-actions[data-v-5487efb0] {
  display: flex;
  gap: 10px;
}
.action-btn[data-v-5487efb0] {
  flex: 1;
  padding: 9px 0;
  border-radius: 4px;
  border: 1px solid;
  font-family: var(--game-font);
  font-size: 13px;
  cursor: pointer;
  transition: all 0.2s;
}
.action-btn.danger[data-v-5487efb0] {
  background: #009aa1;
  color: #ffffff;
}
.action-btn.danger[data-v-5487efb0]:hover {
  background: rgba(200, 50, 50, 0.4);
  color: #fff;
}

/* ── 分页（样式抄好友界面） ── */
.pagination[data-v-5487efb0] {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  margin-bottom: 13px;
}
.page-btn[data-v-5487efb0] {
  padding: 6px 16px;
  background: #03c4cd;
  border: 1px solid #009aa1;
  border-radius: 4px;
  color: #f5deb3;
  font-family: 'GameFont';
  font-size: 13px;
  cursor: pointer;
  transition: all 0.15s;
}
.page-btn[data-v-5487efb0]:hover:not(:disabled) {
  filter: brightness(1.15);
}
.page-btn[data-v-5487efb0]:disabled {
  opacity: 0.4;
  cursor: not-allowed;
}
.page-info[data-v-5487efb0] {
  color: #ffd700;
  font-size: 14px;
}

/* ── 队伍列表 ── */
.team-list[data-v-5487efb0] {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.team-card[data-v-5487efb0] {
  display: flex;
  align-items: center;
  padding: 10px 12px;
  background: rgba(0, 0, 0, 0.25);
  border: 1px solid rgba(139, 115, 85, 0.3);
  border-radius: 4px;
}
.team-info[data-v-5487efb0] {
  flex: 1;
  padding-left: 8px;
}
.team-leader[data-v-5487efb0] {
  font-family: var(--game-font);
  font-size: 14px;
  color: #f0e6d3;
}
.player-action[data-v-5487efb0] {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
}
.player-level[data-v-5487efb0] {
  font-family: var(--game-font);
  font-size: 12px;
  color: #fff;
}
.team-count[data-v-5487efb0] {
  font-family: var(--game-font);
  font-size: 12px;
  color: #fff;
}
.apply-btn[data-v-5487efb0] {
  padding: 5px 16px;
  border-radius: 3px;
  border: 1px solid #5a7fbf;
  background: rgba(60, 100, 180, 0.2);
  color: #a0c0e8;
  font-family: var(--game-font);
  font-size: 12px;
  cursor: pointer;
  transition: all 0.2s;
  flex-shrink: 0;
}
.apply-btn[data-v-5487efb0]:hover:not(:disabled) {
  background: rgba(60, 100, 180, 0.4);
  color: #fff;
}
.apply-btn[data-v-5487efb0]:disabled {
  opacity: 0.35;
  cursor: not-allowed;
}

/* ── 键盘导航聚焦 ── */
.member-card.focused[data-v-5487efb0],
.team-card.focused[data-v-5487efb0] {
  background: #0ca7ae;
}
.create-btn.focused[data-v-5487efb0],
.action-btn.focused[data-v-5487efb0] {
  border-color: #009aa1;
  background: #03c4cd;
}
.in-party-tag[data-v-5487efb0] {
  font-family: var(--game-font);
  font-size: 11px;
  color: #f3f3f3;
  padding: 5px 12px;
  flex-shrink: 0;
}

/* ── 操作弹窗（与附近界面一致） ── */
.menu-overlay[data-v-5487efb0] {
  position: fixed; inset: 0; z-index: 99999;
  background: rgba(0,0,0,0.6);
  display: flex; align-items: center; justify-content: center;
}
.menu-box[data-v-5487efb0] {
  display: flex; flex-direction: column; align-items: center;
  padding: 15px 28px 18px; position: relative; margin-top: -50%;
}
.menu-btns[data-v-5487efb0] {
  display: flex; flex-direction: column; gap: 4px;
  width: 100%; align-items: center; justify-content: center; margin-top: 10%;
}
.menu-btn[data-v-5487efb0] {
  width: 100%; padding: 5px 30px;
  background: #735131; border: 1px solid #ffd700; border-radius: 0;
  color: #f5d15f; font-family: var(--game-font); font-size: 15px; letter-spacing: 2px;
  cursor: pointer; transition: all 0.15s;
}
.menu-btn[data-v-5487efb0]:hover {
  background: linear-gradient(180deg, #5a4a3a, #4a3a2a);
  border-color: #c9a84c; transform: translateY(-1px);
}
.menu-btn[data-v-5487efb0]:active { transform: translateY(0);
}
.btn-return[data-v-5487efb0] { margin-top: 2px;
}

.party-fullscreen[data-v-fd9f9842] {
  position: absolute;
  top: 0; left: 0; width: 100%; height: 100%;
  z-index: 50;
  background-size: 100% 100%;
  background-repeat: no-repeat;
  background-position: center;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.party-header[data-v-fd9f9842] {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 14px 20px;
  flex-shrink: 0;
  position: relative;
}
.party-title[data-v-fd9f9842] {
  font-size: 18px; color: #ffd700;
  text-shadow: 0 1px 4px rgba(0,0,0,0.9);
}
.close-btn[data-v-fd9f9842] {
  position: absolute;
  right: 16px;
  background: none; border: none; color: #ccc;
  font-size: 20px; cursor: pointer;
}
.party-body[data-v-fd9f9842] {
  flex: 1;
  padding: 0 20px 20px;
  overflow-y: auto;
  position: relative;
  margin-top: 10%;
}
.tab-bar[data-v-fd9f9842] {
  display: flex;
  gap: 0;
  margin-bottom: 14px;
  border: 1px solid #009aa1;
  background: #03c4cd;
}
.tab-btn[data-v-fd9f9842] {
  flex: 1;
  padding: 10px 0;
  border: none;
  background: transparent;
  color: #ffffff;
  font-family: var(--game-font);
  font-size: 14px;
  cursor: pointer;
  transition: all 0.25s;
  letter-spacing: 2px;
}
.tab-btn.active[data-v-fd9f9842] {
  background: linear-gradient(180deg, rgba(180, 130, 40, 0.25) 0%, rgba(140, 100, 30, 0.1) 100%);
  color: #e8c84a;
  text-shadow: 0 0 8px rgba(200, 150, 40, 0.4);
}
.empty-state[data-v-fd9f9842] {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 50px 0;
  gap: 12px;
}
.empty-text[data-v-fd9f9842] {
  font-family: var(--game-font);
  font-size: 14px;
  color: #ffffff;
}
.player-list[data-v-fd9f9842] {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-bottom: 14px;
}
/* 分页（样式抄好友界面） */
.pagination[data-v-fd9f9842] {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  margin-bottom: 13px;
}
.page-btn[data-v-fd9f9842] {
  padding: 6px 16px;
  background: #03c4cd;
  border: 1px solid #009aa1;
  border-radius: 4px;
  color: #f5deb3;
  font-family: 'GameFont';
  font-size: 13px;
  cursor: pointer;
  transition: all 0.15s;
}
.page-btn[data-v-fd9f9842]:hover:not(:disabled) {
  filter: brightness(1.15);
}
.page-btn[data-v-fd9f9842]:disabled {
  opacity: 0.4;
  cursor: not-allowed;
}
.page-info[data-v-fd9f9842] {
  color: #ffd700;
  font-size: 14px;
}
.player-card[data-v-fd9f9842] {
  display: flex;
  align-items: center;
  padding: 10px 12px;
  cursor: pointer;
  transition: background 0.15s;
}
.player-card[data-v-fd9f9842]:hover{
  background: #0ca7ae;
}
.player-card.focused[data-v-fd9f9842]:hover {
  background: #0ca7ae;
}
.player-name-wrap[data-v-fd9f9842] {
  flex: 1;
  padding-left: 8px;
}
.player-name[data-v-fd9f9842] {
  font-family: var(--game-font);
  font-size: 18px;
  color: #f0e6d3;
  font-weight: bold;
}
/* 邪恶值 ≥6：角色名变红 */
.player-name.evil-name[data-v-fd9f9842] {
  color: #ff3b3b;
}
.party-tag[data-v-fd9f9842] {
  font-family: var(--game-font);
  font-size: 12px;
  margin-left: 4px;
}
.party-tag.leader[data-v-fd9f9842] { color: #c87dff;
}
.party-tag.member[data-v-fd9f9842] { color: #fff;
}
.player-level[data-v-fd9f9842] {
  font-family: var(--game-font);
  font-size: 18px;
  color: #fff;
  text-align: center;
  flex: 1;
}
.player-action[data-v-fd9f9842] {
  flex: 1;
  display: flex;
  justify-content: flex-end;
}

/* 操作弹窗 */
.menu-overlay[data-v-fd9f9842] {
  position: fixed; inset: 0; z-index: 99999;
  background: rgba(0,0,0,0.6);
  display: flex; align-items: center; justify-content: center;
}
.menu-box[data-v-fd9f9842] {
  display: flex; flex-direction: column; align-items: center;
  padding: 20px 28px 18px;
  position: relative;
  margin-top: -80%;
}
.menu-btns[data-v-fd9f9842] {
  display: flex; flex-direction: column; gap: 4px;
  width: 100%;
  align-items: center;
  justify-content: center;
}
.menu-btn[data-v-fd9f9842] {
  width: 100%; padding: 8px 30px;
  background: #735131;
  border: 1px solid #ffd700;
  border-radius: 0;
  color: #f5d15f;
  font-size: 12px; letter-spacing: 2px;
  cursor: pointer; outline: none;
  transition: all 0.15s;
}
.menu-btn[data-v-fd9f9842]:hover {
  background: linear-gradient(180deg, #5a4a3a, #4a3a2a);
  border-color: #c9a84c;
  transform: translateY(-1px);
}
.menu-btn[data-v-fd9f9842]:active { transform: translateY(0);
}
.menu-btn.disabled[data-v-fd9f9842] {
  opacity: 0.4;
  cursor: not-allowed;
  pointer-events: none;
}
.btn-return[data-v-fd9f9842] { margin-top: 2px;
}
.battle-tag[data-v-fd9f9842] {
  font-size: 13px;
  color: #ff6b6b;
  margin-left: 10px;
}

/* 加好友结果弹窗（统一确认弹窗样式） */
.confirm-overlay[data-v-fd9f9842] {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.55);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 9999;
}
.confirm-dialog[data-v-fd9f9842] {
  padding: 30px 40px 20px;
  text-align: center;
}
.confirm-title[data-v-fd9f9842] {
  font-family: 'GameFont';
  font-size: 16px;
  color: #ffd700;
  font-weight: bold;
  margin-bottom: 10px;
  letter-spacing: 2px;
}
.confirm-text[data-v-fd9f9842] {
  font-family: 'GameFont';
  font-size: 15px;
  color: #f0e6d3;
  margin-bottom: 20px;
}
.confirm-btns[data-v-fd9f9842] {
  display: flex;
  gap: 16px;
  justify-content: center;
}
.confirm-btn[data-v-fd9f9842] {
  padding: 8px 24px;
  border: 1px solid;
  border-radius: 3px;
  font-family: 'GameFont';
  font-size: 13px;
  cursor: pointer;
  transition: all 0.2s;
}
.confirm-yes[data-v-fd9f9842] {
  background: rgba(200, 50, 50, 0.2);
  border-color: #a04040;
  color: #e8b0b0;
}
.confirm-yes[data-v-fd9f9842]:hover {
  background: rgba(200, 50, 50, 0.45);
  color: #fff;
}

.task-fullscreen[data-v-d23fe0f9] {
  position: absolute;
  top: 0; left: 0; width: 100%; height: 100%;
  z-index: 50;
  background-size: 100% 100%;
  background-repeat: no-repeat;
  background-position: center;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.task-header[data-v-d23fe0f9] {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 14px 20px;
  flex-shrink: 0;
  position: relative;
}
.task-title[data-v-d23fe0f9] {
  font-size: 18px; color: #ffd700;
  text-shadow: 0 1px 4px rgba(0,0,0,0.9);
}
.close-btn[data-v-d23fe0f9] {
  position: absolute;
  right: 16px;
  background: none; border: none; color: #ccc;
  font-size: 20px; cursor: pointer;
}
.task-body[data-v-d23fe0f9] {
  flex: 1;
  padding: 0 20px 20px;
  overflow-y: auto;
  scrollbar-width: none;
  -ms-overflow-style: none;
  position: relative;
  margin-top: 10%;
}
.task-body[data-v-d23fe0f9]::-webkit-scrollbar {
  display: none;
}
.tab-bar[data-v-d23fe0f9] {
  display: flex;
  gap: 0;
  margin-bottom: 14px;
  border: 1px solid #009aa1;
  background: #03c4cd;
}
.tab-btn[data-v-d23fe0f9] {
  flex: 1;
  padding: 10px 0;
  border: none;
  background: transparent;
  color: #ffffff;
  font-family: var(--game-font);
  font-size: 14px;
  cursor: pointer;
  transition: all 0.25s;
  letter-spacing: 2px;
}
.tab-btn.active[data-v-d23fe0f9] {
  background: linear-gradient(180deg, rgba(180, 130, 40, 0.25) 0%, rgba(140, 100, 30, 0.1) 100%);
  color: #e8c84a;
  text-shadow: 0 0 8px rgba(200, 150, 40, 0.4);
}
.empty-state[data-v-d23fe0f9] {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 50px 0;
  gap: 12px;
}
.empty-text[data-v-d23fe0f9] {
  font-family: var(--game-font);
  font-size: 14px;
  color: #ffffff;
}
.task-list[data-v-d23fe0f9] {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-bottom: 14px;
}
.task-card[data-v-d23fe0f9] {
  display: flex;
  flex-direction: column;
  padding: 10px 12px;
  gap: 6px;
}
.task-card[data-v-d23fe0f9]:hover { 
  background: #0ca7ae;
}
.task-name-wrap[data-v-d23fe0f9] {
  display: flex;
  align-items: center;
  gap: 8px;
}
.task-name[data-v-d23fe0f9] {
  font-family: var(--game-font);
  font-size: 14px;
  color: #f0e6d3;
  font-weight: bold;
}
.task-status[data-v-d23fe0f9] {
  font-family: var(--game-font);
  font-size: 12px;
  padding: 1px 6px;
  border-radius: 2px;
}
.task-status.available[data-v-d23fe0f9] { color: #7cff7c; background: rgba(0, 100, 0, 0.35);
}
.task-status.accepted[data-v-d23fe0f9] { color: #ffd700; background: rgba(120, 90, 0, 0.35);
}
.task-status.ready[data-v-d23fe0f9] { color: #ff8a65; background: rgba(150, 40, 0, 0.35);
}
.task-desc[data-v-d23fe0f9] {
  font-family: var(--game-font);
  font-size: 12px;
  color: #e0f7fa;
  line-height: 1.6;
}
.task-source[data-v-d23fe0f9] {
  font-family: var(--game-font);
  font-size: 11px;
  color: #b2ebf2;
}
.task-actions[data-v-d23fe0f9] {
  display: flex;
  gap: 8px;
  margin-top: 2px;
}
.task-btn[data-v-d23fe0f9] {
  padding: 5px 16px;
  background: #735131;
  border: 1px solid #ffd700;
  border-radius: 0;
  color: #f5d15f;
  font-family: var(--game-font);
  font-size: 12px;
  letter-spacing: 2px;
  cursor: pointer;
  transition: all 0.15s;
}
.task-btn[data-v-d23fe0f9]:hover {
  background: linear-gradient(180deg, #5a4a3a, #4a3a2a);
  border-color: #c9a84c;
  transform: translateY(-1px);
}
.task-btn.danger[data-v-d23fe0f9] {
  background: #7a3020;
  border-color: #ff7043;
  color: #ffd7c2;
}
.task-btn.danger[data-v-d23fe0f9]:hover {
  background: linear-gradient(180deg, #8a3a28, #6a2a1a);
  border-color: #ff8a65;
}

/* ── 分页（样式同好友/邮件界面） ── */
.pagination[data-v-d23fe0f9] {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  padding: 8px 0 2px;
  margin-bottom: 12px;
}
.page-btn[data-v-d23fe0f9] {
  padding: 6px 16px;
  padding: 6px 16px;
  background: #03c4cd;
  border: 1px solid #009aa1;
  color: #f5deb3;
  font-family: 'GameFont';
  font-size: 13px;
  cursor: pointer;
  transition: all 0.15s;
}
.page-btn[data-v-d23fe0f9]:hover:not(:disabled) {
  filter: brightness(1.15);
}
.page-btn[data-v-d23fe0f9]:disabled {
  opacity: 0.4;
  cursor: not-allowed;
}
.page-info[data-v-d23fe0f9] {
  color: #ffd700;
  font-size: 14px;
}

@font-face {
  font-family: 'GameFont';
  src: url('/fonts/VonwaonBitmap-16px.ttf') format('truetype');
}
.item-shop-fullscreen[data-v-8b778304] {
  position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 50;
  background-size: 100% 100%; background-repeat: no-repeat; background-position: center;
  display: flex; flex-direction: column; overflow: hidden; color: #e8d5a3;
}
.item-shop-header[data-v-8b778304] { display: flex; align-items: center; justify-content: center; padding: 20px 20px; flex-shrink: 0; position: relative;
}
.item-shop-title[data-v-8b778304] { font-family: 'GameFont'; font-size: 22px; color: #ffd700; text-shadow: 0 1px 4px rgba(0,0,0,0.9);
}
.close-btn[data-v-8b778304] { position: absolute; right: 20px; width: 32px; height: 32px; border: 1px solid #8b7355; border-radius: 4px; background: rgba(0,0,0,0.4); color: #ccc; font-size: 18px; cursor: pointer; font-family: 'GameFont';
}
.item-shop-middle[data-v-8b778304] { flex: 1; display: flex; flex-direction: column; padding: 12px 12px 0; overflow: hidden;
}
.grid-wrapper[data-v-8b778304] { flex: 1; overflow-y: auto;
}
.item-grid[data-v-8b778304] { display: grid; grid-template-columns: repeat(10, 1fr); gap: 2px;
}
.item-slot[data-v-8b778304] { aspect-ratio: 1; border: 1px solid #ffd700; background: #000; display: flex; flex-direction: column; align-items: center; justify-content: center; cursor: pointer; position: relative; font-size: 11px; font-family: 'GameFont';
}
.item-slot.filled[data-v-8b778304] { background: #111;
}
.item-slot[data-v-8b778304]:hover { border-color: #ffd700; background: #1a1a00;
}
.item-slot.selected[data-v-8b778304] { border-color: #ffd700;
}
.slot-icon[data-v-8b778304] { width: 100%; height: 100%; object-fit: contain; font-size: 16px; image-rendering: pixelated;
}
.item-shop-info-bar[data-v-8b778304] {
  flex: 0 0 auto; display: flex; align-items: center; justify-content: space-between;
  padding: 4px 8px; margin: 0 12px;
  border: 1px solid rgba(139,115,85,0.4); background: #735131;
  font-size: 15px; font-family: 'GameFont';
}
.info-name[data-v-8b778304] { color: #ffd700; font-size: 20px;
}
.info-price[data-v-8b778304] { color: #ffd700; font-size: 20px; font-weight: bold;
}
.item-shop-bottom[data-v-8b778304] { flex: 0 0 42%; display: flex; flex-direction: column; padding: 0 12px 1%; margin-top: 1%}
.detail-area[data-v-8b778304] { flex: 1; background: #8b6239; border: 2px solid #d4a76a; box-shadow: inset 0 0 0 1px #5a3a1b, inset 2px 2px 0 rgba(255,255,255,0.1), inset -2px -2px 0 rgba(0,0,0,0.15); padding: 4px 8px; overflow-y: auto; font-size: 20px; font-family: 'GameFont';
}
.detail-row[data-v-8b778304] { color: #ffffff; font-size: 20px; margin-bottom: 2px;
}
.detail-label[data-v-8b778304] { color: #e8d5a3;
}
.detail-value[data-v-8b778304] { color: #fff;
}
.detail-empty[data-v-8b778304] { color: #ffffff; text-align: center; padding-top: 12px;
}
.money-area[data-v-8b778304] { flex: 0 0 8%; display: flex; justify-content: space-between; align-items: center; padding: 2px 60px; font-size: 16px; font-family: 'GameFont';
}
.money-gold[data-v-8b778304] { color: #ffd700;
}
.money-yuanbao[data-v-8b778304] { color: #aae0ff;
}
.menu-overlay[data-v-8b778304] {
  position: fixed; inset: 0; z-index: 99999;
  background: rgba(0,0,0,0.6);
  display: flex; align-items: center; justify-content: center;
}
.menu-box[data-v-8b778304] {
  display: flex; flex-direction: column; align-items: center;
  padding: 10px 28px 18px; position: relative; margin-top: -50%;
}
.menu-btns[data-v-8b778304] {
  display: flex; flex-direction: column; gap: 4px; width: 100%;
  align-items: center; justify-content: center; margin-top: 10%;
}
.menu-btn[data-v-8b778304] {
  width: 100%; padding: 5px 30px;
  background: #735131; border: 1px solid #ffd700; border-radius: 0;
  color: #f5d15f; font-family: 'GameFont'; font-size: 15px; letter-spacing: 2px;
  cursor: pointer; outline: none; transition: all 0.15s;
}
.menu-btn[data-v-8b778304]:hover { background: linear-gradient(180deg, #5a4a3a, #4a3a2a); border-color: #c9a84c; transform: translateY(-1px);
}
.menu-btn[data-v-8b778304]:active { transform: translateY(0);
}
.btn-return[data-v-8b778304] { margin-top: 2px;
}
.modal-overlay[data-v-8b778304] {
  position: fixed; inset: 0; z-index: 99999;
  background: rgba(0,0,0,0.6);
  display: flex; align-items: center; justify-content: center;
}
.modal-box[data-v-8b778304] {
  padding: 24px 28px 18px; min-width: 260px; max-width: 300px; margin-top: -45%;
}
.modal-header[data-v-8b778304] { text-align: center; margin-bottom: 16px;
}
.modal-title[data-v-8b778304] { font-family: var(--game-font); font-size: 20px; font-weight: bold; color: #ffd700; text-shadow: 0 1px 4px rgba(0,0,0,0.9);
}
.modal-body[data-v-8b778304] { font-size: 13px; color: #e8d5a3; line-height: 1.5; margin-bottom: 14px; text-align: center; font-family: var(--game-font);
}
.modal-actions[data-v-8b778304] { display: flex; gap: 16px; justify-content: center;
}
.modal-btn[data-v-8b778304] {
  min-width: 100px; padding: 10px 24px;
  border: 1px solid #7a5938; border-radius: 8px;
  font-size: 14px; cursor: pointer; transition: all 0.2s; font-family: var(--game-font);
}
.modal-btn.confirm[data-v-8b778304] { background: #7a5938; color: #fff;
}
.modal-btn.confirm[data-v-8b778304]:hover { background: #9a7350;
}
.modal-btn.cancel[data-v-8b778304] { background: transparent; color: #a09080;
}
.modal-btn.cancel[data-v-8b778304]:hover { background: rgba(255,255,255,0.05); color: #e0d0c0;
}
.confirm-qty[data-v-8b778304] { display: flex; align-items: center; gap: 12px; justify-content: center; margin: 8px 0;
}
.confirm-qty-btn[data-v-8b778304] {
  width: 28px; height: 28px; background: #7a5938; border: 1px solid #7a5938;
  color: #fff; font-size: 16px; cursor: pointer; font-family: 'GameFont';
  display: flex; align-items: center; justify-content: center; border-radius: 4px;
}
.confirm-qty-btn[data-v-8b778304]:hover { background: #9a7350;
}
.confirm-qty-input[data-v-8b778304] {
  width: 40px; height: 28px; text-align: center; font-size: 16px; color: #fff;
  background: rgba(0,0,0,0.3); border: 1px solid #7a5938; border-radius: 4px;
  font-family: 'GameFont'; outline: none;
}
.confirm-qty-input[data-v-8b778304]::-webkit-outer-spin-button,
.confirm-qty-input[data-v-8b778304]::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0;
}
.confirm-qty-input[type=number][data-v-8b778304] { -moz-appearance: textfield;
}
.confirm-total[data-v-8b778304] { font-size: 12px; color: #e8d5a3; margin-top: 4px;
}
.confirm-total-val[data-v-8b778304] { color: #ffd700; font-weight: bold;
}
.modal-fade-enter-active[data-v-8b778304], .modal-fade-leave-active[data-v-8b778304] { transition: opacity 0.25s ease;
}
.modal-fade-enter-from[data-v-8b778304], .modal-fade-leave-to[data-v-8b778304] { opacity: 0;
}
.grid-wrapper[data-v-8b778304]::-webkit-scrollbar { display: none;
}
.detail-area[data-v-8b778304]::-webkit-scrollbar { display: none;
}
.grid-wrapper[data-v-8b778304] { scrollbar-width: none; -ms-overflow-style: none;
}
.detail-area[data-v-8b778304] { scrollbar-width: none; -ms-overflow-style: none;
}

@font-face {
  font-family: 'GameFont';
  src: url('/fonts/VonwaonBitmap-16px.ttf') format('truetype');
}
.mail-fullscreen[data-v-e2300cd4] {
  position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 50;
  background-size: 100% 100%; background-repeat: no-repeat; background-position: center;
  display: flex; flex-direction: column; overflow: hidden; color: #e8d5a3;
}
.mail-header[data-v-e2300cd4] { display: flex; align-items: center; justify-content: center; padding: 23px 20px; flex-shrink: 0; position: relative;
}
.mail-title[data-v-e2300cd4] { font-family: 'GameFont'; font-size: 22px; color: #ffd700; text-shadow: 0 1px 4px rgba(0,0,0,0.9);
}
.close-btn[data-v-e2300cd4] { position: absolute; right: 20px; width: 32px; height: 32px; border: 1px solid #8b7355; border-radius: 4px; background: rgba(0,0,0,0.4); color: #ccc; font-size: 18px; cursor: pointer; font-family: 'GameFont';
}
.mail-list-area[data-v-e2300cd4] { flex: 1; padding: 20px; overflow-y: auto; scrollbar-width: none; -ms-overflow-style: none;
}
.mail-list-area[data-v-e2300cd4]::-webkit-scrollbar { display: none;
}
.mail-list[data-v-e2300cd4] { display: flex; flex-direction: column; gap: 6px;
}
.mail-row[data-v-e2300cd4] {
  display: flex; align-items: center; gap: 8px; padding: 8px 10px;
   cursor: pointer;
  font-family: 'GameFont'; font-size: 14px;
}
.mail-row[data-v-e2300cd4]:hover { background: #05d6e0;
}
.mail-sender[data-v-e2300cd4] { color: #ffd700; font-weight: bold; flex-shrink: 0; font-size: 14px;
}
.mail-title-wrap[data-v-e2300cd4] { flex: 1; display: flex; align-items: center; gap: 4px; min-width: 0;
}
.mail-title-text[data-v-e2300cd4] { color: #fff; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 55%; font-size: 14px;
}
.mail-title-text.unread[data-v-e2300cd4] { color: #ffd700;
}
.mail-status[data-v-e2300cd4] { color: #b2ebf2; font-size: 14px; flex-shrink: 0;
}
.mail-attach[data-v-e2300cd4] { color: #ff8a65; font-size: 14px; flex-shrink: 0;
}
.mail-time[data-v-e2300cd4] { color: #fff; font-size: 14px; flex-shrink: 0;
}
.mail-empty[data-v-e2300cd4] { text-align: center; color: #fff; padding: 40px 0; font-family: 'GameFont';
}

/* ── 分页（样式同好友界面） ── */
.pagination[data-v-e2300cd4] {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  padding-bottom: 8px;
}
.page-btn[data-v-e2300cd4] {
  padding: 6px 16px;
  background: #03c4cd;
  border: 1px solid #009aa1;
  border-radius: 4px;
  color: #f5deb3;
  font-family: 'GameFont';
  font-size: 13px;
  cursor: pointer;
  transition: all 0.15s;
}
.page-btn[data-v-e2300cd4]:hover:not(:disabled) {
  filter: brightness(1.15);
}
.page-btn[data-v-e2300cd4]:disabled {
  opacity: 0.4;
  cursor: not-allowed;
}
.page-info[data-v-e2300cd4] {
  color: #ffd700;
  font-size: 14px;
}
.mail-detail-area[data-v-e2300cd4] { flex: 1; padding: 25px; display: flex; flex-direction: column; gap: 8px; font-family: 'GameFont';
}
.detail-sender[data-v-e2300cd4] { font-size: 15px; color: #ffd700;
}
.detail-title[data-v-e2300cd4] { text-align: center; font-size: 17px; color: #fff; font-weight: bold;
}
.detail-content-box[data-v-e2300cd4] {
  min-height: 40%;
  background: #8b6239;
  border: 2px solid #d4a76a;
  box-shadow:
    inset 0 0 0 1px #5a3a1b,
    inset 2px 2px 0 rgba(255,255,255,0.1),
    inset -2px -2px 0 rgba(0,0,0,0.15);
  padding: 10px;
  color: #f5deb3;
  font-size: 20px;
  line-height: 1.6;
  word-break: break-all;
}
.detail-attach-label[data-v-e2300cd4] { font-size: 14px; color: #ffd700;
}
.detail-attach-box[data-v-e2300cd4] {
  background: #8b6239;
  border: 2px solid #d4a76a;
  box-shadow:
    inset 0 0 0 1px #5a3a1b,
    inset 2px 2px 0 rgba(255,255,255,0.1),
    inset -2px -2px 0 rgba(0,0,0,0.15);
  padding: 8px;
}
.detail-attach-slots[data-v-e2300cd4] { display: flex; gap: 8px; justify-content: center;
}
.attach-slot[data-v-e2300cd4] { width: 48px; height: 48px;
  border: 1px solid #5a3a1b; background: rgba(0,0,0,0.35);
  display: flex; align-items: center; justify-content: center; position: relative;
}
.attach-slot.clickable[data-v-e2300cd4] { cursor: pointer;
}
.attach-slot.clickable[data-v-e2300cd4]:hover { border-color: #ffd700; background: rgba(60,40,10,0.5);
}
.attach-icon[data-v-e2300cd4] { width: 100%; height: 100%; object-fit: contain; image-rendering: pixelated;
}
.attach-count[data-v-e2300cd4] { position: absolute; right: 2px; bottom: 2px; color: #ffd700; font-size: 10px;
}
.detail-gold-wrap[data-v-e2300cd4] { display: flex; align-items: center; gap: 8px; font-size: 15px;
}
.detail-gold-label[data-v-e2300cd4] { color: #ffd700;
}
.detail-gold-box[data-v-e2300cd4] {
  min-width: 86%;
  background: #8b6239;
  border: 2px solid #d4a76a;
  box-shadow:
    inset 0 0 0 1px #5a3a1b,
    inset 2px 2px 0 rgba(255,255,255,0.1),
    inset -2px -2px 0 rgba(0,0,0,0.15);
  padding: 6px 10px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.detail-gold-value[data-v-e2300cd4] { color: #f5deb3;
}

/* ── 写邮件输入框 ── */
.compose-input[data-v-e2300cd4] {
  width: 100%;
  background: #8b6239;
  border: 2px solid #d4a76a;
  box-shadow:
    inset 0 0 0 1px #5a3a1b,
    inset 2px 2px 0 rgba(255,255,255,0.1),
    inset -2px -2px 0 rgba(0,0,0,0.15);
  color: #f5deb3;
  font-family: 'GameFont';
  font-size: 13px;
  padding: 4px 8px;
  outline: none;
  box-sizing: border-box;
}
.compose-input[data-v-e2300cd4]:focus {
  border-color: #ffd700;
}
.compose-input[data-v-e2300cd4]::placeholder {
  color: #ffffff;
  opacity: 0.7;
}
.compose-textarea[data-v-e2300cd4]::placeholder {
  color: #ffffff;
  opacity: 0.7;
}
.compose-textarea[data-v-e2300cd4] {
  width: 100%;
  min-height: 40%;
  background: #8b6239;
  border: 2px solid #d4a76a;
  box-shadow:
    inset 0 0 0 1px #5a3a1b,
    inset 2px 2px 0 rgba(255,255,255,0.1),
    inset -2px -2px 0 rgba(0,0,0,0.15);
  color: #f5deb3;
  font-family: 'GameFont';
  font-size: 13px;
  padding: 6px 8px;
  outline: none;
  resize: none;
  box-sizing: border-box;
  line-height: 1.6;
}
.compose-textarea[data-v-e2300cd4]:focus {
  border-color: #ffd700;
}
.compose-gold-input[data-v-e2300cd4] {
  width: 100%;
  background: transparent;
  border: none;
  color: #f5deb3;
  font-family: 'GameFont';
  font-size: 14px;
  text-align: center;
  outline: none;
  -moz-appearance: textfield;
  appearance: textfield;
}
.compose-gold-input[data-v-e2300cd4]::-webkit-outer-spin-button,
.compose-gold-input[data-v-e2300cd4]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.attach-add[data-v-e2300cd4] {
  color: #c9a86a;
  font-size: 22px;
}
.mail-footer-btns[data-v-e2300cd4] { flex: 0 0 auto; display: flex; justify-content: center; gap: 12px; padding: 8px;
}
.footer-btn[data-v-e2300cd4] {
  padding: 8px 28px; background: #735131; border: 1px solid #ffd700; border-radius: 0;
  color: #f5d15f; font-family: 'GameFont'; font-size: 15px; letter-spacing: 2px; cursor: pointer;
}
/* 写邮件按钮（抄发言界面 compose-btn） */
.compose-btn[data-v-e2300cd4] {
  width: 132px;
  padding: 5px 0;
  background: #8b6239;
  border: 2px solid #d4a76a;
  box-shadow:
    inset 0 0 0 1px #5a3a1b,
    inset 2px 2px 0 rgba(255, 255, 255, 0.1),
    inset -2px -2px 0 rgba(0, 0, 0, 0.15);
  color: #f5deb3;
  font-family: 'GameFont';
  font-size: 13px;
  font-weight: bold;
  letter-spacing: 2px;
  cursor: pointer;
  transition: all 0.15s;
}
.compose-btn[data-v-e2300cd4]:hover { filter: brightness(1.15);
}
.compose-btn.primary[data-v-e2300cd4] { background: #19A7B5;
}

/* 写邮件错误弹窗（统一确认弹窗样式） */
.confirm-overlay[data-v-e2300cd4] {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.55);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 9999;
}
.confirm-dialog[data-v-e2300cd4] {
  padding: 30px 40px 20px;
  text-align: center;
}
.confirm-title[data-v-e2300cd4] {
  font-family: 'GameFont';
  font-size: 16px;
  color: #ffd700;
  font-weight: bold;
  margin-bottom: 10px;
  letter-spacing: 2px;
}
.confirm-text[data-v-e2300cd4] {
  font-family: 'GameFont';
  font-size: 15px;
  color: #f0e6d3;
  margin-bottom: 20px;
}
.confirm-btns[data-v-e2300cd4] {
  display: flex;
  gap: 16px;
  justify-content: center;
}
.confirm-btn[data-v-e2300cd4] {
  padding: 8px 24px;
  border: 1px solid;
  border-radius: 3px;
  font-family: 'GameFont';
  font-size: 13px;
  cursor: pointer;
  transition: all 0.2s;
}
.confirm-yes[data-v-e2300cd4] {
  background: rgba(200, 50, 50, 0.2);
  border-color: #a04040;
  color: #e8b0b0;
}
.confirm-yes[data-v-e2300cd4]:hover {
  background: rgba(200, 50, 50, 0.45);
  color: #fff;
}
.confirm-no[data-v-e2300cd4] {
  background: rgba(80, 80, 90, 0.2);
  border-color: #707080;
  color: #c0c0d0;
}
.confirm-no[data-v-e2300cd4]:hover {
  background: rgba(80, 80, 90, 0.45);
  color: #fff;
}

/* 附件数量选择 */
.confirm-qty[data-v-e2300cd4] {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  margin-bottom: 20px;
}
.confirm-qty-btn[data-v-e2300cd4] {
  width: 36px;
  height: 36px;
  border: 1px solid #8b7355;
  border-radius: 4px;
  background: rgba(80, 55, 30, 0.8);
  color: #ffd700;
  font-size: 18px;
  cursor: pointer;
  font-family: 'GameFont';
}
.confirm-qty-btn[data-v-e2300cd4]:hover {
  background: #9a7350;
}
.confirm-qty-value[data-v-e2300cd4] {
  min-width: 48px;
  text-align: center;
  color: #ffd700;
  font-family: 'GameFont';
  font-size: 18px;
}

/* ── 数量弹窗（抄背包使用数量弹窗） ── */
.modal-overlay[data-v-e2300cd4] {
  position: fixed; inset: 0; background: rgba(0,0,0,0.6); display: flex;
  align-items: center; justify-content: center; z-index: 200;
}
.modal-box[data-v-e2300cd4] {
  width: 300px; padding: 24px 20px 16px; border-radius: 8px;
}
.modal-header[data-v-e2300cd4] { text-align: center; padding-bottom: 12px;
}
.modal-title[data-v-e2300cd4] { color: #ffd700; font-size: 16px; font-weight: bold;
}
.modal-body[data-v-e2300cd4] { color: #ccc; font-size: 14px; text-align: center;
}
.confirm-total[data-v-e2300cd4] { color: #ccc; font-size: 14px; margin-top: 4px;
}
.confirm-total-val[data-v-e2300cd4] { color: #ffd700; font-size: 16px; font-weight: bold;
}
.modal-actions[data-v-e2300cd4] { display: flex; gap: 16px; justify-content: center; margin-top: 16px;
}
.modal-btn[data-v-e2300cd4] {
  padding: 6px 24px; border: 1px solid #8b7355; border-radius: 4px;
  background: rgba(80,55,30,0.8); color: #ffd700; font-size: 14px; cursor: pointer;
}
.modal-btn[data-v-e2300cd4]:hover { background: #9a7350;
}
.modal-btn.confirm[data-v-e2300cd4] { background: rgba(30,80,30,0.8);
}
.modal-btn.confirm[data-v-e2300cd4]:hover { background: #3a8a3a;
}
.confirm-qty-input[data-v-e2300cd4] {
  width: 60px; height: 32px; text-align: center; background: rgba(0,0,0,0.4);
  border: 1px solid #8b7355; border-radius: 4px; color: #fff; font-size: 16px; outline: none;
  -moz-appearance: textfield; appearance: textfield;
}
.confirm-qty-input[data-v-e2300cd4]::-webkit-outer-spin-button,
.confirm-qty-input[data-v-e2300cd4]::-webkit-inner-spin-button {
  -webkit-appearance: none; margin: 0;
}
.footer-btn[data-v-e2300cd4]:hover { background: linear-gradient(180deg, #5a4a3a, #4a3a2a);
}
.money-area[data-v-e2300cd4] { flex: 0 0 8%; display: flex; justify-content: space-between; align-items: center; padding: 2px 60px; font-size: 16px; font-family: 'GameFont';
}
.money-gold[data-v-e2300cd4] { color: #ffd700;
}
.money-yuanbao[data-v-e2300cd4] { color: #aae0ff;
}
.menu-overlay[data-v-e2300cd4] {
  position: fixed; inset: 0; z-index: 99999;
  background: rgba(0,0,0,0.6);
  display: flex; align-items: center; justify-content: center;
}
.menu-box[data-v-e2300cd4] { display: flex; flex-direction: column; align-items: center; padding: 10px 28px 18px; position: relative; margin-top: -50%;
}
.menu-btns[data-v-e2300cd4] { display: flex; flex-direction: column; gap: 4px; width: 100%; align-items: center; justify-content: center; margin-top: 10%;
}
.menu-btn[data-v-e2300cd4] {
  width: 100%; padding: 5px 30px;
  background: #735131; border: 1px solid #ffd700; border-radius: 0;
  color: #f5d15f; font-family: 'GameFont'; font-size: 15px; letter-spacing: 2px;
  cursor: pointer; outline: none; transition: all 0.15s;
}
.menu-btn[data-v-e2300cd4]:hover { background: linear-gradient(180deg, #5a4a3a, #4a3a2a); border-color: #c9a84c; transform: translateY(-1px);
}
.btn-return[data-v-e2300cd4] { margin-top: 2px;
}

/* 与附魂选择界面（ItemPickerPanel）详情区 1:1 一致 */
.detail-area[data-v-bcf25999] { flex: 1; background: #8b6239; border: 2px solid #d4a76a; box-shadow: inset 0 0 0 1px #5a3a1b, inset 2px 2px 0 rgba(255,255,255,0.1), inset -2px -2px 0 rgba(0,0,0,0.15); padding: 4px 8px; overflow-y: auto; font-size: 11px; font-family: 'GameFont';
}
.detail-name[data-v-bcf25999] { font-size: 13px; margin-bottom: 2px; display: flex; align-items: center; gap: 6px; flex-wrap: wrap;
}
.name-text[data-v-bcf25999] { white-space: nowrap; color: #ffd700;
}
.rarity-white[data-v-bcf25999] { color: #ffffff;
}
.rarity-darkblue[data-v-bcf25999] { color: #4dc4ff;
}
.rarity-green[data-v-bcf25999] { color: #7cff7c;
}
.rarity-purple[data-v-bcf25999] { color: #b388ff;
}
.rarity-orange[data-v-bcf25999] { color: #ff9800;
}
.detail-stars[data-v-bcf25999] { display: inline-flex; align-items: center; gap: 1px;
}
.star-img[data-v-bcf25999] { width: 14px; height: 14px; image-rendering: pixelated;
}
.soul-img[data-v-bcf25999] { width: 16px; height: 16px; vertical-align: -2px; image-rendering: pixelated; margin-right: 2px;
}
.detail-level[data-v-bcf25999] { font-size: 15px; margin-left: 4px;
}
.level-num[data-v-bcf25999] { color: #7cff7c;
}
.subtype-name[data-v-bcf25999] { color: #ffffff;
}
.inline-stats[data-v-bcf25999] { display: flex; flex-wrap: wrap; gap: 4px 8px; margin-top: 5px;
}
.detail-row[data-v-bcf25999] { color: #ffffff;
}
.detail-empty[data-v-bcf25999] { color: #ffffff; text-align: center; padding-top: 12px;
}
.stat-section-label[data-v-bcf25999] { color: #ffd700; font-size: 12px; margin-top: 5px;
}
.stat-label[data-v-bcf25999] { color: #e8d5a3;
}
.stat-value[data-v-bcf25999] { color: #ffffff; margin-left: 6px;
}
.stat-enhan[data-v-bcf25999] { color: #7cff7c; margin-left: 1px;
}
.stat-bonus[data-v-bcf25999] { color: #b388ff; margin-left: 1px;
}

@font-face {
  font-family: 'GameFont';
  src: url('/fonts/VonwaonBitmap-16px.ttf') format('truetype');
}

/* ────────── 与附魂选择界面（ItemPickerPanel）1:1 一致的样式 ────────── */
.picker-fullscreen[data-v-5aa104c9] {
  position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 50;
  background-size: 100% 100%; background-repeat: no-repeat; background-position: center;
  display: flex; flex-direction: column; overflow: hidden; color: #e8d5a3;
  touch-action: manipulation; -webkit-touch-callout: none; -webkit-user-select: none;
  pointer-events: auto;
}
.bag-header[data-v-5aa104c9] { display: flex; align-items: center; justify-content: center; padding: 16px 20px 8px; flex-shrink: 0; position: relative;
}
.bag-title[data-v-5aa104c9] { font-family: 'GameFont'; font-size: 22px; color: #ffd700; text-shadow: 0 1px 4px rgba(0,0,0,0.9);
}
.close-btn[data-v-5aa104c9] { position: absolute; right: 20px; width: 32px; height: 32px; border: 1px solid #8b7355; border-radius: 4px; background: rgba(0,0,0,0.4); color: #ccc; font-size: 18px; cursor: pointer; font-family: 'GameFont';
}

/* 摊位格区 */
.stall-area[data-v-5aa104c9] { flex-shrink: 0; padding: 0 12px; margin-top: 35px; display: flex; flex-direction: column; gap: 4px;
}
.stall-grid[data-v-5aa104c9] { display: grid; grid-template-columns: repeat(10, 1fr); gap: 2px; pointer-events: auto;
}
.stall-detail-wrap[data-v-5aa104c9] { height: 130px; display: flex; flex-direction: column;
}

/* 背包格区（我的模式） */
.bag-middle[data-v-5aa104c9] { flex: 1 1 auto; display: flex; flex-direction: column; padding: 8px 12px; overflow: hidden;
}
.grid-wrapper[data-v-5aa104c9] { flex: 1; overflow-y: auto; pointer-events: auto; display: flex; flex-direction: column;
}
.item-grid[data-v-5aa104c9] { display: grid; grid-template-columns: repeat(10, 1fr); gap: 2px; pointer-events: auto; margin-top: auto; flex-shrink: 0;
}

/* 格子通用（与附魂选择界面一致） */
.item-slot[data-v-5aa104c9] { aspect-ratio: 1; background-image: url("/czjm/bb.png"); display: flex; flex-direction: column; align-items: center; justify-content: center; cursor: pointer; position: relative; font-size: 11px; font-family: 'GameFont'; touch-action: manipulation; -webkit-tap-highlight-color: transparent; pointer-events: auto;
}
.item-slot.filled[data-v-5aa104c9] { background: #111;
}
.item-slot.selected[data-v-5aa104c9] { border-color: #fff;
}
.slot-icon[data-v-5aa104c9] { width: 100%; height: 100%; object-fit: contain; font-size: 16px; image-rendering: pixelated;
}
.slot-count[data-v-5aa104c9] { position: absolute; bottom: 1px; right: 2px; font-size: 15px; font-weight: bold; color: #fff; text-shadow: 0 0 3px #000; font-family: 'GameFont';
}

/* 背包详情区（我的模式） */
.bag-bottom[data-v-5aa104c9] { flex: 0 0 20%; display: flex; flex-direction: column; padding: 4px 12px; margin-bottom: 0;
}

/* 金钱栏（与背包一致） */
.money-area[data-v-5aa104c9] { flex: 0 0 8%; display: flex; justify-content: space-between; align-items: center; padding: 4px 60px; font-size: 16px; font-family: 'GameFont';
}
.money-gold[data-v-5aa104c9] { color: #ffd700;
}
.money-yuanbao[data-v-5aa104c9] { color: #aae0ff;
}

/* ── 操作弹窗（与附魂选择界面/背包一致，背景色用全局 detail-card.css 的青色像素风） ── */
.menu-overlay[data-v-5aa104c9] {
  position: fixed; inset: 0; z-index: 99999;
  background: rgba(0,0,0,0.6);
  display: flex; align-items: center; justify-content: center;
}
.menu-box[data-v-5aa104c9] {
  display: flex; flex-direction: column; align-items: center;
  padding: 20px 28px 18px;
  position: relative;
  margin-top: -50%;
}
.menu-btns[data-v-5aa104c9] {
  display: flex; flex-direction: column; gap: 4px;
  width: 100%;
  align-items: center;
  justify-content: center;
  margin-top: 1%;
}
.menu-btn[data-v-5aa104c9] {
  width: 100%; padding: 8px 30px;
  background: #735131;
  border: 1px solid #ffd700;
  border-radius: 0;
  color: #f5d15f;
  font-family: 'GameFont'; font-size: 12px; letter-spacing: 2px;
  cursor: pointer; outline: none;
  transition: all 0.15s;
}
.menu-btn[data-v-5aa104c9]:hover {
  background: linear-gradient(180deg, #5a4a3a, #4a3a2a);
  border-color: #c9a84c;
  transform: translateY(-1px);
}
.menu-btn[data-v-5aa104c9]:active { transform: translateY(0);
}
.btn-return[data-v-5aa104c9] { margin-top: 2px;
}

/* ── 确认弹窗（与背包一致：青色 pixel-dialog-box） ── */
.modal-overlay[data-v-5aa104c9] {
  position: fixed; inset: 0; background: rgba(0,0,0,0.6); display: flex;
  align-items: center; justify-content: center; z-index: 200;
}
.modal-box[data-v-5aa104c9] {
  width: 300px; padding: 24px 20px 16px; border-radius: 8px;
}
.modal-header[data-v-5aa104c9] { text-align: center; padding-bottom: 12px;
}
.modal-title[data-v-5aa104c9] { color: #ffd700; font-size: 16px; font-weight: bold;
}
.modal-body[data-v-5aa104c9] { color: #ccc; font-size: 14px; text-align: center;
}
.confirm-qty-input[data-v-5aa104c9] {
  width: 60px; height: 32px; text-align: center; background: rgba(0,0,0,0.4);
  border: 1px solid #8b7355; border-radius: 4px; color: #fff; font-size: 16px; outline: none;
}
.confirm-qty-input.price-input[data-v-5aa104c9] { width: 100px;
}
.confirm-qty-btn[data-v-5aa104c9] {
  width: 32px; height: 32px; background: rgba(80,55,30,0.8); color: #ffd700;
  border: 1px solid #8b7355; border-radius: 4px; font-size: 16px; cursor: pointer;
}
.confirm-qty-btn[data-v-5aa104c9]:hover { background: #9a7350;
}
.confirm-qty[data-v-5aa104c9] { display: flex; align-items: center; justify-content: center; gap: 8px;
}
.sell-label[data-v-5aa104c9] { color: #e8d5a3; font-size: 14px; display: inline-block; width: 90px; text-align: right;
}
.confirm-qty-input[data-v-5aa104c9]::-webkit-outer-spin-button,
.confirm-qty-input[data-v-5aa104c9]::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0;
}
.confirm-qty-input[type=number][data-v-5aa104c9] { -moz-appearance: textfield;
}
.confirm-total[data-v-5aa104c9] { color: #ccc; font-size: 14px; margin-top: 8px;
}
.confirm-total-val[data-v-5aa104c9] { color: #ffd700; font-size: 16px; font-weight: bold;
}
.modal-actions[data-v-5aa104c9] { display: flex; gap: 16px; justify-content: center; margin-top: 16px;
}
.modal-btn[data-v-5aa104c9] {
  padding: 6px 24px; border: 1px solid #8b7355; border-radius: 4px;
  background: rgba(80,55,30,0.8); color: #ffd700; font-size: 14px; cursor: pointer;
}
.modal-btn[data-v-5aa104c9]:hover { background: #9a7350;
}
.modal-btn.confirm[data-v-5aa104c9] { background: rgba(30,80,30,0.8);
}
.modal-btn.confirm[data-v-5aa104c9]:hover { background: #3a8a3a;
}

/* ===== 以下样式完全照抄 TaskPanel.vue ===== */
.task-fullscreen[data-v-6bfc0f47] {
  position: absolute;
  top: 0; left: 0; width: 100%; height: 100%;
  z-index: 100; /* 高于聊天框(50/60)，确保覆盖底部聊天区域 */
  background-size: 100% 100%;
  background-repeat: no-repeat;
  background-position: center;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.task-header[data-v-6bfc0f47] {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 14px 20px;
  flex-shrink: 0;
  position: relative;
}
.task-title[data-v-6bfc0f47] {
  font-size: 18px; color: #ffd700;
  text-shadow: 0 1px 4px rgba(0,0,0,0.9);
}
.close-btn[data-v-6bfc0f47] {
  position: absolute;
  right: 16px;
  background: none; border: none; color: #ccc;
  font-size: 20px; cursor: pointer;
}
.task-body[data-v-6bfc0f47] {
  flex: 1;
  padding: 0 20px 20px;
  overflow-y: auto;
  scrollbar-width: none;
  -ms-overflow-style: none;
  position: relative;
  margin-top: 10%;
}
.task-body[data-v-6bfc0f47]::-webkit-scrollbar { display: none;
}
.task-list[data-v-6bfc0f47] {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-bottom: 14px;
}
.task-card[data-v-6bfc0f47] {
  display: flex;
  flex-direction: column;
  padding: 10px 12px;
  background: #03c4cd;
  border: 1px solid #009aa1;
  border-radius: 4px;
  gap: 6px;
  cursor: pointer;
}
.me-row[data-v-6bfc0f47] { background: rgba(255, 215, 0, 0.15); border-color: #ffd700;
}
/* 竞技英雄榜：一行三列（名次 / 名称 / 积分） */
.rank-row[data-v-6bfc0f47] {
  display: flex; align-items: center;
  padding: 10px 12px;
  background: #03c4cd;
  border: 1px solid #009aa1;
  border-radius: 4px;
  font-family: var(--game-font);
  font-size: 14px;
  color: #f0e6d3;
}
.col-rank[data-v-6bfc0f47] { width: 60px; color: #ffd700;
}
.col-name[data-v-6bfc0f47] { flex: 1; text-align: center;
}
.col-score[data-v-6bfc0f47] { width: 70px; text-align: right;
}
.task-name-wrap[data-v-6bfc0f47] {
  display: flex;
  align-items: center;
  gap: 8px;
}
.task-name[data-v-6bfc0f47] {
  font-family: var(--game-font);
  font-size: 14px;
  color: #f0e6d3;
  font-weight: bold;
}
.task-status[data-v-6bfc0f47] {
  font-family: var(--game-font);
  font-size: 12px;
  padding: 1px 6px;
  border-radius: 2px;
}
.task-desc[data-v-6bfc0f47] {
  font-family: var(--game-font);
  font-size: 12px;
  color: #d8fff8;
}
.empty-state[data-v-6bfc0f47] {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 50px 0;
  gap: 12px;
}
.empty-text[data-v-6bfc0f47] {
  font-family: var(--game-font);
  font-size: 14px;
  color: #ffffff;
}
.pagination[data-v-6bfc0f47] {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 12px;
  padding: 12px 0;
  flex-shrink: 0;
}
.page-btn[data-v-6bfc0f47] {
  padding: 6px 16px;
  background: #03c4cd;
  border: 1px solid #009aa1;
  color: #fff;
  font-family: var(--game-font);
  font-size: 13px;
  cursor: pointer;
}
.page-btn[data-v-6bfc0f47]:hover:not(:disabled) { background: #05d8e2;
}
.page-btn[data-v-6bfc0f47]:disabled { opacity: 0.5; cursor: not-allowed;
}
.page-info[data-v-6bfc0f47] {
  font-family: var(--game-font);
  font-size: 13px;
  color: #fff;
}

.mapaction-overlay[data-v-b13b5912] {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 60;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0, 0, 0, 0.3);
}
.mapaction-panel[data-v-b13b5912] {
  width: 260px;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 30px 20px 20px;
}
.mapaction-header[data-v-b13b5912] {
  margin-bottom: 20px;
}
.mapaction-title[data-v-b13b5912] {
  font-family: var(--game-font);
  font-size: 20px;
  color: #ffd700;
  text-shadow: 0 1px 4px rgba(0, 0, 0, 0.9);
}
.mapaction-body[data-v-b13b5912] {
  display: flex;
  flex-direction: column;
  gap: 10px;
  width: 100%;
}
.action-btn[data-v-b13b5912] {
  width: 100%;
  padding: 10px 0;
  border: 1px solid rgba(0, 240, 240, 0.55);
  border-radius: 4px;
  background: rgba(0, 30, 35, 0.35);
  cursor: pointer;
  transition: all 0.2s;
  font-family: var(--game-font);
  font-size: 14px;
  color: #d9f6fb;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.8);
}
.action-btn[data-v-b13b5912]:hover {
  background: rgba(0, 240, 240, 0.15);
  border-color: #00f0f0;
  color: #ffffff;
}

.worldmap-fullscreen[data-v-83f54282] {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 50;
  background-size: 100% 100%;
  background-repeat: no-repeat;
  background-position: center;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.worldmap-header[data-v-83f54282] {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 14px 20px;
  flex-shrink: 0;
  position: relative;
}
.worldmap-title[data-v-83f54282] {
  font-family: var(--game-font);
  font-size: 18px;
  color: #ffd700;
  text-shadow: 0 1px 4px rgba(0, 0, 0, 0.9);
}
.close-btn[data-v-83f54282] {
  position: absolute;
  right: 20px;
  width: 32px;
  height: 32px;
  border: 1px solid #8b7355;
  border-radius: 4px;
  background: rgba(0, 0, 0, 0.4);
  color: #ccc;
  font-size: 16px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s;
}
.close-btn[data-v-83f54282]:hover {
  background: rgba(200, 50, 50, 0.3);
  border-color: #e74c3c;
  color: #fff;
}
.worldmap-body[data-v-83f54282] {
  flex: 1;
  padding: 0 12px 8px;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  position: relative;
}
.map-canvas-wrapper[data-v-83f54282] {
  flex: 1;
  overflow: auto;
  position: relative;
  min-height: 0;
  margin-bottom: 0;
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.map-canvas-wrapper[data-v-83f54282]::-webkit-scrollbar {
  display: none;
}
.map-canvas[data-v-83f54282] {
  position: relative;
}
.map-lines[data-v-83f54282] {
  position: absolute;
  top: 0;
  left: 0;
  pointer-events: none;
}
.map-node[data-v-83f54282] {
  position: absolute;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  cursor: pointer;
  transition: all 0.2s;
  transform: translate(-50%, -50%);
  padding: 2px;
}
.node-icon[data-v-83f54282] {
  width: 40px;
  height: 40px;
  image-rendering: pixelated;
}
.avatar-icon[data-v-83f54282] {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 0%;
}
.avatar-wrap[data-v-83f54282] {
  width: 110px;
  height: 30px;
  overflow: hidden;
}
.node-arrow[data-v-83f54282] {
  font-size: 14px;
  color: #ffd700;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.9);
  line-height: 1;
  margin-bottom: 1px;
}
.node-label[data-v-83f54282] {
  font-family: var(--game-font);
  font-size: 14px;
  color: #ffd700;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.9);
  text-align: center;
  white-space: nowrap;
  margin-bottom: 3px;
}
.node-level[data-v-83f54282] {
  font-size: 11px;
  color: #aae0ff;
  margin-left: 2px;
}
.node-label-idle[data-v-83f54282] {
  font-size: 10px;
  color: #fff;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.9);
  margin-bottom: 1px;
}

/* ── 底部详情面板 ── */
.map-info-panel[data-v-83f54282] {
  flex-shrink: 0;
  border: 1px solid rgba(139, 115, 85, 0.4);
  border-radius: 4px;
  background: rgba(0, 0, 0, 0.6);
  padding: 8px 14px;
  margin-bottom: 4px;
}
.info-header[data-v-83f54282] {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 4px;
}
.info-name[data-v-83f54282] {
  font-family: var(--game-font);
  font-size: 14px;
  color: #ffd700;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.9);
}
.info-badge[data-v-83f54282] {
  font-family: var(--game-font);
  font-size: 11px;
  color: #aae0ff;
  padding: 1px 6px;
  border: 1px solid rgba(170, 224, 255, 0.4);
  border-radius: 3px;
}
.info-level[data-v-83f54282] {
  font-family: var(--game-font);
  font-size: 11px;
  color: #8bc34a;
}
.info-body[data-v-83f54282] {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.info-row[data-v-83f54282] {
  display: flex;
  align-items: flex-start;
  gap: 4px;
}
.info-label[data-v-83f54282] {
  font-family: var(--game-font);
  font-size: 12px;
  color: #aaa;
  white-space: nowrap;
  flex-shrink: 0;
}
.info-value[data-v-83f54282] {
  font-family: var(--game-font);
  font-size: 12px;
  color: #ddd;
  line-height: 1.4;
}

/* ── 底部快捷跳转栏 ── */
.worldmap-footer[data-v-83f54282] {
  flex-shrink: 0;
  display: flex;
  gap: 40%;
  padding: 17px 70px 7px;
}
.footer-btn[data-v-83f54282] {
  flex: 1;
  padding: 5px 0;
  border: 1px solid #009aa1;
  border-radius: 1px;
  background: #03c4cd;
  color: #ffd700;
  font-family: var(--game-font);
  font-size: 14px;
  cursor: pointer;
  transition: all 0.2s;
}
.footer-btn[data-v-83f54282]:hover {
  background: linear-gradient(180deg, #03c4cd, #009aa1);
  border-color: #ffffff; transform: translateY(-1px);
}
.footer-btn[data-v-83f54282]:active { transform: translateY(0);
}

.modal-overlay[data-v-86008323] {
  position: fixed;
  inset: 0;
  z-index: 9999;
  background: rgba(0, 0, 0, 0.6);
  display: flex;
  align-items: center;
  justify-content: center;
}
.modal-box[data-v-86008323] {
  padding: 24px 28px 18px;
  min-width: 260px;
  max-width: 300px;
  margin-top: -45%;
}
.modal-header[data-v-86008323] {
  text-align: center;
  margin-bottom: 16px;
}
.modal-title[data-v-86008323] {
  font-family: var(--game-font);
  font-size: 20px;
  font-weight: bold;
  color: #ffd700;
  text-shadow: 0 1px 4px rgba(0, 0, 0, 0.9);
}
.modal-body[data-v-86008323] {
  font-size: 13px;
  color: #e8d5a3;
  line-height: 1.5;
  margin-bottom: 14px;
  text-align: center;
  font-family: var(--game-font);
}
.modal-actions[data-v-86008323] {
  display: flex;
  gap: 16px;
  justify-content: center;
}
.modal-btn[data-v-86008323] {
  min-width: 100px;
  padding: 10px 24px;
  border: 1px solid #7a5938;
  border-radius: 8px;
  font-size: 14px;
  cursor: pointer;
  transition: all 0.2s;
  font-family: var(--game-font);
}
.modal-btn.confirm[data-v-86008323] {
  background: #7a5938;
  color: #fff;
}
.modal-btn.confirm[data-v-86008323]:hover {
  background: #9a7350;
}
.modal-btn.cancel[data-v-86008323] {
  background: transparent;
  color: #a09080;
}
.modal-btn.cancel[data-v-86008323]:hover {
  background: rgba(255, 255, 255, 0.05);
  color: #e0d0c0;
}
.modal-fade-enter-active[data-v-86008323],
.modal-fade-leave-active[data-v-86008323] {
  transition: opacity 0.25s ease;
}
.modal-fade-enter-from[data-v-86008323],
.modal-fade-leave-to[data-v-86008323] {
  opacity: 0;
}

.pvp-overlay[data-v-591e863b] {
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  z-index: 60;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0, 0, 0, 0.3);
}
.pvp-panel[data-v-591e863b] {
  width: 280px;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 30px 20px 20px;
}
.pvp-header[data-v-591e863b] { margin-bottom: 16px;
}
.pvp-title[data-v-591e863b] {
  font-family: var(--game-font);
  font-size: 22px;
  color: #ffd700;
  text-shadow: 0 1px 4px rgba(0,0,0,0.9);
}
.pvp-body[data-v-591e863b] {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  width: 100%;
}
.pvp-info[data-v-591e863b] {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  margin-bottom: 8px;
}
.pvp-from[data-v-591e863b] {
  font-family: var(--game-font);
  font-size: 16px;
  color: #fff;
}
.pvp-desc[data-v-591e863b] {
  font-family: var(--game-font);
  font-size: 13px;
  color: #fff;
}
.action-btn[data-v-591e863b] {
  width: 100%;
  padding: 10px 0;
  border: 1px solid rgba(139,115,85,0.6);
  border-radius: 4px;
  background: rgba(0,0,0,0.5);
  cursor: pointer;
  font-family: var(--game-font);
  font-size: 14px;
  color: #e8d5a3;
  text-shadow: 0 1px 2px rgba(0,0,0,0.8);
}
.accept-btn[data-v-591e863b]:hover { background: rgba(255,215,0,0.2); border-color: #ffd700; color: #ffd700;
}
.reject-btn[data-v-591e863b]:hover { background: rgba(200,50,50,0.2); border-color: #ff4444; color: #ff4444;
}

/* ── 全屏遮罩 ── */
.npc-overlay[data-v-35b4d72d] {
  position: fixed;
  inset: 0;
  z-index: 20;
  background: rgba(0, 0, 0, 0.65);
  display: flex;
  align-items: center;
  justify-content: center;
}

/* 弹窗打开后 350ms 内禁用交互（触摸穿透保护）：手指按下时弹窗出现，
   抬起(touchend)会落在按钮上造成误触；此期间让事件穿透到画布(无害)，之后恢复可点 */
.npc-container.no-interact[data-v-35b4d72d],
.npc-container.no-interact[data-v-35b4d72d] * {
  pointer-events: none;
}

/* ── 容器（1:1 照抄 对话框.html 的 .dialog-box） ── */
.npc-container[data-v-35b4d72d] {
  width: 380px;
  height: 500px;
  background: #1a5f6a;
  border: 4px solid #00e5e5;
  position: relative;
  box-sizing: border-box;
  box-shadow:
    inset 0 0 0 3px #0d3d45,
    0 0 0 2px #00e5e5;
  display: flex;
  flex-direction: column;
  margin-top: -60%;
}

/* === 四角花纹 —— 完全照抄 对话框.html 的实现 === */
.npc-container .corner[data-v-35b4d72d] {
  position: absolute;
  width: 1px;
  height: 1px;
  background: transparent;
  pointer-events: none;
  box-shadow:
    3px 0px #00e5e5, 4px 0px #00e5e5, 5px 0px #00e5e5, 6px 0px #00e5e5, 7px 0px #00e5e5, 8px 0px #00e5e5,
    11px 0px #00e5e5, 12px 0px #00e5e5, 13px 0px #00e5e5, 14px 0px #00e5e5, 15px 0px #00e5e5, 16px 0px #00e5e5,
    19px 0px #00e5e5, 20px 0px #00e5e5, 21px 0px #00e5e5, 22px 0px #00e5e5, 23px 0px #00e5e5, 24px 0px #00e5e5, 25px 0px #00e5e5, 26px 0px #00e5e5,
    3px 1px #00e5e5, 4px 1px #00e5e5, 5px 1px #00e5e5, 6px 1px #00e5e5, 7px 1px #00e5e5, 8px 1px #00e5e5,
    11px 1px #00e5e5, 12px 1px #00e5e5, 13px 1px #00e5e5, 14px 1px #00e5e5, 15px 1px #00e5e5, 16px 1px #00e5e5,
    19px 1px #00e5e5, 20px 1px #00e5e5, 21px 1px #00e5e5, 22px 1px #00e5e5, 23px 1px #00e5e5, 24px 1px #00e5e5, 25px 1px #00e5e5, 26px 1px #00e5e5,
    3px 2px #00e5e5, 4px 2px #00e5e5, 7px 2px #00e5e5, 8px 2px #00e5e5,
    11px 2px #00e5e5, 12px 2px #00e5e5, 15px 2px #00e5e5, 16px 2px #00e5e5,
    19px 2px #00e5e5, 20px 2px #00e5e5, 25px 2px #00e5e5, 26px 2px #00e5e5,
    3px 3px #00e5e5, 4px 3px #00e5e5, 7px 3px #00e5e5, 8px 3px #00e5e5,
    11px 3px #00e5e5, 12px 3px #00e5e5, 15px 3px #00e5e5, 16px 3px #00e5e5,
    19px 3px #00e5e5, 20px 3px #00e5e5, 25px 3px #00e5e5, 26px 3px #00e5e5,
    3px 4px #00e5e5, 4px 4px #00e5e5, 5px 4px #00e5e5, 6px 4px #00e5e5, 7px 4px #00e5e5, 8px 4px #00e5e5, 9px 4px #00e5e5, 10px 4px #00e5e5, 11px 4px #00e5e5, 12px 4px #00e5e5, 13px 4px #00e5e5, 14px 4px #00e5e5, 15px 4px #00e5e5, 16px 4px #00e5e5,
    19px 4px #00e5e5, 20px 4px #00e5e5, 23px 4px #00e5e5, 24px 4px #00e5e5, 25px 4px #00e5e5, 26px 4px #00e5e5,
    3px 5px #00e5e5, 4px 5px #00e5e5, 5px 5px #00e5e5, 6px 5px #00e5e5, 7px 5px #00e5e5, 8px 5px #00e5e5, 9px 5px #00e5e5, 10px 5px #00e5e5, 11px 5px #00e5e5, 12px 5px #00e5e5, 13px 5px #00e5e5, 14px 5px #00e5e5, 15px 5px #00e5e5, 16px 5px #00e5e5,
    19px 5px #00e5e5, 20px 5px #00e5e5, 23px 5px #00e5e5, 24px 5px #00e5e5, 25px 5px #00e5e5, 26px 5px #00e5e5,
    7px 6px #00e5e5, 8px 6px #00e5e5, 11px 6px #00e5e5, 12px 6px #00e5e5, 19px 6px #00e5e5, 20px 6px #00e5e5,
    7px 7px #00e5e5, 8px 7px #00e5e5, 11px 7px #00e5e5, 12px 7px #00e5e5, 19px 7px #00e5e5, 20px 7px #00e5e5,
    3px 8px #00e5e5, 4px 8px #00e5e5, 5px 8px #00e5e5, 6px 8px #00e5e5, 7px 8px #00e5e5, 8px 8px #00e5e5, 9px 8px #00e5e5, 10px 8px #00e5e5, 11px 8px #00e5e5, 12px 8px #00e5e5, 13px 8px #00e5e5, 14px 8px #00e5e5, 15px 8px #00e5e5, 16px 8px #00e5e5, 17px 8px #00e5e5, 18px 8px #00e5e5, 19px 8px #00e5e5, 20px 8px #00e5e5,
    3px 9px #00e5e5, 4px 9px #00e5e5, 5px 9px #00e5e5, 6px 9px #00e5e5, 7px 9px #00e5e5, 8px 9px #00e5e5, 9px 9px #00e5e5, 10px 9px #00e5e5, 11px 9px #00e5e5, 12px 9px #00e5e5, 13px 9px #00e5e5, 14px 9px #00e5e5, 15px 9px #00e5e5, 16px 9px #00e5e5, 17px 9px #00e5e5, 18px 9px #00e5e5, 19px 9px #00e5e5, 20px 9px #00e5e5,
    3px 10px #00e5e5, 4px 10px #00e5e5, 7px 10px #00e5e5, 8px 10px #00e5e5, 11px 10px #00e5e5, 12px 10px #00e5e5,
    3px 11px #00e5e5, 4px 11px #00e5e5, 7px 11px #00e5e5, 8px 11px #00e5e5, 11px 11px #00e5e5, 12px 11px #00e5e5,
    3px 12px #00e5e5, 4px 12px #00e5e5, 5px 12px #00e5e5, 6px 12px #00e5e5, 7px 12px #00e5e5, 8px 12px #00e5e5, 11px 12px #00e5e5, 12px 12px #00e5e5,
    3px 13px #00e5e5, 4px 13px #00e5e5, 5px 13px #00e5e5, 6px 13px #00e5e5, 7px 13px #00e5e5, 8px 13px #00e5e5, 11px 13px #00e5e5, 12px 13px #00e5e5,
    11px 14px #00e5e5, 12px 14px #00e5e5,
    11px 15px #00e5e5, 12px 15px #00e5e5,
    3px 16px #00e5e5, 4px 16px #00e5e5, 5px 16px #00e5e5, 6px 16px #00e5e5, 7px 16px #00e5e5, 8px 16px #00e5e5, 9px 16px #00e5e5, 10px 16px #00e5e5, 11px 16px #00e5e5, 12px 16px #00e5e5,
    3px 17px #00e5e5, 4px 17px #00e5e5, 5px 17px #00e5e5, 6px 17px #00e5e5, 7px 17px #00e5e5, 8px 17px #00e5e5, 9px 17px #00e5e5, 10px 17px #00e5e5, 11px 17px #00e5e5, 12px 17px #00e5e5,
    3px 18px #00e5e5, 4px 18px #00e5e5,
    3px 19px #00e5e5, 4px 19px #00e5e5,
    3px 20px #00e5e5, 4px 20px #00e5e5, 7px 20px #00e5e5, 8px 20px #00e5e5,
    3px 21px #00e5e5, 4px 21px #00e5e5, 7px 21px #00e5e5, 8px 21px #00e5e5,
    3px 22px #00e5e5, 4px 22px #00e5e5, 5px 22px #00e5e5, 6px 22px #00e5e5, 7px 22px #00e5e5, 8px 22px #00e5e5;
}

/* 左上角 */
.npc-container .corner.tl[data-v-35b4d72d] {
  top: 5px;
  left: 4px;
}

/* 右上角 —— 水平翻转 */
.npc-container .corner.tr[data-v-35b4d72d] {
  top: 5px;
  right: 4px;
  transform: scaleX(-1);
}

/* 左下角 —— 垂直翻转 */
.npc-container .corner.bl[data-v-35b4d72d] {
  bottom: 5px;
  left: 4px;
  transform: scaleY(-1);
}

/* 右下角 —— 水平+垂直翻转 */
.npc-container .corner.br[data-v-35b4d72d] {
  bottom: 5px;
  right: 4px;
  transform: scale(-1, -1);
}

/* === 顶部标题框（1:1 照抄 对话框.html） === */
.title-bar[data-v-35b4d72d] {
  position: absolute;
  top: 20px;
  left: 50%;
  transform: translateX(-50%);
  width: 200px;
  height: 44px;
  background: #8b6239;
  border: 3px solid #d4a76a;
  box-shadow:
    inset 0 0 0 2px #5a3a1b,
    inset 2px 2px 0 0 rgba(255, 255, 255, 0.1);
  display: flex;
  align-items: center;
  justify-content: center;
}
.npc-title[data-v-35b4d72d] {
  font-family: var(--game-font);
  font-size: 16px;
  font-weight: bold;
  color: #fbe9c8;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
}
.close-btn[data-v-35b4d72d] {
  position: absolute;
  right: 6px;
  top: 50%;
  transform: translateY(-50%);
  background: none;
  border: none;
  color: #fbe9c8;
  font-size: 18px;
  cursor: pointer;
  line-height: 1;
  padding: 2px 4px;
}
.close-btn[data-v-35b4d72d]:hover {
  color: #fff;
}

/* === 菱形宝石装饰（1:1 照抄 对话框.html） === */
.gem[data-v-35b4d72d] {
  position: absolute;
  top: 26px;
  width: 28px;
  height: 28px;
  background: linear-gradient(135deg, #e1f5fe 0%, #81d4fa 50%, #4fc3f7 100%);
  transform: rotate(45deg);
  border: 2px solid #b3e5fc;
  box-shadow:
    inset 2px 2px 0 0 rgba(255, 255, 255, 0.8),
    inset -2px -2px 0 0 rgba(0, 150, 200, 0.3),
    0 0 4px rgba(79, 195, 247, 0.5);
}
.gem[data-v-35b4d72d]::after {
  content: '';
  position: absolute;
  top: 4px; left: 4px;
  width: 8px; height: 8px;
  background: rgba(255, 255, 255, 0.7);
  border-radius: 50%;
  filter: blur(1px);
}
.gem-left[data-v-35b4d72d] { left: 50px;
}
.gem-right[data-v-35b4d72d] { right: 50px;
}

/* 内部内容区域（1:1 照抄 对话框.html 的 .content） */
.content[data-v-35b4d72d] {
  position: absolute;
  top: 80px;
  left: 24px;
  right: 24px;
  bottom: 24px;
  padding: 16px;
  color: #b2ebf2;
  font-size: 14px;
  line-height: 1.8;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  min-height: 0;
}

/* ── 中间内容：左图右文 ── */
.npc-body[data-v-35b4d72d] {
  display: flex;
  align-items: flex-start;
  padding: 4px 0;
  gap: 16px;
  flex-shrink: 0;
}

/* 左侧：NPC 图片（变小 + 去背景去边框） */
.npc-image-wrap[data-v-35b4d72d] {
  flex-shrink: 0;
  width: 70px;
  height: 70px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.npc-image[data-v-35b4d72d] {
  max-width: 64px;
  max-height: 64px;
  object-fit: contain;
  image-rendering: pixelated;
}

/* 加载失败时的文字头像兜底（避免黑框） */
.npc-image-fallback[data-v-35b4d72d] {
  width: 60px;
  height: 60px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(120, 80, 30, 0.55);
  border: 1px solid #ffd700;
  color: #ffd700;
  font-family: var(--game-font);
  font-size: 26px;
  font-weight: bold;
}

/* 右侧：内容区 */
.npc-content[data-v-35b4d72d] {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  gap: 10px;
  min-height: 60px;
}
.dialog-text[data-v-35b4d72d] {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.dialog-line[data-v-35b4d72d] {
  font-size: 14px;
  color: #b2ebf2;
  line-height: 1.8;
  font-family: var(--game-font);
  margin: 0;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.8);
}
.loading-text[data-v-35b4d72d] {
  font-size: 16px;
  color: #ffd700;
  text-align: center;
  font-family: var(--game-font);
  animation: blink-35b4d72d 0.8s step-end infinite;
}
@keyframes blink-35b4d72d {
50% { opacity: 0.4;
}
}
.result-area[data-v-35b4d72d] {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.result-text[data-v-35b4d72d] {
  white-space: pre-line;
  word-break: break-word;
  font-size: 14px;
  font-weight: bold;
  font-family: var(--game-font);
}
.result-text.success[data-v-35b4d72d] {
  color: #7cff7c;
}
.result-text.error[data-v-35b4d72d] {
  color: #ff6b6b;
}
.rewards-list[data-v-35b4d72d] {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.reward-item[data-v-35b4d72d] {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  font-family: var(--game-font);
}
.reward-icon[data-v-35b4d72d] {
  color: #ffd700;
  font-size: 14px;
}
.reward-name[data-v-35b4d72d] {
  color: #ffd700;
}

/* ── 底部操作区 ── */
.npc-footer[data-v-35b4d72d] {
  margin-top: auto;
  padding: 10px 0 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
  flex-shrink: 0;
}
.footer-divider[data-v-35b4d72d] {
  height: 1px;
  background: linear-gradient(
    to right,
    transparent,
    rgba(178, 235, 242, 0.35),
    transparent
  );
}
.footer-actions[data-v-35b4d72d] {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
}
.btn-all[data-v-35b4d72d] {
  border-color: #ffd700;
  color: #fff;
  background: #8a5a1a;
  font-weight: bold;
}
.btn-claim[data-v-35b4d72d] {
  padding: 6px 20px;
  min-width: 250px;
  background: #735131;
  border: 1px solid #ffd700;
  border-radius: 0;
  color: #f5d15f;
  font-family: var(--game-font);
  font-size: 13px;
  letter-spacing: 2px;
  cursor: pointer;
  transition: all 0.15s;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
  outline: none;
}
.btn-claim[data-v-35b4d72d]:hover {
  background: linear-gradient(180deg, #5a4a3a, #4a3a2a);
  border-color: #c9a84c;
  transform: translateY(-1px);
}
.btn-claim[data-v-35b4d72d]:active {
  transform: translateY(0);
}
.btn-ok[data-v-35b4d72d] {
  padding: 6px 20px;
  min-width: 250px;
  background: #735131;
  border: 1px solid #ffd700;
  border-radius: 0;
  color: #f5d15f;
  font-family: var(--game-font);
  font-size: 13px;
  letter-spacing: 2px;
  cursor: pointer;
  transition: all 0.15s;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
  outline: none;
}
.btn-ok[data-v-35b4d72d]:hover {
  background: linear-gradient(180deg, #5a4a3a, #4a3a2a);
  border-color: #c9a84c;
  transform: translateY(-1px);
}
.btn-ok[data-v-35b4d72d]:active {
  transform: translateY(0);
}
.btn-cancel[data-v-35b4d72d] {
  padding: 4px 16px;
  background: transparent;
  border: 1px solid #8b7355;
  border-radius: 0;
  color: #a09080;
  font-family: var(--game-font);
  font-size: 12px;
  cursor: pointer;
}

/* ── 过渡动画 ── */
.modal-fade-enter-active[data-v-35b4d72d],
.modal-fade-leave-active[data-v-35b4d72d] {
  transition: opacity 0.25s ease;
}
.modal-fade-enter-from[data-v-35b4d72d],
.modal-fade-leave-to[data-v-35b4d72d] {
  opacity: 0;
}

/* ── 更新公告详情（离队通知样式：confirm-dialog pixel-dialog-box） ── */
.confirm-overlay[data-v-35b4d72d] {
  position: fixed; top: 0; left: 0; width: 100%; height: 100%;
  background: rgba(0, 0, 0, 0.55);
  display: flex; align-items: center; justify-content: center;
  z-index: 99999;
  transform: translateY(-100px); /* 弹窗整体上移 500px */
}
.confirm-dialog[data-v-35b4d72d] { padding: 30px 40px 20px; text-align: center; min-width: 260px; max-width: 320px;
}
.confirm-title[data-v-35b4d72d] { font-family: 'GameFont'; font-size: 16px; color: #ffd700; font-weight: bold; margin-bottom: 10px; letter-spacing: 2px;
}
.notice-content[data-v-35b4d72d] {
  font-family: 'GameFont'; font-size: 14px; color: #f0e6d3; line-height: 1.7; text-align: left;
  max-height: 240px; overflow-y: auto; margin-bottom: 18px; white-space: pre-wrap; word-break: break-all;
  background: rgba(0,0,0,0.2); border: 1px solid rgba(139,115,85,0.4); border-radius: 4px; padding: 10px 12px;
}
.notice-content[data-v-35b4d72d]::-webkit-scrollbar { display: none; width: 0; height: 0;
}
.notice-content[data-v-35b4d72d] { scrollbar-width: none; -ms-overflow-style: none;
}
.confirm-btns[data-v-35b4d72d] { display: flex; gap: 16px; justify-content: center;
}
.confirm-btn[data-v-35b4d72d] { padding: 8px 24px; border: 1px solid; border-radius: 3px; font-family: 'GameFont'; font-size: 13px; cursor: pointer; transition: all 0.2s;
}
.confirm-yes-ok[data-v-35b4d72d] { background: rgba(60, 140, 70, 0.25); border-color: #4a8a50; color: #c8e8c0;
}
.confirm-yes-ok[data-v-35b4d72d]:hover { background: rgba(60, 140, 70, 0.5); color: #fff;
}
.imm-overlay[data-v-301e0c32] {
  position: fixed;
  inset: 0;
  z-index: 21;
  background: rgba(0, 0, 0, 0.65);
  display: flex;
  align-items: center;
  justify-content: center;
}
.imm-container[data-v-301e0c32] {
  width: 380px;
  height: 460px;
  background: #1a5f6a;
  border: 4px solid #00e5e5;
  position: relative;
  box-sizing: border-box;
  box-shadow:
    inset 0 0 0 3px #0d3d45,
    0 0 0 2px #00e5e5;
  display: flex;
  flex-direction: column;
  margin-top: -60%;
}
.imm-container .corner[data-v-301e0c32] {
  position: absolute;
  width: 1px;
  height: 1px;
  background: transparent;
  pointer-events: none;
  box-shadow:
    3px 0px #00e5e5, 4px 0px #00e5e5, 5px 0px #00e5e5, 6px 0px #00e5e5, 7px 0px #00e5e5, 8px 0px #00e5e5,
    11px 0px #00e5e5, 12px 0px #00e5e5, 13px 0px #00e5e5, 14px 0px #00e5e5, 15px 0px #00e5e5, 16px 0px #00e5e5,
    19px 0px #00e5e5, 20px 0px #00e5e5, 21px 0px #00e5e5, 22px 0px #00e5e5, 23px 0px #00e5e5, 24px 0px #00e5e5, 25px 0px #00e5e5, 26px 0px #00e5e5,
    3px 1px #00e5e5, 4px 1px #00e5e5, 5px 1px #00e5e5, 6px 1px #00e5e5, 7px 1px #00e5e5, 8px 1px #00e5e5,
    11px 1px #00e5e5, 12px 1px #00e5e5, 13px 1px #00e5e5, 14px 1px #00e5e5, 15px 1px #00e5e5, 16px 1px #00e5e5,
    19px 1px #00e5e5, 20px 1px #00e5e5, 21px 1px #00e5e5, 22px 1px #00e5e5, 23px 1px #00e5e5, 24px 1px #00e5e5, 25px 1px #00e5e5, 26px 1px #00e5e5,
    3px 2px #00e5e5, 4px 2px #00e5e5, 7px 2px #00e5e5, 8px 2px #00e5e5,
    11px 2px #00e5e5, 12px 2px #00e5e5, 15px 2px #00e5e5, 16px 2px #00e5e5,
    19px 2px #00e5e5, 20px 2px #00e5e5, 25px 2px #00e5e5, 26px 2px #00e5e5,
    3px 3px #00e5e5, 4px 3px #00e5e5, 7px 3px #00e5e5, 8px 3px #00e5e5,
    11px 3px #00e5e5, 12px 3px #00e5e5, 15px 3px #00e5e5, 16px 3px #00e5e5,
    19px 3px #00e5e5, 20px 3px #00e5e5, 25px 3px #00e5e5, 26px 3px #00e5e5,
    3px 4px #00e5e5, 4px 4px #00e5e5, 5px 4px #00e5e5, 6px 4px #00e5e5, 7px 4px #00e5e5, 8px 4px #00e5e5, 9px 4px #00e5e5, 10px 4px #00e5e5, 11px 4px #00e5e5, 12px 4px #00e5e5, 13px 4px #00e5e5, 14px 4px #00e5e5, 15px 4px #00e5e5, 16px 4px #00e5e5,
    19px 4px #00e5e5, 20px 4px #00e5e5, 23px 4px #00e5e5, 24px 4px #00e5e5, 25px 4px #00e5e5, 26px 4px #00e5e5,
    3px 5px #00e5e5, 4px 5px #00e5e5, 5px 5px #00e5e5, 6px 5px #00e5e5, 7px 5px #00e5e5, 8px 5px #00e5e5, 9px 5px #00e5e5, 10px 5px #00e5e5, 11px 5px #00e5e5, 12px 5px #00e5e5, 13px 5px #00e5e5, 14px 5px #00e5e5, 15px 5px #00e5e5, 16px 5px #00e5e5,
    19px 5px #00e5e5, 20px 5px #00e5e5, 23px 5px #00e5e5, 24px 5px #00e5e5, 25px 5px #00e5e5, 26px 5px #00e5e5,
    7px 6px #00e5e5, 8px 6px #00e5e5, 11px 6px #00e5e5, 12px 6px #00e5e5, 19px 6px #00e5e5, 20px 6px #00e5e5,
    7px 7px #00e5e5, 8px 7px #00e5e5, 11px 7px #00e5e5, 12px 7px #00e5e5, 19px 7px #00e5e5, 20px 7px #00e5e5,
    3px 8px #00e5e5, 4px 8px #00e5e5, 5px 8px #00e5e5, 6px 8px #00e5e5, 7px 8px #00e5e5, 8px 8px #00e5e5, 9px 8px #00e5e5, 10px 8px #00e5e5, 11px 8px #00e5e5, 12px 8px #00e5e5, 13px 8px #00e5e5, 14px 8px #00e5e5, 15px 8px #00e5e5, 16px 8px #00e5e5, 17px 8px #00e5e5, 18px 8px #00e5e5, 19px 8px #00e5e5, 20px 8px #00e5e5,
    3px 9px #00e5e5, 4px 9px #00e5e5, 5px 9px #00e5e5, 6px 9px #00e5e5, 7px 9px #00e5e5, 8px 9px #00e5e5, 9px 9px #00e5e5, 10px 9px #00e5e5, 11px 9px #00e5e5, 12px 9px #00e5e5, 13px 9px #00e5e5, 14px 9px #00e5e5, 15px 9px #00e5e5, 16px 9px #00e5e5, 17px 9px #00e5e5, 18px 9px #00e5e5, 19px 9px #00e5e5, 20px 9px #00e5e5,
    3px 10px #00e5e5, 4px 10px #00e5e5, 7px 10px #00e5e5, 8px 10px #00e5e5, 11px 10px #00e5e5, 12px 10px #00e5e5,
    3px 11px #00e5e5, 4px 11px #00e5e5, 7px 11px #00e5e5, 8px 11px #00e5e5, 11px 11px #00e5e5, 12px 11px #00e5e5,
    3px 12px #00e5e5, 4px 12px #00e5e5, 5px 12px #00e5e5, 6px 12px #00e5e5, 7px 12px #00e5e5, 8px 12px #00e5e5, 11px 12px #00e5e5, 12px 12px #00e5e5,
    3px 13px #00e5e5, 4px 13px #00e5e5, 5px 13px #00e5e5, 6px 13px #00e5e5, 7px 13px #00e5e5, 8px 13px #00e5e5, 11px 13px #00e5e5, 12px 13px #00e5e5,
    11px 14px #00e5e5, 12px 14px #00e5e5,
    11px 15px #00e5e5, 12px 15px #00e5e5,
    3px 16px #00e5e5, 4px 16px #00e5e5, 5px 16px #00e5e5, 6px 16px #00e5e5, 7px 16px #00e5e5, 8px 16px #00e5e5, 9px 16px #00e5e5, 10px 16px #00e5e5, 11px 16px #00e5e5, 12px 16px #00e5e5,
    3px 17px #00e5e5, 4px 17px #00e5e5, 5px 17px #00e5e5, 6px 17px #00e5e5, 7px 17px #00e5e5, 8px 17px #00e5e5, 9px 17px #00e5e5, 10px 17px #00e5e5, 11px 17px #00e5e5, 12px 17px #00e5e5,
    3px 18px #00e5e5, 4px 18px #00e5e5,
    3px 19px #00e5e5, 4px 19px #00e5e5,
    3px 20px #00e5e5, 4px 20px #00e5e5, 7px 20px #00e5e5, 8px 20px #00e5e5,
    3px 21px #00e5e5, 4px 21px #00e5e5, 7px 21px #00e5e5, 8px 21px #00e5e5,
    3px 22px #00e5e5, 4px 22px #00e5e5, 5px 22px #00e5e5, 6px 22px #00e5e5, 7px 22px #00e5e5, 8px 22px #00e5e5;
}
.imm-container .corner.tl[data-v-301e0c32] { top: 5px; left: 4px;
}
.imm-container .corner.tr[data-v-301e0c32] { top: 5px; right: 4px; transform: scaleX(-1);
}
.imm-container .corner.bl[data-v-301e0c32] { bottom: 5px; left: 4px; transform: scaleY(-1);
}
.imm-container .corner.br[data-v-301e0c32] { bottom: 5px; right: 4px; transform: scale(-1, -1);
}
.title-bar[data-v-301e0c32] {
  position: absolute;
  top: 20px;
  left: 50%;
  transform: translateX(-50%);
  width: 200px;
  height: 44px;
  background: #8b6239;
  border: 3px solid #d4a76a;
  box-shadow:
    inset 0 0 0 2px #5a3a1b,
    inset 2px 2px 0 0 rgba(255, 255, 255, 0.1);
  display: flex;
  align-items: center;
  justify-content: center;
}
.imm-title[data-v-301e0c32] {
  font-family: var(--game-font);
  font-size: 16px;
  font-weight: bold;
  color: #fbe9c8;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
}
.gem[data-v-301e0c32] {
  position: absolute;
  top: 26px;
  width: 28px;
  height: 28px;
  background: linear-gradient(135deg, #e1f5fe 0%, #81d4fa 50%, #4fc3f7 100%);
  transform: rotate(45deg);
  border: 2px solid #b3e5fc;
  box-shadow:
    inset 2px 2px 0 0 rgba(255, 255, 255, 0.8),
    inset -2px -2px 0 0 rgba(0, 150, 200, 0.3),
    0 0 4px rgba(79, 195, 247, 0.5);
}
.gem[data-v-301e0c32]::after {
  content: '';
  position: absolute;
  top: 4px; left: 4px;
  width: 8px; height: 8px;
  background: rgba(255, 255, 255, 0.7);
  border-radius: 50%;
  filter: blur(1px);
}
.gem-left[data-v-301e0c32] { left: 50px;
}
.gem-right[data-v-301e0c32] { right: 50px;
}
.content[data-v-301e0c32] {
  position: absolute;
  top: 80px;
  left: 24px;
  right: 24px;
  bottom: 24px;
  padding: 16px;
  color: #b2ebf2;
  font-size: 14px;
  line-height: 1.8;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  min-height: 0;
}
.imm-body[data-v-301e0c32] {
  display: flex;
  align-items: flex-start;
  padding: 4px 0;
  gap: 16px;
  flex-shrink: 0;
}
.imm-image-wrap[data-v-301e0c32] {
  flex-shrink: 0;
  width: 78px;
  height: 78px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.imm-image[data-v-301e0c32] {
  max-width: 72px;
  max-height: 72px;
  object-fit: contain;
  image-rendering: pixelated;
}
.imm-image-fallback[data-v-301e0c32] {
  width: 60px;
  height: 60px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(120, 80, 30, 0.55);
  border: 1px solid #ffd700;
  color: #ffd700;
  font-family: var(--game-font);
  font-size: 26px;
  font-weight: bold;
}
.imm-content[data-v-301e0c32] {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  gap: 10px;
  min-height: 60px;
}
.imm-line[data-v-301e0c32] {
  font-size: 14px;
  color: #b2ebf2;
  line-height: 1.8;
  font-family: var(--game-font);
  margin: 0;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.8);
}
.lock-tip[data-v-301e0c32] {
  font-family: var(--game-font);
  font-size: 13px;
  color: #ff8a65;
}
.lock-tip.free[data-v-301e0c32] {
  color: #7cff7c;
}
.loading-text[data-v-301e0c32] {
  font-size: 16px;
  color: #ffd700;
  text-align: center;
  font-family: var(--game-font);
  animation: blink-301e0c32 0.8s step-end infinite;
}
@keyframes blink-301e0c32 {
50% { opacity: 0.4;
}
}
.result-text[data-v-301e0c32] {
  font-size: 15px;
  font-family: var(--game-font);
}
.result-text.error[data-v-301e0c32] {
  color: #ff6b6b;
}
.imm-footer[data-v-301e0c32] {
  margin-top: auto;
  padding: 10px 0 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
  flex-shrink: 0;
}
.footer-divider[data-v-301e0c32] {
  height: 1px;
  background: linear-gradient(to right, transparent, rgba(178, 235, 242, 0.35), transparent);
}
.footer-actions[data-v-301e0c32] {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
}
.btn-battle[data-v-301e0c32] {
  padding: 6px 20px;
  min-width: 250px;
  background: #7a3020;
  border: 1px solid #ff7043;
  border-radius: 0;
  color: #ffd7c2;
  font-family: var(--game-font);
  font-size: 13px;
  letter-spacing: 2px;
  cursor: pointer;
  transition: all 0.15s;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
  outline: none;
}
.btn-battle[data-v-301e0c32]:hover:not(:disabled) {
  background: linear-gradient(180deg, #8a3a28, #6a2a1a);
  border-color: #ff8a65;
  transform: translateY(-1px);
}
.btn-battle[data-v-301e0c32]:disabled {
  opacity: 0.5;
  cursor: not-allowed;
  border-color: #8b7355;
  color: #a09080;
}
.btn-ok[data-v-301e0c32] {
  padding: 6px 20px;
  min-width: 250px;
  background: #735131;
  border: 1px solid #ffd700;
  border-radius: 0;
  color: #f5d15f;
  font-family: var(--game-font);
  font-size: 13px;
  letter-spacing: 2px;
  cursor: pointer;
  transition: all 0.15s;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
  outline: none;
}
.btn-ok[data-v-301e0c32]:hover {
  background: linear-gradient(180deg, #5a4a3a, #4a3a2a);
  border-color: #c9a84c;
  transform: translateY(-1px);
}
.modal-fade-enter-active[data-v-301e0c32],
.modal-fade-leave-active[data-v-301e0c32] {
  transition: opacity 0.25s ease;
}
.modal-fade-enter-from[data-v-301e0c32],
.modal-fade-leave-to[data-v-301e0c32] {
  opacity: 0;
}

.jy-overlay[data-v-1f27a8b2] {
  position: fixed;
  inset: 0;
  z-index: 21;
  background: rgba(0, 0, 0, 0.65);
  display: flex;
  align-items: center;
  justify-content: center;
}
.jy-container[data-v-1f27a8b2] {
  width: 380px;
  height: 460px;
  background: #1a5f6a;
  border: 4px solid #00e5e5;
  position: relative;
  box-sizing: border-box;
  box-shadow:
    inset 0 0 0 3px #0d3d45,
    0 0 0 2px #00e5e5;
  display: flex;
  flex-direction: column;
  margin-top: -60%;
}
.jy-container .corner[data-v-1f27a8b2] {
  position: absolute;
  width: 1px;
  height: 1px;
  background: transparent;
  pointer-events: none;
  box-shadow:
    3px 0px #00e5e5, 4px 0px #00e5e5, 5px 0px #00e5e5, 6px 0px #00e5e5, 7px 0px #00e5e5, 8px 0px #00e5e5,
    11px 0px #00e5e5, 12px 0px #00e5e5, 13px 0px #00e5e5, 14px 0px #00e5e5, 15px 0px #00e5e5, 16px 0px #00e5e5,
    19px 0px #00e5e5, 20px 0px #00e5e5, 21px 0px #00e5e5, 22px 0px #00e5e5, 23px 0px #00e5e5, 24px 0px #00e5e5, 25px 0px #00e5e5, 26px 0px #00e5e5,
    3px 1px #00e5e5, 4px 1px #00e5e5, 5px 1px #00e5e5, 6px 1px #00e5e5, 7px 1px #00e5e5, 8px 1px #00e5e5,
    11px 1px #00e5e5, 12px 1px #00e5e5, 13px 1px #00e5e5, 14px 1px #00e5e5, 15px 1px #00e5e5, 16px 1px #00e5e5,
    19px 1px #00e5e5, 20px 1px #00e5e5, 21px 1px #00e5e5, 22px 1px #00e5e5, 23px 1px #00e5e5, 24px 1px #00e5e5, 25px 1px #00e5e5, 26px 1px #00e5e5,
    3px 2px #00e5e5, 4px 2px #00e5e5, 7px 2px #00e5e5, 8px 2px #00e5e5,
    11px 2px #00e5e5, 12px 2px #00e5e5, 15px 2px #00e5e5, 16px 2px #00e5e5,
    19px 2px #00e5e5, 20px 2px #00e5e5, 25px 2px #00e5e5, 26px 2px #00e5e5,
    3px 3px #00e5e5, 4px 3px #00e5e5, 7px 3px #00e5e5, 8px 3px #00e5e5,
    11px 3px #00e5e5, 12px 3px #00e5e5, 15px 3px #00e5e5, 16px 3px #00e5e5,
    19px 3px #00e5e5, 20px 3px #00e5e5, 25px 3px #00e5e5, 26px 3px #00e5e5,
    3px 4px #00e5e5, 4px 4px #00e5e5, 5px 4px #00e5e5, 6px 4px #00e5e5, 7px 4px #00e5e5, 8px 4px #00e5e5, 9px 4px #00e5e5, 10px 4px #00e5e5, 11px 4px #00e5e5, 12px 4px #00e5e5, 13px 4px #00e5e5, 14px 4px #00e5e5, 15px 4px #00e5e5, 16px 4px #00e5e5,
    19px 4px #00e5e5, 20px 4px #00e5e5, 23px 4px #00e5e5, 24px 4px #00e5e5, 25px 4px #00e5e5, 26px 4px #00e5e5,
    3px 5px #00e5e5, 4px 5px #00e5e5, 5px 5px #00e5e5, 6px 5px #00e5e5, 7px 5px #00e5e5, 8px 5px #00e5e5, 9px 5px #00e5e5, 10px 5px #00e5e5, 11px 5px #00e5e5, 12px 5px #00e5e5, 13px 5px #00e5e5, 14px 5px #00e5e5, 15px 5px #00e5e5, 16px 5px #00e5e5,
    19px 5px #00e5e5, 20px 5px #00e5e5, 23px 5px #00e5e5, 24px 5px #00e5e5, 25px 5px #00e5e5, 26px 5px #00e5e5,
    7px 6px #00e5e5, 8px 6px #00e5e5, 11px 6px #00e5e5, 12px 6px #00e5e5, 19px 6px #00e5e5, 20px 6px #00e5e5,
    7px 7px #00e5e5, 8px 7px #00e5e5, 11px 7px #00e5e5, 12px 7px #00e5e5, 19px 7px #00e5e5, 20px 7px #00e5e5,
    3px 8px #00e5e5, 4px 8px #00e5e5, 5px 8px #00e5e5, 6px 8px #00e5e5, 7px 8px #00e5e5, 8px 8px #00e5e5, 9px 8px #00e5e5, 10px 8px #00e5e5, 11px 8px #00e5e5, 12px 8px #00e5e5, 13px 8px #00e5e5, 14px 8px #00e5e5, 15px 8px #00e5e5, 16px 8px #00e5e5, 17px 8px #00e5e5, 18px 8px #00e5e5, 19px 8px #00e5e5, 20px 8px #00e5e5,
    3px 9px #00e5e5, 4px 9px #00e5e5, 5px 9px #00e5e5, 6px 9px #00e5e5, 7px 9px #00e5e5, 8px 9px #00e5e5, 9px 9px #00e5e5, 10px 9px #00e5e5, 11px 9px #00e5e5, 12px 9px #00e5e5, 13px 9px #00e5e5, 14px 9px #00e5e5, 15px 9px #00e5e5, 16px 9px #00e5e5, 17px 9px #00e5e5, 18px 9px #00e5e5, 19px 9px #00e5e5, 20px 9px #00e5e5,
    3px 10px #00e5e5, 4px 10px #00e5e5, 7px 10px #00e5e5, 8px 10px #00e5e5, 11px 10px #00e5e5, 12px 10px #00e5e5,
    3px 11px #00e5e5, 4px 11px #00e5e5, 7px 11px #00e5e5, 8px 11px #00e5e5, 11px 11px #00e5e5, 12px 11px #00e5e5,
    3px 12px #00e5e5, 4px 12px #00e5e5, 5px 12px #00e5e5, 6px 12px #00e5e5, 7px 12px #00e5e5, 8px 12px #00e5e5, 11px 12px #00e5e5, 12px 12px #00e5e5,
    3px 13px #00e5e5, 4px 13px #00e5e5, 5px 13px #00e5e5, 6px 13px #00e5e5, 7px 13px #00e5e5, 8px 13px #00e5e5, 11px 13px #00e5e5, 12px 13px #00e5e5,
    11px 14px #00e5e5, 12px 14px #00e5e5,
    11px 15px #00e5e5, 12px 15px #00e5e5,
    3px 16px #00e5e5, 4px 16px #00e5e5, 5px 16px #00e5e5, 6px 16px #00e5e5, 7px 16px #00e5e5, 8px 16px #00e5e5, 9px 16px #00e5e5, 10px 16px #00e5e5, 11px 16px #00e5e5, 12px 16px #00e5e5,
    3px 17px #00e5e5, 4px 17px #00e5e5, 5px 17px #00e5e5, 6px 17px #00e5e5, 7px 17px #00e5e5, 8px 17px #00e5e5, 9px 17px #00e5e5, 10px 17px #00e5e5, 11px 17px #00e5e5, 12px 17px #00e5e5,
    3px 18px #00e5e5, 4px 18px #00e5e5,
    3px 19px #00e5e5, 4px 19px #00e5e5,
    3px 20px #00e5e5, 4px 20px #00e5e5, 7px 20px #00e5e5, 8px 20px #00e5e5,
    3px 21px #00e5e5, 4px 21px #00e5e5, 7px 21px #00e5e5, 8px 21px #00e5e5,
    3px 22px #00e5e5, 4px 22px #00e5e5, 5px 22px #00e5e5, 6px 22px #00e5e5, 7px 22px #00e5e5, 8px 22px #00e5e5;
}
.jy-container .corner.tl[data-v-1f27a8b2] { top: 5px; left: 4px;
}
.jy-container .corner.tr[data-v-1f27a8b2] { top: 5px; right: 4px; transform: scaleX(-1);
}
.jy-container .corner.bl[data-v-1f27a8b2] { bottom: 5px; left: 4px; transform: scaleY(-1);
}
.jy-container .corner.br[data-v-1f27a8b2] { bottom: 5px; right: 4px; transform: scale(-1, -1);
}
.gem[data-v-1f27a8b2] {
  position: absolute;
  top: 26px;
  width: 28px;
  height: 28px;
  background: linear-gradient(135deg, #e1f5fe 0%, #81d4fa 50%, #4fc3f7 100%);
  transform: rotate(45deg);
  border: 2px solid #b3e5fc;
  box-shadow:
    inset 2px 2px 0 0 rgba(255, 255, 255, 0.8),
    inset -2px -2px 0 0 rgba(0, 150, 200, 0.3),
    0 0 4px rgba(79, 195, 247, 0.5);
}
.gem[data-v-1f27a8b2]::after {
  content: '';
  position: absolute;
  top: 4px; left: 4px;
  width: 8px; height: 8px;
  background: rgba(255, 255, 255, 0.7);
  border-radius: 50%;
  filter: blur(1px);
}
.gem-left[data-v-1f27a8b2] { left: 50px;
}
.gem-right[data-v-1f27a8b2] { right: 50px;
}
.title-bar[data-v-1f27a8b2] {
  position: absolute;
  top: 20px;
  left: 50%;
  transform: translateX(-50%);
  width: 200px;
  height: 44px;
  background: #8b6239;
  border: 3px solid #d4a76a;
  box-shadow: inset 0 0 0 2px #5a3a1b, inset 2px 2px 0 0 rgba(255, 255, 255, 0.1);
  display: flex;
  align-items: center;
  justify-content: center;
}
.jy-title[data-v-1f27a8b2] {
  font-family: var(--game-font);
  font-size: 16px;
  font-weight: bold;
  color: #fbe9c8;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
}
.content[data-v-1f27a8b2] {
  position: absolute;
  top: 80px;
  left: 24px;
  right: 24px;
  bottom: 24px;
  padding: 16px;
  color: #b2ebf2;
  font-size: 14px;
  line-height: 1.8;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  min-height: 0;
}
.jy-body[data-v-1f27a8b2] {
  display: flex;
  align-items: flex-start;
  padding: 4px 0;
  gap: 16px;
  flex-shrink: 0;
}
.jy-image-wrap[data-v-1f27a8b2] {
  flex-shrink: 0;
  width: 78px;
  height: 78px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.jy-image[data-v-1f27a8b2] {
  max-width: 72px;
  max-height: 72px;
  object-fit: contain;
  image-rendering: pixelated;
}
.jy-image-fallback[data-v-1f27a8b2] {
  width: 60px;
  height: 60px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(120, 80, 30, 0.55);
  border: 1px solid #ffd700;
  color: #ffd700;
  font-family: var(--game-font);
  font-size: 26px;
  font-weight: bold;
}
.jy-content[data-v-1f27a8b2] {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  gap: 10px;
  min-height: 60px;
}
.jy-line[data-v-1f27a8b2] {
  font-size: 14px;
  color: #b2ebf2;
  line-height: 1.8;
  font-family: var(--game-font);
  margin: 0;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.8);
}
.jy-tip[data-v-1f27a8b2] { font-family: var(--game-font);
  font-size: 13px;
}
.jy-tip.free[data-v-1f27a8b2] {
  color: #7cff7c;
}
.loading-text[data-v-1f27a8b2] {
  font-size: 16px;
  color: #ffd700;
  text-align: center;
  font-family: var(--game-font);
  animation: blink-1f27a8b2 0.8s step-end infinite;
}
@keyframes blink-1f27a8b2 {
50% { opacity: 0.4;
}
}
.result-text[data-v-1f27a8b2] {
  font-size: 15px;
  font-family: var(--game-font);
}
.result-text.error[data-v-1f27a8b2] {
  color: #ff6b6b;
}
.jy-footer[data-v-1f27a8b2] {
  margin-top: auto;
  padding: 10px 0 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
  flex-shrink: 0;
}
.footer-divider[data-v-1f27a8b2] {
  height: 1px;
  background: linear-gradient(to right, transparent, rgba(178, 235, 242, 0.35), transparent);
}
.footer-actions[data-v-1f27a8b2] {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
}
.btn-battle[data-v-1f27a8b2] {
  padding: 6px 20px;
  min-width: 250px;
  background: #7a3020;
  border: 1px solid #ff7043;
  border-radius: 0;
  color: #ffd7c2;
  font-family: var(--game-font);
  font-size: 13px;
  letter-spacing: 2px;
  cursor: pointer;
  transition: all 0.15s;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
  outline: none;
}
.btn-battle[data-v-1f27a8b2]:hover {
  background: linear-gradient(180deg, #8a3a28, #6a2a1a);
  border-color: #ff8a65;
  transform: translateY(-1px);
}
.btn-ok[data-v-1f27a8b2] {
  padding: 6px 20px;
  min-width: 250px;
  background: #735131;
  border: 1px solid #ffd700;
  border-radius: 0;
  color: #f5d15f;
  font-family: var(--game-font);
  font-size: 13px;
  letter-spacing: 2px;
  cursor: pointer;
  transition: all 0.15s;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
  outline: none;
}
.btn-ok[data-v-1f27a8b2]:hover {
  background: linear-gradient(180deg, #5a4a3a, #4a3a2a);
  border-color: #c9a84c;
  transform: translateY(-1px);
}
.modal-fade-enter-active[data-v-1f27a8b2],
.modal-fade-leave-active[data-v-1f27a8b2] {
  transition: opacity 0.25s ease;
}
.modal-fade-enter-from[data-v-1f27a8b2],
.modal-fade-leave-to[data-v-1f27a8b2] {
  opacity: 0;
}

@font-face { font-family: 'GameFont'; src: url('/fonts/VonwaonBitmap-16px.ttf') format('truetype');
}
.syn-fullscreen[data-v-ff7ec88a] {
  position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 55;
  background-size: 100% 100%; background-repeat: no-repeat; background-position: center;
  display: flex; flex-direction: column; overflow: hidden;
  color: #e8d5a3; font-family: 'GameFont';
}

/* ── 头部 ── */
.syn-header[data-v-ff7ec88a] {
  display: flex; align-items: center; justify-content: center;
  padding: 16px 16px; flex-shrink: 0; position: relative;
}
.syn-title[data-v-ff7ec88a] { font-size: 20px; color: #ffd700; text-shadow: 0 1px 4px rgba(0,0,0,0.9);
}
.close-btn[data-v-ff7ec88a] {
  position: absolute; right: 12px; top: 50%; transform: translateY(-50%);
  width: 30px; height: 30px; border: 1px solid #8b7355; border-radius: 4px;
  background: rgba(0,0,0,0.4); color: #ccc; font-size: 16px; cursor: pointer;
}
.syn-content[data-v-ff7ec88a] { flex: 1; overflow: hidden; display: flex; flex-direction: column;
}
.syn-body[data-v-ff7ec88a] { flex: 1; padding: 10px 14px; overflow-y: auto; display: flex; flex-direction: column; gap: 10px;
}

/* ── 通用标题 ── */
.section-title[data-v-ff7ec88a] { color: #ffd700; font-size: 14px; border-bottom: 1px solid rgba(255,215,0,0.3); padding-bottom: 4px; margin-top: -10px;}
.empty-state[data-v-ff7ec88a] { color: #fff; text-align: center; padding: 20px; font-size: 13px;
}
.tip-text[data-v-ff7ec88a] { color: #fff; font-size: 12px; text-align: center;
}
.gold-color[data-v-ff7ec88a] { color: #ffd700 !important;
}

/* ── 水晶视图 ── */
.crystal-bag-hint[data-v-ff7ec88a] {
  background: rgba(255, 215, 0, 0.12); border: 1px solid rgba(255, 215, 0, 0.4);
  border-radius: 6px; padding: 6px 10px; font-size: 12px; color: #ffd700; text-align: center;
}
.crystal-actions[data-v-ff7ec88a] { display: flex; flex-direction: column; gap: 6px; align-items: stretch;
}
.crystal-hint[data-v-ff7ec88a] { color: #fff; font-size: 12px; text-align: center; opacity: 0.85;
}
.syn-btn[data-v-ff7ec88a] {
  padding: 10px 16px; border: 2px solid #ffd700; border-radius: 6px;
  background: rgba(40, 20, 10, 0.85); color: #ffd700; font-family: 'GameFont'; font-size: 14px; cursor: pointer;
}
.syn-btn[data-v-ff7ec88a]:hover:not(.disabled) { background: rgba(60, 30, 12, 0.95);
}
.syn-btn.disabled[data-v-ff7ec88a] { border-color: #665544; color: #888; cursor: not-allowed; opacity: 0.7;
}

/* ── 主菜单 ── */
.menu-layout[data-v-ff7ec88a] { display: flex; flex-direction: column; gap: 16px; align-items: center; justify-content: center;
}
.menu-top[data-v-ff7ec88a] { display: flex; flex-direction: column; align-items: center; gap: 10px;
}
.npc-img[data-v-ff7ec88a] { width: 72px; height: 72px; object-fit: contain; image-rendering: pixelated;
}

/* 加载失败兜底 */
.npc-img-fallback[data-v-ff7ec88a] {
  width: 64px; height: 64px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  background: rgba(120, 80, 30, 0.55); border: 1px solid #ffd700;
  color: #ffd700; font-family: 'GameFont'; font-size: 28px; font-weight: bold;
}
.menu-dialog[data-v-ff7ec88a] {
  color: #ccc; font-size: 13px; text-align: center; line-height: 1.6;
  max-width: 280px; padding: 10px 14px; background: rgba(0,0,0,0.35); border-radius: 6px;
}
.menu-list[data-v-ff7ec88a] { display: flex; flex-direction: column; gap: 10px; width: 90%; max-width: 280px;
}
.synthesis-btn[data-v-ff7ec88a] {
  display: flex; align-items: center; gap: 10px;
  padding: 12px; background: rgba(26,14,5,0.85); border: 2px solid #8b7355; border-radius: 6px;
  cursor: pointer;
}
.synthesis-btn[data-v-ff7ec88a]:hover { border-color: #ffd700; background: rgba(40,20,10,0.85);
}
.synthesis-btn-back[data-v-ff7ec88a] { border-color: #665544;
}
.synthesis-btn-back[data-v-ff7ec88a]:hover { border-color: #8b7355;
}
.synthesis-btn-icon[data-v-ff7ec88a] { font-size: 22px; color: #ffd700; min-width: 28px; text-align: center;
}
.synthesis-btn-back .synthesis-btn-icon[data-v-ff7ec88a] { color: #fff;
}
.synthesis-btn-text[data-v-ff7ec88a] { display: flex; flex-direction: column; gap: 2px;
}
.synthesis-btn-title[data-v-ff7ec88a] { color: #ffd700; font-size: 15px;
}
.synthesis-btn-desc[data-v-ff7ec88a] { color: #999; font-size: 11px;
}

/* ── 合成卡片布局 ── */
.synthesis-row[data-v-ff7ec88a] { display: flex; align-items: center; gap: 8px; justify-content: center;
}
.synthesis-card[data-v-ff7ec88a] {
  flex: 1; max-width: 140px; display: flex; flex-direction: column; gap: 6px;
  padding: 10px; background: rgba(0,0,0,0.35); border: 2px solid #8b7355; border-radius: 6px;
  cursor: pointer;
}
.synthesis-card[data-v-ff7ec88a]:hover { border-color: #ffd700;
}
.synthesis-card.active[data-v-ff7ec88a] { border-color: #7cff7c;
}
.synthesis-card-top[data-v-ff7ec88a] { display: flex; align-items: center; gap: 8px;
}
.synthesis-card-icon[data-v-ff7ec88a] { width: 32px; height: 32px; object-fit: contain; image-rendering: pixelated;
}
.synthesis-card-label[data-v-ff7ec88a] { color: #ffd700; font-size: 13px;
}
.synthesis-card-bottom[data-v-ff7ec88a] { text-align: center;
}
.synthesis-card-selected[data-v-ff7ec88a] { color: #7cff7c; font-size: 13px;
}
.synthesis-card-hint[data-v-ff7ec88a] { color: #fff; font-size: 12px;
}
.synthesis-arrow[data-v-ff7ec88a] { font-size: 24px; color: #ffd700; font-weight: bold; padding: 0 4px;
}

/* ── 详情信息栏 ── */
.detail-area[data-v-ff7ec88a] {
  background: rgba(0,0,0,0.25); border: 1px solid rgba(139,115,85,0.4); border-radius: 4px;
  padding: 8px 12px; display: flex; flex-direction: column; gap: 6px;
}
.detail-row[data-v-ff7ec88a] { display: flex; justify-content: space-between; align-items: center; font-size: 14px;
}
.detail-label[data-v-ff7ec88a] { color: #e8d5a3;
}
.detail-value[data-v-ff7ec88a] { color: #fff; font-weight: bold;
}
.rate-high[data-v-ff7ec88a] { color: #7cff7c;
}
.rate-mid[data-v-ff7ec88a] { color: #ffd700;
}
.rate-low[data-v-ff7ec88a] { color: #ff6666;
}

/* ── 按钮 ── */
.syn-btn[data-v-ff7ec88a] {
  padding: 10px 0; background: #735131; border: 1px solid #ffd700; border-radius: 4px;
  color: #f5d15f; font-size: 15px; cursor: pointer; letter-spacing: 2px;
  font-family: 'GameFont'; width: 100%; max-width: 280px; margin: 0 auto;
}
.syn-btn[data-v-ff7ec88a]:hover { background: linear-gradient(180deg, #8a5a3a, #6a4a2a);
}
.syn-btn.disabled[data-v-ff7ec88a], .syn-btn[data-v-ff7ec88a]:disabled { opacity: 0.5; cursor: not-allowed;
}
.syn-btn-sm[data-v-ff7ec88a] { padding: 6px 0; max-width: 120px; font-size: 13px; margin: 0;
}

/* ── 结果提示 ── */
.result-tip[data-v-ff7ec88a] { text-align: center; padding: 8px; border-radius: 4px; font-size: 13px;
}
.result-success[data-v-ff7ec88a] { color: #7cff7c; background: rgba(124,255,124,0.1); border: 1px solid #7cff7c;
}
.result-fail[data-v-ff7ec88a] { color: #ff6666; background: rgba(255,102,102,0.1); border: 1px solid #ff6666;
}

/* ── 物品选择器网格 ── */
.item-grid[data-v-ff7ec88a] {
  display: grid; grid-template-columns: repeat(5, 1fr); gap: 3px;
}
.item-slot[data-v-ff7ec88a] {
  aspect-ratio: 1; border: 1px solid #8b7355; background: rgba(0,0,0,0.3);
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  cursor: pointer; position: relative; border-radius: 3px;
}
.item-slot.filled[data-v-ff7ec88a] { background: rgba(0,0,0,0.45);
}
.item-slot.selected[data-v-ff7ec88a] { border-color: #ffd700; background: rgba(255,215,0,0.1);
}
.item-slot.disabled[data-v-ff7ec88a] { opacity: 0.35; cursor: not-allowed;
}
.slot-icon[data-v-ff7ec88a] { width: 65%; height: 65%; object-fit: contain; image-rendering: pixelated;
}
.slot-lv[data-v-ff7ec88a] { font-size: 10px; color: #4dc4ff; position: absolute; bottom: 2px; left: 3px;
}
.slot-count[data-v-ff7ec88a] { position: absolute; bottom: 2px; right: 3px; font-size: 10px; color: #fff; text-shadow: 0 0 3px #000;
}
.slot-check[data-v-ff7ec88a] { position: absolute; top: 2px; left: 3px; font-size: 13px; color: #7cff7c; font-weight: bold;
}
.selector-bottom[data-v-ff7ec88a] {
  display: flex; justify-content: space-between; align-items: center; padding: 8px 0;
}
.selector-hint[data-v-ff7ec88a] { color: #ccc; font-size: 13px;
}

/* ── 幸运珠选择器 ── */
.bead-info[data-v-ff7ec88a] { color: #aaa; font-size: 13px; text-align: center;
}
.qty-picker[data-v-ff7ec88a] {
  display: flex; align-items: center; justify-content: center; gap: 6px; padding: 16px 0;
}
.qty-btn[data-v-ff7ec88a] {
  width: 36px; height: 30px; border: 1px solid #8b7355; border-radius: 3px;
  background: rgba(0,0,0,0.4); color: #ffd700; font-size: 12px; cursor: pointer;
}
.qty-btn[data-v-ff7ec88a]:disabled { opacity: 0.3; cursor: not-allowed;
}
.qty-num[data-v-ff7ec88a] { min-width: 40px; text-align: center; color: #fff; font-size: 18px; font-weight: bold;
}

/* ── 法宝列表 ── */
.fabao-list[data-v-ff7ec88a] { display: flex; flex-direction: column; gap: 6px;
}
.fabao-card[data-v-ff7ec88a] {
  display: flex; align-items: center; gap: 10px; padding: 8px 10px;
  background: rgba(0,0,0,0.3); border: 1px solid #8b7355; border-radius: 4px; cursor: pointer;
}
.fabao-card[data-v-ff7ec88a]:hover, .fabao-card.selected[data-v-ff7ec88a] { border-color: #ffd700; background: rgba(255,215,0,0.08);
}
.fabao-icon[data-v-ff7ec88a] { width: 36px; height: 36px; object-fit: contain; image-rendering: pixelated;
}
.fabao-info[data-v-ff7ec88a] { flex: 1;
}
.fabao-name[data-v-ff7ec88a] { font-size: 14px;
}
.type-support[data-v-ff7ec88a] { color: #4dc4ff;
}
.type-defense[data-v-ff7ec88a] { color: #7cff7c;
}
.type-attack[data-v-ff7ec88a] { color: #ff6666;
}
.fabao-meta[data-v-ff7ec88a] { font-size: 11px; color: #aaa;
}
.fabao-exp[data-v-ff7ec88a] { font-size: 11px; color: #fff;
}
.fabao-max[data-v-ff7ec88a] { color: #ffd700; font-size: 11px;
}

/* ── 底部金钱栏（与背包一致） ── */
.money-area[data-v-ff7ec88a] { flex: 0 0 8%; display: flex; justify-content: space-between; align-items: center; padding: 4px 60px; font-size: 16px;
}
.money-gold[data-v-ff7ec88a] { color: #ffd700;
}
.money-yuanbao[data-v-ff7ec88a] { color: #aae0ff;
}

@font-face { font-family: 'GameFont'; src: url('/fonts/VonwaonBitmap-16px.ttf') format('truetype');
}
.enh-fullscreen[data-v-341d3601] {
  position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 55;
  background-size: 100% 100%; background-repeat: no-repeat; background-position: center;
  display: flex; flex-direction: column; overflow: hidden;
  color: #e8d5a3; font-family: 'GameFont';
}

/* ── 头部 ── */
.enh-header[data-v-341d3601] {
  display: flex; align-items: center; justify-content: center;
  padding: 16px 16px; flex-shrink: 0; position: relative;
}
.enh-title[data-v-341d3601] { font-size: 20px; color: #ffd700; text-shadow: 0 1px 4px rgba(0,0,0,0.9);
}
.close-btn[data-v-341d3601] {
  position: absolute; right: 12px; top: 50%; transform: translateY(-50%);
  width: 30px; height: 30px; border: 1px solid #8b7355; border-radius: 4px;
  background: rgba(0,0,0,0.4); color: #ccc; font-size: 16px; cursor: pointer;
}
.close-btn[data-v-341d3601]:hover { color: #fff; border-color: #ffd700;
}
.enh-content[data-v-341d3601] { flex: 1; display: flex; flex-direction: column; gap: 8px; padding: 12px 25px; overflow-y: auto; align-items: center; scrollbar-width: none; -ms-overflow-style: none;
}
.enh-content[data-v-341d3601]::-webkit-scrollbar { display: none; width: 0; height: 0;
}
/* 隐藏强化界面内所有滚动条，保留滚动能力 */
.enh-fullscreen[data-v-341d3601] ::-webkit-scrollbar { display: none; width: 0; height: 0;
}
.enh-fullscreen[data-v-341d3601] * { scrollbar-width: none; -ms-overflow-style: none;
}

/* ── 通用标题 ── */
.section-title[data-v-341d3601] { color: #ffd700; font-size: 15px; border-bottom: 1px solid rgba(255,215,0,0.3); padding-bottom: 4px; width: 100%;margin-top: -10px;
}
.section-sub[data-v-341d3601] { color: #ffd700; font-size: 14px; width: 100%; margin-top: 4px;
}
/* 当前属性（基础值 + 强化增量绿色） */
.attr-row[data-v-341d3601] { display: flex; justify-content: space-between; align-items: center; width: 100%; font-size: 14px; background: rgba(0,0,0,0.25); border: 1px solid rgba(139,115,85,0.4); border-radius: 4px; padding: 6px 12px;
}
.attr-label[data-v-341d3601] { color: #e8d5a3;
}
.attr-value[data-v-341d3601] { color: #fff;
}
.attr-bonus[data-v-341d3601] { color: #7cff7c; margin-left: 2px;
}
.empty-hint[data-v-341d3601] { color: #fff; font-size: 13px; opacity: 0.8; text-align: center; padding: 20px 0;
}
.gold-color[data-v-341d3601] { color: #ffd700 !important;
}

/* ── 装备槽（仿背包黑格） ── */
.equip-slot[data-v-341d3601] {
  width: 84px; height: 84px; border-radius: 6px; cursor: pointer;
  background: rgba(0,0,0,0.45); border: 2px solid #8b7355;
  display: flex; align-items: center; justify-content: center;
}
.equip-slot[data-v-341d3601]:hover { border-color: #ffd700; background: rgba(40,20,10,0.55);
}
.equip-slot-icon[data-v-341d3601] { width: 64px; height: 64px; object-fit: contain; image-rendering: pixelated;
}
.equip-slot-hint[data-v-341d3601] { color: #9c8e6a; font-size: 12px;
}
.equip-slot-name[data-v-341d3601] { font-size: 13px; color: #ffd700; text-align: center;
}
/* 星级（与 ItemDetailPanel 查看面板一致：整星/半星/空星） */
.equip-stars[data-v-341d3601] { letter-spacing: 1px;
}
.estar[data-v-341d3601] { font-size: 13px; position: relative; display: inline-block;
}
.estar-full[data-v-341d3601] { color: #ffd700; text-shadow: 0 0 4px rgba(255,215,0,0.5);
}
/* 真半星：底层灰★，上层金色★只裁左半（左金右灰） */
.estar-half[data-v-341d3601] { color: #555;
}
.estar-half[data-v-341d3601]::before {
  content: '★';
  position: absolute;
  left: 0;
  top: 0;
  width: 50%;
  overflow: hidden;
  color: #ffd700;
  text-shadow: 0 0 4px rgba(255,215,0,0.5);
}
.estar-empty[data-v-341d3601] { color: #555;
}
/* 星级素材图（public/tubiao：满星/半星/空星） */
.estar-img[data-v-341d3601] { width: 14px; height: 14px; image-rendering: pixelated;
}

/* ── 强化石 ── */
.material-row[data-v-341d3601] { display: flex; justify-content: space-between; align-items: center; width: 100%; font-size: 14px; background: rgba(0,0,0,0.25); border: 1px solid rgba(139,115,85,0.4); border-radius: 4px; padding: 8px 12px;
}
.material-label[data-v-341d3601] { color: #e8d5a3;
}
.material-need[data-v-341d3601] { color: #ffd700;
}
.need-lack[data-v-341d3601] { color: #ff5555 !important; font-weight: bold;
}
.cost-note[data-v-341d3601] { width: 100%; font-size: 12px; line-height: 1.5; color: #c9b78a; background: rgba(0,0,0,0.22); border: 1px dashed rgba(139,115,85,0.5); border-radius: 4px; padding: 7px 10px;
}
.cost-note .gold-color[data-v-341d3601] { color: #ffd700;
}

/* ── 幸运石步进器 ── */
.lucky-row[data-v-341d3601] { display: flex; align-items: center; gap: 10px; width: 100%; font-size: 14px;
}
.lucky-name[data-v-341d3601] { flex: 1; color: #e8d5a3;
}
.stepper[data-v-341d3601] { display: flex; align-items: center; gap: 6px;
}
.step-btn[data-v-341d3601] {
  width: 26px; height: 26px; border: 1px solid #8b7355; border-radius: 4px;
  background: rgba(0,0,0,0.4); color: #ffd700; font-size: 16px; cursor: pointer; line-height: 1;
  user-select: none; touch-action: none;
}
.step-btn[data-v-341d3601]:hover:not(:disabled) { border-color: #ffd700; background: rgba(40,20,10,0.6);
}
.step-btn[data-v-341d3601]:disabled { opacity: 0.3; cursor: not-allowed;
}
.step-qty-input[data-v-341d3601] {
  width: 38px; height: 24px; text-align: center; color: #fff; font-weight: bold; font-size: 15px;
  background: rgba(0,0,0,0.4); border: 1px solid #8b7355; border-radius: 4px; padding: 0;
  -moz-appearance: textfield;
}
.step-qty-input[data-v-341d3601]::-webkit-outer-spin-button,
.step-qty-input[data-v-341d3601]::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0;
}
.step-qty-input[data-v-341d3601]:disabled { opacity: 0.35; cursor: not-allowed;
}
.step-qty-input[data-v-341d3601]:focus { outline: none; border-color: #ffd700;
}
.lucky-own[data-v-341d3601] { color: #ffffff; font-size: 12px; min-width: 56px; text-align: right;
}

/* ── 成功率 ── */
.rate-row[data-v-341d3601] { display: flex; justify-content: space-between; align-items: center; width: 100%; font-size: 15px; background: rgba(0,0,0,0.25); border: 1px solid rgba(139,115,85,0.4); border-radius: 4px; padding: 8px 12px;
}
.rate-label[data-v-341d3601] { color: #e8d5a3;
}
.rate-value[data-v-341d3601] { font-weight: bold;
}
.rate-high[data-v-341d3601] { color: #7cff7c;
}
.rate-mid[data-v-341d3601] { color: #ffd700;
}
.rate-low[data-v-341d3601] { color: #ff6666;
}

/* ── 按钮 ── */
.syn-btn[data-v-341d3601] {
  padding: 10px 0; background: #735131; border: 1px solid #ffd700; border-radius: 4px;
  color: #f5d15f; font-size: 15px; cursor: pointer; letter-spacing: 2px;
  font-family: 'GameFont'; width: 100%; max-width: 280px; margin: 4px auto 0;
}
.syn-btn[data-v-341d3601]:hover:not(.disabled) { background: linear-gradient(180deg, #8a5a3a, #6a4a2a);
}
.syn-btn.disabled[data-v-341d3601], .syn-btn[data-v-341d3601]:disabled { opacity: 0.5; cursor: not-allowed;
}

/* ── 底部金钱栏（同五灵珠升级） ── */
.money-area[data-v-341d3601] { flex: 0 0 8%; display: flex; justify-content: space-between; align-items: center; padding: 4px 60px; font-size: 16px;
}
.money-gold[data-v-341d3601] { color: #ffd700;
}
.money-yuanbao[data-v-341d3601] { color: #aae0ff;
}

/* ── 装备选择弹层：直接承载背包组件（与背包等大） ── */
.picker-overlay[data-v-341d3601] {
  position: absolute; inset: 0; z-index: 60;
}

/* ── 结果飘字 ── */
.result-toast[data-v-341d3601] {
  position: absolute; left: 50%; top: 50%;
  transform: translate(-50%, -50%);
  padding: 14px 26px; border-radius: 12px;
  font-size: 15px; font-weight: 700; z-index: 5; backdrop-filter: blur(6px);
}
.result-toast.success[data-v-341d3601] { background: rgba(40, 120, 60, 0.85); color: #d6ffe0;
}
.result-toast.fail[data-v-341d3601] { background: rgba(140, 50, 40, 0.85); color: #ffe0d6;
}
.toast-fade-enter-active[data-v-341d3601], .toast-fade-leave-active[data-v-341d3601] { transition: all 0.3s ease;
}
.toast-fade-enter-from[data-v-341d3601], .toast-fade-leave-to[data-v-341d3601] { opacity: 0; transform: translate(-50%, -40%);
}

@font-face { font-family: 'GameFont'; src: url('/fonts/VonwaonBitmap-16px.ttf') format('truetype');
}
.enh-fullscreen[data-v-42d4589b] {
  position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 55;
  background-size: 100% 100%; background-repeat: no-repeat; background-position: center;
  display: flex; flex-direction: column; overflow: hidden;
  color: #e8d5a3; font-family: 'GameFont';
}

/* ── 头部 ── */
.enh-header[data-v-42d4589b] {
  display: flex; align-items: center; justify-content: center;
  padding: 16px 16px; flex-shrink: 0; position: relative;
}
.enh-title[data-v-42d4589b] { font-size: 20px; color: #ffd700; text-shadow: 0 1px 4px rgba(0,0,0,0.9);
}
.close-btn[data-v-42d4589b] {
  position: absolute; right: 12px; top: 50%; transform: translateY(-50%);
  width: 30px; height: 30px; border: 1px solid #8b7355; border-radius: 4px;
  background: rgba(0,0,0,0.4); color: #ccc; font-size: 16px; cursor: pointer;
}
.close-btn[data-v-42d4589b]:hover { color: #fff; border-color: #ffd700;
}
.enh-content[data-v-42d4589b] { flex: 1; display: flex; flex-direction: column; gap: 5px; padding: 6px 20px; overflow-y: auto; align-items: center; scrollbar-width: none; -ms-overflow-style: none;
}
.enh-content[data-v-42d4589b]::-webkit-scrollbar { display: none; width: 0; height: 0;
}
.enh-fullscreen[data-v-42d4589b] ::-webkit-scrollbar { display: none; width: 0; height: 0;
}
.enh-fullscreen[data-v-42d4589b] * { scrollbar-width: none; -ms-overflow-style: none;
}

/* ── 通用标题 ── */
.section-title[data-v-42d4589b] { color: #ffd700; font-size: 13px; border-bottom: 1px solid rgba(255,215,0,0.3); padding-bottom: 2px; width: 100%; margin-top: -4px;
}
.section-sub[data-v-42d4589b] { color: #ffd700; font-size: 12.5px; width: 100%; margin-top: 2px;
}
.attr-row[data-v-42d4589b] { display: flex; justify-content: space-between; align-items: center; width: 100%; font-size: 12.5px; background: rgba(0,0,0,0.25); border: 1px solid rgba(139,115,85,0.4); border-radius: 4px; padding: 3px 10px;
}
.attr-label[data-v-42d4589b] { color: #e8d5a3;
}
.attr-value[data-v-42d4589b] { color: #fff;
}
.attr-bonus[data-v-42d4589b] { color: #7cff7c; margin-left: 2px;
}
.empty-hint[data-v-42d4589b] { color: #fff; font-size: 13px; opacity: 0.8; text-align: center; padding: 20px 0;
}
.gold-color[data-v-42d4589b] { color: #ffd700 !important;
}

/* ── 装备槽（仿背包黑格，与强化界面一致） ── */
.equip-slot[data-v-42d4589b] {
  width: 56px; height: 56px; border-radius: 6px; cursor: pointer;
  background: rgba(0,0,0,0.45); border: 2px solid #8b7355;
  display: flex; align-items: center; justify-content: center;
}
.equip-slot[data-v-42d4589b]:hover { border-color: #ffd700; background: rgba(40,20,10,0.55);
}
.equip-slot-icon[data-v-42d4589b] { width: 40px; height: 40px; object-fit: contain; image-rendering: pixelated;
}
.equip-slot-hint[data-v-42d4589b] { color: #9c8e6a; font-size: 12px;
}
.equip-slot-name[data-v-42d4589b] { font-size: 12px; color: #ffd700; text-align: center;
}
.equip-stars[data-v-42d4589b] { letter-spacing: 1px;
}
.soul-icon-inline[data-v-42d4589b] { color: #b388ff;
}
.soul-img-sm[data-v-42d4589b] { width: 13px; height: 13px; image-rendering: pixelated; vertical-align: -1px;
}
.soul-icon-empty[data-v-42d4589b] { display: inline-block; width: 18px;
}
.mat-gain-inline[data-v-42d4589b] { color: #7cff7c; margin-left: 6px;
}

/* ── 附魂等级 ── */
.soul-level-row[data-v-42d4589b] { display: flex; align-items: center; gap: 8px; width: 100%; font-size: 13px; background: rgba(0,0,0,0.25); border: 1px solid rgba(139,115,85,0.4); border-radius: 4px; padding: 5px 10px;
}
.soul-icon-big[data-v-42d4589b] { width: 18px; height: 18px; image-rendering: pixelated;
}
.soul-level-text[data-v-42d4589b] { color: #e8d5a3; font-size: 12.5px; flex-shrink: 0;
}

/* ── 附魂经验条 ── */
.soul-exp-row[data-v-42d4589b] { display: flex; align-items: center; gap: 10px; width: 100%; font-size: 13px;
}
.soul-exp-label[data-v-42d4589b] { color: #e8d5a3; flex-shrink: 0;
}
.soul-exp-bar[data-v-42d4589b] { flex: 1; min-width: 60px; height: 9px; background: rgba(0,0,0,0.45); border: 1px solid #8b7355; border-radius: 7px; overflow: hidden;
}
.soul-exp-fill[data-v-42d4589b] { height: 100%; background: linear-gradient(90deg, #6a4fd8, #b388ff); border-radius: 7px; transition: width 0.3s ease;
}
.soul-exp-num[data-v-42d4589b] { color: #b388ff; flex-shrink: 0; font-size: 11px;
}

/* ── 幸运石步进器（照强化界面） ── */
.lucky-row-3[data-v-42d4589b] { display: flex; gap: 6px; width: 100%; justify-content: space-between;
}
.lucky-group[data-v-42d4589b] { display: flex; align-items: center; gap: 4px; background: rgba(0,0,0,0.22); border: 1px solid rgba(139,115,85,0.35); border-radius: 4px; padding: 3px 6px; flex: 1;
}
.lucky-name[data-v-42d4589b] { color: #e8d5a3; font-size: 12px; flex-shrink: 0;
}
.stepper[data-v-42d4589b] { display: flex; align-items: center; gap: 6px;
}
.step-btn[data-v-42d4589b] {
  width: 21px; height: 21px; border: 1px solid #8b7355; border-radius: 3px;
  background: rgba(0,0,0,0.4); color: #ffd700; font-size: 16px; cursor: pointer; line-height: 1;
  user-select: none; touch-action: none;
}
.step-btn[data-v-42d4589b]:hover:not(:disabled) { border-color: #ffd700; background: rgba(40,20,10,0.6);
}
.step-btn[data-v-42d4589b]:disabled { opacity: 0.3; cursor: not-allowed;
}
.step-qty-input[data-v-42d4589b] {
  width: 26px; height: 19px; text-align: center; color: #fff; font-weight: bold; font-size: 15px;
  background: rgba(0,0,0,0.4); border: 1px solid #8b7355; border-radius: 4px; padding: 0;
  -moz-appearance: textfield;
}
.step-qty-input[data-v-42d4589b]::-webkit-outer-spin-button,
.step-qty-input[data-v-42d4589b]::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0;
}
.step-qty-input[data-v-42d4589b]:disabled { opacity: 0.35; cursor: not-allowed;
}
.step-qty-input[data-v-42d4589b]:focus { outline: none; border-color: #ffd700;
}
.lucky-own[data-v-42d4589b] { color: #ffffff; font-size: 10px; flex-shrink: 0;
}

/* ── 成功率 ── */
.rate-row[data-v-42d4589b] { display: flex; justify-content: space-between; align-items: center; width: 100%; font-size: 13px; background: rgba(0,0,0,0.25); border: 1px solid rgba(139,115,85,0.4); border-radius: 4px; padding: 4px 10px;
}
.rate-label[data-v-42d4589b] { color: #e8d5a3;
}
.rate-value[data-v-42d4589b] { font-weight: bold;
}
.rate-high[data-v-42d4589b] { color: #7cff7c;
}
.rate-mid[data-v-42d4589b] { color: #ffd700;
}
.rate-low[data-v-42d4589b] { color: #ff6666;
}

/* ── 消耗说明 ── */
.cost-note[data-v-42d4589b] { width: 100%; font-size: 11px; line-height: 1.4; color: #c9b78a; background: rgba(0,0,0,0.22); border: 1px dashed rgba(139,115,85,0.5); border-radius: 4px; padding: 4px 8px;
}
.cost-note .gold-color[data-v-42d4589b] { color: #ffd700;
}

/* ── 按钮 ── */
.syn-btn[data-v-42d4589b] {
  padding: 7px 0; background: #735131; border: 1px solid #ffd700; border-radius: 4px;
  color: #f5d15f; font-size: 15px; cursor: pointer; letter-spacing: 2px;
  font-family: 'GameFont'; width: 100%; max-width: 280px; margin: 4px auto 0;
}
.syn-btn[data-v-42d4589b]:hover:not(.disabled) { background: linear-gradient(180deg, #8a5a3a, #6a4a2a);
}
.syn-btn.disabled[data-v-42d4589b], .syn-btn[data-v-42d4589b]:disabled { opacity: 0.5; cursor: not-allowed;
}

/* ── 底部金钱栏（同强化界面） ── */
.money-area[data-v-42d4589b] { flex: 0 0 5.5%; display: flex; justify-content: space-between; align-items: center; padding: 4px 60px; font-size: 16px;
}
.money-gold[data-v-42d4589b] { color: #ffd700;
}
.money-yuanbao[data-v-42d4589b] { color: #aae0ff;
}

/* ── 装备选择弹层：直接承载背包组件 ── */
.picker-overlay[data-v-42d4589b] { position: absolute; inset: 0; z-index: 60;
}

/* ── 结果弹窗（confirm-dialog pixel-dialog-box，同离队通知样式） ── */
.confirm-overlay[data-v-42d4589b] {
  position: fixed; top: 0; left: 0; width: 100%; height: 100%;
  background: rgba(0, 0, 0, 0.55);
  display: flex; align-items: center; justify-content: center;
  z-index: 9999;
}
.confirm-dialog[data-v-42d4589b] { padding: 30px 40px 20px; text-align: center; min-width: 240px; max-width: 300px;
}
.confirm-title[data-v-42d4589b] { font-family: 'GameFont'; font-size: 16px; color: #ffd700; font-weight: bold; margin-bottom: 10px; letter-spacing: 2px;
}
.confirm-title.title-success[data-v-42d4589b] { color: #7cff7c;
}
.confirm-title.title-fail[data-v-42d4589b] { color: #ff6666;
}
.confirm-text[data-v-42d4589b] { font-family: 'GameFont'; font-size: 15px; color: #f0e6d3; margin-bottom: 20px; line-height: 1.5;
}
.confirm-btns[data-v-42d4589b] { display: flex; gap: 16px; justify-content: center;
}
.confirm-btn[data-v-42d4589b] { padding: 8px 24px; border: 1px solid; border-radius: 3px; font-family: 'GameFont'; font-size: 13px; cursor: pointer; transition: all 0.2s;
}
.confirm-yes-ok[data-v-42d4589b] { background: rgba(60, 140, 70, 0.25); border-color: #4a8a50; color: #c8e8c0;
}
.confirm-yes-ok[data-v-42d4589b]:hover { background: rgba(60, 140, 70, 0.5); color: #fff;
}
.confirm-no-ok[data-v-42d4589b] { background: rgba(200, 50, 50, 0.2); border-color: #a04040; color: #e8b0b0;
}
.confirm-no-ok[data-v-42d4589b]:hover { background: rgba(200, 50, 50, 0.45); color: #fff;
}

@font-face { font-family: 'GameFont'; src: url('/fonts/VonwaonBitmap-16px.ttf') format('truetype');
}
.abs-fullscreen[data-v-78bbf649] {
  position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 55;
  background-size: 100% 100%; background-repeat: no-repeat; background-position: center;
  display: flex; flex-direction: column; overflow: hidden;
  color: #e8d5a3; font-family: 'GameFont';
}
.abs-header[data-v-78bbf649] { display: flex; align-items: center; justify-content: center; padding: 16px; flex-shrink: 0; position: relative;
}
.abs-title[data-v-78bbf649] { font-size: 20px; color: #ffd700; text-shadow: 0 1px 4px rgba(0,0,0,0.9);
}
.close-btn[data-v-78bbf649] { position: absolute; right: 12px; top: 50%; transform: translateY(-50%); width: 30px; height: 30px; border: 1px solid #8b7355; border-radius: 4px; background: rgba(0,0,0,0.4); color: #ccc; font-size: 16px; cursor: pointer;
}
.close-btn[data-v-78bbf649]:hover { color: #fff; border-color: #ffd700;
}
.abs-content[data-v-78bbf649] { flex: 1; display: flex; flex-direction: column; gap: 8px; padding: 12px 25px; overflow-y: auto; align-items: center; scrollbar-width: none; -ms-overflow-style: none;
}
.abs-content[data-v-78bbf649]::-webkit-scrollbar { display: none; width: 0; height: 0;
}
.abs-fullscreen[data-v-78bbf649] ::-webkit-scrollbar { display: none; width: 0; height: 0;
}
.abs-fullscreen[data-v-78bbf649] * { scrollbar-width: none; -ms-overflow-style: none;
}
.section-title[data-v-78bbf649] { color: #ffd700; font-size: 15px; border-bottom: 1px solid rgba(255,215,0,0.3); padding-bottom: 4px; width: 100%; margin-top: -10px;
}
.section-sub[data-v-78bbf649] { color: #ffd700; font-size: 14px; width: 100%; margin-top: 4px;
}
.equip-slot[data-v-78bbf649] { width: 84px; height: 84px; background: rgba(0,0,0,0.35); border: 1px solid rgba(139,115,85,0.6); border-radius: 6px; display: flex; align-items: center; justify-content: center; cursor: pointer; margin-top: 4px;
}
.equip-slot-icon[data-v-78bbf649] { width: 70px; height: 70px; object-fit: contain; image-rendering: pixelated;
}
.equip-slot-hint[data-v-78bbf649] { color: #ccc; font-size: 13px;
}
.equip-slot-name[data-v-78bbf649] { font-size: 14px;
}
.equip-name[data-v-78bbf649] { color: #ffd700;
}
.equip-level[data-v-78bbf649] { color: #7cff7c; margin-left: 6px;
}
.affix-list[data-v-78bbf649] { display: flex; flex-wrap: wrap; gap: 8px; width: 100%; justify-content: center;
}
.affix-chip[data-v-78bbf649] { display: flex; gap: 6px; align-items: center; padding: 6px 12px; background: rgba(0,0,0,0.3); border: 1px solid rgba(139,115,85,0.5); border-radius: 4px; cursor: pointer; font-size: 14px;
}
.affix-chip.active[data-v-78bbf649] { border-color: #ffd700; background: rgba(255,215,0,0.15);
}
.affix-label[data-v-78bbf649] { color: #e8d5a3;
}
.affix-value[data-v-78bbf649] { color: #7cff7c;
}
.affix-tip[data-v-78bbf649] { color: #fff; font-size: 12px; opacity: 0.8;
}
.preview-box[data-v-78bbf649] { display: flex; gap: 10px; align-items: center; width: 100%; background: rgba(0,0,0,0.35); border: 1px solid rgba(179,136,255,0.5); border-radius: 6px; padding: 8px 12px;
}
.preview-icon[data-v-78bbf649] { width: 48px; height: 48px; object-fit: contain; image-rendering: pixelated;
}
.preview-name[data-v-78bbf649] { font-size: 14px; color: #ffd700;
}
.preview-affix[data-v-78bbf649] { font-size: 14px; color: #7cff7c;
}
.preview-meta[data-v-78bbf649] { font-size: 12px; color: #fff; opacity: 0.8;
}
.material-row[data-v-78bbf649] { display: flex; justify-content: space-between; width: 100%; font-size: 14px; background: rgba(0,0,0,0.25); border: 1px solid rgba(139,115,85,0.4); border-radius: 4px; padding: 6px 12px;
}
.material-label[data-v-78bbf649] { color: #e8d5a3;
}
.material-need[data-v-78bbf649] { color: #fff;
}
.need-lack[data-v-78bbf649] { color: #ff6b6b !important;
}
.syn-btn[data-v-78bbf649] { margin-top: 6px; padding: 10px 40px; background: linear-gradient(180deg, #6b5a3a, #4a3a2a); border: 1px solid #ffd700; border-radius: 4px; color: #ffd700; font-family: 'GameFont'; font-size: 16px; cursor: pointer; letter-spacing: 2px;
}
.syn-btn[data-v-78bbf649]:hover { background: linear-gradient(180deg, #7a6a4a, #5a4a3a);
}
.syn-btn.disabled[data-v-78bbf649] { opacity: 0.5; cursor: not-allowed;
}
.empty-hint[data-v-78bbf649] { color: #fff; font-size: 13px; opacity: 0.8; text-align: center; padding: 20px 0;
}
.money-area[data-v-78bbf649] { flex-shrink: 0; display: flex; justify-content: space-around; padding: 8px;color: #ffd700; font-size: 14px; margin-bottom: 10px;}
.picker-overlay[data-v-78bbf649] { position: absolute; inset: 0; z-index: 60;
}
.result-toast[data-v-78bbf649] { position: fixed; top: 30%; left: 50%; transform: translateX(-50%); z-index: 99999; padding: 12px 24px; border-radius: 6px; font-size: 15px; max-width: 80%; text-align: center;
}
.result-toast.success[data-v-78bbf649] { background: rgba(40,90,40,0.95); color: #7cff7c; border: 1px solid #7cff7c;
}
.result-toast.fail[data-v-78bbf649] { background: rgba(90,40,40,0.95); color: #ff8a8a; border: 1px solid #ff8a8a;
}

.mt-fullscreen[data-v-35eba5e9] {
  position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 55;
  background-size: 100% 100%; background-repeat: no-repeat; background-position: center;
  display: flex; flex-direction: column; overflow: hidden;
  color: #e8d5a3; font-family: var(--game-font, 'GameFont');
}
.mt-header[data-v-35eba5e9] { display: flex; align-items: center; justify-content: center; padding: 16px; flex-shrink: 0; position: relative;
}
.mt-title[data-v-35eba5e9] { font-size: 20px; color: #ffd700; text-shadow: 0 1px 4px rgba(0,0,0,0.9);
}
.close-btn[data-v-35eba5e9] { position: absolute; right: 12px; top: 50%; transform: translateY(-50%); width: 30px; height: 30px; border: 1px solid #8b7355; border-radius: 4px; background: rgba(0,0,0,0.4); color: #ccc; font-size: 16px; cursor: pointer;
}
.close-btn[data-v-35eba5e9]:hover { color: #fff; border-color: #ffd700;
}
.mt-content[data-v-35eba5e9] { flex: 1; display: flex; flex-direction: column; gap: 10px; padding: 12px 25px; overflow-y: auto; align-items: center; scrollbar-width: none; -ms-overflow-style: none;
}
.mt-content[data-v-35eba5e9]::-webkit-scrollbar { display: none; width: 0; height: 0;
}
.section-title[data-v-35eba5e9] { color: #ffd700; font-size: 15px; padding-bottom: 4px; width: 100%; margin-top: -10px;
}
.mount-head[data-v-35eba5e9] { display: flex; align-items: center; gap: 12px; width: 100%; justify-content: center;
}
.mount-icon[data-v-35eba5e9] { width: 64px; height: 64px; object-fit: contain; image-rendering: pixelated;
}
.mount-icon-hint[data-v-35eba5e9] { width: 64px; height: 64px; display: flex; align-items: center; justify-content: center; background: rgba(0,0,0,0.3); border: 1px solid rgba(139,115,85,0.5); border-radius: 6px; font-size: 13px;
}
.mount-name[data-v-35eba5e9] { font-size: 16px; color: #ffd700;
}
.mount-box[data-v-35eba5e9] { width: 84px; height: 84px; background: rgba(0,0,0,0.35); border: 1px solid rgba(139,115,85,0.6); border-radius: 6px; display: flex; align-items: center; justify-content: center; cursor: pointer; margin-top: 4px;
}
.mount-box-icon[data-v-35eba5e9] { width: 70px; height: 70px; object-fit: contain; image-rendering: pixelated;
}
.mount-box-hint[data-v-35eba5e9] { color: #ccc; font-size: 13px;
}
.mount-box-name[data-v-35eba5e9] { font-size: 14px; color: #ffd700; margin-top: 2px;
}
.picker-overlay[data-v-35eba5e9] { position: absolute; inset: 0; z-index: 60;
}
.info-grid[data-v-35eba5e9] { width: 100%; display: flex; flex-direction: column; gap: 6px;
}
.info-row[data-v-35eba5e9] { display: flex; justify-content: space-between; font-size: 14px; background: rgba(0,0,0,0.25); border: 1px solid rgba(139,115,85,0.4); border-radius: 4px; padding: 6px 12px;
}
.info-label[data-v-35eba5e9] { color: #e8d5a3;
}
.info-value[data-v-35eba5e9] { color: #fff;
}
.info-value.ok[data-v-35eba5e9] { color: #7cff7c;
}
.info-value.low-rate[data-v-35eba5e9] { color: #ffb347;
}
.material-row[data-v-35eba5e9] { display: flex; justify-content: space-between; width: 100%; font-size: 14px; background: rgba(0,0,0,0.25); border: 1px solid rgba(139,115,85,0.4); border-radius: 4px; padding: 6px 12px;
}
.material-label[data-v-35eba5e9] { color: #e8d5a3;
}
.material-need[data-v-35eba5e9] { color: #fff;
}
.need-lack[data-v-35eba5e9] { color: #ff6b6b !important;
}
.mt-btn[data-v-35eba5e9] { margin-top: 6px; padding: 10px 40px; background: linear-gradient(180deg, #6b5a3a, #4a3a2a); border: 1px solid #ffd700; border-radius: 4px; color: #ffd700; font-family: var(--game-font, 'GameFont'); font-size: 16px; cursor: pointer; letter-spacing: 2px;
}
.mt-btn[data-v-35eba5e9]:hover { background: linear-gradient(180deg, #7a6a4a, #5a4a3a);
}
.mt-btn.disabled[data-v-35eba5e9] { opacity: 0.5; cursor: not-allowed;
}
.empty-hint[data-v-35eba5e9] { color: #fff; font-size: 14px; opacity: 0.85; text-align: center; padding: 30px 0; line-height: 1.8;
}
.money-area[data-v-35eba5e9] { flex-shrink: 0; display: flex; justify-content: space-around; padding: 8px; color: #ffd700; font-size: 14px; margin-bottom: 10px;
}
.result-toast[data-v-35eba5e9] { position: fixed; top: 30%; left: 50%; transform: translateX(-50%); z-index: 99999; padding: 12px 24px; border-radius: 6px; font-size: 15px; max-width: 80%; text-align: center;
}
.result-toast.success[data-v-35eba5e9] { background: rgba(40,90,40,0.95); color: #7cff7c; border: 1px solid #7cff7c;
}
.result-toast.fail[data-v-35eba5e9] { background: rgba(90,40,40,0.95); color: #ff8a8a; border: 1px solid #ff8a8a;
}

@font-face { font-family: 'GameFont'; src: url('/fonts/VonwaonBitmap-16px.ttf') format('truetype');
}
.inl-fullscreen[data-v-84340ae8] {
  position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 55;
  background-size: 100% 100%; background-repeat: no-repeat; background-position: center;
  display: flex; flex-direction: column; overflow: hidden;
  color: #e8d5a3; font-family: 'GameFont';
}
.inl-header[data-v-84340ae8] { display: flex; align-items: center; justify-content: center; padding: 16px; flex-shrink: 0; position: relative;
}
.inl-title[data-v-84340ae8] { font-size: 20px; color: #ffd700; text-shadow: 0 1px 4px rgba(0,0,0,0.9);
}
.close-btn[data-v-84340ae8] { position: absolute; right: 12px; top: 50%; transform: translateY(-50%); width: 30px; height: 30px; border: 1px solid #8b7355; border-radius: 4px; background: rgba(0,0,0,0.4); color: #ccc; font-size: 16px; cursor: pointer;
}
.close-btn[data-v-84340ae8]:hover { color: #fff; border-color: #ffd700;
}
.inl-content[data-v-84340ae8] { flex: 1; display: flex; flex-direction: column; gap: 5px; padding: 0px 25px; overflow-y: auto; align-items: center; scrollbar-width: none; -ms-overflow-style: none;
}
.inl-content[data-v-84340ae8]::-webkit-scrollbar { display: none; width: 0; height: 0;
}
.inl-fullscreen[data-v-84340ae8] ::-webkit-scrollbar { display: none; width: 0; height: 0;
}
.inl-fullscreen[data-v-84340ae8] * { scrollbar-width: none; -ms-overflow-style: none;
}
.section-title[data-v-84340ae8] { color: #ffd700; font-size: 15px;  padding-bottom: 4px; width: 100%; margin-top: 4px;
}
.equip-slot[data-v-84340ae8] { width: 60px; height: 60px; background: rgba(0,0,0,0.35); border: 1px solid rgba(139,115,85,0.6); border-radius: 6px; display: flex; align-items: center; justify-content: center; cursor: pointer; margin-top: 4px;
}
.equip-slot-icon[data-v-84340ae8] { width: 50px; height: 50px; object-fit: contain; image-rendering: pixelated;
}
.equip-slot-hint[data-v-84340ae8] { color: #ccc; font-size: 13px;
}
.equip-slot-name[data-v-84340ae8] { font-size: 14px;
}
.equip-name[data-v-84340ae8] { color: #ffd700;
}
.equip-level[data-v-84340ae8] { color: #7cff7c; margin-left: 6px;
}
.embed-list[data-v-84340ae8] { display: flex; flex-wrap: wrap; gap: 6px; width: 100%; justify-content: center;
}
.embed-chip[data-v-84340ae8] { display: flex; gap: 4px; padding: 4px 10px; background: rgba(179,136,255,0.15); border: 1px solid rgba(179,136,255,0.6); border-radius: 4px; font-size: 13px;
}
.embed-label[data-v-84340ae8] { color: #e8d5a3;
}
.embed-value[data-v-84340ae8] { color: #7cff7c;
}
.xifu-info[data-v-84340ae8] { font-size: 14px; text-align: center;
}
.xifu-name[data-v-84340ae8] { color: #ffd700;
}
.xifu-affix[data-v-84340ae8] { color: #7cff7c;
}
.xifu-max[data-v-84340ae8] { color: #ffd700; opacity: 0.9;
}
.xifu-meta[data-v-84340ae8] { color: #fff; opacity: 0.8; font-size: 12px;
}
.xifu-desc[data-v-84340ae8] { color: #fff; opacity: 0.85; font-size: 12px; margin-top: 2px;
}
.validate-box[data-v-84340ae8] { width: 100%; text-align: center; font-size: 13px; padding: 6px; border-radius: 4px;
}
.v-ok[data-v-84340ae8] { color: #7cff7c; background: rgba(40,90,40,0.3); border: 1px solid rgba(124,255,124,0.4);
}
.v-bad[data-v-84340ae8] { color: #ff8a8a; background: rgba(90,40,40,0.25); border: 1px solid rgba(255,138,138,0.4);
}
.rate-row[data-v-84340ae8] { display: flex; justify-content: space-between; width: 100%; font-size: 15px; background: rgba(0,0,0,0.25); border: 1px solid rgba(139,115,85,0.4); border-radius: 4px; padding: 6px 12px;
}
.rate-label[data-v-84340ae8] { color: #e8d5a3;
}
.rate-value[data-v-84340ae8] { color: #ffd700; font-weight: bold;
}
.lucky-block[data-v-84340ae8] { width: 100%; display: flex; flex-direction: column; gap: 6px;
}
.lucky-row[data-v-84340ae8] { display: flex; align-items: center; justify-content: space-between; background: rgba(0,0,0,0.25); border: 1px solid rgba(139,115,85,0.4); border-radius: 4px; padding: 5px 12px;
}
.lucky-name[data-v-84340ae8] { font-size: 13px; color: #e8d5a3;
}
.lucky-own[data-v-84340ae8] { font-size: 12px; color: #fff; opacity: 0.8;
}
.step-ctrl[data-v-84340ae8] { display: flex; align-items: center; gap: 8px;
}
.step-minus[data-v-84340ae8], .step-plus[data-v-84340ae8] { width: 26px; height: 26px; border: 1px solid #8b7355; border-radius: 4px; background: rgba(0,0,0,0.4); color: #ffd700; font-size: 16px; cursor: pointer;
}
.step-minus[data-v-84340ae8]:disabled, .step-plus[data-v-84340ae8]:disabled { opacity: 0.4; cursor: not-allowed;
}
.step-qty[data-v-84340ae8] { min-width: 18px; text-align: center; color: #fff; font-size: 14px;
}
.material-row[data-v-84340ae8] { display: flex; justify-content: space-between; width: 100%; font-size: 14px; background: rgba(0,0,0,0.25); border: 1px solid rgba(139,115,85,0.4); border-radius: 4px; padding: 6px 12px;
}
.material-label[data-v-84340ae8] { color: #e8d5a3;
}
.material-need[data-v-84340ae8] { color: #fff;
}
.need-lack[data-v-84340ae8] { color: #ff6b6b !important;
}
.syn-btn[data-v-84340ae8] { margin-top: 6px; padding: 10px 40px; background: linear-gradient(180deg, #6b5a3a, #4a3a2a); border: 1px solid #ffd700; border-radius: 4px; color: #ffd700; font-family: 'GameFont'; font-size: 16px; cursor: pointer; letter-spacing: 2px;
}
.syn-btn[data-v-84340ae8]:hover { background: linear-gradient(180deg, #7a6a4a, #5a4a3a);
}
.syn-btn.disabled[data-v-84340ae8] { opacity: 0.5; cursor: not-allowed;
}
.empty-hint[data-v-84340ae8] { color: #fff; font-size: 13px; opacity: 0.8; text-align: center; padding: 20px 0;
}
.money-area[data-v-84340ae8] { flex-shrink: 0; display: flex; justify-content: space-around; padding: 8px; color: #ffd700; font-size: 14px;margin-bottom: 10px;}
.picker-overlay[data-v-84340ae8] { position: absolute; inset: 0; z-index: 60;
}
.result-toast[data-v-84340ae8] { position: fixed; top: 30%; left: 50%; transform: translateX(-50%); z-index: 99999; padding: 12px 24px; border-radius: 6px; font-size: 15px; max-width: 80%; text-align: center;
}
.result-toast.success[data-v-84340ae8] { background: rgba(40,90,40,0.95); color: #7cff7c; border: 1px solid #7cff7c;
}
.result-toast.fail[data-v-84340ae8] { background: rgba(90,40,40,0.95); color: #ff8a8a; border: 1px solid #ff8a8a;
}

@font-face { font-family: 'GameFont'; src: url('/fonts/VonwaonBitmap-16px.ttf') format('truetype');
}
.skill-fullscreen[data-v-a074cb42] {
  position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 55;
  background-size: 100% 100%; background-repeat: no-repeat; background-position: center;
  display: flex; flex-direction: column; overflow: hidden;
  color: #e8d5a3; font-family: 'GameFont';
  box-sizing: border-box;
}
.skill-header[data-v-a074cb42] { display: flex; align-items: center; justify-content: center; padding: 20px 20px; position: relative;
}
.skill-title[data-v-a074cb42] { font-family: 'GameFont'; font-size: 22px; color: #ffd700; text-shadow: 0 1px 4px rgba(0,0,0,0.9);
}
.close-btn[data-v-a074cb42] { position: absolute; right: 20px; width: 32px; height: 32px; border: 1px solid #8b7355; border-radius: 4px; background: rgba(0,0,0,0.4); color: #ccc; font-size: 18px; cursor: pointer; font-family: 'GameFont';
}
.skill-tabs[data-v-a074cb42] { display: flex; gap: 11px; margin-bottom: 4px; margin-top: 5%; padding: 0 20px;
}
.tab-btn[data-v-a074cb42] { padding: 4px 14px; border: 1px solid rgba(139,115,85,0.4); border-radius: 3px; background: rgba(0,0,0,0.4); color: #aaa; cursor: pointer; font-family: 'GameFont'; font-size: 14px;
}
.tab-btn.active[data-v-a074cb42] { background: rgba(255,215,0,0.15); border-color: #ffd700; color: #ffd700;
}
.sect-label[data-v-a074cb42] { text-align: center; color: #4dc4ff; font-size: 14px; padding: 4px 0; flex-shrink: 0;
}
.skill-middle[data-v-a074cb42] { flex: 1; display: flex; flex-direction: column; padding: 0 12px; overflow: hidden;
}
.skill-list-wrap[data-v-a074cb42] { flex: 1; overflow-y: auto; display: flex; flex-direction: column; gap: 2px; width: 96%; margin: 0 auto;
}
.skill-category-title[data-v-a074cb42] { color: #ffd700; font-size: 13px; border-bottom: 1px solid rgba(255,215,0,0.3); padding: 6px 0 2px; margin-top: 4px;
}
.skill-row[data-v-a074cb42] {
  display: flex; justify-content: space-between; align-items: center;
  padding: 6px 10px; background: rgba(0,0,0,0.25); border: 1px solid #665544;
  border-radius: 3px; cursor: pointer; font-size: 14px; margin-bottom: 4px;
}
.skill-row[data-v-a074cb42]:hover { border-color: #8b7355; background: rgba(0,0,0,0.35);
}
.skill-row.selected[data-v-a074cb42] { border-color: #ffd700; background: rgba(255,215,0,0.08);
}
.skill-row-name[data-v-a074cb42] { color: #fff;
}
.skill-row-level[data-v-a074cb42] { color: #7cff7c; font-size: 13px;
}
.skill-detail-bar[data-v-a074cb42] {
  flex-shrink: 0; padding: 8px 16px; background: rgba(0,0,0,0.3);
  border-top: 1px solid #665544; display: flex; flex-direction: column; gap: 4px;
  width: 96%; box-sizing: border-box; margin: -8px auto 0; margin-bottom: 2%;
}
.detail-bar-row[data-v-a074cb42] { display: flex; justify-content: space-between; font-size: 13px;
}
.detail-bar-label[data-v-a074cb42] { color: #e8d5a3;
}
.detail-bar-value[data-v-a074cb42] { color: #ccc;
}
.gold-color[data-v-a074cb42] { color: #ffd700;
}
.enough-color[data-v-a074cb42] { color: #7cff7c;
}
.not-enough-color[data-v-a074cb42] { color: #ff6666;
}
.max-level[data-v-a074cb42] { text-align: center; color: #ffd700; font-size: 14px; padding: 4px;
}
.detail-bar-btn-row[data-v-a074cb42] { display: flex; gap: 8px; justify-content: center; margin-top: 4px;
}
.detail-bar-btn-row .learn-btn[data-v-a074cb42] { flex: 1; max-width: 130px;
}
.batch-btn[data-v-a074cb42] { background: #2a5a3a; border-color: #4dc4ff; color: #8ae0ff;
}
.batch-btn[data-v-a074cb42]:hover { background: linear-gradient(180deg, #3a7a4a, #2a5a3a);
}
.sect-passive-tip[data-v-a074cb42] { text-align: center; color: #888; font-size: 14px; padding: 8px;
}
.learn-btn[data-v-a074cb42] {
  padding: 6px; background: #735131; border: 1px solid #ffd700; border-radius: 4px;
  color: #f5d15f; font-size: 14px; cursor: pointer; font-family: 'GameFont'; letter-spacing: 2px;
}
.learn-btn[data-v-a074cb42]:hover { background: linear-gradient(180deg, #8a5a3a, #6a4a2a);
}
.learn-btn[data-v-a074cb42]:disabled { opacity: 0.5; cursor: not-allowed;
}
.money-area[data-v-a074cb42] { flex: 0 0 8%; display: flex; justify-content: space-between; align-items: center; padding: 4px 60px; font-size: 16px;
}
.money-cultivation[data-v-a074cb42] { color: #aae0ff;
}
.money-gold[data-v-a074cb42] { color: #ffd700;
}

.status-fullscreen[data-v-1eef87b7] {
  position: fixed;
  inset: 0;
  z-index: 400;
  background-size: 100% 100%;
  background-repeat: no-repeat;
  background-position: center;
  display: flex;
  flex-direction: column;
  max-height: calc(100% - 202px);
}
.status-header[data-v-1eef87b7] {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px 20px;
  position: relative;
}
.status-title[data-v-1eef87b7] {
  color: #f5d15f;
  font-family: 'GameFont', sans-serif;
  font-size: 20px;
  letter-spacing: 4px;
}
.close-btn[data-v-1eef87b7] {
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  width: 32px;
  height: 32px;
  background: rgba(0,0,0,0.4);
  border: 1px solid rgba(255,255,255,0.2);
  border-radius: 50%;
  color: #fff;
  font-size: 16px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}
.status-body[data-v-1eef87b7] {
  flex: 1;
  overflow-y: auto;
  padding: 10px 20px 140px;
  margin-top: 5%;
}
.status-list[data-v-1eef87b7] {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.status-row[data-v-1eef87b7] {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 16px;
  padding: 5px 0px;
}
.status-label[data-v-1eef87b7] {
  color: #f5d15f;
  font-family: 'GameFont', sans-serif;
  font-size: 16px;
  letter-spacing: 1px;
  font-weight: normal;
}
.status-value[data-v-1eef87b7] {
  color: #fff;
  font-family: 'GameFont', sans-serif;
  font-size: 16px;
  letter-spacing: 1px;
  font-weight: normal;
}

.game-viewport[data-v-dbeb31c9] {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  display: flex;
  justify-content: center;
  align-items: center;
  /* 背景：低分辨率手机等比缩放后两侧/上下留边区域——用游戏风格的深色渐变（不再是刺眼纯黑） */
  background: radial-gradient(ellipse at center, #2a2336 0%, #16101f 55%, #0c0812 100%);
  overflow: hidden;
}
.game-scaler[data-v-dbeb31c9] {
  flex-shrink: 0;
  transform-origin: center center;
}
.game-wrapper[data-v-dbeb31c9] {
  position: relative;
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.game-area[data-v-dbeb31c9] {
  position: relative;
  width: 100%;
  flex: 1;
  overflow: hidden;
  background: #1a1a2e;
}
.chat-display-area[data-v-dbeb31c9] {  position: relative;
  width: 100%;
  height: 11.67%;
  overflow: hidden;
}
.mail-icon[data-v-dbeb31c9] {
  position: absolute;
  right: 6px;
  bottom: 2px;
  width: 30px;
  height: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  z-index: 10;
}
/* 小喇叭图标：位于邮件图标左侧 */
.mail-icon.horn-icon[data-v-dbeb31c9] {
  right: 10px;
  top:0px;
}
.mail-icon[data-v-dbeb31c9]:hover { background: rgba(40, 40, 60, 0.8);
}
.mail-icon-emoji[data-v-dbeb31c9] { font-size: 30px;
}
.mail-icon[data-v-dbeb31c9]::after {
  content: '';
  position: absolute;
  top: 3px;
  right: -2px;
  width: 8px;
  height: 8px;
  background: #ff5252;
  border-radius: 50%;
  box-shadow: 0 0 4px rgba(255, 82, 82, 0.8);
}
.keyboard-area[data-v-dbeb31c9] {
  position: relative;
  width: 100%;
  height: 21.67%;
  overflow: hidden;
  background: linear-gradient(to bottom, #2a2a3e, #1a1a2e);
  z-index: 60;
}
.keyboard-area.full[data-v-dbeb31c9] {
  height: 33.33%;
}
.global-toast[data-v-dbeb31c9] {
  position: absolute;
  top: 16px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 9999;
  background: rgba(200, 50, 50, 0.92);
  color: #fff;
  padding: 10px 24px;
  border-radius: 8px;
  font-size: 14px;
  white-space: nowrap;
  pointer-events: none;
  box-shadow: 0 4px 12px rgba(0,0,0,0.5);
}
.toast-fade-enter-active[data-v-dbeb31c9],
.toast-fade-leave-active[data-v-dbeb31c9] {
  transition: opacity 0.3s ease;
}
.toast-fade-enter-from[data-v-dbeb31c9],
.toast-fade-leave-to[data-v-dbeb31c9] {
  opacity: 0;
}

/* ── 全局太极加载动画 ── */
.global-loading-overlay[data-v-dbeb31c9] {  position: absolute;
  top: 50px;
  right: 10px;
  z-index: 9000;
  pointer-events: none;
}
.taiji-wrap[data-v-dbeb31c9] {
  position: relative;
  width: 44px;
  height: 44px;
}
.taiji[data-v-dbeb31c9] {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  overflow: hidden;
  position: relative;
  animation: taiji-spin-dbeb31c9 1.2s linear infinite;
  border: 2px solid #e8c84a;
  box-shadow: 0 0 6px rgba(232, 200, 74, 0.5);
  position: absolute;
  top: 6px;
  left: 6px;
}
.taiji-white[data-v-dbeb31c9] {
  position: absolute;
  width: 100%;
  height: 50%;
  background: #f0e6d0;
  top: 0;
}
.taiji-black[data-v-dbeb31c9] {
  position: absolute;
  width: 100%;
  height: 50%;
  background: #2a2a2a;
  bottom: 0;
}
.taiji[data-v-dbeb31c9]::before {
  content: '';
  position: absolute;
  width: 50%;
  height: 50%;
  background: #2a2a2a;
  border-radius: 50%;
  top: 25%;
  left: 0;
}
.taiji[data-v-dbeb31c9]::after {
  content: '';
  position: absolute;
  width: 50%;
  height: 50%;
  background: #f0e6d0;
  border-radius: 50%;
  bottom: 25%;
  right: 0;
}
.taiji-eye-black[data-v-dbeb31c9] {
  width: 6px;
  height: 6px;
  background: #2a2a2a;
  border-radius: 50%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 2;
}
.taiji-eye-white[data-v-dbeb31c9] {
  width: 6px;
  height: 6px;
  background: #f0e6d0;
  border-radius: 50%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 2;
}
.taiji-dot[data-v-dbeb31c9] {
  position: absolute;
  width: 5px;
  height: 5px;
  background: #e8c84a;
  border-radius: 50%;
  animation: taiji-dot-pulse-dbeb31c9 1.5s ease-in-out infinite;
}
.taiji-dot.dot1[data-v-dbeb31c9] { top: 0; left: 50%; transform: translateX(-50%); animation-delay: 0s;
}
.taiji-dot.dot2[data-v-dbeb31c9] { top: 15%; right: 5%; animation-delay: 0.25s;
}
.taiji-dot.dot3[data-v-dbeb31c9] { top: 50%; right: 0; transform: translateY(-50%); animation-delay: 0.5s;
}
.taiji-dot.dot4[data-v-dbeb31c9] { bottom: 15%; right: 5%; animation-delay: 0.75s;
}
.taiji-dot.dot5[data-v-dbeb31c9] { bottom: 0; left: 50%; transform: translateX(-50%); animation-delay: 1s;
}
.taiji-dot.dot6[data-v-dbeb31c9] { bottom: 15%; left: 5%; animation-delay: 1.25s;
}
@keyframes taiji-spin-dbeb31c9 {
from { transform: rotate(0deg);
}
to { transform: rotate(360deg);
}
}
@keyframes taiji-dot-pulse-dbeb31c9 {
0%, 100% { opacity: 0.3; transform: scale(0.8);
}
50% { opacity: 1; transform: scale(1.2);
}
}

/* 切磋等待弹窗（全局遮罩，不可穿透） */
.pvp-overlay[data-v-dbeb31c9] {
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  z-index: 99999;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0, 0, 0, 0.45);
}
.pvp-panel[data-v-dbeb31c9] {
  width: 280px;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 30px 20px 20px;
}
.pvp-header[data-v-dbeb31c9] { margin-bottom: 16px;
}
.pvp-title[data-v-dbeb31c9] {
  font-size: 22px;
  color: #ffd700;
  text-shadow: 0 1px 4px rgba(0,0,0,0.9);
}
.pvp-body[data-v-dbeb31c9] {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  width: 100%;
}
.pvp-info[data-v-dbeb31c9] {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  margin-bottom: 8px;
}
.pvp-desc[data-v-dbeb31c9] {
  font-size: 13px;
  color: #fff;
}
.action-btn[data-v-dbeb31c9] {
  width: 100%;
  padding: 10px 0;
  border: 1px solid rgba(139,115,85,0.6);
  border-radius: 4px;
  background: rgba(0,0,0,0.5);
  cursor: pointer;
  font-size: 14px;
  color: #e8d5a3;
  text-shadow: 0 1px 2px rgba(0,0,0,0.8);
}
.reject-btn[data-v-dbeb31c9]:hover { background: rgba(200,50,50,0.2); border-color: #ff4444; color: #ff4444;
}
.ann-banner[data-v-dbeb31c9] { position: absolute; top: 0; left: 0; right: 0; z-index: 99998; background: #8b6239; border: 2px solid #d4a76a; box-shadow: inset 0 0 0 1px #5a3a1b, inset 2px 2px 0 rgba(255,255,255,0.1), inset -2px -2px 0 rgba(0,0,0,0.15); color: #f5deb3; overflow: hidden; height: 40px; display: flex; align-items: center;
}
.ann-banner-inner[data-v-dbeb31c9] { display: flex; align-items: center; white-space: nowrap; animation: ann-scroll-dbeb31c9 12s linear forwards;
}
.ann-label[data-v-dbeb31c9] { color: #ffd700; font-size: 16px; font-weight: bold; padding: 0 14px; flex-shrink: 0;
}
.ann-marquee[data-v-dbeb31c9] { color: #f5deb3; font-size: 16px; padding-right: 60px;
}
@keyframes ann-scroll-dbeb31c9 {
0% { transform: translateX(100%);
}
100% { transform: translateX(-100%);
}
}

/* 移动端：全局去除点击/触摸时的默认半透明高亮遮罩（含图片） */
* {
  -webkit-tap-highlight-color: transparent;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
/* 图片额外去掉长按系统菜单/选中遮罩 */
img {
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
}

/* 选区/角色选择/角色创建界面显示时禁用底层画布交互，防止点击穿透到 NPC */
.game-area.auth-overlay-active canvas {
  pointer-events: none !important;
}

/* 全局禁止浏览器默认滚动条（游戏为固定分辨率缩放，页面不应出现滚动） */
html,
body {
  overflow: hidden;
  overscroll-behavior: none;
  height: 100%;
}

/* 隐藏所有默认滚动条（Webkit/Chrome/Edge/移动端 + Firefox + IE），滚动功能保留 */
::-webkit-scrollbar {
  width: 0;
  height: 0;
  display: none;
}
* {
  scrollbar-width: none;
  -ms-overflow-style: none;
}
/* ============================================================
 * 物品 / 法宝 详情弹窗统一卡片外观
 * 设计来源：详情界面.html（像素风青色边框 + 四角装饰）
 * 由 ItemDetailPanel / FabaoDetailPanel 复用，保持详情弹窗视觉一致。
 * ============================================================ */

.item-detail-box {
  width: 50%;
  max-width: 340px;
  max-height: 90vh;
  /* 卡片主体：青色描边 + 青绿底（来自详情界面.html） */
  background: #1a8a9a;
  border: 3px solid #00f0f0;
  border-radius: 0;
  box-shadow: 0 0 16px rgba(0, 240, 240, 0.25);
  display: flex;
  flex-direction: column;
  padding: 20px;
  position: relative;
  /* 由 .detail-content 内部滚动，四角装饰固定在卡片四角不随内容滚动 */
  overflow: hidden;
}

/* 详情内容可滚动（卡片本身 overflow:hidden 锁定四角装饰） */
.item-detail-box .detail-content {
  max-height: calc(90vh - 40px);
  overflow-y: auto;
  padding-right: 4px;
}

/* 四角像素装饰：用 1px 元素 + box-shadow 逐像素绘制（与详情界面.html 一致） */
.item-detail-box .detail-corner {
  position: absolute;
  width: 1px;
  height: 1px;
  background: transparent;
  pointer-events: none;
  box-shadow:
    3px 0px #00f0f0, 4px 0px #00f0f0, 5px 0px #00f0f0, 6px 0px #00f0f0, 7px 0px #00f0f0, 8px 0px #00f0f0,
    11px 0px #00f0f0, 12px 0px #00f0f0, 13px 0px #00f0f0, 14px 0px #00f0f0, 15px 0px #00f0f0, 16px 0px #00f0f0,
    19px 0px #00f0f0, 20px 0px #00f0f0, 21px 0px #00f0f0, 22px 0px #00f0f0, 23px 0px #00f0f0, 24px 0px #00f0f0, 25px 0px #00f0f0, 26px 0px #00f0f0,
    3px 1px #00f0f0, 4px 1px #00f0f0, 5px 1px #00f0f0, 6px 1px #00f0f0, 7px 1px #00f0f0, 8px 1px #00f0f0,
    11px 1px #00f0f0, 12px 1px #00f0f0, 13px 1px #00f0f0, 14px 1px #00f0f0, 15px 1px #00f0f0, 16px 1px #00f0f0,
    19px 1px #00f0f0, 20px 1px #00f0f0, 21px 1px #00f0f0, 22px 1px #00f0f0, 23px 1px #00f0f0, 24px 1px #00f0f0, 25px 1px #00f0f0, 26px 1px #00f0f0,
    3px 2px #00f0f0, 4px 2px #00f0f0, 7px 2px #00f0f0, 8px 2px #00f0f0,
    11px 2px #00f0f0, 12px 2px #00f0f0, 15px 2px #00f0f0, 16px 2px #00f0f0,
    19px 2px #00f0f0, 20px 2px #00f0f0, 25px 2px #00f0f0, 26px 2px #00f0f0,
    3px 3px #00f0f0, 4px 3px #00f0f0, 7px 3px #00f0f0, 8px 3px #00f0f0,
    11px 3px #00f0f0, 12px 3px #00f0f0, 15px 3px #00f0f0, 16px 3px #00f0f0,
    19px 3px #00f0f0, 20px 3px #00f0f0, 25px 3px #00f0f0, 26px 3px #00f0f0,
    3px 4px #00f0f0, 4px 4px #00f0f0, 5px 4px #00f0f0, 6px 4px #00f0f0, 7px 4px #00f0f0, 8px 4px #00f0f0, 9px 4px #00f0f0, 10px 4px #00f0f0, 11px 4px #00f0f0, 12px 4px #00f0f0, 13px 4px #00f0f0, 14px 4px #00f0f0, 15px 4px #00f0f0, 16px 4px #00f0f0,
    19px 4px #00f0f0, 20px 4px #00f0f0, 23px 4px #00f0f0, 24px 4px #00f0f0, 25px 4px #00f0f0, 26px 4px #00f0f0,
    3px 5px #00f0f0, 4px 5px #00f0f0, 5px 5px #00f0f0, 6px 5px #00f0f0, 7px 5px #00f0f0, 8px 5px #00f0f0, 9px 5px #00f0f0, 10px 5px #00f0f0, 11px 5px #00f0f0, 12px 5px #00f0f0, 13px 5px #00f0f0, 14px 5px #00f0f0, 15px 5px #00f0f0, 16px 5px #00f0f0,
    19px 5px #00f0f0, 20px 5px #00f0f0, 23px 5px #00f0f0, 24px 5px #00f0f0, 25px 5px #00f0f0, 26px 5px #00f0f0,
    7px 6px #00f0f0, 8px 6px #00f0f0, 11px 6px #00f0f0, 12px 6px #00f0f0, 19px 6px #00f0f0, 20px 6px #00f0f0,
    7px 7px #00f0f0, 8px 7px #00f0f0, 11px 7px #00f0f0, 12px 7px #00f0f0, 19px 7px #00f0f0, 20px 7px #00f0f0,
    3px 8px #00f0f0, 4px 8px #00f0f0, 5px 8px #00f0f0, 6px 8px #00f0f0, 7px 8px #00f0f0, 8px 8px #00f0f0, 9px 8px #00f0f0, 10px 8px #00f0f0, 11px 8px #00f0f0, 12px 8px #00f0f0, 13px 8px #00f0f0, 14px 8px #00f0f0, 15px 8px #00f0f0, 16px 8px #00f0f0, 17px 8px #00f0f0, 18px 8px #00f0f0, 19px 8px #00f0f0, 20px 8px #00f0f0,
    3px 9px #00f0f0, 4px 9px #00f0f0, 5px 9px #00f0f0, 6px 9px #00f0f0, 7px 9px #00f0f0, 8px 9px #00f0f0, 9px 9px #00f0f0, 10px 9px #00f0f0, 11px 9px #00f0f0, 12px 9px #00f0f0, 13px 9px #00f0f0, 14px 9px #00f0f0, 15px 9px #00f0f0, 16px 9px #00f0f0, 17px 9px #00f0f0, 18px 9px #00f0f0, 19px 9px #00f0f0, 20px 9px #00f0f0,
    3px 10px #00f0f0, 4px 10px #00f0f0, 7px 10px #00f0f0, 8px 10px #00f0f0, 11px 10px #00f0f0, 12px 10px #00f0f0,
    3px 11px #00f0f0, 4px 11px #00f0f0, 7px 11px #00f0f0, 8px 11px #00f0f0, 11px 11px #00f0f0, 12px 11px #00f0f0,
    3px 12px #00f0f0, 4px 12px #00f0f0, 5px 12px #00f0f0, 6px 12px #00f0f0, 7px 12px #00f0f0, 8px 12px #00f0f0, 11px 12px #00f0f0, 12px 12px #00f0f0,
    3px 13px #00f0f0, 4px 13px #00f0f0, 5px 13px #00f0f0, 6px 13px #00f0f0, 7px 13px #00f0f0, 8px 13px #00f0f0, 11px 13px #00f0f0, 12px 13px #00f0f0,
    11px 14px #00f0f0, 12px 14px #00f0f0,
    11px 15px #00f0f0, 12px 15px #00f0f0,
    3px 16px #00f0f0, 4px 16px #00f0f0, 5px 16px #00f0f0, 6px 16px #00f0f0, 7px 16px #00f0f0, 8px 16px #00f0f0, 9px 16px #00f0f0, 10px 16px #00f0f0, 11px 16px #00f0f0, 12px 16px #00f0f0,
    3px 17px #00f0f0, 4px 17px #00f0f0, 5px 17px #00f0f0, 6px 17px #00f0f0, 7px 17px #00f0f0, 8px 17px #00f0f0, 9px 17px #00f0f0, 10px 17px #00f0f0, 11px 17px #00f0f0, 12px 17px #00f0f0,
    3px 18px #00f0f0, 4px 18px #00f0f0,
    3px 19px #00f0f0, 4px 19px #00f0f0,
    3px 20px #00f0f0, 4px 20px #00f0f0, 7px 20px #00f0f0, 8px 20px #00f0f0,
    3px 21px #00f0f0, 4px 21px #00f0f0, 7px 21px #00f0f0, 8px 21px #00f0f0,
    3px 22px #00f0f0, 4px 22px #00f0f0, 5px 22px #00f0f0, 6px 22px #00f0f0, 7px 22px #00f0f0, 8px 22px #00f0f0;
}

/* 四角定位（其余三角用翻转复用同一像素图） */
.item-detail-box .detail-corner.tl { top: 5px; left: 4px; }
.item-detail-box .detail-corner.tr { top: 5px; right: 4px; transform: scaleX(-1); }
.item-detail-box .detail-corner.bl { bottom: 5px; left: 4px; transform: scaleY(-1); }
.item-detail-box .detail-corner.br { bottom: 5px; right: 4px; transform: scale(-1, -1); }

/* ============================================================
 * 通用对话框青卡外观（离队 / 入队邀请 / PK / 全局确认 / 贩卖购买等）
 * 与详情卡完全一致，保证全游戏弹窗视觉统一。
 * 用法：容器加 class="pixel-dialog-box"，并在其内部放 4 个角装饰：
 *   <div class="pixel-corner tl"></div><div class="pixel-corner tr"></div>
 *   <div class="pixel-corner bl"></div><div class="pixel-corner br"></div>
 * ============================================================ */
.pixel-dialog-box {
  background: #1a8a9a;
  border: 3px solid #00f0f0;
  border-radius: 0;
  box-shadow: 0 0 16px rgba(0, 240, 240, 0.25);
  position: relative;
  overflow: hidden;
}

/* 四角像素装饰（同详情卡，1px 元素 + box-shadow 逐像素绘制） */
.pixel-dialog-box .pixel-corner {
  position: absolute;
  width: 1px;
  height: 1px;
  background: transparent;
  pointer-events: none;
  box-shadow:
    3px 0px #00f0f0, 4px 0px #00f0f0, 5px 0px #00f0f0, 6px 0px #00f0f0, 7px 0px #00f0f0, 8px 0px #00f0f0,
    11px 0px #00f0f0, 12px 0px #00f0f0, 13px 0px #00f0f0, 14px 0px #00f0f0, 15px 0px #00f0f0, 16px 0px #00f0f0,
    19px 0px #00f0f0, 20px 0px #00f0f0, 21px 0px #00f0f0, 22px 0px #00f0f0, 23px 0px #00f0f0, 24px 0px #00f0f0, 25px 0px #00f0f0, 26px 0px #00f0f0,
    3px 1px #00f0f0, 4px 1px #00f0f0, 5px 1px #00f0f0, 6px 1px #00f0f0, 7px 1px #00f0f0, 8px 1px #00f0f0,
    11px 1px #00f0f0, 12px 1px #00f0f0, 13px 1px #00f0f0, 14px 1px #00f0f0, 15px 1px #00f0f0, 16px 1px #00f0f0,
    19px 1px #00f0f0, 20px 1px #00f0f0, 21px 1px #00f0f0, 22px 1px #00f0f0, 23px 1px #00f0f0, 24px 1px #00f0f0, 25px 1px #00f0f0, 26px 1px #00f0f0,
    3px 2px #00f0f0, 4px 2px #00f0f0, 7px 2px #00f0f0, 8px 2px #00f0f0,
    11px 2px #00f0f0, 12px 2px #00f0f0, 15px 2px #00f0f0, 16px 2px #00f0f0,
    19px 2px #00f0f0, 20px 2px #00f0f0, 25px 2px #00f0f0, 26px 2px #00f0f0,
    3px 3px #00f0f0, 4px 3px #00f0f0, 7px 3px #00f0f0, 8px 3px #00f0f0,
    11px 3px #00f0f0, 12px 3px #00f0f0, 15px 3px #00f0f0, 16px 3px #00f0f0,
    19px 3px #00f0f0, 20px 3px #00f0f0, 25px 3px #00f0f0, 26px 3px #00f0f0,
    3px 4px #00f0f0, 4px 4px #00f0f0, 5px 4px #00f0f0, 6px 4px #00f0f0, 7px 4px #00f0f0, 8px 4px #00f0f0, 9px 4px #00f0f0, 10px 4px #00f0f0, 11px 4px #00f0f0, 12px 4px #00f0f0, 13px 4px #00f0f0, 14px 4px #00f0f0, 15px 4px #00f0f0, 16px 4px #00f0f0,
    19px 4px #00f0f0, 20px 4px #00f0f0, 23px 4px #00f0f0, 24px 4px #00f0f0, 25px 4px #00f0f0, 26px 4px #00f0f0,
    3px 5px #00f0f0, 4px 5px #00f0f0, 5px 5px #00f0f0, 6px 5px #00f0f0, 7px 5px #00f0f0, 8px 5px #00f0f0, 9px 5px #00f0f0, 10px 5px #00f0f0, 11px 5px #00f0f0, 12px 5px #00f0f0, 13px 5px #00f0f0, 14px 5px #00f0f0, 15px 5px #00f0f0, 16px 5px #00f0f0,
    19px 5px #00f0f0, 20px 5px #00f0f0, 23px 5px #00f0f0, 24px 5px #00f0f0, 25px 5px #00f0f0, 26px 5px #00f0f0,
    7px 6px #00f0f0, 8px 6px #00f0f0, 11px 6px #00f0f0, 12px 6px #00f0f0, 19px 6px #00f0f0, 20px 6px #00f0f0,
    7px 7px #00f0f0, 8px 7px #00f0f0, 11px 7px #00f0f0, 12px 7px #00f0f0, 19px 7px #00f0f0, 20px 7px #00f0f0,
    3px 8px #00f0f0, 4px 8px #00f0f0, 5px 8px #00f0f0, 6px 8px #00f0f0, 7px 8px #00f0f0, 8px 8px #00f0f0, 9px 8px #00f0f0, 10px 8px #00f0f0, 11px 8px #00f0f0, 12px 8px #00f0f0, 13px 8px #00f0f0, 14px 8px #00f0f0, 15px 8px #00f0f0, 16px 8px #00f0f0, 17px 8px #00f0f0, 18px 8px #00f0f0, 19px 8px #00f0f0, 20px 8px #00f0f0,
    3px 9px #00f0f0, 4px 9px #00f0f0, 5px 9px #00f0f0, 6px 9px #00f0f0, 7px 9px #00f0f0, 8px 9px #00f0f0, 9px 9px #00f0f0, 10px 9px #00f0f0, 11px 9px #00f0f0, 12px 9px #00f0f0, 13px 9px #00f0f0, 14px 9px #00f0f0, 15px 9px #00f0f0, 16px 9px #00f0f0, 17px 9px #00f0f0, 18px 9px #00f0f0, 19px 9px #00f0f0, 20px 9px #00f0f0,
    3px 10px #00f0f0, 4px 10px #00f0f0, 7px 10px #00f0f0, 8px 10px #00f0f0, 11px 10px #00f0f0, 12px 10px #00f0f0,
    3px 11px #00f0f0, 4px 11px #00f0f0, 7px 11px #00f0f0, 8px 11px #00f0f0, 11px 11px #00f0f0, 12px 11px #00f0f0,
    3px 12px #00f0f0, 4px 12px #00f0f0, 5px 12px #00f0f0, 6px 12px #00f0f0, 7px 12px #00f0f0, 8px 12px #00f0f0, 11px 12px #00f0f0, 12px 12px #00f0f0,
    3px 13px #00f0f0, 4px 13px #00f0f0, 5px 13px #00f0f0, 6px 13px #00f0f0, 7px 13px #00f0f0, 8px 13px #00f0f0, 11px 13px #00f0f0, 12px 13px #00f0f0,
    11px 14px #00f0f0, 12px 14px #00f0f0,
    11px 15px #00f0f0, 12px 15px #00f0f0,
    3px 16px #00f0f0, 4px 16px #00f0f0, 5px 16px #00f0f0, 6px 16px #00f0f0, 7px 16px #00f0f0, 8px 16px #00f0f0, 9px 16px #00f0f0, 10px 16px #00f0f0, 11px 16px #00f0f0, 12px 16px #00f0f0,
    3px 17px #00f0f0, 4px 17px #00f0f0, 5px 17px #00f0f0, 6px 17px #00f0f0, 7px 17px #00f0f0, 8px 17px #00f0f0, 9px 17px #00f0f0, 10px 17px #00f0f0, 11px 17px #00f0f0, 12px 17px #00f0f0,
    3px 18px #00f0f0, 4px 18px #00f0f0,
    3px 19px #00f0f0, 4px 19px #00f0f0,
    3px 20px #00f0f0, 4px 20px #00f0f0, 7px 20px #00f0f0, 8px 20px #00f0f0,
    3px 21px #00f0f0, 4px 21px #00f0f0, 7px 21px #00f0f0, 8px 21px #00f0f0,
    3px 22px #00f0f0, 4px 22px #00f0f0, 5px 22px #00f0f0, 6px 22px #00f0f0, 7px 22px #00f0f0, 8px 22px #00f0f0;
}

.pixel-dialog-box .pixel-corner.tl { top: 5px; left: 4px; }
.pixel-dialog-box .pixel-corner.tr { top: 5px; right: 4px; transform: scaleX(-1); }
.pixel-dialog-box .pixel-corner.bl { bottom: 5px; left: 4px; transform: scaleY(-1); }
.pixel-dialog-box .pixel-corner.br { bottom: 5px; right: 4px; transform: scale(-1, -1); }

/* ============================================================
 * 操作弹窗像素边框（物品/技能等「操作」小弹窗）
 * 设计来源：操作弹窗.html（深青底 #194A56 + 亮青描边 #3BD7DE + 3x3 角像素）
 * 与详情卡/青卡不同的另一版像素风，专用于替换 /czjm/xx.png 与 /gjxzk/xx.png。
 * 用法：容器加 class="pixel-action-box"，并在其内部放 4 个角装饰：
 *   <div class="pa-corner tl"></div><div class="pa-corner tr"></div>
 *   <div class="pa-corner bl"></div><div class="pa-corner br"></div>
 * ============================================================ */
.pixel-action-box {
  position: relative;
  background-color: #194A56;
  border: 2px solid #3BD7DE;
  box-sizing: border-box;
}

/* 单个角像素块：1x1 点 + box-shadow 拼出精细像素角花（与主菜单同款图案，操作弹窗.html） */
.pixel-action-box .pa-corner {
  position: absolute;
  width: 1px;
  height: 1px;
  background: transparent;
  pointer-events: none;
  box-shadow:
    3px 0px #3BD7DE, 4px 0px #3BD7DE, 5px 0px #3BD7DE, 6px 0px #3BD7DE, 7px 0px #3BD7DE, 8px 0px #3BD7DE,
    11px 0px #3BD7DE, 12px 0px #3BD7DE, 13px 0px #3BD7DE, 14px 0px #3BD7DE, 15px 0px #3BD7DE, 16px 0px #3BD7DE,
    19px 0px #3BD7DE, 20px 0px #3BD7DE, 21px 0px #3BD7DE, 22px 0px #3BD7DE, 23px 0px #3BD7DE, 24px 0px #3BD7DE, 25px 0px #3BD7DE, 26px 0px #3BD7DE,
    3px 1px #3BD7DE, 4px 1px #3BD7DE, 5px 1px #3BD7DE, 6px 1px #3BD7DE, 7px 1px #3BD7DE, 8px 1px #3BD7DE,
    11px 1px #3BD7DE, 12px 1px #3BD7DE, 13px 1px #3BD7DE, 14px 1px #3BD7DE, 15px 1px #3BD7DE, 16px 1px #3BD7DE,
    19px 1px #3BD7DE, 20px 1px #3BD7DE, 21px 1px #3BD7DE, 22px 1px #3BD7DE, 23px 1px #3BD7DE, 24px 1px #3BD7DE, 25px 1px #3BD7DE, 26px 1px #3BD7DE,
    3px 2px #3BD7DE, 4px 2px #3BD7DE, 7px 2px #3BD7DE, 8px 2px #3BD7DE,
    11px 2px #3BD7DE, 12px 2px #3BD7DE, 15px 2px #3BD7DE, 16px 2px #3BD7DE,
    19px 2px #3BD7DE, 20px 2px #3BD7DE, 25px 2px #3BD7DE, 26px 2px #3BD7DE,
    3px 3px #3BD7DE, 4px 3px #3BD7DE, 7px 3px #3BD7DE, 8px 3px #3BD7DE,
    11px 3px #3BD7DE, 12px 3px #3BD7DE, 15px 3px #3BD7DE, 16px 3px #3BD7DE,
    19px 3px #3BD7DE, 20px 3px #3BD7DE, 25px 3px #3BD7DE, 26px 3px #3BD7DE,
    3px 4px #3BD7DE, 4px 4px #3BD7DE, 5px 4px #3BD7DE, 6px 4px #3BD7DE, 7px 4px #3BD7DE, 8px 4px #3BD7DE, 9px 4px #3BD7DE, 10px 4px #3BD7DE, 11px 4px #3BD7DE, 12px 4px #3BD7DE, 13px 4px #3BD7DE, 14px 4px #3BD7DE, 15px 4px #3BD7DE, 16px 4px #3BD7DE,
    19px 4px #3BD7DE, 20px 4px #3BD7DE, 23px 4px #3BD7DE, 24px 4px #3BD7DE, 25px 4px #3BD7DE, 26px 4px #3BD7DE,
    3px 5px #3BD7DE, 4px 5px #3BD7DE, 5px 5px #3BD7DE, 6px 5px #3BD7DE, 7px 5px #3BD7DE, 8px 5px #3BD7DE, 9px 5px #3BD7DE, 10px 5px #3BD7DE, 11px 5px #3BD7DE, 12px 5px #3BD7DE, 13px 5px #3BD7DE, 14px 5px #3BD7DE, 15px 5px #3BD7DE, 16px 5px #3BD7DE,
    19px 5px #3BD7DE, 20px 5px #3BD7DE, 23px 5px #3BD7DE, 24px 5px #3BD7DE, 25px 5px #3BD7DE, 26px 5px #3BD7DE,
    7px 6px #3BD7DE, 8px 6px #3BD7DE, 11px 6px #3BD7DE, 12px 6px #3BD7DE, 19px 6px #3BD7DE, 20px 6px #3BD7DE,
    7px 7px #3BD7DE, 8px 7px #3BD7DE, 11px 7px #3BD7DE, 12px 7px #3BD7DE, 19px 7px #3BD7DE, 20px 7px #3BD7DE,
    3px 8px #3BD7DE, 4px 8px #3BD7DE, 5px 8px #3BD7DE, 6px 8px #3BD7DE, 7px 8px #3BD7DE, 8px 8px #3BD7DE, 9px 8px #3BD7DE, 10px 8px #3BD7DE, 11px 8px #3BD7DE, 12px 8px #3BD7DE, 13px 8px #3BD7DE, 14px 8px #3BD7DE, 15px 8px #3BD7DE, 16px 8px #3BD7DE, 17px 8px #3BD7DE, 18px 8px #3BD7DE, 19px 8px #3BD7DE, 20px 8px #3BD7DE,
    3px 9px #3BD7DE, 4px 9px #3BD7DE, 5px 9px #3BD7DE, 6px 9px #3BD7DE, 7px 9px #3BD7DE, 8px 9px #3BD7DE, 9px 9px #3BD7DE, 10px 9px #3BD7DE, 11px 9px #3BD7DE, 12px 9px #3BD7DE, 13px 9px #3BD7DE, 14px 9px #3BD7DE, 15px 9px #3BD7DE, 16px 9px #3BD7DE, 17px 9px #3BD7DE, 18px 9px #3BD7DE, 19px 9px #3BD7DE, 20px 9px #3BD7DE,
    3px 10px #3BD7DE, 4px 10px #3BD7DE, 7px 10px #3BD7DE, 8px 10px #3BD7DE, 11px 10px #3BD7DE, 12px 10px #3BD7DE,
    3px 11px #3BD7DE, 4px 11px #3BD7DE, 7px 11px #3BD7DE, 8px 11px #3BD7DE, 11px 11px #3BD7DE, 12px 11px #3BD7DE,
    3px 12px #3BD7DE, 4px 12px #3BD7DE, 5px 12px #3BD7DE, 6px 12px #3BD7DE, 7px 12px #3BD7DE, 8px 12px #3BD7DE, 11px 12px #3BD7DE, 12px 12px #3BD7DE,
    3px 13px #3BD7DE, 4px 13px #3BD7DE, 5px 13px #3BD7DE, 6px 13px #3BD7DE, 7px 13px #3BD7DE, 8px 13px #3BD7DE, 11px 13px #3BD7DE, 12px 13px #3BD7DE,
    11px 14px #3BD7DE, 12px 14px #3BD7DE,
    11px 15px #3BD7DE, 12px 15px #3BD7DE,
    3px 16px #3BD7DE, 4px 16px #3BD7DE, 5px 16px #3BD7DE, 6px 16px #3BD7DE, 7px 16px #3BD7DE, 8px 16px #3BD7DE, 9px 16px #3BD7DE, 10px 16px #3BD7DE, 11px 16px #3BD7DE, 12px 16px #3BD7DE,
    3px 17px #3BD7DE, 4px 17px #3BD7DE, 5px 17px #3BD7DE, 6px 17px #3BD7DE, 7px 17px #3BD7DE, 8px 17px #3BD7DE, 9px 17px #3BD7DE, 10px 17px #3BD7DE, 11px 17px #3BD7DE, 12px 17px #3BD7DE,
    3px 18px #3BD7DE, 4px 18px #3BD7DE,
    3px 19px #3BD7DE, 4px 19px #3BD7DE,
    3px 20px #3BD7DE, 4px 20px #3BD7DE, 7px 20px #3BD7DE, 8px 20px #3BD7DE,
    3px 21px #3BD7DE, 4px 21px #3BD7DE, 7px 21px #3BD7DE, 8px 21px #3BD7DE,
    3px 22px #3BD7DE, 4px 22px #3BD7DE, 5px 22px #3BD7DE, 6px 22px #3BD7DE, 7px 22px #3BD7DE, 8px 22px #3BD7DE;
}

/* 四角定位（transform 翻转复用同一图案；scale 0.5 缩小） */
.pixel-action-box .pa-corner.tl { top: 4px; left: 4px; transform: scale(0.5); }
.pixel-action-box .pa-corner.tr { top: 4px; right: 4px; transform: scaleX(-1) scale(0.5); }
.pixel-action-box .pa-corner.bl { bottom: 4px; left: 4px; transform: scaleY(-1) scale(0.5); }
.pixel-action-box .pa-corner.br { bottom: 4px; right: 4px; transform: scale(-1, -1) scale(0.5); }

/* ============ 全局确认弹窗（confirm-dialog）统一样式 ============ */
.confirm-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.55);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 9999;
}
.confirm-dialog {
  padding: 30px 40px 20px;
  text-align: center;
}
.confirm-title {
  font-family: 'GameFont';
  font-size: 16px;
  color: #ffd700;
  font-weight: bold;
  margin-bottom: 10px;
  letter-spacing: 2px;
}
.confirm-text {
  font-family: 'GameFont';
  font-size: 15px;
  color: #f0e6d3;
  margin-bottom: 20px;
}
.confirm-btns {
  display: flex;
  gap: 16px;
  justify-content: center;
}
.confirm-btn {
  padding: 8px 24px;
  border: 1px solid;
  border-radius: 3px;
  font-family: 'GameFont';
  font-size: 13px;
  cursor: pointer;
  transition: all 0.2s;
}
.confirm-yes {
  background: rgba(200, 50, 50, 0.2);
  border-color: #a04040;
  color: #e8b0b0;
}
.confirm-yes:hover {
  background: rgba(200, 50, 50, 0.45);
  color: #fff;
}
.confirm-no {
  background: rgba(80, 80, 90, 0.2);
  border-color: #707080;
  color: #c0c0d0;
}
.confirm-no:hover {
  background: rgba(80, 80, 90, 0.45);
  color: #fff;
}