.effect-slot{background:var(--surface-2);border:1px solid var(--border);border-radius:8px;margin-bottom:8px;overflow:hidden;transition:all .2s ease}.effect-slot.bypassed{opacity:.6;background:var(--surface-1)}.effect-header{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;background:var(--surface-3);border-bottom:1px solid var(--border)}.effect-info{display:flex;align-items:center;gap:8px}.effect-name{margin:0;font-size:14px;font-weight:600;color:var(--text-primary)}.effect-type{font-size:12px;color:var(--text-muted);background:var(--surface-2);padding:2px 8px;border-radius:12px;text-transform:uppercase}.effect-controls{display:flex;align-items:center;gap:4px}.effect-body{padding:16px}.parameters-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;margin-bottom:16px}.parameter-control{display:flex;flex-direction:column;gap:8px}.parameter-label{display:flex;justify-content:space-between;align-items:center;font-size:12px;font-weight:500;color:var(--text-secondary)}.parameter-value{font-family:SF Mono,Monaco,Inconsolata,Fira Code,monospace;color:var(--text-primary);background:var(--surface-1);padding:2px 6px;border-radius:4px}.parameter-slider{width:100%;height:4px;background:var(--surface-1);border-radius:2px;outline:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer}.parameter-slider::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:16px;height:16px;background:var(--accent);border-radius:50%;cursor:pointer;transition:all .2s ease}.parameter-slider::-webkit-slider-thumb:hover{transform:scale(1.2);box-shadow:0 0 8px var(--accent)}.parameter-slider::-moz-range-thumb{width:16px;height:16px;background:var(--accent);border-radius:50%;cursor:pointer;border:none;transition:all .2s ease}.parameter-slider::-moz-range-thumb:hover{transform:scale(1.2);box-shadow:0 0 8px var(--accent)}.parameter-slider:disabled{opacity:.5;cursor:not-allowed}.parameter-slider:disabled::-webkit-slider-thumb{background:var(--text-muted)}.parameter-slider:disabled::-moz-range-thumb{background:var(--text-muted)}.special-controls{border-top:1px solid var(--border);padding-top:16px;margin-top:16px}.eq-curve-placeholder,.filter-response-placeholder{height:120px;background:var(--surface-1);border:1px dashed var(--border);border-radius:4px;display:flex;align-items:center;justify-content:center;color:var(--text-muted);font-size:12px}.gain-reduction-meter{display:flex;flex-direction:column;gap:8px}.meter-label{font-size:12px;color:var(--text-secondary)}.meter-bar{height:20px;background:var(--surface-1);border-radius:4px;overflow:hidden;position:relative}.meter-fill{height:100%;background:linear-gradient(to right,var(--success),var(--warning),var(--danger));transition:width .1s ease;min-width:2px}.effect-slot.dragging{opacity:.5;transform:rotate(2deg)}.effect-slot.drag-over{border-color:var(--accent);border-style:dashed}.effect-slot.drag-over-before{border-top:3px solid var(--accent)}.effect-slot.drag-over-after{border-bottom:3px solid var(--accent)}.effect-chain{display:flex;flex-direction:column;height:100%}.chain-header{display:flex;align-items:center;justify-content:space-between;padding:16px;background:var(--surface-2);border-bottom:1px solid var(--border)}.chain-title{margin:0;font-size:16px;font-weight:600;color:var(--text-primary)}.chain-controls{display:flex;align-items:center;gap:16px}.chain-level-control{display:flex;align-items:center;gap:8px}.chain-level-label{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:500;color:var(--text-secondary)}.chain-level-value{font-family:SF Mono,Monaco,Inconsolata,Fira Code,monospace;color:var(--text-primary);background:var(--surface-1);padding:2px 6px;border-radius:4px;min-width:40px;text-align:center}.chain-level-slider{width:80px;height:4px;background:var(--surface-1);border-radius:2px;outline:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer}.chain-level-slider::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:12px;height:12px;background:var(--accent);border-radius:50%;cursor:pointer}.chain-level-slider::-moz-range-thumb{width:12px;height:12px;background:var(--accent);border-radius:50%;cursor:pointer;border:none}.effects-list{flex:1;padding:16px;overflow-y:auto;min-height:0}.no-effects{display:flex;flex-direction:column;align-items:center;justify-content:center;height:200px;text-align:center;color:var(--text-muted)}.no-effects p{margin:4px 0}.effect-slot-wrapper{cursor:move;transition:all .2s ease}.effect-slot-wrapper:hover{transform:translateY(-2px)}.effect-selector-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000}.effect-selector{background:var(--surface-2);border:1px solid var(--border);border-radius:12px;width:90%;max-width:500px;max-height:80vh;overflow:hidden;box-shadow:0 10px 40px #0000004d}.effect-selector-header{display:flex;align-items:center;justify-content:space-between;padding:20px;border-bottom:1px solid var(--border)}.effect-selector-header h4{margin:0;font-size:18px;font-weight:600;color:var(--text-primary)}.effect-list{max-height:400px;overflow-y:auto;padding:8px}.effect-item{display:flex;align-items:center;width:100%;padding:16px;background:transparent;border:none;border-radius:8px;cursor:pointer;transition:all .2s ease;text-align:left}.effect-item:hover{background:var(--surface-3)}.effect-item-info{display:flex;flex-direction:column;gap:4px}.effect-item-name{font-size:14px;font-weight:600;color:var(--text-primary)}.effect-item-description{font-size:12px;color:var(--text-muted);line-height:1.4}.master-chain{background:var(--surface-1)}.master-chain .chain-header{background:var(--surface-3)}.master-chain .chain-title{color:var(--accent)}.track-chain{background:var(--surface-1)}.effect-slot-wrapper.drag-over-before{border-top:3px solid var(--accent);margin-top:-3px;padding-top:3px}.effect-slot-wrapper.drag-over-after{border-bottom:3px solid var(--accent);margin-bottom:-3px;padding-bottom:3px}@media (max-width: 768px){.chain-header{flex-direction:column;align-items:stretch;gap:12px}.chain-controls{justify-content:space-between}.effect-selector{width:95%;max-height:90vh}}.effects-panel{display:flex;flex-direction:column;height:100%;background:var(--surface-1)}.effects-tabs{display:flex;background:var(--surface-2);border-bottom:1px solid var(--border)}.tab-button{flex:1;padding:12px 16px;background:transparent;border:none;border-bottom:2px solid transparent;font-size:14px;font-weight:500;color:var(--text-secondary);cursor:pointer;transition:all .2s ease}.tab-button:hover{color:var(--text-primary);background:var(--surface-3)}.tab-button.active{color:var(--accent);border-bottom-color:var(--accent);background:var(--surface-1)}.tab-button:disabled{opacity:.5;cursor:not-allowed}.tab-button:disabled:hover{background:transparent;color:var(--text-muted)}.effects-content{flex:1;min-height:0;overflow:hidden}@media (max-width: 768px){.effects-panel{font-size:14px}.tab-button{padding:10px 12px;font-size:13px}}.effect-editor-panel{display:flex;flex-direction:column;height:100%;background:#1a1a1a;color:#e0e0e0;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif}.editor-container{display:grid;grid-template-columns:220px 1fr;gap:1px;height:100%;background:#111}.effects-list-section{display:flex;flex-direction:column;background:#151515;border-right:1px solid #333;min-height:0}.section-header{padding:12px;border-bottom:1px solid #333;display:flex;flex-direction:column;gap:8px}.section-header h3{margin:0;font-size:14px;font-weight:600;color:#fff}.tab-buttons{display:flex;gap:4px}.tab-btn{flex:1;padding:6px 10px;border:1px solid #444;background:#222;color:#999;border-radius:3px;font-size:12px;cursor:pointer;transition:all .2s ease}.tab-btn:hover{background:#2a2a2a;color:#bbb}.tab-btn.active{background:#9b59b6;color:#fff;border-color:#9b59b6}.effects-list{flex:1;overflow-y:auto;display:flex;flex-direction:column;gap:4px;padding:8px;min-height:0}.effect-item{display:flex;align-items:center;justify-content:space-between;padding:10px;background:#222;border:1px solid #333;border-radius:4px;cursor:pointer;transition:all .2s ease;text-align:left;color:#ccc}.effect-item:hover{background:#2a2a2a;border-color:#444}.effect-item.selected{background:#9b59b6;border-color:#9b59b6;color:#fff}.effect-item-info{flex:1;min-width:0}.effect-item-name{font-size:13px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.effect-item-type{font-size:11px;color:#999;text-transform:uppercase;letter-spacing:.5px}.effect-item-status{margin-left:8px;font-size:16px;min-width:16px;text-align:center}.empty-state{display:flex;align-items:center;justify-content:center;flex:1;color:#666;font-size:13px;text-align:center;padding:20px}.empty-state-small{color:#666;font-size:12px;text-align:center;padding:12px}.editor-section{flex:1;overflow-y:auto;padding:20px;display:flex;flex-direction:column;gap:24px}.editor-header{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}.editor-header h3{margin:0;font-size:20px;font-weight:600;color:#fff}.editor-header p{margin:4px 0 0;font-size:12px;color:#999;text-transform:uppercase;letter-spacing:.5px}.reset-btn{padding:8px 16px;background:#444;border:1px solid #555;color:#ccc;border-radius:4px;font-size:12px;cursor:pointer;transition:all .2s ease;white-space:nowrap}.reset-btn:hover{background:#555;color:#fff;border-color:#666}.reset-btn:active{background:#333}.parameters-section{display:flex;flex-direction:column;gap:12px}.parameters-section h4{margin:0;font-size:13px;font-weight:600;color:#999;text-transform:uppercase;letter-spacing:.5px}.parameters-list{display:flex;flex-direction:column;gap:16px}.parameter-editor{display:flex;flex-direction:column;gap:8px}.parameter-header{display:flex;align-items:center;justify-content:space-between;gap:12px}.parameter-name{font-size:13px;color:#ccc;font-weight:500;flex:1}.parameter-unit{font-size:11px;color:#999;text-transform:uppercase;letter-spacing:.5px;min-width:30px;text-align:right}.parameter-value-display{font-size:12px;color:#9b59b6;background:#222;padding:4px 8px;border-radius:3px;text-align:center;transition:all .15s ease;border:1px solid #333;min-width:70px}.parameter-input-group{display:flex;align-items:center;gap:8px}.parameter-slider{flex:1;min-width:0;height:6px;border-radius:3px;background:#333;outline:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer}.parameter-slider::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:14px;height:14px;border-radius:50%;background:#9b59b6;cursor:pointer;border:2px solid #1a1a1a;transition:all .15s ease}.parameter-slider::-webkit-slider-thumb:hover{background:#c08ddb;box-shadow:0 0 8px #9b59b680}.parameter-slider::-moz-range-thumb{width:14px;height:14px;border-radius:50%;background:#9b59b6;cursor:pointer;border:2px solid #1a1a1a;transition:all .15s ease}.parameter-slider::-moz-range-thumb:hover{background:#c08ddb;box-shadow:0 0 8px #9b59b680}.parameter-text-input{width:80px;padding:6px 8px;background:#222;border:1px solid #9b59b6;color:#fff;border-radius:3px;font-size:12px;font-family:Courier New,monospace;text-align:center;transition:all .15s ease}.parameter-text-input:focus{outline:none;border-color:#c08ddb;box-shadow:0 0 8px #9b59b64d;background:#2a2a2a}.parameter-text-input:hover{border-color:#b373c0;background:#2a2a2a}.presets-section{display:flex;flex-direction:column;gap:12px}.presets-section h4{margin:0;font-size:13px;font-weight:600;color:#999;text-transform:uppercase;letter-spacing:.5px}.presets-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:8px}.preset-item{position:relative;display:flex}.preset-apply-btn{flex:1;padding:10px;background:#2a2a2a;border:1px solid #444;color:#ccc;border-radius:4px;font-size:12px;cursor:pointer;transition:all .2s ease;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.preset-apply-btn:hover{background:#9b59b6;border-color:#9b59b6;color:#fff}.preset-apply-btn:active{background:#7a3fa8}.preset-delete-btn{position:absolute;top:-6px;right:-6px;width:20px;height:20px;padding:0;background:#e74c3c;border:none;border-radius:50%;color:#fff;font-size:14px;cursor:pointer;display:none;align-items:center;justify-content:center;transition:all .15s ease}.preset-item:hover .preset-delete-btn{display:flex}.preset-delete-btn:hover{background:#ff6b5b;transform:scale(1.1)}.save-preset-section{display:flex;gap:12px;padding-top:12px;border-top:1px solid #333}.save-preset-btn{flex:1;padding:10px;background:#9b59b6;border:1px solid #a366bb;color:#fff;border-radius:4px;font-size:13px;font-weight:600;cursor:pointer;transition:all .2s ease}.save-preset-btn:hover{background:#c08ddb;border-color:#d4a8e8}.save-preset-btn:active{background:#7a3fa8}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#000000b3;display:flex;align-items:center;justify-content:center;z-index:1000}.modal{background:#1a1a1a;border:1px solid #333;border-radius:8px;padding:24px;max-width:400px;box-shadow:0 20px 60px #000c}.modal h3{margin:0 0 16px;font-size:16px;font-weight:600;color:#fff}.preset-name-input{width:100%;padding:10px;background:#222;border:1px solid #444;color:#fff;border-radius:4px;font-size:13px;margin-bottom:16px;box-sizing:border-box}.preset-name-input:focus{outline:none;border-color:#9b59b6;box-shadow:0 0 8px #9b59b64d}.modal-buttons{display:flex;gap:12px}.btn-cancel,.btn-save{flex:1;padding:10px;border:1px solid #444;border-radius:4px;font-size:13px;font-weight:600;cursor:pointer;transition:all .2s ease}.btn-cancel{background:#222;color:#ccc}.btn-cancel:hover{background:#2a2a2a;border-color:#555;color:#fff}.btn-save{background:#9b59b6;color:#fff;border-color:#9b59b6}.btn-save:hover:not(:disabled){background:#c08ddb;border-color:#c08ddb}.btn-save:disabled{opacity:.5;cursor:not-allowed}.effects-list::-webkit-scrollbar,.editor-section::-webkit-scrollbar{width:8px}.effects-list::-webkit-scrollbar-track,.editor-section::-webkit-scrollbar-track{background:#1a1a1a}.effects-list::-webkit-scrollbar-thumb,.editor-section::-webkit-scrollbar-thumb{background:#444;border-radius:4px}.effects-list::-webkit-scrollbar-thumb:hover,.editor-section::-webkit-scrollbar-thumb:hover{background:#555}@media (max-width: 768px){.editor-container{grid-template-columns:1fr}.effects-list-section{display:none}.presets-grid{grid-template-columns:repeat(2,1fr)}}.import-export-panel{display:flex;flex-direction:column;gap:1.5rem;padding:1rem;height:100%;overflow-y:auto}.panel-section{display:flex;flex-direction:column;gap:.75rem;padding-bottom:1.5rem;border-bottom:1px solid rgba(255,255,255,.1)}.panel-section:last-of-type{border-bottom:none}.panel-section h3{margin:0;font-size:.875rem;font-weight:600;color:#ffffffe6;text-transform:uppercase;letter-spacing:.05em}.drop-zone{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:120px;padding:1.5rem;border:2px dashed rgba(255,255,255,.3);border-radius:8px;background-color:#ffffff05;transition:all .2s ease;cursor:pointer}.drop-zone:hover{border-color:#66d6b680;background-color:#66d6b60d}.drop-zone.dragging{border-color:#66d6b6;background-color:#66d6b61a;transform:scale(1.02)}.drop-zone p{margin:0;color:#ffffffb3;font-size:.875rem}.drop-zone .formats{margin-top:.5rem;font-size:.75rem;color:#ffffff80}.import-button,.export-button{padding:.5rem 1rem;border:1px solid rgba(255,255,255,.2);border-radius:6px;background-color:#ffffff0d;color:#ffffffe6;font-size:.875rem;font-weight:500;cursor:pointer;transition:all .2s ease}.import-button:hover:not(:disabled),.export-button:hover:not(:disabled){background-color:#66d6b633;border-color:#66d6b6;transform:translateY(-1px)}.import-button:disabled,.export-button:disabled{opacity:.5;cursor:not-allowed}.export-buttons{display:flex;flex-direction:column;gap:.5rem}.progress-section{padding:1rem 0}.progress-bar{width:100%;height:6px;background-color:#ffffff1a;border-radius:3px;overflow:hidden}.progress-fill{height:100%;background:linear-gradient(90deg,#66d6b6,#45b797);transition:width .3s ease}.status-message{padding:.75rem 1rem;border-radius:6px;font-size:.875rem;margin-top:1rem}.status-message.success{background-color:#66d6b633;color:#66d6b6;border:1px solid rgba(102,214,182,.3)}.status-message.error{background-color:#f8727233;color:#f87272;border:1px solid rgba(248,114,114,.3)}:root{color-scheme:dark;--color-bg-base: #0e1016;--color-bg-surface: #151a24;--color-bg-elevated: #1b2130;--color-bg-panel: #20283c;--color-bg-subtle: #11141d;--color-overlay: rgba(10, 12, 18, .8);--color-text-primary: #f5f7ff;--color-text-secondary: #b3bcdf;--color-text-muted: #878ea4;--color-text-inverse: #0d1018;--color-border: rgba(86, 97, 130, .45);--color-border-strong: rgba(158, 168, 201, .75);--color-accent: #66d6b6;--color-accent-strong: #45b797;--color-accent-soft: rgba(102, 214, 182, .12);--color-positive: #4dd09b;--color-warning: #f2aa4c;--color-danger: #f87272;--shadow-soft: 0 16px 32px -16px rgba(0, 0, 0, .45);--shadow-strong: 0 40px 80px -32px rgba(0, 0, 0, .6);--shadow-inset: inset 0 1px 0 rgba(255, 255, 255, .05);--space-3xs: 2px;--space-2xs: 4px;--space-xs: 6px;--space-sm: 8px;--space-md: 12px;--space-lg: 16px;--space-xl: 20px;--space-2xl: 28px;--space-3xl: 40px;--radius-sm: 6px;--radius-md: 10px;--radius-lg: 18px;--radius-pill: 999px;--font-family-sans: "Inter", "Segoe UI", "Helvetica Neue", Arial, sans-serif;--font-family-mono: "JetBrains Mono", "Fira Code", "SFMono-Regular", ui-monospace, monospace;--font-size-xs: .75rem;--font-size-sm: .875rem;--font-size-md: 1rem;--font-size-lg: 1.125rem;--font-size-xl: 1.375rem;--line-height-tight: 1.2;--line-height-normal: 1.45;--line-height-relaxed: 1.7;--transport-height: 72px;--track-header-height: 48px;--timeline-header-height: 36px;--timeline-row-height: 88px;--mixer-min-height: 176px;--panel-gutter: 12px;--focus-ring: 0 0 0 2px rgba(102, 214, 182, .55)}@media (max-width: 900px){:root{--timeline-row-height: 72px;--transport-height: 64px}}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body,#root{width:100%;height:100%;overflow:hidden}body{font-family:var(--font-family-sans);font-size:var(--font-size-md);line-height:var(--line-height-normal);color:var(--color-text-primary);background-color:var(--color-bg-base);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit}input,select{font-family:inherit;font-size:inherit;border:none;background:none;color:inherit}.input{width:100%;padding:var(--space-sm) var(--space-md);border-radius:var(--radius-sm);border:1px solid var(--color-border);background:var(--color-bg-base);color:var(--color-text-primary);transition:border-color .2s ease,background-color .2s ease,box-shadow .2s ease}.input:focus-visible{outline:none;border-color:var(--color-accent);box-shadow:var(--focus-ring)}select.input{-webkit-appearance:none;-moz-appearance:none;appearance:none}input[type=range]{width:100%;accent-color:var(--color-accent)}.panel{background:var(--color-bg-surface);border-radius:var(--radius-md);border:1px solid var(--color-border);overflow:hidden}.panel-elevated{background:var(--color-bg-elevated);box-shadow:var(--shadow-soft)}.panel-header{display:flex;align-items:center;gap:var(--space-md);padding:var(--space-md) var(--space-lg);border-bottom:1px solid var(--color-border);background:var(--color-bg-subtle)}.panel-body{padding:var(--space-lg);overflow-y:auto}.card{background:var(--color-bg-panel);border:1px solid var(--color-border);border-radius:var(--radius-sm);padding:var(--space-md)}.card-hover{transition:all .2s ease}.card-hover:hover{background:var(--color-bg-elevated);border-color:var(--color-border-strong);transform:translateY(-1px)}.flex{display:flex}.flex-col{display:flex;flex-direction:column}.flex-center{display:flex;align-items:center;justify-content:center}.flex-align-center{display:flex;align-items:center}.flex-justify-between{display:flex;justify-content:space-between}.flex-gap-xs{gap:var(--space-xs)}.flex-gap-sm{gap:var(--space-sm)}.flex-gap-md{gap:var(--space-md)}.flex-gap-lg{gap:var(--space-lg)}.flex-1{flex:1}.grid{display:grid}.grid-cols-2{grid-template-columns:repeat(2,1fr)}.grid-cols-3{grid-template-columns:repeat(3,1fr)}.button{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-sm);padding:var(--space-sm) var(--space-lg);border-radius:var(--radius-sm);font-weight:500;font-size:var(--font-size-sm);transition:all .15s ease;outline:none}.button:focus-visible{box-shadow:var(--focus-ring)}.button-primary{background:var(--color-accent);color:var(--color-text-inverse)}.button-primary:hover{background:var(--color-accent-strong)}.button-secondary{background:var(--color-bg-panel);color:var(--color-text-primary);border:1px solid var(--color-border)}.button-secondary:hover{background:var(--color-bg-elevated);border-color:var(--color-border-strong)}.button-ghost{background:transparent;color:var(--color-text-secondary)}.button-ghost:hover{background:var(--color-bg-subtle);color:var(--color-text-primary)}.button-icon{width:32px;height:32px;padding:0;border-radius:var(--radius-sm)}.button-icon-sm{width:24px;height:24px;padding:0;border-radius:4px}.icon{width:18px;height:18px;display:inline-block;line-height:1}.icon-sm{width:14px;height:14px}.icon-lg{width:24px;height:24px}.text-xs{font-size:var(--font-size-xs)}.text-sm{font-size:var(--font-size-sm)}.text-md{font-size:var(--font-size-md)}.text-lg{font-size:var(--font-size-lg)}.text-xl{font-size:var(--font-size-xl)}.text-muted{color:var(--color-text-muted)}.text-secondary{color:var(--color-text-secondary)}.text-mono{font-family:var(--font-family-mono)}.divider{height:1px;background:var(--color-border);border:none}.divider-vertical{width:1px;height:auto;background:var(--color-border)}.scrollable{overflow-y:auto;overflow-x:hidden}.scrollable-x{overflow-x:auto;overflow-y:hidden}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--color-border);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--color-border-strong)}.resizer{position:relative;background:transparent;z-index:10;-webkit-user-select:none;-moz-user-select:none;user-select:none}.resizer-horizontal{width:100%;height:var(--panel-gutter);cursor:row-resize}.resizer-vertical{width:var(--panel-gutter);height:100%;cursor:col-resize}.resizer:hover{background:var(--color-accent-soft)}.resizer-active{background:var(--color-accent)}.fade-in{animation:fadeIn .3s ease}@keyframes fadeIn{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}.color-swatch{width:32px;height:32px;border-radius:var(--radius-sm);border:2px solid transparent;transition:all .15s ease}.color-swatch:hover{border-color:var(--color-border-strong);transform:scale(1.1)}.color-swatch:focus-visible{box-shadow:var(--focus-ring)}.keyboard-focus{outline:2px solid var(--color-accent);outline-offset:2px}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}.daw-shell{width:100%;height:100%;display:flex;flex-direction:column;background:var(--color-bg-base);overflow:hidden}.transport-bar{height:var(--transport-height);background:var(--color-bg-surface);border-bottom:1px solid var(--color-border);display:flex;align-items:center;justify-content:space-between;padding:0 var(--space-lg);gap:var(--space-2xl);flex-wrap:wrap;flex-shrink:0}.main-workspace{flex:1;display:flex;min-height:0;overflow:hidden;background:var(--color-bg-base)}.transport-brand{display:flex;align-items:center;gap:var(--space-md)}.brand-mark{width:12px;height:12px;border-radius:50%;background:var(--color-accent);box-shadow:0 0 12px #66d6b699}.transport-label{font-size:var(--font-size-xs);color:#798299;font-weight:500;text-transform:uppercase;letter-spacing:.05em}.transport-title{font-size:var(--font-size-sm);color:var(--color-text-primary);font-weight:600}.transport-controls{display:flex;align-items:center;gap:var(--space-md)}.tempo-controls{display:flex;align-items:center;gap:var(--space-xs)}.tempo-step{width:24px!important;height:24px!important;padding:0}.zoom-indicator{font-family:var(--font-family-mono);font-size:var(--font-size-xs);color:var(--color-text-muted);min-width:48px;text-align:center}.transport-button{width:40px;height:40px;display:flex;align-items:center;justify-content:center;background:var(--color-bg-panel);border:1px solid var(--color-border);border-radius:var(--radius-sm);color:var(--color-text-secondary);transition:all .15s ease}.transport-button:hover{background:var(--color-bg-elevated);color:var(--color-text-primary);border-color:var(--color-border-strong)}.transport-button.active{background:var(--color-accent);color:var(--color-text-inverse);border-color:var(--color-accent)}.transport-button.play{width:52px;height:52px;border-radius:var(--radius-md)}.transport-info{display:flex;align-items:center;gap:var(--space-lg)}.tempo-display,.time-signature,.playhead-position{display:flex;flex-direction:column;gap:var(--space-3xs)}.tempo-display label,.time-signature label,.playhead-position label{font-size:var(--font-size-xs);color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.05em}.tempo-value,.time-signature-value,.playhead-value{font-family:var(--font-family-mono);font-size:var(--font-size-lg);font-weight:600;color:var(--color-text-primary)}.main-workspace{flex:1;display:flex;overflow:hidden;position:relative}.track-area{display:flex;flex-direction:column;flex:1;overflow:hidden;background:var(--color-bg-base)}.timeline-header{height:var(--timeline-header-height);background:var(--color-bg-surface);border-bottom:1px solid var(--color-border);display:flex;align-items:center;padding:0 var(--space-lg);gap:var(--space-md);flex-shrink:0}.timeline-controls{display:flex;align-items:center;gap:var(--space-sm)}.zoom-control{display:flex;align-items:center;gap:var(--space-xs)}.zoom-control span{font-size:var(--font-size-xs);color:var(--color-text-muted);min-width:48px;text-align:center;font-family:var(--font-family-mono)}.timeline-body{flex:1;display:flex;overflow:hidden}.track-list{width:var(--track-list-width, 240px);background:var(--color-bg-surface);border-right:1px solid var(--color-border);display:flex;flex-direction:column;flex-shrink:0}.track-list-header{height:var(--track-header-height);background:var(--color-bg-subtle);border-bottom:1px solid var(--color-border);display:flex;align-items:center;padding:0 var(--space-md);gap:var(--space-sm);flex-shrink:0}.track-list-body{flex:1;overflow-y:auto;overflow-x:hidden}.track-lane{height:var(--timeline-row-height);background:var(--color-bg-surface);border-bottom:1px solid var(--color-border);display:flex;align-items:center;padding:var(--space-md);gap:var(--space-md);transition:background .15s ease;cursor:pointer}.track-lane:hover{background:var(--color-bg-elevated)}.track-lane.selected{background:var(--color-bg-panel);border-left:3px solid var(--color-accent)}.track-color{width:4px;height:48px;border-radius:2px;flex-shrink:0}.track-info{flex:1;display:flex;flex-direction:column;gap:var(--space-xs);min-width:0}.track-name{font-weight:500;font-size:var(--font-size-sm);color:var(--color-text-primary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.track-type{font-size:var(--font-size-xs);color:var(--color-text-muted)}.track-controls{display:flex;gap:var(--space-xs);flex-shrink:0}.track-control-btn{width:28px;height:28px;display:flex;align-items:center;justify-content:center;background:transparent;border:1px solid var(--color-border);border-radius:4px;color:var(--color-text-muted);font-size:var(--font-size-xs);font-weight:600;transition:all .15s ease}.track-control-btn:hover{background:var(--color-bg-panel);color:var(--color-text-primary);border-color:var(--color-border-strong)}.track-control-btn.active{background:var(--color-accent);color:var(--color-text-inverse);border-color:var(--color-accent)}.timeline-viewport{flex:1;min-width:0;background:var(--color-bg-base);overflow:auto;position:relative}.timeline-canvas{position:relative;min-height:100%;padding:var(--timeline-header-height) var(--space-lg) var(--space-xl);background-image:linear-gradient(to right,rgba(86,97,130,.25) 1px,transparent 1px),linear-gradient(to bottom,rgba(86,97,130,.12) 1px,transparent 1px);background-size:var(--timeline-grid-width, 48px) var(--timeline-row-height);background-position:0 0}.timeline-ruler{position:sticky;top:0;left:0;width:100%;height:32px;background:var(--color-bg-elevated);border-bottom:1px solid var(--color-border);z-index:5;display:flex;align-items:flex-end;padding:0 var(--space-sm)}.playhead{position:absolute;top:0;bottom:0;width:2px;background:var(--color-accent);z-index:10;pointer-events:none}.playhead:before{content:"";position:absolute;top:0;left:50%;transform:translate(-50%);width:0;height:0;border-left:6px solid transparent;border-right:6px solid transparent;border-top:8px solid var(--color-accent)}.timeline-rows{position:relative;min-height:100%}.timeline-row{position:relative;height:var(--timeline-row-height);border-bottom:1px solid var(--color-border)}.timeline-clip{position:absolute;top:8px;bottom:8px;background:var(--color-accent-soft);border:1px solid var(--color-accent);border-radius:var(--radius-sm);padding:var(--space-xs);cursor:pointer;transition:all .15s ease;overflow:hidden}.timeline-clip:hover{border-color:var(--color-accent-strong);box-shadow:0 2px 8px #66d6b64d;transform:translateY(-1px)}.timeline-clip:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px}.timeline-clip-name{display:block;color:var(--color-text-primary);font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ruler-marker{position:absolute;top:0;height:100%;display:flex;align-items:center;pointer-events:none}.ruler-marker span{padding:0 var(--space-xs)}.side-panels{width:var(--side-panel-width, 320px);background:var(--color-bg-surface);border-left:1px solid var(--color-border);display:flex;flex-direction:column;flex-shrink:0;transition:width .2s ease}.side-panels.collapsed{width:0;border-left:none;overflow:hidden}.side-panel-tabs{height:40px;background:var(--color-bg-subtle);border-bottom:1px solid var(--color-border);display:flex;flex-shrink:0}.side-panel-tab{flex:1;display:flex;align-items:center;justify-content:center;gap:var(--space-xs);font-size:var(--font-size-sm);font-weight:500;color:#757e96;background:transparent;border:none;border-bottom:2px solid transparent;cursor:pointer;transition:all .15s ease}.side-panel-tab:hover{color:var(--color-text-secondary);background:var(--color-bg-surface)}.side-panel-tab.active{color:var(--color-text-primary);background:var(--color-bg-surface);border-bottom-color:var(--color-accent)}.side-panel-content{flex:1;overflow-y:auto;padding:var(--space-lg)}.mixer-dock{height:var(--mixer-height, var(--mixer-min-height));background:var(--color-bg-surface);border-top:1px solid var(--color-border);display:flex;flex-direction:column;flex-shrink:0;transition:height .2s ease}.mixer-resizer{position:sticky;top:0;left:0;width:100%;z-index:50}.inspector-resizer{position:relative;z-index:10}.mixer-header{height:40px;background:var(--color-bg-subtle);border-bottom:1px solid var(--color-border);display:flex;align-items:center;justify-content:space-between;padding:0 var(--space-lg);flex-shrink:0}.mixer-header h3{font-size:var(--font-size-sm);font-weight:600;color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:.05em}.mixer-body{flex:1;display:flex;gap:var(--space-md);padding:var(--space-lg);overflow-x:auto;overflow-y:hidden}.channel-strip{width:72px;background:var(--color-bg-panel);border:1px solid var(--color-border);border-radius:var(--radius-sm);display:flex;flex-direction:column;align-items:center;gap:var(--space-sm);padding:var(--space-md) var(--space-sm);flex-shrink:0;box-shadow:var(--shadow-soft)}.channel-indicator{width:100%;height:6px;border-radius:var(--radius-pill)}.channel-fader{width:32px;flex:1;background:var(--color-bg-subtle);border-radius:16px;position:relative;cursor:pointer;overflow:hidden}.channel-controls{display:flex;gap:var(--space-xs)}.channel-pan{font-size:var(--font-size-xs);color:var(--color-text-muted)}.channel-fader-track{position:absolute;bottom:0;left:0;right:0;height:75%;background:linear-gradient(to top,var(--color-accent),var(--color-accent-strong));border-radius:16px}.channel-name{font-size:var(--font-size-xs);color:var(--color-text-muted);text-align:center;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.resizable-pane{position:relative}.collapse-toggle{position:absolute;top:50%;transform:translateY(-50%);z-index:20;width:24px;height:48px;background:var(--color-bg-panel);border:1px solid var(--color-border);border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;color:var(--color-text-muted);cursor:pointer;transition:all .15s ease}.collapse-toggle:hover{background:var(--color-bg-elevated);color:var(--color-text-primary);border-color:var(--color-border-strong)}.collapse-toggle-left{right:-12px}.collapse-toggle-right{left:-12px}.collapsed-panel{width:0!important;overflow:hidden;border:none}@media (max-width: 1200px){.side-panels{width:280px}.track-list{width:200px}}@media (max-width: 900px){.transport-bar{gap:var(--space-lg);padding:0 var(--space-md)}.transport-info{gap:var(--space-md)}.tempo-value,.time-signature-value,.playhead-value{font-size:var(--font-size-md)}.track-list{width:180px}.side-panels{position:absolute;right:0;top:0;bottom:0;width:100%;max-width:320px;z-index:100;box-shadow:var(--shadow-strong)}.side-panels.collapsed{display:none}.mixer-dock{height:140px}.channel-strip{width:64px}}@media (max-width: 640px){.transport-bar{height:64px;gap:var(--space-md)}.transport-button.play{width:44px;height:44px}.transport-button{width:36px;height:36px}.transport-info{display:none}.track-list{position:absolute;left:0;top:0;bottom:0;width:100%;max-width:240px;z-index:100;box-shadow:var(--shadow-strong)}.track-list.collapsed{display:none}.timeline-body{flex-direction:column}.mixer-dock{position:absolute;bottom:0;left:0;right:0;height:auto;max-height:50vh;z-index:50}.mixer-dock.collapsed{height:40px}.mixer-dock.collapsed .mixer-body{display:none}}