@media (max-width: 980px) {
    .shop-layout,
    .split-layout,
    .detail-grid,
    .stat-grid,
    .ops-kpi-grid,
    .dispatch-grid,
    .workflow-board {
        grid-template-columns: 1fr;
    }

    .checkout-panel {
        position: static;
    }

    .quick-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 720px) {
    .topbar {
        position: static;
        align-items: flex-start;
        flex-direction: column;
    }

    .topnav {
        justify-content: flex-start;
    }

    .topnav a,
    .ghost {
        min-height: 34px;
        padding: 7px 10px;
        font-size: .92rem;
    }

    .product-grid {
        grid-template-columns: 1fr;
    }

    .section-head {
        align-items: flex-start;
        flex-direction: column;
    }

    .filter-row,
    .filter-row input {
        width: 100%;
    }

    .dispatch-head,
    .dispatch-card-head {
        flex-direction: column;
    }

    .dispatch-stats {
        grid-template-columns: 1fr;
    }

    .shipper-card-grid,
    .shipper-actions,
    .shipper-result-form,
    .shipper-card-head {
        grid-template-columns: 1fr;
    }

    .two-col-fields {
        grid-template-columns: 1fr;
    }

    .center-panel {
        margin: 4vh auto;
        padding: 24px;
    }

    .modal-backdrop {
        align-items: stretch;
        padding: 0;
    }

    .modal-shell {
        max-height: 100vh;
        height: 100vh;
        border-radius: 0;
    }

    .quick-hero,
    .quick-facts,
    .quick-items > div {
        grid-template-columns: 1fr;
    }
}