.pixel-grid{display:grid;grid-template-columns:repeat(3,3px);grid-template-rows:repeat(3,3px);gap:1px}[data-size=large] .pixel-grid{grid-template-columns:repeat(3,9px);grid-template-rows:repeat(3,9px);gap:2px}.pixel-grid__cell{background-color:var(--pixel-off);box-shadow:none;border-radius:1px;transition:background-color .3s ease-out,box-shadow .3s ease-out}.pixel-grid__cell.is-on{background-color:var(--pixel-on);box-shadow:0 0 3px var(--pixel-glow),0 0 6px var(--pixel-glow)}:root{--pixel-off: oklch(35% .04 195 / .5);--pixel-on: oklch(85% .15 195);--pixel-glow: oklch(75% .18 195 / .8)}.pixel-grid--cyan{--pixel-off: oklch(40% .08 195 / .4);--pixel-on: oklch(90% .2 195);--pixel-glow: oklch(80% .25 195 / .9)}.pixel-grid--magenta{--pixel-off: oklch(40% .08 330 / .4);--pixel-on: oklch(85% .25 330);--pixel-glow: oklch(75% .3 330 / .9)}.pixel-grid--yellow{--pixel-off: oklch(50% .08 90 / .4);--pixel-on: oklch(95% .2 90);--pixel-glow: oklch(90% .25 90 / .9)}.pixel-grid--green{--pixel-off: oklch(40% .08 145 / .4);--pixel-on: oklch(90% .25 145);--pixel-glow: oklch(80% .3 145 / .9)}.pixel-grid--orange{--pixel-off: oklch(45% .08 50 / .4);--pixel-on: oklch(85% .22 50);--pixel-glow: oklch(75% .28 50 / .9)}.pixel-grid--blue{--pixel-off: oklch(40% .08 260 / .4);--pixel-on: oklch(80% .22 260);--pixel-glow: oklch(70% .28 260 / .9)}.pixel-grid--red{--pixel-off: oklch(40% .08 25 / .4);--pixel-on: oklch(70% .25 25);--pixel-glow: oklch(60% .3 25 / .9)}.pixel-grid--purple{--pixel-off: oklch(40% .08 300 / .4);--pixel-on: oklch(75% .22 300);--pixel-glow: oklch(65% .28 300 / .9)}.pixel-grid--white{--pixel-off: oklch(50% 0 0 / .3);--pixel-on: oklch(98% 0 0);--pixel-glow: oklch(95% 0 0 / .8)}.pixel-grid--teal{--pixel-off: oklch(40% .08 175 / .4);--pixel-on: oklch(82% .18 175);--pixel-glow: oklch(72% .24 175 / .9)}.pixel-grid--pink{--pixel-off: oklch(45% .08 350 / .4);--pixel-on: oklch(80% .2 350);--pixel-glow: oklch(70% .26 350 / .9)}.pixel-grid--lime{--pixel-off: oklch(45% .08 120 / .4);--pixel-on: oklch(88% .22 120);--pixel-glow: oklch(80% .28 120 / .9)}@media (prefers-reduced-motion: reduce){.pixel-grid__cell{transition:none}}