/* Preserve the original surface and canvas colors; separate surfaces with borders only. */
@property --xh-generation-angle { syntax: '<angle>'; initial-value: 0deg; inherits: false; }
@keyframes xh-generation-orbit { to { --xh-generation-angle: 360deg; } }
[data-project-theme="dark"] [data-prompt-surface] {
  border-color: #747c87 !important;
}
[data-node-card][data-generation-empty="true"]::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 39;
  border-radius: inherit;
  border: 1px solid #89939e;
  pointer-events: none;
}
[data-node-card][data-generation-active="true"]::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 40;
  border-radius: inherit;
  padding: 2.5px;
  background: conic-gradient(from var(--xh-generation-angle), #27839955 0deg, #27839955 80deg, #32d6ff 125deg, #ffffff 150deg, #32d6ff 162deg, #27839955 180deg, #27839955 260deg, #32d6ff 305deg, #ffffff 330deg, #32d6ff 342deg, #27839955 360deg);
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  pointer-events: none;
  filter: drop-shadow(0 0 2px #4addff);
  animation: xh-generation-orbit 1.8s linear infinite;
}
@media(prefers-reduced-motion: reduce) {
  [data-node-card][data-generation-active="true"]::after { animation: none; }
}