body:has(dialog[open]){overflow:hidden}
#work-dialog{width:98vw;max-width:1800px;max-height:96dvh;padding:20px 28px}
#work-dialog .dialog-head{top:-20px;padding:10px 0 16px}
#work-dialog #work-description{color:var(--muted);font-size:14px;margin:14px 0}
.photo-toolbar{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;margin-bottom:12px}
.photo-nav,.photo-zoom{display:flex;align-items:center;gap:8px}
.photo-toolbar button{border:1px solid var(--line);background:#fff;color:var(--ink);border-radius:5px;min-height:42px;min-width:44px;padding:8px 13px;font-weight:700}
.photo-toolbar button:disabled{cursor:default;opacity:.35}
#photo-count,#photo-scale{font-size:13px;min-width:56px;text-align:center;font-variant-numeric:tabular-nums}
#work-image-stage{width:100%;height:68dvh;min-height:280px;position:relative;overflow:hidden;background:#e8e8e2;border-radius:6px;touch-action:none;user-select:none;cursor:zoom-in}
#work-image-main{display:block;width:100%;height:100%;max-width:none;object-fit:contain;transform-origin:center center;will-change:transform;pointer-events:none}
#work-image-stage.zoomed{cursor:grab}#work-image-stage.zoomed:active{cursor:grabbing}
.photo-loading{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-size:14px}.photo-loading[hidden]{display:none}
.photo-help{font-size:12px;color:var(--muted);margin:12px 0 15px}
.work-thumbnails{display:flex;gap:10px;overflow:auto;padding:3px 3px 14px;margin-bottom:8px}
.work-thumbnails button{width:90px;height:72px;flex-shrink:0;padding:3px;border:2px solid transparent;background:#e8e8e2;border-radius:5px}
.work-thumbnails button[aria-pressed=true]{border-color:#b28e00;background:var(--yellow)}
.work-thumbnails img{width:100%;height:100%;object-fit:contain}
#work-dialog.photo-expanded{width:100vw;max-width:100vw;max-height:100dvh;height:100dvh;margin:0;border-radius:0;padding:12px 20px}
#work-dialog.photo-expanded .dialog-head{padding:8px 0;top:-12px}
#work-dialog.photo-expanded #work-description,#work-dialog.photo-expanded .photo-help,#work-dialog.photo-expanded .work-thumbnails,#work-dialog.photo-expanded #choose-work{display:none}
#work-dialog.photo-expanded .photo-toolbar{margin:10px 0}
#work-dialog.photo-expanded #work-image-stage{height:calc(100dvh - 150px);min-height:180px}
@media(max-width:620px){#work-dialog{width:100vw;height:100dvh;max-height:100dvh;max-width:100vw;padding:12px;border-radius:0;margin:0}#work-dialog .dialog-head{top:-12px;padding:8px 0 12px}#work-dialog .dialog-head h2{font-size:20px}.photo-toolbar{gap:10px}.photo-zoom{gap:4px}.photo-toolbar button{min-width:40px;min-height:42px;padding:8px}#work-image-stage{height:58dvh;min-height:240px}.photo-help{font-size:11px}.work-thumbnails button{width:72px;height:58px}}
