:root{--base:#15191e;--panel:#222930;--panel2:#2a323b;--edge:#3b454e;--txt:#d7dce0;--muted:#8f9ba5;--accent:#f29234;--green:#a4d36b;--purple:#a48ce3}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;font-family:Inter,'Segoe UI',Arial,sans-serif;background:transparent;color:var(--txt);font-size:12px}button,input,select{font:inherit}button{cursor:pointer;background:#303a43;border:1px solid #49535b;color:#dce3e7;border-radius:3px;padding:6px 10px}button:hover{background:#414e59;border-color:#697782}button:disabled{opacity:.4;cursor:default}input,select{color:#e6e9ec;background:#1b2128;border:1px solid #4b555e;padding:5px 8px;border-radius:3px}input[type=range]{accent-color:var(--accent);padding:0}label{font-size:10px;color:#a8b3bd;font-weight:700;letter-spacing:.8px}.hidden{display:none!important}.studio{position:absolute;width:94vw;height:89vh;left:3vw;top:5vh;background:var(--base);border:1px solid #53606c;box-shadow:0 22px 90px #000a;display:flex;flex-direction:column;overflow:hidden;min-width:900px;min-height:560px;border-radius:6px}.titlebar{height:46px;background:linear-gradient(100deg,#292f35,#161c23 65%);display:flex;align-items:center;padding:0 13px;gap:20px;border-bottom:2px solid var(--accent);flex-shrink:0;cursor:move;user-select:none}.brand{display:flex;align-items:center;gap:11px;letter-spacing:2px;font-size:14px}.brand small{display:block;color:#9da5ae;font-size:8px;letter-spacing:2.3px;padding-top:4px}.brand-icon{display:grid;place-items:center;border-radius:4px;width:29px;height:29px;background:var(--accent);color:#161616;font-weight:900;font-size:20px}.titlebar #status{color:#a4d36b;font-size:9px;letter-spacing:1.7px;margin:auto}.win-actions{display:flex;gap:4px}.win-actions button{height:26px;min-width:30px;padding:4px}.menubar{height:35px;border-bottom:1px solid var(--edge);background:#20262d;display:flex;align-items:center;justify-content:space-between;padding:3px 12px;flex-shrink:0}.menu-left{display:flex;gap:5px}.menubar button{font-size:10px;letter-spacing:.3px;padding:4px 11px}.menubar #saveBtn{color:var(--green)}#characterBadge{font-size:9px;letter-spacing:1px;color:#adb3b8}.transport{height:63px;background:linear-gradient(#292f36,#252c33);display:flex;align-items:center;padding:9px 15px;gap:24px;border-bottom:1px solid #505b64;flex-shrink:0}.transport-buttons{display:flex;gap:5px}.transport-buttons button{height:35px;min-width:37px;font-weight:bold}.green{color:#1c2419;background:#a1cb64}.green:hover{background:#b8eb76}.tempo{display:flex;flex-direction:column;align-items:center;gap:3px}.tempo input[type=number]{width:60px;text-align:center;font-size:18px;font-weight:700;color:var(--accent);padding:3px}.tempo input[type=range]{width:90px}.transport-time{background:#12191d;border:1px solid #4a5b5f;padding:8px 19px;font-size:19px;letter-spacing:2px;color:#c9e29a;font-family:Consolas,monospace}.songmode{display:flex;align-items:center;gap:5px;margin-left:auto}.songmode span{color:#9a9fa6;letter-spacing:1px;margin-right:6px}.songmode button.active{border-color:#dc994e;color:var(--accent)}.workspace{display:flex;flex:1;overflow:hidden;min-height:0}.panel{background:var(--panel);border:1px solid #3f4b56;min-height:0;overflow:hidden}.browser{width:220px;flex-shrink:0;display:flex;flex-direction:column;border-left:none;border-top:none;border-bottom:none}.panel-head{height:31px;background:linear-gradient(#38434c,#2a343c);border-bottom:1px solid #52606b;padding:8px 11px;font-size:11px;font-weight:700;letter-spacing:1px;display:flex;justify-content:space-between;align-items:center;flex-shrink:0}.panel-head span{font-size:8px;letter-spacing:.6px;color:#aeb6bd;font-weight:400}.search{margin:10px 9px;width:calc(100% - 18px)}.tabbar{display:flex;padding:0 8px 6px;gap:5px}.tabbar button{width:50%;font-size:10px}.tabbar .selected{color:#ffac53;border-color:#ee9543}.sampletree{flex:1;overflow:auto;padding:5px 8px}.kit-title{color:#e3ab69;font-weight:700;font-size:10px;padding:8px 5px 5px;display:flex;gap:6px;cursor:pointer}.sample-item{display:flex;align-items:center;padding:6px 7px;border-radius:3px;cursor:grab;gap:7px;color:#c4d0d4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sample-item:hover{background:#394652;color:#fff}.sample-item span:last-child{overflow:hidden;text-overflow:ellipsis}.sample-item .play-preview{border:0;padding:1px 4px;background:transparent;color:#95cf79;flex-shrink:0}.panel-foot{padding:8px;border-top:1px solid #424c54}.panel-foot button{width:100%;font-size:10px}.workarea{flex:1;overflow:auto;min-width:0;padding:8px;display:flex;flex-direction:column;gap:8px}.project-strip{height:35px;display:flex;align-items:center;gap:9px;flex-shrink:0;background:#272f38;padding:4px 10px;border:1px solid #3e4b53}.orange-dot{width:9px;height:9px;border-radius:50%;background:var(--accent)}#projectName{background:transparent;border:0;border-bottom:1px solid #5b636b;font-weight:700;width:200px;font-size:13px}#currentPatternLabel{margin-left:auto;color:#a7d27a;letter-spacing:1px}#patternSelect{width:105px}.upper-panels{display:grid;grid-template-columns:minmax(450px,1.1fr) minmax(340px,1fr);gap:8px;min-height:248px;height:45%;flex-shrink:0}.rack,.piano{display:flex;flex-direction:column}.rack-top{display:flex;align-items:center;height:30px;border-bottom:1px solid #404a51;gap:12px}.rack-controls{display:flex;align-items:center;gap:6px;padding:3px}.rack-controls select{padding:2px}.rack-controls button{font-size:9px;padding:3px 7px}.step-ruler{display:flex;flex:1;height:100%;align-items:center;justify-content:space-around;font:10px Consolas;color:#a9b3b9}.rack-top .step-ruler{display:none}#channelRows{overflow:auto;flex:1}.track-row{display:flex;height:37px;align-items:center;border-bottom:1px solid #313a40;gap:5px;padding:4px 7px}.track-row.active{background:#34404a}.track-name{width:116px;min-width:86px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:10px;text-align:left;padding:6px}.track-name.drum{color:#ffbf8b}.track-name.synth{color:#bcb1f2}.track-vol{width:48px}.steps{display:grid;grid-template-columns:repeat(16,minmax(13px,1fr));grid-auto-flow:row;gap:3px;flex:1;min-width:0}.step{height:21px;padding:0;border:1px solid #424e56;background:#38434a;border-radius:2px}.step.beat{background:#4d5861}.step.on{background:#e5a259;border-color:#ffcd8b}.step.on:nth-child(4n+1){background:#ffa452}.step.playhead{outline:2px solid #aadb78;outline-offset:0}.rack-bottom{padding:7px 9px;display:flex;align-items:center;gap:11px;border-top:1px solid #3f4952}.rack-bottom button{font-size:10px}.rack-bottom small{font-size:9px;color:#a6b0b7}.piano-tools{height:29px;background:#29323a;display:flex;align-items:center;gap:15px;padding:0 10px;font-size:9px;color:#abb7bd}.piano-tools select{padding:2px}.piano-scroll{display:flex;overflow:auto;flex:1;background:#182129}#pianoKeys{width:42px;flex-shrink:0}.piano-key{height:16px;border-bottom:1px solid #5b6065;background:#b9c1c8;color:#171d21;font-size:9px;padding-left:4px}.piano-key.black{background:#38414a;color:#c2c8cc}#pianoGridView{min-width:600px;flex:1;position:relative;touch-action:none}.piano-cell{position:absolute;height:16px;border-bottom:1px solid #28383c;border-right:1px solid #33434a}.piano-cell.bar{border-right:1px solid #53666d}.note{position:absolute;height:13px;background:#9fca65;border:1px solid #d3f39e;border-radius:2px;pointer-events:none}.playlist{height:26%;flex-shrink:0;overflow:auto}.timeline{height:23px;display:grid;grid-template-columns:95px repeat(8,1fr);align-items:center;font:10px Consolas;color:#b6c0c6;background:#1d252b}.timeline>span{border-right:1px solid #3b484e;padding-left:5px}.playlist-row{display:grid;grid-template-columns:95px repeat(8,1fr);height:38px;border-bottom:1px solid #3d4951}.playlist-label{background:#303b44;padding:12px 8px;color:#d4e1e4;font-size:10px}.clip-cell{border-right:1px solid #35434b;background:#242e36;padding:4px;cursor:pointer}.clip-cell:hover{background:#394752}.clip{height:100%;background:#6a7d47;border:1px solid #9bc66e;border-radius:2px;padding:4px;font-size:9px;color:#eff9db;white-space:nowrap;overflow:hidden}.mixer{height:160px;flex-shrink:0}.mixer #mixerTracks{display:flex;overflow-x:auto;height:125px;padding:6px}.mixer-channel{width:92px;min-width:92px;border-right:1px solid #47505a;display:flex;align-items:center;flex-direction:column;gap:5px;padding:5px}.mixer-channel span{max-width:85px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#aebbc5;font-size:10px}.mixer-channel input{width:70px}.mixer-channel button{font-size:9px;padding:3px 8px}.mixer-channel button.muted{background:#8a4442}.statusbar{height:25px;background:#161e24;border-top:1px solid #49565e;display:flex;justify-content:space-between;align-items:center;padding:0 11px;font-size:9px;color:#9fb18e;flex-shrink:0;letter-spacing:.7px}.modal{position:absolute;inset:0;background:#000a;display:grid;place-items:center;z-index:10}.modal-window{width:min(590px,85%);max-height:80%;overflow:auto;background:#232c34;border:1px solid #63717a;box-shadow:0 20px 80px #000b;padding:14px}.modal-heading{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #47545e;margin-bottom:12px}.modal-heading h3{margin:0 0 12px;letter-spacing:1px;color:#f2b678}.modal-list{max-height:360px;overflow:auto}.modal-row{display:flex;align-items:center;gap:10px;padding:9px 4px;border-bottom:1px solid #3c4a53}.modal-row strong{flex:1}.modal-row button{font-size:10px}.hint{color:#a6b1bb;line-height:1.8;font-size:12px}.highlight{color:#ffa955}@media(max-width:1200px){.upper-panels{grid-template-columns:1fr;height:580px}.piano,.rack{min-height:265px}.browser{width:185px}.studio{min-height:600px}}

/* Build 2 production interface */
.note{pointer-events:auto;cursor:grab;z-index:2;touch-action:none}.note:active{cursor:grabbing}.playlist{overflow:auto}.timeline,.playlist-row{width:max-content;min-width:100%}.clip-cell{width:110px}.mixer{height:220px}.mixer #mixerTracks{height:185px}.mixer-channel{min-width:108px;width:108px;gap:2px}.mixer-knob-label{display:flex;align-items:center;justify-content:space-between;width:100%;font-size:9px;gap:4px}.mixer-knob-label input{width:66px}.mixer-channel button.solo-on{background:#b38a25;color:white}.project-strip button{font-size:10px;padding:4px 6px}

/* Build 3 — private kit library controls */
.private-kit-head{display:flex;align-items:center;gap:3px;background:#263240;border-bottom:1px solid #3a4854;margin-top:5px;padding:3px 5px;border-radius:4px}
.private-kit-toggle{flex:1;text-align:left;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px;font-weight:700;color:#e4d8ff;background:transparent;border:0;cursor:pointer;padding:5px}
.kit-action{border:1px solid #536170;border-radius:4px;background:#1b2530;color:#becbd6;padding:4px 7px;cursor:pointer}
.kit-action:hover{background:#425165;color:white}
.kit-summary{font-size:10px;color:#96aabb;letter-spacing:1px;padding:9px 5px}

.track-row.drop-target{outline:2px solid #b990ed;background:#383249}

/* v1.2.0 piano controls patch */
#paintModeBtn.active{background:#a4d36b;color:#172014;border-color:#c6ec92}#paintModeBtn{white-space:nowrap;padding:3px 8px}#octaveDown,#octaveUp{padding:2px 7px}#keyboardOctave{white-space:nowrap;color:#d2eaa2;font-weight:700}.piano-tools{gap:6px;white-space:nowrap;overflow-x:auto;flex-shrink:0}.piano-tools .kb-guide{color:#b0a3dc}.note.paint-live{opacity:.85;pointer-events:none}

/* Build 4 transport and editing tools */
.groove-control{min-width:115px}.groove-control input{width:100px;accent-color:#ed9b48}.groove-control label span{font-size:10px;color:#ffc37a}#metronomeBtn.active{background:#b77c2a;color:#fff;border-color:#f7bd66}.piano-tools{flex-wrap:wrap;gap:5px}.piano-tools button{white-space:nowrap}

/* Build 4 piano transport and interactive keyboard feedback */
#pianoGridView .piano-playback-line{position:absolute;top:0;bottom:0;width:2px;background:#ffad3f;box-shadow:0 0 8px 2px #f5a03799;z-index:6;pointer-events:none;transition:left 38ms linear}
#pianoGridView .piano-playback-line::before{content:'';position:absolute;left:-4px;top:0;border-left:5px solid transparent;border-right:5px solid transparent;border-top:7px solid #ffbb57}
.piano-key.pressed{background:#f5a442!important;color:#101619!important;box-shadow:inset 0 0 0 2px #fff3b4;font-weight:800}
#pianoGridView .piano-row-highlight{position:absolute;left:0;right:0;height:16px;z-index:1;pointer-events:none;background:transparent}
#pianoGridView .piano-row-highlight.pressed{background:#f7ae3b3c;box-shadow:inset 0 1px #ffd17b44,inset 0 -1px #ffd17b44}

/* Multi-lane playlist extension */
.playlist{height:32%;min-height:165px;overflow:auto;position:relative}
.timeline{position:sticky;top:0;z-index:4}
.playlist-row{height:35px}
.playlist-label{position:sticky;left:0;z-index:3;width:125px;background:#303b44;border-right:1px solid #58636c;padding:11px 10px;font-weight:700}
.timeline>span:first-child{position:sticky;left:0;background:#202930;z-index:5}
.clip{background:hsl(var(--clip-hue,80) 28% 35%);border-color:hsl(var(--clip-hue,80) 52% 57%)}
.clip-cell.playing-bar{box-shadow:inset 2px 0 #ff9e3c,inset -2px 0 #ff9e3c;background:#433b32}

/* BUILD 5 PLAYLIST WORKFLOW */
.playlist-tools{display:flex;align-items:center;gap:7px;padding:5px 10px;background:#202b34;border-bottom:1px solid #46505c;min-width:max-content}
.playlist-tools button{padding:4px 9px;border:1px solid #55616e;background:#35424d;color:#e3e7eb;border-radius:3px;cursor:pointer;font-size:11px;font-weight:700}
.playlist-tools button:hover{background:#566674}
.playlist-tools span{font-size:10px;color:#b6c1cd;letter-spacing:.2px}
.playlist-label{width:178px;display:flex;align-items:center;gap:4px;padding:4px 6px}
.lane-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:left;color:#e9edf0;background:transparent;border:none;font-size:11px;font-weight:700;cursor:pointer}
.lane-toggle{background:#23303b;border:1px solid #596675;color:#b6c1cb;font-size:10px;font-weight:700;border-radius:3px;width:23px;height:22px;cursor:pointer;flex:none}
.lane-toggle.enabled{background:#ae6535;color:white;border-color:#eea05c}
.lane-toggle.solo{background:#427348;border-color:#78ba82}
.lane-muted .clip{opacity:.28}
.clip-cell.clip-selected{outline:2px solid #ffc168;outline-offset:-2px;background:#6a4839}

/* Build 6 mixer */
.build6-channel{position:relative;min-width:124px;padding:10px 7px 9px 12px;gap:6px}
.build6-channel .mixer-name{max-width:108px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:700}
.build6-channel .mixer-knob-label{font-size:10px;letter-spacing:.35px}
.build6-channel .dial-value{color:#ffbb75;font-variant-numeric:tabular-nums;font-size:10px;margin-left:4px}
.build6-channel input[type=range]{accent-color:#e69b49}
.meter-wrap{position:absolute;top:38px;right:2px;bottom:12px;width:5px;background:#131b20;border-radius:3px;overflow:hidden;border:1px solid #4b5257}
.meter-fill{position:absolute;bottom:0;left:0;right:0;height:2%;background:linear-gradient(to top,#31c279 0%,#b6cb57 65%,#f08f44 100%);transition:height .06s linear}

/* Build 6 piano-roll note clipboard selection */
#pianoGridView .note.selected-note { outline: 2px solid #ffcc6e; outline-offset: -1px; filter: brightness(1.22); z-index: 9; }


/* Build 6 Channel Rack horizontal step timeline: 16/32/64 stay on one row.
   The channel list owns a single horizontal scrollbar shared by every track. */
#channelRows { overflow-x:auto; overflow-y:auto; overscroll-behavior-x:contain; }
#channelRows .track-row { width:max-content; min-width:100%; flex-wrap:nowrap; }
#channelRows .track-row .track-name { position:sticky; left:0; z-index:3; flex:0 0 116px; width:116px; min-width:116px; background:#2c353e; }
#channelRows .track-row.active .track-name { background:#34404a; }
#channelRows .track-row .track-vol { flex:0 0 48px; }
#channelRows .steps { display:grid; flex:0 0 auto; grid-template-columns:repeat(var(--rack-step-count,16),20px); grid-template-rows:21px; grid-auto-flow:column; gap:3px; width:max-content; min-width:0; }
#channelRows .steps .step { width:20px; height:21px; min-width:20px; flex:none; }


/* BUILD 7: piano-first multiwindow DAW. Legacy audio/editor IDs remain unchanged. */
:root{--base:#171a1c;--panel:#252a2c;--panel2:#33393b;--edge:#414849;--accent:#f8a246;--green:#b3d86d}
.studio{width:96vw;height:93vh;left:2vw;top:3vh;min-width:840px;min-height:580px;border-radius:3px;border-color:#69706d}
.titlebar{height:37px;background:linear-gradient(#343a3a,#242b2a);border-bottom:1px solid #525b57}
.brand-icon{background:#db9147}.brand{font-size:12px}.brand small{letter-spacing:1.4px}
.menubar{height:31px;background:#303534}.menubar button{border-color:transparent;background:#303534}
.transport{height:58px;background:linear-gradient(#343b39,#2b3130);gap:15px}
.browser{width:218px;background:#262d2c}.workspace{background:#171b1b}
.workarea{position:relative;overflow:hidden;padding:7px;gap:0;background:radial-gradient(ellipse at 65% 42%,#28312c,#191e1e 90%)}
.project-strip{height:35px;margin-bottom:5px;z-index:1;background:#2b3230;border-color:#454d49}
.daw-layout-toolbar{height:35px;display:flex;align-items:center;gap:5px;padding:3px 8px;background:#242c29;border:1px solid #48534e;flex-shrink:0;z-index:2}
.daw-layout-toolbar button{font-size:10px;background:#343d39;border-color:#59645e;padding:5px 9px;white-space:nowrap}
.daw-layout-toolbar button.daw-active{border-color:#e4a356;background:#4b4336;color:#ffd192}
.daw-layout-toolbar button small{color:#97a39c;margin-left:5px}.daw-layout-label{color:#ffbf74;font-weight:800;letter-spacing:1px;margin-right:7px;white-space:nowrap}
.daw-layout-tip{margin-left:auto;font-size:9px;color:#9ba89d;white-space:nowrap}
.upper-panels{display:contents}
.workarea>.upper-panels>.panel,.workarea>.panel{position:absolute;margin:0;display:flex;flex-direction:column;box-shadow:0 8px 22px #0009;background:#252c2a;border:1px solid #64706a;border-radius:2px;min-width:265px;min-height:155px;resize:both;overflow:hidden}
.workarea .panel-head{cursor:move;user-select:none;height:30px;background:linear-gradient(#4b5450,#333d38);border-bottom:1px solid #758079;color:#f4e7cd;touch-action:none}
.workarea>.upper-panels>.piano{left:8px;top:116px;width:calc(100% - 16px);height:calc(100% - 128px);z-index:3}
.workarea>.upper-panels>.rack{left:42%;top:122px;width:55%;height:212px;z-index:5}
.workarea>.playlist{left:20px;top:calc(100% - 254px);width:72%;height:240px;z-index:4}
.workarea>.mixer{left:23%;top:calc(100% - 300px);width:73%;height:285px;z-index:6;display:none}
.workarea .daw-minimized{display:none!important}
.workarea .panel.daw-focused{border-color:#e8a65b;box-shadow:0 11px 28px #000b,0 0 0 1px #b88649}
.workarea .panel-head::after{content:'⠿';color:#c1ccc2;font-size:13px;margin-left:8px}
.workarea .piano-tools{height:auto;min-height:34px;flex-wrap:wrap;gap:5px;padding:5px 8px;background:#303a34}
.workarea .piano-tools button{padding:4px 6px;font-size:10px}
.workarea .piano-scroll{min-height:0;flex:1}.workarea #pianoGridView{min-width:700px}.workarea #pianoKeys{width:46px}
.workarea .rack-bottom{padding:5px 8px}.workarea #channelRows{min-height:0;flex:1}
.workarea .playlist-tools{flex-shrink:0}.workarea .playlist{overflow:hidden}.workarea #playlistRows{overflow:auto;flex:1;min-height:0}.workarea .timeline{flex-shrink:0}
.workarea .mixer #mixerTracks{height:auto;min-height:0;flex:1;overflow:auto}
@media(max-width:1200px){.upper-panels{display:contents}.workarea>.upper-panels>.piano{min-height:180px}.workarea>.upper-panels>.rack{min-height:160px}.daw-layout-tip{display:none}}


/* BUILD 7 CLASSIC+ — FL Studio-inspired, original Renegade production UI.
   Original branding and functional NUI controls, no copied application assets. */
:root{--base:#252927;--panel:#303631;--panel2:#393e39;--edge:#525851;--accent:#ed9c45;--green:#a5ce64;--purple:#a48dd5;--txt:#d5dbd1;--muted:#9da99b}
body{font-family:'Segoe UI',Tahoma,Arial,sans-serif;font-size:11px}
.studio{width:97vw;height:94vh;top:3vh;left:1.5vw;border-color:#60685c;border-radius:2px;background:#242826;box-shadow:0 10px 30px #000a,0 0 0 1px #121613}
.studio button{background:linear-gradient(#4c534b,#363b36);border:1px solid #626a5f;color:#dce1d7;border-radius:2px;box-shadow:inset 0 1px #ffffff0d;padding:4px 7px;white-space:nowrap;font-weight:600}
.studio button:hover{background:#5e6a59;border-color:#99a48b;color:white}
.studio button:active{background:#344033;box-shadow:inset 0 2px 4px #0005}
.studio input,.studio select{border:1px solid #545f56;border-radius:2px;background:#242a26;color:#dbe5d3;font-size:11px}
.titlebar{height:31px;gap:8px;padding:0 8px;background:linear-gradient(#41483f,#2c312d);border-bottom:1px solid #161f17;cursor:move}
.brand{font-size:11px;letter-spacing:1px;gap:7px;font-weight:700;color:#f2e4cc}.brand small{font-size:7px;letter-spacing:1.2px;color:#aebcaa}.brand small em{font-style:normal;color:#ffba61}.brand-icon{width:21px;height:21px;font-size:15px;border:1px solid #ebbd80;background:linear-gradient(#e5a65f,#a96c2e);color:#292821;box-shadow:0 1px 4px #0008}
.title-project{color:#9aa996;letter-spacing:1.6px;font-size:9px;margin-left:14px}.title-build{color:#deb577;border-left:1px solid #677163;margin-left:12px;padding-left:12px}
.titlebar #status{margin-left:auto;margin-right:20px;color:#bad58f;font-size:9px;letter-spacing:1px}.win-actions button{height:20px;min-width:22px;font-size:11px;padding:1px 4px;background:#3b433b}
.menubar{height:27px;padding:0 7px;justify-content:flex-start;gap:8px;background:linear-gradient(#333a34,#2d342e);border-bottom:1px solid #51594f}
.menu-left{gap:1px;align-items:center}.menubar button{font-size:10px;box-shadow:none;border:1px solid transparent;padding:4px 7px;background:transparent;letter-spacing:0}.menubar button:hover{background:#485449;border-color:#657460}.menubar #saveBtn{color:#c9e5a4}.menu-caret{font-size:7px;color:#97a395}.menubar-separator{height:14px;margin:0 3px;border-left:1px solid #656d61}#characterBadge{margin-left:auto;font-size:9px;color:#b0bdab;letter-spacing:.35px}
.transport{height:58px;gap:14px;padding:5px 10px;background:linear-gradient(#404740,#353c35);border-top:1px solid #555e54;border-bottom:2px solid #1d251c}
.transport-kicker{font-size:8px;font-weight:700;letter-spacing:1px;color:#acb7a4;writing-mode:vertical-rl;transform:rotate(180deg);height:38px;text-align:center}
.transport-buttons{gap:3px}.transport-buttons button{height:32px;min-width:32px;font-size:14px;border-radius:2px;padding:5px 7px}.transport-buttons #playBtn{color:#1e2a18;background:linear-gradient(#bfd98b,#7fac5c);border-color:#c5e292}.transport-buttons #stopBtn{color:#edddd0}.transport-buttons #exportBtn{font-size:10px;min-width:62px;color:#ecc08d}
.tempo{gap:2px;flex:none}.tempo label,.songmode span{font-size:9px;color:#c4c7ac;letter-spacing:1px}.tempo input[type=number]{width:59px;color:#f3b66f;background:#1f2922;border:1px solid #647665;font-size:16px;font-weight:800;height:29px;font-family:Consolas,monospace}.tempo input[type=range]{width:80px;accent-color:#eab05e}.groove-control{min-width:86px}.groove-control input{width:86px}.transport-clock{display:flex;flex-direction:column;align-items:center;gap:1px}.clock-label{font-size:8px;letter-spacing:1.8px;color:#a9b59d}.transport-time{background:#172419;color:#c5e9aa;border:1px solid #5f775f;border-radius:2px;font:700 19px Consolas,monospace;padding:3px 12px;letter-spacing:2px;box-shadow:inset 0 1px 5px #0008}.songmode{gap:3px;display:flex}.songmode span{margin-right:7px}.songmode button{min-width:40px;padding:7px 6px}.songmode button.active{color:#b8de83;border-color:#9bbc73;background:#344d33}#metronomeBtn{font-size:10px;max-height:32px}
.workspace{background:#242825}.browser{width:185px;min-width:185px;background:#303832;border-right:2px solid #151d15}.panel{border-color:#596158;background:#2f3631}.panel-head{height:25px;gap:5px;justify-content:flex-start;padding:3px 8px;color:#e8e7d7;background:linear-gradient(#535d51,#3b443b);border-bottom:1px solid #222c21;letter-spacing:.4px;font-size:10px;text-shadow:0 1px #1a221b;font-weight:700}.panel-head>span:not(.head-symbol){font-size:9px;color:#c4c9b8;letter-spacing:0}.head-symbol{font-size:13px;color:#f4b75a}.browser-location{height:28px;display:flex;align-items:center;justify-content:space-between;padding:0 9px;color:#c8d2c0;background:#374037;border-bottom:1px solid #55604f;font-size:10px}.browser .search{margin:7px;width:calc(100% - 14px);height:25px;background:#262e28;border-color:#5e695d}.browser .tabbar{padding:1px 7px 7px;gap:3px}.browser .tabbar button{font-size:9px;padding:5px 1px;border-color:#525d52}.browser .tabbar button.selected{color:#f5be70;background:#3c4639;border-bottom:2px solid #e6a456}.sampletree{padding:3px 5px}.sample-item{border-radius:0;border-bottom:1px solid #ffffff08;padding:5px 7px;font-size:10px;color:#c3cdbf}.sample-item:hover{background:#4d5a49}.kit-title{color:#dcb17b;padding:7px 3px 3px}.panel-foot{background:#29322a;border-color:#4b594a}.panel-foot button{font-size:9px}
.workarea{padding:6px;background:repeating-linear-gradient(0deg,#282d29,#282d29 31px,#262b26 32px),#282d29}
.project-strip{height:31px;margin-bottom:4px;padding:2px 8px;border-color:#48564b;background:linear-gradient(#363e36,#30372f)}.project-strip button{padding:4px 7px;font-size:9px}.orange-dot{width:6px;height:6px;box-shadow:0 0 7px #ffc16b}#projectName{border-bottom:1px solid #75806d;color:#dbe5d7;font-size:11px;width:165px}.project-strip #currentPatternLabel{color:#b9d78c;font-size:10px}
.daw-layout-toolbar{height:31px;padding:2px 5px;gap:3px;background:linear-gradient(#3e463c,#343b33);border-color:#566153}.daw-layout-label{font-size:8px;letter-spacing:.8px;color:#bdbdb0;margin-right:5px}.daw-layout-toolbar button{padding:4px 7px;background:#414a40;border:1px solid #697264;color:#ccd7ca;font-size:9px;letter-spacing:.1px;display:flex;align-items:center;gap:4px;height:24px}.daw-layout-toolbar button.daw-active{border-color:#be9b65;background:#5b523e;color:#ffd397}.daw-layout-toolbar button small{font-size:8px;color:#aeba9d}.daw-tool-icon{font-size:12px;color:#a5ce72}.daw-layout-toolbar button.daw-active .daw-tool-icon{color:#f3ba71}.daw-layout-tip{font-size:8px;color:#a1ab9b;letter-spacing:.3px}
.workarea>.upper-panels>.panel,.workarea>.panel{background:#303630;border:1px solid #687463;box-shadow:0 8px 24px #000c;min-width:270px;min-height:145px;resize:both;border-radius:1px}.workarea .panel-head{height:25px;background:linear-gradient(#626e5f,#424b41);border-bottom:1px solid #1d251c;padding:2px 5px 2px 9px;cursor:move;user-select:none;touch-action:none}.workarea .panel-head::after{content:none}.workarea .panel-head .panel-window-actions{margin-left:auto;display:flex}.panel-window-actions button{height:17px;min-width:21px;padding:0 3px;background:#374336;border:1px solid #80917c;font-size:15px;line-height:12px;color:#e1e8db}.workarea .panel.daw-focused{border-color:#e4a658;box-shadow:0 10px 33px #000c,0 0 0 1px #8c7957}
.workarea>.upper-panels>.piano{left:6px;top:76px;width:calc(100% - 12px);height:calc(100% - 88px);z-index:3}
.workarea>.upper-panels>.rack{left:51%;top:130px;width:47%;height:175px;z-index:5}
.workarea>.playlist{left:27%;top:calc(100% - 222px);width:71%;height:210px;z-index:4}
.workarea>.mixer{left:25%;top:calc(100% - 310px);width:73%;height:292px;z-index:6}
.workarea .piano-tools{min-height:30px;padding:3px 6px;gap:3px;flex-wrap:nowrap;overflow-x:auto;background:linear-gradient(#404940,#353e36);border-bottom:1px solid #667360;white-space:nowrap;scrollbar-width:thin}.workarea .piano-tools button{padding:3px 6px;font-size:9px;height:22px}.workarea .piano-tools label{display:flex;align-items:center;gap:4px}.workarea .piano-tools span{font-size:9px}.piano-tool-help{color:#9ba992}.kb-guide{color:#c7bea5!important}#paintModeBtn.active{background:#779b51;border-color:#c4e4a0;color:#0e200c}
.piano-top-ruler{height:23px;flex:0 0 23px;display:flex;overflow:hidden;background:#444e42;border-bottom:1px solid #697368}.piano-ruler-corner{width:47px;min-width:47px;display:grid;place-items:center;border-right:2px solid #171e17;color:#e0bd80;font-size:15px;background:#394338}.piano-ruler-window{flex:1;min-width:0;position:relative;overflow:hidden}.piano-ruler-window #pianoRulerTicks{height:100%;position:relative;will-change:transform}.piano-ruler-beat{position:absolute;top:0;bottom:0;border-left:1px solid #697365;color:#c6cebf;font:9px Consolas,monospace;padding:3px 0 0 4px;background:linear-gradient(90deg,#ffffff0a,transparent)}.piano-ruler-bar{color:#f2cd8a;font-size:10px;font-weight:bold;background:#4c5547;border-left:2px solid #d5a469}
.workarea .piano-scroll{flex:1;min-height:50px;background:#242e27;scrollbar-width:thin;scrollbar-color:#667766 #202921}.workarea #pianoKeys{width:47px;min-width:47px;background:#303a30;position:sticky;left:0;z-index:11}.piano-key{height:16px;border-bottom:1px solid #91998e;color:#3b443b;background:linear-gradient(90deg,#e8eae0,#c8d2c0);font-size:8px;padding-left:3px;line-height:16px;box-shadow:inset 0 1px #fff}.piano-key.black{color:#e1e5dd;background:linear-gradient(90deg,#222a23,#4b574b 95%);border-bottom-color:#1c241d;font-size:8px}.piano-key.pressed{background:#f4a94a!important;color:#1c241a!important}
#pianoGridView{background:#293329}.piano-cell{border-bottom:1px solid #3e483e;border-right:1px solid #404b3d;background:#ffffff00}.piano-cell.dark-key-row{background:#00000020;border-bottom-color:#333d34}.piano-cell.root-key-row{border-bottom-color:#6d806c}.piano-cell.bar{border-right:1px solid #617060}.piano-cell.measure-end{border-right:2px solid #86967f}.piano-cell:hover{background:#96b77526}.note{height:13px;background:linear-gradient(#c1e88a,#84b35c);border:1px solid #d2efac;border-radius:1px;color:#284020;box-shadow:inset 0 -2px #53824466,0 1px 1px #0008}.note.selected-note{outline:2px solid #f7d281!important;filter:brightness(1.2)}#pianoGridView .piano-playback-line{width:2px;background:#ffac47;box-shadow:0 0 3px 1px #f3a246a8;z-index:12}
.piano-velocity{height:77px;flex:0 0 77px;display:flex;background:#202a20;border-top:2px solid #556854;overflow:hidden}.velocity-label{min-width:47px;width:47px;border-right:2px solid #151b15;display:flex;flex-direction:column;align-items:center;justify-content:space-around;background:#394538;color:#c3d2b7;font-weight:700;font-size:8px;letter-spacing:.4px;writing-mode:vertical-lr}.velocity-label span{color:#eda956;font-size:12px}.velocity-window{flex:1;min-width:0;overflow:hidden;position:relative;background:repeating-linear-gradient(to bottom,#344333 0,#344333 1px,#263026 1px,#263026 17px)}#velocityBars{position:relative;height:100%;will-change:transform}.velocity-stem{position:absolute;bottom:4px;width:5px;background:linear-gradient(#b8e57d,#729e50);border:1px solid #d0f09b;border-radius:1px 1px 0 0;cursor:ns-resize;touch-action:none}.velocity-stem.selected{background:#f6af60;border-color:#ffcd92}
.workarea .rack-top{height:27px;min-height:27px;background:#3b463d}.rack-controls{gap:4px}.rack-controls button{padding:3px 6px;font-size:9px}.rack-bottom{background:#374039;min-height:29px}.rack-bottom small{font-size:9px}.track-row{height:30px;padding:3px 5px;background:#354036;border-bottom:1px solid #212c22}.track-row:nth-child(even){background:#303a32}.track-row.active{background:#46543f}.track-name{width:101px;min-width:101px;padding:3px 6px;text-align:left;font-size:9px;color:#eac593}.track-vol{width:43px!important}.track-row .steps .step{height:18px!important;min-height:18px!important;border:1px solid #687467;background:linear-gradient(#4b554c,#3b453d)}.track-row .steps .step.on{background:linear-gradient(#ffd09a,#e69447);border-color:#f3be85}.track-row .steps .step.playhead{outline:2px solid #b8e77d;outline-offset:0}.track-row .steps{grid-template-rows:18px!important}.track-row .track-name{background:#3b473c!important}
.playlist .panel-head{flex-shrink:0}.playlist-tools{background:#323d33;gap:4px;padding:3px 6px}.playlist-tools button{font-size:9px;padding:3px 5px}.playlist-tools span{font-size:9px;color:#aab8a3}.timeline{height:19px;background:#29352b;color:#b9c8b1;font-size:9px}.playlist-row{height:30px;border-bottom-color:#475548}.playlist-label{width:178px;background:#384438;padding:3px 5px}.lane-name{font-size:10px}.clip-cell{background:#2c362d;border-right-color:#596b58;padding:3px}.clip-cell:nth-child(even){background:#303a30}.clip{font-size:9px;padding:3px;border:1px solid hsl(var(--clip-hue,80) 65% 59%);border-radius:1px;box-shadow:inset 0 1px #ffffff21}.workarea #playlistRows{overflow:auto}
.mixer #mixerTracks{background:#29332a}.mixer-channel{background:#343f35;border-right:1px solid #1c2b1e}.build6-channel .meter-wrap{border-color:#58715b}.build6-channel input[type=range]{accent-color:#e8a04a}
.statusbar{height:21px;font-size:9px;color:#c0cdb8;letter-spacing:.2px;background:#303b32;border-top:1px solid #697969}.modal-window{background:#313a31;border:1px solid #9cac94}.modal-heading h3{color:#f1bb7a}
@media(max-width:1270px){.daw-layout-tip{display:none}.title-project{display:none}.transport{gap:7px}.groove-control{display:none}.browser{width:165px;min-width:165px}.piano-tool-help{display:none}.workarea>.upper-panels>.rack{left:45%;width:53%}}