/* Decorative food silhouettes share the warm palette of the embers. */
.menu-ambience {
  position: fixed;
  inset: 0;
  z-index: 2;
  overflow: hidden;
  pointer-events: none;
  visibility: hidden;
  contain: layout paint;
}
.menu-ambience.is-active { visibility: visible; }
.menu-ambience__float {
  position: absolute;
  width: var(--size);
  height: var(--size);
  opacity: 0;
  animation: menu-food-drift var(--duration) linear both;
  will-change: transform, opacity;
}
.menu-ambience__float img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  transform: scaleX(var(--mirror, 1));
  animation: menu-food-glow var(--glow-duration) ease-in-out infinite alternate;
  filter: blur(var(--blur)) sepia(.65) saturate(1.4) drop-shadow(0 0 12px #ff5500);
}
@keyframes menu-food-drift {
  0% { opacity: 0; transform: translate3d(0, 35px, 0) scale(.92); }
  22% { opacity: var(--alpha); }
  70% { opacity: var(--alpha); }
  100% { opacity: 0; transform: translate3d(var(--drift), var(--rise), 0) scale(1.06); }
}
@keyframes menu-food-glow {
  from { filter: blur(var(--blur)) sepia(.65) saturate(1.4) drop-shadow(0 0 10px #ff5500); }
  to { filter: blur(var(--blur)) sepia(.85) saturate(1.7) drop-shadow(0 0 18px #ffaa00); }
}
@media (prefers-reduced-motion: reduce) {
  .menu-ambience { display: none; }
}

/* Tiny trailing embers fade once, then disappear with their parent icon. */
.menu-ambience__spark {
  position: absolute;
  left: 50%;
  top: 82%;
  width: var(--spark-size);
  height: var(--spark-size);
  border-radius: 50%;
  background: #ffbc57;
  box-shadow: 0 0 6px 1px #ff7900;
  opacity: 0;
  animation: menu-food-spark 2400ms ease-out var(--spark-delay) both;
}
@keyframes menu-food-spark {
  0% { opacity: 0; transform: translate3d(var(--spark-x), 0, 0) scale(.5); }
  20% { opacity: .9; }
  100% { opacity: 0; transform: translate3d(var(--spark-x), 48px, 0) scale(.2); }
}
.menu-ambience__float--golden img {
  animation: menu-food-golden var(--duration) ease-in-out both;
}
@keyframes menu-food-golden {
  0%, 32%, 66%, 100% { filter: blur(var(--blur)) sepia(.65) saturate(1.4) drop-shadow(0 0 12px #ff5500); }
  48% { filter: blur(var(--blur)) sepia(.85) saturate(1.6) brightness(1.35) drop-shadow(0 0 22px #ffc45c); }
}