/* Shape follows the host's real border-radius. Original textured LED is separate. */
.lk-led {
  --lk-led-color: #66ffb1;
  --lk-led-width: 2px;
  --lk-led-glow: 18px;
  --lk-led-strength: .85;
  position: relative;
  isolation: isolate;
  transition: box-shadow .18s ease;
}
.lk-led::after {
  content: "";
  position: absolute;
  inset: 0;
  box-sizing: border-box;
  padding: var(--lk-led-width);
  border-radius: inherit;
  pointer-events: none;
  z-index: 1;
  background: linear-gradient(125deg, transparent 12%, #fff 18%, transparent 24%, transparent 66%, #ffffffaa 72%, transparent 79%), var(--lk-led-color);
  /* Remove the centre rather than painting over the host's content. */
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  opacity: 0;
  transition: opacity .18s ease;
}
.lk-led:is(:hover, :focus-visible, :focus-within, [data-led-on]) {
  box-shadow: var(--lk-led-base-shadow, 0 0 0 transparent), 0 0 var(--lk-led-glow) color-mix(in srgb, var(--lk-led-color) 45%, transparent), inset 0 0 calc(var(--lk-led-glow) * .6) color-mix(in srgb, var(--lk-led-color) 16%, transparent);
}
.lk-led:is(:hover, :focus-visible, :focus-within, [data-led-on])::after { opacity: var(--lk-led-strength); }
.lk-led:focus-visible { outline: 2px solid var(--lk-led-color); outline-offset: 5px; }
@supports not ((mask-composite: exclude) or (-webkit-mask-composite: xor)) {
  .lk-led::after { padding: 0; background: none; border: var(--lk-led-width) solid var(--lk-led-color); }
}
@media (prefers-reduced-motion: reduce) { .lk-led, .lk-led::after { transition: none; } }

