:root{--bg:#030309;--panel:#08080f;--purple:#b333ff;--purple2:#7c2cc9;--line:#6b4280;--gold:#f6c94f;--muted:#aaa9b5;--white:#fff}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:#020205;color:#fff;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif}body{overflow-x:hidden}
.mixfm-page{min-height:100vh;padding:28px 14px 44px;background:radial-gradient(78% 46% at 50% -8%,rgba(220,18,38,.22),transparent 64%),radial-gradient(42% 72% at -10% 46%,rgba(185,12,30,.18),transparent 68%),radial-gradient(42% 72% at 110% 56%,rgba(185,12,30,.16),transparent 68%),linear-gradient(180deg,#090207 0%,#020205 46%,#080104 100%)}
.mixfm-shell{position:relative;width:min(100%,790px);margin:auto;padding:22px 26px 26px;border:1.7px solid rgba(235,30,48,.92);border-radius:34px;background:linear-gradient(155deg,rgba(10,10,18,.98),rgba(3,3,8,.99) 58%,rgba(8,4,13,.99));box-shadow:inset 0 0 60px rgba(160,18,35,.055),0 25px 80px rgba(0,0,0,.5),0 0 28px rgba(210,18,36,.06)}
.mixfm-shell:before,.mixfm-shell:after{content:"";position:absolute;pointer-events:none;z-index:0;border-radius:50%;filter:blur(28px);opacity:.22}.mixfm-shell:before{width:230px;height:230px;left:-150px;top:180px;background:#b51025}.mixfm-shell:after{width:230px;height:230px;right:-160px;bottom:180px;background:#b51025}
.mixfm-approved-brand{position:relative;z-index:1;text-align:center;margin:0 auto 6px;overflow:hidden}.mixfm-approved-brand img{display:block;width:min(100%,665px);height:auto!important;max-height:none!important;object-fit:contain;margin:0 auto;aspect-ratio:664/325}
.mixfm-player,.mixfm-history{position:relative;z-index:1;background:linear-gradient(125deg,#08080e 0%,#07070c 66%,#0b0b11 100%);border:2px solid rgba(112,68,137,.79);border-radius:32px;box-shadow:inset 0 0 36px rgba(90,32,126,.045)}
.mixfm-player{padding:38px 40px 30px}.mixfm-player-top{display:grid;grid-template-columns:220px minmax(0,1fr);gap:38px;align-items:start}.mixfm-cover-box{width:220px;aspect-ratio:1;border:4px solid #a72dff;border-radius:27px;padding:0;overflow:hidden;box-shadow:0 0 0 1px rgba(190,69,255,.18),0 0 18px rgba(159,43,255,.12)}.mixfm-cover-box img{display:block;width:100%;height:100%;object-fit:cover}
.mixfm-track{min-width:0;padding-top:8px}.mixfm-eyebrow{color:#bb45ff;font-weight:800;font-size:27px;line-height:1.1;margin-bottom:25px}.mixfm-artist{font-weight:800;font-size:32px;line-height:1.18;white-space:normal}.mixfm-title{font-weight:800;font-size:43px;line-height:1.05;margin-top:19px;white-space:normal;overflow:visible;text-overflow:clip;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2}.mixfm-meta{font-size:23px;color:#aaa9b5;margin-top:20px}.mixfm-status{min-height:20px;margin-top:7px;color:#af7bd2;font-size:12px;font-weight:700;letter-spacing:.06em}
.mixfm-controls{width:min(100%,590px);margin:35px auto 0;display:grid;gap:15px}.mixfm-btn{appearance:none;border:0;cursor:pointer;width:100%;height:92px;border-radius:50px;font-weight:900;font-size:30px;letter-spacing:.01em;display:flex;align-items:center;justify-content:center;gap:20px}.mixfm-btn-web{background:linear-gradient(90deg,#8d21ec,#bd31ff 52%,#a12cf0);color:#fff;box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 10px 28px rgba(120,25,210,.12)}.mixfm-btn-flac{background:#15151a;color:var(--gold);border:4px solid var(--gold);height:86px}.mixfm-icon{font-size:.78em}.mixfm-volume{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:30px;color:#aaa9b5;font-size:24px;font-weight:800;padding:8px 6px 0}.mixfm-volume input{width:100%;accent-color:#b72fff;height:7px}
.mixfm-history{margin-top:15px;padding:22px 29px 20px}.mixfm-history-head{display:flex;align-items:center;justify-content:space-between;padding:0 0 14px;border-bottom:1px solid rgba(255,255,255,.09)}.mixfm-history-title{font-size:27px;font-weight:850;color:#b940ff}.mixfm-clock{display:inline-grid;place-items:center;width:30px;height:30px;margin-right:8px;border:3px solid #b940ff;border-radius:50%;font-size:19px;line-height:1}.mixfm-history-more{font-size:16px;color:#b9b8c0}.mixfm-history-list{display:block}.mixfm-history-item{display:grid;grid-template-columns:78px minmax(0,1fr) auto;gap:20px;align-items:center;min-height:92px;padding:9px 0;border-bottom:1px solid rgba(255,255,255,.1)}.mixfm-history-item:last-child{border-bottom:0}.mixfm-history-item img{width:78px;height:78px;object-fit:cover;border-radius:8px}.mixfm-history-copy{min-width:0;display:grid;gap:6px}.mixfm-history-copy strong{font-size:21px}.mixfm-history-copy span{font-size:20px;color:#aaa9b5;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mixfm-history-item time{color:#aaa9b5;font-size:18px}.mixfm-history-empty{padding:28px 5px;color:#aaa9b5;text-align:center}
@media(max-width:700px){.mixfm-page{padding:12px 10px 30px}.mixfm-shell{padding:12px 13px 14px;border-radius:27px}.mixfm-approved-brand{margin-bottom:0}.mixfm-approved-brand img{width:100%;aspect-ratio:664/325}.mixfm-player{padding:22px 20px 20px;border-radius:25px}.mixfm-player-top{grid-template-columns:31% minmax(0,1fr);gap:21px}.mixfm-cover-box{width:100%;border-width:3px;border-radius:18px}.mixfm-track{padding-top:3px}.mixfm-eyebrow{font-size:17px;margin-bottom:15px}.mixfm-artist{font-size:18px;line-height:1.25}.mixfm-title{font-size:29px;margin-top:13px}.mixfm-meta{font-size:15px;margin-top:13px}.mixfm-status{font-size:9px;min-height:10px}.mixfm-controls{margin-top:25px;gap:10px}.mixfm-btn{height:61px;border-radius:34px;font-size:20px;gap:12px}.mixfm-btn-flac{height:60px;border-width:3px;font-size:18px}.mixfm-volume{font-size:17px;gap:18px;padding-top:6px}.mixfm-history{margin-top:10px;padding:14px 16px 12px;border-radius:24px}.mixfm-history-title{font-size:18px}.mixfm-clock{width:22px;height:22px;border-width:2px;font-size:14px}.mixfm-history-more{font-size:11px}.mixfm-history-item{grid-template-columns:49px minmax(0,1fr) auto;gap:12px;min-height:62px;padding:6px 0}.mixfm-history-item img{width:49px;height:49px;border-radius:5px}.mixfm-history-copy strong{font-size:14px}.mixfm-history-copy span{font-size:13px}.mixfm-history-item time{font-size:12px}}
@media(max-width:390px){.mixfm-player{padding-left:16px;padding-right:16px}.mixfm-player-top{gap:16px}.mixfm-title{font-size:26px}.mixfm-artist{font-size:16px}.mixfm-btn{font-size:18px}.mixfm-btn-flac{font-size:16px}}

/* v14 visual-only refinements */
.mixfm-history-item time{display:none!important}

/* v17 — approved cyan / neon preview skin. Visual colors only; layout and functionality unchanged. */
:root{--cyan:#16d9f3;--cyan2:#08b9df;--neon:#efff00;--navy:#03141f;--navy2:#061b27;--muted2:#a8bcc8}
html,body{background:#08bde2}
.mixfm-page{
  background:
    radial-gradient(70% 50% at 50% 8%,rgba(255,255,255,.13),transparent 60%),
    radial-gradient(46% 78% at -8% 48%,rgba(0,229,255,.34),transparent 67%),
    radial-gradient(46% 78% at 108% 48%,rgba(0,229,255,.34),transparent 67%),
    linear-gradient(180deg,#11c5e6 0%,#08b7dc 48%,#11c7e8 100%);
}
.mixfm-shell{
  border-color:var(--cyan);
  background:linear-gradient(155deg,#061923 0%,#03111a 58%,#061923 100%);
  box-shadow:inset 0 0 60px rgba(18,217,243,.055),0 25px 80px rgba(0,0,0,.38),0 0 30px rgba(16,217,243,.16)
}
.mixfm-shell:before{background:#12d9f3;opacity:.16}.mixfm-shell:after{background:#12d9f3;opacity:.16}
.mixfm-player,.mixfm-history{background:linear-gradient(125deg,#041722 0%,#03131d 66%,#061b27 100%);border-color:rgba(22,217,243,.9);box-shadow:inset 0 0 36px rgba(22,217,243,.035)}
.mixfm-cover-box{border-color:var(--neon);box-shadow:0 0 0 1px rgba(239,255,0,.24),0 0 18px rgba(239,255,0,.14)}
.mixfm-eyebrow{color:var(--neon)}
.mixfm-meta{color:var(--cyan)}
.mixfm-status{color:var(--cyan)}
.mixfm-btn-flac{background:var(--neon);color:#03131d;border-color:var(--neon);box-shadow:0 8px 24px rgba(239,255,0,.12)}
.mixfm-volume{color:#fff}.mixfm-volume input{accent-color:var(--cyan)}
.mixfm-history-title{color:var(--neon)}
.mixfm-clock{border-color:var(--cyan);color:var(--cyan)}
.mixfm-history-copy span{color:#8fdff0}
.mixfm-history-item{border-bottom-color:rgba(22,217,243,.22)}
.mixfm-history-head{border-bottom-color:rgba(22,217,243,.25)}
.mixfm-history-empty{color:var(--muted2)}
.mixfm-history-more{display:none!important}


/* v22: top/logo area transparent as approved preview; no other layout/function changes */
.mixfm-shell{background:transparent!important;}

/* v27 — Spatial Audio typography/subline only; all other v25 styling preserved. */
.mixfm-btn-spatial{background:linear-gradient(#fff,#fff) padding-box,linear-gradient(90deg,#a53aa6 0%,#ec3b8d 100%) border-box;color:#c43b9d;border:3px solid transparent;border-radius:999px;height:66px;font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","Helvetica Neue",Arial,sans-serif;font-weight:400;font-size:22px;letter-spacing:-.025em;box-shadow:0 0 18px rgba(220,59,148,.14);overflow:hidden}
.mixfm-btn-spatial .mixfm-icon,.mixfm-spatial-title{background:linear-gradient(90deg,#a53aa6 0%,#ec3b8d 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.mixfm-spatial-copy{display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:1.05}
.mixfm-spatial-title{font-size:30px;font-weight:400;white-space:nowrap}
.mixfm-spatial-copy small{margin-top:5px;font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","Helvetica Neue",Arial,sans-serif;font-size:9px;font-weight:400;letter-spacing:.02em;color:#8b8290;opacity:.72;line-height:1}
.mixfm-btn-spatial:hover{background:#fff;filter:brightness(.97)}
@media(max-width:700px){.mixfm-btn-spatial{height:60px;border-width:2px;letter-spacing:-.02em}.mixfm-spatial-title{font-size:20px}.mixfm-spatial-copy small{font-size:7px;margin-top:3px}}
@media(max-width:390px){.mixfm-spatial-title{font-size:18px}.mixfm-spatial-copy small{font-size:6.5px}}