.wrap { display: flex; flex-direction: column; gap: 1.25rem; max-width: 1200px; } .disclaimer { font-size: 0.85rem; line-height: 1.45; color: var(--text-secondary, #666); padding: 0.75rem 1rem; background: var(--bg-secondary, #f5f5f5); border-radius: 8px; border: 1px solid var(--border-color, #e8e8e8); } .kpiGrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 0.75rem; } .kpiCard { padding: 1rem; border-radius: 8px; background: var(--bg-primary, #fff); border: 1px solid var(--border-color, #e0e0e0); box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04); } .kpiValue { font-size: 1.5rem; font-weight: 700; color: var(--text-primary, #1a1a1a); margin: 0 0 0.25rem; } .kpiLabel { font-size: 0.8rem; color: var(--text-secondary, #666); margin: 0; line-height: 1.3; } .chartBlock { padding: 1rem; border-radius: 8px; background: var(--bg-primary, #fff); border: 1px solid var(--border-color, #e0e0e0); min-height: 280px; } .chartTitle { font-size: 0.95rem; font-weight: 600; margin: 0 0 0.75rem; color: var(--text-primary, #1a1a1a); } .row2 { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; } @media (max-width: 900px) { .row2 { grid-template-columns: 1fr; } } .meta { font-size: 0.75rem; color: var(--text-secondary, #888); margin-top: 0.5rem; } .error { color: #c62828; padding: 1rem; } .recentTable { width: 100%; border-collapse: collapse; font-size: 0.85rem; } .recentTable th { text-align: left; font-weight: 600; color: var(--text-secondary, #666); padding: 0.5rem 0.75rem; border-bottom: 2px solid var(--border-color, #e0e0e0); white-space: nowrap; } .recentTable td { padding: 0.45rem 0.75rem; border-bottom: 1px solid var(--border-color, #f0f0f0); color: var(--text-primary, #1a1a1a); } .recentTable tbody tr:hover { background: var(--bg-secondary, #fafafa); }