/* ============================================================
   LBS Tech — 6-Layer isometric scene animations
   Animations replay on layer activation (active overlay is
   remounted via React key). Base states show the finished
   frame so reduced-motion / no-JS still reads correctly.
   ============================================================ */

.ls-overlay { animation: lsFadeIn .45s ease both; }

/* path draw (length-independent via pathLength="1") */
.ls-draw {
  stroke-dasharray: 1;
  stroke-dashoffset: 1;
  animation: lsDraw 1.25s cubic-bezier(.65,0,.35,1) forwards;
}
@keyframes lsDraw { to { stroke-dashoffset: 0; } }

/* pop / scale-in (for discrete objects) */
.ls-pop {
  transform-box: fill-box;
  transform-origin: 50% 100%;
  opacity: 0;
  animation: lsPop .55s cubic-bezier(.18,1.25,.3,1) both;
}
@keyframes lsPop {
  0%   { opacity: 0; transform: translateY(-8px) scale(.4); }
  60%  { opacity: 1; }
  100% { opacity: 1; transform: translateY(0) scale(1); }
}

/* soft fade-in */
.ls-fade { opacity: 0; animation: lsFadeIn .6s ease both; }
@keyframes lsFadeIn { to { opacity: 1; } }

/* zone fill (accessibility / safety areas) */
.ls-zone {
  transform-box: fill-box;
  transform-origin: 50% 50%;
  opacity: 0;
  animation: lsZone .6s ease both;
}
@keyframes lsZone {
  from { opacity: 0; transform: translateY(-7px) scale(.95); }
  to   { opacity: 1; transform: none; }
}

/* gentle infinite pulse for warnings / live elements */
.ls-pulse {
  transform-box: fill-box;
  transform-origin: 50% 50%;
  animation: lsPulse 1.3s ease-in-out infinite;
}
@keyframes lsPulse {
  0%,100% { opacity: .55; transform: scale(.92); }
  50%     { opacity: 1;   transform: scale(1.06); }
}

/* glow flicker for environment shimmer */
.ls-glow { animation: lsGlow 1.8s ease-in-out infinite; }
@keyframes lsGlow {
  0%,100% { opacity: .5; }
  50%     { opacity: 1; }
}

/* moving walker dot trail */
.ls-walker { animation: lsFadeIn .4s ease both; }

@media (prefers-reduced-motion: reduce) {
  .ls-overlay, .ls-draw, .ls-pop, .ls-fade, .ls-zone, .ls-pulse, .ls-glow, .ls-walker {
    animation: none !important;
  }
  .ls-draw { stroke-dashoffset: 0 !important; }
  .ls-pop, .ls-fade, .ls-zone { opacity: 1 !important; transform: none !important; }
  .ls-pulse { opacity: .9 !important; }
}