.pan-zoom-canvas{cursor:grab;touch-action:pan-x pan-y;background-color:#0000;width:100%;height:100%;position:relative;overflow:hidden}.pan-zoom-canvas--dragging{cursor:grabbing}.pan-zoom-canvas--disabled{cursor:default;touch-action:auto}.pan-zoom-canvas--dotted{background-image:radial-gradient(circle,var(--cds-border-subtle-01)calc(.5px*var(--canvas-zoom,1)),transparent calc(.5px*var(--canvas-zoom,1)));background-size:calc(16px*var(--canvas-zoom,1))calc(16px*var(--canvas-zoom,1));background-position:var(--canvas-pan-x,0)var(--canvas-pan-y,0)}.pan-zoom-canvas__content{transform-origin:0 0;-webkit-user-select:none;user-select:none;width:max-content;position:absolute;top:0;left:0}
.preview-frame{width:100%;position:relative;overflow:hidden}.preview-frame--dotted-static .preview-frame__static-content{background-image:radial-gradient(circle,var(--cds-border-subtle-01)1px,transparent 1px);background-size:16px 16px}.preview-frame__static-content{width:100%;height:100%}.preview-frame__zoom-pill{bottom:var(--cds-spacing-03);right:var(--cds-spacing-03);z-index:2;opacity:0;transition:opacity var(--cds-duration-fast-01)var(--cds-standard-easing);position:absolute}.preview-frame:hover .preview-frame__zoom-pill{opacity:1}@media (hover:none) and (pointer:coarse){.preview-frame__zoom-pill{opacity:1}}