.material-symbols-outlined {
            font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
        }
        
        .gradient-bg {
            position: fixed;
            inset: 0;
            pointer-events: none;
            z-index: -10;
        }
        
        html { 
            scroll-padding-top: 6rem; 
        }
        
        .dropdown-content {
            transition: max-height 0.35s cubic-bezier(0.4, 0, 0.2, 1), 
                        opacity 0.25s ease;
            overflow: hidden;
            max-height: 0;
        }
        
        .arrow {
            transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
        }
        
        .arrow.rotate-90 {
            transform: rotate(90deg);
        }

        /* Smooth scrollbar */
        ::-webkit-scrollbar {
            width: 8px;
            height: 8px;
        }
        
        ::-webkit-scrollbar-track {
            background: transparent;
        }
        
        ::-webkit-scrollbar-thumb {
            background: rgba(156, 163, 175, 0.3);
            border-radius: 4px;
        }
        
        ::-webkit-scrollbar-thumb:hover {
            background: rgba(156, 163, 175, 0.5);
        }
        
        .dark ::-webkit-scrollbar-thumb {
            background: rgba(75, 85, 99, 0.3);
        }
        
        .dark ::-webkit-scrollbar-thumb:hover {
            background: rgba(75, 85, 99, 0.5);
        }

        /* Prose code blocks */
        .prose pre {
            background: #f3f4f6;
            border: 1px solid #e5e7eb;
            border-radius: 0.5rem;
            padding: 1rem;
            overflow-x: auto;
        }
        
        .dark .prose pre {
            background: #1f2937;
            border-color: #374151;
        }
        
        .prose code {
            background: #f3f4f6;
            padding: 0.125rem 0.375rem;
            border-radius: 0.25rem;
            font-size: 0.875em;
        }
        
        .dark .prose code {
            background: #1f2937;
        }
        
        .prose pre code {
            background: transparent;
            padding: 0;
        }

        /* Language switcher */
        .language-dropdown {
            min-width: 140px;
        }

        /* Navigation buttons responsive */
        .nav-button-prev {
            order: 1;
        }
        
        .nav-button-next {
            order: 2;
        }
        
        @media (min-width: 640px) {
            .nav-button-prev {
                order: 1;
            }
            
            .nav-button-next {
                order: 2;
            }
        }