body {
    margin:0;
    font-family: system-ui, -apple-system, BlinkMacSystemFont;
    background:#121212;
    color:#fff;
}

.app {
    max-width:480px;
    margin:auto;
    padding:15px;
}

header {
    text-align:center;
    font-size:18px;
    margin-bottom:15px;
}

.player {
    text-align:center;
}

.player button {
    background:none;
    border:none;
    color:#fff;
    font-size:22px;
    margin:0 5px;
}

.progress-container {
    background:#333;
    height:6px;
    border-radius:3px;
    margin:10px 0;
}

.progress {
    height:100%;
    width:0%;
    background:#1db954;
}

.time {
    display:flex;
    justify-content:space-between;
    font-size:12px;
}

.upload {
    display:flex;
    gap:5px;
    margin:15px 0;
}

.upload button {
    background:#1db954;
    border:none;
    color:#000;
    padding:6px 10px;
    border-radius:4px;
}

#playlist {
    list-style:none;
    padding:0;
}

#playlist li {
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding:8px 0;
    border-bottom:1px solid #333;
}

.track {
    flex:1;
    cursor:pointer;
}

.actions {
    display:flex;
    gap:5px;
}

.actions button {
    background:none;
    border:none;
    color:#aaa;
    font-size:16px;
}