.report-filters { display: flex; flex-wrap: wrap; align-items: end; gap: 12px; margin: 0 0 20px; padding: 14px; border: 1px solid var(--border-default); border-radius: var(--r-lg); background: var(--surface-1); }
.report-filters label { display: grid; gap: 6px; min-width: 150px; color: var(--text-muted); font-size: var(--fs-meta); font-weight: var(--fw-medium); }
.report-filters select, .report-filters input { min-height: var(--avatar-md); padding: 8px 10px; border: 1px solid var(--border-default); border-radius: var(--r-md); background: var(--surface-1); color: var(--text-primary); font: inherit; }
.reports-layout { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.report-card { padding: 18px; border: 1px solid var(--border-default); border-radius: var(--r-lg); background: var(--surface-1); box-shadow: var(--shadow-1); }
.report-card h2 { margin: 0 0 14px; font-size: var(--fs-title); }
.report-metrics { display: grid; grid-template-columns: repeat(auto-fit, minmax(125px, 1fr)); gap: 10px; }
.report-metric { display: grid; gap: 3px; min-height: calc(var(--row-h) * 1.5); align-content: center; padding: 12px; border-radius: var(--r-lg); background: var(--surface-2); }
.report-metric strong { font-size: var(--fs-screen); line-height: 1.1; }
.report-metric span { color: var(--text-primary); font-size: var(--fs-body); }
.report-metric small { color: var(--text-muted); font-size: var(--fs-meta); }
.report-ranking { margin: 14px 0 0; padding: 0; list-style: none; }
.report-ranking li { display: flex; justify-content: space-between; gap: 12px; padding: 8px 2px; border-top: 1px solid var(--border-default); font-size: var(--fs-body); }
@media (max-width: 800px) { .reports-layout { grid-template-columns: 1fr; } .report-filters label { flex: 1 1 140px; } }

.report-test-note { margin: 0 0 14px; color: var(--text-muted); font-size: var(--fs-body); }