body{transition:background-color 0.3s ease}.color-selector{text-align:center;margin:20px 0}.color-selector input[type="radio"]{display:none}.color-selector .color-btn{display:inline-block;width:30px;height:30px;border-radius:50%;border:2px solid #ccc;cursor:pointer;margin:0 5px;transition:transform 0.2s,box-shadow 0.2s}.color-selector .color-btn:hover{transform:scale(1.1);box-shadow:0 4px 8px rgba(0,0,0,0.2)}#color-white:checked~.color-selector{background-color:#ffffff}#color-black:checked~.color-selector{background-color:#000000}#color-yellow:checked~.color-selector{background-color:#ffff00}#color-cyan:checked~.color-selector{background-color:#00ffff}#color-magenta:checked~.color-selector{background-color:#ff00ff}#color-green:checked~.color-selector{background-color:#00ff00}#color-gray:checked~.color-selector{background-color:#808080}#color-brown:checked~.color-selector{background-color:#8B4513}#color-white:checked~body{background-color:#ffffff}#color-black:checked~body{background-color:#000000}#color-yellow:checked~body{background-color:#ffff00}#color-cyan:checked~body{background-color:#00ffff}#color-magenta:checked~body{background-color:#ff00ff}#color-green:checked~body{background-color:#00ff00}#color-gray:checked~body{background-color:#808080}#color-brown:checked~body{background-color:#8B4513}