@import"https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap";:root{font-family:DM Sans,Inter,Arial,sans-serif;color:#e9eee4;background:#0b0e0a;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;--bg:#0b0e0a;--surface:#131713;--surface-2:#191e19;--surface-3:#202620;--line:#2a3229;--line-soft:#222a22;--text:#e9eee4;--muted:#8f9a8e;--dim:#687468;--lime:#c5ef6b;--lime-strong:#d2ff74;--red:#ff6672;--track-head:258px}*{box-sizing:border-box}html,body,#root{min-width:320px;min-height:100%;margin:0}body{overflow:hidden}button,input{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.4}button:focus-visible,input:focus-visible,a:focus-visible{outline:2px solid var(--lime);outline-offset:2px}input{color:var(--text)}input[type=range]{accent-color:var(--lime)}a{color:inherit;text-decoration:none}::-webkit-scrollbar{width:9px;height:9px}::-webkit-scrollbar-thumb{background:#354034;border-radius:99px;border:2px solid #151a15}::-webkit-scrollbar-corner{background:#151a15}.app-shell{height:100dvh;min-height:620px;overflow:hidden;position:relative;background:radial-gradient(ellipse 80% 42% at 47% -20%,#1f2b19 0%,transparent 65%),var(--bg)}.ambient{position:absolute;pointer-events:none;filter:blur(80px);opacity:.17}.ambient-one{width:420px;height:250px;border-radius:50%;background:#54832b;top:-130px;left:30%}.ambient-two{width:300px;height:260px;border-radius:50%;background:#173c3c;right:-160px;bottom:5%}.app-header{height:72px;display:flex;align-items:center;justify-content:space-between;padding:0 32px;border-bottom:1px solid #253025;position:relative;z-index:1}.brand{display:flex;align-items:center;gap:9px;font-family:Manrope,sans-serif;font-size:25px;font-weight:800;letter-spacing:-1.4px;color:#f6f9f0}.brand img{width:28px;height:28px;object-fit:contain}.brand-accent{color:var(--lime)}.brand-divider{height:25px;width:1px;background:#354033;margin:0 7px 0 12px}.brand-section{font:700 10px DM Sans,sans-serif;letter-spacing:2.2px;color:#82917e}.header-right{display:flex;align-items:center;gap:8px}.version-pill{border:1px solid #2e3929;background:#1c2619;color:#a0b68b;border-radius:6px;padding:7px 9px;font:700 10px DM Mono,monospace;letter-spacing:.5px;margin-right:14px}.workspace{height:calc(100dvh - 72px);min-height:548px;display:flex;flex-direction:column;padding:24px 28px 18px;position:relative;z-index:1;max-width:1900px;margin:auto}.project-bar{height:72px;flex:none;display:flex;align-items:center;justify-content:space-between;gap:16px;padding-bottom:19px;border-bottom:1px solid var(--line-soft)}.project-identity{display:flex;align-items:center;gap:19px;min-width:0}.project-switch{display:flex;align-items:center;gap:13px;min-width:230px;max-width:420px;padding:0;border:0;background:transparent;color:var(--text);text-align:left}.project-avatar{display:grid;place-items:center;width:43px;height:43px;flex:none;background:linear-gradient(145deg,#304421,#1c281b);border:1px solid #526e37;border-radius:11px;color:var(--lime)}.project-switch-text{display:flex;flex-direction:column;gap:3px;min-width:0}.project-switch-text small{font:700 10px DM Sans,sans-serif;letter-spacing:1.5px;color:#849482}.project-switch-text strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:700 18px Manrope,sans-serif;letter-spacing:-.4px}.project-switch>svg:last-child{color:#738371;flex:none}.save-indicator{font-size:12px;color:#9eb196;white-space:nowrap;display:flex;align-items:center;gap:7px}.save-indicator.error{color:#ff8990}.save-indicator.saving{color:#d7bd70}.save-dot{width:6px;height:6px;background:#9de580;border-radius:100%;box-shadow:0 0 9px #9de58080}.save-indicator.saving .save-dot{background:#e7c56b;box-shadow:none}.save-indicator.error .save-dot{background:#ff6672;box-shadow:none}.project-actions,.transport-main,.transport-settings,.toolbar-actions,.toolbar-title{display:flex;align-items:center}.project-actions{gap:8px}.subtle-button,.primary-button{height:38px;display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:0 15px;border-radius:8px;font-size:12px;font-weight:700;white-space:nowrap}.subtle-button{color:#c4cec0;background:#1a211a;border:1px solid #303b30}.subtle-button:hover:not(:disabled){background:#253025}.primary-button{color:#1b2714;border:1px solid #d5f985;background:linear-gradient(#d4f982,#bce86d);box-shadow:0 4px 20px #a9da5b18}.primary-button:hover:not(:disabled){background:#d9ff8d}.primary-button.large{height:48px;padding:0 24px;font-size:14px}.icon-button{width:33px;height:33px;flex:none;display:grid;place-items:center;border:1px solid transparent;border-radius:7px;color:#9ba99b;background:transparent}.icon-button:hover:not(:disabled),.icon-button.active{color:#eaf4df;background:#263126;border-color:#344434}.transport-bar{flex:none;display:flex;align-items:center;justify-content:space-between;gap:16px;margin:20px 0 18px;padding:13px 18px;background:linear-gradient(115deg,#1a2119,#151b16);border:1px solid #303b2c;border-radius:12px;box-shadow:0 13px 35px #0002}.transport-main{gap:8px;min-width:0}.transport-main>.icon-button{width:36px;height:36px}.transport-play{display:grid;place-items:center;width:44px;height:44px;padding-left:4px;border-radius:9px;border:1px solid #d2fb7e;background:var(--lime);color:#172111;box-shadow:0 0 17px #bceb7142}.transport-play.is-playing{padding-left:0}.transport-play:hover{background:#d7ff8d}.transport-separator,.toolbar-divider{height:25px;width:1px;background:#3b4837;margin:0 5px}.record-button{height:36px;display:flex;align-items:center;gap:8px;background:#262122;border:1px solid #4b3438;border-radius:7px;color:#e8aaa9;padding:0 12px;font-weight:700;font-size:12px;white-space:nowrap}.record-button.recording{background:#572c31;color:#fff;border-color:#bd565e}.record-dot{height:10px;width:10px;border-radius:50%;background:#ff727d;box-shadow:0 0 10px #fa5b6880}.recording .record-dot{animation:pulse 1s ease-in-out infinite}.time-display{margin-left:11px;font:500 23px DM Mono,monospace;color:#e7f4dd;letter-spacing:-1.5px;white-space:nowrap}.time-display small{font:400 11px DM Mono,monospace;color:#7e8d7e;letter-spacing:0;margin-left:9px}.transport-settings{gap:8px}.pill-toggle{height:34px;display:flex;align-items:center;gap:8px;padding:0 11px;background:#202820;border:1px solid #344033;border-radius:7px;color:#a8b5a4;font-size:11px;font-weight:700;white-space:nowrap}.pill-toggle.on{background:#293e20;border-color:#779e51;color:#d5ff9b}.pill-toggle:hover{background:#2c3829}.bpm-control{height:35px;display:flex;align-items:center;gap:8px;margin-left:8px;padding:0 8px 0 12px;border:1px solid #344033;background:#202820;border-radius:7px}.bpm-control span{font:700 10px DM Sans,sans-serif;letter-spacing:1px;color:#82927d}.bpm-control input{width:50px;background:none;border:0;font:700 14px DM Mono,monospace;text-align:center;outline:none}.bpm-control input::-webkit-inner-spin-button{opacity:0}.loop-settings{display:flex;align-items:center;gap:12px;padding:9px 14px;margin:-8px 0 10px;border:1px solid #4a6339;background:#1c291b;border-radius:8px;color:#bce98f;font-size:11px;flex:none}.loop-settings>span:first-of-type{font-weight:700}.loop-settings label{display:flex;align-items:center;gap:6px;color:#9faf99}.loop-settings input{width:80px;border:1px solid #3b4a33;background:#111a11;border-radius:5px;padding:4px 5px;font:12px DM Mono,monospace}.loop-settings small{color:#82927d}.loop-tip{color:#7f927d;margin-left:auto}.editor-toolbar{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:0 5px 12px 2px;flex:none}.toolbar-title{gap:9px;white-space:nowrap}.toolbar-title svg{color:var(--lime)}.toolbar-title strong{font:700 14px Manrope,sans-serif}.toolbar-title span{font-size:11px;color:#70816f;margin-left:3px}.toolbar-actions{gap:3px}.toolbar-actions .icon-button{height:29px;width:30px}.zoom-label,.zoom-value{color:#849381;font-size:11px}.zoom-label{margin-left:6px}.zoom-range{width:82px;height:3px;margin:0 8px}.zoom-value{font-family:DM Mono,monospace;width:36px}.editor-area{flex:1;display:flex;min-height:240px;border:1px solid #2c382b;border-radius:10px;overflow:hidden;background:#111711;box-shadow:0 20px 50px #0002}.track-panel{width:var(--track-head);flex:none;background:#171d17;border-right:1px solid #394538;display:flex;flex-direction:column;overflow-y:auto;overflow-x:hidden}.track-panel-head{height:43px;flex:none;display:flex;align-items:center;justify-content:space-between;padding:0 13px 0 18px;border-bottom:1px solid #364135;background:#1b221b;color:#82947e;font-size:10px;font-weight:800;letter-spacing:1.4px}.track-panel-head button{height:26px;width:26px;display:grid;place-items:center;border-radius:5px;background:#2d392c;border:1px solid #465444;color:#b8d2a4}.track-panel-head button:hover:not(:disabled){color:var(--lime)}.track-control{height:104px;flex:none;padding:14px 13px 11px 16px;border-bottom:1px solid #293529;background:#171d17}.track-control.selected{background:#1d281b;box-shadow:inset 3px 0 var(--lime)}.track-control-top,.track-control-bottom{display:flex;align-items:center}.track-control-top{gap:10px}.track-color{height:11px;width:11px;border-radius:3px;flex:none;box-shadow:0 0 11px currentColor}.track-control-top input{min-width:0;flex:1;background:transparent;border:0;border-bottom:1px solid transparent;outline:none;color:#e9f2e7;font:700 13px Manrope,sans-serif;padding:2px 0}.track-control-top input:focus{border-color:var(--lime)}.track-delete{display:grid;place-items:center;width:22px;height:22px;background:transparent;color:#7e8e7d;border:0;opacity:0}.track-control:hover .track-delete,.track-delete:focus-visible{opacity:1}.track-delete:hover:not(:disabled){color:#f2848d}.track-control-bottom{gap:8px;margin-top:15px;flex-wrap:wrap}.track-buttons{display:flex;gap:3px}.track-buttons button{width:24px;height:24px;background:#2b342b;color:#94a493;border:1px solid #465344;border-radius:4px;font:800 10px DM Sans,sans-serif}.track-buttons button.is-on{background:#6c7848;color:#e9f8b8;border-color:#99ae5d}.track-buttons button.solo{background:#7b6938;color:#fff2b6;border-color:#b99d4f}.mini-slider{display:flex;align-items:center;gap:4px;color:#809180}.mini-slider input{width:48px;height:3px;margin:0}.pan-slider{margin-left:54px;color:#7b8c78}.pan-slider span{font:700 9px DM Mono,monospace}.pan-slider input{width:79px}.add-track{height:44px;margin:11px 12px;display:flex;align-items:center;justify-content:center;gap:8px;background:#202b1e;border:1px dashed #496248;border-radius:7px;color:#b5d09f;font-size:11px;font-weight:700}.add-track:hover:not(:disabled){background:#2a3925;color:var(--lime)}.timeline-scroller{min-width:0;flex:1;overflow:auto;position:relative;background:#131a13}.timeline{position:relative;min-height:100%;background:#151b15}.ruler{height:43px;position:relative;border-bottom:1px solid #374337;background:#1b231b;cursor:crosshair}.ruler-mark{position:absolute;bottom:0;height:9px;border-left:1px solid #455342;pointer-events:none}.ruler-mark.major{height:16px;border-color:#657960}.ruler-mark span{position:absolute;top:-15px;left:7px;color:#849682;font:10px DM Mono,monospace;white-space:nowrap}.ruler-mark:first-child span{left:7px}.loop-shade{position:absolute;top:31px;height:10px;background:#abc76066;border-top:2px solid var(--lime);pointer-events:none}.lanes{position:relative}.lane{position:relative;border-bottom:1px solid #2a352b;background:#151b15}.lane:nth-child(2n){background-color:#171e17}.lane.active{background-color:#1c251b}.lane-gridline{position:absolute;top:0;bottom:0;border-left:1px solid #2d3b2c;pointer-events:none}.audio-clip{position:absolute;top:13px;height:77px;display:flex;overflow:hidden;border:1px solid color-mix(in srgb,var(--clip-color) 54%,transparent);border-radius:7px;background:color-mix(in srgb,var(--clip-color) 13%,#182018);box-shadow:0 4px 17px #0004;cursor:grab;touch-action:none;-webkit-user-select:none;user-select:none}.audio-clip:active{cursor:grabbing}.audio-clip.selected{border-color:var(--lime);box-shadow:0 0 0 1px var(--lime),0 7px 18px #0006;z-index:3}.audio-clip.muted{opacity:.42}.clip-handle{width:8px;flex:none;cursor:ew-resize;z-index:2;background:color-mix(in srgb,var(--clip-color) 38%,transparent)}.clip-handle.left{border-right:1px solid color-mix(in srgb,var(--clip-color) 60%,transparent)}.clip-handle.right{border-left:1px solid color-mix(in srgb,var(--clip-color) 60%,transparent)}.audio-clip.selected .clip-handle{background:#c5ef6b66}.clip-content{min-width:0;flex:1;overflow:hidden;pointer-events:none}.clip-title{height:23px;display:flex;align-items:center;gap:5px;padding:0 5px;color:var(--clip-color);font-size:10px;font-weight:800;white-space:nowrap}.clip-title span:nth-child(2){overflow:hidden;text-overflow:ellipsis}.clip-duration{margin-left:auto;color:#afc0a9;font:9px DM Mono,monospace}.waveform{display:block;max-width:none;opacity:.9}.add-lane-hint{display:flex;align-items:center;gap:12px;padding-left:27px;color:#5d6f5d;font-size:11px}.add-lane-hint svg{color:#607c55}.playhead{position:absolute;top:0;bottom:0;border-left:2px solid #d5ff80;z-index:5;pointer-events:none;filter:drop-shadow(0 0 4px #b8e764aa)}.playhead-head{position:absolute;left:-6px;top:0;width:10px;height:11px;background:#d5ff80;clip-path:polygon(0 0,100% 0,50% 100%)}.editor-footer{height:44px;flex:none;display:flex;align-items:center;justify-content:space-between;gap:12px;color:#788b77;font-size:11px}.footer-left,.footer-right{display:flex;align-items:center;gap:9px;white-space:nowrap}.status-light{width:6px;height:6px;border-radius:100%;background:#aee46d;box-shadow:0 0 8px #aee46d88}.footer-separator{height:13px;width:1px;background:#344232;margin:0 4px}.empty-home{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;margin:auto;max-width:500px}.empty-home-icon{width:80px;height:80px;display:grid;place-items:center;border:1px solid #59783d;border-radius:20px;color:var(--lime);background:#263b1d;margin-bottom:28px;box-shadow:0 0 70px #a7db5825}.eyebrow{font-size:10px;font-weight:800;letter-spacing:2px;color:var(--lime)}.empty-home h1{font:800 32px Manrope,sans-serif;letter-spacing:-1px;margin:13px 0}.empty-home p{line-height:1.6;color:#94a392;margin:0 0 27px}.toast{position:fixed;right:26px;bottom:25px;z-index:20;display:flex;align-items:center;gap:12px;max-width:420px;padding:13px 15px;background:#243123;border:1px solid #60824b;border-radius:8px;box-shadow:0 15px 40px #0009;color:#dbf4d0;font-size:12px}.toast.error{background:#392528;border-color:#ae5b63;color:#ffd4d5}.toast button{background:none;border:0;color:inherit;padding:2px;display:grid;place-items:center}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:15;display:grid;place-items:center;padding:20px;background:#050805c9;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.modal{width:min(100%,530px);max-height:min(88vh,750px);overflow:auto;border:1px solid #44533d;border-radius:14px;background:linear-gradient(145deg,#1b241a,#131a14);box-shadow:0 25px 90px #000b;padding:27px}.modal-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;padding-bottom:22px}.modal-heading h2{font:800 24px Manrope,sans-serif;margin:7px 0 4px;letter-spacing:-.5px}.modal-heading p{font-size:12px;color:#97a595;margin:0}.new-project-form{display:flex;gap:9px;margin-bottom:28px}.new-project-form input{height:42px;min-width:0;flex:1;border:1px solid #455441;background:#111810;border-radius:7px;padding:0 13px;font-size:13px}.modal-list-heading{display:flex;justify-content:space-between;border-bottom:1px solid #344330;padding-bottom:10px;color:#8e9f8b;font-size:10px;font-weight:800;letter-spacing:1.4px}.modal-list-heading span{color:var(--lime)}.project-list{max-height:330px;overflow:auto}.project-item{display:flex;align-items:center;border-bottom:1px solid #2e3b2c}.project-item.current{background:#243120}.project-item>button:first-child{display:flex;align-items:center;gap:12px;flex:1;min-width:0;padding:12px 8px;border:0;background:transparent;color:var(--text);text-align:left}.project-item>button:first-child>span:nth-child(2){min-width:0;flex:1;display:flex;flex-direction:column;gap:3px}.project-item strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px}.project-item small{color:#859583;font-size:10px}.project-item-icon{display:grid;place-items:center;width:37px;height:37px;border-radius:8px;background:#33462a;color:#c9ed8e}.project-item>button:first-child>svg{color:#7e9078}.no-projects{height:120px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;color:#738371;font-size:12px}.export-options{display:grid;grid-template-columns:1fr 1fr;gap:10px}.export-options button{height:92px;text-align:left;display:flex;flex-direction:column;justify-content:center;gap:7px;padding:0 17px;border:1px solid #3a4937;border-radius:8px;background:#1b251a;color:#dee7d9}.export-options button.chosen{border-color:#addd74;background:#2b3d24;box-shadow:inset 0 0 0 1px #addd7466}.export-options strong{font:800 17px Manrope,sans-serif}.export-options span{font-size:11px;color:#9bab94}.export-summary{display:grid;grid-template-columns:1fr auto;gap:10px;margin:22px 0;padding:15px;background:#151e14;border:1px solid #30402c;border-radius:8px;font-size:11px}.export-summary span{color:#879a82}.export-summary strong{font-family:DM Mono,monospace}.modal-footer{display:flex;justify-content:flex-end}.export-status{font-size:12px;color:#bacda9;margin-bottom:18px}.export-status.failed{color:#ffadb1}.progress-track{height:6px;overflow:hidden;margin-bottom:10px;border-radius:99px;background:#354432}.progress-track div{height:100%;background:var(--lime);border-radius:99px;transition:width .3s}.export-status.processing .progress-track div,.export-status.pending .progress-track div,.export-status.queued .progress-track div{animation:progress 1.8s ease-in-out infinite alternate}.help-grid{display:grid;grid-template-columns:1fr;gap:0;border-top:1px solid #354331}.help-grid div{display:flex;justify-content:space-between;gap:15px;padding:11px 0;border-bottom:1px solid #354331;font-size:12px}.help-grid strong{color:#d7edc2}.help-grid span{color:#94a591;text-align:right}.help-note{display:flex;align-items:center;gap:8px;padding:12px;background:#263323;border-radius:7px;color:#b9cdb2;font-size:11px;line-height:1.5}@keyframes pulse{50%{box-shadow:0 0 15px #ff6672;opacity:.5}}@keyframes progress{0%{width:18%}to{width:88%}}@media(max-width:1050px){.app-header{padding:0 18px}.workspace{padding:16px 15px 12px}.project-bar{height:auto;min-height:64px}.project-identity{gap:8px}.project-switch{min-width:180px}.save-indicator{font-size:10px}.transport-bar{flex-wrap:wrap}.transport-settings{margin-left:auto}.footer-right{display:none}:root{--track-head:218px}.track-control{padding-left:10px}.mini-slider input{width:35px}.pan-slider{margin-left:43px}.pan-slider input{width:62px}}@media(max-width:720px){.app-shell{min-height:560px}.app-header{height:56px}.brand{font-size:20px}.brand img{width:23px;height:23px}.brand-section,.version-pill{display:none}.workspace{height:calc(100dvh - 56px);padding:10px 8px}.project-bar{flex-wrap:wrap;padding-bottom:10px}.project-actions{width:100%;justify-content:flex-end}.project-actions .subtle-button,.project-actions .primary-button{height:31px;font-size:10px;padding:0 8px}.project-switch-text strong{font-size:14px}.transport-bar{margin:10px 0;padding:9px}.transport-main{gap:2px}.transport-play{width:38px;height:38px}.record-button{padding:0 7px}.time-display{font-size:17px;margin-left:4px}.time-display small{display:none}.transport-settings{width:100%;justify-content:flex-end}.pill-toggle{font-size:10px}.editor-toolbar{padding-bottom:8px;flex-wrap:wrap}.toolbar-actions{width:100%;justify-content:flex-end}.toolbar-title{font-size:11px}.zoom-label,.zoom-range,.zoom-value{display:none}:root{--track-head:160px}.track-panel-head{padding-left:8px}.track-control{padding:9px 6px}.track-control-top{gap:5px}.track-control-top input{font-size:11px}.track-control-bottom{gap:4px;margin-top:10px}.mini-slider{gap:2px}.mini-slider input{width:38px}.pan-slider{margin-left:0}.pan-slider input{width:42px}.loop-settings{flex-wrap:wrap}.loop-tip{display:none}.editor-footer{font-size:10px}.footer-left{gap:5px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}