diff --git a/chfs-ng/internal/api/web/index.html b/chfs-ng/internal/api/web/index.html
index 4e42b41..aef7758 100644
--- a/chfs-ng/internal/api/web/index.html
+++ b/chfs-ng/internal/api/web/index.html
@@ -21,7 +21,7 @@ body{background:var(--bg);color:var(--text);transition:background .2s,color .2s}
 button.ghost{background:var(--surface2);color:var(--text)}button.danger{background:var(--danger)}.meta,.path{color:var(--muted)}
 .card{box-shadow:var(--shadow)}th{background:var(--surface2);color:var(--muted)}th,td{border-color:var(--border)}.field input,.toolbar input,.field select{background:var(--surface);color:var(--text);border-color:var(--border)}
 .iconbtn{width:38px;height:38px;padding:0;background:var(--surface2);color:var(--text);display:inline-flex;align-items:center;justify-content:center}.ui-icon{width:18px;height:18px;display:block;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.ui-icon.fill{fill:currentColor;stroke:none}.viewbtn.active{background:var(--primary);color:#fff}.selectbox{width:18px;height:18px;accent-color:var(--primary)}
-.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:12px;padding:14px}.tile{position:relative;border:1px solid var(--border);border-radius:12px;padding:14px;background:var(--surface);min-height:145px;cursor:pointer}.tile:hover{border-color:var(--primary)}.tile.selected{outline:2px solid var(--primary)}.tile .thumb{height:82px;display:flex;align-items:center;justify-content:center;font-size:42px;border-radius:9px;background:var(--surface2);overflow:hidden;margin-bottom:9px}.tile .thumb img{width:100%;height:100%;object-fit:cover}.progress{height:8px;background:var(--surface2);border-radius:99px;overflow:hidden}.progress i{display:block;height:100%;width:0;background:var(--primary);transition:width .15s}.upload-row{display:grid;gap:7px;padding:10px 0;border-bottom:1px solid var(--border)}.drop-active{border-color:var(--primary)!important;background:var(--surface2)!important}.qr{width:min(320px,80vw);aspect-ratio:1;margin:auto;display:block;border-radius:12px;background:#fff}.drop-hint{color:var(--muted);font-size:13px;margin-top:7px}.tile .tilecheck{position:absolute;top:9px;left:9px}.tile .tilemenu{position:absolute;right:7px;top:7px}.file-name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.bulk{display:none;align-items:center;gap:8px;margin-bottom:12px}.bulk.show{display:flex}.bulk .count{font-weight:650;margin-right:auto}.layout{display:grid;grid-template-columns:210px minmax(0,1fr);gap:16px}.sidebar{background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:12px;height:max-content;position:sticky;top:82px}.side-title{font-size:12px;font-weight:700;color:var(--muted);padding:6px 9px}.side-item{width:100%;text-align:left;background:transparent;color:var(--text);margin:2px 0}.side-item.active{background:var(--surface2);color:var(--primary)}@media(max-width:900px){.layout{display:block}.sidebar{position:static;margin-bottom:14px;display:flex;gap:6px;overflow:auto}.side-title{display:none}.side-item{white-space:nowrap;width:auto}}.toast-host{position:fixed;right:18px;bottom:18px;z-index:20;display:grid;gap:8px}.toast{min-width:240px;max-width:min(420px,calc(100vw - 36px));padding:11px 14px;border:1px solid var(--border);border-radius:11px;background:var(--surface);box-shadow:var(--shadow);color:var(--text);animation:toastIn .18s ease}@keyframes toastIn{from{transform:translateY(8px);opacity:0}to{transform:none;opacity:1}}.toast.error{border-color:var(--danger)}.context{position:fixed;z-index:10;display:none;min-width:170px;background:var(--surface);border:1px solid var(--border);box-shadow:var(--shadow);border-radius:10px;padding:5px}.context button{display:block;width:100%;text-align:left;background:transparent;color:var(--text);border-radius:7px}.context button:hover{background:var(--surface2)}
+.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:14px;padding:16px}.tile{position:relative;border:1px solid var(--border);border-radius:16px;padding:12px;background:var(--surface);min-height:192px;cursor:pointer;transition:border-color .16s,box-shadow .16s,transform .16s}.tile:hover{border-color:var(--primary);box-shadow:0 10px 28px rgba(20,30,50,.08);transform:translateY(-1px)}.tile.selected{border-color:var(--primary);box-shadow:0 0 0 2px rgba(37,99,235,.14)}.tile .thumb{height:112px;display:flex;align-items:center;justify-content:center;border-radius:11px;background:var(--surface2);overflow:hidden;margin-bottom:11px;color:var(--muted);transition:background .16s}.tile:hover .thumb{background:var(--surface2)}.tile .thumb .ui-icon{width:44px;height:44px;stroke-width:1.35}.tile .thumb img{width:100%;height:100%;object-fit:cover;display:block}.tile .tile-title{display:flex;align-items:center;gap:7px;min-width:0;padding:0 2px}.tile .tile-title .ui-icon{width:16px;height:16px;flex:0 0 auto}.tile .file-name{font-size:14px;font-weight:560;line-height:1.35}.tile .tile-meta{display:flex;gap:8px;padding:6px 2px 0;color:var(--muted);font-size:12px}.tile .tile-check{position:absolute;left:10px;top:10px;opacity:0;transition:opacity .14s}.tile:hover .tile-check,.tile.selected .tile-check{opacity:1}.tile .tile-action{position:absolute;right:9px;top:9px;width:30px;height:30px;padding:0;border:1px solid var(--border);background:var(--surface);color:var(--text);opacity:0;transition:opacity .14s}.tile:hover .tile-action,.tile.selected .tile-action{opacity:1}.tile .tile-action .ui-icon{width:15px;height:15px}.tile.folder-tile .thumb{background:var(--surface2)}.tile.media-tile .thumb{background:#0d1218;color:#d7e0ec}.tile.media-tile .thumb .ui-icon{stroke-width:1.45}.progress{height:8px;background:var(--surface2);border-radius:99px;overflow:hidden}.progress i{display:block;height:100%;width:0;background:var(--primary);transition:width .15s}.upload-row{display:grid;gap:7px;padding:10px 0;border-bottom:1px solid var(--border)}.drop-active{border-color:var(--primary)!important;background:var(--surface2)!important}.qr{width:min(320px,80vw);aspect-ratio:1;margin:auto;display:block;border-radius:12px;background:#fff}.drop-hint{color:var(--muted);font-size:13px;margin-top:7px}.tile .tilecheck{position:absolute;top:9px;left:9px}.tile .tilemenu{position:absolute;right:7px;top:7px}.file-name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.bulk{display:none;align-items:center;gap:8px;margin-bottom:12px}.bulk.show{display:flex}.bulk .count{font-weight:650;margin-right:auto}.layout{display:grid;grid-template-columns:210px minmax(0,1fr);gap:16px}.sidebar{background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:12px;height:max-content;position:sticky;top:82px}.side-title{font-size:12px;font-weight:700;color:var(--muted);padding:6px 9px}.side-item{width:100%;text-align:left;background:transparent;color:var(--text);margin:2px 0}.side-item.active{background:var(--surface2);color:var(--primary)}@media(max-width:900px){.layout{display:block}.sidebar{position:static;margin-bottom:14px;display:flex;gap:6px;overflow:auto}.side-title{display:none}.side-item{white-space:nowrap;width:auto}}.toast-host{position:fixed;right:18px;bottom:18px;z-index:20;display:grid;gap:8px}.toast{min-width:240px;max-width:min(420px,calc(100vw - 36px));padding:11px 14px;border:1px solid var(--border);border-radius:11px;background:var(--surface);box-shadow:var(--shadow);color:var(--text);animation:toastIn .18s ease}@keyframes toastIn{from{transform:translateY(8px);opacity:0}to{transform:none;opacity:1}}.toast.error{border-color:var(--danger)}.context{position:fixed;z-index:10;display:none;min-width:170px;background:var(--surface);border:1px solid var(--border);box-shadow:var(--shadow);border-radius:10px;padding:5px}.context button{display:block;width:100%;text-align:left;background:transparent;color:var(--text);border-radius:7px}.context button:hover{background:var(--surface2)}
 </style>
 </head>
 <body>
@@ -58,7 +58,7 @@ function selectItem(p,checked){if(checked)selected.add(p);else selected.delete(p
 let selected=new Set(),lastItems=[];
 function render(items){lastItems=items;selected=new Set([...selected].filter(p=>items.some(f=>(current?current+"/":"")+f.name===p)));renderList(items);renderGrid(items);updateSelection()}
 function renderList(items){const body=$("files");body.innerHTML=items.map(f=>{const p=current?current+"/"+f.name:f.name,canRead=(f.mask||"").includes("R"),canWrite=(f.mask||"").includes("W"),canDelete=(f.mask||"").includes("D"),share=f.guestMask&&f.guestMask.includes("R")?'<button class="ghost" onclick="shareItem('+JSON.stringify(p)+')">分享</button>':"";return '<tr><td><input class="selectbox" type="checkbox" '+(selected.has(p)?"checked":"")+' onchange="selectItem('+JSON.stringify(p)+',this.checked)"></td><td><div class="name"><span>'+iconFor(f)+'</span>'+(f.dir&&canRead?'<a href="#" onclick="openDir('+JSON.stringify(p)+');return false">'+esc(f.name)+'</a>':(canRead?'<a href="#" onclick="previewFile('+JSON.stringify(p)+');return false">'+esc(f.name)+'</a>':'<span>'+esc(f.name)+'</span>'))+'</div></td><td class="meta">'+(f.dir?"—":fmt(f.size))+'</td><td class="meta">'+esc(f.modified||"")+'</td><td><div class="actions"><button class="iconbtn" onclick="itemMenu(event,'+JSON.stringify(p)+')">⋮</button></div></td></tr>'}).join("")||'<tr><td colspan="5" class="empty">这里还没有文件</td></tr>'}
-function renderGrid(items){$("grid").innerHTML=items.map(f=>{const p=current?current+"/"+f.name:f.name,canRead=(f.mask||"").includes("R");let thumb=iconFor(f);if(fileType(f)==="image"&&canRead)thumb='<img src="/chfs/preview?file='+encodeURIComponent(p)+'" loading="lazy" alt="">';return '<div class="tile '+(selected.has(p)?"selected":"")+'" onclick="'+(f.dir&&canRead?'openDir('+JSON.stringify(p)+')':'toggleTile('+JSON.stringify(p)+')')+'" oncontextmenu="itemMenu(event,'+JSON.stringify(p)+');return false"><input class="selectbox tilecheck" type="checkbox" '+(selected.has(p)?"checked":"")+' onclick="event.stopPropagation();selectItem('+JSON.stringify(p)+',this.checked)"><div class="thumb">'+thumb+'</div><div class="file-name">'+esc(f.name)+'</div><div class="meta">'+(f.dir?'文件夹':fmt(f.size))+'</div></div>'}).join('')||'<div class="empty">这里还没有文件</div>'}
+function renderGrid(items){$("grid").innerHTML=items.map(f=>{const p=current?current+"/"+f.name:f.name,canRead=(f.mask||"").includes("R"),type=fileType(f),selectedNow=selected.has(p);let thumb=iconFor(f);if(type==="image"&&canRead)thumb='<img src="/chfs/preview?file='+encodeURIComponent(p)+'" loading="lazy" alt="">';const tileClass=(f.dir?'folder-tile ':'')+(['video','audio'].includes(type)?'media-tile':'');const meta=f.dir?'文件夹':fmt(f.size);return '<div class="tile '+tileClass+(selectedNow?' selected':'')+'" onclick="'+(f.dir&&canRead?'openDir('+JSON.stringify(p)+')':'toggleTile('+JSON.stringify(p)+')')+'" oncontextmenu="itemMenu(event,'+JSON.stringify(p)+');return false"><input class="selectbox tile-check" type="checkbox" '+(selectedNow?'checked':'')+' onclick="event.stopPropagation();selectItem('+JSON.stringify(p)+',this.checked)"><button class="iconbtn tile-action" onclick="event.stopPropagation();itemMenu(event,'+JSON.stringify(p)+')" title="更多操作"><svg class="ui-icon" viewBox="0 0 24 24"><circle cx="5" cy="12" r="1"/><circle cx="12" cy="12" r="1"/><circle cx="19" cy="12" r="1"/></svg></button><div class="thumb">'+thumb+'</div><div class="tile-title">'+iconFor(f)+'<div class="file-name">'+esc(f.name)+'</div></div><div class="tile-meta"><span>'+meta+'</span>'+(f.modified?'<span>'+esc(f.modified)+'</span>':'')+'</div></div>'}).join('')||'<div class="empty">这里还没有文件</div>'}
 function toggleTile(p){selectItem(p,!selected.has(p))}
 function toggleAll(v){lastItems.forEach(f=>{const p=current?current+"/"+f.name:f.name;if(v)selected.add(p);else selected.delete(p)});render(lastItems)}
 function clearSelection(){selected.clear();updateSelection();renderGrid(lastItems);renderList(lastItems)}