:root {
  --bg: #4a2e1e;
  --panel: #5d3a25;
  --accent: #ffab47;
  --accent-text: #3c2003;
  --page-glow: rgba(255, 171, 71, 0.2);
}

body {
  background:
    radial-gradient(circle at 14% 8%, rgba(255, 171, 71, 0.18), transparent 24rem),
    radial-gradient(circle at 84% 13%, rgba(159, 223, 143, 0.15), transparent 24rem),
    linear-gradient(180deg, #4a2e1e, #241207);
}

#game-canvas { background: #fdf0dc; }

.stage {
  background: rgba(74, 46, 30, 0.92);
}

.hud {
  position: absolute;
  top: 0.7rem;
  left: 50%;
  display: flex;
  gap: 0.6rem;
  transform: translateX(-50%);
  pointer-events: none;
}

.hud span {
  border: 1px solid rgba(120, 80, 40, 0.35);
  border-radius: 8px;
  background: rgba(255, 252, 244, 0.85);
  color: #5d3a1a;
  padding: 0.32rem 0.66rem;
  font-size: 0.82rem;
  font-weight: 800;
  white-space: nowrap;
}

@media (max-width: 620px) {
  .hud span { font-size: 0.7rem; padding: 0.24rem 0.45rem; }
}