#bcdock{position:fixed;left:12px;right:12px;bottom:12px;z-index:99990;display:none;align-items:center;gap:14px;max-width:760px;margin:0 auto;padding:10px 12px 10px 10px;border-radius:18px;background:rgba(10,10,18,.92);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border:1px solid rgba(155,107,255,.35);box-shadow:0 18px 50px rgba(0,0,0,.55),0 0 40px rgba(155,107,255,.18);color:#ece9f5;font-family:"Inter",system-ui,-apple-system,"Segoe UI",sans-serif;box-sizing:border-box;animation:bcdIn .35s cubic-bezier(.2,.8,.2,1)}
#bcdock *{box-sizing:border-box}
#bcdock.on{display:flex}
@keyframes bcdIn{from{opacity:0;transform:translateY(20px)}}
#bcdock .bcd-cov{width:48px;height:48px;flex:none;border-radius:10px;background:linear-gradient(135deg,#9b6bff,#ff3b5c) center/cover no-repeat;position:relative;overflow:hidden}
#bcdock.playing .bcd-cov::after{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 40%,rgba(255,255,255,.22) 50%,transparent 60%);animation:bcdSheen 2.6s ease-in-out infinite}
@keyframes bcdSheen{0%{transform:translateX(-100%)}100%{transform:translateX(100%)}}
#bcdock .bcd-mid{flex:1;min-width:0}
#bcdock .bcd-t{display:flex;align-items:baseline;gap:10px;min-width:0;margin-bottom:7px}
#bcdock .bcd-t b{font-family:"Bebas Neue",Impact,"Arial Narrow",sans-serif;font-weight:400;font-size:1.35rem;letter-spacing:.05em;line-height:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#bcdock .bcd-t span{font-family:"JetBrains Mono",ui-monospace,Menlo,monospace;font-size:.62rem;letter-spacing:.18em;text-transform:uppercase;color:#7d7a8c;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#bcdock .bcd-bar{height:5px;border-radius:5px;background:rgba(255,255,255,.12);cursor:pointer;overflow:hidden}
#bcdock .bcd-bar i{display:block;height:100%;width:0;background:linear-gradient(90deg,#9b6bff,#ff3b5c);border-radius:5px}
#bcdock .bcd-tm{font-family:"JetBrains Mono",ui-monospace,Menlo,monospace;font-size:.7rem;color:#7d7a8c;white-space:nowrap}
#bcdock button{flex:none;display:inline-flex;align-items:center;justify-content:center;padding:0;margin:0;border:0;border-radius:50%;cursor:pointer;line-height:1;font-family:inherit}
#bcdock .bcd-pp{width:44px;height:44px;background:#ece9f5;color:#050507;font-size:.95rem;transition:box-shadow .25s,transform .25s}
#bcdock .bcd-pp:hover{box-shadow:0 0 26px rgba(155,107,255,.7);transform:scale(1.05)}
#bcdock .bcd-x{width:30px;height:30px;background:transparent;color:#7d7a8c;font-size:.9rem}
#bcdock .bcd-x:hover{color:#ece9f5;background:rgba(255,255,255,.08)}
html.bcdock-on body{padding-bottom:84px}
#bcdock-load{position:fixed;left:0;top:0;height:3px;width:0;z-index:99991;pointer-events:none;background:linear-gradient(90deg,#9b6bff,#ff3b5c);box-shadow:0 0 12px rgba(155,107,255,.8);opacity:0}
#bcdock-load.go{opacity:1;width:70%;transition:width 4s cubic-bezier(.1,.7,.2,1)}
#bcdock-load.done{opacity:0;width:100%;transition:width .2s,opacity .4s .15s}
@media(max-width:600px){
#bcdock{left:8px;right:8px;bottom:calc(8px + env(safe-area-inset-bottom,0px));gap:10px;padding:8px 8px 8px 8px}
#bcdock .bcd-cov{width:42px;height:42px}
#bcdock .bcd-tm{display:none}
#bcdock .bcd-t{display:block}
#bcdock .bcd-t span{display:block;margin-top:3px}
}
@media(prefers-reduced-motion:reduce){#bcdock,#bcdock *{animation:none!important;transition:none!important}}