.pixel-grid-wrapper{flex-direction:column;align-items:center;gap:8px;display:inline-flex}.pixel-grid-container{grid-template-rows:repeat(3,1fr);grid-template-columns:repeat(3,1fr);display:grid;overflow:visible}.pixel-grid-pixel{background-color:#1a1a1a;border-radius:2px;transition:all .25s}.pixel-grid-pixel.pixel-active{transition:all .2s ease-out}.pixel-grid-blue .pixel-grid-pixel{background-color:#60a5fa14}.pixel-grid-blue .pixel-grid-pixel.pixel-active{background-color:#60a5fa;box-shadow:0 0 4px #60a5fa,0 0 8px #60a5fa99,0 0 16px #60a5fa66,0 0 24px #60a5fa33}.pixel-grid-pink .pixel-grid-pixel{background-color:#f8717114}.pixel-grid-pink .pixel-grid-pixel.pixel-active{background-color:#f87171;box-shadow:0 0 4px #f87171,0 0 8px #f8717199,0 0 16px #f8717166,0 0 24px #f8717133}.pixel-grid-green .pixel-grid-pixel{background-color:#00ff8414}.pixel-grid-green .pixel-grid-pixel.pixel-active{background-color:#00ff84;box-shadow:0 0 4px #00ff84,0 0 8px #00ff8499,0 0 16px #00ff8466,0 0 24px #00ff8433}.pixel-grid-orange .pixel-grid-pixel{background-color:#ff6b0014}.pixel-grid-orange .pixel-grid-pixel.pixel-active{background-color:#ff8533;box-shadow:0 0 4px #ff8533,0 0 8px #ff853399,0 0 16px #ff853366,0 0 24px #ff853333}.pixel-grid-indigo .pixel-grid-pixel{background-color:#6366f114}.pixel-grid-indigo .pixel-grid-pixel.pixel-active{background-color:#818cf8;box-shadow:0 0 4px #818cf8,0 0 8px #818cf899,0 0 16px #818cf866,0 0 24px #818cf833}:root:not(.dark) .pixel-grid-pixel{background-color:#e5e5e5}:root:not(.dark) .pixel-grid-blue .pixel-grid-pixel{background-color:#2563eb26}:root:not(.dark) .pixel-grid-blue .pixel-grid-pixel.pixel-active{background-color:#2563eb;box-shadow:0 2px 8px #2563eb80,0 4px 16px #2563eb40}:root:not(.dark) .pixel-grid-pink .pixel-grid-pixel{background-color:#dc26261f}:root:not(.dark) .pixel-grid-pink .pixel-grid-pixel.pixel-active{background-color:#dc2626;box-shadow:0 2px 8px #dc262680,0 4px 16px #dc262640}:root:not(.dark) .pixel-grid-green .pixel-grid-pixel{background-color:#16a34a26}:root:not(.dark) .pixel-grid-green .pixel-grid-pixel.pixel-active{background-color:#16a34a;box-shadow:0 2px 8px #16a34a80,0 4px 16px #16a34a40}:root:not(.dark) .pixel-grid-orange .pixel-grid-pixel{background-color:#cc56001f}:root:not(.dark) .pixel-grid-orange .pixel-grid-pixel.pixel-active{background-color:#cc5600;box-shadow:0 2px 8px #cc560080,0 4px 16px #cc560040}:root:not(.dark) .pixel-grid-indigo .pixel-grid-pixel{background-color:#6366f126}:root:not(.dark) .pixel-grid-indigo .pixel-grid-pixel.pixel-active{background-color:#6366f1;box-shadow:0 2px 8px #6366f180,0 4px 16px #6366f140}.pixel-grid-light .pixel-grid-pixel{background-color:#e5e5e5}.pixel-grid-light .pixel-grid-blue .pixel-grid-pixel{background-color:#2563eb26}.pixel-grid-light .pixel-grid-blue .pixel-grid-pixel.pixel-active{background-color:#2563eb;box-shadow:0 2px 8px #2563eb80,0 4px 16px #2563eb40}.pixel-grid-light .pixel-grid-pink .pixel-grid-pixel{background-color:#dc26261f}.pixel-grid-light .pixel-grid-pink .pixel-grid-pixel.pixel-active{background-color:#dc2626;box-shadow:0 2px 8px #dc262680,0 4px 16px #dc262640}.pixel-grid-light .pixel-grid-green .pixel-grid-pixel{background-color:#16a34a26}.pixel-grid-light .pixel-grid-green .pixel-grid-pixel.pixel-active{background-color:#16a34a;box-shadow:0 2px 8px #16a34a80,0 4px 16px #16a34a40}.pixel-grid-light .pixel-grid-orange .pixel-grid-pixel{background-color:#cc56001f}.pixel-grid-light .pixel-grid-orange .pixel-grid-pixel.pixel-active{background-color:#cc5600;box-shadow:0 2px 8px #cc560080,0 4px 16px #cc560040}.pixel-grid-light .pixel-grid-indigo .pixel-grid-pixel{background-color:#6366f126}.pixel-grid-light .pixel-grid-indigo .pixel-grid-pixel.pixel-active{background-color:#6366f1;box-shadow:0 2px 8px #6366f180,0 4px 16px #6366f140}.pixel-grid-light .pixel-grid-label{color:#525252}.pixel-grid-dark .pixel-grid-pixel{background-color:#1a1a1a}.pixel-grid-dark .pixel-grid-blue .pixel-grid-pixel{background-color:#60a5fa14}.pixel-grid-dark .pixel-grid-blue .pixel-grid-pixel.pixel-active{background-color:#60a5fa;box-shadow:0 0 4px #60a5fa,0 0 8px #60a5fa99,0 0 16px #60a5fa66,0 0 24px #60a5fa33}.pixel-grid-dark .pixel-grid-pink .pixel-grid-pixel{background-color:#f8717114}.pixel-grid-dark .pixel-grid-pink .pixel-grid-pixel.pixel-active{background-color:#f87171;box-shadow:0 0 4px #f87171,0 0 8px #f8717199,0 0 16px #f8717166,0 0 24px #f8717133}.pixel-grid-dark .pixel-grid-green .pixel-grid-pixel{background-color:#00ff8414}.pixel-grid-dark .pixel-grid-green .pixel-grid-pixel.pixel-active{background-color:#00ff84;box-shadow:0 0 4px #00ff84,0 0 8px #00ff8499,0 0 16px #00ff8466,0 0 24px #00ff8433}.pixel-grid-dark .pixel-grid-orange .pixel-grid-pixel{background-color:#ff6b0014}.pixel-grid-dark .pixel-grid-orange .pixel-grid-pixel.pixel-active{background-color:#ff8533;box-shadow:0 0 4px #ff8533,0 0 8px #ff853399,0 0 16px #ff853366,0 0 24px #ff853333}.pixel-grid-dark .pixel-grid-indigo .pixel-grid-pixel{background-color:#6366f114}.pixel-grid-dark .pixel-grid-indigo .pixel-grid-pixel.pixel-active{background-color:#818cf8;box-shadow:0 0 4px #818cf8,0 0 8px #818cf899,0 0 16px #818cf866,0 0 24px #818cf833}.pixel-grid-dark .pixel-grid-label{color:#737373}.pixel-grid-label{color:#737373;text-align:center;white-space:nowrap;font-size:10px}:root:not(.dark) .pixel-grid-label{color:#525252}@media (prefers-reduced-motion:reduce){.pixel-grid-pixel,.pixel-grid-pixel.pixel-active{transition:none}}