:root{--oa-player-dock-height:0px}
.oa-player{--oa-accent:#7c3aed;position:relative;border-radius:24px;padding:24px;margin:24px 0;box-shadow:0 18px 48px rgba(15,23,42,.16);overflow:hidden}
.oa-player *{box-sizing:border-box}
.oa-theme-dark{background:linear-gradient(180deg,#0f172a 0%,#111827 100%);color:#fff}
.oa-theme-light{background:linear-gradient(180deg,#fff 0%,#f8fafc 100%);color:#0f172a;border:1px solid rgba(15,23,42,.08)}
.oa-player::before{content:"";position:absolute;inset:0 0 auto auto;width:220px;height:220px;background:radial-gradient(circle,var(--oa-accent) 0%,rgba(124,58,237,0) 72%);opacity:.18;pointer-events:none}
.oa-player-main{display:grid;grid-template-columns:220px minmax(0,1fr);gap:24px;align-items:center}
.oa-cover-wrap{width:220px;height:220px;border-radius:22px;overflow:hidden;background:rgba(148,163,184,.12);box-shadow:0 14px 34px rgba(2,6,23,.2)}
.oa-cover{width:100%;height:100%;object-fit:cover;display:block}
.oa-chip{display:inline-flex;align-items:center;gap:8px;padding:7px 12px;border-radius:999px;background:color-mix(in srgb,var(--oa-accent) 18%, transparent);color:var(--oa-accent);font-size:12px;font-weight:700;margin-bottom:10px}
.oa-theme-dark .oa-chip{background:rgba(255,255,255,.08)}
.oa-title{font-size:34px;line-height:1.15;margin:0 0 10px;word-break:break-word}
.oa-subtitle{font-size:15px;display:flex;flex-wrap:wrap;gap:6px;opacity:.82}
.oa-controls{display:flex;gap:12px;align-items:center;margin:20px 0;flex-wrap:wrap}
.oa-btn{border:0;background:rgba(148,163,184,.16);color:inherit;border-radius:999px;padding:12px 16px;cursor:pointer;font-size:15px;min-width:48px;transition:.2s transform,.2s background}
.oa-btn:hover{transform:translateY(-1px);background:rgba(148,163,184,.24)}
.oa-btn-primary{background:var(--oa-accent);color:#fff;font-weight:700;padding-inline:18px}
.oa-progress-row{display:grid;grid-template-columns:56px 1fr 56px;gap:12px;align-items:center}
.oa-progress,.oa-floating-range{accent-color:var(--oa-accent)}
.oa-body{display:grid;grid-template-columns:1fr;gap:16px;margin-top:22px}
.oa-lyrics-panel,.oa-playlist-panel{background:rgba(255,255,255,.05);border:1px solid rgba(148,163,184,.16);border-radius:18px;padding:16px;min-width:0}
.oa-theme-light .oa-lyrics-panel,.oa-theme-light .oa-playlist-panel{background:#fff;border-color:rgba(15,23,42,.08)}
.oa-panel-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}
.oa-lyrics-title,.oa-playlist-title{font-size:16px;font-weight:800}
.oa-lyrics{height:300px;overflow:auto;padding-right:8px;scroll-behavior:smooth}
.oa-lyric-line{padding:10px 0;color:#94a3b8;transition:all .22s ease;word-break:break-word}
.oa-theme-light .oa-lyric-line{color:#64748b}
.oa-lyric-line.is-active{color:var(--oa-accent);font-size:17px;font-weight:800}
.oa-lyric-line.is-empty{opacity:.8}
.oa-playlist{list-style:none;margin:0;padding:0;max-height:360px;overflow:auto;display:flex;flex-direction:column;gap:8px}
.oa-playlist-item{display:grid;grid-template-columns:48px minmax(0,1fr);gap:12px;align-items:center;padding:12px 14px;border-radius:14px;cursor:pointer;color:inherit;background:transparent;transition:.2s transform,.2s background,.2s border-color;border:1px solid transparent}
.oa-playlist-item:hover{transform:translateY(-1px);background:rgba(148,163,184,.08)}
.oa-playlist-item.is-active{background:color-mix(in srgb,var(--oa-accent) 14%, transparent);border-color:color-mix(in srgb,var(--oa-accent) 40%, transparent)}
.oa-theme-dark .oa-playlist-item.is-active{background:rgba(255,255,255,.08)}
.oa-playlist-index{font-weight:800;opacity:.55;font-variant-numeric:tabular-nums}
.oa-playlist-main{display:flex;flex-direction:column;gap:4px;min-width:0}
.oa-playlist-name{font-weight:700;line-height:1.5;word-break:break-word}
.oa-playlist-meta{display:flex;flex-wrap:wrap;gap:6px;align-items:center;font-size:13px;opacity:.76}
.oa-playlist-dot{opacity:.5}
.oa-floating-player{--oa-accent:#7c3aed;position:fixed;left:0;right:0;bottom:0;z-index:99999;display:none;background:rgba(10,14,24,.96);backdrop-filter:blur(14px);color:#fff;border-top:1px solid rgba(255,255,255,.08);box-shadow:0 -10px 28px rgba(0,0,0,.24);width:100%;border-radius:0;max-width:none}
.oa-floating-player.oa-light{background:rgba(255,255,255,.98);color:#0f172a;border-top-color:rgba(15,23,42,.08)}
.oa-has-player-dock{padding-bottom:calc(var(--oa-player-dock-height) + 8px)!important}
.oa-floating-inner{display:grid;grid-template-columns:minmax(220px,1.2fr) auto minmax(240px,1fr);align-items:center;gap:20px;padding:14px 22px;max-width:1440px;margin:0 auto}
.oa-floating-left{display:flex;align-items:center;gap:14px;min-width:0}
.oa-floating-cover{width:54px;height:54px;border-radius:12px;object-fit:cover;background:rgba(148,163,184,.18);flex:0 0 auto;box-shadow:0 8px 18px rgba(0,0,0,.2)}
.oa-floating-meta{min-width:0}
.oa-floating-title{font-size:18px;font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.25}
.oa-floating-subtitle{font-size:13px;opacity:.76;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:4px}
.oa-floating-center{display:flex;justify-content:center}
.oa-floating-controls{display:flex;align-items:center;gap:12px;flex:0 0 auto}
.oa-floating-controls button{border:0;background:transparent;color:inherit;border-radius:999px;padding:8px 10px;cursor:pointer;font-size:22px;line-height:1;transition:transform .2s ease,opacity .2s ease}
.oa-floating-controls button:hover{transform:scale(1.06);opacity:.9}
.oa-floating-controls .oa-fplay{background:rgba(255,255,255,.1);width:52px;height:52px;display:inline-flex;align-items:center;justify-content:center;font-size:24px}
.oa-floating-player.oa-light .oa-floating-controls .oa-fplay{background:rgba(15,23,42,.08)}
.oa-floating-right{display:flex;justify-content:flex-end;min-width:0}
.oa-floating-progress{display:flex;align-items:center;gap:10px;min-width:220px;width:min(100%,420px)}
.oa-floating-progress input{width:100%}
.oa-floating-range{height:4px}
.oa-floating-time{font-size:12px;opacity:.72;white-space:nowrap;font-variant-numeric:tabular-nums}
@media (max-width:900px){
  .oa-player{padding:18px;border-radius:20px}
  .oa-player-main{grid-template-columns:1fr}
  .oa-cover-wrap{width:100%;height:auto;aspect-ratio:1/1;max-width:280px}
  .oa-title{font-size:28px}
  .oa-body{gap:14px}
  .oa-lyrics{height:260px}
}
@media (max-width:640px){
  .oa-player{padding:16px}
  .oa-cover-wrap{max-width:none}
  .oa-title{font-size:24px}
  .oa-controls{gap:10px}
  .oa-btn{padding:11px 14px;font-size:14px}
  .oa-progress-row{grid-template-columns:48px 1fr 48px;gap:8px}
  .oa-playlist-item{grid-template-columns:40px minmax(0,1fr);padding:12px}
  .oa-playlist-meta{font-size:12px}
  .oa-floating-inner{grid-template-columns:1fr;gap:10px;padding:12px 14px}
  .oa-floating-left{gap:10px}
  .oa-floating-cover{width:48px;height:48px}
  .oa-floating-title{font-size:15px}
  .oa-floating-subtitle{font-size:12px}
  .oa-floating-center,.oa-floating-right{justify-content:flex-start}
  .oa-floating-progress{width:100%;min-width:0}
  .oa-floating-controls{margin-left:auto}
}