/* Touch-friendly controls; keep the detailed mixer/grid independently scrollable. */
button,a,input,select{-webkit-tap-highlight-color:transparent}button,a{touch-action:manipulation}.voice-scroll,.grid-scroll{overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch}.mobile-hint{display:none}.download-actions{display:flex;gap:12px;flex-wrap:wrap}.download-actions a,.download-actions button{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:10px 16px;background:#d89050;border-radius:4px;color:#171e12;font-size:16px}.download-name{overflow-wrap:anywhere;font-size:14px}#download-status{font-size:14px;line-height:1.5}
@media(pointer:coarse){button:not(.knob),select{min-height:44px}.knob{min-width:44px;min-height:44px}.knob:after{left:calc(50% - 1.5px)}.grid-cell,.grid-label{min-height:44px}.pattern-grid{grid-template-columns:150px repeat(16,44px);min-width:990px}.mute{min-width:44px}.voice-title{white-space:normal}.voice-select{min-width:44px}.slot-actions button{min-width:44px}.timing-panel input[type=range]{height:32px}.grid-scroll{touch-action:pan-x pan-y}.mobile-hint{display:block;font-size:12px;line-height:1.6;color:#c5c5b1;margin:12px 0}.voices{min-width:1320px}.knob-row{gap:12px}.sample-source{min-height:44px!important}}
@media(max-width:700px){.topbar{height:auto;min-height:96px;flex-wrap:wrap;gap:12px;padding:16px max(16px,env(safe-area-inset-left))}.top-actions{width:100%;justify-content:space-between;gap:8px}.top-actions button{min-height:44px;padding:8px;font-size:13px}.top-actions #help{display:block}.top-actions #save{max-width:none}.wordmark{font-size:28px}.wordmark span{font-size:9px;letter-spacing:2px}main{padding-left:max(12px,env(safe-area-inset-left));padding-right:max(12px,env(safe-area-inset-right))}.machine-top{height:auto;min-height:100px;padding:14px 0}.model{flex-wrap:wrap;gap:6px 14px}.model h2{font-size:27px;letter-spacing:1px}.model-number{font-size:60px}.model div>span{font-size:8px;letter-spacing:1px}.edition{display:none}.control-deck>*{min-width:0}.transport-buttons{flex-wrap:wrap}.transport-buttons button{min-width:44px;min-height:52px}.memory-actions{flex-wrap:wrap}.memory-actions button{min-height:44px;font-size:11px}.memory-select{flex-wrap:wrap;gap:8px}.memory-select select,.small-fields select,.small-fields input{font-size:16px;min-height:44px}.small-fields{flex-wrap:wrap}.tempo-screen input{font-size:28px;min-width:0}input,select{font-size:16px}.view-tabs{gap:18px}.view-tabs button{min-height:48px}.arrangement-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;width:100%}.arrangement-actions button{font-size:12px;min-height:44px;border:1px solid #606653;border-radius:4px;padding:8px}.write-modes{flex-wrap:wrap}.write-modes button{min-height:44px}.steps{grid-template-columns:repeat(8,minmax(0,1fr));gap:12px 7px}.step{min-height:64px}dialog{width:calc(100% - 24px);max-width:calc(100% - 24px);max-height:85vh;max-height:85dvh;padding:18px;overflow:auto;overscroll-behavior:contain}.dialog-heading button{min-width:44px;min-height:44px}.sample-slot{grid-template-columns:24px minmax(0,1fr)}.slot-actions{grid-column:2;flex-wrap:wrap}.slot-actions button{min-height:44px;padding:8px 12px;font-size:13px}.slot-wave{display:none}.slot-copy span{max-width:100%;font-size:12px}.sample-toolbar{align-items:stretch}.mobile-hint{display:block;font-size:12px;color:#c5c5b1;line-height:1.6}footer{flex-wrap:wrap;padding-bottom:max(20px,env(safe-area-inset-bottom))}footer button,footer a{display:inline-flex;align-items:center;min-height:44px}#toast{bottom:max(16px,env(safe-area-inset-bottom));width:max-content;max-width:calc(100vw - 24px)}.grid-label{position:sticky;left:0;background:#262b25;z-index:1}}
@media(max-width:360px){.control-deck{grid-template-columns:1fr}.timing-panel,.memory-panel,.master-panel{grid-column:1;grid-row:auto}.steps{gap:10px 4px}.write-modes button{padding:6px}.model h2{font-size:24px}}
.download-actions [hidden]{display:none!important}
@media(max-width:450px){.steps{grid-template-columns:repeat(4,minmax(0,1fr))}.step{height:64px}.voices{min-width:1320px}.knob{min-width:44px;min-height:44px}.knob:after{left:calc(50% - 1.5px)}}
@media(min-width:701px) and (max-width:1000px){.steps{grid-template-columns:repeat(8,minmax(0,1fr));gap:12px 8px}}
