:root{

    --srp-primary:#d62027;
    --srp-bg:#0b0b0b;
    --srp-text:#ffffff;
    --srp-text-soft:#999999;

}

#srp-player{

    position:fixed;
    bottom:0;
    left:0;

    width:100%;
    height:78px;

    background:linear-gradient(to right,#070707,#111111);

    border-top:3px solid var(--srp-primary);

    z-index:999999;

    display:flex;
    align-items:center;
    justify-content:space-between;

    padding:0 25px;

    box-sizing:border-box;

    box-shadow:0 -5px 20px rgba(0,0,0,0.4);

    font-family:Arial,sans-serif;

}

.srp-left{

    display:flex;
    align-items:center;
    gap:15px;

}

.srp-logo{

    width:52px;
    height:52px;

    border-radius:8px;

    overflow:hidden;

    background:var(--srp-primary);

    flex-shrink:0;

}

.srp-logo img{

    width:100%;
    height:100%;
    object-fit:cover;

}

.srp-radio-name{

    color:var(--srp-text);

    font-size:15px;
    font-weight:bold;

}

.srp-status{

    color:var(--srp-primary);

    font-size:11px;

    margin-top:4px;

}

.srp-center{

    display:flex;
    align-items:center;
    gap:20px;

}

#srp-play{

    width:55px;
    height:55px;

    border:none;

    border-radius:50%;

    background:var(--srp-primary);

    color:#fff;

    cursor:pointer;

    font-size:18px;

}

.srp-track{

    color:var(--srp-text-soft);

    font-size:14px;

}

.srp-right{

    display:flex;
    align-items:center;
    gap:20px;

}

.srp-volume-wrap{

    width:120px;

}

#srp-volume{

    width:100%;

}

.srp-close{

    color:#fff;

    cursor:pointer;

}

@media(max-width:768px){

    #srp-player{

        height:65px;

        padding:0 12px;

    }

    .srp-track,
    .srp-volume-wrap{

        display:none;

    }

    .srp-logo{

        width:42px;
        height:42px;

    }

    #srp-play{

        width:46px;
        height:46px;

    }

}