:root{color-scheme:dark;--bg:#0a0e25;--navy:#111530;--ink:#fbf5f1;--muted:#afafc2;--glass:rgba(26,26,54,.66);--outline:rgba(255,255,255,.12);--accent:#e2a65f;--accent-two:#7755c4}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-height:100vh;background:var(--bg);color:var(--ink);font-family:'Andika',sans-serif;overflow-x:hidden;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button,input{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.45}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #ffdc9d;outline-offset:4px}::selection{background:#8f5bc6;color:white}.visually-hidden{position:absolute;width:1px;height:1px;clip:rect(0,0,0,0);white-space:nowrap;overflow:hidden;clip-path:inset(50%)}.skip-link{position:fixed;top:-120px;left:12px;padding:12px 18px;background:#fee3ba;color:#16152d;z-index:300;border-radius:12px}.skip-link:focus{top:12px}
body:before{content:"";position:fixed;inset:0;pointer-events:none;z-index:-1;background:radial-gradient(ellipse at 12% 35%,color-mix(in srgb,var(--accent-two) 20%,transparent),transparent 48%),radial-gradient(ellipse at 91% 5%,#3b285b8e,transparent 40%),linear-gradient(135deg,#0c1531,#0b0e22 55%,#16112c);transition:background 1s}.ambient{position:fixed;pointer-events:none;border-radius:50%;filter:blur(88px);opacity:.37;z-index:-1;transition:background 1s}.ambient-one{left:-250px;top:11%;width:590px;height:590px;background:var(--accent-two);animation:glide 24s ease-in-out infinite alternate}.ambient-two{right:-180px;bottom:-110px;width:540px;height:540px;background:#6d2f82;animation:glide 30s ease-in-out infinite alternate-reverse}.stars{position:fixed;z-index:-1;inset:0;opacity:.65;pointer-events:none;background-image:radial-gradient(#fff8 1px,transparent 1px),radial-gradient(#ffddac85 1px,transparent 1px);background-size:147px 147px,233px 233px;background-position:18px 26px,84px 113px;mask-image:linear-gradient(#000,transparent 90%)}
.music-header{height:89px;border-bottom:1px solid #ffffff18;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:22px;width:min(1560px,100%);margin:auto;padding:0 clamp(18px,4vw,74px);position:relative;z-index:6}.music-brand{width:max-content;display:flex;flex-direction:column;line-height:1}.brand-main{font:700 30px Fredoka,sans-serif;letter-spacing:-.065em;white-space:nowrap}.brand-main em{font-style:normal;color:#f9bb7e}.brand-sub{margin-top:5px;font:600 9px Fredoka,sans-serif;letter-spacing:.19em;color:#bfb0c9}.music-header-center{display:flex;align-items:center;gap:10px;font:600 11px Fredoka,sans-serif;letter-spacing:.23em;color:#e7c1a5}.header-orb{display:grid;place-items:center;border:1px solid #ffffff39;color:#efba7a;border-radius:50%;width:27px;height:27px}.music-nav{display:flex;align-items:center;justify-content:flex-end;gap:17px;font:600 13px Fredoka,sans-serif}.music-nav a{color:#d7d2de;transition:color .2s}.music-nav a:hover{color:#ffcd8c}.music-nav a:last-child{border:1px solid #ffffff36;border-radius:999px;display:flex;align-items:center;gap:8px;padding:10px 15px}
.music-main{max-width:1500px;padding:44px clamp(18px,4vw,65px) 24px;margin:0 auto}.title-bar{display:flex;justify-content:space-between;align-items:flex-end;gap:22px;margin-bottom:30px}.eyebrow{font:600 12px Fredoka,sans-serif;letter-spacing:.23em;color:#efc18c}.eyebrow-spark{font-size:19px;vertical-align:-1px;margin-right:4px}.title-bar h1{font:600 clamp(44px,4.45vw,74px)/1 Fredoka,sans-serif;letter-spacing:-.055em;margin:13px 0 10px}.title-bar h1 em{font:italic 400 1.05em Georgia,serif;color:#f4c58a;letter-spacing:-.055em}.title-bar p{color:#c6bfd0;font-size:14px;line-height:1.65}.album-pill{display:inline-flex;gap:10px;align-items:center;white-space:nowrap;background:rgba(239,193,140,.09);border:1px solid rgba(247,205,154,.27);border-radius:999px;color:#f1d4b0;padding:13px 17px;font:600 13px Fredoka,sans-serif;margin-bottom:8px}
.player-layout{display:grid;grid-template-columns:minmax(0,1.04fr) minmax(350px,.82fr);gap:26px;align-items:stretch}.immersive-stage{min-width:0;position:relative;border-radius:34px;border:1px solid rgba(255,255,255,.13);padding:26px 32px 28px;background:linear-gradient(165deg,rgba(42,35,76,.84),rgba(17,19,47,.89) 63%,rgba(25,23,49,.93));box-shadow:0 30px 75px #050816aa,0 0 0 1px #ffffff06 inset;overflow:hidden;isolation:isolate}.immersive-stage:before{content:"";position:absolute;z-index:-1;left:-25%;top:-25%;width:150%;height:75%;background:radial-gradient(ellipse,var(--accent-two),transparent 65%);filter:blur(60px);opacity:.18;transition:background .6s}.stage-header{display:flex;align-items:center;justify-content:space-between;gap:12px;color:#efdbcd;font:600 10px Fredoka,sans-serif;letter-spacing:.19em}.on-air{display:flex;align-items:center;gap:10px}.on-air i{width:7px;height:7px;display:block;border-radius:50%;background:#efc687;box-shadow:0 0 0 4px #efc68717}.is-playing .on-air i{background:#8bffc2;box-shadow:0 0 0 4px #8bffc21c,0 0 16px #8bffc267;animation:pulse 2s ease-in-out infinite}.stage-counter{color:#fff9}
.art-space{height:clamp(330px,31vw,500px);display:flex;align-items:center;justify-content:center;position:relative;margin:5px -12px -4px}.art-halo{position:absolute;width:min(90%,450px);aspect-ratio:1;background:radial-gradient(circle,color-mix(in srgb,var(--accent) 30%,transparent),transparent 68%);border-radius:50%;filter:blur(28px);animation:breath 9s ease-in-out infinite}.orbit{position:absolute;border:1px solid #e0b6ff35;aspect-ratio:1;width:min(86%,420px);border-radius:50%;transform:rotate(-22deg);pointer-events:none}.orbit-a{box-shadow:0 0 30px #f1b1ff0e}.orbit-b{width:min(106%,505px);border-style:dashed;border-color:#eac6a930;transform:rotate(13deg);animation:spin 140s linear infinite}.float-star{position:absolute;color:#f2c78b;text-shadow:0 0 21px #fdc99099;animation:twinkle 6s ease-in-out infinite}.star-1{font-size:33px;top:12%;left:6%}.star-2{font-size:25px;bottom:17%;right:8%;animation-delay:2s}.star-3{font-size:22px;top:19%;right:11%;animation-delay:4s}
.art-panel{width:min(100%,445px);height:min(90%,418px);position:relative;overflow:hidden;border-radius:29px;background:radial-gradient(circle at 50% 28%,color-mix(in srgb,var(--accent) 22%,#2e255f),#151733 72%);transform:rotate(-2deg);box-shadow:0 23px 75px #050815c7,0 0 0 7px #fff1,0 0 0 8px #ffffff18;transition:transform .4s,box-shadow .4s;isolation:isolate}.is-playing .art-panel{transform:rotate(0)}.art-panel img{width:100%;height:114%;object-fit:contain;object-position:center top;display:block;filter:drop-shadow(0 18px 28px rgba(5,8,21,.42));transition:opacity .22s;animation:portraitDrift 8.6s ease-in-out infinite}.art-panel img.fade{opacity:.2}.art-overlay{position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(11,14,38,.08) 0%,rgba(8,12,33,.02) 30%,rgba(7,12,46,.36) 72%,rgba(7,12,46,.74) 100%)}.art-edge{position:absolute;z-index:2;top:18px;left:19px;display:flex;gap:9px;align-items:center;font:600 10px Fredoka,sans-serif;letter-spacing:.13em;color:#fff6d3;text-shadow:0 2px 10px #080c23b0;background:#1b154675;backdrop-filter:blur(8px);border:1px solid #ffffff38;border-radius:99px;padding:8px 11px}.art-panel canvas{position:absolute;z-index:1;bottom:10px;left:5%;width:90%;height:115px;pointer-events:none}
.track-info{text-align:center;padding:0 10px;position:relative;z-index:2;min-height:105px;display:flex;align-items:center;flex-direction:column;justify-content:center}.track-eyebrow{color:#f0c58b;font:600 10px Fredoka,sans-serif;letter-spacing:.21em}.track-info h2{font:600 clamp(29px,3vw,42px)/1.15 Fredoka,sans-serif;letter-spacing:-.035em;margin:7px auto 3px;max-width:580px}.track-info p{font-size:12px;color:#c8c1cf}.info-dot{color:#e2ae7b;padding:0 5px}.playback{margin-top:10px}.time-row{display:grid;grid-template-columns:34px 1fr 39px;gap:13px;align-items:center;font:600 12px Fredoka,sans-serif;color:#ded3e1}.time-row #duration{text-align:right}.time-row input[type=range],.volume-control input[type=range]{appearance:none;-webkit-appearance:none;width:100%;height:5px;border-radius:999px;border:0;cursor:pointer;outline-offset:7px;background:linear-gradient(to right,#f7c789 0%,#f7c789 var(--range-fill,0%),#ffffff39 var(--range-fill,0%),#ffffff39 100%)}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:14px;height:14px;border-radius:50%;background:#ffe6b4;box-shadow:0 0 0 3px #ffe6b425}input[type=range]::-moz-range-thumb{width:14px;height:14px;border:0;border-radius:50%;background:#ffe6b4}.controls{display:flex;justify-content:center;align-items:center;gap:clamp(14px,2.4vw,32px);margin:23px 0 18px}.icon-control{position:relative;width:36px;height:36px;background:transparent;color:#bbb4ce;border:0;display:grid;place-items:center;border-radius:50%;transition:color .2s,transform .2s,background .2s}.icon-control:hover{color:#ffdbab;transform:scale(1.09)}.icon-control[aria-pressed="true"],.icon-control.active{color:#ffcc8e}.icon-control b{position:absolute;color:#f4d19e;bottom:0;right:-5px;background:#211834;font-size:9px;border-radius:100%;width:13px;height:13px;display:grid;place-items:center}.major-control{color:#f7eff2}.play-control{border:0;border-radius:50%;width:74px;height:74px;display:grid;place-items:center;background:linear-gradient(130deg,#ffe2a8,#f5b975 60%,#e4a45d);color:#22203a;box-shadow:0 9px 32px #ecab5980,inset 0 2px 4px #fffae36b;transition:transform .2s,box-shadow .2s}.play-control:hover{transform:scale(1.06);box-shadow:0 12px 40px #efab62a0}.play-control svg{margin-left:3px}.play-control.is-paused-icon svg{margin-left:0}.extras{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:39px}.volume-control{display:flex;align-items:center;gap:8px;width:127px}.volume-control input[type=range]{max-width:78px;--range-fill:85%}.icon-control.small{width:26px;height:28px}.audio-label{font:600 10px Fredoka,sans-serif;letter-spacing:.1em;color:#aaa0b9}.cinema-button{display:inline-flex;align-items:center;gap:8px;background:#ffffff0b;border:1px solid #ffffff2a;border-radius:999px;color:#f4e7e9;font:600 12px Fredoka,sans-serif;padding:9px 12px}.cinema-button:hover{background:#ffffff23}
.playlist{min-width:0;max-height:875px;border-radius:34px;border:1px solid rgba(255,255,255,.12);background:linear-gradient(145deg,rgba(32,31,58,.85),rgba(19,21,44,.9));display:flex;flex-direction:column;box-shadow:0 30px 70px #05081676;overflow:hidden}.playlist-header{padding:36px 35px 25px;border-bottom:1px solid #ffffff18}.playlist-eyebrow{font:600 11px Fredoka,sans-serif;letter-spacing:.19em;color:#eebc91}.playlist-header h2{font:600 clamp(37px,3vw,54px)/1.1 Fredoka,sans-serif;letter-spacing:-.045em;margin:10px 0 4px}.playlist-header h2 em{font:italic 400 1.04em Georgia,serif;color:#eec18c}.playlist-header p{font-size:14px;color:#c7bbcc}.playlist-meta{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:28px;color:#a9a3bc;font:600 10px Fredoka,sans-serif;letter-spacing:.1em}.playlist-meta span:first-child{border:1px solid #ffffff31;padding:7px 10px;border-radius:50px;color:#f0d7ba}.queue-scroll{flex:1;min-height:260px;overflow-y:auto;overscroll-behavior:contain;scrollbar-color:#6c607a transparent;scrollbar-width:thin}.track-list{padding:9px 14px 17px}.track-button{width:100%;display:grid;grid-template-columns:26px 58px minmax(0,1fr) auto;align-items:center;gap:14px;text-align:left;background:transparent;color:#e8e1ec;border:1px solid transparent;border-radius:17px;padding:10px 12px;transition:background .2s,transform .2s,border-color .2s}.track-button:hover{background:#ffffff0d}.track-button.is-active{background:linear-gradient(95deg,#f4c58a20,#d0a8ff0e);border-color:#f6d0a33a}.track-num{font:600 13px Fredoka,sans-serif;color:#938ca7;text-align:center}.track-button.is-active .track-num{color:#ffcd8e}.track-thumb{width:58px;height:58px;border-radius:13px;overflow:hidden;display:block;background:linear-gradient(135deg,#e4b06a,#7056b0);box-shadow:0 6px 18px #0003}.track-thumb img{width:100%;height:100%;object-fit:cover}.track-copy{min-width:0;display:flex;flex-direction:column;gap:4px}.track-title{font:600 15px/1.22 Fredoka,sans-serif;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.track-button.is-active .track-title{color:#ffdcaa}.track-sub{font-size:11px;color:#a79fb8}.track-duration{font:500 11px Fredoka,sans-serif;color:#a8a0b6}.track-button.is-active .track-duration{color:#f8d09c}.eq-bars{display:flex;align-items:flex-end;justify-content:center;gap:2px;height:17px}.eq-bars i{width:3px;border-radius:3px;background:#f6cf99;height:4px}.is-playing .track-button.is-active .eq-bars i:nth-child(1){animation:bar 650ms ease-in-out infinite alternate}.is-playing .track-button.is-active .eq-bars i:nth-child(2){animation:bar 500ms ease-in-out 100ms infinite alternate}.is-playing .track-button.is-active .eq-bars i:nth-child(3){animation:bar 760ms ease-in-out 160ms infinite alternate}.queue-footer{min-height:82px;display:flex;align-items:center;gap:11px;padding:16px 24px;border-top:1px solid #ffffff18;background:#ffffff08}.queue-footer-star{color:#f3c993;font-size:22px}.queue-footer p{color:#c4b8cd;font-size:12px;line-height:1.5;flex:1}.queue-footer button{display:inline-flex;align-items:center;gap:6px;border:0;background:transparent;color:#f7d09d;white-space:nowrap;font:600 11px Fredoka,sans-serif}.queue-footer button:hover{text-decoration:underline}.music-footer{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:14px;padding:32px 6px 10px;color:#aa9fb6;font-size:12px}.music-footer span:first-child{font:600 13px Fredoka,sans-serif;color:#e8cbac}.music-footer a{color:#e3be97;display:inline-flex;align-items:center;gap:6px}
/* Fullscreen stays immersive with its own controls. When fullscreen is unsupported, cinema mode fills the viewport as an in-page alternative. */
body.cinema-mode{overflow:hidden}.cinema-mode .music-header,.cinema-mode .title-bar,.cinema-mode .playlist,.cinema-mode .music-footer{display:none}.cinema-mode .music-main{position:fixed;inset:0;z-index:220;max-width:none;width:100%;height:100dvh;padding:10px;background:radial-gradient(ellipse at center,#241e49,#090d22 80%);overflow-y:auto}.cinema-mode .player-layout{width:min(890px,100%);height:100%;margin:0 auto;display:block}.cinema-mode .immersive-stage{width:100%;min-height:100%;display:flex;flex-direction:column;justify-content:center;border:0;background:transparent;box-shadow:none}.cinema-mode .art-space{height:min(54vh,520px);min-height:240px}.cinema-mode .art-panel{height:95%;max-width:650px}.cinema-mode .track-info{min-height:84px}.cinema-mode .playback{width:min(640px,100%);margin:10px auto}.cinema-mode .art-panel img{object-position:center}.cinema-mode .controls{margin:18px 0 10px}
@keyframes portraitDrift{0%,100%{transform:translateY(-1.5%) scale(.985)}50%{transform:translateY(2.2%) scale(1.015)}}@keyframes glide{from{transform:translate(0,0)}to{transform:translate(140px,-80px)}}@keyframes breath{0%,100%{opacity:.65;transform:scale(.98)}50%{opacity:1;transform:scale(1.13)}}@keyframes spin{to{transform:rotate(373deg)}}@keyframes twinkle{0%,100%{opacity:.3;transform:scale(.9)}45%{opacity:1;transform:scale(1.25)}}@keyframes pulse{50%{box-shadow:0 0 0 5px #8bffc226,0 0 21px #8bffc28f}}@keyframes bar{from{height:3px}to{height:16px}}
@media(min-width:1520px){.music-main{padding-top:60px}.player-layout{grid-template-columns:1.05fr .85fr}}@media(max-width:1100px){.music-header-center{display:none}.music-header{grid-template-columns:1fr auto}.player-layout{grid-template-columns:minmax(0,1.05fr) minmax(330px,.92fr);gap:18px}.immersive-stage{padding:24px 23px}.playlist-header{padding:27px 23px 20px}.track-list{padding:6px 7px 15px}.track-button{gap:10px;padding:9px 8px}.art-space{height:clamp(300px,36vw,425px)}.art-panel{max-width:365px;height:min(90%,355px)}.extras .audio-label{display:none}}@media(max-width:850px){.player-layout{grid-template-columns:1fr}.immersive-stage{padding:26px 26px 30px}.art-space{height:clamp(320px,68vw,490px)}.art-panel{width:min(100%,470px);height:min(89%,420px)}.playlist{max-height:none}.queue-scroll{max-height:520px}.title-bar{margin-bottom:24px}.music-main{padding-top:34px}.music-footer{padding-bottom:15px}.extras .audio-label{display:block}}@media(max-width:580px){.music-header{height:69px;padding:0 18px}.brand-main{font-size:26px}.brand-sub{font-size:7px}.music-nav{gap:9px;font-size:12px}.music-nav a:first-child{display:none}.music-nav a:last-child{padding:9px 11px}.music-main{padding:28px 13px 20px}.title-bar{padding:0 8px;display:block}.title-bar h1{font-size:clamp(38px,10vw,54px);margin:12px 0 9px}.title-bar p{font-size:13px}.eyebrow{font-size:10px}.album-pill{display:none}.player-layout{gap:17px}.immersive-stage,.playlist{border-radius:25px}.immersive-stage{padding:20px 17px 24px}.art-space{height:min(99vw,390px);margin:5px -7px 3px}.art-panel{width:84%;height:85%;border-radius:22px}.float-star.star-1{top:9%;left:1%}.float-star.star-3{right:0}.orbit-b{width:108%}.track-info{min-height:90px}.track-info h2{font-size:clamp(27px,7vw,36px)}.controls{gap:clamp(12px,3vw,25px);margin:18px 0 12px}.play-control{width:66px;height:66px}.extras{gap:8px}.extras .audio-label{display:none}.time-row{gap:9px}.playlist-header{padding:27px 23px 19px}.playlist-header h2{font-size:44px}.playlist-meta span:last-child{font-size:9px;text-align:right}.track-list{padding:7px 8px 15px}.track-button{grid-template-columns:23px 52px minmax(0,1fr) auto;gap:10px;padding:8px 8px}.track-thumb{width:52px;height:52px}.track-title{font-size:15px}.queue-footer{padding:12px 18px}.music-footer{display:flex;flex-direction:column;align-items:flex-start;padding:24px 12px 16px}.cinema-mode .music-main{padding:0}.cinema-mode .immersive-stage{padding:20px 18px}.cinema-mode .art-space{height:min(46vh,410px);min-height:195px}.cinema-mode .art-panel{height:95%;width:min(86%,425px)}.cinema-mode .track-info{min-height:80px}.cinema-mode .controls{margin:10px 0}.cinema-mode .play-control{width:62px;height:62px}}@media(max-height:700px){.cinema-mode .art-space{height:38vh;min-height:175px}.cinema-mode .track-info{min-height:72px}.cinema-mode .immersive-stage{padding-top:9px;padding-bottom:9px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation:none!important;transition:none!important}.art-panel img,.is-playing .art-panel img{transform:none}}