body {
            font-family: 'Inter', sans-serif;
            transition: background-color 0.3s ease, color 0.3s ease;
        }

        /* Dark Theme (Default) */
        html.dark body {
            background-color: #0f172a; /* slate-900 */
            color: #cbd5e1; /* slate-300 */
        }
        
        /* Light Theme */
        html.light body {
            background-color: #f1f5f9; /* slate-100 */
            color: #334155; /* slate-700 */
        }

        .table-scrollbar::-webkit-scrollbar { height: 8px; }
        .table-scrollbar::-webkit-scrollbar-track { background: var(--scrollbar-track); }
        .table-scrollbar::-webkit-scrollbar-thumb { background: var(--scrollbar-thumb); border-radius: 4px; }
        .table-scrollbar::-webkit-scrollbar-thumb:hover { background: var(--scrollbar-thumb-hover); }

        html.dark {
            --scrollbar-track: #1e293b;
            --scrollbar-thumb: #475569;
            --scrollbar-thumb-hover: #64748b;
        }
        html.light {
            --scrollbar-track: #e2e8f0;
            --scrollbar-thumb: #94a3b8;
            --scrollbar-thumb-hover: #64748b;
        }

        .score-3 { background-color: #10b981; color: white; } /* Emerald-500 */
        .score-2 { background-color: #3b82f6; color: white; } /* Blue-500 */
        .score-1 { background-color: #8b5cf6; color: white; } /* Violet-500 */
        .score-0 { background-color: #64748b; color: white; } /* Slate-500 */
        html.light .score-0 { background-color: #cbd5e1; color: #475569; } /* Slate-300 */

        input[type="range"]::-webkit-slider-thumb {
            -webkit-appearance: none;
            appearance: none;
            width: 20px;
            height: 20px;
            background: #3b82f6; /* blue-500 */
            cursor: pointer;
            border-radius: 50%;
            border: 2px solid white;
            margin-top: -8px;
        }

        html.dark input[type="range"]::-webkit-slider-thumb {
            background: #60a5fa; /* blue-400 */
             border: 2px solid #1e293b; /* slate-800 */
        }
        
        input[type="range"]::-webkit-slider-runnable-track {
            height: 4px;
            border-radius: 2px;
        }