/* .pc-leaderboard-head ist mit 6.88.0 entfallen, die Seite hat ihren
   Kopfbereich verloren. Die Breitenregel bleibt und traegt jetzt allein
   den Inhalt; ohne sie klebte er am Fensterrand. */
.pc-leaderboard-container {
  width: var(--pc-width);
  max-width: var(--pc-max) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding: 0 !important;
  box-sizing: border-box;
  background: transparent !important;
  background-color: transparent !important;

  display: flex;
  flex-direction: column;

  /* Haelt die Hoehe, solange geladen wird, damit die Seite nicht springt.
     Sobald die Liste steht, wird die Vorgabe aufgehoben: Sonst bleibt bei
     wenigen Eintraegen ein grosser leerer Bereich stehen. */
  min-height: 400px;
}

.pc-leaderboard-container.is-ready {
  min-height: 0;
}

.pc-leaderboard-card {
  position: relative;
  background: none !important;
  background-color: transparent !important;
  border: none !important;
  border-left: 1px solid rgba(255, 255, 255, 0.35) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 28px 0 28px 28px !important;
  margin: 0 0 24px 0 !important;
  box-sizing: border-box;
}

.pc-leaderboard-card::before,
.pc-leaderboard-card::after {
  content: "";
  position: absolute;
  left: 0;
  width: 100%;
  height: 1px;
  background: linear-gradient(to right, var(--pc-text), rgba(255, 255, 255, 0));
  opacity: 0.35;
  pointer-events: none;
}

.pc-leaderboard-card::before { top: 0; }

.pc-leaderboard-card::after { bottom: 0; }

/* Die Reiterleiste .pc-tabs steht seit 6.65.0 in app.css. Die 404-Seite
   fuehrt vier Bestenlisten, eine je Haertestufe, und schaltet mit derselben
   Leiste zwischen ihnen um. Verschoben, nicht kopiert: app.css laedt auf
   beiden Seiten, leaderboard.css nur auf einer. Dieselbe Bewegung wie beim
   Zurueck-Knopf mit 6.56.0. */

.pc-leaderboard-list-wrap {
  width: 100%;
}

.pc-leaderboard-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  width: 100%;
}

.pc-leaderboard-list li {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  padding: 14px 0;
  border-bottom: 1px solid var(--pc-line);
  font-family: var(--pc-font-page);
  font-size: 14px;
  font-weight: var(--pc-weight-page);
  color: var(--pc-text);
  background: transparent !important;
}

.pc-leaderboard-list li:last-child {
  border-bottom: none;
}

.pc-lb-empty {
  color: var(--pc-muted) !important;
  justify-content: flex-start !important;
}

.rank-label {
  color: var(--pc-muted);
  width: 42px;
  font-size: 13px;
  letter-spacing: 1.5px;
  flex-shrink: 0;
}

.pc-leaderboard-list li.is-top .rank-label {
  color: var(--pc-warn);
}

.player-name {
  color: var(--pc-text);
  flex-grow: 1;
  text-align: left;
  font-size: 15px;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Der Teamname fuehrt auf seine Detailseite, seit 6.96.0.
 *
 * Er soll aussehen wie der Name daneben und nicht wie ein Verweis: Die
 * ganze Zeile ist eine Rangzeile, und ein farbiges Wort mittendrin sieht
 * aus wie ein Fremdkoerper. Angefasst wird er trotzdem erkennbar - der
 * Zeigefinger und beim Ueberfahren Gold.
 *
 * `!important` und nicht mehr Genauigkeit: base.css faerbt jeden Verweis in
 * einem Listenpunkt des Inhaltsbereichs (`.entry-content li a`, das ist
 * (0,2,1)), und die Liste des Leaderboards steht genau dort. Eine Regel
 * mit derselben Genauigkeit gewaenne nur ueber die Ladereihenfolge, und
 * die ist eine schwaechere Zusage als das Schluesselwort. */
.pc-lb-teamlink {
  color: inherit !important;
  text-decoration: none !important;
  cursor: pointer;
  transition: color 0.2s ease;
}

.pc-lb-teamlink:hover,
.pc-lb-teamlink:focus-visible {
  color: var(--pc-gold) !important;
}

.stat-grid-row {
  display: flex;
  gap: 22px;
  font-size: 13px;
  color: var(--pc-muted);
  flex-shrink: 0;
}

.stat-grid-row strong {
  color: var(--pc-text);
  font-weight: var(--pc-weight-page);
}

.stat-prize-val {
  color: var(--pc-live) !important;
}

/* Ein Gewinn steht gruen, seit 6.92.0 auch in der Angabenzeile der beiden
   Arcade-Listen. Gruen ist in diesem Projekt die Farbe der Gutschrift -
   dieselbe, die der Feed des Roulettes unter einem Gewinn benutzt, die
   Kachel der Spielerkarte seit 6.76.0 und .player-score.is-gewinn ein paar
   Zeilen weiter unten. Robert hat sie ausdruecklich genannt. */
.pc-lb-gewinn {
  color: var(--pc-live) !important;
  font-family: "droid-sans-mono", monospace;
}

/* Die Titel stehen orange, seit 6.94.0 auch in der Angabenzeile. Dieselbe
   Farbe wie in der Spalte rechts (.player-score), wo sie am Rechner
   stehen - es ist dieselbe Zahl, nur an einem anderen Platz. */
.pc-lb-titel {
  color: var(--pc-warn) !important;
}

/* Die Zellen, die es NUR am Telefon gibt: der Gewinn im Roulette und die
   Roehren bei Bird. Am Rechner traegt beides die Spalte rechts, und ohne
   diese Zeile stuende es dort doppelt.

   display: none in der GRUNDREGEL und nicht in einer Medienabfrage: So
   ist der Rechner der Normalfall und das Telefon die Ausnahme, und wer
   die Regel sucht, findet sie an der Klasse selbst. */
.pc-lb-wert-mobil {
  display: none;
}

.player-score {
  color: var(--pc-warn);
  font-size: 13px;
  text-align: right;
  min-width: 95px;
  letter-spacing: 1px;
  text-transform: uppercase;
  flex-shrink: 0;
}

/* ---------- Zurueckgehaltene Zahlen ----------
   Die Zeile bleibt stehen, sonst verschwaende ein Spieler aus der Liste,
   nur weil er seine Werte fuer sich behaelt. Sie steht mit lauter Nullen
   ganz unten, deshalb braucht sie einen Satz dazu; ohne ihn saehe sie aus
   wie die eines Neulings. */

.pc-lb-verborgen {
  font-family: var(--pc-font-page);
  font-size: 12.5px;
  font-weight: var(--pc-weight-page);
  font-style: italic;
  color: var(--pc-muted);
}

.player-score.is-verborgen {
  color: var(--pc-muted);
}

/* Der hoechste Einzelgewinn im Roulette steht gruen: Es ist eine
   Gutschrift, und Gruen ist in diesem Projekt die Farbe dafuer - dieselbe,
   die der Feed des Roulettes unter einem Gewinn benutzt und die Kachel in
   der Spielerkarte seit 6.76.0. Die Roehrenzahl von Bird bleibt orange
   wie jeder andere Wert dieser Spalte: Sie ist eine Leistung, keine
   Buchung. */
.player-score.is-gewinn {
  color: var(--pc-live);
  font-family: "droid-sans-mono", monospace;
  text-transform: none;
  letter-spacing: 0;
}

@media (max-width: 1100px) {
  .pc-leaderboard-container {
    width: 88%;
  }

  .stat-grid-row {
    gap: 16px;
  }
}

@media (max-width: 768px) {
  .pc-leaderboard-container {
    width: 100%;
    padding: 0 var(--pc-edge) !important;
  }

  .pc-leaderboard-card {
    border: 1px solid rgba(255, 255, 255, 0.28) !important;
    border-radius: 0 !important;
    padding: 20px 14px !important;
  }

  /* ---------------------------------------------------------------
   * DIE VIER REITER LIEFEN AUS DEM BILD
   *
   * Robert am 17.08.2026: "Pruefe das Leaderboard auf der Mobilen
   * Version, die 4 Punkte rutschen nach rechts raus." Er hat recht, und
   * es ist gemessen: Bei 375 Pixeln enden die Knoepfe bei x = 366,
   * die Leiste bei 340 - 26 Pixel stehen ueber. Bei 320 sind es 81.
   *
   * EINER UNTER DEM ANDEREN, Roberts Vorgabe vom 17.08.2026: "die
   * einzelnen TOP Felder untereinander platzieren". Mit 6.90.0 standen
   * sie als zwei mal zwei; bei 320 Pixeln reichte selbst das nicht und
   * es wurden drei Reihen, weil "Top 100 Roulette" und "Top 100 Bird
   * Extreme" zusammen 300 Pixel brauchen. Untereinander ist die Form,
   * die auf jeder Breite dieselbe ist.
   *
   * Eine Zeile zum Wegwischen waere die Alternative gewesen und ist
   * bewusst nicht gebaut: Sie versteckt zwei von vier Listen.
   *
   * align-items: flex-start ist noetig, sonst spannt jeder Knopf ueber
   * die volle Breite und seine Unterlinie - die Marke des aktiven
   * Reiters - liefe quer durch die Karte.
   *
   * NUR IM LEADERBOARD ueber die Karte, nicht an .pc-tabs: Dieselbe
   * Klasse traegt die Reiter der Stats-Seite und die der History des
   * Roulettes, und beide haben kurze Beschriftungen. Genau so steht es
   * seit 6.79.0 an #pcBirdTabs.
   *
   * !important an Schrift und Sperrung, weil app.css sie ebenfalls damit
   * setzt - sonst gewinnt die Grundregel trotz geringerer Genauigkeit.
   * Sie stehen NICHT in einer Zustandsliste mit :hover; von dort verloeren
   * sie in dem Augenblick, in dem der Finger den Reiter beruehrt (6.55.2).
   * ------------------------------------------------------------- */
  .pc-leaderboard-card .pc-tabs {
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
  }

  .pc-leaderboard-card .pc-tab-btn {
    flex: 0 0 auto;
    white-space: nowrap;
    font-size: 12px !important;
    letter-spacing: 0.8px !important;
  }

  .pc-leaderboard-card::before,
  .pc-leaderboard-card::after {
    display: none !important;
  }

  .pc-leaderboard-list li {
    flex-wrap: wrap;
    gap: 8px;
  }

  .stat-grid-row {
    /* Einzug vom Rangzeichen abziehen, sonst ragt die Zeile nach rechts
       heraus und die letzte Angabe bricht nicht um. */
    width: calc(100% - 42px);
    max-width: calc(100% - 42px);
    box-sizing: border-box;
    order: 3;
    margin-top: 4px;
    margin-left: 42px;
    gap: 6px 16px;
    flex-wrap: wrap;
  }

  .stat-grid-row > span {
    white-space: nowrap;
  }

  .player-score {
    flex-grow: 1;
  }

  /* ---------------------------------------------------------------
   * DIE BEIDEN ARCADE-LISTEN ORDNEN IHRE ZEILE ANDERS
   *
   * Robert hat die Form am 17.08.2026 Zelle fuer Zelle vorgegeben:
   *
   *   Top 100 Roulette          Top 100 Bird Extreme
   *   Einsatz: ***  Feld: ***   Roehren: 7
   *   Roll: ***  Gewinn: +***   Gewinn: +1.400
   *
   * Also ZWEI Spalten beim Roulette und EINE bei Bird, und der Wert
   * gehoert in beiden Faellen als beschriftete Zelle zu den Angaben.
   *
   * DAS LOEST DIE ANORDNUNG AUS 6.91.0 AB, die den Wert neben den Namen
   * gestellt hatte. Die Regeln von dort sind entfallen; sie haetten den
   * Namen kuerzen lassen fuer einen Wert, der in dieser Fassung gar nicht
   * mehr dort steht.
   *
   * Die Spalte rechts faellt am Telefon weg (.player-score), ihre Zahl
   * steht jetzt in der letzten Zelle. Beide stehen im Markup, sichtbar
   * ist immer genau eine - die Begruendung dafuer steht in
   * leaderboard.js an .pc-lb-wert-mobil.
   *
   * minmax(0, 1fr), nicht 1fr: Ein blosses 1fr heisst minmax(AUTO, 1fr),
   * und die breiteste Angabe schoebe ihre Spalte auf. Stammt aus 6.68.0.
   *
   * SPIELER UND TEAMS BLEIBEN, WIE SIE SIND. Robert hat die beiden
   * Arcade-Listen genannt und nur die. Unterschieden wird ueber
   * data-liste, das renderLeaderboardView() seit 6.91.0 an die Liste
   * haengt: Alle vier Listen gehen durch dieselbe Huelle, ohne die
   * Angabe gaebe es keinen Weg dorthin.
   * ------------------------------------------------------------- */
  /* ALLE VIER LISTEN nehmen die Spalte rechts weg und zeigen dafuer die
     Zelle, die es nur am Telefon gibt. Bis 6.93.0 galt das nur fuer die
     beiden Arcade-Listen; mit 6.94.0 hat Robert dieselbe Form fuer Spieler
     und Teams vorgegeben. */
  .pc-leaderboard-list .player-score {
    display: none;
  }

  .pc-leaderboard-list .pc-lb-wert-mobil {
    display: block;
  }

  /* ZWEI SPALTEN fuer Spieler, Teams und das Roulette:

       Spieler und Teams        Roulette
       Matches:   Winrate:      Einsatz:  Feld:
       Preisgeld: Titel:        Roll:     Gewinn:

     Bird hat nur zwei Angaben und steht deshalb untereinander. */
  #leaderboardMainRenderZone[data-liste="players"] .stat-grid-row,
  #leaderboardMainRenderZone[data-liste="teams"] .stat-grid-row,
  #leaderboardMainRenderZone[data-liste="roulette"] .stat-grid-row {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px 14px;
  }

  #leaderboardMainRenderZone[data-liste="bird"] .stat-grid-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 6px;
  }

  /* Die verdeckte Zeile traegt statt der Angaben einen Satz. Er braucht
     die volle Breite, sonst stuende er in einer halben Spalte. */
  .pc-leaderboard-list .stat-grid-row.is-verborgen {
    display: block;
  }
}

/* ---------- Eigener Stand ---------- */

.pc-board-you {
  width: var(--pc-width);
  max-width: var(--pc-max) !important;
  margin: 0 auto 26px auto !important;
  box-sizing: border-box;
}

.pc-board-you:empty { display: none; }

.pc-board-you.is-in,
.pc-board-you.is-out,
.pc-board-you.is-hidden {
  padding: 14px 16px;
  border-left: 2px solid var(--pc-accent);
  background: rgba(250, 67, 122, 0.06);
}

.pc-board-you.is-out {
  border-left-color: rgba(255, 255, 255, 0.28);
  background: rgba(255, 255, 255, 0.03);
}

/* Eigene Wahl, kein Mangel: deshalb Blau statt der Warnfarbe. */
.pc-board-you.is-hidden {
  border-left-color: var(--pc-info);
  background: rgba(82, 176, 242, 0.06);
}

.pc-board-you.is-hidden .pc-you-label { color: var(--pc-info); }

.pc-you-label {
  display: block;
  font-family: var(--pc-font-page);
  font-size: 10px;
  font-weight: var(--pc-weight-page);
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--pc-accent);
  margin-bottom: 7px;
}

.pc-board-you.is-out .pc-you-label { color: var(--pc-muted); }

.pc-you-rank {
  display: block;
  font-family: "droid-sans-mono", monospace;
  font-size: clamp(20px, 3vw, 27px);
  color: var(--pc-text);
  letter-spacing: -0.5px;
  margin-bottom: 6px;
}

.pc-you-text {
  font-family: var(--pc-font-page);
  font-size: 13px;
  font-weight: var(--pc-weight-page);
  line-height: 1.6;
  color: var(--pc-muted) !important;
  margin: 0 !important;
  max-width: 620px;
}

.pc-you-text strong { color: var(--pc-text); font-weight: var(--pc-weight-page); }

.pc-you-link {
  display: inline-block;
  margin-top: 12px;
  font-family: var(--pc-font-page);
  font-size: 11.5px;
  font-weight: var(--pc-weight-page);
  letter-spacing: 1.4px;
  text-transform: uppercase;
  color: var(--pc-text) !important;
  text-decoration: none !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.45);
  padding-bottom: 2px;
  transition: opacity 0.2s ease, border-color 0.2s ease;
}

.pc-you-link:hover { opacity: 0.65; border-bottom-color: var(--pc-accent); }

/* ---------- Podest und eigene Zeile ---------- */

.pc-leaderboard-list li.is-podium .rank-label {
  color: var(--pc-gold);
}

.pc-leaderboard-list li.is-me {
  background: rgba(250, 67, 122, 0.07) !important;
  box-shadow: inset 2px 0 0 var(--pc-accent);
  padding-left: 12px;
  margin-left: -12px;
}

.pc-you-tag {
  display: inline-block;
  margin-left: 10px;
  font-size: 9.5px;
  font-weight: var(--pc-weight-page);
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: var(--pc-accent);
  vertical-align: middle;
}

@media (max-width: 1100px) {
  .pc-board-you { width: 88%; }
}

@media (max-width: 768px) {
  /* Keine !important-Ränder hier: Die Regel darunter will den Kasten
     einrücken wie die übrigen Bereiche und käme sonst nicht dagegen an.
     Genau das machte ihn breiter als alles andere. */
  .pc-board-you {
    width: 100%;
  }
  .pc-board-you.is-in,
  .pc-board-you.is-out {
    margin: 0 var(--pc-edge) 20px var(--pc-edge) !important;
    width: auto;
  }
  .pc-leaderboard-list li.is-me { padding-left: 10px; margin-left: -10px; }
}

/* Auf dem Rechner ein Raster mit festen Spalten statt einer Flex-Zeile.
 *
 * Mit Flex haengt die Lage jeder Angabe an der Laenge des Teamnamens davor:
 * Gemessen stand "Kapitän:" bei einem kurzen Namen bei 143 Pixeln, bei einem
 * langen weiter rechts. Ueber mehrere Zeilen sah das ungeordnet aus, und
 * genau das hat Robert gemeldet.
 *
 * Mit dem Raster fluchten Name, Kapitaen und die Zahl ueber alle Zeilen, und
 * die Zeile nutzt die ganze Breite: Die beiden ersten Spalten teilen sich
 * den Platz, die dritte ist so breit wie ihr Inhalt.
 *
 * minmax(0, ...) muss sein: Ohne das laesst sich eine Rasterspalte nicht
 * unter ihren Inhalt verkleinern, und ein langer Teamname wuerde die Zeile
 * ueber den rechten Rand schieben. */
/* Die Liste steht seit 6.66.0 in beiden Abfragen mit dabei. Ohne das bliebe
   sie bei 70 Prozent, waehrend Titel und Fuss darueber und darunter auf 88
   beziehungsweise 100 Prozent gehen; die drei liefen dann genau auf
   schmalen Geraeten wieder auseinander. */
/* ---------- Sehr schmale Geräte ---------- */

@media (max-width: 420px) {
  .stat-grid-row {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    gap: 5px 14px !important;
    font-size: 12.5px;
  }

  .pc-leaderboard-list li {
    gap: 6px !important;
  }

  .player-name {
    min-width: 0;
    overflow-wrap: anywhere;
  }
}

/* Das Teamverzeichnis unter der Rangliste ist mit 6.91.0 ersatzlos
   entfallen, samt seinen Regeln: .pc-teamdir-* und .pc-dir-*. Robert
   wollte den Block weg; der Weg zur Team-Seite steht im Menue der
   Kopfleiste. Die drei Funktionen dahinter sind in leaderboard.js
   mit weggefallen. */