body { background-color: #121212; color: #e0e0e0; }
.checkerboard {
    background-image: 
        linear-gradient(45deg, #2a2a2a 25%, transparent 25%, transparent 75%, #2a2a2a 75%, #2a2a2a),
        linear-gradient(45deg, #2a2a2a 25%, transparent 25%, transparent 75%, #2a2a2a 75%, #2a2a2a);
    background-size: 20px 20px;
    background-position: 0 0, 10px 10px;
}
input[type="number"], input[type="text"], select, input[type="color"] {
    background-color: #2d2d2d; border: 1px solid #444; color: #fff;
    border-radius: 0.375rem; padding: 0.25rem 0.5rem; width: 100%;
}
input[type="number"]:focus, input[type="text"]:focus, select:focus {
    outline: none; border-color: #00ffff;
}
.control-group {
    background-color: #1e1e1e; padding: 1rem; border-radius: 0.5rem;
    margin-bottom: 1rem; border: 1px solid #333;
}
.btn {
    background-color: #00ffff; color: #000; font-weight: bold;
    padding: 0.5rem 1rem; border-radius: 0.375rem; cursor: pointer; transition: all 0.2s;
}
.btn:hover { background-color: #00cccc; }
.btn:disabled { background-color: #555; color: #888; cursor: not-allowed; }