/* FPA Chat 0.6.0 – Chat-Statistik (Seite + Leiste über dem Chat). Keine externen Fonts/Bilder. */
.fpa-cs, .fpa-cs-leiste {
  --cs-akzent: #f65002; --cs-akzent-d: #c23f00; --cs-hell: #fff1e8; --cs-kopf: #15191d; --cs-kopf2: #232a32;
  --cs-text: #1d2228; --cs-leise: #5d6873; --cs-rand: #e5e7eb; --cs-grund: #f3f4f6; --cs-gruen: #18ba60;
  --cs-titel: 'K2D', 'Roboto Condensed', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
}
.fpa-cs *, .fpa-cs *::before, .fpa-cs *::after, .fpa-cs-leiste * { box-sizing: border-box; }

/* Leiste über dem Chat */
.fpa-cs-leiste { display: flex; align-items: center; gap: 12px; margin: 0 0 -.6em; padding: 10px 14px; background: #fff; color: var(--cs-text) !important;
  border: 1px solid var(--cs-rand); border-left: 4px solid var(--cs-akzent); border-radius: 12px; text-decoration: none !important;
  box-shadow: 0 1px 3px rgba(0,0,0,.06); font-size: 14px; line-height: 1.35; transition: box-shadow .15s, border-color .15s; }
.fpa-cs-leiste:hover, .fpa-cs-leiste:focus-visible { box-shadow: 0 4px 14px rgba(16,24,32,.12); border-color: var(--cs-akzent); }
.fpa-cs-leiste:focus-visible { outline: 3px solid #ffb27f; outline-offset: 2px; }
.fpa-cs-leiste__icon { flex: 0 0 auto; width: 34px; height: 34px; border-radius: 50%; background: var(--cs-hell); color: var(--cs-akzent); display: grid; place-items: center; }
.fpa-cs-leiste__icon svg { width: 18px; height: 18px; }
.fpa-cs-leiste__zahlen { flex: 1 1 auto; min-width: 0; display: flex; flex-wrap: wrap; gap: 2px 14px; color: var(--cs-leise); }
.fpa-cs-leiste__zahlen b { color: var(--cs-text); font-variant-numeric: tabular-nums; }
.fpa-cs-leiste__top b { color: var(--cs-akzent-d); }
.fpa-cs-leiste__mehr { flex: 0 0 auto; font-weight: 700; color: var(--cs-akzent-d); white-space: nowrap; }
@media (max-width: 600px) {
  .fpa-cs-leiste { flex-wrap: wrap; gap: 8px 10px; }
  .fpa-cs-leiste__zahlen { flex-basis: calc(100% - 46px); }
  .fpa-cs-leiste__top { display: none; }
  .fpa-cs-leiste__mehr { flex-basis: 100%; text-align: right; }
}

/* Seite */
.fpa-cs { margin: 0 0 2em; color: var(--cs-text); font-size: 15px; line-height: 1.45; text-align: left; }
.fpa-cs__kopf { position: relative; padding: 26px 24px 22px; border-radius: 16px; color: #f1f3f5; overflow: hidden;
  background: radial-gradient(circle at 100% 0, rgba(246,80,2,.35), transparent 55%), linear-gradient(180deg, var(--cs-kopf2), var(--cs-kopf));
  border-bottom: 4px solid var(--cs-akzent); box-shadow: 0 12px 32px rgba(16,24,32,.14); }
.fpa-cs__kicker { margin: 0 0 6px !important; font-size: 13px; color: #a9b3bd; display: flex; align-items: center; gap: 8px; text-transform: uppercase; letter-spacing: .06em; }
.fpa-cs__live { width: 8px; height: 8px; border-radius: 50%; background: var(--cs-gruen); flex: 0 0 auto; animation: fpa-cs-puls 2.4s infinite; }
@keyframes fpa-cs-puls { 0% { box-shadow: 0 0 0 0 rgba(24,186,96,.55); } 70% { box-shadow: 0 0 0 7px rgba(24,186,96,0); } 100% { box-shadow: 0 0 0 0 rgba(24,186,96,0); } }
.fpa-cs__riesig { margin: 0 !important; line-height: 1; }
.fpa-cs__riesig b { font-family: var(--cs-titel); font-size: clamp(44px, 9vw, 76px); font-weight: 800; color: #fff; font-variant-numeric: tabular-nums; letter-spacing: -.01em; }
.fpa-cs__seit { margin: 6px 0 14px !important; font-size: 16px; color: #d6dbe0; }
.fpa-cs__chips { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 4px !important; padding: 0 !important; list-style: none !important; }
.fpa-cs__chips li { margin: 0 !important; padding: 6px 12px !important; list-style: none !important; border-radius: 999px; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.16); font-size: 14px; color: #d6dbe0; }
.fpa-cs__chips li::before { content: none !important; }
.fpa-cs__chips b { color: #fff; font-variant-numeric: tabular-nums; }
.fpa-cs__zumchat { position: absolute; top: 22px; right: 22px; padding: 8px 14px; border-radius: 999px; background: var(--cs-akzent); color: #fff !important; font-weight: 700; font-size: 14px; text-decoration: none !important; }
.fpa-cs__zumchat:hover { background: var(--cs-akzent-d); }
@media (max-width: 600px) {
  .fpa-cs__kopf { padding: 20px 16px 18px; }
  .fpa-cs__zumchat { position: static; display: inline-block; margin-top: 12px; }
}

.fpa-cs__raster { columns: 2 300px; column-gap: 16px; margin-top: 16px; }
.fpa-cs__karte { break-inside: avoid; page-break-inside: avoid; display: inline-block; width: 100%; vertical-align: top; margin: 0 0 16px; background: #fff; border: 1px solid var(--cs-rand); border-radius: 12px; box-shadow: 0 1px 3px rgba(0,0,0,.06); padding: 16px 18px; min-width: 0; }
.fpa-cs .fpa-cs__titel { margin: 0 0 4px !important; padding: 0 0 8px !important; border-bottom: 2px solid var(--cs-akzent); font-family: var(--cs-titel); font-size: 18px !important; line-height: 1.25; color: var(--cs-text); text-transform: none; }
.fpa-cs__unter { margin: 6px 0 10px !important; font-size: 12.5px; color: var(--cs-leise); }
.fpa-cs__titel + :not(.fpa-cs__unter) { margin-top: 12px !important; }
.fpa-cs__leer { color: #8a949e; font-size: 14px; margin: 8px 0 !important; }
.fpa-cs__fakt { margin: 12px 0 0 !important; padding: 10px 12px; border-radius: 8px; background: var(--cs-hell); font-size: 13.5px; color: #4a3326; }
.fpa-cs__fakt b { color: var(--cs-akzent-d); }
.fpa-cs__klein { margin: 14px 0 6px !important; font-size: 12px; text-transform: uppercase; letter-spacing: .05em; color: var(--cs-leise); }

/* Kacheln */
.fpa-cs__kacheln { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin: 0 !important; }
.fpa-cs__kacheln div { background: var(--cs-grund); border-radius: 10px; padding: 10px 8px; text-align: center; }
.fpa-cs__kacheln dt { font-size: 12px; color: var(--cs-leise); font-weight: 400; margin: 0; line-height: 1.2; }
.fpa-cs__kacheln dd { margin: 4px 0 0 !important; font-family: var(--cs-titel); font-size: 24px; font-weight: 800; color: var(--cs-akzent); font-variant-numeric: tabular-nums; line-height: 1.1; }

/* Personen / Ranglisten */
.fpa-cs__bild { flex: 0 0 auto; display: inline-flex; }
.fpa-cs__bild img, .fpa-cs__ini { width: 30px !important; height: 30px !important; border-radius: 50%; object-fit: cover; margin: 0 !important; display: inline-flex; align-items: center; justify-content: center; background: var(--cs-akzent); color: #fff; font-weight: 700; font-size: 13px; }
.fpa-cs__bild--gross img, .fpa-cs__bild--gross .fpa-cs__ini { width: 40px !important; height: 40px !important; }
.fpa-cs__name { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 600; }
.fpa-cs__rang, .fpa-cs__personen, .fpa-cs__anteile, .fpa-cs__fakten { list-style: none !important; margin: 0 !important; padding: 0 !important; }
.fpa-cs__rang li, .fpa-cs__personen li, .fpa-cs__anteile li, .fpa-cs__fakten li { list-style: none !important; margin: 0 !important; background: none !important; }
.fpa-cs li::before { content: none !important; display: none !important; }
.fpa-cs__rang li { display: grid; grid-template-columns: 22px 30px minmax(0, 1fr) auto; column-gap: 10px; row-gap: 3px; align-items: center; padding: 7px 0 !important; border-bottom: 1px solid #f1f3f5; }
.fpa-cs__rang li:last-child { border-bottom: 0; }
.fpa-cs__platz { grid-row: 1 / span 2; font-weight: 700; color: var(--cs-leise); font-size: 13px; text-align: center; font-variant-numeric: tabular-nums; }
.fpa-cs__rang li:nth-child(1) .fpa-cs__platz { color: #fff; background: #e0a100; border-radius: 50%; width: 22px; height: 22px; line-height: 22px; }
.fpa-cs__rang li:nth-child(2) .fpa-cs__platz { color: #fff; background: #9aa4ae; border-radius: 50%; width: 22px; height: 22px; line-height: 22px; }
.fpa-cs__rang li:nth-child(3) .fpa-cs__platz { color: #fff; background: #b8763e; border-radius: 50%; width: 22px; height: 22px; line-height: 22px; }
.fpa-cs__rang .fpa-cs__bild { grid-row: 1 / span 2; }
.fpa-cs__rang b { color: var(--cs-akzent-d); font-variant-numeric: tabular-nums; white-space: nowrap; }
.fpa-cs__balken { display: block; height: 4px; border-radius: 2px; background: #f1f3f5; position: relative; overflow: hidden; grid-column: 3 / span 2; }
.fpa-cs__balken::after { content: ''; position: absolute; inset: 0 auto 0 0; width: var(--a, 0%); background: linear-gradient(90deg, var(--cs-akzent), #ff9a5c); border-radius: 2px; }
.fpa-cs__rang--serie li { grid-template-columns: 22px 30px minmax(0, 1fr) auto; }
.fpa-cs__rang--serie .fpa-cs__platz, .fpa-cs__rang--serie .fpa-cs__bild { grid-row: auto; }
.fpa-cs__warn { grid-column: 3 / span 2; font-size: 12px; color: #b26b00; }

.fpa-cs__personen { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 8px; }
.fpa-cs__personen li { display: grid; grid-template-columns: 30px minmax(0, 1fr); column-gap: 8px; align-items: center; padding: 8px !important; border-radius: 10px; background: var(--cs-grund); }
.fpa-cs__personen .fpa-cs__bild { grid-row: 1 / span 2; }
.fpa-cs__personen small { font-size: 11.5px; color: var(--cs-leise); }

.fpa-cs__gross { margin: 0 0 4px !important; display: flex; flex-direction: column; }
.fpa-cs__gross b { font-family: var(--cs-titel); font-size: 26px; color: var(--cs-akzent); line-height: 1.15; }
.fpa-cs__gross span { font-size: 13px; color: var(--cs-leise); }
.fpa-cs__anteile li { display: grid; grid-template-columns: minmax(0, 1fr) auto 3.4em; column-gap: 10px; row-gap: 2px; padding: 4px 0 !important; font-size: 13.5px; }
.fpa-cs__anteile b { font-variant-numeric: tabular-nums; font-weight: 600; }
.fpa-cs__anteile em { font-style: normal; text-align: right; color: var(--cs-leise); font-variant-numeric: tabular-nums; }
.fpa-cs__anteile .fpa-cs__balken { grid-column: 1 / -1; }

.fpa-cs__fakten li { display: flex; gap: 12px; align-items: flex-start; padding: 8px 0 !important; border-bottom: 1px solid #f1f3f5; }
.fpa-cs__fakten li:last-child { border-bottom: 0; }
.fpa-cs__emoji { font-size: 24px; line-height: 1; flex: 0 0 auto; width: 30px; text-align: center; padding-top: 2px; }
.fpa-cs__fakten li > div { min-width: 0; flex: 1 1 auto; }
.fpa-cs__fakten small { display: block; font-size: 12px; color: var(--cs-leise); text-transform: uppercase; letter-spacing: .04em; }
.fpa-cs__fakten p, .fpa-cs__wer { margin: 3px 0 0 !important; display: flex; align-items: center; gap: 8px; min-width: 0; }
.fpa-cs__fakten p b, .fpa-cs__wer b { margin-left: auto; color: var(--cs-akzent-d); white-space: nowrap; font-variant-numeric: tabular-nums; }
.fpa-cs__zitat { margin: 10px 0 0 !important; padding: 10px 12px !important; border: 0 !important; border-left: 3px solid var(--cs-akzent) !important; background: var(--cs-grund) !important; border-radius: 0 8px 8px 0; font-size: 14px !important; font-style: normal !important; color: var(--cs-text) !important; text-align: left !important; overflow-wrap: anywhere; quotes: none; }
.fpa-cs__zitat::before, .fpa-cs__zitat::after { content: none !important; }
.fpa-cs__zitat cite { display: block; margin-top: 6px; font-size: 12px; font-style: normal; color: var(--cs-leise); }

/* Säulen */
.fpa-cs__saeulen { display: flex; align-items: flex-end; gap: 4px; height: 130px; margin: 6px 0 0; padding-bottom: 18px; position: relative; }
.fpa-cs__saeule { flex: 1 1 0; height: 100%; display: flex; flex-direction: column; justify-content: flex-end; align-items: center; position: relative; min-width: 0; }
.fpa-cs__saeule i { display: block; width: 100%; height: var(--h, 2%); border-radius: 4px 4px 0 0; background: linear-gradient(180deg, #ff9a5c, var(--cs-akzent)); }
.fpa-cs__saeule:hover i { background: var(--cs-akzent-d); }
.fpa-cs__saeule em { position: absolute; bottom: -18px; font-style: normal; font-size: 11px; color: var(--cs-leise); white-space: nowrap; }
.fpa-cs__karte--jahre .fpa-cs__saeule em { font-size: 10.5px; }
@media (max-width: 480px) { .fpa-cs__karte--jahre .fpa-cs__saeule:nth-child(even) em { visibility: hidden; } }
.fpa-cs__karte--stunden .fpa-cs__saeulen { gap: 2px; }
.fpa-cs__karte--stunden .fpa-cs__saeule em { visibility: hidden; }
.fpa-cs__karte--stunden .fpa-cs__saeule:nth-child(6n+1) em { visibility: visible; }

.fpa-cs__fuss { margin: 16px 0 0 !important; font-size: 12.5px; color: #8a949e; }

/* Mobil: Inhalt vor der Theme-Seitenleiste (wie Chat-Seite) */
@media (max-width: 767.98px) {
  body.fpa-chat-statistik-seite .bcf-main-content { order: 1 !important; }
  body.fpa-chat-statistik-seite .bcf-sidebar { order: 2 !important; }
}