/* KeyboardStudio: shared visual polish, without changing the hardware LCD. */
:root{--bg:#0b0c0e;--surface:#141519;--raised:#1b1c21;--border:#303137;--muted:#a0a1ab;--text:#f3f2ef;--red:#f5233c}
body{background:var(--bg);font-family:"Segoe UI Variable","Segoe UI",Arial,sans-serif}
body>header{min-height:76px;height:auto;padding:16px 26px;gap:12px;background:#101114;border-bottom-color:#2b2c31}
.brand-lockup{gap:11px}.brand-lockup i{width:16px;height:16px;flex:0 0 16px;border-radius:50%;background:var(--red)}
.brand-line{font-family:"Segoe UI Variable","Segoe UI",Arial,sans-serif}
.brand-line{letter-spacing:-.6px}.brand-line b{font-weight:750}.brand-line>span{font-weight:400;font-size:21px}
header #version{font-family:inherit;font-size:10px;color:#a0a1aa;letter-spacing:.08em;margin-top:4px}
header button{min-height:40px;font-size:13px;border-radius:7px}header .ready{font-size:12px;margin-left:auto;margin-right:8px}
body[data-page=welcome] header #globalOpen,body[data-page=welcome] header #globalSave,body[data-page=welcome] header #preferencesButton,body[data-page=welcome] header #guideButton{display:none}
.shell>aside{width:216px;background:linear-gradient(160deg,#141518,#0d0e10 80%);padding:24px 14px;border-color:#2b2c31}
.shell>aside nav{gap:6px}.shell>aside nav>button{position:relative;display:flex;align-items:center;gap:13px;min-height:46px;padding:11px 15px;font-size:14px;color:#b5b5bf;border-radius:7px;transition:background .16s,color .16s}
.shell>aside nav>button>svg{width:19px;height:19px;flex:none;color:#858893}.shell>aside nav>button:hover:not(:disabled){background:#1c1d22;color:#fff}
.shell>aside nav>button.active{background:linear-gradient(90deg,#3d1b22,#23191e);border-color:#66303a;color:#fff}.shell>aside nav>button.active>svg{color:#ff4355}.shell>aside nav>button.active:before{content:'';position:absolute;left:-1px;top:11px;bottom:11px;width:3px;background:#ff3048;border-radius:2px}
.shell>aside nav>.reference-navigation{border:0;border-top:1px solid #2c2d32;border-bottom:1px solid #2c2d32;border-radius:0;margin:12px 0;padding:12px 0}.reference-navigation summary{font-size:12px;padding:8px 13px;color:#9c9ea8}.reference-navigation button{padding-left:18px;min-height:42px}
main{padding:30px 36px 0}.shell>main>section{max-width:1500px;margin-inline:auto}
@media(min-width:681px) and (max-width:1100px){.shell{display:grid;grid-template-columns:190px minmax(0,1fr);align-items:start}.shell>aside{position:sticky;top:0;height:calc(100vh - 76px);overflow-y:auto}.shell>main{min-width:0}}
main input:not([type=checkbox]):not([type=range]),main select{border-color:#383941;background-color:#1b1c22}
main input::placeholder{color:#8a8c99}button:not(:disabled):hover{filter:brightness(1.12)}button:focus-visible,a:focus-visible{outline:2px solid #ff5a6b;outline-offset:3px}
footer{border-top:1px solid #23242a;margin-top:28px;padding:20px 0;color:#8f919d;font-size:10px;letter-spacing:.08em}
#welcomePage{max-width:1360px;margin:auto}.welcome-hero{position:relative;min-height:256px;display:grid;grid-template-columns:1.1fr 1fr;align-items:center;gap:20px;overflow:hidden;border:1px solid #2f323a;border-radius:14px;padding:36px 34px;background:radial-gradient(ellipse at 83% 45%,#26354480,transparent 56%),linear-gradient(125deg,#191b20,#101115 72%)}
.welcome-copy{position:relative;z-index:1}.alpha-tag{display:inline-flex;align-items:center;gap:8px;font-size:10px;font-weight:700;letter-spacing:.14em;border:1px solid #43454c;border-radius:30px;padding:6px 10px;color:#c8c9d1}.alpha-tag:before{content:'';width:5px;height:5px;border-radius:50%;background:#f5233c}
.welcome-copy h1{font-size:clamp(29px,3.0vw,44px);line-height:1.16;letter-spacing:-1.1px;font-weight:740;margin:24px 0 12px;max-width:510px}.welcome-copy p{font-size:15px;line-height:1.6;margin:0;color:#aaafbb}
.welcome-instrument-stage{position:relative;min-width:0;align-self:stretch;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:14px}.welcome-instrument{position:relative;width:115%;max-width:680px;height:auto;object-fit:contain;filter:drop-shadow(0 16px 18px #000b);transform:perspective(850px) rotateY(-13deg) rotateZ(-3deg);opacity:.94;pointer-events:none}.welcome-instrument-stage>span{align-self:flex-end;font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:#a7acb9;position:relative;margin-top:5px}
.welcome-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:22px 0 30px}.welcome-actions button{position:relative;display:grid;grid-template-columns:1fr auto;text-align:left;row-gap:9px;padding:22px;min-height:156px;border:1px solid #37383f;border-radius:10px;background:linear-gradient(135deg,#1d1e24,#15161b);transition:transform .16s,border-color .16s,background .16s}.welcome-actions button:hover:not([aria-disabled=true]){border-color:#d24654;background:linear-gradient(135deg,#292026,#19191d);transform:translateY(-2px)}.welcome-actions button:first-child{border-color:#6c333d;background:linear-gradient(135deg,#301b24,#17171c)}.welcome-action-icon{color:#fa4053;margin-bottom:7px}.welcome-action-icon svg{width:29px;height:29px}.welcome-action-title{grid-column:1;font-size:19px;font-weight:650;line-height:1.3}.welcome-actions small{grid-column:1;font-size:13px;color:#a5a7b3;line-height:1.45}.welcome-action-arrow{grid-column:2;grid-row:2/4;align-self:center;color:#989ba7}.welcome-action-arrow svg{height:20px;width:20px}
.welcome-section-title{display:flex;justify-content:space-between;align-items:center;gap:14px;margin:0 0 14px}.welcome-section-title h2{font-size:18px;font-weight:650;margin:0}.welcome-section-title>span{color:#8e929f;font-size:12px}.welcome-recent{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.welcome-set{position:relative;overflow:hidden;min-height:152px;display:flex;flex-direction:column;align-items:stretch;text-align:left;padding:20px;border:1px solid #4e4431;border-radius:9px;background:linear-gradient(125deg,#373020,#1b1b1d)!important}.welcome-set>strong,.welcome-set>small{position:relative;z-index:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}.welcome-set>strong{font-size:18px;line-height:1.4}.welcome-set>small{font-size:12px;color:#bcb8ad;margin-top:4px}.welcome-set>.set-cover-instrument{width:88%!important;max-width:none!important;right:-12%!important;height:100%!important;opacity:.18!important;object-fit:contain!important}.welcome-set-meta{display:flex;justify-content:space-between;gap:10px;position:relative;z-index:1;border-top:1px solid #ffffff16;margin-top:auto;padding-top:14px;font-size:11px;color:#c1bbaf}.welcome-set-meta>span:last-child{font-size:10px;letter-spacing:.05em}.welcome-empty{grid-column:1/-1;padding:26px;border:1px dashed #45464e;border-radius:9px;color:#bcc0ca}.welcome-empty p{font-size:13px;color:#969baa;line-height:1.6;margin-bottom:0}
.welcome-bottom{display:flex;align-items:center;gap:18px;margin:24px 0 12px;padding:20px 24px;background:linear-gradient(120deg,#181b21,#131419);border:1px solid #363940;border-radius:10px}.welcome-midi-icon{display:grid;place-items:center;border:1px solid #444751;border-radius:50%;height:52px;width:52px;flex:none;color:#abb4c6}.welcome-midi-icon svg{width:25px;height:25px}.welcome-bottom>div{flex:1}.welcome-bottom h2{font-size:17px;margin:0 0 6px}.welcome-bottom p{font-size:13px;color:#969eae;margin:0;line-height:1.5}.welcome-bottom button{min-height:44px;font-size:13px}.welcome-access{display:flex;align-items:center;justify-content:flex-end;gap:16px;margin-top:12px;font-size:12px;color:#9298a5}.welcome-access button{background:transparent;border:0;color:#b8becb;font-size:12px;min-height:44px;text-decoration:underline;text-underline-offset:4px}
.welcome-signin{display:flex;align-items:center;gap:20px;margin-top:24px;padding:28px;background:#181a20;border:1px solid #3a3d47;border-radius:11px}.welcome-signin>div:first-child{color:#f44358;display:grid;place-items:center;width:50px;height:50px;background:#321d27;border-radius:11px;flex:none}.welcome-signin svg{width:28px;height:28px}.welcome-signin>div:nth-child(2){flex:1}.welcome-signin h2{font-size:21px;margin:0 0 9px}.welcome-signin p{font-size:14px;color:#a9aebb;margin:0;line-height:1.55}.welcome-signin button{min-height:46px}
/* Library keeps every action, with clearer groups and consistent card geometry. */
.library-heading{margin-bottom:20px}.library-heading h1{font-size:34px;font-weight:740}.library-overview span{background:#1b1d24;border-color:#333640;font-size:12px;color:#b5bac7}.library-heading>button{font-size:12px;min-height:40px;background:transparent}
.collection-actions{gap:8px;flex-wrap:wrap;padding:0 0 16px;border-bottom:1px solid #2c2f36}.collection-actions button{font-size:13px;min-height:42px}.collection-storage{font-size:12px;color:#a1a6b2;margin:12px 0}.collection-storage summary{cursor:pointer;width:fit-content}#collectionStatus:empty{display:none}
.library-view-switch{display:flex;gap:5px;padding:4px;width:fit-content;background:#17191f;border:1px solid #34363e;border-radius:9px;margin:18px 0}.library-view-switch button{border:0;border-radius:6px;color:#aab0bd;background:transparent;box-shadow:none!important;min-height:40px;padding:10px 20px}.library-view-switch button[aria-pressed=true]{background:#38313a;color:#fff}
#collectionPage .collection-browser{padding:0;border:0;background:transparent}.collection-filter-head{display:flex;gap:16px;align-items:center;margin:22px 0 12px}.collection-filter-head h2{margin:0;font-size:19px;white-space:nowrap}.collection-filter-head #collectionSetQuery{margin-left:auto;width:min(400px,55%);font-size:14px;height:44px}.collection-filter-head #collectionSetCount{font-size:12px;white-space:nowrap;margin:0}
.collection-categories{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;max-width:none;margin:0 0 20px}.collection-categories select,#collectionCardModel{width:100%;max-width:none;margin:0;min-height:44px;font-size:13px;padding:10px 12px}
#collectionSets{grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:16px;padding:2px;max-height:none;overflow:visible}.collection-set{border-radius:10px;background:#17191e;border:1px solid #3c3a35!important;padding:16px;gap:9px;transition:border-color .16s,box-shadow .16s}.collection-set:hover{border-color:#776347!important;box-shadow:0 10px 24px #0003}.collection-set .set-cover{min-height:112px;border-bottom:1px solid #ffffff16}.collection-set>strong{font-size:16px;letter-spacing:-.2px}.collection-set>small{font-size:12px;color:#a9adbb}.collection-set .set-cover .collection-info-button{background:#111318aa;color:#eee;border:1px solid #ffffff30;border-radius:50%;width:32px;height:32px;min-width:32px;min-height:32px;display:grid;place-items:center;padding:0;box-shadow:none}.collection-card-actions{gap:7px!important;padding-top:12px;border-top:1px solid #30313a}.collection-card-actions button{border-radius:6px;font-size:12px;min-height:40px}.collection-card-actions button:first-child{background:#30252c;border-color:#72505c}.collection-card-actions .collection-reveal{min-height:32px;background:transparent;border:0;font-size:11px;color:#a5aaba;padding:5px}.ram-meter-compact{background:#111318!important;border-color:#32353e!important;padding:12px!important}.ram-meter-compact .ram-track{height:7px;border-radius:3px}.ram-meter-compact .ram-meter-header{font-size:11px}.collection-warning{font-size:11px!important;color:#d2b278!important}.collection-memory-type{letter-spacing:.08em;font-size:10px!important}
/* Edit retains the paired source/target covers and hardware styling. */
#editorPage .compose-modes{border-radius:8px;background:#18191e;border:1px solid #363740;padding:4px;gap:4px;margin-bottom:18px}#editorPage .compose-modes button{font-size:14px;border-radius:5px;min-height:44px}#editorPage .editor-columns>article{background:#14161b;border-color:#36383f;padding:18px;border-radius:10px}#editorPage .compose-search input{min-height:44px;background:#1c1e25}#editorPage .editor-sound-display{border-color:#383b43;border-radius:7px;scrollbar-color:#5a5e6d #1b1e25}#editorPage .sound-choice{min-height:46px;background:#1b1d24;border-bottom-color:#30323c}#editorPage .sound-choice:hover{background:#262832}#editorPage .sound-choice[aria-pressed=true]{background:#3c2933;border-left-color:#fa4055}#editorPage .sound-choice strong{font-size:14px;font-weight:620}#editorPage .sound-slot{color:#a0a9bd;font-size:12px}#editorPage .bank-summary{color:#a3aabc;font-size:12px}#editorPage .local-edit-actions{gap:7px;padding-top:10px}#editorPage .local-edit-actions button{min-height:40px;font-size:12px;padding:8px 12px}#editorPage .editor-type-tabs{margin-top:10px}#editorPage .editor-type-tabs button{min-height:40px;font-size:13px}
#remotePage .remote-title h1{font-size:34px;font-weight:740}.remote-connection{background:#181a20;border-color:#3b3e48;border-radius:10px;padding:20px!important}.remote-connection summary{font-size:16px;font-weight:600;cursor:pointer}.remote-ports{gap:14px}.remote-ports label{font-size:11px;letter-spacing:.09em;color:#a2a9b8}.remote-ports select{font-size:14px;letter-spacing:0}.remote-panel{border-color:#363944;background:linear-gradient(145deg,#1b1e25,#14161b);border-radius:10px}.remote-panel h2{letter-spacing:-.3px}.remote-modes button{border-radius:6px;font-size:13px}.remote-caption{color:#a1a9b9;line-height:1.6;font-size:12px}.remote-tuning-link{padding:16px;background:#10131a;border:1px solid #343b49;border-radius:8px}.remote-workspace .realtime-bar{background:#141820}.remote-workspace .realtime-bar>small{max-width:850px}
@media(min-width:1700px){main{padding:34px 48px 0}.shell>aside{width:230px}}
@media(max-width:1100px){main{padding:24px}.shell>aside{width:190px;padding:20px 10px}.shell>aside nav>button{font-size:13px;gap:10px;padding:10px}.welcome-hero{padding:28px;grid-template-columns:1.2fr 1fr;min-height:225px}.welcome-actions button{padding:18px}.welcome-action-title{font-size:17px}.welcome-recent{gap:10px}.welcome-set{padding:16px}.welcome-set>strong{font-size:16px}.welcome-signin{flex-wrap:wrap}.welcome-signin button{margin-left:auto}.welcome-bottom{flex-wrap:wrap}.collection-filter-head{flex-wrap:wrap}.collection-filter-head h2{flex:1}.collection-filter-head #collectionSetQuery{order:3;width:100%;margin:0}}
@media(max-width:760px){.welcome-hero{grid-template-columns:1fr;gap:6px;padding:25px;min-height:0}.welcome-copy h1{font-size:34px;max-width:100%;margin:20px 0 10px}.welcome-instrument-stage{height:114px;align-items:flex-end}.welcome-instrument{width:78%;max-height:115px;transform:rotate(-2deg);object-fit:contain}.welcome-instrument-stage>span{display:none}.welcome-actions{grid-template-columns:1fr;gap:10px;margin-top:16px}.welcome-actions button{grid-template-columns:40px 1fr 20px;min-height:88px;column-gap:13px;row-gap:5px;padding:18px}.welcome-action-icon{grid-row:1/3;margin:0;align-self:center}.welcome-action-title,.welcome-actions small{grid-column:2}.welcome-action-arrow{grid-column:3;grid-row:1/3}.welcome-recent{grid-template-columns:1fr}.welcome-set{min-height:125px}.welcome-bottom{padding:18px;gap:13px}.welcome-bottom button{width:100%}.welcome-access{justify-content:space-between}.welcome-signin{padding:22px;gap:14px}.welcome-signin>div:nth-child(2){min-width:180px}.welcome-signin button{width:100%}.collection-categories{gap:7px}.collection-categories select{font-size:12px;padding:8px}.collection-set .set-cover .collection-info-button{height:44px;width:44px}.collection-card-actions button{min-height:44px}.collection-actions button{min-height:44px}}
@media(max-width:680px){body>header{padding:14px 16px;gap:10px}header .ready{display:none}.brand-line>span{font-size:17px}.shell>aside{width:100%;padding:10px 12px;background:#131419}.shell>aside nav{gap:5px}.shell>aside nav>button{min-height:40px;font-size:12px;padding:9px 10px;gap:7px}.shell>aside nav>button>svg{height:15px;width:15px}.shell>aside nav>.reference-navigation{margin:0;border:0;padding:0}.reference-navigation summary{min-height:40px;padding:10px}.reference-navigation[open]{width:100%}main{padding:20px 16px 0}.welcome-copy h1{font-size:30px}.welcome-hero{padding:23px}.welcome-copy p{font-size:14px}.welcome-signin h2{font-size:19px}.collection-filter-head{margin-top:14px}.library-heading>button{width:auto}.library-overview{gap:6px}.library-overview span{font-size:11px}.library-heading h1{font-size:30px}.collection-categories{grid-template-columns:repeat(3,minmax(0,1fr))}.collection-categories select{font-size:11px;padding:7px 4px}.library-view-switch{width:100%}.library-view-switch button{flex:1}.welcome-access{flex-wrap:wrap}.welcome-access>span{font-size:11px}}
@media(prefers-reduced-motion:reduce){.welcome-actions button,.collection-set,.shell>aside nav>button{transition:none}.welcome-actions button:hover{transform:none}}

.transfer-issues,#sampleCleanupItems{list-style:none;padding:0;max-height:42vh;overflow:auto}.transfer-issues li{display:grid;gap:6px;padding:13px 0;border-bottom:1px solid #353740}.transfer-issues li>span,.transfer-issues small{color:#b3b9c6;font-size:13px}#sampleCleanupItems li{padding:9px 0;border-bottom:1px solid #353740}
.transfer-issues li>select{width:100%;max-width:100%;min-width:0}.transfer-issues>button{margin:0 8px 8px 0}.transfer-issues>button:disabled{opacity:.8}

.import-progress {padding:14px 18px;background:#1b1b20;border:1px solid #34343e;border-radius:10px;margin:16px 0;}
.import-progress>div{display:flex;gap:16px;justify-content:space-between;align-items:center;}
.import-progress progress{display:block;width:100%;height:10px;margin-top:12px;accent-color:#ee2647;}
.import-choice{display:flex;gap:12px;align-items:flex-start;padding:14px;border:1px solid #34343e;background:#1b1b20;border-radius:8px;margin:8px 0;}
.import-choice input{flex:0 0 20px;width:20px;min-height:20px;margin-top:3px;accent-color:#ee2647;}
.import-choice span{min-width:0;}.import-choice strong,.import-choice small{display:block;overflow-wrap:anywhere;}.import-choice small{color:var(--muted);margin-top:4px;}
#collectionImportChoices{max-height:50vh;overflow:auto;}

@media(max-width:680px){
 footer{flex-wrap:wrap;gap:12px;line-height:1.6;}
 aside nav{gap:4px;}
 aside nav>button{padding:10px 9px;min-height:44px;}
 aside .reference-navigation{margin:2px 0;padding:6px 0;}
}

@media(max-width:680px){.remote-device{grid-template-columns:110px minmax(0,1fr);gap:16px}.remote-device #remoteBadge{grid-column:1/-1;justify-self:start;white-space:normal}.remote-device strong{font-size:20px}.remote-device #remoteMode{font-size:13px}}
/* One connection page, administrator diagnostics, explicit trash actions. */
#remotePage .remote-grid{grid-template-columns:minmax(0,1fr)}
.midi-exclusive-note{margin:12px 0;color:var(--muted,#a2a7b3);font-size:13px}
.admin-midi-tools{margin-top:32px;padding-top:24px;border-top:1px solid #34363f}
.admin-midi-tools[hidden]{display:none}
.admin-midi-tools .remote-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.admin-midi-tools h3{margin-top:0;font-size:18px}
.admin-midi-tools .remote-stop{margin-top:18px}
.library-trash-item>div:first-child{flex:1;min-width:0;overflow-wrap:anywhere}
.library-trash-item strong,.library-trash-item small{display:block}
.library-trash-item small{margin-top:5px;color:var(--muted,#a2a7b3)}
.library-trash-actions{display:flex;gap:8px;flex-wrap:wrap}
/* Extreme front-panel bank keys: A–G above H–N, shared by Edit and Simulation. */
#editorPage .editor-bank-buttons[data-layout=extreme],#hardwareEditor #hardwareBankKeys[data-layout=extreme]{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:10px 5px;min-width:0;width:100%;max-width:620px;margin:12px 0;align-items:stretch}
#editorPage .editor-bank-buttons[data-layout=extreme] button,#hardwareEditor #hardwareBankKeys[data-layout=extreme] button{display:flex;flex-direction:column;align-items:stretch;justify-content:flex-end;gap:3px;width:100%;min-width:0;height:58px;min-height:58px;padding:0;background:transparent;border:0;border-radius:0;box-shadow:none;outline:none;color:#d8dde2;text-align:center;line-height:1}
#editorPage .editor-bank-buttons[data-layout=extreme] button[aria-pressed=true],#hardwareEditor #hardwareBankKeys[data-layout=extreme] button[aria-pressed=true]{background:transparent;color:#fff;border:0;outline:none;box-shadow:none}
[data-layout=extreme] .bank-key-role{display:block;height:10px;font-size:9px;line-height:10px;letter-spacing:.08em;color:#a3adb5}
[data-layout=extreme] .bank-key-label{display:block;font-size:12px;line-height:15px;letter-spacing:.08em}
[data-layout=extreme] .bank-key-face{display:block;flex:none;height:24px;border:1px solid #080b0e;border-top-color:#607078;border-bottom:3px solid #080b0e;border-radius:1px;background:linear-gradient(#3e494f,#293238 65%,#222b30);box-shadow:inset 1px 0 #566269,inset -1px 0 #1b2429,0 1px 2px #0008}
[data-layout=extreme] button:hover:not(:disabled) .bank-key-face{background:linear-gradient(#58646c,#35434c);border-top-color:#94a0aa}
[data-layout=extreme] button[aria-pressed=true] .bank-key-face{background:linear-gradient(#7d3949,#482632);border-top-color:#ff6b7e;box-shadow:inset 0 2px #ff304a,inset 1px 0 #a75265,0 1px 2px #0008}
[data-layout=extreme] button:disabled{opacity:.38;cursor:default}
[data-layout=extreme] button.bank-absent .bank-key-face{border:1px dashed #73818b;border-bottom-width:3px}
#editorPage .editor-bank-buttons[data-layout=extreme] button:focus-visible,#hardwareEditor #hardwareBankKeys[data-layout=extreme] button:focus-visible{outline:2px solid #f3b5bd;outline-offset:3px}
#hardwareEditor .hardware-bank-select{align-items:center}
#editorPage .compose-card-title button{background:#252831;border:1px solid #555b68;border-radius:5px;color:#edf0f5;min-height:44px;padding:8px 11px;font-size:12px;line-height:1.25;box-shadow:0 1px 2px #0004}
#editorPage .compose-card-title button:hover:not(:disabled){background:#333844;border-color:#818b9f;color:#fff}
#editorPage .compose-card-title button:focus-visible{outline:2px solid #f3b5bd;outline-offset:3px}
@media(max-width:600px){#editorPage .compose-card-title .pane-role{flex-basis:100%;margin-bottom:3px}#editorPage .compose-card-title button{flex:1;min-width:0}}
/* Compact Edit workspace: primary controls stay visible; metadata expands on demand. */
body[data-page=editor] main,body[data-page=hardware] main{max-width:1800px;padding-top:20px}
#editorPage{max-width:none}
#editorPage .compose-heading{gap:14px;align-items:center;margin:0 0 10px}
#editorPage .compose-heading>div:first-child{min-width:0;flex:1}
#editorPage #editorSetIdentity{min-height:100px;padding:16px 20px;border-radius:7px}
#editorPage .editor-set-identity #editorSourceName{font-size:25px;line-height:1.2;letter-spacing:-.4px}
#editorPage .editor-set-identity .editor-set-text{display:grid;grid-template-columns:minmax(0,1fr);align-items:center;gap:4px;max-width:60%}
#editorPage #editorSourceName{grid-column:1/-1}
#editorPage #editorProjectState,#editorPage #editorFileDetails{font-size:12px;line-height:1.4;max-width:none;margin:0}
#editorPage #editorSetIdentity>.set-cover-instrument{width:40%!important;opacity:.5}
#editorPage #editorHistory{display:flex;flex:0 0 auto;gap:5px;justify-content:flex-end}
#editorPage #editorHistory button{min-height:40px;padding:8px 10px;font-size:12px}
#editorPage .compose-modes{margin:0 0 10px;padding:3px;gap:4px;border-radius:7px}
#editorPage .compose-modes button{min-height:42px;padding:7px 10px;font-size:13px;flex:0 1 auto}
#editorPage #editorSaveMode{margin-left:auto;min-width:130px;flex:0 0 auto}
#editorPage .editor-transfer-controls{margin:8px 0 10px;padding:7px 12px;gap:8px 12px;border-radius:7px}
#editorPage .editor-transfer-controls>label{font-size:12px;color:#b6becb}
#editorPage .editor-transfer-controls select{margin:0;font-size:13px;min-width:200px;min-height:38px;padding:6px 10px}
#editorPage .editor-transfer-controls button{min-height:38px;font-size:12px;padding:7px 10px}
#editorPage .transfer-details{margin-left:auto;min-width:0}
#editorPage .transfer-details summary,#editorPage .bank-details summary,#editorPage .ram-details summary{cursor:pointer;color:#bac4d4;font-size:12px;min-height:32px;display:list-item;align-content:center;white-space:nowrap}
#editorPage .transfer-details[open]{flex-basis:100%;margin-left:0}
#editorPage .transfer-details p{font-size:12px;line-height:1.5;margin:4px 0;color:#adb7c6}
#editorPage #editorRamBar{margin:0 0 8px}
#editorPage .ram-meter-inline{display:grid;grid-template-columns:auto minmax(80px,1fr) auto;align-items:center;gap:8px 14px;padding:6px 12px;margin:0;border:1px solid #363a42;border-radius:7px;min-height:44px;background:#13171a}
#editorPage .ram-meter-inline .ram-meter-header{grid-column:1;grid-row:1;gap:12px;font-size:12px;margin:0}
#editorPage .ram-meter-inline .ram-track{grid-column:2;grid-row:1;height:7px;margin:0;border-radius:3px}
#editorPage .ram-details{grid-column:3;grid-row:1}
#editorPage .ram-details[open]{grid-column:1/-1;grid-row:2}
#editorPage .ram-details-content{display:flex;flex-wrap:wrap;gap:6px 20px;padding:6px 0 2px;color:#adb7c6;font-size:12px}
#editorPage .ram-details-content small{font-size:12px;margin:0}
#editorPage .ram-warning{grid-column:1/-1;font-size:12px;margin:0;color:#f0bd74}
#editorPage .editor-columns{gap:14px}
#editorPage .editor-columns>article{padding:12px 14px;border-radius:8px}
#editorPage .compose-card-title{margin:0;min-height:40px;gap:6px}
#editorPage .compose-card-title button{min-height:38px;padding:7px 10px}
#editorPage .pane-role{font-size:10px;letter-spacing:1px}
#editorPage .pane-context{min-height:84px;gap:8px}
#editorPage .pane-instrument.instrument-set-cover{min-height:84px;padding:12px 14px}
#editorPage .pane-instrument strong{font-size:19px;line-height:1.2}
#editorPage .pane-instrument .set-cover-instrument{width:62%!important;opacity:.46}
#editorPage .pane-instrument>div{min-width:0;max-width:65%}
#editorPage .pane-instrument small{font-size:11px;margin-top:2px}
#editorPage .compose-source-actions{gap:5px}
#editorPage .compose-source-actions button{min-height:34px;padding:6px 9px;font-size:11px}
#editorPage .compose-search input{min-height:38px;height:38px;font-size:14px}
#editorPage .editor-type-tabs{margin-top:0}
#editorPage .editor-type-tabs button{min-height:36px;padding:7px 14px;font-size:12px}
#editorPage .editor-bank-buttons[data-layout=extreme]{gap:5px;margin:4px 0}
#editorPage .editor-bank-buttons[data-layout=extreme] button{height:48px;min-height:48px}
#editorPage .pane-statistics{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:5px 10px;min-height:32px;font-size:12px}
#editorPage .pane-statistics #editorTargetCount,#editorPage .pane-statistics #editorSourceCount{margin:0!important;font-size:12px}
#editorPage .bank-details[open]{flex-basis:100%}
#editorPage .bank-details .bank-summary{margin:4px 0 6px;font-size:12px;line-height:1.5}
#editorPage .local-edit-actions{margin:0;padding-top:4px;gap:6px}
@media(min-width:1000px){
 #editorPage[data-flow=import] .editor-columns{grid-template-rows:repeat(8,auto);gap:0 14px}
 #editorPage[data-flow=import] .editor-columns>article{grid-row:1/span 8;row-gap:6px}
 #editorPage[data-flow=import] .editor-type-tabs{grid-row:3}
 #editorPage[data-flow=import] .editor-bank-buttons{grid-row:4}
 #editorPage[data-flow=import] .pane-statistics{grid-row:5}
 #editorPage[data-flow=import] .editor-sound-display{grid-row:6}
 #editorPage[data-flow=import] .compose-selection{grid-row:7}
 #editorPage[data-flow=import] .local-edit-actions,#editorPage[data-flow=import] #editorPreview{grid-row:8}
 #editorPage .editor-sound-display,#editorPage[data-flow=import] .editor-sound-display{height:clamp(240px,calc(100dvh - 460px),520px)!important;min-height:240px!important}
}
@media(max-width:1100px){
 #editorPage .compose-heading{flex-wrap:wrap;gap:8px}
 #editorPage .compose-heading>div:first-child{flex-basis:100%}
 #editorPage #editorHistory{margin-left:auto}
 #editorPage .compose-modes{flex-wrap:wrap}
 #editorPage .compose-modes button{flex:1 1 auto;min-height:44px}
 #editorPage #editorSaveMode{min-width:140px}
 #editorPage .compose-search input,#editorPage .compose-card-title button,#editorPage .editor-transfer-controls button,#editorPage .editor-transfer-controls select{min-height:44px}
}
@media(max-width:600px){
 #editorPage #editorSetIdentity{min-height:76px;padding:12px}
 #editorPage #editorSourceName{font-size:23px}
 #editorPage .editor-set-text{max-width:100%;grid-template-columns:1fr;gap:3px}
 #editorPage #editorSetIdentity>.set-cover-instrument{width:50%!important;opacity:.18}
 #editorPage #editorFileDetails{font-size:11px}
 #editorPage #editorHistory{width:100%;justify-content:flex-start;flex-wrap:wrap}
 #editorPage #editorHistory button{flex:1;min-height:44px}
 #editorPage .ram-meter-inline{grid-template-columns:minmax(0,1fr) auto;gap:4px 12px}
 #editorPage .ram-meter-inline .ram-meter-header{grid-column:1;min-width:0;font-size:11px}
 #editorPage .ram-details{grid-column:2;grid-row:1}
 #editorPage .ram-meter-inline .ram-track{grid-column:1/-1;grid-row:2}
 #editorPage .ram-details[open]{grid-column:1/-1;grid-row:3}
 #editorPage .ram-details summary,#editorPage .bank-details summary,#editorPage .transfer-details summary{min-height:40px}
 #editorPage .editor-transfer-controls{gap:8px}
 #editorPage .editor-transfer-controls select{width:100%;min-width:0}
 #editorPage .editor-transfer-controls>label{flex-basis:100%}
 #editorPage .editor-transfer-controls button{width:auto;flex:1}
 #editorPage .transfer-details{margin-left:0}
 #editorPage .compose-card-title{row-gap:4px}
}
#libraryPurge{max-width:560px}#libraryPurge strong{display:block;overflow-wrap:anywhere}
#libraryPurgeConfirm{background:#632333;color:#fff;border-color:#cf445a}
@media(max-width:800px){.admin-midi-tools .remote-grid{grid-template-columns:minmax(0,1fr)}}
.family-fields{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:18px 0}.family-fields label{display:flex;flex-direction:column;gap:7px}.family-fields select,.family-fields input{width:100%;min-width:0}.rom-capabilities{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;margin:20px 0}.rom-capabilities div{padding:14px;border:1px solid var(--border,#30333b);border-radius:10px;background:#15171e}.rom-capabilities strong,.rom-capabilities small{display:block}.rom-capabilities small{margin-top:6px;color:#a7afc0}.family-audit-results{max-height:440px;overflow:auto}#romCatalog{margin-top:24px;padding:20px;border:1px solid #30333b;border-radius:14px}#romCatalog summary{font-weight:600;cursor:pointer}#romCatalog .family-fields{grid-template-columns:repeat(4,minmax(0,1fr))}@media(max-width:900px){.rom-capabilities{grid-template-columns:repeat(3,minmax(0,1fr))}.family-fields,#romCatalog .family-fields{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:540px){.rom-capabilities{grid-template-columns:repeat(2,minmax(0,1fr))}.family-fields,#romCatalog .family-fields{grid-template-columns:1fr}#romCatalog{padding:12px}}

/* Compact bank toolbar and shared edit history. */
#editorPage .compose-modes #editorHistory{margin-left:0;gap:4px;display:flex;flex:0 0 auto}
#editorPage .compose-modes #editorHistory button{flex:0 0 auto;min-height:42px}
#editorPage .compose-card-title{display:flex;flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:6px;margin-bottom:0}
#editorPage .compose-card-title .pane-role{margin-right:auto;flex:0 0 auto}
#editorPage .pane-toolbar-search{flex:1 1 105px;width:105px;max-width:200px;min-width:90px;height:38px;min-height:38px;padding:7px 9px;font-size:13px;margin:0}
#editorPage .compose-card-title button{flex:0 0 auto;font-size:11px;padding:7px 8px;min-height:38px}
#editorPage .editor-type-tabs{border:0;display:flex;gap:6px;padding:0;margin:0}
#editorPage .editor-type-tabs button{background:#252831;color:#c3ccd9;border:1px solid #555b68;border-radius:6px;min-height:38px;padding:7px 15px;margin:0;box-shadow:none}
#editorPage .editor-type-tabs button.active,#editorPage .editor-type-tabs button[aria-pressed=true]{background:#3a2730;color:#fff;border-color:#ed334e;box-shadow:inset 0 2px #ed334e}
@media(max-width:1450px) and (min-width:1000px){
 #editorPage .compose-card-title .pane-role{flex-basis:100%;font-size:10px}
 #editorPage .pane-toolbar-search{max-width:none}
}
@media(max-width:1100px){
 #editorPage .compose-modes #editorHistory button{min-height:44px}
 #editorPage .compose-card-title button,#editorPage .pane-toolbar-search,#editorPage .editor-type-tabs button{min-height:44px}
}
@media(max-width:600px){
 #editorPage .editor-set-identity #editorSourceName{font-size:23px}
 #editorPage .compose-modes #editorHistory{width:auto;margin-left:auto}
 #editorPage .compose-modes #editorHistory button{flex:0 0 auto}
 #editorPage .pane-toolbar-search{flex-basis:100%;max-width:none}
 #editorPage .compose-card-title button{flex:1 1 auto}
}

#editorPage .transfer-details{margin-top:0;margin-bottom:0}
#editorPage .source-menu{position:relative;margin:0;align-self:center;flex:0 0 auto}
#editorPage .source-menu>summary{display:block;list-style:none;cursor:pointer;background:#252831;border:1px solid #555b68;border-radius:6px;padding:10px;font-size:12px;min-height:38px;box-sizing:border-box;color:#c3ccd9}
#editorPage .source-menu>summary::-webkit-details-marker{display:none}
#editorPage .source-menu-options{position:absolute;right:0;top:calc(100% + 5px);z-index:20;padding:6px;display:grid;gap:5px;background:#1c1f26;border:1px solid #555b68;border-radius:7px;box-shadow:0 8px 20px #0006;min-width:150px}
#editorPage .source-menu-options button{width:100%;text-align:left;min-height:40px}
#editorPage .source-menu>summary:focus-visible{outline:2px solid #f56579;outline-offset:2px}
@media(min-width:1101px){
 body[data-page=editor] main{padding-top:12px}
 #editorPage #editorSetIdentity{min-height:100px;padding:16px 20px}
 #editorPage .pane-context{min-height:84px}
}

#editorPage .compose-save-actions{display:flex;flex:0 0 auto;gap:4px;margin-left:auto;align-items:center}
#editorPage .compose-save-actions #editorSaveMode{margin-left:0}
#editorPage .compose-save-actions #editorHistory{margin:0;width:auto}
@media(max-width:1100px){
 #editorPage .compose-save-actions{justify-content:flex-end}
 #editorPage .pane-toolbar-search{flex-basis:90px}
}
@media(max-width:600px){
 #editorPage .compose-save-actions{width:100%;justify-content:space-between}
 #editorPage .compose-save-actions #editorSaveMode{min-width:0;flex:1 1 auto}
 #editorPage .pane-toolbar-search{flex-basis:100%}
}

#editorPage .compose-save-actions #editorHistory{flex-wrap:nowrap}
@media(max-width:600px){
 #editorPage .compose-save-actions{grid-column:1/-1;min-width:0}
 #editorPage .compose-save-actions #editorSaveMode{white-space:nowrap;font-size:12px;padding:7px 8px}
 #editorPage .compose-save-actions #editorHistory button{font-size:11px;padding:7px 8px}
}

/* Bank-sized columns; transfer settings belong to the source action. */
#editorPage .editor-columns{width:100%;max-width:874px;margin-inline:auto}
#editorPage[data-flow=arrange] .editor-columns{max-width:430px;margin-left:0}
#editorPage .source-transfer-actions{min-width:0;display:flex;flex-direction:column;gap:6px;align-self:start}
#editorPage .source-transfer-actions .editor-transfer-controls{margin:0;padding:8px;gap:6px;display:flex;flex-wrap:wrap}
#editorPage .source-transfer-actions .editor-transfer-controls>label{font-size:11px}
#editorPage .source-transfer-actions .editor-transfer-controls select{min-width:140px;flex:1 1 140px;font-size:12px}
#editorPage .source-transfer-actions .editor-transfer-controls button{padding:7px 8px;font-size:11px}
#editorPage .source-transfer-actions .transfer-details{flex-basis:100%;margin:0}
#editorPage .source-transfer-actions #editorPreview{width:100%;min-height:44px}
@media(min-width:1000px){
 #editorPage[data-flow=import] .source-transfer-actions{grid-row:8}
}
@media(max-width:999px){
 #editorPage .editor-columns{max-width:600px}
 #editorPage[data-flow=arrange] .editor-columns{max-width:600px;margin-inline:auto}
}

/* Sound actions follow the editing sequence; settings stay beside sound type. */
#editorPage .pane-mode-bar{display:flex;flex-wrap:wrap;align-items:center;gap:6px;min-width:0}
#editorPage .pane-mode-bar .editor-type-tabs{grid-row:auto}
#editorPage .pane-mode-bar #editorWorkspaceSound{margin-left:auto;min-height:38px;padding:7px 9px;font-size:11px;border:1px solid #555b68;background:#252831;border-radius:6px}
#editorPage .local-edit-actions button{font-size:11px;padding:7px 9px;min-height:38px}
@media(min-width:1000px){#editorPage[data-flow=import] .pane-mode-bar{grid-row:3}}
@media(max-width:1100px){#editorPage .local-edit-actions button,#editorPage .pane-mode-bar #editorWorkspaceSound{min-height:44px}}

/* Lists use the available desktop width; bank controls stay aligned inside each pane. */
#editorPage .editor-columns,#editorPage[data-flow=arrange] .editor-columns{max-width:none;width:100%;margin-inline:0}
#editorPage .local-edit-actions{display:flex;flex-wrap:wrap;justify-content:flex-start;gap:6px}
#editorPage .local-edit-actions button{flex:0 0 auto;white-space:nowrap}
#editorPage .pane-mode-bar #editorWorkspaceSound{white-space:nowrap}
@media(max-width:999px){
 #editorPage .editor-columns,#editorPage[data-flow=arrange] .editor-columns{max-width:none}
}

/* Keep bank selection and clearing together rather than wrapping individual buttons. */
#editorPage .compose-card-title{gap:8px;padding-bottom:2px}
#editorPage .bank-selection-actions{display:flex;flex:0 0 auto;gap:6px;align-items:center;flex-wrap:nowrap;min-width:0}
#editorPage .bank-selection-actions button{flex:0 0 auto;white-space:nowrap}
#editorPage .pane-toolbar-search{flex:1 1 105px;max-width:none}
#editorPage .editor-columns>article{padding:14px 16px}
#editorPage .pane-mode-bar{gap:8px;padding:2px 0}
@media(max-width:600px){
 #editorPage .compose-card-title .pane-toolbar-search{flex-basis:100%}
 #editorPage .bank-selection-actions{width:100%;justify-content:flex-end}
 #editorPage .bank-selection-actions button{flex:1 1 auto;min-width:0;padding:7px}
}

/* The working-set card keeps the same layout as its import counterpart. */
#editorPage[data-flow=arrange] .editor-target .pane-context{display:flex}
@media(min-width:1000px){
 #editorPage[data-flow=arrange] .editor-columns{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:repeat(8,auto);gap:0 14px}
 #editorPage[data-flow=arrange] .editor-target{display:grid!important;grid-column:1;grid-row:1/span 8;grid-template-rows:subgrid;row-gap:6px}
 #editorPage[data-flow=arrange] .pane-mode-bar{grid-row:3}
 #editorPage[data-flow=arrange] .editor-bank-buttons{grid-row:4}
 #editorPage[data-flow=arrange] .pane-statistics{grid-row:5}
 #editorPage[data-flow=arrange] .editor-sound-display{grid-row:6}
 #editorPage[data-flow=arrange] .compose-selection{grid-row:7}
 #editorPage[data-flow=arrange] .local-edit-actions{grid-row:8}
}

#editorPage[data-flow=arrange] .editor-target .pane-instrument{display:flex}

/* A touch target for real tablets, independent of portrait/landscape width. */
header #tabletFullscreen{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-width:44px;min-height:44px;white-space:nowrap;font-size:12px}
header #tabletFullscreen[hidden]{display:none!important}
#tabletFullscreen svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}
#tabletFullscreen[aria-pressed=true]{background:#3a2730;border-color:#ed334e;color:#fff}
@media(max-width:1100px){header #tabletFullscreen span{display:none}header #tabletFullscreen{padding:10px}}
:root:fullscreen{background:#0d0e11;overflow:auto}
:root:-webkit-full-screen{background:#0d0e11;overflow:auto}

#appToast{border-left-color:#40d28b}
#appToast[data-type=success],#appToast[data-type=info]{background:#172a23;border-color:#396752;border-left:4px solid #40d28b}
#appToast[data-type=error]{background:#2b1b21;border-color:#81414e;border-left:4px solid #ff4058}
#appToast .toast-copy{display:flex;flex-direction:column;gap:2px;min-width:0}
#appToastLabel{font-size:12px;color:#84e4b1;line-height:1.4}
#appToast[data-type=error] #appToastLabel{color:#ff8797}

/* Disable double-tap page zoom, including inside independently scrolling lists.
   Keep panning and pinch zoom; specific gesture surfaces retain their own rules. */
:where(html,body,body *){touch-action:manipulation}

/* Portrait tablets use the whole width; landscape keeps the side navigation. */
@media(orientation:portrait) and (max-width:1400px){
 .shell{display:block}
 .shell>aside{position:static;width:100%;height:auto;overflow:visible;padding:10px 16px;border-right:0;border-bottom:1px solid var(--border)}
 .shell>aside nav{display:flex;flex-wrap:nowrap;align-items:center;gap:4px;overflow-x:auto}
 .shell>aside nav>button{min-height:44px;padding:10px 12px;gap:8px;white-space:nowrap}
 .shell>aside nav>.reference-navigation{margin:0;padding:0;border:0}
 .shell>aside .reference-navigation summary{min-height:44px;padding:12px;white-space:nowrap}
 .shell>aside .reference-navigation[open]{width:100%}
 .shell>aside .reference-navigation[open]>button{display:inline-flex;min-height:44px;padding:10px 12px}
 .shell>aside .sidebar-note,.shell>aside>.eyebrow{display:none}
}
@media(orientation:portrait) and (max-width:900px){
 .shell>aside{padding:8px 12px}
 .shell>aside nav>button{flex-shrink:0;padding:10px 8px;font-size:12px;gap:0}
 .shell>aside nav>button>svg{display:none}
 .shell>aside .reference-navigation{flex-shrink:0}
 .shell>aside .reference-navigation summary{font-size:12px;padding:12px 8px}
}

/* Tablets compare source and destination together, with aligned list headings. */
#collectionPage #collectionWorkingSet{display:block;position:relative;width:100%;min-height:100px;padding:16px 20px;margin:0 0 10px;border:0;border-radius:7px;text-align:left;background:linear-gradient(90deg,#58451a 0%,#40331c 35%,#251f1466 65%,transparent 100%)!important}
#collectionPage #collectionWorkingSet[data-origin=preload]{background:linear-gradient(90deg,#35222d 0%,#242635 35%,#24263566 65%,transparent 100%)!important}
#collectionPage #collectionWorkingSet>.set-cover-instrument{width:40%!important;right:0;object-position:right center;opacity:.5;mask-image:linear-gradient(90deg,transparent,#000 35%,#000 55%,transparent 100%)}
#collectionPage #collectionWorkingSet .editor-set-text{position:relative;display:grid;gap:4px;max-width:60%;min-width:0}
#collectionPage #collectionWorkingSet .working-set-name{font-family:'Arial Black','Segoe UI',sans-serif;font-weight:900;font-size:25px;line-height:1.2;letter-spacing:-.4px;color:#fff;overflow-wrap:anywhere}
#collectionPage #collectionWorkingSet small{font-size:12px;line-height:1.4;margin:0;color:#d2d0c9}
#collectionPage #collectionWorkingSet .working-set-link{position:absolute;right:16px;bottom:10px;font-size:11px;color:#ddd}
body[data-page=collection] #activeSetBar{display:none}
@media(max-width:560px){#collectionPage #collectionWorkingSet .editor-set-text{max-width:100%}#collectionPage #collectionWorkingSet>.set-cover-instrument{opacity:.18}#collectionPage #collectionWorkingSet{padding-bottom:32px}}
@media(min-width:700px) and (max-width:1400px){
 body>header{flex-wrap:nowrap;padding:12px 16px;gap:8px;min-height:70px}
 body>header .brand-lockup{min-width:0;margin-right:auto}
 body>header .ready{display:none}
 body>header button{flex:0 0 auto;white-space:nowrap;min-height:44px}
 body>header #globalSave{font-size:12px;padding:8px}
 body>header #preferencesButton,body>header #guideButton{font-size:0;width:44px;min-width:44px;padding:8px}
 body>header #preferencesButton:after{content:'⚙';font-size:20px}
 body>header #guideButton:after{content:'?';font-size:20px}
 body>header #tabletFullscreen span{display:none}
 #editorPage .compose-modes{flex-wrap:nowrap;overflow-x:auto;gap:4px}
 #editorPage .compose-modes>button{flex:0 0 auto;white-space:nowrap;font-size:12px;padding:8px;min-width:0}
 #editorPage .compose-save-actions{flex:0 0 auto;width:auto;margin-left:auto;white-space:nowrap}
 #editorPage .compose-save-actions #editorSaveMode{flex:0 0 auto;min-width:0;font-size:12px;padding:8px}
 #editorPage .compose-modes #editorHistory button{font-size:0;min-width:44px;width:44px;padding:8px}
 #editorPage #editorUndo:after{content:'↶';font-size:20px}
 #editorPage #editorRedo:after{content:'↷';font-size:20px}
 #collectionPage .collection-actions,#collectionPage .library-view-switch{flex-wrap:nowrap;overflow-x:auto}
 #collectionPage .collection-actions>button,#collectionPage .library-view-switch>button{flex:0 0 auto;white-space:nowrap;min-height:44px;font-size:12px;padding:8px}
}
@media(min-width:700px) and (max-width:999px){
 #editorPage[data-flow=import] .editor-mobile-tabs{display:none!important}
 #editorPage[data-flow=import] .editor-columns{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(8,auto);gap:0 10px;align-items:stretch}
 #editorPage[data-flow=import] .editor-columns>article{display:grid!important;grid-row:1/span 8;grid-template-rows:subgrid;row-gap:6px;padding:12px;min-width:0}
 #editorPage[data-flow=import] .editor-target{grid-column:1}
 #editorPage[data-flow=import] .editor-source{grid-column:2}
 #editorPage[data-flow=import] .compose-card-title{grid-row:1}
 #editorPage[data-flow=import] .pane-context{grid-row:2}
 #editorPage[data-flow=import] .pane-mode-bar{grid-row:3}
 #editorPage[data-flow=import] .editor-bank-buttons{grid-row:4}
 #editorPage[data-flow=import] .pane-statistics{grid-row:5}
 #editorPage[data-flow=import] .editor-sound-display{grid-row:6;height:380px!important;min-height:280px!important}
 #editorPage[data-flow=import] .compose-selection{grid-row:7}
 #editorPage[data-flow=import] .local-edit-actions,#editorPage[data-flow=import] .source-transfer-actions{grid-row:8}
 #editorPage[data-flow=import] .compose-card-title .pane-role{flex-basis:100%}
 #editorPage[data-flow=import] .pane-toolbar-search{flex-basis:100%}
 #editorPage[data-flow=import] .bank-selection-actions{flex-wrap:wrap;width:100%;justify-content:flex-start}
 #editorPage[data-flow=import] .bank-selection-actions button{font-size:11px;padding:7px}
 #editorPage[data-flow=import] .sound-choice{grid-template-columns:44px minmax(0,1fr);gap:8px;padding:8px;font-size:13px}
 #editorPage[data-flow=import] .sound-choice strong{font-size:13px}
 #editorPage[data-flow=import] .sound-choice small{display:none}
}