.filter-panel, .panel { background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius-md); box-shadow: var(--shadow-sm); }
.filter-panel { margin-top: var(--space-xl); padding: var(--space-lg); }
.section-heading { align-items: end; display: flex; gap: var(--space-lg); justify-content: space-between; }
.section-heading > p { color: var(--color-muted); font-size: 0.8125rem; }
.section-heading h2 { margin-top: 0.15rem; }
.section-heading--compact { border-bottom: 1px solid var(--color-border); padding: var(--space-lg); }
.filter-form { align-items: end; display: grid; gap: var(--space-md); grid-template-columns: repeat(3, minmax(9rem, 1fr)) auto; margin-top: var(--space-lg); }
.filter-actions { display: flex; gap: var(--space-sm); }
.indicator-grid { display: grid; gap: var(--space-md); grid-template-columns: repeat(3, 1fr); margin-top: var(--space-lg); }
.indicator-card { align-items: center; background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius-md); display: flex; gap: var(--space-md); min-height: 6.5rem; padding: var(--space-lg); }
.indicator-card__icon { background: var(--color-primary-dark); flex: 0 0 auto; height: 2.75rem; width: 2.75rem; }
.indicator-card p { color: var(--color-muted); font-size: 0.75rem; }
.indicator-card strong { color: var(--color-primary-dark); display: block; font-size: 1.5rem; margin-top: 0.15rem; }
.panel { min-width: 0; overflow: hidden; }
.chart-container { min-height: 22rem; padding: var(--space-lg); }
.chart-container svg { height: auto; width: 100%; }
.chart-empty, .table-empty, .table-error { color: var(--color-muted); padding: 4rem var(--space-lg); text-align: center; }
.table-error { color: var(--color-danger); }
.table-wrap { overflow-x: auto; }
.data-table { min-width: 42rem; width: 100%; }
.data-table caption { clip: rect(0, 0, 0, 0); height: 1px; overflow: hidden; position: absolute; width: 1px; }
.data-table th { background: var(--color-primary); color: #fff; font-size: 0.75rem; letter-spacing: 0.02em; padding: 0; text-align: left; }
.data-table th[data-align="right"], .data-table td[data-align="right"] { text-align: right; }
.sort-button { align-items: center; background: transparent; border: 0; color: inherit; display: flex; font-weight: 700; gap: var(--space-xs); justify-content: space-between; min-height: 3rem; padding: 0.75rem 1rem; text-align: inherit; width: 100%; }
.data-table td { border-bottom: 1px solid var(--color-border); padding: 0.8rem 1rem; }
.data-table tbody tr:nth-child(even) { background: #f3f7fa; }
.data-table tbody tr:hover { background: #eaf4f9; }
.pagination { align-items: center; border-top: 1px solid var(--color-border); display: flex; justify-content: space-between; padding: var(--space-md) var(--space-lg); }
.pagination p { color: var(--color-muted); font-size: 0.8125rem; }
.pagination__actions { display: flex; gap: var(--space-sm); }
.page-size { align-items: center; display: flex; gap: var(--space-sm); }
.page-size select { min-height: 2.25rem; padding: 0.35rem 1.8rem 0.35rem 0.5rem; }
@media (max-width: 900px) { .filter-form { grid-template-columns: repeat(2, 1fr); } .filter-actions { grid-column: 1 / -1; } }
@media (max-width: 620px) { .indicator-grid { grid-template-columns: 1fr; } .filter-form { grid-template-columns: 1fr; } .section-heading { align-items: start; flex-direction: column; } .report-actions { flex-wrap: wrap; } }