@media (max-width: 900px) {
    .tool-grid {
        grid-template-columns: 1fr;
    }

    .compression-settings {
        grid-template-columns: 1fr;
    }

    .compression-summary {
        grid-template-columns: 1fr 1fr;
    }

    .size-arrow {
        display: none;
    }

    .saving-block {
        padding-left: 0;
        border-left: 0;
    }
}

@media (max-width: 700px) {

    .tool-grid {
        margin-top: 24px;
    }

    .tool-card {
        min-height: 240px;
        padding: var(--space-6);
    }

    .hero {
        padding: 48px 0;
    }

    .hero h1 {
        font-size: 2.8rem;
    }

    .hero-description {
        font-size: var(--font-size-md);
    }

    .drop-zone {
        min-height: 320px;
        padding: 24px;
    }

    .compression-summary {
        grid-template-columns: 1fr;
    }

    .saving-block {
        padding-top: 18px;
        border-top: 1px solid var(--color-border);
    }

    .compression-result-actions {
        display: block;
    }

    .compression-result-actions .primary-button {
        width: 100%;
    }

    .queue-header {
        align-items: flex-start;
    }

    .file-queue-item {
        grid-template-columns: auto minmax(0, 1fr) auto;
    }

    .file-queue-status {
        grid-column: 2;
    }

    .file-queue-remove {
        grid-column: 3;
        grid-row: 1;
    }

    .image-comparison {
        min-height: 260px;
    }

    .comparison-label {
        top: 12px;
        padding: 6px 10px;
    }

    .comparison-label-original {
        left: 12px;
    }

    .comparison-label-processed {
        right: 12px;
    }
}