/* ElectraSpectra v0.3.2: actual touch/MIDI expression controls for live voices. */
#view-keys .es-playfield{display:flex;align-items:stretch;gap:8px;flex:1;min-height:85px;min-width:0;overflow:hidden}
#view-keys .es-playfield>.keyboard-scroll{flex:1;min-width:0;min-height:85px;overflow-x:auto;overflow-y:hidden}
.es-wheels{display:flex;align-items:stretch;justify-content:center;gap:6px;flex:none;padding:3px 0}
.es-wheel{display:flex;flex-direction:column;align-items:center;justify-content:space-between;gap:4px;width:37px;min-height:0;color:var(--ap-muted,#a7bfc9);font:9px/1.1 monospace}
.es-wheel span{font-weight:700;letter-spacing:.05em;color:var(--ap-accent,#7ee4e8)}
.es-wheel output{color:var(--ap-text,#e5f5fa);font:9px/1.1 monospace;white-space:nowrap;min-height:11px}
.es-wheel input[type=range]{appearance:auto;writing-mode:vertical-lr;direction:rtl;height:100%;max-height:100%;min-height:35px;width:25px;flex:1;cursor:ns-resize;touch-action:none;margin:0;accent-color:var(--ap-accent,#7ee4e8)}
.es-wheel input[type=range]:focus-visible{outline:2px solid var(--ap-accent,#7ee4e8);outline-offset:2px}
@media(max-width:600px){
 #view-keys .es-playfield{gap:4px}
 .es-wheels{gap:2px}
 .es-wheel{width:29px;font-size:8px}
 .es-wheel input[type=range]{width:22px}
}