/* 大屏幕布局 */
@media (max-width: 1400px) {
    .app-container {
        grid-template-columns: 250px 1fr 300px;
    }
}

/* 中等屏幕布局 */
@media (max-width: 1200px) {
    .app-container {
        grid-template-columns: 220px 1fr 280px;
    }
}

/* 平板布局 */
@media (max-width: 992px) {
    .app-container {
        grid-template-columns: 200px 1fr 0;
        grid-template-rows: auto 1fr auto;
    }
    
    .persistent-panel {
        grid-row: 3;
        grid-column: 1 / 4;
        height: 300px;
    }

    .content-panel-container {
        flex-direction: column;
    }
    
    .persistent-panel {
        width: 100%;
        height: 300px;
        min-height: 200px;
        border-left: none;
        border-top: 1px solid var(--color-border);
    }
    
    .panel-resizer {
        left: 0;
        top: -5px;
        width: 100%;
        height: 10px;
        cursor: row-resize;
    }
    
    .panel-resizer::after {
        left: 50%;
        top: 4px;
        height: 2px;
        width: 40px;
        transform: translateX(-50%);
    }
}

/* 移动端布局 */
@media (max-width: 768px) {
    .app-container {
        grid-template-columns: 0 1fr 0;
    }
    
    .sidebar {
        display: none;
    }

    .workflow-title {
        display: none;
    }
    
    .step-item {
        min-width: 150px;
        padding: 10px 10px 10px 30px;
    }
}