/* Ring-Begleiter (assets/ring-begleiter.js): Neon-Ring, der durch die Seite hüpft */
.rb{position:fixed;left:0;top:0;width:92px;height:85px;z-index:30;pointer-events:none;opacity:0;transition:opacity .2s;transform-origin:0 0;will-change:transform}
.rb.on{opacity:1;pointer-events:auto;cursor:pointer}
.rb-body{position:absolute;inset:0;transform-origin:45.5px 75.9px}   /* Stauchen am Aufsetzpunkt */
.rb .ring3d{position:absolute;left:0;top:0;width:92px;height:85px}   /* Leuchten zeichnet ring.js direkt ins Canvas */
/* sein Licht auf Seite und Schrift */
.rb-glow{position:fixed;left:0;top:0;width:640px;height:640px;margin:-320px 0 0 -320px;z-index:29;pointer-events:none;opacity:0;transition:opacity .2s;mix-blend-mode:screen;will-change:transform;
  background:radial-gradient(closest-side,rgba(255,110,180,.3),rgba(255,70,155,.15) 8%,rgba(255,55,145,.06) 20%,rgba(255,45,135,.02) 45%,transparent)}
.rb-glow.on{opacity:1}
/* Ring ist unterwegs: Original in der Leuchtreklame bzw. im Fuss-Logo ausblenden */
.hring.rb-away,.hr-glow.rb-away,.ring3d.rb-away{opacity:0!important;transition:opacity .15s}
/* Schrift, auf der er landet: federt ein und leuchtet kurz pink */
.rb-hit{animation:rb-hit .7s cubic-bezier(.3,.7,.3,1)}
@keyframes rb-hit{0%{transform:none}16%{transform:translateY(.06em);text-shadow:0 0 .3em rgba(255,90,170,.9),0 0 1em rgba(255,60,150,.45)}42%{transform:translateY(-.02em)}100%{transform:none;text-shadow:none}}
/* Auto, auf dem er landet: Karosserie federt kurz ein */
.car img.b.rb-hit{animation:rb-car .55s cubic-bezier(.3,.7,.3,1)}
@keyframes rb-car{0%{transform:none}18%{transform:translateY(4px)}45%{transform:translateY(-1px)}100%{transform:none}}
