.color-0 { background-color: gold; color: black; }
.color-1 { background-color: #c3ecff; color: black; } /* Sky blue */
.color-2 { background-color: #d9b3ff; color: black; } /* Lilac */
.color-3 { background-color: #ff9933; color: black; } /* Orange */
.color-4 { background-color: #d0ffbd; color: black; } /* Pastel green */
.color-5 { background-color: #ffffff; color: black; } /* White */
.color-6 { background-color: #00ffff; color: black; } /* Cyan */
.color-7 { background-color: #ff66ff; color: black; } /* Magenta */
.color-8 { background-color: #e8e8e8; color: black; } /* Light gray */
.color-9 { background-color: yellow; color: black; }
.color-10 { background-color: #ffe4e1; color: black; } /* Pastel pink */
.color-20 { background-color: red; color: black; }
.color-21 { background-color: #6495ed; color: white; } /* Blue */
.color-22 { background-color: saddlebrown; color: white; }
.color-23 { background-color: #0000ff; color: white; } /* Dark blue */
.color-24 { background-color: rebeccapurple; color: white; }
.color-25 { background-color: dimgrey; color: white; }
.color-26 { background-color: black; color: white; }
.color-27 { background-color: #008080; color: white; } /* Turquoise */
.color-28 { background-color: #6b8e23; color: white; } /* Khaki */