/* ==========================================================================
   WELLE 315 - Der Bestand war unsichtbar scrollbar.

   Befund vom 5.8., gemessen auf /industries/life-sciences/ und
   /industries/life-sciences/console/:
     Die Liste "THE RACK" traegt zehn Eintraege zu je 88 px, zusammen 836 px.
     Der Kasten zeigte 468 px - also 5,3 Eintraege. Die Kopfzeile daneben
     verspricht "Ten entries on file" und der Zaehler steht auf 10/10.
     Auf 700 px Fensterhoehe waren nur vier von zehn zu sehen.
     Kein Balken, keine Kante, kein Hinweis: nichts zeigte an, dass dort
     noch etwas liegt. Deshalb liest sich der Apparat als unvollstaendig
     statt als scrollbar.

   Die Liste ganz aufzuklappen scheidet aus - 836 px sind 93 vh, das
   sprengt die Spalte und liesse die Nachbarspalten als leere Flaechen
   zurueck, was der Guss verbietet.

   Also bleibt der Kasten, aber er sagt jetzt, dass er einer ist:
     - der Deckel steigt von 52vh auf 62vh, das sind zwei Eintraege mehr
     - ein schmaler goldener Balken steht sichtbar im Kanal
     - zwei Schatten an Ober- und Unterkante zeigen, dass mehr da ist

   Kein neues JS. Die Schatten haengen an background-attachment:local und
   verschwinden von selbst, sobald der Bestand zu Ende gelesen ist.
   Panelfarbe #0a1119 ist aus dem gerenderten Baum genommen, nicht geraten.
   Der Selektor prueft nur auf 52vh: auf der Konsole erzeugt JS das Element,
   und der Browser schreibt das Stil-Attribut dann mit Leerzeichen um.
   ========================================================================== */

.ka-bestand,
[style*="52vh"] {
  max-height: clamp(340px, 62vh, 700px) !important;
  scrollbar-gutter: stable;
  scrollbar-width: thin;
  scrollbar-color: rgba(216, 172, 92, .50) rgba(255, 255, 255, .06);
  background:
    linear-gradient(#0a1119 34%, rgba(10, 17, 25, 0)) center top / 100% 30px no-repeat local,
    linear-gradient(rgba(10, 17, 25, 0), #0a1119 66%) center bottom / 100% 34px no-repeat local,
    radial-gradient(farthest-side at 50% 0, rgba(0, 0, 0, .55), rgba(0, 0, 0, 0)) center top / 100% 14px no-repeat scroll,
    radial-gradient(farthest-side at 50% 100%, rgba(0, 0, 0, .55), rgba(0, 0, 0, 0)) center bottom / 100% 14px no-repeat scroll;
}
n
/* Der Kanal bleibt stehen, damit der Inhalt beim Scrollen nicht springt. */
.ka-bestand::-webkit-scrollbar,
[style*="52vh"]::-webkit-scrollbar {
  width: 6px;
}

.ka-bestand::-webkit-scrollbar-track,
[style*="52vh"]::-webkit-scrollbar-track {
  background: rgba(255, 255, 255, .06);
  border-radius: 3px;
}

.ka-bestand::-webkit-scrollbar-thumb,
[style*="52vh"]::-webkit-scrollbar-thumb {
  background: rgba(216, 172, 92, .50);
  border-radius: 3px;
}

.ka-bestand:hover::-webkit-scrollbar-thumb,
[style*="52vh"]:hover::-webkit-scrollbar-thumb {
  background: rgba(216, 172, 92, .82);
}

/* Wer die Bewegung abbestellt hat, bekommt trotzdem den Balken und die
   Schatten - beide sind Zustand, keine Bewegung. */