/* ================================================================
   Spirit Valhalla Music Player — player.css
   Floating, discreet, dark metal with cold blue focus and ember accents.
   ================================================================ */
.svsp{
  --svsp-bg:rgba(13,15,19,.94);
  --svsp-line:rgba(199,205,211,.14);
  --svsp-steel:#c7cdd3;
  --svsp-hi:#eef1f3;
  --svsp-ash:#8d939a;
  --svsp-frost:#7f9bb3;
  --svsp-ember:#c62b1f;
  --svsp-ember-hi:#e0452a;
  position:fixed;z-index:90;bottom:max(16px,env(safe-area-inset-bottom));
  font-family:'Barlow','Helvetica Neue',Arial,sans-serif;color:var(--svsp-steel);line-height:1.3;
}
.svsp[hidden]{display:none!important}
.svsp *,.svsp *::before,.svsp *::after{box-sizing:border-box}
.svsp p{margin:0}
.svsp button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;padding:0}
.svsp :focus-visible{outline:2px solid var(--svsp-frost);outline-offset:2px}
.svsp--br{right:max(16px,env(safe-area-inset-right))}
.svsp--bl{left:max(16px,env(safe-area-inset-left))}
.svsp--bc{left:50%;transform:translateX(-50%)}

/* Minimized pill */
.svsp__mini{display:none;align-items:center;gap:.7rem;max-width:min(320px,calc(100vw - 32px));min-height:46px;padding:.55rem 1rem .55rem .9rem;background:var(--svsp-bg);border:1px solid var(--svsp-line)!important;border-radius:999px!important;box-shadow:0 14px 40px -16px rgba(0,0,0,.9);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);transition:border-color .3s}
.svsp__mini:hover{border-color:rgba(127,155,179,.5)!important}
.svsp__note{color:var(--svsp-ember-hi);font-size:1rem}
.svsp__mini-text{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-family:'Barlow Condensed','Arial Narrow',sans-serif;font-weight:600;font-size:.82rem;letter-spacing:.16em;text-transform:uppercase;color:var(--svsp-hi)}
.svsp__mini-state{flex:none;width:0;height:0;border-left:8px solid var(--svsp-hi);border-top:5px solid transparent;border-bottom:5px solid transparent;margin-left:.2rem}
.svsp.is-playing .svsp__mini-state{width:9px;height:10px;border:0;border-left:3px solid var(--svsp-ember-hi);border-right:3px solid var(--svsp-ember-hi)}
.svsp[data-state="minimized"] .svsp__mini{display:inline-flex}
.svsp[data-state="minimized"] .svsp__panel{display:none}

/* Expanded panel */
.svsp__panel{position:relative;display:grid;grid-template-columns:56px minmax(0,1fr);grid-template-areas:"cover info" "controls controls";gap:.8rem 1rem;width:min(380px,calc(100vw - 32px));padding:1rem 1rem .9rem;background:var(--svsp-bg);border:1px solid var(--svsp-line);box-shadow:0 24px 60px -24px rgba(0,0,0,.95);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
.svsp__panel::before{content:"";position:absolute;left:-1px;top:-1px;width:40px;height:1px;background:var(--svsp-ember-hi)}
.svsp__cover{grid-area:cover;width:56px;height:56px;object-fit:cover;display:block;background:linear-gradient(135deg,#1c2026,#0b0d10);border:1px solid var(--svsp-line)}
.svsp__info{grid-area:info;min-width:0;padding-right:3.6rem}
.svsp__artist{font-family:'Barlow Condensed','Arial Narrow',sans-serif;font-weight:600;font-size:.72rem;letter-spacing:.3em;text-transform:uppercase;color:var(--svsp-ash)}
.svsp__label{margin-top:.1rem!important;font-family:'Barlow Condensed','Arial Narrow',sans-serif;font-size:.66rem;letter-spacing:.28em;text-transform:uppercase;color:var(--svsp-frost)}
.svsp.is-playing .svsp__label{color:var(--svsp-ember-hi)}
.svsp__title{margin-top:.25rem!important;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-family:'Cinzel','Trajan Pro',Georgia,serif;font-weight:600;font-size:.98rem;letter-spacing:.04em;color:var(--svsp-hi)}
.svsp__controls{grid-area:controls;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:.8rem}
.svsp__play{display:grid;place-items:center;width:44px;height:44px;border-radius:50%!important;border:1px solid rgba(255,255,255,.35)!important;color:#fff;transition:background .3s,border-color .3s}
.svsp__play:hover{background:var(--svsp-ember);border-color:var(--svsp-ember-hi)!important}
.svsp__i-pause,.svsp.is-playing .svsp__i-play{display:none}
.svsp.is-playing .svsp__i-pause{display:block}
.svsp__i-play{margin-left:2px}
.svsp__progress{display:grid;gap:.25rem;min-width:0}
.svsp__time{font-size:.72rem;color:var(--svsp-ash);font-variant-numeric:tabular-nums}
.svsp__vol{display:flex;align-items:center;gap:.35rem}
.svsp__mute{display:grid;place-items:center;width:32px;height:32px;color:var(--svsp-steel)}
.svsp__i-muted,.svsp.is-muted .svsp__i-vol{display:none}
.svsp.is-muted .svsp__i-muted{display:block}
.svsp__volume{width:64px}
.svsp__win{position:absolute;top:.5rem;right:.5rem;display:flex;gap:.1rem}
.svsp__win button{display:grid;place-items:center;width:32px;height:32px;color:var(--svsp-ash);transition:color .25s}
.svsp__win button:hover{color:#fff}

/* Range inputs */
.svsp input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:18px;margin:0;background:transparent;cursor:pointer}
.svsp input[type=range]::-webkit-slider-runnable-track{height:2px;background:rgba(199,205,211,.22)}
.svsp input[type=range]::-moz-range-track{height:2px;background:rgba(199,205,211,.22)}
.svsp input[type=range]::-moz-range-progress{height:2px;background:var(--svsp-ember-hi)}
.svsp input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:12px;height:12px;margin-top:-5px;border-radius:50%;background:var(--svsp-hi);border:0;box-shadow:0 0 0 3px rgba(224,69,42,.25)}
.svsp input[type=range]::-moz-range-thumb{width:12px;height:12px;border-radius:50%;background:var(--svsp-hi);border:0}

/* Mobile: compact, never over navigation; leaves room for the last Add to cart */
@media (max-width:767px){
  body.svs-has-player{padding-bottom:72px}
  .svsp{bottom:max(12px,env(safe-area-inset-bottom))}
  .svsp--br{right:12px}.svsp--bl{left:12px}
  .svsp__mini{max-width:calc(100vw - 24px)}
  .svsp[data-state="expanded"]{left:12px;right:12px;transform:none}
  .svsp__panel{width:100%}
  .svsp__volume{display:none}
}
@media (prefers-reduced-motion:reduce){.svsp *{transition:none!important}}