/* OBG STREAM V3.21.58 — canonical fullscreen player layer
   This file intentionally owns the fullscreen player layout. It loads after app.css
   so legacy player styling cannot visually override the final player presentation. */

html:has(#obgBigPlayer.open),
body:has(#obgBigPlayer.open){
  overflow:hidden!important;
  overscroll-behavior:none!important;
}

html body #obgBigPlayer.obg-big-player{
  position:fixed!important;
  inset:0!important;
  width:100vw!important;
  height:100dvh!important;
  min-height:100dvh!important;
  max-height:100dvh!important;
  margin:0!important;
  padding:0!important;
  overflow:hidden!important;
  overscroll-behavior:none!important;
  z-index:2147483000!important;
  background:#000!important;
  color:#fff!important;
  opacity:1!important;
  filter:none!important;
  -webkit-filter:none!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
  transform:translateY(105%)!important;
  transition:transform .24s ease!important;
  pointer-events:none!important;
}
html body #obgBigPlayer.obg-big-player.open{
  transform:none!important;
  visibility:visible!important;
  pointer-events:auto!important;
}

/* Fixed artwork only. No dim, blur, gradient or opacity overlay. */
html body #obgBigPlayer.obg-big-player::before{
  content:""!important;
  display:block!important;
  position:absolute!important;
  inset:0!important;
  z-index:0!important;
  pointer-events:none!important;
  background:#000 url('assets/obg-player-fixed-layout.png') center center/100% 100% no-repeat!important;
  opacity:1!important;
  filter:none!important;
  -webkit-filter:none!important;
}
html body #obgBigPlayer.obg-big-player::after{content:none!important;display:none!important}

html body #obgBigPlayer .obg-big-top,
html body #obgBigPlayer .obg-big-body{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  max-height:none!important;
  margin:0!important;
  padding:0!important;
  background:transparent!important;
  background-image:none!important;
  box-shadow:none!important;
  filter:none!important;
  -webkit-filter:none!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}
html body #obgBigPlayer .obg-big-top{z-index:30!important;pointer-events:none!important}
html body #obgBigPlayer .obg-big-body{z-index:10!important;overflow:hidden!important}
html body #obgBigPlayer .obg-big-top::before,
html body #obgBigPlayer .obg-big-top::after,
html body #obgBigPlayer .obg-big-body::before,
html body #obgBigPlayer .obg-big-body::after{content:none!important;display:none!important}

/* Branding is baked into the fixed artwork: never duplicate it in live UI. */
html body #obgBigPlayer .obg-big-top>div{display:none!important}

/* Back + three-dot controls only. */
html body #obgBigPlayer #obgBigClose,
html body #obgBigPlayer #obgBigMore{
  position:absolute!important;
  top:max(18px,calc(env(safe-area-inset-top) + 8px))!important;
  width:46px!important;
  height:46px!important;
  min-width:46px!important;
  min-height:46px!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  color:#fff!important;
  box-shadow:none!important;
  text-shadow:none!important;
  opacity:.96!important;
  display:grid!important;
  place-items:center!important;
  line-height:1!important;
  pointer-events:auto!important;
  z-index:40!important;
}
html body #obgBigPlayer #obgBigClose{left:7.7%!important;font-size:28px!important}
html body #obgBigPlayer #obgBigMore{right:7.7%!important;font-size:17px!important;letter-spacing:2px!important}

/* Cover slot calibrated to the gold frame of the current fixed artwork. */
html body #obgBigPlayer .obg-big-cover-wrap{
  position:absolute!important;
  left:12.45%!important;
  top:24.47%!important;
  width:75.10%!important;
  height:40.62%!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:4.7vw!important;
  background:#050505!important;
  box-shadow:none!important;
  overflow:hidden!important;
  z-index:12!important;
}
html body #obgBigPlayer .obg-big-cover{
  display:block!important;
  width:100%!important;
  height:100%!important;
  margin:0!important;
  padding:0!important;
  object-fit:cover!important;
  object-position:center center!important;
  border:0!important;
  border-radius:4.7vw!important;
  box-shadow:none!important;
  opacity:1!important;
  filter:none!important;
  -webkit-filter:none!important;
}

/* Discreet icon-only quick actions above the cover. Visible icon can be small,
   while each button keeps a comfortable 44px touch target. */
html body #obgBigPlayer .obg-big-actions{
  position:absolute!important;
  left:23.5%!important;
  right:23.5%!important;
  top:15.05%!important;
  width:auto!important;
  height:46px!important;
  max-width:none!important;
  margin:0!important;
  padding:0!important;
  display:grid!important;
  grid-template-columns:repeat(3,1fr)!important;
  align-items:center!important;
  justify-items:center!important;
  gap:0!important;
  z-index:18!important;
}
html body #obgBigPlayer .obg-big-actions button{
  width:44px!important;
  height:44px!important;
  min-width:44px!important;
  min-height:44px!important;
  max-width:44px!important;
  max-height:44px!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  color:#f2cf58!important;
  box-shadow:none!important;
  text-shadow:none!important;
  display:grid!important;
  place-items:center!important;
  font-size:18px!important;
  line-height:1!important;
  opacity:.94!important;
  overflow:visible!important;
  pointer-events:auto!important;
}
html body #obgBigPlayer .obg-big-actions button span,
html body #obgBigPlayer .obg-big-actions button small{display:none!important}
html body #obgBigPlayer #obgBigLike{justify-self:start!important;font-size:17px!important}
html body #obgBigPlayer #obgBigAddPlaylist{justify-self:center!important;font-size:17px!important}
html body #obgBigPlayer #obgBigShare{justify-self:end!important;font-size:17px!important}
html body #obgBigPlayer #obgBigLike.active{color:#fff36d!important;opacity:1!important}

/* Track metadata: one stacked block, no independent drifting elements. */
html body #obgBigPlayer .obg-big-info{
  position:absolute!important;
  left:7.5%!important;
  right:7.5%!important;
  top:66.0%!important;
  margin:0!important;
  padding:0!important;
  text-align:center!important;
  z-index:16!important;
}
html body #obgBigPlayer .obg-big-title{
  margin:0!important;
  padding:0!important;
  color:#fff!important;
  font-size:clamp(29px,7vw,46px)!important;
  line-height:1.04!important;
  font-weight:900!important;
  letter-spacing:-.02em!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  text-shadow:0 1px 2px rgba(0,0,0,.22)!important;
}
html body #obgBigPlayer .obg-big-artist{
  display:block!important;
  width:100%!important;
  max-width:100%!important;
  margin:.55dvh auto 0!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
  color:#e3e1e4!important;
  font-size:clamp(18px,4.45vw,28px)!important;
  line-height:1.06!important;
  font-weight:400!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
html body #obgBigPlayer .obg-big-mastered{
  position:static!important;
  transform:none!important;
  display:inline-block!important;
  margin:5px auto 0!important;
  padding:3px 8px!important;
  border:1px solid rgba(241,204,84,.78)!important;
  border-radius:7px!important;
  background:rgba(8,8,8,.92)!important;
  color:#efce61!important;
  font-size:7.5px!important;
  line-height:1.2!important;
  letter-spacing:.08em!important;
  opacity:1!important;
}
html body #obgBigPlayer .obg-big-mastered[hidden]{display:none!important}

/* Seek: thin visible rail + larger touch element retained by the native range. */
html body #obgBigPlayer .obg-big-progress{
  position:absolute!important;
  left:7.0%!important;
  right:7.0%!important;
  top:77.35%!important;
  width:auto!important;
  max-width:none!important;
  margin:0!important;
  padding:0!important;
  z-index:16!important;
}
html body #obgBigPlayer .obg-big-progress input[type="range"]{
  width:100%!important;
  height:18px!important;
  margin:0!important;
  padding:0!important;
  appearance:none!important;
  -webkit-appearance:none!important;
  background:linear-gradient(to right,#ecc64c 0%,#ecc64c var(--obg-seek,0%),rgba(255,255,255,.78) var(--obg-seek,0%),rgba(255,255,255,.78) 100%) center/100% 3px no-repeat!important;
  accent-color:#ecc64c!important;
  cursor:pointer!important;
}
html body #obgBigPlayer .obg-big-progress input[type="range"]::-webkit-slider-runnable-track{height:3px!important;background:transparent!important;border:0!important}
html body #obgBigPlayer .obg-big-progress input[type="range"]::-webkit-slider-thumb{
  appearance:none!important;
  -webkit-appearance:none!important;
  width:14px!important;
  height:14px!important;
  margin-top:-5.5px!important;
  border:2px solid #efca52!important;
  border-radius:50%!important;
  background:#0a0a0a!important;
  box-shadow:none!important;
}
html body #obgBigPlayer .obg-big-progress input[type="range"]::-moz-range-track{height:3px!important;background:rgba(255,255,255,.78)!important;border:0!important}
html body #obgBigPlayer .obg-big-progress input[type="range"]::-moz-range-progress{height:3px!important;background:#ecc64c!important;border:0!important}
html body #obgBigPlayer .obg-big-progress input[type="range"]::-moz-range-thumb{width:14px!important;height:14px!important;border:2px solid #efca52!important;border-radius:50%!important;background:#0a0a0a!important;box-shadow:none!important}
html body #obgBigPlayer .obg-big-progress>div,
html body #obgBigPlayer .obg-big-times{
  display:flex!important;
  justify-content:space-between!important;
  margin-top:1px!important;
  color:#f2f0f3!important;
  font-size:11px!important;
  line-height:1!important;
  opacity:1!important;
}

/* Transport row. Play is dominant, not oversized. */
html body #obgBigPlayer .obg-big-controls{
  position:absolute!important;
  left:13.5%!important;
  right:13.5%!important;
  top:82.15%!important;
  width:auto!important;
  max-width:none!important;
  margin:0!important;
  padding:0!important;
  display:grid!important;
  grid-template-columns:32px 46px 56px 46px 32px!important;
  align-items:center!important;
  justify-content:center!important;
  gap:10px!important;
  z-index:16!important;
}
html body #obgBigPlayer .obg-big-controls button{
  margin:0!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
  color:#f0cc54!important;
  box-shadow:none!important;
  text-shadow:none!important;
  display:grid!important;
  place-items:center!important;
  opacity:1!important;
}
html body #obgBigPlayer #obgBigShuffle,
html body #obgBigPlayer #obgBigRepeat{
  width:32px!important;
  height:32px!important;
  min-width:32px!important;
  min-height:32px!important;
  font-size:15px!important;
  opacity:.78!important;
}
html body #obgBigPlayer #obgBigPrev,
html body #obgBigPlayer #obgBigNext{
  width:46px!important;
  height:46px!important;
  min-width:46px!important;
  min-height:46px!important;
  font-size:25px!important;
}
html body #obgBigPlayer #obgBigPlay.obg-big-play{
  width:56px!important;
  height:56px!important;
  min-width:56px!important;
  min-height:56px!important;
  border:1.5px solid #efcb55!important;
  border-radius:50%!important;
  background:#0a0a0a!important;
  color:#efcb55!important;
  font-size:25px!important;
  box-shadow:0 0 0 1px rgba(239,203,85,.28),0 0 10px rgba(233,181,49,.18)!important;
  opacity:1!important;
}
html body #obgBigPlayer #obgBigShuffle.active,
html body #obgBigPlayer #obgBigRepeat.active{color:#fff36d!important;opacity:1!important}

/* Keep library hidden in fullscreen. The existing 3-dot menu stays functional. */
html body #obgBigPlayer .obg-big-library{display:none!important;visibility:hidden!important;pointer-events:none!important}
html body #obgBigPlayer #obgBigQueuePanel{z-index:50!important}

/* Compact-height fallback only changes geometry; no alternate styling. */
@media(max-width:760px) and (max-height:780px){
  html body #obgBigPlayer .obg-big-cover-wrap{top:24.1%!important;height:39.9%!important}
  html body #obgBigPlayer .obg-big-actions{top:14.85%!important}
  html body #obgBigPlayer .obg-big-info{top:65.0%!important}
  html body #obgBigPlayer .obg-big-progress{top:76.35%!important}
  html body #obgBigPlayer .obg-big-controls{top:81.0%!important;grid-template-columns:30px 44px 54px 44px 30px!important;gap:8px!important}
  html body #obgBigPlayer #obgBigPlay.obg-big-play{width:54px!important;height:54px!important;min-width:54px!important;min-height:54px!important;font-size:24px!important}
}


/* V3.21.59 — center artist name exactly under the title in the fullscreen player. */
html body #obgBigPlayer .obg-big-info{
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
}
html body #obgBigPlayer .obg-big-title{
  width:100%!important;
  text-align:center!important;
}
html body #obgBigPlayer .obg-big-artist{
  width:100%!important;
  text-align:center!important;
  justify-content:center!important;
  align-self:center!important;
}


/* V3.21.60 — mini polish only: slightly smaller title and slimmer progress bar/knob. */
html body #obgBigPlayer .obg-big-title{
  font-size:clamp(27px,6.5vw,43px)!important;
}
html body #obgBigPlayer .obg-big-progress input[type="range"]{
  background:linear-gradient(to right,#ecc64c 0%,#ecc64c var(--obg-seek,0%),rgba(255,255,255,.78) var(--obg-seek,0%),rgba(255,255,255,.78) 100%) center/100% 2px no-repeat!important;
}
html body #obgBigPlayer .obg-big-progress input[type="range"]::-webkit-slider-runnable-track{height:2px!important}
html body #obgBigPlayer .obg-big-progress input[type="range"]::-webkit-slider-thumb{
  width:12px!important;
  height:12px!important;
  margin-top:-5px!important;
}
html body #obgBigPlayer .obg-big-progress input[type="range"]::-moz-range-track{height:2px!important}
html body #obgBigPlayer .obg-big-progress input[type="range"]::-moz-range-progress{height:2px!important}
html body #obgBigPlayer .obg-big-progress input[type="range"]::-moz-range-thumb{
  width:12px!important;
  height:12px!important;
}


/* V3.21.61 — optional paid/artist player themes. OBG Gold remains the unchanged default. */
html body #obgBigPlayer[data-player-theme="dark_black"]::before{
  background:radial-gradient(circle at 50% 12%,#272727 0,#0d0d0f 35%,#020202 78%)!important;
}
html body #obgBigPlayer[data-player-theme="dark_black"] .obg-big-top>div,
html body #obgBigPlayer[data-player-theme="minimal_gold"] .obg-big-top>div{
  display:flex!important;position:absolute!important;left:50%!important;top:max(26px,calc(env(safe-area-inset-top) + 16px))!important;transform:translateX(-50%)!important;flex-direction:column!important;align-items:center!important;text-align:center!important;white-space:nowrap!important;
}
html body #obgBigPlayer[data-player-theme="dark_black"] .obg-big-top>div::before,
html body #obgBigPlayer[data-player-theme="minimal_gold"] .obg-big-top>div::before{content:'♛';color:#e8c957;font-size:22px;line-height:1;margin-bottom:5px}
html body #obgBigPlayer[data-player-theme="dark_black"] .obg-big-top>div small,
html body #obgBigPlayer[data-player-theme="minimal_gold"] .obg-big-top>div small{order:2;color:#d6d6d8;font-size:11px;letter-spacing:.22em}
html body #obgBigPlayer[data-player-theme="dark_black"] .obg-big-top>div strong,
html body #obgBigPlayer[data-player-theme="minimal_gold"] .obg-big-top>div strong{order:1;color:#e8c957;font-size:17px;margin-bottom:5px}
html body #obgBigPlayer[data-player-theme="dark_black"] .obg-big-cover-wrap{border:1px solid rgba(232,201,87,.55)!important;box-shadow:0 0 24px rgba(232,201,87,.14)!important;background:#050505!important}
html body #obgBigPlayer[data-player-theme="dark_black"] .obg-big-actions{top:20.5%!important}
html body #obgBigPlayer[data-player-theme="dark_black"] .obg-big-cover-wrap{top:25.2%!important;height:39.8%!important}
html body #obgBigPlayer[data-player-theme="minimal_gold"]::before{background:linear-gradient(180deg,#050505 0,#171006 48%,#020202 100%)!important}
html body #obgBigPlayer[data-player-theme="minimal_gold"] .obg-big-cover-wrap{border:1px solid #d8af3a!important;box-shadow:none!important;background:#080808!important;border-radius:20px!important}
html body #obgBigPlayer[data-player-theme="minimal_gold"] .obg-big-cover{border-radius:18px!important}
html body #obgBigPlayer[data-player-theme="minimal_gold"] .obg-big-actions{top:20.8%!important}
html body #obgBigPlayer[data-player-theme="minimal_gold"] #obgBigPlay{border-width:1px!important;box-shadow:none!important}
html body #obgBigPlayer[data-player-theme="minimal_gold"] .obg-big-title{font-weight:800!important}


/* V3.21.72 — balance title + artist as one centered metadata block. */
html body #obgBigPlayer .obg-big-info{
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:flex-start!important;
  text-align:center!important;
}
html body #obgBigPlayer .obg-big-title{
  width:100%!important;
  text-align:center!important;
  font-size:clamp(25px,5.9vw,40px)!important;
  line-height:1.03!important;
  margin:0!important;
}
html body #obgBigPlayer .obg-big-artist{
  width:100%!important;
  text-align:center!important;
  align-self:center!important;
  margin:.35dvh auto 0!important;
  font-size:clamp(17px,4vw,25px)!important;
  line-height:1.04!important;
}


/* V3.21.73 — long song titles always fit inside the fullscreen player. */
html body #obgBigPlayer .obg-big-title{
  width:100%!important;
  max-width:100%!important;
  box-sizing:border-box!important;
  padding:0 4px!important;
  text-align:center!important;
  white-space:normal!important;
  overflow:visible!important;
  text-overflow:clip!important;
  overflow-wrap:anywhere!important;
  word-break:normal!important;
  font-size:clamp(24px,5.8vw,39px)!important;
  line-height:1.02!important;
}
html body #obgBigPlayer .obg-big-title.obg-title-long{
  font-size:clamp(22px,5.15vw,35px)!important;
}
html body #obgBigPlayer .obg-big-title.obg-title-xlong{
  font-size:clamp(20px,4.7vw,32px)!important;
}


/* V3.21.80 — keep long fullscreen titles centered and inside the viewport on one line. */
html body #obgBigPlayer .obg-big-title{
  max-width:92vw!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  overflow-wrap:normal!important;
  word-break:normal!important;
}
html body #obgBigPlayer .obg-big-title.obg-title-long{
  font-size:clamp(21px,4.7vw,31px)!important;
}
html body #obgBigPlayer .obg-big-title.obg-title-xlong{
  font-size:clamp(18px,4.05vw,27px)!important;
}


/* V3.21.83 — subtler, more luxurious fullscreen title treatment. */
html body #obgBigPlayer .obg-big-title{
  font-size:clamp(22px,5.1vw,34px)!important;
  line-height:1.02!important;
  font-weight:800!important;
  letter-spacing:-.01em!important;
  max-width:90vw!important;
  margin:0 auto!important;
  text-align:center!important;
}
html body #obgBigPlayer .obg-big-title.obg-title-long{
  font-size:clamp(19px,4.35vw,29px)!important;
}
html body #obgBigPlayer .obg-big-title.obg-title-xlong{
  font-size:clamp(17px,3.85vw,25px)!important;
}
html body #obgBigPlayer .obg-big-artist{
  font-size:clamp(16px,3.7vw,23px)!important;
  font-weight:400!important;
  letter-spacing:.01em!important;
  color:#d4d1d4!important;
  margin:.45dvh auto 0!important;
}


/* V3.21.86 — user-uploaded layout becomes the fixed fullscreen player background. */
html body #obgBigPlayer[data-player-theme^="custom_"]::before{
  background:#000 var(--obg-custom-player-layout) center top/100% 100% no-repeat!important;
  filter:none!important;
  -webkit-filter:none!important;
  opacity:1!important;
}
html body #obgBigPlayer[data-player-theme^="custom_"] .obg-big-top>div{
  display:none!important;
}


/* V3.21.89 — optional fullscreen player with no background layout image. */
html body #obgBigPlayer[data-player-theme="no_layout"]{
  background:#000!important;
  background-image:none!important;
}
html body #obgBigPlayer[data-player-theme="no_layout"]::before{
  content:none!important;
  display:none!important;
  background:none!important;
  background-image:none!important;
  opacity:0!important;
}
html body #obgBigPlayer[data-player-theme="no_layout"] .obg-big-top{
  background:transparent!important;
  background-image:none!important;
}
.theme-no_layout{background:#000!important}
.theme-no_layout:before{border-color:rgba(255,255,255,.28)!important}
.theme-no_layout i,.theme-no_layout b,.theme-no_layout em{background:rgba(255,255,255,.75)!important}


/* V3.21.92 — LOCKED PLAYER GEOMETRY.
   Theme/layout selection may change background and colors only.
   Cover, metadata and controls remain in the canonical OBG positions and sizes. */
html body #obgBigPlayer{
  --obg-player-accent:#efcb55;
  --obg-player-title-color:#ffffff;
  --obg-player-artist-color:#d4d1d4;
  --obg-player-control-color:#efcb55;
  --obg-player-title-size:clamp(22px,5.1vw,34px);
  --obg-player-title-size-long:clamp(19px,4.35vw,29px);
  --obg-player-title-size-xlong:clamp(17px,3.85vw,25px);
}
html body #obgBigPlayer .obg-big-top>div{display:none!important}

/* Fixed cover geometry */
html body #obgBigPlayer .obg-big-cover-wrap{
  left:12.45%!important;top:24.47%!important;width:75.10%!important;height:40.62%!important;
  border:0!important;border-radius:4.7vw!important;background:#050505!important;box-shadow:none!important;
}
html body #obgBigPlayer .obg-big-cover{
  width:100%!important;height:100%!important;border-radius:4.7vw!important;
}

/* Fixed quick-action geometry */
html body #obgBigPlayer .obg-big-actions{
  left:23.5%!important;right:23.5%!important;top:15.05%!important;height:46px!important;
}
html body #obgBigPlayer .obg-big-actions button{
  width:44px!important;height:44px!important;min-width:44px!important;min-height:44px!important;
  max-width:44px!important;max-height:44px!important;color:var(--obg-player-control-color)!important;
}
html body #obgBigPlayer #obgBigLike,
html body #obgBigPlayer #obgBigAddPlaylist,
html body #obgBigPlayer #obgBigShare{font-size:17px!important}

/* Fixed metadata geometry and typography */
html body #obgBigPlayer .obg-big-info{
  left:7.5%!important;right:7.5%!important;top:66.0%!important;
}
html body #obgBigPlayer .obg-big-title{
  font-size:var(--obg-player-title-size)!important;line-height:1.02!important;font-weight:800!important;
  letter-spacing:-.01em!important;max-width:90vw!important;margin:0 auto!important;
  color:var(--obg-player-title-color)!important;
}
html body #obgBigPlayer .obg-big-title.obg-title-long{font-size:var(--obg-player-title-size-long)!important}
html body #obgBigPlayer .obg-big-title.obg-title-xlong{font-size:var(--obg-player-title-size-xlong)!important}
html body #obgBigPlayer .obg-big-artist{
  font-size:clamp(16px,3.7vw,23px)!important;font-weight:400!important;letter-spacing:.01em!important;
  margin:.45dvh auto 0!important;color:var(--obg-player-artist-color)!important;
}
html body #obgBigPlayer .obg-big-mastered{
  border-color:var(--obg-player-accent)!important;color:var(--obg-player-accent)!important;
}

/* Fixed seek geometry */
html body #obgBigPlayer .obg-big-progress{
  left:7.0%!important;right:7.0%!important;top:77.35%!important;
}
html body #obgBigPlayer .obg-big-progress input[type="range"]{
  background:linear-gradient(to right,var(--obg-player-accent) 0%,var(--obg-player-accent) var(--obg-seek,0%),rgba(255,255,255,.78) var(--obg-seek,0%),rgba(255,255,255,.78) 100%) center/100% 2px no-repeat!important;
  accent-color:var(--obg-player-accent)!important;
}
html body #obgBigPlayer .obg-big-progress input[type="range"]::-webkit-slider-thumb{
  border-color:var(--obg-player-accent)!important;
}
html body #obgBigPlayer .obg-big-progress input[type="range"]::-moz-range-progress{background:var(--obg-player-accent)!important}
html body #obgBigPlayer .obg-big-progress input[type="range"]::-moz-range-thumb{border-color:var(--obg-player-accent)!important}

/* Fixed transport geometry */
html body #obgBigPlayer .obg-big-controls{
  left:13.5%!important;right:13.5%!important;top:82.15%!important;
  grid-template-columns:32px 46px 56px 46px 32px!important;gap:10px!important;
}
html body #obgBigPlayer .obg-big-controls button{color:var(--obg-player-control-color)!important}
html body #obgBigPlayer #obgBigShuffle,
html body #obgBigPlayer #obgBigRepeat{
  width:32px!important;height:32px!important;min-width:32px!important;min-height:32px!important;font-size:15px!important;
}
html body #obgBigPlayer #obgBigPrev,
html body #obgBigPlayer #obgBigNext{
  width:46px!important;height:46px!important;min-width:46px!important;min-height:46px!important;font-size:25px!important;
}
html body #obgBigPlayer #obgBigPlay.obg-big-play{
  width:56px!important;height:56px!important;min-width:56px!important;min-height:56px!important;
  border:1.5px solid var(--obg-player-accent)!important;border-radius:50%!important;
  background:#0a0a0a!important;color:var(--obg-player-control-color)!important;font-size:25px!important;
  box-shadow:0 0 0 1px color-mix(in srgb,var(--obg-player-accent) 28%,transparent),0 0 10px color-mix(in srgb,var(--obg-player-accent) 18%,transparent)!important;
}

/* Built-in themes: background only. */
html body #obgBigPlayer[data-player-theme="dark_black"]::before{
  background:radial-gradient(circle at 50% 12%,#272727 0,#0d0d0f 35%,#020202 78%)!important;
}
html body #obgBigPlayer[data-player-theme="minimal_gold"]::before{
  background:linear-gradient(180deg,#050505 0,#171006 48%,#020202 100%)!important;
}

/* Custom themes: uploaded background only. */
html body #obgBigPlayer[data-player-theme^="custom_"]::before{
  background:#000 var(--obg-custom-player-layout) center top/100% 100% no-repeat!important;
}

/* No Layout remains pure black, with the same locked geometry. */
html body #obgBigPlayer[data-player-theme="no_layout"]::before{
  content:none!important;display:none!important;
}

@media(max-width:760px) and (max-height:780px){
  html body #obgBigPlayer .obg-big-cover-wrap{top:24.1%!important;height:39.9%!important}
  html body #obgBigPlayer .obg-big-actions{top:14.85%!important}
  html body #obgBigPlayer .obg-big-info{top:65.0%!important}
  html body #obgBigPlayer .obg-big-progress{top:76.35%!important}
  html body #obgBigPlayer .obg-big-controls{
    top:81.0%!important;grid-template-columns:30px 44px 54px 44px 30px!important;gap:8px!important;
  }
  html body #obgBigPlayer #obgBigPlay.obg-big-play{
    width:54px!important;height:54px!important;min-width:54px!important;min-height:54px!important;font-size:24px!important;
  }
}


/* V3.22.27 — authoritative HI-RES placement (player stylesheet loads last) */
html body #obgBigPlayer .obg-big-mastered{
 position:fixed!important;
 left:50%!important;
 top:auto!important;
 bottom:calc(20.9dvh + env(safe-area-inset-bottom))!important;
 right:auto!important;
 transform:translateX(-50%)!important;
 margin:0!important;
 width:max-content!important;
 max-width:58vw!important;
 min-height:18px!important;
 height:auto!important;
 padding:3px 8px!important;
 border-radius:7px!important;
 font-size:8px!important;
 line-height:1!important;
 z-index:28!important;
 pointer-events:none!important;
 white-space:nowrap!important;
}
html body #obgBigPlayer .obg-big-mastered[hidden]{display:none!important}
html body #obgBigPlayer .obg-big-progress{
 top:77.35%!important;
 z-index:20!important;
}
@media(max-width:760px){
 html body #obgBigPlayer .obg-big-mastered{
  bottom:calc(22.4dvh + env(safe-area-inset-bottom))!important;
  font-size:7px!important;
  padding:3px 6px!important;
 }
}
@media(max-width:760px) and (max-height:780px){
 html body #obgBigPlayer .obg-big-mastered{
  bottom:calc(21.8dvh + env(safe-area-inset-bottom))!important;
 }
}


/* V3.22.28 — fullscreen HI-RES final position */
html body #obgBigPlayer .obg-big-mastered{
 position:absolute!important;
 left:50%!important;
 top:74.45%!important;
 right:auto!important;
 bottom:auto!important;
 transform:translateX(-50%)!important;
 margin:0!important;
 width:max-content!important;
 max-width:58%!important;
 min-height:18px!important;
 height:auto!important;
 padding:3px 8px!important;
 border-radius:7px!important;
 font-size:8px!important;
 line-height:1!important;
 z-index:24!important;
 pointer-events:none!important;
 white-space:nowrap!important;
}
html body #obgBigPlayer .obg-big-mastered[hidden]{display:none!important}
html body #obgBigPlayer .obg-big-progress{
 top:77.35%!important;
 z-index:20!important;
}
@media(max-width:760px){
 html body #obgBigPlayer .obg-big-mastered{
  top:74.15%!important;
  font-size:7px!important;
  padding:3px 6px!important;
 }
}
@media(max-width:760px) and (max-height:780px){
 html body #obgBigPlayer .obg-big-mastered{
  top:73.75%!important;
 }
}


/* V3.22.29 — big player HI-RES beside title */
html body #obgBigPlayer .obg-big-info{
 position:absolute!important;
 left:7.5%!important;
 right:7.5%!important;
 top:66.0%!important;
 margin:0!important;
 padding:0!important;
 text-align:center!important;
 z-index:16!important;
}
html body #obgBigPlayer .obg-big-title-line{
 display:flex!important;
 align-items:center!important;
 justify-content:center!important;
 gap:8px!important;
 width:100%!important;
 min-width:0!important;
 overflow:hidden!important;
}
html body #obgBigPlayer #obgBigTitle{
 flex:0 1 auto!important;
 min-width:0!important;
 max-width:calc(100% - 62px)!important;
 margin:0!important;
 padding:0!important;
 overflow:hidden!important;
 text-overflow:ellipsis!important;
 white-space:nowrap!important;
}
html body #obgBigPlayer #obgBigMasteredBadge{
 position:static!important;
 left:auto!important;
 top:auto!important;
 right:auto!important;
 bottom:auto!important;
 transform:none!important;
 display:inline-flex!important;
 align-items:center!important;
 justify-content:center!important;
 flex:0 0 auto!important;
 width:auto!important;
 max-width:none!important;
 min-height:0!important;
 height:auto!important;
 margin:0!important;
 padding:4px 7px!important;
 border:1px solid rgba(239,203,85,.72)!important;
 border-radius:6px!important;
 background:rgba(13,13,13,.86)!important;
 color:#efcb55!important;
 font-size:8px!important;
 line-height:1!important;
 font-weight:950!important;
 letter-spacing:.055em!important;
 z-index:auto!important;
 white-space:nowrap!important;
 pointer-events:none!important;
}
html body #obgBigPlayer #obgBigMasteredBadge[hidden]{display:none!important}
html body #obgBigPlayer #obgBigArtist{
 display:block!important;
 width:100%!important;
 max-width:100%!important;
 margin:.55dvh auto 0!important;
 padding:0!important;
 text-align:center!important;
}
@media(max-width:760px){
 html body #obgBigPlayer .obg-big-title-line{gap:6px!important}
 html body #obgBigPlayer #obgBigMasteredBadge{
  padding:3px 6px!important;
  font-size:7px!important;
 }
}


/* V3.22.31 — big player title + HI-RES perfectly level */
html body #obgBigPlayer .obg-big-title-line{
 display:flex!important;
 align-items:center!important;
 justify-content:center!important;
 gap:8px!important;
 min-height:34px!important;
 line-height:1!important;
}
html body #obgBigPlayer #obgBigTitle{
 display:block!important;
 margin:0!important;
 padding:0!important;
 line-height:1!important;
}
html body #obgBigPlayer #obgBigMasteredBadge{
 display:inline-flex!important;
 align-items:center!important;
 justify-content:center!important;
 height:22px!important;
 min-height:22px!important;
 box-sizing:border-box!important;
 margin:0!important;
 padding:0 8px!important;
 line-height:20px!important;
 vertical-align:middle!important;
 transform:none!important;
}
@media(max-width:760px){
 html body #obgBigPlayer #obgBigMasteredBadge{
  height:20px!important;
  min-height:20px!important;
  line-height:18px!important;
  padding:0 7px!important;
 }
}


/* V3.22.33 — big player title + artist centered tightly */
html body #obgBigPlayer .obg-big-info{
 display:flex!important;
 flex-direction:column!important;
 align-items:center!important;
 justify-content:flex-start!important;
 text-align:center!important;
}
html body #obgBigPlayer .obg-big-title-line{
 display:flex!important;
 align-items:center!important;
 justify-content:center!important;
 gap:8px!important;
 width:100%!important;
 min-width:0!important;
 margin:0!important;
}
html body #obgBigPlayer #obgBigTitle{
 flex:0 1 auto!important;
 min-width:0!important;
 max-width:calc(100% - 60px)!important;
 margin:0!important;
 padding:0!important;
 text-align:center!important;
 line-height:1.02!important;
}
html body #obgBigPlayer #obgBigArtist{
 display:block!important;
 width:100%!important;
 margin:.28dvh 0 0!important;
 padding:0!important;
 text-align:center!important;
 line-height:1.02!important;
}
html body #obgBigPlayer #obgBigMasteredBadge{
 align-self:center!important;
}
@media(max-width:760px){
 html body #obgBigPlayer #obgBigArtist{
  margin:.18dvh 0 0!important;
 }
}


/* V3.22.34 — big player artist directly under the title */
html body #obgBigPlayer .obg-big-info{
 align-items:flex-start!important;
 width:fit-content!important;
 max-width:100%!important;
 margin-left:auto!important;
 margin-right:auto!important;
}
html body #obgBigPlayer .obg-big-title-line{
 justify-content:flex-start!important;
 width:auto!important;
 max-width:100%!important;
}
html body #obgBigPlayer #obgBigArtist{
 position:relative!important;
 left:18px!important;
 width:auto!important;
 max-width:calc(100vw - 80px)!important;
 text-align:left!important;
 align-self:flex-start!important;
}


/* V3.22.35 — artist exactly under title, big player */
html body #obgBigPlayer .obg-big-info{
 align-items:center!important;
 width:100%!important;
 max-width:none!important;
 margin-left:0!important;
 margin-right:0!important;
}
html body #obgBigPlayer .obg-big-title-line{
 justify-content:center!important;
 width:100%!important;
 max-width:100%!important;
}
html body #obgBigPlayer #obgBigTitle{
 text-align:left!important;
}
html body #obgBigPlayer #obgBigArtist{
 position:relative!important;
 left:-29px!important;
 width:auto!important;
 max-width:calc(100% - 58px)!important;
 margin:.18dvh auto 0!important;
 padding:0!important;
 text-align:left!important;
 align-self:center!important;
}
@media(max-width:760px){
 html body #obgBigPlayer #obgBigArtist{
  left:-26px!important;
 }
}


/* V3.22.36 — big player HI-RES beside artist, title stays complete */
html body #obgBigPlayer .obg-big-info{
 display:flex!important;
 flex-direction:column!important;
 align-items:center!important;
 width:100%!important;
}
html body #obgBigPlayer .obg-big-title-line{
 display:flex!important;
 align-items:center!important;
 justify-content:center!important;
 width:100%!important;
 max-width:100%!important;
 overflow:visible!important;
}
html body #obgBigPlayer #obgBigTitle{
 flex:1 1 auto!important;
 max-width:100%!important;
 width:auto!important;
 margin:0!important;
 padding:0!important;
 text-align:center!important;
 overflow:hidden!important;
 text-overflow:ellipsis!important;
 white-space:nowrap!important;
}
html body #obgBigPlayer .obg-big-artist-line{
 display:flex!important;
 align-items:center!important;
 justify-content:center!important;
 gap:7px!important;
 width:100%!important;
 margin:.18dvh 0 0!important;
 min-width:0!important;
}
html body #obgBigPlayer #obgBigArtist{
 position:static!important;
 left:auto!important;
 width:auto!important;
 max-width:calc(100% - 58px)!important;
 margin:0!important;
 padding:0!important;
 text-align:center!important;
 align-self:auto!important;
 line-height:1.02!important;
 overflow:hidden!important;
 text-overflow:ellipsis!important;
 white-space:nowrap!important;
}
html body #obgBigPlayer #obgBigMasteredBadge{
 position:static!important;
 flex:0 0 auto!important;
 margin:0!important;
 height:20px!important;
 min-height:20px!important;
 padding:0 7px!important;
 font-size:7px!important;
 line-height:18px!important;
}
@media(max-width:760px){
 html body #obgBigPlayer .obg-big-artist-line{
  gap:6px!important;
 }
 html body #obgBigPlayer #obgBigMasteredBadge{
  height:18px!important;
  min-height:18px!important;
  padding:0 6px!important;
  font-size:6.5px!important;
  line-height:16px!important;
 }
}


/* V3.22.37 — big player artist true center, HI-RES beside it */
html body #obgBigPlayer .obg-big-artist-line{
 position:relative!important;
 display:block!important;
 width:100%!important;
 margin:.18dvh 0 0!important;
 min-height:22px!important;
 text-align:center!important;
}
html body #obgBigPlayer #obgBigArtist{
 display:inline-block!important;
 position:relative!important;
 left:auto!important;
 width:auto!important;
 max-width:72%!important;
 margin:0 auto!important;
 padding:0!important;
 text-align:center!important;
 line-height:1.02!important;
 overflow:hidden!important;
 text-overflow:ellipsis!important;
 white-space:nowrap!important;
 vertical-align:middle!important;
}
html body #obgBigPlayer #obgBigMasteredBadge{
 position:absolute!important;
 left:calc(50% + 118px)!important;
 top:50%!important;
 transform:translateY(-50%)!important;
 width:auto!important;
 height:18px!important;
 min-height:18px!important;
 margin:0!important;
 padding:0 6px!important;
 font-size:6.5px!important;
 line-height:16px!important;
 vertical-align:middle!important;
}
@media(max-width:760px){
 html body #obgBigPlayer #obgBigMasteredBadge{
  left:calc(50% + 105px)!important;
 }
}
@media(max-width:430px){
 html body #obgBigPlayer #obgBigArtist{
  max-width:68%!important;
 }
 html body #obgBigPlayer #obgBigMasteredBadge{
  left:calc(50% + 96px)!important;
  height:17px!important;
  min-height:17px!important;
  font-size:6px!important;
  line-height:15px!important;
  padding:0 5px!important;
 }
}


/* V3.22.39 — big player text aligned to the LEFT edge of the cover */
html body #obgBigPlayer .obg-big-info{
 left:12.45%!important;
 right:12.45%!important;
 width:auto!important;
 max-width:none!important;
 margin:0!important;
 align-items:flex-start!important;
 text-align:left!important;
}
html body #obgBigPlayer .obg-big-title-line{
 width:100%!important;
 max-width:100%!important;
 justify-content:flex-start!important;
 text-align:left!important;
}
html body #obgBigPlayer #obgBigTitle{
 width:auto!important;
 max-width:100%!important;
 margin:0!important;
 padding:0!important;
 text-align:left!important;
}
html body #obgBigPlayer .obg-big-artist-line{
 position:relative!important;
 display:flex!important;
 align-items:center!important;
 justify-content:flex-start!important;
 width:100%!important;
 min-height:22px!important;
 margin:.18dvh 0 0!important;
 gap:7px!important;
 text-align:left!important;
}
html body #obgBigPlayer #obgBigArtist{
 position:static!important;
 left:auto!important;
 display:block!important;
 width:auto!important;
 max-width:calc(100% - 72px)!important;
 margin:0!important;
 padding:0!important;
 text-align:left!important;
 align-self:auto!important;
 overflow:hidden!important;
 text-overflow:ellipsis!important;
 white-space:nowrap!important;
}
html body #obgBigPlayer #obgBigMasteredBadge{
 position:static!important;
 left:auto!important;
 top:auto!important;
 transform:none!important;
 flex:0 0 auto!important;
 margin:0!important;
}
@media(max-width:760px){
 html body #obgBigPlayer .obg-big-info{
  left:12.45%!important;
  right:12.45%!important;
 }
}