:root{color-scheme:dark;--bg:#0d1014;--panel:#15191e;--panel2:#191e24;--panel3:#222830;--line:#2a3138;--line2:#353c46;--text:#ebeeef;--muted:#88939e;--faint:#56616e;--lime:#c2ed85;--peach:#efab90;--blue:#8eacf5;--purple:#bc9cf4;--rad:10px;--label:11px;--grid:38px}*{box-sizing:border-box}html,body{padding:0;margin:0;width:100%;height:100%;overflow:hidden;background:var(--bg);color:var(--text);font-family:Inter,'Segoe UI',ui-sans-serif,system-ui,sans-serif;font-size:13px;-webkit-font-smoothing:antialiased}button,input,select{font:inherit}button{cursor:pointer}button:disabled{opacity:.45;cursor:default}select,input{outline:none}button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--lime);outline-offset:2px}a{text-decoration:none;color:inherit}.app{display:flex;flex-direction:column;height:100vh;min-width:770px}.toolbar{height:66px;flex-shrink:0;background:#14181d;border-bottom:1px solid #2d343c;display:flex;align-items:center;gap:22px;padding:0 22px}.logotype{display:flex;align-items:center;gap:10px;min-width:192px}.logomark{font-size:31px;font-weight:900;letter-spacing:-4px;line-height:1;color:#f0f2ec}.logo-dot{color:var(--lime)}.brandname{font-size:13px;font-weight:840;letter-spacing:.085em}.brandtag{border:1px solid #333e41;border-radius:4px;font-size:8px;color:#bbc9cd;padding:4px 6px;letter-spacing:.12em;margin-left:2px}.project-name{display:flex;align-items:center;gap:7px;min-width:165px;max-width:225px;flex:1}.project-dot{height:6px;width:6px;border-radius:100%;background:var(--lime)}.project-name input{min-width:70px;width:100%;font-size:12px;font-weight:650;background:transparent;border:none;color:#e9edeb;text-overflow:ellipsis}.saved-status{white-space:nowrap;font-size:9px;color:#66727c}.transport{display:flex;align-items:center;gap:8px;justify-content:center}.mode-switch{display:flex;border:1px solid #343b46;background:#101418;padding:3px;border-radius:7px;margin-right:4px}.mode-switch button{padding:6px 9px;border:0;background:transparent;border-radius:5px;color:#7d8995;font-size:10px;font-weight:760;letter-spacing:.04em}.mode-switch button.active{background:#313b37;color:#c8ecaa}.tool-icon{font-size:11px;background:#252b31;border:1px solid #384049;border-radius:7px;width:34px;height:34px;color:#d2d9db}.transport-play{height:38px;width:40px;border:0;border-radius:8px;background:var(--lime);color:#1a251a;font-size:15px;box-shadow:0 0 0 1px #b5df79}.transport-play.playing{background:#f5c18e}.transport-record{width:32px;height:34px;border:0;background:transparent;display:grid;place-items:center}.transport-record span{width:12px;height:12px;border:2px solid #e5817f;border-radius:50%}.transport-record.recording span{background:#e68177;box-shadow:0 0 0 6px #e6817729;animation:pulse 1s infinite}.bpm-field{display:flex;align-items:center;gap:4px;padding:0 10px;background:#22282e;border:1px solid #363e47;border-radius:7px;height:35px;margin-left:4px}.bpm-field input{background:transparent;border:0;color:#eef0e8;width:39px;font-weight:770;text-align:center;font-size:15px;appearance:textfield}.bpm-field input::-webkit-inner-spin-button{appearance:none}.bpm-field span{font-size:9px;font-weight:750;color:#86939d}.metro-btn{border:0;background:transparent;color:#a5b0b7;font-size:21px;width:30px}.metro-btn.active{color:var(--lime)}.position-display{background:#0d1215;border-radius:6px;padding:11px 13px;color:#d4f0b8;letter-spacing:.07em;font-size:13px;font-variant-numeric:tabular-nums;font-weight:770;white-space:nowrap}.toolbar-right{display:flex;align-items:center;justify-content:flex-end;gap:12px;min-width:230px;flex:1}.engine-state{font-size:9px;color:#8f9b95;letter-spacing:.065em;white-space:nowrap}.engine-state i{display:inline-block;width:6px;height:6px;border-radius:50%;background:#bfe585;margin-right:5px}.top-control{background:none;color:#d1d9dc;padding:8px 0;border:0;font-size:11px;font-weight:650;white-space:nowrap}.top-control span{color:#788692;margin-left:4px;font-size:9px}.primary-small{border:0;background:#d0eea7;color:#19221b;font-weight:790;padding:11px 15px;border-radius:7px;font-size:11px;white-space:nowrap}.primary-small span{margin-left:7px;font-size:14px}.mobile-panels{display:none}.subbar{height:30px;padding:0 23px;flex-shrink:0;display:flex;align-items:center;justify-content:space-between;background:#111519;border-bottom:1px solid #232a32;color:#798590;font-size:9px;letter-spacing:.09em;font-weight:700}.subbar-left,.subbar-right{display:flex;align-items:center;gap:11px}.online-dot{width:6px;height:6px;background:#aadf8c;display:inline-block;border-radius:50%}.subbar-sep{color:#3c4650}.subbar-link{border:0;color:#adbaa5;background:none;font-size:9px;font-weight:800;letter-spacing:.08em}.soon-dot{display:inline-block;width:5px;height:5px;background:#deae8a;border-radius:50%;margin-left:3px}.main-layout{display:flex;min-height:0;flex:1}.browser-pane{width:234px;flex:0 0 234px;background:#15191e;border-right:1px solid #2c333b;display:flex;flex-direction:column;min-height:0}.pane-title{display:flex;justify-content:space-between;padding:23px 19px 13px;align-items:end}.eyebrow{font-size:9px;color:#86929b;letter-spacing:.18em;font-weight:750}.pane-title h2{font-size:20px;margin:3px 0 0;letter-spacing:-.055em}.pane-title button{height:26px;width:26px;background:#262e34;border:1px solid #3a424a;border-radius:6px;color:#c8d0d0;font-size:19px}.search-wrap{margin:0 14px 15px;height:35px;background:#20262c;border:1px solid #313941;border-radius:7px;display:flex;align-items:center;gap:6px;padding:0 10px;color:#828e96}.search-wrap span{font-size:20px}.search-wrap input{background:transparent;border:0;width:100%;font-size:11px;color:#e2e4e4}.search-wrap input::placeholder{color:#76838d}.library-scroll{min-height:0;overflow:auto;flex:1;padding:0 10px 16px}.library-heading{font-size:10px;letter-spacing:.075em;font-weight:810;color:#adb8bc;display:flex;justify-content:space-between;align-items:center;padding:11px 8px;border-bottom:1px solid #242c34;margin-top:8px}.library-heading span{font-size:9px;color:#707d87}.asset-row{display:flex;align-items:center;gap:9px;padding:9px 8px;min-width:0;border-radius:5px;color:#bac5c7;font-size:11px;cursor:grab;user-select:none}.asset-row:hover{background:#283038;color:#f0f2ee}.asset-icon{width:24px;height:24px;border-radius:5px;background:#29353c;color:#c3e3a3;display:grid;place-items:center;font-size:11px;flex:0 0 24px}.asset-row .asset-name{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.asset-row .asset-type{font-size:9px;color:#647580}.asset-row button{background:transparent;border:0;color:#b0b9bb;opacity:0}.asset-row:hover button{opacity:1}.browser-bottom{padding:16px 15px;background:#171d22;border-top:1px solid #283038;display:flex;gap:10px;align-items:center}.disk-icon{width:28px;height:28px;border:1px solid #47534b;border-radius:7px;display:grid;place-items:center;color:var(--lime);font-size:19px}.browser-bottom b,.browser-bottom small{display:block}.browser-bottom b{font-size:10px;color:#dae2db}.browser-bottom small{font-size:9px;color:#7a8991;line-height:1.4;margin-top:4px}.workspace{flex:1;min-width:0;display:flex;flex-direction:column;background:#101418}.workspace-heading{height:53px;padding:0 20px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #2e363e;flex-shrink:0}.work-tabs{display:flex;height:100%;align-items:stretch;gap:18px}.work-tabs button{position:relative;border:0;background:none;color:#89969e;font-size:12px;font-weight:690;padding:0 9px}.work-tabs button.active{color:#e7eeea}.work-tabs button.active::after{content:"";position:absolute;bottom:-1px;height:2px;left:0;right:0;background:var(--lime)}.tab-icon{font-size:17px;margin-right:7px;color:#9eaaac}.workspace-tools{display:flex;gap:17px;align-items:center}.shortcut{font-size:9px;color:#71818c;border:1px solid #30383f;border-radius:4px;padding:5px 7px}.shortcut span{margin-left:5px;color:#a5b3ba}.generator-link{font-size:11px;font-weight:710;background:#272c27;border:1px solid #425043;border-radius:6px;color:#ccedbe;padding:7px 10px}.generator-link span{margin-left:8px}.view{display:none;min-height:0;flex:1}.view.active{display:flex;flex-direction:column}.section-bar{height:71px;min-height:71px;display:flex;align-items:center;justify-content:space-between;padding:0 21px;border-bottom:1px solid #252d34}.section-heading{display:flex;gap:12px;align-items:center}.index-mark{font-size:10px;font-weight:700;color:#c0df8d;display:grid;place-items:center;border:1px solid #485a45;border-radius:5px;width:27px;height:27px}.section-heading h3{font-size:15px;letter-spacing:-.035em;margin:0 0 4px}.section-heading p{font-size:10px;color:#778690;margin:0}.rack-actions,.playlist-actions,.piano-actions,.mixer-actions{display:flex;align-items:center;gap:9px}.rack-actions label,.playlist-actions label,.piano-actions label{font-size:10px;color:#9ba8b0;display:flex;align-items:center;gap:8px}.rack-actions select,.piano-actions select,.playlist-actions select{border:1px solid #36414a;background:#20262c;border-radius:6px;color:#e0e5e1;font-size:11px;padding:8px 25px 8px 9px}.ghost-button{border:1px solid #343e46;color:#c3ccce;background:#21272e;border-radius:6px;font-size:11px;font-weight:630;padding:8px 10px}.ghost-button:hover,.icon-button:hover{background:#2e3840}.separator,.divider-bar{height:24px;width:1px;background:#343e46;margin:0 3px}.icon-button{border:0;background:transparent;color:#b8c4c9;font-size:22px;width:22px;line-height:1}.rack-actions #rackBarCount{font-size:10px;color:#c2d0c4;min-width:31px;text-align:center}.rack-matrix{flex-shrink:0;background:#181d22;border-bottom:1px solid #323941}.rack-guide{display:grid;grid-template-columns:180px 158px minmax(260px,1fr);padding:11px 19px 8px;gap:13px;color:#65737d;font-size:9px;letter-spacing:.12em;font-weight:790}.channel-row{height:46px;padding:0 19px;display:grid;grid-template-columns:180px 158px minmax(260px,1fr);gap:13px;align-items:center;border-top:1px solid #242b32}.channel-row.dragover{outline:1px solid var(--lime);background:#28332a}.ch-main{min-width:0;display:flex;align-items:center;gap:7px}.channel-color{height:23px;width:3px;border-radius:4px;background:var(--ch-color)}.ch-mute,.ch-solo{width:20px;height:21px;color:#929da7;font-size:9px;border:1px solid #39434b;background:#222a31;border-radius:4px;font-weight:700}.ch-mute.active{color:#f0a891;border-color:#a26a60}.ch-solo.active{color:#c7ee97;border-color:#7f9c65}.ch-name{background:none;border:0;color:#dbe1df;min-width:0;max-width:92px;text-align:left;font-size:11px;font-weight:710;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ch-name:hover{text-decoration:underline}.ch-instrument{width:100%;display:flex;gap:5px}.ch-instrument select{min-width:0;flex:1;background:#22292f;border:1px solid #364148;border-radius:6px;color:#c4ced0;padding:7px;font-size:10px}.ch-instrument .mixer-map{flex:0 0 39px;width:39px;color:var(--lime)}.ch-steps{display:grid;grid-template-columns:repeat(16,minmax(0,1fr));gap:4px}.step{height:22px;min-width:9px;border:1px solid #39414c;background:#252b32;border-radius:3px;position:relative;padding:0;transition:background .12s,border-color .12s}.step:nth-child(4n+1){border-left-color:#646e75}.step.on{background:var(--ch-color);border-color:var(--ch-color);box-shadow:0 0 0 1px #ffffff0c inset}.step.on:nth-child(2n){opacity:.83}.step.playhead::after{content:"";height:28px;width:1px;background:#e7e9d4;position:absolute;left:50%;top:-3px;opacity:.6;pointer-events:none}.rack-footer{height:37px;padding:0 21px;display:flex;justify-content:space-between;align-items:center;font-size:9px;color:#687984}.rack-footer button{border:0;background:none;color:#b6cfaa;padding:6px 0;font-size:10px;font-weight:740}.playlist-header{min-height:62px;height:62px}.playlist-actions label input{width:86px;accent-color:#c6e992}.mini-toolset{display:flex;border:1px solid #39414b;background:#20262c;border-radius:6px;padding:2px;gap:2px}.mini-toolset button{border:0;color:#939fa8;background:none;min-width:28px;height:25px;border-radius:4px;font-size:15px}.mini-toolset button.active{color:#d5edb7;background:#455644}.playlist-scroller{flex:1;overflow:auto;background:#11161b;position:relative}.playlist-inner{min-width:980px;min-height:100%;position:relative}.timeline-row{height:36px;display:flex;background:#171c21;border-bottom:1px solid #333a42;position:sticky;top:0;z-index:10}.timeline-sticky{flex:0 0 155px;position:sticky;left:0;background:#1a2026;z-index:11;border-right:1px solid #3a434c;display:flex;align-items:center;padding-left:15px;font-size:9px;letter-spacing:.1em;color:#8998a3}.timeline-ruler{flex:1;position:relative;background:repeating-linear-gradient(to right,#3c444d 0px,#3c444d 1px,transparent 1px,transparent var(--bar-px)),#171c21}.bar-num{position:absolute;top:10px;font-size:10px;color:#9eabb4;transform:translateX(6px);font-variant-numeric:tabular-nums}.play-cursor{position:absolute;top:36px;bottom:0;z-index:8;width:1px;background:#d8f5a5;pointer-events:none;box-shadow:0 0 7px #d8f5a56a}.arrangement-track{display:flex;height:66px;border-bottom:1px solid #2a343d}.track-label{flex:0 0 155px;background:#1a2026;position:sticky;left:0;z-index:7;border-right:1px solid #3a444c;padding:11px 11px 10px 14px;display:flex;flex-direction:column;gap:6px}.track-num{font-size:9px;color:#677784;letter-spacing:.1em}.track-title{font-size:11px;color:#d4dfe0;font-weight:710;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.track-controls{position:absolute;top:11px;right:9px;color:#8b9ca5;font-size:10px}.track-controls button{border:0;background:transparent;color:#9da9aa;cursor:pointer}.track-lane{position:relative;flex:1;background-image:linear-gradient(to right,#2c3540 1px,transparent 1px),linear-gradient(to right,#20262c 1px,transparent 1px);background-size:var(--bar-px) 100%,calc(var(--bar-px)/4) 100%;background-position:0 0,0 0;background-color:#12171d}.track-lane.dragover{background-color:#222e2b}.clip{position:absolute;top:8px;bottom:8px;border:1px solid var(--clip-stroke);background:var(--clip-fill);border-radius:6px;cursor:move;overflow:hidden;min-width:16px;box-shadow:0 2px 8px #00000022;user-select:none}.clip:hover{filter:brightness(1.14)}.clip.selected{outline:2px solid #e1eacf;outline-offset:1px}.clip-head{height:16px;padding:2px 8px;font-size:9px;font-weight:800;color:var(--clip-text);overflow:hidden;white-space:nowrap;text-overflow:ellipsis;background:#ffffff1a}.clip-body{position:relative;height:calc(100% - 16px);padding:5px 8px}.clip-body i{position:absolute;display:block;height:5px;background:var(--clip-stroke);border-radius:2px;opacity:.55}.clip-wave{font-size:15px;line-height:1;color:var(--clip-text);opacity:.75;letter-spacing:3px}.clip-resizer{position:absolute;right:0;top:0;bottom:0;width:8px;cursor:ew-resize;background:#ffffff14}.clip-automation{width:100%;height:25px;overflow:visible}.clip-automation path{stroke:var(--clip-stroke);stroke-width:2;fill:none}.statusline{height:26px;flex-shrink:0;display:flex;align-items:center;justify-content:space-between;color:#72848e;font-size:9px;letter-spacing:.06em;border-top:1px solid #29323b;padding:0 17px;background:#151a1f}.piano-view,.mixer-view{background:#131820}.piano-actions{flex-wrap:wrap}.piano-scroll{min-height:290px;overflow:auto;flex:1;background:#0f141b;position:relative}.piano-canvas{width:1560px;height:960px;position:relative;background:#131a23;--note-step:23px;--px-step:22px}.key-cell{position:absolute;left:0;width:78px;height:23px;display:flex;justify-content:flex-end;align-items:center;padding-right:8px;background:#2a303b;border:1px solid #3d4550;border-bottom-color:#303742;color:#abbace;font-size:10px;user-select:none;z-index:4}.key-cell.black{background:#171d27;color:#6a7986}.key-cell.cnote{color:#d1e8b4}.note-grid{position:absolute;left:78px;right:0;top:0;bottom:0;background-color:#151c25;background-image:repeating-linear-gradient(to bottom,#2b3441 0px,#2b3441 1px,transparent 1px,transparent 23px),repeating-linear-gradient(to right,#3b4858 0px,#3b4858 1px,transparent 1px,transparent 352px),repeating-linear-gradient(to right,#293341 0px,#293341 1px,transparent 1px,transparent 88px),repeating-linear-gradient(to right,#202a34 0px,#202a34 1px,transparent 1px,transparent 22px)}.note{position:absolute;height:19px;background:#b7d69e;color:#1c3025;border:1px solid #dbedc8;border-radius:3px;z-index:3;cursor:grab;padding-left:4px;font-size:9px;font-weight:780;display:flex;align-items:center;overflow:hidden;user-select:none}.note.selected{background:#eed1a2;border-color:#f8e6c9;color:#30241c;box-shadow:0 0 0 1px #fff9}.note-resize{position:absolute;right:0;top:0;bottom:0;width:7px;background:#0000001f;cursor:ew-resize}.velocity-head{height:29px;display:flex;align-items:center;justify-content:space-between;padding:0 16px;color:#8e9da7;font-size:9px;letter-spacing:.06em;border-top:1px solid #34414b}.velocity-head span:nth-child(2){color:#6b7c88;text-transform:none;letter-spacing:0}.velocity-scroll{height:98px;overflow:hidden;border-top:1px solid #34404a;background:#151b22}.velocity-canvas{height:98px;width:1560px;position:relative;background:repeating-linear-gradient(to right,transparent 0,transparent 21px,#252d35 21px,#252d35 22px);}.velocity-bar{position:absolute;bottom:7px;width:9px;border-radius:2px 2px 0 0;background:#a9cf85;cursor:ns-resize;touch-action:none}.velocity-bar.selected{background:#f0bc91}.piano-hint{height:28px;padding:7px 16px;color:#75838f;font-size:10px}.mixer-board{display:flex;gap:8px;padding:22px;overflow-x:auto;flex:1;align-items:stretch}.mixer-channel{flex:1;min-width:94px;max-width:180px;background:#1d242b;border:1px solid #353e47;border-radius:9px;display:flex;flex-direction:column;align-items:center;padding:15px 10px}.mixer-channel.master{background:#26312a;border-color:#50634a}.mixer-number{color:#7c8993;font-size:9px;letter-spacing:.13em}.mixer-name{font-size:11px;font-weight:760;margin:8px 0 14px;min-height:25px;text-align:center;white-space:nowrap;max-width:100%;overflow:hidden;text-overflow:ellipsis}.mixer-meter{height:122px;width:9px;background:#12181d;border-radius:5px;position:relative;overflow:hidden;border:1px solid #36414a}.mixer-meter-inner{position:absolute;bottom:0;left:0;right:0;height:0%;background:linear-gradient(to top,#aad87e,#d2e28b,#edaa81);transition:height .07s}.mixer-volume{writing-mode:vertical-lr;direction:rtl;appearance:slider-vertical;height:132px;width:21px;margin:12px auto;accent-color:#bde78b;cursor:pointer}.mixer-knob-label{font-size:9px;color:#8494a2;margin-top:5px}.mixer-pan{width:75%;accent-color:#b0c9ac}.mix-mute{margin-top:12px;background:#28313a;color:#aebac1;border:1px solid #43505b;border-radius:4px;padding:6px 10px;font-weight:720;font-size:9px}.mix-mute.on{background:#4b2929;color:#e7a296}.mixer-fx{display:flex;flex-direction:column;gap:8px;min-width:244px;max-width:320px;flex:2;background:#1d242b;border:1px solid #37414a;border-radius:9px;padding:18px}.fx-title{font-weight:800;font-size:13px}.fx-sub{color:#84949d;font-size:10px;margin-top:4px}.fx-controls{margin-top:12px}.fx-control{padding:10px 0;border-bottom:1px solid #313a42;display:flex;justify-content:space-between;align-items:center;gap:8px}.fx-control span{font-size:11px;color:#cbd5d3}.fx-control input{max-width:110px;accent-color:var(--lime)}.fx-control select{background:#282e35;color:white;border:1px solid #49545c;border-radius:4px;padding:6px;font-size:10px}.mixer-desc{padding:10px 22px;color:#7d8e9a;font-size:10px;border-top:1px solid #29343e}.inspector{flex:0 0 210px;width:210px;background:#161b20;border-left:1px solid #303943;display:flex;flex-direction:column}.inspector-heading{height:52px;padding:0 16px;display:flex;align-items:center;justify-content:space-between;color:#b2bdc2;font-size:10px;letter-spacing:.09em;font-weight:750;border-bottom:1px solid #303943}.inspector-heading button{background:none;border:0;color:#86939f;font-size:19px}.inspector-content,.inspector #inspectorContent{padding:18px 17px;flex:1;overflow:auto}.inspector-art{width:100%;height:108px;border-radius:9px;background:radial-gradient(circle at 70% 35%,#c6e49e66,transparent 35%),linear-gradient(135deg,#313d3b,#1d252c);display:grid;place-items:center;color:#dde8d3;font-size:36px;margin-bottom:18px;border:1px solid #4a5851}.inspector-title{font-size:17px;font-weight:810;letter-spacing:-.04em;margin-bottom:5px}.inspector-sub{color:#778a93;font-size:10px;margin-bottom:22px}.inspector-field{margin-bottom:15px}.inspector-field label{display:flex;justify-content:space-between;font-size:10px;color:#98a7ad;margin-bottom:9px}.inspector-field label b{color:#d6e4d1}.inspector-field input[type=range]{width:100%;accent-color:#c3e99c}.inspector-field select{width:100%;padding:9px;background:#262e34;border:1px solid #424d53;border-radius:6px;color:white;font-size:11px}.inspector-link{width:100%;border:1px solid #53674f;color:#cbebad;background:#253127;padding:10px 6px;border-radius:6px;font-size:10px;font-weight:770;margin-top:8px}.inspector-foot{border-top:1px solid #2e3942;padding:12px 16px;display:flex;justify-content:space-between;font-size:9px;color:#73838e;letter-spacing:.06em}.inspector-foot span:nth-child(2){color:#b2cba6}.hint-line{font-size:10px;color:#7d9099;line-height:1.6}#toast{position:fixed;bottom:35px;left:50%;transform:translate(-50%,20px);opacity:0;pointer-events:none;transition:all .2s;z-index:200;padding:12px 17px;background:#2d3833;border:1px solid #667e60;border-radius:8px;color:#d8edcc;font-weight:640;box-shadow:0 8px 30px #0006}#toast.show{transform:translate(-50%,0);opacity:1}dialog{border:1px solid #4c585f;border-radius:13px;padding:0;background:#1e252a;color:#e8eeeb;box-shadow:0 24px 85px #000a;max-width:460px;width:calc(100% - 32px)}dialog::backdrop{background:#080c10bf;backdrop-filter:blur(4px)}.modal-content{padding:25px;display:flex;flex-direction:column;gap:13px}.modal-content h3{margin:0;font-size:22px;letter-spacing:-.06em}.modal-content p{margin:0 0 5px;font-size:12px;color:#94a5ad;line-height:1.65}.modal-content label{display:flex;flex-direction:column;color:#adbbc0;font-size:11px;gap:7px}.modal-content input,.modal-content select{border:1px solid #4b575d;background:#151b20;border-radius:7px;color:#edf3ee;padding:10px}.modal-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:6px}.modal-actions button,.text-close{background:#303a41;border:1px solid #4a5a5f;color:#e0eae2;border-radius:6px;padding:10px 15px}.modal-actions .modal-primary,.modal-primary{background:#c7e9a5;color:#233021;border:0;border-radius:6px;padding:10px 15px;font-weight:750}.export-option{display:flex;align-items:center;gap:13px;text-align:left;border:1px solid #404a51;border-radius:8px;padding:13px;background:#252d33;color:#dce4e1}.export-option:hover{border-color:#8fac86}.export-option>span:first-child{font-size:21px;color:#c2e89c}.export-option>div{flex:1}.export-option b,.export-option small{display:block}.export-option b{font-size:12px}.export-option small{font-size:10px;color:#8c9ca5;margin-top:4px}.dialog-note{border-left:2px solid var(--lime);padding-left:12px}.text-close{align-self:flex-end}@keyframes pulse{50%{box-shadow:0 0 0 9px #e6817708}}@media(max-width:1440px){.toolbar{gap:9px;padding:0 12px}.brandname{font-size:12px}.brandtag{display:none}.logotype{min-width:140px}.project-name{max-width:180px}.inspector{width:180px;flex-basis:180px}.browser-pane{width:208px;flex-basis:208px}.rack-guide,.channel-row{grid-template-columns:135px 123px minmax(190px,1fr);gap:8px}.channel-row,.rack-guide{padding-left:12px;padding-right:12px}.ch-name{max-width:53px}.step{height:19px}.engine-state{display:none}.toolbar-right{min-width:150px}.position-display{padding:10px 7px}.section-bar{padding:0 12px}.rack-actions{gap:4px}}@media(max-width:1100px){.inspector{display:none}.browser-pane{flex-basis:185px;width:185px}.project-name{display:none}.shortcut{display:none}.toolbar-right{min-width:140px}.rack-guide,.channel-row{grid-template-columns:128px 100px minmax(190px,1fr)}.ch-instrument select{padding:5px 0}.brandname{display:none}.logotype{min-width:42px}.rack-footer span{display:none}}@media(max-width:830px){html,body{overflow:auto}.app{min-width:0;min-height:100dvh;height:auto}.toolbar{flex-wrap:wrap;height:auto;min-height:60px;row-gap:9px;padding:10px}.toolbar-right{flex:1;min-width:0}.transport{order:3;width:100%;justify-content:center}.subbar{display:none}.browser-pane{position:fixed;z-index:50;left:0;top:0;bottom:0;width:260px;transform:translateX(-100%);transition:transform .2s;box-shadow:18px 0 38px #0009}.browser-pane.open{transform:translateX(0)}.mobile-panels{display:block;background:none;border:1px solid #45515b;color:white;padding:7px 11px;border-radius:6px}.workspace{min-height:calc(100dvh - 105px);width:100%}.workspace-heading{padding:0 8px}.section-bar{min-height:80px;flex-wrap:wrap;height:auto;padding:8px 12px;gap:5px}.rack-guide,.channel-row{grid-template-columns:99px 86px minmax(155px,1fr);gap:5px;padding-left:5px;padding-right:5px}.ch-name{font-size:10px;max-width:42px}.ch-mute,.ch-solo{width:16px}.ch-steps{gap:2px}.step{height:21px}.rack-actions{flex-wrap:wrap;justify-content:end}.rack-guide{font-size:7px}.rack-piano{display:none}.work-tabs{gap:2px}.work-tabs button{font-size:10px;padding:0 5px}.workspace-tools{gap:3px}.generator-link{font-size:10px;padding:7px}.playlist-scroller{min-height:360px}.position-display{font-size:11px}.piano-actions{justify-content:start}.mixer-board{min-height:400px}}
@media(max-width:830px){.toolbar{overflow:hidden}.transport{gap:5px;overflow:hidden}.position-display{padding:9px 5px;font-size:10px}.mode-switch{margin-right:0}.mode-switch button{padding:6px}.bpm-field{margin-left:0;padding:0 5px}.bpm-field input{width:36px}.playlist-actions{flex-wrap:wrap;max-width:100%;justify-content:flex-start;gap:6px}.playlist-actions label input{width:57px}.playlist-header{padding-bottom:10px;overflow:hidden}.playlist-scroller{max-width:100%;min-width:0}.playlist-inner{min-width:980px}}

/* MIDILAB 9.1 FLOW — clean step rack, focused transport and FL-like context controls */
.seconds-display{font-variant-numeric:tabular-nums;color:#b8ccaa;font-size:11px;font-weight:760;letter-spacing:.02em;min-width:60px;text-align:center}
.channel-context-menu{position:fixed;z-index:9999;background:#1c242c;border:1px solid #45545b;border-radius:9px;box-shadow:0 17px 45px #000b;padding:6px;min-width:204px;display:flex;flex-direction:column;gap:2px}
.channel-context-menu[hidden]{display:none}.channel-context-menu button{padding:11px 12px;background:transparent;border:0;color:#e9f0e8;text-align:left;font:inherit;font-size:12px;border-radius:5px;cursor:pointer}.channel-context-menu button:hover{background:#3a4a3d;color:#d5ffb4}.channel-context-menu button:disabled{opacity:.35;cursor:default}
.ch-asset{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#a5b5b0;min-width:0;display:block;font-size:10px;flex:1}.ch-instrument{display:flex;align-items:center;gap:8px}.insert-label{display:flex;align-items:center;gap:4px;flex:none;font-size:9px;font-weight:750;color:#94a79d}.insert-label .mixer-map{width:38px;min-width:38px;padding:5px 2px;background:#182129;border:1px solid #37444a;color:#e4efe0;border-radius:5px;font-size:11px}
.ch-steps{gap:4px}.ch-steps .step{border-radius:4px;border:1px solid #36434c;background:linear-gradient(180deg,#303b43,#252f37);box-shadow:inset 0 1px #ffffff09;transition:background .1s,transform .11s,border-color .13s;min-width:0;height:25px}.ch-steps .step:nth-child(4n+1){margin-left:4px}.ch-steps .step:nth-child(1){margin-left:0}.ch-steps .step:hover{border-color:#809782;background:#3a4c49;transform:translateY(-1px)}.ch-steps .step.on{background:linear-gradient(180deg,var(--ch-color),color-mix(in srgb,var(--ch-color) 72%,#20292c));border-color:var(--ch-color);box-shadow:0 1px 7px color-mix(in srgb,var(--ch-color) 22%,transparent)}.ch-steps .step.playhead{outline:2px solid #d4edbd;outline-offset:1px}
.channel-row{transition:background .11s}.channel-row:hover{background:#253039}.channel-row.dragover,.rack-footer.dragover,#channelRack.dragover{background:#30483c!important;outline:1px dashed #b9dc97;outline-offset:-2px}
.timeline-ruler{cursor:crosshair}.bar-num{pointer-events:none}.bar-num small{display:block;color:#788c90;font-size:9px;line-height:1.2}.play-cursor{pointer-events:none;z-index:14}.clip{touch-action:none}.clip:hover{filter:brightness(1.12)}
@media(max-width:1100px){.seconds-display{font-size:10px;min-width:48px}.ch-steps{gap:2px}.ch-steps .step:nth-child(4n+1){margin-left:2px}}
@media(max-width:830px){.seconds-display{font-size:10px}.ch-asset{font-size:9px}.ch-steps .step{height:22px}}

/* MIDILAB 9.2 — playlist-first floating workspaces */
:root{--bg:#0a0e12;--panel:#151b22;--lime:#b8d98e;--line:#28323d}
.main-layout{display:flex;flex-direction:row;background:#0d1319}
.workspace{order:1;position:relative;flex:1;min-width:0;background:#0c1218}
.browser-pane{order:2;width:260px;flex:0 0 260px;border-right:0;border-left:1px solid #28323b;background:#121820}
.inspector{display:none !important}
.workspace-heading{height:50px;min-height:50px;background:#111820;z-index:12;position:relative;padding:0 18px}
.work-tabs{gap:2px}
.work-tabs button{padding:0 13px;color:#8796a4;font-weight:640;letter-spacing:-.01em;transition:background .15s,color .15s}
.work-tabs button:hover{color:#e8f1f1;background:#202932}
.work-tabs button.active{color:#ecf6ed}
.work-tabs button.active:after{left:12px;right:12px;height:2px;background:#abd38d}
.tab-icon{color:#98a9b1}
.arrange-view{display:flex !important;flex-direction:column;min-height:0;flex:1;background:#0f151c}
.arrange-view .playlist-header{height:54px;min-height:54px;border-bottom:1px solid #2b333c;padding:0 17px}
.arrange-view .playlist-header .index-mark{display:none}
.arrange-view .playlist-header .section-heading h3{font-size:14px}
.arrange-view .playlist-header .section-heading p{font-size:10px;margin:2px 0 0}
.playlist-scroller{min-height:0;overflow:auto;flex:1;background:#11171e}
.timeline-row{height:34px}.play-cursor{top:34px}
.arrangement-track{height:62px}
.track-label{background:#171e25}
.track-lane{background-color:#111720;background-image:linear-gradient(to right,#34404a 1px,transparent 1px),linear-gradient(to right,#243039 1px,transparent 1px)}
.clip{top:6px;bottom:6px;box-shadow:none;filter:saturate(.9);border-radius:5px}
.clip.selected{outline-color:#bedda1}
.view.floating-window{display:none;position:absolute;left:18px;right:18px;top:64px;bottom:auto;z-index:30;flex-direction:column;background:#1b232c;border:1px solid #41505c;border-radius:11px;box-shadow:0 24px 75px #000a,0 1px 0 #ffffff12 inset;overflow:hidden;max-width:none;min-height:0;flex:none}
.view.floating-window.active{display:flex}
.view.floating-window .section-bar{position:relative;padding-right:53px;height:52px;min-height:52px;background:#202932;border-bottom:1px solid #33404b;gap:8px}
.view.floating-window .section-heading h3{font-size:14px}
.view.floating-window .section-heading p{font-size:9px}
.view.floating-window .index-mark{display:none}
.panel-close{position:absolute;right:10px;top:10px;width:31px;height:31px;background:#2c3641;color:#c8d2d8;font-size:22px;border:1px solid #45525c;border-radius:7px;line-height:1}
.panel-close:hover{background:#4b363b;color:#ffe2e0;border-color:#81545a}
.rack-view{max-height:min(79vh,630px);overflow:auto}
.rack-view .rack-matrix{background:#1a222b;border-bottom:0;overflow-y:auto}
.rack-view .rack-guide,.rack-view .channel-row{grid-template-columns:minmax(140px,175px) minmax(116px,155px) minmax(290px,1fr);gap:11px;padding-left:15px;padding-right:15px}
.rack-view .rack-guide{padding-top:11px;padding-bottom:8px}
.rack-view .channel-row{height:36px;border-top-color:#27333d}
.rack-view .channel-row:hover{background:#232c36}
.rack-view .ch-name{max-width:110px}
.rack-view .ch-steps{gap:4px}
.rack-view .step{height:20px;border-radius:4px;background:#2a3540;border-color:#35424c;transition:background .08s,border-color .08s,transform .08s}
.rack-view .step:nth-child(4n+1){margin-left:3px;border-left-color:#71808d}
.rack-view .step:hover{border-color:#a3b2b8;background:#38454f}
.rack-view .step.on{background:var(--ch-color);border-color:var(--ch-color);box-shadow:0 1px 3px #0003 inset}
.rack-view .step.on:nth-child(2n){opacity:1}
.rack-view .rack-footer{background:#1a222b;height:35px}
.rack-view .rack-footer span{font-size:9px}
.piano-view.floating-window{height:min(80vh,760px)}
.mixer-view.floating-window{height:min(79vh,680px)}
.view.floating-window .piano-scroll{min-height:100px}
.mixer-board{padding:12px;gap:6px}
.asset-row{padding:8px 8px;border:1px solid transparent}
.asset-row:hover{border-color:#30414a}
.browser-pane .pane-title h2{font-size:17px}
.rack-drag-hover{background:#2c3d36!important;color:#dff4c8!important;box-shadow:inset 0 -2px #b2d88a}
#channelRack .channel-row .ch-asset{white-space:nowrap;text-overflow:ellipsis;overflow:hidden;min-width:0}
#placePatternBtn{white-space:nowrap;color:#d6ebc2;border-color:#53664c;background:#29372b}
#rackView.drag-hint{outline:2px dashed #a3d18d;outline-offset:-5px}
@media(max-width:1350px){.browser-pane{flex-basis:235px;width:235px}.view.floating-window{left:12px;right:12px}.rack-view .rack-guide,.rack-view .channel-row{grid-template-columns:140px 125px minmax(285px,1fr);gap:7px}.rack-view .ch-name{max-width:73px}.work-tabs button{padding:0 10px}}
@media(max-width:1070px){.browser-pane{width:205px;flex-basis:205px}.view.floating-window{left:7px;right:7px}.rack-view .rack-guide,.rack-view .channel-row{grid-template-columns:112px 100px minmax(255px,1fr);gap:6px;padding-left:8px;padding-right:8px}.rack-view .ch-steps{gap:2px}.rack-view .ch-name{max-width:58px}}
@media(max-width:830px){.app{height:100dvh;min-height:0;overflow:hidden}.main-layout{height:calc(100dvh - 116px)}.browser-pane{position:fixed;left:auto;right:0;top:0;bottom:0;width:285px;flex-basis:285px;transform:translateX(100%);box-shadow:-18px 0 40px #000a;z-index:60}.browser-pane.open{transform:translateX(0)}.workspace{height:100%}.workspace-heading{height:52px;padding:0 6px}.work-tabs button{font-size:9px;padding:0 6px}.work-tabs{gap:0}.tab-icon{display:none}.workspace-tools .generator-link{display:none}.view.floating-window{top:55px;left:3px;right:3px;height:min(78vh,620px);max-height:78vh}.rack-view .rack-guide,.rack-view .channel-row{min-width:675px}.rack-view .rack-matrix{overflow-x:auto}.rack-view .rack-guide{display:none}.rack-view .channel-row{height:40px}.arrange-view .playlist-header{min-height:67px;height:auto}.playlist-scroller{min-height:0}.piano-view.floating-window{height:75vh}.mixer-view.floating-window{height:72vh}.toolbar{height:auto;max-height:105px}.transport{order:3}.browser-pane .library-scroll{min-height:0}}
@media(prefers-reduced-motion:reduce){.step,.work-tabs button{transition:none}}

/* MIDILAB 9.2.1 — distinguish notes from steps; easy to audition */
.rack-view .step.note-event:not(.on){border-color:#87a3ce;box-shadow:inset 0 0 0 1px #a5b4e050;background:linear-gradient(145deg,#313d55,#29384e);position:relative}
.rack-view .step.note-event:not(.on):after{content:"♪";color:#b8c8ec;position:absolute;inset:0;display:grid;place-items:center;font-size:11px;font-weight:700}
.piano-audition{font:inherit;color:#d6e7da;background:#2a3b38;border:1px solid #48635b;border-radius:6px;padding:7px 10px;white-space:nowrap;font-size:11px;cursor:pointer;transition:background .12s}
.piano-audition:hover{background:#3a514a}
@media(max-width:930px){.piano-audition{padding:6px;font-size:10px}}