.dmx-root{vertical-align:middle;--dmx-opacity-base:.16;--dmx-opacity-mid:.32;--dmx-opacity-peak:1;justify-content:center;align-items:center;display:inline-flex}.dmx-grid{grid-template-rows:repeat(5,minmax(0,1fr));grid-template-columns:repeat(5,minmax(0,1fr));display:grid}.dmx-dot{background:var(--dmx-dot-fill,currentColor);opacity:calc(.5 * (var(--dmx-opacity-base) + var(--dmx-opacity-mid)));transform-origin:50%;will-change:opacity;border-radius:999px;display:block}.dmx-root.dmx-dot-shape-circle .dmx-dot{border-radius:999px}.dmx-root.dmx-dot-shape-square .dmx-dot{border-radius:0}.dmx-root.dmx-dot-shape-diamond .dmx-dot{border-radius:0;transform:rotate(45deg)scale(.707107)}.dmx-muted .dmx-dot{opacity:calc(.44 * var(--dmx-opacity-mid))}.dmx-dot.dmx-inactive{visibility:hidden;pointer-events:none;will-change:auto;opacity:0!important;animation:none!important}