/* Statistik-Ansicht (Präsentation + Redaktion) */
.kpis { display: grid; gap: 12px; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); margin-bottom: 22px; }
.kpi { padding: 14px 16px; border-radius: 12px; background: #F7F7F5; border: 1px solid #ECEAE4; }
.kpi__v { display: block; font-family: var(--font-display); font-size: 1.75rem; line-height: 1.1; color: var(--tinte); font-variant-numeric: tabular-nums; }
.kpi__l { display: block; margin-top: 4px; font-size: .8125rem; color: #4B5563; }
.charts { display: grid; gap: 22px; grid-template-columns: repeat(auto-fit, minmax(min(100%, 380px), 1fr)); }
.chart h3 { margin: 0 0 4px !important; }
.chart p { margin: 0 0 10px; font-size: .8125rem; color: #4B5563; }
.chart svg { width: 100%; height: auto; overflow: visible; }
.chart svg text { font-family: var(--font-tool); font-size: 11px; fill: #4B5563; }
.hbars { display: grid; gap: 8px; }
.hbar { display: grid; grid-template-columns: 130px 1fr 56px; align-items: center; gap: 10px; font-size: .875rem; }
.hbar__track { height: 14px; border-radius: 4px; background: #EEF0F3; overflow: hidden; }
.hbar__fill { height: 100%; border-radius: 4px; background: var(--blau); }
.hbar__v { text-align: right; font-variant-numeric: tabular-nums; font-weight: 700; }
.demo-live { margin-top: 22px; padding: 14px 18px; border-radius: 12px; background: #EEF4FB; border: 1px solid #D5E3F3; font-size: .9375rem; }
.demo-live h3 { margin: 0 0 6px !important; }
.demo-live ol { margin: 8px 0 0; padding-left: 1.2em; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: .8125rem; max-height: 160px; overflow: auto; }
.fineprint { margin-top: 18px; font-size: .8125rem; color: #4B5563; }
.chart--wide { grid-column: 1 / -1; }
