.zoomable-canvas-host{position:relative;width:100%;height:100%;background:transparent}.osd-pan-cursor,.osd-pan-cursor canvas{cursor:grab}.osd-pan-cursor.is-grabbing,.osd-pan-cursor.is-grabbing canvas{cursor:grabbing}.osd-hotspot{overflow:visible;pointer-events:auto;cursor:pointer;opacity:.7}.osd-hotspot.is-locked{cursor:pointer}.osd-hotspot svg{display:block;width:100%;height:100%;overflow:visible}.osd-hotspot-rect svg rect,.osd-hotspot-circle svg circle,.osd-hotspot-poly svg polygon{fill:var(--hs-fill, rgba(244, 169, 0, .18));stroke:var(--hs-stroke, transparent);stroke-width:var(--hs-stroke-w, 2);vector-effect:non-scaling-stroke;transition:fill .12s ease}.osd-hotspot:hover svg rect,.osd-hotspot:hover svg circle,.osd-hotspot:hover svg polygon,.osd-hotspot.is-active svg rect,.osd-hotspot.is-active svg circle,.osd-hotspot.is-active svg polygon{fill:var(--hs-fill-hover, rgba(244, 169, 0, .45))}.osd-hotspot-dot-hit{display:flex;align-items:center;justify-content:center;pointer-events:auto;cursor:pointer;background:transparent}.osd-hotspot-dot{width:14px;height:14px;pointer-events:none;background:#f4a900f2;border-radius:50%;box-shadow:0 0 0 2px transparent;opacity:.7}.osd-hotspot-dot.is-active{background:#f4a900;box-shadow:0 0 0 2px #b46400,0 0 0 6px #f4a90073}.osd-anchor-dot{width:10px;height:10px;pointer-events:none;background:#f4a900;border-radius:50%;box-shadow:0 0 0 2px #fff}.osd-anchor-dot.is-active{box-shadow:0 0 0 2px #fff,0 0 0 5px #f4a90080}.osd-hotspot-dot.is-pulsing{animation:osd-pulse .6s ease-out 3}.osd-hotspot-dot--pulse-loop{animation:osd-pulse 1.4s ease-out infinite}@keyframes osd-pulse{0%{transform:scale(1);box-shadow:0 0 #f4a900b3}70%{transform:scale(1.5);box-shadow:0 0 0 14px #f4a90000}to{transform:scale(1);box-shadow:0 0 #f4a90000}}.osd-hotspot-rect svg rect.osd-halo,.osd-hotspot-circle svg circle.osd-halo,.osd-hotspot-poly svg polygon.osd-halo{fill:var(--hs-fill, rgba(244, 169, 0, .35));stroke:var(--hs-fill, rgba(244, 169, 0, .95));stroke-width:4;stroke-linejoin:round;vector-effect:non-scaling-stroke;pointer-events:none;transform-box:fill-box;transform-origin:50% 50%;animation:osd-halo-pulse var(--hs-pulse-duration, 1.6s) ease-out infinite}@keyframes osd-halo-pulse{0%{transform:scale(1);stroke-opacity:1;fill-opacity:.55}70%{transform:scale(1.45);stroke-opacity:0;fill-opacity:0}to{transform:scale(1.45);stroke-opacity:0;fill-opacity:0}}@keyframes osd-halo-pulse-subtle{0%{transform:scale(1);stroke-opacity:.9;fill-opacity:.4}70%{transform:scale(1.22);stroke-opacity:0;fill-opacity:0}to{transform:scale(1.22);stroke-opacity:0;fill-opacity:0}}@keyframes osd-halo-pulse-strong{0%{transform:scale(1);stroke-opacity:1;fill-opacity:.7}70%{transform:scale(1.75);stroke-opacity:0;fill-opacity:0}to{transform:scale(1.75);stroke-opacity:0;fill-opacity:0}}.osd-hotspot.pulse-subtle svg .osd-halo{animation-name:osd-halo-pulse-subtle}.osd-hotspot.pulse-strong svg .osd-halo{animation-name:osd-halo-pulse-strong}.osd-hotspot.is-pulsing svg .osd-halo{animation:osd-halo-pulse .6s ease-out 3}.osd-hotspot.no-pulse svg .osd-halo{display:none}.osd-hotspot.pulse-hover svg .osd-halo,.osd-hotspot-dot.pulse-hover{animation-play-state:paused}.osd-hotspot.pulse-hover:hover svg .osd-halo,.osd-hotspot-dot.pulse-hover:hover{animation-play-state:running}.osd-hotspot-dot--pulse-loop{animation-duration:var(--hs-pulse-duration, 1.4s)}.osd-hotspot-tooltip{padding:calc(4px * var(--tip-scale, 1)) calc(8px * var(--tip-scale, 1));font-size:calc(12px * var(--tip-scale, 1));line-height:1.3;color:#fff;word-break:break-word;pointer-events:none;background:#000000d9;border-radius:calc(4px * var(--tip-scale, 1));opacity:0;transition:opacity .14s ease,transform .14s ease,font-size .14s ease,padding .14s ease}.osd-hotspot-tooltip.tip-below{margin-top:calc(12px * var(--tip-scale, 1));transform:translateY(4px)}.osd-hotspot-tooltip.tip-above{margin-bottom:calc(12px * var(--tip-scale, 1));transform:translateY(-4px)}.osd-hotspot-tooltip.tip-left{margin-right:calc(12px * var(--tip-scale, 1));transform:translate(-4px)}.osd-hotspot-tooltip.tip-right{margin-left:calc(12px * var(--tip-scale, 1));transform:translate(4px)}.osd-hotspot-tooltip.tip-center{transform:translateY(0)}.osd-hotspot-tooltip.is-visible{pointer-events:auto;cursor:pointer;opacity:1;transform:translate(0)}.zoomable-canvas-host.is-anim-paused *,.zoomable-canvas-host.is-anim-paused *:before,.zoomable-canvas-host.is-anim-paused *:after{animation-play-state:paused!important}