/* Film cameos stay in allocated icon/report space, never over the interface. */
.goblin-egg {
  position: relative;
  display: inline-grid;
  place-items: center;
  flex: 0 0 56px;
  width: 56px;
  height: 72px;
  padding: 0;
  border: 0;
  border-radius: 3px;
  background: transparent;
  overflow: hidden;
  cursor: pointer;
  color: inherit;
  touch-action: manipulation;
  vertical-align: middle;
}
.goblin-egg:focus-visible { outline: 2px solid #7bd6ad; outline-offset: 3px; }
.goblin-egg img { display: block; width: 56px; height: 60px; object-fit: contain; pointer-events: none; transform-origin: 50% 90%; }
.goblin-egg:is(:hover, :focus-visible):not([data-egg-state]) img { transform: rotate(-5deg); }
.goblin-icon-slot { float: right; margin: 0 0 12px 16px; }
.goblin-report-egg { margin-inline-start: auto; }
.goblin-report-tools { align-items: center; min-height: 72px; }
.goblin-egg-status { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; border: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.goblin-egg[data-egg-state="shoo"] img { animation: goblin-scramble 850ms ease-in forwards; }
.goblin-egg[data-egg-state="stunned"] img { animation: goblin-dizzy 550ms ease-out; }
.goblin-egg[data-egg-state="stunned"]::after { content: "✦ · ✦"; position: absolute; top: 0; left: 0; width: 100%; color: #dcc683; font: 13px/1 sans-serif; text-align: center; animation: goblin-stars 900ms ease-out; pointer-events: none; }
@keyframes goblin-scramble {
  0% { transform: translateX(0) rotate(0); }
  15% { transform: translateX(-3px) rotate(-8deg); }
  35% { transform: translateX(3px) rotate(8deg); }
  55% { transform: translate(4px, -3px) rotate(0); }
  100% { transform: translate(65px, 10px) rotate(18deg); }
}
@keyframes goblin-dizzy { 0%, 100% { transform: rotate(0); } 25% { transform: rotate(-12deg); } 65% { transform: rotate(8deg); } }
@keyframes goblin-stars { from { transform: translateY(5px) rotate(-8deg); } to { transform: translateY(0) rotate(0); } }
@media (prefers-reduced-motion: reduce) {
  .goblin-egg[data-egg-state] img, .goblin-egg[data-egg-state]::after { animation: none; }
  .goblin-egg:is(:hover, :focus-visible):not([data-egg-state]) img { transform: none; }
}
@media print { .goblin-egg { display: none; } }
