.char-btn.active {
    background-color: #3b82f6;
    color: white;
    border-color: #60a5fa;
    box-shadow: 0 0 10px rgba(59, 130, 246, 0.3);
}

.tool-btn { 
    transition: all 0.2s; 
}

.tool-btn.active { 
    background-color: #3b82f6; 
    color: white; 
}

.tool-btn:hover:not(.active) { 
    background-color: #334155; 
}

input[type=range] { 
    -webkit-appearance: none; 
    background: transparent; 
}

input[type=range]::-webkit-slider-thumb {
    -webkit-appearance: none; 
    height: 16px; 
    width: 16px; 
    border-radius: 50%;
    background: #3b82f6; 
    cursor: pointer; 
    margin-top: -6px; 
}

input[type=range]::-webkit-slider-runnable-track {
    width: 100%; 
    height: 4px; 
    cursor: pointer; 
    background: #334155; 
    border-radius: 2px;
}