/* The photo and SVG share an exact 1536 × 1024 coordinate system. */
.pose-comparison{margin:0;min-width:0;background:#fff;border:1px solid var(--line);border-radius:8px;padding:18px;color:var(--ink)}
.comparison-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:16px;flex-wrap:wrap}
.comparison-heading .product-label{margin:0;font-size:9px}
.mode-badge{font-size:10px;color:var(--muted)}
.comparison-stage{position:relative;aspect-ratio:3/2;overflow:hidden;isolation:isolate;border-radius:4px;cursor:ew-resize;touch-action:pan-y;user-select:none;background:#e4e8ec}
.comparison-stage>img{display:block;width:100%;height:100%;object-fit:contain;pointer-events:none}
.analysis-layer{position:absolute;inset:0;clip-path:inset(0 0 0 var(--split));background:#002a4d30;pointer-events:none}
.pose-overlay{width:100%;height:100%;position:absolute;inset:0}
.skeleton-lines{stroke:#65e7ff;stroke-width:7;stroke-linejoin:round;stroke-linecap:round;filter:drop-shadow(0 1px 3px #003b6b)}
.skeleton-joints{fill:#fff;stroke:#003571;stroke-width:5;filter:drop-shadow(0 1px 3px #003b6b)}
.pose-observations>path{stroke:#fff;stroke-width:3}
.pose-observations rect{fill:#003571;stroke:#fff;stroke-width:2}
.pose-observations text,.pose-risks text{font-family:'DM Sans',Arial,sans-serif;font-size:29px;font-weight:600;fill:#fff;stroke:none}
.pose-risks{display:none}
.pose-risks>ellipse,.pose-risks>rect{stroke:#ffc06c;stroke-width:5;stroke-dasharray:13 8;fill:#fd770125}
.pose-risks>path{stroke:#ffb450;stroke-width:4}
.pose-risks g rect{fill:#713600;stroke:#ffe0b0;stroke-width:2}
[data-analysis="pose"] .pose-observations,[data-analysis="risks"] .pose-observations{display:none}
[data-analysis="risks"] .pose-risks{display:initial}
.comparison-labels{position:absolute;inset:12px 12px auto;display:flex;justify-content:space-between;gap:8px;pointer-events:none}
.comparison-labels span{font-size:9px;font-weight:600;padding:6px 9px;border-radius:3px;background:#fffef5eb;color:#153953;max-width:48%;line-height:1.4}
.comparison-labels span:last-child{background:#003571f2;color:#fff;text-align:right}
.comparison-divider{position:absolute;left:var(--split);top:0;bottom:0;width:2px;background:#fff;transform:translateX(-50%);box-shadow:0 0 0 1px #00357155;pointer-events:none}
.comparison-divider span{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:grid;place-items:center;width:43px;height:43px;border:2px solid #fff;border-radius:50%;background:#003571;color:white;font-size:23px;box-shadow:0 3px 15px #0003}
.comparison-controls{margin-top:16px}
.comparison-controls label{font-size:12px;display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;font-weight:550}
.comparison-controls output{font-variant-numeric:tabular-nums;font-size:11px;color:var(--muted)}
.comparison-controls input[type="range"]{display:block;width:100%;padding:0;height:26px;accent-color:var(--ink);cursor:ew-resize;background:transparent;border:0}
.comparison-presets{display:flex;justify-content:space-between;gap:8px;margin-top:5px}
.comparison-presets button{background:transparent;border:0;padding:7px 0;font-size:10px;color:var(--ink);cursor:pointer;text-decoration:underline;text-underline-offset:4px}
.pose-comparison figcaption{font-size:10px;color:var(--muted);line-height:1.6;border-top:1px solid var(--line);padding-top:12px;margin-top:12px}
.lab-preview .technology{grid-template-columns:minmax(225px,.75fr) minmax(0,1.25fr);gap:35px}
.lab-preview .technology h2{font-size:clamp(29px,3.6vw,45px)}
.lab-preview .technology .eyebrow{line-height:1.6}
@media(max-width:760px){.lab-preview .technology{grid-template-columns:1fr}.pose-comparison{padding:12px}.comparison-labels{inset:8px 8px auto}.comparison-labels span{font-size:8px;padding:5px 7px}.comparison-heading .product-label{font-size:8px}.mode-badge{font-size:9px}}
@media(max-width:760px){.lab-preview .technology>.pose-comparison{grid-row:1}.lab-preview .technology>.tech-copy{grid-row:2}}
.lab-preview .technology{padding-block:45px}
.comparison-reading{font-size:11px;line-height:1.6;margin:12px 0 0;color:var(--ink)}
/* Shared main-site and laboratory comparator. */
.pose-scene{position:absolute;inset:0}
.pose-scene[hidden]{display:none!important}
.pose-scene>img{display:block;width:100%;height:100%;object-fit:contain;pointer-events:none}
.skeleton-joints{stroke:#fff;stroke-width:2.5;filter:drop-shadow(0 1px 3px #001a39)}
.skeleton-lines{filter:drop-shadow(0 1px 3px #001a39)}
.risk-focus{stroke:#ffb450;stroke-width:4;stroke-dasharray:12 8;fill:#fd770125}
.scene-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;margin:0 0 14px}
.scene-tabs button,.analysis-switch button{display:flex;gap:8px;align-items:center;justify-content:center;border:1px solid var(--line);border-radius:4px;background:var(--paper);color:var(--ink);font:inherit;font-size:11px;padding:11px 8px;cursor:pointer;min-width:0}
.scene-tabs button>span{font-size:9px;color:var(--muted)}
.scene-tabs button[aria-selected="true"]{background:var(--ink);border-color:var(--ink);color:#fff}
.scene-tabs button[aria-selected="true"]>span{color:#ffffffbd}
.analysis-switch{display:flex;gap:7px;flex-wrap:wrap;border-top:1px solid var(--line);padding-top:12px;margin-top:12px}
.analysis-switch button{flex:1;font-size:10px;padding:9px 8px}
.analysis-switch button[aria-pressed="true"]{border-color:var(--ink);background:var(--soft);font-weight:650}
.technology.has-comparison{grid-template-columns:minmax(250px,.75fr) minmax(0,1.25fr);gap:45px}
@media(max-width:900px){.technology.has-comparison{grid-template-columns:1fr;gap:35px}.technology.has-comparison>.pose-comparison{grid-row:1}.technology.has-comparison>.tech-copy{grid-row:2}}
@media(max-width:650px){.scene-tabs button{font-size:10px;gap:5px;padding:12px 5px}.scene-tabs button>span{font-size:8px}.analysis-switch button{font-size:9px}}

/* A skeleton is shown only after its corresponding photograph has decoded. */
.pose-scene[data-image-ready="false"] .analysis-layer{visibility:hidden}
.scene-status{display:flex;align-items:center;gap:12px;min-height:0;font-size:13px;color:var(--ink);flex-wrap:wrap}
.scene-status:has([data-image-status]:not(:empty)){padding:12px 0}
.scene-status button{background:var(--ink);color:white;border:0;padding:8px 12px;cursor:pointer}
.scene-status button[hidden]{display:none}
.scene-status button:focus-visible{outline:3px solid var(--accent);outline-offset:3px}