.lumina-shooting-star{
  position:absolute;
  inset:0;
  z-index:0;
  overflow:hidden;
  contain:strict;
  pointer-events:none;
}

.lumina-shooting-star[hidden]{display:none}

.lumina-meteor{
  position:absolute;
  top:0;
  left:0;
  width:1px;
  height:1px;
  opacity:0;
  will-change:transform,opacity;
}

.lumina-meteor-trail{
  position:absolute;
  top:50%;
  right:0;
  width:var(--meteor-trail,122px);
  height:3px;
  border-radius:999px;
  transform:rotate(var(--meteor-angle,0deg));
  transform-origin:right center;
  background:linear-gradient(90deg,
    transparent 0%,
    rgba(194,122,77,.11) 15%,
    rgba(236,185,129,.38) 58%,
    rgba(255,239,204,.94) 90%,
    rgba(255,252,242,1) 100%);
  box-shadow:0 0 7px rgba(241,179,119,.22);
}

.lumina-meteor-trail::before{
  content:"";
  position:absolute;
  inset:-4px 0;
  border-radius:inherit;
  background:linear-gradient(90deg,
    transparent 5%,
    rgba(221,151,93,.07) 32%,
    rgba(255,222,177,.27) 80%,
    rgba(255,242,213,.44));
  filter:blur(2px);
}

.lumina-meteor-trail::after{
  content:"";
  position:absolute;
  top:50%;
  right:-3px;
  width:9px;
  height:9px;
  border-radius:50%;
  transform:translateY(-50%);
  background:radial-gradient(circle,
    rgba(255,253,243,1) 0 15%,
    rgba(255,230,188,.76) 31%,
    rgba(218,143,86,.22) 60%,
    transparent 78%);
}

.lumina-meteor-debug-box,
.lumina-meteor-debug-dot{
  position:absolute;
  z-index:8;
  pointer-events:none;
}

.lumina-meteor-debug-box{
  border:1px solid rgba(255,90,90,.78);
  background:rgba(255,90,90,.04);
}

.lumina-meteor-debug-dot{
  width:4px;
  height:4px;
  margin:-2px 0 0 -2px;
  border-radius:50%;
  background:#62e8ff;
}

@media(max-width:699px){
  .lumina-meteor-trail{height:2.5px}
  .lumina-meteor-trail::after{width:7px;height:7px}
}

@media(max-width:340px), (prefers-reduced-motion:reduce){
  .lumina-shooting-star{display:none!important}
}