/* Hamster Hustle — Seed Square scene overrides.
 *
 * Logical 800x450 coords (Lesson 1). Every selector scoped under .hh-root
 * to prevent cross-bleed (Wave 1 risk #5). Positioning of interactive
 * sprites is inline (per-object) so logical coords stay co-located with
 * the scene's TS placement spec; this file owns shared visual styling
 * (sprite sizing, billboard treatment, dialog overlay, dust polish).
 */

.hh-root .hh-scene-seed-square .hh-prop {
  position: absolute;
  image-rendering: pixelated;
  user-select: none;
}

.hh-root .hh-scene-seed-square .hh-prop > img {
  width: 100%;
  height: 100%;
  display: block;
  image-rendering: pixelated;
  pointer-events: none;
}

/* Cage — Burnout Bob trapped behind bars. The ally sprite renders inside
 * the cage box; a top bar overlay sells the "behind bars" reading. */
.hh-root .hh-scene-seed-square .hh-cage {
  cursor: pointer;
  z-index: var(--hh-z-prop);
}

.hh-root .hh-scene-seed-square .hh-cage .hh-cage-ally {
  position: absolute;
  inset: 4px 8px 0 8px;
  display: block;
  image-rendering: pixelated;
}

.hh-root .hh-scene-seed-square .hh-cage .hh-cage-bars {
  position: absolute;
  inset: 0;
  border: 3px solid var(--hh-color-rust);
  border-radius: 4px;
  background:
    repeating-linear-gradient(
      to right,
      transparent 0,
      transparent 10px,
      rgba(60, 40, 20, 0.85) 10px,
      rgba(60, 40, 20, 0.85) 13px
    ),
    rgba(0, 0, 0, 0.18);
  pointer-events: none;
  z-index: 2;
}

.hh-root .hh-scene-seed-square .hh-cage.is-freed .hh-cage-bars {
  display: none;
}

/* Pickup tools / acorns / radio parts — small clickable sprites with
 * gentle bobbing animation to flag interactability. */
.hh-root .hh-scene-seed-square .hh-pickup {
  cursor: pointer;
  animation: hh-seed-bob 2.4s ease-in-out infinite;
  z-index: var(--hh-z-prop);
}

.hh-root .hh-scene-seed-square .hh-pickup.is-collected {
  display: none;
}

@keyframes hh-seed-bob {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-3px); }
}

/* HamSpam billboard — painted over the Ham Corp HQ sign band. Behind
 * Bob (zIndex:5 per spec) so a foreground hamster reads as in front of
 * the signage. */
.hh-root .hh-scene-seed-square .hh-billboard {
  cursor: pointer;
  z-index: var(--hh-z-decor-back);
}

.hh-root .hh-scene-seed-square .hh-billboard.is-dispelled {
  display: none;
}

/* Door — soft glow on hover only; door region itself is mostly painted
 * into the BG so the box stays subtle. */
.hh-root .hh-scene-seed-square .hh-door {
  cursor: pointer;
  border-radius: 4px;
  z-index: var(--hh-z-prop);
}

.hh-root .hh-scene-seed-square .hh-door:hover {
  box-shadow: 0 0 12px 2px var(--hh-color-meadow);
}

/* Dialog overlay — bottom-anchored panel that holds wrong/missing/free
 * lines. Multi-beat lines split on \n; parenthetical beats render as
 * .hh-dialog-cue (italic + dimmed per corpus rendering contract). */
.hh-root .hh-scene-seed-square .hh-dialog {
  position: absolute;
  left: 5%;
  right: 5%;
  bottom: 6%;
  padding: var(--hh-space-4) var(--hh-space-6);
  background: var(--hh-color-scrim);
  border: 2px solid var(--hh-color-acorn);
  border-radius: 6px;
  color: var(--hh-color-cream);
  font-family: var(--hh-font-body);
  font-size: 14px;
  line-height: 1.5;
  z-index: var(--hh-z-cutscene);
  pointer-events: none;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.45);
}

.hh-root .hh-scene-seed-square .hh-dialog-line {
  display: block;
}

.hh-root .hh-scene-seed-square .hh-dialog-cue {
  display: block;
  font-style: italic;
  opacity: 0.65;
  margin: 2px 0;
}