/* ======================
   武器表格专用样式
====================== */
[id^="data"] {
  background: #fff;
  padding: 20px;
  border-radius: 6px;
  margin-bottom: 20px;
}

[id^="data"] h2 {
  font-size: 22px;
  color: #a83232;
  margin-bottom: 15px;
  border-left: 6px solid #a83232;
  padding-left: 10px;
}

/* 表格整体 */
#ken {
  width: 100%;
  border-collapse: collapse;
  background: #fff;
  font-size: 14px;
}

/* 表头 */
#ken th {
  background: #333;
  color: #fff;
  padding: 10px 6px;
  border: 1px solid #666;
  white-space: nowrap;
}

/* 单元格 */
#ken td {
  padding: 10px 8px;
  border: 1px solid #ddd;
  vertical-align: top;
  line-height: 1.5;
}

/* 素材列自动换行、紧凑排版 */
#ken td:nth-child(6) {
  line-height: 1.3 !important;
  word-break: keep-all;
  white-space: pre-wrap;
}

/* 隔行斑马线 */
#ken tr:nth-child(even) {
  background: #f9f9f9;
}

/* -----------------------
   斩味条：100% 原版比例
------------------------ */
#ken ul {
  list-style: none;
  padding: 0;
  margin: 4px 0;
  display: flex;
  height: 16px;
  width: 100px;
  background: #222;
}
#ken li {
  height: 16px;
  margin: 0;
  padding: 0;
}

/* 全部8种斩味颜色 */
#ken li.r { background: #ff3333; }
#ken li.o { background: #ffaa33; }
#ken li.y { background: #ffff55; }
#ken li.g { background: #55dd55; }
#ken li.b { background: #3388ff; }
#ken li.w { background: #f0f0f0; }
#ken li.p { background: #aa55ff; }
#ken li.s { background: #33dddd; }
/* 文字颜色（和斩味一致）+ 深灰色背景 */
.fr { color: #ff3333; background: #333; padding: 0 2px; }
.fo { color: #ffaa33; background: #333; padding: 0 2px; }
.fy { color: #ffff55; background: #333; padding: 0 2px; }
.fg { color: #55dd55; background: #333; padding: 0 2px; }
.fb { color: #3388ff; background: #333; padding: 0 2px; }
.fw { color: #f0f0f0; background: #333; padding: 0 2px; }
.fp { color: #aa55ff; background: #333; padding: 0 2px; }
.fa { color: #33dddd; background: #333; padding: 0 2px; }
.ft { color: #ffbc99; background: #333; padding: 0 2px; }

#ken small {
  font-size:12px;
  color:#666;
}



/* 素材列强制紧凑，不自动换行，不拉伸 */
#ken td:nth-child(6) {
  line-height: 1.3 !important;
  white-space: nowrap;
}
/* 素材列内容溢出时自动换行，但保持整体不拆分 */
#ken td:nth-child(6) * {
  white-space: nowrap;
}
#ken td:nth-child(6) {
  white-space: normal;
  word-break: keep-all;
}

/* 左侧交错波浪泡泡按钮组 */
.fixed-bubbles {
  position: fixed;
  left: 50%;
  transform: translate(-830px, 0);
  top: 80px; /* 整体往上靠，压缩高度 */
  z-index: 999;
  width: 160px; /* 容纳交错泡泡 */
  height: auto;
}

/* 泡泡基础样式：大、半透、浮动 */
.bubble-btn {
  position: relative;
  width: 70px;
  height: 70px;
  border-radius: 50%;
  background: rgba(30, 30, 30, 0.55);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  font-weight: 500;
  text-decoration: none;
  box-shadow: 0 4px 12px rgba(0,0,0,0.2);
  border: 1px solid rgba(255,255,255,0.2);
  transition: all 0.3s ease;
  animation: floatBubble 3s ease-in-out infinite;
  margin-bottom: -12px; /* 强力压缩整体高度 */
}

/* 交错排列核心：奇偶错位 */
.bubble-btn:nth-child(odd) {
  left: 0; /* 奇数：左下 */
}
.bubble-btn:nth-child(even) {
  left: 70px; /* 偶数：右下 */
}

/* 错开浮动动画延迟 */
.bubble-btn:nth-child(2n) { animation-delay: 0.4s; }
.bubble-btn:nth-child(3n) { animation-delay: 0.8s; }

/* 轻微浮动 */
@keyframes floatBubble {
  0%   { transform: translate(0, 0); }
  50%  { transform: translate(3px, -5px); }
  100% { transform: translate(0, 0); }
}

/* 悬浮效果 */
.bubble-btn:hover {
  transform: scale(1.1);
  background: rgba(168, 50, 50, 0.75);
  box-shadow: 0 6px 16px rgba(168,50,50,0.35);
  z-index: 10;
}

/* 悬浮提示 */
.bubble-btn::after {
  content: attr(data-text);
  position: absolute;
  left: 80px;
  background: rgba(30,30,30,0.85);
  color: #fff;
  padding: 4px 10px;
  border-radius: 4px;
  font-size: 13px;
  white-space: nowrap;
  opacity: 0;
  transition: opacity 0.3s;
  pointer-events: none;
}
.bubble-btn:hover::after { opacity:1; }