@layer components{:where(.metronome[data-v-77242eaf]){--metronome-lit:light-dark(var(--color-indigo-500),var(--color-indigo-400));gap:var(--space-5);padding:var(--space-6) var(--space-5) var(--space-5);grid-template-rows:minmax(0,1fr) auto;display:grid}.dial[data-v-77242eaf]{gap:var(--space-3);align-content:center;justify-items:center;display:grid}.marking[data-v-77242eaf]{color:var(--color-zinc-400);margin:0;font-style:italic}.beats[data-v-77242eaf]{gap:var(--space-3);margin-block-start:var(--space-3);display:flex}.beat[data-v-77242eaf]{aspect-ratio:1;border-radius:var(--radius-full);background-color:var(--app-sunken);inline-size:1.25rem;box-shadow:var(--app-sink)}[data-accent][data-v-77242eaf]{inline-size:1.5rem}[data-lit][data-v-77242eaf]{background-color:var(--metronome-lit);box-shadow:inset 0 1px 0 0 oklch(100% 0 none/.35), inset 0 -1px 0 0 color-mix(in oklab, var(--metronome-lit) 60%, var(--color-indigo-950)), 0 0 .75rem 0 color-mix(in oklab, var(--metronome-lit) 50%, transparent)}.controls[data-v-77242eaf]{gap:var(--space-4);display:grid}.tempo[data-v-77242eaf]{justify-items:center}.steps[data-v-77242eaf]{align-items:center;gap:var(--space-3);display:flex}.slider[data-v-77242eaf]{flex:1}.keys[data-v-77242eaf]{gap:var(--space-3);display:flex}.keys[data-v-77242eaf]>*{flex:1}}