/* Shared pack geometry: artwork is always a real square image. */
#home-bank-manager .pack-cover-frame{aspect-ratio:1/1;display:block;overflow:hidden;flex-shrink:0;background:#292238;border-radius:10px}
#home-bank-manager .pack-cover-image{display:block;width:100%;height:100%;object-fit:cover;aspect-ratio:1/1}
#home-bank-manager .pack-toolbar{align-items:center;gap:10px;flex-wrap:wrap}
#home-bank-manager .pack-toolbar .wh-segments{min-width:0;flex:1 1 auto}
#home-bank-manager .pack-grid{align-items:start}
#home-bank-manager .pack-tile{min-width:0;max-width:100%}
#home-bank-manager .pack-detail-head>div{min-width:0}
#home-bank-manager .pack-detail-head h2{overflow-wrap:anywhere}
.pack-artwork-dialog .ui-dialog-body>img{display:block;width:min(100%,340px);height:auto;aspect-ratio:1/1;margin:auto;border-radius:12px}
.pack-artwork-dialog .pack-actions{flex-wrap:wrap;justify-content:center}
.pack-artwork-dialog p{text-align:center}

/* The small command row keeps the project title and transport in their places. */
.studio-menubar{height:30px;display:flex;align-items:center;padding:0 14px;border-bottom:1px solid var(--line);background:var(--panel);gap:2px}
.studio-menubar>button{height:26px;padding:3px 11px;font-size:12px;color:var(--text)}
.studio-menubar>button[aria-expanded=true]{background:color-mix(in srgb,#cfb4ed 13%,var(--raised));color:#cfb4ed}

.studio-command-menu{position:fixed;inset:auto;margin:0;padding:5px;width:264px;max-width:calc(100vw - 16px);max-height:calc(100dvh - 16px);overflow:auto;border:1px solid var(--line);border-radius:9px;background:var(--panel);color:var(--text);box-shadow:0 12px 40px #0006}
.studio-command-menu>button{display:flex;width:100%;justify-content:space-between;text-align:left;padding:9px 10px;gap:14px;font-size:12px;min-height:34px;white-space:normal}
.studio-command-menu>button:focus{outline:0;background:color-mix(in srgb,#cfb4ed 13%,var(--raised))}
.studio-command-menu>button[aria-disabled=true]{opacity:.4;cursor:default}
.studio-command-menu kbd{font:10px var(--font-ui);white-space:nowrap;color:var(--muted);border:0;background:transparent;padding:0}
.studio-command-menu hr{border:0;border-top:1px solid var(--line);margin:5px}

/* Sound shaping: familiar range inputs, grouped into three small playgrounds. */
.pack-designer .designer-source{margin:0 0 12px}
.pack-designer .designer-performance{margin:12px 0 18px}
.pack-designer .designer-shaping{border:1px solid #64516f;border-radius:12px;padding:12px;margin:12px 0 18px;background:#201e2845}
.designer-shaping-tabs{display:flex;gap:4px;border-bottom:1px solid #64516f;padding-bottom:9px}
.designer-shaping-tabs>button{flex:1;min-height:34px;font-size:12px;color:#cbbbd7}
.designer-shaping-tabs>button[aria-selected=true]{background:#665171;color:#fff1fd}
.pack-designer [role=tabpanel][hidden]{display:none}
.pack-designer .designer-control-cards{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:12px 0}
.pack-designer .designer-control-card{grid-template-columns:1fr auto;gap:8px 4px;align-items:center;padding:10px;border:1px solid #6d577047;border-radius:10px;background:#9b84ac0a;font-size:11px}
.pack-designer .designer-control-card:hover{border-color:#997bad;background:#9b84ac14}
.designer-control-icon{grid-column:1/-1;display:grid;place-items:center;height:30px;color:#d7b3e4}
.designer-control-icon .designer-icon,.designer-waves .designer-icon,.designer-presets .designer-icon{width:32px;height:28px;font-size:28px}
.pack-designer .designer-control-card output{font-size:10px;min-height:0;white-space:nowrap;color:#e1cba2}
.pack-designer .designer-control-card input[type=range]{grid-column:1/-1;width:100%;height:5px;margin:6px 0;background:linear-gradient(to right,#c3a0dc var(--control-fill,0%),#514558 var(--control-fill,0%));cursor:ew-resize}
.pack-designer .designer-control-card input[type=range]::-webkit-slider-thumb{background:#e3cfec;width:12px;height:12px;box-shadow:0 0 0 3px #44354d}
.designer-wave-row{display:flex;gap:16px;align-items:center;flex-wrap:wrap}
.designer-wave-row fieldset{padding:0;border:0;margin:0;min-width:0;flex:1}
.designer-wave-row legend,.designer-wave-row label,.designer-choice{font-size:11px;color:#cbbbd7}
.designer-wave-row label{display:grid;gap:6px}
.designer-waves{display:flex;gap:5px;margin-top:6px}
.designer-waves>button{flex:1;border:1px solid #65546e;height:36px;padding:4px 8px;color:#c4b0d3}
.designer-waves>button[aria-pressed=true]{background:#594362;color:#f2d8fa;border-color:#b994cf}
.designer-choice{display:flex;align-items:center;gap:10px;min-height:44px}
.designer-choice select{flex:1;max-width:220px}
.pack-designer .designer-starting-points{border-top:1px solid #65546e;padding-top:14px;margin-top:16px}
.designer-starting-points>small{font-size:9px;letter-spacing:1.5px}
.pack-designer .designer-presets{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:4px;margin-top:8px}
.pack-designer .designer-presets>button{display:flex;flex-direction:column;gap:4px;padding:8px 3px;font-size:10px;border:1px solid #65546e70;min-width:0}
.designer-presets .ph-icon{width:25px;height:22px;font-size:22px;color:#d1afd9}
.pack-designer .designer-crate article>span{flex:1}
.designer-crate [data-preview-draft]{min-width:28px;min-height:30px;color:#d7b3e4}
@media(max-width:1150px) and (min-width:1001px){.pack-designer .designer-control-cards{grid-template-columns:repeat(3,minmax(0,1fr))}.pack-designer .designer-presets{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:760px){.studio-menubar{padding:0 6px}.studio-menubar>button{padding:3px 10px}}
@media(max-width:600px){.pack-designer .designer-control-cards{grid-template-columns:repeat(2,minmax(0,1fr))}.pack-designer .designer-control-card{padding:8px}.pack-designer .designer-shaping{padding:8px}.pack-designer .designer-presets{grid-template-columns:repeat(4,minmax(0,1fr))}.designer-control-icon{height:23px}.pack-designer .designer-key{display:none}.pack-designer .designer-performance{grid-template-columns:minmax(0,1fr)}.pack-designer .designer-touchpad{min-height:128px}.pack-designer .designer-performance canvas{height:62px}.pack-designer .designer-live-help{margin:5px 0}.pack-designer .designer-layout{gap:12px}.pack-designer>header{margin-bottom:12px}.pack-designer h2{font-size:22px}.pack-designer>header p{font-size:12px;margin-bottom:0}}

.pack-designer>header{margin-bottom:14px}
.pack-designer .designer-instrument{padding:14px}
.pack-designer .designer-touchpad{min-height:136px}
.pack-designer .designer-control-card{gap:5px 4px;padding:8px}
.pack-designer .designer-control-icon{height:24px}
.pack-designer .designer-control-cards{row-gap:8px}
.pack-designer .designer-play{padding-top:10px}
.pack-designer .designer-starting-points{margin-top:10px;padding-top:10px}
.pack-designer .designer-shaping{margin-bottom:12px}
@media(max-width:600px){
 #home-bank-manager .catalog-library-actions:has([data-refresh]){display:none}
 .pack-designer .designer-performance{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:8px;margin:8px 0}
 .pack-designer .designer-touchpad{min-height:142px}
 .pack-designer .designer-touchpad>span{font-size:13px;text-align:center;max-width:80px}
 .pack-designer .designer-touchpad small{font-size:8px}
 .pack-designer .designer-live-help{display:none}
 .pack-designer .designer-live-buttons{margin-top:6px;gap:4px}
 .pack-designer .designer-live-buttons button{font-size:10px;padding:5px 6px;min-height:30px}
 .pack-designer .designer-performance canvas{height:46px}
 .pack-designer .designer-control-card{gap:4px;padding:7px}
}

#home-bank-manager .designer-controls label,#home-bank-manager .designer-wave-row label,#home-bank-manager .designer-play label{margin:0}
#home-bank-manager .designer-wave-row fieldset{margin:0;padding:0;border:0}
#home-bank-manager .designer-control-cards{margin:10px 0}
#home-bank-manager .designer-instrument>output:empty{display:none}
#home-bank-manager .designer-waves>button[aria-pressed=true]{background:#594362;color:#f2d8fa;border-color:#b994cf}
@media(min-width:1200px){.pack-designer .designer-control-cards{grid-template-columns:repeat(7,minmax(0,1fr))}.pack-designer .designer-control-card{grid-template-columns:1fr;gap:4px;text-align:center}.pack-designer .designer-control-card output{font-size:10px}.pack-designer .designer-control-card input[type=range]{margin:5px 0}.pack-designer .designer-control-card>span:not(.designer-control-icon){white-space:nowrap}}
@media(max-width:600px){#home-bank-manager .catalog-library-actions:has([data-refresh]){display:none!important}}