/* ListingMine Music — universal player (warm dark theme) */
:root{
  --lmp-bg:#14100e; --lmp-bg2:#0b0a0a; --lmp-panel:rgba(255,215,175,.05);
  --lmp-line:rgba(255,215,175,.09); --lmp-line2:rgba(255,215,175,.16);
  --lmp-ink:#f0e3da; --lmp-txt:#cfc2b8; --lmp-mut:#b8a69c; --lmp-dim:#6b5d55;
  --lmp-acc:#b85a3a; --lmp-acc2:#d16a48;
}

/* ---------- embedded in the ERP app (iframe): the site chrome disappears ---------- */
html.lm-embed header,html.lm-embed footer{display:none !important}
html.lm-embed .mal,html.lm-embed .msg-all,html.lm-embed .shp{padding-top:18px !important}
html.lm-embed .msg-all .toolbar{top:0}
html.lm-embed .hero{padding-top:10px !important}
html.lm-embed main{margin-top:0 !important}
html.lm-embed .hero-copy{padding-top:20px !important}
html.lm-embed body{overflow-x:hidden}
html.lm-embed .lmp-bar{transition:transform .25s ease}
html.lm-embed.lmp-navhide .lmp-bar{transform:translateY(130%)}

/* ERP app pages: the player docks at the very bottom, BELOW the 4-tab bar
   (the tab bar is lifted by the bar's height via JS). Scrolling down hides
   both; scrolling up restores both. */
.lmp-bar.lmp-erp{bottom:0;transition:transform .25s ease}
.lmp-bar.lmp-erp .lmp-bubble{bottom:150px}
html.lmp-navhide .lmp-bar.lmp-erp{transform:translateY(120%)}
html.lmp-navhide .bottomButtonDiv{transform:translateY(300%) !important}

/* phones: the mini bar must ALWAYS fit the width — tighter gaps, smaller
   buttons, skip prev (⏮) so ▶/next/queue/expand/close all stay reachable */
@media(max-width:560px){
  .lmp-bar{gap:7px;padding:8px 10px}
  .lmp-video{width:88px}
  .lmp-btn{width:36px;height:36px;font-size:16px}
  .lmp-play{font-size:18px}
  .lmp-bar:not(.lmp-full) .lmp-prev{display:none}
  .lmp-bar:not(.lmp-full) .lmp-addpl{display:none}
  .lmp-title{font-size:13px}
  .lmp-album{font-size:11px}
}

/* the player must size identically on every host page (marketing site, ERP …) —
   never inherit a page's content-box sizing, it makes the full view overflow */
.lmp-bar,.lmp-bar *,.lmp-bar *::before,.lmp-bar *::after{box-sizing:border-box}

/* ---------- mini bar ---------- */
.lmp-bar[hidden]{display:none !important}   /* ✕ must truly remove the player */
.lmp-bar{position:fixed;left:0;right:0;bottom:0;z-index:99990;background:var(--lmp-bg);color:var(--lmp-ink);
  display:flex;align-items:center;gap:14px;padding:10px 16px;
  box-shadow:0 -12px 34px rgba(0,0,0,.55);border-top:1px solid var(--lmp-line);
  font-family:'poppins-r',-apple-system,'Segoe UI',Roboto,Arial,sans-serif}
body.lmp-on{padding-bottom:86px}
.lmp-video{position:relative;width:132px;aspect-ratio:16/9;border-radius:10px;overflow:hidden;flex:0 0 auto;background:#000}
.lmp-video iframe{width:100%;height:100%;border:0;display:block}
.lmp-meta{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.lmp-titlerow{display:flex;align-items:baseline;gap:12px;min-width:0}
.lmp-title{color:var(--lmp-ink);text-decoration:none;font-weight:700;font-size:14px;line-height:1.35;
  display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;min-width:0}
.lmp-title:hover{text-decoration:underline}
.lmp-tracknum{display:none;color:var(--lmp-dim);font-size:12px;white-space:nowrap;flex:0 0 auto}
.lmp-album{color:var(--lmp-mut);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lmp-ctrl{display:flex;align-items:center;gap:6px;flex:0 0 auto}
.lmp-btn{background:none;border:0;color:var(--lmp-txt);font-size:19px;cursor:pointer;width:44px;height:44px;
  border-radius:50%;display:flex;align-items:center;justify-content:center;transition:background .12s,color .12s}
.lmp-btn:hover{background:var(--lmp-panel);color:var(--lmp-ink)}
.lmp-play{background:var(--lmp-acc);color:#14100e;font-size:21px}
.lmp-play:hover{background:var(--lmp-acc2);color:#14100e}
.lmp-shuf.on{color:#fff;background:var(--lmp-acc)}
.lmp-shuf.on:hover{background:var(--lmp-acc2);color:#fff}
/* feedback toast */
.lmp-toast{position:fixed;left:50%;bottom:112px;transform:translateX(-50%);z-index:99998;
  background:rgba(11,10,10,.94);border:1px solid rgba(184,90,58,.4);color:#f0e3da;
  padding:10px 20px;border-radius:999px;font-size:13.5px;font-weight:600;white-space:nowrap;
  font-family:'poppins-r',-apple-system,'Segoe UI',Roboto,Arial,sans-serif;
  box-shadow:0 10px 30px rgba(0,0,0,.5);animation:lmpToastIn 1.9s forwards;pointer-events:none}
@keyframes lmpToastIn{0%{opacity:0;transform:translate(-50%,10px)}10%,78%{opacity:1;transform:translate(-50%,0)}100%{opacity:0;transform:translate(-50%,-6px)}}
.lmp-close{font-size:15px;color:var(--lmp-mut)}

/* queue popup (mini bar) */
.lmp-queue{position:absolute;right:12px;bottom:calc(100% + 8px);width:min(360px,92vw);max-height:55vh;
  overflow:auto;background:#171210;border:1px solid var(--lmp-line2);border-radius:14px;
  box-shadow:0 18px 44px rgba(0,0,0,.6);padding:8px}
.lmp-qhead{font-weight:800;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--lmp-mut);padding:8px 10px 6px}
.lmp-qrow{display:flex;align-items:center;gap:10px;width:100%;background:none;border:0;color:var(--lmp-txt);
  text-align:left;padding:7px 10px;border-radius:9px;cursor:pointer;font:inherit;font-size:13px;line-height:1.35}
.lmp-qrow:hover{background:var(--lmp-panel)}
.lmp-qrow.cur{background:rgba(184,90,58,.22)}
.lmp-qrow img{width:56px;aspect-ratio:16/9;object-fit:cover;border-radius:6px;flex:0 0 auto}
.lmp-qrow span{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.lmp-hero-on .pb{display:none !important}
.lmp-lyr{display:none !important}
.lmp-prog,.lmp-strip,.lmp-content,.lmp-fullhead{display:none}

/* ---------- bubble mode: tiny draggable floating icon ---------- */
.lmp-bubble{display:none;position:fixed;right:18px;bottom:104px;z-index:99995;width:58px;height:58px;
  border-radius:50%;border:2.5px solid var(--lmp-acc);background:#14100e;padding:0;cursor:grab;
  box-shadow:0 10px 28px rgba(0,0,0,.5);touch-action:none;pointer-events:auto}
.lmp-bubble:active{cursor:grabbing}
.lmp-bubble img{width:100%;height:100%;object-fit:cover;border-radius:50%;display:block;
  animation:lmpSpin 9s linear infinite}
.lmp-bubble.paused img{animation-play-state:paused}
/* beat: rhythmic bounce + double ripple rings + mini equalizer */
.lmp-bubble{will-change:transform;animation:lmpBeat .62s ease-in-out infinite}
.lmp-bubble.paused{animation:none}
.lmp-bubble::before,.lmp-bubble::after{content:'';position:absolute;inset:-3px;border-radius:50%;
  border:2px solid rgba(184,90,58,.55);opacity:0;pointer-events:none}
.lmp-bubble::before{animation:lmpRipple 1.24s ease-out infinite}
.lmp-bubble::after{animation:lmpRipple 1.24s ease-out infinite .62s}
.lmp-bubble.paused::before,.lmp-bubble.paused::after{display:none}
.lmp-eq{position:absolute;left:50%;bottom:6px;transform:translateX(-50%);display:flex;gap:2.5px;
  align-items:flex-end;height:15px;padding:3px 7px;background:rgba(11,10,10,.6);
  border-radius:999px;pointer-events:none}
.lmp-eq i{width:3px;background:#f0c9a8;border-radius:2px;height:30%}
.lmp-eq i:nth-child(1){animation:lmpEq .72s ease-in-out -0.20s infinite}
.lmp-eq i:nth-child(2){animation:lmpEq .55s ease-in-out -0.35s infinite}
.lmp-eq i:nth-child(3){animation:lmpEq .82s ease-in-out -0.10s infinite}
.lmp-eq i:nth-child(4){animation:lmpEq .60s ease-in-out -0.45s infinite}
.lmp-bubble.paused .lmp-eq{display:none}
@keyframes lmpEq{0%,100%{height:22%}50%{height:96%}}
@keyframes lmpRipple{0%{transform:scale(1);opacity:.75}100%{transform:scale(1.6);opacity:0}}
@keyframes lmpBeat{0%,100%{transform:scale(1)}32%{transform:scale(1.07)}58%{transform:scale(.985)}}
@keyframes lmpSpin{to{transform:rotate(360deg)}}
.lmp-bar.lmp-bubblemode{background:transparent;box-shadow:none;border:0;padding:0;pointer-events:none}
/* the overlays live inside the bar — they must stay clickable even in bubble mode */
.lmp-bar.lmp-bubblemode .lmp-my,.lmp-bar.lmp-bubblemode .lmp-auth,.lmp-bar.lmp-bubblemode .lmp-plpop,.lmp-bar.lmp-bubblemode .lmp-connect{pointer-events:auto}
.lmp-bar.lmp-bubblemode .lmp-bubble{display:block}
.lmp-bar.lmp-bubblemode .lmp-meta,.lmp-bar.lmp-bubblemode .lmp-ctrl,.lmp-bar.lmp-bubblemode .lmp-queue,
.lmp-bar.lmp-bubblemode .lmp-prog,.lmp-bar.lmp-bubblemode .lmp-strip,.lmp-bar.lmp-bubblemode .lmp-content,
.lmp-bar.lmp-bubblemode .lmp-fullhead{display:none !important}
/* keep the audio alive: iframe stays loaded but invisible */
.lmp-bar.lmp-bubblemode .lmp-video{position:fixed;left:0;bottom:0;width:2px;height:2px;opacity:.01;pointer-events:none}
body.lmp-on.lmp-bubmode{padding-bottom:0}

/* ---------- full view ---------- */
html.lmp-lock, html.lmp-lock body{overflow:hidden}
.lmp-bar.lmp-full{top:0;flex-direction:column;justify-content:flex-start;align-items:center;
  gap:14px;padding:0 18px 60px;overflow-y:auto;overflow-x:hidden;border-top:0;
  background:radial-gradient(circle at 30% 12%, #1a1412 0%, #0b0a0a 75%)}

/* header: brand · pulsing now-playing · window controls */
.lmp-bar.lmp-full .lmp-fullhead{order:0;display:flex;flex:0 0 auto;align-items:center;gap:14px;
  position:sticky;top:0;z-index:5;width:calc(100% + 36px);margin:0 -18px 2px;
  padding:12px 22px;background:rgba(11,10,10,.9);backdrop-filter:blur(10px);
  border-bottom:1px solid var(--lmp-line)}
.lmp-fh-back{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;padding:0;
  white-space:nowrap;cursor:pointer;font:inherit;border-radius:999px;
  background:var(--lmp-panel);border:1px solid var(--lmp-line2);color:var(--lmp-txt);
  font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  transition:background .16s,border-color .16s,color .16s}
.lmp-fh-back svg{display:block;transition:transform .16s}
.lmp-fh-back:hover{background:rgba(255,215,175,.14);border-color:rgba(255,215,175,.32);color:#fff}
.lmp-fh-back:hover svg{transform:translateX(-2px)}
.lmp-fh-brand{display:flex;align-items:center;gap:9px;color:var(--lmp-mut);text-decoration:none;
  font-size:11.5px;letter-spacing:.22em;text-transform:uppercase;white-space:nowrap}
.lmp-fh-brand b{font-family:'poppins-m',inherit;color:var(--lmp-ink)}
.lmp-fh-brand:hover{color:var(--lmp-ink)}
.lmp-fh-dot{width:7px;height:7px;border-radius:50%;background:var(--lmp-acc);flex:0 0 auto}
.lmp-fh-sp{flex:1}
.lmp-npbadge{display:flex;align-items:center;gap:8px;background:rgba(184,90,58,.1);
  border:1px solid rgba(184,90,58,.18);border-radius:999px;padding:5px 14px;min-width:0;max-width:34vw}
.lmp-pulse{width:6px;height:6px;border-radius:50%;background:var(--lmp-acc2);flex:0 0 auto;
  animation:lmpPulse 1.3s ease-in-out infinite}
@keyframes lmpPulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.3;transform:scale(.65)}}
.lmp-np-name{color:var(--lmp-mut);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lmp-fh-actions{display:flex;align-items:center;gap:10px}
.lmp-min2{display:inline-flex;align-items:center;gap:8px;height:34px;padding:0 16px 0 13px;
  white-space:nowrap;cursor:pointer;font:inherit;
  border-radius:999px;background:var(--lmp-panel);border:1px solid var(--lmp-line2);
  color:var(--lmp-txt);font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  transition:background .16s,border-color .16s,color .16s}
.lmp-min2 svg{display:block;transition:transform .16s}
.lmp-min2:hover{background:rgba(255,215,175,.12);border-color:rgba(255,215,175,.3);color:var(--lmp-ink)}
.lmp-min2:hover svg{transform:translateY(1.5px)}
.lmp-close2{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;
  cursor:pointer;border-radius:50%;background:none;border:1px solid transparent;color:var(--lmp-dim);
  transition:background .16s,color .16s,border-color .16s}
.lmp-close2 svg{display:block}
.lmp-close2:hover{background:rgba(184,90,58,.2);color:var(--lmp-acc2);border-color:rgba(184,90,58,.25)}

.lmp-bar.lmp-full .lmp-video{order:1;width:min(880px,100%);border-radius:16px;margin-top:10px;
  box-shadow:0 24px 70px rgba(0,0,0,.6);flex:0 0 auto}

/* real progress bar */
.lmp-bar.lmp-full .lmp-prog{order:2;display:flex;flex:0 0 auto;align-items:center;gap:12px;
  width:min(880px,100%)}
.lmp-t-cur,.lmp-t-tot{font-size:11.5px;color:var(--lmp-dim);font-variant-numeric:tabular-nums;min-width:34px}
.lmp-t-cur{color:var(--lmp-mut);text-align:right}
.lmp-ptrack{flex:1;height:4px;background:rgba(255,215,175,.12);border-radius:4px;cursor:pointer;position:relative}
.lmp-ptrack:hover{height:6px}
.lmp-pfill{height:100%;width:0%;background:var(--lmp-acc);border-radius:4px;position:relative}
.lmp-ptrack:hover .lmp-pfill{background:var(--lmp-acc2)}

.lmp-bar.lmp-full .lmp-ctrl{order:3;flex:0 0 auto;gap:16px}
.lmp-bar.lmp-full .lmp-btn{width:48px;height:48px;font-size:20px}
.lmp-bar.lmp-full .lmp-play{width:60px;height:60px;font-size:24px}
.lmp-bar.lmp-full .lmp-list{display:none}
.lmp-bar.lmp-full .lmp-shuf{display:flex}
.lmp-bar.lmp-full .lmp-expand,.lmp-bar.lmp-full .lmp-close{display:none}

/* thumbnail slider */
.lmp-bar.lmp-full .lmp-strip{order:4;display:flex;flex:0 0 auto;gap:10px;overflow-x:auto;
  width:min(880px,100%);padding:4px 2px 12px;scrollbar-width:thin;
  scrollbar-color:rgba(255,215,175,.22) transparent;scroll-behavior:smooth}
.lmp-bar.lmp-full .lmp-strip::-webkit-scrollbar{height:7px}
.lmp-bar.lmp-full .lmp-strip::-webkit-scrollbar-thumb{background:rgba(255,215,175,.2);border-radius:999px}
.lmp-scard{flex:0 0 152px;cursor:pointer;background:rgba(0,0,0,.25);
  border:2px solid transparent;border-radius:11px;padding:0 0 8px;
  display:flex;flex-direction:column;gap:6px;font:inherit;text-align:left;
  transition:border-color .2s,transform .2s,box-shadow .2s;overflow:hidden}
.lmp-scard:hover{border-color:rgba(184,90,58,.35)}
.lmp-scard.cur{border-color:var(--lmp-acc);box-shadow:0 0 14px rgba(184,90,58,.18);transform:scale(1.02)}
.lmp-sc-thumb{position:relative;display:block;width:148px;height:83px;background:#1a1412}
.lmp-sc-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.lmp-sc-num{position:absolute;top:4px;left:4px;background:rgba(0,0,0,.72);backdrop-filter:blur(4px);
  padding:2px 8px;border-radius:8px;font-size:9.5px;font-weight:700;color:var(--lmp-acc2);
  letter-spacing:.05em;border:1px solid rgba(184,90,58,.15)}
.lmp-sc-dur{position:absolute;bottom:4px;right:4px;background:rgba(0,0,0,.72);backdrop-filter:blur(4px);
  padding:2px 7px;border-radius:7px;font-size:9.5px;color:var(--lmp-mut);font-variant-numeric:tabular-nums}
.lmp-sc-play{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  background:rgba(0,0,0,.14);color:#fff;font-size:17px;opacity:0;transition:opacity .2s;text-shadow:0 4px 18px rgba(0,0,0,.7)}
.lmp-scard:hover .lmp-sc-play{opacity:.9}
.lmp-scard.cur .lmp-sc-play{opacity:0}
.lmp-sc-title{font-size:11px;line-height:1.35;color:var(--lmp-txt);padding:0 8px;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.lmp-scard.cur .lmp-sc-title{color:var(--lmp-ink)}

/* title + album, like the detail page */
.lmp-bar.lmp-full .lmp-meta{order:5;flex:0 0 auto;align-items:flex-start;text-align:left;gap:5px;width:min(760px,100%)}
.lmp-bar.lmp-full .lmp-titlerow{width:100%;justify-content:space-between}
.lmp-bar.lmp-full .lmp-title{font-size:21px;-webkit-line-clamp:3;white-space:normal;font-family:'poppins-m',inherit}
.lmp-bar.lmp-full .lmp-tracknum{display:inline}
.lmp-bar.lmp-full .lmp-album{font-size:13px;white-space:normal;color:var(--lmp-mut)}

/* About + Lyrics */
.lmp-bar.lmp-full .lmp-content{order:6;display:block;flex:0 0 auto;width:min(760px,100%)}
.lmp-h{font-size:12px;text-transform:uppercase;letter-spacing:.22em;color:var(--lmp-mut);
  font-weight:600;margin:26px 0 10px}
.lmp-about{background:rgba(255,215,175,.03);border-left:3px solid var(--lmp-acc);
  border-radius:12px;padding:16px 20px}
.lmp-about p{font-size:14.5px;line-height:1.7;color:var(--lmp-txt);margin:0 0 12px}
.lmp-about p:last-child{margin-bottom:0}
.lmp-lyrics{font-family:Georgia,'Times New Roman',serif;font-size:15.5px;line-height:2;
  color:#d6cec7;padding:6px 4px}
.lmp-lyrics .lyr-sec{font-family:'poppins-m',-apple-system,sans-serif;color:var(--lmp-acc2);
  font-weight:700;margin:20px 0 4px;font-size:12.5px;letter-spacing:.1em;text-transform:uppercase}
.lmp-lyrics .lyr-sec:first-child{margin-top:0}
.lmp-lyrics .lyr-gap{height:12px}
.lmp-dim{color:var(--lmp-dim)}
.lmp-bar.lmp-full .lmp-queue{display:none !important}

/* ================= Phase D: likes, auth, playlists, My Music ================= */
.lmp-like.on{color:var(--lmp-acc2)}
.lmp-like.on svg .hp{fill:var(--lmp-acc2);stroke:var(--lmp-acc2)}
.lmp-fh-my{display:inline-flex;align-items:center;height:34px;padding:0 16px;margin-right:10px;
  white-space:nowrap;cursor:pointer;font:inherit;border-radius:999px;
  background:var(--lmp-panel);border:1px solid var(--lmp-line2);color:var(--lmp-txt);
  font-size:12px;font-weight:700;letter-spacing:.08em;transition:background .16s,color .16s}
.lmp-fh-my:hover{background:rgba(255,215,175,.14);color:#fff}

.lmp-auth,.lmp-plpop{position:fixed;inset:0;z-index:99998;background:rgba(8,6,5,.72);
  backdrop-filter:blur(5px);display:flex;align-items:center;justify-content:center;padding:20px}
/* connect helper (car / TV) shares the auth modal shell */
.lmp-connect{position:fixed;inset:0;z-index:99998;background:rgba(8,6,5,.72);
  backdrop-filter:blur(5px);display:flex;align-items:center;justify-content:center;padding:20px}
.lmp-cn-box{max-height:88vh;overflow-y:auto;scrollbar-width:thin}
.lmp-cn-row{display:flex;gap:12px;margin-top:14px;font-size:13px;color:var(--lmp-txt);line-height:1.55}
.lmp-cn-row b{display:block;color:var(--lmp-ink);margin-bottom:2px}
.lmp-cn-ico{flex:0 0 auto;font-size:20px;line-height:1.3}
.lmp-cn-yt{color:#d16a48;font-weight:700;text-decoration:none}
.lmp-cn-yt:hover{text-decoration:underline}
.lmp-castbtn{display:none !important}
.lmp-bar.lmp-full .lmp-castbtn{display:flex !important}

/* the display rules above would defeat the hidden attribute — restore it */
.lmp-auth[hidden],.lmp-plpop[hidden],.lmp-my[hidden],.lmp-connect[hidden]{display:none !important}
.lmp-auth-box,.lmp-pl-box{position:relative;width:min(400px,94vw);background:#171210;
  border:1px solid var(--lmp-line2);border-radius:18px;padding:28px 26px;
  box-shadow:0 24px 70px rgba(0,0,0,.6);color:var(--lmp-ink);
  font-family:'poppins-r',-apple-system,'Segoe UI',Roboto,Arial,sans-serif}
.lmp-auth-box h3,.lmp-pl-box h3{font-family:'poppins-m',inherit;font-size:19px;margin:0 0 6px;color:#fff}
.lmp-auth-box p{font-size:13px;color:var(--lmp-mut);margin:0 0 16px;line-height:1.55}
.lmp-auth-box input,.lmp-pl-newrow input{width:100%;box-sizing:border-box;background:rgba(255,255,255,.06);
  border:1px solid var(--lmp-line2);border-radius:10px;padding:12px 14px;margin-bottom:10px;
  color:#fff;font:inherit;font-size:14.5px}
.lmp-auth-box input::placeholder,.lmp-pl-newrow input::placeholder{color:var(--lmp-dim)}
.lmp-au-err{color:#e88;font-size:13px;margin:2px 0 8px}
.lmp-au-go{display:block;box-sizing:border-box;width:100%;background:var(--lmp-acc);color:#14100e;border:0;border-radius:10px;
  padding:13px;font:inherit;font-weight:700;font-size:15px;cursor:pointer;transition:background .15s;
  text-align:center;text-decoration:none}
.lmp-au-go:hover{background:var(--lmp-acc2)}
.lmp-au-wait{margin-top:12px;font-size:12.5px;color:var(--lmp-mut);text-align:center;line-height:1.5;
  animation:lmpWaitPulse 1.6s ease-in-out infinite}
@keyframes lmpWaitPulse{0%,100%{opacity:.55}50%{opacity:1}}
.lmp-au-wait[hidden]{display:none !important}
.lmp-au-reg{display:block;text-align:center;margin-top:14px;color:#d8b28a;font-size:13px;text-decoration:none}
.lmp-au-reg:hover{text-decoration:underline}
.lmp-au-x{position:absolute;top:12px;right:12px;width:32px;height:32px;border-radius:50%;
  background:none;border:0;color:var(--lmp-dim);font-size:14px;cursor:pointer}
.lmp-au-x:hover{background:rgba(255,255,255,.1);color:#fff}
.lmp-pl-list{max-height:44vh;overflow:auto;margin:6px 0 14px}
.lmp-pl-row{display:flex;justify-content:space-between;align-items:center;gap:10px;width:100%;
  background:rgba(255,255,255,.05);border:1px solid transparent;border-radius:10px;padding:12px 14px;
  margin-bottom:7px;color:var(--lmp-ink);font:inherit;font-size:14px;cursor:pointer;text-align:left}
.lmp-pl-row:hover{background:rgba(184,90,58,.16);border-color:rgba(184,90,58,.3)}
.lmp-pl-row i{color:var(--lmp-dim);font-style:normal;font-size:12px;white-space:nowrap}
.lmp-pl-row.inpl{border-color:rgba(103,171,131,.55);background:rgba(63,125,92,.16)}
.lmp-pl-row.inpl span{color:#8fd0a9}
.lmp-pl-newrow{display:flex;gap:8px}
.lmp-pl-newrow input{margin-bottom:0;flex:1}
.lmp-pl-make{background:var(--lmp-panel);border:1px solid var(--lmp-line2);color:var(--lmp-txt);
  border-radius:10px;padding:0 18px;font:inherit;font-weight:700;font-size:13.5px;cursor:pointer}
.lmp-pl-make:hover{background:rgba(255,215,175,.14);color:#fff}

.lmp-my{position:fixed;inset:0;z-index:99997;background:radial-gradient(circle at 30% 12%, #1a1412 0%, #0b0a0a 75%);
  overflow-y:auto;color:var(--lmp-ink);font-family:'poppins-r',-apple-system,'Segoe UI',Roboto,Arial,sans-serif}
.lmp-my-head{position:sticky;top:0;z-index:5;display:flex;align-items:center;gap:14px;
  padding:13px 22px;background:rgba(11,10,10,.92);backdrop-filter:blur(8px);border-bottom:1px solid var(--lmp-line)}
.lmp-my-back{background:var(--lmp-panel);border:1px solid var(--lmp-line2);color:var(--lmp-txt);
  border-radius:999px;padding:8px 16px;font:inherit;font-weight:700;font-size:12.5px;cursor:pointer;white-space:nowrap}
.lmp-my-back:hover{color:#fff;background:rgba(255,215,175,.14)}
.lmp-my-title{flex:1;text-align:center;font-size:12px;font-weight:800;letter-spacing:.18em;color:#7ea3e6;color:var(--lmp-acc2)}
.lmp-my-user{color:var(--lmp-mut);font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:26vw}
.lmp-my-out{background:none;border:0;color:var(--lmp-dim);font:inherit;font-size:12.5px;cursor:pointer;white-space:nowrap}
.lmp-my-out:hover{color:var(--lmp-acc2);text-decoration:underline}
.lmp-my-tabs{display:flex;gap:10px;justify-content:center;padding:18px 16px 6px}
.lmp-my-tab{background:var(--lmp-panel);border:1px solid var(--lmp-line2);color:var(--lmp-txt);
  border-radius:999px;padding:9px 20px;font:inherit;font-weight:700;font-size:13px;cursor:pointer;transition:all .15s}
.lmp-my-tab.on{background:var(--lmp-acc);border-color:var(--lmp-acc);color:#14100e}
.lmp-my-body{max-width:720px;margin:14px auto 80px;padding:0 16px}
.lmp-my-row{display:flex;align-items:center;gap:12px;background:rgba(255,255,255,.045);
  border:1px solid rgba(255,215,175,.08);border-radius:12px;padding:9px 12px;margin-bottom:8px}
.lmp-my-row img{width:64px;height:36px;object-fit:cover;border-radius:6px;flex:0 0 auto}
.lmp-my-row .t{flex:1;min-width:0;cursor:default}
.lmp-my-pl .t{cursor:pointer}
.lmp-my-row .t b{display:block;font-weight:600;font-size:13.5px;line-height:1.35;color:var(--lmp-ink);
  overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.lmp-my-row .t i{font-style:normal;font-size:11.5px;color:var(--lmp-dim)}
.lmp-my-row .acts{display:flex;gap:4px;flex:0 0 auto}
.lmp-my-act{width:34px;height:34px;border-radius:50%;background:none;border:1px solid transparent;
  color:var(--lmp-txt);font-size:13px;cursor:pointer;display:flex;align-items:center;justify-content:center}
.lmp-my-act:hover{background:rgba(184,90,58,.2);color:#fff}
.lmp-my-plhead{display:flex;align-items:center;gap:14px;margin:4px 0 14px;flex-wrap:wrap}
.lmp-my-share{background:var(--lmp-panel);border:1px solid var(--lmp-line2);color:var(--lmp-txt);
  border-radius:999px;padding:8px 16px;font:inherit;font-size:12.5px;font-weight:700;cursor:pointer}
.lmp-my-share:hover{background:rgba(37,211,102,.18);border-color:rgba(37,211,102,.5);color:#7be0a4}
.lmp-my-plhead b{flex:1;font-size:16px;color:#fff}
.lmp-my-plhead .lmp-my-plback{width:auto;border-radius:999px;padding:0 14px;font-size:12.5px;white-space:nowrap}
.lmp-my-playall{background:var(--lmp-acc);color:#14100e;border:0;border-radius:999px;
  padding:9px 18px;font:inherit;font-weight:700;font-size:13px;cursor:pointer}
.lmp-my-playall:hover{background:var(--lmp-acc2)}

@media(max-width:640px){
  .lmp-bar{gap:8px;padding:8px 10px}
  .lmp-video{width:96px}
  .lmp-shuf{display:none}
  .lmp-addpl{display:none}   /* full view still offers it */
  .lmp-btn{width:40px;height:40px;font-size:17px}
  body.lmp-on{padding-bottom:76px}
  .lmp-bar.lmp-full{padding:0 12px 50px}
  .lmp-bar.lmp-full .lmp-fullhead{width:calc(100% + 24px);margin:0 -12px 2px;padding:10px 14px;gap:8px}
  .lmp-npbadge{display:none}
  .lmp-bar.lmp-full .lmp-title{font-size:17px}
  .lmp-scard{flex-basis:126px}
  .lmp-sc-thumb{width:122px;height:69px}
  /* compact full-view chrome so every button fits the phone width */
  .lmp-fh-back{width:30px;height:30px}
  .lmp-fh-my{height:30px;padding:0 10px;margin-right:4px;font-size:11px}
  .lmp-bar.lmp-full .lmp-fullhead{gap:6px}
  .lmp-bar.lmp-full .lmp-ctrl{gap:6px}
  .lmp-bar.lmp-full .lmp-play{width:46px;height:46px;font-size:19px}
  .lmp-bar.lmp-full .lmp-ctrl .lmp-btn:not(.lmp-play){width:36px;height:36px;font-size:15px}
}

/* ghost: bar shell rendered only so My Music / sign-in overlays can appear
   before any music has played — the bar itself stays invisible */
.lmp-bar.lmp-ghost{visibility:hidden}
.lmp-bar.lmp-ghost .lmp-my,.lmp-bar.lmp-ghost .lmp-auth,.lmp-bar.lmp-ghost .lmp-plpop{visibility:visible}

/* ---------- POPUP mode: ad-hoc queues (All Songs page) ----------
   Compact centered player over a dimmed page — video + controls only.
   No track slider, no About/Lyrics: the page itself is the list. */
/* margin-auto centering, NOT transform — a transform would become the containing
   block for the fixed ::before backdrop and the overflow would clip it */
.lmp-bar.lmp-full.lmp-popup{inset:0;margin:auto;height:96vh;
  width:min(860px,96vw);max-height:96vh;overflow-y:auto;overflow-x:hidden;border-radius:18px;
  padding:0 20px 22px;box-shadow:0 30px 90px rgba(0,0,0,.65);border:1px solid rgba(255,215,175,.12);
  scrollbar-width:thin;scrollbar-color:rgba(255,215,175,.25) transparent}
.lmp-bar.lmp-full.lmp-popup::-webkit-scrollbar{width:7px;height:0}
.lmp-bar.lmp-full.lmp-popup::-webkit-scrollbar-thumb{background:rgba(255,215,175,.22);border-radius:999px}
.lmp-bar.lmp-full.lmp-popup::-webkit-scrollbar-track{background:transparent}
.lmp-bar.lmp-full.lmp-popup::before{content:'';position:fixed;inset:0;
  background:rgba(8,6,5,.72);backdrop-filter:blur(5px);z-index:-1}
.lmp-bar.lmp-full.lmp-popup .lmp-fh-back{display:none}
/* the popup keeps the thumbnail track strip AND About + Lyrics — it scrolls
   internally, so the full song story lives right inside it */
.lmp-bar.lmp-full.lmp-popup .lmp-content{width:100%}
.lmp-bar.lmp-full.lmp-popup .lmp-strip{width:100%;margin-top:2px}
.lmp-bar.lmp-full.lmp-popup .lmp-scard{flex-basis:112px}
.lmp-bar.lmp-full.lmp-popup .lmp-sc-thumb{width:108px;height:61px}
/* cap the video so the whole popup fits on screen without scrolling */
.lmp-bar.lmp-full.lmp-popup .lmp-video{width:min(100%, calc(48vh * 16 / 9));margin:4px auto 0}
.lmp-bar.lmp-full.lmp-popup .lmp-prog{width:100%}
.lmp-bar.lmp-full.lmp-popup .lmp-meta{width:100%}
.lmp-bar.lmp-full.lmp-popup .lmp-title{font-size:17px;-webkit-line-clamp:2}
.lmp-bar.lmp-full.lmp-popup .lmp-fullhead{width:calc(100% + 40px);margin:0 -20px 4px;border-radius:18px 18px 0 0}
@media(max-width:640px){
  .lmp-bar.lmp-full.lmp-popup{width:94vw;padding:0 12px 16px}
  .lmp-bar.lmp-full.lmp-popup .lmp-fullhead{width:calc(100% + 24px);margin:0 -12px 2px}
}

/* ===== engine frame: the persistent player strip inside the ERP shell ===== */
html.lm-engine, html.lm-engine body { background: transparent; }
html.lm-engine .lmp-bar { left: 0; right: 0; bottom: 0; margin: 0; border-radius: 0; }
/* bubble mode: the shell shrinks this frame to disc size — centre the disc
   with generous margin so the ripple "spike" rings render fully, and keep the
   drop-shadow TIGHT (a big blur clips at the frame edge and reads as a square) */
html.lm-engine .lmp-bubble { left: 25px !important; top: 25px !important; right: auto !important; bottom: auto !important;
  animation: none !important;   /* beat-scale reads as flicker inside the tiny frame */
  box-shadow: 0 3px 9px rgba(0,0,0,.35) !important; }

/* while a full-screen overlay (My Music / sign-in / playlist picker) is open,
   the page BEHIND it must not scroll — otherwise two scrollbars fight and
   wheel/touch scrolling chains through to the background page */
html:has(.lmp-my:not([hidden]):not(.lmp-my-inline)),
html:has(.lmp-auth:not([hidden])),
html:has(.lmp-plpop:not([hidden])) { overflow: hidden !important; }
.lmp-my, .lmp-auth, .lmp-plpop { overscroll-behavior: contain; }

/* playlist DETAIL: single header row (‹ Player lives inline with ‹ Playlists /
   title / Share) — the MY MUSIC banner row above is hidden to reclaim space */
.lmp-my.lmp-indetail .lmp-my-head { display: none; }
.lmp-my.lmp-indetail .lmp-my-body { margin-top: 0 !important; }

/* inside the ERP app the screen already says "Property Occupational Music" —
   the hero's own badge (and its ‹ back pill) is redundant on a main tab */
html.lm-embed .hero .eyebrow { display: none !important; }

/* ===== My Music: chips flow ===== */
.lmp-my-head{display:flex !important;align-items:center;gap:12px}
.lmp-my-title{flex:1;text-align:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lmp-my-back{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;flex:0 0 auto;
  background:none;border:1.5px solid var(--lmp-line2);border-radius:10px;color:var(--lmp-txt);cursor:pointer}
.lmp-my-back:hover{background:var(--lmp-panel);color:#fff}
.lmp-my-chips{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:14px 0 6px}
.lmp-my-chip{padding:7px 14px;border-radius:999px;border:1.5px solid var(--lmp-line2);background:none;
  color:var(--lmp-txt);font:inherit;font-size:13px;font-weight:600;cursor:pointer;white-space:nowrap}
.lmp-my-chip:hover{background:var(--lmp-panel);color:#fff}
.lmp-my-chip.on{background:var(--lmp-acc);border-color:var(--lmp-acc);color:#14100e;font-weight:700}
.lmp-my-chip b{font-weight:800;margin-left:2px}
/* the manager popup ("Playlists ＋"): list + create, dim backdrop */
.lmp-plmgr{position:absolute;inset:0;z-index:6;background:rgba(0,0,0,.55);
  display:flex;align-items:flex-start;justify-content:center;padding-top:72px}
.lmp-plmgr[hidden]{display:none !important}
.lmp-plmgr-box{position:relative;width:min(440px,92%);background:#171210;border:1px solid var(--lmp-line2);
  border-radius:16px;padding:18px;box-shadow:0 18px 44px rgba(0,0,0,.6)}
.lmp-plmgr-x{position:absolute;top:10px;right:10px;width:30px;height:30px;border:0;border-radius:50%;
  background:none;color:var(--lmp-mut);font-size:14px;cursor:pointer}
.lmp-plmgr-x:hover{background:var(--lmp-panel);color:#fff}
.lmp-plmgr-list{max-height:44vh;overflow:auto;margin:4px 0 12px}
.lmp-plmgr-row{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:9px;cursor:pointer;color:var(--lmp-txt)}
.lmp-plmgr-row:hover{background:var(--lmp-panel)}
.lmp-plmgr-row .t{flex:1;min-width:0}
.lmp-plmgr-row .t b{display:block;font-size:14px;color:var(--lmp-ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lmp-plmgr-row .t i{font-style:normal;font-size:12px;color:var(--lmp-dim)}
.lmp-my-back{font-size:19px;line-height:1;padding:0}
/* mockup round 2: big white "My Music" title, chips centered over the content */
.lmp-my-title{font-size:22px !important;font-weight:800 !important;color:var(--lmp-ink) !important;
  letter-spacing:.01em !important;text-transform:none !important}
.lmp-my-chips{justify-content:center}
/* mockup round 3: the ☰ / My Music / Share row and the chips align with the
   SONG LIST column (720px centered) — not the far screen edges; chips sit
   left-aligned with that column */
.lmp-my-head{max-width:720px;margin:0 auto;padding-left:16px;padding-right:16px}
.lmp-my-chips{max-width:720px;margin:16px auto 6px;padding:0 16px;justify-content:flex-start}
/* the manager's Create button matches the dark theme (it missed the styled
   class and fell back to the browser default) */
.lmp-plmgr-make{background:var(--lmp-acc);border:1px solid var(--lmp-acc);color:#14100e;
  font:inherit;font-size:13.5px;font-weight:700;padding:0 18px;border-radius:12px;cursor:pointer;
  white-space:nowrap;flex:0 0 auto}
.lmp-plmgr-make:hover{background:var(--lmp-acc2);border-color:var(--lmp-acc2)}
/* the head row sits on the overlay's own background — no black band */
.lmp-my-head{position:static;background:transparent !important;box-shadow:none !important;border:0 !important}
/* chip dragging feedback + back chevron sizing */
.lmp-my-chip[data-pid]{touch-action:none}
.lmp-my-chip.dragging{opacity:.75;transform:scale(1.07);box-shadow:0 8px 22px rgba(0,0,0,.55);cursor:grabbing}
.lmp-my-back{font-size:26px;line-height:1;padding:0 0 3px}

/* ===== APP MODE: the music screen opens straight at the library tabs =====
   The tall hero cards + section intro are website furniture — inside the app
   they made the screen bulky. The YouTube Playlists tab appears app-only. */
html.lm-embed .hero{display:none !important}
html.lm-embed #albums .section-head{display:none !important}
html.lm-embed #albums{padding-top:6px !important}
html.lm-embed .lm-tabs{margin-top:8px}
.lm-tab-yt{display:none}
html.lm-embed .lm-tab-yt{display:inline-block}

/* ===== My Music mounted INLINE in the /music page (no overlay, no page switch) ===== */
.lmp-my.lmp-my-inline{position:relative;inset:auto;z-index:auto;background:transparent;
  padding:0;overflow:visible;height:auto;min-height:0}
.lmp-my-inline .lmp-my-head{display:none !important}   /* the page's own tabs replace it */
.lmp-my-inline .lmp-my-chips{max-width:none;margin:6px 0 4px;padding:0;justify-content:flex-start}
.lmp-my-inline .lmp-my-body{max-width:none;margin:14px 0 30px;padding:0}
.lmp-my-inline .lmp-plmgr{position:fixed}              /* manager popup still covers the screen */
.lmp-chip-share{margin-left:auto}
/* inline panel sits on the CREAM page — dark-theme chips/rows need readable colours there */
.lmp-my-inline .lmp-my-chip{border-color:rgba(39,31,22,.25);color:#201a14;background:#fff}
.lmp-my-inline .lmp-my-chip:hover{background:#f2ead9;color:#201a14}
.lmp-my-inline .lmp-my-chip.on{background:var(--lmp-acc);border-color:var(--lmp-acc);color:#fff}
.lmp-my-inline .lmp-my-share{background:#fff;border-color:rgba(39,31,22,.25);color:#201a14}
.lmp-my-inline .lmp-my-row{background:#fff;box-shadow:0 3px 10px rgba(79,55,28,.07)}
.lmp-my-inline .lmp-my-row .t b{color:#201a14}
.lmp-my-inline .lmp-my-row .t i{color:#8a7a6a}
.lmp-my-inline .lmp-my-act{color:#5a4c3e}
.lmp-my-inline .lmp-dim{color:#8a7a6a}
/* nested-frame scrolling: the site's CSS smooth-scroll animates in the
   embedder's compositor and can swallow wheel/key scrolling entirely when the
   page runs inside the app's nested frame — instant scrolling there */
html.lm-embed, html.lm-embed body { scroll-behavior: auto !important; }
/* app mode: the songs toolbar loses its own background band — it sits on the
   page like the album filters do (the tinted sticky panel read as a stray box) */
html.lm-embed .lm-songs .toolbar{position:static;background:transparent;backdrop-filter:none;border-bottom:0;padding-top:0}
/* the floating-disc button matches its neighbours (it was falling back to the
   browser's default white button) */
.lmp-bub2{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;padding:0;
  background:var(--lmp-panel);border:1px solid var(--lmp-line2);border-radius:10px;color:var(--lmp-txt);cursor:pointer}
.lmp-bub2 svg{display:block}
.lmp-bub2:hover{background:rgba(255,215,175,.12);border-color:rgba(255,215,175,.3);color:var(--lmp-ink)}

/* forward (WhatsApp) — button shows in the expanded player only; chooser modal */
.lmp-fwdbtn{display:none !important}
.lmp-bar.lmp-full .lmp-fwdbtn{display:flex !important}
.lmp-fwd{position:fixed;inset:0;z-index:99999;background:rgba(8,6,5,.7);backdrop-filter:blur(4px);
  display:flex;align-items:center;justify-content:center}
.lmp-fwd[hidden]{display:none !important}
.lmp-fwd-box{width:min(340px,90vw);background:#171210;border:1px solid var(--lmp-line2);border-radius:16px;
  padding:20px;display:flex;flex-direction:column;gap:10px;box-shadow:0 18px 44px rgba(0,0,0,.6)}
.lmp-fwd-box b{font-size:15px;color:var(--lmp-ink);text-align:center;margin-bottom:4px}
.lmp-fwd-box button{font:inherit;font-size:14px;font-weight:600;padding:12px 14px;border-radius:12px;cursor:pointer;
  background:var(--lmp-panel);border:1px solid var(--lmp-line2);color:var(--lmp-txt);text-align:left}
.lmp-fwd-box button:hover{background:rgba(255,215,175,.12);color:#fff}
.lmp-fwd-box .lmp-fwd-x{background:none;border:0;color:var(--lmp-dim);text-align:center;padding:6px}
.lmp-fwd-box .lmp-fwd-x:hover{color:var(--lmp-acc2);background:none}

/* ===== PHONE compaction (the music pages) — everything in tidy single rows ===== */
@media(max-width:640px){
  .lm-tabs{flex-wrap:nowrap !important;gap:5px !important;overflow-x:auto;scrollbar-width:none}
  .lm-tabs::-webkit-scrollbar{display:none}
  .lm-tab{padding:8px 11px !important;font-size:12.5px !important;white-space:nowrap;flex:0 0 auto}
  /* Language / For: the label becomes a small heading, the chips share ONE row */
  .lm-songs .chiprow{display:flex !important;flex-wrap:nowrap !important;gap:4px !important;align-items:center;
    overflow-x:auto;scrollbar-width:none;flex-direction:row !important}
  .lm-songs .chiprow::-webkit-scrollbar{display:none}
  .lm-songs .chiprow{flex-wrap:wrap !important}
  .lm-songs .chiplbl{flex-basis:100%;margin:0 0 2px !important;font-size:10.5px !important;
    letter-spacing:.08em;text-transform:uppercase}
  .lm-songs .fchip{padding:6px 9px !important;font-size:11.5px !important;white-space:nowrap;flex:0 0 auto}
}
/* narrow phones: the mini bar must fit COMPLETELY — drop ♥ (it lives in the
   popup) and tighten everything one more notch */
@media(max-width:430px){
  .lmp-bar:not(.lmp-full) .lmp-like{display:none}
  .lmp-bar:not(.lmp-full){gap:5px;padding:7px 8px}
  .lmp-bar:not(.lmp-full) .lmp-video{width:74px}
  .lmp-bar:not(.lmp-full) .lmp-btn{width:33px;height:33px;font-size:14.5px}
  .lmp-bar:not(.lmp-full) .lmp-play{font-size:16px}
  .lmp-bar:not(.lmp-full) .lmp-meta{display:none}   /* title shows in the popup — space is king */
}
/* app mode: the album view goes straight to the covers — its search/filter
   panel is dead weight for 14 albums */
html.lm-embed #albumsView .filters-wrap{display:none !important}
/* the engine frame never shows its own scrollbars (transient squished states) */
html.lm-engine, html.lm-engine body{overflow:hidden !important}
/* disc mode: ONLY the disc may render — the live video (audio source) and
   everything else park off-screen, so no square tint behind the round disc */
html.lm-engine .lmp-bar.lmp-bubblemode > :not(.lmp-bubble){
  position:fixed !important;left:-9999px !important;top:0 !important;
  width:220px !important;height:124px !important}