@media (max-width: 1200px) {
    .sidebar {
        width: 60%;
        grid-template-columns: 1fr;
    }
    
    .main {
        width: 40%;
    }
}

@media (max-width: 900px) {
    body {
        flex-direction: column;
    }
    
    .sidebar, .main {
        width: 100%;
        height: 50%;
    }
    
    .sidebar {
        max-height: 50vh;
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-height: 700px) {
    .sidebar {
        padding: 15px;
    }
    
    .node-card {
        padding: 15px;
    }
    
    header {
        padding: 20px 20px 10px;
    }
    
    h1 {
        font-size: 2rem;
    }
}