.icon{width:24px;height:24px;display:inline-block;vertical-align:middle;flex-shrink:0}.icon-nav{width:40px;height:40px;display:grid;place-items:center;padding:7px}.nav.icon-nav span{padding:0}nav{align-items:center;gap:20px}.cover-play .icon{width:19px;height:19px}.grid{align-items:start}.tile{position:relative;min-width:0;align-self:start}.card{display:block;width:100%;align-self:start}.favorite-button{position:absolute;right:12px;top:12px;width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:#15252c88;backdrop-filter:blur(8px);color:#f0f1e9;z-index:3}.favorite-button .icon{width:20px;height:20px}.favorite-button.selected{color:var(--accent)}.favorite-button.selected .icon{fill:currentColor}.library-switch{display:inline-flex;gap:4px;padding:4px;background:#0e191f;border:1px solid #ffffff12;border-radius:30px;margin-bottom:30px}.library-switch button{padding:10px 22px;border-radius:24px;color:var(--muted);font-size:12px;display:flex;align-items:center;gap:8px}.library-switch button.active{background:var(--accent);color:var(--bg)}.library-switch .icon{width:15px;height:15px}.source-switch{display:flex;gap:10px;margin-bottom:24px}#url-field{line-height:1.6}#url-field>input{margin-bottom:10px}#url-field small{display:block;margin-bottom:20px}.player-open{overflow:hidden}.player{inset:0;height:100vh;height:100dvh;width:100%;display:flex;flex-direction:column;flex-wrap:nowrap;align-items:stretch;gap:0;padding:max(22px,env(safe-area-inset-top)) max(24px,env(safe-area-inset-right)) max(24px,env(safe-area-inset-bottom)) max(24px,env(safe-area-inset-left));border:0;background:var(--base,#1d3039);backdrop-filter:none;box-shadow:none;overflow:hidden;isolation:isolate;z-index:10}.ambient{position:absolute;inset:0;z-index:-1;overflow:hidden;background:linear-gradient(160deg,var(--base),#15232e)}.ambient>div{position:absolute;width:90vmax;height:90vmax;border-radius:50%;opacity:.42;filter:blur(65px);background:radial-gradient(ellipse,var(--sky),transparent 65%);left:-40vmax;top:-40vmax;animation:drift 38s ease-in-out infinite alternate;will-change:transform}.ambient>div:nth-child(2){background:radial-gradient(ellipse,var(--hill),transparent 65%);left:20%;top:20%;animation-duration:47s;animation-delay:-14s;opacity:.48}.ambient>div:nth-child(3){background:radial-gradient(ellipse,#b5ac9145,transparent 65%);left:10%;top:-30%;animation-duration:59s;animation-delay:-30s;opacity:.3}@keyframes drift{0%{transform:translate(-5%,-4%) scale(.85)}50%{transform:translate(12%,10%) scale(1.1)}100%{transform:translate(27%,25%) scale(.95)}}.player-top{width:100%;display:flex;justify-content:space-between;align-items:center;max-width:760px;margin:0 auto;flex-shrink:0}.player-top>span{font-size:9px;letter-spacing:2.5px;color:#e6ebdf99}.icon-button{width:48px;height:48px;display:grid;place-items:center;border-radius:50%;background:#ffffff08;color:var(--ink)}.player-content{flex:1;min-height:0;display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;max-width:520px;margin:auto;gap:26px}.player .mini-art{width:82px;height:82px;flex-shrink:0;opacity:.8;box-shadow:0 10px 45px #0002;border-radius:16px}.player .mini-art .cover{border-radius:16px}.player .now{width:100%;display:flex;flex-direction:column;align-items:center;text-align:center;gap:12px}.player .now small{font-size:9px;letter-spacing:3px;color:#d9dfb5bb}.player .now h2{font-size:clamp(26px,5vw,44px);line-height:1.15;max-width:100%;overflow-wrap:anywhere;max-height:3.5em;overflow:auto}.player .now>span{font-size:12px;color:#d1dbd0a6}.player .buttons{display:flex;align-items:center;justify-content:center;gap:34px;width:100%;margin:8px 0 0}.player .buttons>button:not(.play){display:grid;place-items:center;position:relative;width:44px;height:44px;padding:8px;color:#e6ebdf99}.player .buttons>button:not(.play) .icon{width:29px;height:29px}.player .buttons small{position:absolute;left:0;top:18px;width:100%;font-size:7px;text-align:center}.player .buttons .play{width:104px;height:104px;display:grid;place-items:center;padding:28px;background:#e0e4cd;color:#233437;border-radius:50%;box-shadow:0 0 65px #d9dfb50b}.player .play .icon{width:43px;height:43px}.player-bottom{width:100%;max-width:520px;flex-shrink:0;margin:25px auto 0}.player .timeline{display:block;width:100%;margin:0}.player .timeline input{display:block;width:100%;height:5px;margin:12px 0 18px;padding:0;accent-color:var(--accent)}.time-labels{display:flex;justify-content:space-between}.player .timeline time{font-size:11px;color:#d1dbd0b3}.player .volume{display:flex;align-items:center;justify-content:space-between;gap:26px;min-width:0;max-width:none;width:100%;margin:22px 0 0}.player .volume label{font-size:10px;display:flex;align-items:center;gap:12px;width:45%;color:#d1dbd0a6}.player .volume input{width:100%;margin:0}.player .volume button{margin:0;font-size:11px;color:#d1dbd0a6}.shell footer{padding-bottom:38px}#toast{z-index:30}@media(max-height:650px){.player-content{gap:14px}.player .mini-art{display:none}.player .buttons .play{width:80px;height:80px;padding:20px}.player .now h2{font-size:26px}.player-bottom{margin-top:15px}.player .volume{margin-top:12px}}@media(prefers-reduced-motion:reduce){.ambient>div{animation:none;will-change:auto}}@media(max-width:550px){nav{gap:12px}.library-switch{margin-bottom:24px}.favorite-button{width:32px;height:32px;top:9px;right:9px}.player .now h2{font-size:34px}.player .volume{display:flex}.player .mini-art{width:72px;height:72px}.player .buttons{gap:28px}.player-top>span{font-size:8px;letter-spacing:2px}}@media(max-width:550px) and (max-height:650px){.player .mini-art{display:none}.player .now h2{font-size:26px}}
.brand>[data-icon] .icon{width:36px;height:36px}.brand>[data-icon]{display:grid;place-items:center}.empty>[data-icon] .icon{width:48px;height:48px}footer .icon{width:14px;height:14px}.search .icon{width:19px;height:19px}.drop>[data-icon] .icon{width:27px;height:27px}
