.brb-player{
    width:100%;
    max-width:1180px;
    margin:30px auto;
    display:grid;
    grid-template-columns:310px minmax(0,1fr);
    min-height:650px;
    overflow:hidden;
    border:1px solid rgba(220,150,80,.35);
    border-radius:4px;
    background:rgba(18,18,18,.88);
    color:#f2c08a;
    box-shadow:0 10px 40px rgba(0,0,0,.45);
}
.brb-sidebar{background:rgba(22,22,22,.92);color:#f2c08a;border-right:1px solid rgba(220,150,80,.22)}
.brb-sidebar-title{padding:20px 22px;font-size:21px;font-weight:700;color:#f2c08a;border-bottom:1px solid rgba(255,255,255,.10)}
.brb-song-list{max-height:650px;overflow-y:auto}
.brb-song{width:100%;display:flex;align-items:center;gap:12px;border:0;border-bottom:1px solid rgba(255,255,255,.07);background:transparent;color:#f2c08a;padding:14px 18px;text-align:left;cursor:pointer;font-size:15px;transition:background .15s,color .15s}
.brb-song:hover{background:rgba(220,150,80,.10);color:#f2c08a}
.brb-song.is-active{background:rgba(220,150,80,.20);color:#f2c08a;font-weight:700;box-shadow:inset 4px 0 0 #d99552}
.brb-number{min-width:28px;color:#f2c08a}.brb-song.is-active .brb-number{color:#f2c08a}
.brb-song-title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.brb-main{padding:34px 46px 48px;min-width:0;background:rgba(10,10,10,.45)}
.brb-now-playing{text-transform:uppercase;font-size:12px;letter-spacing:.14em;color:#f2c08a;margin-bottom:7px}
.brb-current-title{margin:0 0 18px;font-size:32px;line-height:1.2;color:#f2c08a}

.brb-lyrics{white-space:normal;font-size:18px;line-height:1.72;max-width:none;color:#f2c08a}
.brb-lyrics em{color:#f2c08a}
.brb-empty{max-width:1180px;margin:30px auto;padding:25px;border:1px solid rgba(220,150,80,.35);background:rgba(18,18,18,.88);color:#f2c08a}
@media(max-width:900px){.brb-player{grid-template-columns:250px minmax(0,1fr)}.brb-main{padding:28px 30px 38px}}
@media(max-width:700px){.brb-player{grid-template-columns:1fr;min-height:0;margin:15px 0}.brb-sidebar{border-right:0;border-bottom:1px solid rgba(220,150,80,.22)}.brb-song-list{max-height:260px}.brb-main{padding:24px 20px 32px}.brb-current-title{font-size:26px}.brb-lyrics{font-size:16px}}

.brb-player-controls{
    display:flex;
    align-items:center;
    gap:12px;
    width:100%;
    margin:0 0 30px;
    padding:12px 15px;
    box-sizing:border-box;
    background:rgba(242,192,138,.09);
    border:1px solid rgba(242,192,138,.28);
    border-radius:6px;
}
.brb-audio-element{display:none}
.brb-control{
    flex:0 0 auto;
    width:40px;
    height:40px;
    border:1px solid rgba(242,192,138,.45);
    border-radius:50%;
    background:rgba(242,192,138,.10);
    color:#f2c08a;
    cursor:pointer;
    font-size:16px;
    line-height:1;
    display:flex;
    align-items:center;
    justify-content:center;
    transition:all .15s ease;
}
.brb-control:hover{
    background:#f2c08a;
    color:#15110d;
    border-color:#f2c08a;
}
.brb-play{width:46px;height:46px;font-size:18px}
.brb-pause-icon,.brb-muted-icon{display:none}
.brb-time{
    flex:0 0 auto;
    min-width:42px;
    color:#f2c08a;
    font-size:13px;
    font-variant-numeric:tabular-nums;
    text-align:center;
}
.brb-progress,.brb-volume{
    appearance:none;
    -webkit-appearance:none;
    height:5px;
    border:0;
    border-radius:10px;
    background:rgba(242,192,138,.22);
    accent-color:#f2c08a;
    cursor:pointer;
}
.brb-progress{
    flex:1 1 auto;
    min-width:80px;
}
.brb-volume{
    flex:0 0 90px;
}
.brb-progress::-webkit-slider-thumb,
.brb-volume::-webkit-slider-thumb{
    -webkit-appearance:none;
    appearance:none;
    width:14px;
    height:14px;
    border-radius:50%;
    background:#f2c08a;
    border:2px solid #15110d;
    box-shadow:0 0 0 1px #f2c08a;
}
.brb-progress::-moz-range-thumb,
.brb-volume::-moz-range-thumb{
    width:12px;
    height:12px;
    border-radius:50%;
    background:#f2c08a;
    border:2px solid #15110d;
}
.brb-main:fullscreen{
    box-sizing:border-box;
    width:100vw;
    height:100vh;
    overflow-y:auto;
    padding:40px 7vw 60px;
    background:#111;
    color:#f2c08a;
}
.brb-main:fullscreen .brb-player-controls{
    margin-bottom:34px;
}
.brb-main:fullscreen .brb-lyrics{
    max-width:1100px;
    margin:0 auto;
}
.brb-main:fullscreen .brb-current-title,
.brb-main:fullscreen .brb-now-playing{
    max-width:1100px;
    margin-left:auto;
    margin-right:auto;
}
@media(max-width:700px){
    .brb-player-controls{
        flex-wrap:wrap;
        gap:9px;
    }
    .brb-progress{
        order:5;
        flex-basis:100%;
    }
    .brb-volume{
        flex:1 1 80px;
    }
}
