/* Keep a fixed square icon aligned beside each complete statistic. */
.metric-grid > div {
    align-items: center;
    display: grid;
    gap: 16px;
    grid-template-columns: 56px minmax(0, 1fr);
}

.metric-grid .metric-icon {
    width: 56px;
    height: 56px;
    grid-column: 1;
    flex: none;
    margin-top: 0;
}

.metric-grid > div > div {
    grid-column: 2;
    width: auto;
}

@media (max-width: 800px) {
    .metric-grid > div {
        gap: 10px;
        grid-template-columns: 42px minmax(0, 1fr);
    }

    .metric-grid .metric-icon {
        width: 42px;
        height: 42px;
    }
}