:root{--bg:#fafafa;--fg:#212121;--mute:#6b6b6b;--card:#fff;--line:#e3e3e3;--hov:#eef3ff;--acc:#2979ff;--bar:#2979ff;--barfg:#fff;color-scheme:light}
@media (prefers-color-scheme:dark){:root:not([data-theme]){--bg:#141920;--fg:#e6e6e6;--mute:#9aa3ad;--card:#1b222b;--line:#2a333d;--hov:#232c37;--acc:#6ea4ff;--bar:#20262e;--barfg:#e6e6e6;color-scheme:dark}}
:root[data-theme=light]{--bg:#fafafa;--fg:#212121;--mute:#6b6b6b;--card:#fff;--line:#e3e3e3;--hov:#eef3ff;--acc:#2979ff;--bar:#2979ff;--barfg:#fff;color-scheme:light}
:root[data-theme=dark]{--bg:#141920;--fg:#e6e6e6;--mute:#9aa3ad;--card:#1b222b;--line:#2a333d;--hov:#232c37;--acc:#6ea4ff;--bar:#20262e;--barfg:#e6e6e6;color-scheme:dark}
:root[data-theme=sepia]{--bg:#f4ecd8;--fg:#3b2f1e;--mute:#6b5a40;--card:#fbf5e6;--line:#d9caa8;--hov:#efe1c4;--acc:#7a3b12;--bar:#7a5530;--barfg:#fbf5e6;color-scheme:light}
:root[data-theme=custom]{--card:color-mix(in srgb,var(--fg) 5%,var(--bg));--mute:color-mix(in srgb,var(--fg) 65%,var(--bg));--line:color-mix(in srgb,var(--fg) 20%,var(--bg));--hov:color-mix(in srgb,var(--fg) 9%,var(--bg));--acc:color-mix(in srgb,#2979ff 60%,var(--fg));--bar:color-mix(in srgb,var(--fg) 12%,var(--bg));--barfg:var(--fg)}
*{box-sizing:border-box}
html{font-size:var(--fs,16px);-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--fg);font:1rem/1.45 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;padding-bottom:6rem}
svg{fill:currentColor}
header{position:sticky;top:0;z-index:3;background:var(--bar);color:var(--barfg);box-shadow:0 1px 3px rgba(0,0,0,.2)}
.hb{max-width:1400px;margin:0 auto;display:flex;gap:10px;align-items:center;padding:8px 16px}
.logo{color:inherit;text-decoration:none;font-weight:600;white-space:nowrap}
.blink{color:inherit;text-decoration:none;white-space:nowrap;font-size:.9rem;padding:6px 8px;border-radius:6px}.blink:hover{background:rgba(127,127,127,.25)}
#q{flex:1;min-width:0;border:0;border-radius:6px;padding:.5rem .7rem;font:inherit;background:rgba(127,127,127,.22);color:inherit}
#q::placeholder{color:inherit;opacity:.75}
.tb{background:none;border:0;color:inherit;cursor:pointer;padding:6px;border-radius:6px;display:flex;align-items:center;gap:4px;font:inherit;font-size:.9rem}
.tb svg{width:22px;height:22px}.tb:hover{background:rgba(127,127,127,.25)}
#prefs{max-width:1400px;margin:0 auto;padding:4px 16px 12px;color:var(--barfg)}
#prefs[hidden]{display:none}
#prefs .row{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin:6px 0}
#prefs .lbl{min-width:6.5rem;opacity:.85;font-size:.9rem}
#prefs button{font:inherit;font-size:.85rem;padding:4px 10px;border:1px solid rgba(127,127,127,.6);border-radius:6px;cursor:pointer}
#prefs button[aria-pressed=true]{outline:2px solid currentColor;outline-offset:1px;font-weight:700}
.sw-auto{background:linear-gradient(135deg,#fbfaf7 0 55%,#cfd3da 55% 100%);color:#1c1b19}
.sw-light{background:#fafafa;color:#212121}.sw-dark{background:#141920;color:#e6e6e6}
.sw-sepia{background:#f4ecd8;color:#3b2f1e}.sw-custom{background:linear-gradient(90deg,#fde68a,#93c5fd,#f9a8d4);color:#212121}
.zb{background:var(--card);color:var(--fg)}
.quick{display:flex;gap:4px}.quick button{font:inherit;font-size:.75rem;padding:2px 7px;border:1px solid rgba(127,127,127,.6);border-radius:5px;cursor:pointer}
.quick button[aria-pressed=true]{outline:2px solid currentColor;outline-offset:1px;font-weight:700}
@media (max-width:720px){.quick{display:none}}
#prefs .custom{display:none}:root[data-theme=custom] #prefs .custom{display:flex}
#prefs input[type=color]{width:42px;height:28px;border:1px solid rgba(127,127,127,.6);padding:0;background:none;vertical-align:middle}
#warn{font-size:.8rem;color:#ffb3a8}
main{max-width:1400px;margin:0 auto;padding:0 16px}
.crumbs{padding:14px 0 4px;font-size:.9rem;color:var(--mute);overflow-wrap:anywhere}
.crumbs a{color:var(--acc);text-decoration:none}
h1{font-size:1.35rem;margin:4px 0}
.meta{color:var(--mute);font-size:.85rem;margin:2px 0 12px}
.note{margin:0 0 12px}
.actions{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:6px}
.btn{display:inline-flex;gap:6px;align-items:center;border:1px solid var(--line);background:var(--card);color:var(--fg);padding:.45rem .8rem;border-radius:6px;text-decoration:none;font:inherit;font-size:.9rem;cursor:pointer}
.btn svg{width:18px;height:18px}.btn.pri{background:var(--acc);border-color:var(--acc);color:#fff}
h2{font-size:.8rem;font-weight:600;color:var(--mute);text-transform:uppercase;letter-spacing:.05em;margin:18px 0 6px}
ul.list{list-style:none;margin:0;padding:0;background:var(--card);border:1px solid var(--line);border-radius:8px;overflow:hidden}
ul.list li{display:flex;align-items:center;gap:10px;border-top:1px solid var(--line);padding:0 6px 0 12px;min-height:2.9rem}
ul.list li:first-child{border-top:0}
ul.list li{position:relative}ul.list .nm::after{content:"";position:absolute;inset:0}ul.list .ia{position:relative;z-index:1}
ul.list li:hover,ul.list li.on{background:var(--hov)}
ul.list li.on .nm{color:var(--acc);font-weight:600}
.ic{width:22px;height:22px;flex:none;color:var(--acc)}
.nm{flex:1;min-width:0;color:inherit;text-decoration:none;overflow-wrap:anywhere;padding:.65rem 0}
.sz{color:var(--mute);font-size:.8rem;white-space:nowrap}
.ia{color:var(--mute);padding:8px;display:flex;border-radius:6px}.ia svg{width:20px;height:20px}
.ia:hover{color:var(--acc);background:var(--hov)}
.hide{display:none!important}
#none{color:var(--mute);padding:10px 0}
footer{color:var(--mute);font-size:.85rem;padding:22px 0}
footer a{color:var(--acc)}
#player{position:fixed;left:0;right:0;bottom:0;z-index:2;background:var(--card);border-top:1px solid var(--line);box-shadow:0 -2px 6px rgba(0,0,0,.12)}
#player .pi{max-width:1400px;margin:0 auto;padding:8px 16px;display:flex;flex-wrap:wrap;gap:4px 12px;align-items:center}
#pt{flex:1 1 200px;min-width:0;font-size:.85rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#au{flex:3 1 320px;min-width:0;height:40px}
#vi{display:block;width:100%;max-height:55vh;background:#000}
#px{flex:none;margin-left:auto;background:none;border:1px solid var(--line);color:var(--fg);border-radius:6px;width:2.2rem;height:2.2rem;font-size:1.3rem;line-height:1;cursor:pointer}
#px:hover{background:var(--hov)}
@media (max-width:560px){:root[data-view=list] .sz{display:none}.logo span,.blink span{display:none}}
:root:not([data-view=list]) ul.list{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,16rem),1fr));gap:10px;background:none;border:0;border-radius:0;overflow:visible}
:root:not([data-view=list]) ul.list li{display:grid;grid-template-columns:auto 1fr auto;grid-template-areas:"ic nm ia" "ic sz ia";column-gap:12px;border:1px solid var(--line);border-radius:10px;background:var(--card);padding:6px 6px 6px 14px;min-height:4.6rem;align-items:center}
:root:not([data-view=list]) ul.list li:hover,:root:not([data-view=list]) ul.list li.on{background:var(--hov);border-color:var(--acc)}
:root:not([data-view=list]) ul.list .ic{grid-area:ic;width:42px;height:42px}
:root:not([data-view=list]) #dl .ic{width:52px;height:52px}
:root:not([data-view=list]) ul.list .nm{grid-area:nm;padding:.35rem 0 0;font-size:1.02rem;align-self:end}
:root:not([data-view=list]) ul.list .sz{grid-area:sz;align-self:start;padding-bottom:.3rem}
:root:not([data-view=list]) ul.list .ia{grid-area:ia}
.vg{display:none}:root[data-view=list] .vg{display:block}:root[data-view=list] .vl{display:none}
:root[data-flat] main:has(#fa) #dl,:root[data-flat] main:has(#fa) .h-dirs,:root[data-flat] main:has(#fa) #fl,:root[data-flat] main:has(#fa) .h-files{display:none}
#fa,.h-all{display:none}:root[data-flat] #fa,:root[data-flat] .h-all{display:revert}
:root[data-flat] #fa{display:grid}:root[data-flat][data-view=list] #fa{display:block}
.fsw{display:inline-flex;border:1px solid var(--line);border-radius:6px;overflow:hidden}
.fsw button{font:inherit;font-size:.9rem;padding:.45rem .8rem;border:0;background:var(--card);color:var(--fg);cursor:pointer}
.fsw button+button{border-left:1px solid var(--line)}
.fsw button[aria-pressed=true]{background:var(--acc);color:#fff}
.vsw{margin-left:auto;display:inline-flex;border:1px solid var(--line);border-radius:6px;overflow:hidden}
.vsw button{font:inherit;font-size:.9rem;padding:.45rem .8rem;border:0;background:var(--card);color:var(--fg);cursor:pointer}
.vsw button+button{border-left:1px solid var(--line)}
.vsw button[aria-pressed=true]{background:var(--acc);color:#fff}