.mesh-chart-legend { display: flex; flex-wrap: wrap; gap: 10px 22px; margin: -6px 0 14px; color: var(--mesh-muted); font-size: .9rem; }
.mesh-chart-legend span { display: inline-flex; align-items: center; gap: 8px; }
.mesh-chart-legend i { width: 28px; height: 4px; border-radius: 3px; background: var(--mesh-blue); }
.mesh-chart-legend i.average { background: var(--mesh-orange); }
.mesh-chart-legend i.maximum { height: 0; border-top: 3px dashed var(--mesh-orange); background: transparent; border-radius: 0; }
.mesh-comparison-chart .mesh-total-line { stroke: var(--mesh-blue); }
.mesh-comparison-chart .mesh-average-line { stroke: var(--mesh-orange); }
.mesh-comparison-chart .mesh-maximum-line { stroke: var(--mesh-orange); stroke-width: 2; stroke-dasharray: 8 7; opacity: .75; }
.mesh-comparison-summary { display: flex; flex-wrap: wrap; gap: 10px 28px; margin-top: 16px; color: var(--mesh-muted); }
.mesh-comparison-summary strong { color: var(--mesh-ink); }
@media (max-width: 560px) { .mesh-chart-legend { display: grid; } }


.mesh-comparison-chart text.mesh-axis-left { fill: var(--mesh-blue); font-weight: 700; }
.mesh-comparison-chart text.mesh-axis-right { fill: var(--mesh-orange); font-weight: 700; }
.mesh-comparison-chart .mesh-axis-marker { fill: none; stroke-width: 4; stroke-linecap: round; }
.mesh-comparison-chart .mesh-axis-marker-left { stroke: var(--mesh-blue); }
.mesh-comparison-chart .mesh-axis-marker-right { stroke: var(--mesh-orange); }

/* Vergleich der Messmethoden ab 07.09.2026 */
.mesh-method-legend i.activity-legacy,
.mesh-growth-method-legend i.legacy-average {
    background: #aebbc4;
    opacity: .9;
}
.mesh-method-legend i.activity-reliable { background: var(--mesh-blue); }
.mesh-growth-method-legend i.legacy-maximum {
    height: 0;
    border-top: 3px dashed #c7a383;
    background: transparent;
    border-radius: 0;
}
.mesh-activity-legacy-line {
    stroke: #aebbc4;
    stroke-width: 3;
    stroke-dasharray: 8 7;
}
.mesh-activity-reliable-line { stroke: var(--mesh-blue); stroke-width: 4; }
.mesh-activity-legacy-point { fill: #aebbc4; stroke: #fff; stroke-width: 1.5; }
.mesh-method-weekdays { display: grid; gap: 15px; }
.mesh-method-weekday-row {
    display: grid;
    grid-template-columns: 48px minmax(160px, 1fr) 190px;
    gap: 14px;
    align-items: center;
}
.mesh-method-tracks { display: grid; gap: 5px; }
.mesh-method-tracks > div {
    height: 9px;
    overflow: hidden;
    border-radius: 6px;
    background: var(--mesh-line);
}
.mesh-method-tracks i { display: block; height: 100%; border-radius: inherit; }
.mesh-method-tracks .legacy i { background: #aebbc4; }
.mesh-method-tracks .reliable i { background: var(--mesh-blue); }
.mesh-method-values { display: grid; gap: 2px; font-size: .88rem; }
.mesh-method-values span { color: var(--mesh-muted); }
.mesh-method-values strong { color: var(--mesh-blue-dark); }
.mesh-comparison-chart .mesh-legacy-average-line {
    stroke: #e3af83;
    stroke-width: 3;
    opacity: .65;
}
.mesh-comparison-chart .mesh-legacy-maximum-line {
    stroke: #d7a077;
    stroke-width: 2;
    stroke-dasharray: 8 7;
    opacity: .55;
}
.mesh-comparison-chart .mesh-reliable-average-point {
    fill: var(--mesh-orange);
    stroke: #fff;
    stroke-width: 2;
}
.mesh-comparison-chart .mesh-reliable-maximum-point {
    fill: #fff;
    stroke: var(--mesh-orange);
    stroke-width: 2;
}
@media (max-width: 620px) {
    .mesh-method-weekday-row { grid-template-columns: 38px minmax(120px, 1fr); }
    .mesh-method-values { grid-column: 2; grid-row: 2; grid-template-columns: 1fr 1fr; }
}