/* The photograph viewer fills the viewport without exposing the site's navigation. */
.reader-tools{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.reader-tools .reader-close{min-height:44px;font-size:27px}
.reader-fullscreen{display:inline-flex;align-items:center;gap:9px;min-height:44px;padding:8px 0;color:#ededed;font:11px 'DM Sans',Arial,sans-serif;white-space:nowrap}
.reader-fullscreen>span{font-size:19px;line-height:1}
.reader-fullscreen kbd{font:9px 'IBM Plex Mono',monospace;color:#a8a8a8;border:1px solid #76767670;padding:2px 4px;border-radius:2px}
.portfolio-viewer{position:fixed;inset:0;z-index:1000;width:100%;height:100vh;height:100dvh;margin:0;padding:20px 28px;background:#090909;color:#e8e8e8;overflow:hidden;overscroll-behavior:contain;display:grid;grid-template-rows:auto minmax(0,1fr) auto;gap:14px;isolation:isolate}
.portfolio-viewer:fullscreen{width:100%;height:100%;background:#090909}
.portfolio-viewer::backdrop{background:#090909}
.portfolio-viewer-top{display:flex;align-items:center;justify-content:space-between;gap:24px;min-width:0}
.portfolio-viewer-top>div{min-width:0}
.portfolio-viewer-credit{margin:0;color:#a6a6a6;font:9px/1.5 'IBM Plex Mono',monospace;letter-spacing:.07em}
.portfolio-viewer h2{margin:4px 0 0;font:400 13px/1.5 'DM Sans',Arial,sans-serif;letter-spacing:0;text-transform:none;overflow-wrap:anywhere}
.portfolio-viewer button{color:#e8e8e8;min-width:44px;min-height:44px;flex-shrink:0}
.portfolio-viewer button:hover{color:#fff}
.portfolio-viewer button:disabled{opacity:.35;cursor:default}
.portfolio-viewer button:focus-visible{outline:2px solid #e35b44;outline-offset:3px}
.portfolio-viewer-close{display:flex;align-items:center;justify-content:center;gap:12px;font:12px 'DM Sans',Arial,sans-serif}
.portfolio-viewer-close span{font-size:27px;line-height:1}
.portfolio-viewer-center{display:grid;grid-template-columns:44px minmax(0,1fr) 44px;align-items:center;gap:12px;min-height:0;min-width:0}
.portfolio-viewer-prev,.portfolio-viewer-next{font:28px/1 Georgia,serif;padding:0;height:60px}
.portfolio-viewer-stage{display:flex;align-items:center;justify-content:center;width:100%;height:100%;min-width:0;min-height:0;overflow:hidden;touch-action:pan-y pinch-zoom}
.portfolio-viewer-stage img{display:block;width:100%;height:100%;max-width:100%;max-height:100%;object-fit:contain;user-select:none;-webkit-user-select:none}
.portfolio-viewer-stage[aria-busy=true]{background:#0d0d0d}
.portfolio-viewer-stage.image-failed{padding:20px}
.portfolio-viewer-bottom{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:26px;font:10px/1.5 'IBM Plex Mono',monospace;color:#a6a6a6}
.portfolio-viewer-count{color:#e8e8e8;white-space:nowrap}
.portfolio-viewer-hint{text-align:right}
@media(max-width:700px){
  .reader-fullscreen{font-size:10px;gap:6px;min-height:38px}
  .reader-fullscreen kbd{display:none}
  .portfolio-viewer{padding:max(12px,env(safe-area-inset-top)) max(8px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left));gap:8px}
  .portfolio-viewer-top{gap:12px;padding-inline:7px}
  .portfolio-viewer h2{font-size:12px}
  .portfolio-viewer-credit{font-size:8px}
  .portfolio-viewer-center{grid-template-columns:32px minmax(0,1fr) 32px;gap:2px}
  .portfolio-viewer-prev,.portfolio-viewer-next{min-width:32px!important;font-size:23px}
  .portfolio-viewer-bottom{font-size:9px;padding-inline:7px;gap:12px}
  .portfolio-viewer-hint{font-size:8px}
  .portfolio-viewer-hint span{display:none}
}
@media(pointer:coarse){.reader-fullscreen kbd{display:none}}