/*! tailwindcss v4.1.11 | MIT License | https://tailwindcss.com */@layer properties{@supports ((-webkit-hyphens:none) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-scale-x:1;--tw-scale-y:1;--tw-scale-z:1;--tw-rotate-x:initial;--tw-rotate-y:initial;--tw-rotate-z:initial;--tw-skew-x:initial;--tw-skew-y:initial;--tw-border-style:solid;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial;--tw-duration:initial}}}.visible{visibility:visible}.absolute{position:absolute}.fixed{position:fixed}.relative{position:relative}.z-10{z-index:10}.order-1{order:1}.order-2{order:2}.order-3{order:3}.mx-auto{margin-inline:auto}.block{display:block}.flex{display:flex}.grid{display:grid}.hidden{display:none}.h-full{height:100%}.min-h-screen{min-height:100vh}.w-full{width:100%}.flex-1{flex:1}.scale-105{--tw-scale-x:105%;--tw-scale-y:105%;--tw-scale-z:105%;scale:var(--tw-scale-x)var(--tw-scale-y)}.scale-\[1\.02\]{scale:1.02}.transform{transform:var(--tw-rotate-x,)var(--tw-rotate-y,)var(--tw-rotate-z,)var(--tw-skew-x,)var(--tw-skew-y,)}.cursor-default{cursor:default}.cursor-not-allowed{cursor:not-allowed}.cursor-pointer{cursor:pointer}.resize{resize:both}.appearance-none{-webkit-appearance:none;-moz-appearance:none;appearance:none}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.grid-cols-10{grid-template-columns:repeat(10,minmax(0,1fr))}.grid-cols-\[120px_repeat\(16\,1fr\)\]{grid-template-columns:120px repeat(16,1fr)}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.items-center{align-items:center}.items-start{align-items:flex-start}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.overflow-hidden{overflow:hidden}.overflow-x-auto{overflow-x:auto}.overflow-y-auto{overflow-y:auto}.rounded-full{border-radius:3.40282e38px}.border{border-style:var(--tw-border-style);border-width:1px}.border-2{border-style:var(--tw-border-style);border-width:2px}.border-t{border-top-style:var(--tw-border-style);border-top-width:1px}.border-b{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.border-b-2{border-bottom-style:var(--tw-border-style);border-bottom-width:2px}.border-l-2{border-left-style:var(--tw-border-style);border-left-width:2px}.border-l-4{border-left-style:var(--tw-border-style);border-left-width:4px}.bg-transparent{background-color:#0000}.bg-gradient-to-br{--tw-gradient-position:to bottom right in oklab;background-image:linear-gradient(var(--tw-gradient-stops))}.bg-gradient-to-r{--tw-gradient-position:to right in oklab;background-image:linear-gradient(var(--tw-gradient-stops))}.bg-clip-text{-webkit-background-clip:text;background-clip:text}.text-center{text-align:center}.text-left{text-align:left}.text-right{text-align:right}.text-transparent{color:#0000}.uppercase{text-transform:uppercase}.italic{font-style:italic}.opacity-0{opacity:0}.opacity-5{opacity:.05}.opacity-20{opacity:.2}.opacity-50{opacity:.5}.opacity-75{opacity:.75}.opacity-90{opacity:.9}.ring-1{--tw-ring-shadow:var(--tw-ring-inset,)0 0 0 calc(1px + var(--tw-ring-offset-width))var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ring-2{--tw-ring-shadow:var(--tw-ring-inset,)0 0 0 calc(2px + var(--tw-ring-offset-width))var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ring-offset-2{--tw-ring-offset-width:2px;--tw-ring-offset-shadow:var(--tw-ring-inset,)0 0 0 var(--tw-ring-offset-width)var(--tw-ring-offset-color)}.filter{filter:var(--tw-blur,)var(--tw-brightness,)var(--tw-contrast,)var(--tw-grayscale,)var(--tw-hue-rotate,)var(--tw-invert,)var(--tw-saturate,)var(--tw-sepia,)var(--tw-drop-shadow,)}.transition-all{transition-property:all;transition-timing-function:var(--tw-ease,ease);transition-duration:var(--tw-duration,0s)}.transition-colors{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease,ease);transition-duration:var(--tw-duration,0s)}.transition-opacity{transition-property:opacity;transition-timing-function:var(--tw-ease,ease);transition-duration:var(--tw-duration,0s)}.duration-150{--tw-duration:.15s;transition-duration:.15s}.duration-200{--tw-duration:.2s;transition-duration:.2s}.duration-300{--tw-duration:.3s;transition-duration:.3s}@media (hover:hover){.group-hover\:opacity-10:is(:where(.group):hover *){opacity:.1}.hover\:scale-105:hover{--tw-scale-x:105%;--tw-scale-y:105%;--tw-scale-z:105%;scale:var(--tw-scale-x)var(--tw-scale-y)}.hover\:scale-\[1\.02\]:hover{scale:1.02}.hover\:bg-gradient-to-br:hover{--tw-gradient-position:to bottom right in oklab;background-image:linear-gradient(var(--tw-gradient-stops))}}.focus\:ring-2:focus{--tw-ring-shadow:var(--tw-ring-inset,)0 0 0 calc(2px + var(--tw-ring-offset-width))var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.focus\:outline-none:focus{--tw-outline-style:none;outline-style:none}.active\:scale-95:active{--tw-scale-x:95%;--tw-scale-y:95%;--tw-scale-z:95%;scale:var(--tw-scale-x)var(--tw-scale-y)}.active\:scale-\[0\.98\]:active{scale:.98}.disabled\:cursor-not-allowed:disabled{cursor:not-allowed}:root{--bg-primary:#0a0a0a;--bg-secondary:#111827;--bg-tertiary:#1f2937;--bg-accent:#374151;--text-primary:#fff;--text-secondary:#e5e7eb;--text-muted:#9ca3af;--accent-primary:#06b6d4;--accent-secondary:#8b5cf6;--accent-success:#10b981;--accent-warning:#f59e0b;--accent-danger:#ef4444;--shadow-sm:0 1px 2px 0 #0000000d;--shadow-md:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f;--shadow-lg:0 10px 15px -3px #0000001a,0 4px 6px -2px #0000000d;--shadow-xl:0 20px 25px -5px #0000001a,0 10px 10px -5px #0000000a;--gradient-primary:linear-gradient(135deg,#06b6d4 0%,#8b5cf6 100%);--gradient-secondary:linear-gradient(135deg,#1f2937 0%,#111827 100%);--gradient-accent:linear-gradient(135deg,#374151 0%,#1f2937 100%)}*{box-sizing:border-box}html{scroll-behavior:smooth;font-feature-settings:"liga" 1,"kern" 1}body{min-width:320px;min-height:100vh;color:var(--text-primary);background:var(--bg-primary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;margin:0;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;font-weight:400;line-height:1.6}.btn-pro{transition:all .2s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden;transform:translateZ(0)}.btn-pro:before{content:"";background:linear-gradient(90deg,#0000,#ffffff1a,#0000);width:100%;height:100%;transition:left .6s cubic-bezier(.4,0,.2,1);position:absolute;top:0;left:-100%}.btn-pro:hover:before{left:100%}.btn-pro:hover{transform:translateY(-2px)scale(1.02);box-shadow:0 10px 25px #00000040,0 0 20px #06b6d41a}.btn-pro:active{transition:all .1s;transform:translateY(-1px)scale(.98)}.step-button{transition:all .15s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden;transform:translateZ(0)}.step-button:after{content:"";background:radial-gradient(circle,#06b6d44d,#0000 70%);border-radius:50%;width:0;height:0;transition:all .3s;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.step-button:hover:after{width:100%;height:100%}.step-button:hover{transform:translateY(-1px)scale(1.05);box-shadow:0 8px 25px #0000004d}.step-button.active{background:var(--gradient-primary);box-shadow:0 0 20px #06b6d466,inset 0 1px 3px #ffffff1a}.step-button.current{animation:1s ease-in-out infinite alternate pulse-glow}@keyframes pulse-glow{0%{box-shadow:0 0 20px #06b6d480}to{box-shadow:0 0 30px #06b6d4cc,0 0 50px #06b6d44d}}.card-pro{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:linear-gradient(135deg,#1f2937e6,#111827e6);border:1px solid #37415180;transition:all .3s cubic-bezier(.4,0,.2,1);position:relative;box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f,inset 0 1px #ffffff0d}.card-pro:before{content:"";background:var(--gradient-primary);opacity:0;height:1px;transition:opacity .3s;position:absolute;top:0;left:0;right:0}.card-pro:hover:before{opacity:1}.card-pro:hover{border-color:#06b6d44d;transform:translateY(-2px);box-shadow:0 20px 25px -5px #00000026,0 10px 10px -5px #0000000a,0 0 30px #06b6d41a}.slider{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:linear-gradient(90deg,var(--bg-accent)0%,var(--bg-tertiary)100%);border-radius:3px;outline:none;height:6px;transition:all .3s;position:relative}.slider:before{content:"";background:var(--gradient-primary);border-radius:3px;height:100%;transition:width .3s;position:absolute;top:0;left:0}.slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;background:var(--gradient-primary);border:2px solid var(--bg-primary);cursor:pointer;z-index:2;border-radius:50%;width:20px;height:20px;-webkit-transition:all .2s cubic-bezier(.4,0,.2,1);transition:all .2s cubic-bezier(.4,0,.2,1);position:relative;box-shadow:0 2px 4px #0003,0 0 #06b6d400}.slider::-webkit-slider-thumb:hover{transform:scale(1.2);box-shadow:0 4px 8px #0000004d,0 0 0 4px #06b6d433}.slider::-webkit-slider-thumb:active{transform:scale(.9)}.slider::-moz-range-thumb{background:var(--gradient-primary);border:2px solid var(--bg-primary);cursor:pointer;border-radius:50%;width:20px;height:20px;-moz-transition:all .2s cubic-bezier(.4,0,.2,1);transition:all .2s cubic-bezier(.4,0,.2,1);box-shadow:0 2px 4px #0003,0 0 #06b6d400}.slider::-moz-range-thumb:hover{transform:scale(1.2);box-shadow:0 4px 8px #0000004d,0 0 0 4px #06b6d433}.drum-grid{background:var(--gradient-secondary);border:1px solid #37415180;border-radius:12px;padding:1.5rem;box-shadow:inset 0 1px 3px #0000001a,0 1px 2px #0000000d}.transport-button{transition:all .2s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden}.transport-button.playing{background:var(--gradient-primary);animation:2s ease-in-out infinite pulse-subtle}@keyframes pulse-subtle{0%,to{opacity:1;transform:scale(1)}50%{opacity:.9;transform:scale(1.02)}}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-thumb{background:var(--gradient-primary);border-radius:4px;-webkit-transition:all .3s;transition:all .3s}::-webkit-scrollbar-corner{background:var(--bg-tertiary)}.loading-shimmer{background:linear-gradient(90deg,#fff0,#ffffff1a,#fff0);animation:2s infinite shimmer}@keyframes shimmer{0%{transform:translate(-100%)}to{transform:translate(100%)}}button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--accent-primary);outline-offset:2px}.text-gradient{background:var(--gradient-primary);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}.fade-in{animation:.6s ease-out fadeIn}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.slide-in-right{animation:.5s ease-out slideInRight}@keyframes slideInRight{0%{opacity:0;transform:translate(100%)}to{opacity:1;transform:translate(0)}}.tab-button{transition:all .3s cubic-bezier(.4,0,.2,1);position:relative}.tab-button:after{content:"";background:var(--gradient-primary);width:0;height:2px;transition:width .3s;position:absolute;bottom:0;left:0}.tab-button.active:after{width:100%}.tab-button:hover:not(.active){background:#37415180}.error-border{border-color:var(--accent-danger);box-shadow:0 0 0 1px var(--accent-danger)}.vu-meter{background:var(--bg-tertiary);border-radius:2px;position:relative;overflow:hidden}.vu-meter:after{content:"";background:linear-gradient(90deg,var(--accent-success)0%,var(--accent-warning)70%,var(--accent-danger)100%);height:100%;transition:width .1s;position:absolute;top:0;left:0}@media (max-width:768px){.card-pro{margin:.5rem}.step-button{min-height:44px}.btn-pro{min-height:44px;padding:.75rem 1rem}}@media (min-resolution:192dpi){.step-button,.btn-pro{border-width:.5px}}@media (prefers-color-scheme:dark){html{color-scheme:dark}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}@media print{.drum-grid,.card-pro{-moz-column-break-inside:avoid;break-inside:avoid}}.btn-professional{transition:all .2s;transform:scale(1)}.btn-professional:hover{transform:scale(1.02);box-shadow:0 10px 25px #0000004d}.btn-professional:active{transform:scale(.98)}@keyframes pulse-slow{0%,to{opacity:1}50%{opacity:.6}}.animate-pulse-slow{animation:2s ease-in-out infinite pulse-slow}html{scroll-behavior:smooth}::-webkit-scrollbar-track{background:#374151;border-radius:4px}:root{color-scheme:dark;color:#ffffffde;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#0a0a0a;font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;font-weight:400;line-height:1.5}body{background:linear-gradient(135deg,#0a0a0a,#1a1a1a);min-width:320px;min-height:100vh;margin:0}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:#1a1a1a}::-webkit-scrollbar-thumb{background:#404040;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#505050}a{color:#646cff;-webkit-text-decoration:inherit;text-decoration:inherit;font-weight:500}a:hover{color:#535bf2}h1{font-size:3.2em;line-height:1.1}button{cursor:pointer;background-color:#1a1a1a;border:1px solid #0000;border-radius:8px;padding:.6em 1.2em;font-family:inherit;font-size:1em;font-weight:500;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}.slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;cursor:pointer;background:#3b82f6;border:2px solid #1e40af;border-radius:50%;width:20px;height:20px}.slider::-moz-range-thumb{cursor:pointer;background:#3b82f6;border:2px solid #1e40af;border-radius:50%;width:20px;height:20px}@media (prefers-color-scheme:light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}@property --tw-scale-x{syntax:"*";inherits:false;initial-value:1}@property --tw-scale-y{syntax:"*";inherits:false;initial-value:1}@property --tw-scale-z{syntax:"*";inherits:false;initial-value:1}@property --tw-rotate-x{syntax:"*";inherits:false}@property --tw-rotate-y{syntax:"*";inherits:false}@property --tw-rotate-z{syntax:"*";inherits:false}@property --tw-skew-x{syntax:"*";inherits:false}@property --tw-skew-y{syntax:"*";inherits:false}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-blur{syntax:"*";inherits:false}@property --tw-brightness{syntax:"*";inherits:false}@property --tw-contrast{syntax:"*";inherits:false}@property --tw-grayscale{syntax:"*";inherits:false}@property --tw-hue-rotate{syntax:"*";inherits:false}@property --tw-invert{syntax:"*";inherits:false}@property --tw-opacity{syntax:"*";inherits:false}@property --tw-saturate{syntax:"*";inherits:false}@property --tw-sepia{syntax:"*";inherits:false}@property --tw-drop-shadow{syntax:"*";inherits:false}@property --tw-drop-shadow-color{syntax:"*";inherits:false}@property --tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:"*";inherits:false}@property --tw-duration{syntax:"*";inherits:false}