/* 1.35.56: live preset performance and a compact Tweak page. */
#panel-effects .tweakTitleline{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:4px 0 8px}
#panel-effects .tweakTitleline h2{margin:0;font-size:20px}
#panel-effects #saveTweakSound{margin-left:auto;flex:0 0 auto;min-height:36px}
#panel-effects .effectsActions{margin:5px 0;gap:6px}
#panel-effects .effectsActions button{min-height:32px;padding:5px 10px;font-size:11px}
#panel-effects #effectsSave,#panel-effects .effectValueReset{display:none!important}
#panel-effects #effectsTarget{margin:0;padding:6px 10px;font-size:12px;line-height:1.3}
#panel-effects #effectsStatus{margin:4px 0;font-size:10px;line-height:1.3}
#panel-effects #sliders,.screenApp #panel-effects #sliders{margin:6px 0!important;gap:8px!important;overflow:visible}
#panel-effects .tweakGroup{gap:8px;padding:10px}
#panel-effects .tweakGroup h3{font-size:13px;line-height:16px}
#panel-effects #sliders .tweakGroup label{gap:3px 8px;font-size:12px;line-height:16px}
#panel-effects #sliders .tweakGroup input[type=range]{height:28px!important;min-height:28px!important;padding:0;margin:0}
#panel-effects #sliders .tweakGroup .muted{display:none}
#panel-effects #sliders .tweakGroup #porta{min-height:34px;padding:5px 10px;font-size:12px}
.performancePanel{min-width:0;grid-column:1/-1}
.performancePanel h3{margin:0;font-size:15px;color:#edce95}
#performanceSoundName{font-size:12px;line-height:1.3;margin:5px 0;overflow-wrap:anywhere;min-width:0}
.performanceTargetRow{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:11px;margin:5px 0}
.performanceTargetRow select{font-size:12px;min-height:44px;min-width:0;max-width:80%;padding:5px 8px}
.performanceFaders{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:4px;min-width:0;margin:8px 0}
.performanceFader{display:flex!important;flex-direction:column;align-items:center;gap:6px;min-width:0;margin:0;text-align:center;font-size:10px;line-height:13px}
.performanceFader output{float:none;font:12px ui-monospace,monospace;color:#f0d097}
.performanceFader span{min-height:26px;overflow-wrap:anywhere}
.performanceFader input[type=range]{writing-mode:vertical-lr;direction:rtl;appearance:auto;width:44px!important;min-width:44px;height:clamp(80px,calc((100dvh - 570px)*.6),112px)!important;min-height:0!important;margin:0!important;padding:0!important;touch-action:none;accent-color:#d9b47c}
#performanceSave{min-height:44px;width:100%;margin:4px 0;font-size:12px}
.performanceHint{font-size:10px!important;color:#c8b89a;margin:5px 0!important;line-height:1.3}
body.performanceMode:not(.drumPerformance) .quickActions,body.performanceMode:not(.drumPerformance) .ddpModeHint{display:none!important}
body.performanceMode:not(.drumPerformance) #panel-presets{flex:1;min-height:0;overflow:hidden}
body.performanceMode:not(.drumPerformance) #panel-presets>section{display:grid!important;grid-template-columns:minmax(0,1fr) minmax(320px,390px)!important;grid-template-rows:auto minmax(0,1fr)!important;gap:8px 12px;height:100%;min-height:0;box-sizing:border-box;padding:12px;margin:0;overflow:hidden}
body.performanceMode:not(.drumPerformance) #currentSound{grid-column:1;grid-row:1;font-size:16px;margin:0;line-height:1.3}
body.performanceMode:not(.drumPerformance) #pads{grid-column:1;grid-row:2;min-height:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:repeat(4,minmax(0,1fr));gap:8px}
body.performanceMode:not(.drumPerformance) #pads .pad{min-height:0!important;padding:10px 8px!important}
body.performanceMode:not(.drumPerformance) #pads .pad b{font-size:14px;line-height:1.2;overflow-wrap:anywhere}
body.performanceMode:not(.drumPerformance) #pads .pad .description{font-size:9px}
body.performanceMode:not(.drumPerformance) #panel-presets .presetdesk{grid-column:2!important;grid-row:1/3!important;align-self:stretch;grid-template-columns:minmax(0,1fr)!important;grid-template-rows:auto 1fr;align-content:start;gap:12px;padding:12px;margin:0;min-height:0;overflow:hidden}
body.performanceMode:not(.drumPerformance) #panel-presets .presetdesk>.programPanel,body.performanceMode:not(.drumPerformance) #panel-presets .presetdesk>.dialgroup,body.performanceMode:not(.drumPerformance) #programEntryStatus{display:none!important}
body.performanceMode:not(.drumPerformance) #performancePanel:not([hidden]){display:flex;flex-direction:column;justify-content:center}
body.performanceMode:not(.drumPerformance) .sessionBar{flex-shrink:0;margin:0}
:root:not(.screenApp) body.performanceMode:not(.drumPerformance) main{height:calc(100dvh - 24px);max-height:calc(100dvh - 24px);box-sizing:border-box;display:flex;flex-direction:column;overflow:hidden}
@media(pointer:coarse){#panel-effects #sliders .tweakGroup input[type=range]{height:44px!important;min-height:44px!important}#panel-effects button{min-height:44px!important}}
@media(max-width:900px){body.performanceMode:not(.drumPerformance) #panel-presets{overflow:auto}body.performanceMode:not(.drumPerformance) #panel-presets>section{grid-template-columns:minmax(0,1fr)!important;grid-template-rows:auto auto auto!important;height:auto;overflow:visible}body.performanceMode:not(.drumPerformance) #panel-presets .presetdesk{grid-column:1!important;grid-row:3!important}body.performanceMode:not(.drumPerformance) #pads{grid-auto-rows:minmax(60px,auto);min-height:260px}}
@media(max-height:650px) and (min-width:901px){.performanceFader input[type=range]{height:80px!important}.performanceFaders{margin:6px 0}body.performanceMode:not(.drumPerformance) #panel-presets .presetdesk{gap:6px;padding:8px}}

body.performanceMode:not(.drumPerformance) main>p.muted{display:none!important}
@media(max-height:650px){body.performanceMode:not(.drumPerformance) #panel-presets{overflow:auto}body.performanceMode:not(.drumPerformance) #panel-presets>section{height:auto;min-height:100%;overflow:visible}body.performanceMode:not(.drumPerformance) #pads{min-height:260px}}

:root:not(.screenApp) body.performanceMode:not(.drumPerformance) main{padding:12px 18px!important}
#performanceSoundName{border-left:3px solid transparent;padding-left:8px}
.performancePanel[data-layer="A"] #performanceSoundName{border-color:#69a8c7}
.performancePanel[data-layer="A"] .performanceFader input{accent-color:#69a8c7}
.performancePanel[data-layer="B"] #performanceSoundName{border-color:#d9b47c}
