#pizzaEasterEgg {
  margin: 0 auto;
  z-index: 50; /* Above the orbit path */
  pointer-events: auto; /* Allow clicking the pizza game! */
}

#pizza-wrap {
  position: relative;
  /* Scaled down to fit nicely in the circular menu center */
  width: clamp(140px, 20vw, 220px);
  height: clamp(140px, 20vw, 220px);
  margin: 0 auto;
}

/* ── plate — always visible, sits behind pizza ── */
#plate {
  position: absolute;
  inset: 0;
  border-radius: 50%;
  background: radial-gradient(circle at 40% 35%, #d4c8a0, #b8a87a 40%, #9e8e60 80%, #7a6a40);
  border: 6px solid #c8b060;
  box-shadow: 0 8px 32px #00000080, inset 0 2px 8px #ffffff30;
  overflow: hidden;
  z-index: 0;
}
/* plate rim inner ring */
#plate::before {
  content: '';
  position: absolute;
  inset: 8px;
  border-radius: 50%;
  border: 3px solid #c8a84888;
  pointer-events: none;
}

/* grease / residue elements */
.grease {
  position: absolute;
  border-radius: 50%;
  background: radial-gradient(circle, #f5d06080 0%, #d4a03060 60%, transparent 100%);
  filter: blur(3px);
  pointer-events: none;
}
.cheese-bit {
  position: absolute;
  background: #f5c842cc;
  border-radius: 3px;
  transform: rotate(var(--r));
  filter: blur(0.5px);
  pointer-events: none;
}
.sauce-smear {
  position: absolute;
  background: #c0300888;
  border-radius: 60% 40% 55% 45% / 50% 60% 40% 50%;
  filter: blur(2px);
  pointer-events: none;
}
.crust-crumb {
  position: absolute;
  background: #8b5e2e;
  border-radius: 50%;
  pointer-events: none;
}

/* ── SVG pizza sits above plate ── */
#pizza-svg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  cursor: default;
  z-index: 1;
}

/* ── slice interactions ── */
.slice-group {
  cursor: pointer;
  transform-origin: center;
  transition: filter 0.15s;
}
.slice-group:hover path.slice-path {
  filter: brightness(1.18);
}
.slice-group.eaten { pointer-events: none; }

/* ── comic word pop ── */
.comic-pop {
  position: absolute;
  pointer-events: none;
  z-index: 100;
  font-family: 'Press Start 2P', 'Arial Black', sans-serif;
  font-size: clamp(0.5rem, 1.5vw, 1rem);
  color: #fff;
  text-shadow: -2px -2px 0 #ff4500, 2px -2px 0 #ff4500, -2px 2px 0 #ff4500, 2px 2px 0 #ff4500;
  animation: comicAnim 0.75s ease-out forwards;
  white-space: nowrap;
  transform: translate(-50%, -50%);
}
@keyframes comicAnim {
  0%   { opacity:1; transform: translate(-50%,-50%) scale(0.3) rotate(-15deg); }
  30%  { opacity:1; transform: translate(-50%,-60%) scale(1.3) rotate(8deg); }
  60%  { opacity:1; transform: translate(-50%,-70%) scale(1.1) rotate(-4deg); }
  100% { opacity:0; transform: translate(-50%,-100%) scale(0.8) rotate(0deg); }
}

/* ── starburst ── */
.star-burst {
  position: absolute;
  pointer-events: none;
  z-index: 99;
  animation: burstAnim 0.7s ease-out forwards;
  transform: translate(-50%, -50%);
}
@keyframes burstAnim {
  0%   { opacity:1; transform: translate(-50%,-50%) scale(0.2) rotate(0deg); }
  40%  { opacity:1; transform: translate(-50%,-50%) scale(1.2) rotate(20deg); }
  100% { opacity:0; transform: translate(-50%,-50%) scale(1.5) rotate(40deg); }
}

/* ── slice vanish ── */
@keyframes sliceVanish {
  0%   { opacity:1; transform: scale(1) rotate(0deg); }
  20%  { opacity:1; transform: scale(1.15) rotate(-8deg); }
  50%  { opacity:0.7; transform: scale(0.8) rotate(15deg) translateY(-20px); }
  80%  { opacity:0.2; transform: scale(0.3) rotate(30deg) translateY(-40px); }
  100% { opacity:0; transform: scale(0) rotate(45deg) translateY(-60px); }
}
.slice-group.vanishing {
  animation: sliceVanish 0.65s cubic-bezier(0.36, 0.07, 0.19, 0.97) forwards;
}

/* ── crumb particles ── */
.crumb-particle {
  position: absolute;
  pointer-events: none;
  z-index: 98;
}
@keyframes crumbFly {
  0%   { opacity:1; transform: translate(0,0) scale(1); }
  100% { opacity:0; transform: translate(var(--dx), var(--dy)) scale(0.2); }
}

/* ── burp overlay ── */
#burp-overlay {
  position: fixed;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  pointer-events: none;
  z-index: 9999;
  opacity: 0;
}
#burp-overlay.show { animation: burpShow 2.5s ease forwards; }
@keyframes burpShow {
  0%   { opacity:0; transform: scale(0.5); }
  15%  { opacity:1; transform: scale(1.1); }
  70%  { opacity:1; transform: scale(1.0); }
  100% { opacity:0; transform: scale(0.9); }
}
#burp-text {
  font-family: 'Press Start 2P', 'Arial Black', sans-serif;
  font-size: clamp(2rem, 8vw, 4rem);
  color: #ffd700;
  text-shadow: -5px -5px 0 #ff4500, 5px -5px 0 #ff4500, -5px 5px 0 #ff4500, 5px 5px 0 #ff4500,
               0 0 30px #ff000088;
  letter-spacing: 4px;
  text-align: center;
}
#burp-sub {
  font-size: clamp(0.7rem, 2vw, 1rem);
  color: #ff8c00;
  letter-spacing: 3px;
  margin-top: 20px;
  font-family: 'Press Start 2P', monospace;
}
