:root{--bg:#f5f5f7;--card:#fff;--text:#16161a;--muted:#6e6e78;--line:#e3e3e8;--accent:#0a84ff;--danger:#ff3b30;color-scheme:light dark}
@media (prefers-color-scheme:dark){:root{--bg:#121215;--card:#1d1d22;--text:#f0f0f3;--muted:#9a9aa5;--line:#2c2c33}}
*{box-sizing:border-box}
html,body{margin:0;height:100%}
body{background:var(--bg);color:var(--text);font:15px/1.4 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;-webkit-tap-highlight-color:transparent}
[hidden]{display:none!important}
.muted{color:var(--muted)}
.grow{flex:1}
button{font:inherit;color:inherit}
.btn{display:inline-flex;align-items:center;gap:6px;height:38px;padding:0 14px;border-radius:12px;border:1px solid var(--line);background:var(--card);cursor:pointer;text-decoration:none;color:var(--text);position:relative;white-space:nowrap}
.btn.primary{background:var(--accent);border-color:var(--accent);color:#fff}
.btn.danger{color:var(--danger)}
.btn.icon{width:40px;padding:0;justify-content:center;border:0;background:transparent}
.badge{position:absolute;top:6px;right:6px;width:9px;height:9px;border-radius:50%;background:var(--danger)}

.login{min-height:100%;display:flex;align-items:center;justify-content:center;padding:24px}
.login form{width:100%;max-width:340px;text-align:center;display:flex;flex-direction:column;gap:12px}
.login img{margin:0 auto;border-radius:18px}
.login h1{margin:4px 0 0}
.login p{margin:0 0 8px;color:var(--muted)}
.login input{height:48px;border-radius:14px;border:1px solid var(--line);background:var(--card);color:var(--text);padding:0 16px;font:inherit;font-size:16px}
.login button{height:48px;border-radius:14px;border:0;background:var(--accent);color:#fff;font-weight:600;font-size:16px;cursor:pointer}
.login .err{color:var(--danger);min-height:20px}

header{position:sticky;top:0;z-index:5;display:flex;align-items:center;gap:8px;padding:10px 12px;padding-top:max(10px,env(safe-area-inset-top));background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:8px;font-weight:700;font-size:18px}
.brand img{border-radius:7px}
.filters{display:flex;gap:4px;overflow-x:auto;scrollbar-width:none;margin-left:8px}
.filters button{border:0;background:transparent;padding:6px 10px;border-radius:10px;color:var(--muted);cursor:pointer;white-space:nowrap}
.filters button.on{background:var(--card);color:var(--text);box-shadow:0 0 0 1px var(--line)}
.updbar{background:var(--accent);color:#fff;padding:8px 14px;display:flex;align-items:center;gap:10px;justify-content:center}
.updbar button{background:#fff;color:var(--accent);border:0;border-radius:10px;padding:4px 12px;font-weight:600;cursor:pointer}

main{padding:12px;padding-bottom:max(24px,env(safe-area-inset-bottom))}
.day{margin:8px 4px 8px;font-weight:600;color:var(--muted);font-size:13px;text-transform:uppercase;letter-spacing:.04em}
.tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px;margin-bottom:16px}
@media (max-width:600px){.tiles{grid-template-columns:repeat(2,1fr);gap:8px}main{padding:8px}.lbl{display:none}.filters{margin-left:0}.brand{font-size:0;gap:0}}
.tile{background:var(--card);border-radius:14px;overflow:hidden;cursor:pointer;border:1px solid var(--line);display:flex;flex-direction:column;transition:transform .12s}
.tile:active{transform:scale(.98)}
.tile .th{aspect-ratio:16/10;background:#0002 center/cover no-repeat;display:block;width:100%;object-fit:cover}
.tile .cap{padding:6px 10px;font-size:12px;display:flex;gap:6px;color:var(--muted);white-space:nowrap;overflow:hidden}
.tile .cap b{color:var(--text);font-weight:500;overflow:hidden;text-overflow:ellipsis}
.tile.new{animation:pop .5s}
@keyframes pop{from{transform:scale(.9);opacity:0}}
.empty{text-align:center;padding:60px 24px}
.drop{position:fixed;inset:12px;border:3px dashed var(--accent);border-radius:20px;background:color-mix(in srgb,var(--accent) 12%,transparent);display:flex;align-items:center;justify-content:center;font-size:22px;font-weight:600;z-index:50;pointer-events:none}

.viewer{position:fixed;inset:0;z-index:20;background:#000;color:#fff;display:flex;flex-direction:column}
.vbar{display:flex;align-items:center;gap:8px;padding:8px;padding-top:max(8px,env(safe-area-inset-top))}
.vbar .btn.icon{color:#fff}
.vtitle{min-width:0}
.vname{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vmeta{font-size:12px}
.vimg{flex:1;display:flex;align-items:center;justify-content:center;overflow:auto;padding:8px;min-height:0}
.vimg img{max-width:100%;max-height:100%;object-fit:contain}
.vactions{display:flex;justify-content:space-around;padding:8px 4px;padding-bottom:max(8px,env(safe-area-inset-bottom));border-top:1px solid #222}
.vactions button{background:transparent;border:0;color:#ddd;display:flex;flex-direction:column;align-items:center;gap:4px;font-size:12px;padding:6px 10px;border-radius:12px;cursor:pointer}
.vactions button:hover{background:#1c1c20}
.vactions .danger{color:#ff6b62}
.editorhost{position:fixed;inset:0;z-index:30}

.sheet{position:fixed;inset:0;z-index:40;background:#0007;display:flex;align-items:flex-end;justify-content:center}
@media (min-width:700px){.sheet{align-items:center}}
.sheetbox{background:var(--bg);width:100%;max-width:480px;max-height:90vh;overflow:auto;border-radius:20px 20px 0 0;padding:8px 16px max(16px,env(safe-area-inset-bottom))}
@media (min-width:700px){.sheetbox{border-radius:20px}}
.sheethead{display:flex;justify-content:space-between;align-items:center;font-size:17px;padding:4px 0}
section{background:var(--card);border-radius:14px;padding:12px 14px;margin:10px 0}
section h3{margin:0 0 8px;font-size:14px}
section p{margin:0 0 10px;font-size:13px}
.row{display:flex;justify-content:space-between;align-items:center;padding:4px 0;gap:8px}
.row.gap{justify-content:flex-start;flex-wrap:wrap}
#verNotes{font-size:13px;white-space:pre-line}

.toast{position:fixed;left:50%;bottom:max(24px,env(safe-area-inset-bottom));transform:translateX(-50%);background:#222a;backdrop-filter:blur(10px);color:#fff;padding:10px 18px;border-radius:14px;z-index:60;font-size:14px;box-shadow:0 6px 20px #0004}