.beat-style-picker-module__3xRrEW__card{--ink:color-mix(in srgb, var(--foreground) 46%, transparent);--head:color-mix(in srgb, var(--foreground) 45%, transparent)}.beat-style-picker-module__3xRrEW__card[data-state=checked]{--ink:var(--brand);--head:var(--brand)}.beat-style-picker-module__3xRrEW__groove{background-color:color-mix(in srgb, var(--foreground) 4%, transparent);border-radius:6px;flex-direction:column;gap:5px;padding:7px 8px;display:flex;position:relative}.beat-style-picker-module__3xRrEW__drums{grid-template-columns:repeat(16,minmax(0,1fr));grid-auto-rows:5px;gap:2px 1.5px;display:grid}.beat-style-picker-module__3xRrEW__cell{background-color:color-mix(in srgb, var(--foreground) 7%, transparent);border-radius:1.5px}.beat-style-picker-module__3xRrEW__hit{background-color:var(--ink);opacity:.55;transform-origin:50%}.beat-style-picker-module__3xRrEW__hit[data-roll]{background-color:#0000;gap:1px;display:flex}.beat-style-picker-module__3xRrEW__hit[data-roll]>span{background-color:var(--ink);border-radius:1px;flex:1 1 0}.beat-style-picker-module__3xRrEW__bass{grid-template-rows:repeat(5,2px);grid-template-columns:repeat(16,minmax(0,1fr));gap:.75px 1.5px;display:grid}.beat-style-picker-module__3xRrEW__note{border-radius:999px}.beat-style-picker-module__3xRrEW__head{pointer-events:none;opacity:0;transition:opacity var(--dur-fast) var(--ease-standard);position:absolute;inset:4px 8px}.beat-style-picker-module__3xRrEW__head:before{content:"";background-color:var(--head);width:1.5px;box-shadow:0 0 6px var(--head);border-radius:1px;position:absolute;top:0;bottom:0;left:-.75px}@keyframes beat-style-picker-module__3xRrEW__beat-style-sweep{0%{transform:translate(0)}to{transform:translate(100%)}}@keyframes beat-style-picker-module__3xRrEW__beat-style-hit{0%{opacity:1;transform:scaleY(1.3)}45%,to{opacity:.55;transform:none}}.beat-style-picker-module__3xRrEW__card[data-state=checked] .beat-style-picker-module__3xRrEW__head{opacity:1;animation:beat-style-picker-module__3xRrEW__beat-style-sweep var(--bar) linear infinite}.beat-style-picker-module__3xRrEW__card[data-state=checked] .beat-style-picker-module__3xRrEW__hit{animation:beat-style-picker-module__3xRrEW__beat-style-hit var(--bar) var(--ease-standard) infinite;animation-delay:calc(var(--bar) * var(--i) / 16)}@media (hover:hover){.beat-style-picker-module__3xRrEW__card:not(:disabled):hover .beat-style-picker-module__3xRrEW__head{opacity:1;animation:beat-style-picker-module__3xRrEW__beat-style-sweep var(--bar) linear infinite}.beat-style-picker-module__3xRrEW__card:not(:disabled):hover .beat-style-picker-module__3xRrEW__hit{animation:beat-style-picker-module__3xRrEW__beat-style-hit var(--bar) var(--ease-standard) infinite;animation-delay:calc(var(--bar) * var(--i) / 16)}}@media (prefers-reduced-motion:reduce){.beat-style-picker-module__3xRrEW__card[data-state=checked] .beat-style-picker-module__3xRrEW__head,.beat-style-picker-module__3xRrEW__card:not(:disabled):hover .beat-style-picker-module__3xRrEW__head{opacity:0;animation:none}.beat-style-picker-module__3xRrEW__card[data-state=checked] .beat-style-picker-module__3xRrEW__hit,.beat-style-picker-module__3xRrEW__card:not(:disabled):hover .beat-style-picker-module__3xRrEW__hit{animation:none}.beat-style-picker-module__3xRrEW__card[data-state=checked] .beat-style-picker-module__3xRrEW__hit{opacity:.9}}
