:root{color-scheme:dark;font-family:Chakra Petch,sans-serif;--bg-main: #0c0c0e;--bg-panel: #141418;--border-color: #2c2c35;--border-focus: #505060;--text-main: #d0d0d5;--text-muted: #6b6b7a;--lcd-font: "Share Tech Mono", monospace;--lcd-bg: #050a0f;--lcd-text: #00ffcc;--lcd-dim: #004433;--accent-amber: #ffaa00;--accent-red: #ff3344;--accent-blue: #33aaff;--success: #44dd44;--meter-bg: #09090b}*{box-sizing:border-box}body{margin:0;background:var(--bg-main);color:var(--text-main);overflow:hidden;-webkit-user-select:none;user-select:none}h1,h2,h3,h4{margin:0;font-weight:600;text-transform:uppercase;letter-spacing:1px}button,input,select{font-family:inherit;outline:none}button{background:var(--bg-panel);border:1px solid var(--border-color);color:var(--text-main);padding:2px 6px;font-size:.65rem;text-transform:uppercase;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;border-radius:1px;transition:background .1s}button:hover{background:#2a2a35;border-color:var(--border-focus)}button:active{background:var(--accent-blue);color:#000}button.danger{color:var(--accent-red);border-color:var(--accent-red)}[data-tooltip]{position:relative}[data-tooltip]:before{content:attr(data-tooltip);position:absolute;bottom:100%;left:50%;transform:translate(-50%);margin-bottom:4px;padding:4px 8px;background:#111;color:#fff;font-size:.65rem;white-space:nowrap;border:1px solid #444;border-radius:3px;z-index:9999;pointer-events:none;box-shadow:0 4px 8px #000c;opacity:0;transition:opacity .15s ease-in-out;transition-delay:0s;font-family:Chakra Petch,sans-serif;font-weight:400;text-transform:none;letter-spacing:normal}[data-tooltip]:hover:before{opacity:1;transition-delay:3s}.app-shell{height:100dvh;display:flex;flex-direction:column}.app-header{padding:0 .5rem;height:32px;background:#000;border-bottom:2px solid var(--border-color);display:flex;justify-content:space-between;align-items:center;flex-shrink:0}.app-header h1{font-size:1.25rem;color:var(--accent-amber);margin-right:.5rem}.app-header p{display:none}.header-actions{display:flex;gap:3px}.header-actions button{height:20px;font-size:.6rem;display:inline-flex;align-items:center;gap:2px}@media(max-width:900px){.header-actions .desktop-only{display:none!important}}.samples-dropdown{position:absolute;top:100%;left:0;margin-top:4px;background:var(--bg-panel);border:1px solid var(--border-color);border-radius:4px;padding:4px;display:flex;flex-direction:column;gap:2px;z-index:200;box-shadow:0 8px 24px #000000b3;min-width:160px}.samples-dropdown button{text-align:left;font-size:.65rem;padding:4px 8px;white-space:nowrap}.samples-dropdown button:hover{background:var(--accent-blue);color:#000}.samples-dropdown-credit{font-size:.55rem;color:var(--text-muted);padding:2px 8px;border-bottom:1px solid var(--border-color);margin-bottom:2px}.samples-dropdown-credit a{color:var(--accent-blue)}.app-main{flex:1;display:flex;overflow:hidden}.app-sidebar{width:160px;min-width:160px;background:var(--bg-panel);border-right:2px solid var(--border-color);padding:4px;overflow-y:auto;flex-shrink:0;font-size:.65rem;transition:width .2s,min-width .2s,padding .2s}.app-sidebar.collapsed{width:0;min-width:0;padding:0;overflow:hidden;border-right:none}.sidebar-header{padding:2px 0;margin-bottom:4px}.sidebar-content{overflow-y:auto}.workspace{flex:1;display:flex;flex-direction:column;padding:3px;gap:3px;min-height:0;min-width:0}.compact-timeline{display:flex;background:var(--lcd-bg);border:1px solid var(--border-color);padding:1px 8px;font-family:var(--lcd-font);color:var(--accent-amber);font-size:.95rem;align-items:center;height:24px;flex-shrink:0;overflow:hidden;min-width:0}.timeline-content{display:flex;gap:1rem;white-space:nowrap}.timeline-content.scrolling{animation:cd-scroll 24s linear infinite}@keyframes cd-scroll{0%{transform:translate(0)}25%,90%{transform:translate(calc(-1 * var(--scroll-distance, 50px)))}90.1%,to{transform:translate(0)}}.compact-timeline .lcd-data{white-space:nowrap}.channel-console-panel{flex:1;display:flex;flex-direction:column;background:var(--bg-panel);border:1px solid var(--border-color);padding:3px;min-height:0}.channel-console-panel h2{font-size:.7rem}.channel-master-metrics{display:none}.channel-console-grid{flex:1;display:grid;grid-template-columns:repeat(8,1fr);grid-template-rows:repeat(2,minmax(0,1fr));gap:2px;min-height:0}@media(max-width:900px){.channel-console-grid{grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(4,minmax(0,1fr))}}.channel-strip{background:#08080a;border:1px solid var(--border-color);display:flex;flex-direction:column;padding:2px;gap:1px;min-height:180px;min-width:60px}@media(max-width:900px){.channel-strip{min-height:0;min-width:0;overflow:hidden}}.strip-header{display:flex;align-items:center;justify-content:space-between;height:14px}.strip-title{font-size:.75rem;font-weight:700;color:#fff}.strip-badge{font-size:.6rem;padding:1px 4px;background:#222;color:#888;border-radius:2px;line-height:1.2;font-weight:700}.strip-badge.drum{background:#422;color:#f88}.strip-badge.melody{background:#224;color:#88f}.strip-badge.hold-on{background:var(--accent-red);color:#fff}.strip-badge.hold-off{background:#1a1a1a;color:#444}.strip-hold{display:flex;justify-content:center;align-items:center;padding:2px 0;margin:1px 0;border-radius:2px;flex:0 0 auto}.strip-hold .hold-label{font-size:.6rem;font-weight:700}.strip-hold.hold-on{background:var(--accent-red);color:#fff}.strip-hold.hold-off{background:#1a1a1a;color:#444}.strip-hold-mod{display:flex;gap:1px;flex:0 0 auto}.strip-hold-half{flex:1;display:flex;justify-content:center;align-items:center;padding:2px 0;border-radius:2px}.strip-hold-half .hold-label{font-size:.6rem;font-weight:700}.strip-hold-half.hold-on{background:var(--accent-red);color:#fff}.strip-hold-half.hold-off{background:#1a1a1a;color:#444}.strip-hold-half.mod-on{background:#63c;color:#fff}.strip-hold-half.mod-off{background:#1a1a1a;color:#444}.strip-toggles{display:flex;gap:1px}.toggle-btn{flex:1;font-size:.6rem;font-weight:700;padding:0;height:18px;border:1px solid #333;background:#111}.toggle-btn.active.mute-btn{background:var(--accent-red);color:#000;border-color:var(--accent-red)}.toggle-btn.active.solo-btn{background:var(--accent-amber);color:#000;border-color:var(--accent-amber)}.strip-vertical-meters{flex:1;display:flex;gap:2px;min-height:0}@media(max-width:900px){.strip-vertical-meters{flex-direction:column;flex:0 0 auto;gap:1px}}.meter-col{flex:1;display:flex;flex-direction:column;align-items:center;min-height:0}@media(max-width:900px){.meter-col{flex-direction:row;min-height:auto;flex:0 0 auto}}.meter-col label{font-size:.65rem;color:var(--text-muted);line-height:1;margin-bottom:2px;font-weight:700}@media(max-width:900px){.meter-col label{margin-bottom:0;margin-right:2px;width:20px;text-align:right;font-size:.55rem}}.v-meter-track{width:60%;flex:1;background:var(--meter-bg);border:1px solid #1a1a1a;position:relative;overflow:hidden;min-height:0}@media(max-width:900px){.v-meter-track{width:auto;height:8px;min-height:4px;flex:1}}.v-meter-fill{position:absolute;bottom:0;left:0;width:100%;transition:height .06s linear}@media(max-width:900px){.v-meter-fill{height:100%!important;width:var(--val, 0%);transition:width .06s linear}}.vol-fill{background:var(--accent-amber)}.exp-fill{background:var(--accent-blue)}.out-fill{background:var(--lcd-text)}.sw-fill{background:#f8f}.strip-h-bars{display:flex;flex-direction:column;gap:1px;flex:0 0 auto}.h-bar-row{display:flex;align-items:center;height:10px}.h-bar-row span{font-size:.55rem;font-weight:700;color:var(--text-muted);width:24px;flex-shrink:0}.h-bar-track{flex:1;height:10px;background:var(--meter-bg);border:1px solid #1a1a1a;position:relative;overflow:hidden}.h-bar-track.bipolar{background:linear-gradient(to right,var(--meter-bg) 49%,#333 49%,#333 51%,var(--meter-bg) 51%)}.h-bar-fill{position:absolute;top:0;height:100%}.pan-fill{background:#afa}.bend-fill{background:#f8f}.strip-lcds{display:flex;gap:1px}.lcd-box{flex:1;background:var(--lcd-bg);border:1px solid #111;padding:0 2px;display:flex;align-items:baseline;gap:2px;min-width:0}.lcd-label{font-size:.65rem;color:#0a8;font-weight:700}.lcd-val,.lcd-text{font-family:var(--lcd-font);font-size:.75rem;color:var(--lcd-text);white-space:nowrap;overflow:hidden}.strip-wave{margin:0;flex:0 0 auto;justify-content:center;padding:2px 0}.strip-vol-slider{margin-top:1px}.filled-slider{-webkit-appearance:none;appearance:none;width:100%;height:6px;border-radius:0;outline:none;cursor:pointer;background:linear-gradient(to right,var(--accent-amber) 0%,var(--accent-amber) var(--val, 0%),var(--meter-bg) var(--val, 0%),var(--meter-bg) 100%);border:1px solid #333}.filled-slider::-webkit-slider-thumb{-webkit-appearance:none;width:3px;height:8px;background:#fff;border:none;cursor:pointer}.filled-slider::-moz-range-thumb{width:3px;height:8px;background:#fff;border:none;cursor:pointer;border-radius:0}.filled-slider::-moz-range-track{height:6px;background:transparent;border:none}.transport-panel{height:34px;background:#000;border-top:1px solid var(--border-color);display:flex;align-items:center;padding:0 .5rem;gap:.5rem;flex-shrink:0}.transport-controls{display:flex;gap:2px}.transport-controls button{height:28px;font-size:.75rem;font-weight:600;min-width:60px}.transport-controls button.playing{background:var(--success);color:#000;border-color:var(--success)}.transport-timeline{flex:1;display:flex;align-items:center;gap:.4rem}.scrubber-track{flex:1;height:6px;background:#222;position:relative;cursor:pointer;border:1px solid #444}.scrubber-fill{position:absolute;top:0;left:0;height:100%;background:var(--accent-amber)}.loop-region{position:absolute;top:0;height:100%;background:#33aaff40;border-left:1px solid var(--accent-blue);border-right:1px solid var(--accent-blue);pointer-events:none}.time-readout{font-family:var(--lcd-font);color:var(--accent-amber);font-size:.7rem;background:var(--lcd-bg);padding:1px 3px;border:1px inset #222;width:48px;text-align:center}.transport-meta{display:flex;gap:4px;align-items:center;font-size:.65rem;color:var(--text-muted)}.transport-meta label{display:flex;align-items:center;gap:3px}.transport-meta input[type=number]{background:var(--lcd-bg);color:var(--lcd-text);border:1px solid #333;width:52px;font-family:var(--lcd-font);font-size:.65rem;padding:2px 3px;text-align:right}.status-bar{display:none}.render-progress-bar{height:14px;background:#111;border-top:1px solid var(--border-color);position:relative;flex-shrink:0}.render-progress-fill{height:100%;background:var(--accent-amber);transition:width .2s ease;opacity:.7}.render-progress-label{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:.55rem;font-weight:700;color:#fff;text-shadow:0 0 4px #000}.toggle-btn.loop-btn{height:28px;font-size:.75rem;font-weight:600;min-width:60px;padding:0 8px;border:1px solid #333;background:#111;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:4px}.toggle-btn.loop-btn.active{background:var(--accent-blue);color:#000;border-color:var(--accent-blue)}.toggle-btn.loop-btn:hover{border-color:var(--border-focus)}.transport-volume-wrapper{position:relative}.volume-btn{height:28px;font-size:.75rem;font-weight:600;min-width:60px;padding:0 8px;cursor:pointer;white-space:nowrap;display:inline-flex;align-items:center;justify-content:center;gap:4px}.volume-popup{position:absolute;bottom:100%;right:0;margin-bottom:6px;background:var(--bg-panel);border:1px solid var(--border-color);border-radius:4px;padding:8px 12px;display:flex;flex-direction:column;align-items:center;gap:6px;z-index:100;box-shadow:0 8px 24px #000000b3}.volume-popup-label{font-size:.6rem;font-weight:700;color:var(--text-muted);text-transform:uppercase}.volume-popup-slider{-webkit-appearance:slider-vertical;appearance:slider-vertical;writing-mode:vertical-lr;direction:rtl;width:24px;height:120px;cursor:pointer;background:transparent}.volume-popup-slider::-webkit-slider-runnable-track{width:6px;background:linear-gradient(to top,var(--accent-amber) 0%,var(--accent-amber) var(--val, 0%),var(--meter-bg) var(--val, 0%),var(--meter-bg) 100%);border:1px solid #333;border-radius:0}.volume-popup-slider::-webkit-slider-thumb{-webkit-appearance:none;width:14px;height:6px;background:#fff;border:none;cursor:pointer;margin-left:-5px;transform:translate(-5%)}.volume-popup-slider::-moz-range-track{width:6px;background:transparent;border:none}.volume-popup-slider::-moz-range-thumb{width:14px;height:6px;background:#fff;border:none;cursor:pointer;border-radius:0}.volume-popup-value{font-family:var(--lcd-font);font-size:.75rem;color:var(--lcd-text)}.transport-loop-wrapper{position:relative}.loop-popup{position:absolute;bottom:100%;right:0;margin-bottom:6px;background:var(--bg-panel);border:1px solid var(--border-color);border-radius:4px;padding:10px 14px;display:flex;flex-direction:column;gap:8px;z-index:100;box-shadow:0 8px 24px #000000b3;min-width:160px}.loop-popup-label{font-size:.6rem;font-weight:700;color:var(--text-muted);text-transform:uppercase}.loop-popup label{display:flex;justify-content:space-between;align-items:center;gap:6px;font-size:.65rem;color:var(--text-muted)}.loop-popup input[type=number]{background:var(--lcd-bg);color:var(--lcd-text);border:1px solid #333;width:70px;font-family:var(--lcd-font);font-size:.65rem;padding:3px 4px;text-align:right}.settings-overlay{position:fixed;inset:32px 0 0;background:#000000eb;z-index:200;display:flex;justify-content:center;align-items:flex-start;padding:1rem}.settings-overlay .panel{background:var(--bg-panel);border:1px solid var(--border-color);max-width:800px;width:100%;max-height:calc(100vh - 50px);overflow-y:auto;padding:1rem;box-shadow:0 10px 30px #000c}.settings-overlay .panel h2{margin-bottom:.6rem;color:var(--accent-amber);border-bottom:1px solid var(--border-color);padding-bottom:.3rem;font-size:.85rem}.grid-two{display:grid;grid-template-columns:1fr 1fr;gap:.6rem}.grid-two label{display:flex;flex-direction:column;gap:2px;font-size:.65rem;color:var(--text-muted)}.grid-two select,.grid-two input{background:#000;color:#fff;border:1px inset #333;padding:2px;font-size:.65rem}.project-item{display:flex;justify-content:space-between;align-items:center;padding:2px 4px;background:#111;border:1px solid #222;cursor:pointer;font-size:.6rem;margin-bottom:2px}.project-item:hover{background:#2a2a35;border-color:var(--accent-amber)}.project-item.active{border-left:3px solid var(--accent-amber)}