.mg{padding:0 8px 24px}
.mg-bar{position:sticky;top:0;z-index:2;display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:10px 4px;background:var(--card);border-bottom:1px solid var(--line);margin-bottom:8px}
.mg-bar select{font:inherit;border:1px solid var(--line);border-radius:8px;padding:8px 8px;background:#fff;color:inherit;max-width:44vw}
.mg-q{flex:1 1 180px;min-width:120px;max-width:340px}
.mg-count{margin-left:auto;font-size:13px}
.mg-row{display:flex;gap:4px;margin-bottom:4px}
.mg-t{flex:none;display:block;overflow:hidden;border-radius:4px;cursor:zoom-in;position:relative;background:#e8eaed;animation:mg-pulse 1.4s ease-in-out infinite}
.mg-t:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.mg-t img{display:block;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .25s}
.mg-t img.on{opacity:1}
.mg-t:hover{filter:brightness(.92)}
@keyframes mg-pulse{50%{opacity:.7}}
.mg-end{text-align:center;padding:20px;min-height:20px}
.mg-sentinel{height:1px}
.mg-lb{position:fixed;inset:0;z-index:50;background:rgba(10,10,12,.94);color:#eee;display:flex;flex-direction:column}
.mg-lb-top{display:flex;align-items:center;gap:8px;padding:8px 12px;flex:none}
.mg-lb-title{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.mg-lb-btn{background:#ffffff1a;border:0;color:#fff;border-radius:18px;padding:6px 12px;text-decoration:none;cursor:pointer;font-size:13px;white-space:nowrap}
.mg-lb-btn:hover{background:#ffffff33}
.mg-lb-stage{flex:1;min-height:0;display:flex;overflow:auto;position:relative}
.mg-lb-img{margin:auto;max-width:none;max-height:none;width:auto;height:auto;transition:opacity .2s;user-select:none;-webkit-user-drag:none}
.mg-lb-stage:not(.zoomed) .mg-lb-img{max-width:100%;max-height:100%;object-fit:contain}
.mg-lb-spin{position:absolute;left:50%;top:50%;width:32px;height:32px;margin:-16px;border:3px solid #ffffff44;border-top-color:#fff;border-radius:50%;animation:mg-spin .8s linear infinite;pointer-events:none}
@keyframes mg-spin{to{transform:rotate(360deg)}}
.mg-lb-nav{position:absolute;top:50%;margin-top:-28px;width:48px;height:56px;border:0;background:#ffffff1a;color:#fff;font-size:34px;cursor:pointer;border-radius:8px;z-index:1}
.mg-lb-nav:hover{background:#ffffff40}
.mg-lb-nav.prev{left:8px}.mg-lb-nav.next{right:8px}
.mg-lb-info{display:flex;flex-wrap:wrap;gap:6px 16px;padding:8px 14px;font-size:13px;flex:none;background:#0006}
.mg-lb-path{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;opacity:.8}
.mg-lb .muted{color:#aaa}
@media(max-width:800px){.mg-lb-nav{width:36px;height:48px;font-size:26px;opacity:.7}.mg-lb-btn{padding:6px 9px}.mg-q{max-width:none}.mg-count{width:100%;margin:0}}
.mg-t:has(img.on){animation:none}