/* 俄罗斯方块 · 棋盘 / 预览 / 飘字（骨架、HUD、按钮、遮罩来自 base.css） */

/* 棋盘 + 右侧预览，坐在灰色 .frame 里 */
.stage {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  background: var(--cell);
  border-radius: 2px;
}

.board-wrap { position: relative; }

#board { display: block; }

/* ---------- 预览区（与主棋盘同族：圆角块 + 高光） ---------- */
.side {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  padding-top: 2px;
}

.side-label {
  margin: 0;
  font-size: 0.8rem;
  color: var(--muted);
}

#next {
  display: block;
  background: var(--cell);
  border: 1px solid var(--frame);
  border-radius: 3px;
}

/* ---------- Combo 飘字（棋盘中央） ---------- */
.combo {
  position: absolute;
  left: 50%;
  top: 44%;
  transform: translate(-50%, -50%);
  z-index: 10;
  color: var(--accent);
  font-size: 1.5rem;
  font-weight: 700;
  letter-spacing: 1px;
  white-space: nowrap;
  opacity: 0;
  pointer-events: none;
  text-shadow: 0 0 8px rgba(255, 255, 255, 0.9);
}

.combo.on { animation: combo-rise 0.9s ease-out; }

@keyframes combo-rise {
  0% { opacity: 0; transform: translate(-50%, -50%) scale(0.6); }
  22% { opacity: 1; transform: translate(-50%, -50%) scale(1.08); }
  60% { opacity: 1; transform: translate(-50%, -50%) scale(1); }
  100% { opacity: 0; transform: translate(-50%, -170%) scale(1); }
}

/* ---------- 升级提示（HUD 等级项上方） ---------- */
.level-float {
  position: absolute;
  left: 50%;
  top: -0.6em;
  transform: translateX(-50%);
  color: var(--accent);
  font-size: 0.85rem;
  font-weight: 700;
  white-space: nowrap;
  opacity: 0;
  pointer-events: none;
}

.level-float.on { animation: level-rise 0.9s ease-out; }

@keyframes level-rise {
  0% { opacity: 0; transform: translate(-50%, 0.4em); }
  20% { opacity: 1; transform: translate(-50%, 0); }
  75% { opacity: 1; }
  100% { opacity: 0; transform: translate(-50%, -1.4em); }
}
