.dlg-trigger{cursor:zoom-in}
.dlg-trigger:focus-visible{outline:2px solid var(--accent,var(--cyan,#00c4ff));outline-offset:3px}
.dlg-hover{position:fixed;z-index:30050;display:none;pointer-events:none;width:480px;height:360px;grid-template-rows:minmax(0,1fr) auto;padding:8px;gap:8px;border:1px solid var(--border,var(--line,#50616e));border-radius:8px;background:var(--bg-modal,var(--dl-modal,var(--input,#17202a)));color:var(--text-primary,var(--dl-text,var(--text,#f5f8fc)));box-shadow:0 12px 38px rgba(0,0,0,.3);letter-spacing:0}
.dlg-hover.is-visible{display:grid}
.dlg-hover img{width:100%;height:100%;min-height:0;object-fit:contain;display:block}
.dlg-hover-caption{font:600 12px Arial,sans-serif;line-height:1.4;overflow:hidden;overflow-wrap:anywhere;max-height:34px}
.dlg-viewer{--dlg-surface:var(--bg-modal,var(--dl-modal,var(--input,#17202a)));--dlg-text:var(--text-primary,var(--dl-text,var(--text,#f5f8fc)));--dlg-line:var(--border,var(--dl-line,var(--line,#50616e)));position:fixed;inset:0;margin:auto;padding:0;width:min(1560px,96vw);height:94vh;height:94dvh;max-width:100vw;max-height:100dvh;border:1px solid var(--dlg-line);border-radius:8px;background:var(--dlg-surface);color:var(--dlg-text);overflow:hidden;font:14px Arial,sans-serif;letter-spacing:0}
.dlg-viewer::backdrop{background:rgba(0,0,0,.78)}
.dlg-shell{display:grid;grid-template-rows:auto minmax(0,1fr) auto;height:100%;min-height:0}
.dlg-head{display:flex;align-items:center;gap:10px;padding:12px 14px;border-bottom:1px solid var(--dlg-line);min-width:0}
.dlg-heading{flex:1;min-width:0}
.dlg-context{color:var(--text-secondary,var(--dl-muted,var(--muted,#a9b8c5)));font-size:11px;line-height:1.35;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dlg-title{font-size:15px;line-height:1.4;margin:4px 0 0;overflow-wrap:anywhere;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
.dlg-control{display:inline-flex;align-items:center;justify-content:center;flex:0 0 40px;width:40px;height:40px;padding:0;color:var(--dlg-text);background:var(--dlg-surface);border:1px solid var(--dlg-line);border-radius:6px;text-decoration:none;cursor:pointer;touch-action:manipulation;font-size:17px}
.dlg-control:hover{border-color:var(--accent,var(--cyan,currentColor))}
.dlg-control:focus-visible{outline:2px solid var(--accent,var(--cyan,currentColor));outline-offset:2px}
.dlg-control:disabled{opacity:.3;cursor:default}
.dlg-stage{position:relative;min-height:0;display:grid;grid-template-columns:54px minmax(0,1fr) 54px;align-items:center;gap:8px;padding:10px 12px;overflow:hidden;touch-action:pan-y pinch-zoom}
.dlg-picture{grid-column:2;grid-row:1;height:100%;min-height:0;display:grid;place-items:center;overflow:hidden}
.dlg-prev{grid-column:1;grid-row:1}.dlg-next{grid-column:3;grid-row:1}
.dlg-picture img{display:block;width:100%;height:100%;object-fit:contain;min-height:0}
.dlg-picture.is-loading img,.dlg-picture.is-error img{visibility:hidden}
.dlg-nav{justify-self:center;width:44px;height:52px;flex-basis:44px;font-size:22px}
.dlg-nav[hidden]{display:none}
.dlg-status{position:absolute;left:65px;right:65px;top:50%;text-align:center;padding:12px;line-height:1.5;pointer-events:none;color:var(--dlg-text)}
.dlg-status[hidden]{display:none}
.dlg-meta{display:flex;align-items:flex-start;gap:16px;padding:12px 14px;border-top:1px solid var(--dlg-line);min-width:0}
.dlg-count{flex:0 0 auto;font:600 12px Arial,sans-serif;line-height:1.5;font-variant-numeric:tabular-nums;min-width:42px}
.dlg-caption{flex:1;min-width:0;overflow-wrap:anywhere;white-space:pre-wrap;line-height:1.5;max-height:72px;overflow:auto;color:var(--text-secondary,var(--dl-muted,var(--muted,#a9b8c5)))}
.dlg-scroll-lock{overflow:hidden!important}
@media(max-width:600px){.dlg-viewer{width:100vw;height:100vh;height:100dvh;max-width:100vw;border:0;border-radius:0}.dlg-head{padding:calc(10px + env(safe-area-inset-top)) 10px 10px;gap:6px}.dlg-title{font-size:13px}.dlg-control{width:36px;height:36px;flex-basis:36px}.dlg-stage{grid-template-columns:32px minmax(0,1fr) 32px;gap:4px;padding:6px 4px}.dlg-nav{width:32px;height:48px;font-size:18px}.dlg-meta{padding:10px 12px calc(12px + env(safe-area-inset-bottom));gap:10px}.dlg-caption{font-size:12px;max-height:66px}.dlg-status{left:36px;right:36px}}
@media print{.dlg-hover,.dlg-viewer,.dlg-viewer::backdrop{display:none!important}}