.movement-block{grid-column:span 1;min-width:0}.movement-title{display:flex;justify-content:space-between;align-items:center}.pattern-legend{display:flex;gap:9px;align-items:center;font-family:"DM Mono",monospace;font-size:.44rem;color:#74796b}.pattern-legend span{display:flex;align-items:center;gap:3px}.pattern-legend i{display:inline-block;width:6px;height:6px}.legend-note{border-radius:50%;background:#dfff49}.legend-velocity{background:#ff6838}.legend-gate{height:2px!important;background:#62b9ff}.movement-map{height:126px;display:grid;grid-template-columns:repeat(16,minmax(24px,1fr));gap:2px;align-items:stretch;padding:5px;background:#0a0c09;border:1px solid #30342b;margin-bottom:10px;overflow-x:auto}.pattern-step{position:relative;min-width:24px;border-left:1px solid #242820;background:linear-gradient(to top,#161914 0 1px,transparent 1px 25%,#161914 25% calc(25% + 1px),transparent calc(25% + 1px) 50%,#161914 50% calc(50% + 1px),transparent calc(50% + 1px) 75%,#161914 75% calc(75% + 1px),transparent calc(75% + 1px));opacity:.95}.pattern-step.beat{border-left-color:#59604e}.pattern-step.muted{opacity:.32}.step-number{position:absolute;top:1px;left:3px;font-family:"DM Mono",monospace;font-size:.42rem;color:#6f7468}.pitch-point{position:absolute;left:50%;bottom:calc(29px + var(--pitch)*62px);transform:translate(-50%,50%);width:10px;height:10px;border-radius:50%;background:#dfff49;box-shadow:0 0 5px #dfff4977;z-index:2}.pitch-point b{position:absolute;left:50%;bottom:10px;transform:translateX(-50%);font-family:"DM Mono",monospace;font-size:.4rem;color:#c7cabd;font-weight:400;white-space:nowrap}.velocity-bar{position:absolute;bottom:4px;left:3px;width:4px;height:calc(var(--velocity)*20px);background:#ff6838}.gate-bar{position:absolute;bottom:8px;left:9px;width:calc(var(--gate)*100% - 12px);height:2px;background:#62b9ff}.event-badge{position:absolute;right:2px;bottom:13px;font-family:"DM Mono",monospace;font-size:.4rem;color:#ff6838}.pattern-step.playing{background-color:#dfff4914;box-shadow:inset 0 0 0 1px #dfff49}.pattern-step.playing .pitch-point{transform:translate(-50%,50%) scale(1.35)}.bass-panel:not(.hidden)~.arp-lab .pitch-point{background:#ff6838;box-shadow:0 0 5px #ff683877}.bass-panel:not(.hidden)~.arp-lab .pattern-step.playing{box-shadow:inset 0 0 0 1px #ff6838}
@media(max-width:1100px){.movement-map{grid-template-columns:repeat(16,32px)}.pattern-legend{display:none}}