.studio-controls #compose-toggle[aria-expanded=true]{background:#303030;color:#e3c794}
.sheet-note{pointer-events:bounding-box}
#compose-panel{position:fixed;z-index:12;right:48px;bottom:108px;width:min(620px,calc(100vw - 36px));max-height:calc(100svh - 210px);overflow:auto;padding:23px;background:#171819f5;border:1px solid #ffffff1c;border-radius:20px;box-shadow:0 24px 90px #000a;backdrop-filter:blur(26px);color:#d8d7d4}
#compose-panel[hidden]{display:none}.compose-eyebrow{display:block;font-size:9px;letter-spacing:1.8px;color:#a68f6a;margin-bottom:8px}#compose-panel h2{font-size:21px;letter-spacing:-.6px;margin:0}.compose-title-label{display:flex;align-items:center;gap:12px;color:#85858a;font-size:10px;margin-top:16px}.compose-title-label input{flex:1;min-width:0;background:#ffffff08;border:1px solid #ffffff14;border-radius:8px;padding:9px 11px;color:#e1ddd5;font:inherit;font-size:12px;outline:none}.compose-title-label input:focus{border-color:#c8a77378}.compose-help{color:#85858a;font-size:11px;line-height:1.55;margin:12px 0}.compose-toolbar{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.compose-options{display:flex;gap:3px;padding:3px;background:#ffffff08;border:1px solid #ffffff0c;border-radius:9px}.compose-options button,.compose-rest{background:transparent;color:#9b9ba0;border-radius:6px;padding:7px 9px;font-size:10px}.compose-options button[aria-pressed=true],.compose-rest[aria-pressed=true]{background:#c8a7731c;color:#e3c794}.compose-rest{border:1px solid #ffffff16}.staff-scroll{overflow-x:auto;overscroll-behavior-x:contain;margin:14px -8px 8px;padding:0 8px;scrollbar-color:#5a5145 transparent;scrollbar-width:thin}#compose-staff{display:block;min-width:100%;height:150px;cursor:crosshair;background:linear-gradient(180deg,#ffffff03,transparent);border-radius:8px}#compose-staff .staff-line{stroke:#9b9b9a;stroke-opacity:.5;stroke-width:1}#compose-staff .bar-line{stroke:#9b9b9a;stroke-opacity:.2;stroke-width:1}#compose-staff .clef{fill:#c8a773;font-size:57px;font-family:serif}#compose-staff .note-head{fill:#dfc18d;stroke:#dfc18d;stroke-width:1.5}#compose-staff .note-head.open{fill:#171819;stroke:#dfc18d;stroke-width:2.5}#compose-staff .note-stem,#compose-staff .note-flag{fill:none;stroke:#dfc18d;stroke-width:2}#compose-staff .accidental{fill:#dfc18d;font:18px serif}#compose-staff .note-name{fill:#85858a;font:9px sans-serif;text-anchor:middle}#compose-staff .rest-mark{fill:#dfc18d;font:24px serif;text-anchor:middle}.sheet-note{cursor:pointer;outline:none}.sheet-note:hover .note-head,.sheet-note.playing .note-head{fill:#fff0ca;stroke:#fff0ca;filter:drop-shadow(0 0 5px #c8a773)}.sheet-note.playing .note-stem,.sheet-note.playing .note-flag{stroke:#fff0ca}.sheet-note.playing .note-name{fill:#e3c794}.compose-transport{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin-top:7px}.compose-transport>button{height:34px;padding:0 12px;border:1px solid #ffffff12;border-radius:18px;background:#ffffff08;color:#aaa;font-size:10px}.compose-transport>button:disabled{opacity:.35}.compose-transport .compose-primary{background:#cfb386;color:#191713;font-weight:600;border:0;padding:0 18px}.compose-transport label{display:flex;align-items:center;gap:7px;margin-left:auto;color:#8c8c92;font-size:10px}.compose-transport input{width:78px;accent-color:#c8a773;height:3px}.compose-transport output{min-width:47px;color:#c4b391;font-variant-numeric:tabular-nums}#compose-status{font-size:10px;color:#85858a;margin:12px 0 0;min-height:1.5em}
#compose-panel{width:min(700px,calc(100vw - 36px))}#compose-title span{color:#c8a773}
.compose-title-row{display:flex;align-items:center;gap:14px;margin:19px 0 17px}.compose-title-row input{min-width:0;flex:1;padding:9px 0;background:transparent;border:0;border-bottom:1px solid #ffffff18;color:#eee8df;font:inherit;font-size:15px}.compose-title-row>span{font-size:9px;color:#9b9284;white-space:nowrap}
.compose-toolbar>button,.compose-edit button,.compose-bottom button{padding:8px 11px;background:#ffffff07;border:1px solid #ffffff13;border-radius:8px;color:#b6b2ab;font-size:11px}.compose-toolbar>button[aria-pressed=true],#compose-loop[aria-pressed=true]{background:#c8a77320;color:#e3c794;border-color:#c8a77355}.compose-sheet-heading{display:flex;justify-content:space-between;margin-top:21px;font-size:10px;color:#92908b}.compose-sheet-heading i{padding:0 6px;font-style:normal;color:#6c6458}
#compose-staff{min-width:0;max-width:none;height:218px;touch-action:pan-x pan-y}.staff-scroll{margin:5px -8px 12px;border-bottom:1px solid #ffffff09}#compose-staff .clef{font-family:'Segoe UI Symbol',serif;font-size:63px}#compose-staff .rest-mark{font-family:'Segoe UI Symbol',serif;font-size:30px}#compose-staff .bar-line{stroke-opacity:.5}#compose-staff .beat-line{stroke:#ffffff;stroke-opacity:.06;stroke-dasharray:2 5}#compose-staff .ledger{stroke:#9b9b9a;stroke-width:1}#compose-staff .beat-label{font:9px sans-serif;fill:#77766f;text-anchor:middle}#compose-staff .measure-label{font:10px sans-serif;fill:#b9a582}#compose-staff .note-hit{fill:transparent;stroke:transparent}.sheet-note.selected .note-hit,.sheet-note:focus-visible .note-hit{fill:#c8a77317;stroke:#c8a77377}#compose-staff .note-name{font-size:8px}#compose-staff .duration-mark{stroke:#c8a773;stroke-opacity:.22;stroke-width:3;stroke-linecap:round}#compose-staff .selected .duration-mark,#compose-staff .playing .duration-mark{stroke-opacity:.85}.playhead{stroke:#eed1a2;stroke-width:1.5;pointer-events:none}
.compose-edit{display:flex;align-items:center;gap:10px;flex-wrap:wrap;min-height:36px;font-size:10px;color:#9a9893}#compose-selection{color:#dbc398;margin-right:auto;font-size:11px}.compose-edit label{display:flex;gap:7px;align-items:center}.compose-edit select{background:#242424;color:#dfd9cd;border:1px solid #ffffff18;border-radius:7px;padding:7px;font:inherit}.compose-edit-selected{display:flex;gap:5px}.compose-edit-selected[hidden]{display:none}.compose-help{margin:9px 0 17px;font-size:10px}.compose-bottom{display:flex;justify-content:space-between;gap:10px;padding-top:13px;margin-top:14px;border-top:1px solid #ffffff0d}.compose-bottom>div{display:flex;gap:5px}.compose-bottom button{background:transparent;border-color:transparent;color:#a49c90}.compose-bottom #compose-export{color:#dec398;border-color:#c8a77330}#compose-panel button:disabled{opacity:.35;cursor:default}#compose-panel button:focus-visible,#compose-panel select:focus-visible,#compose-panel input:focus-visible{outline:2px solid #c8a773;outline-offset:3px}.compose-transport{gap:8px}.compose-transport input{width:90px}
@media(max-width:700px){#compose-panel{left:14px;right:14px;bottom:91px;width:auto;max-height:calc(100svh - 175px);padding:18px}.compose-transport label{margin-left:0;flex-wrap:wrap}.studio-controls button{min-width:68px!important;padding:11px 8px!important;gap:5px}.compose-title-row{align-items:flex-start;flex-direction:column;gap:5px}.compose-title-row input{width:100%}.compose-options button{padding:9px 8px}.compose-edit-selected{flex-wrap:wrap}.compose-edit button,.compose-bottom button{min-height:36px}#compose-selection{flex-basis:100%}.compose-transport label{margin-top:5px}.compose-sheet-heading{font-size:9px}}