@font-face{font-family:Bighorn;src:url(/assets/Bighorn--frWVu7v.otf)format("opentype");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:Bighorn;src:url(/assets/Bighorn-Italic-BOZcWo4i.otf)format("opentype");font-weight:400;font-style:italic;font-display:swap}:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:#121212;--surface:#1c1f26;--menu-bg:#0d1119;--text:#fff;--text-muted:#9ba7b8;--border:#1670bd;--accent:#1a9dff;--accent-bright:#5cc3ff;--glow:0 0 8px #1a9dff73;--font:"Bighorn", system-ui, sans-serif;--font-heading:var(--font);--fs-base:1rem;--fs-topbar:1rem;--fs-card:1rem;--fs-title:1.125rem;--fs-playlist-title:2.6rem;--search-title-font:var(--font-heading);--search-title-size:2.1rem;--search-title-style:italic;--search-title-weight:400;--search-title-spacing:.1em;--search-title-line-height:1.15;--search-title-color:var(--text);--search-title-glow:0 0 13px var(--accent), 0 0 14px #1a9dffcc;--search-title-gap:35px;--search-top:35px;--search-side:14px;--fs-tile:.875rem;--fs-tab:.75rem;--fw-tab-active:200;--radius:0;--border-width:2px;--hub-dim:#0000008c;--hub-mine-margin:20%;--gap-sm:8px;--gap-md:16px;--tap:45px;--app-max-width:480px;--art-placeholder:repeating-linear-gradient(45deg, #ffffff0a 0 6px, transparent 6px 12px), linear-gradient(135deg, #2b3547, #151a24);--art-scrim:#00000059;--text-outline:-1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000, 0 0 6px #000c}*,:before,:after{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--bg);color:var(--text);font-family:var(--font);font-size:var(--fs-base);line-height:1.4}button{font:inherit;color:inherit;cursor:pointer}:focus-visible{outline:3px solid var(--accent);outline-offset:2px}.visually-hidden{clip:rect(0 0 0 0);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.muted{color:var(--text-muted)}.app{height:100dvh;max-width:var(--app-max-width);background:var(--bg);flex-direction:column;margin:0 auto;display:flex}.screen{min-height:0;padding:var(--gap-md);flex:1;overflow-y:auto}.control{min-height:var(--tap);min-width:var(--tap);padding:0 var(--gap-md);font-size:var(--fs-topbar);background:var(--bg);border:var(--border-width) solid var(--border);border-radius:var(--radius);box-shadow:var(--glow)}.control-square{justify-content:center;align-items:center;padding:0;display:inline-flex}.control[aria-current=page]{background:var(--surface);border-color:var(--accent-bright)}.topbar{justify-content:space-between;align-items:center;gap:var(--gap-sm);padding:calc(var(--gap-sm) + env(safe-area-inset-top)) var(--gap-md) var(--gap-sm);border-bottom:var(--border-width) solid var(--border);display:flex}.topbar-nav,.topbar-actions{align-items:center;gap:var(--gap-sm);display:flex}.topbar-nav .control{text-shadow:0 0 6px var(--accent);font-style:italic}.topbar-nav .control[aria-current=page]{color:var(--accent-bright);text-shadow:0 0 4px var(--accent), 0 0 10px var(--accent)}@media (width<=430px){.topbar{padding-left:var(--gap-sm);padding-right:var(--gap-sm);gap:4px}.topbar-nav,.topbar-actions{gap:4px}.topbar .control:not(.control-square){padding:0 .5rem}}@media (width<=370px){.topbar .control{font-size:.8rem}.topbar .control-square{min-width:2.4rem}}.wallet{padding:0 var(--gap-sm);color:var(--accent-bright);text-shadow:0 0 6px var(--accent);font-variant-numeric:tabular-nums;white-space:nowrap;flex:none;align-items:center;gap:.35rem;display:inline-flex}.wallet-symbol{font-style:italic}.avatar{width:var(--tap);height:var(--tap);flex:none;overflow:hidden}.placeholder-icon{stroke:var(--accent-bright)}.avatar-img{object-fit:cover;width:100%;max-width:100%;height:100%;max-height:100%;display:block}.icon{object-fit:contain;width:28px;height:28px;display:block}.control .icon{opacity:.6;filter:drop-shadow(0 0 4px var(--accent));transition:opacity .15s,filter .15s}.control[aria-current=page] .icon{opacity:1;filter:drop-shadow(0 0 4px var(--accent)) drop-shadow(0 0 10px var(--accent))}.bottomnav{border-top:var(--border-width) solid var(--border);padding-bottom:env(safe-area-inset-bottom);grid-template-columns:repeat(4,1fr);display:grid}.tab{min-height:60px;padding:var(--gap-sm) 0;font-size:var(--fs-tab);background:var(--bg);border:0;flex-direction:column;align-items:center;gap:4px;display:flex}.tab-icon{border:var(--border-width) solid var(--border);width:28px;height:28px}.tab .icon{opacity:.55;transition:opacity .15s}.tab .icon-friends{transform:scale(1.5)}.tab .icon-library{transform:scale(1.2)}.tab[aria-current=page]{background:var(--surface);color:var(--accent-bright);font-weight:var(--fw-tab-active)}.tab[aria-current=page] .icon{opacity:1;filter:drop-shadow(0 0 4px var(--accent))}.tab[aria-current=page] .tab-icon{background:var(--accent)}.home{gap:var(--gap-md);flex-direction:column;display:flex}.recent-grid{gap:var(--gap-md);grid-template-columns:1fr 1fr;display:grid}.card{isolation:isolate;min-height:72px;padding:var(--gap-sm);font-size:var(--fs-card);text-shadow:var(--text-outline);background:var(--art,var(--art-placeholder)) center / cover no-repeat;border:var(--border-width) solid var(--border);border-radius:var(--radius);box-shadow:var(--glow);text-align:center;position:relative}.weekly-header{align-items:center;gap:var(--gap-sm);margin-bottom:var(--gap-md);display:flex}.weekly-title{padding:var(--gap-sm);border:var(--border-width) solid var(--border);border-radius:var(--radius);box-shadow:var(--glow);font-family:var(--font-heading);font-size:var(--fs-title);text-align:center;flex:1;margin:0}.weekly-grid{gap:var(--gap-md);grid-template-columns:repeat(3,1fr);margin:0;padding:0;list-style:none;display:grid}.tile{isolation:isolate;aspect-ratio:1;width:100%;padding:var(--gap-sm);text-shadow:var(--text-outline);background:var(--art,var(--art-placeholder)) center / cover no-repeat;border:var(--border-width) solid var(--border);border-radius:var(--radius);box-shadow:var(--glow);font-size:var(--fs-tile);text-align:center;justify-content:center;align-items:center;display:flex;position:relative}.card:before,.tile:before{content:"";z-index:-1;background:var(--art-scrim);position:absolute;inset:0}.placeholder{align-items:flex-start;gap:var(--gap-sm);flex-direction:column;display:flex}.placeholder-title,.placeholder p{margin:0}.stage{flex-direction:column;flex:1;min-height:0;display:flex;position:relative;overflow:hidden}.hub-backdrop{z-index:10;background:var(--hub-dim);opacity:0;visibility:hidden;transition:opacity .25s,visibility 0s linear .25s;position:absolute;inset:0}.hub-backdrop.open{opacity:1;visibility:visible;transition-delay:0s}.hub-drawer{z-index:11;background:var(--bg);border-right:var(--border-width) solid var(--border);box-shadow:var(--glow);visibility:hidden;flex-direction:column;transition:transform .25s,visibility 0s linear .25s;display:flex;position:absolute;top:0;bottom:0;left:0;transform:translate(-100%);container-type:inline-size}.hub-drawer.open{visibility:visible;transition-delay:0s;transform:none}.hub-drawer.dragging{-webkit-user-select:none;user-select:none}@media (prefers-reduced-motion:reduce){.hub-backdrop,.hub-drawer{transition:none}}.hub-header{align-items:center;gap:var(--gap-sm);padding:calc(var(--gap-sm) + env(safe-area-inset-top)) var(--gap-sm) var(--gap-sm);border-bottom:var(--border-width) solid var(--border);display:flex}.hub-groups{gap:var(--gap-sm);scrollbar-width:thin;flex:1;min-width:0;margin:0;padding:4px;list-style:none;display:flex;overflow-x:auto}.hub-group{background:var(--surface);border:var(--border-width) solid var(--border);width:40px;height:40px;box-shadow:var(--glow);border-radius:50%;flex:none;place-items:center;padding:0;display:grid;overflow:hidden}.hub-group[aria-current=true]{border-color:var(--accent-bright)}.hub-label{padding:var(--gap-sm) var(--gap-md) 0;font-size:var(--fs-tile);color:var(--text-muted);margin:0}.hub-empty{padding:var(--gap-md);flex:1;margin:0}.hub-messages{gap:var(--gap-md);min-height:0;padding:var(--gap-md) var(--gap-sm);flex-direction:column;flex:1;margin:0;list-style:none;display:flex;overflow-y:auto}.msg{align-items:flex-end;gap:6px;display:flex}.msg.mine{margin-left:var(--hub-mine-margin);flex-direction:row-reverse}.msg-avatar{width:28px;height:28px;font-size:var(--fs-tab);background:var(--surface);border:var(--border-width) solid var(--border);border-radius:50%;flex:none;place-items:center;display:grid;overflow:hidden}.msg-body{flex-direction:column;align-items:flex-start;gap:2px;min-width:0;display:flex}.msg.mine .msg-body{align-items:flex-end}.msg-name{font-size:var(--fs-tab);color:var(--text-muted)}.bubble{font-size:var(--fs-tile);overflow-wrap:anywhere;background:var(--surface);border:var(--border-width) solid var(--border);border-radius:var(--radius);margin:0;padding:6px 10px}.msg.mine .bubble{border-color:var(--accent);box-shadow:var(--glow)}.msg-image{aspect-ratio:1;width:min(100%,160px);font-size:var(--fs-tab);color:var(--text-muted);background:var(--surface);border:var(--border-width) solid var(--border);border-radius:var(--radius);place-items:center;display:grid;overflow:hidden}.msg-image img{object-fit:cover;width:100%;height:100%;display:block}.hub-composer{align-items:center;gap:var(--gap-sm);padding:var(--gap-sm);padding-bottom:calc(var(--gap-sm) + 2px);border-top:var(--border-width) solid var(--border);flex-wrap:wrap;display:flex}.hub-input{min-width:0;min-height:var(--tap);padding:0 var(--gap-sm);font:inherit;font-size:var(--fs-tile);color:var(--text);background:var(--surface);border:var(--border-width) solid var(--border);border-radius:var(--radius);flex:1}.hub-input::placeholder{color:var(--text-muted)}.hub-file,.hub-send{padding:0 var(--gap-sm);font-size:var(--fs-tile);flex:none}.hub-file .icon{transition:opacity .123s,filter .123s}.hub-file:not(:disabled):active .icon,.hub-file.picking .icon{opacity:1;filter:drop-shadow(0 0 4px var(--accent)) drop-shadow(0 0 10px var(--accent));transition-duration:80ms}.hub-composer :disabled{opacity:.45;cursor:default}@container (width<=300px){.hub-input{flex-basis:100%;order:-1}.hub-send{margin-left:auto}}.hub-resize{cursor:ew-resize;touch-action:none;justify-content:center;align-items:center;width:18px;display:flex;position:absolute;top:0;bottom:0;right:-9px}.hub-resize:after{content:"";background:var(--accent-bright);width:4px;height:40px;box-shadow:var(--glow);border-radius:2px}.bell{position:relative}.bell-dot{background:var(--accent-bright);width:10px;height:10px;box-shadow:0 0 6px var(--accent-bright);border-radius:50%;position:absolute;top:6px;right:6px}.notif-backdrop{z-index:20;display:none;position:absolute;inset:0}.notif-backdrop.open{display:block}.notif-bubble{--notif-right:var(--gap-sm);--bell-center:calc(var(--gap-md) + var(--tap) + var(--gap-sm) + var(--tap) / 2);--tail:10px;--notif-width:280px;--notif-max-height:50%;z-index:21;top:calc(env(safe-area-inset-top) + var(--gap-sm) * 2 + var(--tap) + var(--border-width) + var(--tail));right:var(--notif-right);width:min(var(--notif-width), calc(100% - var(--gap-sm) * 2));max-height:var(--notif-max-height);background:var(--bg);border:var(--border-width) solid var(--border);box-shadow:var(--glow);transform-origin:calc(100% - (var(--bell-center) - var(--notif-right))) 0;opacity:0;visibility:hidden;border-radius:16px;flex-direction:column;transition:transform .15s,opacity .15s,visibility 0s linear .15s;display:flex;position:absolute;transform:scale(.92)}.notif-bubble.open{opacity:1;visibility:visible;transition-delay:0s;transform:none}.notif-bubble:before{content:"";top:calc(var(--tail) * -.5 - var(--border-width));right:calc(var(--bell-center) - var(--notif-right) - var(--tail) / 2);width:var(--tail);height:var(--tail);background:var(--bg);border-top:var(--border-width) solid var(--border);border-left:var(--border-width) solid var(--border);border-top-left-radius:3px;position:absolute;transform:rotate(45deg)}.notif-header{justify-content:space-between;align-items:center;gap:var(--gap-sm);padding:var(--gap-sm) var(--gap-md);border-bottom:var(--border-width) solid var(--border);display:flex}.notif-title{font-size:var(--fs-title);text-shadow:0 0 6px var(--accent);margin:0}.notif-readall{font-size:var(--fs-tab);color:var(--accent-bright);background:0 0;border:0;padding:4px 0}.notif-readall:disabled{color:var(--text-muted);cursor:default}.notif-list{margin:0;padding:0;list-style:none;overflow-y:auto}.notif-item{align-items:flex-start;gap:var(--gap-sm);width:100%;padding:var(--gap-sm) var(--gap-md);text-align:left;border:0;border-bottom:1px solid var(--border);background:0 0;display:flex}.notif-list li:last-child .notif-item{border-bottom:0}.notif-item.unread{background:var(--surface)}.notif-dot{background:0 0;border-radius:50%;flex:none;width:8px;height:8px;margin-top:6px}.notif-item.unread .notif-dot{background:var(--accent-bright);box-shadow:0 0 6px var(--accent-bright)}.notif-text{flex-direction:column;flex:1;min-width:0;display:flex}.notif-item-title{font-size:var(--fs-tile)}.notif-detail{font-size:var(--fs-tab);color:var(--text-muted);overflow-wrap:anywhere}.notif-time{font-size:var(--fs-tab);color:var(--text-muted);flex:none}.notif-empty{padding:var(--gap-md);margin:0}@media (prefers-reduced-motion:reduce){.notif-bubble{transition:none}}.playlists{gap:var(--gap-md);flex-direction:column;display:flex}.pl-title{line-height:1.1;font-family:var(--font-heading);font-size:var(--fs-playlist-title);letter-spacing:.1em;text-shadow:0 0 6px var(--accent), 0 0 14px #2f95e0cc;align-self:flex-end;margin:0 -.1em 0 0;padding:0;font-style:italic}.pl-divider{height:5px;margin:0 calc(var(--gap-md) * -1);border:0;border-top:1px solid var(--accent);border-bottom:1px solid var(--accent);background:#eaf7ff;box-shadow:0 0 12px 2px #1a9dffcc,0 0 1px #eaf7ffe6}.pl-create{align-self:flex-start}.pl-list{gap:var(--gap-sm);flex-direction:column;margin:0;padding:0;list-style:none;display:flex}.pl-row{align-items:center;gap:var(--gap-sm);padding:var(--gap-sm);background:var(--surface);border:var(--border-width) solid var(--border);border-radius:var(--radius);box-shadow:var(--glow);display:flex}.pl-handle{padding:0 var(--gap-sm);color:var(--text-muted);font-size:var(--fs-title);cursor:grab;touch-action:none;background:0 0;border:0}.pl-row.dragging{border-color:var(--accent-bright);opacity:.85}.pl-row.dragging .pl-handle{cursor:grabbing}.pl-name{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;overflow:hidden}.pl-btn{min-width:36px;min-height:36px;padding:0 var(--gap-sm);font-size:var(--fs-tile);flex:none}.pl-star.on{color:#f5c518}.dialog-backdrop{z-index:30;background:var(--hub-dim);place-items:center;display:grid;position:absolute;inset:0}.dialog{width:min(280px, calc(100% - var(--gap-md) * 2));padding:var(--gap-md);text-align:center;background:var(--bg);border:var(--border-width) solid var(--border);box-shadow:var(--glow);border-radius:0}.dialog-title{margin:0 0 var(--gap-md);font-size:var(--fs-title)}.dialog-actions{gap:var(--gap-sm);justify-content:center;display:flex}.dialog-actions .control{border-radius:12px;flex:1}.pl-menu-wrap{position:relative}.pl-menu-wrap.open{z-index:5}.pl-menu{background:var(--menu-bg);border:var(--border-width) solid var(--border);width:180px;box-shadow:var(--glow), 0 6px 16px #0009;border-radius:12px;margin:0;padding:0;list-style:none;position:absolute;top:calc(100% + 6px);right:0;overflow:hidden}.pl-menu.up{top:auto;bottom:calc(100% + 6px)}.pl-menu button{width:100%;padding:.2rem var(--gap-md);font-size:var(--fs-tile);text-align:left;background:0 0;border:0;display:block}.pl-menu li+li button{border-top:1px solid var(--border)}.pl-menu button:hover,.pl-menu button:focus-visible{background:var(--surface)}.pl-error{margin:var(--gap-sm) 0 0;color:#ff6b6b;font-size:.875rem}.hub-add{color:var(--text);cursor:pointer;font-size:1.4rem;line-height:1}.hub-members{padding:2px var(--gap-md) 0;color:var(--text-muted);text-overflow:ellipsis;white-space:nowrap;margin:0;font-size:.75rem;overflow:hidden}.dialog.new-group{text-align:left}.new-group-label{margin:0 0 var(--gap-sm);font-size:var(--fs-title);display:block}.new-group-input{width:100%;margin-bottom:var(--gap-md);padding:.4rem var(--gap-sm);color:var(--text);font:inherit;background:var(--bg);border:1px solid var(--accent);box-shadow:var(--glow);outline:none}.new-group-friends{border:1px solid var(--border);max-height:9rem;margin:0;padding:0;list-style:none;overflow-y:auto}.new-group-friend{align-items:center;gap:var(--gap-sm);min-height:var(--tap);padding:0 var(--gap-sm);cursor:pointer;display:flex}.new-group-friend input{width:1.1rem;height:1.1rem;accent-color:var(--accent)}.new-group-empty{margin:0}.new-group-error{min-height:1.4em;margin:var(--gap-sm) 0 var(--gap-md);color:#ff7a7a;font-size:var(--fs-tile)}.dialog.new-group .dialog-actions{justify-content:flex-end}.dialog.new-group .dialog-actions .control{padding:0 var(--gap-md);flex:none}.hub-leave{font:inherit;color:var(--accent-bright);cursor:pointer;background:0 0;border:0;padding:0;text-decoration:underline}.hub-note{padding:var(--gap-sm) var(--gap-md) 0;font-size:var(--fs-tab);color:var(--text-muted);margin:0;list-style:none}.hub-note[role=alert]{color:#ff7a7a}.spam-popup{z-index:40;width:max-content;max-width:80%;padding:var(--gap-md);text-align:center;font-size:var(--fs-title);background:var(--surface);border:var(--border-width) solid #ff7a7a;border-radius:12px;animation:.18s ease-out spam-pop;position:absolute;top:18%;left:50%;transform:translate(-50%);box-shadow:0 0 14px #ff7a7a73}@keyframes spam-pop{0%{opacity:0;transform:translate(-50%)scale(.9)}to{opacity:1;transform:translate(-50%)scale(1)}}@media (prefers-reduced-motion:reduce){.spam-popup{animation:none}}.home .card,.home .tile{--art-placeholder:repeating-linear-gradient(45deg, #ffffff0a 0 6px, transparent 6px 12px), linear-gradient(135deg, hsl(var(--hue,217) 25% 22%), hsl(var(--hue,217) 26% 11%));flex-direction:column;gap:2px}.home .recent-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.home .card{min-width:0;min-height:84px;padding:var(--gap-md);text-align:left;justify-content:center;align-items:flex-start;display:flex}.card-label,.card-title,.card-sub{font-size:var(--fs-card)}.tile-sub{font-size:.7rem}.marquee{white-space:nowrap;max-width:100%;margin:-4px 0;padding:4px 0;overflow:hidden}.marquee.wrap{white-space:normal}.marquee-text{display:inline-block}.home{--art-blur:1.3px}.home .card,.home .tile{background:0 0;overflow:hidden}.home .card:after,.home .tile:after{content:"";inset:calc(var(--art-blur) * -3);z-index:-2;background:var(--art,var(--art-placeholder)) center / cover no-repeat;filter:blur(var(--art-blur));position:absolute}.pl-title-box{flex-direction:column;flex:1;align-items:flex-start;gap:2px;min-width:0;display:flex}.pl-title-box .pl-name,.pl-title-box .pl-name-input{max-width:100%}.pl-title-box .pl-name-input{align-self:stretch}.pl-name.pl-name-static{flex:none}.pl-owner{--owner-pic-size:20px;--owner-text-size:.75rem;--owner-color:var(--text-muted);--owner-gap:6px;align-items:center;gap:var(--owner-gap);max-width:100%;color:var(--owner-color);font-size:var(--owner-text-size);display:inline-flex}.pl-owner-label{white-space:nowrap;flex:none}.pl-owner-pic{width:var(--owner-pic-size);height:var(--owner-pic-size);background:var(--surface);border:1px solid var(--accent);border-radius:50%;flex:none;place-items:center;font-size:.65rem;display:grid;overflow:hidden}.pl-owner-pic img{object-fit:cover;width:100%;height:100%}.pl-owner-sep{opacity:.6;flex:none}.pl-owner-name{text-overflow:ellipsis;white-space:nowrap;min-width:0;overflow:hidden}.pl-name.pl-name-btn{color:inherit;font:inherit;text-align:left;cursor:text;background:0 0;border:0;flex:0 auto;margin-right:auto;padding:0}.pl-name-input{min-width:1px;padding:.3rem var(--gap-sm);color:var(--text);font:inherit;background:var(--bg);border:1px solid var(--accent);box-shadow:var(--glow);outline:none;flex:1}.pl-row{cursor:pointer}.pl-detail{flex-direction:column;align-items:flex-start;gap:9px;display:flex}.pl-detail-title{font-family:var(--font-heading);font-size:var(--fs-playlist-title);text-shadow:0 0 1.3px var(--accent), 0 0 14px #1a9dffcc;overflow-wrap:anywhere;margin:0 0 0 .6rem;font-style:normal;line-height:1.1}.pl-detail .pl-divider{align-self:stretch}.pl-detail-title{margin-block:-.3rem}.pl-detail hr:first-of-type{margin-top:1.2rem}.dialog.add-friend{text-align:left}.add-friend-label{margin-bottom:var(--gap-sm);font-size:var(--fs-title);display:block}.add-friend-input{width:100%;padding:.4rem var(--gap-sm);color:var(--text);font:inherit;background:var(--bg);border:1px solid var(--accent);box-shadow:var(--glow);border-radius:12px;outline:none}.add-friend-input:focus{border-color:var(--accent-bright);box-shadow:var(--glow), 0 0 19px color-mix(in srgb, var(--accent) 100%, transparent), inset 0 0 15px color-mix(in srgb, var(--accent) 95%, transparent)}.add-friend-error{min-height:1.4em;margin:var(--gap-sm) 0 var(--gap-md);color:#ff7a7a;font-size:var(--fs-tile)}.dialog.add-friend .dialog-actions{justify-content:flex-end}.dialog.add-friend .dialog-actions .control{padding:0 var(--gap-md);flex:none}.dialog.add-song{--add-song-extra:19px;--add-song-rows:4;width:min(300px, calc(100% - var(--gap-md) * 1.1));padding-bottom:calc(var(--gap-md) + var(--add-song-extra))}.add-song-field{position:relative}.add-song-results{z-index:2;max-height:calc(var(--add-song-rows) * 52px + (var(--add-song-rows) - 1) * 4px + 8px);background:var(--surface);border:var(--border-width) solid var(--accent);box-shadow:var(--glow), 0 8px 24px #000000b3;gap:4px;margin:0;padding:4px;list-style:none;display:grid;position:absolute;top:calc(100% + 4px);left:0;right:0;overflow-y:auto}.dialog.add-song .add-friend-input:focus{border-color:var(--accent);box-shadow:var(--glow)}.pl-add{align-self:flex-end;min-width:90px;min-height:48px;margin-top:20px;margin-right:2rem;padding:0 1rem;font-size:1.4rem}.pl-add-panel{--pl-add-rows:5;padding:var(--gap-sm);background:var(--surface);border:var(--border-width) solid var(--accent);box-shadow:var(--glow);align-self:stretch}.pl-add-input{width:100%;min-height:var(--tap);padding:0 var(--gap-sm);color:var(--text);font:inherit;background:var(--bg);border:1px solid var(--accent);outline:none}.pl-add-note{margin:var(--gap-sm) 0 0;font-size:.875rem}.pl-add-results,.pl-songs{gap:4px;margin:0;padding:0;list-style:none;display:grid}.pl-add-results{max-height:calc(var(--pl-add-rows) * 52px + (var(--pl-add-rows) - 1) * 4px);margin-top:var(--gap-sm);overflow-y:auto}.pl-songs{margin-top:var(--gap-sm);align-self:stretch}.pl-songs-note{margin:var(--gap-sm) 0 0;text-align:center;align-self:stretch}.pl-detail .pl-songs{--pl-songs-left:.6rem;margin:var(--gap-sm) 0 0 var(--pl-songs-left);align-self:stretch;gap:var(--gap-sm);flex-direction:column;display:flex}.pl-song-row{gap:var(--gap-sm)}.pl-song-main{align-items:center;gap:var(--gap-sm);min-width:0;min-height:44px;color:var(--text);font:inherit;text-align:left;cursor:pointer;background:0 0;border:0;flex:1;padding:0;display:flex}.pl-song-row.dragging{cursor:grabbing}.pl-detail .pl-song-row{background:color-mix(in srgb, var(--surface) 10%, var(--bg));box-shadow:none;border:0}.pl-detail .pl-song-row.dragging{background:var(--surface);opacity:1}.pl-detail .pl-song-delete{box-shadow:none;background:0 0;border:0}.search{padding:var(--search-top) var(--search-side) 0;flex-direction:column;display:flex}.search-title{margin:0 0 var(--search-title-gap);font-family:var(--search-title-font);font-size:var(--search-title-size);font-style:var(--search-title-style);font-weight:var(--search-title-weight);line-height:var(--search-title-line-height);letter-spacing:var(--search-title-spacing);color:var(--search-title-color);text-align:center;text-wrap:balance;text-shadow:var(--search-title-glow);justify-content:center;display:flex;overflow-x:clip}.search-title span{margin-right:calc(var(--search-title-spacing) * -1)}.search-title-wide span{white-space:nowrap}.search-box{width:85%;margin-inline:auto;position:relative}.search-row{align-items:stretch;gap:0;display:flex}.search-row>*+*{margin-left:calc(var(--border-width) * -1)}.search-input{min-width:0;min-height:var(--tap);padding:0 var(--gap-md);font:inherit;font-size:var(--fs-card);letter-spacing:.03em;color:var(--text);background:var(--surface);border:var(--border-width) solid var(--border);border-radius:var(--radius);box-shadow:var(--glow);outline:none;flex:1}.search-input::placeholder{color:var(--text-muted)}.search-row .control .icon{opacity:1}.search-row button[type=submit] .icon{transform:translateY(-1px)}.filter-placeholder{padding:0 6px;font-size:.75rem}.recent{z-index:10;padding:var(--gap-sm);background:var(--surface);border:var(--border-width) solid var(--accent);border-radius:var(--radius);box-shadow:var(--glow), 0 8px 24px #000000b3;position:absolute;top:calc(100% + .2px);left:0;right:0}.recent-title{margin:0 0 var(--gap-sm);color:var(--text-muted);letter-spacing:.12em;text-transform:uppercase;font-size:.75rem}.recent-list{flex-direction:column;margin:0;padding:0;list-style:none;display:flex}.recent-row{align-items:center;display:flex}.recent-item{min-width:0;min-height:var(--tap);padding:0 var(--gap-sm);letter-spacing:.03em;text-align:left;background:0 0;border:0;flex:1}.recent-item:hover,.recent-item:focus-visible{background:color-mix(in srgb, var(--accent) 16%, var(--surface))}.recent-x{width:var(--tap);min-height:var(--tap);color:var(--text-muted);background:0 0;border:0;flex:none}.recent-x:hover,.recent-x:focus-visible{color:var(--accent-bright)}.search-status{margin:calc(var(--gap-md) * 1.5) 0 0;text-align:center}.results{gap:var(--gap-md);margin-top:var(--gap-md);padding-inline:var(--search-side);display:grid}.result-title{margin:0 0 var(--gap-sm);font-size:var(--fs-title);font-weight:400}.result-list{gap:4px;margin:0;padding:0;list-style:none;display:grid}.result-row{align-items:center;gap:var(--gap-sm);width:100%;min-height:var(--tap);color:var(--text);font:inherit;text-align:left;cursor:pointer;background:0 0;border:0;padding:4px;display:flex}.result-row:hover{background:var(--surface)}.result-art{background:var(--art-placeholder);flex:none;width:44px;height:44px;overflow:hidden}.result-art.round{border-radius:50%}.result-art img{object-fit:cover;width:100%;height:100%;display:block}.result-text{min-width:0;display:grid}.result-name,.result-sub{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.result-sub{color:var(--text-muted);font-size:.8125rem}.dropdown{--dd-rows:5;--dd-row:52px;--dd-gap:4px;--dd-pad:6px;--dd-bar:14px;top:calc(100% + var(--gap-sm));z-index:10;box-sizing:border-box;max-height:calc(var(--dd-rows) * var(--dd-row) + (var(--dd-rows) - 1) * var(--dd-gap) + 2 * var(--dd-pad) + 2 * var(--border-width));padding:var(--dd-pad);background:var(--surface);border:var(--border-width) solid var(--accent);border-radius:var(--radius);box-shadow:var(--glow), 0 8px 24px #000000b3;scrollbar-width:thin;scrollbar-color:var(--accent) var(--menu-bg);position:absolute;left:0;right:0;overflow-y:auto}.dropdown-list{gap:var(--dd-gap);margin:0;padding:0;list-style:none;display:grid}.dropdown::-webkit-scrollbar{width:var(--dd-bar)}.dropdown::-webkit-scrollbar-track{background:var(--menu-bg);border:1px solid var(--border)}.dropdown::-webkit-scrollbar-thumb{background:var(--accent);border:1px solid var(--accent-bright);box-shadow:var(--glow)}.dropdown::-webkit-scrollbar-button:single-button{height:var(--dd-bar);background-color:var(--menu-bg);background-position:50%;background-repeat:no-repeat;background-size:10px}.dropdown::-webkit-scrollbar-button:single-button:vertical:decrement{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M1 7 L5 3 L9 7' fill='none' stroke='white' stroke-width='1.5'/%3E%3C/svg%3E")}.dropdown::-webkit-scrollbar-button:single-button:vertical:increment{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M1 3 L5 7 L9 3' fill='none' stroke='white' stroke-width='1.5'/%3E%3C/svg%3E")}.search{height:100%}.search-recent{--recent-top:calc(var(--gap-md) * 1.75);--recent-left:.3rem;--recent-side:7%;--recent-title-size:1.5rem;--recent-art-size:46.5px;--recent-name-size:.9rem;--recent-artist-size:.65rem;--recent-artist-color:#8f9bad;--recent-row-pad:.3rem var(--gap-md) .3rem .3rem;--recent-row-gap:.2rem;--recent-item-gap:var(--gap-md);--recent-row-bg:transparent;--recent-row-border:transparent;min-height:8rem;margin-top:var(--recent-top);padding-inline:var(--recent-side);margin-left:var(--recent-left);flex-direction:column;flex:1;display:flex}.search-recent-title{margin:0 0 var(--gap-md);font-family:var(--font-heading);font-size:var(--recent-title-size);letter-spacing:.08em;text-shadow:0 0 6px var(--accent), 0 0 10px #1a9dff80;font-style:normal;font-weight:400}.search-recent-list{gap:var(--recent-row-gap);flex-direction:column;flex:1;min-height:0;margin:0;padding:0 4px 6px 0;list-style:none;display:flex;overflow-y:auto}.search-recent-row{align-items:center;gap:var(--recent-item-gap);width:100%;min-height:calc(var(--recent-art-size) + 18px);padding:var(--recent-row-pad);border:var(--border-width) solid var(--recent-row-border);background:var(--recent-row-bg);color:var(--text);font:inherit;text-align:left;cursor:pointer;display:flex}.search-recent-row:hover,.search-recent-row:focus-visible{border-color:var(--accent);box-shadow:var(--glow)}.search-recent-art{width:var(--recent-art-size);height:var(--recent-art-size);box-shadow:var(--glow);border:0}.search-recent-dash{color:var(--text-muted);font-size:var(--recent-name-size);flex:none}.search-recent-text{min-width:0;display:grid}.search-recent-name,.search-recent-artist{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.search-recent-name{font-size:var(--recent-name-size);letter-spacing:.03em}.search-recent-artist{color:var(--recent-artist-color);font-size:var(--recent-artist-size)}.search-recent .recent-row{min-height:var(--tap)}.search-recent .recent-item{color:var(--text);font-size:var(--recent-name-size)}.filter-button.active{box-shadow:var(--glow);border-color:var(--accent-bright)}.filter-menu{--filter-width:8.5rem;--tail:10px;z-index:12;top:calc(100% + var(--tail) + 2px);width:var(--filter-width);background:var(--bg);border:var(--border-width) solid var(--border);box-shadow:var(--glow);border-radius:16px;flex-direction:column;padding:6px 0;display:flex;position:absolute;right:0}.filter-menu:before{content:"";top:calc(var(--tail) * -.5 - var(--border-width));right:calc(var(--tap) / 2 - var(--tail) / 2);width:var(--tail);height:var(--tail);background:var(--bg);border-top:var(--border-width) solid var(--border);border-left:var(--border-width) solid var(--border);border-top-left-radius:3px;position:absolute;transform:rotate(45deg)}.filter-title{padding:0 var(--gap-md) 4px;font-size:var(--fs-base);text-shadow:0 0 6px var(--accent);margin:0;font-weight:400}.filter-list{margin:0;padding:0;list-style:none}.filter-item{align-items:center;gap:var(--gap-sm);width:100%;min-height:30px;padding:0 var(--gap-md);color:var(--text);font:inherit;text-align:left;cursor:pointer;background:0 0;border:0;display:flex}.filter-item:hover,.filter-item:focus-visible{background:var(--surface)}.filter-check{border:2px solid var(--accent);flex:none;width:14px;height:14px}.filter-item[aria-pressed=true] .filter-check{background:var(--accent-bright);box-shadow:0 0 6px var(--accent)}.filter-divider{height:var(--border-width);margin:4px var(--gap-md);background:var(--border)}.filter-clear{margin:4px var(--gap-md) 2px;color:var(--text-muted);font:inherit;text-align:left;cursor:pointer;background:0 0;border:0;padding:0;font-size:.8125rem}.filter-clear:disabled{opacity:.4;cursor:default}.friends{--fs-friends-title:2.4rem;--friend-row-bg:#283140;--friend-row-border:#1b222d;--friend-row-gap:.9rem;flex-direction:column;min-height:100%;padding:0 28px 0 45px;display:flex;position:relative}.friends-line{top:calc(var(--gap-md) * -1);bottom:calc(var(--gap-md) * -1);border:0;border-left:1px solid var(--accent);border-right:1px solid var(--accent);background:#eaf7ff;width:5px;position:absolute;box-shadow:0 0 12px 2px #1a9dffcc,0 0 1px #eaf7ffe6}.friends-line.one{left:5px}.friends-line.two{left:16px}.friends-head{margin:var(--gap-md) 0 2.5rem;justify-content:space-between;align-items:center;gap:1.5rem;display:flex}.friends-actions{align-items:center;gap:var(--gap-sm);flex:none;margin-right:-28px;display:flex}.friends-add{flex:none}.friends-title{font-family:var(--font-heading);font-size:var(--fs-friends-title);letter-spacing:.1em;text-shadow:0 0 6px var(--accent), 0 0 14px #1a9dffcc;margin:0 -.1em 0 0;font-style:italic;line-height:1.1}.friends-list{gap:var(--friend-row-gap);flex-direction:column;margin:0 0 1.5rem;padding:0;list-style:none;display:flex}.friend-row{align-items:center;gap:var(--gap-md);min-height:56px;padding:.4rem var(--gap-sm);color:var(--text);background:linear-gradient(180deg, #2f3949, var(--friend-row-bg));border:3px solid var(--friend-row-border);display:flex;box-shadow:0 4px 10px #00000080,inset 0 1px #ffffff12}.friend-avatar{border:2px solid #fff;border-radius:50%;flex:none;width:44px;height:44px;overflow:hidden}.friend-name{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;overflow:hidden}.friend-dots{color:#fff;text-shadow:0 0 3px #000,0 0 3px #000;background:0 0;border:0;min-width:36px;min-height:36px;font-size:1.4rem}.friend-row .pl-menu button{color:var(--text,#fff)}.friends-blocked{margin-top:auto;margin-bottom:var(--gap-md);text-align:left;align-self:flex-end;max-width:9rem}.friend-name{color:inherit;font:inherit;text-align:left;background:0 0;border:0;padding:0}.friend-name-input{min-width:0;padding:.3rem var(--gap-sm);color:var(--text);font:inherit;background:var(--bg);border:1px solid var(--accent);box-shadow:var(--glow);outline:none;flex:1}.toast{z-index:40;border:var(--border-width) solid var(--border);background:var(--menu-bg);max-width:85%;box-shadow:var(--glow);color:var(--text);text-align:center;pointer-events:none;margin:0;padding:10px 18px;animation:2.4s forwards toast-life;position:absolute;top:45%;left:50%;transform:translate(-50%,-50%)}@keyframes toast-life{0%{opacity:0}12%{opacity:.95}70%{opacity:.95}to{opacity:0}}@media (prefers-reduced-motion:reduce){.toast{animation-duration:2.4s}}.friends-inbox{flex:none;place-items:center;min-width:3.4rem;min-height:0;display:grid;position:relative}.inbox{--inbox-width:19rem;--inbox-height:6rem;gap:var(--gap-sm);box-sizing:border-box;width:min(var(--inbox-width), calc(100% - var(--gap-md) * 2));height:var(--inbox-height);padding:var(--gap-sm);flex-direction:column;display:flex;overflow:hidden}.inbox-head{justify-content:space-between;align-items:center;gap:var(--gap-sm);flex:none;display:flex}.inbox-title{margin:0;font-size:.9375rem;font-weight:400}.inbox-close{min-width:1.75rem;min-height:1.75rem;padding:0}.inbox-list{align-content:start;gap:var(--gap-sm);flex:1;min-height:0;margin:0;padding:0;list-style:none;display:grid;overflow:auto}.inbox-row{align-items:center;gap:var(--gap-sm);display:flex}.inbox-text{text-align:left;overflow-wrap:anywhere;flex:1;min-width:0;font-size:.8125rem;line-height:1.2}.inbox-btn{flex:none;min-width:2rem;min-height:2rem;padding:0}.inbox-empty{flex:1;place-items:center;margin:0;display:grid}.friends-inbox .icon{width:40px;height:42px}.blocked-list{max-height:14rem;margin:0 0 var(--gap-md);padding:0;list-style:none;overflow-y:auto}.blocked-row{align-items:center;gap:20px;padding:3px;display:flex}.blocked-name{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;overflow:hidden}.blocked-kind{color:var(--text-muted);font-size:var(--fs-tile)}.blocked-remove{padding:0 var(--gap-sm);border-radius:12px;flex:none}.blocked-empty{margin:var(--gap-md) 0 calc(var(--gap-md) * 1);text-align:center;font-size:calc(var(--fs-title) * 1.3)}.library{--library-left:32px;--library-lower-shift:clamp(0px, calc(100dvh - 640px), 20dvh);--library-hint-size:var(--fs-tile);--library-input-size:.9rem;--library-recent-title-size:.9rem;--library-song-size:.8rem;--library-note-size:.8rem;--library-artist-size:34px;padding:var(--search-top) var(--search-side) var(--gap-md) var(--library-left);flex-direction:column;display:flex}.library-title{margin:0 0 calc(var(--gap-md) * 2.5);font-family:var(--font-heading);font-size:var(--fs-playlist-title);letter-spacing:.1em;text-align:center;text-indent:.1em;text-shadow:0 0 6px var(--accent), 0 0 14px #2f95e0cc;font-style:italic;font-weight:400;line-height:1.1}.library-bar{align-items:stretch;display:flex}.library-bar>*+*{margin-left:calc(var(--border-width) * -1)}.library-input{min-width:0;min-height:var(--tap);padding:0 var(--gap-md);font:inherit;font-size:var(--library-input-size);letter-spacing:.03em;color:var(--text);background:var(--surface);border:var(--border-width) solid var(--border);border-radius:var(--radius);box-shadow:var(--glow);outline:none;flex:1}.library-input::placeholder{color:var(--text-muted)}.library-confirm{padding:0 var(--gap-md);font-size:var(--library-input-size)}.library-file .icon{opacity:1}.library-hint{margin:var(--gap-md) 0 0;color:var(--text-muted);font-size:var(--library-hint-size);letter-spacing:.04em}.library-hint-small{margin-top:var(--gap-sm)}.library-selected{margin:var(--gap-sm) 0 0;color:var(--text-muted);font-size:var(--library-note-size);overflow-wrap:anywhere}.library-divider{height:5px;margin:calc(var(--gap-md) * 2.5 + var(--library-lower-shift)) calc((var(--search-side) + var(--gap-md)) * -1) 0 calc((var(--library-left) + var(--gap-md)) * -1);border:0;border-top:1px solid var(--accent);border-bottom:1px solid var(--accent);background:#eaf7ff;box-shadow:0 0 12px 2px #1a9dffcc,0 0 1px #eaf7ffe6}.library-recent-title{margin:calc(var(--gap-md) * 2) 0 var(--gap-md);font-size:var(--library-recent-title-size);letter-spacing:.06em;text-shadow:0 0 6px color-mix(in srgb, var(--accent) 55%, transparent);font-weight:400}.library-recent{gap:var(--gap-sm);flex-direction:column;margin:0;padding:0;list-style:none;display:flex}.library-item{align-items:center;gap:var(--gap-md);min-height:calc(var(--library-artist-size) + 8px);display:flex}.library-artist{width:var(--library-artist-size);height:var(--library-artist-size);border:2px solid var(--accent);object-fit:cover;box-shadow:var(--glow);border-radius:50%;flex:none}.library-artist-placeholder{background:var(--surface)}.library-song{min-width:0;font-size:var(--library-song-size);letter-spacing:.03em;flex:1}.library-results{margin:var(--gap-sm) 0 0;font-size:var(--library-note-size);overflow-wrap:anywhere;flex-direction:column;gap:4px;padding:0;list-style:none;display:flex}.library-result-bad{color:#ff7a7a}.library-rename-note{margin:var(--gap-sm) 0 var(--gap-md);color:var(--text-muted);font-size:var(--fs-tile)}.library-artist img{object-fit:cover;width:100%;height:100%;display:block}.library-artist-placeholder{overflow:hidden}.screen:has(.library){overflow:hidden}.library{height:100%;overflow:hidden}.library-recent-head{--library-switch-size:34px;align-items:center;gap:var(--gap-sm);margin:calc(var(--gap-md) * 2) 0 var(--gap-sm);display:flex}.library-recent-head .library-recent-title{margin:0}.library-switch{min-width:var(--library-switch-size);min-height:var(--library-switch-size);flex:none;padding:0;font-size:1rem}.library-recent-mode{margin:0 0 var(--gap-sm);color:var(--text-muted);font-size:.7rem}.profile-header{justify-content:space-between;align-items:flex-start;gap:var(--gap-md);display:flex}.profile-heading{min-width:0}.profile-title{font-size:var(--fs-playlist-title);margin:0;line-height:1.1}.profile-name{margin:var(--gap-sm) 0 0;color:var(--text-muted);overflow-wrap:anywhere}.profile-picture-area{align-items:center;gap:var(--gap-sm);flex-direction:column;flex:none;margin-top:9px;margin-right:20px;display:flex}.profile-picture{--profile-size:110px;width:var(--profile-size);height:var(--profile-size);color:var(--accent-bright);background:var(--surface);border:var(--border-width) solid var(--accent);box-shadow:var(--glow);cursor:pointer;border-radius:50%;place-items:center;padding:0;display:grid;overflow:hidden}.profile-picture:hover,.profile-picture:focus-visible{border-color:var(--accent-bright);box-shadow:var(--glow), 0 0 14px var(--accent)}.profile-picture img{object-fit:cover;width:100%;height:100%;display:block}.profile-picture .placeholder-icon{width:60%;height:60%;stroke:var(--accent-bright)}.profile-actions{gap:var(--gap-md);display:flex}.profile-link{font-size:var(--fs-tab);color:var(--accent-bright);cursor:pointer;background:0 0;border:none;padding:0}.profile-link:hover{text-decoration:underline}.profile-error{margin:var(--gap-md) 0 0;color:#ff7a7a}.profile{--menu-top:10rem;--menu-gap:1rem;--menu-left:2rem;--menu-icon-size:44px;--menu-font-size:1rem;--logout-top:3rem;--logout-right:7px;--logout-width:119px;--logout-height:auto;--logout-font-size:1rem}.profile-menu{gap:var(--menu-gap);margin:var(--menu-top) 0 0;flex-direction:column;padding:0;list-style:none;display:flex}.profile-menu-item{align-items:center;gap:var(--gap-md);width:100%;padding:var(--gap-sm) var(--menu-left);font-size:var(--menu-font-size);color:inherit;text-align:left;cursor:pointer;background:0 0;border:none;display:flex}.profile-menu-item:hover span:last-child,.profile-menu-item:focus-visible span:last-child{color:var(--accent-bright)}.profile-menu-icon{width:var(--menu-icon-size);height:var(--menu-icon-size);border:2px solid #fff;border-radius:50%;flex:none;place-items:center;display:grid;overflow:hidden}.profile-menu-icon img{object-fit:contain;width:60%;height:60%}.profile-logout{width:var(--logout-width);height:var(--logout-height);margin:var(--logout-top) var(--logout-right) 0 auto;font-size:var(--logout-font-size);text-align:right;padding-right:1.1rem;display:block}.profile-soon{margin:var(--gap-md) 0 0}.np{--np-bg:var(--bg);--np-line:#eaf7ff;--np-glow:0 0 30px 2px #1a9dffcc;--np-art-glow:0 0 100px 2px #1a9dffcc;--np-slab:#283140;--np-side:6%;--np-skip-glow:drop-shadow(0 0 30px var(--accent)) drop-shadow(0 0 14px var(--accent));--np-skip-color:var(--accent-bright);--np-skip-fade:.7s;z-index:50;width:100%;max-width:var(--app-max-width);padding:8dvh var(--np-side) 0;background:var(--np-bg);color:var(--np-line);flex-direction:column;align-items:center;margin:0 auto;display:flex;position:fixed;inset:0;overflow:hidden}.np-art{aspect-ratio:1/1.1;border:2px solid var(--np-line);background:var(--art-placeholder);width:100%;max-height:55dvh;box-shadow:var(--np-art-glow);cursor:pointer;flex:0 auto;padding:0;overflow:hidden}.np-art img{object-fit:cover;width:100%;height:100%;display:block}.np-title{border:3px solid var(--np-line);background:var(--np-slab);max-width:100%;box-shadow:var(--np-glow);font-family:var(--font);white-space:nowrap;text-overflow:ellipsis;text-shadow:var(--text-outline);margin:3dvh 0 0;padding:4px 10px;font-size:1.25rem;overflow:hidden}.np-progress{border:2px solid var(--np-line);width:90%;height:12px;box-shadow:inset 0 0 0 2px var(--np-bg), inset 0 0 0 4px var(--np-line), var(--np-glow);cursor:pointer;margin-top:3dvh}.np-progress-fill{background:var(--accent);height:100%;box-shadow:0 0 8px var(--accent);pointer-events:none}.np-problem{color:var(--text-muted);margin:1dvh 0 0;font-size:.875rem}.np-controls{justify-content:space-between;align-items:center;width:100%;margin-top:4dvh;display:flex}.np-btn,.np-play{cursor:pointer;background:0 0;border:0;place-items:center;padding:0;display:grid}.np-btn{aspect-ratio:1;width:16%}.np-btn svg{width:70%;fill:var(--np-line);stroke:var(--np-line);filter:drop-shadow(0 0 4px var(--accent))}.np-play{aspect-ratio:1;background:var(--np-line);width:20%;box-shadow:var(--np-glow);border-radius:50%}.np-play svg{width:100%;fill:var(--accent)}.np-btn:focus-visible,.np-play:focus-visible,.np-art:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.np-extra{border:3px solid var(--np-line);background:var(--np-slab);width:104%;box-shadow:var(--np-glow);border-bottom:0;flex:1;margin-top:5dvh;padding:3% 4% 0}.np-extra-inner{background:var(--np-bg);border:3px solid var(--np-line);border-bottom:0;height:100%}.np-note{width:16%;position:relative}.np-note .np-btn{width:100%}.np-volume{width:7rem;position:absolute;bottom:calc(100% + 6px);left:0}.np-volume input{appearance:none;cursor:pointer;background:0 0;width:100%;height:16px;margin:0;display:block}.np-volume input::-webkit-slider-runnable-track{border:2px solid var(--np-line);background:linear-gradient(var(--accent), var(--accent)) 0 / var(--fill) 100% no-repeat, var(--np-slab);height:5px;box-shadow:var(--np-glow)}.np-volume input::-moz-range-track{border:2px solid var(--np-line);background:linear-gradient(var(--accent), var(--accent)) 0 / var(--fill) 100% no-repeat, var(--np-slab);height:5px;box-shadow:var(--np-glow)}.np-volume input::-webkit-slider-thumb{appearance:none;border:2px solid var(--np-line);background:var(--np-line);width:10px;height:16px;box-shadow:var(--np-glow);margin-top:-7px}.np-volume input::-moz-range-thumb{border:2px solid var(--np-line);background:var(--np-line);width:8px;height:14px;box-shadow:var(--np-glow);border-radius:0}.np-note .np-btn[aria-expanded=true] svg{fill:var(--accent-bright);stroke:var(--accent-bright);filter:drop-shadow(0 0 6px var(--accent)) drop-shadow(0 0 14px var(--accent))}.np-lyrics{text-align:center;font-family:var(--font);color:var(--text-muted);margin:0;padding:3dvh 4%;font-size:1rem}.np-skip svg{transition:filter var(--np-skip-fade), fill var(--np-skip-fade), stroke var(--np-skip-fade)}.np-skip.tapped svg{fill:var(--np-skip-color);stroke:var(--np-skip-color);filter:var(--np-skip-glow)}.np-close{--np-close-top:2rem;--np-close-right:2.3rem;--np-close-bg:color-mix(in srgb, var(--accent) 15%, transparent);z-index:2;top:var(--np-close-top);right:var(--np-close-right);min-width:33px;min-height:33px;padding:0 var(--gap-sm);color:var(--text);font-size:calc(var(--fs-tile) * 1.05);background:var(--np-close-bg);box-shadow:none;cursor:pointer;border:0;border-radius:10px;position:absolute}.mini-slot:empty{display:none}.mini{--mini-bg:#283140;--mini-art-size:45px;--mini-title-size:14.5px;--mini-btn-size:48px;--mini-pad-y:5px;--mini-pad-left:20px;--mini-pad-right:45px;--mini-gap:4px;align-items:center;gap:var(--mini-gap);padding:var(--mini-pad-y) var(--mini-pad-right) var(--mini-pad-y) var(--mini-pad-left);background:var(--mini-bg);border-top:var(--border-width) solid var(--border);display:flex}.mini-main{min-width:0;min-height:20px;color:inherit;text-align:left;background:0 0;border:0;flex:1;align-items:center;gap:12px;padding:0;display:flex}.mini-art{width:var(--mini-art-size);height:var(--mini-art-size);background:#ffffff14;border-radius:6px;flex:none;overflow:hidden}.mini-art img{object-fit:cover;width:100%;height:100%;display:block}.mini-title{min-width:0;font-size:var(--mini-title-size);flex:1}.mini-btn{width:var(--mini-btn-size);height:var(--mini-btn-size);color:var(--accent-bright);background:0 0;border:0;flex:none;place-items:center;padding:0;display:grid}.mini-btn svg{fill:currentColor;width:60%;height:60%}.mini-btn:active{filter:drop-shadow(0 0 6px var(--accent))}.np--hidden{display:none}.login{min-height:100dvh;max-width:var(--app-max-width);padding:calc(var(--gap-md) + 6vh + env(safe-area-inset-top)) 24px calc(var(--gap-md) + env(safe-area-inset-bottom));background:var(--bg);flex-direction:column;align-items:center;margin:0 auto;display:flex}.login-brand{text-align:center;flex-direction:column;align-items:center;gap:16px;display:flex}.login-logo{object-fit:contain;width:200px;height:200px;display:block}img.login-logo{transform-origin:50%;pointer-events:none;transform:scale(2.1)}.login-logo-placeholder{color:var(--text-muted);font-size:var(--fs-tile);border:var(--border-width) dashed var(--border);box-shadow:var(--glow);border-radius:50%;place-items:center;display:grid}.login-caption{letter-spacing:.06em;color:color-mix(in srgb, var(--accent-bright) 80%, transparent);text-shadow:0 0 6px color-mix(in srgb, var(--accent) 55%, transparent), 0 0 16px color-mix(in srgb, var(--accent) 30%, transparent);margin:0;font-size:1.05rem;font-style:italic;animation:4.5s ease-in-out infinite alternate login-glow}@keyframes login-glow{0%{opacity:.72;text-shadow:0 0 5px color-mix(in srgb, var(--accent) 40%, transparent), 0 0 12px color-mix(in srgb, var(--accent) 20%, transparent)}to{opacity:.95;text-shadow:0 0 7px color-mix(in srgb, var(--accent) 65%, transparent), 0 0 20px color-mix(in srgb, var(--accent) 38%, transparent)}}@media (prefers-reduced-motion:reduce){.login-caption{opacity:.85;animation:none}}.login-form{--login-scale:.66;--login-warn:#ff5a5a;gap:calc(var(--gap-md) * var(--login-scale));width:calc(320px * var(--login-scale));padding-top:calc(40px * var(--login-scale));text-align:left;flex-direction:column;margin-block:32px auto;display:flex;transform:none}.login-field{gap:calc(6px * var(--login-scale));flex-direction:column;display:flex}.login-field label{font-size:calc(var(--fs-title) * var(--login-scale))}.login-input{width:100%;min-height:calc(var(--tap) * var(--login-scale));padding:0 calc(var(--gap-md) * var(--login-scale));color:var(--text);font:inherit;font-size:calc(1rem * var(--login-scale));background:var(--surface);border:calc(var(--border-width) * var(--login-scale)) solid var(--border);border-radius:calc(12px * var(--login-scale));box-shadow:var(--glow);outline:none}.login-input:focus{border-color:var(--accent-bright);box-shadow:var(--glow), 0 0 14px color-mix(in srgb, var(--accent) 80%, transparent)}.login-check{align-items:center;gap:calc(10px * var(--login-scale));font-size:calc(var(--fs-tile) * var(--login-scale));cursor:pointer;display:flex}.login-check input{width:calc(22px * var(--login-scale));height:calc(22px * var(--login-scale));accent-color:var(--accent);cursor:pointer;flex:none;margin:0}.login-check span{transition:color .15s}.login-check.warn span{color:var(--login-warn)}.login-error{color:#ff6b6b;min-height:1.4em;margin:0;font-size:.875rem}