diff --git a/plugin/contents/ui/dancer.html b/plugin/contents/ui/dancer.html
index cf53be8..0d9faff 100644
--- a/plugin/contents/ui/dancer.html
+++ b/plugin/contents/ui/dancer.html
@@ -121,6 +121,14 @@ html, body {
   transform-origin: top center;
   animation: meteorFall linear forwards;
 }
+#meteorLayer {
+  position: absolute;
+  inset: 0;
+  pointer-events: none;
+  -webkit-mask-image: linear-gradient(to bottom, black 50%, transparent 60%);
+  mask-image: linear-gradient(to bottom, black 50%, transparent 60%);
+}
+
 @keyframes meteorFall {
   0%   { opacity: 0; transform: rotate(var(--rot)) translateY(0); }
   5%   { opacity: 1; }
@@ -745,6 +753,9 @@ html, body {
   <!-- Horizon glow -->
   <div class="horizon"></div>
 
+  <!-- Meteor layer (masked at horizon) -->
+  <div id="meteorLayer"></div>
+
   <!-- ===================== ROBOT ===================== -->
   <div class="robot-wrap">
     <div class="beat-wrap">
@@ -919,7 +930,7 @@ function spawnMeteor() {
     animation-duration:${dur}s;
     animation-name:meteorFall;
   `;
-  document.querySelector('.scene').appendChild(el);
+  document.getElementById('meteorLayer').appendChild(el);
   setTimeout(() => el.remove(), dur * 1000);
 }