.tool-panel:has(#metro-panel) #drop{display:none}.tool-panel:has(#metro-panel) #file-list{display:none}.tool-panel:has(#metro-panel) .run-dock{display:none}.metro-panel{gap:16px;display:grid}.metro-deck{background:var(--surface-2);border:1px solid var(--line-strong);border-radius:var(--radius);justify-items:center;gap:10px;padding:22px 20px 18px;display:grid}.metro-tempo{align-items:center;gap:clamp(12px,4vw,32px);display:flex}.metro-bpm{justify-items:center;margin:0;line-height:1;display:grid}.metro-bpm output{color:var(--ink);font-variant-numeric:tabular-nums;text-align:center;min-width:3ch;font-size:clamp(4rem,15vw,6.5rem);font-weight:800}.metro-bpm span{color:var(--muted);letter-spacing:.04em;font-size:.85rem;font-weight:700}.metro-step{border:1px solid var(--line-strong);background:var(--surface);width:48px;height:48px;color:var(--ink);font:inherit;cursor:pointer;border-radius:50%;font-size:1.6rem;line-height:1}.metro-step:hover{border-color:var(--accent)}.metro-step:focus-visible,.metro-slider:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.metro-name{color:var(--ink-2);margin:0;font-style:italic;font-weight:700}.metro-slider{width:100%;max-width:520px;accent-color:var(--accent)}.metro-lights{flex-wrap:wrap;justify-content:center;align-items:center;gap:10px;min-height:28px;padding-top:6px;display:flex}.metro-light{background:var(--surface);border:2px solid var(--line-strong);border-radius:50%;width:20px;height:20px}.metro-light.is-first{width:26px;height:26px}.metro-light.is-on{background:var(--ink);border-color:var(--ink)}.metro-light.is-first.is-on{background:var(--accent);border-color:var(--accent)}.metro-tap-note{text-align:center;font-variant-numeric:tabular-nums;min-height:1.4em;margin:0}.metro-controls{flex-wrap:wrap;gap:10px;display:flex}.metro-controls .btn{flex:160px}.metro-controls .metro-tap-first{flex-grow:3;min-height:72px;font-size:1.25rem}.metro-options{grid-template-columns:repeat(auto-fit,minmax(180px,1fr));align-items:end;gap:18px 28px;display:grid}
