/* Full-size instrument cabinet. Scoped over the legacy drawer contract. */
@layer v6-components {
  body .instrument-panel {
    --studio-mint: #8fe2ca;
    --studio-gold: #dfbf87;
    --text-muted: #9b9ba9;
    --text-secondary: #bfc0cf;
    --text-primary: #f0f0f6;
    color-scheme: dark;
    position: fixed !important;
    inset: 0 !important;
    width: 100vw !important;
    height: 100dvh !important;
    transform: none !important;
    z-index: 1100 !important;
    display: grid !important;
    place-items: center;
    padding: 16px;
    background: transparent !important;
    box-shadow: none !important;
    visibility: hidden;
    pointer-events: none;
  }
  body .instrument-panel.open { visibility: visible; pointer-events: auto; }
  body .instrument-panel .panel-overlay { z-index: 0; background: #05060bd9; backdrop-filter: blur(9px); }
  body .instrument-panel .panel-container {
    position: relative;
    z-index: 1;
    width: min(1240px, calc(100vw - 32px)) !important;
    height: min(820px, calc(100dvh - 32px)) !important;
    max-height: calc(100dvh - 32px) !important;
    display: flex;
    flex-direction: column;
    min-height: 0;
    overflow: hidden;
    border: 1px solid #5b5366 !important;
    border-radius: 18px;
    background: linear-gradient(115deg, #28272f, #191920 48%, #24212c) !important;
    box-shadow: 0 40px 100px #000b, inset 0 1px #ffffff1a !important;
  }
  body .instrument-panel .panel-header { gap: 16px; padding: 10px 20px !important; background: linear-gradient(100deg, #36313e80, #15151c) !important; flex: 0 0 auto; }
  .studio-brand { display: flex; align-items: center; gap: 15px; margin-right: auto; }
  .studio-brand-mark { display: grid; place-items: center; width: 34px; height: 34px; border: 1px solid #8fe2ca60; border-radius: 9px; color: var(--studio-mint); font: italic 800 24px Georgia, serif; box-shadow: inset 0 0 20px #8fe2ca12; }
  .studio-eyebrow { display: block; font: 600 8px/1.3 ui-monospace, monospace; letter-spacing: .16em; color: var(--studio-gold); }
  .studio-patch-name { margin: 2px 0 0; font-size: 21px; line-height: 1.2; font-weight: 600; letter-spacing: -.025em; color: #f2edf8; }
  body .instrument-panel .panel-header h3 { font-size: 12px !important; color: #b8b5c6; max-width: 35%; }
  body .instrument-panel .panel-close { flex-shrink: 0; width: 36px; height: 36px; color: #d4cfe4; border: 1px solid #ffffff20; background: #ffffff06; }
  body .instrument-panel .panel-scope-bar { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; padding: 5px 20px !important; background: #10101566; border-bottom: 1px solid #ffffff0b; flex-shrink: 0; }
  body .instrument-panel .panel-scope-bar__hint { margin: 0 0 0 auto !important; flex: 0 1 auto; font-size: 11px; }
  body .instrument-panel .panel-scope-bar__opt { padding: 3px 10px; font-size: 11px; }
  .studio-nav { display: flex; align-items: center; gap: 18px; padding: 8px 20px; border-bottom: 1px solid #ffffff0b; flex-shrink: 0; }
  body .instrument-panel .panel-mode-bar { display: none !important; }
  body .instrument-panel .panel-tabs { flex: 1; padding: 0; max-width: 800px; gap: 6px; }
  body .instrument-panel .panel-tab { display: flex; flex-direction: column; gap: 3px; border: 1px solid #ffffff12; border-radius: 7px; padding: 5px 12px; text-transform: none; font-size: 13px; }
  body .instrument-panel .panel-tab small { font-size: 10px; color: #aaa5b9; font-weight: 400; text-transform: none; letter-spacing: 0; }
  body .instrument-panel .panel-tab--active { border-color: #9f8bdc; box-shadow: inset 0 -2px #ad95ff; }
  .studio-transport { display: flex; gap: 7px; margin-left: auto; }
  body .instrument-panel .studio-transport #previewBtn { width: auto !important; min-width: 0; padding: 6px 9px !important; margin: 0; font-size: 11px; }
  .studio-transport button, .studio-panic { color: #cceadd; background: #8fe2ca0b; border: 1px solid #8fe2ca30; border-radius: 6px; padding: 7px 12px; font-size: 11px; cursor: pointer; white-space: nowrap; }
  body .instrument-panel .panel-body { padding: 14px 20px !important; scrollbar-gutter: stable; align-content: start; }
  body .instrument-panel[data-page="sound"] .panel-body, body .instrument-panel[data-page="kit"] .panel-body, body .instrument-panel[data-page="osc"] .panel-body { display: flex; flex-direction: column; }
  body .instrument-panel .panel-simple { order: -1; flex: 0 0 auto; }
  body .instrument-panel #melodicControls > .param-group:has(#panelPresetSelect) { display: none !important; }
  .studio-browser { display: flex; flex-direction: column; min-height: 0; }
  .studio-browser > label { color: var(--studio-gold); font: 600 10px ui-monospace, monospace; letter-spacing: .13em; margin-bottom: 12px; }
  .studio-browser > input { width: 100%; border: 1px solid #ffffff1c; border-radius: 8px; background: #0b0d13; color: #e6e6ef; padding: 10px 12px; font-size: 12px; margin-bottom: 10px; }
  body .instrument-panel .studio-browser .vibe-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); max-height: 285px; overflow: auto; padding: 2px 5px 2px 1px; scrollbar-width: thin; }
  body .instrument-panel .vibe-card { border-radius: 7px; min-height: 51px; background: #ffffff04; }
  body .instrument-panel .vibe-card--active { background: #8fe2ca13; border-color: #8fe2ca88; box-shadow: inset 3px 0 var(--studio-mint); }
  body .instrument-panel .panel-container [hidden], body .instrument-panel .panel-container .param-group[style*="display: none"] { display: none !important; }
  body .instrument-panel .panel-simple { margin: 0 0 14px; padding: 10px 14px; border-radius: 10px; border: 1px solid #ffffff10; background: #0d0f1470; }
  body .instrument-panel .panel-simple::before { content: 'QUICK CONTROLS'; display: block; color: var(--studio-gold); font: 600 9px ui-monospace, monospace; letter-spacing: .13em; margin: 0 0 8px; }
  body .instrument-panel .panel-simple::after { display: none; }
  body .instrument-panel #panelSimple .param-group { display: inline-flex !important; flex-direction: column; align-items: center; width: 19%; min-width: 80px; vertical-align: top; margin-bottom: 0 !important; }
  body .instrument-panel .studio-dial-group > label { justify-content: center !important; gap: 5px; flex-direction: column; text-align: center; min-height: 36px; font-size: 10px !important; }
  body .instrument-panel .studio-dial-group .param-value { color: var(--studio-mint) !important; font: 12px ui-monospace, monospace; background: transparent !important; padding: 0 !important; border: 0 !important; }
  body .instrument-panel .studio-knob { --knob-angle: 0deg; --knob-sweep: 135deg; position: relative; width: 48px; height: 48px; margin: 5px auto 2px; border-radius: 50%; background: conic-gradient(from 225deg, var(--studio-mint) var(--knob-sweep), #ffffff14 0deg, #ffffff14 270deg, transparent 270deg); padding: 5px; }
  body .instrument-panel #panelSimple .studio-knob { width: 48px; height: 48px; }
  .studio-knob-face { position: absolute; inset: 5px; border: 4px solid #17191f; border-radius: 50%; background: linear-gradient(145deg, #50505b, #21232b 52%, #101117); box-shadow: inset 0 1px 2px #ffffff50, 0 5px 8px #000a; transform: rotate(var(--knob-angle)); }
  .studio-knob-face::after { content: ''; position: absolute; top: 4px; left: calc(50% - 1px); width: 2px; height: 12px; border-radius: 1px; background: #e0fff2; box-shadow: 0 0 6px #8fe2caaa; }
  body .instrument-panel .studio-knob input[type="range"] { position: absolute; inset: 0; width: 100% !important; height: 100% !important; margin: 0 !important; opacity: 0 !important; cursor: ns-resize; touch-action: none; }
  .studio-knob:focus-within { outline: 2px solid #e7c681; outline-offset: 4px; }
  body .instrument-panel #section-shape[style*="block"] { display: grid !important; grid-template-columns: 1.1fr 1fr; gap: 14px; align-items: start; }
  .studio-module { padding: 12px; border: 1px solid #ffffff15; border-radius: 10px; background: linear-gradient(145deg, #ffffff05, #0b0d1470); min-width: 0; }
  body .instrument-panel .studio-module > .studio-module-head { position: static; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; min-height: 0; margin: 0 0 10px; border: 0; border-bottom: 1px solid #ffffff10; padding: 0 0 8px; background: none; box-shadow: none; }
  .studio-module > .studio-module-head > span { font: 600 9px ui-monospace, monospace; color: var(--studio-gold); letter-spacing: .12em; }
  body .instrument-panel .studio-module > .studio-module-head h4 { margin: 0 !important; background: none !important; padding: 0 !important; border: 0 !important; font-size: 15px !important; color: #e6e4ee; text-transform: none; letter-spacing: -.02em; }
  body .instrument-panel .studio-module > .studio-module-head > span { display: none; }
  body .instrument-panel .studio-module > .studio-module-head .toggle-label { margin: 0 0 0 auto; }
  body .instrument-panel .studio-module .studio-dial-group { display: inline-flex !important; vertical-align: top; flex-direction: column; width: 24%; min-width: 82px; }
  body .instrument-panel #section-shape .studio-module:last-child .studio-dial-group { width: 32%; }
  body .instrument-panel[data-engine="synth"] #section-shape .studio-module:last-child .studio-dial-group { width: 49%; }
  body .instrument-panel #distortionGroup select { max-width: 100%; margin-top: 3px; padding: 4px 6px; font-size: 10px; }
  body .instrument-panel #distortionGroup label[for="distortionOversample"] { margin-top: 5px; min-height: 0; }
  body .instrument-panel .envelope-canvas { width: 100%; height: 86px !important; background: #0b1118 !important; border-color: #8fe2ca20 !important; }
  body .instrument-panel .studio-module .param-group:has(> h4) { display: none; }
  body .instrument-panel #synthControls[style*="block"] { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
  body .instrument-panel[data-mode="simple"] #synthControls[style*="block"] { display: block !important; }
  body .instrument-panel #synthControls > .studio-browser { grid-column: 1 / -1; }
  body .instrument-panel .studio-browser .vibe-grid { grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); max-height: 190px; }
  body .instrument-panel #synthControls > .param-group { grid-column: 1 / -1; }
  body .instrument-panel .synth-osc-group { display: block !important; padding: 18px !important; background: #11131a80 !important; border: 1px solid #ffffff12 !important; border-radius: 10px; }
  body .instrument-panel .synth-osc-group .studio-dial-group { display: inline-flex !important; width: 48%; flex-direction: column; }
  body .instrument-panel #section-fx[style*="block"] { display: grid !important; grid-template-columns: minmax(0, 1fr); gap: 12px; align-items: start; }
  body .instrument-panel #section-fx > .vibe-grid, body .instrument-panel #section-fx > .fx-cards, body .instrument-panel #section-fx > .param-group:has(h4) { grid-column: 1 / -1; }
  body .instrument-panel #section-fx > .param-group:has(h4) { display: none !important; }
  body .instrument-panel #fxVibeCards { display: flex; gap: 6px; overflow-x: auto; margin: 0; padding-bottom: 5px; }
  body .instrument-panel #fxVibeCards .vibe-card { flex: 1 0 110px; min-height: 42px; padding: 7px 10px; }
  body .instrument-panel .fx-cards { display: grid; grid-template-columns: 145px minmax(0, 1fr); gap: 10px; align-items: start; margin: 0; }
  body .instrument-panel .fx-card { padding: 10px; margin: 0; min-width: 0; min-height: 0; }
  body .instrument-panel .fx-card__head { display: flex; gap: 10px; justify-content: start; }
  body .instrument-panel .fx-card__head:has(input:not(:checked))::after { content: 'Bypassed'; color: #aaa5b9; font-size: 10px; margin-left: auto; }
  body .instrument-panel .fx-card__body { display: flex !important; gap: 8px; flex-wrap: wrap; align-items: start; margin-top: 4px; }
  body .instrument-panel .fx-card__body > .param-group { flex: 1 1 80px; max-width: 180px; min-width: 70px; }
  body .instrument-panel .fx-card__body .studio-dial-group { display: inline-flex !important; flex-direction: column; width: auto; margin-bottom: 0 !important; }
  .studio-fx-choices { display: grid; gap: 4px; }
  .studio-fx-choice { display: flex; align-items: center; gap: 8px; border: 1px solid #ffffff0e; border-radius: 6px; background: #ffffff04; color: #bfc0cf; padding: 8px 10px; text-align: left; cursor: pointer; font-size: 11px; }
  .studio-fx-choice::before { content: ''; width: 5px; height: 5px; border-radius: 50%; background: #62616c; flex: 0 0 auto; }
  .studio-fx-choice.is-on::before { background: #8fe2ca; box-shadow: 0 0 5px #8fe2ca55; }
  .studio-fx-choice[aria-pressed="true"] { color: #f4efff; border-color: #aa91ed80; background: #8b5cf629; }
  .studio-effect-hint { margin: 2px 0 5px; font-size: 11px; color: #aaa8b7; line-height: 1.3; }
  body .instrument-panel[data-page="motion"] .panel-body { display: grid; grid-template-columns: 1.15fr 1fr; gap: 12px; }
  body .instrument-panel[data-page="motion"] #section-motion { display: contents !important; }
  body .instrument-panel[data-page="motion"] #section-feel { grid-column: 2; grid-row: 1; }
  body .instrument-panel[data-page="motion"] #fxCardsMod { grid-column: 1 / -1; grid-row: 2; }
  body .instrument-panel .studio-lfo { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 7px 8px; }
  body .instrument-panel .studio-lfo > .studio-module-head { grid-column: 1 / -1; }
  body .instrument-panel .studio-lfo > .param-group { grid-column: span 1; width: auto !important; margin: 0 !important; min-width: 0; }
  body .instrument-panel .studio-lfo > .param-group:not(.studio-dial-group) { align-self: center; }
  body .instrument-panel .studio-lfo > .studio-dial-group { grid-column: span 1; min-width: 0; }
  body .instrument-panel .studio-lfo small { display: none !important; }
  body .instrument-panel .studio-humanize .studio-dial-group { width: 32%; }
  body .instrument-panel .studio-humanize .studio-effect-hint { margin: 0; }
  body .instrument-panel .studio-lfo .param-group > label { font-size: 10px !important; }
  body .instrument-panel .panel-select { font-size: 11px !important; padding: 6px 9px !important; }
  body .instrument-panel .toggle-label { display: flex !important; align-items: center; justify-content: start !important; gap: 8px !important; text-transform: none !important; font-size: 11px !important; letter-spacing: 0; }
  body .instrument-panel input.toggle-checkbox { appearance: none !important; width: 32px !important; height: 18px !important; min-width: 32px; padding: 0 !important; margin: 0; border-radius: 99px !important; flex: 0 0 32px; }
  body .instrument-panel input.toggle-checkbox::before { display: none !important; }
  body .instrument-panel input.toggle-checkbox::after { width: 12px; height: 12px; top: 2px; left: 2px; }
  body .instrument-panel .studio-knob:has(input:disabled) { opacity: .35; }
  body .instrument-panel input:disabled, body .instrument-panel select:disabled { cursor: not-allowed; }
  body .instrument-panel select:disabled { opacity: .45; }
  body .instrument-panel .studio-module .btn { padding: 5px 8px !important; font-size: 10px !important; }
  body .instrument-panel .studio-delay .studio-dial-group { width: 19%; }
  body .instrument-panel .studio-reverb .studio-dial-group { width: 32%; }
  body .instrument-panel .studio-delay .param-group:has(#delaySyncSelect), body .instrument-panel .studio-delay .param-group:has(#delayPingpong) { display: inline-block !important; width: 48%; vertical-align: middle; margin: 5px 0 0 !important; }
  .studio-routing, .synth-harmonic-controls { padding: 10px 12px; border: 1px solid #ffffff18; border-radius: 8px; background: #10111860; grid-column: 1 / -1; }
  .studio-routing summary, .synth-harmonic-controls summary { cursor: pointer; color: #d7d2e3; font-size: 12px; font-weight: 600; padding: 4px 0; }
  .studio-advanced-field { display: inline-flex; flex-direction: column; gap: 5px; min-width: 110px; width: 30%; margin: 9px 2% 8px 0; color: #b9b5c6; font-size: 11px; }
  .studio-advanced-field select, .studio-routing select { width: 100%; min-width: 0; background: #22222c; color: #e1dce9; border: 1px solid #ffffff20; border-radius: 5px; padding: 6px; font-size: 11px; }
  .studio-advanced-field input, .studio-routing input { accent-color: #8fe2ca; max-width: 100%; }
  .studio-routing-row { display: grid; grid-template-columns: 1fr 1.2fr 1fr 22px; align-items: center; gap: 8px; margin: 8px 0; }
  .studio-ladder { display: flex; gap: 10px; }
  .studio-ladder .studio-advanced-field { flex: 1; }
  body .instrument-panel:not([data-engine="synth"]) .studio-ladder, body .instrument-panel:not([data-engine="synth"]) .studio-routing { display: none !important; }
  body .instrument-panel[data-page="motion"] .studio-routing { grid-column: 1 / -1; grid-row: 3; }
  .studio-keyboard { flex: 0 0 auto; padding: 9px 20px 7px; border-top: 1px solid #ffffff20; background: linear-gradient(#101117, #191921); }
  .studio-keyboard-bar { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-bottom: 7px; }
  .studio-keyboard-bar strong { font: 600 9px ui-monospace, monospace; color: var(--studio-gold); letter-spacing: .13em; }
  .studio-key-range { font-size: 10px; color: #aaa9b8; margin-left: 14px; }
  .studio-note-readout { text-align: center; color: var(--studio-mint); font: 12px ui-monospace, monospace; min-width: 160px; }
  .studio-key-legend { display: flex; gap: 14px; font-size: 10px; color: #b8b5c5; }
  .studio-key-legend span::before { content: ''; display: inline-block; width: 5px; height: 5px; border-radius: 50%; background: #b598ff; margin-right: 5px; }
  .studio-key-legend [data-source="midi"]::before { background: #e7bc71; }
  .studio-key-legend [data-source="mouse"]::before { background: #8fe2ca; }
  .studio-key-scroll { overflow-x: auto; scrollbar-width: thin; padding-bottom: 3px; }
  .studio-keys { position: relative; height: 94px; min-width: 880px; border-top: 4px solid #61344e; background: #07080c; border-radius: 3px; user-select: none; touch-action: none; }
  .studio-key { position: absolute; top: 0; left: calc(var(--key-left) * 100% / 52); padding: 0 0 9px; display: flex; align-items: end; justify-content: center; border-radius: 0 0 4px 4px; cursor: pointer; font: 9px ui-monospace, monospace; touch-action: none; }
  .studio-key--white { height: 100%; width: calc(100% / 52); background: linear-gradient(#b8b7bd 0%, #e8e6e5 10%, #fffaf0 88%, #bcb9b5 89%, #e0dcd7 96%); border: 1px solid #77747b; color: #6a6770; box-shadow: inset 1px 0 #fff; }
  .studio-key--black { z-index: 2; height: 64%; width: calc(.64 * 100% / 52); background: linear-gradient(90deg, #0e1017, #292b35 55%, #0b0c13); border: 1px solid #04050a; border-bottom: 6px solid #07080f; box-shadow: 2px 3px 3px #0008, inset 0 -7px 1px #363742; color: #d1ccdb; }
  .studio-key[data-source="playback"] { --key-light: #b598ff; }
  .studio-key[data-source="midi"] { --key-light: #e7bc71; }
  .studio-key[data-source="mouse"] { --key-light: #8fe2ca; }
  .studio-key[data-source]:not([data-source=""]) { background: linear-gradient(#50466c, var(--key-light)); box-shadow: inset 0 -5px #0003, 0 0 12px color-mix(in srgb, var(--key-light) 45%, transparent); color: #141720; }
  .studio-key:focus-visible { outline: 2px solid #b899ff; outline-offset: -3px; }
  .studio-key-help { display: flex; align-items: center; gap: 18px; padding-top: 5px; color: #a6a4b4; font-size: 10px; }
  .studio-key-help label { margin-left: auto; display: flex; align-items: center; gap: 8px; }
  .studio-key-help input { width: 76px; accent-color: var(--studio-mint); }
  .studio-key-help output { width: 22px; font-family: ui-monospace, monospace; }
  .studio-panic { padding: 4px 8px; font-size: 10px; }
  body .instrument-panel .studio-done { width: auto !important; flex: 0 0 auto !important; min-width: 0; padding: 4px 10px !important; font-size: 11px; margin: 0; }
  .studio-key-navigation { display: none; gap: 4px; }
  .studio-key-navigation button { background: #ffffff08; border: 1px solid #ffffff20; color: #d1ccdc; padding: 5px; border-radius: 4px; cursor: pointer; font-size: 10px; }
  body .instrument-panel .panel-footer { display: flex; align-items: center; gap: 10px; padding: 6px 20px !important; background: #13131a; }
  body .instrument-panel .panel-footer .btn { width: auto; flex: 0 0 auto; min-width: 90px; padding: 5px 14px !important; min-height: 0; font-size: 12px; }
  .studio-save-hint { margin-right: auto; color: #aaa7ba; font-size: 11px; }
  body .instrument-panel button:focus-visible, body .instrument-panel select:focus-visible { outline: 2px solid #e7c681; outline-offset: 2px; }
  @media (max-width: 1000px) {
    body .instrument-panel { padding: 10px; }
    body .instrument-panel .panel-header, body .instrument-panel .panel-body, body .instrument-panel .panel-scope-bar { padding-left: 16px !important; padding-right: 16px !important; }
    .studio-nav { gap: 12px; padding: 10px 16px; }
    body .instrument-panel[data-mode="simple"] .panel-body { grid-template-columns: 230px minmax(0, 1fr); gap: 16px; }
    body .instrument-panel #panelSimple .studio-knob { width: 65px; height: 65px; }
    body .instrument-panel #panelSimple .param-group { min-width: 82px; width: 30%; }
    .studio-keyboard { padding-left: 16px; padding-right: 16px; }
    .studio-key-range { display: none; }
    body .instrument-panel .panel-scope-bar__hint { display: none; }
  }
  @media (max-width: 700px) {
    body .instrument-panel { padding: 0; }
    body .instrument-panel .panel-container { width: 100vw !important; height: 100dvh !important; max-height: 100dvh !important; border-radius: 0; }
    body .instrument-panel .panel-header { padding-top: 12px !important; padding-bottom: 12px !important; }
    .studio-patch-name { font-size: 21px; }
    .studio-brand-mark, body .instrument-panel .panel-header h3 { display: none; }
    .studio-nav { flex-wrap: wrap; }
    body .instrument-panel .panel-tabs { order: 0; flex-basis: 100%; max-width: none; }
    body .instrument-panel .panel-tab { padding: 7px 5px; font-size: 12px; }
    body .instrument-panel .panel-tab small { display: none; }
    .studio-transport { margin-left: auto; }
    body .instrument-panel[data-mode="simple"] .panel-body { display: block; }
    body .instrument-panel .studio-browser .vibe-grid { max-height: 135px; }
    body .instrument-panel #panelSimple { margin-top: 15px; }
    body .instrument-panel #panelSimple .param-group { width: 30%; }
    body .instrument-panel #section-shape[style*="block"], body .instrument-panel #synthControls[style*="block"], body .instrument-panel #section-fx[style*="block"] { grid-template-columns: 1fr; }
    body .instrument-panel .fx-cards { grid-template-columns: 1fr; }
    body .instrument-panel .studio-delay .studio-dial-group { width: 32%; }
    .studio-fx-choices { display: flex; flex-wrap: wrap; }
    .studio-fx-choice { padding: 7px; }
    body .instrument-panel[data-page="motion"] .panel-body { display: flex; flex-direction: column; }
    body .instrument-panel[data-page="motion"] #section-motion { display: contents !important; }
    body .instrument-panel[data-page="motion"] #section-feel { order: 1; }
    body .instrument-panel[data-page="motion"] #fxCardsMod { order: 2; }
    body .instrument-panel[data-page="motion"] .studio-routing { order: 3; }
    .studio-routing-row { grid-template-columns: 1fr 1fr; }
    body .instrument-panel .studio-lfo { grid-template-columns: repeat(6, minmax(0, 1fr)); }
    body .instrument-panel .studio-lfo > .param-group { grid-column: span 2; }
    body .instrument-panel .studio-lfo > .studio-dial-group { grid-column: span 3; }
    .studio-keys { height: 104px; }
    .studio-key-legend { gap: 8px; }
    .studio-keyboard-bar { flex-wrap: wrap; }
    .studio-note-readout { min-width: 0; }
    .studio-key-help > span, .studio-save-hint { display: none; }
    .studio-key-navigation { display: flex; }
    .studio-key-help label { margin-left: 0; margin-right: auto; }
    .studio-key-help { gap: 6px; }
    .studio-key-help { flex-wrap: wrap; }
    .studio-key-help input { width: 48px; }
    body .instrument-panel .panel-footer { justify-content: end; }
  }
  @media (max-height: 730px) and (min-width: 701px) {
    body .instrument-panel { padding: 10px; }
    body .instrument-panel .panel-header { padding-top: 10px !important; padding-bottom: 10px !important; }
    .studio-keys { height: 78px; }
    .studio-keyboard { padding-top: 8px; }
    .studio-keyboard-bar { margin-bottom: 7px; }
    body .instrument-panel .panel-body { padding-top: 12px !important; padding-bottom: 12px !important; }
    body .instrument-panel .studio-module { padding: 12px; }
    body .instrument-panel .studio-module > .studio-module-head { margin-bottom: 5px; padding: 0 0 6px; background: transparent; }
    body .instrument-panel .studio-module > .studio-module-head h4 { font-size: 16px !important; }
    body .instrument-panel .studio-module .param-group { margin-bottom: 6px !important; }
    body .instrument-panel .studio-module .param-group:has(.envelope-canvas) > label { display: none !important; }
    body .instrument-panel .envelope-canvas { height: 58px !important; }
    body .instrument-panel .studio-module .studio-knob { width: 47px; height: 47px; margin-top: 4px; }
    body .instrument-panel .studio-module .studio-dial-group > label { min-height: 30px; }
    body .instrument-panel .studio-module .btn { padding: 4px 8px !important; font-size: 10px !important; }
    body .instrument-panel .studio-module small { display: none !important; }
    body .instrument-panel .panel-simple { padding: 10px 14px; }
    body .instrument-panel .panel-simple::before { margin-bottom: 7px; }
  }
}