.tool{gap:18px;padding-bottom:28px;display:grid}.tool-row{flex-wrap:wrap;align-items:end;gap:12px 18px;display:flex}.tool label{color:var(--muted);gap:6px;font-size:.9rem;display:grid}.tool select,.tool input[type=range]{min-width:120px}.tool select{background:var(--panel-strong);color:var(--text);border:1px solid var(--line);border-radius:10px;padding:8px 10px}.tool button{font:inherit;color:var(--text);background:var(--panel);border:1px solid var(--line);cursor:pointer;border-radius:12px;padding:10px 16px;font-weight:600}.tool button.primary{background:var(--grad);color:#0a0a12;border-color:#0000}.tool button:disabled{opacity:.6;cursor:default}.acid-steps{grid-template-columns:repeat(16,minmax(0,1fr));gap:4px;display:grid}.acid-step{gap:3px;display:grid}.acid-step button{border-radius:8px;padding:8px 0;font-size:.8rem}.acid-step.beat button:first-child{border-color:#8b5cf699}.acid-step button[aria-pressed=true]{background:var(--panel-strong);color:var(--cyan)}.acid-step button:first-child[aria-pressed=false]{color:var(--muted)}.acid-step button:not(:first-child)[aria-pressed=false]{color:#a3a9bf73}.tool-error{color:var(--amber);margin:0}@media (width<=720px){.acid-steps{grid-template-columns:repeat(8,minmax(0,1fr))}}.tool-chords{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;display:grid}.tool-chord{text-align:center;border:1px solid var(--line);background:var(--panel);border-radius:12px;padding:18px 0;font-size:1.3rem;font-weight:700}.tool label.tool-check{color:var(--text);align-items:center;gap:8px;display:flex}.tool-grid{gap:4px;display:grid;overflow-x:auto}.tool-grid-row{grid-template-columns:76px repeat(16,minmax(14px,1fr));align-items:center;gap:4px;display:grid}.tool-grid-name{color:var(--muted);font-size:.85rem}.tool .tool-grid-row button{border-radius:6px;height:30px;padding:0}.tool .tool-grid-row button.beat{border-color:#8b5cf699}.tool .tool-grid-row button[aria-pressed=true]{background:var(--cyan)}.tool .tool-grid-row button.soft[aria-pressed=true]{opacity:.6}@media (width<=720px){.tool-grid-row{grid-template-columns:56px repeat(16,minmax(14px,1fr));gap:2px}}.tool-status{color:var(--muted);margin:0}.tool-link{color:var(--cyan);align-self:center}.tool-keys{grid-template-columns:repeat(25,minmax(0,1fr));gap:2px;display:grid}.tool .tool-keys button{background:#e8e8f0;border-radius:0 0 6px 6px;height:120px;padding:0}.tool .tool-keys button.black{background:#20202a;height:80px}.tool .tool-keys button:disabled{opacity:.4}
