.photo-control{display:grid;place-items:center;width:var(--ui-control-height);height:var(--ui-control-height);min-height:var(--ui-control-height);padding:0;border:1px solid rgba(255,255,255,.6);border-radius:var(--ui-pill-radius);appearance:none;background:rgba(23,33,38,.64);box-shadow:0 8px 18px rgba(0,0,0,.18);color:var(--panel);font-size:0;line-height:1}.photo-control:hover{background:rgba(23,33,38,.78)}.photo-nav{position:absolute;top:50%;z-index:4;transform:translateY(-50%)}.photo-nav::before{content:"";position:absolute;top:50%;left:50%;box-sizing:border-box;width:10px;height:10px;border-top:3px solid currentColor;border-right:3px solid currentColor;transform-origin:center}.photo-scroll-prev{left:8px}.photo-viewer-prev{left:max(8px,env(safe-area-inset-left))}.photo-scroll-next{right:8px}.photo-viewer-next{right:max(8px,env(safe-area-inset-right))}.photo-scroll-prev::before,.photo-viewer-prev::before{transform:translate(-50%,-50%) rotate(-135deg)}.photo-scroll-next::before,.photo-viewer-next::before{transform:translate(-50%,-50%) rotate(45deg)}.photo-viewer-close::before,.photo-viewer-close::after{content:"";position:absolute;top:50%;left:50%;width:18px;height:3px;border-radius:999px;background:currentColor;transform-origin:center}.photo-viewer-close::before{transform:translate(-50%,-50%) rotate(45deg)}.photo-viewer-close::after{transform:translate(-50%,-50%) rotate(-45deg)}
