.product-hotspots{--hotspot-dot-size:1.5rem;-webkit-user-select:none;user-select:none;width:100%;display:inline-block;position:relative}.product-hotspots-img{width:100%;height:auto;display:block}.product-hotspots-list{z-index:1;pointer-events:none;margin:0;padding:0;list-style:none;position:absolute;inset:0}.product-hotspots-item{width:0;height:0;position:absolute}.product-hotspots-hint{z-index:10;pointer-events:none;font-size:var(--text-caption);color:var(--color-text-inverse);box-shadow:var(--shadow-md);-webkit-backdrop-filter:blur(4px);background:#0f172abf;border-radius:9999px;padding:.25rem .75rem;font-weight:500;position:absolute;top:.75rem;left:50%;transform:translate(-50%)}@media (width>=640px){.product-hotspots-hint{top:1rem}}.product-hotspots-dot-button{left:calc(var(--hotspot-dot-size) / -2);top:calc(var(--hotspot-dot-size) / -2);pointer-events:auto;cursor:pointer;background:0 0;border:none;border-radius:9999px;outline:none;padding:0;position:absolute}.product-hotspots-dot-button:after{content:"";z-index:-1;inset:calc((100% - var(--tap-target)) / 2);border-radius:9999px;position:absolute}.product-hotspots-dot-button:focus-visible{box-shadow:0 0 0 4px #38bdf8b3}.product-hotspots-dot-button--grab{cursor:grab}.product-hotspots-dot-button--grabbing{cursor:grabbing}.product-hotspots-dot{width:var(--hotspot-dot-size);height:var(--hotspot-dot-size);justify-content:center;align-items:center;display:flex;position:relative}.product-hotspots-dot--open{z-index:10}.product-hotspots-dot-ping{pointer-events:none;background:#38bdf899;border-radius:9999px;position:absolute;inset:0}.product-hotspots-dot-core{background:var(--color-bg);outline:3px solid var(--sky-500);border-radius:9999px;width:.875rem;height:.875rem;display:inline-flex;position:relative;box-shadow:0 2px 6px #02061759}.product-hotspots-dot-core--calibrate{outline-color:#d946ef}.product-hotspots-dot-core--dragging{outline-color:var(--amber-500)}.product-hotspots-popover{z-index:20;pointer-events:auto;background:var(--color-bg);outline:1px solid var(--gray-200);border-radius:.75rem;width:16rem;max-width:80vw;padding:1rem;position:absolute;box-shadow:0 18px 40px -12px #02061759}.product-hotspots-popover--right{top:50%;left:1.5rem;transform:translateY(-50%)}.product-hotspots-popover--left{top:50%;right:1.5rem;transform:translateY(-50%)}.product-hotspots-popover--top{bottom:1.5rem;left:50%;transform:translate(-50%)}.product-hotspots-popover--bottom{top:1.5rem;left:50%;transform:translate(-50%)}.product-hotspots-popover-head{justify-content:space-between;align-items:flex-start;gap:.75rem;display:flex}.product-hotspots-popover-title{color:var(--gray-900);margin:0;font-size:.875rem;font-weight:600;line-height:1.25}.product-hotspots-popover-close{border-radius:var(--radius-sm);color:var(--gray-500);cursor:pointer;background:0 0;border:none;margin:-.25rem;padding:.25rem;line-height:0;position:relative}.product-hotspots-popover-close:after{content:"";inset:calc((100% - var(--tap-target)) / 2);position:absolute}@media (hover:hover){.product-hotspots-popover-close:hover{background:var(--gray-100);color:var(--gray-900)}}.product-hotspots-popover-close:focus-visible{outline:2px solid var(--sky-500);outline-offset:1px}.product-hotspots-popover-close-icon{width:1rem;height:1rem}.product-hotspots-popover-desc{color:var(--gray-600);margin:.5rem 0 0;font-size:.8125rem;line-height:1.6}.product-hotspots-sheet-root{z-index:50;position:fixed;inset:0}@media (width>=768px){.product-hotspots-sheet-root{display:none}}.product-hotspots-sheet-backdrop{-webkit-backdrop-filter:blur(4px);background:#0f172a99;position:absolute;inset:0}.product-hotspots-sheet-panel{background:var(--color-bg);text-align:left;border-radius:1rem 1rem 0 0;padding:1.25rem 1.25rem 2rem;position:absolute;bottom:0;left:0;right:0;box-shadow:0 -10px 40px -12px #02061773}.product-hotspots-sheet-grabber{background:var(--gray-200);border-radius:9999px;width:3rem;height:.375rem;margin:0 auto 1rem}.product-hotspots-sheet-title{color:var(--gray-900);margin:0;font-size:1rem;font-weight:600}.product-hotspots-sheet-desc{color:var(--gray-600);margin:.5rem 0 0;font-size:.875rem;line-height:1.6}.product-hotspots-sheet-close{width:100%;min-height:var(--tap-target);background:var(--gray-900);color:var(--color-text-inverse);cursor:pointer;border:none;border-radius:.5rem;justify-content:center;align-items:center;margin-top:1.25rem;font-size:.875rem;font-weight:500;display:inline-flex}@media (hover:hover){.product-hotspots-sheet-close:hover{background:var(--gray-800)}}.product-hotspots-sheet-close:focus-visible{outline:2px solid var(--sky-500);outline-offset:2px}.product-hotspots-calibrate-grid{z-index:5;pointer-events:none;background-image:linear-gradient(90deg,#38bdf859 1px,#0000 1px),linear-gradient(#38bdf859 1px,#0000 1px),linear-gradient(90deg,#38bdf82e 1px,#0000 1px),linear-gradient(#38bdf82e 1px,#0000 1px);background-size:25% 25%,25% 25%,5% 5%,5% 5%;position:absolute;inset:0}.product-hotspots-calibrate-cross{z-index:5;pointer-events:none;background-image:linear-gradient(90deg,#f472b68c 1px,#0000 1px),linear-gradient(#f472b68c 1px,#0000 1px);background-position:50%;background-size:50% 50%;position:absolute;inset:0}.product-hotspots-calibrate-cursor{z-index:20;pointer-events:none;border-radius:var(--radius-sm);color:var(--color-text-inverse);box-shadow:var(--shadow-md);background:#0f172ad9;padding:.25rem .5rem;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-size:.6875rem;position:absolute;transform:translate(.625rem,.625rem)}.product-hotspots-calibrate-label{pointer-events:none;white-space:nowrap;border-radius:var(--radius-sm);color:var(--color-text-inverse);box-shadow:var(--shadow-sm);background:#0f172ad9;padding:.125rem .375rem;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-size:.625rem;position:absolute;transform:translate(.625rem,-140%)}.product-hotspots-calibrate-label--dragging{background:var(--amber-500)}.product-hotspots-calibrate-toolbar{z-index:30;pointer-events:auto;color:var(--color-text-inverse);box-shadow:var(--shadow-lg);-webkit-backdrop-filter:blur(8px);background:#0f172ae6;border-radius:9999px;outline:1px solid #ffffff1a;align-items:center;gap:.5rem;padding:.5rem .75rem;font-size:.75rem;font-weight:500;display:flex;position:absolute;top:.75rem;left:50%;transform:translate(-50%)}.product-hotspots-calibrate-badge{letter-spacing:.05em;text-transform:uppercase;background:#d946efe6;border-radius:9999px;padding:.125rem .5rem;font-size:.625rem}.product-hotspots-calibrate-help{color:var(--gray-200);display:none}@media (width>=640px){.product-hotspots-calibrate-help{display:inline}}.product-hotspots-calibrate-file{color:#f0abfc;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace}.product-hotspots-calibrate-btn{color:var(--color-text-inverse);cursor:pointer;background:#ffffff1a;border:none;border-radius:9999px;padding:.25rem .75rem;font-size:.75rem;font-weight:500;transition:background .2s}@media (hover:hover){.product-hotspots-calibrate-btn:hover{background:#fff3}}.product-hotspots-calibrate-btn:focus-visible{outline:2px solid var(--sky-400)}@media (prefers-reduced-motion:reduce){.product-hotspots-dot-ping{display:none}}.hotspot-calibrate-dev-banner{z-index:9999;padding:.65rem clamp(.75rem, 3vw, 1.25rem) calc(.65rem + env(safe-area-inset-bottom,0px));pointer-events:none;position:fixed;bottom:0;left:0;right:0}.hotspot-calibrate-dev-banner-inner{pointer-events:auto;max-width:56rem;color:var(--slate-50);-webkit-backdrop-filter:blur(10px);background:#0f172af0;border-radius:.75rem;flex-wrap:wrap;align-items:center;gap:.65rem 1rem;margin:0 auto;padding:.65rem .85rem;display:flex;box-shadow:inset 0 0 0 1px #ffffff14,0 -8px 32px #02061773}.hotspot-calibrate-dev-banner-badge{letter-spacing:.12em;text-transform:uppercase;color:#fae8ff;background:#d946ef38;border-radius:9999px;flex-shrink:0;padding:.28rem .55rem;font-size:.65rem;font-weight:700}.hotspot-calibrate-dev-banner-text{color:#f8fafce0;flex:14rem;margin:0;font-size:.8125rem;line-height:1.45}.hotspot-calibrate-dev-banner-code{color:#f0abfc;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-size:.75rem}.hotspot-calibrate-dev-banner-actions{flex-shrink:0;gap:.45rem;display:flex}.hotspot-calibrate-dev-banner-btn{color:var(--slate-900);background:var(--slate-50);cursor:pointer;border:none;border-radius:.45rem;padding:.4rem .75rem;font-size:.75rem;font-weight:600}.hotspot-calibrate-dev-banner-btn:hover{background:var(--slate-200)}.hotspot-calibrate-dev-banner-btn--ghost{color:var(--slate-50);background:#ffffff1a}.hotspot-calibrate-dev-banner-btn--ghost:hover{background:#ffffff2e}