.finance-metrics {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 16px;
    margin-bottom: 24px;
}

.finance-metrics.compact {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.metric-card.highlight {
    background: linear-gradient(135deg, var(--silc-navy), var(--silc-navy-2));
    color: white;
}

.metric-card.highlight span,
.metric-card.highlight small,
.metric-card.highlight strong {
    color: white;
}

.finance-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 22px;
    align-items: start;
    margin-bottom: 24px;
}

.expenses-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 420px;
    gap: 22px;
    align-items: start;
}

.expenses-main {
    min-width: 0;
    display: grid;
    gap: 18px;
}

.expense-category-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}

.expense-category-card {
    border: 1px solid var(--silc-border);
    background: #fffaf2;
    border-radius: 14px;
    padding: 16px;
}

.expense-category-card span,
.expense-category-card strong,
.expense-category-card small {
    display: block;
}

.expense-category-card span {
    color: var(--silc-muted);
    font-weight: 800;
}

.expense-category-card strong {
    color: var(--silc-navy);
    font-size: 24px;
    margin: 8px 0;
}

.expense-category-card small {
    color: var(--silc-muted);
}

.pill-cancelled {
    background: #fdecea;
    color: #9d231b;
}

@media (max-width: 1450px) {
    .finance-metrics {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .expense-category-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 1200px) {
    .finance-grid,
    .expenses-layout {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 760px) {
    .finance-metrics,
    .finance-metrics.compact,
    .expense-category-grid {
        grid-template-columns: 1fr;
    }
}