*,*:before,*:after{box-sizing:inherit;background:transparent;-webkit-touch-callout:none!important;-webkit-tap-highlight-color:transparent!important;-webkit-user-select:none!important;-moz-user-select:none!important;-ms-user-select:none!important;user-select:none!important;touch-action:manipulation}html,body{-webkit-user-select:none!important;-moz-user-select:none!important;-ms-user-select:none!important;user-select:none!important;-webkit-touch-callout:none!important;touch-action:manipulation}input,textarea,[contenteditable=true]{-webkit-user-select:text!important;-moz-user-select:text!important;-ms-user-select:text!important;user-select:text!important;touch-action:auto}.selectable-text,.content-text{-webkit-user-select:text!important;-moz-user-select:text!important;-ms-user-select:text!important;user-select:text!important}img,svg{-webkit-user-select:none!important;-webkit-touch-callout:none!important;pointer-events:auto}.sequencer-container,.track-row,.cell,.bpm-control,.instrument-panel,.no-select,.drag-handle{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.sequencer-page{width:100%;padding:0;margin:0}@font-face{font-family:Mangrove;src:url(/assets/mangrove-1ds8q-7t.ttf) format("truetype");font-weight:400;font-style:normal;font-display:swap}:root{--modal-overlay-bg: rgba(0, 0, 0, .75);--modal-bg: #1E1E1E;--modal-border: #2C2C2C;--modal-text-primary: #E0E0E0;--modal-text-secondary: #B0B0B0;--modal-text-muted: #888888;--modal-button-primary: #00AFFF;--modal-button-primary-hover: #0077B3;--modal-button-secondary: #3a3a3a;--modal-button-secondary-hover: #4a4a4a;--modal-button-danger: #FF4A50;--modal-button-danger-hover: #E03E44;--modal-input-bg: #2C2C2C;--modal-input-border: #444444;--modal-input-focus: #00AFFF;--modal-shadow: 0 10px 30px rgba(0, 0, 0, .5);--modal-border-radius: 12px;--modal-z-index: 10000;--modal-transition: all .3s cubic-bezier(.34, 1.56, .64, 1)}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:var(--modal-overlay-bg);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;justify-content:center;align-items:center;padding:20px;z-index:var(--modal-z-index);opacity:0;animation:modalOverlayFadeIn .3s ease-out forwards}@keyframes modalOverlayFadeIn{0%{opacity:0;-webkit-backdrop-filter:blur(0px);backdrop-filter:blur(0px)}to{opacity:1;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}}.modal-content{background:var(--modal-bg);border:1px solid var(--modal-border);border-radius:var(--modal-border-radius);box-shadow:var(--modal-shadow);width:100%;max-width:600px;max-height:90vh;display:flex;flex-direction:column;color:var(--modal-text-primary);transform:scale(.8) translateY(40px);animation:modalContentSlideIn .4s cubic-bezier(.34,1.56,.64,1) forwards;overflow:hidden}@keyframes modalContentSlideIn{0%{transform:scale(.8) translateY(40px);opacity:0}to{transform:scale(1) translateY(0);opacity:1}}.modal-header{display:flex;justify-content:space-between;align-items:center;padding:20px 24px 16px;border-bottom:1px solid var(--modal-border);background:linear-gradient(135deg,#252525,#1e1e1e)}.modal-header h2,.modal-header h3{margin:0;font-size:1.4rem;font-weight:600;color:var(--modal-text-primary)}.modal-close,.modal-close-button{background:none;border:none;color:var(--modal-text-muted);font-size:24px;font-weight:700;cursor:pointer;padding:4px;border-radius:6px;transition:all .2s ease;display:flex;align-items:center;justify-content:center;width:32px;height:32px}.modal-close:hover,.modal-close-button:hover{background:var(--modal-button-secondary);color:var(--modal-text-primary);transform:scale(1.1)}.modal-body{flex:1;padding:20px 24px;overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--modal-input-border) transparent}.modal-body::-webkit-scrollbar{width:8px}.modal-body::-webkit-scrollbar-track{background:transparent}.modal-body::-webkit-scrollbar-thumb{background:var(--modal-input-border);border-radius:4px}.modal-body::-webkit-scrollbar-thumb:hover{background:var(--modal-text-muted)}.modal-footer,.modal-actions{display:flex;justify-content:flex-end;gap:12px;padding:16px 24px 20px;border-top:1px solid var(--modal-border);background:var(--modal-bg)}.modal-body label{display:block;margin-bottom:8px;font-weight:600;font-size:.95rem;color:var(--modal-text-primary)}.modal-body input[type=text],.modal-body input[type=email],.modal-body input[type=password],.modal-body textarea,.modal-body select{width:100%;padding:12px 16px;margin-bottom:16px;background:var(--modal-input-bg);border:1px solid var(--modal-input-border);border-radius:8px;color:var(--modal-text-primary);font-size:1rem;box-sizing:border-box;transition:border-color .2s ease,box-shadow .2s ease}.modal-body input:focus,.modal-body textarea:focus,.modal-body select:focus{outline:none;border-color:var(--modal-input-focus);box-shadow:0 0 0 3px #00afff1a}.modal-body input::placeholder,.modal-body textarea::placeholder{color:var(--modal-text-muted)}.modal-button,.modal-actions button{padding:12px 20px;border:none;border-radius:8px;font-size:.95rem;font-weight:600;cursor:pointer;transition:all .2s ease;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-width:100px}.modal-button-primary,.modal-actions button:first-of-type{background:var(--modal-button-primary);color:#fff}.modal-button-primary:hover,.modal-actions button:first-of-type:hover:not(:disabled){background:var(--modal-button-primary-hover);transform:translateY(-1px);box-shadow:0 4px 12px #00afff4d}.modal-button-secondary,.modal-actions button:last-of-type{background:var(--modal-button-secondary);color:var(--modal-text-primary);border:1px solid var(--modal-input-border)}.modal-button-secondary:hover,.modal-actions button:last-of-type:hover:not(:disabled){background:var(--modal-button-secondary-hover);border-color:var(--modal-text-muted);transform:translateY(-1px)}.modal-button-danger{background:var(--modal-button-danger);color:#fff}.modal-button-danger:hover:not(:disabled){background:var(--modal-button-danger-hover);transform:translateY(-1px);box-shadow:0 4px 12px #ff4a504d}.modal-button:disabled,.modal-actions button:disabled{opacity:.5;cursor:not-allowed;transform:none!important;box-shadow:none!important}.modal-error,.error-message{background:#ff4a501a;border:1px solid var(--modal-button-danger);color:var(--modal-button-danger);padding:12px 16px;border-radius:8px;margin:16px 0;font-size:.9rem}.modal-success{background:#fda20a1a;border:1px solid #FDA20A;color:#fda20a;padding:12px 16px;border-radius:8px;margin:16px 0;font-size:.9rem}@media (max-width: 768px){.modal-overlay{padding:16px}.modal-content{max-width:100%;border-radius:12px}.modal-header{padding:16px 20px 12px}.modal-header h2,.modal-header h3{font-size:1.2rem}.modal-body{padding:16px 20px}.modal-footer,.modal-actions{padding:12px 20px 16px;flex-direction:column-reverse}.modal-button,.modal-actions button{width:100%;justify-content:center}}@media (max-width: 480px){.modal-overlay{padding:12px}.modal-header{padding:12px 16px 8px}.modal-body{padding:12px 16px}.modal-footer,.modal-actions{padding:8px 16px 12px}.modal-button,.modal-actions button{padding:10px 16px;font-size:.9rem}}.save-session-modal{max-width:550px}.subscription-modal{max-width:700px}.profile-modal{max-width:600px}.folder-tree-container{border:1px solid var(--modal-input-border);background:var(--modal-input-bg);border-radius:8px;max-height:60vh;overflow-y:auto;padding:12px;margin-bottom:16px}.tree-node{padding:8px 12px;cursor:pointer;display:flex;align-items:center;-webkit-user-select:none;user-select:none;border-radius:6px;font-size:.95rem;color:var(--modal-text-primary);transition:background-color .2s ease}.tree-node:hover{background-color:var(--modal-button-secondary)}.tree-node.selected{background-color:var(--modal-button-primary);color:#fff}.tree-node .toggle-arrow{display:inline-block;width:16px;text-align:center;font-size:.8rem;color:var(--modal-text-muted);margin-right:8px}.tree-node .node-name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex-grow:1}.icon-folder:before{content:"📁";margin-right:8px}.icon-file:before{content:"📄";margin-right:8px}:root{--primary-color: #000000;--secondary-color: #111111;--accent-color: #40C8FF;--text-primary: #ffffff;--text-secondary: #cccccc;--text-muted: #888888;--white: #ffffff;--black: #000000;--gray-light: #1a1a1a;--gray-medium: #333333}html,body{margin:0;padding-top:0;min-height:100%;background:#000;color:#e0e0e0;font-family:Roboto,Segoe UI,Arial,sans-serif;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior-y:none;overscroll-behavior-x:none;overscroll-behavior:none;touch-action:pan-x pinch-zoom}body:has(#trainer-bg){background:transparent!important}body:has(#trainer-bg) .App{background:transparent!important}body:has(#user-sequencer-bg){background:transparent!important}body:has(#user-sequencer-bg) .App{background:transparent!important}body:has(#user-profile-bg){background:transparent!important}body:has(#user-profile-bg) .App{background:transparent!important}@media (display-mode: standalone){html,body{overscroll-behavior:none!important;overscroll-behavior-y:none!important;overscroll-behavior-x:none!important;touch-action:pan-x pinch-zoom!important}*{overscroll-behavior:none!important}}#modal-root{position:fixed;z-index:9999;top:0;left:0;right:0;bottom:0;pointer-events:none}#modal-root>*{pointer-events:auto}.App{display:flex;flex-direction:column;min-height:100vh;width:100%;background:#000;box-sizing:border-box;position:relative;z-index:1}.App-main{flex-grow:1;overflow-y:auto}.main-content{max-width:1000px;margin:0 auto;width:100%;border:1px solid #2C2C2C}.App-header{margin-bottom:20px;text-align:center;color:#fff}.instruments-section{margin-bottom:20px;padding:15px;background-color:#1e1e1e;border-radius:8px;border:1px solid #2C2C2C}.sequencer-container{padding:15px;background-color:#1e1e1e;border-radius:8px;overflow-x:auto;border:1px solid #2C2C2C;margin-bottom:20px}.cover-container{display:flex;justify-content:center;align-items:center;margin-bottom:20px;padding:15px;background-color:#1e1e1e;border-radius:8px;border:1px solid #2C2C2C}.cover-image{max-height:200px;max-width:100%;object-fit:contain;border-radius:4px}.player-container{margin-bottom:20px;padding:15px;background-color:#1e1e1e;border-radius:8px;position:relative;z-index:5;border:1px solid #2C2C2C}.btn-secondary{background:#404040!important;color:#fff!important;border:none!important;padding:6px 12px!important;border-radius:8px!important;font-size:.9rem!important;font-weight:600!important;cursor:pointer!important;transition:all .3s ease!important;text-transform:uppercase!important;letter-spacing:.5px!important;font-family:monospace!important;box-shadow:inset 2px 2px #fff3,inset -2px -2px #0003,0 4px 8px #0003!important}.btn-secondary:hover{box-shadow:inset 2px 2px #ffffff4d,inset -2px -2px #0000004d,0 6px 12px #0000004d!important}.btn-secondary:active{transform:translateY(0)!important;box-shadow:inset 2px 2px #0000004d,inset -2px -2px #fff3,0 2px 4px #0003!important}.btn-secondary:disabled{opacity:.5!important;cursor:not-allowed!important}@media (max-width: 768px){.cover-image{max-height:150px}.sequencer-container,.instruments-section,.cover-container,.player-container{padding:10px}}@font-face{font-family:PressStart2P-Local;src:url(/assets/PressStart2P-Regular-DogiNJoF.ttf) format("truetype");font-weight:400;font-style:normal;font-display:swap}