body, .bg-slate-900, .bg-slate-800, .bg-slate-700 {
            background: #111 !important;
            color: #f5f5f5 !important;
        }
        .main-content, .course-card, .completed-card, .vercel-card {
            background: #181818 !important;
            color: #f5f5f5 !important;
            border: 1px solid #333 !important;
        }
        h1, h2, h3, h4, h5, h6, .font-bold, .font-medium {
            color: #fff !important;
        }
        .text-slate-400, .text-slate-300, .text-slate-600, .text-slate-700, .text-slate-800, .text-slate-900 {
            color: #bbb !important;
        }
        .rounded-xl, .rounded-lg, .rounded-full {
            border-radius: 1rem !important;
        }
        .vercel-btn, .btn {
            background: #181818 !important;
            color: #fff !important;
            border: 1px solid #fff !important;
            transition: background 0.2s, color 0.2s;
        }
        .vercel-btn:hover, .btn:hover {
            background: #fff !important;
            color: #181818 !important;
        }
        .bg-gradient-to-r, .bg-gradient-to-br {
            background: #181818 !important;
            color: #fff !important;
            border: none !important;
        }
        .star, .fa-star, .fa-book, .fa-play-circle, .fa-clock {
            color: #fff !important;
        }
        .scroll-container::-webkit-scrollbar {
            height: 8px;
            background: #222;
        }
        .scroll-container::-webkit-scrollbar-thumb {
            background: #333;
            border-radius: 4px;
        }
        a, a:visited {
            color: #fff !important;
        }
        a:hover {
            color: #bbb !important;
        }
        input, button {
            color: #fff !important;
            background: #222 !important;
            border: 1px solid #333 !important;
        }
        input:focus {
            outline: 2px solid #fff !important;
        }