/* The native dialog owns focus/inertness; media keeps its original proportions. */
:root body .photo-dialog{inset:0;width:100%;max-width:none;height:100vh;height:100dvh;max-height:none;margin:0;border:0;border-radius:0;padding:16px max(20px,env(safe-area-inset-right)) max(16px,env(safe-area-inset-bottom)) max(20px,env(safe-area-inset-left));background:var(--paper);overscroll-behavior:contain;box-sizing:border-box}
:root body .photo-dialog[open]{display:flex;flex-direction:column;gap:12px;height:100vh;height:100dvh}
:root body .photo-dialog-header{padding-top:env(safe-area-inset-top);min-height:44px;flex:none}
:root body .photo-dialog-header h2{margin:0;font:400 15px/1.4 var(--sans)}
:root body .photo-dialog button{min-height:44px;min-width:44px;font:400 14px/1.3 var(--sans)}
:root body .photo-dialog .photo-close{padding:10px 12px;gap:8px}
:root body .photo-dialog figure{flex:1;min-height:0;margin:0;display:flex;flex-direction:column;gap:12px}
:root body .photo-stage{flex:1;min-height:0;height:auto;position:relative;display:grid}
:root body .photo-viewport,:root body .photo-film-slot{grid-area:1/1;min-width:0;min-height:0;width:100%;height:100%;overflow:auto;overscroll-behavior:contain}
:root body .photo-viewport{display:flex;align-items:center;justify-content:center;touch-action:pan-y pinch-zoom}
:root body .photo-viewport .photo-enlarged{display:block;flex:none;width:auto;height:auto;min-height:0;max-width:100%;max-height:100%;object-fit:contain}
:root body .photo-viewport.is-zoomed{display:block;touch-action:pan-x pan-y pinch-zoom}
:root body .photo-viewport.is-zoomed .photo-enlarged{width:200%;height:auto;max-width:none;max-height:none;min-height:0}
:root body .photo-dialog .photo-zoom{position:static;z-index:auto;background:var(--paper);border:1px solid var(--line);border-radius:3px;padding:8px 12px}
:root body .photo-dialog .photo-description{flex:none;margin:0;min-height:1.5em;font:400 13px/1.5 var(--sans);color:var(--muted);text-align:center;text-wrap:balance}
:root body .photo-controls{flex:none;gap:12px}
:root body .photo-status{display:flex;align-items:center;justify-content:center;gap:12px}
:root body .photo-controls :is(.photo-previous,.photo-next){width:44px;height:44px;padding:0;flex:none}
:root body .photo-controls :is(.photo-previous,.photo-next) .link-label{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
:root body .photo-position{font:400 13px/1.4 var(--sans);font-variant-numeric:tabular-nums;white-space:nowrap}
:root body .photo-controls button{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 14px}
:root body .photo-film-slot .gallery-film{display:flex;flex-direction:column;justify-content:center;width:100%;height:100%;min-height:0}
:root body .photo-film-slot .gallery-video{flex:1;min-height:0;max-height:calc(100% - 56px);width:100%;height:100%;aspect-ratio:auto;object-fit:contain;background:var(--paper)}
:root body .photo-film-slot .gallery-player-controls{flex:none;width:min(640px,100%);align-self:center;min-height:52px;gap:8px;background:var(--paper)}
:root body .photo-film-slot .gallery-player-controls button{padding:0;width:44px;height:44px;min-width:44px;border:0;background:transparent;display:grid;place-items:center}
:root body .photo-film-slot .gallery-player-controls .gallery-captions-toggle{font-size:12px}
:root body .photo-film-slot .gallery-video-fallback{flex:none;margin:4px 0;font-size:13px;text-align:center}
:root body .gallery-film-enlarge{min-width:44px;min-height:44px;cursor:pointer}
:root body .photo-dialog .photo-film-slot .gallery-player-controls .gallery-film-enlarge,:root body .photo-dialog [hidden]{display:none}
@media(min-width:801px){:root body .photo-dialog{padding:24px max(32px,env(safe-area-inset-right)) max(24px,env(safe-area-inset-bottom)) max(32px,env(safe-area-inset-left))}:root body .photo-dialog[open]{gap:16px}:root body .photo-dialog figure{gap:16px}}
@media(max-height:480px){:root body .photo-dialog{padding-top:8px;padding-bottom:max(8px,env(safe-area-inset-bottom))}:root body .photo-dialog[open],:root body .photo-dialog figure{gap:6px}}
@media(prefers-reduced-motion:reduce){:root body .photo-dialog *{scroll-behavior:auto;transition:none}}