body { margin:0; font-family: 'Segoe UI', sans-serif; background: linear-gradient(135deg,#4facfe,#00f2fe); color:#fff; display:flex; flex-direction:column; height:100vh; }
header { padding:20px; font-size:2em; font-weight:bold; text-align:center; background: rgba(0,0,0,0.2); backdrop-filter: blur(5px); }
main { flex:1; display:flex; overflow:hidden; }
#playlist { flex:2; overflow-y:auto; padding:15px; }
.track { background: rgba(0,0,0,0.3); margin:10px 0; padding:10px; border-radius:12px; cursor:pointer; transition:0.3s; }
.track:hover { background: rgba(0,0,0,0.5); }
.track.active { background: #ff4d6d; }
#audioPlayerContainer { flex:1; display:flex; flex-direction:column; justify-content:center; align-items:center; padding:20px; }
button { padding:10px 20px; margin:5px; border:none; border-radius:10px; background:#fff;color:#000; cursor:pointer; font-weight:bold; transition:0.3s; }
button:hover { background:#f0f0f0; }
input[type=file] { display:none; }
label { padding:10px 20px; background:#fff; color:#000; border-radius:10px; cursor:pointer; font-weight:bold; margin-bottom:20px; display:inline-block; }