/* v15.5: stable customization hooks, lyrics studio and compact mobile widgets. */
:root{--lyrics-accent:#b5d4ff;--lyrics-size:17px;--lyrics-height:154px;--lyrics-glow:20px;--entry-accent:#a6c8ff}
body .lyrics{height:var(--lyrics-height);min-width:0;isolation:isolate}
body .lyrics-track{transition:transform .55s cubic-bezier(.22,.8,.25,1)}
body .lyrics-line{height:auto;min-height:40px;line-height:1.45;padding:7px 5px;font-size:var(--lyrics-size);white-space:normal;overflow-wrap:anywhere;opacity:.26;filter:blur(.8px);transform:none;text-shadow:none;transition:opacity .35s,filter .35s,color .35s,transform .4s}
body .lyrics-line.active{opacity:1;filter:none;color:var(--lyrics-accent);text-shadow:none;transform:none}
body .lyrics-line.past{opacity:.2}
body[data-lyrics-style=focus] .lyrics-line.active{transform:translateX(3px);font-weight:700}
body[data-lyrics-style=glow] .lyrics-line.active{text-shadow:0 0 var(--lyrics-glow) var(--lyrics-accent);font-weight:700}
body[data-lyrics-style=karaoke] .lyrics-line.active .lyrics-text{color:var(--lyrics-accent);background:linear-gradient(90deg,var(--lyrics-accent) var(--line-progress,0%),#ffffff55 var(--line-progress,0%));background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;box-decoration-break:clone;-webkit-box-decoration-break:clone;text-shadow:none}
body[data-lyrics-style=cinema] .lyrics-line{text-align:center;letter-spacing:.015em;filter:none;opacity:.12}
body[data-lyrics-style=cinema] .lyrics-line.active{opacity:1;transform:scale(1.025);font-weight:600}
body[data-lyrics-style=clean] .lyrics-line{filter:none;opacity:.48}
body[data-lyrics-style=clean] .lyrics-line.active{opacity:1;font-weight:700}
body .player[data-skin=minimal] .player-heading{display:flex;justify-content:flex-end;margin:0}
body .player[data-skin=minimal] .player-heading>span{display:none}
body[data-player-placement=corner] .player{max-height:calc(100dvh - 100px);overflow-y:auto;overscroll-behavior:contain}
body[data-composition=spotlight] #chips{justify-content:center}

/* A centered entry portal. The full loader is still the accessible enter button. */
.loader-eyebrow,.loader-subtitle,.loader-footer,.loader-aura{display:none}
.loader[data-style]:not([data-style=classic]){background:var(--loader-bg);text-align:center;padding:24px}
.loader[data-style]:not([data-style=classic]) .loader-aura{display:block;position:absolute;inset:12%;pointer-events:none;background:radial-gradient(ellipse at 50% 45%,#a6c8ff18,transparent 55%);animation:entryDrift 9s ease-in-out infinite alternate}
.loader[data-style]:not([data-style=classic]) .loader-inner{position:relative;z-index:1;width:min(460px,100%);max-height:calc(100dvh - 100px);overflow:auto;display:flex;align-items:center;flex-direction:column;padding:34px 20px;gap:0}
.loader[data-style]:not([data-style=classic]) .loader-eyebrow{display:block;font:10px var(--mono);letter-spacing:.32em;color:var(--entry-accent);opacity:.7;margin-bottom:25px}
.loader[data-style]:not([data-style=classic]) .loader-name{font:400 clamp(22px,5vw,36px)/1.3 var(--font);letter-spacing:.04em;text-indent:0;text-transform:none;animation:none;color:#f2f5ff;margin:0 0 28px;overflow-wrap:anywhere;max-width:100%}
.loader[data-style]:not([data-style=classic]) .loader-ring{margin:0;width:112px;height:112px;transition:transform .3s;flex-shrink:0}
.loader[data-style]:not([data-style=classic]):hover .loader-ring{transform:scale(1.055)}
.loader[data-style]:not([data-style=classic]) .loader-subtitle{display:block;font:300 14px/1.6 var(--font);color:#d5dceda6;max-width:300px;margin:26px 0 12px;overflow-wrap:anywhere}
.loader[data-style]:not([data-style=classic]) .loader-subtitle:empty{display:none}
.loader[data-style]:not([data-style=classic]) .loader-hint{margin:12px 0 0;font:11px/1.6 var(--mono);letter-spacing:.14em;color:var(--loader-text);overflow-wrap:anywhere;max-width:100%}
.loader[data-style]:not([data-style=classic]) .loader-footer{display:flex;justify-content:space-between;gap:16px;position:absolute;bottom:max(25px,env(safe-area-inset-bottom));left:35px;right:35px;font:9px var(--mono);letter-spacing:.12em;color:#ffffff50;pointer-events:none}
.loader[data-style=portal] .loader-ring::before{content:'';position:absolute;inset:-22px;border:1px solid #b4d1ff1c;border-radius:50%;box-shadow:0 0 70px #aacaff13}
.loader[data-style=portal] .ring-halo{box-shadow:0 0 50px #a6c8ff25}
.loader[data-style=glass] .loader-inner{border:1px solid #ffffff22;border-radius:30px;background:linear-gradient(145deg,#ffffff0e,#ffffff03);box-shadow:0 30px 90px #0004,inset 0 1px #ffffff0b;padding:40px 25px}
.loader[data-style=glass] .loader-aura{background:radial-gradient(ellipse at 30% 30%,#ada2ff24,transparent 60%),radial-gradient(ellipse at 75% 75%,#8ccfff18,transparent 60%)}
.loader[data-style=minimal] :is(.loader-aura,.loader-scan,.loader-corner,.ring-ping,.ring-halo){display:none}
.loader[data-style=minimal] .loader-name{font-size:26px!important}
.loader[data-style=minimal] .loader-ring{width:82px!important;height:82px!important}
.loader:focus-visible{outline:2px solid var(--entry-accent);outline-offset:-8px}
.loader:focus-visible .loader-ring{filter:drop-shadow(0 0 12px var(--entry-accent))}
@keyframes entryDrift{from{transform:translateY(-2%) scale(.94);opacity:.6}to{transform:translateY(2%) scale(1.06);opacity:1}}

/* Remove the inherited horizontal widget carousel, including its fixed track widths. */
@media(max-width:860px){
 body .card .widget-stack{display:flex;flex-direction:column;grid-auto-flow:row;grid-template-columns:minmax(0,1fr);width:100%;max-width:100%;min-width:0;margin:15px 0 0;padding:0;gap:12px;overflow:visible;contain:none;scroll-snap-type:none}
 body .card .widget-stack>*{max-width:100%;min-width:0;box-sizing:border-box}
 body .card #rbxCard{display:grid;grid-template-columns:68px minmax(0,1fr);min-height:0;width:100%;padding:0!important;gap:0;overflow:hidden}
 body .card #rbxCard[hidden]{display:none}
 body .card #rbxCard .rbx-visual{min-height:0;height:100%;align-items:center}
 body .card #rbxCard .rbx-avatar{width:66px;height:100px;max-width:100%;filter:none}
 body .card #rbxCard .rbx-logo{font-size:12px;top:7px;left:7px}
 body .card #rbxCard .rbx-body{padding:11px;min-width:0}
 body .card #rbxCard .rbx-head{gap:5px;flex-wrap:wrap}
 body .card #rbxCard .rbx-head>div{min-width:0;max-width:100%}
 body .card #rbxCard .rbx-name{font-size:14px;line-height:1.3;overflow-wrap:anywhere;white-space:normal}
 body .card #rbxCard .rbx-handle{font-size:10px;overflow-wrap:anywhere}
 body .card #rbxCard .rbx-presence{font-size:9px;padding:3px 6px;max-width:100%;white-space:normal}
 body .card #rbxCard .rbx-stats{grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;margin:8px 0}
 body .card #rbxCard .rbx-stats span{padding:6px 2px;min-width:0}
 body .card #rbxCard .rbx-stats b{font-size:10px;overflow-wrap:anywhere}
 body .card #rbxCard .rbx-stats small{font-size:8px;overflow-wrap:anywhere}
 body .card #rbxCard .rbx-description{display:none}
 body .card #rbxCard .rbx-actions{flex-wrap:wrap;gap:5px}
 body .card #rbxCard .rbx-btn{font-size:10px;padding:5px 9px;text-align:center;white-space:normal}
}
@media(max-width:480px){
 .loader[data-style]:not([data-style=classic]) .loader-footer{justify-content:center;left:15px;right:15px;font-size:8px}
 .loader-footer>span:last-child{display:none}
 body .lyrics{height:var(--lyrics-height,140px)}
 body .player{max-width:calc(100vw - 28px);box-sizing:border-box}
 body .player .player-body{min-width:0}
}
@media(prefers-reduced-motion:reduce){
 .loader .loader-aura{animation:none!important}
 body .lyrics-track,body .lyrics-line{transition:none!important}
 body .lyrics-line.active{transform:none!important}
}
