::-webkit-scrollbar {
            width: 6px;
            height: 6px;
        }

        ::-webkit-scrollbar-track {
            background: transparent;
        }

        ::-webkit-scrollbar-thumb {
            background: #cbd5e1;
            border-radius: 3px;
        }

        .sidebar-scroll::-webkit-scrollbar {
            width: 4px;
        }

        .animate-fade-in {
            animation: fadeIn 0.4s ease-out forwards;
        }

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

            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        .quiz-option {
            transition: all 0.2s;
        }

        .quiz-option:hover:not(:disabled) {
            border-color: #3b82f6;
            background-color: #eff6ff;
        }

        .quiz-option.correct {
            border-color: #22c55e;
            background-color: #f0fdf4;
            color: #166534;
        }

        .quiz-option.incorrect {
            border-color: #ef4444;
            background-color: #fef2f2;
            color: #991b1b;
        }

        .typing-dot {
            width: 4px;
            height: 4px;
            border-radius: 50%;
            background: currentColor;
            animation: typing 1s infinite alternate;
        }

        .typing-dot:nth-child(2) {
            animation-delay: 0.2s;
        }

        .typing-dot:nth-child(3) {
            animation-delay: 0.4s;
        }

        @keyframes typing {
            from {
                opacity: 0.3;
                transform: scale(1);
            }

            to {
                opacity: 1;
                transform: scale(1.2);
            }
        }

        .glass-panel {
            background: rgba(255, 255, 255, 0.95);
            backdrop-filter: blur(10px);
        }