/* 响应式设计 */
@media (max-width: 1200px) {
    .app-container {
        grid-template-columns: 280px 1fr;
        grid-template-rows: 1fr 1fr;
    }
    
    .right-panel {
        grid-column: 1 / -1;
        grid-row: 2;
    }
}

@media (max-width: 768px) {
    .app-container {
        grid-template-columns: 1fr;
        grid-template-rows: auto 1fr auto;
        gap: 15px;
        padding: 15px;
    }
    
    .left-panel, .middle-panel, .right-panel {
        grid-column: 1;
    }
    
    .left-panel { grid-row: 1; }
    .middle-panel { grid-row: 2; }
    .right-panel { grid-row: 3; }
    
    .cover-title {
        font-size: 2.5rem;
    }
    
    .cover-subtitle {
        font-size: 1.2rem;
    }
    
    .cover-features {
        flex-direction: column;
        gap: 20px;
    }
}