/* Approved orbit + perimeter laser for RUN, STOP, WAIT and LONG_STOP.
   Presentation only; shared by both tile views. NO_COMM/NO_DATA stay static.
   Keep geometry owned by viewport-fit.css and saved factory coordinates. */
:root {
  --neon-run: #008544; --neon-stop: #a94c00; --neon-wait: #ce242a; --neon-offline: #616c77;
  --neon-face: #f8fbfd; --neon-ink: #162b3b;
}
html[data-theme="dark"] {
  --neon-run: #2bff83; --neon-stop: #ff7900; --neon-wait: #ff2929; --neon-offline: #b7c2cb;
  --neon-face: #101c27; --neon-ink: #f2f8fd;
}
:is(.equipment-tile,.kpi-status-icon)[data-neon-status] { --neon-accent: var(--neon-offline); isolation: isolate; }
:is(.equipment-tile,.kpi-status-icon)[data-neon-status][data-state="RUN"] { --neon-accent: var(--neon-run); }
:is(.equipment-tile,.kpi-status-icon)[data-neon-status][data-state="STOP"] { --neon-accent: var(--neon-stop); }
:is(.equipment-tile,.kpi-status-icon)[data-neon-status][data-state="WAIT"] { --neon-accent: var(--neon-wait); }
html .equipment-tile[data-neon-status][data-state],
html[data-ui-design="modern"] .equipment-tile[data-neon-status][data-state] {
  background: var(--neon-face); border-color: transparent; color: var(--neon-ink);
  box-shadow: inset 0 0 12px color-mix(in srgb,var(--neon-accent) 8%,transparent);
}
html .equipment-tile[data-neon-status]::before { display: none; }
.equipment-tile[data-neon-status] .equipment-neon-frame,
.equipment-tile[data-neon-status] .equipment-neon-warning-frame,
.equipment-tile[data-neon-status] .equipment-neon-laser { position: absolute; inset: 0; border-radius: inherit; pointer-events: none; }
.equipment-tile[data-neon-status] .equipment-neon-frame { z-index: 0; border: 1px solid color-mix(in srgb,var(--neon-accent) 54%,var(--neon-face)); }
.equipment-tile[data-neon-status] .equipment-neon-laser { z-index: 1; }
.equipment-tile[data-neon-status] .equipment-neon-laser i {
  position: absolute; width: 4px; height: 4px; border-radius: 50%; background: var(--neon-accent);
  offset-path: inset(2px round 6px); offset-anchor: center; offset-rotate: 0deg;
  offset-distance: var(--neon-start); opacity: var(--neon-alpha);
  box-shadow: 0 0 4px var(--neon-accent);
  animation: equipment-neon-perimeter 3.2s linear infinite;
  animation-delay: var(--neon-frame-delay,0ms);
}
.equipment-tile[data-neon-status] .equipment-neon-laser i:last-child { background: var(--neon-ink); }
.equipment-tile[data-neon-status] .equipment-neon-warning-frame {
  z-index: 1; opacity: .18; box-shadow: inset 0 0 9px color-mix(in srgb,var(--neon-accent) 32%,transparent);
  animation: equipment-neon-alert-light 2.8s ease-in-out infinite;
  animation-delay: var(--neon-alert-delay,0ms);
}
.equipment-tile[data-neon-status] .equipment-icon { z-index: 2; filter: none; color: var(--neon-accent); }
html .equipment-tile[data-neon-status] .equipment-code { z-index: 3; color: var(--neon-ink); background: none; }
html[data-ui-design="modern"] .equipment-tile[data-neon-status][data-state] .equipment-meta {
  z-index: 3; color: var(--neon-accent); background: none;
}
html .equipment-tile[data-neon-status].work-waiting { box-shadow: inset 0 0 0 2px #ffc941; }
html[data-ui-design="modern"] .equipment-tile[data-neon-status].work-waiting .equipment-meta { color: var(--ink); }
.equipment-tile[data-neon-status]:focus-visible { outline: 2px solid var(--cyan); outline-offset: 2px; }
:is(.equipment-tile,.kpi-status-icon)[data-neon-status] .status-motion-icon { position: relative; display: grid; place-items: center; width: 100%; height: 100%; color: var(--neon-accent); }
:is(.equipment-tile,.kpi-status-icon)[data-neon-status] .status-motion-track {
  position: absolute; inset: 7%; border: 1px solid color-mix(in srgb,var(--neon-accent) 40%,var(--neon-face)); border-radius: 50%;
  background: color-mix(in srgb,var(--neon-accent) 6%,var(--neon-face));
  box-shadow: 0 0 4px color-mix(in srgb,var(--neon-accent) 20%,transparent);
}
:is(.equipment-tile,.kpi-status-icon)[data-neon-status] .status-motion-glyph {
  position: relative; z-index: 2; display: grid; place-items: center; width: 64%; height: 64%;
  border: 0; border-radius: 0; background: none; box-shadow: none; animation: none; transform: none; opacity: 1;
}
html :is(.equipment-tile,.kpi-status-icon)[data-neon-status] .status-motion-glyph svg { display: block; width: 100%; height: 100%; overflow: visible; }
:is(.equipment-tile,.kpi-status-icon)[data-neon-status] .icon-symbol { fill: currentColor; stroke: none; animation: none; transform: none; }
:is(.equipment-tile,.kpi-status-icon)[data-neon-status] .icon-line { fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
:is(.equipment-tile,.kpi-status-icon)[data-neon-status] .status-motion-signal,
:is(.equipment-tile,.kpi-status-icon)[data-neon-status] .status-motion-slash { animation: none; opacity: 1; stroke-dasharray: none; stroke-dashoffset: 0; }
:is(.equipment-tile,.kpi-status-icon)[data-neon-status] .status-motion-orbit {
  position: absolute; inset: 2%; border: 2px solid transparent; border-top-color: var(--neon-accent); border-bottom-color: var(--neon-accent); border-radius: 50%;
  animation: equipment-neon-orbit 1.8s linear infinite; animation-delay: var(--neon-orbit-delay,0ms);
}
:is(.equipment-tile,.kpi-status-icon)[data-neon-status] .status-motion-orbit::before,
:is(.equipment-tile,.kpi-status-icon)[data-neon-status] .status-motion-orbit::after {
  content: ""; position: absolute; width: 3px; height: 3px; inset: auto; border-radius: 50%;
  background: var(--neon-ink); -webkit-mask: none; mask: none; opacity: 1; animation: none;
  box-shadow: 0 0 5px var(--neon-accent);
}
:is(.equipment-tile,.kpi-status-icon)[data-neon-status] .status-motion-orbit::before { top: 6%; right: 6%; }
:is(.equipment-tile,.kpi-status-icon)[data-neon-status] .status-motion-orbit::after { bottom: 6%; left: 6%; }
:is(.equipment-tile,.kpi-status-icon)[data-neon-status] .status-motion-icon--stop .status-motion-track { border-color: var(--neon-accent); box-shadow: 0 0 5px color-mix(in srgb,var(--neon-accent) 32%,transparent); }
:is(.equipment-tile,.kpi-status-icon)[data-neon-status] .status-motion-icon--wait .status-motion-track { border-color: var(--neon-accent); }
:is(.equipment-tile,.kpi-status-icon)[data-neon-status] .status-motion-icon--offline .status-motion-track,
:is(.equipment-tile,.kpi-status-icon)[data-neon-status] .status-motion-icon--long-stop .status-motion-track { border-style: dashed; background: var(--neon-face); box-shadow: none; }
/* The fitted grid keeps its own icon box. Only the regular 96px tile is enlarged here. */
html[data-ui-design="modern"] .equipment-tile:not(.factory-machine-marker) .equipment-icon { width: 42px; height: 42px; top: 24px; left: calc(50% - 21px); margin: 0; }
html[data-ui-design="modern"] .equipment-tile:not(.factory-machine-marker) .equipment-code { top: 5px; }
html[data-ui-design="modern"] .equipment-tile:not(.factory-machine-marker) .equipment-meta { min-height: 12px; height: 12px; bottom: 15px; }
.equipment-tile[data-neon-status].factory-machine-marker .equipment-neon-laser i { width: 2px; height: 2px; offset-path: inset(1px round 4px); box-shadow: 0 0 2px var(--neon-accent); }
.equipment-tile[data-neon-status].factory-machine-marker .status-motion-orbit { border-width: 1px; }
.equipment-tile[data-neon-status].factory-machine-marker .status-motion-orbit::before,
.equipment-tile[data-neon-status].factory-machine-marker .status-motion-orbit::after { width: 2px; height: 2px; box-shadow: 0 0 2px var(--neon-accent); }
/* Approved A LED treatment: presentation only, shared by both fitted views.
   Keep light-theme contrast, gray long-stop/offline states and all tile geometry.
   Text and the white LED core stay still; only the existing orbit/laser moves. */
html[data-theme="dark"] .equipment-tile[data-neon-status]:is([data-state="RUN"],[data-state="STOP"],[data-state="WAIT"]) .equipment-neon-frame {
  border-color: var(--neon-accent); opacity: .9;
  box-shadow: 0 0 8px color-mix(in srgb,var(--neon-accent) 45%,transparent),inset 0 0 7px color-mix(in srgb,var(--neon-accent) 18%,transparent);
}
html[data-theme="dark"] :is(.equipment-tile,.kpi-status-icon)[data-neon-status]:is([data-state="RUN"],[data-state="STOP"],[data-state="WAIT"]) .status-motion-track {
  border-color: var(--neon-accent); background: color-mix(in srgb,var(--neon-accent) 7%,var(--neon-face));
  box-shadow: 0 0 11px color-mix(in srgb,var(--neon-accent) 64%,transparent);
}
html[data-theme="dark"] :is(.equipment-tile,.kpi-status-icon)[data-neon-status]:is([data-state="RUN"],[data-state="STOP"],[data-state="WAIT"]) .status-motion-track::after {
  content: ""; position: absolute; inset: 0; border: 1px solid #fff1de; border-radius: inherit;
  opacity: .55; pointer-events: none; animation: none;
}
html[data-theme="dark"] :is(.equipment-tile,.kpi-status-icon)[data-neon-status]:is([data-state="RUN"],[data-state="STOP"],[data-state="WAIT"]) .status-motion-glyph,
html[data-theme="dark"] :is(.equipment-tile,.kpi-status-icon)[data-neon-status]:is([data-state="RUN"],[data-state="STOP"],[data-state="WAIT"]) .status-motion-orbit {
  filter: drop-shadow(0 0 3px var(--neon-accent));
}
html[data-theme="dark"] .equipment-tile[data-neon-status]:is([data-state="RUN"],[data-state="STOP"],[data-state="WAIT"]) .equipment-neon-laser i {
  width: 3px; height: 3px; box-shadow: 0 0 7px var(--neon-accent);
}
html[data-theme="dark"] .equipment-tile[data-neon-status]:is([data-state="RUN"],[data-state="STOP"],[data-state="WAIT"]) .equipment-neon-laser i:last-child,
html[data-theme="dark"] :is(.equipment-tile,.kpi-status-icon)[data-neon-status]:is([data-state="RUN"],[data-state="STOP"],[data-state="WAIT"]) .status-motion-orbit::before,
html[data-theme="dark"] :is(.equipment-tile,.kpi-status-icon)[data-neon-status]:is([data-state="RUN"],[data-state="STOP"],[data-state="WAIT"]) .status-motion-orbit::after { background: #fff6ef; }
html[data-theme="dark"] .equipment-tile[data-neon-status]:is([data-state="RUN"],[data-state="STOP"],[data-state="WAIT"]):not(.work-waiting) .equipment-meta {
  color: var(--neon-ink); text-shadow: none; filter: none;
}
html[data-theme="dark"] .equipment-tile[data-neon-status].factory-machine-marker:is([data-state="RUN"],[data-state="STOP"],[data-state="WAIT"]) .equipment-neon-laser i {
  width: 2px; height: 2px; box-shadow: 0 0 4px var(--neon-accent);
}
@keyframes equipment-neon-perimeter { from { offset-distance: var(--neon-start); } to { offset-distance: calc(100% + var(--neon-start)); } }
@keyframes equipment-neon-orbit { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
@keyframes equipment-neon-alert-light { 0%,100% { opacity: .18; } 35% { opacity: .65; } 80% { opacity: .18; } }
@media (prefers-reduced-motion: reduce) {
  :is(.equipment-tile,.kpi-status-icon)[data-neon-status] *, :is(.equipment-tile,.kpi-status-icon)[data-neon-status] *::before, :is(.equipment-tile,.kpi-status-icon)[data-neon-status] *::after { animation: none !important; }
  .equipment-tile[data-neon-status] .equipment-neon-laser { display: none; }
}
@supports not (offset-path: inset(2px round 6px)) {
  .equipment-tile[data-neon-status] .equipment-neon-laser { display: none; }
}
