/* The viewer fills the visual area; only the photo responds to pinch and pan. */
html.g-photo-open,html.g-photo-open body{overflow:hidden;overscroll-behavior:none}
html.g-photo-open{scroll-behavior:auto!important;scrollbar-gutter:auto}
.g-image-viewer{position:fixed;inset:0;margin:0;border:0;padding:0;width:100%;max-width:none;height:100vh;height:100dvh;max-height:none;overflow:hidden;background:#fff;color:#161616;overscroll-behavior:none}
.g-image-viewer[open]{display:flex;flex-direction:column}
.g-image-viewer::backdrop{background:#fff;backdrop-filter:none}
.g-photo-header{display:flex;align-items:center;justify-content:space-between;flex-shrink:0;min-height:74px;padding:calc(12px + env(safe-area-inset-top)) max(24px,env(safe-area-inset-right)) 12px max(24px,env(safe-area-inset-left));z-index:3;background:white}
.g-photo-brand{font-size:16px;letter-spacing:.28em;line-height:1;margin:0}
.g-photo-header .g-dialog-close{position:static;min-width:48px;min-height:48px;border-radius:50%;background:#f6f6f3;transition:background 180ms,transform 180ms}
.g-photo-header .g-dialog-close:hover{background:#ecece8;transform:rotate(90deg)}
.g-photo-header .g-dialog-close svg{width:22px;height:22px}
.g-photo-body{position:relative;display:flex;flex:1;min-height:0;overflow:hidden}
.g-photo-stage{position:relative;flex:1;min-width:0;min-height:0;overflow:hidden;touch-action:none;user-select:none;-webkit-user-select:none;background:#fff;cursor:zoom-in}
.g-photo-canvas{position:absolute;left:50%;top:50%;display:block;padding:0;border:0;background:transparent;max-width:none;transform-origin:center;will-change:transform;touch-action:none;cursor:inherit;user-select:none;-webkit-user-select:none}
.g-photo-canvas.is-animated{transition:transform 220ms cubic-bezier(.2,.65,.3,1)}
.g-photo-canvas img{display:block;width:100%;height:100%;max-width:none;object-fit:contain;pointer-events:none;-webkit-user-drag:none}
.g-photo-stage.is-enlarged{cursor:grab}
.g-photo-stage.is-dragging{cursor:grabbing}
.g-photo-stage [data-photo-status]{position:absolute;inset:0;display:grid;place-content:center;margin:0;padding:32px;text-align:center;font-size:12px;color:#777;pointer-events:none}
.g-photo-thumbs{position:absolute;top:50%;transform:translateY(-50%);left:max(22px,env(safe-area-inset-left));max-height:calc(100% - 30px);width:68px;display:flex;flex-direction:column;gap:10px;overflow:auto;overscroll-behavior:contain;padding:4px;scrollbar-width:none;z-index:2}
.g-photo-thumbs::-webkit-scrollbar{display:none}
.g-photo-thumbs button{display:block;flex-shrink:0;width:60px;height:76px;padding:2px;background:#fff;border:1px solid #e7e7e1;opacity:.78;transition:border-color 160ms,opacity 160ms}
.g-photo-thumbs button:hover,.g-photo-thumbs button[aria-current=true]{border-color:#151515;opacity:1}
.g-photo-thumbs img{width:100%;height:100%;object-fit:cover;pointer-events:none}
.g-photo-footer{flex-shrink:0;z-index:3;background:#fff;padding:12px max(24px,env(safe-area-inset-right)) max(16px,env(safe-area-inset-bottom)) max(24px,env(safe-area-inset-left));border-top:1px solid #f1f1ed}
.g-photo-tools{display:flex;align-items:center;justify-content:center;gap:30px}
.g-photo-navigation,.g-photo-magnification{display:flex;align-items:center;gap:5px}
.g-photo-navigation button,.g-photo-magnification button{min-width:44px;min-height:44px;border:0;border-radius:50%;background:#f6f6f3;color:#111;display:grid;place-items:center;transition:background 160ms}
.g-photo-navigation button:hover:not(:disabled),.g-photo-magnification button:hover:not(:disabled){background:#eaeae5}
.g-photo-navigation button:disabled,.g-photo-magnification button:disabled{opacity:.28}
.g-photo-magnification button{font-size:22px;line-height:1}
.g-photo-magnification [data-photo-reset]{font-size:11px;border-radius:0;min-width:53px;background:none}
.g-photo-navigation [data-photo-count]{font-size:11px;min-width:45px;text-align:center;white-space:nowrap;font-variant-numeric:tabular-nums}
.g-photo-navigation svg{width:18px;height:18px}
.g-photo-navigation [data-photo-prev] svg{transform:rotate(180deg)}
.g-photo-footer .g-photo-help{font-size:10px;color:#777;line-height:1.6;text-align:center;margin:9px 0 0}
.g-photo-help-touch{display:none}
@media(pointer:coarse){.g-photo-help-mouse{display:none}.g-photo-help-touch{display:inline}}
@media(max-width:700px){
 .g-photo-header{min-height:68px;padding:calc(8px + env(safe-area-inset-top)) max(14px,env(safe-area-inset-right)) 8px max(20px,env(safe-area-inset-left))}
 .g-photo-brand{font-size:13px}
 .g-photo-thumbs{left:max(8px,env(safe-area-inset-left));width:49px;gap:7px;padding:3px}
 .g-photo-thumbs button{width:43px;height:56px}
 .g-photo-footer{padding:10px 12px max(12px,env(safe-area-inset-bottom))}
 .g-photo-tools{gap:18px}
 .g-photo-help-mouse{display:none}.g-photo-help-touch{display:inline}
}
@media(max-height:480px){.g-photo-header{position:absolute;top:0;left:0;right:0;min-height:56px;padding-block:4px;background:transparent;pointer-events:none}.g-photo-header button{pointer-events:auto}.g-photo-brand{visibility:hidden}.g-photo-footer{padding-block:5px}.g-photo-footer .g-photo-help{display:none}.g-photo-thumbs{max-height:calc(100% - 110px)}}
@media(prefers-reduced-motion:reduce){.g-image-viewer *{transition:none!important}}