/* MarTrack performance workspace. Scope is main app, not OctaMED v4 popup. */
.performance-bar{display:flex;flex-wrap:wrap;align-items:center;gap:10px;padding:7px 14px;background:#15252c;border-bottom:1px solid #34505b;font-size:11px}
.performance-bar button{font-size:11px;min-height:28px;padding:3px 8px}
.performance-bar .check{font-size:12px;color:#bdded8}
#keyboardModeStatus{color:#83d9c1;font:10px var(--mono);border-left:1px solid #3a5362;padding-left:10px}
#performanceInstrument{font:11px var(--mono);max-width:260px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.toolbar-spacer{flex:1}.piano-toolbar,.wave-toolbar,.score-toolbar{display:flex;align-items:center;flex-wrap:wrap;gap:7px;padding:9px 12px;min-width:0;border-bottom:1px solid var(--line);background:#17212d}
.piano-toolbar button,.wave-toolbar button{min-height:28px;font-size:11px;padding:3px 9px}.piano-toolbar output,.score-toolbar output{font:11px var(--mono);color:#a3b9ca}
.piano-stage{position:relative;overflow:hidden}.piano-scroller{height:clamp(300px,calc(100dvh - 385px),540px);min-width:0;overscroll-behavior:contain;background:#111b25}
#pianoSpacer{position:relative;min-width:100%;min-height:100%}#pianoCanvas{border:0;touch-action:pan-x pan-y}.editing #pianoCanvas{touch-action:none}
.playhead{position:absolute;width:2px;pointer-events:none;background:#ffd078;box-shadow:0 0 6px #f7cb6466;z-index:3;top:24px;left:0}
#pianoPlayhead:before{content:'';position:absolute;left:-4px;top:0;border-left:5px solid transparent;border-right:5px solid transparent;border-top:7px solid #ffd078}
.wave-toolbar{position:sticky;top:0;z-index:4;border:1px solid var(--line);border-radius:5px 5px 0 0;padding:8px;background:#1a2633;min-height:46px}
#waveRange{margin-left:auto;font:11px var(--mono);max-width:100%;overflow-wrap:anywhere}
#waveformShell{position:relative;width:100%;min-width:0;max-width:100%;height:182px;border:1px solid var(--line);border-top:0;overflow:hidden;margin:0 0 12px;background:#0b121b}
#waveform{border:0;border-radius:0;margin:0;width:100%;max-width:100%;height:180px;display:block;touch-action:pan-y}
#waveCursor{top:0;height:180px}.sample-controls{margin-bottom:8px}#samplePreview.active{background:#215547;border-color:var(--accent)}
#scorePanel{position:relative;max-height:480px;min-height:170px;overflow:auto;overscroll-behavior:contain;margin:0 0 18px;border:1px solid #455767}
#score{color:#151a20}#score svg{color:#151a20}.score-cursor{position:absolute;pointer-events:none;z-index:2;border-left:2px solid #cf7b10;width:1px}
#score .mt-score-playing{fill:#c97904;stroke:#c97904}#scoreNotice{font-size:11px;margin:8px 0 12px;max-width:960px}
.score-toolbar{border:1px solid var(--line);border-radius:5px;align-items:center}.score-toolbar select{max-width:260px}.score-toolbar output{max-width:210px}
.note-badge{display:inline-block;border-radius:3px;padding:0 4px;margin-left:3px;min-width:18px;font:10px var(--mono);background:#25423f;color:#9ae3cc}
.notes-table input[readonly]{background:transparent;border-color:transparent;color:#9fb7c8}.notes-table-wrap{max-height:280px}
.key.sounding{box-shadow:inset 0 0 0 3px #f7bd5a}.key.pressed{box-shadow:inset 0 0 0 2px #d1fff3}
.instrument-keys .keyboard-strip{border-top-color:#456f69}.keyboard-strip{position:sticky;bottom:0;z-index:6;box-shadow:0 -4px 15px #070c1430}
.performance-bar,.piano-toolbar,.wave-toolbar,.score-toolbar,button,.tabs,.section-label,.panel-foot,.sampler-head label,.knob-grid label{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
input,textarea,[contenteditable=true]{-webkit-user-select:text;user-select:text}.toolbar-spacer{min-width:0}
.focus-workspace .sidebar{display:none}.focus-workspace .workspace{grid-template-columns:minmax(0,1fr)}.focus-workspace .order-bar #orderList{max-width:calc(100vw - 195px)}
.focus-workspace .grid-scroller{height:clamp(350px,calc(100dvh - 330px),900px)}.focus-workspace .piano-scroller{height:clamp(350px,calc(100dvh - 345px),900px)}
@media(max-width:760px){.performance-bar{gap:7px;padding:7px 9px}.performance-bar .check{font-size:11px}.performance-bar button{font-size:10px}#performanceInstrument{max-width:170px}#keyboardModeStatus{font-size:9px}.piano-toolbar,.wave-toolbar,.score-toolbar{padding:8px;gap:6px}.score-toolbar label{width:100%}.score-toolbar select{max-width:100%;width:100%}#scorePanel{max-height:420px}.keyboard-strip{position:static}.piano-scroller{height:360px}.wave-toolbar{position:relative}#waveRange{margin-left:0;width:100%}.sampler-head button{max-width:100%}.focus-workspace .grid-scroller,.focus-workspace .piano-scroller{height:calc(100dvh - 340px);min-height:280px}}
@media print{#scoreCursor,.performance-bar,.wave-toolbar{display:none!important}#scorePanel{max-height:none!important}#score .mt-score-playing{fill:inherit;stroke:inherit}}
/* Desktop workstation: transport, sidebar and keyboard stay anchored while only
   the active editor panel scrolls. The keyboard never overlays form controls. */
@media(min-width:1000px) and (min-height:640px){
 html,body{height:100dvh;overflow:hidden}body{display:flex;flex-direction:column}
 .app-header,.transport,.performance-bar{flex-shrink:0}
 .workspace{flex:1;min-height:0;overflow:hidden}.sidebar{min-height:0;overflow:auto}
 .workspace>main{display:flex;flex-direction:column;min-height:0;overflow:hidden}
 .order-bar,.tabs,.edit-toolbar,.keyboard-strip,main>footer{flex-shrink:0}
 .view.active{flex:1;min-height:0;overflow:auto}
 .view.active[data-panel=tracker],.view.active[data-panel=piano]{display:flex;flex-direction:column;overflow:hidden}
 .view.active[data-panel=tracker] .grid-scroller{flex:1;min-height:0;height:auto}
 .piano-toolbar,.panel-foot{flex-shrink:0}.piano-stage{flex:1;min-height:0}
 .piano-scroller,.focus-workspace .piano-scroller{height:100%;min-height:0}
 .keyboard-strip{position:relative;bottom:auto}
 #warningBar{max-height:22vh;overflow:auto;flex-shrink:0}
}
@media print{html,body{height:auto!important;overflow:visible!important;display:block!important}.workspace,main,.view.active{overflow:visible!important;height:auto!important;display:block!important}}

.polyphony-label{flex-direction:row;align-items:center;gap:5px}.polyphony-label select{max-width:104px;min-height:28px;padding:3px 6px;font-size:11px}#polyphonyCount{font:11px var(--mono);color:var(--accent);min-width:42px}