.analytics-shell { display: grid; grid-template-columns: 240px 1fr; gap: 1rem; align-items: start; } .analytics-filters label { display: block; margin-bottom: 0.75rem; font-size: 0.85rem; color: #94a3b8; } .analytics-filters select, .analytics-filters input { width: 100%; margin-top: 0.25rem; } .analytics-main { min-width: 0; } .analytics-kpis { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 0.75rem; margin-bottom: 1rem; } .analytics-kpis .kpi-card { padding: 0.75rem 1rem; border-radius: 10px; background: rgba(15, 23, 42, 0.8); border: 1px solid rgba(148, 163, 184, 0.15); } .analytics-kpis .kpi-card strong { display: block; font-size: 1.35rem; color: #e2e8f0; } .analytics-kpis .kpi-card span { font-size: 0.75rem; color: #64748b; } .analytics-charts { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 1rem; margin-bottom: 1.5rem; } .chart-panel canvas { max-height: 220px; } .chart-panel h4 { margin: 0 0 0.75rem; font-size: 0.9rem; color: #cbd5e1; } @media (max-width: 900px) { .analytics-shell { grid-template-columns: 1fr; } }