/* 1.35.55: match the central display to the F–G columns and align the sound slider. */
#panel-presets .presetdesk,.screenApp #panel-presets .presetdesk{grid-template-columns:repeat(4,minmax(0,1fr))!important;column-gap:6px;row-gap:8px}
#panel-presets .presetBankPanel{grid-column:1/-1}
#panel-presets .programPanel{grid-column:2/4}
#panel-presets .programPanel .screen,.screenApp #panel-presets .programPanel .screen{grid-template-columns:50px minmax(0,1fr);grid-template-rows:12px 28px;height:72px!important;min-height:72px!important;padding:8px 10px!important;column-gap:8px;box-shadow:inset 0 2px 12px #000c}
#panel-presets .programPanel .screen>small{font-size:8px;line-height:12px}
#panel-presets .programPanel .screen #programDisplay{font-size:26px!important;line-height:28px!important;letter-spacing:2px}
#panel-presets .programPanel .screen #bankDisplay{font-size:10px!important;line-height:12px}
#panel-presets .programPanel .screen #targetDisplay{font-size:9px!important;line-height:12px}
#panel-presets .programPanel>.soundBankSwitch{display:grid;grid-template-columns:44px minmax(0,1fr) 44px;gap:4px;width:100%;max-width:none;box-sizing:border-box}
#panel-presets .programPanel>.soundBankSwitch small{font-size:9px;line-height:12px;letter-spacing:0}
#panel-presets .programPanel>.soundBankSwitch output{font-size:11px;line-height:14px}
#panel-presets .programPanel>.soundBankSwitch button{min-width:44px;width:44px;min-height:44px;padding:4px;font-size:18px}
#panel-presets .presetdesk .dialgroup,.screenApp #panel-presets .presetdesk .dialgroup{display:block!important;grid-column:1/-1!important;grid-row:auto!important;margin:0}
#panel-presets .presetdesk .dialgroup>.soundBrowseLabel{display:block!important;text-align:center;font-size:11px;line-height:16px;margin:0 0 3px}
#panel-presets .presetdesk .soundBrowseRow{display:grid;grid-template-columns:44px minmax(0,1fr) 44px;align-items:center;gap:8px;min-width:0}
#panel-presets .presetdesk .soundBrowseRow #programDown,#panel-presets .presetdesk .soundBrowseRow #programUp{display:flex;align-items:center;justify-content:center;grid-row:1;width:44px!important;height:44px;min-height:44px!important;padding:0;margin:0;line-height:1;font-size:18px;box-sizing:border-box;align-self:center}
#panel-presets .presetdesk .soundBrowseRow #programDown{grid-column:1}
#panel-presets .presetdesk .soundBrowseRow #programUp{grid-column:3}
#panel-presets .presetdesk .soundBrowseRow #programDial{grid-column:2;grid-row:1;align-self:center;display:block;width:100%!important;height:44px!important;min-height:44px!important;padding:0!important;margin:0!important;border:0;background:transparent;box-sizing:border-box}
#panel-presets .titleline>[hidden],#panel-presets .presetEditor{display:none!important}
#panel-presets #storePreset{margin-left:auto!important;order:20}
.keyExtras>.octaveDetails,.keyExtras>.arpDetails{width:100%;box-sizing:border-box;margin:5px 0 8px;border:1px solid #826b47;border-radius:7px;background:#211c17}
.keyExtras>.octaveDetails>summary,.keyExtras>.arpDetails>summary{box-sizing:border-box;min-height:32px;padding:6px 9px;font-size:11px;line-height:18px;cursor:pointer}
.keyExtras .octaveHints{float:right;font-size:10px;color:#b6c7a7}
.keyExtras .octaveDetails .transposeBar{margin:0;padding:6px 8px;border:0;background:transparent;gap:6px;font-size:10px}
.keyExtras .octaveDetails .transposeBar>span,.keyExtras .octaveDetails .transposeBar small{font-size:10px!important}
.keyExtras .octaveDetails .transposeBar button{font-size:11px!important;min-width:44px;min-height:44px}
.keyExtras .octaveDetails .transposeBar #transposeValue{font-size:12px!important}
@media(pointer:coarse){.keyExtras>.octaveDetails>summary,.keyExtras>.arpDetails>summary{min-height:44px}}
@media(max-width:800px){#panel-presets .programPanel{grid-column:1/-1}}
@media(max-width:500px){#panel-presets .programPanel .screen,.screenApp #panel-presets .programPanel .screen{height:auto!important;min-height:72px!important;grid-template-rows:auto auto}}
