/* MadTimes Electric Border — light CSS chrome; canvas does the motion */
.electric-border,
.face[data-electric="1"],
.frame[data-electric="1"] {
  --electric-border-color: #ff4d00;
  --electric-light-color: color-mix(in srgb, var(--electric-border-color) 72%, #fff);
  position: relative;
  isolation: isolate;
  overflow: visible;
}
.card:has([data-electric="1"]),
.card-feature:has([data-electric="1"]),
.pull-card:has([data-electric="1"]),
.buddy-face:has([data-electric="1"]) {
  overflow: visible;
}
.eb-canvas-container {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  pointer-events: none;
  z-index: 6;
}
.eb-canvas { display: block; }
.electric-border.is-idle .eb-canvas-container,
.face[data-electric="1"].is-idle .eb-canvas-container,
.frame[data-electric="1"].is-idle .eb-canvas-container {
  visibility: hidden;
}
.eb-layers {
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  z-index: 5;
}
.eb-glow-1,
.eb-glow-2,
.eb-background-glow {
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  box-sizing: border-box;
}
.eb-glow-1 {
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--electric-border-color) 55%, transparent);
}
.eb-glow-2 {
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--electric-light-color) 35%, transparent);
}
.eb-background-glow {
  z-index: -1;
  opacity: 0.28;
  background: radial-gradient(circle at 50% 40%, color-mix(in srgb, var(--electric-border-color) 35%, transparent), transparent 68%);
}
.electric-border.is-idle .eb-background-glow,
.face[data-electric="1"].is-idle .eb-background-glow,
.frame[data-electric="1"].is-idle .eb-background-glow {
  opacity: 0.12;
}
.face[data-electric="1"] > .face-view,
.frame[data-electric="1"] > .viewport {
  position: relative;
  z-index: 1;
  border-radius: inherit;
}
@media (prefers-reduced-motion: reduce) {
  .eb-canvas-container { display: none; }
}