@import "https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap";:root{--bg-color:#121212;--panel-bg:#ffffff08;--panel-border:#ffffff14;--text-primary:#fff;--text-secondary:#a0a0a0;--accent-purple:#b026ff;--accent-purple-glow:#b026ff80;--accent-cyan:#00f3ff;--accent-cyan-glow:#00f3ff80;--mute-color:#ff3b30;--solo-color:#fc0}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--bg-color);color:var(--text-primary);background-image:radial-gradient(circle at 50% 0,#b026ff26,#0000 50%),radial-gradient(circle at 50% 100%,#00f3ff1a,#0000 50%);justify-content:center;align-items:center;min-height:100vh;font-family:Inter,sans-serif;display:flex}#root{width:100%}.glass-panel{background:var(--panel-bg);-webkit-backdrop-filter:blur(16px);border:1px solid var(--panel-border);border-radius:16px}.app-container{flex-direction:column;gap:2rem;max-width:800px;margin:0 auto;padding:2rem;display:flex}.header{text-align:center;margin-bottom:1rem}.header h1{background:linear-gradient(90deg, var(--accent-purple), var(--accent-cyan));-webkit-text-fill-color:transparent;-webkit-background-clip:text;margin-bottom:.5rem;font-size:2.5rem;font-weight:700}.header p{color:var(--text-secondary);font-size:1.1rem}.upload-zone{border:2px dashed var(--panel-border);cursor:pointer;background:var(--panel-bg);border-radius:16px;flex-direction:column;justify-content:center;align-items:center;padding:3rem 2rem;transition:all .3s;display:flex}.upload-zone:hover,.upload-zone.drag-active{border-color:var(--accent-purple);box-shadow:0 0 20px var(--accent-purple-glow);background:#b026ff0d}.upload-icon{color:var(--accent-cyan);margin-bottom:1rem}.upload-text{margin-bottom:.5rem;font-size:1.2rem;font-weight:500}.upload-subtext{color:var(--text-secondary);font-size:.9rem}.upload-section{flex-direction:column;gap:1.5rem;display:flex}.quality-selector{border-radius:16px;padding:1.5rem}.quality-selector h3{color:var(--text-primary);margin-top:0;margin-bottom:1rem;font-size:1.2rem}.quality-options{gap:1rem;display:flex}.quality-option{border:1px solid var(--panel-border);cursor:pointer;background:#0003;border-radius:12px;flex:1;align-items:flex-start;gap:1rem;padding:1rem;transition:all .2s;display:flex}.quality-option:hover{background:#b026ff0d;border-color:#b026ff80}.quality-option.selected{border-color:var(--accent-purple);background:#b026ff1a;box-shadow:0 0 15px #b026ff26}.quality-option input[type=radio]{accent-color:var(--accent-purple);width:18px;height:18px;margin-top:4px}.option-content{flex-direction:column;gap:.25rem;display:flex}.option-title{color:var(--text-primary);font-size:1.05rem;font-weight:600}.option-desc{color:var(--text-secondary);font-size:.85rem}.track-list{flex-direction:column;gap:1rem;display:flex}.track-item{justify-content:space-between;align-items:center;padding:1rem 1.5rem;transition:transform .2s,box-shadow .2s;display:flex}.track-item:hover{transform:translateY(-2px);box-shadow:0 4px 12px #0003}.track-info{align-items:center;gap:1rem;width:25%;display:flex}.track-icon{color:var(--text-secondary)}.track-name{font-size:1.1rem;font-weight:600}.track-waveform{flex-grow:1;align-items:center;gap:2px;height:40px;padding:0 2rem;transition:all .3s;display:flex}.track-info{align-items:center;gap:1rem;width:25%;transition:all .3s;display:flex}.inaudible{opacity:.3;filter:blur(1.5px)grayscale(80%)}.wave-bar{background-color:var(--accent-purple);opacity:.5;border-radius:2px;width:4px;transition:height .1s,opacity .3s}.track-item:hover .wave-bar{opacity:.8;box-shadow:0 0 8px var(--accent-purple-glow)}.track-controls{gap:.5rem;display:flex}.control-btn{border:1px solid var(--panel-border);color:var(--text-primary);cursor:pointer;background:#ffffff0d;border-radius:8px;justify-content:center;align-items:center;width:40px;height:40px;font-size:.9rem;font-weight:600;transition:all .2s;display:flex}.control-btn:hover{background:#ffffff1a}.control-btn.active.mute{border-color:var(--mute-color);color:var(--mute-color);background:#ff3b3026;box-shadow:0 0 10px #ff3b304d}.control-btn.active.solo{border-color:var(--solo-color);color:var(--solo-color);background:#ffcc0026;box-shadow:0 0 10px #ffcc004d}.loading-container{flex-direction:column;justify-content:center;align-items:center;gap:1.5rem;padding:3rem;display:flex}.progress-bar-container{background:#ffffff1a;border-radius:6px;width:100%;max-width:400px;height:12px;margin-top:1rem;overflow:hidden;box-shadow:inset 0 1px 3px #00000080}.progress-bar-fill{background:linear-gradient(90deg, var(--accent-purple), var(--accent-cyan));height:100%;box-shadow:0 0 10px var(--accent-cyan);transition:width .3s}.progress-text{color:var(--accent-cyan);margin-top:.5rem;font-size:1.5rem;font-weight:700}.player-controls{z-index:10;align-items:center;gap:1.5rem;margin-top:1rem;padding:1.5rem 2rem;display:flex;position:sticky;bottom:2rem;box-shadow:0 10px 30px #00000080}.play-btn{background:linear-gradient(135deg, var(--accent-purple), var(--accent-cyan));color:#fff;cursor:pointer;border:none;border-radius:50px;min-width:120px;padding:.8rem 2rem;font-size:1rem;font-weight:700;transition:transform .2s,box-shadow .2s}.play-btn:hover:not(:disabled){box-shadow:0 5px 15px var(--accent-purple-glow);transform:translateY(-2px)}.play-btn:disabled{opacity:.5;cursor:not-allowed;background:var(--panel-border)}.time-display{color:var(--text-secondary);min-width:45px;font-family:monospace;font-size:1.1rem}.seek-bar{appearance:none;background:var(--panel-border);cursor:pointer;border-radius:3px;outline:none;flex-grow:1;height:6px}.seek-bar::-webkit-slider-thumb{appearance:none;background:var(--accent-cyan);cursor:pointer;border-radius:50%;width:16px;height:16px;transition:transform .1s;box-shadow:0 0 10px #00d4ff80}.seek-bar::-webkit-slider-thumb:hover{transform:scale(1.2)}.seek-bar:disabled{opacity:.5;cursor:not-allowed}.download-btn{background:linear-gradient(135deg, var(--accent-purple), var(--accent-cyan));color:#fff;cursor:pointer;border:none;border-radius:50px;margin-left:auto;padding:.8rem 1.5rem;font-size:1rem;font-weight:700;transition:transform .2s,box-shadow .2s}.download-btn:hover:not(:disabled){box-shadow:0 5px 15px var(--accent-purple-glow);transform:translateY(-2px)}.download-btn:disabled{opacity:.5;cursor:not-allowed;background:var(--panel-border)}.new-track-btn{border:1px solid var(--text-secondary);color:var(--text-secondary);cursor:pointer;background:0 0;border-radius:50px;padding:.8rem 1.5rem;font-size:.9rem;font-weight:600;transition:all .2s}.new-track-btn:hover{border-color:var(--text-primary);color:var(--text-primary);background:#ffffff0d}