@font-face{font-family:AtomicMarker;src:url(/fonts/AtomicMarker.woff2) format("woff2"),url(/fonts/AtomicMarker.woff) format("woff");font-weight:400;font-style:normal;font-display:swap}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--color-background: #1a1a1a;--color-surface: #2d2d2d;--color-surface-hover: #333333;--color-primary-light: #5fb6df;--color-primary-dark: #1f8ae2;--color-secondary: #98d1ff;--color-secondary-dark: #00a7bd;--color-text-primary: #e0e0e0;--color-text-secondary: #b0b0b0;--font-main: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;--font-title: "AtomicMarker", sans-serif;--shadow-card-hover: 0 10px 20px rgba(0, 0, 0, .3);--shadow-button-hover: 0 6px 12px rgba(0, 0, 0, .2);--shadow-title: 0 0 10px rgba(79, 195, 247, .5);--border-radius-main: 10px;--border-radius-button: 25px}html{scroll-behavior:smooth;overflow-y:scroll}body{font-family:var(--font-main);background-color:var(--color-background);color:var(--color-text-primary);line-height:1.6;overflow-x:hidden}.header{background-color:#17191d;color:#9ca3af;height:40px;padding:0 1rem;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #111;font-size:.75rem;z-index:20;position:relative;font-family:Inter,sans-serif}.header-left{display:flex;align-items:center}#welcome-message{color:#43b5b1}.logout-button{background:none;border:none;padding:0;color:#9ca3af;cursor:pointer;font-size:.75rem;transition:color .3s ease;display:flex;align-items:center;gap:.5rem;font-family:Inter,sans-serif}.logout-button:hover{color:#e2e8f0}.login-modal{position:fixed;top:0;left:0;width:100%;height:100%;display:flex;align-items:center;justify-content:center;z-index:1000;background:none}.login-modal:before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:url(/img/bglog.webp) no-repeat center center/cover;filter:blur(5px);opacity:.7;z-index:-1}.login-modal-content{background:linear-gradient(145deg,#505c6499,#16181a99);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:30px;padding:2rem;width:100%;max-width:400px;box-shadow:var(--shadow-card-hover);text-align:center;margin-top:-100px;border:solid 1px #ffffff79}.login-logo-wrapper{position:relative;display:flex;justify-content:center;align-items:center;width:100%;max-width:360px;margin:0 auto .1rem}.login-logo-wrapper:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;width:100%;height:100%;background:url(/img/logocolor.webp) no-repeat center center/contain;filter:blur(5px);opacity:0;z-index:0;animation:logo-shadow-fade 5.5s ease-in-out infinite alternate;pointer-events:none}.login-logo{position:relative;z-index:1;width:100%;max-width:360px;height:auto;display:block}.login-logo:before{display:none!important}@keyframes logo-shadow-fade{0%{opacity:0}50%{opacity:.5}to{opacity:0}}.login-modal-content h2{font-family:var(--font-title);font-size:2rem;color:var(--color-text-primary);margin-bottom:1.5rem;text-shadow:var(--shadow-title)}.form-group{margin-bottom:1rem;text-align:left}.form-group label{display:block;font-size:1rem;color:var(--color-text-secondary);margin-bottom:.5rem}.form-group input{width:100%;padding:.75rem;border:1px solid var(--color-text-secondary);border-radius:var(--border-radius-main);background:var(--color-background);color:var(--color-text-primary);font-size:1rem}.form-group input:focus{outline:none;border-color:var(--color-primary-light);box-shadow:0 0 5px #4fc3f74d}#login-button{width:100%;padding:.75rem;background:linear-gradient(135deg,var(--color-primary-light),var(--color-primary-dark));color:#fff;border:none;border-radius:var(--border-radius-button);font-size:1rem;cursor:pointer;transition:background .3s ease,box-shadow .3s ease}#login-button:hover{background:linear-gradient(135deg,var(--color-secondary),var(--color-secondary-dark));box-shadow:var(--shadow-button-hover)}#login-button:disabled{background:linear-gradient(135deg,#555,#666);cursor:not-allowed}.login-status{margin-top:1rem;font-size:.9rem;color:#f55;min-height:1.2rem}.login-status.success{color:#0c0}@media(max-width:768px){.login-modal-content{padding:1.5rem;max-width:90%}}@media(max-width:480px){.login-modal-content{padding:1rem;max-width:95%}.login-modal-content h2{font-size:1.5rem}.form-group input{padding:.5rem;font-size:16px}#login-button{padding:.5rem;font-size:.9rem}.header{flex-direction:column;align-items:flex-start;padding:.5rem;min-height:40px}.header-content{flex-direction:row;align-items:center;justify-content:space-between;width:100%;margin:0;gap:.3rem}#welcome-message{font-size:.8rem;margin-bottom:0}.logout-button{font-size:.8rem;padding:.3rem .7rem;margin-top:0}}.songs-loader{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:20;display:flex;flex-direction:column;align-items:center;justify-content:center;border-radius:18px;padding:48px 60px 40px;min-width:220px;min-height:180px;gap:24px;pointer-events:none}.loader-spinner{width:56px;height:56px;border:7px solid #e0e0e0;border-top:7px solid var(--color-primary-dark);border-radius:50%;animation:spin 1s linear infinite;margin-bottom:10px}.loader-text{color:var(--color-primary-light);font-size:1rem;font-weight:700;text-align:center;letter-spacing:1px;margin-top:10px}*{scrollbar-width:thin;scrollbar-color:var(--color-surface-hover) var(--color-background)}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:var(--color-background)}::-webkit-scrollbar-thumb{background-color:var(--color-surface-hover);border-radius:10px;border:2px solid var(--color-background)}::-webkit-scrollbar-thumb:hover{background-color:var(--color-primary-dark)}:root{--color-primary: #43b5b1;--color-primary-light: #52ddda;--color-primary-dark: #235759;--color-secondary: #10b981;--color-error: #ef4444;--color-text-primary: #e2e8f0;--color-text-secondary: #9ca3af;--color-background: #1e2126;--color-surface-dark: #1a1d22;--color-surface: #22262b;--color-card-bg: #262a30;--color-card-hover: #2c3138;--color-border: #374151;--radius-sm: 6px;--radius-md: 8px;--radius-lg: 16px;--shadow-card: 0 10px 30px rgba(0, 0, 0, .5);--shadow-button: 0 4px 15px rgba(67, 181, 177, .2);--shadow-button-hover: 0 6px 20px rgba(67, 181, 177, .4);--track-teal: #43b5b1;--track-orange: #f97316;--track-yellow: #f59e0b;--track-purple: #8b5cf6}body{display:flex;flex-direction:column;min-height:100vh;margin:0;padding:0;background-color:var(--color-background);color:var(--color-text-primary);font-family:Inter,sans-serif;position:relative;overflow-x:hidden}.multitrack-container{display:flex;flex-grow:1;padding:0;box-sizing:border-box;height:calc(100vh - 40px);overflow:hidden}#multitrack-list-container{width:300px;min-width:300px;background-color:var(--color-surface);border-right:1px solid #1f2328;box-shadow:4px 0 15px #0000004d;overflow-y:hidden;height:100%;position:relative;display:flex;flex-direction:column;z-index:10}.sidebar-header{padding:1.5rem 1.5rem .5rem}.sidebar-header h2{font-size:.8rem;color:var(--color-text-secondary);margin-bottom:1.5rem;text-align:center;font-weight:500;font-family:Inter,sans-serif;letter-spacing:.2em;line-height:1.4}.upload-btn{width:100%;display:flex;align-items:center;justify-content:center;gap:.5rem;padding:.6rem;background-color:var(--color-primary-dark);color:var(--color-primary);border:1px solid rgba(67,181,177,.3);border-radius:var(--radius-sm);cursor:pointer;font-weight:500;font-size:.875rem;margin-bottom:1rem;transition:background-color .2s,opacity .2s}.upload-btn:hover{opacity:.8}.search-container{position:relative;margin-bottom:1rem}.search-icon{position:absolute;left:.75rem;top:50%;transform:translateY(-50%);color:#6b7280}#song-search{width:100%;background-color:#16181b;border:1px solid var(--color-border);border-radius:var(--radius-sm);padding:.5rem .75rem .5rem 2.25rem;color:var(--color-text-primary);font-size:.875rem;outline:none;transition:border-color .2s ease;box-sizing:border-box}#song-search::placeholder{color:#6b7280}#song-search:focus{border-color:var(--color-primary)}#multitrack-list{list-style:none;padding:0 1rem 1rem;margin:0;overflow-y:auto;flex-grow:1;display:flex;flex-direction:column;gap:.5rem}#multitrack-list li{padding:.75rem 1rem;background-color:var(--color-card-bg);border-radius:var(--radius-sm);cursor:pointer;transition:background-color .2s ease,border-color .2s ease;font-size:.875rem;text-align:left;border:1px solid transparent;color:var(--color-text-secondary)}#multitrack-list li:hover{background-color:var(--color-card-hover)}#multitrack-list li.active{background-color:#273135;color:var(--color-text-primary);border-color:var(--color-primary);font-weight:400}#multitrack-player-container{flex-grow:1;padding:4rem 2rem 1.5rem;margin-left:0;display:flex;flex-direction:column;align-items:center;position:relative;overflow:hidden;background:transparent;width:auto;height:100%;min-height:0}#multitrack-player-title{font-size:2.2rem;font-family:AtomicMarker,sans-serif;font-weight:500;letter-spacing:.05em;color:var(--color-text-primary);text-transform:uppercase;margin-bottom:1rem;text-align:center;text-shadow:0 2px 4px rgba(0,0,0,.5);flex-shrink:0}#multitrack-player{display:flex;flex-direction:column;align-items:center;gap:1rem;margin-bottom:1.5rem;overflow-y:auto;flex:1;min-height:0;width:100%;padding:0 .5rem;background:none;border-radius:0;border:none;box-shadow:none}.track-card{display:flex;align-items:center;justify-content:space-between;padding:.5rem 1.25rem;background-color:var(--color-card-bg);border-radius:var(--radius-md);border:1px solid rgba(255,255,255,.05);position:relative;overflow:hidden;width:100%;max-width:768px;box-sizing:border-box;transition:background-color .2s ease;height:70px;min-height:70px;flex-shrink:0}.track-card:hover{background-color:var(--color-card-hover)}.track-waveform{position:absolute;top:0;left:0;width:calc(100% - 180px);height:100%;opacity:.08;pointer-events:none;z-index:0}.track-color-border{position:absolute;left:0;top:0;bottom:0;width:4px}.track-info{display:flex;align-items:center;gap:1.5rem;width:250px;padding-left:.75rem}.track-icon-svg{min-width:32px;display:flex;align-items:center;justify-content:center}.track-name-vu-wrapper{display:flex;flex-direction:column;justify-content:center;gap:6px}.track-title-row{display:flex;align-items:center;gap:.35rem;min-width:0}.track-name{color:#e5e7eb;font-size:.95rem;font-weight:500;letter-spacing:.025em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.track-sub-name{color:#9ca3af;font-size:.8rem;font-style:italic;margin-left:2px}.track-vu-container{display:flex;gap:3px;align-items:center}.vu-bar{width:4px;height:8px;border-radius:2px;background-color:#374151}.vu-green{background-color:#43b5b1;box-shadow:0 0 4px #43b5b166}.vu-yellow{background-color:#f59e0b;box-shadow:0 0 4px #f59e0b66}.vu-orange{background-color:#ef4444;box-shadow:0 0 4px #ef444466}.track-slider-container{width:140px;padding:0 1rem;position:relative;display:flex;align-items:center}.track-volume{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;background:transparent;outline:none;margin:0}.track-volume::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;height:16px;width:16px;border-radius:5px;background:linear-gradient(180deg,#e5e7eb,#9ca3af);box-shadow:inset 0 -1px 1px #0000004d,inset 0 1px 1px #ffffffb3,0 2px 4px #0009;cursor:pointer;margin-top:-5px;border:1px solid #4b5563;position:relative;z-index:20}.track-volume::-moz-range-thumb{height:16px;width:16px;border-radius:5px;background:linear-gradient(180deg,#e5e7eb,#9ca3af);box-shadow:inset 0 -1px 1px #0000004d,inset 0 1px 1px #ffffffb3,0 2px 4px #0009;cursor:pointer;border:1px solid #4b5563;position:relative;z-index:20}.track-volume::-webkit-slider-runnable-track{width:100%;height:6px;cursor:pointer;background:linear-gradient(to right,var(--color-primary) 0%,var(--color-primary) var(--progress, 80%),#111316 var(--progress, 80%),#111316 100%);border-radius:4px;box-shadow:inset 0 2px 4px #0009}.track-volume::-moz-range-track{width:100%;height:6px;cursor:pointer;background:linear-gradient(to right,var(--color-primary) 0%,var(--color-primary) var(--progress, 80%),#111316 var(--progress, 80%),#111316 100%);border-radius:4px;box-shadow:inset 0 2px 4px #0009}.track-actions{display:flex;align-items:center;gap:.5rem}.track-btn{font-size:.75rem;font-weight:500;padding:.375rem 0;width:70px;text-align:center;border-radius:9999px;text-transform:capitalize;cursor:pointer;transition:all .2s ease;border:1px solid var(--color-border);outline:none;display:flex;justify-content:center;align-items:center;gap:.5rem}.mute-btn{background-color:#272a30;color:#9ca3af;border-color:#374151}.mute-btn:before{content:"";display:inline-block;width:10px;height:10px;border-radius:50%;background-color:#4b5563;transition:background-color .2s ease}.mute-btn.user-muted{background-color:#2e2024;color:#e5e7eb;border-color:#5c2020}.mute-btn.user-muted:before{background-color:#ef4444;box-shadow:0 0 6px #ef444499}.solo-btn{background-color:#272a30;color:#9ca3af;border-color:#374151}.solo-btn:after{content:"";display:inline-block;width:10px;height:10px;border-radius:50%;background-color:#4b5563;transition:background-color .2s ease}.solo-btn.active{background-color:#202e24;color:#e5e7eb;border-color:#205c31}.solo-btn.active:after{background-color:#22c55e;box-shadow:0 0 6px #22c55e99}@media(max-width:992px){.track-card{flex-wrap:wrap;padding:1rem;gap:.5rem;height:auto}.track-info{width:100%;margin-bottom:.5rem}.track-vu-container{display:none}.track-slider-container{flex:1}}.bottom-control-panel{background-color:var(--color-surface-dark);border-radius:1rem;padding:1.5rem;border:1px solid var(--color-border);display:flex;flex-direction:column;align-items:center;position:relative;z-index:10;box-shadow:0 25px 50px -12px #0009;margin-top:auto;width:100%;max-width:1024px;box-sizing:border-box;overflow:hidden;flex-shrink:0}#visualizer-container{position:absolute;top:0;right:0;bottom:0;left:0;z-index:0;opacity:.15;pointer-events:none;border-radius:1rem;overflow:hidden;mix-blend-mode:screen}#visualizer-container canvas{width:100%;height:100%;display:block}.control-panel-content{width:100%;display:flex;flex-direction:column;position:relative;z-index:10}.top-reset-buttons{display:flex;gap:.75rem;margin-bottom:1.25rem;justify-content:center}.reset-action-btn{display:flex;align-items:center;gap:.5rem;background-color:#25282e;border:1px solid #4b5563;color:#d1d5db;padding:.375rem 1rem;border-radius:.375rem;font-size:.75rem;cursor:pointer;transition:background-color .2s}.reset-action-btn:svg{width:12px;height:12px}.reset-action-btn:hover{background-color:#30343a}.generate-btn-wrapper{display:flex;justify-content:center;width:100%;margin-bottom:2rem}.glow-btn{background-color:#2b686b;color:#f3f4f6;padding:.5rem 2rem;border-radius:.5rem;font-size:.875rem;font-weight:500;border:1px solid rgba(67,181,177,.3);cursor:pointer;transition:all .2s ease;box-shadow:0 0 15px #2b686b66}.glow-btn:hover{background-color:#367d80;box-shadow:0 0 25px #43b5b1cc}.glow-btn:disabled{background-color:#1f2937;color:#9ca3af;border-color:#374151;box-shadow:none;cursor:not-allowed}.timeline-row{width:100%;display:flex;align-items:center;gap:1rem;font-size:.75rem;color:#9ca3af;margin-bottom:1.5rem;padding:0 2.5rem;box-sizing:border-box}.timeline-row span[id=current-time],.timeline-row span[id=total-duration]{font-variant-numeric:tabular-nums;min-width:38px;text-align:center}.progress-bar-wrapper{position:relative;flex:1;display:flex;align-items:center;height:1rem}.progress-range-input{position:absolute;width:100%;height:100%;opacity:0;cursor:pointer;z-index:20}.progress-track-bg{position:absolute;width:100%;height:6px;background-color:#111316;border-radius:9999px;overflow:hidden;box-shadow:inset 0 2px 4px #00000080;z-index:10;pointer-events:none}.progress-fill-active{height:100%;background-color:#43b5b1}.progress-thumb-custom{position:absolute;height:12px;width:12px;background-color:#fff;border-radius:50%;box-shadow:0 1px 3px #0000004d;border:1px solid #9ca3af;z-index:10;pointer-events:none;margin-top:-1px}.master-volume-container{display:flex;align-items:center;gap:.5rem;width:8rem;margin-left:1rem}.volume-btn{background:none;border:none;color:#9ca3af;cursor:pointer;transition:color .2s;padding:0;display:flex;align-items:center}.volume-btn:hover{color:#fff}.master-volume-slider{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;height:4px;background:linear-gradient(to right,#43b5b1 0%,#43b5b1 var(--progress, 80%),#374151 var(--progress, 80%),#374151 100%);border-radius:2px;outline:none}.master-volume-slider::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:12px;height:12px;border-radius:50%;background:#9ca3af;cursor:pointer;box-shadow:0 1px 3px #00000080;transition:transform .1s}.master-volume-slider::-webkit-slider-thumb:hover{transform:scale(1.2);background:#d1d5db}.bottom-controls-row{width:100%;display:flex;align-items:center;justify-content:space-between;padding:0 2.5rem .5rem;box-sizing:border-box}.master-vu-section{display:flex;flex-direction:column;align-items:flex-start;width:16rem}.vu-label{font-size:.75rem;color:#9ca3af;margin-bottom:.5rem}.vu-meters-container{display:flex;flex-direction:column;gap:4px}.vu-meter-row{display:flex;gap:2px}.master-vu-bar{width:8px;height:12px;background-color:#374151;border-radius:1px}.master-vu-green{background-color:#10b981;box-shadow:0 0 4px #10b98166}.master-vu-yellow{background-color:#f59e0b;box-shadow:0 0 4px #f59e0b66}.master-vu-orange{background-color:#ef4444;box-shadow:0 0 4px #ef444466}.vu-labels{display:flex;justify-content:space-between;width:156px;font-size:8px;color:#6b7280;margin-top:4px}.playback-controls{display:flex;align-items:center;gap:2rem;margin:0 auto}.transport-btn{background:none;border:none;color:#9ca3af;cursor:pointer;transition:color .2s;padding:0;display:flex;justify-content:center;align-items:center}.transport-btn:hover{color:#fff}.play-btn-glow{background:linear-gradient(135deg,#1e4e50,#43b5b1);color:#fff;width:56px;height:56px;border-radius:50%;display:flex;align-items:center;justify-content:center;border:none;cursor:pointer;transition:transform .2s,box-shadow .2s;box-shadow:0 4px 15px #43b5b166}.play-btn-glow:hover{transform:scale(1.05);box-shadow:0 6px 20px #43b5b199}.play-btn-glow:disabled{background:#374151;color:#6b7280;box-shadow:none;transform:scale(1);cursor:not-allowed}.mobile-volume-container{display:none}.spacer-right{width:16rem}@media(max-width:992px){.hidden-tablet{display:none!important}}@media(max-width:768px){.hidden-mobile{display:none!important}.mobile-volume-container{display:flex;align-items:center;gap:.5rem;width:8rem;justify-content:flex-end}.timeline-row{padding:0 1rem}.bottom-controls-row{padding:0 1rem .5rem}.playback-controls{gap:1.5rem}}#progress-bar::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:18px;height:18px;border-radius:50%;background:var(--color-primary-light);cursor:pointer;margin-top:-2px;position:relative;box-shadow:0 0 10px #3b82f6b3;border:2px solid var(--color-surface-dark);z-index:2}#progress-bar::-moz-range-thumb{width:18px;height:18px;border-radius:50%;background:var(--color-primary-light);cursor:pointer;box-shadow:0 0 10px #3b82f6b3;border:2px solid var(--color-surface-dark);z-index:2}#progress-bar::-ms-thumb{width:18px;height:18px;border-radius:50%;background:var(--color-primary-light);cursor:pointer;box-shadow:0 0 10px #3b82f6b3;border:2px solid var(--color-surface-dark);z-index:2}#progress-bar::-ms-fill-lower{background:transparent;border-radius:7px}#progress-bar::-ms-fill-upper{background:transparent;border-radius:7px}#progress-bar:focus{outline:none}#progress-bar::-webkit-slider-runnable-track{background:transparent}#progress-bar::-moz-range-track{height:15px;border-radius:7px;background:transparent}#progress-bar::-ms-fill-lower,#progress-bar::-ms-fill-upper{height:15px}#main-volume-wrapper{position:relative;display:flex;align-items:center;z-index:2}#main-volume-tooltip{position:absolute;top:-32px;left:0;min-width:36px;text-align:center;font-size:.95rem;color:#fff;background:#1e1e1eeb;padding:2px 8px;border-radius:6px;pointer-events:none;opacity:0;transition:opacity .3s,left .2s;z-index:2;font-weight:600;box-shadow:0 2px 8px #00000040}#multitrack-player-loader{display:none;flex-direction:column;align-items:center;justify-content:center;position:absolute;top:40%;left:50%;transform:translate(-50%,-50%);background-color:#1f2937f2;color:var(--color-text-primary);padding:2rem 3rem;border-radius:var(--radius-lg);z-index:100;min-width:200px;box-shadow:0 0 20px #00000080;border:1px solid var(--color-primary)}#multitrack-player-loader .loader-spinner{border:4px solid rgba(59,130,246,.1);border-top:4px solid var(--color-primary-light);border-radius:50%;width:50px;height:50px;animation:spin 1s linear infinite;margin-bottom:1.5rem;margin-left:auto;margin-right:auto;display:block}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media(max-width:992px){.multitrack-container{flex-direction:column}#multitrack-list-container{width:100%;height:auto;max-height:30vh;position:static;margin-bottom:1.5rem;overflow-y:scroll}#multitrack-player-container{margin-left:0;width:100%;padding:1.5rem}#multitrack-player{max-height:50vh}.track-control{flex-wrap:wrap}.track-control label{flex:0 0 100%}.track-control input[type=range]{flex:1;min-width:100px}}@media(max-width:576px){#multitrack-player-title{font-size:1.8rem}.track-control{padding:.6rem;gap:.5rem}.track-control .mute-btn,.track-control .solo-btn{padding:.4rem .8rem;font-size:.7rem}#multitrack-controls{padding:.7rem .5rem;gap:.7rem}#multitrack-controls .progress-container{flex-direction:column;align-items:stretch;gap:.5rem;max-width:100%;width:100%;padding:0;position:relative}#progress-bar{height:18px;min-width:100%;max-width:100%}.progress-times-row{display:flex;flex-direction:row;justify-content:space-between;width:100%;margin-top:.1rem}#current-time{text-align:left;min-width:40px;font-size:.85rem}#total-duration{text-align:right;min-width:40px;font-size:.85rem}.playback-buttons-row{gap:1.2rem;margin-top:.7rem}.playpause-btn{width:44px;height:44px}.icon-btn{width:32px;height:32px}.progress-container .volume-control svg{width:18px;height:18px}.progress-container .volume-control input[type=range]{width:60px}.multitrack-container{padding:.4rem .2rem;gap:.7rem}#multitrack-player-container{padding:.7rem .3rem}#multitrack-controls .volume-control input[type=range],#main-volume{width:200px!important;min-width:200px!important;max-width:400px!important}.progress-container #current-time,.progress-container #total-duration{display:none!important}.progress-times-row-mobile{display:flex;flex-direction:row;justify-content:space-between;width:100%;margin-top:.1rem;font-size:.85rem;color:var(--color-text-primary);font-family:Roboto Mono,monospace}.progress-container .volume-control,.volume-control{display:none!important}.volume-control-mobile{display:flex!important;flex-direction:row;align-items:center;justify-content:center;gap:.5rem;margin:.7rem 0 .2rem;width:100%}.volume-control-mobile input[type=range]{width:90px!important;min-width:60px!important;max-width:120px!important}#song-search{padding:.4rem .8rem;font-size:.85rem}#visualizer-container{height:80px}}@media(min-width:577px){.progress-times-row-mobile,.volume-control-mobile{display:none!important}}.playback-buttons-volume{display:flex;align-items:center;justify-content:center;gap:2rem;width:100%;margin-top:1rem}.playback-controls{display:flex;align-items:center;gap:1rem}.volume-control{display:flex;align-items:center;gap:.5rem}.slider-wrapper{position:relative;display:flex;align-items:center;width:100%}.slider-tooltip{position:absolute;top:-32px;left:0;min-width:36px;text-align:center;font-size:.95rem;color:#fff;background:#1e1e1eeb;padding:2px 8px;border-radius:6px;pointer-events:none;opacity:0;transition:opacity .3s,left .2s;z-index:2;font-weight:600;box-shadow:0 2px 8px #00000040}.playback-buttons-row{display:flex;align-items:center;justify-content:center;gap:2.5rem;width:100%;margin-top:1.2rem}.playpause-btn{width:56px;height:56px;border-radius:50%;background:linear-gradient(135deg,#007fd1,#c600ff);display:flex;align-items:center;justify-content:center;border:none;box-shadow:var(--shadow-button);cursor:pointer;transition:box-shadow .2s,background .2s;position:relative;padding:0}.playpause-btn:disabled{background:#4b5563;cursor:not-allowed;box-shadow:none}.playpause-btn svg{display:block}.icon-btn{background:none;border:none;box-shadow:none;cursor:pointer;padding:0;display:flex;align-items:center;justify-content:center;width:40px;height:40px;transition:background .2s;z-index:5}.icon-btn svg{display:block;stroke:var(--color-primary-light)}.icon-btn:active svg,.icon-btn:focus svg{stroke:var(--color-primary)}.play-icon,.pause-icon{fill:#fff!important;stroke:#fff!important}.playpause-btn svg{fill:#fff!important;stroke:#fff!important}.dcibel-modal-overlay{display:none;position:fixed;z-index:2000;left:0;top:0;width:100%;height:100%;overflow:auto;background-color:#000000b3;align-items:center;justify-content:center}.dcibel-modal-content{background-color:var(--color-surface-dark, #282c34);color:var(--color-text-primary, #f1f1f1);padding:25px 30px;border:1px solid var(--color-border, #444851);border-radius:var(--radius-lg, 12px);width:90%;max-width:480px;box-shadow:0 8px 25px #00000080;text-align:center;position:relative;animation:dcibelModalAppear .3s ease-out}@keyframes dcibelModalAppear{0%{opacity:0;transform:scale(.9) translateY(-20px)}to{opacity:1;transform:scale(1) translateY(0)}}.dcibel-modal-close{color:var(--color-text-secondary, #aaa);position:absolute;top:12px;right:20px;font-size:30px;font-weight:700;transition:color .2s ease}.dcibel-modal-close:hover,.dcibel-modal-close:focus{color:var(--color-primary-light, #60a5fa);text-decoration:none;cursor:pointer}.dcibel-modal-icon{margin-bottom:15px}.dcibel-modal-icon svg{color:var(--color-secondary, #10b981);width:50px;height:50px}.dcibel-modal-content h3{font-size:1.6rem;color:var(--color-text-primary, #fff);margin-top:0;margin-bottom:10px;font-weight:500}.dcibel-modal-content p{font-size:1rem;line-height:1.6;margin-bottom:25px;color:var(--color-text-secondary, #ccc)}.dcibel-modal-button{background:linear-gradient(135deg,var(--color-primary),var(--color-primary-dark));color:#fff;padding:12px 25px;border:none;border-radius:var(--radius-md, 8px);cursor:pointer;font-size:1rem;font-weight:500;transition:all .2s ease;box-shadow:var(--shadow-button)}.dcibel-modal-button:hover{background:linear-gradient(135deg,var(--color-primary-dark),var(--color-primary));box-shadow:var(--shadow-button-hover);transform:translateY(-1px)}.track-reset-buttons{display:flex;gap:.5rem;justify-content:center;margin-bottom:.75rem}.reset-btn{background:#ffffff14;color:var(--color-text-secondary);border:1px solid var(--color-border);padding:.4rem 1rem;border-radius:var(--radius-md);font-size:.8rem;cursor:pointer;transition:all .2s ease;font-weight:500}.reset-btn:hover{background:#ffffff26;color:var(--color-text-primary);border-color:var(--color-primary-light)}.reset-btn:active{transform:scale(.96)}.welcome-screen{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:300px;padding:3rem 2rem;text-align:center;animation:welcomeFadeIn .6s ease}@keyframes welcomeFadeIn{0%{opacity:0;transform:translateY(15px)}to{opacity:1;transform:translateY(0)}}.welcome-icon{color:var(--color-primary-light);opacity:.5;margin-bottom:1.5rem;animation:welcomePulse 3s ease-in-out infinite}@keyframes welcomePulse{0%,to{opacity:.4;transform:scale(1)}50%{opacity:.7;transform:scale(1.05)}}.welcome-text{font-size:1.1rem;color:var(--color-text-secondary);font-weight:400;margin:0 0 2rem;line-height:1.6;max-width:500px}.welcome-title{font-size:2rem;color:var(--color-text-primary);margin:0 0 .5rem;font-weight:700;letter-spacing:-.5px}.welcome-features{list-style:none;padding:0;margin:0 0 2rem;display:flex;flex-direction:column;gap:1rem;text-align:left;max-width:600px;width:100%}.welcome-features li{background:#ffffff08;border:1px solid rgba(255,255,255,.05);padding:1rem 1.25rem;border-radius:var(--radius-md);color:var(--color-text-primary);font-size:.95rem;line-height:1.5;display:flex;align-items:center;transition:transform .2s,background .2s}.welcome-features li:hover{background:#ffffff0d;transform:translateY(-2px);border-color:#ffffff1a}.feature-icon{font-size:1.4rem;margin-right:1rem;display:inline-flex;align-items:center;justify-content:center;min-width:32px}.welcome-hint{font-size:.9rem;color:var(--color-text-secondary);opacity:.6;margin-top:.5rem}#multitrack-player-loader{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);z-index:999;width:90%;max-width:460px;padding:2rem 2.5rem;background:linear-gradient(145deg,#505c64b3,#16181abf);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.15);border-radius:24px;box-shadow:0 0 0 100vmax #000000bf;display:flex;flex-direction:column;gap:1rem;overflow:hidden}.track-loader-title{font-size:1.1rem;font-weight:600;color:var(--color-primary-light);text-align:center}.track-loader-list{display:flex;flex-direction:column;gap:.5rem;width:100%;font-size:.85rem}.track-loader-item{display:flex;align-items:center;gap:.6rem;padding:.4rem .6rem;border-radius:6px;background:#ffffff0a;color:var(--color-text-secondary);transition:all .3s ease}.track-loader-item.downloading{color:var(--color-text-primary);background:#3b82f614}.track-loader-item.decoding{color:#fbbf24;background:#fbbf2414}.track-loader-item.loaded{color:var(--color-secondary)}.track-loader-item.error{color:var(--color-error)}.track-loader-item .status-icon{width:18px;text-align:center;flex-shrink:0;font-size:.9rem}.track-loader-item .track-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.track-loader-item .track-item-percent{font-size:.75rem;font-weight:600;color:var(--color-primary-light);min-width:36px;text-align:right}.track-item-bar{width:50px;height:4px;background:#ffffff1a;border-radius:2px;overflow:hidden;flex-shrink:0}.track-item-bar-fill{height:100%;width:0%;background:var(--color-primary);border-radius:2px;transition:width .15s ease}.track-loader-item.loaded .track-item-bar-fill{background:var(--color-secondary);width:100%!important}.track-loader-item.error .track-item-bar-fill{background:var(--color-error);width:100%!important}.track-loader-item.downloading .status-icon:after{content:"";display:inline-block;width:12px;height:12px;border:2px solid var(--color-primary-light);border-top-color:transparent;border-radius:50%;animation:spin .8s linear infinite}.track-loader-item.decoding .status-icon:after{content:"";display:inline-block;width:12px;height:12px;border:2px solid #fbbf24;border-top-color:transparent;border-radius:50%;animation:spin .6s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.track-loader-progress{display:flex;align-items:center;gap:.75rem;width:100%}.track-loader-bar-bg{flex:1;height:6px;background:#ffffff1a;border-radius:3px;overflow:hidden}.track-loader-bar-fill{height:100%;width:0%;background:linear-gradient(90deg,var(--color-primary),var(--color-secondary));border-radius:3px;transition:width .2s ease}#track-loader-percent{font-size:.85rem;color:var(--color-primary-light);font-weight:600;min-width:36px;text-align:right}.master-gain-container{display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-end;width:16rem}.gain-slider-wrapper{display:flex;align-items:center;justify-content:flex-end;gap:.5rem;width:100%}.gain-val{font-size:.75rem;color:#f59e0b;min-width:30px;text-align:right;font-variant-numeric:tabular-nums}.gain-slider{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:120px;height:4px;background:#374151;border-radius:2px;outline:none}.gain-slider::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:12px;height:12px;border-radius:50%;background:#f59e0b;cursor:pointer;box-shadow:0 1px 3px #00000080;transition:transform .1s,background .1s}.gain-slider::-webkit-slider-thumb:hover{transform:scale(1.2);background:#fbbf24}#upload-multitrack-modal{background-color:#000000bf!important;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.upload-modal{position:fixed;top:0;left:0;width:100%;height:100%;display:flex;align-items:center;justify-content:center;z-index:1000;background:#000000bf;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.upload-modal-content{background:linear-gradient(145deg,#3c4146f2,#1e2024fa);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:16px;padding:2rem;width:100%;max-width:500px;text-align:left;box-shadow:0 20px 60px #00000080;border:1px solid rgba(255,255,255,.1);color:var(--color-text-primary)}.daw-toolbar{position:absolute;top:0;left:0;width:100%;height:38px;display:flex;background-color:#1a1e23;padding:0 1rem;margin:0;z-index:50;gap:0;justify-content:flex-start;border-bottom:1px solid #2e3640}.toolbar-menu-wrapper{position:relative;display:flex}.toolbar-menu-btn{background:transparent;border:none;border-radius:0;color:#c9d1d9;padding:0 1rem;font-size:.85rem;font-weight:500;cursor:pointer;transition:none;height:100%;font-family:inherit;-webkit-backdrop-filter:none;backdrop-filter:none;display:flex;align-items:center}.toolbar-menu-btn:hover{background:#2e3640;color:#fff;border-color:transparent;box-shadow:none}.toolbar-dropdown{position:absolute;top:100%;left:0;background-color:#1a1e23;border:1px solid #2e3640;border-top:none;border-radius:0 0 4px 4px;min-width:220px;display:none;flex-direction:column;padding:.5rem 0;margin-top:0;box-shadow:0 12px 24px #000000b3;z-index:1000}.toolbar-menu-wrapper:hover .toolbar-dropdown{display:flex}.dropdown-item{background:transparent;border:none;color:#d1d5db;padding:.55rem 1rem;text-align:left;font-size:.85rem;cursor:pointer;display:flex;justify-content:space-between;align-items:center;width:100%;transition:none}.dropdown-item:hover{background-color:#43b5b1;color:#fff}.dropdown-divider{height:1px;background-color:#2e3640;margin:.35rem 0}.shortcut{color:#9ca3af;font-size:.75rem}.dropdown-item:hover .shortcut{color:#fff}.coming-soon{margin-left:.35rem;color:#8b96a8;font-size:.7rem;font-style:italic;white-space:nowrap}.generate-item{color:#fff!important;font-weight:600}.master-actions-card{background:transparent!important;border:none!important;box-shadow:none!important;padding-top:0!important;padding-bottom:0!important;margin-top:0!important}.master-actions-card:hover{transform:none!important;border-color:transparent!important}.upload-drop-zone{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.5rem;padding:1.5rem 1rem;border:2px dashed #4b5563;border-radius:10px;background-color:#16181b99;cursor:pointer;transition:border-color .25s ease,background-color .25s ease,box-shadow .25s ease;color:#6b7280;text-align:center}.upload-drop-zone:hover{border-color:var(--color-primary);background-color:#43b5b10d}.upload-drop-zone.drag-over{border-color:var(--color-primary);background-color:#43b5b11a;box-shadow:inset 0 0 20px #43b5b114,0 0 12px #43b5b126}.upload-drop-zone svg{color:#6b7280;transition:color .25s ease,transform .25s ease}.upload-drop-zone:hover svg,.upload-drop-zone.drag-over svg{color:var(--color-primary);transform:translateY(-2px)}.drop-zone-text{font-size:.9rem;font-weight:500;color:#9ca3af;pointer-events:none}.drop-zone-hint{font-size:.75rem;color:#6b7280;pointer-events:none}.upload-file-list{max-height:120px;overflow-y:auto;font-size:.8rem;color:#888;margin-top:8px}.upload-file-list-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:4px}.upload-file-count{font-size:.8rem;color:var(--color-primary);font-weight:500}.upload-clear-btn{background:none;border:none;color:#ef4444;font-size:.75rem;cursor:pointer;padding:2px 6px;border-radius:4px;transition:background-color .2s ease}.upload-clear-btn:hover{background-color:#ef444426}.upload-file-item{padding:3px 0;border-bottom:1px solid rgba(75,85,99,.3);color:#9ca3af}.upload-file-item:last-child{border-bottom:none}