/* Playground Enhancements — shared across all games */

/* ── Botti Speech Bubble ── */
.botti-bubble {
  position: fixed;
  bottom: 72px;
  left: 14px;
  background: #111827;
  color: #e2e8f0;
  font-family: 'Kanit', sans-serif;
  font-size: 0.85rem;
  line-height: 1.4;
  padding: 9px 13px 9px 38px;
  border-radius: 18px 18px 18px 4px;
  border: 1.5px solid rgba(0,212,170,0.45);
  box-shadow: 0 6px 24px rgba(0,0,0,0.35);
  max-width: 210px;
  z-index: 9000;
  opacity: 0;
  transform: translateY(10px) scale(0.92);
  pointer-events: none;
  transition: opacity 0.28s ease, transform 0.28s cubic-bezier(0.34,1.56,0.64,1);
}
.botti-bubble::before {
  content: '🤖';
  position: absolute;
  left: 10px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 1rem;
  line-height: 1;
}
/* tail */
.botti-bubble::after {
  content: '';
  position: absolute;
  bottom: -8px;
  left: 14px;
  border: 5px solid transparent;
  border-top-color: rgba(0,212,170,0.45);
  border-bottom: none;
}
.botti-bubble.show {
  opacity: 1;
  transform: translateY(0) scale(1);
}

/* ── Celebration floating emojis ── */
.celeb-float {
  position: fixed;
  bottom: -50px;
  pointer-events: none;
  z-index: 9999;
  user-select: none;
  animation: pg-float-up var(--dur, 2s) ease-out var(--delay, 0s) forwards;
}
@keyframes pg-float-up {
  0%   { transform: translateY(0)      rotate(0deg)   scale(1);   opacity: 1; }
  70%  { opacity: 1; }
  100% { transform: translateY(-105vh) rotate(380deg) scale(0.7); opacity: 0; }
}

/* ── Hint slide-in animation ── */
.story-hint, .lv-hint {
  animation: pg-hint-in 0.45s ease both;
}
@keyframes pg-hint-in {
  from { opacity: 0; transform: translateX(-10px); }
  to   { opacity: 1; transform: translateX(0); }
}

/* ── Run button press micro-animation ── */
.btn-run, .btn.btn-run, button.run-btn {
  transition: transform 0.12s ease, box-shadow 0.12s ease;
}
.btn-run:active, .btn.btn-run:active, button.run-btn:active {
  transform: scale(0.93) !important;
}

/* ── Command chip wiggle on add ── */
@keyframes pg-chip-in {
  0%   { transform: scale(0.7) rotate(-4deg); opacity: 0; }
  70%  { transform: scale(1.1) rotate(2deg);  opacity: 1; }
  100% { transform: scale(1)   rotate(0deg);  opacity: 1; }
}
.chip-new {
  animation: pg-chip-in 0.28s cubic-bezier(0.34,1.56,0.64,1) both;
}

/* ── Win overlay star pop ── */
@keyframes pg-star-pop {
  0%   { transform: scale(0) rotate(-30deg); opacity: 0; }
  65%  { transform: scale(1.25) rotate(8deg); opacity: 1; }
  100% { transform: scale(1)    rotate(0deg); opacity: 1; }
}
.ov-stars {
  animation: pg-star-pop 0.55s cubic-bezier(0.34,1.56,0.64,1) 0.15s both;
}

/* ── Cute pulsing hint icon ── */
@keyframes pg-pulse {
  0%,100% { transform: scale(1); }
  50%      { transform: scale(1.18); }
}
.hint-icon-pulse {
  display: inline-block;
  animation: pg-pulse 2s ease-in-out infinite;
}