*{margin:0;padding:0;box-sizing:border-box}body{font-family:Neue Montreal,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#000;color:#f7f4ef;user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none}#root{width:100%;min-height:100vh}.knob-wrapper-container{display:flex;flex-direction:column;justify-content:flex-end;align-items:center;flex-grow:0;flex-shrink:0;height:73px;position:relative;gap:8px}.knob-container{flex-grow:0;flex-shrink:0;width:48.51px;height:39.95px;position:relative;display:flex;align-items:center;justify-content:center;overflow:visible}.knob-svg{cursor:ns-resize;user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;display:block}.knob-label-text{font-size:12px;font-weight:500;text-align:left;color:#fff;font-family:PP Neue Montreal,Neue Montreal,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;margin:0;padding:0;display:block;line-height:1.2;white-space:nowrap}.pan-triangle{width:16px;height:16px;position:absolute;left:14.24px;top:-16px;cursor:pointer}.envelope-display{width:100%;height:100%;min-height:73px;position:relative;background:#101012;border-radius:12px;border:1px solid rgba(255,255,255,.2);overflow:hidden;flex:1;min-width:0;display:flex;flex-direction:column}.envelope-waveform-wrapper{position:absolute;top:0;left:0;right:0;bottom:0;width:100%;height:100%;overflow:hidden;pointer-events:none}.envelope-waveform-canvas{position:absolute;top:0;left:0;right:0;bottom:0;width:100%;height:100%;display:block;pointer-events:none;box-sizing:border-box}.envelope-grid-horizontal{position:absolute;left:0;top:0;display:flex;flex-direction:column;justify-content:space-between;align-items:stretch;opacity:.4;pointer-events:none;height:100%;padding:0;z-index:1}.envelope-grid-line{flex-shrink:0;flex-grow:0}.envelope-grid-vertical{position:absolute;left:0;top:0;display:flex;flex-direction:row;justify-content:space-between;align-items:stretch;opacity:.4;pointer-events:none;width:100%;height:100%;padding:0;z-index:1}.envelope-grid-divider{flex-grow:1;flex-shrink:0;border-right:1px solid #252529}.envelope-grid-divider:last-child{border-right:none}.envelope-waveform{position:absolute;left:0;top:0;pointer-events:none;z-index:0}.envelope-curve{position:absolute;left:0;top:0;pointer-events:none;z-index:1}.envelope-marker{position:absolute;pointer-events:auto!important;transition:all .2s ease;transform-origin:center;cursor:grab}.envelope-marker-hovered{transform:scale(1.15)}.envelope-marker-active{transform:scale(1.5);filter:drop-shadow(0 0 4px rgba(255,255,255,.5))}.envelope-vertical-line{position:absolute;right:0;top:0;pointer-events:none}.envelope-crop-overlay-container{position:absolute;top:0;left:0;right:0;bottom:0;width:100%;height:100%;pointer-events:none;z-index:2}.envelope-crop-overlay-left,.envelope-crop-overlay-right{position:absolute;top:0;bottom:0;background-color:#101012b3;pointer-events:none;z-index:2}.envelope-crop-overlay-left{left:0}.envelope-crop-overlay-right{right:0}.envelope-crop-range{position:absolute;top:0;bottom:0;overflow:hidden;pointer-events:none;z-index:10}.envelope-crop-range-overlay{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.envelope-crop-handle{position:absolute;top:0;bottom:0;width:12px;cursor:grab;display:flex;align-items:center;justify-content:center;z-index:20;pointer-events:auto;user-select:none;-webkit-user-select:none}.envelope-crop-handle-left{border-top-left-radius:4px;border-bottom-left-radius:4px}.envelope-crop-handle-right{border-top-right-radius:4px;border-bottom-right-radius:4px}.envelope-crop-handle:active{cursor:grabbing}.xy-pad-container{display:flex;flex-direction:column;justify-content:flex-end;align-items:center;flex-grow:0;flex-shrink:0;height:100%;min-height:73px;position:relative;gap:8px}.xy-pad{width:73px;height:100%;min-height:39.95px;flex:1;position:relative;overflow:hidden;border-radius:8px;background:#101012;cursor:crosshair;border:1px solid rgba(255,255,255,.1)}.xy-pad-glow{display:none}.xy-pad-glow:before{content:"";position:absolute;width:120%;height:120%;top:-10%;left:-10%;background:radial-gradient(circle at calc(var(--glow-x, 50%) + 20%) calc(var(--glow-y, 50%) + 15%),rgba(139,110,254,.3) 0%,rgba(139,110,254,.15) 40%,transparent 70%);animation:lava-lamp-secondary 12s ease-in-out infinite;filter:blur(25px)}.xy-pad-glow:after{content:"";position:absolute;width:100%;height:100%;top:0;left:0;background:radial-gradient(circle at calc(var(--glow-x, 50%) - 15%) calc(var(--glow-y, 50%) - 20%),rgba(139,110,254,.25) 0%,rgba(139,110,254,.1) 35%,transparent 65%);animation:lava-lamp-tertiary 10s ease-in-out infinite;filter:blur(18px)}@keyframes lava-lamp{0%,to{transform:translate(0) scale(1);opacity:.6}33%{transform:translate(5px,-8px) scale(1.1);opacity:.8}66%{transform:translate(-5px,8px) scale(.9);opacity:.7}}@keyframes lava-lamp-secondary{0%,to{transform:translate(0) scale(1);opacity:.5}50%{transform:translate(-8px,5px) scale(1.15);opacity:.7}}@keyframes lava-lamp-tertiary{0%,to{transform:translate(0) scale(1);opacity:.4}50%{transform:translate(8px,-5px) scale(.95);opacity:.6}}.xy-pad-dot{position:absolute;width:12px;height:12px;border-radius:50%;background:#8b6efe;box-shadow:0 0 8px #8b6efecc,0 0 16px #8b6efe66,0 0 24px #8b6efe33;z-index:10;pointer-events:none;transition:box-shadow .2s}.xy-pad:hover .xy-pad-dot{box-shadow:0 0 12px #8b6efe,0 0 20px #8b6efe99,0 0 30px #8b6efe4d}.xy-pad-label{font-size:12px;font-weight:500;text-align:left;color:#fff;font-family:PP Neue Montreal,Neue Montreal,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;margin:0;padding:0;display:block;line-height:1.2;white-space:nowrap}.drum-pads-grid{display:flex;flex-direction:column;justify-content:flex-start;align-items:flex-start;flex-grow:1;flex-shrink:0;padding:0;overflow-x:auto;width:100%;min-height:0;gap:.125rem;height:100%}.drum-pads-row{display:flex;justify-content:flex-start;align-items:flex-start;align-self:stretch;flex-grow:1;gap:2px;width:100%}.drum-pad{display:flex;flex-direction:column;justify-content:space-between;align-items:flex-start;align-self:stretch;flex:1 1 0;min-width:0;position:relative;padding:.75rem;border-radius:.5rem;background-color:#252529;border:1px solid rgba(255,255,255,.04);cursor:pointer;transition:all .2s}.drum-pad-ripple{position:absolute;top:50%;left:50%;width:0;height:0;border-radius:50%;background:var(--ripple-color);transform:translate(-50%,-50%);opacity:.6;filter:blur(20px);animation:ripple-expand .3s ease-out;pointer-events:none;z-index:1}@keyframes ripple-expand{0%{width:0;height:0;opacity:.6}50%{opacity:.4}to{width:200px;height:200px;opacity:0}}.drum-pad-empty{display:flex;flex-direction:column;justify-content:center;align-items:center;align-self:stretch;flex:1 1 0;min-width:0;position:relative;padding:.75rem;border-radius:.5rem;background-color:transparent;border:1px solid rgba(255,255,255,.04);cursor:pointer;transition:all .2s}.drum-pad:hover{border-color:#ffffff1a;transform:scale(1.02)}.drum-pad-selected{border-color:currentColor}.drum-pad-pressed{transform:scale(.95);opacity:.8}.drum-pad-drag-over{border-color:#8b6efe80!important;background-color:#8b6efe1a!important}.drum-pad-label{flex-grow:0;flex-shrink:0;font-size:.75rem;font-weight:500;text-align:center;color:#6a6a72;position:relative;z-index:2}.drum-pad-key{display:flex;flex-direction:column;justify-content:center;align-items:center;flex-grow:0;flex-shrink:0;height:19px;width:19px;border-radius:5px;border:1px solid rgba(255,255,255,.04);position:relative;z-index:2}.drum-pad-key-text{flex-grow:0;flex-shrink:0;opacity:.5;font-size:.75rem;font-weight:500;text-align:center;color:#fff3;line-height:1;margin:0;padding:0}.drum-pad-loop-indicator{position:absolute;top:.5rem;right:.5rem;width:12px;height:12px;z-index:3;color:var(--ring-color, #8b6efe)}.drum-pad-loop-ring{transform-origin:center;transform:rotate(-90deg);stroke:var(--ring-color, #8b6efe)}.drum-pad-loop-ring-animated{animation:loop-fill 1s linear infinite}@keyframes loop-fill{0%{stroke-dashoffset:31.416}to{stroke-dashoffset:0}}.drum-pads-generate-panel{display:flex;flex-direction:column;justify-content:flex-start;align-items:flex-start;align-self:stretch;flex-grow:0;flex-shrink:0;gap:.5rem;padding:.75rem;border-radius:.5rem;background-color:#252529}.drum-pads-generate-header{display:flex;justify-content:flex-start;align-items:center;align-self:stretch;flex-grow:0;flex-shrink:0}.drum-pads-generate-title{flex-grow:0;flex-shrink:0;font-size:.75rem;font-weight:500;text-align:left;color:#6a6a72}.drum-pads-generate-input-wrapper{display:flex;justify-content:flex-start;align-items:center;align-self:stretch;flex-grow:0;flex-shrink:0;gap:.5rem}.drum-pads-generate-input{flex:1;padding:.5rem;border-radius:.5rem;border:1px solid rgba(255,255,255,.04);background-color:#ffffff0a;color:#f7f4ef;font-size:.75rem;outline:none}.drum-pads-generate-input:focus{border-color:#ffffff1a}.drum-pads-generate-input:disabled{opacity:.5;cursor:not-allowed}.drum-pads-generate-button{display:flex;justify-content:center;align-items:center;flex-grow:0;flex-shrink:0;width:2rem;height:2rem;padding:.5rem;border-radius:.5rem;border:none;background-color:#ffffff0a;cursor:pointer;transition:all .2s}.drum-pads-generate-button:hover:not(:disabled){background-color:#ffffff14}.drum-pads-generate-button:disabled{opacity:.5;cursor:not-allowed}.drum-pads-generate-loading{width:16px;height:16px;border:2px solid #101012;border-top-color:transparent;border-radius:50%;animation:spin .8s linear infinite}:root{color-scheme:dark;--color-dumbo-50: #101012;--color-dumbo-100: #1c1c1f;--color-dumbo-150: #252529;--color-dumbo-200: #2e2e33;--color-dumbo-250: #38383e;--color-dumbo-300: #424249;--color-dumbo-350: #4e4d55;--color-dumbo-400: #5b5b62;--color-dumbo-450: #6a6a72;--color-dumbo-500: #7d7c83;--color-dumbo-550: #919093;--color-dumbo-600: #a3a3a3;--color-dumbo-650: #b3b3b2;--color-dumbo-700: #c2c2c1;--color-dumbo-750: #d2d0ce;--color-dumbo-800: #e0deda;--color-dumbo-850: #edeae4;--color-dumbo-900: #f7f4ef;--color-dumbo-950: #fcfbf9;--color-opacity-white-4: #ffffff0a;--color-opacity-white-10: #ffffff1a;--color-opacity-white-15: #ffffff26;--color-opacity-white-20: #ffffff33;--color-background-secondary: var(--color-dumbo-100);--color-background-tertiary: var(--color-dumbo-150);--color-background-glass-thick: var(--color-opacity-white-10);--color-background-glass-thin: var(--color-opacity-white-4);--color-background-glass-dense: var(--color-opacity-white-20);--color-border-primary: var(--color-opacity-white-10);--color-border-secondary: var(--color-opacity-white-15);--color-foreground-primary: var(--color-dumbo-900);--color-foreground-inactive: var(--color-dumbo-450);--color-foreground-secondary: var(--color-dumbo-700);--color-foreground-tertiary: var(--color-dumbo-600);--color-accent: #8b6efe}.drum-sequencer-container{min-height:100vh;background-color:#000;color:var(--color-foreground-primary);font-family:Neue Montreal,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;padding:1rem;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;position:relative;width:100%}.drum-sequencer-main{display:flex;flex-direction:column;justify-content:flex-start;align-items:flex-start;overflow:visible;border-radius:1rem;background:var(--color-dumbo-50);border:1px solid var(--color-border-primary);-webkit-backdrop-filter:blur(100px);backdrop-filter:blur(100px);box-shadow:0 20px 60px #0000004d;width:fit-content;max-width:100%;position:relative;z-index:1}.drum-sequencer-header{display:flex;justify-content:flex-end;align-items:center;align-self:stretch;flex-grow:0;flex-shrink:0;padding:8px}.drum-sequencer-header-content{display:flex;justify-content:flex-end;align-items:center;flex-grow:0;flex-shrink:0;gap:.5rem}.drum-sequencer-logo{display:flex;justify-content:flex-start;align-items:center;flex-grow:0;flex-shrink:0;position:relative;gap:.5rem}.drum-sequencer-logo-icon{flex-grow:0;flex-shrink:0;width:1rem;height:1rem;position:relative;color:var(--color-foreground-primary)}.drum-sequencer-logo-icon-wrapper{display:flex;justify-content:flex-start;align-items:center;flex-grow:0;flex-shrink:0;width:1rem;height:1rem;position:relative;gap:.625rem}.drum-sequencer-logo-icon-inner{flex-grow:1;height:1rem;position:relative;color:var(--color-foreground-primary)}.drum-sequencer-logo-text{flex-grow:0;flex-shrink:0;font-size:.75rem;font-weight:500;text-align:left;color:var(--color-foreground-primary)}.drum-sequencer-mode-toggle{display:flex;flex-direction:column;justify-content:flex-start;align-items:flex-start;flex-grow:0;flex-shrink:0;height:2rem;gap:.625rem;padding:.25rem;border-radius:100px;border:1px solid var(--color-border-primary)}.drum-sequencer-mode-toggle-inner{display:flex;justify-content:flex-start;align-items:center;align-self:stretch;flex-grow:1;gap:.25rem}.drum-sequencer-mode-toggle-active{display:flex;justify-content:center;align-items:center;align-self:stretch;flex-grow:0;flex-shrink:0;position:relative;gap:.25rem;padding:0 1rem;border-radius:100px;background:var(--color-background-glass-thick);cursor:pointer;transition:background .2s}.drum-sequencer-mode-toggle-active:hover{background:var(--color-background-glass-dense)}.drum-sequencer-mode-toggle-inactive{display:flex;justify-content:center;align-items:center;flex-grow:0;flex-shrink:0;position:relative;gap:.25rem;padding:0 1rem;border-radius:100px;opacity:.5;cursor:pointer;transition:opacity .2s}.drum-sequencer-mode-toggle-inactive:hover{opacity:1}.drum-sequencer-mode-toggle-text{flex-grow:0;flex-shrink:0;font-size:.75rem;font-weight:500;text-align:left;color:var(--color-foreground-primary)}.drum-sequencer-controls{display:flex;justify-content:flex-end;align-items:center;flex-grow:0;flex-shrink:0;gap:.5rem}.drum-sequencer-button{display:flex;flex-direction:column;justify-content:flex-start;align-items:flex-start;flex-grow:0;flex-shrink:0;gap:.625rem;background:none;border:none;padding:0;cursor:pointer}.drum-sequencer-button-inner{display:flex;justify-content:center;align-items:center;align-self:stretch;flex-grow:0;flex-shrink:0;height:2rem;gap:.25rem;padding:.5rem;border-radius:100px;background:var(--color-background-glass-thick);-webkit-backdrop-filter:blur(32px);backdrop-filter:blur(32px);color:var(--color-foreground-primary);transition:background .2s,color .2s}.drum-sequencer-button-inner:hover{background:var(--color-background-glass-dense)}.drum-sequencer-button-active{color:var(--color-accent)}.drum-sequencer-spacer{display:flex;flex-direction:column;justify-content:flex-start;align-items:flex-start;align-self:stretch;flex-grow:0;flex-shrink:0;height:0;gap:.625rem;padding:0 .75rem}.drum-sequencer-grid-container{display:flex;flex-direction:column;justify-content:flex-start;align-items:flex-start;flex-grow:0;flex-shrink:0;padding:0;overflow-x:auto;width:780px;height:292px;min-height:0}.drum-sequencer-step-header{padding:0;display:flex;justify-content:space-between;align-items:flex-start;align-self:stretch;flex-grow:0;flex-shrink:0;margin-bottom:2px}.drum-sequencer-step-numbers{display:flex;justify-content:flex-start;align-items:flex-start;gap:2px;width:100%;padding-left:0}.drum-sequencer-step-group{display:flex;justify-content:flex-start;align-items:flex-start;gap:2px}.drum-sequencer-step-number{width:44px;display:flex;flex-direction:column;justify-content:center;align-items:center;flex-grow:0;flex-shrink:0;height:16px;gap:10px;border-radius:8px;position:relative;transition:background-color .2s}.drum-sequencer-step-number-spacer{width:44px;flex-grow:0;flex-shrink:0;background:transparent}.drum-sequencer-step-number-text{font-size:8px;font-weight:400;color:#6a6a72;margin:0;padding:0;transition:color .2s}.drum-sequencer-step-number-active .drum-sequencer-step-number-text{color:#f7f4ef}.drum-sequencer-instruments{display:flex;flex-direction:column;justify-content:flex-start;align-items:flex-start;flex-grow:0;flex-shrink:0;gap:.125rem}.drum-sequencer-instrument-row{display:flex;justify-content:flex-start;align-items:center;align-self:stretch;flex-grow:0;flex-shrink:0;gap:.125rem}.drum-sequencer-instrument-button{display:flex;justify-content:center;align-items:center;flex-grow:0;flex-shrink:0;width:2.75rem;height:2.75rem;border-radius:.5rem;background:#1c1c1f;border:none;cursor:pointer;padding:0;transition:all .2s}.drum-sequencer-instrument-button:hover{background:var(--color-dumbo-150)}.drum-sequencer-instrument-button-selected{background:#f7f4ef!important}.drum-sequencer-instrument-button-selected .drum-sequencer-instrument-icon-svg path{fill:#101012}.drum-sequencer-instrument-button-inner{display:flex;justify-content:space-between;align-items:center;align-self:stretch;flex-grow:1}.drum-sequencer-instrument-button-content{display:flex;flex-direction:column;justify-content:center;align-items:center;align-self:stretch;flex-grow:1}.drum-sequencer-instrument-button-wrapper{display:flex;justify-content:flex-start;align-items:center;align-self:stretch;flex-grow:1;gap:.625rem;padding:.5rem .25rem}.drum-sequencer-instrument-icon-container{display:flex;justify-content:space-between;align-items:center;align-self:stretch;flex-grow:1}.drum-sequencer-instrument-icon-wrapper{display:flex;flex-direction:column;justify-content:center;align-items:center;align-self:stretch;flex-grow:1;gap:.5rem}.drum-sequencer-instrument-icon-svg{display:flex;justify-content:flex-start;align-items:center;flex-grow:0;flex-shrink:0;width:1rem;height:1rem;position:relative;gap:.625rem}.drum-sequencer-steps{display:flex;justify-content:flex-start;align-items:center;flex-grow:0;flex-shrink:0;gap:2px}.drum-sequencer-step{display:flex;flex-direction:column;justify-content:space-between;align-items:flex-start;flex-grow:0;flex-shrink:0;height:2.75rem;width:2.75rem;overflow:hidden;border-radius:.5rem;cursor:pointer;transition:all .2s;position:relative}.drum-sequencer-step:hover{background:var(--color-dumbo-150)!important}.drum-sequencer-step-current{z-index:10}.drum-sequencer-step-inner{display:flex;flex-direction:column;justify-content:space-between;align-items:flex-start;align-self:stretch;flex-grow:1;padding:.25rem;border-radius:.5rem;transition:opacity .15s;opacity:0}.drum-sequencer-step-inner-active{opacity:1}.drum-sequencer-step-inner-content{display:flex;justify-content:space-between;align-items:flex-end;align-self:stretch;flex-grow:0;flex-shrink:0;width:2.25rem;height:1rem;opacity:0}.drum-sequencer-footer{display:flex;justify-content:flex-start;align-items:flex-start;align-self:stretch;flex-grow:0;flex-shrink:0;width:100%;margin-top:.5rem}.drum-sequencer-footer-content{display:flex;justify-content:space-between;align-items:center;flex-grow:1;overflow:hidden;padding:8px;border-top:1px solid var(--color-border-primary);border-right:none;border-bottom:none;border-left:none;width:100%;background:var(--color-dumbo-50)}.drum-sequencer-input-wrapper{display:flex;justify-content:flex-start;align-items:center;flex-grow:1;gap:.5rem;position:relative}.drum-sequencer-loading-spinner{position:absolute;left:.75rem;animation:spin 1s linear infinite;width:1rem;height:1rem;border:2px solid var(--color-accent);border-top-color:transparent;border-radius:50%}.drum-sequencer-input{display:flex;justify-content:center;align-items:center;flex-grow:1;height:2.5rem;padding:.5rem 1rem .5rem 2.5rem;border-radius:100px;background:transparent;font-size:.875rem;font-weight:500;color:var(--color-foreground-primary);outline:none;border:none;transition:all .2s;width:100%;font-family:inherit}.drum-sequencer-input:focus{background:var(--color-background-glass-thin)}.drum-sequencer-input:disabled{opacity:.5;cursor:not-allowed}.drum-sequencer-input::placeholder{color:#ffffff4d}.drum-sequencer-input-icon{position:absolute;left:.75rem;color:#ffffff4d}.drum-sequencer-send-wrapper{display:flex;justify-content:flex-end;align-items:center;flex-grow:0;flex-shrink:0;gap:.5rem;margin-left:.5rem}.drum-sequencer-send-button{display:flex;justify-content:center;align-items:center;flex-grow:0;flex-shrink:0;height:2rem;width:2rem;border-radius:100px;background:var(--color-foreground-primary);border:1px solid var(--color-border-primary);cursor:pointer;transition:all .2s;padding:0}.drum-sequencer-send-button:hover:not(:disabled){background:var(--color-foreground-primary);transform:scale(1.05)}.drum-sequencer-send-button:disabled{opacity:.5;cursor:not-allowed}.drum-sequencer-send-button:disabled:hover{transform:scale(1)}.drum-sequencer-send-button-inner{display:flex;justify-content:flex-start;align-items:center;flex-grow:0;flex-shrink:0;width:1rem;height:1rem;position:relative}.drum-sequencer-send-icon{color:var(--color-dumbo-50)}.drum-sequencer-play-button-container{position:fixed;bottom:2rem;left:50%;transform:translate(-50%);z-index:1000;display:flex;justify-content:center;align-items:center;gap:1rem}.drum-sequencer-tempo-control{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:4px}.drum-sequencer-tempo-label{font-size:.75rem;font-weight:500;color:#6a6a72;text-align:center;margin:0}.drum-sequencer-tempo-input-wrapper{display:flex;justify-content:center;align-items:center;gap:4px;background:var(--color-background-glass-thick);-webkit-backdrop-filter:blur(32px);backdrop-filter:blur(32px);border:1px solid var(--color-border-primary);border-radius:8px;padding:8px 12px}.drum-sequencer-tempo-step-button{background:transparent;border:none;outline:none;font-size:1.25rem;font-weight:600;color:#6a6a72;cursor:pointer;padding:0 4px;display:flex;align-items:center;justify-content:center;transition:color .2s;user-select:none;-webkit-user-select:none;width:24px;height:24px}.drum-sequencer-tempo-step-button:hover{color:#f7f4ef}.drum-sequencer-tempo-step-button:active{color:#8b6efe}.drum-sequencer-tempo-input{background:transparent;border:none;outline:none;font-size:1rem;font-weight:600;color:#f7f4ef;text-align:center;width:48px;padding:0;font-family:inherit;-webkit-appearance:textfield;appearance:textfield;-moz-appearance:textfield}.drum-sequencer-tempo-input::-webkit-outer-spin-button,.drum-sequencer-tempo-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.drum-sequencer-tempo-unit{font-size:.75rem;font-weight:500;color:#6a6a72}.drum-sequencer-play-button-main{display:flex;justify-content:center;align-items:center;width:4rem;height:4rem;border-radius:50%;background:var(--color-background-glass-thick);-webkit-backdrop-filter:blur(32px);backdrop-filter:blur(32px);border:1px solid var(--color-border-primary);cursor:pointer;transition:all .2s;padding:0}.drum-sequencer-play-button-main:hover{background:var(--color-background-glass-dense);transform:scale(1.05)}.drum-sequencer-play-button-inner{display:flex;justify-content:center;align-items:center;color:var(--color-foreground-primary);transition:color .2s}.drum-sequencer-play-button-active{color:var(--color-accent)}.drum-sequencer-top-header{display:flex;justify-content:center;align-items:center;height:48px;padding:0;border-bottom:1px solid var(--color-border-primary);background:var(--color-dumbo-50);width:100%;position:relative;z-index:10000;overflow:visible}.drum-sequencer-top-header-wrapper{display:flex;justify-content:space-between;align-items:center;flex-grow:0;flex-shrink:0;width:100%;max-width:100%}.drum-sequencer-top-header-inner{display:flex;justify-content:space-between;align-items:center;flex-grow:1;height:3rem;overflow:hidden;padding:.5rem;border-radius:100px}.drum-sequencer-top-header-main{display:flex;justify-content:space-between;align-items:center;flex-grow:1}.drum-sequencer-top-header-left{display:flex;justify-content:flex-start;align-items:center;flex-grow:0;flex-shrink:0;position:relative;gap:.5rem}.drum-sequencer-drumzzz-text{flex-grow:0;flex-shrink:0;font-size:.75rem;font-weight:500;text-align:left;color:var(--color-foreground-primary)}.drum-sequencer-top-header-center{display:flex;justify-content:center;align-items:center;flex-grow:1;gap:.25rem;position:absolute;left:50%;transform:translate(-50%);z-index:10000}.drum-sequencer-top-header-center-item{display:flex;flex-direction:column;justify-content:flex-start;align-items:flex-start;flex-grow:0;flex-shrink:0;gap:.625rem}.drum-sequencer-icon-button-small{display:flex;justify-content:center;align-items:center;align-self:stretch;flex-grow:0;flex-shrink:0;height:24px;gap:4px;padding:6px;border-radius:100px;background:#ffffff0a;-webkit-backdrop-filter:blur(32px);backdrop-filter:blur(32px);cursor:pointer;transition:background .2s}.drum-sequencer-icon-button-small:hover{background:#ffffff14}.drum-sequencer-icon-button-active{background:#ffffff14!important}.drum-sequencer-icon-svg-small{display:flex;justify-content:flex-start;align-items:center;flex-grow:0;flex-shrink:0;width:.75rem;height:.75rem;position:relative;gap:.625rem}.drum-sequencer-preset-selector{display:flex;height:32px;padding:6px 4px;justify-content:space-between;align-items:center;flex:1 0 0;border-radius:100px;border:1px solid var(--color-border-primary)}.drum-sequencer-preset-nav-button{display:flex;justify-content:center;align-items:center;flex-grow:0;flex-shrink:0;height:1.5rem;position:relative;gap:.25rem;padding:.375rem;border-radius:100px;background:var(--color-background-glass-thick);-webkit-backdrop-filter:blur(32px);backdrop-filter:blur(32px);cursor:pointer;transition:background .2s}.drum-sequencer-preset-nav-button:hover{background:var(--color-background-glass-dense)}.drum-sequencer-preset-nav-icon{flex-grow:0;flex-shrink:0;width:.75rem;height:.75rem;position:relative}.drum-sequencer-preset-dropdown-wrapper{position:relative;z-index:10001}.drum-sequencer-preset-dropdown{position:absolute;top:calc(100% + .5rem);left:0;z-index:10001;min-width:200px;max-width:300px;background:var(--color-dumbo-100);border:1px solid var(--color-border-primary);border-radius:8px;box-shadow:0 8px 24px #0006;overflow:visible;isolation:isolate}.drum-sequencer-preset-dropdown-content{max-height:400px;overflow-y:auto;overflow-x:visible;padding:.5rem 0;position:relative}.drum-sequencer-preset-genre-item{display:flex;justify-content:space-between;align-items:center;padding:.75rem 1rem;color:var(--color-foreground-primary);font-size:.875rem;font-weight:500;cursor:pointer;transition:background .2s;position:relative;overflow:visible}.drum-sequencer-preset-genre-item:hover{background:var(--color-dumbo-150)}.drum-sequencer-preset-beats-submenu{position:fixed;z-index:99999;min-width:220px;max-width:300px;max-height:400px;overflow-y:auto;background:var(--color-dumbo-100);border:1px solid var(--color-border-primary);border-radius:8px;box-shadow:0 8px 24px #0006;padding:.5rem 0;white-space:nowrap;transition:opacity .2s ease-in-out,visibility .2s ease-in-out;visibility:hidden;opacity:0;pointer-events:none;display:block}.drum-sequencer-preset-beats-submenu.drum-sequencer-preset-beats-submenu-open{visibility:visible!important;opacity:1!important;pointer-events:auto!important;display:block!important}.drum-sequencer-preset-beat-item{display:block;width:100%;padding:.625rem 1rem;text-align:left;background:transparent;border:none;color:var(--color-foreground-primary);font-size:.875rem;font-weight:400;cursor:pointer;transition:background .2s}.drum-sequencer-preset-beat-item:hover{background:var(--color-dumbo-150)}.drum-sequencer-preset-divider{height:1px;background:var(--color-border-primary);margin:.5rem 0}.drum-sequencer-preset-my-beats{display:block;width:100%;padding:.75rem 1rem;text-align:left;background:transparent;border:none;color:var(--color-foreground-primary);font-size:.875rem;font-weight:500;cursor:pointer;transition:background .2s}.drum-sequencer-preset-my-beats:hover{background:var(--color-dumbo-150)}.drum-sequencer-preset-text{flex-grow:0;flex-shrink:0;font-size:.75rem;font-weight:500;text-align:center;color:var(--color-dumbo-950);cursor:pointer;padding:0 .5rem}.drum-sequencer-top-header-right{display:flex;justify-content:flex-end;align-items:center;flex-grow:0;flex-shrink:0;gap:.25rem}.drum-sequencer-top-header-right-item{display:flex;flex-direction:column;justify-content:flex-start;align-items:flex-start;flex-grow:0;flex-shrink:0;gap:.625rem}@media(max-width:768px){.drum-sequencer-top-header-wrapper{max-width:100%}.drum-sequencer-top-header-content{flex-wrap:wrap;height:auto;min-height:48px;gap:.5rem}.drum-sequencer-top-header-center{order:3;width:100%;justify-content:center}.drum-sequencer-preset-text,.drum-sequencer-insert-text{min-width:auto}.drum-sequencer-preset-beats-submenu{position:static;margin-left:0;margin-top:.5rem;box-shadow:none;border:none;border-top:1px solid var(--color-border-primary)}}@media(max-width:480px){.drum-sequencer-top-header-left,.drum-sequencer-top-header-right{flex:1}.drum-sequencer-top-header-center{order:3;width:100%}.drum-sequencer-preset-dropdown{left:0;transform:none;width:100%}}.drum-sequencer-layout{display:flex;width:100%;max-width:1400px;gap:1rem;align-items:flex-start}.drum-sequencer-chat-panel{width:300px;flex-shrink:0;background:var(--color-dumbo-50);border:1px solid var(--color-border-primary);border-radius:.5rem;padding:8px;display:flex;flex-direction:column}.drum-sequencer-chat-content{display:flex;flex-direction:column;gap:8px;width:100%}.drum-sequencer-chat-panel .drum-sequencer-input-wrapper{width:100%;position:relative}.drum-sequencer-chat-panel .drum-sequencer-input{width:100%;padding-right:2.5rem}.drum-sequencer-chat-panel .drum-sequencer-send-wrapper{width:100%;display:flex;justify-content:flex-end}.drum-sequencer-main-content{display:flex;flex-direction:column;gap:2px;width:fit-content;min-width:0;background:var(--color-dumbo-50);border:1px solid var(--color-border-primary);border-radius:16px;overflow:hidden}.drum-sequencer-content-row{display:flex;flex-direction:row;align-items:flex-start;gap:0;width:100%;position:relative;min-height:0}.drum-sequencer-left-content{display:flex;flex-direction:column;gap:2px;flex:1;min-width:0;margin-right:266px}.drum-sequencer-sounds-panel{display:flex;flex-direction:column;justify-content:flex-start;align-items:flex-start;width:262px;overflow:hidden;gap:0;border-radius:16px;background:#1c1c1f;flex-shrink:0;margin-bottom:4px;margin-right:4px;position:absolute;top:0;right:0;bottom:0;height:100%;max-height:100%}.drum-sequencer-sounds-panel-tabs{display:flex;justify-content:flex-start;align-items:center;width:262px;height:48px;border-bottom:1px solid rgba(255,255,255,.1)}.drum-sequencer-sounds-panel-tab{display:flex;justify-content:center;align-items:center;flex:1;height:100%;gap:10px;padding:8px 0;cursor:pointer;border-bottom:2px solid transparent}.drum-sequencer-sounds-panel-tab-active{border-bottom:2px solid #f7f4ef}.drum-sequencer-sounds-panel-tab-text{font-size:12px;font-weight:500;text-align:left;color:#9ca3af;margin:0}.drum-sequencer-sounds-panel-tab-active .drum-sequencer-sounds-panel-tab-text{color:#f7f4ef}.drum-sequencer-api-key-button{display:flex;justify-content:center;align-items:center;gap:8px;background:transparent;border:none;cursor:pointer;padding:8px 12px;transition:all .2s;color:#6a6a72;flex-shrink:0;border-radius:8px}.drum-sequencer-api-key-button:hover{color:#f7f4ef;background:#ffffff0d}.drum-sequencer-api-key-button-text{font-size:12px;font-weight:500;font-family:PP Neue Montreal,Neue Montreal,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif}.drum-sequencer-sounds-panel-content{display:flex;flex-direction:column;justify-content:flex-start;align-items:flex-start;flex:1;min-height:0;max-height:100%;overflow:hidden;position:relative;height:0}.drum-sequencer-chat-content{display:flex;flex-direction:column;justify-content:space-between;align-items:flex-start;flex:1;padding:8px;gap:8px;min-height:0}.drum-sequencer-chat-messages{display:flex;flex-direction:column;gap:8px;flex:1;overflow-y:auto;width:100%}.drum-sequencer-chat-message{padding:8px;border-radius:8px;background:#ffffff0a}.drum-sequencer-chat-message-text{font-size:12px;color:var(--color-foreground-secondary);margin:0}.drum-sequencer-chat-input-wrapper{display:flex;align-items:center;gap:8px;width:100%;padding:8px;background:#ffffff0a;border-radius:100px}.drum-sequencer-chat-input{flex:1;background:transparent;border:none;outline:none;color:var(--color-foreground-primary);font-size:12px;font-family:inherit;padding:0}.drum-sequencer-chat-input::placeholder{color:var(--color-foreground-inactive)}.drum-sequencer-chat-send-button{display:flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:50%;background:#f7f4ef;border:none;cursor:pointer;padding:0;flex-shrink:0}.drum-sequencer-chat-send-button:disabled{opacity:.5;cursor:not-allowed}.drum-sequencer-chat-loading{width:12px;height:12px;border:2px solid #101012;border-top-color:transparent;border-radius:50%;animation:spin .6s linear infinite}.drum-sequencer-sound-item-draggable{cursor:grab}.drum-sequencer-sound-item-draggable:active{cursor:grabbing;opacity:.7}.drum-sequencer-sounds-panel-empty,.drum-sequencer-patterns-empty{padding:16px;text-align:center;color:var(--color-foreground-inactive);font-size:12px}.drum-sequencer-patterns-content{display:flex;flex-direction:column;flex:1;min-height:0;max-height:100%;padding:8px;overflow:hidden;position:relative}.drum-sequencer-patterns-list{display:flex;flex-direction:column;gap:8px;flex:1;overflow-y:auto;width:100%;max-height:100%}.drum-sequencer-pattern-item{padding:12px;border-radius:8px;background:#ffffff0a;cursor:pointer;transition:background .2s}.drum-sequencer-pattern-item:hover{background:#ffffff14}.drum-sequencer-pattern-item-content{display:flex;flex-direction:column;gap:8px}.drum-sequencer-pattern-item-name{font-size:12px;font-weight:500;color:var(--color-foreground-primary);margin:0}.drum-sequencer-pattern-preview{display:flex;flex-direction:column;gap:2px}.drum-sequencer-pattern-row{display:flex;gap:2px;height:4px}.drum-sequencer-pattern-step{flex:1;height:100%;background:#ffffff1a;border-radius:1px}.drum-sequencer-pattern-step.active{background:#8b6efe}.drum-sequencer-sounds-panel-list{display:flex;flex-direction:column;justify-content:flex-start;align-items:flex-start;flex:1;gap:12px;padding:0 8px;overflow:hidden;min-height:0;width:100%;max-height:100%;height:0}.drum-sequencer-generating-overlay{position:absolute;top:0;left:0;right:0;bottom:0;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:12px;background:#101012f2;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:10}.drum-sequencer-generating-spinner{width:32px;height:32px;border:3px solid rgba(247,244,239,.1);border-top-color:#f7f4ef;border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.drum-sequencer-sound-item-loading{opacity:.6;pointer-events:none}.drum-sequencer-sound-icon-loading{position:relative;overflow:hidden}.drum-sequencer-sound-loading-spinner{width:16px;height:16px;border:2px solid rgba(247,244,239,.2);border-top-color:#f7f4ef;border-radius:50%;animation:spin .8s linear infinite;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.drum-sequencer-pack-selector{display:flex;justify-content:center;align-items:center;gap:8px;padding:8px;border-bottom:1px solid rgba(255,255,255,.04)}.drum-sequencer-pack-nav-button{display:flex;justify-content:center;align-items:center;width:24px;height:24px;border-radius:50%;background:#ffffff0a;border:none;cursor:pointer;color:#f7f4ef;transition:background .2s}.drum-sequencer-pack-nav-button:hover:not(:disabled){background:#ffffff14}.drum-sequencer-pack-nav-button:disabled{opacity:.3;cursor:not-allowed}.drum-sequencer-pack-pill{display:flex;justify-content:center;align-items:center;flex:1;height:32px;padding:6px 12px;border-radius:100px;border:1px solid rgba(255,255,255,.04);background:#ffffff05}.drum-sequencer-pack-text{font-size:.75rem;font-weight:500;color:#f7f4ef;text-align:center}.drum-sequencer-pack-content{display:flex;flex-direction:column;gap:4px;padding:8px}.drum-sequencer-pack-sounds{display:flex;flex-direction:column;gap:4px}.drum-sequencer-generating-text{font-size:14px;font-weight:500;color:#f7f4ef;margin:0}.drum-sequencer-sounds-panel-title{font-size:14px;font-weight:500;text-align:right;color:#f7f4ef;width:246px;margin:0}.drum-sequencer-sounds-panel-items{display:flex;flex-direction:column;justify-content:flex-start;align-items:flex-start;gap:4px;width:100%;overflow-y:auto;overflow-x:hidden;flex:1;min-height:0}.drum-sequencer-sounds-panel-item{display:flex;justify-content:space-between;align-items:center;height:30px;width:100%}.drum-sequencer-sounds-panel-item-content{display:flex;justify-content:space-between;align-items:center;flex:1;opacity:.8;border-radius:8px}.drum-sequencer-sounds-panel-item-left{display:flex;justify-content:flex-start;align-items:center;flex:1;height:32px;gap:8px;border-radius:8px}.drum-sequencer-sounds-panel-item-icon{width:20px;height:20px;border-radius:4px;flex-shrink:0;display:block}.drum-sequencer-sounds-panel-item-name{font-size:12px;font-weight:500;text-align:left;color:#fcfbf9;flex:1;margin:0}.drum-sequencer-sounds-panel-item-actions{display:flex;justify-content:flex-start;align-items:center;gap:8px;flex-shrink:0}.drum-sequencer-sounds-panel-item-actions svg{width:16px;height:16px;cursor:pointer}.drum-sequencer-sounds-panel-footer{display:flex;justify-content:flex-start;align-items:center;gap:4px;padding:8px;border-bottom-left-radius:16px;border-bottom-right-radius:16px;width:100%;box-sizing:border-box}.drum-sequencer-sounds-panel-footer-input{display:flex;justify-content:flex-start;align-items:center;flex:1;flex-grow:1;flex-shrink:1;min-width:0;height:40px;gap:8px;padding:12px;border-radius:100px;background:#ffffff0a;-webkit-backdrop-filter:blur(32px);backdrop-filter:blur(32px)}.drum-sequencer-sounds-panel-footer-input-field{width:100%;background:transparent;border:none;outline:none;font-size:14px;font-weight:500;color:#f7f4ef;font-family:inherit;padding:0;margin:0}.drum-sequencer-sounds-panel-footer-input-field::placeholder{color:#f7f4ef80}.drum-sequencer-sounds-panel-footer-text{font-size:14px;font-weight:500;text-align:center;color:#f7f4ef;flex:1;margin:0}.drum-sequencer-sounds-panel-footer-button{display:flex;justify-content:center;align-items:center;width:40px;height:40px;padding:0;border-radius:50%;background:#f7f4ef;border:1px solid rgba(255,255,255,.1);cursor:pointer;flex-shrink:0}.drum-sequencer-sounds-panel-footer-button svg{width:16px;height:16px;flex:1}.drum-sequencer-top-header-outer{display:flex;justify-content:space-between;align-items:center;align-self:stretch;flex-grow:0;flex-shrink:0;padding-bottom:0;margin-bottom:0}.drum-sequencer-top-header-inner{display:flex;justify-content:space-between;align-items:center;flex-grow:1;height:48px;overflow:hidden;padding:8px;border-radius:100px}.drum-sequencer-top-header-left{display:flex;justify-content:flex-start;align-items:center;flex-grow:0;flex-shrink:0;gap:8px;position:relative}.drum-sequencer-top-header-arrow{flex-grow:0;flex-shrink:0;width:16px;height:16px;position:relative}.drum-sequencer-drumzzz-text{flex-grow:0;flex-shrink:0;font-size:.75rem;font-weight:500;text-align:left;color:#f7f4ef}.drum-sequencer-top-header-center-wrapper{display:flex;justify-content:space-between;align-items:center;flex-grow:1}.drum-sequencer-top-header-center-left{display:flex;justify-content:center;align-items:center;flex-grow:1;gap:4px}.drum-sequencer-top-header-center-right{display:flex;justify-content:flex-end;align-items:center;flex-grow:0;flex-shrink:0;gap:4px}.drum-sequencer-icon-button-wrapper{display:flex;flex-direction:column;justify-content:flex-start;align-items:flex-start;flex-grow:0;flex-shrink:0;gap:10px}.drum-sequencer-icon-inner{display:flex;justify-content:flex-start;align-items:center;flex-grow:0;flex-shrink:0;width:12px;height:12px;position:relative;gap:10px}.drum-sequencer-icon-svg{flex-grow:1;height:12px;position:relative}.drum-sequencer-preset-selector-wrapper{display:flex;justify-content:flex-start;align-items:center;flex-grow:0;flex-shrink:0;width:270px;gap:4px}.drum-sequencer-preset-selector-inner{display:flex;justify-content:flex-start;align-items:center;flex-grow:1;gap:4px}.drum-sequencer-preset-selector-pill{display:flex;justify-content:space-between;align-items:center;flex-grow:1;height:32px;position:relative;padding:6px 4px;border-radius:100px;border:1px solid rgba(255,255,255,.04)}.drum-sequencer-preset-nav-button{display:flex;justify-content:center;align-items:center;flex-grow:0;flex-shrink:0;height:24px;position:relative;gap:4px;padding:6px;border-radius:100px;background:#ffffff0a;-webkit-backdrop-filter:blur(32px);backdrop-filter:blur(32px);cursor:pointer;transition:background .2s}.drum-sequencer-preset-nav-button:hover{background:#ffffff14}.drum-sequencer-preset-nav-icon{flex-grow:0;flex-shrink:0;width:12px;height:12px;position:relative}.drum-sequencer-sound-pack-text{flex-grow:0;flex-shrink:0;font-size:.75rem;font-weight:500;text-align:center;color:#fcfbf9}.drum-sequencer-pack-dropdown{position:absolute;top:calc(100% + 8px);left:0;z-index:10001;min-width:200px;max-width:300px;background:#1c1c1f;border:1px solid rgba(255,255,255,.1);border-radius:12px;box-shadow:0 8px 24px #0006;overflow:hidden;max-height:400px;overflow-y:auto}.drum-sequencer-pack-dropdown-section{padding:8px 0}.drum-sequencer-pack-dropdown-section:not(:last-child){border-bottom:1px solid rgba(255,255,255,.05)}.drum-sequencer-pack-dropdown-section-title{padding:8px 12px;font-size:.7rem;font-weight:600;color:#6a6a72;text-transform:uppercase;letter-spacing:.5px;margin:0}.drum-sequencer-pack-dropdown-item{padding:10px 12px;font-size:.875rem;color:#f7f4ef;cursor:pointer;transition:background .2s}.drum-sequencer-pack-dropdown-item:hover{background:#ffffff0d}.drum-sequencer-pack-dropdown-item-active{background:#8b6efe26;color:#8b6efe}.drum-sequencer-grid-section{display:flex;flex-direction:column;justify-content:flex-start;align-items:flex-start;flex-grow:0;flex-shrink:0;gap:2px;padding:0 4px 4px;margin:0 4px 4px;background:#1c1c1f;border-radius:16px}.drum-sequencer-grid-section:has(+.drum-sequencer-sound-editing-panel){margin-bottom:0}.drum-sequencer-beat-pattern-header{display:flex;flex-direction:column;justify-content:center;align-items:center;align-self:stretch;flex-grow:0;flex-shrink:0;padding:4px;border-radius:12px;width:100%}.drum-sequencer-beat-pattern-header-content{display:flex;justify-content:space-between;align-items:center;align-self:stretch;flex-grow:0;flex-shrink:0;height:30px;opacity:.8;border-radius:8px}.drum-sequencer-beat-pattern-header-left{display:flex;justify-content:center;align-items:center;flex-grow:0;flex-shrink:0;height:32px;gap:8px;border-radius:8px}.drum-sequencer-beat-pattern-header-center{display:flex;justify-content:center;align-items:center;flex-grow:0;flex-shrink:0;position:absolute;left:50%;transform:translate(-50%)}.drum-sequencer-view-toggle-container{display:flex;flex-direction:row;justify-content:center;align-items:center;gap:0;border:1px solid rgba(255,255,255,.04);border-radius:8px;padding:2px}.drum-sequencer-view-toggle-container .drum-sequencer-icon-button-wrapper{flex-direction:row;gap:0}.drum-sequencer-view-toggle-container .drum-sequencer-icon-button-small{border-radius:0}.drum-sequencer-view-toggle-container .drum-sequencer-icon-button-wrapper:first-child .drum-sequencer-icon-button-small{border-top-left-radius:6px;border-bottom-left-radius:6px}.drum-sequencer-view-toggle-container .drum-sequencer-icon-button-wrapper:last-child .drum-sequencer-icon-button-small{border-top-right-radius:6px;border-bottom-right-radius:6px}.drum-sequencer-beat-pattern-header-right{display:flex;justify-content:flex-start;align-items:center;flex-grow:0;flex-shrink:0;gap:8px;position:relative}.drum-sequencer-sound-editing-panel{display:flex;flex-direction:column;justify-content:flex-start;align-items:flex-start;flex-grow:0;flex-shrink:0;padding:4px;margin:0 4px 4px;border-radius:12px;background:#1c1c1f;align-self:stretch;width:calc(100% - 8px);min-width:0;min-height:0;box-sizing:border-box}.drum-sequencer-sound-editing-header{display:flex;flex-direction:column;justify-content:center;align-items:center;align-self:stretch;flex-grow:0;flex-shrink:0;padding:0;border-radius:8px;margin-bottom:4px}.drum-sequencer-sound-editing-header-content{display:flex;justify-content:space-between;align-items:center;align-self:stretch;flex-grow:0;flex-shrink:0;height:30px;padding:4px;position:relative}.drum-sequencer-sound-editing-controls{display:flex;justify-content:center;align-items:center;gap:8px;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:1}.drum-sequencer-control-button{display:flex;justify-content:center;align-items:center;width:32px;height:32px;border-radius:8px;background:transparent;border:none;cursor:pointer;padding:0;transition:all .2s;color:#6a6a72}.drum-sequencer-control-button:hover{background:transparent;color:#f7f4ef}.drum-sequencer-control-button-active{background:transparent;color:#f7f4ef;border:none}.drum-sequencer-control-button-active:hover{background:transparent;color:#f7f4ef}.drum-sequencer-sound-editing-header-left{display:flex;justify-content:center;align-items:center;flex-grow:0;flex-shrink:0;height:32px;gap:8px;border-radius:8px}.drum-sequencer-sound-icon{flex-grow:0;flex-shrink:0;width:20px;height:20px;border-radius:4px}.drum-sequencer-sound-name{flex-grow:0;flex-shrink:0;font-size:.75rem;font-weight:500;text-align:left;color:var(--color-dumbo-950)}.drum-sequencer-sound-editing-header-right{display:flex;justify-content:flex-start;align-items:center;flex-grow:0;flex-shrink:0;gap:8px;position:relative}.drum-sequencer-sound-editing-content{display:flex;flex-direction:row;justify-content:flex-start;align-items:flex-start;flex-grow:0;flex-shrink:0;width:100%;min-width:0;gap:8px;position:relative;padding:0}.drum-sequencer-sound-pack-nav{height:48px;background:var(--color-dumbo-50);border-bottom:1px solid var(--color-border-primary);padding:0 8px;display:flex;align-items:center;flex-shrink:0}.drum-sequencer-sound-pack-nav-content{display:flex;justify-content:space-between;align-items:center;width:100%;gap:1rem}.drum-sequencer-sound-pack-nav-left{flex-shrink:0}.drum-sequencer-sound-pack-nav-center{display:flex;align-items:center;gap:.5rem;flex:1;justify-content:center}.drum-sequencer-sound-pack-text{font-size:.75rem;font-weight:500;color:var(--color-dumbo-950)}.drum-sequencer-sound-pack-nav-right{display:flex;align-items:center;gap:.5rem;flex-shrink:0}.drum-sequencer-sequencer-wrapper{background:var(--color-dumbo-100);border-top:1px solid var(--color-border-primary);padding:4px;display:flex;flex-direction:column;overflow-y:auto}.drum-sequencer-beat-pattern-nav{height:40px;padding:0 8px;display:flex;align-items:center;border-bottom:1px solid var(--color-border-primary);margin-bottom:4px;flex-shrink:0}.drum-sequencer-beat-pattern-nav-content{display:flex;justify-content:space-between;align-items:center;width:100%;gap:1rem}.drum-sequencer-beat-pattern-text{font-size:.875rem;font-weight:500;color:var(--color-dumbo-950)}.drum-sequencer-beat-pattern-options{display:flex;align-items:center;gap:.5rem}.drum-sequencer-waveform-section{flex-grow:1;flex-shrink:1;width:auto;min-width:200px;height:100%;min-height:73px;background:#000;border-radius:.5rem;position:relative;overflow:hidden}.drum-sequencer-waveform-section canvas{width:100%;height:100%}.drum-sequencer-instrument-panel{display:flex;flex-direction:column;border-top:1px solid var(--color-border-primary);background:var(--color-dumbo-100);margin-top:4px;flex-shrink:0}.drum-sequencer-instrument-panel-header{padding:8px;border-bottom:1px solid var(--color-border-primary)}.drum-sequencer-instrument-panel-title{display:flex;align-items:center;gap:.5rem;background:transparent;border:none;color:var(--color-foreground-primary);font-size:.875rem;font-weight:500;cursor:pointer;padding:0}.drum-sequencer-instrument-panel-content{display:flex;gap:1.5rem;padding:8px;align-items:flex-start}.drum-sequencer-envelope-section{flex:1;min-height:120px;max-height:200px}.drum-sequencer-xy-pads-row,.drum-sequencer-params-row{display:flex;flex-direction:row;justify-content:flex-start;align-items:flex-start;flex-grow:0;flex-shrink:0;gap:8px;padding:0;margin:0;width:fit-content;min-width:0;box-sizing:border-box}.drum-sequencer-param-group{display:flex;flex-direction:column;justify-content:flex-end;align-items:center;flex-grow:0;flex-shrink:0;gap:8px}.drum-sequencer-param-divider{flex-grow:0;flex-shrink:0;width:1px;height:54px}.app{min-height:100vh;width:100%;margin:0;padding:0}