/* Dedicated online-music connection and player shell. */
.app[data-active=music] .tab.is-on{background:linear-gradient(135deg,#5d55d8,#34aebd)!important;color:#fff!important;border-color:transparent!important;box-shadow:0 8px 22px #5866cb30!important}
.tab[data-view=music]{background:linear-gradient(135deg,#eeefff,#e7faff);color:#4458b3;border-color:#cad5ef}
.music-page-head{display:flex!important;align-items:flex-end;justify-content:space-between;gap:20px;background:linear-gradient(120deg,#f0efff,#e7faff 58%,#fff1f7)!important}.music-page-head p{margin-top:8px;color:#7c7386;font-size:13px}.music-connection-state{display:flex;align-items:center;gap:8px;padding:8px 12px;background:#ffffffb8;border:1px solid #fff;border-radius:999px;color:#756d7e;font-size:10px;white-space:nowrap}.music-connection-state i{width:8px;height:8px;border-radius:50%;background:#aaa;box-shadow:0 0 0 4px #aaa2}
.music-provider-panel,.online-player-shell,.online-playlist{background:#ffffffd9;border:1px solid #e7dfea;border-radius:20px;box-shadow:0 20px 55px #49344f12;margin-bottom:20px}.music-provider-panel{padding:25px}.music-provider-copy>span,.music-connect-guide>div>span,.online-playlist header span{font:700 9px/1.5 var(--pix);letter-spacing:.13em;color:#7c74c9}.music-provider-copy h3,.online-playlist h3{font-size:23px;color:#403647;margin:5px 0}.music-provider-copy p{font-size:11px;color:#8a808f}.music-provider-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:20px 0}.music-provider-grid button{display:grid;grid-template-columns:43px 1fr auto;align-items:center;gap:11px;text-align:left;border:1px solid #e3dce7;background:#fff;border-radius:13px;padding:13px;color:#4b414f}.music-provider-grid button>i{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;background:#f1efff;color:#655cd0;font-size:20px;font-style:normal}.music-provider-grid button span{display:grid;gap:3px}.music-provider-grid button b{font-size:13px}.music-provider-grid button small{font-size:9px;color:#968c9a}.music-provider-grid button em{font:700 7px var(--pix);font-style:normal;color:#9b92a0}.music-provider-grid button.is-on{border-color:#756bd8;box-shadow:0 9px 23px #635bc51d;background:#faf9ff}.music-connect-guide{display:grid;grid-template-columns:minmax(220px,1fr) minmax(300px,1.3fr) auto;align-items:center;gap:20px;padding:18px;border-radius:14px;background:linear-gradient(120deg,#f5f3ff,#effbfd)}.music-connect-guide h4{font-size:16px;color:#453b4a;margin:5px 0}.music-connect-guide p,.music-connect-guide li{font-size:10px;color:#837987;line-height:1.7}.music-connect-guide ol{display:grid;gap:3px;padding-left:18px}.music-connect-guide button{white-space:nowrap}
.online-player-shell{display:grid;grid-template-columns:1.15fr .85fr;overflow:hidden;background:linear-gradient(125deg,#211b29,#31243c 55%,#1b3840);color:#fff}.online-player-main{display:grid;grid-template-columns:210px 1fr;gap:25px;align-items:center;padding:27px}.online-cover{aspect-ratio:1;border-radius:20px;padding:20px;display:flex;flex-direction:column;justify-content:center;background:radial-gradient(circle at 65% 25%,#79e2df 0 8%,transparent 9%),linear-gradient(140deg,#675dde,#d65b9c 52%,#efb660);box-shadow:0 22px 55px #0a071052;position:relative;overflow:hidden}.online-cover::before{content:"";position:absolute;width:180px;height:180px;border:26px solid #ffffff18;border-radius:50%;right:-70px;bottom:-60px}.online-cover span{font:800 25px/1.1 var(--pix);letter-spacing:.06em}.online-cover strong{font:400 27px/1.1 Georgia,serif}.online-cover i{position:absolute;right:19px;bottom:17px;font-style:normal;font-size:25px}.online-now-playing>span{font:700 8px var(--pix);letter-spacing:.14em;color:#b7a7c1}.online-now-playing h3{font-size:23px;margin:10px 0 5px;color:#fff}.online-now-playing p{font-size:10px;color:#b9acbe}.online-progress{height:4px;background:#ffffff1d;border-radius:5px;margin-top:24px}.online-progress i{display:block;width:0;height:100%;background:linear-gradient(90deg,#a79cff,#65d4dc)}.online-times{display:flex;justify-content:space-between;margin-top:7px;color:#9d90a4;font:8px var(--pix)}.online-controls{display:flex;align-items:center;justify-content:center;gap:15px;margin-top:16px}.online-controls button{display:grid;place-items:center;width:34px;height:34px;border:0;background:transparent;color:#c8bdcd;font-size:19px;opacity:1}.online-controls .online-play{width:48px;height:48px;border-radius:50%;background:#fff;color:#30263a;font-size:14px}.online-search-panel{background:#fff;padding:27px;color:#443a49}.online-search-panel form>label{display:block;font-weight:700;font-size:13px;margin-bottom:10px}.online-search-panel form>div{display:flex;gap:7px}.online-search-panel input{min-width:0;flex:1;border:1px solid #e2dae5;border-radius:9px;padding:10px 12px;font-size:11px}.online-search-panel form button{border:0;border-radius:9px;background:#5f58cf;color:#fff;padding:9px 14px;font-size:11px}.music-empty-state{text-align:center;padding:44px 15px 24px;color:#918796}.music-empty-state>i{display:grid;place-items:center;width:45px;height:45px;margin:0 auto 11px;border-radius:50%;background:#f0effb;color:#675fd0;font-style:normal;font-size:20px}.music-empty-state h4{font-size:13px;color:#554a59}.music-empty-state p{font-size:10px;line-height:1.7;margin-top:6px}
.online-playlist{padding:24px}.online-playlist header{display:flex;justify-content:space-between;align-items:end}.online-playlist header b{font-size:10px;color:#918695}.online-playlist-empty{display:grid;grid-template-columns:35px 1fr auto;align-items:center;gap:10px;margin-top:17px;padding:15px;border-top:1px solid #ede6ef;color:#aaa0ad}.online-playlist-empty span,.online-playlist-empty em{font:9px var(--pix);font-style:normal}.online-playlist-empty p{font-size:11px}
html[data-theme=dark] .music-page-head{background:linear-gradient(120deg,#252039,#17343b 58%,#321f2c)!important}html[data-theme=dark] .music-page-head h2,html[data-theme=dark] .music-page-head p{color:#f3ebf4}html[data-theme=dark] .music-provider-panel,html[data-theme=dark] .online-playlist{background:#211d28;border-color:#ffffff18}html[data-theme=dark] .music-provider-copy h3,html[data-theme=dark] .online-playlist h3{color:#f5edf5}html[data-theme=dark] .music-provider-grid button{background:#2c2733;border-color:#ffffff16;color:#f1e9f2}html[data-theme=dark] .music-provider-grid button.is-on{background:#312b42;border-color:#8177e4}html[data-theme=dark] .music-connect-guide{background:linear-gradient(120deg,#2c2740,#1e353a)}html[data-theme=dark] .music-connect-guide h4{color:#f3ebf4}html[data-theme=dark] .online-search-panel{background:#24202b;color:#f4ecf4}html[data-theme=dark] .music-empty-state h4{color:#f3ebf4}
@media(max-width:1050px){.music-connect-guide{grid-template-columns:1fr 1fr}.music-connect-guide button{grid-column:1/-1;justify-self:start}.online-player-shell{grid-template-columns:1fr}.online-search-panel{border-top:1px solid #ffffff18}}
@media(max-width:820px){.music-page-head{align-items:flex-start!important}.music-provider-grid{grid-template-columns:1fr}.music-connect-guide{grid-template-columns:1fr}.online-player-main{grid-template-columns:150px 1fr;padding:20px}.online-cover span{font-size:17px}.online-now-playing h3{font-size:18px}}
@media(max-width:430px){.music-page-head{display:grid!important}.music-connection-state{white-space:normal}.music-provider-panel,.online-playlist{padding:18px;border-radius:15px}.online-player-main{grid-template-columns:1fr}.online-cover{width:150px}.online-search-panel{padding:20px}.music-connect-guide button{width:100%}.music-provider-grid button{grid-template-columns:43px 1fr}}

/* Cleaner music view: keep only labels needed to choose and operate the player. */
.music-provider-grid button{grid-template-columns:43px 1fr}
.music-provider-grid button b{font-size:14px}
.music-connect-guide{grid-template-columns:1fr auto}
.music-connect-guide h4{margin:0}

/* Recognisable provider colours for the new music choices. */
.music-provider-grid button{--provider:#655cd0;--provider-soft:#f1efff;background:var(--provider-soft);border-color:color-mix(in srgb,var(--provider) 26%,#fff);transition:transform .18s ease,box-shadow .18s ease,filter .18s ease}
.music-provider-grid button[data-music-provider="apple"]{--provider:#e74668;--provider-soft:linear-gradient(135deg,#fff0f4,#fff8fa)}
.music-provider-grid button[data-music-provider="spotify"]{--provider:#198c4c;--provider-soft:linear-gradient(135deg,#e7f9ee,#f6fff9)}
.music-provider-grid button[data-music-provider="youtube"]{--provider:#e23b3b;--provider-soft:linear-gradient(135deg,#ffeded,#fff8f8)}
.music-provider-grid button>i{background:var(--provider);color:#fff;box-shadow:0 7px 18px color-mix(in srgb,var(--provider) 25%,transparent)}
.music-provider-grid button:hover{transform:translateY(-2px);filter:saturate(1.08)}
.music-provider-grid button.is-on{background:var(--provider-soft);border-color:var(--provider);box-shadow:0 10px 25px color-mix(in srgb,var(--provider) 20%,transparent)}
.music-provider-grid button:focus-visible{outline:3px solid color-mix(in srgb,var(--provider) 35%,transparent);outline-offset:2px}
html[data-theme=dark] .music-provider-grid button{background:color-mix(in srgb,var(--provider) 18%,#27222d);border-color:color-mix(in srgb,var(--provider) 52%,#27222d);color:#fff}
html[data-theme=dark] .music-provider-grid button.is-on{background:color-mix(in srgb,var(--provider) 28%,#27222d);border-color:var(--provider)}
html[data-theme=dark] .tab[data-view=music]{background:linear-gradient(135deg,#292a48,#203d43);color:#c9d2ff;border-color:#454e79}
.online-search-panel input{background:#fff!important;color:#443a49!important}
html[data-theme=dark] .online-search-panel input{background:#17141d!important;color:#f4ecf4!important;border-color:#ffffff18!important}
