/* Tight visual match to the approved mobile reference */
.player-app .wrap{max-width:430px;padding:0 10px 32px}
.player-app .topbar.topbar-hero{padding:4px 0 2px;justify-content:center}
.player-app .brand img.header-logo{width:42px!important;height:42px!important}
.player-app .search-block{margin:2px 0 10px}
.player-app .search-meta{display:none}
.player-app #search{min-height:42px!important;border-radius:10px!important;padding:9px 12px!important;font-size:14px!important}
.player-app .listen{padding:0!important;background:transparent!important;border:0!important;box-shadow:none!important}
.player-app .player-options{top:2px!important;right:2px!important}
.player-app .now-playing-head{margin:0!important;display:flex!important;flex-direction:column!important;align-items:center!important;text-align:center!important;gap:0!important}
.player-app .now-playing-head #player-cover{width:min(91vw,360px)!important;height:min(91vw,360px)!important;border-radius:8px!important;box-shadow:0 10px 24px rgba(0,0,0,.34)!important}
.player-app .now-playing-copy{padding-top:8px!important}
.player-app .listen h2#song-title{font-size:17px!important;margin:0!important;font-family:Arial,sans-serif!important;font-weight:700!important}
.player-app .track-meta{margin-top:5px!important;justify-content:center!important}
.player-app #song-artist{display:none!important}
.player-app #song-category{min-height:24px!important;padding:2px 10px!important;font-size:10px!important;border-radius:999px!important}
.player-app .mq3-waveform{height:54px!important;margin:5px auto 0!important;max-width:370px!important;gap:1.5px!important;padding:0 2px!important;display:flex!important;align-items:center!important;justify-content:center!important;overflow:hidden}
.player-app .mq3-waveform span{width:2px!important;min-width:2px!important;border-radius:999px!important;background:linear-gradient(#ff6488,#9c173f)!important;transform-origin:center center;will-change:transform,opacity;box-shadow:0 0 5px rgba(255,75,118,.18)}
.player-app .mq3-wave-label{display:none!important}
.mq3-transport{max-width:370px;margin:0 auto 8px}
.mq3-progress{height:4px;background:#6e5d61;border-radius:999px;position:relative;margin:0 2px 3px;cursor:pointer;overflow:visible;box-shadow:inset 0 1px 2px rgba(0,0,0,.55)}
.mq3-progress #mq3-progress-fill{position:absolute;left:0;top:0;bottom:0;width:0;background:linear-gradient(90deg,#e53466,#ff6f91);border-radius:999px;transition:width .18s linear}
.mq3-progress #mq3-progress-dot{position:absolute;left:0;top:50%;width:9px;height:9px;border-radius:50%;background:#ff9ab1;transform:translate(-50%,-50%);box-shadow:0 0 9px rgba(255,98,137,.55);transition:left .18s linear}
.mq3-time{display:flex;justify-content:space-between;font-size:10px;color:#bba6a1;margin:0 1px 4px;font-variant-numeric:tabular-nums}
.mq3-controls{display:grid;grid-template-columns:1fr 1fr 1.35fr 1fr 1fr;align-items:center;gap:4px}
.mq3-controls button{min-height:34px;padding:5px;border:0;background:transparent;color:#fff;border-radius:999px;font-size:18px}
.mq3-controls .mq3-main{width:48px;height:48px;justify-self:center;background:linear-gradient(#bf3153,#7f1734);border:1px solid #e7607f;box-shadow:0 6px 16px rgba(0,0,0,.35);font-size:20px}
.player-app .lyrics-panel{margin:7px 0 0!important;border-radius:11px!important;background:rgba(45,22,25,.92)!important;border-color:#5c3a3d!important}
.player-app .lyrics-panel>summary{padding:10px 11px!important;font-size:11px!important}
.player-app .lyrics-body{padding:10px 11px!important;max-height:390px!important}
.player-app .lyrics-body pre{font-size:12px!important;line-height:1.55!important}
.player-app .catalog-left{margin-top:16px!important}
.player-app .filters{margin-bottom:8px!important}
.player-app .song-row{padding:9px 4px!important}
.player-app .song-info small{display:none!important}
.player-app .song-row img{width:46px!important;height:46px!important;border-radius:7px!important}
.player-app .source-stack{margin:14px 0 0;border-top:1px solid rgba(151,97,40,.26);padding-top:10px}
.player-app .source-stack>summary{list-style:none;cursor:pointer;color:#c6ab9b;font-size:11px;text-align:center}
.player-app .source-stack>summary::-webkit-details-marker{display:none}
.player-app .source-stack>summary::after{content:' ▾'}
.player-app .source-stack[open]>summary::after{content:' ▴'}
.player-app .source-stack .platforms{margin:9px 0 10px!important}
.player-app .source-stack .player{margin:0 auto!important}
.player-app .support-artist{margin-top:18px!important}
@media(prefers-reduced-motion:reduce){.player-app .mq3-waveform span{transform:none!important}.mq3-progress #mq3-progress-fill,.mq3-progress #mq3-progress-dot{transition:none}}
@media(min-width:801px){.player-app .wrap{max-width:520px}.player-app .now-playing-head #player-cover{width:390px!important;height:390px!important}.player-app .lyrics-body pre{font-size:13px!important}}
/* Photographic covers: keep the title on the artwork, without duplicate metadata. */
.player-app .cover-frame{position:relative;max-width:100%;overflow:hidden;border-radius:12px;line-height:0}
.player-app .now-playing-head #player-cover{display:block;max-width:100%;object-fit:cover}
.player-app .artwork-title{position:absolute;bottom:0;left:0;right:0;padding:65px 20px 28px;background:linear-gradient(transparent,rgba(0,0,0,.85));color:#ffe3a0;font:clamp(24px,7vw,38px)/1.15 Georgia,serif;text-align:center;overflow-wrap:anywhere;text-shadow:0 2px 8px #000}
.player-app .artwork-title:empty{display:none}
.player-app .now-playing-copy{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip-path:inset(50%);white-space:nowrap}
.mq3-controls .mq3-main{display:grid;place-items:center}
.mq3-controls .mq3-main svg{width:23px;height:23px;fill:currentColor}
.mq3-controls button:focus-visible,.mq3-progress:focus-visible{outline:2px solid #ffe3a0;outline-offset:5px}
.mq3-controls button:disabled{opacity:.45;cursor:wait}
.mq3-progress::before{content:'';position:absolute;inset:-10px 0}
/* Larger centered brand, proportional to the square cover on every screen. */
.player-app .topbar.topbar-hero{position:relative;display:flex;justify-content:center;align-items:center;padding:14px 0 12px;min-height:0}
.player-app .brand img.header-logo{width:clamp(92px,25vw,112px)!important;height:clamp(92px,25vw,112px)!important;object-fit:contain}
.player-app .topbar #demo{position:absolute;right:4px;top:14px;font-size:10px}
.player-app .search-block{margin-top:0;margin-bottom:12px}

/* Artwork-derived atmosphere, kept behind the readable player surface. */
body.player-app{position:relative;isolation:isolate;background:radial-gradient(ellipse at 50% 10%,#481820 0%,#260b12 44%,#10060c 100%);background-attachment:fixed}
.ambient-backdrop{position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none;background:radial-gradient(ellipse at 50% 15%,rgba(202,143,69,.12),transparent 55%)}
.ambient-backdrop img{position:absolute;left:50%;top:7%;width:min(130vw,1100px);height:90vh;object-fit:cover;transform:translateX(-50%) scale(1.08);filter:blur(65px) saturate(1.25);opacity:0;transition:opacity .6s ease}
.ambient-backdrop img.loaded{opacity:.23}
.ambient-backdrop::before{content:"";position:absolute;inset:0;z-index:1;background:radial-gradient(ellipse at 50% 32%,transparent 10%,rgba(15,4,10,.52) 72%),linear-gradient(180deg,rgba(47,10,18,.18),rgba(17,5,11,.65))}
.ambient-backdrop::after{content:"";position:absolute;inset:0;z-index:2;opacity:.11;background-image:radial-gradient(rgba(255,226,176,.35) .5px,transparent .7px);background-size:3px 3px}
.player-app .topbar.topbar-hero::before,.player-app .topbar.topbar-hero::after{content:"";position:absolute;top:50%;height:1px;width:calc(50% - 78px);background:linear-gradient(90deg,transparent,rgba(223,177,91,.55));box-shadow:0 0 12px rgba(228,164,75,.12);pointer-events:none}
.player-app .topbar.topbar-hero::before{left:8px}
.player-app .topbar.topbar-hero::after{right:8px;transform:rotate(180deg)}
.player-app .brand{position:relative;border-radius:50%;background:radial-gradient(ellipse,rgba(239,175,76,.15),transparent 70%)}
.player-app .brand img.header-logo{filter:drop-shadow(0 0 18px rgba(226,159,59,.19))}
.player-app .cover-frame{box-shadow:0 20px 42px rgba(0,0,0,.5),0 0 38px rgba(215,145,65,.12);border:1px solid rgba(243,207,145,.18)}
.player-app #search{background:rgba(27,7,11,.78)!important}
@media(max-width:520px){.ambient-backdrop img{filter:blur(42px) saturate(1.2)}}
@media(prefers-reduced-motion:reduce){.ambient-backdrop img{transition:none}}


/* Readable cover titles and generous touch controls. */
.player-app .artwork-title{padding:70px 22px 26px;font-size:clamp(26px,7.5vw,38px);line-height:1.18;text-wrap:balance;letter-spacing:.2px;background:linear-gradient(transparent,rgba(0,0,0,.9))}
.mq3-controls{gap:8px;padding:8px 0}
.mq3-controls button{min-width:44px;min-height:44px}
.mq3-controls .mq3-main{width:64px;height:64px;box-shadow:0 8px 22px rgba(0,0,0,.4),0 0 18px rgba(229,52,102,.16)}
.mq3-controls .mq3-main svg{width:28px;height:28px}
.mq3-controls #mq3-repeat.loop-active{color:#ffe3a0;background:rgba(224,176,88,.14);box-shadow:inset 0 0 0 1px rgba(224,176,88,.55)}
.mq3-progress{height:6px;margin-top:4px}
.mq3-progress #mq3-progress-dot{width:12px;height:12px}


/* Decorative musical header: background-only symbols stay out of the tab order. */
.player-app .topbar.topbar-hero::before,
.player-app .topbar.topbar-hero::after{
 width:calc(50% - 76px);max-width:144px;height:86px;top:50%;
 transform:translateY(-50%);box-shadow:none;
 background-color:transparent;background-repeat:no-repeat;background-position:center;
 background-size:contain;opacity:.65;pointer-events:none;
}
.player-app .topbar.topbar-hero::before{
 left:8px;background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20144%2090%22%20fill%3D%22none%22%20stroke%3D%22%23d4aa62%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cg%20opacity%3D%22.88%22%20transform%3D%22translate(16%2035)%20rotate(-6%2042%2018)%22%3E%3Crect%20width%3D%2284%22%20height%3D%2236%22%20rx%3D%223%22%2F%3E%3Cpath%20d%3D%22M12%200v36M24%200v36M36%200v36M48%200v36M60%200v36M72%200v36%22%2F%3E%3Cpath%20d%3D%22M9%200h6v21H9zM21%200h6v21h-6zM45%200h6v21h-6zM57%200h6v21h-6zM69%200h6v21h-6z%22%20fill%3D%22%23d4aa62%22%20stroke%3D%22none%22%2F%3E%3C%2Fg%3E%3Cpath%20d%3D%22M107%2039V14l17-4v24M107%2020l17-4%22%2F%3E%3Cellipse%20cx%3D%22102%22%20cy%3D%2240%22%20rx%3D%225%22%20ry%3D%223.5%22%20fill%3D%22%23d4aa62%22%2F%3E%3Cellipse%20cx%3D%22119%22%20cy%3D%2235%22%20rx%3D%225%22%20ry%3D%223.5%22%20fill%3D%22%23d4aa62%22%2F%3E%3Cpath%20d%3D%22M33%2022V9l8%203%22%2F%3E%3Cellipse%20cx%3D%2229%22%20cy%3D%2223%22%20rx%3D%224%22%20ry%3D%223%22%20fill%3D%22%23d4aa62%22%2F%3E%3C%2Fsvg%3E");
}
.player-app .topbar.topbar-hero::after{
 right:8px;background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20144%2090%22%20fill%3D%22none%22%20stroke%3D%22%23d4aa62%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cg%20opacity%3D%22.88%22%20transform%3D%22translate(81%2045)%20rotate(31)%20translate(-81%20-45)%22%3E%3Cpath%20d%3D%22M78%2031V9h6v22c11-4%2017%206%2012%2015-3%205%209%2010%208%2020-1%2012-11%2017-23%2017s-22-5-23-17c-1-10%2011-15%208-20-5-9%201-19%2012-15Z%22%2F%3E%3Crect%20x%3D%2277%22%20y%3D%222%22%20width%3D%228%22%20height%3D%2212%22%20rx%3D%222%22%2F%3E%3Ccircle%20cx%3D%2281%22%20cy%3D%2251%22%20r%3D%226%22%2F%3E%3Cpath%20d%3D%22M74%2069h14M80%2014v55M83%2014v55M75%205h2M85%208h2%22%2F%3E%3C%2Fg%3E%3Cpath%20d%3D%22M24%2049V24l16-4v24M24%2030l16-4%22%2F%3E%3Cellipse%20cx%3D%2219%22%20cy%3D%2250%22%20rx%3D%225%22%20ry%3D%223.5%22%20fill%3D%22%23d4aa62%22%2F%3E%3Cellipse%20cx%3D%2235%22%20cy%3D%2245%22%20rx%3D%225%22%20ry%3D%223.5%22%20fill%3D%22%23d4aa62%22%2F%3E%3Cpath%20d%3D%22M122%2022V10l7%203%22%2F%3E%3Cellipse%20cx%3D%22118%22%20cy%3D%2223%22%20rx%3D%224%22%20ry%3D%223%22%20fill%3D%22%23d4aa62%22%2F%3E%3C%2Fsvg%3E");
}
/* Seek track and both time labels share 80% of the artwork's width. */
.player-app{--mq3-seek-width:min(72.8vw,288px)}
.player-app .mq3-progress,.player-app .mq3-time{
 width:var(--mq3-seek-width);max-width:100%;box-sizing:border-box;
 margin-left:auto;margin-right:auto;
}
.player-app .mq3-waveform{height:44px!important;margin-bottom:0!important}
.player-app .mq3-transport{margin-top:-2px}
@media(min-width:801px){.player-app{--mq3-seek-width:312px}}
@media(max-width:360px){
 .player-app .topbar.topbar-hero::before,.player-app .topbar.topbar-hero::after{width:calc(50% - 65px);height:72px}
}