.midi-workbench{border:1px solid var(--line-strong);border-radius:var(--radius-lg);background:var(--surface);margin:2rem 0 3rem;overflow:hidden}.midi-topline{font:.75rem var(--font-mono);color:var(--accent-text);border-bottom:1px solid var(--line-strong);justify-content:space-between;gap:1rem;padding:1rem 1.4rem;display:flex}.midi-panel{border-bottom:1px solid var(--line);padding:clamp(1rem,3vw,2rem)}.midi-panel h2{margin-bottom:.75rem;font-size:1.3rem}.midi-panel p{color:var(--text-dim);max-width:78ch;margin:.8rem 0 1.2rem}.midi-actions{flex-wrap:wrap;align-items:center;gap:.6rem;margin:1rem 0;display:flex}.midi-file{position:relative;overflow:hidden}.midi-file input{opacity:0;cursor:pointer;width:100%;position:absolute;inset:0}.midi-file:focus-within{outline:2px solid var(--accent-text);outline-offset:3px}.midi-fields{border:0;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:1rem;margin:1rem 0;padding:0;display:grid}.midi-fields label{color:var(--text-dim);gap:.4rem;font-size:.85rem;display:grid}.midi-fields input,.midi-fields select{width:100%;min-height:44px;color:var(--text);background:var(--surface-sunken);border:1px solid var(--line-strong);border-radius:var(--radius);font:1rem var(--font-mono);padding:.6rem}.midi-consent{align-items:center;gap:.75rem;margin-top:1.5rem;display:flex}.midi-consent input{width:22px;height:22px;accent-color:var(--accent);flex-shrink:0}.midi-filename{overflow-wrap:anywhere;font-family:var(--font-mono)}.midi-panel .midi-error{color:var(--error)}.midi-roll{border:1px solid var(--line-strong);background:var(--surface-sunken);max-height:400px;margin-top:1.5rem;overflow-y:auto}.midi-roll-row{border-bottom:1px solid var(--line);height:22px;display:flex}.midi-roll-row:nth-child(2n){background:var(--surface-raised)}.midi-roll-row>span{width:48px;font:10px/22px var(--font-mono);color:var(--text-dim);border-right:1px solid var(--line-strong);flex-shrink:0;padding-left:6px}.midi-roll-row>div{background-image:linear-gradient(to right, var(--line) 1px, transparent 1px);background-size:12.5% 100%;flex:1;position:relative}.midi-note{border:1px solid var(--accent-dim);background:var(--accent);cursor:pointer;border-radius:2px;min-width:4px;height:17px;position:absolute;top:2px}.midi-note--selected{background:var(--cyan);border-color:var(--text);outline:1px solid var(--text)}.midi-note:focus-visible{outline:2px solid var(--text);outline-offset:1px;z-index:1}.midi-timeline{font:.75rem var(--font-mono);color:var(--text-dim);justify-content:space-between;margin-top:.5rem;padding-left:48px;display:flex}.midi-note-editor{border:1px solid var(--line-strong);background:var(--surface-raised);margin:1.5rem 0 2rem;padding:1rem}@media (max-width:540px){.midi-topline{padding:1rem;font-size:.6rem}.midi-fields{grid-template-columns:1fr 1fr;gap:.6rem}.midi-actions .btn{min-height:44px}}.midi-fields select{appearance:none;background-image:linear-gradient(45deg, transparent 50%, var(--text-dim) 50%), linear-gradient(135deg, var(--text-dim) 50%, transparent 50%);background-position:calc(100% - 17px) 19px,calc(100% - 12px) 19px;background-repeat:no-repeat;background-size:5px 5px;height:44px;padding-right:2rem}.midi-fields>label:only-child{grid-column:1/-1}