:root {
        --primary-blue: #5e7c9b;
        --bg-light: #f8f9fa;
        --sidebar-width: 280px;
        --text-dark: #3c3c3d;
        --glass: rgba(255, 255, 255, 0.85);
        --player-height: 92px;
    }

    body {
        margin: 0;
        font-family: 'Inter', sans-serif;
        background-color: var(--bg-light);
        color: var(--text-dark);
        overflow-x: hidden;
    }

    .explore-container {
        display: flex;
        margin-top: 100px;
        height: calc(100vh - 100px);
    }

    .culture-main-content {
        flex: 1;
        margin-left: calc(var(--sidebar-width) + 70px);
        padding: 3rem;
        padding-bottom: calc(var(--player-height) + 2rem);
        overflow-y: auto;
    }

    .explore-container.sidebar-collapsed .culture-main-content {
        margin-left: 115px;
        padding: 3rem;
        padding-bottom: calc(var(--player-height) + 2rem);
    }

    .explore-container.sidebar-collapsed #lessons,
    .explore-container.sidebar-collapsed #dictionary,
    .explore-container.sidebar-collapsed #bot,
    .explore-container.sidebar-collapsed #music,
    .explore-container.sidebar-collapsed #history {
        max-width: 1180px;
    }

    .content-section {
        display: none;
        max-width: 1000px;
        margin: 0 auto;
        animation: fadeIn 0.4s ease-out;
    }

    .content-section.active {
        display: block;
    }

    @keyframes fadeIn {
        from { opacity: 0; transform: translateY(10px); }
        to { opacity: 1; transform: translateY(0); }
    }

    @media (max-width: 768px) {
        .culture-main-content,
        .explore-container.sidebar-collapsed .culture-main-content {
            margin-left: 0;
            padding: 72px 1rem 1rem;
            padding-bottom: calc(var(--player-height) + 2.5rem);
        }
        
        .explore-container {
            margin-top: 66px;
            height: calc(100vh - 66px);
        }
    }