/* 游戏画布 + 全屏居中；外壳样式来自 /games/shared/gf-shell.css */
* { margin: 0; padding: 0; box-sizing: border-box; }
html, body {
  width: 100%;
  height: 100%;
  background: #0a0a18;
  overflow: hidden;
  font-family: system-ui, "PingFang SC", sans-serif;
}
body {
  display: flex;
  align-items: center;
  justify-content: center;
}
canvas#cv {
  display: block;
  touch-action: none;
  max-width: 100%;
  max-height: 100%;
}

/* 功能按钮布局（美术+产品+策划共定）：
 * 被动信息（分数/币/连击/生命/关卡）留在顶部阅读区；
 * 需手动触发的「减速」道具落到屏幕底部右下拇指区，与顶部暂停/生命分离，
 * 既避免右上角控件拥挤，又让高频操作的按钮落在单手可够到的位置。 */
.gf-item-bar {
  top: auto;
  bottom: calc(62px + env(safe-area-inset-bottom, 0px));
}

/* 道具按钮游戏风美化：霓虹能量框 + AI 时之晶图标 */
.gf-item-btn {
  min-width: 54px;
  max-width: 72px;
  padding: 6px 8px 8px;
  border-radius: 16px;
  background: rgba(11, 16, 32, 0.92);
  box-shadow:
    inset 0 0 0 1.5px rgba(77, 238, 234, 0.65),
    inset 0 0 12px rgba(77, 238, 234, 0.12),
    0 0 16px rgba(0, 229, 255, 0.22),
    0 4px 0 rgba(0, 0, 0, 0.35);
  border: none;
  transition: transform 0.08s ease, box-shadow 0.15s ease;
}
.gf-item-btn:active {
  transform: translateY(2px) scale(0.96);
}
.gf-item-btn.is-active {
  box-shadow:
    inset 0 0 0 2px rgba(255, 77, 109, 0.95),
    0 0 20px rgba(255, 77, 109, 0.35),
    0 4px 0 rgba(0, 0, 0, 0.35);
}
.gf-item-btn .gf-item-icon {
  width: 32px;
  height: 32px;
}
.gf-item-btn .gf-item-icon img {
  width: 100%;
  height: 100%;
  filter: drop-shadow(0 0 5px rgba(77, 238, 234, 0.7));
}
.gf-item-btn .gf-item-label {
  color: #4deeea;
  text-shadow: 0 0 6px rgba(77, 238, 234, 0.55);
}