/* ===================================================
   scene-campfire.css — 篝火夜话区 (Campfire Night Chat)
   Only: JPG background + floating message bubbles
   =================================================== */

/* ---------- panel-right: JPG background ---------- */
#panel-campfire.panel-right {
  background-image: url('../data/scene3_campfire_night.jpeg');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

/* ---------- Bubble layer — covers entire panel ---------- */
.campfire-area {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  overflow: hidden;
}

/* ---------- Speech Bubble (water-bubble style) ---------- */
.bubble {
  position: absolute;
  z-index: 10;
  background: rgba(26, 28, 44, 0.75);
  border: 2px solid var(--gold-dim);
  border-radius: 12px;
  padding: 8px 14px;
  font-family: var(--font-pixel);
  font-size: 14px;
  color: var(--text-light);
  line-height: 1.6;
  max-width: 200px;
  text-align: center;
  pointer-events: none;
  animation: bubble-float 3s ease-out forwards;
  image-rendering: pixelated;
}

@keyframes bubble-float {
  0%   { opacity: 0; transform: translateY(0); }
  15%  { opacity: 1; transform: translateY(-12px); }
  75%  { opacity: 1; transform: translateY(-60px); }
  100% { opacity: 0; transform: translateY(-90px); }
}