/* ---------- Diagramme ---------- */
:root{ --c1:#2a78d6; --c2:#eb6834; --c3:#1baf7a; --c4:#eda100; --c5:#e87ba4; --c6:#008300; --c7:#6250d6; --c8:#e34948; --c-other:#9a9aa1; --grid:#ececf1; }
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]){ --c1:#3987e5; --c2:#d95926; --c3:#199e70; --c4:#c98500; --c5:#d55181; --c6:#008300; --c7:#9085e9; --c8:#e66767; --c-other:#6e6e75; --grid:#2c2c2e; } }
:root[data-theme="dark"]{ --c1:#3987e5; --c2:#d95926; --c3:#199e70; --c4:#c98500; --c5:#d55181; --c6:#008300; --c7:#9085e9; --c8:#e66767; --c-other:#6e6e75; --grid:#2c2c2e; }
.vz{display:grid;gap:24px;grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr))}
.vz>.panel{display:grid;gap:14px;align-content:start}
.vz .wide{grid-column:1/-1}
.vz h3{margin:0}
.vz-sub{font-size:.84rem;color:var(--muted);margin-top:-8px}
.donut-wrap{display:flex;flex-wrap:wrap;align-items:center;gap:18px 24px}
.donut-wrap svg{flex:none;width:180px;height:180px}
.donut-c1{font-size:11px;fill:var(--muted);font-weight:500}
.donut-c2{font-size:17px;fill:var(--ink);font-weight:700;font-variant-numeric:tabular-nums}
.lg{display:grid;gap:7px;flex:1 1 180px;min-width:0;font-size:.86rem;margin:0;padding:0;list-style:none}
.lg li{display:grid;grid-template-columns:12px minmax(0,1fr) auto auto;gap:8px;align-items:center}
.lg i{width:12px;height:12px;border-radius:3px}
.lg .l{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lg .v{font-variant-numeric:tabular-nums;font-weight:600}
.lg .p{font-variant-numeric:tabular-nums;color:var(--muted);min-width:2.8em;text-align:right}
.hb{display:grid;gap:10px}
.hb-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 10px;font-size:.86rem}
.hb-row .l{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hb-row .v{font-variant-numeric:tabular-nums;font-weight:600;text-align:right}
.hb-track{grid-column:1/-1;height:10px;border-radius:5px;background:var(--sunk);position:relative;overflow:hidden}
.hb-fill{position:absolute;left:0;top:0;bottom:0;border-radius:5px}
.hb-plan{position:absolute;top:-3px;bottom:-3px;width:2px;background:var(--ink);opacity:.55;border-radius:1px}
.hb-over{position:absolute;top:0;bottom:0;background:var(--crit);border-radius:0 5px 5px 0}
.hb-note{font-size:.76rem;color:var(--crit);font-weight:600}
.ln svg{display:block;width:100%;overflow:visible}
.ln .ax{font-size:11px;fill:var(--muted);font-variant-numeric:tabular-nums}
.ln .gl{stroke:var(--grid);stroke-width:1}
.ln .cross{stroke:var(--muted);stroke-width:1;stroke-dasharray:3 3}
.vz-legend{display:flex;flex-wrap:wrap;gap:6px 16px;font-size:.84rem;color:var(--muted)}
.vz-legend span{display:inline-flex;align-items:center;gap:6px}
.vz-legend i{width:12px;height:12px;border-radius:3px}
.vz-empty{color:var(--muted);font-size:.9rem}
.vz-tip{position:fixed;z-index:60;pointer-events:none;background:var(--surface);color:var(--ink);border-radius:10px;padding:8px 11px;font-size:.82rem;line-height:1.35;box-shadow:0 8px 28px rgba(0,0,0,.18),0 0 0 .5px var(--line);max-width:240px}
.vz-tip b{font-variant-numeric:tabular-nums}
.vz-tip .m{color:var(--muted)}
[data-tip]{cursor:default}
.tier-Kritisch{background:var(--crit)} .tier-Hoch{background:var(--high)} .tier-Mittel{background:var(--mid)} .tier-Niedrig{background:var(--low)}