/* Fließband: Bänder, Lead-Karten und Scanner-Linie. Eine Quelle für Landing-Hero und Anmeldung;
   fliessband.js füllt die Ebene. Lage und Maske der Bühne legt jeder Einsatz selbst fest. */
.l-fliess-ebene {
  position: absolute; left: 50%; top: 56%; width: 1800px; height: 480px; margin: -240px 0 0 -900px;
  transform: rotateX(62deg) rotateZ(-22deg); transform-style: preserve-3d;
}
.l-bahn {
  position: absolute; left: 0; width: 1800px; height: 64px; border-radius: 12px;
  border: 1px solid var(--rand); background-color: color-mix(in srgb, var(--flaeche) 80%, transparent);
  background-image: repeating-linear-gradient(90deg, color-mix(in srgb, var(--rand-stark) 70%, transparent) 0 1px, transparent 1px 34px);
  animation: l-band-lauf .8s linear infinite;
}
@keyframes l-band-lauf { to { background-position: 34px 0; } }
.l-chip {
  position: absolute; left: 0; top: 9px; width: 152px; height: 46px; display: flex; align-items: center; gap: 8px; padding: 0 10px;
  border-radius: 10px; border: 1px solid var(--rand-stark); background: var(--flaeche-2); font-size: 12px; font-weight: 600; white-space: nowrap;
  box-shadow: 0 10px 20px -12px rgba(0, 0, 0, .55); will-change: transform; transition: border-color .35s, background-color .35s, box-shadow .35s;
}
.l-chip-av { display: grid; place-items: center; width: 26px; height: 26px; flex: none; border-radius: 50%; font-size: 10px; font-weight: 700; transition: background .35s, color .35s; }
.l-chip-text { overflow: hidden; text-overflow: ellipsis; }
.l-chip svg { width: 15px; height: 15px; flex: none; margin-left: auto; color: var(--glut); opacity: 0; transition: opacity .3s; }
.l-chip.kalt { border-color: color-mix(in srgb, var(--frost) 45%, var(--rand-stark)); color: var(--frost-text); }
.l-chip.kalt .l-chip-av { background: var(--frost-flaeche); color: var(--frost-text); }
.l-chip.heiss { border-color: var(--glut); background: var(--glut-flaeche); color: var(--glut-text); box-shadow: 0 0 22px -4px color-mix(in srgb, var(--glut) 70%, transparent); }
.l-chip.heiss .l-chip-av { background: var(--glut); color: #0B0D14; }
.l-chip.heiss svg { opacity: 1; }
/* der Butler als glühende Scanner-Linie quer über alle Bänder */
.l-station {
  /* läuft unten aus statt hart zu enden; das Leuchten folgt der Form (drop-shadow) und blendet mit aus */
  position: absolute; top: -40px; bottom: 0; width: 6px; margin-left: -3px; border-radius: 3px;
  background: linear-gradient(to bottom, var(--glut) 0, var(--glut) 55%, color-mix(in srgb, var(--glut) 40%, transparent) 80%, transparent 100%);
  filter: drop-shadow(0 0 6px color-mix(in srgb, var(--glut) 80%, transparent)) drop-shadow(0 0 22px color-mix(in srgb, var(--glut) 45%, transparent));
  animation: l-scanner 2.4s ease-in-out infinite;
}
@keyframes l-scanner { 50% { filter: drop-shadow(0 0 9px color-mix(in srgb, var(--glut) 90%, transparent)) drop-shadow(0 0 34px color-mix(in srgb, var(--glut) 55%, transparent)); } }
.l-station-schild {
  position: absolute; top: -34px; left: 50%; transform: translateX(-50%); display: flex; align-items: center; gap: 7px;
  padding: 6px 12px; border-radius: 9px; background: var(--flaeche); border: 1px solid var(--glut); white-space: nowrap;
  font-family: var(--font-data); font-size: 12px; letter-spacing: .16em; text-transform: uppercase; color: var(--text);
}
@media (prefers-reduced-motion: reduce) { .l-bahn, .l-station { animation: none; } }