*{box-sizing:border-box}body,html{background:var(--surface,var(--bg))}body{margin:0;font-family:var(--font-ui);color:var(--fg)}a{color:inherit;text-decoration:none}.small{font-size:12px}.btn:focus-visible,a:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.site-header{background:var(--surface-site-header,var(--surface,var(--bg)));border-bottom:1px solid var(--border-site-header);padding:10px 16px;display:flex;align-items:center;justify-content:flex-start}.site-header .logo{height:56px;width:auto}.site-footer{text-align:center;font-size:12px;padding:16px;border-top:1px solid var(--border);background:var(--surface-footer,var(--surface,var(--bg)))}.site-footer a:hover{text-decoration:underline}.header{padding:12px 16px;border-bottom:1px solid var(--border-header);background:var(--surface-header,var(--surface,var(--bg)))}.breadcrumbs a{border-bottom:1px dotted var(--fg)}.container{padding:10px 16px 120px;background:var(--surface-container,transparent)}.list{margin:0;padding:0;list-style:none}.item{display:flex;gap:10px;align-items:center;padding:8px 6px;border-bottom:1px dashed var(--border)}.icon{font-size:18px;width:22px;text-align:center}.meta{margin-left:auto;font-size:12px;white-space:nowrap}.topbar{display:flex;gap:10px;align-items:center;justify-content:space-between}.top-actions{display:flex;gap:10px;align-items:center}.footer-player{position:fixed;left:0;right:0;bottom:0;z-index:20;border-top:1px solid var(--border);background:var(--surface-footer-player,var(--surface-alt,#fafafa));padding:10px 12px;display:flex;gap:10px;align-items:center;flex-wrap:wrap;transform:translateY(100%);opacity:0;pointer-events:none;transition:transform 220ms,opacity 220ms}body.has-playback .footer-player{transform:translateY(0);opacity:1;pointer-events:auto}body.no-anim .footer-player{transition:none}.player-cover{width:44px;height:44px;object-fit:cover;border-radius:6px;border:1px solid var(--border);background:var(--placeholder,#eee)}.now{min-width:200px}.controls{display:flex;gap:8px;align-items:center}.btn{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border:1px solid var(--border);border-radius:8px;background:var(--surface-btn,var(--surface,#fff));cursor:pointer;transition:.15s;color:var(--fg)}.btn .icon{width:22px;height:22px;display:block}.btn:hover{background:var(--accent-bg)}.btn:active{transform:scale(.97)}.btn .icon-pause,.btn.is-playing .icon-play{display:none}.btn.is-playing .icon-pause{display:block}.playlist-btn .icon-remove{display:none}.playlist-btn.is-added{border-color:var(--accent);background:var(--accent-bg);color:var(--accent)}.playlist-btn.is-added .icon-add{display:none}.playlist-btn.is-added .icon-remove{display:block}.playlist-nav-btn{position:relative}.playlist-nav-btn.is-active{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent) inset}.playlist-nav-btn[data-count]:not([data-count=""]):not([data-count="0"])::after{content:attr(data-count);position:absolute;top:-6px;right:-6px;min-width:18px;height:18px;padding:0;border-radius:10px;background:var(--badge-bg);color:var(--badge-fg);font-size:10px;line-height:18px;text-align:center;font-weight:600}.toast{position:fixed;top:16px;left:50%;transform:translate(-50%,-10px);padding:10px 18px;border-radius:10px;border:1px solid var(--border);background:var(--surface-toast,var(--surface,#fff));color:var(--fg);box-shadow:var(--shadow-toast);opacity:0;pointer-events:none;transition:opacity 160ms,transform 160ms;z-index:80;font-size:14px;font-weight:500}.toast.is-visible{opacity:1;transform:translate(-50%,0)}.range{appearance:none;width:220px;height:6px;border-radius:6px;background:var(--range-track);outline:0;accent-color:var(--range-play)}.range::-webkit-slider-thumb{appearance:none;width:14px;height:14px;border-radius:50%;background:var(--range-thumb);cursor:pointer}.range::-moz-range-thumb{width:14px;height:14px;border-radius:50%;background:var(--range-thumb);cursor:pointer}.range::-moz-range-track{background:var(--range-track);height:6px;border-radius:6px}.range::-moz-range-progress{background:var(--range-play);height:6px;border-radius:6px}.range.volume{background:var(--volume-track);accent-color:var(--volume-play)}.range.volume::-webkit-slider-thumb{background:var(--volume-thumb)}.range.volume::-moz-range-thumb{background:var(--volume-thumb)}.range.volume::-moz-range-progress{background:var(--volume-play);height:6px;border-radius:6px}#h-vol,#vol{accent-color:var(--volume-play);height:6px;border-radius:6px;background:var(--volume-track)}#h-vol::-webkit-slider-thumb,#vol::-webkit-slider-thumb{background:var(--volume-thumb)}#h-vol::-moz-range-thumb,#vol::-moz-range-thumb{background:var(--volume-thumb)}#h-vol::-moz-range-progress,#vol::-moz-range-progress{background:var(--volume-play);height:6px;border-radius:6px}.time{font-variant-numeric:tabular-nums;font-size:12px;white-space:nowrap;min-width:72px}.vol{display:flex;gap:6px;align-items:center}.badge{font-size:11px;color:var(--badge-fg);background:var(--badge-bg);padding:2px 6px;border-radius:6px}.folder-cover{width:80px;height:80px;object-fit:cover;border-radius:8px;border:1px solid var(--border);background:var(--placeholder,#eee);flex-shrink:0}.folder-icon{display:inline-block;width:80px;text-align:center;font-size:40px;line-height:1}.album-cover-wrap,.header-cover-wrap{width:100%;overflow:hidden;border-bottom:1px solid var(--border);background:var(--surface-muted,#f4f4f4)}.header-cover-wrap{cursor:zoom-in}.album-cover,.header-cover{width:100%;height:clamp(200px,26vw,460px);object-fit:cover;object-position:center center;display:block}@media(max-width:1024px){.album-cover,.header-cover{height:clamp(180px,35vw,360px)}}@media(max-width:600px){.header-cover-wrap{max-height:none}.album-cover,.header-cover{height:auto;aspect-ratio:1/1;object-fit:cover}}.header-cover-wrap.expanded .header-cover{height:auto;max-height:none;aspect-ratio:auto;object-fit:contain}.header-cover-wrap.expanded{cursor:zoom-out}.album-player{padding:16px 0 12px;display:flex;flex-direction:column;gap:16px;text-align:center;border-bottom:1px solid var(--border);background:var(--surface-album-player,var(--surface-alt,#fafafa))}.album-cover-wrap{border-radius:12px;border:1px solid var(--border);background:var(--placeholder,#eee);aspect-ratio:1/1;width:min(520px,100%);margin:0 auto}.album-cover-wrap .album-cover{width:100%;height:100%;aspect-ratio:auto;object-fit:cover;border-radius:12px}.album-cover.placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;border-radius:12px;background:var(--placeholder,#eee);color:var(--placeholder-fg,#bbb);font-size:clamp(64px, 22vw, 220px)}.album-meta{padding:0 4px}.album-title{font-size:20px;font-weight:600;margin-bottom:4px}.album-sub{font-size:14px}.album-controls{display:flex;flex-direction:column;align-items:center;gap:12px}.album-controls .controls{display:flex;justify-content:center;gap:12px}.album-controls .btn{width:46px;height:46px;border-radius:10px;font-size:20px}.album-controls .btn .icon{width:28px;height:28px}.album-controls .progress{display:flex;align-items:center;gap:10px;width:90%;max-width:500px}.range.wide{width:100%}.album-controls .time{font-size:13px}.album-controls .vol{justify-content:center;gap:8px}.album-controls .vol input{width:120px}playlist-empty{margin:12px 0;padding:14px 16px;border:1px dashed var(--border);border-radius:10px;text-align:center;color:var(--muted);background:var(--surface-playlist,var(--surface,transparent))}@media (max-width:600px){.basicLightbox{align-items:flex-start}.basicLightbox__placeholder img{max-height:96vh}}@media (min-width:1025px){.footer-player{display:flex;align-items:center;gap:12px;padding:10px 14px;flex-wrap:nowrap}.footer-player>img.player-cover{width:44px;height:44px;flex:0 0 44px}.footer-player>.now{flex:1 1 auto;min-width:0;overflow:hidden;display:flex;flex-direction:column}.footer-player .now #now-title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.footer-player>.controls:nth-child(3){margin-left:auto;display:flex;gap:10px}.footer-player>.controls:nth-child(4){display:flex;align-items:center;gap:8px;width:320px;max-width:40%}.footer-player>.controls:nth-child(4) .range{width:100%}.footer-player>.vol{display:flex;align-items:center;gap:8px}.footer-player>.vol input{width:140px}}body:not(.album-view) .nav-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(var(--nav-col-min),var(--nav-col-max)));gap:24px;border:none;padding:0;list-style:none;width:100%;justify-content:start;justify-items:stretch;align-content:start;--card-pad:var(--nav-card-pad)}body:not(.album-view) .nav-grid .item{display:block;border:0;padding:0;text-align:initial;gap:0}body.cards-inset:not(.album-view) .nav-grid .card{padding:var(--card-pad)}body.cards-inset:not(.album-view) .nav-grid .card .card-cover{display:block;width:100%;height:auto;aspect-ratio:1/1;object-fit:cover;border:1px solid var(--border);border-radius:calc(var(--card-radius) - 6px);background:var(--placeholder,#eee)}body:not(.album-view) .nav-grid .card .title{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;min-height:2.6em;line-height:1.25;text-align:center}body:not(.album-view) .nav-grid .card .card-body{padding:10px 12px 14px}@media (max-width:1024px){.footer-player{display:grid;grid-template-columns:44px 1fr auto;grid-template-rows:auto auto;column-gap:10px;row-gap:8px;padding:8px 10px;align-items:center}.footer-player>img.player-cover{grid-column:1;grid-row:1;width:44px;height:44px}.footer-player>.now{grid-column:2;grid-row:1;min-width:0;overflow:hidden;display:flex;flex-direction:column;align-items:flex-start}.footer-player .now #now-title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.footer-player .now #now-sub{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px}.footer-player>.controls:nth-child(3){grid-column:3;grid-row:1;justify-self:end}.footer-player>.controls:nth-child(4){grid-column:1/span 2;grid-row:2;display:flex;align-items:center;gap:8px;width:100%}.footer-player>.controls:nth-of-type(2) .range{flex:1 1 auto;min-width:0}.footer-player>.controls:nth-of-type(2) .time{flex:0 0 auto}.footer-player>.vol{grid-column:3;grid-row:2;justify-self:end;display:flex;align-items:center;gap:0}.footer-player>.vol input{width:100px}.footer-player .controls .btn{width:40px;height:40px}}.theme .topbar{border-radius:10px;padding:8px 12px;margin:6px 0 10px}.theme .hero{border-radius:16px;padding:clamp(16px,4vw,36px);position:relative;overflow:hidden}.btn.primary{border-color:var(--btn-primary-border-color);background:var(--btn-primary-bg);color:var(--btn-primary-fg)}.btn.primary .icon{color:var(--btn-primary-fg)}.btn.primary:hover{border-color:var(--btn-primary-border-color-hover);background:var(--btn-primary-bg-hover);color:var(--btn-primary-fg-hover)}.btn.primary:hover .icon{color:var(--btn-primary-fg-hover)}#songs-list .item .song{font-family:var(--font-ui-alt);transition:color 150ms,font-weight 150ms}#songs-list .item.is-active{background:var(--accent-bg);border-left:3px solid var(--accent);border-radius:6px}#songs-list .item.is-active .song{font-weight:600}.menu-container,.menu-toggle{position:relative}.menu-dropdown{position:absolute;top:100%;right:0;background:var(--surface-menu,var(--surface,#fff));border:1px solid var(--border);border-radius:8px;box-shadow:var(--shadow-toast);padding:8px 0;min-width:160px;z-index:100;font-size:12px}.menu-section{padding:0 12px;margin-bottom:8px}.menu-section:last-child{margin-bottom:0}.menu-section-title{margin:0 0 4px;font-size:11px;font-weight:600;color:var(--fg);text-transform:uppercase;letter-spacing:.5px}.menu-list{list-style:none;margin:0;padding:0}.menu-list li{margin:0}.menu-link{display:block;padding:6px 12px;color:var(--fg);text-decoration:none;font-size:12px;border-radius:4px;transition:background-color .15s}.menu-link:hover{background-color:var(--accent-bg);color:var(--accent)}.btn-theme{background:0 0;border:none;cursor:pointer;text-align:left;width:100%;padding:6px 12px;color:var(--fg);font-size:12px;border-radius:4px;transition:background-color .15s}.btn-theme:hover{background-color:var(--accent-bg);color:var(--accent)}.menu-dropdown[hidden]{display:none}.card{width:100%;background:var(--card-bg);border:1px solid var(--card-border-color);border-radius:var(--card-radius);box-shadow:var(--card-shadow);transition:transform .15s,box-shadow .15s,border-color .15s;overflow:hidden;display:flex;flex-direction:column}.card:hover{transform:translateY(-1px);box-shadow:var(--card-shadow-hover);border-color:var(--border-hover);background:var(--card-bg-hover);width:100%;height:auto;aspect-ratio:1/1;object-fit:cover;background:var(--card-cover-bg)}.card .card-body{padding:var(--card-pad);text-align:center}.card .kicker{font-size:var(--card-kicker-size);color:var(--card-kicker-color);letter-spacing:.08em;text-transform:uppercase;margin-bottom:6px}.card .title{display:block;font-family:var(--font-ui-alt);font-weight:var(--card-title-weight);line-height:1.2;word-break:break-word}.card .folder-icon{width:100%;aspect-ratio:1/1;display:flex;align-items:center;justify-content:center;border-radius:calc(var(--card-radius) - 2px);border:1px solid var(--card-border-color);background:var(--card-empty-bg);font-size:clamp(72px, 16vw, 140px);line-height:1}body.cards-inset .card{padding:var(--card-pad)}body.cards-inset .card .card-cover{border-radius:calc(var(--card-radius) - 6px);border:1px solid var(--card-border-color)}body.cards-inset .card .card-body{padding:calc(var(--card-pad) - 2px) var(--card-pad) var(--card-pad)}body.cards-flush .card{padding:0;border-radius:var(--card-radius);overflow:hidden}body.cards-flush .card .card-cover{border-radius:0}body.cards-flush .card .card-body{padding:12px 10px 14px}body.cards-polaroid .card{padding:0;background:var(--card-bg);border-color:var(--border-hover)}body.cards-polaroid .card .card-cover{border-radius:0;box-shadow:inset 0 -1px 0 var(--border-subtle)}body.cards-polaroid .card .card-body{background:var(--card-bg);padding:16px 12px 18px;border-top:1px solid var(--border-subtle)}body.cards-polaroid .card .kicker{letter-spacing:.06em;opacity:.8}body.cards-hide-kicker .card .kicker{display:none}@media (max-width:900px){:root{--card-title-size:18px}}@media (max-width:600px){:root{--nav-card-pad:12px;--card-title-size:16px}body:not(.album-view) .nav-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}body:not(.album-view) .nav-grid .card,body:not(.album-view) .nav-grid .card .card-body,body:not(.album-view) .nav-grid .card .card-body .title{min-width:0}.folder-name a{font-size:20px}.card .card-body,body.cards-inset .card{padding:10px}}.list .card .card-cover.folder-cover{width:100%!important;height:auto!important;aspect-ratio:1/1;object-fit:cover}.card:hover .card-cover{filter:saturate(1.02)}