:root{
  --bm-neon-checkbox-primary:#00ffaa;
  --bm-neon-checkbox-primary-dark:#00cc88;
  --bm-neon-checkbox-primary-light:#88ffdd;
  --bm-neon-checkbox-size:24px;
}
.bm-neon-checkbox-host{
  position:relative;
  display:inline-flex!important;
  align-items:center;
  gap:9px;
  min-height:var(--bm-neon-checkbox-size);
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}
.bm-neon-checkbox-input{
  position:absolute!important;
  inline-size:var(--bm-neon-checkbox-size)!important;
  block-size:var(--bm-neon-checkbox-size)!important;
  opacity:0!important;
  margin:0!important;
  pointer-events:none!important;
}
.neon-checkbox{
  --primary:var(--bm-neon-checkbox-primary);
  --primary-dark:var(--bm-neon-checkbox-primary-dark);
  --primary-light:var(--bm-neon-checkbox-primary-light);
  --size:var(--bm-neon-checkbox-size);
  position:relative;
  width:var(--size);
  height:var(--size);
  flex:0 0 var(--size);
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}
.neon-checkbox__frame{position:relative;width:100%;height:100%}
.neon-checkbox__box{position:absolute;inset:0;background:rgba(0,0,0,.8);border-radius:5px;border:2px solid var(--primary-dark);transition:all .4s ease;box-shadow:inset 0 1px 0 rgba(255,255,255,.05)}
.neon-checkbox__check-container{position:absolute;inset:2px;display:flex;align-items:center;justify-content:center}
.neon-checkbox__check{width:80%;height:80%;fill:none;stroke:var(--primary);stroke-width:3;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:40;stroke-dashoffset:40;transform-origin:center;transition:all .4s cubic-bezier(.16,1,.3,1)}
.neon-checkbox__glow{position:absolute;inset:-2px;border-radius:7px;background:var(--primary);opacity:0;filter:blur(8px);transform:scale(1.2);transition:all .4s ease}
.neon-checkbox__borders{position:absolute;inset:0;border-radius:5px;overflow:hidden}
.neon-checkbox__borders span{position:absolute;width:40px;height:1px;background:var(--primary);opacity:0;transition:opacity .4s ease}
.neon-checkbox__borders span:nth-child(1){top:0;left:-100%;animation:bmBorderFlow1 2s linear infinite}
.neon-checkbox__borders span:nth-child(2){top:-100%;right:0;width:1px;height:40px;animation:bmBorderFlow2 2s linear infinite}
.neon-checkbox__borders span:nth-child(3){bottom:0;right:-100%;animation:bmBorderFlow3 2s linear infinite}
.neon-checkbox__borders span:nth-child(4){bottom:-100%;left:0;width:1px;height:40px;animation:bmBorderFlow4 2s linear infinite}
.neon-checkbox__particles span{position:absolute;width:4px;height:4px;background:var(--primary);border-radius:50%;opacity:0;pointer-events:none;top:50%;left:50%;box-shadow:0 0 6px var(--primary)}
.neon-checkbox__rings{position:absolute;inset:-16px;pointer-events:none}
.neon-checkbox__rings .ring{position:absolute;inset:0;border-radius:50%;border:1px solid var(--primary);opacity:0;transform:scale(0)}
.neon-checkbox__sparks span{position:absolute;width:18px;height:1px;background:linear-gradient(90deg,var(--primary),transparent);opacity:0}
.bm-neon-checkbox-host:hover .neon-checkbox__box{border-color:var(--primary);transform:scale(1.05)}
.bm-neon-checkbox-host:focus-within .neon-checkbox__box{outline:2px solid color-mix(in srgb,var(--primary) 50%,transparent);outline-offset:3px}
.bm-neon-checkbox-input:checked + .neon-checkbox .neon-checkbox__box{border-color:var(--primary);background:color-mix(in srgb,var(--primary) 10%,rgba(0,0,0,.78))}
.bm-neon-checkbox-input:checked + .neon-checkbox .neon-checkbox__check{stroke-dashoffset:0;transform:scale(1.1)}
.bm-neon-checkbox-input:checked + .neon-checkbox .neon-checkbox__glow{opacity:.2}
.bm-neon-checkbox-input:checked + .neon-checkbox .neon-checkbox__borders span{opacity:1}
.bm-neon-checkbox-input:checked + .neon-checkbox .neon-checkbox__particles span{animation:bmParticleExplosion .6s ease-out forwards}
.bm-neon-checkbox-input:checked + .neon-checkbox .neon-checkbox__rings .ring{animation:bmRingPulse .6s ease-out forwards}
.bm-neon-checkbox-input:checked + .neon-checkbox .neon-checkbox__sparks span{animation:bmSparkFlash .6s ease-out forwards}
.bm-neon-checkbox-input:disabled + .neon-checkbox{opacity:.48;cursor:not-allowed;filter:grayscale(.25)}
@keyframes bmBorderFlow1{0%{transform:translateX(0)}100%{transform:translateX(200%)}}
@keyframes bmBorderFlow2{0%{transform:translateY(0)}100%{transform:translateY(200%)}}
@keyframes bmBorderFlow3{0%{transform:translateX(0)}100%{transform:translateX(-200%)}}
@keyframes bmBorderFlow4{0%{transform:translateY(0)}100%{transform:translateY(-200%)}}
@keyframes bmParticleExplosion{0%{transform:translate(-50%,-50%) scale(1);opacity:0}20%{opacity:1}100%{transform:translate(calc(-50% + var(--x,20px)),calc(-50% + var(--y,20px))) scale(0);opacity:0}}
@keyframes bmRingPulse{0%{transform:scale(0);opacity:1}100%{transform:scale(2);opacity:0}}
@keyframes bmSparkFlash{0%{transform:rotate(var(--r,0deg)) translateX(0) scale(1);opacity:1}100%{transform:rotate(var(--r,0deg)) translateX(30px) scale(0);opacity:0}}
.neon-checkbox__particles span:nth-child(1){--x:25px;--y:-25px}.neon-checkbox__particles span:nth-child(2){--x:-25px;--y:-25px}.neon-checkbox__particles span:nth-child(3){--x:25px;--y:25px}.neon-checkbox__particles span:nth-child(4){--x:-25px;--y:25px}.neon-checkbox__particles span:nth-child(5){--x:35px;--y:0}.neon-checkbox__particles span:nth-child(6){--x:-35px;--y:0}.neon-checkbox__particles span:nth-child(7){--x:0;--y:35px}.neon-checkbox__particles span:nth-child(8){--x:0;--y:-35px}.neon-checkbox__particles span:nth-child(9){--x:20px;--y:-30px}.neon-checkbox__particles span:nth-child(10){--x:-20px;--y:30px}.neon-checkbox__particles span:nth-child(11){--x:30px;--y:20px}.neon-checkbox__particles span:nth-child(12){--x:-30px;--y:-20px}
.neon-checkbox__sparks span:nth-child(1){--r:0deg;top:50%;left:50%}.neon-checkbox__sparks span:nth-child(2){--r:90deg;top:50%;left:50%}.neon-checkbox__sparks span:nth-child(3){--r:180deg;top:50%;left:50%}.neon-checkbox__sparks span:nth-child(4){--r:270deg;top:50%;left:50%}
.neon-checkbox__rings .ring:nth-child(2){animation-delay:.1s}.neon-checkbox__rings .ring:nth-child(3){animation-delay:.2s}
@media(max-width:640px){:root{--bm-neon-checkbox-size:min(var(--bm-neon-checkbox-size),24px)}.bm-neon-checkbox-host{gap:7px}}
@media(prefers-reduced-motion:reduce){.neon-checkbox *{animation:none!important;transition-duration:.01ms!important}.bm-neon-checkbox-input:checked + .neon-checkbox .neon-checkbox__check{stroke-dashoffset:0}}
